diff --git a/app/assets/javascripts/admins/disciplines/index.js b/app/assets/javascripts/admins/disciplines/index.js
index e5153516a..268dfb375 100644
--- a/app/assets/javascripts/admins/disciplines/index.js
+++ b/app/assets/javascripts/admins/disciplines/index.js
@@ -120,5 +120,19 @@ $(document).on('turbolinks:load', function() {
               });
           }
       });
+
+      // ------------ 上移/下移 -------------
+      $('.discipline-list-container').on('click', ".move-action", function () {
+          var $doAction = $(this);
+
+          var disciplineId = $doAction.data('id');
+          var opr = $doAction.data('opr');
+          $.ajax({
+              url: '/admins/disciplines/' + disciplineId + '/adjust_position',
+              method: 'POST',
+              dataType: 'script',
+              data: {opr: opr}
+          });
+      });
   }
 });
\ No newline at end of file
diff --git a/app/assets/javascripts/admins/salesman_customers/index.js b/app/assets/javascripts/admins/salesman_customers/index.js
index 607e01f2e..f6ed67f12 100644
--- a/app/assets/javascripts/admins/salesman_customers/index.js
+++ b/app/assets/javascripts/admins/salesman_customers/index.js
@@ -58,7 +58,7 @@ $(document).on('turbolinks:load', function() {
                         $addMemberModal.modal('hide');
 
                         setTimeout(function(){
-                            window.location.reload();
+                            listForm();
                         }, 500);
                     },
                     error: function(res){
@@ -70,5 +70,13 @@ $(document).on('turbolinks:load', function() {
                 $addMemberModal.modal('hide');
             }
         });
+
+
+        var listForm = function(){
+            $.ajax({
+                url: '/admins/salesman_customers?salesman_id='+ $salesmanIdInput.data("salesman-id"),
+                dataType: "script"
+            });
+        };
     }
 });
\ No newline at end of file
diff --git a/app/assets/javascripts/admins/sub_disciplines/index.js b/app/assets/javascripts/admins/sub_disciplines/index.js
index ad7f9fe87..a0ca6be56 100644
--- a/app/assets/javascripts/admins/sub_disciplines/index.js
+++ b/app/assets/javascripts/admins/sub_disciplines/index.js
@@ -72,5 +72,18 @@ $(document).on('turbolinks:load', function () {
                 data: json
             });
         });
+        // ------------ 上移/下移 -------------
+        $('.sub-discipline-list-container').on('click', ".move-action", function () {
+            var $doAction = $(this);
+
+            var objectId = $doAction.data('id');
+            var opr = $doAction.data('opr');
+            $.ajax({
+                url: '/admins/sub_disciplines/' + objectId + '/adjust_position',
+                method: 'POST',
+                dataType: 'script',
+                data: {opr: opr}
+            });
+        });
     }
 });
\ No newline at end of file
diff --git a/app/assets/javascripts/admins/tag_disciplines/index.js b/app/assets/javascripts/admins/tag_disciplines/index.js
index 3783f691c..cf73de517 100644
--- a/app/assets/javascripts/admins/tag_disciplines/index.js
+++ b/app/assets/javascripts/admins/tag_disciplines/index.js
@@ -72,5 +72,19 @@ $(document).on('turbolinks:load', function () {
                 data: json
             });
         });
+
+        // ------------ 上移/下移 -------------
+        $('.tag-discipline-list-container').on('click', ".move-action", function () {
+            var $doAction = $(this);
+
+            var objectId = $doAction.data('id');
+            var opr = $doAction.data('opr');
+            $.ajax({
+                url: '/admins/tag_disciplines/' + objectId + '/adjust_position',
+                method: 'POST',
+                dataType: 'script',
+                data: {opr: opr}
+            });
+        });
     }
 });
\ No newline at end of file
diff --git a/app/controllers/admins/disciplines_controller.rb b/app/controllers/admins/disciplines_controller.rb
index 2b5be595e..598ab7386 100644
--- a/app/controllers/admins/disciplines_controller.rb
+++ b/app/controllers/admins/disciplines_controller.rb
@@ -7,7 +7,7 @@ class Admins::DisciplinesController < Admins::BaseController
   def create
     name = params[:name].to_s.strip
     return render_error('名称重复') if Discipline.where(name: name).exists?
-    Discipline.create!(name: name)
+    Discipline.create!(name: name, position: Discipline.all.pluck(:position).max + 1)
     render_ok
   end
 
@@ -39,7 +39,31 @@ class Admins::DisciplinesController < Admins::BaseController
 
   def destroy
     @discipline_id = params[:id]
-    current_discipline.destroy!
+    ActiveRecord::Base.transaction do
+      Discipline.where("position > #{current_discipline.position}").update_all("position=position-1")
+      current_discipline.destroy!
+    end
+  end
+
+  def adjust_position
+    max_position = Discipline.all.pluck(:position).max
+    opr = params[:opr] || "down"
+    if (params[:opr] == "up" && current_discipline.position == 1) || (params[:opr] == "down" && current_discipline.position == max_position)
+      @message = "超出范围"
+    else
+      ActiveRecord::Base.transaction do
+        if opr == "up"
+          Discipline.find_by("position = #{current_discipline.position - 1}")&.update!(position: current_discipline.position)
+          current_discipline.update!(position: current_discipline.position - 1)
+        else
+          Discipline.find_by("position = #{current_discipline.position + 1}")&.update!(position: current_discipline.position)
+          current_discipline.update!(position: current_discipline.position + 1)
+        end
+      end
+    end
+    @disciplines = Discipline.all
+  rescue Exception => e
+    @message = e.message
   end
 
   private
diff --git a/app/controllers/admins/salesman_channels_controller.rb b/app/controllers/admins/salesman_channels_controller.rb
index 385503d3a..44928253c 100644
--- a/app/controllers/admins/salesman_channels_controller.rb
+++ b/app/controllers/admins/salesman_channels_controller.rb
@@ -15,7 +15,7 @@ class Admins::SalesmanChannelsController < Admins::BaseController
     school_ids = params[:school_ids] - channel_ids
     school_ids.each do |school_id|
       school = School.find_by(id: school_id)
-      next if school.blank?
+      next if school.blank? || @salesman.salesman_channels.where(school_id: school.id).exists?
       @salesman.salesman_channels.create!(school_id: school.id)
     end
     render_ok
diff --git a/app/controllers/admins/salesman_customers_controller.rb b/app/controllers/admins/salesman_customers_controller.rb
index 3fa63f147..15645fe6f 100644
--- a/app/controllers/admins/salesman_customers_controller.rb
+++ b/app/controllers/admins/salesman_customers_controller.rb
@@ -10,7 +10,7 @@ class Admins::SalesmanCustomersController < Admins::BaseController
     user_ids = params[:user_ids] - customer_ids
     user_ids.each do |user_id|
       user = UserExtension.find_by(user_id: user_id)
-      next if user.blank?
+      next if user.blank? || @salesman.salesman_customers.where(user_id: user.user_id).exists?
       @salesman.salesman_customers.create!(user_id: user.user_id, school_id: user.school_id)
     end
     render_ok
diff --git a/app/controllers/admins/sub_disciplines_controller.rb b/app/controllers/admins/sub_disciplines_controller.rb
index ac6eb6419..a60f497e5 100644
--- a/app/controllers/admins/sub_disciplines_controller.rb
+++ b/app/controllers/admins/sub_disciplines_controller.rb
@@ -9,7 +9,7 @@ class Admins::SubDisciplinesController < Admins::BaseController
     name = params[:name].to_s.strip
     return render_error('名称不能为空') if name.blank?
     return render_error('名称重复') if current_discipline.sub_disciplines.where(name: name).exists?
-    SubDiscipline.create!(name: name, discipline_id: current_discipline.id)
+    SubDiscipline.create!(name: name, discipline_id: current_discipline.id, position: current_discipline.sub_disciplines.pluck(:position).max + 1)
     render_ok
   end
 
@@ -38,9 +38,36 @@ class Admins::SubDisciplinesController < Admins::BaseController
 
   def destroy
     @sub_discipline_id = params[:id]
-    current_sub_discipline.destroy!
+    ActiveRecord::Base.transaction do
+      discipline = current_sub_discipline.discipline
+      discipline.sub_disciplines.where("position > #{current_sub_discipline.position}").update_all("position=position-1")
+      current_sub_discipline.destroy!
+    end
   end
 
+  def adjust_position
+    discipline = current_sub_discipline.discipline
+    max_position = discipline.sub_disciplines.pluck(:position).max
+    opr = params[:opr] || "down"
+    if (params[:opr] == "up" && current_sub_discipline.position == 1) || (params[:opr] == "down" && current_sub_discipline.position == max_position)
+      @message = "超出范围"
+    else
+      ActiveRecord::Base.transaction do
+        if opr == "up"
+          discipline.sub_disciplines.find_by("position = #{current_sub_discipline.position - 1}")&.update!(position: current_sub_discipline.position)
+          current_sub_discipline.update!(position: current_sub_discipline.position - 1)
+        else
+          discipline.sub_disciplines.find_by("position = #{current_sub_discipline.position + 1}")&.update!(position: current_sub_discipline.position)
+          current_sub_discipline.update!(position: current_sub_discipline.position + 1)
+        end
+      end
+    end
+    @sub_disciplines = discipline&.sub_disciplines
+  rescue Exception => e
+    @message = e.message
+  end
+
+
   private
 
   def current_sub_discipline
diff --git a/app/controllers/admins/tag_disciplines_controller.rb b/app/controllers/admins/tag_disciplines_controller.rb
index 0433e8326..c10f63884 100644
--- a/app/controllers/admins/tag_disciplines_controller.rb
+++ b/app/controllers/admins/tag_disciplines_controller.rb
@@ -8,7 +8,8 @@ class Admins::TagDisciplinesController < Admins::BaseController
   def create
     name = params[:name].to_s.strip
     return render_error('名称重复') if current_sub_discipline.tag_disciplines.where(name: name).exists?
-    TagDiscipline.create!(name: name, sub_discipline_id: current_sub_discipline.id, user_id: current_user.id)
+    TagDiscipline.create!(name: name, sub_discipline_id: current_sub_discipline.id, user_id: current_user.id,
+                          position: current_sub_discipline.tag_disciplines.pluck(:position).max + 1)
     render_ok
   end
 
@@ -32,9 +33,36 @@ class Admins::TagDisciplinesController < Admins::BaseController
 
   def destroy
     @tag_discipline_id = params[:id]
-    current_tag_discipline.destroy!
+    ActiveRecord::Base.transaction do
+      sub_discipline = current_tag_discipline.sub_discipline
+      sub_discipline.tag_disciplines.where("position > #{current_tag_discipline.position}").update_all("position=position-1")
+      current_tag_discipline.destroy!
+    end
+  end
+
+  def adjust_position
+    sub_discipline = current_tag_discipline.sub_discipline
+    max_position = sub_discipline.tag_disciplines.pluck(:position).max
+    opr = params[:opr] || "down"
+    if (params[:opr] == "up" && current_tag_discipline.position == 1) || (params[:opr] == "down" && current_tag_discipline.position == max_position)
+      @message = "超出范围"
+    else
+      ActiveRecord::Base.transaction do
+        if opr == "up"
+          sub_discipline.tag_disciplines.find_by("position = #{current_tag_discipline.position - 1}")&.update!(position: current_tag_discipline.position)
+          current_tag_discipline.update!(position: current_tag_discipline.position - 1)
+        else
+          sub_discipline.tag_disciplines.find_by("position = #{current_tag_discipline.position + 1}")&.update!(position: current_tag_discipline.position)
+          current_tag_discipline.update!(position: current_tag_discipline.position + 1)
+        end
+      end
+    end
+    @tag_disciplines = sub_discipline&.tag_disciplines
+  rescue Exception => e
+    @message = e.message
   end
 
+
   private
 
   def current_sub_discipline
diff --git a/app/controllers/tag_disciplines_controller.rb b/app/controllers/tag_disciplines_controller.rb
index b161a7af8..c80071824 100644
--- a/app/controllers/tag_disciplines_controller.rb
+++ b/app/controllers/tag_disciplines_controller.rb
@@ -4,7 +4,8 @@ class TagDisciplinesController < ApplicationController
   def create
     sub_discipline = SubDiscipline.find_by!(id: params[:sub_discipline_id])
     tip_exception("重复的知识点") if sub_discipline.tag_disciplines.exists?(name: params[:name].to_s.strip)
-    tag_discipline = TagDiscipline.create!(name: params[:name].to_s.strip, sub_discipline: sub_discipline, user_id: current_user.id)
+    tag_discipline = TagDiscipline.create!(name: params[:name].to_s.strip, sub_discipline: sub_discipline, user_id: current_user.id,
+                                           position: sub_discipline.tag_disciplines.pluck(:position).max + 1)
     render_ok({tag_discipline_id: tag_discipline.id})
   end
 end
\ No newline at end of file
diff --git a/app/models/discipline.rb b/app/models/discipline.rb
index e2761bfe2..06ecf825f 100644
--- a/app/models/discipline.rb
+++ b/app/models/discipline.rb
@@ -1,5 +1,7 @@
 class Discipline < ApplicationRecord
-  has_many :sub_disciplines, dependent: :destroy
+  default_scope { order(position: :asc) }
+
+  has_many :sub_disciplines, -> { order("sub_disciplines.position ASC") }, dependent: :destroy
 
   has_many :shixun_sub_disciplines, -> { where("shixun = 1") }, class_name: "SubDiscipline"
   has_many :subject_sub_disciplines, -> { where("subject = 1") }, class_name: "SubDiscipline"
diff --git a/app/models/salesman_customer.rb b/app/models/salesman_customer.rb
index c5e84650b..07f2ee83c 100644
--- a/app/models/salesman_customer.rb
+++ b/app/models/salesman_customer.rb
@@ -1,6 +1,6 @@
 class SalesmanCustomer < ApplicationRecord
   belongs_to :salesman, :touch => true, counter_cache: true
-  belongs_to :school
+  belongs_to :school, optional: true
   belongs_to :user
 
   def name
@@ -8,7 +8,7 @@ class SalesmanCustomer < ApplicationRecord
   end
 
   def school_name
-    school.name
+    school&.name
   end
 
   def courses_count
diff --git a/app/models/sub_discipline.rb b/app/models/sub_discipline.rb
index db7ca9fc8..57181124c 100644
--- a/app/models/sub_discipline.rb
+++ b/app/models/sub_discipline.rb
@@ -1,6 +1,6 @@
 class SubDiscipline < ApplicationRecord
   belongs_to :discipline
-  has_many :tag_disciplines, dependent: :destroy
+  has_many :tag_disciplines, -> { order("tag_disciplines.position ASC") }, dependent: :destroy
   has_many :sub_discipline_containers, dependent: :destroy
   has_one :hack
 
diff --git a/app/services/admins/import_discipline_service.rb b/app/services/admins/import_discipline_service.rb
index bd284b6af..37cb5b7e5 100644
--- a/app/services/admins/import_discipline_service.rb
+++ b/app/services/admins/import_discipline_service.rb
@@ -29,14 +29,14 @@ class Admins::ImportDisciplineService < ApplicationService
     return unless discipline_name.present?
     discipline = Discipline.find_by(name: discipline_name)
     if discipline.blank?
-      discipline = Discipline.create!(name: discipline_name)
+      discipline = Discipline.create!(name: discipline_name, position: Discipline.all.pluck(:position).max + 1)
       count += 1
     end
 
     if sub_discipline_name.present?
       sub_discipline = SubDiscipline.find_by(name: discipline_name, discipline: discipline)
       if sub_discipline.blank?
-        SubDiscipline.create!(name: sub_discipline_name, discipline: discipline)
+        SubDiscipline.create!(name: sub_discipline_name, discipline: discipline, position: discipline.sub_disciplines.pluck(:position).max + 1)
         count += 1
       end
     end
diff --git a/app/views/admins/disciplines/adjust_position.js.erb b/app/views/admins/disciplines/adjust_position.js.erb
new file mode 100644
index 000000000..a0928056e
--- /dev/null
+++ b/app/views/admins/disciplines/adjust_position.js.erb
@@ -0,0 +1,5 @@
+<% if @message.present? %>
+$.notify({ message: "<%= @message %>" });
+<% else %>
+$(".discipline-list-container").html("<%= j(render :partial => 'admins/disciplines/shared/list') %>");
+<% end %>
\ No newline at end of file
diff --git a/app/views/admins/disciplines/shared/_list.html.erb b/app/views/admins/disciplines/shared/_list.html.erb
index 343ff4851..38cbe8c9c 100644
--- a/app/views/admins/disciplines/shared/_list.html.erb
+++ b/app/views/admins/disciplines/shared/_list.html.erb
@@ -1,3 +1,4 @@
+<% max_position = @disciplines.pluck(:position).max %>
 <table class="table table-hover text-center discipline-list-table">
   <thead class="thead-light">
   <tr>
@@ -11,9 +12,9 @@
   </thead>
   <tbody>
   <% if @disciplines.present? %>
-    <% @disciplines.each_with_index do |discipline, index| %>
+    <% @disciplines.each do |discipline| %>
       <tr class="discipline-item discipline-item-<%= discipline.id %>">
-        <td><%= index + 1 %></td>
+        <td><%= discipline.position %></td>
         <td class="text-left">
           <span><%= link_to discipline.name, admins_sub_disciplines_path(discipline_id: discipline), :title => discipline.name %></span>
         </td>
@@ -21,6 +22,9 @@
         <td><%= check_box_tag :shixun,!discipline.shixun,discipline.shixun,remote:true,data:{id:discipline.id},class:"discipline-source-form" %></td>
         <td><%= check_box_tag :question,!discipline.question,discipline.question,remote:true,data:{id:discipline.id},class:"discipline-source-form" %></td>
         <td>
+          <%= javascript_void_link('上移', class: 'move-action', data: { id: discipline.id, opr: "up" }, style: discipline.position == 1 ? 'display:none' : '') %>
+          <%= javascript_void_link('下移', class: 'move-action', data: { id: discipline.id, opr: "down" }, style: discipline.position == max_position ? 'display:none' : '') %>
+
           <%= link_to '编辑', edit_admins_discipline_path(discipline), remote: true, class: 'action' %>
           <%= delete_link '删除', admins_discipline_path(discipline, element: ".discipline-item-#{discipline.id}"), class: 'delete-discipline-action' %>
         </td>
diff --git a/app/views/admins/salesman_customers/index.js.erb b/app/views/admins/salesman_customers/index.js.erb
new file mode 100644
index 000000000..ed90f5394
--- /dev/null
+++ b/app/views/admins/salesman_customers/index.js.erb
@@ -0,0 +1 @@
+  $(".salesman-customer-list-container").html("<%= j(render partial: 'admins/salesman_customers/shared/list') %>")
\ No newline at end of file
diff --git a/app/views/admins/sub_disciplines/adjust_position.js.erb b/app/views/admins/sub_disciplines/adjust_position.js.erb
new file mode 100644
index 000000000..0dae991c1
--- /dev/null
+++ b/app/views/admins/sub_disciplines/adjust_position.js.erb
@@ -0,0 +1,5 @@
+<% if @message.present? %>
+$.notify({ message: "<%= @message %>" });
+<% else %>
+$(".sub-discipline-list-container").html("<%= j(render :partial => 'admins/sub_disciplines/shared/list') %>");
+<% end %>
\ No newline at end of file
diff --git a/app/views/admins/sub_disciplines/shared/_list.html.erb b/app/views/admins/sub_disciplines/shared/_list.html.erb
index a56c856f2..cd0b02f88 100644
--- a/app/views/admins/sub_disciplines/shared/_list.html.erb
+++ b/app/views/admins/sub_disciplines/shared/_list.html.erb
@@ -1,3 +1,4 @@
+<% max_position = @sub_disciplines.pluck(:position).max %>
 <table class="table table-hover text-center sub-discipline-list-table">
   <thead class="thead-light">
   <tr>
@@ -11,9 +12,9 @@
   </thead>
   <tbody>
   <% if @sub_disciplines.present? %>
-    <% @sub_disciplines.each_with_index do |sub, index| %>
+    <% @sub_disciplines.each do |sub| %>
       <tr class="sub-discipline-item sub-discipline-item-<%= sub.id %>">
-        <td><%= index + 1 %></td>
+        <td><%= sub.position %></td>
         <td class="text-left">
           <span><%= link_to sub.name, admins_tag_disciplines_path(sub_discipline_id: sub), :title => sub.name %></span>
         </td>
@@ -21,6 +22,9 @@
         <td><%= check_box_tag :shixun,!sub.shixun,sub.shixun,disabled:!sub.discipline&.shixun,remote:true,data:{id:sub.id},class:"sub-discipline-source-form" %></td>
         <td><%= check_box_tag :question,!sub.question,sub.question,disabled:!sub.discipline&.question,remote:true,data:{id:sub.id},class:"sub-discipline-source-form" %></td>
         <td>
+          <%= javascript_void_link('上移', class: 'move-action', data: { id: sub.id, opr: "up" }, style: sub.position == 1 ? 'display:none' : '') %>
+          <%= javascript_void_link('下移', class: 'move-action', data: { id: sub.id, opr: "down" }, style: sub.position == max_position ? 'display:none' : '') %>
+
           <%= link_to '编辑', edit_admins_sub_discipline_path(sub), remote: true, class: 'action' %>
           <%= delete_link '删除', admins_sub_discipline_path(sub, element: ".sub-discipline-item-#{sub.id}"), class: 'delete-sub-discipline-action' %>
         </td>
diff --git a/app/views/admins/tag_disciplines/adjust_position.js.erb b/app/views/admins/tag_disciplines/adjust_position.js.erb
new file mode 100644
index 000000000..32e066698
--- /dev/null
+++ b/app/views/admins/tag_disciplines/adjust_position.js.erb
@@ -0,0 +1,5 @@
+<% if @message.present? %>
+$.notify({ message: "<%= @message %>" });
+<% else %>
+$(".tag-discipline-list-container").html("<%= j(render :partial => 'admins/tag_disciplines/shared/list') %>");
+<% end %>
\ No newline at end of file
diff --git a/app/views/admins/tag_disciplines/shared/_list.html.erb b/app/views/admins/tag_disciplines/shared/_list.html.erb
index 2c91d88fa..59420c42c 100644
--- a/app/views/admins/tag_disciplines/shared/_list.html.erb
+++ b/app/views/admins/tag_disciplines/shared/_list.html.erb
@@ -1,3 +1,4 @@
+<% max_position = @tag_disciplines.pluck(:position).max %>
 <table class="table table-hover text-center tag-discipline-list-table">
   <thead class="thead-light">
   <tr>
@@ -12,9 +13,9 @@
   </thead>
   <tbody>
   <% if @tag_disciplines.present? %>
-    <% @tag_disciplines.each_with_index do |tag, index| %>
+    <% @tag_disciplines.each do |tag| %>
       <tr class="tag-discipline-item tag-discipline-item-<%= tag.id %>">
-        <td><%= index + 1 %></td>
+        <td><%= tag.position %></td>
         <td class="text-left"><%= tag.name %></td>
         <td>
           <% if tag.user.present? %>
@@ -36,6 +37,9 @@
           <%= check_box_tag :question,!tag.question,tag.question,disabled:disabled,remote:true,data:{id:tag.id},class:"tag-discipline-source-form" %>
         </td>
         <td>
+          <%= javascript_void_link('上移', class: 'move-action', data: { id: tag.id, opr: "up" }, style: tag.position == 1 ? 'display:none' : '') %>
+          <%= javascript_void_link('下移', class: 'move-action', data: { id: tag.id, opr: "down" }, style: tag.position == max_position ? 'display:none' : '') %>
+
           <%= link_to '编辑', edit_admins_tag_discipline_path(tag), remote: true, class: 'action' %>
           <%= delete_link '删除', admins_tag_discipline_path(tag, element: ".tag-discipline-item-#{tag.id}"), class: 'delete-tag-discipline-action' %>
         </td>
diff --git a/config/routes.rb b/config/routes.rb
index 6cf70ac15..33576e1d0 100644
--- a/config/routes.rb
+++ b/config/routes.rb
@@ -1355,9 +1355,15 @@ Rails.application.routes.draw do
 
     resources :projects, only: [:index, :destroy]
 
-    resources :disciplines, only: [:index, :create, :edit, :update, :destroy]
-    resources :sub_disciplines, only: [:index, :create, :edit, :update, :destroy]
-    resources :tag_disciplines, only: [:index, :create, :edit, :update, :destroy]
+    resources :disciplines, only: [:index, :create, :edit, :update, :destroy] do
+      post :adjust_position, on: :member
+    end
+    resources :sub_disciplines, only: [:index, :create, :edit, :update, :destroy] do
+      post :adjust_position, on: :member
+    end
+    resources :tag_disciplines, only: [:index, :create, :edit, :update, :destroy] do
+      post :adjust_position, on: :member
+    end
 
     resources :repertoires, only: [:index, :create, :edit, :update, :destroy]
     resources :sub_repertoires, only: [:index, :create, :edit, :update, :destroy]
diff --git a/db/migrate/20200225063751_add_position_to_discipline.rb b/db/migrate/20200225063751_add_position_to_discipline.rb
new file mode 100644
index 000000000..5d8a22204
--- /dev/null
+++ b/db/migrate/20200225063751_add_position_to_discipline.rb
@@ -0,0 +1,7 @@
+class AddPositionToDiscipline < ActiveRecord::Migration[5.2]
+  def change
+    add_column :disciplines, :position, :integer, default: 0
+    add_column :sub_disciplines, :position, :integer, default: 0
+    add_column :tag_disciplines, :position, :integer, default: 0
+  end
+end
diff --git a/db/migrate/20200225063932_migrate_discipline_position.rb b/db/migrate/20200225063932_migrate_discipline_position.rb
new file mode 100644
index 000000000..4061cf943
--- /dev/null
+++ b/db/migrate/20200225063932_migrate_discipline_position.rb
@@ -0,0 +1,15 @@
+class MigrateDisciplinePosition < ActiveRecord::Migration[5.2]
+  def change
+    Discipline.all.each_with_index do |discipline, i|
+      discipline.update_column("position", i + 1)
+
+      discipline.sub_disciplines.each_with_index do |sub, j|
+        sub.update_column("position", j + 1)
+
+        sub.tag_disciplines.each_with_index do |tag, k|
+          tag.update_column("position", k + 1)
+        end
+      end
+    end
+  end
+end
diff --git a/db/migrate/20200225092846_add_uniq_index_to_salesman_channel.rb b/db/migrate/20200225092846_add_uniq_index_to_salesman_channel.rb
new file mode 100644
index 000000000..96540d64e
--- /dev/null
+++ b/db/migrate/20200225092846_add_uniq_index_to_salesman_channel.rb
@@ -0,0 +1,10 @@
+class AddUniqIndexToSalesmanChannel < ActiveRecord::Migration[5.2]
+  def change
+    sql = %Q(delete from salesman_channels where (salesman_id, school_id) in
+            (select * from (select salesman_id, school_id from salesman_channels group by salesman_id, school_id having count(*) > 1) a)
+            and id not in (select * from (select min(id) from salesman_channels group by salesman_id, school_id having count(*) > 1 order by id) b))
+    ActiveRecord::Base.connection.execute sql
+
+    add_index :salesman_channels, [:salesman_id, :school_id], unique: true
+  end
+end
diff --git a/db/migrate/20200225093944_add_uniq_index_to_salesman_customer.rb b/db/migrate/20200225093944_add_uniq_index_to_salesman_customer.rb
new file mode 100644
index 000000000..a0067a45f
--- /dev/null
+++ b/db/migrate/20200225093944_add_uniq_index_to_salesman_customer.rb
@@ -0,0 +1,10 @@
+class AddUniqIndexToSalesmanCustomer < ActiveRecord::Migration[5.2]
+  def change
+    sql = %Q(delete from salesman_customers where (salesman_id, user_id) in
+            (select * from (select salesman_id, user_id from salesman_customers group by salesman_id, user_id having count(*) > 1) a)
+            and id not in (select * from (select min(id) from salesman_customers group by salesman_id, user_id having count(*) > 1 order by id) b))
+    ActiveRecord::Base.connection.execute sql
+
+    add_index :salesman_customers, [:salesman_id, :user_id], unique: true
+  end
+end
diff --git a/public/assets/.sprockets-manifest-7657344e1d61e579de6a996a4498d7a2.json b/public/assets/.sprockets-manifest-7657344e1d61e579de6a996a4498d7a2.json
index 6fb54a317..8964ac1f1 100644
--- a/public/assets/.sprockets-manifest-7657344e1d61e579de6a996a4498d7a2.json
+++ b/public/assets/.sprockets-manifest-7657344e1d61e579de6a996a4498d7a2.json
@@ -1 +1 @@
-{"files":{"admin-1bd781fc5959b4f0e8879fa92afc5cec47e2d1a9b79cad9e55177fc1197a0e5b.js":{"logical_path":"admin.js","mtime":"2019-11-27T19:06:45+08:00","size":4594770,"digest":"1bd781fc5959b4f0e8879fa92afc5cec47e2d1a9b79cad9e55177fc1197a0e5b","integrity":"sha256-G9eB/FlZtPDoh5+pKvxc7Efi0am3nK2eVRd/wRl6Dls="},"admin-e78dd8b2041c26973b3851180e413539c07042575e336147194b5f2a1f7fa09c.css":{"logical_path":"admin.css","mtime":"2019-11-21T17:49:31+08:00","size":817848,"digest":"e78dd8b2041c26973b3851180e413539c07042575e336147194b5f2a1f7fa09c","integrity":"sha256-543YsgQcJpc7OFEYDkE1OcBwQldeM2FHGUtfKh9/oJw="},"font-awesome/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot":{"logical_path":"font-awesome/fontawesome-webfont.eot","mtime":"2019-08-22T14:54:27+08:00","size":165742,"digest":"7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979","integrity":"sha256-e/yrbbmdXPvxcFygU23ceFhUMsxfpBu9etDwCQM7KXk="},"font-awesome/fontawesome-webfont-2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe.woff2":{"logical_path":"font-awesome/fontawesome-webfont.woff2","mtime":"2019-08-22T14:54:27+08:00","size":77160,"digest":"2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe","integrity":"sha256-Kt78vAQefRj88tQXh53FoJmXqmTWdbejxLbOM9oT8/4="},"font-awesome/fontawesome-webfont-ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07.woff":{"logical_path":"font-awesome/fontawesome-webfont.woff","mtime":"2019-08-22T14:54:27+08:00","size":98024,"digest":"ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07","integrity":"sha256-ugxZ3rVFD1y0Gz+TYJ7i0NmVQVh33foiPoqKdTNHTwc="},"font-awesome/fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf":{"logical_path":"font-awesome/fontawesome-webfont.ttf","mtime":"2019-08-22T14:54:27+08:00","size":165548,"digest":"aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8","integrity":"sha256-qljzPyOaD7AvXHpsRcBD16msmgkzNYBmlOzW1O3A1qg="},"font-awesome/fontawesome-webfont-ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4.svg":{"logical_path":"font-awesome/fontawesome-webfont.svg","mtime":"2019-08-22T14:54:27+08:00","size":444379,"digest":"ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4","integrity":"sha256-rWFXkmwWIrpOHQPUePFUE2hSS/xG9R5C/g2UX37zI+Q="},"college-431d908264782ef54e90202095d4cf397c586f74d2b7879684348dc8b53d2cd2.js":{"logical_path":"college.js","mtime":"2020-01-07T14:59:22+08:00","size":3570046,"digest":"431d908264782ef54e90202095d4cf397c586f74d2b7879684348dc8b53d2cd2","integrity":"sha256-Qx2QgmR4LvVOkCAgldTPOXxYb3TSt4eWhDSNyLU9LNI="},"college-eb35b6573dea2a069abd5acb0211940c2165fa21da333555fa859ed155b3ca1f.css":{"logical_path":"college.css","mtime":"2019-11-20T17:50:44+08:00","size":565772,"digest":"eb35b6573dea2a069abd5acb0211940c2165fa21da333555fa859ed155b3ca1f","integrity":"sha256-6zW2Vz3qKgaavVrLAhGUDCFl+iHaMzVV+oWe0VWzyh8="},"cooperative-4f2218bb223392ea4332e9ace5a748baccd4fe66d4b5cc3b5574f97a425203ec.js":{"logical_path":"cooperative.js","mtime":"2020-01-07T14:59:22+08:00","size":4478060,"digest":"4f2218bb223392ea4332e9ace5a748baccd4fe66d4b5cc3b5574f97a425203ec","integrity":"sha256-TyIYuyIzkupDMums5adIuszU/mbUtcw7VXT5ekJSA+w="},"cooperative-9244063fa63cd29c9c3b074af565be75a130cfb31741b2f5252fe68a1f5c13c5.css":{"logical_path":"cooperative.css","mtime":"2019-11-20T17:50:44+08:00","size":799850,"digest":"9244063fa63cd29c9c3b074af565be75a130cfb31741b2f5252fe68a1f5c13c5","integrity":"sha256-kkQGP6Y80pycOwdK9WW+daEwz7MXQbL1JS/mih9cE8U="},"logo-7ff112568709bf97f9898fe87249b7a8f200ff1f48d537d85af87215f1870423.png":{"logical_path":"logo.png","mtime":"2019-12-10T16:46:58+08:00","size":2816,"digest":"7ff112568709bf97f9898fe87249b7a8f200ff1f48d537d85af87215f1870423","integrity":"sha256-f/ESVocJv5f5iY/ockm3qPIA/x9I1TfYWvhyFfGHBCM="},"application-d44f4301c7dfbe07bcb2788d7c006c22c184ae6b7016c09f7911b4962aacd767.js":{"logical_path":"application.js","mtime":"2020-01-07T14:59:22+08:00","size":615525,"digest":"d44f4301c7dfbe07bcb2788d7c006c22c184ae6b7016c09f7911b4962aacd767","integrity":"sha256-1E9DAcffvge8sniNfABsIsGErmtwFsCfeRG0liqs12c="},"application-2bf79ac2818959eb18d4df720a0cd0721b3b2385dd4565d635851fc41e192975.css":{"logical_path":"application.css","mtime":"2019-09-09T09:26:59+08:00","size":401033,"digest":"2bf79ac2818959eb18d4df720a0cd0721b3b2385dd4565d635851fc41e192975","integrity":"sha256-K/eawoGJWesY1N9yCgzQchs7I4XdRWXWNYUfxB4ZKXU="},"admin-83797d03d53c38db8e4751348516f8b7c55842cf8899066b86b3b2e6b6b1c8ad.js":{"logical_path":"admin.js","mtime":"2019-12-02T10:11:32+08:00","size":4583649,"digest":"83797d03d53c38db8e4751348516f8b7c55842cf8899066b86b3b2e6b6b1c8ad","integrity":"sha256-g3l9A9U8ONuOR1E0hRb4t8VYQs+ImQZrhrOy5raxyK0="},"admin-1512839e7eaa2136bdf9b238e3710004f8b90f2b74300c8ae7d9f9b25dddf077.css":{"logical_path":"admin.css","mtime":"2019-11-27T15:52:07+08:00","size":868584,"digest":"1512839e7eaa2136bdf9b238e3710004f8b90f2b74300c8ae7d9f9b25dddf077","integrity":"sha256-FRKDnn6qITa9+bI443EABPi5Dyt0MAyK59n5sl3d8Hc="},"college-1e70702e2d864fb4d5f57841bfa5937e31c7c059e6cd672a07f0b4b20740f607.js":{"logical_path":"college.js","mtime":"2019-11-20T16:00:49+08:00","size":3569292,"digest":"1e70702e2d864fb4d5f57841bfa5937e31c7c059e6cd672a07f0b4b20740f607","integrity":"sha256-HnBwLi2GT7TV9XhBv6WTfjHHwFnmzWcqB/C0sgdA9gc="},"college-a14be76ebc459e3bedd86e64c62b07c2dfc7ce632d73b86a7270b17462e5b746.css":{"logical_path":"college.css","mtime":"2019-11-11T18:25:42+08:00","size":610352,"digest":"a14be76ebc459e3bedd86e64c62b07c2dfc7ce632d73b86a7270b17462e5b746","integrity":"sha256-oUvnbrxFnjvt2G5kxisHwt/HzmMtc7hqcnCxdGLlt0Y="},"cooperative-bbf9b1ef14747d17410f2f38a6f308697335f86d4525ed6a5579905efc314ef3.js":{"logical_path":"cooperative.js","mtime":"2019-11-20T16:00:49+08:00","size":4463241,"digest":"bbf9b1ef14747d17410f2f38a6f308697335f86d4525ed6a5579905efc314ef3","integrity":"sha256-u/mx7xR0fRdBDy84pvMIaXM1+G1FJe1qVXmQXvwxTvM="},"cooperative-c36bba05d6a13482ccb6c3696ba5d750841dec9cae7a8043a0318c34c3a4638e.css":{"logical_path":"cooperative.css","mtime":"2019-11-17T09:36:46+08:00","size":849736,"digest":"c36bba05d6a13482ccb6c3696ba5d750841dec9cae7a8043a0318c34c3a4638e","integrity":"sha256-w2u6BdahNILMtsNpa6XXUIQd7JyueoBDoDGMNMOkY44="},"application-9cfbc3d792599a1d0de5c7b84209e1c2b2e60336f0f01e19f0581663918708fb.js":{"logical_path":"application.js","mtime":"2019-11-20T16:00:49+08:00","size":600706,"digest":"9cfbc3d792599a1d0de5c7b84209e1c2b2e60336f0f01e19f0581663918708fb","integrity":"sha256-nPvD15JZmh0N5ce4QgnhwrLmAzbw8B4Z8FgWY5GHCPs="},"application-8c9d6bb61c50908f584b3070c79aeb95f25c1166d39e07da5e95438b39ca0de9.css":{"logical_path":"application.css","mtime":"2019-10-21T22:52:15+08:00","size":436995,"digest":"8c9d6bb61c50908f584b3070c79aeb95f25c1166d39e07da5e95438b39ca0de9","integrity":"sha256-jJ1rthxQkI9YSzBwx5rrlfJcEWbTngfaXpVDiznKDek="},"admin-f1a4d30772fa41e1edd288c1b1d39deeac7481d590b13a886953adf2f2e4f47c.js":{"logical_path":"admin.js","mtime":"2019-11-29T15:05:39+08:00","size":4583647,"digest":"f1a4d30772fa41e1edd288c1b1d39deeac7481d590b13a886953adf2f2e4f47c","integrity":"sha256-8aTTB3L6QeHt0ojBsdOd7qx0gdWQsTqIaVOt8vLk9Hw="},"admin-0172e0b18d559d9648df58d7954e4843256ba2d2eda03543b7cc6c955c8e2eb3.js":{"logical_path":"admin.js","mtime":"2019-12-02T10:58:14+08:00","size":4583648,"digest":"0172e0b18d559d9648df58d7954e4843256ba2d2eda03543b7cc6c955c8e2eb3","integrity":"sha256-AXLgsY1VnZZI31jXlU5IQyVrotLtoDVDt8xslVyOLrM="},"admin-6da32058962cbfc9483b468c26d5f9b968b5f970a2031f73952863c554cd6254.js":{"logical_path":"admin.js","mtime":"2019-12-02T17:44:43+08:00","size":4583680,"digest":"6da32058962cbfc9483b468c26d5f9b968b5f970a2031f73952863c554cd6254","integrity":"sha256-baMgWJYsv8lIO0aMJtX5uWi1+XCiAx9zlShjxVTNYlQ="},"admin-64b90a423722da851a01011acac435b5f29f25e3b741e78854ea1a40742d89f7.js":{"logical_path":"admin.js","mtime":"2019-12-06T11:19:59+08:00","size":4584886,"digest":"64b90a423722da851a01011acac435b5f29f25e3b741e78854ea1a40742d89f7","integrity":"sha256-ZLkKQjci2oUaAQEaysQ1tfKfJeO3QeeIVOoaQHQtifc="},"admin-38dd06255909789c15bb1ae3d2c6b25064dd59d463ed996af2cd93b7aa08626b.css":{"logical_path":"admin.css","mtime":"2019-12-06T11:00:53+08:00","size":870104,"digest":"38dd06255909789c15bb1ae3d2c6b25064dd59d463ed996af2cd93b7aa08626b","integrity":"sha256-ON0GJVkJeJwVuxrj0sayUGTdWdRj7Zlq8s2Tt6oIYms="},"admin-f1565aa714ea18c95e226d27a3685c4b81544a9b531f4d14f88f6aa43cc9f2fa.css":{"logical_path":"admin.css","mtime":"2019-12-06T11:33:41+08:00","size":870109,"digest":"f1565aa714ea18c95e226d27a3685c4b81544a9b531f4d14f88f6aa43cc9f2fa","integrity":"sha256-8VZapxTqGMleIm0no2hcS4FUSptTH00U+I9qpDzJ8vo="},"admin-7e5aa975448fc470736f18156994f5b445b131ed1dbce9fad3b2d1415a0947d6.js":{"logical_path":"admin.js","mtime":"2019-12-06T15:35:42+08:00","size":4584963,"digest":"7e5aa975448fc470736f18156994f5b445b131ed1dbce9fad3b2d1415a0947d6","integrity":"sha256-flqpdUSPxHBzbxgVaZT1tEWxMe0dvOn607LRQVoJR9Y="},"admin-7cf88529e1f8fdafe22b3aef833fbba4898c4a69fdc4043dc9f1796c6f100ead.css":{"logical_path":"admin.css","mtime":"2019-12-06T18:03:36+08:00","size":870265,"digest":"7cf88529e1f8fdafe22b3aef833fbba4898c4a69fdc4043dc9f1796c6f100ead","integrity":"sha256-fPiFKeH4/a/iKzrvgz+7pImMSmn9xAQ9yfF5bG8QDq0="},"admin-aaff9ffea9f10689b47c00147b5cc6650961733dbc8ca30d23eb9afc2e6ee3dd.js":{"logical_path":"admin.js","mtime":"2019-12-06T18:20:13+08:00","size":4584962,"digest":"aaff9ffea9f10689b47c00147b5cc6650961733dbc8ca30d23eb9afc2e6ee3dd","integrity":"sha256-qv+f/qnxBom0fAAUe1zGZQlhcz28jKMNI+ua/C5u490="},"admin-ab3a763c3d168f05c11ca0a9f0cadc3030dc9f0ae0317085d9032d47643f7488.js":{"logical_path":"admin.js","mtime":"2019-12-26T16:08:18+08:00","size":4607541,"digest":"ab3a763c3d168f05c11ca0a9f0cadc3030dc9f0ae0317085d9032d47643f7488","integrity":"sha256-qzp2PD0WjwXBHKCp8MrcMDDcnwrgMXCF2QMtR2Q/dIg="},"admin-31e7cc6208d66802217e899555cd22920bb7d043578b1b16250e09dbe76b7bc6.css":{"logical_path":"admin.css","mtime":"2019-12-10T16:46:58+08:00","size":843730,"digest":"31e7cc6208d66802217e899555cd22920bb7d043578b1b16250e09dbe76b7bc6","integrity":"sha256-MefMYgjWaAIhfomVVc0ikgu30ENXixsWJQ4J2+dre8Y="},"college-893ba916d2b043f4b751cacc104de43d14e0db0b4001822f996e803bacbda169.css":{"logical_path":"college.css","mtime":"2019-12-10T16:46:58+08:00","size":589973,"digest":"893ba916d2b043f4b751cacc104de43d14e0db0b4001822f996e803bacbda169","integrity":"sha256-iTupFtKwQ/S3UcrMEE3kPRTg2wtAAYIvmW6AO6y9oWk="},"cooperative-bef1905d0c3e15357e3a376225923847b33f7388d49741062fe3cb20346da315.css":{"logical_path":"cooperative.css","mtime":"2019-12-10T16:46:58+08:00","size":824051,"digest":"bef1905d0c3e15357e3a376225923847b33f7388d49741062fe3cb20346da315","integrity":"sha256-vvGQXQw+FTV+OjdiJZI4R7M/c4jUl0EGL+PLIDRtoxU="},"application-8853af8ba870ca7fc8bdae048322f1c5a5caa26f1df87dbbf0c6d04232c4ac4e.css":{"logical_path":"application.css","mtime":"2019-10-21T22:52:15+08:00","size":418844,"digest":"8853af8ba870ca7fc8bdae048322f1c5a5caa26f1df87dbbf0c6d04232c4ac4e","integrity":"sha256-iFOvi6hwyn/Iva4EgyLxxaXKom8d+H278MbQQjLErE4="},"admin-f16eb906c3b6dce2c588677637473a128cd7b3d56c8d15b5eba621e9df586f37.js":{"logical_path":"admin.js","mtime":"2020-01-03T16:30:22+08:00","size":4610769,"digest":"f16eb906c3b6dce2c588677637473a128cd7b3d56c8d15b5eba621e9df586f37","integrity":"sha256-8W65BsO23OLFiGd2N0c6EozXs9VsjRW166Yh6d9Ybzc="},"admin-bed977ce14a5b8a1dcb718a4faa7971f54aad01ed4fa9b01a3d2ee333ed36cf8.js":{"logical_path":"admin.js","mtime":"2020-01-03T17:41:50+08:00","size":4611577,"digest":"bed977ce14a5b8a1dcb718a4faa7971f54aad01ed4fa9b01a3d2ee333ed36cf8","integrity":"sha256-vtl3zhSluKHctxik+qeXH1Sq0B7U+psBo9LuMz7TbPg="},"admin-d10431d175587afdb06f99d563f03b9890002351aa3b9a5e568d0396fd5cfe22.js":{"logical_path":"admin.js","mtime":"2020-01-31T16:18:47+08:00","size":4613282,"digest":"d10431d175587afdb06f99d563f03b9890002351aa3b9a5e568d0396fd5cfe22","integrity":"sha256-0QQx0XVYev2wb5nVY/A7mJAAI1GqO5peVo0Dlv1c/iI="},"admin-809fe775cb1fb357743738f65e0761be6b9fbe09dcd7062559f22dd87f1e059c.js":{"logical_path":"admin.js","mtime":"2020-02-04T19:26:18+08:00","size":4621538,"digest":"809fe775cb1fb357743738f65e0761be6b9fbe09dcd7062559f22dd87f1e059c","integrity":"sha256-gJ/ndcsfs1d0Nzj2Xgdhvmufvgnc1wYlWfIt2H8eBZw="},"admin-15ad6e029d1195111f661b61d8252ec40b1e453c44c489c661c8fa3211ff62b2.css":{"logical_path":"admin.css","mtime":"2020-02-05T14:22:08+08:00","size":846651,"digest":"15ad6e029d1195111f661b61d8252ec40b1e453c44c489c661c8fa3211ff62b2","integrity":"sha256-Fa1uAp0RlREfZhth2CUuxAseRTxExInGYcj6MhH/YrI="},"admin-c4d3fa2b049fa3abe12d80939ccd28ab8a824b1469cdb2c72f7daf1483ab6da1.js":{"logical_path":"admin.js","mtime":"2020-02-05T11:49:01+08:00","size":4622038,"digest":"c4d3fa2b049fa3abe12d80939ccd28ab8a824b1469cdb2c72f7daf1483ab6da1","integrity":"sha256-xNP6KwSfo6vhLYCTnM0oq4qCSxRpzbLHL32vFIOrbaE="},"admin-d4133a4bdcbfd4ca5d2dd49735008d8db50f25757650f0b13a62e254dfb201b4.js":{"logical_path":"admin.js","mtime":"2020-02-05T16:36:51+08:00","size":4624767,"digest":"d4133a4bdcbfd4ca5d2dd49735008d8db50f25757650f0b13a62e254dfb201b4","integrity":"sha256-1BM6S9y/1MpdLdSXNQCNjbUPJXV2UPCxOmLiVN+yAbQ="},"admin-7c523d78203d02769553abade33413cdf663eea3fe1d15ee07ab449240a10a9a.js":{"logical_path":"admin.js","mtime":"2020-02-19T15:51:39+08:00","size":4570082,"digest":"7c523d78203d02769553abade33413cdf663eea3fe1d15ee07ab449240a10a9a","integrity":"sha256-fFI9eCA9AnaVU6ut4zQTzfZj7qP+HRXuB6tEkkChCpo="},"college-f9c1b76699b39750bee976e1dbb5d832fdce2fb05edaf1b818c6e76fdf5ba77c.js":{"logical_path":"college.js","mtime":"2020-02-07T16:06:25+08:00","size":3505839,"digest":"f9c1b76699b39750bee976e1dbb5d832fdce2fb05edaf1b818c6e76fdf5ba77c","integrity":"sha256-+cG3Zpmzl1C+6Xbh27XYMv3OL7Be2vG4GMbnb99bp3w="},"college-2065ab3f84df62eb2ca345c83198920fad15cc3b93baf22c091f3c6bfced11b4.css":{"logical_path":"college.css","mtime":"2020-02-05T14:22:08+08:00","size":586787,"digest":"2065ab3f84df62eb2ca345c83198920fad15cc3b93baf22c091f3c6bfced11b4","integrity":"sha256-IGWrP4TfYusso0XIMZiSD60VzDuTuvIsCR88a/ztEbQ="},"cooperative-2efdf753e39599e78fb02527e864784df9a34dd971576db8231b63f618f9786e.js":{"logical_path":"cooperative.js","mtime":"2020-02-10T22:03:17+08:00","size":4413858,"digest":"2efdf753e39599e78fb02527e864784df9a34dd971576db8231b63f618f9786e","integrity":"sha256-Lv33U+OVmeePsCUn6GR4TfmjTdlxV224Ixtj9hj5eG4="},"cooperative-20747152aeb5e0bca475a49899a771a58d73be01d62c8f39396540c4f0abb10c.css":{"logical_path":"cooperative.css","mtime":"2020-02-05T14:22:08+08:00","size":826122,"digest":"20747152aeb5e0bca475a49899a771a58d73be01d62c8f39396540c4f0abb10c","integrity":"sha256-IHRxUq614LykdaSYmadxpY1zvgHWLI85OWVAxPCrsQw="},"application-47eaf72a32e7cee15e04ee7632fbbaadd5efd1129bfe0978d28d9b84ecec913e.js":{"logical_path":"application.js","mtime":"2020-02-07T16:06:25+08:00","size":551318,"digest":"47eaf72a32e7cee15e04ee7632fbbaadd5efd1129bfe0978d28d9b84ecec913e","integrity":"sha256-R+r3KjLnzuFeBO52Mvu6rdXv0RKb/gl40o2bhOzskT4="},"application-d3da385d89dfa7edfbecc09573322b132ffc5580cbd185d5f7a74d5358881815.css":{"logical_path":"application.css","mtime":"2019-09-09T09:26:59+08:00","size":419785,"digest":"d3da385d89dfa7edfbecc09573322b132ffc5580cbd185d5f7a74d5358881815","integrity":"sha256-09o4XYnfp+377MCVczIrEy/8VYDL0YXV96dNU1iIGBU="},"admin-8d7c2001aaf2599bddad06c5bc30526b059780d9fda2f01797524c0b8a1c43c3.js":{"logical_path":"admin.js","mtime":"2020-02-22T18:21:49+08:00","size":4636232,"digest":"8d7c2001aaf2599bddad06c5bc30526b059780d9fda2f01797524c0b8a1c43c3","integrity":"sha256-jXwgAaryWZvdrQbFvDBSawWXgNn9ovAXl1JMC4ocQ8M="},"admin-343a62865a99bebf4247a945a48400b472f76196fb80e86b4cce6b2cc480d306.css":{"logical_path":"admin.css","mtime":"2019-12-23T10:10:47+08:00","size":838584,"digest":"343a62865a99bebf4247a945a48400b472f76196fb80e86b4cce6b2cc480d306","integrity":"sha256-NDpihlqZvr9CR6lFpIQAtHL3YZb7gOhrTM5rLMSA0wY="},"college-461b4e52a77522c5ff4341992359aba660dc26d7d985e394b69d8b87db954a14.css":{"logical_path":"college.css","mtime":"2019-11-19T17:05:09+08:00","size":578720,"digest":"461b4e52a77522c5ff4341992359aba660dc26d7d985e394b69d8b87db954a14","integrity":"sha256-RhtOUqd1IsX/Q0GZI1mrpmDcJtfZheOUtp2Lh9uVShQ="},"cooperative-286bab0b704bc8d5295bee551a48f78e1fe8713e0e50c65059cf7a65ed09bbf0.js":{"logical_path":"cooperative.js","mtime":"2020-02-09T13:28:20+08:00","size":4478065,"digest":"286bab0b704bc8d5295bee551a48f78e1fe8713e0e50c65059cf7a65ed09bbf0","integrity":"sha256-KGurC3BLyNUpW+5VGkj3jh/ocT4OUMZQWc96Ze0Ju/A="},"cooperative-716b37420680ce5fb3bedf40508ea89e07f4d7060b412b832c8b4e9b09ac024d.css":{"logical_path":"cooperative.css","mtime":"2019-11-19T17:05:09+08:00","size":818055,"digest":"716b37420680ce5fb3bedf40508ea89e07f4d7060b412b832c8b4e9b09ac024d","integrity":"sha256-cWs3QgaAzl+zvt9AUI6ongf01wYLQSuDLItOmwmsAk0="},"application-e194b45894d0c5240d954851211a86516ee6ad871ca99bf7783ce44aeb8c0687.css":{"logical_path":"application.css","mtime":"2019-11-19T17:04:45+08:00","size":413848,"digest":"e194b45894d0c5240d954851211a86516ee6ad871ca99bf7783ce44aeb8c0687","integrity":"sha256-4ZS0WJTQxSQNlUhRIRqGUW7mrYccqZv3eDzkSuuMBoc="},"admin-04ff7d4c76f406e0df9e02923038d175f26ee098d43e266c2138b07163a2da9e.js":{"logical_path":"admin.js","mtime":"2020-02-25T12:09:35+08:00","size":4635520,"digest":"04ff7d4c76f406e0df9e02923038d175f26ee098d43e266c2138b07163a2da9e","integrity":"sha256-BP99THb0BuDfngKSMDjRdfJu4JjUPiZsITiwcWOi2p4="},"admin-46d2460ea8c06a885f92df73240e8eb84d320402bbdf580ffe3e038d07fdda3d.js":{"logical_path":"admin.js","mtime":"2020-02-25T13:17:26+08:00","size":4635586,"digest":"46d2460ea8c06a885f92df73240e8eb84d320402bbdf580ffe3e038d07fdda3d","integrity":"sha256-RtJGDqjAaohfkt9zJA6OuE0yBAK731gP/j4DjQf92j0="}},"assets":{"admin.js":"admin-46d2460ea8c06a885f92df73240e8eb84d320402bbdf580ffe3e038d07fdda3d.js","admin.css":"admin-31e7cc6208d66802217e899555cd22920bb7d043578b1b16250e09dbe76b7bc6.css","font-awesome/fontawesome-webfont.eot":"font-awesome/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot","font-awesome/fontawesome-webfont.woff2":"font-awesome/fontawesome-webfont-2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe.woff2","font-awesome/fontawesome-webfont.woff":"font-awesome/fontawesome-webfont-ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07.woff","font-awesome/fontawesome-webfont.ttf":"font-awesome/fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf","font-awesome/fontawesome-webfont.svg":"font-awesome/fontawesome-webfont-ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4.svg","college.js":"college-431d908264782ef54e90202095d4cf397c586f74d2b7879684348dc8b53d2cd2.js","college.css":"college-893ba916d2b043f4b751cacc104de43d14e0db0b4001822f996e803bacbda169.css","cooperative.js":"cooperative-286bab0b704bc8d5295bee551a48f78e1fe8713e0e50c65059cf7a65ed09bbf0.js","cooperative.css":"cooperative-bef1905d0c3e15357e3a376225923847b33f7388d49741062fe3cb20346da315.css","logo.png":"logo-7ff112568709bf97f9898fe87249b7a8f200ff1f48d537d85af87215f1870423.png","application.js":"application-d44f4301c7dfbe07bcb2788d7c006c22c184ae6b7016c09f7911b4962aacd767.js","application.css":"application-8853af8ba870ca7fc8bdae048322f1c5a5caa26f1df87dbbf0c6d04232c4ac4e.css"}}
\ No newline at end of file
+{"files":{"admin-1bd781fc5959b4f0e8879fa92afc5cec47e2d1a9b79cad9e55177fc1197a0e5b.js":{"logical_path":"admin.js","mtime":"2019-11-27T19:06:45+08:00","size":4594770,"digest":"1bd781fc5959b4f0e8879fa92afc5cec47e2d1a9b79cad9e55177fc1197a0e5b","integrity":"sha256-G9eB/FlZtPDoh5+pKvxc7Efi0am3nK2eVRd/wRl6Dls="},"admin-e78dd8b2041c26973b3851180e413539c07042575e336147194b5f2a1f7fa09c.css":{"logical_path":"admin.css","mtime":"2019-11-21T17:49:31+08:00","size":817848,"digest":"e78dd8b2041c26973b3851180e413539c07042575e336147194b5f2a1f7fa09c","integrity":"sha256-543YsgQcJpc7OFEYDkE1OcBwQldeM2FHGUtfKh9/oJw="},"font-awesome/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot":{"logical_path":"font-awesome/fontawesome-webfont.eot","mtime":"2019-08-22T14:54:27+08:00","size":165742,"digest":"7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979","integrity":"sha256-e/yrbbmdXPvxcFygU23ceFhUMsxfpBu9etDwCQM7KXk="},"font-awesome/fontawesome-webfont-2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe.woff2":{"logical_path":"font-awesome/fontawesome-webfont.woff2","mtime":"2019-08-22T14:54:27+08:00","size":77160,"digest":"2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe","integrity":"sha256-Kt78vAQefRj88tQXh53FoJmXqmTWdbejxLbOM9oT8/4="},"font-awesome/fontawesome-webfont-ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07.woff":{"logical_path":"font-awesome/fontawesome-webfont.woff","mtime":"2019-08-22T14:54:27+08:00","size":98024,"digest":"ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07","integrity":"sha256-ugxZ3rVFD1y0Gz+TYJ7i0NmVQVh33foiPoqKdTNHTwc="},"font-awesome/fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf":{"logical_path":"font-awesome/fontawesome-webfont.ttf","mtime":"2019-08-22T14:54:27+08:00","size":165548,"digest":"aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8","integrity":"sha256-qljzPyOaD7AvXHpsRcBD16msmgkzNYBmlOzW1O3A1qg="},"font-awesome/fontawesome-webfont-ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4.svg":{"logical_path":"font-awesome/fontawesome-webfont.svg","mtime":"2019-08-22T14:54:27+08:00","size":444379,"digest":"ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4","integrity":"sha256-rWFXkmwWIrpOHQPUePFUE2hSS/xG9R5C/g2UX37zI+Q="},"college-431d908264782ef54e90202095d4cf397c586f74d2b7879684348dc8b53d2cd2.js":{"logical_path":"college.js","mtime":"2020-01-07T14:59:22+08:00","size":3570046,"digest":"431d908264782ef54e90202095d4cf397c586f74d2b7879684348dc8b53d2cd2","integrity":"sha256-Qx2QgmR4LvVOkCAgldTPOXxYb3TSt4eWhDSNyLU9LNI="},"college-eb35b6573dea2a069abd5acb0211940c2165fa21da333555fa859ed155b3ca1f.css":{"logical_path":"college.css","mtime":"2019-11-20T17:50:44+08:00","size":565772,"digest":"eb35b6573dea2a069abd5acb0211940c2165fa21da333555fa859ed155b3ca1f","integrity":"sha256-6zW2Vz3qKgaavVrLAhGUDCFl+iHaMzVV+oWe0VWzyh8="},"cooperative-4f2218bb223392ea4332e9ace5a748baccd4fe66d4b5cc3b5574f97a425203ec.js":{"logical_path":"cooperative.js","mtime":"2020-01-07T14:59:22+08:00","size":4478060,"digest":"4f2218bb223392ea4332e9ace5a748baccd4fe66d4b5cc3b5574f97a425203ec","integrity":"sha256-TyIYuyIzkupDMums5adIuszU/mbUtcw7VXT5ekJSA+w="},"cooperative-9244063fa63cd29c9c3b074af565be75a130cfb31741b2f5252fe68a1f5c13c5.css":{"logical_path":"cooperative.css","mtime":"2019-11-20T17:50:44+08:00","size":799850,"digest":"9244063fa63cd29c9c3b074af565be75a130cfb31741b2f5252fe68a1f5c13c5","integrity":"sha256-kkQGP6Y80pycOwdK9WW+daEwz7MXQbL1JS/mih9cE8U="},"logo-7ff112568709bf97f9898fe87249b7a8f200ff1f48d537d85af87215f1870423.png":{"logical_path":"logo.png","mtime":"2019-12-10T16:46:58+08:00","size":2816,"digest":"7ff112568709bf97f9898fe87249b7a8f200ff1f48d537d85af87215f1870423","integrity":"sha256-f/ESVocJv5f5iY/ockm3qPIA/x9I1TfYWvhyFfGHBCM="},"application-d44f4301c7dfbe07bcb2788d7c006c22c184ae6b7016c09f7911b4962aacd767.js":{"logical_path":"application.js","mtime":"2020-01-07T14:59:22+08:00","size":615525,"digest":"d44f4301c7dfbe07bcb2788d7c006c22c184ae6b7016c09f7911b4962aacd767","integrity":"sha256-1E9DAcffvge8sniNfABsIsGErmtwFsCfeRG0liqs12c="},"application-2bf79ac2818959eb18d4df720a0cd0721b3b2385dd4565d635851fc41e192975.css":{"logical_path":"application.css","mtime":"2019-09-09T09:26:59+08:00","size":401033,"digest":"2bf79ac2818959eb18d4df720a0cd0721b3b2385dd4565d635851fc41e192975","integrity":"sha256-K/eawoGJWesY1N9yCgzQchs7I4XdRWXWNYUfxB4ZKXU="},"admin-83797d03d53c38db8e4751348516f8b7c55842cf8899066b86b3b2e6b6b1c8ad.js":{"logical_path":"admin.js","mtime":"2019-12-02T10:11:32+08:00","size":4583649,"digest":"83797d03d53c38db8e4751348516f8b7c55842cf8899066b86b3b2e6b6b1c8ad","integrity":"sha256-g3l9A9U8ONuOR1E0hRb4t8VYQs+ImQZrhrOy5raxyK0="},"admin-1512839e7eaa2136bdf9b238e3710004f8b90f2b74300c8ae7d9f9b25dddf077.css":{"logical_path":"admin.css","mtime":"2019-11-27T15:52:07+08:00","size":868584,"digest":"1512839e7eaa2136bdf9b238e3710004f8b90f2b74300c8ae7d9f9b25dddf077","integrity":"sha256-FRKDnn6qITa9+bI443EABPi5Dyt0MAyK59n5sl3d8Hc="},"college-1e70702e2d864fb4d5f57841bfa5937e31c7c059e6cd672a07f0b4b20740f607.js":{"logical_path":"college.js","mtime":"2019-11-20T16:00:49+08:00","size":3569292,"digest":"1e70702e2d864fb4d5f57841bfa5937e31c7c059e6cd672a07f0b4b20740f607","integrity":"sha256-HnBwLi2GT7TV9XhBv6WTfjHHwFnmzWcqB/C0sgdA9gc="},"college-a14be76ebc459e3bedd86e64c62b07c2dfc7ce632d73b86a7270b17462e5b746.css":{"logical_path":"college.css","mtime":"2019-11-11T18:25:42+08:00","size":610352,"digest":"a14be76ebc459e3bedd86e64c62b07c2dfc7ce632d73b86a7270b17462e5b746","integrity":"sha256-oUvnbrxFnjvt2G5kxisHwt/HzmMtc7hqcnCxdGLlt0Y="},"cooperative-bbf9b1ef14747d17410f2f38a6f308697335f86d4525ed6a5579905efc314ef3.js":{"logical_path":"cooperative.js","mtime":"2019-11-20T16:00:49+08:00","size":4463241,"digest":"bbf9b1ef14747d17410f2f38a6f308697335f86d4525ed6a5579905efc314ef3","integrity":"sha256-u/mx7xR0fRdBDy84pvMIaXM1+G1FJe1qVXmQXvwxTvM="},"cooperative-c36bba05d6a13482ccb6c3696ba5d750841dec9cae7a8043a0318c34c3a4638e.css":{"logical_path":"cooperative.css","mtime":"2019-11-17T09:36:46+08:00","size":849736,"digest":"c36bba05d6a13482ccb6c3696ba5d750841dec9cae7a8043a0318c34c3a4638e","integrity":"sha256-w2u6BdahNILMtsNpa6XXUIQd7JyueoBDoDGMNMOkY44="},"application-9cfbc3d792599a1d0de5c7b84209e1c2b2e60336f0f01e19f0581663918708fb.js":{"logical_path":"application.js","mtime":"2019-11-20T16:00:49+08:00","size":600706,"digest":"9cfbc3d792599a1d0de5c7b84209e1c2b2e60336f0f01e19f0581663918708fb","integrity":"sha256-nPvD15JZmh0N5ce4QgnhwrLmAzbw8B4Z8FgWY5GHCPs="},"application-8c9d6bb61c50908f584b3070c79aeb95f25c1166d39e07da5e95438b39ca0de9.css":{"logical_path":"application.css","mtime":"2019-10-21T22:52:15+08:00","size":436995,"digest":"8c9d6bb61c50908f584b3070c79aeb95f25c1166d39e07da5e95438b39ca0de9","integrity":"sha256-jJ1rthxQkI9YSzBwx5rrlfJcEWbTngfaXpVDiznKDek="},"admin-f1a4d30772fa41e1edd288c1b1d39deeac7481d590b13a886953adf2f2e4f47c.js":{"logical_path":"admin.js","mtime":"2019-11-29T15:05:39+08:00","size":4583647,"digest":"f1a4d30772fa41e1edd288c1b1d39deeac7481d590b13a886953adf2f2e4f47c","integrity":"sha256-8aTTB3L6QeHt0ojBsdOd7qx0gdWQsTqIaVOt8vLk9Hw="},"admin-0172e0b18d559d9648df58d7954e4843256ba2d2eda03543b7cc6c955c8e2eb3.js":{"logical_path":"admin.js","mtime":"2019-12-02T10:58:14+08:00","size":4583648,"digest":"0172e0b18d559d9648df58d7954e4843256ba2d2eda03543b7cc6c955c8e2eb3","integrity":"sha256-AXLgsY1VnZZI31jXlU5IQyVrotLtoDVDt8xslVyOLrM="},"admin-6da32058962cbfc9483b468c26d5f9b968b5f970a2031f73952863c554cd6254.js":{"logical_path":"admin.js","mtime":"2019-12-02T17:44:43+08:00","size":4583680,"digest":"6da32058962cbfc9483b468c26d5f9b968b5f970a2031f73952863c554cd6254","integrity":"sha256-baMgWJYsv8lIO0aMJtX5uWi1+XCiAx9zlShjxVTNYlQ="},"admin-64b90a423722da851a01011acac435b5f29f25e3b741e78854ea1a40742d89f7.js":{"logical_path":"admin.js","mtime":"2019-12-06T11:19:59+08:00","size":4584886,"digest":"64b90a423722da851a01011acac435b5f29f25e3b741e78854ea1a40742d89f7","integrity":"sha256-ZLkKQjci2oUaAQEaysQ1tfKfJeO3QeeIVOoaQHQtifc="},"admin-38dd06255909789c15bb1ae3d2c6b25064dd59d463ed996af2cd93b7aa08626b.css":{"logical_path":"admin.css","mtime":"2019-12-06T11:00:53+08:00","size":870104,"digest":"38dd06255909789c15bb1ae3d2c6b25064dd59d463ed996af2cd93b7aa08626b","integrity":"sha256-ON0GJVkJeJwVuxrj0sayUGTdWdRj7Zlq8s2Tt6oIYms="},"admin-f1565aa714ea18c95e226d27a3685c4b81544a9b531f4d14f88f6aa43cc9f2fa.css":{"logical_path":"admin.css","mtime":"2019-12-06T11:33:41+08:00","size":870109,"digest":"f1565aa714ea18c95e226d27a3685c4b81544a9b531f4d14f88f6aa43cc9f2fa","integrity":"sha256-8VZapxTqGMleIm0no2hcS4FUSptTH00U+I9qpDzJ8vo="},"admin-7e5aa975448fc470736f18156994f5b445b131ed1dbce9fad3b2d1415a0947d6.js":{"logical_path":"admin.js","mtime":"2019-12-06T15:35:42+08:00","size":4584963,"digest":"7e5aa975448fc470736f18156994f5b445b131ed1dbce9fad3b2d1415a0947d6","integrity":"sha256-flqpdUSPxHBzbxgVaZT1tEWxMe0dvOn607LRQVoJR9Y="},"admin-7cf88529e1f8fdafe22b3aef833fbba4898c4a69fdc4043dc9f1796c6f100ead.css":{"logical_path":"admin.css","mtime":"2019-12-06T18:03:36+08:00","size":870265,"digest":"7cf88529e1f8fdafe22b3aef833fbba4898c4a69fdc4043dc9f1796c6f100ead","integrity":"sha256-fPiFKeH4/a/iKzrvgz+7pImMSmn9xAQ9yfF5bG8QDq0="},"admin-aaff9ffea9f10689b47c00147b5cc6650961733dbc8ca30d23eb9afc2e6ee3dd.js":{"logical_path":"admin.js","mtime":"2019-12-06T18:20:13+08:00","size":4584962,"digest":"aaff9ffea9f10689b47c00147b5cc6650961733dbc8ca30d23eb9afc2e6ee3dd","integrity":"sha256-qv+f/qnxBom0fAAUe1zGZQlhcz28jKMNI+ua/C5u490="},"admin-ab3a763c3d168f05c11ca0a9f0cadc3030dc9f0ae0317085d9032d47643f7488.js":{"logical_path":"admin.js","mtime":"2019-12-26T16:08:18+08:00","size":4607541,"digest":"ab3a763c3d168f05c11ca0a9f0cadc3030dc9f0ae0317085d9032d47643f7488","integrity":"sha256-qzp2PD0WjwXBHKCp8MrcMDDcnwrgMXCF2QMtR2Q/dIg="},"admin-31e7cc6208d66802217e899555cd22920bb7d043578b1b16250e09dbe76b7bc6.css":{"logical_path":"admin.css","mtime":"2019-12-10T16:46:58+08:00","size":843730,"digest":"31e7cc6208d66802217e899555cd22920bb7d043578b1b16250e09dbe76b7bc6","integrity":"sha256-MefMYgjWaAIhfomVVc0ikgu30ENXixsWJQ4J2+dre8Y="},"college-893ba916d2b043f4b751cacc104de43d14e0db0b4001822f996e803bacbda169.css":{"logical_path":"college.css","mtime":"2019-12-10T16:46:58+08:00","size":589973,"digest":"893ba916d2b043f4b751cacc104de43d14e0db0b4001822f996e803bacbda169","integrity":"sha256-iTupFtKwQ/S3UcrMEE3kPRTg2wtAAYIvmW6AO6y9oWk="},"cooperative-bef1905d0c3e15357e3a376225923847b33f7388d49741062fe3cb20346da315.css":{"logical_path":"cooperative.css","mtime":"2019-12-10T16:46:58+08:00","size":824051,"digest":"bef1905d0c3e15357e3a376225923847b33f7388d49741062fe3cb20346da315","integrity":"sha256-vvGQXQw+FTV+OjdiJZI4R7M/c4jUl0EGL+PLIDRtoxU="},"application-8853af8ba870ca7fc8bdae048322f1c5a5caa26f1df87dbbf0c6d04232c4ac4e.css":{"logical_path":"application.css","mtime":"2019-10-21T22:52:15+08:00","size":418844,"digest":"8853af8ba870ca7fc8bdae048322f1c5a5caa26f1df87dbbf0c6d04232c4ac4e","integrity":"sha256-iFOvi6hwyn/Iva4EgyLxxaXKom8d+H278MbQQjLErE4="},"admin-f16eb906c3b6dce2c588677637473a128cd7b3d56c8d15b5eba621e9df586f37.js":{"logical_path":"admin.js","mtime":"2020-01-03T16:30:22+08:00","size":4610769,"digest":"f16eb906c3b6dce2c588677637473a128cd7b3d56c8d15b5eba621e9df586f37","integrity":"sha256-8W65BsO23OLFiGd2N0c6EozXs9VsjRW166Yh6d9Ybzc="},"admin-bed977ce14a5b8a1dcb718a4faa7971f54aad01ed4fa9b01a3d2ee333ed36cf8.js":{"logical_path":"admin.js","mtime":"2020-01-03T17:41:50+08:00","size":4611577,"digest":"bed977ce14a5b8a1dcb718a4faa7971f54aad01ed4fa9b01a3d2ee333ed36cf8","integrity":"sha256-vtl3zhSluKHctxik+qeXH1Sq0B7U+psBo9LuMz7TbPg="},"admin-d10431d175587afdb06f99d563f03b9890002351aa3b9a5e568d0396fd5cfe22.js":{"logical_path":"admin.js","mtime":"2020-01-31T16:18:47+08:00","size":4613282,"digest":"d10431d175587afdb06f99d563f03b9890002351aa3b9a5e568d0396fd5cfe22","integrity":"sha256-0QQx0XVYev2wb5nVY/A7mJAAI1GqO5peVo0Dlv1c/iI="},"admin-809fe775cb1fb357743738f65e0761be6b9fbe09dcd7062559f22dd87f1e059c.js":{"logical_path":"admin.js","mtime":"2020-02-04T19:26:18+08:00","size":4621538,"digest":"809fe775cb1fb357743738f65e0761be6b9fbe09dcd7062559f22dd87f1e059c","integrity":"sha256-gJ/ndcsfs1d0Nzj2Xgdhvmufvgnc1wYlWfIt2H8eBZw="},"admin-15ad6e029d1195111f661b61d8252ec40b1e453c44c489c661c8fa3211ff62b2.css":{"logical_path":"admin.css","mtime":"2020-02-05T14:22:08+08:00","size":846651,"digest":"15ad6e029d1195111f661b61d8252ec40b1e453c44c489c661c8fa3211ff62b2","integrity":"sha256-Fa1uAp0RlREfZhth2CUuxAseRTxExInGYcj6MhH/YrI="},"admin-c4d3fa2b049fa3abe12d80939ccd28ab8a824b1469cdb2c72f7daf1483ab6da1.js":{"logical_path":"admin.js","mtime":"2020-02-05T11:49:01+08:00","size":4622038,"digest":"c4d3fa2b049fa3abe12d80939ccd28ab8a824b1469cdb2c72f7daf1483ab6da1","integrity":"sha256-xNP6KwSfo6vhLYCTnM0oq4qCSxRpzbLHL32vFIOrbaE="},"admin-d4133a4bdcbfd4ca5d2dd49735008d8db50f25757650f0b13a62e254dfb201b4.js":{"logical_path":"admin.js","mtime":"2020-02-05T16:36:51+08:00","size":4624767,"digest":"d4133a4bdcbfd4ca5d2dd49735008d8db50f25757650f0b13a62e254dfb201b4","integrity":"sha256-1BM6S9y/1MpdLdSXNQCNjbUPJXV2UPCxOmLiVN+yAbQ="},"admin-7c523d78203d02769553abade33413cdf663eea3fe1d15ee07ab449240a10a9a.js":{"logical_path":"admin.js","mtime":"2020-02-19T15:51:39+08:00","size":4570082,"digest":"7c523d78203d02769553abade33413cdf663eea3fe1d15ee07ab449240a10a9a","integrity":"sha256-fFI9eCA9AnaVU6ut4zQTzfZj7qP+HRXuB6tEkkChCpo="},"college-f9c1b76699b39750bee976e1dbb5d832fdce2fb05edaf1b818c6e76fdf5ba77c.js":{"logical_path":"college.js","mtime":"2020-02-07T16:06:25+08:00","size":3505839,"digest":"f9c1b76699b39750bee976e1dbb5d832fdce2fb05edaf1b818c6e76fdf5ba77c","integrity":"sha256-+cG3Zpmzl1C+6Xbh27XYMv3OL7Be2vG4GMbnb99bp3w="},"college-2065ab3f84df62eb2ca345c83198920fad15cc3b93baf22c091f3c6bfced11b4.css":{"logical_path":"college.css","mtime":"2020-02-05T14:22:08+08:00","size":586787,"digest":"2065ab3f84df62eb2ca345c83198920fad15cc3b93baf22c091f3c6bfced11b4","integrity":"sha256-IGWrP4TfYusso0XIMZiSD60VzDuTuvIsCR88a/ztEbQ="},"cooperative-2efdf753e39599e78fb02527e864784df9a34dd971576db8231b63f618f9786e.js":{"logical_path":"cooperative.js","mtime":"2020-02-10T22:03:17+08:00","size":4413858,"digest":"2efdf753e39599e78fb02527e864784df9a34dd971576db8231b63f618f9786e","integrity":"sha256-Lv33U+OVmeePsCUn6GR4TfmjTdlxV224Ixtj9hj5eG4="},"cooperative-20747152aeb5e0bca475a49899a771a58d73be01d62c8f39396540c4f0abb10c.css":{"logical_path":"cooperative.css","mtime":"2020-02-05T14:22:08+08:00","size":826122,"digest":"20747152aeb5e0bca475a49899a771a58d73be01d62c8f39396540c4f0abb10c","integrity":"sha256-IHRxUq614LykdaSYmadxpY1zvgHWLI85OWVAxPCrsQw="},"application-47eaf72a32e7cee15e04ee7632fbbaadd5efd1129bfe0978d28d9b84ecec913e.js":{"logical_path":"application.js","mtime":"2020-02-07T16:06:25+08:00","size":551318,"digest":"47eaf72a32e7cee15e04ee7632fbbaadd5efd1129bfe0978d28d9b84ecec913e","integrity":"sha256-R+r3KjLnzuFeBO52Mvu6rdXv0RKb/gl40o2bhOzskT4="},"application-d3da385d89dfa7edfbecc09573322b132ffc5580cbd185d5f7a74d5358881815.css":{"logical_path":"application.css","mtime":"2019-09-09T09:26:59+08:00","size":419785,"digest":"d3da385d89dfa7edfbecc09573322b132ffc5580cbd185d5f7a74d5358881815","integrity":"sha256-09o4XYnfp+377MCVczIrEy/8VYDL0YXV96dNU1iIGBU="},"admin-8d7c2001aaf2599bddad06c5bc30526b059780d9fda2f01797524c0b8a1c43c3.js":{"logical_path":"admin.js","mtime":"2020-02-22T18:21:49+08:00","size":4636232,"digest":"8d7c2001aaf2599bddad06c5bc30526b059780d9fda2f01797524c0b8a1c43c3","integrity":"sha256-jXwgAaryWZvdrQbFvDBSawWXgNn9ovAXl1JMC4ocQ8M="},"admin-343a62865a99bebf4247a945a48400b472f76196fb80e86b4cce6b2cc480d306.css":{"logical_path":"admin.css","mtime":"2019-12-23T10:10:47+08:00","size":838584,"digest":"343a62865a99bebf4247a945a48400b472f76196fb80e86b4cce6b2cc480d306","integrity":"sha256-NDpihlqZvr9CR6lFpIQAtHL3YZb7gOhrTM5rLMSA0wY="},"college-461b4e52a77522c5ff4341992359aba660dc26d7d985e394b69d8b87db954a14.css":{"logical_path":"college.css","mtime":"2019-11-19T17:05:09+08:00","size":578720,"digest":"461b4e52a77522c5ff4341992359aba660dc26d7d985e394b69d8b87db954a14","integrity":"sha256-RhtOUqd1IsX/Q0GZI1mrpmDcJtfZheOUtp2Lh9uVShQ="},"cooperative-286bab0b704bc8d5295bee551a48f78e1fe8713e0e50c65059cf7a65ed09bbf0.js":{"logical_path":"cooperative.js","mtime":"2020-02-09T13:28:20+08:00","size":4478065,"digest":"286bab0b704bc8d5295bee551a48f78e1fe8713e0e50c65059cf7a65ed09bbf0","integrity":"sha256-KGurC3BLyNUpW+5VGkj3jh/ocT4OUMZQWc96Ze0Ju/A="},"cooperative-716b37420680ce5fb3bedf40508ea89e07f4d7060b412b832c8b4e9b09ac024d.css":{"logical_path":"cooperative.css","mtime":"2019-11-19T17:05:09+08:00","size":818055,"digest":"716b37420680ce5fb3bedf40508ea89e07f4d7060b412b832c8b4e9b09ac024d","integrity":"sha256-cWs3QgaAzl+zvt9AUI6ongf01wYLQSuDLItOmwmsAk0="},"application-e194b45894d0c5240d954851211a86516ee6ad871ca99bf7783ce44aeb8c0687.css":{"logical_path":"application.css","mtime":"2019-11-19T17:04:45+08:00","size":413848,"digest":"e194b45894d0c5240d954851211a86516ee6ad871ca99bf7783ce44aeb8c0687","integrity":"sha256-4ZS0WJTQxSQNlUhRIRqGUW7mrYccqZv3eDzkSuuMBoc="},"admin-04ff7d4c76f406e0df9e02923038d175f26ee098d43e266c2138b07163a2da9e.js":{"logical_path":"admin.js","mtime":"2020-02-25T12:09:35+08:00","size":4635520,"digest":"04ff7d4c76f406e0df9e02923038d175f26ee098d43e266c2138b07163a2da9e","integrity":"sha256-BP99THb0BuDfngKSMDjRdfJu4JjUPiZsITiwcWOi2p4="},"admin-46d2460ea8c06a885f92df73240e8eb84d320402bbdf580ffe3e038d07fdda3d.js":{"logical_path":"admin.js","mtime":"2020-02-25T13:17:26+08:00","size":4635586,"digest":"46d2460ea8c06a885f92df73240e8eb84d320402bbdf580ffe3e038d07fdda3d","integrity":"sha256-RtJGDqjAaohfkt9zJA6OuE0yBAK731gP/j4DjQf92j0="},"admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js":{"logical_path":"admin.js","mtime":"2020-02-25T17:16:13+08:00","size":4637067,"digest":"b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98","integrity":"sha256-uPJtsYWIb5kCHakfDiwajMTO1NG4lXlHUdEbep9F3pg="},"admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js":{"logical_path":"admin.js","mtime":"2020-02-25T17:51:23+08:00","size":4637275,"digest":"8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2","integrity":"sha256-jLDpcksz4lNiGl8QIL3CcPgoy31gLehDTTzGBuC028I="}},"assets":{"admin.js":"admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js","admin.css":"admin-31e7cc6208d66802217e899555cd22920bb7d043578b1b16250e09dbe76b7bc6.css","font-awesome/fontawesome-webfont.eot":"font-awesome/fontawesome-webfont-7bfcab6db99d5cfbf1705ca0536ddc78585432cc5fa41bbd7ad0f009033b2979.eot","font-awesome/fontawesome-webfont.woff2":"font-awesome/fontawesome-webfont-2adefcbc041e7d18fcf2d417879dc5a09997aa64d675b7a3c4b6ce33da13f3fe.woff2","font-awesome/fontawesome-webfont.woff":"font-awesome/fontawesome-webfont-ba0c59deb5450f5cb41b3f93609ee2d0d995415877ddfa223e8a8a7533474f07.woff","font-awesome/fontawesome-webfont.ttf":"font-awesome/fontawesome-webfont-aa58f33f239a0fb02f5c7a6c45c043d7a9ac9a093335806694ecd6d4edc0d6a8.ttf","font-awesome/fontawesome-webfont.svg":"font-awesome/fontawesome-webfont-ad6157926c1622ba4e1d03d478f1541368524bfc46f51e42fe0d945f7ef323e4.svg","college.js":"college-431d908264782ef54e90202095d4cf397c586f74d2b7879684348dc8b53d2cd2.js","college.css":"college-893ba916d2b043f4b751cacc104de43d14e0db0b4001822f996e803bacbda169.css","cooperative.js":"cooperative-286bab0b704bc8d5295bee551a48f78e1fe8713e0e50c65059cf7a65ed09bbf0.js","cooperative.css":"cooperative-bef1905d0c3e15357e3a376225923847b33f7388d49741062fe3cb20346da315.css","logo.png":"logo-7ff112568709bf97f9898fe87249b7a8f200ff1f48d537d85af87215f1870423.png","application.js":"application-d44f4301c7dfbe07bcb2788d7c006c22c184ae6b7016c09f7911b4962aacd767.js","application.css":"application-8853af8ba870ca7fc8bdae048322f1c5a5caa26f1df87dbbf0c6d04232c4ac4e.css"}}
\ No newline at end of file
diff --git a/public/assets/admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js b/public/assets/admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js
new file mode 100644
index 000000000..dfbe1a4b7
--- /dev/null
+++ b/public/assets/admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js
@@ -0,0 +1,142309 @@
+/*
+Unobtrusive JavaScript
+https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts
+Released under the MIT license
+ */
+
+
+(function() {
+  var context = this;
+
+  (function() {
+    (function() {
+      this.Rails = {
+        linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]:not([disabled]), a[data-disable-with], a[data-disable]',
+        buttonClickSelector: {
+          selector: 'button[data-remote]:not([form]), button[data-confirm]:not([form])',
+          exclude: 'form button'
+        },
+        inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]',
+        formSubmitSelector: 'form',
+        formInputClickSelector: 'form input[type=submit], form input[type=image], form button[type=submit], form button:not([type]), input[type=submit][form], input[type=image][form], button[type=submit][form], button[form]:not([type])',
+        formDisableSelector: 'input[data-disable-with]:enabled, button[data-disable-with]:enabled, textarea[data-disable-with]:enabled, input[data-disable]:enabled, button[data-disable]:enabled, textarea[data-disable]:enabled',
+        formEnableSelector: 'input[data-disable-with]:disabled, button[data-disable-with]:disabled, textarea[data-disable-with]:disabled, input[data-disable]:disabled, button[data-disable]:disabled, textarea[data-disable]:disabled',
+        fileInputSelector: 'input[name][type=file]:not([disabled])',
+        linkDisableSelector: 'a[data-disable-with], a[data-disable]',
+        buttonDisableSelector: 'button[data-remote][data-disable-with], button[data-remote][data-disable]'
+      };
+
+    }).call(this);
+  }).call(context);
+
+  var Rails = context.Rails;
+
+  (function() {
+    (function() {
+      var nonce;
+
+      nonce = null;
+
+      Rails.loadCSPNonce = function() {
+        var ref;
+        return nonce = (ref = document.querySelector("meta[name=csp-nonce]")) != null ? ref.content : void 0;
+      };
+
+      Rails.cspNonce = function() {
+        return nonce != null ? nonce : Rails.loadCSPNonce();
+      };
+
+    }).call(this);
+    (function() {
+      var expando, m;
+
+      m = Element.prototype.matches || Element.prototype.matchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector || Element.prototype.oMatchesSelector || Element.prototype.webkitMatchesSelector;
+
+      Rails.matches = function(element, selector) {
+        if (selector.exclude != null) {
+          return m.call(element, selector.selector) && !m.call(element, selector.exclude);
+        } else {
+          return m.call(element, selector);
+        }
+      };
+
+      expando = '_ujsData';
+
+      Rails.getData = function(element, key) {
+        var ref;
+        return (ref = element[expando]) != null ? ref[key] : void 0;
+      };
+
+      Rails.setData = function(element, key, value) {
+        if (element[expando] == null) {
+          element[expando] = {};
+        }
+        return element[expando][key] = value;
+      };
+
+      Rails.$ = function(selector) {
+        return Array.prototype.slice.call(document.querySelectorAll(selector));
+      };
+
+    }).call(this);
+    (function() {
+      var $, csrfParam, csrfToken;
+
+      $ = Rails.$;
+
+      csrfToken = Rails.csrfToken = function() {
+        var meta;
+        meta = document.querySelector('meta[name=csrf-token]');
+        return meta && meta.content;
+      };
+
+      csrfParam = Rails.csrfParam = function() {
+        var meta;
+        meta = document.querySelector('meta[name=csrf-param]');
+        return meta && meta.content;
+      };
+
+      Rails.CSRFProtection = function(xhr) {
+        var token;
+        token = csrfToken();
+        if (token != null) {
+          return xhr.setRequestHeader('X-CSRF-Token', token);
+        }
+      };
+
+      Rails.refreshCSRFTokens = function() {
+        var param, token;
+        token = csrfToken();
+        param = csrfParam();
+        if ((token != null) && (param != null)) {
+          return $('form input[name="' + param + '"]').forEach(function(input) {
+            return input.value = token;
+          });
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var CustomEvent, fire, matches, preventDefault;
+
+      matches = Rails.matches;
+
+      CustomEvent = window.CustomEvent;
+
+      if (typeof CustomEvent !== 'function') {
+        CustomEvent = function(event, params) {
+          var evt;
+          evt = document.createEvent('CustomEvent');
+          evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
+          return evt;
+        };
+        CustomEvent.prototype = window.Event.prototype;
+        preventDefault = CustomEvent.prototype.preventDefault;
+        CustomEvent.prototype.preventDefault = function() {
+          var result;
+          result = preventDefault.call(this);
+          if (this.cancelable && !this.defaultPrevented) {
+            Object.defineProperty(this, 'defaultPrevented', {
+              get: function() {
+                return true;
+              }
+            });
+          }
+          return result;
+        };
+      }
+
+      fire = Rails.fire = function(obj, name, data) {
+        var event;
+        event = new CustomEvent(name, {
+          bubbles: true,
+          cancelable: true,
+          detail: data
+        });
+        obj.dispatchEvent(event);
+        return !event.defaultPrevented;
+      };
+
+      Rails.stopEverything = function(e) {
+        fire(e.target, 'ujs:everythingStopped');
+        e.preventDefault();
+        e.stopPropagation();
+        return e.stopImmediatePropagation();
+      };
+
+      Rails.delegate = function(element, selector, eventType, handler) {
+        return element.addEventListener(eventType, function(e) {
+          var target;
+          target = e.target;
+          while (!(!(target instanceof Element) || matches(target, selector))) {
+            target = target.parentNode;
+          }
+          if (target instanceof Element && handler.call(target, e) === false) {
+            e.preventDefault();
+            return e.stopPropagation();
+          }
+        });
+      };
+
+    }).call(this);
+    (function() {
+      var AcceptHeaders, CSRFProtection, createXHR, cspNonce, fire, prepareOptions, processResponse;
+
+      cspNonce = Rails.cspNonce, CSRFProtection = Rails.CSRFProtection, fire = Rails.fire;
+
+      AcceptHeaders = {
+        '*': '*/*',
+        text: 'text/plain',
+        html: 'text/html',
+        xml: 'application/xml, text/xml',
+        json: 'application/json, text/javascript',
+        script: 'text/javascript, application/javascript, application/ecmascript, application/x-ecmascript'
+      };
+
+      Rails.ajax = function(options) {
+        var xhr;
+        options = prepareOptions(options);
+        xhr = createXHR(options, function() {
+          var ref, response;
+          response = processResponse((ref = xhr.response) != null ? ref : xhr.responseText, xhr.getResponseHeader('Content-Type'));
+          if (Math.floor(xhr.status / 100) === 2) {
+            if (typeof options.success === "function") {
+              options.success(response, xhr.statusText, xhr);
+            }
+          } else {
+            if (typeof options.error === "function") {
+              options.error(response, xhr.statusText, xhr);
+            }
+          }
+          return typeof options.complete === "function" ? options.complete(xhr, xhr.statusText) : void 0;
+        });
+        if ((options.beforeSend != null) && !options.beforeSend(xhr, options)) {
+          return false;
+        }
+        if (xhr.readyState === XMLHttpRequest.OPENED) {
+          return xhr.send(options.data);
+        }
+      };
+
+      prepareOptions = function(options) {
+        options.url = options.url || location.href;
+        options.type = options.type.toUpperCase();
+        if (options.type === 'GET' && options.data) {
+          if (options.url.indexOf('?') < 0) {
+            options.url += '?' + options.data;
+          } else {
+            options.url += '&' + options.data;
+          }
+        }
+        if (AcceptHeaders[options.dataType] == null) {
+          options.dataType = '*';
+        }
+        options.accept = AcceptHeaders[options.dataType];
+        if (options.dataType !== '*') {
+          options.accept += ', */*; q=0.01';
+        }
+        return options;
+      };
+
+      createXHR = function(options, done) {
+        var xhr;
+        xhr = new XMLHttpRequest();
+        xhr.open(options.type, options.url, true);
+        xhr.setRequestHeader('Accept', options.accept);
+        if (typeof options.data === 'string') {
+          xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
+        }
+        if (!options.crossDomain) {
+          xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+        }
+        CSRFProtection(xhr);
+        xhr.withCredentials = !!options.withCredentials;
+        xhr.onreadystatechange = function() {
+          if (xhr.readyState === XMLHttpRequest.DONE) {
+            return done(xhr);
+          }
+        };
+        return xhr;
+      };
+
+      processResponse = function(response, type) {
+        var parser, script;
+        if (typeof response === 'string' && typeof type === 'string') {
+          if (type.match(/\bjson\b/)) {
+            try {
+              response = JSON.parse(response);
+            } catch (error) {}
+          } else if (type.match(/\b(?:java|ecma)script\b/)) {
+            script = document.createElement('script');
+            script.setAttribute('nonce', cspNonce());
+            script.text = response;
+            document.head.appendChild(script).parentNode.removeChild(script);
+          } else if (type.match(/\b(xml|html|svg)\b/)) {
+            parser = new DOMParser();
+            type = type.replace(/;.+/, '');
+            try {
+              response = parser.parseFromString(response, type);
+            } catch (error) {}
+          }
+        }
+        return response;
+      };
+
+      Rails.href = function(element) {
+        return element.href;
+      };
+
+      Rails.isCrossDomain = function(url) {
+        var e, originAnchor, urlAnchor;
+        originAnchor = document.createElement('a');
+        originAnchor.href = location.href;
+        urlAnchor = document.createElement('a');
+        try {
+          urlAnchor.href = url;
+          return !(((!urlAnchor.protocol || urlAnchor.protocol === ':') && !urlAnchor.host) || (originAnchor.protocol + '//' + originAnchor.host === urlAnchor.protocol + '//' + urlAnchor.host));
+        } catch (error) {
+          e = error;
+          return true;
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var matches, toArray;
+
+      matches = Rails.matches;
+
+      toArray = function(e) {
+        return Array.prototype.slice.call(e);
+      };
+
+      Rails.serializeElement = function(element, additionalParam) {
+        var inputs, params;
+        inputs = [element];
+        if (matches(element, 'form')) {
+          inputs = toArray(element.elements);
+        }
+        params = [];
+        inputs.forEach(function(input) {
+          if (!input.name || input.disabled) {
+            return;
+          }
+          if (matches(input, 'select')) {
+            return toArray(input.options).forEach(function(option) {
+              if (option.selected) {
+                return params.push({
+                  name: input.name,
+                  value: option.value
+                });
+              }
+            });
+          } else if (input.checked || ['radio', 'checkbox', 'submit'].indexOf(input.type) === -1) {
+            return params.push({
+              name: input.name,
+              value: input.value
+            });
+          }
+        });
+        if (additionalParam) {
+          params.push(additionalParam);
+        }
+        return params.map(function(param) {
+          if (param.name != null) {
+            return (encodeURIComponent(param.name)) + "=" + (encodeURIComponent(param.value));
+          } else {
+            return param;
+          }
+        }).join('&');
+      };
+
+      Rails.formElements = function(form, selector) {
+        if (matches(form, 'form')) {
+          return toArray(form.elements).filter(function(el) {
+            return matches(el, selector);
+          });
+        } else {
+          return toArray(form.querySelectorAll(selector));
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var allowAction, fire, stopEverything;
+
+      fire = Rails.fire, stopEverything = Rails.stopEverything;
+
+      Rails.handleConfirm = function(e) {
+        if (!allowAction(this)) {
+          return stopEverything(e);
+        }
+      };
+
+      allowAction = function(element) {
+        var answer, callback, message;
+        message = element.getAttribute('data-confirm');
+        if (!message) {
+          return true;
+        }
+        answer = false;
+        if (fire(element, 'confirm')) {
+          try {
+            answer = confirm(message);
+          } catch (error) {}
+          callback = fire(element, 'confirm:complete', [answer]);
+        }
+        return answer && callback;
+      };
+
+    }).call(this);
+    (function() {
+      var disableFormElement, disableFormElements, disableLinkElement, enableFormElement, enableFormElements, enableLinkElement, formElements, getData, matches, setData, stopEverything;
+
+      matches = Rails.matches, getData = Rails.getData, setData = Rails.setData, stopEverything = Rails.stopEverything, formElements = Rails.formElements;
+
+      Rails.handleDisabledElement = function(e) {
+        var element;
+        element = this;
+        if (element.disabled) {
+          return stopEverything(e);
+        }
+      };
+
+      Rails.enableElement = function(e) {
+        var element;
+        element = e instanceof Event ? e.target : e;
+        if (matches(element, Rails.linkDisableSelector)) {
+          return enableLinkElement(element);
+        } else if (matches(element, Rails.buttonDisableSelector) || matches(element, Rails.formEnableSelector)) {
+          return enableFormElement(element);
+        } else if (matches(element, Rails.formSubmitSelector)) {
+          return enableFormElements(element);
+        }
+      };
+
+      Rails.disableElement = function(e) {
+        var element;
+        element = e instanceof Event ? e.target : e;
+        if (matches(element, Rails.linkDisableSelector)) {
+          return disableLinkElement(element);
+        } else if (matches(element, Rails.buttonDisableSelector) || matches(element, Rails.formDisableSelector)) {
+          return disableFormElement(element);
+        } else if (matches(element, Rails.formSubmitSelector)) {
+          return disableFormElements(element);
+        }
+      };
+
+      disableLinkElement = function(element) {
+        var replacement;
+        replacement = element.getAttribute('data-disable-with');
+        if (replacement != null) {
+          setData(element, 'ujs:enable-with', element.innerHTML);
+          element.innerHTML = replacement;
+        }
+        element.addEventListener('click', stopEverything);
+        return setData(element, 'ujs:disabled', true);
+      };
+
+      enableLinkElement = function(element) {
+        var originalText;
+        originalText = getData(element, 'ujs:enable-with');
+        if (originalText != null) {
+          element.innerHTML = originalText;
+          setData(element, 'ujs:enable-with', null);
+        }
+        element.removeEventListener('click', stopEverything);
+        return setData(element, 'ujs:disabled', null);
+      };
+
+      disableFormElements = function(form) {
+        return formElements(form, Rails.formDisableSelector).forEach(disableFormElement);
+      };
+
+      disableFormElement = function(element) {
+        var replacement;
+        replacement = element.getAttribute('data-disable-with');
+        if (replacement != null) {
+          if (matches(element, 'button')) {
+            setData(element, 'ujs:enable-with', element.innerHTML);
+            element.innerHTML = replacement;
+          } else {
+            setData(element, 'ujs:enable-with', element.value);
+            element.value = replacement;
+          }
+        }
+        element.disabled = true;
+        return setData(element, 'ujs:disabled', true);
+      };
+
+      enableFormElements = function(form) {
+        return formElements(form, Rails.formEnableSelector).forEach(enableFormElement);
+      };
+
+      enableFormElement = function(element) {
+        var originalText;
+        originalText = getData(element, 'ujs:enable-with');
+        if (originalText != null) {
+          if (matches(element, 'button')) {
+            element.innerHTML = originalText;
+          } else {
+            element.value = originalText;
+          }
+          setData(element, 'ujs:enable-with', null);
+        }
+        element.disabled = false;
+        return setData(element, 'ujs:disabled', null);
+      };
+
+    }).call(this);
+    (function() {
+      var stopEverything;
+
+      stopEverything = Rails.stopEverything;
+
+      Rails.handleMethod = function(e) {
+        var csrfParam, csrfToken, form, formContent, href, link, method;
+        link = this;
+        method = link.getAttribute('data-method');
+        if (!method) {
+          return;
+        }
+        href = Rails.href(link);
+        csrfToken = Rails.csrfToken();
+        csrfParam = Rails.csrfParam();
+        form = document.createElement('form');
+        formContent = "<input name='_method' value='" + method + "' type='hidden' />";
+        if ((csrfParam != null) && (csrfToken != null) && !Rails.isCrossDomain(href)) {
+          formContent += "<input name='" + csrfParam + "' value='" + csrfToken + "' type='hidden' />";
+        }
+        formContent += '<input type="submit" />';
+        form.method = 'post';
+        form.action = href;
+        form.target = link.target;
+        form.innerHTML = formContent;
+        form.style.display = 'none';
+        document.body.appendChild(form);
+        form.querySelector('[type="submit"]').click();
+        return stopEverything(e);
+      };
+
+    }).call(this);
+    (function() {
+      var ajax, fire, getData, isCrossDomain, isRemote, matches, serializeElement, setData, stopEverything,
+        slice = [].slice;
+
+      matches = Rails.matches, getData = Rails.getData, setData = Rails.setData, fire = Rails.fire, stopEverything = Rails.stopEverything, ajax = Rails.ajax, isCrossDomain = Rails.isCrossDomain, serializeElement = Rails.serializeElement;
+
+      isRemote = function(element) {
+        var value;
+        value = element.getAttribute('data-remote');
+        return (value != null) && value !== 'false';
+      };
+
+      Rails.handleRemote = function(e) {
+        var button, data, dataType, element, method, url, withCredentials;
+        element = this;
+        if (!isRemote(element)) {
+          return true;
+        }
+        if (!fire(element, 'ajax:before')) {
+          fire(element, 'ajax:stopped');
+          return false;
+        }
+        withCredentials = element.getAttribute('data-with-credentials');
+        dataType = element.getAttribute('data-type') || 'script';
+        if (matches(element, Rails.formSubmitSelector)) {
+          button = getData(element, 'ujs:submit-button');
+          method = getData(element, 'ujs:submit-button-formmethod') || element.method;
+          url = getData(element, 'ujs:submit-button-formaction') || element.getAttribute('action') || location.href;
+          if (method.toUpperCase() === 'GET') {
+            url = url.replace(/\?.*$/, '');
+          }
+          if (element.enctype === 'multipart/form-data') {
+            data = new FormData(element);
+            if (button != null) {
+              data.append(button.name, button.value);
+            }
+          } else {
+            data = serializeElement(element, button);
+          }
+          setData(element, 'ujs:submit-button', null);
+          setData(element, 'ujs:submit-button-formmethod', null);
+          setData(element, 'ujs:submit-button-formaction', null);
+        } else if (matches(element, Rails.buttonClickSelector) || matches(element, Rails.inputChangeSelector)) {
+          method = element.getAttribute('data-method');
+          url = element.getAttribute('data-url');
+          data = serializeElement(element, element.getAttribute('data-params'));
+        } else {
+          method = element.getAttribute('data-method');
+          url = Rails.href(element);
+          data = element.getAttribute('data-params');
+        }
+        ajax({
+          type: method || 'GET',
+          url: url,
+          data: data,
+          dataType: dataType,
+          beforeSend: function(xhr, options) {
+            if (fire(element, 'ajax:beforeSend', [xhr, options])) {
+              return fire(element, 'ajax:send', [xhr]);
+            } else {
+              fire(element, 'ajax:stopped');
+              return false;
+            }
+          },
+          success: function() {
+            var args;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return fire(element, 'ajax:success', args);
+          },
+          error: function() {
+            var args;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return fire(element, 'ajax:error', args);
+          },
+          complete: function() {
+            var args;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return fire(element, 'ajax:complete', args);
+          },
+          crossDomain: isCrossDomain(url),
+          withCredentials: (withCredentials != null) && withCredentials !== 'false'
+        });
+        return stopEverything(e);
+      };
+
+      Rails.formSubmitButtonClick = function(e) {
+        var button, form;
+        button = this;
+        form = button.form;
+        if (!form) {
+          return;
+        }
+        if (button.name) {
+          setData(form, 'ujs:submit-button', {
+            name: button.name,
+            value: button.value
+          });
+        }
+        setData(form, 'ujs:formnovalidate-button', button.formNoValidate);
+        setData(form, 'ujs:submit-button-formaction', button.getAttribute('formaction'));
+        return setData(form, 'ujs:submit-button-formmethod', button.getAttribute('formmethod'));
+      };
+
+      Rails.preventInsignificantClick = function(e) {
+        var data, insignificantMetaClick, link, metaClick, method, primaryMouseKey;
+        link = this;
+        method = (link.getAttribute('data-method') || 'GET').toUpperCase();
+        data = link.getAttribute('data-params');
+        metaClick = e.metaKey || e.ctrlKey;
+        insignificantMetaClick = metaClick && method === 'GET' && !data;
+        primaryMouseKey = e.button === 0;
+        if (!primaryMouseKey || insignificantMetaClick) {
+          return e.stopImmediatePropagation();
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var $, CSRFProtection, delegate, disableElement, enableElement, fire, formSubmitButtonClick, getData, handleConfirm, handleDisabledElement, handleMethod, handleRemote, loadCSPNonce, preventInsignificantClick, refreshCSRFTokens;
+
+      fire = Rails.fire, delegate = Rails.delegate, getData = Rails.getData, $ = Rails.$, refreshCSRFTokens = Rails.refreshCSRFTokens, CSRFProtection = Rails.CSRFProtection, loadCSPNonce = Rails.loadCSPNonce, enableElement = Rails.enableElement, disableElement = Rails.disableElement, handleDisabledElement = Rails.handleDisabledElement, handleConfirm = Rails.handleConfirm, preventInsignificantClick = Rails.preventInsignificantClick, handleRemote = Rails.handleRemote, formSubmitButtonClick = Rails.formSubmitButtonClick, handleMethod = Rails.handleMethod;
+
+      if ((typeof jQuery !== "undefined" && jQuery !== null) && (jQuery.ajax != null)) {
+        if (jQuery.rails) {
+          throw new Error('If you load both jquery_ujs and rails-ujs, use rails-ujs only.');
+        }
+        jQuery.rails = Rails;
+        jQuery.ajaxPrefilter(function(options, originalOptions, xhr) {
+          if (!options.crossDomain) {
+            return CSRFProtection(xhr);
+          }
+        });
+      }
+
+      Rails.start = function() {
+        if (window._rails_loaded) {
+          throw new Error('rails-ujs has already been loaded!');
+        }
+        window.addEventListener('pageshow', function() {
+          $(Rails.formEnableSelector).forEach(function(el) {
+            if (getData(el, 'ujs:disabled')) {
+              return enableElement(el);
+            }
+          });
+          return $(Rails.linkDisableSelector).forEach(function(el) {
+            if (getData(el, 'ujs:disabled')) {
+              return enableElement(el);
+            }
+          });
+        });
+        delegate(document, Rails.linkDisableSelector, 'ajax:complete', enableElement);
+        delegate(document, Rails.linkDisableSelector, 'ajax:stopped', enableElement);
+        delegate(document, Rails.buttonDisableSelector, 'ajax:complete', enableElement);
+        delegate(document, Rails.buttonDisableSelector, 'ajax:stopped', enableElement);
+        delegate(document, Rails.linkClickSelector, 'click', preventInsignificantClick);
+        delegate(document, Rails.linkClickSelector, 'click', handleDisabledElement);
+        delegate(document, Rails.linkClickSelector, 'click', handleConfirm);
+        delegate(document, Rails.linkClickSelector, 'click', disableElement);
+        delegate(document, Rails.linkClickSelector, 'click', handleRemote);
+        delegate(document, Rails.linkClickSelector, 'click', handleMethod);
+        delegate(document, Rails.buttonClickSelector, 'click', preventInsignificantClick);
+        delegate(document, Rails.buttonClickSelector, 'click', handleDisabledElement);
+        delegate(document, Rails.buttonClickSelector, 'click', handleConfirm);
+        delegate(document, Rails.buttonClickSelector, 'click', disableElement);
+        delegate(document, Rails.buttonClickSelector, 'click', handleRemote);
+        delegate(document, Rails.inputChangeSelector, 'change', handleDisabledElement);
+        delegate(document, Rails.inputChangeSelector, 'change', handleConfirm);
+        delegate(document, Rails.inputChangeSelector, 'change', handleRemote);
+        delegate(document, Rails.formSubmitSelector, 'submit', handleDisabledElement);
+        delegate(document, Rails.formSubmitSelector, 'submit', handleConfirm);
+        delegate(document, Rails.formSubmitSelector, 'submit', handleRemote);
+        delegate(document, Rails.formSubmitSelector, 'submit', function(e) {
+          return setTimeout((function() {
+            return disableElement(e);
+          }), 13);
+        });
+        delegate(document, Rails.formSubmitSelector, 'ajax:send', disableElement);
+        delegate(document, Rails.formSubmitSelector, 'ajax:complete', enableElement);
+        delegate(document, Rails.formInputClickSelector, 'click', preventInsignificantClick);
+        delegate(document, Rails.formInputClickSelector, 'click', handleDisabledElement);
+        delegate(document, Rails.formInputClickSelector, 'click', handleConfirm);
+        delegate(document, Rails.formInputClickSelector, 'click', formSubmitButtonClick);
+        document.addEventListener('DOMContentLoaded', refreshCSRFTokens);
+        document.addEventListener('DOMContentLoaded', loadCSPNonce);
+        return window._rails_loaded = true;
+      };
+
+      if (window.Rails === Rails && fire(document, 'rails:attachBindings')) {
+        Rails.start();
+      }
+
+    }).call(this);
+  }).call(this);
+
+  if (typeof module === "object" && module.exports) {
+    module.exports = Rails;
+  } else if (typeof define === "function" && define.amd) {
+    define(Rails);
+  }
+}).call(this);
+(function(global, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports) : typeof define === "function" && define.amd ? define([ "exports" ], factory) : factory(global.ActiveStorage = {});
+})(this, function(exports) {
+  "use strict";
+  function createCommonjsModule(fn, module) {
+    return module = {
+      exports: {}
+    }, fn(module, module.exports), module.exports;
+  }
+  var sparkMd5 = createCommonjsModule(function(module, exports) {
+    (function(factory) {
+      {
+        module.exports = factory();
+      }
+    })(function(undefined) {
+      var hex_chr = [ "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f" ];
+      function md5cycle(x, k) {
+        var a = x[0], b = x[1], c = x[2], d = x[3];
+        a += (b & c | ~b & d) + k[0] - 680876936 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[1] - 389564586 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[2] + 606105819 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[3] - 1044525330 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & c | ~b & d) + k[4] - 176418897 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[5] + 1200080426 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[6] - 1473231341 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[7] - 45705983 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & c | ~b & d) + k[8] + 1770035416 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[9] - 1958414417 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[10] - 42063 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[11] - 1990404162 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & c | ~b & d) + k[12] + 1804603682 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[13] - 40341101 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[14] - 1502002290 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[15] + 1236535329 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & d | c & ~d) + k[1] - 165796510 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[6] - 1069501632 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[11] + 643717713 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[0] - 373897302 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b & d | c & ~d) + k[5] - 701558691 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[10] + 38016083 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[15] - 660478335 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[4] - 405537848 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b & d | c & ~d) + k[9] + 568446438 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[14] - 1019803690 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[3] - 187363961 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[8] + 1163531501 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b & d | c & ~d) + k[13] - 1444681467 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[2] - 51403784 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[7] + 1735328473 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[12] - 1926607734 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b ^ c ^ d) + k[5] - 378558 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[8] - 2022574463 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[11] + 1839030562 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[14] - 35309556 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (b ^ c ^ d) + k[1] - 1530992060 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[4] + 1272893353 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[7] - 155497632 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[10] - 1094730640 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (b ^ c ^ d) + k[13] + 681279174 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[0] - 358537222 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[3] - 722521979 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[6] + 76029189 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (b ^ c ^ d) + k[9] - 640364487 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[12] - 421815835 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[15] + 530742520 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[2] - 995338651 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (c ^ (b | ~d)) + k[0] - 198630844 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[7] + 1126891415 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[14] - 1416354905 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[5] - 57434055 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        a += (c ^ (b | ~d)) + k[12] + 1700485571 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[3] - 1894986606 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[10] - 1051523 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[1] - 2054922799 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        a += (c ^ (b | ~d)) + k[8] + 1873313359 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[15] - 30611744 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[6] - 1560198380 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[13] + 1309151649 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        a += (c ^ (b | ~d)) + k[4] - 145523070 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[11] - 1120210379 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[2] + 718787259 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[9] - 343485551 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        x[0] = a + x[0] | 0;
+        x[1] = b + x[1] | 0;
+        x[2] = c + x[2] | 0;
+        x[3] = d + x[3] | 0;
+      }
+      function md5blk(s) {
+        var md5blks = [], i;
+        for (i = 0; i < 64; i += 4) {
+          md5blks[i >> 2] = s.charCodeAt(i) + (s.charCodeAt(i + 1) << 8) + (s.charCodeAt(i + 2) << 16) + (s.charCodeAt(i + 3) << 24);
+        }
+        return md5blks;
+      }
+      function md5blk_array(a) {
+        var md5blks = [], i;
+        for (i = 0; i < 64; i += 4) {
+          md5blks[i >> 2] = a[i] + (a[i + 1] << 8) + (a[i + 2] << 16) + (a[i + 3] << 24);
+        }
+        return md5blks;
+      }
+      function md51(s) {
+        var n = s.length, state = [ 1732584193, -271733879, -1732584194, 271733878 ], i, length, tail, tmp, lo, hi;
+        for (i = 64; i <= n; i += 64) {
+          md5cycle(state, md5blk(s.substring(i - 64, i)));
+        }
+        s = s.substring(i - 64);
+        length = s.length;
+        tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= s.charCodeAt(i) << (i % 4 << 3);
+        }
+        tail[i >> 2] |= 128 << (i % 4 << 3);
+        if (i > 55) {
+          md5cycle(state, tail);
+          for (i = 0; i < 16; i += 1) {
+            tail[i] = 0;
+          }
+        }
+        tmp = n * 8;
+        tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
+        lo = parseInt(tmp[2], 16);
+        hi = parseInt(tmp[1], 16) || 0;
+        tail[14] = lo;
+        tail[15] = hi;
+        md5cycle(state, tail);
+        return state;
+      }
+      function md51_array(a) {
+        var n = a.length, state = [ 1732584193, -271733879, -1732584194, 271733878 ], i, length, tail, tmp, lo, hi;
+        for (i = 64; i <= n; i += 64) {
+          md5cycle(state, md5blk_array(a.subarray(i - 64, i)));
+        }
+        a = i - 64 < n ? a.subarray(i - 64) : new Uint8Array(0);
+        length = a.length;
+        tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= a[i] << (i % 4 << 3);
+        }
+        tail[i >> 2] |= 128 << (i % 4 << 3);
+        if (i > 55) {
+          md5cycle(state, tail);
+          for (i = 0; i < 16; i += 1) {
+            tail[i] = 0;
+          }
+        }
+        tmp = n * 8;
+        tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
+        lo = parseInt(tmp[2], 16);
+        hi = parseInt(tmp[1], 16) || 0;
+        tail[14] = lo;
+        tail[15] = hi;
+        md5cycle(state, tail);
+        return state;
+      }
+      function rhex(n) {
+        var s = "", j;
+        for (j = 0; j < 4; j += 1) {
+          s += hex_chr[n >> j * 8 + 4 & 15] + hex_chr[n >> j * 8 & 15];
+        }
+        return s;
+      }
+      function hex(x) {
+        var i;
+        for (i = 0; i < x.length; i += 1) {
+          x[i] = rhex(x[i]);
+        }
+        return x.join("");
+      }
+      if (hex(md51("hello")) !== "5d41402abc4b2a76b9719d911017c592") ;
+      if (typeof ArrayBuffer !== "undefined" && !ArrayBuffer.prototype.slice) {
+        (function() {
+          function clamp(val, length) {
+            val = val | 0 || 0;
+            if (val < 0) {
+              return Math.max(val + length, 0);
+            }
+            return Math.min(val, length);
+          }
+          ArrayBuffer.prototype.slice = function(from, to) {
+            var length = this.byteLength, begin = clamp(from, length), end = length, num, target, targetArray, sourceArray;
+            if (to !== undefined) {
+              end = clamp(to, length);
+            }
+            if (begin > end) {
+              return new ArrayBuffer(0);
+            }
+            num = end - begin;
+            target = new ArrayBuffer(num);
+            targetArray = new Uint8Array(target);
+            sourceArray = new Uint8Array(this, begin, num);
+            targetArray.set(sourceArray);
+            return target;
+          };
+        })();
+      }
+      function toUtf8(str) {
+        if (/[\u0080-\uFFFF]/.test(str)) {
+          str = unescape(encodeURIComponent(str));
+        }
+        return str;
+      }
+      function utf8Str2ArrayBuffer(str, returnUInt8Array) {
+        var length = str.length, buff = new ArrayBuffer(length), arr = new Uint8Array(buff), i;
+        for (i = 0; i < length; i += 1) {
+          arr[i] = str.charCodeAt(i);
+        }
+        return returnUInt8Array ? arr : buff;
+      }
+      function arrayBuffer2Utf8Str(buff) {
+        return String.fromCharCode.apply(null, new Uint8Array(buff));
+      }
+      function concatenateArrayBuffers(first, second, returnUInt8Array) {
+        var result = new Uint8Array(first.byteLength + second.byteLength);
+        result.set(new Uint8Array(first));
+        result.set(new Uint8Array(second), first.byteLength);
+        return returnUInt8Array ? result : result.buffer;
+      }
+      function hexToBinaryString(hex) {
+        var bytes = [], length = hex.length, x;
+        for (x = 0; x < length - 1; x += 2) {
+          bytes.push(parseInt(hex.substr(x, 2), 16));
+        }
+        return String.fromCharCode.apply(String, bytes);
+      }
+      function SparkMD5() {
+        this.reset();
+      }
+      SparkMD5.prototype.append = function(str) {
+        this.appendBinary(toUtf8(str));
+        return this;
+      };
+      SparkMD5.prototype.appendBinary = function(contents) {
+        this._buff += contents;
+        this._length += contents.length;
+        var length = this._buff.length, i;
+        for (i = 64; i <= length; i += 64) {
+          md5cycle(this._hash, md5blk(this._buff.substring(i - 64, i)));
+        }
+        this._buff = this._buff.substring(i - 64);
+        return this;
+      };
+      SparkMD5.prototype.end = function(raw) {
+        var buff = this._buff, length = buff.length, i, tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], ret;
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= buff.charCodeAt(i) << (i % 4 << 3);
+        }
+        this._finish(tail, length);
+        ret = hex(this._hash);
+        if (raw) {
+          ret = hexToBinaryString(ret);
+        }
+        this.reset();
+        return ret;
+      };
+      SparkMD5.prototype.reset = function() {
+        this._buff = "";
+        this._length = 0;
+        this._hash = [ 1732584193, -271733879, -1732584194, 271733878 ];
+        return this;
+      };
+      SparkMD5.prototype.getState = function() {
+        return {
+          buff: this._buff,
+          length: this._length,
+          hash: this._hash
+        };
+      };
+      SparkMD5.prototype.setState = function(state) {
+        this._buff = state.buff;
+        this._length = state.length;
+        this._hash = state.hash;
+        return this;
+      };
+      SparkMD5.prototype.destroy = function() {
+        delete this._hash;
+        delete this._buff;
+        delete this._length;
+      };
+      SparkMD5.prototype._finish = function(tail, length) {
+        var i = length, tmp, lo, hi;
+        tail[i >> 2] |= 128 << (i % 4 << 3);
+        if (i > 55) {
+          md5cycle(this._hash, tail);
+          for (i = 0; i < 16; i += 1) {
+            tail[i] = 0;
+          }
+        }
+        tmp = this._length * 8;
+        tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
+        lo = parseInt(tmp[2], 16);
+        hi = parseInt(tmp[1], 16) || 0;
+        tail[14] = lo;
+        tail[15] = hi;
+        md5cycle(this._hash, tail);
+      };
+      SparkMD5.hash = function(str, raw) {
+        return SparkMD5.hashBinary(toUtf8(str), raw);
+      };
+      SparkMD5.hashBinary = function(content, raw) {
+        var hash = md51(content), ret = hex(hash);
+        return raw ? hexToBinaryString(ret) : ret;
+      };
+      SparkMD5.ArrayBuffer = function() {
+        this.reset();
+      };
+      SparkMD5.ArrayBuffer.prototype.append = function(arr) {
+        var buff = concatenateArrayBuffers(this._buff.buffer, arr, true), length = buff.length, i;
+        this._length += arr.byteLength;
+        for (i = 64; i <= length; i += 64) {
+          md5cycle(this._hash, md5blk_array(buff.subarray(i - 64, i)));
+        }
+        this._buff = i - 64 < length ? new Uint8Array(buff.buffer.slice(i - 64)) : new Uint8Array(0);
+        return this;
+      };
+      SparkMD5.ArrayBuffer.prototype.end = function(raw) {
+        var buff = this._buff, length = buff.length, tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], i, ret;
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= buff[i] << (i % 4 << 3);
+        }
+        this._finish(tail, length);
+        ret = hex(this._hash);
+        if (raw) {
+          ret = hexToBinaryString(ret);
+        }
+        this.reset();
+        return ret;
+      };
+      SparkMD5.ArrayBuffer.prototype.reset = function() {
+        this._buff = new Uint8Array(0);
+        this._length = 0;
+        this._hash = [ 1732584193, -271733879, -1732584194, 271733878 ];
+        return this;
+      };
+      SparkMD5.ArrayBuffer.prototype.getState = function() {
+        var state = SparkMD5.prototype.getState.call(this);
+        state.buff = arrayBuffer2Utf8Str(state.buff);
+        return state;
+      };
+      SparkMD5.ArrayBuffer.prototype.setState = function(state) {
+        state.buff = utf8Str2ArrayBuffer(state.buff, true);
+        return SparkMD5.prototype.setState.call(this, state);
+      };
+      SparkMD5.ArrayBuffer.prototype.destroy = SparkMD5.prototype.destroy;
+      SparkMD5.ArrayBuffer.prototype._finish = SparkMD5.prototype._finish;
+      SparkMD5.ArrayBuffer.hash = function(arr, raw) {
+        var hash = md51_array(new Uint8Array(arr)), ret = hex(hash);
+        return raw ? hexToBinaryString(ret) : ret;
+      };
+      return SparkMD5;
+    });
+  });
+  var classCallCheck = function(instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError("Cannot call a class as a function");
+    }
+  };
+  var createClass = function() {
+    function defineProperties(target, props) {
+      for (var i = 0; i < props.length; i++) {
+        var descriptor = props[i];
+        descriptor.enumerable = descriptor.enumerable || false;
+        descriptor.configurable = true;
+        if ("value" in descriptor) descriptor.writable = true;
+        Object.defineProperty(target, descriptor.key, descriptor);
+      }
+    }
+    return function(Constructor, protoProps, staticProps) {
+      if (protoProps) defineProperties(Constructor.prototype, protoProps);
+      if (staticProps) defineProperties(Constructor, staticProps);
+      return Constructor;
+    };
+  }();
+  var fileSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice;
+  var FileChecksum = function() {
+    createClass(FileChecksum, null, [ {
+      key: "create",
+      value: function create(file, callback) {
+        var instance = new FileChecksum(file);
+        instance.create(callback);
+      }
+    } ]);
+    function FileChecksum(file) {
+      classCallCheck(this, FileChecksum);
+      this.file = file;
+      this.chunkSize = 2097152;
+      this.chunkCount = Math.ceil(this.file.size / this.chunkSize);
+      this.chunkIndex = 0;
+    }
+    createClass(FileChecksum, [ {
+      key: "create",
+      value: function create(callback) {
+        var _this = this;
+        this.callback = callback;
+        this.md5Buffer = new sparkMd5.ArrayBuffer();
+        this.fileReader = new FileReader();
+        this.fileReader.addEventListener("load", function(event) {
+          return _this.fileReaderDidLoad(event);
+        });
+        this.fileReader.addEventListener("error", function(event) {
+          return _this.fileReaderDidError(event);
+        });
+        this.readNextChunk();
+      }
+    }, {
+      key: "fileReaderDidLoad",
+      value: function fileReaderDidLoad(event) {
+        this.md5Buffer.append(event.target.result);
+        if (!this.readNextChunk()) {
+          var binaryDigest = this.md5Buffer.end(true);
+          var base64digest = btoa(binaryDigest);
+          this.callback(null, base64digest);
+        }
+      }
+    }, {
+      key: "fileReaderDidError",
+      value: function fileReaderDidError(event) {
+        this.callback("Error reading " + this.file.name);
+      }
+    }, {
+      key: "readNextChunk",
+      value: function readNextChunk() {
+        if (this.chunkIndex < this.chunkCount || this.chunkIndex == 0 && this.chunkCount == 0) {
+          var start = this.chunkIndex * this.chunkSize;
+          var end = Math.min(start + this.chunkSize, this.file.size);
+          var bytes = fileSlice.call(this.file, start, end);
+          this.fileReader.readAsArrayBuffer(bytes);
+          this.chunkIndex++;
+          return true;
+        } else {
+          return false;
+        }
+      }
+    } ]);
+    return FileChecksum;
+  }();
+  function getMetaValue(name) {
+    var element = findElement(document.head, 'meta[name="' + name + '"]');
+    if (element) {
+      return element.getAttribute("content");
+    }
+  }
+  function findElements(root, selector) {
+    if (typeof root == "string") {
+      selector = root;
+      root = document;
+    }
+    var elements = root.querySelectorAll(selector);
+    return toArray$1(elements);
+  }
+  function findElement(root, selector) {
+    if (typeof root == "string") {
+      selector = root;
+      root = document;
+    }
+    return root.querySelector(selector);
+  }
+  function dispatchEvent(element, type) {
+    var eventInit = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    var disabled = element.disabled;
+    var bubbles = eventInit.bubbles, cancelable = eventInit.cancelable, detail = eventInit.detail;
+    var event = document.createEvent("Event");
+    event.initEvent(type, bubbles || true, cancelable || true);
+    event.detail = detail || {};
+    try {
+      element.disabled = false;
+      element.dispatchEvent(event);
+    } finally {
+      element.disabled = disabled;
+    }
+    return event;
+  }
+  function toArray$1(value) {
+    if (Array.isArray(value)) {
+      return value;
+    } else if (Array.from) {
+      return Array.from(value);
+    } else {
+      return [].slice.call(value);
+    }
+  }
+  var BlobRecord = function() {
+    function BlobRecord(file, checksum, url) {
+      var _this = this;
+      classCallCheck(this, BlobRecord);
+      this.file = file;
+      this.attributes = {
+        filename: file.name,
+        content_type: file.type,
+        byte_size: file.size,
+        checksum: checksum
+      };
+      this.xhr = new XMLHttpRequest();
+      this.xhr.open("POST", url, true);
+      this.xhr.responseType = "json";
+      this.xhr.setRequestHeader("Content-Type", "application/json");
+      this.xhr.setRequestHeader("Accept", "application/json");
+      this.xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
+      this.xhr.setRequestHeader("X-CSRF-Token", getMetaValue("csrf-token"));
+      this.xhr.addEventListener("load", function(event) {
+        return _this.requestDidLoad(event);
+      });
+      this.xhr.addEventListener("error", function(event) {
+        return _this.requestDidError(event);
+      });
+    }
+    createClass(BlobRecord, [ {
+      key: "create",
+      value: function create(callback) {
+        this.callback = callback;
+        this.xhr.send(JSON.stringify({
+          blob: this.attributes
+        }));
+      }
+    }, {
+      key: "requestDidLoad",
+      value: function requestDidLoad(event) {
+        if (this.status >= 200 && this.status < 300) {
+          var response = this.response;
+          var direct_upload = response.direct_upload;
+          delete response.direct_upload;
+          this.attributes = response;
+          this.directUploadData = direct_upload;
+          this.callback(null, this.toJSON());
+        } else {
+          this.requestDidError(event);
+        }
+      }
+    }, {
+      key: "requestDidError",
+      value: function requestDidError(event) {
+        this.callback('Error creating Blob for "' + this.file.name + '". Status: ' + this.status);
+      }
+    }, {
+      key: "toJSON",
+      value: function toJSON() {
+        var result = {};
+        for (var key in this.attributes) {
+          result[key] = this.attributes[key];
+        }
+        return result;
+      }
+    }, {
+      key: "status",
+      get: function get$$1() {
+        return this.xhr.status;
+      }
+    }, {
+      key: "response",
+      get: function get$$1() {
+        var _xhr = this.xhr, responseType = _xhr.responseType, response = _xhr.response;
+        if (responseType == "json") {
+          return response;
+        } else {
+          return JSON.parse(response);
+        }
+      }
+    } ]);
+    return BlobRecord;
+  }();
+  var BlobUpload = function() {
+    function BlobUpload(blob) {
+      var _this = this;
+      classCallCheck(this, BlobUpload);
+      this.blob = blob;
+      this.file = blob.file;
+      var _blob$directUploadDat = blob.directUploadData, url = _blob$directUploadDat.url, headers = _blob$directUploadDat.headers;
+      this.xhr = new XMLHttpRequest();
+      this.xhr.open("PUT", url, true);
+      this.xhr.responseType = "text";
+      for (var key in headers) {
+        this.xhr.setRequestHeader(key, headers[key]);
+      }
+      this.xhr.addEventListener("load", function(event) {
+        return _this.requestDidLoad(event);
+      });
+      this.xhr.addEventListener("error", function(event) {
+        return _this.requestDidError(event);
+      });
+    }
+    createClass(BlobUpload, [ {
+      key: "create",
+      value: function create(callback) {
+        this.callback = callback;
+        this.xhr.send(this.file.slice());
+      }
+    }, {
+      key: "requestDidLoad",
+      value: function requestDidLoad(event) {
+        var _xhr = this.xhr, status = _xhr.status, response = _xhr.response;
+        if (status >= 200 && status < 300) {
+          this.callback(null, response);
+        } else {
+          this.requestDidError(event);
+        }
+      }
+    }, {
+      key: "requestDidError",
+      value: function requestDidError(event) {
+        this.callback('Error storing "' + this.file.name + '". Status: ' + this.xhr.status);
+      }
+    } ]);
+    return BlobUpload;
+  }();
+  var id = 0;
+  var DirectUpload = function() {
+    function DirectUpload(file, url, delegate) {
+      classCallCheck(this, DirectUpload);
+      this.id = ++id;
+      this.file = file;
+      this.url = url;
+      this.delegate = delegate;
+    }
+    createClass(DirectUpload, [ {
+      key: "create",
+      value: function create(callback) {
+        var _this = this;
+        FileChecksum.create(this.file, function(error, checksum) {
+          if (error) {
+            callback(error);
+            return;
+          }
+          var blob = new BlobRecord(_this.file, checksum, _this.url);
+          notify(_this.delegate, "directUploadWillCreateBlobWithXHR", blob.xhr);
+          blob.create(function(error) {
+            if (error) {
+              callback(error);
+            } else {
+              var upload = new BlobUpload(blob);
+              notify(_this.delegate, "directUploadWillStoreFileWithXHR", upload.xhr);
+              upload.create(function(error) {
+                if (error) {
+                  callback(error);
+                } else {
+                  callback(null, blob.toJSON());
+                }
+              });
+            }
+          });
+        });
+      }
+    } ]);
+    return DirectUpload;
+  }();
+  function notify(object, methodName) {
+    if (object && typeof object[methodName] == "function") {
+      for (var _len = arguments.length, messages = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+        messages[_key - 2] = arguments[_key];
+      }
+      return object[methodName].apply(object, messages);
+    }
+  }
+  var DirectUploadController = function() {
+    function DirectUploadController(input, file) {
+      classCallCheck(this, DirectUploadController);
+      this.input = input;
+      this.file = file;
+      this.directUpload = new DirectUpload(this.file, this.url, this);
+      this.dispatch("initialize");
+    }
+    createClass(DirectUploadController, [ {
+      key: "start",
+      value: function start(callback) {
+        var _this = this;
+        var hiddenInput = document.createElement("input");
+        hiddenInput.type = "hidden";
+        hiddenInput.name = this.input.name;
+        this.input.insertAdjacentElement("beforebegin", hiddenInput);
+        this.dispatch("start");
+        this.directUpload.create(function(error, attributes) {
+          if (error) {
+            hiddenInput.parentNode.removeChild(hiddenInput);
+            _this.dispatchError(error);
+          } else {
+            hiddenInput.value = attributes.signed_id;
+          }
+          _this.dispatch("end");
+          callback(error);
+        });
+      }
+    }, {
+      key: "uploadRequestDidProgress",
+      value: function uploadRequestDidProgress(event) {
+        var progress = event.loaded / event.total * 100;
+        if (progress) {
+          this.dispatch("progress", {
+            progress: progress
+          });
+        }
+      }
+    }, {
+      key: "dispatch",
+      value: function dispatch(name) {
+        var detail = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+        detail.file = this.file;
+        detail.id = this.directUpload.id;
+        return dispatchEvent(this.input, "direct-upload:" + name, {
+          detail: detail
+        });
+      }
+    }, {
+      key: "dispatchError",
+      value: function dispatchError(error) {
+        var event = this.dispatch("error", {
+          error: error
+        });
+        if (!event.defaultPrevented) {
+          alert(error);
+        }
+      }
+    }, {
+      key: "directUploadWillCreateBlobWithXHR",
+      value: function directUploadWillCreateBlobWithXHR(xhr) {
+        this.dispatch("before-blob-request", {
+          xhr: xhr
+        });
+      }
+    }, {
+      key: "directUploadWillStoreFileWithXHR",
+      value: function directUploadWillStoreFileWithXHR(xhr) {
+        var _this2 = this;
+        this.dispatch("before-storage-request", {
+          xhr: xhr
+        });
+        xhr.upload.addEventListener("progress", function(event) {
+          return _this2.uploadRequestDidProgress(event);
+        });
+      }
+    }, {
+      key: "url",
+      get: function get$$1() {
+        return this.input.getAttribute("data-direct-upload-url");
+      }
+    } ]);
+    return DirectUploadController;
+  }();
+  var inputSelector = "input[type=file][data-direct-upload-url]:not([disabled])";
+  var DirectUploadsController = function() {
+    function DirectUploadsController(form) {
+      classCallCheck(this, DirectUploadsController);
+      this.form = form;
+      this.inputs = findElements(form, inputSelector).filter(function(input) {
+        return input.files.length;
+      });
+    }
+    createClass(DirectUploadsController, [ {
+      key: "start",
+      value: function start(callback) {
+        var _this = this;
+        var controllers = this.createDirectUploadControllers();
+        var startNextController = function startNextController() {
+          var controller = controllers.shift();
+          if (controller) {
+            controller.start(function(error) {
+              if (error) {
+                callback(error);
+                _this.dispatch("end");
+              } else {
+                startNextController();
+              }
+            });
+          } else {
+            callback();
+            _this.dispatch("end");
+          }
+        };
+        this.dispatch("start");
+        startNextController();
+      }
+    }, {
+      key: "createDirectUploadControllers",
+      value: function createDirectUploadControllers() {
+        var controllers = [];
+        this.inputs.forEach(function(input) {
+          toArray$1(input.files).forEach(function(file) {
+            var controller = new DirectUploadController(input, file);
+            controllers.push(controller);
+          });
+        });
+        return controllers;
+      }
+    }, {
+      key: "dispatch",
+      value: function dispatch(name) {
+        var detail = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+        return dispatchEvent(this.form, "direct-uploads:" + name, {
+          detail: detail
+        });
+      }
+    } ]);
+    return DirectUploadsController;
+  }();
+  var processingAttribute = "data-direct-uploads-processing";
+  var submitButtonsByForm = new WeakMap();
+  var started = false;
+  function start() {
+    if (!started) {
+      started = true;
+      document.addEventListener("click", didClick, true);
+      document.addEventListener("submit", didSubmitForm);
+      document.addEventListener("ajax:before", didSubmitRemoteElement);
+    }
+  }
+  function didClick(event) {
+    var target = event.target;
+    if ((target.tagName == "INPUT" || target.tagName == "BUTTON") && target.type == "submit" && target.form) {
+      submitButtonsByForm.set(target.form, target);
+    }
+  }
+  function didSubmitForm(event) {
+    handleFormSubmissionEvent(event);
+  }
+  function didSubmitRemoteElement(event) {
+    if (event.target.tagName == "FORM") {
+      handleFormSubmissionEvent(event);
+    }
+  }
+  function handleFormSubmissionEvent(event) {
+    var form = event.target;
+    if (form.hasAttribute(processingAttribute)) {
+      event.preventDefault();
+      return;
+    }
+    var controller = new DirectUploadsController(form);
+    var inputs = controller.inputs;
+    if (inputs.length) {
+      event.preventDefault();
+      form.setAttribute(processingAttribute, "");
+      inputs.forEach(disable);
+      controller.start(function(error) {
+        form.removeAttribute(processingAttribute);
+        if (error) {
+          inputs.forEach(enable);
+        } else {
+          submitForm(form);
+        }
+      });
+    }
+  }
+  function submitForm(form) {
+    var button = submitButtonsByForm.get(form) || findElement(form, "input[type=submit], button[type=submit]");
+    if (button) {
+      var _button = button, disabled = _button.disabled;
+      button.disabled = false;
+      button.focus();
+      button.click();
+      button.disabled = disabled;
+    } else {
+      button = document.createElement("input");
+      button.type = "submit";
+      button.style.display = "none";
+      form.appendChild(button);
+      button.click();
+      form.removeChild(button);
+    }
+    submitButtonsByForm.delete(form);
+  }
+  function disable(input) {
+    input.disabled = true;
+  }
+  function enable(input) {
+    input.disabled = false;
+  }
+  function autostart() {
+    if (window.ActiveStorage) {
+      start();
+    }
+  }
+  setTimeout(autostart, 1);
+  exports.start = start;
+  exports.DirectUpload = DirectUpload;
+  Object.defineProperty(exports, "__esModule", {
+    value: true
+  });
+});
+/*
+Turbolinks 5.2.0
+Copyright © 2018 Basecamp, LLC
+ */
+
+(function(){var t=this;(function(){(function(){this.Turbolinks={supported:function(){return null!=window.history.pushState&&null!=window.requestAnimationFrame&&null!=window.addEventListener}(),visit:function(t,r){return e.controller.visit(t,r)},clearCache:function(){return e.controller.clearCache()},setProgressBarDelay:function(t){return e.controller.setProgressBarDelay(t)}}}).call(this)}).call(t);var e=t.Turbolinks;(function(){(function(){var t,r,n,o=[].slice;e.copyObject=function(t){var e,r,n;r={};for(e in t)n=t[e],r[e]=n;return r},e.closest=function(e,r){return t.call(e,r)},t=function(){var t,e;return t=document.documentElement,null!=(e=t.closest)?e:function(t){var e;for(e=this;e;){if(e.nodeType===Node.ELEMENT_NODE&&r.call(e,t))return e;e=e.parentNode}}}(),e.defer=function(t){return setTimeout(t,1)},e.throttle=function(t){var e;return e=null,function(){var r;return r=1<=arguments.length?o.call(arguments,0):[],null!=e?e:e=requestAnimationFrame(function(n){return function(){return e=null,t.apply(n,r)}}(this))}},e.dispatch=function(t,e){var r,o,i,s,a,u;return a=null!=e?e:{},u=a.target,r=a.cancelable,o=a.data,i=document.createEvent("Events"),i.initEvent(t,!0,r===!0),i.data=null!=o?o:{},i.cancelable&&!n&&(s=i.preventDefault,i.preventDefault=function(){return this.defaultPrevented||Object.defineProperty(this,"defaultPrevented",{get:function(){return!0}}),s.call(this)}),(null!=u?u:document).dispatchEvent(i),i},n=function(){var t;return t=document.createEvent("Events"),t.initEvent("test",!0,!0),t.preventDefault(),t.defaultPrevented}(),e.match=function(t,e){return r.call(t,e)},r=function(){var t,e,r,n;return t=document.documentElement,null!=(e=null!=(r=null!=(n=t.matchesSelector)?n:t.webkitMatchesSelector)?r:t.msMatchesSelector)?e:t.mozMatchesSelector}(),e.uuid=function(){var t,e,r;for(r="",t=e=1;36>=e;t=++e)r+=9===t||14===t||19===t||24===t?"-":15===t?"4":20===t?(Math.floor(4*Math.random())+8).toString(16):Math.floor(15*Math.random()).toString(16);return r}}).call(this),function(){e.Location=function(){function t(t){var e,r;null==t&&(t=""),r=document.createElement("a"),r.href=t.toString(),this.absoluteURL=r.href,e=r.hash.length,2>e?this.requestURL=this.absoluteURL:(this.requestURL=this.absoluteURL.slice(0,-e),this.anchor=r.hash.slice(1))}var e,r,n,o;return t.wrap=function(t){return t instanceof this?t:new this(t)},t.prototype.getOrigin=function(){return this.absoluteURL.split("/",3).join("/")},t.prototype.getPath=function(){var t,e;return null!=(t=null!=(e=this.requestURL.match(/\/\/[^\/]*(\/[^?;]*)/))?e[1]:void 0)?t:"/"},t.prototype.getPathComponents=function(){return this.getPath().split("/").slice(1)},t.prototype.getLastPathComponent=function(){return this.getPathComponents().slice(-1)[0]},t.prototype.getExtension=function(){var t,e;return null!=(t=null!=(e=this.getLastPathComponent().match(/\.[^.]*$/))?e[0]:void 0)?t:""},t.prototype.isHTML=function(){return this.getExtension().match(/^(?:|\.(?:htm|html|xhtml))$/)},t.prototype.isPrefixedBy=function(t){var e;return e=r(t),this.isEqualTo(t)||o(this.absoluteURL,e)},t.prototype.isEqualTo=function(t){return this.absoluteURL===(null!=t?t.absoluteURL:void 0)},t.prototype.toCacheKey=function(){return this.requestURL},t.prototype.toJSON=function(){return this.absoluteURL},t.prototype.toString=function(){return this.absoluteURL},t.prototype.valueOf=function(){return this.absoluteURL},r=function(t){return e(t.getOrigin()+t.getPath())},e=function(t){return n(t,"/")?t:t+"/"},o=function(t,e){return t.slice(0,e.length)===e},n=function(t,e){return t.slice(-e.length)===e},t}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.HttpRequest=function(){function r(r,n,o){this.delegate=r,this.requestCanceled=t(this.requestCanceled,this),this.requestTimedOut=t(this.requestTimedOut,this),this.requestFailed=t(this.requestFailed,this),this.requestLoaded=t(this.requestLoaded,this),this.requestProgressed=t(this.requestProgressed,this),this.url=e.Location.wrap(n).requestURL,this.referrer=e.Location.wrap(o).absoluteURL,this.createXHR()}return r.NETWORK_FAILURE=0,r.TIMEOUT_FAILURE=-1,r.timeout=60,r.prototype.send=function(){var t;return this.xhr&&!this.sent?(this.notifyApplicationBeforeRequestStart(),this.setProgress(0),this.xhr.send(),this.sent=!0,"function"==typeof(t=this.delegate).requestStarted?t.requestStarted():void 0):void 0},r.prototype.cancel=function(){return this.xhr&&this.sent?this.xhr.abort():void 0},r.prototype.requestProgressed=function(t){return t.lengthComputable?this.setProgress(t.loaded/t.total):void 0},r.prototype.requestLoaded=function(){return this.endRequest(function(t){return function(){var e;return 200<=(e=t.xhr.status)&&300>e?t.delegate.requestCompletedWithResponse(t.xhr.responseText,t.xhr.getResponseHeader("Turbolinks-Location")):(t.failed=!0,t.delegate.requestFailedWithStatusCode(t.xhr.status,t.xhr.responseText))}}(this))},r.prototype.requestFailed=function(){return this.endRequest(function(t){return function(){return t.failed=!0,t.delegate.requestFailedWithStatusCode(t.constructor.NETWORK_FAILURE)}}(this))},r.prototype.requestTimedOut=function(){return this.endRequest(function(t){return function(){return t.failed=!0,t.delegate.requestFailedWithStatusCode(t.constructor.TIMEOUT_FAILURE)}}(this))},r.prototype.requestCanceled=function(){return this.endRequest()},r.prototype.notifyApplicationBeforeRequestStart=function(){return e.dispatch("turbolinks:request-start",{data:{url:this.url,xhr:this.xhr}})},r.prototype.notifyApplicationAfterRequestEnd=function(){return e.dispatch("turbolinks:request-end",{data:{url:this.url,xhr:this.xhr}})},r.prototype.createXHR=function(){return this.xhr=new XMLHttpRequest,this.xhr.open("GET",this.url,!0),this.xhr.timeout=1e3*this.constructor.timeout,this.xhr.setRequestHeader("Accept","text/html, application/xhtml+xml"),this.xhr.setRequestHeader("Turbolinks-Referrer",this.referrer),this.xhr.onprogress=this.requestProgressed,this.xhr.onload=this.requestLoaded,this.xhr.onerror=this.requestFailed,this.xhr.ontimeout=this.requestTimedOut,this.xhr.onabort=this.requestCanceled},r.prototype.endRequest=function(t){return this.xhr?(this.notifyApplicationAfterRequestEnd(),null!=t&&t.call(this),this.destroy()):void 0},r.prototype.setProgress=function(t){var e;return this.progress=t,"function"==typeof(e=this.delegate).requestProgressed?e.requestProgressed(this.progress):void 0},r.prototype.destroy=function(){var t;return this.setProgress(1),"function"==typeof(t=this.delegate).requestFinished&&t.requestFinished(),this.delegate=null,this.xhr=null},r}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.ProgressBar=function(){function e(){this.trickle=t(this.trickle,this),this.stylesheetElement=this.createStylesheetElement(),this.progressElement=this.createProgressElement()}var r;return r=300,e.defaultCSS=".turbolinks-progress-bar {\n  position: fixed;\n  display: block;\n  top: 0;\n  left: 0;\n  height: 3px;\n  background: #0076ff;\n  z-index: 9999;\n  transition: width "+r+"ms ease-out, opacity "+r/2+"ms "+r/2+"ms ease-in;\n  transform: translate3d(0, 0, 0);\n}",e.prototype.show=function(){return this.visible?void 0:(this.visible=!0,this.installStylesheetElement(),this.installProgressElement(),this.startTrickling())},e.prototype.hide=function(){return this.visible&&!this.hiding?(this.hiding=!0,this.fadeProgressElement(function(t){return function(){return t.uninstallProgressElement(),t.stopTrickling(),t.visible=!1,t.hiding=!1}}(this))):void 0},e.prototype.setValue=function(t){return this.value=t,this.refresh()},e.prototype.installStylesheetElement=function(){return document.head.insertBefore(this.stylesheetElement,document.head.firstChild)},e.prototype.installProgressElement=function(){return this.progressElement.style.width=0,this.progressElement.style.opacity=1,document.documentElement.insertBefore(this.progressElement,document.body),this.refresh()},e.prototype.fadeProgressElement=function(t){return this.progressElement.style.opacity=0,setTimeout(t,1.5*r)},e.prototype.uninstallProgressElement=function(){return this.progressElement.parentNode?document.documentElement.removeChild(this.progressElement):void 0},e.prototype.startTrickling=function(){return null!=this.trickleInterval?this.trickleInterval:this.trickleInterval=setInterval(this.trickle,r)},e.prototype.stopTrickling=function(){return clearInterval(this.trickleInterval),this.trickleInterval=null},e.prototype.trickle=function(){return this.setValue(this.value+Math.random()/100)},e.prototype.refresh=function(){return requestAnimationFrame(function(t){return function(){return t.progressElement.style.width=10+90*t.value+"%"}}(this))},e.prototype.createStylesheetElement=function(){var t;return t=document.createElement("style"),t.type="text/css",t.textContent=this.constructor.defaultCSS,t},e.prototype.createProgressElement=function(){var t;return t=document.createElement("div"),t.className="turbolinks-progress-bar",t},e}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.BrowserAdapter=function(){function r(r){this.controller=r,this.showProgressBar=t(this.showProgressBar,this),this.progressBar=new e.ProgressBar}var n,o,i;return i=e.HttpRequest,n=i.NETWORK_FAILURE,o=i.TIMEOUT_FAILURE,r.prototype.visitProposedToLocationWithAction=function(t,e){return this.controller.startVisitToLocationWithAction(t,e)},r.prototype.visitStarted=function(t){return t.issueRequest(),t.changeHistory(),t.loadCachedSnapshot()},r.prototype.visitRequestStarted=function(t){return this.progressBar.setValue(0),t.hasCachedSnapshot()||"restore"!==t.action?this.showProgressBarAfterDelay():this.showProgressBar()},r.prototype.visitRequestProgressed=function(t){return this.progressBar.setValue(t.progress)},r.prototype.visitRequestCompleted=function(t){return t.loadResponse()},r.prototype.visitRequestFailedWithStatusCode=function(t,e){switch(e){case n:case o:return this.reload();default:return t.loadResponse()}},r.prototype.visitRequestFinished=function(t){return this.hideProgressBar()},r.prototype.visitCompleted=function(t){return t.followRedirect()},r.prototype.pageInvalidated=function(){return this.reload()},r.prototype.showProgressBarAfterDelay=function(){return this.progressBarTimeout=setTimeout(this.showProgressBar,this.controller.progressBarDelay)},r.prototype.showProgressBar=function(){return this.progressBar.show()},r.prototype.hideProgressBar=function(){return this.progressBar.hide(),clearTimeout(this.progressBarTimeout)},r.prototype.reload=function(){return window.location.reload()},r}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.History=function(){function r(e){this.delegate=e,this.onPageLoad=t(this.onPageLoad,this),this.onPopState=t(this.onPopState,this)}return r.prototype.start=function(){return this.started?void 0:(addEventListener("popstate",this.onPopState,!1),addEventListener("load",this.onPageLoad,!1),this.started=!0)},r.prototype.stop=function(){return this.started?(removeEventListener("popstate",this.onPopState,!1),removeEventListener("load",this.onPageLoad,!1),this.started=!1):void 0},r.prototype.push=function(t,r){return t=e.Location.wrap(t),this.update("push",t,r)},r.prototype.replace=function(t,r){return t=e.Location.wrap(t),this.update("replace",t,r)},r.prototype.onPopState=function(t){var r,n,o,i;return this.shouldHandlePopState()&&(i=null!=(n=t.state)?n.turbolinks:void 0)?(r=e.Location.wrap(window.location),o=i.restorationIdentifier,this.delegate.historyPoppedToLocationWithRestorationIdentifier(r,o)):void 0},r.prototype.onPageLoad=function(t){return e.defer(function(t){return function(){return t.pageLoaded=!0}}(this))},r.prototype.shouldHandlePopState=function(){return this.pageIsLoaded()},r.prototype.pageIsLoaded=function(){return this.pageLoaded||"complete"===document.readyState},r.prototype.update=function(t,e,r){var n;return n={turbolinks:{restorationIdentifier:r}},history[t+"State"](n,null,e)},r}()}.call(this),function(){e.HeadDetails=function(){function t(t){var e,r,n,s,a,u;for(this.elements={},n=0,a=t.length;a>n;n++)u=t[n],u.nodeType===Node.ELEMENT_NODE&&(s=u.outerHTML,r=null!=(e=this.elements)[s]?e[s]:e[s]={type:i(u),tracked:o(u),elements:[]},r.elements.push(u))}var e,r,n,o,i;return t.fromHeadElement=function(t){var e;return new this(null!=(e=null!=t?t.childNodes:void 0)?e:[])},t.prototype.hasElementWithKey=function(t){return t in this.elements},t.prototype.getTrackedElementSignature=function(){var t,e;return function(){var r,n;r=this.elements,n=[];for(t in r)e=r[t].tracked,e&&n.push(t);return n}.call(this).join("")},t.prototype.getScriptElementsNotInDetails=function(t){return this.getElementsMatchingTypeNotInDetails("script",t)},t.prototype.getStylesheetElementsNotInDetails=function(t){return this.getElementsMatchingTypeNotInDetails("stylesheet",t)},t.prototype.getElementsMatchingTypeNotInDetails=function(t,e){var r,n,o,i,s,a;o=this.elements,s=[];for(n in o)i=o[n],a=i.type,r=i.elements,a!==t||e.hasElementWithKey(n)||s.push(r[0]);return s},t.prototype.getProvisionalElements=function(){var t,e,r,n,o,i,s;r=[],n=this.elements;for(e in n)o=n[e],s=o.type,i=o.tracked,t=o.elements,null!=s||i?t.length>1&&r.push.apply(r,t.slice(1)):r.push.apply(r,t);return r},t.prototype.getMetaValue=function(t){var e;return null!=(e=this.findMetaElementByName(t))?e.getAttribute("content"):void 0},t.prototype.findMetaElementByName=function(t){var r,n,o,i;r=void 0,i=this.elements;for(o in i)n=i[o].elements,e(n[0],t)&&(r=n[0]);return r},i=function(t){return r(t)?"script":n(t)?"stylesheet":void 0},o=function(t){return"reload"===t.getAttribute("data-turbolinks-track")},r=function(t){var e;return e=t.tagName.toLowerCase(),"script"===e},n=function(t){var e;return e=t.tagName.toLowerCase(),"style"===e||"link"===e&&"stylesheet"===t.getAttribute("rel")},e=function(t,e){var r;return r=t.tagName.toLowerCase(),"meta"===r&&t.getAttribute("name")===e},t}()}.call(this),function(){e.Snapshot=function(){function t(t,e){this.headDetails=t,this.bodyElement=e}return t.wrap=function(t){return t instanceof this?t:"string"==typeof t?this.fromHTMLString(t):this.fromHTMLElement(t)},t.fromHTMLString=function(t){var e;return e=document.createElement("html"),e.innerHTML=t,this.fromHTMLElement(e)},t.fromHTMLElement=function(t){var r,n,o,i;return o=t.querySelector("head"),r=null!=(i=t.querySelector("body"))?i:document.createElement("body"),n=e.HeadDetails.fromHeadElement(o),new this(n,r)},t.prototype.clone=function(){return new this.constructor(this.headDetails,this.bodyElement.cloneNode(!0))},t.prototype.getRootLocation=function(){var t,r;return r=null!=(t=this.getSetting("root"))?t:"/",new e.Location(r)},t.prototype.getCacheControlValue=function(){return this.getSetting("cache-control")},t.prototype.getElementForAnchor=function(t){try{return this.bodyElement.querySelector("[id='"+t+"'], a[name='"+t+"']")}catch(e){}},t.prototype.getPermanentElements=function(){return this.bodyElement.querySelectorAll("[id][data-turbolinks-permanent]")},t.prototype.getPermanentElementById=function(t){return this.bodyElement.querySelector("#"+t+"[data-turbolinks-permanent]")},t.prototype.getPermanentElementsPresentInSnapshot=function(t){var e,r,n,o,i;for(o=this.getPermanentElements(),i=[],r=0,n=o.length;n>r;r++)e=o[r],t.getPermanentElementById(e.id)&&i.push(e);return i},t.prototype.findFirstAutofocusableElement=function(){return this.bodyElement.querySelector("[autofocus]")},t.prototype.hasAnchor=function(t){return null!=this.getElementForAnchor(t)},t.prototype.isPreviewable=function(){return"no-preview"!==this.getCacheControlValue()},t.prototype.isCacheable=function(){return"no-cache"!==this.getCacheControlValue()},t.prototype.isVisitable=function(){return"reload"!==this.getSetting("visit-control")},t.prototype.getSetting=function(t){return this.headDetails.getMetaValue("turbolinks-"+t)},t}()}.call(this),function(){var t=[].slice;e.Renderer=function(){function e(){}var r;return e.render=function(){var e,r,n,o;return n=arguments[0],r=arguments[1],e=3<=arguments.length?t.call(arguments,2):[],o=function(t,e,r){r.prototype=t.prototype;var n=new r,o=t.apply(n,e);return Object(o)===o?o:n}(this,e,function(){}),o.delegate=n,o.render(r),o},e.prototype.renderView=function(t){return this.delegate.viewWillRender(this.newBody),t(),this.delegate.viewRendered(this.newBody)},e.prototype.invalidateView=function(){return this.delegate.viewInvalidated()},e.prototype.createScriptElement=function(t){var e;return"false"===t.getAttribute("data-turbolinks-eval")?t:(e=document.createElement("script"),e.textContent=t.textContent,e.async=!1,r(e,t),e)},r=function(t,e){var r,n,o,i,s,a,u;for(i=e.attributes,a=[],r=0,n=i.length;n>r;r++)s=i[r],o=s.name,u=s.value,a.push(t.setAttribute(o,u));return a},e}()}.call(this),function(){var t,r,n=function(t,e){function r(){this.constructor=t}for(var n in e)o.call(e,n)&&(t[n]=e[n]);return r.prototype=e.prototype,t.prototype=new r,t.__super__=e.prototype,t},o={}.hasOwnProperty;e.SnapshotRenderer=function(e){function o(t,e,r){this.currentSnapshot=t,this.newSnapshot=e,this.isPreview=r,this.currentHeadDetails=this.currentSnapshot.headDetails,this.newHeadDetails=this.newSnapshot.headDetails,this.currentBody=this.currentSnapshot.bodyElement,this.newBody=this.newSnapshot.bodyElement}return n(o,e),o.prototype.render=function(t){return this.shouldRender()?(this.mergeHead(),this.renderView(function(e){return function(){return e.replaceBody(),e.isPreview||e.focusFirstAutofocusableElement(),t()}}(this))):this.invalidateView()},o.prototype.mergeHead=function(){return this.copyNewHeadStylesheetElements(),this.copyNewHeadScriptElements(),this.removeCurrentHeadProvisionalElements(),this.copyNewHeadProvisionalElements()},o.prototype.replaceBody=function(){var t;return t=this.relocateCurrentBodyPermanentElements(),this.activateNewBodyScriptElements(),this.assignNewBody(),this.replacePlaceholderElementsWithClonedPermanentElements(t)},o.prototype.shouldRender=function(){return this.newSnapshot.isVisitable()&&this.trackedElementsAreIdentical()},o.prototype.trackedElementsAreIdentical=function(){return this.currentHeadDetails.getTrackedElementSignature()===this.newHeadDetails.getTrackedElementSignature()},o.prototype.copyNewHeadStylesheetElements=function(){var t,e,r,n,o;for(n=this.getNewHeadStylesheetElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.appendChild(t));return o},o.prototype.copyNewHeadScriptElements=function(){var t,e,r,n,o;for(n=this.getNewHeadScriptElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.appendChild(this.createScriptElement(t)));return o},o.prototype.removeCurrentHeadProvisionalElements=function(){var t,e,r,n,o;for(n=this.getCurrentHeadProvisionalElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.removeChild(t));return o},o.prototype.copyNewHeadProvisionalElements=function(){var t,e,r,n,o;for(n=this.getNewHeadProvisionalElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.appendChild(t));return o},o.prototype.relocateCurrentBodyPermanentElements=function(){var e,n,o,i,s,a,u;for(a=this.getCurrentBodyPermanentElements(),u=[],e=0,n=a.length;n>e;e++)i=a[e],s=t(i),o=this.newSnapshot.getPermanentElementById(i.id),r(i,s.element),r(o,i),u.push(s);return u},o.prototype.replacePlaceholderElementsWithClonedPermanentElements=function(t){var e,n,o,i,s,a,u;for(u=[],o=0,i=t.length;i>o;o++)a=t[o],n=a.element,s=a.permanentElement,e=s.cloneNode(!0),u.push(r(n,e));return u},o.prototype.activateNewBodyScriptElements=function(){var t,e,n,o,i,s;for(i=this.getNewBodyScriptElements(),s=[],e=0,o=i.length;o>e;e++)n=i[e],t=this.createScriptElement(n),s.push(r(n,t));return s},o.prototype.assignNewBody=function(){return document.body=this.newBody},o.prototype.focusFirstAutofocusableElement=function(){var t;return null!=(t=this.newSnapshot.findFirstAutofocusableElement())?t.focus():void 0},o.prototype.getNewHeadStylesheetElements=function(){return this.newHeadDetails.getStylesheetElementsNotInDetails(this.currentHeadDetails)},o.prototype.getNewHeadScriptElements=function(){return this.newHeadDetails.getScriptElementsNotInDetails(this.currentHeadDetails)},o.prototype.getCurrentHeadProvisionalElements=function(){return this.currentHeadDetails.getProvisionalElements()},o.prototype.getNewHeadProvisionalElements=function(){return this.newHeadDetails.getProvisionalElements()},o.prototype.getCurrentBodyPermanentElements=function(){return this.currentSnapshot.getPermanentElementsPresentInSnapshot(this.newSnapshot)},o.prototype.getNewBodyScriptElements=function(){return this.newBody.querySelectorAll("script")},o}(e.Renderer),t=function(t){var e;return e=document.createElement("meta"),e.setAttribute("name","turbolinks-permanent-placeholder"),e.setAttribute("content",t.id),{element:e,permanentElement:t}},r=function(t,e){var r;return(r=t.parentNode)?r.replaceChild(e,t):void 0}}.call(this),function(){var t=function(t,e){function n(){this.constructor=t}for(var o in e)r.call(e,o)&&(t[o]=e[o]);return n.prototype=e.prototype,t.prototype=new n,t.__super__=e.prototype,t},r={}.hasOwnProperty;e.ErrorRenderer=function(e){function r(t){var e;e=document.createElement("html"),e.innerHTML=t,this.newHead=e.querySelector("head"),this.newBody=e.querySelector("body")}return t(r,e),r.prototype.render=function(t){return this.renderView(function(e){return function(){return e.replaceHeadAndBody(),e.activateBodyScriptElements(),t()}}(this))},r.prototype.replaceHeadAndBody=function(){var t,e;return e=document.head,t=document.body,e.parentNode.replaceChild(this.newHead,e),t.parentNode.replaceChild(this.newBody,t)},r.prototype.activateBodyScriptElements=function(){var t,e,r,n,o,i;for(n=this.getScriptElements(),i=[],e=0,r=n.length;r>e;e++)o=n[e],t=this.createScriptElement(o),i.push(o.parentNode.replaceChild(t,o));return i},r.prototype.getScriptElements=function(){return document.documentElement.querySelectorAll("script")},r}(e.Renderer)}.call(this),function(){e.View=function(){function t(t){this.delegate=t,this.htmlElement=document.documentElement}return t.prototype.getRootLocation=function(){return this.getSnapshot().getRootLocation()},t.prototype.getElementForAnchor=function(t){return this.getSnapshot().getElementForAnchor(t)},t.prototype.getSnapshot=function(){return e.Snapshot.fromHTMLElement(this.htmlElement)},t.prototype.render=function(t,e){var r,n,o;return o=t.snapshot,r=t.error,n=t.isPreview,this.markAsPreview(n),null!=o?this.renderSnapshot(o,n,e):this.renderError(r,e)},t.prototype.markAsPreview=function(t){return t?this.htmlElement.setAttribute("data-turbolinks-preview",""):this.htmlElement.removeAttribute("data-turbolinks-preview")},t.prototype.renderSnapshot=function(t,r,n){return e.SnapshotRenderer.render(this.delegate,n,this.getSnapshot(),e.Snapshot.wrap(t),r)},t.prototype.renderError=function(t,r){return e.ErrorRenderer.render(this.delegate,r,t)},t}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.ScrollManager=function(){function r(r){this.delegate=r,this.onScroll=t(this.onScroll,this),this.onScroll=e.throttle(this.onScroll)}return r.prototype.start=function(){return this.started?void 0:(addEventListener("scroll",this.onScroll,!1),this.onScroll(),this.started=!0)},r.prototype.stop=function(){return this.started?(removeEventListener("scroll",this.onScroll,!1),this.started=!1):void 0},r.prototype.scrollToElement=function(t){return t.scrollIntoView()},r.prototype.scrollToPosition=function(t){var e,r;return e=t.x,r=t.y,window.scrollTo(e,r)},r.prototype.onScroll=function(t){return this.updatePosition({x:window.pageXOffset,y:window.pageYOffset})},r.prototype.updatePosition=function(t){var e;return this.position=t,null!=(e=this.delegate)?e.scrollPositionChanged(this.position):void 0},r}()}.call(this),function(){e.SnapshotCache=function(){function t(t){this.size=t,this.keys=[],this.snapshots={}}var r;return t.prototype.has=function(t){var e;return e=r(t),e in this.snapshots},t.prototype.get=function(t){var e;if(this.has(t))return e=this.read(t),this.touch(t),e},t.prototype.put=function(t,e){return this.write(t,e),this.touch(t),e},t.prototype.read=function(t){var e;return e=r(t),this.snapshots[e]},t.prototype.write=function(t,e){var n;return n=r(t),this.snapshots[n]=e},t.prototype.touch=function(t){var e,n;return n=r(t),e=this.keys.indexOf(n),e>-1&&this.keys.splice(e,1),this.keys.unshift(n),this.trim()},t.prototype.trim=function(){var t,e,r,n,o;for(n=this.keys.splice(this.size),o=[],t=0,r=n.length;r>t;t++)e=n[t],o.push(delete this.snapshots[e]);return o},r=function(t){return e.Location.wrap(t).toCacheKey()},t}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.Visit=function(){function r(r,n,o){this.controller=r,this.action=o,this.performScroll=t(this.performScroll,this),this.identifier=e.uuid(),this.location=e.Location.wrap(n),this.adapter=this.controller.adapter,this.state="initialized",this.timingMetrics={}}var n;return r.prototype.start=function(){return"initialized"===this.state?(this.recordTimingMetric("visitStart"),this.state="started",this.adapter.visitStarted(this)):void 0},r.prototype.cancel=function(){var t;return"started"===this.state?(null!=(t=this.request)&&t.cancel(),this.cancelRender(),this.state="canceled"):void 0},r.prototype.complete=function(){var t;return"started"===this.state?(this.recordTimingMetric("visitEnd"),this.state="completed","function"==typeof(t=this.adapter).visitCompleted&&t.visitCompleted(this),this.controller.visitCompleted(this)):void 0},r.prototype.fail=function(){var t;return"started"===this.state?(this.state="failed","function"==typeof(t=this.adapter).visitFailed?t.visitFailed(this):void 0):void 0},r.prototype.changeHistory=function(){var t,e;return this.historyChanged?void 0:(t=this.location.isEqualTo(this.referrer)?"replace":this.action,e=n(t),this.controller[e](this.location,this.restorationIdentifier),this.historyChanged=!0)},r.prototype.issueRequest=function(){return this.shouldIssueRequest()&&null==this.request?(this.progress=0,this.request=new e.HttpRequest(this,this.location,this.referrer),this.request.send()):void 0},r.prototype.getCachedSnapshot=function(){var t;return!(t=this.controller.getCachedSnapshotForLocation(this.location))||null!=this.location.anchor&&!t.hasAnchor(this.location.anchor)||"restore"!==this.action&&!t.isPreviewable()?void 0:t},r.prototype.hasCachedSnapshot=function(){return null!=this.getCachedSnapshot()},r.prototype.loadCachedSnapshot=function(){var t,e;return(e=this.getCachedSnapshot())?(t=this.shouldIssueRequest(),this.render(function(){var r;return this.cacheSnapshot(),this.controller.render({snapshot:e,isPreview:t},this.performScroll),"function"==typeof(r=this.adapter).visitRendered&&r.visitRendered(this),t?void 0:this.complete()})):void 0},r.prototype.loadResponse=function(){return null!=this.response?this.render(function(){var t,e;return this.cacheSnapshot(),this.request.failed?(this.controller.render({error:this.response},this.performScroll),"function"==typeof(t=this.adapter).visitRendered&&t.visitRendered(this),this.fail()):(this.controller.render({snapshot:this.response},this.performScroll),"function"==typeof(e=this.adapter).visitRendered&&e.visitRendered(this),this.complete())}):void 0},r.prototype.followRedirect=function(){return this.redirectedToLocation&&!this.followedRedirect?(this.location=this.redirectedToLocation,this.controller.replaceHistoryWithLocationAndRestorationIdentifier(this.redirectedToLocation,this.restorationIdentifier),this.followedRedirect=!0):void 0},r.prototype.requestStarted=function(){var t;return this.recordTimingMetric("requestStart"),"function"==typeof(t=this.adapter).visitRequestStarted?t.visitRequestStarted(this):void 0},r.prototype.requestProgressed=function(t){var e;return this.progress=t,"function"==typeof(e=this.adapter).visitRequestProgressed?e.visitRequestProgressed(this):void 0},r.prototype.requestCompletedWithResponse=function(t,r){return this.response=t,null!=r&&(this.redirectedToLocation=e.Location.wrap(r)),this.adapter.visitRequestCompleted(this)},r.prototype.requestFailedWithStatusCode=function(t,e){return this.response=e,this.adapter.visitRequestFailedWithStatusCode(this,t)},r.prototype.requestFinished=function(){var t;return this.recordTimingMetric("requestEnd"),"function"==typeof(t=this.adapter).visitRequestFinished?t.visitRequestFinished(this):void 0},r.prototype.performScroll=function(){return this.scrolled?void 0:("restore"===this.action?this.scrollToRestoredPosition()||this.scrollToTop():this.scrollToAnchor()||this.scrollToTop(),this.scrolled=!0)},r.prototype.scrollToRestoredPosition=function(){var t,e;return t=null!=(e=this.restorationData)?e.scrollPosition:void 0,null!=t?(this.controller.scrollToPosition(t),!0):void 0},r.prototype.scrollToAnchor=function(){return null!=this.location.anchor?(this.controller.scrollToAnchor(this.location.anchor),!0):void 0},r.prototype.scrollToTop=function(){return this.controller.scrollToPosition({x:0,y:0})},r.prototype.recordTimingMetric=function(t){var e;return null!=(e=this.timingMetrics)[t]?e[t]:e[t]=(new Date).getTime()},r.prototype.getTimingMetrics=function(){return e.copyObject(this.timingMetrics)},n=function(t){switch(t){case"replace":return"replaceHistoryWithLocationAndRestorationIdentifier";case"advance":case"restore":return"pushHistoryWithLocationAndRestorationIdentifier"}},r.prototype.shouldIssueRequest=function(){return"restore"===this.action?!this.hasCachedSnapshot():!0},r.prototype.cacheSnapshot=function(){return this.snapshotCached?void 0:(this.controller.cacheSnapshot(),this.snapshotCached=!0)},r.prototype.render=function(t){return this.cancelRender(),this.frame=requestAnimationFrame(function(e){return function(){return e.frame=null,t.call(e)}}(this))},r.prototype.cancelRender=function(){return this.frame?cancelAnimationFrame(this.frame):void 0},r}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.Controller=function(){function r(){this.clickBubbled=t(this.clickBubbled,this),this.clickCaptured=t(this.clickCaptured,this),this.pageLoaded=t(this.pageLoaded,this),this.history=new e.History(this),this.view=new e.View(this),this.scrollManager=new e.ScrollManager(this),this.restorationData={},this.clearCache(),this.setProgressBarDelay(500)}return r.prototype.start=function(){return e.supported&&!this.started?(addEventListener("click",this.clickCaptured,!0),addEventListener("DOMContentLoaded",this.pageLoaded,!1),this.scrollManager.start(),this.startHistory(),this.started=!0,this.enabled=!0):void 0},r.prototype.disable=function(){return this.enabled=!1},r.prototype.stop=function(){return this.started?(removeEventListener("click",this.clickCaptured,!0),removeEventListener("DOMContentLoaded",this.pageLoaded,!1),this.scrollManager.stop(),this.stopHistory(),this.started=!1):void 0},r.prototype.clearCache=function(){return this.cache=new e.SnapshotCache(10)},r.prototype.visit=function(t,r){var n,o;return null==r&&(r={}),t=e.Location.wrap(t),this.applicationAllowsVisitingLocation(t)?this.locationIsVisitable(t)?(n=null!=(o=r.action)?o:"advance",this.adapter.visitProposedToLocationWithAction(t,n)):window.location=t:void 0},r.prototype.startVisitToLocationWithAction=function(t,r,n){var o;return e.supported?(o=this.getRestorationDataForIdentifier(n),this.startVisit(t,r,{restorationData:o})):window.location=t},r.prototype.setProgressBarDelay=function(t){return this.progressBarDelay=t},r.prototype.startHistory=function(){return this.location=e.Location.wrap(window.location),this.restorationIdentifier=e.uuid(),this.history.start(),this.history.replace(this.location,this.restorationIdentifier)},r.prototype.stopHistory=function(){return this.history.stop()},r.prototype.pushHistoryWithLocationAndRestorationIdentifier=function(t,r){return this.restorationIdentifier=r,this.location=e.Location.wrap(t),this.history.push(this.location,this.restorationIdentifier)},r.prototype.replaceHistoryWithLocationAndRestorationIdentifier=function(t,r){return this.restorationIdentifier=r,this.location=e.Location.wrap(t),this.history.replace(this.location,this.restorationIdentifier)},r.prototype.historyPoppedToLocationWithRestorationIdentifier=function(t,r){var n;return this.restorationIdentifier=r,this.enabled?(n=this.getRestorationDataForIdentifier(this.restorationIdentifier),this.startVisit(t,"restore",{restorationIdentifier:this.restorationIdentifier,restorationData:n,historyChanged:!0}),this.location=e.Location.wrap(t)):this.adapter.pageInvalidated()},r.prototype.getCachedSnapshotForLocation=function(t){var e;return null!=(e=this.cache.get(t))?e.clone():void 0},r.prototype.shouldCacheSnapshot=function(){return this.view.getSnapshot().isCacheable();
+},r.prototype.cacheSnapshot=function(){var t,r;return this.shouldCacheSnapshot()?(this.notifyApplicationBeforeCachingSnapshot(),r=this.view.getSnapshot(),t=this.lastRenderedLocation,e.defer(function(e){return function(){return e.cache.put(t,r.clone())}}(this))):void 0},r.prototype.scrollToAnchor=function(t){var e;return(e=this.view.getElementForAnchor(t))?this.scrollToElement(e):this.scrollToPosition({x:0,y:0})},r.prototype.scrollToElement=function(t){return this.scrollManager.scrollToElement(t)},r.prototype.scrollToPosition=function(t){return this.scrollManager.scrollToPosition(t)},r.prototype.scrollPositionChanged=function(t){var e;return e=this.getCurrentRestorationData(),e.scrollPosition=t},r.prototype.render=function(t,e){return this.view.render(t,e)},r.prototype.viewInvalidated=function(){return this.adapter.pageInvalidated()},r.prototype.viewWillRender=function(t){return this.notifyApplicationBeforeRender(t)},r.prototype.viewRendered=function(){return this.lastRenderedLocation=this.currentVisit.location,this.notifyApplicationAfterRender()},r.prototype.pageLoaded=function(){return this.lastRenderedLocation=this.location,this.notifyApplicationAfterPageLoad()},r.prototype.clickCaptured=function(){return removeEventListener("click",this.clickBubbled,!1),addEventListener("click",this.clickBubbled,!1)},r.prototype.clickBubbled=function(t){var e,r,n;return this.enabled&&this.clickEventIsSignificant(t)&&(r=this.getVisitableLinkForNode(t.target))&&(n=this.getVisitableLocationForLink(r))&&this.applicationAllowsFollowingLinkToLocation(r,n)?(t.preventDefault(),e=this.getActionForLink(r),this.visit(n,{action:e})):void 0},r.prototype.applicationAllowsFollowingLinkToLocation=function(t,e){var r;return r=this.notifyApplicationAfterClickingLinkToLocation(t,e),!r.defaultPrevented},r.prototype.applicationAllowsVisitingLocation=function(t){var e;return e=this.notifyApplicationBeforeVisitingLocation(t),!e.defaultPrevented},r.prototype.notifyApplicationAfterClickingLinkToLocation=function(t,r){return e.dispatch("turbolinks:click",{target:t,data:{url:r.absoluteURL},cancelable:!0})},r.prototype.notifyApplicationBeforeVisitingLocation=function(t){return e.dispatch("turbolinks:before-visit",{data:{url:t.absoluteURL},cancelable:!0})},r.prototype.notifyApplicationAfterVisitingLocation=function(t){return e.dispatch("turbolinks:visit",{data:{url:t.absoluteURL}})},r.prototype.notifyApplicationBeforeCachingSnapshot=function(){return e.dispatch("turbolinks:before-cache")},r.prototype.notifyApplicationBeforeRender=function(t){return e.dispatch("turbolinks:before-render",{data:{newBody:t}})},r.prototype.notifyApplicationAfterRender=function(){return e.dispatch("turbolinks:render")},r.prototype.notifyApplicationAfterPageLoad=function(t){return null==t&&(t={}),e.dispatch("turbolinks:load",{data:{url:this.location.absoluteURL,timing:t}})},r.prototype.startVisit=function(t,e,r){var n;return null!=(n=this.currentVisit)&&n.cancel(),this.currentVisit=this.createVisit(t,e,r),this.currentVisit.start(),this.notifyApplicationAfterVisitingLocation(t)},r.prototype.createVisit=function(t,r,n){var o,i,s,a,u;return i=null!=n?n:{},a=i.restorationIdentifier,s=i.restorationData,o=i.historyChanged,u=new e.Visit(this,t,r),u.restorationIdentifier=null!=a?a:e.uuid(),u.restorationData=e.copyObject(s),u.historyChanged=o,u.referrer=this.location,u},r.prototype.visitCompleted=function(t){return this.notifyApplicationAfterPageLoad(t.getTimingMetrics())},r.prototype.clickEventIsSignificant=function(t){return!(t.defaultPrevented||t.target.isContentEditable||t.which>1||t.altKey||t.ctrlKey||t.metaKey||t.shiftKey)},r.prototype.getVisitableLinkForNode=function(t){return this.nodeIsVisitable(t)?e.closest(t,"a[href]:not([target]):not([download])"):void 0},r.prototype.getVisitableLocationForLink=function(t){var r;return r=new e.Location(t.getAttribute("href")),this.locationIsVisitable(r)?r:void 0},r.prototype.getActionForLink=function(t){var e;return null!=(e=t.getAttribute("data-turbolinks-action"))?e:"advance"},r.prototype.nodeIsVisitable=function(t){var r;return(r=e.closest(t,"[data-turbolinks]"))?"false"!==r.getAttribute("data-turbolinks"):!0},r.prototype.locationIsVisitable=function(t){return t.isPrefixedBy(this.view.getRootLocation())&&t.isHTML()},r.prototype.getCurrentRestorationData=function(){return this.getRestorationDataForIdentifier(this.restorationIdentifier)},r.prototype.getRestorationDataForIdentifier=function(t){var e;return null!=(e=this.restorationData)[t]?e[t]:e[t]={}},r}()}.call(this),function(){!function(){var t,e;if((t=e=document.currentScript)&&!e.hasAttribute("data-turbolinks-suppress-warning"))for(;t=t.parentNode;)if(t===document.body)return console.warn("You are loading Turbolinks from a <script> element inside the <body> element. This is probably not what you meant to do!\n\nLoad your application\u2019s JavaScript bundle inside the <head> element instead. <script> elements in <body> are evaluated with each page change.\n\nFor more information, see: https://github.com/turbolinks/turbolinks#working-with-script-elements\n\n\u2014\u2014\nSuppress this warning by adding a `data-turbolinks-suppress-warning` attribute to: %s",e.outerHTML)}()}.call(this),function(){var t,r,n;e.start=function(){return r()?(null==e.controller&&(e.controller=t()),e.controller.start()):void 0},r=function(){return null==window.Turbolinks&&(window.Turbolinks=e),n()},t=function(){var t;return t=new e.Controller,t.adapter=new e.BrowserAdapter(t),t},n=function(){return window.Turbolinks===e},n()&&e.start()}.call(this)}).call(this),"object"==typeof module&&module.exports?module.exports=e:"function"==typeof define&&define.amd&&define(e)}).call(this);
+/*!
+ * jQuery JavaScript Library v3.4.1
+ * https://jquery.com/
+ *
+ * Includes Sizzle.js
+ * https://sizzlejs.com/
+ *
+ * Copyright JS Foundation and other contributors
+ * Released under the MIT license
+ * https://jquery.org/license
+ *
+ * Date: 2019-05-01T21:04Z
+ */
+
+( function( global, factory ) {
+
+	"use strict";
+
+	if ( typeof module === "object" && typeof module.exports === "object" ) {
+
+		// For CommonJS and CommonJS-like environments where a proper `window`
+		// is present, execute the factory and get jQuery.
+		// For environments that do not have a `window` with a `document`
+		// (such as Node.js), expose a factory as module.exports.
+		// This accentuates the need for the creation of a real `window`.
+		// e.g. var jQuery = require("jquery")(window);
+		// See ticket #14549 for more info.
+		module.exports = global.document ?
+			factory( global, true ) :
+			function( w ) {
+				if ( !w.document ) {
+					throw new Error( "jQuery requires a window with a document" );
+				}
+				return factory( w );
+			};
+	} else {
+		factory( global );
+	}
+
+// Pass this if window is not defined yet
+} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {
+
+// Edge <= 12 - 13+, Firefox <=18 - 45+, IE 10 - 11, Safari 5.1 - 9+, iOS 6 - 9.1
+// throw exceptions when non-strict code (e.g., ASP.NET 4.5) accesses strict mode
+// arguments.callee.caller (trac-13335). But as of jQuery 3.0 (2016), strict mode should be common
+// enough that all such attempts are guarded in a try block.
+"use strict";
+
+var arr = [];
+
+var document = window.document;
+
+var getProto = Object.getPrototypeOf;
+
+var slice = arr.slice;
+
+var concat = arr.concat;
+
+var push = arr.push;
+
+var indexOf = arr.indexOf;
+
+var class2type = {};
+
+var toString = class2type.toString;
+
+var hasOwn = class2type.hasOwnProperty;
+
+var fnToString = hasOwn.toString;
+
+var ObjectFunctionString = fnToString.call( Object );
+
+var support = {};
+
+var isFunction = function isFunction( obj ) {
+
+      // Support: Chrome <=57, Firefox <=52
+      // In some browsers, typeof returns "function" for HTML <object> elements
+      // (i.e., `typeof document.createElement( "object" ) === "function"`).
+      // We don't want to classify *any* DOM node as a function.
+      return typeof obj === "function" && typeof obj.nodeType !== "number";
+  };
+
+
+var isWindow = function isWindow( obj ) {
+		return obj != null && obj === obj.window;
+	};
+
+
+
+
+	var preservedScriptAttributes = {
+		type: true,
+		src: true,
+		nonce: true,
+		noModule: true
+	};
+
+	function DOMEval( code, node, doc ) {
+		doc = doc || document;
+
+		var i, val,
+			script = doc.createElement( "script" );
+
+		script.text = code;
+		if ( node ) {
+			for ( i in preservedScriptAttributes ) {
+
+				// Support: Firefox 64+, Edge 18+
+				// Some browsers don't support the "nonce" property on scripts.
+				// On the other hand, just using `getAttribute` is not enough as
+				// the `nonce` attribute is reset to an empty string whenever it
+				// becomes browsing-context connected.
+				// See https://github.com/whatwg/html/issues/2369
+				// See https://html.spec.whatwg.org/#nonce-attributes
+				// The `node.getAttribute` check was added for the sake of
+				// `jQuery.globalEval` so that it can fake a nonce-containing node
+				// via an object.
+				val = node[ i ] || node.getAttribute && node.getAttribute( i );
+				if ( val ) {
+					script.setAttribute( i, val );
+				}
+			}
+		}
+		doc.head.appendChild( script ).parentNode.removeChild( script );
+	}
+
+
+function toType( obj ) {
+	if ( obj == null ) {
+		return obj + "";
+	}
+
+	// Support: Android <=2.3 only (functionish RegExp)
+	return typeof obj === "object" || typeof obj === "function" ?
+		class2type[ toString.call( obj ) ] || "object" :
+		typeof obj;
+}
+/* global Symbol */
+// Defining this global in .eslintrc.json would create a danger of using the global
+// unguarded in another place, it seems safer to define global only for this module
+
+
+
+var
+	version = "3.4.1",
+
+	// Define a local copy of jQuery
+	jQuery = function( selector, context ) {
+
+		// The jQuery object is actually just the init constructor 'enhanced'
+		// Need init if jQuery is called (just allow error to be thrown if not included)
+		return new jQuery.fn.init( selector, context );
+	},
+
+	// Support: Android <=4.0 only
+	// Make sure we trim BOM and NBSP
+	rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
+
+jQuery.fn = jQuery.prototype = {
+
+	// The current version of jQuery being used
+	jquery: version,
+
+	constructor: jQuery,
+
+	// The default length of a jQuery object is 0
+	length: 0,
+
+	toArray: function() {
+		return slice.call( this );
+	},
+
+	// Get the Nth element in the matched element set OR
+	// Get the whole matched element set as a clean array
+	get: function( num ) {
+
+		// Return all the elements in a clean array
+		if ( num == null ) {
+			return slice.call( this );
+		}
+
+		// Return just the one element from the set
+		return num < 0 ? this[ num + this.length ] : this[ num ];
+	},
+
+	// Take an array of elements and push it onto the stack
+	// (returning the new matched element set)
+	pushStack: function( elems ) {
+
+		// Build a new jQuery matched element set
+		var ret = jQuery.merge( this.constructor(), elems );
+
+		// Add the old object onto the stack (as a reference)
+		ret.prevObject = this;
+
+		// Return the newly-formed element set
+		return ret;
+	},
+
+	// Execute a callback for every element in the matched set.
+	each: function( callback ) {
+		return jQuery.each( this, callback );
+	},
+
+	map: function( callback ) {
+		return this.pushStack( jQuery.map( this, function( elem, i ) {
+			return callback.call( elem, i, elem );
+		} ) );
+	},
+
+	slice: function() {
+		return this.pushStack( slice.apply( this, arguments ) );
+	},
+
+	first: function() {
+		return this.eq( 0 );
+	},
+
+	last: function() {
+		return this.eq( -1 );
+	},
+
+	eq: function( i ) {
+		var len = this.length,
+			j = +i + ( i < 0 ? len : 0 );
+		return this.pushStack( j >= 0 && j < len ? [ this[ j ] ] : [] );
+	},
+
+	end: function() {
+		return this.prevObject || this.constructor();
+	},
+
+	// For internal use only.
+	// Behaves like an Array's method, not like a jQuery method.
+	push: push,
+	sort: arr.sort,
+	splice: arr.splice
+};
+
+jQuery.extend = jQuery.fn.extend = function() {
+	var options, name, src, copy, copyIsArray, clone,
+		target = arguments[ 0 ] || {},
+		i = 1,
+		length = arguments.length,
+		deep = false;
+
+	// Handle a deep copy situation
+	if ( typeof target === "boolean" ) {
+		deep = target;
+
+		// Skip the boolean and the target
+		target = arguments[ i ] || {};
+		i++;
+	}
+
+	// Handle case when target is a string or something (possible in deep copy)
+	if ( typeof target !== "object" && !isFunction( target ) ) {
+		target = {};
+	}
+
+	// Extend jQuery itself if only one argument is passed
+	if ( i === length ) {
+		target = this;
+		i--;
+	}
+
+	for ( ; i < length; i++ ) {
+
+		// Only deal with non-null/undefined values
+		if ( ( options = arguments[ i ] ) != null ) {
+
+			// Extend the base object
+			for ( name in options ) {
+				copy = options[ name ];
+
+				// Prevent Object.prototype pollution
+				// Prevent never-ending loop
+				if ( name === "__proto__" || target === copy ) {
+					continue;
+				}
+
+				// Recurse if we're merging plain objects or arrays
+				if ( deep && copy && ( jQuery.isPlainObject( copy ) ||
+					( copyIsArray = Array.isArray( copy ) ) ) ) {
+					src = target[ name ];
+
+					// Ensure proper type for the source value
+					if ( copyIsArray && !Array.isArray( src ) ) {
+						clone = [];
+					} else if ( !copyIsArray && !jQuery.isPlainObject( src ) ) {
+						clone = {};
+					} else {
+						clone = src;
+					}
+					copyIsArray = false;
+
+					// Never move original objects, clone them
+					target[ name ] = jQuery.extend( deep, clone, copy );
+
+				// Don't bring in undefined values
+				} else if ( copy !== undefined ) {
+					target[ name ] = copy;
+				}
+			}
+		}
+	}
+
+	// Return the modified object
+	return target;
+};
+
+jQuery.extend( {
+
+	// Unique for each copy of jQuery on the page
+	expando: "jQuery" + ( version + Math.random() ).replace( /\D/g, "" ),
+
+	// Assume jQuery is ready without the ready module
+	isReady: true,
+
+	error: function( msg ) {
+		throw new Error( msg );
+	},
+
+	noop: function() {},
+
+	isPlainObject: function( obj ) {
+		var proto, Ctor;
+
+		// Detect obvious negatives
+		// Use toString instead of jQuery.type to catch host objects
+		if ( !obj || toString.call( obj ) !== "[object Object]" ) {
+			return false;
+		}
+
+		proto = getProto( obj );
+
+		// Objects with no prototype (e.g., `Object.create( null )`) are plain
+		if ( !proto ) {
+			return true;
+		}
+
+		// Objects with prototype are plain iff they were constructed by a global Object function
+		Ctor = hasOwn.call( proto, "constructor" ) && proto.constructor;
+		return typeof Ctor === "function" && fnToString.call( Ctor ) === ObjectFunctionString;
+	},
+
+	isEmptyObject: function( obj ) {
+		var name;
+
+		for ( name in obj ) {
+			return false;
+		}
+		return true;
+	},
+
+	// Evaluates a script in a global context
+	globalEval: function( code, options ) {
+		DOMEval( code, { nonce: options && options.nonce } );
+	},
+
+	each: function( obj, callback ) {
+		var length, i = 0;
+
+		if ( isArrayLike( obj ) ) {
+			length = obj.length;
+			for ( ; i < length; i++ ) {
+				if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
+					break;
+				}
+			}
+		} else {
+			for ( i in obj ) {
+				if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
+					break;
+				}
+			}
+		}
+
+		return obj;
+	},
+
+	// Support: Android <=4.0 only
+	trim: function( text ) {
+		return text == null ?
+			"" :
+			( text + "" ).replace( rtrim, "" );
+	},
+
+	// results is for internal usage only
+	makeArray: function( arr, results ) {
+		var ret = results || [];
+
+		if ( arr != null ) {
+			if ( isArrayLike( Object( arr ) ) ) {
+				jQuery.merge( ret,
+					typeof arr === "string" ?
+					[ arr ] : arr
+				);
+			} else {
+				push.call( ret, arr );
+			}
+		}
+
+		return ret;
+	},
+
+	inArray: function( elem, arr, i ) {
+		return arr == null ? -1 : indexOf.call( arr, elem, i );
+	},
+
+	// Support: Android <=4.0 only, PhantomJS 1 only
+	// push.apply(_, arraylike) throws on ancient WebKit
+	merge: function( first, second ) {
+		var len = +second.length,
+			j = 0,
+			i = first.length;
+
+		for ( ; j < len; j++ ) {
+			first[ i++ ] = second[ j ];
+		}
+
+		first.length = i;
+
+		return first;
+	},
+
+	grep: function( elems, callback, invert ) {
+		var callbackInverse,
+			matches = [],
+			i = 0,
+			length = elems.length,
+			callbackExpect = !invert;
+
+		// Go through the array, only saving the items
+		// that pass the validator function
+		for ( ; i < length; i++ ) {
+			callbackInverse = !callback( elems[ i ], i );
+			if ( callbackInverse !== callbackExpect ) {
+				matches.push( elems[ i ] );
+			}
+		}
+
+		return matches;
+	},
+
+	// arg is for internal usage only
+	map: function( elems, callback, arg ) {
+		var length, value,
+			i = 0,
+			ret = [];
+
+		// Go through the array, translating each of the items to their new values
+		if ( isArrayLike( elems ) ) {
+			length = elems.length;
+			for ( ; i < length; i++ ) {
+				value = callback( elems[ i ], i, arg );
+
+				if ( value != null ) {
+					ret.push( value );
+				}
+			}
+
+		// Go through every key on the object,
+		} else {
+			for ( i in elems ) {
+				value = callback( elems[ i ], i, arg );
+
+				if ( value != null ) {
+					ret.push( value );
+				}
+			}
+		}
+
+		// Flatten any nested arrays
+		return concat.apply( [], ret );
+	},
+
+	// A global GUID counter for objects
+	guid: 1,
+
+	// jQuery.support is not used in Core but other projects attach their
+	// properties to it so it needs to exist.
+	support: support
+} );
+
+if ( typeof Symbol === "function" ) {
+	jQuery.fn[ Symbol.iterator ] = arr[ Symbol.iterator ];
+}
+
+// Populate the class2type map
+jQuery.each( "Boolean Number String Function Array Date RegExp Object Error Symbol".split( " " ),
+function( i, name ) {
+	class2type[ "[object " + name + "]" ] = name.toLowerCase();
+} );
+
+function isArrayLike( obj ) {
+
+	// Support: real iOS 8.2 only (not reproducible in simulator)
+	// `in` check used to prevent JIT error (gh-2145)
+	// hasOwn isn't used here due to false negatives
+	// regarding Nodelist length in IE
+	var length = !!obj && "length" in obj && obj.length,
+		type = toType( obj );
+
+	if ( isFunction( obj ) || isWindow( obj ) ) {
+		return false;
+	}
+
+	return type === "array" || length === 0 ||
+		typeof length === "number" && length > 0 && ( length - 1 ) in obj;
+}
+var Sizzle =
+/*!
+ * Sizzle CSS Selector Engine v2.3.4
+ * https://sizzlejs.com/
+ *
+ * Copyright JS Foundation and other contributors
+ * Released under the MIT license
+ * https://js.foundation/
+ *
+ * Date: 2019-04-08
+ */
+(function( window ) {
+
+var i,
+	support,
+	Expr,
+	getText,
+	isXML,
+	tokenize,
+	compile,
+	select,
+	outermostContext,
+	sortInput,
+	hasDuplicate,
+
+	// Local document vars
+	setDocument,
+	document,
+	docElem,
+	documentIsHTML,
+	rbuggyQSA,
+	rbuggyMatches,
+	matches,
+	contains,
+
+	// Instance-specific data
+	expando = "sizzle" + 1 * new Date(),
+	preferredDoc = window.document,
+	dirruns = 0,
+	done = 0,
+	classCache = createCache(),
+	tokenCache = createCache(),
+	compilerCache = createCache(),
+	nonnativeSelectorCache = createCache(),
+	sortOrder = function( a, b ) {
+		if ( a === b ) {
+			hasDuplicate = true;
+		}
+		return 0;
+	},
+
+	// Instance methods
+	hasOwn = ({}).hasOwnProperty,
+	arr = [],
+	pop = arr.pop,
+	push_native = arr.push,
+	push = arr.push,
+	slice = arr.slice,
+	// Use a stripped-down indexOf as it's faster than native
+	// https://jsperf.com/thor-indexof-vs-for/5
+	indexOf = function( list, elem ) {
+		var i = 0,
+			len = list.length;
+		for ( ; i < len; i++ ) {
+			if ( list[i] === elem ) {
+				return i;
+			}
+		}
+		return -1;
+	},
+
+	booleans = "checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",
+
+	// Regular expressions
+
+	// http://www.w3.org/TR/css3-selectors/#whitespace
+	whitespace = "[\\x20\\t\\r\\n\\f]",
+
+	// http://www.w3.org/TR/CSS21/syndata.html#value-def-identifier
+	identifier = "(?:\\\\.|[\\w-]|[^\0-\\xa0])+",
+
+	// Attribute selectors: http://www.w3.org/TR/selectors/#attribute-selectors
+	attributes = "\\[" + whitespace + "*(" + identifier + ")(?:" + whitespace +
+		// Operator (capture 2)
+		"*([*^$|!~]?=)" + whitespace +
+		// "Attribute values must be CSS identifiers [capture 5] or strings [capture 3 or capture 4]"
+		"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|(" + identifier + "))|)" + whitespace +
+		"*\\]",
+
+	pseudos = ":(" + identifier + ")(?:\\((" +
+		// To reduce the number of selectors needing tokenize in the preFilter, prefer arguments:
+		// 1. quoted (capture 3; capture 4 or capture 5)
+		"('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|" +
+		// 2. simple (capture 6)
+		"((?:\\\\.|[^\\\\()[\\]]|" + attributes + ")*)|" +
+		// 3. anything else (capture 2)
+		".*" +
+		")\\)|)",
+
+	// Leading and non-escaped trailing whitespace, capturing some non-whitespace characters preceding the latter
+	rwhitespace = new RegExp( whitespace + "+", "g" ),
+	rtrim = new RegExp( "^" + whitespace + "+|((?:^|[^\\\\])(?:\\\\.)*)" + whitespace + "+$", "g" ),
+
+	rcomma = new RegExp( "^" + whitespace + "*," + whitespace + "*" ),
+	rcombinators = new RegExp( "^" + whitespace + "*([>+~]|" + whitespace + ")" + whitespace + "*" ),
+	rdescend = new RegExp( whitespace + "|>" ),
+
+	rpseudo = new RegExp( pseudos ),
+	ridentifier = new RegExp( "^" + identifier + "$" ),
+
+	matchExpr = {
+		"ID": new RegExp( "^#(" + identifier + ")" ),
+		"CLASS": new RegExp( "^\\.(" + identifier + ")" ),
+		"TAG": new RegExp( "^(" + identifier + "|[*])" ),
+		"ATTR": new RegExp( "^" + attributes ),
+		"PSEUDO": new RegExp( "^" + pseudos ),
+		"CHILD": new RegExp( "^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\(" + whitespace +
+			"*(even|odd|(([+-]|)(\\d*)n|)" + whitespace + "*(?:([+-]|)" + whitespace +
+			"*(\\d+)|))" + whitespace + "*\\)|)", "i" ),
+		"bool": new RegExp( "^(?:" + booleans + ")$", "i" ),
+		// For use in libraries implementing .is()
+		// We use this for POS matching in `select`
+		"needsContext": new RegExp( "^" + whitespace + "*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\(" +
+			whitespace + "*((?:-\\d)?\\d*)" + whitespace + "*\\)|)(?=[^-]|$)", "i" )
+	},
+
+	rhtml = /HTML$/i,
+	rinputs = /^(?:input|select|textarea|button)$/i,
+	rheader = /^h\d$/i,
+
+	rnative = /^[^{]+\{\s*\[native \w/,
+
+	// Easily-parseable/retrievable ID or TAG or CLASS selectors
+	rquickExpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,
+
+	rsibling = /[+~]/,
+
+	// CSS escapes
+	// http://www.w3.org/TR/CSS21/syndata.html#escaped-characters
+	runescape = new RegExp( "\\\\([\\da-f]{1,6}" + whitespace + "?|(" + whitespace + ")|.)", "ig" ),
+	funescape = function( _, escaped, escapedWhitespace ) {
+		var high = "0x" + escaped - 0x10000;
+		// NaN means non-codepoint
+		// Support: Firefox<24
+		// Workaround erroneous numeric interpretation of +"0x"
+		return high !== high || escapedWhitespace ?
+			escaped :
+			high < 0 ?
+				// BMP codepoint
+				String.fromCharCode( high + 0x10000 ) :
+				// Supplemental Plane codepoint (surrogate pair)
+				String.fromCharCode( high >> 10 | 0xD800, high & 0x3FF | 0xDC00 );
+	},
+
+	// CSS string/identifier serialization
+	// https://drafts.csswg.org/cssom/#common-serializing-idioms
+	rcssescape = /([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,
+	fcssescape = function( ch, asCodePoint ) {
+		if ( asCodePoint ) {
+
+			// U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER
+			if ( ch === "\0" ) {
+				return "\uFFFD";
+			}
+
+			// Control characters and (dependent upon position) numbers get escaped as code points
+			return ch.slice( 0, -1 ) + "\\" + ch.charCodeAt( ch.length - 1 ).toString( 16 ) + " ";
+		}
+
+		// Other potentially-special ASCII characters get backslash-escaped
+		return "\\" + ch;
+	},
+
+	// Used for iframes
+	// See setDocument()
+	// Removing the function wrapper causes a "Permission Denied"
+	// error in IE
+	unloadHandler = function() {
+		setDocument();
+	},
+
+	inDisabledFieldset = addCombinator(
+		function( elem ) {
+			return elem.disabled === true && elem.nodeName.toLowerCase() === "fieldset";
+		},
+		{ dir: "parentNode", next: "legend" }
+	);
+
+// Optimize for push.apply( _, NodeList )
+try {
+	push.apply(
+		(arr = slice.call( preferredDoc.childNodes )),
+		preferredDoc.childNodes
+	);
+	// Support: Android<4.0
+	// Detect silently failing push.apply
+	arr[ preferredDoc.childNodes.length ].nodeType;
+} catch ( e ) {
+	push = { apply: arr.length ?
+
+		// Leverage slice if possible
+		function( target, els ) {
+			push_native.apply( target, slice.call(els) );
+		} :
+
+		// Support: IE<9
+		// Otherwise append directly
+		function( target, els ) {
+			var j = target.length,
+				i = 0;
+			// Can't trust NodeList.length
+			while ( (target[j++] = els[i++]) ) {}
+			target.length = j - 1;
+		}
+	};
+}
+
+function Sizzle( selector, context, results, seed ) {
+	var m, i, elem, nid, match, groups, newSelector,
+		newContext = context && context.ownerDocument,
+
+		// nodeType defaults to 9, since context defaults to document
+		nodeType = context ? context.nodeType : 9;
+
+	results = results || [];
+
+	// Return early from calls with invalid selector or context
+	if ( typeof selector !== "string" || !selector ||
+		nodeType !== 1 && nodeType !== 9 && nodeType !== 11 ) {
+
+		return results;
+	}
+
+	// Try to shortcut find operations (as opposed to filters) in HTML documents
+	if ( !seed ) {
+
+		if ( ( context ? context.ownerDocument || context : preferredDoc ) !== document ) {
+			setDocument( context );
+		}
+		context = context || document;
+
+		if ( documentIsHTML ) {
+
+			// If the selector is sufficiently simple, try using a "get*By*" DOM method
+			// (excepting DocumentFragment context, where the methods don't exist)
+			if ( nodeType !== 11 && (match = rquickExpr.exec( selector )) ) {
+
+				// ID selector
+				if ( (m = match[1]) ) {
+
+					// Document context
+					if ( nodeType === 9 ) {
+						if ( (elem = context.getElementById( m )) ) {
+
+							// Support: IE, Opera, Webkit
+							// TODO: identify versions
+							// getElementById can match elements by name instead of ID
+							if ( elem.id === m ) {
+								results.push( elem );
+								return results;
+							}
+						} else {
+							return results;
+						}
+
+					// Element context
+					} else {
+
+						// Support: IE, Opera, Webkit
+						// TODO: identify versions
+						// getElementById can match elements by name instead of ID
+						if ( newContext && (elem = newContext.getElementById( m )) &&
+							contains( context, elem ) &&
+							elem.id === m ) {
+
+							results.push( elem );
+							return results;
+						}
+					}
+
+				// Type selector
+				} else if ( match[2] ) {
+					push.apply( results, context.getElementsByTagName( selector ) );
+					return results;
+
+				// Class selector
+				} else if ( (m = match[3]) && support.getElementsByClassName &&
+					context.getElementsByClassName ) {
+
+					push.apply( results, context.getElementsByClassName( m ) );
+					return results;
+				}
+			}
+
+			// Take advantage of querySelectorAll
+			if ( support.qsa &&
+				!nonnativeSelectorCache[ selector + " " ] &&
+				(!rbuggyQSA || !rbuggyQSA.test( selector )) &&
+
+				// Support: IE 8 only
+				// Exclude object elements
+				(nodeType !== 1 || context.nodeName.toLowerCase() !== "object") ) {
+
+				newSelector = selector;
+				newContext = context;
+
+				// qSA considers elements outside a scoping root when evaluating child or
+				// descendant combinators, which is not what we want.
+				// In such cases, we work around the behavior by prefixing every selector in the
+				// list with an ID selector referencing the scope context.
+				// Thanks to Andrew Dupont for this technique.
+				if ( nodeType === 1 && rdescend.test( selector ) ) {
+
+					// Capture the context ID, setting it first if necessary
+					if ( (nid = context.getAttribute( "id" )) ) {
+						nid = nid.replace( rcssescape, fcssescape );
+					} else {
+						context.setAttribute( "id", (nid = expando) );
+					}
+
+					// Prefix every selector in the list
+					groups = tokenize( selector );
+					i = groups.length;
+					while ( i-- ) {
+						groups[i] = "#" + nid + " " + toSelector( groups[i] );
+					}
+					newSelector = groups.join( "," );
+
+					// Expand context for sibling selectors
+					newContext = rsibling.test( selector ) && testContext( context.parentNode ) ||
+						context;
+				}
+
+				try {
+					push.apply( results,
+						newContext.querySelectorAll( newSelector )
+					);
+					return results;
+				} catch ( qsaError ) {
+					nonnativeSelectorCache( selector, true );
+				} finally {
+					if ( nid === expando ) {
+						context.removeAttribute( "id" );
+					}
+				}
+			}
+		}
+	}
+
+	// All others
+	return select( selector.replace( rtrim, "$1" ), context, results, seed );
+}
+
+/**
+ * Create key-value caches of limited size
+ * @returns {function(string, object)} Returns the Object data after storing it on itself with
+ *	property name the (space-suffixed) string and (if the cache is larger than Expr.cacheLength)
+ *	deleting the oldest entry
+ */
+function createCache() {
+	var keys = [];
+
+	function cache( key, value ) {
+		// Use (key + " ") to avoid collision with native prototype properties (see Issue #157)
+		if ( keys.push( key + " " ) > Expr.cacheLength ) {
+			// Only keep the most recent entries
+			delete cache[ keys.shift() ];
+		}
+		return (cache[ key + " " ] = value);
+	}
+	return cache;
+}
+
+/**
+ * Mark a function for special use by Sizzle
+ * @param {Function} fn The function to mark
+ */
+function markFunction( fn ) {
+	fn[ expando ] = true;
+	return fn;
+}
+
+/**
+ * Support testing using an element
+ * @param {Function} fn Passed the created element and returns a boolean result
+ */
+function assert( fn ) {
+	var el = document.createElement("fieldset");
+
+	try {
+		return !!fn( el );
+	} catch (e) {
+		return false;
+	} finally {
+		// Remove from its parent by default
+		if ( el.parentNode ) {
+			el.parentNode.removeChild( el );
+		}
+		// release memory in IE
+		el = null;
+	}
+}
+
+/**
+ * Adds the same handler for all of the specified attrs
+ * @param {String} attrs Pipe-separated list of attributes
+ * @param {Function} handler The method that will be applied
+ */
+function addHandle( attrs, handler ) {
+	var arr = attrs.split("|"),
+		i = arr.length;
+
+	while ( i-- ) {
+		Expr.attrHandle[ arr[i] ] = handler;
+	}
+}
+
+/**
+ * Checks document order of two siblings
+ * @param {Element} a
+ * @param {Element} b
+ * @returns {Number} Returns less than 0 if a precedes b, greater than 0 if a follows b
+ */
+function siblingCheck( a, b ) {
+	var cur = b && a,
+		diff = cur && a.nodeType === 1 && b.nodeType === 1 &&
+			a.sourceIndex - b.sourceIndex;
+
+	// Use IE sourceIndex if available on both nodes
+	if ( diff ) {
+		return diff;
+	}
+
+	// Check if b follows a
+	if ( cur ) {
+		while ( (cur = cur.nextSibling) ) {
+			if ( cur === b ) {
+				return -1;
+			}
+		}
+	}
+
+	return a ? 1 : -1;
+}
+
+/**
+ * Returns a function to use in pseudos for input types
+ * @param {String} type
+ */
+function createInputPseudo( type ) {
+	return function( elem ) {
+		var name = elem.nodeName.toLowerCase();
+		return name === "input" && elem.type === type;
+	};
+}
+
+/**
+ * Returns a function to use in pseudos for buttons
+ * @param {String} type
+ */
+function createButtonPseudo( type ) {
+	return function( elem ) {
+		var name = elem.nodeName.toLowerCase();
+		return (name === "input" || name === "button") && elem.type === type;
+	};
+}
+
+/**
+ * Returns a function to use in pseudos for :enabled/:disabled
+ * @param {Boolean} disabled true for :disabled; false for :enabled
+ */
+function createDisabledPseudo( disabled ) {
+
+	// Known :disabled false positives: fieldset[disabled] > legend:nth-of-type(n+2) :can-disable
+	return function( elem ) {
+
+		// Only certain elements can match :enabled or :disabled
+		// https://html.spec.whatwg.org/multipage/scripting.html#selector-enabled
+		// https://html.spec.whatwg.org/multipage/scripting.html#selector-disabled
+		if ( "form" in elem ) {
+
+			// Check for inherited disabledness on relevant non-disabled elements:
+			// * listed form-associated elements in a disabled fieldset
+			//   https://html.spec.whatwg.org/multipage/forms.html#category-listed
+			//   https://html.spec.whatwg.org/multipage/forms.html#concept-fe-disabled
+			// * option elements in a disabled optgroup
+			//   https://html.spec.whatwg.org/multipage/forms.html#concept-option-disabled
+			// All such elements have a "form" property.
+			if ( elem.parentNode && elem.disabled === false ) {
+
+				// Option elements defer to a parent optgroup if present
+				if ( "label" in elem ) {
+					if ( "label" in elem.parentNode ) {
+						return elem.parentNode.disabled === disabled;
+					} else {
+						return elem.disabled === disabled;
+					}
+				}
+
+				// Support: IE 6 - 11
+				// Use the isDisabled shortcut property to check for disabled fieldset ancestors
+				return elem.isDisabled === disabled ||
+
+					// Where there is no isDisabled, check manually
+					/* jshint -W018 */
+					elem.isDisabled !== !disabled &&
+						inDisabledFieldset( elem ) === disabled;
+			}
+
+			return elem.disabled === disabled;
+
+		// Try to winnow out elements that can't be disabled before trusting the disabled property.
+		// Some victims get caught in our net (label, legend, menu, track), but it shouldn't
+		// even exist on them, let alone have a boolean value.
+		} else if ( "label" in elem ) {
+			return elem.disabled === disabled;
+		}
+
+		// Remaining elements are neither :enabled nor :disabled
+		return false;
+	};
+}
+
+/**
+ * Returns a function to use in pseudos for positionals
+ * @param {Function} fn
+ */
+function createPositionalPseudo( fn ) {
+	return markFunction(function( argument ) {
+		argument = +argument;
+		return markFunction(function( seed, matches ) {
+			var j,
+				matchIndexes = fn( [], seed.length, argument ),
+				i = matchIndexes.length;
+
+			// Match elements found at the specified indexes
+			while ( i-- ) {
+				if ( seed[ (j = matchIndexes[i]) ] ) {
+					seed[j] = !(matches[j] = seed[j]);
+				}
+			}
+		});
+	});
+}
+
+/**
+ * Checks a node for validity as a Sizzle context
+ * @param {Element|Object=} context
+ * @returns {Element|Object|Boolean} The input node if acceptable, otherwise a falsy value
+ */
+function testContext( context ) {
+	return context && typeof context.getElementsByTagName !== "undefined" && context;
+}
+
+// Expose support vars for convenience
+support = Sizzle.support = {};
+
+/**
+ * Detects XML nodes
+ * @param {Element|Object} elem An element or a document
+ * @returns {Boolean} True iff elem is a non-HTML XML node
+ */
+isXML = Sizzle.isXML = function( elem ) {
+	var namespace = elem.namespaceURI,
+		docElem = (elem.ownerDocument || elem).documentElement;
+
+	// Support: IE <=8
+	// Assume HTML when documentElement doesn't yet exist, such as inside loading iframes
+	// https://bugs.jquery.com/ticket/4833
+	return !rhtml.test( namespace || docElem && docElem.nodeName || "HTML" );
+};
+
+/**
+ * Sets document-related variables once based on the current document
+ * @param {Element|Object} [doc] An element or document object to use to set the document
+ * @returns {Object} Returns the current document
+ */
+setDocument = Sizzle.setDocument = function( node ) {
+	var hasCompare, subWindow,
+		doc = node ? node.ownerDocument || node : preferredDoc;
+
+	// Return early if doc is invalid or already selected
+	if ( doc === document || doc.nodeType !== 9 || !doc.documentElement ) {
+		return document;
+	}
+
+	// Update global variables
+	document = doc;
+	docElem = document.documentElement;
+	documentIsHTML = !isXML( document );
+
+	// Support: IE 9-11, Edge
+	// Accessing iframe documents after unload throws "permission denied" errors (jQuery #13936)
+	if ( preferredDoc !== document &&
+		(subWindow = document.defaultView) && subWindow.top !== subWindow ) {
+
+		// Support: IE 11, Edge
+		if ( subWindow.addEventListener ) {
+			subWindow.addEventListener( "unload", unloadHandler, false );
+
+		// Support: IE 9 - 10 only
+		} else if ( subWindow.attachEvent ) {
+			subWindow.attachEvent( "onunload", unloadHandler );
+		}
+	}
+
+	/* Attributes
+	---------------------------------------------------------------------- */
+
+	// Support: IE<8
+	// Verify that getAttribute really returns attributes and not properties
+	// (excepting IE8 booleans)
+	support.attributes = assert(function( el ) {
+		el.className = "i";
+		return !el.getAttribute("className");
+	});
+
+	/* getElement(s)By*
+	---------------------------------------------------------------------- */
+
+	// Check if getElementsByTagName("*") returns only elements
+	support.getElementsByTagName = assert(function( el ) {
+		el.appendChild( document.createComment("") );
+		return !el.getElementsByTagName("*").length;
+	});
+
+	// Support: IE<9
+	support.getElementsByClassName = rnative.test( document.getElementsByClassName );
+
+	// Support: IE<10
+	// Check if getElementById returns elements by name
+	// The broken getElementById methods don't pick up programmatically-set names,
+	// so use a roundabout getElementsByName test
+	support.getById = assert(function( el ) {
+		docElem.appendChild( el ).id = expando;
+		return !document.getElementsByName || !document.getElementsByName( expando ).length;
+	});
+
+	// ID filter and find
+	if ( support.getById ) {
+		Expr.filter["ID"] = function( id ) {
+			var attrId = id.replace( runescape, funescape );
+			return function( elem ) {
+				return elem.getAttribute("id") === attrId;
+			};
+		};
+		Expr.find["ID"] = function( id, context ) {
+			if ( typeof context.getElementById !== "undefined" && documentIsHTML ) {
+				var elem = context.getElementById( id );
+				return elem ? [ elem ] : [];
+			}
+		};
+	} else {
+		Expr.filter["ID"] =  function( id ) {
+			var attrId = id.replace( runescape, funescape );
+			return function( elem ) {
+				var node = typeof elem.getAttributeNode !== "undefined" &&
+					elem.getAttributeNode("id");
+				return node && node.value === attrId;
+			};
+		};
+
+		// Support: IE 6 - 7 only
+		// getElementById is not reliable as a find shortcut
+		Expr.find["ID"] = function( id, context ) {
+			if ( typeof context.getElementById !== "undefined" && documentIsHTML ) {
+				var node, i, elems,
+					elem = context.getElementById( id );
+
+				if ( elem ) {
+
+					// Verify the id attribute
+					node = elem.getAttributeNode("id");
+					if ( node && node.value === id ) {
+						return [ elem ];
+					}
+
+					// Fall back on getElementsByName
+					elems = context.getElementsByName( id );
+					i = 0;
+					while ( (elem = elems[i++]) ) {
+						node = elem.getAttributeNode("id");
+						if ( node && node.value === id ) {
+							return [ elem ];
+						}
+					}
+				}
+
+				return [];
+			}
+		};
+	}
+
+	// Tag
+	Expr.find["TAG"] = support.getElementsByTagName ?
+		function( tag, context ) {
+			if ( typeof context.getElementsByTagName !== "undefined" ) {
+				return context.getElementsByTagName( tag );
+
+			// DocumentFragment nodes don't have gEBTN
+			} else if ( support.qsa ) {
+				return context.querySelectorAll( tag );
+			}
+		} :
+
+		function( tag, context ) {
+			var elem,
+				tmp = [],
+				i = 0,
+				// By happy coincidence, a (broken) gEBTN appears on DocumentFragment nodes too
+				results = context.getElementsByTagName( tag );
+
+			// Filter out possible comments
+			if ( tag === "*" ) {
+				while ( (elem = results[i++]) ) {
+					if ( elem.nodeType === 1 ) {
+						tmp.push( elem );
+					}
+				}
+
+				return tmp;
+			}
+			return results;
+		};
+
+	// Class
+	Expr.find["CLASS"] = support.getElementsByClassName && function( className, context ) {
+		if ( typeof context.getElementsByClassName !== "undefined" && documentIsHTML ) {
+			return context.getElementsByClassName( className );
+		}
+	};
+
+	/* QSA/matchesSelector
+	---------------------------------------------------------------------- */
+
+	// QSA and matchesSelector support
+
+	// matchesSelector(:active) reports false when true (IE9/Opera 11.5)
+	rbuggyMatches = [];
+
+	// qSa(:focus) reports false when true (Chrome 21)
+	// We allow this because of a bug in IE8/9 that throws an error
+	// whenever `document.activeElement` is accessed on an iframe
+	// So, we allow :focus to pass through QSA all the time to avoid the IE error
+	// See https://bugs.jquery.com/ticket/13378
+	rbuggyQSA = [];
+
+	if ( (support.qsa = rnative.test( document.querySelectorAll )) ) {
+		// Build QSA regex
+		// Regex strategy adopted from Diego Perini
+		assert(function( el ) {
+			// Select is set to empty string on purpose
+			// This is to test IE's treatment of not explicitly
+			// setting a boolean content attribute,
+			// since its presence should be enough
+			// https://bugs.jquery.com/ticket/12359
+			docElem.appendChild( el ).innerHTML = "<a id='" + expando + "'></a>" +
+				"<select id='" + expando + "-\r\\' msallowcapture=''>" +
+				"<option selected=''></option></select>";
+
+			// Support: IE8, Opera 11-12.16
+			// Nothing should be selected when empty strings follow ^= or $= or *=
+			// The test attribute must be unknown in Opera but "safe" for WinRT
+			// https://msdn.microsoft.com/en-us/library/ie/hh465388.aspx#attribute_section
+			if ( el.querySelectorAll("[msallowcapture^='']").length ) {
+				rbuggyQSA.push( "[*^$]=" + whitespace + "*(?:''|\"\")" );
+			}
+
+			// Support: IE8
+			// Boolean attributes and "value" are not treated correctly
+			if ( !el.querySelectorAll("[selected]").length ) {
+				rbuggyQSA.push( "\\[" + whitespace + "*(?:value|" + booleans + ")" );
+			}
+
+			// Support: Chrome<29, Android<4.4, Safari<7.0+, iOS<7.0+, PhantomJS<1.9.8+
+			if ( !el.querySelectorAll( "[id~=" + expando + "-]" ).length ) {
+				rbuggyQSA.push("~=");
+			}
+
+			// Webkit/Opera - :checked should return selected option elements
+			// http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked
+			// IE8 throws error here and will not see later tests
+			if ( !el.querySelectorAll(":checked").length ) {
+				rbuggyQSA.push(":checked");
+			}
+
+			// Support: Safari 8+, iOS 8+
+			// https://bugs.webkit.org/show_bug.cgi?id=136851
+			// In-page `selector#id sibling-combinator selector` fails
+			if ( !el.querySelectorAll( "a#" + expando + "+*" ).length ) {
+				rbuggyQSA.push(".#.+[+~]");
+			}
+		});
+
+		assert(function( el ) {
+			el.innerHTML = "<a href='' disabled='disabled'></a>" +
+				"<select disabled='disabled'><option/></select>";
+
+			// Support: Windows 8 Native Apps
+			// The type and name attributes are restricted during .innerHTML assignment
+			var input = document.createElement("input");
+			input.setAttribute( "type", "hidden" );
+			el.appendChild( input ).setAttribute( "name", "D" );
+
+			// Support: IE8
+			// Enforce case-sensitivity of name attribute
+			if ( el.querySelectorAll("[name=d]").length ) {
+				rbuggyQSA.push( "name" + whitespace + "*[*^$|!~]?=" );
+			}
+
+			// FF 3.5 - :enabled/:disabled and hidden elements (hidden elements are still enabled)
+			// IE8 throws error here and will not see later tests
+			if ( el.querySelectorAll(":enabled").length !== 2 ) {
+				rbuggyQSA.push( ":enabled", ":disabled" );
+			}
+
+			// Support: IE9-11+
+			// IE's :disabled selector does not pick up the children of disabled fieldsets
+			docElem.appendChild( el ).disabled = true;
+			if ( el.querySelectorAll(":disabled").length !== 2 ) {
+				rbuggyQSA.push( ":enabled", ":disabled" );
+			}
+
+			// Opera 10-11 does not throw on post-comma invalid pseudos
+			el.querySelectorAll("*,:x");
+			rbuggyQSA.push(",.*:");
+		});
+	}
+
+	if ( (support.matchesSelector = rnative.test( (matches = docElem.matches ||
+		docElem.webkitMatchesSelector ||
+		docElem.mozMatchesSelector ||
+		docElem.oMatchesSelector ||
+		docElem.msMatchesSelector) )) ) {
+
+		assert(function( el ) {
+			// Check to see if it's possible to do matchesSelector
+			// on a disconnected node (IE 9)
+			support.disconnectedMatch = matches.call( el, "*" );
+
+			// This should fail with an exception
+			// Gecko does not error, returns false instead
+			matches.call( el, "[s!='']:x" );
+			rbuggyMatches.push( "!=", pseudos );
+		});
+	}
+
+	rbuggyQSA = rbuggyQSA.length && new RegExp( rbuggyQSA.join("|") );
+	rbuggyMatches = rbuggyMatches.length && new RegExp( rbuggyMatches.join("|") );
+
+	/* Contains
+	---------------------------------------------------------------------- */
+	hasCompare = rnative.test( docElem.compareDocumentPosition );
+
+	// Element contains another
+	// Purposefully self-exclusive
+	// As in, an element does not contain itself
+	contains = hasCompare || rnative.test( docElem.contains ) ?
+		function( a, b ) {
+			var adown = a.nodeType === 9 ? a.documentElement : a,
+				bup = b && b.parentNode;
+			return a === bup || !!( bup && bup.nodeType === 1 && (
+				adown.contains ?
+					adown.contains( bup ) :
+					a.compareDocumentPosition && a.compareDocumentPosition( bup ) & 16
+			));
+		} :
+		function( a, b ) {
+			if ( b ) {
+				while ( (b = b.parentNode) ) {
+					if ( b === a ) {
+						return true;
+					}
+				}
+			}
+			return false;
+		};
+
+	/* Sorting
+	---------------------------------------------------------------------- */
+
+	// Document order sorting
+	sortOrder = hasCompare ?
+	function( a, b ) {
+
+		// Flag for duplicate removal
+		if ( a === b ) {
+			hasDuplicate = true;
+			return 0;
+		}
+
+		// Sort on method existence if only one input has compareDocumentPosition
+		var compare = !a.compareDocumentPosition - !b.compareDocumentPosition;
+		if ( compare ) {
+			return compare;
+		}
+
+		// Calculate position if both inputs belong to the same document
+		compare = ( a.ownerDocument || a ) === ( b.ownerDocument || b ) ?
+			a.compareDocumentPosition( b ) :
+
+			// Otherwise we know they are disconnected
+			1;
+
+		// Disconnected nodes
+		if ( compare & 1 ||
+			(!support.sortDetached && b.compareDocumentPosition( a ) === compare) ) {
+
+			// Choose the first element that is related to our preferred document
+			if ( a === document || a.ownerDocument === preferredDoc && contains(preferredDoc, a) ) {
+				return -1;
+			}
+			if ( b === document || b.ownerDocument === preferredDoc && contains(preferredDoc, b) ) {
+				return 1;
+			}
+
+			// Maintain original order
+			return sortInput ?
+				( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) :
+				0;
+		}
+
+		return compare & 4 ? -1 : 1;
+	} :
+	function( a, b ) {
+		// Exit early if the nodes are identical
+		if ( a === b ) {
+			hasDuplicate = true;
+			return 0;
+		}
+
+		var cur,
+			i = 0,
+			aup = a.parentNode,
+			bup = b.parentNode,
+			ap = [ a ],
+			bp = [ b ];
+
+		// Parentless nodes are either documents or disconnected
+		if ( !aup || !bup ) {
+			return a === document ? -1 :
+				b === document ? 1 :
+				aup ? -1 :
+				bup ? 1 :
+				sortInput ?
+				( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) :
+				0;
+
+		// If the nodes are siblings, we can do a quick check
+		} else if ( aup === bup ) {
+			return siblingCheck( a, b );
+		}
+
+		// Otherwise we need full lists of their ancestors for comparison
+		cur = a;
+		while ( (cur = cur.parentNode) ) {
+			ap.unshift( cur );
+		}
+		cur = b;
+		while ( (cur = cur.parentNode) ) {
+			bp.unshift( cur );
+		}
+
+		// Walk down the tree looking for a discrepancy
+		while ( ap[i] === bp[i] ) {
+			i++;
+		}
+
+		return i ?
+			// Do a sibling check if the nodes have a common ancestor
+			siblingCheck( ap[i], bp[i] ) :
+
+			// Otherwise nodes in our document sort first
+			ap[i] === preferredDoc ? -1 :
+			bp[i] === preferredDoc ? 1 :
+			0;
+	};
+
+	return document;
+};
+
+Sizzle.matches = function( expr, elements ) {
+	return Sizzle( expr, null, null, elements );
+};
+
+Sizzle.matchesSelector = function( elem, expr ) {
+	// Set document vars if needed
+	if ( ( elem.ownerDocument || elem ) !== document ) {
+		setDocument( elem );
+	}
+
+	if ( support.matchesSelector && documentIsHTML &&
+		!nonnativeSelectorCache[ expr + " " ] &&
+		( !rbuggyMatches || !rbuggyMatches.test( expr ) ) &&
+		( !rbuggyQSA     || !rbuggyQSA.test( expr ) ) ) {
+
+		try {
+			var ret = matches.call( elem, expr );
+
+			// IE 9's matchesSelector returns false on disconnected nodes
+			if ( ret || support.disconnectedMatch ||
+					// As well, disconnected nodes are said to be in a document
+					// fragment in IE 9
+					elem.document && elem.document.nodeType !== 11 ) {
+				return ret;
+			}
+		} catch (e) {
+			nonnativeSelectorCache( expr, true );
+		}
+	}
+
+	return Sizzle( expr, document, null, [ elem ] ).length > 0;
+};
+
+Sizzle.contains = function( context, elem ) {
+	// Set document vars if needed
+	if ( ( context.ownerDocument || context ) !== document ) {
+		setDocument( context );
+	}
+	return contains( context, elem );
+};
+
+Sizzle.attr = function( elem, name ) {
+	// Set document vars if needed
+	if ( ( elem.ownerDocument || elem ) !== document ) {
+		setDocument( elem );
+	}
+
+	var fn = Expr.attrHandle[ name.toLowerCase() ],
+		// Don't get fooled by Object.prototype properties (jQuery #13807)
+		val = fn && hasOwn.call( Expr.attrHandle, name.toLowerCase() ) ?
+			fn( elem, name, !documentIsHTML ) :
+			undefined;
+
+	return val !== undefined ?
+		val :
+		support.attributes || !documentIsHTML ?
+			elem.getAttribute( name ) :
+			(val = elem.getAttributeNode(name)) && val.specified ?
+				val.value :
+				null;
+};
+
+Sizzle.escape = function( sel ) {
+	return (sel + "").replace( rcssescape, fcssescape );
+};
+
+Sizzle.error = function( msg ) {
+	throw new Error( "Syntax error, unrecognized expression: " + msg );
+};
+
+/**
+ * Document sorting and removing duplicates
+ * @param {ArrayLike} results
+ */
+Sizzle.uniqueSort = function( results ) {
+	var elem,
+		duplicates = [],
+		j = 0,
+		i = 0;
+
+	// Unless we *know* we can detect duplicates, assume their presence
+	hasDuplicate = !support.detectDuplicates;
+	sortInput = !support.sortStable && results.slice( 0 );
+	results.sort( sortOrder );
+
+	if ( hasDuplicate ) {
+		while ( (elem = results[i++]) ) {
+			if ( elem === results[ i ] ) {
+				j = duplicates.push( i );
+			}
+		}
+		while ( j-- ) {
+			results.splice( duplicates[ j ], 1 );
+		}
+	}
+
+	// Clear input after sorting to release objects
+	// See https://github.com/jquery/sizzle/pull/225
+	sortInput = null;
+
+	return results;
+};
+
+/**
+ * Utility function for retrieving the text value of an array of DOM nodes
+ * @param {Array|Element} elem
+ */
+getText = Sizzle.getText = function( elem ) {
+	var node,
+		ret = "",
+		i = 0,
+		nodeType = elem.nodeType;
+
+	if ( !nodeType ) {
+		// If no nodeType, this is expected to be an array
+		while ( (node = elem[i++]) ) {
+			// Do not traverse comment nodes
+			ret += getText( node );
+		}
+	} else if ( nodeType === 1 || nodeType === 9 || nodeType === 11 ) {
+		// Use textContent for elements
+		// innerText usage removed for consistency of new lines (jQuery #11153)
+		if ( typeof elem.textContent === "string" ) {
+			return elem.textContent;
+		} else {
+			// Traverse its children
+			for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {
+				ret += getText( elem );
+			}
+		}
+	} else if ( nodeType === 3 || nodeType === 4 ) {
+		return elem.nodeValue;
+	}
+	// Do not include comment or processing instruction nodes
+
+	return ret;
+};
+
+Expr = Sizzle.selectors = {
+
+	// Can be adjusted by the user
+	cacheLength: 50,
+
+	createPseudo: markFunction,
+
+	match: matchExpr,
+
+	attrHandle: {},
+
+	find: {},
+
+	relative: {
+		">": { dir: "parentNode", first: true },
+		" ": { dir: "parentNode" },
+		"+": { dir: "previousSibling", first: true },
+		"~": { dir: "previousSibling" }
+	},
+
+	preFilter: {
+		"ATTR": function( match ) {
+			match[1] = match[1].replace( runescape, funescape );
+
+			// Move the given value to match[3] whether quoted or unquoted
+			match[3] = ( match[3] || match[4] || match[5] || "" ).replace( runescape, funescape );
+
+			if ( match[2] === "~=" ) {
+				match[3] = " " + match[3] + " ";
+			}
+
+			return match.slice( 0, 4 );
+		},
+
+		"CHILD": function( match ) {
+			/* matches from matchExpr["CHILD"]
+				1 type (only|nth|...)
+				2 what (child|of-type)
+				3 argument (even|odd|\d*|\d*n([+-]\d+)?|...)
+				4 xn-component of xn+y argument ([+-]?\d*n|)
+				5 sign of xn-component
+				6 x of xn-component
+				7 sign of y-component
+				8 y of y-component
+			*/
+			match[1] = match[1].toLowerCase();
+
+			if ( match[1].slice( 0, 3 ) === "nth" ) {
+				// nth-* requires argument
+				if ( !match[3] ) {
+					Sizzle.error( match[0] );
+				}
+
+				// numeric x and y parameters for Expr.filter.CHILD
+				// remember that false/true cast respectively to 0/1
+				match[4] = +( match[4] ? match[5] + (match[6] || 1) : 2 * ( match[3] === "even" || match[3] === "odd" ) );
+				match[5] = +( ( match[7] + match[8] ) || match[3] === "odd" );
+
+			// other types prohibit arguments
+			} else if ( match[3] ) {
+				Sizzle.error( match[0] );
+			}
+
+			return match;
+		},
+
+		"PSEUDO": function( match ) {
+			var excess,
+				unquoted = !match[6] && match[2];
+
+			if ( matchExpr["CHILD"].test( match[0] ) ) {
+				return null;
+			}
+
+			// Accept quoted arguments as-is
+			if ( match[3] ) {
+				match[2] = match[4] || match[5] || "";
+
+			// Strip excess characters from unquoted arguments
+			} else if ( unquoted && rpseudo.test( unquoted ) &&
+				// Get excess from tokenize (recursively)
+				(excess = tokenize( unquoted, true )) &&
+				// advance to the next closing parenthesis
+				(excess = unquoted.indexOf( ")", unquoted.length - excess ) - unquoted.length) ) {
+
+				// excess is a negative index
+				match[0] = match[0].slice( 0, excess );
+				match[2] = unquoted.slice( 0, excess );
+			}
+
+			// Return only captures needed by the pseudo filter method (type and argument)
+			return match.slice( 0, 3 );
+		}
+	},
+
+	filter: {
+
+		"TAG": function( nodeNameSelector ) {
+			var nodeName = nodeNameSelector.replace( runescape, funescape ).toLowerCase();
+			return nodeNameSelector === "*" ?
+				function() { return true; } :
+				function( elem ) {
+					return elem.nodeName && elem.nodeName.toLowerCase() === nodeName;
+				};
+		},
+
+		"CLASS": function( className ) {
+			var pattern = classCache[ className + " " ];
+
+			return pattern ||
+				(pattern = new RegExp( "(^|" + whitespace + ")" + className + "(" + whitespace + "|$)" )) &&
+				classCache( className, function( elem ) {
+					return pattern.test( typeof elem.className === "string" && elem.className || typeof elem.getAttribute !== "undefined" && elem.getAttribute("class") || "" );
+				});
+		},
+
+		"ATTR": function( name, operator, check ) {
+			return function( elem ) {
+				var result = Sizzle.attr( elem, name );
+
+				if ( result == null ) {
+					return operator === "!=";
+				}
+				if ( !operator ) {
+					return true;
+				}
+
+				result += "";
+
+				return operator === "=" ? result === check :
+					operator === "!=" ? result !== check :
+					operator === "^=" ? check && result.indexOf( check ) === 0 :
+					operator === "*=" ? check && result.indexOf( check ) > -1 :
+					operator === "$=" ? check && result.slice( -check.length ) === check :
+					operator === "~=" ? ( " " + result.replace( rwhitespace, " " ) + " " ).indexOf( check ) > -1 :
+					operator === "|=" ? result === check || result.slice( 0, check.length + 1 ) === check + "-" :
+					false;
+			};
+		},
+
+		"CHILD": function( type, what, argument, first, last ) {
+			var simple = type.slice( 0, 3 ) !== "nth",
+				forward = type.slice( -4 ) !== "last",
+				ofType = what === "of-type";
+
+			return first === 1 && last === 0 ?
+
+				// Shortcut for :nth-*(n)
+				function( elem ) {
+					return !!elem.parentNode;
+				} :
+
+				function( elem, context, xml ) {
+					var cache, uniqueCache, outerCache, node, nodeIndex, start,
+						dir = simple !== forward ? "nextSibling" : "previousSibling",
+						parent = elem.parentNode,
+						name = ofType && elem.nodeName.toLowerCase(),
+						useCache = !xml && !ofType,
+						diff = false;
+
+					if ( parent ) {
+
+						// :(first|last|only)-(child|of-type)
+						if ( simple ) {
+							while ( dir ) {
+								node = elem;
+								while ( (node = node[ dir ]) ) {
+									if ( ofType ?
+										node.nodeName.toLowerCase() === name :
+										node.nodeType === 1 ) {
+
+										return false;
+									}
+								}
+								// Reverse direction for :only-* (if we haven't yet done so)
+								start = dir = type === "only" && !start && "nextSibling";
+							}
+							return true;
+						}
+
+						start = [ forward ? parent.firstChild : parent.lastChild ];
+
+						// non-xml :nth-child(...) stores cache data on `parent`
+						if ( forward && useCache ) {
+
+							// Seek `elem` from a previously-cached index
+
+							// ...in a gzip-friendly way
+							node = parent;
+							outerCache = node[ expando ] || (node[ expando ] = {});
+
+							// Support: IE <9 only
+							// Defend against cloned attroperties (jQuery gh-1709)
+							uniqueCache = outerCache[ node.uniqueID ] ||
+								(outerCache[ node.uniqueID ] = {});
+
+							cache = uniqueCache[ type ] || [];
+							nodeIndex = cache[ 0 ] === dirruns && cache[ 1 ];
+							diff = nodeIndex && cache[ 2 ];
+							node = nodeIndex && parent.childNodes[ nodeIndex ];
+
+							while ( (node = ++nodeIndex && node && node[ dir ] ||
+
+								// Fallback to seeking `elem` from the start
+								(diff = nodeIndex = 0) || start.pop()) ) {
+
+								// When found, cache indexes on `parent` and break
+								if ( node.nodeType === 1 && ++diff && node === elem ) {
+									uniqueCache[ type ] = [ dirruns, nodeIndex, diff ];
+									break;
+								}
+							}
+
+						} else {
+							// Use previously-cached element index if available
+							if ( useCache ) {
+								// ...in a gzip-friendly way
+								node = elem;
+								outerCache = node[ expando ] || (node[ expando ] = {});
+
+								// Support: IE <9 only
+								// Defend against cloned attroperties (jQuery gh-1709)
+								uniqueCache = outerCache[ node.uniqueID ] ||
+									(outerCache[ node.uniqueID ] = {});
+
+								cache = uniqueCache[ type ] || [];
+								nodeIndex = cache[ 0 ] === dirruns && cache[ 1 ];
+								diff = nodeIndex;
+							}
+
+							// xml :nth-child(...)
+							// or :nth-last-child(...) or :nth(-last)?-of-type(...)
+							if ( diff === false ) {
+								// Use the same loop as above to seek `elem` from the start
+								while ( (node = ++nodeIndex && node && node[ dir ] ||
+									(diff = nodeIndex = 0) || start.pop()) ) {
+
+									if ( ( ofType ?
+										node.nodeName.toLowerCase() === name :
+										node.nodeType === 1 ) &&
+										++diff ) {
+
+										// Cache the index of each encountered element
+										if ( useCache ) {
+											outerCache = node[ expando ] || (node[ expando ] = {});
+
+											// Support: IE <9 only
+											// Defend against cloned attroperties (jQuery gh-1709)
+											uniqueCache = outerCache[ node.uniqueID ] ||
+												(outerCache[ node.uniqueID ] = {});
+
+											uniqueCache[ type ] = [ dirruns, diff ];
+										}
+
+										if ( node === elem ) {
+											break;
+										}
+									}
+								}
+							}
+						}
+
+						// Incorporate the offset, then check against cycle size
+						diff -= last;
+						return diff === first || ( diff % first === 0 && diff / first >= 0 );
+					}
+				};
+		},
+
+		"PSEUDO": function( pseudo, argument ) {
+			// pseudo-class names are case-insensitive
+			// http://www.w3.org/TR/selectors/#pseudo-classes
+			// Prioritize by case sensitivity in case custom pseudos are added with uppercase letters
+			// Remember that setFilters inherits from pseudos
+			var args,
+				fn = Expr.pseudos[ pseudo ] || Expr.setFilters[ pseudo.toLowerCase() ] ||
+					Sizzle.error( "unsupported pseudo: " + pseudo );
+
+			// The user may use createPseudo to indicate that
+			// arguments are needed to create the filter function
+			// just as Sizzle does
+			if ( fn[ expando ] ) {
+				return fn( argument );
+			}
+
+			// But maintain support for old signatures
+			if ( fn.length > 1 ) {
+				args = [ pseudo, pseudo, "", argument ];
+				return Expr.setFilters.hasOwnProperty( pseudo.toLowerCase() ) ?
+					markFunction(function( seed, matches ) {
+						var idx,
+							matched = fn( seed, argument ),
+							i = matched.length;
+						while ( i-- ) {
+							idx = indexOf( seed, matched[i] );
+							seed[ idx ] = !( matches[ idx ] = matched[i] );
+						}
+					}) :
+					function( elem ) {
+						return fn( elem, 0, args );
+					};
+			}
+
+			return fn;
+		}
+	},
+
+	pseudos: {
+		// Potentially complex pseudos
+		"not": markFunction(function( selector ) {
+			// Trim the selector passed to compile
+			// to avoid treating leading and trailing
+			// spaces as combinators
+			var input = [],
+				results = [],
+				matcher = compile( selector.replace( rtrim, "$1" ) );
+
+			return matcher[ expando ] ?
+				markFunction(function( seed, matches, context, xml ) {
+					var elem,
+						unmatched = matcher( seed, null, xml, [] ),
+						i = seed.length;
+
+					// Match elements unmatched by `matcher`
+					while ( i-- ) {
+						if ( (elem = unmatched[i]) ) {
+							seed[i] = !(matches[i] = elem);
+						}
+					}
+				}) :
+				function( elem, context, xml ) {
+					input[0] = elem;
+					matcher( input, null, xml, results );
+					// Don't keep the element (issue #299)
+					input[0] = null;
+					return !results.pop();
+				};
+		}),
+
+		"has": markFunction(function( selector ) {
+			return function( elem ) {
+				return Sizzle( selector, elem ).length > 0;
+			};
+		}),
+
+		"contains": markFunction(function( text ) {
+			text = text.replace( runescape, funescape );
+			return function( elem ) {
+				return ( elem.textContent || getText( elem ) ).indexOf( text ) > -1;
+			};
+		}),
+
+		// "Whether an element is represented by a :lang() selector
+		// is based solely on the element's language value
+		// being equal to the identifier C,
+		// or beginning with the identifier C immediately followed by "-".
+		// The matching of C against the element's language value is performed case-insensitively.
+		// The identifier C does not have to be a valid language name."
+		// http://www.w3.org/TR/selectors/#lang-pseudo
+		"lang": markFunction( function( lang ) {
+			// lang value must be a valid identifier
+			if ( !ridentifier.test(lang || "") ) {
+				Sizzle.error( "unsupported lang: " + lang );
+			}
+			lang = lang.replace( runescape, funescape ).toLowerCase();
+			return function( elem ) {
+				var elemLang;
+				do {
+					if ( (elemLang = documentIsHTML ?
+						elem.lang :
+						elem.getAttribute("xml:lang") || elem.getAttribute("lang")) ) {
+
+						elemLang = elemLang.toLowerCase();
+						return elemLang === lang || elemLang.indexOf( lang + "-" ) === 0;
+					}
+				} while ( (elem = elem.parentNode) && elem.nodeType === 1 );
+				return false;
+			};
+		}),
+
+		// Miscellaneous
+		"target": function( elem ) {
+			var hash = window.location && window.location.hash;
+			return hash && hash.slice( 1 ) === elem.id;
+		},
+
+		"root": function( elem ) {
+			return elem === docElem;
+		},
+
+		"focus": function( elem ) {
+			return elem === document.activeElement && (!document.hasFocus || document.hasFocus()) && !!(elem.type || elem.href || ~elem.tabIndex);
+		},
+
+		// Boolean properties
+		"enabled": createDisabledPseudo( false ),
+		"disabled": createDisabledPseudo( true ),
+
+		"checked": function( elem ) {
+			// In CSS3, :checked should return both checked and selected elements
+			// http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked
+			var nodeName = elem.nodeName.toLowerCase();
+			return (nodeName === "input" && !!elem.checked) || (nodeName === "option" && !!elem.selected);
+		},
+
+		"selected": function( elem ) {
+			// Accessing this property makes selected-by-default
+			// options in Safari work properly
+			if ( elem.parentNode ) {
+				elem.parentNode.selectedIndex;
+			}
+
+			return elem.selected === true;
+		},
+
+		// Contents
+		"empty": function( elem ) {
+			// http://www.w3.org/TR/selectors/#empty-pseudo
+			// :empty is negated by element (1) or content nodes (text: 3; cdata: 4; entity ref: 5),
+			//   but not by others (comment: 8; processing instruction: 7; etc.)
+			// nodeType < 6 works because attributes (2) do not appear as children
+			for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {
+				if ( elem.nodeType < 6 ) {
+					return false;
+				}
+			}
+			return true;
+		},
+
+		"parent": function( elem ) {
+			return !Expr.pseudos["empty"]( elem );
+		},
+
+		// Element/input types
+		"header": function( elem ) {
+			return rheader.test( elem.nodeName );
+		},
+
+		"input": function( elem ) {
+			return rinputs.test( elem.nodeName );
+		},
+
+		"button": function( elem ) {
+			var name = elem.nodeName.toLowerCase();
+			return name === "input" && elem.type === "button" || name === "button";
+		},
+
+		"text": function( elem ) {
+			var attr;
+			return elem.nodeName.toLowerCase() === "input" &&
+				elem.type === "text" &&
+
+				// Support: IE<8
+				// New HTML5 attribute values (e.g., "search") appear with elem.type === "text"
+				( (attr = elem.getAttribute("type")) == null || attr.toLowerCase() === "text" );
+		},
+
+		// Position-in-collection
+		"first": createPositionalPseudo(function() {
+			return [ 0 ];
+		}),
+
+		"last": createPositionalPseudo(function( matchIndexes, length ) {
+			return [ length - 1 ];
+		}),
+
+		"eq": createPositionalPseudo(function( matchIndexes, length, argument ) {
+			return [ argument < 0 ? argument + length : argument ];
+		}),
+
+		"even": createPositionalPseudo(function( matchIndexes, length ) {
+			var i = 0;
+			for ( ; i < length; i += 2 ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		}),
+
+		"odd": createPositionalPseudo(function( matchIndexes, length ) {
+			var i = 1;
+			for ( ; i < length; i += 2 ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		}),
+
+		"lt": createPositionalPseudo(function( matchIndexes, length, argument ) {
+			var i = argument < 0 ?
+				argument + length :
+				argument > length ?
+					length :
+					argument;
+			for ( ; --i >= 0; ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		}),
+
+		"gt": createPositionalPseudo(function( matchIndexes, length, argument ) {
+			var i = argument < 0 ? argument + length : argument;
+			for ( ; ++i < length; ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		})
+	}
+};
+
+Expr.pseudos["nth"] = Expr.pseudos["eq"];
+
+// Add button/input type pseudos
+for ( i in { radio: true, checkbox: true, file: true, password: true, image: true } ) {
+	Expr.pseudos[ i ] = createInputPseudo( i );
+}
+for ( i in { submit: true, reset: true } ) {
+	Expr.pseudos[ i ] = createButtonPseudo( i );
+}
+
+// Easy API for creating new setFilters
+function setFilters() {}
+setFilters.prototype = Expr.filters = Expr.pseudos;
+Expr.setFilters = new setFilters();
+
+tokenize = Sizzle.tokenize = function( selector, parseOnly ) {
+	var matched, match, tokens, type,
+		soFar, groups, preFilters,
+		cached = tokenCache[ selector + " " ];
+
+	if ( cached ) {
+		return parseOnly ? 0 : cached.slice( 0 );
+	}
+
+	soFar = selector;
+	groups = [];
+	preFilters = Expr.preFilter;
+
+	while ( soFar ) {
+
+		// Comma and first run
+		if ( !matched || (match = rcomma.exec( soFar )) ) {
+			if ( match ) {
+				// Don't consume trailing commas as valid
+				soFar = soFar.slice( match[0].length ) || soFar;
+			}
+			groups.push( (tokens = []) );
+		}
+
+		matched = false;
+
+		// Combinators
+		if ( (match = rcombinators.exec( soFar )) ) {
+			matched = match.shift();
+			tokens.push({
+				value: matched,
+				// Cast descendant combinators to space
+				type: match[0].replace( rtrim, " " )
+			});
+			soFar = soFar.slice( matched.length );
+		}
+
+		// Filters
+		for ( type in Expr.filter ) {
+			if ( (match = matchExpr[ type ].exec( soFar )) && (!preFilters[ type ] ||
+				(match = preFilters[ type ]( match ))) ) {
+				matched = match.shift();
+				tokens.push({
+					value: matched,
+					type: type,
+					matches: match
+				});
+				soFar = soFar.slice( matched.length );
+			}
+		}
+
+		if ( !matched ) {
+			break;
+		}
+	}
+
+	// Return the length of the invalid excess
+	// if we're just parsing
+	// Otherwise, throw an error or return tokens
+	return parseOnly ?
+		soFar.length :
+		soFar ?
+			Sizzle.error( selector ) :
+			// Cache the tokens
+			tokenCache( selector, groups ).slice( 0 );
+};
+
+function toSelector( tokens ) {
+	var i = 0,
+		len = tokens.length,
+		selector = "";
+	for ( ; i < len; i++ ) {
+		selector += tokens[i].value;
+	}
+	return selector;
+}
+
+function addCombinator( matcher, combinator, base ) {
+	var dir = combinator.dir,
+		skip = combinator.next,
+		key = skip || dir,
+		checkNonElements = base && key === "parentNode",
+		doneName = done++;
+
+	return combinator.first ?
+		// Check against closest ancestor/preceding element
+		function( elem, context, xml ) {
+			while ( (elem = elem[ dir ]) ) {
+				if ( elem.nodeType === 1 || checkNonElements ) {
+					return matcher( elem, context, xml );
+				}
+			}
+			return false;
+		} :
+
+		// Check against all ancestor/preceding elements
+		function( elem, context, xml ) {
+			var oldCache, uniqueCache, outerCache,
+				newCache = [ dirruns, doneName ];
+
+			// We can't set arbitrary data on XML nodes, so they don't benefit from combinator caching
+			if ( xml ) {
+				while ( (elem = elem[ dir ]) ) {
+					if ( elem.nodeType === 1 || checkNonElements ) {
+						if ( matcher( elem, context, xml ) ) {
+							return true;
+						}
+					}
+				}
+			} else {
+				while ( (elem = elem[ dir ]) ) {
+					if ( elem.nodeType === 1 || checkNonElements ) {
+						outerCache = elem[ expando ] || (elem[ expando ] = {});
+
+						// Support: IE <9 only
+						// Defend against cloned attroperties (jQuery gh-1709)
+						uniqueCache = outerCache[ elem.uniqueID ] || (outerCache[ elem.uniqueID ] = {});
+
+						if ( skip && skip === elem.nodeName.toLowerCase() ) {
+							elem = elem[ dir ] || elem;
+						} else if ( (oldCache = uniqueCache[ key ]) &&
+							oldCache[ 0 ] === dirruns && oldCache[ 1 ] === doneName ) {
+
+							// Assign to newCache so results back-propagate to previous elements
+							return (newCache[ 2 ] = oldCache[ 2 ]);
+						} else {
+							// Reuse newcache so results back-propagate to previous elements
+							uniqueCache[ key ] = newCache;
+
+							// A match means we're done; a fail means we have to keep checking
+							if ( (newCache[ 2 ] = matcher( elem, context, xml )) ) {
+								return true;
+							}
+						}
+					}
+				}
+			}
+			return false;
+		};
+}
+
+function elementMatcher( matchers ) {
+	return matchers.length > 1 ?
+		function( elem, context, xml ) {
+			var i = matchers.length;
+			while ( i-- ) {
+				if ( !matchers[i]( elem, context, xml ) ) {
+					return false;
+				}
+			}
+			return true;
+		} :
+		matchers[0];
+}
+
+function multipleContexts( selector, contexts, results ) {
+	var i = 0,
+		len = contexts.length;
+	for ( ; i < len; i++ ) {
+		Sizzle( selector, contexts[i], results );
+	}
+	return results;
+}
+
+function condense( unmatched, map, filter, context, xml ) {
+	var elem,
+		newUnmatched = [],
+		i = 0,
+		len = unmatched.length,
+		mapped = map != null;
+
+	for ( ; i < len; i++ ) {
+		if ( (elem = unmatched[i]) ) {
+			if ( !filter || filter( elem, context, xml ) ) {
+				newUnmatched.push( elem );
+				if ( mapped ) {
+					map.push( i );
+				}
+			}
+		}
+	}
+
+	return newUnmatched;
+}
+
+function setMatcher( preFilter, selector, matcher, postFilter, postFinder, postSelector ) {
+	if ( postFilter && !postFilter[ expando ] ) {
+		postFilter = setMatcher( postFilter );
+	}
+	if ( postFinder && !postFinder[ expando ] ) {
+		postFinder = setMatcher( postFinder, postSelector );
+	}
+	return markFunction(function( seed, results, context, xml ) {
+		var temp, i, elem,
+			preMap = [],
+			postMap = [],
+			preexisting = results.length,
+
+			// Get initial elements from seed or context
+			elems = seed || multipleContexts( selector || "*", context.nodeType ? [ context ] : context, [] ),
+
+			// Prefilter to get matcher input, preserving a map for seed-results synchronization
+			matcherIn = preFilter && ( seed || !selector ) ?
+				condense( elems, preMap, preFilter, context, xml ) :
+				elems,
+
+			matcherOut = matcher ?
+				// If we have a postFinder, or filtered seed, or non-seed postFilter or preexisting results,
+				postFinder || ( seed ? preFilter : preexisting || postFilter ) ?
+
+					// ...intermediate processing is necessary
+					[] :
+
+					// ...otherwise use results directly
+					results :
+				matcherIn;
+
+		// Find primary matches
+		if ( matcher ) {
+			matcher( matcherIn, matcherOut, context, xml );
+		}
+
+		// Apply postFilter
+		if ( postFilter ) {
+			temp = condense( matcherOut, postMap );
+			postFilter( temp, [], context, xml );
+
+			// Un-match failing elements by moving them back to matcherIn
+			i = temp.length;
+			while ( i-- ) {
+				if ( (elem = temp[i]) ) {
+					matcherOut[ postMap[i] ] = !(matcherIn[ postMap[i] ] = elem);
+				}
+			}
+		}
+
+		if ( seed ) {
+			if ( postFinder || preFilter ) {
+				if ( postFinder ) {
+					// Get the final matcherOut by condensing this intermediate into postFinder contexts
+					temp = [];
+					i = matcherOut.length;
+					while ( i-- ) {
+						if ( (elem = matcherOut[i]) ) {
+							// Restore matcherIn since elem is not yet a final match
+							temp.push( (matcherIn[i] = elem) );
+						}
+					}
+					postFinder( null, (matcherOut = []), temp, xml );
+				}
+
+				// Move matched elements from seed to results to keep them synchronized
+				i = matcherOut.length;
+				while ( i-- ) {
+					if ( (elem = matcherOut[i]) &&
+						(temp = postFinder ? indexOf( seed, elem ) : preMap[i]) > -1 ) {
+
+						seed[temp] = !(results[temp] = elem);
+					}
+				}
+			}
+
+		// Add elements to results, through postFinder if defined
+		} else {
+			matcherOut = condense(
+				matcherOut === results ?
+					matcherOut.splice( preexisting, matcherOut.length ) :
+					matcherOut
+			);
+			if ( postFinder ) {
+				postFinder( null, results, matcherOut, xml );
+			} else {
+				push.apply( results, matcherOut );
+			}
+		}
+	});
+}
+
+function matcherFromTokens( tokens ) {
+	var checkContext, matcher, j,
+		len = tokens.length,
+		leadingRelative = Expr.relative[ tokens[0].type ],
+		implicitRelative = leadingRelative || Expr.relative[" "],
+		i = leadingRelative ? 1 : 0,
+
+		// The foundational matcher ensures that elements are reachable from top-level context(s)
+		matchContext = addCombinator( function( elem ) {
+			return elem === checkContext;
+		}, implicitRelative, true ),
+		matchAnyContext = addCombinator( function( elem ) {
+			return indexOf( checkContext, elem ) > -1;
+		}, implicitRelative, true ),
+		matchers = [ function( elem, context, xml ) {
+			var ret = ( !leadingRelative && ( xml || context !== outermostContext ) ) || (
+				(checkContext = context).nodeType ?
+					matchContext( elem, context, xml ) :
+					matchAnyContext( elem, context, xml ) );
+			// Avoid hanging onto element (issue #299)
+			checkContext = null;
+			return ret;
+		} ];
+
+	for ( ; i < len; i++ ) {
+		if ( (matcher = Expr.relative[ tokens[i].type ]) ) {
+			matchers = [ addCombinator(elementMatcher( matchers ), matcher) ];
+		} else {
+			matcher = Expr.filter[ tokens[i].type ].apply( null, tokens[i].matches );
+
+			// Return special upon seeing a positional matcher
+			if ( matcher[ expando ] ) {
+				// Find the next relative operator (if any) for proper handling
+				j = ++i;
+				for ( ; j < len; j++ ) {
+					if ( Expr.relative[ tokens[j].type ] ) {
+						break;
+					}
+				}
+				return setMatcher(
+					i > 1 && elementMatcher( matchers ),
+					i > 1 && toSelector(
+						// If the preceding token was a descendant combinator, insert an implicit any-element `*`
+						tokens.slice( 0, i - 1 ).concat({ value: tokens[ i - 2 ].type === " " ? "*" : "" })
+					).replace( rtrim, "$1" ),
+					matcher,
+					i < j && matcherFromTokens( tokens.slice( i, j ) ),
+					j < len && matcherFromTokens( (tokens = tokens.slice( j )) ),
+					j < len && toSelector( tokens )
+				);
+			}
+			matchers.push( matcher );
+		}
+	}
+
+	return elementMatcher( matchers );
+}
+
+function matcherFromGroupMatchers( elementMatchers, setMatchers ) {
+	var bySet = setMatchers.length > 0,
+		byElement = elementMatchers.length > 0,
+		superMatcher = function( seed, context, xml, results, outermost ) {
+			var elem, j, matcher,
+				matchedCount = 0,
+				i = "0",
+				unmatched = seed && [],
+				setMatched = [],
+				contextBackup = outermostContext,
+				// We must always have either seed elements or outermost context
+				elems = seed || byElement && Expr.find["TAG"]( "*", outermost ),
+				// Use integer dirruns iff this is the outermost matcher
+				dirrunsUnique = (dirruns += contextBackup == null ? 1 : Math.random() || 0.1),
+				len = elems.length;
+
+			if ( outermost ) {
+				outermostContext = context === document || context || outermost;
+			}
+
+			// Add elements passing elementMatchers directly to results
+			// Support: IE<9, Safari
+			// Tolerate NodeList properties (IE: "length"; Safari: <number>) matching elements by id
+			for ( ; i !== len && (elem = elems[i]) != null; i++ ) {
+				if ( byElement && elem ) {
+					j = 0;
+					if ( !context && elem.ownerDocument !== document ) {
+						setDocument( elem );
+						xml = !documentIsHTML;
+					}
+					while ( (matcher = elementMatchers[j++]) ) {
+						if ( matcher( elem, context || document, xml) ) {
+							results.push( elem );
+							break;
+						}
+					}
+					if ( outermost ) {
+						dirruns = dirrunsUnique;
+					}
+				}
+
+				// Track unmatched elements for set filters
+				if ( bySet ) {
+					// They will have gone through all possible matchers
+					if ( (elem = !matcher && elem) ) {
+						matchedCount--;
+					}
+
+					// Lengthen the array for every element, matched or not
+					if ( seed ) {
+						unmatched.push( elem );
+					}
+				}
+			}
+
+			// `i` is now the count of elements visited above, and adding it to `matchedCount`
+			// makes the latter nonnegative.
+			matchedCount += i;
+
+			// Apply set filters to unmatched elements
+			// NOTE: This can be skipped if there are no unmatched elements (i.e., `matchedCount`
+			// equals `i`), unless we didn't visit _any_ elements in the above loop because we have
+			// no element matchers and no seed.
+			// Incrementing an initially-string "0" `i` allows `i` to remain a string only in that
+			// case, which will result in a "00" `matchedCount` that differs from `i` but is also
+			// numerically zero.
+			if ( bySet && i !== matchedCount ) {
+				j = 0;
+				while ( (matcher = setMatchers[j++]) ) {
+					matcher( unmatched, setMatched, context, xml );
+				}
+
+				if ( seed ) {
+					// Reintegrate element matches to eliminate the need for sorting
+					if ( matchedCount > 0 ) {
+						while ( i-- ) {
+							if ( !(unmatched[i] || setMatched[i]) ) {
+								setMatched[i] = pop.call( results );
+							}
+						}
+					}
+
+					// Discard index placeholder values to get only actual matches
+					setMatched = condense( setMatched );
+				}
+
+				// Add matches to results
+				push.apply( results, setMatched );
+
+				// Seedless set matches succeeding multiple successful matchers stipulate sorting
+				if ( outermost && !seed && setMatched.length > 0 &&
+					( matchedCount + setMatchers.length ) > 1 ) {
+
+					Sizzle.uniqueSort( results );
+				}
+			}
+
+			// Override manipulation of globals by nested matchers
+			if ( outermost ) {
+				dirruns = dirrunsUnique;
+				outermostContext = contextBackup;
+			}
+
+			return unmatched;
+		};
+
+	return bySet ?
+		markFunction( superMatcher ) :
+		superMatcher;
+}
+
+compile = Sizzle.compile = function( selector, match /* Internal Use Only */ ) {
+	var i,
+		setMatchers = [],
+		elementMatchers = [],
+		cached = compilerCache[ selector + " " ];
+
+	if ( !cached ) {
+		// Generate a function of recursive functions that can be used to check each element
+		if ( !match ) {
+			match = tokenize( selector );
+		}
+		i = match.length;
+		while ( i-- ) {
+			cached = matcherFromTokens( match[i] );
+			if ( cached[ expando ] ) {
+				setMatchers.push( cached );
+			} else {
+				elementMatchers.push( cached );
+			}
+		}
+
+		// Cache the compiled function
+		cached = compilerCache( selector, matcherFromGroupMatchers( elementMatchers, setMatchers ) );
+
+		// Save selector and tokenization
+		cached.selector = selector;
+	}
+	return cached;
+};
+
+/**
+ * A low-level selection function that works with Sizzle's compiled
+ *  selector functions
+ * @param {String|Function} selector A selector or a pre-compiled
+ *  selector function built with Sizzle.compile
+ * @param {Element} context
+ * @param {Array} [results]
+ * @param {Array} [seed] A set of elements to match against
+ */
+select = Sizzle.select = function( selector, context, results, seed ) {
+	var i, tokens, token, type, find,
+		compiled = typeof selector === "function" && selector,
+		match = !seed && tokenize( (selector = compiled.selector || selector) );
+
+	results = results || [];
+
+	// Try to minimize operations if there is only one selector in the list and no seed
+	// (the latter of which guarantees us context)
+	if ( match.length === 1 ) {
+
+		// Reduce context if the leading compound selector is an ID
+		tokens = match[0] = match[0].slice( 0 );
+		if ( tokens.length > 2 && (token = tokens[0]).type === "ID" &&
+				context.nodeType === 9 && documentIsHTML && Expr.relative[ tokens[1].type ] ) {
+
+			context = ( Expr.find["ID"]( token.matches[0].replace(runescape, funescape), context ) || [] )[0];
+			if ( !context ) {
+				return results;
+
+			// Precompiled matchers will still verify ancestry, so step up a level
+			} else if ( compiled ) {
+				context = context.parentNode;
+			}
+
+			selector = selector.slice( tokens.shift().value.length );
+		}
+
+		// Fetch a seed set for right-to-left matching
+		i = matchExpr["needsContext"].test( selector ) ? 0 : tokens.length;
+		while ( i-- ) {
+			token = tokens[i];
+
+			// Abort if we hit a combinator
+			if ( Expr.relative[ (type = token.type) ] ) {
+				break;
+			}
+			if ( (find = Expr.find[ type ]) ) {
+				// Search, expanding context for leading sibling combinators
+				if ( (seed = find(
+					token.matches[0].replace( runescape, funescape ),
+					rsibling.test( tokens[0].type ) && testContext( context.parentNode ) || context
+				)) ) {
+
+					// If seed is empty or no tokens remain, we can return early
+					tokens.splice( i, 1 );
+					selector = seed.length && toSelector( tokens );
+					if ( !selector ) {
+						push.apply( results, seed );
+						return results;
+					}
+
+					break;
+				}
+			}
+		}
+	}
+
+	// Compile and execute a filtering function if one is not provided
+	// Provide `match` to avoid retokenization if we modified the selector above
+	( compiled || compile( selector, match ) )(
+		seed,
+		context,
+		!documentIsHTML,
+		results,
+		!context || rsibling.test( selector ) && testContext( context.parentNode ) || context
+	);
+	return results;
+};
+
+// One-time assignments
+
+// Sort stability
+support.sortStable = expando.split("").sort( sortOrder ).join("") === expando;
+
+// Support: Chrome 14-35+
+// Always assume duplicates if they aren't passed to the comparison function
+support.detectDuplicates = !!hasDuplicate;
+
+// Initialize against the default document
+setDocument();
+
+// Support: Webkit<537.32 - Safari 6.0.3/Chrome 25 (fixed in Chrome 27)
+// Detached nodes confoundingly follow *each other*
+support.sortDetached = assert(function( el ) {
+	// Should return 1, but returns 4 (following)
+	return el.compareDocumentPosition( document.createElement("fieldset") ) & 1;
+});
+
+// Support: IE<8
+// Prevent attribute/property "interpolation"
+// https://msdn.microsoft.com/en-us/library/ms536429%28VS.85%29.aspx
+if ( !assert(function( el ) {
+	el.innerHTML = "<a href='#'></a>";
+	return el.firstChild.getAttribute("href") === "#" ;
+}) ) {
+	addHandle( "type|href|height|width", function( elem, name, isXML ) {
+		if ( !isXML ) {
+			return elem.getAttribute( name, name.toLowerCase() === "type" ? 1 : 2 );
+		}
+	});
+}
+
+// Support: IE<9
+// Use defaultValue in place of getAttribute("value")
+if ( !support.attributes || !assert(function( el ) {
+	el.innerHTML = "<input/>";
+	el.firstChild.setAttribute( "value", "" );
+	return el.firstChild.getAttribute( "value" ) === "";
+}) ) {
+	addHandle( "value", function( elem, name, isXML ) {
+		if ( !isXML && elem.nodeName.toLowerCase() === "input" ) {
+			return elem.defaultValue;
+		}
+	});
+}
+
+// Support: IE<9
+// Use getAttributeNode to fetch booleans when getAttribute lies
+if ( !assert(function( el ) {
+	return el.getAttribute("disabled") == null;
+}) ) {
+	addHandle( booleans, function( elem, name, isXML ) {
+		var val;
+		if ( !isXML ) {
+			return elem[ name ] === true ? name.toLowerCase() :
+					(val = elem.getAttributeNode( name )) && val.specified ?
+					val.value :
+				null;
+		}
+	});
+}
+
+return Sizzle;
+
+})( window );
+
+
+
+jQuery.find = Sizzle;
+jQuery.expr = Sizzle.selectors;
+
+// Deprecated
+jQuery.expr[ ":" ] = jQuery.expr.pseudos;
+jQuery.uniqueSort = jQuery.unique = Sizzle.uniqueSort;
+jQuery.text = Sizzle.getText;
+jQuery.isXMLDoc = Sizzle.isXML;
+jQuery.contains = Sizzle.contains;
+jQuery.escapeSelector = Sizzle.escape;
+
+
+
+
+var dir = function( elem, dir, until ) {
+	var matched = [],
+		truncate = until !== undefined;
+
+	while ( ( elem = elem[ dir ] ) && elem.nodeType !== 9 ) {
+		if ( elem.nodeType === 1 ) {
+			if ( truncate && jQuery( elem ).is( until ) ) {
+				break;
+			}
+			matched.push( elem );
+		}
+	}
+	return matched;
+};
+
+
+var siblings = function( n, elem ) {
+	var matched = [];
+
+	for ( ; n; n = n.nextSibling ) {
+		if ( n.nodeType === 1 && n !== elem ) {
+			matched.push( n );
+		}
+	}
+
+	return matched;
+};
+
+
+var rneedsContext = jQuery.expr.match.needsContext;
+
+
+
+function nodeName( elem, name ) {
+
+  return elem.nodeName && elem.nodeName.toLowerCase() === name.toLowerCase();
+
+};
+var rsingleTag = ( /^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i );
+
+
+
+// Implement the identical functionality for filter and not
+function winnow( elements, qualifier, not ) {
+	if ( isFunction( qualifier ) ) {
+		return jQuery.grep( elements, function( elem, i ) {
+			return !!qualifier.call( elem, i, elem ) !== not;
+		} );
+	}
+
+	// Single element
+	if ( qualifier.nodeType ) {
+		return jQuery.grep( elements, function( elem ) {
+			return ( elem === qualifier ) !== not;
+		} );
+	}
+
+	// Arraylike of elements (jQuery, arguments, Array)
+	if ( typeof qualifier !== "string" ) {
+		return jQuery.grep( elements, function( elem ) {
+			return ( indexOf.call( qualifier, elem ) > -1 ) !== not;
+		} );
+	}
+
+	// Filtered directly for both simple and complex selectors
+	return jQuery.filter( qualifier, elements, not );
+}
+
+jQuery.filter = function( expr, elems, not ) {
+	var elem = elems[ 0 ];
+
+	if ( not ) {
+		expr = ":not(" + expr + ")";
+	}
+
+	if ( elems.length === 1 && elem.nodeType === 1 ) {
+		return jQuery.find.matchesSelector( elem, expr ) ? [ elem ] : [];
+	}
+
+	return jQuery.find.matches( expr, jQuery.grep( elems, function( elem ) {
+		return elem.nodeType === 1;
+	} ) );
+};
+
+jQuery.fn.extend( {
+	find: function( selector ) {
+		var i, ret,
+			len = this.length,
+			self = this;
+
+		if ( typeof selector !== "string" ) {
+			return this.pushStack( jQuery( selector ).filter( function() {
+				for ( i = 0; i < len; i++ ) {
+					if ( jQuery.contains( self[ i ], this ) ) {
+						return true;
+					}
+				}
+			} ) );
+		}
+
+		ret = this.pushStack( [] );
+
+		for ( i = 0; i < len; i++ ) {
+			jQuery.find( selector, self[ i ], ret );
+		}
+
+		return len > 1 ? jQuery.uniqueSort( ret ) : ret;
+	},
+	filter: function( selector ) {
+		return this.pushStack( winnow( this, selector || [], false ) );
+	},
+	not: function( selector ) {
+		return this.pushStack( winnow( this, selector || [], true ) );
+	},
+	is: function( selector ) {
+		return !!winnow(
+			this,
+
+			// If this is a positional/relative selector, check membership in the returned set
+			// so $("p:first").is("p:last") won't return true for a doc with two "p".
+			typeof selector === "string" && rneedsContext.test( selector ) ?
+				jQuery( selector ) :
+				selector || [],
+			false
+		).length;
+	}
+} );
+
+
+// Initialize a jQuery object
+
+
+// A central reference to the root jQuery(document)
+var rootjQuery,
+
+	// A simple way to check for HTML strings
+	// Prioritize #id over <tag> to avoid XSS via location.hash (#9521)
+	// Strict HTML recognition (#11290: must start with <)
+	// Shortcut simple #id case for speed
+	rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/,
+
+	init = jQuery.fn.init = function( selector, context, root ) {
+		var match, elem;
+
+		// HANDLE: $(""), $(null), $(undefined), $(false)
+		if ( !selector ) {
+			return this;
+		}
+
+		// Method init() accepts an alternate rootjQuery
+		// so migrate can support jQuery.sub (gh-2101)
+		root = root || rootjQuery;
+
+		// Handle HTML strings
+		if ( typeof selector === "string" ) {
+			if ( selector[ 0 ] === "<" &&
+				selector[ selector.length - 1 ] === ">" &&
+				selector.length >= 3 ) {
+
+				// Assume that strings that start and end with <> are HTML and skip the regex check
+				match = [ null, selector, null ];
+
+			} else {
+				match = rquickExpr.exec( selector );
+			}
+
+			// Match html or make sure no context is specified for #id
+			if ( match && ( match[ 1 ] || !context ) ) {
+
+				// HANDLE: $(html) -> $(array)
+				if ( match[ 1 ] ) {
+					context = context instanceof jQuery ? context[ 0 ] : context;
+
+					// Option to run scripts is true for back-compat
+					// Intentionally let the error be thrown if parseHTML is not present
+					jQuery.merge( this, jQuery.parseHTML(
+						match[ 1 ],
+						context && context.nodeType ? context.ownerDocument || context : document,
+						true
+					) );
+
+					// HANDLE: $(html, props)
+					if ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) {
+						for ( match in context ) {
+
+							// Properties of context are called as methods if possible
+							if ( isFunction( this[ match ] ) ) {
+								this[ match ]( context[ match ] );
+
+							// ...and otherwise set as attributes
+							} else {
+								this.attr( match, context[ match ] );
+							}
+						}
+					}
+
+					return this;
+
+				// HANDLE: $(#id)
+				} else {
+					elem = document.getElementById( match[ 2 ] );
+
+					if ( elem ) {
+
+						// Inject the element directly into the jQuery object
+						this[ 0 ] = elem;
+						this.length = 1;
+					}
+					return this;
+				}
+
+			// HANDLE: $(expr, $(...))
+			} else if ( !context || context.jquery ) {
+				return ( context || root ).find( selector );
+
+			// HANDLE: $(expr, context)
+			// (which is just equivalent to: $(context).find(expr)
+			} else {
+				return this.constructor( context ).find( selector );
+			}
+
+		// HANDLE: $(DOMElement)
+		} else if ( selector.nodeType ) {
+			this[ 0 ] = selector;
+			this.length = 1;
+			return this;
+
+		// HANDLE: $(function)
+		// Shortcut for document ready
+		} else if ( isFunction( selector ) ) {
+			return root.ready !== undefined ?
+				root.ready( selector ) :
+
+				// Execute immediately if ready is not present
+				selector( jQuery );
+		}
+
+		return jQuery.makeArray( selector, this );
+	};
+
+// Give the init function the jQuery prototype for later instantiation
+init.prototype = jQuery.fn;
+
+// Initialize central reference
+rootjQuery = jQuery( document );
+
+
+var rparentsprev = /^(?:parents|prev(?:Until|All))/,
+
+	// Methods guaranteed to produce a unique set when starting from a unique set
+	guaranteedUnique = {
+		children: true,
+		contents: true,
+		next: true,
+		prev: true
+	};
+
+jQuery.fn.extend( {
+	has: function( target ) {
+		var targets = jQuery( target, this ),
+			l = targets.length;
+
+		return this.filter( function() {
+			var i = 0;
+			for ( ; i < l; i++ ) {
+				if ( jQuery.contains( this, targets[ i ] ) ) {
+					return true;
+				}
+			}
+		} );
+	},
+
+	closest: function( selectors, context ) {
+		var cur,
+			i = 0,
+			l = this.length,
+			matched = [],
+			targets = typeof selectors !== "string" && jQuery( selectors );
+
+		// Positional selectors never match, since there's no _selection_ context
+		if ( !rneedsContext.test( selectors ) ) {
+			for ( ; i < l; i++ ) {
+				for ( cur = this[ i ]; cur && cur !== context; cur = cur.parentNode ) {
+
+					// Always skip document fragments
+					if ( cur.nodeType < 11 && ( targets ?
+						targets.index( cur ) > -1 :
+
+						// Don't pass non-elements to Sizzle
+						cur.nodeType === 1 &&
+							jQuery.find.matchesSelector( cur, selectors ) ) ) {
+
+						matched.push( cur );
+						break;
+					}
+				}
+			}
+		}
+
+		return this.pushStack( matched.length > 1 ? jQuery.uniqueSort( matched ) : matched );
+	},
+
+	// Determine the position of an element within the set
+	index: function( elem ) {
+
+		// No argument, return index in parent
+		if ( !elem ) {
+			return ( this[ 0 ] && this[ 0 ].parentNode ) ? this.first().prevAll().length : -1;
+		}
+
+		// Index in selector
+		if ( typeof elem === "string" ) {
+			return indexOf.call( jQuery( elem ), this[ 0 ] );
+		}
+
+		// Locate the position of the desired element
+		return indexOf.call( this,
+
+			// If it receives a jQuery object, the first element is used
+			elem.jquery ? elem[ 0 ] : elem
+		);
+	},
+
+	add: function( selector, context ) {
+		return this.pushStack(
+			jQuery.uniqueSort(
+				jQuery.merge( this.get(), jQuery( selector, context ) )
+			)
+		);
+	},
+
+	addBack: function( selector ) {
+		return this.add( selector == null ?
+			this.prevObject : this.prevObject.filter( selector )
+		);
+	}
+} );
+
+function sibling( cur, dir ) {
+	while ( ( cur = cur[ dir ] ) && cur.nodeType !== 1 ) {}
+	return cur;
+}
+
+jQuery.each( {
+	parent: function( elem ) {
+		var parent = elem.parentNode;
+		return parent && parent.nodeType !== 11 ? parent : null;
+	},
+	parents: function( elem ) {
+		return dir( elem, "parentNode" );
+	},
+	parentsUntil: function( elem, i, until ) {
+		return dir( elem, "parentNode", until );
+	},
+	next: function( elem ) {
+		return sibling( elem, "nextSibling" );
+	},
+	prev: function( elem ) {
+		return sibling( elem, "previousSibling" );
+	},
+	nextAll: function( elem ) {
+		return dir( elem, "nextSibling" );
+	},
+	prevAll: function( elem ) {
+		return dir( elem, "previousSibling" );
+	},
+	nextUntil: function( elem, i, until ) {
+		return dir( elem, "nextSibling", until );
+	},
+	prevUntil: function( elem, i, until ) {
+		return dir( elem, "previousSibling", until );
+	},
+	siblings: function( elem ) {
+		return siblings( ( elem.parentNode || {} ).firstChild, elem );
+	},
+	children: function( elem ) {
+		return siblings( elem.firstChild );
+	},
+	contents: function( elem ) {
+		if ( typeof elem.contentDocument !== "undefined" ) {
+			return elem.contentDocument;
+		}
+
+		// Support: IE 9 - 11 only, iOS 7 only, Android Browser <=4.3 only
+		// Treat the template element as a regular one in browsers that
+		// don't support it.
+		if ( nodeName( elem, "template" ) ) {
+			elem = elem.content || elem;
+		}
+
+		return jQuery.merge( [], elem.childNodes );
+	}
+}, function( name, fn ) {
+	jQuery.fn[ name ] = function( until, selector ) {
+		var matched = jQuery.map( this, fn, until );
+
+		if ( name.slice( -5 ) !== "Until" ) {
+			selector = until;
+		}
+
+		if ( selector && typeof selector === "string" ) {
+			matched = jQuery.filter( selector, matched );
+		}
+
+		if ( this.length > 1 ) {
+
+			// Remove duplicates
+			if ( !guaranteedUnique[ name ] ) {
+				jQuery.uniqueSort( matched );
+			}
+
+			// Reverse order for parents* and prev-derivatives
+			if ( rparentsprev.test( name ) ) {
+				matched.reverse();
+			}
+		}
+
+		return this.pushStack( matched );
+	};
+} );
+var rnothtmlwhite = ( /[^\x20\t\r\n\f]+/g );
+
+
+
+// Convert String-formatted options into Object-formatted ones
+function createOptions( options ) {
+	var object = {};
+	jQuery.each( options.match( rnothtmlwhite ) || [], function( _, flag ) {
+		object[ flag ] = true;
+	} );
+	return object;
+}
+
+/*
+ * Create a callback list using the following parameters:
+ *
+ *	options: an optional list of space-separated options that will change how
+ *			the callback list behaves or a more traditional option object
+ *
+ * By default a callback list will act like an event callback list and can be
+ * "fired" multiple times.
+ *
+ * Possible options:
+ *
+ *	once:			will ensure the callback list can only be fired once (like a Deferred)
+ *
+ *	memory:			will keep track of previous values and will call any callback added
+ *					after the list has been fired right away with the latest "memorized"
+ *					values (like a Deferred)
+ *
+ *	unique:			will ensure a callback can only be added once (no duplicate in the list)
+ *
+ *	stopOnFalse:	interrupt callings when a callback returns false
+ *
+ */
+jQuery.Callbacks = function( options ) {
+
+	// Convert options from String-formatted to Object-formatted if needed
+	// (we check in cache first)
+	options = typeof options === "string" ?
+		createOptions( options ) :
+		jQuery.extend( {}, options );
+
+	var // Flag to know if list is currently firing
+		firing,
+
+		// Last fire value for non-forgettable lists
+		memory,
+
+		// Flag to know if list was already fired
+		fired,
+
+		// Flag to prevent firing
+		locked,
+
+		// Actual callback list
+		list = [],
+
+		// Queue of execution data for repeatable lists
+		queue = [],
+
+		// Index of currently firing callback (modified by add/remove as needed)
+		firingIndex = -1,
+
+		// Fire callbacks
+		fire = function() {
+
+			// Enforce single-firing
+			locked = locked || options.once;
+
+			// Execute callbacks for all pending executions,
+			// respecting firingIndex overrides and runtime changes
+			fired = firing = true;
+			for ( ; queue.length; firingIndex = -1 ) {
+				memory = queue.shift();
+				while ( ++firingIndex < list.length ) {
+
+					// Run callback and check for early termination
+					if ( list[ firingIndex ].apply( memory[ 0 ], memory[ 1 ] ) === false &&
+						options.stopOnFalse ) {
+
+						// Jump to end and forget the data so .add doesn't re-fire
+						firingIndex = list.length;
+						memory = false;
+					}
+				}
+			}
+
+			// Forget the data if we're done with it
+			if ( !options.memory ) {
+				memory = false;
+			}
+
+			firing = false;
+
+			// Clean up if we're done firing for good
+			if ( locked ) {
+
+				// Keep an empty list if we have data for future add calls
+				if ( memory ) {
+					list = [];
+
+				// Otherwise, this object is spent
+				} else {
+					list = "";
+				}
+			}
+		},
+
+		// Actual Callbacks object
+		self = {
+
+			// Add a callback or a collection of callbacks to the list
+			add: function() {
+				if ( list ) {
+
+					// If we have memory from a past run, we should fire after adding
+					if ( memory && !firing ) {
+						firingIndex = list.length - 1;
+						queue.push( memory );
+					}
+
+					( function add( args ) {
+						jQuery.each( args, function( _, arg ) {
+							if ( isFunction( arg ) ) {
+								if ( !options.unique || !self.has( arg ) ) {
+									list.push( arg );
+								}
+							} else if ( arg && arg.length && toType( arg ) !== "string" ) {
+
+								// Inspect recursively
+								add( arg );
+							}
+						} );
+					} )( arguments );
+
+					if ( memory && !firing ) {
+						fire();
+					}
+				}
+				return this;
+			},
+
+			// Remove a callback from the list
+			remove: function() {
+				jQuery.each( arguments, function( _, arg ) {
+					var index;
+					while ( ( index = jQuery.inArray( arg, list, index ) ) > -1 ) {
+						list.splice( index, 1 );
+
+						// Handle firing indexes
+						if ( index <= firingIndex ) {
+							firingIndex--;
+						}
+					}
+				} );
+				return this;
+			},
+
+			// Check if a given callback is in the list.
+			// If no argument is given, return whether or not list has callbacks attached.
+			has: function( fn ) {
+				return fn ?
+					jQuery.inArray( fn, list ) > -1 :
+					list.length > 0;
+			},
+
+			// Remove all callbacks from the list
+			empty: function() {
+				if ( list ) {
+					list = [];
+				}
+				return this;
+			},
+
+			// Disable .fire and .add
+			// Abort any current/pending executions
+			// Clear all callbacks and values
+			disable: function() {
+				locked = queue = [];
+				list = memory = "";
+				return this;
+			},
+			disabled: function() {
+				return !list;
+			},
+
+			// Disable .fire
+			// Also disable .add unless we have memory (since it would have no effect)
+			// Abort any pending executions
+			lock: function() {
+				locked = queue = [];
+				if ( !memory && !firing ) {
+					list = memory = "";
+				}
+				return this;
+			},
+			locked: function() {
+				return !!locked;
+			},
+
+			// Call all callbacks with the given context and arguments
+			fireWith: function( context, args ) {
+				if ( !locked ) {
+					args = args || [];
+					args = [ context, args.slice ? args.slice() : args ];
+					queue.push( args );
+					if ( !firing ) {
+						fire();
+					}
+				}
+				return this;
+			},
+
+			// Call all the callbacks with the given arguments
+			fire: function() {
+				self.fireWith( this, arguments );
+				return this;
+			},
+
+			// To know if the callbacks have already been called at least once
+			fired: function() {
+				return !!fired;
+			}
+		};
+
+	return self;
+};
+
+
+function Identity( v ) {
+	return v;
+}
+function Thrower( ex ) {
+	throw ex;
+}
+
+function adoptValue( value, resolve, reject, noValue ) {
+	var method;
+
+	try {
+
+		// Check for promise aspect first to privilege synchronous behavior
+		if ( value && isFunction( ( method = value.promise ) ) ) {
+			method.call( value ).done( resolve ).fail( reject );
+
+		// Other thenables
+		} else if ( value && isFunction( ( method = value.then ) ) ) {
+			method.call( value, resolve, reject );
+
+		// Other non-thenables
+		} else {
+
+			// Control `resolve` arguments by letting Array#slice cast boolean `noValue` to integer:
+			// * false: [ value ].slice( 0 ) => resolve( value )
+			// * true: [ value ].slice( 1 ) => resolve()
+			resolve.apply( undefined, [ value ].slice( noValue ) );
+		}
+
+	// For Promises/A+, convert exceptions into rejections
+	// Since jQuery.when doesn't unwrap thenables, we can skip the extra checks appearing in
+	// Deferred#then to conditionally suppress rejection.
+	} catch ( value ) {
+
+		// Support: Android 4.0 only
+		// Strict mode functions invoked without .call/.apply get global-object context
+		reject.apply( undefined, [ value ] );
+	}
+}
+
+jQuery.extend( {
+
+	Deferred: function( func ) {
+		var tuples = [
+
+				// action, add listener, callbacks,
+				// ... .then handlers, argument index, [final state]
+				[ "notify", "progress", jQuery.Callbacks( "memory" ),
+					jQuery.Callbacks( "memory" ), 2 ],
+				[ "resolve", "done", jQuery.Callbacks( "once memory" ),
+					jQuery.Callbacks( "once memory" ), 0, "resolved" ],
+				[ "reject", "fail", jQuery.Callbacks( "once memory" ),
+					jQuery.Callbacks( "once memory" ), 1, "rejected" ]
+			],
+			state = "pending",
+			promise = {
+				state: function() {
+					return state;
+				},
+				always: function() {
+					deferred.done( arguments ).fail( arguments );
+					return this;
+				},
+				"catch": function( fn ) {
+					return promise.then( null, fn );
+				},
+
+				// Keep pipe for back-compat
+				pipe: function( /* fnDone, fnFail, fnProgress */ ) {
+					var fns = arguments;
+
+					return jQuery.Deferred( function( newDefer ) {
+						jQuery.each( tuples, function( i, tuple ) {
+
+							// Map tuples (progress, done, fail) to arguments (done, fail, progress)
+							var fn = isFunction( fns[ tuple[ 4 ] ] ) && fns[ tuple[ 4 ] ];
+
+							// deferred.progress(function() { bind to newDefer or newDefer.notify })
+							// deferred.done(function() { bind to newDefer or newDefer.resolve })
+							// deferred.fail(function() { bind to newDefer or newDefer.reject })
+							deferred[ tuple[ 1 ] ]( function() {
+								var returned = fn && fn.apply( this, arguments );
+								if ( returned && isFunction( returned.promise ) ) {
+									returned.promise()
+										.progress( newDefer.notify )
+										.done( newDefer.resolve )
+										.fail( newDefer.reject );
+								} else {
+									newDefer[ tuple[ 0 ] + "With" ](
+										this,
+										fn ? [ returned ] : arguments
+									);
+								}
+							} );
+						} );
+						fns = null;
+					} ).promise();
+				},
+				then: function( onFulfilled, onRejected, onProgress ) {
+					var maxDepth = 0;
+					function resolve( depth, deferred, handler, special ) {
+						return function() {
+							var that = this,
+								args = arguments,
+								mightThrow = function() {
+									var returned, then;
+
+									// Support: Promises/A+ section 2.3.3.3.3
+									// https://promisesaplus.com/#point-59
+									// Ignore double-resolution attempts
+									if ( depth < maxDepth ) {
+										return;
+									}
+
+									returned = handler.apply( that, args );
+
+									// Support: Promises/A+ section 2.3.1
+									// https://promisesaplus.com/#point-48
+									if ( returned === deferred.promise() ) {
+										throw new TypeError( "Thenable self-resolution" );
+									}
+
+									// Support: Promises/A+ sections 2.3.3.1, 3.5
+									// https://promisesaplus.com/#point-54
+									// https://promisesaplus.com/#point-75
+									// Retrieve `then` only once
+									then = returned &&
+
+										// Support: Promises/A+ section 2.3.4
+										// https://promisesaplus.com/#point-64
+										// Only check objects and functions for thenability
+										( typeof returned === "object" ||
+											typeof returned === "function" ) &&
+										returned.then;
+
+									// Handle a returned thenable
+									if ( isFunction( then ) ) {
+
+										// Special processors (notify) just wait for resolution
+										if ( special ) {
+											then.call(
+												returned,
+												resolve( maxDepth, deferred, Identity, special ),
+												resolve( maxDepth, deferred, Thrower, special )
+											);
+
+										// Normal processors (resolve) also hook into progress
+										} else {
+
+											// ...and disregard older resolution values
+											maxDepth++;
+
+											then.call(
+												returned,
+												resolve( maxDepth, deferred, Identity, special ),
+												resolve( maxDepth, deferred, Thrower, special ),
+												resolve( maxDepth, deferred, Identity,
+													deferred.notifyWith )
+											);
+										}
+
+									// Handle all other returned values
+									} else {
+
+										// Only substitute handlers pass on context
+										// and multiple values (non-spec behavior)
+										if ( handler !== Identity ) {
+											that = undefined;
+											args = [ returned ];
+										}
+
+										// Process the value(s)
+										// Default process is resolve
+										( special || deferred.resolveWith )( that, args );
+									}
+								},
+
+								// Only normal processors (resolve) catch and reject exceptions
+								process = special ?
+									mightThrow :
+									function() {
+										try {
+											mightThrow();
+										} catch ( e ) {
+
+											if ( jQuery.Deferred.exceptionHook ) {
+												jQuery.Deferred.exceptionHook( e,
+													process.stackTrace );
+											}
+
+											// Support: Promises/A+ section 2.3.3.3.4.1
+											// https://promisesaplus.com/#point-61
+											// Ignore post-resolution exceptions
+											if ( depth + 1 >= maxDepth ) {
+
+												// Only substitute handlers pass on context
+												// and multiple values (non-spec behavior)
+												if ( handler !== Thrower ) {
+													that = undefined;
+													args = [ e ];
+												}
+
+												deferred.rejectWith( that, args );
+											}
+										}
+									};
+
+							// Support: Promises/A+ section 2.3.3.3.1
+							// https://promisesaplus.com/#point-57
+							// Re-resolve promises immediately to dodge false rejection from
+							// subsequent errors
+							if ( depth ) {
+								process();
+							} else {
+
+								// Call an optional hook to record the stack, in case of exception
+								// since it's otherwise lost when execution goes async
+								if ( jQuery.Deferred.getStackHook ) {
+									process.stackTrace = jQuery.Deferred.getStackHook();
+								}
+								window.setTimeout( process );
+							}
+						};
+					}
+
+					return jQuery.Deferred( function( newDefer ) {
+
+						// progress_handlers.add( ... )
+						tuples[ 0 ][ 3 ].add(
+							resolve(
+								0,
+								newDefer,
+								isFunction( onProgress ) ?
+									onProgress :
+									Identity,
+								newDefer.notifyWith
+							)
+						);
+
+						// fulfilled_handlers.add( ... )
+						tuples[ 1 ][ 3 ].add(
+							resolve(
+								0,
+								newDefer,
+								isFunction( onFulfilled ) ?
+									onFulfilled :
+									Identity
+							)
+						);
+
+						// rejected_handlers.add( ... )
+						tuples[ 2 ][ 3 ].add(
+							resolve(
+								0,
+								newDefer,
+								isFunction( onRejected ) ?
+									onRejected :
+									Thrower
+							)
+						);
+					} ).promise();
+				},
+
+				// Get a promise for this deferred
+				// If obj is provided, the promise aspect is added to the object
+				promise: function( obj ) {
+					return obj != null ? jQuery.extend( obj, promise ) : promise;
+				}
+			},
+			deferred = {};
+
+		// Add list-specific methods
+		jQuery.each( tuples, function( i, tuple ) {
+			var list = tuple[ 2 ],
+				stateString = tuple[ 5 ];
+
+			// promise.progress = list.add
+			// promise.done = list.add
+			// promise.fail = list.add
+			promise[ tuple[ 1 ] ] = list.add;
+
+			// Handle state
+			if ( stateString ) {
+				list.add(
+					function() {
+
+						// state = "resolved" (i.e., fulfilled)
+						// state = "rejected"
+						state = stateString;
+					},
+
+					// rejected_callbacks.disable
+					// fulfilled_callbacks.disable
+					tuples[ 3 - i ][ 2 ].disable,
+
+					// rejected_handlers.disable
+					// fulfilled_handlers.disable
+					tuples[ 3 - i ][ 3 ].disable,
+
+					// progress_callbacks.lock
+					tuples[ 0 ][ 2 ].lock,
+
+					// progress_handlers.lock
+					tuples[ 0 ][ 3 ].lock
+				);
+			}
+
+			// progress_handlers.fire
+			// fulfilled_handlers.fire
+			// rejected_handlers.fire
+			list.add( tuple[ 3 ].fire );
+
+			// deferred.notify = function() { deferred.notifyWith(...) }
+			// deferred.resolve = function() { deferred.resolveWith(...) }
+			// deferred.reject = function() { deferred.rejectWith(...) }
+			deferred[ tuple[ 0 ] ] = function() {
+				deferred[ tuple[ 0 ] + "With" ]( this === deferred ? undefined : this, arguments );
+				return this;
+			};
+
+			// deferred.notifyWith = list.fireWith
+			// deferred.resolveWith = list.fireWith
+			// deferred.rejectWith = list.fireWith
+			deferred[ tuple[ 0 ] + "With" ] = list.fireWith;
+		} );
+
+		// Make the deferred a promise
+		promise.promise( deferred );
+
+		// Call given func if any
+		if ( func ) {
+			func.call( deferred, deferred );
+		}
+
+		// All done!
+		return deferred;
+	},
+
+	// Deferred helper
+	when: function( singleValue ) {
+		var
+
+			// count of uncompleted subordinates
+			remaining = arguments.length,
+
+			// count of unprocessed arguments
+			i = remaining,
+
+			// subordinate fulfillment data
+			resolveContexts = Array( i ),
+			resolveValues = slice.call( arguments ),
+
+			// the master Deferred
+			master = jQuery.Deferred(),
+
+			// subordinate callback factory
+			updateFunc = function( i ) {
+				return function( value ) {
+					resolveContexts[ i ] = this;
+					resolveValues[ i ] = arguments.length > 1 ? slice.call( arguments ) : value;
+					if ( !( --remaining ) ) {
+						master.resolveWith( resolveContexts, resolveValues );
+					}
+				};
+			};
+
+		// Single- and empty arguments are adopted like Promise.resolve
+		if ( remaining <= 1 ) {
+			adoptValue( singleValue, master.done( updateFunc( i ) ).resolve, master.reject,
+				!remaining );
+
+			// Use .then() to unwrap secondary thenables (cf. gh-3000)
+			if ( master.state() === "pending" ||
+				isFunction( resolveValues[ i ] && resolveValues[ i ].then ) ) {
+
+				return master.then();
+			}
+		}
+
+		// Multiple arguments are aggregated like Promise.all array elements
+		while ( i-- ) {
+			adoptValue( resolveValues[ i ], updateFunc( i ), master.reject );
+		}
+
+		return master.promise();
+	}
+} );
+
+
+// These usually indicate a programmer mistake during development,
+// warn about them ASAP rather than swallowing them by default.
+var rerrorNames = /^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;
+
+jQuery.Deferred.exceptionHook = function( error, stack ) {
+
+	// Support: IE 8 - 9 only
+	// Console exists when dev tools are open, which can happen at any time
+	if ( window.console && window.console.warn && error && rerrorNames.test( error.name ) ) {
+		window.console.warn( "jQuery.Deferred exception: " + error.message, error.stack, stack );
+	}
+};
+
+
+
+
+jQuery.readyException = function( error ) {
+	window.setTimeout( function() {
+		throw error;
+	} );
+};
+
+
+
+
+// The deferred used on DOM ready
+var readyList = jQuery.Deferred();
+
+jQuery.fn.ready = function( fn ) {
+
+	readyList
+		.then( fn )
+
+		// Wrap jQuery.readyException in a function so that the lookup
+		// happens at the time of error handling instead of callback
+		// registration.
+		.catch( function( error ) {
+			jQuery.readyException( error );
+		} );
+
+	return this;
+};
+
+jQuery.extend( {
+
+	// Is the DOM ready to be used? Set to true once it occurs.
+	isReady: false,
+
+	// A counter to track how many items to wait for before
+	// the ready event fires. See #6781
+	readyWait: 1,
+
+	// Handle when the DOM is ready
+	ready: function( wait ) {
+
+		// Abort if there are pending holds or we're already ready
+		if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
+			return;
+		}
+
+		// Remember that the DOM is ready
+		jQuery.isReady = true;
+
+		// If a normal DOM Ready event fired, decrement, and wait if need be
+		if ( wait !== true && --jQuery.readyWait > 0 ) {
+			return;
+		}
+
+		// If there are functions bound, to execute
+		readyList.resolveWith( document, [ jQuery ] );
+	}
+} );
+
+jQuery.ready.then = readyList.then;
+
+// The ready event handler and self cleanup method
+function completed() {
+	document.removeEventListener( "DOMContentLoaded", completed );
+	window.removeEventListener( "load", completed );
+	jQuery.ready();
+}
+
+// Catch cases where $(document).ready() is called
+// after the browser event has already occurred.
+// Support: IE <=9 - 10 only
+// Older IE sometimes signals "interactive" too soon
+if ( document.readyState === "complete" ||
+	( document.readyState !== "loading" && !document.documentElement.doScroll ) ) {
+
+	// Handle it asynchronously to allow scripts the opportunity to delay ready
+	window.setTimeout( jQuery.ready );
+
+} else {
+
+	// Use the handy event callback
+	document.addEventListener( "DOMContentLoaded", completed );
+
+	// A fallback to window.onload, that will always work
+	window.addEventListener( "load", completed );
+}
+
+
+
+
+// Multifunctional method to get and set values of a collection
+// The value/s can optionally be executed if it's a function
+var access = function( elems, fn, key, value, chainable, emptyGet, raw ) {
+	var i = 0,
+		len = elems.length,
+		bulk = key == null;
+
+	// Sets many values
+	if ( toType( key ) === "object" ) {
+		chainable = true;
+		for ( i in key ) {
+			access( elems, fn, i, key[ i ], true, emptyGet, raw );
+		}
+
+	// Sets one value
+	} else if ( value !== undefined ) {
+		chainable = true;
+
+		if ( !isFunction( value ) ) {
+			raw = true;
+		}
+
+		if ( bulk ) {
+
+			// Bulk operations run against the entire set
+			if ( raw ) {
+				fn.call( elems, value );
+				fn = null;
+
+			// ...except when executing function values
+			} else {
+				bulk = fn;
+				fn = function( elem, key, value ) {
+					return bulk.call( jQuery( elem ), value );
+				};
+			}
+		}
+
+		if ( fn ) {
+			for ( ; i < len; i++ ) {
+				fn(
+					elems[ i ], key, raw ?
+					value :
+					value.call( elems[ i ], i, fn( elems[ i ], key ) )
+				);
+			}
+		}
+	}
+
+	if ( chainable ) {
+		return elems;
+	}
+
+	// Gets
+	if ( bulk ) {
+		return fn.call( elems );
+	}
+
+	return len ? fn( elems[ 0 ], key ) : emptyGet;
+};
+
+
+// Matches dashed string for camelizing
+var rmsPrefix = /^-ms-/,
+	rdashAlpha = /-([a-z])/g;
+
+// Used by camelCase as callback to replace()
+function fcamelCase( all, letter ) {
+	return letter.toUpperCase();
+}
+
+// Convert dashed to camelCase; used by the css and data modules
+// Support: IE <=9 - 11, Edge 12 - 15
+// Microsoft forgot to hump their vendor prefix (#9572)
+function camelCase( string ) {
+	return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );
+}
+var acceptData = function( owner ) {
+
+	// Accepts only:
+	//  - Node
+	//    - Node.ELEMENT_NODE
+	//    - Node.DOCUMENT_NODE
+	//  - Object
+	//    - Any
+	return owner.nodeType === 1 || owner.nodeType === 9 || !( +owner.nodeType );
+};
+
+
+
+
+function Data() {
+	this.expando = jQuery.expando + Data.uid++;
+}
+
+Data.uid = 1;
+
+Data.prototype = {
+
+	cache: function( owner ) {
+
+		// Check if the owner object already has a cache
+		var value = owner[ this.expando ];
+
+		// If not, create one
+		if ( !value ) {
+			value = {};
+
+			// We can accept data for non-element nodes in modern browsers,
+			// but we should not, see #8335.
+			// Always return an empty object.
+			if ( acceptData( owner ) ) {
+
+				// If it is a node unlikely to be stringify-ed or looped over
+				// use plain assignment
+				if ( owner.nodeType ) {
+					owner[ this.expando ] = value;
+
+				// Otherwise secure it in a non-enumerable property
+				// configurable must be true to allow the property to be
+				// deleted when data is removed
+				} else {
+					Object.defineProperty( owner, this.expando, {
+						value: value,
+						configurable: true
+					} );
+				}
+			}
+		}
+
+		return value;
+	},
+	set: function( owner, data, value ) {
+		var prop,
+			cache = this.cache( owner );
+
+		// Handle: [ owner, key, value ] args
+		// Always use camelCase key (gh-2257)
+		if ( typeof data === "string" ) {
+			cache[ camelCase( data ) ] = value;
+
+		// Handle: [ owner, { properties } ] args
+		} else {
+
+			// Copy the properties one-by-one to the cache object
+			for ( prop in data ) {
+				cache[ camelCase( prop ) ] = data[ prop ];
+			}
+		}
+		return cache;
+	},
+	get: function( owner, key ) {
+		return key === undefined ?
+			this.cache( owner ) :
+
+			// Always use camelCase key (gh-2257)
+			owner[ this.expando ] && owner[ this.expando ][ camelCase( key ) ];
+	},
+	access: function( owner, key, value ) {
+
+		// In cases where either:
+		//
+		//   1. No key was specified
+		//   2. A string key was specified, but no value provided
+		//
+		// Take the "read" path and allow the get method to determine
+		// which value to return, respectively either:
+		//
+		//   1. The entire cache object
+		//   2. The data stored at the key
+		//
+		if ( key === undefined ||
+				( ( key && typeof key === "string" ) && value === undefined ) ) {
+
+			return this.get( owner, key );
+		}
+
+		// When the key is not a string, or both a key and value
+		// are specified, set or extend (existing objects) with either:
+		//
+		//   1. An object of properties
+		//   2. A key and value
+		//
+		this.set( owner, key, value );
+
+		// Since the "set" path can have two possible entry points
+		// return the expected data based on which path was taken[*]
+		return value !== undefined ? value : key;
+	},
+	remove: function( owner, key ) {
+		var i,
+			cache = owner[ this.expando ];
+
+		if ( cache === undefined ) {
+			return;
+		}
+
+		if ( key !== undefined ) {
+
+			// Support array or space separated string of keys
+			if ( Array.isArray( key ) ) {
+
+				// If key is an array of keys...
+				// We always set camelCase keys, so remove that.
+				key = key.map( camelCase );
+			} else {
+				key = camelCase( key );
+
+				// If a key with the spaces exists, use it.
+				// Otherwise, create an array by matching non-whitespace
+				key = key in cache ?
+					[ key ] :
+					( key.match( rnothtmlwhite ) || [] );
+			}
+
+			i = key.length;
+
+			while ( i-- ) {
+				delete cache[ key[ i ] ];
+			}
+		}
+
+		// Remove the expando if there's no more data
+		if ( key === undefined || jQuery.isEmptyObject( cache ) ) {
+
+			// Support: Chrome <=35 - 45
+			// Webkit & Blink performance suffers when deleting properties
+			// from DOM nodes, so set to undefined instead
+			// https://bugs.chromium.org/p/chromium/issues/detail?id=378607 (bug restricted)
+			if ( owner.nodeType ) {
+				owner[ this.expando ] = undefined;
+			} else {
+				delete owner[ this.expando ];
+			}
+		}
+	},
+	hasData: function( owner ) {
+		var cache = owner[ this.expando ];
+		return cache !== undefined && !jQuery.isEmptyObject( cache );
+	}
+};
+var dataPriv = new Data();
+
+var dataUser = new Data();
+
+
+
+//	Implementation Summary
+//
+//	1. Enforce API surface and semantic compatibility with 1.9.x branch
+//	2. Improve the module's maintainability by reducing the storage
+//		paths to a single mechanism.
+//	3. Use the same single mechanism to support "private" and "user" data.
+//	4. _Never_ expose "private" data to user code (TODO: Drop _data, _removeData)
+//	5. Avoid exposing implementation details on user objects (eg. expando properties)
+//	6. Provide a clear path for implementation upgrade to WeakMap in 2014
+
+var rbrace = /^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,
+	rmultiDash = /[A-Z]/g;
+
+function getData( data ) {
+	if ( data === "true" ) {
+		return true;
+	}
+
+	if ( data === "false" ) {
+		return false;
+	}
+
+	if ( data === "null" ) {
+		return null;
+	}
+
+	// Only convert to a number if it doesn't change the string
+	if ( data === +data + "" ) {
+		return +data;
+	}
+
+	if ( rbrace.test( data ) ) {
+		return JSON.parse( data );
+	}
+
+	return data;
+}
+
+function dataAttr( elem, key, data ) {
+	var name;
+
+	// If nothing was found internally, try to fetch any
+	// data from the HTML5 data-* attribute
+	if ( data === undefined && elem.nodeType === 1 ) {
+		name = "data-" + key.replace( rmultiDash, "-$&" ).toLowerCase();
+		data = elem.getAttribute( name );
+
+		if ( typeof data === "string" ) {
+			try {
+				data = getData( data );
+			} catch ( e ) {}
+
+			// Make sure we set the data so it isn't changed later
+			dataUser.set( elem, key, data );
+		} else {
+			data = undefined;
+		}
+	}
+	return data;
+}
+
+jQuery.extend( {
+	hasData: function( elem ) {
+		return dataUser.hasData( elem ) || dataPriv.hasData( elem );
+	},
+
+	data: function( elem, name, data ) {
+		return dataUser.access( elem, name, data );
+	},
+
+	removeData: function( elem, name ) {
+		dataUser.remove( elem, name );
+	},
+
+	// TODO: Now that all calls to _data and _removeData have been replaced
+	// with direct calls to dataPriv methods, these can be deprecated.
+	_data: function( elem, name, data ) {
+		return dataPriv.access( elem, name, data );
+	},
+
+	_removeData: function( elem, name ) {
+		dataPriv.remove( elem, name );
+	}
+} );
+
+jQuery.fn.extend( {
+	data: function( key, value ) {
+		var i, name, data,
+			elem = this[ 0 ],
+			attrs = elem && elem.attributes;
+
+		// Gets all values
+		if ( key === undefined ) {
+			if ( this.length ) {
+				data = dataUser.get( elem );
+
+				if ( elem.nodeType === 1 && !dataPriv.get( elem, "hasDataAttrs" ) ) {
+					i = attrs.length;
+					while ( i-- ) {
+
+						// Support: IE 11 only
+						// The attrs elements can be null (#14894)
+						if ( attrs[ i ] ) {
+							name = attrs[ i ].name;
+							if ( name.indexOf( "data-" ) === 0 ) {
+								name = camelCase( name.slice( 5 ) );
+								dataAttr( elem, name, data[ name ] );
+							}
+						}
+					}
+					dataPriv.set( elem, "hasDataAttrs", true );
+				}
+			}
+
+			return data;
+		}
+
+		// Sets multiple values
+		if ( typeof key === "object" ) {
+			return this.each( function() {
+				dataUser.set( this, key );
+			} );
+		}
+
+		return access( this, function( value ) {
+			var data;
+
+			// The calling jQuery object (element matches) is not empty
+			// (and therefore has an element appears at this[ 0 ]) and the
+			// `value` parameter was not undefined. An empty jQuery object
+			// will result in `undefined` for elem = this[ 0 ] which will
+			// throw an exception if an attempt to read a data cache is made.
+			if ( elem && value === undefined ) {
+
+				// Attempt to get data from the cache
+				// The key will always be camelCased in Data
+				data = dataUser.get( elem, key );
+				if ( data !== undefined ) {
+					return data;
+				}
+
+				// Attempt to "discover" the data in
+				// HTML5 custom data-* attrs
+				data = dataAttr( elem, key );
+				if ( data !== undefined ) {
+					return data;
+				}
+
+				// We tried really hard, but the data doesn't exist.
+				return;
+			}
+
+			// Set the data...
+			this.each( function() {
+
+				// We always store the camelCased key
+				dataUser.set( this, key, value );
+			} );
+		}, null, value, arguments.length > 1, null, true );
+	},
+
+	removeData: function( key ) {
+		return this.each( function() {
+			dataUser.remove( this, key );
+		} );
+	}
+} );
+
+
+jQuery.extend( {
+	queue: function( elem, type, data ) {
+		var queue;
+
+		if ( elem ) {
+			type = ( type || "fx" ) + "queue";
+			queue = dataPriv.get( elem, type );
+
+			// Speed up dequeue by getting out quickly if this is just a lookup
+			if ( data ) {
+				if ( !queue || Array.isArray( data ) ) {
+					queue = dataPriv.access( elem, type, jQuery.makeArray( data ) );
+				} else {
+					queue.push( data );
+				}
+			}
+			return queue || [];
+		}
+	},
+
+	dequeue: function( elem, type ) {
+		type = type || "fx";
+
+		var queue = jQuery.queue( elem, type ),
+			startLength = queue.length,
+			fn = queue.shift(),
+			hooks = jQuery._queueHooks( elem, type ),
+			next = function() {
+				jQuery.dequeue( elem, type );
+			};
+
+		// If the fx queue is dequeued, always remove the progress sentinel
+		if ( fn === "inprogress" ) {
+			fn = queue.shift();
+			startLength--;
+		}
+
+		if ( fn ) {
+
+			// Add a progress sentinel to prevent the fx queue from being
+			// automatically dequeued
+			if ( type === "fx" ) {
+				queue.unshift( "inprogress" );
+			}
+
+			// Clear up the last queue stop function
+			delete hooks.stop;
+			fn.call( elem, next, hooks );
+		}
+
+		if ( !startLength && hooks ) {
+			hooks.empty.fire();
+		}
+	},
+
+	// Not public - generate a queueHooks object, or return the current one
+	_queueHooks: function( elem, type ) {
+		var key = type + "queueHooks";
+		return dataPriv.get( elem, key ) || dataPriv.access( elem, key, {
+			empty: jQuery.Callbacks( "once memory" ).add( function() {
+				dataPriv.remove( elem, [ type + "queue", key ] );
+			} )
+		} );
+	}
+} );
+
+jQuery.fn.extend( {
+	queue: function( type, data ) {
+		var setter = 2;
+
+		if ( typeof type !== "string" ) {
+			data = type;
+			type = "fx";
+			setter--;
+		}
+
+		if ( arguments.length < setter ) {
+			return jQuery.queue( this[ 0 ], type );
+		}
+
+		return data === undefined ?
+			this :
+			this.each( function() {
+				var queue = jQuery.queue( this, type, data );
+
+				// Ensure a hooks for this queue
+				jQuery._queueHooks( this, type );
+
+				if ( type === "fx" && queue[ 0 ] !== "inprogress" ) {
+					jQuery.dequeue( this, type );
+				}
+			} );
+	},
+	dequeue: function( type ) {
+		return this.each( function() {
+			jQuery.dequeue( this, type );
+		} );
+	},
+	clearQueue: function( type ) {
+		return this.queue( type || "fx", [] );
+	},
+
+	// Get a promise resolved when queues of a certain type
+	// are emptied (fx is the type by default)
+	promise: function( type, obj ) {
+		var tmp,
+			count = 1,
+			defer = jQuery.Deferred(),
+			elements = this,
+			i = this.length,
+			resolve = function() {
+				if ( !( --count ) ) {
+					defer.resolveWith( elements, [ elements ] );
+				}
+			};
+
+		if ( typeof type !== "string" ) {
+			obj = type;
+			type = undefined;
+		}
+		type = type || "fx";
+
+		while ( i-- ) {
+			tmp = dataPriv.get( elements[ i ], type + "queueHooks" );
+			if ( tmp && tmp.empty ) {
+				count++;
+				tmp.empty.add( resolve );
+			}
+		}
+		resolve();
+		return defer.promise( obj );
+	}
+} );
+var pnum = ( /[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/ ).source;
+
+var rcssNum = new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" );
+
+
+var cssExpand = [ "Top", "Right", "Bottom", "Left" ];
+
+var documentElement = document.documentElement;
+
+
+
+	var isAttached = function( elem ) {
+			return jQuery.contains( elem.ownerDocument, elem );
+		},
+		composed = { composed: true };
+
+	// Support: IE 9 - 11+, Edge 12 - 18+, iOS 10.0 - 10.2 only
+	// Check attachment across shadow DOM boundaries when possible (gh-3504)
+	// Support: iOS 10.0-10.2 only
+	// Early iOS 10 versions support `attachShadow` but not `getRootNode`,
+	// leading to errors. We need to check for `getRootNode`.
+	if ( documentElement.getRootNode ) {
+		isAttached = function( elem ) {
+			return jQuery.contains( elem.ownerDocument, elem ) ||
+				elem.getRootNode( composed ) === elem.ownerDocument;
+		};
+	}
+var isHiddenWithinTree = function( elem, el ) {
+
+		// isHiddenWithinTree might be called from jQuery#filter function;
+		// in that case, element will be second argument
+		elem = el || elem;
+
+		// Inline style trumps all
+		return elem.style.display === "none" ||
+			elem.style.display === "" &&
+
+			// Otherwise, check computed style
+			// Support: Firefox <=43 - 45
+			// Disconnected elements can have computed display: none, so first confirm that elem is
+			// in the document.
+			isAttached( elem ) &&
+
+			jQuery.css( elem, "display" ) === "none";
+	};
+
+var swap = function( elem, options, callback, args ) {
+	var ret, name,
+		old = {};
+
+	// Remember the old values, and insert the new ones
+	for ( name in options ) {
+		old[ name ] = elem.style[ name ];
+		elem.style[ name ] = options[ name ];
+	}
+
+	ret = callback.apply( elem, args || [] );
+
+	// Revert the old values
+	for ( name in options ) {
+		elem.style[ name ] = old[ name ];
+	}
+
+	return ret;
+};
+
+
+
+
+function adjustCSS( elem, prop, valueParts, tween ) {
+	var adjusted, scale,
+		maxIterations = 20,
+		currentValue = tween ?
+			function() {
+				return tween.cur();
+			} :
+			function() {
+				return jQuery.css( elem, prop, "" );
+			},
+		initial = currentValue(),
+		unit = valueParts && valueParts[ 3 ] || ( jQuery.cssNumber[ prop ] ? "" : "px" ),
+
+		// Starting value computation is required for potential unit mismatches
+		initialInUnit = elem.nodeType &&
+			( jQuery.cssNumber[ prop ] || unit !== "px" && +initial ) &&
+			rcssNum.exec( jQuery.css( elem, prop ) );
+
+	if ( initialInUnit && initialInUnit[ 3 ] !== unit ) {
+
+		// Support: Firefox <=54
+		// Halve the iteration target value to prevent interference from CSS upper bounds (gh-2144)
+		initial = initial / 2;
+
+		// Trust units reported by jQuery.css
+		unit = unit || initialInUnit[ 3 ];
+
+		// Iteratively approximate from a nonzero starting point
+		initialInUnit = +initial || 1;
+
+		while ( maxIterations-- ) {
+
+			// Evaluate and update our best guess (doubling guesses that zero out).
+			// Finish if the scale equals or crosses 1 (making the old*new product non-positive).
+			jQuery.style( elem, prop, initialInUnit + unit );
+			if ( ( 1 - scale ) * ( 1 - ( scale = currentValue() / initial || 0.5 ) ) <= 0 ) {
+				maxIterations = 0;
+			}
+			initialInUnit = initialInUnit / scale;
+
+		}
+
+		initialInUnit = initialInUnit * 2;
+		jQuery.style( elem, prop, initialInUnit + unit );
+
+		// Make sure we update the tween properties later on
+		valueParts = valueParts || [];
+	}
+
+	if ( valueParts ) {
+		initialInUnit = +initialInUnit || +initial || 0;
+
+		// Apply relative offset (+=/-=) if specified
+		adjusted = valueParts[ 1 ] ?
+			initialInUnit + ( valueParts[ 1 ] + 1 ) * valueParts[ 2 ] :
+			+valueParts[ 2 ];
+		if ( tween ) {
+			tween.unit = unit;
+			tween.start = initialInUnit;
+			tween.end = adjusted;
+		}
+	}
+	return adjusted;
+}
+
+
+var defaultDisplayMap = {};
+
+function getDefaultDisplay( elem ) {
+	var temp,
+		doc = elem.ownerDocument,
+		nodeName = elem.nodeName,
+		display = defaultDisplayMap[ nodeName ];
+
+	if ( display ) {
+		return display;
+	}
+
+	temp = doc.body.appendChild( doc.createElement( nodeName ) );
+	display = jQuery.css( temp, "display" );
+
+	temp.parentNode.removeChild( temp );
+
+	if ( display === "none" ) {
+		display = "block";
+	}
+	defaultDisplayMap[ nodeName ] = display;
+
+	return display;
+}
+
+function showHide( elements, show ) {
+	var display, elem,
+		values = [],
+		index = 0,
+		length = elements.length;
+
+	// Determine new display value for elements that need to change
+	for ( ; index < length; index++ ) {
+		elem = elements[ index ];
+		if ( !elem.style ) {
+			continue;
+		}
+
+		display = elem.style.display;
+		if ( show ) {
+
+			// Since we force visibility upon cascade-hidden elements, an immediate (and slow)
+			// check is required in this first loop unless we have a nonempty display value (either
+			// inline or about-to-be-restored)
+			if ( display === "none" ) {
+				values[ index ] = dataPriv.get( elem, "display" ) || null;
+				if ( !values[ index ] ) {
+					elem.style.display = "";
+				}
+			}
+			if ( elem.style.display === "" && isHiddenWithinTree( elem ) ) {
+				values[ index ] = getDefaultDisplay( elem );
+			}
+		} else {
+			if ( display !== "none" ) {
+				values[ index ] = "none";
+
+				// Remember what we're overwriting
+				dataPriv.set( elem, "display", display );
+			}
+		}
+	}
+
+	// Set the display of the elements in a second loop to avoid constant reflow
+	for ( index = 0; index < length; index++ ) {
+		if ( values[ index ] != null ) {
+			elements[ index ].style.display = values[ index ];
+		}
+	}
+
+	return elements;
+}
+
+jQuery.fn.extend( {
+	show: function() {
+		return showHide( this, true );
+	},
+	hide: function() {
+		return showHide( this );
+	},
+	toggle: function( state ) {
+		if ( typeof state === "boolean" ) {
+			return state ? this.show() : this.hide();
+		}
+
+		return this.each( function() {
+			if ( isHiddenWithinTree( this ) ) {
+				jQuery( this ).show();
+			} else {
+				jQuery( this ).hide();
+			}
+		} );
+	}
+} );
+var rcheckableType = ( /^(?:checkbox|radio)$/i );
+
+var rtagName = ( /<([a-z][^\/\0>\x20\t\r\n\f]*)/i );
+
+var rscriptType = ( /^$|^module$|\/(?:java|ecma)script/i );
+
+
+
+// We have to close these tags to support XHTML (#13200)
+var wrapMap = {
+
+	// Support: IE <=9 only
+	option: [ 1, "<select multiple='multiple'>", "</select>" ],
+
+	// XHTML parsers do not magically insert elements in the
+	// same way that tag soup parsers do. So we cannot shorten
+	// this by omitting <tbody> or other required elements.
+	thead: [ 1, "<table>", "</table>" ],
+	col: [ 2, "<table><colgroup>", "</colgroup></table>" ],
+	tr: [ 2, "<table><tbody>", "</tbody></table>" ],
+	td: [ 3, "<table><tbody><tr>", "</tr></tbody></table>" ],
+
+	_default: [ 0, "", "" ]
+};
+
+// Support: IE <=9 only
+wrapMap.optgroup = wrapMap.option;
+
+wrapMap.tbody = wrapMap.tfoot = wrapMap.colgroup = wrapMap.caption = wrapMap.thead;
+wrapMap.th = wrapMap.td;
+
+
+function getAll( context, tag ) {
+
+	// Support: IE <=9 - 11 only
+	// Use typeof to avoid zero-argument method invocation on host objects (#15151)
+	var ret;
+
+	if ( typeof context.getElementsByTagName !== "undefined" ) {
+		ret = context.getElementsByTagName( tag || "*" );
+
+	} else if ( typeof context.querySelectorAll !== "undefined" ) {
+		ret = context.querySelectorAll( tag || "*" );
+
+	} else {
+		ret = [];
+	}
+
+	if ( tag === undefined || tag && nodeName( context, tag ) ) {
+		return jQuery.merge( [ context ], ret );
+	}
+
+	return ret;
+}
+
+
+// Mark scripts as having already been evaluated
+function setGlobalEval( elems, refElements ) {
+	var i = 0,
+		l = elems.length;
+
+	for ( ; i < l; i++ ) {
+		dataPriv.set(
+			elems[ i ],
+			"globalEval",
+			!refElements || dataPriv.get( refElements[ i ], "globalEval" )
+		);
+	}
+}
+
+
+var rhtml = /<|&#?\w+;/;
+
+function buildFragment( elems, context, scripts, selection, ignored ) {
+	var elem, tmp, tag, wrap, attached, j,
+		fragment = context.createDocumentFragment(),
+		nodes = [],
+		i = 0,
+		l = elems.length;
+
+	for ( ; i < l; i++ ) {
+		elem = elems[ i ];
+
+		if ( elem || elem === 0 ) {
+
+			// Add nodes directly
+			if ( toType( elem ) === "object" ) {
+
+				// Support: Android <=4.0 only, PhantomJS 1 only
+				// push.apply(_, arraylike) throws on ancient WebKit
+				jQuery.merge( nodes, elem.nodeType ? [ elem ] : elem );
+
+			// Convert non-html into a text node
+			} else if ( !rhtml.test( elem ) ) {
+				nodes.push( context.createTextNode( elem ) );
+
+			// Convert html into DOM nodes
+			} else {
+				tmp = tmp || fragment.appendChild( context.createElement( "div" ) );
+
+				// Deserialize a standard representation
+				tag = ( rtagName.exec( elem ) || [ "", "" ] )[ 1 ].toLowerCase();
+				wrap = wrapMap[ tag ] || wrapMap._default;
+				tmp.innerHTML = wrap[ 1 ] + jQuery.htmlPrefilter( elem ) + wrap[ 2 ];
+
+				// Descend through wrappers to the right content
+				j = wrap[ 0 ];
+				while ( j-- ) {
+					tmp = tmp.lastChild;
+				}
+
+				// Support: Android <=4.0 only, PhantomJS 1 only
+				// push.apply(_, arraylike) throws on ancient WebKit
+				jQuery.merge( nodes, tmp.childNodes );
+
+				// Remember the top-level container
+				tmp = fragment.firstChild;
+
+				// Ensure the created nodes are orphaned (#12392)
+				tmp.textContent = "";
+			}
+		}
+	}
+
+	// Remove wrapper from fragment
+	fragment.textContent = "";
+
+	i = 0;
+	while ( ( elem = nodes[ i++ ] ) ) {
+
+		// Skip elements already in the context collection (trac-4087)
+		if ( selection && jQuery.inArray( elem, selection ) > -1 ) {
+			if ( ignored ) {
+				ignored.push( elem );
+			}
+			continue;
+		}
+
+		attached = isAttached( elem );
+
+		// Append to fragment
+		tmp = getAll( fragment.appendChild( elem ), "script" );
+
+		// Preserve script evaluation history
+		if ( attached ) {
+			setGlobalEval( tmp );
+		}
+
+		// Capture executables
+		if ( scripts ) {
+			j = 0;
+			while ( ( elem = tmp[ j++ ] ) ) {
+				if ( rscriptType.test( elem.type || "" ) ) {
+					scripts.push( elem );
+				}
+			}
+		}
+	}
+
+	return fragment;
+}
+
+
+( function() {
+	var fragment = document.createDocumentFragment(),
+		div = fragment.appendChild( document.createElement( "div" ) ),
+		input = document.createElement( "input" );
+
+	// Support: Android 4.0 - 4.3 only
+	// Check state lost if the name is set (#11217)
+	// Support: Windows Web Apps (WWA)
+	// `name` and `type` must use .setAttribute for WWA (#14901)
+	input.setAttribute( "type", "radio" );
+	input.setAttribute( "checked", "checked" );
+	input.setAttribute( "name", "t" );
+
+	div.appendChild( input );
+
+	// Support: Android <=4.1 only
+	// Older WebKit doesn't clone checked state correctly in fragments
+	support.checkClone = div.cloneNode( true ).cloneNode( true ).lastChild.checked;
+
+	// Support: IE <=11 only
+	// Make sure textarea (and checkbox) defaultValue is properly cloned
+	div.innerHTML = "<textarea>x</textarea>";
+	support.noCloneChecked = !!div.cloneNode( true ).lastChild.defaultValue;
+} )();
+
+
+var
+	rkeyEvent = /^key/,
+	rmouseEvent = /^(?:mouse|pointer|contextmenu|drag|drop)|click/,
+	rtypenamespace = /^([^.]*)(?:\.(.+)|)/;
+
+function returnTrue() {
+	return true;
+}
+
+function returnFalse() {
+	return false;
+}
+
+// Support: IE <=9 - 11+
+// focus() and blur() are asynchronous, except when they are no-op.
+// So expect focus to be synchronous when the element is already active,
+// and blur to be synchronous when the element is not already active.
+// (focus and blur are always synchronous in other supported browsers,
+// this just defines when we can count on it).
+function expectSync( elem, type ) {
+	return ( elem === safeActiveElement() ) === ( type === "focus" );
+}
+
+// Support: IE <=9 only
+// Accessing document.activeElement can throw unexpectedly
+// https://bugs.jquery.com/ticket/13393
+function safeActiveElement() {
+	try {
+		return document.activeElement;
+	} catch ( err ) { }
+}
+
+function on( elem, types, selector, data, fn, one ) {
+	var origFn, type;
+
+	// Types can be a map of types/handlers
+	if ( typeof types === "object" ) {
+
+		// ( types-Object, selector, data )
+		if ( typeof selector !== "string" ) {
+
+			// ( types-Object, data )
+			data = data || selector;
+			selector = undefined;
+		}
+		for ( type in types ) {
+			on( elem, type, selector, data, types[ type ], one );
+		}
+		return elem;
+	}
+
+	if ( data == null && fn == null ) {
+
+		// ( types, fn )
+		fn = selector;
+		data = selector = undefined;
+	} else if ( fn == null ) {
+		if ( typeof selector === "string" ) {
+
+			// ( types, selector, fn )
+			fn = data;
+			data = undefined;
+		} else {
+
+			// ( types, data, fn )
+			fn = data;
+			data = selector;
+			selector = undefined;
+		}
+	}
+	if ( fn === false ) {
+		fn = returnFalse;
+	} else if ( !fn ) {
+		return elem;
+	}
+
+	if ( one === 1 ) {
+		origFn = fn;
+		fn = function( event ) {
+
+			// Can use an empty set, since event contains the info
+			jQuery().off( event );
+			return origFn.apply( this, arguments );
+		};
+
+		// Use same guid so caller can remove using origFn
+		fn.guid = origFn.guid || ( origFn.guid = jQuery.guid++ );
+	}
+	return elem.each( function() {
+		jQuery.event.add( this, types, fn, data, selector );
+	} );
+}
+
+/*
+ * Helper functions for managing events -- not part of the public interface.
+ * Props to Dean Edwards' addEvent library for many of the ideas.
+ */
+jQuery.event = {
+
+	global: {},
+
+	add: function( elem, types, handler, data, selector ) {
+
+		var handleObjIn, eventHandle, tmp,
+			events, t, handleObj,
+			special, handlers, type, namespaces, origType,
+			elemData = dataPriv.get( elem );
+
+		// Don't attach events to noData or text/comment nodes (but allow plain objects)
+		if ( !elemData ) {
+			return;
+		}
+
+		// Caller can pass in an object of custom data in lieu of the handler
+		if ( handler.handler ) {
+			handleObjIn = handler;
+			handler = handleObjIn.handler;
+			selector = handleObjIn.selector;
+		}
+
+		// Ensure that invalid selectors throw exceptions at attach time
+		// Evaluate against documentElement in case elem is a non-element node (e.g., document)
+		if ( selector ) {
+			jQuery.find.matchesSelector( documentElement, selector );
+		}
+
+		// Make sure that the handler has a unique ID, used to find/remove it later
+		if ( !handler.guid ) {
+			handler.guid = jQuery.guid++;
+		}
+
+		// Init the element's event structure and main handler, if this is the first
+		if ( !( events = elemData.events ) ) {
+			events = elemData.events = {};
+		}
+		if ( !( eventHandle = elemData.handle ) ) {
+			eventHandle = elemData.handle = function( e ) {
+
+				// Discard the second event of a jQuery.event.trigger() and
+				// when an event is called after a page has unloaded
+				return typeof jQuery !== "undefined" && jQuery.event.triggered !== e.type ?
+					jQuery.event.dispatch.apply( elem, arguments ) : undefined;
+			};
+		}
+
+		// Handle multiple events separated by a space
+		types = ( types || "" ).match( rnothtmlwhite ) || [ "" ];
+		t = types.length;
+		while ( t-- ) {
+			tmp = rtypenamespace.exec( types[ t ] ) || [];
+			type = origType = tmp[ 1 ];
+			namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort();
+
+			// There *must* be a type, no attaching namespace-only handlers
+			if ( !type ) {
+				continue;
+			}
+
+			// If event changes its type, use the special event handlers for the changed type
+			special = jQuery.event.special[ type ] || {};
+
+			// If selector defined, determine special event api type, otherwise given type
+			type = ( selector ? special.delegateType : special.bindType ) || type;
+
+			// Update special based on newly reset type
+			special = jQuery.event.special[ type ] || {};
+
+			// handleObj is passed to all event handlers
+			handleObj = jQuery.extend( {
+				type: type,
+				origType: origType,
+				data: data,
+				handler: handler,
+				guid: handler.guid,
+				selector: selector,
+				needsContext: selector && jQuery.expr.match.needsContext.test( selector ),
+				namespace: namespaces.join( "." )
+			}, handleObjIn );
+
+			// Init the event handler queue if we're the first
+			if ( !( handlers = events[ type ] ) ) {
+				handlers = events[ type ] = [];
+				handlers.delegateCount = 0;
+
+				// Only use addEventListener if the special events handler returns false
+				if ( !special.setup ||
+					special.setup.call( elem, data, namespaces, eventHandle ) === false ) {
+
+					if ( elem.addEventListener ) {
+						elem.addEventListener( type, eventHandle );
+					}
+				}
+			}
+
+			if ( special.add ) {
+				special.add.call( elem, handleObj );
+
+				if ( !handleObj.handler.guid ) {
+					handleObj.handler.guid = handler.guid;
+				}
+			}
+
+			// Add to the element's handler list, delegates in front
+			if ( selector ) {
+				handlers.splice( handlers.delegateCount++, 0, handleObj );
+			} else {
+				handlers.push( handleObj );
+			}
+
+			// Keep track of which events have ever been used, for event optimization
+			jQuery.event.global[ type ] = true;
+		}
+
+	},
+
+	// Detach an event or set of events from an element
+	remove: function( elem, types, handler, selector, mappedTypes ) {
+
+		var j, origCount, tmp,
+			events, t, handleObj,
+			special, handlers, type, namespaces, origType,
+			elemData = dataPriv.hasData( elem ) && dataPriv.get( elem );
+
+		if ( !elemData || !( events = elemData.events ) ) {
+			return;
+		}
+
+		// Once for each type.namespace in types; type may be omitted
+		types = ( types || "" ).match( rnothtmlwhite ) || [ "" ];
+		t = types.length;
+		while ( t-- ) {
+			tmp = rtypenamespace.exec( types[ t ] ) || [];
+			type = origType = tmp[ 1 ];
+			namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort();
+
+			// Unbind all events (on this namespace, if provided) for the element
+			if ( !type ) {
+				for ( type in events ) {
+					jQuery.event.remove( elem, type + types[ t ], handler, selector, true );
+				}
+				continue;
+			}
+
+			special = jQuery.event.special[ type ] || {};
+			type = ( selector ? special.delegateType : special.bindType ) || type;
+			handlers = events[ type ] || [];
+			tmp = tmp[ 2 ] &&
+				new RegExp( "(^|\\.)" + namespaces.join( "\\.(?:.*\\.|)" ) + "(\\.|$)" );
+
+			// Remove matching events
+			origCount = j = handlers.length;
+			while ( j-- ) {
+				handleObj = handlers[ j ];
+
+				if ( ( mappedTypes || origType === handleObj.origType ) &&
+					( !handler || handler.guid === handleObj.guid ) &&
+					( !tmp || tmp.test( handleObj.namespace ) ) &&
+					( !selector || selector === handleObj.selector ||
+						selector === "**" && handleObj.selector ) ) {
+					handlers.splice( j, 1 );
+
+					if ( handleObj.selector ) {
+						handlers.delegateCount--;
+					}
+					if ( special.remove ) {
+						special.remove.call( elem, handleObj );
+					}
+				}
+			}
+
+			// Remove generic event handler if we removed something and no more handlers exist
+			// (avoids potential for endless recursion during removal of special event handlers)
+			if ( origCount && !handlers.length ) {
+				if ( !special.teardown ||
+					special.teardown.call( elem, namespaces, elemData.handle ) === false ) {
+
+					jQuery.removeEvent( elem, type, elemData.handle );
+				}
+
+				delete events[ type ];
+			}
+		}
+
+		// Remove data and the expando if it's no longer used
+		if ( jQuery.isEmptyObject( events ) ) {
+			dataPriv.remove( elem, "handle events" );
+		}
+	},
+
+	dispatch: function( nativeEvent ) {
+
+		// Make a writable jQuery.Event from the native event object
+		var event = jQuery.event.fix( nativeEvent );
+
+		var i, j, ret, matched, handleObj, handlerQueue,
+			args = new Array( arguments.length ),
+			handlers = ( dataPriv.get( this, "events" ) || {} )[ event.type ] || [],
+			special = jQuery.event.special[ event.type ] || {};
+
+		// Use the fix-ed jQuery.Event rather than the (read-only) native event
+		args[ 0 ] = event;
+
+		for ( i = 1; i < arguments.length; i++ ) {
+			args[ i ] = arguments[ i ];
+		}
+
+		event.delegateTarget = this;
+
+		// Call the preDispatch hook for the mapped type, and let it bail if desired
+		if ( special.preDispatch && special.preDispatch.call( this, event ) === false ) {
+			return;
+		}
+
+		// Determine handlers
+		handlerQueue = jQuery.event.handlers.call( this, event, handlers );
+
+		// Run delegates first; they may want to stop propagation beneath us
+		i = 0;
+		while ( ( matched = handlerQueue[ i++ ] ) && !event.isPropagationStopped() ) {
+			event.currentTarget = matched.elem;
+
+			j = 0;
+			while ( ( handleObj = matched.handlers[ j++ ] ) &&
+				!event.isImmediatePropagationStopped() ) {
+
+				// If the event is namespaced, then each handler is only invoked if it is
+				// specially universal or its namespaces are a superset of the event's.
+				if ( !event.rnamespace || handleObj.namespace === false ||
+					event.rnamespace.test( handleObj.namespace ) ) {
+
+					event.handleObj = handleObj;
+					event.data = handleObj.data;
+
+					ret = ( ( jQuery.event.special[ handleObj.origType ] || {} ).handle ||
+						handleObj.handler ).apply( matched.elem, args );
+
+					if ( ret !== undefined ) {
+						if ( ( event.result = ret ) === false ) {
+							event.preventDefault();
+							event.stopPropagation();
+						}
+					}
+				}
+			}
+		}
+
+		// Call the postDispatch hook for the mapped type
+		if ( special.postDispatch ) {
+			special.postDispatch.call( this, event );
+		}
+
+		return event.result;
+	},
+
+	handlers: function( event, handlers ) {
+		var i, handleObj, sel, matchedHandlers, matchedSelectors,
+			handlerQueue = [],
+			delegateCount = handlers.delegateCount,
+			cur = event.target;
+
+		// Find delegate handlers
+		if ( delegateCount &&
+
+			// Support: IE <=9
+			// Black-hole SVG <use> instance trees (trac-13180)
+			cur.nodeType &&
+
+			// Support: Firefox <=42
+			// Suppress spec-violating clicks indicating a non-primary pointer button (trac-3861)
+			// https://www.w3.org/TR/DOM-Level-3-Events/#event-type-click
+			// Support: IE 11 only
+			// ...but not arrow key "clicks" of radio inputs, which can have `button` -1 (gh-2343)
+			!( event.type === "click" && event.button >= 1 ) ) {
+
+			for ( ; cur !== this; cur = cur.parentNode || this ) {
+
+				// Don't check non-elements (#13208)
+				// Don't process clicks on disabled elements (#6911, #8165, #11382, #11764)
+				if ( cur.nodeType === 1 && !( event.type === "click" && cur.disabled === true ) ) {
+					matchedHandlers = [];
+					matchedSelectors = {};
+					for ( i = 0; i < delegateCount; i++ ) {
+						handleObj = handlers[ i ];
+
+						// Don't conflict with Object.prototype properties (#13203)
+						sel = handleObj.selector + " ";
+
+						if ( matchedSelectors[ sel ] === undefined ) {
+							matchedSelectors[ sel ] = handleObj.needsContext ?
+								jQuery( sel, this ).index( cur ) > -1 :
+								jQuery.find( sel, this, null, [ cur ] ).length;
+						}
+						if ( matchedSelectors[ sel ] ) {
+							matchedHandlers.push( handleObj );
+						}
+					}
+					if ( matchedHandlers.length ) {
+						handlerQueue.push( { elem: cur, handlers: matchedHandlers } );
+					}
+				}
+			}
+		}
+
+		// Add the remaining (directly-bound) handlers
+		cur = this;
+		if ( delegateCount < handlers.length ) {
+			handlerQueue.push( { elem: cur, handlers: handlers.slice( delegateCount ) } );
+		}
+
+		return handlerQueue;
+	},
+
+	addProp: function( name, hook ) {
+		Object.defineProperty( jQuery.Event.prototype, name, {
+			enumerable: true,
+			configurable: true,
+
+			get: isFunction( hook ) ?
+				function() {
+					if ( this.originalEvent ) {
+							return hook( this.originalEvent );
+					}
+				} :
+				function() {
+					if ( this.originalEvent ) {
+							return this.originalEvent[ name ];
+					}
+				},
+
+			set: function( value ) {
+				Object.defineProperty( this, name, {
+					enumerable: true,
+					configurable: true,
+					writable: true,
+					value: value
+				} );
+			}
+		} );
+	},
+
+	fix: function( originalEvent ) {
+		return originalEvent[ jQuery.expando ] ?
+			originalEvent :
+			new jQuery.Event( originalEvent );
+	},
+
+	special: {
+		load: {
+
+			// Prevent triggered image.load events from bubbling to window.load
+			noBubble: true
+		},
+		click: {
+
+			// Utilize native event to ensure correct state for checkable inputs
+			setup: function( data ) {
+
+				// For mutual compressibility with _default, replace `this` access with a local var.
+				// `|| data` is dead code meant only to preserve the variable through minification.
+				var el = this || data;
+
+				// Claim the first handler
+				if ( rcheckableType.test( el.type ) &&
+					el.click && nodeName( el, "input" ) ) {
+
+					// dataPriv.set( el, "click", ... )
+					leverageNative( el, "click", returnTrue );
+				}
+
+				// Return false to allow normal processing in the caller
+				return false;
+			},
+			trigger: function( data ) {
+
+				// For mutual compressibility with _default, replace `this` access with a local var.
+				// `|| data` is dead code meant only to preserve the variable through minification.
+				var el = this || data;
+
+				// Force setup before triggering a click
+				if ( rcheckableType.test( el.type ) &&
+					el.click && nodeName( el, "input" ) ) {
+
+					leverageNative( el, "click" );
+				}
+
+				// Return non-false to allow normal event-path propagation
+				return true;
+			},
+
+			// For cross-browser consistency, suppress native .click() on links
+			// Also prevent it if we're currently inside a leveraged native-event stack
+			_default: function( event ) {
+				var target = event.target;
+				return rcheckableType.test( target.type ) &&
+					target.click && nodeName( target, "input" ) &&
+					dataPriv.get( target, "click" ) ||
+					nodeName( target, "a" );
+			}
+		},
+
+		beforeunload: {
+			postDispatch: function( event ) {
+
+				// Support: Firefox 20+
+				// Firefox doesn't alert if the returnValue field is not set.
+				if ( event.result !== undefined && event.originalEvent ) {
+					event.originalEvent.returnValue = event.result;
+				}
+			}
+		}
+	}
+};
+
+// Ensure the presence of an event listener that handles manually-triggered
+// synthetic events by interrupting progress until reinvoked in response to
+// *native* events that it fires directly, ensuring that state changes have
+// already occurred before other listeners are invoked.
+function leverageNative( el, type, expectSync ) {
+
+	// Missing expectSync indicates a trigger call, which must force setup through jQuery.event.add
+	if ( !expectSync ) {
+		if ( dataPriv.get( el, type ) === undefined ) {
+			jQuery.event.add( el, type, returnTrue );
+		}
+		return;
+	}
+
+	// Register the controller as a special universal handler for all event namespaces
+	dataPriv.set( el, type, false );
+	jQuery.event.add( el, type, {
+		namespace: false,
+		handler: function( event ) {
+			var notAsync, result,
+				saved = dataPriv.get( this, type );
+
+			if ( ( event.isTrigger & 1 ) && this[ type ] ) {
+
+				// Interrupt processing of the outer synthetic .trigger()ed event
+				// Saved data should be false in such cases, but might be a leftover capture object
+				// from an async native handler (gh-4350)
+				if ( !saved.length ) {
+
+					// Store arguments for use when handling the inner native event
+					// There will always be at least one argument (an event object), so this array
+					// will not be confused with a leftover capture object.
+					saved = slice.call( arguments );
+					dataPriv.set( this, type, saved );
+
+					// Trigger the native event and capture its result
+					// Support: IE <=9 - 11+
+					// focus() and blur() are asynchronous
+					notAsync = expectSync( this, type );
+					this[ type ]();
+					result = dataPriv.get( this, type );
+					if ( saved !== result || notAsync ) {
+						dataPriv.set( this, type, false );
+					} else {
+						result = {};
+					}
+					if ( saved !== result ) {
+
+						// Cancel the outer synthetic event
+						event.stopImmediatePropagation();
+						event.preventDefault();
+						return result.value;
+					}
+
+				// If this is an inner synthetic event for an event with a bubbling surrogate
+				// (focus or blur), assume that the surrogate already propagated from triggering the
+				// native event and prevent that from happening again here.
+				// This technically gets the ordering wrong w.r.t. to `.trigger()` (in which the
+				// bubbling surrogate propagates *after* the non-bubbling base), but that seems
+				// less bad than duplication.
+				} else if ( ( jQuery.event.special[ type ] || {} ).delegateType ) {
+					event.stopPropagation();
+				}
+
+			// If this is a native event triggered above, everything is now in order
+			// Fire an inner synthetic event with the original arguments
+			} else if ( saved.length ) {
+
+				// ...and capture the result
+				dataPriv.set( this, type, {
+					value: jQuery.event.trigger(
+
+						// Support: IE <=9 - 11+
+						// Extend with the prototype to reset the above stopImmediatePropagation()
+						jQuery.extend( saved[ 0 ], jQuery.Event.prototype ),
+						saved.slice( 1 ),
+						this
+					)
+				} );
+
+				// Abort handling of the native event
+				event.stopImmediatePropagation();
+			}
+		}
+	} );
+}
+
+jQuery.removeEvent = function( elem, type, handle ) {
+
+	// This "if" is needed for plain objects
+	if ( elem.removeEventListener ) {
+		elem.removeEventListener( type, handle );
+	}
+};
+
+jQuery.Event = function( src, props ) {
+
+	// Allow instantiation without the 'new' keyword
+	if ( !( this instanceof jQuery.Event ) ) {
+		return new jQuery.Event( src, props );
+	}
+
+	// Event object
+	if ( src && src.type ) {
+		this.originalEvent = src;
+		this.type = src.type;
+
+		// Events bubbling up the document may have been marked as prevented
+		// by a handler lower down the tree; reflect the correct value.
+		this.isDefaultPrevented = src.defaultPrevented ||
+				src.defaultPrevented === undefined &&
+
+				// Support: Android <=2.3 only
+				src.returnValue === false ?
+			returnTrue :
+			returnFalse;
+
+		// Create target properties
+		// Support: Safari <=6 - 7 only
+		// Target should not be a text node (#504, #13143)
+		this.target = ( src.target && src.target.nodeType === 3 ) ?
+			src.target.parentNode :
+			src.target;
+
+		this.currentTarget = src.currentTarget;
+		this.relatedTarget = src.relatedTarget;
+
+	// Event type
+	} else {
+		this.type = src;
+	}
+
+	// Put explicitly provided properties onto the event object
+	if ( props ) {
+		jQuery.extend( this, props );
+	}
+
+	// Create a timestamp if incoming event doesn't have one
+	this.timeStamp = src && src.timeStamp || Date.now();
+
+	// Mark it as fixed
+	this[ jQuery.expando ] = true;
+};
+
+// jQuery.Event is based on DOM3 Events as specified by the ECMAScript Language Binding
+// https://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html
+jQuery.Event.prototype = {
+	constructor: jQuery.Event,
+	isDefaultPrevented: returnFalse,
+	isPropagationStopped: returnFalse,
+	isImmediatePropagationStopped: returnFalse,
+	isSimulated: false,
+
+	preventDefault: function() {
+		var e = this.originalEvent;
+
+		this.isDefaultPrevented = returnTrue;
+
+		if ( e && !this.isSimulated ) {
+			e.preventDefault();
+		}
+	},
+	stopPropagation: function() {
+		var e = this.originalEvent;
+
+		this.isPropagationStopped = returnTrue;
+
+		if ( e && !this.isSimulated ) {
+			e.stopPropagation();
+		}
+	},
+	stopImmediatePropagation: function() {
+		var e = this.originalEvent;
+
+		this.isImmediatePropagationStopped = returnTrue;
+
+		if ( e && !this.isSimulated ) {
+			e.stopImmediatePropagation();
+		}
+
+		this.stopPropagation();
+	}
+};
+
+// Includes all common event props including KeyEvent and MouseEvent specific props
+jQuery.each( {
+	altKey: true,
+	bubbles: true,
+	cancelable: true,
+	changedTouches: true,
+	ctrlKey: true,
+	detail: true,
+	eventPhase: true,
+	metaKey: true,
+	pageX: true,
+	pageY: true,
+	shiftKey: true,
+	view: true,
+	"char": true,
+	code: true,
+	charCode: true,
+	key: true,
+	keyCode: true,
+	button: true,
+	buttons: true,
+	clientX: true,
+	clientY: true,
+	offsetX: true,
+	offsetY: true,
+	pointerId: true,
+	pointerType: true,
+	screenX: true,
+	screenY: true,
+	targetTouches: true,
+	toElement: true,
+	touches: true,
+
+	which: function( event ) {
+		var button = event.button;
+
+		// Add which for key events
+		if ( event.which == null && rkeyEvent.test( event.type ) ) {
+			return event.charCode != null ? event.charCode : event.keyCode;
+		}
+
+		// Add which for click: 1 === left; 2 === middle; 3 === right
+		if ( !event.which && button !== undefined && rmouseEvent.test( event.type ) ) {
+			if ( button & 1 ) {
+				return 1;
+			}
+
+			if ( button & 2 ) {
+				return 3;
+			}
+
+			if ( button & 4 ) {
+				return 2;
+			}
+
+			return 0;
+		}
+
+		return event.which;
+	}
+}, jQuery.event.addProp );
+
+jQuery.each( { focus: "focusin", blur: "focusout" }, function( type, delegateType ) {
+	jQuery.event.special[ type ] = {
+
+		// Utilize native event if possible so blur/focus sequence is correct
+		setup: function() {
+
+			// Claim the first handler
+			// dataPriv.set( this, "focus", ... )
+			// dataPriv.set( this, "blur", ... )
+			leverageNative( this, type, expectSync );
+
+			// Return false to allow normal processing in the caller
+			return false;
+		},
+		trigger: function() {
+
+			// Force setup before trigger
+			leverageNative( this, type );
+
+			// Return non-false to allow normal event-path propagation
+			return true;
+		},
+
+		delegateType: delegateType
+	};
+} );
+
+// Create mouseenter/leave events using mouseover/out and event-time checks
+// so that event delegation works in jQuery.
+// Do the same for pointerenter/pointerleave and pointerover/pointerout
+//
+// Support: Safari 7 only
+// Safari sends mouseenter too often; see:
+// https://bugs.chromium.org/p/chromium/issues/detail?id=470258
+// for the description of the bug (it existed in older Chrome versions as well).
+jQuery.each( {
+	mouseenter: "mouseover",
+	mouseleave: "mouseout",
+	pointerenter: "pointerover",
+	pointerleave: "pointerout"
+}, function( orig, fix ) {
+	jQuery.event.special[ orig ] = {
+		delegateType: fix,
+		bindType: fix,
+
+		handle: function( event ) {
+			var ret,
+				target = this,
+				related = event.relatedTarget,
+				handleObj = event.handleObj;
+
+			// For mouseenter/leave call the handler if related is outside the target.
+			// NB: No relatedTarget if the mouse left/entered the browser window
+			if ( !related || ( related !== target && !jQuery.contains( target, related ) ) ) {
+				event.type = handleObj.origType;
+				ret = handleObj.handler.apply( this, arguments );
+				event.type = fix;
+			}
+			return ret;
+		}
+	};
+} );
+
+jQuery.fn.extend( {
+
+	on: function( types, selector, data, fn ) {
+		return on( this, types, selector, data, fn );
+	},
+	one: function( types, selector, data, fn ) {
+		return on( this, types, selector, data, fn, 1 );
+	},
+	off: function( types, selector, fn ) {
+		var handleObj, type;
+		if ( types && types.preventDefault && types.handleObj ) {
+
+			// ( event )  dispatched jQuery.Event
+			handleObj = types.handleObj;
+			jQuery( types.delegateTarget ).off(
+				handleObj.namespace ?
+					handleObj.origType + "." + handleObj.namespace :
+					handleObj.origType,
+				handleObj.selector,
+				handleObj.handler
+			);
+			return this;
+		}
+		if ( typeof types === "object" ) {
+
+			// ( types-object [, selector] )
+			for ( type in types ) {
+				this.off( type, selector, types[ type ] );
+			}
+			return this;
+		}
+		if ( selector === false || typeof selector === "function" ) {
+
+			// ( types [, fn] )
+			fn = selector;
+			selector = undefined;
+		}
+		if ( fn === false ) {
+			fn = returnFalse;
+		}
+		return this.each( function() {
+			jQuery.event.remove( this, types, fn, selector );
+		} );
+	}
+} );
+
+
+var
+
+	/* eslint-disable max-len */
+
+	// See https://github.com/eslint/eslint/issues/3229
+	rxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^\/\0>\x20\t\r\n\f]*)[^>]*)\/>/gi,
+
+	/* eslint-enable */
+
+	// Support: IE <=10 - 11, Edge 12 - 13 only
+	// In IE/Edge using regex groups here causes severe slowdowns.
+	// See https://connect.microsoft.com/IE/feedback/details/1736512/
+	rnoInnerhtml = /<script|<style|<link/i,
+
+	// checked="checked" or checked
+	rchecked = /checked\s*(?:[^=]|=\s*.checked.)/i,
+	rcleanScript = /^\s*<!(?:\[CDATA\[|--)|(?:\]\]|--)>\s*$/g;
+
+// Prefer a tbody over its parent table for containing new rows
+function manipulationTarget( elem, content ) {
+	if ( nodeName( elem, "table" ) &&
+		nodeName( content.nodeType !== 11 ? content : content.firstChild, "tr" ) ) {
+
+		return jQuery( elem ).children( "tbody" )[ 0 ] || elem;
+	}
+
+	return elem;
+}
+
+// Replace/restore the type attribute of script elements for safe DOM manipulation
+function disableScript( elem ) {
+	elem.type = ( elem.getAttribute( "type" ) !== null ) + "/" + elem.type;
+	return elem;
+}
+function restoreScript( elem ) {
+	if ( ( elem.type || "" ).slice( 0, 5 ) === "true/" ) {
+		elem.type = elem.type.slice( 5 );
+	} else {
+		elem.removeAttribute( "type" );
+	}
+
+	return elem;
+}
+
+function cloneCopyEvent( src, dest ) {
+	var i, l, type, pdataOld, pdataCur, udataOld, udataCur, events;
+
+	if ( dest.nodeType !== 1 ) {
+		return;
+	}
+
+	// 1. Copy private data: events, handlers, etc.
+	if ( dataPriv.hasData( src ) ) {
+		pdataOld = dataPriv.access( src );
+		pdataCur = dataPriv.set( dest, pdataOld );
+		events = pdataOld.events;
+
+		if ( events ) {
+			delete pdataCur.handle;
+			pdataCur.events = {};
+
+			for ( type in events ) {
+				for ( i = 0, l = events[ type ].length; i < l; i++ ) {
+					jQuery.event.add( dest, type, events[ type ][ i ] );
+				}
+			}
+		}
+	}
+
+	// 2. Copy user data
+	if ( dataUser.hasData( src ) ) {
+		udataOld = dataUser.access( src );
+		udataCur = jQuery.extend( {}, udataOld );
+
+		dataUser.set( dest, udataCur );
+	}
+}
+
+// Fix IE bugs, see support tests
+function fixInput( src, dest ) {
+	var nodeName = dest.nodeName.toLowerCase();
+
+	// Fails to persist the checked state of a cloned checkbox or radio button.
+	if ( nodeName === "input" && rcheckableType.test( src.type ) ) {
+		dest.checked = src.checked;
+
+	// Fails to return the selected option to the default selected state when cloning options
+	} else if ( nodeName === "input" || nodeName === "textarea" ) {
+		dest.defaultValue = src.defaultValue;
+	}
+}
+
+function domManip( collection, args, callback, ignored ) {
+
+	// Flatten any nested arrays
+	args = concat.apply( [], args );
+
+	var fragment, first, scripts, hasScripts, node, doc,
+		i = 0,
+		l = collection.length,
+		iNoClone = l - 1,
+		value = args[ 0 ],
+		valueIsFunction = isFunction( value );
+
+	// We can't cloneNode fragments that contain checked, in WebKit
+	if ( valueIsFunction ||
+			( l > 1 && typeof value === "string" &&
+				!support.checkClone && rchecked.test( value ) ) ) {
+		return collection.each( function( index ) {
+			var self = collection.eq( index );
+			if ( valueIsFunction ) {
+				args[ 0 ] = value.call( this, index, self.html() );
+			}
+			domManip( self, args, callback, ignored );
+		} );
+	}
+
+	if ( l ) {
+		fragment = buildFragment( args, collection[ 0 ].ownerDocument, false, collection, ignored );
+		first = fragment.firstChild;
+
+		if ( fragment.childNodes.length === 1 ) {
+			fragment = first;
+		}
+
+		// Require either new content or an interest in ignored elements to invoke the callback
+		if ( first || ignored ) {
+			scripts = jQuery.map( getAll( fragment, "script" ), disableScript );
+			hasScripts = scripts.length;
+
+			// Use the original fragment for the last item
+			// instead of the first because it can end up
+			// being emptied incorrectly in certain situations (#8070).
+			for ( ; i < l; i++ ) {
+				node = fragment;
+
+				if ( i !== iNoClone ) {
+					node = jQuery.clone( node, true, true );
+
+					// Keep references to cloned scripts for later restoration
+					if ( hasScripts ) {
+
+						// Support: Android <=4.0 only, PhantomJS 1 only
+						// push.apply(_, arraylike) throws on ancient WebKit
+						jQuery.merge( scripts, getAll( node, "script" ) );
+					}
+				}
+
+				callback.call( collection[ i ], node, i );
+			}
+
+			if ( hasScripts ) {
+				doc = scripts[ scripts.length - 1 ].ownerDocument;
+
+				// Reenable scripts
+				jQuery.map( scripts, restoreScript );
+
+				// Evaluate executable scripts on first document insertion
+				for ( i = 0; i < hasScripts; i++ ) {
+					node = scripts[ i ];
+					if ( rscriptType.test( node.type || "" ) &&
+						!dataPriv.access( node, "globalEval" ) &&
+						jQuery.contains( doc, node ) ) {
+
+						if ( node.src && ( node.type || "" ).toLowerCase()  !== "module" ) {
+
+							// Optional AJAX dependency, but won't run scripts if not present
+							if ( jQuery._evalUrl && !node.noModule ) {
+								jQuery._evalUrl( node.src, {
+									nonce: node.nonce || node.getAttribute( "nonce" )
+								} );
+							}
+						} else {
+							DOMEval( node.textContent.replace( rcleanScript, "" ), node, doc );
+						}
+					}
+				}
+			}
+		}
+	}
+
+	return collection;
+}
+
+function remove( elem, selector, keepData ) {
+	var node,
+		nodes = selector ? jQuery.filter( selector, elem ) : elem,
+		i = 0;
+
+	for ( ; ( node = nodes[ i ] ) != null; i++ ) {
+		if ( !keepData && node.nodeType === 1 ) {
+			jQuery.cleanData( getAll( node ) );
+		}
+
+		if ( node.parentNode ) {
+			if ( keepData && isAttached( node ) ) {
+				setGlobalEval( getAll( node, "script" ) );
+			}
+			node.parentNode.removeChild( node );
+		}
+	}
+
+	return elem;
+}
+
+jQuery.extend( {
+	htmlPrefilter: function( html ) {
+		return html.replace( rxhtmlTag, "<$1></$2>" );
+	},
+
+	clone: function( elem, dataAndEvents, deepDataAndEvents ) {
+		var i, l, srcElements, destElements,
+			clone = elem.cloneNode( true ),
+			inPage = isAttached( elem );
+
+		// Fix IE cloning issues
+		if ( !support.noCloneChecked && ( elem.nodeType === 1 || elem.nodeType === 11 ) &&
+				!jQuery.isXMLDoc( elem ) ) {
+
+			// We eschew Sizzle here for performance reasons: https://jsperf.com/getall-vs-sizzle/2
+			destElements = getAll( clone );
+			srcElements = getAll( elem );
+
+			for ( i = 0, l = srcElements.length; i < l; i++ ) {
+				fixInput( srcElements[ i ], destElements[ i ] );
+			}
+		}
+
+		// Copy the events from the original to the clone
+		if ( dataAndEvents ) {
+			if ( deepDataAndEvents ) {
+				srcElements = srcElements || getAll( elem );
+				destElements = destElements || getAll( clone );
+
+				for ( i = 0, l = srcElements.length; i < l; i++ ) {
+					cloneCopyEvent( srcElements[ i ], destElements[ i ] );
+				}
+			} else {
+				cloneCopyEvent( elem, clone );
+			}
+		}
+
+		// Preserve script evaluation history
+		destElements = getAll( clone, "script" );
+		if ( destElements.length > 0 ) {
+			setGlobalEval( destElements, !inPage && getAll( elem, "script" ) );
+		}
+
+		// Return the cloned set
+		return clone;
+	},
+
+	cleanData: function( elems ) {
+		var data, elem, type,
+			special = jQuery.event.special,
+			i = 0;
+
+		for ( ; ( elem = elems[ i ] ) !== undefined; i++ ) {
+			if ( acceptData( elem ) ) {
+				if ( ( data = elem[ dataPriv.expando ] ) ) {
+					if ( data.events ) {
+						for ( type in data.events ) {
+							if ( special[ type ] ) {
+								jQuery.event.remove( elem, type );
+
+							// This is a shortcut to avoid jQuery.event.remove's overhead
+							} else {
+								jQuery.removeEvent( elem, type, data.handle );
+							}
+						}
+					}
+
+					// Support: Chrome <=35 - 45+
+					// Assign undefined instead of using delete, see Data#remove
+					elem[ dataPriv.expando ] = undefined;
+				}
+				if ( elem[ dataUser.expando ] ) {
+
+					// Support: Chrome <=35 - 45+
+					// Assign undefined instead of using delete, see Data#remove
+					elem[ dataUser.expando ] = undefined;
+				}
+			}
+		}
+	}
+} );
+
+jQuery.fn.extend( {
+	detach: function( selector ) {
+		return remove( this, selector, true );
+	},
+
+	remove: function( selector ) {
+		return remove( this, selector );
+	},
+
+	text: function( value ) {
+		return access( this, function( value ) {
+			return value === undefined ?
+				jQuery.text( this ) :
+				this.empty().each( function() {
+					if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
+						this.textContent = value;
+					}
+				} );
+		}, null, value, arguments.length );
+	},
+
+	append: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
+				var target = manipulationTarget( this, elem );
+				target.appendChild( elem );
+			}
+		} );
+	},
+
+	prepend: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
+				var target = manipulationTarget( this, elem );
+				target.insertBefore( elem, target.firstChild );
+			}
+		} );
+	},
+
+	before: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.parentNode ) {
+				this.parentNode.insertBefore( elem, this );
+			}
+		} );
+	},
+
+	after: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.parentNode ) {
+				this.parentNode.insertBefore( elem, this.nextSibling );
+			}
+		} );
+	},
+
+	empty: function() {
+		var elem,
+			i = 0;
+
+		for ( ; ( elem = this[ i ] ) != null; i++ ) {
+			if ( elem.nodeType === 1 ) {
+
+				// Prevent memory leaks
+				jQuery.cleanData( getAll( elem, false ) );
+
+				// Remove any remaining nodes
+				elem.textContent = "";
+			}
+		}
+
+		return this;
+	},
+
+	clone: function( dataAndEvents, deepDataAndEvents ) {
+		dataAndEvents = dataAndEvents == null ? false : dataAndEvents;
+		deepDataAndEvents = deepDataAndEvents == null ? dataAndEvents : deepDataAndEvents;
+
+		return this.map( function() {
+			return jQuery.clone( this, dataAndEvents, deepDataAndEvents );
+		} );
+	},
+
+	html: function( value ) {
+		return access( this, function( value ) {
+			var elem = this[ 0 ] || {},
+				i = 0,
+				l = this.length;
+
+			if ( value === undefined && elem.nodeType === 1 ) {
+				return elem.innerHTML;
+			}
+
+			// See if we can take a shortcut and just use innerHTML
+			if ( typeof value === "string" && !rnoInnerhtml.test( value ) &&
+				!wrapMap[ ( rtagName.exec( value ) || [ "", "" ] )[ 1 ].toLowerCase() ] ) {
+
+				value = jQuery.htmlPrefilter( value );
+
+				try {
+					for ( ; i < l; i++ ) {
+						elem = this[ i ] || {};
+
+						// Remove element nodes and prevent memory leaks
+						if ( elem.nodeType === 1 ) {
+							jQuery.cleanData( getAll( elem, false ) );
+							elem.innerHTML = value;
+						}
+					}
+
+					elem = 0;
+
+				// If using innerHTML throws an exception, use the fallback method
+				} catch ( e ) {}
+			}
+
+			if ( elem ) {
+				this.empty().append( value );
+			}
+		}, null, value, arguments.length );
+	},
+
+	replaceWith: function() {
+		var ignored = [];
+
+		// Make the changes, replacing each non-ignored context element with the new content
+		return domManip( this, arguments, function( elem ) {
+			var parent = this.parentNode;
+
+			if ( jQuery.inArray( this, ignored ) < 0 ) {
+				jQuery.cleanData( getAll( this ) );
+				if ( parent ) {
+					parent.replaceChild( elem, this );
+				}
+			}
+
+		// Force callback invocation
+		}, ignored );
+	}
+} );
+
+jQuery.each( {
+	appendTo: "append",
+	prependTo: "prepend",
+	insertBefore: "before",
+	insertAfter: "after",
+	replaceAll: "replaceWith"
+}, function( name, original ) {
+	jQuery.fn[ name ] = function( selector ) {
+		var elems,
+			ret = [],
+			insert = jQuery( selector ),
+			last = insert.length - 1,
+			i = 0;
+
+		for ( ; i <= last; i++ ) {
+			elems = i === last ? this : this.clone( true );
+			jQuery( insert[ i ] )[ original ]( elems );
+
+			// Support: Android <=4.0 only, PhantomJS 1 only
+			// .get() because push.apply(_, arraylike) throws on ancient WebKit
+			push.apply( ret, elems.get() );
+		}
+
+		return this.pushStack( ret );
+	};
+} );
+var rnumnonpx = new RegExp( "^(" + pnum + ")(?!px)[a-z%]+$", "i" );
+
+var getStyles = function( elem ) {
+
+		// Support: IE <=11 only, Firefox <=30 (#15098, #14150)
+		// IE throws on elements created in popups
+		// FF meanwhile throws on frame elements through "defaultView.getComputedStyle"
+		var view = elem.ownerDocument.defaultView;
+
+		if ( !view || !view.opener ) {
+			view = window;
+		}
+
+		return view.getComputedStyle( elem );
+	};
+
+var rboxStyle = new RegExp( cssExpand.join( "|" ), "i" );
+
+
+
+( function() {
+
+	// Executing both pixelPosition & boxSizingReliable tests require only one layout
+	// so they're executed at the same time to save the second computation.
+	function computeStyleTests() {
+
+		// This is a singleton, we need to execute it only once
+		if ( !div ) {
+			return;
+		}
+
+		container.style.cssText = "position:absolute;left:-11111px;width:60px;" +
+			"margin-top:1px;padding:0;border:0";
+		div.style.cssText =
+			"position:relative;display:block;box-sizing:border-box;overflow:scroll;" +
+			"margin:auto;border:1px;padding:1px;" +
+			"width:60%;top:1%";
+		documentElement.appendChild( container ).appendChild( div );
+
+		var divStyle = window.getComputedStyle( div );
+		pixelPositionVal = divStyle.top !== "1%";
+
+		// Support: Android 4.0 - 4.3 only, Firefox <=3 - 44
+		reliableMarginLeftVal = roundPixelMeasures( divStyle.marginLeft ) === 12;
+
+		// Support: Android 4.0 - 4.3 only, Safari <=9.1 - 10.1, iOS <=7.0 - 9.3
+		// Some styles come back with percentage values, even though they shouldn't
+		div.style.right = "60%";
+		pixelBoxStylesVal = roundPixelMeasures( divStyle.right ) === 36;
+
+		// Support: IE 9 - 11 only
+		// Detect misreporting of content dimensions for box-sizing:border-box elements
+		boxSizingReliableVal = roundPixelMeasures( divStyle.width ) === 36;
+
+		// Support: IE 9 only
+		// Detect overflow:scroll screwiness (gh-3699)
+		// Support: Chrome <=64
+		// Don't get tricked when zoom affects offsetWidth (gh-4029)
+		div.style.position = "absolute";
+		scrollboxSizeVal = roundPixelMeasures( div.offsetWidth / 3 ) === 12;
+
+		documentElement.removeChild( container );
+
+		// Nullify the div so it wouldn't be stored in the memory and
+		// it will also be a sign that checks already performed
+		div = null;
+	}
+
+	function roundPixelMeasures( measure ) {
+		return Math.round( parseFloat( measure ) );
+	}
+
+	var pixelPositionVal, boxSizingReliableVal, scrollboxSizeVal, pixelBoxStylesVal,
+		reliableMarginLeftVal,
+		container = document.createElement( "div" ),
+		div = document.createElement( "div" );
+
+	// Finish early in limited (non-browser) environments
+	if ( !div.style ) {
+		return;
+	}
+
+	// Support: IE <=9 - 11 only
+	// Style of cloned element affects source element cloned (#8908)
+	div.style.backgroundClip = "content-box";
+	div.cloneNode( true ).style.backgroundClip = "";
+	support.clearCloneStyle = div.style.backgroundClip === "content-box";
+
+	jQuery.extend( support, {
+		boxSizingReliable: function() {
+			computeStyleTests();
+			return boxSizingReliableVal;
+		},
+		pixelBoxStyles: function() {
+			computeStyleTests();
+			return pixelBoxStylesVal;
+		},
+		pixelPosition: function() {
+			computeStyleTests();
+			return pixelPositionVal;
+		},
+		reliableMarginLeft: function() {
+			computeStyleTests();
+			return reliableMarginLeftVal;
+		},
+		scrollboxSize: function() {
+			computeStyleTests();
+			return scrollboxSizeVal;
+		}
+	} );
+} )();
+
+
+function curCSS( elem, name, computed ) {
+	var width, minWidth, maxWidth, ret,
+
+		// Support: Firefox 51+
+		// Retrieving style before computed somehow
+		// fixes an issue with getting wrong values
+		// on detached elements
+		style = elem.style;
+
+	computed = computed || getStyles( elem );
+
+	// getPropertyValue is needed for:
+	//   .css('filter') (IE 9 only, #12537)
+	//   .css('--customProperty) (#3144)
+	if ( computed ) {
+		ret = computed.getPropertyValue( name ) || computed[ name ];
+
+		if ( ret === "" && !isAttached( elem ) ) {
+			ret = jQuery.style( elem, name );
+		}
+
+		// A tribute to the "awesome hack by Dean Edwards"
+		// Android Browser returns percentage for some values,
+		// but width seems to be reliably pixels.
+		// This is against the CSSOM draft spec:
+		// https://drafts.csswg.org/cssom/#resolved-values
+		if ( !support.pixelBoxStyles() && rnumnonpx.test( ret ) && rboxStyle.test( name ) ) {
+
+			// Remember the original values
+			width = style.width;
+			minWidth = style.minWidth;
+			maxWidth = style.maxWidth;
+
+			// Put in the new values to get a computed value out
+			style.minWidth = style.maxWidth = style.width = ret;
+			ret = computed.width;
+
+			// Revert the changed values
+			style.width = width;
+			style.minWidth = minWidth;
+			style.maxWidth = maxWidth;
+		}
+	}
+
+	return ret !== undefined ?
+
+		// Support: IE <=9 - 11 only
+		// IE returns zIndex value as an integer.
+		ret + "" :
+		ret;
+}
+
+
+function addGetHookIf( conditionFn, hookFn ) {
+
+	// Define the hook, we'll check on the first run if it's really needed.
+	return {
+		get: function() {
+			if ( conditionFn() ) {
+
+				// Hook not needed (or it's not possible to use it due
+				// to missing dependency), remove it.
+				delete this.get;
+				return;
+			}
+
+			// Hook needed; redefine it so that the support test is not executed again.
+			return ( this.get = hookFn ).apply( this, arguments );
+		}
+	};
+}
+
+
+var cssPrefixes = [ "Webkit", "Moz", "ms" ],
+	emptyStyle = document.createElement( "div" ).style,
+	vendorProps = {};
+
+// Return a vendor-prefixed property or undefined
+function vendorPropName( name ) {
+
+	// Check for vendor prefixed names
+	var capName = name[ 0 ].toUpperCase() + name.slice( 1 ),
+		i = cssPrefixes.length;
+
+	while ( i-- ) {
+		name = cssPrefixes[ i ] + capName;
+		if ( name in emptyStyle ) {
+			return name;
+		}
+	}
+}
+
+// Return a potentially-mapped jQuery.cssProps or vendor prefixed property
+function finalPropName( name ) {
+	var final = jQuery.cssProps[ name ] || vendorProps[ name ];
+
+	if ( final ) {
+		return final;
+	}
+	if ( name in emptyStyle ) {
+		return name;
+	}
+	return vendorProps[ name ] = vendorPropName( name ) || name;
+}
+
+
+var
+
+	// Swappable if display is none or starts with table
+	// except "table", "table-cell", or "table-caption"
+	// See here for display values: https://developer.mozilla.org/en-US/docs/CSS/display
+	rdisplayswap = /^(none|table(?!-c[ea]).+)/,
+	rcustomProp = /^--/,
+	cssShow = { position: "absolute", visibility: "hidden", display: "block" },
+	cssNormalTransform = {
+		letterSpacing: "0",
+		fontWeight: "400"
+	};
+
+function setPositiveNumber( elem, value, subtract ) {
+
+	// Any relative (+/-) values have already been
+	// normalized at this point
+	var matches = rcssNum.exec( value );
+	return matches ?
+
+		// Guard against undefined "subtract", e.g., when used as in cssHooks
+		Math.max( 0, matches[ 2 ] - ( subtract || 0 ) ) + ( matches[ 3 ] || "px" ) :
+		value;
+}
+
+function boxModelAdjustment( elem, dimension, box, isBorderBox, styles, computedVal ) {
+	var i = dimension === "width" ? 1 : 0,
+		extra = 0,
+		delta = 0;
+
+	// Adjustment may not be necessary
+	if ( box === ( isBorderBox ? "border" : "content" ) ) {
+		return 0;
+	}
+
+	for ( ; i < 4; i += 2 ) {
+
+		// Both box models exclude margin
+		if ( box === "margin" ) {
+			delta += jQuery.css( elem, box + cssExpand[ i ], true, styles );
+		}
+
+		// If we get here with a content-box, we're seeking "padding" or "border" or "margin"
+		if ( !isBorderBox ) {
+
+			// Add padding
+			delta += jQuery.css( elem, "padding" + cssExpand[ i ], true, styles );
+
+			// For "border" or "margin", add border
+			if ( box !== "padding" ) {
+				delta += jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles );
+
+			// But still keep track of it otherwise
+			} else {
+				extra += jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles );
+			}
+
+		// If we get here with a border-box (content + padding + border), we're seeking "content" or
+		// "padding" or "margin"
+		} else {
+
+			// For "content", subtract padding
+			if ( box === "content" ) {
+				delta -= jQuery.css( elem, "padding" + cssExpand[ i ], true, styles );
+			}
+
+			// For "content" or "padding", subtract border
+			if ( box !== "margin" ) {
+				delta -= jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles );
+			}
+		}
+	}
+
+	// Account for positive content-box scroll gutter when requested by providing computedVal
+	if ( !isBorderBox && computedVal >= 0 ) {
+
+		// offsetWidth/offsetHeight is a rounded sum of content, padding, scroll gutter, and border
+		// Assuming integer scroll gutter, subtract the rest and round down
+		delta += Math.max( 0, Math.ceil(
+			elem[ "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] -
+			computedVal -
+			delta -
+			extra -
+			0.5
+
+		// If offsetWidth/offsetHeight is unknown, then we can't determine content-box scroll gutter
+		// Use an explicit zero to avoid NaN (gh-3964)
+		) ) || 0;
+	}
+
+	return delta;
+}
+
+function getWidthOrHeight( elem, dimension, extra ) {
+
+	// Start with computed style
+	var styles = getStyles( elem ),
+
+		// To avoid forcing a reflow, only fetch boxSizing if we need it (gh-4322).
+		// Fake content-box until we know it's needed to know the true value.
+		boxSizingNeeded = !support.boxSizingReliable() || extra,
+		isBorderBox = boxSizingNeeded &&
+			jQuery.css( elem, "boxSizing", false, styles ) === "border-box",
+		valueIsBorderBox = isBorderBox,
+
+		val = curCSS( elem, dimension, styles ),
+		offsetProp = "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 );
+
+	// Support: Firefox <=54
+	// Return a confounding non-pixel value or feign ignorance, as appropriate.
+	if ( rnumnonpx.test( val ) ) {
+		if ( !extra ) {
+			return val;
+		}
+		val = "auto";
+	}
+
+
+	// Fall back to offsetWidth/offsetHeight when value is "auto"
+	// This happens for inline elements with no explicit setting (gh-3571)
+	// Support: Android <=4.1 - 4.3 only
+	// Also use offsetWidth/offsetHeight for misreported inline dimensions (gh-3602)
+	// Support: IE 9-11 only
+	// Also use offsetWidth/offsetHeight for when box sizing is unreliable
+	// We use getClientRects() to check for hidden/disconnected.
+	// In those cases, the computed value can be trusted to be border-box
+	if ( ( !support.boxSizingReliable() && isBorderBox ||
+		val === "auto" ||
+		!parseFloat( val ) && jQuery.css( elem, "display", false, styles ) === "inline" ) &&
+		elem.getClientRects().length ) {
+
+		isBorderBox = jQuery.css( elem, "boxSizing", false, styles ) === "border-box";
+
+		// Where available, offsetWidth/offsetHeight approximate border box dimensions.
+		// Where not available (e.g., SVG), assume unreliable box-sizing and interpret the
+		// retrieved value as a content box dimension.
+		valueIsBorderBox = offsetProp in elem;
+		if ( valueIsBorderBox ) {
+			val = elem[ offsetProp ];
+		}
+	}
+
+	// Normalize "" and auto
+	val = parseFloat( val ) || 0;
+
+	// Adjust for the element's box model
+	return ( val +
+		boxModelAdjustment(
+			elem,
+			dimension,
+			extra || ( isBorderBox ? "border" : "content" ),
+			valueIsBorderBox,
+			styles,
+
+			// Provide the current computed size to request scroll gutter calculation (gh-3589)
+			val
+		)
+	) + "px";
+}
+
+jQuery.extend( {
+
+	// Add in style property hooks for overriding the default
+	// behavior of getting and setting a style property
+	cssHooks: {
+		opacity: {
+			get: function( elem, computed ) {
+				if ( computed ) {
+
+					// We should always get a number back from opacity
+					var ret = curCSS( elem, "opacity" );
+					return ret === "" ? "1" : ret;
+				}
+			}
+		}
+	},
+
+	// Don't automatically add "px" to these possibly-unitless properties
+	cssNumber: {
+		"animationIterationCount": true,
+		"columnCount": true,
+		"fillOpacity": true,
+		"flexGrow": true,
+		"flexShrink": true,
+		"fontWeight": true,
+		"gridArea": true,
+		"gridColumn": true,
+		"gridColumnEnd": true,
+		"gridColumnStart": true,
+		"gridRow": true,
+		"gridRowEnd": true,
+		"gridRowStart": true,
+		"lineHeight": true,
+		"opacity": true,
+		"order": true,
+		"orphans": true,
+		"widows": true,
+		"zIndex": true,
+		"zoom": true
+	},
+
+	// Add in properties whose names you wish to fix before
+	// setting or getting the value
+	cssProps: {},
+
+	// Get and set the style property on a DOM Node
+	style: function( elem, name, value, extra ) {
+
+		// Don't set styles on text and comment nodes
+		if ( !elem || elem.nodeType === 3 || elem.nodeType === 8 || !elem.style ) {
+			return;
+		}
+
+		// Make sure that we're working with the right name
+		var ret, type, hooks,
+			origName = camelCase( name ),
+			isCustomProp = rcustomProp.test( name ),
+			style = elem.style;
+
+		// Make sure that we're working with the right name. We don't
+		// want to query the value if it is a CSS custom property
+		// since they are user-defined.
+		if ( !isCustomProp ) {
+			name = finalPropName( origName );
+		}
+
+		// Gets hook for the prefixed version, then unprefixed version
+		hooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ];
+
+		// Check if we're setting a value
+		if ( value !== undefined ) {
+			type = typeof value;
+
+			// Convert "+=" or "-=" to relative numbers (#7345)
+			if ( type === "string" && ( ret = rcssNum.exec( value ) ) && ret[ 1 ] ) {
+				value = adjustCSS( elem, name, ret );
+
+				// Fixes bug #9237
+				type = "number";
+			}
+
+			// Make sure that null and NaN values aren't set (#7116)
+			if ( value == null || value !== value ) {
+				return;
+			}
+
+			// If a number was passed in, add the unit (except for certain CSS properties)
+			// The isCustomProp check can be removed in jQuery 4.0 when we only auto-append
+			// "px" to a few hardcoded values.
+			if ( type === "number" && !isCustomProp ) {
+				value += ret && ret[ 3 ] || ( jQuery.cssNumber[ origName ] ? "" : "px" );
+			}
+
+			// background-* props affect original clone's values
+			if ( !support.clearCloneStyle && value === "" && name.indexOf( "background" ) === 0 ) {
+				style[ name ] = "inherit";
+			}
+
+			// If a hook was provided, use that value, otherwise just set the specified value
+			if ( !hooks || !( "set" in hooks ) ||
+				( value = hooks.set( elem, value, extra ) ) !== undefined ) {
+
+				if ( isCustomProp ) {
+					style.setProperty( name, value );
+				} else {
+					style[ name ] = value;
+				}
+			}
+
+		} else {
+
+			// If a hook was provided get the non-computed value from there
+			if ( hooks && "get" in hooks &&
+				( ret = hooks.get( elem, false, extra ) ) !== undefined ) {
+
+				return ret;
+			}
+
+			// Otherwise just get the value from the style object
+			return style[ name ];
+		}
+	},
+
+	css: function( elem, name, extra, styles ) {
+		var val, num, hooks,
+			origName = camelCase( name ),
+			isCustomProp = rcustomProp.test( name );
+
+		// Make sure that we're working with the right name. We don't
+		// want to modify the value if it is a CSS custom property
+		// since they are user-defined.
+		if ( !isCustomProp ) {
+			name = finalPropName( origName );
+		}
+
+		// Try prefixed name followed by the unprefixed name
+		hooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ];
+
+		// If a hook was provided get the computed value from there
+		if ( hooks && "get" in hooks ) {
+			val = hooks.get( elem, true, extra );
+		}
+
+		// Otherwise, if a way to get the computed value exists, use that
+		if ( val === undefined ) {
+			val = curCSS( elem, name, styles );
+		}
+
+		// Convert "normal" to computed value
+		if ( val === "normal" && name in cssNormalTransform ) {
+			val = cssNormalTransform[ name ];
+		}
+
+		// Make numeric if forced or a qualifier was provided and val looks numeric
+		if ( extra === "" || extra ) {
+			num = parseFloat( val );
+			return extra === true || isFinite( num ) ? num || 0 : val;
+		}
+
+		return val;
+	}
+} );
+
+jQuery.each( [ "height", "width" ], function( i, dimension ) {
+	jQuery.cssHooks[ dimension ] = {
+		get: function( elem, computed, extra ) {
+			if ( computed ) {
+
+				// Certain elements can have dimension info if we invisibly show them
+				// but it must have a current display style that would benefit
+				return rdisplayswap.test( jQuery.css( elem, "display" ) ) &&
+
+					// Support: Safari 8+
+					// Table columns in Safari have non-zero offsetWidth & zero
+					// getBoundingClientRect().width unless display is changed.
+					// Support: IE <=11 only
+					// Running getBoundingClientRect on a disconnected node
+					// in IE throws an error.
+					( !elem.getClientRects().length || !elem.getBoundingClientRect().width ) ?
+						swap( elem, cssShow, function() {
+							return getWidthOrHeight( elem, dimension, extra );
+						} ) :
+						getWidthOrHeight( elem, dimension, extra );
+			}
+		},
+
+		set: function( elem, value, extra ) {
+			var matches,
+				styles = getStyles( elem ),
+
+				// Only read styles.position if the test has a chance to fail
+				// to avoid forcing a reflow.
+				scrollboxSizeBuggy = !support.scrollboxSize() &&
+					styles.position === "absolute",
+
+				// To avoid forcing a reflow, only fetch boxSizing if we need it (gh-3991)
+				boxSizingNeeded = scrollboxSizeBuggy || extra,
+				isBorderBox = boxSizingNeeded &&
+					jQuery.css( elem, "boxSizing", false, styles ) === "border-box",
+				subtract = extra ?
+					boxModelAdjustment(
+						elem,
+						dimension,
+						extra,
+						isBorderBox,
+						styles
+					) :
+					0;
+
+			// Account for unreliable border-box dimensions by comparing offset* to computed and
+			// faking a content-box to get border and padding (gh-3699)
+			if ( isBorderBox && scrollboxSizeBuggy ) {
+				subtract -= Math.ceil(
+					elem[ "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] -
+					parseFloat( styles[ dimension ] ) -
+					boxModelAdjustment( elem, dimension, "border", false, styles ) -
+					0.5
+				);
+			}
+
+			// Convert to pixels if value adjustment is needed
+			if ( subtract && ( matches = rcssNum.exec( value ) ) &&
+				( matches[ 3 ] || "px" ) !== "px" ) {
+
+				elem.style[ dimension ] = value;
+				value = jQuery.css( elem, dimension );
+			}
+
+			return setPositiveNumber( elem, value, subtract );
+		}
+	};
+} );
+
+jQuery.cssHooks.marginLeft = addGetHookIf( support.reliableMarginLeft,
+	function( elem, computed ) {
+		if ( computed ) {
+			return ( parseFloat( curCSS( elem, "marginLeft" ) ) ||
+				elem.getBoundingClientRect().left -
+					swap( elem, { marginLeft: 0 }, function() {
+						return elem.getBoundingClientRect().left;
+					} )
+				) + "px";
+		}
+	}
+);
+
+// These hooks are used by animate to expand properties
+jQuery.each( {
+	margin: "",
+	padding: "",
+	border: "Width"
+}, function( prefix, suffix ) {
+	jQuery.cssHooks[ prefix + suffix ] = {
+		expand: function( value ) {
+			var i = 0,
+				expanded = {},
+
+				// Assumes a single number if not a string
+				parts = typeof value === "string" ? value.split( " " ) : [ value ];
+
+			for ( ; i < 4; i++ ) {
+				expanded[ prefix + cssExpand[ i ] + suffix ] =
+					parts[ i ] || parts[ i - 2 ] || parts[ 0 ];
+			}
+
+			return expanded;
+		}
+	};
+
+	if ( prefix !== "margin" ) {
+		jQuery.cssHooks[ prefix + suffix ].set = setPositiveNumber;
+	}
+} );
+
+jQuery.fn.extend( {
+	css: function( name, value ) {
+		return access( this, function( elem, name, value ) {
+			var styles, len,
+				map = {},
+				i = 0;
+
+			if ( Array.isArray( name ) ) {
+				styles = getStyles( elem );
+				len = name.length;
+
+				for ( ; i < len; i++ ) {
+					map[ name[ i ] ] = jQuery.css( elem, name[ i ], false, styles );
+				}
+
+				return map;
+			}
+
+			return value !== undefined ?
+				jQuery.style( elem, name, value ) :
+				jQuery.css( elem, name );
+		}, name, value, arguments.length > 1 );
+	}
+} );
+
+
+function Tween( elem, options, prop, end, easing ) {
+	return new Tween.prototype.init( elem, options, prop, end, easing );
+}
+jQuery.Tween = Tween;
+
+Tween.prototype = {
+	constructor: Tween,
+	init: function( elem, options, prop, end, easing, unit ) {
+		this.elem = elem;
+		this.prop = prop;
+		this.easing = easing || jQuery.easing._default;
+		this.options = options;
+		this.start = this.now = this.cur();
+		this.end = end;
+		this.unit = unit || ( jQuery.cssNumber[ prop ] ? "" : "px" );
+	},
+	cur: function() {
+		var hooks = Tween.propHooks[ this.prop ];
+
+		return hooks && hooks.get ?
+			hooks.get( this ) :
+			Tween.propHooks._default.get( this );
+	},
+	run: function( percent ) {
+		var eased,
+			hooks = Tween.propHooks[ this.prop ];
+
+		if ( this.options.duration ) {
+			this.pos = eased = jQuery.easing[ this.easing ](
+				percent, this.options.duration * percent, 0, 1, this.options.duration
+			);
+		} else {
+			this.pos = eased = percent;
+		}
+		this.now = ( this.end - this.start ) * eased + this.start;
+
+		if ( this.options.step ) {
+			this.options.step.call( this.elem, this.now, this );
+		}
+
+		if ( hooks && hooks.set ) {
+			hooks.set( this );
+		} else {
+			Tween.propHooks._default.set( this );
+		}
+		return this;
+	}
+};
+
+Tween.prototype.init.prototype = Tween.prototype;
+
+Tween.propHooks = {
+	_default: {
+		get: function( tween ) {
+			var result;
+
+			// Use a property on the element directly when it is not a DOM element,
+			// or when there is no matching style property that exists.
+			if ( tween.elem.nodeType !== 1 ||
+				tween.elem[ tween.prop ] != null && tween.elem.style[ tween.prop ] == null ) {
+				return tween.elem[ tween.prop ];
+			}
+
+			// Passing an empty string as a 3rd parameter to .css will automatically
+			// attempt a parseFloat and fallback to a string if the parse fails.
+			// Simple values such as "10px" are parsed to Float;
+			// complex values such as "rotate(1rad)" are returned as-is.
+			result = jQuery.css( tween.elem, tween.prop, "" );
+
+			// Empty strings, null, undefined and "auto" are converted to 0.
+			return !result || result === "auto" ? 0 : result;
+		},
+		set: function( tween ) {
+
+			// Use step hook for back compat.
+			// Use cssHook if its there.
+			// Use .style if available and use plain properties where available.
+			if ( jQuery.fx.step[ tween.prop ] ) {
+				jQuery.fx.step[ tween.prop ]( tween );
+			} else if ( tween.elem.nodeType === 1 && (
+					jQuery.cssHooks[ tween.prop ] ||
+					tween.elem.style[ finalPropName( tween.prop ) ] != null ) ) {
+				jQuery.style( tween.elem, tween.prop, tween.now + tween.unit );
+			} else {
+				tween.elem[ tween.prop ] = tween.now;
+			}
+		}
+	}
+};
+
+// Support: IE <=9 only
+// Panic based approach to setting things on disconnected nodes
+Tween.propHooks.scrollTop = Tween.propHooks.scrollLeft = {
+	set: function( tween ) {
+		if ( tween.elem.nodeType && tween.elem.parentNode ) {
+			tween.elem[ tween.prop ] = tween.now;
+		}
+	}
+};
+
+jQuery.easing = {
+	linear: function( p ) {
+		return p;
+	},
+	swing: function( p ) {
+		return 0.5 - Math.cos( p * Math.PI ) / 2;
+	},
+	_default: "swing"
+};
+
+jQuery.fx = Tween.prototype.init;
+
+// Back compat <1.8 extension point
+jQuery.fx.step = {};
+
+
+
+
+var
+	fxNow, inProgress,
+	rfxtypes = /^(?:toggle|show|hide)$/,
+	rrun = /queueHooks$/;
+
+function schedule() {
+	if ( inProgress ) {
+		if ( document.hidden === false && window.requestAnimationFrame ) {
+			window.requestAnimationFrame( schedule );
+		} else {
+			window.setTimeout( schedule, jQuery.fx.interval );
+		}
+
+		jQuery.fx.tick();
+	}
+}
+
+// Animations created synchronously will run synchronously
+function createFxNow() {
+	window.setTimeout( function() {
+		fxNow = undefined;
+	} );
+	return ( fxNow = Date.now() );
+}
+
+// Generate parameters to create a standard animation
+function genFx( type, includeWidth ) {
+	var which,
+		i = 0,
+		attrs = { height: type };
+
+	// If we include width, step value is 1 to do all cssExpand values,
+	// otherwise step value is 2 to skip over Left and Right
+	includeWidth = includeWidth ? 1 : 0;
+	for ( ; i < 4; i += 2 - includeWidth ) {
+		which = cssExpand[ i ];
+		attrs[ "margin" + which ] = attrs[ "padding" + which ] = type;
+	}
+
+	if ( includeWidth ) {
+		attrs.opacity = attrs.width = type;
+	}
+
+	return attrs;
+}
+
+function createTween( value, prop, animation ) {
+	var tween,
+		collection = ( Animation.tweeners[ prop ] || [] ).concat( Animation.tweeners[ "*" ] ),
+		index = 0,
+		length = collection.length;
+	for ( ; index < length; index++ ) {
+		if ( ( tween = collection[ index ].call( animation, prop, value ) ) ) {
+
+			// We're done with this property
+			return tween;
+		}
+	}
+}
+
+function defaultPrefilter( elem, props, opts ) {
+	var prop, value, toggle, hooks, oldfire, propTween, restoreDisplay, display,
+		isBox = "width" in props || "height" in props,
+		anim = this,
+		orig = {},
+		style = elem.style,
+		hidden = elem.nodeType && isHiddenWithinTree( elem ),
+		dataShow = dataPriv.get( elem, "fxshow" );
+
+	// Queue-skipping animations hijack the fx hooks
+	if ( !opts.queue ) {
+		hooks = jQuery._queueHooks( elem, "fx" );
+		if ( hooks.unqueued == null ) {
+			hooks.unqueued = 0;
+			oldfire = hooks.empty.fire;
+			hooks.empty.fire = function() {
+				if ( !hooks.unqueued ) {
+					oldfire();
+				}
+			};
+		}
+		hooks.unqueued++;
+
+		anim.always( function() {
+
+			// Ensure the complete handler is called before this completes
+			anim.always( function() {
+				hooks.unqueued--;
+				if ( !jQuery.queue( elem, "fx" ).length ) {
+					hooks.empty.fire();
+				}
+			} );
+		} );
+	}
+
+	// Detect show/hide animations
+	for ( prop in props ) {
+		value = props[ prop ];
+		if ( rfxtypes.test( value ) ) {
+			delete props[ prop ];
+			toggle = toggle || value === "toggle";
+			if ( value === ( hidden ? "hide" : "show" ) ) {
+
+				// Pretend to be hidden if this is a "show" and
+				// there is still data from a stopped show/hide
+				if ( value === "show" && dataShow && dataShow[ prop ] !== undefined ) {
+					hidden = true;
+
+				// Ignore all other no-op show/hide data
+				} else {
+					continue;
+				}
+			}
+			orig[ prop ] = dataShow && dataShow[ prop ] || jQuery.style( elem, prop );
+		}
+	}
+
+	// Bail out if this is a no-op like .hide().hide()
+	propTween = !jQuery.isEmptyObject( props );
+	if ( !propTween && jQuery.isEmptyObject( orig ) ) {
+		return;
+	}
+
+	// Restrict "overflow" and "display" styles during box animations
+	if ( isBox && elem.nodeType === 1 ) {
+
+		// Support: IE <=9 - 11, Edge 12 - 15
+		// Record all 3 overflow attributes because IE does not infer the shorthand
+		// from identically-valued overflowX and overflowY and Edge just mirrors
+		// the overflowX value there.
+		opts.overflow = [ style.overflow, style.overflowX, style.overflowY ];
+
+		// Identify a display type, preferring old show/hide data over the CSS cascade
+		restoreDisplay = dataShow && dataShow.display;
+		if ( restoreDisplay == null ) {
+			restoreDisplay = dataPriv.get( elem, "display" );
+		}
+		display = jQuery.css( elem, "display" );
+		if ( display === "none" ) {
+			if ( restoreDisplay ) {
+				display = restoreDisplay;
+			} else {
+
+				// Get nonempty value(s) by temporarily forcing visibility
+				showHide( [ elem ], true );
+				restoreDisplay = elem.style.display || restoreDisplay;
+				display = jQuery.css( elem, "display" );
+				showHide( [ elem ] );
+			}
+		}
+
+		// Animate inline elements as inline-block
+		if ( display === "inline" || display === "inline-block" && restoreDisplay != null ) {
+			if ( jQuery.css( elem, "float" ) === "none" ) {
+
+				// Restore the original display value at the end of pure show/hide animations
+				if ( !propTween ) {
+					anim.done( function() {
+						style.display = restoreDisplay;
+					} );
+					if ( restoreDisplay == null ) {
+						display = style.display;
+						restoreDisplay = display === "none" ? "" : display;
+					}
+				}
+				style.display = "inline-block";
+			}
+		}
+	}
+
+	if ( opts.overflow ) {
+		style.overflow = "hidden";
+		anim.always( function() {
+			style.overflow = opts.overflow[ 0 ];
+			style.overflowX = opts.overflow[ 1 ];
+			style.overflowY = opts.overflow[ 2 ];
+		} );
+	}
+
+	// Implement show/hide animations
+	propTween = false;
+	for ( prop in orig ) {
+
+		// General show/hide setup for this element animation
+		if ( !propTween ) {
+			if ( dataShow ) {
+				if ( "hidden" in dataShow ) {
+					hidden = dataShow.hidden;
+				}
+			} else {
+				dataShow = dataPriv.access( elem, "fxshow", { display: restoreDisplay } );
+			}
+
+			// Store hidden/visible for toggle so `.stop().toggle()` "reverses"
+			if ( toggle ) {
+				dataShow.hidden = !hidden;
+			}
+
+			// Show elements before animating them
+			if ( hidden ) {
+				showHide( [ elem ], true );
+			}
+
+			/* eslint-disable no-loop-func */
+
+			anim.done( function() {
+
+			/* eslint-enable no-loop-func */
+
+				// The final step of a "hide" animation is actually hiding the element
+				if ( !hidden ) {
+					showHide( [ elem ] );
+				}
+				dataPriv.remove( elem, "fxshow" );
+				for ( prop in orig ) {
+					jQuery.style( elem, prop, orig[ prop ] );
+				}
+			} );
+		}
+
+		// Per-property setup
+		propTween = createTween( hidden ? dataShow[ prop ] : 0, prop, anim );
+		if ( !( prop in dataShow ) ) {
+			dataShow[ prop ] = propTween.start;
+			if ( hidden ) {
+				propTween.end = propTween.start;
+				propTween.start = 0;
+			}
+		}
+	}
+}
+
+function propFilter( props, specialEasing ) {
+	var index, name, easing, value, hooks;
+
+	// camelCase, specialEasing and expand cssHook pass
+	for ( index in props ) {
+		name = camelCase( index );
+		easing = specialEasing[ name ];
+		value = props[ index ];
+		if ( Array.isArray( value ) ) {
+			easing = value[ 1 ];
+			value = props[ index ] = value[ 0 ];
+		}
+
+		if ( index !== name ) {
+			props[ name ] = value;
+			delete props[ index ];
+		}
+
+		hooks = jQuery.cssHooks[ name ];
+		if ( hooks && "expand" in hooks ) {
+			value = hooks.expand( value );
+			delete props[ name ];
+
+			// Not quite $.extend, this won't overwrite existing keys.
+			// Reusing 'index' because we have the correct "name"
+			for ( index in value ) {
+				if ( !( index in props ) ) {
+					props[ index ] = value[ index ];
+					specialEasing[ index ] = easing;
+				}
+			}
+		} else {
+			specialEasing[ name ] = easing;
+		}
+	}
+}
+
+function Animation( elem, properties, options ) {
+	var result,
+		stopped,
+		index = 0,
+		length = Animation.prefilters.length,
+		deferred = jQuery.Deferred().always( function() {
+
+			// Don't match elem in the :animated selector
+			delete tick.elem;
+		} ),
+		tick = function() {
+			if ( stopped ) {
+				return false;
+			}
+			var currentTime = fxNow || createFxNow(),
+				remaining = Math.max( 0, animation.startTime + animation.duration - currentTime ),
+
+				// Support: Android 2.3 only
+				// Archaic crash bug won't allow us to use `1 - ( 0.5 || 0 )` (#12497)
+				temp = remaining / animation.duration || 0,
+				percent = 1 - temp,
+				index = 0,
+				length = animation.tweens.length;
+
+			for ( ; index < length; index++ ) {
+				animation.tweens[ index ].run( percent );
+			}
+
+			deferred.notifyWith( elem, [ animation, percent, remaining ] );
+
+			// If there's more to do, yield
+			if ( percent < 1 && length ) {
+				return remaining;
+			}
+
+			// If this was an empty animation, synthesize a final progress notification
+			if ( !length ) {
+				deferred.notifyWith( elem, [ animation, 1, 0 ] );
+			}
+
+			// Resolve the animation and report its conclusion
+			deferred.resolveWith( elem, [ animation ] );
+			return false;
+		},
+		animation = deferred.promise( {
+			elem: elem,
+			props: jQuery.extend( {}, properties ),
+			opts: jQuery.extend( true, {
+				specialEasing: {},
+				easing: jQuery.easing._default
+			}, options ),
+			originalProperties: properties,
+			originalOptions: options,
+			startTime: fxNow || createFxNow(),
+			duration: options.duration,
+			tweens: [],
+			createTween: function( prop, end ) {
+				var tween = jQuery.Tween( elem, animation.opts, prop, end,
+						animation.opts.specialEasing[ prop ] || animation.opts.easing );
+				animation.tweens.push( tween );
+				return tween;
+			},
+			stop: function( gotoEnd ) {
+				var index = 0,
+
+					// If we are going to the end, we want to run all the tweens
+					// otherwise we skip this part
+					length = gotoEnd ? animation.tweens.length : 0;
+				if ( stopped ) {
+					return this;
+				}
+				stopped = true;
+				for ( ; index < length; index++ ) {
+					animation.tweens[ index ].run( 1 );
+				}
+
+				// Resolve when we played the last frame; otherwise, reject
+				if ( gotoEnd ) {
+					deferred.notifyWith( elem, [ animation, 1, 0 ] );
+					deferred.resolveWith( elem, [ animation, gotoEnd ] );
+				} else {
+					deferred.rejectWith( elem, [ animation, gotoEnd ] );
+				}
+				return this;
+			}
+		} ),
+		props = animation.props;
+
+	propFilter( props, animation.opts.specialEasing );
+
+	for ( ; index < length; index++ ) {
+		result = Animation.prefilters[ index ].call( animation, elem, props, animation.opts );
+		if ( result ) {
+			if ( isFunction( result.stop ) ) {
+				jQuery._queueHooks( animation.elem, animation.opts.queue ).stop =
+					result.stop.bind( result );
+			}
+			return result;
+		}
+	}
+
+	jQuery.map( props, createTween, animation );
+
+	if ( isFunction( animation.opts.start ) ) {
+		animation.opts.start.call( elem, animation );
+	}
+
+	// Attach callbacks from options
+	animation
+		.progress( animation.opts.progress )
+		.done( animation.opts.done, animation.opts.complete )
+		.fail( animation.opts.fail )
+		.always( animation.opts.always );
+
+	jQuery.fx.timer(
+		jQuery.extend( tick, {
+			elem: elem,
+			anim: animation,
+			queue: animation.opts.queue
+		} )
+	);
+
+	return animation;
+}
+
+jQuery.Animation = jQuery.extend( Animation, {
+
+	tweeners: {
+		"*": [ function( prop, value ) {
+			var tween = this.createTween( prop, value );
+			adjustCSS( tween.elem, prop, rcssNum.exec( value ), tween );
+			return tween;
+		} ]
+	},
+
+	tweener: function( props, callback ) {
+		if ( isFunction( props ) ) {
+			callback = props;
+			props = [ "*" ];
+		} else {
+			props = props.match( rnothtmlwhite );
+		}
+
+		var prop,
+			index = 0,
+			length = props.length;
+
+		for ( ; index < length; index++ ) {
+			prop = props[ index ];
+			Animation.tweeners[ prop ] = Animation.tweeners[ prop ] || [];
+			Animation.tweeners[ prop ].unshift( callback );
+		}
+	},
+
+	prefilters: [ defaultPrefilter ],
+
+	prefilter: function( callback, prepend ) {
+		if ( prepend ) {
+			Animation.prefilters.unshift( callback );
+		} else {
+			Animation.prefilters.push( callback );
+		}
+	}
+} );
+
+jQuery.speed = function( speed, easing, fn ) {
+	var opt = speed && typeof speed === "object" ? jQuery.extend( {}, speed ) : {
+		complete: fn || !fn && easing ||
+			isFunction( speed ) && speed,
+		duration: speed,
+		easing: fn && easing || easing && !isFunction( easing ) && easing
+	};
+
+	// Go to the end state if fx are off
+	if ( jQuery.fx.off ) {
+		opt.duration = 0;
+
+	} else {
+		if ( typeof opt.duration !== "number" ) {
+			if ( opt.duration in jQuery.fx.speeds ) {
+				opt.duration = jQuery.fx.speeds[ opt.duration ];
+
+			} else {
+				opt.duration = jQuery.fx.speeds._default;
+			}
+		}
+	}
+
+	// Normalize opt.queue - true/undefined/null -> "fx"
+	if ( opt.queue == null || opt.queue === true ) {
+		opt.queue = "fx";
+	}
+
+	// Queueing
+	opt.old = opt.complete;
+
+	opt.complete = function() {
+		if ( isFunction( opt.old ) ) {
+			opt.old.call( this );
+		}
+
+		if ( opt.queue ) {
+			jQuery.dequeue( this, opt.queue );
+		}
+	};
+
+	return opt;
+};
+
+jQuery.fn.extend( {
+	fadeTo: function( speed, to, easing, callback ) {
+
+		// Show any hidden elements after setting opacity to 0
+		return this.filter( isHiddenWithinTree ).css( "opacity", 0 ).show()
+
+			// Animate to the value specified
+			.end().animate( { opacity: to }, speed, easing, callback );
+	},
+	animate: function( prop, speed, easing, callback ) {
+		var empty = jQuery.isEmptyObject( prop ),
+			optall = jQuery.speed( speed, easing, callback ),
+			doAnimation = function() {
+
+				// Operate on a copy of prop so per-property easing won't be lost
+				var anim = Animation( this, jQuery.extend( {}, prop ), optall );
+
+				// Empty animations, or finishing resolves immediately
+				if ( empty || dataPriv.get( this, "finish" ) ) {
+					anim.stop( true );
+				}
+			};
+			doAnimation.finish = doAnimation;
+
+		return empty || optall.queue === false ?
+			this.each( doAnimation ) :
+			this.queue( optall.queue, doAnimation );
+	},
+	stop: function( type, clearQueue, gotoEnd ) {
+		var stopQueue = function( hooks ) {
+			var stop = hooks.stop;
+			delete hooks.stop;
+			stop( gotoEnd );
+		};
+
+		if ( typeof type !== "string" ) {
+			gotoEnd = clearQueue;
+			clearQueue = type;
+			type = undefined;
+		}
+		if ( clearQueue && type !== false ) {
+			this.queue( type || "fx", [] );
+		}
+
+		return this.each( function() {
+			var dequeue = true,
+				index = type != null && type + "queueHooks",
+				timers = jQuery.timers,
+				data = dataPriv.get( this );
+
+			if ( index ) {
+				if ( data[ index ] && data[ index ].stop ) {
+					stopQueue( data[ index ] );
+				}
+			} else {
+				for ( index in data ) {
+					if ( data[ index ] && data[ index ].stop && rrun.test( index ) ) {
+						stopQueue( data[ index ] );
+					}
+				}
+			}
+
+			for ( index = timers.length; index--; ) {
+				if ( timers[ index ].elem === this &&
+					( type == null || timers[ index ].queue === type ) ) {
+
+					timers[ index ].anim.stop( gotoEnd );
+					dequeue = false;
+					timers.splice( index, 1 );
+				}
+			}
+
+			// Start the next in the queue if the last step wasn't forced.
+			// Timers currently will call their complete callbacks, which
+			// will dequeue but only if they were gotoEnd.
+			if ( dequeue || !gotoEnd ) {
+				jQuery.dequeue( this, type );
+			}
+		} );
+	},
+	finish: function( type ) {
+		if ( type !== false ) {
+			type = type || "fx";
+		}
+		return this.each( function() {
+			var index,
+				data = dataPriv.get( this ),
+				queue = data[ type + "queue" ],
+				hooks = data[ type + "queueHooks" ],
+				timers = jQuery.timers,
+				length = queue ? queue.length : 0;
+
+			// Enable finishing flag on private data
+			data.finish = true;
+
+			// Empty the queue first
+			jQuery.queue( this, type, [] );
+
+			if ( hooks && hooks.stop ) {
+				hooks.stop.call( this, true );
+			}
+
+			// Look for any active animations, and finish them
+			for ( index = timers.length; index--; ) {
+				if ( timers[ index ].elem === this && timers[ index ].queue === type ) {
+					timers[ index ].anim.stop( true );
+					timers.splice( index, 1 );
+				}
+			}
+
+			// Look for any animations in the old queue and finish them
+			for ( index = 0; index < length; index++ ) {
+				if ( queue[ index ] && queue[ index ].finish ) {
+					queue[ index ].finish.call( this );
+				}
+			}
+
+			// Turn off finishing flag
+			delete data.finish;
+		} );
+	}
+} );
+
+jQuery.each( [ "toggle", "show", "hide" ], function( i, name ) {
+	var cssFn = jQuery.fn[ name ];
+	jQuery.fn[ name ] = function( speed, easing, callback ) {
+		return speed == null || typeof speed === "boolean" ?
+			cssFn.apply( this, arguments ) :
+			this.animate( genFx( name, true ), speed, easing, callback );
+	};
+} );
+
+// Generate shortcuts for custom animations
+jQuery.each( {
+	slideDown: genFx( "show" ),
+	slideUp: genFx( "hide" ),
+	slideToggle: genFx( "toggle" ),
+	fadeIn: { opacity: "show" },
+	fadeOut: { opacity: "hide" },
+	fadeToggle: { opacity: "toggle" }
+}, function( name, props ) {
+	jQuery.fn[ name ] = function( speed, easing, callback ) {
+		return this.animate( props, speed, easing, callback );
+	};
+} );
+
+jQuery.timers = [];
+jQuery.fx.tick = function() {
+	var timer,
+		i = 0,
+		timers = jQuery.timers;
+
+	fxNow = Date.now();
+
+	for ( ; i < timers.length; i++ ) {
+		timer = timers[ i ];
+
+		// Run the timer and safely remove it when done (allowing for external removal)
+		if ( !timer() && timers[ i ] === timer ) {
+			timers.splice( i--, 1 );
+		}
+	}
+
+	if ( !timers.length ) {
+		jQuery.fx.stop();
+	}
+	fxNow = undefined;
+};
+
+jQuery.fx.timer = function( timer ) {
+	jQuery.timers.push( timer );
+	jQuery.fx.start();
+};
+
+jQuery.fx.interval = 13;
+jQuery.fx.start = function() {
+	if ( inProgress ) {
+		return;
+	}
+
+	inProgress = true;
+	schedule();
+};
+
+jQuery.fx.stop = function() {
+	inProgress = null;
+};
+
+jQuery.fx.speeds = {
+	slow: 600,
+	fast: 200,
+
+	// Default speed
+	_default: 400
+};
+
+
+// Based off of the plugin by Clint Helfers, with permission.
+// https://web.archive.org/web/20100324014747/http://blindsignals.com/index.php/2009/07/jquery-delay/
+jQuery.fn.delay = function( time, type ) {
+	time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time;
+	type = type || "fx";
+
+	return this.queue( type, function( next, hooks ) {
+		var timeout = window.setTimeout( next, time );
+		hooks.stop = function() {
+			window.clearTimeout( timeout );
+		};
+	} );
+};
+
+
+( function() {
+	var input = document.createElement( "input" ),
+		select = document.createElement( "select" ),
+		opt = select.appendChild( document.createElement( "option" ) );
+
+	input.type = "checkbox";
+
+	// Support: Android <=4.3 only
+	// Default value for a checkbox should be "on"
+	support.checkOn = input.value !== "";
+
+	// Support: IE <=11 only
+	// Must access selectedIndex to make default options select
+	support.optSelected = opt.selected;
+
+	// Support: IE <=11 only
+	// An input loses its value after becoming a radio
+	input = document.createElement( "input" );
+	input.value = "t";
+	input.type = "radio";
+	support.radioValue = input.value === "t";
+} )();
+
+
+var boolHook,
+	attrHandle = jQuery.expr.attrHandle;
+
+jQuery.fn.extend( {
+	attr: function( name, value ) {
+		return access( this, jQuery.attr, name, value, arguments.length > 1 );
+	},
+
+	removeAttr: function( name ) {
+		return this.each( function() {
+			jQuery.removeAttr( this, name );
+		} );
+	}
+} );
+
+jQuery.extend( {
+	attr: function( elem, name, value ) {
+		var ret, hooks,
+			nType = elem.nodeType;
+
+		// Don't get/set attributes on text, comment and attribute nodes
+		if ( nType === 3 || nType === 8 || nType === 2 ) {
+			return;
+		}
+
+		// Fallback to prop when attributes are not supported
+		if ( typeof elem.getAttribute === "undefined" ) {
+			return jQuery.prop( elem, name, value );
+		}
+
+		// Attribute hooks are determined by the lowercase version
+		// Grab necessary hook if one is defined
+		if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {
+			hooks = jQuery.attrHooks[ name.toLowerCase() ] ||
+				( jQuery.expr.match.bool.test( name ) ? boolHook : undefined );
+		}
+
+		if ( value !== undefined ) {
+			if ( value === null ) {
+				jQuery.removeAttr( elem, name );
+				return;
+			}
+
+			if ( hooks && "set" in hooks &&
+				( ret = hooks.set( elem, value, name ) ) !== undefined ) {
+				return ret;
+			}
+
+			elem.setAttribute( name, value + "" );
+			return value;
+		}
+
+		if ( hooks && "get" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) {
+			return ret;
+		}
+
+		ret = jQuery.find.attr( elem, name );
+
+		// Non-existent attributes return null, we normalize to undefined
+		return ret == null ? undefined : ret;
+	},
+
+	attrHooks: {
+		type: {
+			set: function( elem, value ) {
+				if ( !support.radioValue && value === "radio" &&
+					nodeName( elem, "input" ) ) {
+					var val = elem.value;
+					elem.setAttribute( "type", value );
+					if ( val ) {
+						elem.value = val;
+					}
+					return value;
+				}
+			}
+		}
+	},
+
+	removeAttr: function( elem, value ) {
+		var name,
+			i = 0,
+
+			// Attribute names can contain non-HTML whitespace characters
+			// https://html.spec.whatwg.org/multipage/syntax.html#attributes-2
+			attrNames = value && value.match( rnothtmlwhite );
+
+		if ( attrNames && elem.nodeType === 1 ) {
+			while ( ( name = attrNames[ i++ ] ) ) {
+				elem.removeAttribute( name );
+			}
+		}
+	}
+} );
+
+// Hooks for boolean attributes
+boolHook = {
+	set: function( elem, value, name ) {
+		if ( value === false ) {
+
+			// Remove boolean attributes when set to false
+			jQuery.removeAttr( elem, name );
+		} else {
+			elem.setAttribute( name, name );
+		}
+		return name;
+	}
+};
+
+jQuery.each( jQuery.expr.match.bool.source.match( /\w+/g ), function( i, name ) {
+	var getter = attrHandle[ name ] || jQuery.find.attr;
+
+	attrHandle[ name ] = function( elem, name, isXML ) {
+		var ret, handle,
+			lowercaseName = name.toLowerCase();
+
+		if ( !isXML ) {
+
+			// Avoid an infinite loop by temporarily removing this function from the getter
+			handle = attrHandle[ lowercaseName ];
+			attrHandle[ lowercaseName ] = ret;
+			ret = getter( elem, name, isXML ) != null ?
+				lowercaseName :
+				null;
+			attrHandle[ lowercaseName ] = handle;
+		}
+		return ret;
+	};
+} );
+
+
+
+
+var rfocusable = /^(?:input|select|textarea|button)$/i,
+	rclickable = /^(?:a|area)$/i;
+
+jQuery.fn.extend( {
+	prop: function( name, value ) {
+		return access( this, jQuery.prop, name, value, arguments.length > 1 );
+	},
+
+	removeProp: function( name ) {
+		return this.each( function() {
+			delete this[ jQuery.propFix[ name ] || name ];
+		} );
+	}
+} );
+
+jQuery.extend( {
+	prop: function( elem, name, value ) {
+		var ret, hooks,
+			nType = elem.nodeType;
+
+		// Don't get/set properties on text, comment and attribute nodes
+		if ( nType === 3 || nType === 8 || nType === 2 ) {
+			return;
+		}
+
+		if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {
+
+			// Fix name and attach hooks
+			name = jQuery.propFix[ name ] || name;
+			hooks = jQuery.propHooks[ name ];
+		}
+
+		if ( value !== undefined ) {
+			if ( hooks && "set" in hooks &&
+				( ret = hooks.set( elem, value, name ) ) !== undefined ) {
+				return ret;
+			}
+
+			return ( elem[ name ] = value );
+		}
+
+		if ( hooks && "get" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) {
+			return ret;
+		}
+
+		return elem[ name ];
+	},
+
+	propHooks: {
+		tabIndex: {
+			get: function( elem ) {
+
+				// Support: IE <=9 - 11 only
+				// elem.tabIndex doesn't always return the
+				// correct value when it hasn't been explicitly set
+				// https://web.archive.org/web/20141116233347/http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/
+				// Use proper attribute retrieval(#12072)
+				var tabindex = jQuery.find.attr( elem, "tabindex" );
+
+				if ( tabindex ) {
+					return parseInt( tabindex, 10 );
+				}
+
+				if (
+					rfocusable.test( elem.nodeName ) ||
+					rclickable.test( elem.nodeName ) &&
+					elem.href
+				) {
+					return 0;
+				}
+
+				return -1;
+			}
+		}
+	},
+
+	propFix: {
+		"for": "htmlFor",
+		"class": "className"
+	}
+} );
+
+// Support: IE <=11 only
+// Accessing the selectedIndex property
+// forces the browser to respect setting selected
+// on the option
+// The getter ensures a default option is selected
+// when in an optgroup
+// eslint rule "no-unused-expressions" is disabled for this code
+// since it considers such accessions noop
+if ( !support.optSelected ) {
+	jQuery.propHooks.selected = {
+		get: function( elem ) {
+
+			/* eslint no-unused-expressions: "off" */
+
+			var parent = elem.parentNode;
+			if ( parent && parent.parentNode ) {
+				parent.parentNode.selectedIndex;
+			}
+			return null;
+		},
+		set: function( elem ) {
+
+			/* eslint no-unused-expressions: "off" */
+
+			var parent = elem.parentNode;
+			if ( parent ) {
+				parent.selectedIndex;
+
+				if ( parent.parentNode ) {
+					parent.parentNode.selectedIndex;
+				}
+			}
+		}
+	};
+}
+
+jQuery.each( [
+	"tabIndex",
+	"readOnly",
+	"maxLength",
+	"cellSpacing",
+	"cellPadding",
+	"rowSpan",
+	"colSpan",
+	"useMap",
+	"frameBorder",
+	"contentEditable"
+], function() {
+	jQuery.propFix[ this.toLowerCase() ] = this;
+} );
+
+
+
+
+	// Strip and collapse whitespace according to HTML spec
+	// https://infra.spec.whatwg.org/#strip-and-collapse-ascii-whitespace
+	function stripAndCollapse( value ) {
+		var tokens = value.match( rnothtmlwhite ) || [];
+		return tokens.join( " " );
+	}
+
+
+function getClass( elem ) {
+	return elem.getAttribute && elem.getAttribute( "class" ) || "";
+}
+
+function classesToArray( value ) {
+	if ( Array.isArray( value ) ) {
+		return value;
+	}
+	if ( typeof value === "string" ) {
+		return value.match( rnothtmlwhite ) || [];
+	}
+	return [];
+}
+
+jQuery.fn.extend( {
+	addClass: function( value ) {
+		var classes, elem, cur, curValue, clazz, j, finalValue,
+			i = 0;
+
+		if ( isFunction( value ) ) {
+			return this.each( function( j ) {
+				jQuery( this ).addClass( value.call( this, j, getClass( this ) ) );
+			} );
+		}
+
+		classes = classesToArray( value );
+
+		if ( classes.length ) {
+			while ( ( elem = this[ i++ ] ) ) {
+				curValue = getClass( elem );
+				cur = elem.nodeType === 1 && ( " " + stripAndCollapse( curValue ) + " " );
+
+				if ( cur ) {
+					j = 0;
+					while ( ( clazz = classes[ j++ ] ) ) {
+						if ( cur.indexOf( " " + clazz + " " ) < 0 ) {
+							cur += clazz + " ";
+						}
+					}
+
+					// Only assign if different to avoid unneeded rendering.
+					finalValue = stripAndCollapse( cur );
+					if ( curValue !== finalValue ) {
+						elem.setAttribute( "class", finalValue );
+					}
+				}
+			}
+		}
+
+		return this;
+	},
+
+	removeClass: function( value ) {
+		var classes, elem, cur, curValue, clazz, j, finalValue,
+			i = 0;
+
+		if ( isFunction( value ) ) {
+			return this.each( function( j ) {
+				jQuery( this ).removeClass( value.call( this, j, getClass( this ) ) );
+			} );
+		}
+
+		if ( !arguments.length ) {
+			return this.attr( "class", "" );
+		}
+
+		classes = classesToArray( value );
+
+		if ( classes.length ) {
+			while ( ( elem = this[ i++ ] ) ) {
+				curValue = getClass( elem );
+
+				// This expression is here for better compressibility (see addClass)
+				cur = elem.nodeType === 1 && ( " " + stripAndCollapse( curValue ) + " " );
+
+				if ( cur ) {
+					j = 0;
+					while ( ( clazz = classes[ j++ ] ) ) {
+
+						// Remove *all* instances
+						while ( cur.indexOf( " " + clazz + " " ) > -1 ) {
+							cur = cur.replace( " " + clazz + " ", " " );
+						}
+					}
+
+					// Only assign if different to avoid unneeded rendering.
+					finalValue = stripAndCollapse( cur );
+					if ( curValue !== finalValue ) {
+						elem.setAttribute( "class", finalValue );
+					}
+				}
+			}
+		}
+
+		return this;
+	},
+
+	toggleClass: function( value, stateVal ) {
+		var type = typeof value,
+			isValidValue = type === "string" || Array.isArray( value );
+
+		if ( typeof stateVal === "boolean" && isValidValue ) {
+			return stateVal ? this.addClass( value ) : this.removeClass( value );
+		}
+
+		if ( isFunction( value ) ) {
+			return this.each( function( i ) {
+				jQuery( this ).toggleClass(
+					value.call( this, i, getClass( this ), stateVal ),
+					stateVal
+				);
+			} );
+		}
+
+		return this.each( function() {
+			var className, i, self, classNames;
+
+			if ( isValidValue ) {
+
+				// Toggle individual class names
+				i = 0;
+				self = jQuery( this );
+				classNames = classesToArray( value );
+
+				while ( ( className = classNames[ i++ ] ) ) {
+
+					// Check each className given, space separated list
+					if ( self.hasClass( className ) ) {
+						self.removeClass( className );
+					} else {
+						self.addClass( className );
+					}
+				}
+
+			// Toggle whole class name
+			} else if ( value === undefined || type === "boolean" ) {
+				className = getClass( this );
+				if ( className ) {
+
+					// Store className if set
+					dataPriv.set( this, "__className__", className );
+				}
+
+				// If the element has a class name or if we're passed `false`,
+				// then remove the whole classname (if there was one, the above saved it).
+				// Otherwise bring back whatever was previously saved (if anything),
+				// falling back to the empty string if nothing was stored.
+				if ( this.setAttribute ) {
+					this.setAttribute( "class",
+						className || value === false ?
+						"" :
+						dataPriv.get( this, "__className__" ) || ""
+					);
+				}
+			}
+		} );
+	},
+
+	hasClass: function( selector ) {
+		var className, elem,
+			i = 0;
+
+		className = " " + selector + " ";
+		while ( ( elem = this[ i++ ] ) ) {
+			if ( elem.nodeType === 1 &&
+				( " " + stripAndCollapse( getClass( elem ) ) + " " ).indexOf( className ) > -1 ) {
+					return true;
+			}
+		}
+
+		return false;
+	}
+} );
+
+
+
+
+var rreturn = /\r/g;
+
+jQuery.fn.extend( {
+	val: function( value ) {
+		var hooks, ret, valueIsFunction,
+			elem = this[ 0 ];
+
+		if ( !arguments.length ) {
+			if ( elem ) {
+				hooks = jQuery.valHooks[ elem.type ] ||
+					jQuery.valHooks[ elem.nodeName.toLowerCase() ];
+
+				if ( hooks &&
+					"get" in hooks &&
+					( ret = hooks.get( elem, "value" ) ) !== undefined
+				) {
+					return ret;
+				}
+
+				ret = elem.value;
+
+				// Handle most common string cases
+				if ( typeof ret === "string" ) {
+					return ret.replace( rreturn, "" );
+				}
+
+				// Handle cases where value is null/undef or number
+				return ret == null ? "" : ret;
+			}
+
+			return;
+		}
+
+		valueIsFunction = isFunction( value );
+
+		return this.each( function( i ) {
+			var val;
+
+			if ( this.nodeType !== 1 ) {
+				return;
+			}
+
+			if ( valueIsFunction ) {
+				val = value.call( this, i, jQuery( this ).val() );
+			} else {
+				val = value;
+			}
+
+			// Treat null/undefined as ""; convert numbers to string
+			if ( val == null ) {
+				val = "";
+
+			} else if ( typeof val === "number" ) {
+				val += "";
+
+			} else if ( Array.isArray( val ) ) {
+				val = jQuery.map( val, function( value ) {
+					return value == null ? "" : value + "";
+				} );
+			}
+
+			hooks = jQuery.valHooks[ this.type ] || jQuery.valHooks[ this.nodeName.toLowerCase() ];
+
+			// If set returns undefined, fall back to normal setting
+			if ( !hooks || !( "set" in hooks ) || hooks.set( this, val, "value" ) === undefined ) {
+				this.value = val;
+			}
+		} );
+	}
+} );
+
+jQuery.extend( {
+	valHooks: {
+		option: {
+			get: function( elem ) {
+
+				var val = jQuery.find.attr( elem, "value" );
+				return val != null ?
+					val :
+
+					// Support: IE <=10 - 11 only
+					// option.text throws exceptions (#14686, #14858)
+					// Strip and collapse whitespace
+					// https://html.spec.whatwg.org/#strip-and-collapse-whitespace
+					stripAndCollapse( jQuery.text( elem ) );
+			}
+		},
+		select: {
+			get: function( elem ) {
+				var value, option, i,
+					options = elem.options,
+					index = elem.selectedIndex,
+					one = elem.type === "select-one",
+					values = one ? null : [],
+					max = one ? index + 1 : options.length;
+
+				if ( index < 0 ) {
+					i = max;
+
+				} else {
+					i = one ? index : 0;
+				}
+
+				// Loop through all the selected options
+				for ( ; i < max; i++ ) {
+					option = options[ i ];
+
+					// Support: IE <=9 only
+					// IE8-9 doesn't update selected after form reset (#2551)
+					if ( ( option.selected || i === index ) &&
+
+							// Don't return options that are disabled or in a disabled optgroup
+							!option.disabled &&
+							( !option.parentNode.disabled ||
+								!nodeName( option.parentNode, "optgroup" ) ) ) {
+
+						// Get the specific value for the option
+						value = jQuery( option ).val();
+
+						// We don't need an array for one selects
+						if ( one ) {
+							return value;
+						}
+
+						// Multi-Selects return an array
+						values.push( value );
+					}
+				}
+
+				return values;
+			},
+
+			set: function( elem, value ) {
+				var optionSet, option,
+					options = elem.options,
+					values = jQuery.makeArray( value ),
+					i = options.length;
+
+				while ( i-- ) {
+					option = options[ i ];
+
+					/* eslint-disable no-cond-assign */
+
+					if ( option.selected =
+						jQuery.inArray( jQuery.valHooks.option.get( option ), values ) > -1
+					) {
+						optionSet = true;
+					}
+
+					/* eslint-enable no-cond-assign */
+				}
+
+				// Force browsers to behave consistently when non-matching value is set
+				if ( !optionSet ) {
+					elem.selectedIndex = -1;
+				}
+				return values;
+			}
+		}
+	}
+} );
+
+// Radios and checkboxes getter/setter
+jQuery.each( [ "radio", "checkbox" ], function() {
+	jQuery.valHooks[ this ] = {
+		set: function( elem, value ) {
+			if ( Array.isArray( value ) ) {
+				return ( elem.checked = jQuery.inArray( jQuery( elem ).val(), value ) > -1 );
+			}
+		}
+	};
+	if ( !support.checkOn ) {
+		jQuery.valHooks[ this ].get = function( elem ) {
+			return elem.getAttribute( "value" ) === null ? "on" : elem.value;
+		};
+	}
+} );
+
+
+
+
+// Return jQuery for attributes-only inclusion
+
+
+support.focusin = "onfocusin" in window;
+
+
+var rfocusMorph = /^(?:focusinfocus|focusoutblur)$/,
+	stopPropagationCallback = function( e ) {
+		e.stopPropagation();
+	};
+
+jQuery.extend( jQuery.event, {
+
+	trigger: function( event, data, elem, onlyHandlers ) {
+
+		var i, cur, tmp, bubbleType, ontype, handle, special, lastElement,
+			eventPath = [ elem || document ],
+			type = hasOwn.call( event, "type" ) ? event.type : event,
+			namespaces = hasOwn.call( event, "namespace" ) ? event.namespace.split( "." ) : [];
+
+		cur = lastElement = tmp = elem = elem || document;
+
+		// Don't do events on text and comment nodes
+		if ( elem.nodeType === 3 || elem.nodeType === 8 ) {
+			return;
+		}
+
+		// focus/blur morphs to focusin/out; ensure we're not firing them right now
+		if ( rfocusMorph.test( type + jQuery.event.triggered ) ) {
+			return;
+		}
+
+		if ( type.indexOf( "." ) > -1 ) {
+
+			// Namespaced trigger; create a regexp to match event type in handle()
+			namespaces = type.split( "." );
+			type = namespaces.shift();
+			namespaces.sort();
+		}
+		ontype = type.indexOf( ":" ) < 0 && "on" + type;
+
+		// Caller can pass in a jQuery.Event object, Object, or just an event type string
+		event = event[ jQuery.expando ] ?
+			event :
+			new jQuery.Event( type, typeof event === "object" && event );
+
+		// Trigger bitmask: & 1 for native handlers; & 2 for jQuery (always true)
+		event.isTrigger = onlyHandlers ? 2 : 3;
+		event.namespace = namespaces.join( "." );
+		event.rnamespace = event.namespace ?
+			new RegExp( "(^|\\.)" + namespaces.join( "\\.(?:.*\\.|)" ) + "(\\.|$)" ) :
+			null;
+
+		// Clean up the event in case it is being reused
+		event.result = undefined;
+		if ( !event.target ) {
+			event.target = elem;
+		}
+
+		// Clone any incoming data and prepend the event, creating the handler arg list
+		data = data == null ?
+			[ event ] :
+			jQuery.makeArray( data, [ event ] );
+
+		// Allow special events to draw outside the lines
+		special = jQuery.event.special[ type ] || {};
+		if ( !onlyHandlers && special.trigger && special.trigger.apply( elem, data ) === false ) {
+			return;
+		}
+
+		// Determine event propagation path in advance, per W3C events spec (#9951)
+		// Bubble up to document, then to window; watch for a global ownerDocument var (#9724)
+		if ( !onlyHandlers && !special.noBubble && !isWindow( elem ) ) {
+
+			bubbleType = special.delegateType || type;
+			if ( !rfocusMorph.test( bubbleType + type ) ) {
+				cur = cur.parentNode;
+			}
+			for ( ; cur; cur = cur.parentNode ) {
+				eventPath.push( cur );
+				tmp = cur;
+			}
+
+			// Only add window if we got to document (e.g., not plain obj or detached DOM)
+			if ( tmp === ( elem.ownerDocument || document ) ) {
+				eventPath.push( tmp.defaultView || tmp.parentWindow || window );
+			}
+		}
+
+		// Fire handlers on the event path
+		i = 0;
+		while ( ( cur = eventPath[ i++ ] ) && !event.isPropagationStopped() ) {
+			lastElement = cur;
+			event.type = i > 1 ?
+				bubbleType :
+				special.bindType || type;
+
+			// jQuery handler
+			handle = ( dataPriv.get( cur, "events" ) || {} )[ event.type ] &&
+				dataPriv.get( cur, "handle" );
+			if ( handle ) {
+				handle.apply( cur, data );
+			}
+
+			// Native handler
+			handle = ontype && cur[ ontype ];
+			if ( handle && handle.apply && acceptData( cur ) ) {
+				event.result = handle.apply( cur, data );
+				if ( event.result === false ) {
+					event.preventDefault();
+				}
+			}
+		}
+		event.type = type;
+
+		// If nobody prevented the default action, do it now
+		if ( !onlyHandlers && !event.isDefaultPrevented() ) {
+
+			if ( ( !special._default ||
+				special._default.apply( eventPath.pop(), data ) === false ) &&
+				acceptData( elem ) ) {
+
+				// Call a native DOM method on the target with the same name as the event.
+				// Don't do default actions on window, that's where global variables be (#6170)
+				if ( ontype && isFunction( elem[ type ] ) && !isWindow( elem ) ) {
+
+					// Don't re-trigger an onFOO event when we call its FOO() method
+					tmp = elem[ ontype ];
+
+					if ( tmp ) {
+						elem[ ontype ] = null;
+					}
+
+					// Prevent re-triggering of the same event, since we already bubbled it above
+					jQuery.event.triggered = type;
+
+					if ( event.isPropagationStopped() ) {
+						lastElement.addEventListener( type, stopPropagationCallback );
+					}
+
+					elem[ type ]();
+
+					if ( event.isPropagationStopped() ) {
+						lastElement.removeEventListener( type, stopPropagationCallback );
+					}
+
+					jQuery.event.triggered = undefined;
+
+					if ( tmp ) {
+						elem[ ontype ] = tmp;
+					}
+				}
+			}
+		}
+
+		return event.result;
+	},
+
+	// Piggyback on a donor event to simulate a different one
+	// Used only for `focus(in | out)` events
+	simulate: function( type, elem, event ) {
+		var e = jQuery.extend(
+			new jQuery.Event(),
+			event,
+			{
+				type: type,
+				isSimulated: true
+			}
+		);
+
+		jQuery.event.trigger( e, null, elem );
+	}
+
+} );
+
+jQuery.fn.extend( {
+
+	trigger: function( type, data ) {
+		return this.each( function() {
+			jQuery.event.trigger( type, data, this );
+		} );
+	},
+	triggerHandler: function( type, data ) {
+		var elem = this[ 0 ];
+		if ( elem ) {
+			return jQuery.event.trigger( type, data, elem, true );
+		}
+	}
+} );
+
+
+// Support: Firefox <=44
+// Firefox doesn't have focus(in | out) events
+// Related ticket - https://bugzilla.mozilla.org/show_bug.cgi?id=687787
+//
+// Support: Chrome <=48 - 49, Safari <=9.0 - 9.1
+// focus(in | out) events fire after focus & blur events,
+// which is spec violation - http://www.w3.org/TR/DOM-Level-3-Events/#events-focusevent-event-order
+// Related ticket - https://bugs.chromium.org/p/chromium/issues/detail?id=449857
+if ( !support.focusin ) {
+	jQuery.each( { focus: "focusin", blur: "focusout" }, function( orig, fix ) {
+
+		// Attach a single capturing handler on the document while someone wants focusin/focusout
+		var handler = function( event ) {
+			jQuery.event.simulate( fix, event.target, jQuery.event.fix( event ) );
+		};
+
+		jQuery.event.special[ fix ] = {
+			setup: function() {
+				var doc = this.ownerDocument || this,
+					attaches = dataPriv.access( doc, fix );
+
+				if ( !attaches ) {
+					doc.addEventListener( orig, handler, true );
+				}
+				dataPriv.access( doc, fix, ( attaches || 0 ) + 1 );
+			},
+			teardown: function() {
+				var doc = this.ownerDocument || this,
+					attaches = dataPriv.access( doc, fix ) - 1;
+
+				if ( !attaches ) {
+					doc.removeEventListener( orig, handler, true );
+					dataPriv.remove( doc, fix );
+
+				} else {
+					dataPriv.access( doc, fix, attaches );
+				}
+			}
+		};
+	} );
+}
+var location = window.location;
+
+var nonce = Date.now();
+
+var rquery = ( /\?/ );
+
+
+
+// Cross-browser xml parsing
+jQuery.parseXML = function( data ) {
+	var xml;
+	if ( !data || typeof data !== "string" ) {
+		return null;
+	}
+
+	// Support: IE 9 - 11 only
+	// IE throws on parseFromString with invalid input.
+	try {
+		xml = ( new window.DOMParser() ).parseFromString( data, "text/xml" );
+	} catch ( e ) {
+		xml = undefined;
+	}
+
+	if ( !xml || xml.getElementsByTagName( "parsererror" ).length ) {
+		jQuery.error( "Invalid XML: " + data );
+	}
+	return xml;
+};
+
+
+var
+	rbracket = /\[\]$/,
+	rCRLF = /\r?\n/g,
+	rsubmitterTypes = /^(?:submit|button|image|reset|file)$/i,
+	rsubmittable = /^(?:input|select|textarea|keygen)/i;
+
+function buildParams( prefix, obj, traditional, add ) {
+	var name;
+
+	if ( Array.isArray( obj ) ) {
+
+		// Serialize array item.
+		jQuery.each( obj, function( i, v ) {
+			if ( traditional || rbracket.test( prefix ) ) {
+
+				// Treat each array item as a scalar.
+				add( prefix, v );
+
+			} else {
+
+				// Item is non-scalar (array or object), encode its numeric index.
+				buildParams(
+					prefix + "[" + ( typeof v === "object" && v != null ? i : "" ) + "]",
+					v,
+					traditional,
+					add
+				);
+			}
+		} );
+
+	} else if ( !traditional && toType( obj ) === "object" ) {
+
+		// Serialize object item.
+		for ( name in obj ) {
+			buildParams( prefix + "[" + name + "]", obj[ name ], traditional, add );
+		}
+
+	} else {
+
+		// Serialize scalar item.
+		add( prefix, obj );
+	}
+}
+
+// Serialize an array of form elements or a set of
+// key/values into a query string
+jQuery.param = function( a, traditional ) {
+	var prefix,
+		s = [],
+		add = function( key, valueOrFunction ) {
+
+			// If value is a function, invoke it and use its return value
+			var value = isFunction( valueOrFunction ) ?
+				valueOrFunction() :
+				valueOrFunction;
+
+			s[ s.length ] = encodeURIComponent( key ) + "=" +
+				encodeURIComponent( value == null ? "" : value );
+		};
+
+	if ( a == null ) {
+		return "";
+	}
+
+	// If an array was passed in, assume that it is an array of form elements.
+	if ( Array.isArray( a ) || ( a.jquery && !jQuery.isPlainObject( a ) ) ) {
+
+		// Serialize the form elements
+		jQuery.each( a, function() {
+			add( this.name, this.value );
+		} );
+
+	} else {
+
+		// If traditional, encode the "old" way (the way 1.3.2 or older
+		// did it), otherwise encode params recursively.
+		for ( prefix in a ) {
+			buildParams( prefix, a[ prefix ], traditional, add );
+		}
+	}
+
+	// Return the resulting serialization
+	return s.join( "&" );
+};
+
+jQuery.fn.extend( {
+	serialize: function() {
+		return jQuery.param( this.serializeArray() );
+	},
+	serializeArray: function() {
+		return this.map( function() {
+
+			// Can add propHook for "elements" to filter or add form elements
+			var elements = jQuery.prop( this, "elements" );
+			return elements ? jQuery.makeArray( elements ) : this;
+		} )
+		.filter( function() {
+			var type = this.type;
+
+			// Use .is( ":disabled" ) so that fieldset[disabled] works
+			return this.name && !jQuery( this ).is( ":disabled" ) &&
+				rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&
+				( this.checked || !rcheckableType.test( type ) );
+		} )
+		.map( function( i, elem ) {
+			var val = jQuery( this ).val();
+
+			if ( val == null ) {
+				return null;
+			}
+
+			if ( Array.isArray( val ) ) {
+				return jQuery.map( val, function( val ) {
+					return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
+				} );
+			}
+
+			return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
+		} ).get();
+	}
+} );
+
+
+var
+	r20 = /%20/g,
+	rhash = /#.*$/,
+	rantiCache = /([?&])_=[^&]*/,
+	rheaders = /^(.*?):[ \t]*([^\r\n]*)$/mg,
+
+	// #7653, #8125, #8152: local protocol detection
+	rlocalProtocol = /^(?:about|app|app-storage|.+-extension|file|res|widget):$/,
+	rnoContent = /^(?:GET|HEAD)$/,
+	rprotocol = /^\/\//,
+
+	/* Prefilters
+	 * 1) They are useful to introduce custom dataTypes (see ajax/jsonp.js for an example)
+	 * 2) These are called:
+	 *    - BEFORE asking for a transport
+	 *    - AFTER param serialization (s.data is a string if s.processData is true)
+	 * 3) key is the dataType
+	 * 4) the catchall symbol "*" can be used
+	 * 5) execution will start with transport dataType and THEN continue down to "*" if needed
+	 */
+	prefilters = {},
+
+	/* Transports bindings
+	 * 1) key is the dataType
+	 * 2) the catchall symbol "*" can be used
+	 * 3) selection will start with transport dataType and THEN go to "*" if needed
+	 */
+	transports = {},
+
+	// Avoid comment-prolog char sequence (#10098); must appease lint and evade compression
+	allTypes = "*/".concat( "*" ),
+
+	// Anchor tag for parsing the document origin
+	originAnchor = document.createElement( "a" );
+	originAnchor.href = location.href;
+
+// Base "constructor" for jQuery.ajaxPrefilter and jQuery.ajaxTransport
+function addToPrefiltersOrTransports( structure ) {
+
+	// dataTypeExpression is optional and defaults to "*"
+	return function( dataTypeExpression, func ) {
+
+		if ( typeof dataTypeExpression !== "string" ) {
+			func = dataTypeExpression;
+			dataTypeExpression = "*";
+		}
+
+		var dataType,
+			i = 0,
+			dataTypes = dataTypeExpression.toLowerCase().match( rnothtmlwhite ) || [];
+
+		if ( isFunction( func ) ) {
+
+			// For each dataType in the dataTypeExpression
+			while ( ( dataType = dataTypes[ i++ ] ) ) {
+
+				// Prepend if requested
+				if ( dataType[ 0 ] === "+" ) {
+					dataType = dataType.slice( 1 ) || "*";
+					( structure[ dataType ] = structure[ dataType ] || [] ).unshift( func );
+
+				// Otherwise append
+				} else {
+					( structure[ dataType ] = structure[ dataType ] || [] ).push( func );
+				}
+			}
+		}
+	};
+}
+
+// Base inspection function for prefilters and transports
+function inspectPrefiltersOrTransports( structure, options, originalOptions, jqXHR ) {
+
+	var inspected = {},
+		seekingTransport = ( structure === transports );
+
+	function inspect( dataType ) {
+		var selected;
+		inspected[ dataType ] = true;
+		jQuery.each( structure[ dataType ] || [], function( _, prefilterOrFactory ) {
+			var dataTypeOrTransport = prefilterOrFactory( options, originalOptions, jqXHR );
+			if ( typeof dataTypeOrTransport === "string" &&
+				!seekingTransport && !inspected[ dataTypeOrTransport ] ) {
+
+				options.dataTypes.unshift( dataTypeOrTransport );
+				inspect( dataTypeOrTransport );
+				return false;
+			} else if ( seekingTransport ) {
+				return !( selected = dataTypeOrTransport );
+			}
+		} );
+		return selected;
+	}
+
+	return inspect( options.dataTypes[ 0 ] ) || !inspected[ "*" ] && inspect( "*" );
+}
+
+// A special extend for ajax options
+// that takes "flat" options (not to be deep extended)
+// Fixes #9887
+function ajaxExtend( target, src ) {
+	var key, deep,
+		flatOptions = jQuery.ajaxSettings.flatOptions || {};
+
+	for ( key in src ) {
+		if ( src[ key ] !== undefined ) {
+			( flatOptions[ key ] ? target : ( deep || ( deep = {} ) ) )[ key ] = src[ key ];
+		}
+	}
+	if ( deep ) {
+		jQuery.extend( true, target, deep );
+	}
+
+	return target;
+}
+
+/* Handles responses to an ajax request:
+ * - finds the right dataType (mediates between content-type and expected dataType)
+ * - returns the corresponding response
+ */
+function ajaxHandleResponses( s, jqXHR, responses ) {
+
+	var ct, type, finalDataType, firstDataType,
+		contents = s.contents,
+		dataTypes = s.dataTypes;
+
+	// Remove auto dataType and get content-type in the process
+	while ( dataTypes[ 0 ] === "*" ) {
+		dataTypes.shift();
+		if ( ct === undefined ) {
+			ct = s.mimeType || jqXHR.getResponseHeader( "Content-Type" );
+		}
+	}
+
+	// Check if we're dealing with a known content-type
+	if ( ct ) {
+		for ( type in contents ) {
+			if ( contents[ type ] && contents[ type ].test( ct ) ) {
+				dataTypes.unshift( type );
+				break;
+			}
+		}
+	}
+
+	// Check to see if we have a response for the expected dataType
+	if ( dataTypes[ 0 ] in responses ) {
+		finalDataType = dataTypes[ 0 ];
+	} else {
+
+		// Try convertible dataTypes
+		for ( type in responses ) {
+			if ( !dataTypes[ 0 ] || s.converters[ type + " " + dataTypes[ 0 ] ] ) {
+				finalDataType = type;
+				break;
+			}
+			if ( !firstDataType ) {
+				firstDataType = type;
+			}
+		}
+
+		// Or just use first one
+		finalDataType = finalDataType || firstDataType;
+	}
+
+	// If we found a dataType
+	// We add the dataType to the list if needed
+	// and return the corresponding response
+	if ( finalDataType ) {
+		if ( finalDataType !== dataTypes[ 0 ] ) {
+			dataTypes.unshift( finalDataType );
+		}
+		return responses[ finalDataType ];
+	}
+}
+
+/* Chain conversions given the request and the original response
+ * Also sets the responseXXX fields on the jqXHR instance
+ */
+function ajaxConvert( s, response, jqXHR, isSuccess ) {
+	var conv2, current, conv, tmp, prev,
+		converters = {},
+
+		// Work with a copy of dataTypes in case we need to modify it for conversion
+		dataTypes = s.dataTypes.slice();
+
+	// Create converters map with lowercased keys
+	if ( dataTypes[ 1 ] ) {
+		for ( conv in s.converters ) {
+			converters[ conv.toLowerCase() ] = s.converters[ conv ];
+		}
+	}
+
+	current = dataTypes.shift();
+
+	// Convert to each sequential dataType
+	while ( current ) {
+
+		if ( s.responseFields[ current ] ) {
+			jqXHR[ s.responseFields[ current ] ] = response;
+		}
+
+		// Apply the dataFilter if provided
+		if ( !prev && isSuccess && s.dataFilter ) {
+			response = s.dataFilter( response, s.dataType );
+		}
+
+		prev = current;
+		current = dataTypes.shift();
+
+		if ( current ) {
+
+			// There's only work to do if current dataType is non-auto
+			if ( current === "*" ) {
+
+				current = prev;
+
+			// Convert response if prev dataType is non-auto and differs from current
+			} else if ( prev !== "*" && prev !== current ) {
+
+				// Seek a direct converter
+				conv = converters[ prev + " " + current ] || converters[ "* " + current ];
+
+				// If none found, seek a pair
+				if ( !conv ) {
+					for ( conv2 in converters ) {
+
+						// If conv2 outputs current
+						tmp = conv2.split( " " );
+						if ( tmp[ 1 ] === current ) {
+
+							// If prev can be converted to accepted input
+							conv = converters[ prev + " " + tmp[ 0 ] ] ||
+								converters[ "* " + tmp[ 0 ] ];
+							if ( conv ) {
+
+								// Condense equivalence converters
+								if ( conv === true ) {
+									conv = converters[ conv2 ];
+
+								// Otherwise, insert the intermediate dataType
+								} else if ( converters[ conv2 ] !== true ) {
+									current = tmp[ 0 ];
+									dataTypes.unshift( tmp[ 1 ] );
+								}
+								break;
+							}
+						}
+					}
+				}
+
+				// Apply converter (if not an equivalence)
+				if ( conv !== true ) {
+
+					// Unless errors are allowed to bubble, catch and return them
+					if ( conv && s.throws ) {
+						response = conv( response );
+					} else {
+						try {
+							response = conv( response );
+						} catch ( e ) {
+							return {
+								state: "parsererror",
+								error: conv ? e : "No conversion from " + prev + " to " + current
+							};
+						}
+					}
+				}
+			}
+		}
+	}
+
+	return { state: "success", data: response };
+}
+
+jQuery.extend( {
+
+	// Counter for holding the number of active queries
+	active: 0,
+
+	// Last-Modified header cache for next request
+	lastModified: {},
+	etag: {},
+
+	ajaxSettings: {
+		url: location.href,
+		type: "GET",
+		isLocal: rlocalProtocol.test( location.protocol ),
+		global: true,
+		processData: true,
+		async: true,
+		contentType: "application/x-www-form-urlencoded; charset=UTF-8",
+
+		/*
+		timeout: 0,
+		data: null,
+		dataType: null,
+		username: null,
+		password: null,
+		cache: null,
+		throws: false,
+		traditional: false,
+		headers: {},
+		*/
+
+		accepts: {
+			"*": allTypes,
+			text: "text/plain",
+			html: "text/html",
+			xml: "application/xml, text/xml",
+			json: "application/json, text/javascript"
+		},
+
+		contents: {
+			xml: /\bxml\b/,
+			html: /\bhtml/,
+			json: /\bjson\b/
+		},
+
+		responseFields: {
+			xml: "responseXML",
+			text: "responseText",
+			json: "responseJSON"
+		},
+
+		// Data converters
+		// Keys separate source (or catchall "*") and destination types with a single space
+		converters: {
+
+			// Convert anything to text
+			"* text": String,
+
+			// Text to html (true = no transformation)
+			"text html": true,
+
+			// Evaluate text as a json expression
+			"text json": JSON.parse,
+
+			// Parse text as xml
+			"text xml": jQuery.parseXML
+		},
+
+		// For options that shouldn't be deep extended:
+		// you can add your own custom options here if
+		// and when you create one that shouldn't be
+		// deep extended (see ajaxExtend)
+		flatOptions: {
+			url: true,
+			context: true
+		}
+	},
+
+	// Creates a full fledged settings object into target
+	// with both ajaxSettings and settings fields.
+	// If target is omitted, writes into ajaxSettings.
+	ajaxSetup: function( target, settings ) {
+		return settings ?
+
+			// Building a settings object
+			ajaxExtend( ajaxExtend( target, jQuery.ajaxSettings ), settings ) :
+
+			// Extending ajaxSettings
+			ajaxExtend( jQuery.ajaxSettings, target );
+	},
+
+	ajaxPrefilter: addToPrefiltersOrTransports( prefilters ),
+	ajaxTransport: addToPrefiltersOrTransports( transports ),
+
+	// Main method
+	ajax: function( url, options ) {
+
+		// If url is an object, simulate pre-1.5 signature
+		if ( typeof url === "object" ) {
+			options = url;
+			url = undefined;
+		}
+
+		// Force options to be an object
+		options = options || {};
+
+		var transport,
+
+			// URL without anti-cache param
+			cacheURL,
+
+			// Response headers
+			responseHeadersString,
+			responseHeaders,
+
+			// timeout handle
+			timeoutTimer,
+
+			// Url cleanup var
+			urlAnchor,
+
+			// Request state (becomes false upon send and true upon completion)
+			completed,
+
+			// To know if global events are to be dispatched
+			fireGlobals,
+
+			// Loop variable
+			i,
+
+			// uncached part of the url
+			uncached,
+
+			// Create the final options object
+			s = jQuery.ajaxSetup( {}, options ),
+
+			// Callbacks context
+			callbackContext = s.context || s,
+
+			// Context for global events is callbackContext if it is a DOM node or jQuery collection
+			globalEventContext = s.context &&
+				( callbackContext.nodeType || callbackContext.jquery ) ?
+					jQuery( callbackContext ) :
+					jQuery.event,
+
+			// Deferreds
+			deferred = jQuery.Deferred(),
+			completeDeferred = jQuery.Callbacks( "once memory" ),
+
+			// Status-dependent callbacks
+			statusCode = s.statusCode || {},
+
+			// Headers (they are sent all at once)
+			requestHeaders = {},
+			requestHeadersNames = {},
+
+			// Default abort message
+			strAbort = "canceled",
+
+			// Fake xhr
+			jqXHR = {
+				readyState: 0,
+
+				// Builds headers hashtable if needed
+				getResponseHeader: function( key ) {
+					var match;
+					if ( completed ) {
+						if ( !responseHeaders ) {
+							responseHeaders = {};
+							while ( ( match = rheaders.exec( responseHeadersString ) ) ) {
+								responseHeaders[ match[ 1 ].toLowerCase() + " " ] =
+									( responseHeaders[ match[ 1 ].toLowerCase() + " " ] || [] )
+										.concat( match[ 2 ] );
+							}
+						}
+						match = responseHeaders[ key.toLowerCase() + " " ];
+					}
+					return match == null ? null : match.join( ", " );
+				},
+
+				// Raw string
+				getAllResponseHeaders: function() {
+					return completed ? responseHeadersString : null;
+				},
+
+				// Caches the header
+				setRequestHeader: function( name, value ) {
+					if ( completed == null ) {
+						name = requestHeadersNames[ name.toLowerCase() ] =
+							requestHeadersNames[ name.toLowerCase() ] || name;
+						requestHeaders[ name ] = value;
+					}
+					return this;
+				},
+
+				// Overrides response content-type header
+				overrideMimeType: function( type ) {
+					if ( completed == null ) {
+						s.mimeType = type;
+					}
+					return this;
+				},
+
+				// Status-dependent callbacks
+				statusCode: function( map ) {
+					var code;
+					if ( map ) {
+						if ( completed ) {
+
+							// Execute the appropriate callbacks
+							jqXHR.always( map[ jqXHR.status ] );
+						} else {
+
+							// Lazy-add the new callbacks in a way that preserves old ones
+							for ( code in map ) {
+								statusCode[ code ] = [ statusCode[ code ], map[ code ] ];
+							}
+						}
+					}
+					return this;
+				},
+
+				// Cancel the request
+				abort: function( statusText ) {
+					var finalText = statusText || strAbort;
+					if ( transport ) {
+						transport.abort( finalText );
+					}
+					done( 0, finalText );
+					return this;
+				}
+			};
+
+		// Attach deferreds
+		deferred.promise( jqXHR );
+
+		// Add protocol if not provided (prefilters might expect it)
+		// Handle falsy url in the settings object (#10093: consistency with old signature)
+		// We also use the url parameter if available
+		s.url = ( ( url || s.url || location.href ) + "" )
+			.replace( rprotocol, location.protocol + "//" );
+
+		// Alias method option to type as per ticket #12004
+		s.type = options.method || options.type || s.method || s.type;
+
+		// Extract dataTypes list
+		s.dataTypes = ( s.dataType || "*" ).toLowerCase().match( rnothtmlwhite ) || [ "" ];
+
+		// A cross-domain request is in order when the origin doesn't match the current origin.
+		if ( s.crossDomain == null ) {
+			urlAnchor = document.createElement( "a" );
+
+			// Support: IE <=8 - 11, Edge 12 - 15
+			// IE throws exception on accessing the href property if url is malformed,
+			// e.g. http://example.com:80x/
+			try {
+				urlAnchor.href = s.url;
+
+				// Support: IE <=8 - 11 only
+				// Anchor's host property isn't correctly set when s.url is relative
+				urlAnchor.href = urlAnchor.href;
+				s.crossDomain = originAnchor.protocol + "//" + originAnchor.host !==
+					urlAnchor.protocol + "//" + urlAnchor.host;
+			} catch ( e ) {
+
+				// If there is an error parsing the URL, assume it is crossDomain,
+				// it can be rejected by the transport if it is invalid
+				s.crossDomain = true;
+			}
+		}
+
+		// Convert data if not already a string
+		if ( s.data && s.processData && typeof s.data !== "string" ) {
+			s.data = jQuery.param( s.data, s.traditional );
+		}
+
+		// Apply prefilters
+		inspectPrefiltersOrTransports( prefilters, s, options, jqXHR );
+
+		// If request was aborted inside a prefilter, stop there
+		if ( completed ) {
+			return jqXHR;
+		}
+
+		// We can fire global events as of now if asked to
+		// Don't fire events if jQuery.event is undefined in an AMD-usage scenario (#15118)
+		fireGlobals = jQuery.event && s.global;
+
+		// Watch for a new set of requests
+		if ( fireGlobals && jQuery.active++ === 0 ) {
+			jQuery.event.trigger( "ajaxStart" );
+		}
+
+		// Uppercase the type
+		s.type = s.type.toUpperCase();
+
+		// Determine if request has content
+		s.hasContent = !rnoContent.test( s.type );
+
+		// Save the URL in case we're toying with the If-Modified-Since
+		// and/or If-None-Match header later on
+		// Remove hash to simplify url manipulation
+		cacheURL = s.url.replace( rhash, "" );
+
+		// More options handling for requests with no content
+		if ( !s.hasContent ) {
+
+			// Remember the hash so we can put it back
+			uncached = s.url.slice( cacheURL.length );
+
+			// If data is available and should be processed, append data to url
+			if ( s.data && ( s.processData || typeof s.data === "string" ) ) {
+				cacheURL += ( rquery.test( cacheURL ) ? "&" : "?" ) + s.data;
+
+				// #9682: remove data so that it's not used in an eventual retry
+				delete s.data;
+			}
+
+			// Add or update anti-cache param if needed
+			if ( s.cache === false ) {
+				cacheURL = cacheURL.replace( rantiCache, "$1" );
+				uncached = ( rquery.test( cacheURL ) ? "&" : "?" ) + "_=" + ( nonce++ ) + uncached;
+			}
+
+			// Put hash and anti-cache on the URL that will be requested (gh-1732)
+			s.url = cacheURL + uncached;
+
+		// Change '%20' to '+' if this is encoded form body content (gh-2658)
+		} else if ( s.data && s.processData &&
+			( s.contentType || "" ).indexOf( "application/x-www-form-urlencoded" ) === 0 ) {
+			s.data = s.data.replace( r20, "+" );
+		}
+
+		// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.
+		if ( s.ifModified ) {
+			if ( jQuery.lastModified[ cacheURL ] ) {
+				jqXHR.setRequestHeader( "If-Modified-Since", jQuery.lastModified[ cacheURL ] );
+			}
+			if ( jQuery.etag[ cacheURL ] ) {
+				jqXHR.setRequestHeader( "If-None-Match", jQuery.etag[ cacheURL ] );
+			}
+		}
+
+		// Set the correct header, if data is being sent
+		if ( s.data && s.hasContent && s.contentType !== false || options.contentType ) {
+			jqXHR.setRequestHeader( "Content-Type", s.contentType );
+		}
+
+		// Set the Accepts header for the server, depending on the dataType
+		jqXHR.setRequestHeader(
+			"Accept",
+			s.dataTypes[ 0 ] && s.accepts[ s.dataTypes[ 0 ] ] ?
+				s.accepts[ s.dataTypes[ 0 ] ] +
+					( s.dataTypes[ 0 ] !== "*" ? ", " + allTypes + "; q=0.01" : "" ) :
+				s.accepts[ "*" ]
+		);
+
+		// Check for headers option
+		for ( i in s.headers ) {
+			jqXHR.setRequestHeader( i, s.headers[ i ] );
+		}
+
+		// Allow custom headers/mimetypes and early abort
+		if ( s.beforeSend &&
+			( s.beforeSend.call( callbackContext, jqXHR, s ) === false || completed ) ) {
+
+			// Abort if not done already and return
+			return jqXHR.abort();
+		}
+
+		// Aborting is no longer a cancellation
+		strAbort = "abort";
+
+		// Install callbacks on deferreds
+		completeDeferred.add( s.complete );
+		jqXHR.done( s.success );
+		jqXHR.fail( s.error );
+
+		// Get transport
+		transport = inspectPrefiltersOrTransports( transports, s, options, jqXHR );
+
+		// If no transport, we auto-abort
+		if ( !transport ) {
+			done( -1, "No Transport" );
+		} else {
+			jqXHR.readyState = 1;
+
+			// Send global event
+			if ( fireGlobals ) {
+				globalEventContext.trigger( "ajaxSend", [ jqXHR, s ] );
+			}
+
+			// If request was aborted inside ajaxSend, stop there
+			if ( completed ) {
+				return jqXHR;
+			}
+
+			// Timeout
+			if ( s.async && s.timeout > 0 ) {
+				timeoutTimer = window.setTimeout( function() {
+					jqXHR.abort( "timeout" );
+				}, s.timeout );
+			}
+
+			try {
+				completed = false;
+				transport.send( requestHeaders, done );
+			} catch ( e ) {
+
+				// Rethrow post-completion exceptions
+				if ( completed ) {
+					throw e;
+				}
+
+				// Propagate others as results
+				done( -1, e );
+			}
+		}
+
+		// Callback for when everything is done
+		function done( status, nativeStatusText, responses, headers ) {
+			var isSuccess, success, error, response, modified,
+				statusText = nativeStatusText;
+
+			// Ignore repeat invocations
+			if ( completed ) {
+				return;
+			}
+
+			completed = true;
+
+			// Clear timeout if it exists
+			if ( timeoutTimer ) {
+				window.clearTimeout( timeoutTimer );
+			}
+
+			// Dereference transport for early garbage collection
+			// (no matter how long the jqXHR object will be used)
+			transport = undefined;
+
+			// Cache response headers
+			responseHeadersString = headers || "";
+
+			// Set readyState
+			jqXHR.readyState = status > 0 ? 4 : 0;
+
+			// Determine if successful
+			isSuccess = status >= 200 && status < 300 || status === 304;
+
+			// Get response data
+			if ( responses ) {
+				response = ajaxHandleResponses( s, jqXHR, responses );
+			}
+
+			// Convert no matter what (that way responseXXX fields are always set)
+			response = ajaxConvert( s, response, jqXHR, isSuccess );
+
+			// If successful, handle type chaining
+			if ( isSuccess ) {
+
+				// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.
+				if ( s.ifModified ) {
+					modified = jqXHR.getResponseHeader( "Last-Modified" );
+					if ( modified ) {
+						jQuery.lastModified[ cacheURL ] = modified;
+					}
+					modified = jqXHR.getResponseHeader( "etag" );
+					if ( modified ) {
+						jQuery.etag[ cacheURL ] = modified;
+					}
+				}
+
+				// if no content
+				if ( status === 204 || s.type === "HEAD" ) {
+					statusText = "nocontent";
+
+				// if not modified
+				} else if ( status === 304 ) {
+					statusText = "notmodified";
+
+				// If we have data, let's convert it
+				} else {
+					statusText = response.state;
+					success = response.data;
+					error = response.error;
+					isSuccess = !error;
+				}
+			} else {
+
+				// Extract error from statusText and normalize for non-aborts
+				error = statusText;
+				if ( status || !statusText ) {
+					statusText = "error";
+					if ( status < 0 ) {
+						status = 0;
+					}
+				}
+			}
+
+			// Set data for the fake xhr object
+			jqXHR.status = status;
+			jqXHR.statusText = ( nativeStatusText || statusText ) + "";
+
+			// Success/Error
+			if ( isSuccess ) {
+				deferred.resolveWith( callbackContext, [ success, statusText, jqXHR ] );
+			} else {
+				deferred.rejectWith( callbackContext, [ jqXHR, statusText, error ] );
+			}
+
+			// Status-dependent callbacks
+			jqXHR.statusCode( statusCode );
+			statusCode = undefined;
+
+			if ( fireGlobals ) {
+				globalEventContext.trigger( isSuccess ? "ajaxSuccess" : "ajaxError",
+					[ jqXHR, s, isSuccess ? success : error ] );
+			}
+
+			// Complete
+			completeDeferred.fireWith( callbackContext, [ jqXHR, statusText ] );
+
+			if ( fireGlobals ) {
+				globalEventContext.trigger( "ajaxComplete", [ jqXHR, s ] );
+
+				// Handle the global AJAX counter
+				if ( !( --jQuery.active ) ) {
+					jQuery.event.trigger( "ajaxStop" );
+				}
+			}
+		}
+
+		return jqXHR;
+	},
+
+	getJSON: function( url, data, callback ) {
+		return jQuery.get( url, data, callback, "json" );
+	},
+
+	getScript: function( url, callback ) {
+		return jQuery.get( url, undefined, callback, "script" );
+	}
+} );
+
+jQuery.each( [ "get", "post" ], function( i, method ) {
+	jQuery[ method ] = function( url, data, callback, type ) {
+
+		// Shift arguments if data argument was omitted
+		if ( isFunction( data ) ) {
+			type = type || callback;
+			callback = data;
+			data = undefined;
+		}
+
+		// The url can be an options object (which then must have .url)
+		return jQuery.ajax( jQuery.extend( {
+			url: url,
+			type: method,
+			dataType: type,
+			data: data,
+			success: callback
+		}, jQuery.isPlainObject( url ) && url ) );
+	};
+} );
+
+
+jQuery._evalUrl = function( url, options ) {
+	return jQuery.ajax( {
+		url: url,
+
+		// Make this explicit, since user can override this through ajaxSetup (#11264)
+		type: "GET",
+		dataType: "script",
+		cache: true,
+		async: false,
+		global: false,
+
+		// Only evaluate the response if it is successful (gh-4126)
+		// dataFilter is not invoked for failure responses, so using it instead
+		// of the default converter is kludgy but it works.
+		converters: {
+			"text script": function() {}
+		},
+		dataFilter: function( response ) {
+			jQuery.globalEval( response, options );
+		}
+	} );
+};
+
+
+jQuery.fn.extend( {
+	wrapAll: function( html ) {
+		var wrap;
+
+		if ( this[ 0 ] ) {
+			if ( isFunction( html ) ) {
+				html = html.call( this[ 0 ] );
+			}
+
+			// The elements to wrap the target around
+			wrap = jQuery( html, this[ 0 ].ownerDocument ).eq( 0 ).clone( true );
+
+			if ( this[ 0 ].parentNode ) {
+				wrap.insertBefore( this[ 0 ] );
+			}
+
+			wrap.map( function() {
+				var elem = this;
+
+				while ( elem.firstElementChild ) {
+					elem = elem.firstElementChild;
+				}
+
+				return elem;
+			} ).append( this );
+		}
+
+		return this;
+	},
+
+	wrapInner: function( html ) {
+		if ( isFunction( html ) ) {
+			return this.each( function( i ) {
+				jQuery( this ).wrapInner( html.call( this, i ) );
+			} );
+		}
+
+		return this.each( function() {
+			var self = jQuery( this ),
+				contents = self.contents();
+
+			if ( contents.length ) {
+				contents.wrapAll( html );
+
+			} else {
+				self.append( html );
+			}
+		} );
+	},
+
+	wrap: function( html ) {
+		var htmlIsFunction = isFunction( html );
+
+		return this.each( function( i ) {
+			jQuery( this ).wrapAll( htmlIsFunction ? html.call( this, i ) : html );
+		} );
+	},
+
+	unwrap: function( selector ) {
+		this.parent( selector ).not( "body" ).each( function() {
+			jQuery( this ).replaceWith( this.childNodes );
+		} );
+		return this;
+	}
+} );
+
+
+jQuery.expr.pseudos.hidden = function( elem ) {
+	return !jQuery.expr.pseudos.visible( elem );
+};
+jQuery.expr.pseudos.visible = function( elem ) {
+	return !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length );
+};
+
+
+
+
+jQuery.ajaxSettings.xhr = function() {
+	try {
+		return new window.XMLHttpRequest();
+	} catch ( e ) {}
+};
+
+var xhrSuccessStatus = {
+
+		// File protocol always yields status code 0, assume 200
+		0: 200,
+
+		// Support: IE <=9 only
+		// #1450: sometimes IE returns 1223 when it should be 204
+		1223: 204
+	},
+	xhrSupported = jQuery.ajaxSettings.xhr();
+
+support.cors = !!xhrSupported && ( "withCredentials" in xhrSupported );
+support.ajax = xhrSupported = !!xhrSupported;
+
+jQuery.ajaxTransport( function( options ) {
+	var callback, errorCallback;
+
+	// Cross domain only allowed if supported through XMLHttpRequest
+	if ( support.cors || xhrSupported && !options.crossDomain ) {
+		return {
+			send: function( headers, complete ) {
+				var i,
+					xhr = options.xhr();
+
+				xhr.open(
+					options.type,
+					options.url,
+					options.async,
+					options.username,
+					options.password
+				);
+
+				// Apply custom fields if provided
+				if ( options.xhrFields ) {
+					for ( i in options.xhrFields ) {
+						xhr[ i ] = options.xhrFields[ i ];
+					}
+				}
+
+				// Override mime type if needed
+				if ( options.mimeType && xhr.overrideMimeType ) {
+					xhr.overrideMimeType( options.mimeType );
+				}
+
+				// X-Requested-With header
+				// For cross-domain requests, seeing as conditions for a preflight are
+				// akin to a jigsaw puzzle, we simply never set it to be sure.
+				// (it can always be set on a per-request basis or even using ajaxSetup)
+				// For same-domain requests, won't change header if already provided.
+				if ( !options.crossDomain && !headers[ "X-Requested-With" ] ) {
+					headers[ "X-Requested-With" ] = "XMLHttpRequest";
+				}
+
+				// Set headers
+				for ( i in headers ) {
+					xhr.setRequestHeader( i, headers[ i ] );
+				}
+
+				// Callback
+				callback = function( type ) {
+					return function() {
+						if ( callback ) {
+							callback = errorCallback = xhr.onload =
+								xhr.onerror = xhr.onabort = xhr.ontimeout =
+									xhr.onreadystatechange = null;
+
+							if ( type === "abort" ) {
+								xhr.abort();
+							} else if ( type === "error" ) {
+
+								// Support: IE <=9 only
+								// On a manual native abort, IE9 throws
+								// errors on any property access that is not readyState
+								if ( typeof xhr.status !== "number" ) {
+									complete( 0, "error" );
+								} else {
+									complete(
+
+										// File: protocol always yields status 0; see #8605, #14207
+										xhr.status,
+										xhr.statusText
+									);
+								}
+							} else {
+								complete(
+									xhrSuccessStatus[ xhr.status ] || xhr.status,
+									xhr.statusText,
+
+									// Support: IE <=9 only
+									// IE9 has no XHR2 but throws on binary (trac-11426)
+									// For XHR2 non-text, let the caller handle it (gh-2498)
+									( xhr.responseType || "text" ) !== "text"  ||
+									typeof xhr.responseText !== "string" ?
+										{ binary: xhr.response } :
+										{ text: xhr.responseText },
+									xhr.getAllResponseHeaders()
+								);
+							}
+						}
+					};
+				};
+
+				// Listen to events
+				xhr.onload = callback();
+				errorCallback = xhr.onerror = xhr.ontimeout = callback( "error" );
+
+				// Support: IE 9 only
+				// Use onreadystatechange to replace onabort
+				// to handle uncaught aborts
+				if ( xhr.onabort !== undefined ) {
+					xhr.onabort = errorCallback;
+				} else {
+					xhr.onreadystatechange = function() {
+
+						// Check readyState before timeout as it changes
+						if ( xhr.readyState === 4 ) {
+
+							// Allow onerror to be called first,
+							// but that will not handle a native abort
+							// Also, save errorCallback to a variable
+							// as xhr.onerror cannot be accessed
+							window.setTimeout( function() {
+								if ( callback ) {
+									errorCallback();
+								}
+							} );
+						}
+					};
+				}
+
+				// Create the abort callback
+				callback = callback( "abort" );
+
+				try {
+
+					// Do send the request (this may raise an exception)
+					xhr.send( options.hasContent && options.data || null );
+				} catch ( e ) {
+
+					// #14683: Only rethrow if this hasn't been notified as an error yet
+					if ( callback ) {
+						throw e;
+					}
+				}
+			},
+
+			abort: function() {
+				if ( callback ) {
+					callback();
+				}
+			}
+		};
+	}
+} );
+
+
+
+
+// Prevent auto-execution of scripts when no explicit dataType was provided (See gh-2432)
+jQuery.ajaxPrefilter( function( s ) {
+	if ( s.crossDomain ) {
+		s.contents.script = false;
+	}
+} );
+
+// Install script dataType
+jQuery.ajaxSetup( {
+	accepts: {
+		script: "text/javascript, application/javascript, " +
+			"application/ecmascript, application/x-ecmascript"
+	},
+	contents: {
+		script: /\b(?:java|ecma)script\b/
+	},
+	converters: {
+		"text script": function( text ) {
+			jQuery.globalEval( text );
+			return text;
+		}
+	}
+} );
+
+// Handle cache's special case and crossDomain
+jQuery.ajaxPrefilter( "script", function( s ) {
+	if ( s.cache === undefined ) {
+		s.cache = false;
+	}
+	if ( s.crossDomain ) {
+		s.type = "GET";
+	}
+} );
+
+// Bind script tag hack transport
+jQuery.ajaxTransport( "script", function( s ) {
+
+	// This transport only deals with cross domain or forced-by-attrs requests
+	if ( s.crossDomain || s.scriptAttrs ) {
+		var script, callback;
+		return {
+			send: function( _, complete ) {
+				script = jQuery( "<script>" )
+					.attr( s.scriptAttrs || {} )
+					.prop( { charset: s.scriptCharset, src: s.url } )
+					.on( "load error", callback = function( evt ) {
+						script.remove();
+						callback = null;
+						if ( evt ) {
+							complete( evt.type === "error" ? 404 : 200, evt.type );
+						}
+					} );
+
+				// Use native DOM manipulation to avoid our domManip AJAX trickery
+				document.head.appendChild( script[ 0 ] );
+			},
+			abort: function() {
+				if ( callback ) {
+					callback();
+				}
+			}
+		};
+	}
+} );
+
+
+
+
+var oldCallbacks = [],
+	rjsonp = /(=)\?(?=&|$)|\?\?/;
+
+// Default jsonp settings
+jQuery.ajaxSetup( {
+	jsonp: "callback",
+	jsonpCallback: function() {
+		var callback = oldCallbacks.pop() || ( jQuery.expando + "_" + ( nonce++ ) );
+		this[ callback ] = true;
+		return callback;
+	}
+} );
+
+// Detect, normalize options and install callbacks for jsonp requests
+jQuery.ajaxPrefilter( "json jsonp", function( s, originalSettings, jqXHR ) {
+
+	var callbackName, overwritten, responseContainer,
+		jsonProp = s.jsonp !== false && ( rjsonp.test( s.url ) ?
+			"url" :
+			typeof s.data === "string" &&
+				( s.contentType || "" )
+					.indexOf( "application/x-www-form-urlencoded" ) === 0 &&
+				rjsonp.test( s.data ) && "data"
+		);
+
+	// Handle iff the expected data type is "jsonp" or we have a parameter to set
+	if ( jsonProp || s.dataTypes[ 0 ] === "jsonp" ) {
+
+		// Get callback name, remembering preexisting value associated with it
+		callbackName = s.jsonpCallback = isFunction( s.jsonpCallback ) ?
+			s.jsonpCallback() :
+			s.jsonpCallback;
+
+		// Insert callback into url or form data
+		if ( jsonProp ) {
+			s[ jsonProp ] = s[ jsonProp ].replace( rjsonp, "$1" + callbackName );
+		} else if ( s.jsonp !== false ) {
+			s.url += ( rquery.test( s.url ) ? "&" : "?" ) + s.jsonp + "=" + callbackName;
+		}
+
+		// Use data converter to retrieve json after script execution
+		s.converters[ "script json" ] = function() {
+			if ( !responseContainer ) {
+				jQuery.error( callbackName + " was not called" );
+			}
+			return responseContainer[ 0 ];
+		};
+
+		// Force json dataType
+		s.dataTypes[ 0 ] = "json";
+
+		// Install callback
+		overwritten = window[ callbackName ];
+		window[ callbackName ] = function() {
+			responseContainer = arguments;
+		};
+
+		// Clean-up function (fires after converters)
+		jqXHR.always( function() {
+
+			// If previous value didn't exist - remove it
+			if ( overwritten === undefined ) {
+				jQuery( window ).removeProp( callbackName );
+
+			// Otherwise restore preexisting value
+			} else {
+				window[ callbackName ] = overwritten;
+			}
+
+			// Save back as free
+			if ( s[ callbackName ] ) {
+
+				// Make sure that re-using the options doesn't screw things around
+				s.jsonpCallback = originalSettings.jsonpCallback;
+
+				// Save the callback name for future use
+				oldCallbacks.push( callbackName );
+			}
+
+			// Call if it was a function and we have a response
+			if ( responseContainer && isFunction( overwritten ) ) {
+				overwritten( responseContainer[ 0 ] );
+			}
+
+			responseContainer = overwritten = undefined;
+		} );
+
+		// Delegate to script
+		return "script";
+	}
+} );
+
+
+
+
+// Support: Safari 8 only
+// In Safari 8 documents created via document.implementation.createHTMLDocument
+// collapse sibling forms: the second one becomes a child of the first one.
+// Because of that, this security measure has to be disabled in Safari 8.
+// https://bugs.webkit.org/show_bug.cgi?id=137337
+support.createHTMLDocument = ( function() {
+	var body = document.implementation.createHTMLDocument( "" ).body;
+	body.innerHTML = "<form></form><form></form>";
+	return body.childNodes.length === 2;
+} )();
+
+
+// Argument "data" should be string of html
+// context (optional): If specified, the fragment will be created in this context,
+// defaults to document
+// keepScripts (optional): If true, will include scripts passed in the html string
+jQuery.parseHTML = function( data, context, keepScripts ) {
+	if ( typeof data !== "string" ) {
+		return [];
+	}
+	if ( typeof context === "boolean" ) {
+		keepScripts = context;
+		context = false;
+	}
+
+	var base, parsed, scripts;
+
+	if ( !context ) {
+
+		// Stop scripts or inline event handlers from being executed immediately
+		// by using document.implementation
+		if ( support.createHTMLDocument ) {
+			context = document.implementation.createHTMLDocument( "" );
+
+			// Set the base href for the created document
+			// so any parsed elements with URLs
+			// are based on the document's URL (gh-2965)
+			base = context.createElement( "base" );
+			base.href = document.location.href;
+			context.head.appendChild( base );
+		} else {
+			context = document;
+		}
+	}
+
+	parsed = rsingleTag.exec( data );
+	scripts = !keepScripts && [];
+
+	// Single tag
+	if ( parsed ) {
+		return [ context.createElement( parsed[ 1 ] ) ];
+	}
+
+	parsed = buildFragment( [ data ], context, scripts );
+
+	if ( scripts && scripts.length ) {
+		jQuery( scripts ).remove();
+	}
+
+	return jQuery.merge( [], parsed.childNodes );
+};
+
+
+/**
+ * Load a url into a page
+ */
+jQuery.fn.load = function( url, params, callback ) {
+	var selector, type, response,
+		self = this,
+		off = url.indexOf( " " );
+
+	if ( off > -1 ) {
+		selector = stripAndCollapse( url.slice( off ) );
+		url = url.slice( 0, off );
+	}
+
+	// If it's a function
+	if ( isFunction( params ) ) {
+
+		// We assume that it's the callback
+		callback = params;
+		params = undefined;
+
+	// Otherwise, build a param string
+	} else if ( params && typeof params === "object" ) {
+		type = "POST";
+	}
+
+	// If we have elements to modify, make the request
+	if ( self.length > 0 ) {
+		jQuery.ajax( {
+			url: url,
+
+			// If "type" variable is undefined, then "GET" method will be used.
+			// Make value of this field explicit since
+			// user can override it through ajaxSetup method
+			type: type || "GET",
+			dataType: "html",
+			data: params
+		} ).done( function( responseText ) {
+
+			// Save response for use in complete callback
+			response = arguments;
+
+			self.html( selector ?
+
+				// If a selector was specified, locate the right elements in a dummy div
+				// Exclude scripts to avoid IE 'Permission Denied' errors
+				jQuery( "<div>" ).append( jQuery.parseHTML( responseText ) ).find( selector ) :
+
+				// Otherwise use the full result
+				responseText );
+
+		// If the request succeeds, this function gets "data", "status", "jqXHR"
+		// but they are ignored because response was set above.
+		// If it fails, this function gets "jqXHR", "status", "error"
+		} ).always( callback && function( jqXHR, status ) {
+			self.each( function() {
+				callback.apply( this, response || [ jqXHR.responseText, status, jqXHR ] );
+			} );
+		} );
+	}
+
+	return this;
+};
+
+
+
+
+// Attach a bunch of functions for handling common AJAX events
+jQuery.each( [
+	"ajaxStart",
+	"ajaxStop",
+	"ajaxComplete",
+	"ajaxError",
+	"ajaxSuccess",
+	"ajaxSend"
+], function( i, type ) {
+	jQuery.fn[ type ] = function( fn ) {
+		return this.on( type, fn );
+	};
+} );
+
+
+
+
+jQuery.expr.pseudos.animated = function( elem ) {
+	return jQuery.grep( jQuery.timers, function( fn ) {
+		return elem === fn.elem;
+	} ).length;
+};
+
+
+
+
+jQuery.offset = {
+	setOffset: function( elem, options, i ) {
+		var curPosition, curLeft, curCSSTop, curTop, curOffset, curCSSLeft, calculatePosition,
+			position = jQuery.css( elem, "position" ),
+			curElem = jQuery( elem ),
+			props = {};
+
+		// Set position first, in-case top/left are set even on static elem
+		if ( position === "static" ) {
+			elem.style.position = "relative";
+		}
+
+		curOffset = curElem.offset();
+		curCSSTop = jQuery.css( elem, "top" );
+		curCSSLeft = jQuery.css( elem, "left" );
+		calculatePosition = ( position === "absolute" || position === "fixed" ) &&
+			( curCSSTop + curCSSLeft ).indexOf( "auto" ) > -1;
+
+		// Need to be able to calculate position if either
+		// top or left is auto and position is either absolute or fixed
+		if ( calculatePosition ) {
+			curPosition = curElem.position();
+			curTop = curPosition.top;
+			curLeft = curPosition.left;
+
+		} else {
+			curTop = parseFloat( curCSSTop ) || 0;
+			curLeft = parseFloat( curCSSLeft ) || 0;
+		}
+
+		if ( isFunction( options ) ) {
+
+			// Use jQuery.extend here to allow modification of coordinates argument (gh-1848)
+			options = options.call( elem, i, jQuery.extend( {}, curOffset ) );
+		}
+
+		if ( options.top != null ) {
+			props.top = ( options.top - curOffset.top ) + curTop;
+		}
+		if ( options.left != null ) {
+			props.left = ( options.left - curOffset.left ) + curLeft;
+		}
+
+		if ( "using" in options ) {
+			options.using.call( elem, props );
+
+		} else {
+			curElem.css( props );
+		}
+	}
+};
+
+jQuery.fn.extend( {
+
+	// offset() relates an element's border box to the document origin
+	offset: function( options ) {
+
+		// Preserve chaining for setter
+		if ( arguments.length ) {
+			return options === undefined ?
+				this :
+				this.each( function( i ) {
+					jQuery.offset.setOffset( this, options, i );
+				} );
+		}
+
+		var rect, win,
+			elem = this[ 0 ];
+
+		if ( !elem ) {
+			return;
+		}
+
+		// Return zeros for disconnected and hidden (display: none) elements (gh-2310)
+		// Support: IE <=11 only
+		// Running getBoundingClientRect on a
+		// disconnected node in IE throws an error
+		if ( !elem.getClientRects().length ) {
+			return { top: 0, left: 0 };
+		}
+
+		// Get document-relative position by adding viewport scroll to viewport-relative gBCR
+		rect = elem.getBoundingClientRect();
+		win = elem.ownerDocument.defaultView;
+		return {
+			top: rect.top + win.pageYOffset,
+			left: rect.left + win.pageXOffset
+		};
+	},
+
+	// position() relates an element's margin box to its offset parent's padding box
+	// This corresponds to the behavior of CSS absolute positioning
+	position: function() {
+		if ( !this[ 0 ] ) {
+			return;
+		}
+
+		var offsetParent, offset, doc,
+			elem = this[ 0 ],
+			parentOffset = { top: 0, left: 0 };
+
+		// position:fixed elements are offset from the viewport, which itself always has zero offset
+		if ( jQuery.css( elem, "position" ) === "fixed" ) {
+
+			// Assume position:fixed implies availability of getBoundingClientRect
+			offset = elem.getBoundingClientRect();
+
+		} else {
+			offset = this.offset();
+
+			// Account for the *real* offset parent, which can be the document or its root element
+			// when a statically positioned element is identified
+			doc = elem.ownerDocument;
+			offsetParent = elem.offsetParent || doc.documentElement;
+			while ( offsetParent &&
+				( offsetParent === doc.body || offsetParent === doc.documentElement ) &&
+				jQuery.css( offsetParent, "position" ) === "static" ) {
+
+				offsetParent = offsetParent.parentNode;
+			}
+			if ( offsetParent && offsetParent !== elem && offsetParent.nodeType === 1 ) {
+
+				// Incorporate borders into its offset, since they are outside its content origin
+				parentOffset = jQuery( offsetParent ).offset();
+				parentOffset.top += jQuery.css( offsetParent, "borderTopWidth", true );
+				parentOffset.left += jQuery.css( offsetParent, "borderLeftWidth", true );
+			}
+		}
+
+		// Subtract parent offsets and element margins
+		return {
+			top: offset.top - parentOffset.top - jQuery.css( elem, "marginTop", true ),
+			left: offset.left - parentOffset.left - jQuery.css( elem, "marginLeft", true )
+		};
+	},
+
+	// This method will return documentElement in the following cases:
+	// 1) For the element inside the iframe without offsetParent, this method will return
+	//    documentElement of the parent window
+	// 2) For the hidden or detached element
+	// 3) For body or html element, i.e. in case of the html node - it will return itself
+	//
+	// but those exceptions were never presented as a real life use-cases
+	// and might be considered as more preferable results.
+	//
+	// This logic, however, is not guaranteed and can change at any point in the future
+	offsetParent: function() {
+		return this.map( function() {
+			var offsetParent = this.offsetParent;
+
+			while ( offsetParent && jQuery.css( offsetParent, "position" ) === "static" ) {
+				offsetParent = offsetParent.offsetParent;
+			}
+
+			return offsetParent || documentElement;
+		} );
+	}
+} );
+
+// Create scrollLeft and scrollTop methods
+jQuery.each( { scrollLeft: "pageXOffset", scrollTop: "pageYOffset" }, function( method, prop ) {
+	var top = "pageYOffset" === prop;
+
+	jQuery.fn[ method ] = function( val ) {
+		return access( this, function( elem, method, val ) {
+
+			// Coalesce documents and windows
+			var win;
+			if ( isWindow( elem ) ) {
+				win = elem;
+			} else if ( elem.nodeType === 9 ) {
+				win = elem.defaultView;
+			}
+
+			if ( val === undefined ) {
+				return win ? win[ prop ] : elem[ method ];
+			}
+
+			if ( win ) {
+				win.scrollTo(
+					!top ? val : win.pageXOffset,
+					top ? val : win.pageYOffset
+				);
+
+			} else {
+				elem[ method ] = val;
+			}
+		}, method, val, arguments.length );
+	};
+} );
+
+// Support: Safari <=7 - 9.1, Chrome <=37 - 49
+// Add the top/left cssHooks using jQuery.fn.position
+// Webkit bug: https://bugs.webkit.org/show_bug.cgi?id=29084
+// Blink bug: https://bugs.chromium.org/p/chromium/issues/detail?id=589347
+// getComputedStyle returns percent when specified for top/left/bottom/right;
+// rather than make the css module depend on the offset module, just check for it here
+jQuery.each( [ "top", "left" ], function( i, prop ) {
+	jQuery.cssHooks[ prop ] = addGetHookIf( support.pixelPosition,
+		function( elem, computed ) {
+			if ( computed ) {
+				computed = curCSS( elem, prop );
+
+				// If curCSS returns percentage, fallback to offset
+				return rnumnonpx.test( computed ) ?
+					jQuery( elem ).position()[ prop ] + "px" :
+					computed;
+			}
+		}
+	);
+} );
+
+
+// Create innerHeight, innerWidth, height, width, outerHeight and outerWidth methods
+jQuery.each( { Height: "height", Width: "width" }, function( name, type ) {
+	jQuery.each( { padding: "inner" + name, content: type, "": "outer" + name },
+		function( defaultExtra, funcName ) {
+
+		// Margin is only for outerHeight, outerWidth
+		jQuery.fn[ funcName ] = function( margin, value ) {
+			var chainable = arguments.length && ( defaultExtra || typeof margin !== "boolean" ),
+				extra = defaultExtra || ( margin === true || value === true ? "margin" : "border" );
+
+			return access( this, function( elem, type, value ) {
+				var doc;
+
+				if ( isWindow( elem ) ) {
+
+					// $( window ).outerWidth/Height return w/h including scrollbars (gh-1729)
+					return funcName.indexOf( "outer" ) === 0 ?
+						elem[ "inner" + name ] :
+						elem.document.documentElement[ "client" + name ];
+				}
+
+				// Get document width or height
+				if ( elem.nodeType === 9 ) {
+					doc = elem.documentElement;
+
+					// Either scroll[Width/Height] or offset[Width/Height] or client[Width/Height],
+					// whichever is greatest
+					return Math.max(
+						elem.body[ "scroll" + name ], doc[ "scroll" + name ],
+						elem.body[ "offset" + name ], doc[ "offset" + name ],
+						doc[ "client" + name ]
+					);
+				}
+
+				return value === undefined ?
+
+					// Get width or height on the element, requesting but not forcing parseFloat
+					jQuery.css( elem, type, extra ) :
+
+					// Set width or height on the element
+					jQuery.style( elem, type, value, extra );
+			}, type, chainable ? margin : undefined, chainable );
+		};
+	} );
+} );
+
+
+jQuery.each( ( "blur focus focusin focusout resize scroll click dblclick " +
+	"mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " +
+	"change select submit keydown keypress keyup contextmenu" ).split( " " ),
+	function( i, name ) {
+
+	// Handle event binding
+	jQuery.fn[ name ] = function( data, fn ) {
+		return arguments.length > 0 ?
+			this.on( name, null, data, fn ) :
+			this.trigger( name );
+	};
+} );
+
+jQuery.fn.extend( {
+	hover: function( fnOver, fnOut ) {
+		return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
+	}
+} );
+
+
+
+
+jQuery.fn.extend( {
+
+	bind: function( types, data, fn ) {
+		return this.on( types, null, data, fn );
+	},
+	unbind: function( types, fn ) {
+		return this.off( types, null, fn );
+	},
+
+	delegate: function( selector, types, data, fn ) {
+		return this.on( types, selector, data, fn );
+	},
+	undelegate: function( selector, types, fn ) {
+
+		// ( namespace ) or ( selector, types [, fn] )
+		return arguments.length === 1 ?
+			this.off( selector, "**" ) :
+			this.off( types, selector || "**", fn );
+	}
+} );
+
+// Bind a function to a context, optionally partially applying any
+// arguments.
+// jQuery.proxy is deprecated to promote standards (specifically Function#bind)
+// However, it is not slated for removal any time soon
+jQuery.proxy = function( fn, context ) {
+	var tmp, args, proxy;
+
+	if ( typeof context === "string" ) {
+		tmp = fn[ context ];
+		context = fn;
+		fn = tmp;
+	}
+
+	// Quick check to determine if target is callable, in the spec
+	// this throws a TypeError, but we will just return undefined.
+	if ( !isFunction( fn ) ) {
+		return undefined;
+	}
+
+	// Simulated bind
+	args = slice.call( arguments, 2 );
+	proxy = function() {
+		return fn.apply( context || this, args.concat( slice.call( arguments ) ) );
+	};
+
+	// Set the guid of unique handler to the same of original handler, so it can be removed
+	proxy.guid = fn.guid = fn.guid || jQuery.guid++;
+
+	return proxy;
+};
+
+jQuery.holdReady = function( hold ) {
+	if ( hold ) {
+		jQuery.readyWait++;
+	} else {
+		jQuery.ready( true );
+	}
+};
+jQuery.isArray = Array.isArray;
+jQuery.parseJSON = JSON.parse;
+jQuery.nodeName = nodeName;
+jQuery.isFunction = isFunction;
+jQuery.isWindow = isWindow;
+jQuery.camelCase = camelCase;
+jQuery.type = toType;
+
+jQuery.now = Date.now;
+
+jQuery.isNumeric = function( obj ) {
+
+	// As of jQuery 3.0, isNumeric is limited to
+	// strings and numbers (primitives or objects)
+	// that can be coerced to finite numbers (gh-2662)
+	var type = jQuery.type( obj );
+	return ( type === "number" || type === "string" ) &&
+
+		// parseFloat NaNs numeric-cast false positives ("")
+		// ...but misinterprets leading-number strings, particularly hex literals ("0x...")
+		// subtraction forces infinities to NaN
+		!isNaN( obj - parseFloat( obj ) );
+};
+
+
+
+
+// Register as a named AMD module, since jQuery can be concatenated with other
+// files that may use define, but not via a proper concatenation script that
+// understands anonymous AMD modules. A named AMD is safest and most robust
+// way to register. Lowercase jquery is used because AMD module names are
+// derived from file names, and jQuery is normally delivered in a lowercase
+// file name. Do this after creating the global so that if an AMD module wants
+// to call noConflict to hide this version of jQuery, it will work.
+
+// Note that for maximum portability, libraries that are not jQuery should
+// declare themselves as anonymous modules, and avoid setting a global if an
+// AMD loader is present. jQuery is a special case. For more information, see
+// https://github.com/jrburke/requirejs/wiki/Updating-existing-libraries#wiki-anon
+
+if ( typeof define === "function" && define.amd ) {
+	define( "jquery", [], function() {
+		return jQuery;
+	} );
+}
+
+
+
+
+var
+
+	// Map over jQuery in case of overwrite
+	_jQuery = window.jQuery,
+
+	// Map over the $ in case of overwrite
+	_$ = window.$;
+
+jQuery.noConflict = function( deep ) {
+	if ( window.$ === jQuery ) {
+		window.$ = _$;
+	}
+
+	if ( deep && window.jQuery === jQuery ) {
+		window.jQuery = _jQuery;
+	}
+
+	return jQuery;
+};
+
+// Expose jQuery and $ identifiers, even in AMD
+// (#7102#comment:10, https://github.com/jquery/jquery/pull/557)
+// and CommonJS for browser emulators (#13566)
+if ( !noGlobal ) {
+	window.jQuery = window.$ = jQuery;
+}
+
+
+
+
+return jQuery;
+} );
+/**!
+ * @fileOverview Kickass library to create and place poppers near their reference elements.
+ * @version 1.14.5
+ * @license
+ * Copyright (c) 2016 Federico Zivolo and contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global.Popper = factory());
+}(this, (function () { 'use strict';
+
+var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined';
+
+var longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox'];
+var timeoutDuration = 0;
+for (var i = 0; i < longerTimeoutBrowsers.length; i += 1) {
+  if (isBrowser && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) {
+    timeoutDuration = 1;
+    break;
+  }
+}
+
+function microtaskDebounce(fn) {
+  var called = false;
+  return function () {
+    if (called) {
+      return;
+    }
+    called = true;
+    window.Promise.resolve().then(function () {
+      called = false;
+      fn();
+    });
+  };
+}
+
+function taskDebounce(fn) {
+  var scheduled = false;
+  return function () {
+    if (!scheduled) {
+      scheduled = true;
+      setTimeout(function () {
+        scheduled = false;
+        fn();
+      }, timeoutDuration);
+    }
+  };
+}
+
+var supportsMicroTasks = isBrowser && window.Promise;
+
+/**
+* Create a debounced version of a method, that's asynchronously deferred
+* but called in the minimum time possible.
+*
+* @method
+* @memberof Popper.Utils
+* @argument {Function} fn
+* @returns {Function}
+*/
+var debounce = supportsMicroTasks ? microtaskDebounce : taskDebounce;
+
+/**
+ * Check if the given variable is a function
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Any} functionToCheck - variable to check
+ * @returns {Boolean} answer to: is a function?
+ */
+function isFunction(functionToCheck) {
+  var getType = {};
+  return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
+}
+
+/**
+ * Get CSS computed property of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Eement} element
+ * @argument {String} property
+ */
+function getStyleComputedProperty(element, property) {
+  if (element.nodeType !== 1) {
+    return [];
+  }
+  // NOTE: 1 DOM access here
+  var window = element.ownerDocument.defaultView;
+  var css = window.getComputedStyle(element, null);
+  return property ? css[property] : css;
+}
+
+/**
+ * Returns the parentNode or the host of the element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} parent
+ */
+function getParentNode(element) {
+  if (element.nodeName === 'HTML') {
+    return element;
+  }
+  return element.parentNode || element.host;
+}
+
+/**
+ * Returns the scrolling parent of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} scroll parent
+ */
+function getScrollParent(element) {
+  // Return body, `getScroll` will take care to get the correct `scrollTop` from it
+  if (!element) {
+    return document.body;
+  }
+
+  switch (element.nodeName) {
+    case 'HTML':
+    case 'BODY':
+      return element.ownerDocument.body;
+    case '#document':
+      return element.body;
+  }
+
+  // Firefox want us to check `-x` and `-y` variations as well
+
+  var _getStyleComputedProp = getStyleComputedProperty(element),
+      overflow = _getStyleComputedProp.overflow,
+      overflowX = _getStyleComputedProp.overflowX,
+      overflowY = _getStyleComputedProp.overflowY;
+
+  if (/(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)) {
+    return element;
+  }
+
+  return getScrollParent(getParentNode(element));
+}
+
+var isIE11 = isBrowser && !!(window.MSInputMethodContext && document.documentMode);
+var isIE10 = isBrowser && /MSIE 10/.test(navigator.userAgent);
+
+/**
+ * Determines if the browser is Internet Explorer
+ * @method
+ * @memberof Popper.Utils
+ * @param {Number} version to check
+ * @returns {Boolean} isIE
+ */
+function isIE(version) {
+  if (version === 11) {
+    return isIE11;
+  }
+  if (version === 10) {
+    return isIE10;
+  }
+  return isIE11 || isIE10;
+}
+
+/**
+ * Returns the offset parent of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} offset parent
+ */
+function getOffsetParent(element) {
+  if (!element) {
+    return document.documentElement;
+  }
+
+  var noOffsetParent = isIE(10) ? document.body : null;
+
+  // NOTE: 1 DOM access here
+  var offsetParent = element.offsetParent || null;
+  // Skip hidden elements which don't have an offsetParent
+  while (offsetParent === noOffsetParent && element.nextElementSibling) {
+    offsetParent = (element = element.nextElementSibling).offsetParent;
+  }
+
+  var nodeName = offsetParent && offsetParent.nodeName;
+
+  if (!nodeName || nodeName === 'BODY' || nodeName === 'HTML') {
+    return element ? element.ownerDocument.documentElement : document.documentElement;
+  }
+
+  // .offsetParent will return the closest TH, TD or TABLE in case
+  // no offsetParent is present, I hate this job...
+  if (['TH', 'TD', 'TABLE'].indexOf(offsetParent.nodeName) !== -1 && getStyleComputedProperty(offsetParent, 'position') === 'static') {
+    return getOffsetParent(offsetParent);
+  }
+
+  return offsetParent;
+}
+
+function isOffsetContainer(element) {
+  var nodeName = element.nodeName;
+
+  if (nodeName === 'BODY') {
+    return false;
+  }
+  return nodeName === 'HTML' || getOffsetParent(element.firstElementChild) === element;
+}
+
+/**
+ * Finds the root node (document, shadowDOM root) of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} node
+ * @returns {Element} root node
+ */
+function getRoot(node) {
+  if (node.parentNode !== null) {
+    return getRoot(node.parentNode);
+  }
+
+  return node;
+}
+
+/**
+ * Finds the offset parent common to the two provided nodes
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element1
+ * @argument {Element} element2
+ * @returns {Element} common offset parent
+ */
+function findCommonOffsetParent(element1, element2) {
+  // This check is needed to avoid errors in case one of the elements isn't defined for any reason
+  if (!element1 || !element1.nodeType || !element2 || !element2.nodeType) {
+    return document.documentElement;
+  }
+
+  // Here we make sure to give as "start" the element that comes first in the DOM
+  var order = element1.compareDocumentPosition(element2) & Node.DOCUMENT_POSITION_FOLLOWING;
+  var start = order ? element1 : element2;
+  var end = order ? element2 : element1;
+
+  // Get common ancestor container
+  var range = document.createRange();
+  range.setStart(start, 0);
+  range.setEnd(end, 0);
+  var commonAncestorContainer = range.commonAncestorContainer;
+
+  // Both nodes are inside #document
+
+  if (element1 !== commonAncestorContainer && element2 !== commonAncestorContainer || start.contains(end)) {
+    if (isOffsetContainer(commonAncestorContainer)) {
+      return commonAncestorContainer;
+    }
+
+    return getOffsetParent(commonAncestorContainer);
+  }
+
+  // one of the nodes is inside shadowDOM, find which one
+  var element1root = getRoot(element1);
+  if (element1root.host) {
+    return findCommonOffsetParent(element1root.host, element2);
+  } else {
+    return findCommonOffsetParent(element1, getRoot(element2).host);
+  }
+}
+
+/**
+ * Gets the scroll value of the given element in the given side (top and left)
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @argument {String} side `top` or `left`
+ * @returns {number} amount of scrolled pixels
+ */
+function getScroll(element) {
+  var side = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'top';
+
+  var upperSide = side === 'top' ? 'scrollTop' : 'scrollLeft';
+  var nodeName = element.nodeName;
+
+  if (nodeName === 'BODY' || nodeName === 'HTML') {
+    var html = element.ownerDocument.documentElement;
+    var scrollingElement = element.ownerDocument.scrollingElement || html;
+    return scrollingElement[upperSide];
+  }
+
+  return element[upperSide];
+}
+
+/*
+ * Sum or subtract the element scroll values (left and top) from a given rect object
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} rect - Rect object you want to change
+ * @param {HTMLElement} element - The element from the function reads the scroll values
+ * @param {Boolean} subtract - set to true if you want to subtract the scroll values
+ * @return {Object} rect - The modifier rect object
+ */
+function includeScroll(rect, element) {
+  var subtract = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+  var scrollTop = getScroll(element, 'top');
+  var scrollLeft = getScroll(element, 'left');
+  var modifier = subtract ? -1 : 1;
+  rect.top += scrollTop * modifier;
+  rect.bottom += scrollTop * modifier;
+  rect.left += scrollLeft * modifier;
+  rect.right += scrollLeft * modifier;
+  return rect;
+}
+
+/*
+ * Helper to detect borders of a given element
+ * @method
+ * @memberof Popper.Utils
+ * @param {CSSStyleDeclaration} styles
+ * Result of `getStyleComputedProperty` on the given element
+ * @param {String} axis - `x` or `y`
+ * @return {number} borders - The borders size of the given axis
+ */
+
+function getBordersSize(styles, axis) {
+  var sideA = axis === 'x' ? 'Left' : 'Top';
+  var sideB = sideA === 'Left' ? 'Right' : 'Bottom';
+
+  return parseFloat(styles['border' + sideA + 'Width'], 10) + parseFloat(styles['border' + sideB + 'Width'], 10);
+}
+
+function getSize(axis, body, html, computedStyle) {
+  return Math.max(body['offset' + axis], body['scroll' + axis], html['client' + axis], html['offset' + axis], html['scroll' + axis], isIE(10) ? parseInt(html['offset' + axis]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Top' : 'Left')]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Bottom' : 'Right')]) : 0);
+}
+
+function getWindowSizes(document) {
+  var body = document.body;
+  var html = document.documentElement;
+  var computedStyle = isIE(10) && getComputedStyle(html);
+
+  return {
+    height: getSize('Height', body, html, computedStyle),
+    width: getSize('Width', body, html, computedStyle)
+  };
+}
+
+var classCallCheck = function (instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+var createClass = function () {
+  function defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  return function (Constructor, protoProps, staticProps) {
+    if (protoProps) defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) defineProperties(Constructor, staticProps);
+    return Constructor;
+  };
+}();
+
+
+
+
+
+var defineProperty = function (obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+};
+
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
+
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
+
+  return target;
+};
+
+/**
+ * Given element offsets, generate an output similar to getBoundingClientRect
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Object} offsets
+ * @returns {Object} ClientRect like output
+ */
+function getClientRect(offsets) {
+  return _extends({}, offsets, {
+    right: offsets.left + offsets.width,
+    bottom: offsets.top + offsets.height
+  });
+}
+
+/**
+ * Get bounding client rect of given element
+ * @method
+ * @memberof Popper.Utils
+ * @param {HTMLElement} element
+ * @return {Object} client rect
+ */
+function getBoundingClientRect(element) {
+  var rect = {};
+
+  // IE10 10 FIX: Please, don't ask, the element isn't
+  // considered in DOM in some circumstances...
+  // This isn't reproducible in IE10 compatibility mode of IE11
+  try {
+    if (isIE(10)) {
+      rect = element.getBoundingClientRect();
+      var scrollTop = getScroll(element, 'top');
+      var scrollLeft = getScroll(element, 'left');
+      rect.top += scrollTop;
+      rect.left += scrollLeft;
+      rect.bottom += scrollTop;
+      rect.right += scrollLeft;
+    } else {
+      rect = element.getBoundingClientRect();
+    }
+  } catch (e) {}
+
+  var result = {
+    left: rect.left,
+    top: rect.top,
+    width: rect.right - rect.left,
+    height: rect.bottom - rect.top
+  };
+
+  // subtract scrollbar size from sizes
+  var sizes = element.nodeName === 'HTML' ? getWindowSizes(element.ownerDocument) : {};
+  var width = sizes.width || element.clientWidth || result.right - result.left;
+  var height = sizes.height || element.clientHeight || result.bottom - result.top;
+
+  var horizScrollbar = element.offsetWidth - width;
+  var vertScrollbar = element.offsetHeight - height;
+
+  // if an hypothetical scrollbar is detected, we must be sure it's not a `border`
+  // we make this check conditional for performance reasons
+  if (horizScrollbar || vertScrollbar) {
+    var styles = getStyleComputedProperty(element);
+    horizScrollbar -= getBordersSize(styles, 'x');
+    vertScrollbar -= getBordersSize(styles, 'y');
+
+    result.width -= horizScrollbar;
+    result.height -= vertScrollbar;
+  }
+
+  return getClientRect(result);
+}
+
+function getOffsetRectRelativeToArbitraryNode(children, parent) {
+  var fixedPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+  var isIE10 = isIE(10);
+  var isHTML = parent.nodeName === 'HTML';
+  var childrenRect = getBoundingClientRect(children);
+  var parentRect = getBoundingClientRect(parent);
+  var scrollParent = getScrollParent(children);
+
+  var styles = getStyleComputedProperty(parent);
+  var borderTopWidth = parseFloat(styles.borderTopWidth, 10);
+  var borderLeftWidth = parseFloat(styles.borderLeftWidth, 10);
+
+  // In cases where the parent is fixed, we must ignore negative scroll in offset calc
+  if (fixedPosition && isHTML) {
+    parentRect.top = Math.max(parentRect.top, 0);
+    parentRect.left = Math.max(parentRect.left, 0);
+  }
+  var offsets = getClientRect({
+    top: childrenRect.top - parentRect.top - borderTopWidth,
+    left: childrenRect.left - parentRect.left - borderLeftWidth,
+    width: childrenRect.width,
+    height: childrenRect.height
+  });
+  offsets.marginTop = 0;
+  offsets.marginLeft = 0;
+
+  // Subtract margins of documentElement in case it's being used as parent
+  // we do this only on HTML because it's the only element that behaves
+  // differently when margins are applied to it. The margins are included in
+  // the box of the documentElement, in the other cases not.
+  if (!isIE10 && isHTML) {
+    var marginTop = parseFloat(styles.marginTop, 10);
+    var marginLeft = parseFloat(styles.marginLeft, 10);
+
+    offsets.top -= borderTopWidth - marginTop;
+    offsets.bottom -= borderTopWidth - marginTop;
+    offsets.left -= borderLeftWidth - marginLeft;
+    offsets.right -= borderLeftWidth - marginLeft;
+
+    // Attach marginTop and marginLeft because in some circumstances we may need them
+    offsets.marginTop = marginTop;
+    offsets.marginLeft = marginLeft;
+  }
+
+  if (isIE10 && !fixedPosition ? parent.contains(scrollParent) : parent === scrollParent && scrollParent.nodeName !== 'BODY') {
+    offsets = includeScroll(offsets, parent);
+  }
+
+  return offsets;
+}
+
+function getViewportOffsetRectRelativeToArtbitraryNode(element) {
+  var excludeScroll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var html = element.ownerDocument.documentElement;
+  var relativeOffset = getOffsetRectRelativeToArbitraryNode(element, html);
+  var width = Math.max(html.clientWidth, window.innerWidth || 0);
+  var height = Math.max(html.clientHeight, window.innerHeight || 0);
+
+  var scrollTop = !excludeScroll ? getScroll(html) : 0;
+  var scrollLeft = !excludeScroll ? getScroll(html, 'left') : 0;
+
+  var offset = {
+    top: scrollTop - relativeOffset.top + relativeOffset.marginTop,
+    left: scrollLeft - relativeOffset.left + relativeOffset.marginLeft,
+    width: width,
+    height: height
+  };
+
+  return getClientRect(offset);
+}
+
+/**
+ * Check if the given element is fixed or is inside a fixed parent
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @argument {Element} customContainer
+ * @returns {Boolean} answer to "isFixed?"
+ */
+function isFixed(element) {
+  var nodeName = element.nodeName;
+  if (nodeName === 'BODY' || nodeName === 'HTML') {
+    return false;
+  }
+  if (getStyleComputedProperty(element, 'position') === 'fixed') {
+    return true;
+  }
+  return isFixed(getParentNode(element));
+}
+
+/**
+ * Finds the first parent of an element that has a transformed property defined
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} first transformed parent or documentElement
+ */
+
+function getFixedPositionOffsetParent(element) {
+  // This check is needed to avoid errors in case one of the elements isn't defined for any reason
+  if (!element || !element.parentElement || isIE()) {
+    return document.documentElement;
+  }
+  var el = element.parentElement;
+  while (el && getStyleComputedProperty(el, 'transform') === 'none') {
+    el = el.parentElement;
+  }
+  return el || document.documentElement;
+}
+
+/**
+ * Computed the boundaries limits and return them
+ * @method
+ * @memberof Popper.Utils
+ * @param {HTMLElement} popper
+ * @param {HTMLElement} reference
+ * @param {number} padding
+ * @param {HTMLElement} boundariesElement - Element used to define the boundaries
+ * @param {Boolean} fixedPosition - Is in fixed position mode
+ * @returns {Object} Coordinates of the boundaries
+ */
+function getBoundaries(popper, reference, padding, boundariesElement) {
+  var fixedPosition = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
+
+  // NOTE: 1 DOM access here
+
+  var boundaries = { top: 0, left: 0 };
+  var offsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference);
+
+  // Handle viewport case
+  if (boundariesElement === 'viewport') {
+    boundaries = getViewportOffsetRectRelativeToArtbitraryNode(offsetParent, fixedPosition);
+  } else {
+    // Handle other cases based on DOM element used as boundaries
+    var boundariesNode = void 0;
+    if (boundariesElement === 'scrollParent') {
+      boundariesNode = getScrollParent(getParentNode(reference));
+      if (boundariesNode.nodeName === 'BODY') {
+        boundariesNode = popper.ownerDocument.documentElement;
+      }
+    } else if (boundariesElement === 'window') {
+      boundariesNode = popper.ownerDocument.documentElement;
+    } else {
+      boundariesNode = boundariesElement;
+    }
+
+    var offsets = getOffsetRectRelativeToArbitraryNode(boundariesNode, offsetParent, fixedPosition);
+
+    // In case of HTML, we need a different computation
+    if (boundariesNode.nodeName === 'HTML' && !isFixed(offsetParent)) {
+      var _getWindowSizes = getWindowSizes(popper.ownerDocument),
+          height = _getWindowSizes.height,
+          width = _getWindowSizes.width;
+
+      boundaries.top += offsets.top - offsets.marginTop;
+      boundaries.bottom = height + offsets.top;
+      boundaries.left += offsets.left - offsets.marginLeft;
+      boundaries.right = width + offsets.left;
+    } else {
+      // for all the other DOM elements, this one is good
+      boundaries = offsets;
+    }
+  }
+
+  // Add paddings
+  padding = padding || 0;
+  var isPaddingNumber = typeof padding === 'number';
+  boundaries.left += isPaddingNumber ? padding : padding.left || 0;
+  boundaries.top += isPaddingNumber ? padding : padding.top || 0;
+  boundaries.right -= isPaddingNumber ? padding : padding.right || 0;
+  boundaries.bottom -= isPaddingNumber ? padding : padding.bottom || 0;
+
+  return boundaries;
+}
+
+function getArea(_ref) {
+  var width = _ref.width,
+      height = _ref.height;
+
+  return width * height;
+}
+
+/**
+ * Utility used to transform the `auto` placement to the placement with more
+ * available space.
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function computeAutoPlacement(placement, refRect, popper, reference, boundariesElement) {
+  var padding = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0;
+
+  if (placement.indexOf('auto') === -1) {
+    return placement;
+  }
+
+  var boundaries = getBoundaries(popper, reference, padding, boundariesElement);
+
+  var rects = {
+    top: {
+      width: boundaries.width,
+      height: refRect.top - boundaries.top
+    },
+    right: {
+      width: boundaries.right - refRect.right,
+      height: boundaries.height
+    },
+    bottom: {
+      width: boundaries.width,
+      height: boundaries.bottom - refRect.bottom
+    },
+    left: {
+      width: refRect.left - boundaries.left,
+      height: boundaries.height
+    }
+  };
+
+  var sortedAreas = Object.keys(rects).map(function (key) {
+    return _extends({
+      key: key
+    }, rects[key], {
+      area: getArea(rects[key])
+    });
+  }).sort(function (a, b) {
+    return b.area - a.area;
+  });
+
+  var filteredAreas = sortedAreas.filter(function (_ref2) {
+    var width = _ref2.width,
+        height = _ref2.height;
+    return width >= popper.clientWidth && height >= popper.clientHeight;
+  });
+
+  var computedPlacement = filteredAreas.length > 0 ? filteredAreas[0].key : sortedAreas[0].key;
+
+  var variation = placement.split('-')[1];
+
+  return computedPlacement + (variation ? '-' + variation : '');
+}
+
+/**
+ * Get offsets to the reference element
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} state
+ * @param {Element} popper - the popper element
+ * @param {Element} reference - the reference element (the popper will be relative to this)
+ * @param {Element} fixedPosition - is in fixed position mode
+ * @returns {Object} An object containing the offsets which will be applied to the popper
+ */
+function getReferenceOffsets(state, popper, reference) {
+  var fixedPosition = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+
+  var commonOffsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference);
+  return getOffsetRectRelativeToArbitraryNode(reference, commonOffsetParent, fixedPosition);
+}
+
+/**
+ * Get the outer sizes of the given element (offset size + margins)
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Object} object containing width and height properties
+ */
+function getOuterSizes(element) {
+  var window = element.ownerDocument.defaultView;
+  var styles = window.getComputedStyle(element);
+  var x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
+  var y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);
+  var result = {
+    width: element.offsetWidth + y,
+    height: element.offsetHeight + x
+  };
+  return result;
+}
+
+/**
+ * Get the opposite placement of the given one
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement
+ * @returns {String} flipped placement
+ */
+function getOppositePlacement(placement) {
+  var hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' };
+  return placement.replace(/left|right|bottom|top/g, function (matched) {
+    return hash[matched];
+  });
+}
+
+/**
+ * Get offsets to the popper
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} position - CSS position the Popper will get applied
+ * @param {HTMLElement} popper - the popper element
+ * @param {Object} referenceOffsets - the reference offsets (the popper will be relative to this)
+ * @param {String} placement - one of the valid placement options
+ * @returns {Object} popperOffsets - An object containing the offsets which will be applied to the popper
+ */
+function getPopperOffsets(popper, referenceOffsets, placement) {
+  placement = placement.split('-')[0];
+
+  // Get popper node sizes
+  var popperRect = getOuterSizes(popper);
+
+  // Add position, width and height to our offsets object
+  var popperOffsets = {
+    width: popperRect.width,
+    height: popperRect.height
+  };
+
+  // depending by the popper placement we have to compute its offsets slightly differently
+  var isHoriz = ['right', 'left'].indexOf(placement) !== -1;
+  var mainSide = isHoriz ? 'top' : 'left';
+  var secondarySide = isHoriz ? 'left' : 'top';
+  var measurement = isHoriz ? 'height' : 'width';
+  var secondaryMeasurement = !isHoriz ? 'height' : 'width';
+
+  popperOffsets[mainSide] = referenceOffsets[mainSide] + referenceOffsets[measurement] / 2 - popperRect[measurement] / 2;
+  if (placement === secondarySide) {
+    popperOffsets[secondarySide] = referenceOffsets[secondarySide] - popperRect[secondaryMeasurement];
+  } else {
+    popperOffsets[secondarySide] = referenceOffsets[getOppositePlacement(secondarySide)];
+  }
+
+  return popperOffsets;
+}
+
+/**
+ * Mimics the `find` method of Array
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Array} arr
+ * @argument prop
+ * @argument value
+ * @returns index or -1
+ */
+function find(arr, check) {
+  // use native find if supported
+  if (Array.prototype.find) {
+    return arr.find(check);
+  }
+
+  // use `filter` to obtain the same behavior of `find`
+  return arr.filter(check)[0];
+}
+
+/**
+ * Return the index of the matching object
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Array} arr
+ * @argument prop
+ * @argument value
+ * @returns index or -1
+ */
+function findIndex(arr, prop, value) {
+  // use native findIndex if supported
+  if (Array.prototype.findIndex) {
+    return arr.findIndex(function (cur) {
+      return cur[prop] === value;
+    });
+  }
+
+  // use `find` + `indexOf` if `findIndex` isn't supported
+  var match = find(arr, function (obj) {
+    return obj[prop] === value;
+  });
+  return arr.indexOf(match);
+}
+
+/**
+ * Loop trough the list of modifiers and run them in order,
+ * each of them will then edit the data object.
+ * @method
+ * @memberof Popper.Utils
+ * @param {dataObject} data
+ * @param {Array} modifiers
+ * @param {String} ends - Optional modifier name used as stopper
+ * @returns {dataObject}
+ */
+function runModifiers(modifiers, data, ends) {
+  var modifiersToRun = ends === undefined ? modifiers : modifiers.slice(0, findIndex(modifiers, 'name', ends));
+
+  modifiersToRun.forEach(function (modifier) {
+    if (modifier['function']) {
+      // eslint-disable-line dot-notation
+      console.warn('`modifier.function` is deprecated, use `modifier.fn`!');
+    }
+    var fn = modifier['function'] || modifier.fn; // eslint-disable-line dot-notation
+    if (modifier.enabled && isFunction(fn)) {
+      // Add properties to offsets to make them a complete clientRect object
+      // we do this before each modifier to make sure the previous one doesn't
+      // mess with these values
+      data.offsets.popper = getClientRect(data.offsets.popper);
+      data.offsets.reference = getClientRect(data.offsets.reference);
+
+      data = fn(data, modifier);
+    }
+  });
+
+  return data;
+}
+
+/**
+ * Updates the position of the popper, computing the new offsets and applying
+ * the new style.<br />
+ * Prefer `scheduleUpdate` over `update` because of performance reasons.
+ * @method
+ * @memberof Popper
+ */
+function update() {
+  // if popper is destroyed, don't perform any further update
+  if (this.state.isDestroyed) {
+    return;
+  }
+
+  var data = {
+    instance: this,
+    styles: {},
+    arrowStyles: {},
+    attributes: {},
+    flipped: false,
+    offsets: {}
+  };
+
+  // compute reference element offsets
+  data.offsets.reference = getReferenceOffsets(this.state, this.popper, this.reference, this.options.positionFixed);
+
+  // compute auto placement, store placement inside the data object,
+  // modifiers will be able to edit `placement` if needed
+  // and refer to originalPlacement to know the original value
+  data.placement = computeAutoPlacement(this.options.placement, data.offsets.reference, this.popper, this.reference, this.options.modifiers.flip.boundariesElement, this.options.modifiers.flip.padding);
+
+  // store the computed placement inside `originalPlacement`
+  data.originalPlacement = data.placement;
+
+  data.positionFixed = this.options.positionFixed;
+
+  // compute the popper offsets
+  data.offsets.popper = getPopperOffsets(this.popper, data.offsets.reference, data.placement);
+
+  data.offsets.popper.position = this.options.positionFixed ? 'fixed' : 'absolute';
+
+  // run the modifiers
+  data = runModifiers(this.modifiers, data);
+
+  // the first `update` will call `onCreate` callback
+  // the other ones will call `onUpdate` callback
+  if (!this.state.isCreated) {
+    this.state.isCreated = true;
+    this.options.onCreate(data);
+  } else {
+    this.options.onUpdate(data);
+  }
+}
+
+/**
+ * Helper used to know if the given modifier is enabled.
+ * @method
+ * @memberof Popper.Utils
+ * @returns {Boolean}
+ */
+function isModifierEnabled(modifiers, modifierName) {
+  return modifiers.some(function (_ref) {
+    var name = _ref.name,
+        enabled = _ref.enabled;
+    return enabled && name === modifierName;
+  });
+}
+
+/**
+ * Get the prefixed supported property name
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} property (camelCase)
+ * @returns {String} prefixed property (camelCase or PascalCase, depending on the vendor prefix)
+ */
+function getSupportedPropertyName(property) {
+  var prefixes = [false, 'ms', 'Webkit', 'Moz', 'O'];
+  var upperProp = property.charAt(0).toUpperCase() + property.slice(1);
+
+  for (var i = 0; i < prefixes.length; i++) {
+    var prefix = prefixes[i];
+    var toCheck = prefix ? '' + prefix + upperProp : property;
+    if (typeof document.body.style[toCheck] !== 'undefined') {
+      return toCheck;
+    }
+  }
+  return null;
+}
+
+/**
+ * Destroys the popper.
+ * @method
+ * @memberof Popper
+ */
+function destroy() {
+  this.state.isDestroyed = true;
+
+  // touch DOM only if `applyStyle` modifier is enabled
+  if (isModifierEnabled(this.modifiers, 'applyStyle')) {
+    this.popper.removeAttribute('x-placement');
+    this.popper.style.position = '';
+    this.popper.style.top = '';
+    this.popper.style.left = '';
+    this.popper.style.right = '';
+    this.popper.style.bottom = '';
+    this.popper.style.willChange = '';
+    this.popper.style[getSupportedPropertyName('transform')] = '';
+  }
+
+  this.disableEventListeners();
+
+  // remove the popper if user explicity asked for the deletion on destroy
+  // do not use `remove` because IE11 doesn't support it
+  if (this.options.removeOnDestroy) {
+    this.popper.parentNode.removeChild(this.popper);
+  }
+  return this;
+}
+
+/**
+ * Get the window associated with the element
+ * @argument {Element} element
+ * @returns {Window}
+ */
+function getWindow(element) {
+  var ownerDocument = element.ownerDocument;
+  return ownerDocument ? ownerDocument.defaultView : window;
+}
+
+function attachToScrollParents(scrollParent, event, callback, scrollParents) {
+  var isBody = scrollParent.nodeName === 'BODY';
+  var target = isBody ? scrollParent.ownerDocument.defaultView : scrollParent;
+  target.addEventListener(event, callback, { passive: true });
+
+  if (!isBody) {
+    attachToScrollParents(getScrollParent(target.parentNode), event, callback, scrollParents);
+  }
+  scrollParents.push(target);
+}
+
+/**
+ * Setup needed event listeners used to update the popper position
+ * @method
+ * @memberof Popper.Utils
+ * @private
+ */
+function setupEventListeners(reference, options, state, updateBound) {
+  // Resize event listener on window
+  state.updateBound = updateBound;
+  getWindow(reference).addEventListener('resize', state.updateBound, { passive: true });
+
+  // Scroll event listener on scroll parents
+  var scrollElement = getScrollParent(reference);
+  attachToScrollParents(scrollElement, 'scroll', state.updateBound, state.scrollParents);
+  state.scrollElement = scrollElement;
+  state.eventsEnabled = true;
+
+  return state;
+}
+
+/**
+ * It will add resize/scroll events and start recalculating
+ * position of the popper element when they are triggered.
+ * @method
+ * @memberof Popper
+ */
+function enableEventListeners() {
+  if (!this.state.eventsEnabled) {
+    this.state = setupEventListeners(this.reference, this.options, this.state, this.scheduleUpdate);
+  }
+}
+
+/**
+ * Remove event listeners used to update the popper position
+ * @method
+ * @memberof Popper.Utils
+ * @private
+ */
+function removeEventListeners(reference, state) {
+  // Remove resize event listener on window
+  getWindow(reference).removeEventListener('resize', state.updateBound);
+
+  // Remove scroll event listener on scroll parents
+  state.scrollParents.forEach(function (target) {
+    target.removeEventListener('scroll', state.updateBound);
+  });
+
+  // Reset state
+  state.updateBound = null;
+  state.scrollParents = [];
+  state.scrollElement = null;
+  state.eventsEnabled = false;
+  return state;
+}
+
+/**
+ * It will remove resize/scroll events and won't recalculate popper position
+ * when they are triggered. It also won't trigger `onUpdate` callback anymore,
+ * unless you call `update` method manually.
+ * @method
+ * @memberof Popper
+ */
+function disableEventListeners() {
+  if (this.state.eventsEnabled) {
+    cancelAnimationFrame(this.scheduleUpdate);
+    this.state = removeEventListeners(this.reference, this.state);
+  }
+}
+
+/**
+ * Tells if a given input is a number
+ * @method
+ * @memberof Popper.Utils
+ * @param {*} input to check
+ * @return {Boolean}
+ */
+function isNumeric(n) {
+  return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);
+}
+
+/**
+ * Set the style to the given popper
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element - Element to apply the style to
+ * @argument {Object} styles
+ * Object with a list of properties and values which will be applied to the element
+ */
+function setStyles(element, styles) {
+  Object.keys(styles).forEach(function (prop) {
+    var unit = '';
+    // add unit if the value is numeric and is one of the following
+    if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && isNumeric(styles[prop])) {
+      unit = 'px';
+    }
+    element.style[prop] = styles[prop] + unit;
+  });
+}
+
+/**
+ * Set the attributes to the given popper
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element - Element to apply the attributes to
+ * @argument {Object} styles
+ * Object with a list of properties and values which will be applied to the element
+ */
+function setAttributes(element, attributes) {
+  Object.keys(attributes).forEach(function (prop) {
+    var value = attributes[prop];
+    if (value !== false) {
+      element.setAttribute(prop, attributes[prop]);
+    } else {
+      element.removeAttribute(prop);
+    }
+  });
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} data.styles - List of style properties - values to apply to popper element
+ * @argument {Object} data.attributes - List of attribute properties - values to apply to popper element
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The same data object
+ */
+function applyStyle(data) {
+  // any property present in `data.styles` will be applied to the popper,
+  // in this way we can make the 3rd party modifiers add custom styles to it
+  // Be aware, modifiers could override the properties defined in the previous
+  // lines of this modifier!
+  setStyles(data.instance.popper, data.styles);
+
+  // any property present in `data.attributes` will be applied to the popper,
+  // they will be set as HTML attributes of the element
+  setAttributes(data.instance.popper, data.attributes);
+
+  // if arrowElement is defined and arrowStyles has some properties
+  if (data.arrowElement && Object.keys(data.arrowStyles).length) {
+    setStyles(data.arrowElement, data.arrowStyles);
+  }
+
+  return data;
+}
+
+/**
+ * Set the x-placement attribute before everything else because it could be used
+ * to add margins to the popper margins needs to be calculated to get the
+ * correct popper offsets.
+ * @method
+ * @memberof Popper.modifiers
+ * @param {HTMLElement} reference - The reference element used to position the popper
+ * @param {HTMLElement} popper - The HTML element used as popper
+ * @param {Object} options - Popper.js options
+ */
+function applyStyleOnLoad(reference, popper, options, modifierOptions, state) {
+  // compute reference element offsets
+  var referenceOffsets = getReferenceOffsets(state, popper, reference, options.positionFixed);
+
+  // compute auto placement, store placement inside the data object,
+  // modifiers will be able to edit `placement` if needed
+  // and refer to originalPlacement to know the original value
+  var placement = computeAutoPlacement(options.placement, referenceOffsets, popper, reference, options.modifiers.flip.boundariesElement, options.modifiers.flip.padding);
+
+  popper.setAttribute('x-placement', placement);
+
+  // Apply `position` to popper before anything else because
+  // without the position applied we can't guarantee correct computations
+  setStyles(popper, { position: options.positionFixed ? 'fixed' : 'absolute' });
+
+  return options;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function computeStyle(data, options) {
+  var x = options.x,
+      y = options.y;
+  var popper = data.offsets.popper;
+
+  // Remove this legacy support in Popper.js v2
+
+  var legacyGpuAccelerationOption = find(data.instance.modifiers, function (modifier) {
+    return modifier.name === 'applyStyle';
+  }).gpuAcceleration;
+  if (legacyGpuAccelerationOption !== undefined) {
+    console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!');
+  }
+  var gpuAcceleration = legacyGpuAccelerationOption !== undefined ? legacyGpuAccelerationOption : options.gpuAcceleration;
+
+  var offsetParent = getOffsetParent(data.instance.popper);
+  var offsetParentRect = getBoundingClientRect(offsetParent);
+
+  // Styles
+  var styles = {
+    position: popper.position
+  };
+
+  // Avoid blurry text by using full pixel integers.
+  // For pixel-perfect positioning, top/bottom prefers rounded
+  // values, while left/right prefers floored values.
+  var offsets = {
+    left: Math.floor(popper.left),
+    top: Math.round(popper.top),
+    bottom: Math.round(popper.bottom),
+    right: Math.floor(popper.right)
+  };
+
+  var sideA = x === 'bottom' ? 'top' : 'bottom';
+  var sideB = y === 'right' ? 'left' : 'right';
+
+  // if gpuAcceleration is set to `true` and transform is supported,
+  //  we use `translate3d` to apply the position to the popper we
+  // automatically use the supported prefixed version if needed
+  var prefixedProperty = getSupportedPropertyName('transform');
+
+  // now, let's make a step back and look at this code closely (wtf?)
+  // If the content of the popper grows once it's been positioned, it
+  // may happen that the popper gets misplaced because of the new content
+  // overflowing its reference element
+  // To avoid this problem, we provide two options (x and y), which allow
+  // the consumer to define the offset origin.
+  // If we position a popper on top of a reference element, we can set
+  // `x` to `top` to make the popper grow towards its top instead of
+  // its bottom.
+  var left = void 0,
+      top = void 0;
+  if (sideA === 'bottom') {
+    // when offsetParent is <html> the positioning is relative to the bottom of the screen (excluding the scrollbar)
+    // and not the bottom of the html element
+    if (offsetParent.nodeName === 'HTML') {
+      top = -offsetParent.clientHeight + offsets.bottom;
+    } else {
+      top = -offsetParentRect.height + offsets.bottom;
+    }
+  } else {
+    top = offsets.top;
+  }
+  if (sideB === 'right') {
+    if (offsetParent.nodeName === 'HTML') {
+      left = -offsetParent.clientWidth + offsets.right;
+    } else {
+      left = -offsetParentRect.width + offsets.right;
+    }
+  } else {
+    left = offsets.left;
+  }
+  if (gpuAcceleration && prefixedProperty) {
+    styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';
+    styles[sideA] = 0;
+    styles[sideB] = 0;
+    styles.willChange = 'transform';
+  } else {
+    // othwerise, we use the standard `top`, `left`, `bottom` and `right` properties
+    var invertTop = sideA === 'bottom' ? -1 : 1;
+    var invertLeft = sideB === 'right' ? -1 : 1;
+    styles[sideA] = top * invertTop;
+    styles[sideB] = left * invertLeft;
+    styles.willChange = sideA + ', ' + sideB;
+  }
+
+  // Attributes
+  var attributes = {
+    'x-placement': data.placement
+  };
+
+  // Update `data` attributes, styles and arrowStyles
+  data.attributes = _extends({}, attributes, data.attributes);
+  data.styles = _extends({}, styles, data.styles);
+  data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);
+
+  return data;
+}
+
+/**
+ * Helper used to know if the given modifier depends from another one.<br />
+ * It checks if the needed modifier is listed and enabled.
+ * @method
+ * @memberof Popper.Utils
+ * @param {Array} modifiers - list of modifiers
+ * @param {String} requestingName - name of requesting modifier
+ * @param {String} requestedName - name of requested modifier
+ * @returns {Boolean}
+ */
+function isModifierRequired(modifiers, requestingName, requestedName) {
+  var requesting = find(modifiers, function (_ref) {
+    var name = _ref.name;
+    return name === requestingName;
+  });
+
+  var isRequired = !!requesting && modifiers.some(function (modifier) {
+    return modifier.name === requestedName && modifier.enabled && modifier.order < requesting.order;
+  });
+
+  if (!isRequired) {
+    var _requesting = '`' + requestingName + '`';
+    var requested = '`' + requestedName + '`';
+    console.warn(requested + ' modifier is required by ' + _requesting + ' modifier in order to work, be sure to include it before ' + _requesting + '!');
+  }
+  return isRequired;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function arrow(data, options) {
+  var _data$offsets$arrow;
+
+  // arrow depends on keepTogether in order to work
+  if (!isModifierRequired(data.instance.modifiers, 'arrow', 'keepTogether')) {
+    return data;
+  }
+
+  var arrowElement = options.element;
+
+  // if arrowElement is a string, suppose it's a CSS selector
+  if (typeof arrowElement === 'string') {
+    arrowElement = data.instance.popper.querySelector(arrowElement);
+
+    // if arrowElement is not found, don't run the modifier
+    if (!arrowElement) {
+      return data;
+    }
+  } else {
+    // if the arrowElement isn't a query selector we must check that the
+    // provided DOM node is child of its popper node
+    if (!data.instance.popper.contains(arrowElement)) {
+      console.warn('WARNING: `arrow.element` must be child of its popper element!');
+      return data;
+    }
+  }
+
+  var placement = data.placement.split('-')[0];
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var isVertical = ['left', 'right'].indexOf(placement) !== -1;
+
+  var len = isVertical ? 'height' : 'width';
+  var sideCapitalized = isVertical ? 'Top' : 'Left';
+  var side = sideCapitalized.toLowerCase();
+  var altSide = isVertical ? 'left' : 'top';
+  var opSide = isVertical ? 'bottom' : 'right';
+  var arrowElementSize = getOuterSizes(arrowElement)[len];
+
+  //
+  // extends keepTogether behavior making sure the popper and its
+  // reference have enough pixels in conjunction
+  //
+
+  // top/left side
+  if (reference[opSide] - arrowElementSize < popper[side]) {
+    data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowElementSize);
+  }
+  // bottom/right side
+  if (reference[side] + arrowElementSize > popper[opSide]) {
+    data.offsets.popper[side] += reference[side] + arrowElementSize - popper[opSide];
+  }
+  data.offsets.popper = getClientRect(data.offsets.popper);
+
+  // compute center of the popper
+  var center = reference[side] + reference[len] / 2 - arrowElementSize / 2;
+
+  // Compute the sideValue using the updated popper offsets
+  // take popper margin in account because we don't have this info available
+  var css = getStyleComputedProperty(data.instance.popper);
+  var popperMarginSide = parseFloat(css['margin' + sideCapitalized], 10);
+  var popperBorderSide = parseFloat(css['border' + sideCapitalized + 'Width'], 10);
+  var sideValue = center - data.offsets.popper[side] - popperMarginSide - popperBorderSide;
+
+  // prevent arrowElement from being placed not contiguously to its popper
+  sideValue = Math.max(Math.min(popper[len] - arrowElementSize, sideValue), 0);
+
+  data.arrowElement = arrowElement;
+  data.offsets.arrow = (_data$offsets$arrow = {}, defineProperty(_data$offsets$arrow, side, Math.round(sideValue)), defineProperty(_data$offsets$arrow, altSide, ''), _data$offsets$arrow);
+
+  return data;
+}
+
+/**
+ * Get the opposite placement variation of the given one
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement variation
+ * @returns {String} flipped placement variation
+ */
+function getOppositeVariation(variation) {
+  if (variation === 'end') {
+    return 'start';
+  } else if (variation === 'start') {
+    return 'end';
+  }
+  return variation;
+}
+
+/**
+ * List of accepted placements to use as values of the `placement` option.<br />
+ * Valid placements are:
+ * - `auto`
+ * - `top`
+ * - `right`
+ * - `bottom`
+ * - `left`
+ *
+ * Each placement can have a variation from this list:
+ * - `-start`
+ * - `-end`
+ *
+ * Variations are interpreted easily if you think of them as the left to right
+ * written languages. Horizontally (`top` and `bottom`), `start` is left and `end`
+ * is right.<br />
+ * Vertically (`left` and `right`), `start` is top and `end` is bottom.
+ *
+ * Some valid examples are:
+ * - `top-end` (on top of reference, right aligned)
+ * - `right-start` (on right of reference, top aligned)
+ * - `bottom` (on bottom, centered)
+ * - `auto-end` (on the side with more space available, alignment depends by placement)
+ *
+ * @static
+ * @type {Array}
+ * @enum {String}
+ * @readonly
+ * @method placements
+ * @memberof Popper
+ */
+var placements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];
+
+// Get rid of `auto` `auto-start` and `auto-end`
+var validPlacements = placements.slice(3);
+
+/**
+ * Given an initial placement, returns all the subsequent placements
+ * clockwise (or counter-clockwise).
+ *
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement - A valid placement (it accepts variations)
+ * @argument {Boolean} counter - Set to true to walk the placements counterclockwise
+ * @returns {Array} placements including their variations
+ */
+function clockwise(placement) {
+  var counter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var index = validPlacements.indexOf(placement);
+  var arr = validPlacements.slice(index + 1).concat(validPlacements.slice(0, index));
+  return counter ? arr.reverse() : arr;
+}
+
+var BEHAVIORS = {
+  FLIP: 'flip',
+  CLOCKWISE: 'clockwise',
+  COUNTERCLOCKWISE: 'counterclockwise'
+};
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function flip(data, options) {
+  // if `inner` modifier is enabled, we can't use the `flip` modifier
+  if (isModifierEnabled(data.instance.modifiers, 'inner')) {
+    return data;
+  }
+
+  if (data.flipped && data.placement === data.originalPlacement) {
+    // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides
+    return data;
+  }
+
+  var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, options.boundariesElement, data.positionFixed);
+
+  var placement = data.placement.split('-')[0];
+  var placementOpposite = getOppositePlacement(placement);
+  var variation = data.placement.split('-')[1] || '';
+
+  var flipOrder = [];
+
+  switch (options.behavior) {
+    case BEHAVIORS.FLIP:
+      flipOrder = [placement, placementOpposite];
+      break;
+    case BEHAVIORS.CLOCKWISE:
+      flipOrder = clockwise(placement);
+      break;
+    case BEHAVIORS.COUNTERCLOCKWISE:
+      flipOrder = clockwise(placement, true);
+      break;
+    default:
+      flipOrder = options.behavior;
+  }
+
+  flipOrder.forEach(function (step, index) {
+    if (placement !== step || flipOrder.length === index + 1) {
+      return data;
+    }
+
+    placement = data.placement.split('-')[0];
+    placementOpposite = getOppositePlacement(placement);
+
+    var popperOffsets = data.offsets.popper;
+    var refOffsets = data.offsets.reference;
+
+    // using floor because the reference offsets may contain decimals we are not going to consider here
+    var floor = Math.floor;
+    var overlapsRef = placement === 'left' && floor(popperOffsets.right) > floor(refOffsets.left) || placement === 'right' && floor(popperOffsets.left) < floor(refOffsets.right) || placement === 'top' && floor(popperOffsets.bottom) > floor(refOffsets.top) || placement === 'bottom' && floor(popperOffsets.top) < floor(refOffsets.bottom);
+
+    var overflowsLeft = floor(popperOffsets.left) < floor(boundaries.left);
+    var overflowsRight = floor(popperOffsets.right) > floor(boundaries.right);
+    var overflowsTop = floor(popperOffsets.top) < floor(boundaries.top);
+    var overflowsBottom = floor(popperOffsets.bottom) > floor(boundaries.bottom);
+
+    var overflowsBoundaries = placement === 'left' && overflowsLeft || placement === 'right' && overflowsRight || placement === 'top' && overflowsTop || placement === 'bottom' && overflowsBottom;
+
+    // flip the variation if required
+    var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;
+    var flippedVariation = !!options.flipVariations && (isVertical && variation === 'start' && overflowsLeft || isVertical && variation === 'end' && overflowsRight || !isVertical && variation === 'start' && overflowsTop || !isVertical && variation === 'end' && overflowsBottom);
+
+    if (overlapsRef || overflowsBoundaries || flippedVariation) {
+      // this boolean to detect any flip loop
+      data.flipped = true;
+
+      if (overlapsRef || overflowsBoundaries) {
+        placement = flipOrder[index + 1];
+      }
+
+      if (flippedVariation) {
+        variation = getOppositeVariation(variation);
+      }
+
+      data.placement = placement + (variation ? '-' + variation : '');
+
+      // this object contains `position`, we want to preserve it along with
+      // any additional property we may add in the future
+      data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
+
+      data = runModifiers(data.instance.modifiers, data, 'flip');
+    }
+  });
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function keepTogether(data) {
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var placement = data.placement.split('-')[0];
+  var floor = Math.floor;
+  var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;
+  var side = isVertical ? 'right' : 'bottom';
+  var opSide = isVertical ? 'left' : 'top';
+  var measurement = isVertical ? 'width' : 'height';
+
+  if (popper[side] < floor(reference[opSide])) {
+    data.offsets.popper[opSide] = floor(reference[opSide]) - popper[measurement];
+  }
+  if (popper[opSide] > floor(reference[side])) {
+    data.offsets.popper[opSide] = floor(reference[side]);
+  }
+
+  return data;
+}
+
+/**
+ * Converts a string containing value + unit into a px value number
+ * @function
+ * @memberof {modifiers~offset}
+ * @private
+ * @argument {String} str - Value + unit string
+ * @argument {String} measurement - `height` or `width`
+ * @argument {Object} popperOffsets
+ * @argument {Object} referenceOffsets
+ * @returns {Number|String}
+ * Value in pixels, or original string if no values were extracted
+ */
+function toValue(str, measurement, popperOffsets, referenceOffsets) {
+  // separate value from unit
+  var split = str.match(/((?:\-|\+)?\d*\.?\d*)(.*)/);
+  var value = +split[1];
+  var unit = split[2];
+
+  // If it's not a number it's an operator, I guess
+  if (!value) {
+    return str;
+  }
+
+  if (unit.indexOf('%') === 0) {
+    var element = void 0;
+    switch (unit) {
+      case '%p':
+        element = popperOffsets;
+        break;
+      case '%':
+      case '%r':
+      default:
+        element = referenceOffsets;
+    }
+
+    var rect = getClientRect(element);
+    return rect[measurement] / 100 * value;
+  } else if (unit === 'vh' || unit === 'vw') {
+    // if is a vh or vw, we calculate the size based on the viewport
+    var size = void 0;
+    if (unit === 'vh') {
+      size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
+    } else {
+      size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
+    }
+    return size / 100 * value;
+  } else {
+    // if is an explicit pixel unit, we get rid of the unit and keep the value
+    // if is an implicit unit, it's px, and we return just the value
+    return value;
+  }
+}
+
+/**
+ * Parse an `offset` string to extrapolate `x` and `y` numeric offsets.
+ * @function
+ * @memberof {modifiers~offset}
+ * @private
+ * @argument {String} offset
+ * @argument {Object} popperOffsets
+ * @argument {Object} referenceOffsets
+ * @argument {String} basePlacement
+ * @returns {Array} a two cells array with x and y offsets in numbers
+ */
+function parseOffset(offset, popperOffsets, referenceOffsets, basePlacement) {
+  var offsets = [0, 0];
+
+  // Use height if placement is left or right and index is 0 otherwise use width
+  // in this way the first offset will use an axis and the second one
+  // will use the other one
+  var useHeight = ['right', 'left'].indexOf(basePlacement) !== -1;
+
+  // Split the offset string to obtain a list of values and operands
+  // The regex addresses values with the plus or minus sign in front (+10, -20, etc)
+  var fragments = offset.split(/(\+|\-)/).map(function (frag) {
+    return frag.trim();
+  });
+
+  // Detect if the offset string contains a pair of values or a single one
+  // they could be separated by comma or space
+  var divider = fragments.indexOf(find(fragments, function (frag) {
+    return frag.search(/,|\s/) !== -1;
+  }));
+
+  if (fragments[divider] && fragments[divider].indexOf(',') === -1) {
+    console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.');
+  }
+
+  // If divider is found, we divide the list of values and operands to divide
+  // them by ofset X and Y.
+  var splitRegex = /\s*,\s*|\s+/;
+  var ops = divider !== -1 ? [fragments.slice(0, divider).concat([fragments[divider].split(splitRegex)[0]]), [fragments[divider].split(splitRegex)[1]].concat(fragments.slice(divider + 1))] : [fragments];
+
+  // Convert the values with units to absolute pixels to allow our computations
+  ops = ops.map(function (op, index) {
+    // Most of the units rely on the orientation of the popper
+    var measurement = (index === 1 ? !useHeight : useHeight) ? 'height' : 'width';
+    var mergeWithPrevious = false;
+    return op
+    // This aggregates any `+` or `-` sign that aren't considered operators
+    // e.g.: 10 + +5 => [10, +, +5]
+    .reduce(function (a, b) {
+      if (a[a.length - 1] === '' && ['+', '-'].indexOf(b) !== -1) {
+        a[a.length - 1] = b;
+        mergeWithPrevious = true;
+        return a;
+      } else if (mergeWithPrevious) {
+        a[a.length - 1] += b;
+        mergeWithPrevious = false;
+        return a;
+      } else {
+        return a.concat(b);
+      }
+    }, [])
+    // Here we convert the string values into number values (in px)
+    .map(function (str) {
+      return toValue(str, measurement, popperOffsets, referenceOffsets);
+    });
+  });
+
+  // Loop trough the offsets arrays and execute the operations
+  ops.forEach(function (op, index) {
+    op.forEach(function (frag, index2) {
+      if (isNumeric(frag)) {
+        offsets[index] += frag * (op[index2 - 1] === '-' ? -1 : 1);
+      }
+    });
+  });
+  return offsets;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @argument {Number|String} options.offset=0
+ * The offset value as described in the modifier description
+ * @returns {Object} The data object, properly modified
+ */
+function offset(data, _ref) {
+  var offset = _ref.offset;
+  var placement = data.placement,
+      _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var basePlacement = placement.split('-')[0];
+
+  var offsets = void 0;
+  if (isNumeric(+offset)) {
+    offsets = [+offset, 0];
+  } else {
+    offsets = parseOffset(offset, popper, reference, basePlacement);
+  }
+
+  if (basePlacement === 'left') {
+    popper.top += offsets[0];
+    popper.left -= offsets[1];
+  } else if (basePlacement === 'right') {
+    popper.top += offsets[0];
+    popper.left += offsets[1];
+  } else if (basePlacement === 'top') {
+    popper.left += offsets[0];
+    popper.top -= offsets[1];
+  } else if (basePlacement === 'bottom') {
+    popper.left += offsets[0];
+    popper.top += offsets[1];
+  }
+
+  data.popper = popper;
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function preventOverflow(data, options) {
+  var boundariesElement = options.boundariesElement || getOffsetParent(data.instance.popper);
+
+  // If offsetParent is the reference element, we really want to
+  // go one step up and use the next offsetParent as reference to
+  // avoid to make this modifier completely useless and look like broken
+  if (data.instance.reference === boundariesElement) {
+    boundariesElement = getOffsetParent(boundariesElement);
+  }
+
+  // NOTE: DOM access here
+  // resets the popper's position so that the document size can be calculated excluding
+  // the size of the popper element itself
+  var transformProp = getSupportedPropertyName('transform');
+  var popperStyles = data.instance.popper.style; // assignment to help minification
+  var top = popperStyles.top,
+      left = popperStyles.left,
+      transform = popperStyles[transformProp];
+
+  popperStyles.top = '';
+  popperStyles.left = '';
+  popperStyles[transformProp] = '';
+
+  var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, boundariesElement, data.positionFixed);
+
+  // NOTE: DOM access here
+  // restores the original style properties after the offsets have been computed
+  popperStyles.top = top;
+  popperStyles.left = left;
+  popperStyles[transformProp] = transform;
+
+  options.boundaries = boundaries;
+
+  var order = options.priority;
+  var popper = data.offsets.popper;
+
+  var check = {
+    primary: function primary(placement) {
+      var value = popper[placement];
+      if (popper[placement] < boundaries[placement] && !options.escapeWithReference) {
+        value = Math.max(popper[placement], boundaries[placement]);
+      }
+      return defineProperty({}, placement, value);
+    },
+    secondary: function secondary(placement) {
+      var mainSide = placement === 'right' ? 'left' : 'top';
+      var value = popper[mainSide];
+      if (popper[placement] > boundaries[placement] && !options.escapeWithReference) {
+        value = Math.min(popper[mainSide], boundaries[placement] - (placement === 'right' ? popper.width : popper.height));
+      }
+      return defineProperty({}, mainSide, value);
+    }
+  };
+
+  order.forEach(function (placement) {
+    var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';
+    popper = _extends({}, popper, check[side](placement));
+  });
+
+  data.offsets.popper = popper;
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function shift(data) {
+  var placement = data.placement;
+  var basePlacement = placement.split('-')[0];
+  var shiftvariation = placement.split('-')[1];
+
+  // if shift shiftvariation is specified, run the modifier
+  if (shiftvariation) {
+    var _data$offsets = data.offsets,
+        reference = _data$offsets.reference,
+        popper = _data$offsets.popper;
+
+    var isVertical = ['bottom', 'top'].indexOf(basePlacement) !== -1;
+    var side = isVertical ? 'left' : 'top';
+    var measurement = isVertical ? 'width' : 'height';
+
+    var shiftOffsets = {
+      start: defineProperty({}, side, reference[side]),
+      end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])
+    };
+
+    data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);
+  }
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function hide(data) {
+  if (!isModifierRequired(data.instance.modifiers, 'hide', 'preventOverflow')) {
+    return data;
+  }
+
+  var refRect = data.offsets.reference;
+  var bound = find(data.instance.modifiers, function (modifier) {
+    return modifier.name === 'preventOverflow';
+  }).boundaries;
+
+  if (refRect.bottom < bound.top || refRect.left > bound.right || refRect.top > bound.bottom || refRect.right < bound.left) {
+    // Avoid unnecessary DOM access if visibility hasn't changed
+    if (data.hide === true) {
+      return data;
+    }
+
+    data.hide = true;
+    data.attributes['x-out-of-boundaries'] = '';
+  } else {
+    // Avoid unnecessary DOM access if visibility hasn't changed
+    if (data.hide === false) {
+      return data;
+    }
+
+    data.hide = false;
+    data.attributes['x-out-of-boundaries'] = false;
+  }
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function inner(data) {
+  var placement = data.placement;
+  var basePlacement = placement.split('-')[0];
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var isHoriz = ['left', 'right'].indexOf(basePlacement) !== -1;
+
+  var subtractLength = ['top', 'left'].indexOf(basePlacement) === -1;
+
+  popper[isHoriz ? 'left' : 'top'] = reference[basePlacement] - (subtractLength ? popper[isHoriz ? 'width' : 'height'] : 0);
+
+  data.placement = getOppositePlacement(placement);
+  data.offsets.popper = getClientRect(popper);
+
+  return data;
+}
+
+/**
+ * Modifier function, each modifier can have a function of this type assigned
+ * to its `fn` property.<br />
+ * These functions will be called on each update, this means that you must
+ * make sure they are performant enough to avoid performance bottlenecks.
+ *
+ * @function ModifierFn
+ * @argument {dataObject} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {dataObject} The data object, properly modified
+ */
+
+/**
+ * Modifiers are plugins used to alter the behavior of your poppers.<br />
+ * Popper.js uses a set of 9 modifiers to provide all the basic functionalities
+ * needed by the library.
+ *
+ * Usually you don't want to override the `order`, `fn` and `onLoad` props.
+ * All the other properties are configurations that could be tweaked.
+ * @namespace modifiers
+ */
+var modifiers = {
+  /**
+   * Modifier used to shift the popper on the start or end of its reference
+   * element.<br />
+   * It will read the variation of the `placement` property.<br />
+   * It can be one either `-end` or `-start`.
+   * @memberof modifiers
+   * @inner
+   */
+  shift: {
+    /** @prop {number} order=100 - Index used to define the order of execution */
+    order: 100,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: shift
+  },
+
+  /**
+   * The `offset` modifier can shift your popper on both its axis.
+   *
+   * It accepts the following units:
+   * - `px` or unit-less, interpreted as pixels
+   * - `%` or `%r`, percentage relative to the length of the reference element
+   * - `%p`, percentage relative to the length of the popper element
+   * - `vw`, CSS viewport width unit
+   * - `vh`, CSS viewport height unit
+   *
+   * For length is intended the main axis relative to the placement of the popper.<br />
+   * This means that if the placement is `top` or `bottom`, the length will be the
+   * `width`. In case of `left` or `right`, it will be the `height`.
+   *
+   * You can provide a single value (as `Number` or `String`), or a pair of values
+   * as `String` divided by a comma or one (or more) white spaces.<br />
+   * The latter is a deprecated method because it leads to confusion and will be
+   * removed in v2.<br />
+   * Additionally, it accepts additions and subtractions between different units.
+   * Note that multiplications and divisions aren't supported.
+   *
+   * Valid examples are:
+   * ```
+   * 10
+   * '10%'
+   * '10, 10'
+   * '10%, 10'
+   * '10 + 10%'
+   * '10 - 5vh + 3%'
+   * '-10px + 5vh, 5px - 6%'
+   * ```
+   * > **NB**: If you desire to apply offsets to your poppers in a way that may make them overlap
+   * > with their reference element, unfortunately, you will have to disable the `flip` modifier.
+   * > You can read more on this at this [issue](https://github.com/FezVrasta/popper.js/issues/373).
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  offset: {
+    /** @prop {number} order=200 - Index used to define the order of execution */
+    order: 200,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: offset,
+    /** @prop {Number|String} offset=0
+     * The offset value as described in the modifier description
+     */
+    offset: 0
+  },
+
+  /**
+   * Modifier used to prevent the popper from being positioned outside the boundary.
+   *
+   * A scenario exists where the reference itself is not within the boundaries.<br />
+   * We can say it has "escaped the boundaries" — or just "escaped".<br />
+   * In this case we need to decide whether the popper should either:
+   *
+   * - detach from the reference and remain "trapped" in the boundaries, or
+   * - if it should ignore the boundary and "escape with its reference"
+   *
+   * When `escapeWithReference` is set to`true` and reference is completely
+   * outside its boundaries, the popper will overflow (or completely leave)
+   * the boundaries in order to remain attached to the edge of the reference.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  preventOverflow: {
+    /** @prop {number} order=300 - Index used to define the order of execution */
+    order: 300,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: preventOverflow,
+    /**
+     * @prop {Array} [priority=['left','right','top','bottom']]
+     * Popper will try to prevent overflow following these priorities by default,
+     * then, it could overflow on the left and on top of the `boundariesElement`
+     */
+    priority: ['left', 'right', 'top', 'bottom'],
+    /**
+     * @prop {number} padding=5
+     * Amount of pixel used to define a minimum distance between the boundaries
+     * and the popper. This makes sure the popper always has a little padding
+     * between the edges of its container
+     */
+    padding: 5,
+    /**
+     * @prop {String|HTMLElement} boundariesElement='scrollParent'
+     * Boundaries used by the modifier. Can be `scrollParent`, `window`,
+     * `viewport` or any DOM element.
+     */
+    boundariesElement: 'scrollParent'
+  },
+
+  /**
+   * Modifier used to make sure the reference and its popper stay near each other
+   * without leaving any gap between the two. Especially useful when the arrow is
+   * enabled and you want to ensure that it points to its reference element.
+   * It cares only about the first axis. You can still have poppers with margin
+   * between the popper and its reference element.
+   * @memberof modifiers
+   * @inner
+   */
+  keepTogether: {
+    /** @prop {number} order=400 - Index used to define the order of execution */
+    order: 400,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: keepTogether
+  },
+
+  /**
+   * This modifier is used to move the `arrowElement` of the popper to make
+   * sure it is positioned between the reference element and its popper element.
+   * It will read the outer size of the `arrowElement` node to detect how many
+   * pixels of conjunction are needed.
+   *
+   * It has no effect if no `arrowElement` is provided.
+   * @memberof modifiers
+   * @inner
+   */
+  arrow: {
+    /** @prop {number} order=500 - Index used to define the order of execution */
+    order: 500,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: arrow,
+    /** @prop {String|HTMLElement} element='[x-arrow]' - Selector or node used as arrow */
+    element: '[x-arrow]'
+  },
+
+  /**
+   * Modifier used to flip the popper's placement when it starts to overlap its
+   * reference element.
+   *
+   * Requires the `preventOverflow` modifier before it in order to work.
+   *
+   * **NOTE:** this modifier will interrupt the current update cycle and will
+   * restart it if it detects the need to flip the placement.
+   * @memberof modifiers
+   * @inner
+   */
+  flip: {
+    /** @prop {number} order=600 - Index used to define the order of execution */
+    order: 600,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: flip,
+    /**
+     * @prop {String|Array} behavior='flip'
+     * The behavior used to change the popper's placement. It can be one of
+     * `flip`, `clockwise`, `counterclockwise` or an array with a list of valid
+     * placements (with optional variations)
+     */
+    behavior: 'flip',
+    /**
+     * @prop {number} padding=5
+     * The popper will flip if it hits the edges of the `boundariesElement`
+     */
+    padding: 5,
+    /**
+     * @prop {String|HTMLElement} boundariesElement='viewport'
+     * The element which will define the boundaries of the popper position.
+     * The popper will never be placed outside of the defined boundaries
+     * (except if `keepTogether` is enabled)
+     */
+    boundariesElement: 'viewport'
+  },
+
+  /**
+   * Modifier used to make the popper flow toward the inner of the reference element.
+   * By default, when this modifier is disabled, the popper will be placed outside
+   * the reference element.
+   * @memberof modifiers
+   * @inner
+   */
+  inner: {
+    /** @prop {number} order=700 - Index used to define the order of execution */
+    order: 700,
+    /** @prop {Boolean} enabled=false - Whether the modifier is enabled or not */
+    enabled: false,
+    /** @prop {ModifierFn} */
+    fn: inner
+  },
+
+  /**
+   * Modifier used to hide the popper when its reference element is outside of the
+   * popper boundaries. It will set a `x-out-of-boundaries` attribute which can
+   * be used to hide with a CSS selector the popper when its reference is
+   * out of boundaries.
+   *
+   * Requires the `preventOverflow` modifier before it in order to work.
+   * @memberof modifiers
+   * @inner
+   */
+  hide: {
+    /** @prop {number} order=800 - Index used to define the order of execution */
+    order: 800,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: hide
+  },
+
+  /**
+   * Computes the style that will be applied to the popper element to gets
+   * properly positioned.
+   *
+   * Note that this modifier will not touch the DOM, it just prepares the styles
+   * so that `applyStyle` modifier can apply it. This separation is useful
+   * in case you need to replace `applyStyle` with a custom implementation.
+   *
+   * This modifier has `850` as `order` value to maintain backward compatibility
+   * with previous versions of Popper.js. Expect the modifiers ordering method
+   * to change in future major versions of the library.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  computeStyle: {
+    /** @prop {number} order=850 - Index used to define the order of execution */
+    order: 850,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: computeStyle,
+    /**
+     * @prop {Boolean} gpuAcceleration=true
+     * If true, it uses the CSS 3D transformation to position the popper.
+     * Otherwise, it will use the `top` and `left` properties
+     */
+    gpuAcceleration: true,
+    /**
+     * @prop {string} [x='bottom']
+     * Where to anchor the X axis (`bottom` or `top`). AKA X offset origin.
+     * Change this if your popper should grow in a direction different from `bottom`
+     */
+    x: 'bottom',
+    /**
+     * @prop {string} [x='left']
+     * Where to anchor the Y axis (`left` or `right`). AKA Y offset origin.
+     * Change this if your popper should grow in a direction different from `right`
+     */
+    y: 'right'
+  },
+
+  /**
+   * Applies the computed styles to the popper element.
+   *
+   * All the DOM manipulations are limited to this modifier. This is useful in case
+   * you want to integrate Popper.js inside a framework or view library and you
+   * want to delegate all the DOM manipulations to it.
+   *
+   * Note that if you disable this modifier, you must make sure the popper element
+   * has its position set to `absolute` before Popper.js can do its work!
+   *
+   * Just disable this modifier and define your own to achieve the desired effect.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  applyStyle: {
+    /** @prop {number} order=900 - Index used to define the order of execution */
+    order: 900,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: applyStyle,
+    /** @prop {Function} */
+    onLoad: applyStyleOnLoad,
+    /**
+     * @deprecated since version 1.10.0, the property moved to `computeStyle` modifier
+     * @prop {Boolean} gpuAcceleration=true
+     * If true, it uses the CSS 3D transformation to position the popper.
+     * Otherwise, it will use the `top` and `left` properties
+     */
+    gpuAcceleration: undefined
+  }
+};
+
+/**
+ * The `dataObject` is an object containing all the information used by Popper.js.
+ * This object is passed to modifiers and to the `onCreate` and `onUpdate` callbacks.
+ * @name dataObject
+ * @property {Object} data.instance The Popper.js instance
+ * @property {String} data.placement Placement applied to popper
+ * @property {String} data.originalPlacement Placement originally defined on init
+ * @property {Boolean} data.flipped True if popper has been flipped by flip modifier
+ * @property {Boolean} data.hide True if the reference element is out of boundaries, useful to know when to hide the popper
+ * @property {HTMLElement} data.arrowElement Node used as arrow by arrow modifier
+ * @property {Object} data.styles Any CSS property defined here will be applied to the popper. It expects the JavaScript nomenclature (eg. `marginBottom`)
+ * @property {Object} data.arrowStyles Any CSS property defined here will be applied to the popper arrow. It expects the JavaScript nomenclature (eg. `marginBottom`)
+ * @property {Object} data.boundaries Offsets of the popper boundaries
+ * @property {Object} data.offsets The measurements of popper, reference and arrow elements
+ * @property {Object} data.offsets.popper `top`, `left`, `width`, `height` values
+ * @property {Object} data.offsets.reference `top`, `left`, `width`, `height` values
+ * @property {Object} data.offsets.arrow] `top` and `left` offsets, only one of them will be different from 0
+ */
+
+/**
+ * Default options provided to Popper.js constructor.<br />
+ * These can be overridden using the `options` argument of Popper.js.<br />
+ * To override an option, simply pass an object with the same
+ * structure of the `options` object, as the 3rd argument. For example:
+ * ```
+ * new Popper(ref, pop, {
+ *   modifiers: {
+ *     preventOverflow: { enabled: false }
+ *   }
+ * })
+ * ```
+ * @type {Object}
+ * @static
+ * @memberof Popper
+ */
+var Defaults = {
+  /**
+   * Popper's placement.
+   * @prop {Popper.placements} placement='bottom'
+   */
+  placement: 'bottom',
+
+  /**
+   * Set this to true if you want popper to position it self in 'fixed' mode
+   * @prop {Boolean} positionFixed=false
+   */
+  positionFixed: false,
+
+  /**
+   * Whether events (resize, scroll) are initially enabled.
+   * @prop {Boolean} eventsEnabled=true
+   */
+  eventsEnabled: true,
+
+  /**
+   * Set to true if you want to automatically remove the popper when
+   * you call the `destroy` method.
+   * @prop {Boolean} removeOnDestroy=false
+   */
+  removeOnDestroy: false,
+
+  /**
+   * Callback called when the popper is created.<br />
+   * By default, it is set to no-op.<br />
+   * Access Popper.js instance with `data.instance`.
+   * @prop {onCreate}
+   */
+  onCreate: function onCreate() {},
+
+  /**
+   * Callback called when the popper is updated. This callback is not called
+   * on the initialization/creation of the popper, but only on subsequent
+   * updates.<br />
+   * By default, it is set to no-op.<br />
+   * Access Popper.js instance with `data.instance`.
+   * @prop {onUpdate}
+   */
+  onUpdate: function onUpdate() {},
+
+  /**
+   * List of modifiers used to modify the offsets before they are applied to the popper.
+   * They provide most of the functionalities of Popper.js.
+   * @prop {modifiers}
+   */
+  modifiers: modifiers
+};
+
+/**
+ * @callback onCreate
+ * @param {dataObject} data
+ */
+
+/**
+ * @callback onUpdate
+ * @param {dataObject} data
+ */
+
+// Utils
+// Methods
+var Popper = function () {
+  /**
+   * Creates a new Popper.js instance.
+   * @class Popper
+   * @param {HTMLElement|referenceObject} reference - The reference element used to position the popper
+   * @param {HTMLElement} popper - The HTML element used as the popper
+   * @param {Object} options - Your custom options to override the ones defined in [Defaults](#defaults)
+   * @return {Object} instance - The generated Popper.js instance
+   */
+  function Popper(reference, popper) {
+    var _this = this;
+
+    var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    classCallCheck(this, Popper);
+
+    this.scheduleUpdate = function () {
+      return requestAnimationFrame(_this.update);
+    };
+
+    // make update() debounced, so that it only runs at most once-per-tick
+    this.update = debounce(this.update.bind(this));
+
+    // with {} we create a new object with the options inside it
+    this.options = _extends({}, Popper.Defaults, options);
+
+    // init state
+    this.state = {
+      isDestroyed: false,
+      isCreated: false,
+      scrollParents: []
+    };
+
+    // get reference and popper elements (allow jQuery wrappers)
+    this.reference = reference && reference.jquery ? reference[0] : reference;
+    this.popper = popper && popper.jquery ? popper[0] : popper;
+
+    // Deep merge modifiers options
+    this.options.modifiers = {};
+    Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
+      _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
+    });
+
+    // Refactoring modifiers' list (Object => Array)
+    this.modifiers = Object.keys(this.options.modifiers).map(function (name) {
+      return _extends({
+        name: name
+      }, _this.options.modifiers[name]);
+    })
+    // sort the modifiers by order
+    .sort(function (a, b) {
+      return a.order - b.order;
+    });
+
+    // modifiers have the ability to execute arbitrary code when Popper.js get inited
+    // such code is executed in the same order of its modifier
+    // they could add new properties to their options configuration
+    // BE AWARE: don't add options to `options.modifiers.name` but to `modifierOptions`!
+    this.modifiers.forEach(function (modifierOptions) {
+      if (modifierOptions.enabled && isFunction(modifierOptions.onLoad)) {
+        modifierOptions.onLoad(_this.reference, _this.popper, _this.options, modifierOptions, _this.state);
+      }
+    });
+
+    // fire the first update to position the popper in the right place
+    this.update();
+
+    var eventsEnabled = this.options.eventsEnabled;
+    if (eventsEnabled) {
+      // setup event listeners, they will take care of update the position in specific situations
+      this.enableEventListeners();
+    }
+
+    this.state.eventsEnabled = eventsEnabled;
+  }
+
+  // We can't use class properties because they don't get listed in the
+  // class prototype and break stuff like Sinon stubs
+
+
+  createClass(Popper, [{
+    key: 'update',
+    value: function update$$1() {
+      return update.call(this);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy$$1() {
+      return destroy.call(this);
+    }
+  }, {
+    key: 'enableEventListeners',
+    value: function enableEventListeners$$1() {
+      return enableEventListeners.call(this);
+    }
+  }, {
+    key: 'disableEventListeners',
+    value: function disableEventListeners$$1() {
+      return disableEventListeners.call(this);
+    }
+
+    /**
+     * Schedules an update. It will run on the next UI update available.
+     * @method scheduleUpdate
+     * @memberof Popper
+     */
+
+
+    /**
+     * Collection of utilities useful when writing custom modifiers.
+     * Starting from version 1.7, this method is available only if you
+     * include `popper-utils.js` before `popper.js`.
+     *
+     * **DEPRECATION**: This way to access PopperUtils is deprecated
+     * and will be removed in v2! Use the PopperUtils module directly instead.
+     * Due to the high instability of the methods contained in Utils, we can't
+     * guarantee them to follow semver. Use them at your own risk!
+     * @static
+     * @private
+     * @type {Object}
+     * @deprecated since version 1.8
+     * @member Utils
+     * @memberof Popper
+     */
+
+  }]);
+  return Popper;
+}();
+
+/**
+ * The `referenceObject` is an object that provides an interface compatible with Popper.js
+ * and lets you use it as replacement of a real DOM node.<br />
+ * You can use this method to position a popper relatively to a set of coordinates
+ * in case you don't have a DOM node to use as reference.
+ *
+ * ```
+ * new Popper(referenceObject, popperNode);
+ * ```
+ *
+ * NB: This feature isn't supported in Internet Explorer 10.
+ * @name referenceObject
+ * @property {Function} data.getBoundingClientRect
+ * A function that returns a set of coordinates compatible with the native `getBoundingClientRect` method.
+ * @property {number} data.clientWidth
+ * An ES6 getter that will return the width of the virtual reference element.
+ * @property {number} data.clientHeight
+ * An ES6 getter that will return the height of the virtual reference element.
+ */
+
+
+Popper.Utils = (typeof window !== 'undefined' ? window : global).PopperUtils;
+Popper.placements = placements;
+Popper.Defaults = Defaults;
+
+return Popper;
+
+})));
+/*!
+  * Bootstrap util.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery')) :
+  typeof define === 'function' && define.amd ? define(['jquery'], factory) :
+  (global = global || self, global.Util = factory(global.jQuery));
+}(this, function ($) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+
+  /**
+   * --------------------------------------------------------------------------
+   * Bootstrap (v4.3.1): util.js
+   * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+   * --------------------------------------------------------------------------
+   */
+  /**
+   * ------------------------------------------------------------------------
+   * Private TransitionEnd Helpers
+   * ------------------------------------------------------------------------
+   */
+
+  var TRANSITION_END = 'transitionend';
+  var MAX_UID = 1000000;
+  var MILLISECONDS_MULTIPLIER = 1000; // Shoutout AngusCroll (https://goo.gl/pxwQGp)
+
+  function toType(obj) {
+    return {}.toString.call(obj).match(/\s([a-z]+)/i)[1].toLowerCase();
+  }
+
+  function getSpecialTransitionEndEvent() {
+    return {
+      bindType: TRANSITION_END,
+      delegateType: TRANSITION_END,
+      handle: function handle(event) {
+        if ($(event.target).is(this)) {
+          return event.handleObj.handler.apply(this, arguments); // eslint-disable-line prefer-rest-params
+        }
+
+        return undefined; // eslint-disable-line no-undefined
+      }
+    };
+  }
+
+  function transitionEndEmulator(duration) {
+    var _this = this;
+
+    var called = false;
+    $(this).one(Util.TRANSITION_END, function () {
+      called = true;
+    });
+    setTimeout(function () {
+      if (!called) {
+        Util.triggerTransitionEnd(_this);
+      }
+    }, duration);
+    return this;
+  }
+
+  function setTransitionEndSupport() {
+    $.fn.emulateTransitionEnd = transitionEndEmulator;
+    $.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent();
+  }
+  /**
+   * --------------------------------------------------------------------------
+   * Public Util Api
+   * --------------------------------------------------------------------------
+   */
+
+
+  var Util = {
+    TRANSITION_END: 'bsTransitionEnd',
+    getUID: function getUID(prefix) {
+      do {
+        // eslint-disable-next-line no-bitwise
+        prefix += ~~(Math.random() * MAX_UID); // "~~" acts like a faster Math.floor() here
+      } while (document.getElementById(prefix));
+
+      return prefix;
+    },
+    getSelectorFromElement: function getSelectorFromElement(element) {
+      var selector = element.getAttribute('data-target');
+
+      if (!selector || selector === '#') {
+        var hrefAttr = element.getAttribute('href');
+        selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : '';
+      }
+
+      try {
+        return document.querySelector(selector) ? selector : null;
+      } catch (err) {
+        return null;
+      }
+    },
+    getTransitionDurationFromElement: function getTransitionDurationFromElement(element) {
+      if (!element) {
+        return 0;
+      } // Get transition-duration of the element
+
+
+      var transitionDuration = $(element).css('transition-duration');
+      var transitionDelay = $(element).css('transition-delay');
+      var floatTransitionDuration = parseFloat(transitionDuration);
+      var floatTransitionDelay = parseFloat(transitionDelay); // Return 0 if element or transition duration is not found
+
+      if (!floatTransitionDuration && !floatTransitionDelay) {
+        return 0;
+      } // If multiple durations are defined, take the first
+
+
+      transitionDuration = transitionDuration.split(',')[0];
+      transitionDelay = transitionDelay.split(',')[0];
+      return (parseFloat(transitionDuration) + parseFloat(transitionDelay)) * MILLISECONDS_MULTIPLIER;
+    },
+    reflow: function reflow(element) {
+      return element.offsetHeight;
+    },
+    triggerTransitionEnd: function triggerTransitionEnd(element) {
+      $(element).trigger(TRANSITION_END);
+    },
+    // TODO: Remove in v5
+    supportsTransitionEnd: function supportsTransitionEnd() {
+      return Boolean(TRANSITION_END);
+    },
+    isElement: function isElement(obj) {
+      return (obj[0] || obj).nodeType;
+    },
+    typeCheckConfig: function typeCheckConfig(componentName, config, configTypes) {
+      for (var property in configTypes) {
+        if (Object.prototype.hasOwnProperty.call(configTypes, property)) {
+          var expectedTypes = configTypes[property];
+          var value = config[property];
+          var valueType = value && Util.isElement(value) ? 'element' : toType(value);
+
+          if (!new RegExp(expectedTypes).test(valueType)) {
+            throw new Error(componentName.toUpperCase() + ": " + ("Option \"" + property + "\" provided type \"" + valueType + "\" ") + ("but expected type \"" + expectedTypes + "\"."));
+          }
+        }
+      }
+    },
+    findShadowRoot: function findShadowRoot(element) {
+      if (!document.documentElement.attachShadow) {
+        return null;
+      } // Can find the shadow root otherwise it'll return the document
+
+
+      if (typeof element.getRootNode === 'function') {
+        var root = element.getRootNode();
+        return root instanceof ShadowRoot ? root : null;
+      }
+
+      if (element instanceof ShadowRoot) {
+        return element;
+      } // when we don't find a shadow root
+
+
+      if (!element.parentNode) {
+        return null;
+      }
+
+      return Util.findShadowRoot(element.parentNode);
+    }
+  };
+  setTransitionEndSupport();
+
+  return Util;
+
+}));
+/*!
+  * Bootstrap alert.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Alert = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'alert';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.alert';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Selector = {
+    DISMISS: '[data-dismiss="alert"]'
+  };
+  var Event = {
+    CLOSE: "close" + EVENT_KEY,
+    CLOSED: "closed" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    ALERT: 'alert',
+    FADE: 'fade',
+    SHOW: 'show'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Alert =
+  /*#__PURE__*/
+  function () {
+    function Alert(element) {
+      this._element = element;
+    } // Getters
+
+
+    var _proto = Alert.prototype;
+
+    // Public
+    _proto.close = function close(element) {
+      var rootElement = this._element;
+
+      if (element) {
+        rootElement = this._getRootElement(element);
+      }
+
+      var customEvent = this._triggerCloseEvent(rootElement);
+
+      if (customEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      this._removeElement(rootElement);
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+    } // Private
+    ;
+
+    _proto._getRootElement = function _getRootElement(element) {
+      var selector = Util.getSelectorFromElement(element);
+      var parent = false;
+
+      if (selector) {
+        parent = document.querySelector(selector);
+      }
+
+      if (!parent) {
+        parent = $(element).closest("." + ClassName.ALERT)[0];
+      }
+
+      return parent;
+    };
+
+    _proto._triggerCloseEvent = function _triggerCloseEvent(element) {
+      var closeEvent = $.Event(Event.CLOSE);
+      $(element).trigger(closeEvent);
+      return closeEvent;
+    };
+
+    _proto._removeElement = function _removeElement(element) {
+      var _this = this;
+
+      $(element).removeClass(ClassName.SHOW);
+
+      if (!$(element).hasClass(ClassName.FADE)) {
+        this._destroyElement(element);
+
+        return;
+      }
+
+      var transitionDuration = Util.getTransitionDurationFromElement(element);
+      $(element).one(Util.TRANSITION_END, function (event) {
+        return _this._destroyElement(element, event);
+      }).emulateTransitionEnd(transitionDuration);
+    };
+
+    _proto._destroyElement = function _destroyElement(element) {
+      $(element).detach().trigger(Event.CLOSED).remove();
+    } // Static
+    ;
+
+    Alert._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $element = $(this);
+        var data = $element.data(DATA_KEY);
+
+        if (!data) {
+          data = new Alert(this);
+          $element.data(DATA_KEY, data);
+        }
+
+        if (config === 'close') {
+          data[config](this);
+        }
+      });
+    };
+
+    Alert._handleDismiss = function _handleDismiss(alertInstance) {
+      return function (event) {
+        if (event) {
+          event.preventDefault();
+        }
+
+        alertInstance.close(this);
+      };
+    };
+
+    _createClass(Alert, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }]);
+
+    return Alert;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DISMISS, Alert._handleDismiss(new Alert()));
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Alert._jQueryInterface;
+  $.fn[NAME].Constructor = Alert;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Alert._jQueryInterface;
+  };
+
+  return Alert;
+
+}));
+/*!
+  * Bootstrap button.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery')) :
+  typeof define === 'function' && define.amd ? define(['jquery'], factory) :
+  (global = global || self, global.Button = factory(global.jQuery));
+}(this, function ($) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'button';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.button';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ClassName = {
+    ACTIVE: 'active',
+    BUTTON: 'btn',
+    FOCUS: 'focus'
+  };
+  var Selector = {
+    DATA_TOGGLE_CARROT: '[data-toggle^="button"]',
+    DATA_TOGGLE: '[data-toggle="buttons"]',
+    INPUT: 'input:not([type="hidden"])',
+    ACTIVE: '.active',
+    BUTTON: '.btn'
+  };
+  var Event = {
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
+    FOCUS_BLUR_DATA_API: "focus" + EVENT_KEY + DATA_API_KEY + " " + ("blur" + EVENT_KEY + DATA_API_KEY)
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Button =
+  /*#__PURE__*/
+  function () {
+    function Button(element) {
+      this._element = element;
+    } // Getters
+
+
+    var _proto = Button.prototype;
+
+    // Public
+    _proto.toggle = function toggle() {
+      var triggerChangeEvent = true;
+      var addAriaPressed = true;
+      var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
+
+      if (rootElement) {
+        var input = this._element.querySelector(Selector.INPUT);
+
+        if (input) {
+          if (input.type === 'radio') {
+            if (input.checked && this._element.classList.contains(ClassName.ACTIVE)) {
+              triggerChangeEvent = false;
+            } else {
+              var activeElement = rootElement.querySelector(Selector.ACTIVE);
+
+              if (activeElement) {
+                $(activeElement).removeClass(ClassName.ACTIVE);
+              }
+            }
+          }
+
+          if (triggerChangeEvent) {
+            if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) {
+              return;
+            }
+
+            input.checked = !this._element.classList.contains(ClassName.ACTIVE);
+            $(input).trigger('change');
+          }
+
+          input.focus();
+          addAriaPressed = false;
+        }
+      }
+
+      if (addAriaPressed) {
+        this._element.setAttribute('aria-pressed', !this._element.classList.contains(ClassName.ACTIVE));
+      }
+
+      if (triggerChangeEvent) {
+        $(this._element).toggleClass(ClassName.ACTIVE);
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+    } // Static
+    ;
+
+    Button._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        if (!data) {
+          data = new Button(this);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (config === 'toggle') {
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Button, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }]);
+
+    return Button;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, function (event) {
+    event.preventDefault();
+    var button = event.target;
+
+    if (!$(button).hasClass(ClassName.BUTTON)) {
+      button = $(button).closest(Selector.BUTTON);
+    }
+
+    Button._jQueryInterface.call($(button), 'toggle');
+  }).on(Event.FOCUS_BLUR_DATA_API, Selector.DATA_TOGGLE_CARROT, function (event) {
+    var button = $(event.target).closest(Selector.BUTTON)[0];
+    $(button).toggleClass(ClassName.FOCUS, /^focus(in)?$/.test(event.type));
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Button._jQueryInterface;
+  $.fn[NAME].Constructor = Button;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Button._jQueryInterface;
+  };
+
+  return Button;
+
+}));
+/*!
+  * Bootstrap carousel.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Carousel = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'carousel';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.carousel';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ARROW_LEFT_KEYCODE = 37; // KeyboardEvent.which value for left arrow key
+
+  var ARROW_RIGHT_KEYCODE = 39; // KeyboardEvent.which value for right arrow key
+
+  var TOUCHEVENT_COMPAT_WAIT = 500; // Time for mouse compat events to fire after touch
+
+  var SWIPE_THRESHOLD = 40;
+  var Default = {
+    interval: 5000,
+    keyboard: true,
+    slide: false,
+    pause: 'hover',
+    wrap: true,
+    touch: true
+  };
+  var DefaultType = {
+    interval: '(number|boolean)',
+    keyboard: 'boolean',
+    slide: '(boolean|string)',
+    pause: '(string|boolean)',
+    wrap: 'boolean',
+    touch: 'boolean'
+  };
+  var Direction = {
+    NEXT: 'next',
+    PREV: 'prev',
+    LEFT: 'left',
+    RIGHT: 'right'
+  };
+  var Event = {
+    SLIDE: "slide" + EVENT_KEY,
+    SLID: "slid" + EVENT_KEY,
+    KEYDOWN: "keydown" + EVENT_KEY,
+    MOUSEENTER: "mouseenter" + EVENT_KEY,
+    MOUSELEAVE: "mouseleave" + EVENT_KEY,
+    TOUCHSTART: "touchstart" + EVENT_KEY,
+    TOUCHMOVE: "touchmove" + EVENT_KEY,
+    TOUCHEND: "touchend" + EVENT_KEY,
+    POINTERDOWN: "pointerdown" + EVENT_KEY,
+    POINTERUP: "pointerup" + EVENT_KEY,
+    DRAG_START: "dragstart" + EVENT_KEY,
+    LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    CAROUSEL: 'carousel',
+    ACTIVE: 'active',
+    SLIDE: 'slide',
+    RIGHT: 'carousel-item-right',
+    LEFT: 'carousel-item-left',
+    NEXT: 'carousel-item-next',
+    PREV: 'carousel-item-prev',
+    ITEM: 'carousel-item',
+    POINTER_EVENT: 'pointer-event'
+  };
+  var Selector = {
+    ACTIVE: '.active',
+    ACTIVE_ITEM: '.active.carousel-item',
+    ITEM: '.carousel-item',
+    ITEM_IMG: '.carousel-item img',
+    NEXT_PREV: '.carousel-item-next, .carousel-item-prev',
+    INDICATORS: '.carousel-indicators',
+    DATA_SLIDE: '[data-slide], [data-slide-to]',
+    DATA_RIDE: '[data-ride="carousel"]'
+  };
+  var PointerType = {
+    TOUCH: 'touch',
+    PEN: 'pen'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Carousel =
+  /*#__PURE__*/
+  function () {
+    function Carousel(element, config) {
+      this._items = null;
+      this._interval = null;
+      this._activeElement = null;
+      this._isPaused = false;
+      this._isSliding = false;
+      this.touchTimeout = null;
+      this.touchStartX = 0;
+      this.touchDeltaX = 0;
+      this._config = this._getConfig(config);
+      this._element = element;
+      this._indicatorsElement = this._element.querySelector(Selector.INDICATORS);
+      this._touchSupported = 'ontouchstart' in document.documentElement || navigator.maxTouchPoints > 0;
+      this._pointerEvent = Boolean(window.PointerEvent || window.MSPointerEvent);
+
+      this._addEventListeners();
+    } // Getters
+
+
+    var _proto = Carousel.prototype;
+
+    // Public
+    _proto.next = function next() {
+      if (!this._isSliding) {
+        this._slide(Direction.NEXT);
+      }
+    };
+
+    _proto.nextWhenVisible = function nextWhenVisible() {
+      // Don't call next when the page isn't visible
+      // or the carousel or its parent isn't visible
+      if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') {
+        this.next();
+      }
+    };
+
+    _proto.prev = function prev() {
+      if (!this._isSliding) {
+        this._slide(Direction.PREV);
+      }
+    };
+
+    _proto.pause = function pause(event) {
+      if (!event) {
+        this._isPaused = true;
+      }
+
+      if (this._element.querySelector(Selector.NEXT_PREV)) {
+        Util.triggerTransitionEnd(this._element);
+        this.cycle(true);
+      }
+
+      clearInterval(this._interval);
+      this._interval = null;
+    };
+
+    _proto.cycle = function cycle(event) {
+      if (!event) {
+        this._isPaused = false;
+      }
+
+      if (this._interval) {
+        clearInterval(this._interval);
+        this._interval = null;
+      }
+
+      if (this._config.interval && !this._isPaused) {
+        this._interval = setInterval((document.visibilityState ? this.nextWhenVisible : this.next).bind(this), this._config.interval);
+      }
+    };
+
+    _proto.to = function to(index) {
+      var _this = this;
+
+      this._activeElement = this._element.querySelector(Selector.ACTIVE_ITEM);
+
+      var activeIndex = this._getItemIndex(this._activeElement);
+
+      if (index > this._items.length - 1 || index < 0) {
+        return;
+      }
+
+      if (this._isSliding) {
+        $(this._element).one(Event.SLID, function () {
+          return _this.to(index);
+        });
+        return;
+      }
+
+      if (activeIndex === index) {
+        this.pause();
+        this.cycle();
+        return;
+      }
+
+      var direction = index > activeIndex ? Direction.NEXT : Direction.PREV;
+
+      this._slide(direction, this._items[index]);
+    };
+
+    _proto.dispose = function dispose() {
+      $(this._element).off(EVENT_KEY);
+      $.removeData(this._element, DATA_KEY);
+      this._items = null;
+      this._config = null;
+      this._element = null;
+      this._interval = null;
+      this._isPaused = null;
+      this._isSliding = null;
+      this._activeElement = null;
+      this._indicatorsElement = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, config);
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._handleSwipe = function _handleSwipe() {
+      var absDeltax = Math.abs(this.touchDeltaX);
+
+      if (absDeltax <= SWIPE_THRESHOLD) {
+        return;
+      }
+
+      var direction = absDeltax / this.touchDeltaX; // swipe left
+
+      if (direction > 0) {
+        this.prev();
+      } // swipe right
+
+
+      if (direction < 0) {
+        this.next();
+      }
+    };
+
+    _proto._addEventListeners = function _addEventListeners() {
+      var _this2 = this;
+
+      if (this._config.keyboard) {
+        $(this._element).on(Event.KEYDOWN, function (event) {
+          return _this2._keydown(event);
+        });
+      }
+
+      if (this._config.pause === 'hover') {
+        $(this._element).on(Event.MOUSEENTER, function (event) {
+          return _this2.pause(event);
+        }).on(Event.MOUSELEAVE, function (event) {
+          return _this2.cycle(event);
+        });
+      }
+
+      if (this._config.touch) {
+        this._addTouchEventListeners();
+      }
+    };
+
+    _proto._addTouchEventListeners = function _addTouchEventListeners() {
+      var _this3 = this;
+
+      if (!this._touchSupported) {
+        return;
+      }
+
+      var start = function start(event) {
+        if (_this3._pointerEvent && PointerType[event.originalEvent.pointerType.toUpperCase()]) {
+          _this3.touchStartX = event.originalEvent.clientX;
+        } else if (!_this3._pointerEvent) {
+          _this3.touchStartX = event.originalEvent.touches[0].clientX;
+        }
+      };
+
+      var move = function move(event) {
+        // ensure swiping with one touch and not pinching
+        if (event.originalEvent.touches && event.originalEvent.touches.length > 1) {
+          _this3.touchDeltaX = 0;
+        } else {
+          _this3.touchDeltaX = event.originalEvent.touches[0].clientX - _this3.touchStartX;
+        }
+      };
+
+      var end = function end(event) {
+        if (_this3._pointerEvent && PointerType[event.originalEvent.pointerType.toUpperCase()]) {
+          _this3.touchDeltaX = event.originalEvent.clientX - _this3.touchStartX;
+        }
+
+        _this3._handleSwipe();
+
+        if (_this3._config.pause === 'hover') {
+          // If it's a touch-enabled device, mouseenter/leave are fired as
+          // part of the mouse compatibility events on first tap - the carousel
+          // would stop cycling until user tapped out of it;
+          // here, we listen for touchend, explicitly pause the carousel
+          // (as if it's the second time we tap on it, mouseenter compat event
+          // is NOT fired) and after a timeout (to allow for mouse compatibility
+          // events to fire) we explicitly restart cycling
+          _this3.pause();
+
+          if (_this3.touchTimeout) {
+            clearTimeout(_this3.touchTimeout);
+          }
+
+          _this3.touchTimeout = setTimeout(function (event) {
+            return _this3.cycle(event);
+          }, TOUCHEVENT_COMPAT_WAIT + _this3._config.interval);
+        }
+      };
+
+      $(this._element.querySelectorAll(Selector.ITEM_IMG)).on(Event.DRAG_START, function (e) {
+        return e.preventDefault();
+      });
+
+      if (this._pointerEvent) {
+        $(this._element).on(Event.POINTERDOWN, function (event) {
+          return start(event);
+        });
+        $(this._element).on(Event.POINTERUP, function (event) {
+          return end(event);
+        });
+
+        this._element.classList.add(ClassName.POINTER_EVENT);
+      } else {
+        $(this._element).on(Event.TOUCHSTART, function (event) {
+          return start(event);
+        });
+        $(this._element).on(Event.TOUCHMOVE, function (event) {
+          return move(event);
+        });
+        $(this._element).on(Event.TOUCHEND, function (event) {
+          return end(event);
+        });
+      }
+    };
+
+    _proto._keydown = function _keydown(event) {
+      if (/input|textarea/i.test(event.target.tagName)) {
+        return;
+      }
+
+      switch (event.which) {
+        case ARROW_LEFT_KEYCODE:
+          event.preventDefault();
+          this.prev();
+          break;
+
+        case ARROW_RIGHT_KEYCODE:
+          event.preventDefault();
+          this.next();
+          break;
+
+        default:
+      }
+    };
+
+    _proto._getItemIndex = function _getItemIndex(element) {
+      this._items = element && element.parentNode ? [].slice.call(element.parentNode.querySelectorAll(Selector.ITEM)) : [];
+      return this._items.indexOf(element);
+    };
+
+    _proto._getItemByDirection = function _getItemByDirection(direction, activeElement) {
+      var isNextDirection = direction === Direction.NEXT;
+      var isPrevDirection = direction === Direction.PREV;
+
+      var activeIndex = this._getItemIndex(activeElement);
+
+      var lastItemIndex = this._items.length - 1;
+      var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex;
+
+      if (isGoingToWrap && !this._config.wrap) {
+        return activeElement;
+      }
+
+      var delta = direction === Direction.PREV ? -1 : 1;
+      var itemIndex = (activeIndex + delta) % this._items.length;
+      return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex];
+    };
+
+    _proto._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
+      var targetIndex = this._getItemIndex(relatedTarget);
+
+      var fromIndex = this._getItemIndex(this._element.querySelector(Selector.ACTIVE_ITEM));
+
+      var slideEvent = $.Event(Event.SLIDE, {
+        relatedTarget: relatedTarget,
+        direction: eventDirectionName,
+        from: fromIndex,
+        to: targetIndex
+      });
+      $(this._element).trigger(slideEvent);
+      return slideEvent;
+    };
+
+    _proto._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
+      if (this._indicatorsElement) {
+        var indicators = [].slice.call(this._indicatorsElement.querySelectorAll(Selector.ACTIVE));
+        $(indicators).removeClass(ClassName.ACTIVE);
+
+        var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)];
+
+        if (nextIndicator) {
+          $(nextIndicator).addClass(ClassName.ACTIVE);
+        }
+      }
+    };
+
+    _proto._slide = function _slide(direction, element) {
+      var _this4 = this;
+
+      var activeElement = this._element.querySelector(Selector.ACTIVE_ITEM);
+
+      var activeElementIndex = this._getItemIndex(activeElement);
+
+      var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
+
+      var nextElementIndex = this._getItemIndex(nextElement);
+
+      var isCycling = Boolean(this._interval);
+      var directionalClassName;
+      var orderClassName;
+      var eventDirectionName;
+
+      if (direction === Direction.NEXT) {
+        directionalClassName = ClassName.LEFT;
+        orderClassName = ClassName.NEXT;
+        eventDirectionName = Direction.LEFT;
+      } else {
+        directionalClassName = ClassName.RIGHT;
+        orderClassName = ClassName.PREV;
+        eventDirectionName = Direction.RIGHT;
+      }
+
+      if (nextElement && $(nextElement).hasClass(ClassName.ACTIVE)) {
+        this._isSliding = false;
+        return;
+      }
+
+      var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName);
+
+      if (slideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      if (!activeElement || !nextElement) {
+        // Some weirdness is happening, so we bail
+        return;
+      }
+
+      this._isSliding = true;
+
+      if (isCycling) {
+        this.pause();
+      }
+
+      this._setActiveIndicatorElement(nextElement);
+
+      var slidEvent = $.Event(Event.SLID, {
+        relatedTarget: nextElement,
+        direction: eventDirectionName,
+        from: activeElementIndex,
+        to: nextElementIndex
+      });
+
+      if ($(this._element).hasClass(ClassName.SLIDE)) {
+        $(nextElement).addClass(orderClassName);
+        Util.reflow(nextElement);
+        $(activeElement).addClass(directionalClassName);
+        $(nextElement).addClass(directionalClassName);
+        var nextElementInterval = parseInt(nextElement.getAttribute('data-interval'), 10);
+
+        if (nextElementInterval) {
+          this._config.defaultInterval = this._config.defaultInterval || this._config.interval;
+          this._config.interval = nextElementInterval;
+        } else {
+          this._config.interval = this._config.defaultInterval || this._config.interval;
+        }
+
+        var transitionDuration = Util.getTransitionDurationFromElement(activeElement);
+        $(activeElement).one(Util.TRANSITION_END, function () {
+          $(nextElement).removeClass(directionalClassName + " " + orderClassName).addClass(ClassName.ACTIVE);
+          $(activeElement).removeClass(ClassName.ACTIVE + " " + orderClassName + " " + directionalClassName);
+          _this4._isSliding = false;
+          setTimeout(function () {
+            return $(_this4._element).trigger(slidEvent);
+          }, 0);
+        }).emulateTransitionEnd(transitionDuration);
+      } else {
+        $(activeElement).removeClass(ClassName.ACTIVE);
+        $(nextElement).addClass(ClassName.ACTIVE);
+        this._isSliding = false;
+        $(this._element).trigger(slidEvent);
+      }
+
+      if (isCycling) {
+        this.cycle();
+      }
+    } // Static
+    ;
+
+    Carousel._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = _objectSpread({}, Default, $(this).data());
+
+        if (typeof config === 'object') {
+          _config = _objectSpread({}, _config, config);
+        }
+
+        var action = typeof config === 'string' ? config : _config.slide;
+
+        if (!data) {
+          data = new Carousel(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'number') {
+          data.to(config);
+        } else if (typeof action === 'string') {
+          if (typeof data[action] === 'undefined') {
+            throw new TypeError("No method named \"" + action + "\"");
+          }
+
+          data[action]();
+        } else if (_config.interval && _config.ride) {
+          data.pause();
+          data.cycle();
+        }
+      });
+    };
+
+    Carousel._dataApiClickHandler = function _dataApiClickHandler(event) {
+      var selector = Util.getSelectorFromElement(this);
+
+      if (!selector) {
+        return;
+      }
+
+      var target = $(selector)[0];
+
+      if (!target || !$(target).hasClass(ClassName.CAROUSEL)) {
+        return;
+      }
+
+      var config = _objectSpread({}, $(target).data(), $(this).data());
+
+      var slideIndex = this.getAttribute('data-slide-to');
+
+      if (slideIndex) {
+        config.interval = false;
+      }
+
+      Carousel._jQueryInterface.call($(target), config);
+
+      if (slideIndex) {
+        $(target).data(DATA_KEY).to(slideIndex);
+      }
+
+      event.preventDefault();
+    };
+
+    _createClass(Carousel, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Carousel;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler);
+  $(window).on(Event.LOAD_DATA_API, function () {
+    var carousels = [].slice.call(document.querySelectorAll(Selector.DATA_RIDE));
+
+    for (var i = 0, len = carousels.length; i < len; i++) {
+      var $carousel = $(carousels[i]);
+
+      Carousel._jQueryInterface.call($carousel, $carousel.data());
+    }
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Carousel._jQueryInterface;
+  $.fn[NAME].Constructor = Carousel;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Carousel._jQueryInterface;
+  };
+
+  return Carousel;
+
+}));
+/*!
+  * Bootstrap collapse.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Collapse = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'collapse';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.collapse';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Default = {
+    toggle: true,
+    parent: ''
+  };
+  var DefaultType = {
+    toggle: 'boolean',
+    parent: '(string|element)'
+  };
+  var Event = {
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    SHOW: 'show',
+    COLLAPSE: 'collapse',
+    COLLAPSING: 'collapsing',
+    COLLAPSED: 'collapsed'
+  };
+  var Dimension = {
+    WIDTH: 'width',
+    HEIGHT: 'height'
+  };
+  var Selector = {
+    ACTIVES: '.show, .collapsing',
+    DATA_TOGGLE: '[data-toggle="collapse"]'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Collapse =
+  /*#__PURE__*/
+  function () {
+    function Collapse(element, config) {
+      this._isTransitioning = false;
+      this._element = element;
+      this._config = this._getConfig(config);
+      this._triggerArray = [].slice.call(document.querySelectorAll("[data-toggle=\"collapse\"][href=\"#" + element.id + "\"]," + ("[data-toggle=\"collapse\"][data-target=\"#" + element.id + "\"]")));
+      var toggleList = [].slice.call(document.querySelectorAll(Selector.DATA_TOGGLE));
+
+      for (var i = 0, len = toggleList.length; i < len; i++) {
+        var elem = toggleList[i];
+        var selector = Util.getSelectorFromElement(elem);
+        var filterElement = [].slice.call(document.querySelectorAll(selector)).filter(function (foundElem) {
+          return foundElem === element;
+        });
+
+        if (selector !== null && filterElement.length > 0) {
+          this._selector = selector;
+
+          this._triggerArray.push(elem);
+        }
+      }
+
+      this._parent = this._config.parent ? this._getParent() : null;
+
+      if (!this._config.parent) {
+        this._addAriaAndCollapsedClass(this._element, this._triggerArray);
+      }
+
+      if (this._config.toggle) {
+        this.toggle();
+      }
+    } // Getters
+
+
+    var _proto = Collapse.prototype;
+
+    // Public
+    _proto.toggle = function toggle() {
+      if ($(this._element).hasClass(ClassName.SHOW)) {
+        this.hide();
+      } else {
+        this.show();
+      }
+    };
+
+    _proto.show = function show() {
+      var _this = this;
+
+      if (this._isTransitioning || $(this._element).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var actives;
+      var activesData;
+
+      if (this._parent) {
+        actives = [].slice.call(this._parent.querySelectorAll(Selector.ACTIVES)).filter(function (elem) {
+          if (typeof _this._config.parent === 'string') {
+            return elem.getAttribute('data-parent') === _this._config.parent;
+          }
+
+          return elem.classList.contains(ClassName.COLLAPSE);
+        });
+
+        if (actives.length === 0) {
+          actives = null;
+        }
+      }
+
+      if (actives) {
+        activesData = $(actives).not(this._selector).data(DATA_KEY);
+
+        if (activesData && activesData._isTransitioning) {
+          return;
+        }
+      }
+
+      var startEvent = $.Event(Event.SHOW);
+      $(this._element).trigger(startEvent);
+
+      if (startEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      if (actives) {
+        Collapse._jQueryInterface.call($(actives).not(this._selector), 'hide');
+
+        if (!activesData) {
+          $(actives).data(DATA_KEY, null);
+        }
+      }
+
+      var dimension = this._getDimension();
+
+      $(this._element).removeClass(ClassName.COLLAPSE).addClass(ClassName.COLLAPSING);
+      this._element.style[dimension] = 0;
+
+      if (this._triggerArray.length) {
+        $(this._triggerArray).removeClass(ClassName.COLLAPSED).attr('aria-expanded', true);
+      }
+
+      this.setTransitioning(true);
+
+      var complete = function complete() {
+        $(_this._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).addClass(ClassName.SHOW);
+        _this._element.style[dimension] = '';
+
+        _this.setTransitioning(false);
+
+        $(_this._element).trigger(Event.SHOWN);
+      };
+
+      var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
+      var scrollSize = "scroll" + capitalizedDimension;
+      var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+      $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      this._element.style[dimension] = this._element[scrollSize] + "px";
+    };
+
+    _proto.hide = function hide() {
+      var _this2 = this;
+
+      if (this._isTransitioning || !$(this._element).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var startEvent = $.Event(Event.HIDE);
+      $(this._element).trigger(startEvent);
+
+      if (startEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      var dimension = this._getDimension();
+
+      this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + "px";
+      Util.reflow(this._element);
+      $(this._element).addClass(ClassName.COLLAPSING).removeClass(ClassName.COLLAPSE).removeClass(ClassName.SHOW);
+      var triggerArrayLength = this._triggerArray.length;
+
+      if (triggerArrayLength > 0) {
+        for (var i = 0; i < triggerArrayLength; i++) {
+          var trigger = this._triggerArray[i];
+          var selector = Util.getSelectorFromElement(trigger);
+
+          if (selector !== null) {
+            var $elem = $([].slice.call(document.querySelectorAll(selector)));
+
+            if (!$elem.hasClass(ClassName.SHOW)) {
+              $(trigger).addClass(ClassName.COLLAPSED).attr('aria-expanded', false);
+            }
+          }
+        }
+      }
+
+      this.setTransitioning(true);
+
+      var complete = function complete() {
+        _this2.setTransitioning(false);
+
+        $(_this2._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).trigger(Event.HIDDEN);
+      };
+
+      this._element.style[dimension] = '';
+      var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+      $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+    };
+
+    _proto.setTransitioning = function setTransitioning(isTransitioning) {
+      this._isTransitioning = isTransitioning;
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._config = null;
+      this._parent = null;
+      this._element = null;
+      this._triggerArray = null;
+      this._isTransitioning = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, config);
+      config.toggle = Boolean(config.toggle); // Coerce string values
+
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._getDimension = function _getDimension() {
+      var hasWidth = $(this._element).hasClass(Dimension.WIDTH);
+      return hasWidth ? Dimension.WIDTH : Dimension.HEIGHT;
+    };
+
+    _proto._getParent = function _getParent() {
+      var _this3 = this;
+
+      var parent;
+
+      if (Util.isElement(this._config.parent)) {
+        parent = this._config.parent; // It's a jQuery object
+
+        if (typeof this._config.parent.jquery !== 'undefined') {
+          parent = this._config.parent[0];
+        }
+      } else {
+        parent = document.querySelector(this._config.parent);
+      }
+
+      var selector = "[data-toggle=\"collapse\"][data-parent=\"" + this._config.parent + "\"]";
+      var children = [].slice.call(parent.querySelectorAll(selector));
+      $(children).each(function (i, element) {
+        _this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
+      });
+      return parent;
+    };
+
+    _proto._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
+      var isOpen = $(element).hasClass(ClassName.SHOW);
+
+      if (triggerArray.length) {
+        $(triggerArray).toggleClass(ClassName.COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
+      }
+    } // Static
+    ;
+
+    Collapse._getTargetFromElement = function _getTargetFromElement(element) {
+      var selector = Util.getSelectorFromElement(element);
+      return selector ? document.querySelector(selector) : null;
+    };
+
+    Collapse._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $this = $(this);
+        var data = $this.data(DATA_KEY);
+
+        var _config = _objectSpread({}, Default, $this.data(), typeof config === 'object' && config ? config : {});
+
+        if (!data && _config.toggle && /show|hide/.test(config)) {
+          _config.toggle = false;
+        }
+
+        if (!data) {
+          data = new Collapse(this, _config);
+          $this.data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Collapse, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Collapse;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
+    if (event.currentTarget.tagName === 'A') {
+      event.preventDefault();
+    }
+
+    var $trigger = $(this);
+    var selector = Util.getSelectorFromElement(this);
+    var selectors = [].slice.call(document.querySelectorAll(selector));
+    $(selectors).each(function () {
+      var $target = $(this);
+      var data = $target.data(DATA_KEY);
+      var config = data ? 'toggle' : $trigger.data();
+
+      Collapse._jQueryInterface.call($target, config);
+    });
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Collapse._jQueryInterface;
+  $.fn[NAME].Constructor = Collapse;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Collapse._jQueryInterface;
+  };
+
+  return Collapse;
+
+}));
+/*!
+  * Bootstrap dropdown.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('popper.js'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', 'popper.js', './util.js'], factory) :
+  (global = global || self, global.Dropdown = factory(global.jQuery, global.Popper, global.Util));
+}(this, function ($, Popper, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Popper = Popper && Popper.hasOwnProperty('default') ? Popper['default'] : Popper;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'dropdown';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.dropdown';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
+
+  var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key
+
+  var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key
+
+  var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key
+
+  var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key
+
+  var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)
+
+  var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + "|" + ARROW_DOWN_KEYCODE + "|" + ESCAPE_KEYCODE);
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    CLICK: "click" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
+    KEYDOWN_DATA_API: "keydown" + EVENT_KEY + DATA_API_KEY,
+    KEYUP_DATA_API: "keyup" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    DISABLED: 'disabled',
+    SHOW: 'show',
+    DROPUP: 'dropup',
+    DROPRIGHT: 'dropright',
+    DROPLEFT: 'dropleft',
+    MENURIGHT: 'dropdown-menu-right',
+    MENULEFT: 'dropdown-menu-left',
+    POSITION_STATIC: 'position-static'
+  };
+  var Selector = {
+    DATA_TOGGLE: '[data-toggle="dropdown"]',
+    FORM_CHILD: '.dropdown form',
+    MENU: '.dropdown-menu',
+    NAVBAR_NAV: '.navbar-nav',
+    VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled):not(:disabled)'
+  };
+  var AttachmentMap = {
+    TOP: 'top-start',
+    TOPEND: 'top-end',
+    BOTTOM: 'bottom-start',
+    BOTTOMEND: 'bottom-end',
+    RIGHT: 'right-start',
+    RIGHTEND: 'right-end',
+    LEFT: 'left-start',
+    LEFTEND: 'left-end'
+  };
+  var Default = {
+    offset: 0,
+    flip: true,
+    boundary: 'scrollParent',
+    reference: 'toggle',
+    display: 'dynamic'
+  };
+  var DefaultType = {
+    offset: '(number|string|function)',
+    flip: 'boolean',
+    boundary: '(string|element)',
+    reference: '(string|element)',
+    display: 'string'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Dropdown =
+  /*#__PURE__*/
+  function () {
+    function Dropdown(element, config) {
+      this._element = element;
+      this._popper = null;
+      this._config = this._getConfig(config);
+      this._menu = this._getMenuElement();
+      this._inNavbar = this._detectNavbar();
+
+      this._addEventListeners();
+    } // Getters
+
+
+    var _proto = Dropdown.prototype;
+
+    // Public
+    _proto.toggle = function toggle() {
+      if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
+        return;
+      }
+
+      var parent = Dropdown._getParentFromElement(this._element);
+
+      var isActive = $(this._menu).hasClass(ClassName.SHOW);
+
+      Dropdown._clearMenus();
+
+      if (isActive) {
+        return;
+      }
+
+      var relatedTarget = {
+        relatedTarget: this._element
+      };
+      var showEvent = $.Event(Event.SHOW, relatedTarget);
+      $(parent).trigger(showEvent);
+
+      if (showEvent.isDefaultPrevented()) {
+        return;
+      } // Disable totally Popper.js for Dropdown in Navbar
+
+
+      if (!this._inNavbar) {
+        /**
+         * Check for Popper dependency
+         * Popper - https://popper.js.org
+         */
+        if (typeof Popper === 'undefined') {
+          throw new TypeError('Bootstrap\'s dropdowns require Popper.js (https://popper.js.org/)');
+        }
+
+        var referenceElement = this._element;
+
+        if (this._config.reference === 'parent') {
+          referenceElement = parent;
+        } else if (Util.isElement(this._config.reference)) {
+          referenceElement = this._config.reference; // Check if it's jQuery element
+
+          if (typeof this._config.reference.jquery !== 'undefined') {
+            referenceElement = this._config.reference[0];
+          }
+        } // If boundary is not `scrollParent`, then set position to `static`
+        // to allow the menu to "escape" the scroll parent's boundaries
+        // https://github.com/twbs/bootstrap/issues/24251
+
+
+        if (this._config.boundary !== 'scrollParent') {
+          $(parent).addClass(ClassName.POSITION_STATIC);
+        }
+
+        this._popper = new Popper(referenceElement, this._menu, this._getPopperConfig());
+      } // If this is a touch-enabled device we add extra
+      // empty mouseover listeners to the body's immediate children;
+      // only needed because of broken event delegation on iOS
+      // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
+
+
+      if ('ontouchstart' in document.documentElement && $(parent).closest(Selector.NAVBAR_NAV).length === 0) {
+        $(document.body).children().on('mouseover', null, $.noop);
+      }
+
+      this._element.focus();
+
+      this._element.setAttribute('aria-expanded', true);
+
+      $(this._menu).toggleClass(ClassName.SHOW);
+      $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
+    };
+
+    _proto.show = function show() {
+      if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || $(this._menu).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var relatedTarget = {
+        relatedTarget: this._element
+      };
+      var showEvent = $.Event(Event.SHOW, relatedTarget);
+
+      var parent = Dropdown._getParentFromElement(this._element);
+
+      $(parent).trigger(showEvent);
+
+      if (showEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      $(this._menu).toggleClass(ClassName.SHOW);
+      $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
+    };
+
+    _proto.hide = function hide() {
+      if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || !$(this._menu).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var relatedTarget = {
+        relatedTarget: this._element
+      };
+      var hideEvent = $.Event(Event.HIDE, relatedTarget);
+
+      var parent = Dropdown._getParentFromElement(this._element);
+
+      $(parent).trigger(hideEvent);
+
+      if (hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      $(this._menu).toggleClass(ClassName.SHOW);
+      $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      $(this._element).off(EVENT_KEY);
+      this._element = null;
+      this._menu = null;
+
+      if (this._popper !== null) {
+        this._popper.destroy();
+
+        this._popper = null;
+      }
+    };
+
+    _proto.update = function update() {
+      this._inNavbar = this._detectNavbar();
+
+      if (this._popper !== null) {
+        this._popper.scheduleUpdate();
+      }
+    } // Private
+    ;
+
+    _proto._addEventListeners = function _addEventListeners() {
+      var _this = this;
+
+      $(this._element).on(Event.CLICK, function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+
+        _this.toggle();
+      });
+    };
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, this.constructor.Default, $(this._element).data(), config);
+      Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+      return config;
+    };
+
+    _proto._getMenuElement = function _getMenuElement() {
+      if (!this._menu) {
+        var parent = Dropdown._getParentFromElement(this._element);
+
+        if (parent) {
+          this._menu = parent.querySelector(Selector.MENU);
+        }
+      }
+
+      return this._menu;
+    };
+
+    _proto._getPlacement = function _getPlacement() {
+      var $parentDropdown = $(this._element.parentNode);
+      var placement = AttachmentMap.BOTTOM; // Handle dropup
+
+      if ($parentDropdown.hasClass(ClassName.DROPUP)) {
+        placement = AttachmentMap.TOP;
+
+        if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
+          placement = AttachmentMap.TOPEND;
+        }
+      } else if ($parentDropdown.hasClass(ClassName.DROPRIGHT)) {
+        placement = AttachmentMap.RIGHT;
+      } else if ($parentDropdown.hasClass(ClassName.DROPLEFT)) {
+        placement = AttachmentMap.LEFT;
+      } else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
+        placement = AttachmentMap.BOTTOMEND;
+      }
+
+      return placement;
+    };
+
+    _proto._detectNavbar = function _detectNavbar() {
+      return $(this._element).closest('.navbar').length > 0;
+    };
+
+    _proto._getOffset = function _getOffset() {
+      var _this2 = this;
+
+      var offset = {};
+
+      if (typeof this._config.offset === 'function') {
+        offset.fn = function (data) {
+          data.offsets = _objectSpread({}, data.offsets, _this2._config.offset(data.offsets, _this2._element) || {});
+          return data;
+        };
+      } else {
+        offset.offset = this._config.offset;
+      }
+
+      return offset;
+    };
+
+    _proto._getPopperConfig = function _getPopperConfig() {
+      var popperConfig = {
+        placement: this._getPlacement(),
+        modifiers: {
+          offset: this._getOffset(),
+          flip: {
+            enabled: this._config.flip
+          },
+          preventOverflow: {
+            boundariesElement: this._config.boundary
+          }
+        } // Disable Popper.js if we have a static display
+
+      };
+
+      if (this._config.display === 'static') {
+        popperConfig.modifiers.applyStyle = {
+          enabled: false
+        };
+      }
+
+      return popperConfig;
+    } // Static
+    ;
+
+    Dropdown._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' ? config : null;
+
+        if (!data) {
+          data = new Dropdown(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    Dropdown._clearMenus = function _clearMenus(event) {
+      if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {
+        return;
+      }
+
+      var toggles = [].slice.call(document.querySelectorAll(Selector.DATA_TOGGLE));
+
+      for (var i = 0, len = toggles.length; i < len; i++) {
+        var parent = Dropdown._getParentFromElement(toggles[i]);
+
+        var context = $(toggles[i]).data(DATA_KEY);
+        var relatedTarget = {
+          relatedTarget: toggles[i]
+        };
+
+        if (event && event.type === 'click') {
+          relatedTarget.clickEvent = event;
+        }
+
+        if (!context) {
+          continue;
+        }
+
+        var dropdownMenu = context._menu;
+
+        if (!$(parent).hasClass(ClassName.SHOW)) {
+          continue;
+        }
+
+        if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $.contains(parent, event.target)) {
+          continue;
+        }
+
+        var hideEvent = $.Event(Event.HIDE, relatedTarget);
+        $(parent).trigger(hideEvent);
+
+        if (hideEvent.isDefaultPrevented()) {
+          continue;
+        } // If this is a touch-enabled device we remove the extra
+        // empty mouseover listeners we added for iOS support
+
+
+        if ('ontouchstart' in document.documentElement) {
+          $(document.body).children().off('mouseover', null, $.noop);
+        }
+
+        toggles[i].setAttribute('aria-expanded', 'false');
+        $(dropdownMenu).removeClass(ClassName.SHOW);
+        $(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
+      }
+    };
+
+    Dropdown._getParentFromElement = function _getParentFromElement(element) {
+      var parent;
+      var selector = Util.getSelectorFromElement(element);
+
+      if (selector) {
+        parent = document.querySelector(selector);
+      }
+
+      return parent || element.parentNode;
+    } // eslint-disable-next-line complexity
+    ;
+
+    Dropdown._dataApiKeydownHandler = function _dataApiKeydownHandler(event) {
+      // If not input/textarea:
+      //  - And not a key in REGEXP_KEYDOWN => not a dropdown command
+      // If input/textarea:
+      //  - If space key => not a dropdown command
+      //  - If key is other than escape
+      //    - If key is not up or down => not a dropdown command
+      //    - If trigger inside the menu => not a dropdown command
+      if (/input|textarea/i.test(event.target.tagName) ? event.which === SPACE_KEYCODE || event.which !== ESCAPE_KEYCODE && (event.which !== ARROW_DOWN_KEYCODE && event.which !== ARROW_UP_KEYCODE || $(event.target).closest(Selector.MENU).length) : !REGEXP_KEYDOWN.test(event.which)) {
+        return;
+      }
+
+      event.preventDefault();
+      event.stopPropagation();
+
+      if (this.disabled || $(this).hasClass(ClassName.DISABLED)) {
+        return;
+      }
+
+      var parent = Dropdown._getParentFromElement(this);
+
+      var isActive = $(parent).hasClass(ClassName.SHOW);
+
+      if (!isActive || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
+        if (event.which === ESCAPE_KEYCODE) {
+          var toggle = parent.querySelector(Selector.DATA_TOGGLE);
+          $(toggle).trigger('focus');
+        }
+
+        $(this).trigger('click');
+        return;
+      }
+
+      var items = [].slice.call(parent.querySelectorAll(Selector.VISIBLE_ITEMS));
+
+      if (items.length === 0) {
+        return;
+      }
+
+      var index = items.indexOf(event.target);
+
+      if (event.which === ARROW_UP_KEYCODE && index > 0) {
+        // Up
+        index--;
+      }
+
+      if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {
+        // Down
+        index++;
+      }
+
+      if (index < 0) {
+        index = 0;
+      }
+
+      items[index].focus();
+    };
+
+    _createClass(Dropdown, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }]);
+
+    return Dropdown;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + " " + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    event.preventDefault();
+    event.stopPropagation();
+
+    Dropdown._jQueryInterface.call($(this), 'toggle');
+  }).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) {
+    e.stopPropagation();
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Dropdown._jQueryInterface;
+  $.fn[NAME].Constructor = Dropdown;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Dropdown._jQueryInterface;
+  };
+
+  return Dropdown;
+
+}));
+/*!
+  * Bootstrap modal.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Modal = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'modal';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.modal';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
+
+  var Default = {
+    backdrop: true,
+    keyboard: true,
+    focus: true,
+    show: true
+  };
+  var DefaultType = {
+    backdrop: '(boolean|string)',
+    keyboard: 'boolean',
+    focus: 'boolean',
+    show: 'boolean'
+  };
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    FOCUSIN: "focusin" + EVENT_KEY,
+    RESIZE: "resize" + EVENT_KEY,
+    CLICK_DISMISS: "click.dismiss" + EVENT_KEY,
+    KEYDOWN_DISMISS: "keydown.dismiss" + EVENT_KEY,
+    MOUSEUP_DISMISS: "mouseup.dismiss" + EVENT_KEY,
+    MOUSEDOWN_DISMISS: "mousedown.dismiss" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    SCROLLABLE: 'modal-dialog-scrollable',
+    SCROLLBAR_MEASURER: 'modal-scrollbar-measure',
+    BACKDROP: 'modal-backdrop',
+    OPEN: 'modal-open',
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    DIALOG: '.modal-dialog',
+    MODAL_BODY: '.modal-body',
+    DATA_TOGGLE: '[data-toggle="modal"]',
+    DATA_DISMISS: '[data-dismiss="modal"]',
+    FIXED_CONTENT: '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top',
+    STICKY_CONTENT: '.sticky-top'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Modal =
+  /*#__PURE__*/
+  function () {
+    function Modal(element, config) {
+      this._config = this._getConfig(config);
+      this._element = element;
+      this._dialog = element.querySelector(Selector.DIALOG);
+      this._backdrop = null;
+      this._isShown = false;
+      this._isBodyOverflowing = false;
+      this._ignoreBackdropClick = false;
+      this._isTransitioning = false;
+      this._scrollbarWidth = 0;
+    } // Getters
+
+
+    var _proto = Modal.prototype;
+
+    // Public
+    _proto.toggle = function toggle(relatedTarget) {
+      return this._isShown ? this.hide() : this.show(relatedTarget);
+    };
+
+    _proto.show = function show(relatedTarget) {
+      var _this = this;
+
+      if (this._isShown || this._isTransitioning) {
+        return;
+      }
+
+      if ($(this._element).hasClass(ClassName.FADE)) {
+        this._isTransitioning = true;
+      }
+
+      var showEvent = $.Event(Event.SHOW, {
+        relatedTarget: relatedTarget
+      });
+      $(this._element).trigger(showEvent);
+
+      if (this._isShown || showEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      this._isShown = true;
+
+      this._checkScrollbar();
+
+      this._setScrollbar();
+
+      this._adjustDialog();
+
+      this._setEscapeEvent();
+
+      this._setResizeEvent();
+
+      $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
+        return _this.hide(event);
+      });
+      $(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
+        $(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
+          if ($(event.target).is(_this._element)) {
+            _this._ignoreBackdropClick = true;
+          }
+        });
+      });
+
+      this._showBackdrop(function () {
+        return _this._showElement(relatedTarget);
+      });
+    };
+
+    _proto.hide = function hide(event) {
+      var _this2 = this;
+
+      if (event) {
+        event.preventDefault();
+      }
+
+      if (!this._isShown || this._isTransitioning) {
+        return;
+      }
+
+      var hideEvent = $.Event(Event.HIDE);
+      $(this._element).trigger(hideEvent);
+
+      if (!this._isShown || hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      this._isShown = false;
+      var transition = $(this._element).hasClass(ClassName.FADE);
+
+      if (transition) {
+        this._isTransitioning = true;
+      }
+
+      this._setEscapeEvent();
+
+      this._setResizeEvent();
+
+      $(document).off(Event.FOCUSIN);
+      $(this._element).removeClass(ClassName.SHOW);
+      $(this._element).off(Event.CLICK_DISMISS);
+      $(this._dialog).off(Event.MOUSEDOWN_DISMISS);
+
+      if (transition) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+        $(this._element).one(Util.TRANSITION_END, function (event) {
+          return _this2._hideModal(event);
+        }).emulateTransitionEnd(transitionDuration);
+      } else {
+        this._hideModal();
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      [window, this._element, this._dialog].forEach(function (htmlElement) {
+        return $(htmlElement).off(EVENT_KEY);
+      });
+      /**
+       * `document` has 2 events `Event.FOCUSIN` and `Event.CLICK_DATA_API`
+       * Do not move `document` in `htmlElements` array
+       * It will remove `Event.CLICK_DATA_API` event that should remain
+       */
+
+      $(document).off(Event.FOCUSIN);
+      $.removeData(this._element, DATA_KEY);
+      this._config = null;
+      this._element = null;
+      this._dialog = null;
+      this._backdrop = null;
+      this._isShown = null;
+      this._isBodyOverflowing = null;
+      this._ignoreBackdropClick = null;
+      this._isTransitioning = null;
+      this._scrollbarWidth = null;
+    };
+
+    _proto.handleUpdate = function handleUpdate() {
+      this._adjustDialog();
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, config);
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._showElement = function _showElement(relatedTarget) {
+      var _this3 = this;
+
+      var transition = $(this._element).hasClass(ClassName.FADE);
+
+      if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
+        // Don't move modal's DOM position
+        document.body.appendChild(this._element);
+      }
+
+      this._element.style.display = 'block';
+
+      this._element.removeAttribute('aria-hidden');
+
+      this._element.setAttribute('aria-modal', true);
+
+      if ($(this._dialog).hasClass(ClassName.SCROLLABLE)) {
+        this._dialog.querySelector(Selector.MODAL_BODY).scrollTop = 0;
+      } else {
+        this._element.scrollTop = 0;
+      }
+
+      if (transition) {
+        Util.reflow(this._element);
+      }
+
+      $(this._element).addClass(ClassName.SHOW);
+
+      if (this._config.focus) {
+        this._enforceFocus();
+      }
+
+      var shownEvent = $.Event(Event.SHOWN, {
+        relatedTarget: relatedTarget
+      });
+
+      var transitionComplete = function transitionComplete() {
+        if (_this3._config.focus) {
+          _this3._element.focus();
+        }
+
+        _this3._isTransitioning = false;
+        $(_this3._element).trigger(shownEvent);
+      };
+
+      if (transition) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._dialog);
+        $(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(transitionDuration);
+      } else {
+        transitionComplete();
+      }
+    };
+
+    _proto._enforceFocus = function _enforceFocus() {
+      var _this4 = this;
+
+      $(document).off(Event.FOCUSIN) // Guard against infinite focus loop
+      .on(Event.FOCUSIN, function (event) {
+        if (document !== event.target && _this4._element !== event.target && $(_this4._element).has(event.target).length === 0) {
+          _this4._element.focus();
+        }
+      });
+    };
+
+    _proto._setEscapeEvent = function _setEscapeEvent() {
+      var _this5 = this;
+
+      if (this._isShown && this._config.keyboard) {
+        $(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
+          if (event.which === ESCAPE_KEYCODE) {
+            event.preventDefault();
+
+            _this5.hide();
+          }
+        });
+      } else if (!this._isShown) {
+        $(this._element).off(Event.KEYDOWN_DISMISS);
+      }
+    };
+
+    _proto._setResizeEvent = function _setResizeEvent() {
+      var _this6 = this;
+
+      if (this._isShown) {
+        $(window).on(Event.RESIZE, function (event) {
+          return _this6.handleUpdate(event);
+        });
+      } else {
+        $(window).off(Event.RESIZE);
+      }
+    };
+
+    _proto._hideModal = function _hideModal() {
+      var _this7 = this;
+
+      this._element.style.display = 'none';
+
+      this._element.setAttribute('aria-hidden', true);
+
+      this._element.removeAttribute('aria-modal');
+
+      this._isTransitioning = false;
+
+      this._showBackdrop(function () {
+        $(document.body).removeClass(ClassName.OPEN);
+
+        _this7._resetAdjustments();
+
+        _this7._resetScrollbar();
+
+        $(_this7._element).trigger(Event.HIDDEN);
+      });
+    };
+
+    _proto._removeBackdrop = function _removeBackdrop() {
+      if (this._backdrop) {
+        $(this._backdrop).remove();
+        this._backdrop = null;
+      }
+    };
+
+    _proto._showBackdrop = function _showBackdrop(callback) {
+      var _this8 = this;
+
+      var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
+
+      if (this._isShown && this._config.backdrop) {
+        this._backdrop = document.createElement('div');
+        this._backdrop.className = ClassName.BACKDROP;
+
+        if (animate) {
+          this._backdrop.classList.add(animate);
+        }
+
+        $(this._backdrop).appendTo(document.body);
+        $(this._element).on(Event.CLICK_DISMISS, function (event) {
+          if (_this8._ignoreBackdropClick) {
+            _this8._ignoreBackdropClick = false;
+            return;
+          }
+
+          if (event.target !== event.currentTarget) {
+            return;
+          }
+
+          if (_this8._config.backdrop === 'static') {
+            _this8._element.focus();
+          } else {
+            _this8.hide();
+          }
+        });
+
+        if (animate) {
+          Util.reflow(this._backdrop);
+        }
+
+        $(this._backdrop).addClass(ClassName.SHOW);
+
+        if (!callback) {
+          return;
+        }
+
+        if (!animate) {
+          callback();
+          return;
+        }
+
+        var backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop);
+        $(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(backdropTransitionDuration);
+      } else if (!this._isShown && this._backdrop) {
+        $(this._backdrop).removeClass(ClassName.SHOW);
+
+        var callbackRemove = function callbackRemove() {
+          _this8._removeBackdrop();
+
+          if (callback) {
+            callback();
+          }
+        };
+
+        if ($(this._element).hasClass(ClassName.FADE)) {
+          var _backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop);
+
+          $(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(_backdropTransitionDuration);
+        } else {
+          callbackRemove();
+        }
+      } else if (callback) {
+        callback();
+      }
+    } // ----------------------------------------------------------------------
+    // the following methods are used to handle overflowing modals
+    // todo (fat): these should probably be refactored out of modal.js
+    // ----------------------------------------------------------------------
+    ;
+
+    _proto._adjustDialog = function _adjustDialog() {
+      var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
+
+      if (!this._isBodyOverflowing && isModalOverflowing) {
+        this._element.style.paddingLeft = this._scrollbarWidth + "px";
+      }
+
+      if (this._isBodyOverflowing && !isModalOverflowing) {
+        this._element.style.paddingRight = this._scrollbarWidth + "px";
+      }
+    };
+
+    _proto._resetAdjustments = function _resetAdjustments() {
+      this._element.style.paddingLeft = '';
+      this._element.style.paddingRight = '';
+    };
+
+    _proto._checkScrollbar = function _checkScrollbar() {
+      var rect = document.body.getBoundingClientRect();
+      this._isBodyOverflowing = rect.left + rect.right < window.innerWidth;
+      this._scrollbarWidth = this._getScrollbarWidth();
+    };
+
+    _proto._setScrollbar = function _setScrollbar() {
+      var _this9 = this;
+
+      if (this._isBodyOverflowing) {
+        // Note: DOMNode.style.paddingRight returns the actual value or '' if not set
+        //   while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
+        var fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT));
+        var stickyContent = [].slice.call(document.querySelectorAll(Selector.STICKY_CONTENT)); // Adjust fixed content padding
+
+        $(fixedContent).each(function (index, element) {
+          var actualPadding = element.style.paddingRight;
+          var calculatedPadding = $(element).css('padding-right');
+          $(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + "px");
+        }); // Adjust sticky content margin
+
+        $(stickyContent).each(function (index, element) {
+          var actualMargin = element.style.marginRight;
+          var calculatedMargin = $(element).css('margin-right');
+          $(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + "px");
+        }); // Adjust body padding
+
+        var actualPadding = document.body.style.paddingRight;
+        var calculatedPadding = $(document.body).css('padding-right');
+        $(document.body).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + "px");
+      }
+
+      $(document.body).addClass(ClassName.OPEN);
+    };
+
+    _proto._resetScrollbar = function _resetScrollbar() {
+      // Restore fixed content padding
+      var fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT));
+      $(fixedContent).each(function (index, element) {
+        var padding = $(element).data('padding-right');
+        $(element).removeData('padding-right');
+        element.style.paddingRight = padding ? padding : '';
+      }); // Restore sticky content
+
+      var elements = [].slice.call(document.querySelectorAll("" + Selector.STICKY_CONTENT));
+      $(elements).each(function (index, element) {
+        var margin = $(element).data('margin-right');
+
+        if (typeof margin !== 'undefined') {
+          $(element).css('margin-right', margin).removeData('margin-right');
+        }
+      }); // Restore body padding
+
+      var padding = $(document.body).data('padding-right');
+      $(document.body).removeData('padding-right');
+      document.body.style.paddingRight = padding ? padding : '';
+    };
+
+    _proto._getScrollbarWidth = function _getScrollbarWidth() {
+      // thx d.walsh
+      var scrollDiv = document.createElement('div');
+      scrollDiv.className = ClassName.SCROLLBAR_MEASURER;
+      document.body.appendChild(scrollDiv);
+      var scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
+      document.body.removeChild(scrollDiv);
+      return scrollbarWidth;
+    } // Static
+    ;
+
+    Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = _objectSpread({}, Default, $(this).data(), typeof config === 'object' && config ? config : {});
+
+        if (!data) {
+          data = new Modal(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config](relatedTarget);
+        } else if (_config.show) {
+          data.show(relatedTarget);
+        }
+      });
+    };
+
+    _createClass(Modal, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Modal;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    var _this10 = this;
+
+    var target;
+    var selector = Util.getSelectorFromElement(this);
+
+    if (selector) {
+      target = document.querySelector(selector);
+    }
+
+    var config = $(target).data(DATA_KEY) ? 'toggle' : _objectSpread({}, $(target).data(), $(this).data());
+
+    if (this.tagName === 'A' || this.tagName === 'AREA') {
+      event.preventDefault();
+    }
+
+    var $target = $(target).one(Event.SHOW, function (showEvent) {
+      if (showEvent.isDefaultPrevented()) {
+        // Only register focus restorer if modal will actually get shown
+        return;
+      }
+
+      $target.one(Event.HIDDEN, function () {
+        if ($(_this10).is(':visible')) {
+          _this10.focus();
+        }
+      });
+    });
+
+    Modal._jQueryInterface.call($(target), config, this);
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Modal._jQueryInterface;
+  $.fn[NAME].Constructor = Modal;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Modal._jQueryInterface;
+  };
+
+  return Modal;
+
+}));
+/*!
+  * Bootstrap tooltip.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('popper.js'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', 'popper.js', './util.js'], factory) :
+  (global = global || self, global.Tooltip = factory(global.jQuery, global.Popper, global.Util));
+}(this, function ($, Popper, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Popper = Popper && Popper.hasOwnProperty('default') ? Popper['default'] : Popper;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * --------------------------------------------------------------------------
+   * Bootstrap (v4.3.1): tools/sanitizer.js
+   * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+   * --------------------------------------------------------------------------
+   */
+  var uriAttrs = ['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href'];
+  var ARIA_ATTRIBUTE_PATTERN = /^aria-[\w-]*$/i;
+  var DefaultWhitelist = {
+    // Global attributes allowed on any supplied element below.
+    '*': ['class', 'dir', 'id', 'lang', 'role', ARIA_ATTRIBUTE_PATTERN],
+    a: ['target', 'href', 'title', 'rel'],
+    area: [],
+    b: [],
+    br: [],
+    col: [],
+    code: [],
+    div: [],
+    em: [],
+    hr: [],
+    h1: [],
+    h2: [],
+    h3: [],
+    h4: [],
+    h5: [],
+    h6: [],
+    i: [],
+    img: ['src', 'alt', 'title', 'width', 'height'],
+    li: [],
+    ol: [],
+    p: [],
+    pre: [],
+    s: [],
+    small: [],
+    span: [],
+    sub: [],
+    sup: [],
+    strong: [],
+    u: [],
+    ul: []
+    /**
+     * A pattern that recognizes a commonly useful subset of URLs that are safe.
+     *
+     * Shoutout to Angular 7 https://github.com/angular/angular/blob/7.2.4/packages/core/src/sanitization/url_sanitizer.ts
+     */
+
+  };
+  var SAFE_URL_PATTERN = /^(?:(?:https?|mailto|ftp|tel|file):|[^&:/?#]*(?:[/?#]|$))/gi;
+  /**
+   * A pattern that matches safe data URLs. Only matches image, video and audio types.
+   *
+   * Shoutout to Angular 7 https://github.com/angular/angular/blob/7.2.4/packages/core/src/sanitization/url_sanitizer.ts
+   */
+
+  var DATA_URL_PATTERN = /^data:(?:image\/(?:bmp|gif|jpeg|jpg|png|tiff|webp)|video\/(?:mpeg|mp4|ogg|webm)|audio\/(?:mp3|oga|ogg|opus));base64,[a-z0-9+/]+=*$/i;
+
+  function allowedAttribute(attr, allowedAttributeList) {
+    var attrName = attr.nodeName.toLowerCase();
+
+    if (allowedAttributeList.indexOf(attrName) !== -1) {
+      if (uriAttrs.indexOf(attrName) !== -1) {
+        return Boolean(attr.nodeValue.match(SAFE_URL_PATTERN) || attr.nodeValue.match(DATA_URL_PATTERN));
+      }
+
+      return true;
+    }
+
+    var regExp = allowedAttributeList.filter(function (attrRegex) {
+      return attrRegex instanceof RegExp;
+    }); // Check if a regular expression validates the attribute.
+
+    for (var i = 0, l = regExp.length; i < l; i++) {
+      if (attrName.match(regExp[i])) {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  function sanitizeHtml(unsafeHtml, whiteList, sanitizeFn) {
+    if (unsafeHtml.length === 0) {
+      return unsafeHtml;
+    }
+
+    if (sanitizeFn && typeof sanitizeFn === 'function') {
+      return sanitizeFn(unsafeHtml);
+    }
+
+    var domParser = new window.DOMParser();
+    var createdDocument = domParser.parseFromString(unsafeHtml, 'text/html');
+    var whitelistKeys = Object.keys(whiteList);
+    var elements = [].slice.call(createdDocument.body.querySelectorAll('*'));
+
+    var _loop = function _loop(i, len) {
+      var el = elements[i];
+      var elName = el.nodeName.toLowerCase();
+
+      if (whitelistKeys.indexOf(el.nodeName.toLowerCase()) === -1) {
+        el.parentNode.removeChild(el);
+        return "continue";
+      }
+
+      var attributeList = [].slice.call(el.attributes);
+      var whitelistedAttributes = [].concat(whiteList['*'] || [], whiteList[elName] || []);
+      attributeList.forEach(function (attr) {
+        if (!allowedAttribute(attr, whitelistedAttributes)) {
+          el.removeAttribute(attr.nodeName);
+        }
+      });
+    };
+
+    for (var i = 0, len = elements.length; i < len; i++) {
+      var _ret = _loop(i, len);
+
+      if (_ret === "continue") continue;
+    }
+
+    return createdDocument.body.innerHTML;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'tooltip';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.tooltip';
+  var EVENT_KEY = "." + DATA_KEY;
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var CLASS_PREFIX = 'bs-tooltip';
+  var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
+  var DISALLOWED_ATTRIBUTES = ['sanitize', 'whiteList', 'sanitizeFn'];
+  var DefaultType = {
+    animation: 'boolean',
+    template: 'string',
+    title: '(string|element|function)',
+    trigger: 'string',
+    delay: '(number|object)',
+    html: 'boolean',
+    selector: '(string|boolean)',
+    placement: '(string|function)',
+    offset: '(number|string|function)',
+    container: '(string|element|boolean)',
+    fallbackPlacement: '(string|array)',
+    boundary: '(string|element)',
+    sanitize: 'boolean',
+    sanitizeFn: '(null|function)',
+    whiteList: 'object'
+  };
+  var AttachmentMap = {
+    AUTO: 'auto',
+    TOP: 'top',
+    RIGHT: 'right',
+    BOTTOM: 'bottom',
+    LEFT: 'left'
+  };
+  var Default = {
+    animation: true,
+    template: '<div class="tooltip" role="tooltip">' + '<div class="arrow"></div>' + '<div class="tooltip-inner"></div></div>',
+    trigger: 'hover focus',
+    title: '',
+    delay: 0,
+    html: false,
+    selector: false,
+    placement: 'top',
+    offset: 0,
+    container: false,
+    fallbackPlacement: 'flip',
+    boundary: 'scrollParent',
+    sanitize: true,
+    sanitizeFn: null,
+    whiteList: DefaultWhitelist
+  };
+  var HoverState = {
+    SHOW: 'show',
+    OUT: 'out'
+  };
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    INSERTED: "inserted" + EVENT_KEY,
+    CLICK: "click" + EVENT_KEY,
+    FOCUSIN: "focusin" + EVENT_KEY,
+    FOCUSOUT: "focusout" + EVENT_KEY,
+    MOUSEENTER: "mouseenter" + EVENT_KEY,
+    MOUSELEAVE: "mouseleave" + EVENT_KEY
+  };
+  var ClassName = {
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    TOOLTIP: '.tooltip',
+    TOOLTIP_INNER: '.tooltip-inner',
+    ARROW: '.arrow'
+  };
+  var Trigger = {
+    HOVER: 'hover',
+    FOCUS: 'focus',
+    CLICK: 'click',
+    MANUAL: 'manual'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Tooltip =
+  /*#__PURE__*/
+  function () {
+    function Tooltip(element, config) {
+      /**
+       * Check for Popper dependency
+       * Popper - https://popper.js.org
+       */
+      if (typeof Popper === 'undefined') {
+        throw new TypeError('Bootstrap\'s tooltips require Popper.js (https://popper.js.org/)');
+      } // private
+
+
+      this._isEnabled = true;
+      this._timeout = 0;
+      this._hoverState = '';
+      this._activeTrigger = {};
+      this._popper = null; // Protected
+
+      this.element = element;
+      this.config = this._getConfig(config);
+      this.tip = null;
+
+      this._setListeners();
+    } // Getters
+
+
+    var _proto = Tooltip.prototype;
+
+    // Public
+    _proto.enable = function enable() {
+      this._isEnabled = true;
+    };
+
+    _proto.disable = function disable() {
+      this._isEnabled = false;
+    };
+
+    _proto.toggleEnabled = function toggleEnabled() {
+      this._isEnabled = !this._isEnabled;
+    };
+
+    _proto.toggle = function toggle(event) {
+      if (!this._isEnabled) {
+        return;
+      }
+
+      if (event) {
+        var dataKey = this.constructor.DATA_KEY;
+        var context = $(event.currentTarget).data(dataKey);
+
+        if (!context) {
+          context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+          $(event.currentTarget).data(dataKey, context);
+        }
+
+        context._activeTrigger.click = !context._activeTrigger.click;
+
+        if (context._isWithActiveTrigger()) {
+          context._enter(null, context);
+        } else {
+          context._leave(null, context);
+        }
+      } else {
+        if ($(this.getTipElement()).hasClass(ClassName.SHOW)) {
+          this._leave(null, this);
+
+          return;
+        }
+
+        this._enter(null, this);
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      clearTimeout(this._timeout);
+      $.removeData(this.element, this.constructor.DATA_KEY);
+      $(this.element).off(this.constructor.EVENT_KEY);
+      $(this.element).closest('.modal').off('hide.bs.modal');
+
+      if (this.tip) {
+        $(this.tip).remove();
+      }
+
+      this._isEnabled = null;
+      this._timeout = null;
+      this._hoverState = null;
+      this._activeTrigger = null;
+
+      if (this._popper !== null) {
+        this._popper.destroy();
+      }
+
+      this._popper = null;
+      this.element = null;
+      this.config = null;
+      this.tip = null;
+    };
+
+    _proto.show = function show() {
+      var _this = this;
+
+      if ($(this.element).css('display') === 'none') {
+        throw new Error('Please use show on visible elements');
+      }
+
+      var showEvent = $.Event(this.constructor.Event.SHOW);
+
+      if (this.isWithContent() && this._isEnabled) {
+        $(this.element).trigger(showEvent);
+        var shadowRoot = Util.findShadowRoot(this.element);
+        var isInTheDom = $.contains(shadowRoot !== null ? shadowRoot : this.element.ownerDocument.documentElement, this.element);
+
+        if (showEvent.isDefaultPrevented() || !isInTheDom) {
+          return;
+        }
+
+        var tip = this.getTipElement();
+        var tipId = Util.getUID(this.constructor.NAME);
+        tip.setAttribute('id', tipId);
+        this.element.setAttribute('aria-describedby', tipId);
+        this.setContent();
+
+        if (this.config.animation) {
+          $(tip).addClass(ClassName.FADE);
+        }
+
+        var placement = typeof this.config.placement === 'function' ? this.config.placement.call(this, tip, this.element) : this.config.placement;
+
+        var attachment = this._getAttachment(placement);
+
+        this.addAttachmentClass(attachment);
+
+        var container = this._getContainer();
+
+        $(tip).data(this.constructor.DATA_KEY, this);
+
+        if (!$.contains(this.element.ownerDocument.documentElement, this.tip)) {
+          $(tip).appendTo(container);
+        }
+
+        $(this.element).trigger(this.constructor.Event.INSERTED);
+        this._popper = new Popper(this.element, tip, {
+          placement: attachment,
+          modifiers: {
+            offset: this._getOffset(),
+            flip: {
+              behavior: this.config.fallbackPlacement
+            },
+            arrow: {
+              element: Selector.ARROW
+            },
+            preventOverflow: {
+              boundariesElement: this.config.boundary
+            }
+          },
+          onCreate: function onCreate(data) {
+            if (data.originalPlacement !== data.placement) {
+              _this._handlePopperPlacementChange(data);
+            }
+          },
+          onUpdate: function onUpdate(data) {
+            return _this._handlePopperPlacementChange(data);
+          }
+        });
+        $(tip).addClass(ClassName.SHOW); // If this is a touch-enabled device we add extra
+        // empty mouseover listeners to the body's immediate children;
+        // only needed because of broken event delegation on iOS
+        // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
+
+        if ('ontouchstart' in document.documentElement) {
+          $(document.body).children().on('mouseover', null, $.noop);
+        }
+
+        var complete = function complete() {
+          if (_this.config.animation) {
+            _this._fixTransition();
+          }
+
+          var prevHoverState = _this._hoverState;
+          _this._hoverState = null;
+          $(_this.element).trigger(_this.constructor.Event.SHOWN);
+
+          if (prevHoverState === HoverState.OUT) {
+            _this._leave(null, _this);
+          }
+        };
+
+        if ($(this.tip).hasClass(ClassName.FADE)) {
+          var transitionDuration = Util.getTransitionDurationFromElement(this.tip);
+          $(this.tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+        } else {
+          complete();
+        }
+      }
+    };
+
+    _proto.hide = function hide(callback) {
+      var _this2 = this;
+
+      var tip = this.getTipElement();
+      var hideEvent = $.Event(this.constructor.Event.HIDE);
+
+      var complete = function complete() {
+        if (_this2._hoverState !== HoverState.SHOW && tip.parentNode) {
+          tip.parentNode.removeChild(tip);
+        }
+
+        _this2._cleanTipClass();
+
+        _this2.element.removeAttribute('aria-describedby');
+
+        $(_this2.element).trigger(_this2.constructor.Event.HIDDEN);
+
+        if (_this2._popper !== null) {
+          _this2._popper.destroy();
+        }
+
+        if (callback) {
+          callback();
+        }
+      };
+
+      $(this.element).trigger(hideEvent);
+
+      if (hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      $(tip).removeClass(ClassName.SHOW); // If this is a touch-enabled device we remove the extra
+      // empty mouseover listeners we added for iOS support
+
+      if ('ontouchstart' in document.documentElement) {
+        $(document.body).children().off('mouseover', null, $.noop);
+      }
+
+      this._activeTrigger[Trigger.CLICK] = false;
+      this._activeTrigger[Trigger.FOCUS] = false;
+      this._activeTrigger[Trigger.HOVER] = false;
+
+      if ($(this.tip).hasClass(ClassName.FADE)) {
+        var transitionDuration = Util.getTransitionDurationFromElement(tip);
+        $(tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+
+      this._hoverState = '';
+    };
+
+    _proto.update = function update() {
+      if (this._popper !== null) {
+        this._popper.scheduleUpdate();
+      }
+    } // Protected
+    ;
+
+    _proto.isWithContent = function isWithContent() {
+      return Boolean(this.getTitle());
+    };
+
+    _proto.addAttachmentClass = function addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
+    };
+
+    _proto.getTipElement = function getTipElement() {
+      this.tip = this.tip || $(this.config.template)[0];
+      return this.tip;
+    };
+
+    _proto.setContent = function setContent() {
+      var tip = this.getTipElement();
+      this.setElementContent($(tip.querySelectorAll(Selector.TOOLTIP_INNER)), this.getTitle());
+      $(tip).removeClass(ClassName.FADE + " " + ClassName.SHOW);
+    };
+
+    _proto.setElementContent = function setElementContent($element, content) {
+      if (typeof content === 'object' && (content.nodeType || content.jquery)) {
+        // Content is a DOM node or a jQuery
+        if (this.config.html) {
+          if (!$(content).parent().is($element)) {
+            $element.empty().append(content);
+          }
+        } else {
+          $element.text($(content).text());
+        }
+
+        return;
+      }
+
+      if (this.config.html) {
+        if (this.config.sanitize) {
+          content = sanitizeHtml(content, this.config.whiteList, this.config.sanitizeFn);
+        }
+
+        $element.html(content);
+      } else {
+        $element.text(content);
+      }
+    };
+
+    _proto.getTitle = function getTitle() {
+      var title = this.element.getAttribute('data-original-title');
+
+      if (!title) {
+        title = typeof this.config.title === 'function' ? this.config.title.call(this.element) : this.config.title;
+      }
+
+      return title;
+    } // Private
+    ;
+
+    _proto._getOffset = function _getOffset() {
+      var _this3 = this;
+
+      var offset = {};
+
+      if (typeof this.config.offset === 'function') {
+        offset.fn = function (data) {
+          data.offsets = _objectSpread({}, data.offsets, _this3.config.offset(data.offsets, _this3.element) || {});
+          return data;
+        };
+      } else {
+        offset.offset = this.config.offset;
+      }
+
+      return offset;
+    };
+
+    _proto._getContainer = function _getContainer() {
+      if (this.config.container === false) {
+        return document.body;
+      }
+
+      if (Util.isElement(this.config.container)) {
+        return $(this.config.container);
+      }
+
+      return $(document).find(this.config.container);
+    };
+
+    _proto._getAttachment = function _getAttachment(placement) {
+      return AttachmentMap[placement.toUpperCase()];
+    };
+
+    _proto._setListeners = function _setListeners() {
+      var _this4 = this;
+
+      var triggers = this.config.trigger.split(' ');
+      triggers.forEach(function (trigger) {
+        if (trigger === 'click') {
+          $(_this4.element).on(_this4.constructor.Event.CLICK, _this4.config.selector, function (event) {
+            return _this4.toggle(event);
+          });
+        } else if (trigger !== Trigger.MANUAL) {
+          var eventIn = trigger === Trigger.HOVER ? _this4.constructor.Event.MOUSEENTER : _this4.constructor.Event.FOCUSIN;
+          var eventOut = trigger === Trigger.HOVER ? _this4.constructor.Event.MOUSELEAVE : _this4.constructor.Event.FOCUSOUT;
+          $(_this4.element).on(eventIn, _this4.config.selector, function (event) {
+            return _this4._enter(event);
+          }).on(eventOut, _this4.config.selector, function (event) {
+            return _this4._leave(event);
+          });
+        }
+      });
+      $(this.element).closest('.modal').on('hide.bs.modal', function () {
+        if (_this4.element) {
+          _this4.hide();
+        }
+      });
+
+      if (this.config.selector) {
+        this.config = _objectSpread({}, this.config, {
+          trigger: 'manual',
+          selector: ''
+        });
+      } else {
+        this._fixTitle();
+      }
+    };
+
+    _proto._fixTitle = function _fixTitle() {
+      var titleType = typeof this.element.getAttribute('data-original-title');
+
+      if (this.element.getAttribute('title') || titleType !== 'string') {
+        this.element.setAttribute('data-original-title', this.element.getAttribute('title') || '');
+        this.element.setAttribute('title', '');
+      }
+    };
+
+    _proto._enter = function _enter(event, context) {
+      var dataKey = this.constructor.DATA_KEY;
+      context = context || $(event.currentTarget).data(dataKey);
+
+      if (!context) {
+        context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+        $(event.currentTarget).data(dataKey, context);
+      }
+
+      if (event) {
+        context._activeTrigger[event.type === 'focusin' ? Trigger.FOCUS : Trigger.HOVER] = true;
+      }
+
+      if ($(context.getTipElement()).hasClass(ClassName.SHOW) || context._hoverState === HoverState.SHOW) {
+        context._hoverState = HoverState.SHOW;
+        return;
+      }
+
+      clearTimeout(context._timeout);
+      context._hoverState = HoverState.SHOW;
+
+      if (!context.config.delay || !context.config.delay.show) {
+        context.show();
+        return;
+      }
+
+      context._timeout = setTimeout(function () {
+        if (context._hoverState === HoverState.SHOW) {
+          context.show();
+        }
+      }, context.config.delay.show);
+    };
+
+    _proto._leave = function _leave(event, context) {
+      var dataKey = this.constructor.DATA_KEY;
+      context = context || $(event.currentTarget).data(dataKey);
+
+      if (!context) {
+        context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+        $(event.currentTarget).data(dataKey, context);
+      }
+
+      if (event) {
+        context._activeTrigger[event.type === 'focusout' ? Trigger.FOCUS : Trigger.HOVER] = false;
+      }
+
+      if (context._isWithActiveTrigger()) {
+        return;
+      }
+
+      clearTimeout(context._timeout);
+      context._hoverState = HoverState.OUT;
+
+      if (!context.config.delay || !context.config.delay.hide) {
+        context.hide();
+        return;
+      }
+
+      context._timeout = setTimeout(function () {
+        if (context._hoverState === HoverState.OUT) {
+          context.hide();
+        }
+      }, context.config.delay.hide);
+    };
+
+    _proto._isWithActiveTrigger = function _isWithActiveTrigger() {
+      for (var trigger in this._activeTrigger) {
+        if (this._activeTrigger[trigger]) {
+          return true;
+        }
+      }
+
+      return false;
+    };
+
+    _proto._getConfig = function _getConfig(config) {
+      var dataAttributes = $(this.element).data();
+      Object.keys(dataAttributes).forEach(function (dataAttr) {
+        if (DISALLOWED_ATTRIBUTES.indexOf(dataAttr) !== -1) {
+          delete dataAttributes[dataAttr];
+        }
+      });
+      config = _objectSpread({}, this.constructor.Default, dataAttributes, typeof config === 'object' && config ? config : {});
+
+      if (typeof config.delay === 'number') {
+        config.delay = {
+          show: config.delay,
+          hide: config.delay
+        };
+      }
+
+      if (typeof config.title === 'number') {
+        config.title = config.title.toString();
+      }
+
+      if (typeof config.content === 'number') {
+        config.content = config.content.toString();
+      }
+
+      Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+
+      if (config.sanitize) {
+        config.template = sanitizeHtml(config.template, config.whiteList, config.sanitizeFn);
+      }
+
+      return config;
+    };
+
+    _proto._getDelegateConfig = function _getDelegateConfig() {
+      var config = {};
+
+      if (this.config) {
+        for (var key in this.config) {
+          if (this.constructor.Default[key] !== this.config[key]) {
+            config[key] = this.config[key];
+          }
+        }
+      }
+
+      return config;
+    };
+
+    _proto._cleanTipClass = function _cleanTipClass() {
+      var $tip = $(this.getTipElement());
+      var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
+
+      if (tabClass !== null && tabClass.length) {
+        $tip.removeClass(tabClass.join(''));
+      }
+    };
+
+    _proto._handlePopperPlacementChange = function _handlePopperPlacementChange(popperData) {
+      var popperInstance = popperData.instance;
+      this.tip = popperInstance.popper;
+
+      this._cleanTipClass();
+
+      this.addAttachmentClass(this._getAttachment(popperData.placement));
+    };
+
+    _proto._fixTransition = function _fixTransition() {
+      var tip = this.getTipElement();
+      var initConfigAnimation = this.config.animation;
+
+      if (tip.getAttribute('x-placement') !== null) {
+        return;
+      }
+
+      $(tip).removeClass(ClassName.FADE);
+      this.config.animation = false;
+      this.hide();
+      this.show();
+      this.config.animation = initConfigAnimation;
+    } // Static
+    ;
+
+    Tooltip._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' && config;
+
+        if (!data && /dispose|hide/.test(config)) {
+          return;
+        }
+
+        if (!data) {
+          data = new Tooltip(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Tooltip, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }, {
+      key: "NAME",
+      get: function get() {
+        return NAME;
+      }
+    }, {
+      key: "DATA_KEY",
+      get: function get() {
+        return DATA_KEY;
+      }
+    }, {
+      key: "Event",
+      get: function get() {
+        return Event;
+      }
+    }, {
+      key: "EVENT_KEY",
+      get: function get() {
+        return EVENT_KEY;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }]);
+
+    return Tooltip;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+
+  $.fn[NAME] = Tooltip._jQueryInterface;
+  $.fn[NAME].Constructor = Tooltip;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Tooltip._jQueryInterface;
+  };
+
+  return Tooltip;
+
+}));
+/*!
+  * Bootstrap popover.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./tooltip.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './tooltip.js'], factory) :
+  (global = global || self, global.Popover = factory(global.jQuery, global.Tooltip));
+}(this, function ($, Tooltip) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Tooltip = Tooltip && Tooltip.hasOwnProperty('default') ? Tooltip['default'] : Tooltip;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  function _inheritsLoose(subClass, superClass) {
+    subClass.prototype = Object.create(superClass.prototype);
+    subClass.prototype.constructor = subClass;
+    subClass.__proto__ = superClass;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'popover';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.popover';
+  var EVENT_KEY = "." + DATA_KEY;
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var CLASS_PREFIX = 'bs-popover';
+  var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
+
+  var Default = _objectSpread({}, Tooltip.Default, {
+    placement: 'right',
+    trigger: 'click',
+    content: '',
+    template: '<div class="popover" role="tooltip">' + '<div class="arrow"></div>' + '<h3 class="popover-header"></h3>' + '<div class="popover-body"></div></div>'
+  });
+
+  var DefaultType = _objectSpread({}, Tooltip.DefaultType, {
+    content: '(string|element|function)'
+  });
+
+  var ClassName = {
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    TITLE: '.popover-header',
+    CONTENT: '.popover-body'
+  };
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    INSERTED: "inserted" + EVENT_KEY,
+    CLICK: "click" + EVENT_KEY,
+    FOCUSIN: "focusin" + EVENT_KEY,
+    FOCUSOUT: "focusout" + EVENT_KEY,
+    MOUSEENTER: "mouseenter" + EVENT_KEY,
+    MOUSELEAVE: "mouseleave" + EVENT_KEY
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Popover =
+  /*#__PURE__*/
+  function (_Tooltip) {
+    _inheritsLoose(Popover, _Tooltip);
+
+    function Popover() {
+      return _Tooltip.apply(this, arguments) || this;
+    }
+
+    var _proto = Popover.prototype;
+
+    // Overrides
+    _proto.isWithContent = function isWithContent() {
+      return this.getTitle() || this._getContent();
+    };
+
+    _proto.addAttachmentClass = function addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
+    };
+
+    _proto.getTipElement = function getTipElement() {
+      this.tip = this.tip || $(this.config.template)[0];
+      return this.tip;
+    };
+
+    _proto.setContent = function setContent() {
+      var $tip = $(this.getTipElement()); // We use append for html objects to maintain js events
+
+      this.setElementContent($tip.find(Selector.TITLE), this.getTitle());
+
+      var content = this._getContent();
+
+      if (typeof content === 'function') {
+        content = content.call(this.element);
+      }
+
+      this.setElementContent($tip.find(Selector.CONTENT), content);
+      $tip.removeClass(ClassName.FADE + " " + ClassName.SHOW);
+    } // Private
+    ;
+
+    _proto._getContent = function _getContent() {
+      return this.element.getAttribute('data-content') || this.config.content;
+    };
+
+    _proto._cleanTipClass = function _cleanTipClass() {
+      var $tip = $(this.getTipElement());
+      var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
+
+      if (tabClass !== null && tabClass.length > 0) {
+        $tip.removeClass(tabClass.join(''));
+      }
+    } // Static
+    ;
+
+    Popover._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' ? config : null;
+
+        if (!data && /dispose|hide/.test(config)) {
+          return;
+        }
+
+        if (!data) {
+          data = new Popover(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Popover, null, [{
+      key: "VERSION",
+      // Getters
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }, {
+      key: "NAME",
+      get: function get() {
+        return NAME;
+      }
+    }, {
+      key: "DATA_KEY",
+      get: function get() {
+        return DATA_KEY;
+      }
+    }, {
+      key: "Event",
+      get: function get() {
+        return Event;
+      }
+    }, {
+      key: "EVENT_KEY",
+      get: function get() {
+        return EVENT_KEY;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }]);
+
+    return Popover;
+  }(Tooltip);
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+
+  $.fn[NAME] = Popover._jQueryInterface;
+  $.fn[NAME].Constructor = Popover;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Popover._jQueryInterface;
+  };
+
+  return Popover;
+
+}));
+/*!
+  * Bootstrap scrollspy.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.ScrollSpy = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'scrollspy';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.scrollspy';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Default = {
+    offset: 10,
+    method: 'auto',
+    target: ''
+  };
+  var DefaultType = {
+    offset: 'number',
+    method: 'string',
+    target: '(string|element)'
+  };
+  var Event = {
+    ACTIVATE: "activate" + EVENT_KEY,
+    SCROLL: "scroll" + EVENT_KEY,
+    LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    DROPDOWN_ITEM: 'dropdown-item',
+    DROPDOWN_MENU: 'dropdown-menu',
+    ACTIVE: 'active'
+  };
+  var Selector = {
+    DATA_SPY: '[data-spy="scroll"]',
+    ACTIVE: '.active',
+    NAV_LIST_GROUP: '.nav, .list-group',
+    NAV_LINKS: '.nav-link',
+    NAV_ITEMS: '.nav-item',
+    LIST_ITEMS: '.list-group-item',
+    DROPDOWN: '.dropdown',
+    DROPDOWN_ITEMS: '.dropdown-item',
+    DROPDOWN_TOGGLE: '.dropdown-toggle'
+  };
+  var OffsetMethod = {
+    OFFSET: 'offset',
+    POSITION: 'position'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var ScrollSpy =
+  /*#__PURE__*/
+  function () {
+    function ScrollSpy(element, config) {
+      var _this = this;
+
+      this._element = element;
+      this._scrollElement = element.tagName === 'BODY' ? window : element;
+      this._config = this._getConfig(config);
+      this._selector = this._config.target + " " + Selector.NAV_LINKS + "," + (this._config.target + " " + Selector.LIST_ITEMS + ",") + (this._config.target + " " + Selector.DROPDOWN_ITEMS);
+      this._offsets = [];
+      this._targets = [];
+      this._activeTarget = null;
+      this._scrollHeight = 0;
+      $(this._scrollElement).on(Event.SCROLL, function (event) {
+        return _this._process(event);
+      });
+      this.refresh();
+
+      this._process();
+    } // Getters
+
+
+    var _proto = ScrollSpy.prototype;
+
+    // Public
+    _proto.refresh = function refresh() {
+      var _this2 = this;
+
+      var autoMethod = this._scrollElement === this._scrollElement.window ? OffsetMethod.OFFSET : OffsetMethod.POSITION;
+      var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
+      var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
+      this._offsets = [];
+      this._targets = [];
+      this._scrollHeight = this._getScrollHeight();
+      var targets = [].slice.call(document.querySelectorAll(this._selector));
+      targets.map(function (element) {
+        var target;
+        var targetSelector = Util.getSelectorFromElement(element);
+
+        if (targetSelector) {
+          target = document.querySelector(targetSelector);
+        }
+
+        if (target) {
+          var targetBCR = target.getBoundingClientRect();
+
+          if (targetBCR.width || targetBCR.height) {
+            // TODO (fat): remove sketch reliance on jQuery position/offset
+            return [$(target)[offsetMethod]().top + offsetBase, targetSelector];
+          }
+        }
+
+        return null;
+      }).filter(function (item) {
+        return item;
+      }).sort(function (a, b) {
+        return a[0] - b[0];
+      }).forEach(function (item) {
+        _this2._offsets.push(item[0]);
+
+        _this2._targets.push(item[1]);
+      });
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      $(this._scrollElement).off(EVENT_KEY);
+      this._element = null;
+      this._scrollElement = null;
+      this._config = null;
+      this._selector = null;
+      this._offsets = null;
+      this._targets = null;
+      this._activeTarget = null;
+      this._scrollHeight = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, typeof config === 'object' && config ? config : {});
+
+      if (typeof config.target !== 'string') {
+        var id = $(config.target).attr('id');
+
+        if (!id) {
+          id = Util.getUID(NAME);
+          $(config.target).attr('id', id);
+        }
+
+        config.target = "#" + id;
+      }
+
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._getScrollTop = function _getScrollTop() {
+      return this._scrollElement === window ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop;
+    };
+
+    _proto._getScrollHeight = function _getScrollHeight() {
+      return this._scrollElement.scrollHeight || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
+    };
+
+    _proto._getOffsetHeight = function _getOffsetHeight() {
+      return this._scrollElement === window ? window.innerHeight : this._scrollElement.getBoundingClientRect().height;
+    };
+
+    _proto._process = function _process() {
+      var scrollTop = this._getScrollTop() + this._config.offset;
+
+      var scrollHeight = this._getScrollHeight();
+
+      var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight();
+
+      if (this._scrollHeight !== scrollHeight) {
+        this.refresh();
+      }
+
+      if (scrollTop >= maxScroll) {
+        var target = this._targets[this._targets.length - 1];
+
+        if (this._activeTarget !== target) {
+          this._activate(target);
+        }
+
+        return;
+      }
+
+      if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) {
+        this._activeTarget = null;
+
+        this._clear();
+
+        return;
+      }
+
+      var offsetLength = this._offsets.length;
+
+      for (var i = offsetLength; i--;) {
+        var isActiveTarget = this._activeTarget !== this._targets[i] && scrollTop >= this._offsets[i] && (typeof this._offsets[i + 1] === 'undefined' || scrollTop < this._offsets[i + 1]);
+
+        if (isActiveTarget) {
+          this._activate(this._targets[i]);
+        }
+      }
+    };
+
+    _proto._activate = function _activate(target) {
+      this._activeTarget = target;
+
+      this._clear();
+
+      var queries = this._selector.split(',').map(function (selector) {
+        return selector + "[data-target=\"" + target + "\"]," + selector + "[href=\"" + target + "\"]";
+      });
+
+      var $link = $([].slice.call(document.querySelectorAll(queries.join(','))));
+
+      if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
+        $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
+        $link.addClass(ClassName.ACTIVE);
+      } else {
+        // Set triggered link as active
+        $link.addClass(ClassName.ACTIVE); // Set triggered links parents as active
+        // With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
+
+        $link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ", " + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE); // Handle special case when .nav-link is inside .nav-item
+
+        $link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_ITEMS).children(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
+      }
+
+      $(this._scrollElement).trigger(Event.ACTIVATE, {
+        relatedTarget: target
+      });
+    };
+
+    _proto._clear = function _clear() {
+      [].slice.call(document.querySelectorAll(this._selector)).filter(function (node) {
+        return node.classList.contains(ClassName.ACTIVE);
+      }).forEach(function (node) {
+        return node.classList.remove(ClassName.ACTIVE);
+      });
+    } // Static
+    ;
+
+    ScrollSpy._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' && config;
+
+        if (!data) {
+          data = new ScrollSpy(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(ScrollSpy, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return ScrollSpy;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(window).on(Event.LOAD_DATA_API, function () {
+    var scrollSpys = [].slice.call(document.querySelectorAll(Selector.DATA_SPY));
+    var scrollSpysLength = scrollSpys.length;
+
+    for (var i = scrollSpysLength; i--;) {
+      var $spy = $(scrollSpys[i]);
+
+      ScrollSpy._jQueryInterface.call($spy, $spy.data());
+    }
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = ScrollSpy._jQueryInterface;
+  $.fn[NAME].Constructor = ScrollSpy;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return ScrollSpy._jQueryInterface;
+  };
+
+  return ScrollSpy;
+
+}));
+/*!
+  * Bootstrap tab.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Tab = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'tab';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.tab';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    DROPDOWN_MENU: 'dropdown-menu',
+    ACTIVE: 'active',
+    DISABLED: 'disabled',
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    DROPDOWN: '.dropdown',
+    NAV_LIST_GROUP: '.nav, .list-group',
+    ACTIVE: '.active',
+    ACTIVE_UL: '> li > .active',
+    DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]',
+    DROPDOWN_TOGGLE: '.dropdown-toggle',
+    DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Tab =
+  /*#__PURE__*/
+  function () {
+    function Tab(element) {
+      this._element = element;
+    } // Getters
+
+
+    var _proto = Tab.prototype;
+
+    // Public
+    _proto.show = function show() {
+      var _this = this;
+
+      if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) {
+        return;
+      }
+
+      var target;
+      var previous;
+      var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0];
+      var selector = Util.getSelectorFromElement(this._element);
+
+      if (listElement) {
+        var itemSelector = listElement.nodeName === 'UL' || listElement.nodeName === 'OL' ? Selector.ACTIVE_UL : Selector.ACTIVE;
+        previous = $.makeArray($(listElement).find(itemSelector));
+        previous = previous[previous.length - 1];
+      }
+
+      var hideEvent = $.Event(Event.HIDE, {
+        relatedTarget: this._element
+      });
+      var showEvent = $.Event(Event.SHOW, {
+        relatedTarget: previous
+      });
+
+      if (previous) {
+        $(previous).trigger(hideEvent);
+      }
+
+      $(this._element).trigger(showEvent);
+
+      if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      if (selector) {
+        target = document.querySelector(selector);
+      }
+
+      this._activate(this._element, listElement);
+
+      var complete = function complete() {
+        var hiddenEvent = $.Event(Event.HIDDEN, {
+          relatedTarget: _this._element
+        });
+        var shownEvent = $.Event(Event.SHOWN, {
+          relatedTarget: previous
+        });
+        $(previous).trigger(hiddenEvent);
+        $(_this._element).trigger(shownEvent);
+      };
+
+      if (target) {
+        this._activate(target, target.parentNode, complete);
+      } else {
+        complete();
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+    } // Private
+    ;
+
+    _proto._activate = function _activate(element, container, callback) {
+      var _this2 = this;
+
+      var activeElements = container && (container.nodeName === 'UL' || container.nodeName === 'OL') ? $(container).find(Selector.ACTIVE_UL) : $(container).children(Selector.ACTIVE);
+      var active = activeElements[0];
+      var isTransitioning = callback && active && $(active).hasClass(ClassName.FADE);
+
+      var complete = function complete() {
+        return _this2._transitionComplete(element, active, callback);
+      };
+
+      if (active && isTransitioning) {
+        var transitionDuration = Util.getTransitionDurationFromElement(active);
+        $(active).removeClass(ClassName.SHOW).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+    };
+
+    _proto._transitionComplete = function _transitionComplete(element, active, callback) {
+      if (active) {
+        $(active).removeClass(ClassName.ACTIVE);
+        var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
+
+        if (dropdownChild) {
+          $(dropdownChild).removeClass(ClassName.ACTIVE);
+        }
+
+        if (active.getAttribute('role') === 'tab') {
+          active.setAttribute('aria-selected', false);
+        }
+      }
+
+      $(element).addClass(ClassName.ACTIVE);
+
+      if (element.getAttribute('role') === 'tab') {
+        element.setAttribute('aria-selected', true);
+      }
+
+      Util.reflow(element);
+
+      if (element.classList.contains(ClassName.FADE)) {
+        element.classList.add(ClassName.SHOW);
+      }
+
+      if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
+        var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
+
+        if (dropdownElement) {
+          var dropdownToggleList = [].slice.call(dropdownElement.querySelectorAll(Selector.DROPDOWN_TOGGLE));
+          $(dropdownToggleList).addClass(ClassName.ACTIVE);
+        }
+
+        element.setAttribute('aria-expanded', true);
+      }
+
+      if (callback) {
+        callback();
+      }
+    } // Static
+    ;
+
+    Tab._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $this = $(this);
+        var data = $this.data(DATA_KEY);
+
+        if (!data) {
+          data = new Tab(this);
+          $this.data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Tab, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }]);
+
+    return Tab;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    event.preventDefault();
+
+    Tab._jQueryInterface.call($(this), 'show');
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Tab._jQueryInterface;
+  $.fn[NAME].Constructor = Tab;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Tab._jQueryInterface;
+  };
+
+  return Tab;
+
+}));
+/*!
+  * Bootstrap toast.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Toast = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'toast';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.toast';
+  var EVENT_KEY = "." + DATA_KEY;
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Event = {
+    CLICK_DISMISS: "click.dismiss" + EVENT_KEY,
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY
+  };
+  var ClassName = {
+    FADE: 'fade',
+    HIDE: 'hide',
+    SHOW: 'show',
+    SHOWING: 'showing'
+  };
+  var DefaultType = {
+    animation: 'boolean',
+    autohide: 'boolean',
+    delay: 'number'
+  };
+  var Default = {
+    animation: true,
+    autohide: true,
+    delay: 500
+  };
+  var Selector = {
+    DATA_DISMISS: '[data-dismiss="toast"]'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Toast =
+  /*#__PURE__*/
+  function () {
+    function Toast(element, config) {
+      this._element = element;
+      this._config = this._getConfig(config);
+      this._timeout = null;
+
+      this._setListeners();
+    } // Getters
+
+
+    var _proto = Toast.prototype;
+
+    // Public
+    _proto.show = function show() {
+      var _this = this;
+
+      $(this._element).trigger(Event.SHOW);
+
+      if (this._config.animation) {
+        this._element.classList.add(ClassName.FADE);
+      }
+
+      var complete = function complete() {
+        _this._element.classList.remove(ClassName.SHOWING);
+
+        _this._element.classList.add(ClassName.SHOW);
+
+        $(_this._element).trigger(Event.SHOWN);
+
+        if (_this._config.autohide) {
+          _this.hide();
+        }
+      };
+
+      this._element.classList.remove(ClassName.HIDE);
+
+      this._element.classList.add(ClassName.SHOWING);
+
+      if (this._config.animation) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+        $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+    };
+
+    _proto.hide = function hide(withoutTimeout) {
+      var _this2 = this;
+
+      if (!this._element.classList.contains(ClassName.SHOW)) {
+        return;
+      }
+
+      $(this._element).trigger(Event.HIDE);
+
+      if (withoutTimeout) {
+        this._close();
+      } else {
+        this._timeout = setTimeout(function () {
+          _this2._close();
+        }, this._config.delay);
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      clearTimeout(this._timeout);
+      this._timeout = null;
+
+      if (this._element.classList.contains(ClassName.SHOW)) {
+        this._element.classList.remove(ClassName.SHOW);
+      }
+
+      $(this._element).off(Event.CLICK_DISMISS);
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+      this._config = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, $(this._element).data(), typeof config === 'object' && config ? config : {});
+      Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+      return config;
+    };
+
+    _proto._setListeners = function _setListeners() {
+      var _this3 = this;
+
+      $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function () {
+        return _this3.hide(true);
+      });
+    };
+
+    _proto._close = function _close() {
+      var _this4 = this;
+
+      var complete = function complete() {
+        _this4._element.classList.add(ClassName.HIDE);
+
+        $(_this4._element).trigger(Event.HIDDEN);
+      };
+
+      this._element.classList.remove(ClassName.SHOW);
+
+      if (this._config.animation) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+        $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+    } // Static
+    ;
+
+    Toast._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $element = $(this);
+        var data = $element.data(DATA_KEY);
+
+        var _config = typeof config === 'object' && config;
+
+        if (!data) {
+          data = new Toast(this, _config);
+          $element.data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config](this);
+        }
+      });
+    };
+
+    _createClass(Toast, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Toast;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+
+  $.fn[NAME] = Toast._jQueryInterface;
+  $.fn[NAME].Constructor = Toast;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Toast._jQueryInterface;
+  };
+
+  return Toast;
+
+}));
+
+
+
+
+
+
+
+
+
+
+
+
+/*! jQuery Validation Plugin - v1.19.1 - 6/15/2019
+ * https://jqueryvalidation.org/
+ * Copyright (c) 2019 Jörn Zaefferer; Licensed MIT */
+
+!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof module&&module.exports?module.exports=a(require("jquery")):a(jQuery)}(function(a){a.extend(a.fn,{validate:function(b){if(!this.length)return void(b&&b.debug&&window.console&&console.warn("Nothing selected, can't validate, returning nothing."));var c=a.data(this[0],"validator");return c?c:(this.attr("novalidate","novalidate"),c=new a.validator(b,this[0]),a.data(this[0],"validator",c),c.settings.onsubmit&&(this.on("click.validate",":submit",function(b){c.submitButton=b.currentTarget,a(this).hasClass("cancel")&&(c.cancelSubmit=!0),void 0!==a(this).attr("formnovalidate")&&(c.cancelSubmit=!0)}),this.on("submit.validate",function(b){function d(){var d,e;return c.submitButton&&(c.settings.submitHandler||c.formSubmitted)&&(d=a("<input type='hidden'/>").attr("name",c.submitButton.name).val(a(c.submitButton).val()).appendTo(c.currentForm)),!(c.settings.submitHandler&&!c.settings.debug)||(e=c.settings.submitHandler.call(c,c.currentForm,b),d&&d.remove(),void 0!==e&&e)}return c.settings.debug&&b.preventDefault(),c.cancelSubmit?(c.cancelSubmit=!1,d()):c.form()?c.pendingRequest?(c.formSubmitted=!0,!1):d():(c.focusInvalid(),!1)})),c)},valid:function(){var b,c,d;return a(this[0]).is("form")?b=this.validate().form():(d=[],b=!0,c=a(this[0].form).validate(),this.each(function(){b=c.element(this)&&b,b||(d=d.concat(c.errorList))}),c.errorList=d),b},rules:function(b,c){var d,e,f,g,h,i,j=this[0],k="undefined"!=typeof this.attr("contenteditable")&&"false"!==this.attr("contenteditable");if(null!=j&&(!j.form&&k&&(j.form=this.closest("form")[0],j.name=this.attr("name")),null!=j.form)){if(b)switch(d=a.data(j.form,"validator").settings,e=d.rules,f=a.validator.staticRules(j),b){case"add":a.extend(f,a.validator.normalizeRule(c)),delete f.messages,e[j.name]=f,c.messages&&(d.messages[j.name]=a.extend(d.messages[j.name],c.messages));break;case"remove":return c?(i={},a.each(c.split(/\s/),function(a,b){i[b]=f[b],delete f[b]}),i):(delete e[j.name],f)}return g=a.validator.normalizeRules(a.extend({},a.validator.classRules(j),a.validator.attributeRules(j),a.validator.dataRules(j),a.validator.staticRules(j)),j),g.required&&(h=g.required,delete g.required,g=a.extend({required:h},g)),g.remote&&(h=g.remote,delete g.remote,g=a.extend(g,{remote:h})),g}}}),a.extend(a.expr.pseudos||a.expr[":"],{blank:function(b){return!a.trim(""+a(b).val())},filled:function(b){var c=a(b).val();return null!==c&&!!a.trim(""+c)},unchecked:function(b){return!a(b).prop("checked")}}),a.validator=function(b,c){this.settings=a.extend(!0,{},a.validator.defaults,b),this.currentForm=c,this.init()},a.validator.format=function(b,c){return 1===arguments.length?function(){var c=a.makeArray(arguments);return c.unshift(b),a.validator.format.apply(this,c)}:void 0===c?b:(arguments.length>2&&c.constructor!==Array&&(c=a.makeArray(arguments).slice(1)),c.constructor!==Array&&(c=[c]),a.each(c,function(a,c){b=b.replace(new RegExp("\\{"+a+"\\}","g"),function(){return c})}),b)},a.extend(a.validator,{defaults:{messages:{},groups:{},rules:{},errorClass:"error",pendingClass:"pending",validClass:"valid",errorElement:"label",focusCleanup:!1,focusInvalid:!0,errorContainer:a([]),errorLabelContainer:a([]),onsubmit:!0,ignore:":hidden",ignoreTitle:!1,onfocusin:function(a){this.lastActive=a,this.settings.focusCleanup&&(this.settings.unhighlight&&this.settings.unhighlight.call(this,a,this.settings.errorClass,this.settings.validClass),this.hideThese(this.errorsFor(a)))},onfocusout:function(a){this.checkable(a)||!(a.name in this.submitted)&&this.optional(a)||this.element(a)},onkeyup:function(b,c){var d=[16,17,18,20,35,36,37,38,39,40,45,144,225];9===c.which&&""===this.elementValue(b)||a.inArray(c.keyCode,d)!==-1||(b.name in this.submitted||b.name in this.invalid)&&this.element(b)},onclick:function(a){a.name in this.submitted?this.element(a):a.parentNode.name in this.submitted&&this.element(a.parentNode)},highlight:function(b,c,d){"radio"===b.type?this.findByName(b.name).addClass(c).removeClass(d):a(b).addClass(c).removeClass(d)},unhighlight:function(b,c,d){"radio"===b.type?this.findByName(b.name).removeClass(c).addClass(d):a(b).removeClass(c).addClass(d)}},setDefaults:function(b){a.extend(a.validator.defaults,b)},messages:{required:"This field is required.",remote:"Please fix this field.",email:"Please enter a valid email address.",url:"Please enter a valid URL.",date:"Please enter a valid date.",dateISO:"Please enter a valid date (ISO).",number:"Please enter a valid number.",digits:"Please enter only digits.",equalTo:"Please enter the same value again.",maxlength:a.validator.format("Please enter no more than {0} characters."),minlength:a.validator.format("Please enter at least {0} characters."),rangelength:a.validator.format("Please enter a value between {0} and {1} characters long."),range:a.validator.format("Please enter a value between {0} and {1}."),max:a.validator.format("Please enter a value less than or equal to {0}."),min:a.validator.format("Please enter a value greater than or equal to {0}."),step:a.validator.format("Please enter a multiple of {0}.")},autoCreateRanges:!1,prototype:{init:function(){function b(b){var c="undefined"!=typeof a(this).attr("contenteditable")&&"false"!==a(this).attr("contenteditable");if(!this.form&&c&&(this.form=a(this).closest("form")[0],this.name=a(this).attr("name")),d===this.form){var e=a.data(this.form,"validator"),f="on"+b.type.replace(/^validate/,""),g=e.settings;g[f]&&!a(this).is(g.ignore)&&g[f].call(e,this,b)}}this.labelContainer=a(this.settings.errorLabelContainer),this.errorContext=this.labelContainer.length&&this.labelContainer||a(this.currentForm),this.containers=a(this.settings.errorContainer).add(this.settings.errorLabelContainer),this.submitted={},this.valueCache={},this.pendingRequest=0,this.pending={},this.invalid={},this.reset();var c,d=this.currentForm,e=this.groups={};a.each(this.settings.groups,function(b,c){"string"==typeof c&&(c=c.split(/\s/)),a.each(c,function(a,c){e[c]=b})}),c=this.settings.rules,a.each(c,function(b,d){c[b]=a.validator.normalizeRule(d)}),a(this.currentForm).on("focusin.validate focusout.validate keyup.validate",":text, [type='password'], [type='file'], select, textarea, [type='number'], [type='search'], [type='tel'], [type='url'], [type='email'], [type='datetime'], [type='date'], [type='month'], [type='week'], [type='time'], [type='datetime-local'], [type='range'], [type='color'], [type='radio'], [type='checkbox'], [contenteditable], [type='button']",b).on("click.validate","select, option, [type='radio'], [type='checkbox']",b),this.settings.invalidHandler&&a(this.currentForm).on("invalid-form.validate",this.settings.invalidHandler)},form:function(){return this.checkForm(),a.extend(this.submitted,this.errorMap),this.invalid=a.extend({},this.errorMap),this.valid()||a(this.currentForm).triggerHandler("invalid-form",[this]),this.showErrors(),this.valid()},checkForm:function(){this.prepareForm();for(var a=0,b=this.currentElements=this.elements();b[a];a++)this.check(b[a]);return this.valid()},element:function(b){var c,d,e=this.clean(b),f=this.validationTargetFor(e),g=this,h=!0;return void 0===f?delete this.invalid[e.name]:(this.prepareElement(f),this.currentElements=a(f),d=this.groups[f.name],d&&a.each(this.groups,function(a,b){b===d&&a!==f.name&&(e=g.validationTargetFor(g.clean(g.findByName(a))),e&&e.name in g.invalid&&(g.currentElements.push(e),h=g.check(e)&&h))}),c=this.check(f)!==!1,h=h&&c,c?this.invalid[f.name]=!1:this.invalid[f.name]=!0,this.numberOfInvalids()||(this.toHide=this.toHide.add(this.containers)),this.showErrors(),a(b).attr("aria-invalid",!c)),h},showErrors:function(b){if(b){var c=this;a.extend(this.errorMap,b),this.errorList=a.map(this.errorMap,function(a,b){return{message:a,element:c.findByName(b)[0]}}),this.successList=a.grep(this.successList,function(a){return!(a.name in b)})}this.settings.showErrors?this.settings.showErrors.call(this,this.errorMap,this.errorList):this.defaultShowErrors()},resetForm:function(){a.fn.resetForm&&a(this.currentForm).resetForm(),this.invalid={},this.submitted={},this.prepareForm(),this.hideErrors();var b=this.elements().removeData("previousValue").removeAttr("aria-invalid");this.resetElements(b)},resetElements:function(a){var b;if(this.settings.unhighlight)for(b=0;a[b];b++)this.settings.unhighlight.call(this,a[b],this.settings.errorClass,""),this.findByName(a[b].name).removeClass(this.settings.validClass);else a.removeClass(this.settings.errorClass).removeClass(this.settings.validClass)},numberOfInvalids:function(){return this.objectLength(this.invalid)},objectLength:function(a){var b,c=0;for(b in a)void 0!==a[b]&&null!==a[b]&&a[b]!==!1&&c++;return c},hideErrors:function(){this.hideThese(this.toHide)},hideThese:function(a){a.not(this.containers).text(""),this.addWrapper(a).hide()},valid:function(){return 0===this.size()},size:function(){return this.errorList.length},focusInvalid:function(){if(this.settings.focusInvalid)try{a(this.findLastActive()||this.errorList.length&&this.errorList[0].element||[]).filter(":visible").trigger("focus").trigger("focusin")}catch(b){}},findLastActive:function(){var b=this.lastActive;return b&&1===a.grep(this.errorList,function(a){return a.element.name===b.name}).length&&b},elements:function(){var b=this,c={};return a(this.currentForm).find("input, select, textarea, [contenteditable]").not(":submit, :reset, :image, :disabled").not(this.settings.ignore).filter(function(){var d=this.name||a(this).attr("name"),e="undefined"!=typeof a(this).attr("contenteditable")&&"false"!==a(this).attr("contenteditable");return!d&&b.settings.debug&&window.console&&console.error("%o has no name assigned",this),e&&(this.form=a(this).closest("form")[0],this.name=d),this.form===b.currentForm&&(!(d in c||!b.objectLength(a(this).rules()))&&(c[d]=!0,!0))})},clean:function(b){return a(b)[0]},errors:function(){var b=this.settings.errorClass.split(" ").join(".");return a(this.settings.errorElement+"."+b,this.errorContext)},resetInternals:function(){this.successList=[],this.errorList=[],this.errorMap={},this.toShow=a([]),this.toHide=a([])},reset:function(){this.resetInternals(),this.currentElements=a([])},prepareForm:function(){this.reset(),this.toHide=this.errors().add(this.containers)},prepareElement:function(a){this.reset(),this.toHide=this.errorsFor(a)},elementValue:function(b){var c,d,e=a(b),f=b.type,g="undefined"!=typeof e.attr("contenteditable")&&"false"!==e.attr("contenteditable");return"radio"===f||"checkbox"===f?this.findByName(b.name).filter(":checked").val():"number"===f&&"undefined"!=typeof b.validity?b.validity.badInput?"NaN":e.val():(c=g?e.text():e.val(),"file"===f?"C:\\fakepath\\"===c.substr(0,12)?c.substr(12):(d=c.lastIndexOf("/"),d>=0?c.substr(d+1):(d=c.lastIndexOf("\\"),d>=0?c.substr(d+1):c)):"string"==typeof c?c.replace(/\r/g,""):c)},check:function(b){b=this.validationTargetFor(this.clean(b));var c,d,e,f,g=a(b).rules(),h=a.map(g,function(a,b){return b}).length,i=!1,j=this.elementValue(b);"function"==typeof g.normalizer?f=g.normalizer:"function"==typeof this.settings.normalizer&&(f=this.settings.normalizer),f&&(j=f.call(b,j),delete g.normalizer);for(d in g){e={method:d,parameters:g[d]};try{if(c=a.validator.methods[d].call(this,j,b,e.parameters),"dependency-mismatch"===c&&1===h){i=!0;continue}if(i=!1,"pending"===c)return void(this.toHide=this.toHide.not(this.errorsFor(b)));if(!c)return this.formatAndAdd(b,e),!1}catch(k){throw this.settings.debug&&window.console&&console.log("Exception occurred when checking element "+b.id+", check the '"+e.method+"' method.",k),k instanceof TypeError&&(k.message+=".  Exception occurred when checking element "+b.id+", check the '"+e.method+"' method."),k}}if(!i)return this.objectLength(g)&&this.successList.push(b),!0},customDataMessage:function(b,c){return a(b).data("msg"+c.charAt(0).toUpperCase()+c.substring(1).toLowerCase())||a(b).data("msg")},customMessage:function(a,b){var c=this.settings.messages[a];return c&&(c.constructor===String?c:c[b])},findDefined:function(){for(var a=0;a<arguments.length;a++)if(void 0!==arguments[a])return arguments[a]},defaultMessage:function(b,c){"string"==typeof c&&(c={method:c});var d=this.findDefined(this.customMessage(b.name,c.method),this.customDataMessage(b,c.method),!this.settings.ignoreTitle&&b.title||void 0,a.validator.messages[c.method],"<strong>Warning: No message defined for "+b.name+"</strong>"),e=/\$?\{(\d+)\}/g;return"function"==typeof d?d=d.call(this,c.parameters,b):e.test(d)&&(d=a.validator.format(d.replace(e,"{$1}"),c.parameters)),d},formatAndAdd:function(a,b){var c=this.defaultMessage(a,b);this.errorList.push({message:c,element:a,method:b.method}),this.errorMap[a.name]=c,this.submitted[a.name]=c},addWrapper:function(a){return this.settings.wrapper&&(a=a.add(a.parent(this.settings.wrapper))),a},defaultShowErrors:function(){var a,b,c;for(a=0;this.errorList[a];a++)c=this.errorList[a],this.settings.highlight&&this.settings.highlight.call(this,c.element,this.settings.errorClass,this.settings.validClass),this.showLabel(c.element,c.message);if(this.errorList.length&&(this.toShow=this.toShow.add(this.containers)),this.settings.success)for(a=0;this.successList[a];a++)this.showLabel(this.successList[a]);if(this.settings.unhighlight)for(a=0,b=this.validElements();b[a];a++)this.settings.unhighlight.call(this,b[a],this.settings.errorClass,this.settings.validClass);this.toHide=this.toHide.not(this.toShow),this.hideErrors(),this.addWrapper(this.toShow).show()},validElements:function(){return this.currentElements.not(this.invalidElements())},invalidElements:function(){return a(this.errorList).map(function(){return this.element})},showLabel:function(b,c){var d,e,f,g,h=this.errorsFor(b),i=this.idOrName(b),j=a(b).attr("aria-describedby");h.length?(h.removeClass(this.settings.validClass).addClass(this.settings.errorClass),h.html(c)):(h=a("<"+this.settings.errorElement+">").attr("id",i+"-error").addClass(this.settings.errorClass).html(c||""),d=h,this.settings.wrapper&&(d=h.hide().show().wrap("<"+this.settings.wrapper+"/>").parent()),this.labelContainer.length?this.labelContainer.append(d):this.settings.errorPlacement?this.settings.errorPlacement.call(this,d,a(b)):d.insertAfter(b),h.is("label")?h.attr("for",i):0===h.parents("label[for='"+this.escapeCssMeta(i)+"']").length&&(f=h.attr("id"),j?j.match(new RegExp("\\b"+this.escapeCssMeta(f)+"\\b"))||(j+=" "+f):j=f,a(b).attr("aria-describedby",j),e=this.groups[b.name],e&&(g=this,a.each(g.groups,function(b,c){c===e&&a("[name='"+g.escapeCssMeta(b)+"']",g.currentForm).attr("aria-describedby",h.attr("id"))})))),!c&&this.settings.success&&(h.text(""),"string"==typeof this.settings.success?h.addClass(this.settings.success):this.settings.success(h,b)),this.toShow=this.toShow.add(h)},errorsFor:function(b){var c=this.escapeCssMeta(this.idOrName(b)),d=a(b).attr("aria-describedby"),e="label[for='"+c+"'], label[for='"+c+"'] *";return d&&(e=e+", #"+this.escapeCssMeta(d).replace(/\s+/g,", #")),this.errors().filter(e)},escapeCssMeta:function(a){return a.replace(/([\\!"#$%&'()*+,.\/:;<=>?@\[\]^`{|}~])/g,"\\$1")},idOrName:function(a){return this.groups[a.name]||(this.checkable(a)?a.name:a.id||a.name)},validationTargetFor:function(b){return this.checkable(b)&&(b=this.findByName(b.name)),a(b).not(this.settings.ignore)[0]},checkable:function(a){return/radio|checkbox/i.test(a.type)},findByName:function(b){return a(this.currentForm).find("[name='"+this.escapeCssMeta(b)+"']")},getLength:function(b,c){switch(c.nodeName.toLowerCase()){case"select":return a("option:selected",c).length;case"input":if(this.checkable(c))return this.findByName(c.name).filter(":checked").length}return b.length},depend:function(a,b){return!this.dependTypes[typeof a]||this.dependTypes[typeof a](a,b)},dependTypes:{"boolean":function(a){return a},string:function(b,c){return!!a(b,c.form).length},"function":function(a,b){return a(b)}},optional:function(b){var c=this.elementValue(b);return!a.validator.methods.required.call(this,c,b)&&"dependency-mismatch"},startRequest:function(b){this.pending[b.name]||(this.pendingRequest++,a(b).addClass(this.settings.pendingClass),this.pending[b.name]=!0)},stopRequest:function(b,c){this.pendingRequest--,this.pendingRequest<0&&(this.pendingRequest=0),delete this.pending[b.name],a(b).removeClass(this.settings.pendingClass),c&&0===this.pendingRequest&&this.formSubmitted&&this.form()?(a(this.currentForm).submit(),this.submitButton&&a("input:hidden[name='"+this.submitButton.name+"']",this.currentForm).remove(),this.formSubmitted=!1):!c&&0===this.pendingRequest&&this.formSubmitted&&(a(this.currentForm).triggerHandler("invalid-form",[this]),this.formSubmitted=!1)},previousValue:function(b,c){return c="string"==typeof c&&c||"remote",a.data(b,"previousValue")||a.data(b,"previousValue",{old:null,valid:!0,message:this.defaultMessage(b,{method:c})})},destroy:function(){this.resetForm(),a(this.currentForm).off(".validate").removeData("validator").find(".validate-equalTo-blur").off(".validate-equalTo").removeClass("validate-equalTo-blur").find(".validate-lessThan-blur").off(".validate-lessThan").removeClass("validate-lessThan-blur").find(".validate-lessThanEqual-blur").off(".validate-lessThanEqual").removeClass("validate-lessThanEqual-blur").find(".validate-greaterThanEqual-blur").off(".validate-greaterThanEqual").removeClass("validate-greaterThanEqual-blur").find(".validate-greaterThan-blur").off(".validate-greaterThan").removeClass("validate-greaterThan-blur")}},classRuleSettings:{required:{required:!0},email:{email:!0},url:{url:!0},date:{date:!0},dateISO:{dateISO:!0},number:{number:!0},digits:{digits:!0},creditcard:{creditcard:!0}},addClassRules:function(b,c){b.constructor===String?this.classRuleSettings[b]=c:a.extend(this.classRuleSettings,b)},classRules:function(b){var c={},d=a(b).attr("class");return d&&a.each(d.split(" "),function(){this in a.validator.classRuleSettings&&a.extend(c,a.validator.classRuleSettings[this])}),c},normalizeAttributeRule:function(a,b,c,d){/min|max|step/.test(c)&&(null===b||/number|range|text/.test(b))&&(d=Number(d),isNaN(d)&&(d=void 0)),d||0===d?a[c]=d:b===c&&"range"!==b&&(a[c]=!0)},attributeRules:function(b){var c,d,e={},f=a(b),g=b.getAttribute("type");for(c in a.validator.methods)"required"===c?(d=b.getAttribute(c),""===d&&(d=!0),d=!!d):d=f.attr(c),this.normalizeAttributeRule(e,g,c,d);return e.maxlength&&/-1|2147483647|524288/.test(e.maxlength)&&delete e.maxlength,e},dataRules:function(b){var c,d,e={},f=a(b),g=b.getAttribute("type");for(c in a.validator.methods)d=f.data("rule"+c.charAt(0).toUpperCase()+c.substring(1).toLowerCase()),""===d&&(d=!0),this.normalizeAttributeRule(e,g,c,d);return e},staticRules:function(b){var c={},d=a.data(b.form,"validator");return d.settings.rules&&(c=a.validator.normalizeRule(d.settings.rules[b.name])||{}),c},normalizeRules:function(b,c){return a.each(b,function(d,e){if(e===!1)return void delete b[d];if(e.param||e.depends){var f=!0;switch(typeof e.depends){case"string":f=!!a(e.depends,c.form).length;break;case"function":f=e.depends.call(c,c)}f?b[d]=void 0===e.param||e.param:(a.data(c.form,"validator").resetElements(a(c)),delete b[d])}}),a.each(b,function(d,e){b[d]=a.isFunction(e)&&"normalizer"!==d?e(c):e}),a.each(["minlength","maxlength"],function(){b[this]&&(b[this]=Number(b[this]))}),a.each(["rangelength","range"],function(){var c;b[this]&&(a.isArray(b[this])?b[this]=[Number(b[this][0]),Number(b[this][1])]:"string"==typeof b[this]&&(c=b[this].replace(/[\[\]]/g,"").split(/[\s,]+/),b[this]=[Number(c[0]),Number(c[1])]))}),a.validator.autoCreateRanges&&(null!=b.min&&null!=b.max&&(b.range=[b.min,b.max],delete b.min,delete b.max),null!=b.minlength&&null!=b.maxlength&&(b.rangelength=[b.minlength,b.maxlength],delete b.minlength,delete b.maxlength)),b},normalizeRule:function(b){if("string"==typeof b){var c={};a.each(b.split(/\s/),function(){c[this]=!0}),b=c}return b},addMethod:function(b,c,d){a.validator.methods[b]=c,a.validator.messages[b]=void 0!==d?d:a.validator.messages[b],c.length<3&&a.validator.addClassRules(b,a.validator.normalizeRule(b))},methods:{required:function(b,c,d){if(!this.depend(d,c))return"dependency-mismatch";if("select"===c.nodeName.toLowerCase()){var e=a(c).val();return e&&e.length>0}return this.checkable(c)?this.getLength(b,c)>0:void 0!==b&&null!==b&&b.length>0},email:function(a,b){return this.optional(b)||/^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/.test(a)},url:function(a,b){return this.optional(b)||/^(?:(?:(?:https?|ftp):)?\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})).?)(?::\d{2,5})?(?:[\/?#]\S*)?$/i.test(a)},date:function(){var a=!1;return function(b,c){return a||(a=!0,this.settings.debug&&window.console&&console.warn("The `date` method is deprecated and will be removed in version '2.0.0'.\nPlease don't use it, since it relies on the Date constructor, which\nbehaves very differently across browsers and locales. Use `dateISO`\ninstead or one of the locale specific methods in `localizations/`\nand `additional-methods.js`.")),this.optional(c)||!/Invalid|NaN/.test(new Date(b).toString())}}(),dateISO:function(a,b){return this.optional(b)||/^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])$/.test(a)},number:function(a,b){return this.optional(b)||/^(?:-?\d+|-?\d{1,3}(?:,\d{3})+)?(?:\.\d+)?$/.test(a)},digits:function(a,b){return this.optional(b)||/^\d+$/.test(a)},minlength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e>=d},maxlength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e<=d},rangelength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e>=d[0]&&e<=d[1]},min:function(a,b,c){return this.optional(b)||a>=c},max:function(a,b,c){return this.optional(b)||a<=c},range:function(a,b,c){return this.optional(b)||a>=c[0]&&a<=c[1]},step:function(b,c,d){var e,f=a(c).attr("type"),g="Step attribute on input type "+f+" is not supported.",h=["text","number","range"],i=new RegExp("\\b"+f+"\\b"),j=f&&!i.test(h.join()),k=function(a){var b=(""+a).match(/(?:\.(\d+))?$/);return b&&b[1]?b[1].length:0},l=function(a){return Math.round(a*Math.pow(10,e))},m=!0;if(j)throw new Error(g);return e=k(d),(k(b)>e||l(b)%l(d)!==0)&&(m=!1),this.optional(c)||m},equalTo:function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-equalTo-blur").length&&e.addClass("validate-equalTo-blur").on("blur.validate-equalTo",function(){a(c).valid()}),b===e.val()},remote:function(b,c,d,e){if(this.optional(c))return"dependency-mismatch";e="string"==typeof e&&e||"remote";var f,g,h,i=this.previousValue(c,e);return this.settings.messages[c.name]||(this.settings.messages[c.name]={}),i.originalMessage=i.originalMessage||this.settings.messages[c.name][e],this.settings.messages[c.name][e]=i.message,d="string"==typeof d&&{url:d}||d,h=a.param(a.extend({data:b},d.data)),i.old===h?i.valid:(i.old=h,f=this,this.startRequest(c),g={},g[c.name]=b,a.ajax(a.extend(!0,{mode:"abort",port:"validate"+c.name,dataType:"json",data:g,context:f.currentForm,success:function(a){var d,g,h,j=a===!0||"true"===a;f.settings.messages[c.name][e]=i.originalMessage,j?(h=f.formSubmitted,f.resetInternals(),f.toHide=f.errorsFor(c),f.formSubmitted=h,f.successList.push(c),f.invalid[c.name]=!1,f.showErrors()):(d={},g=a||f.defaultMessage(c,{method:e,parameters:b}),d[c.name]=i.message=g,f.invalid[c.name]=!0,f.showErrors(d)),i.valid=j,f.stopRequest(c,j)}},d)),"pending")}}});var b,c={};return a.ajaxPrefilter?a.ajaxPrefilter(function(a,b,d){var e=a.port;"abort"===a.mode&&(c[e]&&c[e].abort(),c[e]=d)}):(b=a.ajax,a.ajax=function(d){var e=("mode"in d?d:a.ajaxSettings).mode,f=("port"in d?d:a.ajaxSettings).port;return"abort"===e?(c[f]&&c[f].abort(),c[f]=b.apply(this,arguments),c[f]):b.apply(this,arguments)}),a});
+/*! jQuery Validation Plugin - v1.19.1 - 6/15/2019
+ * https://jqueryvalidation.org/
+ * Copyright (c) 2019 Jörn Zaefferer; Licensed MIT */
+
+!function(a){"function"==typeof define&&define.amd?define(["jquery","./jquery.validate.min"],a):"object"==typeof module&&module.exports?module.exports=a(require("jquery")):a(jQuery)}(function(a){return function(){function b(a){return a.replace(/<.[^<>]*?>/g," ").replace(/&nbsp;|&#160;/gi," ").replace(/[.(),;:!?%#$'\"_+=\/\-“”’]*/g,"")}a.validator.addMethod("maxWords",function(a,c,d){return this.optional(c)||b(a).match(/\b\w+\b/g).length<=d},a.validator.format("Please enter {0} words or less.")),a.validator.addMethod("minWords",function(a,c,d){return this.optional(c)||b(a).match(/\b\w+\b/g).length>=d},a.validator.format("Please enter at least {0} words.")),a.validator.addMethod("rangeWords",function(a,c,d){var e=b(a),f=/\b\w+\b/g;return this.optional(c)||e.match(f).length>=d[0]&&e.match(f).length<=d[1]},a.validator.format("Please enter between {0} and {1} words."))}(),a.validator.addMethod("abaRoutingNumber",function(a){var b=0,c=a.split(""),d=c.length;if(9!==d)return!1;for(var e=0;e<d;e+=3)b+=3*parseInt(c[e],10)+7*parseInt(c[e+1],10)+parseInt(c[e+2],10);return 0!==b&&b%10===0},"Please enter a valid routing number."),a.validator.addMethod("accept",function(b,c,d){var e,f,g,h="string"==typeof d?d.replace(/\s/g,""):"image/*",i=this.optional(c);if(i)return i;if("file"===a(c).attr("type")&&(h=h.replace(/[\-\[\]\/\{\}\(\)\+\?\.\\\^\$\|]/g,"\\$&").replace(/,/g,"|").replace(/\/\*/g,"/.*"),c.files&&c.files.length))for(g=new RegExp(".?("+h+")$","i"),e=0;e<c.files.length;e++)if(f=c.files[e],!f.type.match(g))return!1;return!0},a.validator.format("Please enter a value with a valid mimetype.")),a.validator.addMethod("alphanumeric",function(a,b){return this.optional(b)||/^\w+$/i.test(a)},"Letters, numbers, and underscores only please"),a.validator.addMethod("bankaccountNL",function(a,b){if(this.optional(b))return!0;if(!/^[0-9]{9}|([0-9]{2} ){3}[0-9]{3}$/.test(a))return!1;var c,d,e,f=a.replace(/ /g,""),g=0,h=f.length;for(c=0;c<h;c++)d=h-c,e=f.substring(c,c+1),g+=d*e;return g%11===0},"Please specify a valid bank account number"),a.validator.addMethod("bankorgiroaccountNL",function(b,c){return this.optional(c)||a.validator.methods.bankaccountNL.call(this,b,c)||a.validator.methods.giroaccountNL.call(this,b,c)},"Please specify a valid bank or giro account number"),a.validator.addMethod("bic",function(a,b){return this.optional(b)||/^([A-Z]{6}[A-Z2-9][A-NP-Z1-9])(X{3}|[A-WY-Z0-9][A-Z0-9]{2})?$/.test(a.toUpperCase())},"Please specify a valid BIC code"),a.validator.addMethod("cifES",function(a,b){"use strict";function c(a){return a%2===0}if(this.optional(b))return!0;var d,e,f,g,h=new RegExp(/^([ABCDEFGHJKLMNPQRSUVW])(\d{7})([0-9A-J])$/gi),i=a.substring(0,1),j=a.substring(1,8),k=a.substring(8,9),l=0,m=0,n=0;if(9!==a.length||!h.test(a))return!1;for(d=0;d<j.length;d++)e=parseInt(j[d],10),c(d)?(e*=2,n+=e<10?e:e-9):m+=e;return l=m+n,f=(10-l.toString().substr(-1)).toString(),f=parseInt(f,10)>9?"0":f,g="JABCDEFGHI".substr(f,1).toString(),i.match(/[ABEH]/)?k===f:i.match(/[KPQS]/)?k===g:k===f||k===g},"Please specify a valid CIF number."),a.validator.addMethod("cnhBR",function(a){if(a=a.replace(/([~!@#$%^&*()_+=`{}\[\]\-|\\:;'<>,.\/? ])+/g,""),11!==a.length)return!1;var b,c,d,e,f,g,h=0,i=0;if(b=a.charAt(0),new Array(12).join(b)===a)return!1;for(e=0,f=9,g=0;e<9;++e,--f)h+=+(a.charAt(e)*f);for(c=h%11,c>=10&&(c=0,i=2),h=0,e=0,f=1,g=0;e<9;++e,++f)h+=+(a.charAt(e)*f);return d=h%11,d>=10?d=0:d-=i,String(c).concat(d)===a.substr(-2)},"Please specify a valid CNH number"),a.validator.addMethod("cnpjBR",function(a,b){"use strict";if(this.optional(b))return!0;if(a=a.replace(/[^\d]+/g,""),14!==a.length)return!1;if("00000000000000"===a||"11111111111111"===a||"22222222222222"===a||"33333333333333"===a||"44444444444444"===a||"55555555555555"===a||"66666666666666"===a||"77777777777777"===a||"88888888888888"===a||"99999999999999"===a)return!1;for(var c=a.length-2,d=a.substring(0,c),e=a.substring(c),f=0,g=c-7,h=c;h>=1;h--)f+=d.charAt(c-h)*g--,g<2&&(g=9);var i=f%11<2?0:11-f%11;if(i!==parseInt(e.charAt(0),10))return!1;c+=1,d=a.substring(0,c),f=0,g=c-7;for(var j=c;j>=1;j--)f+=d.charAt(c-j)*g--,g<2&&(g=9);return i=f%11<2?0:11-f%11,i===parseInt(e.charAt(1),10)},"Please specify a CNPJ value number"),a.validator.addMethod("cpfBR",function(a,b){"use strict";if(this.optional(b))return!0;if(a=a.replace(/([~!@#$%^&*()_+=`{}\[\]\-|\\:;'<>,.\/? ])+/g,""),11!==a.length)return!1;var c,d,e,f,g=0;if(c=parseInt(a.substring(9,10),10),d=parseInt(a.substring(10,11),10),e=function(a,b){var c=10*a%11;return 10!==c&&11!==c||(c=0),c===b},""===a||"00000000000"===a||"11111111111"===a||"22222222222"===a||"33333333333"===a||"44444444444"===a||"55555555555"===a||"66666666666"===a||"77777777777"===a||"88888888888"===a||"99999999999"===a)return!1;for(f=1;f<=9;f++)g+=parseInt(a.substring(f-1,f),10)*(11-f);if(e(g,c)){for(g=0,f=1;f<=10;f++)g+=parseInt(a.substring(f-1,f),10)*(12-f);return e(g,d)}return!1},"Please specify a valid CPF number"),a.validator.addMethod("creditcard",function(a,b){if(this.optional(b))return"dependency-mismatch";if(/[^0-9 \-]+/.test(a))return!1;var c,d,e=0,f=0,g=!1;if(a=a.replace(/\D/g,""),a.length<13||a.length>19)return!1;for(c=a.length-1;c>=0;c--)d=a.charAt(c),f=parseInt(d,10),g&&(f*=2)>9&&(f-=9),e+=f,g=!g;return e%10===0},"Please enter a valid credit card number."),a.validator.addMethod("creditcardtypes",function(a,b,c){if(/[^0-9\-]+/.test(a))return!1;a=a.replace(/\D/g,"");var d=0;return c.mastercard&&(d|=1),c.visa&&(d|=2),c.amex&&(d|=4),c.dinersclub&&(d|=8),c.enroute&&(d|=16),c.discover&&(d|=32),c.jcb&&(d|=64),c.unknown&&(d|=128),c.all&&(d=255),1&d&&(/^(5[12345])/.test(a)||/^(2[234567])/.test(a))?16===a.length:2&d&&/^(4)/.test(a)?16===a.length:4&d&&/^(3[47])/.test(a)?15===a.length:8&d&&/^(3(0[012345]|[68]))/.test(a)?14===a.length:16&d&&/^(2(014|149))/.test(a)?15===a.length:32&d&&/^(6011)/.test(a)?16===a.length:64&d&&/^(3)/.test(a)?16===a.length:64&d&&/^(2131|1800)/.test(a)?15===a.length:!!(128&d)},"Please enter a valid credit card number."),a.validator.addMethod("currency",function(a,b,c){var d,e="string"==typeof c,f=e?c:c[0],g=!!e||c[1];return f=f.replace(/,/g,""),f=g?f+"]":f+"]?",d="^["+f+"([1-9]{1}[0-9]{0,2}(\\,[0-9]{3})*(\\.[0-9]{0,2})?|[1-9]{1}[0-9]{0,}(\\.[0-9]{0,2})?|0(\\.[0-9]{0,2})?|(\\.[0-9]{1,2})?)$",d=new RegExp(d),this.optional(b)||d.test(a)},"Please specify a valid currency"),a.validator.addMethod("dateFA",function(a,b){return this.optional(b)||/^[1-4]\d{3}\/((0?[1-6]\/((3[0-1])|([1-2][0-9])|(0?[1-9])))|((1[0-2]|(0?[7-9]))\/(30|([1-2][0-9])|(0?[1-9]))))$/.test(a)},a.validator.messages.date),a.validator.addMethod("dateITA",function(a,b){var c,d,e,f,g,h=!1,i=/^\d{1,2}\/\d{1,2}\/\d{4}$/;return i.test(a)?(c=a.split("/"),d=parseInt(c[0],10),e=parseInt(c[1],10),f=parseInt(c[2],10),g=new Date(Date.UTC(f,e-1,d,12,0,0,0)),h=g.getUTCFullYear()===f&&g.getUTCMonth()===e-1&&g.getUTCDate()===d):h=!1,this.optional(b)||h},a.validator.messages.date),a.validator.addMethod("dateNL",function(a,b){return this.optional(b)||/^(0?[1-9]|[12]\d|3[01])[\.\/\-](0?[1-9]|1[012])[\.\/\-]([12]\d)?(\d\d)$/.test(a)},a.validator.messages.date),a.validator.addMethod("extension",function(a,b,c){return c="string"==typeof c?c.replace(/,/g,"|"):"png|jpe?g|gif",this.optional(b)||a.match(new RegExp("\\.("+c+")$","i"))},a.validator.format("Please enter a value with a valid extension.")),a.validator.addMethod("giroaccountNL",function(a,b){return this.optional(b)||/^[0-9]{1,7}$/.test(a)},"Please specify a valid giro account number"),a.validator.addMethod("greaterThan",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-greaterThan-blur").length&&e.addClass("validate-greaterThan-blur").on("blur.validate-greaterThan",function(){a(c).valid()}),b>e.val()},"Please enter a greater value."),a.validator.addMethod("greaterThanEqual",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-greaterThanEqual-blur").length&&e.addClass("validate-greaterThanEqual-blur").on("blur.validate-greaterThanEqual",function(){a(c).valid()}),b>=e.val()},"Please enter a greater value."),a.validator.addMethod("iban",function(a,b){if(this.optional(b))return!0;var c,d,e,f,g,h,i,j,k,l=a.replace(/ /g,"").toUpperCase(),m="",n=!0,o="",p="",q=5;if(l.length<q)return!1;if(c=l.substring(0,2),h={AL:"\\d{8}[\\dA-Z]{16}",AD:"\\d{8}[\\dA-Z]{12}",AT:"\\d{16}",AZ:"[\\dA-Z]{4}\\d{20}",BE:"\\d{12}",BH:"[A-Z]{4}[\\dA-Z]{14}",BA:"\\d{16}",BR:"\\d{23}[A-Z][\\dA-Z]",BG:"[A-Z]{4}\\d{6}[\\dA-Z]{8}",CR:"\\d{17}",HR:"\\d{17}",CY:"\\d{8}[\\dA-Z]{16}",CZ:"\\d{20}",DK:"\\d{14}",DO:"[A-Z]{4}\\d{20}",EE:"\\d{16}",FO:"\\d{14}",FI:"\\d{14}",FR:"\\d{10}[\\dA-Z]{11}\\d{2}",GE:"[\\dA-Z]{2}\\d{16}",DE:"\\d{18}",GI:"[A-Z]{4}[\\dA-Z]{15}",GR:"\\d{7}[\\dA-Z]{16}",GL:"\\d{14}",GT:"[\\dA-Z]{4}[\\dA-Z]{20}",HU:"\\d{24}",IS:"\\d{22}",IE:"[\\dA-Z]{4}\\d{14}",IL:"\\d{19}",IT:"[A-Z]\\d{10}[\\dA-Z]{12}",KZ:"\\d{3}[\\dA-Z]{13}",KW:"[A-Z]{4}[\\dA-Z]{22}",LV:"[A-Z]{4}[\\dA-Z]{13}",LB:"\\d{4}[\\dA-Z]{20}",LI:"\\d{5}[\\dA-Z]{12}",LT:"\\d{16}",LU:"\\d{3}[\\dA-Z]{13}",MK:"\\d{3}[\\dA-Z]{10}\\d{2}",MT:"[A-Z]{4}\\d{5}[\\dA-Z]{18}",MR:"\\d{23}",MU:"[A-Z]{4}\\d{19}[A-Z]{3}",MC:"\\d{10}[\\dA-Z]{11}\\d{2}",MD:"[\\dA-Z]{2}\\d{18}",ME:"\\d{18}",NL:"[A-Z]{4}\\d{10}",NO:"\\d{11}",PK:"[\\dA-Z]{4}\\d{16}",PS:"[\\dA-Z]{4}\\d{21}",PL:"\\d{24}",PT:"\\d{21}",RO:"[A-Z]{4}[\\dA-Z]{16}",SM:"[A-Z]\\d{10}[\\dA-Z]{12}",SA:"\\d{2}[\\dA-Z]{18}",RS:"\\d{18}",SK:"\\d{20}",SI:"\\d{15}",ES:"\\d{20}",SE:"\\d{20}",CH:"\\d{5}[\\dA-Z]{12}",TN:"\\d{20}",TR:"\\d{5}[\\dA-Z]{17}",AE:"\\d{3}\\d{16}",GB:"[A-Z]{4}\\d{14}",VG:"[\\dA-Z]{4}\\d{16}"},g=h[c],"undefined"!=typeof g&&(i=new RegExp("^[A-Z]{2}\\d{2}"+g+"$",""),!i.test(l)))return!1;for(d=l.substring(4,l.length)+l.substring(0,4),j=0;j<d.length;j++)e=d.charAt(j),"0"!==e&&(n=!1),n||(m+="0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ".indexOf(e));for(k=0;k<m.length;k++)f=m.charAt(k),p=""+o+f,o=p%97;return 1===o},"Please specify a valid IBAN"),a.validator.addMethod("integer",function(a,b){return this.optional(b)||/^-?\d+$/.test(a)},"A positive or negative non-decimal number please"),a.validator.addMethod("ipv4",function(a,b){return this.optional(b)||/^(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)$/i.test(a)},"Please enter a valid IP v4 address."),a.validator.addMethod("ipv6",function(a,b){return this.optional(b)||/^((([0-9A-Fa-f]{1,4}:){7}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}:[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){5}:([0-9A-Fa-f]{1,4}:)?[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){4}:([0-9A-Fa-f]{1,4}:){0,2}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){3}:([0-9A-Fa-f]{1,4}:){0,3}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){2}:([0-9A-Fa-f]{1,4}:){0,4}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(([0-9A-Fa-f]{1,4}:){0,5}:((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(::([0-9A-Fa-f]{1,4}:){0,5}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|([0-9A-Fa-f]{1,4}::([0-9A-Fa-f]{1,4}:){0,5}[0-9A-Fa-f]{1,4})|(::([0-9A-Fa-f]{1,4}:){0,6}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){1,7}:))$/i.test(a)},"Please enter a valid IP v6 address."),a.validator.addMethod("lessThan",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-lessThan-blur").length&&e.addClass("validate-lessThan-blur").on("blur.validate-lessThan",function(){a(c).valid()}),b<e.val()},"Please enter a lesser value."),a.validator.addMethod("lessThanEqual",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-lessThanEqual-blur").length&&e.addClass("validate-lessThanEqual-blur").on("blur.validate-lessThanEqual",function(){a(c).valid()}),b<=e.val()},"Please enter a lesser value."),a.validator.addMethod("lettersonly",function(a,b){return this.optional(b)||/^[a-z]+$/i.test(a)},"Letters only please"),a.validator.addMethod("letterswithbasicpunc",function(a,b){return this.optional(b)||/^[a-z\-.,()'"\s]+$/i.test(a)},"Letters or punctuation only please"),a.validator.addMethod("maxfiles",function(b,c,d){return!!this.optional(c)||!("file"===a(c).attr("type")&&c.files&&c.files.length>d)},a.validator.format("Please select no more than {0} files.")),a.validator.addMethod("maxsize",function(b,c,d){if(this.optional(c))return!0;if("file"===a(c).attr("type")&&c.files&&c.files.length)for(var e=0;e<c.files.length;e++)if(c.files[e].size>d)return!1;return!0},a.validator.format("File size must not exceed {0} bytes each.")),a.validator.addMethod("maxsizetotal",function(b,c,d){if(this.optional(c))return!0;if("file"===a(c).attr("type")&&c.files&&c.files.length)for(var e=0,f=0;f<c.files.length;f++)if(e+=c.files[f].size,e>d)return!1;return!0},a.validator.format("Total size of all files must not exceed {0} bytes.")),a.validator.addMethod("mobileNL",function(a,b){return this.optional(b)||/^((\+|00(\s|\s?\-\s?)?)31(\s|\s?\-\s?)?(\(0\)[\-\s]?)?|0)6((\s|\s?\-\s?)?[0-9]){8}$/.test(a)},"Please specify a valid mobile number"),a.validator.addMethod("mobileRU",function(a,b){var c=a.replace(/\(|\)|\s+|-/g,"");return this.optional(b)||c.length>9&&/^((\+7|7|8)+([0-9]){10})$/.test(c)},"Please specify a valid mobile number"),a.validator.addMethod("mobileUK",function(a,b){return a=a.replace(/\(|\)|\s+|-/g,""),this.optional(b)||a.length>9&&a.match(/^(?:(?:(?:00\s?|\+)44\s?|0)7(?:[1345789]\d{2}|624)\s?\d{3}\s?\d{3})$/)},"Please specify a valid mobile number"),a.validator.addMethod("netmask",function(a,b){return this.optional(b)||/^(254|252|248|240|224|192|128)\.0\.0\.0|255\.(254|252|248|240|224|192|128|0)\.0\.0|255\.255\.(254|252|248|240|224|192|128|0)\.0|255\.255\.255\.(254|252|248|240|224|192|128|0)/i.test(a)},"Please enter a valid netmask."),a.validator.addMethod("nieES",function(a,b){"use strict";if(this.optional(b))return!0;var c,d=new RegExp(/^[MXYZ]{1}[0-9]{7,8}[TRWAGMYFPDXBNJZSQVHLCKET]{1}$/gi),e="TRWAGMYFPDXBNJZSQVHLCKET",f=a.substr(a.length-1).toUpperCase();return a=a.toString().toUpperCase(),!(a.length>10||a.length<9||!d.test(a))&&(a=a.replace(/^[X]/,"0").replace(/^[Y]/,"1").replace(/^[Z]/,"2"),c=9===a.length?a.substr(0,8):a.substr(0,9),e.charAt(parseInt(c,10)%23)===f)},"Please specify a valid NIE number."),a.validator.addMethod("nifES",function(a,b){"use strict";return!!this.optional(b)||(a=a.toUpperCase(),!!a.match("((^[A-Z]{1}[0-9]{7}[A-Z0-9]{1}$|^[T]{1}[A-Z0-9]{8}$)|^[0-9]{8}[A-Z]{1}$)")&&(/^[0-9]{8}[A-Z]{1}$/.test(a)?"TRWAGMYFPDXBNJZSQVHLCKE".charAt(a.substring(8,0)%23)===a.charAt(8):!!/^[KLM]{1}/.test(a)&&a[8]==="TRWAGMYFPDXBNJZSQVHLCKE".charAt(a.substring(8,1)%23)))},"Please specify a valid NIF number."),a.validator.addMethod("nipPL",function(a){"use strict";if(a=a.replace(/[^0-9]/g,""),10!==a.length)return!1;for(var b=[6,5,7,2,3,4,5,6,7],c=0,d=0;d<9;d++)c+=b[d]*a[d];var e=c%11,f=10===e?0:e;return f===parseInt(a[9],10)},"Please specify a valid NIP number."),a.validator.addMethod("nisBR",function(a){var b,c,d,e,f,g=0;if(a=a.replace(/([~!@#$%^&*()_+=`{}\[\]\-|\\:;'<>,.\/? ])+/g,""),11!==a.length)return!1;for(c=parseInt(a.substring(10,11),10),b=parseInt(a.substring(0,10),10),e=2;e<12;e++)f=e,10===e&&(f=2),11===e&&(f=3),g+=b%10*f,b=parseInt(b/10,10);return d=g%11,d=d>1?11-d:0,c===d},"Please specify a valid NIS/PIS number"),a.validator.addMethod("notEqualTo",function(b,c,d){return this.optional(c)||!a.validator.methods.equalTo.call(this,b,c,d)},"Please enter a different value, values must not be the same."),a.validator.addMethod("nowhitespace",function(a,b){return this.optional(b)||/^\S+$/i.test(a)},"No white space please"),a.validator.addMethod("pattern",function(a,b,c){return!!this.optional(b)||("string"==typeof c&&(c=new RegExp("^(?:"+c+")$")),c.test(a))},"Invalid format."),a.validator.addMethod("phoneNL",function(a,b){return this.optional(b)||/^((\+|00(\s|\s?\-\s?)?)31(\s|\s?\-\s?)?(\(0\)[\-\s]?)?|0)[1-9]((\s|\s?\-\s?)?[0-9]){8}$/.test(a)},"Please specify a valid phone number."),a.validator.addMethod("phonePL",function(a,b){a=a.replace(/\s+/g,"");var c=/^(?:(?:(?:\+|00)?48)|(?:\(\+?48\)))?(?:1[2-8]|2[2-69]|3[2-49]|4[1-68]|5[0-9]|6[0-35-9]|[7-8][1-9]|9[145])\d{7}$/;return this.optional(b)||c.test(a)},"Please specify a valid phone number"),a.validator.addMethod("phonesUK",function(a,b){return a=a.replace(/\(|\)|\s+|-/g,""),this.optional(b)||a.length>9&&a.match(/^(?:(?:(?:00\s?|\+)44\s?|0)(?:1\d{8,9}|[23]\d{9}|7(?:[1345789]\d{8}|624\d{6})))$/)},"Please specify a valid uk phone number"),a.validator.addMethod("phoneUK",function(a,b){return a=a.replace(/\(|\)|\s+|-/g,""),this.optional(b)||a.length>9&&a.match(/^(?:(?:(?:00\s?|\+)44\s?)|(?:\(?0))(?:\d{2}\)?\s?\d{4}\s?\d{4}|\d{3}\)?\s?\d{3}\s?\d{3,4}|\d{4}\)?\s?(?:\d{5}|\d{3}\s?\d{3})|\d{5}\)?\s?\d{4,5})$/)},"Please specify a valid phone number"),a.validator.addMethod("phoneUS",function(a,b){return a=a.replace(/\s+/g,""),this.optional(b)||a.length>9&&a.match(/^(\+?1-?)?(\([2-9]([02-9]\d|1[02-9])\)|[2-9]([02-9]\d|1[02-9]))-?[2-9]\d{2}-?\d{4}$/)},"Please specify a valid phone number"),a.validator.addMethod("postalcodeBR",function(a,b){return this.optional(b)||/^\d{2}.\d{3}-\d{3}?$|^\d{5}-?\d{3}?$/.test(a)},"Informe um CEP válido."),a.validator.addMethod("postalCodeCA",function(a,b){return this.optional(b)||/^[ABCEGHJKLMNPRSTVXY]\d[ABCEGHJKLMNPRSTVWXYZ] *\d[ABCEGHJKLMNPRSTVWXYZ]\d$/i.test(a)},"Please specify a valid postal code"),a.validator.addMethod("postalcodeIT",function(a,b){return this.optional(b)||/^\d{5}$/.test(a)},"Please specify a valid postal code"),a.validator.addMethod("postalcodeNL",function(a,b){return this.optional(b)||/^[1-9][0-9]{3}\s?[a-zA-Z]{2}$/.test(a)},"Please specify a valid postal code"),a.validator.addMethod("postcodeUK",function(a,b){return this.optional(b)||/^((([A-PR-UWYZ][0-9])|([A-PR-UWYZ][0-9][0-9])|([A-PR-UWYZ][A-HK-Y][0-9])|([A-PR-UWYZ][A-HK-Y][0-9][0-9])|([A-PR-UWYZ][0-9][A-HJKSTUW])|([A-PR-UWYZ][A-HK-Y][0-9][ABEHMNPRVWXY]))\s?([0-9][ABD-HJLNP-UW-Z]{2})|(GIR)\s?(0AA))$/i.test(a)},"Please specify a valid UK postcode"),a.validator.addMethod("require_from_group",function(b,c,d){var e=a(d[1],c.form),f=e.eq(0),g=f.data("valid_req_grp")?f.data("valid_req_grp"):a.extend({},this),h=e.filter(function(){return g.elementValue(this)}).length>=d[0];return f.data("valid_req_grp",g),a(c).data("being_validated")||(e.data("being_validated",!0),e.each(function(){g.element(this)}),e.data("being_validated",!1)),h},a.validator.format("Please fill at least {0} of these fields.")),a.validator.addMethod("skip_or_fill_minimum",function(b,c,d){var e=a(d[1],c.form),f=e.eq(0),g=f.data("valid_skip")?f.data("valid_skip"):a.extend({},this),h=e.filter(function(){return g.elementValue(this)}).length,i=0===h||h>=d[0];return f.data("valid_skip",g),a(c).data("being_validated")||(e.data("being_validated",!0),e.each(function(){g.element(this)}),e.data("being_validated",!1)),i},a.validator.format("Please either skip these fields or fill at least {0} of them.")),a.validator.addMethod("stateUS",function(a,b,c){var d,e="undefined"==typeof c,f=!e&&"undefined"!=typeof c.caseSensitive&&c.caseSensitive,g=!e&&"undefined"!=typeof c.includeTerritories&&c.includeTerritories,h=!e&&"undefined"!=typeof c.includeMilitary&&c.includeMilitary;return d=g||h?g&&h?"^(A[AEKLPRSZ]|C[AOT]|D[CE]|FL|G[AU]|HI|I[ADLN]|K[SY]|LA|M[ADEINOPST]|N[CDEHJMVY]|O[HKR]|P[AR]|RI|S[CD]|T[NX]|UT|V[AIT]|W[AIVY])$":g?"^(A[KLRSZ]|C[AOT]|D[CE]|FL|G[AU]|HI|I[ADLN]|K[SY]|LA|M[ADEINOPST]|N[CDEHJMVY]|O[HKR]|P[AR]|RI|S[CD]|T[NX]|UT|V[AIT]|W[AIVY])$":"^(A[AEKLPRZ]|C[AOT]|D[CE]|FL|GA|HI|I[ADLN]|K[SY]|LA|M[ADEINOST]|N[CDEHJMVY]|O[HKR]|PA|RI|S[CD]|T[NX]|UT|V[AT]|W[AIVY])$":"^(A[KLRZ]|C[AOT]|D[CE]|FL|GA|HI|I[ADLN]|K[SY]|LA|M[ADEINOST]|N[CDEHJMVY]|O[HKR]|PA|RI|S[CD]|T[NX]|UT|V[AT]|W[AIVY])$",d=f?new RegExp(d):new RegExp(d,"i"),this.optional(b)||d.test(a)},"Please specify a valid state"),a.validator.addMethod("strippedminlength",function(b,c,d){return a(b).text().length>=d},a.validator.format("Please enter at least {0} characters")),a.validator.addMethod("time",function(a,b){return this.optional(b)||/^([01]\d|2[0-3]|[0-9])(:[0-5]\d){1,2}$/.test(a)},"Please enter a valid time, between 00:00 and 23:59"),a.validator.addMethod("time12h",function(a,b){return this.optional(b)||/^((0?[1-9]|1[012])(:[0-5]\d){1,2}(\ ?[AP]M))$/i.test(a)},"Please enter a valid time in 12-hour am/pm format"),a.validator.addMethod("url2",function(a,b){return this.optional(b)||/^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)*(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(a)},a.validator.messages.url),a.validator.addMethod("vinUS",function(a){if(17!==a.length)return!1;var b,c,d,e,f,g,h=["A","B","C","D","E","F","G","H","J","K","L","M","N","P","R","S","T","U","V","W","X","Y","Z"],i=[1,2,3,4,5,6,7,8,1,2,3,4,5,7,9,2,3,4,5,6,7,8,9],j=[8,7,6,5,4,3,2,10,0,9,8,7,6,5,4,3,2],k=0;for(b=0;b<17;b++){if(e=j[b],d=a.slice(b,b+1),8===b&&(g=d),isNaN(d)){for(c=0;c<h.length;c++)if(d.toUpperCase()===h[c]){d=i[c],d*=e,isNaN(g)&&8===c&&(g=h[c]);break}}else d*=e;k+=d}return f=k%11,10===f&&(f="X"),f===g},"The specified vehicle identification number (VIN) is invalid."),a.validator.addMethod("zipcodeUS",function(a,b){return this.optional(b)||/^\d{5}(-\d{4})?$/.test(a)},"The specified US ZIP Code is invalid"),a.validator.addMethod("ziprange",function(a,b){return this.optional(b)||/^90[2-5]\d\{2\}-\d{4}$/.test(a)},"Your ZIP-code must be in the range 902xx-xxxx to 905xx-xxxx"),a});
+/* 
+* Project: Bootstrap Notify = v3.1.3
+* Description: Turns standard Bootstrap alerts into "Growl-like" notifications.
+* Author: Mouse0270 aka Robert McIntosh
+* License: MIT License
+* Website: https://github.com/mouse0270/bootstrap-growl
+*/
+
+(function (factory) {
+	if (typeof define === 'function' && define.amd) {
+		// AMD. Register as an anonymous module.
+		define(['jquery'], factory);
+	} else if (typeof exports === 'object') {
+		// Node/CommonJS
+		factory(require('jquery'));
+	} else {
+		// Browser globals
+		factory(jQuery);
+	}
+}(function ($) {
+	// Create the defaults once
+	var defaults = {
+			element: 'body',
+			position: null,
+			type: "info",
+			allow_dismiss: true,
+			newest_on_top: false,
+			showProgressbar: false,
+			placement: {
+				from: "top",
+				align: "right"
+			},
+			offset: 20,
+			spacing: 10,
+			z_index: 1031,
+			delay: 1000,
+			timer: 1000,
+			url_target: '_blank',
+			mouse_over: null,
+			animate: {
+				enter: 'animated fadeInDown',
+				exit: 'animated fadeOutUp'
+			},
+			onShow: null,
+			onShown: null,
+			onClose: null,
+			onClosed: null,
+			icon_type: 'class',
+			template: '<div data-notify="container" class="col-xs-4 col-sm-2 alert alert-{0}" role="alert"><button type="button" aria-hidden="true" class="close" data-notify="dismiss">&times;</button><span data-notify="icon"></span> <span data-notify="title">{1}</span> <span data-notify="message">{2}</span><div class="progress" data-notify="progressbar"><div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div></div><a href="{3}" target="{4}" data-notify="url"></a></div>'
+		};
+
+	String.format = function() {
+		var str = arguments[0];
+		for (var i = 1; i < arguments.length; i++) {
+			str = str.replace(RegExp("\\{" + (i - 1) + "\\}", "gm"), arguments[i]);
+		}
+		return str;
+	};
+
+	function Notify ( element, content, options ) {
+		// Setup Content of Notify
+		var content = {
+			content: {
+				message: typeof content == 'object' ? content.message : content,
+				title: content.title ? content.title : '',
+				icon: content.icon ? content.icon : '',
+				url: content.url ? content.url : '#',
+				target: content.target ? content.target : '-'
+			}
+		};
+
+		options = $.extend(true, {}, content, options);
+		this.settings = $.extend(true, {}, defaults, options);
+		this._defaults = defaults;
+		if (this.settings.content.target == "-") {
+			this.settings.content.target = this.settings.url_target;
+		}
+		this.animations = {
+			start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart',
+			end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend'
+		}
+
+		if (typeof this.settings.offset == 'number') {
+		    this.settings.offset = {
+		    	x: this.settings.offset,
+		    	y: this.settings.offset
+		    };
+		}
+
+		this.init();
+	};
+
+	$.extend(Notify.prototype, {
+		init: function () {
+			var self = this;
+
+			this.buildNotify();
+			if (this.settings.content.icon) {
+				this.setIcon();
+			}
+			if (this.settings.content.url != "#") {
+				this.styleURL();
+			}
+			this.placement();
+			this.bind();
+
+			this.notify = {
+				$ele: this.$ele,
+				update: function(command, update) {
+					var commands = {};
+					if (typeof command == "string") {					
+						commands[command] = update;
+					}else{
+						commands = command;
+					}
+					for (var command in commands) {
+						switch (command) {
+							case "type":
+								this.$ele.removeClass('alert-' + self.settings.type);
+								this.$ele.find('[data-notify="progressbar"] > .progress-bar').removeClass('progress-bar-' + self.settings.type);
+								self.settings.type = commands[command];
+								this.$ele.addClass('alert-' + commands[command]).find('[data-notify="progressbar"] > .progress-bar').addClass('progress-bar-' + commands[command]);
+								break;
+							case "icon":
+								var $icon = this.$ele.find('[data-notify="icon"]');
+								if (self.settings.icon_type.toLowerCase() == 'class') {
+									$icon.removeClass(self.settings.content.icon).addClass(commands[command]);
+								}else{
+									if (!$icon.is('img')) {
+										$icon.find('img');
+									}
+									$icon.attr('src', commands[command]);
+								}
+								break;
+							case "progress":
+								var newDelay = self.settings.delay - (self.settings.delay * (commands[command] / 100));
+								this.$ele.data('notify-delay', newDelay);
+								this.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', commands[command]).css('width', commands[command] + '%');
+								break;
+							case "url":
+								this.$ele.find('[data-notify="url"]').attr('href', commands[command]);
+								break;
+							case "target":
+								this.$ele.find('[data-notify="url"]').attr('target', commands[command]);
+								break;
+							default:
+								this.$ele.find('[data-notify="' + command +'"]').html(commands[command]);
+						};
+					}
+					var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y);
+					self.reposition(posX);
+				},
+				close: function() {
+					self.close();
+				}
+			};
+		},
+		buildNotify: function () {
+			var content = this.settings.content;
+			this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target));
+			this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align);		
+			if (!this.settings.allow_dismiss) {
+				this.$ele.find('[data-notify="dismiss"]').css('display', 'none');
+			}
+			if ((this.settings.delay <= 0 && !this.settings.showProgressbar) || !this.settings.showProgressbar) {
+				this.$ele.find('[data-notify="progressbar"]').remove();
+			}
+		},
+		setIcon: function() {
+			if (this.settings.icon_type.toLowerCase() == 'class') {
+				this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon);
+			}else{
+				if (this.$ele.find('[data-notify="icon"]').is('img')) {
+					this.$ele.find('[data-notify="icon"]').attr('src', this.settings.content.icon);
+				}else{
+					this.$ele.find('[data-notify="icon"]').append('<img src="'+this.settings.content.icon+'" alt="Notify Icon" />');
+				}	
+			}
+		},
+		styleURL: function() {
+			this.$ele.find('[data-notify="url"]').css({
+				backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)',
+				height: '100%',
+				left: '0px',
+				position: 'absolute',
+				top: '0px',
+				width: '100%',
+				zIndex: this.settings.z_index + 1
+			});
+			this.$ele.find('[data-notify="dismiss"]').css({
+				position: 'absolute',
+				right: '10px',
+				top: '5px',
+				zIndex: this.settings.z_index + 2
+			});
+		},
+		placement: function() {
+			var self = this,
+				offsetAmt = this.settings.offset.y,
+				css = {
+					display: 'inline-block',
+					margin: '0px auto',
+					position: this.settings.position ?  this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'),
+					transition: 'all .5s ease-in-out',
+					zIndex: this.settings.z_index
+				},
+				hasAnimation = false,
+				settings = this.settings;
+
+			$('[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])').each(function() {
+				return offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) +  parseInt($(this).outerHeight()) +  parseInt(settings.spacing));
+			});
+			if (this.settings.newest_on_top == true) {
+				offsetAmt = this.settings.offset.y;
+			}
+			css[this.settings.placement.from] = offsetAmt+'px';
+
+			switch (this.settings.placement.align) {
+				case "left":
+				case "right":
+					css[this.settings.placement.align] = this.settings.offset.x+'px';
+					break;
+				case "center":
+					css.left = 0;
+					css.right = 0;
+					break;
+			}
+			this.$ele.css(css).addClass(this.settings.animate.enter);
+			$.each(Array('webkit', 'moz', 'o', 'ms', ''), function(index, prefix) {
+				self.$ele[0].style[prefix+'AnimationIterationCount'] = 1;
+			});
+
+			$(this.settings.element).append(this.$ele);
+
+			if (this.settings.newest_on_top == true) {
+				offsetAmt = (parseInt(offsetAmt)+parseInt(this.settings.spacing)) + this.$ele.outerHeight();
+				this.reposition(offsetAmt);
+			}
+			
+			if ($.isFunction(self.settings.onShow)) {
+				self.settings.onShow.call(this.$ele);
+			}
+
+			this.$ele.one(this.animations.start, function(event) {
+				hasAnimation = true;
+			}).one(this.animations.end, function(event) {
+				if ($.isFunction(self.settings.onShown)) {
+					self.settings.onShown.call(this);
+				}
+			});
+
+			setTimeout(function() {
+				if (!hasAnimation) {
+					if ($.isFunction(self.settings.onShown)) {
+						self.settings.onShown.call(this);
+					}
+				}
+			}, 600);
+		},
+		bind: function() {
+			var self = this;
+
+			this.$ele.find('[data-notify="dismiss"]').on('click', function() {		
+				self.close();
+			})
+
+			this.$ele.mouseover(function(e) {
+				$(this).data('data-hover', "true");
+			}).mouseout(function(e) {
+				$(this).data('data-hover', "false");
+			});
+			this.$ele.data('data-hover', "false");
+
+			if (this.settings.delay > 0) {
+				self.$ele.data('notify-delay', self.settings.delay);
+				var timer = setInterval(function() {
+					var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer;
+					if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over == "pause") || self.settings.mouse_over != "pause") {
+						var percent = ((self.settings.delay - delay) / self.settings.delay) * 100;
+						self.$ele.data('notify-delay', delay);
+						self.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', percent).css('width', percent + '%');
+					}
+					if (delay <= -(self.settings.timer)) {
+						clearInterval(timer);
+						self.close();
+					}
+				}, self.settings.timer);
+			}
+		},
+		close: function() {
+			var self = this,
+				$successors = null,
+				posX = parseInt(this.$ele.css(this.settings.placement.from)),
+				hasAnimation = false;
+
+			this.$ele.data('closing', 'true').addClass(this.settings.animate.exit);
+			self.reposition(posX);			
+			
+			if ($.isFunction(self.settings.onClose)) {
+				self.settings.onClose.call(this.$ele);
+			}
+
+			this.$ele.one(this.animations.start, function(event) {
+				hasAnimation = true;
+			}).one(this.animations.end, function(event) {
+				$(this).remove();
+				if ($.isFunction(self.settings.onClosed)) {
+					self.settings.onClosed.call(this);
+				}
+			});
+
+			setTimeout(function() {
+				if (!hasAnimation) {
+					self.$ele.remove();
+					if (self.settings.onClosed) {
+						self.settings.onClosed(self.$ele);
+					}
+				}
+			}, 600);
+		},
+		reposition: function(posX) {
+			var self = this,
+				notifies = '[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])',
+				$elements = this.$ele.nextAll(notifies);
+			if (this.settings.newest_on_top == true) {
+				$elements = this.$ele.prevAll(notifies);
+			}
+			$elements.each(function() {
+				$(this).css(self.settings.placement.from, posX);
+				posX = (parseInt(posX)+parseInt(self.settings.spacing)) + $(this).outerHeight();
+			});
+		}
+	});
+
+	$.notify = function ( content, options ) {
+		var plugin = new Notify( this, content, options );
+		return plugin.notify;
+	};
+	$.notifyDefaults = function( options ) {
+		defaults = $.extend(true, {}, defaults, options);
+		return defaults;
+	};
+	$.notifyClose = function( command ) {
+		if (typeof command === "undefined" || command == "all") {
+			$('[data-notify]').find('[data-notify="dismiss"]').trigger('click');
+		}else{
+			$('[data-notify-position="'+command+'"]').find('[data-notify="dismiss"]').trigger('click');
+		}
+	};
+
+}));
+/*! jquery.cookie v1.4.1 | MIT */
+
+!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?a(require("jquery")):a(jQuery)}(function(a){function b(a){return h.raw?a:encodeURIComponent(a)}function c(a){return h.raw?a:decodeURIComponent(a)}function d(a){return b(h.json?JSON.stringify(a):String(a))}function e(a){0===a.indexOf('"')&&(a=a.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\"));try{return a=decodeURIComponent(a.replace(g," ")),h.json?JSON.parse(a):a}catch(b){}}function f(b,c){var d=h.raw?b:e(b);return a.isFunction(c)?c(d):d}var g=/\+/g,h=a.cookie=function(e,g,i){if(void 0!==g&&!a.isFunction(g)){if(i=a.extend({},h.defaults,i),"number"==typeof i.expires){var j=i.expires,k=i.expires=new Date;k.setTime(+k+864e5*j)}return document.cookie=[b(e),"=",d(g),i.expires?"; expires="+i.expires.toUTCString():"",i.path?"; path="+i.path:"",i.domain?"; domain="+i.domain:"",i.secure?"; secure":""].join("")}for(var l=e?void 0:{},m=document.cookie?document.cookie.split("; "):[],n=0,o=m.length;o>n;n++){var p=m[n].split("="),q=c(p.shift()),r=p.join("=");if(e&&e===q){l=f(r,g);break}e||void 0===(r=f(r))||(l[q]=r)}return l};h.defaults={},a.removeCookie=function(b,c){return void 0===a.cookie(b)?!1:(a.cookie(b,"",a.extend({},c,{expires:-1})),!a.cookie(b))}});
+/*!
+ * Select2 4.0.8
+ * https://select2.github.io
+ *
+ * Released under the MIT license
+ * https://github.com/select2/select2/blob/master/LICENSE.md
+ */
+
+;(function (factory) {
+  if (typeof define === 'function' && define.amd) {
+    // AMD. Register as an anonymous module.
+    define(['jquery'], factory);
+  } else if (typeof module === 'object' && module.exports) {
+    // Node/CommonJS
+    module.exports = function (root, jQuery) {
+      if (jQuery === undefined) {
+        // require('jQuery') returns a factory that requires window to
+        // build a jQuery instance, we normalize how we use modules
+        // that require this pattern but the window provided is a noop
+        // if it's defined (how jquery works)
+        if (typeof window !== 'undefined') {
+          jQuery = require('jquery');
+        }
+        else {
+          jQuery = require('jquery')(root);
+        }
+      }
+      factory(jQuery);
+      return jQuery;
+    };
+  } else {
+    // Browser globals
+    factory(jQuery);
+  }
+} (function (jQuery) {
+  // This is needed so we can catch the AMD loader configuration and use it
+  // The inner file should be wrapped (by `banner.start.js`) in a function that
+  // returns the AMD loader references.
+  var S2 =(function () {
+  // Restore the Select2 AMD loader so it can be used
+  // Needed mostly in the language files, where the loader is not inserted
+  if (jQuery && jQuery.fn && jQuery.fn.select2 && jQuery.fn.select2.amd) {
+    var S2 = jQuery.fn.select2.amd;
+  }
+var S2;(function () { if (!S2 || !S2.requirejs) {
+if (!S2) { S2 = {}; } else { require = S2; }
+/**
+ * @license almond 0.3.3 Copyright jQuery Foundation and other contributors.
+ * Released under MIT license, http://github.com/requirejs/almond/LICENSE
+ */
+//Going sloppy to avoid 'use strict' string cost, but strict practices should
+//be followed.
+/*global setTimeout: false */
+
+var requirejs, require, define;
+(function (undef) {
+    var main, req, makeMap, handlers,
+        defined = {},
+        waiting = {},
+        config = {},
+        defining = {},
+        hasOwn = Object.prototype.hasOwnProperty,
+        aps = [].slice,
+        jsSuffixRegExp = /\.js$/;
+
+    function hasProp(obj, prop) {
+        return hasOwn.call(obj, prop);
+    }
+
+    /**
+     * Given a relative module name, like ./something, normalize it to
+     * a real name that can be mapped to a path.
+     * @param {String} name the relative name
+     * @param {String} baseName a real name that the name arg is relative
+     * to.
+     * @returns {String} normalized name
+     */
+    function normalize(name, baseName) {
+        var nameParts, nameSegment, mapValue, foundMap, lastIndex,
+            foundI, foundStarMap, starI, i, j, part, normalizedBaseParts,
+            baseParts = baseName && baseName.split("/"),
+            map = config.map,
+            starMap = (map && map['*']) || {};
+
+        //Adjust any relative paths.
+        if (name) {
+            name = name.split('/');
+            lastIndex = name.length - 1;
+
+            // If wanting node ID compatibility, strip .js from end
+            // of IDs. Have to do this here, and not in nameToUrl
+            // because node allows either .js or non .js to map
+            // to same file.
+            if (config.nodeIdCompat && jsSuffixRegExp.test(name[lastIndex])) {
+                name[lastIndex] = name[lastIndex].replace(jsSuffixRegExp, '');
+            }
+
+            // Starts with a '.' so need the baseName
+            if (name[0].charAt(0) === '.' && baseParts) {
+                //Convert baseName to array, and lop off the last part,
+                //so that . matches that 'directory' and not name of the baseName's
+                //module. For instance, baseName of 'one/two/three', maps to
+                //'one/two/three.js', but we want the directory, 'one/two' for
+                //this normalization.
+                normalizedBaseParts = baseParts.slice(0, baseParts.length - 1);
+                name = normalizedBaseParts.concat(name);
+            }
+
+            //start trimDots
+            for (i = 0; i < name.length; i++) {
+                part = name[i];
+                if (part === '.') {
+                    name.splice(i, 1);
+                    i -= 1;
+                } else if (part === '..') {
+                    // If at the start, or previous value is still ..,
+                    // keep them so that when converted to a path it may
+                    // still work when converted to a path, even though
+                    // as an ID it is less than ideal. In larger point
+                    // releases, may be better to just kick out an error.
+                    if (i === 0 || (i === 1 && name[2] === '..') || name[i - 1] === '..') {
+                        continue;
+                    } else if (i > 0) {
+                        name.splice(i - 1, 2);
+                        i -= 2;
+                    }
+                }
+            }
+            //end trimDots
+
+            name = name.join('/');
+        }
+
+        //Apply map config if available.
+        if ((baseParts || starMap) && map) {
+            nameParts = name.split('/');
+
+            for (i = nameParts.length; i > 0; i -= 1) {
+                nameSegment = nameParts.slice(0, i).join("/");
+
+                if (baseParts) {
+                    //Find the longest baseName segment match in the config.
+                    //So, do joins on the biggest to smallest lengths of baseParts.
+                    for (j = baseParts.length; j > 0; j -= 1) {
+                        mapValue = map[baseParts.slice(0, j).join('/')];
+
+                        //baseName segment has  config, find if it has one for
+                        //this name.
+                        if (mapValue) {
+                            mapValue = mapValue[nameSegment];
+                            if (mapValue) {
+                                //Match, update name to the new value.
+                                foundMap = mapValue;
+                                foundI = i;
+                                break;
+                            }
+                        }
+                    }
+                }
+
+                if (foundMap) {
+                    break;
+                }
+
+                //Check for a star map match, but just hold on to it,
+                //if there is a shorter segment match later in a matching
+                //config, then favor over this star map.
+                if (!foundStarMap && starMap && starMap[nameSegment]) {
+                    foundStarMap = starMap[nameSegment];
+                    starI = i;
+                }
+            }
+
+            if (!foundMap && foundStarMap) {
+                foundMap = foundStarMap;
+                foundI = starI;
+            }
+
+            if (foundMap) {
+                nameParts.splice(0, foundI, foundMap);
+                name = nameParts.join('/');
+            }
+        }
+
+        return name;
+    }
+
+    function makeRequire(relName, forceSync) {
+        return function () {
+            //A version of a require function that passes a moduleName
+            //value for items that may need to
+            //look up paths relative to the moduleName
+            var args = aps.call(arguments, 0);
+
+            //If first arg is not require('string'), and there is only
+            //one arg, it is the array form without a callback. Insert
+            //a null so that the following concat is correct.
+            if (typeof args[0] !== 'string' && args.length === 1) {
+                args.push(null);
+            }
+            return req.apply(undef, args.concat([relName, forceSync]));
+        };
+    }
+
+    function makeNormalize(relName) {
+        return function (name) {
+            return normalize(name, relName);
+        };
+    }
+
+    function makeLoad(depName) {
+        return function (value) {
+            defined[depName] = value;
+        };
+    }
+
+    function callDep(name) {
+        if (hasProp(waiting, name)) {
+            var args = waiting[name];
+            delete waiting[name];
+            defining[name] = true;
+            main.apply(undef, args);
+        }
+
+        if (!hasProp(defined, name) && !hasProp(defining, name)) {
+            throw new Error('No ' + name);
+        }
+        return defined[name];
+    }
+
+    //Turns a plugin!resource to [plugin, resource]
+    //with the plugin being undefined if the name
+    //did not have a plugin prefix.
+    function splitPrefix(name) {
+        var prefix,
+            index = name ? name.indexOf('!') : -1;
+        if (index > -1) {
+            prefix = name.substring(0, index);
+            name = name.substring(index + 1, name.length);
+        }
+        return [prefix, name];
+    }
+
+    //Creates a parts array for a relName where first part is plugin ID,
+    //second part is resource ID. Assumes relName has already been normalized.
+    function makeRelParts(relName) {
+        return relName ? splitPrefix(relName) : [];
+    }
+
+    /**
+     * Makes a name map, normalizing the name, and using a plugin
+     * for normalization if necessary. Grabs a ref to plugin
+     * too, as an optimization.
+     */
+    makeMap = function (name, relParts) {
+        var plugin,
+            parts = splitPrefix(name),
+            prefix = parts[0],
+            relResourceName = relParts[1];
+
+        name = parts[1];
+
+        if (prefix) {
+            prefix = normalize(prefix, relResourceName);
+            plugin = callDep(prefix);
+        }
+
+        //Normalize according
+        if (prefix) {
+            if (plugin && plugin.normalize) {
+                name = plugin.normalize(name, makeNormalize(relResourceName));
+            } else {
+                name = normalize(name, relResourceName);
+            }
+        } else {
+            name = normalize(name, relResourceName);
+            parts = splitPrefix(name);
+            prefix = parts[0];
+            name = parts[1];
+            if (prefix) {
+                plugin = callDep(prefix);
+            }
+        }
+
+        //Using ridiculous property names for space reasons
+        return {
+            f: prefix ? prefix + '!' + name : name, //fullName
+            n: name,
+            pr: prefix,
+            p: plugin
+        };
+    };
+
+    function makeConfig(name) {
+        return function () {
+            return (config && config.config && config.config[name]) || {};
+        };
+    }
+
+    handlers = {
+        require: function (name) {
+            return makeRequire(name);
+        },
+        exports: function (name) {
+            var e = defined[name];
+            if (typeof e !== 'undefined') {
+                return e;
+            } else {
+                return (defined[name] = {});
+            }
+        },
+        module: function (name) {
+            return {
+                id: name,
+                uri: '',
+                exports: defined[name],
+                config: makeConfig(name)
+            };
+        }
+    };
+
+    main = function (name, deps, callback, relName) {
+        var cjsModule, depName, ret, map, i, relParts,
+            args = [],
+            callbackType = typeof callback,
+            usingExports;
+
+        //Use name if no relName
+        relName = relName || name;
+        relParts = makeRelParts(relName);
+
+        //Call the callback to define the module, if necessary.
+        if (callbackType === 'undefined' || callbackType === 'function') {
+            //Pull out the defined dependencies and pass the ordered
+            //values to the callback.
+            //Default to [require, exports, module] if no deps
+            deps = !deps.length && callback.length ? ['require', 'exports', 'module'] : deps;
+            for (i = 0; i < deps.length; i += 1) {
+                map = makeMap(deps[i], relParts);
+                depName = map.f;
+
+                //Fast path CommonJS standard dependencies.
+                if (depName === "require") {
+                    args[i] = handlers.require(name);
+                } else if (depName === "exports") {
+                    //CommonJS module spec 1.1
+                    args[i] = handlers.exports(name);
+                    usingExports = true;
+                } else if (depName === "module") {
+                    //CommonJS module spec 1.1
+                    cjsModule = args[i] = handlers.module(name);
+                } else if (hasProp(defined, depName) ||
+                           hasProp(waiting, depName) ||
+                           hasProp(defining, depName)) {
+                    args[i] = callDep(depName);
+                } else if (map.p) {
+                    map.p.load(map.n, makeRequire(relName, true), makeLoad(depName), {});
+                    args[i] = defined[depName];
+                } else {
+                    throw new Error(name + ' missing ' + depName);
+                }
+            }
+
+            ret = callback ? callback.apply(defined[name], args) : undefined;
+
+            if (name) {
+                //If setting exports via "module" is in play,
+                //favor that over return value and exports. After that,
+                //favor a non-undefined return value over exports use.
+                if (cjsModule && cjsModule.exports !== undef &&
+                        cjsModule.exports !== defined[name]) {
+                    defined[name] = cjsModule.exports;
+                } else if (ret !== undef || !usingExports) {
+                    //Use the return value from the function.
+                    defined[name] = ret;
+                }
+            }
+        } else if (name) {
+            //May just be an object definition for the module. Only
+            //worry about defining if have a module name.
+            defined[name] = callback;
+        }
+    };
+
+    requirejs = require = req = function (deps, callback, relName, forceSync, alt) {
+        if (typeof deps === "string") {
+            if (handlers[deps]) {
+                //callback in this case is really relName
+                return handlers[deps](callback);
+            }
+            //Just return the module wanted. In this scenario, the
+            //deps arg is the module name, and second arg (if passed)
+            //is just the relName.
+            //Normalize module name, if it contains . or ..
+            return callDep(makeMap(deps, makeRelParts(callback)).f);
+        } else if (!deps.splice) {
+            //deps is a config object, not an array.
+            config = deps;
+            if (config.deps) {
+                req(config.deps, config.callback);
+            }
+            if (!callback) {
+                return;
+            }
+
+            if (callback.splice) {
+                //callback is an array, which means it is a dependency list.
+                //Adjust args if there are dependencies
+                deps = callback;
+                callback = relName;
+                relName = null;
+            } else {
+                deps = undef;
+            }
+        }
+
+        //Support require(['a'])
+        callback = callback || function () {};
+
+        //If relName is a function, it is an errback handler,
+        //so remove it.
+        if (typeof relName === 'function') {
+            relName = forceSync;
+            forceSync = alt;
+        }
+
+        //Simulate async callback;
+        if (forceSync) {
+            main(undef, deps, callback, relName);
+        } else {
+            //Using a non-zero value because of concern for what old browsers
+            //do, and latest browsers "upgrade" to 4 if lower value is used:
+            //http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-settimeout:
+            //If want a value immediately, use require('id') instead -- something
+            //that works in almond on the global level, but not guaranteed and
+            //unlikely to work in other AMD implementations.
+            setTimeout(function () {
+                main(undef, deps, callback, relName);
+            }, 4);
+        }
+
+        return req;
+    };
+
+    /**
+     * Just drops the config on the floor, but returns req in case
+     * the config return value is used.
+     */
+    req.config = function (cfg) {
+        return req(cfg);
+    };
+
+    /**
+     * Expose module registry for debugging and tooling
+     */
+    requirejs._defined = defined;
+
+    define = function (name, deps, callback) {
+        if (typeof name !== 'string') {
+            throw new Error('See almond README: incorrect module build, no module name');
+        }
+
+        //This module may not have dependencies
+        if (!deps.splice) {
+            //deps is not an array, so probably means
+            //an object literal or factory function for
+            //the value. Adjust args.
+            callback = deps;
+            deps = [];
+        }
+
+        if (!hasProp(defined, name) && !hasProp(waiting, name)) {
+            waiting[name] = [name, deps, callback];
+        }
+    };
+
+    define.amd = {
+        jQuery: true
+    };
+}());
+
+S2.requirejs = requirejs;S2.require = require;S2.define = define;
+}
+}());
+S2.define("almond", function(){});
+
+/* global jQuery:false, $:false */
+S2.define('jquery',[],function () {
+  var _$ = jQuery || $;
+
+  if (_$ == null && console && console.error) {
+    console.error(
+      'Select2: An instance of jQuery or a jQuery-compatible library was not ' +
+      'found. Make sure that you are including jQuery before Select2 on your ' +
+      'web page.'
+    );
+  }
+
+  return _$;
+});
+
+S2.define('select2/utils',[
+  'jquery'
+], function ($) {
+  var Utils = {};
+
+  Utils.Extend = function (ChildClass, SuperClass) {
+    var __hasProp = {}.hasOwnProperty;
+
+    function BaseConstructor () {
+      this.constructor = ChildClass;
+    }
+
+    for (var key in SuperClass) {
+      if (__hasProp.call(SuperClass, key)) {
+        ChildClass[key] = SuperClass[key];
+      }
+    }
+
+    BaseConstructor.prototype = SuperClass.prototype;
+    ChildClass.prototype = new BaseConstructor();
+    ChildClass.__super__ = SuperClass.prototype;
+
+    return ChildClass;
+  };
+
+  function getMethods (theClass) {
+    var proto = theClass.prototype;
+
+    var methods = [];
+
+    for (var methodName in proto) {
+      var m = proto[methodName];
+
+      if (typeof m !== 'function') {
+        continue;
+      }
+
+      if (methodName === 'constructor') {
+        continue;
+      }
+
+      methods.push(methodName);
+    }
+
+    return methods;
+  }
+
+  Utils.Decorate = function (SuperClass, DecoratorClass) {
+    var decoratedMethods = getMethods(DecoratorClass);
+    var superMethods = getMethods(SuperClass);
+
+    function DecoratedClass () {
+      var unshift = Array.prototype.unshift;
+
+      var argCount = DecoratorClass.prototype.constructor.length;
+
+      var calledConstructor = SuperClass.prototype.constructor;
+
+      if (argCount > 0) {
+        unshift.call(arguments, SuperClass.prototype.constructor);
+
+        calledConstructor = DecoratorClass.prototype.constructor;
+      }
+
+      calledConstructor.apply(this, arguments);
+    }
+
+    DecoratorClass.displayName = SuperClass.displayName;
+
+    function ctr () {
+      this.constructor = DecoratedClass;
+    }
+
+    DecoratedClass.prototype = new ctr();
+
+    for (var m = 0; m < superMethods.length; m++) {
+      var superMethod = superMethods[m];
+
+      DecoratedClass.prototype[superMethod] =
+        SuperClass.prototype[superMethod];
+    }
+
+    var calledMethod = function (methodName) {
+      // Stub out the original method if it's not decorating an actual method
+      var originalMethod = function () {};
+
+      if (methodName in DecoratedClass.prototype) {
+        originalMethod = DecoratedClass.prototype[methodName];
+      }
+
+      var decoratedMethod = DecoratorClass.prototype[methodName];
+
+      return function () {
+        var unshift = Array.prototype.unshift;
+
+        unshift.call(arguments, originalMethod);
+
+        return decoratedMethod.apply(this, arguments);
+      };
+    };
+
+    for (var d = 0; d < decoratedMethods.length; d++) {
+      var decoratedMethod = decoratedMethods[d];
+
+      DecoratedClass.prototype[decoratedMethod] = calledMethod(decoratedMethod);
+    }
+
+    return DecoratedClass;
+  };
+
+  var Observable = function () {
+    this.listeners = {};
+  };
+
+  Observable.prototype.on = function (event, callback) {
+    this.listeners = this.listeners || {};
+
+    if (event in this.listeners) {
+      this.listeners[event].push(callback);
+    } else {
+      this.listeners[event] = [callback];
+    }
+  };
+
+  Observable.prototype.trigger = function (event) {
+    var slice = Array.prototype.slice;
+    var params = slice.call(arguments, 1);
+
+    this.listeners = this.listeners || {};
+
+    // Params should always come in as an array
+    if (params == null) {
+      params = [];
+    }
+
+    // If there are no arguments to the event, use a temporary object
+    if (params.length === 0) {
+      params.push({});
+    }
+
+    // Set the `_type` of the first object to the event
+    params[0]._type = event;
+
+    if (event in this.listeners) {
+      this.invoke(this.listeners[event], slice.call(arguments, 1));
+    }
+
+    if ('*' in this.listeners) {
+      this.invoke(this.listeners['*'], arguments);
+    }
+  };
+
+  Observable.prototype.invoke = function (listeners, params) {
+    for (var i = 0, len = listeners.length; i < len; i++) {
+      listeners[i].apply(this, params);
+    }
+  };
+
+  Utils.Observable = Observable;
+
+  Utils.generateChars = function (length) {
+    var chars = '';
+
+    for (var i = 0; i < length; i++) {
+      var randomChar = Math.floor(Math.random() * 36);
+      chars += randomChar.toString(36);
+    }
+
+    return chars;
+  };
+
+  Utils.bind = function (func, context) {
+    return function () {
+      func.apply(context, arguments);
+    };
+  };
+
+  Utils._convertData = function (data) {
+    for (var originalKey in data) {
+      var keys = originalKey.split('-');
+
+      var dataLevel = data;
+
+      if (keys.length === 1) {
+        continue;
+      }
+
+      for (var k = 0; k < keys.length; k++) {
+        var key = keys[k];
+
+        // Lowercase the first letter
+        // By default, dash-separated becomes camelCase
+        key = key.substring(0, 1).toLowerCase() + key.substring(1);
+
+        if (!(key in dataLevel)) {
+          dataLevel[key] = {};
+        }
+
+        if (k == keys.length - 1) {
+          dataLevel[key] = data[originalKey];
+        }
+
+        dataLevel = dataLevel[key];
+      }
+
+      delete data[originalKey];
+    }
+
+    return data;
+  };
+
+  Utils.hasScroll = function (index, el) {
+    // Adapted from the function created by @ShadowScripter
+    // and adapted by @BillBarry on the Stack Exchange Code Review website.
+    // The original code can be found at
+    // http://codereview.stackexchange.com/q/13338
+    // and was designed to be used with the Sizzle selector engine.
+
+    var $el = $(el);
+    var overflowX = el.style.overflowX;
+    var overflowY = el.style.overflowY;
+
+    //Check both x and y declarations
+    if (overflowX === overflowY &&
+        (overflowY === 'hidden' || overflowY === 'visible')) {
+      return false;
+    }
+
+    if (overflowX === 'scroll' || overflowY === 'scroll') {
+      return true;
+    }
+
+    return ($el.innerHeight() < el.scrollHeight ||
+      $el.innerWidth() < el.scrollWidth);
+  };
+
+  Utils.escapeMarkup = function (markup) {
+    var replaceMap = {
+      '\\': '&#92;',
+      '&': '&amp;',
+      '<': '&lt;',
+      '>': '&gt;',
+      '"': '&quot;',
+      '\'': '&#39;',
+      '/': '&#47;'
+    };
+
+    // Do not try to escape the markup if it's not a string
+    if (typeof markup !== 'string') {
+      return markup;
+    }
+
+    return String(markup).replace(/[&<>"'\/\\]/g, function (match) {
+      return replaceMap[match];
+    });
+  };
+
+  // Append an array of jQuery nodes to a given element.
+  Utils.appendMany = function ($element, $nodes) {
+    // jQuery 1.7.x does not support $.fn.append() with an array
+    // Fall back to a jQuery object collection using $.fn.add()
+    if ($.fn.jquery.substr(0, 3) === '1.7') {
+      var $jqNodes = $();
+
+      $.map($nodes, function (node) {
+        $jqNodes = $jqNodes.add(node);
+      });
+
+      $nodes = $jqNodes;
+    }
+
+    $element.append($nodes);
+  };
+
+  // Cache objects in Utils.__cache instead of $.data (see #4346)
+  Utils.__cache = {};
+
+  var id = 0;
+  Utils.GetUniqueElementId = function (element) {
+    // Get a unique element Id. If element has no id,
+    // creates a new unique number, stores it in the id
+    // attribute and returns the new id.
+    // If an id already exists, it simply returns it.
+
+    var select2Id = element.getAttribute('data-select2-id');
+    if (select2Id == null) {
+      // If element has id, use it.
+      if (element.id) {
+        select2Id = element.id;
+        element.setAttribute('data-select2-id', select2Id);
+      } else {
+        element.setAttribute('data-select2-id', ++id);
+        select2Id = id.toString();
+      }
+    }
+    return select2Id;
+  };
+
+  Utils.StoreData = function (element, name, value) {
+    // Stores an item in the cache for a specified element.
+    // name is the cache key.
+    var id = Utils.GetUniqueElementId(element);
+    if (!Utils.__cache[id]) {
+      Utils.__cache[id] = {};
+    }
+
+    Utils.__cache[id][name] = value;
+  };
+
+  Utils.GetData = function (element, name) {
+    // Retrieves a value from the cache by its key (name)
+    // name is optional. If no name specified, return
+    // all cache items for the specified element.
+    // and for a specified element.
+    var id = Utils.GetUniqueElementId(element);
+    if (name) {
+      if (Utils.__cache[id]) {
+        if (Utils.__cache[id][name] != null) {
+          return Utils.__cache[id][name];
+        }
+        return $(element).data(name); // Fallback to HTML5 data attribs.
+      }
+      return $(element).data(name); // Fallback to HTML5 data attribs.
+    } else {
+      return Utils.__cache[id];
+    }
+  };
+
+  Utils.RemoveData = function (element) {
+    // Removes all cached items for a specified element.
+    var id = Utils.GetUniqueElementId(element);
+    if (Utils.__cache[id] != null) {
+      delete Utils.__cache[id];
+    }
+  };
+
+  return Utils;
+});
+
+S2.define('select2/results',[
+  'jquery',
+  './utils'
+], function ($, Utils) {
+  function Results ($element, options, dataAdapter) {
+    this.$element = $element;
+    this.data = dataAdapter;
+    this.options = options;
+
+    Results.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(Results, Utils.Observable);
+
+  Results.prototype.render = function () {
+    var $results = $(
+      '<ul class="select2-results__options" role="tree"></ul>'
+    );
+
+    if (this.options.get('multiple')) {
+      $results.attr('aria-multiselectable', 'true');
+    }
+
+    this.$results = $results;
+
+    return $results;
+  };
+
+  Results.prototype.clear = function () {
+    this.$results.empty();
+  };
+
+  Results.prototype.displayMessage = function (params) {
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    this.clear();
+    this.hideLoading();
+
+    var $message = $(
+      '<li role="treeitem" aria-live="assertive"' +
+      ' class="select2-results__option"></li>'
+    );
+
+    var message = this.options.get('translations').get(params.message);
+
+    $message.append(
+      escapeMarkup(
+        message(params.args)
+      )
+    );
+
+    $message[0].className += ' select2-results__message';
+
+    this.$results.append($message);
+  };
+
+  Results.prototype.hideMessages = function () {
+    this.$results.find('.select2-results__message').remove();
+  };
+
+  Results.prototype.append = function (data) {
+    this.hideLoading();
+
+    var $options = [];
+
+    if (data.results == null || data.results.length === 0) {
+      if (this.$results.children().length === 0) {
+        this.trigger('results:message', {
+          message: 'noResults'
+        });
+      }
+
+      return;
+    }
+
+    data.results = this.sort(data.results);
+
+    for (var d = 0; d < data.results.length; d++) {
+      var item = data.results[d];
+
+      var $option = this.option(item);
+
+      $options.push($option);
+    }
+
+    this.$results.append($options);
+  };
+
+  Results.prototype.position = function ($results, $dropdown) {
+    var $resultsContainer = $dropdown.find('.select2-results');
+    $resultsContainer.append($results);
+  };
+
+  Results.prototype.sort = function (data) {
+    var sorter = this.options.get('sorter');
+
+    return sorter(data);
+  };
+
+  Results.prototype.highlightFirstItem = function () {
+    var $options = this.$results
+      .find('.select2-results__option[aria-selected]');
+
+    var $selected = $options.filter('[aria-selected=true]');
+
+    // Check if there are any selected options
+    if ($selected.length > 0) {
+      // If there are selected options, highlight the first
+      $selected.first().trigger('mouseenter');
+    } else {
+      // If there are no selected options, highlight the first option
+      // in the dropdown
+      $options.first().trigger('mouseenter');
+    }
+
+    this.ensureHighlightVisible();
+  };
+
+  Results.prototype.setClasses = function () {
+    var self = this;
+
+    this.data.current(function (selected) {
+      var selectedIds = $.map(selected, function (s) {
+        return s.id.toString();
+      });
+
+      var $options = self.$results
+        .find('.select2-results__option[aria-selected]');
+
+      $options.each(function () {
+        var $option = $(this);
+
+        var item = Utils.GetData(this, 'data');
+
+        // id needs to be converted to a string when comparing
+        var id = '' + item.id;
+
+        if ((item.element != null && item.element.selected) ||
+            (item.element == null && $.inArray(id, selectedIds) > -1)) {
+          $option.attr('aria-selected', 'true');
+        } else {
+          $option.attr('aria-selected', 'false');
+        }
+      });
+
+    });
+  };
+
+  Results.prototype.showLoading = function (params) {
+    this.hideLoading();
+
+    var loadingMore = this.options.get('translations').get('searching');
+
+    var loading = {
+      disabled: true,
+      loading: true,
+      text: loadingMore(params)
+    };
+    var $loading = this.option(loading);
+    $loading.className += ' loading-results';
+
+    this.$results.prepend($loading);
+  };
+
+  Results.prototype.hideLoading = function () {
+    this.$results.find('.loading-results').remove();
+  };
+
+  Results.prototype.option = function (data) {
+    var option = document.createElement('li');
+    option.className = 'select2-results__option';
+
+    var attrs = {
+      'role': 'treeitem',
+      'aria-selected': 'false'
+    };
+
+    var matches = window.Element.prototype.matches ||
+      window.Element.prototype.msMatchesSelector ||
+      window.Element.prototype.webkitMatchesSelector;
+
+    if ((data.element != null && matches.call(data.element, ':disabled')) ||
+        (data.element == null && data.disabled)) {
+      delete attrs['aria-selected'];
+      attrs['aria-disabled'] = 'true';
+    }
+
+    if (data.id == null) {
+      delete attrs['aria-selected'];
+    }
+
+    if (data._resultId != null) {
+      option.id = data._resultId;
+    }
+
+    if (data.title) {
+      option.title = data.title;
+    }
+
+    if (data.children) {
+      attrs.role = 'group';
+      attrs['aria-label'] = data.text;
+      delete attrs['aria-selected'];
+    }
+
+    for (var attr in attrs) {
+      var val = attrs[attr];
+
+      option.setAttribute(attr, val);
+    }
+
+    if (data.children) {
+      var $option = $(option);
+
+      var label = document.createElement('strong');
+      label.className = 'select2-results__group';
+
+      var $label = $(label);
+      this.template(data, label);
+
+      var $children = [];
+
+      for (var c = 0; c < data.children.length; c++) {
+        var child = data.children[c];
+
+        var $child = this.option(child);
+
+        $children.push($child);
+      }
+
+      var $childrenContainer = $('<ul></ul>', {
+        'class': 'select2-results__options select2-results__options--nested'
+      });
+
+      $childrenContainer.append($children);
+
+      $option.append(label);
+      $option.append($childrenContainer);
+    } else {
+      this.template(data, option);
+    }
+
+    Utils.StoreData(option, 'data', data);
+
+    return option;
+  };
+
+  Results.prototype.bind = function (container, $container) {
+    var self = this;
+
+    var id = container.id + '-results';
+
+    this.$results.attr('id', id);
+
+    container.on('results:all', function (params) {
+      self.clear();
+      self.append(params.data);
+
+      if (container.isOpen()) {
+        self.setClasses();
+        self.highlightFirstItem();
+      }
+    });
+
+    container.on('results:append', function (params) {
+      self.append(params.data);
+
+      if (container.isOpen()) {
+        self.setClasses();
+      }
+    });
+
+    container.on('query', function (params) {
+      self.hideMessages();
+      self.showLoading(params);
+    });
+
+    container.on('select', function () {
+      if (!container.isOpen()) {
+        return;
+      }
+
+      self.setClasses();
+
+      if (self.options.get('scrollAfterSelect')) {
+        self.highlightFirstItem();
+      }
+    });
+
+    container.on('unselect', function () {
+      if (!container.isOpen()) {
+        return;
+      }
+
+      self.setClasses();
+
+      if (self.options.get('scrollAfterSelect')) {
+        self.highlightFirstItem();
+      }
+    });
+
+    container.on('open', function () {
+      // When the dropdown is open, aria-expended="true"
+      self.$results.attr('aria-expanded', 'true');
+      self.$results.attr('aria-hidden', 'false');
+
+      self.setClasses();
+      self.ensureHighlightVisible();
+    });
+
+    container.on('close', function () {
+      // When the dropdown is closed, aria-expended="false"
+      self.$results.attr('aria-expanded', 'false');
+      self.$results.attr('aria-hidden', 'true');
+      self.$results.removeAttr('aria-activedescendant');
+    });
+
+    container.on('results:toggle', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      if ($highlighted.length === 0) {
+        return;
+      }
+
+      $highlighted.trigger('mouseup');
+    });
+
+    container.on('results:select', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      if ($highlighted.length === 0) {
+        return;
+      }
+
+      var data = Utils.GetData($highlighted[0], 'data');
+
+      if ($highlighted.attr('aria-selected') == 'true') {
+        self.trigger('close', {});
+      } else {
+        self.trigger('select', {
+          data: data
+        });
+      }
+    });
+
+    container.on('results:previous', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      var $options = self.$results.find('[aria-selected]');
+
+      var currentIndex = $options.index($highlighted);
+
+      // If we are already at the top, don't move further
+      // If no options, currentIndex will be -1
+      if (currentIndex <= 0) {
+        return;
+      }
+
+      var nextIndex = currentIndex - 1;
+
+      // If none are highlighted, highlight the first
+      if ($highlighted.length === 0) {
+        nextIndex = 0;
+      }
+
+      var $next = $options.eq(nextIndex);
+
+      $next.trigger('mouseenter');
+
+      var currentOffset = self.$results.offset().top;
+      var nextTop = $next.offset().top;
+      var nextOffset = self.$results.scrollTop() + (nextTop - currentOffset);
+
+      if (nextIndex === 0) {
+        self.$results.scrollTop(0);
+      } else if (nextTop - currentOffset < 0) {
+        self.$results.scrollTop(nextOffset);
+      }
+    });
+
+    container.on('results:next', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      var $options = self.$results.find('[aria-selected]');
+
+      var currentIndex = $options.index($highlighted);
+
+      var nextIndex = currentIndex + 1;
+
+      // If we are at the last option, stay there
+      if (nextIndex >= $options.length) {
+        return;
+      }
+
+      var $next = $options.eq(nextIndex);
+
+      $next.trigger('mouseenter');
+
+      var currentOffset = self.$results.offset().top +
+        self.$results.outerHeight(false);
+      var nextBottom = $next.offset().top + $next.outerHeight(false);
+      var nextOffset = self.$results.scrollTop() + nextBottom - currentOffset;
+
+      if (nextIndex === 0) {
+        self.$results.scrollTop(0);
+      } else if (nextBottom > currentOffset) {
+        self.$results.scrollTop(nextOffset);
+      }
+    });
+
+    container.on('results:focus', function (params) {
+      params.element.addClass('select2-results__option--highlighted');
+    });
+
+    container.on('results:message', function (params) {
+      self.displayMessage(params);
+    });
+
+    if ($.fn.mousewheel) {
+      this.$results.on('mousewheel', function (e) {
+        var top = self.$results.scrollTop();
+
+        var bottom = self.$results.get(0).scrollHeight - top + e.deltaY;
+
+        var isAtTop = e.deltaY > 0 && top - e.deltaY <= 0;
+        var isAtBottom = e.deltaY < 0 && bottom <= self.$results.height();
+
+        if (isAtTop) {
+          self.$results.scrollTop(0);
+
+          e.preventDefault();
+          e.stopPropagation();
+        } else if (isAtBottom) {
+          self.$results.scrollTop(
+            self.$results.get(0).scrollHeight - self.$results.height()
+          );
+
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      });
+    }
+
+    this.$results.on('mouseup', '.select2-results__option[aria-selected]',
+      function (evt) {
+      var $this = $(this);
+
+      var data = Utils.GetData(this, 'data');
+
+      if ($this.attr('aria-selected') === 'true') {
+        if (self.options.get('multiple')) {
+          self.trigger('unselect', {
+            originalEvent: evt,
+            data: data
+          });
+        } else {
+          self.trigger('close', {});
+        }
+
+        return;
+      }
+
+      self.trigger('select', {
+        originalEvent: evt,
+        data: data
+      });
+    });
+
+    this.$results.on('mouseenter', '.select2-results__option[aria-selected]',
+      function (evt) {
+      var data = Utils.GetData(this, 'data');
+
+      self.getHighlightedResults()
+          .removeClass('select2-results__option--highlighted');
+
+      self.trigger('results:focus', {
+        data: data,
+        element: $(this)
+      });
+    });
+  };
+
+  Results.prototype.getHighlightedResults = function () {
+    var $highlighted = this.$results
+    .find('.select2-results__option--highlighted');
+
+    return $highlighted;
+  };
+
+  Results.prototype.destroy = function () {
+    this.$results.remove();
+  };
+
+  Results.prototype.ensureHighlightVisible = function () {
+    var $highlighted = this.getHighlightedResults();
+
+    if ($highlighted.length === 0) {
+      return;
+    }
+
+    var $options = this.$results.find('[aria-selected]');
+
+    var currentIndex = $options.index($highlighted);
+
+    var currentOffset = this.$results.offset().top;
+    var nextTop = $highlighted.offset().top;
+    var nextOffset = this.$results.scrollTop() + (nextTop - currentOffset);
+
+    var offsetDelta = nextTop - currentOffset;
+    nextOffset -= $highlighted.outerHeight(false) * 2;
+
+    if (currentIndex <= 2) {
+      this.$results.scrollTop(0);
+    } else if (offsetDelta > this.$results.outerHeight() || offsetDelta < 0) {
+      this.$results.scrollTop(nextOffset);
+    }
+  };
+
+  Results.prototype.template = function (result, container) {
+    var template = this.options.get('templateResult');
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    var content = template(result, container);
+
+    if (content == null) {
+      container.style.display = 'none';
+    } else if (typeof content === 'string') {
+      container.innerHTML = escapeMarkup(content);
+    } else {
+      $(container).append(content);
+    }
+  };
+
+  return Results;
+});
+
+S2.define('select2/keys',[
+
+], function () {
+  var KEYS = {
+    BACKSPACE: 8,
+    TAB: 9,
+    ENTER: 13,
+    SHIFT: 16,
+    CTRL: 17,
+    ALT: 18,
+    ESC: 27,
+    SPACE: 32,
+    PAGE_UP: 33,
+    PAGE_DOWN: 34,
+    END: 35,
+    HOME: 36,
+    LEFT: 37,
+    UP: 38,
+    RIGHT: 39,
+    DOWN: 40,
+    DELETE: 46
+  };
+
+  return KEYS;
+});
+
+S2.define('select2/selection/base',[
+  'jquery',
+  '../utils',
+  '../keys'
+], function ($, Utils, KEYS) {
+  function BaseSelection ($element, options) {
+    this.$element = $element;
+    this.options = options;
+
+    BaseSelection.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(BaseSelection, Utils.Observable);
+
+  BaseSelection.prototype.render = function () {
+    var $selection = $(
+      '<span class="select2-selection" role="combobox" ' +
+      ' aria-haspopup="true" aria-expanded="false">' +
+      '</span>'
+    );
+
+    this._tabindex = 0;
+
+    if (Utils.GetData(this.$element[0], 'old-tabindex') != null) {
+      this._tabindex = Utils.GetData(this.$element[0], 'old-tabindex');
+    } else if (this.$element.attr('tabindex') != null) {
+      this._tabindex = this.$element.attr('tabindex');
+    }
+
+    $selection.attr('title', this.$element.attr('title'));
+    $selection.attr('tabindex', this._tabindex);
+
+    this.$selection = $selection;
+
+    return $selection;
+  };
+
+  BaseSelection.prototype.bind = function (container, $container) {
+    var self = this;
+
+    var id = container.id + '-container';
+    var resultsId = container.id + '-results';
+
+    this.container = container;
+
+    this.$selection.on('focus', function (evt) {
+      self.trigger('focus', evt);
+    });
+
+    this.$selection.on('blur', function (evt) {
+      self._handleBlur(evt);
+    });
+
+    this.$selection.on('keydown', function (evt) {
+      self.trigger('keypress', evt);
+
+      if (evt.which === KEYS.SPACE) {
+        evt.preventDefault();
+      }
+    });
+
+    container.on('results:focus', function (params) {
+      self.$selection.attr('aria-activedescendant', params.data._resultId);
+    });
+
+    container.on('selection:update', function (params) {
+      self.update(params.data);
+    });
+
+    container.on('open', function () {
+      // When the dropdown is open, aria-expanded="true"
+      self.$selection.attr('aria-expanded', 'true');
+      self.$selection.attr('aria-owns', resultsId);
+
+      self._attachCloseHandler(container);
+    });
+
+    container.on('close', function () {
+      // When the dropdown is closed, aria-expanded="false"
+      self.$selection.attr('aria-expanded', 'false');
+      self.$selection.removeAttr('aria-activedescendant');
+      self.$selection.removeAttr('aria-owns');
+
+      self.$selection.trigger('focus');
+
+      self._detachCloseHandler(container);
+    });
+
+    container.on('enable', function () {
+      self.$selection.attr('tabindex', self._tabindex);
+    });
+
+    container.on('disable', function () {
+      self.$selection.attr('tabindex', '-1');
+    });
+  };
+
+  BaseSelection.prototype._handleBlur = function (evt) {
+    var self = this;
+
+    // This needs to be delayed as the active element is the body when the tab
+    // key is pressed, possibly along with others.
+    window.setTimeout(function () {
+      // Don't trigger `blur` if the focus is still in the selection
+      if (
+        (document.activeElement == self.$selection[0]) ||
+        ($.contains(self.$selection[0], document.activeElement))
+      ) {
+        return;
+      }
+
+      self.trigger('blur', evt);
+    }, 1);
+  };
+
+  BaseSelection.prototype._attachCloseHandler = function (container) {
+    var self = this;
+
+    $(document.body).on('mousedown.select2.' + container.id, function (e) {
+      var $target = $(e.target);
+
+      var $select = $target.closest('.select2');
+
+      var $all = $('.select2.select2-container--open');
+
+      $all.each(function () {
+        var $this = $(this);
+
+        if (this == $select[0]) {
+          return;
+        }
+
+        var $element = Utils.GetData(this, 'element');
+
+        $element.select2('close');
+      });
+    });
+  };
+
+  BaseSelection.prototype._detachCloseHandler = function (container) {
+    $(document.body).off('mousedown.select2.' + container.id);
+  };
+
+  BaseSelection.prototype.position = function ($selection, $container) {
+    var $selectionContainer = $container.find('.selection');
+    $selectionContainer.append($selection);
+  };
+
+  BaseSelection.prototype.destroy = function () {
+    this._detachCloseHandler(this.container);
+  };
+
+  BaseSelection.prototype.update = function (data) {
+    throw new Error('The `update` method must be defined in child classes.');
+  };
+
+  return BaseSelection;
+});
+
+S2.define('select2/selection/single',[
+  'jquery',
+  './base',
+  '../utils',
+  '../keys'
+], function ($, BaseSelection, Utils, KEYS) {
+  function SingleSelection () {
+    SingleSelection.__super__.constructor.apply(this, arguments);
+  }
+
+  Utils.Extend(SingleSelection, BaseSelection);
+
+  SingleSelection.prototype.render = function () {
+    var $selection = SingleSelection.__super__.render.call(this);
+
+    $selection.addClass('select2-selection--single');
+
+    $selection.html(
+      '<span class="select2-selection__rendered"></span>' +
+      '<span class="select2-selection__arrow" role="presentation">' +
+        '<b role="presentation"></b>' +
+      '</span>'
+    );
+
+    return $selection;
+  };
+
+  SingleSelection.prototype.bind = function (container, $container) {
+    var self = this;
+
+    SingleSelection.__super__.bind.apply(this, arguments);
+
+    var id = container.id + '-container';
+
+    this.$selection.find('.select2-selection__rendered')
+      .attr('id', id)
+      .attr('role', 'textbox')
+      .attr('aria-readonly', 'true');
+    this.$selection.attr('aria-labelledby', id);
+
+    this.$selection.on('mousedown', function (evt) {
+      // Only respond to left clicks
+      if (evt.which !== 1) {
+        return;
+      }
+
+      self.trigger('toggle', {
+        originalEvent: evt
+      });
+    });
+
+    this.$selection.on('focus', function (evt) {
+      // User focuses on the container
+    });
+
+    this.$selection.on('blur', function (evt) {
+      // User exits the container
+    });
+
+    container.on('focus', function (evt) {
+      if (!container.isOpen()) {
+        self.$selection.trigger('focus');
+      }
+    });
+  };
+
+  SingleSelection.prototype.clear = function () {
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+    $rendered.empty();
+    $rendered.removeAttr('title'); // clear tooltip on empty
+  };
+
+  SingleSelection.prototype.display = function (data, container) {
+    var template = this.options.get('templateSelection');
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    return escapeMarkup(template(data, container));
+  };
+
+  SingleSelection.prototype.selectionContainer = function () {
+    return $('<span></span>');
+  };
+
+  SingleSelection.prototype.update = function (data) {
+    if (data.length === 0) {
+      this.clear();
+      return;
+    }
+
+    var selection = data[0];
+
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+    var formatted = this.display(selection, $rendered);
+
+    $rendered.empty().append(formatted);
+    $rendered.attr('title', selection.title || selection.text);
+  };
+
+  return SingleSelection;
+});
+
+S2.define('select2/selection/multiple',[
+  'jquery',
+  './base',
+  '../utils'
+], function ($, BaseSelection, Utils) {
+  function MultipleSelection ($element, options) {
+    MultipleSelection.__super__.constructor.apply(this, arguments);
+  }
+
+  Utils.Extend(MultipleSelection, BaseSelection);
+
+  MultipleSelection.prototype.render = function () {
+    var $selection = MultipleSelection.__super__.render.call(this);
+
+    $selection.addClass('select2-selection--multiple');
+
+    $selection.html(
+      '<ul class="select2-selection__rendered"></ul>'
+    );
+
+    return $selection;
+  };
+
+  MultipleSelection.prototype.bind = function (container, $container) {
+    var self = this;
+
+    MultipleSelection.__super__.bind.apply(this, arguments);
+
+    this.$selection.on('click', function (evt) {
+      self.trigger('toggle', {
+        originalEvent: evt
+      });
+    });
+
+    this.$selection.on(
+      'click',
+      '.select2-selection__choice__remove',
+      function (evt) {
+        // Ignore the event if it is disabled
+        if (self.options.get('disabled')) {
+          return;
+        }
+
+        var $remove = $(this);
+        var $selection = $remove.parent();
+
+        var data = Utils.GetData($selection[0], 'data');
+
+        self.trigger('unselect', {
+          originalEvent: evt,
+          data: data
+        });
+      }
+    );
+  };
+
+  MultipleSelection.prototype.clear = function () {
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+    $rendered.empty();
+    $rendered.removeAttr('title');
+  };
+
+  MultipleSelection.prototype.display = function (data, container) {
+    var template = this.options.get('templateSelection');
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    return escapeMarkup(template(data, container));
+  };
+
+  MultipleSelection.prototype.selectionContainer = function () {
+    var $container = $(
+      '<li class="select2-selection__choice">' +
+        '<span class="select2-selection__choice__remove" role="presentation">' +
+          '&times;' +
+        '</span>' +
+      '</li>'
+    );
+
+    return $container;
+  };
+
+  MultipleSelection.prototype.update = function (data) {
+    this.clear();
+
+    if (data.length === 0) {
+      return;
+    }
+
+    var $selections = [];
+
+    for (var d = 0; d < data.length; d++) {
+      var selection = data[d];
+
+      var $selection = this.selectionContainer();
+      var formatted = this.display(selection, $selection);
+
+      $selection.append(formatted);
+      $selection.attr('title', selection.title || selection.text);
+
+      Utils.StoreData($selection[0], 'data', selection);
+
+      $selections.push($selection);
+    }
+
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+
+    Utils.appendMany($rendered, $selections);
+  };
+
+  return MultipleSelection;
+});
+
+S2.define('select2/selection/placeholder',[
+  '../utils'
+], function (Utils) {
+  function Placeholder (decorated, $element, options) {
+    this.placeholder = this.normalizePlaceholder(options.get('placeholder'));
+
+    decorated.call(this, $element, options);
+  }
+
+  Placeholder.prototype.normalizePlaceholder = function (_, placeholder) {
+    if (typeof placeholder === 'string') {
+      placeholder = {
+        id: '',
+        text: placeholder
+      };
+    }
+
+    return placeholder;
+  };
+
+  Placeholder.prototype.createPlaceholder = function (decorated, placeholder) {
+    var $placeholder = this.selectionContainer();
+
+    $placeholder.html(this.display(placeholder));
+    $placeholder.addClass('select2-selection__placeholder')
+                .removeClass('select2-selection__choice');
+
+    return $placeholder;
+  };
+
+  Placeholder.prototype.update = function (decorated, data) {
+    var singlePlaceholder = (
+      data.length == 1 && data[0].id != this.placeholder.id
+    );
+    var multipleSelections = data.length > 1;
+
+    if (multipleSelections || singlePlaceholder) {
+      return decorated.call(this, data);
+    }
+
+    this.clear();
+
+    var $placeholder = this.createPlaceholder(this.placeholder);
+
+    this.$selection.find('.select2-selection__rendered').append($placeholder);
+  };
+
+  return Placeholder;
+});
+
+S2.define('select2/selection/allowClear',[
+  'jquery',
+  '../keys',
+  '../utils'
+], function ($, KEYS, Utils) {
+  function AllowClear () { }
+
+  AllowClear.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    if (this.placeholder == null) {
+      if (this.options.get('debug') && window.console && console.error) {
+        console.error(
+          'Select2: The `allowClear` option should be used in combination ' +
+          'with the `placeholder` option.'
+        );
+      }
+    }
+
+    this.$selection.on('mousedown', '.select2-selection__clear',
+      function (evt) {
+        self._handleClear(evt);
+    });
+
+    container.on('keypress', function (evt) {
+      self._handleKeyboardClear(evt, container);
+    });
+  };
+
+  AllowClear.prototype._handleClear = function (_, evt) {
+    // Ignore the event if it is disabled
+    if (this.options.get('disabled')) {
+      return;
+    }
+
+    var $clear = this.$selection.find('.select2-selection__clear');
+
+    // Ignore the event if nothing has been selected
+    if ($clear.length === 0) {
+      return;
+    }
+
+    evt.stopPropagation();
+
+    var data = Utils.GetData($clear[0], 'data');
+
+    var previousVal = this.$element.val();
+    this.$element.val(this.placeholder.id);
+
+    var unselectData = {
+      data: data
+    };
+    this.trigger('clear', unselectData);
+    if (unselectData.prevented) {
+      this.$element.val(previousVal);
+      return;
+    }
+
+    for (var d = 0; d < data.length; d++) {
+      unselectData = {
+        data: data[d]
+      };
+
+      // Trigger the `unselect` event, so people can prevent it from being
+      // cleared.
+      this.trigger('unselect', unselectData);
+
+      // If the event was prevented, don't clear it out.
+      if (unselectData.prevented) {
+        this.$element.val(previousVal);
+        return;
+      }
+    }
+
+    this.$element.trigger('change');
+
+    this.trigger('toggle', {});
+  };
+
+  AllowClear.prototype._handleKeyboardClear = function (_, evt, container) {
+    if (container.isOpen()) {
+      return;
+    }
+
+    if (evt.which == KEYS.DELETE || evt.which == KEYS.BACKSPACE) {
+      this._handleClear(evt);
+    }
+  };
+
+  AllowClear.prototype.update = function (decorated, data) {
+    decorated.call(this, data);
+
+    if (this.$selection.find('.select2-selection__placeholder').length > 0 ||
+        data.length === 0) {
+      return;
+    }
+
+    var removeAll = this.options.get('translations').get('removeAllItems');   
+
+    var $remove = $(
+      '<span class="select2-selection__clear" title="' + removeAll() +'">' +
+        '&times;' +
+      '</span>'
+    );
+    Utils.StoreData($remove[0], 'data', data);
+
+    this.$selection.find('.select2-selection__rendered').prepend($remove);
+  };
+
+  return AllowClear;
+});
+
+S2.define('select2/selection/search',[
+  'jquery',
+  '../utils',
+  '../keys'
+], function ($, Utils, KEYS) {
+  function Search (decorated, $element, options) {
+    decorated.call(this, $element, options);
+  }
+
+  Search.prototype.render = function (decorated) {
+    var $search = $(
+      '<li class="select2-search select2-search--inline">' +
+        '<input class="select2-search__field" type="search" tabindex="-1"' +
+        ' autocomplete="off" autocorrect="off" autocapitalize="none"' +
+        ' spellcheck="false" role="textbox" aria-autocomplete="list" />' +
+      '</li>'
+    );
+
+    this.$searchContainer = $search;
+    this.$search = $search.find('input');
+
+    var $rendered = decorated.call(this);
+
+    this._transferTabIndex();
+
+    return $rendered;
+  };
+
+  Search.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('open', function () {
+      self.$search.trigger('focus');
+    });
+
+    container.on('close', function () {
+      self.$search.val('');
+      self.$search.removeAttr('aria-activedescendant');
+      self.$search.trigger('focus');
+    });
+
+    container.on('enable', function () {
+      self.$search.prop('disabled', false);
+
+      self._transferTabIndex();
+    });
+
+    container.on('disable', function () {
+      self.$search.prop('disabled', true);
+    });
+
+    container.on('focus', function (evt) {
+      self.$search.trigger('focus');
+    });
+
+    container.on('results:focus', function (params) {
+      self.$search.attr('aria-activedescendant', params.id);
+    });
+
+    this.$selection.on('focusin', '.select2-search--inline', function (evt) {
+      self.trigger('focus', evt);
+    });
+
+    this.$selection.on('focusout', '.select2-search--inline', function (evt) {
+      self._handleBlur(evt);
+    });
+
+    this.$selection.on('keydown', '.select2-search--inline', function (evt) {
+      evt.stopPropagation();
+
+      self.trigger('keypress', evt);
+
+      self._keyUpPrevented = evt.isDefaultPrevented();
+
+      var key = evt.which;
+
+      if (key === KEYS.BACKSPACE && self.$search.val() === '') {
+        var $previousChoice = self.$searchContainer
+          .prev('.select2-selection__choice');
+
+        if ($previousChoice.length > 0) {
+          var item = Utils.GetData($previousChoice[0], 'data');
+
+          self.searchRemoveChoice(item);
+
+          evt.preventDefault();
+        }
+      }
+    });
+
+    // Try to detect the IE version should the `documentMode` property that
+    // is stored on the document. This is only implemented in IE and is
+    // slightly cleaner than doing a user agent check.
+    // This property is not available in Edge, but Edge also doesn't have
+    // this bug.
+    var msie = document.documentMode;
+    var disableInputEvents = msie && msie <= 11;
+
+    // Workaround for browsers which do not support the `input` event
+    // This will prevent double-triggering of events for browsers which support
+    // both the `keyup` and `input` events.
+    this.$selection.on(
+      'input.searchcheck',
+      '.select2-search--inline',
+      function (evt) {
+        // IE will trigger the `input` event when a placeholder is used on a
+        // search box. To get around this issue, we are forced to ignore all
+        // `input` events in IE and keep using `keyup`.
+        if (disableInputEvents) {
+          self.$selection.off('input.search input.searchcheck');
+          return;
+        }
+
+        // Unbind the duplicated `keyup` event
+        self.$selection.off('keyup.search');
+      }
+    );
+
+    this.$selection.on(
+      'keyup.search input.search',
+      '.select2-search--inline',
+      function (evt) {
+        // IE will trigger the `input` event when a placeholder is used on a
+        // search box. To get around this issue, we are forced to ignore all
+        // `input` events in IE and keep using `keyup`.
+        if (disableInputEvents && evt.type === 'input') {
+          self.$selection.off('input.search input.searchcheck');
+          return;
+        }
+
+        var key = evt.which;
+
+        // We can freely ignore events from modifier keys
+        if (key == KEYS.SHIFT || key == KEYS.CTRL || key == KEYS.ALT) {
+          return;
+        }
+
+        // Tabbing will be handled during the `keydown` phase
+        if (key == KEYS.TAB) {
+          return;
+        }
+
+        self.handleSearch(evt);
+      }
+    );
+  };
+
+  /**
+   * This method will transfer the tabindex attribute from the rendered
+   * selection to the search box. This allows for the search box to be used as
+   * the primary focus instead of the selection container.
+   *
+   * @private
+   */
+  Search.prototype._transferTabIndex = function (decorated) {
+    this.$search.attr('tabindex', this.$selection.attr('tabindex'));
+    this.$selection.attr('tabindex', '-1');
+  };
+
+  Search.prototype.createPlaceholder = function (decorated, placeholder) {
+    this.$search.attr('placeholder', placeholder.text);
+  };
+
+  Search.prototype.update = function (decorated, data) {
+    var searchHadFocus = this.$search[0] == document.activeElement;
+
+    this.$search.attr('placeholder', '');
+
+    decorated.call(this, data);
+
+    this.$selection.find('.select2-selection__rendered')
+                   .append(this.$searchContainer);
+
+    this.resizeSearch();
+    if (searchHadFocus) {
+      this.$search.trigger('focus');
+    }
+  };
+
+  Search.prototype.handleSearch = function () {
+    this.resizeSearch();
+
+    if (!this._keyUpPrevented) {
+      var input = this.$search.val();
+
+      this.trigger('query', {
+        term: input
+      });
+    }
+
+    this._keyUpPrevented = false;
+  };
+
+  Search.prototype.searchRemoveChoice = function (decorated, item) {
+    this.trigger('unselect', {
+      data: item
+    });
+
+    this.$search.val(item.text);
+    this.handleSearch();
+  };
+
+  Search.prototype.resizeSearch = function () {
+    this.$search.css('width', '25px');
+
+    var width = '';
+
+    if (this.$search.attr('placeholder') !== '') {
+      width = this.$selection.find('.select2-selection__rendered').innerWidth();
+    } else {
+      var minimumWidth = this.$search.val().length + 1;
+
+      width = (minimumWidth * 0.75) + 'em';
+    }
+
+    this.$search.css('width', width);
+  };
+
+  return Search;
+});
+
+S2.define('select2/selection/eventRelay',[
+  'jquery'
+], function ($) {
+  function EventRelay () { }
+
+  EventRelay.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+    var relayEvents = [
+      'open', 'opening',
+      'close', 'closing',
+      'select', 'selecting',
+      'unselect', 'unselecting',
+      'clear', 'clearing'
+    ];
+
+    var preventableEvents = [
+      'opening', 'closing', 'selecting', 'unselecting', 'clearing'
+    ];
+
+    decorated.call(this, container, $container);
+
+    container.on('*', function (name, params) {
+      // Ignore events that should not be relayed
+      if ($.inArray(name, relayEvents) === -1) {
+        return;
+      }
+
+      // The parameters should always be an object
+      params = params || {};
+
+      // Generate the jQuery event for the Select2 event
+      var evt = $.Event('select2:' + name, {
+        params: params
+      });
+
+      self.$element.trigger(evt);
+
+      // Only handle preventable events if it was one
+      if ($.inArray(name, preventableEvents) === -1) {
+        return;
+      }
+
+      params.prevented = evt.isDefaultPrevented();
+    });
+  };
+
+  return EventRelay;
+});
+
+S2.define('select2/translation',[
+  'jquery',
+  'require'
+], function ($, require) {
+  function Translation (dict) {
+    this.dict = dict || {};
+  }
+
+  Translation.prototype.all = function () {
+    return this.dict;
+  };
+
+  Translation.prototype.get = function (key) {
+    return this.dict[key];
+  };
+
+  Translation.prototype.extend = function (translation) {
+    this.dict = $.extend({}, translation.all(), this.dict);
+  };
+
+  // Static functions
+
+  Translation._cache = {};
+
+  Translation.loadPath = function (path) {
+    if (!(path in Translation._cache)) {
+      var translations = require(path);
+
+      Translation._cache[path] = translations;
+    }
+
+    return new Translation(Translation._cache[path]);
+  };
+
+  return Translation;
+});
+
+S2.define('select2/diacritics',[
+
+], function () {
+  var diacritics = {
+    '\u24B6': 'A',
+    '\uFF21': 'A',
+    '\u00C0': 'A',
+    '\u00C1': 'A',
+    '\u00C2': 'A',
+    '\u1EA6': 'A',
+    '\u1EA4': 'A',
+    '\u1EAA': 'A',
+    '\u1EA8': 'A',
+    '\u00C3': 'A',
+    '\u0100': 'A',
+    '\u0102': 'A',
+    '\u1EB0': 'A',
+    '\u1EAE': 'A',
+    '\u1EB4': 'A',
+    '\u1EB2': 'A',
+    '\u0226': 'A',
+    '\u01E0': 'A',
+    '\u00C4': 'A',
+    '\u01DE': 'A',
+    '\u1EA2': 'A',
+    '\u00C5': 'A',
+    '\u01FA': 'A',
+    '\u01CD': 'A',
+    '\u0200': 'A',
+    '\u0202': 'A',
+    '\u1EA0': 'A',
+    '\u1EAC': 'A',
+    '\u1EB6': 'A',
+    '\u1E00': 'A',
+    '\u0104': 'A',
+    '\u023A': 'A',
+    '\u2C6F': 'A',
+    '\uA732': 'AA',
+    '\u00C6': 'AE',
+    '\u01FC': 'AE',
+    '\u01E2': 'AE',
+    '\uA734': 'AO',
+    '\uA736': 'AU',
+    '\uA738': 'AV',
+    '\uA73A': 'AV',
+    '\uA73C': 'AY',
+    '\u24B7': 'B',
+    '\uFF22': 'B',
+    '\u1E02': 'B',
+    '\u1E04': 'B',
+    '\u1E06': 'B',
+    '\u0243': 'B',
+    '\u0182': 'B',
+    '\u0181': 'B',
+    '\u24B8': 'C',
+    '\uFF23': 'C',
+    '\u0106': 'C',
+    '\u0108': 'C',
+    '\u010A': 'C',
+    '\u010C': 'C',
+    '\u00C7': 'C',
+    '\u1E08': 'C',
+    '\u0187': 'C',
+    '\u023B': 'C',
+    '\uA73E': 'C',
+    '\u24B9': 'D',
+    '\uFF24': 'D',
+    '\u1E0A': 'D',
+    '\u010E': 'D',
+    '\u1E0C': 'D',
+    '\u1E10': 'D',
+    '\u1E12': 'D',
+    '\u1E0E': 'D',
+    '\u0110': 'D',
+    '\u018B': 'D',
+    '\u018A': 'D',
+    '\u0189': 'D',
+    '\uA779': 'D',
+    '\u01F1': 'DZ',
+    '\u01C4': 'DZ',
+    '\u01F2': 'Dz',
+    '\u01C5': 'Dz',
+    '\u24BA': 'E',
+    '\uFF25': 'E',
+    '\u00C8': 'E',
+    '\u00C9': 'E',
+    '\u00CA': 'E',
+    '\u1EC0': 'E',
+    '\u1EBE': 'E',
+    '\u1EC4': 'E',
+    '\u1EC2': 'E',
+    '\u1EBC': 'E',
+    '\u0112': 'E',
+    '\u1E14': 'E',
+    '\u1E16': 'E',
+    '\u0114': 'E',
+    '\u0116': 'E',
+    '\u00CB': 'E',
+    '\u1EBA': 'E',
+    '\u011A': 'E',
+    '\u0204': 'E',
+    '\u0206': 'E',
+    '\u1EB8': 'E',
+    '\u1EC6': 'E',
+    '\u0228': 'E',
+    '\u1E1C': 'E',
+    '\u0118': 'E',
+    '\u1E18': 'E',
+    '\u1E1A': 'E',
+    '\u0190': 'E',
+    '\u018E': 'E',
+    '\u24BB': 'F',
+    '\uFF26': 'F',
+    '\u1E1E': 'F',
+    '\u0191': 'F',
+    '\uA77B': 'F',
+    '\u24BC': 'G',
+    '\uFF27': 'G',
+    '\u01F4': 'G',
+    '\u011C': 'G',
+    '\u1E20': 'G',
+    '\u011E': 'G',
+    '\u0120': 'G',
+    '\u01E6': 'G',
+    '\u0122': 'G',
+    '\u01E4': 'G',
+    '\u0193': 'G',
+    '\uA7A0': 'G',
+    '\uA77D': 'G',
+    '\uA77E': 'G',
+    '\u24BD': 'H',
+    '\uFF28': 'H',
+    '\u0124': 'H',
+    '\u1E22': 'H',
+    '\u1E26': 'H',
+    '\u021E': 'H',
+    '\u1E24': 'H',
+    '\u1E28': 'H',
+    '\u1E2A': 'H',
+    '\u0126': 'H',
+    '\u2C67': 'H',
+    '\u2C75': 'H',
+    '\uA78D': 'H',
+    '\u24BE': 'I',
+    '\uFF29': 'I',
+    '\u00CC': 'I',
+    '\u00CD': 'I',
+    '\u00CE': 'I',
+    '\u0128': 'I',
+    '\u012A': 'I',
+    '\u012C': 'I',
+    '\u0130': 'I',
+    '\u00CF': 'I',
+    '\u1E2E': 'I',
+    '\u1EC8': 'I',
+    '\u01CF': 'I',
+    '\u0208': 'I',
+    '\u020A': 'I',
+    '\u1ECA': 'I',
+    '\u012E': 'I',
+    '\u1E2C': 'I',
+    '\u0197': 'I',
+    '\u24BF': 'J',
+    '\uFF2A': 'J',
+    '\u0134': 'J',
+    '\u0248': 'J',
+    '\u24C0': 'K',
+    '\uFF2B': 'K',
+    '\u1E30': 'K',
+    '\u01E8': 'K',
+    '\u1E32': 'K',
+    '\u0136': 'K',
+    '\u1E34': 'K',
+    '\u0198': 'K',
+    '\u2C69': 'K',
+    '\uA740': 'K',
+    '\uA742': 'K',
+    '\uA744': 'K',
+    '\uA7A2': 'K',
+    '\u24C1': 'L',
+    '\uFF2C': 'L',
+    '\u013F': 'L',
+    '\u0139': 'L',
+    '\u013D': 'L',
+    '\u1E36': 'L',
+    '\u1E38': 'L',
+    '\u013B': 'L',
+    '\u1E3C': 'L',
+    '\u1E3A': 'L',
+    '\u0141': 'L',
+    '\u023D': 'L',
+    '\u2C62': 'L',
+    '\u2C60': 'L',
+    '\uA748': 'L',
+    '\uA746': 'L',
+    '\uA780': 'L',
+    '\u01C7': 'LJ',
+    '\u01C8': 'Lj',
+    '\u24C2': 'M',
+    '\uFF2D': 'M',
+    '\u1E3E': 'M',
+    '\u1E40': 'M',
+    '\u1E42': 'M',
+    '\u2C6E': 'M',
+    '\u019C': 'M',
+    '\u24C3': 'N',
+    '\uFF2E': 'N',
+    '\u01F8': 'N',
+    '\u0143': 'N',
+    '\u00D1': 'N',
+    '\u1E44': 'N',
+    '\u0147': 'N',
+    '\u1E46': 'N',
+    '\u0145': 'N',
+    '\u1E4A': 'N',
+    '\u1E48': 'N',
+    '\u0220': 'N',
+    '\u019D': 'N',
+    '\uA790': 'N',
+    '\uA7A4': 'N',
+    '\u01CA': 'NJ',
+    '\u01CB': 'Nj',
+    '\u24C4': 'O',
+    '\uFF2F': 'O',
+    '\u00D2': 'O',
+    '\u00D3': 'O',
+    '\u00D4': 'O',
+    '\u1ED2': 'O',
+    '\u1ED0': 'O',
+    '\u1ED6': 'O',
+    '\u1ED4': 'O',
+    '\u00D5': 'O',
+    '\u1E4C': 'O',
+    '\u022C': 'O',
+    '\u1E4E': 'O',
+    '\u014C': 'O',
+    '\u1E50': 'O',
+    '\u1E52': 'O',
+    '\u014E': 'O',
+    '\u022E': 'O',
+    '\u0230': 'O',
+    '\u00D6': 'O',
+    '\u022A': 'O',
+    '\u1ECE': 'O',
+    '\u0150': 'O',
+    '\u01D1': 'O',
+    '\u020C': 'O',
+    '\u020E': 'O',
+    '\u01A0': 'O',
+    '\u1EDC': 'O',
+    '\u1EDA': 'O',
+    '\u1EE0': 'O',
+    '\u1EDE': 'O',
+    '\u1EE2': 'O',
+    '\u1ECC': 'O',
+    '\u1ED8': 'O',
+    '\u01EA': 'O',
+    '\u01EC': 'O',
+    '\u00D8': 'O',
+    '\u01FE': 'O',
+    '\u0186': 'O',
+    '\u019F': 'O',
+    '\uA74A': 'O',
+    '\uA74C': 'O',
+    '\u0152': 'OE',
+    '\u01A2': 'OI',
+    '\uA74E': 'OO',
+    '\u0222': 'OU',
+    '\u24C5': 'P',
+    '\uFF30': 'P',
+    '\u1E54': 'P',
+    '\u1E56': 'P',
+    '\u01A4': 'P',
+    '\u2C63': 'P',
+    '\uA750': 'P',
+    '\uA752': 'P',
+    '\uA754': 'P',
+    '\u24C6': 'Q',
+    '\uFF31': 'Q',
+    '\uA756': 'Q',
+    '\uA758': 'Q',
+    '\u024A': 'Q',
+    '\u24C7': 'R',
+    '\uFF32': 'R',
+    '\u0154': 'R',
+    '\u1E58': 'R',
+    '\u0158': 'R',
+    '\u0210': 'R',
+    '\u0212': 'R',
+    '\u1E5A': 'R',
+    '\u1E5C': 'R',
+    '\u0156': 'R',
+    '\u1E5E': 'R',
+    '\u024C': 'R',
+    '\u2C64': 'R',
+    '\uA75A': 'R',
+    '\uA7A6': 'R',
+    '\uA782': 'R',
+    '\u24C8': 'S',
+    '\uFF33': 'S',
+    '\u1E9E': 'S',
+    '\u015A': 'S',
+    '\u1E64': 'S',
+    '\u015C': 'S',
+    '\u1E60': 'S',
+    '\u0160': 'S',
+    '\u1E66': 'S',
+    '\u1E62': 'S',
+    '\u1E68': 'S',
+    '\u0218': 'S',
+    '\u015E': 'S',
+    '\u2C7E': 'S',
+    '\uA7A8': 'S',
+    '\uA784': 'S',
+    '\u24C9': 'T',
+    '\uFF34': 'T',
+    '\u1E6A': 'T',
+    '\u0164': 'T',
+    '\u1E6C': 'T',
+    '\u021A': 'T',
+    '\u0162': 'T',
+    '\u1E70': 'T',
+    '\u1E6E': 'T',
+    '\u0166': 'T',
+    '\u01AC': 'T',
+    '\u01AE': 'T',
+    '\u023E': 'T',
+    '\uA786': 'T',
+    '\uA728': 'TZ',
+    '\u24CA': 'U',
+    '\uFF35': 'U',
+    '\u00D9': 'U',
+    '\u00DA': 'U',
+    '\u00DB': 'U',
+    '\u0168': 'U',
+    '\u1E78': 'U',
+    '\u016A': 'U',
+    '\u1E7A': 'U',
+    '\u016C': 'U',
+    '\u00DC': 'U',
+    '\u01DB': 'U',
+    '\u01D7': 'U',
+    '\u01D5': 'U',
+    '\u01D9': 'U',
+    '\u1EE6': 'U',
+    '\u016E': 'U',
+    '\u0170': 'U',
+    '\u01D3': 'U',
+    '\u0214': 'U',
+    '\u0216': 'U',
+    '\u01AF': 'U',
+    '\u1EEA': 'U',
+    '\u1EE8': 'U',
+    '\u1EEE': 'U',
+    '\u1EEC': 'U',
+    '\u1EF0': 'U',
+    '\u1EE4': 'U',
+    '\u1E72': 'U',
+    '\u0172': 'U',
+    '\u1E76': 'U',
+    '\u1E74': 'U',
+    '\u0244': 'U',
+    '\u24CB': 'V',
+    '\uFF36': 'V',
+    '\u1E7C': 'V',
+    '\u1E7E': 'V',
+    '\u01B2': 'V',
+    '\uA75E': 'V',
+    '\u0245': 'V',
+    '\uA760': 'VY',
+    '\u24CC': 'W',
+    '\uFF37': 'W',
+    '\u1E80': 'W',
+    '\u1E82': 'W',
+    '\u0174': 'W',
+    '\u1E86': 'W',
+    '\u1E84': 'W',
+    '\u1E88': 'W',
+    '\u2C72': 'W',
+    '\u24CD': 'X',
+    '\uFF38': 'X',
+    '\u1E8A': 'X',
+    '\u1E8C': 'X',
+    '\u24CE': 'Y',
+    '\uFF39': 'Y',
+    '\u1EF2': 'Y',
+    '\u00DD': 'Y',
+    '\u0176': 'Y',
+    '\u1EF8': 'Y',
+    '\u0232': 'Y',
+    '\u1E8E': 'Y',
+    '\u0178': 'Y',
+    '\u1EF6': 'Y',
+    '\u1EF4': 'Y',
+    '\u01B3': 'Y',
+    '\u024E': 'Y',
+    '\u1EFE': 'Y',
+    '\u24CF': 'Z',
+    '\uFF3A': 'Z',
+    '\u0179': 'Z',
+    '\u1E90': 'Z',
+    '\u017B': 'Z',
+    '\u017D': 'Z',
+    '\u1E92': 'Z',
+    '\u1E94': 'Z',
+    '\u01B5': 'Z',
+    '\u0224': 'Z',
+    '\u2C7F': 'Z',
+    '\u2C6B': 'Z',
+    '\uA762': 'Z',
+    '\u24D0': 'a',
+    '\uFF41': 'a',
+    '\u1E9A': 'a',
+    '\u00E0': 'a',
+    '\u00E1': 'a',
+    '\u00E2': 'a',
+    '\u1EA7': 'a',
+    '\u1EA5': 'a',
+    '\u1EAB': 'a',
+    '\u1EA9': 'a',
+    '\u00E3': 'a',
+    '\u0101': 'a',
+    '\u0103': 'a',
+    '\u1EB1': 'a',
+    '\u1EAF': 'a',
+    '\u1EB5': 'a',
+    '\u1EB3': 'a',
+    '\u0227': 'a',
+    '\u01E1': 'a',
+    '\u00E4': 'a',
+    '\u01DF': 'a',
+    '\u1EA3': 'a',
+    '\u00E5': 'a',
+    '\u01FB': 'a',
+    '\u01CE': 'a',
+    '\u0201': 'a',
+    '\u0203': 'a',
+    '\u1EA1': 'a',
+    '\u1EAD': 'a',
+    '\u1EB7': 'a',
+    '\u1E01': 'a',
+    '\u0105': 'a',
+    '\u2C65': 'a',
+    '\u0250': 'a',
+    '\uA733': 'aa',
+    '\u00E6': 'ae',
+    '\u01FD': 'ae',
+    '\u01E3': 'ae',
+    '\uA735': 'ao',
+    '\uA737': 'au',
+    '\uA739': 'av',
+    '\uA73B': 'av',
+    '\uA73D': 'ay',
+    '\u24D1': 'b',
+    '\uFF42': 'b',
+    '\u1E03': 'b',
+    '\u1E05': 'b',
+    '\u1E07': 'b',
+    '\u0180': 'b',
+    '\u0183': 'b',
+    '\u0253': 'b',
+    '\u24D2': 'c',
+    '\uFF43': 'c',
+    '\u0107': 'c',
+    '\u0109': 'c',
+    '\u010B': 'c',
+    '\u010D': 'c',
+    '\u00E7': 'c',
+    '\u1E09': 'c',
+    '\u0188': 'c',
+    '\u023C': 'c',
+    '\uA73F': 'c',
+    '\u2184': 'c',
+    '\u24D3': 'd',
+    '\uFF44': 'd',
+    '\u1E0B': 'd',
+    '\u010F': 'd',
+    '\u1E0D': 'd',
+    '\u1E11': 'd',
+    '\u1E13': 'd',
+    '\u1E0F': 'd',
+    '\u0111': 'd',
+    '\u018C': 'd',
+    '\u0256': 'd',
+    '\u0257': 'd',
+    '\uA77A': 'd',
+    '\u01F3': 'dz',
+    '\u01C6': 'dz',
+    '\u24D4': 'e',
+    '\uFF45': 'e',
+    '\u00E8': 'e',
+    '\u00E9': 'e',
+    '\u00EA': 'e',
+    '\u1EC1': 'e',
+    '\u1EBF': 'e',
+    '\u1EC5': 'e',
+    '\u1EC3': 'e',
+    '\u1EBD': 'e',
+    '\u0113': 'e',
+    '\u1E15': 'e',
+    '\u1E17': 'e',
+    '\u0115': 'e',
+    '\u0117': 'e',
+    '\u00EB': 'e',
+    '\u1EBB': 'e',
+    '\u011B': 'e',
+    '\u0205': 'e',
+    '\u0207': 'e',
+    '\u1EB9': 'e',
+    '\u1EC7': 'e',
+    '\u0229': 'e',
+    '\u1E1D': 'e',
+    '\u0119': 'e',
+    '\u1E19': 'e',
+    '\u1E1B': 'e',
+    '\u0247': 'e',
+    '\u025B': 'e',
+    '\u01DD': 'e',
+    '\u24D5': 'f',
+    '\uFF46': 'f',
+    '\u1E1F': 'f',
+    '\u0192': 'f',
+    '\uA77C': 'f',
+    '\u24D6': 'g',
+    '\uFF47': 'g',
+    '\u01F5': 'g',
+    '\u011D': 'g',
+    '\u1E21': 'g',
+    '\u011F': 'g',
+    '\u0121': 'g',
+    '\u01E7': 'g',
+    '\u0123': 'g',
+    '\u01E5': 'g',
+    '\u0260': 'g',
+    '\uA7A1': 'g',
+    '\u1D79': 'g',
+    '\uA77F': 'g',
+    '\u24D7': 'h',
+    '\uFF48': 'h',
+    '\u0125': 'h',
+    '\u1E23': 'h',
+    '\u1E27': 'h',
+    '\u021F': 'h',
+    '\u1E25': 'h',
+    '\u1E29': 'h',
+    '\u1E2B': 'h',
+    '\u1E96': 'h',
+    '\u0127': 'h',
+    '\u2C68': 'h',
+    '\u2C76': 'h',
+    '\u0265': 'h',
+    '\u0195': 'hv',
+    '\u24D8': 'i',
+    '\uFF49': 'i',
+    '\u00EC': 'i',
+    '\u00ED': 'i',
+    '\u00EE': 'i',
+    '\u0129': 'i',
+    '\u012B': 'i',
+    '\u012D': 'i',
+    '\u00EF': 'i',
+    '\u1E2F': 'i',
+    '\u1EC9': 'i',
+    '\u01D0': 'i',
+    '\u0209': 'i',
+    '\u020B': 'i',
+    '\u1ECB': 'i',
+    '\u012F': 'i',
+    '\u1E2D': 'i',
+    '\u0268': 'i',
+    '\u0131': 'i',
+    '\u24D9': 'j',
+    '\uFF4A': 'j',
+    '\u0135': 'j',
+    '\u01F0': 'j',
+    '\u0249': 'j',
+    '\u24DA': 'k',
+    '\uFF4B': 'k',
+    '\u1E31': 'k',
+    '\u01E9': 'k',
+    '\u1E33': 'k',
+    '\u0137': 'k',
+    '\u1E35': 'k',
+    '\u0199': 'k',
+    '\u2C6A': 'k',
+    '\uA741': 'k',
+    '\uA743': 'k',
+    '\uA745': 'k',
+    '\uA7A3': 'k',
+    '\u24DB': 'l',
+    '\uFF4C': 'l',
+    '\u0140': 'l',
+    '\u013A': 'l',
+    '\u013E': 'l',
+    '\u1E37': 'l',
+    '\u1E39': 'l',
+    '\u013C': 'l',
+    '\u1E3D': 'l',
+    '\u1E3B': 'l',
+    '\u017F': 'l',
+    '\u0142': 'l',
+    '\u019A': 'l',
+    '\u026B': 'l',
+    '\u2C61': 'l',
+    '\uA749': 'l',
+    '\uA781': 'l',
+    '\uA747': 'l',
+    '\u01C9': 'lj',
+    '\u24DC': 'm',
+    '\uFF4D': 'm',
+    '\u1E3F': 'm',
+    '\u1E41': 'm',
+    '\u1E43': 'm',
+    '\u0271': 'm',
+    '\u026F': 'm',
+    '\u24DD': 'n',
+    '\uFF4E': 'n',
+    '\u01F9': 'n',
+    '\u0144': 'n',
+    '\u00F1': 'n',
+    '\u1E45': 'n',
+    '\u0148': 'n',
+    '\u1E47': 'n',
+    '\u0146': 'n',
+    '\u1E4B': 'n',
+    '\u1E49': 'n',
+    '\u019E': 'n',
+    '\u0272': 'n',
+    '\u0149': 'n',
+    '\uA791': 'n',
+    '\uA7A5': 'n',
+    '\u01CC': 'nj',
+    '\u24DE': 'o',
+    '\uFF4F': 'o',
+    '\u00F2': 'o',
+    '\u00F3': 'o',
+    '\u00F4': 'o',
+    '\u1ED3': 'o',
+    '\u1ED1': 'o',
+    '\u1ED7': 'o',
+    '\u1ED5': 'o',
+    '\u00F5': 'o',
+    '\u1E4D': 'o',
+    '\u022D': 'o',
+    '\u1E4F': 'o',
+    '\u014D': 'o',
+    '\u1E51': 'o',
+    '\u1E53': 'o',
+    '\u014F': 'o',
+    '\u022F': 'o',
+    '\u0231': 'o',
+    '\u00F6': 'o',
+    '\u022B': 'o',
+    '\u1ECF': 'o',
+    '\u0151': 'o',
+    '\u01D2': 'o',
+    '\u020D': 'o',
+    '\u020F': 'o',
+    '\u01A1': 'o',
+    '\u1EDD': 'o',
+    '\u1EDB': 'o',
+    '\u1EE1': 'o',
+    '\u1EDF': 'o',
+    '\u1EE3': 'o',
+    '\u1ECD': 'o',
+    '\u1ED9': 'o',
+    '\u01EB': 'o',
+    '\u01ED': 'o',
+    '\u00F8': 'o',
+    '\u01FF': 'o',
+    '\u0254': 'o',
+    '\uA74B': 'o',
+    '\uA74D': 'o',
+    '\u0275': 'o',
+    '\u0153': 'oe',
+    '\u01A3': 'oi',
+    '\u0223': 'ou',
+    '\uA74F': 'oo',
+    '\u24DF': 'p',
+    '\uFF50': 'p',
+    '\u1E55': 'p',
+    '\u1E57': 'p',
+    '\u01A5': 'p',
+    '\u1D7D': 'p',
+    '\uA751': 'p',
+    '\uA753': 'p',
+    '\uA755': 'p',
+    '\u24E0': 'q',
+    '\uFF51': 'q',
+    '\u024B': 'q',
+    '\uA757': 'q',
+    '\uA759': 'q',
+    '\u24E1': 'r',
+    '\uFF52': 'r',
+    '\u0155': 'r',
+    '\u1E59': 'r',
+    '\u0159': 'r',
+    '\u0211': 'r',
+    '\u0213': 'r',
+    '\u1E5B': 'r',
+    '\u1E5D': 'r',
+    '\u0157': 'r',
+    '\u1E5F': 'r',
+    '\u024D': 'r',
+    '\u027D': 'r',
+    '\uA75B': 'r',
+    '\uA7A7': 'r',
+    '\uA783': 'r',
+    '\u24E2': 's',
+    '\uFF53': 's',
+    '\u00DF': 's',
+    '\u015B': 's',
+    '\u1E65': 's',
+    '\u015D': 's',
+    '\u1E61': 's',
+    '\u0161': 's',
+    '\u1E67': 's',
+    '\u1E63': 's',
+    '\u1E69': 's',
+    '\u0219': 's',
+    '\u015F': 's',
+    '\u023F': 's',
+    '\uA7A9': 's',
+    '\uA785': 's',
+    '\u1E9B': 's',
+    '\u24E3': 't',
+    '\uFF54': 't',
+    '\u1E6B': 't',
+    '\u1E97': 't',
+    '\u0165': 't',
+    '\u1E6D': 't',
+    '\u021B': 't',
+    '\u0163': 't',
+    '\u1E71': 't',
+    '\u1E6F': 't',
+    '\u0167': 't',
+    '\u01AD': 't',
+    '\u0288': 't',
+    '\u2C66': 't',
+    '\uA787': 't',
+    '\uA729': 'tz',
+    '\u24E4': 'u',
+    '\uFF55': 'u',
+    '\u00F9': 'u',
+    '\u00FA': 'u',
+    '\u00FB': 'u',
+    '\u0169': 'u',
+    '\u1E79': 'u',
+    '\u016B': 'u',
+    '\u1E7B': 'u',
+    '\u016D': 'u',
+    '\u00FC': 'u',
+    '\u01DC': 'u',
+    '\u01D8': 'u',
+    '\u01D6': 'u',
+    '\u01DA': 'u',
+    '\u1EE7': 'u',
+    '\u016F': 'u',
+    '\u0171': 'u',
+    '\u01D4': 'u',
+    '\u0215': 'u',
+    '\u0217': 'u',
+    '\u01B0': 'u',
+    '\u1EEB': 'u',
+    '\u1EE9': 'u',
+    '\u1EEF': 'u',
+    '\u1EED': 'u',
+    '\u1EF1': 'u',
+    '\u1EE5': 'u',
+    '\u1E73': 'u',
+    '\u0173': 'u',
+    '\u1E77': 'u',
+    '\u1E75': 'u',
+    '\u0289': 'u',
+    '\u24E5': 'v',
+    '\uFF56': 'v',
+    '\u1E7D': 'v',
+    '\u1E7F': 'v',
+    '\u028B': 'v',
+    '\uA75F': 'v',
+    '\u028C': 'v',
+    '\uA761': 'vy',
+    '\u24E6': 'w',
+    '\uFF57': 'w',
+    '\u1E81': 'w',
+    '\u1E83': 'w',
+    '\u0175': 'w',
+    '\u1E87': 'w',
+    '\u1E85': 'w',
+    '\u1E98': 'w',
+    '\u1E89': 'w',
+    '\u2C73': 'w',
+    '\u24E7': 'x',
+    '\uFF58': 'x',
+    '\u1E8B': 'x',
+    '\u1E8D': 'x',
+    '\u24E8': 'y',
+    '\uFF59': 'y',
+    '\u1EF3': 'y',
+    '\u00FD': 'y',
+    '\u0177': 'y',
+    '\u1EF9': 'y',
+    '\u0233': 'y',
+    '\u1E8F': 'y',
+    '\u00FF': 'y',
+    '\u1EF7': 'y',
+    '\u1E99': 'y',
+    '\u1EF5': 'y',
+    '\u01B4': 'y',
+    '\u024F': 'y',
+    '\u1EFF': 'y',
+    '\u24E9': 'z',
+    '\uFF5A': 'z',
+    '\u017A': 'z',
+    '\u1E91': 'z',
+    '\u017C': 'z',
+    '\u017E': 'z',
+    '\u1E93': 'z',
+    '\u1E95': 'z',
+    '\u01B6': 'z',
+    '\u0225': 'z',
+    '\u0240': 'z',
+    '\u2C6C': 'z',
+    '\uA763': 'z',
+    '\u0386': '\u0391',
+    '\u0388': '\u0395',
+    '\u0389': '\u0397',
+    '\u038A': '\u0399',
+    '\u03AA': '\u0399',
+    '\u038C': '\u039F',
+    '\u038E': '\u03A5',
+    '\u03AB': '\u03A5',
+    '\u038F': '\u03A9',
+    '\u03AC': '\u03B1',
+    '\u03AD': '\u03B5',
+    '\u03AE': '\u03B7',
+    '\u03AF': '\u03B9',
+    '\u03CA': '\u03B9',
+    '\u0390': '\u03B9',
+    '\u03CC': '\u03BF',
+    '\u03CD': '\u03C5',
+    '\u03CB': '\u03C5',
+    '\u03B0': '\u03C5',
+    '\u03CE': '\u03C9',
+    '\u03C2': '\u03C3',
+    '\u2019': '\''
+  };
+
+  return diacritics;
+});
+
+S2.define('select2/data/base',[
+  '../utils'
+], function (Utils) {
+  function BaseAdapter ($element, options) {
+    BaseAdapter.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(BaseAdapter, Utils.Observable);
+
+  BaseAdapter.prototype.current = function (callback) {
+    throw new Error('The `current` method must be defined in child classes.');
+  };
+
+  BaseAdapter.prototype.query = function (params, callback) {
+    throw new Error('The `query` method must be defined in child classes.');
+  };
+
+  BaseAdapter.prototype.bind = function (container, $container) {
+    // Can be implemented in subclasses
+  };
+
+  BaseAdapter.prototype.destroy = function () {
+    // Can be implemented in subclasses
+  };
+
+  BaseAdapter.prototype.generateResultId = function (container, data) {
+    var id = container.id + '-result-';
+
+    id += Utils.generateChars(4);
+
+    if (data.id != null) {
+      id += '-' + data.id.toString();
+    } else {
+      id += '-' + Utils.generateChars(4);
+    }
+    return id;
+  };
+
+  return BaseAdapter;
+});
+
+S2.define('select2/data/select',[
+  './base',
+  '../utils',
+  'jquery'
+], function (BaseAdapter, Utils, $) {
+  function SelectAdapter ($element, options) {
+    this.$element = $element;
+    this.options = options;
+
+    SelectAdapter.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(SelectAdapter, BaseAdapter);
+
+  SelectAdapter.prototype.current = function (callback) {
+    var data = [];
+    var self = this;
+
+    this.$element.find(':selected').each(function () {
+      var $option = $(this);
+
+      var option = self.item($option);
+
+      data.push(option);
+    });
+
+    callback(data);
+  };
+
+  SelectAdapter.prototype.select = function (data) {
+    var self = this;
+
+    data.selected = true;
+
+    // If data.element is a DOM node, use it instead
+    if ($(data.element).is('option')) {
+      data.element.selected = true;
+
+      this.$element.trigger('change');
+
+      return;
+    }
+
+    if (this.$element.prop('multiple')) {
+      this.current(function (currentData) {
+        var val = [];
+
+        data = [data];
+        data.push.apply(data, currentData);
+
+        for (var d = 0; d < data.length; d++) {
+          var id = data[d].id;
+
+          if ($.inArray(id, val) === -1) {
+            val.push(id);
+          }
+        }
+
+        self.$element.val(val);
+        self.$element.trigger('change');
+      });
+    } else {
+      var val = data.id;
+
+      this.$element.val(val);
+      this.$element.trigger('change');
+    }
+  };
+
+  SelectAdapter.prototype.unselect = function (data) {
+    var self = this;
+
+    if (!this.$element.prop('multiple')) {
+      return;
+    }
+
+    data.selected = false;
+
+    if ($(data.element).is('option')) {
+      data.element.selected = false;
+
+      this.$element.trigger('change');
+
+      return;
+    }
+
+    this.current(function (currentData) {
+      var val = [];
+
+      for (var d = 0; d < currentData.length; d++) {
+        var id = currentData[d].id;
+
+        if (id !== data.id && $.inArray(id, val) === -1) {
+          val.push(id);
+        }
+      }
+
+      self.$element.val(val);
+
+      self.$element.trigger('change');
+    });
+  };
+
+  SelectAdapter.prototype.bind = function (container, $container) {
+    var self = this;
+
+    this.container = container;
+
+    container.on('select', function (params) {
+      self.select(params.data);
+    });
+
+    container.on('unselect', function (params) {
+      self.unselect(params.data);
+    });
+  };
+
+  SelectAdapter.prototype.destroy = function () {
+    // Remove anything added to child elements
+    this.$element.find('*').each(function () {
+      // Remove any custom data set by Select2
+      Utils.RemoveData(this);
+    });
+  };
+
+  SelectAdapter.prototype.query = function (params, callback) {
+    var data = [];
+    var self = this;
+
+    var $options = this.$element.children();
+
+    $options.each(function () {
+      var $option = $(this);
+
+      if (!$option.is('option') && !$option.is('optgroup')) {
+        return;
+      }
+
+      var option = self.item($option);
+
+      var matches = self.matches(params, option);
+
+      if (matches !== null) {
+        data.push(matches);
+      }
+    });
+
+    callback({
+      results: data
+    });
+  };
+
+  SelectAdapter.prototype.addOptions = function ($options) {
+    Utils.appendMany(this.$element, $options);
+  };
+
+  SelectAdapter.prototype.option = function (data) {
+    var option;
+
+    if (data.children) {
+      option = document.createElement('optgroup');
+      option.label = data.text;
+    } else {
+      option = document.createElement('option');
+
+      if (option.textContent !== undefined) {
+        option.textContent = data.text;
+      } else {
+        option.innerText = data.text;
+      }
+    }
+
+    if (data.id !== undefined) {
+      option.value = data.id;
+    }
+
+    if (data.disabled) {
+      option.disabled = true;
+    }
+
+    if (data.selected) {
+      option.selected = true;
+    }
+
+    if (data.title) {
+      option.title = data.title;
+    }
+
+    var $option = $(option);
+
+    var normalizedData = this._normalizeItem(data);
+    normalizedData.element = option;
+
+    // Override the option's data with the combined data
+    Utils.StoreData(option, 'data', normalizedData);
+
+    return $option;
+  };
+
+  SelectAdapter.prototype.item = function ($option) {
+    var data = {};
+
+    data = Utils.GetData($option[0], 'data');
+
+    if (data != null) {
+      return data;
+    }
+
+    if ($option.is('option')) {
+      data = {
+        id: $option.val(),
+        text: $option.text(),
+        disabled: $option.prop('disabled'),
+        selected: $option.prop('selected'),
+        title: $option.prop('title')
+      };
+    } else if ($option.is('optgroup')) {
+      data = {
+        text: $option.prop('label'),
+        children: [],
+        title: $option.prop('title')
+      };
+
+      var $children = $option.children('option');
+      var children = [];
+
+      for (var c = 0; c < $children.length; c++) {
+        var $child = $($children[c]);
+
+        var child = this.item($child);
+
+        children.push(child);
+      }
+
+      data.children = children;
+    }
+
+    data = this._normalizeItem(data);
+    data.element = $option[0];
+
+    Utils.StoreData($option[0], 'data', data);
+
+    return data;
+  };
+
+  SelectAdapter.prototype._normalizeItem = function (item) {
+    if (item !== Object(item)) {
+      item = {
+        id: item,
+        text: item
+      };
+    }
+
+    item = $.extend({}, {
+      text: ''
+    }, item);
+
+    var defaults = {
+      selected: false,
+      disabled: false
+    };
+
+    if (item.id != null) {
+      item.id = item.id.toString();
+    }
+
+    if (item.text != null) {
+      item.text = item.text.toString();
+    }
+
+    if (item._resultId == null && item.id && this.container != null) {
+      item._resultId = this.generateResultId(this.container, item);
+    }
+
+    return $.extend({}, defaults, item);
+  };
+
+  SelectAdapter.prototype.matches = function (params, data) {
+    var matcher = this.options.get('matcher');
+
+    return matcher(params, data);
+  };
+
+  return SelectAdapter;
+});
+
+S2.define('select2/data/array',[
+  './select',
+  '../utils',
+  'jquery'
+], function (SelectAdapter, Utils, $) {
+  function ArrayAdapter ($element, options) {
+    var data = options.get('data') || [];
+
+    ArrayAdapter.__super__.constructor.call(this, $element, options);
+
+    this.addOptions(this.convertToOptions(data));
+  }
+
+  Utils.Extend(ArrayAdapter, SelectAdapter);
+
+  ArrayAdapter.prototype.select = function (data) {
+    var $option = this.$element.find('option').filter(function (i, elm) {
+      return elm.value == data.id.toString();
+    });
+
+    if ($option.length === 0) {
+      $option = this.option(data);
+
+      this.addOptions($option);
+    }
+
+    ArrayAdapter.__super__.select.call(this, data);
+  };
+
+  ArrayAdapter.prototype.convertToOptions = function (data) {
+    var self = this;
+
+    var $existing = this.$element.find('option');
+    var existingIds = $existing.map(function () {
+      return self.item($(this)).id;
+    }).get();
+
+    var $options = [];
+
+    // Filter out all items except for the one passed in the argument
+    function onlyItem (item) {
+      return function () {
+        return $(this).val() == item.id;
+      };
+    }
+
+    for (var d = 0; d < data.length; d++) {
+      var item = this._normalizeItem(data[d]);
+
+      // Skip items which were pre-loaded, only merge the data
+      if ($.inArray(item.id, existingIds) >= 0) {
+        var $existingOption = $existing.filter(onlyItem(item));
+
+        var existingData = this.item($existingOption);
+        var newData = $.extend(true, {}, item, existingData);
+
+        var $newOption = this.option(newData);
+
+        $existingOption.replaceWith($newOption);
+
+        continue;
+      }
+
+      var $option = this.option(item);
+
+      if (item.children) {
+        var $children = this.convertToOptions(item.children);
+
+        Utils.appendMany($option, $children);
+      }
+
+      $options.push($option);
+    }
+
+    return $options;
+  };
+
+  return ArrayAdapter;
+});
+
+S2.define('select2/data/ajax',[
+  './array',
+  '../utils',
+  'jquery'
+], function (ArrayAdapter, Utils, $) {
+  function AjaxAdapter ($element, options) {
+    this.ajaxOptions = this._applyDefaults(options.get('ajax'));
+
+    if (this.ajaxOptions.processResults != null) {
+      this.processResults = this.ajaxOptions.processResults;
+    }
+
+    AjaxAdapter.__super__.constructor.call(this, $element, options);
+  }
+
+  Utils.Extend(AjaxAdapter, ArrayAdapter);
+
+  AjaxAdapter.prototype._applyDefaults = function (options) {
+    var defaults = {
+      data: function (params) {
+        return $.extend({}, params, {
+          q: params.term
+        });
+      },
+      transport: function (params, success, failure) {
+        var $request = $.ajax(params);
+
+        $request.then(success);
+        $request.fail(failure);
+
+        return $request;
+      }
+    };
+
+    return $.extend({}, defaults, options, true);
+  };
+
+  AjaxAdapter.prototype.processResults = function (results) {
+    return results;
+  };
+
+  AjaxAdapter.prototype.query = function (params, callback) {
+    var matches = [];
+    var self = this;
+
+    if (this._request != null) {
+      // JSONP requests cannot always be aborted
+      if ($.isFunction(this._request.abort)) {
+        this._request.abort();
+      }
+
+      this._request = null;
+    }
+
+    var options = $.extend({
+      type: 'GET'
+    }, this.ajaxOptions);
+
+    if (typeof options.url === 'function') {
+      options.url = options.url.call(this.$element, params);
+    }
+
+    if (typeof options.data === 'function') {
+      options.data = options.data.call(this.$element, params);
+    }
+
+    function request () {
+      var $request = options.transport(options, function (data) {
+        var results = self.processResults(data, params);
+
+        if (self.options.get('debug') && window.console && console.error) {
+          // Check to make sure that the response included a `results` key.
+          if (!results || !results.results || !$.isArray(results.results)) {
+            console.error(
+              'Select2: The AJAX results did not return an array in the ' +
+              '`results` key of the response.'
+            );
+          }
+        }
+
+        callback(results);
+      }, function () {
+        // Attempt to detect if a request was aborted
+        // Only works if the transport exposes a status property
+        if ('status' in $request &&
+            ($request.status === 0 || $request.status === '0')) {
+          return;
+        }
+
+        self.trigger('results:message', {
+          message: 'errorLoading'
+        });
+      });
+
+      self._request = $request;
+    }
+
+    if (this.ajaxOptions.delay && params.term != null) {
+      if (this._queryTimeout) {
+        window.clearTimeout(this._queryTimeout);
+      }
+
+      this._queryTimeout = window.setTimeout(request, this.ajaxOptions.delay);
+    } else {
+      request();
+    }
+  };
+
+  return AjaxAdapter;
+});
+
+S2.define('select2/data/tags',[
+  'jquery'
+], function ($) {
+  function Tags (decorated, $element, options) {
+    var tags = options.get('tags');
+
+    var createTag = options.get('createTag');
+
+    if (createTag !== undefined) {
+      this.createTag = createTag;
+    }
+
+    var insertTag = options.get('insertTag');
+
+    if (insertTag !== undefined) {
+        this.insertTag = insertTag;
+    }
+
+    decorated.call(this, $element, options);
+
+    if ($.isArray(tags)) {
+      for (var t = 0; t < tags.length; t++) {
+        var tag = tags[t];
+        var item = this._normalizeItem(tag);
+
+        var $option = this.option(item);
+
+        this.$element.append($option);
+      }
+    }
+  }
+
+  Tags.prototype.query = function (decorated, params, callback) {
+    var self = this;
+
+    this._removeOldTags();
+
+    if (params.term == null || params.page != null) {
+      decorated.call(this, params, callback);
+      return;
+    }
+
+    function wrapper (obj, child) {
+      var data = obj.results;
+
+      for (var i = 0; i < data.length; i++) {
+        var option = data[i];
+
+        var checkChildren = (
+          option.children != null &&
+          !wrapper({
+            results: option.children
+          }, true)
+        );
+
+        var optionText = (option.text || '').toUpperCase();
+        var paramsTerm = (params.term || '').toUpperCase();
+
+        var checkText = optionText === paramsTerm;
+
+        if (checkText || checkChildren) {
+          if (child) {
+            return false;
+          }
+
+          obj.data = data;
+          callback(obj);
+
+          return;
+        }
+      }
+
+      if (child) {
+        return true;
+      }
+
+      var tag = self.createTag(params);
+
+      if (tag != null) {
+        var $option = self.option(tag);
+        $option.attr('data-select2-tag', true);
+
+        self.addOptions([$option]);
+
+        self.insertTag(data, tag);
+      }
+
+      obj.results = data;
+
+      callback(obj);
+    }
+
+    decorated.call(this, params, wrapper);
+  };
+
+  Tags.prototype.createTag = function (decorated, params) {
+    var term = $.trim(params.term);
+
+    if (term === '') {
+      return null;
+    }
+
+    return {
+      id: term,
+      text: term
+    };
+  };
+
+  Tags.prototype.insertTag = function (_, data, tag) {
+    data.unshift(tag);
+  };
+
+  Tags.prototype._removeOldTags = function (_) {
+    var tag = this._lastTag;
+
+    var $options = this.$element.find('option[data-select2-tag]');
+
+    $options.each(function () {
+      if (this.selected) {
+        return;
+      }
+
+      $(this).remove();
+    });
+  };
+
+  return Tags;
+});
+
+S2.define('select2/data/tokenizer',[
+  'jquery'
+], function ($) {
+  function Tokenizer (decorated, $element, options) {
+    var tokenizer = options.get('tokenizer');
+
+    if (tokenizer !== undefined) {
+      this.tokenizer = tokenizer;
+    }
+
+    decorated.call(this, $element, options);
+  }
+
+  Tokenizer.prototype.bind = function (decorated, container, $container) {
+    decorated.call(this, container, $container);
+
+    this.$search =  container.dropdown.$search || container.selection.$search ||
+      $container.find('.select2-search__field');
+  };
+
+  Tokenizer.prototype.query = function (decorated, params, callback) {
+    var self = this;
+
+    function createAndSelect (data) {
+      // Normalize the data object so we can use it for checks
+      var item = self._normalizeItem(data);
+
+      // Check if the data object already exists as a tag
+      // Select it if it doesn't
+      var $existingOptions = self.$element.find('option').filter(function () {
+        return $(this).val() === item.id;
+      });
+
+      // If an existing option wasn't found for it, create the option
+      if (!$existingOptions.length) {
+        var $option = self.option(item);
+        $option.attr('data-select2-tag', true);
+
+        self._removeOldTags();
+        self.addOptions([$option]);
+      }
+
+      // Select the item, now that we know there is an option for it
+      select(item);
+    }
+
+    function select (data) {
+      self.trigger('select', {
+        data: data
+      });
+    }
+
+    params.term = params.term || '';
+
+    var tokenData = this.tokenizer(params, this.options, createAndSelect);
+
+    if (tokenData.term !== params.term) {
+      // Replace the search term if we have the search box
+      if (this.$search.length) {
+        this.$search.val(tokenData.term);
+        this.$search.trigger('focus');
+      }
+
+      params.term = tokenData.term;
+    }
+
+    decorated.call(this, params, callback);
+  };
+
+  Tokenizer.prototype.tokenizer = function (_, params, options, callback) {
+    var separators = options.get('tokenSeparators') || [];
+    var term = params.term;
+    var i = 0;
+
+    var createTag = this.createTag || function (params) {
+      return {
+        id: params.term,
+        text: params.term
+      };
+    };
+
+    while (i < term.length) {
+      var termChar = term[i];
+
+      if ($.inArray(termChar, separators) === -1) {
+        i++;
+
+        continue;
+      }
+
+      var part = term.substr(0, i);
+      var partParams = $.extend({}, params, {
+        term: part
+      });
+
+      var data = createTag(partParams);
+
+      if (data == null) {
+        i++;
+        continue;
+      }
+
+      callback(data);
+
+      // Reset the term to not include the tokenized portion
+      term = term.substr(i + 1) || '';
+      i = 0;
+    }
+
+    return {
+      term: term
+    };
+  };
+
+  return Tokenizer;
+});
+
+S2.define('select2/data/minimumInputLength',[
+
+], function () {
+  function MinimumInputLength (decorated, $e, options) {
+    this.minimumInputLength = options.get('minimumInputLength');
+
+    decorated.call(this, $e, options);
+  }
+
+  MinimumInputLength.prototype.query = function (decorated, params, callback) {
+    params.term = params.term || '';
+
+    if (params.term.length < this.minimumInputLength) {
+      this.trigger('results:message', {
+        message: 'inputTooShort',
+        args: {
+          minimum: this.minimumInputLength,
+          input: params.term,
+          params: params
+        }
+      });
+
+      return;
+    }
+
+    decorated.call(this, params, callback);
+  };
+
+  return MinimumInputLength;
+});
+
+S2.define('select2/data/maximumInputLength',[
+
+], function () {
+  function MaximumInputLength (decorated, $e, options) {
+    this.maximumInputLength = options.get('maximumInputLength');
+
+    decorated.call(this, $e, options);
+  }
+
+  MaximumInputLength.prototype.query = function (decorated, params, callback) {
+    params.term = params.term || '';
+
+    if (this.maximumInputLength > 0 &&
+        params.term.length > this.maximumInputLength) {
+      this.trigger('results:message', {
+        message: 'inputTooLong',
+        args: {
+          maximum: this.maximumInputLength,
+          input: params.term,
+          params: params
+        }
+      });
+
+      return;
+    }
+
+    decorated.call(this, params, callback);
+  };
+
+  return MaximumInputLength;
+});
+
+S2.define('select2/data/maximumSelectionLength',[
+
+], function (){
+  function MaximumSelectionLength (decorated, $e, options) {
+    this.maximumSelectionLength = options.get('maximumSelectionLength');
+
+    decorated.call(this, $e, options);
+  }
+
+  MaximumSelectionLength.prototype.query =
+    function (decorated, params, callback) {
+      var self = this;
+
+      this.current(function (currentData) {
+        var count = currentData != null ? currentData.length : 0;
+        if (self.maximumSelectionLength > 0 &&
+          count >= self.maximumSelectionLength) {
+          self.trigger('results:message', {
+            message: 'maximumSelected',
+            args: {
+              maximum: self.maximumSelectionLength
+            }
+          });
+          return;
+        }
+        decorated.call(self, params, callback);
+      });
+  };
+
+  return MaximumSelectionLength;
+});
+
+S2.define('select2/dropdown',[
+  'jquery',
+  './utils'
+], function ($, Utils) {
+  function Dropdown ($element, options) {
+    this.$element = $element;
+    this.options = options;
+
+    Dropdown.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(Dropdown, Utils.Observable);
+
+  Dropdown.prototype.render = function () {
+    var $dropdown = $(
+      '<span class="select2-dropdown">' +
+        '<span class="select2-results"></span>' +
+      '</span>'
+    );
+
+    $dropdown.attr('dir', this.options.get('dir'));
+
+    this.$dropdown = $dropdown;
+
+    return $dropdown;
+  };
+
+  Dropdown.prototype.bind = function () {
+    // Should be implemented in subclasses
+  };
+
+  Dropdown.prototype.position = function ($dropdown, $container) {
+    // Should be implemented in subclasses
+  };
+
+  Dropdown.prototype.destroy = function () {
+    // Remove the dropdown from the DOM
+    this.$dropdown.remove();
+  };
+
+  return Dropdown;
+});
+
+S2.define('select2/dropdown/search',[
+  'jquery',
+  '../utils'
+], function ($, Utils) {
+  function Search () { }
+
+  Search.prototype.render = function (decorated) {
+    var $rendered = decorated.call(this);
+
+    var $search = $(
+      '<span class="select2-search select2-search--dropdown">' +
+        '<input class="select2-search__field" type="search" tabindex="-1"' +
+        ' autocomplete="off" autocorrect="off" autocapitalize="none"' +
+        ' spellcheck="false" role="textbox" />' +
+      '</span>'
+    );
+
+    this.$searchContainer = $search;
+    this.$search = $search.find('input');
+
+    $rendered.prepend($search);
+
+    return $rendered;
+  };
+
+  Search.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    this.$search.on('keydown', function (evt) {
+      self.trigger('keypress', evt);
+
+      self._keyUpPrevented = evt.isDefaultPrevented();
+    });
+
+    // Workaround for browsers which do not support the `input` event
+    // This will prevent double-triggering of events for browsers which support
+    // both the `keyup` and `input` events.
+    this.$search.on('input', function (evt) {
+      // Unbind the duplicated `keyup` event
+      $(this).off('keyup');
+    });
+
+    this.$search.on('keyup input', function (evt) {
+      self.handleSearch(evt);
+    });
+
+    container.on('open', function () {
+      self.$search.attr('tabindex', 0);
+
+      self.$search.trigger('focus');
+
+      window.setTimeout(function () {
+        self.$search.trigger('focus');
+      }, 0);
+    });
+
+    container.on('close', function () {
+      self.$search.attr('tabindex', -1);
+
+      self.$search.val('');
+      self.$search.trigger('blur');
+    });
+
+    container.on('focus', function () {
+      if (!container.isOpen()) {
+        self.$search.trigger('focus');
+      }
+    });
+
+    container.on('results:all', function (params) {
+      if (params.query.term == null || params.query.term === '') {
+        var showSearch = self.showSearch(params);
+
+        if (showSearch) {
+          self.$searchContainer.removeClass('select2-search--hide');
+        } else {
+          self.$searchContainer.addClass('select2-search--hide');
+        }
+      }
+    });
+  };
+
+  Search.prototype.handleSearch = function (evt) {
+    if (!this._keyUpPrevented) {
+      var input = this.$search.val();
+
+      this.trigger('query', {
+        term: input
+      });
+    }
+
+    this._keyUpPrevented = false;
+  };
+
+  Search.prototype.showSearch = function (_, params) {
+    return true;
+  };
+
+  return Search;
+});
+
+S2.define('select2/dropdown/hidePlaceholder',[
+
+], function () {
+  function HidePlaceholder (decorated, $element, options, dataAdapter) {
+    this.placeholder = this.normalizePlaceholder(options.get('placeholder'));
+
+    decorated.call(this, $element, options, dataAdapter);
+  }
+
+  HidePlaceholder.prototype.append = function (decorated, data) {
+    data.results = this.removePlaceholder(data.results);
+
+    decorated.call(this, data);
+  };
+
+  HidePlaceholder.prototype.normalizePlaceholder = function (_, placeholder) {
+    if (typeof placeholder === 'string') {
+      placeholder = {
+        id: '',
+        text: placeholder
+      };
+    }
+
+    return placeholder;
+  };
+
+  HidePlaceholder.prototype.removePlaceholder = function (_, data) {
+    var modifiedData = data.slice(0);
+
+    for (var d = data.length - 1; d >= 0; d--) {
+      var item = data[d];
+
+      if (this.placeholder.id === item.id) {
+        modifiedData.splice(d, 1);
+      }
+    }
+
+    return modifiedData;
+  };
+
+  return HidePlaceholder;
+});
+
+S2.define('select2/dropdown/infiniteScroll',[
+  'jquery'
+], function ($) {
+  function InfiniteScroll (decorated, $element, options, dataAdapter) {
+    this.lastParams = {};
+
+    decorated.call(this, $element, options, dataAdapter);
+
+    this.$loadingMore = this.createLoadingMore();
+    this.loading = false;
+  }
+
+  InfiniteScroll.prototype.append = function (decorated, data) {
+    this.$loadingMore.remove();
+    this.loading = false;
+
+    decorated.call(this, data);
+
+    if (this.showLoadingMore(data)) {
+      this.$results.append(this.$loadingMore);
+      this.loadMoreIfNeeded();
+    }
+  };
+
+  InfiniteScroll.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('query', function (params) {
+      self.lastParams = params;
+      self.loading = true;
+    });
+
+    container.on('query:append', function (params) {
+      self.lastParams = params;
+      self.loading = true;
+    });
+
+    this.$results.on('scroll', this.loadMoreIfNeeded.bind(this));
+  };
+
+  InfiniteScroll.prototype.loadMoreIfNeeded = function () {
+    var isLoadMoreVisible = $.contains(
+      document.documentElement,
+      this.$loadingMore[0]
+    );
+
+    if (this.loading || !isLoadMoreVisible) {
+      return;
+    }
+
+    var currentOffset = this.$results.offset().top +
+      this.$results.outerHeight(false);
+    var loadingMoreOffset = this.$loadingMore.offset().top +
+      this.$loadingMore.outerHeight(false);
+
+    if (currentOffset + 50 >= loadingMoreOffset) {
+      this.loadMore();
+    }
+  };
+
+  InfiniteScroll.prototype.loadMore = function () {
+    this.loading = true;
+
+    var params = $.extend({}, {page: 1}, this.lastParams);
+
+    params.page++;
+
+    this.trigger('query:append', params);
+  };
+
+  InfiniteScroll.prototype.showLoadingMore = function (_, data) {
+    return data.pagination && data.pagination.more;
+  };
+
+  InfiniteScroll.prototype.createLoadingMore = function () {
+    var $option = $(
+      '<li ' +
+      'class="select2-results__option select2-results__option--load-more"' +
+      'role="treeitem" aria-disabled="true"></li>'
+    );
+
+    var message = this.options.get('translations').get('loadingMore');
+
+    $option.html(message(this.lastParams));
+
+    return $option;
+  };
+
+  return InfiniteScroll;
+});
+
+S2.define('select2/dropdown/attachBody',[
+  'jquery',
+  '../utils'
+], function ($, Utils) {
+  function AttachBody (decorated, $element, options) {
+    this.$dropdownParent = options.get('dropdownParent') || $(document.body);
+
+    decorated.call(this, $element, options);
+  }
+
+  AttachBody.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    var setupResultsEvents = false;
+
+    decorated.call(this, container, $container);
+
+    container.on('open', function () {
+      self._showDropdown();
+      self._attachPositioningHandler(container);
+
+      if (!setupResultsEvents) {
+        setupResultsEvents = true;
+
+        container.on('results:all', function () {
+          self._positionDropdown();
+          self._resizeDropdown();
+        });
+
+        container.on('results:append', function () {
+          self._positionDropdown();
+          self._resizeDropdown();
+        });
+      }
+    });
+
+    container.on('close', function () {
+      self._hideDropdown();
+      self._detachPositioningHandler(container);
+    });
+
+    this.$dropdownContainer.on('mousedown', function (evt) {
+      evt.stopPropagation();
+    });
+  };
+
+  AttachBody.prototype.destroy = function (decorated) {
+    decorated.call(this);
+
+    this.$dropdownContainer.remove();
+  };
+
+  AttachBody.prototype.position = function (decorated, $dropdown, $container) {
+    // Clone all of the container classes
+    $dropdown.attr('class', $container.attr('class'));
+
+    $dropdown.removeClass('select2');
+    $dropdown.addClass('select2-container--open');
+
+    $dropdown.css({
+      position: 'absolute',
+      top: -999999
+    });
+
+    this.$container = $container;
+  };
+
+  AttachBody.prototype.render = function (decorated) {
+    var $container = $('<span></span>');
+
+    var $dropdown = decorated.call(this);
+    $container.append($dropdown);
+
+    this.$dropdownContainer = $container;
+
+    return $container;
+  };
+
+  AttachBody.prototype._hideDropdown = function (decorated) {
+    this.$dropdownContainer.detach();
+  };
+
+  AttachBody.prototype._attachPositioningHandler =
+      function (decorated, container) {
+    var self = this;
+
+    var scrollEvent = 'scroll.select2.' + container.id;
+    var resizeEvent = 'resize.select2.' + container.id;
+    var orientationEvent = 'orientationchange.select2.' + container.id;
+
+    var $watchers = this.$container.parents().filter(Utils.hasScroll);
+    $watchers.each(function () {
+      Utils.StoreData(this, 'select2-scroll-position', {
+        x: $(this).scrollLeft(),
+        y: $(this).scrollTop()
+      });
+    });
+
+    $watchers.on(scrollEvent, function (ev) {
+      var position = Utils.GetData(this, 'select2-scroll-position');
+      $(this).scrollTop(position.y);
+    });
+
+    $(window).on(scrollEvent + ' ' + resizeEvent + ' ' + orientationEvent,
+      function (e) {
+      self._positionDropdown();
+      self._resizeDropdown();
+    });
+  };
+
+  AttachBody.prototype._detachPositioningHandler =
+      function (decorated, container) {
+    var scrollEvent = 'scroll.select2.' + container.id;
+    var resizeEvent = 'resize.select2.' + container.id;
+    var orientationEvent = 'orientationchange.select2.' + container.id;
+
+    var $watchers = this.$container.parents().filter(Utils.hasScroll);
+    $watchers.off(scrollEvent);
+
+    $(window).off(scrollEvent + ' ' + resizeEvent + ' ' + orientationEvent);
+  };
+
+  AttachBody.prototype._positionDropdown = function () {
+    var $window = $(window);
+
+    var isCurrentlyAbove = this.$dropdown.hasClass('select2-dropdown--above');
+    var isCurrentlyBelow = this.$dropdown.hasClass('select2-dropdown--below');
+
+    var newDirection = null;
+
+    var offset = this.$container.offset();
+
+    offset.bottom = offset.top + this.$container.outerHeight(false);
+
+    var container = {
+      height: this.$container.outerHeight(false)
+    };
+
+    container.top = offset.top;
+    container.bottom = offset.top + container.height;
+
+    var dropdown = {
+      height: this.$dropdown.outerHeight(false)
+    };
+
+    var viewport = {
+      top: $window.scrollTop(),
+      bottom: $window.scrollTop() + $window.height()
+    };
+
+    var enoughRoomAbove = viewport.top < (offset.top - dropdown.height);
+    var enoughRoomBelow = viewport.bottom > (offset.bottom + dropdown.height);
+
+    var css = {
+      left: offset.left,
+      top: container.bottom
+    };
+
+    // Determine what the parent element is to use for calculating the offset
+    var $offsetParent = this.$dropdownParent;
+
+    // For statically positioned elements, we need to get the element
+    // that is determining the offset
+    if ($offsetParent.css('position') === 'static') {
+      $offsetParent = $offsetParent.offsetParent();
+    }
+
+    var parentOffset = $offsetParent.offset();
+
+    css.top -= parentOffset.top;
+    css.left -= parentOffset.left;
+
+    if (!isCurrentlyAbove && !isCurrentlyBelow) {
+      newDirection = 'below';
+    }
+
+    if (!enoughRoomBelow && enoughRoomAbove && !isCurrentlyAbove) {
+      newDirection = 'above';
+    } else if (!enoughRoomAbove && enoughRoomBelow && isCurrentlyAbove) {
+      newDirection = 'below';
+    }
+
+    if (newDirection == 'above' ||
+      (isCurrentlyAbove && newDirection !== 'below')) {
+      css.top = container.top - parentOffset.top - dropdown.height;
+    }
+
+    if (newDirection != null) {
+      this.$dropdown
+        .removeClass('select2-dropdown--below select2-dropdown--above')
+        .addClass('select2-dropdown--' + newDirection);
+      this.$container
+        .removeClass('select2-container--below select2-container--above')
+        .addClass('select2-container--' + newDirection);
+    }
+
+    this.$dropdownContainer.css(css);
+  };
+
+  AttachBody.prototype._resizeDropdown = function () {
+    var css = {
+      width: this.$container.outerWidth(false) + 'px'
+    };
+
+    if (this.options.get('dropdownAutoWidth')) {
+      css.minWidth = css.width;
+      css.position = 'relative';
+      css.width = 'auto';
+    }
+
+    this.$dropdown.css(css);
+  };
+
+  AttachBody.prototype._showDropdown = function (decorated) {
+    this.$dropdownContainer.appendTo(this.$dropdownParent);
+
+    this._positionDropdown();
+    this._resizeDropdown();
+  };
+
+  return AttachBody;
+});
+
+S2.define('select2/dropdown/minimumResultsForSearch',[
+
+], function () {
+  function countResults (data) {
+    var count = 0;
+
+    for (var d = 0; d < data.length; d++) {
+      var item = data[d];
+
+      if (item.children) {
+        count += countResults(item.children);
+      } else {
+        count++;
+      }
+    }
+
+    return count;
+  }
+
+  function MinimumResultsForSearch (decorated, $element, options, dataAdapter) {
+    this.minimumResultsForSearch = options.get('minimumResultsForSearch');
+
+    if (this.minimumResultsForSearch < 0) {
+      this.minimumResultsForSearch = Infinity;
+    }
+
+    decorated.call(this, $element, options, dataAdapter);
+  }
+
+  MinimumResultsForSearch.prototype.showSearch = function (decorated, params) {
+    if (countResults(params.data.results) < this.minimumResultsForSearch) {
+      return false;
+    }
+
+    return decorated.call(this, params);
+  };
+
+  return MinimumResultsForSearch;
+});
+
+S2.define('select2/dropdown/selectOnClose',[
+  '../utils'
+], function (Utils) {
+  function SelectOnClose () { }
+
+  SelectOnClose.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('close', function (params) {
+      self._handleSelectOnClose(params);
+    });
+  };
+
+  SelectOnClose.prototype._handleSelectOnClose = function (_, params) {
+    if (params && params.originalSelect2Event != null) {
+      var event = params.originalSelect2Event;
+
+      // Don't select an item if the close event was triggered from a select or
+      // unselect event
+      if (event._type === 'select' || event._type === 'unselect') {
+        return;
+      }
+    }
+
+    var $highlightedResults = this.getHighlightedResults();
+
+    // Only select highlighted results
+    if ($highlightedResults.length < 1) {
+      return;
+    }
+
+    var data = Utils.GetData($highlightedResults[0], 'data');
+
+    // Don't re-select already selected resulte
+    if (
+      (data.element != null && data.element.selected) ||
+      (data.element == null && data.selected)
+    ) {
+      return;
+    }
+
+    this.trigger('select', {
+        data: data
+    });
+  };
+
+  return SelectOnClose;
+});
+
+S2.define('select2/dropdown/closeOnSelect',[
+
+], function () {
+  function CloseOnSelect () { }
+
+  CloseOnSelect.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('select', function (evt) {
+      self._selectTriggered(evt);
+    });
+
+    container.on('unselect', function (evt) {
+      self._selectTriggered(evt);
+    });
+  };
+
+  CloseOnSelect.prototype._selectTriggered = function (_, evt) {
+    var originalEvent = evt.originalEvent;
+
+    // Don't close if the control key is being held
+    if (originalEvent && (originalEvent.ctrlKey || originalEvent.metaKey)) {
+      return;
+    }
+
+    this.trigger('close', {
+      originalEvent: originalEvent,
+      originalSelect2Event: evt
+    });
+  };
+
+  return CloseOnSelect;
+});
+
+S2.define('select2/i18n/en',[],function () {
+  // English
+  return {
+    errorLoading: function () {
+      return 'The results could not be loaded.';
+    },
+    inputTooLong: function (args) {
+      var overChars = args.input.length - args.maximum;
+
+      var message = 'Please delete ' + overChars + ' character';
+
+      if (overChars != 1) {
+        message += 's';
+      }
+
+      return message;
+    },
+    inputTooShort: function (args) {
+      var remainingChars = args.minimum - args.input.length;
+
+      var message = 'Please enter ' + remainingChars + ' or more characters';
+
+      return message;
+    },
+    loadingMore: function () {
+      return 'Loading more results…';
+    },
+    maximumSelected: function (args) {
+      var message = 'You can only select ' + args.maximum + ' item';
+
+      if (args.maximum != 1) {
+        message += 's';
+      }
+
+      return message;
+    },
+    noResults: function () {
+      return 'No results found';
+    },
+    searching: function () {
+      return 'Searching…';
+    },
+    removeAllItems: function () {
+      return 'Remove all items';
+    }
+  };
+});
+
+S2.define('select2/defaults',[
+  'jquery',
+  'require',
+
+  './results',
+
+  './selection/single',
+  './selection/multiple',
+  './selection/placeholder',
+  './selection/allowClear',
+  './selection/search',
+  './selection/eventRelay',
+
+  './utils',
+  './translation',
+  './diacritics',
+
+  './data/select',
+  './data/array',
+  './data/ajax',
+  './data/tags',
+  './data/tokenizer',
+  './data/minimumInputLength',
+  './data/maximumInputLength',
+  './data/maximumSelectionLength',
+
+  './dropdown',
+  './dropdown/search',
+  './dropdown/hidePlaceholder',
+  './dropdown/infiniteScroll',
+  './dropdown/attachBody',
+  './dropdown/minimumResultsForSearch',
+  './dropdown/selectOnClose',
+  './dropdown/closeOnSelect',
+
+  './i18n/en'
+], function ($, require,
+
+             ResultsList,
+
+             SingleSelection, MultipleSelection, Placeholder, AllowClear,
+             SelectionSearch, EventRelay,
+
+             Utils, Translation, DIACRITICS,
+
+             SelectData, ArrayData, AjaxData, Tags, Tokenizer,
+             MinimumInputLength, MaximumInputLength, MaximumSelectionLength,
+
+             Dropdown, DropdownSearch, HidePlaceholder, InfiniteScroll,
+             AttachBody, MinimumResultsForSearch, SelectOnClose, CloseOnSelect,
+
+             EnglishTranslation) {
+  function Defaults () {
+    this.reset();
+  }
+
+  Defaults.prototype.apply = function (options) {
+    options = $.extend(true, {}, this.defaults, options);
+
+    if (options.dataAdapter == null) {
+      if (options.ajax != null) {
+        options.dataAdapter = AjaxData;
+      } else if (options.data != null) {
+        options.dataAdapter = ArrayData;
+      } else {
+        options.dataAdapter = SelectData;
+      }
+
+      if (options.minimumInputLength > 0) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          MinimumInputLength
+        );
+      }
+
+      if (options.maximumInputLength > 0) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          MaximumInputLength
+        );
+      }
+
+      if (options.maximumSelectionLength > 0) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          MaximumSelectionLength
+        );
+      }
+
+      if (options.tags) {
+        options.dataAdapter = Utils.Decorate(options.dataAdapter, Tags);
+      }
+
+      if (options.tokenSeparators != null || options.tokenizer != null) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          Tokenizer
+        );
+      }
+
+      if (options.query != null) {
+        var Query = require(options.amdBase + 'compat/query');
+
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          Query
+        );
+      }
+
+      if (options.initSelection != null) {
+        var InitSelection = require(options.amdBase + 'compat/initSelection');
+
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          InitSelection
+        );
+      }
+    }
+
+    if (options.resultsAdapter == null) {
+      options.resultsAdapter = ResultsList;
+
+      if (options.ajax != null) {
+        options.resultsAdapter = Utils.Decorate(
+          options.resultsAdapter,
+          InfiniteScroll
+        );
+      }
+
+      if (options.placeholder != null) {
+        options.resultsAdapter = Utils.Decorate(
+          options.resultsAdapter,
+          HidePlaceholder
+        );
+      }
+
+      if (options.selectOnClose) {
+        options.resultsAdapter = Utils.Decorate(
+          options.resultsAdapter,
+          SelectOnClose
+        );
+      }
+    }
+
+    if (options.dropdownAdapter == null) {
+      if (options.multiple) {
+        options.dropdownAdapter = Dropdown;
+      } else {
+        var SearchableDropdown = Utils.Decorate(Dropdown, DropdownSearch);
+
+        options.dropdownAdapter = SearchableDropdown;
+      }
+
+      if (options.minimumResultsForSearch !== 0) {
+        options.dropdownAdapter = Utils.Decorate(
+          options.dropdownAdapter,
+          MinimumResultsForSearch
+        );
+      }
+
+      if (options.closeOnSelect) {
+        options.dropdownAdapter = Utils.Decorate(
+          options.dropdownAdapter,
+          CloseOnSelect
+        );
+      }
+
+      if (
+        options.dropdownCssClass != null ||
+        options.dropdownCss != null ||
+        options.adaptDropdownCssClass != null
+      ) {
+        var DropdownCSS = require(options.amdBase + 'compat/dropdownCss');
+
+        options.dropdownAdapter = Utils.Decorate(
+          options.dropdownAdapter,
+          DropdownCSS
+        );
+      }
+
+      options.dropdownAdapter = Utils.Decorate(
+        options.dropdownAdapter,
+        AttachBody
+      );
+    }
+
+    if (options.selectionAdapter == null) {
+      if (options.multiple) {
+        options.selectionAdapter = MultipleSelection;
+      } else {
+        options.selectionAdapter = SingleSelection;
+      }
+
+      // Add the placeholder mixin if a placeholder was specified
+      if (options.placeholder != null) {
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          Placeholder
+        );
+      }
+
+      if (options.allowClear) {
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          AllowClear
+        );
+      }
+
+      if (options.multiple) {
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          SelectionSearch
+        );
+      }
+
+      if (
+        options.containerCssClass != null ||
+        options.containerCss != null ||
+        options.adaptContainerCssClass != null
+      ) {
+        var ContainerCSS = require(options.amdBase + 'compat/containerCss');
+
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          ContainerCSS
+        );
+      }
+
+      options.selectionAdapter = Utils.Decorate(
+        options.selectionAdapter,
+        EventRelay
+      );
+    }
+
+    if (typeof options.language === 'string') {
+      // Check if the language is specified with a region
+      if (options.language.indexOf('-') > 0) {
+        // Extract the region information if it is included
+        var languageParts = options.language.split('-');
+        var baseLanguage = languageParts[0];
+
+        options.language = [options.language, baseLanguage];
+      } else {
+        options.language = [options.language];
+      }
+    }
+
+    if ($.isArray(options.language)) {
+      var languages = new Translation();
+      options.language.push('en');
+
+      var languageNames = options.language;
+
+      for (var l = 0; l < languageNames.length; l++) {
+        var name = languageNames[l];
+        var language = {};
+
+        try {
+          // Try to load it with the original name
+          language = Translation.loadPath(name);
+        } catch (e) {
+          try {
+            // If we couldn't load it, check if it wasn't the full path
+            name = this.defaults.amdLanguageBase + name;
+            language = Translation.loadPath(name);
+          } catch (ex) {
+            // The translation could not be loaded at all. Sometimes this is
+            // because of a configuration problem, other times this can be
+            // because of how Select2 helps load all possible translation files.
+            if (options.debug && window.console && console.warn) {
+              console.warn(
+                'Select2: The language file for "' + name + '" could not be ' +
+                'automatically loaded. A fallback will be used instead.'
+              );
+            }
+
+            continue;
+          }
+        }
+
+        languages.extend(language);
+      }
+
+      options.translations = languages;
+    } else {
+      var baseTranslation = Translation.loadPath(
+        this.defaults.amdLanguageBase + 'en'
+      );
+      var customTranslation = new Translation(options.language);
+
+      customTranslation.extend(baseTranslation);
+
+      options.translations = customTranslation;
+    }
+
+    return options;
+  };
+
+  Defaults.prototype.reset = function () {
+    function stripDiacritics (text) {
+      // Used 'uni range + named function' from http://jsperf.com/diacritics/18
+      function match(a) {
+        return DIACRITICS[a] || a;
+      }
+
+      return text.replace(/[^\u0000-\u007E]/g, match);
+    }
+
+    function matcher (params, data) {
+      // Always return the object if there is nothing to compare
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+
+      // Do a recursive check for options with children
+      if (data.children && data.children.length > 0) {
+        // Clone the data object if there are children
+        // This is required as we modify the object to remove any non-matches
+        var match = $.extend(true, {}, data);
+
+        // Check each child of the option
+        for (var c = data.children.length - 1; c >= 0; c--) {
+          var child = data.children[c];
+
+          var matches = matcher(params, child);
+
+          // If there wasn't a match, remove the object in the array
+          if (matches == null) {
+            match.children.splice(c, 1);
+          }
+        }
+
+        // If any children matched, return the new object
+        if (match.children.length > 0) {
+          return match;
+        }
+
+        // If there were no matching children, check just the plain object
+        return matcher(params, match);
+      }
+
+      var original = stripDiacritics(data.text).toUpperCase();
+      var term = stripDiacritics(params.term).toUpperCase();
+
+      // Check if the text contains the term
+      if (original.indexOf(term) > -1) {
+        return data;
+      }
+
+      // If it doesn't contain the term, don't return anything
+      return null;
+    }
+
+    this.defaults = {
+      amdBase: './',
+      amdLanguageBase: './i18n/',
+      closeOnSelect: true,
+      debug: false,
+      dropdownAutoWidth: false,
+      escapeMarkup: Utils.escapeMarkup,
+      language: EnglishTranslation,
+      matcher: matcher,
+      minimumInputLength: 0,
+      maximumInputLength: 0,
+      maximumSelectionLength: 0,
+      minimumResultsForSearch: 0,
+      selectOnClose: false,
+      scrollAfterSelect: false,
+      sorter: function (data) {
+        return data;
+      },
+      templateResult: function (result) {
+        return result.text;
+      },
+      templateSelection: function (selection) {
+        return selection.text;
+      },
+      theme: 'default',
+      width: 'resolve'
+    };
+  };
+
+  Defaults.prototype.set = function (key, value) {
+    var camelKey = $.camelCase(key);
+
+    var data = {};
+    data[camelKey] = value;
+
+    var convertedData = Utils._convertData(data);
+
+    $.extend(true, this.defaults, convertedData);
+  };
+
+  var defaults = new Defaults();
+
+  return defaults;
+});
+
+S2.define('select2/options',[
+  'require',
+  'jquery',
+  './defaults',
+  './utils'
+], function (require, $, Defaults, Utils) {
+  function Options (options, $element) {
+    this.options = options;
+
+    if ($element != null) {
+      this.fromElement($element);
+    }
+
+    this.options = Defaults.apply(this.options);
+
+    if ($element && $element.is('input')) {
+      var InputCompat = require(this.get('amdBase') + 'compat/inputData');
+
+      this.options.dataAdapter = Utils.Decorate(
+        this.options.dataAdapter,
+        InputCompat
+      );
+    }
+  }
+
+  Options.prototype.fromElement = function ($e) {
+    var excludedData = ['select2'];
+
+    if (this.options.multiple == null) {
+      this.options.multiple = $e.prop('multiple');
+    }
+
+    if (this.options.disabled == null) {
+      this.options.disabled = $e.prop('disabled');
+    }
+
+    if (this.options.language == null) {
+      if ($e.prop('lang')) {
+        this.options.language = $e.prop('lang').toLowerCase();
+      } else if ($e.closest('[lang]').prop('lang')) {
+        this.options.language = $e.closest('[lang]').prop('lang');
+      }
+    }
+
+    if (this.options.dir == null) {
+      if ($e.prop('dir')) {
+        this.options.dir = $e.prop('dir');
+      } else if ($e.closest('[dir]').prop('dir')) {
+        this.options.dir = $e.closest('[dir]').prop('dir');
+      } else {
+        this.options.dir = 'ltr';
+      }
+    }
+
+    $e.prop('disabled', this.options.disabled);
+    $e.prop('multiple', this.options.multiple);
+
+    if (Utils.GetData($e[0], 'select2Tags')) {
+      if (this.options.debug && window.console && console.warn) {
+        console.warn(
+          'Select2: The `data-select2-tags` attribute has been changed to ' +
+          'use the `data-data` and `data-tags="true"` attributes and will be ' +
+          'removed in future versions of Select2.'
+        );
+      }
+
+      Utils.StoreData($e[0], 'data', Utils.GetData($e[0], 'select2Tags'));
+      Utils.StoreData($e[0], 'tags', true);
+    }
+
+    if (Utils.GetData($e[0], 'ajaxUrl')) {
+      if (this.options.debug && window.console && console.warn) {
+        console.warn(
+          'Select2: The `data-ajax-url` attribute has been changed to ' +
+          '`data-ajax--url` and support for the old attribute will be removed' +
+          ' in future versions of Select2.'
+        );
+      }
+
+      $e.attr('ajax--url', Utils.GetData($e[0], 'ajaxUrl'));
+      Utils.StoreData($e[0], 'ajax-Url', Utils.GetData($e[0], 'ajaxUrl'));
+    }
+
+    var dataset = {};
+
+    function upperCaseLetter(_, letter) {
+      return letter.toUpperCase();
+    }
+
+    // Pre-load all of the attributes which are prefixed with `data-`
+    for (var attr = 0; attr < $e[0].attributes.length; attr++) {
+      var attributeName = $e[0].attributes[attr].name;
+      var prefix = 'data-';
+
+      if (attributeName.substr(0, prefix.length) == prefix) {
+        // Get the contents of the attribute after `data-`
+        var dataName = attributeName.substring(prefix.length);
+
+        // Get the data contents from the consistent source
+        // This is more than likely the jQuery data helper
+        var dataValue = Utils.GetData($e[0], dataName);
+
+        // camelCase the attribute name to match the spec
+        var camelDataName = dataName.replace(/-([a-z])/g, upperCaseLetter);
+
+        // Store the data attribute contents into the dataset since
+        dataset[camelDataName] = dataValue;
+      }
+    }
+
+    // Prefer the element's `dataset` attribute if it exists
+    // jQuery 1.x does not correctly handle data attributes with multiple dashes
+    if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
+      dataset = $.extend(true, {}, $e[0].dataset, dataset);
+    }
+
+    // Prefer our internal data cache if it exists
+    var data = $.extend(true, {}, Utils.GetData($e[0]), dataset);
+
+    data = Utils._convertData(data);
+
+    for (var key in data) {
+      if ($.inArray(key, excludedData) > -1) {
+        continue;
+      }
+
+      if ($.isPlainObject(this.options[key])) {
+        $.extend(this.options[key], data[key]);
+      } else {
+        this.options[key] = data[key];
+      }
+    }
+
+    return this;
+  };
+
+  Options.prototype.get = function (key) {
+    return this.options[key];
+  };
+
+  Options.prototype.set = function (key, val) {
+    this.options[key] = val;
+  };
+
+  return Options;
+});
+
+S2.define('select2/core',[
+  'jquery',
+  './options',
+  './utils',
+  './keys'
+], function ($, Options, Utils, KEYS) {
+  var Select2 = function ($element, options) {
+    if (Utils.GetData($element[0], 'select2') != null) {
+      Utils.GetData($element[0], 'select2').destroy();
+    }
+
+    this.$element = $element;
+
+    this.id = this._generateId($element);
+
+    options = options || {};
+
+    this.options = new Options(options, $element);
+
+    Select2.__super__.constructor.call(this);
+
+    // Set up the tabindex
+
+    var tabindex = $element.attr('tabindex') || 0;
+    Utils.StoreData($element[0], 'old-tabindex', tabindex);
+    $element.attr('tabindex', '-1');
+
+    // Set up containers and adapters
+
+    var DataAdapter = this.options.get('dataAdapter');
+    this.dataAdapter = new DataAdapter($element, this.options);
+
+    var $container = this.render();
+
+    this._placeContainer($container);
+
+    var SelectionAdapter = this.options.get('selectionAdapter');
+    this.selection = new SelectionAdapter($element, this.options);
+    this.$selection = this.selection.render();
+
+    this.selection.position(this.$selection, $container);
+
+    var DropdownAdapter = this.options.get('dropdownAdapter');
+    this.dropdown = new DropdownAdapter($element, this.options);
+    this.$dropdown = this.dropdown.render();
+
+    this.dropdown.position(this.$dropdown, $container);
+
+    var ResultsAdapter = this.options.get('resultsAdapter');
+    this.results = new ResultsAdapter($element, this.options, this.dataAdapter);
+    this.$results = this.results.render();
+
+    this.results.position(this.$results, this.$dropdown);
+
+    // Bind events
+
+    var self = this;
+
+    // Bind the container to all of the adapters
+    this._bindAdapters();
+
+    // Register any DOM event handlers
+    this._registerDomEvents();
+
+    // Register any internal event handlers
+    this._registerDataEvents();
+    this._registerSelectionEvents();
+    this._registerDropdownEvents();
+    this._registerResultsEvents();
+    this._registerEvents();
+
+    // Set the initial state
+    this.dataAdapter.current(function (initialData) {
+      self.trigger('selection:update', {
+        data: initialData
+      });
+    });
+
+    // Hide the original select
+    $element.addClass('select2-hidden-accessible');
+    $element.attr('aria-hidden', 'true');
+
+    // Synchronize any monitored attributes
+    this._syncAttributes();
+
+    Utils.StoreData($element[0], 'select2', this);
+
+    // Ensure backwards compatibility with $element.data('select2').
+    $element.data('select2', this);
+  };
+
+  Utils.Extend(Select2, Utils.Observable);
+
+  Select2.prototype._generateId = function ($element) {
+    var id = '';
+
+    if ($element.attr('id') != null) {
+      id = $element.attr('id');
+    } else if ($element.attr('name') != null) {
+      id = $element.attr('name') + '-' + Utils.generateChars(2);
+    } else {
+      id = Utils.generateChars(4);
+    }
+
+    id = id.replace(/(:|\.|\[|\]|,)/g, '');
+    id = 'select2-' + id;
+
+    return id;
+  };
+
+  Select2.prototype._placeContainer = function ($container) {
+    $container.insertAfter(this.$element);
+
+    var width = this._resolveWidth(this.$element, this.options.get('width'));
+
+    if (width != null) {
+      $container.css('width', width);
+    }
+  };
+
+  Select2.prototype._resolveWidth = function ($element, method) {
+    var WIDTH = /^width:(([-+]?([0-9]*\.)?[0-9]+)(px|em|ex|%|in|cm|mm|pt|pc))/i;
+
+    if (method == 'resolve') {
+      var styleWidth = this._resolveWidth($element, 'style');
+
+      if (styleWidth != null) {
+        return styleWidth;
+      }
+
+      return this._resolveWidth($element, 'element');
+    }
+
+    if (method == 'element') {
+      var elementWidth = $element.outerWidth(false);
+
+      if (elementWidth <= 0) {
+        return 'auto';
+      }
+
+      return elementWidth + 'px';
+    }
+
+    if (method == 'style') {
+      var style = $element.attr('style');
+
+      if (typeof(style) !== 'string') {
+        return null;
+      }
+
+      var attrs = style.split(';');
+
+      for (var i = 0, l = attrs.length; i < l; i = i + 1) {
+        var attr = attrs[i].replace(/\s/g, '');
+        var matches = attr.match(WIDTH);
+
+        if (matches !== null && matches.length >= 1) {
+          return matches[1];
+        }
+      }
+
+      return null;
+    }
+
+    if (method == 'computedstyle') {
+      var computedStyle = window.getComputedStyle($element[0]);
+
+      return computedStyle.width;
+    }
+
+    return method;
+  };
+
+  Select2.prototype._bindAdapters = function () {
+    this.dataAdapter.bind(this, this.$container);
+    this.selection.bind(this, this.$container);
+
+    this.dropdown.bind(this, this.$container);
+    this.results.bind(this, this.$container);
+  };
+
+  Select2.prototype._registerDomEvents = function () {
+    var self = this;
+
+    this.$element.on('change.select2', function () {
+      self.dataAdapter.current(function (data) {
+        self.trigger('selection:update', {
+          data: data
+        });
+      });
+    });
+
+    this.$element.on('focus.select2', function (evt) {
+      self.trigger('focus', evt);
+    });
+
+    this._syncA = Utils.bind(this._syncAttributes, this);
+    this._syncS = Utils.bind(this._syncSubtree, this);
+
+    if (this.$element[0].attachEvent) {
+      this.$element[0].attachEvent('onpropertychange', this._syncA);
+    }
+
+    var observer = window.MutationObserver ||
+      window.WebKitMutationObserver ||
+      window.MozMutationObserver
+    ;
+
+    if (observer != null) {
+      this._observer = new observer(function (mutations) {
+        $.each(mutations, self._syncA);
+        $.each(mutations, self._syncS);
+      });
+      this._observer.observe(this.$element[0], {
+        attributes: true,
+        childList: true,
+        subtree: false
+      });
+    } else if (this.$element[0].addEventListener) {
+      this.$element[0].addEventListener(
+        'DOMAttrModified',
+        self._syncA,
+        false
+      );
+      this.$element[0].addEventListener(
+        'DOMNodeInserted',
+        self._syncS,
+        false
+      );
+      this.$element[0].addEventListener(
+        'DOMNodeRemoved',
+        self._syncS,
+        false
+      );
+    }
+  };
+
+  Select2.prototype._registerDataEvents = function () {
+    var self = this;
+
+    this.dataAdapter.on('*', function (name, params) {
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerSelectionEvents = function () {
+    var self = this;
+    var nonRelayEvents = ['toggle', 'focus'];
+
+    this.selection.on('toggle', function () {
+      self.toggleDropdown();
+    });
+
+    this.selection.on('focus', function (params) {
+      self.focus(params);
+    });
+
+    this.selection.on('*', function (name, params) {
+      if ($.inArray(name, nonRelayEvents) !== -1) {
+        return;
+      }
+
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerDropdownEvents = function () {
+    var self = this;
+
+    this.dropdown.on('*', function (name, params) {
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerResultsEvents = function () {
+    var self = this;
+
+    this.results.on('*', function (name, params) {
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerEvents = function () {
+    var self = this;
+
+    this.on('open', function () {
+      self.$container.addClass('select2-container--open');
+    });
+
+    this.on('close', function () {
+      self.$container.removeClass('select2-container--open');
+    });
+
+    this.on('enable', function () {
+      self.$container.removeClass('select2-container--disabled');
+    });
+
+    this.on('disable', function () {
+      self.$container.addClass('select2-container--disabled');
+    });
+
+    this.on('blur', function () {
+      self.$container.removeClass('select2-container--focus');
+    });
+
+    this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open', {});
+      }
+
+      this.dataAdapter.query(params, function (data) {
+        self.trigger('results:all', {
+          data: data,
+          query: params
+        });
+      });
+    });
+
+    this.on('query:append', function (params) {
+      this.dataAdapter.query(params, function (data) {
+        self.trigger('results:append', {
+          data: data,
+          query: params
+        });
+      });
+    });
+
+    this.on('keypress', function (evt) {
+      var key = evt.which;
+
+      if (self.isOpen()) {
+        if (key === KEYS.ESC || key === KEYS.TAB ||
+            (key === KEYS.UP && evt.altKey)) {
+          self.close();
+
+          evt.preventDefault();
+        } else if (key === KEYS.ENTER) {
+          self.trigger('results:select', {});
+
+          evt.preventDefault();
+        } else if ((key === KEYS.SPACE && evt.ctrlKey)) {
+          self.trigger('results:toggle', {});
+
+          evt.preventDefault();
+        } else if (key === KEYS.UP) {
+          self.trigger('results:previous', {});
+
+          evt.preventDefault();
+        } else if (key === KEYS.DOWN) {
+          self.trigger('results:next', {});
+
+          evt.preventDefault();
+        }
+      } else {
+        if (key === KEYS.ENTER || key === KEYS.SPACE ||
+            (key === KEYS.DOWN && evt.altKey)) {
+          self.open();
+
+          evt.preventDefault();
+        }
+      }
+    });
+  };
+
+  Select2.prototype._syncAttributes = function () {
+    this.options.set('disabled', this.$element.prop('disabled'));
+
+    if (this.options.get('disabled')) {
+      if (this.isOpen()) {
+        this.close();
+      }
+
+      this.trigger('disable', {});
+    } else {
+      this.trigger('enable', {});
+    }
+  };
+
+  Select2.prototype._syncSubtree = function (evt, mutations) {
+    var changed = false;
+    var self = this;
+
+    // Ignore any mutation events raised for elements that aren't options or
+    // optgroups. This handles the case when the select element is destroyed
+    if (
+      evt && evt.target && (
+        evt.target.nodeName !== 'OPTION' && evt.target.nodeName !== 'OPTGROUP'
+      )
+    ) {
+      return;
+    }
+
+    if (!mutations) {
+      // If mutation events aren't supported, then we can only assume that the
+      // change affected the selections
+      changed = true;
+    } else if (mutations.addedNodes && mutations.addedNodes.length > 0) {
+      for (var n = 0; n < mutations.addedNodes.length; n++) {
+        var node = mutations.addedNodes[n];
+
+        if (node.selected) {
+          changed = true;
+        }
+      }
+    } else if (mutations.removedNodes && mutations.removedNodes.length > 0) {
+      changed = true;
+    }
+
+    // Only re-pull the data if we think there is a change
+    if (changed) {
+      this.dataAdapter.current(function (currentData) {
+        self.trigger('selection:update', {
+          data: currentData
+        });
+      });
+    }
+  };
+
+  /**
+   * Override the trigger method to automatically trigger pre-events when
+   * there are events that can be prevented.
+   */
+  Select2.prototype.trigger = function (name, args) {
+    var actualTrigger = Select2.__super__.trigger;
+    var preTriggerMap = {
+      'open': 'opening',
+      'close': 'closing',
+      'select': 'selecting',
+      'unselect': 'unselecting',
+      'clear': 'clearing'
+    };
+
+    if (args === undefined) {
+      args = {};
+    }
+
+    if (name in preTriggerMap) {
+      var preTriggerName = preTriggerMap[name];
+      var preTriggerArgs = {
+        prevented: false,
+        name: name,
+        args: args
+      };
+
+      actualTrigger.call(this, preTriggerName, preTriggerArgs);
+
+      if (preTriggerArgs.prevented) {
+        args.prevented = true;
+
+        return;
+      }
+    }
+
+    actualTrigger.call(this, name, args);
+  };
+
+  Select2.prototype.toggleDropdown = function () {
+    if (this.options.get('disabled')) {
+      return;
+    }
+
+    if (this.isOpen()) {
+      this.close();
+    } else {
+      this.open();
+    }
+  };
+
+  Select2.prototype.open = function () {
+    if (this.isOpen()) {
+      return;
+    }
+
+    this.trigger('query', {});
+  };
+
+  Select2.prototype.close = function () {
+    if (!this.isOpen()) {
+      return;
+    }
+
+    this.trigger('close', {});
+  };
+
+  Select2.prototype.isOpen = function () {
+    return this.$container.hasClass('select2-container--open');
+  };
+
+  Select2.prototype.hasFocus = function () {
+    return this.$container.hasClass('select2-container--focus');
+  };
+
+  Select2.prototype.focus = function (data) {
+    // No need to re-trigger focus events if we are already focused
+    if (this.hasFocus()) {
+      return;
+    }
+
+    this.$container.addClass('select2-container--focus');
+    this.trigger('focus', {});
+  };
+
+  Select2.prototype.enable = function (args) {
+    if (this.options.get('debug') && window.console && console.warn) {
+      console.warn(
+        'Select2: The `select2("enable")` method has been deprecated and will' +
+        ' be removed in later Select2 versions. Use $element.prop("disabled")' +
+        ' instead.'
+      );
+    }
+
+    if (args == null || args.length === 0) {
+      args = [true];
+    }
+
+    var disabled = !args[0];
+
+    this.$element.prop('disabled', disabled);
+  };
+
+  Select2.prototype.data = function () {
+    if (this.options.get('debug') &&
+        arguments.length > 0 && window.console && console.warn) {
+      console.warn(
+        'Select2: Data can no longer be set using `select2("data")`. You ' +
+        'should consider setting the value instead using `$element.val()`.'
+      );
+    }
+
+    var data = [];
+
+    this.dataAdapter.current(function (currentData) {
+      data = currentData;
+    });
+
+    return data;
+  };
+
+  Select2.prototype.val = function (args) {
+    if (this.options.get('debug') && window.console && console.warn) {
+      console.warn(
+        'Select2: The `select2("val")` method has been deprecated and will be' +
+        ' removed in later Select2 versions. Use $element.val() instead.'
+      );
+    }
+
+    if (args == null || args.length === 0) {
+      return this.$element.val();
+    }
+
+    var newVal = args[0];
+
+    if ($.isArray(newVal)) {
+      newVal = $.map(newVal, function (obj) {
+        return obj.toString();
+      });
+    }
+
+    this.$element.val(newVal).trigger('change');
+  };
+
+  Select2.prototype.destroy = function () {
+    this.$container.remove();
+
+    if (this.$element[0].detachEvent) {
+      this.$element[0].detachEvent('onpropertychange', this._syncA);
+    }
+
+    if (this._observer != null) {
+      this._observer.disconnect();
+      this._observer = null;
+    } else if (this.$element[0].removeEventListener) {
+      this.$element[0]
+        .removeEventListener('DOMAttrModified', this._syncA, false);
+      this.$element[0]
+        .removeEventListener('DOMNodeInserted', this._syncS, false);
+      this.$element[0]
+        .removeEventListener('DOMNodeRemoved', this._syncS, false);
+    }
+
+    this._syncA = null;
+    this._syncS = null;
+
+    this.$element.off('.select2');
+    this.$element.attr('tabindex',
+    Utils.GetData(this.$element[0], 'old-tabindex'));
+
+    this.$element.removeClass('select2-hidden-accessible');
+    this.$element.attr('aria-hidden', 'false');
+    Utils.RemoveData(this.$element[0]);
+    this.$element.removeData('select2');
+
+    this.dataAdapter.destroy();
+    this.selection.destroy();
+    this.dropdown.destroy();
+    this.results.destroy();
+
+    this.dataAdapter = null;
+    this.selection = null;
+    this.dropdown = null;
+    this.results = null;
+  };
+
+  Select2.prototype.render = function () {
+    var $container = $(
+      '<span class="select2 select2-container">' +
+        '<span class="selection"></span>' +
+        '<span class="dropdown-wrapper" aria-hidden="true"></span>' +
+      '</span>'
+    );
+
+    $container.attr('dir', this.options.get('dir'));
+
+    this.$container = $container;
+
+    this.$container.addClass('select2-container--' + this.options.get('theme'));
+
+    Utils.StoreData($container[0], 'element', this.$element);
+
+    return $container;
+  };
+
+  return Select2;
+});
+
+S2.define('jquery-mousewheel',[
+  'jquery'
+], function ($) {
+  // Used to shim jQuery.mousewheel for non-full builds.
+  return $;
+});
+
+S2.define('jquery.select2',[
+  'jquery',
+  'jquery-mousewheel',
+
+  './select2/core',
+  './select2/defaults',
+  './select2/utils'
+], function ($, _, Select2, Defaults, Utils) {
+  if ($.fn.select2 == null) {
+    // All methods that should return the element
+    var thisMethods = ['open', 'close', 'destroy'];
+
+    $.fn.select2 = function (options) {
+      options = options || {};
+
+      if (typeof options === 'object') {
+        this.each(function () {
+          var instanceOptions = $.extend(true, {}, options);
+
+          var instance = new Select2($(this), instanceOptions);
+        });
+
+        return this;
+      } else if (typeof options === 'string') {
+        var ret;
+        var args = Array.prototype.slice.call(arguments, 1);
+
+        this.each(function () {
+          var instance = Utils.GetData(this, 'select2');
+
+          if (instance == null && window.console && console.error) {
+            console.error(
+              'The select2(\'' + options + '\') method was called on an ' +
+              'element that is not using Select2.'
+            );
+          }
+
+          ret = instance[options].apply(instance, args);
+        });
+
+        // Check if we should be returning `this`
+        if ($.inArray(options, thisMethods) > -1) {
+          return this;
+        }
+
+        return ret;
+      } else {
+        throw new Error('Invalid arguments for Select2: ' + options);
+      }
+    };
+  }
+
+  if ($.fn.select2.defaults == null) {
+    $.fn.select2.defaults = Defaults;
+  }
+
+  return Select2;
+});
+
+  // Return the AMD loader configuration so it can be used outside of this file
+  return {
+    define: S2.define,
+    require: S2.require
+  };
+}());
+
+  // Autoload the jQuery bindings
+  // We know that all of the modules exist above this, so we're safe
+  var select2 = S2.require('jquery.select2');
+
+  // Hold the AMD module references on the jQuery function that was just loaded
+  // This allows Select2 to use the internal loader outside of this file, such
+  // as in the language files.
+  jQuery.fn.select2.amd = S2;
+
+  // Return the Select2 instance for anyone who is importing it.
+  return select2;
+}));
+//! moment.js
+//! version : 2.10.6
+//! authors : Tim Wood, Iskren Chernev, Moment.js contributors
+//! license : MIT
+//! momentjs.com
+!function(a,b){"object"==typeof exports&&"undefined"!=typeof module?module.exports=b():"function"==typeof define&&define.amd?define(b):a.moment=b()}(this,function(){"use strict";function a(){return Hc.apply(null,arguments)}function b(a){Hc=a}function c(a){return"[object Array]"===Object.prototype.toString.call(a)}function d(a){return a instanceof Date||"[object Date]"===Object.prototype.toString.call(a)}function e(a,b){var c,d=[];for(c=0;c<a.length;++c)d.push(b(a[c],c));return d}function f(a,b){return Object.prototype.hasOwnProperty.call(a,b)}function g(a,b){for(var c in b)f(b,c)&&(a[c]=b[c]);return f(b,"toString")&&(a.toString=b.toString),f(b,"valueOf")&&(a.valueOf=b.valueOf),a}function h(a,b,c,d){return Ca(a,b,c,d,!0).utc()}function i(){return{empty:!1,unusedTokens:[],unusedInput:[],overflow:-2,charsLeftOver:0,nullInput:!1,invalidMonth:null,invalidFormat:!1,userInvalidated:!1,iso:!1}}function j(a){return null==a._pf&&(a._pf=i()),a._pf}function k(a){if(null==a._isValid){var b=j(a);a._isValid=!(isNaN(a._d.getTime())||!(b.overflow<0)||b.empty||b.invalidMonth||b.invalidWeekday||b.nullInput||b.invalidFormat||b.userInvalidated),a._strict&&(a._isValid=a._isValid&&0===b.charsLeftOver&&0===b.unusedTokens.length&&void 0===b.bigHour)}return a._isValid}function l(a){var b=h(NaN);return null!=a?g(j(b),a):j(b).userInvalidated=!0,b}function m(a,b){var c,d,e;if("undefined"!=typeof b._isAMomentObject&&(a._isAMomentObject=b._isAMomentObject),"undefined"!=typeof b._i&&(a._i=b._i),"undefined"!=typeof b._f&&(a._f=b._f),"undefined"!=typeof b._l&&(a._l=b._l),"undefined"!=typeof b._strict&&(a._strict=b._strict),"undefined"!=typeof b._tzm&&(a._tzm=b._tzm),"undefined"!=typeof b._isUTC&&(a._isUTC=b._isUTC),"undefined"!=typeof b._offset&&(a._offset=b._offset),"undefined"!=typeof b._pf&&(a._pf=j(b)),"undefined"!=typeof b._locale&&(a._locale=b._locale),Jc.length>0)for(c in Jc)d=Jc[c],e=b[d],"undefined"!=typeof e&&(a[d]=e);return a}function n(b){m(this,b),this._d=new Date(null!=b._d?b._d.getTime():NaN),Kc===!1&&(Kc=!0,a.updateOffset(this),Kc=!1)}function o(a){return a instanceof n||null!=a&&null!=a._isAMomentObject}function p(a){return 0>a?Math.ceil(a):Math.floor(a)}function q(a){var b=+a,c=0;return 0!==b&&isFinite(b)&&(c=p(b)),c}function r(a,b,c){var d,e=Math.min(a.length,b.length),f=Math.abs(a.length-b.length),g=0;for(d=0;e>d;d++)(c&&a[d]!==b[d]||!c&&q(a[d])!==q(b[d]))&&g++;return g+f}function s(){}function t(a){return a?a.toLowerCase().replace("_","-"):a}function u(a){for(var b,c,d,e,f=0;f<a.length;){for(e=t(a[f]).split("-"),b=e.length,c=t(a[f+1]),c=c?c.split("-"):null;b>0;){if(d=v(e.slice(0,b).join("-")))return d;if(c&&c.length>=b&&r(e,c,!0)>=b-1)break;b--}f++}return null}function v(a){var b=null;if(!Lc[a]&&"undefined"!=typeof module&&module&&module.exports)try{b=Ic._abbr,require("./locale/"+a),w(b)}catch(c){}return Lc[a]}function w(a,b){var c;return a&&(c="undefined"==typeof b?y(a):x(a,b),c&&(Ic=c)),Ic._abbr}function x(a,b){return null!==b?(b.abbr=a,Lc[a]=Lc[a]||new s,Lc[a].set(b),w(a),Lc[a]):(delete Lc[a],null)}function y(a){var b;if(a&&a._locale&&a._locale._abbr&&(a=a._locale._abbr),!a)return Ic;if(!c(a)){if(b=v(a))return b;a=[a]}return u(a)}function z(a,b){var c=a.toLowerCase();Mc[c]=Mc[c+"s"]=Mc[b]=a}function A(a){return"string"==typeof a?Mc[a]||Mc[a.toLowerCase()]:void 0}function B(a){var b,c,d={};for(c in a)f(a,c)&&(b=A(c),b&&(d[b]=a[c]));return d}function C(b,c){return function(d){return null!=d?(E(this,b,d),a.updateOffset(this,c),this):D(this,b)}}function D(a,b){return a._d["get"+(a._isUTC?"UTC":"")+b]()}function E(a,b,c){return a._d["set"+(a._isUTC?"UTC":"")+b](c)}function F(a,b){var c;if("object"==typeof a)for(c in a)this.set(c,a[c]);else if(a=A(a),"function"==typeof this[a])return this[a](b);return this}function G(a,b,c){var d=""+Math.abs(a),e=b-d.length,f=a>=0;return(f?c?"+":"":"-")+Math.pow(10,Math.max(0,e)).toString().substr(1)+d}function H(a,b,c,d){var e=d;"string"==typeof d&&(e=function(){return this[d]()}),a&&(Qc[a]=e),b&&(Qc[b[0]]=function(){return G(e.apply(this,arguments),b[1],b[2])}),c&&(Qc[c]=function(){return this.localeData().ordinal(e.apply(this,arguments),a)})}function I(a){return a.match(/\[[\s\S]/)?a.replace(/^\[|\]$/g,""):a.replace(/\\/g,"")}function J(a){var b,c,d=a.match(Nc);for(b=0,c=d.length;c>b;b++)Qc[d[b]]?d[b]=Qc[d[b]]:d[b]=I(d[b]);return function(e){var f="";for(b=0;c>b;b++)f+=d[b]instanceof Function?d[b].call(e,a):d[b];return f}}function K(a,b){return a.isValid()?(b=L(b,a.localeData()),Pc[b]=Pc[b]||J(b),Pc[b](a)):a.localeData().invalidDate()}function L(a,b){function c(a){return b.longDateFormat(a)||a}var d=5;for(Oc.lastIndex=0;d>=0&&Oc.test(a);)a=a.replace(Oc,c),Oc.lastIndex=0,d-=1;return a}function M(a){return"function"==typeof a&&"[object Function]"===Object.prototype.toString.call(a)}function N(a,b,c){dd[a]=M(b)?b:function(a){return a&&c?c:b}}function O(a,b){return f(dd,a)?dd[a](b._strict,b._locale):new RegExp(P(a))}function P(a){return a.replace("\\","").replace(/\\(\[)|\\(\])|\[([^\]\[]*)\]|\\(.)/g,function(a,b,c,d,e){return b||c||d||e}).replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&")}function Q(a,b){var c,d=b;for("string"==typeof a&&(a=[a]),"number"==typeof b&&(d=function(a,c){c[b]=q(a)}),c=0;c<a.length;c++)ed[a[c]]=d}function R(a,b){Q(a,function(a,c,d,e){d._w=d._w||{},b(a,d._w,d,e)})}function S(a,b,c){null!=b&&f(ed,a)&&ed[a](b,c._a,c,a)}function T(a,b){return new Date(Date.UTC(a,b+1,0)).getUTCDate()}function U(a){return this._months[a.month()]}function V(a){return this._monthsShort[a.month()]}function W(a,b,c){var d,e,f;for(this._monthsParse||(this._monthsParse=[],this._longMonthsParse=[],this._shortMonthsParse=[]),d=0;12>d;d++){if(e=h([2e3,d]),c&&!this._longMonthsParse[d]&&(this._longMonthsParse[d]=new RegExp("^"+this.months(e,"").replace(".","")+"$","i"),this._shortMonthsParse[d]=new RegExp("^"+this.monthsShort(e,"").replace(".","")+"$","i")),c||this._monthsParse[d]||(f="^"+this.months(e,"")+"|^"+this.monthsShort(e,""),this._monthsParse[d]=new RegExp(f.replace(".",""),"i")),c&&"MMMM"===b&&this._longMonthsParse[d].test(a))return d;if(c&&"MMM"===b&&this._shortMonthsParse[d].test(a))return d;if(!c&&this._monthsParse[d].test(a))return d}}function X(a,b){var c;return"string"==typeof b&&(b=a.localeData().monthsParse(b),"number"!=typeof b)?a:(c=Math.min(a.date(),T(a.year(),b)),a._d["set"+(a._isUTC?"UTC":"")+"Month"](b,c),a)}function Y(b){return null!=b?(X(this,b),a.updateOffset(this,!0),this):D(this,"Month")}function Z(){return T(this.year(),this.month())}function $(a){var b,c=a._a;return c&&-2===j(a).overflow&&(b=c[gd]<0||c[gd]>11?gd:c[hd]<1||c[hd]>T(c[fd],c[gd])?hd:c[id]<0||c[id]>24||24===c[id]&&(0!==c[jd]||0!==c[kd]||0!==c[ld])?id:c[jd]<0||c[jd]>59?jd:c[kd]<0||c[kd]>59?kd:c[ld]<0||c[ld]>999?ld:-1,j(a)._overflowDayOfYear&&(fd>b||b>hd)&&(b=hd),j(a).overflow=b),a}function _(b){a.suppressDeprecationWarnings===!1&&"undefined"!=typeof console&&console.warn&&console.warn("Deprecation warning: "+b)}function aa(a,b){var c=!0;return g(function(){return c&&(_(a+"\n"+(new Error).stack),c=!1),b.apply(this,arguments)},b)}function ba(a,b){od[a]||(_(b),od[a]=!0)}function ca(a){var b,c,d=a._i,e=pd.exec(d);if(e){for(j(a).iso=!0,b=0,c=qd.length;c>b;b++)if(qd[b][1].exec(d)){a._f=qd[b][0];break}for(b=0,c=rd.length;c>b;b++)if(rd[b][1].exec(d)){a._f+=(e[6]||" ")+rd[b][0];break}d.match(ad)&&(a._f+="Z"),va(a)}else a._isValid=!1}function da(b){var c=sd.exec(b._i);return null!==c?void(b._d=new Date(+c[1])):(ca(b),void(b._isValid===!1&&(delete b._isValid,a.createFromInputFallback(b))))}function ea(a,b,c,d,e,f,g){var h=new Date(a,b,c,d,e,f,g);return 1970>a&&h.setFullYear(a),h}function fa(a){var b=new Date(Date.UTC.apply(null,arguments));return 1970>a&&b.setUTCFullYear(a),b}function ga(a){return ha(a)?366:365}function ha(a){return a%4===0&&a%100!==0||a%400===0}function ia(){return ha(this.year())}function ja(a,b,c){var d,e=c-b,f=c-a.day();return f>e&&(f-=7),e-7>f&&(f+=7),d=Da(a).add(f,"d"),{week:Math.ceil(d.dayOfYear()/7),year:d.year()}}function ka(a){return ja(a,this._week.dow,this._week.doy).week}function la(){return this._week.dow}function ma(){return this._week.doy}function na(a){var b=this.localeData().week(this);return null==a?b:this.add(7*(a-b),"d")}function oa(a){var b=ja(this,1,4).week;return null==a?b:this.add(7*(a-b),"d")}function pa(a,b,c,d,e){var f,g=6+e-d,h=fa(a,0,1+g),i=h.getUTCDay();return e>i&&(i+=7),c=null!=c?1*c:e,f=1+g+7*(b-1)-i+c,{year:f>0?a:a-1,dayOfYear:f>0?f:ga(a-1)+f}}function qa(a){var b=Math.round((this.clone().startOf("day")-this.clone().startOf("year"))/864e5)+1;return null==a?b:this.add(a-b,"d")}function ra(a,b,c){return null!=a?a:null!=b?b:c}function sa(a){var b=new Date;return a._useUTC?[b.getUTCFullYear(),b.getUTCMonth(),b.getUTCDate()]:[b.getFullYear(),b.getMonth(),b.getDate()]}function ta(a){var b,c,d,e,f=[];if(!a._d){for(d=sa(a),a._w&&null==a._a[hd]&&null==a._a[gd]&&ua(a),a._dayOfYear&&(e=ra(a._a[fd],d[fd]),a._dayOfYear>ga(e)&&(j(a)._overflowDayOfYear=!0),c=fa(e,0,a._dayOfYear),a._a[gd]=c.getUTCMonth(),a._a[hd]=c.getUTCDate()),b=0;3>b&&null==a._a[b];++b)a._a[b]=f[b]=d[b];for(;7>b;b++)a._a[b]=f[b]=null==a._a[b]?2===b?1:0:a._a[b];24===a._a[id]&&0===a._a[jd]&&0===a._a[kd]&&0===a._a[ld]&&(a._nextDay=!0,a._a[id]=0),a._d=(a._useUTC?fa:ea).apply(null,f),null!=a._tzm&&a._d.setUTCMinutes(a._d.getUTCMinutes()-a._tzm),a._nextDay&&(a._a[id]=24)}}function ua(a){var b,c,d,e,f,g,h;b=a._w,null!=b.GG||null!=b.W||null!=b.E?(f=1,g=4,c=ra(b.GG,a._a[fd],ja(Da(),1,4).year),d=ra(b.W,1),e=ra(b.E,1)):(f=a._locale._week.dow,g=a._locale._week.doy,c=ra(b.gg,a._a[fd],ja(Da(),f,g).year),d=ra(b.w,1),null!=b.d?(e=b.d,f>e&&++d):e=null!=b.e?b.e+f:f),h=pa(c,d,e,g,f),a._a[fd]=h.year,a._dayOfYear=h.dayOfYear}function va(b){if(b._f===a.ISO_8601)return void ca(b);b._a=[],j(b).empty=!0;var c,d,e,f,g,h=""+b._i,i=h.length,k=0;for(e=L(b._f,b._locale).match(Nc)||[],c=0;c<e.length;c++)f=e[c],d=(h.match(O(f,b))||[])[0],d&&(g=h.substr(0,h.indexOf(d)),g.length>0&&j(b).unusedInput.push(g),h=h.slice(h.indexOf(d)+d.length),k+=d.length),Qc[f]?(d?j(b).empty=!1:j(b).unusedTokens.push(f),S(f,d,b)):b._strict&&!d&&j(b).unusedTokens.push(f);j(b).charsLeftOver=i-k,h.length>0&&j(b).unusedInput.push(h),j(b).bigHour===!0&&b._a[id]<=12&&b._a[id]>0&&(j(b).bigHour=void 0),b._a[id]=wa(b._locale,b._a[id],b._meridiem),ta(b),$(b)}function wa(a,b,c){var d;return null==c?b:null!=a.meridiemHour?a.meridiemHour(b,c):null!=a.isPM?(d=a.isPM(c),d&&12>b&&(b+=12),d||12!==b||(b=0),b):b}function xa(a){var b,c,d,e,f;if(0===a._f.length)return j(a).invalidFormat=!0,void(a._d=new Date(NaN));for(e=0;e<a._f.length;e++)f=0,b=m({},a),null!=a._useUTC&&(b._useUTC=a._useUTC),b._f=a._f[e],va(b),k(b)&&(f+=j(b).charsLeftOver,f+=10*j(b).unusedTokens.length,j(b).score=f,(null==d||d>f)&&(d=f,c=b));g(a,c||b)}function ya(a){if(!a._d){var b=B(a._i);a._a=[b.year,b.month,b.day||b.date,b.hour,b.minute,b.second,b.millisecond],ta(a)}}function za(a){var b=new n($(Aa(a)));return b._nextDay&&(b.add(1,"d"),b._nextDay=void 0),b}function Aa(a){var b=a._i,e=a._f;return a._locale=a._locale||y(a._l),null===b||void 0===e&&""===b?l({nullInput:!0}):("string"==typeof b&&(a._i=b=a._locale.preparse(b)),o(b)?new n($(b)):(c(e)?xa(a):e?va(a):d(b)?a._d=b:Ba(a),a))}function Ba(b){var f=b._i;void 0===f?b._d=new Date:d(f)?b._d=new Date(+f):"string"==typeof f?da(b):c(f)?(b._a=e(f.slice(0),function(a){return parseInt(a,10)}),ta(b)):"object"==typeof f?ya(b):"number"==typeof f?b._d=new Date(f):a.createFromInputFallback(b)}function Ca(a,b,c,d,e){var f={};return"boolean"==typeof c&&(d=c,c=void 0),f._isAMomentObject=!0,f._useUTC=f._isUTC=e,f._l=c,f._i=a,f._f=b,f._strict=d,za(f)}function Da(a,b,c,d){return Ca(a,b,c,d,!1)}function Ea(a,b){var d,e;if(1===b.length&&c(b[0])&&(b=b[0]),!b.length)return Da();for(d=b[0],e=1;e<b.length;++e)(!b[e].isValid()||b[e][a](d))&&(d=b[e]);return d}function Fa(){var a=[].slice.call(arguments,0);return Ea("isBefore",a)}function Ga(){var a=[].slice.call(arguments,0);return Ea("isAfter",a)}function Ha(a){var b=B(a),c=b.year||0,d=b.quarter||0,e=b.month||0,f=b.week||0,g=b.day||0,h=b.hour||0,i=b.minute||0,j=b.second||0,k=b.millisecond||0;this._milliseconds=+k+1e3*j+6e4*i+36e5*h,this._days=+g+7*f,this._months=+e+3*d+12*c,this._data={},this._locale=y(),this._bubble()}function Ia(a){return a instanceof Ha}function Ja(a,b){H(a,0,0,function(){var a=this.utcOffset(),c="+";return 0>a&&(a=-a,c="-"),c+G(~~(a/60),2)+b+G(~~a%60,2)})}function Ka(a){var b=(a||"").match(ad)||[],c=b[b.length-1]||[],d=(c+"").match(xd)||["-",0,0],e=+(60*d[1])+q(d[2]);return"+"===d[0]?e:-e}function La(b,c){var e,f;return c._isUTC?(e=c.clone(),f=(o(b)||d(b)?+b:+Da(b))-+e,e._d.setTime(+e._d+f),a.updateOffset(e,!1),e):Da(b).local()}function Ma(a){return 15*-Math.round(a._d.getTimezoneOffset()/15)}function Na(b,c){var d,e=this._offset||0;return null!=b?("string"==typeof b&&(b=Ka(b)),Math.abs(b)<16&&(b=60*b),!this._isUTC&&c&&(d=Ma(this)),this._offset=b,this._isUTC=!0,null!=d&&this.add(d,"m"),e!==b&&(!c||this._changeInProgress?bb(this,Ya(b-e,"m"),1,!1):this._changeInProgress||(this._changeInProgress=!0,a.updateOffset(this,!0),this._changeInProgress=null)),this):this._isUTC?e:Ma(this)}function Oa(a,b){return null!=a?("string"!=typeof a&&(a=-a),this.utcOffset(a,b),this):-this.utcOffset()}function Pa(a){return this.utcOffset(0,a)}function Qa(a){return this._isUTC&&(this.utcOffset(0,a),this._isUTC=!1,a&&this.subtract(Ma(this),"m")),this}function Ra(){return this._tzm?this.utcOffset(this._tzm):"string"==typeof this._i&&this.utcOffset(Ka(this._i)),this}function Sa(a){return a=a?Da(a).utcOffset():0,(this.utcOffset()-a)%60===0}function Ta(){return this.utcOffset()>this.clone().month(0).utcOffset()||this.utcOffset()>this.clone().month(5).utcOffset()}function Ua(){if("undefined"!=typeof this._isDSTShifted)return this._isDSTShifted;var a={};if(m(a,this),a=Aa(a),a._a){var b=a._isUTC?h(a._a):Da(a._a);this._isDSTShifted=this.isValid()&&r(a._a,b.toArray())>0}else this._isDSTShifted=!1;return this._isDSTShifted}function Va(){return!this._isUTC}function Wa(){return this._isUTC}function Xa(){return this._isUTC&&0===this._offset}function Ya(a,b){var c,d,e,g=a,h=null;return Ia(a)?g={ms:a._milliseconds,d:a._days,M:a._months}:"number"==typeof a?(g={},b?g[b]=a:g.milliseconds=a):(h=yd.exec(a))?(c="-"===h[1]?-1:1,g={y:0,d:q(h[hd])*c,h:q(h[id])*c,m:q(h[jd])*c,s:q(h[kd])*c,ms:q(h[ld])*c}):(h=zd.exec(a))?(c="-"===h[1]?-1:1,g={y:Za(h[2],c),M:Za(h[3],c),d:Za(h[4],c),h:Za(h[5],c),m:Za(h[6],c),s:Za(h[7],c),w:Za(h[8],c)}):null==g?g={}:"object"==typeof g&&("from"in g||"to"in g)&&(e=_a(Da(g.from),Da(g.to)),g={},g.ms=e.milliseconds,g.M=e.months),d=new Ha(g),Ia(a)&&f(a,"_locale")&&(d._locale=a._locale),d}function Za(a,b){var c=a&&parseFloat(a.replace(",","."));return(isNaN(c)?0:c)*b}function $a(a,b){var c={milliseconds:0,months:0};return c.months=b.month()-a.month()+12*(b.year()-a.year()),a.clone().add(c.months,"M").isAfter(b)&&--c.months,c.milliseconds=+b-+a.clone().add(c.months,"M"),c}function _a(a,b){var c;return b=La(b,a),a.isBefore(b)?c=$a(a,b):(c=$a(b,a),c.milliseconds=-c.milliseconds,c.months=-c.months),c}function ab(a,b){return function(c,d){var e,f;return null===d||isNaN(+d)||(ba(b,"moment()."+b+"(period, number) is deprecated. Please use moment()."+b+"(number, period)."),f=c,c=d,d=f),c="string"==typeof c?+c:c,e=Ya(c,d),bb(this,e,a),this}}function bb(b,c,d,e){var f=c._milliseconds,g=c._days,h=c._months;e=null==e?!0:e,f&&b._d.setTime(+b._d+f*d),g&&E(b,"Date",D(b,"Date")+g*d),h&&X(b,D(b,"Month")+h*d),e&&a.updateOffset(b,g||h)}function cb(a,b){var c=a||Da(),d=La(c,this).startOf("day"),e=this.diff(d,"days",!0),f=-6>e?"sameElse":-1>e?"lastWeek":0>e?"lastDay":1>e?"sameDay":2>e?"nextDay":7>e?"nextWeek":"sameElse";return this.format(b&&b[f]||this.localeData().calendar(f,this,Da(c)))}function db(){return new n(this)}function eb(a,b){var c;return b=A("undefined"!=typeof b?b:"millisecond"),"millisecond"===b?(a=o(a)?a:Da(a),+this>+a):(c=o(a)?+a:+Da(a),c<+this.clone().startOf(b))}function fb(a,b){var c;return b=A("undefined"!=typeof b?b:"millisecond"),"millisecond"===b?(a=o(a)?a:Da(a),+a>+this):(c=o(a)?+a:+Da(a),+this.clone().endOf(b)<c)}function gb(a,b,c){return this.isAfter(a,c)&&this.isBefore(b,c)}function hb(a,b){var c;return b=A(b||"millisecond"),"millisecond"===b?(a=o(a)?a:Da(a),+this===+a):(c=+Da(a),+this.clone().startOf(b)<=c&&c<=+this.clone().endOf(b))}function ib(a,b,c){var d,e,f=La(a,this),g=6e4*(f.utcOffset()-this.utcOffset());return b=A(b),"year"===b||"month"===b||"quarter"===b?(e=jb(this,f),"quarter"===b?e/=3:"year"===b&&(e/=12)):(d=this-f,e="second"===b?d/1e3:"minute"===b?d/6e4:"hour"===b?d/36e5:"day"===b?(d-g)/864e5:"week"===b?(d-g)/6048e5:d),c?e:p(e)}function jb(a,b){var c,d,e=12*(b.year()-a.year())+(b.month()-a.month()),f=a.clone().add(e,"months");return 0>b-f?(c=a.clone().add(e-1,"months"),d=(b-f)/(f-c)):(c=a.clone().add(e+1,"months"),d=(b-f)/(c-f)),-(e+d)}function kb(){return this.clone().locale("en").format("ddd MMM DD YYYY HH:mm:ss [GMT]ZZ")}function lb(){var a=this.clone().utc();return 0<a.year()&&a.year()<=9999?"function"==typeof Date.prototype.toISOString?this.toDate().toISOString():K(a,"YYYY-MM-DD[T]HH:mm:ss.SSS[Z]"):K(a,"YYYYYY-MM-DD[T]HH:mm:ss.SSS[Z]")}function mb(b){var c=K(this,b||a.defaultFormat);return this.localeData().postformat(c)}function nb(a,b){return this.isValid()?Ya({to:this,from:a}).locale(this.locale()).humanize(!b):this.localeData().invalidDate()}function ob(a){return this.from(Da(),a)}function pb(a,b){return this.isValid()?Ya({from:this,to:a}).locale(this.locale()).humanize(!b):this.localeData().invalidDate()}function qb(a){return this.to(Da(),a)}function rb(a){var b;return void 0===a?this._locale._abbr:(b=y(a),null!=b&&(this._locale=b),this)}function sb(){return this._locale}function tb(a){switch(a=A(a)){case"year":this.month(0);case"quarter":case"month":this.date(1);case"week":case"isoWeek":case"day":this.hours(0);case"hour":this.minutes(0);case"minute":this.seconds(0);case"second":this.milliseconds(0)}return"week"===a&&this.weekday(0),"isoWeek"===a&&this.isoWeekday(1),"quarter"===a&&this.month(3*Math.floor(this.month()/3)),this}function ub(a){return a=A(a),void 0===a||"millisecond"===a?this:this.startOf(a).add(1,"isoWeek"===a?"week":a).subtract(1,"ms")}function vb(){return+this._d-6e4*(this._offset||0)}function wb(){return Math.floor(+this/1e3)}function xb(){return this._offset?new Date(+this):this._d}function yb(){var a=this;return[a.year(),a.month(),a.date(),a.hour(),a.minute(),a.second(),a.millisecond()]}function zb(){var a=this;return{years:a.year(),months:a.month(),date:a.date(),hours:a.hours(),minutes:a.minutes(),seconds:a.seconds(),milliseconds:a.milliseconds()}}function Ab(){return k(this)}function Bb(){return g({},j(this))}function Cb(){return j(this).overflow}function Db(a,b){H(0,[a,a.length],0,b)}function Eb(a,b,c){return ja(Da([a,11,31+b-c]),b,c).week}function Fb(a){var b=ja(this,this.localeData()._week.dow,this.localeData()._week.doy).year;return null==a?b:this.add(a-b,"y")}function Gb(a){var b=ja(this,1,4).year;return null==a?b:this.add(a-b,"y")}function Hb(){return Eb(this.year(),1,4)}function Ib(){var a=this.localeData()._week;return Eb(this.year(),a.dow,a.doy)}function Jb(a){return null==a?Math.ceil((this.month()+1)/3):this.month(3*(a-1)+this.month()%3)}function Kb(a,b){return"string"!=typeof a?a:isNaN(a)?(a=b.weekdaysParse(a),"number"==typeof a?a:null):parseInt(a,10)}function Lb(a){return this._weekdays[a.day()]}function Mb(a){return this._weekdaysShort[a.day()]}function Nb(a){return this._weekdaysMin[a.day()]}function Ob(a){var b,c,d;for(this._weekdaysParse=this._weekdaysParse||[],b=0;7>b;b++)if(this._weekdaysParse[b]||(c=Da([2e3,1]).day(b),d="^"+this.weekdays(c,"")+"|^"+this.weekdaysShort(c,"")+"|^"+this.weekdaysMin(c,""),this._weekdaysParse[b]=new RegExp(d.replace(".",""),"i")),this._weekdaysParse[b].test(a))return b}function Pb(a){var b=this._isUTC?this._d.getUTCDay():this._d.getDay();return null!=a?(a=Kb(a,this.localeData()),this.add(a-b,"d")):b}function Qb(a){var b=(this.day()+7-this.localeData()._week.dow)%7;return null==a?b:this.add(a-b,"d")}function Rb(a){return null==a?this.day()||7:this.day(this.day()%7?a:a-7)}function Sb(a,b){H(a,0,0,function(){return this.localeData().meridiem(this.hours(),this.minutes(),b)})}function Tb(a,b){return b._meridiemParse}function Ub(a){return"p"===(a+"").toLowerCase().charAt(0)}function Vb(a,b,c){return a>11?c?"pm":"PM":c?"am":"AM"}function Wb(a,b){b[ld]=q(1e3*("0."+a))}function Xb(){return this._isUTC?"UTC":""}function Yb(){return this._isUTC?"Coordinated Universal Time":""}function Zb(a){return Da(1e3*a)}function $b(){return Da.apply(null,arguments).parseZone()}function _b(a,b,c){var d=this._calendar[a];return"function"==typeof d?d.call(b,c):d}function ac(a){var b=this._longDateFormat[a],c=this._longDateFormat[a.toUpperCase()];return b||!c?b:(this._longDateFormat[a]=c.replace(/MMMM|MM|DD|dddd/g,function(a){return a.slice(1)}),this._longDateFormat[a])}function bc(){return this._invalidDate}function cc(a){return this._ordinal.replace("%d",a)}function dc(a){return a}function ec(a,b,c,d){var e=this._relativeTime[c];return"function"==typeof e?e(a,b,c,d):e.replace(/%d/i,a)}function fc(a,b){var c=this._relativeTime[a>0?"future":"past"];return"function"==typeof c?c(b):c.replace(/%s/i,b)}function gc(a){var b,c;for(c in a)b=a[c],"function"==typeof b?this[c]=b:this["_"+c]=b;this._ordinalParseLenient=new RegExp(this._ordinalParse.source+"|"+/\d{1,2}/.source)}function hc(a,b,c,d){var e=y(),f=h().set(d,b);return e[c](f,a)}function ic(a,b,c,d,e){if("number"==typeof a&&(b=a,a=void 0),a=a||"",null!=b)return hc(a,b,c,e);var f,g=[];for(f=0;d>f;f++)g[f]=hc(a,f,c,e);return g}function jc(a,b){return ic(a,b,"months",12,"month")}function kc(a,b){return ic(a,b,"monthsShort",12,"month")}function lc(a,b){return ic(a,b,"weekdays",7,"day")}function mc(a,b){return ic(a,b,"weekdaysShort",7,"day")}function nc(a,b){return ic(a,b,"weekdaysMin",7,"day")}function oc(){var a=this._data;return this._milliseconds=Wd(this._milliseconds),this._days=Wd(this._days),this._months=Wd(this._months),a.milliseconds=Wd(a.milliseconds),a.seconds=Wd(a.seconds),a.minutes=Wd(a.minutes),a.hours=Wd(a.hours),a.months=Wd(a.months),a.years=Wd(a.years),this}function pc(a,b,c,d){var e=Ya(b,c);return a._milliseconds+=d*e._milliseconds,a._days+=d*e._days,a._months+=d*e._months,a._bubble()}function qc(a,b){return pc(this,a,b,1)}function rc(a,b){return pc(this,a,b,-1)}function sc(a){return 0>a?Math.floor(a):Math.ceil(a)}function tc(){var a,b,c,d,e,f=this._milliseconds,g=this._days,h=this._months,i=this._data;return f>=0&&g>=0&&h>=0||0>=f&&0>=g&&0>=h||(f+=864e5*sc(vc(h)+g),g=0,h=0),i.milliseconds=f%1e3,a=p(f/1e3),i.seconds=a%60,b=p(a/60),i.minutes=b%60,c=p(b/60),i.hours=c%24,g+=p(c/24),e=p(uc(g)),h+=e,g-=sc(vc(e)),d=p(h/12),h%=12,i.days=g,i.months=h,i.years=d,this}function uc(a){return 4800*a/146097}function vc(a){return 146097*a/4800}function wc(a){var b,c,d=this._milliseconds;if(a=A(a),"month"===a||"year"===a)return b=this._days+d/864e5,c=this._months+uc(b),"month"===a?c:c/12;switch(b=this._days+Math.round(vc(this._months)),a){case"week":return b/7+d/6048e5;case"day":return b+d/864e5;case"hour":return 24*b+d/36e5;case"minute":return 1440*b+d/6e4;case"second":return 86400*b+d/1e3;case"millisecond":return Math.floor(864e5*b)+d;default:throw new Error("Unknown unit "+a)}}function xc(){return this._milliseconds+864e5*this._days+this._months%12*2592e6+31536e6*q(this._months/12)}function yc(a){return function(){return this.as(a)}}function zc(a){return a=A(a),this[a+"s"]()}function Ac(a){return function(){return this._data[a]}}function Bc(){return p(this.days()/7)}function Cc(a,b,c,d,e){return e.relativeTime(b||1,!!c,a,d)}function Dc(a,b,c){var d=Ya(a).abs(),e=ke(d.as("s")),f=ke(d.as("m")),g=ke(d.as("h")),h=ke(d.as("d")),i=ke(d.as("M")),j=ke(d.as("y")),k=e<le.s&&["s",e]||1===f&&["m"]||f<le.m&&["mm",f]||1===g&&["h"]||g<le.h&&["hh",g]||1===h&&["d"]||h<le.d&&["dd",h]||1===i&&["M"]||i<le.M&&["MM",i]||1===j&&["y"]||["yy",j];return k[2]=b,k[3]=+a>0,k[4]=c,Cc.apply(null,k)}function Ec(a,b){return void 0===le[a]?!1:void 0===b?le[a]:(le[a]=b,!0)}function Fc(a){var b=this.localeData(),c=Dc(this,!a,b);return a&&(c=b.pastFuture(+this,c)),b.postformat(c)}function Gc(){var a,b,c,d=me(this._milliseconds)/1e3,e=me(this._days),f=me(this._months);a=p(d/60),b=p(a/60),d%=60,a%=60,c=p(f/12),f%=12;var g=c,h=f,i=e,j=b,k=a,l=d,m=this.asSeconds();return m?(0>m?"-":"")+"P"+(g?g+"Y":"")+(h?h+"M":"")+(i?i+"D":"")+(j||k||l?"T":"")+(j?j+"H":"")+(k?k+"M":"")+(l?l+"S":""):"P0D"}var Hc,Ic,Jc=a.momentProperties=[],Kc=!1,Lc={},Mc={},Nc=/(\[[^\[]*\])|(\\)?(Mo|MM?M?M?|Do|DDDo|DD?D?D?|ddd?d?|do?|w[o|w]?|W[o|W]?|Q|YYYYYY|YYYYY|YYYY|YY|gg(ggg?)?|GG(GGG?)?|e|E|a|A|hh?|HH?|mm?|ss?|S{1,9}|x|X|zz?|ZZ?|.)/g,Oc=/(\[[^\[]*\])|(\\)?(LTS|LT|LL?L?L?|l{1,4})/g,Pc={},Qc={},Rc=/\d/,Sc=/\d\d/,Tc=/\d{3}/,Uc=/\d{4}/,Vc=/[+-]?\d{6}/,Wc=/\d\d?/,Xc=/\d{1,3}/,Yc=/\d{1,4}/,Zc=/[+-]?\d{1,6}/,$c=/\d+/,_c=/[+-]?\d+/,ad=/Z|[+-]\d\d:?\d\d/gi,bd=/[+-]?\d+(\.\d{1,3})?/,cd=/[0-9]*['a-z\u00A0-\u05FF\u0700-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+|[\u0600-\u06FF\/]+(\s*?[\u0600-\u06FF]+){1,2}/i,dd={},ed={},fd=0,gd=1,hd=2,id=3,jd=4,kd=5,ld=6;H("M",["MM",2],"Mo",function(){return this.month()+1}),H("MMM",0,0,function(a){return this.localeData().monthsShort(this,a)}),H("MMMM",0,0,function(a){return this.localeData().months(this,a)}),z("month","M"),N("M",Wc),N("MM",Wc,Sc),N("MMM",cd),N("MMMM",cd),Q(["M","MM"],function(a,b){b[gd]=q(a)-1}),Q(["MMM","MMMM"],function(a,b,c,d){var e=c._locale.monthsParse(a,d,c._strict);null!=e?b[gd]=e:j(c).invalidMonth=a});var md="January_February_March_April_May_June_July_August_September_October_November_December".split("_"),nd="Jan_Feb_Mar_Apr_May_Jun_Jul_Aug_Sep_Oct_Nov_Dec".split("_"),od={};a.suppressDeprecationWarnings=!1;var pd=/^\s*(?:[+-]\d{6}|\d{4})-(?:(\d\d-\d\d)|(W\d\d$)|(W\d\d-\d)|(\d\d\d))((T| )(\d\d(:\d\d(:\d\d(\.\d+)?)?)?)?([\+\-]\d\d(?::?\d\d)?|\s*Z)?)?$/,qd=[["YYYYYY-MM-DD",/[+-]\d{6}-\d{2}-\d{2}/],["YYYY-MM-DD",/\d{4}-\d{2}-\d{2}/],["GGGG-[W]WW-E",/\d{4}-W\d{2}-\d/],["GGGG-[W]WW",/\d{4}-W\d{2}/],["YYYY-DDD",/\d{4}-\d{3}/]],rd=[["HH:mm:ss.SSSS",/(T| )\d\d:\d\d:\d\d\.\d+/],["HH:mm:ss",/(T| )\d\d:\d\d:\d\d/],["HH:mm",/(T| )\d\d:\d\d/],["HH",/(T| )\d\d/]],sd=/^\/?Date\((\-?\d+)/i;a.createFromInputFallback=aa("moment construction falls back to js Date. This is discouraged and will be removed in upcoming major release. Please refer to https://github.com/moment/moment/issues/1407 for more info.",function(a){a._d=new Date(a._i+(a._useUTC?" UTC":""))}),H(0,["YY",2],0,function(){return this.year()%100}),H(0,["YYYY",4],0,"year"),H(0,["YYYYY",5],0,"year"),H(0,["YYYYYY",6,!0],0,"year"),z("year","y"),N("Y",_c),N("YY",Wc,Sc),N("YYYY",Yc,Uc),N("YYYYY",Zc,Vc),N("YYYYYY",Zc,Vc),Q(["YYYYY","YYYYYY"],fd),Q("YYYY",function(b,c){c[fd]=2===b.length?a.parseTwoDigitYear(b):q(b)}),Q("YY",function(b,c){c[fd]=a.parseTwoDigitYear(b)}),a.parseTwoDigitYear=function(a){return q(a)+(q(a)>68?1900:2e3)};var td=C("FullYear",!1);H("w",["ww",2],"wo","week"),H("W",["WW",2],"Wo","isoWeek"),z("week","w"),z("isoWeek","W"),N("w",Wc),N("ww",Wc,Sc),N("W",Wc),N("WW",Wc,Sc),R(["w","ww","W","WW"],function(a,b,c,d){b[d.substr(0,1)]=q(a)});var ud={dow:0,doy:6};H("DDD",["DDDD",3],"DDDo","dayOfYear"),z("dayOfYear","DDD"),N("DDD",Xc),N("DDDD",Tc),Q(["DDD","DDDD"],function(a,b,c){c._dayOfYear=q(a)}),a.ISO_8601=function(){};var vd=aa("moment().min is deprecated, use moment.min instead. https://github.com/moment/moment/issues/1548",function(){var a=Da.apply(null,arguments);return this>a?this:a}),wd=aa("moment().max is deprecated, use moment.max instead. https://github.com/moment/moment/issues/1548",function(){var a=Da.apply(null,arguments);return a>this?this:a});Ja("Z",":"),Ja("ZZ",""),N("Z",ad),N("ZZ",ad),Q(["Z","ZZ"],function(a,b,c){c._useUTC=!0,c._tzm=Ka(a)});var xd=/([\+\-]|\d\d)/gi;a.updateOffset=function(){};var yd=/(\-)?(?:(\d*)\.)?(\d+)\:(\d+)(?:\:(\d+)\.?(\d{3})?)?/,zd=/^(-)?P(?:(?:([0-9,.]*)Y)?(?:([0-9,.]*)M)?(?:([0-9,.]*)D)?(?:T(?:([0-9,.]*)H)?(?:([0-9,.]*)M)?(?:([0-9,.]*)S)?)?|([0-9,.]*)W)$/;Ya.fn=Ha.prototype;var Ad=ab(1,"add"),Bd=ab(-1,"subtract");a.defaultFormat="YYYY-MM-DDTHH:mm:ssZ";var Cd=aa("moment().lang() is deprecated. Instead, use moment().localeData() to get the language configuration. Use moment().locale() to change languages.",function(a){return void 0===a?this.localeData():this.locale(a)});H(0,["gg",2],0,function(){return this.weekYear()%100}),H(0,["GG",2],0,function(){return this.isoWeekYear()%100}),Db("gggg","weekYear"),Db("ggggg","weekYear"),Db("GGGG","isoWeekYear"),Db("GGGGG","isoWeekYear"),z("weekYear","gg"),z("isoWeekYear","GG"),N("G",_c),N("g",_c),N("GG",Wc,Sc),N("gg",Wc,Sc),N("GGGG",Yc,Uc),N("gggg",Yc,Uc),N("GGGGG",Zc,Vc),N("ggggg",Zc,Vc),R(["gggg","ggggg","GGGG","GGGGG"],function(a,b,c,d){b[d.substr(0,2)]=q(a)}),R(["gg","GG"],function(b,c,d,e){c[e]=a.parseTwoDigitYear(b)}),H("Q",0,0,"quarter"),z("quarter","Q"),N("Q",Rc),Q("Q",function(a,b){b[gd]=3*(q(a)-1)}),H("D",["DD",2],"Do","date"),z("date","D"),N("D",Wc),N("DD",Wc,Sc),N("Do",function(a,b){return a?b._ordinalParse:b._ordinalParseLenient}),Q(["D","DD"],hd),Q("Do",function(a,b){b[hd]=q(a.match(Wc)[0],10)});var Dd=C("Date",!0);H("d",0,"do","day"),H("dd",0,0,function(a){return this.localeData().weekdaysMin(this,a)}),H("ddd",0,0,function(a){return this.localeData().weekdaysShort(this,a)}),H("dddd",0,0,function(a){return this.localeData().weekdays(this,a)}),H("e",0,0,"weekday"),H("E",0,0,"isoWeekday"),z("day","d"),z("weekday","e"),z("isoWeekday","E"),N("d",Wc),N("e",Wc),N("E",Wc),N("dd",cd),N("ddd",cd),N("dddd",cd),R(["dd","ddd","dddd"],function(a,b,c){var d=c._locale.weekdaysParse(a);null!=d?b.d=d:j(c).invalidWeekday=a}),R(["d","e","E"],function(a,b,c,d){b[d]=q(a)});var Ed="Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),Fd="Sun_Mon_Tue_Wed_Thu_Fri_Sat".split("_"),Gd="Su_Mo_Tu_We_Th_Fr_Sa".split("_");H("H",["HH",2],0,"hour"),H("h",["hh",2],0,function(){return this.hours()%12||12}),Sb("a",!0),Sb("A",!1),z("hour","h"),N("a",Tb),N("A",Tb),N("H",Wc),N("h",Wc),N("HH",Wc,Sc),N("hh",Wc,Sc),Q(["H","HH"],id),Q(["a","A"],function(a,b,c){c._isPm=c._locale.isPM(a),c._meridiem=a}),Q(["h","hh"],function(a,b,c){b[id]=q(a),j(c).bigHour=!0});var Hd=/[ap]\.?m?\.?/i,Id=C("Hours",!0);H("m",["mm",2],0,"minute"),z("minute","m"),N("m",Wc),N("mm",Wc,Sc),Q(["m","mm"],jd);var Jd=C("Minutes",!1);H("s",["ss",2],0,"second"),z("second","s"),N("s",Wc),N("ss",Wc,Sc),Q(["s","ss"],kd);var Kd=C("Seconds",!1);H("S",0,0,function(){return~~(this.millisecond()/100)}),H(0,["SS",2],0,function(){return~~(this.millisecond()/10)}),H(0,["SSS",3],0,"millisecond"),H(0,["SSSS",4],0,function(){return 10*this.millisecond()}),H(0,["SSSSS",5],0,function(){return 100*this.millisecond()}),H(0,["SSSSSS",6],0,function(){return 1e3*this.millisecond()}),H(0,["SSSSSSS",7],0,function(){return 1e4*this.millisecond()}),H(0,["SSSSSSSS",8],0,function(){return 1e5*this.millisecond()}),H(0,["SSSSSSSSS",9],0,function(){return 1e6*this.millisecond()}),z("millisecond","ms"),N("S",Xc,Rc),N("SS",Xc,Sc),N("SSS",Xc,Tc);var Ld;for(Ld="SSSS";Ld.length<=9;Ld+="S")N(Ld,$c);for(Ld="S";Ld.length<=9;Ld+="S")Q(Ld,Wb);var Md=C("Milliseconds",!1);H("z",0,0,"zoneAbbr"),H("zz",0,0,"zoneName");var Nd=n.prototype;Nd.add=Ad,Nd.calendar=cb,Nd.clone=db,Nd.diff=ib,Nd.endOf=ub,Nd.format=mb,Nd.from=nb,Nd.fromNow=ob,Nd.to=pb,Nd.toNow=qb,Nd.get=F,Nd.invalidAt=Cb,Nd.isAfter=eb,Nd.isBefore=fb,Nd.isBetween=gb,Nd.isSame=hb,Nd.isValid=Ab,Nd.lang=Cd,Nd.locale=rb,Nd.localeData=sb,Nd.max=wd,Nd.min=vd,Nd.parsingFlags=Bb,Nd.set=F,Nd.startOf=tb,Nd.subtract=Bd,Nd.toArray=yb,Nd.toObject=zb,Nd.toDate=xb,Nd.toISOString=lb,Nd.toJSON=lb,Nd.toString=kb,Nd.unix=wb,Nd.valueOf=vb,Nd.year=td,Nd.isLeapYear=ia,Nd.weekYear=Fb,Nd.isoWeekYear=Gb,Nd.quarter=Nd.quarters=Jb,Nd.month=Y,Nd.daysInMonth=Z,Nd.week=Nd.weeks=na,Nd.isoWeek=Nd.isoWeeks=oa,Nd.weeksInYear=Ib,Nd.isoWeeksInYear=Hb,Nd.date=Dd,Nd.day=Nd.days=Pb,Nd.weekday=Qb,Nd.isoWeekday=Rb,Nd.dayOfYear=qa,Nd.hour=Nd.hours=Id,Nd.minute=Nd.minutes=Jd,Nd.second=Nd.seconds=Kd,
+  Nd.millisecond=Nd.milliseconds=Md,Nd.utcOffset=Na,Nd.utc=Pa,Nd.local=Qa,Nd.parseZone=Ra,Nd.hasAlignedHourOffset=Sa,Nd.isDST=Ta,Nd.isDSTShifted=Ua,Nd.isLocal=Va,Nd.isUtcOffset=Wa,Nd.isUtc=Xa,Nd.isUTC=Xa,Nd.zoneAbbr=Xb,Nd.zoneName=Yb,Nd.dates=aa("dates accessor is deprecated. Use date instead.",Dd),Nd.months=aa("months accessor is deprecated. Use month instead",Y),Nd.years=aa("years accessor is deprecated. Use year instead",td),Nd.zone=aa("moment().zone is deprecated, use moment().utcOffset instead. https://github.com/moment/moment/issues/1779",Oa);var Od=Nd,Pd={sameDay:"[Today at] LT",nextDay:"[Tomorrow at] LT",nextWeek:"dddd [at] LT",lastDay:"[Yesterday at] LT",lastWeek:"[Last] dddd [at] LT",sameElse:"L"},Qd={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},Rd="Invalid date",Sd="%d",Td=/\d{1,2}/,Ud={future:"in %s",past:"%s ago",s:"a few seconds",m:"a minute",mm:"%d minutes",h:"an hour",hh:"%d hours",d:"a day",dd:"%d days",M:"a month",MM:"%d months",y:"a year",yy:"%d years"},Vd=s.prototype;Vd._calendar=Pd,Vd.calendar=_b,Vd._longDateFormat=Qd,Vd.longDateFormat=ac,Vd._invalidDate=Rd,Vd.invalidDate=bc,Vd._ordinal=Sd,Vd.ordinal=cc,Vd._ordinalParse=Td,Vd.preparse=dc,Vd.postformat=dc,Vd._relativeTime=Ud,Vd.relativeTime=ec,Vd.pastFuture=fc,Vd.set=gc,Vd.months=U,Vd._months=md,Vd.monthsShort=V,Vd._monthsShort=nd,Vd.monthsParse=W,Vd.week=ka,Vd._week=ud,Vd.firstDayOfYear=ma,Vd.firstDayOfWeek=la,Vd.weekdays=Lb,Vd._weekdays=Ed,Vd.weekdaysMin=Nb,Vd._weekdaysMin=Gd,Vd.weekdaysShort=Mb,Vd._weekdaysShort=Fd,Vd.weekdaysParse=Ob,Vd.isPM=Ub,Vd._meridiemParse=Hd,Vd.meridiem=Vb,w("en",{ordinalParse:/\d{1,2}(th|st|nd|rd)/,ordinal:function(a){var b=a%10,c=1===q(a%100/10)?"th":1===b?"st":2===b?"nd":3===b?"rd":"th";return a+c}}),a.lang=aa("moment.lang is deprecated. Use moment.locale instead.",w),a.langData=aa("moment.langData is deprecated. Use moment.localeData instead.",y);var Wd=Math.abs,Xd=yc("ms"),Yd=yc("s"),Zd=yc("m"),$d=yc("h"),_d=yc("d"),ae=yc("w"),be=yc("M"),ce=yc("y"),de=Ac("milliseconds"),ee=Ac("seconds"),fe=Ac("minutes"),ge=Ac("hours"),he=Ac("days"),ie=Ac("months"),je=Ac("years"),ke=Math.round,le={s:45,m:45,h:22,d:26,M:11},me=Math.abs,ne=Ha.prototype;ne.abs=oc,ne.add=qc,ne.subtract=rc,ne.as=wc,ne.asMilliseconds=Xd,ne.asSeconds=Yd,ne.asMinutes=Zd,ne.asHours=$d,ne.asDays=_d,ne.asWeeks=ae,ne.asMonths=be,ne.asYears=ce,ne.valueOf=xc,ne._bubble=tc,ne.get=zc,ne.milliseconds=de,ne.seconds=ee,ne.minutes=fe,ne.hours=ge,ne.days=he,ne.weeks=Bc,ne.months=ie,ne.years=je,ne.humanize=Fc,ne.toISOString=Gc,ne.toString=Gc,ne.toJSON=Gc,ne.locale=rb,ne.localeData=sb,ne.toIsoString=aa("toIsoString() is deprecated. Please use toISOString() instead (notice the capitals)",Gc),ne.lang=Cd,H("X",0,0,"unix"),H("x",0,0,"valueOf"),N("x",_c),N("X",bd),Q("X",function(a,b,c){c._d=new Date(1e3*parseFloat(a,10))}),Q("x",function(a,b,c){c._d=new Date(q(a))}),a.version="2.10.6",b(Da),a.fn=Od,a.min=Fa,a.max=Ga,a.utc=h,a.unix=Zb,a.months=jc,a.isDate=d,a.locale=w,a.invalid=l,a.duration=Ya,a.isMoment=o,a.weekdays=lc,a.parseZone=$b,a.localeData=y,a.isDuration=Ia,a.monthsShort=kc,a.weekdaysMin=nc,a.defineLocale=x,a.weekdaysShort=mc,a.normalizeUnits=A,a.relativeTimeThreshold=Ec;var oe=a;return oe});
+/*!
+ * jQuery cxSelect
+ * @name jquery.cxselect.js
+ * @version 1.4.1
+ * @date 2016-11-02
+ * @author ciaoca
+ * @email ciaoca@gmail.com
+ * @site https://github.com/ciaoca/cxSelect
+ * @license Released under the MIT license
+ */
+
+(function(factory) {
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else {
+    factory(window.jQuery || window.Zepto || window.$);
+  };
+}(function($) {
+  var cxSelect = function() {
+    var self = this;
+    var dom, settings, callback;
+
+    // 分配参数
+    for (var i = 0, l = arguments.length; i < l; i++) {
+      if (cxSelect.isJquery(arguments[i]) || cxSelect.isZepto(arguments[i])) {
+        dom = arguments[i];
+      } else if (cxSelect.isElement(arguments[i])) {
+        dom = $(arguments[i]);
+      } else if (typeof arguments[i] === 'function') {
+        callback = arguments[i];
+      } else if (typeof arguments[i] === 'object') {
+        settings = arguments[i];
+      };
+    };
+
+    var api = new cxSelect.init(dom, settings);
+
+    if (typeof callback === 'function') {
+      callback(api);
+    };
+
+    return api;
+  };
+
+  cxSelect.isElement = function(o){
+    if (o && (typeof HTMLElement === 'function' || typeof HTMLElement === 'object') && o instanceof HTMLElement) {
+      return true;
+    } else {
+      return (o && o.nodeType && o.nodeType === 1) ? true : false;
+    };
+  };
+
+  cxSelect.isJquery = function(o){
+    return (o && o.length && (typeof jQuery === 'function' || typeof jQuery === 'object') && o instanceof jQuery) ? true : false;
+  };
+
+  cxSelect.isZepto = function(o){
+    return (o && o.length && (typeof Zepto === 'function' || typeof Zepto === 'object') && Zepto.zepto.isZ(o)) ? true : false;
+  };
+
+  cxSelect.getIndex = function(n, required) {
+    return required ? n : n - 1;
+  };
+
+  cxSelect.getData = function(data, space) {
+    if (typeof space === 'string' && space.length) {
+      space = space.split('.');
+      for (var i = 0, l = space.length; i < l; i++) {
+        data = data[space[i]];
+      };
+    };
+    return data;
+  };
+
+  cxSelect.init = function(dom, settings) {
+    var self = this;
+
+    if (!cxSelect.isJquery(dom) && !cxSelect.isZepto(dom)) {return};
+
+    var theSelect = {
+      dom: {
+        box: dom
+      }
+    };
+
+    self.attach = cxSelect.attach.bind(theSelect);
+    self.detach = cxSelect.detach.bind(theSelect);
+    self.setOptions = cxSelect.setOptions.bind(theSelect);
+    self.clear = cxSelect.clear.bind(theSelect);
+
+    theSelect.changeEvent = function() {
+      cxSelect.selectChange.call(theSelect, this.className);
+    };
+
+    theSelect.settings = $.extend({}, $.cxSelect.defaults, settings, {
+      url: theSelect.dom.box.data('url'),
+      emptyStyle: theSelect.dom.box.data('emptyStyle'),
+      required: theSelect.dom.box.data('required'),
+      firstTitle: theSelect.dom.box.data('firstTitle'),
+      firstValue: theSelect.dom.box.data('firstValue'),
+      jsonSpace: theSelect.dom.box.data('jsonSpace'),
+      jsonName: theSelect.dom.box.data('jsonName'),
+      jsonValue: theSelect.dom.box.data('jsonValue'),
+      jsonSub: theSelect.dom.box.data('jsonSub')
+    });
+
+    var _dataSelects = theSelect.dom.box.data('selects');
+
+    if (typeof _dataSelects === 'string' && _dataSelects.length) {
+      theSelect.settings.selects = _dataSelects.split(',');
+    };
+
+    self.setOptions();
+    self.attach();
+
+    // 使用独立接口获取数据
+    if (!theSelect.settings.url && !theSelect.settings.data) {
+      cxSelect.start.apply(theSelect);
+
+    // 设置自定义数据
+    } else if ($.isArray(theSelect.settings.data)) {
+      cxSelect.start.call(theSelect, theSelect.settings.data);
+
+    // 设置 URL，通过 Ajax 获取数据
+    } else if (typeof theSelect.settings.url === 'string' && theSelect.settings.url.length) {
+      $.getJSON(theSelect.settings.url, function(json) {
+        cxSelect.start.call(theSelect, json);
+      });
+    };
+  };
+
+  // 设置参数
+  cxSelect.setOptions = function(opts) {
+    var self = this;
+
+    if (opts) {
+      $.extend(self.settings, opts);
+    };
+
+    // 初次或重设选择器组
+    if (!$.isArray(self.selectArray) || !self.selectArray.length || (opts && opts.selects)) {
+      self.selectArray = [];
+
+      if ($.isArray(self.settings.selects) && self.settings.selects.length) {
+        var _tempSelect;
+
+        for (var i = 0, l = self.settings.selects.length; i < l; i++) {
+          _tempSelect = self.dom.box.find('select.' + self.settings.selects[i]);
+
+          if (!_tempSelect || !_tempSelect.length) {break};
+
+          self.selectArray.push(_tempSelect);
+        };
+      };
+    };
+
+    if (opts) {
+      if (!$.isArray(opts.data) && typeof opts.url === 'string' && opts.url.length) {
+        $.getJSON(self.settings.url, function(json) {
+          cxSelect.start.call(self, json);
+        });
+
+      } else {
+        cxSelect.start.call(self, opts.data);
+      };
+    };
+  };
+
+  // 绑定
+  cxSelect.attach = function() {
+    var self = this;
+
+    if (!self.attachStatus) {
+      self.dom.box.on('change', 'select', self.changeEvent);
+    };
+
+    if (typeof self.attachStatus === 'boolean') {
+      cxSelect.start.call(self);
+    };
+
+    self.attachStatus = true;
+  };
+
+  // 移除绑定
+  cxSelect.detach = function() {
+    var self = this;
+    self.dom.box.off('change', 'select', self.changeEvent);
+    self.attachStatus = false;
+  };
+
+  // 清空选项
+  cxSelect.clear = function(index) {
+    var self = this;
+    var _style = {
+      display: '',
+      visibility: ''
+    };
+
+    index = isNaN(index) ? 0 : index;
+
+    // 清空后面的 select
+    for (var i = index, l = self.selectArray.length; i < l; i++) {
+      self.selectArray[i].empty().prop('disabled', true);
+
+      if (self.settings.emptyStyle === 'none') {
+        _style.display = 'none';
+      } else if (self.settings.emptyStyle === 'hidden') {
+        _style.visibility = 'hidden';
+      };
+
+      self.selectArray[i].css(_style);
+    };
+  };
+
+  cxSelect.start = function(data) {
+    var self = this;
+
+    if ($.isArray(data)) {
+      self.settings.data = cxSelect.getData(data, self.settings.jsonSpace);
+    };
+
+    if (!self.selectArray.length) {return};
+
+    // 保存默认值
+    for (var i = 0, l = self.selectArray.length; i < l; i++) {
+      if (typeof self.selectArray[i].attr('data-value') !== 'string' && self.selectArray[i][0].options.length) {
+        self.selectArray[i].attr('data-value', self.selectArray[i].val());
+      };
+    };
+
+    if (self.settings.data || (typeof self.selectArray[0].data('url') === 'string' && self.selectArray[0].data('url').length)) {
+      cxSelect.getOptionData.call(self, 0);
+    } else {
+      self.selectArray[0].prop('disabled', false).css({
+        'display': '',
+        'visibility': ''
+      });
+    };
+  };
+
+  // 获取选项数据
+  cxSelect.getOptionData = function(index) {
+    var self = this;
+
+    if (typeof index !== 'number' || isNaN(index) || index < 0 || index >= self.selectArray.length) {return};
+
+    var _indexPrev = index - 1;
+    var _select = self.selectArray[index];
+    var _selectData;
+    var _valueIndex;
+    var _dataUrl = _select.data('url');
+    var _jsonSpace = typeof _select.data('jsonSpace') === 'undefined' ? self.settings.jsonSpace : _select.data('jsonSpace');
+    var _query = {};
+    var _queryName;
+    var _selectName;
+    var _selectValue;
+
+    cxSelect.clear.call(self, index);
+
+    // 使用独立接口
+    if (typeof _dataUrl === 'string' && _dataUrl.length) {
+      if (index > 0) {
+        for (var i = 0, j = 1; i < index; i++, j++) {
+          _queryName = self.selectArray[j].data('queryName');
+          _selectName = self.selectArray[i].attr('name');
+          _selectValue = self.selectArray[i].val();
+
+          if (typeof _queryName === 'string' && _queryName.length) {
+            _query[_queryName] = _selectValue;
+          } else if (typeof _selectName === 'string' && _selectName.length) {
+            _query[_selectName] = _selectValue;
+          };
+        };
+      };
+
+      $.getJSON(_dataUrl, _query, function(json) {
+        _selectData = cxSelect.getData(json, _jsonSpace);
+
+        cxSelect.buildOption.call(self, index, _selectData);
+      });
+
+    // 使用整合数据
+    } else if (self.settings.data && typeof self.settings.data === 'object') {
+      _selectData = self.settings.data;
+
+      for (var i = 0; i < index; i++) {
+        _valueIndex = cxSelect.getIndex(self.selectArray[i][0].selectedIndex, typeof self.selectArray[i].data('required') === 'boolean' ? self.selectArray[i].data('required') : self.settings.required);
+
+        if (typeof _selectData[_valueIndex] === 'object' && $.isArray(_selectData[_valueIndex][self.settings.jsonSub]) && _selectData[_valueIndex][self.settings.jsonSub].length) {
+          _selectData = _selectData[_valueIndex][self.settings.jsonSub];
+        } else {
+          _selectData = null;
+          break;
+        };
+      };
+
+      cxSelect.buildOption.call(self, index, _selectData);
+    };
+  };
+
+  // 构建选项列表
+  cxSelect.buildOption = function(index, data) {
+    var self = this;
+
+    var _select = self.selectArray[index];
+    var _required = typeof _select.data('required') === 'boolean' ? _select.data('required') : self.settings.required;
+    var _firstTitle = typeof _select.data('firstTitle') === 'undefined' ? self.settings.firstTitle : _select.data('firstTitle');
+    var _firstValue = typeof _select.data('firstValue') === 'undefined' ? self.settings.firstValue : _select.data('firstValue');
+    var _jsonName = typeof _select.data('jsonName') === 'undefined' ? self.settings.jsonName : _select.data('jsonName');
+    var _jsonValue = typeof _select.data('jsonValue') === 'undefined' ? self.settings.jsonValue : _select.data('jsonValue');
+
+    if (!$.isArray(data)) {return};
+
+    var _html = !_required ? '<option value="' + String(_firstValue) + '">' + String(_firstTitle) + '</option>' : '';
+
+    // 区分标题、值的数据
+    if (typeof _jsonName === 'string' && _jsonName.length) {
+      // 无值字段时使用标题作为值
+      if (typeof _jsonValue !== 'string' || !_jsonValue.length) {
+        _jsonValue = _jsonName;
+      };
+
+      for (var i = 0, l = data.length; i < l; i++) {
+        _html += '<option value="' + String(data[i][_jsonValue]) + '">' + String(data[i][_jsonName]) + '</option>';
+      };
+
+    // 数组即为值的数据
+    } else {
+      for (var i = 0, l = data.length; i < l; i++) {
+        _html += '<option value="' + String(data[i]) + '">' + String(data[i]) + '</option>';
+      };
+    };
+
+    _select.html(_html).prop('disabled', false).css({
+      'display': '',
+      'visibility': ''
+    });
+
+    // 初次加载设置默认值
+    if (typeof _select.attr('data-value') === 'string') {
+      _select.val(String(_select.attr('data-value'))).removeAttr('data-value');
+
+      if (_select[0].selectedIndex < 0) {
+        _select[0].options[0].selected = true;
+      };
+    };
+
+    if (_required || _select[0].selectedIndex > 0) {
+      _select.trigger('change');
+    };
+
+  };
+
+  // 改变选择时的处理
+  cxSelect.selectChange = function(name) {
+    var self = this;
+
+    if (typeof name !== 'string' || !name.length) {return};
+
+    var index;
+
+    name = name.replace(/\s+/g, ',');
+    name = ',' + name + ',';
+
+    // 获取当前 select 位置
+    for (var i = 0, l = self.selectArray.length; i < l; i++) {
+      if (name.indexOf(',' + self.settings.selects[i] + ',') > -1) {
+        index = i;
+        break;
+      };
+    };
+
+    if (typeof index === 'number' && index > -1) {
+      index += 1;
+      cxSelect.getOptionData.call(self, index);
+    };
+  };
+
+  $.cxSelect = function() {
+    return cxSelect.apply(this, arguments);
+  };
+
+  // 默认值
+  $.cxSelect.defaults = {
+    selects: [],            // 下拉选框组
+    url: null,              // 列表数据文件路径（URL）或数组数据
+    data: null,             // 自定义数据
+    emptyStyle: null,       // 无数据状态显示方式
+    required: false,        // 是否为必选
+    firstTitle: '请选择',    // 第一个选项的标题
+    firstValue: '',         // 第一个选项的值
+    jsonSpace: '',          // 数据命名空间
+    jsonName: 'n',          // 数据标题字段名称
+    jsonValue: '',          // 数据值字段名称
+    jsonSub: 's'            // 子集数据字段名称
+  };
+
+  $.fn.cxSelect = function(settings, callback) {
+    this.each(function(i) {
+      $.cxSelect(this, settings, callback);
+    });
+    return this;
+  };
+}));
+/*!
+ * Datepicker for Bootstrap v1.9.0 (https://github.com/uxsolutions/bootstrap-datepicker)
+ *
+ * Licensed under the Apache License v2.0 (http://www.apache.org/licenses/LICENSE-2.0)
+ */
+
+
+(function(factory){
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else if (typeof exports === 'object') {
+    factory(require('jquery'));
+  } else {
+    factory(jQuery);
+  }
+}(function($, undefined){
+  function UTCDate(){
+    return new Date(Date.UTC.apply(Date, arguments));
+  }
+  function UTCToday(){
+    var today = new Date();
+    return UTCDate(today.getFullYear(), today.getMonth(), today.getDate());
+  }
+  function isUTCEquals(date1, date2) {
+    return (
+      date1.getUTCFullYear() === date2.getUTCFullYear() &&
+      date1.getUTCMonth() === date2.getUTCMonth() &&
+      date1.getUTCDate() === date2.getUTCDate()
+    );
+  }
+  function alias(method, deprecationMsg){
+    return function(){
+      if (deprecationMsg !== undefined) {
+        $.fn.datepicker.deprecated(deprecationMsg);
+      }
+
+      return this[method].apply(this, arguments);
+    };
+  }
+  function isValidDate(d) {
+    return d && !isNaN(d.getTime());
+  }
+
+  var DateArray = (function(){
+    var extras = {
+      get: function(i){
+        return this.slice(i)[0];
+      },
+      contains: function(d){
+        // Array.indexOf is not cross-browser;
+        // $.inArray doesn't work with Dates
+        var val = d && d.valueOf();
+        for (var i=0, l=this.length; i < l; i++)
+          // Use date arithmetic to allow dates with different times to match
+          if (0 <= this[i].valueOf() - val && this[i].valueOf() - val < 1000*60*60*24)
+            return i;
+        return -1;
+      },
+      remove: function(i){
+        this.splice(i,1);
+      },
+      replace: function(new_array){
+        if (!new_array)
+          return;
+        if (!$.isArray(new_array))
+          new_array = [new_array];
+        this.clear();
+        this.push.apply(this, new_array);
+      },
+      clear: function(){
+        this.length = 0;
+      },
+      copy: function(){
+        var a = new DateArray();
+        a.replace(this);
+        return a;
+      }
+    };
+
+    return function(){
+      var a = [];
+      a.push.apply(a, arguments);
+      $.extend(a, extras);
+      return a;
+    };
+  })();
+
+
+  // Picker object
+
+  var Datepicker = function(element, options){
+    $.data(element, 'datepicker', this);
+
+    this._events = [];
+    this._secondaryEvents = [];
+
+    this._process_options(options);
+
+    this.dates = new DateArray();
+    this.viewDate = this.o.defaultViewDate;
+    this.focusDate = null;
+
+    this.element = $(element);
+    this.isInput = this.element.is('input');
+    this.inputField = this.isInput ? this.element : this.element.find('input');
+    this.component = this.element.hasClass('date') ? this.element.find('.add-on, .input-group-addon, .input-group-append, .input-group-prepend, .btn') : false;
+    if (this.component && this.component.length === 0)
+      this.component = false;
+    this.isInline = !this.component && this.element.is('div');
+
+    this.picker = $(DPGlobal.template);
+
+    // Checking templates and inserting
+    if (this._check_template(this.o.templates.leftArrow)) {
+      this.picker.find('.prev').html(this.o.templates.leftArrow);
+    }
+
+    if (this._check_template(this.o.templates.rightArrow)) {
+      this.picker.find('.next').html(this.o.templates.rightArrow);
+    }
+
+    this._buildEvents();
+    this._attachEvents();
+
+    if (this.isInline){
+      this.picker.addClass('datepicker-inline').appendTo(this.element);
+    }
+    else {
+      this.picker.addClass('datepicker-dropdown dropdown-menu');
+    }
+
+    if (this.o.rtl){
+      this.picker.addClass('datepicker-rtl');
+    }
+
+    if (this.o.calendarWeeks) {
+      this.picker.find('.datepicker-days .datepicker-switch, thead .datepicker-title, tfoot .today, tfoot .clear')
+        .attr('colspan', function(i, val){
+          return Number(val) + 1;
+        });
+    }
+
+    this._process_options({
+      startDate: this._o.startDate,
+      endDate: this._o.endDate,
+      daysOfWeekDisabled: this.o.daysOfWeekDisabled,
+      daysOfWeekHighlighted: this.o.daysOfWeekHighlighted,
+      datesDisabled: this.o.datesDisabled
+    });
+
+    this._allow_update = false;
+    this.setViewMode(this.o.startView);
+    this._allow_update = true;
+
+    this.fillDow();
+    this.fillMonths();
+
+    this.update();
+
+    if (this.isInline){
+      this.show();
+    }
+  };
+
+  Datepicker.prototype = {
+    constructor: Datepicker,
+
+    _resolveViewName: function(view){
+      $.each(DPGlobal.viewModes, function(i, viewMode){
+        if (view === i || $.inArray(view, viewMode.names) !== -1){
+          view = i;
+          return false;
+        }
+      });
+
+      return view;
+    },
+
+    _resolveDaysOfWeek: function(daysOfWeek){
+      if (!$.isArray(daysOfWeek))
+        daysOfWeek = daysOfWeek.split(/[,\s]*/);
+      return $.map(daysOfWeek, Number);
+    },
+
+    _check_template: function(tmp){
+      try {
+        // If empty
+        if (tmp === undefined || tmp === "") {
+          return false;
+        }
+        // If no html, everything ok
+        if ((tmp.match(/[<>]/g) || []).length <= 0) {
+          return true;
+        }
+        // Checking if html is fine
+        var jDom = $(tmp);
+        return jDom.length > 0;
+      }
+      catch (ex) {
+        return false;
+      }
+    },
+
+    _process_options: function(opts){
+      // Store raw options for reference
+      this._o = $.extend({}, this._o, opts);
+      // Processed options
+      var o = this.o = $.extend({}, this._o);
+
+      // Check if "de-DE" style date is available, if not language should
+      // fallback to 2 letter code eg "de"
+      var lang = o.language;
+      if (!dates[lang]){
+        lang = lang.split('-')[0];
+        if (!dates[lang])
+          lang = defaults.language;
+      }
+      o.language = lang;
+
+      // Retrieve view index from any aliases
+      o.startView = this._resolveViewName(o.startView);
+      o.minViewMode = this._resolveViewName(o.minViewMode);
+      o.maxViewMode = this._resolveViewName(o.maxViewMode);
+
+      // Check view is between min and max
+      o.startView = Math.max(this.o.minViewMode, Math.min(this.o.maxViewMode, o.startView));
+
+      // true, false, or Number > 0
+      if (o.multidate !== true){
+        o.multidate = Number(o.multidate) || false;
+        if (o.multidate !== false)
+          o.multidate = Math.max(0, o.multidate);
+      }
+      o.multidateSeparator = String(o.multidateSeparator);
+
+      o.weekStart %= 7;
+      o.weekEnd = (o.weekStart + 6) % 7;
+
+      var format = DPGlobal.parseFormat(o.format);
+      if (o.startDate !== -Infinity){
+        if (!!o.startDate){
+          if (o.startDate instanceof Date)
+            o.startDate = this._local_to_utc(this._zero_time(o.startDate));
+          else
+            o.startDate = DPGlobal.parseDate(o.startDate, format, o.language, o.assumeNearbyYear);
+        }
+        else {
+          o.startDate = -Infinity;
+        }
+      }
+      if (o.endDate !== Infinity){
+        if (!!o.endDate){
+          if (o.endDate instanceof Date)
+            o.endDate = this._local_to_utc(this._zero_time(o.endDate));
+          else
+            o.endDate = DPGlobal.parseDate(o.endDate, format, o.language, o.assumeNearbyYear);
+        }
+        else {
+          o.endDate = Infinity;
+        }
+      }
+
+      o.daysOfWeekDisabled = this._resolveDaysOfWeek(o.daysOfWeekDisabled||[]);
+      o.daysOfWeekHighlighted = this._resolveDaysOfWeek(o.daysOfWeekHighlighted||[]);
+
+      o.datesDisabled = o.datesDisabled||[];
+      if (!$.isArray(o.datesDisabled)) {
+        o.datesDisabled = o.datesDisabled.split(',');
+      }
+      o.datesDisabled = $.map(o.datesDisabled, function(d){
+        return DPGlobal.parseDate(d, format, o.language, o.assumeNearbyYear);
+      });
+
+      var plc = String(o.orientation).toLowerCase().split(/\s+/g),
+        _plc = o.orientation.toLowerCase();
+      plc = $.grep(plc, function(word){
+        return /^auto|left|right|top|bottom$/.test(word);
+      });
+      o.orientation = {x: 'auto', y: 'auto'};
+      if (!_plc || _plc === 'auto')
+        ; // no action
+      else if (plc.length === 1){
+        switch (plc[0]){
+          case 'top':
+          case 'bottom':
+            o.orientation.y = plc[0];
+            break;
+          case 'left':
+          case 'right':
+            o.orientation.x = plc[0];
+            break;
+        }
+      }
+      else {
+        _plc = $.grep(plc, function(word){
+          return /^left|right$/.test(word);
+        });
+        o.orientation.x = _plc[0] || 'auto';
+
+        _plc = $.grep(plc, function(word){
+          return /^top|bottom$/.test(word);
+        });
+        o.orientation.y = _plc[0] || 'auto';
+      }
+      if (o.defaultViewDate instanceof Date || typeof o.defaultViewDate === 'string') {
+        o.defaultViewDate = DPGlobal.parseDate(o.defaultViewDate, format, o.language, o.assumeNearbyYear);
+      } else if (o.defaultViewDate) {
+        var year = o.defaultViewDate.year || new Date().getFullYear();
+        var month = o.defaultViewDate.month || 0;
+        var day = o.defaultViewDate.day || 1;
+        o.defaultViewDate = UTCDate(year, month, day);
+      } else {
+        o.defaultViewDate = UTCToday();
+      }
+    },
+    _applyEvents: function(evs){
+      for (var i=0, el, ch, ev; i < evs.length; i++){
+        el = evs[i][0];
+        if (evs[i].length === 2){
+          ch = undefined;
+          ev = evs[i][1];
+        } else if (evs[i].length === 3){
+          ch = evs[i][1];
+          ev = evs[i][2];
+        }
+        el.on(ev, ch);
+      }
+    },
+    _unapplyEvents: function(evs){
+      for (var i=0, el, ev, ch; i < evs.length; i++){
+        el = evs[i][0];
+        if (evs[i].length === 2){
+          ch = undefined;
+          ev = evs[i][1];
+        } else if (evs[i].length === 3){
+          ch = evs[i][1];
+          ev = evs[i][2];
+        }
+        el.off(ev, ch);
+      }
+    },
+    _buildEvents: function(){
+      var events = {
+        keyup: $.proxy(function(e){
+          if ($.inArray(e.keyCode, [27, 37, 39, 38, 40, 32, 13, 9]) === -1)
+            this.update();
+        }, this),
+        keydown: $.proxy(this.keydown, this),
+        paste: $.proxy(this.paste, this)
+      };
+
+      if (this.o.showOnFocus === true) {
+        events.focus = $.proxy(this.show, this);
+      }
+
+      if (this.isInput) { // single input
+        this._events = [
+          [this.element, events]
+        ];
+      }
+      // component: input + button
+      else if (this.component && this.inputField.length) {
+        this._events = [
+          // For components that are not readonly, allow keyboard nav
+          [this.inputField, events],
+          [this.component, {
+            click: $.proxy(this.show, this)
+          }]
+        ];
+      }
+      else {
+        this._events = [
+          [this.element, {
+            click: $.proxy(this.show, this),
+            keydown: $.proxy(this.keydown, this)
+          }]
+        ];
+      }
+      this._events.push(
+        // Component: listen for blur on element descendants
+        [this.element, '*', {
+          blur: $.proxy(function(e){
+            this._focused_from = e.target;
+          }, this)
+        }],
+        // Input: listen for blur on element
+        [this.element, {
+          blur: $.proxy(function(e){
+            this._focused_from = e.target;
+          }, this)
+        }]
+      );
+
+      if (this.o.immediateUpdates) {
+        // Trigger input updates immediately on changed year/month
+        this._events.push([this.element, {
+          'changeYear changeMonth': $.proxy(function(e){
+            this.update(e.date);
+          }, this)
+        }]);
+      }
+
+      this._secondaryEvents = [
+        [this.picker, {
+          click: $.proxy(this.click, this)
+        }],
+        [this.picker, '.prev, .next', {
+          click: $.proxy(this.navArrowsClick, this)
+        }],
+        [this.picker, '.day:not(.disabled)', {
+          click: $.proxy(this.dayCellClick, this)
+        }],
+        [$(window), {
+          resize: $.proxy(this.place, this)
+        }],
+        [$(document), {
+          'mousedown touchstart': $.proxy(function(e){
+            // Clicked outside the datepicker, hide it
+            if (!(
+              this.element.is(e.target) ||
+              this.element.find(e.target).length ||
+              this.picker.is(e.target) ||
+              this.picker.find(e.target).length ||
+              this.isInline
+            )){
+              this.hide();
+            }
+          }, this)
+        }]
+      ];
+    },
+    _attachEvents: function(){
+      this._detachEvents();
+      this._applyEvents(this._events);
+    },
+    _detachEvents: function(){
+      this._unapplyEvents(this._events);
+    },
+    _attachSecondaryEvents: function(){
+      this._detachSecondaryEvents();
+      this._applyEvents(this._secondaryEvents);
+    },
+    _detachSecondaryEvents: function(){
+      this._unapplyEvents(this._secondaryEvents);
+    },
+    _trigger: function(event, altdate){
+      var date = altdate || this.dates.get(-1),
+        local_date = this._utc_to_local(date);
+
+      this.element.trigger({
+        type: event,
+        date: local_date,
+        viewMode: this.viewMode,
+        dates: $.map(this.dates, this._utc_to_local),
+        format: $.proxy(function(ix, format){
+          if (arguments.length === 0){
+            ix = this.dates.length - 1;
+            format = this.o.format;
+          } else if (typeof ix === 'string'){
+            format = ix;
+            ix = this.dates.length - 1;
+          }
+          format = format || this.o.format;
+          var date = this.dates.get(ix);
+          return DPGlobal.formatDate(date, format, this.o.language);
+        }, this)
+      });
+    },
+
+    show: function(){
+      if (this.inputField.is(':disabled') || (this.inputField.prop('readonly') && this.o.enableOnReadonly === false))
+        return;
+      if (!this.isInline)
+        this.picker.appendTo(this.o.container);
+      this.place();
+      this.picker.show();
+      this._attachSecondaryEvents();
+      this._trigger('show');
+      if ((window.navigator.msMaxTouchPoints || 'ontouchstart' in document) && this.o.disableTouchKeyboard) {
+        $(this.element).blur();
+      }
+      return this;
+    },
+
+    hide: function(){
+      if (this.isInline || !this.picker.is(':visible'))
+        return this;
+      this.focusDate = null;
+      this.picker.hide().detach();
+      this._detachSecondaryEvents();
+      this.setViewMode(this.o.startView);
+
+      if (this.o.forceParse && this.inputField.val())
+        this.setValue();
+      this._trigger('hide');
+      return this;
+    },
+
+    destroy: function(){
+      this.hide();
+      this._detachEvents();
+      this._detachSecondaryEvents();
+      this.picker.remove();
+      delete this.element.data().datepicker;
+      if (!this.isInput){
+        delete this.element.data().date;
+      }
+      return this;
+    },
+
+    paste: function(e){
+      var dateString;
+      if (e.originalEvent.clipboardData && e.originalEvent.clipboardData.types
+        && $.inArray('text/plain', e.originalEvent.clipboardData.types) !== -1) {
+        dateString = e.originalEvent.clipboardData.getData('text/plain');
+      } else if (window.clipboardData) {
+        dateString = window.clipboardData.getData('Text');
+      } else {
+        return;
+      }
+      this.setDate(dateString);
+      this.update();
+      e.preventDefault();
+    },
+
+    _utc_to_local: function(utc){
+      if (!utc) {
+        return utc;
+      }
+
+      var local = new Date(utc.getTime() + (utc.getTimezoneOffset() * 60000));
+
+      if (local.getTimezoneOffset() !== utc.getTimezoneOffset()) {
+        local = new Date(utc.getTime() + (local.getTimezoneOffset() * 60000));
+      }
+
+      return local;
+    },
+    _local_to_utc: function(local){
+      return local && new Date(local.getTime() - (local.getTimezoneOffset()*60000));
+    },
+    _zero_time: function(local){
+      return local && new Date(local.getFullYear(), local.getMonth(), local.getDate());
+    },
+    _zero_utc_time: function(utc){
+      return utc && UTCDate(utc.getUTCFullYear(), utc.getUTCMonth(), utc.getUTCDate());
+    },
+
+    getDates: function(){
+      return $.map(this.dates, this._utc_to_local);
+    },
+
+    getUTCDates: function(){
+      return $.map(this.dates, function(d){
+        return new Date(d);
+      });
+    },
+
+    getDate: function(){
+      return this._utc_to_local(this.getUTCDate());
+    },
+
+    getUTCDate: function(){
+      var selected_date = this.dates.get(-1);
+      if (selected_date !== undefined) {
+        return new Date(selected_date);
+      } else {
+        return null;
+      }
+    },
+
+    clearDates: function(){
+      this.inputField.val('');
+      this.update();
+      this._trigger('changeDate');
+
+      if (this.o.autoclose) {
+        this.hide();
+      }
+    },
+
+    setDates: function(){
+      var args = $.isArray(arguments[0]) ? arguments[0] : arguments;
+      this.update.apply(this, args);
+      this._trigger('changeDate');
+      this.setValue();
+      return this;
+    },
+
+    setUTCDates: function(){
+      var args = $.isArray(arguments[0]) ? arguments[0] : arguments;
+      this.setDates.apply(this, $.map(args, this._utc_to_local));
+      return this;
+    },
+
+    setDate: alias('setDates'),
+    setUTCDate: alias('setUTCDates'),
+    remove: alias('destroy', 'Method `remove` is deprecated and will be removed in version 2.0. Use `destroy` instead'),
+
+    setValue: function(){
+      var formatted = this.getFormattedDate();
+      this.inputField.val(formatted);
+      return this;
+    },
+
+    getFormattedDate: function(format){
+      if (format === undefined)
+        format = this.o.format;
+
+      var lang = this.o.language;
+      return $.map(this.dates, function(d){
+        return DPGlobal.formatDate(d, format, lang);
+      }).join(this.o.multidateSeparator);
+    },
+
+    getStartDate: function(){
+      return this.o.startDate;
+    },
+
+    setStartDate: function(startDate){
+      this._process_options({startDate: startDate});
+      this.update();
+      this.updateNavArrows();
+      return this;
+    },
+
+    getEndDate: function(){
+      return this.o.endDate;
+    },
+
+    setEndDate: function(endDate){
+      this._process_options({endDate: endDate});
+      this.update();
+      this.updateNavArrows();
+      return this;
+    },
+
+    setDaysOfWeekDisabled: function(daysOfWeekDisabled){
+      this._process_options({daysOfWeekDisabled: daysOfWeekDisabled});
+      this.update();
+      return this;
+    },
+
+    setDaysOfWeekHighlighted: function(daysOfWeekHighlighted){
+      this._process_options({daysOfWeekHighlighted: daysOfWeekHighlighted});
+      this.update();
+      return this;
+    },
+
+    setDatesDisabled: function(datesDisabled){
+      this._process_options({datesDisabled: datesDisabled});
+      this.update();
+      return this;
+    },
+
+    place: function(){
+      if (this.isInline)
+        return this;
+      var calendarWidth = this.picker.outerWidth(),
+        calendarHeight = this.picker.outerHeight(),
+        visualPadding = 10,
+        container = $(this.o.container),
+        windowWidth = container.width(),
+        scrollTop = this.o.container === 'body' ? $(document).scrollTop() : container.scrollTop(),
+        appendOffset = container.offset();
+
+      var parentsZindex = [0];
+      this.element.parents().each(function(){
+        var itemZIndex = $(this).css('z-index');
+        if (itemZIndex !== 'auto' && Number(itemZIndex) !== 0) parentsZindex.push(Number(itemZIndex));
+      });
+      var zIndex = Math.max.apply(Math, parentsZindex) + this.o.zIndexOffset;
+      var offset = this.component ? this.component.parent().offset() : this.element.offset();
+      var height = this.component ? this.component.outerHeight(true) : this.element.outerHeight(false);
+      var width = this.component ? this.component.outerWidth(true) : this.element.outerWidth(false);
+      var left = offset.left - appendOffset.left;
+      var top = offset.top - appendOffset.top;
+
+      if (this.o.container !== 'body') {
+        top += scrollTop;
+      }
+
+      this.picker.removeClass(
+        'datepicker-orient-top datepicker-orient-bottom '+
+        'datepicker-orient-right datepicker-orient-left'
+      );
+
+      if (this.o.orientation.x !== 'auto'){
+        this.picker.addClass('datepicker-orient-' + this.o.orientation.x);
+        if (this.o.orientation.x === 'right')
+          left -= calendarWidth - width;
+      }
+      // auto x orientation is best-placement: if it crosses a window
+      // edge, fudge it sideways
+      else {
+        if (offset.left < 0) {
+          // component is outside the window on the left side. Move it into visible range
+          this.picker.addClass('datepicker-orient-left');
+          left -= offset.left - visualPadding;
+        } else if (left + calendarWidth > windowWidth) {
+          // the calendar passes the widow right edge. Align it to component right side
+          this.picker.addClass('datepicker-orient-right');
+          left += width - calendarWidth;
+        } else {
+          if (this.o.rtl) {
+            // Default to right
+            this.picker.addClass('datepicker-orient-right');
+          } else {
+            // Default to left
+            this.picker.addClass('datepicker-orient-left');
+          }
+        }
+      }
+
+      // auto y orientation is best-situation: top or bottom, no fudging,
+      // decision based on which shows more of the calendar
+      var yorient = this.o.orientation.y,
+        top_overflow;
+      if (yorient === 'auto'){
+        top_overflow = -scrollTop + top - calendarHeight;
+        yorient = top_overflow < 0 ? 'bottom' : 'top';
+      }
+
+      this.picker.addClass('datepicker-orient-' + yorient);
+      if (yorient === 'top')
+        top -= calendarHeight + parseInt(this.picker.css('padding-top'));
+      else
+        top += height;
+
+      if (this.o.rtl) {
+        var right = windowWidth - (left + width);
+        this.picker.css({
+          top: top,
+          right: right,
+          zIndex: zIndex
+        });
+      } else {
+        this.picker.css({
+          top: top,
+          left: left,
+          zIndex: zIndex
+        });
+      }
+      return this;
+    },
+
+    _allow_update: true,
+    update: function(){
+      if (!this._allow_update)
+        return this;
+
+      var oldDates = this.dates.copy(),
+        dates = [],
+        fromArgs = false;
+      if (arguments.length){
+        $.each(arguments, $.proxy(function(i, date){
+          if (date instanceof Date)
+            date = this._local_to_utc(date);
+          dates.push(date);
+        }, this));
+        fromArgs = true;
+      } else {
+        dates = this.isInput
+          ? this.element.val()
+          : this.element.data('date') || this.inputField.val();
+        if (dates && this.o.multidate)
+          dates = dates.split(this.o.multidateSeparator);
+        else
+          dates = [dates];
+        delete this.element.data().date;
+      }
+
+      dates = $.map(dates, $.proxy(function(date){
+        return DPGlobal.parseDate(date, this.o.format, this.o.language, this.o.assumeNearbyYear);
+      }, this));
+      dates = $.grep(dates, $.proxy(function(date){
+        return (
+          !this.dateWithinRange(date) ||
+          !date
+        );
+      }, this), true);
+      this.dates.replace(dates);
+
+      if (this.o.updateViewDate) {
+        if (this.dates.length)
+          this.viewDate = new Date(this.dates.get(-1));
+        else if (this.viewDate < this.o.startDate)
+          this.viewDate = new Date(this.o.startDate);
+        else if (this.viewDate > this.o.endDate)
+          this.viewDate = new Date(this.o.endDate);
+        else
+          this.viewDate = this.o.defaultViewDate;
+      }
+
+      if (fromArgs){
+        // setting date by clicking
+        this.setValue();
+        this.element.change();
+      }
+      else if (this.dates.length){
+        // setting date by typing
+        if (String(oldDates) !== String(this.dates) && fromArgs) {
+          this._trigger('changeDate');
+          this.element.change();
+        }
+      }
+      if (!this.dates.length && oldDates.length) {
+        this._trigger('clearDate');
+        this.element.change();
+      }
+
+      this.fill();
+      return this;
+    },
+
+    fillDow: function(){
+      if (this.o.showWeekDays) {
+        var dowCnt = this.o.weekStart,
+          html = '<tr>';
+        if (this.o.calendarWeeks){
+          html += '<th class="cw">&#160;</th>';
+        }
+        while (dowCnt < this.o.weekStart + 7){
+          html += '<th class="dow';
+          if ($.inArray(dowCnt, this.o.daysOfWeekDisabled) !== -1)
+            html += ' disabled';
+          html += '">'+dates[this.o.language].daysMin[(dowCnt++)%7]+'</th>';
+        }
+        html += '</tr>';
+        this.picker.find('.datepicker-days thead').append(html);
+      }
+    },
+
+    fillMonths: function(){
+      var localDate = this._utc_to_local(this.viewDate);
+      var html = '';
+      var focused;
+      for (var i = 0; i < 12; i++){
+        focused = localDate && localDate.getMonth() === i ? ' focused' : '';
+        html += '<span class="month' + focused + '">' + dates[this.o.language].monthsShort[i] + '</span>';
+      }
+      this.picker.find('.datepicker-months td').html(html);
+    },
+
+    setRange: function(range){
+      if (!range || !range.length)
+        delete this.range;
+      else
+        this.range = $.map(range, function(d){
+          return d.valueOf();
+        });
+      this.fill();
+    },
+
+    getClassNames: function(date){
+      var cls = [],
+        year = this.viewDate.getUTCFullYear(),
+        month = this.viewDate.getUTCMonth(),
+        today = UTCToday();
+      if (date.getUTCFullYear() < year || (date.getUTCFullYear() === year && date.getUTCMonth() < month)){
+        cls.push('old');
+      } else if (date.getUTCFullYear() > year || (date.getUTCFullYear() === year && date.getUTCMonth() > month)){
+        cls.push('new');
+      }
+      if (this.focusDate && date.valueOf() === this.focusDate.valueOf())
+        cls.push('focused');
+      // Compare internal UTC date with UTC today, not local today
+      if (this.o.todayHighlight && isUTCEquals(date, today)) {
+        cls.push('today');
+      }
+      if (this.dates.contains(date) !== -1)
+        cls.push('active');
+      if (!this.dateWithinRange(date)){
+        cls.push('disabled');
+      }
+      if (this.dateIsDisabled(date)){
+        cls.push('disabled', 'disabled-date');
+      }
+      if ($.inArray(date.getUTCDay(), this.o.daysOfWeekHighlighted) !== -1){
+        cls.push('highlighted');
+      }
+
+      if (this.range){
+        if (date > this.range[0] && date < this.range[this.range.length-1]){
+          cls.push('range');
+        }
+        if ($.inArray(date.valueOf(), this.range) !== -1){
+          cls.push('selected');
+        }
+        if (date.valueOf() === this.range[0]){
+          cls.push('range-start');
+        }
+        if (date.valueOf() === this.range[this.range.length-1]){
+          cls.push('range-end');
+        }
+      }
+      return cls;
+    },
+
+    _fill_yearsView: function(selector, cssClass, factor, year, startYear, endYear, beforeFn){
+      var html = '';
+      var step = factor / 10;
+      var view = this.picker.find(selector);
+      var startVal = Math.floor(year / factor) * factor;
+      var endVal = startVal + step * 9;
+      var focusedVal = Math.floor(this.viewDate.getFullYear() / step) * step;
+      var selected = $.map(this.dates, function(d){
+        return Math.floor(d.getUTCFullYear() / step) * step;
+      });
+
+      var classes, tooltip, before;
+      for (var currVal = startVal - step; currVal <= endVal + step; currVal += step) {
+        classes = [cssClass];
+        tooltip = null;
+
+        if (currVal === startVal - step) {
+          classes.push('old');
+        } else if (currVal === endVal + step) {
+          classes.push('new');
+        }
+        if ($.inArray(currVal, selected) !== -1) {
+          classes.push('active');
+        }
+        if (currVal < startYear || currVal > endYear) {
+          classes.push('disabled');
+        }
+        if (currVal === focusedVal) {
+          classes.push('focused');
+        }
+
+        if (beforeFn !== $.noop) {
+          before = beforeFn(new Date(currVal, 0, 1));
+          if (before === undefined) {
+            before = {};
+          } else if (typeof before === 'boolean') {
+            before = {enabled: before};
+          } else if (typeof before === 'string') {
+            before = {classes: before};
+          }
+          if (before.enabled === false) {
+            classes.push('disabled');
+          }
+          if (before.classes) {
+            classes = classes.concat(before.classes.split(/\s+/));
+          }
+          if (before.tooltip) {
+            tooltip = before.tooltip;
+          }
+        }
+
+        html += '<span class="' + classes.join(' ') + '"' + (tooltip ? ' title="' + tooltip + '"' : '') + '>' + currVal + '</span>';
+      }
+
+      view.find('.datepicker-switch').text(startVal + '-' + endVal);
+      view.find('td').html(html);
+    },
+
+    fill: function(){
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        startYear = this.o.startDate !== -Infinity ? this.o.startDate.getUTCFullYear() : -Infinity,
+        startMonth = this.o.startDate !== -Infinity ? this.o.startDate.getUTCMonth() : -Infinity,
+        endYear = this.o.endDate !== Infinity ? this.o.endDate.getUTCFullYear() : Infinity,
+        endMonth = this.o.endDate !== Infinity ? this.o.endDate.getUTCMonth() : Infinity,
+        todaytxt = dates[this.o.language].today || dates['en'].today || '',
+        cleartxt = dates[this.o.language].clear || dates['en'].clear || '',
+        titleFormat = dates[this.o.language].titleFormat || dates['en'].titleFormat,
+        todayDate = UTCToday(),
+        titleBtnVisible = (this.o.todayBtn === true || this.o.todayBtn === 'linked') && todayDate >= this.o.startDate && todayDate <= this.o.endDate && !this.weekOfDateIsDisabled(todayDate),
+        tooltip,
+        before;
+      if (isNaN(year) || isNaN(month))
+        return;
+      this.picker.find('.datepicker-days .datepicker-switch')
+        .text(DPGlobal.formatDate(d, titleFormat, this.o.language));
+      this.picker.find('tfoot .today')
+        .text(todaytxt)
+        .css('display', titleBtnVisible ? 'table-cell' : 'none');
+      this.picker.find('tfoot .clear')
+        .text(cleartxt)
+        .css('display', this.o.clearBtn === true ? 'table-cell' : 'none');
+      this.picker.find('thead .datepicker-title')
+        .text(this.o.title)
+        .css('display', typeof this.o.title === 'string' && this.o.title !== '' ? 'table-cell' : 'none');
+      this.updateNavArrows();
+      this.fillMonths();
+      var prevMonth = UTCDate(year, month, 0),
+        day = prevMonth.getUTCDate();
+      prevMonth.setUTCDate(day - (prevMonth.getUTCDay() - this.o.weekStart + 7)%7);
+      var nextMonth = new Date(prevMonth);
+      if (prevMonth.getUTCFullYear() < 100){
+        nextMonth.setUTCFullYear(prevMonth.getUTCFullYear());
+      }
+      nextMonth.setUTCDate(nextMonth.getUTCDate() + 42);
+      nextMonth = nextMonth.valueOf();
+      var html = [];
+      var weekDay, clsName;
+      while (prevMonth.valueOf() < nextMonth){
+        weekDay = prevMonth.getUTCDay();
+        if (weekDay === this.o.weekStart){
+          html.push('<tr>');
+          if (this.o.calendarWeeks){
+            // ISO 8601: First week contains first thursday.
+            // ISO also states week starts on Monday, but we can be more abstract here.
+            var
+              // Start of current week: based on weekstart/current date
+              ws = new Date(+prevMonth + (this.o.weekStart - weekDay - 7) % 7 * 864e5),
+              // Thursday of this week
+              th = new Date(Number(ws) + (7 + 4 - ws.getUTCDay()) % 7 * 864e5),
+              // First Thursday of year, year from thursday
+              yth = new Date(Number(yth = UTCDate(th.getUTCFullYear(), 0, 1)) + (7 + 4 - yth.getUTCDay()) % 7 * 864e5),
+              // Calendar week: ms between thursdays, div ms per day, div 7 days
+              calWeek = (th - yth) / 864e5 / 7 + 1;
+            html.push('<td class="cw">'+ calWeek +'</td>');
+          }
+        }
+        clsName = this.getClassNames(prevMonth);
+        clsName.push('day');
+
+        var content = prevMonth.getUTCDate();
+
+        if (this.o.beforeShowDay !== $.noop){
+          before = this.o.beforeShowDay(this._utc_to_local(prevMonth));
+          if (before === undefined)
+            before = {};
+          else if (typeof before === 'boolean')
+            before = {enabled: before};
+          else if (typeof before === 'string')
+            before = {classes: before};
+          if (before.enabled === false)
+            clsName.push('disabled');
+          if (before.classes)
+            clsName = clsName.concat(before.classes.split(/\s+/));
+          if (before.tooltip)
+            tooltip = before.tooltip;
+          if (before.content)
+            content = before.content;
+        }
+
+        //Check if uniqueSort exists (supported by jquery >=1.12 and >=2.2)
+        //Fallback to unique function for older jquery versions
+        if ($.isFunction($.uniqueSort)) {
+          clsName = $.uniqueSort(clsName);
+        } else {
+          clsName = $.unique(clsName);
+        }
+
+        html.push('<td class="'+clsName.join(' ')+'"' + (tooltip ? ' title="'+tooltip+'"' : '') + ' data-date="' + prevMonth.getTime().toString() + '">' + content + '</td>');
+        tooltip = null;
+        if (weekDay === this.o.weekEnd){
+          html.push('</tr>');
+        }
+        prevMonth.setUTCDate(prevMonth.getUTCDate() + 1);
+      }
+      this.picker.find('.datepicker-days tbody').html(html.join(''));
+
+      var monthsTitle = dates[this.o.language].monthsTitle || dates['en'].monthsTitle || 'Months';
+      var months = this.picker.find('.datepicker-months')
+        .find('.datepicker-switch')
+        .text(this.o.maxViewMode < 2 ? monthsTitle : year)
+        .end()
+        .find('tbody span').removeClass('active');
+
+      $.each(this.dates, function(i, d){
+        if (d.getUTCFullYear() === year)
+          months.eq(d.getUTCMonth()).addClass('active');
+      });
+
+      if (year < startYear || year > endYear){
+        months.addClass('disabled');
+      }
+      if (year === startYear){
+        months.slice(0, startMonth).addClass('disabled');
+      }
+      if (year === endYear){
+        months.slice(endMonth+1).addClass('disabled');
+      }
+
+      if (this.o.beforeShowMonth !== $.noop){
+        var that = this;
+        $.each(months, function(i, month){
+          var moDate = new Date(year, i, 1);
+          var before = that.o.beforeShowMonth(moDate);
+          if (before === undefined)
+            before = {};
+          else if (typeof before === 'boolean')
+            before = {enabled: before};
+          else if (typeof before === 'string')
+            before = {classes: before};
+          if (before.enabled === false && !$(month).hasClass('disabled'))
+            $(month).addClass('disabled');
+          if (before.classes)
+            $(month).addClass(before.classes);
+          if (before.tooltip)
+            $(month).prop('title', before.tooltip);
+        });
+      }
+
+      // Generating decade/years picker
+      this._fill_yearsView(
+        '.datepicker-years',
+        'year',
+        10,
+        year,
+        startYear,
+        endYear,
+        this.o.beforeShowYear
+      );
+
+      // Generating century/decades picker
+      this._fill_yearsView(
+        '.datepicker-decades',
+        'decade',
+        100,
+        year,
+        startYear,
+        endYear,
+        this.o.beforeShowDecade
+      );
+
+      // Generating millennium/centuries picker
+      this._fill_yearsView(
+        '.datepicker-centuries',
+        'century',
+        1000,
+        year,
+        startYear,
+        endYear,
+        this.o.beforeShowCentury
+      );
+    },
+
+    updateNavArrows: function(){
+      if (!this._allow_update)
+        return;
+
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        startYear = this.o.startDate !== -Infinity ? this.o.startDate.getUTCFullYear() : -Infinity,
+        startMonth = this.o.startDate !== -Infinity ? this.o.startDate.getUTCMonth() : -Infinity,
+        endYear = this.o.endDate !== Infinity ? this.o.endDate.getUTCFullYear() : Infinity,
+        endMonth = this.o.endDate !== Infinity ? this.o.endDate.getUTCMonth() : Infinity,
+        prevIsDisabled,
+        nextIsDisabled,
+        factor = 1;
+      switch (this.viewMode){
+        case 4:
+          factor *= 10;
+        /* falls through */
+        case 3:
+          factor *= 10;
+        /* falls through */
+        case 2:
+          factor *= 10;
+        /* falls through */
+        case 1:
+          prevIsDisabled = Math.floor(year / factor) * factor <= startYear;
+          nextIsDisabled = Math.floor(year / factor) * factor + factor > endYear;
+          break;
+        case 0:
+          prevIsDisabled = year <= startYear && month <= startMonth;
+          nextIsDisabled = year >= endYear && month >= endMonth;
+          break;
+      }
+
+      this.picker.find('.prev').toggleClass('disabled', prevIsDisabled);
+      this.picker.find('.next').toggleClass('disabled', nextIsDisabled);
+    },
+
+    click: function(e){
+      e.preventDefault();
+      e.stopPropagation();
+
+      var target, dir, day, year, month;
+      target = $(e.target);
+
+      // Clicked on the switch
+      if (target.hasClass('datepicker-switch') && this.viewMode !== this.o.maxViewMode){
+        this.setViewMode(this.viewMode + 1);
+      }
+
+      // Clicked on today button
+      if (target.hasClass('today') && !target.hasClass('day')){
+        this.setViewMode(0);
+        this._setDate(UTCToday(), this.o.todayBtn === 'linked' ? null : 'view');
+      }
+
+      // Clicked on clear button
+      if (target.hasClass('clear')){
+        this.clearDates();
+      }
+
+      if (!target.hasClass('disabled')){
+        // Clicked on a month, year, decade, century
+        if (target.hasClass('month')
+          || target.hasClass('year')
+          || target.hasClass('decade')
+          || target.hasClass('century')) {
+          this.viewDate.setUTCDate(1);
+
+          day = 1;
+          if (this.viewMode === 1){
+            month = target.parent().find('span').index(target);
+            year = this.viewDate.getUTCFullYear();
+            this.viewDate.setUTCMonth(month);
+          } else {
+            month = 0;
+            year = Number(target.text());
+            this.viewDate.setUTCFullYear(year);
+          }
+
+          this._trigger(DPGlobal.viewModes[this.viewMode - 1].e, this.viewDate);
+
+          if (this.viewMode === this.o.minViewMode){
+            this._setDate(UTCDate(year, month, day));
+          } else {
+            this.setViewMode(this.viewMode - 1);
+            this.fill();
+          }
+        }
+      }
+
+      if (this.picker.is(':visible') && this._focused_from){
+        this._focused_from.focus();
+      }
+      delete this._focused_from;
+    },
+
+    dayCellClick: function(e){
+      var $target = $(e.currentTarget);
+      var timestamp = $target.data('date');
+      var date = new Date(timestamp);
+
+      if (this.o.updateViewDate) {
+        if (date.getUTCFullYear() !== this.viewDate.getUTCFullYear()) {
+          this._trigger('changeYear', this.viewDate);
+        }
+
+        if (date.getUTCMonth() !== this.viewDate.getUTCMonth()) {
+          this._trigger('changeMonth', this.viewDate);
+        }
+      }
+      this._setDate(date);
+    },
+
+    // Clicked on prev or next
+    navArrowsClick: function(e){
+      var $target = $(e.currentTarget);
+      var dir = $target.hasClass('prev') ? -1 : 1;
+      if (this.viewMode !== 0){
+        dir *= DPGlobal.viewModes[this.viewMode].navStep * 12;
+      }
+      this.viewDate = this.moveMonth(this.viewDate, dir);
+      this._trigger(DPGlobal.viewModes[this.viewMode].e, this.viewDate);
+      this.fill();
+    },
+
+    _toggle_multidate: function(date){
+      var ix = this.dates.contains(date);
+      if (!date){
+        this.dates.clear();
+      }
+
+      if (ix !== -1){
+        if (this.o.multidate === true || this.o.multidate > 1 || this.o.toggleActive){
+          this.dates.remove(ix);
+        }
+      } else if (this.o.multidate === false) {
+        this.dates.clear();
+        this.dates.push(date);
+      }
+      else {
+        this.dates.push(date);
+      }
+
+      if (typeof this.o.multidate === 'number')
+        while (this.dates.length > this.o.multidate)
+          this.dates.remove(0);
+    },
+
+    _setDate: function(date, which){
+      if (!which || which === 'date')
+        this._toggle_multidate(date && new Date(date));
+      if ((!which && this.o.updateViewDate) || which === 'view')
+        this.viewDate = date && new Date(date);
+
+      this.fill();
+      this.setValue();
+      if (!which || which !== 'view') {
+        this._trigger('changeDate');
+      }
+      this.inputField.trigger('change');
+      if (this.o.autoclose && (!which || which === 'date')){
+        this.hide();
+      }
+    },
+
+    moveDay: function(date, dir){
+      var newDate = new Date(date);
+      newDate.setUTCDate(date.getUTCDate() + dir);
+
+      return newDate;
+    },
+
+    moveWeek: function(date, dir){
+      return this.moveDay(date, dir * 7);
+    },
+
+    moveMonth: function(date, dir){
+      if (!isValidDate(date))
+        return this.o.defaultViewDate;
+      if (!dir)
+        return date;
+      var new_date = new Date(date.valueOf()),
+        day = new_date.getUTCDate(),
+        month = new_date.getUTCMonth(),
+        mag = Math.abs(dir),
+        new_month, test;
+      dir = dir > 0 ? 1 : -1;
+      if (mag === 1){
+        test = dir === -1
+          // If going back one month, make sure month is not current month
+          // (eg, Mar 31 -> Feb 31 == Feb 28, not Mar 02)
+          ? function(){
+            return new_date.getUTCMonth() === month;
+          }
+          // If going forward one month, make sure month is as expected
+          // (eg, Jan 31 -> Feb 31 == Feb 28, not Mar 02)
+          : function(){
+            return new_date.getUTCMonth() !== new_month;
+          };
+        new_month = month + dir;
+        new_date.setUTCMonth(new_month);
+        // Dec -> Jan (12) or Jan -> Dec (-1) -- limit expected date to 0-11
+        new_month = (new_month + 12) % 12;
+      }
+      else {
+        // For magnitudes >1, move one month at a time...
+        for (var i=0; i < mag; i++)
+          // ...which might decrease the day (eg, Jan 31 to Feb 28, etc)...
+          new_date = this.moveMonth(new_date, dir);
+        // ...then reset the day, keeping it in the new month
+        new_month = new_date.getUTCMonth();
+        new_date.setUTCDate(day);
+        test = function(){
+          return new_month !== new_date.getUTCMonth();
+        };
+      }
+      // Common date-resetting loop -- if date is beyond end of month, make it
+      // end of month
+      while (test()){
+        new_date.setUTCDate(--day);
+        new_date.setUTCMonth(new_month);
+      }
+      return new_date;
+    },
+
+    moveYear: function(date, dir){
+      return this.moveMonth(date, dir*12);
+    },
+
+    moveAvailableDate: function(date, dir, fn){
+      do {
+        date = this[fn](date, dir);
+
+        if (!this.dateWithinRange(date))
+          return false;
+
+        fn = 'moveDay';
+      }
+      while (this.dateIsDisabled(date));
+
+      return date;
+    },
+
+    weekOfDateIsDisabled: function(date){
+      return $.inArray(date.getUTCDay(), this.o.daysOfWeekDisabled) !== -1;
+    },
+
+    dateIsDisabled: function(date){
+      return (
+        this.weekOfDateIsDisabled(date) ||
+        $.grep(this.o.datesDisabled, function(d){
+          return isUTCEquals(date, d);
+        }).length > 0
+      );
+    },
+
+    dateWithinRange: function(date){
+      return date >= this.o.startDate && date <= this.o.endDate;
+    },
+
+    keydown: function(e){
+      if (!this.picker.is(':visible')){
+        if (e.keyCode === 40 || e.keyCode === 27) { // allow down to re-show picker
+          this.show();
+          e.stopPropagation();
+        }
+        return;
+      }
+      var dateChanged = false,
+        dir, newViewDate,
+        focusDate = this.focusDate || this.viewDate;
+      switch (e.keyCode){
+        case 27: // escape
+          if (this.focusDate){
+            this.focusDate = null;
+            this.viewDate = this.dates.get(-1) || this.viewDate;
+            this.fill();
+          }
+          else
+            this.hide();
+          e.preventDefault();
+          e.stopPropagation();
+          break;
+        case 37: // left
+        case 38: // up
+        case 39: // right
+        case 40: // down
+          if (!this.o.keyboardNavigation || this.o.daysOfWeekDisabled.length === 7)
+            break;
+          dir = e.keyCode === 37 || e.keyCode === 38 ? -1 : 1;
+          if (this.viewMode === 0) {
+            if (e.ctrlKey){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveYear');
+
+              if (newViewDate)
+                this._trigger('changeYear', this.viewDate);
+            } else if (e.shiftKey){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveMonth');
+
+              if (newViewDate)
+                this._trigger('changeMonth', this.viewDate);
+            } else if (e.keyCode === 37 || e.keyCode === 39){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveDay');
+            } else if (!this.weekOfDateIsDisabled(focusDate)){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveWeek');
+            }
+          } else if (this.viewMode === 1) {
+            if (e.keyCode === 38 || e.keyCode === 40) {
+              dir = dir * 4;
+            }
+            newViewDate = this.moveAvailableDate(focusDate, dir, 'moveMonth');
+          } else if (this.viewMode === 2) {
+            if (e.keyCode === 38 || e.keyCode === 40) {
+              dir = dir * 4;
+            }
+            newViewDate = this.moveAvailableDate(focusDate, dir, 'moveYear');
+          }
+          if (newViewDate){
+            this.focusDate = this.viewDate = newViewDate;
+            this.setValue();
+            this.fill();
+            e.preventDefault();
+          }
+          break;
+        case 13: // enter
+          if (!this.o.forceParse)
+            break;
+          focusDate = this.focusDate || this.dates.get(-1) || this.viewDate;
+          if (this.o.keyboardNavigation) {
+            this._toggle_multidate(focusDate);
+            dateChanged = true;
+          }
+          this.focusDate = null;
+          this.viewDate = this.dates.get(-1) || this.viewDate;
+          this.setValue();
+          this.fill();
+          if (this.picker.is(':visible')){
+            e.preventDefault();
+            e.stopPropagation();
+            if (this.o.autoclose)
+              this.hide();
+          }
+          break;
+        case 9: // tab
+          this.focusDate = null;
+          this.viewDate = this.dates.get(-1) || this.viewDate;
+          this.fill();
+          this.hide();
+          break;
+      }
+      if (dateChanged){
+        if (this.dates.length)
+          this._trigger('changeDate');
+        else
+          this._trigger('clearDate');
+        this.inputField.trigger('change');
+      }
+    },
+
+    setViewMode: function(viewMode){
+      this.viewMode = viewMode;
+      this.picker
+        .children('div')
+        .hide()
+        .filter('.datepicker-' + DPGlobal.viewModes[this.viewMode].clsName)
+        .show();
+      this.updateNavArrows();
+      this._trigger('changeViewMode', new Date(this.viewDate));
+    }
+  };
+
+  var DateRangePicker = function(element, options){
+    $.data(element, 'datepicker', this);
+    this.element = $(element);
+    this.inputs = $.map(options.inputs, function(i){
+      return i.jquery ? i[0] : i;
+    });
+    delete options.inputs;
+
+    this.keepEmptyValues = options.keepEmptyValues;
+    delete options.keepEmptyValues;
+
+    datepickerPlugin.call($(this.inputs), options)
+      .on('changeDate', $.proxy(this.dateUpdated, this));
+
+    this.pickers = $.map(this.inputs, function(i){
+      return $.data(i, 'datepicker');
+    });
+    this.updateDates();
+  };
+  DateRangePicker.prototype = {
+    updateDates: function(){
+      this.dates = $.map(this.pickers, function(i){
+        return i.getUTCDate();
+      });
+      this.updateRanges();
+    },
+    updateRanges: function(){
+      var range = $.map(this.dates, function(d){
+        return d.valueOf();
+      });
+      $.each(this.pickers, function(i, p){
+        p.setRange(range);
+      });
+    },
+    clearDates: function(){
+      $.each(this.pickers, function(i, p){
+        p.clearDates();
+      });
+    },
+    dateUpdated: function(e){
+      // `this.updating` is a workaround for preventing infinite recursion
+      // between `changeDate` triggering and `setUTCDate` calling.  Until
+      // there is a better mechanism.
+      if (this.updating)
+        return;
+      this.updating = true;
+
+      var dp = $.data(e.target, 'datepicker');
+
+      if (dp === undefined) {
+        return;
+      }
+
+      var new_date = dp.getUTCDate(),
+        keep_empty_values = this.keepEmptyValues,
+        i = $.inArray(e.target, this.inputs),
+        j = i - 1,
+        k = i + 1,
+        l = this.inputs.length;
+      if (i === -1)
+        return;
+
+      $.each(this.pickers, function(i, p){
+        if (!p.getUTCDate() && (p === dp || !keep_empty_values))
+          p.setUTCDate(new_date);
+      });
+
+      if (new_date < this.dates[j]){
+        // Date being moved earlier/left
+        while (j >= 0 && new_date < this.dates[j]){
+          this.pickers[j--].setUTCDate(new_date);
+        }
+      } else if (new_date > this.dates[k]){
+        // Date being moved later/right
+        while (k < l && new_date > this.dates[k]){
+          this.pickers[k++].setUTCDate(new_date);
+        }
+      }
+      this.updateDates();
+
+      delete this.updating;
+    },
+    destroy: function(){
+      $.map(this.pickers, function(p){ p.destroy(); });
+      $(this.inputs).off('changeDate', this.dateUpdated);
+      delete this.element.data().datepicker;
+    },
+    remove: alias('destroy', 'Method `remove` is deprecated and will be removed in version 2.0. Use `destroy` instead')
+  };
+
+  function opts_from_el(el, prefix){
+    // Derive options from element data-attrs
+    var data = $(el).data(),
+      out = {}, inkey,
+      replace = new RegExp('^' + prefix.toLowerCase() + '([A-Z])');
+    prefix = new RegExp('^' + prefix.toLowerCase());
+    function re_lower(_,a){
+      return a.toLowerCase();
+    }
+    for (var key in data)
+      if (prefix.test(key)){
+        inkey = key.replace(replace, re_lower);
+        out[inkey] = data[key];
+      }
+    return out;
+  }
+
+  function opts_from_locale(lang){
+    // Derive options from locale plugins
+    var out = {};
+    // Check if "de-DE" style date is available, if not language should
+    // fallback to 2 letter code eg "de"
+    if (!dates[lang]){
+      lang = lang.split('-')[0];
+      if (!dates[lang])
+        return;
+    }
+    var d = dates[lang];
+    $.each(locale_opts, function(i,k){
+      if (k in d)
+        out[k] = d[k];
+    });
+    return out;
+  }
+
+  var old = $.fn.datepicker;
+  var datepickerPlugin = function(option){
+    var args = Array.apply(null, arguments);
+    args.shift();
+    var internal_return;
+    this.each(function(){
+      var $this = $(this),
+        data = $this.data('datepicker'),
+        options = typeof option === 'object' && option;
+      if (!data){
+        var elopts = opts_from_el(this, 'date'),
+          // Preliminary otions
+          xopts = $.extend({}, defaults, elopts, options),
+          locopts = opts_from_locale(xopts.language),
+          // Options priority: js args, data-attrs, locales, defaults
+          opts = $.extend({}, defaults, locopts, elopts, options);
+        if ($this.hasClass('input-daterange') || opts.inputs){
+          $.extend(opts, {
+            inputs: opts.inputs || $this.find('input').toArray()
+          });
+          data = new DateRangePicker(this, opts);
+        }
+        else {
+          data = new Datepicker(this, opts);
+        }
+        $this.data('datepicker', data);
+      }
+      if (typeof option === 'string' && typeof data[option] === 'function'){
+        internal_return = data[option].apply(data, args);
+      }
+    });
+
+    if (
+      internal_return === undefined ||
+      internal_return instanceof Datepicker ||
+      internal_return instanceof DateRangePicker
+    )
+      return this;
+
+    if (this.length > 1)
+      throw new Error('Using only allowed for the collection of a single element (' + option + ' function)');
+    else
+      return internal_return;
+  };
+  $.fn.datepicker = datepickerPlugin;
+
+  var defaults = $.fn.datepicker.defaults = {
+    assumeNearbyYear: false,
+    autoclose: false,
+    beforeShowDay: $.noop,
+    beforeShowMonth: $.noop,
+    beforeShowYear: $.noop,
+    beforeShowDecade: $.noop,
+    beforeShowCentury: $.noop,
+    calendarWeeks: false,
+    clearBtn: false,
+    toggleActive: false,
+    daysOfWeekDisabled: [],
+    daysOfWeekHighlighted: [],
+    datesDisabled: [],
+    endDate: Infinity,
+    forceParse: true,
+    format: 'mm/dd/yyyy',
+    keepEmptyValues: false,
+    keyboardNavigation: true,
+    language: 'en',
+    minViewMode: 0,
+    maxViewMode: 4,
+    multidate: false,
+    multidateSeparator: ',',
+    orientation: "auto",
+    rtl: false,
+    startDate: -Infinity,
+    startView: 0,
+    todayBtn: false,
+    todayHighlight: false,
+    updateViewDate: true,
+    weekStart: 0,
+    disableTouchKeyboard: false,
+    enableOnReadonly: true,
+    showOnFocus: true,
+    zIndexOffset: 10,
+    container: 'body',
+    immediateUpdates: false,
+    title: '',
+    templates: {
+      leftArrow: '&#x00AB;',
+      rightArrow: '&#x00BB;'
+    },
+    showWeekDays: true
+  };
+  var locale_opts = $.fn.datepicker.locale_opts = [
+    'format',
+    'rtl',
+    'weekStart'
+  ];
+  $.fn.datepicker.Constructor = Datepicker;
+  var dates = $.fn.datepicker.dates = {
+    en: {
+      days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
+      daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+      daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
+      months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
+      monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+      today: "Today",
+      clear: "Clear",
+      titleFormat: "MM yyyy"
+    }
+  };
+
+  var DPGlobal = {
+    viewModes: [
+      {
+        names: ['days', 'month'],
+        clsName: 'days',
+        e: 'changeMonth'
+      },
+      {
+        names: ['months', 'year'],
+        clsName: 'months',
+        e: 'changeYear',
+        navStep: 1
+      },
+      {
+        names: ['years', 'decade'],
+        clsName: 'years',
+        e: 'changeDecade',
+        navStep: 10
+      },
+      {
+        names: ['decades', 'century'],
+        clsName: 'decades',
+        e: 'changeCentury',
+        navStep: 100
+      },
+      {
+        names: ['centuries', 'millennium'],
+        clsName: 'centuries',
+        e: 'changeMillennium',
+        navStep: 1000
+      }
+    ],
+    validParts: /dd?|DD?|mm?|MM?|yy(?:yy)?/g,
+    nonpunctuation: /[^ -\/:-@\u5e74\u6708\u65e5\[-`{-~\t\n\r]+/g,
+    parseFormat: function(format){
+      if (typeof format.toValue === 'function' && typeof format.toDisplay === 'function')
+        return format;
+      // IE treats \0 as a string end in inputs (truncating the value),
+      // so it's a bad format delimiter, anyway
+      var separators = format.replace(this.validParts, '\0').split('\0'),
+        parts = format.match(this.validParts);
+      if (!separators || !separators.length || !parts || parts.length === 0){
+        throw new Error("Invalid date format.");
+      }
+      return {separators: separators, parts: parts};
+    },
+    parseDate: function(date, format, language, assumeNearby){
+      if (!date)
+        return undefined;
+      if (date instanceof Date)
+        return date;
+      if (typeof format === 'string')
+        format = DPGlobal.parseFormat(format);
+      if (format.toValue)
+        return format.toValue(date, format, language);
+      var fn_map = {
+          d: 'moveDay',
+          m: 'moveMonth',
+          w: 'moveWeek',
+          y: 'moveYear'
+        },
+        dateAliases = {
+          yesterday: '-1d',
+          today: '+0d',
+          tomorrow: '+1d'
+        },
+        parts, part, dir, i, fn;
+      if (date in dateAliases){
+        date = dateAliases[date];
+      }
+      if (/^[\-+]\d+[dmwy]([\s,]+[\-+]\d+[dmwy])*$/i.test(date)){
+        parts = date.match(/([\-+]\d+)([dmwy])/gi);
+        date = new Date();
+        for (i=0; i < parts.length; i++){
+          part = parts[i].match(/([\-+]\d+)([dmwy])/i);
+          dir = Number(part[1]);
+          fn = fn_map[part[2].toLowerCase()];
+          date = Datepicker.prototype[fn](date, dir);
+        }
+        return Datepicker.prototype._zero_utc_time(date);
+      }
+
+      parts = date && date.match(this.nonpunctuation) || [];
+
+      function applyNearbyYear(year, threshold){
+        if (threshold === true)
+          threshold = 10;
+
+        // if year is 2 digits or less, than the user most likely is trying to get a recent century
+        if (year < 100){
+          year += 2000;
+          // if the new year is more than threshold years in advance, use last century
+          if (year > ((new Date()).getFullYear()+threshold)){
+            year -= 100;
+          }
+        }
+
+        return year;
+      }
+
+      var parsed = {},
+        setters_order = ['yyyy', 'yy', 'M', 'MM', 'm', 'mm', 'd', 'dd'],
+        setters_map = {
+          yyyy: function(d,v){
+            return d.setUTCFullYear(assumeNearby ? applyNearbyYear(v, assumeNearby) : v);
+          },
+          m: function(d,v){
+            if (isNaN(d))
+              return d;
+            v -= 1;
+            while (v < 0) v += 12;
+            v %= 12;
+            d.setUTCMonth(v);
+            while (d.getUTCMonth() !== v)
+              d.setUTCDate(d.getUTCDate()-1);
+            return d;
+          },
+          d: function(d,v){
+            return d.setUTCDate(v);
+          }
+        },
+        val, filtered;
+      setters_map['yy'] = setters_map['yyyy'];
+      setters_map['M'] = setters_map['MM'] = setters_map['mm'] = setters_map['m'];
+      setters_map['dd'] = setters_map['d'];
+      date = UTCToday();
+      var fparts = format.parts.slice();
+      // Remove noop parts
+      if (parts.length !== fparts.length){
+        fparts = $(fparts).filter(function(i,p){
+          return $.inArray(p, setters_order) !== -1;
+        }).toArray();
+      }
+      // Process remainder
+      function match_part(){
+        var m = this.slice(0, parts[i].length),
+          p = parts[i].slice(0, m.length);
+        return m.toLowerCase() === p.toLowerCase();
+      }
+      if (parts.length === fparts.length){
+        var cnt;
+        for (i=0, cnt = fparts.length; i < cnt; i++){
+          val = parseInt(parts[i], 10);
+          part = fparts[i];
+          if (isNaN(val)){
+            switch (part){
+              case 'MM':
+                filtered = $(dates[language].months).filter(match_part);
+                val = $.inArray(filtered[0], dates[language].months) + 1;
+                break;
+              case 'M':
+                filtered = $(dates[language].monthsShort).filter(match_part);
+                val = $.inArray(filtered[0], dates[language].monthsShort) + 1;
+                break;
+            }
+          }
+          parsed[part] = val;
+        }
+        var _date, s;
+        for (i=0; i < setters_order.length; i++){
+          s = setters_order[i];
+          if (s in parsed && !isNaN(parsed[s])){
+            _date = new Date(date);
+            setters_map[s](_date, parsed[s]);
+            if (!isNaN(_date))
+              date = _date;
+          }
+        }
+      }
+      return date;
+    },
+    formatDate: function(date, format, language){
+      if (!date)
+        return '';
+      if (typeof format === 'string')
+        format = DPGlobal.parseFormat(format);
+      if (format.toDisplay)
+        return format.toDisplay(date, format, language);
+      var val = {
+        d: date.getUTCDate(),
+        D: dates[language].daysShort[date.getUTCDay()],
+        DD: dates[language].days[date.getUTCDay()],
+        m: date.getUTCMonth() + 1,
+        M: dates[language].monthsShort[date.getUTCMonth()],
+        MM: dates[language].months[date.getUTCMonth()],
+        yy: date.getUTCFullYear().toString().substring(2),
+        yyyy: date.getUTCFullYear()
+      };
+      val.dd = (val.d < 10 ? '0' : '') + val.d;
+      val.mm = (val.m < 10 ? '0' : '') + val.m;
+      date = [];
+      var seps = $.extend([], format.separators);
+      for (var i=0, cnt = format.parts.length; i <= cnt; i++){
+        if (seps.length)
+          date.push(seps.shift());
+        date.push(val[format.parts[i]]);
+      }
+      return date.join('');
+    },
+    headTemplate: '<thead>'+
+      '<tr>'+
+      '<th colspan="7" class="datepicker-title"></th>'+
+      '</tr>'+
+      '<tr>'+
+      '<th class="prev">'+defaults.templates.leftArrow+'</th>'+
+      '<th colspan="5" class="datepicker-switch"></th>'+
+      '<th class="next">'+defaults.templates.rightArrow+'</th>'+
+      '</tr>'+
+      '</thead>',
+    contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>',
+    footTemplate: '<tfoot>'+
+      '<tr>'+
+      '<th colspan="7" class="today"></th>'+
+      '</tr>'+
+      '<tr>'+
+      '<th colspan="7" class="clear"></th>'+
+      '</tr>'+
+      '</tfoot>'
+  };
+  DPGlobal.template = '<div class="datepicker">'+
+    '<div class="datepicker-days">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    '<tbody></tbody>'+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-months">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-years">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-decades">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-centuries">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '</div>';
+
+  $.fn.datepicker.DPGlobal = DPGlobal;
+
+
+  /* DATEPICKER NO CONFLICT
+  * =================== */
+
+  $.fn.datepicker.noConflict = function(){
+    $.fn.datepicker = old;
+    return this;
+  };
+
+  /* DATEPICKER VERSION
+   * =================== */
+  $.fn.datepicker.version = '1.9.0';
+
+  $.fn.datepicker.deprecated = function(msg){
+    var console = window.console;
+    if (console && console.warn) {
+      console.warn('DEPRECATED: ' + msg);
+    }
+  };
+
+
+  /* DATEPICKER DATA-API
+  * ================== */
+
+  $(document).on(
+    'focus.datepicker.data-api click.datepicker.data-api',
+    '[data-provide="datepicker"]',
+    function(e){
+      var $this = $(this);
+      if ($this.data('datepicker'))
+        return;
+      e.preventDefault();
+      // component click requires us to explicitly show it
+      datepickerPlugin.call($this, 'show');
+    }
+  );
+  $(function(){
+    datepickerPlugin.call($('[data-provide="datepicker-inline"]'));
+  });
+
+}));
+/* =========================================================
+ * bootstrap-datetimepicker.js
+ * =========================================================
+ * Copyright 2012 Stefan Petre
+ *
+ * Improvements by Andrew Rowls
+ * Improvements by Sébastien Malot
+ * Improvements by Yun Lai
+ * Improvements by Kenneth Henderick
+ * Improvements by CuGBabyBeaR
+ * Improvements by Christian Vaas <auspex@auspex.eu>
+ *
+ * Project URL : http://www.malot.fr/bootstrap-datetimepicker
+ *
+ * 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.
+ * ========================================================= */
+
+
+(function(factory){
+    if (typeof define === 'function' && define.amd)
+      define(['jquery'], factory);
+    else if (typeof exports === 'object')
+      factory(require('jquery'));
+    else
+      factory(jQuery);
+
+}(function($, undefined){
+
+  // Add ECMA262-5 Array methods if not supported natively (IE8)
+  if (!('indexOf' in Array.prototype)) {
+    Array.prototype.indexOf = function (find, i) {
+      if (i === undefined) i = 0;
+      if (i < 0) i += this.length;
+      if (i < 0) i = 0;
+      for (var n = this.length; i < n; i++) {
+        if (i in this && this[i] === find) {
+          return i;
+        }
+      }
+      return -1;
+    }
+  }
+
+  // Add timezone abbreviation support for ie6+, Chrome, Firefox
+  function timeZoneAbbreviation() {
+    var abbreviation, date, formattedStr, i, len, matchedStrings, ref, str;
+    date = (new Date()).toString();
+    formattedStr = ((ref = date.split('(')[1]) != null ? ref.slice(0, -1) : 0) || date.split(' ');
+    if (formattedStr instanceof Array) {
+      matchedStrings = [];
+      for (var i = 0, len = formattedStr.length; i < len; i++) {
+        str = formattedStr[i];
+        if ((abbreviation = (ref = str.match(/\b[A-Z]+\b/)) !== null) ? ref[0] : 0) {
+          matchedStrings.push(abbreviation);
+        }
+      }
+      formattedStr = matchedStrings.pop();
+    }
+    return formattedStr;
+  }
+
+  function UTCDate() {
+    return new Date(Date.UTC.apply(Date, arguments));
+  }
+
+  // Picker object
+  var Datetimepicker = function (element, options) {
+    var that = this;
+
+    this.element = $(element);
+
+    // add container for single page application
+    // when page switch the datetimepicker div will be removed also.
+    this.container = options.container || 'body';
+
+    this.language = options.language || this.element.data('date-language') || 'en';
+    this.language = this.language in dates ? this.language : this.language.split('-')[0]; // fr-CA fallback to fr
+    this.language = this.language in dates ? this.language : 'en';
+    this.isRTL = dates[this.language].rtl || false;
+    this.formatType = options.formatType || this.element.data('format-type') || 'standard';
+    this.format = DPGlobal.parseFormat(options.format || this.element.data('date-format') || dates[this.language].format || DPGlobal.getDefaultFormat(this.formatType, 'input'), this.formatType);
+    this.isInline = false;
+    this.isVisible = false;
+    this.isInput = this.element.is('input');
+    this.fontAwesome = options.fontAwesome || this.element.data('font-awesome') || false;
+
+    this.bootcssVer = options.bootcssVer || (this.isInput ? (this.element.is('.form-control') ? 3 : 2) : ( this.bootcssVer = this.element.is('.input-group') ? 3 : 2 ));
+
+    this.component = this.element.is('.date') ? ( this.bootcssVer === 3 ? this.element.find('.input-group-addon .glyphicon-th, .input-group-addon .glyphicon-time, .input-group-addon .glyphicon-remove, .input-group-addon .glyphicon-calendar, .input-group-addon .fa-calendar, .input-group-addon .fa-clock-o').parent() : this.element.find('.add-on .icon-th, .add-on .icon-time, .add-on .icon-calendar, .add-on .fa-calendar, .add-on .fa-clock-o').parent()) : false;
+    this.componentReset = this.element.is('.date') ? ( this.bootcssVer === 3 ? this.element.find('.input-group-addon .glyphicon-remove, .input-group-addon .fa-times').parent():this.element.find('.add-on .icon-remove, .add-on .fa-times').parent()) : false;
+    this.hasInput = this.component && this.element.find('input').length;
+    if (this.component && this.component.length === 0) {
+      this.component = false;
+    }
+    this.linkField = options.linkField || this.element.data('link-field') || false;
+    this.linkFormat = DPGlobal.parseFormat(options.linkFormat || this.element.data('link-format') || DPGlobal.getDefaultFormat(this.formatType, 'link'), this.formatType);
+    this.minuteStep = options.minuteStep || this.element.data('minute-step') || 5;
+    this.pickerPosition = options.pickerPosition || this.element.data('picker-position') || 'bottom-right';
+    this.showMeridian = options.showMeridian || this.element.data('show-meridian') || false;
+    this.initialDate = options.initialDate || new Date();
+    this.zIndex = options.zIndex || this.element.data('z-index') || undefined;
+    this.title = typeof options.title === 'undefined' ? false : options.title;
+    this.timezone = options.timezone || timeZoneAbbreviation();
+
+    this.icons = {
+      leftArrow: this.fontAwesome ? 'fa-arrow-left' : (this.bootcssVer === 3 ? 'glyphicon-arrow-left' : 'icon-arrow-left'),
+      rightArrow: this.fontAwesome ? 'fa-arrow-right' : (this.bootcssVer === 3 ? 'glyphicon-arrow-right' : 'icon-arrow-right')
+    }
+    this.icontype = this.fontAwesome ? 'fa' : 'glyphicon';
+
+    this._attachEvents();
+
+    this.clickedOutside = function (e) {
+        // Clicked outside the datetimepicker, hide it
+        if ($(e.target).closest('.datetimepicker').length === 0) {
+            that.hide();
+        }
+    }
+
+    this.formatViewType = 'datetime';
+    if ('formatViewType' in options) {
+      this.formatViewType = options.formatViewType;
+    } else if ('formatViewType' in this.element.data()) {
+      this.formatViewType = this.element.data('formatViewType');
+    }
+
+    this.minView = 0;
+    if ('minView' in options) {
+      this.minView = options.minView;
+    } else if ('minView' in this.element.data()) {
+      this.minView = this.element.data('min-view');
+    }
+    this.minView = DPGlobal.convertViewMode(this.minView);
+
+    this.maxView = DPGlobal.modes.length - 1;
+    if ('maxView' in options) {
+      this.maxView = options.maxView;
+    } else if ('maxView' in this.element.data()) {
+      this.maxView = this.element.data('max-view');
+    }
+    this.maxView = DPGlobal.convertViewMode(this.maxView);
+
+    this.wheelViewModeNavigation = false;
+    if ('wheelViewModeNavigation' in options) {
+      this.wheelViewModeNavigation = options.wheelViewModeNavigation;
+    } else if ('wheelViewModeNavigation' in this.element.data()) {
+      this.wheelViewModeNavigation = this.element.data('view-mode-wheel-navigation');
+    }
+
+    this.wheelViewModeNavigationInverseDirection = false;
+
+    if ('wheelViewModeNavigationInverseDirection' in options) {
+      this.wheelViewModeNavigationInverseDirection = options.wheelViewModeNavigationInverseDirection;
+    } else if ('wheelViewModeNavigationInverseDirection' in this.element.data()) {
+      this.wheelViewModeNavigationInverseDirection = this.element.data('view-mode-wheel-navigation-inverse-dir');
+    }
+
+    this.wheelViewModeNavigationDelay = 100;
+    if ('wheelViewModeNavigationDelay' in options) {
+      this.wheelViewModeNavigationDelay = options.wheelViewModeNavigationDelay;
+    } else if ('wheelViewModeNavigationDelay' in this.element.data()) {
+      this.wheelViewModeNavigationDelay = this.element.data('view-mode-wheel-navigation-delay');
+    }
+
+    this.startViewMode = 2;
+    if ('startView' in options) {
+      this.startViewMode = options.startView;
+    } else if ('startView' in this.element.data()) {
+      this.startViewMode = this.element.data('start-view');
+    }
+    this.startViewMode = DPGlobal.convertViewMode(this.startViewMode);
+    this.viewMode = this.startViewMode;
+
+    this.viewSelect = this.minView;
+    if ('viewSelect' in options) {
+      this.viewSelect = options.viewSelect;
+    } else if ('viewSelect' in this.element.data()) {
+      this.viewSelect = this.element.data('view-select');
+    }
+    this.viewSelect = DPGlobal.convertViewMode(this.viewSelect);
+
+    this.forceParse = true;
+    if ('forceParse' in options) {
+      this.forceParse = options.forceParse;
+    } else if ('dateForceParse' in this.element.data()) {
+      this.forceParse = this.element.data('date-force-parse');
+    }
+    var template = this.bootcssVer === 3 ? DPGlobal.templateV3 : DPGlobal.template;
+    while (template.indexOf('{iconType}') !== -1) {
+      template = template.replace('{iconType}', this.icontype);
+    }
+    while (template.indexOf('{leftArrow}') !== -1) {
+      template = template.replace('{leftArrow}', this.icons.leftArrow);
+    }
+    while (template.indexOf('{rightArrow}') !== -1) {
+      template = template.replace('{rightArrow}', this.icons.rightArrow);
+    }
+    this.picker = $(template)
+      .appendTo(this.isInline ? this.element : this.container) // 'body')
+      .on({
+        click:     $.proxy(this.click, this),
+        mousedown: $.proxy(this.mousedown, this)
+      });
+
+    if (this.wheelViewModeNavigation) {
+      if ($.fn.mousewheel) {
+        this.picker.on({mousewheel: $.proxy(this.mousewheel, this)});
+      } else {
+        console.log('Mouse Wheel event is not supported. Please include the jQuery Mouse Wheel plugin before enabling this option');
+      }
+    }
+
+    if (this.isInline) {
+      this.picker.addClass('datetimepicker-inline');
+    } else {
+      this.picker.addClass('datetimepicker-dropdown-' + this.pickerPosition + ' dropdown-menu');
+    }
+    if (this.isRTL) {
+      this.picker.addClass('datetimepicker-rtl');
+      var selector = this.bootcssVer === 3 ? '.prev span, .next span' : '.prev i, .next i';
+      this.picker.find(selector).toggleClass(this.icons.leftArrow + ' ' + this.icons.rightArrow);
+    }
+
+    $(document).on('mousedown touchend', this.clickedOutside);
+
+    this.autoclose = false;
+    if ('autoclose' in options) {
+      this.autoclose = options.autoclose;
+    } else if ('dateAutoclose' in this.element.data()) {
+      this.autoclose = this.element.data('date-autoclose');
+    }
+
+    this.keyboardNavigation = true;
+    if ('keyboardNavigation' in options) {
+      this.keyboardNavigation = options.keyboardNavigation;
+    } else if ('dateKeyboardNavigation' in this.element.data()) {
+      this.keyboardNavigation = this.element.data('date-keyboard-navigation');
+    }
+
+    this.todayBtn = (options.todayBtn || this.element.data('date-today-btn') || false);
+    this.clearBtn = (options.clearBtn || this.element.data('date-clear-btn') || false);
+    this.todayHighlight = (options.todayHighlight || this.element.data('date-today-highlight') || false);
+
+    this.weekStart = 0;
+    if (typeof options.weekStart !== 'undefined') {
+      this.weekStart = options.weekStart;
+    } else if (typeof this.element.data('date-weekstart') !== 'undefined') {
+      this.weekStart = this.element.data('date-weekstart');
+    } else if (typeof dates[this.language].weekStart !== 'undefined') {
+      this.weekStart = dates[this.language].weekStart;
+    }
+    this.weekStart = this.weekStart % 7;
+    this.weekEnd = ((this.weekStart + 6) % 7);
+    this.onRenderDay = function (date) {
+      var render = (options.onRenderDay || function () { return []; })(date);
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      var res = ['day'];
+      return res.concat((render ? render : []));
+    };
+    this.onRenderHour = function (date) {
+      var render = (options.onRenderHour || function () { return []; })(date);
+      var res = ['hour'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      return res.concat((render ? render : []));
+    };
+    this.onRenderMinute = function (date) {
+      var render = (options.onRenderMinute || function () { return []; })(date);
+      var res = ['minute'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      if (date < this.startDate || date > this.endDate) {
+        res.push('disabled');
+      } else if (Math.floor(this.date.getUTCMinutes() / this.minuteStep) === Math.floor(date.getUTCMinutes() / this.minuteStep)) {
+        res.push('active');
+      }
+      return res.concat((render ? render : []));
+    };
+    this.onRenderYear = function (date) {
+      var render = (options.onRenderYear || function () { return []; })(date);
+      var res = ['year'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      if (this.date.getUTCFullYear() === date.getUTCFullYear()) {
+        res.push('active');
+      }
+      var currentYear = date.getUTCFullYear();
+      var endYear = this.endDate.getUTCFullYear();
+      if (date < this.startDate || currentYear > endYear) {
+        res.push('disabled');
+      }
+      return res.concat((render ? render : []));
+    }
+    this.onRenderMonth = function (date) {
+      var render = (options.onRenderMonth || function () { return []; })(date);
+      var res = ['month'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      return res.concat((render ? render : []));
+    }
+    this.startDate = new Date(-8639968443048000);
+    this.endDate = new Date(8639968443048000);
+    this.datesDisabled = [];
+    this.daysOfWeekDisabled = [];
+    this.setStartDate(options.startDate || this.element.data('date-startdate'));
+    this.setEndDate(options.endDate || this.element.data('date-enddate'));
+    this.setDatesDisabled(options.datesDisabled || this.element.data('date-dates-disabled'));
+    this.setDaysOfWeekDisabled(options.daysOfWeekDisabled || this.element.data('date-days-of-week-disabled'));
+    this.setMinutesDisabled(options.minutesDisabled || this.element.data('date-minute-disabled'));
+    this.setHoursDisabled(options.hoursDisabled || this.element.data('date-hour-disabled'));
+    this.fillDow();
+    this.fillMonths();
+    this.update();
+    this.showMode();
+
+    if (this.isInline) {
+      this.show();
+    }
+  };
+
+  Datetimepicker.prototype = {
+    constructor: Datetimepicker,
+
+    _events:       [],
+    _attachEvents: function () {
+      this._detachEvents();
+      if (this.isInput) { // single input
+        this._events = [
+          [this.element, {
+            focus:   $.proxy(this.show, this),
+            keyup:   $.proxy(this.update, this),
+            keydown: $.proxy(this.keydown, this)
+          }]
+        ];
+      }
+      else if (this.component && this.hasInput) { // component: input + button
+        this._events = [
+          // For components that are not readonly, allow keyboard nav
+          [this.element.find('input'), {
+            focus:   $.proxy(this.show, this),
+            keyup:   $.proxy(this.update, this),
+            keydown: $.proxy(this.keydown, this)
+          }],
+          [this.component, {
+            click: $.proxy(this.show, this)
+          }]
+        ];
+        if (this.componentReset) {
+          this._events.push([
+            this.componentReset,
+            {click: $.proxy(this.reset, this)}
+          ]);
+        }
+      }
+      else if (this.element.is('div')) {  // inline datetimepicker
+        this.isInline = true;
+      }
+      else {
+        this._events = [
+          [this.element, {
+            click: $.proxy(this.show, this)
+          }]
+        ];
+      }
+      for (var i = 0, el, ev; i < this._events.length; i++) {
+        el = this._events[i][0];
+        ev = this._events[i][1];
+        el.on(ev);
+      }
+    },
+
+    _detachEvents: function () {
+      for (var i = 0, el, ev; i < this._events.length; i++) {
+        el = this._events[i][0];
+        ev = this._events[i][1];
+        el.off(ev);
+      }
+      this._events = [];
+    },
+
+    show: function (e) {
+      this.picker.show();
+      this.height = this.component ? this.component.outerHeight() : this.element.outerHeight();
+      if (this.forceParse) {
+        this.update();
+      }
+      this.place();
+      $(window).on('resize', $.proxy(this.place, this));
+      if (e) {
+        e.stopPropagation();
+        e.preventDefault();
+      }
+      this.isVisible = true;
+      this.element.trigger({
+        type: 'show',
+        date: this.date
+      });
+    },
+
+    hide: function () {
+      if (!this.isVisible) return;
+      if (this.isInline) return;
+      this.picker.hide();
+      $(window).off('resize', this.place);
+      this.viewMode = this.startViewMode;
+      this.showMode();
+      if (!this.isInput) {
+        $(document).off('mousedown', this.hide);
+      }
+
+      if (
+        this.forceParse &&
+          (
+            this.isInput && this.element.val() ||
+              this.hasInput && this.element.find('input').val()
+            )
+        )
+        this.setValue();
+      this.isVisible = false;
+      this.element.trigger({
+        type: 'hide',
+        date: this.date
+      });
+    },
+
+    remove: function () {
+      this._detachEvents();
+      $(document).off('mousedown', this.clickedOutside);
+      this.picker.remove();
+      delete this.picker;
+      delete this.element.data().datetimepicker;
+    },
+
+    getDate: function () {
+      var d = this.getUTCDate();
+      if (d === null) {
+        return null;
+      }
+      return new Date(d.getTime() + (d.getTimezoneOffset() * 60000));
+    },
+
+    getUTCDate: function () {
+      return this.date;
+    },
+
+    getInitialDate: function () {
+      return this.initialDate
+    },
+
+    setInitialDate: function (initialDate) {
+      this.initialDate = initialDate;
+    },
+
+    setDate: function (d) {
+      this.setUTCDate(new Date(d.getTime() - (d.getTimezoneOffset() * 60000)));
+    },
+
+    setUTCDate: function (d) {
+      if (d >= this.startDate && d <= this.endDate) {
+        this.date = d;
+        this.setValue();
+        this.viewDate = this.date;
+        this.fill();
+      } else {
+        this.element.trigger({
+          type:      'outOfRange',
+          date:      d,
+          startDate: this.startDate,
+          endDate:   this.endDate
+        });
+      }
+    },
+
+    setFormat: function (format) {
+      this.format = DPGlobal.parseFormat(format, this.formatType);
+      var element;
+      if (this.isInput) {
+        element = this.element;
+      } else if (this.component) {
+        element = this.element.find('input');
+      }
+      if (element && element.val()) {
+        this.setValue();
+      }
+    },
+
+    setValue: function () {
+      var formatted = this.getFormattedDate();
+      if (!this.isInput) {
+        if (this.component) {
+          this.element.find('input').val(formatted);
+        }
+        this.element.data('date', formatted);
+      } else {
+        this.element.val(formatted);
+      }
+      if (this.linkField) {
+        $('#' + this.linkField).val(this.getFormattedDate(this.linkFormat));
+      }
+    },
+
+    getFormattedDate: function (format) {
+      format = format || this.format;
+      return DPGlobal.formatDate(this.date, format, this.language, this.formatType, this.timezone);
+    },
+
+    setStartDate: function (startDate) {
+      this.startDate = startDate || this.startDate;
+      if (this.startDate.valueOf() !== 8639968443048000) {
+        this.startDate = DPGlobal.parseDate(this.startDate, this.format, this.language, this.formatType, this.timezone);
+      }
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setEndDate: function (endDate) {
+      this.endDate = endDate || this.endDate;
+      if (this.endDate.valueOf() !== 8639968443048000) {
+        this.endDate = DPGlobal.parseDate(this.endDate, this.format, this.language, this.formatType, this.timezone);
+      }
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setDatesDisabled: function (datesDisabled) {
+      this.datesDisabled = datesDisabled || [];
+      if (!$.isArray(this.datesDisabled)) {
+        this.datesDisabled = this.datesDisabled.split(/,\s*/);
+      }
+      var mThis = this;
+      this.datesDisabled = $.map(this.datesDisabled, function (d) {
+        return DPGlobal.parseDate(d, mThis.format, mThis.language, mThis.formatType, mThis.timezone).toDateString();
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setTitle: function (selector, value) {
+      return this.picker.find(selector)
+        .find('th:eq(1)')
+        .text(this.title === false ? value : this.title);
+    },
+
+    setDaysOfWeekDisabled: function (daysOfWeekDisabled) {
+      this.daysOfWeekDisabled = daysOfWeekDisabled || [];
+      if (!$.isArray(this.daysOfWeekDisabled)) {
+        this.daysOfWeekDisabled = this.daysOfWeekDisabled.split(/,\s*/);
+      }
+      this.daysOfWeekDisabled = $.map(this.daysOfWeekDisabled, function (d) {
+        return parseInt(d, 10);
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setMinutesDisabled: function (minutesDisabled) {
+      this.minutesDisabled = minutesDisabled || [];
+      if (!$.isArray(this.minutesDisabled)) {
+        this.minutesDisabled = this.minutesDisabled.split(/,\s*/);
+      }
+      this.minutesDisabled = $.map(this.minutesDisabled, function (d) {
+        return parseInt(d, 10);
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setHoursDisabled: function (hoursDisabled) {
+      this.hoursDisabled = hoursDisabled || [];
+      if (!$.isArray(this.hoursDisabled)) {
+        this.hoursDisabled = this.hoursDisabled.split(/,\s*/);
+      }
+      this.hoursDisabled = $.map(this.hoursDisabled, function (d) {
+        return parseInt(d, 10);
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    place: function () {
+      if (this.isInline) return;
+
+      if (!this.zIndex) {
+        var index_highest = 0;
+        $('div').each(function () {
+          var index_current = parseInt($(this).css('zIndex'), 10);
+          if (index_current > index_highest) {
+            index_highest = index_current;
+          }
+        });
+        this.zIndex = index_highest + 10;
+      }
+
+      var offset, top, left, containerOffset;
+      if (this.container instanceof $) {
+        containerOffset = this.container.offset();
+      } else {
+        containerOffset = $(this.container).offset();
+      }
+
+      if (this.component) {
+        offset = this.component.offset();
+        left = offset.left;
+        if (this.pickerPosition === 'bottom-left' || this.pickerPosition === 'top-left') {
+          left += this.component.outerWidth() - this.picker.outerWidth();
+        }
+      } else {
+        offset = this.element.offset();
+        left = offset.left;
+        if (this.pickerPosition === 'bottom-left' || this.pickerPosition === 'top-left') {
+          left += this.element.outerWidth() - this.picker.outerWidth();
+        }
+      }
+
+      var bodyWidth = document.body.clientWidth || window.innerWidth;
+      if (left + 220 > bodyWidth) {
+        left = bodyWidth - 220;
+      }
+
+      if (this.pickerPosition === 'top-left' || this.pickerPosition === 'top-right') {
+        top = offset.top - this.picker.outerHeight();
+      } else {
+        top = offset.top + this.height;
+      }
+
+      top = top - containerOffset.top;
+      left = left - containerOffset.left;
+
+      this.picker.css({
+        top:    top,
+        left:   left,
+        zIndex: this.zIndex
+      });
+    },
+
+    hour_minute: "^([0-9]|0[0-9]|1[0-9]|2[0-3]):[0-5][0-9]",
+
+    update: function () {
+      var date, fromArgs = false;
+      if (arguments && arguments.length && (typeof arguments[0] === 'string' || arguments[0] instanceof Date)) {
+        date = arguments[0];
+        fromArgs = true;
+      } else {
+        date = (this.isInput ? this.element.val() : this.element.find('input').val()) || this.element.data('date') || this.initialDate;
+        if (typeof date === 'string') {
+          date = date.replace(/^\s+|\s+$/g,'');
+        }
+      }
+
+      if (!date) {
+        date = new Date();
+        fromArgs = false;
+      }
+
+      if (typeof date === "string") {
+        if (new RegExp(this.hour_minute).test(date) || new RegExp(this.hour_minute + ":[0-5][0-9]").test(date)) {
+          date = this.getDate()
+        }
+      }
+
+      this.date = DPGlobal.parseDate(date, this.format, this.language, this.formatType, this.timezone);
+
+      if (fromArgs) this.setValue();
+
+      if (this.date < this.startDate) {
+        this.viewDate = new Date(this.startDate);
+      } else if (this.date > this.endDate) {
+        this.viewDate = new Date(this.endDate);
+      } else {
+        this.viewDate = new Date(this.date);
+      }
+      this.fill();
+    },
+
+    fillDow: function () {
+      var dowCnt = this.weekStart,
+        html = '<tr>';
+      while (dowCnt < this.weekStart + 7) {
+        html += '<th class="dow">' + dates[this.language].daysMin[(dowCnt++) % 7] + '</th>';
+      }
+      html += '</tr>';
+      this.picker.find('.datetimepicker-days thead').append(html);
+    },
+
+    fillMonths: function () {
+      var html = '';
+      var d = new Date(this.viewDate);
+      for (var i = 0; i < 12; i++) {
+        d.setUTCMonth(i);
+        var classes = this.onRenderMonth(d);
+        html += '<span class="' + classes.join(' ') + '">' + dates[this.language].monthsShort[i] + '</span>';
+      }
+      this.picker.find('.datetimepicker-months td').html(html);
+    },
+
+    fill: function () {
+      if (!this.date || !this.viewDate) {
+        return;
+      }
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        dayMonth = d.getUTCDate(),
+        hours = d.getUTCHours(),
+        startYear = this.startDate.getUTCFullYear(),
+        startMonth = this.startDate.getUTCMonth(),
+        endYear = this.endDate.getUTCFullYear(),
+        endMonth = this.endDate.getUTCMonth() + 1,
+        currentDate = (new UTCDate(this.date.getUTCFullYear(), this.date.getUTCMonth(), this.date.getUTCDate())).valueOf(),
+        today = new Date();
+      this.setTitle('.datetimepicker-days', dates[this.language].months[month] + ' ' + year)
+      if (this.formatViewType === 'time') {
+        var formatted = this.getFormattedDate();
+        this.setTitle('.datetimepicker-hours', formatted);
+        this.setTitle('.datetimepicker-minutes', formatted);
+      } else {
+        this.setTitle('.datetimepicker-hours', dayMonth + ' ' + dates[this.language].months[month] + ' ' + year);
+        this.setTitle('.datetimepicker-minutes', dayMonth + ' ' + dates[this.language].months[month] + ' ' + year);
+      }
+      this.picker.find('tfoot th.today')
+        .text(dates[this.language].today || dates['en'].today)
+        .toggle(this.todayBtn !== false);
+      this.picker.find('tfoot th.clear')
+        .text(dates[this.language].clear || dates['en'].clear)
+        .toggle(this.clearBtn !== false);
+      this.updateNavArrows();
+      this.fillMonths();
+      var prevMonth = UTCDate(year, month - 1, 28, 0, 0, 0, 0),
+        day = DPGlobal.getDaysInMonth(prevMonth.getUTCFullYear(), prevMonth.getUTCMonth());
+      prevMonth.setUTCDate(day);
+      prevMonth.setUTCDate(day - (prevMonth.getUTCDay() - this.weekStart + 7) % 7);
+      var nextMonth = new Date(prevMonth);
+      nextMonth.setUTCDate(nextMonth.getUTCDate() + 42);
+      nextMonth = nextMonth.valueOf();
+      var html = [];
+      var classes;
+      while (prevMonth.valueOf() < nextMonth) {
+        if (prevMonth.getUTCDay() === this.weekStart) {
+          html.push('<tr>');
+        }
+        classes = this.onRenderDay(prevMonth);
+        if (prevMonth.getUTCFullYear() < year || (prevMonth.getUTCFullYear() === year && prevMonth.getUTCMonth() < month)) {
+          classes.push('old');
+        } else if (prevMonth.getUTCFullYear() > year || (prevMonth.getUTCFullYear() === year && prevMonth.getUTCMonth() > month)) {
+          classes.push('new');
+        }
+        // Compare internal UTC date with local today, not UTC today
+        if (this.todayHighlight &&
+          prevMonth.getUTCFullYear() === today.getFullYear() &&
+          prevMonth.getUTCMonth() === today.getMonth() &&
+          prevMonth.getUTCDate() === today.getDate()) {
+          classes.push('today');
+        }
+        if (prevMonth.valueOf() === currentDate) {
+          classes.push('active');
+        }
+        if ((prevMonth.valueOf() + 86400000) <= this.startDate || prevMonth.valueOf() > this.endDate ||
+          $.inArray(prevMonth.getUTCDay(), this.daysOfWeekDisabled) !== -1 ||
+          $.inArray(prevMonth.toDateString(), this.datesDisabled) !== -1) {
+          classes.push('disabled');
+        }
+        html.push('<td class="' + classes.join(' ') + '">' + prevMonth.getUTCDate() + '</td>');
+        if (prevMonth.getUTCDay() === this.weekEnd) {
+          html.push('</tr>');
+        }
+        prevMonth.setUTCDate(prevMonth.getUTCDate() + 1);
+      }
+      this.picker.find('.datetimepicker-days tbody').empty().append(html.join(''));
+
+      html = [];
+      var txt = '', meridian = '', meridianOld = '';
+      var hoursDisabled = this.hoursDisabled || [];
+      d = new Date(this.viewDate)
+      for (var i = 0; i < 24; i++) {
+        d.setUTCHours(i);
+        classes = this.onRenderHour(d);
+        if (hoursDisabled.indexOf(i) !== -1) {
+          classes.push('disabled');
+        }
+        var actual = UTCDate(year, month, dayMonth, i);
+        // We want the previous hour for the startDate
+        if ((actual.valueOf() + 3600000) <= this.startDate || actual.valueOf() > this.endDate) {
+          classes.push('disabled');
+        } else if (hours === i) {
+          classes.push('active');
+        }
+        if (this.showMeridian && dates[this.language].meridiem.length === 2) {
+          meridian = (i < 12 ? dates[this.language].meridiem[0] : dates[this.language].meridiem[1]);
+          if (meridian !== meridianOld) {
+            if (meridianOld !== '') {
+              html.push('</fieldset>');
+            }
+            html.push('<fieldset class="hour"><legend>' + meridian.toUpperCase() + '</legend>');
+          }
+          meridianOld = meridian;
+          txt = (i % 12 ? i % 12 : 12);
+          if (i < 12) {
+            classes.push('hour_am');
+          } else {
+            classes.push('hour_pm');
+          }
+          html.push('<span class="' + classes.join(' ') + '">' + txt + '</span>');
+          if (i === 23) {
+            html.push('</fieldset>');
+          }
+        } else {
+          txt = i + ':00';
+          html.push('<span class="' + classes.join(' ') + '">' + txt + '</span>');
+        }
+      }
+      this.picker.find('.datetimepicker-hours td').html(html.join(''));
+
+      html = [];
+      txt = '';
+      meridian = '';
+      meridianOld = '';
+      var minutesDisabled = this.minutesDisabled || [];
+      d = new Date(this.viewDate);
+      for (var i = 0; i < 60; i += this.minuteStep) {
+        if (minutesDisabled.indexOf(i) !== -1) continue;
+        d.setUTCMinutes(i);
+        d.setUTCSeconds(0);
+        classes = this.onRenderMinute(d);
+        if (this.showMeridian && dates[this.language].meridiem.length === 2) {
+          meridian = (hours < 12 ? dates[this.language].meridiem[0] : dates[this.language].meridiem[1]);
+          if (meridian !== meridianOld) {
+            if (meridianOld !== '') {
+              html.push('</fieldset>');
+            }
+            html.push('<fieldset class="minute"><legend>' + meridian.toUpperCase() + '</legend>');
+          }
+          meridianOld = meridian;
+          txt = (hours % 12 ? hours % 12 : 12);
+          html.push('<span class="' + classes.join(' ') + '">' + txt + ':' + (i < 10 ? '0' + i : i) + '</span>');
+          if (i === 59) {
+            html.push('</fieldset>');
+          }
+        } else {
+          txt = i + ':00';
+          html.push('<span class="' + classes.join(' ') + '">' + hours + ':' + (i < 10 ? '0' + i : i) + '</span>');
+        }
+      }
+      this.picker.find('.datetimepicker-minutes td').html(html.join(''));
+
+      var currentYear = this.date.getUTCFullYear();
+      var months = this.setTitle('.datetimepicker-months', year)
+        .end()
+        .find('.month').removeClass('active');
+      if (currentYear === year) {
+        // getUTCMonths() returns 0 based, and we need to select the next one
+        // To cater bootstrap 2 we don't need to select the next one
+        months.eq(this.date.getUTCMonth()).addClass('active');
+      }
+      if (year < startYear || year > endYear) {
+        months.addClass('disabled');
+      }
+      if (year === startYear) {
+        months.slice(0, startMonth).addClass('disabled');
+      }
+      if (year === endYear) {
+        months.slice(endMonth).addClass('disabled');
+      }
+
+      html = '';
+      year = parseInt(year / 10, 10) * 10;
+      var yearCont = this.setTitle('.datetimepicker-years', year + '-' + (year + 9))
+        .end()
+        .find('td');
+      year -= 1;
+      d = new Date(this.viewDate);
+      for (var i = -1; i < 11; i++) {
+        d.setUTCFullYear(year);
+        classes = this.onRenderYear(d);
+        if (i === -1 || i === 10) {
+          classes.push(old);
+        }
+        html += '<span class="' + classes.join(' ') + '">' + year + '</span>';
+        year += 1;
+      }
+      yearCont.html(html);
+      this.place();
+    },
+
+    updateNavArrows: function () {
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        day = d.getUTCDate(),
+        hour = d.getUTCHours();
+      switch (this.viewMode) {
+        case 0:
+          if (year <= this.startDate.getUTCFullYear()
+            && month <= this.startDate.getUTCMonth()
+            && day <= this.startDate.getUTCDate()
+            && hour <= this.startDate.getUTCHours()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()
+            && month >= this.endDate.getUTCMonth()
+            && day >= this.endDate.getUTCDate()
+            && hour >= this.endDate.getUTCHours()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+        case 1:
+          if (year <= this.startDate.getUTCFullYear()
+            && month <= this.startDate.getUTCMonth()
+            && day <= this.startDate.getUTCDate()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()
+            && month >= this.endDate.getUTCMonth()
+            && day >= this.endDate.getUTCDate()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+        case 2:
+          if (year <= this.startDate.getUTCFullYear()
+            && month <= this.startDate.getUTCMonth()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()
+            && month >= this.endDate.getUTCMonth()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+        case 3:
+        case 4:
+          if (year <= this.startDate.getUTCFullYear()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+      }
+    },
+
+    mousewheel: function (e) {
+
+      e.preventDefault();
+      e.stopPropagation();
+
+      if (this.wheelPause) {
+        return;
+      }
+
+      this.wheelPause = true;
+
+      var originalEvent = e.originalEvent;
+
+      var delta = originalEvent.wheelDelta;
+
+      var mode = delta > 0 ? 1 : (delta === 0) ? 0 : -1;
+
+      if (this.wheelViewModeNavigationInverseDirection) {
+        mode = -mode;
+      }
+
+      this.showMode(mode);
+
+      setTimeout($.proxy(function () {
+
+        this.wheelPause = false
+
+      }, this), this.wheelViewModeNavigationDelay);
+
+    },
+
+    click: function (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      var target = $(e.target).closest('span, td, th, legend');
+      if (target.is('.' + this.icontype)) {
+        target = $(target).parent().closest('span, td, th, legend');
+      }
+      if (target.length === 1) {
+        if (target.is('.disabled')) {
+          this.element.trigger({
+            type:      'outOfRange',
+            date:      this.viewDate,
+            startDate: this.startDate,
+            endDate:   this.endDate
+          });
+          return;
+        }
+        switch (target[0].nodeName.toLowerCase()) {
+          case 'th':
+            switch (target[0].className) {
+              case 'switch':
+                this.showMode(1);
+                break;
+              case 'prev':
+              case 'next':
+                var dir = DPGlobal.modes[this.viewMode].navStep * (target[0].className === 'prev' ? -1 : 1);
+                switch (this.viewMode) {
+                  case 0:
+                    this.viewDate = this.moveHour(this.viewDate, dir);
+                    break;
+                  case 1:
+                    this.viewDate = this.moveDate(this.viewDate, dir);
+                    break;
+                  case 2:
+                    this.viewDate = this.moveMonth(this.viewDate, dir);
+                    break;
+                  case 3:
+                  case 4:
+                    this.viewDate = this.moveYear(this.viewDate, dir);
+                    break;
+                }
+                this.fill();
+                this.element.trigger({
+                  type:      target[0].className + ':' + this.convertViewModeText(this.viewMode),
+                  date:      this.viewDate,
+                  startDate: this.startDate,
+                  endDate:   this.endDate
+                });
+                break;
+              case 'clear':
+                this.reset();
+                if (this.autoclose) {
+                  this.hide();
+                }
+                break;
+              case 'today':
+                var date = new Date();
+                date = UTCDate(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), 0);
+
+                // Respect startDate and endDate.
+                if (date < this.startDate) date = this.startDate;
+                else if (date > this.endDate) date = this.endDate;
+
+                this.viewMode = this.startViewMode;
+                this.showMode(0);
+                this._setDate(date);
+                this.fill();
+                if (this.autoclose) {
+                  this.hide();
+                }
+                break;
+            }
+            break;
+          case 'span':
+            if (!target.is('.disabled')) {
+              var year = this.viewDate.getUTCFullYear(),
+                month = this.viewDate.getUTCMonth(),
+                day = this.viewDate.getUTCDate(),
+                hours = this.viewDate.getUTCHours(),
+                minutes = this.viewDate.getUTCMinutes(),
+                seconds = this.viewDate.getUTCSeconds();
+
+              if (target.is('.month')) {
+                this.viewDate.setUTCDate(1);
+                month = target.parent().find('span').index(target);
+                day = this.viewDate.getUTCDate();
+                this.viewDate.setUTCMonth(month);
+                this.element.trigger({
+                  type: 'changeMonth',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 3) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              } else if (target.is('.year')) {
+                this.viewDate.setUTCDate(1);
+                year = parseInt(target.text(), 10) || 0;
+                this.viewDate.setUTCFullYear(year);
+                this.element.trigger({
+                  type: 'changeYear',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 4) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              } else if (target.is('.hour')) {
+                hours = parseInt(target.text(), 10) || 0;
+                if (target.hasClass('hour_am') || target.hasClass('hour_pm')) {
+                  if (hours === 12 && target.hasClass('hour_am')) {
+                    hours = 0;
+                  } else if (hours !== 12 && target.hasClass('hour_pm')) {
+                    hours += 12;
+                  }
+                }
+                this.viewDate.setUTCHours(hours);
+                this.element.trigger({
+                  type: 'changeHour',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 1) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              } else if (target.is('.minute')) {
+                minutes = parseInt(target.text().substr(target.text().indexOf(':') + 1), 10) || 0;
+                this.viewDate.setUTCMinutes(minutes);
+                this.element.trigger({
+                  type: 'changeMinute',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 0) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              }
+              if (this.viewMode !== 0) {
+                var oldViewMode = this.viewMode;
+                this.showMode(-1);
+                this.fill();
+                if (oldViewMode === this.viewMode && this.autoclose) {
+                  this.hide();
+                }
+              } else {
+                this.fill();
+                if (this.autoclose) {
+                  this.hide();
+                }
+              }
+            }
+            break;
+          case 'td':
+            if (target.is('.day') && !target.is('.disabled')) {
+              var day = parseInt(target.text(), 10) || 1;
+              var year = this.viewDate.getUTCFullYear(),
+                month = this.viewDate.getUTCMonth(),
+                hours = this.viewDate.getUTCHours(),
+                minutes = this.viewDate.getUTCMinutes(),
+                seconds = this.viewDate.getUTCSeconds();
+              if (target.is('.old')) {
+                if (month === 0) {
+                  month = 11;
+                  year -= 1;
+                } else {
+                  month -= 1;
+                }
+              } else if (target.is('.new')) {
+                if (month === 11) {
+                  month = 0;
+                  year += 1;
+                } else {
+                  month += 1;
+                }
+              }
+              this.viewDate.setUTCFullYear(year);
+              this.viewDate.setUTCMonth(month, day);
+              this.element.trigger({
+                type: 'changeDay',
+                date: this.viewDate
+              });
+              if (this.viewSelect >= 2) {
+                this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+              }
+            }
+            var oldViewMode = this.viewMode;
+            this.showMode(-1);
+            this.fill();
+            if (oldViewMode === this.viewMode && this.autoclose) {
+              this.hide();
+            }
+            break;
+        }
+      }
+    },
+
+    _setDate: function (date, which) {
+      if (!which || which === 'date')
+        this.date = date;
+      if (!which || which === 'view')
+        this.viewDate = date;
+      this.fill();
+      this.setValue();
+      var element;
+      if (this.isInput) {
+        element = this.element;
+      } else if (this.component) {
+        element = this.element.find('input');
+      }
+      if (element) {
+        element.change();
+      }
+      this.element.trigger({
+        type: 'changeDate',
+        date: this.getDate()
+      });
+      if(date === null)
+        this.date = this.viewDate;
+    },
+
+    moveMinute: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf());
+      //dir = dir > 0 ? 1 : -1;
+      new_date.setUTCMinutes(new_date.getUTCMinutes() + (dir * this.minuteStep));
+      return new_date;
+    },
+
+    moveHour: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf());
+      //dir = dir > 0 ? 1 : -1;
+      new_date.setUTCHours(new_date.getUTCHours() + dir);
+      return new_date;
+    },
+
+    moveDate: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf());
+      //dir = dir > 0 ? 1 : -1;
+      new_date.setUTCDate(new_date.getUTCDate() + dir);
+      return new_date;
+    },
+
+    moveMonth: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf()),
+        day = new_date.getUTCDate(),
+        month = new_date.getUTCMonth(),
+        mag = Math.abs(dir),
+        new_month, test;
+      dir = dir > 0 ? 1 : -1;
+      if (mag === 1) {
+        test = dir === -1
+          // If going back one month, make sure month is not current month
+          // (eg, Mar 31 -> Feb 31 === Feb 28, not Mar 02)
+          ? function () {
+          return new_date.getUTCMonth() === month;
+        }
+          // If going forward one month, make sure month is as expected
+          // (eg, Jan 31 -> Feb 31 === Feb 28, not Mar 02)
+          : function () {
+          return new_date.getUTCMonth() !== new_month;
+        };
+        new_month = month + dir;
+        new_date.setUTCMonth(new_month);
+        // Dec -> Jan (12) or Jan -> Dec (-1) -- limit expected date to 0-11
+        if (new_month < 0 || new_month > 11)
+          new_month = (new_month + 12) % 12;
+      } else {
+        // For magnitudes >1, move one month at a time...
+        for (var i = 0; i < mag; i++)
+          // ...which might decrease the day (eg, Jan 31 to Feb 28, etc)...
+          new_date = this.moveMonth(new_date, dir);
+        // ...then reset the day, keeping it in the new month
+        new_month = new_date.getUTCMonth();
+        new_date.setUTCDate(day);
+        test = function () {
+          return new_month !== new_date.getUTCMonth();
+        };
+      }
+      // Common date-resetting loop -- if date is beyond end of month, make it
+      // end of month
+      while (test()) {
+        new_date.setUTCDate(--day);
+        new_date.setUTCMonth(new_month);
+      }
+      return new_date;
+    },
+
+    moveYear: function (date, dir) {
+      return this.moveMonth(date, dir * 12);
+    },
+
+    dateWithinRange: function (date) {
+      return date >= this.startDate && date <= this.endDate;
+    },
+
+    keydown: function (e) {
+      if (this.picker.is(':not(:visible)')) {
+        if (e.keyCode === 27) // allow escape to hide and re-show picker
+          this.show();
+        return;
+      }
+      var dateChanged = false,
+        dir, newDate, newViewDate;
+      switch (e.keyCode) {
+        case 27: // escape
+          this.hide();
+          e.preventDefault();
+          break;
+        case 37: // left
+        case 39: // right
+          if (!this.keyboardNavigation) break;
+          dir = e.keyCode === 37 ? -1 : 1;
+          var viewMode = this.viewMode;
+          if (e.ctrlKey) {
+            viewMode += 2;
+          } else if (e.shiftKey) {
+            viewMode += 1;
+          }
+          if (viewMode === 4) {
+            newDate = this.moveYear(this.date, dir);
+            newViewDate = this.moveYear(this.viewDate, dir);
+          } else if (viewMode === 3) {
+            newDate = this.moveMonth(this.date, dir);
+            newViewDate = this.moveMonth(this.viewDate, dir);
+          } else if (viewMode === 2) {
+            newDate = this.moveDate(this.date, dir);
+            newViewDate = this.moveDate(this.viewDate, dir);
+          } else if (viewMode === 1) {
+            newDate = this.moveHour(this.date, dir);
+            newViewDate = this.moveHour(this.viewDate, dir);
+          } else if (viewMode === 0) {
+            newDate = this.moveMinute(this.date, dir);
+            newViewDate = this.moveMinute(this.viewDate, dir);
+          }
+          if (this.dateWithinRange(newDate)) {
+            this.date = newDate;
+            this.viewDate = newViewDate;
+            this.setValue();
+            this.update();
+            e.preventDefault();
+            dateChanged = true;
+          }
+          break;
+        case 38: // up
+        case 40: // down
+          if (!this.keyboardNavigation) break;
+          dir = e.keyCode === 38 ? -1 : 1;
+          viewMode = this.viewMode;
+          if (e.ctrlKey) {
+            viewMode += 2;
+          } else if (e.shiftKey) {
+            viewMode += 1;
+          }
+          if (viewMode === 4) {
+            newDate = this.moveYear(this.date, dir);
+            newViewDate = this.moveYear(this.viewDate, dir);
+          } else if (viewMode === 3) {
+            newDate = this.moveMonth(this.date, dir);
+            newViewDate = this.moveMonth(this.viewDate, dir);
+          } else if (viewMode === 2) {
+            newDate = this.moveDate(this.date, dir * 7);
+            newViewDate = this.moveDate(this.viewDate, dir * 7);
+          } else if (viewMode === 1) {
+            if (this.showMeridian) {
+              newDate = this.moveHour(this.date, dir * 6);
+              newViewDate = this.moveHour(this.viewDate, dir * 6);
+            } else {
+              newDate = this.moveHour(this.date, dir * 4);
+              newViewDate = this.moveHour(this.viewDate, dir * 4);
+            }
+          } else if (viewMode === 0) {
+            newDate = this.moveMinute(this.date, dir * 4);
+            newViewDate = this.moveMinute(this.viewDate, dir * 4);
+          }
+          if (this.dateWithinRange(newDate)) {
+            this.date = newDate;
+            this.viewDate = newViewDate;
+            this.setValue();
+            this.update();
+            e.preventDefault();
+            dateChanged = true;
+          }
+          break;
+        case 13: // enter
+          if (this.viewMode !== 0) {
+            var oldViewMode = this.viewMode;
+            this.showMode(-1);
+            this.fill();
+            if (oldViewMode === this.viewMode && this.autoclose) {
+              this.hide();
+            }
+          } else {
+            this.fill();
+            if (this.autoclose) {
+              this.hide();
+            }
+          }
+          e.preventDefault();
+          break;
+        case 9: // tab
+          this.hide();
+          break;
+      }
+      if (dateChanged) {
+        var element;
+        if (this.isInput) {
+          element = this.element;
+        } else if (this.component) {
+          element = this.element.find('input');
+        }
+        if (element) {
+          element.change();
+        }
+        this.element.trigger({
+          type: 'changeDate',
+          date: this.getDate()
+        });
+      }
+    },
+
+    showMode: function (dir) {
+      if (dir) {
+        var newViewMode = Math.max(0, Math.min(DPGlobal.modes.length - 1, this.viewMode + dir));
+        if (newViewMode >= this.minView && newViewMode <= this.maxView) {
+          this.element.trigger({
+            type:        'changeMode',
+            date:        this.viewDate,
+            oldViewMode: this.viewMode,
+            newViewMode: newViewMode
+          });
+
+          this.viewMode = newViewMode;
+        }
+      }
+      /*
+       vitalets: fixing bug of very special conditions:
+       jquery 1.7.1 + webkit + show inline datetimepicker in bootstrap popover.
+       Method show() does not set display css correctly and datetimepicker is not shown.
+       Changed to .css('display', 'block') solve the problem.
+       See https://github.com/vitalets/x-editable/issues/37
+
+       In jquery 1.7.2+ everything works fine.
+       */
+      //this.picker.find('>div').hide().filter('.datetimepicker-'+DPGlobal.modes[this.viewMode].clsName).show();
+      this.picker.find('>div').hide().filter('.datetimepicker-' + DPGlobal.modes[this.viewMode].clsName).css('display', 'block');
+      this.updateNavArrows();
+    },
+
+    reset: function () {
+      this._setDate(null, 'date');
+    },
+
+    convertViewModeText:  function (viewMode) {
+      switch (viewMode) {
+        case 4:
+          return 'decade';
+        case 3:
+          return 'year';
+        case 2:
+          return 'month';
+        case 1:
+          return 'day';
+        case 0:
+          return 'hour';
+      }
+    }
+  };
+
+  var old = $.fn.datetimepicker;
+  $.fn.datetimepicker = function (option) {
+    var args = Array.apply(null, arguments);
+    args.shift();
+    var internal_return;
+    this.each(function () {
+      var $this = $(this),
+        data = $this.data('datetimepicker'),
+        options = typeof option === 'object' && option;
+      if (!data) {
+        $this.data('datetimepicker', (data = new Datetimepicker(this, $.extend({}, $.fn.datetimepicker.defaults, options))));
+      }
+      if (typeof option === 'string' && typeof data[option] === 'function') {
+        internal_return = data[option].apply(data, args);
+        if (internal_return !== undefined) {
+          return false;
+        }
+      }
+    });
+    if (internal_return !== undefined)
+      return internal_return;
+    else
+      return this;
+  };
+
+  $.fn.datetimepicker.defaults = {
+  };
+  $.fn.datetimepicker.Constructor = Datetimepicker;
+  var dates = $.fn.datetimepicker.dates = {
+    en: {
+      days:        ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
+      daysShort:   ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      daysMin:     ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'],
+      months:      ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+      meridiem:    ['am', 'pm'],
+      suffix:      ['st', 'nd', 'rd', 'th'],
+      today:       'Today',
+      clear:       'Clear'
+    }
+  };
+
+  var DPGlobal = {
+    modes:            [
+      {
+        clsName: 'minutes',
+        navFnc:  'Hours',
+        navStep: 1
+      },
+      {
+        clsName: 'hours',
+        navFnc:  'Date',
+        navStep: 1
+      },
+      {
+        clsName: 'days',
+        navFnc:  'Month',
+        navStep: 1
+      },
+      {
+        clsName: 'months',
+        navFnc:  'FullYear',
+        navStep: 1
+      },
+      {
+        clsName: 'years',
+        navFnc:  'FullYear',
+        navStep: 10
+      }
+    ],
+    isLeapYear:       function (year) {
+      return (((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0))
+    },
+    getDaysInMonth:   function (year, month) {
+      return [31, (DPGlobal.isLeapYear(year) ? 29 : 28), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month]
+    },
+    getDefaultFormat: function (type, field) {
+      if (type === 'standard') {
+        if (field === 'input')
+          return 'yyyy-mm-dd hh:ii';
+        else
+          return 'yyyy-mm-dd hh:ii:ss';
+      } else if (type === 'php') {
+        if (field === 'input')
+          return 'Y-m-d H:i';
+        else
+          return 'Y-m-d H:i:s';
+      } else {
+        throw new Error('Invalid format type.');
+      }
+    },
+    validParts: function (type) {
+      if (type === 'standard') {
+        return /t|hh?|HH?|p|P|z|Z|ii?|ss?|dd?|DD?|mm?|MM?|yy(?:yy)?/g;
+      } else if (type === 'php') {
+        return /[dDjlNwzFmMnStyYaABgGhHis]/g;
+      } else {
+        throw new Error('Invalid format type.');
+      }
+    },
+    nonpunctuation: /[^ -\/:-@\[-`{-~\t\n\rTZ]+/g,
+    parseFormat: function (format, type) {
+      // IE treats \0 as a string end in inputs (truncating the value),
+      // so it's a bad format delimiter, anyway
+      var separators = format.replace(this.validParts(type), '\0').split('\0'),
+        parts = format.match(this.validParts(type));
+      if (!separators || !separators.length || !parts || parts.length === 0) {
+        throw new Error('Invalid date format.');
+      }
+      return {separators: separators, parts: parts};
+    },
+    parseDate: function (date, format, language, type, timezone) {
+      if (date instanceof Date) {
+        var dateUTC = new Date(date.valueOf() - date.getTimezoneOffset() * 60000);
+        dateUTC.setMilliseconds(0);
+        return dateUTC;
+      }
+      if (/^\d{4}\-\d{1,2}\-\d{1,2}$/.test(date)) {
+        format = this.parseFormat('yyyy-mm-dd', type);
+      }
+      if (/^\d{4}\-\d{1,2}\-\d{1,2}[T ]\d{1,2}\:\d{1,2}$/.test(date)) {
+        format = this.parseFormat('yyyy-mm-dd hh:ii', type);
+      }
+      if (/^\d{4}\-\d{1,2}\-\d{1,2}[T ]\d{1,2}\:\d{1,2}\:\d{1,2}[Z]{0,1}$/.test(date)) {
+        format = this.parseFormat('yyyy-mm-dd hh:ii:ss', type);
+      }
+      if (/^[-+]\d+[dmwy]([\s,]+[-+]\d+[dmwy])*$/.test(date)) {
+        var part_re = /([-+]\d+)([dmwy])/,
+          parts = date.match(/([-+]\d+)([dmwy])/g),
+          part, dir;
+        date = new Date();
+        for (var i = 0; i < parts.length; i++) {
+          part = part_re.exec(parts[i]);
+          dir = parseInt(part[1]);
+          switch (part[2]) {
+            case 'd':
+              date.setUTCDate(date.getUTCDate() + dir);
+              break;
+            case 'm':
+              date = Datetimepicker.prototype.moveMonth.call(Datetimepicker.prototype, date, dir);
+              break;
+            case 'w':
+              date.setUTCDate(date.getUTCDate() + dir * 7);
+              break;
+            case 'y':
+              date = Datetimepicker.prototype.moveYear.call(Datetimepicker.prototype, date, dir);
+              break;
+          }
+        }
+        return UTCDate(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds(), 0);
+      }
+      var parts = date && date.toString().match(this.nonpunctuation) || [],
+        date = new Date(0, 0, 0, 0, 0, 0, 0),
+        parsed = {},
+        setters_order = ['hh', 'h', 'ii', 'i', 'ss', 's', 'yyyy', 'yy', 'M', 'MM', 'm', 'mm', 'D', 'DD', 'd', 'dd', 'H', 'HH', 'p', 'P', 'z', 'Z'],
+        setters_map = {
+          hh:   function (d, v) {
+            return d.setUTCHours(v);
+          },
+          h:    function (d, v) {
+            return d.setUTCHours(v);
+          },
+          HH:   function (d, v) {
+            return d.setUTCHours(v === 12 ? 0 : v);
+          },
+          H:    function (d, v) {
+            return d.setUTCHours(v === 12 ? 0 : v);
+          },
+          ii:   function (d, v) {
+            return d.setUTCMinutes(v);
+          },
+          i:    function (d, v) {
+            return d.setUTCMinutes(v);
+          },
+          ss:   function (d, v) {
+            return d.setUTCSeconds(v);
+          },
+          s:    function (d, v) {
+            return d.setUTCSeconds(v);
+          },
+          yyyy: function (d, v) {
+            return d.setUTCFullYear(v);
+          },
+          yy:   function (d, v) {
+            return d.setUTCFullYear(2000 + v);
+          },
+          m:    function (d, v) {
+            v -= 1;
+            while (v < 0) v += 12;
+            v %= 12;
+            d.setUTCMonth(v);
+            while (d.getUTCMonth() !== v)
+              if (isNaN(d.getUTCMonth()))
+                return d;
+              else
+                d.setUTCDate(d.getUTCDate() - 1);
+            return d;
+          },
+          d:    function (d, v) {
+            return d.setUTCDate(v);
+          },
+          p:    function (d, v) {
+            return d.setUTCHours(v === 1 ? d.getUTCHours() + 12 : d.getUTCHours());
+          },
+          z:    function () {
+            return timezone
+          }
+        },
+        val, filtered, part;
+      setters_map['M'] = setters_map['MM'] = setters_map['mm'] = setters_map['m'];
+      setters_map['dd'] = setters_map['d'];
+      setters_map['P'] = setters_map['p'];
+      setters_map['Z'] = setters_map['z'];
+      date = UTCDate(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds());
+      if (parts.length === format.parts.length) {
+        for (var i = 0, cnt = format.parts.length; i < cnt; i++) {
+          val = parseInt(parts[i], 10);
+          part = format.parts[i];
+          if (isNaN(val)) {
+            switch (part) {
+              case 'MM':
+                filtered = $(dates[language].months).filter(function () {
+                  var m = this.slice(0, parts[i].length),
+                    p = parts[i].slice(0, m.length);
+                  return m === p;
+                });
+                val = $.inArray(filtered[0], dates[language].months) + 1;
+                break;
+              case 'M':
+                filtered = $(dates[language].monthsShort).filter(function () {
+                  var m = this.slice(0, parts[i].length),
+                    p = parts[i].slice(0, m.length);
+                  return m.toLowerCase() === p.toLowerCase();
+                });
+                val = $.inArray(filtered[0], dates[language].monthsShort) + 1;
+                break;
+              case 'p':
+              case 'P':
+                val = $.inArray(parts[i].toLowerCase(), dates[language].meridiem);
+                break;
+              case 'z':
+              case 'Z':
+                timezone;
+                break;
+
+            }
+          }
+          parsed[part] = val;
+        }
+        for (var i = 0, s; i < setters_order.length; i++) {
+          s = setters_order[i];
+          if (s in parsed && !isNaN(parsed[s]))
+            setters_map[s](date, parsed[s])
+        }
+      }
+      return date;
+    },
+    formatDate:       function (date, format, language, type, timezone) {
+      if (date === null) {
+        return '';
+      }
+      var val;
+      if (type === 'standard') {
+        val = {
+          t:    date.getTime(),
+          // year
+          yy:   date.getUTCFullYear().toString().substring(2),
+          yyyy: date.getUTCFullYear(),
+          // month
+          m:    date.getUTCMonth() + 1,
+          M:    dates[language].monthsShort[date.getUTCMonth()],
+          MM:   dates[language].months[date.getUTCMonth()],
+          // day
+          d:    date.getUTCDate(),
+          D:    dates[language].daysShort[date.getUTCDay()],
+          DD:   dates[language].days[date.getUTCDay()],
+          p:    (dates[language].meridiem.length === 2 ? dates[language].meridiem[date.getUTCHours() < 12 ? 0 : 1] : ''),
+          // hour
+          h:    date.getUTCHours(),
+          // minute
+          i:    date.getUTCMinutes(),
+          // second
+          s:    date.getUTCSeconds(),
+          // timezone
+          z:    timezone
+        };
+
+        if (dates[language].meridiem.length === 2) {
+          val.H = (val.h % 12 === 0 ? 12 : val.h % 12);
+        }
+        else {
+          val.H = val.h;
+        }
+        val.HH = (val.H < 10 ? '0' : '') + val.H;
+        val.P = val.p.toUpperCase();
+        val.Z = val.z;
+        val.hh = (val.h < 10 ? '0' : '') + val.h;
+        val.ii = (val.i < 10 ? '0' : '') + val.i;
+        val.ss = (val.s < 10 ? '0' : '') + val.s;
+        val.dd = (val.d < 10 ? '0' : '') + val.d;
+        val.mm = (val.m < 10 ? '0' : '') + val.m;
+      } else if (type === 'php') {
+        // php format
+        val = {
+          // year
+          y: date.getUTCFullYear().toString().substring(2),
+          Y: date.getUTCFullYear(),
+          // month
+          F: dates[language].months[date.getUTCMonth()],
+          M: dates[language].monthsShort[date.getUTCMonth()],
+          n: date.getUTCMonth() + 1,
+          t: DPGlobal.getDaysInMonth(date.getUTCFullYear(), date.getUTCMonth()),
+          // day
+          j: date.getUTCDate(),
+          l: dates[language].days[date.getUTCDay()],
+          D: dates[language].daysShort[date.getUTCDay()],
+          w: date.getUTCDay(), // 0 -> 6
+          N: (date.getUTCDay() === 0 ? 7 : date.getUTCDay()),       // 1 -> 7
+          S: (date.getUTCDate() % 10 <= dates[language].suffix.length ? dates[language].suffix[date.getUTCDate() % 10 - 1] : ''),
+          // hour
+          a: (dates[language].meridiem.length === 2 ? dates[language].meridiem[date.getUTCHours() < 12 ? 0 : 1] : ''),
+          g: (date.getUTCHours() % 12 === 0 ? 12 : date.getUTCHours() % 12),
+          G: date.getUTCHours(),
+          // minute
+          i: date.getUTCMinutes(),
+          // second
+          s: date.getUTCSeconds()
+        };
+        val.m = (val.n < 10 ? '0' : '') + val.n;
+        val.d = (val.j < 10 ? '0' : '') + val.j;
+        val.A = val.a.toString().toUpperCase();
+        val.h = (val.g < 10 ? '0' : '') + val.g;
+        val.H = (val.G < 10 ? '0' : '') + val.G;
+        val.i = (val.i < 10 ? '0' : '') + val.i;
+        val.s = (val.s < 10 ? '0' : '') + val.s;
+      } else {
+        throw new Error('Invalid format type.');
+      }
+      var date = [],
+        seps = $.extend([], format.separators);
+      for (var i = 0, cnt = format.parts.length; i < cnt; i++) {
+        if (seps.length) {
+          date.push(seps.shift());
+        }
+        date.push(val[format.parts[i]]);
+      }
+      if (seps.length) {
+        date.push(seps.shift());
+      }
+      return date.join('');
+    },
+    convertViewMode:  function (viewMode) {
+      switch (viewMode) {
+        case 4:
+        case 'decade':
+          viewMode = 4;
+          break;
+        case 3:
+        case 'year':
+          viewMode = 3;
+          break;
+        case 2:
+        case 'month':
+          viewMode = 2;
+          break;
+        case 1:
+        case 'day':
+          viewMode = 1;
+          break;
+        case 0:
+        case 'hour':
+          viewMode = 0;
+          break;
+      }
+
+      return viewMode;
+    },
+    headTemplate: '<thead>' +
+                '<tr>' +
+                '<th class="prev"><i class="{iconType} {leftArrow}"/></th>' +
+                '<th colspan="5" class="switch"></th>' +
+                '<th class="next"><i class="{iconType} {rightArrow}"/></th>' +
+                '</tr>' +
+      '</thead>',
+    headTemplateV3: '<thead>' +
+                '<tr>' +
+                '<th class="prev"><span class="{iconType} {leftArrow}"></span> </th>' +
+                '<th colspan="5" class="switch"></th>' +
+                '<th class="next"><span class="{iconType} {rightArrow}"></span> </th>' +
+                '</tr>' +
+      '</thead>',
+    contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>',
+    footTemplate: '<tfoot>' + 
+                    '<tr><th colspan="7" class="today"></th></tr>' +
+                    '<tr><th colspan="7" class="clear"></th></tr>' +
+                  '</tfoot>'
+  };
+  DPGlobal.template = '<div class="datetimepicker">' +
+    '<div class="datetimepicker-minutes">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-hours">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-days">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplate +
+    '<tbody></tbody>' +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-months">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-years">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '</div>';
+  DPGlobal.templateV3 = '<div class="datetimepicker">' +
+    '<div class="datetimepicker-minutes">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-hours">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-days">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    '<tbody></tbody>' +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-months">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-years">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '</div>';
+  $.fn.datetimepicker.DPGlobal = DPGlobal;
+
+  /* DATETIMEPICKER NO CONFLICT
+   * =================== */
+
+  $.fn.datetimepicker.noConflict = function () {
+    $.fn.datetimepicker = old;
+    return this;
+  };
+
+  /* DATETIMEPICKER DATA-API
+   * ================== */
+
+  $(document).on(
+    'focus.datetimepicker.data-api click.datetimepicker.data-api',
+    '[data-provide="datetimepicker"]',
+    function (e) {
+      var $this = $(this);
+      if ($this.data('datetimepicker')) return;
+      e.preventDefault();
+      // component click requires us to explicitly show it
+      $this.datetimepicker('show');
+    }
+  );
+  $(function () {
+    $('[data-provide="datetimepicker-inline"]').datetimepicker();
+  });
+
+}));
+/*
+ * Copyright 2018-2018 the original author or authors.
+ *
+ * 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.
+ *
+ * WebSite: http://bootstrap-viewer.leftso.com
+ */
+
+$.fn.bootstrapViewer = function (options) {
+    $(this).on('click', function () {
+        var opts = $.extend({}, $.fn.bootstrapViewer.defaults, options);
+        var viewer = $('<div class="modal fade bs-example-modal-lg text-center" id="bootstrapViewer" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" >\n' +
+            '          <div class="modal-dialog modal-lg" style="display: inline-block; width: auto;">\n' +
+            '            <div class="modal-content">\n' +
+            '             <img' +
+            '\t\t\t class="carousel-inner img-responsive img-rounded img-viewer" draggable="false"\n' +
+            '\t\t\t onclick="/*$(\'#bootstrapViewer\').modal(\'hide\');setTimeout(function(){$(\'#bootstrapViewer\').remove();},200);*/"\n' +
+            '\t\t\t onmouseover="this.style.cursor=\'move\';" \n' +
+            '\t\t\t onmouseout="this.style.cursor=\'default\'"  \n' +
+            '\t\t\t />\n' +
+            '            </div>\n' +
+            '          </div>\n' +
+            '        </div>');
+        $('body').append(viewer);
+        if ($(this).attr(opts.src)) {
+            $("#bootstrapViewer").find(".img-viewer").attr("src", $(this).attr(opts.src));
+            $("#bootstrapViewer").modal();
+        } else {
+            throw "图片不存在"
+        }
+        $('#bootstrapViewer').on('hidden.bs.modal', function(){
+          $('#bootstrapViewer').remove();
+        });
+
+        var $moveDiv = $('#bootstrapViewer .modal-dialog');
+        var isMove = false;
+        var div_x = $moveDiv.offset().left;
+        var div_y = $moveDiv.offset().top;
+
+        var mousedownFunc = function (e) {
+          if (isMove) {
+            var left = e.pageX - div_x;
+            var top = e.pageY - div_y;
+            if(left < 0){ left = 0}
+            if(top < 0){ top = 0}
+            $moveDiv.css({"left": left, "top":top});
+          }
+        }
+
+        $moveDiv.mousedown(function (e) {
+          $moveDiv.css({ left: $moveDiv[0].offsetLeft, top: $moveDiv[0].offsetTop, marginTop: 0, position: 'absolute' });
+
+          isMove = true;
+          div_x = e.pageX - $moveDiv.offset().left;
+          div_y = e.pageY - $moveDiv.offset().top;
+          $(document).mousemove(mousedownFunc);
+        }).mouseup(function () {
+          isMove = false;
+          $(document).unbind('mousemove', mousedownFunc);
+        });
+    })
+
+    $(this).on('mouseover', function () {
+        $(this).css('cursor', 'zoom-in');
+    })
+}
+$.fn.bootstrapViewer.defaults = {
+    src: 'src'
+}
+;
+/* Author：mingyuhisoft@163.com
+ * Github:https://github.com/imingyu/jquery.mloading
+ * Npm:npm install jquery.mloading.js
+ * Date：2016-7-4
+ */
+
+
+;(function (root, factory) {
+  'use strict';
+
+  if (typeof module === 'object' && typeof module.exports === 'object') {
+    factory(require('jquery'),root);
+  } if(typeof define ==="function"){
+    if(define.cmd){
+      define(function(require, exports, module){
+        var $ = require("jquery");
+        factory($,root);
+      });
+    }else{
+      define(["jquery"],function($){
+        factory($,root);
+      });
+    }
+  }else {
+    factory(root.jQuery,root);
+  }
+} (typeof window !=="undefined" ? window : this, function ($, root, undefined) {
+  'use strict';
+  if(!$){
+    $ = root.jQuery || null;
+  }
+  if(!$){
+    throw new TypeError("必须引入jquery库方可正常使用！");
+  }
+
+  var arraySlice = Array.prototype.slice,
+    comparison=function (obj1,obj2) {
+      var result=true;
+      for(var pro in obj1){
+        if(obj1[pro] !== obj2[obj1]){
+          result=true;
+          break;
+        }
+      }
+      return result;
+    }
+
+  function MLoading(dom,options) {
+    options=options||{};
+    this.dom=dom;
+    this.options=$.extend(true,{},MLoading.defaultOptions,options);
+    this.curtain=null;
+    this.render().show();
+  }
+  MLoading.prototype={
+    constructor:MLoading,
+    initElement:function () {
+      var dom=this.dom,
+        ops=this.options;
+      var curtainElement=dom.children(".mloading"),
+        bodyElement = curtainElement.children('.mloading-body'),
+        barElement = bodyElement.children('.mloading-bar'),
+        iconElement = barElement.children('.mloading-icon'),
+        textElement = barElement.find(".mloading-text");
+      if (curtainElement.length == 0) {
+        curtainElement = $('<div class="mloading"></div>');
+        dom.append(curtainElement);
+      }
+      if (bodyElement.length == 0) {
+        bodyElement = $('<div class="mloading-body"></div>');
+        curtainElement.append(bodyElement);
+      }
+      if (barElement.length == 0) {
+        barElement = $('<div class="mloading-bar"></div>');
+        bodyElement.append(barElement);
+      }
+      if (iconElement.length == 0) {
+        var _iconElement=document.createElement(ops.iconTag);
+        iconElement = $(_iconElement);
+        iconElement.addClass("mloading-icon");
+        barElement.append(iconElement);
+      }
+      if (textElement.length == 0) {
+        textElement = $('<span class="mloading-text"></span>');
+        barElement.append(textElement);
+      }
+
+      this.curtainElement=curtainElement;
+      this.bodyElement = bodyElement;
+      this.barElement = barElement;
+      this.iconElement = iconElement;
+      this.textElement = textElement;
+      return this;
+    },
+    render:function () {
+      var dom=this.dom,
+        ops=this.options;
+      this.initElement();
+      if(dom.is("html") || dom.is("body")){
+        this.curtainElement.addClass("mloading-full");
+      }else{
+        this.curtainElement.removeClass("mloading-full");
+
+        if(!dom.hasClass("mloading-container")){
+          dom.addClass("mloading-container");
+        }
+      }
+      if(ops.mask){
+        this.curtainElement.addClass("mloading-mask");
+      }else{
+        this.curtainElement.removeClass("mloading-mask");
+      }
+      if(ops.content!="" && typeof ops.content!="undefined"){
+        if(ops.html){
+          this.bodyElement.html(ops.content);
+        }else{
+          this.bodyElement.text(ops.content);
+        }
+      }else{
+        this.iconElement.attr("src",ops.icon);
+        if(ops.html){
+          this.textElement.html(ops.text);
+        }else{
+          this.textElement.text(ops.text);
+        }
+      }
+
+      return this;
+    },
+    setOptions:function (options) {
+      options=options||{};
+      var oldOptions = this.options;
+      this.options = $.extend(true,{},this.options,options);
+      if(!comparison(oldOptions,this.options)) this.render();
+    },
+    show:function () {
+      var dom=this.dom,
+        ops=this.options,
+        barElement=this.barElement;
+      this.curtainElement.addClass("active");
+      barElement.css({
+        "marginTop":"-"+barElement.outerHeight()/2+"px",
+        "marginLeft":"-"+barElement.outerWidth()/2+"px"
+      });
+
+      return this;
+    },
+    hide:function () {
+      var dom=this.dom,
+        ops=this.options;
+      this.curtainElement.removeClass("active");
+      if(!dom.is("html") && !dom.is("body")){
+        dom.removeClass("mloading-container");
+      }
+      return this;
+    },
+    destroy:function () {
+      var dom=this.dom,
+        ops=this.options;
+      this.curtainElement.remove();
+      if(!dom.is("html") && !dom.is("body")){
+        dom.removeClass("mloading-container");
+      }
+      dom.removeData(MLoading.dataKey);
+      return this;
+    }
+  };
+  MLoading.dataKey="MLoading";
+  MLoading.defaultOptions = {
+    text:"加载中...",
+    iconTag:"img",
+    icon:"data:image/gif;base64,R0lGODlhDwAPAKUAAEQ+PKSmpHx6fNTW1FxaXOzu7ExOTIyOjGRmZMTCxPz6/ERGROTi5Pz29JyanGxubMzKzIyKjGReXPT29FxWVGxmZExGROzq7ERCRLy6vISChNze3FxeXPTy9FROTJSSlMTGxPz+/OTm5JyenNTOzGxqbExKTAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJBgAhACwAAAAADwAPAAAGd8CQcEgsChuTZMNIDFgsC1Nn9GEwDwDAoqMBWEDFiweA2YoiZevwA9BkDAUhW0MkADYhiEJYwJj2QhYGTBwAE0MUGGp5IR1+RBEAEUMVDg4AAkQMJhgfFyEIWRgDRSALABKgWQ+HRQwaCCEVC7R0TEITHbmtt0xBACH5BAkGACYALAAAAAAPAA8AhUQ+PKSmpHRydNTW1FxWVOzu7MTCxIyKjExKTOTi5LSytHx+fPz6/ERGROTe3GxqbNTS1JyWlFRSVKympNze3FxeXPT29MzKzFROTOzq7ISGhERCRHx6fNza3FxaXPTy9MTGxJSSlExOTOTm5LS2tISChPz+/ExGRJyenKyqrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAZ6QJNQeIkUhsjkp+EhMZLITKgBAGigQgiiCtiAKJdkBgNYgDYLhmDjQIbKwgfF9C4hPYC5KSMsbBBIJyJYFQAWQwQbI0J8Jh8nDUgHAAcmDA+LKAAcSAkIEhYTAAEoGxsdSSAKIyJcGyRYJiQbVRwDsVkPXrhDDCQBSUEAIfkECQYAEAAsAAAAAA8ADwCFRD48pKKkdHZ01NLUXFpc7OrsTE5MlJKU9Pb03N7cREZExMbEhIKEbGpsXFZUVFZU/P78tLa0fH583NrcZGJk9PL0VE5MnJ6c/Pb05ObkTEZEREJErKqsfHp81NbUXF5c7O7slJaU5OLkzMrMjIaEdG5sVFJU/Pr8TEpMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABndAiHA4DICISCIllBQWQgSNY6NJJAcoAMCw0XaQBQtAYj0ANgcE0SwZlgSe04hI2FiFAyEFRdQYmh8AakIOJhgQHhVCFQoaRAsVGSQWihAXAF9EHFkNEBUXGxsTSBxaGx9dGxFJGKgKAAoSEydNIwoFg01DF7oQQQAh+QQJBgAYACwAAAAADwAPAIVEPjykoqR0cnTU0tRUUlSMiozs6uxMSkx8fnzc3txcXlyUlpT09vRcWlxMRkS0trR8enzc2txcVlSUkpRUTkyMhoTk5uScnpz8/vxEQkR8dnTU1tRUVlSMjoz08vRMTkyEgoTk4uRkYmSclpT8+vy8urwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGc0CMcEgsGo9Gw6LhkHRCmICFODgAAJ8M4FDJTIUGCgCRwIQKV+9wMiaWtIAvRqOACiMKwucjJzFIJEN+gEQiHAQcJUMeBROCBFcLRBcAEESQAB0GGB4XGRkbghwCnxkiWhkPRRMMCSAfABkIoUhCDLW4Q0EAIfkECQYAGQAsAAAAAA8ADwCFRD48pKKkdHJ01NLU7OrsXFZUjIqMvLq8TEpM3N7c9Pb0lJaUxMbErK6sfH58bGpsVFJUTEZE3Nrc9PL0XF5clJKUxMLEVE5M5Obk/P78nJ6ctLa0hIaEREJE1NbU7O7sXFpcjI6MvL68TE5M5OLk/Pr8nJqczM7MtLK0hIKEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABnPAjHBILBqPRsICFCmESMcBAgAYdQAIi9HzSCUyJEOnAx0GBqUSsQJwYFAZyTiFGZZEgHGlJKACQBIZEwJXVR8iYwANE0MTAVMNGSISHAAhRSUYC2pCJFMhH4IaEAdGDGMdFFcdG0cJKSNYDoFIQgqctblBADs=",
+    html:false,
+    content:"",//设置content后，text和icon设置将无效
+    mask:true//是否显示遮罩（半透明背景）
+  };
+
+  $.fn.mLoading=function (options) {
+    var ops={},
+      funName="",
+      funArgs=[];
+    if(typeof options==="object"){
+      ops = options;
+    }else if(typeof options ==="string"){
+      funName=options;
+      funArgs = arraySlice.call(arguments).splice(0,1);
+    }
+    return this.each(function (i,element) {
+      var dom = $(element),
+        plsInc=dom.data(MLoading.dataKey);
+      if(!plsInc){
+        plsInc=new MLoading(dom,ops);
+      }
+
+      if(funName){
+        var fun = plsInc[funName];
+        if(typeof fun==="function"){
+          fun.apply(plsInc,funArgs);
+        }
+      }
+    });
+  }
+}));
+/*!
+ * jquery-confirm v3.3.4 (http://craftpip.github.io/jquery-confirm/)
+ * Author: Boniface Pereira
+ * Website: www.craftpip.com
+ * Contact: hey@craftpip.com
+ *
+ * Copyright 2013-2019 jquery-confirm
+ * Licensed under MIT (https://github.com/craftpip/jquery-confirm/blob/master/LICENSE)
+ */
+
+(function(factory){if(typeof define==="function"&&define.amd){define(["jquery"],factory);}else{if(typeof module==="object"&&module.exports){module.exports=function(root,jQuery){if(jQuery===undefined){if(typeof window!=="undefined"){jQuery=require("jquery");}else{jQuery=require("jquery")(root);}}factory(jQuery);return jQuery;};}else{factory(jQuery);}}}(function($){var w=window;$.fn.confirm=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false};}$(this).each(function(){var $this=$(this);if($this.attr("jc-attached")){console.warn("jConfirm has already been attached to this element ",$this[0]);return;}$this.on("click",function(e){e.preventDefault();var jcOption=$.extend({},options);if($this.attr("data-title")){jcOption.title=$this.attr("data-title");}if($this.attr("data-content")){jcOption.content=$this.attr("data-content");}if(typeof jcOption.buttons==="undefined"){jcOption.buttons={};}jcOption["$target"]=$this;if($this.attr("href")&&Object.keys(jcOption.buttons).length===0){var buttons=$.extend(true,{},w.jconfirm.pluginDefaults.defaultButtons,(w.jconfirm.defaults||{}).defaultButtons||{});var firstBtn=Object.keys(buttons)[0];jcOption.buttons=buttons;jcOption.buttons[firstBtn].action=function(){location.href=$this.attr("href");};}jcOption.closeIcon=false;var instance=$.confirm(jcOption);});$this.attr("jc-attached",true);});return $(this);};$.confirm=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false};}var putDefaultButtons=!(options.buttons===false);if(typeof options.buttons!=="object"){options.buttons={};}if(Object.keys(options.buttons).length===0&&putDefaultButtons){var buttons=$.extend(true,{},w.jconfirm.pluginDefaults.defaultButtons,(w.jconfirm.defaults||{}).defaultButtons||{});options.buttons=buttons;}return w.jconfirm(options);};$.alert=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false};}var putDefaultButtons=!(options.buttons===false);if(typeof options.buttons!=="object"){options.buttons={};}if(Object.keys(options.buttons).length===0&&putDefaultButtons){var buttons=$.extend(true,{},w.jconfirm.pluginDefaults.defaultButtons,(w.jconfirm.defaults||{}).defaultButtons||{});var firstBtn=Object.keys(buttons)[0];options.buttons[firstBtn]=buttons[firstBtn];}return w.jconfirm(options);};$.dialog=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false,closeIcon:function(){}};}options.buttons={};if(typeof options.closeIcon==="undefined"){options.closeIcon=function(){};}options.confirmKeys=[13];return w.jconfirm(options);};w.jconfirm=function(options){if(typeof options==="undefined"){options={};}var pluginOptions=$.extend(true,{},w.jconfirm.pluginDefaults);if(w.jconfirm.defaults){pluginOptions=$.extend(true,pluginOptions,w.jconfirm.defaults);}pluginOptions=$.extend(true,{},pluginOptions,options);var instance=new w.Jconfirm(pluginOptions);w.jconfirm.instances.push(instance);return instance;};w.Jconfirm=function(options){$.extend(this,options);this._init();};w.Jconfirm.prototype={_init:function(){var that=this;if(!w.jconfirm.instances.length){w.jconfirm.lastFocused=$("body").find(":focus");}this._id=Math.round(Math.random()*99999);this.contentParsed=$(document.createElement("div"));if(!this.lazyOpen){setTimeout(function(){that.open();},0);}},_buildHTML:function(){var that=this;this._parseAnimation(this.animation,"o");this._parseAnimation(this.closeAnimation,"c");this._parseBgDismissAnimation(this.backgroundDismissAnimation);this._parseColumnClass(this.columnClass);this._parseTheme(this.theme);this._parseType(this.type);var template=$(this.template);template.find(".jconfirm-box").addClass(this.animationParsed).addClass(this.backgroundDismissAnimationParsed).addClass(this.typeParsed);if(this.typeAnimated){template.find(".jconfirm-box").addClass("jconfirm-type-animated");}if(this.useBootstrap){template.find(".jc-bs3-row").addClass(this.bootstrapClasses.row);template.find(".jc-bs3-row").addClass("justify-content-md-center justify-content-sm-center justify-content-xs-center justify-content-lg-center");template.find(".jconfirm-box-container").addClass(this.columnClassParsed);if(this.containerFluid){template.find(".jc-bs3-container").addClass(this.bootstrapClasses.containerFluid);}else{template.find(".jc-bs3-container").addClass(this.bootstrapClasses.container);}}else{template.find(".jconfirm-box").css("width",this.boxWidth);}if(this.titleClass){template.find(".jconfirm-title-c").addClass(this.titleClass);}template.addClass(this.themeParsed);var ariaLabel="jconfirm-box"+this._id;template.find(".jconfirm-box").attr("aria-labelledby",ariaLabel).attr("tabindex",-1);template.find(".jconfirm-content").attr("id",ariaLabel);if(this.bgOpacity!==null){template.find(".jconfirm-bg").css("opacity",this.bgOpacity);}if(this.rtl){template.addClass("jconfirm-rtl");}this.$el=template.appendTo(this.container);this.$jconfirmBoxContainer=this.$el.find(".jconfirm-box-container");this.$jconfirmBox=this.$body=this.$el.find(".jconfirm-box");this.$jconfirmBg=this.$el.find(".jconfirm-bg");this.$title=this.$el.find(".jconfirm-title");this.$titleContainer=this.$el.find(".jconfirm-title-c");this.$content=this.$el.find("div.jconfirm-content");this.$contentPane=this.$el.find(".jconfirm-content-pane");this.$icon=this.$el.find(".jconfirm-icon-c");this.$closeIcon=this.$el.find(".jconfirm-closeIcon");this.$holder=this.$el.find(".jconfirm-holder");this.$btnc=this.$el.find(".jconfirm-buttons");this.$scrollPane=this.$el.find(".jconfirm-scrollpane");that.setStartingPoint();this._contentReady=$.Deferred();this._modalReady=$.Deferred();this.$holder.css({"padding-top":this.offsetTop,"padding-bottom":this.offsetBottom,});this.setTitle();this.setIcon();this._setButtons();this._parseContent();this.initDraggable();if(this.isAjax){this.showLoading(false);}$.when(this._contentReady,this._modalReady).then(function(){if(that.isAjaxLoading){setTimeout(function(){that.isAjaxLoading=false;that.setContent();that.setTitle();that.setIcon();setTimeout(function(){that.hideLoading(false);that._updateContentMaxHeight();},100);if(typeof that.onContentReady==="function"){that.onContentReady();}},50);}else{that._updateContentMaxHeight();that.setTitle();that.setIcon();if(typeof that.onContentReady==="function"){that.onContentReady();}}if(that.autoClose){that._startCountDown();}}).then(function(){that._watchContent();});if(this.animation==="none"){this.animationSpeed=1;this.animationBounce=1;}this.$body.css(this._getCSS(this.animationSpeed,this.animationBounce));this.$contentPane.css(this._getCSS(this.animationSpeed,1));this.$jconfirmBg.css(this._getCSS(this.animationSpeed,1));this.$jconfirmBoxContainer.css(this._getCSS(this.animationSpeed,1));},_typePrefix:"jconfirm-type-",typeParsed:"",_parseType:function(type){this.typeParsed=this._typePrefix+type;},setType:function(type){var oldClass=this.typeParsed;this._parseType(type);this.$jconfirmBox.removeClass(oldClass).addClass(this.typeParsed);},themeParsed:"",_themePrefix:"jconfirm-",setTheme:function(theme){var previous=this.theme;this.theme=theme||this.theme;this._parseTheme(this.theme);if(previous){this.$el.removeClass(previous);}this.$el.addClass(this.themeParsed);this.theme=theme;},_parseTheme:function(theme){var that=this;theme=theme.split(",");$.each(theme,function(k,a){if(a.indexOf(that._themePrefix)===-1){theme[k]=that._themePrefix+$.trim(a);}});this.themeParsed=theme.join(" ").toLowerCase();},backgroundDismissAnimationParsed:"",_bgDismissPrefix:"jconfirm-hilight-",_parseBgDismissAnimation:function(bgDismissAnimation){var animation=bgDismissAnimation.split(",");var that=this;$.each(animation,function(k,a){if(a.indexOf(that._bgDismissPrefix)===-1){animation[k]=that._bgDismissPrefix+$.trim(a);}});this.backgroundDismissAnimationParsed=animation.join(" ").toLowerCase();},animationParsed:"",closeAnimationParsed:"",_animationPrefix:"jconfirm-animation-",setAnimation:function(animation){this.animation=animation||this.animation;this._parseAnimation(this.animation,"o");},_parseAnimation:function(animation,which){which=which||"o";var animations=animation.split(",");var that=this;$.each(animations,function(k,a){if(a.indexOf(that._animationPrefix)===-1){animations[k]=that._animationPrefix+$.trim(a);}});var a_string=animations.join(" ").toLowerCase();if(which==="o"){this.animationParsed=a_string;}else{this.closeAnimationParsed=a_string;}return a_string;},setCloseAnimation:function(closeAnimation){this.closeAnimation=closeAnimation||this.closeAnimation;this._parseAnimation(this.closeAnimation,"c");},setAnimationSpeed:function(speed){this.animationSpeed=speed||this.animationSpeed;},columnClassParsed:"",setColumnClass:function(colClass){if(!this.useBootstrap){console.warn("cannot set columnClass, useBootstrap is set to false");return;}this.columnClass=colClass||this.columnClass;this._parseColumnClass(this.columnClass);this.$jconfirmBoxContainer.addClass(this.columnClassParsed);},_updateContentMaxHeight:function(){var height=$(window).height()-(this.$jconfirmBox.outerHeight()-this.$contentPane.outerHeight())-(this.offsetTop+this.offsetBottom);this.$contentPane.css({"max-height":height+"px"});},setBoxWidth:function(width){if(this.useBootstrap){console.warn("cannot set boxWidth, useBootstrap is set to true");return;}this.boxWidth=width;this.$jconfirmBox.css("width",width);},_parseColumnClass:function(colClass){colClass=colClass.toLowerCase();var p;switch(colClass){case"xl":case"xlarge":p="col-md-12";break;case"l":case"large":p="col-md-8 col-md-offset-2";break;case"m":case"medium":p="col-md-6 col-md-offset-3";break;case"s":case"small":p="col-md-4 col-md-offset-4";break;case"xs":case"xsmall":p="col-md-2 col-md-offset-5";break;default:p=colClass;}this.columnClassParsed=p;},initDraggable:function(){var that=this;var $t=this.$titleContainer;this.resetDrag();if(this.draggable){$t.on("mousedown",function(e){$t.addClass("jconfirm-hand");that.mouseX=e.clientX;that.mouseY=e.clientY;that.isDrag=true;});$(window).on("mousemove."+this._id,function(e){if(that.isDrag){that.movingX=e.clientX-that.mouseX+that.initialX;that.movingY=e.clientY-that.mouseY+that.initialY;that.setDrag();}});$(window).on("mouseup."+this._id,function(){$t.removeClass("jconfirm-hand");if(that.isDrag){that.isDrag=false;that.initialX=that.movingX;that.initialY=that.movingY;}});}},resetDrag:function(){this.isDrag=false;this.initialX=0;this.initialY=0;this.movingX=0;this.movingY=0;this.mouseX=0;this.mouseY=0;this.$jconfirmBoxContainer.css("transform","translate("+0+"px, "+0+"px)");},setDrag:function(){if(!this.draggable){return;}this.alignMiddle=false;var boxWidth=this.$jconfirmBox.outerWidth();var boxHeight=this.$jconfirmBox.outerHeight();var windowWidth=$(window).width();var windowHeight=$(window).height();var that=this;var dragUpdate=1;if(that.movingX%dragUpdate===0||that.movingY%dragUpdate===0){if(that.dragWindowBorder){var leftDistance=(windowWidth/2)-boxWidth/2;var topDistance=(windowHeight/2)-boxHeight/2;topDistance-=that.dragWindowGap;leftDistance-=that.dragWindowGap;if(leftDistance+that.movingX<0){that.movingX=-leftDistance;}else{if(leftDistance-that.movingX<0){that.movingX=leftDistance;}}if(topDistance+that.movingY<0){that.movingY=-topDistance;}else{if(topDistance-that.movingY<0){that.movingY=topDistance;}}}that.$jconfirmBoxContainer.css("transform","translate("+that.movingX+"px, "+that.movingY+"px)");}},_scrollTop:function(){if(typeof pageYOffset!=="undefined"){return pageYOffset;}else{var B=document.body;var D=document.documentElement;D=(D.clientHeight)?D:B;return D.scrollTop;}},_watchContent:function(){var that=this;if(this._timer){clearInterval(this._timer);}var prevContentHeight=0;this._timer=setInterval(function(){if(that.smoothContent){var contentHeight=that.$content.outerHeight()||0;if(contentHeight!==prevContentHeight){prevContentHeight=contentHeight;}var wh=$(window).height();var total=that.offsetTop+that.offsetBottom+that.$jconfirmBox.height()-that.$contentPane.height()+that.$content.height();if(total<wh){that.$contentPane.addClass("no-scroll");}else{that.$contentPane.removeClass("no-scroll");}}},this.watchInterval);},_overflowClass:"jconfirm-overflow",_hilightAnimating:false,highlight:function(){this.hiLightModal();},hiLightModal:function(){var that=this;if(this._hilightAnimating){return;}that.$body.addClass("hilight");var duration=parseFloat(that.$body.css("animation-duration"))||2;this._hilightAnimating=true;setTimeout(function(){that._hilightAnimating=false;that.$body.removeClass("hilight");},duration*1000);},_bindEvents:function(){var that=this;this.boxClicked=false;this.$scrollPane.click(function(e){if(!that.boxClicked){var buttonName=false;var shouldClose=false;var str;if(typeof that.backgroundDismiss==="function"){str=that.backgroundDismiss();}else{str=that.backgroundDismiss;}if(typeof str==="string"&&typeof that.buttons[str]!=="undefined"){buttonName=str;shouldClose=false;}else{if(typeof str==="undefined"||!!(str)===true){shouldClose=true;}else{shouldClose=false;}}if(buttonName){var btnResponse=that.buttons[buttonName].action.apply(that);shouldClose=(typeof btnResponse==="undefined")||!!(btnResponse);}if(shouldClose){that.close();}else{that.hiLightModal();}}that.boxClicked=false;});this.$jconfirmBox.click(function(e){that.boxClicked=true;});var isKeyDown=false;$(window).on("jcKeyDown."+that._id,function(e){if(!isKeyDown){isKeyDown=true;}});$(window).on("keyup."+that._id,function(e){if(isKeyDown){that.reactOnKey(e);isKeyDown=false;}});$(window).on("resize."+this._id,function(){that._updateContentMaxHeight();setTimeout(function(){that.resetDrag();},100);});},_cubic_bezier:"0.36, 0.55, 0.19",_getCSS:function(speed,bounce){return{"-webkit-transition-duration":speed/1000+"s","transition-duration":speed/1000+"s","-webkit-transition-timing-function":"cubic-bezier("+this._cubic_bezier+", "+bounce+")","transition-timing-function":"cubic-bezier("+this._cubic_bezier+", "+bounce+")"};},_setButtons:function(){var that=this;var total_buttons=0;if(typeof this.buttons!=="object"){this.buttons={};}$.each(this.buttons,function(key,button){total_buttons+=1;if(typeof button==="function"){that.buttons[key]=button={action:button};}that.buttons[key].text=button.text||key;that.buttons[key].btnClass=button.btnClass||"btn-default";that.buttons[key].action=button.action||function(){};that.buttons[key].keys=button.keys||[];that.buttons[key].isHidden=button.isHidden||false;that.buttons[key].isDisabled=button.isDisabled||false;$.each(that.buttons[key].keys,function(i,a){that.buttons[key].keys[i]=a.toLowerCase();});var button_element=$('<button type="button" class="btn"></button>').html(that.buttons[key].text).addClass(that.buttons[key].btnClass).prop("disabled",that.buttons[key].isDisabled).css("display",that.buttons[key].isHidden?"none":"").click(function(e){e.preventDefault();var res=that.buttons[key].action.apply(that,[that.buttons[key]]);that.onAction.apply(that,[key,that.buttons[key]]);that._stopCountDown();if(typeof res==="undefined"||res){that.close();}});that.buttons[key].el=button_element;that.buttons[key].setText=function(text){button_element.html(text);};that.buttons[key].addClass=function(className){button_element.addClass(className);};that.buttons[key].removeClass=function(className){button_element.removeClass(className);};that.buttons[key].disable=function(){that.buttons[key].isDisabled=true;button_element.prop("disabled",true);};that.buttons[key].enable=function(){that.buttons[key].isDisabled=false;button_element.prop("disabled",false);};that.buttons[key].show=function(){that.buttons[key].isHidden=false;button_element.css("display","");};that.buttons[key].hide=function(){that.buttons[key].isHidden=true;button_element.css("display","none");};that["$_"+key]=that["$$"+key]=button_element;that.$btnc.append(button_element);});if(total_buttons===0){this.$btnc.hide();}if(this.closeIcon===null&&total_buttons===0){this.closeIcon=true;}if(this.closeIcon){if(this.closeIconClass){var closeHtml='<i class="'+this.closeIconClass+'"></i>';this.$closeIcon.html(closeHtml);}this.$closeIcon.click(function(e){e.preventDefault();var buttonName=false;var shouldClose=false;var str;if(typeof that.closeIcon==="function"){str=that.closeIcon();}else{str=that.closeIcon;}if(typeof str==="string"&&typeof that.buttons[str]!=="undefined"){buttonName=str;shouldClose=false;}else{if(typeof str==="undefined"||!!(str)===true){shouldClose=true;}else{shouldClose=false;}}if(buttonName){var btnResponse=that.buttons[buttonName].action.apply(that);shouldClose=(typeof btnResponse==="undefined")||!!(btnResponse);}if(shouldClose){that.close();}});this.$closeIcon.show();}else{this.$closeIcon.hide();}},setTitle:function(string,force){force=force||false;if(typeof string!=="undefined"){if(typeof string==="string"){this.title=string;}else{if(typeof string==="function"){if(typeof string.promise==="function"){console.error("Promise was returned from title function, this is not supported.");}var response=string();if(typeof response==="string"){this.title=response;}else{this.title=false;}}else{this.title=false;}}}if(this.isAjaxLoading&&!force){return;}this.$title.html(this.title||"");this.updateTitleContainer();},setIcon:function(iconClass,force){force=force||false;if(typeof iconClass!=="undefined"){if(typeof iconClass==="string"){this.icon=iconClass;}else{if(typeof iconClass==="function"){var response=iconClass();if(typeof response==="string"){this.icon=response;}else{this.icon=false;}}else{this.icon=false;}}}if(this.isAjaxLoading&&!force){return;}this.$icon.html(this.icon?'<i class="'+this.icon+'"></i>':"");this.updateTitleContainer();},updateTitleContainer:function(){if(!this.title&&!this.icon){this.$titleContainer.hide();}else{this.$titleContainer.show();}},setContentPrepend:function(content,force){if(!content){return;}this.contentParsed.prepend(content);},setContentAppend:function(content){if(!content){return;}this.contentParsed.append(content);},setContent:function(content,force){force=!!force;var that=this;if(content){this.contentParsed.html("").append(content);}if(this.isAjaxLoading&&!force){return;}this.$content.html("");this.$content.append(this.contentParsed);setTimeout(function(){that.$body.find("input[autofocus]:visible:first").focus();},100);},loadingSpinner:false,showLoading:function(disableButtons){this.loadingSpinner=true;this.$jconfirmBox.addClass("loading");if(disableButtons){this.$btnc.find("button").prop("disabled",true);}},hideLoading:function(enableButtons){this.loadingSpinner=false;this.$jconfirmBox.removeClass("loading");if(enableButtons){this.$btnc.find("button").prop("disabled",false);}},ajaxResponse:false,contentParsed:"",isAjax:false,isAjaxLoading:false,_parseContent:function(){var that=this;var e="&nbsp;";if(typeof this.content==="function"){var res=this.content.apply(this);if(typeof res==="string"){this.content=res;}else{if(typeof res==="object"&&typeof res.always==="function"){this.isAjax=true;this.isAjaxLoading=true;res.always(function(data,status,xhr){that.ajaxResponse={data:data,status:status,xhr:xhr};that._contentReady.resolve(data,status,xhr);if(typeof that.contentLoaded==="function"){that.contentLoaded(data,status,xhr);}});this.content=e;}else{this.content=e;}}}if(typeof this.content==="string"&&this.content.substr(0,4).toLowerCase()==="url:"){this.isAjax=true;this.isAjaxLoading=true;var u=this.content.substring(4,this.content.length);$.get(u).done(function(html){that.contentParsed.html(html);}).always(function(data,status,xhr){that.ajaxResponse={data:data,status:status,xhr:xhr};that._contentReady.resolve(data,status,xhr);if(typeof that.contentLoaded==="function"){that.contentLoaded(data,status,xhr);}});}if(!this.content){this.content=e;}if(!this.isAjax){this.contentParsed.html(this.content);this.setContent();that._contentReady.resolve();}},_stopCountDown:function(){clearInterval(this.autoCloseInterval);if(this.$cd){this.$cd.remove();}},_startCountDown:function(){var that=this;var opt=this.autoClose.split("|");if(opt.length!==2){console.error("Invalid option for autoClose. example 'close|10000'");return false;}var button_key=opt[0];var time=parseInt(opt[1]);if(typeof this.buttons[button_key]==="undefined"){console.error("Invalid button key '"+button_key+"' for autoClose");return false;}var seconds=Math.ceil(time/1000);this.$cd=$('<span class="countdown"> ('+seconds+")</span>").appendTo(this["$_"+button_key]);this.autoCloseInterval=setInterval(function(){that.$cd.html(" ("+(seconds-=1)+") ");if(seconds<=0){that["$$"+button_key].trigger("click");that._stopCountDown();}},1000);},_getKey:function(key){switch(key){case 192:return"tilde";case 13:return"enter";case 16:return"shift";case 9:return"tab";case 20:return"capslock";case 17:return"ctrl";case 91:return"win";case 18:return"alt";case 27:return"esc";case 32:return"space";}var initial=String.fromCharCode(key);if(/^[A-z0-9]+$/.test(initial)){return initial.toLowerCase();}else{return false;}},reactOnKey:function(e){var that=this;var a=$(".jconfirm");if(a.eq(a.length-1)[0]!==this.$el[0]){return false;}var key=e.which;if(this.$content.find(":input").is(":focus")&&/13|32/.test(key)){return false;}var keyChar=this._getKey(key);if(keyChar==="esc"&&this.escapeKey){if(this.escapeKey===true){this.$scrollPane.trigger("click");}else{if(typeof this.escapeKey==="string"||typeof this.escapeKey==="function"){var buttonKey;if(typeof this.escapeKey==="function"){buttonKey=this.escapeKey();}else{buttonKey=this.escapeKey;}if(buttonKey){if(typeof this.buttons[buttonKey]==="undefined"){console.warn("Invalid escapeKey, no buttons found with key "+buttonKey);}else{this["$_"+buttonKey].trigger("click");}}}}}$.each(this.buttons,function(key,button){if(button.keys.indexOf(keyChar)!==-1){that["$_"+key].trigger("click");}});},setDialogCenter:function(){console.info("setDialogCenter is deprecated, dialogs are centered with CSS3 tables");},_unwatchContent:function(){clearInterval(this._timer);},close:function(onClosePayload){var that=this;if(typeof this.onClose==="function"){this.onClose(onClosePayload);}this._unwatchContent();$(window).unbind("resize."+this._id);$(window).unbind("keyup."+this._id);$(window).unbind("jcKeyDown."+this._id);if(this.draggable){$(window).unbind("mousemove."+this._id);$(window).unbind("mouseup."+this._id);this.$titleContainer.unbind("mousedown");}that.$el.removeClass(that.loadedClass);$("body").removeClass("jconfirm-no-scroll-"+that._id);that.$jconfirmBoxContainer.removeClass("jconfirm-no-transition");setTimeout(function(){that.$body.addClass(that.closeAnimationParsed);that.$jconfirmBg.addClass("jconfirm-bg-h");var closeTimer=(that.closeAnimation==="none")?1:that.animationSpeed;setTimeout(function(){that.$el.remove();var l=w.jconfirm.instances;var i=w.jconfirm.instances.length-1;for(i;i>=0;i--){if(w.jconfirm.instances[i]._id===that._id){w.jconfirm.instances.splice(i,1);}}if(!w.jconfirm.instances.length){if(that.scrollToPreviousElement&&w.jconfirm.lastFocused&&w.jconfirm.lastFocused.length&&$.contains(document,w.jconfirm.lastFocused[0])){var $lf=w.jconfirm.lastFocused;if(that.scrollToPreviousElementAnimate){var st=$(window).scrollTop();var ot=w.jconfirm.lastFocused.offset().top;var wh=$(window).height();if(!(ot>st&&ot<(st+wh))){var scrollTo=(ot-Math.round((wh/3)));$("html, body").animate({scrollTop:scrollTo},that.animationSpeed,"swing",function(){$lf.focus();});}else{$lf.focus();}}else{$lf.focus();}w.jconfirm.lastFocused=false;}}if(typeof that.onDestroy==="function"){that.onDestroy();}},closeTimer*0.4);},50);return true;},open:function(){if(this.isOpen()){return false;}this._buildHTML();this._bindEvents();this._open();return true;},setStartingPoint:function(){var el=false;if(this.animateFromElement!==true&&this.animateFromElement){el=this.animateFromElement;w.jconfirm.lastClicked=false;}else{if(w.jconfirm.lastClicked&&this.animateFromElement===true){el=w.jconfirm.lastClicked;w.jconfirm.lastClicked=false;}else{return false;}}if(!el){return false;}var offset=el.offset();var iTop=el.outerHeight()/2;var iLeft=el.outerWidth()/2;iTop-=this.$jconfirmBox.outerHeight()/2;iLeft-=this.$jconfirmBox.outerWidth()/2;var sourceTop=offset.top+iTop;sourceTop=sourceTop-this._scrollTop();var sourceLeft=offset.left+iLeft;var wh=$(window).height()/2;var ww=$(window).width()/2;var targetH=wh-this.$jconfirmBox.outerHeight()/2;var targetW=ww-this.$jconfirmBox.outerWidth()/2;sourceTop-=targetH;sourceLeft-=targetW;if(Math.abs(sourceTop)>wh||Math.abs(sourceLeft)>ww){return false;}this.$jconfirmBoxContainer.css("transform","translate("+sourceLeft+"px, "+sourceTop+"px)");},_open:function(){var that=this;if(typeof that.onOpenBefore==="function"){that.onOpenBefore();}this.$body.removeClass(this.animationParsed);this.$jconfirmBg.removeClass("jconfirm-bg-h");this.$body.focus();that.$jconfirmBoxContainer.css("transform","translate("+0+"px, "+0+"px)");setTimeout(function(){that.$body.css(that._getCSS(that.animationSpeed,1));that.$body.css({"transition-property":that.$body.css("transition-property")+", margin"});that.$jconfirmBoxContainer.addClass("jconfirm-no-transition");that._modalReady.resolve();if(typeof that.onOpen==="function"){that.onOpen();}that.$el.addClass(that.loadedClass);},this.animationSpeed);},loadedClass:"jconfirm-open",isClosed:function(){return !this.$el||this.$el.parent().length===0;},isOpen:function(){return !this.isClosed();},toggle:function(){if(!this.isOpen()){this.open();}else{this.close();}}};w.jconfirm.instances=[];w.jconfirm.lastFocused=false;w.jconfirm.pluginDefaults={template:'<div class="jconfirm"><div class="jconfirm-bg jconfirm-bg-h"></div><div class="jconfirm-scrollpane"><div class="jconfirm-row"><div class="jconfirm-cell"><div class="jconfirm-holder"><div class="jc-bs3-container"><div class="jc-bs3-row"><div class="jconfirm-box-container jconfirm-animated"><div class="jconfirm-box" role="dialog" aria-labelledby="labelled" tabindex="-1"><div class="jconfirm-closeIcon">&times;</div><div class="jconfirm-title-c"><span class="jconfirm-icon-c"></span><span class="jconfirm-title"></span></div><div class="jconfirm-content-pane"><div class="jconfirm-content"></div></div><div class="jconfirm-buttons"></div><div class="jconfirm-clear"></div></div></div></div></div></div></div></div></div></div>',title:"Hello",titleClass:"",type:"default",typeAnimated:true,draggable:true,dragWindowGap:15,dragWindowBorder:true,animateFromElement:true,alignMiddle:true,smoothContent:true,content:"Are you sure to continue?",buttons:{},defaultButtons:{ok:{action:function(){}},close:{action:function(){}}},contentLoaded:function(){},icon:"",lazyOpen:false,bgOpacity:null,theme:"light",animation:"scale",closeAnimation:"scale",animationSpeed:400,animationBounce:1,escapeKey:true,rtl:false,container:"body",containerFluid:false,backgroundDismiss:false,backgroundDismissAnimation:"shake",autoClose:false,closeIcon:null,closeIconClass:false,watchInterval:100,columnClass:"col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1",boxWidth:"50%",scrollToPreviousElement:true,scrollToPreviousElementAnimate:true,useBootstrap:true,offsetTop:40,offsetBottom:40,bootstrapClasses:{container:"container",containerFluid:"container-fluid",row:"row"},onContentReady:function(){},onOpenBefore:function(){},onOpen:function(){},onClose:function(){},onDestroy:function(){},onAction:function(){}};var keyDown=false;$(window).on("keydown",function(e){if(!keyDown){var $target=$(e.target);var pass=false;if($target.closest(".jconfirm-box").length){pass=true;}if(pass){$(window).trigger("jcKeyDown");}keyDown=true;}});$(window).on("keyup",function(){keyDown=false;});w.jconfirm.lastClicked=false;$(document).on("mousedown","button, a, [jc-source]",function(){w.jconfirm.lastClicked=$(this);});}));
+function createMDEditor(element, opts){
+  var defaults = {
+    height: 600,
+    path: '/editormd/lib/',
+    syncScrolling: "single",
+    tex: true,
+    tocm: true,
+    emoji: true,
+    taskList: true,
+    codeFold: true,
+    searchReplace: true,
+    htmlDecode: "style,script,iframe",
+    sequenceDiagram: true,
+    autoFocus: false,
+    toolbarIcons: function () {
+      // Or return editormd.toolbarModes[name]; // full, simple, mini
+      // Using "||" set icons align right.
+      return ["bold", "italic", "|", "list-ul", "list-ol", "|", "code", "code-block", "|", "image", "table", '|', "watch", "clear"]
+    },
+    //这个配置在simple.html中并没有，但是为了能够提交表单，使用这个配置可以让构造出来的HTML代码直接在第二个隐藏的textarea域中，方便post提交表单。
+    saveHTMLToTextarea: true,
+    dialogMaskOpacity: 0.6,
+    imageUpload: true,
+    imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp", "JPG", "JPEG", "GIF", "PNG", "BMP", "WEBP"],
+    imageUploadURL: '/api/attachments.json'
+  }
+  var options = $.extend({}, defaults, opts);
+
+  return editormd(element, options);
+}
+
+function ajaxErrorNotifyHandler(res) {
+  var message = '';
+  if(res.status !== 500){
+    message = res.responseJSON.message;
+  } else {
+    message = '系统错误';
+  }
+  return $.notify({message: message}, {type: 'danger'});
+}
+
+function resetFileInputFunc(file){
+  file.after(file.clone().val(""));
+  file.remove();
+}
+
+function customConfirm(opts){
+  var okCallback = opts.ok;
+  var cancelCallback = opts.cancel;
+
+  var defaultOpts = {
+    title: '提示',
+    buttons: {
+      ok: {
+        text: '确认',
+        btnClass: 'btn btn-primary',
+        action: okCallback
+      },
+      cancel: {
+        text: '取消',
+        btnClass: 'btn btn-secondary',
+        action: cancelCallback
+      },
+    }
+  }
+  return $.confirm($.extend({}, defaultOpts, opts))
+}
+
+function customLoading(opts) {
+  var loading;
+  var defaultOpts = {
+    content: opts.ajax,
+    contentLoaded: function(){
+      setTimeout(function(){
+        loading.close()
+      }, 200);
+    }
+  }
+  loading = $.confirm($.extend({}, defaultOpts, opts));
+  return loading;
+}
+
+function show_success_flash(message){
+  $.notify({
+		message: message || '操作成功'
+  },{
+    type: 'success'
+  });
+}
+
+function showSuccessFlash(message){
+  $.notify({
+		message: message || '操作成功'
+  },{
+    type: 'success'
+  });
+}
+
+function showErrorNotify(message){
+  $.notify({
+    message: message || '操作失败'
+  },{
+    type: 'danger'
+  });
+}
+;
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+	typeof define === 'function' && define.amd ? define(['exports'], factory) :
+	(factory((global.echarts = {})));
+}(this, (function (exports) { 'use strict';
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// (1) The code `if (__DEV__) ...` can be removed by build tool.
+// (2) If intend to use `__DEV__`, this module should be imported. Use a global
+// variable `__DEV__` may cause that miss the declaration (see #6535), or the
+// declaration is behind of the using position (for example in `Model.extent`,
+// And tools like rollup can not analysis the dependency if not import).
+
+var dev;
+
+// In browser
+if (typeof window !== 'undefined') {
+    dev = window.__DEV__;
+}
+// In node
+else if (typeof global !== 'undefined') {
+    dev = global.__DEV__;
+}
+
+if (typeof dev === 'undefined') {
+    dev = true;
+}
+
+var __DEV__ = dev;
+
+/**
+ * zrender: 生成唯一id
+ *
+ * @author errorrik (errorrik@gmail.com)
+ */
+
+var idStart = 0x0907;
+
+var guid = function () {
+    return idStart++;
+};
+
+/**
+ * echarts设备环境识别
+ *
+ * @desc echarts基于Canvas，纯Javascript图表库，提供直观，生动，可交互，可个性化定制的数据统计图表。
+ * @author firede[firede@firede.us]
+ * @desc thanks zepto.
+ */
+
+var env = {};
+
+if (typeof wx === 'object' && typeof wx.getSystemInfoSync === 'function') {
+    // In Weixin Application
+    env = {
+        browser: {},
+        os: {},
+        node: false,
+        wxa: true, // Weixin Application
+        canvasSupported: true,
+        svgSupported: false,
+        touchEventsSupported: true
+    };
+}
+else if (typeof document === 'undefined' && typeof self !== 'undefined') {
+    // In worker
+    env = {
+        browser: {},
+        os: {},
+        node: false,
+        worker: true,
+        canvasSupported: true
+    };
+}
+else if (typeof navigator === 'undefined') {
+    // In node
+    env = {
+        browser: {},
+        os: {},
+        node: true,
+        worker: false,
+        // Assume canvas is supported
+        canvasSupported: true,
+        svgSupported: true
+    };
+}
+else {
+    env = detect(navigator.userAgent);
+}
+
+var env$1 = env;
+
+// Zepto.js
+// (c) 2010-2013 Thomas Fuchs
+// Zepto.js may be freely distributed under the MIT license.
+
+function detect(ua) {
+    var os = {};
+    var browser = {};
+    // var webkit = ua.match(/Web[kK]it[\/]{0,1}([\d.]+)/);
+    // var android = ua.match(/(Android);?[\s\/]+([\d.]+)?/);
+    // var ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
+    // var ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
+    // var iphone = !ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/);
+    // var webos = ua.match(/(webOS|hpwOS)[\s\/]([\d.]+)/);
+    // var touchpad = webos && ua.match(/TouchPad/);
+    // var kindle = ua.match(/Kindle\/([\d.]+)/);
+    // var silk = ua.match(/Silk\/([\d._]+)/);
+    // var blackberry = ua.match(/(BlackBerry).*Version\/([\d.]+)/);
+    // var bb10 = ua.match(/(BB10).*Version\/([\d.]+)/);
+    // var rimtabletos = ua.match(/(RIM\sTablet\sOS)\s([\d.]+)/);
+    // var playbook = ua.match(/PlayBook/);
+    // var chrome = ua.match(/Chrome\/([\d.]+)/) || ua.match(/CriOS\/([\d.]+)/);
+    var firefox = ua.match(/Firefox\/([\d.]+)/);
+    // var safari = webkit && ua.match(/Mobile\//) && !chrome;
+    // var webview = ua.match(/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/) && !chrome;
+    var ie = ua.match(/MSIE\s([\d.]+)/)
+        // IE 11 Trident/7.0; rv:11.0
+        || ua.match(/Trident\/.+?rv:(([\d.]+))/);
+    var edge = ua.match(/Edge\/([\d.]+)/); // IE 12 and 12+
+
+    var weChat = (/micromessenger/i).test(ua);
+
+    // Todo: clean this up with a better OS/browser seperation:
+    // - discern (more) between multiple browsers on android
+    // - decide if kindle fire in silk mode is android or not
+    // - Firefox on Android doesn't specify the Android version
+    // - possibly devide in os, device and browser hashes
+
+    // if (browser.webkit = !!webkit) browser.version = webkit[1];
+
+    // if (android) os.android = true, os.version = android[2];
+    // if (iphone && !ipod) os.ios = os.iphone = true, os.version = iphone[2].replace(/_/g, '.');
+    // if (ipad) os.ios = os.ipad = true, os.version = ipad[2].replace(/_/g, '.');
+    // if (ipod) os.ios = os.ipod = true, os.version = ipod[3] ? ipod[3].replace(/_/g, '.') : null;
+    // if (webos) os.webos = true, os.version = webos[2];
+    // if (touchpad) os.touchpad = true;
+    // if (blackberry) os.blackberry = true, os.version = blackberry[2];
+    // if (bb10) os.bb10 = true, os.version = bb10[2];
+    // if (rimtabletos) os.rimtabletos = true, os.version = rimtabletos[2];
+    // if (playbook) browser.playbook = true;
+    // if (kindle) os.kindle = true, os.version = kindle[1];
+    // if (silk) browser.silk = true, browser.version = silk[1];
+    // if (!silk && os.android && ua.match(/Kindle Fire/)) browser.silk = true;
+    // if (chrome) browser.chrome = true, browser.version = chrome[1];
+    if (firefox) {
+        browser.firefox = true;
+        browser.version = firefox[1];
+    }
+    // if (safari && (ua.match(/Safari/) || !!os.ios)) browser.safari = true;
+    // if (webview) browser.webview = true;
+
+    if (ie) {
+        browser.ie = true;
+        browser.version = ie[1];
+    }
+
+    if (edge) {
+        browser.edge = true;
+        browser.version = edge[1];
+    }
+
+    // It is difficult to detect WeChat in Win Phone precisely, because ua can
+    // not be set on win phone. So we do not consider Win Phone.
+    if (weChat) {
+        browser.weChat = true;
+    }
+
+    // os.tablet = !!(ipad || playbook || (android && !ua.match(/Mobile/)) ||
+    //     (firefox && ua.match(/Tablet/)) || (ie && !ua.match(/Phone/) && ua.match(/Touch/)));
+    // os.phone  = !!(!os.tablet && !os.ipod && (android || iphone || webos ||
+    //     (chrome && ua.match(/Android/)) || (chrome && ua.match(/CriOS\/([\d.]+)/)) ||
+    //     (firefox && ua.match(/Mobile/)) || (ie && ua.match(/Touch/))));
+
+    return {
+        browser: browser,
+        os: os,
+        node: false,
+        // 原生canvas支持，改极端点了
+        // canvasSupported : !(browser.ie && parseFloat(browser.version) < 9)
+        canvasSupported: !!document.createElement('canvas').getContext,
+        svgSupported: typeof SVGRect !== 'undefined',
+        // works on most browsers
+        // IE10/11 does not support touch event, and MS Edge supports them but not by
+        // default, so we dont check navigator.maxTouchPoints for them here.
+        touchEventsSupported: 'ontouchstart' in window && !browser.ie && !browser.edge,
+        // <http://caniuse.com/#search=pointer%20event>.
+        pointerEventsSupported: 'onpointerdown' in window
+            // Firefox supports pointer but not by default, only MS browsers are reliable on pointer
+            // events currently. So we dont use that on other browsers unless tested sufficiently.
+            // Although IE 10 supports pointer event, it use old style and is different from the
+            // standard. So we exclude that. (IE 10 is hardly used on touch device)
+            && (browser.edge || (browser.ie && browser.version >= 11))
+        // passiveSupported: detectPassiveSupport()
+    };
+}
+
+// See https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md#feature-detection
+// function detectPassiveSupport() {
+//     // Test via a getter in the options object to see if the passive property is accessed
+//     var supportsPassive = false;
+//     try {
+//         var opts = Object.defineProperty({}, 'passive', {
+//             get: function() {
+//                 supportsPassive = true;
+//             }
+//         });
+//         window.addEventListener('testPassive', function() {}, opts);
+//     } catch (e) {
+//     }
+//     return supportsPassive;
+// }
+
+/**
+ * @module zrender/core/util
+ */
+
+// 用于处理merge时无法遍历Date等对象的问题
+var BUILTIN_OBJECT = {
+    '[object Function]': 1,
+    '[object RegExp]': 1,
+    '[object Date]': 1,
+    '[object Error]': 1,
+    '[object CanvasGradient]': 1,
+    '[object CanvasPattern]': 1,
+    // For node-canvas
+    '[object Image]': 1,
+    '[object Canvas]': 1
+};
+
+var TYPED_ARRAY = {
+    '[object Int8Array]': 1,
+    '[object Uint8Array]': 1,
+    '[object Uint8ClampedArray]': 1,
+    '[object Int16Array]': 1,
+    '[object Uint16Array]': 1,
+    '[object Int32Array]': 1,
+    '[object Uint32Array]': 1,
+    '[object Float32Array]': 1,
+    '[object Float64Array]': 1
+};
+
+var objToString = Object.prototype.toString;
+
+var arrayProto = Array.prototype;
+var nativeForEach = arrayProto.forEach;
+var nativeFilter = arrayProto.filter;
+var nativeSlice = arrayProto.slice;
+var nativeMap = arrayProto.map;
+var nativeReduce = arrayProto.reduce;
+
+// Avoid assign to an exported variable, for transforming to cjs.
+var methods = {};
+
+function $override(name, fn) {
+    // Clear ctx instance for different environment
+    if (name === 'createCanvas') {
+        _ctx = null;
+    }
+
+    methods[name] = fn;
+}
+
+/**
+ * Those data types can be cloned:
+ *     Plain object, Array, TypedArray, number, string, null, undefined.
+ * Those data types will be assgined using the orginal data:
+ *     BUILTIN_OBJECT
+ * Instance of user defined class will be cloned to a plain object, without
+ * properties in prototype.
+ * Other data types is not supported (not sure what will happen).
+ *
+ * Caution: do not support clone Date, for performance consideration.
+ * (There might be a large number of date in `series.data`).
+ * So date should not be modified in and out of echarts.
+ *
+ * @param {*} source
+ * @return {*} new
+ */
+function clone(source) {
+    if (source == null || typeof source != 'object') {
+        return source;
+    }
+
+    var result = source;
+    var typeStr = objToString.call(source);
+
+    if (typeStr === '[object Array]') {
+        if (!isPrimitive(source)) {
+            result = [];
+            for (var i = 0, len = source.length; i < len; i++) {
+                result[i] = clone(source[i]);
+            }
+        }
+    }
+    else if (TYPED_ARRAY[typeStr]) {
+        if (!isPrimitive(source)) {
+            var Ctor = source.constructor;
+            if (source.constructor.from) {
+                result = Ctor.from(source);
+            }
+            else {
+                result = new Ctor(source.length);
+                for (var i = 0, len = source.length; i < len; i++) {
+                    result[i] = clone(source[i]);
+                }
+            }
+        }
+    }
+    else if (!BUILTIN_OBJECT[typeStr] && !isPrimitive(source) && !isDom(source)) {
+        result = {};
+        for (var key in source) {
+            if (source.hasOwnProperty(key)) {
+                result[key] = clone(source[key]);
+            }
+        }
+    }
+
+    return result;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} target
+ * @param {*} source
+ * @param {boolean} [overwrite=false]
+ */
+function merge(target, source, overwrite) {
+    // We should escapse that source is string
+    // and enter for ... in ...
+    if (!isObject$1(source) || !isObject$1(target)) {
+        return overwrite ? clone(source) : target;
+    }
+
+    for (var key in source) {
+        if (source.hasOwnProperty(key)) {
+            var targetProp = target[key];
+            var sourceProp = source[key];
+
+            if (isObject$1(sourceProp)
+                && isObject$1(targetProp)
+                && !isArray(sourceProp)
+                && !isArray(targetProp)
+                && !isDom(sourceProp)
+                && !isDom(targetProp)
+                && !isBuiltInObject(sourceProp)
+                && !isBuiltInObject(targetProp)
+                && !isPrimitive(sourceProp)
+                && !isPrimitive(targetProp)
+            ) {
+                // 如果需要递归覆盖，就递归调用merge
+                merge(targetProp, sourceProp, overwrite);
+            }
+            else if (overwrite || !(key in target)) {
+                // 否则只处理overwrite为true，或者在目标对象中没有此属性的情况
+                // NOTE，在 target[key] 不存在的时候也是直接覆盖
+                target[key] = clone(source[key], true);
+            }
+        }
+    }
+
+    return target;
+}
+
+/**
+ * @param {Array} targetAndSources The first item is target, and the rests are source.
+ * @param {boolean} [overwrite=false]
+ * @return {*} target
+ */
+function mergeAll(targetAndSources, overwrite) {
+    var result = targetAndSources[0];
+    for (var i = 1, len = targetAndSources.length; i < len; i++) {
+        result = merge(result, targetAndSources[i], overwrite);
+    }
+    return result;
+}
+
+/**
+ * @param {*} target
+ * @param {*} source
+ * @memberOf module:zrender/core/util
+ */
+function extend(target, source) {
+    for (var key in source) {
+        if (source.hasOwnProperty(key)) {
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+
+/**
+ * @param {*} target
+ * @param {*} source
+ * @param {boolean} [overlay=false]
+ * @memberOf module:zrender/core/util
+ */
+function defaults(target, source, overlay) {
+    for (var key in source) {
+        if (source.hasOwnProperty(key)
+            && (overlay ? source[key] != null : target[key] == null)
+        ) {
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+
+var createCanvas = function () {
+    return methods.createCanvas();
+};
+
+methods.createCanvas = function () {
+    return document.createElement('canvas');
+};
+
+// FIXME
+var _ctx;
+
+function getContext() {
+    if (!_ctx) {
+        // Use util.createCanvas instead of createCanvas
+        // because createCanvas may be overwritten in different environment
+        _ctx = createCanvas().getContext('2d');
+    }
+    return _ctx;
+}
+
+/**
+ * 查询数组中元素的index
+ * @memberOf module:zrender/core/util
+ */
+function indexOf(array, value) {
+    if (array) {
+        if (array.indexOf) {
+            return array.indexOf(value);
+        }
+        for (var i = 0, len = array.length; i < len; i++) {
+            if (array[i] === value) {
+                return i;
+            }
+        }
+    }
+    return -1;
+}
+
+/**
+ * 构造类继承关系
+ *
+ * @memberOf module:zrender/core/util
+ * @param {Function} clazz 源类
+ * @param {Function} baseClazz 基类
+ */
+function inherits(clazz, baseClazz) {
+    var clazzPrototype = clazz.prototype;
+    function F() {}
+    F.prototype = baseClazz.prototype;
+    clazz.prototype = new F();
+
+    for (var prop in clazzPrototype) {
+        clazz.prototype[prop] = clazzPrototype[prop];
+    }
+    clazz.prototype.constructor = clazz;
+    clazz.superClass = baseClazz;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Object|Function} target
+ * @param {Object|Function} sorce
+ * @param {boolean} overlay
+ */
+function mixin(target, source, overlay) {
+    target = 'prototype' in target ? target.prototype : target;
+    source = 'prototype' in source ? source.prototype : source;
+
+    defaults(target, source, overlay);
+}
+
+/**
+ * Consider typed array.
+ * @param {Array|TypedArray} data
+ */
+function isArrayLike(data) {
+    if (! data) {
+        return;
+    }
+    if (typeof data == 'string') {
+        return false;
+    }
+    return typeof data.length == 'number';
+}
+
+/**
+ * 数组或对象遍历
+ * @memberOf module:zrender/core/util
+ * @param {Object|Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ */
+function each$1(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.forEach && obj.forEach === nativeForEach) {
+        obj.forEach(cb, context);
+    }
+    else if (obj.length === +obj.length) {
+        for (var i = 0, len = obj.length; i < len; i++) {
+            cb.call(context, obj[i], i, obj);
+        }
+    }
+    else {
+        for (var key in obj) {
+            if (obj.hasOwnProperty(key)) {
+                cb.call(context, obj[key], key, obj);
+            }
+        }
+    }
+}
+
+/**
+ * 数组映射
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ * @return {Array}
+ */
+function map(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.map && obj.map === nativeMap) {
+        return obj.map(cb, context);
+    }
+    else {
+        var result = [];
+        for (var i = 0, len = obj.length; i < len; i++) {
+            result.push(cb.call(context, obj[i], i, obj));
+        }
+        return result;
+    }
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {Object} [memo]
+ * @param {*} [context]
+ * @return {Array}
+ */
+function reduce(obj, cb, memo, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.reduce && obj.reduce === nativeReduce) {
+        return obj.reduce(cb, memo, context);
+    }
+    else {
+        for (var i = 0, len = obj.length; i < len; i++) {
+            memo = cb.call(context, memo, obj[i], i, obj);
+        }
+        return memo;
+    }
+}
+
+/**
+ * 数组过滤
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ * @return {Array}
+ */
+function filter(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.filter && obj.filter === nativeFilter) {
+        return obj.filter(cb, context);
+    }
+    else {
+        var result = [];
+        for (var i = 0, len = obj.length; i < len; i++) {
+            if (cb.call(context, obj[i], i, obj)) {
+                result.push(obj[i]);
+            }
+        }
+        return result;
+    }
+}
+
+/**
+ * 数组项查找
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ * @return {*}
+ */
+function find(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    for (var i = 0, len = obj.length; i < len; i++) {
+        if (cb.call(context, obj[i], i, obj)) {
+            return obj[i];
+        }
+    }
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Function} func
+ * @param {*} context
+ * @return {Function}
+ */
+function bind(func, context) {
+    var args = nativeSlice.call(arguments, 2);
+    return function () {
+        return func.apply(context, args.concat(nativeSlice.call(arguments)));
+    };
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Function} func
+ * @return {Function}
+ */
+function curry(func) {
+    var args = nativeSlice.call(arguments, 1);
+    return function () {
+        return func.apply(this, args.concat(nativeSlice.call(arguments)));
+    };
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isArray(value) {
+    return objToString.call(value) === '[object Array]';
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isFunction$1(value) {
+    return typeof value === 'function';
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isString(value) {
+    return objToString.call(value) === '[object String]';
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isObject$1(value) {
+    // Avoid a V8 JIT bug in Chrome 19-20.
+    // See https://code.google.com/p/v8/issues/detail?id=2291 for more details.
+    var type = typeof value;
+    return type === 'function' || (!!value && type == 'object');
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isBuiltInObject(value) {
+    return !!BUILTIN_OBJECT[objToString.call(value)];
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isTypedArray(value) {
+    return !!TYPED_ARRAY[objToString.call(value)];
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isDom(value) {
+    return typeof value === 'object'
+        && typeof value.nodeType === 'number'
+        && typeof value.ownerDocument === 'object';
+}
+
+/**
+ * Whether is exactly NaN. Notice isNaN('a') returns true.
+ * @param {*} value
+ * @return {boolean}
+ */
+function eqNaN(value) {
+    return value !== value;
+}
+
+/**
+ * If value1 is not null, then return value1, otherwise judget rest of values.
+ * Low performance.
+ * @memberOf module:zrender/core/util
+ * @return {*} Final value
+ */
+function retrieve(values) {
+    for (var i = 0, len = arguments.length; i < len; i++) {
+        if (arguments[i] != null) {
+            return arguments[i];
+        }
+    }
+}
+
+function retrieve2(value0, value1) {
+    return value0 != null
+        ? value0
+        : value1;
+}
+
+function retrieve3(value0, value1, value2) {
+    return value0 != null
+        ? value0
+        : value1 != null
+        ? value1
+        : value2;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Array} arr
+ * @param {number} startIndex
+ * @param {number} endIndex
+ * @return {Array}
+ */
+function slice() {
+    return Function.call.apply(nativeSlice, arguments);
+}
+
+/**
+ * Normalize css liked array configuration
+ * e.g.
+ *  3 => [3, 3, 3, 3]
+ *  [4, 2] => [4, 2, 4, 2]
+ *  [4, 3, 2] => [4, 3, 2, 3]
+ * @param {number|Array.<number>} val
+ * @return {Array.<number>}
+ */
+function normalizeCssArray(val) {
+    if (typeof (val) === 'number') {
+        return [val, val, val, val];
+    }
+    var len = val.length;
+    if (len === 2) {
+        // vertical | horizontal
+        return [val[0], val[1], val[0], val[1]];
+    }
+    else if (len === 3) {
+        // top | horizontal | bottom
+        return [val[0], val[1], val[2], val[1]];
+    }
+    return val;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {boolean} condition
+ * @param {string} message
+ */
+function assert$1(condition, message) {
+    if (!condition) {
+        throw new Error(message);
+    }
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {string} str string to be trimed
+ * @return {string} trimed string
+ */
+function trim(str) {
+    if (str == null) {
+        return null;
+    }
+    else if (typeof str.trim === 'function') {
+        return str.trim();
+    }
+    else {
+        return str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
+    }
+}
+
+var primitiveKey = '__ec_primitive__';
+/**
+ * Set an object as primitive to be ignored traversing children in clone or merge
+ */
+function setAsPrimitive(obj) {
+    obj[primitiveKey] = true;
+}
+
+function isPrimitive(obj) {
+    return obj[primitiveKey];
+}
+
+/**
+ * @constructor
+ * @param {Object} obj Only apply `ownProperty`.
+ */
+function HashMap(obj) {
+    var isArr = isArray(obj);
+    var thisMap = this;
+
+    (obj instanceof HashMap)
+        ? obj.each(visit)
+        : (obj && each$1(obj, visit));
+
+    function visit(value, key) {
+        isArr ? thisMap.set(value, key) : thisMap.set(key, value);
+    }
+}
+
+// Add prefix to avoid conflict with Object.prototype.
+
+HashMap.prototype = {
+    constructor: HashMap,
+    // Do not provide `has` method to avoid defining what is `has`.
+    // (We usually treat `null` and `undefined` as the same, different
+    // from ES6 Map).
+    get: function (key) {
+        return this.hasOwnProperty(key) ? this[key] : null;
+    },
+    set: function (key, value) {
+        // Comparing with invocation chaining, `return value` is more commonly
+        // used in this case: `var someVal = map.set('a', genVal());`
+        return (this[key] = value);
+    },
+    // Although util.each can be performed on this hashMap directly, user
+    // should not use the exposed keys, who are prefixed.
+    each: function (cb, context) {
+        context !== void 0 && (cb = bind(cb, context));
+        for (var key in this) {
+            this.hasOwnProperty(key) && cb(this[key], key);
+        }
+    },
+    // Do not use this method if performance sensitive.
+    removeKey: function (key) {
+        delete this[key];
+    }
+};
+
+function createHashMap(obj) {
+    return new HashMap(obj);
+}
+
+function concatArray(a, b) {
+    var newArray = new a.constructor(a.length + b.length);
+    for (var i = 0; i < a.length; i++) {
+        newArray[i] = a[i];
+    }
+    var offset = a.length;
+    for (i = 0; i < b.length; i++) {
+        newArray[i + offset] = b[i];
+    }
+    return newArray;
+}
+
+
+function noop() {}
+
+
+var zrUtil = (Object.freeze || Object)({
+	$override: $override,
+	clone: clone,
+	merge: merge,
+	mergeAll: mergeAll,
+	extend: extend,
+	defaults: defaults,
+	createCanvas: createCanvas,
+	getContext: getContext,
+	indexOf: indexOf,
+	inherits: inherits,
+	mixin: mixin,
+	isArrayLike: isArrayLike,
+	each: each$1,
+	map: map,
+	reduce: reduce,
+	filter: filter,
+	find: find,
+	bind: bind,
+	curry: curry,
+	isArray: isArray,
+	isFunction: isFunction$1,
+	isString: isString,
+	isObject: isObject$1,
+	isBuiltInObject: isBuiltInObject,
+	isTypedArray: isTypedArray,
+	isDom: isDom,
+	eqNaN: eqNaN,
+	retrieve: retrieve,
+	retrieve2: retrieve2,
+	retrieve3: retrieve3,
+	slice: slice,
+	normalizeCssArray: normalizeCssArray,
+	assert: assert$1,
+	trim: trim,
+	setAsPrimitive: setAsPrimitive,
+	isPrimitive: isPrimitive,
+	createHashMap: createHashMap,
+	concatArray: concatArray,
+	noop: noop
+});
+
+var ArrayCtor = typeof Float32Array === 'undefined'
+    ? Array
+    : Float32Array;
+
+/**
+ * 创建一个向量
+ * @param {number} [x=0]
+ * @param {number} [y=0]
+ * @return {Vector2}
+ */
+function create(x, y) {
+    var out = new ArrayCtor(2);
+    if (x == null) {
+        x = 0;
+    }
+    if (y == null) {
+        y = 0;
+    }
+    out[0] = x;
+    out[1] = y;
+    return out;
+}
+
+/**
+ * 复制向量数据
+ * @param {Vector2} out
+ * @param {Vector2} v
+ * @return {Vector2}
+ */
+function copy(out, v) {
+    out[0] = v[0];
+    out[1] = v[1];
+    return out;
+}
+
+/**
+ * 克隆一个向量
+ * @param {Vector2} v
+ * @return {Vector2}
+ */
+function clone$1(v) {
+    var out = new ArrayCtor(2);
+    out[0] = v[0];
+    out[1] = v[1];
+    return out;
+}
+
+/**
+ * 设置向量的两个项
+ * @param {Vector2} out
+ * @param {number} a
+ * @param {number} b
+ * @return {Vector2} 结果
+ */
+function set(out, a, b) {
+    out[0] = a;
+    out[1] = b;
+    return out;
+}
+
+/**
+ * 向量相加
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function add(out, v1, v2) {
+    out[0] = v1[0] + v2[0];
+    out[1] = v1[1] + v2[1];
+    return out;
+}
+
+/**
+ * 向量缩放后相加
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @param {number} a
+ */
+function scaleAndAdd(out, v1, v2, a) {
+    out[0] = v1[0] + v2[0] * a;
+    out[1] = v1[1] + v2[1] * a;
+    return out;
+}
+
+/**
+ * 向量相减
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function sub(out, v1, v2) {
+    out[0] = v1[0] - v2[0];
+    out[1] = v1[1] - v2[1];
+    return out;
+}
+
+/**
+ * 向量长度
+ * @param {Vector2} v
+ * @return {number}
+ */
+function len(v) {
+    return Math.sqrt(lenSquare(v));
+}
+var length = len; // jshint ignore:line
+
+/**
+ * 向量长度平方
+ * @param {Vector2} v
+ * @return {number}
+ */
+function lenSquare(v) {
+    return v[0] * v[0] + v[1] * v[1];
+}
+var lengthSquare = lenSquare;
+
+/**
+ * 向量乘法
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function mul(out, v1, v2) {
+    out[0] = v1[0] * v2[0];
+    out[1] = v1[1] * v2[1];
+    return out;
+}
+
+/**
+ * 向量除法
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function div(out, v1, v2) {
+    out[0] = v1[0] / v2[0];
+    out[1] = v1[1] / v2[1];
+    return out;
+}
+
+/**
+ * 向量点乘
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @return {number}
+ */
+function dot(v1, v2) {
+    return v1[0] * v2[0] + v1[1] * v2[1];
+}
+
+/**
+ * 向量缩放
+ * @param {Vector2} out
+ * @param {Vector2} v
+ * @param {number} s
+ */
+function scale(out, v, s) {
+    out[0] = v[0] * s;
+    out[1] = v[1] * s;
+    return out;
+}
+
+/**
+ * 向量归一化
+ * @param {Vector2} out
+ * @param {Vector2} v
+ */
+function normalize(out, v) {
+    var d = len(v);
+    if (d === 0) {
+        out[0] = 0;
+        out[1] = 0;
+    }
+    else {
+        out[0] = v[0] / d;
+        out[1] = v[1] / d;
+    }
+    return out;
+}
+
+/**
+ * 计算向量间距离
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @return {number}
+ */
+function distance(v1, v2) {
+    return Math.sqrt(
+        (v1[0] - v2[0]) * (v1[0] - v2[0])
+        + (v1[1] - v2[1]) * (v1[1] - v2[1])
+    );
+}
+var dist = distance;
+
+/**
+ * 向量距离平方
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @return {number}
+ */
+function distanceSquare(v1, v2) {
+    return (v1[0] - v2[0]) * (v1[0] - v2[0])
+        + (v1[1] - v2[1]) * (v1[1] - v2[1]);
+}
+var distSquare = distanceSquare;
+
+/**
+ * 求负向量
+ * @param {Vector2} out
+ * @param {Vector2} v
+ */
+function negate(out, v) {
+    out[0] = -v[0];
+    out[1] = -v[1];
+    return out;
+}
+
+/**
+ * 插值两个点
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @param {number} t
+ */
+function lerp(out, v1, v2, t) {
+    out[0] = v1[0] + t * (v2[0] - v1[0]);
+    out[1] = v1[1] + t * (v2[1] - v1[1]);
+    return out;
+}
+
+/**
+ * 矩阵左乘向量
+ * @param {Vector2} out
+ * @param {Vector2} v
+ * @param {Vector2} m
+ */
+function applyTransform(out, v, m) {
+    var x = v[0];
+    var y = v[1];
+    out[0] = m[0] * x + m[2] * y + m[4];
+    out[1] = m[1] * x + m[3] * y + m[5];
+    return out;
+}
+
+/**
+ * 求两个向量最小值
+ * @param  {Vector2} out
+ * @param  {Vector2} v1
+ * @param  {Vector2} v2
+ */
+function min(out, v1, v2) {
+    out[0] = Math.min(v1[0], v2[0]);
+    out[1] = Math.min(v1[1], v2[1]);
+    return out;
+}
+
+/**
+ * 求两个向量最大值
+ * @param  {Vector2} out
+ * @param  {Vector2} v1
+ * @param  {Vector2} v2
+ */
+function max(out, v1, v2) {
+    out[0] = Math.max(v1[0], v2[0]);
+    out[1] = Math.max(v1[1], v2[1]);
+    return out;
+}
+
+
+var vector = (Object.freeze || Object)({
+	create: create,
+	copy: copy,
+	clone: clone$1,
+	set: set,
+	add: add,
+	scaleAndAdd: scaleAndAdd,
+	sub: sub,
+	len: len,
+	length: length,
+	lenSquare: lenSquare,
+	lengthSquare: lengthSquare,
+	mul: mul,
+	div: div,
+	dot: dot,
+	scale: scale,
+	normalize: normalize,
+	distance: distance,
+	dist: dist,
+	distanceSquare: distanceSquare,
+	distSquare: distSquare,
+	negate: negate,
+	lerp: lerp,
+	applyTransform: applyTransform,
+	min: min,
+	max: max
+});
+
+// TODO Draggable for group
+// FIXME Draggable on element which has parent rotation or scale
+function Draggable() {
+
+    this.on('mousedown', this._dragStart, this);
+    this.on('mousemove', this._drag, this);
+    this.on('mouseup', this._dragEnd, this);
+    this.on('globalout', this._dragEnd, this);
+    // this._dropTarget = null;
+    // this._draggingTarget = null;
+
+    // this._x = 0;
+    // this._y = 0;
+}
+
+Draggable.prototype = {
+
+    constructor: Draggable,
+
+    _dragStart: function (e) {
+        var draggingTarget = e.target;
+        if (draggingTarget && draggingTarget.draggable) {
+            this._draggingTarget = draggingTarget;
+            draggingTarget.dragging = true;
+            this._x = e.offsetX;
+            this._y = e.offsetY;
+
+            this.dispatchToElement(param(draggingTarget, e), 'dragstart', e.event);
+        }
+    },
+
+    _drag: function (e) {
+        var draggingTarget = this._draggingTarget;
+        if (draggingTarget) {
+
+            var x = e.offsetX;
+            var y = e.offsetY;
+
+            var dx = x - this._x;
+            var dy = y - this._y;
+            this._x = x;
+            this._y = y;
+
+            draggingTarget.drift(dx, dy, e);
+            this.dispatchToElement(param(draggingTarget, e), 'drag', e.event);
+
+            var dropTarget = this.findHover(x, y, draggingTarget).target;
+            var lastDropTarget = this._dropTarget;
+            this._dropTarget = dropTarget;
+
+            if (draggingTarget !== dropTarget) {
+                if (lastDropTarget && dropTarget !== lastDropTarget) {
+                    this.dispatchToElement(param(lastDropTarget, e), 'dragleave', e.event);
+                }
+                if (dropTarget && dropTarget !== lastDropTarget) {
+                    this.dispatchToElement(param(dropTarget, e), 'dragenter', e.event);
+                }
+            }
+        }
+    },
+
+    _dragEnd: function (e) {
+        var draggingTarget = this._draggingTarget;
+
+        if (draggingTarget) {
+            draggingTarget.dragging = false;
+        }
+
+        this.dispatchToElement(param(draggingTarget, e), 'dragend', e.event);
+
+        if (this._dropTarget) {
+            this.dispatchToElement(param(this._dropTarget, e), 'drop', e.event);
+        }
+
+        this._draggingTarget = null;
+        this._dropTarget = null;
+    }
+
+};
+
+function param(target, e) {
+    return {target: target, topTarget: e && e.topTarget};
+}
+
+/**
+ * 事件扩展
+ * @module zrender/mixin/Eventful
+ * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ *         pissang (https://www.github.com/pissang)
+ */
+
+var arrySlice = Array.prototype.slice;
+
+/**
+ * 事件分发器
+ * @alias module:zrender/mixin/Eventful
+ * @constructor
+ */
+var Eventful = function () {
+    this._$handlers = {};
+};
+
+Eventful.prototype = {
+
+    constructor: Eventful,
+
+    /**
+     * 单次触发绑定，trigger后销毁
+     *
+     * @param {string} event 事件名
+     * @param {Function} handler 响应函数
+     * @param {Object} context
+     */
+    one: function (event, handler, context) {
+        var _h = this._$handlers;
+
+        if (!handler || !event) {
+            return this;
+        }
+
+        if (!_h[event]) {
+            _h[event] = [];
+        }
+
+        for (var i = 0; i < _h[event].length; i++) {
+            if (_h[event][i].h === handler) {
+                return this;
+            }
+        }
+
+        _h[event].push({
+            h: handler,
+            one: true,
+            ctx: context || this
+        });
+
+        return this;
+    },
+
+    /**
+     * 绑定事件
+     * @param {string} event 事件名
+     * @param {Function} handler 事件处理函数
+     * @param {Object} [context]
+     */
+    on: function (event, handler, context) {
+        var _h = this._$handlers;
+
+        if (!handler || !event) {
+            return this;
+        }
+
+        if (!_h[event]) {
+            _h[event] = [];
+        }
+
+        for (var i = 0; i < _h[event].length; i++) {
+            if (_h[event][i].h === handler) {
+                return this;
+            }
+        }
+
+        _h[event].push({
+            h: handler,
+            one: false,
+            ctx: context || this
+        });
+
+        return this;
+    },
+
+    /**
+     * 是否绑定了事件
+     * @param  {string}  event
+     * @return {boolean}
+     */
+    isSilent: function (event) {
+        var _h = this._$handlers;
+        return _h[event] && _h[event].length;
+    },
+
+    /**
+     * 解绑事件
+     * @param {string} event 事件名
+     * @param {Function} [handler] 事件处理函数
+     */
+    off: function (event, handler) {
+        var _h = this._$handlers;
+
+        if (!event) {
+            this._$handlers = {};
+            return this;
+        }
+
+        if (handler) {
+            if (_h[event]) {
+                var newList = [];
+                for (var i = 0, l = _h[event].length; i < l; i++) {
+                    if (_h[event][i]['h'] != handler) {
+                        newList.push(_h[event][i]);
+                    }
+                }
+                _h[event] = newList;
+            }
+
+            if (_h[event] && _h[event].length === 0) {
+                delete _h[event];
+            }
+        }
+        else {
+            delete _h[event];
+        }
+
+        return this;
+    },
+
+    /**
+     * 事件分发
+     *
+     * @param {string} type 事件类型
+     */
+    trigger: function (type) {
+        if (this._$handlers[type]) {
+            var args = arguments;
+            var argLen = args.length;
+
+            if (argLen > 3) {
+                args = arrySlice.call(args, 1);
+            }
+
+            var _h = this._$handlers[type];
+            var len = _h.length;
+            for (var i = 0; i < len;) {
+                // Optimize advise from backbone
+                switch (argLen) {
+                    case 1:
+                        _h[i]['h'].call(_h[i]['ctx']);
+                        break;
+                    case 2:
+                        _h[i]['h'].call(_h[i]['ctx'], args[1]);
+                        break;
+                    case 3:
+                        _h[i]['h'].call(_h[i]['ctx'], args[1], args[2]);
+                        break;
+                    default:
+                        // have more than 2 given arguments
+                        _h[i]['h'].apply(_h[i]['ctx'], args);
+                        break;
+                }
+
+                if (_h[i]['one']) {
+                    _h.splice(i, 1);
+                    len--;
+                }
+                else {
+                    i++;
+                }
+            }
+        }
+
+        return this;
+    },
+
+    /**
+     * 带有context的事件分发, 最后一个参数是事件回调的context
+     * @param {string} type 事件类型
+     */
+    triggerWithContext: function (type) {
+        if (this._$handlers[type]) {
+            var args = arguments;
+            var argLen = args.length;
+
+            if (argLen > 4) {
+                args = arrySlice.call(args, 1, args.length - 1);
+            }
+            var ctx = args[args.length - 1];
+
+            var _h = this._$handlers[type];
+            var len = _h.length;
+            for (var i = 0; i < len;) {
+                // Optimize advise from backbone
+                switch (argLen) {
+                    case 1:
+                        _h[i]['h'].call(ctx);
+                        break;
+                    case 2:
+                        _h[i]['h'].call(ctx, args[1]);
+                        break;
+                    case 3:
+                        _h[i]['h'].call(ctx, args[1], args[2]);
+                        break;
+                    default:
+                        // have more than 2 given arguments
+                        _h[i]['h'].apply(ctx, args);
+                        break;
+                }
+
+                if (_h[i]['one']) {
+                    _h.splice(i, 1);
+                    len--;
+                }
+                else {
+                    i++;
+                }
+            }
+        }
+
+        return this;
+    }
+};
+
+var SILENT = 'silent';
+
+function makeEventPacket(eveType, targetInfo, event) {
+    return {
+        type: eveType,
+        event: event,
+        // target can only be an element that is not silent.
+        target: targetInfo.target,
+        // topTarget can be a silent element.
+        topTarget: targetInfo.topTarget,
+        cancelBubble: false,
+        offsetX: event.zrX,
+        offsetY: event.zrY,
+        gestureEvent: event.gestureEvent,
+        pinchX: event.pinchX,
+        pinchY: event.pinchY,
+        pinchScale: event.pinchScale,
+        wheelDelta: event.zrDelta,
+        zrByTouch: event.zrByTouch,
+        which: event.which
+    };
+}
+
+function EmptyProxy () {}
+EmptyProxy.prototype.dispose = function () {};
+
+var handlerNames = [
+    'click', 'dblclick', 'mousewheel', 'mouseout',
+    'mouseup', 'mousedown', 'mousemove', 'contextmenu'
+];
+/**
+ * @alias module:zrender/Handler
+ * @constructor
+ * @extends module:zrender/mixin/Eventful
+ * @param {module:zrender/Storage} storage Storage instance.
+ * @param {module:zrender/Painter} painter Painter instance.
+ * @param {module:zrender/dom/HandlerProxy} proxy HandlerProxy instance.
+ * @param {HTMLElement} painterRoot painter.root (not painter.getViewportRoot()).
+ */
+var Handler = function(storage, painter, proxy, painterRoot) {
+    Eventful.call(this);
+
+    this.storage = storage;
+
+    this.painter = painter;
+
+    this.painterRoot = painterRoot;
+
+    proxy = proxy || new EmptyProxy();
+
+    /**
+     * Proxy of event. can be Dom, WebGLSurface, etc.
+     */
+    this.proxy = null;
+
+    /**
+     * {target, topTarget, x, y}
+     * @private
+     * @type {Object}
+     */
+    this._hovered = {};
+
+    /**
+     * @private
+     * @type {Date}
+     */
+    this._lastTouchMoment;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this._lastX;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this._lastY;
+
+
+    Draggable.call(this);
+
+    this.setHandlerProxy(proxy);
+};
+
+Handler.prototype = {
+
+    constructor: Handler,
+
+    setHandlerProxy: function (proxy) {
+        if (this.proxy) {
+            this.proxy.dispose();
+        }
+
+        if (proxy) {
+            each$1(handlerNames, function (name) {
+                proxy.on && proxy.on(name, this[name], this);
+            }, this);
+            // Attach handler
+            proxy.handler = this;
+        }
+        this.proxy = proxy;
+    },
+
+    mousemove: function (event) {
+        var x = event.zrX;
+        var y = event.zrY;
+
+        var lastHovered = this._hovered;
+        var lastHoveredTarget = lastHovered.target;
+
+        // If lastHoveredTarget is removed from zr (detected by '__zr') by some API call
+        // (like 'setOption' or 'dispatchAction') in event handlers, we should find
+        // lastHovered again here. Otherwise 'mouseout' can not be triggered normally.
+        // See #6198.
+        if (lastHoveredTarget && !lastHoveredTarget.__zr) {
+            lastHovered = this.findHover(lastHovered.x, lastHovered.y);
+            lastHoveredTarget = lastHovered.target;
+        }
+
+        var hovered = this._hovered = this.findHover(x, y);
+        var hoveredTarget = hovered.target;
+
+        var proxy = this.proxy;
+        proxy.setCursor && proxy.setCursor(hoveredTarget ? hoveredTarget.cursor : 'default');
+
+        // Mouse out on previous hovered element
+        if (lastHoveredTarget && hoveredTarget !== lastHoveredTarget) {
+            this.dispatchToElement(lastHovered, 'mouseout', event);
+        }
+
+        // Mouse moving on one element
+        this.dispatchToElement(hovered, 'mousemove', event);
+
+        // Mouse over on a new element
+        if (hoveredTarget && hoveredTarget !== lastHoveredTarget) {
+            this.dispatchToElement(hovered, 'mouseover', event);
+        }
+    },
+
+    mouseout: function (event) {
+        this.dispatchToElement(this._hovered, 'mouseout', event);
+
+        // There might be some doms created by upper layer application
+        // at the same level of painter.getViewportRoot() (e.g., tooltip
+        // dom created by echarts), where 'globalout' event should not
+        // be triggered when mouse enters these doms. (But 'mouseout'
+        // should be triggered at the original hovered element as usual).
+        var element = event.toElement || event.relatedTarget;
+        var innerDom;
+        do {
+            element = element && element.parentNode;
+        }
+        while (element && element.nodeType != 9 && !(
+            innerDom = element === this.painterRoot
+        ));
+
+        !innerDom && this.trigger('globalout', {event: event});
+    },
+
+    /**
+     * Resize
+     */
+    resize: function (event) {
+        this._hovered = {};
+    },
+
+    /**
+     * Dispatch event
+     * @param {string} eventName
+     * @param {event=} eventArgs
+     */
+    dispatch: function (eventName, eventArgs) {
+        var handler = this[eventName];
+        handler && handler.call(this, eventArgs);
+    },
+
+    /**
+     * Dispose
+     */
+    dispose: function () {
+
+        this.proxy.dispose();
+
+        this.storage =
+        this.proxy =
+        this.painter = null;
+    },
+
+    /**
+     * 设置默认的cursor style
+     * @param {string} [cursorStyle='default'] 例如 crosshair
+     */
+    setCursorStyle: function (cursorStyle) {
+        var proxy = this.proxy;
+        proxy.setCursor && proxy.setCursor(cursorStyle);
+    },
+
+    /**
+     * 事件分发代理
+     *
+     * @private
+     * @param {Object} targetInfo {target, topTarget} 目标图形元素
+     * @param {string} eventName 事件名称
+     * @param {Object} event 事件对象
+     */
+    dispatchToElement: function (targetInfo, eventName, event) {
+        targetInfo = targetInfo || {};
+        var el = targetInfo.target;
+        if (el && el.silent) {
+            return;
+        }
+        var eventHandler = 'on' + eventName;
+        var eventPacket = makeEventPacket(eventName, targetInfo, event);
+
+        while (el) {
+            el[eventHandler]
+                && (eventPacket.cancelBubble = el[eventHandler].call(el, eventPacket));
+
+            el.trigger(eventName, eventPacket);
+
+            el = el.parent;
+
+            if (eventPacket.cancelBubble) {
+                break;
+            }
+        }
+
+        if (!eventPacket.cancelBubble) {
+            // 冒泡到顶级 zrender 对象
+            this.trigger(eventName, eventPacket);
+            // 分发事件到用户自定义层
+            // 用户有可能在全局 click 事件中 dispose，所以需要判断下 painter 是否存在
+            this.painter && this.painter.eachOtherLayer(function (layer) {
+                if (typeof(layer[eventHandler]) == 'function') {
+                    layer[eventHandler].call(layer, eventPacket);
+                }
+                if (layer.trigger) {
+                    layer.trigger(eventName, eventPacket);
+                }
+            });
+        }
+    },
+
+    /**
+     * @private
+     * @param {number} x
+     * @param {number} y
+     * @param {module:zrender/graphic/Displayable} exclude
+     * @return {model:zrender/Element}
+     * @method
+     */
+    findHover: function(x, y, exclude) {
+        var list = this.storage.getDisplayList();
+        var out = {x: x, y: y};
+
+        for (var i = list.length - 1; i >= 0 ; i--) {
+            var hoverCheckResult;
+            if (list[i] !== exclude
+                // getDisplayList may include ignored item in VML mode
+                && !list[i].ignore
+                && (hoverCheckResult = isHover(list[i], x, y))
+            ) {
+                !out.topTarget && (out.topTarget = list[i]);
+                if (hoverCheckResult !== SILENT) {
+                    out.target = list[i];
+                    break;
+                }
+            }
+        }
+
+        return out;
+    }
+};
+
+// Common handlers
+each$1(['click', 'mousedown', 'mouseup', 'mousewheel', 'dblclick', 'contextmenu'], function (name) {
+    Handler.prototype[name] = function (event) {
+        // Find hover again to avoid click event is dispatched manually. Or click is triggered without mouseover
+        var hovered = this.findHover(event.zrX, event.zrY);
+        var hoveredTarget = hovered.target;
+
+        if (name === 'mousedown') {
+            this._downEl = hoveredTarget;
+            this._downPoint = [event.zrX, event.zrY];
+            // In case click triggered before mouseup
+            this._upEl = hoveredTarget;
+        }
+        else if (name === 'mouseup') {
+            this._upEl = hoveredTarget;
+        }
+        else if (name === 'click') {
+            if (this._downEl !== this._upEl
+                // Original click event is triggered on the whole canvas element,
+                // including the case that `mousedown` - `mousemove` - `mouseup`,
+                // which should be filtered, otherwise it will bring trouble to
+                // pan and zoom.
+                || !this._downPoint
+                // Arbitrary value
+                || dist(this._downPoint, [event.zrX, event.zrY]) > 4
+            ) {
+                return;
+            }
+            this._downPoint = null;
+        }
+
+        this.dispatchToElement(hovered, name, event);
+    };
+});
+
+function isHover(displayable, x, y) {
+    if (displayable[displayable.rectHover ? 'rectContain' : 'contain'](x, y)) {
+        var el = displayable;
+        var isSilent;
+        while (el) {
+            // If clipped by ancestor.
+            // FIXME: If clipPath has neither stroke nor fill,
+            // el.clipPath.contain(x, y) will always return false.
+            if (el.clipPath && !el.clipPath.contain(x, y))  {
+                return false;
+            }
+            if (el.silent) {
+                isSilent = true;
+            }
+            el = el.parent;
+        }
+        return isSilent ? SILENT : true;
+    }
+
+    return false;
+}
+
+mixin(Handler, Eventful);
+mixin(Handler, Draggable);
+
+/**
+ * 3x2矩阵操作类
+ * @exports zrender/tool/matrix
+ */
+
+var ArrayCtor$1 = typeof Float32Array === 'undefined'
+    ? Array
+   : Float32Array;
+
+/**
+ * Create a identity matrix.
+ * @return {Float32Array|Array.<number>}
+ */
+function create$1() {
+    var out = new ArrayCtor$1(6);
+    identity(out);
+
+    return out;
+}
+
+/**
+ * 设置矩阵为单位矩阵
+ * @param {Float32Array|Array.<number>} out
+ */
+function identity(out) {
+    out[0] = 1;
+    out[1] = 0;
+    out[2] = 0;
+    out[3] = 1;
+    out[4] = 0;
+    out[5] = 0;
+    return out;
+}
+
+/**
+ * 复制矩阵
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} m
+ */
+function copy$1(out, m) {
+    out[0] = m[0];
+    out[1] = m[1];
+    out[2] = m[2];
+    out[3] = m[3];
+    out[4] = m[4];
+    out[5] = m[5];
+    return out;
+}
+
+/**
+ * 矩阵相乘
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} m1
+ * @param {Float32Array|Array.<number>} m2
+ */
+function mul$1(out, m1, m2) {
+    // Consider matrix.mul(m, m2, m);
+    // where out is the same as m2.
+    // So use temp variable to escape error.
+    var out0 = m1[0] * m2[0] + m1[2] * m2[1];
+    var out1 = m1[1] * m2[0] + m1[3] * m2[1];
+    var out2 = m1[0] * m2[2] + m1[2] * m2[3];
+    var out3 = m1[1] * m2[2] + m1[3] * m2[3];
+    var out4 = m1[0] * m2[4] + m1[2] * m2[5] + m1[4];
+    var out5 = m1[1] * m2[4] + m1[3] * m2[5] + m1[5];
+    out[0] = out0;
+    out[1] = out1;
+    out[2] = out2;
+    out[3] = out3;
+    out[4] = out4;
+    out[5] = out5;
+    return out;
+}
+
+/**
+ * 平移变换
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ * @param {Float32Array|Array.<number>} v
+ */
+function translate(out, a, v) {
+    out[0] = a[0];
+    out[1] = a[1];
+    out[2] = a[2];
+    out[3] = a[3];
+    out[4] = a[4] + v[0];
+    out[5] = a[5] + v[1];
+    return out;
+}
+
+/**
+ * 旋转变换
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ * @param {number} rad
+ */
+function rotate(out, a, rad) {
+    var aa = a[0];
+    var ac = a[2];
+    var atx = a[4];
+    var ab = a[1];
+    var ad = a[3];
+    var aty = a[5];
+    var st = Math.sin(rad);
+    var ct = Math.cos(rad);
+
+    out[0] = aa * ct + ab * st;
+    out[1] = -aa * st + ab * ct;
+    out[2] = ac * ct + ad * st;
+    out[3] = -ac * st + ct * ad;
+    out[4] = ct * atx + st * aty;
+    out[5] = ct * aty - st * atx;
+    return out;
+}
+
+/**
+ * 缩放变换
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ * @param {Float32Array|Array.<number>} v
+ */
+function scale$1(out, a, v) {
+    var vx = v[0];
+    var vy = v[1];
+    out[0] = a[0] * vx;
+    out[1] = a[1] * vy;
+    out[2] = a[2] * vx;
+    out[3] = a[3] * vy;
+    out[4] = a[4] * vx;
+    out[5] = a[5] * vy;
+    return out;
+}
+
+/**
+ * 求逆矩阵
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ */
+function invert(out, a) {
+
+    var aa = a[0];
+    var ac = a[2];
+    var atx = a[4];
+    var ab = a[1];
+    var ad = a[3];
+    var aty = a[5];
+
+    var det = aa * ad - ab * ac;
+    if (!det) {
+        return null;
+    }
+    det = 1.0 / det;
+
+    out[0] = ad * det;
+    out[1] = -ab * det;
+    out[2] = -ac * det;
+    out[3] = aa * det;
+    out[4] = (ac * aty - ad * atx) * det;
+    out[5] = (ab * atx - aa * aty) * det;
+    return out;
+}
+
+/**
+ * Clone a new matrix.
+ * @param {Float32Array|Array.<number>} a
+ */
+function clone$2(a) {
+    var b = create$1();
+    copy$1(b, a);
+    return b;
+}
+
+var matrix = (Object.freeze || Object)({
+	create: create$1,
+	identity: identity,
+	copy: copy$1,
+	mul: mul$1,
+	translate: translate,
+	rotate: rotate,
+	scale: scale$1,
+	invert: invert,
+	clone: clone$2
+});
+
+/**
+ * 提供变换扩展
+ * @module zrender/mixin/Transformable
+ * @author pissang (https://www.github.com/pissang)
+ */
+
+var mIdentity = identity;
+
+var EPSILON = 5e-5;
+
+function isNotAroundZero(val) {
+    return val > EPSILON || val < -EPSILON;
+}
+
+/**
+ * @alias module:zrender/mixin/Transformable
+ * @constructor
+ */
+var Transformable = function (opts) {
+    opts = opts || {};
+    // If there are no given position, rotation, scale
+    if (!opts.position) {
+        /**
+         * 平移
+         * @type {Array.<number>}
+         * @default [0, 0]
+         */
+        this.position = [0, 0];
+    }
+    if (opts.rotation == null) {
+        /**
+         * 旋转
+         * @type {Array.<number>}
+         * @default 0
+         */
+        this.rotation = 0;
+    }
+    if (!opts.scale) {
+        /**
+         * 缩放
+         * @type {Array.<number>}
+         * @default [1, 1]
+         */
+        this.scale = [1, 1];
+    }
+    /**
+     * 旋转和缩放的原点
+     * @type {Array.<number>}
+     * @default null
+     */
+    this.origin = this.origin || null;
+};
+
+var transformableProto = Transformable.prototype;
+transformableProto.transform = null;
+
+/**
+ * 判断是否需要有坐标变换
+ * 如果有坐标变换, 则从position, rotation, scale以及父节点的transform计算出自身的transform矩阵
+ */
+transformableProto.needLocalTransform = function () {
+    return isNotAroundZero(this.rotation)
+        || isNotAroundZero(this.position[0])
+        || isNotAroundZero(this.position[1])
+        || isNotAroundZero(this.scale[0] - 1)
+        || isNotAroundZero(this.scale[1] - 1);
+};
+
+transformableProto.updateTransform = function () {
+    var parent = this.parent;
+    var parentHasTransform = parent && parent.transform;
+    var needLocalTransform = this.needLocalTransform();
+
+    var m = this.transform;
+    if (!(needLocalTransform || parentHasTransform)) {
+        m && mIdentity(m);
+        return;
+    }
+
+    m = m || create$1();
+
+    if (needLocalTransform) {
+        this.getLocalTransform(m);
+    }
+    else {
+        mIdentity(m);
+    }
+
+    // 应用父节点变换
+    if (parentHasTransform) {
+        if (needLocalTransform) {
+            mul$1(m, parent.transform, m);
+        }
+        else {
+            copy$1(m, parent.transform);
+        }
+    }
+    // 保存这个变换矩阵
+    this.transform = m;
+
+    this.invTransform = this.invTransform || create$1();
+    invert(this.invTransform, m);
+};
+
+transformableProto.getLocalTransform = function (m) {
+    return Transformable.getLocalTransform(this, m);
+};
+
+/**
+ * 将自己的transform应用到context上
+ * @param {CanvasRenderingContext2D} ctx
+ */
+transformableProto.setTransform = function (ctx) {
+    var m = this.transform;
+    var dpr = ctx.dpr || 1;
+    if (m) {
+        ctx.setTransform(dpr * m[0], dpr * m[1], dpr * m[2], dpr * m[3], dpr * m[4], dpr * m[5]);
+    }
+    else {
+        ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
+    }
+};
+
+transformableProto.restoreTransform = function (ctx) {
+    var dpr = ctx.dpr || 1;
+    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
+};
+
+var tmpTransform = [];
+
+/**
+ * 分解`transform`矩阵到`position`, `rotation`, `scale`
+ */
+transformableProto.decomposeTransform = function () {
+    if (!this.transform) {
+        return;
+    }
+    var parent = this.parent;
+    var m = this.transform;
+    if (parent && parent.transform) {
+        // Get local transform and decompose them to position, scale, rotation
+        mul$1(tmpTransform, parent.invTransform, m);
+        m = tmpTransform;
+    }
+    var sx = m[0] * m[0] + m[1] * m[1];
+    var sy = m[2] * m[2] + m[3] * m[3];
+    var position = this.position;
+    var scale$$1 = this.scale;
+    if (isNotAroundZero(sx - 1)) {
+        sx = Math.sqrt(sx);
+    }
+    if (isNotAroundZero(sy - 1)) {
+        sy = Math.sqrt(sy);
+    }
+    if (m[0] < 0) {
+        sx = -sx;
+    }
+    if (m[3] < 0) {
+        sy = -sy;
+    }
+    position[0] = m[4];
+    position[1] = m[5];
+    scale$$1[0] = sx;
+    scale$$1[1] = sy;
+    this.rotation = Math.atan2(-m[1] / sy, m[0] / sx);
+};
+
+/**
+ * Get global scale
+ * @return {Array.<number>}
+ */
+transformableProto.getGlobalScale = function () {
+    var m = this.transform;
+    if (!m) {
+        return [1, 1];
+    }
+    var sx = Math.sqrt(m[0] * m[0] + m[1] * m[1]);
+    var sy = Math.sqrt(m[2] * m[2] + m[3] * m[3]);
+    if (m[0] < 0) {
+        sx = -sx;
+    }
+    if (m[3] < 0) {
+        sy = -sy;
+    }
+    return [sx, sy];
+};
+/**
+ * 变换坐标位置到 shape 的局部坐标空间
+ * @method
+ * @param {number} x
+ * @param {number} y
+ * @return {Array.<number>}
+ */
+transformableProto.transformCoordToLocal = function (x, y) {
+    var v2 = [x, y];
+    var invTransform = this.invTransform;
+    if (invTransform) {
+        applyTransform(v2, v2, invTransform);
+    }
+    return v2;
+};
+
+/**
+ * 变换局部坐标位置到全局坐标空间
+ * @method
+ * @param {number} x
+ * @param {number} y
+ * @return {Array.<number>}
+ */
+transformableProto.transformCoordToGlobal = function (x, y) {
+    var v2 = [x, y];
+    var transform = this.transform;
+    if (transform) {
+        applyTransform(v2, v2, transform);
+    }
+    return v2;
+};
+
+/**
+ * @static
+ * @param {Object} target
+ * @param {Array.<number>} target.origin
+ * @param {number} target.rotation
+ * @param {Array.<number>} target.position
+ * @param {Array.<number>} [m]
+ */
+Transformable.getLocalTransform = function (target, m) {
+    m = m || [];
+    mIdentity(m);
+
+    var origin = target.origin;
+    var scale$$1 = target.scale || [1, 1];
+    var rotation = target.rotation || 0;
+    var position = target.position || [0, 0];
+
+    if (origin) {
+        // Translate to origin
+        m[4] -= origin[0];
+        m[5] -= origin[1];
+    }
+    scale$1(m, m, scale$$1);
+    if (rotation) {
+        rotate(m, m, rotation);
+    }
+    if (origin) {
+        // Translate back from origin
+        m[4] += origin[0];
+        m[5] += origin[1];
+    }
+
+    m[4] += position[0];
+    m[5] += position[1];
+
+    return m;
+};
+
+/**
+ * 缓动代码来自 https://github.com/sole/tween.js/blob/master/src/Tween.js
+ * @see http://sole.github.io/tween.js/examples/03_graphs.html
+ * @exports zrender/animation/easing
+ */
+var easing = {
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    linear: function (k) {
+        return k;
+    },
+
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quadraticIn: function (k) {
+        return k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quadraticOut: function (k) {
+        return k * (2 - k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quadraticInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k;
+        }
+        return -0.5 * (--k * (k - 2) - 1);
+    },
+
+    // 三次方的缓动（t^3）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    cubicIn: function (k) {
+        return k * k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    cubicOut: function (k) {
+        return --k * k * k + 1;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    cubicInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k * k;
+        }
+        return 0.5 * ((k -= 2) * k * k + 2);
+    },
+
+    // 四次方的缓动（t^4）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quarticIn: function (k) {
+        return k * k * k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quarticOut: function (k) {
+        return 1 - (--k * k * k * k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quarticInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k * k * k;
+        }
+        return -0.5 * ((k -= 2) * k * k * k - 2);
+    },
+
+    // 五次方的缓动（t^5）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quinticIn: function (k) {
+        return k * k * k * k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quinticOut: function (k) {
+        return --k * k * k * k * k + 1;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quinticInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k * k * k * k;
+        }
+        return 0.5 * ((k -= 2) * k * k * k * k + 2);
+    },
+
+    // 正弦曲线的缓动（sin(t)）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    sinusoidalIn: function (k) {
+        return 1 - Math.cos(k * Math.PI / 2);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    sinusoidalOut: function (k) {
+        return Math.sin(k * Math.PI / 2);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    sinusoidalInOut: function (k) {
+        return 0.5 * (1 - Math.cos(Math.PI * k));
+    },
+
+    // 指数曲线的缓动（2^t）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    exponentialIn: function (k) {
+        return k === 0 ? 0 : Math.pow(1024, k - 1);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    exponentialOut: function (k) {
+        return k === 1 ? 1 : 1 - Math.pow(2, -10 * k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    exponentialInOut: function (k) {
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if ((k *= 2) < 1) {
+            return 0.5 * Math.pow(1024, k - 1);
+        }
+        return 0.5 * (-Math.pow(2, -10 * (k - 1)) + 2);
+    },
+
+    // 圆形曲线的缓动（sqrt(1-t^2)）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    circularIn: function (k) {
+        return 1 - Math.sqrt(1 - k * k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    circularOut: function (k) {
+        return Math.sqrt(1 - (--k * k));
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    circularInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return -0.5 * (Math.sqrt(1 - k * k) - 1);
+        }
+        return 0.5 * (Math.sqrt(1 - (k -= 2) * k) + 1);
+    },
+
+    // 创建类似于弹簧在停止前来回振荡的动画
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    elasticIn: function (k) {
+        var s;
+        var a = 0.1;
+        var p = 0.4;
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if (!a || a < 1) {
+            a = 1; s = p / 4;
+        }
+        else {
+            s = p * Math.asin(1 / a) / (2 * Math.PI);
+        }
+        return -(a * Math.pow(2, 10 * (k -= 1)) *
+                    Math.sin((k - s) * (2 * Math.PI) / p));
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    elasticOut: function (k) {
+        var s;
+        var a = 0.1;
+        var p = 0.4;
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if (!a || a < 1) {
+            a = 1; s = p / 4;
+        }
+        else {
+            s = p * Math.asin(1 / a) / (2 * Math.PI);
+        }
+        return (a * Math.pow(2, -10 * k) *
+                Math.sin((k - s) * (2 * Math.PI) / p) + 1);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    elasticInOut: function (k) {
+        var s;
+        var a = 0.1;
+        var p = 0.4;
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if (!a || a < 1) {
+            a = 1; s = p / 4;
+        }
+        else {
+            s = p * Math.asin(1 / a) / (2 * Math.PI);
+        }
+        if ((k *= 2) < 1) {
+            return -0.5 * (a * Math.pow(2, 10 * (k -= 1))
+                * Math.sin((k - s) * (2 * Math.PI) / p));
+        }
+        return a * Math.pow(2, -10 * (k -= 1))
+                * Math.sin((k - s) * (2 * Math.PI) / p) * 0.5 + 1;
+
+    },
+
+    // 在某一动画开始沿指示的路径进行动画处理前稍稍收回该动画的移动
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    backIn: function (k) {
+        var s = 1.70158;
+        return k * k * ((s + 1) * k - s);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    backOut: function (k) {
+        var s = 1.70158;
+        return --k * k * ((s + 1) * k + s) + 1;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    backInOut: function (k) {
+        var s = 1.70158 * 1.525;
+        if ((k *= 2) < 1) {
+            return 0.5 * (k * k * ((s + 1) * k - s));
+        }
+        return 0.5 * ((k -= 2) * k * ((s + 1) * k + s) + 2);
+    },
+
+    // 创建弹跳效果
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    bounceIn: function (k) {
+        return 1 - easing.bounceOut(1 - k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    bounceOut: function (k) {
+        if (k < (1 / 2.75)) {
+            return 7.5625 * k * k;
+        }
+        else if (k < (2 / 2.75)) {
+            return 7.5625 * (k -= (1.5 / 2.75)) * k + 0.75;
+        }
+        else if (k < (2.5 / 2.75)) {
+            return 7.5625 * (k -= (2.25 / 2.75)) * k + 0.9375;
+        }
+        else {
+            return 7.5625 * (k -= (2.625 / 2.75)) * k + 0.984375;
+        }
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    bounceInOut: function (k) {
+        if (k < 0.5) {
+            return easing.bounceIn(k * 2) * 0.5;
+        }
+        return easing.bounceOut(k * 2 - 1) * 0.5 + 0.5;
+    }
+};
+
+/**
+ * 动画主控制器
+ * @config target 动画对象，可以是数组，如果是数组的话会批量分发onframe等事件
+ * @config life(1000) 动画时长
+ * @config delay(0) 动画延迟时间
+ * @config loop(true)
+ * @config gap(0) 循环的间隔时间
+ * @config onframe
+ * @config easing(optional)
+ * @config ondestroy(optional)
+ * @config onrestart(optional)
+ *
+ * TODO pause
+ */
+
+function Clip(options) {
+
+    this._target = options.target;
+
+    // 生命周期
+    this._life = options.life || 1000;
+    // 延时
+    this._delay = options.delay || 0;
+    // 开始时间
+    // this._startTime = new Date().getTime() + this._delay;// 单位毫秒
+    this._initialized = false;
+
+    // 是否循环
+    this.loop = options.loop == null ? false : options.loop;
+
+    this.gap = options.gap || 0;
+
+    this.easing = options.easing || 'Linear';
+
+    this.onframe = options.onframe;
+    this.ondestroy = options.ondestroy;
+    this.onrestart = options.onrestart;
+
+    this._pausedTime = 0;
+    this._paused = false;
+}
+
+Clip.prototype = {
+
+    constructor: Clip,
+
+    step: function (globalTime, deltaTime) {
+        // Set startTime on first step, or _startTime may has milleseconds different between clips
+        // PENDING
+        if (!this._initialized) {
+            this._startTime = globalTime + this._delay;
+            this._initialized = true;
+        }
+
+        if (this._paused) {
+            this._pausedTime += deltaTime;
+            return;
+        }
+
+        var percent = (globalTime - this._startTime - this._pausedTime) / this._life;
+
+        // 还没开始
+        if (percent < 0) {
+            return;
+        }
+
+        percent = Math.min(percent, 1);
+
+        var easing$$1 = this.easing;
+        var easingFunc = typeof easing$$1 == 'string' ? easing[easing$$1] : easing$$1;
+        var schedule = typeof easingFunc === 'function'
+            ? easingFunc(percent)
+            : percent;
+
+        this.fire('frame', schedule);
+
+        // 结束
+        if (percent == 1) {
+            if (this.loop) {
+                this.restart (globalTime);
+                // 重新开始周期
+                // 抛出而不是直接调用事件直到 stage.update 后再统一调用这些事件
+                return 'restart';
+            }
+
+            // 动画完成将这个控制器标识为待删除
+            // 在Animation.update中进行批量删除
+            this._needsRemove = true;
+            return 'destroy';
+        }
+
+        return null;
+    },
+
+    restart: function (globalTime) {
+        var remainder = (globalTime - this._startTime - this._pausedTime) % this._life;
+        this._startTime = globalTime - remainder + this.gap;
+        this._pausedTime = 0;
+
+        this._needsRemove = false;
+    },
+
+    fire: function (eventType, arg) {
+        eventType = 'on' + eventType;
+        if (this[eventType]) {
+            this[eventType](this._target, arg);
+        }
+    },
+
+    pause: function () {
+        this._paused = true;
+    },
+
+    resume: function () {
+        this._paused = false;
+    }
+};
+
+// Simple LRU cache use doubly linked list
+// @module zrender/core/LRU
+
+/**
+ * Simple double linked list. Compared with array, it has O(1) remove operation.
+ * @constructor
+ */
+var LinkedList = function () {
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.head = null;
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.tail = null;
+
+    this._len = 0;
+};
+
+var linkedListProto = LinkedList.prototype;
+/**
+ * Insert a new value at the tail
+ * @param  {} val
+ * @return {module:zrender/core/LRU~Entry}
+ */
+linkedListProto.insert = function (val) {
+    var entry = new Entry(val);
+    this.insertEntry(entry);
+    return entry;
+};
+
+/**
+ * Insert an entry at the tail
+ * @param  {module:zrender/core/LRU~Entry} entry
+ */
+linkedListProto.insertEntry = function (entry) {
+    if (!this.head) {
+        this.head = this.tail = entry;
+    }
+    else {
+        this.tail.next = entry;
+        entry.prev = this.tail;
+        entry.next = null;
+        this.tail = entry;
+    }
+    this._len++;
+};
+
+/**
+ * Remove entry.
+ * @param  {module:zrender/core/LRU~Entry} entry
+ */
+linkedListProto.remove = function (entry) {
+    var prev = entry.prev;
+    var next = entry.next;
+    if (prev) {
+        prev.next = next;
+    }
+    else {
+        // Is head
+        this.head = next;
+    }
+    if (next) {
+        next.prev = prev;
+    }
+    else {
+        // Is tail
+        this.tail = prev;
+    }
+    entry.next = entry.prev = null;
+    this._len--;
+};
+
+/**
+ * @return {number}
+ */
+linkedListProto.len = function () {
+    return this._len;
+};
+
+/**
+ * Clear list
+ */
+linkedListProto.clear = function () {
+    this.head = this.tail = null;
+    this._len = 0;
+};
+
+/**
+ * @constructor
+ * @param {} val
+ */
+var Entry = function (val) {
+    /**
+     * @type {}
+     */
+    this.value = val;
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.next;
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.prev;
+};
+
+/**
+ * LRU Cache
+ * @constructor
+ * @alias module:zrender/core/LRU
+ */
+var LRU = function (maxSize) {
+
+    this._list = new LinkedList();
+
+    this._map = {};
+
+    this._maxSize = maxSize || 10;
+
+    this._lastRemovedEntry = null;
+};
+
+var LRUProto = LRU.prototype;
+
+/**
+ * @param  {string} key
+ * @param  {} value
+ * @return {} Removed value
+ */
+LRUProto.put = function (key, value) {
+    var list = this._list;
+    var map = this._map;
+    var removed = null;
+    if (map[key] == null) {
+        var len = list.len();
+        // Reuse last removed entry
+        var entry = this._lastRemovedEntry;
+
+        if (len >= this._maxSize && len > 0) {
+            // Remove the least recently used
+            var leastUsedEntry = list.head;
+            list.remove(leastUsedEntry);
+            delete map[leastUsedEntry.key];
+
+            removed = leastUsedEntry.value;
+            this._lastRemovedEntry = leastUsedEntry;
+        }
+
+        if (entry) {
+            entry.value = value;
+        }
+        else {
+            entry = new Entry(value);
+        }
+        entry.key = key;
+        list.insertEntry(entry);
+        map[key] = entry;
+    }
+
+    return removed;
+};
+
+/**
+ * @param  {string} key
+ * @return {}
+ */
+LRUProto.get = function (key) {
+    var entry = this._map[key];
+    var list = this._list;
+    if (entry != null) {
+        // Put the latest used entry in the tail
+        if (entry !== list.tail) {
+            list.remove(entry);
+            list.insertEntry(entry);
+        }
+
+        return entry.value;
+    }
+};
+
+/**
+ * Clear the cache
+ */
+LRUProto.clear = function () {
+    this._list.clear();
+    this._map = {};
+};
+
+var kCSSColorTable = {
+    'transparent': [0,0,0,0], 'aliceblue': [240,248,255,1],
+    'antiquewhite': [250,235,215,1], 'aqua': [0,255,255,1],
+    'aquamarine': [127,255,212,1], 'azure': [240,255,255,1],
+    'beige': [245,245,220,1], 'bisque': [255,228,196,1],
+    'black': [0,0,0,1], 'blanchedalmond': [255,235,205,1],
+    'blue': [0,0,255,1], 'blueviolet': [138,43,226,1],
+    'brown': [165,42,42,1], 'burlywood': [222,184,135,1],
+    'cadetblue': [95,158,160,1], 'chartreuse': [127,255,0,1],
+    'chocolate': [210,105,30,1], 'coral': [255,127,80,1],
+    'cornflowerblue': [100,149,237,1], 'cornsilk': [255,248,220,1],
+    'crimson': [220,20,60,1], 'cyan': [0,255,255,1],
+    'darkblue': [0,0,139,1], 'darkcyan': [0,139,139,1],
+    'darkgoldenrod': [184,134,11,1], 'darkgray': [169,169,169,1],
+    'darkgreen': [0,100,0,1], 'darkgrey': [169,169,169,1],
+    'darkkhaki': [189,183,107,1], 'darkmagenta': [139,0,139,1],
+    'darkolivegreen': [85,107,47,1], 'darkorange': [255,140,0,1],
+    'darkorchid': [153,50,204,1], 'darkred': [139,0,0,1],
+    'darksalmon': [233,150,122,1], 'darkseagreen': [143,188,143,1],
+    'darkslateblue': [72,61,139,1], 'darkslategray': [47,79,79,1],
+    'darkslategrey': [47,79,79,1], 'darkturquoise': [0,206,209,1],
+    'darkviolet': [148,0,211,1], 'deeppink': [255,20,147,1],
+    'deepskyblue': [0,191,255,1], 'dimgray': [105,105,105,1],
+    'dimgrey': [105,105,105,1], 'dodgerblue': [30,144,255,1],
+    'firebrick': [178,34,34,1], 'floralwhite': [255,250,240,1],
+    'forestgreen': [34,139,34,1], 'fuchsia': [255,0,255,1],
+    'gainsboro': [220,220,220,1], 'ghostwhite': [248,248,255,1],
+    'gold': [255,215,0,1], 'goldenrod': [218,165,32,1],
+    'gray': [128,128,128,1], 'green': [0,128,0,1],
+    'greenyellow': [173,255,47,1], 'grey': [128,128,128,1],
+    'honeydew': [240,255,240,1], 'hotpink': [255,105,180,1],
+    'indianred': [205,92,92,1], 'indigo': [75,0,130,1],
+    'ivory': [255,255,240,1], 'khaki': [240,230,140,1],
+    'lavender': [230,230,250,1], 'lavenderblush': [255,240,245,1],
+    'lawngreen': [124,252,0,1], 'lemonchiffon': [255,250,205,1],
+    'lightblue': [173,216,230,1], 'lightcoral': [240,128,128,1],
+    'lightcyan': [224,255,255,1], 'lightgoldenrodyellow': [250,250,210,1],
+    'lightgray': [211,211,211,1], 'lightgreen': [144,238,144,1],
+    'lightgrey': [211,211,211,1], 'lightpink': [255,182,193,1],
+    'lightsalmon': [255,160,122,1], 'lightseagreen': [32,178,170,1],
+    'lightskyblue': [135,206,250,1], 'lightslategray': [119,136,153,1],
+    'lightslategrey': [119,136,153,1], 'lightsteelblue': [176,196,222,1],
+    'lightyellow': [255,255,224,1], 'lime': [0,255,0,1],
+    'limegreen': [50,205,50,1], 'linen': [250,240,230,1],
+    'magenta': [255,0,255,1], 'maroon': [128,0,0,1],
+    'mediumaquamarine': [102,205,170,1], 'mediumblue': [0,0,205,1],
+    'mediumorchid': [186,85,211,1], 'mediumpurple': [147,112,219,1],
+    'mediumseagreen': [60,179,113,1], 'mediumslateblue': [123,104,238,1],
+    'mediumspringgreen': [0,250,154,1], 'mediumturquoise': [72,209,204,1],
+    'mediumvioletred': [199,21,133,1], 'midnightblue': [25,25,112,1],
+    'mintcream': [245,255,250,1], 'mistyrose': [255,228,225,1],
+    'moccasin': [255,228,181,1], 'navajowhite': [255,222,173,1],
+    'navy': [0,0,128,1], 'oldlace': [253,245,230,1],
+    'olive': [128,128,0,1], 'olivedrab': [107,142,35,1],
+    'orange': [255,165,0,1], 'orangered': [255,69,0,1],
+    'orchid': [218,112,214,1], 'palegoldenrod': [238,232,170,1],
+    'palegreen': [152,251,152,1], 'paleturquoise': [175,238,238,1],
+    'palevioletred': [219,112,147,1], 'papayawhip': [255,239,213,1],
+    'peachpuff': [255,218,185,1], 'peru': [205,133,63,1],
+    'pink': [255,192,203,1], 'plum': [221,160,221,1],
+    'powderblue': [176,224,230,1], 'purple': [128,0,128,1],
+    'red': [255,0,0,1], 'rosybrown': [188,143,143,1],
+    'royalblue': [65,105,225,1], 'saddlebrown': [139,69,19,1],
+    'salmon': [250,128,114,1], 'sandybrown': [244,164,96,1],
+    'seagreen': [46,139,87,1], 'seashell': [255,245,238,1],
+    'sienna': [160,82,45,1], 'silver': [192,192,192,1],
+    'skyblue': [135,206,235,1], 'slateblue': [106,90,205,1],
+    'slategray': [112,128,144,1], 'slategrey': [112,128,144,1],
+    'snow': [255,250,250,1], 'springgreen': [0,255,127,1],
+    'steelblue': [70,130,180,1], 'tan': [210,180,140,1],
+    'teal': [0,128,128,1], 'thistle': [216,191,216,1],
+    'tomato': [255,99,71,1], 'turquoise': [64,224,208,1],
+    'violet': [238,130,238,1], 'wheat': [245,222,179,1],
+    'white': [255,255,255,1], 'whitesmoke': [245,245,245,1],
+    'yellow': [255,255,0,1], 'yellowgreen': [154,205,50,1]
+};
+
+function clampCssByte(i) {  // Clamp to integer 0 .. 255.
+    i = Math.round(i);  // Seems to be what Chrome does (vs truncation).
+    return i < 0 ? 0 : i > 255 ? 255 : i;
+}
+
+function clampCssAngle(i) {  // Clamp to integer 0 .. 360.
+    i = Math.round(i);  // Seems to be what Chrome does (vs truncation).
+    return i < 0 ? 0 : i > 360 ? 360 : i;
+}
+
+function clampCssFloat(f) {  // Clamp to float 0.0 .. 1.0.
+    return f < 0 ? 0 : f > 1 ? 1 : f;
+}
+
+function parseCssInt(str) {  // int or percentage.
+    if (str.length && str.charAt(str.length - 1) === '%') {
+        return clampCssByte(parseFloat(str) / 100 * 255);
+    }
+    return clampCssByte(parseInt(str, 10));
+}
+
+function parseCssFloat(str) {  // float or percentage.
+    if (str.length && str.charAt(str.length - 1) === '%') {
+        return clampCssFloat(parseFloat(str) / 100);
+    }
+    return clampCssFloat(parseFloat(str));
+}
+
+function cssHueToRgb(m1, m2, h) {
+    if (h < 0) {
+        h += 1;
+    }
+    else if (h > 1) {
+        h -= 1;
+    }
+
+    if (h * 6 < 1) {
+        return m1 + (m2 - m1) * h * 6;
+    }
+    if (h * 2 < 1) {
+        return m2;
+    }
+    if (h * 3 < 2) {
+        return m1 + (m2 - m1) * (2/3 - h) * 6;
+    }
+    return m1;
+}
+
+function lerpNumber(a, b, p) {
+    return a + (b - a) * p;
+}
+
+function setRgba(out, r, g, b, a) {
+    out[0] = r; out[1] = g; out[2] = b; out[3] = a;
+    return out;
+}
+function copyRgba(out, a) {
+    out[0] = a[0]; out[1] = a[1]; out[2] = a[2]; out[3] = a[3];
+    return out;
+}
+
+var colorCache = new LRU(20);
+var lastRemovedArr = null;
+
+function putToCache(colorStr, rgbaArr) {
+    // Reuse removed array
+    if (lastRemovedArr) {
+        copyRgba(lastRemovedArr, rgbaArr);
+    }
+    lastRemovedArr = colorCache.put(colorStr, lastRemovedArr || (rgbaArr.slice()));
+}
+
+/**
+ * @param {string} colorStr
+ * @param {Array.<number>} out
+ * @return {Array.<number>}
+ * @memberOf module:zrender/util/color
+ */
+function parse(colorStr, rgbaArr) {
+    if (!colorStr) {
+        return;
+    }
+    rgbaArr = rgbaArr || [];
+
+    var cached = colorCache.get(colorStr);
+    if (cached) {
+        return copyRgba(rgbaArr, cached);
+    }
+
+    // colorStr may be not string
+    colorStr = colorStr + '';
+    // Remove all whitespace, not compliant, but should just be more accepting.
+    var str = colorStr.replace(/ /g, '').toLowerCase();
+
+    // Color keywords (and transparent) lookup.
+    if (str in kCSSColorTable) {
+        copyRgba(rgbaArr, kCSSColorTable[str]);
+        putToCache(colorStr, rgbaArr);
+        return rgbaArr;
+    }
+
+    // #abc and #abc123 syntax.
+    if (str.charAt(0) === '#') {
+        if (str.length === 4) {
+            var iv = parseInt(str.substr(1), 16);  // TODO(deanm): Stricter parsing.
+            if (!(iv >= 0 && iv <= 0xfff)) {
+                setRgba(rgbaArr, 0, 0, 0, 1);
+                return;  // Covers NaN.
+            }
+            setRgba(rgbaArr,
+                ((iv & 0xf00) >> 4) | ((iv & 0xf00) >> 8),
+                (iv & 0xf0) | ((iv & 0xf0) >> 4),
+                (iv & 0xf) | ((iv & 0xf) << 4),
+                1
+            );
+            putToCache(colorStr, rgbaArr);
+            return rgbaArr;
+        }
+        else if (str.length === 7) {
+            var iv = parseInt(str.substr(1), 16);  // TODO(deanm): Stricter parsing.
+            if (!(iv >= 0 && iv <= 0xffffff)) {
+                setRgba(rgbaArr, 0, 0, 0, 1);
+                return;  // Covers NaN.
+            }
+            setRgba(rgbaArr,
+                (iv & 0xff0000) >> 16,
+                (iv & 0xff00) >> 8,
+                iv & 0xff,
+                1
+            );
+            putToCache(colorStr, rgbaArr);
+            return rgbaArr;
+        }
+
+        return;
+    }
+    var op = str.indexOf('('), ep = str.indexOf(')');
+    if (op !== -1 && ep + 1 === str.length) {
+        var fname = str.substr(0, op);
+        var params = str.substr(op + 1, ep - (op + 1)).split(',');
+        var alpha = 1;  // To allow case fallthrough.
+        switch (fname) {
+            case 'rgba':
+                if (params.length !== 4) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                alpha = parseCssFloat(params.pop()); // jshint ignore:line
+            // Fall through.
+            case 'rgb':
+                if (params.length !== 3) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                setRgba(rgbaArr,
+                    parseCssInt(params[0]),
+                    parseCssInt(params[1]),
+                    parseCssInt(params[2]),
+                    alpha
+                );
+                putToCache(colorStr, rgbaArr);
+                return rgbaArr;
+            case 'hsla':
+                if (params.length !== 4) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                params[3] = parseCssFloat(params[3]);
+                hsla2rgba(params, rgbaArr);
+                putToCache(colorStr, rgbaArr);
+                return rgbaArr;
+            case 'hsl':
+                if (params.length !== 3) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                hsla2rgba(params, rgbaArr);
+                putToCache(colorStr, rgbaArr);
+                return rgbaArr;
+            default:
+                return;
+        }
+    }
+
+    setRgba(rgbaArr, 0, 0, 0, 1);
+    return;
+}
+
+/**
+ * @param {Array.<number>} hsla
+ * @param {Array.<number>} rgba
+ * @return {Array.<number>} rgba
+ */
+function hsla2rgba(hsla, rgba) {
+    var h = (((parseFloat(hsla[0]) % 360) + 360) % 360) / 360;  // 0 .. 1
+    // NOTE(deanm): According to the CSS spec s/l should only be
+    // percentages, but we don't bother and let float or percentage.
+    var s = parseCssFloat(hsla[1]);
+    var l = parseCssFloat(hsla[2]);
+    var m2 = l <= 0.5 ? l * (s + 1) : l + s - l * s;
+    var m1 = l * 2 - m2;
+
+    rgba = rgba || [];
+    setRgba(rgba,
+        clampCssByte(cssHueToRgb(m1, m2, h + 1 / 3) * 255),
+        clampCssByte(cssHueToRgb(m1, m2, h) * 255),
+        clampCssByte(cssHueToRgb(m1, m2, h - 1 / 3) * 255),
+        1
+    );
+
+    if (hsla.length === 4) {
+        rgba[3] = hsla[3];
+    }
+
+    return rgba;
+}
+
+/**
+ * @param {Array.<number>} rgba
+ * @return {Array.<number>} hsla
+ */
+function rgba2hsla(rgba) {
+    if (!rgba) {
+        return;
+    }
+
+    // RGB from 0 to 255
+    var R = rgba[0] / 255;
+    var G = rgba[1] / 255;
+    var B = rgba[2] / 255;
+
+    var vMin = Math.min(R, G, B); // Min. value of RGB
+    var vMax = Math.max(R, G, B); // Max. value of RGB
+    var delta = vMax - vMin; // Delta RGB value
+
+    var L = (vMax + vMin) / 2;
+    var H;
+    var S;
+    // HSL results from 0 to 1
+    if (delta === 0) {
+        H = 0;
+        S = 0;
+    }
+    else {
+        if (L < 0.5) {
+            S = delta / (vMax + vMin);
+        }
+        else {
+            S = delta / (2 - vMax - vMin);
+        }
+
+        var deltaR = (((vMax - R) / 6) + (delta / 2)) / delta;
+        var deltaG = (((vMax - G) / 6) + (delta / 2)) / delta;
+        var deltaB = (((vMax - B) / 6) + (delta / 2)) / delta;
+
+        if (R === vMax) {
+            H = deltaB - deltaG;
+        }
+        else if (G === vMax) {
+            H = (1 / 3) + deltaR - deltaB;
+        }
+        else if (B === vMax) {
+            H = (2 / 3) + deltaG - deltaR;
+        }
+
+        if (H < 0) {
+            H += 1;
+        }
+
+        if (H > 1) {
+            H -= 1;
+        }
+    }
+
+    var hsla = [H * 360, S, L];
+
+    if (rgba[3] != null) {
+        hsla.push(rgba[3]);
+    }
+
+    return hsla;
+}
+
+/**
+ * @param {string} color
+ * @param {number} level
+ * @return {string}
+ * @memberOf module:zrender/util/color
+ */
+function lift(color, level) {
+    var colorArr = parse(color);
+    if (colorArr) {
+        for (var i = 0; i < 3; i++) {
+            if (level < 0) {
+                colorArr[i] = colorArr[i] * (1 - level) | 0;
+            }
+            else {
+                colorArr[i] = ((255 - colorArr[i]) * level + colorArr[i]) | 0;
+            }
+            if (colorArr[i] > 255) {
+                colorArr[i] = 255;
+            }
+            else if (color[i] < 0) {
+                colorArr[i] = 0;
+            }
+        }
+        return stringify(colorArr, colorArr.length === 4 ? 'rgba' : 'rgb');
+    }
+}
+
+/**
+ * @param {string} color
+ * @return {string}
+ * @memberOf module:zrender/util/color
+ */
+function toHex(color) {
+    var colorArr = parse(color);
+    if (colorArr) {
+        return ((1 << 24) + (colorArr[0] << 16) + (colorArr[1] << 8) + (+colorArr[2])).toString(16).slice(1);
+    }
+}
+
+/**
+ * Map value to color. Faster than lerp methods because color is represented by rgba array.
+ * @param {number} normalizedValue A float between 0 and 1.
+ * @param {Array.<Array.<number>>} colors List of rgba color array
+ * @param {Array.<number>} [out] Mapped gba color array
+ * @return {Array.<number>} will be null/undefined if input illegal.
+ */
+function fastLerp(normalizedValue, colors, out) {
+    if (!(colors && colors.length)
+        || !(normalizedValue >= 0 && normalizedValue <= 1)
+    ) {
+        return;
+    }
+
+    out = out || [];
+
+    var value = normalizedValue * (colors.length - 1);
+    var leftIndex = Math.floor(value);
+    var rightIndex = Math.ceil(value);
+    var leftColor = colors[leftIndex];
+    var rightColor = colors[rightIndex];
+    var dv = value - leftIndex;
+    out[0] = clampCssByte(lerpNumber(leftColor[0], rightColor[0], dv));
+    out[1] = clampCssByte(lerpNumber(leftColor[1], rightColor[1], dv));
+    out[2] = clampCssByte(lerpNumber(leftColor[2], rightColor[2], dv));
+    out[3] = clampCssFloat(lerpNumber(leftColor[3], rightColor[3], dv));
+
+    return out;
+}
+
+/**
+ * @deprecated
+ */
+var fastMapToColor = fastLerp;
+
+/**
+ * @param {number} normalizedValue A float between 0 and 1.
+ * @param {Array.<string>} colors Color list.
+ * @param {boolean=} fullOutput Default false.
+ * @return {(string|Object)} Result color. If fullOutput,
+ *                           return {color: ..., leftIndex: ..., rightIndex: ..., value: ...},
+ * @memberOf module:zrender/util/color
+ */
+function lerp$1(normalizedValue, colors, fullOutput) {
+    if (!(colors && colors.length)
+        || !(normalizedValue >= 0 && normalizedValue <= 1)
+    ) {
+        return;
+    }
+
+    var value = normalizedValue * (colors.length - 1);
+    var leftIndex = Math.floor(value);
+    var rightIndex = Math.ceil(value);
+    var leftColor = parse(colors[leftIndex]);
+    var rightColor = parse(colors[rightIndex]);
+    var dv = value - leftIndex;
+
+    var color = stringify(
+        [
+            clampCssByte(lerpNumber(leftColor[0], rightColor[0], dv)),
+            clampCssByte(lerpNumber(leftColor[1], rightColor[1], dv)),
+            clampCssByte(lerpNumber(leftColor[2], rightColor[2], dv)),
+            clampCssFloat(lerpNumber(leftColor[3], rightColor[3], dv))
+        ],
+        'rgba'
+    );
+
+    return fullOutput
+        ? {
+            color: color,
+            leftIndex: leftIndex,
+            rightIndex: rightIndex,
+            value: value
+        }
+        : color;
+}
+
+/**
+ * @deprecated
+ */
+var mapToColor = lerp$1;
+
+/**
+ * @param {string} color
+ * @param {number=} h 0 ~ 360, ignore when null.
+ * @param {number=} s 0 ~ 1, ignore when null.
+ * @param {number=} l 0 ~ 1, ignore when null.
+ * @return {string} Color string in rgba format.
+ * @memberOf module:zrender/util/color
+ */
+function modifyHSL(color, h, s, l) {
+    color = parse(color);
+
+    if (color) {
+        color = rgba2hsla(color);
+        h != null && (color[0] = clampCssAngle(h));
+        s != null && (color[1] = parseCssFloat(s));
+        l != null && (color[2] = parseCssFloat(l));
+
+        return stringify(hsla2rgba(color), 'rgba');
+    }
+}
+
+/**
+ * @param {string} color
+ * @param {number=} alpha 0 ~ 1
+ * @return {string} Color string in rgba format.
+ * @memberOf module:zrender/util/color
+ */
+function modifyAlpha(color, alpha) {
+    color = parse(color);
+
+    if (color && alpha != null) {
+        color[3] = clampCssFloat(alpha);
+        return stringify(color, 'rgba');
+    }
+}
+
+/**
+ * @param {Array.<number>} arrColor like [12,33,44,0.4]
+ * @param {string} type 'rgba', 'hsva', ...
+ * @return {string} Result color. (If input illegal, return undefined).
+ */
+function stringify(arrColor, type) {
+    if (!arrColor || !arrColor.length) {
+        return;
+    }
+    var colorStr = arrColor[0] + ',' + arrColor[1] + ',' + arrColor[2];
+    if (type === 'rgba' || type === 'hsva' || type === 'hsla') {
+        colorStr += ',' + arrColor[3];
+    }
+    return type + '(' + colorStr + ')';
+}
+
+
+var color = (Object.freeze || Object)({
+	parse: parse,
+	lift: lift,
+	toHex: toHex,
+	fastLerp: fastLerp,
+	fastMapToColor: fastMapToColor,
+	lerp: lerp$1,
+	mapToColor: mapToColor,
+	modifyHSL: modifyHSL,
+	modifyAlpha: modifyAlpha,
+	stringify: stringify
+});
+
+/**
+ * @module echarts/animation/Animator
+ */
+
+var arraySlice = Array.prototype.slice;
+
+function defaultGetter(target, key) {
+    return target[key];
+}
+
+function defaultSetter(target, key, value) {
+    target[key] = value;
+}
+
+/**
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} percent
+ * @return {number}
+ */
+function interpolateNumber(p0, p1, percent) {
+    return (p1 - p0) * percent + p0;
+}
+
+/**
+ * @param  {string} p0
+ * @param  {string} p1
+ * @param  {number} percent
+ * @return {string}
+ */
+function interpolateString(p0, p1, percent) {
+    return percent > 0.5 ? p1 : p0;
+}
+
+/**
+ * @param  {Array} p0
+ * @param  {Array} p1
+ * @param  {number} percent
+ * @param  {Array} out
+ * @param  {number} arrDim
+ */
+function interpolateArray(p0, p1, percent, out, arrDim) {
+    var len = p0.length;
+    if (arrDim == 1) {
+        for (var i = 0; i < len; i++) {
+            out[i] = interpolateNumber(p0[i], p1[i], percent);
+        }
+    }
+    else {
+        var len2 = len && p0[0].length;
+        for (var i = 0; i < len; i++) {
+            for (var j = 0; j < len2; j++) {
+                out[i][j] = interpolateNumber(
+                    p0[i][j], p1[i][j], percent
+                );
+            }
+        }
+    }
+}
+
+// arr0 is source array, arr1 is target array.
+// Do some preprocess to avoid error happened when interpolating from arr0 to arr1
+function fillArr(arr0, arr1, arrDim) {
+    var arr0Len = arr0.length;
+    var arr1Len = arr1.length;
+    if (arr0Len !== arr1Len) {
+        // FIXME Not work for TypedArray
+        var isPreviousLarger = arr0Len > arr1Len;
+        if (isPreviousLarger) {
+            // Cut the previous
+            arr0.length = arr1Len;
+        }
+        else {
+            // Fill the previous
+            for (var i = arr0Len; i < arr1Len; i++) {
+                arr0.push(
+                    arrDim === 1 ? arr1[i] : arraySlice.call(arr1[i])
+                );
+            }
+        }
+    }
+    // Handling NaN value
+    var len2 = arr0[0] && arr0[0].length;
+    for (var i = 0; i < arr0.length; i++) {
+        if (arrDim === 1) {
+            if (isNaN(arr0[i])) {
+                arr0[i] = arr1[i];
+            }
+        }
+        else {
+            for (var j = 0; j < len2; j++) {
+                if (isNaN(arr0[i][j])) {
+                    arr0[i][j] = arr1[i][j];
+                }
+            }
+        }
+    }
+}
+
+/**
+ * @param  {Array} arr0
+ * @param  {Array} arr1
+ * @param  {number} arrDim
+ * @return {boolean}
+ */
+function isArraySame(arr0, arr1, arrDim) {
+    if (arr0 === arr1) {
+        return true;
+    }
+    var len = arr0.length;
+    if (len !== arr1.length) {
+        return false;
+    }
+    if (arrDim === 1) {
+        for (var i = 0; i < len; i++) {
+            if (arr0[i] !== arr1[i]) {
+                return false;
+            }
+        }
+    }
+    else {
+        var len2 = arr0[0].length;
+        for (var i = 0; i < len; i++) {
+            for (var j = 0; j < len2; j++) {
+                if (arr0[i][j] !== arr1[i][j]) {
+                    return false;
+                }
+            }
+        }
+    }
+    return true;
+}
+
+/**
+ * Catmull Rom interpolate array
+ * @param  {Array} p0
+ * @param  {Array} p1
+ * @param  {Array} p2
+ * @param  {Array} p3
+ * @param  {number} t
+ * @param  {number} t2
+ * @param  {number} t3
+ * @param  {Array} out
+ * @param  {number} arrDim
+ */
+function catmullRomInterpolateArray(
+    p0, p1, p2, p3, t, t2, t3, out, arrDim
+) {
+    var len = p0.length;
+    if (arrDim == 1) {
+        for (var i = 0; i < len; i++) {
+            out[i] = catmullRomInterpolate(
+                p0[i], p1[i], p2[i], p3[i], t, t2, t3
+            );
+        }
+    }
+    else {
+        var len2 = p0[0].length;
+        for (var i = 0; i < len; i++) {
+            for (var j = 0; j < len2; j++) {
+                out[i][j] = catmullRomInterpolate(
+                    p0[i][j], p1[i][j], p2[i][j], p3[i][j],
+                    t, t2, t3
+                );
+            }
+        }
+    }
+}
+
+/**
+ * Catmull Rom interpolate number
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @param  {number} t2
+ * @param  {number} t3
+ * @return {number}
+ */
+function catmullRomInterpolate(p0, p1, p2, p3, t, t2, t3) {
+    var v0 = (p2 - p0) * 0.5;
+    var v1 = (p3 - p1) * 0.5;
+    return (2 * (p1 - p2) + v0 + v1) * t3
+            + (-3 * (p1 - p2) - 2 * v0 - v1) * t2
+            + v0 * t + p1;
+}
+
+function cloneValue(value) {
+    if (isArrayLike(value)) {
+        var len = value.length;
+        if (isArrayLike(value[0])) {
+            var ret = [];
+            for (var i = 0; i < len; i++) {
+                ret.push(arraySlice.call(value[i]));
+            }
+            return ret;
+        }
+
+        return arraySlice.call(value);
+    }
+
+    return value;
+}
+
+function rgba2String(rgba) {
+    rgba[0] = Math.floor(rgba[0]);
+    rgba[1] = Math.floor(rgba[1]);
+    rgba[2] = Math.floor(rgba[2]);
+
+    return 'rgba(' + rgba.join(',') + ')';
+}
+
+function getArrayDim(keyframes) {
+    var lastValue = keyframes[keyframes.length - 1].value;
+    return isArrayLike(lastValue && lastValue[0]) ? 2 : 1;
+}
+
+function createTrackClip(animator, easing, oneTrackDone, keyframes, propName, forceAnimate) {
+    var getter = animator._getter;
+    var setter = animator._setter;
+    var useSpline = easing === 'spline';
+
+    var trackLen = keyframes.length;
+    if (!trackLen) {
+        return;
+    }
+    // Guess data type
+    var firstVal = keyframes[0].value;
+    var isValueArray = isArrayLike(firstVal);
+    var isValueColor = false;
+    var isValueString = false;
+
+    // For vertices morphing
+    var arrDim = isValueArray ? getArrayDim(keyframes) : 0;
+
+    var trackMaxTime;
+    // Sort keyframe as ascending
+    keyframes.sort(function(a, b) {
+        return a.time - b.time;
+    });
+
+    trackMaxTime = keyframes[trackLen - 1].time;
+    // Percents of each keyframe
+    var kfPercents = [];
+    // Value of each keyframe
+    var kfValues = [];
+    var prevValue = keyframes[0].value;
+    var isAllValueEqual = true;
+    for (var i = 0; i < trackLen; i++) {
+        kfPercents.push(keyframes[i].time / trackMaxTime);
+        // Assume value is a color when it is a string
+        var value = keyframes[i].value;
+
+        // Check if value is equal, deep check if value is array
+        if (!((isValueArray && isArraySame(value, prevValue, arrDim))
+            || (!isValueArray && value === prevValue))) {
+            isAllValueEqual = false;
+        }
+        prevValue = value;
+
+        // Try converting a string to a color array
+        if (typeof value == 'string') {
+            var colorArray = parse(value);
+            if (colorArray) {
+                value = colorArray;
+                isValueColor = true;
+            }
+            else {
+                isValueString = true;
+            }
+        }
+        kfValues.push(value);
+    }
+    if (!forceAnimate && isAllValueEqual) {
+        return;
+    }
+
+    var lastValue = kfValues[trackLen - 1];
+    // Polyfill array and NaN value
+    for (var i = 0; i < trackLen - 1; i++) {
+        if (isValueArray) {
+            fillArr(kfValues[i], lastValue, arrDim);
+        }
+        else {
+            if (isNaN(kfValues[i]) && !isNaN(lastValue) && !isValueString && !isValueColor) {
+                kfValues[i] = lastValue;
+            }
+        }
+    }
+    isValueArray && fillArr(getter(animator._target, propName), lastValue, arrDim);
+
+    // Cache the key of last frame to speed up when
+    // animation playback is sequency
+    var lastFrame = 0;
+    var lastFramePercent = 0;
+    var start;
+    var w;
+    var p0;
+    var p1;
+    var p2;
+    var p3;
+
+    if (isValueColor) {
+        var rgba = [0, 0, 0, 0];
+    }
+
+    var onframe = function (target, percent) {
+        // Find the range keyframes
+        // kf1-----kf2---------current--------kf3
+        // find kf2 and kf3 and do interpolation
+        var frame;
+        // In the easing function like elasticOut, percent may less than 0
+        if (percent < 0) {
+            frame = 0;
+        }
+        else if (percent < lastFramePercent) {
+            // Start from next key
+            // PENDING start from lastFrame ?
+            start = Math.min(lastFrame + 1, trackLen - 1);
+            for (frame = start; frame >= 0; frame--) {
+                if (kfPercents[frame] <= percent) {
+                    break;
+                }
+            }
+            // PENDING really need to do this ?
+            frame = Math.min(frame, trackLen - 2);
+        }
+        else {
+            for (frame = lastFrame; frame < trackLen; frame++) {
+                if (kfPercents[frame] > percent) {
+                    break;
+                }
+            }
+            frame = Math.min(frame - 1, trackLen - 2);
+        }
+        lastFrame = frame;
+        lastFramePercent = percent;
+
+        var range = (kfPercents[frame + 1] - kfPercents[frame]);
+        if (range === 0) {
+            return;
+        }
+        else {
+            w = (percent - kfPercents[frame]) / range;
+        }
+        if (useSpline) {
+            p1 = kfValues[frame];
+            p0 = kfValues[frame === 0 ? frame : frame - 1];
+            p2 = kfValues[frame > trackLen - 2 ? trackLen - 1 : frame + 1];
+            p3 = kfValues[frame > trackLen - 3 ? trackLen - 1 : frame + 2];
+            if (isValueArray) {
+                catmullRomInterpolateArray(
+                    p0, p1, p2, p3, w, w * w, w * w * w,
+                    getter(target, propName),
+                    arrDim
+                );
+            }
+            else {
+                var value;
+                if (isValueColor) {
+                    value = catmullRomInterpolateArray(
+                        p0, p1, p2, p3, w, w * w, w * w * w,
+                        rgba, 1
+                    );
+                    value = rgba2String(rgba);
+                }
+                else if (isValueString) {
+                    // String is step(0.5)
+                    return interpolateString(p1, p2, w);
+                }
+                else {
+                    value = catmullRomInterpolate(
+                        p0, p1, p2, p3, w, w * w, w * w * w
+                    );
+                }
+                setter(
+                    target,
+                    propName,
+                    value
+                );
+            }
+        }
+        else {
+            if (isValueArray) {
+                interpolateArray(
+                    kfValues[frame], kfValues[frame + 1], w,
+                    getter(target, propName),
+                    arrDim
+                );
+            }
+            else {
+                var value;
+                if (isValueColor) {
+                    interpolateArray(
+                        kfValues[frame], kfValues[frame + 1], w,
+                        rgba, 1
+                    );
+                    value = rgba2String(rgba);
+                }
+                else if (isValueString) {
+                    // String is step(0.5)
+                    return interpolateString(kfValues[frame], kfValues[frame + 1], w);
+                }
+                else {
+                    value = interpolateNumber(kfValues[frame], kfValues[frame + 1], w);
+                }
+                setter(
+                    target,
+                    propName,
+                    value
+                );
+            }
+        }
+    };
+
+    var clip = new Clip({
+        target: animator._target,
+        life: trackMaxTime,
+        loop: animator._loop,
+        delay: animator._delay,
+        onframe: onframe,
+        ondestroy: oneTrackDone
+    });
+
+    if (easing && easing !== 'spline') {
+        clip.easing = easing;
+    }
+
+    return clip;
+}
+
+/**
+ * @alias module:zrender/animation/Animator
+ * @constructor
+ * @param {Object} target
+ * @param {boolean} loop
+ * @param {Function} getter
+ * @param {Function} setter
+ */
+var Animator = function(target, loop, getter, setter) {
+    this._tracks = {};
+    this._target = target;
+
+    this._loop = loop || false;
+
+    this._getter = getter || defaultGetter;
+    this._setter = setter || defaultSetter;
+
+    this._clipCount = 0;
+
+    this._delay = 0;
+
+    this._doneList = [];
+
+    this._onframeList = [];
+
+    this._clipList = [];
+};
+
+Animator.prototype = {
+    /**
+     * 设置动画关键帧
+     * @param  {number} time 关键帧时间，单位是ms
+     * @param  {Object} props 关键帧的属性值，key-value表示
+     * @return {module:zrender/animation/Animator}
+     */
+    when: function(time /* ms */, props) {
+        var tracks = this._tracks;
+        for (var propName in props) {
+            if (!props.hasOwnProperty(propName)) {
+                continue;
+            }
+
+            if (!tracks[propName]) {
+                tracks[propName] = [];
+                // Invalid value
+                var value = this._getter(this._target, propName);
+                if (value == null) {
+                    // zrLog('Invalid property ' + propName);
+                    continue;
+                }
+                // If time is 0
+                //  Then props is given initialize value
+                // Else
+                //  Initialize value from current prop value
+                if (time !== 0) {
+                    tracks[propName].push({
+                        time: 0,
+                        value: cloneValue(value)
+                    });
+                }
+            }
+            tracks[propName].push({
+                time: time,
+                value: props[propName]
+            });
+        }
+        return this;
+    },
+    /**
+     * 添加动画每一帧的回调函数
+     * @param  {Function} callback
+     * @return {module:zrender/animation/Animator}
+     */
+    during: function (callback) {
+        this._onframeList.push(callback);
+        return this;
+    },
+
+    pause: function () {
+        for (var i = 0; i < this._clipList.length; i++) {
+            this._clipList[i].pause();
+        }
+        this._paused = true;
+    },
+
+    resume: function () {
+        for (var i = 0; i < this._clipList.length; i++) {
+            this._clipList[i].resume();
+        }
+        this._paused = false;
+    },
+
+    isPaused: function () {
+        return !!this._paused;
+    },
+
+    _doneCallback: function () {
+        // Clear all tracks
+        this._tracks = {};
+        // Clear all clips
+        this._clipList.length = 0;
+
+        var doneList = this._doneList;
+        var len = doneList.length;
+        for (var i = 0; i < len; i++) {
+            doneList[i].call(this);
+        }
+    },
+    /**
+     * 开始执行动画
+     * @param  {string|Function} [easing]
+     *         动画缓动函数，详见{@link module:zrender/animation/easing}
+     * @param  {boolean} forceAnimate
+     * @return {module:zrender/animation/Animator}
+     */
+    start: function (easing, forceAnimate) {
+
+        var self = this;
+        var clipCount = 0;
+
+        var oneTrackDone = function() {
+            clipCount--;
+            if (!clipCount) {
+                self._doneCallback();
+            }
+        };
+
+        var lastClip;
+        for (var propName in this._tracks) {
+            if (!this._tracks.hasOwnProperty(propName)) {
+                continue;
+            }
+            var clip = createTrackClip(
+                this, easing, oneTrackDone,
+                this._tracks[propName], propName, forceAnimate
+            );
+            if (clip) {
+                this._clipList.push(clip);
+                clipCount++;
+
+                // If start after added to animation
+                if (this.animation) {
+                    this.animation.addClip(clip);
+                }
+
+                lastClip = clip;
+            }
+        }
+
+        // Add during callback on the last clip
+        if (lastClip) {
+            var oldOnFrame = lastClip.onframe;
+            lastClip.onframe = function (target, percent) {
+                oldOnFrame(target, percent);
+
+                for (var i = 0; i < self._onframeList.length; i++) {
+                    self._onframeList[i](target, percent);
+                }
+            };
+        }
+
+        // This optimization will help the case that in the upper application
+        // the view may be refreshed frequently, where animation will be
+        // called repeatly but nothing changed.
+        if (!clipCount) {
+            this._doneCallback();
+        }
+        return this;
+    },
+    /**
+     * 停止动画
+     * @param {boolean} forwardToLast If move to last frame before stop
+     */
+    stop: function (forwardToLast) {
+        var clipList = this._clipList;
+        var animation = this.animation;
+        for (var i = 0; i < clipList.length; i++) {
+            var clip = clipList[i];
+            if (forwardToLast) {
+                // Move to last frame before stop
+                clip.onframe(this._target, 1);
+            }
+            animation && animation.removeClip(clip);
+        }
+        clipList.length = 0;
+    },
+    /**
+     * 设置动画延迟开始的时间
+     * @param  {number} time 单位ms
+     * @return {module:zrender/animation/Animator}
+     */
+    delay: function (time) {
+        this._delay = time;
+        return this;
+    },
+    /**
+     * 添加动画结束的回调
+     * @param  {Function} cb
+     * @return {module:zrender/animation/Animator}
+     */
+    done: function(cb) {
+        if (cb) {
+            this._doneList.push(cb);
+        }
+        return this;
+    },
+
+    /**
+     * @return {Array.<module:zrender/animation/Clip>}
+     */
+    getClips: function () {
+        return this._clipList;
+    }
+};
+
+var dpr = 1;
+
+// If in browser environment
+if (typeof window !== 'undefined') {
+    dpr = Math.max(window.devicePixelRatio || 1, 1);
+}
+
+/**
+ * config默认配置项
+ * @exports zrender/config
+ * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ */
+
+/**
+ * debug日志选项：catchBrushException为true下有效
+ * 0 : 不生成debug数据，发布用
+ * 1 : 异常抛出，调试用
+ * 2 : 控制台输出，调试用
+ */
+var debugMode = 0;
+
+// retina 屏幕优化
+var devicePixelRatio = dpr;
+
+var log = function () {
+};
+
+if (debugMode === 1) {
+    log = function () {
+        for (var k in arguments) {
+            throw new Error(arguments[k]);
+        }
+    };
+}
+else if (debugMode > 1) {
+    log = function () {
+        for (var k in arguments) {
+            console.log(arguments[k]);
+        }
+    };
+}
+
+var zrLog = log;
+
+/**
+ * @alias modue:zrender/mixin/Animatable
+ * @constructor
+ */
+var Animatable = function () {
+
+    /**
+     * @type {Array.<module:zrender/animation/Animator>}
+     * @readOnly
+     */
+    this.animators = [];
+};
+
+Animatable.prototype = {
+
+    constructor: Animatable,
+
+    /**
+     * 动画
+     *
+     * @param {string} path The path to fetch value from object, like 'a.b.c'.
+     * @param {boolean} [loop] Whether to loop animation.
+     * @return {module:zrender/animation/Animator}
+     * @example:
+     *     el.animate('style', false)
+     *         .when(1000, {x: 10} )
+     *         .done(function(){ // Animation done })
+     *         .start()
+     */
+    animate: function (path, loop) {
+        var target;
+        var animatingShape = false;
+        var el = this;
+        var zr = this.__zr;
+        if (path) {
+            var pathSplitted = path.split('.');
+            var prop = el;
+            // If animating shape
+            animatingShape = pathSplitted[0] === 'shape';
+            for (var i = 0, l = pathSplitted.length; i < l; i++) {
+                if (!prop) {
+                    continue;
+                }
+                prop = prop[pathSplitted[i]];
+            }
+            if (prop) {
+                target = prop;
+            }
+        }
+        else {
+            target = el;
+        }
+
+        if (!target) {
+            zrLog(
+                'Property "'
+                + path
+                + '" is not existed in element '
+                + el.id
+            );
+            return;
+        }
+
+        var animators = el.animators;
+
+        var animator = new Animator(target, loop);
+
+        animator.during(function (target) {
+            el.dirty(animatingShape);
+        })
+        .done(function () {
+            // FIXME Animator will not be removed if use `Animator#stop` to stop animation
+            animators.splice(indexOf(animators, animator), 1);
+        });
+
+        animators.push(animator);
+
+        // If animate after added to the zrender
+        if (zr) {
+            zr.animation.addAnimator(animator);
+        }
+
+        return animator;
+    },
+
+    /**
+     * 停止动画
+     * @param {boolean} forwardToLast If move to last frame before stop
+     */
+    stopAnimation: function (forwardToLast) {
+        var animators = this.animators;
+        var len = animators.length;
+        for (var i = 0; i < len; i++) {
+            animators[i].stop(forwardToLast);
+        }
+        animators.length = 0;
+
+        return this;
+    },
+
+    /**
+     * Caution: this method will stop previous animation.
+     * So do not use this method to one element twice before
+     * animation starts, unless you know what you are doing.
+     * @param {Object} target
+     * @param {number} [time=500] Time in ms
+     * @param {string} [easing='linear']
+     * @param {number} [delay=0]
+     * @param {Function} [callback]
+     * @param {Function} [forceAnimate] Prevent stop animation and callback
+     *        immediently when target values are the same as current values.
+     *
+     * @example
+     *  // Animate position
+     *  el.animateTo({
+     *      position: [10, 10]
+     *  }, function () { // done })
+     *
+     *  // Animate shape, style and position in 100ms, delayed 100ms, with cubicOut easing
+     *  el.animateTo({
+     *      shape: {
+     *          width: 500
+     *      },
+     *      style: {
+     *          fill: 'red'
+     *      }
+     *      position: [10, 10]
+     *  }, 100, 100, 'cubicOut', function () { // done })
+     */
+        // TODO Return animation key
+    animateTo: function (target, time, delay, easing, callback, forceAnimate) {
+        // animateTo(target, time, easing, callback);
+        if (isString(delay)) {
+            callback = easing;
+            easing = delay;
+            delay = 0;
+        }
+        // animateTo(target, time, delay, callback);
+        else if (isFunction$1(easing)) {
+            callback = easing;
+            easing = 'linear';
+            delay = 0;
+        }
+        // animateTo(target, time, callback);
+        else if (isFunction$1(delay)) {
+            callback = delay;
+            delay = 0;
+        }
+        // animateTo(target, callback)
+        else if (isFunction$1(time)) {
+            callback = time;
+            time = 500;
+        }
+        // animateTo(target)
+        else if (!time) {
+            time = 500;
+        }
+        // Stop all previous animations
+        this.stopAnimation();
+        this._animateToShallow('', this, target, time, delay);
+
+        // Animators may be removed immediately after start
+        // if there is nothing to animate
+        var animators = this.animators.slice();
+        var count = animators.length;
+        function done() {
+            count--;
+            if (!count) {
+                callback && callback();
+            }
+        }
+
+        // No animators. This should be checked before animators[i].start(),
+        // because 'done' may be executed immediately if no need to animate.
+        if (!count) {
+            callback && callback();
+        }
+        // Start after all animators created
+        // Incase any animator is done immediately when all animation properties are not changed
+        for (var i = 0; i < animators.length; i++) {
+            animators[i]
+                .done(done)
+                .start(easing, forceAnimate);
+        }
+    },
+
+    /**
+     * @private
+     * @param {string} path=''
+     * @param {Object} source=this
+     * @param {Object} target
+     * @param {number} [time=500]
+     * @param {number} [delay=0]
+     *
+     * @example
+     *  // Animate position
+     *  el._animateToShallow({
+     *      position: [10, 10]
+     *  })
+     *
+     *  // Animate shape, style and position in 100ms, delayed 100ms
+     *  el._animateToShallow({
+     *      shape: {
+     *          width: 500
+     *      },
+     *      style: {
+     *          fill: 'red'
+     *      }
+     *      position: [10, 10]
+     *  }, 100, 100)
+     */
+    _animateToShallow: function (path, source, target, time, delay) {
+        var objShallow = {};
+        var propertyCount = 0;
+        for (var name in target) {
+            if (!target.hasOwnProperty(name)) {
+                continue;
+            }
+
+            if (source[name] != null) {
+                if (isObject$1(target[name]) && !isArrayLike(target[name])) {
+                    this._animateToShallow(
+                        path ? path + '.' + name : name,
+                        source[name],
+                        target[name],
+                        time,
+                        delay
+                    );
+                }
+                else {
+                    objShallow[name] = target[name];
+                    propertyCount++;
+                }
+            }
+            else if (target[name] != null) {
+                // Attr directly if not has property
+                // FIXME, if some property not needed for element ?
+                if (!path) {
+                    this.attr(name, target[name]);
+                }
+                else {  // Shape or style
+                    var props = {};
+                    props[path] = {};
+                    props[path][name] = target[name];
+                    this.attr(props);
+                }
+            }
+        }
+
+        if (propertyCount > 0) {
+            this.animate(path, false)
+                .when(time == null ? 500 : time, objShallow)
+                .delay(delay || 0);
+        }
+
+        return this;
+    }
+};
+
+/**
+ * @alias module:zrender/Element
+ * @constructor
+ * @extends {module:zrender/mixin/Animatable}
+ * @extends {module:zrender/mixin/Transformable}
+ * @extends {module:zrender/mixin/Eventful}
+ */
+var Element = function (opts) { // jshint ignore:line
+
+    Transformable.call(this, opts);
+    Eventful.call(this, opts);
+    Animatable.call(this, opts);
+
+    /**
+     * 画布元素ID
+     * @type {string}
+     */
+    this.id = opts.id || guid();
+};
+
+Element.prototype = {
+
+    /**
+     * 元素类型
+     * Element type
+     * @type {string}
+     */
+    type: 'element',
+
+    /**
+     * 元素名字
+     * Element name
+     * @type {string}
+     */
+    name: '',
+
+    /**
+     * ZRender 实例对象，会在 element 添加到 zrender 实例中后自动赋值
+     * ZRender instance will be assigned when element is associated with zrender
+     * @name module:/zrender/Element#__zr
+     * @type {module:zrender/ZRender}
+     */
+    __zr: null,
+
+    /**
+     * 图形是否忽略，为true时忽略图形的绘制以及事件触发
+     * If ignore drawing and events of the element object
+     * @name module:/zrender/Element#ignore
+     * @type {boolean}
+     * @default false
+     */
+    ignore: false,
+
+    /**
+     * 用于裁剪的路径(shape)，所有 Group 内的路径在绘制时都会被这个路径裁剪
+     * 该路径会继承被裁减对象的变换
+     * @type {module:zrender/graphic/Path}
+     * @see http://www.w3.org/TR/2dcontext/#clipping-region
+     * @readOnly
+     */
+    clipPath: null,
+
+    /**
+     * 是否是 Group
+     * @type {boolean}
+     */
+    isGroup: false,
+
+    /**
+     * Drift element
+     * @param  {number} dx dx on the global space
+     * @param  {number} dy dy on the global space
+     */
+    drift: function (dx, dy) {
+        switch (this.draggable) {
+            case 'horizontal':
+                dy = 0;
+                break;
+            case 'vertical':
+                dx = 0;
+                break;
+        }
+
+        var m = this.transform;
+        if (!m) {
+            m = this.transform = [1, 0, 0, 1, 0, 0];
+        }
+        m[4] += dx;
+        m[5] += dy;
+
+        this.decomposeTransform();
+        this.dirty(false);
+    },
+
+    /**
+     * Hook before update
+     */
+    beforeUpdate: function () {},
+    /**
+     * Hook after update
+     */
+    afterUpdate: function () {},
+    /**
+     * Update each frame
+     */
+    update: function () {
+        this.updateTransform();
+    },
+
+    /**
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    traverse: function (cb, context) {},
+
+    /**
+     * @protected
+     */
+    attrKV: function (key, value) {
+        if (key === 'position' || key === 'scale' || key === 'origin') {
+            // Copy the array
+            if (value) {
+                var target = this[key];
+                if (!target) {
+                    target = this[key] = [];
+                }
+                target[0] = value[0];
+                target[1] = value[1];
+            }
+        }
+        else {
+            this[key] = value;
+        }
+    },
+
+    /**
+     * Hide the element
+     */
+    hide: function () {
+        this.ignore = true;
+        this.__zr && this.__zr.refresh();
+    },
+
+    /**
+     * Show the element
+     */
+    show: function () {
+        this.ignore = false;
+        this.__zr && this.__zr.refresh();
+    },
+
+    /**
+     * @param {string|Object} key
+     * @param {*} value
+     */
+    attr: function (key, value) {
+        if (typeof key === 'string') {
+            this.attrKV(key, value);
+        }
+        else if (isObject$1(key)) {
+            for (var name in key) {
+                if (key.hasOwnProperty(name)) {
+                    this.attrKV(name, key[name]);
+                }
+            }
+        }
+
+        this.dirty(false);
+
+        return this;
+    },
+
+    /**
+     * @param {module:zrender/graphic/Path} clipPath
+     */
+    setClipPath: function (clipPath) {
+        var zr = this.__zr;
+        if (zr) {
+            clipPath.addSelfToZr(zr);
+        }
+
+        // Remove previous clip path
+        if (this.clipPath && this.clipPath !== clipPath) {
+            this.removeClipPath();
+        }
+
+        this.clipPath = clipPath;
+        clipPath.__zr = zr;
+        clipPath.__clipTarget = this;
+
+        this.dirty(false);
+    },
+
+    /**
+     */
+    removeClipPath: function () {
+        var clipPath = this.clipPath;
+        if (clipPath) {
+            if (clipPath.__zr) {
+                clipPath.removeSelfFromZr(clipPath.__zr);
+            }
+
+            clipPath.__zr = null;
+            clipPath.__clipTarget = null;
+            this.clipPath = null;
+
+            this.dirty(false);
+        }
+    },
+
+    /**
+     * Add self from zrender instance.
+     * Not recursively because it will be invoked when element added to storage.
+     * @param {module:zrender/ZRender} zr
+     */
+    addSelfToZr: function (zr) {
+        this.__zr = zr;
+        // 添加动画
+        var animators = this.animators;
+        if (animators) {
+            for (var i = 0; i < animators.length; i++) {
+                zr.animation.addAnimator(animators[i]);
+            }
+        }
+
+        if (this.clipPath) {
+            this.clipPath.addSelfToZr(zr);
+        }
+    },
+
+    /**
+     * Remove self from zrender instance.
+     * Not recursively because it will be invoked when element added to storage.
+     * @param {module:zrender/ZRender} zr
+     */
+    removeSelfFromZr: function (zr) {
+        this.__zr = null;
+        // 移除动画
+        var animators = this.animators;
+        if (animators) {
+            for (var i = 0; i < animators.length; i++) {
+                zr.animation.removeAnimator(animators[i]);
+            }
+        }
+
+        if (this.clipPath) {
+            this.clipPath.removeSelfFromZr(zr);
+        }
+    }
+};
+
+mixin(Element, Animatable);
+mixin(Element, Transformable);
+mixin(Element, Eventful);
+
+/**
+ * @module echarts/core/BoundingRect
+ */
+
+var v2ApplyTransform = applyTransform;
+var mathMin = Math.min;
+var mathMax = Math.max;
+
+/**
+ * @alias module:echarts/core/BoundingRect
+ */
+function BoundingRect(x, y, width, height) {
+
+    if (width < 0) {
+        x = x + width;
+        width = -width;
+    }
+    if (height < 0) {
+        y = y + height;
+        height = -height;
+    }
+
+    /**
+     * @type {number}
+     */
+    this.x = x;
+    /**
+     * @type {number}
+     */
+    this.y = y;
+    /**
+     * @type {number}
+     */
+    this.width = width;
+    /**
+     * @type {number}
+     */
+    this.height = height;
+}
+
+BoundingRect.prototype = {
+
+    constructor: BoundingRect,
+
+    /**
+     * @param {module:echarts/core/BoundingRect} other
+     */
+    union: function (other) {
+        var x = mathMin(other.x, this.x);
+        var y = mathMin(other.y, this.y);
+
+        this.width = mathMax(
+                other.x + other.width,
+                this.x + this.width
+            ) - x;
+        this.height = mathMax(
+                other.y + other.height,
+                this.y + this.height
+            ) - y;
+        this.x = x;
+        this.y = y;
+    },
+
+    /**
+     * @param {Array.<number>} m
+     * @methods
+     */
+    applyTransform: (function () {
+        var lt = [];
+        var rb = [];
+        var lb = [];
+        var rt = [];
+        return function (m) {
+            // In case usage like this
+            // el.getBoundingRect().applyTransform(el.transform)
+            // And element has no transform
+            if (!m) {
+                return;
+            }
+            lt[0] = lb[0] = this.x;
+            lt[1] = rt[1] = this.y;
+            rb[0] = rt[0] = this.x + this.width;
+            rb[1] = lb[1] = this.y + this.height;
+
+            v2ApplyTransform(lt, lt, m);
+            v2ApplyTransform(rb, rb, m);
+            v2ApplyTransform(lb, lb, m);
+            v2ApplyTransform(rt, rt, m);
+
+            this.x = mathMin(lt[0], rb[0], lb[0], rt[0]);
+            this.y = mathMin(lt[1], rb[1], lb[1], rt[1]);
+            var maxX = mathMax(lt[0], rb[0], lb[0], rt[0]);
+            var maxY = mathMax(lt[1], rb[1], lb[1], rt[1]);
+            this.width = maxX - this.x;
+            this.height = maxY - this.y;
+        };
+    })(),
+
+    /**
+     * Calculate matrix of transforming from self to target rect
+     * @param  {module:zrender/core/BoundingRect} b
+     * @return {Array.<number>}
+     */
+    calculateTransform: function (b) {
+        var a = this;
+        var sx = b.width / a.width;
+        var sy = b.height / a.height;
+
+        var m = create$1();
+
+        // 矩阵右乘
+        translate(m, m, [-a.x, -a.y]);
+        scale$1(m, m, [sx, sy]);
+        translate(m, m, [b.x, b.y]);
+
+        return m;
+    },
+
+    /**
+     * @param {(module:echarts/core/BoundingRect|Object)} b
+     * @return {boolean}
+     */
+    intersect: function (b) {
+        if (!b) {
+            return false;
+        }
+
+        if (!(b instanceof BoundingRect)) {
+            // Normalize negative width/height.
+            b = BoundingRect.create(b);
+        }
+
+        var a = this;
+        var ax0 = a.x;
+        var ax1 = a.x + a.width;
+        var ay0 = a.y;
+        var ay1 = a.y + a.height;
+
+        var bx0 = b.x;
+        var bx1 = b.x + b.width;
+        var by0 = b.y;
+        var by1 = b.y + b.height;
+
+        return ! (ax1 < bx0 || bx1 < ax0 || ay1 < by0 || by1 < ay0);
+    },
+
+    contain: function (x, y) {
+        var rect = this;
+        return x >= rect.x
+            && x <= (rect.x + rect.width)
+            && y >= rect.y
+            && y <= (rect.y + rect.height);
+    },
+
+    /**
+     * @return {module:echarts/core/BoundingRect}
+     */
+    clone: function () {
+        return new BoundingRect(this.x, this.y, this.width, this.height);
+    },
+
+    /**
+     * Copy from another rect
+     */
+    copy: function (other) {
+        this.x = other.x;
+        this.y = other.y;
+        this.width = other.width;
+        this.height = other.height;
+    },
+
+    plain: function () {
+        return {
+            x: this.x,
+            y: this.y,
+            width: this.width,
+            height: this.height
+        };
+    }
+};
+
+/**
+ * @param {Object|module:zrender/core/BoundingRect} rect
+ * @param {number} rect.x
+ * @param {number} rect.y
+ * @param {number} rect.width
+ * @param {number} rect.height
+ * @return {module:zrender/core/BoundingRect}
+ */
+BoundingRect.create = function (rect) {
+    return new BoundingRect(rect.x, rect.y, rect.width, rect.height);
+};
+
+/**
+ * Group是一个容器，可以插入子节点，Group的变换也会被应用到子节点上
+ * @module zrender/graphic/Group
+ * @example
+ *     var Group = require('zrender/container/Group');
+ *     var Circle = require('zrender/graphic/shape/Circle');
+ *     var g = new Group();
+ *     g.position[0] = 100;
+ *     g.position[1] = 100;
+ *     g.add(new Circle({
+ *         style: {
+ *             x: 100,
+ *             y: 100,
+ *             r: 20,
+ *         }
+ *     }));
+ *     zr.add(g);
+ */
+
+/**
+ * @alias module:zrender/graphic/Group
+ * @constructor
+ * @extends module:zrender/mixin/Transformable
+ * @extends module:zrender/mixin/Eventful
+ */
+var Group = function (opts) {
+
+    opts = opts || {};
+
+    Element.call(this, opts);
+
+    for (var key in opts) {
+        if (opts.hasOwnProperty(key)) {
+            this[key] = opts[key];
+        }
+    }
+
+    this._children = [];
+
+    this.__storage = null;
+
+    this.__dirty = true;
+};
+
+Group.prototype = {
+
+    constructor: Group,
+
+    isGroup: true,
+
+    /**
+     * @type {string}
+     */
+    type: 'group',
+
+    /**
+     * 所有子孙元素是否响应鼠标事件
+     * @name module:/zrender/container/Group#silent
+     * @type {boolean}
+     * @default false
+     */
+    silent: false,
+
+    /**
+     * @return {Array.<module:zrender/Element>}
+     */
+    children: function () {
+        return this._children.slice();
+    },
+
+    /**
+     * 获取指定 index 的儿子节点
+     * @param  {number} idx
+     * @return {module:zrender/Element}
+     */
+    childAt: function (idx) {
+        return this._children[idx];
+    },
+
+    /**
+     * 获取指定名字的儿子节点
+     * @param  {string} name
+     * @return {module:zrender/Element}
+     */
+    childOfName: function (name) {
+        var children = this._children;
+        for (var i = 0; i < children.length; i++) {
+            if (children[i].name === name) {
+                return children[i];
+            }
+            }
+    },
+
+    /**
+     * @return {number}
+     */
+    childCount: function () {
+        return this._children.length;
+    },
+
+    /**
+     * 添加子节点到最后
+     * @param {module:zrender/Element} child
+     */
+    add: function (child) {
+        if (child && child !== this && child.parent !== this) {
+
+            this._children.push(child);
+
+            this._doAdd(child);
+        }
+
+        return this;
+    },
+
+    /**
+     * 添加子节点在 nextSibling 之前
+     * @param {module:zrender/Element} child
+     * @param {module:zrender/Element} nextSibling
+     */
+    addBefore: function (child, nextSibling) {
+        if (child && child !== this && child.parent !== this
+            && nextSibling && nextSibling.parent === this) {
+
+            var children = this._children;
+            var idx = children.indexOf(nextSibling);
+
+            if (idx >= 0) {
+                children.splice(idx, 0, child);
+                this._doAdd(child);
+            }
+        }
+
+        return this;
+    },
+
+    _doAdd: function (child) {
+        if (child.parent) {
+            child.parent.remove(child);
+        }
+
+        child.parent = this;
+
+        var storage = this.__storage;
+        var zr = this.__zr;
+        if (storage && storage !== child.__storage) {
+
+            storage.addToStorage(child);
+
+            if (child instanceof Group) {
+                child.addChildrenToStorage(storage);
+            }
+        }
+
+        zr && zr.refresh();
+    },
+
+    /**
+     * 移除子节点
+     * @param {module:zrender/Element} child
+     */
+    remove: function (child) {
+        var zr = this.__zr;
+        var storage = this.__storage;
+        var children = this._children;
+
+        var idx = indexOf(children, child);
+        if (idx < 0) {
+            return this;
+        }
+        children.splice(idx, 1);
+
+        child.parent = null;
+
+        if (storage) {
+
+            storage.delFromStorage(child);
+
+            if (child instanceof Group) {
+                child.delChildrenFromStorage(storage);
+            }
+        }
+
+        zr && zr.refresh();
+
+        return this;
+    },
+
+    /**
+     * 移除所有子节点
+     */
+    removeAll: function () {
+        var children = this._children;
+        var storage = this.__storage;
+        var child;
+        var i;
+        for (i = 0; i < children.length; i++) {
+            child = children[i];
+            if (storage) {
+                storage.delFromStorage(child);
+                if (child instanceof Group) {
+                    child.delChildrenFromStorage(storage);
+                }
+            }
+            child.parent = null;
+        }
+        children.length = 0;
+
+        return this;
+    },
+
+    /**
+     * 遍历所有子节点
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    eachChild: function (cb, context) {
+        var children = this._children;
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            cb.call(context, child, i);
+        }
+        return this;
+    },
+
+    /**
+     * 深度优先遍历所有子孙节点
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    traverse: function (cb, context) {
+        for (var i = 0; i < this._children.length; i++) {
+            var child = this._children[i];
+            cb.call(context, child);
+
+            if (child.type === 'group') {
+                child.traverse(cb, context);
+            }
+        }
+        return this;
+    },
+
+    addChildrenToStorage: function (storage) {
+        for (var i = 0; i < this._children.length; i++) {
+            var child = this._children[i];
+            storage.addToStorage(child);
+            if (child instanceof Group) {
+                child.addChildrenToStorage(storage);
+            }
+        }
+    },
+
+    delChildrenFromStorage: function (storage) {
+        for (var i = 0; i < this._children.length; i++) {
+            var child = this._children[i];
+            storage.delFromStorage(child);
+            if (child instanceof Group) {
+                child.delChildrenFromStorage(storage);
+            }
+        }
+    },
+
+    dirty: function () {
+        this.__dirty = true;
+        this.__zr && this.__zr.refresh();
+        return this;
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getBoundingRect: function (includeChildren) {
+        // TODO Caching
+        var rect = null;
+        var tmpRect = new BoundingRect(0, 0, 0, 0);
+        var children = includeChildren || this._children;
+        var tmpMat = [];
+
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            if (child.ignore || child.invisible) {
+                continue;
+            }
+
+            var childRect = child.getBoundingRect();
+            var transform = child.getLocalTransform(tmpMat);
+            // TODO
+            // The boundingRect cacluated by transforming original
+            // rect may be bigger than the actual bundingRect when rotation
+            // is used. (Consider a circle rotated aginst its center, where
+            // the actual boundingRect should be the same as that not be
+            // rotated.) But we can not find better approach to calculate
+            // actual boundingRect yet, considering performance.
+            if (transform) {
+                tmpRect.copy(childRect);
+                tmpRect.applyTransform(transform);
+                rect = rect || tmpRect.clone();
+                rect.union(tmpRect);
+            }
+            else {
+                rect = rect || childRect.clone();
+                rect.union(childRect);
+            }
+        }
+        return rect || tmpRect;
+    }
+};
+
+inherits(Group, Element);
+
+// https://github.com/mziccard/node-timsort
+var DEFAULT_MIN_MERGE = 32;
+
+var DEFAULT_MIN_GALLOPING = 7;
+
+function minRunLength(n) {
+    var r = 0;
+
+    while (n >= DEFAULT_MIN_MERGE) {
+        r |= n & 1;
+        n >>= 1;
+    }
+
+    return n + r;
+}
+
+function makeAscendingRun(array, lo, hi, compare) {
+    var runHi = lo + 1;
+
+    if (runHi === hi) {
+        return 1;
+    }
+
+    if (compare(array[runHi++], array[lo]) < 0) {
+        while (runHi < hi && compare(array[runHi], array[runHi - 1]) < 0) {
+            runHi++;
+        }
+
+        reverseRun(array, lo, runHi);
+    }
+    else {
+        while (runHi < hi && compare(array[runHi], array[runHi - 1]) >= 0) {
+            runHi++;
+        }
+    }
+
+    return runHi - lo;
+}
+
+function reverseRun(array, lo, hi) {
+    hi--;
+
+    while (lo < hi) {
+        var t = array[lo];
+        array[lo++] = array[hi];
+        array[hi--] = t;
+    }
+}
+
+function binaryInsertionSort(array, lo, hi, start, compare) {
+    if (start === lo) {
+        start++;
+    }
+
+    for (; start < hi; start++) {
+        var pivot = array[start];
+
+        var left = lo;
+        var right = start;
+        var mid;
+
+        while (left < right) {
+            mid = left + right >>> 1;
+
+            if (compare(pivot, array[mid]) < 0) {
+                right = mid;
+            }
+            else {
+                left = mid + 1;
+            }
+        }
+
+        var n = start - left;
+
+        switch (n) {
+            case 3:
+                array[left + 3] = array[left + 2];
+
+            case 2:
+                array[left + 2] = array[left + 1];
+
+            case 1:
+                array[left + 1] = array[left];
+                break;
+            default:
+                while (n > 0) {
+                    array[left + n] = array[left + n - 1];
+                    n--;
+                }
+        }
+
+        array[left] = pivot;
+    }
+}
+
+function gallopLeft(value, array, start, length, hint, compare) {
+    var lastOffset = 0;
+    var maxOffset = 0;
+    var offset = 1;
+
+    if (compare(value, array[start + hint]) > 0) {
+        maxOffset = length - hint;
+
+        while (offset < maxOffset && compare(value, array[start + hint + offset]) > 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        lastOffset += hint;
+        offset += hint;
+    }
+    else {
+        maxOffset = hint + 1;
+        while (offset < maxOffset && compare(value, array[start + hint - offset]) <= 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        var tmp = lastOffset;
+        lastOffset = hint - offset;
+        offset = hint - tmp;
+    }
+
+    lastOffset++;
+    while (lastOffset < offset) {
+        var m = lastOffset + (offset - lastOffset >>> 1);
+
+        if (compare(value, array[start + m]) > 0) {
+            lastOffset = m + 1;
+        }
+        else {
+            offset = m;
+        }
+    }
+    return offset;
+}
+
+function gallopRight(value, array, start, length, hint, compare) {
+    var lastOffset = 0;
+    var maxOffset = 0;
+    var offset = 1;
+
+    if (compare(value, array[start + hint]) < 0) {
+        maxOffset = hint + 1;
+
+        while (offset < maxOffset && compare(value, array[start + hint - offset]) < 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        var tmp = lastOffset;
+        lastOffset = hint - offset;
+        offset = hint - tmp;
+    }
+    else {
+        maxOffset = length - hint;
+
+        while (offset < maxOffset && compare(value, array[start + hint + offset]) >= 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        lastOffset += hint;
+        offset += hint;
+    }
+
+    lastOffset++;
+
+    while (lastOffset < offset) {
+        var m = lastOffset + (offset - lastOffset >>> 1);
+
+        if (compare(value, array[start + m]) < 0) {
+            offset = m;
+        }
+        else {
+            lastOffset = m + 1;
+        }
+    }
+
+    return offset;
+}
+
+function TimSort(array, compare) {
+    var minGallop = DEFAULT_MIN_GALLOPING;
+    var runStart;
+    var runLength;
+    var stackSize = 0;
+
+    var tmp = [];
+
+    runStart = [];
+    runLength = [];
+
+    function pushRun(_runStart, _runLength) {
+        runStart[stackSize] = _runStart;
+        runLength[stackSize] = _runLength;
+        stackSize += 1;
+    }
+
+    function mergeRuns() {
+        while (stackSize > 1) {
+            var n = stackSize - 2;
+
+            if (n >= 1 && runLength[n - 1] <= runLength[n] + runLength[n + 1] || n >= 2 && runLength[n - 2] <= runLength[n] + runLength[n - 1]) {
+                if (runLength[n - 1] < runLength[n + 1]) {
+                    n--;
+                }
+            }
+            else if (runLength[n] > runLength[n + 1]) {
+                break;
+            }
+            mergeAt(n);
+        }
+    }
+
+    function forceMergeRuns() {
+        while (stackSize > 1) {
+            var n = stackSize - 2;
+
+            if (n > 0 && runLength[n - 1] < runLength[n + 1]) {
+                n--;
+            }
+
+            mergeAt(n);
+        }
+    }
+
+    function mergeAt(i) {
+        var start1 = runStart[i];
+        var length1 = runLength[i];
+        var start2 = runStart[i + 1];
+        var length2 = runLength[i + 1];
+
+        runLength[i] = length1 + length2;
+
+        if (i === stackSize - 3) {
+            runStart[i + 1] = runStart[i + 2];
+            runLength[i + 1] = runLength[i + 2];
+        }
+
+        stackSize--;
+
+        var k = gallopRight(array[start2], array, start1, length1, 0, compare);
+        start1 += k;
+        length1 -= k;
+
+        if (length1 === 0) {
+            return;
+        }
+
+        length2 = gallopLeft(array[start1 + length1 - 1], array, start2, length2, length2 - 1, compare);
+
+        if (length2 === 0) {
+            return;
+        }
+
+        if (length1 <= length2) {
+            mergeLow(start1, length1, start2, length2);
+        }
+        else {
+            mergeHigh(start1, length1, start2, length2);
+        }
+    }
+
+    function mergeLow(start1, length1, start2, length2) {
+        var i = 0;
+
+        for (i = 0; i < length1; i++) {
+            tmp[i] = array[start1 + i];
+        }
+
+        var cursor1 = 0;
+        var cursor2 = start2;
+        var dest = start1;
+
+        array[dest++] = array[cursor2++];
+
+        if (--length2 === 0) {
+            for (i = 0; i < length1; i++) {
+                array[dest + i] = tmp[cursor1 + i];
+            }
+            return;
+        }
+
+        if (length1 === 1) {
+            for (i = 0; i < length2; i++) {
+                array[dest + i] = array[cursor2 + i];
+            }
+            array[dest + length2] = tmp[cursor1];
+            return;
+        }
+
+        var _minGallop = minGallop;
+        var count1, count2, exit;
+
+        while (1) {
+            count1 = 0;
+            count2 = 0;
+            exit = false;
+
+            do {
+                if (compare(array[cursor2], tmp[cursor1]) < 0) {
+                    array[dest++] = array[cursor2++];
+                    count2++;
+                    count1 = 0;
+
+                    if (--length2 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+                else {
+                    array[dest++] = tmp[cursor1++];
+                    count1++;
+                    count2 = 0;
+                    if (--length1 === 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+            } while ((count1 | count2) < _minGallop);
+
+            if (exit) {
+                break;
+            }
+
+            do {
+                count1 = gallopRight(array[cursor2], tmp, cursor1, length1, 0, compare);
+
+                if (count1 !== 0) {
+                    for (i = 0; i < count1; i++) {
+                        array[dest + i] = tmp[cursor1 + i];
+                    }
+
+                    dest += count1;
+                    cursor1 += count1;
+                    length1 -= count1;
+                    if (length1 <= 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+
+                array[dest++] = array[cursor2++];
+
+                if (--length2 === 0) {
+                    exit = true;
+                    break;
+                }
+
+                count2 = gallopLeft(tmp[cursor1], array, cursor2, length2, 0, compare);
+
+                if (count2 !== 0) {
+                    for (i = 0; i < count2; i++) {
+                        array[dest + i] = array[cursor2 + i];
+                    }
+
+                    dest += count2;
+                    cursor2 += count2;
+                    length2 -= count2;
+
+                    if (length2 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+                array[dest++] = tmp[cursor1++];
+
+                if (--length1 === 1) {
+                    exit = true;
+                    break;
+                }
+
+                _minGallop--;
+            } while (count1 >= DEFAULT_MIN_GALLOPING || count2 >= DEFAULT_MIN_GALLOPING);
+
+            if (exit) {
+                break;
+            }
+
+            if (_minGallop < 0) {
+                _minGallop = 0;
+            }
+
+            _minGallop += 2;
+        }
+
+        minGallop = _minGallop;
+
+        minGallop < 1 && (minGallop = 1);
+
+        if (length1 === 1) {
+            for (i = 0; i < length2; i++) {
+                array[dest + i] = array[cursor2 + i];
+            }
+            array[dest + length2] = tmp[cursor1];
+        }
+        else if (length1 === 0) {
+            throw new Error();
+            // throw new Error('mergeLow preconditions were not respected');
+        }
+        else {
+            for (i = 0; i < length1; i++) {
+                array[dest + i] = tmp[cursor1 + i];
+            }
+        }
+    }
+
+    function mergeHigh (start1, length1, start2, length2) {
+        var i = 0;
+
+        for (i = 0; i < length2; i++) {
+            tmp[i] = array[start2 + i];
+        }
+
+        var cursor1 = start1 + length1 - 1;
+        var cursor2 = length2 - 1;
+        var dest = start2 + length2 - 1;
+        var customCursor = 0;
+        var customDest = 0;
+
+        array[dest--] = array[cursor1--];
+
+        if (--length1 === 0) {
+            customCursor = dest - (length2 - 1);
+
+            for (i = 0; i < length2; i++) {
+                array[customCursor + i] = tmp[i];
+            }
+
+            return;
+        }
+
+        if (length2 === 1) {
+            dest -= length1;
+            cursor1 -= length1;
+            customDest = dest + 1;
+            customCursor = cursor1 + 1;
+
+            for (i = length1 - 1; i >= 0; i--) {
+                array[customDest + i] = array[customCursor + i];
+            }
+
+            array[dest] = tmp[cursor2];
+            return;
+        }
+
+        var _minGallop = minGallop;
+
+        while (true) {
+            var count1 = 0;
+            var count2 = 0;
+            var exit = false;
+
+            do {
+                if (compare(tmp[cursor2], array[cursor1]) < 0) {
+                    array[dest--] = array[cursor1--];
+                    count1++;
+                    count2 = 0;
+                    if (--length1 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+                else {
+                    array[dest--] = tmp[cursor2--];
+                    count2++;
+                    count1 = 0;
+                    if (--length2 === 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+            } while ((count1 | count2) < _minGallop);
+
+            if (exit) {
+                break;
+            }
+
+            do {
+                count1 = length1 - gallopRight(tmp[cursor2], array, start1, length1, length1 - 1, compare);
+
+                if (count1 !== 0) {
+                    dest -= count1;
+                    cursor1 -= count1;
+                    length1 -= count1;
+                    customDest = dest + 1;
+                    customCursor = cursor1 + 1;
+
+                    for (i = count1 - 1; i >= 0; i--) {
+                        array[customDest + i] = array[customCursor + i];
+                    }
+
+                    if (length1 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+
+                array[dest--] = tmp[cursor2--];
+
+                if (--length2 === 1) {
+                    exit = true;
+                    break;
+                }
+
+                count2 = length2 - gallopLeft(array[cursor1], tmp, 0, length2, length2 - 1, compare);
+
+                if (count2 !== 0) {
+                    dest -= count2;
+                    cursor2 -= count2;
+                    length2 -= count2;
+                    customDest = dest + 1;
+                    customCursor = cursor2 + 1;
+
+                    for (i = 0; i < count2; i++) {
+                        array[customDest + i] = tmp[customCursor + i];
+                    }
+
+                    if (length2 <= 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+
+                array[dest--] = array[cursor1--];
+
+                if (--length1 === 0) {
+                    exit = true;
+                    break;
+                }
+
+                _minGallop--;
+            } while (count1 >= DEFAULT_MIN_GALLOPING || count2 >= DEFAULT_MIN_GALLOPING);
+
+            if (exit) {
+                break;
+            }
+
+            if (_minGallop < 0) {
+                _minGallop = 0;
+            }
+
+            _minGallop += 2;
+        }
+
+        minGallop = _minGallop;
+
+        if (minGallop < 1) {
+            minGallop = 1;
+        }
+
+        if (length2 === 1) {
+            dest -= length1;
+            cursor1 -= length1;
+            customDest = dest + 1;
+            customCursor = cursor1 + 1;
+
+            for (i = length1 - 1; i >= 0; i--) {
+                array[customDest + i] = array[customCursor + i];
+            }
+
+            array[dest] = tmp[cursor2];
+        }
+        else if (length2 === 0) {
+            throw new Error();
+            // throw new Error('mergeHigh preconditions were not respected');
+        }
+        else {
+            customCursor = dest - (length2 - 1);
+            for (i = 0; i < length2; i++) {
+                array[customCursor + i] = tmp[i];
+            }
+        }
+    }
+
+    this.mergeRuns = mergeRuns;
+    this.forceMergeRuns = forceMergeRuns;
+    this.pushRun = pushRun;
+}
+
+function sort(array, compare, lo, hi) {
+    if (!lo) {
+        lo = 0;
+    }
+    if (!hi) {
+        hi = array.length;
+    }
+
+    var remaining = hi - lo;
+
+    if (remaining < 2) {
+        return;
+    }
+
+    var runLength = 0;
+
+    if (remaining < DEFAULT_MIN_MERGE) {
+        runLength = makeAscendingRun(array, lo, hi, compare);
+        binaryInsertionSort(array, lo, hi, lo + runLength, compare);
+        return;
+    }
+
+    var ts = new TimSort(array, compare);
+
+    var minRun = minRunLength(remaining);
+
+    do {
+        runLength = makeAscendingRun(array, lo, hi, compare);
+        if (runLength < minRun) {
+            var force = remaining;
+            if (force > minRun) {
+                force = minRun;
+            }
+
+            binaryInsertionSort(array, lo, lo + force, lo + runLength, compare);
+            runLength = force;
+        }
+
+        ts.pushRun(lo, runLength);
+        ts.mergeRuns();
+
+        remaining -= runLength;
+        lo += runLength;
+    } while (remaining !== 0);
+
+    ts.forceMergeRuns();
+}
+
+// Use timsort because in most case elements are partially sorted
+// https://jsfiddle.net/pissang/jr4x7mdm/8/
+function shapeCompareFunc(a, b) {
+    if (a.zlevel === b.zlevel) {
+        if (a.z === b.z) {
+            // if (a.z2 === b.z2) {
+            //     // FIXME Slow has renderidx compare
+            //     // http://stackoverflow.com/questions/20883421/sorting-in-javascript-should-every-compare-function-have-a-return-0-statement
+            //     // https://github.com/v8/v8/blob/47cce544a31ed5577ffe2963f67acb4144ee0232/src/js/array.js#L1012
+            //     return a.__renderidx - b.__renderidx;
+            // }
+            return a.z2 - b.z2;
+        }
+        return a.z - b.z;
+    }
+    return a.zlevel - b.zlevel;
+}
+/**
+ * 内容仓库 (M)
+ * @alias module:zrender/Storage
+ * @constructor
+ */
+var Storage = function () { // jshint ignore:line
+    this._roots = [];
+
+    this._displayList = [];
+
+    this._displayListLen = 0;
+};
+
+Storage.prototype = {
+
+    constructor: Storage,
+
+    /**
+     * @param  {Function} cb
+     *
+     */
+    traverse: function (cb, context) {
+        for (var i = 0; i < this._roots.length; i++) {
+            this._roots[i].traverse(cb, context);
+        }
+    },
+
+    /**
+     * 返回所有图形的绘制队列
+     * @param {boolean} [update=false] 是否在返回前更新该数组
+     * @param {boolean} [includeIgnore=false] 是否包含 ignore 的数组, 在 update 为 true 的时候有效
+     *
+     * 详见{@link module:zrender/graphic/Displayable.prototype.updateDisplayList}
+     * @return {Array.<module:zrender/graphic/Displayable>}
+     */
+    getDisplayList: function (update, includeIgnore) {
+        includeIgnore = includeIgnore || false;
+        if (update) {
+            this.updateDisplayList(includeIgnore);
+        }
+        return this._displayList;
+    },
+
+    /**
+     * 更新图形的绘制队列。
+     * 每次绘制前都会调用，该方法会先深度优先遍历整个树，更新所有Group和Shape的变换并且把所有可见的Shape保存到数组中，
+     * 最后根据绘制的优先级（zlevel > z > 插入顺序）排序得到绘制队列
+     * @param {boolean} [includeIgnore=false] 是否包含 ignore 的数组
+     */
+    updateDisplayList: function (includeIgnore) {
+        this._displayListLen = 0;
+
+        var roots = this._roots;
+        var displayList = this._displayList;
+        for (var i = 0, len = roots.length; i < len; i++) {
+            this._updateAndAddDisplayable(roots[i], null, includeIgnore);
+        }
+
+        displayList.length = this._displayListLen;
+
+        env$1.canvasSupported && sort(displayList, shapeCompareFunc);
+    },
+
+    _updateAndAddDisplayable: function (el, clipPaths, includeIgnore) {
+
+        if (el.ignore && !includeIgnore) {
+            return;
+        }
+
+        el.beforeUpdate();
+
+        if (el.__dirty) {
+
+            el.update();
+
+        }
+
+        el.afterUpdate();
+
+        var userSetClipPath = el.clipPath;
+        if (userSetClipPath) {
+
+            // FIXME 效率影响
+            if (clipPaths) {
+                clipPaths = clipPaths.slice();
+            }
+            else {
+                clipPaths = [];
+            }
+
+            var currentClipPath = userSetClipPath;
+            var parentClipPath = el;
+            // Recursively add clip path
+            while (currentClipPath) {
+                // clipPath 的变换是基于使用这个 clipPath 的元素
+                currentClipPath.parent = parentClipPath;
+                currentClipPath.updateTransform();
+
+                clipPaths.push(currentClipPath);
+
+                parentClipPath = currentClipPath;
+                currentClipPath = currentClipPath.clipPath;
+            }
+        }
+
+        if (el.isGroup) {
+            var children = el._children;
+
+            for (var i = 0; i < children.length; i++) {
+                var child = children[i];
+
+                // Force to mark as dirty if group is dirty
+                // FIXME __dirtyPath ?
+                if (el.__dirty) {
+                    child.__dirty = true;
+                }
+
+                this._updateAndAddDisplayable(child, clipPaths, includeIgnore);
+            }
+
+            // Mark group clean here
+            el.__dirty = false;
+
+        }
+        else {
+            el.__clipPaths = clipPaths;
+
+            this._displayList[this._displayListLen++] = el;
+        }
+    },
+
+    /**
+     * 添加图形(Shape)或者组(Group)到根节点
+     * @param {module:zrender/Element} el
+     */
+    addRoot: function (el) {
+        if (el.__storage === this) {
+            return;
+        }
+
+        if (el instanceof Group) {
+            el.addChildrenToStorage(this);
+        }
+
+        this.addToStorage(el);
+        this._roots.push(el);
+    },
+
+    /**
+     * 删除指定的图形(Shape)或者组(Group)
+     * @param {string|Array.<string>} [el] 如果为空清空整个Storage
+     */
+    delRoot: function (el) {
+        if (el == null) {
+            // 不指定el清空
+            for (var i = 0; i < this._roots.length; i++) {
+                var root = this._roots[i];
+                if (root instanceof Group) {
+                    root.delChildrenFromStorage(this);
+                }
+            }
+
+            this._roots = [];
+            this._displayList = [];
+            this._displayListLen = 0;
+
+            return;
+        }
+
+        if (el instanceof Array) {
+            for (var i = 0, l = el.length; i < l; i++) {
+                this.delRoot(el[i]);
+            }
+            return;
+        }
+
+
+        var idx = indexOf(this._roots, el);
+        if (idx >= 0) {
+            this.delFromStorage(el);
+            this._roots.splice(idx, 1);
+            if (el instanceof Group) {
+                el.delChildrenFromStorage(this);
+            }
+        }
+    },
+
+    addToStorage: function (el) {
+        if (el) {
+            el.__storage = this;
+            el.dirty(false);
+        }
+        return this;
+    },
+
+    delFromStorage: function (el) {
+        if (el) {
+            el.__storage = null;
+        }
+
+        return this;
+    },
+
+    /**
+     * 清空并且释放Storage
+     */
+    dispose: function () {
+        this._renderList =
+        this._roots = null;
+    },
+
+    displayableSortFunc: shapeCompareFunc
+};
+
+var SHADOW_PROPS = {
+    'shadowBlur': 1,
+    'shadowOffsetX': 1,
+    'shadowOffsetY': 1,
+    'textShadowBlur': 1,
+    'textShadowOffsetX': 1,
+    'textShadowOffsetY': 1,
+    'textBoxShadowBlur': 1,
+    'textBoxShadowOffsetX': 1,
+    'textBoxShadowOffsetY': 1
+};
+
+var fixShadow = function (ctx, propName, value) {
+    if (SHADOW_PROPS.hasOwnProperty(propName)) {
+        return value *= ctx.dpr;
+    }
+    return value;
+};
+
+var STYLE_COMMON_PROPS = [
+    ['shadowBlur', 0], ['shadowOffsetX', 0], ['shadowOffsetY', 0], ['shadowColor', '#000'],
+    ['lineCap', 'butt'], ['lineJoin', 'miter'], ['miterLimit', 10]
+];
+
+// var SHADOW_PROPS = STYLE_COMMON_PROPS.slice(0, 4);
+// var LINE_PROPS = STYLE_COMMON_PROPS.slice(4);
+
+var Style = function (opts, host) {
+    this.extendFrom(opts, false);
+    this.host = host;
+};
+
+function createLinearGradient(ctx, obj, rect) {
+    var x = obj.x == null ? 0 : obj.x;
+    var x2 = obj.x2 == null ? 1 : obj.x2;
+    var y = obj.y == null ? 0 : obj.y;
+    var y2 = obj.y2 == null ? 0 : obj.y2;
+
+    if (!obj.global) {
+        x = x * rect.width + rect.x;
+        x2 = x2 * rect.width + rect.x;
+        y = y * rect.height + rect.y;
+        y2 = y2 * rect.height + rect.y;
+    }
+
+    // Fix NaN when rect is Infinity
+    x = isNaN(x) ? 0 : x;
+    x2 = isNaN(x2) ? 1 : x2;
+    y = isNaN(y) ? 0 : y;
+    y2 = isNaN(y2) ? 0 : y2;
+
+    var canvasGradient = ctx.createLinearGradient(x, y, x2, y2);
+
+    return canvasGradient;
+}
+
+function createRadialGradient(ctx, obj, rect) {
+    var width = rect.width;
+    var height = rect.height;
+    var min = Math.min(width, height);
+
+    var x = obj.x == null ? 0.5 : obj.x;
+    var y = obj.y == null ? 0.5 : obj.y;
+    var r = obj.r == null ? 0.5 : obj.r;
+    if (!obj.global) {
+        x = x * width + rect.x;
+        y = y * height + rect.y;
+        r = r * min;
+    }
+
+    var canvasGradient = ctx.createRadialGradient(x, y, 0, x, y, r);
+
+    return canvasGradient;
+}
+
+
+Style.prototype = {
+
+    constructor: Style,
+
+    /**
+     * @type {module:zrender/graphic/Displayable}
+     */
+    host: null,
+
+    /**
+     * @type {string}
+     */
+    fill: '#000',
+
+    /**
+     * @type {string}
+     */
+    stroke: null,
+
+    /**
+     * @type {number}
+     */
+    opacity: 1,
+
+    /**
+     * @type {Array.<number>}
+     */
+    lineDash: null,
+
+    /**
+     * @type {number}
+     */
+    lineDashOffset: 0,
+
+    /**
+     * @type {number}
+     */
+    shadowBlur: 0,
+
+    /**
+     * @type {number}
+     */
+    shadowOffsetX: 0,
+
+    /**
+     * @type {number}
+     */
+    shadowOffsetY: 0,
+
+    /**
+     * @type {number}
+     */
+    lineWidth: 1,
+
+    /**
+     * If stroke ignore scale
+     * @type {Boolean}
+     */
+    strokeNoScale: false,
+
+    // Bounding rect text configuration
+    // Not affected by element transform
+    /**
+     * @type {string}
+     */
+    text: null,
+
+    /**
+     * If `fontSize` or `fontFamily` exists, `font` will be reset by
+     * `fontSize`, `fontStyle`, `fontWeight`, `fontFamily`.
+     * So do not visit it directly in upper application (like echarts),
+     * but use `contain/text#makeFont` instead.
+     * @type {string}
+     */
+    font: null,
+
+    /**
+     * The same as font. Use font please.
+     * @deprecated
+     * @type {string}
+     */
+    textFont: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * @type {string}
+     */
+    fontStyle: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * @type {string}
+     */
+    fontWeight: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * Should be 12 but not '12px'.
+     * @type {number}
+     */
+    fontSize: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * @type {string}
+     */
+    fontFamily: null,
+
+    /**
+     * Reserved for special functinality, like 'hr'.
+     * @type {string}
+     */
+    textTag: null,
+
+    /**
+     * @type {string}
+     */
+    textFill: '#000',
+
+    /**
+     * @type {string}
+     */
+    textStroke: null,
+
+    /**
+     * @type {number}
+     */
+    textWidth: null,
+
+    /**
+     * Only for textBackground.
+     * @type {number}
+     */
+    textHeight: null,
+
+    /**
+     * textStroke may be set as some color as a default
+     * value in upper applicaion, where the default value
+     * of textStrokeWidth should be 0 to make sure that
+     * user can choose to do not use text stroke.
+     * @type {number}
+     */
+    textStrokeWidth: 0,
+
+    /**
+     * @type {number}
+     */
+    textLineHeight: null,
+
+    /**
+     * 'inside', 'left', 'right', 'top', 'bottom'
+     * [x, y]
+     * Based on x, y of rect.
+     * @type {string|Array.<number>}
+     * @default 'inside'
+     */
+    textPosition: 'inside',
+
+    /**
+     * If not specified, use the boundingRect of a `displayable`.
+     * @type {Object}
+     */
+    textRect: null,
+
+    /**
+     * [x, y]
+     * @type {Array.<number>}
+     */
+    textOffset: null,
+
+    /**
+     * @type {string}
+     */
+    textAlign: null,
+
+    /**
+     * @type {string}
+     */
+    textVerticalAlign: null,
+
+    /**
+     * @type {number}
+     */
+    textDistance: 5,
+
+    /**
+     * @type {string}
+     */
+    textShadowColor: 'transparent',
+
+    /**
+     * @type {number}
+     */
+    textShadowBlur: 0,
+
+    /**
+     * @type {number}
+     */
+    textShadowOffsetX: 0,
+
+    /**
+     * @type {number}
+     */
+    textShadowOffsetY: 0,
+
+    /**
+     * @type {string}
+     */
+    textBoxShadowColor: 'transparent',
+
+    /**
+     * @type {number}
+     */
+    textBoxShadowBlur: 0,
+
+    /**
+     * @type {number}
+     */
+    textBoxShadowOffsetX: 0,
+
+    /**
+     * @type {number}
+     */
+    textBoxShadowOffsetY: 0,
+
+    /**
+     * Whether transform text.
+     * Only useful in Path and Image element
+     * @type {boolean}
+     */
+    transformText: false,
+
+    /**
+     * Text rotate around position of Path or Image
+     * Only useful in Path and Image element and transformText is false.
+     */
+    textRotation: 0,
+
+    /**
+     * Text origin of text rotation, like [10, 40].
+     * Based on x, y of rect.
+     * Useful in label rotation of circular symbol.
+     * By default, this origin is textPosition.
+     * Can be 'center'.
+     * @type {string|Array.<number>}
+     */
+    textOrigin: null,
+
+    /**
+     * @type {string}
+     */
+    textBackgroundColor: null,
+
+    /**
+     * @type {string}
+     */
+    textBorderColor: null,
+
+    /**
+     * @type {number}
+     */
+    textBorderWidth: 0,
+
+    /**
+     * @type {number}
+     */
+    textBorderRadius: 0,
+
+    /**
+     * Can be `2` or `[2, 4]` or `[2, 3, 4, 5]`
+     * @type {number|Array.<number>}
+     */
+    textPadding: null,
+
+    /**
+     * Text styles for rich text.
+     * @type {Object}
+     */
+    rich: null,
+
+    /**
+     * {outerWidth, outerHeight, ellipsis, placeholder}
+     * @type {Object}
+     */
+    truncate: null,
+
+    /**
+     * https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
+     * @type {string}
+     */
+    blend: null,
+
+    /**
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    bind: function (ctx, el, prevEl) {
+        var style = this;
+        var prevStyle = prevEl && prevEl.style;
+        var firstDraw = !prevStyle;
+
+        for (var i = 0; i < STYLE_COMMON_PROPS.length; i++) {
+            var prop = STYLE_COMMON_PROPS[i];
+            var styleName = prop[0];
+
+            if (firstDraw || style[styleName] !== prevStyle[styleName]) {
+                // FIXME Invalid property value will cause style leak from previous element.
+                ctx[styleName] =
+                    fixShadow(ctx, styleName, style[styleName] || prop[1]);
+            }
+        }
+
+        if ((firstDraw || style.fill !== prevStyle.fill)) {
+            ctx.fillStyle = style.fill;
+        }
+        if ((firstDraw || style.stroke !== prevStyle.stroke)) {
+            ctx.strokeStyle = style.stroke;
+        }
+        if ((firstDraw || style.opacity !== prevStyle.opacity)) {
+            ctx.globalAlpha = style.opacity == null ? 1 : style.opacity;
+        }
+
+        if ((firstDraw || style.blend !== prevStyle.blend)) {
+            ctx.globalCompositeOperation = style.blend || 'source-over';
+        }
+        if (this.hasStroke()) {
+            var lineWidth = style.lineWidth;
+            ctx.lineWidth = lineWidth / (
+                (this.strokeNoScale && el && el.getLineScale) ? el.getLineScale() : 1
+            );
+        }
+    },
+
+    hasFill: function () {
+        var fill = this.fill;
+        return fill != null && fill !== 'none';
+    },
+
+    hasStroke: function () {
+        var stroke = this.stroke;
+        return stroke != null && stroke !== 'none' && this.lineWidth > 0;
+    },
+
+    /**
+     * Extend from other style
+     * @param {zrender/graphic/Style} otherStyle
+     * @param {boolean} overwrite true: overwrirte any way.
+     *                            false: overwrite only when !target.hasOwnProperty
+     *                            others: overwrite when property is not null/undefined.
+     */
+    extendFrom: function (otherStyle, overwrite) {
+        if (otherStyle) {
+            for (var name in otherStyle) {
+                if (otherStyle.hasOwnProperty(name)
+                    && (overwrite === true
+                        || (
+                            overwrite === false
+                                ? !this.hasOwnProperty(name)
+                                : otherStyle[name] != null
+                        )
+                    )
+                ) {
+                    this[name] = otherStyle[name];
+                }
+            }
+        }
+    },
+
+    /**
+     * Batch setting style with a given object
+     * @param {Object|string} obj
+     * @param {*} [obj]
+     */
+    set: function (obj, value) {
+        if (typeof obj === 'string') {
+            this[obj] = value;
+        }
+        else {
+            this.extendFrom(obj, true);
+        }
+    },
+
+    /**
+     * Clone
+     * @return {zrender/graphic/Style} [description]
+     */
+    clone: function () {
+        var newStyle = new this.constructor();
+        newStyle.extendFrom(this, true);
+        return newStyle;
+    },
+
+    getGradient: function (ctx, obj, rect) {
+        var method = obj.type === 'radial' ? createRadialGradient : createLinearGradient;
+        var canvasGradient = method(ctx, obj, rect);
+        var colorStops = obj.colorStops;
+        for (var i = 0; i < colorStops.length; i++) {
+            canvasGradient.addColorStop(
+                colorStops[i].offset, colorStops[i].color
+            );
+        }
+        return canvasGradient;
+    }
+
+};
+
+var styleProto = Style.prototype;
+for (var i = 0; i < STYLE_COMMON_PROPS.length; i++) {
+    var prop = STYLE_COMMON_PROPS[i];
+    if (!(prop[0] in styleProto)) {
+        styleProto[prop[0]] = prop[1];
+    }
+}
+
+// Provide for others
+Style.getGradient = styleProto.getGradient;
+
+var Pattern = function (image, repeat) {
+    // Should do nothing more in this constructor. Because gradient can be
+    // declard by `color: {image: ...}`, where this constructor will not be called.
+
+    this.image = image;
+    this.repeat = repeat;
+
+    // Can be cloned
+    this.type = 'pattern';
+};
+
+Pattern.prototype.getCanvasPattern = function (ctx) {
+    return ctx.createPattern(this.image, this.repeat || 'repeat');
+};
+
+/**
+ * @module zrender/Layer
+ * @author pissang(https://www.github.com/pissang)
+ */
+
+function returnFalse() {
+    return false;
+}
+
+/**
+ * 创建dom
+ *
+ * @inner
+ * @param {string} id dom id 待用
+ * @param {Painter} painter painter instance
+ * @param {number} number
+ */
+function createDom(id, painter, dpr) {
+    var newDom = createCanvas();
+    var width = painter.getWidth();
+    var height = painter.getHeight();
+
+    var newDomStyle = newDom.style;
+    if (newDomStyle) {  // In node or some other non-browser environment
+        newDomStyle.position = 'absolute';
+        newDomStyle.left = 0;
+        newDomStyle.top = 0;
+        newDomStyle.width = width + 'px';
+        newDomStyle.height = height + 'px';
+
+        newDom.setAttribute('data-zr-dom-id', id);
+    }
+
+    newDom.width = width * dpr;
+    newDom.height = height * dpr;
+
+    return newDom;
+}
+
+/**
+ * @alias module:zrender/Layer
+ * @constructor
+ * @extends module:zrender/mixin/Transformable
+ * @param {string} id
+ * @param {module:zrender/Painter} painter
+ * @param {number} [dpr]
+ */
+var Layer = function(id, painter, dpr) {
+    var dom;
+    dpr = dpr || devicePixelRatio;
+    if (typeof id === 'string') {
+        dom = createDom(id, painter, dpr);
+    }
+    // Not using isDom because in node it will return false
+    else if (isObject$1(id)) {
+        dom = id;
+        id = dom.id;
+    }
+    this.id = id;
+    this.dom = dom;
+
+    var domStyle = dom.style;
+    if (domStyle) { // Not in node
+        dom.onselectstart = returnFalse; // 避免页面选中的尴尬
+        domStyle['-webkit-user-select'] = 'none';
+        domStyle['user-select'] = 'none';
+        domStyle['-webkit-touch-callout'] = 'none';
+        domStyle['-webkit-tap-highlight-color'] = 'rgba(0,0,0,0)';
+        domStyle['padding'] = 0;
+        domStyle['margin'] = 0;
+        domStyle['border-width'] = 0;
+    }
+
+    this.domBack = null;
+    this.ctxBack = null;
+
+    this.painter = painter;
+
+    this.config = null;
+
+    // Configs
+    /**
+     * 每次清空画布的颜色
+     * @type {string}
+     * @default 0
+     */
+    this.clearColor = 0;
+    /**
+     * 是否开启动态模糊
+     * @type {boolean}
+     * @default false
+     */
+    this.motionBlur = false;
+    /**
+     * 在开启动态模糊的时候使用，与上一帧混合的alpha值，值越大尾迹越明显
+     * @type {number}
+     * @default 0.7
+     */
+    this.lastFrameAlpha = 0.7;
+
+    /**
+     * Layer dpr
+     * @type {number}
+     */
+    this.dpr = dpr;
+};
+
+Layer.prototype = {
+
+    constructor: Layer,
+
+    __dirty: true,
+
+    __used: false,
+
+    __drawIndex: 0,
+    __startIndex: 0,
+    __endIndex: 0,
+
+    incremental: false,
+
+    getElementCount: function () {
+        return this.__endIndex - this.__startIndex;
+    },
+
+    initContext: function () {
+        this.ctx = this.dom.getContext('2d');
+        this.ctx.dpr = this.dpr;
+    },
+
+    createBackBuffer: function () {
+        var dpr = this.dpr;
+
+        this.domBack = createDom('back-' + this.id, this.painter, dpr);
+        this.ctxBack = this.domBack.getContext('2d');
+
+        if (dpr != 1) {
+            this.ctxBack.scale(dpr, dpr);
+        }
+    },
+
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     */
+    resize: function (width, height) {
+        var dpr = this.dpr;
+
+        var dom = this.dom;
+        var domStyle = dom.style;
+        var domBack = this.domBack;
+
+        if (domStyle) {
+            domStyle.width = width + 'px';
+            domStyle.height = height + 'px';
+        }
+
+        dom.width = width * dpr;
+        dom.height = height * dpr;
+
+        if (domBack) {
+            domBack.width = width * dpr;
+            domBack.height = height * dpr;
+
+            if (dpr != 1) {
+                this.ctxBack.scale(dpr, dpr);
+            }
+        }
+    },
+
+    /**
+     * 清空该层画布
+     * @param {boolean} [clearAll]=false Clear all with out motion blur
+     * @param {Color} [clearColor]
+     */
+    clear: function (clearAll, clearColor) {
+        var dom = this.dom;
+        var ctx = this.ctx;
+        var width = dom.width;
+        var height = dom.height;
+
+        var clearColor = clearColor || this.clearColor;
+        var haveMotionBLur = this.motionBlur && !clearAll;
+        var lastFrameAlpha = this.lastFrameAlpha;
+
+        var dpr = this.dpr;
+
+        if (haveMotionBLur) {
+            if (!this.domBack) {
+                this.createBackBuffer();
+            }
+
+            this.ctxBack.globalCompositeOperation = 'copy';
+            this.ctxBack.drawImage(
+                dom, 0, 0,
+                width / dpr,
+                height / dpr
+            );
+        }
+
+        ctx.clearRect(0, 0, width, height);
+        if (clearColor && clearColor !== 'transparent') {
+            var clearColorGradientOrPattern;
+            // Gradient
+            if (clearColor.colorStops) {
+                // Cache canvas gradient
+                clearColorGradientOrPattern = clearColor.__canvasGradient || Style.getGradient(ctx, clearColor, {
+                    x: 0,
+                    y: 0,
+                    width: width,
+                    height: height
+                });
+
+                clearColor.__canvasGradient = clearColorGradientOrPattern;
+            }
+            // Pattern
+            else if (clearColor.image) {
+                clearColorGradientOrPattern = Pattern.prototype.getCanvasPattern.call(clearColor, ctx);
+            }
+            ctx.save();
+            ctx.fillStyle = clearColorGradientOrPattern || clearColor;
+            ctx.fillRect(0, 0, width, height);
+            ctx.restore();
+        }
+
+        if (haveMotionBLur) {
+            var domBack = this.domBack;
+            ctx.save();
+            ctx.globalAlpha = lastFrameAlpha;
+            ctx.drawImage(domBack, 0, 0, width, height);
+            ctx.restore();
+        }
+    }
+};
+
+var requestAnimationFrame = (
+    typeof window !== 'undefined'
+    && (
+        (window.requestAnimationFrame && window.requestAnimationFrame.bind(window))
+        // https://github.com/ecomfe/zrender/issues/189#issuecomment-224919809
+        || (window.msRequestAnimationFrame && window.msRequestAnimationFrame.bind(window))
+        || window.mozRequestAnimationFrame
+        || window.webkitRequestAnimationFrame
+    )
+) || function (func) {
+    setTimeout(func, 16);
+};
+
+var globalImageCache = new LRU(50);
+
+/**
+ * @param {string|HTMLImageElement|HTMLCanvasElement|Canvas} newImageOrSrc
+ * @return {HTMLImageElement|HTMLCanvasElement|Canvas} image
+ */
+function findExistImage(newImageOrSrc) {
+    if (typeof newImageOrSrc === 'string') {
+        var cachedImgObj = globalImageCache.get(newImageOrSrc);
+        return cachedImgObj && cachedImgObj.image;
+    }
+    else {
+        return newImageOrSrc;
+    }
+}
+
+/**
+ * Caution: User should cache loaded images, but not just count on LRU.
+ * Consider if required images more than LRU size, will dead loop occur?
+ *
+ * @param {string|HTMLImageElement|HTMLCanvasElement|Canvas} newImageOrSrc
+ * @param {HTMLImageElement|HTMLCanvasElement|Canvas} image Existent image.
+ * @param {module:zrender/Element} [hostEl] For calling `dirty`.
+ * @param {Function} [cb] params: (image, cbPayload)
+ * @param {Object} [cbPayload] Payload on cb calling.
+ * @return {HTMLImageElement|HTMLCanvasElement|Canvas} image
+ */
+function createOrUpdateImage(newImageOrSrc, image, hostEl, cb, cbPayload) {
+    if (!newImageOrSrc) {
+        return image;
+    }
+    else if (typeof newImageOrSrc === 'string') {
+
+        // Image should not be loaded repeatly.
+        if ((image && image.__zrImageSrc === newImageOrSrc) || !hostEl) {
+            return image;
+        }
+
+        // Only when there is no existent image or existent image src
+        // is different, this method is responsible for load.
+        var cachedImgObj = globalImageCache.get(newImageOrSrc);
+
+        var pendingWrap = {hostEl: hostEl, cb: cb, cbPayload: cbPayload};
+
+        if (cachedImgObj) {
+            image = cachedImgObj.image;
+            !isImageReady(image) && cachedImgObj.pending.push(pendingWrap);
+        }
+        else {
+            !image && (image = new Image());
+            image.onload = imageOnLoad;
+
+            globalImageCache.put(
+                newImageOrSrc,
+                image.__cachedImgObj = {
+                    image: image,
+                    pending: [pendingWrap]
+                }
+            );
+
+            image.src = image.__zrImageSrc = newImageOrSrc;
+        }
+
+        return image;
+    }
+    // newImageOrSrc is an HTMLImageElement or HTMLCanvasElement or Canvas
+    else {
+        return newImageOrSrc;
+    }
+}
+
+function imageOnLoad() {
+    var cachedImgObj = this.__cachedImgObj;
+    this.onload = this.__cachedImgObj = null;
+
+    for (var i = 0; i < cachedImgObj.pending.length; i++) {
+        var pendingWrap = cachedImgObj.pending[i];
+        var cb = pendingWrap.cb;
+        cb && cb(this, pendingWrap.cbPayload);
+        pendingWrap.hostEl.dirty();
+    }
+    cachedImgObj.pending.length = 0;
+}
+
+function isImageReady(image) {
+    return image && image.width && image.height;
+}
+
+var textWidthCache = {};
+var textWidthCacheCounter = 0;
+
+var TEXT_CACHE_MAX = 5000;
+var STYLE_REG = /\{([a-zA-Z0-9_]+)\|([^}]*)\}/g;
+
+var DEFAULT_FONT = '12px sans-serif';
+
+// Avoid assign to an exported variable, for transforming to cjs.
+var methods$1 = {};
+
+function $override$1(name, fn) {
+    methods$1[name] = fn;
+}
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @return {number} width
+ */
+function getWidth(text, font) {
+    font = font || DEFAULT_FONT;
+    var key = text + ':' + font;
+    if (textWidthCache[key]) {
+        return textWidthCache[key];
+    }
+
+    var textLines = (text + '').split('\n');
+    var width = 0;
+
+    for (var i = 0, l = textLines.length; i < l; i++) {
+        // textContain.measureText may be overrided in SVG or VML
+        width = Math.max(measureText(textLines[i], font).width, width);
+    }
+
+    if (textWidthCacheCounter > TEXT_CACHE_MAX) {
+        textWidthCacheCounter = 0;
+        textWidthCache = {};
+    }
+    textWidthCacheCounter++;
+    textWidthCache[key] = width;
+
+    return width;
+}
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @param {string} [textAlign='left']
+ * @param {string} [textVerticalAlign='top']
+ * @param {Array.<number>} [textPadding]
+ * @param {Object} [rich]
+ * @param {Object} [truncate]
+ * @return {Object} {x, y, width, height, lineHeight}
+ */
+function getBoundingRect(text, font, textAlign, textVerticalAlign, textPadding, rich, truncate) {
+    return rich
+        ? getRichTextRect(text, font, textAlign, textVerticalAlign, textPadding, rich, truncate)
+        : getPlainTextRect(text, font, textAlign, textVerticalAlign, textPadding, truncate);
+}
+
+function getPlainTextRect(text, font, textAlign, textVerticalAlign, textPadding, truncate) {
+    var contentBlock = parsePlainText(text, font, textPadding, truncate);
+    var outerWidth = getWidth(text, font);
+    if (textPadding) {
+        outerWidth += textPadding[1] + textPadding[3];
+    }
+    var outerHeight = contentBlock.outerHeight;
+
+    var x = adjustTextX(0, outerWidth, textAlign);
+    var y = adjustTextY(0, outerHeight, textVerticalAlign);
+
+    var rect = new BoundingRect(x, y, outerWidth, outerHeight);
+    rect.lineHeight = contentBlock.lineHeight;
+
+    return rect;
+}
+
+function getRichTextRect(text, font, textAlign, textVerticalAlign, textPadding, rich, truncate) {
+    var contentBlock = parseRichText(text, {
+        rich: rich,
+        truncate: truncate,
+        font: font,
+        textAlign: textAlign,
+        textPadding: textPadding
+    });
+    var outerWidth = contentBlock.outerWidth;
+    var outerHeight = contentBlock.outerHeight;
+
+    var x = adjustTextX(0, outerWidth, textAlign);
+    var y = adjustTextY(0, outerHeight, textVerticalAlign);
+
+    return new BoundingRect(x, y, outerWidth, outerHeight);
+}
+
+/**
+ * @public
+ * @param {number} x
+ * @param {number} width
+ * @param {string} [textAlign='left']
+ * @return {number} Adjusted x.
+ */
+function adjustTextX(x, width, textAlign) {
+    // FIXME Right to left language
+    if (textAlign === 'right') {
+        x -= width;
+    }
+    else if (textAlign === 'center') {
+        x -= width / 2;
+    }
+    return x;
+}
+
+/**
+ * @public
+ * @param {number} y
+ * @param {number} height
+ * @param {string} [textVerticalAlign='top']
+ * @return {number} Adjusted y.
+ */
+function adjustTextY(y, height, textVerticalAlign) {
+    if (textVerticalAlign === 'middle') {
+        y -= height / 2;
+    }
+    else if (textVerticalAlign === 'bottom') {
+        y -= height;
+    }
+    return y;
+}
+
+/**
+ * @public
+ * @param {stirng} textPosition
+ * @param {Object} rect {x, y, width, height}
+ * @param {number} distance
+ * @return {Object} {x, y, textAlign, textVerticalAlign}
+ */
+function adjustTextPositionOnRect(textPosition, rect, distance) {
+
+    var x = rect.x;
+    var y = rect.y;
+
+    var height = rect.height;
+    var width = rect.width;
+    var halfHeight = height / 2;
+
+    var textAlign = 'left';
+    var textVerticalAlign = 'top';
+
+    switch (textPosition) {
+        case 'left':
+            x -= distance;
+            y += halfHeight;
+            textAlign = 'right';
+            textVerticalAlign = 'middle';
+            break;
+        case 'right':
+            x += distance + width;
+            y += halfHeight;
+            textVerticalAlign = 'middle';
+            break;
+        case 'top':
+            x += width / 2;
+            y -= distance;
+            textAlign = 'center';
+            textVerticalAlign = 'bottom';
+            break;
+        case 'bottom':
+            x += width / 2;
+            y += height + distance;
+            textAlign = 'center';
+            break;
+        case 'inside':
+            x += width / 2;
+            y += halfHeight;
+            textAlign = 'center';
+            textVerticalAlign = 'middle';
+            break;
+        case 'insideLeft':
+            x += distance;
+            y += halfHeight;
+            textVerticalAlign = 'middle';
+            break;
+        case 'insideRight':
+            x += width - distance;
+            y += halfHeight;
+            textAlign = 'right';
+            textVerticalAlign = 'middle';
+            break;
+        case 'insideTop':
+            x += width / 2;
+            y += distance;
+            textAlign = 'center';
+            break;
+        case 'insideBottom':
+            x += width / 2;
+            y += height - distance;
+            textAlign = 'center';
+            textVerticalAlign = 'bottom';
+            break;
+        case 'insideTopLeft':
+            x += distance;
+            y += distance;
+            break;
+        case 'insideTopRight':
+            x += width - distance;
+            y += distance;
+            textAlign = 'right';
+            break;
+        case 'insideBottomLeft':
+            x += distance;
+            y += height - distance;
+            textVerticalAlign = 'bottom';
+            break;
+        case 'insideBottomRight':
+            x += width - distance;
+            y += height - distance;
+            textAlign = 'right';
+            textVerticalAlign = 'bottom';
+            break;
+    }
+
+    return {
+        x: x,
+        y: y,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+}
+
+/**
+ * Show ellipsis if overflow.
+ *
+ * @public
+ * @param  {string} text
+ * @param  {string} containerWidth
+ * @param  {string} font
+ * @param  {number} [ellipsis='...']
+ * @param  {Object} [options]
+ * @param  {number} [options.maxIterations=3]
+ * @param  {number} [options.minChar=0] If truncate result are less
+ *                  then minChar, ellipsis will not show, which is
+ *                  better for user hint in some cases.
+ * @param  {number} [options.placeholder=''] When all truncated, use the placeholder.
+ * @return {string}
+ */
+function truncateText(text, containerWidth, font, ellipsis, options) {
+    if (!containerWidth) {
+        return '';
+    }
+
+    var textLines = (text + '').split('\n');
+    options = prepareTruncateOptions(containerWidth, font, ellipsis, options);
+
+    // FIXME
+    // It is not appropriate that every line has '...' when truncate multiple lines.
+    for (var i = 0, len = textLines.length; i < len; i++) {
+        textLines[i] = truncateSingleLine(textLines[i], options);
+    }
+
+    return textLines.join('\n');
+}
+
+function prepareTruncateOptions(containerWidth, font, ellipsis, options) {
+    options = extend({}, options);
+
+    options.font = font;
+    var ellipsis = retrieve2(ellipsis, '...');
+    options.maxIterations = retrieve2(options.maxIterations, 2);
+    var minChar = options.minChar = retrieve2(options.minChar, 0);
+    // FIXME
+    // Other languages?
+    options.cnCharWidth = getWidth('国', font);
+    // FIXME
+    // Consider proportional font?
+    var ascCharWidth = options.ascCharWidth = getWidth('a', font);
+    options.placeholder = retrieve2(options.placeholder, '');
+
+    // Example 1: minChar: 3, text: 'asdfzxcv', truncate result: 'asdf', but not: 'a...'.
+    // Example 2: minChar: 3, text: '维度', truncate result: '维', but not: '...'.
+    var contentWidth = containerWidth = Math.max(0, containerWidth - 1); // Reserve some gap.
+    for (var i = 0; i < minChar && contentWidth >= ascCharWidth; i++) {
+        contentWidth -= ascCharWidth;
+    }
+
+    var ellipsisWidth = getWidth(ellipsis);
+    if (ellipsisWidth > contentWidth) {
+        ellipsis = '';
+        ellipsisWidth = 0;
+    }
+
+    contentWidth = containerWidth - ellipsisWidth;
+
+    options.ellipsis = ellipsis;
+    options.ellipsisWidth = ellipsisWidth;
+    options.contentWidth = contentWidth;
+    options.containerWidth = containerWidth;
+
+    return options;
+}
+
+function truncateSingleLine(textLine, options) {
+    var containerWidth = options.containerWidth;
+    var font = options.font;
+    var contentWidth = options.contentWidth;
+
+    if (!containerWidth) {
+        return '';
+    }
+
+    var lineWidth = getWidth(textLine, font);
+
+    if (lineWidth <= containerWidth) {
+        return textLine;
+    }
+
+    for (var j = 0;; j++) {
+        if (lineWidth <= contentWidth || j >= options.maxIterations) {
+            textLine += options.ellipsis;
+            break;
+        }
+
+        var subLength = j === 0
+            ? estimateLength(textLine, contentWidth, options.ascCharWidth, options.cnCharWidth)
+            : lineWidth > 0
+            ? Math.floor(textLine.length * contentWidth / lineWidth)
+            : 0;
+
+        textLine = textLine.substr(0, subLength);
+        lineWidth = getWidth(textLine, font);
+    }
+
+    if (textLine === '') {
+        textLine = options.placeholder;
+    }
+
+    return textLine;
+}
+
+function estimateLength(text, contentWidth, ascCharWidth, cnCharWidth) {
+    var width = 0;
+    var i = 0;
+    for (var len = text.length; i < len && width < contentWidth; i++) {
+        var charCode = text.charCodeAt(i);
+        width += (0 <= charCode && charCode <= 127) ? ascCharWidth : cnCharWidth;
+    }
+    return i;
+}
+
+/**
+ * @public
+ * @param {string} font
+ * @return {number} line height
+ */
+function getLineHeight(font) {
+    // FIXME A rough approach.
+    return getWidth('国', font);
+}
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @return {Object} width
+ */
+function measureText(text, font) {
+    return methods$1.measureText(text, font);
+}
+
+// Avoid assign to an exported variable, for transforming to cjs.
+methods$1.measureText = function (text, font) {
+    var ctx = getContext();
+    ctx.font = font || DEFAULT_FONT;
+    return ctx.measureText(text);
+};
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @param {Object} [truncate]
+ * @return {Object} block: {lineHeight, lines, height, outerHeight}
+ *  Notice: for performance, do not calculate outerWidth util needed.
+ */
+function parsePlainText(text, font, padding, truncate) {
+    text != null && (text += '');
+
+    var lineHeight = getLineHeight(font);
+    var lines = text ? text.split('\n') : [];
+    var height = lines.length * lineHeight;
+    var outerHeight = height;
+
+    if (padding) {
+        outerHeight += padding[0] + padding[2];
+    }
+
+    if (text && truncate) {
+        var truncOuterHeight = truncate.outerHeight;
+        var truncOuterWidth = truncate.outerWidth;
+        if (truncOuterHeight != null && outerHeight > truncOuterHeight) {
+            text = '';
+            lines = [];
+        }
+        else if (truncOuterWidth != null) {
+            var options = prepareTruncateOptions(
+                truncOuterWidth - (padding ? padding[1] + padding[3] : 0),
+                font,
+                truncate.ellipsis,
+                {minChar: truncate.minChar, placeholder: truncate.placeholder}
+            );
+
+            // FIXME
+            // It is not appropriate that every line has '...' when truncate multiple lines.
+            for (var i = 0, len = lines.length; i < len; i++) {
+                lines[i] = truncateSingleLine(lines[i], options);
+            }
+        }
+    }
+
+    return {
+        lines: lines,
+        height: height,
+        outerHeight: outerHeight,
+        lineHeight: lineHeight
+    };
+}
+
+/**
+ * For example: 'some text {a|some text}other text{b|some text}xxx{c|}xxx'
+ * Also consider 'bbbb{a|xxx\nzzz}xxxx\naaaa'.
+ *
+ * @public
+ * @param {string} text
+ * @param {Object} style
+ * @return {Object} block
+ * {
+ *      width,
+ *      height,
+ *      lines: [{
+ *          lineHeight,
+ *          width,
+ *          tokens: [[{
+ *              styleName,
+ *              text,
+ *              width,      // include textPadding
+ *              height,     // include textPadding
+ *              textWidth, // pure text width
+ *              textHeight, // pure text height
+ *              lineHeihgt,
+ *              font,
+ *              textAlign,
+ *              textVerticalAlign
+ *          }], [...], ...]
+ *      }, ...]
+ * }
+ * If styleName is undefined, it is plain text.
+ */
+function parseRichText(text, style) {
+    var contentBlock = {lines: [], width: 0, height: 0};
+
+    text != null && (text += '');
+    if (!text) {
+        return contentBlock;
+    }
+
+    var lastIndex = STYLE_REG.lastIndex = 0;
+    var result;
+    while ((result = STYLE_REG.exec(text)) != null) {
+        var matchedIndex = result.index;
+        if (matchedIndex > lastIndex) {
+            pushTokens(contentBlock, text.substring(lastIndex, matchedIndex));
+        }
+        pushTokens(contentBlock, result[2], result[1]);
+        lastIndex = STYLE_REG.lastIndex;
+    }
+
+    if (lastIndex < text.length) {
+        pushTokens(contentBlock, text.substring(lastIndex, text.length));
+    }
+
+    var lines = contentBlock.lines;
+    var contentHeight = 0;
+    var contentWidth = 0;
+    // For `textWidth: 100%`
+    var pendingList = [];
+
+    var stlPadding = style.textPadding;
+
+    var truncate = style.truncate;
+    var truncateWidth = truncate && truncate.outerWidth;
+    var truncateHeight = truncate && truncate.outerHeight;
+    if (stlPadding) {
+        truncateWidth != null && (truncateWidth -= stlPadding[1] + stlPadding[3]);
+        truncateHeight != null && (truncateHeight -= stlPadding[0] + stlPadding[2]);
+    }
+
+    // Calculate layout info of tokens.
+    for (var i = 0; i < lines.length; i++) {
+        var line = lines[i];
+        var lineHeight = 0;
+        var lineWidth = 0;
+
+        for (var j = 0; j < line.tokens.length; j++) {
+            var token = line.tokens[j];
+            var tokenStyle = token.styleName && style.rich[token.styleName] || {};
+            // textPadding should not inherit from style.
+            var textPadding = token.textPadding = tokenStyle.textPadding;
+
+            // textFont has been asigned to font by `normalizeStyle`.
+            var font = token.font = tokenStyle.font || style.font;
+
+            // textHeight can be used when textVerticalAlign is specified in token.
+            var tokenHeight = token.textHeight = retrieve2(
+                // textHeight should not be inherited, consider it can be specified
+                // as box height of the block.
+                tokenStyle.textHeight, getLineHeight(font)
+            );
+            textPadding && (tokenHeight += textPadding[0] + textPadding[2]);
+            token.height = tokenHeight;
+            token.lineHeight = retrieve3(
+                tokenStyle.textLineHeight, style.textLineHeight, tokenHeight
+            );
+
+            token.textAlign = tokenStyle && tokenStyle.textAlign || style.textAlign;
+            token.textVerticalAlign = tokenStyle && tokenStyle.textVerticalAlign || 'middle';
+
+            if (truncateHeight != null && contentHeight + token.lineHeight > truncateHeight) {
+                return {lines: [], width: 0, height: 0};
+            }
+
+            token.textWidth = getWidth(token.text, font);
+            var tokenWidth = tokenStyle.textWidth;
+            var tokenWidthNotSpecified = tokenWidth == null || tokenWidth === 'auto';
+
+            // Percent width, can be `100%`, can be used in drawing separate
+            // line when box width is needed to be auto.
+            if (typeof tokenWidth === 'string' && tokenWidth.charAt(tokenWidth.length - 1) === '%') {
+                token.percentWidth = tokenWidth;
+                pendingList.push(token);
+                tokenWidth = 0;
+                // Do not truncate in this case, because there is no user case
+                // and it is too complicated.
+            }
+            else {
+                if (tokenWidthNotSpecified) {
+                    tokenWidth = token.textWidth;
+
+                    // FIXME: If image is not loaded and textWidth is not specified, calling
+                    // `getBoundingRect()` will not get correct result.
+                    var textBackgroundColor = tokenStyle.textBackgroundColor;
+                    var bgImg = textBackgroundColor && textBackgroundColor.image;
+
+                    // Use cases:
+                    // (1) If image is not loaded, it will be loaded at render phase and call
+                    // `dirty()` and `textBackgroundColor.image` will be replaced with the loaded
+                    // image, and then the right size will be calculated here at the next tick.
+                    // See `graphic/helper/text.js`.
+                    // (2) If image loaded, and `textBackgroundColor.image` is image src string,
+                    // use `imageHelper.findExistImage` to find cached image.
+                    // `imageHelper.findExistImage` will always be called here before
+                    // `imageHelper.createOrUpdateImage` in `graphic/helper/text.js#renderRichText`
+                    // which ensures that image will not be rendered before correct size calcualted.
+                    if (bgImg) {
+                        bgImg = findExistImage(bgImg);
+                        if (isImageReady(bgImg)) {
+                            tokenWidth = Math.max(tokenWidth, bgImg.width * tokenHeight / bgImg.height);
+                        }
+                    }
+                }
+
+                var paddingW = textPadding ? textPadding[1] + textPadding[3] : 0;
+                tokenWidth += paddingW;
+
+                var remianTruncWidth = truncateWidth != null ? truncateWidth - lineWidth : null;
+
+                if (remianTruncWidth != null && remianTruncWidth < tokenWidth) {
+                    if (!tokenWidthNotSpecified || remianTruncWidth < paddingW) {
+                        token.text = '';
+                        token.textWidth = tokenWidth = 0;
+                    }
+                    else {
+                        token.text = truncateText(
+                            token.text, remianTruncWidth - paddingW, font, truncate.ellipsis,
+                            {minChar: truncate.minChar}
+                        );
+                        token.textWidth = getWidth(token.text, font);
+                        tokenWidth = token.textWidth + paddingW;
+                    }
+                }
+            }
+
+            lineWidth += (token.width = tokenWidth);
+            tokenStyle && (lineHeight = Math.max(lineHeight, token.lineHeight));
+        }
+
+        line.width = lineWidth;
+        line.lineHeight = lineHeight;
+        contentHeight += lineHeight;
+        contentWidth = Math.max(contentWidth, lineWidth);
+    }
+
+    contentBlock.outerWidth = contentBlock.width = retrieve2(style.textWidth, contentWidth);
+    contentBlock.outerHeight = contentBlock.height = retrieve2(style.textHeight, contentHeight);
+
+    if (stlPadding) {
+        contentBlock.outerWidth += stlPadding[1] + stlPadding[3];
+        contentBlock.outerHeight += stlPadding[0] + stlPadding[2];
+    }
+
+    for (var i = 0; i < pendingList.length; i++) {
+        var token = pendingList[i];
+        var percentWidth = token.percentWidth;
+        // Should not base on outerWidth, because token can not be placed out of padding.
+        token.width = parseInt(percentWidth, 10) / 100 * contentWidth;
+    }
+
+    return contentBlock;
+}
+
+function pushTokens(block, str, styleName) {
+    var isEmptyStr = str === '';
+    var strs = str.split('\n');
+    var lines = block.lines;
+
+    for (var i = 0; i < strs.length; i++) {
+        var text = strs[i];
+        var token = {
+            styleName: styleName,
+            text: text,
+            isLineHolder: !text && !isEmptyStr
+        };
+
+        // The first token should be appended to the last line.
+        if (!i) {
+            var tokens = (lines[lines.length - 1] || (lines[0] = {tokens: []})).tokens;
+
+            // Consider cases:
+            // (1) ''.split('\n') => ['', '\n', ''], the '' at the first item
+            // (which is a placeholder) should be replaced by new token.
+            // (2) A image backage, where token likes {a|}.
+            // (3) A redundant '' will affect textAlign in line.
+            // (4) tokens with the same tplName should not be merged, because
+            // they should be displayed in different box (with border and padding).
+            var tokensLen = tokens.length;
+            (tokensLen === 1 && tokens[0].isLineHolder)
+                ? (tokens[0] = token)
+                // Consider text is '', only insert when it is the "lineHolder" or
+                // "emptyStr". Otherwise a redundant '' will affect textAlign in line.
+                : ((text || !tokensLen || isEmptyStr) && tokens.push(token));
+        }
+        // Other tokens always start a new line.
+        else {
+            // If there is '', insert it as a placeholder.
+            lines.push({tokens: [token]});
+        }
+    }
+}
+
+function makeFont(style) {
+    // FIXME in node-canvas fontWeight is before fontStyle
+    // Use `fontSize` `fontFamily` to check whether font properties are defined.
+    var font = (style.fontSize || style.fontFamily) && [
+        style.fontStyle,
+        style.fontWeight,
+        (style.fontSize || 12) + 'px',
+        // If font properties are defined, `fontFamily` should not be ignored.
+        style.fontFamily || 'sans-serif'
+    ].join(' ');
+    return font && trim(font) || style.textFont || style.font;
+}
+
+function buildPath(ctx, shape) {
+    var x = shape.x;
+    var y = shape.y;
+    var width = shape.width;
+    var height = shape.height;
+    var r = shape.r;
+    var r1;
+    var r2;
+    var r3;
+    var r4;
+
+    // Convert width and height to positive for better borderRadius
+    if (width < 0) {
+        x = x + width;
+        width = -width;
+    }
+    if (height < 0) {
+        y = y + height;
+        height = -height;
+    }
+
+    if (typeof r === 'number') {
+        r1 = r2 = r3 = r4 = r;
+    }
+    else if (r instanceof Array) {
+        if (r.length === 1) {
+            r1 = r2 = r3 = r4 = r[0];
+        }
+        else if (r.length === 2) {
+            r1 = r3 = r[0];
+            r2 = r4 = r[1];
+        }
+        else if (r.length === 3) {
+            r1 = r[0];
+            r2 = r4 = r[1];
+            r3 = r[2];
+        }
+        else {
+            r1 = r[0];
+            r2 = r[1];
+            r3 = r[2];
+            r4 = r[3];
+        }
+    }
+    else {
+        r1 = r2 = r3 = r4 = 0;
+    }
+
+    var total;
+    if (r1 + r2 > width) {
+        total = r1 + r2;
+        r1 *= width / total;
+        r2 *= width / total;
+    }
+    if (r3 + r4 > width) {
+        total = r3 + r4;
+        r3 *= width / total;
+        r4 *= width / total;
+    }
+    if (r2 + r3 > height) {
+        total = r2 + r3;
+        r2 *= height / total;
+        r3 *= height / total;
+    }
+    if (r1 + r4 > height) {
+        total = r1 + r4;
+        r1 *= height / total;
+        r4 *= height / total;
+    }
+    ctx.moveTo(x + r1, y);
+    ctx.lineTo(x + width - r2, y);
+    r2 !== 0 && ctx.arc(x + width - r2, y + r2, r2, -Math.PI / 2, 0);
+    ctx.lineTo(x + width, y + height - r3);
+    r3 !== 0 && ctx.arc(x + width - r3, y + height - r3, r3, 0, Math.PI / 2);
+    ctx.lineTo(x + r4, y + height);
+    r4 !== 0 && ctx.arc(x + r4, y + height - r4, r4, Math.PI / 2, Math.PI);
+    ctx.lineTo(x, y + r1);
+    r1 !== 0 && ctx.arc(x + r1, y + r1, r1, Math.PI, Math.PI * 1.5);
+}
+
+// TODO: Have not support 'start', 'end' yet.
+var VALID_TEXT_ALIGN = {left: 1, right: 1, center: 1};
+var VALID_TEXT_VERTICAL_ALIGN = {top: 1, bottom: 1, middle: 1};
+
+/**
+ * @param {module:zrender/graphic/Style} style
+ * @return {module:zrender/graphic/Style} The input style.
+ */
+function normalizeTextStyle(style) {
+    normalizeStyle(style);
+    each$1(style.rich, normalizeStyle);
+    return style;
+}
+
+function normalizeStyle(style) {
+    if (style) {
+
+        style.font = makeFont(style);
+
+        var textAlign = style.textAlign;
+        textAlign === 'middle' && (textAlign = 'center');
+        style.textAlign = (
+            textAlign == null || VALID_TEXT_ALIGN[textAlign]
+        ) ? textAlign : 'left';
+
+        // Compatible with textBaseline.
+        var textVerticalAlign = style.textVerticalAlign || style.textBaseline;
+        textVerticalAlign === 'center' && (textVerticalAlign = 'middle');
+        style.textVerticalAlign = (
+            textVerticalAlign == null || VALID_TEXT_VERTICAL_ALIGN[textVerticalAlign]
+        ) ? textVerticalAlign : 'top';
+
+        var textPadding = style.textPadding;
+        if (textPadding) {
+            style.textPadding = normalizeCssArray(style.textPadding);
+        }
+    }
+}
+
+/**
+ * @param {CanvasRenderingContext2D} ctx
+ * @param {string} text
+ * @param {module:zrender/graphic/Style} style
+ * @param {Object|boolean} [rect] {x, y, width, height}
+ *                  If set false, rect text is not used.
+ */
+function renderText(hostEl, ctx, text, style, rect) {
+    style.rich
+        ? renderRichText(hostEl, ctx, text, style, rect)
+        : renderPlainText(hostEl, ctx, text, style, rect);
+}
+
+function renderPlainText(hostEl, ctx, text, style, rect) {
+    var font = setCtx(ctx, 'font', style.font || DEFAULT_FONT);
+
+    var textPadding = style.textPadding;
+
+    var contentBlock = hostEl.__textCotentBlock;
+    if (!contentBlock || hostEl.__dirty) {
+        contentBlock = hostEl.__textCotentBlock = parsePlainText(
+            text, font, textPadding, style.truncate
+        );
+    }
+
+    var outerHeight = contentBlock.outerHeight;
+
+    var textLines = contentBlock.lines;
+    var lineHeight = contentBlock.lineHeight;
+
+    var boxPos = getBoxPosition(outerHeight, style, rect);
+    var baseX = boxPos.baseX;
+    var baseY = boxPos.baseY;
+    var textAlign = boxPos.textAlign;
+    var textVerticalAlign = boxPos.textVerticalAlign;
+
+    // Origin of textRotation should be the base point of text drawing.
+    applyTextRotation(ctx, style, rect, baseX, baseY);
+
+    var boxY = adjustTextY(baseY, outerHeight, textVerticalAlign);
+    var textX = baseX;
+    var textY = boxY;
+
+    var needDrawBg = needDrawBackground(style);
+    if (needDrawBg || textPadding) {
+        // Consider performance, do not call getTextWidth util necessary.
+        var textWidth = getWidth(text, font);
+        var outerWidth = textWidth;
+        textPadding && (outerWidth += textPadding[1] + textPadding[3]);
+        var boxX = adjustTextX(baseX, outerWidth, textAlign);
+
+        needDrawBg && drawBackground(hostEl, ctx, style, boxX, boxY, outerWidth, outerHeight);
+
+        if (textPadding) {
+            textX = getTextXForPadding(baseX, textAlign, textPadding);
+            textY += textPadding[0];
+        }
+    }
+
+    setCtx(ctx, 'textAlign', textAlign || 'left');
+    // Force baseline to be "middle". Otherwise, if using "top", the
+    // text will offset downward a little bit in font "Microsoft YaHei".
+    setCtx(ctx, 'textBaseline', 'middle');
+
+    // Always set shadowBlur and shadowOffset to avoid leak from displayable.
+    setCtx(ctx, 'shadowBlur', style.textShadowBlur || 0);
+    setCtx(ctx, 'shadowColor', style.textShadowColor || 'transparent');
+    setCtx(ctx, 'shadowOffsetX', style.textShadowOffsetX || 0);
+    setCtx(ctx, 'shadowOffsetY', style.textShadowOffsetY || 0);
+
+    // `textBaseline` is set as 'middle'.
+    textY += lineHeight / 2;
+
+    var textStrokeWidth = style.textStrokeWidth;
+    var textStroke = getStroke(style.textStroke, textStrokeWidth);
+    var textFill = getFill(style.textFill);
+
+    if (textStroke) {
+        setCtx(ctx, 'lineWidth', textStrokeWidth);
+        setCtx(ctx, 'strokeStyle', textStroke);
+    }
+    if (textFill) {
+        setCtx(ctx, 'fillStyle', textFill);
+    }
+
+    for (var i = 0; i < textLines.length; i++) {
+        // Fill after stroke so the outline will not cover the main part.
+        textStroke && ctx.strokeText(textLines[i], textX, textY);
+        textFill && ctx.fillText(textLines[i], textX, textY);
+        textY += lineHeight;
+    }
+}
+
+function renderRichText(hostEl, ctx, text, style, rect) {
+    var contentBlock = hostEl.__textCotentBlock;
+
+    if (!contentBlock || hostEl.__dirty) {
+        contentBlock = hostEl.__textCotentBlock = parseRichText(text, style);
+    }
+
+    drawRichText(hostEl, ctx, contentBlock, style, rect);
+}
+
+function drawRichText(hostEl, ctx, contentBlock, style, rect) {
+    var contentWidth = contentBlock.width;
+    var outerWidth = contentBlock.outerWidth;
+    var outerHeight = contentBlock.outerHeight;
+    var textPadding = style.textPadding;
+
+    var boxPos = getBoxPosition(outerHeight, style, rect);
+    var baseX = boxPos.baseX;
+    var baseY = boxPos.baseY;
+    var textAlign = boxPos.textAlign;
+    var textVerticalAlign = boxPos.textVerticalAlign;
+
+    // Origin of textRotation should be the base point of text drawing.
+    applyTextRotation(ctx, style, rect, baseX, baseY);
+
+    var boxX = adjustTextX(baseX, outerWidth, textAlign);
+    var boxY = adjustTextY(baseY, outerHeight, textVerticalAlign);
+    var xLeft = boxX;
+    var lineTop = boxY;
+    if (textPadding) {
+        xLeft += textPadding[3];
+        lineTop += textPadding[0];
+    }
+    var xRight = xLeft + contentWidth;
+
+    needDrawBackground(style) && drawBackground(
+        hostEl, ctx, style, boxX, boxY, outerWidth, outerHeight
+    );
+
+    for (var i = 0; i < contentBlock.lines.length; i++) {
+        var line = contentBlock.lines[i];
+        var tokens = line.tokens;
+        var tokenCount = tokens.length;
+        var lineHeight = line.lineHeight;
+        var usedWidth = line.width;
+
+        var leftIndex = 0;
+        var lineXLeft = xLeft;
+        var lineXRight = xRight;
+        var rightIndex = tokenCount - 1;
+        var token;
+
+        while (
+            leftIndex < tokenCount
+            && (token = tokens[leftIndex], !token.textAlign || token.textAlign === 'left')
+        ) {
+            placeToken(hostEl, ctx, token, style, lineHeight, lineTop, lineXLeft, 'left');
+            usedWidth -= token.width;
+            lineXLeft += token.width;
+            leftIndex++;
+        }
+
+        while (
+            rightIndex >= 0
+            && (token = tokens[rightIndex], token.textAlign === 'right')
+        ) {
+            placeToken(hostEl, ctx, token, style, lineHeight, lineTop, lineXRight, 'right');
+            usedWidth -= token.width;
+            lineXRight -= token.width;
+            rightIndex--;
+        }
+
+        // The other tokens are placed as textAlign 'center' if there is enough space.
+        lineXLeft += (contentWidth - (lineXLeft - xLeft) - (xRight - lineXRight) - usedWidth) / 2;
+        while (leftIndex <= rightIndex) {
+            token = tokens[leftIndex];
+            // Consider width specified by user, use 'center' rather than 'left'.
+            placeToken(hostEl, ctx, token, style, lineHeight, lineTop, lineXLeft + token.width / 2, 'center');
+            lineXLeft += token.width;
+            leftIndex++;
+        }
+
+        lineTop += lineHeight;
+    }
+}
+
+function applyTextRotation(ctx, style, rect, x, y) {
+    // textRotation only apply in RectText.
+    if (rect && style.textRotation) {
+        var origin = style.textOrigin;
+        if (origin === 'center') {
+            x = rect.width / 2 + rect.x;
+            y = rect.height / 2 + rect.y;
+        }
+        else if (origin) {
+            x = origin[0] + rect.x;
+            y = origin[1] + rect.y;
+        }
+
+        ctx.translate(x, y);
+        // Positive: anticlockwise
+        ctx.rotate(-style.textRotation);
+        ctx.translate(-x, -y);
+    }
+}
+
+function placeToken(hostEl, ctx, token, style, lineHeight, lineTop, x, textAlign) {
+    var tokenStyle = style.rich[token.styleName] || {};
+
+    // 'ctx.textBaseline' is always set as 'middle', for sake of
+    // the bias of "Microsoft YaHei".
+    var textVerticalAlign = token.textVerticalAlign;
+    var y = lineTop + lineHeight / 2;
+    if (textVerticalAlign === 'top') {
+        y = lineTop + token.height / 2;
+    }
+    else if (textVerticalAlign === 'bottom') {
+        y = lineTop + lineHeight - token.height / 2;
+    }
+
+    !token.isLineHolder && needDrawBackground(tokenStyle) && drawBackground(
+        hostEl,
+        ctx,
+        tokenStyle,
+        textAlign === 'right'
+            ? x - token.width
+            : textAlign === 'center'
+            ? x - token.width / 2
+            : x,
+        y - token.height / 2,
+        token.width,
+        token.height
+    );
+
+    var textPadding = token.textPadding;
+    if (textPadding) {
+        x = getTextXForPadding(x, textAlign, textPadding);
+        y -= token.height / 2 - textPadding[2] - token.textHeight / 2;
+    }
+
+    setCtx(ctx, 'shadowBlur', retrieve3(tokenStyle.textShadowBlur, style.textShadowBlur, 0));
+    setCtx(ctx, 'shadowColor', tokenStyle.textShadowColor || style.textShadowColor || 'transparent');
+    setCtx(ctx, 'shadowOffsetX', retrieve3(tokenStyle.textShadowOffsetX, style.textShadowOffsetX, 0));
+    setCtx(ctx, 'shadowOffsetY', retrieve3(tokenStyle.textShadowOffsetY, style.textShadowOffsetY, 0));
+
+    setCtx(ctx, 'textAlign', textAlign);
+    // Force baseline to be "middle". Otherwise, if using "top", the
+    // text will offset downward a little bit in font "Microsoft YaHei".
+    setCtx(ctx, 'textBaseline', 'middle');
+
+    setCtx(ctx, 'font', token.font || DEFAULT_FONT);
+
+    var textStroke = getStroke(tokenStyle.textStroke || style.textStroke, textStrokeWidth);
+    var textFill = getFill(tokenStyle.textFill || style.textFill);
+    var textStrokeWidth = retrieve2(tokenStyle.textStrokeWidth, style.textStrokeWidth);
+
+    // Fill after stroke so the outline will not cover the main part.
+    if (textStroke) {
+        setCtx(ctx, 'lineWidth', textStrokeWidth);
+        setCtx(ctx, 'strokeStyle', textStroke);
+        ctx.strokeText(token.text, x, y);
+    }
+    if (textFill) {
+        setCtx(ctx, 'fillStyle', textFill);
+        ctx.fillText(token.text, x, y);
+    }
+}
+
+function needDrawBackground(style) {
+    return style.textBackgroundColor
+        || (style.textBorderWidth && style.textBorderColor);
+}
+
+// style: {textBackgroundColor, textBorderWidth, textBorderColor, textBorderRadius}
+// shape: {x, y, width, height}
+function drawBackground(hostEl, ctx, style, x, y, width, height) {
+    var textBackgroundColor = style.textBackgroundColor;
+    var textBorderWidth = style.textBorderWidth;
+    var textBorderColor = style.textBorderColor;
+    var isPlainBg = isString(textBackgroundColor);
+
+    setCtx(ctx, 'shadowBlur', style.textBoxShadowBlur || 0);
+    setCtx(ctx, 'shadowColor', style.textBoxShadowColor || 'transparent');
+    setCtx(ctx, 'shadowOffsetX', style.textBoxShadowOffsetX || 0);
+    setCtx(ctx, 'shadowOffsetY', style.textBoxShadowOffsetY || 0);
+
+    if (isPlainBg || (textBorderWidth && textBorderColor)) {
+        ctx.beginPath();
+        var textBorderRadius = style.textBorderRadius;
+        if (!textBorderRadius) {
+            ctx.rect(x, y, width, height);
+        }
+        else {
+            buildPath(ctx, {
+                x: x, y: y, width: width, height: height, r: textBorderRadius
+            });
+        }
+        ctx.closePath();
+    }
+
+    if (isPlainBg) {
+        setCtx(ctx, 'fillStyle', textBackgroundColor);
+        ctx.fill();
+    }
+    else if (isObject$1(textBackgroundColor)) {
+        var image = textBackgroundColor.image;
+
+        image = createOrUpdateImage(
+            image, null, hostEl, onBgImageLoaded, textBackgroundColor
+        );
+        if (image && isImageReady(image)) {
+            ctx.drawImage(image, x, y, width, height);
+        }
+    }
+
+    if (textBorderWidth && textBorderColor) {
+        setCtx(ctx, 'lineWidth', textBorderWidth);
+        setCtx(ctx, 'strokeStyle', textBorderColor);
+        ctx.stroke();
+    }
+}
+
+function onBgImageLoaded(image, textBackgroundColor) {
+    // Replace image, so that `contain/text.js#parseRichText`
+    // will get correct result in next tick.
+    textBackgroundColor.image = image;
+}
+
+function getBoxPosition(blockHeiht, style, rect) {
+    var baseX = style.x || 0;
+    var baseY = style.y || 0;
+    var textAlign = style.textAlign;
+    var textVerticalAlign = style.textVerticalAlign;
+
+    // Text position represented by coord
+    if (rect) {
+        var textPosition = style.textPosition;
+        if (textPosition instanceof Array) {
+            // Percent
+            baseX = rect.x + parsePercent(textPosition[0], rect.width);
+            baseY = rect.y + parsePercent(textPosition[1], rect.height);
+        }
+        else {
+            var res = adjustTextPositionOnRect(
+                textPosition, rect, style.textDistance
+            );
+            baseX = res.x;
+            baseY = res.y;
+            // Default align and baseline when has textPosition
+            textAlign = textAlign || res.textAlign;
+            textVerticalAlign = textVerticalAlign || res.textVerticalAlign;
+        }
+
+        // textOffset is only support in RectText, otherwise
+        // we have to adjust boundingRect for textOffset.
+        var textOffset = style.textOffset;
+        if (textOffset) {
+            baseX += textOffset[0];
+            baseY += textOffset[1];
+        }
+    }
+
+    return {
+        baseX: baseX,
+        baseY: baseY,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+}
+
+function setCtx(ctx, prop, value) {
+    ctx[prop] = fixShadow(ctx, prop, value);
+    return ctx[prop];
+}
+
+/**
+ * @param {string} [stroke] If specified, do not check style.textStroke.
+ * @param {string} [lineWidth] If specified, do not check style.textStroke.
+ * @param {number} style
+ */
+function getStroke(stroke, lineWidth) {
+    return (stroke == null || lineWidth <= 0 || stroke === 'transparent' || stroke === 'none')
+        ? null
+        // TODO pattern and gradient?
+        : (stroke.image || stroke.colorStops)
+        ? '#000'
+        : stroke;
+}
+
+function getFill(fill) {
+    return (fill == null || fill === 'none')
+        ? null
+        // TODO pattern and gradient?
+        : (fill.image || fill.colorStops)
+        ? '#000'
+        : fill;
+}
+
+function parsePercent(value, maxValue) {
+    if (typeof value === 'string') {
+        if (value.lastIndexOf('%') >= 0) {
+            return parseFloat(value) / 100 * maxValue;
+        }
+        return parseFloat(value);
+    }
+    return value;
+}
+
+function getTextXForPadding(x, textAlign, textPadding) {
+    return textAlign === 'right'
+        ? (x - textPadding[1])
+        : textAlign === 'center'
+        ? (x + textPadding[3] / 2 - textPadding[1] / 2)
+        : (x + textPadding[3]);
+}
+
+/**
+ * @param {string} text
+ * @param {module:zrender/Style} style
+ * @return {boolean}
+ */
+function needDrawText(text, style) {
+    return text != null
+        && (text
+            || style.textBackgroundColor
+            || (style.textBorderWidth && style.textBorderColor)
+            || style.textPadding
+        );
+}
+
+/**
+ * Mixin for drawing text in a element bounding rect
+ * @module zrender/mixin/RectText
+ */
+
+var tmpRect$1 = new BoundingRect();
+
+var RectText = function () {};
+
+RectText.prototype = {
+
+    constructor: RectText,
+
+    /**
+     * Draw text in a rect with specified position.
+     * @param  {CanvasRenderingContext2D} ctx
+     * @param  {Object} rect Displayable rect
+     */
+    drawRectText: function (ctx, rect) {
+        var style = this.style;
+
+        rect = style.textRect || rect;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        var text = style.text;
+
+        // Convert to string
+        text != null && (text += '');
+
+        if (!needDrawText(text, style)) {
+            return;
+        }
+
+        // FIXME
+        ctx.save();
+
+        // Transform rect to view space
+        var transform = this.transform;
+        if (!style.transformText) {
+            if (transform) {
+                tmpRect$1.copy(rect);
+                tmpRect$1.applyTransform(transform);
+                rect = tmpRect$1;
+            }
+        }
+        else {
+            this.setTransform(ctx);
+        }
+
+        // transformText and textRotation can not be used at the same time.
+        renderText(this, ctx, text, style, rect);
+
+        ctx.restore();
+    }
+};
+
+/**
+ * 可绘制的图形基类
+ * Base class of all displayable graphic objects
+ * @module zrender/graphic/Displayable
+ */
+
+
+/**
+ * @alias module:zrender/graphic/Displayable
+ * @extends module:zrender/Element
+ * @extends module:zrender/graphic/mixin/RectText
+ */
+function Displayable(opts) {
+
+    opts = opts || {};
+
+    Element.call(this, opts);
+
+    // Extend properties
+    for (var name in opts) {
+        if (
+            opts.hasOwnProperty(name) &&
+            name !== 'style'
+        ) {
+            this[name] = opts[name];
+        }
+    }
+
+    /**
+     * @type {module:zrender/graphic/Style}
+     */
+    this.style = new Style(opts.style, this);
+
+    this._rect = null;
+    // Shapes for cascade clipping.
+    this.__clipPaths = [];
+
+    // FIXME Stateful must be mixined after style is setted
+    // Stateful.call(this, opts);
+}
+
+Displayable.prototype = {
+
+    constructor: Displayable,
+
+    type: 'displayable',
+
+    /**
+     * Displayable 是否为脏，Painter 中会根据该标记判断是否需要是否需要重新绘制
+     * Dirty flag. From which painter will determine if this displayable object needs brush
+     * @name module:zrender/graphic/Displayable#__dirty
+     * @type {boolean}
+     */
+    __dirty: true,
+
+    /**
+     * 图形是否可见，为true时不绘制图形，但是仍能触发鼠标事件
+     * If ignore drawing of the displayable object. Mouse event will still be triggered
+     * @name module:/zrender/graphic/Displayable#invisible
+     * @type {boolean}
+     * @default false
+     */
+    invisible: false,
+
+    /**
+     * @name module:/zrender/graphic/Displayable#z
+     * @type {number}
+     * @default 0
+     */
+    z: 0,
+
+    /**
+     * @name module:/zrender/graphic/Displayable#z
+     * @type {number}
+     * @default 0
+     */
+    z2: 0,
+
+    /**
+     * z层level，决定绘画在哪层canvas中
+     * @name module:/zrender/graphic/Displayable#zlevel
+     * @type {number}
+     * @default 0
+     */
+    zlevel: 0,
+
+    /**
+     * 是否可拖拽
+     * @name module:/zrender/graphic/Displayable#draggable
+     * @type {boolean}
+     * @default false
+     */
+    draggable: false,
+
+    /**
+     * 是否正在拖拽
+     * @name module:/zrender/graphic/Displayable#draggable
+     * @type {boolean}
+     * @default false
+     */
+    dragging: false,
+
+    /**
+     * 是否相应鼠标事件
+     * @name module:/zrender/graphic/Displayable#silent
+     * @type {boolean}
+     * @default false
+     */
+    silent: false,
+
+    /**
+     * If enable culling
+     * @type {boolean}
+     * @default false
+     */
+    culling: false,
+
+    /**
+     * Mouse cursor when hovered
+     * @name module:/zrender/graphic/Displayable#cursor
+     * @type {string}
+     */
+    cursor: 'pointer',
+
+    /**
+     * If hover area is bounding rect
+     * @name module:/zrender/graphic/Displayable#rectHover
+     * @type {string}
+     */
+    rectHover: false,
+
+    /**
+     * Render the element progressively when the value >= 0,
+     * usefull for large data.
+     * @type {boolean}
+     */
+    progressive: false,
+
+    /**
+     * @type {boolean}
+     */
+    incremental: false,
+    // inplace is used with incremental
+    inplace: false,
+
+    beforeBrush: function (ctx) {},
+
+    afterBrush: function (ctx) {},
+
+    /**
+     * 图形绘制方法
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    // Interface
+    brush: function (ctx, prevEl) {},
+
+    /**
+     * 获取最小包围盒
+     * @return {module:zrender/core/BoundingRect}
+     */
+    // Interface
+    getBoundingRect: function () {},
+
+    /**
+     * 判断坐标 x, y 是否在图形上
+     * If displayable element contain coord x, y
+     * @param  {number} x
+     * @param  {number} y
+     * @return {boolean}
+     */
+    contain: function (x, y) {
+        return this.rectContain(x, y);
+    },
+
+    /**
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    traverse: function (cb, context) {
+        cb.call(context, this);
+    },
+
+    /**
+     * 判断坐标 x, y 是否在图形的包围盒上
+     * If bounding rect of element contain coord x, y
+     * @param  {number} x
+     * @param  {number} y
+     * @return {boolean}
+     */
+    rectContain: function (x, y) {
+        var coord = this.transformCoordToLocal(x, y);
+        var rect = this.getBoundingRect();
+        return rect.contain(coord[0], coord[1]);
+    },
+
+    /**
+     * 标记图形元素为脏，并且在下一帧重绘
+     * Mark displayable element dirty and refresh next frame
+     */
+    dirty: function () {
+        this.__dirty = true;
+
+        this._rect = null;
+
+        this.__zr && this.__zr.refresh();
+    },
+
+    /**
+     * 图形是否会触发事件
+     * If displayable object binded any event
+     * @return {boolean}
+     */
+    // TODO, 通过 bind 绑定的事件
+    // isSilent: function () {
+    //     return !(
+    //         this.hoverable || this.draggable
+    //         || this.onmousemove || this.onmouseover || this.onmouseout
+    //         || this.onmousedown || this.onmouseup || this.onclick
+    //         || this.ondragenter || this.ondragover || this.ondragleave
+    //         || this.ondrop
+    //     );
+    // },
+    /**
+     * Alias for animate('style')
+     * @param {boolean} loop
+     */
+    animateStyle: function (loop) {
+        return this.animate('style', loop);
+    },
+
+    attrKV: function (key, value) {
+        if (key !== 'style') {
+            Element.prototype.attrKV.call(this, key, value);
+        }
+        else {
+            this.style.set(value);
+        }
+    },
+
+    /**
+     * @param {Object|string} key
+     * @param {*} value
+     */
+    setStyle: function (key, value) {
+        this.style.set(key, value);
+        this.dirty(false);
+        return this;
+    },
+
+    /**
+     * Use given style object
+     * @param  {Object} obj
+     */
+    useStyle: function (obj) {
+        this.style = new Style(obj, this);
+        this.dirty(false);
+        return this;
+    }
+};
+
+inherits(Displayable, Element);
+
+mixin(Displayable, RectText);
+
+/**
+ * @alias zrender/graphic/Image
+ * @extends module:zrender/graphic/Displayable
+ * @constructor
+ * @param {Object} opts
+ */
+function ZImage(opts) {
+    Displayable.call(this, opts);
+}
+
+ZImage.prototype = {
+
+    constructor: ZImage,
+
+    type: 'image',
+
+    brush: function (ctx, prevEl) {
+        var style = this.style;
+        var src = style.image;
+
+        // Must bind each time
+        style.bind(ctx, this, prevEl);
+
+        var image = this._image = createOrUpdateImage(
+            src,
+            this._image,
+            this,
+            this.onload
+        );
+
+        if (!image || !isImageReady(image)) {
+            return;
+        }
+
+        // 图片已经加载完成
+        // if (image.nodeName.toUpperCase() == 'IMG') {
+        //     if (!image.complete) {
+        //         return;
+        //     }
+        // }
+        // Else is canvas
+
+        var x = style.x || 0;
+        var y = style.y || 0;
+        var width = style.width;
+        var height = style.height;
+        var aspect = image.width / image.height;
+        if (width == null && height != null) {
+            // Keep image/height ratio
+            width = height * aspect;
+        }
+        else if (height == null && width != null) {
+            height = width / aspect;
+        }
+        else if (width == null && height == null) {
+            width = image.width;
+            height = image.height;
+        }
+
+        // 设置transform
+        this.setTransform(ctx);
+
+        if (style.sWidth && style.sHeight) {
+            var sx = style.sx || 0;
+            var sy = style.sy || 0;
+            ctx.drawImage(
+                image,
+                sx, sy, style.sWidth, style.sHeight,
+                x, y, width, height
+            );
+        }
+        else if (style.sx && style.sy) {
+            var sx = style.sx;
+            var sy = style.sy;
+            var sWidth = width - sx;
+            var sHeight = height - sy;
+            ctx.drawImage(
+                image,
+                sx, sy, sWidth, sHeight,
+                x, y, width, height
+            );
+        }
+        else {
+            ctx.drawImage(image, x, y, width, height);
+        }
+
+        // Draw rect text
+        if (style.text != null) {
+            // Only restore transform when needs draw text.
+            this.restoreTransform(ctx);    
+            this.drawRectText(ctx, this.getBoundingRect());
+        }
+    },
+
+    getBoundingRect: function () {
+        var style = this.style;
+        if (! this._rect) {
+            this._rect = new BoundingRect(
+                style.x || 0, style.y || 0, style.width || 0, style.height || 0
+            );
+        }
+        return this._rect;
+    }
+};
+
+inherits(ZImage, Displayable);
+
+var HOVER_LAYER_ZLEVEL = 1e5;
+var CANVAS_ZLEVEL = 314159;
+
+var EL_AFTER_INCREMENTAL_INC = 0.01;
+var INCREMENTAL_INC = 0.001;
+
+function parseInt10(val) {
+    return parseInt(val, 10);
+}
+
+function isLayerValid(layer) {
+    if (!layer) {
+        return false;
+    }
+
+    if (layer.__builtin__) {
+        return true;
+    }
+
+    if (typeof(layer.resize) !== 'function'
+        || typeof(layer.refresh) !== 'function'
+    ) {
+        return false;
+    }
+
+    return true;
+}
+
+var tmpRect = new BoundingRect(0, 0, 0, 0);
+var viewRect = new BoundingRect(0, 0, 0, 0);
+function isDisplayableCulled(el, width, height) {
+    tmpRect.copy(el.getBoundingRect());
+    if (el.transform) {
+        tmpRect.applyTransform(el.transform);
+    }
+    viewRect.width = width;
+    viewRect.height = height;
+    return !tmpRect.intersect(viewRect);
+}
+
+function isClipPathChanged(clipPaths, prevClipPaths) {
+    if (clipPaths == prevClipPaths) { // Can both be null or undefined
+        return false;
+    }
+
+    if (!clipPaths || !prevClipPaths || (clipPaths.length !== prevClipPaths.length)) {
+        return true;
+    }
+    for (var i = 0; i < clipPaths.length; i++) {
+        if (clipPaths[i] !== prevClipPaths[i]) {
+            return true;
+        }
+    }
+}
+
+function doClip(clipPaths, ctx) {
+    for (var i = 0; i < clipPaths.length; i++) {
+        var clipPath = clipPaths[i];
+
+        clipPath.setTransform(ctx);
+        ctx.beginPath();
+        clipPath.buildPath(ctx, clipPath.shape);
+        ctx.clip();
+        // Transform back
+        clipPath.restoreTransform(ctx);
+    }
+}
+
+function createRoot(width, height) {
+    var domRoot = document.createElement('div');
+
+    // domRoot.onselectstart = returnFalse; // 避免页面选中的尴尬
+    domRoot.style.cssText = [
+        'position:relative',
+        'overflow:hidden',
+        'width:' + width + 'px',
+        'height:' + height + 'px',
+        'padding:0',
+        'margin:0',
+        'border-width:0'
+    ].join(';') + ';';
+
+    return domRoot;
+}
+
+
+/**
+ * @alias module:zrender/Painter
+ * @constructor
+ * @param {HTMLElement} root 绘图容器
+ * @param {module:zrender/Storage} storage
+ * @param {Object} opts
+ */
+var Painter = function (root, storage, opts) {
+
+    this.type = 'canvas';
+
+    // In node environment using node-canvas
+    var singleCanvas = !root.nodeName // In node ?
+        || root.nodeName.toUpperCase() === 'CANVAS';
+
+    this._opts = opts = extend({}, opts || {});
+
+    /**
+     * @type {number}
+     */
+    this.dpr = opts.devicePixelRatio || devicePixelRatio;
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this._singleCanvas = singleCanvas;
+    /**
+     * 绘图容器
+     * @type {HTMLElement}
+     */
+    this.root = root;
+
+    var rootStyle = root.style;
+
+    if (rootStyle) {
+        rootStyle['-webkit-tap-highlight-color'] = 'transparent';
+        rootStyle['-webkit-user-select'] =
+        rootStyle['user-select'] =
+        rootStyle['-webkit-touch-callout'] = 'none';
+
+        root.innerHTML = '';
+    }
+
+    /**
+     * @type {module:zrender/Storage}
+     */
+    this.storage = storage;
+
+    /**
+     * @type {Array.<number>}
+     * @private
+     */
+    var zlevelList = this._zlevelList = [];
+
+    /**
+     * @type {Object.<string, module:zrender/Layer>}
+     * @private
+     */
+    var layers = this._layers = {};
+
+    /**
+     * @type {Object.<string, Object>}
+     * @private
+     */
+    this._layerConfig = {};
+
+    /**
+     * zrender will do compositing when root is a canvas and have multiple zlevels.
+     */
+    this._needsManuallyCompositing = false;
+
+    if (!singleCanvas) {
+        this._width = this._getSize(0);
+        this._height = this._getSize(1);
+
+        var domRoot = this._domRoot = createRoot(
+            this._width, this._height
+        );
+        root.appendChild(domRoot);
+    }
+    else {
+        var width = root.width;
+        var height = root.height;
+
+        if (opts.width != null) {
+            width = opts.width;
+        }
+        if (opts.height != null) {
+            height = opts.height;
+        }
+        this.dpr = opts.devicePixelRatio || 1;
+
+        // Use canvas width and height directly
+        root.width = width * this.dpr;
+        root.height = height * this.dpr;
+
+        this._width = width;
+        this._height = height;
+
+        // Create layer if only one given canvas
+        // Device can be specified to create a high dpi image.
+        var mainLayer = new Layer(root, this, this.dpr);
+        mainLayer.__builtin__ = true;
+        mainLayer.initContext();
+        // FIXME Use canvas width and height
+        // mainLayer.resize(width, height);
+        layers[CANVAS_ZLEVEL] = mainLayer;
+        mainLayer.zlevel = CANVAS_ZLEVEL;
+        // Not use common zlevel.
+        zlevelList.push(CANVAS_ZLEVEL);
+
+        this._domRoot = root;
+    }
+
+    /**
+     * @type {module:zrender/Layer}
+     * @private
+     */
+    this._hoverlayer = null;
+
+    this._hoverElements = [];
+};
+
+Painter.prototype = {
+
+    constructor: Painter,
+
+    getType: function () {
+        return 'canvas';
+    },
+
+    /**
+     * If painter use a single canvas
+     * @return {boolean}
+     */
+    isSingleCanvas: function () {
+        return this._singleCanvas;
+    },
+    /**
+     * @return {HTMLDivElement}
+     */
+    getViewportRoot: function () {
+        return this._domRoot;
+    },
+
+    getViewportRootOffset: function () {
+        var viewportRoot = this.getViewportRoot();
+        if (viewportRoot) {
+            return {
+                offsetLeft: viewportRoot.offsetLeft || 0,
+                offsetTop: viewportRoot.offsetTop || 0
+            };
+        }
+    },
+
+    /**
+     * 刷新
+     * @param {boolean} [paintAll=false] 强制绘制所有displayable
+     */
+    refresh: function (paintAll) {
+
+        var list = this.storage.getDisplayList(true);
+
+        var zlevelList = this._zlevelList;
+
+        this._redrawId = Math.random();
+
+        this._paintList(list, paintAll, this._redrawId);
+
+        // Paint custum layers
+        for (var i = 0; i < zlevelList.length; i++) {
+            var z = zlevelList[i];
+            var layer = this._layers[z];
+            if (!layer.__builtin__ && layer.refresh) {
+                var clearColor = i === 0 ? this._backgroundColor : null;
+                layer.refresh(clearColor);
+            }
+        }
+
+        this.refreshHover();
+
+        return this;
+    },
+
+    addHover: function (el, hoverStyle) {
+        if (el.__hoverMir) {
+            return;
+        }
+        var elMirror = new el.constructor({
+            style: el.style,
+            shape: el.shape
+        });
+        elMirror.__from = el;
+        el.__hoverMir = elMirror;
+        elMirror.setStyle(hoverStyle);
+        this._hoverElements.push(elMirror);
+    },
+
+    removeHover: function (el) {
+        var elMirror = el.__hoverMir;
+        var hoverElements = this._hoverElements;
+        var idx = indexOf(hoverElements, elMirror);
+        if (idx >= 0) {
+            hoverElements.splice(idx, 1);
+        }
+        el.__hoverMir = null;
+    },
+
+    clearHover: function (el) {
+        var hoverElements = this._hoverElements;
+        for (var i = 0; i < hoverElements.length; i++) {
+            var from = hoverElements[i].__from;
+            if (from) {
+                from.__hoverMir = null;
+            }
+        }
+        hoverElements.length = 0;
+    },
+
+    refreshHover: function () {
+        var hoverElements = this._hoverElements;
+        var len = hoverElements.length;
+        var hoverLayer = this._hoverlayer;
+        hoverLayer && hoverLayer.clear();
+
+        if (!len) {
+            return;
+        }
+        sort(hoverElements, this.storage.displayableSortFunc);
+
+        // Use a extream large zlevel
+        // FIXME?
+        if (!hoverLayer) {
+            hoverLayer = this._hoverlayer = this.getLayer(HOVER_LAYER_ZLEVEL);
+        }
+
+        var scope = {};
+        hoverLayer.ctx.save();
+        for (var i = 0; i < len;) {
+            var el = hoverElements[i];
+            var originalEl = el.__from;
+            // Original el is removed
+            // PENDING
+            if (!(originalEl && originalEl.__zr)) {
+                hoverElements.splice(i, 1);
+                originalEl.__hoverMir = null;
+                len--;
+                continue;
+            }
+            i++;
+
+            // Use transform
+            // FIXME style and shape ?
+            if (!originalEl.invisible) {
+                el.transform = originalEl.transform;
+                el.invTransform = originalEl.invTransform;
+                el.__clipPaths = originalEl.__clipPaths;
+                // el.
+                this._doPaintEl(el, hoverLayer, true, scope);
+            }
+        }
+        hoverLayer.ctx.restore();
+    },
+
+    getHoverLayer: function () {
+        return this.getLayer(HOVER_LAYER_ZLEVEL);
+    },
+
+    _paintList: function (list, paintAll, redrawId) {
+        if (this._redrawId !== redrawId) {
+            return;
+        }
+
+        paintAll = paintAll || false;
+
+        this._updateLayerStatus(list);
+
+        var finished = this._doPaintList(list, paintAll);
+
+        if (this._needsManuallyCompositing) {
+            this._compositeManually();
+        }
+
+        if (!finished) {
+            var self = this;
+            requestAnimationFrame(function () {
+                self._paintList(list, paintAll, redrawId);
+            });
+        }
+    },
+
+    _compositeManually: function () {
+        var ctx = this.getLayer(CANVAS_ZLEVEL).ctx;
+        var width = this._domRoot.width;
+        var height = this._domRoot.height;
+        ctx.clearRect(0, 0, width, height);
+        // PENDING, If only builtin layer?
+        this.eachBuiltinLayer(function (layer) {
+            if (layer.virtual) {
+                ctx.drawImage(layer.dom, 0, 0, width, height);
+            }
+        });
+    },
+
+    _doPaintList: function (list, paintAll) {
+        var layerList = [];
+        for (var zi = 0; zi < this._zlevelList.length; zi++) {
+            var zlevel = this._zlevelList[zi];
+            var layer = this._layers[zlevel];
+            if (layer.__builtin__
+                && layer !== this._hoverlayer
+                && (layer.__dirty || paintAll)
+            ) {
+                layerList.push(layer);
+            }
+        }
+
+        var finished = true;
+
+        for (var k = 0; k < layerList.length; k++) {
+            var layer = layerList[k];
+            var ctx = layer.ctx;
+            var scope = {};
+            ctx.save();
+
+            var start = paintAll ? layer.__startIndex : layer.__drawIndex;
+
+            var useTimer = !paintAll && layer.incremental && Date.now;
+            var startTime = useTimer && Date.now();
+
+            var clearColor = layer.zlevel === this._zlevelList[0]
+                ? this._backgroundColor : null;
+            // All elements in this layer are cleared.
+            if (layer.__startIndex === layer.__endIndex) {
+                layer.clear(false, clearColor);
+            }
+            else if (start === layer.__startIndex) {
+                var firstEl = list[start];
+                if (!firstEl.incremental || !firstEl.notClear || paintAll) {
+                    layer.clear(false, clearColor);
+                }
+            }
+            if (start === -1) {
+                console.error('For some unknown reason. drawIndex is -1');
+                start = layer.__startIndex;
+            }
+            for (var i = start; i < layer.__endIndex; i++) {
+                var el = list[i];
+                this._doPaintEl(el, layer, paintAll, scope);
+                el.__dirty = false;
+
+                if (useTimer) {
+                    // Date.now can be executed in 13,025,305 ops/second.
+                    var dTime = Date.now() - startTime;
+                    // Give 15 millisecond to draw.
+                    // The rest elements will be drawn in the next frame.
+                    if (dTime > 15) {
+                        break;
+                    }
+                }
+            }
+
+            layer.__drawIndex = i;
+
+            if (layer.__drawIndex < layer.__endIndex) {
+                finished = false;
+            }
+
+            if (scope.prevElClipPaths) {
+                // Needs restore the state. If last drawn element is in the clipping area.
+                ctx.restore();
+            }
+
+            ctx.restore();
+        }
+
+        if (env$1.wxa) {
+            // Flush for weixin application
+            each$1(this._layers, function (layer) {
+                if (layer && layer.ctx && layer.ctx.draw) {
+                    layer.ctx.draw();
+                }
+            });
+        }
+
+        return finished;
+    },
+
+    _doPaintEl: function (el, currentLayer, forcePaint, scope) {
+        var ctx = currentLayer.ctx;
+        var m = el.transform;
+        if (
+            (currentLayer.__dirty || forcePaint)
+            // Ignore invisible element
+            && !el.invisible
+            // Ignore transparent element
+            && el.style.opacity !== 0
+            // Ignore scale 0 element, in some environment like node-canvas
+            // Draw a scale 0 element can cause all following draw wrong
+            // And setTransform with scale 0 will cause set back transform failed.
+            && !(m && !m[0] && !m[3])
+            // Ignore culled element
+            && !(el.culling && isDisplayableCulled(el, this._width, this._height))
+        ) {
+
+            var clipPaths = el.__clipPaths;
+
+            // Optimize when clipping on group with several elements
+            if (!scope.prevElClipPaths
+                || isClipPathChanged(clipPaths, scope.prevElClipPaths)
+            ) {
+                // If has previous clipping state, restore from it
+                if (scope.prevElClipPaths) {
+                    currentLayer.ctx.restore();
+                    scope.prevElClipPaths = null;
+
+                    // Reset prevEl since context has been restored
+                    scope.prevEl = null;
+                }
+                // New clipping state
+                if (clipPaths) {
+                    ctx.save();
+                    doClip(clipPaths, ctx);
+                    scope.prevElClipPaths = clipPaths;
+                }
+            }
+            el.beforeBrush && el.beforeBrush(ctx);
+
+            el.brush(ctx, scope.prevEl || null);
+            scope.prevEl = el;
+
+            el.afterBrush && el.afterBrush(ctx);
+        }
+    },
+
+    /**
+     * 获取 zlevel 所在层，如果不存在则会创建一个新的层
+     * @param {number} zlevel
+     * @param {boolean} virtual Virtual layer will not be inserted into dom.
+     * @return {module:zrender/Layer}
+     */
+    getLayer: function (zlevel, virtual) {
+        if (this._singleCanvas && !this._needsManuallyCompositing) {
+            zlevel = CANVAS_ZLEVEL;
+        }
+        var layer = this._layers[zlevel];
+        if (!layer) {
+            // Create a new layer
+            layer = new Layer('zr_' + zlevel, this, this.dpr);
+            layer.zlevel = zlevel;
+            layer.__builtin__ = true;
+
+            if (this._layerConfig[zlevel]) {
+                merge(layer, this._layerConfig[zlevel], true);
+            }
+
+            if (virtual) {
+                layer.virtual = virtual;
+            }
+
+            this.insertLayer(zlevel, layer);
+
+            // Context is created after dom inserted to document
+            // Or excanvas will get 0px clientWidth and clientHeight
+            layer.initContext();
+        }
+
+        return layer;
+    },
+
+    insertLayer: function (zlevel, layer) {
+
+        var layersMap = this._layers;
+        var zlevelList = this._zlevelList;
+        var len = zlevelList.length;
+        var prevLayer = null;
+        var i = -1;
+        var domRoot = this._domRoot;
+
+        if (layersMap[zlevel]) {
+            zrLog('ZLevel ' + zlevel + ' has been used already');
+            return;
+        }
+        // Check if is a valid layer
+        if (!isLayerValid(layer)) {
+            zrLog('Layer of zlevel ' + zlevel + ' is not valid');
+            return;
+        }
+
+        if (len > 0 && zlevel > zlevelList[0]) {
+            for (i = 0; i < len - 1; i++) {
+                if (
+                    zlevelList[i] < zlevel
+                    && zlevelList[i + 1] > zlevel
+                ) {
+                    break;
+                }
+            }
+            prevLayer = layersMap[zlevelList[i]];
+        }
+        zlevelList.splice(i + 1, 0, zlevel);
+
+        layersMap[zlevel] = layer;
+
+        // Vitual layer will not directly show on the screen.
+        // (It can be a WebGL layer and assigned to a ZImage element)
+        // But it still under management of zrender.
+        if (!layer.virtual) {
+            if (prevLayer) {
+                var prevDom = prevLayer.dom;
+                if (prevDom.nextSibling) {
+                    domRoot.insertBefore(
+                        layer.dom,
+                        prevDom.nextSibling
+                    );
+                }
+                else {
+                    domRoot.appendChild(layer.dom);
+                }
+            }
+            else {
+                if (domRoot.firstChild) {
+                    domRoot.insertBefore(layer.dom, domRoot.firstChild);
+                }
+                else {
+                    domRoot.appendChild(layer.dom);
+                }
+            }
+        }
+    },
+
+    // Iterate each layer
+    eachLayer: function (cb, context) {
+        var zlevelList = this._zlevelList;
+        var z;
+        var i;
+        for (i = 0; i < zlevelList.length; i++) {
+            z = zlevelList[i];
+            cb.call(context, this._layers[z], z);
+        }
+    },
+
+    // Iterate each buildin layer
+    eachBuiltinLayer: function (cb, context) {
+        var zlevelList = this._zlevelList;
+        var layer;
+        var z;
+        var i;
+        for (i = 0; i < zlevelList.length; i++) {
+            z = zlevelList[i];
+            layer = this._layers[z];
+            if (layer.__builtin__) {
+                cb.call(context, layer, z);
+            }
+        }
+    },
+
+    // Iterate each other layer except buildin layer
+    eachOtherLayer: function (cb, context) {
+        var zlevelList = this._zlevelList;
+        var layer;
+        var z;
+        var i;
+        for (i = 0; i < zlevelList.length; i++) {
+            z = zlevelList[i];
+            layer = this._layers[z];
+            if (!layer.__builtin__) {
+                cb.call(context, layer, z);
+            }
+        }
+    },
+
+    /**
+     * 获取所有已创建的层
+     * @param {Array.<module:zrender/Layer>} [prevLayer]
+     */
+    getLayers: function () {
+        return this._layers;
+    },
+
+    _updateLayerStatus: function (list) {
+
+        this.eachBuiltinLayer(function (layer, z) {
+            layer.__dirty = layer.__used = false;
+        });
+
+        function updatePrevLayer(idx) {
+            if (prevLayer) {
+                if (prevLayer.__endIndex !== idx) {
+                    prevLayer.__dirty = true;
+                }
+                prevLayer.__endIndex = idx;
+            }
+        }
+
+        if (this._singleCanvas) {
+            for (var i = 1; i < list.length; i++) {
+                var el = list[i];
+                if (el.zlevel !== list[i - 1].zlevel || el.incremental) {
+                    this._needsManuallyCompositing = true;
+                    break;
+                }
+            }
+        }
+
+        var prevLayer = null;
+        var incrementalLayerCount = 0;
+        for (var i = 0; i < list.length; i++) {
+            var el = list[i];
+            var zlevel = el.zlevel;
+            var layer;
+            // PENDING If change one incremental element style ?
+            // TODO Where there are non-incremental elements between incremental elements.
+            if (el.incremental) {
+                layer = this.getLayer(zlevel + INCREMENTAL_INC, this._needsManuallyCompositing);
+                layer.incremental = true;
+                incrementalLayerCount = 1;
+            }
+            else {
+                layer = this.getLayer(zlevel + (incrementalLayerCount > 0 ? EL_AFTER_INCREMENTAL_INC : 0), this._needsManuallyCompositing);
+            }
+
+            if (!layer.__builtin__) {
+                zrLog('ZLevel ' + zlevel + ' has been used by unkown layer ' + layer.id);
+            }
+
+            if (layer !== prevLayer) {
+                layer.__used = true;
+                if (layer.__startIndex !== i) {
+                    layer.__dirty = true;
+                }
+                layer.__startIndex = i;
+                if (!layer.incremental) {
+                    layer.__drawIndex = i;
+                }
+                else {
+                    // Mark layer draw index needs to update.
+                    layer.__drawIndex = -1;
+                }
+                updatePrevLayer(i);
+                prevLayer = layer;
+            }
+            if (el.__dirty) {
+                layer.__dirty = true;
+                if (layer.incremental && layer.__drawIndex < 0) {
+                    // Start draw from the first dirty element.
+                    layer.__drawIndex = i;
+                }
+            }
+        }
+
+        updatePrevLayer(i);
+
+        this.eachBuiltinLayer(function (layer, z) {
+            // Used in last frame but not in this frame. Needs clear
+            if (!layer.__used && layer.getElementCount() > 0) {
+                layer.__dirty = true;
+                layer.__startIndex = layer.__endIndex = layer.__drawIndex = 0;
+            }
+            // For incremental layer. In case start index changed and no elements are dirty.
+            if (layer.__dirty && layer.__drawIndex < 0) {
+                layer.__drawIndex = layer.__startIndex;
+            }
+        });
+    },
+
+    /**
+     * 清除hover层外所有内容
+     */
+    clear: function () {
+        this.eachBuiltinLayer(this._clearLayer);
+        return this;
+    },
+
+    _clearLayer: function (layer) {
+        layer.clear();
+    },
+
+    setBackgroundColor: function (backgroundColor) {
+        this._backgroundColor = backgroundColor;
+    },
+
+    /**
+     * 修改指定zlevel的绘制参数
+     *
+     * @param {string} zlevel
+     * @param {Object} config 配置对象
+     * @param {string} [config.clearColor=0] 每次清空画布的颜色
+     * @param {string} [config.motionBlur=false] 是否开启动态模糊
+     * @param {number} [config.lastFrameAlpha=0.7]
+     *                 在开启动态模糊的时候使用，与上一帧混合的alpha值，值越大尾迹越明显
+     */
+    configLayer: function (zlevel, config) {
+        if (config) {
+            var layerConfig = this._layerConfig;
+            if (!layerConfig[zlevel]) {
+                layerConfig[zlevel] = config;
+            }
+            else {
+                merge(layerConfig[zlevel], config, true);
+            }
+
+            for (var i = 0; i < this._zlevelList.length; i++) {
+                var _zlevel = this._zlevelList[i];
+                if (_zlevel === zlevel || _zlevel === zlevel + EL_AFTER_INCREMENTAL_INC) {
+                    var layer = this._layers[_zlevel];
+                    merge(layer, layerConfig[zlevel], true);
+                }
+            }
+        }
+    },
+
+    /**
+     * 删除指定层
+     * @param {number} zlevel 层所在的zlevel
+     */
+    delLayer: function (zlevel) {
+        var layers = this._layers;
+        var zlevelList = this._zlevelList;
+        var layer = layers[zlevel];
+        if (!layer) {
+            return;
+        }
+        layer.dom.parentNode.removeChild(layer.dom);
+        delete layers[zlevel];
+
+        zlevelList.splice(indexOf(zlevelList, zlevel), 1);
+    },
+
+    /**
+     * 区域大小变化后重绘
+     */
+    resize: function (width, height) {
+        if (!this._domRoot.style) { // Maybe in node or worker
+            if (width == null || height == null) {
+                return;
+            }
+            this._width = width;
+            this._height = height;
+
+            this.getLayer(CANVAS_ZLEVEL).resize(width, height);
+        }
+        else {
+            var domRoot = this._domRoot;
+            // FIXME Why ?
+            domRoot.style.display = 'none';
+
+            // Save input w/h
+            var opts = this._opts;
+            width != null && (opts.width = width);
+            height != null && (opts.height = height);
+
+            width = this._getSize(0);
+            height = this._getSize(1);
+
+            domRoot.style.display = '';
+
+            // 优化没有实际改变的resize
+            if (this._width != width || height != this._height) {
+                domRoot.style.width = width + 'px';
+                domRoot.style.height = height + 'px';
+
+                for (var id in this._layers) {
+                    if (this._layers.hasOwnProperty(id)) {
+                        this._layers[id].resize(width, height);
+                    }
+                }
+                each$1(this._progressiveLayers, function (layer) {
+                    layer.resize(width, height);
+                });
+
+                this.refresh(true);
+            }
+
+            this._width = width;
+            this._height = height;
+
+        }
+        return this;
+    },
+
+    /**
+     * 清除单独的一个层
+     * @param {number} zlevel
+     */
+    clearLayer: function (zlevel) {
+        var layer = this._layers[zlevel];
+        if (layer) {
+            layer.clear();
+        }
+    },
+
+    /**
+     * 释放
+     */
+    dispose: function () {
+        this.root.innerHTML = '';
+
+        this.root =
+        this.storage =
+
+        this._domRoot =
+        this._layers = null;
+    },
+
+    /**
+     * Get canvas which has all thing rendered
+     * @param {Object} opts
+     * @param {string} [opts.backgroundColor]
+     * @param {number} [opts.pixelRatio]
+     */
+    getRenderedCanvas: function (opts) {
+        opts = opts || {};
+        if (this._singleCanvas && !this._compositeManually) {
+            return this._layers[CANVAS_ZLEVEL].dom;
+        }
+
+        var imageLayer = new Layer('image', this, opts.pixelRatio || this.dpr);
+        imageLayer.initContext();
+        imageLayer.clear(false, opts.backgroundColor || this._backgroundColor);
+
+        if (opts.pixelRatio <= this.dpr) {
+            this.refresh();
+
+            var width = imageLayer.dom.width;
+            var height = imageLayer.dom.height;
+            var ctx = imageLayer.ctx;
+            this.eachLayer(function (layer) {
+                if (layer.__builtin__) {
+                    ctx.drawImage(layer.dom, 0, 0, width, height);
+                }
+                else if (layer.renderToCanvas) {
+                    imageLayer.ctx.save();
+                    layer.renderToCanvas(imageLayer.ctx);
+                    imageLayer.ctx.restore();
+                }
+            });
+        }
+        else {
+            // PENDING, echarts-gl and incremental rendering.
+            var scope = {};
+            var displayList = this.storage.getDisplayList(true);
+            for (var i = 0; i < displayList.length; i++) {
+                var el = displayList[i];
+                this._doPaintEl(el, imageLayer, true, scope);
+            }
+        }
+
+        return imageLayer.dom;
+    },
+    /**
+     * 获取绘图区域宽度
+     */
+    getWidth: function () {
+        return this._width;
+    },
+
+    /**
+     * 获取绘图区域高度
+     */
+    getHeight: function () {
+        return this._height;
+    },
+
+    _getSize: function (whIdx) {
+        var opts = this._opts;
+        var wh = ['width', 'height'][whIdx];
+        var cwh = ['clientWidth', 'clientHeight'][whIdx];
+        var plt = ['paddingLeft', 'paddingTop'][whIdx];
+        var prb = ['paddingRight', 'paddingBottom'][whIdx];
+
+        if (opts[wh] != null && opts[wh] !== 'auto') {
+            return parseFloat(opts[wh]);
+        }
+
+        var root = this.root;
+        // IE8 does not support getComputedStyle, but it use VML.
+        var stl = document.defaultView.getComputedStyle(root);
+
+        return (
+            (root[cwh] || parseInt10(stl[wh]) || parseInt10(root.style[wh]))
+            - (parseInt10(stl[plt]) || 0)
+            - (parseInt10(stl[prb]) || 0)
+        ) | 0;
+    },
+
+    pathToImage: function (path, dpr) {
+        dpr = dpr || this.dpr;
+
+        var canvas = document.createElement('canvas');
+        var ctx = canvas.getContext('2d');
+        var rect = path.getBoundingRect();
+        var style = path.style;
+        var shadowBlurSize = style.shadowBlur * dpr;
+        var shadowOffsetX = style.shadowOffsetX * dpr;
+        var shadowOffsetY = style.shadowOffsetY * dpr;
+        var lineWidth = style.hasStroke() ? style.lineWidth : 0;
+
+        var leftMargin = Math.max(lineWidth / 2, -shadowOffsetX + shadowBlurSize);
+        var rightMargin = Math.max(lineWidth / 2, shadowOffsetX + shadowBlurSize);
+        var topMargin = Math.max(lineWidth / 2, -shadowOffsetY + shadowBlurSize);
+        var bottomMargin = Math.max(lineWidth / 2, shadowOffsetY + shadowBlurSize);
+        var width = rect.width + leftMargin + rightMargin;
+        var height = rect.height + topMargin + bottomMargin;
+
+        canvas.width = width * dpr;
+        canvas.height = height * dpr;
+
+        ctx.scale(dpr, dpr);
+        ctx.clearRect(0, 0, width, height);
+        ctx.dpr = dpr;
+
+        var pathTransform = {
+            position: path.position,
+            rotation: path.rotation,
+            scale: path.scale
+        };
+        path.position = [leftMargin - rect.x, topMargin - rect.y];
+        path.rotation = 0;
+        path.scale = [1, 1];
+        path.updateTransform();
+        if (path) {
+            path.brush(ctx);
+        }
+
+        var ImageShape = ZImage;
+        var imgShape = new ImageShape({
+            style: {
+                x: 0,
+                y: 0,
+                image: canvas
+            }
+        });
+
+        if (pathTransform.position != null) {
+            imgShape.position = path.position = pathTransform.position;
+        }
+
+        if (pathTransform.rotation != null) {
+            imgShape.rotation = path.rotation = pathTransform.rotation;
+        }
+
+        if (pathTransform.scale != null) {
+            imgShape.scale = path.scale = pathTransform.scale;
+        }
+
+        return imgShape;
+    }
+};
+
+/**
+ * 事件辅助类
+ * @module zrender/core/event
+ * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ */
+
+var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
+
+var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
+
+function getBoundingClientRect(el) {
+    // BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect
+    return el.getBoundingClientRect ? el.getBoundingClientRect() : {left: 0, top: 0};
+}
+
+// `calculate` is optional, default false
+function clientToLocal(el, e, out, calculate) {
+    out = out || {};
+
+    // According to the W3C Working Draft, offsetX and offsetY should be relative
+    // to the padding edge of the target element. The only browser using this convention
+    // is IE. Webkit uses the border edge, Opera uses the content edge, and FireFox does
+    // not support the properties.
+    // (see http://www.jacklmoore.com/notes/mouse-position/)
+    // In zr painter.dom, padding edge equals to border edge.
+
+    // FIXME
+    // When mousemove event triggered on ec tooltip, target is not zr painter.dom, and
+    // offsetX/Y is relative to e.target, where the calculation of zrX/Y via offsetX/Y
+    // is too complex. So css-transfrom dont support in this case temporarily.
+    if (calculate || !env$1.canvasSupported) {
+        defaultGetZrXY(el, e, out);
+    }
+    // Caution: In FireFox, layerX/layerY Mouse position relative to the closest positioned
+    // ancestor element, so we should make sure el is positioned (e.g., not position:static).
+    // BTW1, Webkit don't return the same results as FF in non-simple cases (like add
+    // zoom-factor, overflow / opacity layers, transforms ...)
+    // BTW2, (ev.offsetY || ev.pageY - $(ev.target).offset().top) is not correct in preserve-3d.
+    // <https://bugs.jquery.com/ticket/8523#comment:14>
+    // BTW3, In ff, offsetX/offsetY is always 0.
+    else if (env$1.browser.firefox && e.layerX != null && e.layerX !== e.offsetX) {
+        out.zrX = e.layerX;
+        out.zrY = e.layerY;
+    }
+    // For IE6+, chrome, safari, opera. (When will ff support offsetX?)
+    else if (e.offsetX != null) {
+        out.zrX = e.offsetX;
+        out.zrY = e.offsetY;
+    }
+    // For some other device, e.g., IOS safari.
+    else {
+        defaultGetZrXY(el, e, out);
+    }
+
+    return out;
+}
+
+function defaultGetZrXY(el, e, out) {
+    // This well-known method below does not support css transform.
+    var box = getBoundingClientRect(el);
+    out.zrX = e.clientX - box.left;
+    out.zrY = e.clientY - box.top;
+}
+
+/**
+ * 如果存在第三方嵌入的一些dom触发的事件，或touch事件，需要转换一下事件坐标.
+ * `calculate` is optional, default false.
+ */
+function normalizeEvent(el, e, calculate) {
+
+    e = e || window.event;
+
+    if (e.zrX != null) {
+        return e;
+    }
+
+    var eventType = e.type;
+    var isTouch = eventType && eventType.indexOf('touch') >= 0;
+
+    if (!isTouch) {
+        clientToLocal(el, e, e, calculate);
+        e.zrDelta = (e.wheelDelta) ? e.wheelDelta / 120 : -(e.detail || 0) / 3;
+    }
+    else {
+        var touch = eventType != 'touchend'
+            ? e.targetTouches[0]
+            : e.changedTouches[0];
+        touch && clientToLocal(el, touch, e, calculate);
+    }
+
+    // Add which for click: 1 === left; 2 === middle; 3 === right; otherwise: 0;
+    // See jQuery: https://github.com/jquery/jquery/blob/master/src/event.js
+    // If e.which has been defined, if may be readonly,
+    // see: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which
+    var button = e.button;
+    if (e.which == null && button !== undefined && MOUSE_EVENT_REG.test(e.type)) {
+        e.which = (button & 1 ? 1 : (button & 2 ? 3 : (button & 4 ? 2 : 0)));
+    }
+
+    return e;
+}
+
+/**
+ * @param {HTMLElement} el
+ * @param {string} name
+ * @param {Function} handler
+ */
+function addEventListener(el, name, handler) {
+    if (isDomLevel2) {
+        // Reproduct the console warning:
+        // [Violation] Added non-passive event listener to a scroll-blocking <some> event.
+        // Consider marking event handler as 'passive' to make the page more responsive.
+        // Just set console log level: verbose in chrome dev tool.
+        // then the warning log will be printed when addEventListener called.
+        // See https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md
+        // We have not yet found a neat way to using passive. Because in zrender the dom event
+        // listener delegate all of the upper events of element. Some of those events need
+        // to prevent default. For example, the feature `preventDefaultMouseMove` of echarts.
+        // Before passive can be adopted, these issues should be considered:
+        // (1) Whether and how a zrender user specifies an event listener passive. And by default,
+        // passive or not.
+        // (2) How to tread that some zrender event listener is passive, and some is not. If
+        // we use other way but not preventDefault of mousewheel and touchmove, browser
+        // compatibility should be handled.
+
+        // var opts = (env.passiveSupported && name === 'mousewheel')
+        //     ? {passive: true}
+        //     // By default, the third param of el.addEventListener is `capture: false`.
+        //     : void 0;
+        // el.addEventListener(name, handler /* , opts */);
+        el.addEventListener(name, handler);
+    }
+    else {
+        el.attachEvent('on' + name, handler);
+    }
+}
+
+function removeEventListener(el, name, handler) {
+    if (isDomLevel2) {
+        el.removeEventListener(name, handler);
+    }
+    else {
+        el.detachEvent('on' + name, handler);
+    }
+}
+
+/**
+ * preventDefault and stopPropagation.
+ * Notice: do not do that in zrender. Upper application
+ * do that if necessary.
+ *
+ * @memberOf module:zrender/core/event
+ * @method
+ * @param {Event} e : event对象
+ */
+var stop = isDomLevel2
+    ? function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        e.cancelBubble = true;
+    }
+    : function (e) {
+        e.returnValue = false;
+        e.cancelBubble = true;
+    };
+
+function notLeftMouse(e) {
+    // If e.which is undefined, considered as left mouse event.
+    return e.which > 1;
+}
+
+/**
+ * 动画主类, 调度和管理所有动画控制器
+ *
+ * @module zrender/animation/Animation
+ * @author pissang(https://github.com/pissang)
+ */
+// TODO Additive animation
+// http://iosoteric.com/additive-animations-animatewithduration-in-ios-8/
+// https://developer.apple.com/videos/wwdc2014/#236
+
+/**
+ * @typedef {Object} IZRenderStage
+ * @property {Function} update
+ */
+
+/**
+ * @alias module:zrender/animation/Animation
+ * @constructor
+ * @param {Object} [options]
+ * @param {Function} [options.onframe]
+ * @param {IZRenderStage} [options.stage]
+ * @example
+ *     var animation = new Animation();
+ *     var obj = {
+ *         x: 100,
+ *         y: 100
+ *     };
+ *     animation.animate(node.position)
+ *         .when(1000, {
+ *             x: 500,
+ *             y: 500
+ *         })
+ *         .when(2000, {
+ *             x: 100,
+ *             y: 100
+ *         })
+ *         .start('spline');
+ */
+var Animation = function (options) {
+
+    options = options || {};
+
+    this.stage = options.stage || {};
+
+    this.onframe = options.onframe || function() {};
+
+    // private properties
+    this._clips = [];
+
+    this._running = false;
+
+    this._time;
+
+    this._pausedTime;
+
+    this._pauseStart;
+
+    this._paused = false;
+
+    Eventful.call(this);
+};
+
+Animation.prototype = {
+
+    constructor: Animation,
+    /**
+     * 添加 clip
+     * @param {module:zrender/animation/Clip} clip
+     */
+    addClip: function (clip) {
+        this._clips.push(clip);
+    },
+    /**
+     * 添加 animator
+     * @param {module:zrender/animation/Animator} animator
+     */
+    addAnimator: function (animator) {
+        animator.animation = this;
+        var clips = animator.getClips();
+        for (var i = 0; i < clips.length; i++) {
+            this.addClip(clips[i]);
+        }
+    },
+    /**
+     * 删除动画片段
+     * @param {module:zrender/animation/Clip} clip
+     */
+    removeClip: function(clip) {
+        var idx = indexOf(this._clips, clip);
+        if (idx >= 0) {
+            this._clips.splice(idx, 1);
+        }
+    },
+
+    /**
+     * 删除动画片段
+     * @param {module:zrender/animation/Animator} animator
+     */
+    removeAnimator: function (animator) {
+        var clips = animator.getClips();
+        for (var i = 0; i < clips.length; i++) {
+            this.removeClip(clips[i]);
+        }
+        animator.animation = null;
+    },
+
+    _update: function() {
+        var time = new Date().getTime() - this._pausedTime;
+        var delta = time - this._time;
+        var clips = this._clips;
+        var len = clips.length;
+
+        var deferredEvents = [];
+        var deferredClips = [];
+        for (var i = 0; i < len; i++) {
+            var clip = clips[i];
+            var e = clip.step(time, delta);
+            // Throw out the events need to be called after
+            // stage.update, like destroy
+            if (e) {
+                deferredEvents.push(e);
+                deferredClips.push(clip);
+            }
+        }
+
+        // Remove the finished clip
+        for (var i = 0; i < len;) {
+            if (clips[i]._needsRemove) {
+                clips[i] = clips[len - 1];
+                clips.pop();
+                len--;
+            }
+            else {
+                i++;
+            }
+        }
+
+        len = deferredEvents.length;
+        for (var i = 0; i < len; i++) {
+            deferredClips[i].fire(deferredEvents[i]);
+        }
+
+        this._time = time;
+
+        this.onframe(delta);
+
+        // 'frame' should be triggered before stage, because upper application
+        // depends on the sequence (e.g., echarts-stream and finish
+        // event judge)
+        this.trigger('frame', delta);
+
+        if (this.stage.update) {
+            this.stage.update();
+        }
+    },
+
+    _startLoop: function () {
+        var self = this;
+
+        this._running = true;
+
+        function step() {
+            if (self._running) {
+
+                requestAnimationFrame(step);
+
+                !self._paused && self._update();
+            }
+        }
+
+        requestAnimationFrame(step);
+    },
+
+    /**
+     * Start animation.
+     */
+    start: function () {
+
+        this._time = new Date().getTime();
+        this._pausedTime = 0;
+
+        this._startLoop();
+    },
+
+    /**
+     * Stop animation.
+     */
+    stop: function () {
+        this._running = false;
+    },
+
+    /**
+     * Pause animation.
+     */
+    pause: function () {
+        if (!this._paused) {
+            this._pauseStart = new Date().getTime();
+            this._paused = true;
+        }
+    },
+
+    /**
+     * Resume animation.
+     */
+    resume: function () {
+        if (this._paused) {
+            this._pausedTime += (new Date().getTime()) - this._pauseStart;
+            this._paused = false;
+        }
+    },
+
+    /**
+     * Clear animation.
+     */
+    clear: function () {
+        this._clips = [];
+    },
+
+    /**
+     * Whether animation finished.
+     */
+    isFinished: function () {
+        return !this._clips.length;
+    },
+
+    /**
+     * Creat animator for a target, whose props can be animated.
+     *
+     * @param  {Object} target
+     * @param  {Object} options
+     * @param  {boolean} [options.loop=false] Whether loop animation.
+     * @param  {Function} [options.getter=null] Get value from target.
+     * @param  {Function} [options.setter=null] Set value to target.
+     * @return {module:zrender/animation/Animation~Animator}
+     */
+    // TODO Gap
+    animate: function (target, options) {
+        options = options || {};
+
+        var animator = new Animator(
+            target,
+            options.loop,
+            options.getter,
+            options.setter
+        );
+
+        this.addAnimator(animator);
+
+        return animator;
+    }
+};
+
+mixin(Animation, Eventful);
+
+/**
+ * Only implements needed gestures for mobile.
+ */
+
+var GestureMgr = function () {
+
+    /**
+     * @private
+     * @type {Array.<Object>}
+     */
+    this._track = [];
+};
+
+GestureMgr.prototype = {
+
+    constructor: GestureMgr,
+
+    recognize: function (event, target, root) {
+        this._doTrack(event, target, root);
+        return this._recognize(event);
+    },
+
+    clear: function () {
+        this._track.length = 0;
+        return this;
+    },
+
+    _doTrack: function (event, target, root) {
+        var touches = event.touches;
+
+        if (!touches) {
+            return;
+        }
+
+        var trackItem = {
+            points: [],
+            touches: [],
+            target: target,
+            event: event
+        };
+
+        for (var i = 0, len = touches.length; i < len; i++) {
+            var touch = touches[i];
+            var pos = clientToLocal(root, touch, {});
+            trackItem.points.push([pos.zrX, pos.zrY]);
+            trackItem.touches.push(touch);
+        }
+
+        this._track.push(trackItem);
+    },
+
+    _recognize: function (event) {
+        for (var eventName in recognizers) {
+            if (recognizers.hasOwnProperty(eventName)) {
+                var gestureInfo = recognizers[eventName](this._track, event);
+                if (gestureInfo) {
+                    return gestureInfo;
+                }
+            }
+        }
+    }
+};
+
+function dist$1(pointPair) {
+    var dx = pointPair[1][0] - pointPair[0][0];
+    var dy = pointPair[1][1] - pointPair[0][1];
+
+    return Math.sqrt(dx * dx + dy * dy);
+}
+
+function center(pointPair) {
+    return [
+        (pointPair[0][0] + pointPair[1][0]) / 2,
+        (pointPair[0][1] + pointPair[1][1]) / 2
+    ];
+}
+
+var recognizers = {
+
+    pinch: function (track, event) {
+        var trackLen = track.length;
+
+        if (!trackLen) {
+            return;
+        }
+
+        var pinchEnd = (track[trackLen - 1] || {}).points;
+        var pinchPre = (track[trackLen - 2] || {}).points || pinchEnd;
+
+        if (pinchPre
+            && pinchPre.length > 1
+            && pinchEnd
+            && pinchEnd.length > 1
+        ) {
+            var pinchScale = dist$1(pinchEnd) / dist$1(pinchPre);
+            !isFinite(pinchScale) && (pinchScale = 1);
+
+            event.pinchScale = pinchScale;
+
+            var pinchCenter = center(pinchEnd);
+            event.pinchX = pinchCenter[0];
+            event.pinchY = pinchCenter[1];
+
+            return {
+                type: 'pinch',
+                target: track[0].target,
+                event: event
+            };
+        }
+    }
+
+    // Only pinch currently.
+};
+
+var TOUCH_CLICK_DELAY = 300;
+
+var mouseHandlerNames = [
+    'click', 'dblclick', 'mousewheel', 'mouseout',
+    'mouseup', 'mousedown', 'mousemove', 'contextmenu'
+];
+
+var touchHandlerNames = [
+    'touchstart', 'touchend', 'touchmove'
+];
+
+var pointerEventNames = {
+    pointerdown: 1, pointerup: 1, pointermove: 1, pointerout: 1
+};
+
+var pointerHandlerNames = map(mouseHandlerNames, function (name) {
+    var nm = name.replace('mouse', 'pointer');
+    return pointerEventNames[nm] ? nm : name;
+});
+
+function eventNameFix(name) {
+    return (name === 'mousewheel' && env$1.browser.firefox) ? 'DOMMouseScroll' : name;
+}
+
+function processGesture(proxy, event, stage) {
+    var gestureMgr = proxy._gestureMgr;
+
+    stage === 'start' && gestureMgr.clear();
+
+    var gestureInfo = gestureMgr.recognize(
+        event,
+        proxy.handler.findHover(event.zrX, event.zrY, null).target,
+        proxy.dom
+    );
+
+    stage === 'end' && gestureMgr.clear();
+
+    // Do not do any preventDefault here. Upper application do that if necessary.
+    if (gestureInfo) {
+        var type = gestureInfo.type;
+        event.gestureEvent = type;
+
+        proxy.handler.dispatchToElement({target: gestureInfo.target}, type, gestureInfo.event);
+    }
+}
+
+// function onMSGestureChange(proxy, event) {
+//     if (event.translationX || event.translationY) {
+//         // mousemove is carried by MSGesture to reduce the sensitivity.
+//         proxy.handler.dispatchToElement(event.target, 'mousemove', event);
+//     }
+//     if (event.scale !== 1) {
+//         event.pinchX = event.offsetX;
+//         event.pinchY = event.offsetY;
+//         event.pinchScale = event.scale;
+//         proxy.handler.dispatchToElement(event.target, 'pinch', event);
+//     }
+// }
+
+/**
+ * Prevent mouse event from being dispatched after Touch Events action
+ * @see <https://github.com/deltakosh/handjs/blob/master/src/hand.base.js>
+ * 1. Mobile browsers dispatch mouse events 300ms after touchend.
+ * 2. Chrome for Android dispatch mousedown for long-touch about 650ms
+ * Result: Blocking Mouse Events for 700ms.
+ */
+function setTouchTimer(instance) {
+    instance._touching = true;
+    clearTimeout(instance._touchTimer);
+    instance._touchTimer = setTimeout(function () {
+        instance._touching = false;
+    }, 700);
+}
+
+
+var domHandlers = {
+    /**
+     * Mouse move handler
+     * @inner
+     * @param {Event} event
+     */
+    mousemove: function (event) {
+        event = normalizeEvent(this.dom, event);
+
+        this.trigger('mousemove', event);
+    },
+
+    /**
+     * Mouse out handler
+     * @inner
+     * @param {Event} event
+     */
+    mouseout: function (event) {
+        event = normalizeEvent(this.dom, event);
+
+        var element = event.toElement || event.relatedTarget;
+        if (element != this.dom) {
+            while (element && element.nodeType != 9) {
+                // 忽略包含在root中的dom引起的mouseOut
+                if (element === this.dom) {
+                    return;
+                }
+
+                element = element.parentNode;
+            }
+        }
+
+        this.trigger('mouseout', event);
+    },
+
+    /**
+     * Touch开始响应函数
+     * @inner
+     * @param {Event} event
+     */
+    touchstart: function (event) {
+        // Default mouse behaviour should not be disabled here.
+        // For example, page may needs to be slided.
+        event = normalizeEvent(this.dom, event);
+
+        // Mark touch, which is useful in distinguish touch and
+        // mouse event in upper applicatoin.
+        event.zrByTouch = true;
+
+        this._lastTouchMoment = new Date();
+
+        processGesture(this, event, 'start');
+
+        // In touch device, trigger `mousemove`(`mouseover`) should
+        // be triggered, and must before `mousedown` triggered.
+        domHandlers.mousemove.call(this, event);
+
+        domHandlers.mousedown.call(this, event);
+
+        setTouchTimer(this);
+    },
+
+    /**
+     * Touch移动响应函数
+     * @inner
+     * @param {Event} event
+     */
+    touchmove: function (event) {
+
+        event = normalizeEvent(this.dom, event);
+
+        // Mark touch, which is useful in distinguish touch and
+        // mouse event in upper applicatoin.
+        event.zrByTouch = true;
+
+        processGesture(this, event, 'change');
+
+        // Mouse move should always be triggered no matter whether
+        // there is gestrue event, because mouse move and pinch may
+        // be used at the same time.
+        domHandlers.mousemove.call(this, event);
+
+        setTouchTimer(this);
+    },
+
+    /**
+     * Touch结束响应函数
+     * @inner
+     * @param {Event} event
+     */
+    touchend: function (event) {
+
+        event = normalizeEvent(this.dom, event);
+
+        // Mark touch, which is useful in distinguish touch and
+        // mouse event in upper applicatoin.
+        event.zrByTouch = true;
+
+        processGesture(this, event, 'end');
+
+        domHandlers.mouseup.call(this, event);
+
+        // Do not trigger `mouseout` here, in spite of `mousemove`(`mouseover`) is
+        // triggered in `touchstart`. This seems to be illogical, but by this mechanism,
+        // we can conveniently implement "hover style" in both PC and touch device just
+        // by listening to `mouseover` to add "hover style" and listening to `mouseout`
+        // to remove "hover style" on an element, without any additional code for
+        // compatibility. (`mouseout` will not be triggered in `touchend`, so "hover
+        // style" will remain for user view)
+
+        // click event should always be triggered no matter whether
+        // there is gestrue event. System click can not be prevented.
+        if (+new Date() - this._lastTouchMoment < TOUCH_CLICK_DELAY) {
+            domHandlers.click.call(this, event);
+        }
+
+        setTouchTimer(this);
+    },
+
+    pointerdown: function (event) {
+        domHandlers.mousedown.call(this, event);
+
+        // if (useMSGuesture(this, event)) {
+        //     this._msGesture.addPointer(event.pointerId);
+        // }
+    },
+
+    pointermove: function (event) {
+        // FIXME
+        // pointermove is so sensitive that it always triggered when
+        // tap(click) on touch screen, which affect some judgement in
+        // upper application. So, we dont support mousemove on MS touch
+        // device yet.
+        if (!isPointerFromTouch(event)) {
+            domHandlers.mousemove.call(this, event);
+        }
+    },
+
+    pointerup: function (event) {
+        domHandlers.mouseup.call(this, event);
+    },
+
+    pointerout: function (event) {
+        // pointerout will be triggered when tap on touch screen
+        // (IE11+/Edge on MS Surface) after click event triggered,
+        // which is inconsistent with the mousout behavior we defined
+        // in touchend. So we unify them.
+        // (check domHandlers.touchend for detailed explanation)
+        if (!isPointerFromTouch(event)) {
+            domHandlers.mouseout.call(this, event);
+        }
+    }
+};
+
+function isPointerFromTouch(event) {
+    var pointerType = event.pointerType;
+    return pointerType === 'pen' || pointerType === 'touch';
+}
+
+// function useMSGuesture(handlerProxy, event) {
+//     return isPointerFromTouch(event) && !!handlerProxy._msGesture;
+// }
+
+// Common handlers
+each$1(['click', 'mousedown', 'mouseup', 'mousewheel', 'dblclick', 'contextmenu'], function (name) {
+    domHandlers[name] = function (event) {
+        event = normalizeEvent(this.dom, event);
+        this.trigger(name, event);
+    };
+});
+
+/**
+ * 为控制类实例初始化dom 事件处理函数
+ *
+ * @inner
+ * @param {module:zrender/Handler} instance 控制类实例
+ */
+function initDomHandler(instance) {
+    each$1(touchHandlerNames, function (name) {
+        instance._handlers[name] = bind(domHandlers[name], instance);
+    });
+
+    each$1(pointerHandlerNames, function (name) {
+        instance._handlers[name] = bind(domHandlers[name], instance);
+    });
+
+    each$1(mouseHandlerNames, function (name) {
+        instance._handlers[name] = makeMouseHandler(domHandlers[name], instance);
+    });
+
+    function makeMouseHandler(fn, instance) {
+        return function () {
+            if (instance._touching) {
+                return;
+            }
+            return fn.apply(instance, arguments);
+        };
+    }
+}
+
+
+function HandlerDomProxy(dom) {
+    Eventful.call(this);
+
+    this.dom = dom;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._touching = false;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this._touchTimer;
+
+    /**
+     * @private
+     * @type {module:zrender/core/GestureMgr}
+     */
+    this._gestureMgr = new GestureMgr();
+
+    this._handlers = {};
+
+    initDomHandler(this);
+
+    if (env$1.pointerEventsSupported) { // Only IE11+/Edge
+        // 1. On devices that both enable touch and mouse (e.g., MS Surface and lenovo X240),
+        // IE11+/Edge do not trigger touch event, but trigger pointer event and mouse event
+        // at the same time.
+        // 2. On MS Surface, it probablely only trigger mousedown but no mouseup when tap on
+        // screen, which do not occurs in pointer event.
+        // So we use pointer event to both detect touch gesture and mouse behavior.
+        mountHandlers(pointerHandlerNames, this);
+
+        // FIXME
+        // Note: MS Gesture require CSS touch-action set. But touch-action is not reliable,
+        // which does not prevent defuault behavior occasionally (which may cause view port
+        // zoomed in but use can not zoom it back). And event.preventDefault() does not work.
+        // So we have to not to use MSGesture and not to support touchmove and pinch on MS
+        // touch screen. And we only support click behavior on MS touch screen now.
+
+        // MS Gesture Event is only supported on IE11+/Edge and on Windows 8+.
+        // We dont support touch on IE on win7.
+        // See <https://msdn.microsoft.com/en-us/library/dn433243(v=vs.85).aspx>
+        // if (typeof MSGesture === 'function') {
+        //     (this._msGesture = new MSGesture()).target = dom; // jshint ignore:line
+        //     dom.addEventListener('MSGestureChange', onMSGestureChange);
+        // }
+    }
+    else {
+        if (env$1.touchEventsSupported) {
+            mountHandlers(touchHandlerNames, this);
+            // Handler of 'mouseout' event is needed in touch mode, which will be mounted below.
+            // addEventListener(root, 'mouseout', this._mouseoutHandler);
+        }
+
+        // 1. Considering some devices that both enable touch and mouse event (like on MS Surface
+        // and lenovo X240, @see #2350), we make mouse event be always listened, otherwise
+        // mouse event can not be handle in those devices.
+        // 2. On MS Surface, Chrome will trigger both touch event and mouse event. How to prevent
+        // mouseevent after touch event triggered, see `setTouchTimer`.
+        mountHandlers(mouseHandlerNames, this);
+    }
+
+    function mountHandlers(handlerNames, instance) {
+        each$1(handlerNames, function (name) {
+            addEventListener(dom, eventNameFix(name), instance._handlers[name]);
+        }, instance);
+    }
+}
+
+var handlerDomProxyProto = HandlerDomProxy.prototype;
+handlerDomProxyProto.dispose = function () {
+    var handlerNames = mouseHandlerNames.concat(touchHandlerNames);
+
+    for (var i = 0; i < handlerNames.length; i++) {
+        var name = handlerNames[i];
+        removeEventListener(this.dom, eventNameFix(name), this._handlers[name]);
+    }
+};
+
+handlerDomProxyProto.setCursor = function (cursorStyle) {
+    this.dom.style && (this.dom.style.cursor = cursorStyle || 'default');
+};
+
+mixin(HandlerDomProxy, Eventful);
+
+/*!
+* ZRender, a high performance 2d drawing library.
+*
+* Copyright (c) 2013, Baidu Inc.
+* All rights reserved.
+*
+* LICENSE
+* https://github.com/ecomfe/zrender/blob/master/LICENSE.txt
+*/
+
+var useVML = !env$1.canvasSupported;
+
+var painterCtors = {
+    canvas: Painter
+};
+
+var instances$1 = {};    // ZRender实例map索引
+
+/**
+ * @type {string}
+ */
+var version$1 = '4.0.4';
+
+/**
+ * Initializing a zrender instance
+ * @param {HTMLElement} dom
+ * @param {Object} opts
+ * @param {string} [opts.renderer='canvas'] 'canvas' or 'svg'
+ * @param {number} [opts.devicePixelRatio]
+ * @param {number|string} [opts.width] Can be 'auto' (the same as null/undefined)
+ * @param {number|string} [opts.height] Can be 'auto' (the same as null/undefined)
+ * @return {module:zrender/ZRender}
+ */
+function init$1(dom, opts) {
+    var zr = new ZRender(guid(), dom, opts);
+    instances$1[zr.id] = zr;
+    return zr;
+}
+
+/**
+ * Dispose zrender instance
+ * @param {module:zrender/ZRender} zr
+ */
+function dispose$1(zr) {
+    if (zr) {
+        zr.dispose();
+    }
+    else {
+        for (var key in instances$1) {
+            if (instances$1.hasOwnProperty(key)) {
+                instances$1[key].dispose();
+            }
+        }
+        instances$1 = {};
+    }
+
+    return this;
+}
+
+/**
+ * Get zrender instance by id
+ * @param {string} id zrender instance id
+ * @return {module:zrender/ZRender}
+ */
+function getInstance(id) {
+    return instances$1[id];
+}
+
+function registerPainter(name, Ctor) {
+    painterCtors[name] = Ctor;
+}
+
+function delInstance(id) {
+    delete instances$1[id];
+}
+
+/**
+ * @module zrender/ZRender
+ */
+/**
+ * @constructor
+ * @alias module:zrender/ZRender
+ * @param {string} id
+ * @param {HTMLElement} dom
+ * @param {Object} opts
+ * @param {string} [opts.renderer='canvas'] 'canvas' or 'svg'
+ * @param {number} [opts.devicePixelRatio]
+ * @param {number} [opts.width] Can be 'auto' (the same as null/undefined)
+ * @param {number} [opts.height] Can be 'auto' (the same as null/undefined)
+ */
+var ZRender = function (id, dom, opts) {
+
+    opts = opts || {};
+
+    /**
+     * @type {HTMLDomElement}
+     */
+    this.dom = dom;
+
+    /**
+     * @type {string}
+     */
+    this.id = id;
+
+    var self = this;
+    var storage = new Storage();
+
+    var rendererType = opts.renderer;
+    // TODO WebGL
+    if (useVML) {
+        if (!painterCtors.vml) {
+            throw new Error('You need to require \'zrender/vml/vml\' to support IE8');
+        }
+        rendererType = 'vml';
+    }
+    else if (!rendererType || !painterCtors[rendererType]) {
+        rendererType = 'canvas';
+    }
+    var painter = new painterCtors[rendererType](dom, storage, opts, id);
+
+    this.storage = storage;
+    this.painter = painter;
+
+    var handerProxy = (!env$1.node && !env$1.worker) ? new HandlerDomProxy(painter.getViewportRoot()) : null;
+    this.handler = new Handler(storage, painter, handerProxy, painter.root);
+
+    /**
+     * @type {module:zrender/animation/Animation}
+     */
+    this.animation = new Animation({
+        stage: {
+            update: bind(this.flush, this)
+        }
+    });
+    this.animation.start();
+
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this._needsRefresh;
+
+    // 修改 storage.delFromStorage, 每次删除元素之前删除动画
+    // FIXME 有点ugly
+    var oldDelFromStorage = storage.delFromStorage;
+    var oldAddToStorage = storage.addToStorage;
+
+    storage.delFromStorage = function (el) {
+        oldDelFromStorage.call(storage, el);
+
+        el && el.removeSelfFromZr(self);
+    };
+
+    storage.addToStorage = function (el) {
+        oldAddToStorage.call(storage, el);
+
+        el.addSelfToZr(self);
+    };
+};
+
+ZRender.prototype = {
+
+    constructor: ZRender,
+    /**
+     * 获取实例唯一标识
+     * @return {string}
+     */
+    getId: function () {
+        return this.id;
+    },
+
+    /**
+     * 添加元素
+     * @param  {module:zrender/Element} el
+     */
+    add: function (el) {
+        this.storage.addRoot(el);
+        this._needsRefresh = true;
+    },
+
+    /**
+     * 删除元素
+     * @param  {module:zrender/Element} el
+     */
+    remove: function (el) {
+        this.storage.delRoot(el);
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Change configuration of layer
+     * @param {string} zLevel
+     * @param {Object} config
+     * @param {string} [config.clearColor=0] Clear color
+     * @param {string} [config.motionBlur=false] If enable motion blur
+     * @param {number} [config.lastFrameAlpha=0.7] Motion blur factor. Larger value cause longer trailer
+    */
+    configLayer: function (zLevel, config) {
+        if (this.painter.configLayer) {
+            this.painter.configLayer(zLevel, config);
+        }
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Set background color
+     * @param {string} backgroundColor
+     */
+    setBackgroundColor: function (backgroundColor) {
+        if (this.painter.setBackgroundColor) {
+            this.painter.setBackgroundColor(backgroundColor);
+        }
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Repaint the canvas immediately
+     */
+    refreshImmediately: function () {
+        // var start = new Date();
+        // Clear needsRefresh ahead to avoid something wrong happens in refresh
+        // Or it will cause zrender refreshes again and again.
+        this._needsRefresh = false;
+        this.painter.refresh();
+        /**
+         * Avoid trigger zr.refresh in Element#beforeUpdate hook
+         */
+        this._needsRefresh = false;
+        // var end = new Date();
+        // var log = document.getElementById('log');
+        // if (log) {
+        //     log.innerHTML = log.innerHTML + '<br>' + (end - start);
+        // }
+    },
+
+    /**
+     * Mark and repaint the canvas in the next frame of browser
+     */
+    refresh: function() {
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Perform all refresh
+     */
+    flush: function () {
+        var triggerRendered;
+
+        if (this._needsRefresh) {
+            triggerRendered = true;
+            this.refreshImmediately();
+        }
+        if (this._needsRefreshHover) {
+            triggerRendered = true;
+            this.refreshHoverImmediately();
+        }
+
+        triggerRendered && this.trigger('rendered');
+    },
+
+    /**
+     * Add element to hover layer
+     * @param  {module:zrender/Element} el
+     * @param {Object} style
+     */
+    addHover: function (el, style) {
+        if (this.painter.addHover) {
+            this.painter.addHover(el, style);
+            this.refreshHover();
+        }
+    },
+
+    /**
+     * Add element from hover layer
+     * @param  {module:zrender/Element} el
+     */
+    removeHover: function (el) {
+        if (this.painter.removeHover) {
+            this.painter.removeHover(el);
+            this.refreshHover();
+        }
+    },
+
+    /**
+     * Clear all hover elements in hover layer
+     * @param  {module:zrender/Element} el
+     */
+    clearHover: function () {
+        if (this.painter.clearHover) {
+            this.painter.clearHover();
+            this.refreshHover();
+        }
+    },
+
+    /**
+     * Refresh hover in next frame
+     */
+    refreshHover: function () {
+        this._needsRefreshHover = true;
+    },
+
+    /**
+     * Refresh hover immediately
+     */
+    refreshHoverImmediately: function () {
+        this._needsRefreshHover = false;
+        this.painter.refreshHover && this.painter.refreshHover();
+    },
+
+    /**
+     * Resize the canvas.
+     * Should be invoked when container size is changed
+     * @param {Object} [opts]
+     * @param {number|string} [opts.width] Can be 'auto' (the same as null/undefined)
+     * @param {number|string} [opts.height] Can be 'auto' (the same as null/undefined)
+     */
+    resize: function(opts) {
+        opts = opts || {};
+        this.painter.resize(opts.width, opts.height);
+        this.handler.resize();
+    },
+
+    /**
+     * Stop and clear all animation immediately
+     */
+    clearAnimation: function () {
+        this.animation.clear();
+    },
+
+    /**
+     * Get container width
+     */
+    getWidth: function() {
+        return this.painter.getWidth();
+    },
+
+    /**
+     * Get container height
+     */
+    getHeight: function() {
+        return this.painter.getHeight();
+    },
+
+    /**
+     * Export the canvas as Base64 URL
+     * @param {string} type
+     * @param {string} [backgroundColor='#fff']
+     * @return {string} Base64 URL
+     */
+    // toDataURL: function(type, backgroundColor) {
+    //     return this.painter.getRenderedCanvas({
+    //         backgroundColor: backgroundColor
+    //     }).toDataURL(type);
+    // },
+
+    /**
+     * Converting a path to image.
+     * It has much better performance of drawing image rather than drawing a vector path.
+     * @param {module:zrender/graphic/Path} e
+     * @param {number} width
+     * @param {number} height
+     */
+    pathToImage: function(e, dpr) {
+        return this.painter.pathToImage(e, dpr);
+    },
+
+    /**
+     * Set default cursor
+     * @param {string} [cursorStyle='default'] 例如 crosshair
+     */
+    setCursorStyle: function (cursorStyle) {
+        this.handler.setCursorStyle(cursorStyle);
+    },
+
+    /**
+     * Find hovered element
+     * @param {number} x
+     * @param {number} y
+     * @return {Object} {target, topTarget}
+     */
+    findHover: function (x, y) {
+        return this.handler.findHover(x, y);
+    },
+
+    /**
+     * Bind event
+     *
+     * @param {string} eventName Event name
+     * @param {Function} eventHandler Handler function
+     * @param {Object} [context] Context object
+     */
+    on: function(eventName, eventHandler, context) {
+        this.handler.on(eventName, eventHandler, context);
+    },
+
+    /**
+     * Unbind event
+     * @param {string} eventName Event name
+     * @param {Function} [eventHandler] Handler function
+     */
+    off: function(eventName, eventHandler) {
+        this.handler.off(eventName, eventHandler);
+    },
+
+    /**
+     * Trigger event manually
+     *
+     * @param {string} eventName Event name
+     * @param {event=} event Event object
+     */
+    trigger: function (eventName, event) {
+        this.handler.trigger(eventName, event);
+    },
+
+
+    /**
+     * Clear all objects and the canvas.
+     */
+    clear: function () {
+        this.storage.delRoot();
+        this.painter.clear();
+    },
+
+    /**
+     * Dispose self.
+     */
+    dispose: function () {
+        this.animation.stop();
+
+        this.clear();
+        this.storage.dispose();
+        this.painter.dispose();
+        this.handler.dispose();
+
+        this.animation =
+        this.storage =
+        this.painter =
+        this.handler = null;
+
+        delInstance(this.id);
+    }
+};
+
+
+
+var zrender = (Object.freeze || Object)({
+	version: version$1,
+	init: init$1,
+	dispose: dispose$1,
+	getInstance: getInstance,
+	registerPainter: registerPainter
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$2 = each$1;
+var isObject$2 = isObject$1;
+var isArray$1 = isArray;
+
+/**
+ * Make the name displayable. But we should
+ * make sure it is not duplicated with user
+ * specified name, so use '\0';
+ */
+var DUMMY_COMPONENT_NAME_PREFIX = 'series\0';
+
+/**
+ * If value is not array, then translate it to array.
+ * @param  {*} value
+ * @return {Array} [value] or value
+ */
+function normalizeToArray(value) {
+    return value instanceof Array
+        ? value
+        : value == null
+        ? []
+        : [value];
+}
+
+/**
+ * Sync default option between normal and emphasis like `position` and `show`
+ * In case some one will write code like
+ *     label: {
+ *          show: false,
+ *          position: 'outside',
+ *          fontSize: 18
+ *     },
+ *     emphasis: {
+ *          label: { show: true }
+ *     }
+ * @param {Object} opt
+ * @param {string} key
+ * @param {Array.<string>} subOpts
+ */
+function defaultEmphasis(opt, key, subOpts) {
+    // Caution: performance sensitive.
+    if (opt) {
+        opt[key] = opt[key] || {};
+        opt.emphasis = opt.emphasis || {};
+        opt.emphasis[key] = opt.emphasis[key] || {};
+
+        // Default emphasis option from normal
+        for (var i = 0, len = subOpts.length; i < len; i++) {
+            var subOptName = subOpts[i];
+            if (!opt.emphasis[key].hasOwnProperty(subOptName)
+                && opt[key].hasOwnProperty(subOptName)
+            ) {
+                opt.emphasis[key][subOptName] = opt[key][subOptName];
+            }
+        }
+    }
+}
+
+var TEXT_STYLE_OPTIONS = [
+    'fontStyle', 'fontWeight', 'fontSize', 'fontFamily',
+    'rich', 'tag', 'color', 'textBorderColor', 'textBorderWidth',
+    'width', 'height', 'lineHeight', 'align', 'verticalAlign', 'baseline',
+    'shadowColor', 'shadowBlur', 'shadowOffsetX', 'shadowOffsetY',
+    'textShadowColor', 'textShadowBlur', 'textShadowOffsetX', 'textShadowOffsetY',
+    'backgroundColor', 'borderColor', 'borderWidth', 'borderRadius', 'padding'
+];
+
+// modelUtil.LABEL_OPTIONS = modelUtil.TEXT_STYLE_OPTIONS.concat([
+//     'position', 'offset', 'rotate', 'origin', 'show', 'distance', 'formatter',
+//     'fontStyle', 'fontWeight', 'fontSize', 'fontFamily',
+//     // FIXME: deprecated, check and remove it.
+//     'textStyle'
+// ]);
+
+/**
+ * The method do not ensure performance.
+ * data could be [12, 2323, {value: 223}, [1221, 23], {value: [2, 23]}]
+ * This helper method retieves value from data.
+ * @param {string|number|Date|Array|Object} dataItem
+ * @return {number|string|Date|Array.<number|string|Date>}
+ */
+function getDataItemValue(dataItem) {
+    return (isObject$2(dataItem) && !isArray$1(dataItem) && !(dataItem instanceof Date))
+        ? dataItem.value : dataItem;
+}
+
+/**
+ * data could be [12, 2323, {value: 223}, [1221, 23], {value: [2, 23]}]
+ * This helper method determine if dataItem has extra option besides value
+ * @param {string|number|Date|Array|Object} dataItem
+ */
+function isDataItemOption(dataItem) {
+    return isObject$2(dataItem)
+        && !(dataItem instanceof Array);
+        // // markLine data can be array
+        // && !(dataItem[0] && isObject(dataItem[0]) && !(dataItem[0] instanceof Array));
+}
+
+/**
+ * Mapping to exists for merge.
+ *
+ * @public
+ * @param {Array.<Object>|Array.<module:echarts/model/Component>} exists
+ * @param {Object|Array.<Object>} newCptOptions
+ * @return {Array.<Object>} Result, like [{exist: ..., option: ...}, {}],
+ *                          index of which is the same as exists.
+ */
+function mappingToExists(exists, newCptOptions) {
+    // Mapping by the order by original option (but not order of
+    // new option) in merge mode. Because we should ensure
+    // some specified index (like xAxisIndex) is consistent with
+    // original option, which is easy to understand, espatially in
+    // media query. And in most case, merge option is used to
+    // update partial option but not be expected to change order.
+    newCptOptions = (newCptOptions || []).slice();
+
+    var result = map(exists || [], function (obj, index) {
+        return {exist: obj};
+    });
+
+    // Mapping by id or name if specified.
+    each$2(newCptOptions, function (cptOption, index) {
+        if (!isObject$2(cptOption)) {
+            return;
+        }
+
+        // id has highest priority.
+        for (var i = 0; i < result.length; i++) {
+            if (!result[i].option // Consider name: two map to one.
+                && cptOption.id != null
+                && result[i].exist.id === cptOption.id + ''
+            ) {
+                result[i].option = cptOption;
+                newCptOptions[index] = null;
+                return;
+            }
+        }
+
+        for (var i = 0; i < result.length; i++) {
+            var exist = result[i].exist;
+            if (!result[i].option // Consider name: two map to one.
+                // Can not match when both ids exist but different.
+                && (exist.id == null || cptOption.id == null)
+                && cptOption.name != null
+                && !isIdInner(cptOption)
+                && !isIdInner(exist)
+                && exist.name === cptOption.name + ''
+            ) {
+                result[i].option = cptOption;
+                newCptOptions[index] = null;
+                return;
+            }
+        }
+    });
+
+    // Otherwise mapping by index.
+    each$2(newCptOptions, function (cptOption, index) {
+        if (!isObject$2(cptOption)) {
+            return;
+        }
+
+        var i = 0;
+        for (; i < result.length; i++) {
+            var exist = result[i].exist;
+            if (!result[i].option
+                // Existing model that already has id should be able to
+                // mapped to (because after mapping performed model may
+                // be assigned with a id, whish should not affect next
+                // mapping), except those has inner id.
+                && !isIdInner(exist)
+                // Caution:
+                // Do not overwrite id. But name can be overwritten,
+                // because axis use name as 'show label text'.
+                // 'exist' always has id and name and we dont
+                // need to check it.
+                && cptOption.id == null
+            ) {
+                result[i].option = cptOption;
+                break;
+            }
+        }
+
+        if (i >= result.length) {
+            result.push({option: cptOption});
+        }
+    });
+
+    return result;
+}
+
+/**
+ * Make id and name for mapping result (result of mappingToExists)
+ * into `keyInfo` field.
+ *
+ * @public
+ * @param {Array.<Object>} Result, like [{exist: ..., option: ...}, {}],
+ *                          which order is the same as exists.
+ * @return {Array.<Object>} The input.
+ */
+function makeIdAndName(mapResult) {
+    // We use this id to hash component models and view instances
+    // in echarts. id can be specified by user, or auto generated.
+
+    // The id generation rule ensures new view instance are able
+    // to mapped to old instance when setOption are called in
+    // no-merge mode. So we generate model id by name and plus
+    // type in view id.
+
+    // name can be duplicated among components, which is convenient
+    // to specify multi components (like series) by one name.
+
+    // Ensure that each id is distinct.
+    var idMap = createHashMap();
+
+    each$2(mapResult, function (item, index) {
+        var existCpt = item.exist;
+        existCpt && idMap.set(existCpt.id, item);
+    });
+
+    each$2(mapResult, function (item, index) {
+        var opt = item.option;
+
+        assert$1(
+            !opt || opt.id == null || !idMap.get(opt.id) || idMap.get(opt.id) === item,
+            'id duplicates: ' + (opt && opt.id)
+        );
+
+        opt && opt.id != null && idMap.set(opt.id, item);
+        !item.keyInfo && (item.keyInfo = {});
+    });
+
+    // Make name and id.
+    each$2(mapResult, function (item, index) {
+        var existCpt = item.exist;
+        var opt = item.option;
+        var keyInfo = item.keyInfo;
+
+        if (!isObject$2(opt)) {
+            return;
+        }
+
+        // name can be overwitten. Consider case: axis.name = '20km'.
+        // But id generated by name will not be changed, which affect
+        // only in that case: setOption with 'not merge mode' and view
+        // instance will be recreated, which can be accepted.
+        keyInfo.name = opt.name != null
+            ? opt.name + ''
+            : existCpt
+            ? existCpt.name
+            // Avoid diffferent series has the same name,
+            // because name may be used like in color pallet.
+            : DUMMY_COMPONENT_NAME_PREFIX + index;
+
+        if (existCpt) {
+            keyInfo.id = existCpt.id;
+        }
+        else if (opt.id != null) {
+            keyInfo.id = opt.id + '';
+        }
+        else {
+            // Consider this situatoin:
+            //  optionA: [{name: 'a'}, {name: 'a'}, {..}]
+            //  optionB [{..}, {name: 'a'}, {name: 'a'}]
+            // Series with the same name between optionA and optionB
+            // should be mapped.
+            var idNum = 0;
+            do {
+                keyInfo.id = '\0' + keyInfo.name + '\0' + idNum++;
+            }
+            while (idMap.get(keyInfo.id));
+        }
+
+        idMap.set(keyInfo.id, item);
+    });
+}
+
+function isNameSpecified(componentModel) {
+    var name = componentModel.name;
+    // Is specified when `indexOf` get -1 or > 0.
+    return !!(name && name.indexOf(DUMMY_COMPONENT_NAME_PREFIX));
+}
+
+/**
+ * @public
+ * @param {Object} cptOption
+ * @return {boolean}
+ */
+function isIdInner(cptOption) {
+    return isObject$2(cptOption)
+        && cptOption.id
+        && (cptOption.id + '').indexOf('\0_ec_\0') === 0;
+}
+
+/**
+ * A helper for removing duplicate items between batchA and batchB,
+ * and in themselves, and categorize by series.
+ *
+ * @param {Array.<Object>} batchA Like: [{seriesId: 2, dataIndex: [32, 4, 5]}, ...]
+ * @param {Array.<Object>} batchB Like: [{seriesId: 2, dataIndex: [32, 4, 5]}, ...]
+ * @return {Array.<Array.<Object>, Array.<Object>>} result: [resultBatchA, resultBatchB]
+ */
+function compressBatches(batchA, batchB) {
+    var mapA = {};
+    var mapB = {};
+
+    makeMap(batchA || [], mapA);
+    makeMap(batchB || [], mapB, mapA);
+
+    return [mapToArray(mapA), mapToArray(mapB)];
+
+    function makeMap(sourceBatch, map$$1, otherMap) {
+        for (var i = 0, len = sourceBatch.length; i < len; i++) {
+            var seriesId = sourceBatch[i].seriesId;
+            var dataIndices = normalizeToArray(sourceBatch[i].dataIndex);
+            var otherDataIndices = otherMap && otherMap[seriesId];
+
+            for (var j = 0, lenj = dataIndices.length; j < lenj; j++) {
+                var dataIndex = dataIndices[j];
+
+                if (otherDataIndices && otherDataIndices[dataIndex]) {
+                    otherDataIndices[dataIndex] = null;
+                }
+                else {
+                    (map$$1[seriesId] || (map$$1[seriesId] = {}))[dataIndex] = 1;
+                }
+            }
+        }
+    }
+
+    function mapToArray(map$$1, isData) {
+        var result = [];
+        for (var i in map$$1) {
+            if (map$$1.hasOwnProperty(i) && map$$1[i] != null) {
+                if (isData) {
+                    result.push(+i);
+                }
+                else {
+                    var dataIndices = mapToArray(map$$1[i], true);
+                    dataIndices.length && result.push({seriesId: i, dataIndex: dataIndices});
+                }
+            }
+        }
+        return result;
+    }
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {Object} payload Contains dataIndex (means rawIndex) / dataIndexInside / name
+ *                         each of which can be Array or primary type.
+ * @return {number|Array.<number>} dataIndex If not found, return undefined/null.
+ */
+function queryDataIndex(data, payload) {
+    if (payload.dataIndexInside != null) {
+        return payload.dataIndexInside;
+    }
+    else if (payload.dataIndex != null) {
+        return isArray(payload.dataIndex)
+            ? map(payload.dataIndex, function (value) {
+                return data.indexOfRawIndex(value);
+            })
+            : data.indexOfRawIndex(payload.dataIndex);
+    }
+    else if (payload.name != null) {
+        return isArray(payload.name)
+            ? map(payload.name, function (value) {
+                return data.indexOfName(value);
+            })
+            : data.indexOfName(payload.name);
+    }
+}
+
+/**
+ * Enable property storage to any host object.
+ * Notice: Serialization is not supported.
+ *
+ * For example:
+ * var inner = zrUitl.makeInner();
+ *
+ * function some1(hostObj) {
+ *      inner(hostObj).someProperty = 1212;
+ *      ...
+ * }
+ * function some2() {
+ *      var fields = inner(this);
+ *      fields.someProperty1 = 1212;
+ *      fields.someProperty2 = 'xx';
+ *      ...
+ * }
+ *
+ * @return {Function}
+ */
+function makeInner() {
+    // Consider different scope by es module import.
+    var key = '__\0ec_inner_' + innerUniqueIndex++ + '_' + Math.random().toFixed(5);
+    return function (hostObj) {
+        return hostObj[key] || (hostObj[key] = {});
+    };
+}
+var innerUniqueIndex = 0;
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex, seriesId, seriesName,
+ *            geoIndex, geoId, geoName,
+ *            bmapIndex, bmapId, bmapName,
+ *            xAxisIndex, xAxisId, xAxisName,
+ *            yAxisIndex, yAxisId, yAxisName,
+ *            gridIndex, gridId, gridName,
+ *            ... (can be extended)
+ *        }
+ *        Each properties can be number|string|Array.<number>|Array.<string>
+ *        For example, a finder could be
+ *        {
+ *            seriesIndex: 3,
+ *            geoId: ['aa', 'cc'],
+ *            gridName: ['xx', 'rr']
+ *        }
+ *        xxxIndex can be set as 'all' (means all xxx) or 'none' (means not specify)
+ *        If nothing or null/undefined specified, return nothing.
+ * @param {Object} [opt]
+ * @param {string} [opt.defaultMainType]
+ * @param {Array.<string>} [opt.includeMainTypes]
+ * @return {Object} result like:
+ *        {
+ *            seriesModels: [seriesModel1, seriesModel2],
+ *            seriesModel: seriesModel1, // The first model
+ *            geoModels: [geoModel1, geoModel2],
+ *            geoModel: geoModel1, // The first model
+ *            ...
+ *        }
+ */
+function parseFinder(ecModel, finder, opt) {
+    if (isString(finder)) {
+        var obj = {};
+        obj[finder + 'Index'] = 0;
+        finder = obj;
+    }
+
+    var defaultMainType = opt && opt.defaultMainType;
+    if (defaultMainType
+        && !has(finder, defaultMainType + 'Index')
+        && !has(finder, defaultMainType + 'Id')
+        && !has(finder, defaultMainType + 'Name')
+    ) {
+        finder[defaultMainType + 'Index'] = 0;
+    }
+
+    var result = {};
+
+    each$2(finder, function (value, key) {
+        var value = finder[key];
+
+        // Exclude 'dataIndex' and other illgal keys.
+        if (key === 'dataIndex' || key === 'dataIndexInside') {
+            result[key] = value;
+            return;
+        }
+
+        var parsedKey = key.match(/^(\w+)(Index|Id|Name)$/) || [];
+        var mainType = parsedKey[1];
+        var queryType = (parsedKey[2] || '').toLowerCase();
+
+        if (!mainType
+            || !queryType
+            || value == null
+            || (queryType === 'index' && value === 'none')
+            || (opt && opt.includeMainTypes && indexOf(opt.includeMainTypes, mainType) < 0)
+        ) {
+            return;
+        }
+
+        var queryParam = {mainType: mainType};
+        if (queryType !== 'index' || value !== 'all') {
+            queryParam[queryType] = value;
+        }
+
+        var models = ecModel.queryComponents(queryParam);
+        result[mainType + 'Models'] = models;
+        result[mainType + 'Model'] = models[0];
+    });
+
+    return result;
+}
+
+function has(obj, prop) {
+    return obj && obj.hasOwnProperty(prop);
+}
+
+function setAttribute(dom, key, value) {
+    dom.setAttribute
+        ? dom.setAttribute(key, value)
+        : (dom[key] = value);
+}
+
+function getAttribute(dom, key) {
+    return dom.getAttribute
+        ? dom.getAttribute(key)
+        : dom[key];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TYPE_DELIMITER = '.';
+var IS_CONTAINER = '___EC__COMPONENT__CONTAINER___';
+
+/**
+ * Notice, parseClassType('') should returns {main: '', sub: ''}
+ * @public
+ */
+function parseClassType$1(componentType) {
+    var ret = {main: '', sub: ''};
+    if (componentType) {
+        componentType = componentType.split(TYPE_DELIMITER);
+        ret.main = componentType[0] || '';
+        ret.sub = componentType[1] || '';
+    }
+    return ret;
+}
+
+/**
+ * @public
+ */
+function checkClassType(componentType) {
+    assert$1(
+        /^[a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)?$/.test(componentType),
+        'componentType "' + componentType + '" illegal'
+    );
+}
+
+/**
+ * @public
+ */
+function enableClassExtend(RootClass, mandatoryMethods) {
+
+    RootClass.$constructor = RootClass;
+    RootClass.extend = function (proto) {
+
+        if (__DEV__) {
+            each$1(mandatoryMethods, function (method) {
+                if (!proto[method]) {
+                    console.warn(
+                        'Method `' + method + '` should be implemented'
+                        + (proto.type ? ' in ' + proto.type : '') + '.'
+                    );
+                }
+            });
+        }
+
+        var superClass = this;
+        var ExtendedClass = function () {
+            if (!proto.$constructor) {
+                superClass.apply(this, arguments);
+            }
+            else {
+                proto.$constructor.apply(this, arguments);
+            }
+        };
+
+        extend(ExtendedClass.prototype, proto);
+
+        ExtendedClass.extend = this.extend;
+        ExtendedClass.superCall = superCall;
+        ExtendedClass.superApply = superApply;
+        inherits(ExtendedClass, this);
+        ExtendedClass.superClass = superClass;
+
+        return ExtendedClass;
+    };
+}
+
+var classBase = 0;
+
+/**
+ * Can not use instanceof, consider different scope by
+ * cross domain or es module import in ec extensions.
+ * Mount a method "isInstance()" to Clz.
+ */
+function enableClassCheck(Clz) {
+    var classAttr = ['__\0is_clz', classBase++, Math.random().toFixed(3)].join('_');
+    Clz.prototype[classAttr] = true;
+
+    if (__DEV__) {
+        assert$1(!Clz.isInstance, 'The method "is" can not be defined.');
+    }
+
+    Clz.isInstance = function (obj) {
+        return !!(obj && obj[classAttr]);
+    };
+}
+
+// superCall should have class info, which can not be fetch from 'this'.
+// Consider this case:
+// class A has method f,
+// class B inherits class A, overrides method f, f call superApply('f'),
+// class C inherits class B, do not overrides method f,
+// then when method of class C is called, dead loop occured.
+function superCall(context, methodName) {
+    var args = slice(arguments, 2);
+    return this.superClass.prototype[methodName].apply(context, args);
+}
+
+function superApply(context, methodName, args) {
+    return this.superClass.prototype[methodName].apply(context, args);
+}
+
+/**
+ * @param {Object} entity
+ * @param {Object} options
+ * @param {boolean} [options.registerWhenExtend]
+ * @public
+ */
+function enableClassManagement(entity, options) {
+    options = options || {};
+
+    /**
+     * Component model classes
+     * key: componentType,
+     * value:
+     *     componentClass, when componentType is 'xxx'
+     *     or Object.<subKey, componentClass>, when componentType is 'xxx.yy'
+     * @type {Object}
+     */
+    var storage = {};
+
+    entity.registerClass = function (Clazz, componentType) {
+        if (componentType) {
+            checkClassType(componentType);
+            componentType = parseClassType$1(componentType);
+
+            if (!componentType.sub) {
+                if (__DEV__) {
+                    if (storage[componentType.main]) {
+                        console.warn(componentType.main + ' exists.');
+                    }
+                }
+                storage[componentType.main] = Clazz;
+            }
+            else if (componentType.sub !== IS_CONTAINER) {
+                var container = makeContainer(componentType);
+                container[componentType.sub] = Clazz;
+            }
+        }
+        return Clazz;
+    };
+
+    entity.getClass = function (componentMainType, subType, throwWhenNotFound) {
+        var Clazz = storage[componentMainType];
+
+        if (Clazz && Clazz[IS_CONTAINER]) {
+            Clazz = subType ? Clazz[subType] : null;
+        }
+
+        if (throwWhenNotFound && !Clazz) {
+            throw new Error(
+                !subType
+                    ? componentMainType + '.' + 'type should be specified.'
+                    : 'Component ' + componentMainType + '.' + (subType || '') + ' not exists. Load it first.'
+            );
+        }
+
+        return Clazz;
+    };
+
+    entity.getClassesByMainType = function (componentType) {
+        componentType = parseClassType$1(componentType);
+
+        var result = [];
+        var obj = storage[componentType.main];
+
+        if (obj && obj[IS_CONTAINER]) {
+            each$1(obj, function (o, type) {
+                type !== IS_CONTAINER && result.push(o);
+            });
+        }
+        else {
+            result.push(obj);
+        }
+
+        return result;
+    };
+
+    entity.hasClass = function (componentType) {
+        // Just consider componentType.main.
+        componentType = parseClassType$1(componentType);
+        return !!storage[componentType.main];
+    };
+
+    /**
+     * @return {Array.<string>} Like ['aa', 'bb'], but can not be ['aa.xx']
+     */
+    entity.getAllClassMainTypes = function () {
+        var types = [];
+        each$1(storage, function (obj, type) {
+            types.push(type);
+        });
+        return types;
+    };
+
+    /**
+     * If a main type is container and has sub types
+     * @param  {string}  mainType
+     * @return {boolean}
+     */
+    entity.hasSubTypes = function (componentType) {
+        componentType = parseClassType$1(componentType);
+        var obj = storage[componentType.main];
+        return obj && obj[IS_CONTAINER];
+    };
+
+    entity.parseClassType = parseClassType$1;
+
+    function makeContainer(componentType) {
+        var container = storage[componentType.main];
+        if (!container || !container[IS_CONTAINER]) {
+            container = storage[componentType.main] = {};
+            container[IS_CONTAINER] = true;
+        }
+        return container;
+    }
+
+    if (options.registerWhenExtend) {
+        var originalExtend = entity.extend;
+        if (originalExtend) {
+            entity.extend = function (proto) {
+                var ExtendedClass = originalExtend.call(this, proto);
+                return entity.registerClass(ExtendedClass, proto.type);
+            };
+        }
+    }
+
+    return entity;
+}
+
+/**
+ * @param {string|Array.<string>} properties
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Parse shadow style
+// TODO Only shallow path support
+var makeStyleMapper = function (properties) {
+    // Normalize
+    for (var i = 0; i < properties.length; i++) {
+        if (!properties[i][1]) {
+            properties[i][1] = properties[i][0];
+        }
+    }
+    return function (model, excludes, includes) {
+        var style = {};
+        for (var i = 0; i < properties.length; i++) {
+            var propName = properties[i][1];
+            if ((excludes && indexOf(excludes, propName) >= 0)
+                || (includes && indexOf(includes, propName) < 0)
+            ) {
+                continue;
+            }
+            var val = model.getShallow(propName);
+            if (val != null) {
+                style[properties[i][0]] = val;
+            }
+        }
+        return style;
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getLineStyle = makeStyleMapper(
+    [
+        ['lineWidth', 'width'],
+        ['stroke', 'color'],
+        ['opacity'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['shadowColor']
+    ]
+);
+
+var lineStyleMixin = {
+    getLineStyle: function (excludes) {
+        var style = getLineStyle(this, excludes);
+        var lineDash = this.getLineDash(style.lineWidth);
+        lineDash && (style.lineDash = lineDash);
+        return style;
+    },
+
+    getLineDash: function (lineWidth) {
+        if (lineWidth == null) {
+            lineWidth = 1;
+        }
+        var lineType = this.get('type');
+        var dotSize = Math.max(lineWidth, 2);
+        var dashSize = lineWidth * 4;
+        return (lineType === 'solid' || lineType == null) ? null
+            : (lineType === 'dashed' ? [dashSize, dashSize] : [dotSize, dotSize]);
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getAreaStyle = makeStyleMapper(
+    [
+        ['fill', 'color'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['opacity'],
+        ['shadowColor']
+    ]
+);
+
+var areaStyleMixin = {
+    getAreaStyle: function (excludes, includes) {
+        return getAreaStyle(this, excludes, includes);
+    }
+};
+
+/**
+ * 曲线辅助模块
+ * @module zrender/core/curve
+ * @author pissang(https://www.github.com/pissang)
+ */
+
+var mathPow = Math.pow;
+var mathSqrt$2 = Math.sqrt;
+
+var EPSILON$1 = 1e-8;
+var EPSILON_NUMERIC = 1e-4;
+
+var THREE_SQRT = mathSqrt$2(3);
+var ONE_THIRD = 1 / 3;
+
+// 临时变量
+var _v0 = create();
+var _v1 = create();
+var _v2 = create();
+
+function isAroundZero(val) {
+    return val > -EPSILON$1 && val < EPSILON$1;
+}
+function isNotAroundZero$1(val) {
+    return val > EPSILON$1 || val < -EPSILON$1;
+}
+/**
+ * 计算三次贝塞尔值
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @return {number}
+ */
+function cubicAt(p0, p1, p2, p3, t) {
+    var onet = 1 - t;
+    return onet * onet * (onet * p0 + 3 * t * p1)
+            + t * t * (t * p3 + 3 * onet * p2);
+}
+
+/**
+ * 计算三次贝塞尔导数值
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @return {number}
+ */
+function cubicDerivativeAt(p0, p1, p2, p3, t) {
+    var onet = 1 - t;
+    return 3 * (
+        ((p1 - p0) * onet + 2 * (p2 - p1) * t) * onet
+        + (p3 - p2) * t * t
+    );
+}
+
+/**
+ * 计算三次贝塞尔方程根，使用盛金公式
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} val
+ * @param  {Array.<number>} roots
+ * @return {number} 有效根数目
+ */
+function cubicRootAt(p0, p1, p2, p3, val, roots) {
+    // Evaluate roots of cubic functions
+    var a = p3 + 3 * (p1 - p2) - p0;
+    var b = 3 * (p2 - p1 * 2 + p0);
+    var c = 3 * (p1  - p0);
+    var d = p0 - val;
+
+    var A = b * b - 3 * a * c;
+    var B = b * c - 9 * a * d;
+    var C = c * c - 3 * b * d;
+
+    var n = 0;
+
+    if (isAroundZero(A) && isAroundZero(B)) {
+        if (isAroundZero(b)) {
+            roots[0] = 0;
+        }
+        else {
+            var t1 = -c / b;  //t1, t2, t3, b is not zero
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+    }
+    else {
+        var disc = B * B - 4 * A * C;
+
+        if (isAroundZero(disc)) {
+            var K = B / A;
+            var t1 = -b / a + K;  // t1, a is not zero
+            var t2 = -K / 2;  // t2, t3
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                roots[n++] = t2;
+            }
+        }
+        else if (disc > 0) {
+            var discSqrt = mathSqrt$2(disc);
+            var Y1 = A * b + 1.5 * a * (-B + discSqrt);
+            var Y2 = A * b + 1.5 * a * (-B - discSqrt);
+            if (Y1 < 0) {
+                Y1 = -mathPow(-Y1, ONE_THIRD);
+            }
+            else {
+                Y1 = mathPow(Y1, ONE_THIRD);
+            }
+            if (Y2 < 0) {
+                Y2 = -mathPow(-Y2, ONE_THIRD);
+            }
+            else {
+                Y2 = mathPow(Y2, ONE_THIRD);
+            }
+            var t1 = (-b - (Y1 + Y2)) / (3 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+        else {
+            var T = (2 * A * b - 3 * a * B) / (2 * mathSqrt$2(A * A * A));
+            var theta = Math.acos(T) / 3;
+            var ASqrt = mathSqrt$2(A);
+            var tmp = Math.cos(theta);
+
+            var t1 = (-b - 2 * ASqrt * tmp) / (3 * a);
+            var t2 = (-b + ASqrt * (tmp + THREE_SQRT * Math.sin(theta))) / (3 * a);
+            var t3 = (-b + ASqrt * (tmp - THREE_SQRT * Math.sin(theta))) / (3 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                roots[n++] = t2;
+            }
+            if (t3 >= 0 && t3 <= 1) {
+                roots[n++] = t3;
+            }
+        }
+    }
+    return n;
+}
+
+/**
+ * 计算三次贝塞尔方程极限值的位置
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {Array.<number>} extrema
+ * @return {number} 有效数目
+ */
+function cubicExtrema(p0, p1, p2, p3, extrema) {
+    var b = 6 * p2 - 12 * p1 + 6 * p0;
+    var a = 9 * p1 + 3 * p3 - 3 * p0 - 9 * p2;
+    var c = 3 * p1 - 3 * p0;
+
+    var n = 0;
+    if (isAroundZero(a)) {
+        if (isNotAroundZero$1(b)) {
+            var t1 = -c / b;
+            if (t1 >= 0 && t1 <=1) {
+                extrema[n++] = t1;
+            }
+        }
+    }
+    else {
+        var disc = b * b - 4 * a * c;
+        if (isAroundZero(disc)) {
+            extrema[0] = -b / (2 * a);
+        }
+        else if (disc > 0) {
+            var discSqrt = mathSqrt$2(disc);
+            var t1 = (-b + discSqrt) / (2 * a);
+            var t2 = (-b - discSqrt) / (2 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                extrema[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                extrema[n++] = t2;
+            }
+        }
+    }
+    return n;
+}
+
+/**
+ * 细分三次贝塞尔曲线
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @param  {Array.<number>} out
+ */
+function cubicSubdivide(p0, p1, p2, p3, t, out) {
+    var p01 = (p1 - p0) * t + p0;
+    var p12 = (p2 - p1) * t + p1;
+    var p23 = (p3 - p2) * t + p2;
+
+    var p012 = (p12 - p01) * t + p01;
+    var p123 = (p23 - p12) * t + p12;
+
+    var p0123 = (p123 - p012) * t + p012;
+    // Seg0
+    out[0] = p0;
+    out[1] = p01;
+    out[2] = p012;
+    out[3] = p0123;
+    // Seg1
+    out[4] = p0123;
+    out[5] = p123;
+    out[6] = p23;
+    out[7] = p3;
+}
+
+/**
+ * 投射点到三次贝塞尔曲线上，返回投射距离。
+ * 投射点有可能会有一个或者多个，这里只返回其中距离最短的一个。
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {number} x3
+ * @param {number} y3
+ * @param {number} x
+ * @param {number} y
+ * @param {Array.<number>} [out] 投射点
+ * @return {number}
+ */
+function cubicProjectPoint(
+    x0, y0, x1, y1, x2, y2, x3, y3,
+    x, y, out
+) {
+    // http://pomax.github.io/bezierinfo/#projections
+    var t;
+    var interval = 0.005;
+    var d = Infinity;
+    var prev;
+    var next;
+    var d1;
+    var d2;
+
+    _v0[0] = x;
+    _v0[1] = y;
+
+    // 先粗略估计一下可能的最小距离的 t 值
+    // PENDING
+    for (var _t = 0; _t < 1; _t += 0.05) {
+        _v1[0] = cubicAt(x0, x1, x2, x3, _t);
+        _v1[1] = cubicAt(y0, y1, y2, y3, _t);
+        d1 = distSquare(_v0, _v1);
+        if (d1 < d) {
+            t = _t;
+            d = d1;
+        }
+    }
+    d = Infinity;
+
+    // At most 32 iteration
+    for (var i = 0; i < 32; i++) {
+        if (interval < EPSILON_NUMERIC) {
+            break;
+        }
+        prev = t - interval;
+        next = t + interval;
+        // t - interval
+        _v1[0] = cubicAt(x0, x1, x2, x3, prev);
+        _v1[1] = cubicAt(y0, y1, y2, y3, prev);
+
+        d1 = distSquare(_v1, _v0);
+
+        if (prev >= 0 && d1 < d) {
+            t = prev;
+            d = d1;
+        }
+        else {
+            // t + interval
+            _v2[0] = cubicAt(x0, x1, x2, x3, next);
+            _v2[1] = cubicAt(y0, y1, y2, y3, next);
+            d2 = distSquare(_v2, _v0);
+
+            if (next <= 1 && d2 < d) {
+                t = next;
+                d = d2;
+            }
+            else {
+                interval *= 0.5;
+            }
+        }
+    }
+    // t
+    if (out) {
+        out[0] = cubicAt(x0, x1, x2, x3, t);
+        out[1] = cubicAt(y0, y1, y2, y3, t);
+    }
+    // console.log(interval, i);
+    return mathSqrt$2(d);
+}
+
+/**
+ * 计算二次方贝塞尔值
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @return {number}
+ */
+function quadraticAt(p0, p1, p2, t) {
+    var onet = 1 - t;
+    return onet * (onet * p0 + 2 * t * p1) + t * t * p2;
+}
+
+/**
+ * 计算二次方贝塞尔导数值
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @return {number}
+ */
+function quadraticDerivativeAt(p0, p1, p2, t) {
+    return 2 * ((1 - t) * (p1 - p0) + t * (p2 - p1));
+}
+
+/**
+ * 计算二次方贝塞尔方程根
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @param  {Array.<number>} roots
+ * @return {number} 有效根数目
+ */
+function quadraticRootAt(p0, p1, p2, val, roots) {
+    var a = p0 - 2 * p1 + p2;
+    var b = 2 * (p1 - p0);
+    var c = p0 - val;
+
+    var n = 0;
+    if (isAroundZero(a)) {
+        if (isNotAroundZero$1(b)) {
+            var t1 = -c / b;
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+    }
+    else {
+        var disc = b * b - 4 * a * c;
+        if (isAroundZero(disc)) {
+            var t1 = -b / (2 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+        else if (disc > 0) {
+            var discSqrt = mathSqrt$2(disc);
+            var t1 = (-b + discSqrt) / (2 * a);
+            var t2 = (-b - discSqrt) / (2 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                roots[n++] = t2;
+            }
+        }
+    }
+    return n;
+}
+
+/**
+ * 计算二次贝塞尔方程极限值
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @return {number}
+ */
+function quadraticExtremum(p0, p1, p2) {
+    var divider = p0 + p2 - 2 * p1;
+    if (divider === 0) {
+        // p1 is center of p0 and p2
+        return 0.5;
+    }
+    else {
+        return (p0 - p1) / divider;
+    }
+}
+
+/**
+ * 细分二次贝塞尔曲线
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @param  {Array.<number>} out
+ */
+function quadraticSubdivide(p0, p1, p2, t, out) {
+    var p01 = (p1 - p0) * t + p0;
+    var p12 = (p2 - p1) * t + p1;
+    var p012 = (p12 - p01) * t + p01;
+
+    // Seg0
+    out[0] = p0;
+    out[1] = p01;
+    out[2] = p012;
+
+    // Seg1
+    out[3] = p012;
+    out[4] = p12;
+    out[5] = p2;
+}
+
+/**
+ * 投射点到二次贝塞尔曲线上，返回投射距离。
+ * 投射点有可能会有一个或者多个，这里只返回其中距离最短的一个。
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {number} x
+ * @param {number} y
+ * @param {Array.<number>} out 投射点
+ * @return {number}
+ */
+function quadraticProjectPoint(
+    x0, y0, x1, y1, x2, y2,
+    x, y, out
+) {
+    // http://pomax.github.io/bezierinfo/#projections
+    var t;
+    var interval = 0.005;
+    var d = Infinity;
+
+    _v0[0] = x;
+    _v0[1] = y;
+
+    // 先粗略估计一下可能的最小距离的 t 值
+    // PENDING
+    for (var _t = 0; _t < 1; _t += 0.05) {
+        _v1[0] = quadraticAt(x0, x1, x2, _t);
+        _v1[1] = quadraticAt(y0, y1, y2, _t);
+        var d1 = distSquare(_v0, _v1);
+        if (d1 < d) {
+            t = _t;
+            d = d1;
+        }
+    }
+    d = Infinity;
+
+    // At most 32 iteration
+    for (var i = 0; i < 32; i++) {
+        if (interval < EPSILON_NUMERIC) {
+            break;
+        }
+        var prev = t - interval;
+        var next = t + interval;
+        // t - interval
+        _v1[0] = quadraticAt(x0, x1, x2, prev);
+        _v1[1] = quadraticAt(y0, y1, y2, prev);
+
+        var d1 = distSquare(_v1, _v0);
+
+        if (prev >= 0 && d1 < d) {
+            t = prev;
+            d = d1;
+        }
+        else {
+            // t + interval
+            _v2[0] = quadraticAt(x0, x1, x2, next);
+            _v2[1] = quadraticAt(y0, y1, y2, next);
+            var d2 = distSquare(_v2, _v0);
+            if (next <= 1 && d2 < d) {
+                t = next;
+                d = d2;
+            }
+            else {
+                interval *= 0.5;
+            }
+        }
+    }
+    // t
+    if (out) {
+        out[0] = quadraticAt(x0, x1, x2, t);
+        out[1] = quadraticAt(y0, y1, y2, t);
+    }
+    // console.log(interval, i);
+    return mathSqrt$2(d);
+}
+
+/**
+ * @author Yi Shen(https://github.com/pissang)
+ */
+
+var mathMin$3 = Math.min;
+var mathMax$3 = Math.max;
+var mathSin$2 = Math.sin;
+var mathCos$2 = Math.cos;
+var PI2 = Math.PI * 2;
+
+var start = create();
+var end = create();
+var extremity = create();
+
+/**
+ * 从顶点数组中计算出最小包围盒，写入`min`和`max`中
+ * @module zrender/core/bbox
+ * @param {Array<Object>} points 顶点数组
+ * @param {number} min
+ * @param {number} max
+ */
+function fromPoints(points, min$$1, max$$1) {
+    if (points.length === 0) {
+        return;
+    }
+    var p = points[0];
+    var left = p[0];
+    var right = p[0];
+    var top = p[1];
+    var bottom = p[1];
+    var i;
+
+    for (i = 1; i < points.length; i++) {
+        p = points[i];
+        left = mathMin$3(left, p[0]);
+        right = mathMax$3(right, p[0]);
+        top = mathMin$3(top, p[1]);
+        bottom = mathMax$3(bottom, p[1]);
+    }
+
+    min$$1[0] = left;
+    min$$1[1] = top;
+    max$$1[0] = right;
+    max$$1[1] = bottom;
+}
+
+/**
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromLine(x0, y0, x1, y1, min$$1, max$$1) {
+    min$$1[0] = mathMin$3(x0, x1);
+    min$$1[1] = mathMin$3(y0, y1);
+    max$$1[0] = mathMax$3(x0, x1);
+    max$$1[1] = mathMax$3(y0, y1);
+}
+
+var xDim = [];
+var yDim = [];
+/**
+ * 从三阶贝塞尔曲线(p0, p1, p2, p3)中计算出最小包围盒，写入`min`和`max`中
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {number} x3
+ * @param {number} y3
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromCubic(
+    x0, y0, x1, y1, x2, y2, x3, y3, min$$1, max$$1
+) {
+    var cubicExtrema$$1 = cubicExtrema;
+    var cubicAt$$1 = cubicAt;
+    var i;
+    var n = cubicExtrema$$1(x0, x1, x2, x3, xDim);
+    min$$1[0] = Infinity;
+    min$$1[1] = Infinity;
+    max$$1[0] = -Infinity;
+    max$$1[1] = -Infinity;
+
+    for (i = 0; i < n; i++) {
+        var x = cubicAt$$1(x0, x1, x2, x3, xDim[i]);
+        min$$1[0] = mathMin$3(x, min$$1[0]);
+        max$$1[0] = mathMax$3(x, max$$1[0]);
+    }
+    n = cubicExtrema$$1(y0, y1, y2, y3, yDim);
+    for (i = 0; i < n; i++) {
+        var y = cubicAt$$1(y0, y1, y2, y3, yDim[i]);
+        min$$1[1] = mathMin$3(y, min$$1[1]);
+        max$$1[1] = mathMax$3(y, max$$1[1]);
+    }
+
+    min$$1[0] = mathMin$3(x0, min$$1[0]);
+    max$$1[0] = mathMax$3(x0, max$$1[0]);
+    min$$1[0] = mathMin$3(x3, min$$1[0]);
+    max$$1[0] = mathMax$3(x3, max$$1[0]);
+
+    min$$1[1] = mathMin$3(y0, min$$1[1]);
+    max$$1[1] = mathMax$3(y0, max$$1[1]);
+    min$$1[1] = mathMin$3(y3, min$$1[1]);
+    max$$1[1] = mathMax$3(y3, max$$1[1]);
+}
+
+/**
+ * 从二阶贝塞尔曲线(p0, p1, p2)中计算出最小包围盒，写入`min`和`max`中
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromQuadratic(x0, y0, x1, y1, x2, y2, min$$1, max$$1) {
+    var quadraticExtremum$$1 = quadraticExtremum;
+    var quadraticAt$$1 = quadraticAt;
+    // Find extremities, where derivative in x dim or y dim is zero
+    var tx =
+        mathMax$3(
+            mathMin$3(quadraticExtremum$$1(x0, x1, x2), 1), 0
+        );
+    var ty =
+        mathMax$3(
+            mathMin$3(quadraticExtremum$$1(y0, y1, y2), 1), 0
+        );
+
+    var x = quadraticAt$$1(x0, x1, x2, tx);
+    var y = quadraticAt$$1(y0, y1, y2, ty);
+
+    min$$1[0] = mathMin$3(x0, x2, x);
+    min$$1[1] = mathMin$3(y0, y2, y);
+    max$$1[0] = mathMax$3(x0, x2, x);
+    max$$1[1] = mathMax$3(y0, y2, y);
+}
+
+/**
+ * 从圆弧中计算出最小包围盒，写入`min`和`max`中
+ * @method
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x
+ * @param {number} y
+ * @param {number} rx
+ * @param {number} ry
+ * @param {number} startAngle
+ * @param {number} endAngle
+ * @param {number} anticlockwise
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromArc(
+    x, y, rx, ry, startAngle, endAngle, anticlockwise, min$$1, max$$1
+) {
+    var vec2Min = min;
+    var vec2Max = max;
+
+    var diff = Math.abs(startAngle - endAngle);
+
+
+    if (diff % PI2 < 1e-4 && diff > 1e-4) {
+        // Is a circle
+        min$$1[0] = x - rx;
+        min$$1[1] = y - ry;
+        max$$1[0] = x + rx;
+        max$$1[1] = y + ry;
+        return;
+    }
+
+    start[0] = mathCos$2(startAngle) * rx + x;
+    start[1] = mathSin$2(startAngle) * ry + y;
+
+    end[0] = mathCos$2(endAngle) * rx + x;
+    end[1] = mathSin$2(endAngle) * ry + y;
+
+    vec2Min(min$$1, start, end);
+    vec2Max(max$$1, start, end);
+
+    // Thresh to [0, Math.PI * 2]
+    startAngle = startAngle % (PI2);
+    if (startAngle < 0) {
+        startAngle = startAngle + PI2;
+    }
+    endAngle = endAngle % (PI2);
+    if (endAngle < 0) {
+        endAngle = endAngle + PI2;
+    }
+
+    if (startAngle > endAngle && !anticlockwise) {
+        endAngle += PI2;
+    }
+    else if (startAngle < endAngle && anticlockwise) {
+        startAngle += PI2;
+    }
+    if (anticlockwise) {
+        var tmp = endAngle;
+        endAngle = startAngle;
+        startAngle = tmp;
+    }
+
+    // var number = 0;
+    // var step = (anticlockwise ? -Math.PI : Math.PI) / 2;
+    for (var angle = 0; angle < endAngle; angle += Math.PI / 2) {
+        if (angle > startAngle) {
+            extremity[0] = mathCos$2(angle) * rx + x;
+            extremity[1] = mathSin$2(angle) * ry + y;
+
+            vec2Min(min$$1, extremity, min$$1);
+            vec2Max(max$$1, extremity, max$$1);
+        }
+    }
+}
+
+/**
+ * Path 代理，可以在`buildPath`中用于替代`ctx`, 会保存每个path操作的命令到pathCommands属性中
+ * 可以用于 isInsidePath 判断以及获取boundingRect
+ *
+ * @module zrender/core/PathProxy
+ * @author Yi Shen (http://www.github.com/pissang)
+ */
+
+// TODO getTotalLength, getPointAtLength
+
+var CMD = {
+    M: 1,
+    L: 2,
+    C: 3,
+    Q: 4,
+    A: 5,
+    Z: 6,
+    // Rect
+    R: 7
+};
+
+// var CMD_MEM_SIZE = {
+//     M: 3,
+//     L: 3,
+//     C: 7,
+//     Q: 5,
+//     A: 9,
+//     R: 5,
+//     Z: 1
+// };
+
+var min$1 = [];
+var max$1 = [];
+var min2 = [];
+var max2 = [];
+var mathMin$2 = Math.min;
+var mathMax$2 = Math.max;
+var mathCos$1 = Math.cos;
+var mathSin$1 = Math.sin;
+var mathSqrt$1 = Math.sqrt;
+var mathAbs = Math.abs;
+
+var hasTypedArray = typeof Float32Array != 'undefined';
+
+/**
+ * @alias module:zrender/core/PathProxy
+ * @constructor
+ */
+var PathProxy = function (notSaveData) {
+
+    this._saveData = !(notSaveData || false);
+
+    if (this._saveData) {
+        /**
+         * Path data. Stored as flat array
+         * @type {Array.<Object>}
+         */
+        this.data = [];
+    }
+
+    this._ctx = null;
+};
+
+/**
+ * 快速计算Path包围盒（并不是最小包围盒）
+ * @return {Object}
+ */
+PathProxy.prototype = {
+
+    constructor: PathProxy,
+
+    _xi: 0,
+    _yi: 0,
+
+    _x0: 0,
+    _y0: 0,
+    // Unit x, Unit y. Provide for avoiding drawing that too short line segment
+    _ux: 0,
+    _uy: 0,
+
+    _len: 0,
+
+    _lineDash: null,
+
+    _dashOffset: 0,
+
+    _dashIdx: 0,
+
+    _dashSum: 0,
+
+    /**
+     * @readOnly
+     */
+    setScale: function (sx, sy) {
+        this._ux = mathAbs(1 / devicePixelRatio / sx) || 0;
+        this._uy = mathAbs(1 / devicePixelRatio / sy) || 0;
+    },
+
+    getContext: function () {
+        return this._ctx;
+    },
+
+    /**
+     * @param  {CanvasRenderingContext2D} ctx
+     * @return {module:zrender/core/PathProxy}
+     */
+    beginPath: function (ctx) {
+
+        this._ctx = ctx;
+
+        ctx && ctx.beginPath();
+
+        ctx && (this.dpr = ctx.dpr);
+
+        // Reset
+        if (this._saveData) {
+            this._len = 0;
+        }
+
+        if (this._lineDash) {
+            this._lineDash = null;
+
+            this._dashOffset = 0;
+        }
+
+        return this;
+    },
+
+    /**
+     * @param  {number} x
+     * @param  {number} y
+     * @return {module:zrender/core/PathProxy}
+     */
+    moveTo: function (x, y) {
+        this.addData(CMD.M, x, y);
+        this._ctx && this._ctx.moveTo(x, y);
+
+        // x0, y0, xi, yi 是记录在 _dashedXXXXTo 方法中使用
+        // xi, yi 记录当前点, x0, y0 在 closePath 的时候回到起始点。
+        // 有可能在 beginPath 之后直接调用 lineTo，这时候 x0, y0 需要
+        // 在 lineTo 方法中记录，这里先不考虑这种情况，dashed line 也只在 IE10- 中不支持
+        this._x0 = x;
+        this._y0 = y;
+
+        this._xi = x;
+        this._yi = y;
+
+        return this;
+    },
+
+    /**
+     * @param  {number} x
+     * @param  {number} y
+     * @return {module:zrender/core/PathProxy}
+     */
+    lineTo: function (x, y) {
+        var exceedUnit = mathAbs(x - this._xi) > this._ux
+            || mathAbs(y - this._yi) > this._uy
+            // Force draw the first segment
+            || this._len < 5;
+
+        this.addData(CMD.L, x, y);
+
+        if (this._ctx && exceedUnit) {
+            this._needsDash() ? this._dashedLineTo(x, y)
+                : this._ctx.lineTo(x, y);
+        }
+        if (exceedUnit) {
+            this._xi = x;
+            this._yi = y;
+        }
+
+        return this;
+    },
+
+    /**
+     * @param  {number} x1
+     * @param  {number} y1
+     * @param  {number} x2
+     * @param  {number} y2
+     * @param  {number} x3
+     * @param  {number} y3
+     * @return {module:zrender/core/PathProxy}
+     */
+    bezierCurveTo: function (x1, y1, x2, y2, x3, y3) {
+        this.addData(CMD.C, x1, y1, x2, y2, x3, y3);
+        if (this._ctx) {
+            this._needsDash() ? this._dashedBezierTo(x1, y1, x2, y2, x3, y3)
+                : this._ctx.bezierCurveTo(x1, y1, x2, y2, x3, y3);
+        }
+        this._xi = x3;
+        this._yi = y3;
+        return this;
+    },
+
+    /**
+     * @param  {number} x1
+     * @param  {number} y1
+     * @param  {number} x2
+     * @param  {number} y2
+     * @return {module:zrender/core/PathProxy}
+     */
+    quadraticCurveTo: function (x1, y1, x2, y2) {
+        this.addData(CMD.Q, x1, y1, x2, y2);
+        if (this._ctx) {
+            this._needsDash() ? this._dashedQuadraticTo(x1, y1, x2, y2)
+                : this._ctx.quadraticCurveTo(x1, y1, x2, y2);
+        }
+        this._xi = x2;
+        this._yi = y2;
+        return this;
+    },
+
+    /**
+     * @param  {number} cx
+     * @param  {number} cy
+     * @param  {number} r
+     * @param  {number} startAngle
+     * @param  {number} endAngle
+     * @param  {boolean} anticlockwise
+     * @return {module:zrender/core/PathProxy}
+     */
+    arc: function (cx, cy, r, startAngle, endAngle, anticlockwise) {
+        this.addData(
+            CMD.A, cx, cy, r, r, startAngle, endAngle - startAngle, 0, anticlockwise ? 0 : 1
+        );
+        this._ctx && this._ctx.arc(cx, cy, r, startAngle, endAngle, anticlockwise);
+
+        this._xi = mathCos$1(endAngle) * r + cx;
+        this._yi = mathSin$1(endAngle) * r + cx;
+        return this;
+    },
+
+    // TODO
+    arcTo: function (x1, y1, x2, y2, radius) {
+        if (this._ctx) {
+            this._ctx.arcTo(x1, y1, x2, y2, radius);
+        }
+        return this;
+    },
+
+    // TODO
+    rect: function (x, y, w, h) {
+        this._ctx && this._ctx.rect(x, y, w, h);
+        this.addData(CMD.R, x, y, w, h);
+        return this;
+    },
+
+    /**
+     * @return {module:zrender/core/PathProxy}
+     */
+    closePath: function () {
+        this.addData(CMD.Z);
+
+        var ctx = this._ctx;
+        var x0 = this._x0;
+        var y0 = this._y0;
+        if (ctx) {
+            this._needsDash() && this._dashedLineTo(x0, y0);
+            ctx.closePath();
+        }
+
+        this._xi = x0;
+        this._yi = y0;
+        return this;
+    },
+
+    /**
+     * Context 从外部传入，因为有可能是 rebuildPath 完之后再 fill。
+     * stroke 同样
+     * @param {CanvasRenderingContext2D} ctx
+     * @return {module:zrender/core/PathProxy}
+     */
+    fill: function (ctx) {
+        ctx && ctx.fill();
+        this.toStatic();
+    },
+
+    /**
+     * @param {CanvasRenderingContext2D} ctx
+     * @return {module:zrender/core/PathProxy}
+     */
+    stroke: function (ctx) {
+        ctx && ctx.stroke();
+        this.toStatic();
+    },
+
+    /**
+     * 必须在其它绘制命令前调用
+     * Must be invoked before all other path drawing methods
+     * @return {module:zrender/core/PathProxy}
+     */
+    setLineDash: function (lineDash) {
+        if (lineDash instanceof Array) {
+            this._lineDash = lineDash;
+
+            this._dashIdx = 0;
+
+            var lineDashSum = 0;
+            for (var i = 0; i < lineDash.length; i++) {
+                lineDashSum += lineDash[i];
+            }
+            this._dashSum = lineDashSum;
+        }
+        return this;
+    },
+
+    /**
+     * 必须在其它绘制命令前调用
+     * Must be invoked before all other path drawing methods
+     * @return {module:zrender/core/PathProxy}
+     */
+    setLineDashOffset: function (offset) {
+        this._dashOffset = offset;
+        return this;
+    },
+
+    /**
+     *
+     * @return {boolean}
+     */
+    len: function () {
+        return this._len;
+    },
+
+    /**
+     * 直接设置 Path 数据
+     */
+    setData: function (data) {
+
+        var len$$1 = data.length;
+
+        if (! (this.data && this.data.length == len$$1) && hasTypedArray) {
+            this.data = new Float32Array(len$$1);
+        }
+
+        for (var i = 0; i < len$$1; i++) {
+            this.data[i] = data[i];
+        }
+
+        this._len = len$$1;
+    },
+
+    /**
+     * 添加子路径
+     * @param {module:zrender/core/PathProxy|Array.<module:zrender/core/PathProxy>} path
+     */
+    appendPath: function (path) {
+        if (!(path instanceof Array)) {
+            path = [path];
+        }
+        var len$$1 = path.length;
+        var appendSize = 0;
+        var offset = this._len;
+        for (var i = 0; i < len$$1; i++) {
+            appendSize += path[i].len();
+        }
+        if (hasTypedArray && (this.data instanceof Float32Array)) {
+            this.data = new Float32Array(offset + appendSize);
+        }
+        for (var i = 0; i < len$$1; i++) {
+            var appendPathData = path[i].data;
+            for (var k = 0; k < appendPathData.length; k++) {
+                this.data[offset++] = appendPathData[k];
+            }
+        }
+        this._len = offset;
+    },
+
+    /**
+     * 填充 Path 数据。
+     * 尽量复用而不申明新的数组。大部分图形重绘的指令数据长度都是不变的。
+     */
+    addData: function (cmd) {
+        if (!this._saveData) {
+            return;
+        }
+
+        var data = this.data;
+        if (this._len + arguments.length > data.length) {
+            // 因为之前的数组已经转换成静态的 Float32Array
+            // 所以不够用时需要扩展一个新的动态数组
+            this._expandData();
+            data = this.data;
+        }
+        for (var i = 0; i < arguments.length; i++) {
+            data[this._len++] = arguments[i];
+        }
+
+        this._prevCmd = cmd;
+    },
+
+    _expandData: function () {
+        // Only if data is Float32Array
+        if (!(this.data instanceof Array)) {
+            var newData = [];
+            for (var i = 0; i < this._len; i++) {
+                newData[i] = this.data[i];
+            }
+            this.data = newData;
+        }
+    },
+
+    /**
+     * If needs js implemented dashed line
+     * @return {boolean}
+     * @private
+     */
+    _needsDash: function () {
+        return this._lineDash;
+    },
+
+    _dashedLineTo: function (x1, y1) {
+        var dashSum = this._dashSum;
+        var offset = this._dashOffset;
+        var lineDash = this._lineDash;
+        var ctx = this._ctx;
+
+        var x0 = this._xi;
+        var y0 = this._yi;
+        var dx = x1 - x0;
+        var dy = y1 - y0;
+        var dist$$1 = mathSqrt$1(dx * dx + dy * dy);
+        var x = x0;
+        var y = y0;
+        var dash;
+        var nDash = lineDash.length;
+        var idx;
+        dx /= dist$$1;
+        dy /= dist$$1;
+
+        if (offset < 0) {
+            // Convert to positive offset
+            offset = dashSum + offset;
+        }
+        offset %= dashSum;
+        x -= offset * dx;
+        y -= offset * dy;
+
+        while ((dx > 0 && x <= x1) || (dx < 0 && x >= x1)
+        || (dx == 0 && ((dy > 0 && y <= y1) || (dy < 0 && y >= y1)))) {
+            idx = this._dashIdx;
+            dash = lineDash[idx];
+            x += dx * dash;
+            y += dy * dash;
+            this._dashIdx = (idx + 1) % nDash;
+            // Skip positive offset
+            if ((dx > 0 && x < x0) || (dx < 0 && x > x0) || (dy > 0 && y < y0) || (dy < 0 && y > y0)) {
+                continue;
+            }
+            ctx[idx % 2 ? 'moveTo' : 'lineTo'](
+                dx >= 0 ? mathMin$2(x, x1) : mathMax$2(x, x1),
+                dy >= 0 ? mathMin$2(y, y1) : mathMax$2(y, y1)
+            );
+        }
+        // Offset for next lineTo
+        dx = x - x1;
+        dy = y - y1;
+        this._dashOffset = -mathSqrt$1(dx * dx + dy * dy);
+    },
+
+    // Not accurate dashed line to
+    _dashedBezierTo: function (x1, y1, x2, y2, x3, y3) {
+        var dashSum = this._dashSum;
+        var offset = this._dashOffset;
+        var lineDash = this._lineDash;
+        var ctx = this._ctx;
+
+        var x0 = this._xi;
+        var y0 = this._yi;
+        var t;
+        var dx;
+        var dy;
+        var cubicAt$$1 = cubicAt;
+        var bezierLen = 0;
+        var idx = this._dashIdx;
+        var nDash = lineDash.length;
+
+        var x;
+        var y;
+
+        var tmpLen = 0;
+
+        if (offset < 0) {
+            // Convert to positive offset
+            offset = dashSum + offset;
+        }
+        offset %= dashSum;
+        // Bezier approx length
+        for (t = 0; t < 1; t += 0.1) {
+            dx = cubicAt$$1(x0, x1, x2, x3, t + 0.1)
+                - cubicAt$$1(x0, x1, x2, x3, t);
+            dy = cubicAt$$1(y0, y1, y2, y3, t + 0.1)
+                - cubicAt$$1(y0, y1, y2, y3, t);
+            bezierLen += mathSqrt$1(dx * dx + dy * dy);
+        }
+
+        // Find idx after add offset
+        for (; idx < nDash; idx++) {
+            tmpLen += lineDash[idx];
+            if (tmpLen > offset) {
+                break;
+            }
+        }
+        t = (tmpLen - offset) / bezierLen;
+
+        while (t <= 1) {
+
+            x = cubicAt$$1(x0, x1, x2, x3, t);
+            y = cubicAt$$1(y0, y1, y2, y3, t);
+
+            // Use line to approximate dashed bezier
+            // Bad result if dash is long
+            idx % 2 ? ctx.moveTo(x, y)
+                : ctx.lineTo(x, y);
+
+            t += lineDash[idx] / bezierLen;
+
+            idx = (idx + 1) % nDash;
+        }
+
+        // Finish the last segment and calculate the new offset
+        (idx % 2 !== 0) && ctx.lineTo(x3, y3);
+        dx = x3 - x;
+        dy = y3 - y;
+        this._dashOffset = -mathSqrt$1(dx * dx + dy * dy);
+    },
+
+    _dashedQuadraticTo: function (x1, y1, x2, y2) {
+        // Convert quadratic to cubic using degree elevation
+        var x3 = x2;
+        var y3 = y2;
+        x2 = (x2 + 2 * x1) / 3;
+        y2 = (y2 + 2 * y1) / 3;
+        x1 = (this._xi + 2 * x1) / 3;
+        y1 = (this._yi + 2 * y1) / 3;
+
+        this._dashedBezierTo(x1, y1, x2, y2, x3, y3);
+    },
+
+    /**
+     * 转成静态的 Float32Array 减少堆内存占用
+     * Convert dynamic array to static Float32Array
+     */
+    toStatic: function () {
+        var data = this.data;
+        if (data instanceof Array) {
+            data.length = this._len;
+            if (hasTypedArray) {
+                this.data = new Float32Array(data);
+            }
+        }
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getBoundingRect: function () {
+        min$1[0] = min$1[1] = min2[0] = min2[1] = Number.MAX_VALUE;
+        max$1[0] = max$1[1] = max2[0] = max2[1] = -Number.MAX_VALUE;
+
+        var data = this.data;
+        var xi = 0;
+        var yi = 0;
+        var x0 = 0;
+        var y0 = 0;
+
+        for (var i = 0; i < data.length;) {
+            var cmd = data[i++];
+
+            if (i == 1) {
+                // 如果第一个命令是 L, C, Q
+                // 则 previous point 同绘制命令的第一个 point
+                //
+                // 第一个命令为 Arc 的情况下会在后面特殊处理
+                xi = data[i];
+                yi = data[i + 1];
+
+                x0 = xi;
+                y0 = yi;
+            }
+
+            switch (cmd) {
+                case CMD.M:
+                    // moveTo 命令重新创建一个新的 subpath, 并且更新新的起点
+                    // 在 closePath 的时候使用
+                    x0 = data[i++];
+                    y0 = data[i++];
+                    xi = x0;
+                    yi = y0;
+                    min2[0] = x0;
+                    min2[1] = y0;
+                    max2[0] = x0;
+                    max2[1] = y0;
+                    break;
+                case CMD.L:
+                    fromLine(xi, yi, data[i], data[i + 1], min2, max2);
+                    xi = data[i++];
+                    yi = data[i++];
+                    break;
+                case CMD.C:
+                    fromCubic(
+                        xi, yi, data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1],
+                        min2, max2
+                    );
+                    xi = data[i++];
+                    yi = data[i++];
+                    break;
+                case CMD.Q:
+                    fromQuadratic(
+                        xi, yi, data[i++], data[i++], data[i], data[i + 1],
+                        min2, max2
+                    );
+                    xi = data[i++];
+                    yi = data[i++];
+                    break;
+                case CMD.A:
+                    // TODO Arc 判断的开销比较大
+                    var cx = data[i++];
+                    var cy = data[i++];
+                    var rx = data[i++];
+                    var ry = data[i++];
+                    var startAngle = data[i++];
+                    var endAngle = data[i++] + startAngle;
+                    // TODO Arc 旋转
+                    var psi = data[i++];
+                    var anticlockwise = 1 - data[i++];
+
+                    if (i == 1) {
+                        // 直接使用 arc 命令
+                        // 第一个命令起点还未定义
+                        x0 = mathCos$1(startAngle) * rx + cx;
+                        y0 = mathSin$1(startAngle) * ry + cy;
+                    }
+
+                    fromArc(
+                        cx, cy, rx, ry, startAngle, endAngle,
+                        anticlockwise, min2, max2
+                    );
+
+                    xi = mathCos$1(endAngle) * rx + cx;
+                    yi = mathSin$1(endAngle) * ry + cy;
+                    break;
+                case CMD.R:
+                    x0 = xi = data[i++];
+                    y0 = yi = data[i++];
+                    var width = data[i++];
+                    var height = data[i++];
+                    // Use fromLine
+                    fromLine(x0, y0, x0 + width, y0 + height, min2, max2);
+                    break;
+                case CMD.Z:
+                    xi = x0;
+                    yi = y0;
+                    break;
+            }
+
+            // Union
+            min(min$1, min$1, min2);
+            max(max$1, max$1, max2);
+        }
+
+        // No data
+        if (i === 0) {
+            min$1[0] = min$1[1] = max$1[0] = max$1[1] = 0;
+        }
+
+        return new BoundingRect(
+            min$1[0], min$1[1], max$1[0] - min$1[0], max$1[1] - min$1[1]
+        );
+    },
+
+    /**
+     * Rebuild path from current data
+     * Rebuild path will not consider javascript implemented line dash.
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    rebuildPath: function (ctx) {
+        var d = this.data;
+        var x0, y0;
+        var xi, yi;
+        var x, y;
+        var ux = this._ux;
+        var uy = this._uy;
+        var len$$1 = this._len;
+        for (var i = 0; i < len$$1;) {
+            var cmd = d[i++];
+
+            if (i == 1) {
+                // 如果第一个命令是 L, C, Q
+                // 则 previous point 同绘制命令的第一个 point
+                //
+                // 第一个命令为 Arc 的情况下会在后面特殊处理
+                xi = d[i];
+                yi = d[i + 1];
+
+                x0 = xi;
+                y0 = yi;
+            }
+            switch (cmd) {
+                case CMD.M:
+                    x0 = xi = d[i++];
+                    y0 = yi = d[i++];
+                    ctx.moveTo(xi, yi);
+                    break;
+                case CMD.L:
+                    x = d[i++];
+                    y = d[i++];
+                    // Not draw too small seg between
+                    if (mathAbs(x - xi) > ux || mathAbs(y - yi) > uy || i === len$$1 - 1) {
+                        ctx.lineTo(x, y);
+                        xi = x;
+                        yi = y;
+                    }
+                    break;
+                case CMD.C:
+                    ctx.bezierCurveTo(
+                        d[i++], d[i++], d[i++], d[i++], d[i++], d[i++]
+                    );
+                    xi = d[i - 2];
+                    yi = d[i - 1];
+                    break;
+                case CMD.Q:
+                    ctx.quadraticCurveTo(d[i++], d[i++], d[i++], d[i++]);
+                    xi = d[i - 2];
+                    yi = d[i - 1];
+                    break;
+                case CMD.A:
+                    var cx = d[i++];
+                    var cy = d[i++];
+                    var rx = d[i++];
+                    var ry = d[i++];
+                    var theta = d[i++];
+                    var dTheta = d[i++];
+                    var psi = d[i++];
+                    var fs = d[i++];
+                    var r = (rx > ry) ? rx : ry;
+                    var scaleX = (rx > ry) ? 1 : rx / ry;
+                    var scaleY = (rx > ry) ? ry / rx : 1;
+                    var isEllipse = Math.abs(rx - ry) > 1e-3;
+                    var endAngle = theta + dTheta;
+                    if (isEllipse) {
+                        ctx.translate(cx, cy);
+                        ctx.rotate(psi);
+                        ctx.scale(scaleX, scaleY);
+                        ctx.arc(0, 0, r, theta, endAngle, 1 - fs);
+                        ctx.scale(1 / scaleX, 1 / scaleY);
+                        ctx.rotate(-psi);
+                        ctx.translate(-cx, -cy);
+                    }
+                    else {
+                        ctx.arc(cx, cy, r, theta, endAngle, 1 - fs);
+                    }
+
+                    if (i == 1) {
+                        // 直接使用 arc 命令
+                        // 第一个命令起点还未定义
+                        x0 = mathCos$1(theta) * rx + cx;
+                        y0 = mathSin$1(theta) * ry + cy;
+                    }
+                    xi = mathCos$1(endAngle) * rx + cx;
+                    yi = mathSin$1(endAngle) * ry + cy;
+                    break;
+                case CMD.R:
+                    x0 = xi = d[i];
+                    y0 = yi = d[i + 1];
+                    ctx.rect(d[i++], d[i++], d[i++], d[i++]);
+                    break;
+                case CMD.Z:
+                    ctx.closePath();
+                    xi = x0;
+                    yi = y0;
+            }
+        }
+    }
+};
+
+PathProxy.CMD = CMD;
+
+/**
+ * 线段包含判断
+ * @param  {number}  x0
+ * @param  {number}  y0
+ * @param  {number}  x1
+ * @param  {number}  y1
+ * @param  {number}  lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {boolean}
+ */
+function containStroke$1(x0, y0, x1, y1, lineWidth, x, y) {
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+    var _a = 0;
+    var _b = x0;
+    // Quick reject
+    if (
+        (y > y0 + _l && y > y1 + _l)
+        || (y < y0 - _l && y < y1 - _l)
+        || (x > x0 + _l && x > x1 + _l)
+        || (x < x0 - _l && x < x1 - _l)
+    ) {
+        return false;
+    }
+
+    if (x0 !== x1) {
+        _a = (y0 - y1) / (x0 - x1);
+        _b = (x0 * y1 - x1 * y0) / (x0 - x1) ;
+    }
+    else {
+        return Math.abs(x - x0) <= _l / 2;
+    }
+    var tmp = _a * x - y + _b;
+    var _s = tmp * tmp / (_a * _a + 1);
+    return _s <= _l / 2 * _l / 2;
+}
+
+/**
+ * 三次贝塞尔曲线描边包含判断
+ * @param  {number}  x0
+ * @param  {number}  y0
+ * @param  {number}  x1
+ * @param  {number}  y1
+ * @param  {number}  x2
+ * @param  {number}  y2
+ * @param  {number}  x3
+ * @param  {number}  y3
+ * @param  {number}  lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {boolean}
+ */
+function containStroke$2(x0, y0, x1, y1, x2, y2, x3, y3, lineWidth, x, y) {
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+    // Quick reject
+    if (
+        (y > y0 + _l && y > y1 + _l && y > y2 + _l && y > y3 + _l)
+        || (y < y0 - _l && y < y1 - _l && y < y2 - _l && y < y3 - _l)
+        || (x > x0 + _l && x > x1 + _l && x > x2 + _l && x > x3 + _l)
+        || (x < x0 - _l && x < x1 - _l && x < x2 - _l && x < x3 - _l)
+    ) {
+        return false;
+    }
+    var d = cubicProjectPoint(
+        x0, y0, x1, y1, x2, y2, x3, y3,
+        x, y, null
+    );
+    return d <= _l / 2;
+}
+
+/**
+ * 二次贝塞尔曲线描边包含判断
+ * @param  {number}  x0
+ * @param  {number}  y0
+ * @param  {number}  x1
+ * @param  {number}  y1
+ * @param  {number}  x2
+ * @param  {number}  y2
+ * @param  {number}  lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {boolean}
+ */
+function containStroke$3(x0, y0, x1, y1, x2, y2, lineWidth, x, y) {
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+    // Quick reject
+    if (
+        (y > y0 + _l && y > y1 + _l && y > y2 + _l)
+        || (y < y0 - _l && y < y1 - _l && y < y2 - _l)
+        || (x > x0 + _l && x > x1 + _l && x > x2 + _l)
+        || (x < x0 - _l && x < x1 - _l && x < x2 - _l)
+    ) {
+        return false;
+    }
+    var d = quadraticProjectPoint(
+        x0, y0, x1, y1, x2, y2,
+        x, y, null
+    );
+    return d <= _l / 2;
+}
+
+var PI2$3 = Math.PI * 2;
+
+function normalizeRadian(angle) {
+    angle %= PI2$3;
+    if (angle < 0) {
+        angle += PI2$3;
+    }
+    return angle;
+}
+
+var PI2$2 = Math.PI * 2;
+
+/**
+ * 圆弧描边包含判断
+ * @param  {number}  cx
+ * @param  {number}  cy
+ * @param  {number}  r
+ * @param  {number}  startAngle
+ * @param  {number}  endAngle
+ * @param  {boolean}  anticlockwise
+ * @param  {number} lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {Boolean}
+ */
+function containStroke$4(
+    cx, cy, r, startAngle, endAngle, anticlockwise,
+    lineWidth, x, y
+) {
+
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+
+    x -= cx;
+    y -= cy;
+    var d = Math.sqrt(x * x + y * y);
+
+    if ((d - _l > r) || (d + _l < r)) {
+        return false;
+    }
+    if (Math.abs(startAngle - endAngle) % PI2$2 < 1e-4) {
+        // Is a circle
+        return true;
+    }
+    if (anticlockwise) {
+        var tmp = startAngle;
+        startAngle = normalizeRadian(endAngle);
+        endAngle = normalizeRadian(tmp);
+    } else {
+        startAngle = normalizeRadian(startAngle);
+        endAngle = normalizeRadian(endAngle);
+    }
+    if (startAngle > endAngle) {
+        endAngle += PI2$2;
+    }
+
+    var angle = Math.atan2(y, x);
+    if (angle < 0) {
+        angle += PI2$2;
+    }
+    return (angle >= startAngle && angle <= endAngle)
+        || (angle + PI2$2 >= startAngle && angle + PI2$2 <= endAngle);
+}
+
+function windingLine(x0, y0, x1, y1, x, y) {
+    if ((y > y0 && y > y1) || (y < y0 && y < y1)) {
+        return 0;
+    }
+    // Ignore horizontal line
+    if (y1 === y0) {
+        return 0;
+    }
+    var dir = y1 < y0 ? 1 : -1;
+    var t = (y - y0) / (y1 - y0);
+
+    // Avoid winding error when intersection point is the connect point of two line of polygon
+    if (t === 1 || t === 0) {
+        dir = y1 < y0 ? 0.5 : -0.5;
+    }
+
+    var x_ = t * (x1 - x0) + x0;
+
+    // If (x, y) on the line, considered as "contain".
+    return x_ === x ? Infinity : x_ > x ? dir : 0;
+}
+
+var CMD$1 = PathProxy.CMD;
+var PI2$1 = Math.PI * 2;
+
+var EPSILON$2 = 1e-4;
+
+function isAroundEqual(a, b) {
+    return Math.abs(a - b) < EPSILON$2;
+}
+
+// 临时数组
+var roots = [-1, -1, -1];
+var extrema = [-1, -1];
+
+function swapExtrema() {
+    var tmp = extrema[0];
+    extrema[0] = extrema[1];
+    extrema[1] = tmp;
+}
+
+function windingCubic(x0, y0, x1, y1, x2, y2, x3, y3, x, y) {
+    // Quick reject
+    if (
+        (y > y0 && y > y1 && y > y2 && y > y3)
+        || (y < y0 && y < y1 && y < y2 && y < y3)
+    ) {
+        return 0;
+    }
+    var nRoots = cubicRootAt(y0, y1, y2, y3, y, roots);
+    if (nRoots === 0) {
+        return 0;
+    }
+    else {
+        var w = 0;
+        var nExtrema = -1;
+        var y0_, y1_;
+        for (var i = 0; i < nRoots; i++) {
+            var t = roots[i];
+
+            // Avoid winding error when intersection point is the connect point of two line of polygon
+            var unit = (t === 0 || t === 1) ? 0.5 : 1;
+
+            var x_ = cubicAt(x0, x1, x2, x3, t);
+            if (x_ < x) { // Quick reject
+                continue;
+            }
+            if (nExtrema < 0) {
+                nExtrema = cubicExtrema(y0, y1, y2, y3, extrema);
+                if (extrema[1] < extrema[0] && nExtrema > 1) {
+                    swapExtrema();
+                }
+                y0_ = cubicAt(y0, y1, y2, y3, extrema[0]);
+                if (nExtrema > 1) {
+                    y1_ = cubicAt(y0, y1, y2, y3, extrema[1]);
+                }
+            }
+            if (nExtrema == 2) {
+                // 分成三段单调函数
+                if (t < extrema[0]) {
+                    w += y0_ < y0 ? unit : -unit;
+                }
+                else if (t < extrema[1]) {
+                    w += y1_ < y0_ ? unit : -unit;
+                }
+                else {
+                    w += y3 < y1_ ? unit : -unit;
+                }
+            }
+            else {
+                // 分成两段单调函数
+                if (t < extrema[0]) {
+                    w += y0_ < y0 ? unit : -unit;
+                }
+                else {
+                    w += y3 < y0_ ? unit : -unit;
+                }
+            }
+        }
+        return w;
+    }
+}
+
+function windingQuadratic(x0, y0, x1, y1, x2, y2, x, y) {
+    // Quick reject
+    if (
+        (y > y0 && y > y1 && y > y2)
+        || (y < y0 && y < y1 && y < y2)
+    ) {
+        return 0;
+    }
+    var nRoots = quadraticRootAt(y0, y1, y2, y, roots);
+    if (nRoots === 0) {
+        return 0;
+    }
+    else {
+        var t = quadraticExtremum(y0, y1, y2);
+        if (t >= 0 && t <= 1) {
+            var w = 0;
+            var y_ = quadraticAt(y0, y1, y2, t);
+            for (var i = 0; i < nRoots; i++) {
+                // Remove one endpoint.
+                var unit = (roots[i] === 0 || roots[i] === 1) ? 0.5 : 1;
+
+                var x_ = quadraticAt(x0, x1, x2, roots[i]);
+                if (x_ < x) {   // Quick reject
+                    continue;
+                }
+                if (roots[i] < t) {
+                    w += y_ < y0 ? unit : -unit;
+                }
+                else {
+                    w += y2 < y_ ? unit : -unit;
+                }
+            }
+            return w;
+        }
+        else {
+            // Remove one endpoint.
+            var unit = (roots[0] === 0 || roots[0] === 1) ? 0.5 : 1;
+
+            var x_ = quadraticAt(x0, x1, x2, roots[0]);
+            if (x_ < x) {   // Quick reject
+                return 0;
+            }
+            return y2 < y0 ? unit : -unit;
+        }
+    }
+}
+
+// TODO
+// Arc 旋转
+function windingArc(
+    cx, cy, r, startAngle, endAngle, anticlockwise, x, y
+) {
+    y -= cy;
+    if (y > r || y < -r) {
+        return 0;
+    }
+    var tmp = Math.sqrt(r * r - y * y);
+    roots[0] = -tmp;
+    roots[1] = tmp;
+
+    var diff = Math.abs(startAngle - endAngle);
+    if (diff < 1e-4) {
+        return 0;
+    }
+    if (diff % PI2$1 < 1e-4) {
+        // Is a circle
+        startAngle = 0;
+        endAngle = PI2$1;
+        var dir = anticlockwise ? 1 : -1;
+        if (x >= roots[0] + cx && x <= roots[1] + cx) {
+            return dir;
+        } else {
+            return 0;
+        }
+    }
+
+    if (anticlockwise) {
+        var tmp = startAngle;
+        startAngle = normalizeRadian(endAngle);
+        endAngle = normalizeRadian(tmp);
+    }
+    else {
+        startAngle = normalizeRadian(startAngle);
+        endAngle = normalizeRadian(endAngle);
+    }
+    if (startAngle > endAngle) {
+        endAngle += PI2$1;
+    }
+
+    var w = 0;
+    for (var i = 0; i < 2; i++) {
+        var x_ = roots[i];
+        if (x_ + cx > x) {
+            var angle = Math.atan2(y, x_);
+            var dir = anticlockwise ? 1 : -1;
+            if (angle < 0) {
+                angle = PI2$1 + angle;
+            }
+            if (
+                (angle >= startAngle && angle <= endAngle)
+                || (angle + PI2$1 >= startAngle && angle + PI2$1 <= endAngle)
+            ) {
+                if (angle > Math.PI / 2 && angle < Math.PI * 1.5) {
+                    dir = -dir;
+                }
+                w += dir;
+            }
+        }
+    }
+    return w;
+}
+
+function containPath(data, lineWidth, isStroke, x, y) {
+    var w = 0;
+    var xi = 0;
+    var yi = 0;
+    var x0 = 0;
+    var y0 = 0;
+
+    for (var i = 0; i < data.length;) {
+        var cmd = data[i++];
+        // Begin a new subpath
+        if (cmd === CMD$1.M && i > 1) {
+            // Close previous subpath
+            if (!isStroke) {
+                w += windingLine(xi, yi, x0, y0, x, y);
+            }
+            // 如果被任何一个 subpath 包含
+            // if (w !== 0) {
+            //     return true;
+            // }
+        }
+
+        if (i == 1) {
+            // 如果第一个命令是 L, C, Q
+            // 则 previous point 同绘制命令的第一个 point
+            //
+            // 第一个命令为 Arc 的情况下会在后面特殊处理
+            xi = data[i];
+            yi = data[i + 1];
+
+            x0 = xi;
+            y0 = yi;
+        }
+
+        switch (cmd) {
+            case CMD$1.M:
+                // moveTo 命令重新创建一个新的 subpath, 并且更新新的起点
+                // 在 closePath 的时候使用
+                x0 = data[i++];
+                y0 = data[i++];
+                xi = x0;
+                yi = y0;
+                break;
+            case CMD$1.L:
+                if (isStroke) {
+                    if (containStroke$1(xi, yi, data[i], data[i + 1], lineWidth, x, y)) {
+                        return true;
+                    }
+                }
+                else {
+                    // NOTE 在第一个命令为 L, C, Q 的时候会计算出 NaN
+                    w += windingLine(xi, yi, data[i], data[i + 1], x, y) || 0;
+                }
+                xi = data[i++];
+                yi = data[i++];
+                break;
+            case CMD$1.C:
+                if (isStroke) {
+                    if (containStroke$2(xi, yi,
+                        data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1],
+                        lineWidth, x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    w += windingCubic(
+                        xi, yi,
+                        data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1],
+                        x, y
+                    ) || 0;
+                }
+                xi = data[i++];
+                yi = data[i++];
+                break;
+            case CMD$1.Q:
+                if (isStroke) {
+                    if (containStroke$3(xi, yi,
+                        data[i++], data[i++], data[i], data[i + 1],
+                        lineWidth, x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    w += windingQuadratic(
+                        xi, yi,
+                        data[i++], data[i++], data[i], data[i + 1],
+                        x, y
+                    ) || 0;
+                }
+                xi = data[i++];
+                yi = data[i++];
+                break;
+            case CMD$1.A:
+                // TODO Arc 判断的开销比较大
+                var cx = data[i++];
+                var cy = data[i++];
+                var rx = data[i++];
+                var ry = data[i++];
+                var theta = data[i++];
+                var dTheta = data[i++];
+                // TODO Arc 旋转
+                var psi = data[i++];
+                var anticlockwise = 1 - data[i++];
+                var x1 = Math.cos(theta) * rx + cx;
+                var y1 = Math.sin(theta) * ry + cy;
+                // 不是直接使用 arc 命令
+                if (i > 1) {
+                    w += windingLine(xi, yi, x1, y1, x, y);
+                }
+                else {
+                    // 第一个命令起点还未定义
+                    x0 = x1;
+                    y0 = y1;
+                }
+                // zr 使用scale来模拟椭圆, 这里也对x做一定的缩放
+                var _x = (x - cx) * ry / rx + cx;
+                if (isStroke) {
+                    if (containStroke$4(
+                        cx, cy, ry, theta, theta + dTheta, anticlockwise,
+                        lineWidth, _x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    w += windingArc(
+                        cx, cy, ry, theta, theta + dTheta, anticlockwise,
+                        _x, y
+                    );
+                }
+                xi = Math.cos(theta + dTheta) * rx + cx;
+                yi = Math.sin(theta + dTheta) * ry + cy;
+                break;
+            case CMD$1.R:
+                x0 = xi = data[i++];
+                y0 = yi = data[i++];
+                var width = data[i++];
+                var height = data[i++];
+                var x1 = x0 + width;
+                var y1 = y0 + height;
+                if (isStroke) {
+                    if (containStroke$1(x0, y0, x1, y0, lineWidth, x, y)
+                        || containStroke$1(x1, y0, x1, y1, lineWidth, x, y)
+                        || containStroke$1(x1, y1, x0, y1, lineWidth, x, y)
+                        || containStroke$1(x0, y1, x0, y0, lineWidth, x, y)
+                    ) {
+                        return true;
+                    }
+                }
+                else {
+                    // FIXME Clockwise ?
+                    w += windingLine(x1, y0, x1, y1, x, y);
+                    w += windingLine(x0, y1, x0, y0, x, y);
+                }
+                break;
+            case CMD$1.Z:
+                if (isStroke) {
+                    if (containStroke$1(
+                        xi, yi, x0, y0, lineWidth, x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    // Close a subpath
+                    w += windingLine(xi, yi, x0, y0, x, y);
+                    // 如果被任何一个 subpath 包含
+                    // FIXME subpaths may overlap
+                    // if (w !== 0) {
+                    //     return true;
+                    // }
+                }
+                xi = x0;
+                yi = y0;
+                break;
+        }
+    }
+    if (!isStroke && !isAroundEqual(yi, y0)) {
+        w += windingLine(xi, yi, x0, y0, x, y) || 0;
+    }
+    return w !== 0;
+}
+
+function contain(pathData, x, y) {
+    return containPath(pathData, 0, false, x, y);
+}
+
+function containStroke(pathData, lineWidth, x, y) {
+    return containPath(pathData, lineWidth, true, x, y);
+}
+
+var getCanvasPattern = Pattern.prototype.getCanvasPattern;
+
+var abs = Math.abs;
+
+var pathProxyForDraw = new PathProxy(true);
+/**
+ * @alias module:zrender/graphic/Path
+ * @extends module:zrender/graphic/Displayable
+ * @constructor
+ * @param {Object} opts
+ */
+function Path(opts) {
+    Displayable.call(this, opts);
+
+    /**
+     * @type {module:zrender/core/PathProxy}
+     * @readOnly
+     */
+    this.path = null;
+}
+
+Path.prototype = {
+
+    constructor: Path,
+
+    type: 'path',
+
+    __dirtyPath: true,
+
+    strokeContainThreshold: 5,
+
+    brush: function (ctx, prevEl) {
+        var style = this.style;
+        var path = this.path || pathProxyForDraw;
+        var hasStroke = style.hasStroke();
+        var hasFill = style.hasFill();
+        var fill = style.fill;
+        var stroke = style.stroke;
+        var hasFillGradient = hasFill && !!(fill.colorStops);
+        var hasStrokeGradient = hasStroke && !!(stroke.colorStops);
+        var hasFillPattern = hasFill && !!(fill.image);
+        var hasStrokePattern = hasStroke && !!(stroke.image);
+
+        style.bind(ctx, this, prevEl);
+        this.setTransform(ctx);
+
+        if (this.__dirty) {
+            var rect;
+            // Update gradient because bounding rect may changed
+            if (hasFillGradient) {
+                rect = rect || this.getBoundingRect();
+                this._fillGradient = style.getGradient(ctx, fill, rect);
+            }
+            if (hasStrokeGradient) {
+                rect = rect || this.getBoundingRect();
+                this._strokeGradient = style.getGradient(ctx, stroke, rect);
+            }
+        }
+        // Use the gradient or pattern
+        if (hasFillGradient) {
+            // PENDING If may have affect the state
+            ctx.fillStyle = this._fillGradient;
+        }
+        else if (hasFillPattern) {
+            ctx.fillStyle = getCanvasPattern.call(fill, ctx);
+        }
+        if (hasStrokeGradient) {
+            ctx.strokeStyle = this._strokeGradient;
+        }
+        else if (hasStrokePattern) {
+            ctx.strokeStyle = getCanvasPattern.call(stroke, ctx);
+        }
+
+        var lineDash = style.lineDash;
+        var lineDashOffset = style.lineDashOffset;
+
+        var ctxLineDash = !!ctx.setLineDash;
+
+        // Update path sx, sy
+        var scale = this.getGlobalScale();
+        path.setScale(scale[0], scale[1]);
+
+        // Proxy context
+        // Rebuild path in following 2 cases
+        // 1. Path is dirty
+        // 2. Path needs javascript implemented lineDash stroking.
+        //    In this case, lineDash information will not be saved in PathProxy
+        if (this.__dirtyPath
+            || (lineDash && !ctxLineDash && hasStroke)
+        ) {
+            path.beginPath(ctx);
+
+            // Setting line dash before build path
+            if (lineDash && !ctxLineDash) {
+                path.setLineDash(lineDash);
+                path.setLineDashOffset(lineDashOffset);
+            }
+
+            this.buildPath(path, this.shape, false);
+
+            // Clear path dirty flag
+            if (this.path) {
+                this.__dirtyPath = false;
+            }
+        }
+        else {
+            // Replay path building
+            ctx.beginPath();
+            this.path.rebuildPath(ctx);
+        }
+
+        hasFill && path.fill(ctx);
+
+        if (lineDash && ctxLineDash) {
+            ctx.setLineDash(lineDash);
+            ctx.lineDashOffset = lineDashOffset;
+        }
+
+        hasStroke && path.stroke(ctx);
+
+        if (lineDash && ctxLineDash) {
+            // PENDING
+            // Remove lineDash
+            ctx.setLineDash([]);
+        }
+
+        // Draw rect text
+        if (style.text != null) {
+            // Only restore transform when needs draw text.
+            this.restoreTransform(ctx);    
+            this.drawRectText(ctx, this.getBoundingRect());
+        }
+    },
+
+    // When bundling path, some shape may decide if use moveTo to begin a new subpath or closePath
+    // Like in circle
+    buildPath: function (ctx, shapeCfg, inBundle) {},
+
+    createPathProxy: function () {
+        this.path = new PathProxy();
+    },
+
+    getBoundingRect: function () {
+        var rect = this._rect;
+        var style = this.style;
+        var needsUpdateRect = !rect;
+        if (needsUpdateRect) {
+            var path = this.path;
+            if (!path) {
+                // Create path on demand.
+                path = this.path = new PathProxy();
+            }
+            if (this.__dirtyPath) {
+                path.beginPath();
+                this.buildPath(path, this.shape, false);
+            }
+            rect = path.getBoundingRect();
+        }
+        this._rect = rect;
+
+        if (style.hasStroke()) {
+            // Needs update rect with stroke lineWidth when
+            // 1. Element changes scale or lineWidth
+            // 2. Shape is changed
+            var rectWithStroke = this._rectWithStroke || (this._rectWithStroke = rect.clone());
+            if (this.__dirty || needsUpdateRect) {
+                rectWithStroke.copy(rect);
+                // FIXME Must after updateTransform
+                var w = style.lineWidth;
+                // PENDING, Min line width is needed when line is horizontal or vertical
+                var lineScale = style.strokeNoScale ? this.getLineScale() : 1;
+
+                // Only add extra hover lineWidth when there are no fill
+                if (!style.hasFill()) {
+                    w = Math.max(w, this.strokeContainThreshold || 4);
+                }
+                // Consider line width
+                // Line scale can't be 0;
+                if (lineScale > 1e-10) {
+                    rectWithStroke.width += w / lineScale;
+                    rectWithStroke.height += w / lineScale;
+                    rectWithStroke.x -= w / lineScale / 2;
+                    rectWithStroke.y -= w / lineScale / 2;
+                }
+            }
+
+            // Return rect with stroke
+            return rectWithStroke;
+        }
+
+        return rect;
+    },
+
+    contain: function (x, y) {
+        var localPos = this.transformCoordToLocal(x, y);
+        var rect = this.getBoundingRect();
+        var style = this.style;
+        x = localPos[0];
+        y = localPos[1];
+
+        if (rect.contain(x, y)) {
+            var pathData = this.path.data;
+            if (style.hasStroke()) {
+                var lineWidth = style.lineWidth;
+                var lineScale = style.strokeNoScale ? this.getLineScale() : 1;
+                // Line scale can't be 0;
+                if (lineScale > 1e-10) {
+                    // Only add extra hover lineWidth when there are no fill
+                    if (!style.hasFill()) {
+                        lineWidth = Math.max(lineWidth, this.strokeContainThreshold);
+                    }
+                    if (containStroke(
+                        pathData, lineWidth / lineScale, x, y
+                    )) {
+                        return true;
+                    }
+                }
+            }
+            if (style.hasFill()) {
+                return contain(pathData, x, y);
+            }
+        }
+        return false;
+    },
+
+    /**
+     * @param  {boolean} dirtyPath
+     */
+    dirty: function (dirtyPath) {
+        if (dirtyPath == null) {
+            dirtyPath = true;
+        }
+        // Only mark dirty, not mark clean
+        if (dirtyPath) {
+            this.__dirtyPath = dirtyPath;
+            this._rect = null;
+        }
+
+        this.__dirty = true;
+
+        this.__zr && this.__zr.refresh();
+
+        // Used as a clipping path
+        if (this.__clipTarget) {
+            this.__clipTarget.dirty();
+        }
+    },
+
+    /**
+     * Alias for animate('shape')
+     * @param {boolean} loop
+     */
+    animateShape: function (loop) {
+        return this.animate('shape', loop);
+    },
+
+    // Overwrite attrKV
+    attrKV: function (key, value) {
+        // FIXME
+        if (key === 'shape') {
+            this.setShape(value);
+            this.__dirtyPath = true;
+            this._rect = null;
+        }
+        else {
+            Displayable.prototype.attrKV.call(this, key, value);
+        }
+    },
+
+    /**
+     * @param {Object|string} key
+     * @param {*} value
+     */
+    setShape: function (key, value) {
+        var shape = this.shape;
+        // Path from string may not have shape
+        if (shape) {
+            if (isObject$1(key)) {
+                for (var name in key) {
+                    if (key.hasOwnProperty(name)) {
+                        shape[name] = key[name];
+                    }
+                }
+            }
+            else {
+                shape[key] = value;
+            }
+            this.dirty(true);
+        }
+        return this;
+    },
+
+    getLineScale: function () {
+        var m = this.transform;
+        // Get the line scale.
+        // Determinant of `m` means how much the area is enlarged by the
+        // transformation. So its square root can be used as a scale factor
+        // for width.
+        return m && abs(m[0] - 1) > 1e-10 && abs(m[3] - 1) > 1e-10
+            ? Math.sqrt(abs(m[0] * m[3] - m[2] * m[1]))
+            : 1;
+    }
+};
+
+/**
+ * 扩展一个 Path element, 比如星形，圆等。
+ * Extend a path element
+ * @param {Object} props
+ * @param {string} props.type Path type
+ * @param {Function} props.init Initialize
+ * @param {Function} props.buildPath Overwrite buildPath method
+ * @param {Object} [props.style] Extended default style config
+ * @param {Object} [props.shape] Extended default shape config
+ */
+Path.extend = function (defaults$$1) {
+    var Sub = function (opts) {
+        Path.call(this, opts);
+
+        if (defaults$$1.style) {
+            // Extend default style
+            this.style.extendFrom(defaults$$1.style, false);
+        }
+
+        // Extend default shape
+        var defaultShape = defaults$$1.shape;
+        if (defaultShape) {
+            this.shape = this.shape || {};
+            var thisShape = this.shape;
+            for (var name in defaultShape) {
+                if (
+                    ! thisShape.hasOwnProperty(name)
+                    && defaultShape.hasOwnProperty(name)
+                ) {
+                    thisShape[name] = defaultShape[name];
+                }
+            }
+        }
+
+        defaults$$1.init && defaults$$1.init.call(this, opts);
+    };
+
+    inherits(Sub, Path);
+
+    // FIXME 不能 extend position, rotation 等引用对象
+    for (var name in defaults$$1) {
+        // Extending prototype values and methods
+        if (name !== 'style' && name !== 'shape') {
+            Sub.prototype[name] = defaults$$1[name];
+        }
+    }
+
+    return Sub;
+};
+
+inherits(Path, Displayable);
+
+var CMD$2 = PathProxy.CMD;
+
+var points = [[], [], []];
+var mathSqrt$3 = Math.sqrt;
+var mathAtan2 = Math.atan2;
+
+var transformPath = function (path, m) {
+    var data = path.data;
+    var cmd;
+    var nPoint;
+    var i;
+    var j;
+    var k;
+    var p;
+
+    var M = CMD$2.M;
+    var C = CMD$2.C;
+    var L = CMD$2.L;
+    var R = CMD$2.R;
+    var A = CMD$2.A;
+    var Q = CMD$2.Q;
+
+    for (i = 0, j = 0; i < data.length;) {
+        cmd = data[i++];
+        j = i;
+        nPoint = 0;
+
+        switch (cmd) {
+            case M:
+                nPoint = 1;
+                break;
+            case L:
+                nPoint = 1;
+                break;
+            case C:
+                nPoint = 3;
+                break;
+            case Q:
+                nPoint = 2;
+                break;
+            case A:
+                var x = m[4];
+                var y = m[5];
+                var sx = mathSqrt$3(m[0] * m[0] + m[1] * m[1]);
+                var sy = mathSqrt$3(m[2] * m[2] + m[3] * m[3]);
+                var angle = mathAtan2(-m[1] / sy, m[0] / sx);
+                // cx
+                data[i] *= sx;
+                data[i++] += x;
+                // cy
+                data[i] *= sy;
+                data[i++] += y;
+                // Scale rx and ry
+                // FIXME Assume psi is 0 here
+                data[i++] *= sx;
+                data[i++] *= sy;
+
+                // Start angle
+                data[i++] += angle;
+                // end angle
+                data[i++] += angle;
+                // FIXME psi
+                i += 2;
+                j = i;
+                break;
+            case R:
+                // x0, y0
+                p[0] = data[i++];
+                p[1] = data[i++];
+                applyTransform(p, p, m);
+                data[j++] = p[0];
+                data[j++] = p[1];
+                // x1, y1
+                p[0] += data[i++];
+                p[1] += data[i++];
+                applyTransform(p, p, m);
+                data[j++] = p[0];
+                data[j++] = p[1];
+        }
+
+        for (k = 0; k < nPoint; k++) {
+            var p = points[k];
+            p[0] = data[i++];
+            p[1] = data[i++];
+
+            applyTransform(p, p, m);
+            // Write back
+            data[j++] = p[0];
+            data[j++] = p[1];
+        }
+    }
+};
+
+// command chars
+var cc = [
+    'm', 'M', 'l', 'L', 'v', 'V', 'h', 'H', 'z', 'Z',
+    'c', 'C', 'q', 'Q', 't', 'T', 's', 'S', 'a', 'A'
+];
+
+var mathSqrt = Math.sqrt;
+var mathSin = Math.sin;
+var mathCos = Math.cos;
+var PI = Math.PI;
+
+var vMag = function(v) {
+    return Math.sqrt(v[0] * v[0] + v[1] * v[1]);
+};
+var vRatio = function(u, v) {
+    return (u[0] * v[0] + u[1] * v[1]) / (vMag(u) * vMag(v));
+};
+var vAngle = function(u, v) {
+    return (u[0] * v[1] < u[1] * v[0] ? -1 : 1)
+            * Math.acos(vRatio(u, v));
+};
+
+function processArc(x1, y1, x2, y2, fa, fs, rx, ry, psiDeg, cmd, path) {
+    var psi = psiDeg * (PI / 180.0);
+    var xp = mathCos(psi) * (x1 - x2) / 2.0
+                + mathSin(psi) * (y1 - y2) / 2.0;
+    var yp = -1 * mathSin(psi) * (x1 - x2) / 2.0
+                + mathCos(psi) * (y1 - y2) / 2.0;
+
+    var lambda = (xp * xp) / (rx * rx) + (yp * yp) / (ry * ry);
+
+    if (lambda > 1) {
+        rx *= mathSqrt(lambda);
+        ry *= mathSqrt(lambda);
+    }
+
+    var f = (fa === fs ? -1 : 1)
+        * mathSqrt((((rx * rx) * (ry * ry))
+                - ((rx * rx) * (yp * yp))
+                - ((ry * ry) * (xp * xp))) / ((rx * rx) * (yp * yp)
+                + (ry * ry) * (xp * xp))
+            ) || 0;
+
+    var cxp = f * rx * yp / ry;
+    var cyp = f * -ry * xp / rx;
+
+    var cx = (x1 + x2) / 2.0
+                + mathCos(psi) * cxp
+                - mathSin(psi) * cyp;
+    var cy = (y1 + y2) / 2.0
+            + mathSin(psi) * cxp
+            + mathCos(psi) * cyp;
+
+    var theta = vAngle([ 1, 0 ], [ (xp - cxp) / rx, (yp - cyp) / ry ]);
+    var u = [ (xp - cxp) / rx, (yp - cyp) / ry ];
+    var v = [ (-1 * xp - cxp) / rx, (-1 * yp - cyp) / ry ];
+    var dTheta = vAngle(u, v);
+
+    if (vRatio(u, v) <= -1) {
+        dTheta = PI;
+    }
+    if (vRatio(u, v) >= 1) {
+        dTheta = 0;
+    }
+    if (fs === 0 && dTheta > 0) {
+        dTheta = dTheta - 2 * PI;
+    }
+    if (fs === 1 && dTheta < 0) {
+        dTheta = dTheta + 2 * PI;
+    }
+
+    path.addData(cmd, cx, cy, rx, ry, theta, dTheta, psi, fs);
+}
+
+function createPathProxyFromString(data) {
+    if (!data) {
+        return [];
+    }
+
+    // command string
+    var cs = data.replace(/-/g, ' -')
+        .replace(/  /g, ' ')
+        .replace(/ /g, ',')
+        .replace(/,,/g, ',');
+
+    var n;
+    // create pipes so that we can split the data
+    for (n = 0; n < cc.length; n++) {
+        cs = cs.replace(new RegExp(cc[n], 'g'), '|' + cc[n]);
+    }
+
+    // create array
+    var arr = cs.split('|');
+    // init context point
+    var cpx = 0;
+    var cpy = 0;
+
+    var path = new PathProxy();
+    var CMD = PathProxy.CMD;
+
+    var prevCmd;
+    for (n = 1; n < arr.length; n++) {
+        var str = arr[n];
+        var c = str.charAt(0);
+        var off = 0;
+        var p = str.slice(1).replace(/e,-/g, 'e-').split(',');
+        var cmd;
+
+        if (p.length > 0 && p[0] === '') {
+            p.shift();
+        }
+
+        for (var i = 0; i < p.length; i++) {
+            p[i] = parseFloat(p[i]);
+        }
+        while (off < p.length && !isNaN(p[off])) {
+            if (isNaN(p[0])) {
+                break;
+            }
+            var ctlPtx;
+            var ctlPty;
+
+            var rx;
+            var ry;
+            var psi;
+            var fa;
+            var fs;
+
+            var x1 = cpx;
+            var y1 = cpy;
+
+            // convert l, H, h, V, and v to L
+            switch (c) {
+                case 'l':
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'L':
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'm':
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.M;
+                    path.addData(cmd, cpx, cpy);
+                    c = 'l';
+                    break;
+                case 'M':
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.M;
+                    path.addData(cmd, cpx, cpy);
+                    c = 'L';
+                    break;
+                case 'h':
+                    cpx += p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'H':
+                    cpx = p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'v':
+                    cpy += p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'V':
+                    cpy = p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'C':
+                    cmd = CMD.C;
+                    path.addData(
+                        cmd, p[off++], p[off++], p[off++], p[off++], p[off++], p[off++]
+                    );
+                    cpx = p[off - 2];
+                    cpy = p[off - 1];
+                    break;
+                case 'c':
+                    cmd = CMD.C;
+                    path.addData(
+                        cmd,
+                        p[off++] + cpx, p[off++] + cpy,
+                        p[off++] + cpx, p[off++] + cpy,
+                        p[off++] + cpx, p[off++] + cpy
+                    );
+                    cpx += p[off - 2];
+                    cpy += p[off - 1];
+                    break;
+                case 'S':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.C) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cmd = CMD.C;
+                    x1 = p[off++];
+                    y1 = p[off++];
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    path.addData(cmd, ctlPtx, ctlPty, x1, y1, cpx, cpy);
+                    break;
+                case 's':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.C) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cmd = CMD.C;
+                    x1 = cpx + p[off++];
+                    y1 = cpy + p[off++];
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    path.addData(cmd, ctlPtx, ctlPty, x1, y1, cpx, cpy);
+                    break;
+                case 'Q':
+                    x1 = p[off++];
+                    y1 = p[off++];
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, x1, y1, cpx, cpy);
+                    break;
+                case 'q':
+                    x1 = p[off++] + cpx;
+                    y1 = p[off++] + cpy;
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, x1, y1, cpx, cpy);
+                    break;
+                case 'T':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.Q) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, ctlPtx, ctlPty, cpx, cpy);
+                    break;
+                case 't':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.Q) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, ctlPtx, ctlPty, cpx, cpy);
+                    break;
+                case 'A':
+                    rx = p[off++];
+                    ry = p[off++];
+                    psi = p[off++];
+                    fa = p[off++];
+                    fs = p[off++];
+
+                    x1 = cpx, y1 = cpy;
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.A;
+                    processArc(
+                        x1, y1, cpx, cpy, fa, fs, rx, ry, psi, cmd, path
+                    );
+                    break;
+                case 'a':
+                    rx = p[off++];
+                    ry = p[off++];
+                    psi = p[off++];
+                    fa = p[off++];
+                    fs = p[off++];
+
+                    x1 = cpx, y1 = cpy;
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.A;
+                    processArc(
+                        x1, y1, cpx, cpy, fa, fs, rx, ry, psi, cmd, path
+                    );
+                    break;
+            }
+        }
+
+        if (c === 'z' || c === 'Z') {
+            cmd = CMD.Z;
+            path.addData(cmd);
+        }
+
+        prevCmd = cmd;
+    }
+
+    path.toStatic();
+
+    return path;
+}
+
+// TODO Optimize double memory cost problem
+function createPathOptions(str, opts) {
+    var pathProxy = createPathProxyFromString(str);
+    opts = opts || {};
+    opts.buildPath = function (path) {
+        if (path.setData) {
+            path.setData(pathProxy.data);
+            // Svg and vml renderer don't have context
+            var ctx = path.getContext();
+            if (ctx) {
+                path.rebuildPath(ctx);
+            }
+        }
+        else {
+            var ctx = path;
+            pathProxy.rebuildPath(ctx);
+        }
+    };
+
+    opts.applyTransform = function (m) {
+        transformPath(pathProxy, m);
+        this.dirty(true);
+    };
+
+    return opts;
+}
+
+/**
+ * Create a Path object from path string data
+ * http://www.w3.org/TR/SVG/paths.html#PathData
+ * @param  {Object} opts Other options
+ */
+function createFromString(str, opts) {
+    return new Path(createPathOptions(str, opts));
+}
+
+/**
+ * Create a Path class from path string data
+ * @param  {string} str
+ * @param  {Object} opts Other options
+ */
+function extendFromString(str, opts) {
+    return Path.extend(createPathOptions(str, opts));
+}
+
+/**
+ * Merge multiple paths
+ */
+// TODO Apply transform
+// TODO stroke dash
+// TODO Optimize double memory cost problem
+function mergePath$1(pathEls, opts) {
+    var pathList = [];
+    var len = pathEls.length;
+    for (var i = 0; i < len; i++) {
+        var pathEl = pathEls[i];
+        if (!pathEl.path) {
+            pathEl.createPathProxy();
+        }
+        if (pathEl.__dirtyPath) {
+            pathEl.buildPath(pathEl.path, pathEl.shape, true);
+        }
+        pathList.push(pathEl.path);
+    }
+
+    var pathBundle = new Path(opts);
+    // Need path proxy.
+    pathBundle.createPathProxy();
+    pathBundle.buildPath = function (path) {
+        path.appendPath(pathList);
+        // Svg and vml renderer don't have context
+        var ctx = path.getContext();
+        if (ctx) {
+            path.rebuildPath(ctx);
+        }
+    };
+
+    return pathBundle;
+}
+
+/**
+ * @alias zrender/graphic/Text
+ * @extends module:zrender/graphic/Displayable
+ * @constructor
+ * @param {Object} opts
+ */
+var Text = function (opts) { // jshint ignore:line
+    Displayable.call(this, opts);
+};
+
+Text.prototype = {
+
+    constructor: Text,
+
+    type: 'text',
+
+    brush: function (ctx, prevEl) {
+        var style = this.style;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        // Use props with prefix 'text'.
+        style.fill = style.stroke = style.shadowBlur = style.shadowColor =
+            style.shadowOffsetX = style.shadowOffsetY = null;
+
+        var text = style.text;
+        // Convert to string
+        text != null && (text += '');
+
+        // Always bind style
+        style.bind(ctx, this, prevEl);
+
+        if (!needDrawText(text, style)) {
+            return;
+        }
+
+        this.setTransform(ctx);
+
+        renderText(this, ctx, text, style);
+
+        this.restoreTransform(ctx);
+    },
+
+    getBoundingRect: function () {
+        var style = this.style;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        if (!this._rect) {
+            var text = style.text;
+            text != null ? (text += '') : (text = '');
+
+            var rect = getBoundingRect(
+                style.text + '',
+                style.font,
+                style.textAlign,
+                style.textVerticalAlign,
+                style.textPadding,
+                style.rich
+            );
+
+            rect.x += style.x || 0;
+            rect.y += style.y || 0;
+
+            if (getStroke(style.textStroke, style.textStrokeWidth)) {
+                var w = style.textStrokeWidth;
+                rect.x -= w / 2;
+                rect.y -= w / 2;
+                rect.width += w;
+                rect.height += w;
+            }
+
+            this._rect = rect;
+        }
+
+        return this._rect;
+    }
+};
+
+inherits(Text, Displayable);
+
+/**
+ * 圆形
+ * @module zrender/shape/Circle
+ */
+
+var Circle = Path.extend({
+
+    type: 'circle',
+
+    shape: {
+        cx: 0,
+        cy: 0,
+        r: 0
+    },
+
+
+    buildPath : function (ctx, shape, inBundle) {
+        // Better stroking in ShapeBundle
+        // Always do it may have performence issue ( fill may be 2x more cost)
+        if (inBundle) {
+            ctx.moveTo(shape.cx + shape.r, shape.cy);
+        }
+        // else {
+        //     if (ctx.allocate && !ctx.data.length) {
+        //         ctx.allocate(ctx.CMD_MEM_SIZE.A);
+        //     }
+        // }
+        // Better stroking in ShapeBundle
+        // ctx.moveTo(shape.cx + shape.r, shape.cy);
+        ctx.arc(shape.cx, shape.cy, shape.r, 0, Math.PI * 2, true);
+    }
+});
+
+// Fix weird bug in some version of IE11 (like 11.0.9600.178**),
+// where exception "unexpected call to method or property access"
+// might be thrown when calling ctx.fill or ctx.stroke after a path
+// whose area size is zero is drawn and ctx.clip() is called and
+// shadowBlur is set. See #4572, #3112, #5777.
+// (e.g.,
+//  ctx.moveTo(10, 10);
+//  ctx.lineTo(20, 10);
+//  ctx.closePath();
+//  ctx.clip();
+//  ctx.shadowBlur = 10;
+//  ...
+//  ctx.fill();
+// )
+
+var shadowTemp = [
+    ['shadowBlur', 0],
+    ['shadowColor', '#000'],
+    ['shadowOffsetX', 0],
+    ['shadowOffsetY', 0]
+];
+
+var fixClipWithShadow = function (orignalBrush) {
+
+    // version string can be: '11.0'
+    return (env$1.browser.ie && env$1.browser.version >= 11)
+
+        ? function () {
+            var clipPaths = this.__clipPaths;
+            var style = this.style;
+            var modified;
+
+            if (clipPaths) {
+                for (var i = 0; i < clipPaths.length; i++) {
+                    var clipPath = clipPaths[i];
+                    var shape = clipPath && clipPath.shape;
+                    var type = clipPath && clipPath.type;
+
+                    if (shape && (
+                        (type === 'sector' && shape.startAngle === shape.endAngle)
+                        || (type === 'rect' && (!shape.width || !shape.height))
+                    )) {
+                        for (var j = 0; j < shadowTemp.length; j++) {
+                            // It is save to put shadowTemp static, because shadowTemp
+                            // will be all modified each item brush called.
+                            shadowTemp[j][2] = style[shadowTemp[j][0]];
+                            style[shadowTemp[j][0]] = shadowTemp[j][1];
+                        }
+                        modified = true;
+                        break;
+                    }
+                }
+            }
+
+            orignalBrush.apply(this, arguments);
+
+            if (modified) {
+                for (var j = 0; j < shadowTemp.length; j++) {
+                    style[shadowTemp[j][0]] = shadowTemp[j][2];
+                }
+            }
+        }
+
+        : orignalBrush;
+};
+
+/**
+ * 扇形
+ * @module zrender/graphic/shape/Sector
+ */
+
+var Sector = Path.extend({
+
+    type: 'sector',
+
+    shape: {
+
+        cx: 0,
+
+        cy: 0,
+
+        r0: 0,
+
+        r: 0,
+
+        startAngle: 0,
+
+        endAngle: Math.PI * 2,
+
+        clockwise: true
+    },
+
+    brush: fixClipWithShadow(Path.prototype.brush),
+
+    buildPath: function (ctx, shape) {
+
+        var x = shape.cx;
+        var y = shape.cy;
+        var r0 = Math.max(shape.r0 || 0, 0);
+        var r = Math.max(shape.r, 0);
+        var startAngle = shape.startAngle;
+        var endAngle = shape.endAngle;
+        var clockwise = shape.clockwise;
+
+        var unitX = Math.cos(startAngle);
+        var unitY = Math.sin(startAngle);
+
+        ctx.moveTo(unitX * r0 + x, unitY * r0 + y);
+
+        ctx.lineTo(unitX * r + x, unitY * r + y);
+
+        ctx.arc(x, y, r, startAngle, endAngle, !clockwise);
+
+        ctx.lineTo(
+            Math.cos(endAngle) * r0 + x,
+            Math.sin(endAngle) * r0 + y
+        );
+
+        if (r0 !== 0) {
+            ctx.arc(x, y, r0, endAngle, startAngle, clockwise);
+        }
+
+        ctx.closePath();
+    }
+});
+
+/**
+ * 圆环
+ * @module zrender/graphic/shape/Ring
+ */
+
+var Ring = Path.extend({
+
+    type: 'ring',
+
+    shape: {
+        cx: 0,
+        cy: 0,
+        r: 0,
+        r0: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var x = shape.cx;
+        var y = shape.cy;
+        var PI2 = Math.PI * 2;
+        ctx.moveTo(x + shape.r, y);
+        ctx.arc(x, y, shape.r, 0, PI2, false);
+        ctx.moveTo(x + shape.r0, y);
+        ctx.arc(x, y, shape.r0, 0, PI2, true);
+    }
+});
+
+/**
+ * Catmull-Rom spline 插值折线
+ * @module zrender/shape/util/smoothSpline
+ * @author pissang (https://www.github.com/pissang)
+ *         Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ *         errorrik (errorrik@gmail.com)
+ */
+
+/**
+ * @inner
+ */
+function interpolate(p0, p1, p2, p3, t, t2, t3) {
+    var v0 = (p2 - p0) * 0.5;
+    var v1 = (p3 - p1) * 0.5;
+    return (2 * (p1 - p2) + v0 + v1) * t3
+            + (-3 * (p1 - p2) - 2 * v0 - v1) * t2
+            + v0 * t + p1;
+}
+
+/**
+ * @alias module:zrender/shape/util/smoothSpline
+ * @param {Array} points 线段顶点数组
+ * @param {boolean} isLoop
+ * @return {Array}
+ */
+var smoothSpline = function (points, isLoop) {
+    var len$$1 = points.length;
+    var ret = [];
+
+    var distance$$1 = 0;
+    for (var i = 1; i < len$$1; i++) {
+        distance$$1 += distance(points[i - 1], points[i]);
+    }
+
+    var segs = distance$$1 / 2;
+    segs = segs < len$$1 ? len$$1 : segs;
+    for (var i = 0; i < segs; i++) {
+        var pos = i / (segs - 1) * (isLoop ? len$$1 : len$$1 - 1);
+        var idx = Math.floor(pos);
+
+        var w = pos - idx;
+
+        var p0;
+        var p1 = points[idx % len$$1];
+        var p2;
+        var p3;
+        if (!isLoop) {
+            p0 = points[idx === 0 ? idx : idx - 1];
+            p2 = points[idx > len$$1 - 2 ? len$$1 - 1 : idx + 1];
+            p3 = points[idx > len$$1 - 3 ? len$$1 - 1 : idx + 2];
+        }
+        else {
+            p0 = points[(idx - 1 + len$$1) % len$$1];
+            p2 = points[(idx + 1) % len$$1];
+            p3 = points[(idx + 2) % len$$1];
+        }
+
+        var w2 = w * w;
+        var w3 = w * w2;
+
+        ret.push([
+            interpolate(p0[0], p1[0], p2[0], p3[0], w, w2, w3),
+            interpolate(p0[1], p1[1], p2[1], p3[1], w, w2, w3)
+        ]);
+    }
+    return ret;
+};
+
+/**
+ * 贝塞尔平滑曲线
+ * @module zrender/shape/util/smoothBezier
+ * @author pissang (https://www.github.com/pissang)
+ *         Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ *         errorrik (errorrik@gmail.com)
+ */
+
+/**
+ * 贝塞尔平滑曲线
+ * @alias module:zrender/shape/util/smoothBezier
+ * @param {Array} points 线段顶点数组
+ * @param {number} smooth 平滑等级, 0-1
+ * @param {boolean} isLoop
+ * @param {Array} constraint 将计算出来的控制点约束在一个包围盒内
+ *                           比如 [[0, 0], [100, 100]], 这个包围盒会与
+ *                           整个折线的包围盒做一个并集用来约束控制点。
+ * @param {Array} 计算出来的控制点数组
+ */
+var smoothBezier = function (points, smooth, isLoop, constraint) {
+    var cps = [];
+
+    var v = [];
+    var v1 = [];
+    var v2 = [];
+    var prevPoint;
+    var nextPoint;
+
+    var min$$1, max$$1;
+    if (constraint) {
+        min$$1 = [Infinity, Infinity];
+        max$$1 = [-Infinity, -Infinity];
+        for (var i = 0, len$$1 = points.length; i < len$$1; i++) {
+            min(min$$1, min$$1, points[i]);
+            max(max$$1, max$$1, points[i]);
+        }
+        // 与指定的包围盒做并集
+        min(min$$1, min$$1, constraint[0]);
+        max(max$$1, max$$1, constraint[1]);
+    }
+
+    for (var i = 0, len$$1 = points.length; i < len$$1; i++) {
+        var point = points[i];
+
+        if (isLoop) {
+            prevPoint = points[i ? i - 1 : len$$1 - 1];
+            nextPoint = points[(i + 1) % len$$1];
+        }
+        else {
+            if (i === 0 || i === len$$1 - 1) {
+                cps.push(clone$1(points[i]));
+                continue;
+            }
+            else {
+                prevPoint = points[i - 1];
+                nextPoint = points[i + 1];
+            }
+        }
+
+        sub(v, nextPoint, prevPoint);
+
+        // use degree to scale the handle length
+        scale(v, v, smooth);
+
+        var d0 = distance(point, prevPoint);
+        var d1 = distance(point, nextPoint);
+        var sum = d0 + d1;
+        if (sum !== 0) {
+            d0 /= sum;
+            d1 /= sum;
+        }
+
+        scale(v1, v, -d0);
+        scale(v2, v, d1);
+        var cp0 = add([], point, v1);
+        var cp1 = add([], point, v2);
+        if (constraint) {
+            max(cp0, cp0, min$$1);
+            min(cp0, cp0, max$$1);
+            max(cp1, cp1, min$$1);
+            min(cp1, cp1, max$$1);
+        }
+        cps.push(cp0);
+        cps.push(cp1);
+    }
+
+    if (isLoop) {
+        cps.push(cps.shift());
+    }
+
+    return cps;
+};
+
+function buildPath$1(ctx, shape, closePath) {
+    var points = shape.points;
+    var smooth = shape.smooth;
+    if (points && points.length >= 2) {
+        if (smooth && smooth !== 'spline') {
+            var controlPoints = smoothBezier(
+                points, smooth, closePath, shape.smoothConstraint
+            );
+
+            ctx.moveTo(points[0][0], points[0][1]);
+            var len = points.length;
+            for (var i = 0; i < (closePath ? len : len - 1); i++) {
+                var cp1 = controlPoints[i * 2];
+                var cp2 = controlPoints[i * 2 + 1];
+                var p = points[(i + 1) % len];
+                ctx.bezierCurveTo(
+                    cp1[0], cp1[1], cp2[0], cp2[1], p[0], p[1]
+                );
+            }
+        }
+        else {
+            if (smooth === 'spline') {
+                points = smoothSpline(points, closePath);
+            }
+
+            ctx.moveTo(points[0][0], points[0][1]);
+            for (var i = 1, l = points.length; i < l; i++) {
+                ctx.lineTo(points[i][0], points[i][1]);
+            }
+        }
+
+        closePath && ctx.closePath();
+    }
+}
+
+/**
+ * 多边形
+ * @module zrender/shape/Polygon
+ */
+
+var Polygon = Path.extend({
+
+    type: 'polygon',
+
+    shape: {
+        points: null,
+
+        smooth: false,
+
+        smoothConstraint: null
+    },
+
+    buildPath: function (ctx, shape) {
+        buildPath$1(ctx, shape, true);
+    }
+});
+
+/**
+ * @module zrender/graphic/shape/Polyline
+ */
+
+var Polyline = Path.extend({
+
+    type: 'polyline',
+
+    shape: {
+        points: null,
+
+        smooth: false,
+
+        smoothConstraint: null
+    },
+
+    style: {
+        stroke: '#000',
+
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+        buildPath$1(ctx, shape, false);
+    }
+});
+
+/**
+ * 矩形
+ * @module zrender/graphic/shape/Rect
+ */
+
+var Rect = Path.extend({
+
+    type: 'rect',
+
+    shape: {
+        // 左上、右上、右下、左下角的半径依次为r1、r2、r3、r4
+        // r缩写为1         相当于 [1, 1, 1, 1]
+        // r缩写为[1]       相当于 [1, 1, 1, 1]
+        // r缩写为[1, 2]    相当于 [1, 2, 1, 2]
+        // r缩写为[1, 2, 3] 相当于 [1, 2, 3, 2]
+        r: 0,
+
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var x = shape.x;
+        var y = shape.y;
+        var width = shape.width;
+        var height = shape.height;
+        if (!shape.r) {
+            ctx.rect(x, y, width, height);
+        }
+        else {
+            buildPath(ctx, shape);
+        }
+        ctx.closePath();
+        return;
+    }
+});
+
+/**
+ * 直线
+ * @module zrender/graphic/shape/Line
+ */
+
+var Line = Path.extend({
+
+    type: 'line',
+
+    shape: {
+        // Start point
+        x1: 0,
+        y1: 0,
+        // End point
+        x2: 0,
+        y2: 0,
+
+        percent: 1
+    },
+
+    style: {
+        stroke: '#000',
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+        var x1 = shape.x1;
+        var y1 = shape.y1;
+        var x2 = shape.x2;
+        var y2 = shape.y2;
+        var percent = shape.percent;
+
+        if (percent === 0) {
+            return;
+        }
+
+        ctx.moveTo(x1, y1);
+
+        if (percent < 1) {
+            x2 = x1 * (1 - percent) + x2 * percent;
+            y2 = y1 * (1 - percent) + y2 * percent;
+        }
+        ctx.lineTo(x2, y2);
+    },
+
+    /**
+     * Get point at percent
+     * @param  {number} percent
+     * @return {Array.<number>}
+     */
+    pointAt: function (p) {
+        var shape = this.shape;
+        return [
+            shape.x1 * (1 - p) + shape.x2 * p,
+            shape.y1 * (1 - p) + shape.y2 * p
+        ];
+    }
+});
+
+/**
+ * 贝塞尔曲线
+ * @module zrender/shape/BezierCurve
+ */
+
+var out = [];
+
+function someVectorAt(shape, t, isTangent) {
+    var cpx2 = shape.cpx2;
+    var cpy2 = shape.cpy2;
+    if (cpx2 === null || cpy2 === null) {
+        return [
+            (isTangent ? cubicDerivativeAt : cubicAt)(shape.x1, shape.cpx1, shape.cpx2, shape.x2, t),
+            (isTangent ? cubicDerivativeAt : cubicAt)(shape.y1, shape.cpy1, shape.cpy2, shape.y2, t)
+        ];
+    }
+    else {
+        return [
+            (isTangent ? quadraticDerivativeAt : quadraticAt)(shape.x1, shape.cpx1, shape.x2, t),
+            (isTangent ? quadraticDerivativeAt : quadraticAt)(shape.y1, shape.cpy1, shape.y2, t)
+        ];
+    }
+}
+
+var BezierCurve = Path.extend({
+
+    type: 'bezier-curve',
+
+    shape: {
+        x1: 0,
+        y1: 0,
+        x2: 0,
+        y2: 0,
+        cpx1: 0,
+        cpy1: 0,
+        // cpx2: 0,
+        // cpy2: 0
+
+        // Curve show percent, for animating
+        percent: 1
+    },
+
+    style: {
+        stroke: '#000',
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+        var x1 = shape.x1;
+        var y1 = shape.y1;
+        var x2 = shape.x2;
+        var y2 = shape.y2;
+        var cpx1 = shape.cpx1;
+        var cpy1 = shape.cpy1;
+        var cpx2 = shape.cpx2;
+        var cpy2 = shape.cpy2;
+        var percent = shape.percent;
+        if (percent === 0) {
+            return;
+        }
+
+        ctx.moveTo(x1, y1);
+
+        if (cpx2 == null || cpy2 == null) {
+            if (percent < 1) {
+                quadraticSubdivide(
+                    x1, cpx1, x2, percent, out
+                );
+                cpx1 = out[1];
+                x2 = out[2];
+                quadraticSubdivide(
+                    y1, cpy1, y2, percent, out
+                );
+                cpy1 = out[1];
+                y2 = out[2];
+            }
+
+            ctx.quadraticCurveTo(
+                cpx1, cpy1,
+                x2, y2
+            );
+        }
+        else {
+            if (percent < 1) {
+                cubicSubdivide(
+                    x1, cpx1, cpx2, x2, percent, out
+                );
+                cpx1 = out[1];
+                cpx2 = out[2];
+                x2 = out[3];
+                cubicSubdivide(
+                    y1, cpy1, cpy2, y2, percent, out
+                );
+                cpy1 = out[1];
+                cpy2 = out[2];
+                y2 = out[3];
+            }
+            ctx.bezierCurveTo(
+                cpx1, cpy1,
+                cpx2, cpy2,
+                x2, y2
+            );
+        }
+    },
+
+    /**
+     * Get point at percent
+     * @param  {number} t
+     * @return {Array.<number>}
+     */
+    pointAt: function (t) {
+        return someVectorAt(this.shape, t, false);
+    },
+
+    /**
+     * Get tangent at percent
+     * @param  {number} t
+     * @return {Array.<number>}
+     */
+    tangentAt: function (t) {
+        var p = someVectorAt(this.shape, t, true);
+        return normalize(p, p);
+    }
+});
+
+/**
+ * 圆弧
+ * @module zrender/graphic/shape/Arc
+ */
+
+var Arc = Path.extend({
+
+    type: 'arc',
+
+    shape: {
+
+        cx: 0,
+
+        cy: 0,
+
+        r: 0,
+
+        startAngle: 0,
+
+        endAngle: Math.PI * 2,
+
+        clockwise: true
+    },
+
+    style: {
+
+        stroke: '#000',
+
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+
+        var x = shape.cx;
+        var y = shape.cy;
+        var r = Math.max(shape.r, 0);
+        var startAngle = shape.startAngle;
+        var endAngle = shape.endAngle;
+        var clockwise = shape.clockwise;
+
+        var unitX = Math.cos(startAngle);
+        var unitY = Math.sin(startAngle);
+
+        ctx.moveTo(unitX * r + x, unitY * r + y);
+        ctx.arc(x, y, r, startAngle, endAngle, !clockwise);
+    }
+});
+
+// CompoundPath to improve performance
+
+var CompoundPath = Path.extend({
+
+    type: 'compound',
+
+    shape: {
+
+        paths: null
+    },
+
+    _updatePathDirty: function () {
+        var dirtyPath = this.__dirtyPath;
+        var paths = this.shape.paths;
+        for (var i = 0; i < paths.length; i++) {
+            // Mark as dirty if any subpath is dirty
+            dirtyPath = dirtyPath || paths[i].__dirtyPath;
+        }
+        this.__dirtyPath = dirtyPath;
+        this.__dirty = this.__dirty || dirtyPath;
+    },
+
+    beforeBrush: function () {
+        this._updatePathDirty();
+        var paths = this.shape.paths || [];
+        var scale = this.getGlobalScale();
+        // Update path scale
+        for (var i = 0; i < paths.length; i++) {
+            if (!paths[i].path) {
+                paths[i].createPathProxy();
+            }
+            paths[i].path.setScale(scale[0], scale[1]);
+        }
+    },
+
+    buildPath: function (ctx, shape) {
+        var paths = shape.paths || [];
+        for (var i = 0; i < paths.length; i++) {
+            paths[i].buildPath(ctx, paths[i].shape, true);
+        }
+    },
+
+    afterBrush: function () {
+        var paths = this.shape.paths || [];
+        for (var i = 0; i < paths.length; i++) {
+            paths[i].__dirtyPath = false;
+        }
+    },
+
+    getBoundingRect: function () {
+        this._updatePathDirty();
+        return Path.prototype.getBoundingRect.call(this);
+    }
+});
+
+/**
+ * @param {Array.<Object>} colorStops
+ */
+var Gradient = function (colorStops) {
+
+    this.colorStops = colorStops || [];
+
+};
+
+Gradient.prototype = {
+
+    constructor: Gradient,
+
+    addColorStop: function (offset, color) {
+        this.colorStops.push({
+
+            offset: offset,
+
+            color: color
+        });
+    }
+
+};
+
+/**
+ * x, y, x2, y2 are all percent from 0 to 1
+ * @param {number} [x=0]
+ * @param {number} [y=0]
+ * @param {number} [x2=1]
+ * @param {number} [y2=0]
+ * @param {Array.<Object>} colorStops
+ * @param {boolean} [globalCoord=false]
+ */
+var LinearGradient = function (x, y, x2, y2, colorStops, globalCoord) {
+    // Should do nothing more in this constructor. Because gradient can be
+    // declard by `color: {type: 'linear', colorStops: ...}`, where
+    // this constructor will not be called.
+
+    this.x = x == null ? 0 : x;
+
+    this.y = y == null ? 0 : y;
+
+    this.x2 = x2 == null ? 1 : x2;
+
+    this.y2 = y2 == null ? 0 : y2;
+
+    // Can be cloned
+    this.type = 'linear';
+
+    // If use global coord
+    this.global = globalCoord || false;
+
+    Gradient.call(this, colorStops);
+};
+
+LinearGradient.prototype = {
+
+    constructor: LinearGradient
+};
+
+inherits(LinearGradient, Gradient);
+
+/**
+ * x, y, r are all percent from 0 to 1
+ * @param {number} [x=0.5]
+ * @param {number} [y=0.5]
+ * @param {number} [r=0.5]
+ * @param {Array.<Object>} [colorStops]
+ * @param {boolean} [globalCoord=false]
+ */
+var RadialGradient = function (x, y, r, colorStops, globalCoord) {
+    // Should do nothing more in this constructor. Because gradient can be
+    // declard by `color: {type: 'radial', colorStops: ...}`, where
+    // this constructor will not be called.
+
+    this.x = x == null ? 0.5 : x;
+
+    this.y = y == null ? 0.5 : y;
+
+    this.r = r == null ? 0.5 : r;
+
+    // Can be cloned
+    this.type = 'radial';
+
+    // If use global coord
+    this.global = globalCoord || false;
+
+    Gradient.call(this, colorStops);
+};
+
+RadialGradient.prototype = {
+
+    constructor: RadialGradient
+};
+
+inherits(RadialGradient, Gradient);
+
+/**
+ * Displayable for incremental rendering. It will be rendered in a separate layer
+ * IncrementalDisplay have too main methods. `clearDisplayables` and `addDisplayables`
+ * addDisplayables will render the added displayables incremetally.
+ *
+ * It use a not clearFlag to tell the painter don't clear the layer if it's the first element.
+ */
+// TODO Style override ?
+function IncrementalDisplayble(opts) {
+
+    Displayable.call(this, opts);
+
+    this._displayables = [];
+
+    this._temporaryDisplayables = [];
+
+    this._cursor = 0;
+
+    this.notClear = true;
+}
+
+IncrementalDisplayble.prototype.incremental = true;
+
+IncrementalDisplayble.prototype.clearDisplaybles = function () {
+    this._displayables = [];
+    this._temporaryDisplayables = [];
+    this._cursor = 0;
+    this.dirty();
+
+    this.notClear = false;
+};
+
+IncrementalDisplayble.prototype.addDisplayable = function (displayable, notPersistent) {
+    if (notPersistent) {
+        this._temporaryDisplayables.push(displayable);
+    }
+    else {
+        this._displayables.push(displayable);
+    }
+    this.dirty();
+};
+
+IncrementalDisplayble.prototype.addDisplayables = function (displayables, notPersistent) {
+    notPersistent = notPersistent || false;
+    for (var i = 0; i < displayables.length; i++) {
+        this.addDisplayable(displayables[i], notPersistent);
+    }
+};
+
+IncrementalDisplayble.prototype.eachPendingDisplayable = function  (cb) {
+    for (var i = this._cursor; i < this._displayables.length; i++) {
+        cb && cb(this._displayables[i]);
+    }
+    for (var i = 0; i < this._temporaryDisplayables.length; i++) {
+        cb && cb(this._temporaryDisplayables[i]);
+    }
+};
+
+IncrementalDisplayble.prototype.update = function () {
+    this.updateTransform();
+    for (var i = this._cursor; i < this._displayables.length; i++) {
+        var displayable = this._displayables[i];
+        // PENDING
+        displayable.parent = this;
+        displayable.update();
+        displayable.parent = null;
+    }
+    for (var i = 0; i < this._temporaryDisplayables.length; i++) {
+        var displayable = this._temporaryDisplayables[i];
+        // PENDING
+        displayable.parent = this;
+        displayable.update();
+        displayable.parent = null;
+    }
+};
+
+IncrementalDisplayble.prototype.brush = function (ctx, prevEl) {
+    // Render persistant displayables.
+    for (var i = this._cursor; i < this._displayables.length; i++) {
+        var displayable = this._displayables[i];
+        displayable.beforeBrush && displayable.beforeBrush(ctx);
+        displayable.brush(ctx, i === this._cursor ? null : this._displayables[i - 1]);
+        displayable.afterBrush && displayable.afterBrush(ctx);
+    }
+    this._cursor = i;
+    // Render temporary displayables.
+    for (var i = 0; i < this._temporaryDisplayables.length; i++) {
+        var displayable = this._temporaryDisplayables[i];
+        displayable.beforeBrush && displayable.beforeBrush(ctx);
+        displayable.brush(ctx, i === 0 ? null : this._temporaryDisplayables[i - 1]);
+        displayable.afterBrush && displayable.afterBrush(ctx);
+    }
+
+    this._temporaryDisplayables = [];
+
+    this.notClear = true;
+};
+
+var m = [];
+IncrementalDisplayble.prototype.getBoundingRect = function () {
+    if (!this._rect) {
+        var rect = new BoundingRect(Infinity, Infinity, -Infinity, -Infinity);
+        for (var i = 0; i < this._displayables.length; i++) {
+            var displayable = this._displayables[i];
+            var childRect = displayable.getBoundingRect().clone();
+            if (displayable.needLocalTransform()) {
+                childRect.applyTransform(displayable.getLocalTransform(m));
+            }
+            rect.union(childRect);
+        }
+        this._rect = rect;
+    }
+    return this._rect;
+};
+
+IncrementalDisplayble.prototype.contain = function (x, y) {
+    var localPos = this.transformCoordToLocal(x, y);
+    var rect = this.getBoundingRect();
+
+    if (rect.contain(localPos[0], localPos[1])) {
+        for (var i = 0; i < this._displayables.length; i++) {
+            var displayable = this._displayables[i];
+            if (displayable.contain(x, y)) {
+                return true;
+            }
+        }
+    }
+    return false;
+};
+
+inherits(IncrementalDisplayble, Displayable);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var round = Math.round;
+var mathMax$1 = Math.max;
+var mathMin$1 = Math.min;
+
+var EMPTY_OBJ = {};
+
+/**
+ * Extend shape with parameters
+ */
+function extendShape(opts) {
+    return Path.extend(opts);
+}
+
+/**
+ * Extend path
+ */
+function extendPath(pathData, opts) {
+    return extendFromString(pathData, opts);
+}
+
+/**
+ * Create a path element from path data string
+ * @param {string} pathData
+ * @param {Object} opts
+ * @param {module:zrender/core/BoundingRect} rect
+ * @param {string} [layout=cover] 'center' or 'cover'
+ */
+function makePath(pathData, opts, rect, layout) {
+    var path = createFromString(pathData, opts);
+    var boundingRect = path.getBoundingRect();
+    if (rect) {
+        if (layout === 'center') {
+            rect = centerGraphic(rect, boundingRect);
+        }
+
+        resizePath(path, rect);
+    }
+    return path;
+}
+
+/**
+ * Create a image element from image url
+ * @param {string} imageUrl image url
+ * @param {Object} opts options
+ * @param {module:zrender/core/BoundingRect} rect constrain rect
+ * @param {string} [layout=cover] 'center' or 'cover'
+ */
+function makeImage(imageUrl, rect, layout) {
+    var path = new ZImage({
+        style: {
+            image: imageUrl,
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        onload: function (img) {
+            if (layout === 'center') {
+                var boundingRect = {
+                    width: img.width,
+                    height: img.height
+                };
+                path.setStyle(centerGraphic(rect, boundingRect));
+            }
+        }
+    });
+    return path;
+}
+
+/**
+ * Get position of centered element in bounding box.
+ *
+ * @param  {Object} rect         element local bounding box
+ * @param  {Object} boundingRect constraint bounding box
+ * @return {Object} element position containing x, y, width, and height
+ */
+function centerGraphic(rect, boundingRect) {
+    // Set rect to center, keep width / height ratio.
+    var aspect = boundingRect.width / boundingRect.height;
+    var width = rect.height * aspect;
+    var height;
+    if (width <= rect.width) {
+        height = rect.height;
+    }
+    else {
+        width = rect.width;
+        height = width / aspect;
+    }
+    var cx = rect.x + rect.width / 2;
+    var cy = rect.y + rect.height / 2;
+
+    return {
+        x: cx - width / 2,
+        y: cy - height / 2,
+        width: width,
+        height: height
+    };
+}
+
+var mergePath = mergePath$1;
+
+/**
+ * Resize a path to fit the rect
+ * @param {module:zrender/graphic/Path} path
+ * @param {Object} rect
+ */
+function resizePath(path, rect) {
+    if (!path.applyTransform) {
+        return;
+    }
+
+    var pathRect = path.getBoundingRect();
+
+    var m = pathRect.calculateTransform(rect);
+
+    path.applyTransform(m);
+}
+
+/**
+ * Sub pixel optimize line for canvas
+ *
+ * @param {Object} param
+ * @param {Object} [param.shape]
+ * @param {number} [param.shape.x1]
+ * @param {number} [param.shape.y1]
+ * @param {number} [param.shape.x2]
+ * @param {number} [param.shape.y2]
+ * @param {Object} [param.style]
+ * @param {number} [param.style.lineWidth]
+ * @return {Object} Modified param
+ */
+function subPixelOptimizeLine(param) {
+    var shape = param.shape;
+    var lineWidth = param.style.lineWidth;
+
+    if (round(shape.x1 * 2) === round(shape.x2 * 2)) {
+        shape.x1 = shape.x2 = subPixelOptimize(shape.x1, lineWidth, true);
+    }
+    if (round(shape.y1 * 2) === round(shape.y2 * 2)) {
+        shape.y1 = shape.y2 = subPixelOptimize(shape.y1, lineWidth, true);
+    }
+    return param;
+}
+
+/**
+ * Sub pixel optimize rect for canvas
+ *
+ * @param {Object} param
+ * @param {Object} [param.shape]
+ * @param {number} [param.shape.x]
+ * @param {number} [param.shape.y]
+ * @param {number} [param.shape.width]
+ * @param {number} [param.shape.height]
+ * @param {Object} [param.style]
+ * @param {number} [param.style.lineWidth]
+ * @return {Object} Modified param
+ */
+function subPixelOptimizeRect(param) {
+    var shape = param.shape;
+    var lineWidth = param.style.lineWidth;
+    var originX = shape.x;
+    var originY = shape.y;
+    var originWidth = shape.width;
+    var originHeight = shape.height;
+    shape.x = subPixelOptimize(shape.x, lineWidth, true);
+    shape.y = subPixelOptimize(shape.y, lineWidth, true);
+    shape.width = Math.max(
+        subPixelOptimize(originX + originWidth, lineWidth, false) - shape.x,
+        originWidth === 0 ? 0 : 1
+    );
+    shape.height = Math.max(
+        subPixelOptimize(originY + originHeight, lineWidth, false) - shape.y,
+        originHeight === 0 ? 0 : 1
+    );
+    return param;
+}
+
+/**
+ * Sub pixel optimize for canvas
+ *
+ * @param {number} position Coordinate, such as x, y
+ * @param {number} lineWidth Should be nonnegative integer.
+ * @param {boolean=} positiveOrNegative Default false (negative).
+ * @return {number} Optimized position.
+ */
+function subPixelOptimize(position, lineWidth, positiveOrNegative) {
+    // Assure that (position + lineWidth / 2) is near integer edge,
+    // otherwise line will be fuzzy in canvas.
+    var doubledPosition = round(position * 2);
+    return (doubledPosition + round(lineWidth)) % 2 === 0
+        ? doubledPosition / 2
+        : (doubledPosition + (positiveOrNegative ? 1 : -1)) / 2;
+}
+
+function hasFillOrStroke(fillOrStroke) {
+    return fillOrStroke != null && fillOrStroke != 'none';
+}
+
+function liftColor(color) {
+    return typeof color === 'string' ? lift(color, -0.1) : color;
+}
+
+/**
+ * @private
+ */
+function cacheElementStl(el) {
+    if (el.__hoverStlDirty) {
+        var stroke = el.style.stroke;
+        var fill = el.style.fill;
+
+        // Create hoverStyle on mouseover
+        var hoverStyle = el.__hoverStl;
+        hoverStyle.fill = hoverStyle.fill
+            || (hasFillOrStroke(fill) ? liftColor(fill) : null);
+        hoverStyle.stroke = hoverStyle.stroke
+            || (hasFillOrStroke(stroke) ? liftColor(stroke) : null);
+
+        var normalStyle = {};
+        for (var name in hoverStyle) {
+            // See comment in `doSingleEnterHover`.
+            if (hoverStyle[name] != null) {
+                normalStyle[name] = el.style[name];
+            }
+        }
+
+        el.__normalStl = normalStyle;
+
+        el.__hoverStlDirty = false;
+    }
+}
+
+/**
+ * @private
+ */
+function doSingleEnterHover(el) {
+    if (el.__isHover) {
+        return;
+    }
+
+    cacheElementStl(el);
+
+    if (el.useHoverLayer) {
+        el.__zr && el.__zr.addHover(el, el.__hoverStl);
+    }
+    else {
+        var style = el.style;
+        var insideRollbackOpt = style.insideRollbackOpt;
+
+        // Consider case: only `position: 'top'` is set on emphasis, then text
+        // color should be returned to `autoColor`, rather than remain '#fff'.
+        // So we should rollback then apply again after style merging.
+        insideRollbackOpt && rollbackInsideStyle(style);
+
+        // styles can be:
+        // {
+        //    label: {
+        //        show: false,
+        //        position: 'outside',
+        //        fontSize: 18
+        //    },
+        //    emphasis: {
+        //        label: {
+        //            show: true
+        //        }
+        //    }
+        // },
+        // where properties of `emphasis` may not appear in `normal`. We previously use
+        // module:echarts/util/model#defaultEmphasis to merge `normal` to `emphasis`.
+        // But consider rich text and setOption in merge mode, it is impossible to cover
+        // all properties in merge. So we use merge mode when setting style here, where
+        // only properties that is not `null/undefined` can be set. The disadventage:
+        // null/undefined can not be used to remove style any more in `emphasis`.
+        style.extendFrom(el.__hoverStl);
+
+        // Do not save `insideRollback`.
+        if (insideRollbackOpt) {
+            applyInsideStyle(style, style.insideOriginalTextPosition, insideRollbackOpt);
+
+            // textFill may be rollbacked to null.
+            if (style.textFill == null) {
+                style.textFill = insideRollbackOpt.autoColor;
+            }
+        }
+
+        el.dirty(false);
+        el.z2 += 1;
+    }
+
+    el.__isHover = true;
+}
+
+/**
+ * @inner
+ */
+function doSingleLeaveHover(el) {
+    if (!el.__isHover) {
+        return;
+    }
+
+    var normalStl = el.__normalStl;
+    if (el.useHoverLayer) {
+        el.__zr && el.__zr.removeHover(el);
+    }
+    else {
+        // Consider null/undefined value, should use
+        // `setStyle` but not `extendFrom(stl, true)`.
+        normalStl && el.setStyle(normalStl);
+        el.z2 -= 1;
+    }
+
+    el.__isHover = false;
+}
+
+/**
+ * @inner
+ */
+function doEnterHover(el) {
+    el.type === 'group'
+        ? el.traverse(function (child) {
+            if (child.type !== 'group') {
+                doSingleEnterHover(child);
+            }
+        })
+        : doSingleEnterHover(el);
+}
+
+function doLeaveHover(el) {
+    el.type === 'group'
+        ? el.traverse(function (child) {
+            if (child.type !== 'group') {
+                doSingleLeaveHover(child);
+            }
+        })
+        : doSingleLeaveHover(el);
+}
+
+/**
+ * @inner
+ */
+function setElementHoverStl(el, hoverStl) {
+    // If element has sepcified hoverStyle, then use it instead of given hoverStyle
+    // Often used when item group has a label element and it's hoverStyle is different
+    el.__hoverStl = el.hoverStyle || hoverStl || {};
+    el.__hoverStlDirty = true;
+
+    if (el.__isHover) {
+        cacheElementStl(el);
+    }
+}
+
+/**
+ * @inner
+ */
+function onElementMouseOver(e) {
+    if (this.__hoverSilentOnTouch && e.zrByTouch) {
+        return;
+    }
+
+    // Only if element is not in emphasis status
+    !this.__isEmphasis && doEnterHover(this);
+}
+
+/**
+ * @inner
+ */
+function onElementMouseOut(e) {
+    if (this.__hoverSilentOnTouch && e.zrByTouch) {
+        return;
+    }
+
+    // Only if element is not in emphasis status
+    !this.__isEmphasis && doLeaveHover(this);
+}
+
+/**
+ * @inner
+ */
+function enterEmphasis() {
+    this.__isEmphasis = true;
+    doEnterHover(this);
+}
+
+/**
+ * @inner
+ */
+function leaveEmphasis() {
+    this.__isEmphasis = false;
+    doLeaveHover(this);
+}
+
+/**
+ * Set hover style of element.
+ * This method can be called repeatly without side-effects.
+ * @param {module:zrender/Element} el
+ * @param {Object} [hoverStyle]
+ * @param {Object} [opt]
+ * @param {boolean} [opt.hoverSilentOnTouch=false]
+ *        In touch device, mouseover event will be trigger on touchstart event
+ *        (see module:zrender/dom/HandlerProxy). By this mechanism, we can
+ *        conviniently use hoverStyle when tap on touch screen without additional
+ *        code for compatibility.
+ *        But if the chart/component has select feature, which usually also use
+ *        hoverStyle, there might be conflict between 'select-highlight' and
+ *        'hover-highlight' especially when roam is enabled (see geo for example).
+ *        In this case, hoverSilentOnTouch should be used to disable hover-highlight
+ *        on touch device.
+ */
+function setHoverStyle(el, hoverStyle, opt) {
+    el.__hoverSilentOnTouch = opt && opt.hoverSilentOnTouch;
+
+    el.type === 'group'
+        ? el.traverse(function (child) {
+            if (child.type !== 'group') {
+                setElementHoverStl(child, hoverStyle);
+            }
+        })
+        : setElementHoverStl(el, hoverStyle);
+
+    // Duplicated function will be auto-ignored, see Eventful.js.
+    el.on('mouseover', onElementMouseOver)
+        .on('mouseout', onElementMouseOut);
+
+    // Emphasis, normal can be triggered manually
+    el.on('emphasis', enterEmphasis)
+        .on('normal', leaveEmphasis);
+}
+
+/**
+ * @param {Object|module:zrender/graphic/Style} normalStyle
+ * @param {Object} emphasisStyle
+ * @param {module:echarts/model/Model} normalModel
+ * @param {module:echarts/model/Model} emphasisModel
+ * @param {Object} opt Check `opt` of `setTextStyleCommon` to find other props.
+ * @param {string|Function} [opt.defaultText]
+ * @param {module:echarts/model/Model} [opt.labelFetcher] Fetch text by
+ *      `opt.labelFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ * @param {module:echarts/model/Model} [opt.labelDataIndex] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ * @param {module:echarts/model/Model} [opt.labelDimIndex] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ * @param {Object} [normalSpecified]
+ * @param {Object} [emphasisSpecified]
+ */
+function setLabelStyle(
+    normalStyle, emphasisStyle,
+    normalModel, emphasisModel,
+    opt,
+    normalSpecified, emphasisSpecified
+) {
+    opt = opt || EMPTY_OBJ;
+    var labelFetcher = opt.labelFetcher;
+    var labelDataIndex = opt.labelDataIndex;
+    var labelDimIndex = opt.labelDimIndex;
+
+    // This scenario, `label.normal.show = true; label.emphasis.show = false`,
+    // is not supported util someone requests.
+
+    var showNormal = normalModel.getShallow('show');
+    var showEmphasis = emphasisModel.getShallow('show');
+
+    // Consider performance, only fetch label when necessary.
+    // If `normal.show` is `false` and `emphasis.show` is `true` and `emphasis.formatter` is not set,
+    // label should be displayed, where text is fetched by `normal.formatter` or `opt.defaultText`.
+    var baseText;
+    if (showNormal || showEmphasis) {
+        if (labelFetcher) {
+            baseText = labelFetcher.getFormattedLabel(labelDataIndex, 'normal', null, labelDimIndex);
+        }
+        if (baseText == null) {
+            baseText = isFunction$1(opt.defaultText) ? opt.defaultText(labelDataIndex, opt) : opt.defaultText;
+        }
+    }
+    var normalStyleText = showNormal ? baseText : null;
+    var emphasisStyleText = showEmphasis
+        ? retrieve2(
+            labelFetcher
+                ? labelFetcher.getFormattedLabel(labelDataIndex, 'emphasis', null, labelDimIndex)
+                : null,
+            baseText
+        )
+        : null;
+
+    // Optimize: If style.text is null, text will not be drawn.
+    if (normalStyleText != null || emphasisStyleText != null) {
+        // Always set `textStyle` even if `normalStyle.text` is null, because default
+        // values have to be set on `normalStyle`.
+        // If we set default values on `emphasisStyle`, consider case:
+        // Firstly, `setOption(... label: {normal: {text: null}, emphasis: {show: true}} ...);`
+        // Secondly, `setOption(... label: {noraml: {show: true, text: 'abc', color: 'red'} ...);`
+        // Then the 'red' will not work on emphasis.
+        setTextStyle(normalStyle, normalModel, normalSpecified, opt);
+        setTextStyle(emphasisStyle, emphasisModel, emphasisSpecified, opt, true);
+    }
+
+    normalStyle.text = normalStyleText;
+    emphasisStyle.text = emphasisStyleText;
+}
+
+/**
+ * Set basic textStyle properties.
+ * @param {Object|module:zrender/graphic/Style} textStyle
+ * @param {module:echarts/model/Model} model
+ * @param {Object} [specifiedTextStyle] Can be overrided by settings in model.
+ * @param {Object} [opt] See `opt` of `setTextStyleCommon`.
+ * @param {boolean} [isEmphasis]
+ */
+function setTextStyle(
+    textStyle, textStyleModel, specifiedTextStyle, opt, isEmphasis
+) {
+    setTextStyleCommon(textStyle, textStyleModel, opt, isEmphasis);
+    specifiedTextStyle && extend(textStyle, specifiedTextStyle);
+    textStyle.host && textStyle.host.dirty && textStyle.host.dirty(false);
+
+    return textStyle;
+}
+
+/**
+ * Set text option in the style.
+ * @deprecated
+ * @param {Object} textStyle
+ * @param {module:echarts/model/Model} labelModel
+ * @param {string|boolean} defaultColor Default text color.
+ *        If set as false, it will be processed as a emphasis style.
+ */
+function setText(textStyle, labelModel, defaultColor) {
+    var opt = {isRectText: true};
+    var isEmphasis;
+
+    if (defaultColor === false) {
+        isEmphasis = true;
+    }
+    else {
+        // Support setting color as 'auto' to get visual color.
+        opt.autoColor = defaultColor;
+    }
+    setTextStyleCommon(textStyle, labelModel, opt, isEmphasis);
+    textStyle.host && textStyle.host.dirty && textStyle.host.dirty(false);
+}
+
+/**
+ * {
+ *      disableBox: boolean, Whether diable drawing box of block (outer most).
+ *      isRectText: boolean,
+ *      autoColor: string, specify a color when color is 'auto',
+ *              for textFill, textStroke, textBackgroundColor, and textBorderColor.
+ *              If autoColor specified, it is used as default textFill.
+ *      useInsideStyle:
+ *              `true`: Use inside style (textFill, textStroke, textStrokeWidth)
+ *                  if `textFill` is not specified.
+ *              `false`: Do not use inside style.
+ *              `null/undefined`: use inside style if `isRectText` is true and
+ *                  `textFill` is not specified and textPosition contains `'inside'`.
+ *      forceRich: boolean
+ * }
+ */
+function setTextStyleCommon(textStyle, textStyleModel, opt, isEmphasis) {
+    // Consider there will be abnormal when merge hover style to normal style if given default value.
+    opt = opt || EMPTY_OBJ;
+
+    if (opt.isRectText) {
+        var textPosition = textStyleModel.getShallow('position')
+            || (isEmphasis ? null : 'inside');
+        // 'outside' is not a valid zr textPostion value, but used
+        // in bar series, and magric type should be considered.
+        textPosition === 'outside' && (textPosition = 'top');
+        textStyle.textPosition = textPosition;
+        textStyle.textOffset = textStyleModel.getShallow('offset');
+        var labelRotate = textStyleModel.getShallow('rotate');
+        labelRotate != null && (labelRotate *= Math.PI / 180);
+        textStyle.textRotation = labelRotate;
+        textStyle.textDistance = retrieve2(
+            textStyleModel.getShallow('distance'), isEmphasis ? null : 5
+        );
+    }
+
+    var ecModel = textStyleModel.ecModel;
+    var globalTextStyle = ecModel && ecModel.option.textStyle;
+
+    // Consider case:
+    // {
+    //     data: [{
+    //         value: 12,
+    //         label: {
+    //             rich: {
+    //                 // no 'a' here but using parent 'a'.
+    //             }
+    //         }
+    //     }],
+    //     rich: {
+    //         a: { ... }
+    //     }
+    // }
+    var richItemNames = getRichItemNames(textStyleModel);
+    var richResult;
+    if (richItemNames) {
+        richResult = {};
+        for (var name in richItemNames) {
+            if (richItemNames.hasOwnProperty(name)) {
+                // Cascade is supported in rich.
+                var richTextStyle = textStyleModel.getModel(['rich', name]);
+                // In rich, never `disableBox`.
+                setTokenTextStyle(richResult[name] = {}, richTextStyle, globalTextStyle, opt, isEmphasis);
+            }
+        }
+    }
+    textStyle.rich = richResult;
+
+    setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, isEmphasis, true);
+
+    if (opt.forceRich && !opt.textStyle) {
+        opt.textStyle = {};
+    }
+
+    return textStyle;
+}
+
+// Consider case:
+// {
+//     data: [{
+//         value: 12,
+//         label: {
+//             rich: {
+//                 // no 'a' here but using parent 'a'.
+//             }
+//         }
+//     }],
+//     rich: {
+//         a: { ... }
+//     }
+// }
+function getRichItemNames(textStyleModel) {
+    // Use object to remove duplicated names.
+    var richItemNameMap;
+    while (textStyleModel && textStyleModel !== textStyleModel.ecModel) {
+        var rich = (textStyleModel.option || EMPTY_OBJ).rich;
+        if (rich) {
+            richItemNameMap = richItemNameMap || {};
+            for (var name in rich) {
+                if (rich.hasOwnProperty(name)) {
+                    richItemNameMap[name] = 1;
+                }
+            }
+        }
+        textStyleModel = textStyleModel.parentModel;
+    }
+    return richItemNameMap;
+}
+
+function setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, isEmphasis, isBlock) {
+    // In merge mode, default value should not be given.
+    globalTextStyle = !isEmphasis && globalTextStyle || EMPTY_OBJ;
+
+    textStyle.textFill = getAutoColor(textStyleModel.getShallow('color'), opt)
+        || globalTextStyle.color;
+    textStyle.textStroke = getAutoColor(textStyleModel.getShallow('textBorderColor'), opt)
+        || globalTextStyle.textBorderColor;
+    textStyle.textStrokeWidth = retrieve2(
+        textStyleModel.getShallow('textBorderWidth'),
+        globalTextStyle.textBorderWidth
+    );
+
+    if (!isEmphasis) {
+        if (isBlock) {
+            // Always set `insideRollback`, for clearing previous.
+            var originalTextPosition = textStyle.textPosition;
+            textStyle.insideRollback = applyInsideStyle(textStyle, originalTextPosition, opt);
+            // Save original textPosition, because style.textPosition will be repalced by
+            // real location (like [10, 30]) in zrender.
+            textStyle.insideOriginalTextPosition = originalTextPosition;
+            textStyle.insideRollbackOpt = opt;
+        }
+
+        // Set default finally.
+        if (textStyle.textFill == null) {
+            textStyle.textFill = opt.autoColor;
+        }
+    }
+
+    // Do not use `getFont` here, because merge should be supported, where
+    // part of these properties may be changed in emphasis style, and the
+    // others should remain their original value got from normal style.
+    textStyle.fontStyle = textStyleModel.getShallow('fontStyle') || globalTextStyle.fontStyle;
+    textStyle.fontWeight = textStyleModel.getShallow('fontWeight') || globalTextStyle.fontWeight;
+    textStyle.fontSize = textStyleModel.getShallow('fontSize') || globalTextStyle.fontSize;
+    textStyle.fontFamily = textStyleModel.getShallow('fontFamily') || globalTextStyle.fontFamily;
+
+    textStyle.textAlign = textStyleModel.getShallow('align');
+    textStyle.textVerticalAlign = textStyleModel.getShallow('verticalAlign')
+        || textStyleModel.getShallow('baseline');
+
+    textStyle.textLineHeight = textStyleModel.getShallow('lineHeight');
+    textStyle.textWidth = textStyleModel.getShallow('width');
+    textStyle.textHeight = textStyleModel.getShallow('height');
+    textStyle.textTag = textStyleModel.getShallow('tag');
+
+    if (!isBlock || !opt.disableBox) {
+        textStyle.textBackgroundColor = getAutoColor(textStyleModel.getShallow('backgroundColor'), opt);
+        textStyle.textPadding = textStyleModel.getShallow('padding');
+        textStyle.textBorderColor = getAutoColor(textStyleModel.getShallow('borderColor'), opt);
+        textStyle.textBorderWidth = textStyleModel.getShallow('borderWidth');
+        textStyle.textBorderRadius = textStyleModel.getShallow('borderRadius');
+
+        textStyle.textBoxShadowColor = textStyleModel.getShallow('shadowColor');
+        textStyle.textBoxShadowBlur = textStyleModel.getShallow('shadowBlur');
+        textStyle.textBoxShadowOffsetX = textStyleModel.getShallow('shadowOffsetX');
+        textStyle.textBoxShadowOffsetY = textStyleModel.getShallow('shadowOffsetY');
+    }
+
+    textStyle.textShadowColor = textStyleModel.getShallow('textShadowColor')
+        || globalTextStyle.textShadowColor;
+    textStyle.textShadowBlur = textStyleModel.getShallow('textShadowBlur')
+        || globalTextStyle.textShadowBlur;
+    textStyle.textShadowOffsetX = textStyleModel.getShallow('textShadowOffsetX')
+        || globalTextStyle.textShadowOffsetX;
+    textStyle.textShadowOffsetY = textStyleModel.getShallow('textShadowOffsetY')
+        || globalTextStyle.textShadowOffsetY;
+}
+
+function getAutoColor(color, opt) {
+    return color !== 'auto' ? color : (opt && opt.autoColor) ? opt.autoColor : null;
+}
+
+function applyInsideStyle(textStyle, textPosition, opt) {
+    var useInsideStyle = opt.useInsideStyle;
+    var insideRollback;
+
+    if (textStyle.textFill == null
+        && useInsideStyle !== false
+        && (useInsideStyle === true
+            || (opt.isRectText
+                && textPosition
+                // textPosition can be [10, 30]
+                && typeof textPosition === 'string'
+                && textPosition.indexOf('inside') >= 0
+            )
+        )
+    ) {
+        insideRollback = {
+            textFill: null,
+            textStroke: textStyle.textStroke,
+            textStrokeWidth: textStyle.textStrokeWidth
+        };
+        textStyle.textFill = '#fff';
+        // Consider text with #fff overflow its container.
+        if (textStyle.textStroke == null) {
+            textStyle.textStroke = opt.autoColor;
+            textStyle.textStrokeWidth == null && (textStyle.textStrokeWidth = 2);
+        }
+    }
+
+    return insideRollback;
+}
+
+function rollbackInsideStyle(style) {
+    var insideRollback = style.insideRollback;
+    if (insideRollback) {
+        style.textFill = insideRollback.textFill;
+        style.textStroke = insideRollback.textStroke;
+        style.textStrokeWidth = insideRollback.textStrokeWidth;
+    }
+}
+
+function getFont(opt, ecModel) {
+    // ecModel or default text style model.
+    var gTextStyleModel = ecModel || ecModel.getModel('textStyle');
+    return trim([
+        // FIXME in node-canvas fontWeight is before fontStyle
+        opt.fontStyle || gTextStyleModel && gTextStyleModel.getShallow('fontStyle') || '',
+        opt.fontWeight || gTextStyleModel && gTextStyleModel.getShallow('fontWeight') || '',
+        (opt.fontSize || gTextStyleModel && gTextStyleModel.getShallow('fontSize') || 12) + 'px',
+        opt.fontFamily || gTextStyleModel && gTextStyleModel.getShallow('fontFamily') || 'sans-serif'
+    ].join(' '));
+}
+
+function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb) {
+    if (typeof dataIndex === 'function') {
+        cb = dataIndex;
+        dataIndex = null;
+    }
+    // Do not check 'animation' property directly here. Consider this case:
+    // animation model is an `itemModel`, whose does not have `isAnimationEnabled`
+    // but its parent model (`seriesModel`) does.
+    var animationEnabled = animatableModel && animatableModel.isAnimationEnabled();
+
+    if (animationEnabled) {
+        var postfix = isUpdate ? 'Update' : '';
+        var duration = animatableModel.getShallow('animationDuration' + postfix);
+        var animationEasing = animatableModel.getShallow('animationEasing' + postfix);
+        var animationDelay = animatableModel.getShallow('animationDelay' + postfix);
+        if (typeof animationDelay === 'function') {
+            animationDelay = animationDelay(
+                dataIndex,
+                animatableModel.getAnimationDelayParams
+                    ? animatableModel.getAnimationDelayParams(el, dataIndex)
+                    : null
+            );
+        }
+        if (typeof duration === 'function') {
+            duration = duration(dataIndex);
+        }
+
+        duration > 0
+            ? el.animateTo(props, duration, animationDelay || 0, animationEasing, cb, !!cb)
+            : (el.stopAnimation(), el.attr(props), cb && cb());
+    }
+    else {
+        el.stopAnimation();
+        el.attr(props);
+        cb && cb();
+    }
+}
+
+/**
+ * Update graphic element properties with or without animation according to the
+ * configuration in series.
+ *
+ * Caution: this method will stop previous animation.
+ * So if do not use this method to one element twice before
+ * animation starts, unless you know what you are doing.
+ *
+ * @param {module:zrender/Element} el
+ * @param {Object} props
+ * @param {module:echarts/model/Model} [animatableModel]
+ * @param {number} [dataIndex]
+ * @param {Function} [cb]
+ * @example
+ *     graphic.updateProps(el, {
+ *         position: [100, 100]
+ *     }, seriesModel, dataIndex, function () { console.log('Animation done!'); });
+ *     // Or
+ *     graphic.updateProps(el, {
+ *         position: [100, 100]
+ *     }, seriesModel, function () { console.log('Animation done!'); });
+ */
+function updateProps(el, props, animatableModel, dataIndex, cb) {
+    animateOrSetProps(true, el, props, animatableModel, dataIndex, cb);
+}
+
+/**
+ * Init graphic element properties with or without animation according to the
+ * configuration in series.
+ *
+ * Caution: this method will stop previous animation.
+ * So if do not use this method to one element twice before
+ * animation starts, unless you know what you are doing.
+ *
+ * @param {module:zrender/Element} el
+ * @param {Object} props
+ * @param {module:echarts/model/Model} [animatableModel]
+ * @param {number} [dataIndex]
+ * @param {Function} cb
+ */
+function initProps(el, props, animatableModel, dataIndex, cb) {
+    animateOrSetProps(false, el, props, animatableModel, dataIndex, cb);
+}
+
+/**
+ * Get transform matrix of target (param target),
+ * in coordinate of its ancestor (param ancestor)
+ *
+ * @param {module:zrender/mixin/Transformable} target
+ * @param {module:zrender/mixin/Transformable} [ancestor]
+ */
+function getTransform(target, ancestor) {
+    var mat = identity([]);
+
+    while (target && target !== ancestor) {
+        mul$1(mat, target.getLocalTransform(), mat);
+        target = target.parent;
+    }
+
+    return mat;
+}
+
+/**
+ * Apply transform to an vertex.
+ * @param {Array.<number>} target [x, y]
+ * @param {Array.<number>|TypedArray.<number>|Object} transform Can be:
+ *      + Transform matrix: like [1, 0, 0, 1, 0, 0]
+ *      + {position, rotation, scale}, the same as `zrender/Transformable`.
+ * @param {boolean=} invert Whether use invert matrix.
+ * @return {Array.<number>} [x, y]
+ */
+function applyTransform$1(target, transform, invert$$1) {
+    if (transform && !isArrayLike(transform)) {
+        transform = Transformable.getLocalTransform(transform);
+    }
+
+    if (invert$$1) {
+        transform = invert([], transform);
+    }
+    return applyTransform([], target, transform);
+}
+
+/**
+ * @param {string} direction 'left' 'right' 'top' 'bottom'
+ * @param {Array.<number>} transform Transform matrix: like [1, 0, 0, 1, 0, 0]
+ * @param {boolean=} invert Whether use invert matrix.
+ * @return {string} Transformed direction. 'left' 'right' 'top' 'bottom'
+ */
+function transformDirection(direction, transform, invert$$1) {
+
+    // Pick a base, ensure that transform result will not be (0, 0).
+    var hBase = (transform[4] === 0 || transform[5] === 0 || transform[0] === 0)
+        ? 1 : Math.abs(2 * transform[4] / transform[0]);
+    var vBase = (transform[4] === 0 || transform[5] === 0 || transform[2] === 0)
+        ? 1 : Math.abs(2 * transform[4] / transform[2]);
+
+    var vertex = [
+        direction === 'left' ? -hBase : direction === 'right' ? hBase : 0,
+        direction === 'top' ? -vBase : direction === 'bottom' ? vBase : 0
+    ];
+
+    vertex = applyTransform$1(vertex, transform, invert$$1);
+
+    return Math.abs(vertex[0]) > Math.abs(vertex[1])
+        ? (vertex[0] > 0 ? 'right' : 'left')
+        : (vertex[1] > 0 ? 'bottom' : 'top');
+}
+
+/**
+ * Apply group transition animation from g1 to g2.
+ * If no animatableModel, no animation.
+ */
+function groupTransition(g1, g2, animatableModel, cb) {
+    if (!g1 || !g2) {
+        return;
+    }
+
+    function getElMap(g) {
+        var elMap = {};
+        g.traverse(function (el) {
+            if (!el.isGroup && el.anid) {
+                elMap[el.anid] = el;
+            }
+        });
+        return elMap;
+    }
+    function getAnimatableProps(el) {
+        var obj = {
+            position: clone$1(el.position),
+            rotation: el.rotation
+        };
+        if (el.shape) {
+            obj.shape = extend({}, el.shape);
+        }
+        return obj;
+    }
+    var elMap1 = getElMap(g1);
+
+    g2.traverse(function (el) {
+        if (!el.isGroup && el.anid) {
+            var oldEl = elMap1[el.anid];
+            if (oldEl) {
+                var newProp = getAnimatableProps(el);
+                el.attr(getAnimatableProps(oldEl));
+                updateProps(el, newProp, animatableModel, el.dataIndex);
+            }
+            // else {
+            //     if (el.previousProps) {
+            //         graphic.updateProps
+            //     }
+            // }
+        }
+    });
+}
+
+/**
+ * @param {Array.<Array.<number>>} points Like: [[23, 44], [53, 66], ...]
+ * @param {Object} rect {x, y, width, height}
+ * @return {Array.<Array.<number>>} A new clipped points.
+ */
+function clipPointsByRect(points, rect) {
+    return map(points, function (point) {
+        var x = point[0];
+        x = mathMax$1(x, rect.x);
+        x = mathMin$1(x, rect.x + rect.width);
+        var y = point[1];
+        y = mathMax$1(y, rect.y);
+        y = mathMin$1(y, rect.y + rect.height);
+        return [x, y];
+    });
+}
+
+/**
+ * @param {Object} targetRect {x, y, width, height}
+ * @param {Object} rect {x, y, width, height}
+ * @return {Object} A new clipped rect. If rect size are negative, return undefined.
+ */
+function clipRectByRect(targetRect, rect) {
+    var x = mathMax$1(targetRect.x, rect.x);
+    var x2 = mathMin$1(targetRect.x + targetRect.width, rect.x + rect.width);
+    var y = mathMax$1(targetRect.y, rect.y);
+    var y2 = mathMin$1(targetRect.y + targetRect.height, rect.y + rect.height);
+
+    if (x2 >= x && y2 >= y) {
+        return {
+            x: x,
+            y: y,
+            width: x2 - x,
+            height: y2 - y
+        };
+    }
+}
+
+/**
+ * @param {string} iconStr Support 'image://' or 'path://' or direct svg path.
+ * @param {Object} [opt] Properties of `module:zrender/Element`, except `style`.
+ * @param {Object} [rect] {x, y, width, height}
+ * @return {module:zrender/Element} Icon path or image element.
+ */
+function createIcon(iconStr, opt, rect) {
+    opt = extend({rectHover: true}, opt);
+    var style = opt.style = {strokeNoScale: true};
+    rect = rect || {x: -1, y: -1, width: 2, height: 2};
+
+    if (iconStr) {
+        return iconStr.indexOf('image://') === 0
+            ? (
+                style.image = iconStr.slice(8),
+                defaults(style, rect),
+                new ZImage(opt)
+            )
+            : (
+                makePath(
+                    iconStr.replace('path://', ''),
+                    opt,
+                    rect,
+                    'center'
+                )
+            );
+    }
+}
+
+
+
+
+var graphic = (Object.freeze || Object)({
+	extendShape: extendShape,
+	extendPath: extendPath,
+	makePath: makePath,
+	makeImage: makeImage,
+	mergePath: mergePath,
+	resizePath: resizePath,
+	subPixelOptimizeLine: subPixelOptimizeLine,
+	subPixelOptimizeRect: subPixelOptimizeRect,
+	subPixelOptimize: subPixelOptimize,
+	setHoverStyle: setHoverStyle,
+	setLabelStyle: setLabelStyle,
+	setTextStyle: setTextStyle,
+	setText: setText,
+	getFont: getFont,
+	updateProps: updateProps,
+	initProps: initProps,
+	getTransform: getTransform,
+	applyTransform: applyTransform$1,
+	transformDirection: transformDirection,
+	groupTransition: groupTransition,
+	clipPointsByRect: clipPointsByRect,
+	clipRectByRect: clipRectByRect,
+	createIcon: createIcon,
+	Group: Group,
+	Image: ZImage,
+	Text: Text,
+	Circle: Circle,
+	Sector: Sector,
+	Ring: Ring,
+	Polygon: Polygon,
+	Polyline: Polyline,
+	Rect: Rect,
+	Line: Line,
+	BezierCurve: BezierCurve,
+	Arc: Arc,
+	IncrementalDisplayable: IncrementalDisplayble,
+	CompoundPath: CompoundPath,
+	LinearGradient: LinearGradient,
+	RadialGradient: RadialGradient,
+	BoundingRect: BoundingRect
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PATH_COLOR = ['textStyle', 'color'];
+
+var textStyleMixin = {
+    /**
+     * Get color property or get color from option.textStyle.color
+     * @param {boolean} [isEmphasis]
+     * @return {string}
+     */
+    getTextColor: function (isEmphasis) {
+        var ecModel = this.ecModel;
+        return this.getShallow('color')
+            || (
+                (!isEmphasis && ecModel) ? ecModel.get(PATH_COLOR) : null
+            );
+    },
+
+    /**
+     * Create font string from fontStyle, fontWeight, fontSize, fontFamily
+     * @return {string}
+     */
+    getFont: function () {
+        return getFont({
+            fontStyle: this.getShallow('fontStyle'),
+            fontWeight: this.getShallow('fontWeight'),
+            fontSize: this.getShallow('fontSize'),
+            fontFamily: this.getShallow('fontFamily')
+        }, this.ecModel);
+    },
+
+    getTextRect: function (text) {
+        return getBoundingRect(
+            text,
+            this.getFont(),
+            this.getShallow('align'),
+            this.getShallow('verticalAlign') || this.getShallow('baseline'),
+            this.getShallow('padding'),
+            this.getShallow('rich'),
+            this.getShallow('truncateText')
+        );
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getItemStyle = makeStyleMapper(
+    [
+        ['fill', 'color'],
+        ['stroke', 'borderColor'],
+        ['lineWidth', 'borderWidth'],
+        ['opacity'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['shadowColor'],
+        ['textPosition'],
+        ['textAlign']
+    ]
+);
+
+var itemStyleMixin = {
+    getItemStyle: function (excludes, includes) {
+        var style = getItemStyle(this, excludes, includes);
+        var lineDash = this.getBorderLineDash();
+        lineDash && (style.lineDash = lineDash);
+        return style;
+    },
+
+    getBorderLineDash: function () {
+        var lineType = this.get('borderType');
+        return (lineType === 'solid' || lineType == null) ? null
+            : (lineType === 'dashed' ? [5, 5] : [1, 1]);
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/model/Model
+ */
+
+var mixin$1 = mixin;
+var inner = makeInner();
+
+/**
+ * @alias module:echarts/model/Model
+ * @constructor
+ * @param {Object} option
+ * @param {module:echarts/model/Model} [parentModel]
+ * @param {module:echarts/model/Global} [ecModel]
+ */
+function Model(option, parentModel, ecModel) {
+    /**
+     * @type {module:echarts/model/Model}
+     * @readOnly
+     */
+    this.parentModel = parentModel;
+
+    /**
+     * @type {module:echarts/model/Global}
+     * @readOnly
+     */
+    this.ecModel = ecModel;
+
+    /**
+     * @type {Object}
+     * @protected
+     */
+    this.option = option;
+
+    // Simple optimization
+    // if (this.init) {
+    //     if (arguments.length <= 4) {
+    //         this.init(option, parentModel, ecModel, extraOpt);
+    //     }
+    //     else {
+    //         this.init.apply(this, arguments);
+    //     }
+    // }
+}
+
+Model.prototype = {
+
+    constructor: Model,
+
+    /**
+     * Model 的初始化函数
+     * @param {Object} option
+     */
+    init: null,
+
+    /**
+     * 从新的 Option merge
+     */
+    mergeOption: function (option) {
+        merge(this.option, option, true);
+    },
+
+    /**
+     * @param {string|Array.<string>} path
+     * @param {boolean} [ignoreParent=false]
+     * @return {*}
+     */
+    get: function (path, ignoreParent) {
+        if (path == null) {
+            return this.option;
+        }
+
+        return doGet(
+            this.option,
+            this.parsePath(path),
+            !ignoreParent && getParent(this, path)
+        );
+    },
+
+    /**
+     * @param {string} key
+     * @param {boolean} [ignoreParent=false]
+     * @return {*}
+     */
+    getShallow: function (key, ignoreParent) {
+        var option = this.option;
+
+        var val = option == null ? option : option[key];
+        var parentModel = !ignoreParent && getParent(this, key);
+        if (val == null && parentModel) {
+            val = parentModel.getShallow(key);
+        }
+        return val;
+    },
+
+    /**
+     * @param {string|Array.<string>} [path]
+     * @param {module:echarts/model/Model} [parentModel]
+     * @return {module:echarts/model/Model}
+     */
+    getModel: function (path, parentModel) {
+        var obj = path == null
+            ? this.option
+            : doGet(this.option, path = this.parsePath(path));
+
+        var thisParentModel;
+        parentModel = parentModel || (
+            (thisParentModel = getParent(this, path))
+                && thisParentModel.getModel(path)
+        );
+
+        return new Model(obj, parentModel, this.ecModel);
+    },
+
+    /**
+     * If model has option
+     */
+    isEmpty: function () {
+        return this.option == null;
+    },
+
+    restoreData: function () {},
+
+    // Pending
+    clone: function () {
+        var Ctor = this.constructor;
+        return new Ctor(clone(this.option));
+    },
+
+    setReadOnly: function (properties) {
+        // clazzUtil.setReadOnly(this, properties);
+    },
+
+    // If path is null/undefined, return null/undefined.
+    parsePath: function(path) {
+        if (typeof path === 'string') {
+            path = path.split('.');
+        }
+        return path;
+    },
+
+    /**
+     * @param {Function} getParentMethod
+     *        param {Array.<string>|string} path
+     *        return {module:echarts/model/Model}
+     */
+    customizeGetParent: function (getParentMethod) {
+        inner(this).getParent = getParentMethod;
+    },
+
+    isAnimationEnabled: function () {
+        if (!env$1.node) {
+            if (this.option.animation != null) {
+                return !!this.option.animation;
+            }
+            else if (this.parentModel) {
+                return this.parentModel.isAnimationEnabled();
+            }
+        }
+    }
+
+};
+
+function doGet(obj, pathArr, parentModel) {
+    for (var i = 0; i < pathArr.length; i++) {
+        // Ignore empty
+        if (!pathArr[i]) {
+            continue;
+        }
+        // obj could be number/string/... (like 0)
+        obj = (obj && typeof obj === 'object') ? obj[pathArr[i]] : null;
+        if (obj == null) {
+            break;
+        }
+    }
+    if (obj == null && parentModel) {
+        obj = parentModel.get(pathArr);
+    }
+    return obj;
+}
+
+// `path` can be null/undefined
+function getParent(model, path) {
+    var getParentMethod = inner(model).getParent;
+    return getParentMethod ? getParentMethod.call(model, path) : model.parentModel;
+}
+
+// Enable Model.extend.
+enableClassExtend(Model);
+enableClassCheck(Model);
+
+mixin$1(Model, lineStyleMixin);
+mixin$1(Model, areaStyleMixin);
+mixin$1(Model, textStyleMixin);
+mixin$1(Model, itemStyleMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var base = 0;
+
+/**
+ * @public
+ * @param {string} type
+ * @return {string}
+ */
+function getUID(type) {
+    // Considering the case of crossing js context,
+    // use Math.random to make id as unique as possible.
+    return [(type || ''), base++, Math.random().toFixed(5)].join('_');
+}
+
+/**
+ * @inner
+ */
+function enableSubTypeDefaulter(entity) {
+
+    var subTypeDefaulters = {};
+
+    entity.registerSubTypeDefaulter = function (componentType, defaulter) {
+        componentType = parseClassType$1(componentType);
+        subTypeDefaulters[componentType.main] = defaulter;
+    };
+
+    entity.determineSubType = function (componentType, option) {
+        var type = option.type;
+        if (!type) {
+            var componentTypeMain = parseClassType$1(componentType).main;
+            if (entity.hasSubTypes(componentType) && subTypeDefaulters[componentTypeMain]) {
+                type = subTypeDefaulters[componentTypeMain](option);
+            }
+        }
+        return type;
+    };
+
+    return entity;
+}
+
+/**
+ * Topological travel on Activity Network (Activity On Vertices).
+ * Dependencies is defined in Model.prototype.dependencies, like ['xAxis', 'yAxis'].
+ *
+ * If 'xAxis' or 'yAxis' is absent in componentTypeList, just ignore it in topology.
+ *
+ * If there is circle dependencey, Error will be thrown.
+ *
+ */
+function enableTopologicalTravel(entity, dependencyGetter) {
+
+    /**
+     * @public
+     * @param {Array.<string>} targetNameList Target Component type list.
+     *                                           Can be ['aa', 'bb', 'aa.xx']
+     * @param {Array.<string>} fullNameList By which we can build dependency graph.
+     * @param {Function} callback Params: componentType, dependencies.
+     * @param {Object} context Scope of callback.
+     */
+    entity.topologicalTravel = function (targetNameList, fullNameList, callback, context) {
+        if (!targetNameList.length) {
+            return;
+        }
+
+        var result = makeDepndencyGraph(fullNameList);
+        var graph = result.graph;
+        var stack = result.noEntryList;
+
+        var targetNameSet = {};
+        each$1(targetNameList, function (name) {
+            targetNameSet[name] = true;
+        });
+
+        while (stack.length) {
+            var currComponentType = stack.pop();
+            var currVertex = graph[currComponentType];
+            var isInTargetNameSet = !!targetNameSet[currComponentType];
+            if (isInTargetNameSet) {
+                callback.call(context, currComponentType, currVertex.originalDeps.slice());
+                delete targetNameSet[currComponentType];
+            }
+            each$1(
+                currVertex.successor,
+                isInTargetNameSet ? removeEdgeAndAdd : removeEdge
+            );
+        }
+
+        each$1(targetNameSet, function () {
+            throw new Error('Circle dependency may exists');
+        });
+
+        function removeEdge(succComponentType) {
+            graph[succComponentType].entryCount--;
+            if (graph[succComponentType].entryCount === 0) {
+                stack.push(succComponentType);
+            }
+        }
+
+        // Consider this case: legend depends on series, and we call
+        // chart.setOption({series: [...]}), where only series is in option.
+        // If we do not have 'removeEdgeAndAdd', legendModel.mergeOption will
+        // not be called, but only sereis.mergeOption is called. Thus legend
+        // have no chance to update its local record about series (like which
+        // name of series is available in legend).
+        function removeEdgeAndAdd(succComponentType) {
+            targetNameSet[succComponentType] = true;
+            removeEdge(succComponentType);
+        }
+    };
+
+    /**
+     * DepndencyGraph: {Object}
+     * key: conponentType,
+     * value: {
+     *     successor: [conponentTypes...],
+     *     originalDeps: [conponentTypes...],
+     *     entryCount: {number}
+     * }
+     */
+    function makeDepndencyGraph(fullNameList) {
+        var graph = {};
+        var noEntryList = [];
+
+        each$1(fullNameList, function (name) {
+
+            var thisItem = createDependencyGraphItem(graph, name);
+            var originalDeps = thisItem.originalDeps = dependencyGetter(name);
+
+            var availableDeps = getAvailableDependencies(originalDeps, fullNameList);
+            thisItem.entryCount = availableDeps.length;
+            if (thisItem.entryCount === 0) {
+                noEntryList.push(name);
+            }
+
+            each$1(availableDeps, function (dependentName) {
+                if (indexOf(thisItem.predecessor, dependentName) < 0) {
+                    thisItem.predecessor.push(dependentName);
+                }
+                var thatItem = createDependencyGraphItem(graph, dependentName);
+                if (indexOf(thatItem.successor, dependentName) < 0) {
+                    thatItem.successor.push(name);
+                }
+            });
+        });
+
+        return {graph: graph, noEntryList: noEntryList};
+    }
+
+    function createDependencyGraphItem(graph, name) {
+        if (!graph[name]) {
+            graph[name] = {predecessor: [], successor: []};
+        }
+        return graph[name];
+    }
+
+    function getAvailableDependencies(originalDeps, fullNameList) {
+        var availableDeps = [];
+        each$1(originalDeps, function (dep) {
+            indexOf(fullNameList, dep) >= 0 && availableDeps.push(dep);
+        });
+        return availableDeps;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var RADIAN_EPSILON = 1e-4;
+
+function _trim(str) {
+    return str.replace(/^\s+/, '').replace(/\s+$/, '');
+}
+
+/**
+ * Linear mapping a value from domain to range
+ * @memberOf module:echarts/util/number
+ * @param  {(number|Array.<number>)} val
+ * @param  {Array.<number>} domain Domain extent domain[0] can be bigger than domain[1]
+ * @param  {Array.<number>} range  Range extent range[0] can be bigger than range[1]
+ * @param  {boolean} clamp
+ * @return {(number|Array.<number>}
+ */
+function linearMap(val, domain, range, clamp) {
+    var subDomain = domain[1] - domain[0];
+    var subRange = range[1] - range[0];
+
+    if (subDomain === 0) {
+        return subRange === 0
+            ? range[0]
+            : (range[0] + range[1]) / 2;
+    }
+
+    // Avoid accuracy problem in edge, such as
+    // 146.39 - 62.83 === 83.55999999999999.
+    // See echarts/test/ut/spec/util/number.js#linearMap#accuracyError
+    // It is a little verbose for efficiency considering this method
+    // is a hotspot.
+    if (clamp) {
+        if (subDomain > 0) {
+            if (val <= domain[0]) {
+                return range[0];
+            }
+            else if (val >= domain[1]) {
+                return range[1];
+            }
+        }
+        else {
+            if (val >= domain[0]) {
+                return range[0];
+            }
+            else if (val <= domain[1]) {
+                return range[1];
+            }
+        }
+    }
+    else {
+        if (val === domain[0]) {
+            return range[0];
+        }
+        if (val === domain[1]) {
+            return range[1];
+        }
+    }
+
+    return (val - domain[0]) / subDomain * subRange + range[0];
+}
+
+/**
+ * Convert a percent string to absolute number.
+ * Returns NaN if percent is not a valid string or number
+ * @memberOf module:echarts/util/number
+ * @param {string|number} percent
+ * @param {number} all
+ * @return {number}
+ */
+function parsePercent$1(percent, all) {
+    switch (percent) {
+        case 'center':
+        case 'middle':
+            percent = '50%';
+            break;
+        case 'left':
+        case 'top':
+            percent = '0%';
+            break;
+        case 'right':
+        case 'bottom':
+            percent = '100%';
+            break;
+    }
+    if (typeof percent === 'string') {
+        if (_trim(percent).match(/%$/)) {
+            return parseFloat(percent) / 100 * all;
+        }
+
+        return parseFloat(percent);
+    }
+
+    return percent == null ? NaN : +percent;
+}
+
+/**
+ * (1) Fix rounding error of float numbers.
+ * (2) Support return string to avoid scientific notation like '3.5e-7'.
+ *
+ * @param {number} x
+ * @param {number} [precision]
+ * @param {boolean} [returnStr]
+ * @return {number|string}
+ */
+function round$1(x, precision, returnStr) {
+    if (precision == null) {
+        precision = 10;
+    }
+    // Avoid range error
+    precision = Math.min(Math.max(0, precision), 20);
+    x = (+x).toFixed(precision);
+    return returnStr ? x : +x;
+}
+
+function asc(arr) {
+    arr.sort(function (a, b) {
+        return a - b;
+    });
+    return arr;
+}
+
+/**
+ * Get precision
+ * @param {number} val
+ */
+function getPrecision(val) {
+    val = +val;
+    if (isNaN(val)) {
+        return 0;
+    }
+    // It is much faster than methods converting number to string as follows
+    //      var tmp = val.toString();
+    //      return tmp.length - 1 - tmp.indexOf('.');
+    // especially when precision is low
+    var e = 1;
+    var count = 0;
+    while (Math.round(val * e) / e !== val) {
+        e *= 10;
+        count++;
+    }
+    return count;
+}
+
+/**
+ * @param {string|number} val
+ * @return {number}
+ */
+function getPrecisionSafe(val) {
+    var str = val.toString();
+
+    // Consider scientific notation: '3.4e-12' '3.4e+12'
+    var eIndex = str.indexOf('e');
+    if (eIndex > 0) {
+        var precision = +str.slice(eIndex + 1);
+        return precision < 0 ? -precision : 0;
+    }
+    else {
+        var dotIndex = str.indexOf('.');
+        return dotIndex < 0 ? 0 : str.length - 1 - dotIndex;
+    }
+}
+
+/**
+ * Minimal dicernible data precisioin according to a single pixel.
+ *
+ * @param {Array.<number>} dataExtent
+ * @param {Array.<number>} pixelExtent
+ * @return {number} precision
+ */
+function getPixelPrecision(dataExtent, pixelExtent) {
+    var log = Math.log;
+    var LN10 = Math.LN10;
+    var dataQuantity = Math.floor(log(dataExtent[1] - dataExtent[0]) / LN10);
+    var sizeQuantity = Math.round(log(Math.abs(pixelExtent[1] - pixelExtent[0])) / LN10);
+    // toFixed() digits argument must be between 0 and 20.
+    var precision = Math.min(Math.max(-dataQuantity + sizeQuantity, 0), 20);
+    return !isFinite(precision) ? 20 : precision;
+}
+
+/**
+ * Get a data of given precision, assuring the sum of percentages
+ * in valueList is 1.
+ * The largest remainer method is used.
+ * https://en.wikipedia.org/wiki/Largest_remainder_method
+ *
+ * @param {Array.<number>} valueList a list of all data
+ * @param {number} idx index of the data to be processed in valueList
+ * @param {number} precision integer number showing digits of precision
+ * @return {number} percent ranging from 0 to 100
+ */
+function getPercentWithPrecision(valueList, idx, precision) {
+    if (!valueList[idx]) {
+        return 0;
+    }
+
+    var sum = reduce(valueList, function (acc, val) {
+        return acc + (isNaN(val) ? 0 : val);
+    }, 0);
+    if (sum === 0) {
+        return 0;
+    }
+
+    var digits = Math.pow(10, precision);
+    var votesPerQuota = map(valueList, function (val) {
+        return (isNaN(val) ? 0 : val) / sum * digits * 100;
+    });
+    var targetSeats = digits * 100;
+
+    var seats = map(votesPerQuota, function (votes) {
+        // Assign automatic seats.
+        return Math.floor(votes);
+    });
+    var currentSum = reduce(seats, function (acc, val) {
+        return acc + val;
+    }, 0);
+
+    var remainder = map(votesPerQuota, function (votes, idx) {
+        return votes - seats[idx];
+    });
+
+    // Has remainding votes.
+    while (currentSum < targetSeats) {
+        // Find next largest remainder.
+        var max = Number.NEGATIVE_INFINITY;
+        var maxId = null;
+        for (var i = 0, len = remainder.length; i < len; ++i) {
+            if (remainder[i] > max) {
+                max = remainder[i];
+                maxId = i;
+            }
+        }
+
+        // Add a vote to max remainder.
+        ++seats[maxId];
+        remainder[maxId] = 0;
+        ++currentSum;
+    }
+
+    return seats[idx] / digits;
+}
+
+// Number.MAX_SAFE_INTEGER, ie do not support.
+var MAX_SAFE_INTEGER = 9007199254740991;
+
+/**
+ * To 0 - 2 * PI, considering negative radian.
+ * @param {number} radian
+ * @return {number}
+ */
+function remRadian(radian) {
+    var pi2 = Math.PI * 2;
+    return (radian % pi2 + pi2) % pi2;
+}
+
+/**
+ * @param {type} radian
+ * @return {boolean}
+ */
+function isRadianAroundZero(val) {
+    return val > -RADIAN_EPSILON && val < RADIAN_EPSILON;
+}
+
+var TIME_REG = /^(?:(\d{4})(?:[-\/](\d{1,2})(?:[-\/](\d{1,2})(?:[T ](\d{1,2})(?::(\d\d)(?::(\d\d)(?:[.,](\d+))?)?)?(Z|[\+\-]\d\d:?\d\d)?)?)?)?)?$/; // jshint ignore:line
+
+/**
+ * @param {string|Date|number} value These values can be accepted:
+ *   + An instance of Date, represent a time in its own time zone.
+ *   + Or string in a subset of ISO 8601, only including:
+ *     + only year, month, date: '2012-03', '2012-03-01', '2012-03-01 05', '2012-03-01 05:06',
+ *     + separated with T or space: '2012-03-01T12:22:33.123', '2012-03-01 12:22:33.123',
+ *     + time zone: '2012-03-01T12:22:33Z', '2012-03-01T12:22:33+8000', '2012-03-01T12:22:33-05:00',
+ *     all of which will be treated as local time if time zone is not specified
+ *     (see <https://momentjs.com/>).
+ *   + Or other string format, including (all of which will be treated as loacal time):
+ *     '2012', '2012-3-1', '2012/3/1', '2012/03/01',
+ *     '2009/6/12 2:00', '2009/6/12 2:05:08', '2009/6/12 2:05:08.123'
+ *   + a timestamp, which represent a time in UTC.
+ * @return {Date} date
+ */
+function parseDate(value) {
+    if (value instanceof Date) {
+        return value;
+    }
+    else if (typeof value === 'string') {
+        // Different browsers parse date in different way, so we parse it manually.
+        // Some other issues:
+        // new Date('1970-01-01') is UTC,
+        // new Date('1970/01/01') and new Date('1970-1-01') is local.
+        // See issue #3623
+        var match = TIME_REG.exec(value);
+
+        if (!match) {
+            // return Invalid Date.
+            return new Date(NaN);
+        }
+
+        // Use local time when no timezone offset specifed.
+        if (!match[8]) {
+            // match[n] can only be string or undefined.
+            // But take care of '12' + 1 => '121'.
+            return new Date(
+                +match[1],
+                +(match[2] || 1) - 1,
+                +match[3] || 1,
+                +match[4] || 0,
+                +(match[5] || 0),
+                +match[6] || 0,
+                +match[7] || 0
+            );
+        }
+        // Timezoneoffset of Javascript Date has considered DST (Daylight Saving Time,
+        // https://tc39.github.io/ecma262/#sec-daylight-saving-time-adjustment).
+        // For example, system timezone is set as "Time Zone: America/Toronto",
+        // then these code will get different result:
+        // `new Date(1478411999999).getTimezoneOffset();  // get 240`
+        // `new Date(1478412000000).getTimezoneOffset();  // get 300`
+        // So we should not use `new Date`, but use `Date.UTC`.
+        else {
+            var hour = +match[4] || 0;
+            if (match[8].toUpperCase() !== 'Z') {
+                hour -= match[8].slice(0, 3);
+            }
+            return new Date(Date.UTC(
+                +match[1],
+                +(match[2] || 1) - 1,
+                +match[3] || 1,
+                hour,
+                +(match[5] || 0),
+                +match[6] || 0,
+                +match[7] || 0
+            ));
+        }
+    }
+    else if (value == null) {
+        return new Date(NaN);
+    }
+
+    return new Date(Math.round(value));
+}
+
+/**
+ * Quantity of a number. e.g. 0.1, 1, 10, 100
+ *
+ * @param  {number} val
+ * @return {number}
+ */
+function quantity(val) {
+    return Math.pow(10, quantityExponent(val));
+}
+
+function quantityExponent(val) {
+    return Math.floor(Math.log(val) / Math.LN10);
+}
+
+/**
+ * find a “nice” number approximately equal to x. Round the number if round = true,
+ * take ceiling if round = false. The primary observation is that the “nicest”
+ * numbers in decimal are 1, 2, and 5, and all power-of-ten multiples of these numbers.
+ *
+ * See "Nice Numbers for Graph Labels" of Graphic Gems.
+ *
+ * @param  {number} val Non-negative value.
+ * @param  {boolean} round
+ * @return {number}
+ */
+function nice(val, round) {
+    var exponent = quantityExponent(val);
+    var exp10 = Math.pow(10, exponent);
+    var f = val / exp10; // 1 <= f < 10
+    var nf;
+    if (round) {
+        if (f < 1.5) { nf = 1; }
+        else if (f < 2.5) { nf = 2; }
+        else if (f < 4) { nf = 3; }
+        else if (f < 7) { nf = 5; }
+        else { nf = 10; }
+    }
+    else {
+        if (f < 1) { nf = 1; }
+        else if (f < 2) { nf = 2; }
+        else if (f < 3) { nf = 3; }
+        else if (f < 5) { nf = 5; }
+        else { nf = 10; }
+    }
+    val = nf * exp10;
+
+    // Fix 3 * 0.1 === 0.30000000000000004 issue (see IEEE 754).
+    // 20 is the uppper bound of toFixed.
+    return exponent >= -20 ? +val.toFixed(exponent < 0 ? -exponent : 0) : val;
+}
+
+/**
+ * Order intervals asc, and split them when overlap.
+ * expect(numberUtil.reformIntervals([
+ *     {interval: [18, 62], close: [1, 1]},
+ *     {interval: [-Infinity, -70], close: [0, 0]},
+ *     {interval: [-70, -26], close: [1, 1]},
+ *     {interval: [-26, 18], close: [1, 1]},
+ *     {interval: [62, 150], close: [1, 1]},
+ *     {interval: [106, 150], close: [1, 1]},
+ *     {interval: [150, Infinity], close: [0, 0]}
+ * ])).toEqual([
+ *     {interval: [-Infinity, -70], close: [0, 0]},
+ *     {interval: [-70, -26], close: [1, 1]},
+ *     {interval: [-26, 18], close: [0, 1]},
+ *     {interval: [18, 62], close: [0, 1]},
+ *     {interval: [62, 150], close: [0, 1]},
+ *     {interval: [150, Infinity], close: [0, 0]}
+ * ]);
+ * @param {Array.<Object>} list, where `close` mean open or close
+ *        of the interval, and Infinity can be used.
+ * @return {Array.<Object>} The origin list, which has been reformed.
+ */
+function reformIntervals(list) {
+    list.sort(function (a, b) {
+        return littleThan(a, b, 0) ? -1 : 1;
+    });
+
+    var curr = -Infinity;
+    var currClose = 1;
+    for (var i = 0; i < list.length;) {
+        var interval = list[i].interval;
+        var close = list[i].close;
+
+        for (var lg = 0; lg < 2; lg++) {
+            if (interval[lg] <= curr) {
+                interval[lg] = curr;
+                close[lg] = !lg ? 1 - currClose : 1;
+            }
+            curr = interval[lg];
+            currClose = close[lg];
+        }
+
+        if (interval[0] === interval[1] && close[0] * close[1] !== 1) {
+            list.splice(i, 1);
+        }
+        else {
+            i++;
+        }
+    }
+
+    return list;
+
+    function littleThan(a, b, lg) {
+        return a.interval[lg] < b.interval[lg]
+            || (
+                a.interval[lg] === b.interval[lg]
+                && (
+                    (a.close[lg] - b.close[lg] === (!lg ? 1 : -1))
+                    || (!lg && littleThan(a, b, 1))
+                )
+            );
+    }
+}
+
+/**
+ * parseFloat NaNs numeric-cast false positives (null|true|false|"")
+ * ...but misinterprets leading-number strings, particularly hex literals ("0x...")
+ * subtraction forces infinities to NaN
+ *
+ * @param {*} v
+ * @return {boolean}
+ */
+function isNumeric(v) {
+    return v - parseFloat(v) >= 0;
+}
+
+
+var number = (Object.freeze || Object)({
+	linearMap: linearMap,
+	parsePercent: parsePercent$1,
+	round: round$1,
+	asc: asc,
+	getPrecision: getPrecision,
+	getPrecisionSafe: getPrecisionSafe,
+	getPixelPrecision: getPixelPrecision,
+	getPercentWithPrecision: getPercentWithPrecision,
+	MAX_SAFE_INTEGER: MAX_SAFE_INTEGER,
+	remRadian: remRadian,
+	isRadianAroundZero: isRadianAroundZero,
+	parseDate: parseDate,
+	quantity: quantity,
+	nice: nice,
+	reformIntervals: reformIntervals,
+	isNumeric: isNumeric
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * 每三位默认加,格式化
+ * @param {string|number} x
+ * @return {string}
+ */
+function addCommas(x) {
+    if (isNaN(x)) {
+        return '-';
+    }
+    x = (x + '').split('.');
+    return x[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g,'$1,')
+            + (x.length > 1 ? ('.' + x[1]) : '');
+}
+
+/**
+ * @param {string} str
+ * @param {boolean} [upperCaseFirst=false]
+ * @return {string} str
+ */
+function toCamelCase(str, upperCaseFirst) {
+    str = (str || '').toLowerCase().replace(/-(.)/g, function(match, group1) {
+        return group1.toUpperCase();
+    });
+
+    if (upperCaseFirst && str) {
+        str = str.charAt(0).toUpperCase() + str.slice(1);
+    }
+
+    return str;
+}
+
+var normalizeCssArray$1 = normalizeCssArray;
+
+
+var replaceReg = /([&<>"'])/g;
+var replaceMap = {
+    '&': '&amp;',
+    '<': '&lt;',
+    '>': '&gt;',
+    '"': '&quot;',
+    '\'': '&#39;'
+};
+
+function encodeHTML(source) {
+    return source == null
+        ? ''
+        : (source + '').replace(replaceReg, function (str, c) {
+            return replaceMap[c];
+        });
+}
+
+var TPL_VAR_ALIAS = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
+
+var wrapVar = function (varName, seriesIdx) {
+    return '{' + varName + (seriesIdx == null ? '' : seriesIdx) + '}';
+};
+
+/**
+ * Template formatter
+ * @param {string} tpl
+ * @param {Array.<Object>|Object} paramsList
+ * @param {boolean} [encode=false]
+ * @return {string}
+ */
+function formatTpl(tpl, paramsList, encode) {
+    if (!isArray(paramsList)) {
+        paramsList = [paramsList];
+    }
+    var seriesLen = paramsList.length;
+    if (!seriesLen) {
+        return '';
+    }
+
+    var $vars = paramsList[0].$vars || [];
+    for (var i = 0; i < $vars.length; i++) {
+        var alias = TPL_VAR_ALIAS[i];
+        tpl = tpl.replace(wrapVar(alias), wrapVar(alias, 0));
+    }
+    for (var seriesIdx = 0; seriesIdx < seriesLen; seriesIdx++) {
+        for (var k = 0; k < $vars.length; k++) {
+            var val = paramsList[seriesIdx][$vars[k]];
+            tpl = tpl.replace(
+                wrapVar(TPL_VAR_ALIAS[k], seriesIdx),
+                encode ? encodeHTML(val) : val
+            );
+        }
+    }
+
+    return tpl;
+}
+
+/**
+ * simple Template formatter
+ *
+ * @param {string} tpl
+ * @param {Object} param
+ * @param {boolean} [encode=false]
+ * @return {string}
+ */
+function formatTplSimple(tpl, param, encode) {
+    each$1(param, function (value, key) {
+        tpl = tpl.replace(
+            '{' + key + '}',
+            encode ? encodeHTML(value) : value
+        );
+    });
+    return tpl;
+}
+
+/**
+ * @param {Object|string} [opt] If string, means color.
+ * @param {string} [opt.color]
+ * @param {string} [opt.extraCssText]
+ * @param {string} [opt.type='item'] 'item' or 'subItem'
+ * @return {string}
+ */
+function getTooltipMarker(opt, extraCssText) {
+    opt = isString(opt) ? {color: opt, extraCssText: extraCssText} : (opt || {});
+    var color = opt.color;
+    var type = opt.type;
+    var extraCssText = opt.extraCssText;
+
+    if (!color) {
+        return '';
+    }
+
+    return type === 'subItem'
+        ? '<span style="display:inline-block;vertical-align:middle;margin-right:8px;margin-left:3px;'
+            + 'border-radius:4px;width:4px;height:4px;background-color:'
+            + encodeHTML(color) + ';' + (extraCssText || '') + '"></span>'
+        : '<span style="display:inline-block;margin-right:5px;'
+            + 'border-radius:10px;width:10px;height:10px;background-color:'
+            + encodeHTML(color) + ';' + (extraCssText || '') + '"></span>';
+}
+
+function pad(str, len) {
+    str += '';
+    return '0000'.substr(0, len - str.length) + str;
+}
+
+
+/**
+ * ISO Date format
+ * @param {string} tpl
+ * @param {number} value
+ * @param {boolean} [isUTC=false] Default in local time.
+ *           see `module:echarts/scale/Time`
+ *           and `module:echarts/util/number#parseDate`.
+ * @inner
+ */
+function formatTime(tpl, value, isUTC) {
+    if (tpl === 'week'
+        || tpl === 'month'
+        || tpl === 'quarter'
+        || tpl === 'half-year'
+        || tpl === 'year'
+    ) {
+        tpl = 'MM-dd\nyyyy';
+    }
+
+    var date = parseDate(value);
+    var utc = isUTC ? 'UTC' : '';
+    var y = date['get' + utc + 'FullYear']();
+    var M = date['get' + utc + 'Month']() + 1;
+    var d = date['get' + utc + 'Date']();
+    var h = date['get' + utc + 'Hours']();
+    var m = date['get' + utc + 'Minutes']();
+    var s = date['get' + utc + 'Seconds']();
+    var S = date['get' + utc + 'Milliseconds']();
+
+    tpl = tpl.replace('MM', pad(M, 2))
+        .replace('M', M)
+        .replace('yyyy', y)
+        .replace('yy', y % 100)
+        .replace('dd', pad(d, 2))
+        .replace('d', d)
+        .replace('hh', pad(h, 2))
+        .replace('h', h)
+        .replace('mm', pad(m, 2))
+        .replace('m', m)
+        .replace('ss', pad(s, 2))
+        .replace('s', s)
+        .replace('SSS', pad(S, 3));
+
+    return tpl;
+}
+
+/**
+ * Capital first
+ * @param {string} str
+ * @return {string}
+ */
+function capitalFirst(str) {
+    return str ? str.charAt(0).toUpperCase() + str.substr(1) : str;
+}
+
+var truncateText$1 = truncateText;
+
+var getTextRect = getBoundingRect;
+
+
+var format = (Object.freeze || Object)({
+	addCommas: addCommas,
+	toCamelCase: toCamelCase,
+	normalizeCssArray: normalizeCssArray$1,
+	encodeHTML: encodeHTML,
+	formatTpl: formatTpl,
+	formatTplSimple: formatTplSimple,
+	getTooltipMarker: getTooltipMarker,
+	formatTime: formatTime,
+	capitalFirst: capitalFirst,
+	truncateText: truncateText$1,
+	getTextRect: getTextRect
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Layout helpers for each component positioning
+
+var each$3 = each$1;
+
+/**
+ * @public
+ */
+var LOCATION_PARAMS = [
+    'left', 'right', 'top', 'bottom', 'width', 'height'
+];
+
+/**
+ * @public
+ */
+var HV_NAMES = [
+    ['width', 'left', 'right'],
+    ['height', 'top', 'bottom']
+];
+
+function boxLayout(orient, group, gap, maxWidth, maxHeight) {
+    var x = 0;
+    var y = 0;
+
+    if (maxWidth == null) {
+        maxWidth = Infinity;
+    }
+    if (maxHeight == null) {
+        maxHeight = Infinity;
+    }
+    var currentLineMaxSize = 0;
+
+    group.eachChild(function (child, idx) {
+        var position = child.position;
+        var rect = child.getBoundingRect();
+        var nextChild = group.childAt(idx + 1);
+        var nextChildRect = nextChild && nextChild.getBoundingRect();
+        var nextX;
+        var nextY;
+
+        if (orient === 'horizontal') {
+            var moveX = rect.width + (nextChildRect ? (-nextChildRect.x + rect.x) : 0);
+            nextX = x + moveX;
+            // Wrap when width exceeds maxWidth or meet a `newline` group
+            // FIXME compare before adding gap?
+            if (nextX > maxWidth || child.newline) {
+                x = 0;
+                nextX = moveX;
+                y += currentLineMaxSize + gap;
+                currentLineMaxSize = rect.height;
+            }
+            else {
+                // FIXME: consider rect.y is not `0`?
+                currentLineMaxSize = Math.max(currentLineMaxSize, rect.height);
+            }
+        }
+        else {
+            var moveY = rect.height + (nextChildRect ? (-nextChildRect.y + rect.y) : 0);
+            nextY = y + moveY;
+            // Wrap when width exceeds maxHeight or meet a `newline` group
+            if (nextY > maxHeight || child.newline) {
+                x += currentLineMaxSize + gap;
+                y = 0;
+                nextY = moveY;
+                currentLineMaxSize = rect.width;
+            }
+            else {
+                currentLineMaxSize = Math.max(currentLineMaxSize, rect.width);
+            }
+        }
+
+        if (child.newline) {
+            return;
+        }
+
+        position[0] = x;
+        position[1] = y;
+
+        orient === 'horizontal'
+            ? (x = nextX + gap)
+            : (y = nextY + gap);
+    });
+}
+
+/**
+ * VBox or HBox layouting
+ * @param {string} orient
+ * @param {module:zrender/container/Group} group
+ * @param {number} gap
+ * @param {number} [width=Infinity]
+ * @param {number} [height=Infinity]
+ */
+var box = boxLayout;
+
+/**
+ * VBox layouting
+ * @param {module:zrender/container/Group} group
+ * @param {number} gap
+ * @param {number} [width=Infinity]
+ * @param {number} [height=Infinity]
+ */
+var vbox = curry(boxLayout, 'vertical');
+
+/**
+ * HBox layouting
+ * @param {module:zrender/container/Group} group
+ * @param {number} gap
+ * @param {number} [width=Infinity]
+ * @param {number} [height=Infinity]
+ */
+var hbox = curry(boxLayout, 'horizontal');
+
+/**
+ * If x or x2 is not specified or 'center' 'left' 'right',
+ * the width would be as long as possible.
+ * If y or y2 is not specified or 'middle' 'top' 'bottom',
+ * the height would be as long as possible.
+ *
+ * @param {Object} positionInfo
+ * @param {number|string} [positionInfo.x]
+ * @param {number|string} [positionInfo.y]
+ * @param {number|string} [positionInfo.x2]
+ * @param {number|string} [positionInfo.y2]
+ * @param {Object} containerRect {width, height}
+ * @param {string|number} margin
+ * @return {Object} {width, height}
+ */
+function getAvailableSize(positionInfo, containerRect, margin) {
+    var containerWidth = containerRect.width;
+    var containerHeight = containerRect.height;
+
+    var x = parsePercent$1(positionInfo.x, containerWidth);
+    var y = parsePercent$1(positionInfo.y, containerHeight);
+    var x2 = parsePercent$1(positionInfo.x2, containerWidth);
+    var y2 = parsePercent$1(positionInfo.y2, containerHeight);
+
+    (isNaN(x) || isNaN(parseFloat(positionInfo.x))) && (x = 0);
+    (isNaN(x2) || isNaN(parseFloat(positionInfo.x2))) && (x2 = containerWidth);
+    (isNaN(y) || isNaN(parseFloat(positionInfo.y))) && (y = 0);
+    (isNaN(y2) || isNaN(parseFloat(positionInfo.y2))) && (y2 = containerHeight);
+
+    margin = normalizeCssArray$1(margin || 0);
+
+    return {
+        width: Math.max(x2 - x - margin[1] - margin[3], 0),
+        height: Math.max(y2 - y - margin[0] - margin[2], 0)
+    };
+}
+
+/**
+ * Parse position info.
+ *
+ * @param {Object} positionInfo
+ * @param {number|string} [positionInfo.left]
+ * @param {number|string} [positionInfo.top]
+ * @param {number|string} [positionInfo.right]
+ * @param {number|string} [positionInfo.bottom]
+ * @param {number|string} [positionInfo.width]
+ * @param {number|string} [positionInfo.height]
+ * @param {number|string} [positionInfo.aspect] Aspect is width / height
+ * @param {Object} containerRect
+ * @param {string|number} [margin]
+ *
+ * @return {module:zrender/core/BoundingRect}
+ */
+function getLayoutRect(
+    positionInfo, containerRect, margin
+) {
+    margin = normalizeCssArray$1(margin || 0);
+
+    var containerWidth = containerRect.width;
+    var containerHeight = containerRect.height;
+
+    var left = parsePercent$1(positionInfo.left, containerWidth);
+    var top = parsePercent$1(positionInfo.top, containerHeight);
+    var right = parsePercent$1(positionInfo.right, containerWidth);
+    var bottom = parsePercent$1(positionInfo.bottom, containerHeight);
+    var width = parsePercent$1(positionInfo.width, containerWidth);
+    var height = parsePercent$1(positionInfo.height, containerHeight);
+
+    var verticalMargin = margin[2] + margin[0];
+    var horizontalMargin = margin[1] + margin[3];
+    var aspect = positionInfo.aspect;
+
+    // If width is not specified, calculate width from left and right
+    if (isNaN(width)) {
+        width = containerWidth - right - horizontalMargin - left;
+    }
+    if (isNaN(height)) {
+        height = containerHeight - bottom - verticalMargin - top;
+    }
+
+    if (aspect != null) {
+        // If width and height are not given
+        // 1. Graph should not exceeds the container
+        // 2. Aspect must be keeped
+        // 3. Graph should take the space as more as possible
+        // FIXME
+        // Margin is not considered, because there is no case that both
+        // using margin and aspect so far.
+        if (isNaN(width) && isNaN(height)) {
+            if (aspect > containerWidth / containerHeight) {
+                width = containerWidth * 0.8;
+            }
+            else {
+                height = containerHeight * 0.8;
+            }
+        }
+
+        // Calculate width or height with given aspect
+        if (isNaN(width)) {
+            width = aspect * height;
+        }
+        if (isNaN(height)) {
+            height = width / aspect;
+        }
+    }
+
+    // If left is not specified, calculate left from right and width
+    if (isNaN(left)) {
+        left = containerWidth - right - width - horizontalMargin;
+    }
+    if (isNaN(top)) {
+        top = containerHeight - bottom - height - verticalMargin;
+    }
+
+    // Align left and top
+    switch (positionInfo.left || positionInfo.right) {
+        case 'center':
+            left = containerWidth / 2 - width / 2 - margin[3];
+            break;
+        case 'right':
+            left = containerWidth - width - horizontalMargin;
+            break;
+    }
+    switch (positionInfo.top || positionInfo.bottom) {
+        case 'middle':
+        case 'center':
+            top = containerHeight / 2 - height / 2 - margin[0];
+            break;
+        case 'bottom':
+            top = containerHeight - height - verticalMargin;
+            break;
+    }
+    // If something is wrong and left, top, width, height are calculated as NaN
+    left = left || 0;
+    top = top || 0;
+    if (isNaN(width)) {
+        // Width may be NaN if only one value is given except width
+        width = containerWidth - horizontalMargin - left - (right || 0);
+    }
+    if (isNaN(height)) {
+        // Height may be NaN if only one value is given except height
+        height = containerHeight - verticalMargin - top - (bottom || 0);
+    }
+
+    var rect = new BoundingRect(left + margin[3], top + margin[0], width, height);
+    rect.margin = margin;
+    return rect;
+}
+
+
+/**
+ * Position a zr element in viewport
+ *  Group position is specified by either
+ *  {left, top}, {right, bottom}
+ *  If all properties exists, right and bottom will be igonred.
+ *
+ * Logic:
+ *     1. Scale (against origin point in parent coord)
+ *     2. Rotate (against origin point in parent coord)
+ *     3. Traslate (with el.position by this method)
+ * So this method only fixes the last step 'Traslate', which does not affect
+ * scaling and rotating.
+ *
+ * If be called repeatly with the same input el, the same result will be gotten.
+ *
+ * @param {module:zrender/Element} el Should have `getBoundingRect` method.
+ * @param {Object} positionInfo
+ * @param {number|string} [positionInfo.left]
+ * @param {number|string} [positionInfo.top]
+ * @param {number|string} [positionInfo.right]
+ * @param {number|string} [positionInfo.bottom]
+ * @param {number|string} [positionInfo.width] Only for opt.boundingModel: 'raw'
+ * @param {number|string} [positionInfo.height] Only for opt.boundingModel: 'raw'
+ * @param {Object} containerRect
+ * @param {string|number} margin
+ * @param {Object} [opt]
+ * @param {Array.<number>} [opt.hv=[1,1]] Only horizontal or only vertical.
+ * @param {Array.<number>} [opt.boundingMode='all']
+ *        Specify how to calculate boundingRect when locating.
+ *        'all': Position the boundingRect that is transformed and uioned
+ *               both itself and its descendants.
+ *               This mode simplies confine the elements in the bounding
+ *               of their container (e.g., using 'right: 0').
+ *        'raw': Position the boundingRect that is not transformed and only itself.
+ *               This mode is useful when you want a element can overflow its
+ *               container. (Consider a rotated circle needs to be located in a corner.)
+ *               In this mode positionInfo.width/height can only be number.
+ */
+function positionElement(el, positionInfo, containerRect, margin, opt) {
+    var h = !opt || !opt.hv || opt.hv[0];
+    var v = !opt || !opt.hv || opt.hv[1];
+    var boundingMode = opt && opt.boundingMode || 'all';
+
+    if (!h && !v) {
+        return;
+    }
+
+    var rect;
+    if (boundingMode === 'raw') {
+        rect = el.type === 'group'
+            ? new BoundingRect(0, 0, +positionInfo.width || 0, +positionInfo.height || 0)
+            : el.getBoundingRect();
+    }
+    else {
+        rect = el.getBoundingRect();
+        if (el.needLocalTransform()) {
+            var transform = el.getLocalTransform();
+            // Notice: raw rect may be inner object of el,
+            // which should not be modified.
+            rect = rect.clone();
+            rect.applyTransform(transform);
+        }
+    }
+
+    // The real width and height can not be specified but calculated by the given el.
+    positionInfo = getLayoutRect(
+        defaults(
+            {width: rect.width, height: rect.height},
+            positionInfo
+        ),
+        containerRect,
+        margin
+    );
+
+    // Because 'tranlate' is the last step in transform
+    // (see zrender/core/Transformable#getLocalTransform),
+    // we can just only modify el.position to get final result.
+    var elPos = el.position;
+    var dx = h ? positionInfo.x - rect.x : 0;
+    var dy = v ? positionInfo.y - rect.y : 0;
+
+    el.attr('position', boundingMode === 'raw' ? [dx, dy] : [elPos[0] + dx, elPos[1] + dy]);
+}
+
+/**
+ * @param {Object} option Contains some of the properties in HV_NAMES.
+ * @param {number} hvIdx 0: horizontal; 1: vertical.
+ */
+function sizeCalculable(option, hvIdx) {
+    return option[HV_NAMES[hvIdx][0]] != null
+        || (option[HV_NAMES[hvIdx][1]] != null && option[HV_NAMES[hvIdx][2]] != null);
+}
+
+/**
+ * Consider Case:
+ * When defulat option has {left: 0, width: 100}, and we set {right: 0}
+ * through setOption or media query, using normal zrUtil.merge will cause
+ * {right: 0} does not take effect.
+ *
+ * @example
+ * ComponentModel.extend({
+ *     init: function () {
+ *         ...
+ *         var inputPositionParams = layout.getLayoutParams(option);
+ *         this.mergeOption(inputPositionParams);
+ *     },
+ *     mergeOption: function (newOption) {
+ *         newOption && zrUtil.merge(thisOption, newOption, true);
+ *         layout.mergeLayoutParam(thisOption, newOption);
+ *     }
+ * });
+ *
+ * @param {Object} targetOption
+ * @param {Object} newOption
+ * @param {Object|string} [opt]
+ * @param {boolean|Array.<boolean>} [opt.ignoreSize=false] Used for the components
+ *  that width (or height) should not be calculated by left and right (or top and bottom).
+ */
+function mergeLayoutParam(targetOption, newOption, opt) {
+    !isObject$1(opt) && (opt = {});
+
+    var ignoreSize = opt.ignoreSize;
+    !isArray(ignoreSize) && (ignoreSize = [ignoreSize, ignoreSize]);
+
+    var hResult = merge$$1(HV_NAMES[0], 0);
+    var vResult = merge$$1(HV_NAMES[1], 1);
+
+    copy(HV_NAMES[0], targetOption, hResult);
+    copy(HV_NAMES[1], targetOption, vResult);
+
+    function merge$$1(names, hvIdx) {
+        var newParams = {};
+        var newValueCount = 0;
+        var merged = {};
+        var mergedValueCount = 0;
+        var enoughParamNumber = 2;
+
+        each$3(names, function (name) {
+            merged[name] = targetOption[name];
+        });
+        each$3(names, function (name) {
+            // Consider case: newOption.width is null, which is
+            // set by user for removing width setting.
+            hasProp(newOption, name) && (newParams[name] = merged[name] = newOption[name]);
+            hasValue(newParams, name) && newValueCount++;
+            hasValue(merged, name) && mergedValueCount++;
+        });
+
+        if (ignoreSize[hvIdx]) {
+            // Only one of left/right is premitted to exist.
+            if (hasValue(newOption, names[1])) {
+                merged[names[2]] = null;
+            }
+            else if (hasValue(newOption, names[2])) {
+                merged[names[1]] = null;
+            }
+            return merged;
+        }
+
+        // Case: newOption: {width: ..., right: ...},
+        // or targetOption: {right: ...} and newOption: {width: ...},
+        // There is no conflict when merged only has params count
+        // little than enoughParamNumber.
+        if (mergedValueCount === enoughParamNumber || !newValueCount) {
+            return merged;
+        }
+        // Case: newOption: {width: ..., right: ...},
+        // Than we can make sure user only want those two, and ignore
+        // all origin params in targetOption.
+        else if (newValueCount >= enoughParamNumber) {
+            return newParams;
+        }
+        else {
+            // Chose another param from targetOption by priority.
+            for (var i = 0; i < names.length; i++) {
+                var name = names[i];
+                if (!hasProp(newParams, name) && hasProp(targetOption, name)) {
+                    newParams[name] = targetOption[name];
+                    break;
+                }
+            }
+            return newParams;
+        }
+    }
+
+    function hasProp(obj, name) {
+        return obj.hasOwnProperty(name);
+    }
+
+    function hasValue(obj, name) {
+        return obj[name] != null && obj[name] !== 'auto';
+    }
+
+    function copy(names, target, source) {
+        each$3(names, function (name) {
+            target[name] = source[name];
+        });
+    }
+}
+
+/**
+ * Retrieve 'left', 'right', 'top', 'bottom', 'width', 'height' from object.
+ * @param {Object} source
+ * @return {Object} Result contains those props.
+ */
+function getLayoutParams(source) {
+    return copyLayoutParams({}, source);
+}
+
+/**
+ * Retrieve 'left', 'right', 'top', 'bottom', 'width', 'height' from object.
+ * @param {Object} source
+ * @return {Object} Result contains those props.
+ */
+function copyLayoutParams(target, source) {
+    source && target && each$3(LOCATION_PARAMS, function (name) {
+        source.hasOwnProperty(name) && (target[name] = source[name]);
+    });
+    return target;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var boxLayoutMixin = {
+    getBoxLayoutParams: function () {
+        return {
+            left: this.get('left'),
+            top: this.get('top'),
+            right: this.get('right'),
+            bottom: this.get('bottom'),
+            width: this.get('width'),
+            height: this.get('height')
+        };
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Component model
+ *
+ * @module echarts/model/Component
+ */
+
+var inner$1 = makeInner();
+
+/**
+ * @alias module:echarts/model/Component
+ * @constructor
+ * @param {Object} option
+ * @param {module:echarts/model/Model} parentModel
+ * @param {module:echarts/model/Model} ecModel
+ */
+var ComponentModel = Model.extend({
+
+    type: 'component',
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    id: '',
+
+    /**
+     * Because simplified concept is probably better, series.name (or component.name)
+     * has been having too many resposibilities:
+     * (1) Generating id (which requires name in option should not be modified).
+     * (2) As an index to mapping series when merging option or calling API (a name
+     * can refer to more then one components, which is convinient is some case).
+     * (3) Display.
+     * @readOnly
+     */
+    name: '',
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    mainType: '',
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    subType: '',
+
+    /**
+     * @readOnly
+     * @type {number}
+     */
+    componentIndex: 0,
+
+    /**
+     * @type {Object}
+     * @protected
+     */
+    defaultOption: null,
+
+    /**
+     * @type {module:echarts/model/Global}
+     * @readOnly
+     */
+    ecModel: null,
+
+    /**
+     * key: componentType
+     * value:  Component model list, can not be null.
+     * @type {Object.<string, Array.<module:echarts/model/Model>>}
+     * @readOnly
+     */
+    dependentModels: [],
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    uid: null,
+
+    /**
+     * Support merge layout params.
+     * Only support 'box' now (left/right/top/bottom/width/height).
+     * @type {string|Object} Object can be {ignoreSize: true}
+     * @readOnly
+     */
+    layoutMode: null,
+
+    $constructor: function (option, parentModel, ecModel, extraOpt) {
+        Model.call(this, option, parentModel, ecModel, extraOpt);
+
+        this.uid = getUID('ec_cpt_model');
+    },
+
+    init: function (option, parentModel, ecModel, extraOpt) {
+        this.mergeDefaultAndTheme(option, ecModel);
+    },
+
+    mergeDefaultAndTheme: function (option, ecModel) {
+        var layoutMode = this.layoutMode;
+        var inputPositionParams = layoutMode
+            ? getLayoutParams(option) : {};
+
+        var themeModel = ecModel.getTheme();
+        merge(option, themeModel.get(this.mainType));
+        merge(option, this.getDefaultOption());
+
+        if (layoutMode) {
+            mergeLayoutParam(option, inputPositionParams, layoutMode);
+        }
+    },
+
+    mergeOption: function (option, extraOpt) {
+        merge(this.option, option, true);
+
+        var layoutMode = this.layoutMode;
+        if (layoutMode) {
+            mergeLayoutParam(this.option, option, layoutMode);
+        }
+    },
+
+    // Hooker after init or mergeOption
+    optionUpdated: function (newCptOption, isInit) {},
+
+    getDefaultOption: function () {
+        var fields = inner$1(this);
+        if (!fields.defaultOption) {
+            var optList = [];
+            var Class = this.constructor;
+            while (Class) {
+                var opt = Class.prototype.defaultOption;
+                opt && optList.push(opt);
+                Class = Class.superClass;
+            }
+
+            var defaultOption = {};
+            for (var i = optList.length - 1; i >= 0; i--) {
+                defaultOption = merge(defaultOption, optList[i], true);
+            }
+            fields.defaultOption = defaultOption;
+        }
+        return fields.defaultOption;
+    },
+
+    getReferringComponents: function (mainType) {
+        return this.ecModel.queryComponents({
+            mainType: mainType,
+            index: this.get(mainType + 'Index', true),
+            id: this.get(mainType + 'Id', true)
+        });
+    }
+
+});
+
+// Reset ComponentModel.extend, add preConstruct.
+// clazzUtil.enableClassExtend(
+//     ComponentModel,
+//     function (option, parentModel, ecModel, extraOpt) {
+//         // Set dependentModels, componentIndex, name, id, mainType, subType.
+//         zrUtil.extend(this, extraOpt);
+
+//         this.uid = componentUtil.getUID('componentModel');
+
+//         // this.setReadOnly([
+//         //     'type', 'id', 'uid', 'name', 'mainType', 'subType',
+//         //     'dependentModels', 'componentIndex'
+//         // ]);
+//     }
+// );
+
+// Add capability of registerClass, getClass, hasClass, registerSubTypeDefaulter and so on.
+enableClassManagement(
+    ComponentModel, {registerWhenExtend: true}
+);
+enableSubTypeDefaulter(ComponentModel);
+
+// Add capability of ComponentModel.topologicalTravel.
+enableTopologicalTravel(ComponentModel, getDependencies);
+
+function getDependencies(componentType) {
+    var deps = [];
+    each$1(ComponentModel.getClassesByMainType(componentType), function (Clazz) {
+        deps = deps.concat(Clazz.prototype.dependencies || []);
+    });
+
+    // Ensure main type.
+    deps = map(deps, function (type) {
+        return parseClassType$1(type).main;
+    });
+
+    // Hack dataset for convenience.
+    if (componentType !== 'dataset' && indexOf(deps, 'dataset') <= 0) {
+        deps.unshift('dataset');
+    }
+
+    return deps;
+}
+
+mixin(ComponentModel, boxLayoutMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var platform = '';
+// Navigator not exists in node
+if (typeof navigator !== 'undefined') {
+    platform = navigator.platform || '';
+}
+
+var globalDefault = {
+    // backgroundColor: 'rgba(0,0,0,0)',
+
+    // https://dribbble.com/shots/1065960-Infographic-Pie-chart-visualization
+    // color: ['#5793f3', '#d14a61', '#fd9c35', '#675bba', '#fec42c', '#dd4444', '#d4df5a', '#cd4870'],
+    // Light colors:
+    // color: ['#bcd3bb', '#e88f70', '#edc1a5', '#9dc5c8', '#e1e8c8', '#7b7c68', '#e5b5b5', '#f0b489', '#928ea8', '#bda29a'],
+    // color: ['#cc5664', '#9bd6ec', '#ea946e', '#8acaaa', '#f1ec64', '#ee8686', '#a48dc1', '#5da6bc', '#b9dcae'],
+    // Dark colors:
+    color: ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83',  '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'],
+
+    gradientColor: ['#f6efa6', '#d88273', '#bf444c'],
+
+    // If xAxis and yAxis declared, grid is created by default.
+    // grid: {},
+
+    textStyle: {
+        // color: '#000',
+        // decoration: 'none',
+        // PENDING
+        fontFamily: platform.match(/^Win/) ? 'Microsoft YaHei' : 'sans-serif',
+        // fontFamily: 'Arial, Verdana, sans-serif',
+        fontSize: 12,
+        fontStyle: 'normal',
+        fontWeight: 'normal'
+    },
+
+    // http://blogs.adobe.com/webplatform/2014/02/24/using-blend-modes-in-html-canvas/
+    // https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
+    // Default is source-over
+    blendMode: null,
+
+    animation: 'auto',
+    animationDuration: 1000,
+    animationDurationUpdate: 300,
+    animationEasing: 'exponentialOut',
+    animationEasingUpdate: 'cubicOut',
+
+    animationThreshold: 2000,
+    // Configuration for progressive/incremental rendering
+    progressiveThreshold: 3000,
+    progressive: 400,
+
+    // Threshold of if use single hover layer to optimize.
+    // It is recommended that `hoverLayerThreshold` is equivalent to or less than
+    // `progressiveThreshold`, otherwise hover will cause restart of progressive,
+    // which is unexpected.
+    // see example <echarts/test/heatmap-large.html>.
+    hoverLayerThreshold: 3000,
+
+    // See: module:echarts/scale/Time
+    useUTC: false
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$2 = makeInner();
+
+function getNearestColorPalette(colors, requestColorNum) {
+    var paletteNum = colors.length;
+    // TODO colors must be in order
+    for (var i = 0; i < paletteNum; i++) {
+        if (colors[i].length > requestColorNum) {
+            return colors[i];
+        }
+    }
+    return colors[paletteNum - 1];
+}
+
+var colorPaletteMixin = {
+    clearColorPalette: function () {
+        inner$2(this).colorIdx = 0;
+        inner$2(this).colorNameMap = {};
+    },
+
+    /**
+     * @param {string} name MUST NOT be null/undefined. Otherwise call this function
+     *                 twise with the same parameters will get different result.
+     * @param {Object} [scope=this]
+     * @param {Object} [requestColorNum]
+     * @return {string} color string.
+     */
+    getColorFromPalette: function (name, scope, requestColorNum) {
+        scope = scope || this;
+        var scopeFields = inner$2(scope);
+        var colorIdx = scopeFields.colorIdx || 0;
+        var colorNameMap = scopeFields.colorNameMap = scopeFields.colorNameMap || {};
+        // Use `hasOwnProperty` to avoid conflict with Object.prototype.
+        if (colorNameMap.hasOwnProperty(name)) {
+            return colorNameMap[name];
+        }
+        var defaultColorPalette = normalizeToArray(this.get('color', true));
+        var layeredColorPalette = this.get('colorLayer', true);
+        var colorPalette = ((requestColorNum == null || !layeredColorPalette)
+            ? defaultColorPalette : getNearestColorPalette(layeredColorPalette, requestColorNum));
+
+        // In case can't find in layered color palette.
+        colorPalette = colorPalette || defaultColorPalette;
+
+        if (!colorPalette || !colorPalette.length) {
+            return;
+        }
+
+        var color = colorPalette[colorIdx];
+        if (name) {
+            colorNameMap[name] = color;
+        }
+        scopeFields.colorIdx = (colorIdx + 1) % colorPalette.length;
+
+        return color;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Helper for model references.
+ * There are many manners to refer axis/coordSys.
+ */
+
+// TODO
+// merge relevant logic to this file?
+// check: "modelHelper" of tooltip and "BrushTargetManager".
+
+/**
+ * @return {Object} For example:
+ * {
+ *     coordSysName: 'cartesian2d',
+ *     coordSysDims: ['x', 'y', ...],
+ *     axisMap: HashMap({
+ *         x: xAxisModel,
+ *         y: yAxisModel
+ *     }),
+ *     categoryAxisMap: HashMap({
+ *         x: xAxisModel,
+ *         y: undefined
+ *     }),
+ *     // It also indicate that whether there is category axis.
+ *     firstCategoryDimIndex: 1,
+ *     // To replace user specified encode.
+ * }
+ */
+function getCoordSysDefineBySeries(seriesModel) {
+    var coordSysName = seriesModel.get('coordinateSystem');
+    var result = {
+        coordSysName: coordSysName,
+        coordSysDims: [],
+        axisMap: createHashMap(),
+        categoryAxisMap: createHashMap()
+    };
+    var fetch = fetchers[coordSysName];
+    if (fetch) {
+        fetch(seriesModel, result, result.axisMap, result.categoryAxisMap);
+        return result;
+    }
+}
+
+var fetchers = {
+
+    cartesian2d: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var xAxisModel = seriesModel.getReferringComponents('xAxis')[0];
+        var yAxisModel = seriesModel.getReferringComponents('yAxis')[0];
+
+        if (__DEV__) {
+            if (!xAxisModel) {
+                throw new Error('xAxis "' + retrieve(
+                    seriesModel.get('xAxisIndex'),
+                    seriesModel.get('xAxisId'),
+                    0
+                ) + '" not found');
+            }
+            if (!yAxisModel) {
+                throw new Error('yAxis "' + retrieve(
+                    seriesModel.get('xAxisIndex'),
+                    seriesModel.get('yAxisId'),
+                    0
+                ) + '" not found');
+            }
+        }
+
+        result.coordSysDims = ['x', 'y'];
+        axisMap.set('x', xAxisModel);
+        axisMap.set('y', yAxisModel);
+
+        if (isCategory(xAxisModel)) {
+            categoryAxisMap.set('x', xAxisModel);
+            result.firstCategoryDimIndex = 0;
+        }
+        if (isCategory(yAxisModel)) {
+            categoryAxisMap.set('y', yAxisModel);
+            result.firstCategoryDimIndex = 1;
+        }
+    },
+
+    singleAxis: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var singleAxisModel = seriesModel.getReferringComponents('singleAxis')[0];
+
+        if (__DEV__) {
+            if (!singleAxisModel) {
+                throw new Error('singleAxis should be specified.');
+            }
+        }
+
+        result.coordSysDims = ['single'];
+        axisMap.set('single', singleAxisModel);
+
+        if (isCategory(singleAxisModel)) {
+            categoryAxisMap.set('single', singleAxisModel);
+            result.firstCategoryDimIndex = 0;
+        }
+    },
+
+    polar: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var polarModel = seriesModel.getReferringComponents('polar')[0];
+        var radiusAxisModel = polarModel.findAxisModel('radiusAxis');
+        var angleAxisModel = polarModel.findAxisModel('angleAxis');
+
+        if (__DEV__) {
+            if (!angleAxisModel) {
+                throw new Error('angleAxis option not found');
+            }
+            if (!radiusAxisModel) {
+                throw new Error('radiusAxis option not found');
+            }
+        }
+
+        result.coordSysDims = ['radius', 'angle'];
+        axisMap.set('radius', radiusAxisModel);
+        axisMap.set('angle', angleAxisModel);
+
+        if (isCategory(radiusAxisModel)) {
+            categoryAxisMap.set('radius', radiusAxisModel);
+            result.firstCategoryDimIndex = 0;
+        }
+        if (isCategory(angleAxisModel)) {
+            categoryAxisMap.set('angle', angleAxisModel);
+            result.firstCategoryDimIndex = 1;
+        }
+    },
+
+    geo: function (seriesModel, result, axisMap, categoryAxisMap) {
+        result.coordSysDims = ['lng', 'lat'];
+    },
+
+    parallel: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var ecModel = seriesModel.ecModel;
+        var parallelModel = ecModel.getComponent(
+            'parallel', seriesModel.get('parallelIndex')
+        );
+        var coordSysDims = result.coordSysDims = parallelModel.dimensions.slice();
+
+        each$1(parallelModel.parallelAxisIndex, function (axisIndex, index) {
+            var axisModel = ecModel.getComponent('parallelAxis', axisIndex);
+            var axisDim = coordSysDims[index];
+            axisMap.set(axisDim, axisModel);
+
+            if (isCategory(axisModel) && result.firstCategoryDimIndex == null) {
+                categoryAxisMap.set(axisDim, axisModel);
+                result.firstCategoryDimIndex = index;
+            }
+        });
+    }
+};
+
+function isCategory(axisModel) {
+    return axisModel.get('type') === 'category';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Avoid typo.
+var SOURCE_FORMAT_ORIGINAL = 'original';
+var SOURCE_FORMAT_ARRAY_ROWS = 'arrayRows';
+var SOURCE_FORMAT_OBJECT_ROWS = 'objectRows';
+var SOURCE_FORMAT_KEYED_COLUMNS = 'keyedColumns';
+var SOURCE_FORMAT_UNKNOWN = 'unknown';
+// ??? CHANGE A NAME
+var SOURCE_FORMAT_TYPED_ARRAY = 'typedArray';
+
+var SERIES_LAYOUT_BY_COLUMN = 'column';
+var SERIES_LAYOUT_BY_ROW = 'row';
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * [sourceFormat]
+ *
+ * + "original":
+ * This format is only used in series.data, where
+ * itemStyle can be specified in data item.
+ *
+ * + "arrayRows":
+ * [
+ *     ['product', 'score', 'amount'],
+ *     ['Matcha Latte', 89.3, 95.8],
+ *     ['Milk Tea', 92.1, 89.4],
+ *     ['Cheese Cocoa', 94.4, 91.2],
+ *     ['Walnut Brownie', 85.4, 76.9]
+ * ]
+ *
+ * + "objectRows":
+ * [
+ *     {product: 'Matcha Latte', score: 89.3, amount: 95.8},
+ *     {product: 'Milk Tea', score: 92.1, amount: 89.4},
+ *     {product: 'Cheese Cocoa', score: 94.4, amount: 91.2},
+ *     {product: 'Walnut Brownie', score: 85.4, amount: 76.9}
+ * ]
+ *
+ * + "keyedColumns":
+ * {
+ *     'product': ['Matcha Latte', 'Milk Tea', 'Cheese Cocoa', 'Walnut Brownie'],
+ *     'count': [823, 235, 1042, 988],
+ *     'score': [95.8, 81.4, 91.2, 76.9]
+ * }
+ *
+ * + "typedArray"
+ *
+ * + "unknown"
+ */
+
+/**
+ * @constructor
+ * @param {Object} fields
+ * @param {string} fields.sourceFormat
+ * @param {Array|Object} fields.fromDataset
+ * @param {Array|Object} [fields.data]
+ * @param {string} [seriesLayoutBy='column']
+ * @param {Array.<Object|string>} [dimensionsDefine]
+ * @param {Objet|HashMap} [encodeDefine]
+ * @param {number} [startIndex=0]
+ * @param {number} [dimensionsDetectCount]
+ */
+function Source(fields) {
+
+    /**
+     * @type {boolean}
+     */
+    this.fromDataset = fields.fromDataset;
+
+    /**
+     * Not null/undefined.
+     * @type {Array|Object}
+     */
+    this.data = fields.data || (
+        fields.sourceFormat === SOURCE_FORMAT_KEYED_COLUMNS ? {} : []
+    );
+
+    /**
+     * See also "detectSourceFormat".
+     * Not null/undefined.
+     * @type {string}
+     */
+    this.sourceFormat = fields.sourceFormat || SOURCE_FORMAT_UNKNOWN;
+
+    /**
+     * 'row' or 'column'
+     * Not null/undefined.
+     * @type {string} seriesLayoutBy
+     */
+    this.seriesLayoutBy = fields.seriesLayoutBy || SERIES_LAYOUT_BY_COLUMN;
+
+    /**
+     * dimensions definition in option.
+     * can be null/undefined.
+     * @type {Array.<Object|string>}
+     */
+    this.dimensionsDefine = fields.dimensionsDefine;
+
+    /**
+     * encode definition in option.
+     * can be null/undefined.
+     * @type {Objet|HashMap}
+     */
+    this.encodeDefine = fields.encodeDefine && createHashMap(fields.encodeDefine);
+
+    /**
+     * Not null/undefined, uint.
+     * @type {number}
+     */
+    this.startIndex = fields.startIndex || 0;
+
+    /**
+     * Can be null/undefined (when unknown), uint.
+     * @type {number}
+     */
+    this.dimensionsDetectCount = fields.dimensionsDetectCount;
+}
+
+/**
+ * Wrap original series data for some compatibility cases.
+ */
+Source.seriesDataToSource = function (data) {
+    return new Source({
+        data: data,
+        sourceFormat: isTypedArray(data)
+            ? SOURCE_FORMAT_TYPED_ARRAY
+            : SOURCE_FORMAT_ORIGINAL,
+        fromDataset: false
+    });
+};
+
+enableClassCheck(Source);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$3 = makeInner();
+
+/**
+ * @see {module:echarts/data/Source}
+ * @param {module:echarts/component/dataset/DatasetModel} datasetModel
+ * @return {string} sourceFormat
+ */
+function detectSourceFormat(datasetModel) {
+    var data = datasetModel.option.source;
+    var sourceFormat = SOURCE_FORMAT_UNKNOWN;
+
+    if (isTypedArray(data)) {
+        sourceFormat = SOURCE_FORMAT_TYPED_ARRAY;
+    }
+    else if (isArray(data)) {
+        // FIXME Whether tolerate null in top level array?
+        for (var i = 0, len = data.length; i < len; i++) {
+            var item = data[i];
+
+            if (item == null) {
+                continue;
+            }
+            else if (isArray(item)) {
+                sourceFormat = SOURCE_FORMAT_ARRAY_ROWS;
+                break;
+            }
+            else if (isObject$1(item)) {
+                sourceFormat = SOURCE_FORMAT_OBJECT_ROWS;
+                break;
+            }
+        }
+    }
+    else if (isObject$1(data)) {
+        for (var key in data) {
+            if (data.hasOwnProperty(key) && isArrayLike(data[key])) {
+                sourceFormat = SOURCE_FORMAT_KEYED_COLUMNS;
+                break;
+            }
+        }
+    }
+    else if (data != null) {
+        throw new Error('Invalid data');
+    }
+
+    inner$3(datasetModel).sourceFormat = sourceFormat;
+}
+
+/**
+ * [Scenarios]:
+ * (1) Provide source data directly:
+ *     series: {
+ *         encode: {...},
+ *         dimensions: [...]
+ *         seriesLayoutBy: 'row',
+ *         data: [[...]]
+ *     }
+ * (2) Refer to datasetModel.
+ *     series: [{
+ *         encode: {...}
+ *         // Ignore datasetIndex means `datasetIndex: 0`
+ *         // and the dimensions defination in dataset is used
+ *     }, {
+ *         encode: {...},
+ *         seriesLayoutBy: 'column',
+ *         datasetIndex: 1
+ *     }]
+ *
+ * Get data from series itself or datset.
+ * @return {module:echarts/data/Source} source
+ */
+function getSource(seriesModel) {
+    return inner$3(seriesModel).source;
+}
+
+/**
+ * MUST be called before mergeOption of all series.
+ * @param {module:echarts/model/Global} ecModel
+ */
+function resetSourceDefaulter(ecModel) {
+    // `datasetMap` is used to make default encode.
+    inner$3(ecModel).datasetMap = createHashMap();
+}
+
+/**
+ * [Caution]:
+ * MUST be called after series option merged and
+ * before "series.getInitailData()" called.
+ *
+ * [The rule of making default encode]:
+ * Category axis (if exists) alway map to the first dimension.
+ * Each other axis occupies a subsequent dimension.
+ *
+ * [Why make default encode]:
+ * Simplify the typing of encode in option, avoiding the case like that:
+ * series: [{encode: {x: 0, y: 1}}, {encode: {x: 0, y: 2}}, {encode: {x: 0, y: 3}}],
+ * where the "y" have to be manually typed as "1, 2, 3, ...".
+ *
+ * @param {module:echarts/model/Series} seriesModel
+ */
+function prepareSource(seriesModel) {
+    var seriesOption = seriesModel.option;
+
+    var data = seriesOption.data;
+    var sourceFormat = isTypedArray(data)
+        ? SOURCE_FORMAT_TYPED_ARRAY : SOURCE_FORMAT_ORIGINAL;
+    var fromDataset = false;
+
+    var seriesLayoutBy = seriesOption.seriesLayoutBy;
+    var sourceHeader = seriesOption.sourceHeader;
+    var dimensionsDefine = seriesOption.dimensions;
+
+    var datasetModel = getDatasetModel(seriesModel);
+    if (datasetModel) {
+        var datasetOption = datasetModel.option;
+
+        data = datasetOption.source;
+        sourceFormat = inner$3(datasetModel).sourceFormat;
+        fromDataset = true;
+
+        // These settings from series has higher priority.
+        seriesLayoutBy = seriesLayoutBy || datasetOption.seriesLayoutBy;
+        sourceHeader == null && (sourceHeader = datasetOption.sourceHeader);
+        dimensionsDefine = dimensionsDefine || datasetOption.dimensions;
+    }
+
+    var completeResult = completeBySourceData(
+        data, sourceFormat, seriesLayoutBy, sourceHeader, dimensionsDefine
+    );
+
+    // Note: dataset option does not have `encode`.
+    var encodeDefine = seriesOption.encode;
+    if (!encodeDefine && datasetModel) {
+        encodeDefine = makeDefaultEncode(
+            seriesModel, datasetModel, data, sourceFormat, seriesLayoutBy, completeResult
+        );
+    }
+
+    inner$3(seriesModel).source = new Source({
+        data: data,
+        fromDataset: fromDataset,
+        seriesLayoutBy: seriesLayoutBy,
+        sourceFormat: sourceFormat,
+        dimensionsDefine: completeResult.dimensionsDefine,
+        startIndex: completeResult.startIndex,
+        dimensionsDetectCount: completeResult.dimensionsDetectCount,
+        encodeDefine: encodeDefine
+    });
+}
+
+// return {startIndex, dimensionsDefine, dimensionsCount}
+function completeBySourceData(data, sourceFormat, seriesLayoutBy, sourceHeader, dimensionsDefine) {
+    if (!data) {
+        return {dimensionsDefine: normalizeDimensionsDefine(dimensionsDefine)};
+    }
+
+    var dimensionsDetectCount;
+    var startIndex;
+    var findPotentialName;
+
+    if (sourceFormat === SOURCE_FORMAT_ARRAY_ROWS) {
+        // Rule: Most of the first line are string: it is header.
+        // Caution: consider a line with 5 string and 1 number,
+        // it still can not be sure it is a head, because the
+        // 5 string may be 5 values of category columns.
+        if (sourceHeader === 'auto' || sourceHeader == null) {
+            arrayRowsTravelFirst(function (val) {
+                // '-' is regarded as null/undefined.
+                if (val != null && val !== '-') {
+                    if (isString(val)) {
+                        startIndex == null && (startIndex = 1);
+                    }
+                    else {
+                        startIndex = 0;
+                    }
+                }
+            // 10 is an experience number, avoid long loop.
+            }, seriesLayoutBy, data, 10);
+        }
+        else {
+            startIndex = sourceHeader ? 1 : 0;
+        }
+
+        if (!dimensionsDefine && startIndex === 1) {
+            dimensionsDefine = [];
+            arrayRowsTravelFirst(function (val, index) {
+                dimensionsDefine[index] = val != null ? val : '';
+            }, seriesLayoutBy, data);
+        }
+
+        dimensionsDetectCount = dimensionsDefine
+            ? dimensionsDefine.length
+            : seriesLayoutBy === SERIES_LAYOUT_BY_ROW
+            ? data.length
+            : data[0]
+            ? data[0].length
+            : null;
+    }
+    else if (sourceFormat === SOURCE_FORMAT_OBJECT_ROWS) {
+        if (!dimensionsDefine) {
+            dimensionsDefine = objectRowsCollectDimensions(data);
+            findPotentialName = true;
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_KEYED_COLUMNS) {
+        if (!dimensionsDefine) {
+            dimensionsDefine = [];
+            findPotentialName = true;
+            each$1(data, function (colArr, key) {
+                dimensionsDefine.push(key);
+            });
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_ORIGINAL) {
+        var value0 = getDataItemValue(data[0]);
+        dimensionsDetectCount = isArray(value0) && value0.length || 1;
+    }
+    else if (sourceFormat === SOURCE_FORMAT_TYPED_ARRAY) {
+        if (__DEV__) {
+            assert$1(!!dimensionsDefine, 'dimensions must be given if data is TypedArray.');
+        }
+    }
+
+    var potentialNameDimIndex;
+    if (findPotentialName) {
+        each$1(dimensionsDefine, function (dim, idx) {
+            if ((isObject$1(dim) ? dim.name : dim) === 'name') {
+                potentialNameDimIndex = idx;
+            }
+        });
+    }
+
+    return {
+        startIndex: startIndex,
+        dimensionsDefine: normalizeDimensionsDefine(dimensionsDefine),
+        dimensionsDetectCount: dimensionsDetectCount,
+        potentialNameDimIndex: potentialNameDimIndex
+        // TODO: potentialIdDimIdx
+    };
+}
+
+// Consider dimensions defined like ['A', 'price', 'B', 'price', 'C', 'price'],
+// which is reasonable. But dimension name is duplicated.
+// Returns undefined or an array contains only object without null/undefiend or string.
+function normalizeDimensionsDefine(dimensionsDefine) {
+    if (!dimensionsDefine) {
+        // The meaning of null/undefined is different from empty array.
+        return;
+    }
+    var nameMap = createHashMap();
+    return map(dimensionsDefine, function (item, index) {
+        item = extend({}, isObject$1(item) ? item : {name: item});
+
+        // User can set null in dimensions.
+        // We dont auto specify name, othewise a given name may
+        // cause it be refered unexpectedly.
+        if (item.name == null) {
+            return item;
+        }
+
+        // Also consider number form like 2012.
+        item.name += '';
+        // User may also specify displayName.
+        // displayName will always exists except user not
+        // specified or dim name is not specified or detected.
+        // (A auto generated dim name will not be used as
+        // displayName).
+        if (item.displayName == null) {
+            item.displayName = item.name;
+        }
+
+        var exist = nameMap.get(item.name);
+        if (!exist) {
+            nameMap.set(item.name, {count: 1});
+        }
+        else {
+            item.name += '-' + exist.count++;
+        }
+
+        return item;
+    });
+}
+
+function arrayRowsTravelFirst(cb, seriesLayoutBy, data, maxLoop) {
+    maxLoop == null && (maxLoop = Infinity);
+    if (seriesLayoutBy === SERIES_LAYOUT_BY_ROW) {
+        for (var i = 0; i < data.length && i < maxLoop; i++) {
+            cb(data[i] ? data[i][0] : null, i);
+        }
+    }
+    else {
+        var value0 = data[0] || [];
+        for (var i = 0; i < value0.length && i < maxLoop; i++) {
+            cb(value0[i], i);
+        }
+    }
+}
+
+function objectRowsCollectDimensions(data) {
+    var firstIndex = 0;
+    var obj;
+    while (firstIndex < data.length && !(obj = data[firstIndex++])) {} // jshint ignore: line
+    if (obj) {
+        var dimensions = [];
+        each$1(obj, function (value, key) {
+            dimensions.push(key);
+        });
+        return dimensions;
+    }
+}
+
+// ??? TODO merge to completedimensions, where also has
+// default encode making logic. And the default rule
+// should depends on series? consider 'map'.
+function makeDefaultEncode(
+    seriesModel, datasetModel, data, sourceFormat, seriesLayoutBy, completeResult
+) {
+    var coordSysDefine = getCoordSysDefineBySeries(seriesModel);
+    var encode = {};
+    // var encodeTooltip = [];
+    // var encodeLabel = [];
+    var encodeItemName = [];
+    var encodeSeriesName = [];
+    var seriesType = seriesModel.subType;
+
+    // ??? TODO refactor: provide by series itself.
+    // Consider the case: 'map' series is based on geo coordSys,
+    // 'graph', 'heatmap' can be based on cartesian. But can not
+    // give default rule simply here.
+    var nSeriesMap = createHashMap(['pie', 'map', 'funnel']);
+    var cSeriesMap = createHashMap([
+        'line', 'bar', 'pictorialBar', 'scatter', 'effectScatter', 'candlestick', 'boxplot'
+    ]);
+
+    // Usually in this case series will use the first data
+    // dimension as the "value" dimension, or other default
+    // processes respectively.
+    if (coordSysDefine && cSeriesMap.get(seriesType) != null) {
+        var ecModel = seriesModel.ecModel;
+        var datasetMap = inner$3(ecModel).datasetMap;
+        var key = datasetModel.uid + '_' + seriesLayoutBy;
+        var datasetRecord = datasetMap.get(key)
+            || datasetMap.set(key, {categoryWayDim: 1, valueWayDim: 0});
+
+        // TODO
+        // Auto detect first time axis and do arrangement.
+        each$1(coordSysDefine.coordSysDims, function (coordDim) {
+            // In value way.
+            if (coordSysDefine.firstCategoryDimIndex == null) {
+                var dataDim = datasetRecord.valueWayDim++;
+                encode[coordDim] = dataDim;
+
+                // ??? TODO give a better default series name rule?
+                // especially when encode x y specified.
+                // consider: when mutiple series share one dimension
+                // category axis, series name should better use
+                // the other dimsion name. On the other hand, use
+                // both dimensions name.
+
+                encodeSeriesName.push(dataDim);
+                // encodeTooltip.push(dataDim);
+                // encodeLabel.push(dataDim);
+            }
+            // In category way, category axis.
+            else if (coordSysDefine.categoryAxisMap.get(coordDim)) {
+                encode[coordDim] = 0;
+                encodeItemName.push(0);
+            }
+            // In category way, non-category axis.
+            else {
+                var dataDim = datasetRecord.categoryWayDim++;
+                encode[coordDim] = dataDim;
+                // encodeTooltip.push(dataDim);
+                // encodeLabel.push(dataDim);
+                encodeSeriesName.push(dataDim);
+            }
+        });
+    }
+    // Do not make a complex rule! Hard to code maintain and not necessary.
+    // ??? TODO refactor: provide by series itself.
+    // [{name: ..., value: ...}, ...] like:
+    else if (nSeriesMap.get(seriesType) != null) {
+        // Find the first not ordinal. (5 is an experience value)
+        var firstNotOrdinal;
+        for (var i = 0; i < 5 && firstNotOrdinal == null; i++) {
+            if (!doGuessOrdinal(
+                data, sourceFormat, seriesLayoutBy,
+                completeResult.dimensionsDefine, completeResult.startIndex, i
+            )) {
+                firstNotOrdinal = i;
+            }
+        }
+        if (firstNotOrdinal != null) {
+            encode.value = firstNotOrdinal;
+            var nameDimIndex = completeResult.potentialNameDimIndex
+                || Math.max(firstNotOrdinal - 1, 0);
+            // By default, label use itemName in charts.
+            // So we dont set encodeLabel here.
+            encodeSeriesName.push(nameDimIndex);
+            encodeItemName.push(nameDimIndex);
+            // encodeTooltip.push(firstNotOrdinal);
+        }
+    }
+
+    // encodeTooltip.length && (encode.tooltip = encodeTooltip);
+    // encodeLabel.length && (encode.label = encodeLabel);
+    encodeItemName.length && (encode.itemName = encodeItemName);
+    encodeSeriesName.length && (encode.seriesName = encodeSeriesName);
+
+    return encode;
+}
+
+/**
+ * If return null/undefined, indicate that should not use datasetModel.
+ */
+function getDatasetModel(seriesModel) {
+    var option = seriesModel.option;
+    // Caution: consider the scenario:
+    // A dataset is declared and a series is not expected to use the dataset,
+    // and at the beginning `setOption({series: { noData })` (just prepare other
+    // option but no data), then `setOption({series: {data: [...]}); In this case,
+    // the user should set an empty array to avoid that dataset is used by default.
+    var thisData = option.data;
+    if (!thisData) {
+        return seriesModel.ecModel.getComponent('dataset', option.datasetIndex || 0);
+    }
+}
+
+/**
+ * The rule should not be complex, otherwise user might not
+ * be able to known where the data is wrong.
+ * The code is ugly, but how to make it neat?
+ *
+ * @param {module:echars/data/Source} source
+ * @param {number} dimIndex
+ * @return {boolean} Whether ordinal.
+ */
+function guessOrdinal(source, dimIndex) {
+    return doGuessOrdinal(
+        source.data,
+        source.sourceFormat,
+        source.seriesLayoutBy,
+        source.dimensionsDefine,
+        source.startIndex,
+        dimIndex
+    );
+}
+
+// dimIndex may be overflow source data.
+function doGuessOrdinal(
+    data, sourceFormat, seriesLayoutBy, dimensionsDefine, startIndex, dimIndex
+) {
+    var result;
+    // Experience value.
+    var maxLoop = 5;
+
+    if (isTypedArray(data)) {
+        return false;
+    }
+
+    // When sourceType is 'objectRows' or 'keyedColumns', dimensionsDefine
+    // always exists in source.
+    var dimName;
+    if (dimensionsDefine) {
+        dimName = dimensionsDefine[dimIndex];
+        dimName = isObject$1(dimName) ? dimName.name : dimName;
+    }
+
+    if (sourceFormat === SOURCE_FORMAT_ARRAY_ROWS) {
+        if (seriesLayoutBy === SERIES_LAYOUT_BY_ROW) {
+            var sample = data[dimIndex];
+            for (var i = 0; i < (sample || []).length && i < maxLoop; i++) {
+                if ((result = detectValue(sample[startIndex + i])) != null) {
+                    return result;
+                }
+            }
+        }
+        else {
+            for (var i = 0; i < data.length && i < maxLoop; i++) {
+                var row = data[startIndex + i];
+                if (row && (result = detectValue(row[dimIndex])) != null) {
+                    return result;
+                }
+            }
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_OBJECT_ROWS) {
+        if (!dimName) {
+            return;
+        }
+        for (var i = 0; i < data.length && i < maxLoop; i++) {
+            var item = data[i];
+            if (item && (result = detectValue(item[dimName])) != null) {
+                return result;
+            }
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_KEYED_COLUMNS) {
+        if (!dimName) {
+            return;
+        }
+        var sample = data[dimName];
+        if (!sample || isTypedArray(sample)) {
+            return false;
+        }
+        for (var i = 0; i < sample.length && i < maxLoop; i++) {
+            if ((result = detectValue(sample[i])) != null) {
+                return result;
+            }
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_ORIGINAL) {
+        for (var i = 0; i < data.length && i < maxLoop; i++) {
+            var item = data[i];
+            var val = getDataItemValue(item);
+            if (!isArray(val)) {
+                return false;
+            }
+            if ((result = detectValue(val[dimIndex])) != null) {
+                return result;
+            }
+        }
+    }
+
+    function detectValue(val) {
+        // Consider usage convenience, '1', '2' will be treated as "number".
+        // `isFinit('')` get `true`.
+        if (val != null && isFinite(val) && val !== '') {
+            return false;
+        }
+        else if (isString(val) && val !== '-') {
+            return true;
+        }
+    }
+
+    return false;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * ECharts global model
+ *
+ * @module {echarts/model/Global}
+ */
+
+
+/**
+ * Caution: If the mechanism should be changed some day, these cases
+ * should be considered:
+ *
+ * (1) In `merge option` mode, if using the same option to call `setOption`
+ * many times, the result should be the same (try our best to ensure that).
+ * (2) In `merge option` mode, if a component has no id/name specified, it
+ * will be merged by index, and the result sequence of the components is
+ * consistent to the original sequence.
+ * (3) `reset` feature (in toolbox). Find detailed info in comments about
+ * `mergeOption` in module:echarts/model/OptionManager.
+ */
+
+var OPTION_INNER_KEY = '\0_ec_inner';
+
+/**
+ * @alias module:echarts/model/Global
+ *
+ * @param {Object} option
+ * @param {module:echarts/model/Model} parentModel
+ * @param {Object} theme
+ */
+var GlobalModel = Model.extend({
+
+    init: function (option, parentModel, theme, optionManager) {
+        theme = theme || {};
+
+        this.option = null; // Mark as not initialized.
+
+        /**
+         * @type {module:echarts/model/Model}
+         * @private
+         */
+        this._theme = new Model(theme);
+
+        /**
+         * @type {module:echarts/model/OptionManager}
+         */
+        this._optionManager = optionManager;
+    },
+
+    setOption: function (option, optionPreprocessorFuncs) {
+        assert$1(
+            !(OPTION_INNER_KEY in option),
+            'please use chart.getOption()'
+        );
+
+        this._optionManager.setOption(option, optionPreprocessorFuncs);
+
+        this.resetOption(null);
+    },
+
+    /**
+     * @param {string} type null/undefined: reset all.
+     *                      'recreate': force recreate all.
+     *                      'timeline': only reset timeline option
+     *                      'media': only reset media query option
+     * @return {boolean} Whether option changed.
+     */
+    resetOption: function (type) {
+        var optionChanged = false;
+        var optionManager = this._optionManager;
+
+        if (!type || type === 'recreate') {
+            var baseOption = optionManager.mountOption(type === 'recreate');
+
+            if (!this.option || type === 'recreate') {
+                initBase.call(this, baseOption);
+            }
+            else {
+                this.restoreData();
+                this.mergeOption(baseOption);
+            }
+            optionChanged = true;
+        }
+
+        if (type === 'timeline' || type === 'media') {
+            this.restoreData();
+        }
+
+        if (!type || type === 'recreate' || type === 'timeline') {
+            var timelineOption = optionManager.getTimelineOption(this);
+            timelineOption && (this.mergeOption(timelineOption), optionChanged = true);
+        }
+
+        if (!type || type === 'recreate' || type === 'media') {
+            var mediaOptions = optionManager.getMediaOption(this, this._api);
+            if (mediaOptions.length) {
+                each$1(mediaOptions, function (mediaOption) {
+                    this.mergeOption(mediaOption, optionChanged = true);
+                }, this);
+            }
+        }
+
+        return optionChanged;
+    },
+
+    /**
+     * @protected
+     */
+    mergeOption: function (newOption) {
+        var option = this.option;
+        var componentsMap = this._componentsMap;
+        var newCptTypes = [];
+
+        resetSourceDefaulter(this);
+
+        // If no component class, merge directly.
+        // For example: color, animaiton options, etc.
+        each$1(newOption, function (componentOption, mainType) {
+            if (componentOption == null) {
+                return;
+            }
+
+            if (!ComponentModel.hasClass(mainType)) {
+                // globalSettingTask.dirty();
+                option[mainType] = option[mainType] == null
+                    ? clone(componentOption)
+                    : merge(option[mainType], componentOption, true);
+            }
+            else if (mainType) {
+                newCptTypes.push(mainType);
+            }
+        });
+
+        ComponentModel.topologicalTravel(
+            newCptTypes, ComponentModel.getAllClassMainTypes(), visitComponent, this
+        );
+
+        function visitComponent(mainType, dependencies) {
+
+            var newCptOptionList = normalizeToArray(newOption[mainType]);
+
+            var mapResult = mappingToExists(
+                componentsMap.get(mainType), newCptOptionList
+            );
+
+            makeIdAndName(mapResult);
+
+            // Set mainType and complete subType.
+            each$1(mapResult, function (item, index) {
+                var opt = item.option;
+                if (isObject$1(opt)) {
+                    item.keyInfo.mainType = mainType;
+                    item.keyInfo.subType = determineSubType(mainType, opt, item.exist);
+                }
+            });
+
+            var dependentModels = getComponentsByTypes(
+                componentsMap, dependencies
+            );
+
+            option[mainType] = [];
+            componentsMap.set(mainType, []);
+
+            each$1(mapResult, function (resultItem, index) {
+                var componentModel = resultItem.exist;
+                var newCptOption = resultItem.option;
+
+                assert$1(
+                    isObject$1(newCptOption) || componentModel,
+                    'Empty component definition'
+                );
+
+                // Consider where is no new option and should be merged using {},
+                // see removeEdgeAndAdd in topologicalTravel and
+                // ComponentModel.getAllClassMainTypes.
+                if (!newCptOption) {
+                    componentModel.mergeOption({}, this);
+                    componentModel.optionUpdated({}, false);
+                }
+                else {
+                    var ComponentModelClass = ComponentModel.getClass(
+                        mainType, resultItem.keyInfo.subType, true
+                    );
+
+                    if (componentModel && componentModel instanceof ComponentModelClass) {
+                        componentModel.name = resultItem.keyInfo.name;
+                        // componentModel.settingTask && componentModel.settingTask.dirty();
+                        componentModel.mergeOption(newCptOption, this);
+                        componentModel.optionUpdated(newCptOption, false);
+                    }
+                    else {
+                        // PENDING Global as parent ?
+                        var extraOpt = extend(
+                            {
+                                dependentModels: dependentModels,
+                                componentIndex: index
+                            },
+                            resultItem.keyInfo
+                        );
+                        componentModel = new ComponentModelClass(
+                            newCptOption, this, this, extraOpt
+                        );
+                        extend(componentModel, extraOpt);
+                        componentModel.init(newCptOption, this, this, extraOpt);
+
+                        // Call optionUpdated after init.
+                        // newCptOption has been used as componentModel.option
+                        // and may be merged with theme and default, so pass null
+                        // to avoid confusion.
+                        componentModel.optionUpdated(null, true);
+                    }
+                }
+
+                componentsMap.get(mainType)[index] = componentModel;
+                option[mainType][index] = componentModel.option;
+            }, this);
+
+            // Backup series for filtering.
+            if (mainType === 'series') {
+                createSeriesIndices(this, componentsMap.get('series'));
+            }
+        }
+
+        this._seriesIndicesMap = createHashMap(
+            this._seriesIndices = this._seriesIndices || []
+        );
+    },
+
+    /**
+     * Get option for output (cloned option and inner info removed)
+     * @public
+     * @return {Object}
+     */
+    getOption: function () {
+        var option = clone(this.option);
+
+        each$1(option, function (opts, mainType) {
+            if (ComponentModel.hasClass(mainType)) {
+                var opts = normalizeToArray(opts);
+                for (var i = opts.length - 1; i >= 0; i--) {
+                    // Remove options with inner id.
+                    if (isIdInner(opts[i])) {
+                        opts.splice(i, 1);
+                    }
+                }
+                option[mainType] = opts;
+            }
+        });
+
+        delete option[OPTION_INNER_KEY];
+
+        return option;
+    },
+
+    /**
+     * @return {module:echarts/model/Model}
+     */
+    getTheme: function () {
+        return this._theme;
+    },
+
+    /**
+     * @param {string} mainType
+     * @param {number} [idx=0]
+     * @return {module:echarts/model/Component}
+     */
+    getComponent: function (mainType, idx) {
+        var list = this._componentsMap.get(mainType);
+        if (list) {
+            return list[idx || 0];
+        }
+    },
+
+    /**
+     * If none of index and id and name used, return all components with mainType.
+     * @param {Object} condition
+     * @param {string} condition.mainType
+     * @param {string} [condition.subType] If ignore, only query by mainType
+     * @param {number|Array.<number>} [condition.index] Either input index or id or name.
+     * @param {string|Array.<string>} [condition.id] Either input index or id or name.
+     * @param {string|Array.<string>} [condition.name] Either input index or id or name.
+     * @return {Array.<module:echarts/model/Component>}
+     */
+    queryComponents: function (condition) {
+        var mainType = condition.mainType;
+        if (!mainType) {
+            return [];
+        }
+
+        var index = condition.index;
+        var id = condition.id;
+        var name = condition.name;
+
+        var cpts = this._componentsMap.get(mainType);
+
+        if (!cpts || !cpts.length) {
+            return [];
+        }
+
+        var result;
+
+        if (index != null) {
+            if (!isArray(index)) {
+                index = [index];
+            }
+            result = filter(map(index, function (idx) {
+                return cpts[idx];
+            }), function (val) {
+                return !!val;
+            });
+        }
+        else if (id != null) {
+            var isIdArray = isArray(id);
+            result = filter(cpts, function (cpt) {
+                return (isIdArray && indexOf(id, cpt.id) >= 0)
+                    || (!isIdArray && cpt.id === id);
+            });
+        }
+        else if (name != null) {
+            var isNameArray = isArray(name);
+            result = filter(cpts, function (cpt) {
+                return (isNameArray && indexOf(name, cpt.name) >= 0)
+                    || (!isNameArray && cpt.name === name);
+            });
+        }
+        else {
+            // Return all components with mainType
+            result = cpts.slice();
+        }
+
+        return filterBySubType(result, condition);
+    },
+
+    /**
+     * The interface is different from queryComponents,
+     * which is convenient for inner usage.
+     *
+     * @usage
+     * var result = findComponents(
+     *     {mainType: 'dataZoom', query: {dataZoomId: 'abc'}}
+     * );
+     * var result = findComponents(
+     *     {mainType: 'series', subType: 'pie', query: {seriesName: 'uio'}}
+     * );
+     * var result = findComponents(
+     *     {mainType: 'series'},
+     *     function (model, index) {...}
+     * );
+     * // result like [component0, componnet1, ...]
+     *
+     * @param {Object} condition
+     * @param {string} condition.mainType Mandatory.
+     * @param {string} [condition.subType] Optional.
+     * @param {Object} [condition.query] like {xxxIndex, xxxId, xxxName},
+     *        where xxx is mainType.
+     *        If query attribute is null/undefined or has no index/id/name,
+     *        do not filtering by query conditions, which is convenient for
+     *        no-payload situations or when target of action is global.
+     * @param {Function} [condition.filter] parameter: component, return boolean.
+     * @return {Array.<module:echarts/model/Component>}
+     */
+    findComponents: function (condition) {
+        var query = condition.query;
+        var mainType = condition.mainType;
+
+        var queryCond = getQueryCond(query);
+        var result = queryCond
+            ? this.queryComponents(queryCond)
+            : this._componentsMap.get(mainType);
+
+        return doFilter(filterBySubType(result, condition));
+
+        function getQueryCond(q) {
+            var indexAttr = mainType + 'Index';
+            var idAttr = mainType + 'Id';
+            var nameAttr = mainType + 'Name';
+            return q && (
+                    q[indexAttr] != null
+                    || q[idAttr] != null
+                    || q[nameAttr] != null
+                )
+                ? {
+                    mainType: mainType,
+                    // subType will be filtered finally.
+                    index: q[indexAttr],
+                    id: q[idAttr],
+                    name: q[nameAttr]
+                }
+                : null;
+        }
+
+        function doFilter(res) {
+            return condition.filter
+                    ? filter(res, condition.filter)
+                    : res;
+        }
+    },
+
+    /**
+     * @usage
+     * eachComponent('legend', function (legendModel, index) {
+     *     ...
+     * });
+     * eachComponent(function (componentType, model, index) {
+     *     // componentType does not include subType
+     *     // (componentType is 'xxx' but not 'xxx.aa')
+     * });
+     * eachComponent(
+     *     {mainType: 'dataZoom', query: {dataZoomId: 'abc'}},
+     *     function (model, index) {...}
+     * );
+     * eachComponent(
+     *     {mainType: 'series', subType: 'pie', query: {seriesName: 'uio'}},
+     *     function (model, index) {...}
+     * );
+     *
+     * @param {string|Object=} mainType When mainType is object, the definition
+     *                                  is the same as the method 'findComponents'.
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachComponent: function (mainType, cb, context) {
+        var componentsMap = this._componentsMap;
+
+        if (typeof mainType === 'function') {
+            context = cb;
+            cb = mainType;
+            componentsMap.each(function (components, componentType) {
+                each$1(components, function (component, index) {
+                    cb.call(context, componentType, component, index);
+                });
+            });
+        }
+        else if (isString(mainType)) {
+            each$1(componentsMap.get(mainType), cb, context);
+        }
+        else if (isObject$1(mainType)) {
+            var queryResult = this.findComponents(mainType);
+            each$1(queryResult, cb, context);
+        }
+    },
+
+    /**
+     * @param {string} name
+     * @return {Array.<module:echarts/model/Series>}
+     */
+    getSeriesByName: function (name) {
+        var series = this._componentsMap.get('series');
+        return filter(series, function (oneSeries) {
+            return oneSeries.name === name;
+        });
+    },
+
+    /**
+     * @param {number} seriesIndex
+     * @return {module:echarts/model/Series}
+     */
+    getSeriesByIndex: function (seriesIndex) {
+        return this._componentsMap.get('series')[seriesIndex];
+    },
+
+    /**
+     * Get series list before filtered by type.
+     * FIXME: rename to getRawSeriesByType?
+     *
+     * @param {string} subType
+     * @return {Array.<module:echarts/model/Series>}
+     */
+    getSeriesByType: function (subType) {
+        var series = this._componentsMap.get('series');
+        return filter(series, function (oneSeries) {
+            return oneSeries.subType === subType;
+        });
+    },
+
+    /**
+     * @return {Array.<module:echarts/model/Series>}
+     */
+    getSeries: function () {
+        return this._componentsMap.get('series').slice();
+    },
+
+    /**
+     * @return {number}
+     */
+    getSeriesCount: function () {
+        return this._componentsMap.get('series').length;
+    },
+
+    /**
+     * After filtering, series may be different
+     * frome raw series.
+     *
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachSeries: function (cb, context) {
+        assertSeriesInitialized(this);
+        each$1(this._seriesIndices, function (rawSeriesIndex) {
+            var series = this._componentsMap.get('series')[rawSeriesIndex];
+            cb.call(context, series, rawSeriesIndex);
+        }, this);
+    },
+
+    /**
+     * Iterate raw series before filtered.
+     *
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachRawSeries: function (cb, context) {
+        each$1(this._componentsMap.get('series'), cb, context);
+    },
+
+    /**
+     * After filtering, series may be different.
+     * frome raw series.
+     *
+     * @parma {string} subType
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachSeriesByType: function (subType, cb, context) {
+        assertSeriesInitialized(this);
+        each$1(this._seriesIndices, function (rawSeriesIndex) {
+            var series = this._componentsMap.get('series')[rawSeriesIndex];
+            if (series.subType === subType) {
+                cb.call(context, series, rawSeriesIndex);
+            }
+        }, this);
+    },
+
+    /**
+     * Iterate raw series before filtered of given type.
+     *
+     * @parma {string} subType
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachRawSeriesByType: function (subType, cb, context) {
+        return each$1(this.getSeriesByType(subType), cb, context);
+    },
+
+    /**
+     * @param {module:echarts/model/Series} seriesModel
+     */
+    isSeriesFiltered: function (seriesModel) {
+        assertSeriesInitialized(this);
+        return this._seriesIndicesMap.get(seriesModel.componentIndex) == null;
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getCurrentSeriesIndices: function () {
+        return (this._seriesIndices || []).slice();
+    },
+
+    /**
+     * @param {Function} cb
+     * @param {*} context
+     */
+    filterSeries: function (cb, context) {
+        assertSeriesInitialized(this);
+        var filteredSeries = filter(
+            this._componentsMap.get('series'), cb, context
+        );
+        createSeriesIndices(this, filteredSeries);
+    },
+
+    restoreData: function (payload) {
+        var componentsMap = this._componentsMap;
+
+        createSeriesIndices(this, componentsMap.get('series'));
+
+        var componentTypes = [];
+        componentsMap.each(function (components, componentType) {
+            componentTypes.push(componentType);
+        });
+
+        ComponentModel.topologicalTravel(
+            componentTypes,
+            ComponentModel.getAllClassMainTypes(),
+            function (componentType, dependencies) {
+                each$1(componentsMap.get(componentType), function (component) {
+                    (componentType !== 'series' || !isNotTargetSeries(component, payload))
+                        && component.restoreData();
+                });
+            }
+        );
+    }
+
+});
+
+function isNotTargetSeries(seriesModel, payload) {
+    if (payload) {
+        var index = payload.seiresIndex;
+        var id = payload.seriesId;
+        var name = payload.seriesName;
+        return (index != null && seriesModel.componentIndex !== index)
+            || (id != null && seriesModel.id !== id)
+            || (name != null && seriesModel.name !== name);
+    }
+}
+
+/**
+ * @inner
+ */
+function mergeTheme(option, theme) {
+    // PENDING
+    // NOT use `colorLayer` in theme if option has `color`
+    var notMergeColorLayer = option.color && !option.colorLayer;
+
+    each$1(theme, function (themeItem, name) {
+        if (name === 'colorLayer' && notMergeColorLayer) {
+            return;
+        }
+        // 如果有 component model 则把具体的 merge 逻辑交给该 model 处理
+        if (!ComponentModel.hasClass(name)) {
+            if (typeof themeItem === 'object') {
+                option[name] = !option[name]
+                    ? clone(themeItem)
+                    : merge(option[name], themeItem, false);
+            }
+            else {
+                if (option[name] == null) {
+                    option[name] = themeItem;
+                }
+            }
+        }
+    });
+}
+
+function initBase(baseOption) {
+    baseOption = baseOption;
+
+    // Using OPTION_INNER_KEY to mark that this option can not be used outside,
+    // i.e. `chart.setOption(chart.getModel().option);` is forbiden.
+    this.option = {};
+    this.option[OPTION_INNER_KEY] = 1;
+
+    /**
+     * Init with series: [], in case of calling findSeries method
+     * before series initialized.
+     * @type {Object.<string, Array.<module:echarts/model/Model>>}
+     * @private
+     */
+    this._componentsMap = createHashMap({series: []});
+
+    /**
+     * Mapping between filtered series list and raw series list.
+     * key: filtered series indices, value: raw series indices.
+     * @type {Array.<nubmer>}
+     * @private
+     */
+    this._seriesIndices;
+
+    this._seriesIndicesMap;
+
+    mergeTheme(baseOption, this._theme.option);
+
+    // TODO Needs clone when merging to the unexisted property
+    merge(baseOption, globalDefault, false);
+
+    this.mergeOption(baseOption);
+}
+
+/**
+ * @inner
+ * @param {Array.<string>|string} types model types
+ * @return {Object} key: {string} type, value: {Array.<Object>} models
+ */
+function getComponentsByTypes(componentsMap, types) {
+    if (!isArray(types)) {
+        types = types ? [types] : [];
+    }
+
+    var ret = {};
+    each$1(types, function (type) {
+        ret[type] = (componentsMap.get(type) || []).slice();
+    });
+
+    return ret;
+}
+
+/**
+ * @inner
+ */
+function determineSubType(mainType, newCptOption, existComponent) {
+    var subType = newCptOption.type
+        ? newCptOption.type
+        : existComponent
+        ? existComponent.subType
+        // Use determineSubType only when there is no existComponent.
+        : ComponentModel.determineSubType(mainType, newCptOption);
+
+    // tooltip, markline, markpoint may always has no subType
+    return subType;
+}
+
+/**
+ * @inner
+ */
+function createSeriesIndices(ecModel, seriesModels) {
+    ecModel._seriesIndicesMap = createHashMap(
+        ecModel._seriesIndices = map(seriesModels, function (series) {
+            return series.componentIndex;
+        }) || []
+    );
+}
+
+/**
+ * @inner
+ */
+function filterBySubType(components, condition) {
+    // Using hasOwnProperty for restrict. Consider
+    // subType is undefined in user payload.
+    return condition.hasOwnProperty('subType')
+        ? filter(components, function (cpt) {
+            return cpt.subType === condition.subType;
+        })
+        : components;
+}
+
+/**
+ * @inner
+ */
+function assertSeriesInitialized(ecModel) {
+    // Components that use _seriesIndices should depends on series component,
+    // which make sure that their initialization is after series.
+    if (__DEV__) {
+        if (!ecModel._seriesIndices) {
+            throw new Error('Option should contains series.');
+        }
+    }
+}
+
+mixin(GlobalModel, colorPaletteMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var echartsAPIList = [
+    'getDom', 'getZr', 'getWidth', 'getHeight', 'getDevicePixelRatio', 'dispatchAction', 'isDisposed',
+    'on', 'off', 'getDataURL', 'getConnectedDataURL', 'getModel', 'getOption',
+    'getViewOfComponentModel', 'getViewOfSeriesModel'
+];
+// And `getCoordinateSystems` and `getComponentByElement` will be injected in echarts.js
+
+function ExtensionAPI(chartInstance) {
+    each$1(echartsAPIList, function (name) {
+        this[name] = bind(chartInstance[name], chartInstance);
+    }, this);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var coordinateSystemCreators = {};
+
+function CoordinateSystemManager() {
+
+    this._coordinateSystems = [];
+}
+
+CoordinateSystemManager.prototype = {
+
+    constructor: CoordinateSystemManager,
+
+    create: function (ecModel, api) {
+        var coordinateSystems = [];
+        each$1(coordinateSystemCreators, function (creater, type) {
+            var list = creater.create(ecModel, api);
+            coordinateSystems = coordinateSystems.concat(list || []);
+        });
+
+        this._coordinateSystems = coordinateSystems;
+    },
+
+    update: function (ecModel, api) {
+        each$1(this._coordinateSystems, function (coordSys) {
+            coordSys.update && coordSys.update(ecModel, api);
+        });
+    },
+
+    getCoordinateSystems: function () {
+        return this._coordinateSystems.slice();
+    }
+};
+
+CoordinateSystemManager.register = function (type, coordinateSystemCreator) {
+    coordinateSystemCreators[type] = coordinateSystemCreator;
+};
+
+CoordinateSystemManager.get = function (type) {
+    return coordinateSystemCreators[type];
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * ECharts option manager
+ *
+ * @module {echarts/model/OptionManager}
+ */
+
+
+var each$4 = each$1;
+var clone$3 = clone;
+var map$1 = map;
+var merge$1 = merge;
+
+var QUERY_REG = /^(min|max)?(.+)$/;
+
+/**
+ * TERM EXPLANATIONS:
+ *
+ * [option]:
+ *
+ *     An object that contains definitions of components. For example:
+ *     var option = {
+ *         title: {...},
+ *         legend: {...},
+ *         visualMap: {...},
+ *         series: [
+ *             {data: [...]},
+ *             {data: [...]},
+ *             ...
+ *         ]
+ *     };
+ *
+ * [rawOption]:
+ *
+ *     An object input to echarts.setOption. 'rawOption' may be an
+ *     'option', or may be an object contains multi-options. For example:
+ *     var option = {
+ *         baseOption: {
+ *             title: {...},
+ *             legend: {...},
+ *             series: [
+ *                 {data: [...]},
+ *                 {data: [...]},
+ *                 ...
+ *             ]
+ *         },
+ *         timeline: {...},
+ *         options: [
+ *             {title: {...}, series: {data: [...]}},
+ *             {title: {...}, series: {data: [...]}},
+ *             ...
+ *         ],
+ *         media: [
+ *             {
+ *                 query: {maxWidth: 320},
+ *                 option: {series: {x: 20}, visualMap: {show: false}}
+ *             },
+ *             {
+ *                 query: {minWidth: 320, maxWidth: 720},
+ *                 option: {series: {x: 500}, visualMap: {show: true}}
+ *             },
+ *             {
+ *                 option: {series: {x: 1200}, visualMap: {show: true}}
+ *             }
+ *         ]
+ *     };
+ *
+ * @alias module:echarts/model/OptionManager
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function OptionManager(api) {
+
+    /**
+     * @private
+     * @type {module:echarts/ExtensionAPI}
+     */
+    this._api = api;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._timelineOptions = [];
+
+    /**
+     * @private
+     * @type {Array.<Object>}
+     */
+    this._mediaList = [];
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._mediaDefault;
+
+    /**
+     * -1, means default.
+     * empty means no media.
+     * @private
+     * @type {Array.<number>}
+     */
+    this._currentMediaIndices = [];
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._optionBackup;
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._newBaseOption;
+}
+
+// timeline.notMerge is not supported in ec3. Firstly there is rearly
+// case that notMerge is needed. Secondly supporting 'notMerge' requires
+// rawOption cloned and backuped when timeline changed, which does no
+// good to performance. What's more, that both timeline and setOption
+// method supply 'notMerge' brings complex and some problems.
+// Consider this case:
+// (step1) chart.setOption({timeline: {notMerge: false}, ...}, false);
+// (step2) chart.setOption({timeline: {notMerge: true}, ...}, false);
+
+OptionManager.prototype = {
+
+    constructor: OptionManager,
+
+    /**
+     * @public
+     * @param {Object} rawOption Raw option.
+     * @param {module:echarts/model/Global} ecModel
+     * @param {Array.<Function>} optionPreprocessorFuncs
+     * @return {Object} Init option
+     */
+    setOption: function (rawOption, optionPreprocessorFuncs) {
+        if (rawOption) {
+            // That set dat primitive is dangerous if user reuse the data when setOption again.
+            each$1(normalizeToArray(rawOption.series), function (series) {
+                series && series.data && isTypedArray(series.data) && setAsPrimitive(series.data);
+            });
+        }
+
+        // Caution: some series modify option data, if do not clone,
+        // it should ensure that the repeat modify correctly
+        // (create a new object when modify itself).
+        rawOption = clone$3(rawOption, true);
+
+        // FIXME
+        // 如果 timeline options 或者 media 中设置了某个属性，而baseOption中没有设置，则进行警告。
+
+        var oldOptionBackup = this._optionBackup;
+        var newParsedOption = parseRawOption.call(
+            this, rawOption, optionPreprocessorFuncs, !oldOptionBackup
+        );
+        this._newBaseOption = newParsedOption.baseOption;
+
+        // For setOption at second time (using merge mode);
+        if (oldOptionBackup) {
+            // Only baseOption can be merged.
+            mergeOption(oldOptionBackup.baseOption, newParsedOption.baseOption);
+
+            // For simplicity, timeline options and media options do not support merge,
+            // that is, if you `setOption` twice and both has timeline options, the latter
+            // timeline opitons will not be merged to the formers, but just substitude them.
+            if (newParsedOption.timelineOptions.length) {
+                oldOptionBackup.timelineOptions = newParsedOption.timelineOptions;
+            }
+            if (newParsedOption.mediaList.length) {
+                oldOptionBackup.mediaList = newParsedOption.mediaList;
+            }
+            if (newParsedOption.mediaDefault) {
+                oldOptionBackup.mediaDefault = newParsedOption.mediaDefault;
+            }
+        }
+        else {
+            this._optionBackup = newParsedOption;
+        }
+    },
+
+    /**
+     * @param {boolean} isRecreate
+     * @return {Object}
+     */
+    mountOption: function (isRecreate) {
+        var optionBackup = this._optionBackup;
+
+        // TODO
+        // 如果没有reset功能则不clone。
+
+        this._timelineOptions = map$1(optionBackup.timelineOptions, clone$3);
+        this._mediaList = map$1(optionBackup.mediaList, clone$3);
+        this._mediaDefault = clone$3(optionBackup.mediaDefault);
+        this._currentMediaIndices = [];
+
+        return clone$3(isRecreate
+            // this._optionBackup.baseOption, which is created at the first `setOption`
+            // called, and is merged into every new option by inner method `mergeOption`
+            // each time `setOption` called, can be only used in `isRecreate`, because
+            // its reliability is under suspicion. In other cases option merge is
+            // performed by `model.mergeOption`.
+            ? optionBackup.baseOption : this._newBaseOption
+        );
+    },
+
+    /**
+     * @param {module:echarts/model/Global} ecModel
+     * @return {Object}
+     */
+    getTimelineOption: function (ecModel) {
+        var option;
+        var timelineOptions = this._timelineOptions;
+
+        if (timelineOptions.length) {
+            // getTimelineOption can only be called after ecModel inited,
+            // so we can get currentIndex from timelineModel.
+            var timelineModel = ecModel.getComponent('timeline');
+            if (timelineModel) {
+                option = clone$3(
+                    timelineOptions[timelineModel.getCurrentIndex()],
+                    true
+                );
+            }
+        }
+
+        return option;
+    },
+
+    /**
+     * @param {module:echarts/model/Global} ecModel
+     * @return {Array.<Object>}
+     */
+    getMediaOption: function (ecModel) {
+        var ecWidth = this._api.getWidth();
+        var ecHeight = this._api.getHeight();
+        var mediaList = this._mediaList;
+        var mediaDefault = this._mediaDefault;
+        var indices = [];
+        var result = [];
+
+        // No media defined.
+        if (!mediaList.length && !mediaDefault) {
+            return result;
+        }
+
+        // Multi media may be applied, the latter defined media has higher priority.
+        for (var i = 0, len = mediaList.length; i < len; i++) {
+            if (applyMediaQuery(mediaList[i].query, ecWidth, ecHeight)) {
+                indices.push(i);
+            }
+        }
+
+        // FIXME
+        // 是否mediaDefault应该强制用户设置，否则可能修改不能回归。
+        if (!indices.length && mediaDefault) {
+            indices = [-1];
+        }
+
+        if (indices.length && !indicesEquals(indices, this._currentMediaIndices)) {
+            result = map$1(indices, function (index) {
+                return clone$3(
+                    index === -1 ? mediaDefault.option : mediaList[index].option
+                );
+            });
+        }
+        // Otherwise return nothing.
+
+        this._currentMediaIndices = indices;
+
+        return result;
+    }
+};
+
+function parseRawOption(rawOption, optionPreprocessorFuncs, isNew) {
+    var timelineOptions = [];
+    var mediaList = [];
+    var mediaDefault;
+    var baseOption;
+
+    // Compatible with ec2.
+    var timelineOpt = rawOption.timeline;
+
+    if (rawOption.baseOption) {
+        baseOption = rawOption.baseOption;
+    }
+
+    // For timeline
+    if (timelineOpt || rawOption.options) {
+        baseOption = baseOption || {};
+        timelineOptions = (rawOption.options || []).slice();
+    }
+
+    // For media query
+    if (rawOption.media) {
+        baseOption = baseOption || {};
+        var media = rawOption.media;
+        each$4(media, function (singleMedia) {
+            if (singleMedia && singleMedia.option) {
+                if (singleMedia.query) {
+                    mediaList.push(singleMedia);
+                }
+                else if (!mediaDefault) {
+                    // Use the first media default.
+                    mediaDefault = singleMedia;
+                }
+            }
+        });
+    }
+
+    // For normal option
+    if (!baseOption) {
+        baseOption = rawOption;
+    }
+
+    // Set timelineOpt to baseOption in ec3,
+    // which is convenient for merge option.
+    if (!baseOption.timeline) {
+        baseOption.timeline = timelineOpt;
+    }
+
+    // Preprocess.
+    each$4([baseOption].concat(timelineOptions)
+        .concat(map(mediaList, function (media) {
+            return media.option;
+        })),
+        function (option) {
+            each$4(optionPreprocessorFuncs, function (preProcess) {
+                preProcess(option, isNew);
+            });
+        }
+    );
+
+    return {
+        baseOption: baseOption,
+        timelineOptions: timelineOptions,
+        mediaDefault: mediaDefault,
+        mediaList: mediaList
+    };
+}
+
+/**
+ * @see <http://www.w3.org/TR/css3-mediaqueries/#media1>
+ * Support: width, height, aspectRatio
+ * Can use max or min as prefix.
+ */
+function applyMediaQuery(query, ecWidth, ecHeight) {
+    var realMap = {
+        width: ecWidth,
+        height: ecHeight,
+        aspectratio: ecWidth / ecHeight // lowser case for convenientce.
+    };
+
+    var applicatable = true;
+
+    each$1(query, function (value, attr) {
+        var matched = attr.match(QUERY_REG);
+
+        if (!matched || !matched[1] || !matched[2]) {
+            return;
+        }
+
+        var operator = matched[1];
+        var realAttr = matched[2].toLowerCase();
+
+        if (!compare(realMap[realAttr], value, operator)) {
+            applicatable = false;
+        }
+    });
+
+    return applicatable;
+}
+
+function compare(real, expect, operator) {
+    if (operator === 'min') {
+        return real >= expect;
+    }
+    else if (operator === 'max') {
+        return real <= expect;
+    }
+    else { // Equals
+        return real === expect;
+    }
+}
+
+function indicesEquals(indices1, indices2) {
+    // indices is always order by asc and has only finite number.
+    return indices1.join(',') === indices2.join(',');
+}
+
+/**
+ * Consider case:
+ * `chart.setOption(opt1);`
+ * Then user do some interaction like dataZoom, dataView changing.
+ * `chart.setOption(opt2);`
+ * Then user press 'reset button' in toolbox.
+ *
+ * After doing that all of the interaction effects should be reset, the
+ * chart should be the same as the result of invoke
+ * `chart.setOption(opt1); chart.setOption(opt2);`.
+ *
+ * Although it is not able ensure that
+ * `chart.setOption(opt1); chart.setOption(opt2);` is equivalents to
+ * `chart.setOption(merge(opt1, opt2));` exactly,
+ * this might be the only simple way to implement that feature.
+ *
+ * MEMO: We've considered some other approaches:
+ * 1. Each model handle its self restoration but not uniform treatment.
+ *     (Too complex in logic and error-prone)
+ * 2. Use a shadow ecModel. (Performace expensive)
+ */
+function mergeOption(oldOption, newOption) {
+    newOption = newOption || {};
+
+    each$4(newOption, function (newCptOpt, mainType) {
+        if (newCptOpt == null) {
+            return;
+        }
+
+        var oldCptOpt = oldOption[mainType];
+
+        if (!ComponentModel.hasClass(mainType)) {
+            oldOption[mainType] = merge$1(oldCptOpt, newCptOpt, true);
+        }
+        else {
+            newCptOpt = normalizeToArray(newCptOpt);
+            oldCptOpt = normalizeToArray(oldCptOpt);
+
+            var mapResult = mappingToExists(oldCptOpt, newCptOpt);
+
+            oldOption[mainType] = map$1(mapResult, function (item) {
+                return (item.option && item.exist)
+                    ? merge$1(item.exist, item.option, true)
+                    : (item.exist || item.option);
+            });
+        }
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$5 = each$1;
+var isObject$3 = isObject$1;
+
+var POSSIBLE_STYLES = [
+    'areaStyle', 'lineStyle', 'nodeStyle', 'linkStyle',
+    'chordStyle', 'label', 'labelLine'
+];
+
+function compatEC2ItemStyle(opt) {
+    var itemStyleOpt = opt && opt.itemStyle;
+    if (!itemStyleOpt) {
+        return;
+    }
+    for (var i = 0, len = POSSIBLE_STYLES.length; i < len; i++) {
+        var styleName = POSSIBLE_STYLES[i];
+        var normalItemStyleOpt = itemStyleOpt.normal;
+        var emphasisItemStyleOpt = itemStyleOpt.emphasis;
+        if (normalItemStyleOpt && normalItemStyleOpt[styleName]) {
+            opt[styleName] = opt[styleName] || {};
+            if (!opt[styleName].normal) {
+                opt[styleName].normal = normalItemStyleOpt[styleName];
+            }
+            else {
+                merge(opt[styleName].normal, normalItemStyleOpt[styleName]);
+            }
+            normalItemStyleOpt[styleName] = null;
+        }
+        if (emphasisItemStyleOpt && emphasisItemStyleOpt[styleName]) {
+            opt[styleName] = opt[styleName] || {};
+            if (!opt[styleName].emphasis) {
+                opt[styleName].emphasis = emphasisItemStyleOpt[styleName];
+            }
+            else {
+                merge(opt[styleName].emphasis, emphasisItemStyleOpt[styleName]);
+            }
+            emphasisItemStyleOpt[styleName] = null;
+        }
+    }
+}
+
+function convertNormalEmphasis(opt, optType, useExtend) {
+    if (opt && opt[optType] && (opt[optType].normal || opt[optType].emphasis)) {
+        var normalOpt = opt[optType].normal;
+        var emphasisOpt = opt[optType].emphasis;
+
+        if (normalOpt) {
+            // Timeline controlStyle has other properties besides normal and emphasis
+            if (useExtend) {
+                opt[optType].normal = opt[optType].emphasis = null;
+                defaults(opt[optType], normalOpt);
+            }
+            else {
+                opt[optType] = normalOpt;
+            }
+        }
+        if (emphasisOpt) {
+            opt.emphasis = opt.emphasis || {};
+            opt.emphasis[optType] = emphasisOpt;
+        }
+    }
+}
+function removeEC3NormalStatus(opt) {
+    convertNormalEmphasis(opt, 'itemStyle');
+    convertNormalEmphasis(opt, 'lineStyle');
+    convertNormalEmphasis(opt, 'areaStyle');
+    convertNormalEmphasis(opt, 'label');
+    convertNormalEmphasis(opt, 'labelLine');
+    // treemap
+    convertNormalEmphasis(opt, 'upperLabel');
+    // graph
+    convertNormalEmphasis(opt, 'edgeLabel');
+}
+
+function compatTextStyle(opt, propName) {
+    // Check whether is not object (string\null\undefined ...)
+    var labelOptSingle = isObject$3(opt) && opt[propName];
+    var textStyle = isObject$3(labelOptSingle) && labelOptSingle.textStyle;
+    if (textStyle) {
+        for (var i = 0, len = TEXT_STYLE_OPTIONS.length; i < len; i++) {
+            var propName = TEXT_STYLE_OPTIONS[i];
+            if (textStyle.hasOwnProperty(propName)) {
+                labelOptSingle[propName] = textStyle[propName];
+            }
+        }
+    }
+}
+
+function compatEC3CommonStyles(opt) {
+    if (opt) {
+        removeEC3NormalStatus(opt);
+        compatTextStyle(opt, 'label');
+        opt.emphasis && compatTextStyle(opt.emphasis, 'label');
+    }
+}
+
+function processSeries(seriesOpt) {
+    if (!isObject$3(seriesOpt)) {
+        return;
+    }
+
+    compatEC2ItemStyle(seriesOpt);
+    removeEC3NormalStatus(seriesOpt);
+
+    compatTextStyle(seriesOpt, 'label');
+    // treemap
+    compatTextStyle(seriesOpt, 'upperLabel');
+    // graph
+    compatTextStyle(seriesOpt, 'edgeLabel');
+    if (seriesOpt.emphasis) {
+        compatTextStyle(seriesOpt.emphasis, 'label');
+        // treemap
+        compatTextStyle(seriesOpt.emphasis, 'upperLabel');
+        // graph
+        compatTextStyle(seriesOpt.emphasis, 'edgeLabel');
+    }
+
+    var markPoint = seriesOpt.markPoint;
+    if (markPoint) {
+        compatEC2ItemStyle(markPoint);
+        compatEC3CommonStyles(markPoint);
+    }
+
+    var markLine = seriesOpt.markLine;
+    if (markLine) {
+        compatEC2ItemStyle(markLine);
+        compatEC3CommonStyles(markLine);
+    }
+
+    var markArea = seriesOpt.markArea;
+    if (markArea) {
+        compatEC3CommonStyles(markArea);
+    }
+
+    var data = seriesOpt.data;
+
+    // Break with ec3: if `setOption` again, there may be no `type` in option,
+    // then the backward compat based on option type will not be performed.
+
+    if (seriesOpt.type === 'graph') {
+        data = data || seriesOpt.nodes;
+        var edgeData = seriesOpt.links || seriesOpt.edges;
+        if (edgeData && !isTypedArray(edgeData)) {
+            for (var i = 0; i < edgeData.length; i++) {
+                compatEC3CommonStyles(edgeData[i]);
+            }
+        }
+        each$1(seriesOpt.categories, function (opt) {
+            removeEC3NormalStatus(opt);
+        });
+    }
+
+    if (data && !isTypedArray(data)) {
+        for (var i = 0; i < data.length; i++) {
+            compatEC3CommonStyles(data[i]);
+        }
+    }
+
+    // mark point data
+    var markPoint = seriesOpt.markPoint;
+    if (markPoint && markPoint.data) {
+        var mpData = markPoint.data;
+        for (var i = 0; i < mpData.length; i++) {
+            compatEC3CommonStyles(mpData[i]);
+        }
+    }
+    // mark line data
+    var markLine = seriesOpt.markLine;
+    if (markLine && markLine.data) {
+        var mlData = markLine.data;
+        for (var i = 0; i < mlData.length; i++) {
+            if (isArray(mlData[i])) {
+                compatEC3CommonStyles(mlData[i][0]);
+                compatEC3CommonStyles(mlData[i][1]);
+            }
+            else {
+                compatEC3CommonStyles(mlData[i]);
+            }
+        }
+    }
+
+    // Series
+    if (seriesOpt.type === 'gauge') {
+        compatTextStyle(seriesOpt, 'axisLabel');
+        compatTextStyle(seriesOpt, 'title');
+        compatTextStyle(seriesOpt, 'detail');
+    }
+    else if (seriesOpt.type === 'treemap') {
+        convertNormalEmphasis(seriesOpt.breadcrumb, 'itemStyle');
+        each$1(seriesOpt.levels, function (opt) {
+            removeEC3NormalStatus(opt);
+        });
+    }
+    else if (seriesOpt.type === 'tree') {
+        removeEC3NormalStatus(seriesOpt.leaves);
+    }
+    // sunburst starts from ec4, so it does not need to compat levels.
+}
+
+function toArr(o) {
+    return isArray(o) ? o : o ? [o] : [];
+}
+
+function toObj(o) {
+    return (isArray(o) ? o[0] : o) || {};
+}
+
+var compatStyle = function (option, isTheme) {
+    each$5(toArr(option.series), function (seriesOpt) {
+        isObject$3(seriesOpt) && processSeries(seriesOpt);
+    });
+
+    var axes = ['xAxis', 'yAxis', 'radiusAxis', 'angleAxis', 'singleAxis', 'parallelAxis', 'radar'];
+    isTheme && axes.push('valueAxis', 'categoryAxis', 'logAxis', 'timeAxis');
+
+    each$5(
+        axes,
+        function (axisName) {
+            each$5(toArr(option[axisName]), function (axisOpt) {
+                if (axisOpt) {
+                    compatTextStyle(axisOpt, 'axisLabel');
+                    compatTextStyle(axisOpt.axisPointer, 'label');
+                }
+            });
+        }
+    );
+
+    each$5(toArr(option.parallel), function (parallelOpt) {
+        var parallelAxisDefault = parallelOpt && parallelOpt.parallelAxisDefault;
+        compatTextStyle(parallelAxisDefault, 'axisLabel');
+        compatTextStyle(parallelAxisDefault && parallelAxisDefault.axisPointer, 'label');
+    });
+
+    each$5(toArr(option.calendar), function (calendarOpt) {
+        convertNormalEmphasis(calendarOpt, 'itemStyle');
+        compatTextStyle(calendarOpt, 'dayLabel');
+        compatTextStyle(calendarOpt, 'monthLabel');
+        compatTextStyle(calendarOpt, 'yearLabel');
+    });
+
+    // radar.name.textStyle
+    each$5(toArr(option.radar), function (radarOpt) {
+        compatTextStyle(radarOpt, 'name');
+    });
+
+    each$5(toArr(option.geo), function (geoOpt) {
+        if (isObject$3(geoOpt)) {
+            compatEC3CommonStyles(geoOpt);
+            each$5(toArr(geoOpt.regions), function (regionObj) {
+                compatEC3CommonStyles(regionObj);
+            });
+        }
+    });
+
+    each$5(toArr(option.timeline), function (timelineOpt) {
+        compatEC3CommonStyles(timelineOpt);
+        convertNormalEmphasis(timelineOpt, 'label');
+        convertNormalEmphasis(timelineOpt, 'itemStyle');
+        convertNormalEmphasis(timelineOpt, 'controlStyle', true);
+
+        var data = timelineOpt.data;
+        isArray(data) && each$1(data, function (item) {
+            if (isObject$1(item)) {
+                convertNormalEmphasis(item, 'label');
+                convertNormalEmphasis(item, 'itemStyle');
+            }
+        });
+    });
+
+    each$5(toArr(option.toolbox), function (toolboxOpt) {
+        convertNormalEmphasis(toolboxOpt, 'iconStyle');
+        each$5(toolboxOpt.feature, function (featureOpt) {
+            convertNormalEmphasis(featureOpt, 'iconStyle');
+        });
+    });
+
+    compatTextStyle(toObj(option.axisPointer), 'label');
+    compatTextStyle(toObj(option.tooltip).axisPointer, 'label');
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Compatitable with 2.0
+
+function get(opt, path) {
+    path = path.split(',');
+    var obj = opt;
+    for (var i = 0; i < path.length; i++) {
+        obj = obj && obj[path[i]];
+        if (obj == null) {
+            break;
+        }
+    }
+    return obj;
+}
+
+function set$1(opt, path, val, overwrite) {
+    path = path.split(',');
+    var obj = opt;
+    var key;
+    for (var i = 0; i < path.length - 1; i++) {
+        key = path[i];
+        if (obj[key] == null) {
+            obj[key] = {};
+        }
+        obj = obj[key];
+    }
+    if (overwrite || obj[path[i]] == null) {
+        obj[path[i]] = val;
+    }
+}
+
+function compatLayoutProperties(option) {
+    each$1(LAYOUT_PROPERTIES, function (prop) {
+        if (prop[0] in option && !(prop[1] in option)) {
+            option[prop[1]] = option[prop[0]];
+        }
+    });
+}
+
+var LAYOUT_PROPERTIES = [
+    ['x', 'left'], ['y', 'top'], ['x2', 'right'], ['y2', 'bottom']
+];
+
+var COMPATITABLE_COMPONENTS = [
+    'grid', 'geo', 'parallel', 'legend', 'toolbox', 'title', 'visualMap', 'dataZoom', 'timeline'
+];
+
+var backwardCompat = function (option, isTheme) {
+    compatStyle(option, isTheme);
+
+    // Make sure series array for model initialization.
+    option.series = normalizeToArray(option.series);
+
+    each$1(option.series, function (seriesOpt) {
+        if (!isObject$1(seriesOpt)) {
+            return;
+        }
+
+        var seriesType = seriesOpt.type;
+
+        if (seriesType === 'pie' || seriesType === 'gauge') {
+            if (seriesOpt.clockWise != null) {
+                seriesOpt.clockwise = seriesOpt.clockWise;
+            }
+        }
+        if (seriesType === 'gauge') {
+            var pointerColor = get(seriesOpt, 'pointer.color');
+            pointerColor != null
+                && set$1(seriesOpt, 'itemStyle.normal.color', pointerColor);
+        }
+
+        compatLayoutProperties(seriesOpt);
+    });
+
+    // dataRange has changed to visualMap
+    if (option.dataRange) {
+        option.visualMap = option.dataRange;
+    }
+
+    each$1(COMPATITABLE_COMPONENTS, function (componentName) {
+        var options = option[componentName];
+        if (options) {
+            if (!isArray(options)) {
+                options = [options];
+            }
+            each$1(options, function (option) {
+                compatLayoutProperties(option);
+            });
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// (1) [Caution]: the logic is correct based on the premises:
+//     data processing stage is blocked in stream.
+//     See <module:echarts/stream/Scheduler#performDataProcessorTasks>
+// (2) Only register once when import repeatly.
+//     Should be executed before after series filtered and before stack calculation.
+var dataStack = function (ecModel) {
+    var stackInfoMap = createHashMap();
+    ecModel.eachSeries(function (seriesModel) {
+        var stack = seriesModel.get('stack');
+        // Compatibal: when `stack` is set as '', do not stack.
+        if (stack) {
+            var stackInfoList = stackInfoMap.get(stack) || stackInfoMap.set(stack, []);
+            var data = seriesModel.getData();
+
+            var stackInfo = {
+                // Used for calculate axis extent automatically.
+                stackResultDimension: data.getCalculationInfo('stackResultDimension'),
+                stackedOverDimension: data.getCalculationInfo('stackedOverDimension'),
+                stackedDimension: data.getCalculationInfo('stackedDimension'),
+                stackedByDimension: data.getCalculationInfo('stackedByDimension'),
+                isStackedByIndex: data.getCalculationInfo('isStackedByIndex'),
+                data: data,
+                seriesModel: seriesModel
+            };
+
+            // If stacked on axis that do not support data stack.
+            if (!stackInfo.stackedDimension
+                || !(stackInfo.isStackedByIndex || stackInfo.stackedByDimension)
+            ) {
+                return;
+            }
+
+            stackInfoList.length && data.setCalculationInfo(
+                'stackedOnSeries', stackInfoList[stackInfoList.length - 1].seriesModel
+            );
+
+            stackInfoList.push(stackInfo);
+        }
+    });
+
+    stackInfoMap.each(calculateStack);
+};
+
+function calculateStack(stackInfoList) {
+    each$1(stackInfoList, function (targetStackInfo, idxInStack) {
+        var resultVal = [];
+        var resultNaN = [NaN, NaN];
+        var dims = [targetStackInfo.stackResultDimension, targetStackInfo.stackedOverDimension];
+        var targetData = targetStackInfo.data;
+        var isStackedByIndex = targetStackInfo.isStackedByIndex;
+
+        // Should not write on raw data, because stack series model list changes
+        // depending on legend selection.
+        var newData = targetData.map(dims, function (v0, v1, dataIndex) {
+            var sum = targetData.get(targetStackInfo.stackedDimension, dataIndex);
+
+            // Consider `connectNulls` of line area, if value is NaN, stackedOver
+            // should also be NaN, to draw a appropriate belt area.
+            if (isNaN(sum)) {
+                return resultNaN;
+            }
+
+            var byValue;
+            var stackedDataRawIndex;
+
+            if (isStackedByIndex) {
+                stackedDataRawIndex = targetData.getRawIndex(dataIndex);
+            }
+            else {
+                byValue = targetData.get(targetStackInfo.stackedByDimension, dataIndex);
+            }
+
+            // If stackOver is NaN, chart view will render point on value start.
+            var stackedOver = NaN;
+
+            for (var j = idxInStack - 1; j >= 0; j--) {
+                var stackInfo = stackInfoList[j];
+
+                // Has been optimized by inverted indices on `stackedByDimension`.
+                if (!isStackedByIndex) {
+                    stackedDataRawIndex = stackInfo.data.rawIndexOf(stackInfo.stackedByDimension, byValue);
+                }
+
+                if (stackedDataRawIndex >= 0) {
+                    var val = stackInfo.data.getByRawIndex(stackInfo.stackResultDimension, stackedDataRawIndex);
+
+                    // Considering positive stack, negative stack and empty data
+                    if ((sum >= 0 && val > 0) // Positive stack
+                        || (sum <= 0 && val < 0) // Negative stack
+                    ) {
+                        sum += val;
+                        stackedOver = val;
+                        break;
+                    }
+                }
+            }
+
+            resultVal[0] = sum;
+            resultVal[1] = stackedOver;
+
+            return resultVal;
+        });
+
+        targetData.hostModel.setData(newData);
+        // Update for consequent calculation
+        targetStackInfo.data = newData;
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO
+// ??? refactor? check the outer usage of data provider.
+// merge with defaultDimValueGetter?
+
+/**
+ * If normal array used, mutable chunk size is supported.
+ * If typed array used, chunk size must be fixed.
+ */
+function DefaultDataProvider(source, dimSize) {
+    if (!Source.isInstance(source)) {
+        source = Source.seriesDataToSource(source);
+    }
+    this._source = source;
+
+    var data = this._data = source.data;
+    var sourceFormat = source.sourceFormat;
+
+    // Typed array. TODO IE10+?
+    if (sourceFormat === SOURCE_FORMAT_TYPED_ARRAY) {
+        if (__DEV__) {
+            if (dimSize == null) {
+                throw new Error('Typed array data must specify dimension size');
+            }
+        }
+        this._offset = 0;
+        this._dimSize = dimSize;
+        this._data = data;
+    }
+
+    var methods = providerMethods[
+        sourceFormat === SOURCE_FORMAT_ARRAY_ROWS
+        ? sourceFormat + '_' + source.seriesLayoutBy
+        : sourceFormat
+    ];
+
+    if (__DEV__) {
+        assert$1(methods, 'Invalide sourceFormat: ' + sourceFormat);
+    }
+
+    extend(this, methods);
+}
+
+var providerProto = DefaultDataProvider.prototype;
+// If data is pure without style configuration
+providerProto.pure = false;
+// If data is persistent and will not be released after use.
+providerProto.persistent = true;
+
+// ???! FIXME legacy data provider do not has method getSource
+providerProto.getSource = function () {
+    return this._source;
+};
+
+var providerMethods = {
+
+    'arrayRows_column': {
+        pure: true,
+        count: function () {
+            return Math.max(0, this._data.length - this._source.startIndex);
+        },
+        getItem: function (idx) {
+            return this._data[idx + this._source.startIndex];
+        },
+        appendData: appendDataSimply
+    },
+
+    'arrayRows_row': {
+        pure: true,
+        count: function () {
+            var row = this._data[0];
+            return row ? Math.max(0, row.length - this._source.startIndex) : 0;
+        },
+        getItem: function (idx) {
+            idx += this._source.startIndex;
+            var item = [];
+            var data = this._data;
+            for (var i = 0; i < data.length; i++) {
+                var row = data[i];
+                item.push(row ? row[idx] : null);
+            }
+            return item;
+        },
+        appendData: function () {
+            throw new Error('Do not support appendData when set seriesLayoutBy: "row".');
+        }
+    },
+
+    'objectRows': {
+        pure: true,
+        count: countSimply,
+        getItem: getItemSimply,
+        appendData: appendDataSimply
+    },
+
+    'keyedColumns': {
+        pure: true,
+        count: function () {
+            var dimName = this._source.dimensionsDefine[0].name;
+            var col = this._data[dimName];
+            return col ? col.length : 0;
+        },
+        getItem: function (idx) {
+            var item = [];
+            var dims = this._source.dimensionsDefine;
+            for (var i = 0; i < dims.length; i++) {
+                var col = this._data[dims[i].name];
+                item.push(col ? col[idx] : null);
+            }
+            return item;
+        },
+        appendData: function (newData) {
+            var data = this._data;
+            each$1(newData, function (newCol, key) {
+                var oldCol = data[key] || (data[key] = []);
+                for (var i = 0; i < (newCol || []).length; i++) {
+                    oldCol.push(newCol[i]);
+                }
+            });
+        }
+    },
+
+    'original': {
+        count: countSimply,
+        getItem: getItemSimply,
+        appendData: appendDataSimply
+    },
+
+    'typedArray': {
+        persistent: false,
+        pure: true,
+        count: function () {
+            return this._data ? (this._data.length / this._dimSize) : 0;
+        },
+        getItem: function (idx, out) {
+            idx = idx - this._offset;
+            out = out || [];
+            var offset = this._dimSize * idx;
+            for (var i = 0; i < this._dimSize; i++) {
+                out[i] = this._data[offset + i];
+            }
+            return out;
+        },
+        appendData: function (newData) {
+            if (__DEV__) {
+                assert$1(
+                    isTypedArray(newData),
+                    'Added data must be TypedArray if data in initialization is TypedArray'
+                );
+            }
+
+            this._data = newData;
+        },
+
+        // Clean self if data is already used.
+        clean: function () {
+            // PENDING
+            this._offset += this.count();
+            this._data = null;
+        }
+    }
+};
+
+function countSimply() {
+    return this._data.length;
+}
+function getItemSimply(idx) {
+    return this._data[idx];
+}
+function appendDataSimply(newData) {
+    for (var i = 0; i < newData.length; i++) {
+        this._data.push(newData[i]);
+    }
+}
+
+
+
+var rawValueGetters = {
+
+    arrayRows: getRawValueSimply,
+
+    objectRows: function (dataItem, dataIndex, dimIndex, dimName) {
+        return dimIndex != null ? dataItem[dimName] : dataItem;
+    },
+
+    keyedColumns: getRawValueSimply,
+
+    original: function (dataItem, dataIndex, dimIndex, dimName) {
+        // FIXME
+        // In some case (markpoint in geo (geo-map.html)), dataItem
+        // is {coord: [...]}
+        var value = getDataItemValue(dataItem);
+        return (dimIndex == null || !(value instanceof Array))
+            ? value
+            : value[dimIndex];
+    },
+
+    typedArray: getRawValueSimply
+};
+
+function getRawValueSimply(dataItem, dataIndex, dimIndex, dimName) {
+    return dimIndex != null ? dataItem[dimIndex] : dataItem;
+}
+
+
+var defaultDimValueGetters = {
+
+    arrayRows: getDimValueSimply,
+
+    objectRows: function (dataItem, dimName, dataIndex, dimIndex) {
+        return converDataValue(dataItem[dimName], this._dimensionInfos[dimName]);
+    },
+
+    keyedColumns: getDimValueSimply,
+
+    original: function (dataItem, dimName, dataIndex, dimIndex) {
+        // Performance sensitive, do not use modelUtil.getDataItemValue.
+        // If dataItem is an plain object with no value field, the var `value`
+        // will be assigned with the object, but it will be tread correctly
+        // in the `convertDataValue`.
+        var value = dataItem && (dataItem.value == null ? dataItem : dataItem.value);
+
+        // If any dataItem is like { value: 10 }
+        if (!this._rawData.pure && isDataItemOption(dataItem)) {
+            this.hasItemOption = true;
+        }
+        return converDataValue(
+            (value instanceof Array)
+                ? value[dimIndex]
+                // If value is a single number or something else not array.
+                : value,
+            this._dimensionInfos[dimName]
+        );
+    },
+
+    typedArray: function (dataItem, dimName, dataIndex, dimIndex) {
+        return dataItem[dimIndex];
+    }
+
+};
+
+function getDimValueSimply(dataItem, dimName, dataIndex, dimIndex) {
+    return converDataValue(dataItem[dimIndex], this._dimensionInfos[dimName]);
+}
+
+/**
+ * This helper method convert value in data.
+ * @param {string|number|Date} value
+ * @param {Object|string} [dimInfo] If string (like 'x'), dimType defaults 'number'.
+ *        If "dimInfo.ordinalParseAndSave", ordinal value can be parsed.
+ */
+function converDataValue(value, dimInfo) {
+    // Performance sensitive.
+    var dimType = dimInfo && dimInfo.type;
+    if (dimType === 'ordinal') {
+        // If given value is a category string
+        var ordinalMeta = dimInfo && dimInfo.ordinalMeta;
+        return ordinalMeta
+            ? ordinalMeta.parseAndCollect(value)
+            : value;
+    }
+
+    if (dimType === 'time'
+        // spead up when using timestamp
+        && typeof value !== 'number'
+        && value != null
+        && value !== '-'
+    ) {
+        value = +parseDate(value);
+    }
+
+    // dimType defaults 'number'.
+    // If dimType is not ordinal and value is null or undefined or NaN or '-',
+    // parse to NaN.
+    return (value == null || value === '')
+        ? NaN
+        // If string (like '-'), using '+' parse to NaN
+        // If object, also parse to NaN
+        : +value;
+}
+
+// ??? FIXME can these logic be more neat: getRawValue, getRawDataItem,
+// Consider persistent.
+// Caution: why use raw value to display on label or tooltip?
+// A reason is to avoid format. For example time value we do not know
+// how to format is expected. More over, if stack is used, calculated
+// value may be 0.91000000001, which have brings trouble to display.
+// TODO: consider how to treat null/undefined/NaN when display?
+/**
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @param {string|number} [dim] dimName or dimIndex
+ * @return {Array.<number>|string|number} can be null/undefined.
+ */
+function retrieveRawValue(data, dataIndex, dim) {
+    if (!data) {
+        return;
+    }
+
+    // Consider data may be not persistent.
+    var dataItem = data.getRawDataItem(dataIndex);
+
+    if (dataItem == null) {
+        return;
+    }
+
+    var sourceFormat = data.getProvider().getSource().sourceFormat;
+    var dimName;
+    var dimIndex;
+
+    var dimInfo = data.getDimensionInfo(dim);
+    if (dimInfo) {
+        dimName = dimInfo.name;
+        dimIndex = dimInfo.index;
+    }
+
+    return rawValueGetters[sourceFormat](dataItem, dataIndex, dimIndex, dimName);
+}
+
+/**
+ * Compatible with some cases (in pie, map) like:
+ * data: [{name: 'xx', value: 5, selected: true}, ...]
+ * where only sourceFormat is 'original' and 'objectRows' supported.
+ *
+ * ??? TODO
+ * Supported detail options in data item when using 'arrayRows'.
+ *
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @param {string} attr like 'selected'
+ */
+function retrieveRawAttr(data, dataIndex, attr) {
+    if (!data) {
+        return;
+    }
+
+    var sourceFormat = data.getProvider().getSource().sourceFormat;
+
+    if (sourceFormat !== SOURCE_FORMAT_ORIGINAL
+        && sourceFormat !== SOURCE_FORMAT_OBJECT_ROWS
+    ) {
+        return;
+    }
+
+    var dataItem = data.getRawDataItem(dataIndex);
+    if (sourceFormat === SOURCE_FORMAT_ORIGINAL && !isObject$1(dataItem)) {
+        dataItem = null;
+    }
+    if (dataItem) {
+        return dataItem[attr];
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DIMENSION_LABEL_REG = /\{@(.+?)\}/g;
+
+// PENDING A little ugly
+var dataFormatMixin = {
+    /**
+     * Get params for formatter
+     * @param {number} dataIndex
+     * @param {string} [dataType]
+     * @return {Object}
+     */
+    getDataParams: function (dataIndex, dataType) {
+        var data = this.getData(dataType);
+        var rawValue = this.getRawValue(dataIndex, dataType);
+        var rawDataIndex = data.getRawIndex(dataIndex);
+        var name = data.getName(dataIndex);
+        var itemOpt = data.getRawDataItem(dataIndex);
+        var color = data.getItemVisual(dataIndex, 'color');
+
+        return {
+            componentType: this.mainType,
+            componentSubType: this.subType,
+            seriesType: this.mainType === 'series' ? this.subType : null,
+            seriesIndex: this.seriesIndex,
+            seriesId: this.id,
+            seriesName: this.name,
+            name: name,
+            dataIndex: rawDataIndex,
+            data: itemOpt,
+            dataType: dataType,
+            value: rawValue,
+            color: color,
+            marker: getTooltipMarker(color),
+
+            // Param name list for mapping `a`, `b`, `c`, `d`, `e`
+            $vars: ['seriesName', 'name', 'value']
+        };
+    },
+
+    /**
+     * Format label
+     * @param {number} dataIndex
+     * @param {string} [status='normal'] 'normal' or 'emphasis'
+     * @param {string} [dataType]
+     * @param {number} [dimIndex]
+     * @param {string} [labelProp='label']
+     * @return {string} If not formatter, return null/undefined
+     */
+    getFormattedLabel: function (dataIndex, status, dataType, dimIndex, labelProp) {
+        status = status || 'normal';
+        var data = this.getData(dataType);
+        var itemModel = data.getItemModel(dataIndex);
+
+        var params = this.getDataParams(dataIndex, dataType);
+        if (dimIndex != null && (params.value instanceof Array)) {
+            params.value = params.value[dimIndex];
+        }
+
+        var formatter = itemModel.get(
+            status === 'normal'
+            ? [labelProp || 'label', 'formatter']
+            : [status, labelProp || 'label', 'formatter']
+        );
+
+        if (typeof formatter === 'function') {
+            params.status = status;
+            return formatter(params);
+        }
+        else if (typeof formatter === 'string') {
+            var str = formatTpl(formatter, params);
+
+            // Support 'aaa{@[3]}bbb{@product}ccc'.
+            // Do not support '}' in dim name util have to.
+            return str.replace(DIMENSION_LABEL_REG, function (origin, dim) {
+                var len = dim.length;
+                if (dim.charAt(0) === '[' && dim.charAt(len - 1) === ']') {
+                    dim = +dim.slice(1, len - 1); // Also: '[]' => 0
+                }
+                return retrieveRawValue(data, dataIndex, dim);
+            });
+        }
+    },
+
+    /**
+     * Get raw value in option
+     * @param {number} idx
+     * @param {string} [dataType]
+     * @return {Array|number|string}
+     */
+    getRawValue: function (idx, dataType) {
+        return retrieveRawValue(this.getData(dataType), idx);
+    },
+
+    /**
+     * Should be implemented.
+     * @param {number} dataIndex
+     * @param {boolean} [multipleSeries=false]
+     * @param {number} [dataType]
+     * @return {string} tooltip string
+     */
+    formatTooltip: function () {
+        // Empty function
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} define
+ * @return See the return of `createTask`.
+ */
+function createTask(define) {
+    return new Task(define);
+}
+
+/**
+ * @constructor
+ * @param {Object} define
+ * @param {Function} define.reset Custom reset
+ * @param {Function} [define.plan] Returns 'reset' indicate reset immediately.
+ * @param {Function} [define.count] count is used to determin data task.
+ * @param {Function} [define.onDirty] count is used to determin data task.
+ */
+function Task(define) {
+    define = define || {};
+
+    this._reset = define.reset;
+    this._plan = define.plan;
+    this._count = define.count;
+    this._onDirty = define.onDirty;
+
+    this._dirty = true;
+
+    // Context must be specified implicitly, to
+    // avoid miss update context when model changed.
+    this.context;
+}
+
+var taskProto = Task.prototype;
+
+/**
+ * @param {Object} performArgs
+ * @param {number} [performArgs.step] Specified step.
+ * @param {number} [performArgs.skip] Skip customer perform call.
+ * @param {number} [performArgs.modBy] Sampling window size.
+ * @param {number} [performArgs.modDataCount] Sampling count.
+ */
+taskProto.perform = function (performArgs) {
+    var upTask = this._upstream;
+    var skip = performArgs && performArgs.skip;
+
+    // TODO some refactor.
+    // Pull data. Must pull data each time, because context.data
+    // may be updated by Series.setData.
+    if (this._dirty && upTask) {
+        var context = this.context;
+        context.data = context.outputData = upTask.context.outputData;
+    }
+
+    if (this.__pipeline) {
+        this.__pipeline.currentTask = this;
+    }
+
+    var planResult;
+    if (this._plan && !skip) {
+        planResult = this._plan(this.context);
+    }
+
+    // Support sharding by mod, which changes the render sequence and makes the rendered graphic
+    // elements uniformed distributed when progress, especially when moving or zooming.
+    var lastModBy = normalizeModBy(this._modBy);
+    var lastModDataCount = this._modDataCount || 0;
+    var modBy = normalizeModBy(performArgs && performArgs.modBy);
+    var modDataCount = performArgs && performArgs.modDataCount || 0;
+    if (lastModBy !== modBy || lastModDataCount !== modDataCount) {
+        planResult = 'reset';
+    }
+
+    function normalizeModBy(val) {
+        !(val >= 1) && (val = 1); // jshint ignore:line
+        return val;
+    }
+
+    var forceFirstProgress;
+    if (this._dirty || planResult === 'reset') {
+        this._dirty = false;
+        forceFirstProgress = reset(this, skip);
+    }
+
+    this._modBy = modBy;
+    this._modDataCount = modDataCount;
+
+    var step = performArgs && performArgs.step;
+
+    if (upTask) {
+
+        if (__DEV__) {
+            assert$1(upTask._outputDueEnd != null);
+        }
+        this._dueEnd = upTask._outputDueEnd;
+    }
+    // DataTask or overallTask
+    else {
+        if (__DEV__) {
+            assert$1(!this._progress || this._count);
+        }
+        this._dueEnd = this._count ? this._count(this.context) : Infinity;
+    }
+
+    // Note: Stubs, that its host overall task let it has progress, has progress.
+    // If no progress, pass index from upstream to downstream each time plan called.
+    if (this._progress) {
+        var start = this._dueIndex;
+        var end = Math.min(
+            step != null ? this._dueIndex + step : Infinity,
+            this._dueEnd
+        );
+
+        if (!skip && (forceFirstProgress || start < end)) {
+            var progress = this._progress;
+            if (isArray(progress)) {
+                for (var i = 0; i < progress.length; i++) {
+                    doProgress(this, progress[i], start, end, modBy, modDataCount);
+                }
+            }
+            else {
+                doProgress(this, progress, start, end, modBy, modDataCount);
+            }
+        }
+
+        this._dueIndex = end;
+        // If no `outputDueEnd`, assume that output data and
+        // input data is the same, so use `dueIndex` as `outputDueEnd`.
+        var outputDueEnd = this._settedOutputEnd != null
+            ? this._settedOutputEnd : end;
+
+        if (__DEV__) {
+            // ??? Can not rollback.
+            assert$1(outputDueEnd >= this._outputDueEnd);
+        }
+
+        this._outputDueEnd = outputDueEnd;
+    }
+    else {
+        // (1) Some overall task has no progress.
+        // (2) Stubs, that its host overall task do not let it has progress, has no progress.
+        // This should always be performed so it can be passed to downstream.
+        this._dueIndex = this._outputDueEnd = this._settedOutputEnd != null
+            ? this._settedOutputEnd : this._dueEnd;
+    }
+
+    return this.unfinished();
+};
+
+var iterator = (function () {
+
+    var end;
+    var current;
+    var modBy;
+    var modDataCount;
+    var winCount;
+
+    var it = {
+        reset: function (s, e, sStep, sCount) {
+            current = s;
+            end = e;
+
+            modBy = sStep;
+            modDataCount = sCount;
+            winCount = Math.ceil(modDataCount / modBy);
+
+            it.next = (modBy > 1 && modDataCount > 0) ? modNext : sequentialNext;
+        }
+    };
+
+    return it;
+
+    function sequentialNext() {
+        return current < end ? current++ : null;
+    }
+
+    function modNext() {
+        var dataIndex = (current % winCount) * modBy + Math.ceil(current / winCount);
+        var result = current >= end
+            ? null
+            : dataIndex < modDataCount
+            ? dataIndex
+            // If modDataCount is smaller than data.count() (consider `appendData` case),
+            // Use normal linear rendering mode.
+            : current;
+        current++;
+        return result;
+    }
+})();
+
+taskProto.dirty = function () {
+    this._dirty = true;
+    this._onDirty && this._onDirty(this.context);
+};
+
+function doProgress(taskIns, progress, start, end, modBy, modDataCount) {
+    iterator.reset(start, end, modBy, modDataCount);
+    taskIns._callingProgress = progress;
+    taskIns._callingProgress({
+        start: start, end: end, count: end - start, next: iterator.next
+    }, taskIns.context);
+}
+
+function reset(taskIns, skip) {
+    taskIns._dueIndex = taskIns._outputDueEnd = taskIns._dueEnd = 0;
+    taskIns._settedOutputEnd = null;
+
+    var progress;
+    var forceFirstProgress;
+
+    if (!skip && taskIns._reset) {
+        progress = taskIns._reset(taskIns.context);
+        if (progress && progress.progress) {
+            forceFirstProgress = progress.forceFirstProgress;
+            progress = progress.progress;
+        }
+        // To simplify no progress checking, array must has item.
+        if (isArray(progress) && !progress.length) {
+            progress = null;
+        }
+    }
+
+    taskIns._progress = progress;
+    taskIns._modBy = taskIns._modDataCount = null;
+
+    var downstream = taskIns._downstream;
+    downstream && downstream.dirty();
+
+    return forceFirstProgress;
+}
+
+/**
+ * @return {boolean}
+ */
+taskProto.unfinished = function () {
+    return this._progress && this._dueIndex < this._dueEnd;
+};
+
+/**
+ * @param {Object} downTask The downstream task.
+ * @return {Object} The downstream task.
+ */
+taskProto.pipe = function (downTask) {
+    if (__DEV__) {
+        assert$1(downTask && !downTask._disposed && downTask !== this);
+    }
+
+    // If already downstream, do not dirty downTask.
+    if (this._downstream !== downTask || this._dirty) {
+        this._downstream = downTask;
+        downTask._upstream = this;
+        downTask.dirty();
+    }
+};
+
+taskProto.dispose = function () {
+    if (this._disposed) {
+        return;
+    }
+
+    this._upstream && (this._upstream._downstream = null);
+    this._downstream && (this._downstream._upstream = null);
+
+    this._dirty = false;
+    this._disposed = true;
+};
+
+taskProto.getUpstream = function () {
+    return this._upstream;
+};
+
+taskProto.getDownstream = function () {
+    return this._downstream;
+};
+
+taskProto.setOutputEnd = function (end) {
+    // This only happend in dataTask, dataZoom, map, currently.
+    // where dataZoom do not set end each time, but only set
+    // when reset. So we should record the setted end, in case
+    // that the stub of dataZoom perform again and earse the
+    // setted end by upstream.
+    this._outputDueEnd = this._settedOutputEnd = end;
+};
+
+
+///////////////////////////////////////////////////////////
+// For stream debug (Should be commented out after used!)
+// Usage: printTask(this, 'begin');
+// Usage: printTask(this, null, {someExtraProp});
+// function printTask(task, prefix, extra) {
+//     window.ecTaskUID == null && (window.ecTaskUID = 0);
+//     task.uidDebug == null && (task.uidDebug = `task_${window.ecTaskUID++}`);
+//     task.agent && task.agent.uidDebug == null && (task.agent.uidDebug = `task_${window.ecTaskUID++}`);
+//     var props = [];
+//     if (task.__pipeline) {
+//         var val = `${task.__idxInPipeline}/${task.__pipeline.tail.__idxInPipeline} ${task.agent ? '(stub)' : ''}`;
+//         props.push({text: 'idx', value: val});
+//     } else {
+//         var stubCount = 0;
+//         task.agentStubMap.each(() => stubCount++);
+//         props.push({text: 'idx', value: `overall (stubs: ${stubCount})`});
+//     }
+//     props.push({text: 'uid', value: task.uidDebug});
+//     if (task.__pipeline) {
+//         props.push({text: 'pid', value: task.__pipeline.id});
+//         task.agent && props.push(
+//             {text: 'stubFor', value: task.agent.uidDebug}
+//         );
+//     }
+//     props.push(
+//         {text: 'dirty', value: task._dirty},
+//         {text: 'dueIndex', value: task._dueIndex},
+//         {text: 'dueEnd', value: task._dueEnd},
+//         {text: 'outputDueEnd', value: task._outputDueEnd}
+//     );
+//     if (extra) {
+//         Object.keys(extra).forEach(key => {
+//             props.push({text: key, value: extra[key]});
+//         });
+//     }
+//     var args = ['color: blue'];
+//     var msg = `%c[${prefix || 'T'}] %c` + props.map(item => (
+//         args.push('color: black', 'color: red'),
+//         `${item.text}: %c${item.value}`
+//     )).join('%c, ');
+//     console.log.apply(console, [msg].concat(args));
+//     // console.log(this);
+// }
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$4 = makeInner();
+
+var SeriesModel = ComponentModel.extend({
+
+    type: 'series.__base__',
+
+    /**
+     * @readOnly
+     */
+    seriesIndex: 0,
+
+    // coodinateSystem will be injected in the echarts/CoordinateSystem
+    coordinateSystem: null,
+
+    /**
+     * @type {Object}
+     * @protected
+     */
+    defaultOption: null,
+
+    /**
+     * Data provided for legend
+     * @type {Function}
+     */
+    // PENDING
+    legendDataProvider: null,
+
+    /**
+     * Access path of color for visual
+     */
+    visualColorAccessPath: 'itemStyle.color',
+
+    /**
+     * Support merge layout params.
+     * Only support 'box' now (left/right/top/bottom/width/height).
+     * @type {string|Object} Object can be {ignoreSize: true}
+     * @readOnly
+     */
+    layoutMode: null,
+
+    init: function (option, parentModel, ecModel, extraOpt) {
+
+        /**
+         * @type {number}
+         * @readOnly
+         */
+        this.seriesIndex = this.componentIndex;
+
+        this.dataTask = createTask({
+            count: dataTaskCount,
+            reset: dataTaskReset
+        });
+        this.dataTask.context = {model: this};
+
+        this.mergeDefaultAndTheme(option, ecModel);
+
+        prepareSource(this);
+
+
+        var data = this.getInitialData(option, ecModel);
+        wrapData(data, this);
+        this.dataTask.context.data = data;
+
+        if (__DEV__) {
+            assert$1(data, 'getInitialData returned invalid data.');
+        }
+
+        /**
+         * @type {module:echarts/data/List|module:echarts/data/Tree|module:echarts/data/Graph}
+         * @private
+         */
+        inner$4(this).dataBeforeProcessed = data;
+
+        // If we reverse the order (make data firstly, and then make
+        // dataBeforeProcessed by cloneShallow), cloneShallow will
+        // cause data.graph.data !== data when using
+        // module:echarts/data/Graph or module:echarts/data/Tree.
+        // See module:echarts/data/helper/linkList
+
+        // Theoretically, it is unreasonable to call `seriesModel.getData()` in the model
+        // init or merge stage, because the data can be restored. So we do not `restoreData`
+        // and `setData` here, which forbids calling `seriesModel.getData()` in this stage.
+        // Call `seriesModel.getRawData()` instead.
+        // this.restoreData();
+
+        autoSeriesName(this);
+    },
+
+    /**
+     * Util for merge default and theme to option
+     * @param  {Object} option
+     * @param  {module:echarts/model/Global} ecModel
+     */
+    mergeDefaultAndTheme: function (option, ecModel) {
+        var layoutMode = this.layoutMode;
+        var inputPositionParams = layoutMode
+            ? getLayoutParams(option) : {};
+
+        // Backward compat: using subType on theme.
+        // But if name duplicate between series subType
+        // (for example: parallel) add component mainType,
+        // add suffix 'Series'.
+        var themeSubType = this.subType;
+        if (ComponentModel.hasClass(themeSubType)) {
+            themeSubType += 'Series';
+        }
+        merge(
+            option,
+            ecModel.getTheme().get(this.subType)
+        );
+        merge(option, this.getDefaultOption());
+
+        // Default label emphasis `show`
+        defaultEmphasis(option, 'label', ['show']);
+
+        this.fillDataTextStyle(option.data);
+
+        if (layoutMode) {
+            mergeLayoutParam(option, inputPositionParams, layoutMode);
+        }
+    },
+
+    mergeOption: function (newSeriesOption, ecModel) {
+        // this.settingTask.dirty();
+
+        newSeriesOption = merge(this.option, newSeriesOption, true);
+        this.fillDataTextStyle(newSeriesOption.data);
+
+        var layoutMode = this.layoutMode;
+        if (layoutMode) {
+            mergeLayoutParam(this.option, newSeriesOption, layoutMode);
+        }
+
+        prepareSource(this);
+
+        var data = this.getInitialData(newSeriesOption, ecModel);
+        wrapData(data, this);
+        this.dataTask.dirty();
+        this.dataTask.context.data = data;
+
+        inner$4(this).dataBeforeProcessed = data;
+
+        autoSeriesName(this);
+    },
+
+    fillDataTextStyle: function (data) {
+        // Default data label emphasis `show`
+        // FIXME Tree structure data ?
+        // FIXME Performance ?
+        if (data && !isTypedArray(data)) {
+            var props = ['show'];
+            for (var i = 0; i < data.length; i++) {
+                if (data[i] && data[i].label) {
+                    defaultEmphasis(data[i], 'label', props);
+                }
+            }
+        }
+    },
+
+    /**
+     * Init a data structure from data related option in series
+     * Must be overwritten
+     */
+    getInitialData: function () {},
+
+    /**
+     * Append data to list
+     * @param {Object} params
+     * @param {Array|TypedArray} params.data
+     */
+    appendData: function (params) {
+        // FIXME ???
+        // (1) If data from dataset, forbidden append.
+        // (2) support append data of dataset.
+        var data = this.getRawData();
+        data.appendData(params.data);
+    },
+
+    /**
+     * Consider some method like `filter`, `map` need make new data,
+     * We should make sure that `seriesModel.getData()` get correct
+     * data in the stream procedure. So we fetch data from upstream
+     * each time `task.perform` called.
+     * @param {string} [dataType]
+     * @return {module:echarts/data/List}
+     */
+    getData: function (dataType) {
+        var task = getCurrentTask(this);
+        if (task) {
+            var data = task.context.data;
+            return dataType == null ? data : data.getLinkedData(dataType);
+        }
+        else {
+            // When series is not alive (that may happen when click toolbox
+            // restore or setOption with not merge mode), series data may
+            // be still need to judge animation or something when graphic
+            // elements want to know whether fade out.
+            return inner$4(this).data;
+        }
+    },
+
+    /**
+     * @param {module:echarts/data/List} data
+     */
+    setData: function (data) {
+        var task = getCurrentTask(this);
+        if (task) {
+            var context = task.context;
+            // Consider case: filter, data sample.
+            if (context.data !== data && task.modifyOutputEnd) {
+                task.setOutputEnd(data.count());
+            }
+            context.outputData = data;
+            // Caution: setData should update context.data,
+            // Because getData may be called multiply in a
+            // single stage and expect to get the data just
+            // set. (For example, AxisProxy, x y both call
+            // getData and setDate sequentially).
+            // So the context.data should be fetched from
+            // upstream each time when a stage starts to be
+            // performed.
+            if (task !== this.dataTask) {
+                context.data = data;
+            }
+        }
+        inner$4(this).data = data;
+    },
+
+    /**
+     * @see {module:echarts/data/helper/sourceHelper#getSource}
+     * @return {module:echarts/data/Source} source
+     */
+    getSource: function () {
+        return getSource(this);
+    },
+
+    /**
+     * Get data before processed
+     * @return {module:echarts/data/List}
+     */
+    getRawData: function () {
+        return inner$4(this).dataBeforeProcessed;
+    },
+
+    /**
+     * Get base axis if has coordinate system and has axis.
+     * By default use coordSys.getBaseAxis();
+     * Can be overrided for some chart.
+     * @return {type} description
+     */
+    getBaseAxis: function () {
+        var coordSys = this.coordinateSystem;
+        return coordSys && coordSys.getBaseAxis && coordSys.getBaseAxis();
+    },
+
+    // FIXME
+    /**
+     * Default tooltip formatter
+     *
+     * @param {number} dataIndex
+     * @param {boolean} [multipleSeries=false]
+     * @param {number} [dataType]
+     */
+    formatTooltip: function (dataIndex, multipleSeries, dataType) {
+
+        function formatArrayValue(value) {
+            // ??? TODO refactor these logic.
+            // check: category-no-encode-has-axis-data in dataset.html
+            var vertially = reduce(value, function (vertially, val, idx) {
+                var dimItem = data.getDimensionInfo(idx);
+                return vertially |= dimItem && dimItem.tooltip !== false && dimItem.displayName != null;
+            }, 0);
+
+            var result = [];
+
+            tooltipDims.length
+                ? each$1(tooltipDims, function (dim) {
+                    setEachItem(retrieveRawValue(data, dataIndex, dim), dim);
+                })
+                // By default, all dims is used on tooltip.
+                : each$1(value, setEachItem);
+
+            function setEachItem(val, dim) {
+                var dimInfo = data.getDimensionInfo(dim);
+                // If `dimInfo.tooltip` is not set, show tooltip.
+                if (!dimInfo || dimInfo.otherDims.tooltip === false) {
+                    return;
+                }
+                var dimType = dimInfo.type;
+                var dimHead = getTooltipMarker({color: color, type: 'subItem'});
+                var valStr = (vertially
+                        ? dimHead + encodeHTML(dimInfo.displayName || '-') + ': '
+                        : ''
+                    )
+                    // FIXME should not format time for raw data?
+                    + encodeHTML(dimType === 'ordinal'
+                        ? val + ''
+                        : dimType === 'time'
+                        ? (multipleSeries ? '' : formatTime('yyyy/MM/dd hh:mm:ss', val))
+                        : addCommas(val)
+                    );
+                valStr && result.push(valStr);
+            }
+
+            return (vertially ? '<br/>' : '') + result.join(vertially ? '<br/>' : ', ');
+        }
+
+        function formatSingleValue(val) {
+            return encodeHTML(addCommas(val));
+        }
+
+        var data = this.getData();
+        var tooltipDims = data.mapDimension('defaultedTooltip', true);
+        var tooltipDimLen = tooltipDims.length;
+        var value = this.getRawValue(dataIndex);
+        var isValueArr = isArray(value);
+
+        var color = data.getItemVisual(dataIndex, 'color');
+        if (isObject$1(color) && color.colorStops) {
+            color = (color.colorStops[0] || {}).color;
+        }
+        color = color || 'transparent';
+
+        // Complicated rule for pretty tooltip.
+        var formattedValue = (tooltipDimLen > 1 || (isValueArr && !tooltipDimLen))
+            ? formatArrayValue(value)
+            : tooltipDimLen
+            ? formatSingleValue(retrieveRawValue(data, dataIndex, tooltipDims[0]))
+            : formatSingleValue(isValueArr ? value[0] : value);
+
+        var colorEl = getTooltipMarker(color);
+
+        var name = data.getName(dataIndex);
+
+        var seriesName = this.name;
+        if (!isNameSpecified(this)) {
+            seriesName = '';
+        }
+        seriesName = seriesName
+            ? encodeHTML(seriesName) + (!multipleSeries ? '<br/>' : ': ')
+            : '';
+
+        return !multipleSeries
+            ? seriesName + colorEl
+                + (name
+                    ? encodeHTML(name) + ': ' + formattedValue
+                    : formattedValue
+                )
+            : colorEl + seriesName + formattedValue;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    isAnimationEnabled: function () {
+        if (env$1.node) {
+            return false;
+        }
+
+        var animationEnabled = this.getShallow('animation');
+        if (animationEnabled) {
+            if (this.getData().count() > this.getShallow('animationThreshold')) {
+                animationEnabled = false;
+            }
+        }
+        return animationEnabled;
+    },
+
+    restoreData: function () {
+        this.dataTask.dirty();
+    },
+
+    getColorFromPalette: function (name, scope, requestColorNum) {
+        var ecModel = this.ecModel;
+        // PENDING
+        var color = colorPaletteMixin.getColorFromPalette.call(this, name, scope, requestColorNum);
+        if (!color) {
+            color = ecModel.getColorFromPalette(name, scope, requestColorNum);
+        }
+        return color;
+    },
+
+    /**
+     * Use `data.mapDimension(coordDim, true)` instead.
+     * @deprecated
+     */
+    coordDimToDataDim: function (coordDim) {
+        return this.getRawData().mapDimension(coordDim, true);
+    },
+
+    /**
+     * Get progressive rendering count each step
+     * @return {number}
+     */
+    getProgressive: function () {
+        return this.get('progressive');
+    },
+
+    /**
+     * Get progressive rendering count each step
+     * @return {number}
+     */
+    getProgressiveThreshold: function () {
+        return this.get('progressiveThreshold');
+    },
+
+    /**
+     * Get data indices for show tooltip content. See tooltip.
+     * @abstract
+     * @param {Array.<string>|string} dim
+     * @param {Array.<number>} value
+     * @param {module:echarts/coord/single/SingleAxis} baseAxis
+     * @return {Object} {dataIndices, nestestValue}.
+     */
+    getAxisTooltipData: null,
+
+    /**
+     * See tooltip.
+     * @abstract
+     * @param {number} dataIndex
+     * @return {Array.<number>} Point of tooltip. null/undefined can be returned.
+     */
+    getTooltipPosition: null,
+
+    /**
+     * @see {module:echarts/stream/Scheduler}
+     */
+    pipeTask: null,
+
+    /**
+     * Convinient for override in extended class.
+     * @protected
+     * @type {Function}
+     */
+    preventIncremental: null,
+
+    /**
+     * @public
+     * @readOnly
+     * @type {Object}
+     */
+    pipelineContext: null
+
+});
+
+
+mixin(SeriesModel, dataFormatMixin);
+mixin(SeriesModel, colorPaletteMixin);
+
+/**
+ * MUST be called after `prepareSource` called
+ * Here we need to make auto series, especially for auto legend. But we
+ * do not modify series.name in option to avoid side effects.
+ */
+function autoSeriesName(seriesModel) {
+    // User specified name has higher priority, otherwise it may cause
+    // series can not be queried unexpectedly.
+    var name = seriesModel.name;
+    if (!isNameSpecified(seriesModel)) {
+        seriesModel.name = getSeriesAutoName(seriesModel) || name;
+    }
+}
+
+function getSeriesAutoName(seriesModel) {
+    var data = seriesModel.getRawData();
+    var dataDims = data.mapDimension('seriesName', true);
+    var nameArr = [];
+    each$1(dataDims, function (dataDim) {
+        var dimInfo = data.getDimensionInfo(dataDim);
+        dimInfo.displayName && nameArr.push(dimInfo.displayName);
+    });
+    return nameArr.join(' ');
+}
+
+function dataTaskCount(context) {
+    return context.model.getRawData().count();
+}
+
+function dataTaskReset(context) {
+    var seriesModel = context.model;
+    seriesModel.setData(seriesModel.getRawData().cloneShallow());
+    return dataTaskProgress;
+}
+
+function dataTaskProgress(param, context) {
+    // Avoid repead cloneShallow when data just created in reset.
+    if (param.end > context.outputData.count()) {
+        context.model.getRawData().cloneShallow(context.outputData);
+    }
+}
+
+// TODO refactor
+function wrapData(data, seriesModel) {
+    each$1(data.CHANGABLE_METHODS, function (methodName) {
+        data.wrapMethod(methodName, curry(onDataSelfChange, seriesModel));
+    });
+}
+
+function onDataSelfChange(seriesModel) {
+    var task = getCurrentTask(seriesModel);
+    if (task) {
+        // Consider case: filter, selectRange
+        task.setOutputEnd(this.count());
+    }
+}
+
+function getCurrentTask(seriesModel) {
+    var scheduler = (seriesModel.ecModel || {}).scheduler;
+    var pipeline = scheduler && scheduler.getPipeline(seriesModel.uid);
+
+    if (pipeline) {
+        // When pipline finished, the currrentTask keep the last
+        // task (renderTask).
+        var task = pipeline.currentTask;
+        if (task) {
+            var agentStubMap = task.agentStubMap;
+            if (agentStubMap) {
+                task = agentStubMap.get(seriesModel.uid);
+            }
+        }
+        return task;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var Component = function () {
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = new Group();
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.uid = getUID('viewComponent');
+};
+
+Component.prototype = {
+
+    constructor: Component,
+
+    init: function (ecModel, api) {},
+
+    render: function (componentModel, ecModel, api, payload) {},
+
+    dispose: function () {}
+
+};
+
+var componentProto = Component.prototype;
+componentProto.updateView
+    = componentProto.updateLayout
+    = componentProto.updateVisual
+    = function (seriesModel, ecModel, api, payload) {
+        // Do nothing;
+    };
+// Enable Component.extend.
+enableClassExtend(Component);
+
+// Enable capability of registerClass, getClass, hasClass, registerSubTypeDefaulter and so on.
+enableClassManagement(Component, {registerWhenExtend: true});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @return {string} If large mode changed, return string 'reset';
+ */
+var createRenderPlanner = function () {
+    var inner = makeInner();
+
+    return function (seriesModel) {
+        var fields = inner(seriesModel);
+        var pipelineContext = seriesModel.pipelineContext;
+
+        var originalLarge = fields.large;
+        var originalProgressive = fields.progressiveRender;
+
+        var large = fields.large = pipelineContext.large;
+        var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+
+        return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$5 = makeInner();
+var renderPlanner = createRenderPlanner();
+
+function Chart() {
+
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = new Group();
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.uid = getUID('viewChart');
+
+    this.renderTask = createTask({
+        plan: renderTaskPlan,
+        reset: renderTaskReset
+    });
+    this.renderTask.context = {view: this};
+}
+
+Chart.prototype = {
+
+    type: 'chart',
+
+    /**
+     * Init the chart.
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    init: function (ecModel, api) {},
+
+    /**
+     * Render the chart.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    render: function (seriesModel, ecModel, api, payload) {},
+
+    /**
+     * Highlight series or specified data item.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    highlight: function (seriesModel, ecModel, api, payload) {
+        toggleHighlight(seriesModel.getData(), payload, 'emphasis');
+    },
+
+    /**
+     * Downplay series or specified data item.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    downplay: function (seriesModel, ecModel, api, payload) {
+        toggleHighlight(seriesModel.getData(), payload, 'normal');
+    },
+
+    /**
+     * Remove self.
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    remove: function (ecModel, api) {
+        this.group.removeAll();
+    },
+
+    /**
+     * Dispose self.
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    dispose: function () {},
+
+    /**
+     * Rendering preparation in progressive mode.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    incrementalPrepareRender: null,
+
+    /**
+     * Render in progressive mode.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    incrementalRender: null,
+
+    /**
+     * Update transform directly.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     * @return {Object} {update: true}
+     */
+    updateTransform: null
+
+    /**
+     * The view contains the given point.
+     * @interface
+     * @param {Array.<number>} point
+     * @return {boolean}
+     */
+    // containPoint: function () {}
+
+};
+
+var chartProto = Chart.prototype;
+chartProto.updateView
+    = chartProto.updateLayout
+    = chartProto.updateVisual
+    = function (seriesModel, ecModel, api, payload) {
+        this.render(seriesModel, ecModel, api, payload);
+    };
+
+/**
+ * Set state of single element
+ * @param  {module:zrender/Element} el
+ * @param  {string} state
+ */
+function elSetState(el, state) {
+    if (el) {
+        el.trigger(state);
+        if (el.type === 'group') {
+            for (var i = 0; i < el.childCount(); i++) {
+                elSetState(el.childAt(i), state);
+            }
+        }
+    }
+}
+/**
+ * @param  {module:echarts/data/List} data
+ * @param  {Object} payload
+ * @param  {string} state 'normal'|'emphasis'
+ */
+function toggleHighlight(data, payload, state) {
+    var dataIndex = queryDataIndex(data, payload);
+
+    if (dataIndex != null) {
+        each$1(normalizeToArray(dataIndex), function (dataIdx) {
+            elSetState(data.getItemGraphicEl(dataIdx), state);
+        });
+    }
+    else {
+        data.eachItemGraphicEl(function (el) {
+            elSetState(el, state);
+        });
+    }
+}
+
+// Enable Chart.extend.
+enableClassExtend(Chart, ['dispose']);
+
+// Add capability of registerClass, getClass, hasClass, registerSubTypeDefaulter and so on.
+enableClassManagement(Chart, {registerWhenExtend: true});
+
+Chart.markUpdateMethod = function (payload, methodName) {
+    inner$5(payload).updateMethod = methodName;
+};
+
+function renderTaskPlan(context) {
+    return renderPlanner(context.model);
+}
+
+function renderTaskReset(context) {
+    var seriesModel = context.model;
+    var ecModel = context.ecModel;
+    var api = context.api;
+    var payload = context.payload;
+    // ???! remove updateView updateVisual
+    var progressiveRender = seriesModel.pipelineContext.progressiveRender;
+    var view = context.view;
+
+    var updateMethod = payload && inner$5(payload).updateMethod;
+    var methodName = progressiveRender
+        ? 'incrementalPrepareRender'
+        : (updateMethod && view[updateMethod])
+        ? updateMethod
+        // `appendData` is also supported when data amount
+        // is less than progressive threshold.
+        : 'render';
+
+    if (methodName !== 'render') {
+        view[methodName](seriesModel, ecModel, api, payload);
+    }
+
+    return progressMethodMap[methodName];
+}
+
+var progressMethodMap = {
+    incrementalPrepareRender: {
+        progress: function (params, context) {
+            context.view.incrementalRender(
+                params, context.model, context.ecModel, context.api, context.payload
+            );
+        }
+    },
+    render: {
+        // Put view.render in `progress` to support appendData. But in this case
+        // view.render should not be called in reset, otherwise it will be called
+        // twise. Use `forceFirstProgress` to make sure that view.render is called
+        // in any cases.
+        forceFirstProgress: true,
+        progress: function (params, context) {
+            context.view.render(
+                context.model, context.ecModel, context.api, context.payload
+            );
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var ORIGIN_METHOD = '\0__throttleOriginMethod';
+var RATE = '\0__throttleRate';
+var THROTTLE_TYPE = '\0__throttleType';
+
+/**
+ * @public
+ * @param {(Function)} fn
+ * @param {number} [delay=0] Unit: ms.
+ * @param {boolean} [debounce=false]
+ *        true: If call interval less than `delay`, only the last call works.
+ *        false: If call interval less than `delay, call works on fixed rate.
+ * @return {(Function)} throttled fn.
+ */
+function throttle(fn, delay, debounce) {
+
+    var currCall;
+    var lastCall = 0;
+    var lastExec = 0;
+    var timer = null;
+    var diff;
+    var scope;
+    var args;
+    var debounceNextCall;
+
+    delay = delay || 0;
+
+    function exec() {
+        lastExec = (new Date()).getTime();
+        timer = null;
+        fn.apply(scope, args || []);
+    }
+
+    var cb = function () {
+        currCall = (new Date()).getTime();
+        scope = this;
+        args = arguments;
+        var thisDelay = debounceNextCall || delay;
+        var thisDebounce = debounceNextCall || debounce;
+        debounceNextCall = null;
+        diff = currCall - (thisDebounce ? lastCall : lastExec) - thisDelay;
+
+        clearTimeout(timer);
+
+        // Here we should make sure that: the `exec` SHOULD NOT be called later
+        // than a new call of `cb`, that is, preserving the command order. Consider
+        // calculating "scale rate" when roaming as an example. When a call of `cb`
+        // happens, either the `exec` is called dierectly, or the call is delayed.
+        // But the delayed call should never be later than next call of `cb`. Under
+        // this assurance, we can simply update view state each time `dispatchAction`
+        // triggered by user roaming, but not need to add extra code to avoid the
+        // state being "rolled-back".
+        if (thisDebounce) {
+            timer = setTimeout(exec, thisDelay);
+        }
+        else {
+            if (diff >= 0) {
+                exec();
+            }
+            else {
+                timer = setTimeout(exec, -diff);
+            }
+        }
+
+        lastCall = currCall;
+    };
+
+    /**
+     * Clear throttle.
+     * @public
+     */
+    cb.clear = function () {
+        if (timer) {
+            clearTimeout(timer);
+            timer = null;
+        }
+    };
+
+    /**
+     * Enable debounce once.
+     */
+    cb.debounceNextCall = function (debounceDelay) {
+        debounceNextCall = debounceDelay;
+    };
+
+    return cb;
+}
+
+/**
+ * Create throttle method or update throttle rate.
+ *
+ * @example
+ * ComponentView.prototype.render = function () {
+ *     ...
+ *     throttle.createOrUpdate(
+ *         this,
+ *         '_dispatchAction',
+ *         this.model.get('throttle'),
+ *         'fixRate'
+ *     );
+ * };
+ * ComponentView.prototype.remove = function () {
+ *     throttle.clear(this, '_dispatchAction');
+ * };
+ * ComponentView.prototype.dispose = function () {
+ *     throttle.clear(this, '_dispatchAction');
+ * };
+ *
+ * @public
+ * @param {Object} obj
+ * @param {string} fnAttr
+ * @param {number} [rate]
+ * @param {string} [throttleType='fixRate'] 'fixRate' or 'debounce'
+ * @return {Function} throttled function.
+ */
+function createOrUpdate(obj, fnAttr, rate, throttleType) {
+    var fn = obj[fnAttr];
+
+    if (!fn) {
+        return;
+    }
+
+    var originFn = fn[ORIGIN_METHOD] || fn;
+    var lastThrottleType = fn[THROTTLE_TYPE];
+    var lastRate = fn[RATE];
+
+    if (lastRate !== rate || lastThrottleType !== throttleType) {
+        if (rate == null || !throttleType) {
+            return (obj[fnAttr] = originFn);
+        }
+
+        fn = obj[fnAttr] = throttle(
+            originFn, rate, throttleType === 'debounce'
+        );
+        fn[ORIGIN_METHOD] = originFn;
+        fn[THROTTLE_TYPE] = throttleType;
+        fn[RATE] = rate;
+    }
+
+    return fn;
+}
+
+/**
+ * Clear throttle. Example see throttle.createOrUpdate.
+ *
+ * @public
+ * @param {Object} obj
+ * @param {string} fnAttr
+ */
+function clear(obj, fnAttr) {
+    var fn = obj[fnAttr];
+    if (fn && fn[ORIGIN_METHOD]) {
+        obj[fnAttr] = fn[ORIGIN_METHOD];
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var seriesColor = {
+    createOnAllSeries: true,
+    performRawSeries: true,
+    reset: function (seriesModel, ecModel) {
+        var data = seriesModel.getData();
+        var colorAccessPath = (seriesModel.visualColorAccessPath || 'itemStyle.color').split('.');
+        var color = seriesModel.get(colorAccessPath) // Set in itemStyle
+            || seriesModel.getColorFromPalette(
+                // TODO series count changed.
+                seriesModel.name, null, ecModel.getSeriesCount()
+            );  // Default color
+
+        // FIXME Set color function or use the platte color
+        data.setVisual('color', color);
+
+        // Only visible series has each data be visual encoded
+        if (!ecModel.isSeriesFiltered(seriesModel)) {
+            if (typeof color === 'function' && !(color instanceof Gradient)) {
+                data.each(function (idx) {
+                    data.setItemVisual(
+                        idx, 'color', color(seriesModel.getDataParams(idx))
+                    );
+                });
+            }
+
+            // itemStyle in each data item
+            var dataEach = function (data, idx) {
+                var itemModel = data.getItemModel(idx);
+                var color = itemModel.get(colorAccessPath, true);
+                if (color != null) {
+                    data.setItemVisual(idx, 'color', color);
+                }
+            };
+
+            return { dataEach: data.hasItemOption ? dataEach : null };
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var lang = {
+    toolbox: {
+        brush: {
+            title: {
+                rect: '矩形选择',
+                polygon: '圈选',
+                lineX: '横向选择',
+                lineY: '纵向选择',
+                keep: '保持选择',
+                clear: '清除选择'
+            }
+        },
+        dataView: {
+            title: '数据视图',
+            lang: ['数据视图', '关闭', '刷新']
+        },
+        dataZoom: {
+            title: {
+                zoom: '区域缩放',
+                back: '区域缩放还原'
+            }
+        },
+        magicType: {
+            title: {
+                line: '切换为折线图',
+                bar: '切换为柱状图',
+                stack: '切换为堆叠',
+                tiled: '切换为平铺'
+            }
+        },
+        restore: {
+            title: '还原'
+        },
+        saveAsImage: {
+            title: '保存为图片',
+            lang: ['右键另存为图片']
+        }
+    },
+    series: {
+        typeNames: {
+            pie: '饼图',
+            bar: '柱状图',
+            line: '折线图',
+            scatter: '散点图',
+            effectScatter: '涟漪散点图',
+            radar: '雷达图',
+            tree: '树图',
+            treemap: '矩形树图',
+            boxplot: '箱型图',
+            candlestick: 'K线图',
+            k: 'K线图',
+            heatmap: '热力图',
+            map: '地图',
+            parallel: '平行坐标图',
+            lines: '线图',
+            graph: '关系图',
+            sankey: '桑基图',
+            funnel: '漏斗图',
+            gauge: '仪表盘图',
+            pictorialBar: '象形柱图',
+            themeRiver: '主题河流图',
+            sunburst: '旭日图'
+        }
+    },
+    aria: {
+        general: {
+            withTitle: '这是一个关于“{title}”的图表。',
+            withoutTitle: '这是一个图表，'
+        },
+        series: {
+            single: {
+                prefix: '',
+                withName: '图表类型是{seriesType}，表示{seriesName}。',
+                withoutName: '图表类型是{seriesType}。'
+            },
+            multiple: {
+                prefix: '它由{seriesCount}个图表系列组成。',
+                withName: '第{seriesId}个系列是一个表示{seriesName}的{seriesType}，',
+                withoutName: '第{seriesId}个系列是一个{seriesType}，',
+                separator: {
+                    middle: '；',
+                    end: '。'
+                }
+            }
+        },
+        data: {
+            allData: '其数据是——',
+            partialData: '其中，前{displayCnt}项是——',
+            withName: '{name}的数据是{value}',
+            withoutName: '{value}',
+            separator: {
+                middle: '，',
+                end: ''
+            }
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var aria = function (dom, ecModel) {
+    var ariaModel = ecModel.getModel('aria');
+    if (!ariaModel.get('show')) {
+        return;
+    }
+    else if (ariaModel.get('description')) {
+        dom.setAttribute('aria-label', ariaModel.get('description'));
+        return;
+    }
+
+    var seriesCnt = 0;
+    ecModel.eachSeries(function (seriesModel, idx) {
+        ++seriesCnt;
+    }, this);
+
+    var maxDataCnt = ariaModel.get('data.maxCount') || 10;
+    var maxSeriesCnt = ariaModel.get('series.maxCount') || 10;
+    var displaySeriesCnt = Math.min(seriesCnt, maxSeriesCnt);
+
+    var ariaLabel;
+    if (seriesCnt < 1) {
+        // No series, no aria label
+        return;
+    }
+    else {
+        var title = getTitle();
+        if (title) {
+            ariaLabel = replace(getConfig('general.withTitle'), {
+                title: title
+            });
+        }
+        else {
+            ariaLabel = getConfig('general.withoutTitle');
+        }
+
+        var seriesLabels = [];
+        var prefix = seriesCnt > 1
+            ? 'series.multiple.prefix'
+            : 'series.single.prefix';
+        ariaLabel += replace(getConfig(prefix), { seriesCount: seriesCnt });
+
+        ecModel.eachSeries(function (seriesModel, idx) {
+            if (idx < displaySeriesCnt) {
+                var seriesLabel;
+
+                var seriesName = seriesModel.get('name');
+                var seriesTpl = 'series.'
+                    + (seriesCnt > 1 ? 'multiple' : 'single') + '.';
+                seriesLabel = getConfig(seriesName
+                    ? seriesTpl + 'withName'
+                    : seriesTpl + 'withoutName');
+
+                seriesLabel = replace(seriesLabel, {
+                    seriesId: seriesModel.seriesIndex,
+                    seriesName: seriesModel.get('name'),
+                    seriesType: getSeriesTypeName(seriesModel.subType)
+                });
+
+                var data = seriesModel.getData();
+                window.data = data;
+                if (data.count() > maxDataCnt) {
+                    // Show part of data
+                    seriesLabel += replace(getConfig('data.partialData'), {
+                        displayCnt: maxDataCnt
+                    });
+                }
+                else {
+                    seriesLabel += getConfig('data.allData');
+                }
+
+                var dataLabels = [];
+                for (var i = 0; i < data.count(); i++) {
+                    if (i < maxDataCnt) {
+                        var name = data.getName(i);
+                        var value = retrieveRawValue(data, i);
+                        dataLabels.push(
+                            replace(
+                                name
+                                    ? getConfig('data.withName')
+                                    : getConfig('data.withoutName'),
+                                {
+                                    name: name,
+                                    value: value
+                                }
+                            )
+                        );
+                    }
+                }
+                seriesLabel += dataLabels
+                    .join(getConfig('data.separator.middle'))
+                    + getConfig('data.separator.end');
+
+                seriesLabels.push(seriesLabel);
+            }
+        });
+
+        ariaLabel += seriesLabels
+            .join(getConfig('series.multiple.separator.middle'))
+            + getConfig('series.multiple.separator.end');
+
+        dom.setAttribute('aria-label', ariaLabel);
+    }
+
+    function replace(str, keyValues) {
+        if (typeof str !== 'string') {
+            return str;
+        }
+
+        var result = str;
+        each$1(keyValues, function (value, key) {
+            result = result.replace(
+                new RegExp('\\{\\s*' + key + '\\s*\\}', 'g'),
+                value
+            );
+        });
+        return result;
+    }
+
+    function getConfig(path) {
+        var userConfig = ariaModel.get(path);
+        if (userConfig == null) {
+            var pathArr = path.split('.');
+            var result = lang.aria;
+            for (var i = 0; i < pathArr.length; ++i) {
+                result = result[pathArr[i]];
+            }
+            return result;
+        }
+        else {
+            return userConfig;
+        }
+    }
+
+    function getTitle() {
+        var title = ecModel.getModel('title').option;
+        if (title && title.length) {
+            title = title[0];
+        }
+        return title && title.text;
+    }
+
+    function getSeriesTypeName(type) {
+        return lang.series.typeNames[type] || '自定义图';
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PI$1 = Math.PI;
+
+/**
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Object} [opts]
+ * @param {string} [opts.text]
+ * @param {string} [opts.color]
+ * @param {string} [opts.textColor]
+ * @return {module:zrender/Element}
+ */
+var loadingDefault = function (api, opts) {
+    opts = opts || {};
+    defaults(opts, {
+        text: 'loading',
+        color: '#c23531',
+        textColor: '#000',
+        maskColor: 'rgba(255, 255, 255, 0.8)',
+        zlevel: 0
+    });
+    var mask = new Rect({
+        style: {
+            fill: opts.maskColor
+        },
+        zlevel: opts.zlevel,
+        z: 10000
+    });
+    var arc = new Arc({
+        shape: {
+            startAngle: -PI$1 / 2,
+            endAngle: -PI$1 / 2 + 0.1,
+            r: 10
+        },
+        style: {
+            stroke: opts.color,
+            lineCap: 'round',
+            lineWidth: 5
+        },
+        zlevel: opts.zlevel,
+        z: 10001
+    });
+    var labelRect = new Rect({
+        style: {
+            fill: 'none',
+            text: opts.text,
+            textPosition: 'right',
+            textDistance: 10,
+            textFill: opts.textColor
+        },
+        zlevel: opts.zlevel,
+        z: 10001
+    });
+
+    arc.animateShape(true)
+        .when(1000, {
+            endAngle: PI$1 * 3 / 2
+        })
+        .start('circularInOut');
+    arc.animateShape(true)
+        .when(1000, {
+            startAngle: PI$1 * 3 / 2
+        })
+        .delay(300)
+        .start('circularInOut');
+
+    var group = new Group();
+    group.add(arc);
+    group.add(labelRect);
+    group.add(mask);
+    // Inject resize
+    group.resize = function () {
+        var cx = api.getWidth() / 2;
+        var cy = api.getHeight() / 2;
+        arc.setShape({
+            cx: cx,
+            cy: cy
+        });
+        var r = arc.shape.r;
+        labelRect.setShape({
+            x: cx - r,
+            y: cy - r,
+            width: r * 2,
+            height: r * 2
+        });
+
+        mask.setShape({
+            x: 0,
+            y: 0,
+            width: api.getWidth(),
+            height: api.getHeight()
+        });
+    };
+    group.resize();
+    return group;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/stream/Scheduler
+ */
+
+/**
+ * @constructor
+ */
+function Scheduler(ecInstance, api, dataProcessorHandlers, visualHandlers) {
+    this.ecInstance = ecInstance;
+    this.api = api;
+    this.unfinished;
+
+    // Fix current processors in case that in some rear cases that
+    // processors might be registered after echarts instance created.
+    // Register processors incrementally for a echarts instance is
+    // not supported by this stream architecture.
+    var dataProcessorHandlers = this._dataProcessorHandlers = dataProcessorHandlers.slice();
+    var visualHandlers = this._visualHandlers = visualHandlers.slice();
+    this._allHandlers = dataProcessorHandlers.concat(visualHandlers);
+
+    /**
+     * @private
+     * @type {
+     *     [handlerUID: string]: {
+     *         seriesTaskMap?: {
+     *             [seriesUID: string]: Task
+     *         },
+     *         overallTask?: Task
+     *     }
+     * }
+     */
+    this._stageTaskMap = createHashMap();
+}
+
+var proto = Scheduler.prototype;
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} payload
+ */
+proto.restoreData = function (ecModel, payload) {
+    // TODO: Only restroe needed series and components, but not all components.
+    // Currently `restoreData` of all of the series and component will be called.
+    // But some independent components like `title`, `legend`, `graphic`, `toolbox`,
+    // `tooltip`, `axisPointer`, etc, do not need series refresh when `setOption`,
+    // and some components like coordinate system, axes, dataZoom, visualMap only
+    // need their target series refresh.
+    // (1) If we are implementing this feature some day, we should consider these cases:
+    // if a data processor depends on a component (e.g., dataZoomProcessor depends
+    // on the settings of `dataZoom`), it should be re-performed if the component
+    // is modified by `setOption`.
+    // (2) If a processor depends on sevral series, speicified by its `getTargetSeries`,
+    // it should be re-performed when the result array of `getTargetSeries` changed.
+    // We use `dependencies` to cover these issues.
+    // (3) How to update target series when coordinate system related components modified.
+
+    // TODO: simply the dirty mechanism? Check whether only the case here can set tasks dirty,
+    // and this case all of the tasks will be set as dirty.
+
+    ecModel.restoreData(payload);
+
+    // Theoretically an overall task not only depends on each of its target series, but also
+    // depends on all of the series.
+    // The overall task is not in pipeline, and `ecModel.restoreData` only set pipeline tasks
+    // dirty. If `getTargetSeries` of an overall task returns nothing, we should also ensure
+    // that the overall task is set as dirty and to be performed, otherwise it probably cause
+    // state chaos. So we have to set dirty of all of the overall tasks manually, otherwise it
+    // probably cause state chaos (consider `dataZoomProcessor`).
+    this._stageTaskMap.each(function (taskRecord) {
+        var overallTask = taskRecord.overallTask;
+        overallTask && overallTask.dirty();
+    });
+};
+
+// If seriesModel provided, incremental threshold is check by series data.
+proto.getPerformArgs = function (task, isBlock) {
+    // For overall task
+    if (!task.__pipeline) {
+        return;
+    }
+
+    var pipeline = this._pipelineMap.get(task.__pipeline.id);
+    var pCtx = pipeline.context;
+    var incremental = !isBlock
+        && pipeline.progressiveEnabled
+        && (!pCtx || pCtx.progressiveRender)
+        && task.__idxInPipeline > pipeline.blockIndex;
+
+    var step = incremental ? pipeline.step : null;
+    var modDataCount = pCtx && pCtx.modDataCount;
+    var modBy = modDataCount != null ? Math.ceil(modDataCount / step): null;
+
+    return {step: step, modBy: modBy, modDataCount: modDataCount};
+};
+
+proto.getPipeline = function (pipelineId) {
+    return this._pipelineMap.get(pipelineId);
+};
+
+/**
+ * Current, progressive rendering starts from visual and layout.
+ * Always detect render mode in the same stage, avoiding that incorrect
+ * detection caused by data filtering.
+ * Caution:
+ * `updateStreamModes` use `seriesModel.getData()`.
+ */
+proto.updateStreamModes = function (seriesModel, view) {
+    var pipeline = this._pipelineMap.get(seriesModel.uid);
+    var data = seriesModel.getData();
+    var dataLen = data.count();
+
+    // `progressiveRender` means that can render progressively in each
+    // animation frame. Note that some types of series do not provide
+    // `view.incrementalPrepareRender` but support `chart.appendData`. We
+    // use the term `incremental` but not `progressive` to describe the
+    // case that `chart.appendData`.
+    var progressiveRender = pipeline.progressiveEnabled
+        && view.incrementalPrepareRender
+        && dataLen >= pipeline.threshold;
+
+    var large = seriesModel.get('large') && dataLen >= seriesModel.get('largeThreshold');
+
+    // TODO: modDataCount should not updated if `appendData`, otherwise cause whole repaint.
+    // see `test/candlestick-large3.html`
+    var modDataCount = seriesModel.get('progressiveChunkMode') === 'mod' ? dataLen : null;
+
+    seriesModel.pipelineContext = pipeline.context = {
+        progressiveRender: progressiveRender,
+        modDataCount: modDataCount,
+        large: large
+    };
+};
+
+proto.restorePipelines = function (ecModel) {
+    var scheduler = this;
+    var pipelineMap = scheduler._pipelineMap = createHashMap();
+
+    ecModel.eachSeries(function (seriesModel) {
+        var progressive = seriesModel.getProgressive();
+        var pipelineId = seriesModel.uid;
+
+        pipelineMap.set(pipelineId, {
+            id: pipelineId,
+            head: null,
+            tail: null,
+            threshold: seriesModel.getProgressiveThreshold(),
+            progressiveEnabled: progressive
+                && !(seriesModel.preventIncremental && seriesModel.preventIncremental()),
+            blockIndex: -1,
+            step: Math.round(progressive || 700),
+            count: 0
+        });
+
+        pipe(scheduler, seriesModel, seriesModel.dataTask);
+    });
+};
+
+proto.prepareStageTasks = function () {
+    var stageTaskMap = this._stageTaskMap;
+    var ecModel = this.ecInstance.getModel();
+    var api = this.api;
+
+    each$1(this._allHandlers, function (handler) {
+        var record = stageTaskMap.get(handler.uid) || stageTaskMap.set(handler.uid, []);
+
+        handler.reset && createSeriesStageTask(this, handler, record, ecModel, api);
+        handler.overallReset && createOverallStageTask(this, handler, record, ecModel, api);
+    }, this);
+};
+
+proto.prepareView = function (view, model, ecModel, api) {
+    var renderTask = view.renderTask;
+    var context = renderTask.context;
+
+    context.model = model;
+    context.ecModel = ecModel;
+    context.api = api;
+
+    renderTask.__block = !view.incrementalPrepareRender;
+
+    pipe(this, model, renderTask);
+};
+
+
+proto.performDataProcessorTasks = function (ecModel, payload) {
+    // If we do not use `block` here, it should be considered when to update modes.
+    performStageTasks(this, this._dataProcessorHandlers, ecModel, payload, {block: true});
+};
+
+// opt
+// opt.visualType: 'visual' or 'layout'
+// opt.setDirty
+proto.performVisualTasks = function (ecModel, payload, opt) {
+    performStageTasks(this, this._visualHandlers, ecModel, payload, opt);
+};
+
+function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
+    opt = opt || {};
+    var unfinished;
+
+    each$1(stageHandlers, function (stageHandler, idx) {
+        if (opt.visualType && opt.visualType !== stageHandler.visualType) {
+            return;
+        }
+
+        var stageHandlerRecord = scheduler._stageTaskMap.get(stageHandler.uid);
+        var seriesTaskMap = stageHandlerRecord.seriesTaskMap;
+        var overallTask = stageHandlerRecord.overallTask;
+
+        if (overallTask) {
+            var overallNeedDirty;
+            var agentStubMap = overallTask.agentStubMap;
+            agentStubMap.each(function (stub) {
+                if (needSetDirty(opt, stub)) {
+                    stub.dirty();
+                    overallNeedDirty = true;
+                }
+            });
+            overallNeedDirty && overallTask.dirty();
+            updatePayload(overallTask, payload);
+            var performArgs = scheduler.getPerformArgs(overallTask, opt.block);
+            // Execute stubs firstly, which may set the overall task dirty,
+            // then execute the overall task. And stub will call seriesModel.setData,
+            // which ensures that in the overallTask seriesModel.getData() will not
+            // return incorrect data.
+            agentStubMap.each(function (stub) {
+                stub.perform(performArgs);
+            });
+            unfinished |= overallTask.perform(performArgs);
+        }
+        else if (seriesTaskMap) {
+            seriesTaskMap.each(function (task, pipelineId) {
+                if (needSetDirty(opt, task)) {
+                    task.dirty();
+                }
+                var performArgs = scheduler.getPerformArgs(task, opt.block);
+                performArgs.skip = !stageHandler.performRawSeries
+                    && ecModel.isSeriesFiltered(task.context.model);
+                updatePayload(task, payload);
+                unfinished |= task.perform(performArgs);
+            });
+        }
+    });
+
+    function needSetDirty(opt, task) {
+        return opt.setDirty && (!opt.dirtyMap || opt.dirtyMap.get(task.__pipeline.id));
+    }
+
+    scheduler.unfinished |= unfinished;
+}
+
+proto.performSeriesTasks = function (ecModel) {
+    var unfinished;
+
+    ecModel.eachSeries(function (seriesModel) {
+        // Progress to the end for dataInit and dataRestore.
+        unfinished |= seriesModel.dataTask.perform();
+    });
+
+    this.unfinished |= unfinished;
+};
+
+proto.plan = function () {
+    // Travel pipelines, check block.
+    this._pipelineMap.each(function (pipeline) {
+        var task = pipeline.tail;
+        do {
+            if (task.__block) {
+                pipeline.blockIndex = task.__idxInPipeline;
+                break;
+            }
+            task = task.getUpstream();
+        }
+        while (task);
+    });
+};
+
+var updatePayload = proto.updatePayload = function (task, payload) {
+    payload !== 'remain' && (task.context.payload = payload);
+};
+
+function createSeriesStageTask(scheduler, stageHandler, stageHandlerRecord, ecModel, api) {
+    var seriesTaskMap = stageHandlerRecord.seriesTaskMap
+        || (stageHandlerRecord.seriesTaskMap = createHashMap());
+    var seriesType = stageHandler.seriesType;
+    var getTargetSeries = stageHandler.getTargetSeries;
+
+    // If a stageHandler should cover all series, `createOnAllSeries` should be declared mandatorily,
+    // to avoid some typo or abuse. Otherwise if an extension do not specify a `seriesType`,
+    // it works but it may cause other irrelevant charts blocked.
+    if (stageHandler.createOnAllSeries) {
+        ecModel.eachRawSeries(create);
+    }
+    else if (seriesType) {
+        ecModel.eachRawSeriesByType(seriesType, create);
+    }
+    else if (getTargetSeries) {
+        getTargetSeries(ecModel, api).each(create);
+    }
+
+    function create(seriesModel) {
+        var pipelineId = seriesModel.uid;
+
+        // Init tasks for each seriesModel only once.
+        // Reuse original task instance.
+        var task = seriesTaskMap.get(pipelineId)
+            || seriesTaskMap.set(pipelineId, createTask({
+                plan: seriesTaskPlan,
+                reset: seriesTaskReset,
+                count: seriesTaskCount
+            }));
+        task.context = {
+            model: seriesModel,
+            ecModel: ecModel,
+            api: api,
+            useClearVisual: stageHandler.isVisual && !stageHandler.isLayout,
+            plan: stageHandler.plan,
+            reset: stageHandler.reset,
+            scheduler: scheduler
+        };
+        pipe(scheduler, seriesModel, task);
+    }
+
+    // Clear unused series tasks.
+    var pipelineMap = scheduler._pipelineMap;
+    seriesTaskMap.each(function (task, pipelineId) {
+        if (!pipelineMap.get(pipelineId)) {
+            task.dispose();
+            seriesTaskMap.removeKey(pipelineId);
+        }
+    });
+}
+
+function createOverallStageTask(scheduler, stageHandler, stageHandlerRecord, ecModel, api) {
+    var overallTask = stageHandlerRecord.overallTask = stageHandlerRecord.overallTask
+        // For overall task, the function only be called on reset stage.
+        || createTask({reset: overallTaskReset});
+
+    overallTask.context = {
+        ecModel: ecModel,
+        api: api,
+        overallReset: stageHandler.overallReset,
+        scheduler: scheduler
+    };
+
+    // Reuse orignal stubs.
+    var agentStubMap = overallTask.agentStubMap = overallTask.agentStubMap || createHashMap();
+
+    var seriesType = stageHandler.seriesType;
+    var getTargetSeries = stageHandler.getTargetSeries;
+    var overallProgress = true;
+    var modifyOutputEnd = stageHandler.modifyOutputEnd;
+
+    // An overall task with seriesType detected or has `getTargetSeries`, we add
+    // stub in each pipelines, it will set the overall task dirty when the pipeline
+    // progress. Moreover, to avoid call the overall task each frame (too frequent),
+    // we set the pipeline block.
+    if (seriesType) {
+        ecModel.eachRawSeriesByType(seriesType, createStub);
+    }
+    else if (getTargetSeries) {
+        getTargetSeries(ecModel, api).each(createStub);
+    }
+    // Otherwise, (usually it is legancy case), the overall task will only be
+    // executed when upstream dirty. Otherwise the progressive rendering of all
+    // pipelines will be disabled unexpectedly. But it still needs stubs to receive
+    // dirty info from upsteam.
+    else {
+        overallProgress = false;
+        each$1(ecModel.getSeries(), createStub);
+    }
+
+    function createStub(seriesModel) {
+        var pipelineId = seriesModel.uid;
+        var stub = agentStubMap.get(pipelineId);
+        if (!stub) {
+            stub = agentStubMap.set(pipelineId, createTask(
+                {reset: stubReset, onDirty: stubOnDirty}
+            ));
+            // When the result of `getTargetSeries` changed, the overallTask
+            // should be set as dirty and re-performed.
+            overallTask.dirty();
+        }
+        stub.context = {
+            model: seriesModel,
+            overallProgress: overallProgress,
+            modifyOutputEnd: modifyOutputEnd
+        };
+        stub.agent = overallTask;
+        stub.__block = overallProgress;
+
+        pipe(scheduler, seriesModel, stub);
+    }
+
+    // Clear unused stubs.
+    var pipelineMap = scheduler._pipelineMap;
+    agentStubMap.each(function (stub, pipelineId) {
+        if (!pipelineMap.get(pipelineId)) {
+            stub.dispose();
+            // When the result of `getTargetSeries` changed, the overallTask
+            // should be set as dirty and re-performed.
+            overallTask.dirty();
+            agentStubMap.removeKey(pipelineId);
+        }
+    });
+}
+
+function overallTaskReset(context) {
+    context.overallReset(
+        context.ecModel, context.api, context.payload
+    );
+}
+
+function stubReset(context, upstreamContext) {
+    return context.overallProgress && stubProgress;
+}
+
+function stubProgress() {
+    this.agent.dirty();
+    this.getDownstream().dirty();
+}
+
+function stubOnDirty() {
+    this.agent && this.agent.dirty();
+}
+
+function seriesTaskPlan(context) {
+    return context.plan && context.plan(
+        context.model, context.ecModel, context.api, context.payload
+    );
+}
+
+function seriesTaskReset(context) {
+    if (context.useClearVisual) {
+        context.data.clearAllVisual();
+    }
+    var resetDefines = context.resetDefines = normalizeToArray(context.reset(
+        context.model, context.ecModel, context.api, context.payload
+    ));
+    return resetDefines.length > 1
+        ? map(resetDefines, function (v, idx) {
+            return makeSeriesTaskProgress(idx);
+        })
+        : singleSeriesTaskProgress;
+}
+
+var singleSeriesTaskProgress = makeSeriesTaskProgress(0);
+
+function makeSeriesTaskProgress(resetDefineIdx) {
+    return function (params, context) {
+        var data = context.data;
+        var resetDefine = context.resetDefines[resetDefineIdx];
+
+        if (resetDefine && resetDefine.dataEach) {
+            for (var i = params.start; i < params.end; i++) {
+                resetDefine.dataEach(data, i);
+            }
+        }
+        else if (resetDefine && resetDefine.progress) {
+            resetDefine.progress(params, data);
+        }
+    };
+}
+
+function seriesTaskCount(context) {
+    return context.data.count();
+}
+
+function pipe(scheduler, seriesModel, task) {
+    var pipelineId = seriesModel.uid;
+    var pipeline = scheduler._pipelineMap.get(pipelineId);
+    !pipeline.head && (pipeline.head = task);
+    pipeline.tail && pipeline.tail.pipe(task);
+    pipeline.tail = task;
+    task.__idxInPipeline = pipeline.count++;
+    task.__pipeline = pipeline;
+}
+
+Scheduler.wrapStageHandler = function (stageHandler, visualType) {
+    if (isFunction$1(stageHandler)) {
+        stageHandler = {
+            overallReset: stageHandler,
+            seriesType: detectSeriseType(stageHandler)
+        };
+    }
+
+    stageHandler.uid = getUID('stageHandler');
+    visualType && (stageHandler.visualType = visualType);
+
+    return stageHandler;
+};
+
+
+
+/**
+ * Only some legacy stage handlers (usually in echarts extensions) are pure function.
+ * To ensure that they can work normally, they should work in block mode, that is,
+ * they should not be started util the previous tasks finished. So they cause the
+ * progressive rendering disabled. We try to detect the series type, to narrow down
+ * the block range to only the series type they concern, but not all series.
+ */
+function detectSeriseType(legacyFunc) {
+    seriesType = null;
+    try {
+        // Assume there is no async when calling `eachSeriesByType`.
+        legacyFunc(ecModelMock, apiMock);
+    }
+    catch (e) {
+    }
+    return seriesType;
+}
+
+var ecModelMock = {};
+var apiMock = {};
+var seriesType;
+
+mockMethods(ecModelMock, GlobalModel);
+mockMethods(apiMock, ExtensionAPI);
+ecModelMock.eachSeriesByType = ecModelMock.eachRawSeriesByType = function (type) {
+    seriesType = type;
+};
+ecModelMock.eachComponent = function (cond) {
+    if (cond.mainType === 'series' && cond.subType) {
+        seriesType = cond.subType;
+    }
+};
+
+function mockMethods(target, Clz) {
+    for (var name in Clz.prototype) {
+        // Do not use hasOwnProperty
+        target[name] = noop;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var colorAll = ['#37A2DA', '#32C5E9', '#67E0E3', '#9FE6B8', '#FFDB5C','#ff9f7f', '#fb7293', '#E062AE', '#E690D1', '#e7bcf3', '#9d96f5', '#8378EA', '#96BFFF'];
+
+var lightTheme = {
+
+    color: colorAll,
+
+    colorLayer: [
+        ['#37A2DA', '#ffd85c', '#fd7b5f'],
+        ['#37A2DA', '#67E0E3', '#FFDB5C', '#ff9f7f', '#E062AE', '#9d96f5'],
+        ['#37A2DA', '#32C5E9', '#9FE6B8', '#FFDB5C', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378EA', '#96BFFF'],
+        colorAll
+    ]
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var contrastColor = '#eee';
+var axisCommon = function () {
+    return {
+        axisLine: {
+            lineStyle: {
+                color: contrastColor
+            }
+        },
+        axisTick: {
+            lineStyle: {
+                color: contrastColor
+            }
+        },
+        axisLabel: {
+            textStyle: {
+                color: contrastColor
+            }
+        },
+        splitLine: {
+            lineStyle: {
+                type: 'dashed',
+                color: '#aaa'
+            }
+        },
+        splitArea: {
+            areaStyle: {
+                color: contrastColor
+            }
+        }
+    };
+};
+
+var colorPalette = ['#dd6b66','#759aa0','#e69d87','#8dc1a9','#ea7e53','#eedd78','#73a373','#73b9bc','#7289ab', '#91ca8c','#f49f42'];
+var theme = {
+    color: colorPalette,
+    backgroundColor: '#333',
+    tooltip: {
+        axisPointer: {
+            lineStyle: {
+                color: contrastColor
+            },
+            crossStyle: {
+                color: contrastColor
+            }
+        }
+    },
+    legend: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    textStyle: {
+        color: contrastColor
+    },
+    title: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    toolbox: {
+        iconStyle: {
+            normal: {
+                borderColor: contrastColor
+            }
+        }
+    },
+    dataZoom: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    visualMap: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    timeline: {
+        lineStyle: {
+            color: contrastColor
+        },
+        itemStyle: {
+            normal: {
+                color: colorPalette[1]
+            }
+        },
+        label: {
+            normal: {
+                textStyle: {
+                    color: contrastColor
+                }
+            }
+        },
+        controlStyle: {
+            normal: {
+                color: contrastColor,
+                borderColor: contrastColor
+            }
+        }
+    },
+    timeAxis: axisCommon(),
+    logAxis: axisCommon(),
+    valueAxis: axisCommon(),
+    categoryAxis: axisCommon(),
+
+    line: {
+        symbol: 'circle'
+    },
+    graph: {
+        color: colorPalette
+    },
+    gauge: {
+        title: {
+            textStyle: {
+                color: contrastColor
+            }
+        }
+    },
+    candlestick: {
+        itemStyle: {
+            normal: {
+                color: '#FD1050',
+                color0: '#0CF49B',
+                borderColor: '#FD1050',
+                borderColor0: '#0CF49B'
+            }
+        }
+    }
+};
+theme.categoryAxis.splitLine.show = false;
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * This module is imported by echarts directly.
+ *
+ * Notice:
+ * Always keep this file exists for backward compatibility.
+ * Because before 4.1.0, dataset is an optional component,
+ * some users may import this module manually.
+ */
+
+ComponentModel.extend({
+
+    type: 'dataset',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+
+        // 'row', 'column'
+        seriesLayoutBy: SERIES_LAYOUT_BY_COLUMN,
+
+        // null/'auto': auto detect header, see "module:echarts/data/helper/sourceHelper"
+        sourceHeader: null,
+
+        dimensions: null,
+
+        source: null
+    },
+
+    optionUpdated: function () {
+        detectSourceFormat(this);
+    }
+
+});
+
+Component.extend({
+
+    type: 'dataset'
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+var assert = assert$1;
+var each = each$1;
+var isFunction = isFunction$1;
+var isObject = isObject$1;
+var parseClassType = ComponentModel.parseClassType;
+
+var version = '4.1.0';
+
+var dependencies = {
+    zrender: '4.0.4'
+};
+
+var TEST_FRAME_REMAIN_TIME = 1;
+
+var PRIORITY_PROCESSOR_FILTER = 1000;
+var PRIORITY_PROCESSOR_STATISTIC = 5000;
+
+var PRIORITY_VISUAL_LAYOUT = 1000;
+var PRIORITY_VISUAL_GLOBAL = 2000;
+var PRIORITY_VISUAL_CHART = 3000;
+var PRIORITY_VISUAL_COMPONENT = 4000;
+// FIXME
+// necessary?
+var PRIORITY_VISUAL_BRUSH = 5000;
+
+var PRIORITY = {
+    PROCESSOR: {
+        FILTER: PRIORITY_PROCESSOR_FILTER,
+        STATISTIC: PRIORITY_PROCESSOR_STATISTIC
+    },
+    VISUAL: {
+        LAYOUT: PRIORITY_VISUAL_LAYOUT,
+        GLOBAL: PRIORITY_VISUAL_GLOBAL,
+        CHART: PRIORITY_VISUAL_CHART,
+        COMPONENT: PRIORITY_VISUAL_COMPONENT,
+        BRUSH: PRIORITY_VISUAL_BRUSH
+    }
+};
+
+// Main process have three entries: `setOption`, `dispatchAction` and `resize`,
+// where they must not be invoked nestedly, except the only case: invoke
+// dispatchAction with updateMethod "none" in main process.
+// This flag is used to carry out this rule.
+// All events will be triggered out side main process (i.e. when !this[IN_MAIN_PROCESS]).
+var IN_MAIN_PROCESS = '__flagInMainProcess';
+var OPTION_UPDATED = '__optionUpdated';
+var ACTION_REG = /^[a-zA-Z0-9_]+$/;
+
+
+function createRegisterEventWithLowercaseName(method) {
+    return function (eventName, handler, context) {
+        // Event name is all lowercase
+        eventName = eventName && eventName.toLowerCase();
+        Eventful.prototype[method].call(this, eventName, handler, context);
+    };
+}
+
+/**
+ * @module echarts~MessageCenter
+ */
+function MessageCenter() {
+    Eventful.call(this);
+}
+MessageCenter.prototype.on = createRegisterEventWithLowercaseName('on');
+MessageCenter.prototype.off = createRegisterEventWithLowercaseName('off');
+MessageCenter.prototype.one = createRegisterEventWithLowercaseName('one');
+mixin(MessageCenter, Eventful);
+
+/**
+ * @module echarts~ECharts
+ */
+function ECharts(dom, theme$$1, opts) {
+    opts = opts || {};
+
+    // Get theme by name
+    if (typeof theme$$1 === 'string') {
+        theme$$1 = themeStorage[theme$$1];
+    }
+
+    /**
+     * @type {string}
+     */
+    this.id;
+
+    /**
+     * Group id
+     * @type {string}
+     */
+    this.group;
+
+    /**
+     * @type {HTMLElement}
+     * @private
+     */
+    this._dom = dom;
+
+    var defaultRenderer = 'canvas';
+    if (__DEV__) {
+        defaultRenderer = (
+            typeof window === 'undefined' ? global : window
+        ).__ECHARTS__DEFAULT__RENDERER__ || defaultRenderer;
+    }
+
+    /**
+     * @type {module:zrender/ZRender}
+     * @private
+     */
+    var zr = this._zr = init$1(dom, {
+        renderer: opts.renderer || defaultRenderer,
+        devicePixelRatio: opts.devicePixelRatio,
+        width: opts.width,
+        height: opts.height
+    });
+
+    /**
+     * Expect 60 pfs.
+     * @type {Function}
+     * @private
+     */
+    this._throttledZrFlush = throttle(bind(zr.flush, zr), 17);
+
+    var theme$$1 = clone(theme$$1);
+    theme$$1 && backwardCompat(theme$$1, true);
+    /**
+     * @type {Object}
+     * @private
+     */
+    this._theme = theme$$1;
+
+    /**
+     * @type {Array.<module:echarts/view/Chart>}
+     * @private
+     */
+    this._chartsViews = [];
+
+    /**
+     * @type {Object.<string, module:echarts/view/Chart>}
+     * @private
+     */
+    this._chartsMap = {};
+
+    /**
+     * @type {Array.<module:echarts/view/Component>}
+     * @private
+     */
+    this._componentsViews = [];
+
+    /**
+     * @type {Object.<string, module:echarts/view/Component>}
+     * @private
+     */
+    this._componentsMap = {};
+
+    /**
+     * @type {module:echarts/CoordinateSystem}
+     * @private
+     */
+    this._coordSysMgr = new CoordinateSystemManager();
+
+    /**
+     * @type {module:echarts/ExtensionAPI}
+     * @private
+     */
+    var api = this._api = createExtensionAPI(this);
+
+    // Sort on demand
+    function prioritySortFunc(a, b) {
+        return a.__prio - b.__prio;
+    }
+    sort(visualFuncs, prioritySortFunc);
+    sort(dataProcessorFuncs, prioritySortFunc);
+
+    /**
+     * @type {module:echarts/stream/Scheduler}
+     */
+    this._scheduler = new Scheduler(this, api, dataProcessorFuncs, visualFuncs);
+
+    Eventful.call(this);
+
+    /**
+     * @type {module:echarts~MessageCenter}
+     * @private
+     */
+    this._messageCenter = new MessageCenter();
+
+    // Init mouse events
+    this._initEvents();
+
+    // In case some people write `window.onresize = chart.resize`
+    this.resize = bind(this.resize, this);
+
+    // Can't dispatch action during rendering procedure
+    this._pendingActions = [];
+
+    zr.animation.on('frame', this._onframe, this);
+
+    bindRenderedEvent(zr, this);
+
+    // ECharts instance can be used as value.
+    setAsPrimitive(this);
+}
+
+var echartsProto = ECharts.prototype;
+
+echartsProto._onframe = function () {
+    if (this._disposed) {
+        return;
+    }
+
+    var scheduler = this._scheduler;
+
+    // Lazy update
+    if (this[OPTION_UPDATED]) {
+        var silent = this[OPTION_UPDATED].silent;
+
+        this[IN_MAIN_PROCESS] = true;
+
+        prepare(this);
+        updateMethods.update.call(this);
+
+        this[IN_MAIN_PROCESS] = false;
+
+        this[OPTION_UPDATED] = false;
+
+        flushPendingActions.call(this, silent);
+
+        triggerUpdatedEvent.call(this, silent);
+    }
+    // Avoid do both lazy update and progress in one frame.
+    else if (scheduler.unfinished) {
+        // Stream progress.
+        var remainTime = TEST_FRAME_REMAIN_TIME;
+        var ecModel = this._model;
+        var api = this._api;
+        scheduler.unfinished = false;
+        do {
+            var startTime = +new Date();
+
+            scheduler.performSeriesTasks(ecModel);
+
+            // Currently dataProcessorFuncs do not check threshold.
+            scheduler.performDataProcessorTasks(ecModel);
+
+            updateStreamModes(this, ecModel);
+
+            // Do not update coordinate system here. Because that coord system update in
+            // each frame is not a good user experience. So we follow the rule that
+            // the extent of the coordinate system is determin in the first frame (the
+            // frame is executed immedietely after task reset.
+            // this._coordSysMgr.update(ecModel, api);
+
+            // console.log('--- ec frame visual ---', remainTime);
+            scheduler.performVisualTasks(ecModel);
+
+            renderSeries(this, this._model, api, 'remain');
+
+            remainTime -= (+new Date() - startTime);
+        }
+        while (remainTime > 0 && scheduler.unfinished);
+
+        // Call flush explicitly for trigger finished event.
+        if (!scheduler.unfinished) {
+            this._zr.flush();
+        }
+        // Else, zr flushing be ensue within the same frame,
+        // because zr flushing is after onframe event.
+    }
+};
+
+/**
+ * @return {HTMLElement}
+ */
+echartsProto.getDom = function () {
+    return this._dom;
+};
+
+/**
+ * @return {module:zrender~ZRender}
+ */
+echartsProto.getZr = function () {
+    return this._zr;
+};
+
+/**
+ * Usage:
+ * chart.setOption(option, notMerge, lazyUpdate);
+ * chart.setOption(option, {
+ *     notMerge: ...,
+ *     lazyUpdate: ...,
+ *     silent: ...
+ * });
+ *
+ * @param {Object} option
+ * @param {Object|boolean} [opts] opts or notMerge.
+ * @param {boolean} [opts.notMerge=false]
+ * @param {boolean} [opts.lazyUpdate=false] Useful when setOption frequently.
+ */
+echartsProto.setOption = function (option, notMerge, lazyUpdate) {
+    if (__DEV__) {
+        assert(!this[IN_MAIN_PROCESS], '`setOption` should not be called during main process.');
+    }
+
+    var silent;
+    if (isObject(notMerge)) {
+        lazyUpdate = notMerge.lazyUpdate;
+        silent = notMerge.silent;
+        notMerge = notMerge.notMerge;
+    }
+
+    this[IN_MAIN_PROCESS] = true;
+
+    if (!this._model || notMerge) {
+        var optionManager = new OptionManager(this._api);
+        var theme$$1 = this._theme;
+        var ecModel = this._model = new GlobalModel(null, null, theme$$1, optionManager);
+        ecModel.scheduler = this._scheduler;
+        ecModel.init(null, null, theme$$1, optionManager);
+    }
+
+    this._model.setOption(option, optionPreprocessorFuncs);
+
+    if (lazyUpdate) {
+        this[OPTION_UPDATED] = {silent: silent};
+        this[IN_MAIN_PROCESS] = false;
+    }
+    else {
+        prepare(this);
+
+        updateMethods.update.call(this);
+
+        // Ensure zr refresh sychronously, and then pixel in canvas can be
+        // fetched after `setOption`.
+        this._zr.flush();
+
+        this[OPTION_UPDATED] = false;
+        this[IN_MAIN_PROCESS] = false;
+
+        flushPendingActions.call(this, silent);
+        triggerUpdatedEvent.call(this, silent);
+    }
+};
+
+/**
+ * @DEPRECATED
+ */
+echartsProto.setTheme = function () {
+    console.log('ECharts#setTheme() is DEPRECATED in ECharts 3.0');
+};
+
+/**
+ * @return {module:echarts/model/Global}
+ */
+echartsProto.getModel = function () {
+    return this._model;
+};
+
+/**
+ * @return {Object}
+ */
+echartsProto.getOption = function () {
+    return this._model && this._model.getOption();
+};
+
+/**
+ * @return {number}
+ */
+echartsProto.getWidth = function () {
+    return this._zr.getWidth();
+};
+
+/**
+ * @return {number}
+ */
+echartsProto.getHeight = function () {
+    return this._zr.getHeight();
+};
+
+/**
+ * @return {number}
+ */
+echartsProto.getDevicePixelRatio = function () {
+    return this._zr.painter.dpr || window.devicePixelRatio || 1;
+};
+
+/**
+ * Get canvas which has all thing rendered
+ * @param {Object} opts
+ * @param {string} [opts.backgroundColor]
+ * @return {string}
+ */
+echartsProto.getRenderedCanvas = function (opts) {
+    if (!env$1.canvasSupported) {
+        return;
+    }
+    opts = opts || {};
+    opts.pixelRatio = opts.pixelRatio || 1;
+    opts.backgroundColor = opts.backgroundColor
+        || this._model.get('backgroundColor');
+    var zr = this._zr;
+    // var list = zr.storage.getDisplayList();
+    // Stop animations
+    // Never works before in init animation, so remove it.
+    // zrUtil.each(list, function (el) {
+    //     el.stopAnimation(true);
+    // });
+    return zr.painter.getRenderedCanvas(opts);
+};
+
+/**
+ * Get svg data url
+ * @return {string}
+ */
+echartsProto.getSvgDataUrl = function () {
+    if (!env$1.svgSupported) {
+        return;
+    }
+
+    var zr = this._zr;
+    var list = zr.storage.getDisplayList();
+    // Stop animations
+    each$1(list, function (el) {
+        el.stopAnimation(true);
+    });
+
+    return zr.painter.pathToDataUrl();
+};
+
+/**
+ * @return {string}
+ * @param {Object} opts
+ * @param {string} [opts.type='png']
+ * @param {string} [opts.pixelRatio=1]
+ * @param {string} [opts.backgroundColor]
+ * @param {string} [opts.excludeComponents]
+ */
+echartsProto.getDataURL = function (opts) {
+    opts = opts || {};
+    var excludeComponents = opts.excludeComponents;
+    var ecModel = this._model;
+    var excludesComponentViews = [];
+    var self = this;
+
+    each(excludeComponents, function (componentType) {
+        ecModel.eachComponent({
+            mainType: componentType
+        }, function (component) {
+            var view = self._componentsMap[component.__viewId];
+            if (!view.group.ignore) {
+                excludesComponentViews.push(view);
+                view.group.ignore = true;
+            }
+        });
+    });
+
+    var url = this._zr.painter.getType() === 'svg'
+        ? this.getSvgDataUrl()
+        : this.getRenderedCanvas(opts).toDataURL(
+            'image/' + (opts && opts.type || 'png')
+        );
+
+    each(excludesComponentViews, function (view) {
+        view.group.ignore = false;
+    });
+
+    return url;
+};
+
+
+/**
+ * @return {string}
+ * @param {Object} opts
+ * @param {string} [opts.type='png']
+ * @param {string} [opts.pixelRatio=1]
+ * @param {string} [opts.backgroundColor]
+ */
+echartsProto.getConnectedDataURL = function (opts) {
+    if (!env$1.canvasSupported) {
+        return;
+    }
+    var groupId = this.group;
+    var mathMin = Math.min;
+    var mathMax = Math.max;
+    var MAX_NUMBER = Infinity;
+    if (connectedGroups[groupId]) {
+        var left = MAX_NUMBER;
+        var top = MAX_NUMBER;
+        var right = -MAX_NUMBER;
+        var bottom = -MAX_NUMBER;
+        var canvasList = [];
+        var dpr = (opts && opts.pixelRatio) || 1;
+
+        each$1(instances, function (chart, id) {
+            if (chart.group === groupId) {
+                var canvas = chart.getRenderedCanvas(
+                    clone(opts)
+                );
+                var boundingRect = chart.getDom().getBoundingClientRect();
+                left = mathMin(boundingRect.left, left);
+                top = mathMin(boundingRect.top, top);
+                right = mathMax(boundingRect.right, right);
+                bottom = mathMax(boundingRect.bottom, bottom);
+                canvasList.push({
+                    dom: canvas,
+                    left: boundingRect.left,
+                    top: boundingRect.top
+                });
+            }
+        });
+
+        left *= dpr;
+        top *= dpr;
+        right *= dpr;
+        bottom *= dpr;
+        var width = right - left;
+        var height = bottom - top;
+        var targetCanvas = createCanvas();
+        targetCanvas.width = width;
+        targetCanvas.height = height;
+        var zr = init$1(targetCanvas);
+
+        each(canvasList, function (item) {
+            var img = new ZImage({
+                style: {
+                    x: item.left * dpr - left,
+                    y: item.top * dpr - top,
+                    image: item.dom
+                }
+            });
+            zr.add(img);
+        });
+        zr.refreshImmediately();
+
+        return targetCanvas.toDataURL('image/' + (opts && opts.type || 'png'));
+    }
+    else {
+        return this.getDataURL(opts);
+    }
+};
+
+/**
+ * Convert from logical coordinate system to pixel coordinate system.
+ * See CoordinateSystem#convertToPixel.
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            geoIndex / geoId, geoName,
+ *            bmapIndex / bmapId / bmapName,
+ *            xAxisIndex / xAxisId / xAxisName,
+ *            yAxisIndex / yAxisId / yAxisName,
+ *            gridIndex / gridId / gridName,
+ *            ... (can be extended)
+ *        }
+ * @param {Array|number} value
+ * @return {Array|number} result
+ */
+echartsProto.convertToPixel = curry(doConvertPixel, 'convertToPixel');
+
+/**
+ * Convert from pixel coordinate system to logical coordinate system.
+ * See CoordinateSystem#convertFromPixel.
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            geoIndex / geoId / geoName,
+ *            bmapIndex / bmapId / bmapName,
+ *            xAxisIndex / xAxisId / xAxisName,
+ *            yAxisIndex / yAxisId / yAxisName
+ *            gridIndex / gridId / gridName,
+ *            ... (can be extended)
+ *        }
+ * @param {Array|number} value
+ * @return {Array|number} result
+ */
+echartsProto.convertFromPixel = curry(doConvertPixel, 'convertFromPixel');
+
+function doConvertPixel(methodName, finder, value) {
+    var ecModel = this._model;
+    var coordSysList = this._coordSysMgr.getCoordinateSystems();
+    var result;
+
+    finder = parseFinder(ecModel, finder);
+
+    for (var i = 0; i < coordSysList.length; i++) {
+        var coordSys = coordSysList[i];
+        if (coordSys[methodName]
+            && (result = coordSys[methodName](ecModel, finder, value)) != null
+        ) {
+            return result;
+        }
+    }
+
+    if (__DEV__) {
+        console.warn(
+            'No coordinate system that supports ' + methodName + ' found by the given finder.'
+        );
+    }
+}
+
+/**
+ * Is the specified coordinate systems or components contain the given pixel point.
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            geoIndex / geoId / geoName,
+ *            bmapIndex / bmapId / bmapName,
+ *            xAxisIndex / xAxisId / xAxisName,
+ *            yAxisIndex / yAxisId / yAxisName,
+ *            gridIndex / gridId / gridName,
+ *            ... (can be extended)
+ *        }
+ * @param {Array|number} value
+ * @return {boolean} result
+ */
+echartsProto.containPixel = function (finder, value) {
+    var ecModel = this._model;
+    var result;
+
+    finder = parseFinder(ecModel, finder);
+
+    each$1(finder, function (models, key) {
+        key.indexOf('Models') >= 0 && each$1(models, function (model) {
+            var coordSys = model.coordinateSystem;
+            if (coordSys && coordSys.containPoint) {
+                result |= !!coordSys.containPoint(value);
+            }
+            else if (key === 'seriesModels') {
+                var view = this._chartsMap[model.__viewId];
+                if (view && view.containPoint) {
+                    result |= view.containPoint(value, model);
+                }
+                else {
+                    if (__DEV__) {
+                        console.warn(key + ': ' + (view
+                            ? 'The found component do not support containPoint.'
+                            : 'No view mapping to the found component.'
+                        ));
+                    }
+                }
+            }
+            else {
+                if (__DEV__) {
+                    console.warn(key + ': containPoint is not supported');
+                }
+            }
+        }, this);
+    }, this);
+
+    return !!result;
+};
+
+/**
+ * Get visual from series or data.
+ * @param {string|Object} finder
+ *        If string, e.g., 'series', means {seriesIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            dataIndex / dataIndexInside
+ *        }
+ *        If dataIndex is not specified, series visual will be fetched,
+ *        but not data item visual.
+ *        If all of seriesIndex, seriesId, seriesName are not specified,
+ *        visual will be fetched from first series.
+ * @param {string} visualType 'color', 'symbol', 'symbolSize'
+ */
+echartsProto.getVisual = function (finder, visualType) {
+    var ecModel = this._model;
+
+    finder = parseFinder(ecModel, finder, {defaultMainType: 'series'});
+
+    var seriesModel = finder.seriesModel;
+
+    if (__DEV__) {
+        if (!seriesModel) {
+            console.warn('There is no specified seires model');
+        }
+    }
+
+    var data = seriesModel.getData();
+
+    var dataIndexInside = finder.hasOwnProperty('dataIndexInside')
+        ? finder.dataIndexInside
+        : finder.hasOwnProperty('dataIndex')
+        ? data.indexOfRawIndex(finder.dataIndex)
+        : null;
+
+    return dataIndexInside != null
+        ? data.getItemVisual(dataIndexInside, visualType)
+        : data.getVisual(visualType);
+};
+
+/**
+ * Get view of corresponding component model
+ * @param  {module:echarts/model/Component} componentModel
+ * @return {module:echarts/view/Component}
+ */
+echartsProto.getViewOfComponentModel = function (componentModel) {
+    return this._componentsMap[componentModel.__viewId];
+};
+
+/**
+ * Get view of corresponding series model
+ * @param  {module:echarts/model/Series} seriesModel
+ * @return {module:echarts/view/Chart}
+ */
+echartsProto.getViewOfSeriesModel = function (seriesModel) {
+    return this._chartsMap[seriesModel.__viewId];
+};
+
+var updateMethods = {
+
+    prepareAndUpdate: function (payload) {
+        prepare(this);
+        updateMethods.update.call(this, payload);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    update: function (payload) {
+        // console.profile && console.profile('update');
+
+        var ecModel = this._model;
+        var api = this._api;
+        var zr = this._zr;
+        var coordSysMgr = this._coordSysMgr;
+        var scheduler = this._scheduler;
+
+        // update before setOption
+        if (!ecModel) {
+            return;
+        }
+
+        scheduler.restoreData(ecModel, payload);
+
+        scheduler.performSeriesTasks(ecModel);
+
+        // TODO
+        // Save total ecModel here for undo/redo (after restoring data and before processing data).
+        // Undo (restoration of total ecModel) can be carried out in 'action' or outside API call.
+
+        // Create new coordinate system each update
+        // In LineView may save the old coordinate system and use it to get the orignal point
+        coordSysMgr.create(ecModel, api);
+
+        scheduler.performDataProcessorTasks(ecModel, payload);
+
+        // Current stream render is not supported in data process. So we can update
+        // stream modes after data processing, where the filtered data is used to
+        // deteming whether use progressive rendering.
+        updateStreamModes(this, ecModel);
+
+        // We update stream modes before coordinate system updated, then the modes info
+        // can be fetched when coord sys updating (consider the barGrid extent fix). But
+        // the drawback is the full coord info can not be fetched. Fortunately this full
+        // coord is not requied in stream mode updater currently.
+        coordSysMgr.update(ecModel, api);
+
+        clearColorPalette(ecModel);
+        scheduler.performVisualTasks(ecModel, payload);
+
+        render(this, ecModel, api, payload);
+
+        // Set background
+        var backgroundColor = ecModel.get('backgroundColor') || 'transparent';
+
+        // In IE8
+        if (!env$1.canvasSupported) {
+            var colorArr = parse(backgroundColor);
+            backgroundColor = stringify(colorArr, 'rgb');
+            if (colorArr[3] === 0) {
+                backgroundColor = 'transparent';
+            }
+        }
+        else {
+            zr.setBackgroundColor(backgroundColor);
+        }
+
+        performPostUpdateFuncs(ecModel, api);
+
+        // console.profile && console.profileEnd('update');
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateTransform: function (payload) {
+        var ecModel = this._model;
+        var ecIns = this;
+        var api = this._api;
+
+        // update before setOption
+        if (!ecModel) {
+            return;
+        }
+
+        // ChartView.markUpdateMethod(payload, 'updateTransform');
+
+        var componentDirtyList = [];
+        ecModel.eachComponent(function (componentType, componentModel) {
+            var componentView = ecIns.getViewOfComponentModel(componentModel);
+            if (componentView && componentView.__alive) {
+                if (componentView.updateTransform) {
+                    var result = componentView.updateTransform(componentModel, ecModel, api, payload);
+                    result && result.update && componentDirtyList.push(componentView);
+                }
+                else {
+                    componentDirtyList.push(componentView);
+                }
+            }
+        });
+
+        var seriesDirtyMap = createHashMap();
+        ecModel.eachSeries(function (seriesModel) {
+            var chartView = ecIns._chartsMap[seriesModel.__viewId];
+            if (chartView.updateTransform) {
+                var result = chartView.updateTransform(seriesModel, ecModel, api, payload);
+                result && result.update && seriesDirtyMap.set(seriesModel.uid, 1);
+            }
+            else {
+                seriesDirtyMap.set(seriesModel.uid, 1);
+            }
+        });
+
+        clearColorPalette(ecModel);
+        // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        // this._scheduler.performVisualTasks(ecModel, payload, 'layout', true);
+        this._scheduler.performVisualTasks(
+            ecModel, payload, {setDirty: true, dirtyMap: seriesDirtyMap}
+        );
+
+        // Currently, not call render of components. Geo render cost a lot.
+        // renderComponents(ecIns, ecModel, api, payload, componentDirtyList);
+        renderSeries(ecIns, ecModel, api, payload, seriesDirtyMap);
+
+        performPostUpdateFuncs(ecModel, this._api);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateView: function (payload) {
+        var ecModel = this._model;
+
+        // update before setOption
+        if (!ecModel) {
+            return;
+        }
+
+        Chart.markUpdateMethod(payload, 'updateView');
+
+        clearColorPalette(ecModel);
+
+        // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        this._scheduler.performVisualTasks(ecModel, payload, {setDirty: true});
+
+        render(this, this._model, this._api, payload);
+
+        performPostUpdateFuncs(ecModel, this._api);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateVisual: function (payload) {
+        updateMethods.update.call(this, payload);
+
+        // var ecModel = this._model;
+
+        // // update before setOption
+        // if (!ecModel) {
+        //     return;
+        // }
+
+        // ChartView.markUpdateMethod(payload, 'updateVisual');
+
+        // clearColorPalette(ecModel);
+
+        // // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        // this._scheduler.performVisualTasks(ecModel, payload, {visualType: 'visual', setDirty: true});
+
+        // render(this, this._model, this._api, payload);
+
+        // performPostUpdateFuncs(ecModel, this._api);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateLayout: function (payload) {
+        updateMethods.update.call(this, payload);
+
+        // var ecModel = this._model;
+
+        // // update before setOption
+        // if (!ecModel) {
+        //     return;
+        // }
+
+        // ChartView.markUpdateMethod(payload, 'updateLayout');
+
+        // // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        // // this._scheduler.performVisualTasks(ecModel, payload, 'layout', true);
+        // this._scheduler.performVisualTasks(ecModel, payload, {setDirty: true});
+
+        // render(this, this._model, this._api, payload);
+
+        // performPostUpdateFuncs(ecModel, this._api);
+    }
+};
+
+function prepare(ecIns) {
+    var ecModel = ecIns._model;
+    var scheduler = ecIns._scheduler;
+
+    scheduler.restorePipelines(ecModel);
+
+    scheduler.prepareStageTasks();
+
+    prepareView(ecIns, 'component', ecModel, scheduler);
+
+    prepareView(ecIns, 'chart', ecModel, scheduler);
+
+    scheduler.plan();
+}
+
+/**
+ * @private
+ */
+function updateDirectly(ecIns, method, payload, mainType, subType) {
+    var ecModel = ecIns._model;
+
+    // broadcast
+    if (!mainType) {
+        // FIXME
+        // Chart will not be update directly here, except set dirty.
+        // But there is no such scenario now.
+        each(ecIns._componentsViews.concat(ecIns._chartsViews), callView);
+        return;
+    }
+
+    var query = {};
+    query[mainType + 'Id'] = payload[mainType + 'Id'];
+    query[mainType + 'Index'] = payload[mainType + 'Index'];
+    query[mainType + 'Name'] = payload[mainType + 'Name'];
+
+    var condition = {mainType: mainType, query: query};
+    subType && (condition.subType = subType); // subType may be '' by parseClassType;
+
+    var excludeSeriesId = payload.excludeSeriesId;
+    if (excludeSeriesId != null) {
+        excludeSeriesId = createHashMap(normalizeToArray(excludeSeriesId));
+    }
+
+    // If dispatchAction before setOption, do nothing.
+    ecModel && ecModel.eachComponent(condition, function (model) {
+        if (!excludeSeriesId || excludeSeriesId.get(model.id) == null) {
+            callView(ecIns[
+                mainType === 'series' ? '_chartsMap' : '_componentsMap'
+            ][model.__viewId]);
+        }
+    }, ecIns);
+
+    function callView(view) {
+        view && view.__alive && view[method] && view[method](
+            view.__model, ecModel, ecIns._api, payload
+        );
+    }
+}
+
+/**
+ * Resize the chart
+ * @param {Object} opts
+ * @param {number} [opts.width] Can be 'auto' (the same as null/undefined)
+ * @param {number} [opts.height] Can be 'auto' (the same as null/undefined)
+ * @param {boolean} [opts.silent=false]
+ */
+echartsProto.resize = function (opts) {
+    if (__DEV__) {
+        assert(!this[IN_MAIN_PROCESS], '`resize` should not be called during main process.');
+    }
+
+    this._zr.resize(opts);
+
+    var ecModel = this._model;
+
+    // Resize loading effect
+    this._loadingFX && this._loadingFX.resize();
+
+    if (!ecModel) {
+        return;
+    }
+
+    var optionChanged = ecModel.resetOption('media');
+
+    var silent = opts && opts.silent;
+
+    this[IN_MAIN_PROCESS] = true;
+
+    optionChanged && prepare(this);
+    updateMethods.update.call(this);
+
+    this[IN_MAIN_PROCESS] = false;
+
+    flushPendingActions.call(this, silent);
+
+    triggerUpdatedEvent.call(this, silent);
+};
+
+function updateStreamModes(ecIns, ecModel) {
+    var chartsMap = ecIns._chartsMap;
+    var scheduler = ecIns._scheduler;
+    ecModel.eachSeries(function (seriesModel) {
+        scheduler.updateStreamModes(seriesModel, chartsMap[seriesModel.__viewId]);
+    });
+}
+
+/**
+ * Show loading effect
+ * @param  {string} [name='default']
+ * @param  {Object} [cfg]
+ */
+echartsProto.showLoading = function (name, cfg) {
+    if (isObject(name)) {
+        cfg = name;
+        name = '';
+    }
+    name = name || 'default';
+
+    this.hideLoading();
+    if (!loadingEffects[name]) {
+        if (__DEV__) {
+            console.warn('Loading effects ' + name + ' not exists.');
+        }
+        return;
+    }
+    var el = loadingEffects[name](this._api, cfg);
+    var zr = this._zr;
+    this._loadingFX = el;
+
+    zr.add(el);
+};
+
+/**
+ * Hide loading effect
+ */
+echartsProto.hideLoading = function () {
+    this._loadingFX && this._zr.remove(this._loadingFX);
+    this._loadingFX = null;
+};
+
+/**
+ * @param {Object} eventObj
+ * @return {Object}
+ */
+echartsProto.makeActionFromEvent = function (eventObj) {
+    var payload = extend({}, eventObj);
+    payload.type = eventActionMap[eventObj.type];
+    return payload;
+};
+
+/**
+ * @pubilc
+ * @param {Object} payload
+ * @param {string} [payload.type] Action type
+ * @param {Object|boolean} [opt] If pass boolean, means opt.silent
+ * @param {boolean} [opt.silent=false] Whether trigger events.
+ * @param {boolean} [opt.flush=undefined]
+ *                  true: Flush immediately, and then pixel in canvas can be fetched
+ *                      immediately. Caution: it might affect performance.
+ *                  false: Not not flush.
+ *                  undefined: Auto decide whether perform flush.
+ */
+echartsProto.dispatchAction = function (payload, opt) {
+    if (!isObject(opt)) {
+        opt = {silent: !!opt};
+    }
+
+    if (!actions[payload.type]) {
+        return;
+    }
+
+    // Avoid dispatch action before setOption. Especially in `connect`.
+    if (!this._model) {
+        return;
+    }
+
+    // May dispatchAction in rendering procedure
+    if (this[IN_MAIN_PROCESS]) {
+        this._pendingActions.push(payload);
+        return;
+    }
+
+    doDispatchAction.call(this, payload, opt.silent);
+
+    if (opt.flush) {
+        this._zr.flush(true);
+    }
+    else if (opt.flush !== false && env$1.browser.weChat) {
+        // In WeChat embeded browser, `requestAnimationFrame` and `setInterval`
+        // hang when sliding page (on touch event), which cause that zr does not
+        // refresh util user interaction finished, which is not expected.
+        // But `dispatchAction` may be called too frequently when pan on touch
+        // screen, which impacts performance if do not throttle them.
+        this._throttledZrFlush();
+    }
+
+    flushPendingActions.call(this, opt.silent);
+
+    triggerUpdatedEvent.call(this, opt.silent);
+};
+
+function doDispatchAction(payload, silent) {
+    var payloadType = payload.type;
+    var escapeConnect = payload.escapeConnect;
+    var actionWrap = actions[payloadType];
+    var actionInfo = actionWrap.actionInfo;
+
+    var cptType = (actionInfo.update || 'update').split(':');
+    var updateMethod = cptType.pop();
+    cptType = cptType[0] != null && parseClassType(cptType[0]);
+
+    this[IN_MAIN_PROCESS] = true;
+
+    var payloads = [payload];
+    var batched = false;
+    // Batch action
+    if (payload.batch) {
+        batched = true;
+        payloads = map(payload.batch, function (item) {
+            item = defaults(extend({}, item), payload);
+            item.batch = null;
+            return item;
+        });
+    }
+
+    var eventObjBatch = [];
+    var eventObj;
+    var isHighDown = payloadType === 'highlight' || payloadType === 'downplay';
+
+    each(payloads, function (batchItem) {
+        // Action can specify the event by return it.
+        eventObj = actionWrap.action(batchItem, this._model, this._api);
+        // Emit event outside
+        eventObj = eventObj || extend({}, batchItem);
+        // Convert type to eventType
+        eventObj.type = actionInfo.event || eventObj.type;
+        eventObjBatch.push(eventObj);
+
+        // light update does not perform data process, layout and visual.
+        if (isHighDown) {
+            // method, payload, mainType, subType
+            updateDirectly(this, updateMethod, batchItem, 'series');
+        }
+        else if (cptType) {
+            updateDirectly(this, updateMethod, batchItem, cptType.main, cptType.sub);
+        }
+    }, this);
+
+    if (updateMethod !== 'none' && !isHighDown && !cptType) {
+        // Still dirty
+        if (this[OPTION_UPDATED]) {
+            // FIXME Pass payload ?
+            prepare(this);
+            updateMethods.update.call(this, payload);
+            this[OPTION_UPDATED] = false;
+        }
+        else {
+            updateMethods[updateMethod].call(this, payload);
+        }
+    }
+
+    // Follow the rule of action batch
+    if (batched) {
+        eventObj = {
+            type: actionInfo.event || payloadType,
+            escapeConnect: escapeConnect,
+            batch: eventObjBatch
+        };
+    }
+    else {
+        eventObj = eventObjBatch[0];
+    }
+
+    this[IN_MAIN_PROCESS] = false;
+
+    !silent && this._messageCenter.trigger(eventObj.type, eventObj);
+}
+
+function flushPendingActions(silent) {
+    var pendingActions = this._pendingActions;
+    while (pendingActions.length) {
+        var payload = pendingActions.shift();
+        doDispatchAction.call(this, payload, silent);
+    }
+}
+
+function triggerUpdatedEvent(silent) {
+    !silent && this.trigger('updated');
+}
+
+/**
+ * Event `rendered` is triggered when zr
+ * rendered. It is useful for realtime
+ * snapshot (reflect animation).
+ *
+ * Event `finished` is triggered when:
+ * (1) zrender rendering finished.
+ * (2) initial animation finished.
+ * (3) progressive rendering finished.
+ * (4) no pending action.
+ * (5) no delayed setOption needs to be processed.
+ */
+function bindRenderedEvent(zr, ecIns) {
+    zr.on('rendered', function () {
+
+        ecIns.trigger('rendered');
+
+        // The `finished` event should not be triggered repeatly,
+        // so it should only be triggered when rendering indeed happend
+        // in zrender. (Consider the case that dipatchAction is keep
+        // triggering when mouse move).
+        if (
+            // Although zr is dirty if initial animation is not finished
+            // and this checking is called on frame, we also check
+            // animation finished for robustness.
+            zr.animation.isFinished()
+            && !ecIns[OPTION_UPDATED]
+            && !ecIns._scheduler.unfinished
+            && !ecIns._pendingActions.length
+        ) {
+            ecIns.trigger('finished');
+        }
+    });
+}
+
+/**
+ * @param {Object} params
+ * @param {number} params.seriesIndex
+ * @param {Array|TypedArray} params.data
+ */
+echartsProto.appendData = function (params) {
+    var seriesIndex = params.seriesIndex;
+    var ecModel = this.getModel();
+    var seriesModel = ecModel.getSeriesByIndex(seriesIndex);
+
+    if (__DEV__) {
+        assert(params.data && seriesModel);
+    }
+
+    seriesModel.appendData(params);
+
+    // Note: `appendData` does not support that update extent of coordinate
+    // system, util some scenario require that. In the expected usage of
+    // `appendData`, the initial extent of coordinate system should better
+    // be fixed by axis `min`/`max` setting or initial data, otherwise if
+    // the extent changed while `appendData`, the location of the painted
+    // graphic elements have to be changed, which make the usage of
+    // `appendData` meaningless.
+
+    this._scheduler.unfinished = true;
+};
+
+/**
+ * Register event
+ * @method
+ */
+echartsProto.on = createRegisterEventWithLowercaseName('on');
+echartsProto.off = createRegisterEventWithLowercaseName('off');
+echartsProto.one = createRegisterEventWithLowercaseName('one');
+
+/**
+ * Prepare view instances of charts and components
+ * @param  {module:echarts/model/Global} ecModel
+ * @private
+ */
+function prepareView(ecIns, type, ecModel, scheduler) {
+    var isComponent = type === 'component';
+    var viewList = isComponent ? ecIns._componentsViews : ecIns._chartsViews;
+    var viewMap = isComponent ? ecIns._componentsMap : ecIns._chartsMap;
+    var zr = ecIns._zr;
+    var api = ecIns._api;
+
+    for (var i = 0; i < viewList.length; i++) {
+        viewList[i].__alive = false;
+    }
+
+    isComponent
+        ? ecModel.eachComponent(function (componentType, model) {
+            componentType !== 'series' && doPrepare(model);
+        })
+        : ecModel.eachSeries(doPrepare);
+
+    function doPrepare(model) {
+        // Consider: id same and type changed.
+        var viewId = '_ec_' + model.id + '_' + model.type;
+        var view = viewMap[viewId];
+        if (!view) {
+            var classType = parseClassType(model.type);
+            var Clazz = isComponent
+                ? Component.getClass(classType.main, classType.sub)
+                : Chart.getClass(classType.sub);
+
+            if (__DEV__) {
+                assert(Clazz, classType.sub + ' does not exist.');
+            }
+
+            view = new Clazz();
+            view.init(ecModel, api);
+            viewMap[viewId] = view;
+            viewList.push(view);
+            zr.add(view.group);
+        }
+
+        model.__viewId = view.__id = viewId;
+        view.__alive = true;
+        view.__model = model;
+        view.group.__ecComponentInfo = {
+            mainType: model.mainType,
+            index: model.componentIndex
+        };
+        !isComponent && scheduler.prepareView(view, model, ecModel, api);
+    }
+
+    for (var i = 0; i < viewList.length;) {
+        var view = viewList[i];
+        if (!view.__alive) {
+            !isComponent && view.renderTask.dispose();
+            zr.remove(view.group);
+            view.dispose(ecModel, api);
+            viewList.splice(i, 1);
+            delete viewMap[view.__id];
+            view.__id = view.group.__ecComponentInfo = null;
+        }
+        else {
+            i++;
+        }
+    }
+}
+
+// /**
+//  * Encode visual infomation from data after data processing
+//  *
+//  * @param {module:echarts/model/Global} ecModel
+//  * @param {object} layout
+//  * @param {boolean} [layoutFilter] `true`: only layout,
+//  *                                 `false`: only not layout,
+//  *                                 `null`/`undefined`: all.
+//  * @param {string} taskBaseTag
+//  * @private
+//  */
+// function startVisualEncoding(ecIns, ecModel, api, payload, layoutFilter) {
+//     each(visualFuncs, function (visual, index) {
+//         var isLayout = visual.isLayout;
+//         if (layoutFilter == null
+//             || (layoutFilter === false && !isLayout)
+//             || (layoutFilter === true && isLayout)
+//         ) {
+//             visual.func(ecModel, api, payload);
+//         }
+//     });
+// }
+
+function clearColorPalette(ecModel) {
+    ecModel.clearColorPalette();
+    ecModel.eachSeries(function (seriesModel) {
+        seriesModel.clearColorPalette();
+    });
+}
+
+function render(ecIns, ecModel, api, payload) {
+
+    renderComponents(ecIns, ecModel, api, payload);
+
+    each(ecIns._chartsViews, function (chart) {
+        chart.__alive = false;
+    });
+
+    renderSeries(ecIns, ecModel, api, payload);
+
+    // Remove groups of unrendered charts
+    each(ecIns._chartsViews, function (chart) {
+        if (!chart.__alive) {
+            chart.remove(ecModel, api);
+        }
+    });
+}
+
+function renderComponents(ecIns, ecModel, api, payload, dirtyList) {
+    each(dirtyList || ecIns._componentsViews, function (componentView) {
+        var componentModel = componentView.__model;
+        componentView.render(componentModel, ecModel, api, payload);
+
+        updateZ(componentModel, componentView);
+    });
+}
+
+/**
+ * Render each chart and component
+ * @private
+ */
+function renderSeries(ecIns, ecModel, api, payload, dirtyMap) {
+    // Render all charts
+    var scheduler = ecIns._scheduler;
+    var unfinished;
+    ecModel.eachSeries(function (seriesModel) {
+        var chartView = ecIns._chartsMap[seriesModel.__viewId];
+        chartView.__alive = true;
+
+        var renderTask = chartView.renderTask;
+        scheduler.updatePayload(renderTask, payload);
+
+        if (dirtyMap && dirtyMap.get(seriesModel.uid)) {
+            renderTask.dirty();
+        }
+
+        unfinished |= renderTask.perform(scheduler.getPerformArgs(renderTask));
+
+        chartView.group.silent = !!seriesModel.get('silent');
+
+        updateZ(seriesModel, chartView);
+
+        updateBlend(seriesModel, chartView);
+    });
+    scheduler.unfinished |= unfinished;
+
+    // If use hover layer
+    updateHoverLayerStatus(ecIns._zr, ecModel);
+
+    // Add aria
+    aria(ecIns._zr.dom, ecModel);
+}
+
+function performPostUpdateFuncs(ecModel, api) {
+    each(postUpdateFuncs, function (func) {
+        func(ecModel, api);
+    });
+}
+
+
+var MOUSE_EVENT_NAMES = [
+    'click', 'dblclick', 'mouseover', 'mouseout', 'mousemove',
+    'mousedown', 'mouseup', 'globalout', 'contextmenu'
+];
+
+/**
+ * @private
+ */
+echartsProto._initEvents = function () {
+    each(MOUSE_EVENT_NAMES, function (eveName) {
+        this._zr.on(eveName, function (e) {
+            var ecModel = this.getModel();
+            var el = e.target;
+            var params;
+
+            // no e.target when 'globalout'.
+            if (eveName === 'globalout') {
+                params = {};
+            }
+            else if (el && el.dataIndex != null) {
+                var dataModel = el.dataModel || ecModel.getSeriesByIndex(el.seriesIndex);
+                params = dataModel && dataModel.getDataParams(el.dataIndex, el.dataType) || {};
+            }
+            // If element has custom eventData of components
+            else if (el && el.eventData) {
+                params = extend({}, el.eventData);
+            }
+
+            if (params) {
+                params.event = e;
+                params.type = eveName;
+                this.trigger(eveName, params);
+            }
+
+        }, this);
+    }, this);
+
+    each(eventActionMap, function (actionType, eventType) {
+        this._messageCenter.on(eventType, function (event) {
+            this.trigger(eventType, event);
+        }, this);
+    }, this);
+};
+
+/**
+ * @return {boolean}
+ */
+echartsProto.isDisposed = function () {
+    return this._disposed;
+};
+
+/**
+ * Clear
+ */
+echartsProto.clear = function () {
+    this.setOption({ series: [] }, true);
+};
+
+/**
+ * Dispose instance
+ */
+echartsProto.dispose = function () {
+    if (this._disposed) {
+        if (__DEV__) {
+            console.warn('Instance ' + this.id + ' has been disposed');
+        }
+        return;
+    }
+    this._disposed = true;
+
+    setAttribute(this.getDom(), DOM_ATTRIBUTE_KEY, '');
+
+    var api = this._api;
+    var ecModel = this._model;
+
+    each(this._componentsViews, function (component) {
+        component.dispose(ecModel, api);
+    });
+    each(this._chartsViews, function (chart) {
+        chart.dispose(ecModel, api);
+    });
+
+    // Dispose after all views disposed
+    this._zr.dispose();
+
+    delete instances[this.id];
+};
+
+mixin(ECharts, Eventful);
+
+function updateHoverLayerStatus(zr, ecModel) {
+    var storage = zr.storage;
+    var elCount = 0;
+    storage.traverse(function (el) {
+        if (!el.isGroup) {
+            elCount++;
+        }
+    });
+    if (elCount > ecModel.get('hoverLayerThreshold') && !env$1.node) {
+        storage.traverse(function (el) {
+            if (!el.isGroup) {
+                // Don't switch back.
+                el.useHoverLayer = true;
+            }
+        });
+    }
+}
+
+/**
+ * Update chart progressive and blend.
+ * @param {module:echarts/model/Series|module:echarts/model/Component} model
+ * @param {module:echarts/view/Component|module:echarts/view/Chart} view
+ */
+function updateBlend(seriesModel, chartView) {
+    var blendMode = seriesModel.get('blendMode') || null;
+    if (__DEV__) {
+        if (!env$1.canvasSupported && blendMode && blendMode !== 'source-over') {
+            console.warn('Only canvas support blendMode');
+        }
+    }
+    chartView.group.traverse(function (el) {
+        // FIXME marker and other components
+        if (!el.isGroup) {
+            // Only set if blendMode is changed. In case element is incremental and don't wan't to rerender.
+            if (el.style.blend !== blendMode) {
+                el.setStyle('blend', blendMode);
+            }
+        }
+        if (el.eachPendingDisplayable) {
+            el.eachPendingDisplayable(function (displayable) {
+                displayable.setStyle('blend', blendMode);
+            });
+        }
+    });
+}
+
+/**
+ * @param {module:echarts/model/Series|module:echarts/model/Component} model
+ * @param {module:echarts/view/Component|module:echarts/view/Chart} view
+ */
+function updateZ(model, view) {
+    var z = model.get('z');
+    var zlevel = model.get('zlevel');
+    // Set z and zlevel
+    view.group.traverse(function (el) {
+        if (el.type !== 'group') {
+            z != null && (el.z = z);
+            zlevel != null && (el.zlevel = zlevel);
+        }
+    });
+}
+
+function createExtensionAPI(ecInstance) {
+    var coordSysMgr = ecInstance._coordSysMgr;
+    return extend(new ExtensionAPI(ecInstance), {
+        // Inject methods
+        getCoordinateSystems: bind(
+            coordSysMgr.getCoordinateSystems, coordSysMgr
+        ),
+        getComponentByElement: function (el) {
+            while (el) {
+                var modelInfo = el.__ecComponentInfo;
+                if (modelInfo != null) {
+                    return ecInstance._model.getComponent(modelInfo.mainType, modelInfo.index);
+                }
+                el = el.parent;
+            }
+        }
+    });
+}
+
+/**
+ * @type {Object} key: actionType.
+ * @inner
+ */
+var actions = {};
+
+/**
+ * Map eventType to actionType
+ * @type {Object}
+ */
+var eventActionMap = {};
+
+/**
+ * Data processor functions of each stage
+ * @type {Array.<Object.<string, Function>>}
+ * @inner
+ */
+var dataProcessorFuncs = [];
+
+/**
+ * @type {Array.<Function>}
+ * @inner
+ */
+var optionPreprocessorFuncs = [];
+
+/**
+ * @type {Array.<Function>}
+ * @inner
+ */
+var postUpdateFuncs = [];
+
+/**
+ * Visual encoding functions of each stage
+ * @type {Array.<Object.<string, Function>>}
+ */
+var visualFuncs = [];
+
+/**
+ * Theme storage
+ * @type {Object.<key, Object>}
+ */
+var themeStorage = {};
+/**
+ * Loading effects
+ */
+var loadingEffects = {};
+
+var instances = {};
+var connectedGroups = {};
+
+var idBase = new Date() - 0;
+var groupIdBase = new Date() - 0;
+var DOM_ATTRIBUTE_KEY = '_echarts_instance_';
+
+var mapDataStores = {};
+
+function enableConnect(chart) {
+    var STATUS_PENDING = 0;
+    var STATUS_UPDATING = 1;
+    var STATUS_UPDATED = 2;
+    var STATUS_KEY = '__connectUpdateStatus';
+
+    function updateConnectedChartsStatus(charts, status) {
+        for (var i = 0; i < charts.length; i++) {
+            var otherChart = charts[i];
+            otherChart[STATUS_KEY] = status;
+        }
+    }
+
+    each(eventActionMap, function (actionType, eventType) {
+        chart._messageCenter.on(eventType, function (event) {
+            if (connectedGroups[chart.group] && chart[STATUS_KEY] !== STATUS_PENDING) {
+                if (event && event.escapeConnect) {
+                    return;
+                }
+
+                var action = chart.makeActionFromEvent(event);
+                var otherCharts = [];
+
+                each(instances, function (otherChart) {
+                    if (otherChart !== chart && otherChart.group === chart.group) {
+                        otherCharts.push(otherChart);
+                    }
+                });
+
+                updateConnectedChartsStatus(otherCharts, STATUS_PENDING);
+                each(otherCharts, function (otherChart) {
+                    if (otherChart[STATUS_KEY] !== STATUS_UPDATING) {
+                        otherChart.dispatchAction(action);
+                    }
+                });
+                updateConnectedChartsStatus(otherCharts, STATUS_UPDATED);
+            }
+        });
+    });
+}
+
+/**
+ * @param {HTMLElement} dom
+ * @param {Object} [theme]
+ * @param {Object} opts
+ * @param {number} [opts.devicePixelRatio] Use window.devicePixelRatio by default
+ * @param {string} [opts.renderer] Currently only 'canvas' is supported.
+ * @param {number} [opts.width] Use clientWidth of the input `dom` by default.
+ *                              Can be 'auto' (the same as null/undefined)
+ * @param {number} [opts.height] Use clientHeight of the input `dom` by default.
+ *                               Can be 'auto' (the same as null/undefined)
+ */
+function init(dom, theme$$1, opts) {
+    if (__DEV__) {
+        // Check version
+        if ((version$1.replace('.', '') - 0) < (dependencies.zrender.replace('.', '') - 0)) {
+            throw new Error(
+                'zrender/src ' + version$1
+                + ' is too old for ECharts ' + version
+                + '. Current version need ZRender '
+                + dependencies.zrender + '+'
+            );
+        }
+
+        if (!dom) {
+            throw new Error('Initialize failed: invalid dom.');
+        }
+    }
+
+    var existInstance = getInstanceByDom(dom);
+    if (existInstance) {
+        if (__DEV__) {
+            console.warn('There is a chart instance already initialized on the dom.');
+        }
+        return existInstance;
+    }
+
+    if (__DEV__) {
+        if (isDom(dom)
+            && dom.nodeName.toUpperCase() !== 'CANVAS'
+            && (
+                (!dom.clientWidth && (!opts || opts.width == null))
+                || (!dom.clientHeight && (!opts || opts.height == null))
+            )
+        ) {
+            console.warn('Can\'t get dom width or height');
+        }
+    }
+
+    var chart = new ECharts(dom, theme$$1, opts);
+    chart.id = 'ec_' + idBase++;
+    instances[chart.id] = chart;
+
+    setAttribute(dom, DOM_ATTRIBUTE_KEY, chart.id);
+
+    enableConnect(chart);
+
+    return chart;
+}
+
+/**
+ * @return {string|Array.<module:echarts~ECharts>} groupId
+ */
+function connect(groupId) {
+    // Is array of charts
+    if (isArray(groupId)) {
+        var charts = groupId;
+        groupId = null;
+        // If any chart has group
+        each(charts, function (chart) {
+            if (chart.group != null) {
+                groupId = chart.group;
+            }
+        });
+        groupId = groupId || ('g_' + groupIdBase++);
+        each(charts, function (chart) {
+            chart.group = groupId;
+        });
+    }
+    connectedGroups[groupId] = true;
+    return groupId;
+}
+
+/**
+ * @DEPRECATED
+ * @return {string} groupId
+ */
+function disConnect(groupId) {
+    connectedGroups[groupId] = false;
+}
+
+/**
+ * @return {string} groupId
+ */
+var disconnect = disConnect;
+
+/**
+ * Dispose a chart instance
+ * @param  {module:echarts~ECharts|HTMLDomElement|string} chart
+ */
+function dispose(chart) {
+    if (typeof chart === 'string') {
+        chart = instances[chart];
+    }
+    else if (!(chart instanceof ECharts)){
+        // Try to treat as dom
+        chart = getInstanceByDom(chart);
+    }
+    if ((chart instanceof ECharts) && !chart.isDisposed()) {
+        chart.dispose();
+    }
+}
+
+/**
+ * @param  {HTMLElement} dom
+ * @return {echarts~ECharts}
+ */
+function getInstanceByDom(dom) {
+    return instances[getAttribute(dom, DOM_ATTRIBUTE_KEY)];
+}
+
+/**
+ * @param {string} key
+ * @return {echarts~ECharts}
+ */
+function getInstanceById(key) {
+    return instances[key];
+}
+
+/**
+ * Register theme
+ */
+function registerTheme(name, theme$$1) {
+    themeStorage[name] = theme$$1;
+}
+
+/**
+ * Register option preprocessor
+ * @param {Function} preprocessorFunc
+ */
+function registerPreprocessor(preprocessorFunc) {
+    optionPreprocessorFuncs.push(preprocessorFunc);
+}
+
+/**
+ * @param {number} [priority=1000]
+ * @param {Object|Function} processor
+ */
+function registerProcessor(priority, processor) {
+    normalizeRegister(dataProcessorFuncs, priority, processor, PRIORITY_PROCESSOR_FILTER);
+}
+
+/**
+ * Register postUpdater
+ * @param {Function} postUpdateFunc
+ */
+function registerPostUpdate(postUpdateFunc) {
+    postUpdateFuncs.push(postUpdateFunc);
+}
+
+/**
+ * Usage:
+ * registerAction('someAction', 'someEvent', function () { ... });
+ * registerAction('someAction', function () { ... });
+ * registerAction(
+ *     {type: 'someAction', event: 'someEvent', update: 'updateView'},
+ *     function () { ... }
+ * );
+ *
+ * @param {(string|Object)} actionInfo
+ * @param {string} actionInfo.type
+ * @param {string} [actionInfo.event]
+ * @param {string} [actionInfo.update]
+ * @param {string} [eventName]
+ * @param {Function} action
+ */
+function registerAction(actionInfo, eventName, action) {
+    if (typeof eventName === 'function') {
+        action = eventName;
+        eventName = '';
+    }
+    var actionType = isObject(actionInfo)
+        ? actionInfo.type
+        : ([actionInfo, actionInfo = {
+            event: eventName
+        }][0]);
+
+    // Event name is all lowercase
+    actionInfo.event = (actionInfo.event || actionType).toLowerCase();
+    eventName = actionInfo.event;
+
+    // Validate action type and event name.
+    assert(ACTION_REG.test(actionType) && ACTION_REG.test(eventName));
+
+    if (!actions[actionType]) {
+        actions[actionType] = {action: action, actionInfo: actionInfo};
+    }
+    eventActionMap[eventName] = actionType;
+}
+
+/**
+ * @param {string} type
+ * @param {*} CoordinateSystem
+ */
+function registerCoordinateSystem(type, CoordinateSystem$$1) {
+    CoordinateSystemManager.register(type, CoordinateSystem$$1);
+}
+
+/**
+ * Get dimensions of specified coordinate system.
+ * @param {string} type
+ * @return {Array.<string|Object>}
+ */
+function getCoordinateSystemDimensions(type) {
+    var coordSysCreator = CoordinateSystemManager.get(type);
+    if (coordSysCreator) {
+        return coordSysCreator.getDimensionsInfo
+                ? coordSysCreator.getDimensionsInfo()
+                : coordSysCreator.dimensions.slice();
+    }
+}
+
+/**
+ * Layout is a special stage of visual encoding
+ * Most visual encoding like color are common for different chart
+ * But each chart has it's own layout algorithm
+ *
+ * @param {number} [priority=1000]
+ * @param {Function} layoutTask
+ */
+function registerLayout(priority, layoutTask) {
+    normalizeRegister(visualFuncs, priority, layoutTask, PRIORITY_VISUAL_LAYOUT, 'layout');
+}
+
+/**
+ * @param {number} [priority=3000]
+ * @param {module:echarts/stream/Task} visualTask
+ */
+function registerVisual(priority, visualTask) {
+    normalizeRegister(visualFuncs, priority, visualTask, PRIORITY_VISUAL_CHART, 'visual');
+}
+
+/**
+ * @param {Object|Function} fn: {seriesType, createOnAllSeries, performRawSeries, reset}
+ */
+function normalizeRegister(targetList, priority, fn, defaultPriority, visualType) {
+    if (isFunction(priority) || isObject(priority)) {
+        fn = priority;
+        priority = defaultPriority;
+    }
+
+    if (__DEV__) {
+        if (isNaN(priority) || priority == null) {
+            throw new Error('Illegal priority');
+        }
+        // Check duplicate
+        each(targetList, function (wrap) {
+            assert(wrap.__raw !== fn);
+        });
+    }
+
+    var stageHandler = Scheduler.wrapStageHandler(fn, visualType);
+
+    stageHandler.__prio = priority;
+    stageHandler.__raw = fn;
+    targetList.push(stageHandler);
+
+    return stageHandler;
+}
+
+/**
+ * @param {string} name
+ */
+function registerLoading(name, loadingFx) {
+    loadingEffects[name] = loadingFx;
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendComponentModel(opts/*, superClass*/) {
+    // var Clazz = ComponentModel;
+    // if (superClass) {
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ComponentModel.getClass(classType.main, classType.sub, true);
+    // }
+    return ComponentModel.extend(opts);
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendComponentView(opts/*, superClass*/) {
+    // var Clazz = ComponentView;
+    // if (superClass) {
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ComponentView.getClass(classType.main, classType.sub, true);
+    // }
+    return Component.extend(opts);
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendSeriesModel(opts/*, superClass*/) {
+    // var Clazz = SeriesModel;
+    // if (superClass) {
+    //     superClass = 'series.' + superClass.replace('series.', '');
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ComponentModel.getClass(classType.main, classType.sub, true);
+    // }
+    return SeriesModel.extend(opts);
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendChartView(opts/*, superClass*/) {
+    // var Clazz = ChartView;
+    // if (superClass) {
+    //     superClass = superClass.replace('series.', '');
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ChartView.getClass(classType.main, true);
+    // }
+    return Chart.extend(opts);
+}
+
+/**
+ * ZRender need a canvas context to do measureText.
+ * But in node environment canvas may be created by node-canvas.
+ * So we need to specify how to create a canvas instead of using document.createElement('canvas')
+ *
+ * Be careful of using it in the browser.
+ *
+ * @param {Function} creator
+ * @example
+ *     var Canvas = require('canvas');
+ *     var echarts = require('echarts');
+ *     echarts.setCanvasCreator(function () {
+ *         // Small size is enough.
+ *         return new Canvas(32, 32);
+ *     });
+ */
+function setCanvasCreator(creator) {
+    $override('createCanvas', creator);
+}
+
+/**
+ * @param {string} mapName
+ * @param {Object|string} geoJson
+ * @param {Object} [specialAreas]
+ *
+ * @example
+ *     $.get('USA.json', function (geoJson) {
+ *         echarts.registerMap('USA', geoJson);
+ *         // Or
+ *         echarts.registerMap('USA', {
+ *             geoJson: geoJson,
+ *             specialAreas: {}
+ *         })
+ *     });
+ */
+function registerMap(mapName, geoJson, specialAreas) {
+    if (geoJson.geoJson && !geoJson.features) {
+        specialAreas = geoJson.specialAreas;
+        geoJson = geoJson.geoJson;
+    }
+    if (typeof geoJson === 'string') {
+        geoJson = (typeof JSON !== 'undefined' && JSON.parse)
+            ? JSON.parse(geoJson) : (new Function('return (' + geoJson + ');'))();
+    }
+    mapDataStores[mapName] = {
+        geoJson: geoJson,
+        specialAreas: specialAreas
+    };
+}
+
+/**
+ * @param {string} mapName
+ * @return {Object}
+ */
+function getMap(mapName) {
+    return mapDataStores[mapName];
+}
+
+registerVisual(PRIORITY_VISUAL_GLOBAL, seriesColor);
+registerPreprocessor(backwardCompat);
+registerProcessor(PRIORITY_PROCESSOR_STATISTIC, dataStack);
+registerLoading('default', loadingDefault);
+
+// Default actions
+
+registerAction({
+    type: 'highlight',
+    event: 'highlight',
+    update: 'highlight'
+}, noop);
+
+registerAction({
+    type: 'downplay',
+    event: 'downplay',
+    update: 'downplay'
+}, noop);
+
+// Default theme
+registerTheme('light', lightTheme);
+registerTheme('dark', theme);
+
+// For backward compatibility, where the namespace `dataTool` will
+// be mounted on `echarts` is the extension `dataTool` is imported.
+var dataTool = {};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function defaultKeyGetter(item) {
+    return item;
+}
+
+/**
+ * @param {Array} oldArr
+ * @param {Array} newArr
+ * @param {Function} oldKeyGetter
+ * @param {Function} newKeyGetter
+ * @param {Object} [context] Can be visited by this.context in callback.
+ */
+function DataDiffer(oldArr, newArr, oldKeyGetter, newKeyGetter, context) {
+    this._old = oldArr;
+    this._new = newArr;
+
+    this._oldKeyGetter = oldKeyGetter || defaultKeyGetter;
+    this._newKeyGetter = newKeyGetter || defaultKeyGetter;
+
+    this.context = context;
+}
+
+DataDiffer.prototype = {
+
+    constructor: DataDiffer,
+
+    /**
+     * Callback function when add a data
+     */
+    add: function (func) {
+        this._add = func;
+        return this;
+    },
+
+    /**
+     * Callback function when update a data
+     */
+    update: function (func) {
+        this._update = func;
+        return this;
+    },
+
+    /**
+     * Callback function when remove a data
+     */
+    remove: function (func) {
+        this._remove = func;
+        return this;
+    },
+
+    execute: function () {
+        var oldArr = this._old;
+        var newArr = this._new;
+
+        var oldDataIndexMap = {};
+        var newDataIndexMap = {};
+        var oldDataKeyArr = [];
+        var newDataKeyArr = [];
+        var i;
+
+        initIndexMap(oldArr, oldDataIndexMap, oldDataKeyArr, '_oldKeyGetter', this);
+        initIndexMap(newArr, newDataIndexMap, newDataKeyArr, '_newKeyGetter', this);
+
+        // Travel by inverted order to make sure order consistency
+        // when duplicate keys exists (consider newDataIndex.pop() below).
+        // For performance consideration, these code below do not look neat.
+        for (i = 0; i < oldArr.length; i++) {
+            var key = oldDataKeyArr[i];
+            var idx = newDataIndexMap[key];
+
+            // idx can never be empty array here. see 'set null' logic below.
+            if (idx != null) {
+                // Consider there is duplicate key (for example, use dataItem.name as key).
+                // We should make sure every item in newArr and oldArr can be visited.
+                var len = idx.length;
+                if (len) {
+                    len === 1 && (newDataIndexMap[key] = null);
+                    idx = idx.unshift();
+                }
+                else {
+                    newDataIndexMap[key] = null;
+                }
+                this._update && this._update(idx, i);
+            }
+            else {
+                this._remove && this._remove(i);
+            }
+        }
+
+        for (var i = 0; i < newDataKeyArr.length; i++) {
+            var key = newDataKeyArr[i];
+            if (newDataIndexMap.hasOwnProperty(key)) {
+                var idx = newDataIndexMap[key];
+                if (idx == null) {
+                    continue;
+                }
+                // idx can never be empty array here. see 'set null' logic above.
+                if (!idx.length) {
+                    this._add && this._add(idx);
+                }
+                else {
+                    for (var j = 0, len = idx.length; j < len; j++) {
+                        this._add && this._add(idx[j]);
+                    }
+                }
+            }
+        }
+    }
+};
+
+function initIndexMap(arr, map, keyArr, keyGetterName, dataDiffer) {
+    for (var i = 0; i < arr.length; i++) {
+        // Add prefix to avoid conflict with Object.prototype.
+        var key = '_ec_' + dataDiffer[keyGetterName](arr[i], i);
+        var existence = map[key];
+        if (existence == null) {
+            keyArr.push(key);
+            map[key] = i;
+        }
+        else {
+            if (!existence.length) {
+                map[key] = existence = [existence];
+            }
+            existence.push(i);
+        }
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var OTHER_DIMENSIONS = createHashMap([
+    'tooltip', 'label', 'itemName', 'itemId', 'seriesName'
+]);
+
+function summarizeDimensions(data) {
+    var summary = {};
+    var encode = summary.encode = {};
+    var notExtraCoordDimMap = createHashMap();
+    var defaultedLabel = [];
+    var defaultedTooltip = [];
+
+    each$1(data.dimensions, function (dimName) {
+        var dimItem = data.getDimensionInfo(dimName);
+
+        var coordDim = dimItem.coordDim;
+        if (coordDim) {
+            if (__DEV__) {
+                assert$1(OTHER_DIMENSIONS.get(coordDim) == null);
+            }
+            var coordDimArr = encode[coordDim];
+            if (!encode.hasOwnProperty(coordDim)) {
+                coordDimArr = encode[coordDim] = [];
+            }
+            coordDimArr[dimItem.coordDimIndex] = dimName;
+
+            if (!dimItem.isExtraCoord) {
+                notExtraCoordDimMap.set(coordDim, 1);
+
+                // Use the last coord dim (and label friendly) as default label,
+                // because when dataset is used, it is hard to guess which dimension
+                // can be value dimension. If both show x, y on label is not look good,
+                // and conventionally y axis is focused more.
+                if (mayLabelDimType(dimItem.type)) {
+                    defaultedLabel[0] = dimName;
+                }
+            }
+            if (dimItem.defaultTooltip) {
+                defaultedTooltip.push(dimName);
+            }
+        }
+
+        OTHER_DIMENSIONS.each(function (v, otherDim) {
+            var otherDimArr = encode[otherDim];
+            if (!encode.hasOwnProperty(otherDim)) {
+                otherDimArr = encode[otherDim] = [];
+            }
+
+            var dimIndex = dimItem.otherDims[otherDim];
+            if (dimIndex != null && dimIndex !== false) {
+                otherDimArr[dimIndex] = dimItem.name;
+            }
+        });
+    });
+
+    var dataDimsOnCoord = [];
+    var encodeFirstDimNotExtra = {};
+
+    notExtraCoordDimMap.each(function (v, coordDim) {
+        var dimArr = encode[coordDim];
+        // ??? FIXME extra coord should not be set in dataDimsOnCoord.
+        // But should fix the case that radar axes: simplify the logic
+        // of `completeDimension`, remove `extraPrefix`.
+        encodeFirstDimNotExtra[coordDim] = dimArr[0];
+        // Not necessary to remove duplicate, because a data
+        // dim canot on more than one coordDim.
+        dataDimsOnCoord = dataDimsOnCoord.concat(dimArr);
+    });
+
+    summary.dataDimsOnCoord = dataDimsOnCoord;
+    summary.encodeFirstDimNotExtra = encodeFirstDimNotExtra;
+
+    var encodeLabel = encode.label;
+    // FIXME `encode.label` is not recommanded, because formatter can not be set
+    // in this way. Use label.formatter instead. May be remove this approach someday.
+    if (encodeLabel && encodeLabel.length) {
+        defaultedLabel = encodeLabel.slice();
+    }
+
+    var encodeTooltip = encode.tooltip;
+    if (encodeTooltip && encodeTooltip.length) {
+        defaultedTooltip = encodeTooltip.slice();
+    }
+    else if (!defaultedTooltip.length) {
+        defaultedTooltip = defaultedLabel.slice();
+    }
+
+    encode.defaultedLabel = defaultedLabel;
+    encode.defaultedTooltip = defaultedTooltip;
+
+    return summary;
+}
+
+function getDimensionTypeByAxis(axisType) {
+    return axisType === 'category'
+        ? 'ordinal'
+        : axisType === 'time'
+        ? 'time'
+        : 'float';
+}
+
+function mayLabelDimType(dimType) {
+    // In most cases, ordinal and time do not suitable for label.
+    // Ordinal info can be displayed on axis. Time is too long.
+    return !(dimType === 'ordinal' || dimType === 'time');
+}
+
+// function findTheLastDimMayLabel(data) {
+//     // Get last value dim
+//     var dimensions = data.dimensions.slice();
+//     var valueType;
+//     var valueDim;
+//     while (dimensions.length && (
+//         valueDim = dimensions.pop(),
+//         valueType = data.getDimensionInfo(valueDim).type,
+//         valueType === 'ordinal' || valueType === 'time'
+//     )) {} // jshint ignore:line
+//     return valueDim;
+// }
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * List for data storage
+ * @module echarts/data/List
+ */
+
+var isObject$4 = isObject$1;
+
+var UNDEFINED = 'undefined';
+
+// Use prefix to avoid index to be the same as otherIdList[idx],
+// which will cause weird udpate animation.
+var ID_PREFIX = 'e\0\0';
+
+var dataCtors = {
+    'float': typeof Float64Array === UNDEFINED
+        ? Array : Float64Array,
+    'int': typeof Int32Array === UNDEFINED
+        ? Array : Int32Array,
+    // Ordinal data type can be string or int
+    'ordinal': Array,
+    'number': Array,
+    'time': Array
+};
+
+// Caution: MUST not use `new CtorUint32Array(arr, 0, len)`, because the Ctor of array is
+// different from the Ctor of typed array.
+var CtorUint32Array = typeof Uint32Array === UNDEFINED ? Array : Uint32Array;
+var CtorUint16Array = typeof Uint16Array === UNDEFINED ? Array : Uint16Array;
+
+function getIndicesCtor(list) {
+    // The possible max value in this._indicies is always this._rawCount despite of filtering.
+    return list._rawCount > 65535 ? CtorUint32Array : CtorUint16Array;
+}
+
+function cloneChunk(originalChunk) {
+    var Ctor = originalChunk.constructor;
+    // Only shallow clone is enough when Array.
+    return Ctor === Array ? originalChunk.slice() : new Ctor(originalChunk);
+}
+
+var TRANSFERABLE_PROPERTIES = [
+    'hasItemOption', '_nameList', '_idList', '_invertedIndicesMap',
+    '_rawData', '_chunkSize', '_chunkCount', '_dimValueGetter',
+    '_count', '_rawCount', '_nameDimIdx', '_idDimIdx'
+];
+var CLONE_PROPERTIES = [
+    '_extent', '_approximateExtent', '_rawExtent'
+];
+
+function transferProperties(target, source) {
+    each$1(TRANSFERABLE_PROPERTIES.concat(source.__wrappedMethods || []), function (propName) {
+        if (source.hasOwnProperty(propName)) {
+            target[propName] = source[propName];
+        }
+    });
+
+    target.__wrappedMethods = source.__wrappedMethods;
+
+    each$1(CLONE_PROPERTIES, function (propName) {
+        target[propName] = clone(source[propName]);
+    });
+
+    target._calculationInfo = extend(source._calculationInfo);
+}
+
+
+
+
+
+/**
+ * @constructor
+ * @alias module:echarts/data/List
+ *
+ * @param {Array.<string|Object>} dimensions
+ *      For example, ['someDimName', {name: 'someDimName', type: 'someDimType'}, ...].
+ *      Dimensions should be concrete names like x, y, z, lng, lat, angle, radius
+ *      Spetial fields: {
+ *          ordinalMeta: <module:echarts/data/OrdinalMeta>
+ *          createInvertedIndices: <boolean>
+ *      }
+ * @param {module:echarts/model/Model} hostModel
+ */
+var List = function (dimensions, hostModel) {
+
+    dimensions = dimensions || ['x', 'y'];
+
+    var dimensionInfos = {};
+    var dimensionNames = [];
+    var invertedIndicesMap = {};
+
+    for (var i = 0; i < dimensions.length; i++) {
+        // Use the original dimensions[i], where other flag props may exists.
+        var dimensionInfo = dimensions[i];
+
+        if (isString(dimensionInfo)) {
+            dimensionInfo = {name: dimensionInfo};
+        }
+
+        var dimensionName = dimensionInfo.name;
+        dimensionInfo.type = dimensionInfo.type || 'float';
+        if (!dimensionInfo.coordDim) {
+            dimensionInfo.coordDim = dimensionName;
+            dimensionInfo.coordDimIndex = 0;
+        }
+
+        dimensionInfo.otherDims = dimensionInfo.otherDims || {};
+        dimensionNames.push(dimensionName);
+        dimensionInfos[dimensionName] = dimensionInfo;
+
+        dimensionInfo.index = i;
+
+        if (dimensionInfo.createInvertedIndices) {
+            invertedIndicesMap[dimensionName] = [];
+        }
+    }
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    this.dimensions = dimensionNames;
+
+    /**
+     * Infomation of each data dimension, like data type.
+     * @type {Object}
+     */
+    this._dimensionInfos = dimensionInfos;
+
+    /**
+     * @type {module:echarts/model/Model}
+     */
+    this.hostModel = hostModel;
+
+    /**
+     * @type {module:echarts/model/Model}
+     */
+    this.dataType;
+
+    /**
+     * Indices stores the indices of data subset after filtered.
+     * This data subset will be used in chart.
+     * @type {Array.<number>}
+     * @readOnly
+     */
+    this._indices = null;
+
+    this._count = 0;
+    this._rawCount = 0;
+
+    /**
+     * Data storage
+     * @type {Object.<key, Array.<TypedArray|Array>>}
+     * @private
+     */
+    this._storage = {};
+
+    /**
+     * @type {Array.<string>}
+     */
+    this._nameList = [];
+    /**
+     * @type {Array.<string>}
+     */
+    this._idList = [];
+
+    /**
+     * Models of data option is stored sparse for optimizing memory cost
+     * @type {Array.<module:echarts/model/Model>}
+     * @private
+     */
+    this._optionModels = [];
+
+    /**
+     * Global visual properties after visual coding
+     * @type {Object}
+     * @private
+     */
+    this._visual = {};
+
+    /**
+     * Globel layout properties.
+     * @type {Object}
+     * @private
+     */
+    this._layout = {};
+
+    /**
+     * Item visual properties after visual coding
+     * @type {Array.<Object>}
+     * @private
+     */
+    this._itemVisuals = [];
+
+    /**
+     * Key: visual type, Value: boolean
+     * @type {Object}
+     * @readOnly
+     */
+    this.hasItemVisual = {};
+
+    /**
+     * Item layout properties after layout
+     * @type {Array.<Object>}
+     * @private
+     */
+    this._itemLayouts = [];
+
+    /**
+     * Graphic elemnents
+     * @type {Array.<module:zrender/Element>}
+     * @private
+     */
+    this._graphicEls = [];
+
+    /**
+     * Max size of each chunk.
+     * @type {number}
+     * @private
+     */
+    this._chunkSize = 1e5;
+
+    /**
+     * @type {number}
+     * @private
+     */
+    this._chunkCount = 0;
+
+    /**
+     * @type {Array.<Array|Object>}
+     * @private
+     */
+    this._rawData;
+
+    /**
+     * Raw extent will not be cloned, but only transfered.
+     * It will not be calculated util needed.
+     * key: dim,
+     * value: {end: number, extent: Array.<number>}
+     * @type {Object}
+     * @private
+     */
+    this._rawExtent = {};
+
+    /**
+     * @type {Object}
+     * @private
+     */
+    this._extent = {};
+
+    /**
+     * key: dim
+     * value: extent
+     * @type {Object}
+     * @private
+     */
+    this._approximateExtent = {};
+
+    /**
+     * Cache summary info for fast visit. See "dimensionHelper".
+     * @type {Object}
+     * @private
+     */
+    this._dimensionsSummary = summarizeDimensions(this);
+
+    /**
+     * @type {Object.<Array|TypedArray>}
+     * @private
+     */
+    this._invertedIndicesMap = invertedIndicesMap;
+
+    /**
+     * @type {Object}
+     * @private
+     */
+    this._calculationInfo = {};
+};
+
+var listProto = List.prototype;
+
+listProto.type = 'list';
+
+/**
+ * If each data item has it's own option
+ * @type {boolean}
+ */
+listProto.hasItemOption = true;
+
+/**
+ * Get dimension name
+ * @param {string|number} dim
+ *        Dimension can be concrete names like x, y, z, lng, lat, angle, radius
+ *        Or a ordinal number. For example getDimensionInfo(0) will return 'x' or 'lng' or 'radius'
+ * @return {string} Concrete dim name.
+ */
+listProto.getDimension = function (dim) {
+    if (!isNaN(dim)) {
+        dim = this.dimensions[dim] || dim;
+    }
+    return dim;
+};
+
+/**
+ * Get type and calculation info of particular dimension
+ * @param {string|number} dim
+ *        Dimension can be concrete names like x, y, z, lng, lat, angle, radius
+ *        Or a ordinal number. For example getDimensionInfo(0) will return 'x' or 'lng' or 'radius'
+ */
+listProto.getDimensionInfo = function (dim) {
+    // Do not clone, because there may be categories in dimInfo.
+    return this._dimensionInfos[this.getDimension(dim)];
+};
+
+/**
+ * @return {Array.<string>} concrete dimension name list on coord.
+ */
+listProto.getDimensionsOnCoord = function () {
+    return this._dimensionsSummary.dataDimsOnCoord.slice();
+};
+
+/**
+ * @param {string} coordDim
+ * @param {number} [idx] A coordDim may map to more than one data dim.
+ *        If idx is `true`, return a array of all mapped dims.
+ *        If idx is not specified, return the first dim not extra.
+ * @return {string|Array.<string>} concrete data dim.
+ *        If idx is number, and not found, return null/undefined.
+ *        If idx is `true`, and not found, return empty array (always return array).
+ */
+listProto.mapDimension = function (coordDim, idx) {
+    var dimensionsSummary = this._dimensionsSummary;
+
+    if (idx == null) {
+        return dimensionsSummary.encodeFirstDimNotExtra[coordDim];
+    }
+
+    var dims = dimensionsSummary.encode[coordDim];
+    return idx === true
+        // always return array if idx is `true`
+        ? (dims || []).slice()
+        : (dims && dims[idx]);
+};
+
+/**
+ * Initialize from data
+ * @param {Array.<Object|number|Array>} data source or data or data provider.
+ * @param {Array.<string>} [nameLIst] The name of a datum is used on data diff and
+ *        defualt label/tooltip.
+ *        A name can be specified in encode.itemName,
+ *        or dataItem.name (only for series option data),
+ *        or provided in nameList from outside.
+ * @param {Function} [dimValueGetter] (dataItem, dimName, dataIndex, dimIndex) => number
+ */
+listProto.initData = function (data, nameList, dimValueGetter) {
+
+    var notProvider = Source.isInstance(data) || isArrayLike(data);
+    if (notProvider) {
+        data = new DefaultDataProvider(data, this.dimensions.length);
+    }
+
+    if (__DEV__) {
+        if (!notProvider && (typeof data.getItem != 'function' || typeof data.count != 'function')) {
+            throw new Error('Inavlid data provider.');
+        }
+    }
+
+    this._rawData = data;
+
+    // Clear
+    this._storage = {};
+    this._indices = null;
+
+    this._nameList = nameList || [];
+
+    this._idList = [];
+
+    this._nameRepeatCount = {};
+
+    if (!dimValueGetter) {
+        this.hasItemOption = false;
+    }
+
+    /**
+     * @readOnly
+     */
+    this.defaultDimValueGetter = defaultDimValueGetters[
+        this._rawData.getSource().sourceFormat
+    ];
+
+    // Default dim value getter
+    this._dimValueGetter = dimValueGetter = dimValueGetter
+        || this.defaultDimValueGetter;
+
+    // Reset raw extent.
+    this._rawExtent = {};
+
+    this._initDataFromProvider(0, data.count());
+
+    // If data has no item option.
+    if (data.pure) {
+        this.hasItemOption = false;
+    }
+};
+
+listProto.getProvider = function () {
+    return this._rawData;
+};
+
+listProto.appendData = function (data) {
+    if (__DEV__) {
+        assert$1(!this._indices, 'appendData can only be called on raw data.');
+    }
+
+    var rawData = this._rawData;
+    var start = this.count();
+    rawData.appendData(data);
+    var end = rawData.count();
+    if (!rawData.persistent) {
+        end += start;
+    }
+    this._initDataFromProvider(start, end);
+};
+
+listProto._initDataFromProvider = function (start, end) {
+    // Optimize.
+    if (start >= end) {
+        return;
+    }
+
+    var chunkSize = this._chunkSize;
+    var rawData = this._rawData;
+    var storage = this._storage;
+    var dimensions = this.dimensions;
+    var dimLen = dimensions.length;
+    var dimensionInfoMap = this._dimensionInfos;
+    var nameList = this._nameList;
+    var idList = this._idList;
+    var rawExtent = this._rawExtent;
+    var nameRepeatCount = this._nameRepeatCount = {};
+    var nameDimIdx;
+
+    var chunkCount = this._chunkCount;
+    var lastChunkIndex = chunkCount - 1;
+    for (var i = 0; i < dimLen; i++) {
+        var dim = dimensions[i];
+        if (!rawExtent[dim]) {
+            rawExtent[dim] = getInitialExtent();
+        }
+
+        var dimInfo = dimensionInfoMap[dim];
+        if (dimInfo.otherDims.itemName === 0) {
+            nameDimIdx = this._nameDimIdx = i;
+        }
+        if (dimInfo.otherDims.itemId === 0) {
+            this._idDimIdx = i;
+        }
+        var DataCtor = dataCtors[dimInfo.type];
+
+        if (!storage[dim]) {
+            storage[dim] = [];
+        }
+        var resizeChunkArray = storage[dim][lastChunkIndex];
+        if (resizeChunkArray && resizeChunkArray.length < chunkSize) {
+            var newStore = new DataCtor(Math.min(end - lastChunkIndex * chunkSize, chunkSize));
+            // The cost of the copy is probably inconsiderable
+            // within the initial chunkSize.
+            for (var j = 0; j < resizeChunkArray.length; j++) {
+                newStore[j] = resizeChunkArray[j];
+            }
+            storage[dim][lastChunkIndex] = newStore;
+        }
+
+        // Create new chunks.
+        for (var k = chunkCount * chunkSize; k < end; k += chunkSize) {
+            storage[dim].push(new DataCtor(Math.min(end - k, chunkSize)));
+        }
+        this._chunkCount = storage[dim].length;
+    }
+
+    var dataItem = new Array(dimLen);
+    for (var idx = start; idx < end; idx++) {
+        // NOTICE: Try not to write things into dataItem
+        dataItem = rawData.getItem(idx, dataItem);
+        // Each data item is value
+        // [1, 2]
+        // 2
+        // Bar chart, line chart which uses category axis
+        // only gives the 'y' value. 'x' value is the indices of category
+        // Use a tempValue to normalize the value to be a (x, y) value
+        var chunkIndex = Math.floor(idx / chunkSize);
+        var chunkOffset = idx % chunkSize;
+
+        // Store the data by dimensions
+        for (var k = 0; k < dimLen; k++) {
+            var dim = dimensions[k];
+            var dimStorage = storage[dim][chunkIndex];
+            // PENDING NULL is empty or zero
+            var val = this._dimValueGetter(dataItem, dim, idx, k);
+            dimStorage[chunkOffset] = val;
+
+            var dimRawExtent = rawExtent[dim];
+            if (val < dimRawExtent[0]) {
+                dimRawExtent[0] = val;
+            }
+            if (val > dimRawExtent[1]) {
+                dimRawExtent[1] = val;
+            }
+        }
+
+        // ??? FIXME not check by pure but sourceFormat?
+        // TODO refactor these logic.
+        if (!rawData.pure) {
+            var name = nameList[idx];
+
+            if (dataItem && name == null) {
+                // If dataItem is {name: ...}, it has highest priority.
+                // That is appropriate for many common cases.
+                if (dataItem.name != null) {
+                    // There is no other place to persistent dataItem.name,
+                    // so save it to nameList.
+                    nameList[idx] = name = dataItem.name;
+                }
+                else if (nameDimIdx != null) {
+                    var nameDim = dimensions[nameDimIdx];
+                    var nameDimChunk = storage[nameDim][chunkIndex];
+                    if (nameDimChunk) {
+                        name = nameDimChunk[chunkOffset];
+                        var ordinalMeta = dimensionInfoMap[nameDim].ordinalMeta;
+                        if (ordinalMeta && ordinalMeta.categories.length) {
+                            name = ordinalMeta.categories[name];
+                        }
+                    }
+                }
+            }
+
+            // Try using the id in option
+            // id or name is used on dynamical data, mapping old and new items.
+            var id = dataItem == null ? null : dataItem.id;
+
+            if (id == null && name != null) {
+                // Use name as id and add counter to avoid same name
+                nameRepeatCount[name] = nameRepeatCount[name] || 0;
+                id = name;
+                if (nameRepeatCount[name] > 0) {
+                    id += '__ec__' + nameRepeatCount[name];
+                }
+                nameRepeatCount[name]++;
+            }
+            id != null && (idList[idx] = id);
+        }
+    }
+
+    if (!rawData.persistent && rawData.clean) {
+        // Clean unused data if data source is typed array.
+        rawData.clean();
+    }
+
+    this._rawCount = this._count = end;
+
+    // Reset data extent
+    this._extent = {};
+
+    prepareInvertedIndex(this);
+};
+
+function prepareInvertedIndex(list) {
+    var invertedIndicesMap = list._invertedIndicesMap;
+    each$1(invertedIndicesMap, function (invertedIndices, dim) {
+        var dimInfo = list._dimensionInfos[dim];
+
+        // Currently, only dimensions that has ordinalMeta can create inverted indices.
+        var ordinalMeta = dimInfo.ordinalMeta;
+        if (ordinalMeta) {
+            invertedIndices = invertedIndicesMap[dim] = new CtorUint32Array(
+                ordinalMeta.categories.length
+            );
+            // The default value of TypedArray is 0. To avoid miss
+            // mapping to 0, we should set it as NaN.
+            for (var i = 0; i < invertedIndices.length; i++) {
+                invertedIndices[i] = NaN;
+            }
+            for (var i = 0; i < list._count; i++) {
+                // Only support the case that all values are distinct.
+                invertedIndices[list.get(dim, i)] = i;
+            }
+        }
+    });
+}
+
+function getRawValueFromStore(list, dimIndex, rawIndex) {
+    var val;
+    if (dimIndex != null) {
+        var chunkSize = list._chunkSize;
+        var chunkIndex = Math.floor(rawIndex / chunkSize);
+        var chunkOffset = rawIndex % chunkSize;
+        var dim = list.dimensions[dimIndex];
+        var chunk = list._storage[dim][chunkIndex];
+        if (chunk) {
+            val = chunk[chunkOffset];
+            var ordinalMeta = list._dimensionInfos[dim].ordinalMeta;
+            if (ordinalMeta && ordinalMeta.categories.length) {
+                val = ordinalMeta.categories[val];
+            }
+        }
+    }
+    return val;
+}
+
+/**
+ * @return {number}
+ */
+listProto.count = function () {
+    return this._count;
+};
+
+listProto.getIndices = function () {
+    var newIndices;
+
+    var indices = this._indices;
+    if (indices) {
+        var Ctor = indices.constructor;
+        var thisCount = this._count;
+        // `new Array(a, b, c)` is different from `new Uint32Array(a, b, c)`.
+        if (Ctor === Array) {
+            newIndices = new Ctor(thisCount);
+            for (var i = 0; i < thisCount; i++) {
+                newIndices[i] = indices[i];
+            }
+        }
+        else {
+            newIndices = new Ctor(indices.buffer, 0, thisCount);
+        }
+    }
+    else {
+        var Ctor = getIndicesCtor(this);
+        var newIndices = new Ctor(this.count());
+        for (var i = 0; i < newIndices.length; i++) {
+            newIndices[i] = i;
+        }
+    }
+
+    return newIndices;
+};
+
+/**
+ * Get value. Return NaN if idx is out of range.
+ * @param {string} dim Dim must be concrete name.
+ * @param {number} idx
+ * @param {boolean} stack
+ * @return {number}
+ */
+listProto.get = function (dim, idx /*, stack */) {
+    if (!(idx >= 0 && idx < this._count)) {
+        return NaN;
+    }
+    var storage = this._storage;
+    if (!storage[dim]) {
+        // TODO Warn ?
+        return NaN;
+    }
+
+    idx = this.getRawIndex(idx);
+
+    var chunkIndex = Math.floor(idx / this._chunkSize);
+    var chunkOffset = idx % this._chunkSize;
+
+    var chunkStore = storage[dim][chunkIndex];
+    var value = chunkStore[chunkOffset];
+    // FIXME ordinal data type is not stackable
+    // if (stack) {
+    //     var dimensionInfo = this._dimensionInfos[dim];
+    //     if (dimensionInfo && dimensionInfo.stackable) {
+    //         var stackedOn = this.stackedOn;
+    //         while (stackedOn) {
+    //             // Get no stacked data of stacked on
+    //             var stackedValue = stackedOn.get(dim, idx);
+    //             // Considering positive stack, negative stack and empty data
+    //             if ((value >= 0 && stackedValue > 0)  // Positive stack
+    //                 || (value <= 0 && stackedValue < 0) // Negative stack
+    //             ) {
+    //                 value += stackedValue;
+    //             }
+    //             stackedOn = stackedOn.stackedOn;
+    //         }
+    //     }
+    // }
+
+    return value;
+};
+
+/**
+ * @param {string} dim concrete dim
+ * @param {number} rawIndex
+ * @return {number|string}
+ */
+listProto.getByRawIndex = function (dim, rawIdx) {
+    if (!(rawIdx >= 0 && rawIdx < this._rawCount)) {
+        return NaN;
+    }
+    var dimStore = this._storage[dim];
+    if (!dimStore) {
+        // TODO Warn ?
+        return NaN;
+    }
+
+    var chunkIndex = Math.floor(rawIdx / this._chunkSize);
+    var chunkOffset = rawIdx % this._chunkSize;
+    var chunkStore = dimStore[chunkIndex];
+    return chunkStore[chunkOffset];
+};
+
+/**
+ * FIXME Use `get` on chrome maybe slow(in filterSelf and selectRange).
+ * Hack a much simpler _getFast
+ * @private
+ */
+listProto._getFast = function (dim, rawIdx) {
+    var chunkIndex = Math.floor(rawIdx / this._chunkSize);
+    var chunkOffset = rawIdx % this._chunkSize;
+    var chunkStore = this._storage[dim][chunkIndex];
+    return chunkStore[chunkOffset];
+};
+
+/**
+ * Get value for multi dimensions.
+ * @param {Array.<string>} [dimensions] If ignored, using all dimensions.
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.getValues = function (dimensions, idx /*, stack */) {
+    var values = [];
+
+    if (!isArray(dimensions)) {
+        // stack = idx;
+        idx = dimensions;
+        dimensions = this.dimensions;
+    }
+
+    for (var i = 0, len = dimensions.length; i < len; i++) {
+        values.push(this.get(dimensions[i], idx /*, stack */));
+    }
+
+    return values;
+};
+
+/**
+ * If value is NaN. Inlcuding '-'
+ * Only check the coord dimensions.
+ * @param {string} dim
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.hasValue = function (idx) {
+    var dataDimsOnCoord = this._dimensionsSummary.dataDimsOnCoord;
+    var dimensionInfos = this._dimensionInfos;
+    for (var i = 0, len = dataDimsOnCoord.length; i < len; i++) {
+        if (
+            // Ordinal type can be string or number
+            dimensionInfos[dataDimsOnCoord[i]].type !== 'ordinal'
+            // FIXME check ordinal when using index?
+            && isNaN(this.get(dataDimsOnCoord[i], idx))
+        ) {
+            return false;
+        }
+    }
+    return true;
+};
+
+/**
+ * Get extent of data in one dimension
+ * @param {string} dim
+ * @param {boolean} stack
+ */
+listProto.getDataExtent = function (dim /*, stack */) {
+    // Make sure use concrete dim as cache name.
+    dim = this.getDimension(dim);
+    var dimData = this._storage[dim];
+    var initialExtent = getInitialExtent();
+
+    // stack = !!((stack || false) && this.getCalculationInfo(dim));
+
+    if (!dimData) {
+        return initialExtent;
+    }
+
+    // Make more strict checkings to ensure hitting cache.
+    var currEnd = this.count();
+    // var cacheName = [dim, !!stack].join('_');
+    // var cacheName = dim;
+
+    // Consider the most cases when using data zoom, `getDataExtent`
+    // happened before filtering. We cache raw extent, which is not
+    // necessary to be cleared and recalculated when restore data.
+    var useRaw = !this._indices; // && !stack;
+    var dimExtent;
+
+    if (useRaw) {
+        return this._rawExtent[dim].slice();
+    }
+    dimExtent = this._extent[dim];
+    if (dimExtent) {
+        return dimExtent.slice();
+    }
+    dimExtent = initialExtent;
+
+    var min = dimExtent[0];
+    var max = dimExtent[1];
+
+    for (var i = 0; i < currEnd; i++) {
+        // var value = stack ? this.get(dim, i, true) : this._getFast(dim, this.getRawIndex(i));
+        var value = this._getFast(dim, this.getRawIndex(i));
+        value < min && (min = value);
+        value > max && (max = value);
+    }
+
+    dimExtent = [min, max];
+
+    this._extent[dim] = dimExtent;
+
+    return dimExtent;
+};
+
+/**
+ * Optimize for the scenario that data is filtered by a given extent.
+ * Consider that if data amount is more than hundreds of thousand,
+ * extent calculation will cost more than 10ms and the cache will
+ * be erased because of the filtering.
+ */
+listProto.getApproximateExtent = function (dim /*, stack */) {
+    dim = this.getDimension(dim);
+    return this._approximateExtent[dim] || this.getDataExtent(dim /*, stack */);
+};
+
+listProto.setApproximateExtent = function (extent, dim /*, stack */) {
+    dim = this.getDimension(dim);
+    this._approximateExtent[dim] = extent.slice();
+};
+
+/**
+ * @param {string} key
+ * @return {*}
+ */
+listProto.getCalculationInfo = function (key) {
+    return this._calculationInfo[key];
+};
+
+/**
+ * @param {string|Object} key or k-v object
+ * @param {*} [value]
+ */
+listProto.setCalculationInfo = function (key, value) {
+    isObject$4(key)
+        ? extend(this._calculationInfo, key)
+        : (this._calculationInfo[key] = value);
+};
+
+/**
+ * Get sum of data in one dimension
+ * @param {string} dim
+ */
+listProto.getSum = function (dim /*, stack */) {
+    var dimData = this._storage[dim];
+    var sum = 0;
+    if (dimData) {
+        for (var i = 0, len = this.count(); i < len; i++) {
+            var value = this.get(dim, i /*, stack */);
+            if (!isNaN(value)) {
+                sum += value;
+            }
+        }
+    }
+    return sum;
+};
+
+/**
+ * Get median of data in one dimension
+ * @param {string} dim
+ */
+listProto.getMedian = function (dim /*, stack */) {
+    var dimDataArray = [];
+    // map all data of one dimension
+    this.each(dim, function (val, idx) {
+        if (!isNaN(val)) {
+            dimDataArray.push(val);
+        }
+    });
+
+    // TODO
+    // Use quick select?
+
+    // immutability & sort
+    var sortedDimDataArray = [].concat(dimDataArray).sort(function(a, b) {
+        return a - b;
+    });
+    var len = this.count();
+    // calculate median
+    return len === 0 ? 0 :
+        len % 2 === 1 ? sortedDimDataArray[(len - 1) / 2] :
+            (sortedDimDataArray[len / 2] + sortedDimDataArray[len / 2 - 1]) / 2;
+};
+
+// /**
+//  * Retreive the index with given value
+//  * @param {string} dim Concrete dimension.
+//  * @param {number} value
+//  * @return {number}
+//  */
+// Currently incorrect: should return dataIndex but not rawIndex.
+// Do not fix it until this method is to be used somewhere.
+// FIXME Precision of float value
+// listProto.indexOf = function (dim, value) {
+//     var storage = this._storage;
+//     var dimData = storage[dim];
+//     var chunkSize = this._chunkSize;
+//     if (dimData) {
+//         for (var i = 0, len = this.count(); i < len; i++) {
+//             var chunkIndex = Math.floor(i / chunkSize);
+//             var chunkOffset = i % chunkSize;
+//             if (dimData[chunkIndex][chunkOffset] === value) {
+//                 return i;
+//             }
+//         }
+//     }
+//     return -1;
+// };
+
+/**
+ * Only support the dimension which inverted index created.
+ * Do not support other cases until required.
+ * @param {string} concrete dim
+ * @param {number|string} value
+ * @return {number} rawIndex
+ */
+listProto.rawIndexOf = function (dim, value) {
+    var invertedIndices = dim && this._invertedIndicesMap[dim];
+    if (__DEV__) {
+        if (!invertedIndices) {
+            throw new Error('Do not supported yet');
+        }
+    }
+    var rawIndex = invertedIndices[value];
+    if (rawIndex == null || isNaN(rawIndex)) {
+        return -1;
+    }
+    return rawIndex;
+};
+
+/**
+ * Retreive the index with given name
+ * @param {number} idx
+ * @param {number} name
+ * @return {number}
+ */
+listProto.indexOfName = function (name) {
+    for (var i = 0, len = this.count(); i < len; i++) {
+        if (this.getName(i) === name) {
+            return i;
+        }
+    }
+
+    return -1;
+};
+
+/**
+ * Retreive the index with given raw data index
+ * @param {number} idx
+ * @param {number} name
+ * @return {number}
+ */
+listProto.indexOfRawIndex = function (rawIndex) {
+    if (!this._indices) {
+        return rawIndex;
+    }
+
+    if (rawIndex >= this._rawCount || rawIndex < 0) {
+        return -1;
+    }
+
+    // Indices are ascending
+    var indices = this._indices;
+
+    // If rawIndex === dataIndex
+    var rawDataIndex = indices[rawIndex];
+    if (rawDataIndex != null && rawDataIndex < this._count && rawDataIndex === rawIndex) {
+        return rawIndex;
+    }
+
+    var left = 0;
+    var right = this._count - 1;
+    while (left <= right) {
+        var mid = (left + right) / 2 | 0;
+        if (indices[mid] < rawIndex) {
+            left = mid + 1;
+        }
+        else if (indices[mid] > rawIndex) {
+            right = mid - 1;
+        }
+        else {
+            return mid;
+        }
+    }
+    return -1;
+};
+
+/**
+ * Retreive the index of nearest value
+ * @param {string} dim
+ * @param {number} value
+ * @param {number} [maxDistance=Infinity]
+ * @return {Array.<number>} Considere multiple points has the same value.
+ */
+listProto.indicesOfNearest = function (dim, value, maxDistance) {
+    var storage = this._storage;
+    var dimData = storage[dim];
+    var nearestIndices = [];
+
+    if (!dimData) {
+        return nearestIndices;
+    }
+
+    if (maxDistance == null) {
+        maxDistance = Infinity;
+    }
+
+    var minDist = Number.MAX_VALUE;
+    var minDiff = -1;
+    for (var i = 0, len = this.count(); i < len; i++) {
+        var diff = value - this.get(dim, i /*, stack */);
+        var dist = Math.abs(diff);
+        if (diff <= maxDistance && dist <= minDist) {
+            // For the case of two data are same on xAxis, which has sequence data.
+            // Show the nearest index
+            // https://github.com/ecomfe/echarts/issues/2869
+            if (dist < minDist || (diff >= 0 && minDiff < 0)) {
+                minDist = dist;
+                minDiff = diff;
+                nearestIndices.length = 0;
+            }
+            nearestIndices.push(i);
+        }
+    }
+    return nearestIndices;
+};
+
+/**
+ * Get raw data index
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.getRawIndex = getRawIndexWithoutIndices;
+
+function getRawIndexWithoutIndices(idx) {
+    return idx;
+}
+
+function getRawIndexWithIndices(idx) {
+    if (idx < this._count && idx >= 0) {
+        return this._indices[idx];
+    }
+    return -1;
+}
+
+/**
+ * Get raw data item
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.getRawDataItem = function (idx) {
+    if (!this._rawData.persistent) {
+        var val = [];
+        for (var i = 0; i < this.dimensions.length; i++) {
+            var dim = this.dimensions[i];
+            val.push(this.get(dim, idx));
+        }
+        return val;
+    }
+    else {
+        return this._rawData.getItem(this.getRawIndex(idx));
+    }
+};
+
+/**
+ * @param {number} idx
+ * @param {boolean} [notDefaultIdx=false]
+ * @return {string}
+ */
+listProto.getName = function (idx) {
+    var rawIndex = this.getRawIndex(idx);
+    return this._nameList[rawIndex]
+        || getRawValueFromStore(this, this._nameDimIdx, rawIndex)
+        || '';
+};
+
+/**
+ * @param {number} idx
+ * @param {boolean} [notDefaultIdx=false]
+ * @return {string}
+ */
+listProto.getId = function (idx) {
+    return getId(this, this.getRawIndex(idx));
+};
+
+function getId(list, rawIndex) {
+    var id = list._idList[rawIndex];
+    if (id == null) {
+        id = getRawValueFromStore(list, list._idDimIdx, rawIndex);
+    }
+    if (id == null) {
+        // FIXME Check the usage in graph, should not use prefix.
+        id = ID_PREFIX + rawIndex;
+    }
+    return id;
+}
+
+function normalizeDimensions(dimensions) {
+    if (!isArray(dimensions)) {
+        dimensions = [dimensions];
+    }
+    return dimensions;
+}
+
+function validateDimensions(list, dims) {
+    for (var i = 0; i < dims.length; i++) {
+        // stroage may be empty when no data, so use
+        // dimensionInfos to check.
+        if (!list._dimensionInfos[dims[i]]) {
+            console.error('Unkown dimension ' + dims[i]);
+        }
+    }
+}
+
+/**
+ * Data iteration
+ * @param {string|Array.<string>}
+ * @param {Function} cb
+ * @param {*} [context=this]
+ *
+ * @example
+ *  list.each('x', function (x, idx) {});
+ *  list.each(['x', 'y'], function (x, y, idx) {});
+ *  list.each(function (idx) {})
+ */
+listProto.each = function (dims, cb, context, contextCompat) {
+    'use strict';
+
+    if (!this._count) {
+        return;
+    }
+
+    if (typeof dims === 'function') {
+        contextCompat = context;
+        context = cb;
+        cb = dims;
+        dims = [];
+    }
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    dims = map(normalizeDimensions(dims), this.getDimension, this);
+
+    if (__DEV__) {
+        validateDimensions(this, dims);
+    }
+
+    var dimSize = dims.length;
+
+    for (var i = 0; i < this.count(); i++) {
+        // Simple optimization
+        switch (dimSize) {
+            case 0:
+                cb.call(context, i);
+                break;
+            case 1:
+                cb.call(context, this.get(dims[0], i), i);
+                break;
+            case 2:
+                cb.call(context, this.get(dims[0], i), this.get(dims[1], i), i);
+                break;
+            default:
+                var k = 0;
+                var value = [];
+                for (; k < dimSize; k++) {
+                    value[k] = this.get(dims[k], i);
+                }
+                // Index
+                value[k] = i;
+                cb.apply(context, value);
+        }
+    }
+};
+
+/**
+ * Data filter
+ * @param {string|Array.<string>}
+ * @param {Function} cb
+ * @param {*} [context=this]
+ */
+listProto.filterSelf = function (dimensions, cb, context, contextCompat) {
+    'use strict';
+
+    if (!this._count) {
+        return;
+    }
+
+    if (typeof dimensions === 'function') {
+        contextCompat = context;
+        context = cb;
+        cb = dimensions;
+        dimensions = [];
+    }
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    dimensions = map(
+        normalizeDimensions(dimensions), this.getDimension, this
+    );
+
+    if (__DEV__) {
+        validateDimensions(this, dimensions);
+    }
+
+
+    var count = this.count();
+    var Ctor = getIndicesCtor(this);
+    var newIndices = new Ctor(count);
+    var value = [];
+    var dimSize = dimensions.length;
+
+    var offset = 0;
+    var dim0 = dimensions[0];
+
+    for (var i = 0; i < count; i++) {
+        var keep;
+        var rawIdx = this.getRawIndex(i);
+        // Simple optimization
+        if (dimSize === 0) {
+            keep = cb.call(context, i);
+        }
+        else if (dimSize === 1) {
+            var val = this._getFast(dim0, rawIdx);
+            keep = cb.call(context, val, i);
+        }
+        else {
+            for (var k = 0; k < dimSize; k++) {
+                value[k] = this._getFast(dim0, rawIdx);
+            }
+            value[k] = i;
+            keep = cb.apply(context, value);
+        }
+        if (keep) {
+            newIndices[offset++] = rawIdx;
+        }
+    }
+
+    // Set indices after filtered.
+    if (offset < count) {
+        this._indices = newIndices;
+    }
+    this._count = offset;
+    // Reset data extent
+    this._extent = {};
+
+    this.getRawIndex = this._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    return this;
+};
+
+/**
+ * Select data in range. (For optimization of filter)
+ * (Manually inline code, support 5 million data filtering in data zoom.)
+ */
+listProto.selectRange = function (range) {
+    'use strict';
+
+    if (!this._count) {
+        return;
+    }
+
+    var dimensions = [];
+    for (var dim in range) {
+        if (range.hasOwnProperty(dim)) {
+            dimensions.push(dim);
+        }
+    }
+
+    if (__DEV__) {
+        validateDimensions(this, dimensions);
+    }
+
+    var dimSize = dimensions.length;
+    if (!dimSize) {
+        return;
+    }
+
+    var originalCount = this.count();
+    var Ctor = getIndicesCtor(this);
+    var newIndices = new Ctor(originalCount);
+
+    var offset = 0;
+    var dim0 = dimensions[0];
+
+    var min = range[dim0][0];
+    var max = range[dim0][1];
+
+    var quickFinished = false;
+    if (!this._indices) {
+        // Extreme optimization for common case. About 2x faster in chrome.
+        var idx = 0;
+        if (dimSize === 1) {
+            var dimStorage = this._storage[dimensions[0]];
+            for (var k = 0; k < this._chunkCount; k++) {
+                var chunkStorage = dimStorage[k];
+                var len = Math.min(this._count - k * this._chunkSize, this._chunkSize);
+                for (var i = 0; i < len; i++) {
+                    var val = chunkStorage[i];
+                    // NaN will not be filtered. Consider the case, in line chart, empty
+                    // value indicates the line should be broken. But for the case like
+                    // scatter plot, a data item with empty value will not be rendered,
+                    // but the axis extent may be effected if some other dim of the data
+                    // item has value. Fortunately it is not a significant negative effect.
+                    if (
+                        (val >= min && val <= max) || isNaN(val)
+                    ) {
+                        newIndices[offset++] = idx;
+                    }
+                    idx++;
+                }
+            }
+            quickFinished = true;
+        }
+        else if (dimSize === 2) {
+            var dimStorage = this._storage[dim0];
+            var dimStorage2 = this._storage[dimensions[1]];
+            var min2 = range[dimensions[1]][0];
+            var max2 = range[dimensions[1]][1];
+            for (var k = 0; k < this._chunkCount; k++) {
+                var chunkStorage = dimStorage[k];
+                var chunkStorage2= dimStorage2[k];
+                var len = Math.min(this._count - k * this._chunkSize, this._chunkSize);
+                for (var i = 0; i < len; i++) {
+                    var val = chunkStorage[i];
+                    var val2 = chunkStorage2[i];
+                    // Do not filter NaN, see comment above.
+                    if ((
+                            (val >= min && val <= max) || isNaN(val)
+                        )
+                        && (
+                            (val2 >= min2 && val2 <= max2) || isNaN(val2)
+                        )
+                    ) {
+                        newIndices[offset++] = idx;
+                    }
+                    idx++;
+                }
+            }
+            quickFinished = true;
+        }
+    }
+    if (!quickFinished) {
+        if (dimSize === 1) {
+            for (var i = 0; i < originalCount; i++) {
+                var rawIndex = this.getRawIndex(i);
+                var val = this._getFast(dim0, rawIndex);
+                // Do not filter NaN, see comment above.
+                if (
+                    (val >= min && val <= max) || isNaN(val)
+                ) {
+                    newIndices[offset++] = rawIndex;
+                }
+            }
+        }
+        else {
+            for (var i = 0; i < originalCount; i++) {
+                var keep = true;
+                var rawIndex = this.getRawIndex(i);
+                for (var k = 0; k < dimSize; k++) {
+                    var dimk = dimensions[k];
+                    var val = this._getFast(dim, rawIndex);
+                    // Do not filter NaN, see comment above.
+                    if (val < range[dimk][0] || val > range[dimk][1]) {
+                        keep = false;
+                    }
+                }
+                if (keep) {
+                    newIndices[offset++] = this.getRawIndex(i);
+                }
+            }
+        }
+    }
+
+    // Set indices after filtered.
+    if (offset < originalCount) {
+        this._indices = newIndices;
+    }
+    this._count = offset;
+    // Reset data extent
+    this._extent = {};
+
+    this.getRawIndex = this._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    return this;
+};
+
+/**
+ * Data mapping to a plain array
+ * @param {string|Array.<string>} [dimensions]
+ * @param {Function} cb
+ * @param {*} [context=this]
+ * @return {Array}
+ */
+listProto.mapArray = function (dimensions, cb, context, contextCompat) {
+    'use strict';
+
+    if (typeof dimensions === 'function') {
+        contextCompat = context;
+        context = cb;
+        cb = dimensions;
+        dimensions = [];
+    }
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    var result = [];
+    this.each(dimensions, function () {
+        result.push(cb && cb.apply(this, arguments));
+    }, context);
+    return result;
+};
+
+// Data in excludeDimensions is copied, otherwise transfered.
+function cloneListForMapAndSample(original, excludeDimensions) {
+    var allDimensions = original.dimensions;
+    var list = new List(
+        map(allDimensions, original.getDimensionInfo, original),
+        original.hostModel
+    );
+    // FIXME If needs stackedOn, value may already been stacked
+    transferProperties(list, original);
+
+    var storage = list._storage = {};
+    var originalStorage = original._storage;
+
+    // Init storage
+    for (var i = 0; i < allDimensions.length; i++) {
+        var dim = allDimensions[i];
+        if (originalStorage[dim]) {
+            // Notice that we do not reset invertedIndicesMap here, becuase
+            // there is no scenario of mapping or sampling ordinal dimension.
+            if (indexOf(excludeDimensions, dim) >= 0) {
+                storage[dim] = cloneDimStore(originalStorage[dim]);
+                list._rawExtent[dim] = getInitialExtent();
+                list._extent[dim] = null;
+            }
+            else {
+                // Direct reference for other dimensions
+                storage[dim] = originalStorage[dim];
+            }
+        }
+    }
+    return list;
+}
+
+function cloneDimStore(originalDimStore) {
+    var newDimStore = new Array(originalDimStore.length);
+    for (var j = 0; j < originalDimStore.length; j++) {
+        newDimStore[j] = cloneChunk(originalDimStore[j]);
+    }
+    return newDimStore;
+}
+
+function getInitialExtent() {
+    return [Infinity, -Infinity];
+}
+
+/**
+ * Data mapping to a new List with given dimensions
+ * @param {string|Array.<string>} dimensions
+ * @param {Function} cb
+ * @param {*} [context=this]
+ * @return {Array}
+ */
+listProto.map = function (dimensions, cb, context, contextCompat) {
+    'use strict';
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    dimensions = map(
+        normalizeDimensions(dimensions), this.getDimension, this
+    );
+
+    if (__DEV__) {
+        validateDimensions(this, dimensions);
+    }
+
+    var list = cloneListForMapAndSample(this, dimensions);
+
+    // Following properties are all immutable.
+    // So we can reference to the same value
+    list._indices = this._indices;
+    list.getRawIndex = list._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    var storage = list._storage;
+
+    var tmpRetValue = [];
+    var chunkSize = this._chunkSize;
+    var dimSize = dimensions.length;
+    var dataCount = this.count();
+    var values = [];
+    var rawExtent = list._rawExtent;
+
+    for (var dataIndex = 0; dataIndex < dataCount; dataIndex++) {
+        for (var dimIndex = 0; dimIndex < dimSize; dimIndex++) {
+            values[dimIndex] = this.get(dimensions[dimIndex], dataIndex /*, stack */);
+        }
+        values[dimSize] = dataIndex;
+
+        var retValue = cb && cb.apply(context, values);
+        if (retValue != null) {
+            // a number or string (in oridinal dimension)?
+            if (typeof retValue !== 'object') {
+                tmpRetValue[0] = retValue;
+                retValue = tmpRetValue;
+            }
+
+            var rawIndex = this.getRawIndex(dataIndex);
+            var chunkIndex = Math.floor(rawIndex / chunkSize);
+            var chunkOffset = rawIndex % chunkSize;
+
+            for (var i = 0; i < retValue.length; i++) {
+                var dim = dimensions[i];
+                var val = retValue[i];
+                var rawExtentOnDim = rawExtent[dim];
+
+                var dimStore = storage[dim];
+                if (dimStore) {
+                    dimStore[chunkIndex][chunkOffset] = val;
+                }
+
+                if (val < rawExtentOnDim[0]) {
+                    rawExtentOnDim[0] = val;
+                }
+                if (val > rawExtentOnDim[1]) {
+                    rawExtentOnDim[1] = val;
+                }
+            }
+        }
+    }
+
+    return list;
+};
+
+/**
+ * Large data down sampling on given dimension
+ * @param {string} dimension
+ * @param {number} rate
+ * @param {Function} sampleValue
+ * @param {Function} sampleIndex Sample index for name and id
+ */
+listProto.downSample = function (dimension, rate, sampleValue, sampleIndex) {
+    var list = cloneListForMapAndSample(this, [dimension]);
+    var targetStorage = list._storage;
+
+    var frameValues = [];
+    var frameSize = Math.floor(1 / rate);
+
+    var dimStore = targetStorage[dimension];
+    var len = this.count();
+    var chunkSize = this._chunkSize;
+    var rawExtentOnDim = list._rawExtent[dimension];
+
+    var newIndices = new (getIndicesCtor(this))(len);
+
+    var offset = 0;
+    for (var i = 0; i < len; i += frameSize) {
+        // Last frame
+        if (frameSize > len - i) {
+            frameSize = len - i;
+            frameValues.length = frameSize;
+        }
+        for (var k = 0; k < frameSize; k++) {
+            var dataIdx = this.getRawIndex(i + k);
+            var originalChunkIndex = Math.floor(dataIdx / chunkSize);
+            var originalChunkOffset = dataIdx % chunkSize;
+            frameValues[k] = dimStore[originalChunkIndex][originalChunkOffset];
+        }
+        var value = sampleValue(frameValues);
+        var sampleFrameIdx = this.getRawIndex(
+            Math.min(i + sampleIndex(frameValues, value) || 0, len - 1)
+        );
+        var sampleChunkIndex = Math.floor(sampleFrameIdx / chunkSize);
+        var sampleChunkOffset = sampleFrameIdx % chunkSize;
+        // Only write value on the filtered data
+        dimStore[sampleChunkIndex][sampleChunkOffset] = value;
+
+        if (value < rawExtentOnDim[0]) {
+            rawExtentOnDim[0] = value;
+        }
+        if (value > rawExtentOnDim[1]) {
+            rawExtentOnDim[1] = value;
+        }
+
+        newIndices[offset++] = sampleFrameIdx;
+    }
+
+    list._count = offset;
+    list._indices = newIndices;
+
+    list.getRawIndex = getRawIndexWithIndices;
+
+    return list;
+};
+
+/**
+ * Get model of one data item.
+ *
+ * @param {number} idx
+ */
+// FIXME Model proxy ?
+listProto.getItemModel = function (idx) {
+    var hostModel = this.hostModel;
+    return new Model(this.getRawDataItem(idx), hostModel, hostModel && hostModel.ecModel);
+};
+
+/**
+ * Create a data differ
+ * @param {module:echarts/data/List} otherList
+ * @return {module:echarts/data/DataDiffer}
+ */
+listProto.diff = function (otherList) {
+    var thisList = this;
+
+    return new DataDiffer(
+        otherList ? otherList.getIndices() : [],
+        this.getIndices(),
+        function (idx) {
+            return getId(otherList, idx);
+        },
+        function (idx) {
+            return getId(thisList, idx);
+        }
+    );
+};
+/**
+ * Get visual property.
+ * @param {string} key
+ */
+listProto.getVisual = function (key) {
+    var visual = this._visual;
+    return visual && visual[key];
+};
+
+/**
+ * Set visual property
+ * @param {string|Object} key
+ * @param {*} [value]
+ *
+ * @example
+ *  setVisual('color', color);
+ *  setVisual({
+ *      'color': color
+ *  });
+ */
+listProto.setVisual = function (key, val) {
+    if (isObject$4(key)) {
+        for (var name in key) {
+            if (key.hasOwnProperty(name)) {
+                this.setVisual(name, key[name]);
+            }
+        }
+        return;
+    }
+    this._visual = this._visual || {};
+    this._visual[key] = val;
+};
+
+/**
+ * Set layout property.
+ * @param {string|Object} key
+ * @param {*} [val]
+ */
+listProto.setLayout = function (key, val) {
+    if (isObject$4(key)) {
+        for (var name in key) {
+            if (key.hasOwnProperty(name)) {
+                this.setLayout(name, key[name]);
+            }
+        }
+        return;
+    }
+    this._layout[key] = val;
+};
+
+/**
+ * Get layout property.
+ * @param  {string} key.
+ * @return {*}
+ */
+listProto.getLayout = function (key) {
+    return this._layout[key];
+};
+
+/**
+ * Get layout of single data item
+ * @param {number} idx
+ */
+listProto.getItemLayout = function (idx) {
+    return this._itemLayouts[idx];
+};
+
+/**
+ * Set layout of single data item
+ * @param {number} idx
+ * @param {Object} layout
+ * @param {boolean=} [merge=false]
+ */
+listProto.setItemLayout = function (idx, layout, merge$$1) {
+    this._itemLayouts[idx] = merge$$1
+        ? extend(this._itemLayouts[idx] || {}, layout)
+        : layout;
+};
+
+/**
+ * Clear all layout of single data item
+ */
+listProto.clearItemLayouts = function () {
+    this._itemLayouts.length = 0;
+};
+
+/**
+ * Get visual property of single data item
+ * @param {number} idx
+ * @param {string} key
+ * @param {boolean} [ignoreParent=false]
+ */
+listProto.getItemVisual = function (idx, key, ignoreParent) {
+    var itemVisual = this._itemVisuals[idx];
+    var val = itemVisual && itemVisual[key];
+    if (val == null && !ignoreParent) {
+        // Use global visual property
+        return this.getVisual(key);
+    }
+    return val;
+};
+
+/**
+ * Set visual property of single data item
+ *
+ * @param {number} idx
+ * @param {string|Object} key
+ * @param {*} [value]
+ *
+ * @example
+ *  setItemVisual(0, 'color', color);
+ *  setItemVisual(0, {
+ *      'color': color
+ *  });
+ */
+listProto.setItemVisual = function (idx, key, value) {
+    var itemVisual = this._itemVisuals[idx] || {};
+    var hasItemVisual = this.hasItemVisual;
+    this._itemVisuals[idx] = itemVisual;
+
+    if (isObject$4(key)) {
+        for (var name in key) {
+            if (key.hasOwnProperty(name)) {
+                itemVisual[name] = key[name];
+                hasItemVisual[name] = true;
+            }
+        }
+        return;
+    }
+    itemVisual[key] = value;
+    hasItemVisual[key] = true;
+};
+
+/**
+ * Clear itemVisuals and list visual.
+ */
+listProto.clearAllVisual = function () {
+    this._visual = {};
+    this._itemVisuals = [];
+    this.hasItemVisual = {};
+};
+
+var setItemDataAndSeriesIndex = function (child) {
+    child.seriesIndex = this.seriesIndex;
+    child.dataIndex = this.dataIndex;
+    child.dataType = this.dataType;
+};
+/**
+ * Set graphic element relative to data. It can be set as null
+ * @param {number} idx
+ * @param {module:zrender/Element} [el]
+ */
+listProto.setItemGraphicEl = function (idx, el) {
+    var hostModel = this.hostModel;
+
+    if (el) {
+        // Add data index and series index for indexing the data by element
+        // Useful in tooltip
+        el.dataIndex = idx;
+        el.dataType = this.dataType;
+        el.seriesIndex = hostModel && hostModel.seriesIndex;
+        if (el.type === 'group') {
+            el.traverse(setItemDataAndSeriesIndex, el);
+        }
+    }
+
+    this._graphicEls[idx] = el;
+};
+
+/**
+ * @param {number} idx
+ * @return {module:zrender/Element}
+ */
+listProto.getItemGraphicEl = function (idx) {
+    return this._graphicEls[idx];
+};
+
+/**
+ * @param {Function} cb
+ * @param {*} context
+ */
+listProto.eachItemGraphicEl = function (cb, context) {
+    each$1(this._graphicEls, function (el, idx) {
+        if (el) {
+            cb && cb.call(context, el, idx);
+        }
+    });
+};
+
+/**
+ * Shallow clone a new list except visual and layout properties, and graph elements.
+ * New list only change the indices.
+ */
+listProto.cloneShallow = function (list) {
+    if (!list) {
+        var dimensionInfoList = map(this.dimensions, this.getDimensionInfo, this);
+        list = new List(dimensionInfoList, this.hostModel);
+    }
+
+    // FIXME
+    list._storage = this._storage;
+
+    transferProperties(list, this);
+
+    // Clone will not change the data extent and indices
+    if (this._indices) {
+        var Ctor = this._indices.constructor;
+        list._indices = new Ctor(this._indices);
+    }
+    else {
+        list._indices = null;
+    }
+    list.getRawIndex = list._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    return list;
+};
+
+/**
+ * Wrap some method to add more feature
+ * @param {string} methodName
+ * @param {Function} injectFunction
+ */
+listProto.wrapMethod = function (methodName, injectFunction) {
+    var originalMethod = this[methodName];
+    if (typeof originalMethod !== 'function') {
+        return;
+    }
+    this.__wrappedMethods = this.__wrappedMethods || [];
+    this.__wrappedMethods.push(methodName);
+    this[methodName] = function () {
+        var res = originalMethod.apply(this, arguments);
+        return injectFunction.apply(this, [res].concat(slice(arguments)));
+    };
+};
+
+// Methods that create a new list based on this list should be listed here.
+// Notice that those method should `RETURN` the new list.
+listProto.TRANSFERABLE_METHODS = ['cloneShallow', 'downSample', 'map'];
+// Methods that change indices of this list should be listed here.
+listProto.CHANGABLE_METHODS = ['filterSelf', 'selectRange'];
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @deprecated
+ * Use `echarts/data/helper/createDimensions` instead.
+ */
+
+/**
+ * @see {module:echarts/test/ut/spec/data/completeDimensions}
+ *
+ * Complete the dimensions array, by user defined `dimension` and `encode`,
+ * and guessing from the data structure.
+ * If no 'value' dimension specified, the first no-named dimension will be
+ * named as 'value'.
+ *
+ * @param {Array.<string>} sysDims Necessary dimensions, like ['x', 'y'], which
+ *      provides not only dim template, but also default order.
+ *      properties: 'name', 'type', 'displayName'.
+ *      `name` of each item provides default coord name.
+ *      [{dimsDef: [string|Object, ...]}, ...] dimsDef of sysDim item provides default dim name, and
+ *                                    provide dims count that the sysDim required.
+ *      [{ordinalMeta}] can be specified.
+ * @param {module:echarts/data/Source|Array|Object} source or data (for compatibal with pervious)
+ * @param {Object} [opt]
+ * @param {Array.<Object|string>} [opt.dimsDef] option.series.dimensions User defined dimensions
+ *      For example: ['asdf', {name, type}, ...].
+ * @param {Object|HashMap} [opt.encodeDef] option.series.encode {x: 2, y: [3, 1], tooltip: [1, 2], label: 3}
+ * @param {string} [opt.generateCoord] Generate coord dim with the given name.
+ *                 If not specified, extra dim names will be:
+ *                 'value', 'value0', 'value1', ...
+ * @param {number} [opt.generateCoordCount] By default, the generated dim name is `generateCoord`.
+ *                 If `generateCoordCount` specified, the generated dim names will be:
+ *                 `generateCoord` + 0, `generateCoord` + 1, ...
+ *                 can be Infinity, indicate that use all of the remain columns.
+ * @param {number} [opt.dimCount] If not specified, guess by the first data item.
+ * @param {number} [opt.encodeDefaulter] If not specified, auto find the next available data dim.
+ * @return {Array.<Object>} [{
+ *      name: string mandatory,
+ *      displayName: string, the origin name in dimsDef, see source helper.
+ *                 If displayName given, the tooltip will displayed vertically.
+ *      coordDim: string mandatory,
+ *      coordDimIndex: number mandatory,
+ *      type: string optional,
+ *      otherDims: { never null/undefined
+ *          tooltip: number optional,
+ *          label: number optional,
+ *          itemName: number optional,
+ *          seriesName: number optional,
+ *      },
+ *      isExtraCoord: boolean true if coord is generated
+ *          (not specified in encode and not series specified)
+ *      other props ...
+ * }]
+ */
+function completeDimensions(sysDims, source, opt) {
+    if (!Source.isInstance(source)) {
+        source = Source.seriesDataToSource(source);
+    }
+
+    opt = opt || {};
+    sysDims = (sysDims || []).slice();
+    var dimsDef = (opt.dimsDef || []).slice();
+    var encodeDef = createHashMap(opt.encodeDef);
+    var dataDimNameMap = createHashMap();
+    var coordDimNameMap = createHashMap();
+    // var valueCandidate;
+    var result = [];
+
+    var dimCount = getDimCount(source, sysDims, dimsDef, opt.dimCount);
+
+    // Apply user defined dims (`name` and `type`) and init result.
+    for (var i = 0; i < dimCount; i++) {
+        var dimDefItem = dimsDef[i] = extend(
+            {}, isObject$1(dimsDef[i]) ? dimsDef[i] : {name: dimsDef[i]}
+        );
+        var userDimName = dimDefItem.name;
+        var resultItem = result[i] = {otherDims: {}};
+        // Name will be applied later for avoiding duplication.
+        if (userDimName != null && dataDimNameMap.get(userDimName) == null) {
+            // Only if `series.dimensions` is defined in option
+            // displayName, will be set, and dimension will be diplayed vertically in
+            // tooltip by default.
+            resultItem.name = resultItem.displayName = userDimName;
+            dataDimNameMap.set(userDimName, i);
+        }
+        dimDefItem.type != null && (resultItem.type = dimDefItem.type);
+        dimDefItem.displayName != null && (resultItem.displayName = dimDefItem.displayName);
+    }
+
+    // Set `coordDim` and `coordDimIndex` by `encodeDef` and normalize `encodeDef`.
+    encodeDef.each(function (dataDims, coordDim) {
+        dataDims = normalizeToArray(dataDims).slice();
+        var validDataDims = encodeDef.set(coordDim, []);
+        each$1(dataDims, function (resultDimIdx, idx) {
+            // The input resultDimIdx can be dim name or index.
+            isString(resultDimIdx) && (resultDimIdx = dataDimNameMap.get(resultDimIdx));
+            if (resultDimIdx != null && resultDimIdx < dimCount) {
+                validDataDims[idx] = resultDimIdx;
+                applyDim(result[resultDimIdx], coordDim, idx);
+            }
+        });
+    });
+
+    // Apply templetes and default order from `sysDims`.
+    var availDimIdx = 0;
+    each$1(sysDims, function (sysDimItem, sysDimIndex) {
+        var coordDim;
+        var sysDimItem;
+        var sysDimItemDimsDef;
+        var sysDimItemOtherDims;
+        if (isString(sysDimItem)) {
+            coordDim = sysDimItem;
+            sysDimItem = {};
+        }
+        else {
+            coordDim = sysDimItem.name;
+            var ordinalMeta = sysDimItem.ordinalMeta;
+            sysDimItem.ordinalMeta = null;
+            sysDimItem = clone(sysDimItem);
+            sysDimItem.ordinalMeta = ordinalMeta;
+            // `coordDimIndex` should not be set directly.
+            sysDimItemDimsDef = sysDimItem.dimsDef;
+            sysDimItemOtherDims = sysDimItem.otherDims;
+            sysDimItem.name = sysDimItem.coordDim = sysDimItem.coordDimIndex
+                = sysDimItem.dimsDef = sysDimItem.otherDims = null;
+        }
+
+        var dataDims = normalizeToArray(encodeDef.get(coordDim));
+        // dimensions provides default dim sequences.
+        if (!dataDims.length) {
+            for (var i = 0; i < (sysDimItemDimsDef && sysDimItemDimsDef.length || 1); i++) {
+                while (availDimIdx < result.length && result[availDimIdx].coordDim != null) {
+                    availDimIdx++;
+                }
+                availDimIdx < result.length && dataDims.push(availDimIdx++);
+            }
+        }
+
+        // Apply templates.
+        each$1(dataDims, function (resultDimIdx, coordDimIndex) {
+            var resultItem = result[resultDimIdx];
+            applyDim(defaults(resultItem, sysDimItem), coordDim, coordDimIndex);
+            if (resultItem.name == null && sysDimItemDimsDef) {
+                var sysDimItemDimsDefItem = sysDimItemDimsDef[coordDimIndex];
+                !isObject$1(sysDimItemDimsDefItem) && (sysDimItemDimsDefItem = {name: sysDimItemDimsDefItem});
+                resultItem.name = resultItem.displayName = sysDimItemDimsDefItem.name;
+                resultItem.defaultTooltip = sysDimItemDimsDefItem.defaultTooltip;
+            }
+            // FIXME refactor, currently only used in case: {otherDims: {tooltip: false}}
+            sysDimItemOtherDims && defaults(resultItem.otherDims, sysDimItemOtherDims);
+        });
+    });
+
+    function applyDim(resultItem, coordDim, coordDimIndex) {
+        if (OTHER_DIMENSIONS.get(coordDim) != null) {
+            resultItem.otherDims[coordDim] = coordDimIndex;
+        }
+        else {
+            resultItem.coordDim = coordDim;
+            resultItem.coordDimIndex = coordDimIndex;
+            coordDimNameMap.set(coordDim, true);
+        }
+    }
+
+    // Make sure the first extra dim is 'value'.
+    var generateCoord = opt.generateCoord;
+    var generateCoordCount = opt.generateCoordCount;
+    var fromZero = generateCoordCount != null;
+    generateCoordCount = generateCoord ? (generateCoordCount || 1) : 0;
+    var extra = generateCoord || 'value';
+
+    // Set dim `name` and other `coordDim` and other props.
+    for (var resultDimIdx = 0; resultDimIdx < dimCount; resultDimIdx++) {
+        var resultItem = result[resultDimIdx] = result[resultDimIdx] || {};
+        var coordDim = resultItem.coordDim;
+
+        if (coordDim == null) {
+            resultItem.coordDim = genName(
+                extra, coordDimNameMap, fromZero
+            );
+            resultItem.coordDimIndex = 0;
+            if (!generateCoord || generateCoordCount <= 0) {
+                resultItem.isExtraCoord = true;
+            }
+            generateCoordCount--;
+        }
+
+        resultItem.name == null && (resultItem.name = genName(
+            resultItem.coordDim,
+            dataDimNameMap
+        ));
+
+        if (resultItem.type == null && guessOrdinal(source, resultDimIdx, resultItem.name)) {
+            resultItem.type = 'ordinal';
+        }
+    }
+
+    return result;
+}
+
+// ??? TODO
+// Originally detect dimCount by data[0]. Should we
+// optimize it to only by sysDims and dimensions and encode.
+// So only necessary dims will be initialized.
+// But
+// (1) custom series should be considered. where other dims
+// may be visited.
+// (2) sometimes user need to calcualte bubble size or use visualMap
+// on other dimensions besides coordSys needed.
+// So, dims that is not used by system, should be shared in storage?
+function getDimCount(source, sysDims, dimsDef, optDimCount) {
+    // Note that the result dimCount should not small than columns count
+    // of data, otherwise `dataDimNameMap` checking will be incorrect.
+    var dimCount = Math.max(
+        source.dimensionsDetectCount || 1,
+        sysDims.length,
+        dimsDef.length,
+        optDimCount || 0
+    );
+    each$1(sysDims, function (sysDimItem) {
+        var sysDimItemDimsDef = sysDimItem.dimsDef;
+        sysDimItemDimsDef && (dimCount = Math.max(dimCount, sysDimItemDimsDef.length));
+    });
+    return dimCount;
+}
+
+function genName(name, map$$1, fromZero) {
+    if (fromZero || map$$1.get(name) != null) {
+        var i = 0;
+        while (map$$1.get(name + i) != null) {
+            i++;
+        }
+        name += i;
+    }
+    map$$1.set(name, true);
+    return name;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Substitute `completeDimensions`.
+ * `completeDimensions` is to be deprecated.
+ */
+/**
+ * @param {module:echarts/data/Source|module:echarts/data/List} source or data.
+ * @param {Object|Array} [opt]
+ * @param {Array.<string|Object>} [opt.coordDimensions=[]]
+ * @param {number} [opt.dimensionsCount]
+ * @param {string} [opt.generateCoord]
+ * @param {string} [opt.generateCoordCount]
+ * @param {Array.<string|Object>} [opt.dimensionsDefine=source.dimensionsDefine] Overwrite source define.
+ * @param {Object|HashMap} [opt.encodeDefine=source.encodeDefine] Overwrite source define.
+ * @return {Array.<Object>} dimensionsInfo
+ */
+var createDimensions = function (source, opt) {
+    opt = opt || {};
+    return completeDimensions(opt.coordDimensions || [], source, {
+        dimsDef: opt.dimensionsDefine || source.dimensionsDefine,
+        encodeDef: opt.encodeDefine || source.encodeDefine,
+        dimCount: opt.dimensionsCount,
+        generateCoord: opt.generateCoord,
+        generateCoordCount: opt.generateCoordCount
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Note that it is too complicated to support 3d stack by value
+ * (have to create two-dimension inverted index), so in 3d case
+ * we just support that stacked by index.
+ *
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {Array.<string|Object>} dimensionInfoList The same as the input of <module:echarts/data/List>.
+ *        The input dimensionInfoList will be modified.
+ * @param {Object} [opt]
+ * @param {boolean} [opt.stackedCoordDimension=''] Specify a coord dimension if needed.
+ * @param {boolean} [opt.byIndex=false]
+ * @return {Object} calculationInfo
+ * {
+ *     stackedDimension: string
+ *     stackedByDimension: string
+ *     isStackedByIndex: boolean
+ *     stackedOverDimension: string
+ *     stackResultDimension: string
+ * }
+ */
+function enableDataStack(seriesModel, dimensionInfoList, opt) {
+    opt = opt || {};
+    var byIndex = opt.byIndex;
+    var stackedCoordDimension = opt.stackedCoordDimension;
+
+    // Compatibal: when `stack` is set as '', do not stack.
+    var mayStack = !!(seriesModel && seriesModel.get('stack'));
+    var stackedByDimInfo;
+    var stackedDimInfo;
+    var stackResultDimension;
+    var stackedOverDimension;
+
+    each$1(dimensionInfoList, function (dimensionInfo, index) {
+        if (isString(dimensionInfo)) {
+            dimensionInfoList[index] = dimensionInfo = {name: dimensionInfo};
+        }
+
+        if (mayStack && !dimensionInfo.isExtraCoord) {
+            // Find the first ordinal dimension as the stackedByDimInfo.
+            if (!byIndex && !stackedByDimInfo && dimensionInfo.ordinalMeta) {
+                stackedByDimInfo = dimensionInfo;
+            }
+            // Find the first stackable dimension as the stackedDimInfo.
+            if (!stackedDimInfo
+                && dimensionInfo.type !== 'ordinal'
+                && dimensionInfo.type !== 'time'
+                && (!stackedCoordDimension || stackedCoordDimension === dimensionInfo.coordDim)
+            ) {
+                stackedDimInfo = dimensionInfo;
+            }
+        }
+    });
+
+    if (stackedDimInfo && !byIndex && !stackedByDimInfo) {
+        // Compatible with previous design, value axis (time axis) only stack by index.
+        // It may make sense if the user provides elaborately constructed data.
+        byIndex = true;
+    }
+
+    // Add stack dimension, they can be both calculated by coordinate system in `unionExtent`.
+    // That put stack logic in List is for using conveniently in echarts extensions, but it
+    // might not be a good way.
+    if (stackedDimInfo) {
+        // Use a weird name that not duplicated with other names.
+        stackResultDimension = '__\0ecstackresult';
+        stackedOverDimension = '__\0ecstackedover';
+
+        // Create inverted index to fast query index by value.
+        if (stackedByDimInfo) {
+            stackedByDimInfo.createInvertedIndices = true;
+        }
+
+        var stackedDimCoordDim = stackedDimInfo.coordDim;
+        var stackedDimType = stackedDimInfo.type;
+        var stackedDimCoordIndex = 0;
+
+        each$1(dimensionInfoList, function (dimensionInfo) {
+            if (dimensionInfo.coordDim === stackedDimCoordDim) {
+                stackedDimCoordIndex++;
+            }
+        });
+
+        dimensionInfoList.push({
+            name: stackResultDimension,
+            coordDim: stackedDimCoordDim,
+            coordDimIndex: stackedDimCoordIndex,
+            type: stackedDimType,
+            isExtraCoord: true,
+            isCalculationCoord: true
+        });
+
+        stackedDimCoordIndex++;
+
+        dimensionInfoList.push({
+            name: stackedOverDimension,
+            // This dimension contains stack base (generally, 0), so do not set it as
+            // `stackedDimCoordDim` to avoid extent calculation, consider log scale.
+            coordDim: stackedOverDimension,
+            coordDimIndex: stackedDimCoordIndex,
+            type: stackedDimType,
+            isExtraCoord: true,
+            isCalculationCoord: true
+        });
+    }
+
+    return {
+        stackedDimension: stackedDimInfo && stackedDimInfo.name,
+        stackedByDimension: stackedByDimInfo && stackedByDimInfo.name,
+        isStackedByIndex: byIndex,
+        stackedOverDimension: stackedOverDimension,
+        stackResultDimension: stackResultDimension
+    };
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {string} stackedDim
+ */
+function isDimensionStacked(data, stackedDim /*, stackedByDim*/) {
+    // Each single series only maps to one pair of axis. So we do not need to
+    // check stackByDim, whatever stacked by a dimension or stacked by index.
+    return !!stackedDim && stackedDim === data.getCalculationInfo('stackedDimension');
+        // && (
+        //     stackedByDim != null
+        //         ? stackedByDim === data.getCalculationInfo('stackedByDimension')
+        //         : data.getCalculationInfo('isStackedByIndex')
+        // );
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {string} targetDim
+ * @param {string} [stackedByDim] If not input this parameter, check whether
+ *                                stacked by index.
+ * @return {string} dimension
+ */
+function getStackedDimension(data, targetDim) {
+    return isDimensionStacked(data, targetDim)
+        ? data.getCalculationInfo('stackResultDimension')
+        : targetDim;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/data/Source|Array} source Or raw data.
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {Object} [opt]
+ * @param {string} [opt.generateCoord]
+ */
+function createListFromArray(source, seriesModel, opt) {
+    opt = opt || {};
+
+    if (!Source.isInstance(source)) {
+        source = Source.seriesDataToSource(source);
+    }
+
+    var coordSysName = seriesModel.get('coordinateSystem');
+    var registeredCoordSys = CoordinateSystemManager.get(coordSysName);
+
+    var coordSysDefine = getCoordSysDefineBySeries(seriesModel);
+
+    var coordSysDimDefs;
+
+    if (coordSysDefine) {
+        coordSysDimDefs = map(coordSysDefine.coordSysDims, function (dim) {
+            var dimInfo = {name: dim};
+            var axisModel = coordSysDefine.axisMap.get(dim);
+            if (axisModel) {
+                var axisType = axisModel.get('type');
+                dimInfo.type = getDimensionTypeByAxis(axisType);
+                // dimInfo.stackable = isStackable(axisType);
+            }
+            return dimInfo;
+        });
+    }
+
+    if (!coordSysDimDefs) {
+        // Get dimensions from registered coordinate system
+        coordSysDimDefs = (registeredCoordSys && (
+            registeredCoordSys.getDimensionsInfo
+                ? registeredCoordSys.getDimensionsInfo()
+                : registeredCoordSys.dimensions.slice()
+        )) || ['x', 'y'];
+    }
+
+    var dimInfoList = createDimensions(source, {
+        coordDimensions: coordSysDimDefs,
+        generateCoord: opt.generateCoord
+    });
+
+    var firstCategoryDimIndex;
+    var hasNameEncode;
+    coordSysDefine && each$1(dimInfoList, function (dimInfo, dimIndex) {
+        var coordDim = dimInfo.coordDim;
+        var categoryAxisModel = coordSysDefine.categoryAxisMap.get(coordDim);
+        if (categoryAxisModel) {
+            if (firstCategoryDimIndex == null) {
+                firstCategoryDimIndex = dimIndex;
+            }
+            dimInfo.ordinalMeta = categoryAxisModel.getOrdinalMeta();
+        }
+        if (dimInfo.otherDims.itemName != null) {
+            hasNameEncode = true;
+        }
+    });
+    if (!hasNameEncode && firstCategoryDimIndex != null) {
+        dimInfoList[firstCategoryDimIndex].otherDims.itemName = 0;
+    }
+
+    var stackCalculationInfo = enableDataStack(seriesModel, dimInfoList);
+
+    var list = new List(dimInfoList, seriesModel);
+
+    list.setCalculationInfo(stackCalculationInfo);
+
+    var dimValueGetter = (firstCategoryDimIndex != null && isNeedCompleteOrdinalData(source))
+        ? function (itemOpt, dimName, dataIndex, dimIndex) {
+            // Use dataIndex as ordinal value in categoryAxis
+            return dimIndex === firstCategoryDimIndex
+                ? dataIndex
+                : this.defaultDimValueGetter(itemOpt, dimName, dataIndex, dimIndex);
+        }
+        : null;
+
+    list.hasItemOption = false;
+    list.initData(source, null, dimValueGetter);
+
+    return list;
+}
+
+function isNeedCompleteOrdinalData(source) {
+    if (source.sourceFormat === SOURCE_FORMAT_ORIGINAL) {
+        var sampleItem = firstDataNotNull(source.data || []);
+        return sampleItem != null
+            && !isArray(getDataItemValue(sampleItem));
+    }
+}
+
+function firstDataNotNull(data) {
+    var i = 0;
+    while (i < data.length && data[i] == null) {
+        i++;
+    }
+    return data[i];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * // Scale class management
+ * @module echarts/scale/Scale
+ */
+
+/**
+ * @param {Object} [setting]
+ */
+function Scale(setting) {
+    this._setting = setting || {};
+
+    /**
+     * Extent
+     * @type {Array.<number>}
+     * @protected
+     */
+    this._extent = [Infinity, -Infinity];
+
+    /**
+     * Step is calculated in adjustExtent
+     * @type {Array.<number>}
+     * @protected
+     */
+    this._interval = 0;
+
+    this.init && this.init.apply(this, arguments);
+}
+
+/**
+ * Parse input val to valid inner number.
+ * @param {*} val
+ * @return {number}
+ */
+Scale.prototype.parse = function (val) {
+    // Notice: This would be a trap here, If the implementation
+    // of this method depends on extent, and this method is used
+    // before extent set (like in dataZoom), it would be wrong.
+    // Nevertheless, parse does not depend on extent generally.
+    return val;
+};
+
+Scale.prototype.getSetting = function (name) {
+    return this._setting[name];
+};
+
+Scale.prototype.contain = function (val) {
+    var extent = this._extent;
+    return val >= extent[0] && val <= extent[1];
+};
+
+/**
+ * Normalize value to linear [0, 1], return 0.5 if extent span is 0
+ * @param {number} val
+ * @return {number}
+ */
+Scale.prototype.normalize = function (val) {
+    var extent = this._extent;
+    if (extent[1] === extent[0]) {
+        return 0.5;
+    }
+    return (val - extent[0]) / (extent[1] - extent[0]);
+};
+
+/**
+ * Scale normalized value
+ * @param {number} val
+ * @return {number}
+ */
+Scale.prototype.scale = function (val) {
+    var extent = this._extent;
+    return val * (extent[1] - extent[0]) + extent[0];
+};
+
+/**
+ * Set extent from data
+ * @param {Array.<number>} other
+ */
+Scale.prototype.unionExtent = function (other) {
+    var extent = this._extent;
+    other[0] < extent[0] && (extent[0] = other[0]);
+    other[1] > extent[1] && (extent[1] = other[1]);
+    // not setExtent because in log axis it may transformed to power
+    // this.setExtent(extent[0], extent[1]);
+};
+
+/**
+ * Set extent from data
+ * @param {module:echarts/data/List} data
+ * @param {string} dim
+ */
+Scale.prototype.unionExtentFromData = function (data, dim) {
+    this.unionExtent(data.getApproximateExtent(dim));
+};
+
+/**
+ * Get extent
+ * @return {Array.<number>}
+ */
+Scale.prototype.getExtent = function () {
+    return this._extent.slice();
+};
+
+/**
+ * Set extent
+ * @param {number} start
+ * @param {number} end
+ */
+Scale.prototype.setExtent = function (start, end) {
+    var thisExtent = this._extent;
+    if (!isNaN(start)) {
+        thisExtent[0] = start;
+    }
+    if (!isNaN(end)) {
+        thisExtent[1] = end;
+    }
+};
+
+/**
+ * When axis extent depends on data and no data exists,
+ * axis ticks should not be drawn, which is named 'blank'.
+ */
+Scale.prototype.isBlank = function () {
+    return this._isBlank;
+},
+
+/**
+ * When axis extent depends on data and no data exists,
+ * axis ticks should not be drawn, which is named 'blank'.
+ */
+Scale.prototype.setBlank = function (isBlank) {
+    this._isBlank = isBlank;
+};
+
+/**
+ * @abstract
+ * @param {*} tick
+ * @return {string} label of the tick.
+ */
+Scale.prototype.getLabel = null;
+
+
+enableClassExtend(Scale);
+enableClassManagement(Scale, {
+    registerWhenExtend: true
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @constructor
+ * @param {Object} [opt]
+ * @param {Object} [opt.categories=[]]
+ * @param {Object} [opt.needCollect=false]
+ * @param {Object} [opt.deduplication=false]
+ */
+function OrdinalMeta(opt) {
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    this.categories = opt.categories || [];
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._needCollect = opt.needCollect;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._deduplication = opt.deduplication;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._map;
+}
+
+/**
+ * @param {module:echarts/model/Model} axisModel
+ * @return {module:echarts/data/OrdinalMeta}
+ */
+OrdinalMeta.createByAxisModel = function (axisModel) {
+    var option = axisModel.option;
+    var data = option.data;
+    var categories = data && map(data, getName);
+
+    return new OrdinalMeta({
+        categories: categories,
+        needCollect: !categories,
+        // deduplication is default in axis.
+        deduplication: option.dedplication !== false
+    });
+};
+
+var proto$1 = OrdinalMeta.prototype;
+
+/**
+ * @param {string} category
+ * @return {number} ordinal
+ */
+proto$1.getOrdinal = function (category) {
+    return getOrCreateMap(this).get(category);
+};
+
+/**
+ * @param {*} category
+ * @return {number} The ordinal. If not found, return NaN.
+ */
+proto$1.parseAndCollect = function (category) {
+    var index;
+    var needCollect = this._needCollect;
+
+    // The value of category dim can be the index of the given category set.
+    // This feature is only supported when !needCollect, because we should
+    // consider a common case: a value is 2017, which is a number but is
+    // expected to be tread as a category. This case usually happen in dataset,
+    // where it happent to be no need of the index feature.
+    if (typeof category !== 'string' && !needCollect) {
+        return category;
+    }
+
+    // Optimize for the scenario:
+    // category is ['2012-01-01', '2012-01-02', ...], where the input
+    // data has been ensured not duplicate and is large data.
+    // Notice, if a dataset dimension provide categroies, usually echarts
+    // should remove duplication except user tell echarts dont do that
+    // (set axis.deduplication = false), because echarts do not know whether
+    // the values in the category dimension has duplication (consider the
+    // parallel-aqi example)
+    if (needCollect && !this._deduplication) {
+        index = this.categories.length;
+        this.categories[index] = category;
+        return index;
+    }
+
+    var map$$1 = getOrCreateMap(this);
+    index = map$$1.get(category);
+
+    if (index == null) {
+        if (needCollect) {
+            index = this.categories.length;
+            this.categories[index] = category;
+            map$$1.set(category, index);
+        }
+        else {
+            index = NaN;
+        }
+    }
+
+    return index;
+};
+
+// Consider big data, do not create map until needed.
+function getOrCreateMap(ordinalMeta) {
+    return ordinalMeta._map || (
+        ordinalMeta._map = createHashMap(ordinalMeta.categories)
+    );
+}
+
+function getName(obj) {
+    if (isObject$1(obj) && obj.value != null) {
+        return obj.value;
+    }
+    else {
+        return obj + '';
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Linear continuous scale
+ * @module echarts/coord/scale/Ordinal
+ *
+ * http://en.wikipedia.org/wiki/Level_of_measurement
+ */
+
+// FIXME only one data
+
+var scaleProto = Scale.prototype;
+
+var OrdinalScale = Scale.extend({
+
+    type: 'ordinal',
+
+    /**
+     * @param {module:echarts/data/OrdianlMeta|Array.<string>} ordinalMeta
+     */
+    init: function (ordinalMeta, extent) {
+        // Caution: Should not use instanceof, consider ec-extensions using
+        // import approach to get OrdinalMeta class.
+        if (!ordinalMeta || isArray(ordinalMeta)) {
+            ordinalMeta = new OrdinalMeta({categories: ordinalMeta});
+        }
+        this._ordinalMeta = ordinalMeta;
+        this._extent = extent || [0, ordinalMeta.categories.length - 1];
+    },
+
+    parse: function (val) {
+        return typeof val === 'string'
+            ? this._ordinalMeta.getOrdinal(val)
+            // val might be float.
+            : Math.round(val);
+    },
+
+    contain: function (rank) {
+        rank = this.parse(rank);
+        return scaleProto.contain.call(this, rank)
+            && this._ordinalMeta.categories[rank] != null;
+    },
+
+    /**
+     * Normalize given rank or name to linear [0, 1]
+     * @param {number|string} [val]
+     * @return {number}
+     */
+    normalize: function (val) {
+        return scaleProto.normalize.call(this, this.parse(val));
+    },
+
+    scale: function (val) {
+        return Math.round(scaleProto.scale.call(this, val));
+    },
+
+    /**
+     * @return {Array}
+     */
+    getTicks: function () {
+        var ticks = [];
+        var extent = this._extent;
+        var rank = extent[0];
+
+        while (rank <= extent[1]) {
+            ticks.push(rank);
+            rank++;
+        }
+
+        return ticks;
+    },
+
+    /**
+     * Get item on rank n
+     * @param {number} n
+     * @return {string}
+     */
+    getLabel: function (n) {
+        if (!this.isBlank()) {
+            // Note that if no data, ordinalMeta.categories is an empty array.
+            return this._ordinalMeta.categories[n];
+        }
+    },
+
+    /**
+     * @return {number}
+     */
+    count: function () {
+        return this._extent[1] - this._extent[0] + 1;
+    },
+
+    /**
+     * @override
+     */
+    unionExtentFromData: function (data, dim) {
+        this.unionExtent(data.getApproximateExtent(dim));
+    },
+
+    getOrdinalMeta: function () {
+        return this._ordinalMeta;
+    },
+
+    niceTicks: noop,
+    niceExtent: noop
+});
+
+/**
+ * @return {module:echarts/scale/Time}
+ */
+OrdinalScale.create = function () {
+    return new OrdinalScale();
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * For testable.
+ */
+
+var roundNumber$1 = round$1;
+
+/**
+ * @param {Array.<number>} extent Both extent[0] and extent[1] should be valid number.
+ *                                Should be extent[0] < extent[1].
+ * @param {number} splitNumber splitNumber should be >= 1.
+ * @param {number} [minInterval]
+ * @param {number} [maxInterval]
+ * @return {Object} {interval, intervalPrecision, niceTickExtent}
+ */
+function intervalScaleNiceTicks(extent, splitNumber, minInterval, maxInterval) {
+    var result = {};
+    var span = extent[1] - extent[0];
+
+    var interval = result.interval = nice(span / splitNumber, true);
+    if (minInterval != null && interval < minInterval) {
+        interval = result.interval = minInterval;
+    }
+    if (maxInterval != null && interval > maxInterval) {
+        interval = result.interval = maxInterval;
+    }
+    // Tow more digital for tick.
+    var precision = result.intervalPrecision = getIntervalPrecision(interval);
+    // Niced extent inside original extent
+    var niceTickExtent = result.niceTickExtent = [
+        roundNumber$1(Math.ceil(extent[0] / interval) * interval, precision),
+        roundNumber$1(Math.floor(extent[1] / interval) * interval, precision)
+    ];
+
+    fixExtent(niceTickExtent, extent);
+
+    return result;
+}
+
+/**
+ * @param {number} interval
+ * @return {number} interval precision
+ */
+function getIntervalPrecision(interval) {
+    // Tow more digital for tick.
+    return getPrecisionSafe(interval) + 2;
+}
+
+function clamp(niceTickExtent, idx, extent) {
+    niceTickExtent[idx] = Math.max(Math.min(niceTickExtent[idx], extent[1]), extent[0]);
+}
+
+// In some cases (e.g., splitNumber is 1), niceTickExtent may be out of extent.
+function fixExtent(niceTickExtent, extent) {
+    !isFinite(niceTickExtent[0]) && (niceTickExtent[0] = extent[0]);
+    !isFinite(niceTickExtent[1]) && (niceTickExtent[1] = extent[1]);
+    clamp(niceTickExtent, 0, extent);
+    clamp(niceTickExtent, 1, extent);
+    if (niceTickExtent[0] > niceTickExtent[1]) {
+        niceTickExtent[0] = niceTickExtent[1];
+    }
+}
+
+function intervalScaleGetTicks(interval, extent, niceTickExtent, intervalPrecision) {
+    var ticks = [];
+
+    // If interval is 0, return [];
+    if (!interval) {
+        return ticks;
+    }
+
+    // Consider this case: using dataZoom toolbox, zoom and zoom.
+    var safeLimit = 10000;
+
+    if (extent[0] < niceTickExtent[0]) {
+        ticks.push(extent[0]);
+    }
+    var tick = niceTickExtent[0];
+
+    while (tick <= niceTickExtent[1]) {
+        ticks.push(tick);
+        // Avoid rounding error
+        tick = roundNumber$1(tick + interval, intervalPrecision);
+        if (tick === ticks[ticks.length - 1]) {
+            // Consider out of safe float point, e.g.,
+            // -3711126.9907707 + 2e-10 === -3711126.9907707
+            break;
+        }
+        if (ticks.length > safeLimit) {
+            return [];
+        }
+    }
+    // Consider this case: the last item of ticks is smaller
+    // than niceTickExtent[1] and niceTickExtent[1] === extent[1].
+    if (extent[1] > (ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1])) {
+        ticks.push(extent[1]);
+    }
+
+    return ticks;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Interval scale
+ * @module echarts/scale/Interval
+ */
+
+
+var roundNumber = round$1;
+
+/**
+ * @alias module:echarts/coord/scale/Interval
+ * @constructor
+ */
+var IntervalScale = Scale.extend({
+
+    type: 'interval',
+
+    _interval: 0,
+
+    _intervalPrecision: 2,
+
+    setExtent: function (start, end) {
+        var thisExtent = this._extent;
+        //start,end may be a Number like '25',so...
+        if (!isNaN(start)) {
+            thisExtent[0] = parseFloat(start);
+        }
+        if (!isNaN(end)) {
+            thisExtent[1] = parseFloat(end);
+        }
+    },
+
+    unionExtent: function (other) {
+        var extent = this._extent;
+        other[0] < extent[0] && (extent[0] = other[0]);
+        other[1] > extent[1] && (extent[1] = other[1]);
+
+        // unionExtent may called by it's sub classes
+        IntervalScale.prototype.setExtent.call(this, extent[0], extent[1]);
+    },
+    /**
+     * Get interval
+     */
+    getInterval: function () {
+        return this._interval;
+    },
+
+    /**
+     * Set interval
+     */
+    setInterval: function (interval) {
+        this._interval = interval;
+        // Dropped auto calculated niceExtent and use user setted extent
+        // We assume user wan't to set both interval, min, max to get a better result
+        this._niceExtent = this._extent.slice();
+
+        this._intervalPrecision = getIntervalPrecision(interval);
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getTicks: function () {
+        return intervalScaleGetTicks(
+            this._interval, this._extent, this._niceExtent, this._intervalPrecision
+        );
+    },
+
+    /**
+     * @param {number} data
+     * @param {Object} [opt]
+     * @param {number|string} [opt.precision] If 'auto', use nice presision.
+     * @param {boolean} [opt.pad] returns 1.50 but not 1.5 if precision is 2.
+     * @return {string}
+     */
+    getLabel: function (data, opt) {
+        if (data == null) {
+            return '';
+        }
+
+        var precision = opt && opt.precision;
+
+        if (precision == null) {
+            precision = getPrecisionSafe(data) || 0;
+        }
+        else if (precision === 'auto') {
+            // Should be more precise then tick.
+            precision = this._intervalPrecision;
+        }
+
+        // (1) If `precision` is set, 12.005 should be display as '12.00500'.
+        // (2) Use roundNumber (toFixed) to avoid scientific notation like '3.5e-7'.
+        data = roundNumber(data, precision, true);
+
+        return addCommas(data);
+    },
+
+    /**
+     * Update interval and extent of intervals for nice ticks
+     *
+     * @param {number} [splitNumber = 5] Desired number of ticks
+     * @param {number} [minInterval]
+     * @param {number} [maxInterval]
+     */
+    niceTicks: function (splitNumber, minInterval, maxInterval) {
+        splitNumber = splitNumber || 5;
+        var extent = this._extent;
+        var span = extent[1] - extent[0];
+        if (!isFinite(span)) {
+            return;
+        }
+        // User may set axis min 0 and data are all negative
+        // FIXME If it needs to reverse ?
+        if (span < 0) {
+            span = -span;
+            extent.reverse();
+        }
+
+        var result = intervalScaleNiceTicks(
+            extent, splitNumber, minInterval, maxInterval
+        );
+
+        this._intervalPrecision = result.intervalPrecision;
+        this._interval = result.interval;
+        this._niceExtent = result.niceTickExtent;
+    },
+
+    /**
+     * Nice extent.
+     * @param {Object} opt
+     * @param {number} [opt.splitNumber = 5] Given approx tick number
+     * @param {boolean} [opt.fixMin=false]
+     * @param {boolean} [opt.fixMax=false]
+     * @param {boolean} [opt.minInterval]
+     * @param {boolean} [opt.maxInterval]
+     */
+    niceExtent: function (opt) {
+        var extent = this._extent;
+        // If extent start and end are same, expand them
+        if (extent[0] === extent[1]) {
+            if (extent[0] !== 0) {
+                // Expand extent
+                var expandSize = extent[0];
+                // In the fowllowing case
+                //      Axis has been fixed max 100
+                //      Plus data are all 100 and axis extent are [100, 100].
+                // Extend to the both side will cause expanded max is larger than fixed max.
+                // So only expand to the smaller side.
+                if (!opt.fixMax) {
+                    extent[1] += expandSize / 2;
+                    extent[0] -= expandSize / 2;
+                }
+                else {
+                    extent[0] -= expandSize / 2;
+                }
+            }
+            else {
+                extent[1] = 1;
+            }
+        }
+        var span = extent[1] - extent[0];
+        // If there are no data and extent are [Infinity, -Infinity]
+        if (!isFinite(span)) {
+            extent[0] = 0;
+            extent[1] = 1;
+        }
+
+        this.niceTicks(opt.splitNumber, opt.minInterval, opt.maxInterval);
+
+        // var extent = this._extent;
+        var interval = this._interval;
+
+        if (!opt.fixMin) {
+            extent[0] = roundNumber(Math.floor(extent[0] / interval) * interval);
+        }
+        if (!opt.fixMax) {
+            extent[1] = roundNumber(Math.ceil(extent[1] / interval) * interval);
+        }
+    }
+});
+
+/**
+ * @return {module:echarts/scale/Time}
+ */
+IntervalScale.create = function () {
+    return new IntervalScale();
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var STACK_PREFIX = '__ec_stack_';
+var LARGE_BAR_MIN_WIDTH = 0.5;
+
+var LargeArr = typeof Float32Array !== 'undefined' ? Float32Array : Array;
+
+function getSeriesStackId(seriesModel) {
+    return seriesModel.get('stack') || STACK_PREFIX + seriesModel.seriesIndex;
+}
+
+function getAxisKey(axis) {
+    return axis.dim + axis.index;
+}
+
+/**
+ * @param {Object} opt
+ * @param {module:echarts/coord/Axis} opt.axis Only support category axis currently.
+ * @param {number} opt.count Positive interger.
+ * @param {number} [opt.barWidth]
+ * @param {number} [opt.barMaxWidth]
+ * @param {number} [opt.barGap]
+ * @param {number} [opt.barCategoryGap]
+ * @return {Object} {width, offset, offsetCenter} If axis.type is not 'category', return undefined.
+ */
+function getLayoutOnAxis(opt) {
+    var params = [];
+    var baseAxis = opt.axis;
+    var axisKey = 'axis0';
+
+    if (baseAxis.type !== 'category') {
+        return;
+    }
+    var bandWidth = baseAxis.getBandWidth();
+
+    for (var i = 0; i < opt.count || 0; i++) {
+        params.push(defaults({
+            bandWidth: bandWidth,
+            axisKey: axisKey,
+            stackId: STACK_PREFIX + i
+        }, opt));
+    }
+    var widthAndOffsets = doCalBarWidthAndOffset(params);
+
+    var result = [];
+    for (var i = 0; i < opt.count; i++) {
+        var item = widthAndOffsets[axisKey][STACK_PREFIX + i];
+        item.offsetCenter = item.offset + item.width / 2;
+        result.push(item);
+    }
+
+    return result;
+}
+
+function prepareLayoutBarSeries(seriesType, ecModel) {
+    var seriesModels = [];
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        // Check series coordinate, do layout for cartesian2d only
+        if (isOnCartesian(seriesModel) && !isInLargeMode(seriesModel)) {
+            seriesModels.push(seriesModel);
+        }
+    });
+    return seriesModels;
+}
+
+function makeColumnLayout(barSeries) {
+    var seriesInfoList = [];
+    each$1(barSeries, function (seriesModel) {
+        var data = seriesModel.getData();
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+        var axisExtent = baseAxis.getExtent();
+        var bandWidth = baseAxis.type === 'category'
+            ? baseAxis.getBandWidth()
+            : (Math.abs(axisExtent[1] - axisExtent[0]) / data.count());
+
+        var barWidth = parsePercent$1(
+            seriesModel.get('barWidth'), bandWidth
+        );
+        var barMaxWidth = parsePercent$1(
+            seriesModel.get('barMaxWidth'), bandWidth
+        );
+        var barGap = seriesModel.get('barGap');
+        var barCategoryGap = seriesModel.get('barCategoryGap');
+
+        seriesInfoList.push({
+            bandWidth: bandWidth,
+            barWidth: barWidth,
+            barMaxWidth: barMaxWidth,
+            barGap: barGap,
+            barCategoryGap: barCategoryGap,
+            axisKey: getAxisKey(baseAxis),
+            stackId: getSeriesStackId(seriesModel)
+        });
+    });
+
+    return doCalBarWidthAndOffset(seriesInfoList);
+}
+
+function doCalBarWidthAndOffset(seriesInfoList) {
+    // Columns info on each category axis. Key is cartesian name
+    var columnsMap = {};
+
+    each$1(seriesInfoList, function (seriesInfo, idx) {
+        var axisKey = seriesInfo.axisKey;
+        var bandWidth = seriesInfo.bandWidth;
+        var columnsOnAxis = columnsMap[axisKey] || {
+            bandWidth: bandWidth,
+            remainedWidth: bandWidth,
+            autoWidthCount: 0,
+            categoryGap: '20%',
+            gap: '30%',
+            stacks: {}
+        };
+        var stacks = columnsOnAxis.stacks;
+        columnsMap[axisKey] = columnsOnAxis;
+
+        var stackId = seriesInfo.stackId;
+
+        if (!stacks[stackId]) {
+            columnsOnAxis.autoWidthCount++;
+        }
+        stacks[stackId] = stacks[stackId] || {
+            width: 0,
+            maxWidth: 0
+        };
+
+        // Caution: In a single coordinate system, these barGrid attributes
+        // will be shared by series. Consider that they have default values,
+        // only the attributes set on the last series will work.
+        // Do not change this fact unless there will be a break change.
+
+        // TODO
+        var barWidth = seriesInfo.barWidth;
+        if (barWidth && !stacks[stackId].width) {
+            // See #6312, do not restrict width.
+            stacks[stackId].width = barWidth;
+            barWidth = Math.min(columnsOnAxis.remainedWidth, barWidth);
+            columnsOnAxis.remainedWidth -= barWidth;
+        }
+
+        var barMaxWidth = seriesInfo.barMaxWidth;
+        barMaxWidth && (stacks[stackId].maxWidth = barMaxWidth);
+        var barGap = seriesInfo.barGap;
+        (barGap != null) && (columnsOnAxis.gap = barGap);
+        var barCategoryGap = seriesInfo.barCategoryGap;
+        (barCategoryGap != null) && (columnsOnAxis.categoryGap = barCategoryGap);
+    });
+
+    var result = {};
+
+    each$1(columnsMap, function (columnsOnAxis, coordSysName) {
+
+        result[coordSysName] = {};
+
+        var stacks = columnsOnAxis.stacks;
+        var bandWidth = columnsOnAxis.bandWidth;
+        var categoryGap = parsePercent$1(columnsOnAxis.categoryGap, bandWidth);
+        var barGapPercent = parsePercent$1(columnsOnAxis.gap, 1);
+
+        var remainedWidth = columnsOnAxis.remainedWidth;
+        var autoWidthCount = columnsOnAxis.autoWidthCount;
+        var autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        // Find if any auto calculated bar exceeded maxBarWidth
+        each$1(stacks, function (column, stack) {
+            var maxWidth = column.maxWidth;
+            if (maxWidth && maxWidth < autoWidth) {
+                maxWidth = Math.min(maxWidth, remainedWidth);
+                if (column.width) {
+                    maxWidth = Math.min(maxWidth, column.width);
+                }
+                remainedWidth -= maxWidth;
+                column.width = maxWidth;
+                autoWidthCount--;
+            }
+        });
+
+        // Recalculate width again
+        autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        var widthSum = 0;
+        var lastColumn;
+        each$1(stacks, function (column, idx) {
+            if (!column.width) {
+                column.width = autoWidth;
+            }
+            lastColumn = column;
+            widthSum += column.width * (1 + barGapPercent);
+        });
+        if (lastColumn) {
+            widthSum -= lastColumn.width * barGapPercent;
+        }
+
+        var offset = -widthSum / 2;
+        each$1(stacks, function (column, stackId) {
+            result[coordSysName][stackId] = result[coordSysName][stackId] || {
+                offset: offset,
+                width: column.width
+            };
+
+            offset += column.width * (1 + barGapPercent);
+        });
+    });
+
+    return result;
+}
+
+/**
+ * @param {Object} barWidthAndOffset The result of makeColumnLayout
+ * @param {module:echarts/coord/Axis} axis
+ * @param {module:echarts/model/Series} [seriesModel] If not provided, return all.
+ * @return {Object} {stackId: {offset, width}} or {offset, width} if seriesModel provided.
+ */
+function retrieveColumnLayout(barWidthAndOffset, axis, seriesModel) {
+    if (barWidthAndOffset && axis) {
+        var result = barWidthAndOffset[getAxisKey(axis)];
+        if (result != null && seriesModel != null) {
+            result = result[getSeriesStackId(seriesModel)];
+        }
+        return result;
+    }
+}
+
+/**
+ * @param {string} seriesType
+ * @param {module:echarts/model/Global} ecModel
+ */
+function layout(seriesType, ecModel) {
+
+    var seriesModels = prepareLayoutBarSeries(seriesType, ecModel);
+    var barWidthAndOffset = makeColumnLayout(seriesModels);
+
+    var lastStackCoords = {};
+    each$1(seriesModels, function (seriesModel) {
+
+        var data = seriesModel.getData();
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+
+        var stackId = getSeriesStackId(seriesModel);
+        var columnLayoutInfo = barWidthAndOffset[getAxisKey(baseAxis)][stackId];
+        var columnOffset = columnLayoutInfo.offset;
+        var columnWidth = columnLayoutInfo.width;
+        var valueAxis = cartesian.getOtherAxis(baseAxis);
+
+        var barMinHeight = seriesModel.get('barMinHeight') || 0;
+
+        lastStackCoords[stackId] = lastStackCoords[stackId] || [];
+        data.setLayout({
+            offset: columnOffset,
+            size: columnWidth
+        });
+
+        var valueDim = data.mapDimension(valueAxis.dim);
+        var baseDim = data.mapDimension(baseAxis.dim);
+        var stacked = isDimensionStacked(data, valueDim /*, baseDim*/);
+        var isValueAxisH = valueAxis.isHorizontal();
+
+        var valueAxisStart = getValueAxisStart(baseAxis, valueAxis, stacked);
+
+        for (var idx = 0, len = data.count(); idx < len; idx++) {
+            var value = data.get(valueDim, idx);
+            var baseValue = data.get(baseDim, idx);
+
+            if (isNaN(value)) {
+                continue;
+            }
+
+            var sign = value >= 0 ? 'p' : 'n';
+            var baseCoord = valueAxisStart;
+
+            // Because of the barMinHeight, we can not use the value in
+            // stackResultDimension directly.
+            if (stacked) {
+                // Only ordinal axis can be stacked.
+                if (!lastStackCoords[stackId][baseValue]) {
+                    lastStackCoords[stackId][baseValue] = {
+                        p: valueAxisStart, // Positive stack
+                        n: valueAxisStart  // Negative stack
+                    };
+                }
+                // Should also consider #4243
+                baseCoord = lastStackCoords[stackId][baseValue][sign];
+            }
+
+            var x;
+            var y;
+            var width;
+            var height;
+
+            if (isValueAxisH) {
+                var coord = cartesian.dataToPoint([value, baseValue]);
+                x = baseCoord;
+                y = coord[1] + columnOffset;
+                width = coord[0] - valueAxisStart;
+                height = columnWidth;
+
+                if (Math.abs(width) < barMinHeight) {
+                    width = (width < 0 ? -1 : 1) * barMinHeight;
+                }
+                stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+            }
+            else {
+                var coord = cartesian.dataToPoint([baseValue, value]);
+                x = coord[0] + columnOffset;
+                y = baseCoord;
+                width = columnWidth;
+                height = coord[1] - valueAxisStart;
+
+                if (Math.abs(height) < barMinHeight) {
+                    // Include zero to has a positive bar
+                    height = (height <= 0 ? -1 : 1) * barMinHeight;
+                }
+                stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+            }
+
+            data.setItemLayout(idx, {
+                x: x,
+                y: y,
+                width: width,
+                height: height
+            });
+        }
+
+    }, this);
+}
+
+// TODO: Do not support stack in large mode yet.
+var largeLayout = {
+
+    seriesType: 'bar',
+
+    plan: createRenderPlanner(),
+
+    reset: function (seriesModel) {
+        if (!isOnCartesian(seriesModel) || !isInLargeMode(seriesModel)) {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+        var valueAxis = cartesian.getOtherAxis(baseAxis);
+        var valueDim = data.mapDimension(valueAxis.dim);
+        var baseDim = data.mapDimension(baseAxis.dim);
+        var valueAxisHorizontal = valueAxis.isHorizontal();
+        var valueDimIdx = valueAxisHorizontal ? 0 : 1;
+
+        var barWidth = retrieveColumnLayout(
+            makeColumnLayout([seriesModel]), baseAxis, seriesModel
+        ).width;
+        if (!(barWidth > LARGE_BAR_MIN_WIDTH)) { // jshint ignore:line
+            barWidth = LARGE_BAR_MIN_WIDTH;
+        }
+
+        return {progress: progress};
+
+        function progress(params, data) {
+            var largePoints = new LargeArr(params.count * 2);
+            var dataIndex;
+            var coord = [];
+            var valuePair = [];
+            var offset = 0;
+
+            while ((dataIndex = params.next()) != null) {
+                valuePair[valueDimIdx] = data.get(valueDim, dataIndex);
+                valuePair[1 - valueDimIdx] = data.get(baseDim, dataIndex);
+
+                coord = cartesian.dataToPoint(valuePair, null, coord);
+                largePoints[offset++] = coord[0];
+                largePoints[offset++] = coord[1];
+            }
+
+            data.setLayout({
+                largePoints: largePoints,
+                barWidth: barWidth,
+                valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+                valueAxisHorizontal: valueAxisHorizontal
+            });
+        }
+    }
+};
+
+function isOnCartesian(seriesModel) {
+    return seriesModel.coordinateSystem && seriesModel.coordinateSystem.type === 'cartesian2d';
+}
+
+function isInLargeMode(seriesModel) {
+    return seriesModel.pipelineContext && seriesModel.pipelineContext.large;
+}
+
+function getValueAxisStart(baseAxis, valueAxis, stacked) {
+    return (
+        indexOf(baseAxis.getAxesOnZeroOf(), valueAxis) >= 0
+        || stacked
+    )
+    ? valueAxis.toGlobalCoord(valueAxis.dataToCoord(0))
+    : valueAxis.getGlobalExtent()[0];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The `scaleLevels` references to d3.js. The use of the source
+* code of this file is also subject to the terms and consitions
+* of its license (BSD-3Clause, see <echarts/src/licenses/LICENSE-d3>).
+*/
+
+// [About UTC and local time zone]:
+// In most cases, `number.parseDate` will treat input data string as local time
+// (except time zone is specified in time string). And `format.formateTime` returns
+// local time by default. option.useUTC is false by default. This design have
+// concidered these common case:
+// (1) Time that is persistent in server is in UTC, but it is needed to be diplayed
+// in local time by default.
+// (2) By default, the input data string (e.g., '2011-01-02') should be displayed
+// as its original time, without any time difference.
+
+var intervalScaleProto = IntervalScale.prototype;
+
+var mathCeil = Math.ceil;
+var mathFloor = Math.floor;
+var ONE_SECOND = 1000;
+var ONE_MINUTE = ONE_SECOND * 60;
+var ONE_HOUR = ONE_MINUTE * 60;
+var ONE_DAY = ONE_HOUR * 24;
+
+// FIXME 公用？
+var bisect = function (a, x, lo, hi) {
+    while (lo < hi) {
+        var mid = lo + hi >>> 1;
+        if (a[mid][1] < x) {
+            lo = mid + 1;
+        }
+        else {
+            hi  = mid;
+        }
+    }
+    return lo;
+};
+
+/**
+ * @alias module:echarts/coord/scale/Time
+ * @constructor
+ */
+var TimeScale = IntervalScale.extend({
+    type: 'time',
+
+    /**
+     * @override
+     */
+    getLabel: function (val) {
+        var stepLvl = this._stepLvl;
+
+        var date = new Date(val);
+
+        return formatTime(stepLvl[0], date, this.getSetting('useUTC'));
+    },
+
+    /**
+     * @override
+     */
+    niceExtent: function (opt) {
+        var extent = this._extent;
+        // If extent start and end are same, expand them
+        if (extent[0] === extent[1]) {
+            // Expand extent
+            extent[0] -= ONE_DAY;
+            extent[1] += ONE_DAY;
+        }
+        // If there are no data and extent are [Infinity, -Infinity]
+        if (extent[1] === -Infinity && extent[0] === Infinity) {
+            var d = new Date();
+            extent[1] = +new Date(d.getFullYear(), d.getMonth(), d.getDate());
+            extent[0] = extent[1] - ONE_DAY;
+        }
+
+        this.niceTicks(opt.splitNumber, opt.minInterval, opt.maxInterval);
+
+        // var extent = this._extent;
+        var interval = this._interval;
+
+        if (!opt.fixMin) {
+            extent[0] = round$1(mathFloor(extent[0] / interval) * interval);
+        }
+        if (!opt.fixMax) {
+            extent[1] = round$1(mathCeil(extent[1] / interval) * interval);
+        }
+    },
+
+    /**
+     * @override
+     */
+    niceTicks: function (approxTickNum, minInterval, maxInterval) {
+        approxTickNum = approxTickNum || 10;
+
+        var extent = this._extent;
+        var span = extent[1] - extent[0];
+        var approxInterval = span / approxTickNum;
+
+        if (minInterval != null && approxInterval < minInterval) {
+            approxInterval = minInterval;
+        }
+        if (maxInterval != null && approxInterval > maxInterval) {
+            approxInterval = maxInterval;
+        }
+
+        var scaleLevelsLen = scaleLevels.length;
+        var idx = bisect(scaleLevels, approxInterval, 0, scaleLevelsLen);
+
+        var level = scaleLevels[Math.min(idx, scaleLevelsLen - 1)];
+        var interval = level[1];
+        // Same with interval scale if span is much larger than 1 year
+        if (level[0] === 'year') {
+            var yearSpan = span / interval;
+
+            // From "Nice Numbers for Graph Labels" of Graphic Gems
+            // var niceYearSpan = numberUtil.nice(yearSpan, false);
+            var yearStep = nice(yearSpan / approxTickNum, true);
+
+            interval *= yearStep;
+        }
+
+        var timezoneOffset = this.getSetting('useUTC')
+            ? 0 : (new Date(+extent[0] || +extent[1])).getTimezoneOffset() * 60 * 1000;
+        var niceExtent = [
+            Math.round(mathCeil((extent[0] - timezoneOffset) / interval) * interval + timezoneOffset),
+            Math.round(mathFloor((extent[1] - timezoneOffset) / interval) * interval + timezoneOffset)
+        ];
+
+        fixExtent(niceExtent, extent);
+
+        this._stepLvl = level;
+        // Interval will be used in getTicks
+        this._interval = interval;
+        this._niceExtent = niceExtent;
+    },
+
+    parse: function (val) {
+        // val might be float.
+        return +parseDate(val);
+    }
+});
+
+each$1(['contain', 'normalize'], function (methodName) {
+    TimeScale.prototype[methodName] = function (val) {
+        return intervalScaleProto[methodName].call(this, this.parse(val));
+    };
+});
+
+// Steps from d3, see the license statement at the top of this file.
+var scaleLevels = [
+    // Format              interval
+    ['hh:mm:ss', ONE_SECOND],          // 1s
+    ['hh:mm:ss', ONE_SECOND * 5],      // 5s
+    ['hh:mm:ss', ONE_SECOND * 10],     // 10s
+    ['hh:mm:ss', ONE_SECOND * 15],     // 15s
+    ['hh:mm:ss', ONE_SECOND * 30],     // 30s
+    ['hh:mm\nMM-dd', ONE_MINUTE],      // 1m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 5],  // 5m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 10], // 10m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 15], // 15m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 30], // 30m
+    ['hh:mm\nMM-dd', ONE_HOUR],        // 1h
+    ['hh:mm\nMM-dd', ONE_HOUR * 2],    // 2h
+    ['hh:mm\nMM-dd', ONE_HOUR * 6],    // 6h
+    ['hh:mm\nMM-dd', ONE_HOUR * 12],   // 12h
+    ['MM-dd\nyyyy', ONE_DAY],          // 1d
+    ['MM-dd\nyyyy', ONE_DAY * 2],      // 2d
+    ['MM-dd\nyyyy', ONE_DAY * 3],      // 3d
+    ['MM-dd\nyyyy', ONE_DAY * 4],      // 4d
+    ['MM-dd\nyyyy', ONE_DAY * 5],      // 5d
+    ['MM-dd\nyyyy', ONE_DAY * 6],      // 6d
+    ['week', ONE_DAY * 7],             // 7d
+    ['MM-dd\nyyyy', ONE_DAY * 10],     // 10d
+    ['week', ONE_DAY * 14],            // 2w
+    ['week', ONE_DAY * 21],            // 3w
+    ['month', ONE_DAY * 31],           // 1M
+    ['week', ONE_DAY * 42],            // 6w
+    ['month', ONE_DAY * 62],           // 2M
+    ['week', ONE_DAY * 42],            // 10w
+    ['quarter', ONE_DAY * 380 / 4],    // 3M
+    ['month', ONE_DAY * 31 * 4],       // 4M
+    ['month', ONE_DAY * 31 * 5],       // 5M
+    ['half-year', ONE_DAY * 380 / 2],  // 6M
+    ['month', ONE_DAY * 31 * 8],       // 8M
+    ['month', ONE_DAY * 31 * 10],      // 10M
+    ['year', ONE_DAY * 380]            // 1Y
+];
+
+/**
+ * @param {module:echarts/model/Model}
+ * @return {module:echarts/scale/Time}
+ */
+TimeScale.create = function (model) {
+    return new TimeScale({useUTC: model.ecModel.get('useUTC')});
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Log scale
+ * @module echarts/scale/Log
+ */
+
+// Use some method of IntervalScale
+var scaleProto$1 = Scale.prototype;
+var intervalScaleProto$1 = IntervalScale.prototype;
+
+var getPrecisionSafe$1 = getPrecisionSafe;
+var roundingErrorFix = round$1;
+
+var mathFloor$1 = Math.floor;
+var mathCeil$1 = Math.ceil;
+var mathPow$1 = Math.pow;
+
+var mathLog = Math.log;
+
+var LogScale = Scale.extend({
+
+    type: 'log',
+
+    base: 10,
+
+    $constructor: function () {
+        Scale.apply(this, arguments);
+        this._originalScale = new IntervalScale();
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getTicks: function () {
+        var originalScale = this._originalScale;
+        var extent = this._extent;
+        var originalExtent = originalScale.getExtent();
+
+        return map(intervalScaleProto$1.getTicks.call(this), function (val) {
+            var powVal = round$1(mathPow$1(this.base, val));
+
+            // Fix #4158
+            powVal = (val === extent[0] && originalScale.__fixMin)
+                ? fixRoundingError(powVal, originalExtent[0])
+                : powVal;
+            powVal = (val === extent[1] && originalScale.__fixMax)
+                ? fixRoundingError(powVal, originalExtent[1])
+                : powVal;
+
+            return powVal;
+        }, this);
+    },
+
+    /**
+     * @param {number} val
+     * @return {string}
+     */
+    getLabel: intervalScaleProto$1.getLabel,
+
+    /**
+     * @param  {number} val
+     * @return {number}
+     */
+    scale: function (val) {
+        val = scaleProto$1.scale.call(this, val);
+        return mathPow$1(this.base, val);
+    },
+
+    /**
+     * @param {number} start
+     * @param {number} end
+     */
+    setExtent: function (start, end) {
+        var base = this.base;
+        start = mathLog(start) / mathLog(base);
+        end = mathLog(end) / mathLog(base);
+        intervalScaleProto$1.setExtent.call(this, start, end);
+    },
+
+    /**
+     * @return {number} end
+     */
+    getExtent: function () {
+        var base = this.base;
+        var extent = scaleProto$1.getExtent.call(this);
+        extent[0] = mathPow$1(base, extent[0]);
+        extent[1] = mathPow$1(base, extent[1]);
+
+        // Fix #4158
+        var originalScale = this._originalScale;
+        var originalExtent = originalScale.getExtent();
+        originalScale.__fixMin && (extent[0] = fixRoundingError(extent[0], originalExtent[0]));
+        originalScale.__fixMax && (extent[1] = fixRoundingError(extent[1], originalExtent[1]));
+
+        return extent;
+    },
+
+    /**
+     * @param  {Array.<number>} extent
+     */
+    unionExtent: function (extent) {
+        this._originalScale.unionExtent(extent);
+
+        var base = this.base;
+        extent[0] = mathLog(extent[0]) / mathLog(base);
+        extent[1] = mathLog(extent[1]) / mathLog(base);
+        scaleProto$1.unionExtent.call(this, extent);
+    },
+
+    /**
+     * @override
+     */
+    unionExtentFromData: function (data, dim) {
+        // TODO
+        // filter value that <= 0
+        this.unionExtent(data.getApproximateExtent(dim));
+    },
+
+    /**
+     * Update interval and extent of intervals for nice ticks
+     * @param  {number} [approxTickNum = 10] Given approx tick number
+     */
+    niceTicks: function (approxTickNum) {
+        approxTickNum = approxTickNum || 10;
+        var extent = this._extent;
+        var span = extent[1] - extent[0];
+        if (span === Infinity || span <= 0) {
+            return;
+        }
+
+        var interval = quantity(span);
+        var err = approxTickNum / span * interval;
+
+        // Filter ticks to get closer to the desired count.
+        if (err <= 0.5) {
+            interval *= 10;
+        }
+
+        // Interval should be integer
+        while (!isNaN(interval) && Math.abs(interval) < 1 && Math.abs(interval) > 0) {
+            interval *= 10;
+        }
+
+        var niceExtent = [
+            round$1(mathCeil$1(extent[0] / interval) * interval),
+            round$1(mathFloor$1(extent[1] / interval) * interval)
+        ];
+
+        this._interval = interval;
+        this._niceExtent = niceExtent;
+    },
+
+    /**
+     * Nice extent.
+     * @override
+     */
+    niceExtent: function (opt) {
+        intervalScaleProto$1.niceExtent.call(this, opt);
+
+        var originalScale = this._originalScale;
+        originalScale.__fixMin = opt.fixMin;
+        originalScale.__fixMax = opt.fixMax;
+    }
+
+});
+
+each$1(['contain', 'normalize'], function (methodName) {
+    LogScale.prototype[methodName] = function (val) {
+        val = mathLog(val) / mathLog(this.base);
+        return scaleProto$1[methodName].call(this, val);
+    };
+});
+
+LogScale.create = function () {
+    return new LogScale();
+};
+
+function fixRoundingError(val, originalVal) {
+    return roundingErrorFix(val, getPrecisionSafe$1(originalVal));
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Get axis scale extent before niced.
+ * Item of returned array can only be number (including Infinity and NaN).
+ */
+function getScaleExtent(scale, model) {
+    var scaleType = scale.type;
+
+    var min = model.getMin();
+    var max = model.getMax();
+    var fixMin = min != null;
+    var fixMax = max != null;
+    var originalExtent = scale.getExtent();
+
+    var axisDataLen;
+    var boundaryGap;
+    var span;
+    if (scaleType === 'ordinal') {
+        axisDataLen = model.getCategories().length;
+    }
+    else {
+        boundaryGap = model.get('boundaryGap');
+        if (!isArray(boundaryGap)) {
+            boundaryGap = [boundaryGap || 0, boundaryGap || 0];
+        }
+        if (typeof boundaryGap[0] === 'boolean') {
+            if (__DEV__) {
+                console.warn('Boolean type for boundaryGap is only '
+                    + 'allowed for ordinal axis. Please use string in '
+                    + 'percentage instead, e.g., "20%". Currently, '
+                    + 'boundaryGap is set to be 0.');
+            }
+            boundaryGap = [0, 0];
+        }
+        boundaryGap[0] = parsePercent$1(boundaryGap[0], 1);
+        boundaryGap[1] = parsePercent$1(boundaryGap[1], 1);
+        span = (originalExtent[1] - originalExtent[0])
+            || Math.abs(originalExtent[0]);
+    }
+
+    // Notice: When min/max is not set (that is, when there are null/undefined,
+    // which is the most common case), these cases should be ensured:
+    // (1) For 'ordinal', show all axis.data.
+    // (2) For others:
+    //      + `boundaryGap` is applied (if min/max set, boundaryGap is
+    //      disabled).
+    //      + If `needCrossZero`, min/max should be zero, otherwise, min/max should
+    //      be the result that originalExtent enlarged by boundaryGap.
+    // (3) If no data, it should be ensured that `scale.setBlank` is set.
+
+    // FIXME
+    // (1) When min/max is 'dataMin' or 'dataMax', should boundaryGap be able to used?
+    // (2) When `needCrossZero` and all data is positive/negative, should it be ensured
+    // that the results processed by boundaryGap are positive/negative?
+
+    if (min == null) {
+        min = scaleType === 'ordinal'
+            ? (axisDataLen ? 0 : NaN)
+            : originalExtent[0] - boundaryGap[0] * span;
+    }
+    if (max == null) {
+        max = scaleType === 'ordinal'
+            ? (axisDataLen ? axisDataLen - 1 : NaN)
+            : originalExtent[1] + boundaryGap[1] * span;
+    }
+
+    if (min === 'dataMin') {
+        min = originalExtent[0];
+    }
+    else if (typeof min === 'function') {
+        min = min({
+            min: originalExtent[0],
+            max: originalExtent[1]
+        });
+    }
+
+    if (max === 'dataMax') {
+        max = originalExtent[1];
+    }
+    else if (typeof max === 'function') {
+        max = max({
+            min: originalExtent[0],
+            max: originalExtent[1]
+        });
+    }
+
+    (min == null || !isFinite(min)) && (min = NaN);
+    (max == null || !isFinite(max)) && (max = NaN);
+
+    scale.setBlank(
+        eqNaN(min)
+        || eqNaN(max)
+        || (scaleType === 'ordinal' && !scale.getOrdinalMeta().categories.length)
+    );
+
+    // Evaluate if axis needs cross zero
+    if (model.getNeedCrossZero()) {
+        // Axis is over zero and min is not set
+        if (min > 0 && max > 0 && !fixMin) {
+            min = 0;
+        }
+        // Axis is under zero and max is not set
+        if (min < 0 && max < 0 && !fixMax) {
+            max = 0;
+        }
+    }
+
+    // If bars are placed on a base axis of type time or interval account for axis boundary overflow and current axis
+    // is base axis
+    // FIXME
+    // (1) Consider support value axis, where below zero and axis `onZero` should be handled properly.
+    // (2) Refactor the logic with `barGrid`. Is it not need to `makeBarWidthAndOffsetInfo` twice with different extent?
+    //     Should not depend on series type `bar`?
+    // (3) Fix that might overlap when using dataZoom.
+    // (4) Consider other chart types using `barGrid`?
+    // See #6728, #4862, `test/bar-overflow-time-plot.html`
+    var ecModel = model.ecModel;
+    if (ecModel && (scaleType === 'time' /*|| scaleType === 'interval' */)) {
+        var barSeriesModels = prepareLayoutBarSeries('bar', ecModel);
+        var isBaseAxisAndHasBarSeries;
+
+        each$1(barSeriesModels, function (seriesModel) {
+            isBaseAxisAndHasBarSeries |= seriesModel.getBaseAxis() === model.axis;
+        });
+
+        if (isBaseAxisAndHasBarSeries) {
+            // Calculate placement of bars on axis
+            var barWidthAndOffset = makeColumnLayout(barSeriesModels);
+
+            // Adjust axis min and max to account for overflow
+            var adjustedScale = adjustScaleForOverflow(min, max, model, barWidthAndOffset);
+            min = adjustedScale.min;
+            max = adjustedScale.max;
+        }
+    }
+
+    return [min, max];
+}
+
+function adjustScaleForOverflow(min, max, model, barWidthAndOffset) {
+
+    // Get Axis Length
+    var axisExtent = model.axis.getExtent();
+    var axisLength = axisExtent[1] - axisExtent[0];
+
+    // Get bars on current base axis and calculate min and max overflow
+    var barsOnCurrentAxis = retrieveColumnLayout(barWidthAndOffset, model.axis);
+    if (barsOnCurrentAxis === undefined) {
+        return {min: min, max: max};
+    }
+
+    var minOverflow = Infinity;
+    each$1(barsOnCurrentAxis, function (item) {
+        minOverflow = Math.min(item.offset, minOverflow);
+    });
+    var maxOverflow = -Infinity;
+    each$1(barsOnCurrentAxis, function (item) {
+        maxOverflow = Math.max(item.offset + item.width, maxOverflow);
+    });
+    minOverflow = Math.abs(minOverflow);
+    maxOverflow = Math.abs(maxOverflow);
+    var totalOverFlow = minOverflow + maxOverflow;
+
+    // Calulate required buffer based on old range and overflow
+    var oldRange = max - min;
+    var oldRangePercentOfNew = (1 - (minOverflow + maxOverflow) / axisLength);
+    var overflowBuffer = ((oldRange / oldRangePercentOfNew) - oldRange);
+
+    max += overflowBuffer * (maxOverflow / totalOverFlow);
+    min -= overflowBuffer * (minOverflow / totalOverFlow);
+
+    return {min: min, max: max};
+}
+
+function niceScaleExtent(scale, model) {
+    var extent = getScaleExtent(scale, model);
+    var fixMin = model.getMin() != null;
+    var fixMax = model.getMax() != null;
+    var splitNumber = model.get('splitNumber');
+
+    if (scale.type === 'log') {
+        scale.base = model.get('logBase');
+    }
+
+    var scaleType = scale.type;
+    scale.setExtent(extent[0], extent[1]);
+    scale.niceExtent({
+        splitNumber: splitNumber,
+        fixMin: fixMin,
+        fixMax: fixMax,
+        minInterval: (scaleType === 'interval' || scaleType === 'time')
+            ? model.get('minInterval') : null,
+        maxInterval: (scaleType === 'interval' || scaleType === 'time')
+            ? model.get('maxInterval') : null
+    });
+
+    // If some one specified the min, max. And the default calculated interval
+    // is not good enough. He can specify the interval. It is often appeared
+    // in angle axis with angle 0 - 360. Interval calculated in interval scale is hard
+    // to be 60.
+    // FIXME
+    var interval = model.get('interval');
+    if (interval != null) {
+        scale.setInterval && scale.setInterval(interval);
+    }
+}
+
+/**
+ * @param {module:echarts/model/Model} model
+ * @param {string} [axisType] Default retrieve from model.type
+ * @return {module:echarts/scale/*}
+ */
+function createScaleByModel(model, axisType) {
+    axisType = axisType || model.get('type');
+    if (axisType) {
+        switch (axisType) {
+            // Buildin scale
+            case 'category':
+                return new OrdinalScale(
+                    model.getOrdinalMeta
+                        ? model.getOrdinalMeta()
+                        : model.getCategories(),
+                    [Infinity, -Infinity]
+                );
+            case 'value':
+                return new IntervalScale();
+            // Extended scale, like time and log
+            default:
+                return (Scale.getClass(axisType) || IntervalScale).create(model);
+        }
+    }
+}
+
+/**
+ * Check if the axis corss 0
+ */
+function ifAxisCrossZero(axis) {
+    var dataExtent = axis.scale.getExtent();
+    var min = dataExtent[0];
+    var max = dataExtent[1];
+    return !((min > 0 && max > 0) || (min < 0 && max < 0));
+}
+
+/**
+ * @param {module:echarts/coord/Axis} axis
+ * @return {Function} Label formatter function.
+ *         param: {number} tickValue,
+ *         param: {number} idx, the index in all ticks.
+ *                         If category axis, this param is not requied.
+ *         return: {string} label string.
+ */
+function makeLabelFormatter(axis) {
+    var labelFormatter = axis.getLabelModel().get('formatter');
+    var categoryTickStart = axis.type === 'category' ? axis.scale.getExtent()[0] : null;
+
+    if (typeof labelFormatter === 'string') {
+        labelFormatter = (function (tpl) {
+            return function (val) {
+                return tpl.replace('{value}', val != null ? val : '');
+            };
+        })(labelFormatter);
+        // Consider empty array
+        return labelFormatter;
+    }
+    else if (typeof labelFormatter === 'function') {
+        return function (tickValue, idx) {
+            // The original intention of `idx` is "the index of the tick in all ticks".
+            // But the previous implementation of category axis do not consider the
+            // `axisLabel.interval`, which cause that, for example, the `interval` is
+            // `1`, then the ticks "name5", "name7", "name9" are displayed, where the
+            // corresponding `idx` are `0`, `2`, `4`, but not `0`, `1`, `2`. So we keep
+            // the definition here for back compatibility.
+            if (categoryTickStart != null) {
+                idx = tickValue - categoryTickStart;
+            }
+            return labelFormatter(getAxisRawValue(axis, tickValue), idx);
+        };
+    }
+    else {
+        return function (tick) {
+            return axis.scale.getLabel(tick);
+        };
+    }
+}
+
+function getAxisRawValue(axis, value) {
+    // In category axis with data zoom, tick is not the original
+    // index of axis.data. So tick should not be exposed to user
+    // in category axis.
+    return axis.type === 'category' ? axis.scale.getLabel(value) : value;
+}
+
+/**
+ * @param {module:echarts/coord/Axis} axis
+ * @return {module:zrender/core/BoundingRect} Be null/undefined if no labels.
+ */
+function estimateLabelUnionRect(axis) {
+    var axisModel = axis.model;
+    var scale = axis.scale;
+
+    if (!axisModel.get('axisLabel.show') || scale.isBlank()) {
+        return;
+    }
+
+    var isCategory = axis.type === 'category';
+
+    var realNumberScaleTicks;
+    var tickCount;
+    var categoryScaleExtent = scale.getExtent();
+
+    // Optimize for large category data, avoid call `getTicks()`.
+    if (isCategory) {
+        tickCount = scale.count();
+    }
+    else {
+        realNumberScaleTicks = scale.getTicks();
+        tickCount = realNumberScaleTicks.length;
+    }
+
+    var axisLabelModel = axis.getLabelModel();
+    var labelFormatter = makeLabelFormatter(axis);
+
+    var rect;
+    var step = 1;
+    // Simple optimization for large amount of labels
+    if (tickCount > 40) {
+        step = Math.ceil(tickCount / 40);
+    }
+    for (var i = 0; i < tickCount; i += step) {
+        var tickValue = realNumberScaleTicks ? realNumberScaleTicks[i] : categoryScaleExtent[0] + i;
+        var label = labelFormatter(tickValue);
+        var unrotatedSingleRect = axisLabelModel.getTextRect(label);
+        var singleRect = rotateTextRect(unrotatedSingleRect, axisLabelModel.get('rotate') || 0);
+
+        rect ? rect.union(singleRect) : (rect = singleRect);
+    }
+
+    return rect;
+}
+
+function rotateTextRect(textRect, rotate) {
+    var rotateRadians = rotate * Math.PI / 180;
+    var boundingBox = textRect.plain();
+    var beforeWidth = boundingBox.width;
+    var beforeHeight = boundingBox.height;
+    var afterWidth = beforeWidth * Math.cos(rotateRadians) + beforeHeight * Math.sin(rotateRadians);
+    var afterHeight = beforeWidth * Math.sin(rotateRadians) + beforeHeight * Math.cos(rotateRadians);
+    var rotatedRect = new BoundingRect(boundingBox.x, boundingBox.y, afterWidth, afterHeight);
+
+    return rotatedRect;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisModelCommonMixin = {
+
+    /**
+     * @param {boolean} origin
+     * @return {number|string} min value or 'dataMin' or null/undefined (means auto) or NaN
+     */
+    getMin: function (origin) {
+        var option = this.option;
+        var min = (!origin && option.rangeStart != null)
+            ? option.rangeStart : option.min;
+
+        if (this.axis
+            && min != null
+            && min !== 'dataMin'
+            && typeof min !== 'function'
+            && !eqNaN(min)
+        ) {
+            min = this.axis.scale.parse(min);
+        }
+        return min;
+    },
+
+    /**
+     * @param {boolean} origin
+     * @return {number|string} max value or 'dataMax' or null/undefined (means auto) or NaN
+     */
+    getMax: function (origin) {
+        var option = this.option;
+        var max = (!origin && option.rangeEnd != null)
+            ? option.rangeEnd : option.max;
+
+        if (this.axis
+            && max != null
+            && max !== 'dataMax'
+            && typeof max !== 'function'
+            && !eqNaN(max)
+        ) {
+            max = this.axis.scale.parse(max);
+        }
+        return max;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    getNeedCrossZero: function () {
+        var option = this.option;
+        return (option.rangeStart != null || option.rangeEnd != null)
+            ? false : !option.scale;
+    },
+
+    /**
+     * Should be implemented by each axis model if necessary.
+     * @return {module:echarts/model/Component} coordinate system model
+     */
+    getCoordSysModel: noop,
+
+    /**
+     * @param {number} rangeStart Can only be finite number or null/undefined or NaN.
+     * @param {number} rangeEnd Can only be finite number or null/undefined or NaN.
+     */
+    setRange: function (rangeStart, rangeEnd) {
+        this.option.rangeStart = rangeStart;
+        this.option.rangeEnd = rangeEnd;
+    },
+
+    /**
+     * Reset range
+     */
+    resetRange: function () {
+        // rangeStart and rangeEnd is readonly.
+        this.option.rangeStart = this.option.rangeEnd = null;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Symbol factory
+
+/**
+ * Triangle shape
+ * @inner
+ */
+var Triangle = extendShape({
+    type: 'triangle',
+    shape: {
+        cx: 0,
+        cy: 0,
+        width: 0,
+        height: 0
+    },
+    buildPath: function (path, shape) {
+        var cx = shape.cx;
+        var cy = shape.cy;
+        var width = shape.width / 2;
+        var height = shape.height / 2;
+        path.moveTo(cx, cy - height);
+        path.lineTo(cx + width, cy + height);
+        path.lineTo(cx - width, cy + height);
+        path.closePath();
+    }
+});
+
+/**
+ * Diamond shape
+ * @inner
+ */
+var Diamond = extendShape({
+    type: 'diamond',
+    shape: {
+        cx: 0,
+        cy: 0,
+        width: 0,
+        height: 0
+    },
+    buildPath: function (path, shape) {
+        var cx = shape.cx;
+        var cy = shape.cy;
+        var width = shape.width / 2;
+        var height = shape.height / 2;
+        path.moveTo(cx, cy - height);
+        path.lineTo(cx + width, cy);
+        path.lineTo(cx, cy + height);
+        path.lineTo(cx - width, cy);
+        path.closePath();
+    }
+});
+
+/**
+ * Pin shape
+ * @inner
+ */
+var Pin = extendShape({
+    type: 'pin',
+    shape: {
+        // x, y on the cusp
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    buildPath: function (path, shape) {
+        var x = shape.x;
+        var y = shape.y;
+        var w = shape.width / 5 * 3;
+        // Height must be larger than width
+        var h = Math.max(w, shape.height);
+        var r = w / 2;
+
+        // Dist on y with tangent point and circle center
+        var dy = r * r / (h - r);
+        var cy = y - h + r + dy;
+        var angle = Math.asin(dy / r);
+        // Dist on x with tangent point and circle center
+        var dx = Math.cos(angle) * r;
+
+        var tanX = Math.sin(angle);
+        var tanY = Math.cos(angle);
+
+        var cpLen = r * 0.6;
+        var cpLen2 = r * 0.7;
+
+        path.moveTo(x - dx, cy + dy);
+
+        path.arc(
+            x, cy, r,
+            Math.PI - angle,
+            Math.PI * 2 + angle
+        );
+        path.bezierCurveTo(
+            x + dx - tanX * cpLen, cy + dy + tanY * cpLen,
+            x, y - cpLen2,
+            x, y
+        );
+        path.bezierCurveTo(
+            x, y - cpLen2,
+            x - dx + tanX * cpLen, cy + dy + tanY * cpLen,
+            x - dx, cy + dy
+        );
+        path.closePath();
+    }
+});
+
+/**
+ * Arrow shape
+ * @inner
+ */
+var Arrow = extendShape({
+
+    type: 'arrow',
+
+    shape: {
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var height = shape.height;
+        var width = shape.width;
+        var x = shape.x;
+        var y = shape.y;
+        var dx = width / 3 * 2;
+        ctx.moveTo(x, y);
+        ctx.lineTo(x + dx, y + height);
+        ctx.lineTo(x, y + height / 4 * 3);
+        ctx.lineTo(x - dx, y + height);
+        ctx.lineTo(x, y);
+        ctx.closePath();
+    }
+});
+
+/**
+ * Map of path contructors
+ * @type {Object.<string, module:zrender/graphic/Path>}
+ */
+var symbolCtors = {
+
+    line: Line,
+
+    rect: Rect,
+
+    roundRect: Rect,
+
+    square: Rect,
+
+    circle: Circle,
+
+    diamond: Diamond,
+
+    pin: Pin,
+
+    arrow: Arrow,
+
+    triangle: Triangle
+};
+
+var symbolShapeMakers = {
+
+    line: function (x, y, w, h, shape) {
+        // FIXME
+        shape.x1 = x;
+        shape.y1 = y + h / 2;
+        shape.x2 = x + w;
+        shape.y2 = y + h / 2;
+    },
+
+    rect: function (x, y, w, h, shape) {
+        shape.x = x;
+        shape.y = y;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    roundRect: function (x, y, w, h, shape) {
+        shape.x = x;
+        shape.y = y;
+        shape.width = w;
+        shape.height = h;
+        shape.r = Math.min(w, h) / 4;
+    },
+
+    square: function (x, y, w, h, shape) {
+        var size = Math.min(w, h);
+        shape.x = x;
+        shape.y = y;
+        shape.width = size;
+        shape.height = size;
+    },
+
+    circle: function (x, y, w, h, shape) {
+        // Put circle in the center of square
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.r = Math.min(w, h) / 2;
+    },
+
+    diamond: function (x, y, w, h, shape) {
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    pin: function (x, y, w, h, shape) {
+        shape.x = x + w / 2;
+        shape.y = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    arrow: function (x, y, w, h, shape) {
+        shape.x = x + w / 2;
+        shape.y = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    triangle: function (x, y, w, h, shape) {
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    }
+};
+
+var symbolBuildProxies = {};
+each$1(symbolCtors, function (Ctor, name) {
+    symbolBuildProxies[name] = new Ctor();
+});
+
+var SymbolClz = extendShape({
+
+    type: 'symbol',
+
+    shape: {
+        symbolType: '',
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    beforeBrush: function () {
+        var style = this.style;
+        var shape = this.shape;
+        // FIXME
+        if (shape.symbolType === 'pin' && style.textPosition === 'inside') {
+            style.textPosition = ['50%', '40%'];
+            style.textAlign = 'center';
+            style.textVerticalAlign = 'middle';
+        }
+    },
+
+    buildPath: function (ctx, shape, inBundle) {
+        var symbolType = shape.symbolType;
+        var proxySymbol = symbolBuildProxies[symbolType];
+        if (shape.symbolType !== 'none') {
+            if (!proxySymbol) {
+                // Default rect
+                symbolType = 'rect';
+                proxySymbol = symbolBuildProxies[symbolType];
+            }
+            symbolShapeMakers[symbolType](
+                shape.x, shape.y, shape.width, shape.height, proxySymbol.shape
+            );
+            proxySymbol.buildPath(ctx, proxySymbol.shape, inBundle);
+        }
+    }
+});
+
+// Provide setColor helper method to avoid determine if set the fill or stroke outside
+function symbolPathSetColor(color, innerColor) {
+    if (this.type !== 'image') {
+        var symbolStyle = this.style;
+        var symbolShape = this.shape;
+        if (symbolShape && symbolShape.symbolType === 'line') {
+            symbolStyle.stroke = color;
+        }
+        else if (this.__isEmptyBrush) {
+            symbolStyle.stroke = color;
+            symbolStyle.fill = innerColor || '#fff';
+        }
+        else {
+            // FIXME 判断图形默认是填充还是描边，使用 onlyStroke ?
+            symbolStyle.fill && (symbolStyle.fill = color);
+            symbolStyle.stroke && (symbolStyle.stroke = color);
+        }
+        this.dirty(false);
+    }
+}
+
+/**
+ * Create a symbol element with given symbol configuration: shape, x, y, width, height, color
+ * @param {string} symbolType
+ * @param {number} x
+ * @param {number} y
+ * @param {number} w
+ * @param {number} h
+ * @param {string} color
+ * @param {boolean} [keepAspect=false] whether to keep the ratio of w/h,
+ *                            for path and image only.
+ */
+function createSymbol(symbolType, x, y, w, h, color, keepAspect) {
+    // TODO Support image object, DynamicImage.
+
+    var isEmpty = symbolType.indexOf('empty') === 0;
+    if (isEmpty) {
+        symbolType = symbolType.substr(5, 1).toLowerCase() + symbolType.substr(6);
+    }
+    var symbolPath;
+
+    if (symbolType.indexOf('image://') === 0) {
+        symbolPath = makeImage(
+            symbolType.slice(8),
+            new BoundingRect(x, y, w, h),
+            keepAspect ? 'center' : 'cover'
+        );
+    }
+    else if (symbolType.indexOf('path://') === 0) {
+        symbolPath = makePath(
+            symbolType.slice(7),
+            {},
+            new BoundingRect(x, y, w, h),
+            keepAspect ? 'center' : 'cover'
+        );
+    }
+    else {
+        symbolPath = new SymbolClz({
+            shape: {
+                symbolType: symbolType,
+                x: x,
+                y: y,
+                width: w,
+                height: h
+            }
+        });
+    }
+
+    symbolPath.__isEmptyBrush = isEmpty;
+
+    symbolPath.setColor = symbolPathSetColor;
+
+    symbolPath.setColor(color);
+
+    return symbolPath;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// import createGraphFromNodeEdge from './chart/helper/createGraphFromNodeEdge';
+/**
+ * Create a muti dimension List structure from seriesModel.
+ * @param  {module:echarts/model/Model} seriesModel
+ * @return {module:echarts/data/List} list
+ */
+function createList(seriesModel) {
+    return createListFromArray(seriesModel.getSource(), seriesModel);
+}
+
+var dataStack$1 = {
+    isDimensionStacked: isDimensionStacked,
+    enableDataStack: enableDataStack,
+    getStackedDimension: getStackedDimension
+};
+
+/**
+ * Create scale
+ * @param {Array.<number>} dataExtent
+ * @param {Object|module:echarts/Model} option
+ */
+function createScale(dataExtent, option) {
+    var axisModel = option;
+    if (!Model.isInstance(option)) {
+        axisModel = new Model(option);
+        mixin(axisModel, axisModelCommonMixin);
+    }
+
+    var scale = createScaleByModel(axisModel);
+    scale.setExtent(dataExtent[0], dataExtent[1]);
+
+    niceScaleExtent(scale, axisModel);
+    return scale;
+}
+
+/**
+ * Mixin common methods to axis model,
+ *
+ * Inlcude methods
+ * `getFormattedLabels() => Array.<string>`
+ * `getCategories() => Array.<string>`
+ * `getMin(origin: boolean) => number`
+ * `getMax(origin: boolean) => number`
+ * `getNeedCrossZero() => boolean`
+ * `setRange(start: number, end: number)`
+ * `resetRange()`
+ */
+function mixinAxisModelCommonMethods(Model$$1) {
+    mixin(Model$$1, axisModelCommonMixin);
+}
+
+var helper = (Object.freeze || Object)({
+	createList: createList,
+	getLayoutRect: getLayoutRect,
+	dataStack: dataStack$1,
+	createScale: createScale,
+	mixinAxisModelCommonMethods: mixinAxisModelCommonMethods,
+	completeDimensions: completeDimensions,
+	createDimensions: createDimensions,
+	createSymbol: createSymbol
+});
+
+var EPSILON$3 = 1e-8;
+
+function isAroundEqual$1(a, b) {
+    return Math.abs(a - b) < EPSILON$3;
+}
+
+function contain$1(points, x, y) {
+    var w = 0;
+    var p = points[0];
+
+    if (!p) {
+        return false;
+    }
+
+    for (var i = 1; i < points.length; i++) {
+        var p2 = points[i];
+        w += windingLine(p[0], p[1], p2[0], p2[1], x, y);
+        p = p2;
+    }
+
+    // Close polygon
+    var p0 = points[0];
+    if (!isAroundEqual$1(p[0], p0[0]) || !isAroundEqual$1(p[1], p0[1])) {
+        w += windingLine(p[0], p[1], p0[0], p0[1], x, y);
+    }
+
+    return w !== 0;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/coord/geo/Region
+ */
+
+/**
+ * @param {string} name
+ * @param {Array} geometries
+ * @param {Array.<number>} cp
+ */
+function Region(name, geometries, cp) {
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.name = name;
+
+    /**
+     * @type {Array.<Array>}
+     * @readOnly
+     */
+    this.geometries = geometries;
+
+    if (!cp) {
+        var rect = this.getBoundingRect();
+        cp = [
+            rect.x + rect.width / 2,
+            rect.y + rect.height / 2
+        ];
+    }
+    else {
+        cp = [cp[0], cp[1]];
+    }
+    /**
+     * @type {Array.<number>}
+     */
+    this.center = cp;
+}
+
+Region.prototype = {
+
+    constructor: Region,
+
+    properties: null,
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getBoundingRect: function () {
+        var rect = this._rect;
+        if (rect) {
+            return rect;
+        }
+
+        var MAX_NUMBER = Number.MAX_VALUE;
+        var min$$1 = [MAX_NUMBER, MAX_NUMBER];
+        var max$$1 = [-MAX_NUMBER, -MAX_NUMBER];
+        var min2 = [];
+        var max2 = [];
+        var geometries = this.geometries;
+        for (var i = 0; i < geometries.length; i++) {
+            // Only support polygon
+            if (geometries[i].type !== 'polygon') {
+                continue;
+            }
+            // Doesn't consider hole
+            var exterior = geometries[i].exterior;
+            fromPoints(exterior, min2, max2);
+            min(min$$1, min$$1, min2);
+            max(max$$1, max$$1, max2);
+        }
+        // No data
+        if (i === 0) {
+            min$$1[0] = min$$1[1] = max$$1[0] = max$$1[1] = 0;
+        }
+
+        return (this._rect = new BoundingRect(
+            min$$1[0], min$$1[1], max$$1[0] - min$$1[0], max$$1[1] - min$$1[1]
+        ));
+    },
+
+    /**
+     * @param {<Array.<number>} coord
+     * @return {boolean}
+     */
+    contain: function (coord) {
+        var rect = this.getBoundingRect();
+        var geometries = this.geometries;
+        if (!rect.contain(coord[0], coord[1])) {
+            return false;
+        }
+        loopGeo: for (var i = 0, len$$1 = geometries.length; i < len$$1; i++) {
+            // Only support polygon.
+            if (geometries[i].type !== 'polygon') {
+                continue;
+            }
+            var exterior = geometries[i].exterior;
+            var interiors = geometries[i].interiors;
+            if (contain$1(exterior, coord[0], coord[1])) {
+                // Not in the region if point is in the hole.
+                for (var k = 0; k < (interiors ? interiors.length : 0); k++) {
+                    if (contain$1(interiors[k])) {
+                        continue loopGeo;
+                    }
+                }
+                return true;
+            }
+        }
+        return false;
+    },
+
+    transformTo: function (x, y, width, height) {
+        var rect = this.getBoundingRect();
+        var aspect = rect.width / rect.height;
+        if (!width) {
+            width = aspect * height;
+        }
+        else if (!height) {
+            height = width / aspect ;
+        }
+        var target = new BoundingRect(x, y, width, height);
+        var transform = rect.calculateTransform(target);
+        var geometries = this.geometries;
+        for (var i = 0; i < geometries.length; i++) {
+            // Only support polygon.
+            if (geometries[i].type !== 'polygon') {
+                continue;
+            }
+            var exterior = geometries[i].exterior;
+            var interiors = geometries[i].interiors;
+            for (var p = 0; p < exterior.length; p++) {
+                applyTransform(exterior[p], exterior[p], transform);
+            }
+            for (var h = 0; h < (interiors ? interiors.length : 0); h++) {
+                for (var p = 0; p < interiors[h].length; p++) {
+                    applyTransform(interiors[h][p], interiors[h][p], transform);
+                }
+            }
+        }
+        rect = this._rect;
+        rect.copy(target);
+        // Update center
+        this.center = [
+            rect.x + rect.width / 2,
+            rect.y + rect.height / 2
+        ];
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Parse and decode geo json
+ * @module echarts/coord/geo/parseGeoJson
+ */
+
+function decode(json) {
+    if (!json.UTF8Encoding) {
+        return json;
+    }
+    var encodeScale = json.UTF8Scale;
+    if (encodeScale == null) {
+        encodeScale = 1024;
+    }
+
+    var features = json.features;
+
+    for (var f = 0; f < features.length; f++) {
+        var feature = features[f];
+        var geometry = feature.geometry;
+        var coordinates = geometry.coordinates;
+        var encodeOffsets = geometry.encodeOffsets;
+
+        for (var c = 0; c < coordinates.length; c++) {
+            var coordinate = coordinates[c];
+
+            if (geometry.type === 'Polygon') {
+                coordinates[c] = decodePolygon(
+                    coordinate,
+                    encodeOffsets[c],
+                    encodeScale
+                );
+            }
+            else if (geometry.type === 'MultiPolygon') {
+                for (var c2 = 0; c2 < coordinate.length; c2++) {
+                    var polygon = coordinate[c2];
+                    coordinate[c2] = decodePolygon(
+                        polygon,
+                        encodeOffsets[c][c2],
+                        encodeScale
+                    );
+                }
+            }
+        }
+    }
+    // Has been decoded
+    json.UTF8Encoding = false;
+    return json;
+}
+
+function decodePolygon(coordinate, encodeOffsets, encodeScale) {
+    var result = [];
+    var prevX = encodeOffsets[0];
+    var prevY = encodeOffsets[1];
+
+    for (var i = 0; i < coordinate.length; i += 2) {
+        var x = coordinate.charCodeAt(i) - 64;
+        var y = coordinate.charCodeAt(i + 1) - 64;
+        // ZigZag decoding
+        x = (x >> 1) ^ (-(x & 1));
+        y = (y >> 1) ^ (-(y & 1));
+        // Delta deocding
+        x += prevX;
+        y += prevY;
+
+        prevX = x;
+        prevY = y;
+        // Dequantize
+        result.push([x / encodeScale, y / encodeScale]);
+    }
+
+    return result;
+}
+
+/**
+ * @alias module:echarts/coord/geo/parseGeoJson
+ * @param {Object} geoJson
+ * @return {module:zrender/container/Group}
+ */
+var parseGeoJson$1 = function (geoJson) {
+
+    decode(geoJson);
+
+    return map(filter(geoJson.features, function (featureObj) {
+        // Output of mapshaper may have geometry null
+        return featureObj.geometry
+            && featureObj.properties
+            && featureObj.geometry.coordinates.length > 0;
+    }), function (featureObj) {
+        var properties = featureObj.properties;
+        var geo = featureObj.geometry;
+
+        var coordinates = geo.coordinates;
+
+        var geometries = [];
+        if (geo.type === 'Polygon') {
+            geometries.push({
+                type: 'polygon',
+                // According to the GeoJSON specification.
+                // First must be exterior, and the rest are all interior(holes).
+                exterior: coordinates[0],
+                interiors: coordinates.slice(1)
+            });
+        }
+        if (geo.type === 'MultiPolygon') {
+            each$1(coordinates, function (item) {
+                if (item[0]) {
+                    geometries.push({
+                        type: 'polygon',
+                        exterior: item[0],
+                        interiors: item.slice(1)
+                    });
+                }
+            });
+        }
+
+        var region = new Region(
+            properties.name,
+            geometries,
+            properties.cp
+        );
+        region.properties = properties;
+        return region;
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$6 = makeInner();
+
+/**
+ * @param {module:echats/coord/Axis} axis
+ * @return {Object} {
+ *     labels: [{
+ *         formattedLabel: string,
+ *         rawLabel: string,
+ *         tickValue: number
+ *     }, ...],
+ *     labelCategoryInterval: number
+ * }
+ */
+function createAxisLabels(axis) {
+    // Only ordinal scale support tick interval
+    return axis.type === 'category'
+        ? makeCategoryLabels(axis)
+        : makeRealNumberLabels(axis);
+}
+
+/**
+ * @param {module:echats/coord/Axis} axis
+ * @param {module:echarts/model/Model} tickModel For example, can be axisTick, splitLine, splitArea.
+ * @return {Object} {
+ *     ticks: Array.<number>
+ *     tickCategoryInterval: number
+ * }
+ */
+function createAxisTicks(axis, tickModel) {
+    // Only ordinal scale support tick interval
+    return axis.type === 'category'
+        ? makeCategoryTicks(axis, tickModel)
+        : {ticks: axis.scale.getTicks()};
+}
+
+function makeCategoryLabels(axis) {
+    var labelModel = axis.getLabelModel();
+    var result = makeCategoryLabelsActually(axis, labelModel);
+
+    return (!labelModel.get('show') || axis.scale.isBlank())
+        ? {labels: [], labelCategoryInterval: result.labelCategoryInterval}
+        : result;
+}
+
+function makeCategoryLabelsActually(axis, labelModel) {
+    var labelsCache = getListCache(axis, 'labels');
+    var optionLabelInterval = getOptionCategoryInterval(labelModel);
+    var result = listCacheGet(labelsCache, optionLabelInterval);
+
+    if (result) {
+        return result;
+    }
+
+    var labels;
+    var numericLabelInterval;
+
+    if (isFunction$1(optionLabelInterval)) {
+        labels = makeLabelsByCustomizedCategoryInterval(axis, optionLabelInterval);
+    }
+    else {
+        numericLabelInterval = optionLabelInterval === 'auto'
+            ? makeAutoCategoryInterval(axis) : optionLabelInterval;
+        labels = makeLabelsByNumericCategoryInterval(axis, numericLabelInterval);
+    }
+
+    // Cache to avoid calling interval function repeatly.
+    return listCacheSet(labelsCache, optionLabelInterval, {
+        labels: labels, labelCategoryInterval: numericLabelInterval
+    });
+}
+
+function makeCategoryTicks(axis, tickModel) {
+    var ticksCache = getListCache(axis, 'ticks');
+    var optionTickInterval = getOptionCategoryInterval(tickModel);
+    var result = listCacheGet(ticksCache, optionTickInterval);
+
+    if (result) {
+        return result;
+    }
+
+    var ticks;
+    var tickCategoryInterval;
+
+    // Optimize for the case that large category data and no label displayed,
+    // we should not return all ticks.
+    if (!tickModel.get('show') || axis.scale.isBlank()) {
+        ticks = [];
+    }
+
+    if (isFunction$1(optionTickInterval)) {
+        ticks = makeLabelsByCustomizedCategoryInterval(axis, optionTickInterval, true);
+    }
+    // Always use label interval by default despite label show. Consider this
+    // scenario, Use multiple grid with the xAxis sync, and only one xAxis shows
+    // labels. `splitLine` and `axisTick` should be consistent in this case.
+    else if (optionTickInterval === 'auto') {
+        var labelsResult = makeCategoryLabelsActually(axis, axis.getLabelModel());
+        tickCategoryInterval = labelsResult.labelCategoryInterval;
+        ticks = map(labelsResult.labels, function (labelItem) {
+            return labelItem.tickValue;
+        });
+    }
+    else {
+        tickCategoryInterval = optionTickInterval;
+        ticks = makeLabelsByNumericCategoryInterval(axis, tickCategoryInterval, true);
+    }
+
+    // Cache to avoid calling interval function repeatly.
+    return listCacheSet(ticksCache, optionTickInterval, {
+        ticks: ticks, tickCategoryInterval: tickCategoryInterval
+    });
+}
+
+function makeRealNumberLabels(axis) {
+    var ticks = axis.scale.getTicks();
+    var labelFormatter = makeLabelFormatter(axis);
+    return {
+        labels: map(ticks, function (tickValue, idx) {
+            return {
+                formattedLabel: labelFormatter(tickValue, idx),
+                rawLabel: axis.scale.getLabel(tickValue),
+                tickValue: tickValue
+            };
+        })
+    };
+}
+
+// Large category data calculation is performence sensitive, and ticks and label
+// probably be fetched by multiple times. So we cache the result.
+// axis is created each time during a ec process, so we do not need to clear cache.
+function getListCache(axis, prop) {
+    // Because key can be funciton, and cache size always be small, we use array cache.
+    return inner$6(axis)[prop] || (inner$6(axis)[prop] = []);
+}
+
+function listCacheGet(cache, key) {
+    for (var i = 0; i < cache.length; i++) {
+        if (cache[i].key === key) {
+            return cache[i].value;
+        }
+    }
+}
+
+function listCacheSet(cache, key, value) {
+    cache.push({key: key, value: value});
+    return value;
+}
+
+function makeAutoCategoryInterval(axis) {
+    var result = inner$6(axis).autoInterval;
+    return result != null
+        ? result
+        : (inner$6(axis).autoInterval = axis.calculateCategoryInterval());
+}
+
+/**
+ * Calculate interval for category axis ticks and labels.
+ * To get precise result, at least one of `getRotate` and `isHorizontal`
+ * should be implemented in axis.
+ */
+function calculateCategoryInterval(axis) {
+    var params = fetchAutoCategoryIntervalCalculationParams(axis);
+    var labelFormatter = makeLabelFormatter(axis);
+    var rotation = (params.axisRotate - params.labelRotate) / 180 * Math.PI;
+
+    var ordinalScale = axis.scale;
+    var ordinalExtent = ordinalScale.getExtent();
+    // Providing this method is for optimization:
+    // avoid generating a long array by `getTicks`
+    // in large category data case.
+    var tickCount = ordinalScale.count();
+
+    if (ordinalExtent[1] - ordinalExtent[0] < 1) {
+        return 0;
+    }
+
+    var step = 1;
+    // Simple optimization. Empirical value: tick count should less than 40.
+    if (tickCount > 40) {
+        step = Math.max(1, Math.floor(tickCount / 40));
+    }
+    var tickValue = ordinalExtent[0];
+    var unitSpan = axis.dataToCoord(tickValue + 1) - axis.dataToCoord(tickValue);
+    var unitW = Math.abs(unitSpan * Math.cos(rotation));
+    var unitH = Math.abs(unitSpan * Math.sin(rotation));
+
+    var maxW = 0;
+    var maxH = 0;
+
+    // Caution: Performance sensitive for large category data.
+    // Consider dataZoom, we should make appropriate step to avoid O(n) loop.
+    for (; tickValue <= ordinalExtent[1]; tickValue += step) {
+        var width = 0;
+        var height = 0;
+
+        // Polar is also calculated in assumptive linear layout here.
+        // Not precise, do not consider align and vertical align
+        // and each distance from axis line yet.
+        var rect = getBoundingRect(
+            labelFormatter(tickValue), params.font, 'center', 'top'
+        );
+        // Magic number
+        width = rect.width * 1.3;
+        height = rect.height * 1.3;
+
+        // Min size, void long loop.
+        maxW = Math.max(maxW, width, 7);
+        maxH = Math.max(maxH, height, 7);
+    }
+
+    var dw = maxW / unitW;
+    var dh = maxH / unitH;
+    // 0/0 is NaN, 1/0 is Infinity.
+    isNaN(dw) && (dw = Infinity);
+    isNaN(dh) && (dh = Infinity);
+    var interval = Math.max(0, Math.floor(Math.min(dw, dh)));
+
+    var cache = inner$6(axis.model);
+    var lastAutoInterval = cache.lastAutoInterval;
+    var lastTickCount = cache.lastTickCount;
+
+    // Use cache to keep interval stable while moving zoom window,
+    // otherwise the calculated interval might jitter when the zoom
+    // window size is close to the interval-changing size.
+    if (lastAutoInterval != null
+        && lastTickCount != null
+        && Math.abs(lastAutoInterval - interval) <= 1
+        && Math.abs(lastTickCount - tickCount) <= 1
+        // Always choose the bigger one, otherwise the critical
+        // point is not the same when zooming in or zooming out.
+        && lastAutoInterval > interval
+    ) {
+        interval = lastAutoInterval;
+    }
+    // Only update cache if cache not used, otherwise the
+    // changing of interval is too insensitive.
+    else {
+        cache.lastTickCount = tickCount;
+        cache.lastAutoInterval = interval;
+    }
+
+    return interval;
+}
+
+function fetchAutoCategoryIntervalCalculationParams(axis) {
+    var labelModel = axis.getLabelModel();
+    return {
+        axisRotate: axis.getRotate
+            ? axis.getRotate()
+            : (axis.isHorizontal && !axis.isHorizontal())
+            ? 90
+            : 0,
+        labelRotate: labelModel.get('rotate') || 0,
+        font: labelModel.getFont()
+    };
+}
+
+function makeLabelsByNumericCategoryInterval(axis, categoryInterval, onlyTick) {
+    var labelFormatter = makeLabelFormatter(axis);
+    var ordinalScale = axis.scale;
+    var ordinalExtent = ordinalScale.getExtent();
+    var labelModel = axis.getLabelModel();
+    var result = [];
+
+    // TODO: axisType: ordinalTime, pick the tick from each month/day/year/...
+
+    var step = Math.max((categoryInterval || 0) + 1, 1);
+    var startTick = ordinalExtent[0];
+    var tickCount = ordinalScale.count();
+
+    // Calculate start tick based on zero if possible to keep label consistent
+    // while zooming and moving while interval > 0. Otherwise the selection
+    // of displayable ticks and symbols probably keep changing.
+    // 3 is empirical value.
+    if (startTick !== 0 && step > 1 && tickCount / step > 2) {
+        startTick = Math.round(Math.ceil(startTick / step) * step);
+    }
+
+    // (1) Only add min max label here but leave overlap checking
+    // to render stage, which also ensure the returned list
+    // suitable for splitLine and splitArea rendering.
+    // (2) Scales except category always contain min max label so
+    // do not need to perform this process.
+    var showMinMax = {
+        min: labelModel.get('showMinLabel'),
+        max: labelModel.get('showMaxLabel')
+    };
+
+    if (showMinMax.min && startTick !== ordinalExtent[0]) {
+        addItem(ordinalExtent[0]);
+    }
+
+    // Optimize: avoid generating large array by `ordinalScale.getTicks()`.
+    var tickValue = startTick;
+    for (; tickValue <= ordinalExtent[1]; tickValue += step) {
+        addItem(tickValue);
+    }
+
+    if (showMinMax.max && tickValue !== ordinalExtent[1]) {
+        addItem(ordinalExtent[1]);
+    }
+
+    function addItem(tVal) {
+        result.push(onlyTick
+            ? tVal
+            : {
+                formattedLabel: labelFormatter(tVal),
+                rawLabel: ordinalScale.getLabel(tVal),
+                tickValue: tVal
+            }
+        );
+    }
+
+    return result;
+}
+
+// When interval is function, the result `false` means ignore the tick.
+// It is time consuming for large category data.
+function makeLabelsByCustomizedCategoryInterval(axis, categoryInterval, onlyTick) {
+    var ordinalScale = axis.scale;
+    var labelFormatter = makeLabelFormatter(axis);
+    var result = [];
+
+    each$1(ordinalScale.getTicks(), function (tickValue) {
+        var rawLabel = ordinalScale.getLabel(tickValue);
+        if (categoryInterval(tickValue, rawLabel)) {
+            result.push(onlyTick
+                ? tickValue
+                : {
+                    formattedLabel: labelFormatter(tickValue),
+                    rawLabel: rawLabel,
+                    tickValue: tickValue
+                }
+            );
+        }
+    });
+
+    return result;
+}
+
+// Can be null|'auto'|number|function
+function getOptionCategoryInterval(model) {
+    var interval = model.get('interval');
+    return interval == null ? 'auto' : interval;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var NORMALIZED_EXTENT = [0, 1];
+
+/**
+ * Base class of Axis.
+ * @constructor
+ */
+var Axis = function (dim, scale, extent) {
+
+    /**
+     * Axis dimension. Such as 'x', 'y', 'z', 'angle', 'radius'.
+     * @type {string}
+     */
+    this.dim = dim;
+
+    /**
+     * Axis scale
+     * @type {module:echarts/coord/scale/*}
+     */
+    this.scale = scale;
+
+    /**
+     * @type {Array.<number>}
+     * @private
+     */
+    this._extent = extent || [0, 0];
+
+    /**
+     * @type {boolean}
+     */
+    this.inverse = false;
+
+    /**
+     * Usually true when axis has a ordinal scale
+     * @type {boolean}
+     */
+    this.onBand = false;
+};
+
+Axis.prototype = {
+
+    constructor: Axis,
+
+    /**
+     * If axis extent contain given coord
+     * @param {number} coord
+     * @return {boolean}
+     */
+    contain: function (coord) {
+        var extent = this._extent;
+        var min = Math.min(extent[0], extent[1]);
+        var max = Math.max(extent[0], extent[1]);
+        return coord >= min && coord <= max;
+    },
+
+    /**
+     * If axis extent contain given data
+     * @param {number} data
+     * @return {boolean}
+     */
+    containData: function (data) {
+        return this.contain(this.dataToCoord(data));
+    },
+
+    /**
+     * Get coord extent.
+     * @return {Array.<number>}
+     */
+    getExtent: function () {
+        return this._extent.slice();
+    },
+
+    /**
+     * Get precision used for formatting
+     * @param {Array.<number>} [dataExtent]
+     * @return {number}
+     */
+    getPixelPrecision: function (dataExtent) {
+        return getPixelPrecision(
+            dataExtent || this.scale.getExtent(),
+            this._extent
+        );
+    },
+
+    /**
+     * Set coord extent
+     * @param {number} start
+     * @param {number} end
+     */
+    setExtent: function (start, end) {
+        var extent = this._extent;
+        extent[0] = start;
+        extent[1] = end;
+    },
+
+    /**
+     * Convert data to coord. Data is the rank if it has an ordinal scale
+     * @param {number} data
+     * @param  {boolean} clamp
+     * @return {number}
+     */
+    dataToCoord: function (data, clamp) {
+        var extent = this._extent;
+        var scale = this.scale;
+        data = scale.normalize(data);
+
+        if (this.onBand && scale.type === 'ordinal') {
+            extent = extent.slice();
+            fixExtentWithBands(extent, scale.count());
+        }
+
+        return linearMap(data, NORMALIZED_EXTENT, extent, clamp);
+    },
+
+    /**
+     * Convert coord to data. Data is the rank if it has an ordinal scale
+     * @param {number} coord
+     * @param  {boolean} clamp
+     * @return {number}
+     */
+    coordToData: function (coord, clamp) {
+        var extent = this._extent;
+        var scale = this.scale;
+
+        if (this.onBand && scale.type === 'ordinal') {
+            extent = extent.slice();
+            fixExtentWithBands(extent, scale.count());
+        }
+
+        var t = linearMap(coord, extent, NORMALIZED_EXTENT, clamp);
+
+        return this.scale.scale(t);
+    },
+
+    /**
+     * Convert pixel point to data in axis
+     * @param {Array.<number>} point
+     * @param  {boolean} clamp
+     * @return {number} data
+     */
+    pointToData: function (point, clamp) {
+        // Should be implemented in derived class if necessary.
+    },
+
+    /**
+     * Different from `zrUtil.map(axis.getTicks(), axis.dataToCoord, axis)`,
+     * `axis.getTicksCoords` considers `onBand`, which is used by
+     * `boundaryGap:true` of category axis and splitLine and splitArea.
+     * @param {Object} [opt]
+     * @param {number} [opt.tickModel=axis.model.getModel('axisTick')]
+     * @param {boolean} [opt.clamp] If `true`, the first and the last
+     *        tick must be at the axis end points. Otherwise, clip ticks
+     *        that outside the axis extent.
+     * @return {Array.<Object>} [{
+     *     coord: ...,
+     *     tickValue: ...
+     * }, ...]
+     */
+    getTicksCoords: function (opt) {
+        opt = opt || {};
+
+        var tickModel = opt.tickModel || this.getTickModel();
+
+        var result = createAxisTicks(this, tickModel);
+        var ticks = result.ticks;
+
+        var ticksCoords = map(ticks, function (tickValue) {
+            return {
+                coord: this.dataToCoord(tickValue),
+                tickValue: tickValue
+            };
+        }, this);
+
+        var alignWithLabel = tickModel.get('alignWithLabel');
+        fixOnBandTicksCoords(
+            this, ticksCoords, result.tickCategoryInterval, alignWithLabel, opt.clamp
+        );
+
+        return ticksCoords;
+    },
+
+    /**
+     * @return {Array.<Object>} [{
+     *     formattedLabel: string,
+     *     rawLabel: axis.scale.getLabel(tickValue)
+     *     tickValue: number
+     * }, ...]
+     */
+    getViewLabels: function () {
+        return createAxisLabels(this).labels;
+    },
+
+    /**
+     * @return {module:echarts/coord/model/Model}
+     */
+    getLabelModel: function () {
+        return this.model.getModel('axisLabel');
+    },
+
+    /**
+     * Notice here we only get the default tick model. For splitLine
+     * or splitArea, we should pass the splitLineModel or splitAreaModel
+     * manually when calling `getTicksCoords`.
+     * In GL, this method may be overrided to:
+     * `axisModel.getModel('axisTick', grid3DModel.getModel('axisTick'));`
+     * @return {module:echarts/coord/model/Model}
+     */
+    getTickModel: function () {
+        return this.model.getModel('axisTick');
+    },
+
+    /**
+     * Get width of band
+     * @return {number}
+     */
+    getBandWidth: function () {
+        var axisExtent = this._extent;
+        var dataExtent = this.scale.getExtent();
+
+        var len = dataExtent[1] - dataExtent[0] + (this.onBand ? 1 : 0);
+        // Fix #2728, avoid NaN when only one data.
+        len === 0 && (len = 1);
+
+        var size = Math.abs(axisExtent[1] - axisExtent[0]);
+
+        return Math.abs(size) / len;
+    },
+
+    /**
+     * @abstract
+     * @return {boolean} Is horizontal
+     */
+    isHorizontal: null,
+
+    /**
+     * @abstract
+     * @return {number} Get axis rotate, by degree.
+     */
+    getRotate: null,
+
+    /**
+     * Only be called in category axis.
+     * Can be overrided, consider other axes like in 3D.
+     * @return {number} Auto interval for cateogry axis tick and label
+     */
+    calculateCategoryInterval: function () {
+        return calculateCategoryInterval(this);
+    }
+
+};
+
+function fixExtentWithBands(extent, nTick) {
+    var size = extent[1] - extent[0];
+    var len = nTick;
+    var margin = size / len / 2;
+    extent[0] += margin;
+    extent[1] -= margin;
+}
+
+// If axis has labels [1, 2, 3, 4]. Bands on the axis are
+// |---1---|---2---|---3---|---4---|.
+// So the displayed ticks and splitLine/splitArea should between
+// each data item, otherwise cause misleading (e.g., split tow bars
+// of a single data item when there are two bar series).
+// Also consider if tickCategoryInterval > 0 and onBand, ticks and
+// splitLine/spliteArea should layout appropriately corresponding
+// to displayed labels. (So we should not use `getBandWidth` in this
+// case).
+function fixOnBandTicksCoords(axis, ticksCoords, tickCategoryInterval, alignWithLabel, clamp) {
+    var ticksLen = ticksCoords.length;
+
+    if (!axis.onBand || alignWithLabel || !ticksLen) {
+        return;
+    }
+
+    var axisExtent = axis.getExtent();
+    var last;
+    if (ticksLen === 1) {
+        ticksCoords[0].coord = axisExtent[0];
+        last = ticksCoords[1] = {coord: axisExtent[0]};
+    }
+    else {
+        var shift = (ticksCoords[1].coord - ticksCoords[0].coord);
+        each$1(ticksCoords, function (ticksItem) {
+            ticksItem.coord -= shift / 2;
+            var tickCategoryInterval = tickCategoryInterval || 0;
+            // Avoid split a single data item when odd interval.
+            if (tickCategoryInterval % 2 > 0) {
+                ticksItem.coord -= shift / ((tickCategoryInterval + 1) * 2);
+            }
+        });
+        last = {coord: ticksCoords[ticksLen - 1].coord + shift};
+        ticksCoords.push(last);
+    }
+
+    var inverse = axisExtent[0] > axisExtent[1];
+
+    if (littleThan(ticksCoords[0].coord, axisExtent[0])) {
+        clamp ? (ticksCoords[0].coord = axisExtent[0]) : ticksCoords.shift();
+    }
+    if (clamp && littleThan(axisExtent[0], ticksCoords[0].coord)) {
+        ticksCoords.unshift({coord: axisExtent[0]});
+    }
+    if (littleThan(axisExtent[1], last.coord)) {
+        clamp ? (last.coord = axisExtent[1]) : ticksCoords.pop();
+    }
+    if (clamp && littleThan(last.coord, axisExtent[1])) {
+        ticksCoords.push({coord: axisExtent[1]});
+    }
+
+    function littleThan(a, b) {
+        return inverse ? a > b : a < b;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Do not mount those modules on 'src/echarts' for better tree shaking.
+ */
+
+var parseGeoJson = parseGeoJson$1;
+
+var ecUtil = {};
+each$1([
+        'map', 'each', 'filter', 'indexOf', 'inherits', 'reduce', 'filter',
+        'bind', 'curry', 'isArray', 'isString', 'isObject', 'isFunction',
+        'extend', 'defaults', 'clone', 'merge'
+    ],
+    function (name) {
+        ecUtil[name] = zrUtil[name];
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.line',
+
+    dependencies: ['grid', 'polar'],
+
+    getInitialData: function (option, ecModel) {
+        if (__DEV__) {
+            var coordSys = option.coordinateSystem;
+            if (coordSys !== 'polar' && coordSys !== 'cartesian2d') {
+                throw new Error('Line not support coordinateSystem besides cartesian and polar');
+            }
+        }
+        return createListFromArray(this.getSource(), this);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // stack: null
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // polarIndex: 0,
+
+        // If clip the overflow value
+        clipOverflow: true,
+        // cursor: null,
+
+        label: {
+            position: 'top'
+        },
+        // itemStyle: {
+        // },
+
+        lineStyle: {
+            width: 2,
+            type: 'solid'
+        },
+        // areaStyle: {
+            // origin of areaStyle. Valid values:
+            // `'auto'/null/undefined`: from axisLine to data
+            // `'start'`: from min to data
+            // `'end'`: from data to max
+            // origin: 'auto'
+        // },
+        // false, 'start', 'end', 'middle'
+        step: false,
+
+        // Disabled if step is true
+        smooth: false,
+        smoothMonotone: null,
+        symbol: 'emptyCircle',
+        symbolSize: 4,
+        symbolRotate: null,
+
+        showSymbol: true,
+        // `false`: follow the label interval strategy.
+        // `true`: show all symbols.
+        // `'auto'`: If possible, show all symbols, otherwise
+        //           follow the label interval strategy.
+        showAllSymbol: 'auto',
+
+        // Whether to connect break point.
+        connectNulls: false,
+
+        // Sampling for large data. Can be: 'average', 'max', 'min', 'sum'.
+        sampling: 'none',
+
+        animationEasing: 'linear',
+
+        // Disable progressive
+        progressive: 0,
+        hoverLayerThreshold: Infinity
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @return {string} label string. Not null/undefined
+ */
+function getDefaultLabel(data, dataIndex) {
+    var labelDims = data.mapDimension('defaultedLabel', true);
+    var len = labelDims.length;
+
+    // Simple optimization (in lots of cases, label dims length is 1)
+    if (len === 1) {
+        return retrieveRawValue(data, dataIndex, labelDims[0]);
+    }
+    else if (len) {
+        var vals = [];
+        for (var i = 0; i < labelDims.length; i++) {
+            var val = retrieveRawValue(data, dataIndex, labelDims[i]);
+            vals.push(val);
+        }
+        return vals.join(' ');
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/Symbol
+ */
+
+/**
+ * @constructor
+ * @alias {module:echarts/chart/helper/Symbol}
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @extends {module:zrender/graphic/Group}
+ */
+function SymbolClz$1(data, idx, seriesScope) {
+    Group.call(this);
+    this.updateData(data, idx, seriesScope);
+}
+
+var symbolProto = SymbolClz$1.prototype;
+
+/**
+ * @public
+ * @static
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @return {Array.<number>} [width, height]
+ */
+var getSymbolSize = SymbolClz$1.getSymbolSize = function (data, idx) {
+    var symbolSize = data.getItemVisual(idx, 'symbolSize');
+    return symbolSize instanceof Array
+        ? symbolSize.slice()
+        : [+symbolSize, +symbolSize];
+};
+
+function getScale(symbolSize) {
+    return [symbolSize[0] / 2, symbolSize[1] / 2];
+}
+
+function driftSymbol(dx, dy) {
+    this.parent.drift(dx, dy);
+}
+
+symbolProto._createSymbol = function (
+    symbolType,
+    data,
+    idx,
+    symbolSize,
+    keepAspect
+) {
+    // Remove paths created before
+    this.removeAll();
+
+    var color = data.getItemVisual(idx, 'color');
+
+    // var symbolPath = createSymbol(
+    //     symbolType, -0.5, -0.5, 1, 1, color
+    // );
+    // If width/height are set too small (e.g., set to 1) on ios10
+    // and macOS Sierra, a circle stroke become a rect, no matter what
+    // the scale is set. So we set width/height as 2. See #4150.
+    var symbolPath = createSymbol(
+        symbolType, -1, -1, 2, 2, color, keepAspect
+    );
+
+    symbolPath.attr({
+        z2: 100,
+        culling: true,
+        scale: getScale(symbolSize)
+    });
+    // Rewrite drift method
+    symbolPath.drift = driftSymbol;
+
+    this._symbolType = symbolType;
+
+    this.add(symbolPath);
+};
+
+/**
+ * Stop animation
+ * @param {boolean} toLastFrame
+ */
+symbolProto.stopSymbolAnimation = function (toLastFrame) {
+    this.childAt(0).stopAnimation(toLastFrame);
+};
+
+/**
+ * FIXME:
+ * Caution: This method breaks the encapsulation of this module,
+ * but it indeed brings convenience. So do not use the method
+ * unless you detailedly know all the implements of `Symbol`,
+ * especially animation.
+ *
+ * Get symbol path element.
+ */
+symbolProto.getSymbolPath = function () {
+    return this.childAt(0);
+};
+
+/**
+ * Get scale(aka, current symbol size).
+ * Including the change caused by animation
+ */
+symbolProto.getScale = function () {
+    return this.childAt(0).scale;
+};
+
+/**
+ * Highlight symbol
+ */
+symbolProto.highlight = function () {
+    this.childAt(0).trigger('emphasis');
+};
+
+/**
+ * Downplay symbol
+ */
+symbolProto.downplay = function () {
+    this.childAt(0).trigger('normal');
+};
+
+/**
+ * @param {number} zlevel
+ * @param {number} z
+ */
+symbolProto.setZ = function (zlevel, z) {
+    var symbolPath = this.childAt(0);
+    symbolPath.zlevel = zlevel;
+    symbolPath.z = z;
+};
+
+symbolProto.setDraggable = function (draggable) {
+    var symbolPath = this.childAt(0);
+    symbolPath.draggable = draggable;
+    symbolPath.cursor = draggable ? 'move' : 'pointer';
+};
+
+/**
+ * Update symbol properties
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @param {Object} [seriesScope]
+ * @param {Object} [seriesScope.itemStyle]
+ * @param {Object} [seriesScope.hoverItemStyle]
+ * @param {Object} [seriesScope.symbolRotate]
+ * @param {Object} [seriesScope.symbolOffset]
+ * @param {module:echarts/model/Model} [seriesScope.labelModel]
+ * @param {module:echarts/model/Model} [seriesScope.hoverLabelModel]
+ * @param {boolean} [seriesScope.hoverAnimation]
+ * @param {Object} [seriesScope.cursorStyle]
+ * @param {module:echarts/model/Model} [seriesScope.itemModel]
+ * @param {string} [seriesScope.symbolInnerColor]
+ * @param {Object} [seriesScope.fadeIn=false]
+ */
+symbolProto.updateData = function (data, idx, seriesScope) {
+    this.silent = false;
+
+    var symbolType = data.getItemVisual(idx, 'symbol') || 'circle';
+    var seriesModel = data.hostModel;
+    var symbolSize = getSymbolSize(data, idx);
+    var isInit = symbolType !== this._symbolType;
+
+    if (isInit) {
+        var keepAspect = data.getItemVisual(idx, 'symbolKeepAspect');
+        this._createSymbol(symbolType, data, idx, symbolSize, keepAspect);
+    }
+    else {
+        var symbolPath = this.childAt(0);
+        symbolPath.silent = false;
+        updateProps(symbolPath, {
+            scale: getScale(symbolSize)
+        }, seriesModel, idx);
+    }
+
+    this._updateCommon(data, idx, symbolSize, seriesScope);
+
+    if (isInit) {
+        var symbolPath = this.childAt(0);
+        var fadeIn = seriesScope && seriesScope.fadeIn;
+
+        var target = {scale: symbolPath.scale.slice()};
+        fadeIn && (target.style = {opacity: symbolPath.style.opacity});
+
+        symbolPath.scale = [0, 0];
+        fadeIn && (symbolPath.style.opacity = 0);
+
+        initProps(symbolPath, target, seriesModel, idx);
+    }
+
+    this._seriesModel = seriesModel;
+};
+
+// Update common properties
+var normalStyleAccessPath = ['itemStyle'];
+var emphasisStyleAccessPath = ['emphasis', 'itemStyle'];
+var normalLabelAccessPath = ['label'];
+var emphasisLabelAccessPath = ['emphasis', 'label'];
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @param {Array.<number>} symbolSize
+ * @param {Object} [seriesScope]
+ */
+symbolProto._updateCommon = function (data, idx, symbolSize, seriesScope) {
+    var symbolPath = this.childAt(0);
+    var seriesModel = data.hostModel;
+    var color = data.getItemVisual(idx, 'color');
+
+    // Reset style
+    if (symbolPath.type !== 'image') {
+        symbolPath.useStyle({
+            strokeNoScale: true
+        });
+    }
+
+    var itemStyle = seriesScope && seriesScope.itemStyle;
+    var hoverItemStyle = seriesScope && seriesScope.hoverItemStyle;
+    var symbolRotate = seriesScope && seriesScope.symbolRotate;
+    var symbolOffset = seriesScope && seriesScope.symbolOffset;
+    var labelModel = seriesScope && seriesScope.labelModel;
+    var hoverLabelModel = seriesScope && seriesScope.hoverLabelModel;
+    var hoverAnimation = seriesScope && seriesScope.hoverAnimation;
+    var cursorStyle = seriesScope && seriesScope.cursorStyle;
+
+    if (!seriesScope || data.hasItemOption) {
+        var itemModel = (seriesScope && seriesScope.itemModel)
+            ? seriesScope.itemModel : data.getItemModel(idx);
+
+        // Color must be excluded.
+        // Because symbol provide setColor individually to set fill and stroke
+        itemStyle = itemModel.getModel(normalStyleAccessPath).getItemStyle(['color']);
+        hoverItemStyle = itemModel.getModel(emphasisStyleAccessPath).getItemStyle();
+
+        symbolRotate = itemModel.getShallow('symbolRotate');
+        symbolOffset = itemModel.getShallow('symbolOffset');
+
+        labelModel = itemModel.getModel(normalLabelAccessPath);
+        hoverLabelModel = itemModel.getModel(emphasisLabelAccessPath);
+        hoverAnimation = itemModel.getShallow('hoverAnimation');
+        cursorStyle = itemModel.getShallow('cursor');
+    }
+    else {
+        hoverItemStyle = extend({}, hoverItemStyle);
+    }
+
+    var elStyle = symbolPath.style;
+
+    symbolPath.attr('rotation', (symbolRotate || 0) * Math.PI / 180 || 0);
+
+    if (symbolOffset) {
+        symbolPath.attr('position', [
+            parsePercent$1(symbolOffset[0], symbolSize[0]),
+            parsePercent$1(symbolOffset[1], symbolSize[1])
+        ]);
+    }
+
+    cursorStyle && symbolPath.attr('cursor', cursorStyle);
+
+    // PENDING setColor before setStyle!!!
+    symbolPath.setColor(color, seriesScope && seriesScope.symbolInnerColor);
+
+    symbolPath.setStyle(itemStyle);
+
+    var opacity = data.getItemVisual(idx, 'opacity');
+    if (opacity != null) {
+        elStyle.opacity = opacity;
+    }
+
+    var liftZ = data.getItemVisual(idx, 'liftZ');
+    var z2Origin = symbolPath.__z2Origin;
+    if (liftZ != null) {
+        if (z2Origin == null) {
+            symbolPath.__z2Origin = symbolPath.z2;
+            symbolPath.z2 += liftZ;
+        }
+    }
+    else if (z2Origin != null) {
+        symbolPath.z2 = z2Origin;
+        symbolPath.__z2Origin = null;
+    }
+
+    var useNameLabel = seriesScope && seriesScope.useNameLabel;
+
+    setLabelStyle(
+        elStyle, hoverItemStyle, labelModel, hoverLabelModel,
+        {
+            labelFetcher: seriesModel,
+            labelDataIndex: idx,
+            defaultText: getLabelDefaultText,
+            isRectText: true,
+            autoColor: color
+        }
+    );
+
+    // Do not execute util needed.
+    function getLabelDefaultText(idx, opt) {
+        return useNameLabel ? data.getName(idx) : getDefaultLabel(data, idx);
+    }
+
+    symbolPath.off('mouseover')
+        .off('mouseout')
+        .off('emphasis')
+        .off('normal');
+
+    symbolPath.hoverStyle = hoverItemStyle;
+
+    // FIXME
+    // Do not use symbol.trigger('emphasis'), but use symbol.highlight() instead.
+    setHoverStyle(symbolPath);
+
+    var scale = getScale(symbolSize);
+
+    if (hoverAnimation && seriesModel.isAnimationEnabled()) {
+        var onEmphasis = function() {
+            // Do not support this hover animation util some scenario required.
+            // Animation can only be supported in hover layer when using `el.incremetal`.
+            if (this.incremental) {
+                return;
+            }
+            var ratio = scale[1] / scale[0];
+            this.animateTo({
+                scale: [
+                    Math.max(scale[0] * 1.1, scale[0] + 3),
+                    Math.max(scale[1] * 1.1, scale[1] + 3 * ratio)
+                ]
+            }, 400, 'elasticOut');
+        };
+        var onNormal = function() {
+            if (this.incremental) {
+                return;
+            }
+            this.animateTo({
+                scale: scale
+            }, 400, 'elasticOut');
+        };
+        symbolPath.on('mouseover', onEmphasis)
+            .on('mouseout', onNormal)
+            .on('emphasis', onEmphasis)
+            .on('normal', onNormal);
+    }
+};
+
+/**
+ * @param {Function} cb
+ * @param {Object} [opt]
+ * @param {Object} [opt.keepLabel=true]
+ */
+symbolProto.fadeOut = function (cb, opt) {
+    var symbolPath = this.childAt(0);
+    // Avoid mistaken hover when fading out
+    this.silent = symbolPath.silent = true;
+    // Not show text when animating
+    !(opt && opt.keepLabel) && (symbolPath.style.text = null);
+
+    updateProps(
+        symbolPath,
+        {
+            style: {opacity: 0},
+            scale: [0, 0]
+        },
+        this._seriesModel,
+        this.dataIndex,
+        cb
+    );
+};
+
+inherits(SymbolClz$1, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/SymbolDraw
+ */
+
+/**
+ * @constructor
+ * @alias module:echarts/chart/helper/SymbolDraw
+ * @param {module:zrender/graphic/Group} [symbolCtor]
+ */
+function SymbolDraw(symbolCtor) {
+    this.group = new Group();
+
+    this._symbolCtor = symbolCtor || SymbolClz$1;
+}
+
+var symbolDrawProto = SymbolDraw.prototype;
+
+function symbolNeedsDraw(data, point, idx, opt) {
+    return point && !isNaN(point[0]) && !isNaN(point[1])
+        && !(opt.isIgnore && opt.isIgnore(idx))
+        // We do not set clipShape on group, because it will cut part of
+        // the symbol element shape. We use the same clip shape here as
+        // the line clip.
+        && !(opt.clipShape && !opt.clipShape.contain(point[0], point[1]))
+        && data.getItemVisual(idx, 'symbol') !== 'none';
+}
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ * @param {Object} [opt] Or isIgnore
+ * @param {Function} [opt.isIgnore]
+ * @param {Object} [opt.clipShape]
+ */
+symbolDrawProto.updateData = function (data, opt) {
+    opt = normalizeUpdateOpt(opt);
+
+    var group = this.group;
+    var seriesModel = data.hostModel;
+    var oldData = this._data;
+    var SymbolCtor = this._symbolCtor;
+
+    var seriesScope = makeSeriesScope(data);
+
+    // There is no oldLineData only when first rendering or switching from
+    // stream mode to normal mode, where previous elements should be removed.
+    if (!oldData) {
+        group.removeAll();
+    }
+
+    data.diff(oldData)
+        .add(function (newIdx) {
+            var point = data.getItemLayout(newIdx);
+            if (symbolNeedsDraw(data, point, newIdx, opt)) {
+                var symbolEl = new SymbolCtor(data, newIdx, seriesScope);
+                symbolEl.attr('position', point);
+                data.setItemGraphicEl(newIdx, symbolEl);
+                group.add(symbolEl);
+            }
+        })
+        .update(function (newIdx, oldIdx) {
+            var symbolEl = oldData.getItemGraphicEl(oldIdx);
+            var point = data.getItemLayout(newIdx);
+            if (!symbolNeedsDraw(data, point, newIdx, opt)) {
+                group.remove(symbolEl);
+                return;
+            }
+            if (!symbolEl) {
+                symbolEl = new SymbolCtor(data, newIdx);
+                symbolEl.attr('position', point);
+            }
+            else {
+                symbolEl.updateData(data, newIdx, seriesScope);
+                updateProps(symbolEl, {
+                    position: point
+                }, seriesModel);
+            }
+
+            // Add back
+            group.add(symbolEl);
+
+            data.setItemGraphicEl(newIdx, symbolEl);
+        })
+        .remove(function (oldIdx) {
+            var el = oldData.getItemGraphicEl(oldIdx);
+            el && el.fadeOut(function () {
+                group.remove(el);
+            });
+        })
+        .execute();
+
+    this._data = data;
+};
+
+symbolDrawProto.isPersistent = function () {
+    return true;
+};
+
+symbolDrawProto.updateLayout = function () {
+    var data = this._data;
+    if (data) {
+        // Not use animation
+        data.eachItemGraphicEl(function (el, idx) {
+            var point = data.getItemLayout(idx);
+            el.attr('position', point);
+        });
+    }
+};
+
+symbolDrawProto.incrementalPrepareUpdate = function (data) {
+    this._seriesScope = makeSeriesScope(data);
+    this._data = null;
+    this.group.removeAll();
+};
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ * @param {Object} [opt] Or isIgnore
+ * @param {Function} [opt.isIgnore]
+ * @param {Object} [opt.clipShape]
+ */
+symbolDrawProto.incrementalUpdate = function (taskParams, data, opt) {
+    opt = normalizeUpdateOpt(opt);
+
+    function updateIncrementalAndHover(el) {
+        if (!el.isGroup) {
+            el.incremental = el.useHoverLayer = true;
+        }
+    }
+    for (var idx = taskParams.start; idx < taskParams.end; idx++) {
+        var point = data.getItemLayout(idx);
+        if (symbolNeedsDraw(data, point, idx, opt)) {
+            var el = new this._symbolCtor(data, idx, this._seriesScope);
+            el.traverse(updateIncrementalAndHover);
+            el.attr('position', point);
+            this.group.add(el);
+            data.setItemGraphicEl(idx, el);
+        }
+    }
+};
+
+function normalizeUpdateOpt(opt) {
+    if (opt != null && !isObject$1(opt)) {
+        opt = {isIgnore: opt};
+    }
+    return opt || {};
+}
+
+symbolDrawProto.remove = function (enableAnimation) {
+    var group = this.group;
+    var data = this._data;
+    // Incremental model do not have this._data.
+    if (data && enableAnimation) {
+        data.eachItemGraphicEl(function (el) {
+            el.fadeOut(function () {
+                group.remove(el);
+            });
+        });
+    }
+    else {
+        group.removeAll();
+    }
+};
+
+function makeSeriesScope(data) {
+    var seriesModel = data.hostModel;
+    return {
+        itemStyle: seriesModel.getModel('itemStyle').getItemStyle(['color']),
+        hoverItemStyle: seriesModel.getModel('emphasis.itemStyle').getItemStyle(),
+        symbolRotate: seriesModel.get('symbolRotate'),
+        symbolOffset: seriesModel.get('symbolOffset'),
+        hoverAnimation: seriesModel.get('hoverAnimation'),
+        labelModel: seriesModel.getModel('label'),
+        hoverLabelModel: seriesModel.getModel('emphasis.label'),
+        cursorStyle: seriesModel.get('cursor')
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} coordSys
+ * @param {module:echarts/data/List} data
+ * @param {string} valueOrigin lineSeries.option.areaStyle.origin
+ */
+function prepareDataCoordInfo(coordSys, data, valueOrigin) {
+    var baseAxis = coordSys.getBaseAxis();
+    var valueAxis = coordSys.getOtherAxis(baseAxis);
+    var valueStart = getValueStart(valueAxis, valueOrigin);
+
+    var baseAxisDim = baseAxis.dim;
+    var valueAxisDim = valueAxis.dim;
+    var valueDim = data.mapDimension(valueAxisDim);
+    var baseDim = data.mapDimension(baseAxisDim);
+    var baseDataOffset = valueAxisDim === 'x' || valueAxisDim === 'radius' ? 1 : 0;
+
+    var dims = map(coordSys.dimensions, function (coordDim) {
+        return data.mapDimension(coordDim);
+    });
+
+    var stacked;
+    var stackResultDim = data.getCalculationInfo('stackResultDimension');
+    if (stacked |= isDimensionStacked(data, dims[0] /*, dims[1]*/)) { // jshint ignore:line
+        dims[0] = stackResultDim;
+    }
+    if (stacked |= isDimensionStacked(data, dims[1] /*, dims[0]*/)) { // jshint ignore:line
+        dims[1] = stackResultDim;
+    }
+
+    return {
+        dataDimsForPoint: dims,
+        valueStart: valueStart,
+        valueAxisDim: valueAxisDim,
+        baseAxisDim: baseAxisDim,
+        stacked: !!stacked,
+        valueDim: valueDim,
+        baseDim: baseDim,
+        baseDataOffset: baseDataOffset,
+        stackedOverDimension: data.getCalculationInfo('stackedOverDimension')
+    };
+}
+
+function getValueStart(valueAxis, valueOrigin) {
+    var valueStart = 0;
+    var extent = valueAxis.scale.getExtent();
+
+    if (valueOrigin === 'start') {
+        valueStart = extent[0];
+    }
+    else if (valueOrigin === 'end') {
+        valueStart = extent[1];
+    }
+    // auto
+    else {
+        // Both positive
+        if (extent[0] > 0) {
+            valueStart = extent[0];
+        }
+        // Both negative
+        else if (extent[1] < 0) {
+            valueStart = extent[1];
+        }
+        // If is one positive, and one negative, onZero shall be true
+    }
+
+    return valueStart;
+}
+
+function getStackedOnPoint(dataCoordInfo, coordSys, data, idx) {
+    var value = NaN;
+    if (dataCoordInfo.stacked) {
+        value = data.get(data.getCalculationInfo('stackedOverDimension'), idx);
+    }
+    if (isNaN(value)) {
+        value = dataCoordInfo.valueStart;
+    }
+
+    var baseDataOffset = dataCoordInfo.baseDataOffset;
+    var stackedData = [];
+    stackedData[baseDataOffset] = data.get(dataCoordInfo.baseDim, idx);
+    stackedData[1 - baseDataOffset] = value;
+
+    return coordSys.dataToPoint(stackedData);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// var arrayDiff = require('zrender/src/core/arrayDiff');
+// 'zrender/src/core/arrayDiff' has been used before, but it did
+// not do well in performance when roam with fixed dataZoom window.
+
+// function convertToIntId(newIdList, oldIdList) {
+//     // Generate int id instead of string id.
+//     // Compare string maybe slow in score function of arrDiff
+
+//     // Assume id in idList are all unique
+//     var idIndicesMap = {};
+//     var idx = 0;
+//     for (var i = 0; i < newIdList.length; i++) {
+//         idIndicesMap[newIdList[i]] = idx;
+//         newIdList[i] = idx++;
+//     }
+//     for (var i = 0; i < oldIdList.length; i++) {
+//         var oldId = oldIdList[i];
+//         // Same with newIdList
+//         if (idIndicesMap[oldId]) {
+//             oldIdList[i] = idIndicesMap[oldId];
+//         }
+//         else {
+//             oldIdList[i] = idx++;
+//         }
+//     }
+// }
+
+function diffData(oldData, newData) {
+    var diffResult = [];
+
+    newData.diff(oldData)
+        .add(function (idx) {
+            diffResult.push({cmd: '+', idx: idx});
+        })
+        .update(function (newIdx, oldIdx) {
+            diffResult.push({cmd: '=', idx: oldIdx, idx1: newIdx});
+        })
+        .remove(function (idx) {
+            diffResult.push({cmd: '-', idx: idx});
+        })
+        .execute();
+
+    return diffResult;
+}
+
+var lineAnimationDiff = function (
+    oldData, newData,
+    oldStackedOnPoints, newStackedOnPoints,
+    oldCoordSys, newCoordSys,
+    oldValueOrigin, newValueOrigin
+) {
+    var diff = diffData(oldData, newData);
+
+    // var newIdList = newData.mapArray(newData.getId);
+    // var oldIdList = oldData.mapArray(oldData.getId);
+
+    // convertToIntId(newIdList, oldIdList);
+
+    // // FIXME One data ?
+    // diff = arrayDiff(oldIdList, newIdList);
+
+    var currPoints = [];
+    var nextPoints = [];
+    // Points for stacking base line
+    var currStackedPoints = [];
+    var nextStackedPoints = [];
+
+    var status = [];
+    var sortedIndices = [];
+    var rawIndices = [];
+
+    var newDataOldCoordInfo = prepareDataCoordInfo(oldCoordSys, newData, oldValueOrigin);
+    var oldDataNewCoordInfo = prepareDataCoordInfo(newCoordSys, oldData, newValueOrigin);
+
+    for (var i = 0; i < diff.length; i++) {
+        var diffItem = diff[i];
+        var pointAdded = true;
+
+        // FIXME, animation is not so perfect when dataZoom window moves fast
+        // Which is in case remvoing or add more than one data in the tail or head
+        switch (diffItem.cmd) {
+            case '=':
+                var currentPt = oldData.getItemLayout(diffItem.idx);
+                var nextPt = newData.getItemLayout(diffItem.idx1);
+                // If previous data is NaN, use next point directly
+                if (isNaN(currentPt[0]) || isNaN(currentPt[1])) {
+                    currentPt = nextPt.slice();
+                }
+                currPoints.push(currentPt);
+                nextPoints.push(nextPt);
+
+                currStackedPoints.push(oldStackedOnPoints[diffItem.idx]);
+                nextStackedPoints.push(newStackedOnPoints[diffItem.idx1]);
+
+                rawIndices.push(newData.getRawIndex(diffItem.idx1));
+                break;
+            case '+':
+                var idx = diffItem.idx;
+                currPoints.push(
+                    oldCoordSys.dataToPoint([
+                        newData.get(newDataOldCoordInfo.dataDimsForPoint[0], idx),
+                        newData.get(newDataOldCoordInfo.dataDimsForPoint[1], idx)
+                    ])
+                );
+
+                nextPoints.push(newData.getItemLayout(idx).slice());
+
+                currStackedPoints.push(
+                    getStackedOnPoint(newDataOldCoordInfo, oldCoordSys, newData, idx)
+                );
+                nextStackedPoints.push(newStackedOnPoints[idx]);
+
+                rawIndices.push(newData.getRawIndex(idx));
+                break;
+            case '-':
+                var idx = diffItem.idx;
+                var rawIndex = oldData.getRawIndex(idx);
+                // Data is replaced. In the case of dynamic data queue
+                // FIXME FIXME FIXME
+                if (rawIndex !== idx) {
+                    currPoints.push(oldData.getItemLayout(idx));
+                    nextPoints.push(newCoordSys.dataToPoint([
+                        oldData.get(oldDataNewCoordInfo.dataDimsForPoint[0], idx),
+                        oldData.get(oldDataNewCoordInfo.dataDimsForPoint[1], idx)
+                    ]));
+
+                    currStackedPoints.push(oldStackedOnPoints[idx]);
+                    nextStackedPoints.push(
+                        getStackedOnPoint(oldDataNewCoordInfo, newCoordSys, oldData, idx)
+                    );
+
+                    rawIndices.push(rawIndex);
+                }
+                else {
+                    pointAdded = false;
+                }
+        }
+
+        // Original indices
+        if (pointAdded) {
+            status.push(diffItem);
+            sortedIndices.push(sortedIndices.length);
+        }
+    }
+
+    // Diff result may be crossed if all items are changed
+    // Sort by data index
+    sortedIndices.sort(function (a, b) {
+        return rawIndices[a] - rawIndices[b];
+    });
+
+    var sortedCurrPoints = [];
+    var sortedNextPoints = [];
+
+    var sortedCurrStackedPoints = [];
+    var sortedNextStackedPoints = [];
+
+    var sortedStatus = [];
+    for (var i = 0; i < sortedIndices.length; i++) {
+        var idx = sortedIndices[i];
+        sortedCurrPoints[i] = currPoints[idx];
+        sortedNextPoints[i] = nextPoints[idx];
+
+        sortedCurrStackedPoints[i] = currStackedPoints[idx];
+        sortedNextStackedPoints[i] = nextStackedPoints[idx];
+
+        sortedStatus[i] = status[idx];
+    }
+
+    return {
+        current: sortedCurrPoints,
+        next: sortedNextPoints,
+
+        stackedOnCurrent: sortedCurrStackedPoints,
+        stackedOnNext: sortedNextStackedPoints,
+
+        status: sortedStatus
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Poly path support NaN point
+
+var vec2Min = min;
+var vec2Max = max;
+
+var scaleAndAdd$1 = scaleAndAdd;
+var v2Copy = copy;
+
+// Temporary variable
+var v = [];
+var cp0 = [];
+var cp1 = [];
+
+function isPointNull(p) {
+    return isNaN(p[0]) || isNaN(p[1]);
+}
+
+function drawSegment(
+    ctx, points, start, segLen, allLen,
+    dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
+) {
+    // if (smoothMonotone == null) {
+    //     if (isMono(points, 'x')) {
+    //         return drawMono(ctx, points, start, segLen, allLen,
+    //             dir, smoothMin, smoothMax, smooth, 'x', connectNulls);
+    //     }
+    //     else if (isMono(points, 'y')) {
+    //         return drawMono(ctx, points, start, segLen, allLen,
+    //             dir, smoothMin, smoothMax, smooth, 'y', connectNulls);
+    //     }
+    //     else {
+    //         return drawNonMono.apply(this, arguments);
+    //     }
+    // }
+    // else if (smoothMonotone !== 'none' && isMono(points, smoothMonotone)) {
+    //     return drawMono.apply(this, arguments);
+    // }
+    // else {
+    //     return drawNonMono.apply(this, arguments);
+    // }
+    if (smoothMonotone === 'none' || !smoothMonotone) {
+        return drawNonMono.apply(this, arguments);
+    }
+    else {
+        return drawMono.apply(this, arguments);
+    }
+}
+
+/**
+ * Check if points is in monotone.
+ *
+ * @param {number[][]} points         Array of points which is in [x, y] form
+ * @param {string}     smoothMonotone 'x', 'y', or 'none', stating for which
+ *                                    dimension that is checking.
+ *                                    If is 'none', `drawNonMono` should be
+ *                                    called.
+ *                                    If is undefined, either being monotone
+ *                                    in 'x' or 'y' will call `drawMono`.
+ */
+// function isMono(points, smoothMonotone) {
+//     if (points.length <= 1) {
+//         return true;
+//     }
+
+//     var dim = smoothMonotone === 'x' ? 0 : 1;
+//     var last = points[0][dim];
+//     var lastDiff = 0;
+//     for (var i = 1; i < points.length; ++i) {
+//         var diff = points[i][dim] - last;
+//         if (!isNaN(diff) && !isNaN(lastDiff)
+//             && diff !== 0 && lastDiff !== 0
+//             && ((diff >= 0) !== (lastDiff >= 0))
+//         ) {
+//             return false;
+//         }
+//         if (!isNaN(diff) && diff !== 0) {
+//             lastDiff = diff;
+//             last = points[i][dim];
+//         }
+//     }
+//     return true;
+// }
+
+/**
+ * Draw smoothed line in monotone, in which only vertical or horizontal bezier
+ * control points will be used. This should be used when points are monotone
+ * either in x or y dimension.
+ */
+function drawMono(
+    ctx, points, start, segLen, allLen,
+    dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
+) {
+    var prevIdx = 0;
+    var idx = start;
+    for (var k = 0; k < segLen; k++) {
+        var p = points[idx];
+        if (idx >= allLen || idx < 0) {
+            break;
+        }
+        if (isPointNull(p)) {
+            if (connectNulls) {
+                idx += dir;
+                continue;
+            }
+            break;
+        }
+
+        if (idx === start) {
+            ctx[dir > 0 ? 'moveTo' : 'lineTo'](p[0], p[1]);
+        }
+        else {
+            if (smooth > 0) {
+                var prevP = points[prevIdx];
+                var dim = smoothMonotone === 'y' ? 1 : 0;
+
+                // Length of control point to p, either in x or y, but not both
+                var ctrlLen = (p[dim] - prevP[dim]) * smooth;
+
+                v2Copy(cp0, prevP);
+                cp0[dim] = prevP[dim] + ctrlLen;
+
+                v2Copy(cp1, p);
+                cp1[dim] = p[dim] - ctrlLen;
+
+                ctx.bezierCurveTo(
+                    cp0[0], cp0[1],
+                    cp1[0], cp1[1],
+                    p[0], p[1]
+                );
+            }
+            else {
+                ctx.lineTo(p[0], p[1]);
+            }
+        }
+
+        prevIdx = idx;
+        idx += dir;
+    }
+
+    return k;
+}
+
+/**
+ * Draw smoothed line in non-monotone, in may cause undesired curve in extreme
+ * situations. This should be used when points are non-monotone neither in x or
+ * y dimension.
+ */
+function drawNonMono(
+    ctx, points, start, segLen, allLen,
+    dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
+) {
+    var prevIdx = 0;
+    var idx = start;
+    for (var k = 0; k < segLen; k++) {
+        var p = points[idx];
+        if (idx >= allLen || idx < 0) {
+            break;
+        }
+        if (isPointNull(p)) {
+            if (connectNulls) {
+                idx += dir;
+                continue;
+            }
+            break;
+        }
+
+        if (idx === start) {
+            ctx[dir > 0 ? 'moveTo' : 'lineTo'](p[0], p[1]);
+            v2Copy(cp0, p);
+        }
+        else {
+            if (smooth > 0) {
+                var nextIdx = idx + dir;
+                var nextP = points[nextIdx];
+                if (connectNulls) {
+                    // Find next point not null
+                    while (nextP && isPointNull(points[nextIdx])) {
+                        nextIdx += dir;
+                        nextP = points[nextIdx];
+                    }
+                }
+
+                var ratioNextSeg = 0.5;
+                var prevP = points[prevIdx];
+                var nextP = points[nextIdx];
+                // Last point
+                if (!nextP || isPointNull(nextP)) {
+                    v2Copy(cp1, p);
+                }
+                else {
+                    // If next data is null in not connect case
+                    if (isPointNull(nextP) && !connectNulls) {
+                        nextP = p;
+                    }
+
+                    sub(v, nextP, prevP);
+
+                    var lenPrevSeg;
+                    var lenNextSeg;
+                    if (smoothMonotone === 'x' || smoothMonotone === 'y') {
+                        var dim = smoothMonotone === 'x' ? 0 : 1;
+                        lenPrevSeg = Math.abs(p[dim] - prevP[dim]);
+                        lenNextSeg = Math.abs(p[dim] - nextP[dim]);
+                    }
+                    else {
+                        lenPrevSeg = dist(p, prevP);
+                        lenNextSeg = dist(p, nextP);
+                    }
+
+                    // Use ratio of seg length
+                    ratioNextSeg = lenNextSeg / (lenNextSeg + lenPrevSeg);
+
+                    scaleAndAdd$1(cp1, p, v, -smooth * (1 - ratioNextSeg));
+                }
+                // Smooth constraint
+                vec2Min(cp0, cp0, smoothMax);
+                vec2Max(cp0, cp0, smoothMin);
+                vec2Min(cp1, cp1, smoothMax);
+                vec2Max(cp1, cp1, smoothMin);
+
+                ctx.bezierCurveTo(
+                    cp0[0], cp0[1],
+                    cp1[0], cp1[1],
+                    p[0], p[1]
+                );
+                // cp0 of next segment
+                scaleAndAdd$1(cp0, p, v, smooth * ratioNextSeg);
+            }
+            else {
+                ctx.lineTo(p[0], p[1]);
+            }
+        }
+
+        prevIdx = idx;
+        idx += dir;
+    }
+
+    return k;
+}
+
+function getBoundingBox(points, smoothConstraint) {
+    var ptMin = [Infinity, Infinity];
+    var ptMax = [-Infinity, -Infinity];
+    if (smoothConstraint) {
+        for (var i = 0; i < points.length; i++) {
+            var pt = points[i];
+            if (pt[0] < ptMin[0]) { ptMin[0] = pt[0]; }
+            if (pt[1] < ptMin[1]) { ptMin[1] = pt[1]; }
+            if (pt[0] > ptMax[0]) { ptMax[0] = pt[0]; }
+            if (pt[1] > ptMax[1]) { ptMax[1] = pt[1]; }
+        }
+    }
+    return {
+        min: smoothConstraint ? ptMin : ptMax,
+        max: smoothConstraint ? ptMax : ptMin
+    };
+}
+
+var Polyline$1 = Path.extend({
+
+    type: 'ec-polyline',
+
+    shape: {
+        points: [],
+
+        smooth: 0,
+
+        smoothConstraint: true,
+
+        smoothMonotone: null,
+
+        connectNulls: false
+    },
+
+    style: {
+        fill: null,
+
+        stroke: '#000'
+    },
+
+    brush: fixClipWithShadow(Path.prototype.brush),
+
+    buildPath: function (ctx, shape) {
+        var points = shape.points;
+
+        var i = 0;
+        var len$$1 = points.length;
+
+        var result = getBoundingBox(points, shape.smoothConstraint);
+
+        if (shape.connectNulls) {
+            // Must remove first and last null values avoid draw error in polygon
+            for (; len$$1 > 0; len$$1--) {
+                if (!isPointNull(points[len$$1 - 1])) {
+                    break;
+                }
+            }
+            for (; i < len$$1; i++) {
+                if (!isPointNull(points[i])) {
+                    break;
+                }
+            }
+        }
+        while (i < len$$1) {
+            i += drawSegment(
+                ctx, points, i, len$$1, len$$1,
+                1, result.min, result.max, shape.smooth,
+                shape.smoothMonotone, shape.connectNulls
+            ) + 1;
+        }
+    }
+});
+
+var Polygon$1 = Path.extend({
+
+    type: 'ec-polygon',
+
+    shape: {
+        points: [],
+
+        // Offset between stacked base points and points
+        stackedOnPoints: [],
+
+        smooth: 0,
+
+        stackedOnSmooth: 0,
+
+        smoothConstraint: true,
+
+        smoothMonotone: null,
+
+        connectNulls: false
+    },
+
+    brush: fixClipWithShadow(Path.prototype.brush),
+
+    buildPath: function (ctx, shape) {
+        var points = shape.points;
+        var stackedOnPoints = shape.stackedOnPoints;
+
+        var i = 0;
+        var len$$1 = points.length;
+        var smoothMonotone = shape.smoothMonotone;
+        var bbox = getBoundingBox(points, shape.smoothConstraint);
+        var stackedOnBBox = getBoundingBox(stackedOnPoints, shape.smoothConstraint);
+
+        if (shape.connectNulls) {
+            // Must remove first and last null values avoid draw error in polygon
+            for (; len$$1 > 0; len$$1--) {
+                if (!isPointNull(points[len$$1 - 1])) {
+                    break;
+                }
+            }
+            for (; i < len$$1; i++) {
+                if (!isPointNull(points[i])) {
+                    break;
+                }
+            }
+        }
+        while (i < len$$1) {
+            var k = drawSegment(
+                ctx, points, i, len$$1, len$$1,
+                1, bbox.min, bbox.max, shape.smooth,
+                smoothMonotone, shape.connectNulls
+            );
+            drawSegment(
+                ctx, stackedOnPoints, i + k - 1, k, len$$1,
+                -1, stackedOnBBox.min, stackedOnBBox.max, shape.stackedOnSmooth,
+                smoothMonotone, shape.connectNulls
+            );
+            i += k + 1;
+
+            ctx.closePath();
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME step not support polar
+
+function isPointsSame(points1, points2) {
+    if (points1.length !== points2.length) {
+        return;
+    }
+    for (var i = 0; i < points1.length; i++) {
+        var p1 = points1[i];
+        var p2 = points2[i];
+        if (p1[0] !== p2[0] || p1[1] !== p2[1]) {
+            return;
+        }
+    }
+    return true;
+}
+
+function getSmooth(smooth) {
+    return typeof (smooth) === 'number' ? smooth : (smooth ? 0.5 : 0);
+}
+
+function getAxisExtentWithGap(axis) {
+    var extent = axis.getGlobalExtent();
+    if (axis.onBand) {
+        // Remove extra 1px to avoid line miter in clipped edge
+        var halfBandWidth = axis.getBandWidth() / 2 - 1;
+        var dir = extent[1] > extent[0] ? 1 : -1;
+        extent[0] += dir * halfBandWidth;
+        extent[1] -= dir * halfBandWidth;
+    }
+    return extent;
+}
+
+/**
+ * @param {module:echarts/coord/cartesian/Cartesian2D|module:echarts/coord/polar/Polar} coordSys
+ * @param {module:echarts/data/List} data
+ * @param {Object} dataCoordInfo
+ * @param {Array.<Array.<number>>} points
+ */
+function getStackedOnPoints(coordSys, data, dataCoordInfo) {
+    if (!dataCoordInfo.valueDim) {
+        return [];
+    }
+
+    var points = [];
+    for (var idx = 0, len = data.count(); idx < len; idx++) {
+        points.push(getStackedOnPoint(dataCoordInfo, coordSys, data, idx));
+    }
+
+    return points;
+}
+
+function createGridClipShape(cartesian, hasAnimation, forSymbol, seriesModel) {
+    var xExtent = getAxisExtentWithGap(cartesian.getAxis('x'));
+    var yExtent = getAxisExtentWithGap(cartesian.getAxis('y'));
+    var isHorizontal = cartesian.getBaseAxis().isHorizontal();
+
+    var x = Math.min(xExtent[0], xExtent[1]);
+    var y = Math.min(yExtent[0], yExtent[1]);
+    var width = Math.max(xExtent[0], xExtent[1]) - x;
+    var height = Math.max(yExtent[0], yExtent[1]) - y;
+
+    // Avoid float number rounding error for symbol on the edge of axis extent.
+    // See #7913 and `test/dataZoom-clip.html`.
+    if (forSymbol) {
+        x -= 0.5;
+        width += 0.5;
+        y -= 0.5;
+        height += 0.5;
+    }
+    else {
+        var lineWidth = seriesModel.get('lineStyle.width') || 2;
+        // Expand clip shape to avoid clipping when line value exceeds axis
+        var expandSize = seriesModel.get('clipOverflow') ? lineWidth / 2 : Math.max(width, height);
+        if (isHorizontal) {
+            y -= expandSize;
+            height += expandSize * 2;
+        }
+        else {
+            x -= expandSize;
+            width += expandSize * 2;
+        }
+    }
+
+    var clipPath = new Rect({
+        shape: {
+            x: x,
+            y: y,
+            width: width,
+            height: height
+        }
+    });
+
+    if (hasAnimation) {
+        clipPath.shape[isHorizontal ? 'width' : 'height'] = 0;
+        initProps(clipPath, {
+            shape: {
+                width: width,
+                height: height
+            }
+        }, seriesModel);
+    }
+
+    return clipPath;
+}
+
+function createPolarClipShape(polar, hasAnimation, forSymbol, seriesModel) {
+    var angleAxis = polar.getAngleAxis();
+    var radiusAxis = polar.getRadiusAxis();
+
+    var radiusExtent = radiusAxis.getExtent().slice();
+    radiusExtent[0] > radiusExtent[1] && radiusExtent.reverse();
+    var angleExtent = angleAxis.getExtent();
+
+    var RADIAN = Math.PI / 180;
+
+    // Avoid float number rounding error for symbol on the edge of axis extent.
+    if (forSymbol) {
+        radiusExtent[0] -= 0.5;
+        radiusExtent[1] += 0.5;
+    }
+
+    var clipPath = new Sector({
+        shape: {
+            cx: round$1(polar.cx, 1),
+            cy: round$1(polar.cy, 1),
+            r0: round$1(radiusExtent[0], 1),
+            r: round$1(radiusExtent[1], 1),
+            startAngle: -angleExtent[0] * RADIAN,
+            endAngle: -angleExtent[1] * RADIAN,
+            clockwise: angleAxis.inverse
+        }
+    });
+
+    if (hasAnimation) {
+        clipPath.shape.endAngle = -angleExtent[0] * RADIAN;
+        initProps(clipPath, {
+            shape: {
+                endAngle: -angleExtent[1] * RADIAN
+            }
+        }, seriesModel);
+    }
+
+    return clipPath;
+}
+
+function createClipShape(coordSys, hasAnimation, forSymbol, seriesModel) {
+    return coordSys.type === 'polar'
+        ? createPolarClipShape(coordSys, hasAnimation, forSymbol, seriesModel)
+        : createGridClipShape(coordSys, hasAnimation, forSymbol, seriesModel);
+}
+
+function turnPointsIntoStep(points, coordSys, stepTurnAt) {
+    var baseAxis = coordSys.getBaseAxis();
+    var baseIndex = baseAxis.dim === 'x' || baseAxis.dim === 'radius' ? 0 : 1;
+
+    var stepPoints = [];
+    for (var i = 0; i < points.length - 1; i++) {
+        var nextPt = points[i + 1];
+        var pt = points[i];
+        stepPoints.push(pt);
+
+        var stepPt = [];
+        switch (stepTurnAt) {
+            case 'end':
+                stepPt[baseIndex] = nextPt[baseIndex];
+                stepPt[1 - baseIndex] = pt[1 - baseIndex];
+                // default is start
+                stepPoints.push(stepPt);
+                break;
+            case 'middle':
+                // default is start
+                var middle = (pt[baseIndex] + nextPt[baseIndex]) / 2;
+                var stepPt2 = [];
+                stepPt[baseIndex] = stepPt2[baseIndex] = middle;
+                stepPt[1 - baseIndex] = pt[1 - baseIndex];
+                stepPt2[1 - baseIndex] = nextPt[1 - baseIndex];
+                stepPoints.push(stepPt);
+                stepPoints.push(stepPt2);
+                break;
+            default:
+                stepPt[baseIndex] = pt[baseIndex];
+                stepPt[1 - baseIndex] = nextPt[1 - baseIndex];
+                // default is start
+                stepPoints.push(stepPt);
+        }
+    }
+    // Last points
+    points[i] && stepPoints.push(points[i]);
+    return stepPoints;
+}
+
+function getVisualGradient(data, coordSys) {
+    var visualMetaList = data.getVisual('visualMeta');
+    if (!visualMetaList || !visualMetaList.length || !data.count()) {
+        // When data.count() is 0, gradient range can not be calculated.
+        return;
+    }
+
+    if (coordSys.type !== 'cartesian2d') {
+        if (__DEV__) {
+            console.warn('Visual map on line style is only supported on cartesian2d.');
+        }
+        return;
+    }
+
+    var coordDim;
+    var visualMeta;
+
+    for (var i = visualMetaList.length - 1; i >= 0; i--) {
+        var dimIndex = visualMetaList[i].dimension;
+        var dimName = data.dimensions[dimIndex];
+        var dimInfo = data.getDimensionInfo(dimName);
+        coordDim = dimInfo && dimInfo.coordDim;
+        // Can only be x or y
+        if (coordDim === 'x' || coordDim === 'y') {
+            visualMeta = visualMetaList[i];
+            break;
+        }
+    }
+
+    if (!visualMeta) {
+        if (__DEV__) {
+            console.warn('Visual map on line style only support x or y dimension.');
+        }
+        return;
+    }
+
+    // If the area to be rendered is bigger than area defined by LinearGradient,
+    // the canvas spec prescribes that the color of the first stop and the last
+    // stop should be used. But if two stops are added at offset 0, in effect
+    // browsers use the color of the second stop to render area outside
+    // LinearGradient. So we can only infinitesimally extend area defined in
+    // LinearGradient to render `outerColors`.
+
+    var axis = coordSys.getAxis(coordDim);
+
+    // dataToCoor mapping may not be linear, but must be monotonic.
+    var colorStops = map(visualMeta.stops, function (stop) {
+        return {
+            coord: axis.toGlobalCoord(axis.dataToCoord(stop.value)),
+            color: stop.color
+        };
+    });
+    var stopLen = colorStops.length;
+    var outerColors = visualMeta.outerColors.slice();
+
+    if (stopLen && colorStops[0].coord > colorStops[stopLen - 1].coord) {
+        colorStops.reverse();
+        outerColors.reverse();
+    }
+
+    var tinyExtent = 10; // Arbitrary value: 10px
+    var minCoord = colorStops[0].coord - tinyExtent;
+    var maxCoord = colorStops[stopLen - 1].coord + tinyExtent;
+    var coordSpan = maxCoord - minCoord;
+
+    if (coordSpan < 1e-3) {
+        return 'transparent';
+    }
+
+    each$1(colorStops, function (stop) {
+        stop.offset = (stop.coord - minCoord) / coordSpan;
+    });
+    colorStops.push({
+        offset: stopLen ? colorStops[stopLen - 1].offset : 0.5,
+        color: outerColors[1] || 'transparent'
+    });
+    colorStops.unshift({ // notice colorStops.length have been changed.
+        offset: stopLen ? colorStops[0].offset : 0.5,
+        color: outerColors[0] || 'transparent'
+    });
+
+    // zrUtil.each(colorStops, function (colorStop) {
+    //     // Make sure each offset has rounded px to avoid not sharp edge
+    //     colorStop.offset = (Math.round(colorStop.offset * (end - start) + start) - start) / (end - start);
+    // });
+
+    var gradient = new LinearGradient(0, 0, 0, 0, colorStops, true);
+    gradient[coordDim] = minCoord;
+    gradient[coordDim + '2'] = maxCoord;
+
+    return gradient;
+}
+
+function getIsIgnoreFunc(seriesModel, data, coordSys) {
+    var showAllSymbol = seriesModel.get('showAllSymbol');
+    var isAuto = showAllSymbol === 'auto';
+
+    if (showAllSymbol && !isAuto) {
+        return;
+    }
+
+    var categoryAxis = coordSys.getAxesByScale('ordinal')[0];
+    if (!categoryAxis) {
+        return;
+    }
+
+    // Note that category label interval strategy might bring some weird effect
+    // in some scenario: users may wonder why some of the symbols are not
+    // displayed. So we show all symbols as possible as we can.
+    if (isAuto
+        // Simplify the logic, do not determine label overlap here.
+        && canShowAllSymbolForCategory(categoryAxis, data)
+    ) {
+        return;
+    }
+
+    // Otherwise follow the label interval strategy on category axis.
+    var categoryDataDim = data.mapDimension(categoryAxis.dim);
+    var labelMap = {};
+
+    each$1(categoryAxis.getViewLabels(), function (labelItem) {
+        labelMap[labelItem.tickValue] = 1;
+    });
+
+    return function (dataIndex) {
+        return !labelMap.hasOwnProperty(data.get(categoryDataDim, dataIndex));
+    };
+}
+
+function canShowAllSymbolForCategory(categoryAxis, data) {
+    // In mose cases, line is monotonous on category axis, and the label size
+    // is close with each other. So we check the symbol size and some of the
+    // label size alone with the category axis to estimate whether all symbol
+    // can be shown without overlap.
+    var axisExtent = categoryAxis.getExtent();
+    var availSize = Math.abs(axisExtent[1] - axisExtent[0]) / categoryAxis.scale.count();
+    isNaN(availSize) && (availSize = 0); // 0/0 is NaN.
+
+    // Sampling some points, max 5.
+    var dataLen = data.count();
+    var step = Math.max(1, Math.round(dataLen / 5));
+    for (var dataIndex = 0; dataIndex < dataLen; dataIndex += step) {
+        if (SymbolClz$1.getSymbolSize(
+                data, dataIndex
+            // Only for cartesian, where `isHorizontal` exists.
+            )[categoryAxis.isHorizontal() ? 1 : 0]
+            // Empirical number
+            * 1.5 > availSize
+        ) {
+            return false;
+        }
+    }
+
+    return true;
+}
+
+Chart.extend({
+
+    type: 'line',
+
+    init: function () {
+        var lineGroup = new Group();
+
+        var symbolDraw = new SymbolDraw();
+        this.group.add(symbolDraw.group);
+
+        this._symbolDraw = symbolDraw;
+        this._lineGroup = lineGroup;
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var group = this.group;
+        var data = seriesModel.getData();
+        var lineStyleModel = seriesModel.getModel('lineStyle');
+        var areaStyleModel = seriesModel.getModel('areaStyle');
+
+        var points = data.mapArray(data.getItemLayout);
+
+        var isCoordSysPolar = coordSys.type === 'polar';
+        var prevCoordSys = this._coordSys;
+
+        var symbolDraw = this._symbolDraw;
+        var polyline = this._polyline;
+        var polygon = this._polygon;
+
+        var lineGroup = this._lineGroup;
+
+        var hasAnimation = seriesModel.get('animation');
+
+        var isAreaChart = !areaStyleModel.isEmpty();
+
+        var valueOrigin = areaStyleModel.get('origin');
+        var dataCoordInfo = prepareDataCoordInfo(coordSys, data, valueOrigin);
+
+        var stackedOnPoints = getStackedOnPoints(coordSys, data, dataCoordInfo);
+
+        var showSymbol = seriesModel.get('showSymbol');
+
+        var isIgnoreFunc = showSymbol && !isCoordSysPolar
+            && getIsIgnoreFunc(seriesModel, data, coordSys);
+
+        // Remove temporary symbols
+        var oldData = this._data;
+        oldData && oldData.eachItemGraphicEl(function (el, idx) {
+            if (el.__temp) {
+                group.remove(el);
+                oldData.setItemGraphicEl(idx, null);
+            }
+        });
+
+        // Remove previous created symbols if showSymbol changed to false
+        if (!showSymbol) {
+            symbolDraw.remove();
+        }
+
+        group.add(lineGroup);
+
+        // FIXME step not support polar
+        var step = !isCoordSysPolar && seriesModel.get('step');
+        // Initialization animation or coordinate system changed
+        if (
+            !(polyline && prevCoordSys.type === coordSys.type && step === this._step)
+        ) {
+            showSymbol && symbolDraw.updateData(data, {
+                isIgnore: isIgnoreFunc,
+                clipShape: createClipShape(coordSys, false, true, seriesModel)
+            });
+
+            if (step) {
+                // TODO If stacked series is not step
+                points = turnPointsIntoStep(points, coordSys, step);
+                stackedOnPoints = turnPointsIntoStep(stackedOnPoints, coordSys, step);
+            }
+
+            polyline = this._newPolyline(points, coordSys, hasAnimation);
+            if (isAreaChart) {
+                polygon = this._newPolygon(
+                    points, stackedOnPoints,
+                    coordSys, hasAnimation
+                );
+            }
+            lineGroup.setClipPath(createClipShape(coordSys, true, false, seriesModel));
+        }
+        else {
+            if (isAreaChart && !polygon) {
+                // If areaStyle is added
+                polygon = this._newPolygon(
+                    points, stackedOnPoints,
+                    coordSys, hasAnimation
+                );
+            }
+            else if (polygon && !isAreaChart) {
+                // If areaStyle is removed
+                lineGroup.remove(polygon);
+                polygon = this._polygon = null;
+            }
+
+            // Update clipPath
+            lineGroup.setClipPath(createClipShape(coordSys, false, false, seriesModel));
+
+            // Always update, or it is wrong in the case turning on legend
+            // because points are not changed
+            showSymbol && symbolDraw.updateData(data, {
+                isIgnore: isIgnoreFunc,
+                clipShape: createClipShape(coordSys, false, true, seriesModel)
+            });
+
+            // Stop symbol animation and sync with line points
+            // FIXME performance?
+            data.eachItemGraphicEl(function (el) {
+                el.stopAnimation(true);
+            });
+
+            // In the case data zoom triggerred refreshing frequently
+            // Data may not change if line has a category axis. So it should animate nothing
+            if (!isPointsSame(this._stackedOnPoints, stackedOnPoints)
+                || !isPointsSame(this._points, points)
+            ) {
+                if (hasAnimation) {
+                    this._updateAnimation(
+                        data, stackedOnPoints, coordSys, api, step, valueOrigin
+                    );
+                }
+                else {
+                    // Not do it in update with animation
+                    if (step) {
+                        // TODO If stacked series is not step
+                        points = turnPointsIntoStep(points, coordSys, step);
+                        stackedOnPoints = turnPointsIntoStep(stackedOnPoints, coordSys, step);
+                    }
+
+                    polyline.setShape({
+                        points: points
+                    });
+                    polygon && polygon.setShape({
+                        points: points,
+                        stackedOnPoints: stackedOnPoints
+                    });
+                }
+            }
+        }
+
+        var visualColor = getVisualGradient(data, coordSys) || data.getVisual('color');
+
+        polyline.useStyle(defaults(
+            // Use color in lineStyle first
+            lineStyleModel.getLineStyle(),
+            {
+                fill: 'none',
+                stroke: visualColor,
+                lineJoin: 'bevel'
+            }
+        ));
+
+        var smooth = seriesModel.get('smooth');
+        smooth = getSmooth(seriesModel.get('smooth'));
+        polyline.setShape({
+            smooth: smooth,
+            smoothMonotone: seriesModel.get('smoothMonotone'),
+            connectNulls: seriesModel.get('connectNulls')
+        });
+
+        if (polygon) {
+            var stackedOnSeries = data.getCalculationInfo('stackedOnSeries');
+            var stackedOnSmooth = 0;
+
+            polygon.useStyle(defaults(
+                areaStyleModel.getAreaStyle(),
+                {
+                    fill: visualColor,
+                    opacity: 0.7,
+                    lineJoin: 'bevel'
+                }
+            ));
+
+            if (stackedOnSeries) {
+                stackedOnSmooth = getSmooth(stackedOnSeries.get('smooth'));
+            }
+
+            polygon.setShape({
+                smooth: smooth,
+                stackedOnSmooth: stackedOnSmooth,
+                smoothMonotone: seriesModel.get('smoothMonotone'),
+                connectNulls: seriesModel.get('connectNulls')
+            });
+        }
+
+        this._data = data;
+        // Save the coordinate system for transition animation when data changed
+        this._coordSys = coordSys;
+        this._stackedOnPoints = stackedOnPoints;
+        this._points = points;
+        this._step = step;
+        this._valueOrigin = valueOrigin;
+    },
+
+    dispose: function () {},
+
+    highlight: function (seriesModel, ecModel, api, payload) {
+        var data = seriesModel.getData();
+        var dataIndex = queryDataIndex(data, payload);
+
+        if (!(dataIndex instanceof Array) && dataIndex != null && dataIndex >= 0) {
+            var symbol = data.getItemGraphicEl(dataIndex);
+            if (!symbol) {
+                // Create a temporary symbol if it is not exists
+                var pt = data.getItemLayout(dataIndex);
+                if (!pt) {
+                    // Null data
+                    return;
+                }
+                symbol = new SymbolClz$1(data, dataIndex);
+                symbol.position = pt;
+                symbol.setZ(
+                    seriesModel.get('zlevel'),
+                    seriesModel.get('z')
+                );
+                symbol.ignore = isNaN(pt[0]) || isNaN(pt[1]);
+                symbol.__temp = true;
+                data.setItemGraphicEl(dataIndex, symbol);
+
+                // Stop scale animation
+                symbol.stopSymbolAnimation(true);
+
+                this.group.add(symbol);
+            }
+            symbol.highlight();
+        }
+        else {
+            // Highlight whole series
+            Chart.prototype.highlight.call(
+                this, seriesModel, ecModel, api, payload
+            );
+        }
+    },
+
+    downplay: function (seriesModel, ecModel, api, payload) {
+        var data = seriesModel.getData();
+        var dataIndex = queryDataIndex(data, payload);
+        if (dataIndex != null && dataIndex >= 0) {
+            var symbol = data.getItemGraphicEl(dataIndex);
+            if (symbol) {
+                if (symbol.__temp) {
+                    data.setItemGraphicEl(dataIndex, null);
+                    this.group.remove(symbol);
+                }
+                else {
+                    symbol.downplay();
+                }
+            }
+        }
+        else {
+            // FIXME
+            // can not downplay completely.
+            // Downplay whole series
+            Chart.prototype.downplay.call(
+                this, seriesModel, ecModel, api, payload
+            );
+        }
+    },
+
+    /**
+     * @param {module:zrender/container/Group} group
+     * @param {Array.<Array.<number>>} points
+     * @private
+     */
+    _newPolyline: function (points) {
+        var polyline = this._polyline;
+        // Remove previous created polyline
+        if (polyline) {
+            this._lineGroup.remove(polyline);
+        }
+
+        polyline = new Polyline$1({
+            shape: {
+                points: points
+            },
+            silent: true,
+            z2: 10
+        });
+
+        this._lineGroup.add(polyline);
+
+        this._polyline = polyline;
+
+        return polyline;
+    },
+
+    /**
+     * @param {module:zrender/container/Group} group
+     * @param {Array.<Array.<number>>} stackedOnPoints
+     * @param {Array.<Array.<number>>} points
+     * @private
+     */
+    _newPolygon: function (points, stackedOnPoints) {
+        var polygon = this._polygon;
+        // Remove previous created polygon
+        if (polygon) {
+            this._lineGroup.remove(polygon);
+        }
+
+        polygon = new Polygon$1({
+            shape: {
+                points: points,
+                stackedOnPoints: stackedOnPoints
+            },
+            silent: true
+        });
+
+        this._lineGroup.add(polygon);
+
+        this._polygon = polygon;
+        return polygon;
+    },
+
+    /**
+     * @private
+     */
+    // FIXME Two value axis
+    _updateAnimation: function (data, stackedOnPoints, coordSys, api, step, valueOrigin) {
+        var polyline = this._polyline;
+        var polygon = this._polygon;
+        var seriesModel = data.hostModel;
+
+        var diff = lineAnimationDiff(
+            this._data, data,
+            this._stackedOnPoints, stackedOnPoints,
+            this._coordSys, coordSys,
+            this._valueOrigin, valueOrigin
+        );
+
+        var current = diff.current;
+        var stackedOnCurrent = diff.stackedOnCurrent;
+        var next = diff.next;
+        var stackedOnNext = diff.stackedOnNext;
+        if (step) {
+            // TODO If stacked series is not step
+            current = turnPointsIntoStep(diff.current, coordSys, step);
+            stackedOnCurrent = turnPointsIntoStep(diff.stackedOnCurrent, coordSys, step);
+            next = turnPointsIntoStep(diff.next, coordSys, step);
+            stackedOnNext = turnPointsIntoStep(diff.stackedOnNext, coordSys, step);
+        }
+        // `diff.current` is subset of `current` (which should be ensured by
+        // turnPointsIntoStep), so points in `__points` can be updated when
+        // points in `current` are update during animation.
+        polyline.shape.__points = diff.current;
+        polyline.shape.points = current;
+
+        updateProps(polyline, {
+            shape: {
+                points: next
+            }
+        }, seriesModel);
+
+        if (polygon) {
+            polygon.setShape({
+                points: current,
+                stackedOnPoints: stackedOnCurrent
+            });
+            updateProps(polygon, {
+                shape: {
+                    points: next,
+                    stackedOnPoints: stackedOnNext
+                }
+            }, seriesModel);
+        }
+
+        var updatedDataInfo = [];
+        var diffStatus = diff.status;
+
+        for (var i = 0; i < diffStatus.length; i++) {
+            var cmd = diffStatus[i].cmd;
+            if (cmd === '=') {
+                var el = data.getItemGraphicEl(diffStatus[i].idx1);
+                if (el) {
+                    updatedDataInfo.push({
+                        el: el,
+                        ptIdx: i    // Index of points
+                    });
+                }
+            }
+        }
+
+        if (polyline.animators && polyline.animators.length) {
+            polyline.animators[0].during(function () {
+                for (var i = 0; i < updatedDataInfo.length; i++) {
+                    var el = updatedDataInfo[i].el;
+                    el.attr('position', polyline.shape.__points[updatedDataInfo[i].ptIdx]);
+                }
+            });
+        }
+    },
+
+    remove: function (ecModel) {
+        var group = this.group;
+        var oldData = this._data;
+        this._lineGroup.removeAll();
+        this._symbolDraw.remove(true);
+        // Remove temporary created elements when highlighting
+        oldData && oldData.eachItemGraphicEl(function (el, idx) {
+            if (el.__temp) {
+                group.remove(el);
+                oldData.setItemGraphicEl(idx, null);
+            }
+        });
+
+        this._polyline =
+        this._polygon =
+        this._coordSys =
+        this._points =
+        this._stackedOnPoints =
+        this._data = null;
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var visualSymbol = function (seriesType, defaultSymbolType, legendSymbol) {
+    // Encoding visual for all series include which is filtered for legend drawing
+    return {
+        seriesType: seriesType,
+
+        // For legend.
+        performRawSeries: true,
+
+        reset: function (seriesModel, ecModel, api) {
+            var data = seriesModel.getData();
+
+            var symbolType = seriesModel.get('symbol') || defaultSymbolType;
+            var symbolSize = seriesModel.get('symbolSize');
+            var keepAspect = seriesModel.get('symbolKeepAspect');
+
+            data.setVisual({
+                legendSymbol: legendSymbol || symbolType,
+                symbol: symbolType,
+                symbolSize: symbolSize,
+                symbolKeepAspect: keepAspect
+            });
+
+            // Only visible series has each data be visual encoded
+            if (ecModel.isSeriesFiltered(seriesModel)) {
+                return;
+            }
+
+            var hasCallback = typeof symbolSize === 'function';
+
+            function dataEach(data, idx) {
+                if (typeof symbolSize === 'function') {
+                    var rawValue = seriesModel.getRawValue(idx);
+                    // FIXME
+                    var params = seriesModel.getDataParams(idx);
+                    data.setItemVisual(idx, 'symbolSize', symbolSize(rawValue, params));
+                }
+
+                if (data.hasItemOption) {
+                    var itemModel = data.getItemModel(idx);
+                    var itemSymbolType = itemModel.getShallow('symbol', true);
+                    var itemSymbolSize = itemModel.getShallow('symbolSize',
+                        true);
+                    var itemSymbolKeepAspect =
+                        itemModel.getShallow('symbolKeepAspect',true);
+
+                    // If has item symbol
+                    if (itemSymbolType != null) {
+                        data.setItemVisual(idx, 'symbol', itemSymbolType);
+                    }
+                    if (itemSymbolSize != null) {
+                        // PENDING Transform symbolSize ?
+                        data.setItemVisual(idx, 'symbolSize', itemSymbolSize);
+                    }
+                    if (itemSymbolKeepAspect != null) {
+                        data.setItemVisual(idx, 'symbolKeepAspect',
+                            itemSymbolKeepAspect);
+                    }
+                }
+            }
+
+            return { dataEach: (data.hasItemOption || hasCallback) ? dataEach : null };
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var pointsLayout = function (seriesType) {
+    return {
+        seriesType: seriesType,
+
+        plan: createRenderPlanner(),
+
+        reset: function (seriesModel) {
+            var data = seriesModel.getData();
+            var coordSys = seriesModel.coordinateSystem;
+            var pipelineContext = seriesModel.pipelineContext;
+            var isLargeRender = pipelineContext.large;
+
+            if (!coordSys) {
+                return;
+            }
+
+            var dims = map(coordSys.dimensions, function (dim) {
+                return data.mapDimension(dim);
+            }).slice(0, 2);
+            var dimLen = dims.length;
+
+            var stackResultDim = data.getCalculationInfo('stackResultDimension');
+            if (isDimensionStacked(data, dims[0] /*, dims[1]*/)) {
+                dims[0] = stackResultDim;
+            }
+            if (isDimensionStacked(data, dims[1] /*, dims[0]*/)) {
+                dims[1] = stackResultDim;
+            }
+
+            function progress(params, data) {
+                var segCount = params.end - params.start;
+                var points = isLargeRender && new Float32Array(segCount * dimLen);
+
+                for (var i = params.start, offset = 0, tmpIn = [], tmpOut = []; i < params.end; i++) {
+                    var point;
+
+                    if (dimLen === 1) {
+                        var x = data.get(dims[0], i);
+                        point = !isNaN(x) && coordSys.dataToPoint(x, null, tmpOut);
+                    }
+                    else {
+                        var x = tmpIn[0] = data.get(dims[0], i);
+                        var y = tmpIn[1] = data.get(dims[1], i);
+                        // Also {Array.<number>}, not undefined to avoid if...else... statement
+                        point = !isNaN(x) && !isNaN(y) && coordSys.dataToPoint(tmpIn, null, tmpOut);
+                    }
+
+                    if (isLargeRender) {
+                        points[offset++] = point ? point[0] : NaN;
+                        points[offset++] = point ? point[1] : NaN;
+                    }
+                    else {
+                        data.setItemLayout(i, (point && point.slice()) || [NaN, NaN]);
+                    }
+                }
+
+                isLargeRender && data.setLayout('symbolPoints', points);
+            }
+
+            return dimLen && {progress: progress};
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var samplers = {
+    average: function (frame) {
+        var sum = 0;
+        var count = 0;
+        for (var i = 0; i < frame.length; i++) {
+            if (!isNaN(frame[i])) {
+                sum += frame[i];
+                count++;
+            }
+        }
+        // Return NaN if count is 0
+        return count === 0 ? NaN : sum / count;
+    },
+    sum: function (frame) {
+        var sum = 0;
+        for (var i = 0; i < frame.length; i++) {
+            // Ignore NaN
+            sum += frame[i] || 0;
+        }
+        return sum;
+    },
+    max: function (frame) {
+        var max = -Infinity;
+        for (var i = 0; i < frame.length; i++) {
+            frame[i] > max && (max = frame[i]);
+        }
+        // NaN will cause illegal axis extent.
+        return isFinite(max) ? max : NaN;
+    },
+    min: function (frame) {
+        var min = Infinity;
+        for (var i = 0; i < frame.length; i++) {
+            frame[i] < min && (min = frame[i]);
+        }
+        // NaN will cause illegal axis extent.
+        return isFinite(min) ? min : NaN;
+    },
+    // TODO
+    // Median
+    nearest: function (frame) {
+        return frame[0];
+    }
+};
+
+var indexSampler = function (frame, value) {
+    return Math.round(frame.length / 2);
+};
+
+var dataSample = function (seriesType) {
+    return {
+
+        seriesType: seriesType,
+
+        modifyOutputEnd: true,
+
+        reset: function (seriesModel, ecModel, api) {
+            var data = seriesModel.getData();
+            var sampling = seriesModel.get('sampling');
+            var coordSys = seriesModel.coordinateSystem;
+            // Only cartesian2d support down sampling
+            if (coordSys.type === 'cartesian2d' && sampling) {
+                var baseAxis = coordSys.getBaseAxis();
+                var valueAxis = coordSys.getOtherAxis(baseAxis);
+                var extent = baseAxis.getExtent();
+                // Coordinste system has been resized
+                var size = extent[1] - extent[0];
+                var rate = Math.round(data.count() / size);
+                if (rate > 1) {
+                    var sampler;
+                    if (typeof sampling === 'string') {
+                        sampler = samplers[sampling];
+                    }
+                    else if (typeof sampling === 'function') {
+                        sampler = sampling;
+                    }
+                    if (sampler) {
+                        // Only support sample the first dim mapped from value axis.
+                        seriesModel.setData(data.downSample(
+                            data.mapDimension(valueAxis.dim), 1 / rate, sampler, indexSampler
+                        ));
+                    }
+                }
+            }
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Cartesian coordinate system
+ * @module  echarts/coord/Cartesian
+ *
+ */
+
+function dimAxisMapper(dim) {
+    return this._axes[dim];
+}
+
+/**
+ * @alias module:echarts/coord/Cartesian
+ * @constructor
+ */
+var Cartesian = function (name) {
+    this._axes = {};
+
+    this._dimList = [];
+
+    /**
+     * @type {string}
+     */
+    this.name = name || '';
+};
+
+Cartesian.prototype = {
+
+    constructor: Cartesian,
+
+    type: 'cartesian',
+
+    /**
+     * Get axis
+     * @param  {number|string} dim
+     * @return {module:echarts/coord/Cartesian~Axis}
+     */
+    getAxis: function (dim) {
+        return this._axes[dim];
+    },
+
+    /**
+     * Get axes list
+     * @return {Array.<module:echarts/coord/Cartesian~Axis>}
+     */
+    getAxes: function () {
+        return map(this._dimList, dimAxisMapper, this);
+    },
+
+    /**
+     * Get axes list by given scale type
+     */
+    getAxesByScale: function (scaleType) {
+        scaleType = scaleType.toLowerCase();
+        return filter(
+            this.getAxes(),
+            function (axis) {
+                return axis.scale.type === scaleType;
+            }
+        );
+    },
+
+    /**
+     * Add axis
+     * @param {module:echarts/coord/Cartesian.Axis}
+     */
+    addAxis: function (axis) {
+        var dim = axis.dim;
+
+        this._axes[dim] = axis;
+
+        this._dimList.push(dim);
+    },
+
+    /**
+     * Convert data to coord in nd space
+     * @param {Array.<number>|Object.<string, number>} val
+     * @return {Array.<number>|Object.<string, number>}
+     */
+    dataToCoord: function (val) {
+        return this._dataCoordConvert(val, 'dataToCoord');
+    },
+
+    /**
+     * Convert coord in nd space to data
+     * @param  {Array.<number>|Object.<string, number>} val
+     * @return {Array.<number>|Object.<string, number>}
+     */
+    coordToData: function (val) {
+        return this._dataCoordConvert(val, 'coordToData');
+    },
+
+    _dataCoordConvert: function (input, method) {
+        var dimList = this._dimList;
+
+        var output = input instanceof Array ? [] : {};
+
+        for (var i = 0; i < dimList.length; i++) {
+            var dim = dimList[i];
+            var axis = this._axes[dim];
+
+            output[dim] = axis[method](input[dim]);
+        }
+
+        return output;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function Cartesian2D(name) {
+
+    Cartesian.call(this, name);
+}
+
+Cartesian2D.prototype = {
+
+    constructor: Cartesian2D,
+
+    type: 'cartesian2d',
+
+    /**
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['x', 'y'],
+
+    /**
+     * Base axis will be used on stacking.
+     *
+     * @return {module:echarts/coord/cartesian/Axis2D}
+     */
+    getBaseAxis: function () {
+        return this.getAxesByScale('ordinal')[0]
+            || this.getAxesByScale('time')[0]
+            || this.getAxis('x');
+    },
+
+    /**
+     * If contain point
+     * @param {Array.<number>} point
+     * @return {boolean}
+     */
+    containPoint: function (point) {
+        var axisX = this.getAxis('x');
+        var axisY = this.getAxis('y');
+        return axisX.contain(axisX.toLocalCoord(point[0]))
+            && axisY.contain(axisY.toLocalCoord(point[1]));
+    },
+
+    /**
+     * If contain data
+     * @param {Array.<number>} data
+     * @return {boolean}
+     */
+    containData: function (data) {
+        return this.getAxis('x').containData(data[0])
+            && this.getAxis('y').containData(data[1]);
+    },
+
+    /**
+     * @param {Array.<number>} data
+     * @param {Array.<number>} out
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, reserved, out) {
+        var xAxis = this.getAxis('x');
+        var yAxis = this.getAxis('y');
+        out = out || [];
+        out[0] = xAxis.toGlobalCoord(xAxis.dataToCoord(data[0]));
+        out[1] = yAxis.toGlobalCoord(yAxis.dataToCoord(data[1]));
+        return out;
+    },
+
+    /**
+     * @param {Array.<number>} data
+     * @param {Array.<number>} out
+     * @return {Array.<number>}
+     */
+    clampData: function (data, out) {
+        var xScale = this.getAxis('x').scale;
+        var yScale = this.getAxis('y').scale;
+        var xAxisExtent = xScale.getExtent();
+        var yAxisExtent = yScale.getExtent();
+        var x = xScale.parse(data[0]);
+        var y = yScale.parse(data[1]);
+        out = out || [];
+        out[0] = Math.min(
+            Math.max(Math.min(xAxisExtent[0], xAxisExtent[1]), x),
+            Math.max(xAxisExtent[0], xAxisExtent[1])
+        );
+        out[1] = Math.min(
+            Math.max(Math.min(yAxisExtent[0], yAxisExtent[1]), y),
+            Math.max(yAxisExtent[0], yAxisExtent[1])
+        );
+
+        return out;
+    },
+
+    /**
+     * @param {Array.<number>} point
+     * @param {Array.<number>} out
+     * @return {Array.<number>}
+     */
+    pointToData: function (point, out) {
+        var xAxis = this.getAxis('x');
+        var yAxis = this.getAxis('y');
+        out = out || [];
+        out[0] = xAxis.coordToData(xAxis.toLocalCoord(point[0]));
+        out[1] = yAxis.coordToData(yAxis.toLocalCoord(point[1]));
+        return out;
+    },
+
+    /**
+     * Get other axis
+     * @param {module:echarts/coord/cartesian/Axis2D} axis
+     */
+    getOtherAxis: function (axis) {
+        return this.getAxis(axis.dim === 'x' ? 'y' : 'x');
+    }
+
+};
+
+inherits(Cartesian2D, Cartesian);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Extend axis 2d
+ * @constructor module:echarts/coord/cartesian/Axis2D
+ * @extends {module:echarts/coord/cartesian/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ * @param {string} position
+ */
+var Axis2D = function (dim, scale, coordExtent, axisType, position) {
+    Axis.call(this, dim, scale, coordExtent);
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * Axis position
+     *  - 'top'
+     *  - 'bottom'
+     *  - 'left'
+     *  - 'right'
+     */
+    this.position = position || 'bottom';
+};
+
+Axis2D.prototype = {
+
+    constructor: Axis2D,
+
+    /**
+     * Index of axis, can be used as key
+     */
+    index: 0,
+
+    /**
+     * Implemented in <module:echarts/coord/cartesian/Grid>.
+     * @return {Array.<module:echarts/coord/cartesian/Axis2D>}
+     *         If not on zero of other axis, return null/undefined.
+     *         If no axes, return an empty array.
+     */
+    getAxesOnZeroOf: null,
+
+    /**
+     * Axis model
+     * @param {module:echarts/coord/cartesian/AxisModel}
+     */
+    model: null,
+
+    isHorizontal: function () {
+        var position = this.position;
+        return position === 'top' || position === 'bottom';
+    },
+
+    /**
+     * Each item cooresponds to this.getExtent(), which
+     * means globalExtent[0] may greater than globalExtent[1],
+     * unless `asc` is input.
+     *
+     * @param {boolean} [asc]
+     * @return {Array.<number>}
+     */
+    getGlobalExtent: function (asc) {
+        var ret = this.getExtent();
+        ret[0] = this.toGlobalCoord(ret[0]);
+        ret[1] = this.toGlobalCoord(ret[1]);
+        asc && ret[0] > ret[1] && ret.reverse();
+        return ret;
+    },
+
+    getOtherAxis: function () {
+        this.grid.getOtherAxis();
+    },
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.coordToData(this.toLocalCoord(point[this.dim === 'x' ? 0 : 1]), clamp);
+    },
+
+    /**
+     * Transform global coord to local coord,
+     * i.e. var localCoord = axis.toLocalCoord(80);
+     * designate by module:echarts/coord/cartesian/Grid.
+     * @type {Function}
+     */
+    toLocalCoord: null,
+
+    /**
+     * Transform global coord to local coord,
+     * i.e. var globalCoord = axis.toLocalCoord(40);
+     * designate by module:echarts/coord/cartesian/Grid.
+     * @type {Function}
+     */
+    toGlobalCoord: null
+
+};
+
+inherits(Axis2D, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var defaultOption = {
+    show: true,
+    zlevel: 0,
+    z: 0,
+    // Inverse the axis.
+    inverse: false,
+
+    // Axis name displayed.
+    name: '',
+    // 'start' | 'middle' | 'end'
+    nameLocation: 'end',
+    // By degree. By defualt auto rotate by nameLocation.
+    nameRotate: null,
+    nameTruncate: {
+        maxWidth: null,
+        ellipsis: '...',
+        placeholder: '.'
+    },
+    // Use global text style by default.
+    nameTextStyle: {},
+    // The gap between axisName and axisLine.
+    nameGap: 15,
+
+    // Default `false` to support tooltip.
+    silent: false,
+    // Default `false` to avoid legacy user event listener fail.
+    triggerEvent: false,
+
+    tooltip: {
+        show: false
+    },
+
+    axisPointer: {},
+
+    axisLine: {
+        show: true,
+        onZero: true,
+        onZeroAxisIndex: null,
+        lineStyle: {
+            color: '#333',
+            width: 1,
+            type: 'solid'
+        },
+        // The arrow at both ends the the axis.
+        symbol: ['none', 'none'],
+        symbolSize: [10, 15]
+    },
+    axisTick: {
+        show: true,
+        // Whether axisTick is inside the grid or outside the grid.
+        inside: false,
+        // The length of axisTick.
+        length: 5,
+        lineStyle: {
+            width: 1
+        }
+    },
+    axisLabel: {
+        show: true,
+        // Whether axisLabel is inside the grid or outside the grid.
+        inside: false,
+        rotate: 0,
+        // true | false | null/undefined (auto)
+        showMinLabel: null,
+        // true | false | null/undefined (auto)
+        showMaxLabel: null,
+        margin: 8,
+        // formatter: null,
+        fontSize: 12
+    },
+    splitLine: {
+        show: true,
+        lineStyle: {
+            color: ['#ccc'],
+            width: 1,
+            type: 'solid'
+        }
+    },
+    splitArea: {
+        show: false,
+        areaStyle: {
+            color: ['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']
+        }
+    }
+};
+
+var axisDefault = {};
+
+axisDefault.categoryAxis = merge({
+    // The gap at both ends of the axis. For categoryAxis, boolean.
+    boundaryGap: true,
+    // Set false to faster category collection.
+    // Only usefull in the case like: category is
+    // ['2012-01-01', '2012-01-02', ...], where the input
+    // data has been ensured not duplicate and is large data.
+    // null means "auto":
+    // if axis.data provided, do not deduplication,
+    // else do deduplication.
+    deduplication: null,
+    // splitArea: {
+        // show: false
+    // },
+    splitLine: {
+        show: false
+    },
+    axisTick: {
+        // If tick is align with label when boundaryGap is true
+        alignWithLabel: false,
+        interval: 'auto'
+    },
+    axisLabel: {
+        interval: 'auto'
+    }
+}, defaultOption);
+
+axisDefault.valueAxis = merge({
+    // The gap at both ends of the axis. For value axis, [GAP, GAP], where
+    // `GAP` can be an absolute pixel number (like `35`), or percent (like `'30%'`)
+    boundaryGap: [0, 0],
+
+    // TODO
+    // min/max: [30, datamin, 60] or [20, datamin] or [datamin, 60]
+
+    // Min value of the axis. can be:
+    // + a number
+    // + 'dataMin': use the min value in data.
+    // + null/undefined: auto decide min value (consider pretty look and boundaryGap).
+    // min: null,
+
+    // Max value of the axis. can be:
+    // + a number
+    // + 'dataMax': use the max value in data.
+    // + null/undefined: auto decide max value (consider pretty look and boundaryGap).
+    // max: null,
+
+    // Readonly prop, specifies start value of the range when using data zoom.
+    // rangeStart: null
+
+    // Readonly prop, specifies end value of the range when using data zoom.
+    // rangeEnd: null
+
+    // Optional value can be:
+    // + `false`: always include value 0.
+    // + `true`: the extent do not consider value 0.
+    // scale: false,
+
+    // AxisTick and axisLabel and splitLine are caculated based on splitNumber.
+    splitNumber: 5
+
+    // Interval specifies the span of the ticks is mandatorily.
+    // interval: null
+
+    // Specify min interval when auto calculate tick interval.
+    // minInterval: null
+
+    // Specify max interval when auto calculate tick interval.
+    // maxInterval: null
+
+}, defaultOption);
+
+axisDefault.timeAxis = defaults({
+    scale: true,
+    min: 'dataMin',
+    max: 'dataMax'
+}, axisDefault.valueAxis);
+
+axisDefault.logAxis = defaults({
+    scale: true,
+    logBase: 10
+}, axisDefault.valueAxis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME axisType is fixed ?
+var AXIS_TYPES = ['value', 'category', 'time', 'log'];
+
+/**
+ * Generate sub axis model class
+ * @param {string} axisName 'x' 'y' 'radius' 'angle' 'parallel'
+ * @param {module:echarts/model/Component} BaseAxisModelClass
+ * @param {Function} axisTypeDefaulter
+ * @param {Object} [extraDefaultOption]
+ */
+var axisModelCreator = function (axisName, BaseAxisModelClass, axisTypeDefaulter, extraDefaultOption) {
+
+    each$1(AXIS_TYPES, function (axisType) {
+
+        BaseAxisModelClass.extend({
+
+            /**
+             * @readOnly
+             */
+            type: axisName + 'Axis.' + axisType,
+
+            mergeDefaultAndTheme: function (option, ecModel) {
+                var layoutMode = this.layoutMode;
+                var inputPositionParams = layoutMode
+                    ? getLayoutParams(option) : {};
+
+                var themeModel = ecModel.getTheme();
+                merge(option, themeModel.get(axisType + 'Axis'));
+                merge(option, this.getDefaultOption());
+
+                option.type = axisTypeDefaulter(axisName, option);
+
+                if (layoutMode) {
+                    mergeLayoutParam(option, inputPositionParams, layoutMode);
+                }
+            },
+
+            /**
+             * @override
+             */
+            optionUpdated: function () {
+                var thisOption = this.option;
+                if (thisOption.type === 'category') {
+                    this.__ordinalMeta = OrdinalMeta.createByAxisModel(this);
+                }
+            },
+
+            /**
+             * Should not be called before all of 'getInitailData' finished.
+             * Because categories are collected during initializing data.
+             */
+            getCategories: function (rawData) {
+                var option = this.option;
+                // FIXME
+                // warning if called before all of 'getInitailData' finished.
+                if (option.type === 'category') {
+                    if (rawData) {
+                        return option.data;
+                    }
+                    return this.__ordinalMeta.categories;
+                }
+            },
+
+            getOrdinalMeta: function () {
+                return this.__ordinalMeta;
+            },
+
+            defaultOption: mergeAll(
+                [
+                    {},
+                    axisDefault[axisType + 'Axis'],
+                    extraDefaultOption
+                ],
+                true
+            )
+        });
+    });
+
+    ComponentModel.registerSubTypeDefaulter(
+        axisName + 'Axis',
+        curry(axisTypeDefaulter, axisName)
+    );
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisModel = ComponentModel.extend({
+
+    type: 'cartesian2dAxis',
+
+    /**
+     * @type {module:echarts/coord/cartesian/Axis2D}
+     */
+    axis: null,
+
+    /**
+     * @override
+     */
+    init: function () {
+        AxisModel.superApply(this, 'init', arguments);
+        this.resetRange();
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function () {
+        AxisModel.superApply(this, 'mergeOption', arguments);
+        this.resetRange();
+    },
+
+    /**
+     * @override
+     */
+    restoreData: function () {
+        AxisModel.superApply(this, 'restoreData', arguments);
+        this.resetRange();
+    },
+
+    /**
+     * @override
+     * @return {module:echarts/model/Component}
+     */
+    getCoordSysModel: function () {
+        return this.ecModel.queryComponents({
+            mainType: 'grid',
+            index: this.option.gridIndex,
+            id: this.option.gridId
+        })[0];
+    }
+
+});
+
+function getAxisType(axisDim, option) {
+    // Default axis with data is category axis
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+merge(AxisModel.prototype, axisModelCommonMixin);
+
+var extraOption = {
+    // gridIndex: 0,
+    // gridId: '',
+
+    // Offset is for multiple axis on the same position
+    offset: 0
+};
+
+axisModelCreator('x', AxisModel, getAxisType, extraOption);
+axisModelCreator('y', AxisModel, getAxisType, extraOption);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Grid 是在有直角坐标系的时候必须要存在的
+// 所以这里也要被 Cartesian2D 依赖
+
+ComponentModel.extend({
+
+    type: 'grid',
+
+    dependencies: ['xAxis', 'yAxis'],
+
+    layoutMode: 'box',
+
+    /**
+     * @type {module:echarts/coord/cartesian/Grid}
+     */
+    coordinateSystem: null,
+
+    defaultOption: {
+        show: false,
+        zlevel: 0,
+        z: 0,
+        left: '10%',
+        top: 60,
+        right: '10%',
+        bottom: 60,
+        // If grid size contain label
+        containLabel: false,
+        // width: {totalWidth} - left - right,
+        // height: {totalHeight} - top - bottom,
+        backgroundColor: 'rgba(0,0,0,0)',
+        borderWidth: 1,
+        borderColor: '#ccc'
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Grid is a region which contains at most 4 cartesian systems
+ *
+ * TODO Default cartesian
+ */
+
+// Depends on GridModel, AxisModel, which performs preprocess.
+/**
+ * Check if the axis is used in the specified grid
+ * @inner
+ */
+function isAxisUsedInTheGrid(axisModel, gridModel, ecModel) {
+    return axisModel.getCoordSysModel() === gridModel;
+}
+
+function Grid(gridModel, ecModel, api) {
+    /**
+     * @type {Object.<string, module:echarts/coord/cartesian/Cartesian2D>}
+     * @private
+     */
+    this._coordsMap = {};
+
+    /**
+     * @type {Array.<module:echarts/coord/cartesian/Cartesian>}
+     * @private
+     */
+    this._coordsList = [];
+
+    /**
+     * @type {Object.<string, module:echarts/coord/cartesian/Axis2D>}
+     * @private
+     */
+    this._axesMap = {};
+
+    /**
+     * @type {Array.<module:echarts/coord/cartesian/Axis2D>}
+     * @private
+     */
+    this._axesList = [];
+
+    this._initCartesian(gridModel, ecModel, api);
+
+    this.model = gridModel;
+}
+
+var gridProto = Grid.prototype;
+
+gridProto.type = 'grid';
+
+gridProto.axisPointerEnabled = true;
+
+gridProto.getRect = function () {
+    return this._rect;
+};
+
+gridProto.update = function (ecModel, api) {
+
+    var axesMap = this._axesMap;
+
+    this._updateScale(ecModel, this.model);
+
+    each$1(axesMap.x, function (xAxis) {
+        niceScaleExtent(xAxis.scale, xAxis.model);
+    });
+    each$1(axesMap.y, function (yAxis) {
+        niceScaleExtent(yAxis.scale, yAxis.model);
+    });
+    each$1(axesMap.x, function (xAxis) {
+        fixAxisOnZero(axesMap, 'y', xAxis);
+    });
+    each$1(axesMap.y, function (yAxis) {
+        fixAxisOnZero(axesMap, 'x', yAxis);
+    });
+
+    // Resize again if containLabel is enabled
+    // FIXME It may cause getting wrong grid size in data processing stage
+    this.resize(this.model, api);
+};
+
+function fixAxisOnZero(axesMap, otherAxisDim, axis) {
+
+    axis.getAxesOnZeroOf = function () {
+        // TODO: onZero of multiple axes.
+        return otherAxis ? [otherAxis] : [];
+    };
+
+    // onZero can not be enabled in these two situations:
+    // 1. When any other axis is a category axis.
+    // 2. When no axis is cross 0 point.
+    var otherAxes = axesMap[otherAxisDim];
+
+    var otherAxis;
+    var axisModel = axis.model;
+    var onZero = axisModel.get('axisLine.onZero');
+    var onZeroAxisIndex = axisModel.get('axisLine.onZeroAxisIndex');
+
+    if (!onZero) {
+        return;
+    }
+
+    // If target axis is specified.
+    if (onZeroAxisIndex != null) {
+        if (canOnZeroToAxis(otherAxes[onZeroAxisIndex])) {
+            otherAxis = otherAxes[onZeroAxisIndex];
+        }
+        return;
+    }
+
+    // Find the first available other axis.
+    for (var idx in otherAxes) {
+        if (otherAxes.hasOwnProperty(idx) && canOnZeroToAxis(otherAxes[idx])) {
+            otherAxis = otherAxes[idx];
+            break;
+        }
+    }
+}
+
+function canOnZeroToAxis(axis) {
+    return axis && axis.type !== 'category' && axis.type !== 'time' && ifAxisCrossZero(axis);
+}
+
+/**
+ * Resize the grid
+ * @param {module:echarts/coord/cartesian/GridModel} gridModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+gridProto.resize = function (gridModel, api, ignoreContainLabel) {
+
+    var gridRect = getLayoutRect(
+        gridModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        });
+
+    this._rect = gridRect;
+
+    var axesList = this._axesList;
+
+    adjustAxes();
+
+    // Minus label size
+    if (!ignoreContainLabel && gridModel.get('containLabel')) {
+        each$1(axesList, function (axis) {
+            if (!axis.model.get('axisLabel.inside')) {
+                var labelUnionRect = estimateLabelUnionRect(axis);
+                if (labelUnionRect) {
+                    var dim = axis.isHorizontal() ? 'height' : 'width';
+                    var margin = axis.model.get('axisLabel.margin');
+                    gridRect[dim] -= labelUnionRect[dim] + margin;
+                    if (axis.position === 'top') {
+                        gridRect.y += labelUnionRect.height + margin;
+                    }
+                    else if (axis.position === 'left')  {
+                        gridRect.x += labelUnionRect.width + margin;
+                    }
+                }
+            }
+        });
+
+        adjustAxes();
+    }
+
+    function adjustAxes() {
+        each$1(axesList, function (axis) {
+            var isHorizontal = axis.isHorizontal();
+            var extent = isHorizontal ? [0, gridRect.width] : [0, gridRect.height];
+            var idx = axis.inverse ? 1 : 0;
+            axis.setExtent(extent[idx], extent[1 - idx]);
+            updateAxisTransform(axis, isHorizontal ? gridRect.x : gridRect.y);
+        });
+    }
+};
+
+/**
+ * @param {string} axisType
+ * @param {number} [axisIndex]
+ */
+gridProto.getAxis = function (axisType, axisIndex) {
+    var axesMapOnDim = this._axesMap[axisType];
+    if (axesMapOnDim != null) {
+        if (axisIndex == null) {
+            // Find first axis
+            for (var name in axesMapOnDim) {
+                if (axesMapOnDim.hasOwnProperty(name)) {
+                    return axesMapOnDim[name];
+                }
+            }
+        }
+        return axesMapOnDim[axisIndex];
+    }
+};
+
+/**
+ * @return {Array.<module:echarts/coord/Axis>}
+ */
+gridProto.getAxes = function () {
+    return this._axesList.slice();
+};
+
+/**
+ * Usage:
+ *      grid.getCartesian(xAxisIndex, yAxisIndex);
+ *      grid.getCartesian(xAxisIndex);
+ *      grid.getCartesian(null, yAxisIndex);
+ *      grid.getCartesian({xAxisIndex: ..., yAxisIndex: ...});
+ *
+ * @param {number|Object} [xAxisIndex]
+ * @param {number} [yAxisIndex]
+ */
+gridProto.getCartesian = function (xAxisIndex, yAxisIndex) {
+    if (xAxisIndex != null && yAxisIndex != null) {
+        var key = 'x' + xAxisIndex + 'y' + yAxisIndex;
+        return this._coordsMap[key];
+    }
+
+    if (isObject$1(xAxisIndex)) {
+        yAxisIndex = xAxisIndex.yAxisIndex;
+        xAxisIndex = xAxisIndex.xAxisIndex;
+    }
+    // When only xAxisIndex or yAxisIndex given, find its first cartesian.
+    for (var i = 0, coordList = this._coordsList; i < coordList.length; i++) {
+        if (coordList[i].getAxis('x').index === xAxisIndex
+            || coordList[i].getAxis('y').index === yAxisIndex
+        ) {
+            return coordList[i];
+        }
+    }
+};
+
+gridProto.getCartesians = function () {
+    return this._coordsList.slice();
+};
+
+/**
+ * @implements
+ * see {module:echarts/CoodinateSystem}
+ */
+gridProto.convertToPixel = function (ecModel, finder, value) {
+    var target = this._findConvertTarget(ecModel, finder);
+
+    return target.cartesian
+        ? target.cartesian.dataToPoint(value)
+        : target.axis
+        ? target.axis.toGlobalCoord(target.axis.dataToCoord(value))
+        : null;
+};
+
+/**
+ * @implements
+ * see {module:echarts/CoodinateSystem}
+ */
+gridProto.convertFromPixel = function (ecModel, finder, value) {
+    var target = this._findConvertTarget(ecModel, finder);
+
+    return target.cartesian
+        ? target.cartesian.pointToData(value)
+        : target.axis
+        ? target.axis.coordToData(target.axis.toLocalCoord(value))
+        : null;
+};
+
+/**
+ * @inner
+ */
+gridProto._findConvertTarget = function (ecModel, finder) {
+    var seriesModel = finder.seriesModel;
+    var xAxisModel = finder.xAxisModel
+        || (seriesModel && seriesModel.getReferringComponents('xAxis')[0]);
+    var yAxisModel = finder.yAxisModel
+        || (seriesModel && seriesModel.getReferringComponents('yAxis')[0]);
+    var gridModel = finder.gridModel;
+    var coordsList = this._coordsList;
+    var cartesian;
+    var axis;
+
+    if (seriesModel) {
+        cartesian = seriesModel.coordinateSystem;
+        indexOf(coordsList, cartesian) < 0 && (cartesian = null);
+    }
+    else if (xAxisModel && yAxisModel) {
+        cartesian = this.getCartesian(xAxisModel.componentIndex, yAxisModel.componentIndex);
+    }
+    else if (xAxisModel) {
+        axis = this.getAxis('x', xAxisModel.componentIndex);
+    }
+    else if (yAxisModel) {
+        axis = this.getAxis('y', yAxisModel.componentIndex);
+    }
+    // Lowest priority.
+    else if (gridModel) {
+        var grid = gridModel.coordinateSystem;
+        if (grid === this) {
+            cartesian = this._coordsList[0];
+        }
+    }
+
+    return {cartesian: cartesian, axis: axis};
+};
+
+/**
+ * @implements
+ * see {module:echarts/CoodinateSystem}
+ */
+gridProto.containPoint = function (point) {
+    var coord = this._coordsList[0];
+    if (coord) {
+        return coord.containPoint(point);
+    }
+};
+
+/**
+ * Initialize cartesian coordinate systems
+ * @private
+ */
+gridProto._initCartesian = function (gridModel, ecModel, api) {
+    var axisPositionUsed = {
+        left: false,
+        right: false,
+        top: false,
+        bottom: false
+    };
+
+    var axesMap = {
+        x: {},
+        y: {}
+    };
+    var axesCount = {
+        x: 0,
+        y: 0
+    };
+
+    /// Create axis
+    ecModel.eachComponent('xAxis', createAxisCreator('x'), this);
+    ecModel.eachComponent('yAxis', createAxisCreator('y'), this);
+
+    if (!axesCount.x || !axesCount.y) {
+        // Roll back when there no either x or y axis
+        this._axesMap = {};
+        this._axesList = [];
+        return;
+    }
+
+    this._axesMap = axesMap;
+
+    /// Create cartesian2d
+    each$1(axesMap.x, function (xAxis, xAxisIndex) {
+        each$1(axesMap.y, function (yAxis, yAxisIndex) {
+            var key = 'x' + xAxisIndex + 'y' + yAxisIndex;
+            var cartesian = new Cartesian2D(key);
+
+            cartesian.grid = this;
+            cartesian.model = gridModel;
+
+            this._coordsMap[key] = cartesian;
+            this._coordsList.push(cartesian);
+
+            cartesian.addAxis(xAxis);
+            cartesian.addAxis(yAxis);
+        }, this);
+    }, this);
+
+    function createAxisCreator(axisType) {
+        return function (axisModel, idx) {
+            if (!isAxisUsedInTheGrid(axisModel, gridModel, ecModel)) {
+                return;
+            }
+
+            var axisPosition = axisModel.get('position');
+            if (axisType === 'x') {
+                // Fix position
+                if (axisPosition !== 'top' && axisPosition !== 'bottom') {
+                    // Default bottom of X
+                    axisPosition = 'bottom';
+                    if (axisPositionUsed[axisPosition]) {
+                        axisPosition = axisPosition === 'top' ? 'bottom' : 'top';
+                    }
+                }
+            }
+            else {
+                // Fix position
+                if (axisPosition !== 'left' && axisPosition !== 'right') {
+                    // Default left of Y
+                    axisPosition = 'left';
+                    if (axisPositionUsed[axisPosition]) {
+                        axisPosition = axisPosition === 'left' ? 'right' : 'left';
+                    }
+                }
+            }
+            axisPositionUsed[axisPosition] = true;
+
+            var axis = new Axis2D(
+                axisType, createScaleByModel(axisModel),
+                [0, 0],
+                axisModel.get('type'),
+                axisPosition
+            );
+
+            var isCategory = axis.type === 'category';
+            axis.onBand = isCategory && axisModel.get('boundaryGap');
+            axis.inverse = axisModel.get('inverse');
+
+            // Inject axis into axisModel
+            axisModel.axis = axis;
+
+            // Inject axisModel into axis
+            axis.model = axisModel;
+
+            // Inject grid info axis
+            axis.grid = this;
+
+            // Index of axis, can be used as key
+            axis.index = idx;
+
+            this._axesList.push(axis);
+
+            axesMap[axisType][idx] = axis;
+            axesCount[axisType]++;
+        };
+    }
+};
+
+/**
+ * Update cartesian properties from series
+ * @param  {module:echarts/model/Option} option
+ * @private
+ */
+gridProto._updateScale = function (ecModel, gridModel) {
+    // Reset scale
+    each$1(this._axesList, function (axis) {
+        axis.scale.setExtent(Infinity, -Infinity);
+    });
+    ecModel.eachSeries(function (seriesModel) {
+        if (isCartesian2D(seriesModel)) {
+            var axesModels = findAxesModels(seriesModel, ecModel);
+            var xAxisModel = axesModels[0];
+            var yAxisModel = axesModels[1];
+
+            if (!isAxisUsedInTheGrid(xAxisModel, gridModel, ecModel)
+                || !isAxisUsedInTheGrid(yAxisModel, gridModel, ecModel)
+            ) {
+                return;
+            }
+
+            var cartesian = this.getCartesian(
+                xAxisModel.componentIndex, yAxisModel.componentIndex
+            );
+            var data = seriesModel.getData();
+            var xAxis = cartesian.getAxis('x');
+            var yAxis = cartesian.getAxis('y');
+
+            if (data.type === 'list') {
+                unionExtent(data, xAxis, seriesModel);
+                unionExtent(data, yAxis, seriesModel);
+            }
+        }
+    }, this);
+
+    function unionExtent(data, axis, seriesModel) {
+        each$1(data.mapDimension(axis.dim, true), function (dim) {
+            axis.scale.unionExtentFromData(
+                // For example, the extent of the orginal dimension
+                // is [0.1, 0.5], the extent of the `stackResultDimension`
+                // is [7, 9], the final extent should not include [0.1, 0.5].
+                data, getStackedDimension(data, dim)
+            );
+        });
+    }
+};
+
+/**
+ * @param {string} [dim] 'x' or 'y' or 'auto' or null/undefined
+ * @return {Object} {baseAxes: [], otherAxes: []}
+ */
+gridProto.getTooltipAxes = function (dim) {
+    var baseAxes = [];
+    var otherAxes = [];
+
+    each$1(this.getCartesians(), function (cartesian) {
+        var baseAxis = (dim != null && dim !== 'auto')
+            ? cartesian.getAxis(dim) : cartesian.getBaseAxis();
+        var otherAxis = cartesian.getOtherAxis(baseAxis);
+        indexOf(baseAxes, baseAxis) < 0 && baseAxes.push(baseAxis);
+        indexOf(otherAxes, otherAxis) < 0 && otherAxes.push(otherAxis);
+    });
+
+    return {baseAxes: baseAxes, otherAxes: otherAxes};
+};
+
+/**
+ * @inner
+ */
+function updateAxisTransform(axis, coordBase) {
+    var axisExtent = axis.getExtent();
+    var axisExtentSum = axisExtent[0] + axisExtent[1];
+
+    // Fast transform
+    axis.toGlobalCoord = axis.dim === 'x'
+        ? function (coord) {
+            return coord + coordBase;
+        }
+        : function (coord) {
+            return axisExtentSum - coord + coordBase;
+        };
+    axis.toLocalCoord = axis.dim === 'x'
+        ? function (coord) {
+            return coord - coordBase;
+        }
+        : function (coord) {
+            return axisExtentSum - coord + coordBase;
+        };
+}
+
+var axesTypes = ['xAxis', 'yAxis'];
+/**
+ * @inner
+ */
+function findAxesModels(seriesModel, ecModel) {
+    return map(axesTypes, function (axisType) {
+        var axisModel = seriesModel.getReferringComponents(axisType)[0];
+
+        if (__DEV__) {
+            if (!axisModel) {
+                throw new Error(axisType + ' "' + retrieve(
+                    seriesModel.get(axisType + 'Index'),
+                    seriesModel.get(axisType + 'Id'),
+                    0
+                ) + '" not found');
+            }
+        }
+        return axisModel;
+    });
+}
+
+/**
+ * @inner
+ */
+function isCartesian2D(seriesModel) {
+    return seriesModel.get('coordinateSystem') === 'cartesian2d';
+}
+
+Grid.create = function (ecModel, api) {
+    var grids = [];
+    ecModel.eachComponent('grid', function (gridModel, idx) {
+        var grid = new Grid(gridModel, ecModel, api);
+        grid.name = 'grid_' + idx;
+        // dataSampling requires axis extent, so resize
+        // should be performed in create stage.
+        grid.resize(gridModel, api, true);
+
+        gridModel.coordinateSystem = grid;
+
+        grids.push(grid);
+    });
+
+    // Inject the coordinateSystems into seriesModel
+    ecModel.eachSeries(function (seriesModel) {
+        if (!isCartesian2D(seriesModel)) {
+            return;
+        }
+
+        var axesModels = findAxesModels(seriesModel, ecModel);
+        var xAxisModel = axesModels[0];
+        var yAxisModel = axesModels[1];
+
+        var gridModel = xAxisModel.getCoordSysModel();
+
+        if (__DEV__) {
+            if (!gridModel) {
+                throw new Error(
+                    'Grid "' + retrieve(
+                        xAxisModel.get('gridIndex'),
+                        xAxisModel.get('gridId'),
+                        0
+                    ) + '" not found'
+                );
+            }
+            if (xAxisModel.getCoordSysModel() !== yAxisModel.getCoordSysModel()) {
+                throw new Error('xAxis and yAxis must use the same grid');
+            }
+        }
+
+        var grid = gridModel.coordinateSystem;
+
+        seriesModel.coordinateSystem = grid.getCartesian(
+            xAxisModel.componentIndex, yAxisModel.componentIndex
+        );
+    });
+
+    return grids;
+};
+
+// For deciding which dimensions to use when creating list data
+Grid.dimensions = Grid.prototype.dimensions = Cartesian2D.prototype.dimensions;
+
+CoordinateSystemManager.register('cartesian2d', Grid);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PI$2 = Math.PI;
+
+function makeAxisEventDataBase(axisModel) {
+    var eventData = {
+        componentType: axisModel.mainType
+    };
+    eventData[axisModel.mainType + 'Index'] = axisModel.componentIndex;
+    return eventData;
+}
+
+/**
+ * A final axis is translated and rotated from a "standard axis".
+ * So opt.position and opt.rotation is required.
+ *
+ * A standard axis is and axis from [0, 0] to [0, axisExtent[1]],
+ * for example: (0, 0) ------------> (0, 50)
+ *
+ * nameDirection or tickDirection or labelDirection is 1 means tick
+ * or label is below the standard axis, whereas is -1 means above
+ * the standard axis. labelOffset means offset between label and axis,
+ * which is useful when 'onZero', where axisLabel is in the grid and
+ * label in outside grid.
+ *
+ * Tips: like always,
+ * positive rotation represents anticlockwise, and negative rotation
+ * represents clockwise.
+ * The direction of position coordinate is the same as the direction
+ * of screen coordinate.
+ *
+ * Do not need to consider axis 'inverse', which is auto processed by
+ * axis extent.
+ *
+ * @param {module:zrender/container/Group} group
+ * @param {Object} axisModel
+ * @param {Object} opt Standard axis parameters.
+ * @param {Array.<number>} opt.position [x, y]
+ * @param {number} opt.rotation by radian
+ * @param {number} [opt.nameDirection=1] 1 or -1 Used when nameLocation is 'middle' or 'center'.
+ * @param {number} [opt.tickDirection=1] 1 or -1
+ * @param {number} [opt.labelDirection=1] 1 or -1
+ * @param {number} [opt.labelOffset=0] Usefull when onZero.
+ * @param {string} [opt.axisLabelShow] default get from axisModel.
+ * @param {string} [opt.axisName] default get from axisModel.
+ * @param {number} [opt.axisNameAvailableWidth]
+ * @param {number} [opt.labelRotate] by degree, default get from axisModel.
+ * @param {number} [opt.strokeContainThreshold] Default label interval when label
+ * @param {number} [opt.nameTruncateMaxWidth]
+ */
+var AxisBuilder = function (axisModel, opt) {
+
+    /**
+     * @readOnly
+     */
+    this.opt = opt;
+
+    /**
+     * @readOnly
+     */
+    this.axisModel = axisModel;
+
+    // Default value
+    defaults(
+        opt,
+        {
+            labelOffset: 0,
+            nameDirection: 1,
+            tickDirection: 1,
+            labelDirection: 1,
+            silent: true
+        }
+    );
+
+    /**
+     * @readOnly
+     */
+    this.group = new Group();
+
+    // FIXME Not use a seperate text group?
+    var dumbGroup = new Group({
+        position: opt.position.slice(),
+        rotation: opt.rotation
+    });
+
+    // this.group.add(dumbGroup);
+    // this._dumbGroup = dumbGroup;
+
+    dumbGroup.updateTransform();
+    this._transform = dumbGroup.transform;
+
+    this._dumbGroup = dumbGroup;
+};
+
+AxisBuilder.prototype = {
+
+    constructor: AxisBuilder,
+
+    hasBuilder: function (name) {
+        return !!builders[name];
+    },
+
+    add: function (name) {
+        builders[name].call(this);
+    },
+
+    getGroup: function () {
+        return this.group;
+    }
+
+};
+
+var builders = {
+
+    /**
+     * @private
+     */
+    axisLine: function () {
+        var opt = this.opt;
+        var axisModel = this.axisModel;
+
+        if (!axisModel.get('axisLine.show')) {
+            return;
+        }
+
+        var extent = this.axisModel.axis.getExtent();
+
+        var matrix = this._transform;
+        var pt1 = [extent[0], 0];
+        var pt2 = [extent[1], 0];
+        if (matrix) {
+            applyTransform(pt1, pt1, matrix);
+            applyTransform(pt2, pt2, matrix);
+        }
+
+        var lineStyle = extend(
+            {
+                lineCap: 'round'
+            },
+            axisModel.getModel('axisLine.lineStyle').getLineStyle()
+        );
+
+        this.group.add(new Line(subPixelOptimizeLine({
+            // Id for animation
+            anid: 'line',
+
+            shape: {
+                x1: pt1[0],
+                y1: pt1[1],
+                x2: pt2[0],
+                y2: pt2[1]
+            },
+            style: lineStyle,
+            strokeContainThreshold: opt.strokeContainThreshold || 5,
+            silent: true,
+            z2: 1
+        })));
+
+        var arrows = axisModel.get('axisLine.symbol');
+        var arrowSize = axisModel.get('axisLine.symbolSize');
+
+        var arrowOffset = axisModel.get('axisLine.symbolOffset') || 0;
+        if (typeof arrowOffset === 'number') {
+            arrowOffset = [arrowOffset, arrowOffset];
+        }
+
+        if (arrows != null) {
+            if (typeof arrows === 'string') {
+                // Use the same arrow for start and end point
+                arrows = [arrows, arrows];
+            }
+            if (typeof arrowSize === 'string'
+                || typeof arrowSize === 'number'
+            ) {
+                // Use the same size for width and height
+                arrowSize = [arrowSize, arrowSize];
+            }
+
+            var symbolWidth = arrowSize[0];
+            var symbolHeight = arrowSize[1];
+
+            each$1([{
+                rotate: opt.rotation + Math.PI / 2,
+                offset: arrowOffset[0],
+                r: 0
+            }, {
+                rotate: opt.rotation - Math.PI / 2,
+                offset: arrowOffset[1],
+                r: Math.sqrt((pt1[0] - pt2[0]) * (pt1[0] - pt2[0])
+                    + (pt1[1] - pt2[1]) * (pt1[1] - pt2[1]))
+            }], function (point, index) {
+                if (arrows[index] !== 'none' && arrows[index] != null) {
+                    var symbol = createSymbol(
+                        arrows[index],
+                        -symbolWidth / 2,
+                        -symbolHeight / 2,
+                        symbolWidth,
+                        symbolHeight,
+                        lineStyle.stroke,
+                        true
+                    );
+
+                    // Calculate arrow position with offset
+                    var r = point.r + point.offset;
+                    var pos = [
+                        pt1[0] + r * Math.cos(opt.rotation),
+                        pt1[1] - r * Math.sin(opt.rotation)
+                    ];
+
+                    symbol.attr({
+                        rotation: point.rotate,
+                        position: pos,
+                        silent: true
+                    });
+                    this.group.add(symbol);
+                }
+            }, this);
+        }
+    },
+
+    /**
+     * @private
+     */
+    axisTickLabel: function () {
+        var axisModel = this.axisModel;
+        var opt = this.opt;
+
+        var tickEls = buildAxisTick(this, axisModel, opt);
+        var labelEls = buildAxisLabel(this, axisModel, opt);
+
+        fixMinMaxLabelShow(axisModel, labelEls, tickEls);
+    },
+
+    /**
+     * @private
+     */
+    axisName: function () {
+        var opt = this.opt;
+        var axisModel = this.axisModel;
+        var name = retrieve(opt.axisName, axisModel.get('name'));
+
+        if (!name) {
+            return;
+        }
+
+        var nameLocation = axisModel.get('nameLocation');
+        var nameDirection = opt.nameDirection;
+        var textStyleModel = axisModel.getModel('nameTextStyle');
+        var gap = axisModel.get('nameGap') || 0;
+
+        var extent = this.axisModel.axis.getExtent();
+        var gapSignal = extent[0] > extent[1] ? -1 : 1;
+        var pos = [
+            nameLocation === 'start'
+                ? extent[0] - gapSignal * gap
+                : nameLocation === 'end'
+                ? extent[1] + gapSignal * gap
+                : (extent[0] + extent[1]) / 2, // 'middle'
+            // Reuse labelOffset.
+            isNameLocationCenter(nameLocation) ? opt.labelOffset + nameDirection * gap : 0
+        ];
+
+        var labelLayout;
+
+        var nameRotation = axisModel.get('nameRotate');
+        if (nameRotation != null) {
+            nameRotation = nameRotation * PI$2 / 180; // To radian.
+        }
+
+        var axisNameAvailableWidth;
+
+        if (isNameLocationCenter(nameLocation)) {
+            labelLayout = innerTextLayout(
+                opt.rotation,
+                nameRotation != null ? nameRotation : opt.rotation, // Adapt to axis.
+                nameDirection
+            );
+        }
+        else {
+            labelLayout = endTextLayout(
+                opt, nameLocation, nameRotation || 0, extent
+            );
+
+            axisNameAvailableWidth = opt.axisNameAvailableWidth;
+            if (axisNameAvailableWidth != null) {
+                axisNameAvailableWidth = Math.abs(
+                    axisNameAvailableWidth / Math.sin(labelLayout.rotation)
+                );
+                !isFinite(axisNameAvailableWidth) && (axisNameAvailableWidth = null);
+            }
+        }
+
+        var textFont = textStyleModel.getFont();
+
+        var truncateOpt = axisModel.get('nameTruncate', true) || {};
+        var ellipsis = truncateOpt.ellipsis;
+        var maxWidth = retrieve(
+            opt.nameTruncateMaxWidth, truncateOpt.maxWidth, axisNameAvailableWidth
+        );
+        // FIXME
+        // truncate rich text? (consider performance)
+        var truncatedText = (ellipsis != null && maxWidth != null)
+            ? truncateText$1(
+                name, maxWidth, textFont, ellipsis,
+                {minChar: 2, placeholder: truncateOpt.placeholder}
+            )
+            : name;
+
+        var tooltipOpt = axisModel.get('tooltip', true);
+
+        var mainType = axisModel.mainType;
+        var formatterParams = {
+            componentType: mainType,
+            name: name,
+            $vars: ['name']
+        };
+        formatterParams[mainType + 'Index'] = axisModel.componentIndex;
+
+        var textEl = new Text({
+            // Id for animation
+            anid: 'name',
+
+            __fullText: name,
+            __truncatedText: truncatedText,
+
+            position: pos,
+            rotation: labelLayout.rotation,
+            silent: isSilent(axisModel),
+            z2: 1,
+            tooltip: (tooltipOpt && tooltipOpt.show)
+                ? extend({
+                    content: name,
+                    formatter: function () {
+                        return name;
+                    },
+                    formatterParams: formatterParams
+                }, tooltipOpt)
+                : null
+        });
+
+        setTextStyle(textEl.style, textStyleModel, {
+            text: truncatedText,
+            textFont: textFont,
+            textFill: textStyleModel.getTextColor()
+                || axisModel.get('axisLine.lineStyle.color'),
+            textAlign: labelLayout.textAlign,
+            textVerticalAlign: labelLayout.textVerticalAlign
+        });
+
+        if (axisModel.get('triggerEvent')) {
+            textEl.eventData = makeAxisEventDataBase(axisModel);
+            textEl.eventData.targetType = 'axisName';
+            textEl.eventData.name = name;
+        }
+
+        // FIXME
+        this._dumbGroup.add(textEl);
+        textEl.updateTransform();
+
+        this.group.add(textEl);
+
+        textEl.decomposeTransform();
+    }
+
+};
+
+/**
+ * @public
+ * @static
+ * @param {Object} opt
+ * @param {number} axisRotation in radian
+ * @param {number} textRotation in radian
+ * @param {number} direction
+ * @return {Object} {
+ *  rotation, // according to axis
+ *  textAlign,
+ *  textVerticalAlign
+ * }
+ */
+var innerTextLayout = AxisBuilder.innerTextLayout = function (axisRotation, textRotation, direction) {
+    var rotationDiff = remRadian(textRotation - axisRotation);
+    var textAlign;
+    var textVerticalAlign;
+
+    if (isRadianAroundZero(rotationDiff)) { // Label is parallel with axis line.
+        textVerticalAlign = direction > 0 ? 'top' : 'bottom';
+        textAlign = 'center';
+    }
+    else if (isRadianAroundZero(rotationDiff - PI$2)) { // Label is inverse parallel with axis line.
+        textVerticalAlign = direction > 0 ? 'bottom' : 'top';
+        textAlign = 'center';
+    }
+    else {
+        textVerticalAlign = 'middle';
+
+        if (rotationDiff > 0 && rotationDiff < PI$2) {
+            textAlign = direction > 0 ? 'right' : 'left';
+        }
+        else {
+            textAlign = direction > 0 ? 'left' : 'right';
+        }
+    }
+
+    return {
+        rotation: rotationDiff,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+};
+
+function endTextLayout(opt, textPosition, textRotate, extent) {
+    var rotationDiff = remRadian(textRotate - opt.rotation);
+    var textAlign;
+    var textVerticalAlign;
+    var inverse = extent[0] > extent[1];
+    var onLeft = (textPosition === 'start' && !inverse)
+        || (textPosition !== 'start' && inverse);
+
+    if (isRadianAroundZero(rotationDiff - PI$2 / 2)) {
+        textVerticalAlign = onLeft ? 'bottom' : 'top';
+        textAlign = 'center';
+    }
+    else if (isRadianAroundZero(rotationDiff - PI$2 * 1.5)) {
+        textVerticalAlign = onLeft ? 'top' : 'bottom';
+        textAlign = 'center';
+    }
+    else {
+        textVerticalAlign = 'middle';
+        if (rotationDiff < PI$2 * 1.5 && rotationDiff > PI$2 / 2) {
+            textAlign = onLeft ? 'left' : 'right';
+        }
+        else {
+            textAlign = onLeft ? 'right' : 'left';
+        }
+    }
+
+    return {
+        rotation: rotationDiff,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+}
+
+function isSilent(axisModel) {
+    var tooltipOpt = axisModel.get('tooltip');
+    return axisModel.get('silent')
+        // Consider mouse cursor, add these restrictions.
+        || !(
+            axisModel.get('triggerEvent') || (tooltipOpt && tooltipOpt.show)
+        );
+}
+
+function fixMinMaxLabelShow(axisModel, labelEls, tickEls) {
+    // If min or max are user set, we need to check
+    // If the tick on min(max) are overlap on their neighbour tick
+    // If they are overlapped, we need to hide the min(max) tick label
+    var showMinLabel = axisModel.get('axisLabel.showMinLabel');
+    var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');
+
+    // FIXME
+    // Have not consider onBand yet, where tick els is more than label els.
+
+    labelEls = labelEls || [];
+    tickEls = tickEls || [];
+
+    var firstLabel = labelEls[0];
+    var nextLabel = labelEls[1];
+    var lastLabel = labelEls[labelEls.length - 1];
+    var prevLabel = labelEls[labelEls.length - 2];
+
+    var firstTick = tickEls[0];
+    var nextTick = tickEls[1];
+    var lastTick = tickEls[tickEls.length - 1];
+    var prevTick = tickEls[tickEls.length - 2];
+
+    if (showMinLabel === false) {
+        ignoreEl(firstLabel);
+        ignoreEl(firstTick);
+    }
+    else if (isTwoLabelOverlapped(firstLabel, nextLabel)) {
+        if (showMinLabel) {
+            ignoreEl(nextLabel);
+            ignoreEl(nextTick);
+        }
+        else {
+            ignoreEl(firstLabel);
+            ignoreEl(firstTick);
+        }
+    }
+
+    if (showMaxLabel === false) {
+        ignoreEl(lastLabel);
+        ignoreEl(lastTick);
+    }
+    else if (isTwoLabelOverlapped(prevLabel, lastLabel)) {
+        if (showMaxLabel) {
+            ignoreEl(prevLabel);
+            ignoreEl(prevTick);
+        }
+        else {
+            ignoreEl(lastLabel);
+            ignoreEl(lastTick);
+        }
+    }
+}
+
+function ignoreEl(el) {
+    el && (el.ignore = true);
+}
+
+function isTwoLabelOverlapped(current, next, labelLayout) {
+    // current and next has the same rotation.
+    var firstRect = current && current.getBoundingRect().clone();
+    var nextRect = next && next.getBoundingRect().clone();
+
+    if (!firstRect || !nextRect) {
+        return;
+    }
+
+    // When checking intersect of two rotated labels, we use mRotationBack
+    // to avoid that boundingRect is enlarge when using `boundingRect.applyTransform`.
+    var mRotationBack = identity([]);
+    rotate(mRotationBack, mRotationBack, -current.rotation);
+
+    firstRect.applyTransform(mul$1([], mRotationBack, current.getLocalTransform()));
+    nextRect.applyTransform(mul$1([], mRotationBack, next.getLocalTransform()));
+
+    return firstRect.intersect(nextRect);
+}
+
+function isNameLocationCenter(nameLocation) {
+    return nameLocation === 'middle' || nameLocation === 'center';
+}
+
+function buildAxisTick(axisBuilder, axisModel, opt) {
+    var axis = axisModel.axis;
+
+    if (!axisModel.get('axisTick.show') || axis.scale.isBlank()) {
+        return;
+    }
+
+    var tickModel = axisModel.getModel('axisTick');
+
+    var lineStyleModel = tickModel.getModel('lineStyle');
+    var tickLen = tickModel.get('length');
+
+    var ticksCoords = axis.getTicksCoords();
+
+    var pt1 = [];
+    var pt2 = [];
+    var matrix = axisBuilder._transform;
+
+    var tickEls = [];
+
+    for (var i = 0; i < ticksCoords.length; i++) {
+        var tickCoord = ticksCoords[i].coord;
+
+        pt1[0] = tickCoord;
+        pt1[1] = 0;
+        pt2[0] = tickCoord;
+        pt2[1] = opt.tickDirection * tickLen;
+
+        if (matrix) {
+            applyTransform(pt1, pt1, matrix);
+            applyTransform(pt2, pt2, matrix);
+        }
+        // Tick line, Not use group transform to have better line draw
+        var tickEl = new Line(subPixelOptimizeLine({
+            // Id for animation
+            anid: 'tick_' + ticksCoords[i].tickValue,
+
+            shape: {
+                x1: pt1[0],
+                y1: pt1[1],
+                x2: pt2[0],
+                y2: pt2[1]
+            },
+            style: defaults(
+                lineStyleModel.getLineStyle(),
+                {
+                    stroke: axisModel.get('axisLine.lineStyle.color')
+                }
+            ),
+            z2: 2,
+            silent: true
+        }));
+        axisBuilder.group.add(tickEl);
+        tickEls.push(tickEl);
+    }
+
+    return tickEls;
+}
+
+function buildAxisLabel(axisBuilder, axisModel, opt) {
+    var axis = axisModel.axis;
+    var show = retrieve(opt.axisLabelShow, axisModel.get('axisLabel.show'));
+
+    if (!show || axis.scale.isBlank()) {
+        return;
+    }
+
+    var labelModel = axisModel.getModel('axisLabel');
+    var labelMargin = labelModel.get('margin');
+    var labels = axis.getViewLabels();
+
+    // Special label rotate.
+    var labelRotation = (
+        retrieve(opt.labelRotate, labelModel.get('rotate')) || 0
+    ) * PI$2 / 180;
+
+    var labelLayout = innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
+    var rawCategoryData = axisModel.getCategories(true);
+
+    var labelEls = [];
+    var silent = isSilent(axisModel);
+    var triggerEvent = axisModel.get('triggerEvent');
+
+    each$1(labels, function (labelItem, index) {
+        var tickValue = labelItem.tickValue;
+        var formattedLabel = labelItem.formattedLabel;
+        var rawLabel = labelItem.rawLabel;
+
+        var itemLabelModel = labelModel;
+        if (rawCategoryData && rawCategoryData[tickValue] && rawCategoryData[tickValue].textStyle) {
+            itemLabelModel = new Model(
+                rawCategoryData[tickValue].textStyle, labelModel, axisModel.ecModel
+            );
+        }
+
+        var textColor = itemLabelModel.getTextColor()
+            || axisModel.get('axisLine.lineStyle.color');
+
+        var tickCoord = axis.dataToCoord(tickValue);
+        var pos = [
+            tickCoord,
+            opt.labelOffset + opt.labelDirection * labelMargin
+        ];
+
+        var textEl = new Text({
+            // Id for animation
+            anid: 'label_' + tickValue,
+            position: pos,
+            rotation: labelLayout.rotation,
+            silent: silent,
+            z2: 10
+        });
+
+        setTextStyle(textEl.style, itemLabelModel, {
+            text: formattedLabel,
+            textAlign: itemLabelModel.getShallow('align', true)
+                || labelLayout.textAlign,
+            textVerticalAlign: itemLabelModel.getShallow('verticalAlign', true)
+                || itemLabelModel.getShallow('baseline', true)
+                || labelLayout.textVerticalAlign,
+            textFill: typeof textColor === 'function'
+                ? textColor(
+                    // (1) In category axis with data zoom, tick is not the original
+                    // index of axis.data. So tick should not be exposed to user
+                    // in category axis.
+                    // (2) Compatible with previous version, which always use formatted label as
+                    // input. But in interval scale the formatted label is like '223,445', which
+                    // maked user repalce ','. So we modify it to return original val but remain
+                    // it as 'string' to avoid error in replacing.
+                    axis.type === 'category'
+                        ? rawLabel
+                        : axis.type === 'value'
+                        ? tickValue + ''
+                        : tickValue,
+                    index
+                )
+                : textColor
+        });
+
+        // Pack data for mouse event
+        if (triggerEvent) {
+            textEl.eventData = makeAxisEventDataBase(axisModel);
+            textEl.eventData.targetType = 'axisLabel';
+            textEl.eventData.value = rawLabel;
+        }
+
+        // FIXME
+        axisBuilder._dumbGroup.add(textEl);
+        textEl.updateTransform();
+
+        labelEls.push(textEl);
+        axisBuilder.group.add(textEl);
+
+        textEl.decomposeTransform();
+
+    });
+
+    return labelEls;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$6 = each$1;
+var curry$1 = curry;
+
+// Build axisPointerModel, mergin tooltip.axisPointer model for each axis.
+// allAxesInfo should be updated when setOption performed.
+function collect(ecModel, api) {
+    var result = {
+        /**
+         * key: makeKey(axis.model)
+         * value: {
+         *      axis,
+         *      coordSys,
+         *      axisPointerModel,
+         *      triggerTooltip,
+         *      involveSeries,
+         *      snap,
+         *      seriesModels,
+         *      seriesDataCount
+         * }
+         */
+        axesInfo: {},
+        seriesInvolved: false,
+        /**
+         * key: makeKey(coordSys.model)
+         * value: Object: key makeKey(axis.model), value: axisInfo
+         */
+        coordSysAxesInfo: {},
+        coordSysMap: {}
+    };
+
+    collectAxesInfo(result, ecModel, api);
+
+    // Check seriesInvolved for performance, in case too many series in some chart.
+    result.seriesInvolved && collectSeriesInfo(result, ecModel);
+
+    return result;
+}
+
+function collectAxesInfo(result, ecModel, api) {
+    var globalTooltipModel = ecModel.getComponent('tooltip');
+    var globalAxisPointerModel = ecModel.getComponent('axisPointer');
+    // links can only be set on global.
+    var linksOption = globalAxisPointerModel.get('link', true) || [];
+    var linkGroups = [];
+
+    // Collect axes info.
+    each$6(api.getCoordinateSystems(), function (coordSys) {
+        // Some coordinate system do not support axes, like geo.
+        if (!coordSys.axisPointerEnabled) {
+            return;
+        }
+
+        var coordSysKey = makeKey(coordSys.model);
+        var axesInfoInCoordSys = result.coordSysAxesInfo[coordSysKey] = {};
+        result.coordSysMap[coordSysKey] = coordSys;
+
+        // Set tooltip (like 'cross') is a convienent way to show axisPointer
+        // for user. So we enable seting tooltip on coordSys model.
+        var coordSysModel = coordSys.model;
+        var baseTooltipModel = coordSysModel.getModel('tooltip', globalTooltipModel);
+
+        each$6(coordSys.getAxes(), curry$1(saveTooltipAxisInfo, false, null));
+
+        // If axis tooltip used, choose tooltip axis for each coordSys.
+        // Notice this case: coordSys is `grid` but not `cartesian2D` here.
+        if (coordSys.getTooltipAxes
+            && globalTooltipModel
+            // If tooltip.showContent is set as false, tooltip will not
+            // show but axisPointer will show as normal.
+            && baseTooltipModel.get('show')
+        ) {
+            // Compatible with previous logic. But series.tooltip.trigger: 'axis'
+            // or series.data[n].tooltip.trigger: 'axis' are not support any more.
+            var triggerAxis = baseTooltipModel.get('trigger') === 'axis';
+            var cross = baseTooltipModel.get('axisPointer.type') === 'cross';
+            var tooltipAxes = coordSys.getTooltipAxes(baseTooltipModel.get('axisPointer.axis'));
+            if (triggerAxis || cross) {
+                each$6(tooltipAxes.baseAxes, curry$1(
+                    saveTooltipAxisInfo, cross ? 'cross' : true, triggerAxis
+                ));
+            }
+            if (cross) {
+                each$6(tooltipAxes.otherAxes, curry$1(saveTooltipAxisInfo, 'cross', false));
+            }
+        }
+
+        // fromTooltip: true | false | 'cross'
+        // triggerTooltip: true | false | null
+        function saveTooltipAxisInfo(fromTooltip, triggerTooltip, axis) {
+            var axisPointerModel = axis.model.getModel('axisPointer', globalAxisPointerModel);
+
+            var axisPointerShow = axisPointerModel.get('show');
+            if (!axisPointerShow || (
+                axisPointerShow === 'auto'
+                && !fromTooltip
+                && !isHandleTrigger(axisPointerModel)
+            )) {
+                return;
+            }
+
+            if (triggerTooltip == null) {
+                triggerTooltip = axisPointerModel.get('triggerTooltip');
+            }
+
+            axisPointerModel = fromTooltip
+                ? makeAxisPointerModel(
+                    axis, baseTooltipModel, globalAxisPointerModel, ecModel,
+                    fromTooltip, triggerTooltip
+                )
+                : axisPointerModel;
+
+            var snap = axisPointerModel.get('snap');
+            var key = makeKey(axis.model);
+            var involveSeries = triggerTooltip || snap || axis.type === 'category';
+
+            // If result.axesInfo[key] exist, override it (tooltip has higher priority).
+            var axisInfo = result.axesInfo[key] = {
+                key: key,
+                axis: axis,
+                coordSys: coordSys,
+                axisPointerModel: axisPointerModel,
+                triggerTooltip: triggerTooltip,
+                involveSeries: involveSeries,
+                snap: snap,
+                useHandle: isHandleTrigger(axisPointerModel),
+                seriesModels: []
+            };
+            axesInfoInCoordSys[key] = axisInfo;
+            result.seriesInvolved |= involveSeries;
+
+            var groupIndex = getLinkGroupIndex(linksOption, axis);
+            if (groupIndex != null) {
+                var linkGroup = linkGroups[groupIndex] || (linkGroups[groupIndex] = {axesInfo: {}});
+                linkGroup.axesInfo[key] = axisInfo;
+                linkGroup.mapper = linksOption[groupIndex].mapper;
+                axisInfo.linkGroup = linkGroup;
+            }
+        }
+    });
+}
+
+function makeAxisPointerModel(
+    axis, baseTooltipModel, globalAxisPointerModel, ecModel, fromTooltip, triggerTooltip
+) {
+    var tooltipAxisPointerModel = baseTooltipModel.getModel('axisPointer');
+    var volatileOption = {};
+
+    each$6(
+        [
+            'type', 'snap', 'lineStyle', 'shadowStyle', 'label',
+            'animation', 'animationDurationUpdate', 'animationEasingUpdate', 'z'
+        ],
+        function (field) {
+            volatileOption[field] = clone(tooltipAxisPointerModel.get(field));
+        }
+    );
+
+    // category axis do not auto snap, otherwise some tick that do not
+    // has value can not be hovered. value/time/log axis default snap if
+    // triggered from tooltip and trigger tooltip.
+    volatileOption.snap = axis.type !== 'category' && !!triggerTooltip;
+
+    // Compatibel with previous behavior, tooltip axis do not show label by default.
+    // Only these properties can be overrided from tooltip to axisPointer.
+    if (tooltipAxisPointerModel.get('type') === 'cross') {
+        volatileOption.type = 'line';
+    }
+    var labelOption = volatileOption.label || (volatileOption.label = {});
+    // Follow the convention, do not show label when triggered by tooltip by default.
+    labelOption.show == null && (labelOption.show = false);
+
+    if (fromTooltip === 'cross') {
+        // When 'cross', both axes show labels.
+        var tooltipAxisPointerLabelShow = tooltipAxisPointerModel.get('label.show');
+        labelOption.show = tooltipAxisPointerLabelShow != null ? tooltipAxisPointerLabelShow : true;
+        // If triggerTooltip, this is a base axis, which should better not use cross style
+        // (cross style is dashed by default)
+        if (!triggerTooltip) {
+            var crossStyle = volatileOption.lineStyle = tooltipAxisPointerModel.get('crossStyle');
+            crossStyle && defaults(labelOption, crossStyle.textStyle);
+        }
+    }
+
+    return axis.model.getModel(
+        'axisPointer',
+        new Model(volatileOption, globalAxisPointerModel, ecModel)
+    );
+}
+
+function collectSeriesInfo(result, ecModel) {
+    // Prepare data for axis trigger
+    ecModel.eachSeries(function (seriesModel) {
+
+        // Notice this case: this coordSys is `cartesian2D` but not `grid`.
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesTooltipTrigger = seriesModel.get('tooltip.trigger', true);
+        var seriesTooltipShow = seriesModel.get('tooltip.show', true);
+        if (!coordSys
+            || seriesTooltipTrigger === 'none'
+            || seriesTooltipTrigger === false
+            || seriesTooltipTrigger === 'item'
+            || seriesTooltipShow === false
+            || seriesModel.get('axisPointer.show', true) === false
+        ) {
+            return;
+        }
+
+        each$6(result.coordSysAxesInfo[makeKey(coordSys.model)], function (axisInfo) {
+            var axis = axisInfo.axis;
+            if (coordSys.getAxis(axis.dim) === axis) {
+                axisInfo.seriesModels.push(seriesModel);
+                axisInfo.seriesDataCount == null && (axisInfo.seriesDataCount = 0);
+                axisInfo.seriesDataCount += seriesModel.getData().count();
+            }
+        });
+
+    }, this);
+}
+
+/**
+ * For example:
+ * {
+ *     axisPointer: {
+ *         links: [{
+ *             xAxisIndex: [2, 4],
+ *             yAxisIndex: 'all'
+ *         }, {
+ *             xAxisId: ['a5', 'a7'],
+ *             xAxisName: 'xxx'
+ *         }]
+ *     }
+ * }
+ */
+function getLinkGroupIndex(linksOption, axis) {
+    var axisModel = axis.model;
+    var dim = axis.dim;
+    for (var i = 0; i < linksOption.length; i++) {
+        var linkOption = linksOption[i] || {};
+        if (checkPropInLink(linkOption[dim + 'AxisId'], axisModel.id)
+            || checkPropInLink(linkOption[dim + 'AxisIndex'], axisModel.componentIndex)
+            || checkPropInLink(linkOption[dim + 'AxisName'], axisModel.name)
+        ) {
+            return i;
+        }
+    }
+}
+
+function checkPropInLink(linkPropValue, axisPropValue) {
+    return linkPropValue === 'all'
+        || (isArray(linkPropValue) && indexOf(linkPropValue, axisPropValue) >= 0)
+        || linkPropValue === axisPropValue;
+}
+
+function fixValue(axisModel) {
+    var axisInfo = getAxisInfo(axisModel);
+    if (!axisInfo) {
+        return;
+    }
+
+    var axisPointerModel = axisInfo.axisPointerModel;
+    var scale = axisInfo.axis.scale;
+    var option = axisPointerModel.option;
+    var status = axisPointerModel.get('status');
+    var value = axisPointerModel.get('value');
+
+    // Parse init value for category and time axis.
+    if (value != null) {
+        value = scale.parse(value);
+    }
+
+    var useHandle = isHandleTrigger(axisPointerModel);
+    // If `handle` used, `axisPointer` will always be displayed, so value
+    // and status should be initialized.
+    if (status == null) {
+        option.status = useHandle ? 'show' : 'hide';
+    }
+
+    var extent = scale.getExtent().slice();
+    extent[0] > extent[1] && extent.reverse();
+
+    if (// Pick a value on axis when initializing.
+        value == null
+        // If both `handle` and `dataZoom` are used, value may be out of axis extent,
+        // where we should re-pick a value to keep `handle` displaying normally.
+        || value > extent[1]
+    ) {
+        // Make handle displayed on the end of the axis when init, which looks better.
+        value = extent[1];
+    }
+    if (value < extent[0]) {
+        value = extent[0];
+    }
+
+    option.value = value;
+
+    if (useHandle) {
+        option.status = axisInfo.axis.scale.isBlank() ? 'hide' : 'show';
+    }
+}
+
+function getAxisInfo(axisModel) {
+    var coordSysAxesInfo = (axisModel.ecModel.getComponent('axisPointer') || {}).coordSysAxesInfo;
+    return coordSysAxesInfo && coordSysAxesInfo.axesInfo[makeKey(axisModel)];
+}
+
+function getAxisPointerModel(axisModel) {
+    var axisInfo = getAxisInfo(axisModel);
+    return axisInfo && axisInfo.axisPointerModel;
+}
+
+function isHandleTrigger(axisPointerModel) {
+    return !!axisPointerModel.get('handle.show');
+}
+
+/**
+ * @param {module:echarts/model/Model} model
+ * @return {string} unique key
+ */
+function makeKey(model) {
+    return model.type + '||' + model.id;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Base class of AxisView.
+ */
+var AxisView = extendComponentView({
+
+    type: 'axis',
+
+    /**
+     * @private
+     */
+    _axisPointer: null,
+
+    /**
+     * @protected
+     * @type {string}
+     */
+    axisPointerClass: null,
+
+    /**
+     * @override
+     */
+    render: function (axisModel, ecModel, api, payload) {
+        // FIXME
+        // This process should proformed after coordinate systems updated
+        // (axis scale updated), and should be performed each time update.
+        // So put it here temporarily, although it is not appropriate to
+        // put a model-writing procedure in `view`.
+        this.axisPointerClass && fixValue(axisModel);
+
+        AxisView.superApply(this, 'render', arguments);
+
+        updateAxisPointer(this, axisModel, ecModel, api, payload, true);
+    },
+
+    /**
+     * Action handler.
+     * @public
+     * @param {module:echarts/coord/cartesian/AxisModel} axisModel
+     * @param {module:echarts/model/Global} ecModel
+     * @param {module:echarts/ExtensionAPI} api
+     * @param {Object} payload
+     */
+    updateAxisPointer: function (axisModel, ecModel, api, payload, force) {
+        updateAxisPointer(this, axisModel, ecModel, api, payload, false);
+    },
+
+    /**
+     * @override
+     */
+    remove: function (ecModel, api) {
+        var axisPointer = this._axisPointer;
+        axisPointer && axisPointer.remove(api);
+        AxisView.superApply(this, 'remove', arguments);
+    },
+
+    /**
+     * @override
+     */
+    dispose: function (ecModel, api) {
+        disposeAxisPointer(this, api);
+        AxisView.superApply(this, 'dispose', arguments);
+    }
+
+});
+
+function updateAxisPointer(axisView, axisModel, ecModel, api, payload, forceRender) {
+    var Clazz = AxisView.getAxisPointerClass(axisView.axisPointerClass);
+    if (!Clazz) {
+        return;
+    }
+    var axisPointerModel = getAxisPointerModel(axisModel);
+    axisPointerModel
+        ? (axisView._axisPointer || (axisView._axisPointer = new Clazz()))
+            .render(axisModel, axisPointerModel, api, forceRender)
+        : disposeAxisPointer(axisView, api);
+}
+
+function disposeAxisPointer(axisView, ecModel, api) {
+    var axisPointer = axisView._axisPointer;
+    axisPointer && axisPointer.dispose(ecModel, api);
+    axisView._axisPointer = null;
+}
+
+var axisPointerClazz = [];
+
+AxisView.registerAxisPointerClass = function (type, clazz) {
+    if (__DEV__) {
+        if (axisPointerClazz[type]) {
+            throw new Error('axisPointer ' + type + ' exists');
+        }
+    }
+    axisPointerClazz[type] = clazz;
+};
+
+AxisView.getAxisPointerClass = function (type) {
+    return type && axisPointerClazz[type];
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Can only be called after coordinate system creation stage.
+ * (Can be called before coordinate system update stage).
+ *
+ * @param {Object} opt {labelInside}
+ * @return {Object} {
+ *  position, rotation, labelDirection, labelOffset,
+ *  tickDirection, labelRotate, z2
+ * }
+ */
+function layout$1(gridModel, axisModel, opt) {
+    opt = opt || {};
+    var grid = gridModel.coordinateSystem;
+    var axis = axisModel.axis;
+    var layout = {};
+    var otherAxisOnZeroOf = axis.getAxesOnZeroOf()[0];
+
+    var rawAxisPosition = axis.position;
+    var axisPosition = otherAxisOnZeroOf ? 'onZero' : rawAxisPosition;
+    var axisDim = axis.dim;
+
+    var rect = grid.getRect();
+    var rectBound = [rect.x, rect.x + rect.width, rect.y, rect.y + rect.height];
+    var idx = {left: 0, right: 1, top: 0, bottom: 1, onZero: 2};
+    var axisOffset = axisModel.get('offset') || 0;
+
+    var posBound = axisDim === 'x'
+        ? [rectBound[2] - axisOffset, rectBound[3] + axisOffset]
+        : [rectBound[0] - axisOffset, rectBound[1] + axisOffset];
+
+    if (otherAxisOnZeroOf) {
+        var onZeroCoord = otherAxisOnZeroOf.toGlobalCoord(otherAxisOnZeroOf.dataToCoord(0));
+        posBound[idx['onZero']] = Math.max(Math.min(onZeroCoord, posBound[1]), posBound[0]);
+    }
+
+    // Axis position
+    layout.position = [
+        axisDim === 'y' ? posBound[idx[axisPosition]] : rectBound[0],
+        axisDim === 'x' ? posBound[idx[axisPosition]] : rectBound[3]
+    ];
+
+    // Axis rotation
+    layout.rotation = Math.PI / 2 * (axisDim === 'x' ? 0 : 1);
+
+    // Tick and label direction, x y is axisDim
+    var dirMap = {top: -1, bottom: 1, left: -1, right: 1};
+
+    layout.labelDirection = layout.tickDirection = layout.nameDirection = dirMap[rawAxisPosition];
+    layout.labelOffset = otherAxisOnZeroOf ? posBound[idx[rawAxisPosition]] - posBound[idx['onZero']] : 0;
+
+    if (axisModel.get('axisTick.inside')) {
+        layout.tickDirection = -layout.tickDirection;
+    }
+    if (retrieve(opt.labelInside, axisModel.get('axisLabel.inside'))) {
+        layout.labelDirection = -layout.labelDirection;
+    }
+
+    // Special label rotation
+    var labelRotate = axisModel.get('axisLabel.rotate');
+    layout.labelRotate = axisPosition === 'top' ? -labelRotate : labelRotate;
+
+    // Over splitLine and splitArea
+    layout.z2 = 1;
+
+    return layout;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisBuilderAttrs = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+var selfBuilderAttrs = [
+    'splitArea', 'splitLine'
+];
+
+// function getAlignWithLabel(model, axisModel) {
+//     var alignWithLabel = model.get('alignWithLabel');
+//     if (alignWithLabel === 'auto') {
+//         alignWithLabel = axisModel.get('axisTick.alignWithLabel');
+//     }
+//     return alignWithLabel;
+// }
+
+var CartesianAxisView = AxisView.extend({
+
+    type: 'cartesianAxis',
+
+    axisPointerClass: 'CartesianAxisPointer',
+
+    /**
+     * @override
+     */
+    render: function (axisModel, ecModel, api, payload) {
+
+        this.group.removeAll();
+
+        var oldAxisGroup = this._axisGroup;
+        this._axisGroup = new Group();
+
+        this.group.add(this._axisGroup);
+
+        if (!axisModel.get('show')) {
+            return;
+        }
+
+        var gridModel = axisModel.getCoordSysModel();
+
+        var layout = layout$1(gridModel, axisModel);
+
+        var axisBuilder = new AxisBuilder(axisModel, layout);
+
+        each$1(axisBuilderAttrs, axisBuilder.add, axisBuilder);
+
+        this._axisGroup.add(axisBuilder.getGroup());
+
+        each$1(selfBuilderAttrs, function (name) {
+            if (axisModel.get(name + '.show')) {
+                this['_' + name](axisModel, gridModel);
+            }
+        }, this);
+
+        groupTransition(oldAxisGroup, this._axisGroup, axisModel);
+
+        CartesianAxisView.superCall(this, 'render', axisModel, ecModel, api, payload);
+    },
+
+    remove: function () {
+        this._splitAreaColors = null;
+    },
+
+    /**
+     * @param {module:echarts/coord/cartesian/AxisModel} axisModel
+     * @param {module:echarts/coord/cartesian/GridModel} gridModel
+     * @private
+     */
+    _splitLine: function (axisModel, gridModel) {
+        var axis = axisModel.axis;
+
+        if (axis.scale.isBlank()) {
+            return;
+        }
+
+        var splitLineModel = axisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineColors = lineStyleModel.get('color');
+
+        lineColors = isArray(lineColors) ? lineColors : [lineColors];
+
+        var gridRect = gridModel.coordinateSystem.getRect();
+        var isHorizontal = axis.isHorizontal();
+
+        var lineCount = 0;
+
+        var ticksCoords = axis.getTicksCoords({
+            tickModel: splitLineModel
+        });
+
+        var p1 = [];
+        var p2 = [];
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        var lineStyle = lineStyleModel.getLineStyle();
+        for (var i = 0; i < ticksCoords.length; i++) {
+            var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+            if (isHorizontal) {
+                p1[0] = tickCoord;
+                p1[1] = gridRect.y;
+                p2[0] = tickCoord;
+                p2[1] = gridRect.y + gridRect.height;
+            }
+            else {
+                p1[0] = gridRect.x;
+                p1[1] = tickCoord;
+                p2[0] = gridRect.x + gridRect.width;
+                p2[1] = tickCoord;
+            }
+
+            var colorIndex = (lineCount++) % lineColors.length;
+            var tickValue = ticksCoords[i].tickValue;
+            this._axisGroup.add(new Line(subPixelOptimizeLine({
+                anid: tickValue != null ? 'line_' + ticksCoords[i].tickValue : null,
+                shape: {
+                    x1: p1[0],
+                    y1: p1[1],
+                    x2: p2[0],
+                    y2: p2[1]
+                },
+                style: defaults({
+                    stroke: lineColors[colorIndex]
+                }, lineStyle),
+                silent: true
+            })));
+        }
+    },
+
+    /**
+     * @param {module:echarts/coord/cartesian/AxisModel} axisModel
+     * @param {module:echarts/coord/cartesian/GridModel} gridModel
+     * @private
+     */
+    _splitArea: function (axisModel, gridModel) {
+        var axis = axisModel.axis;
+
+        if (axis.scale.isBlank()) {
+            return;
+        }
+
+        var splitAreaModel = axisModel.getModel('splitArea');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+        var areaColors = areaStyleModel.get('color');
+
+        var gridRect = gridModel.coordinateSystem.getRect();
+
+        var ticksCoords = axis.getTicksCoords({
+            tickModel: splitAreaModel,
+            clamp: true
+        });
+
+        if (!ticksCoords.length) {
+            return;
+        }
+
+        // For Making appropriate splitArea animation, the color and anid
+        // should be corresponding to previous one if possible.
+        var areaColorsLen = areaColors.length;
+        var lastSplitAreaColors = this._splitAreaColors;
+        var newSplitAreaColors = createHashMap();
+        var colorIndex = 0;
+        if (lastSplitAreaColors) {
+            for (var i = 0; i < ticksCoords.length; i++) {
+                var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+                if (cIndex != null) {
+                    colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+                    break;
+                }
+            }
+        }
+
+        var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+        var areaStyle = areaStyleModel.getAreaStyle();
+        areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+        for (var i = 1; i < ticksCoords.length; i++) {
+            var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+            var x;
+            var y;
+            var width;
+            var height;
+            if (axis.isHorizontal()) {
+                x = prev;
+                y = gridRect.y;
+                width = tickCoord - x;
+                height = gridRect.height;
+                prev = x + width;
+            }
+            else {
+                x = gridRect.x;
+                y = prev;
+                width = gridRect.width;
+                height = tickCoord - y;
+                prev = y + height;
+            }
+
+            var tickValue = ticksCoords[i - 1].tickValue;
+            tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+            this._axisGroup.add(new Rect({
+                anid: tickValue != null ? 'area_' + tickValue : null,
+                shape: {
+                    x: x,
+                    y: y,
+                    width: width,
+                    height: height
+                },
+                style: defaults({
+                    fill: areaColors[colorIndex]
+                }, areaStyle),
+                silent: true
+            }));
+
+            colorIndex = (colorIndex + 1) % areaColorsLen;
+        }
+
+        this._splitAreaColors = newSplitAreaColors;
+    }
+});
+
+CartesianAxisView.extend({
+    type: 'xAxis'
+});
+CartesianAxisView.extend({
+    type: 'yAxis'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Grid view
+extendComponentView({
+
+    type: 'grid',
+
+    render: function (gridModel, ecModel) {
+        this.group.removeAll();
+        if (gridModel.get('show')) {
+            this.group.add(new Rect({
+                shape: gridModel.coordinateSystem.getRect(),
+                style: defaults({
+                    fill: gridModel.get('backgroundColor')
+                }, gridModel.getItemStyle()),
+                silent: true,
+                z2: -1
+            }));
+        }
+    }
+
+});
+
+registerPreprocessor(function (option) {
+    // Only create grid when need
+    if (option.xAxis && option.yAxis && !option.grid) {
+        option.grid = {};
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// In case developer forget to include grid component
+registerVisual(visualSymbol('line', 'circle', 'line'));
+registerLayout(pointsLayout('line'));
+
+// Down sample after filter
+registerProcessor(
+    PRIORITY.PROCESSOR.STATISTIC,
+    dataSample('line')
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BaseBarSeries = SeriesModel.extend({
+
+    type: 'series.__base_bar__',
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    },
+
+    getMarkerPosition: function (value) {
+        var coordSys = this.coordinateSystem;
+        if (coordSys) {
+            // PENDING if clamp ?
+            var pt = coordSys.dataToPoint(coordSys.clampData(value));
+            var data = this.getData();
+            var offset = data.getLayout('offset');
+            var size = data.getLayout('size');
+            var offsetIndex = coordSys.getBaseAxis().isHorizontal() ? 0 : 1;
+            pt[offsetIndex] += offset + size / 2;
+            return pt;
+        }
+        return [NaN, NaN];
+    },
+
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+        // stack: null
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // 最小高度改为0
+        barMinHeight: 0,
+        // 最小角度为0，仅对极坐标系下的柱状图有效
+        barMinAngle: 0,
+        // cursor: null,
+
+        large: false,
+        largeThreshold: 400,
+        progressive: 3e3,
+        progressiveChunkMode: 'mod',
+
+        // barMaxWidth: null,
+        // 默认自适应
+        // barWidth: null,
+        // 柱间距离，默认为柱形宽度的30%，可设固定值
+        // barGap: '30%',
+        // 类目间柱形距离，默认为类目间距的20%，可设固定值
+        // barCategoryGap: '20%',
+        // label: {
+        //      show: false
+        // },
+        itemStyle: {},
+        emphasis: {}
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+BaseBarSeries.extend({
+
+    type: 'series.bar',
+
+    dependencies: ['grid', 'polar'],
+
+    brushSelector: 'rect',
+
+    /**
+     * @override
+     */
+    getProgressive: function () {
+        // Do not support progressive in normal mode.
+        return this.get('large')
+            ? this.get('progressive')
+            : false;
+    },
+
+    /**
+     * @override
+     */
+    getProgressiveThreshold: function () {
+        // Do not support progressive in normal mode.
+        var progressiveThreshold = this.get('progressiveThreshold');
+        var largeThreshold = this.get('largeThreshold');
+        if (largeThreshold > progressiveThreshold) {
+            progressiveThreshold = largeThreshold;
+        }
+        return progressiveThreshold;
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function setLabel(
+    normalStyle, hoverStyle, itemModel, color, seriesModel, dataIndex, labelPositionOutside
+) {
+    var labelModel = itemModel.getModel('label');
+    var hoverLabelModel = itemModel.getModel('emphasis.label');
+
+    setLabelStyle(
+        normalStyle, hoverStyle, labelModel, hoverLabelModel,
+        {
+            labelFetcher: seriesModel,
+            labelDataIndex: dataIndex,
+            defaultText: getDefaultLabel(seriesModel.getData(), dataIndex),
+            isRectText: true,
+            autoColor: color
+        }
+    );
+
+    fixPosition(normalStyle);
+    fixPosition(hoverStyle);
+}
+
+function fixPosition(style, labelPositionOutside) {
+    if (style.textPosition === 'outside') {
+        style.textPosition = labelPositionOutside;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getBarItemStyle = makeStyleMapper(
+    [
+        ['fill', 'color'],
+        ['stroke', 'borderColor'],
+        ['lineWidth', 'borderWidth'],
+        // Compatitable with 2
+        ['stroke', 'barBorderColor'],
+        ['lineWidth', 'barBorderWidth'],
+        ['opacity'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['shadowColor']
+    ]
+);
+
+var barItemStyle = {
+    getBarItemStyle: function (excludes) {
+        var style = getBarItemStyle(this, excludes);
+        if (this.getBorderLineDash) {
+            var lineDash = this.getBorderLineDash();
+            lineDash && (style.lineDash = lineDash);
+        }
+        return style;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BAR_BORDER_WIDTH_QUERY = ['itemStyle', 'barBorderWidth'];
+
+// FIXME
+// Just for compatible with ec2.
+extend(Model.prototype, barItemStyle);
+
+extendChartView({
+
+    type: 'bar',
+
+    render: function (seriesModel, ecModel, api) {
+        this._updateDrawMode(seriesModel);
+
+        var coordinateSystemType = seriesModel.get('coordinateSystem');
+
+        if (coordinateSystemType === 'cartesian2d'
+            || coordinateSystemType === 'polar'
+        ) {
+            this._isLargeDraw
+                ? this._renderLarge(seriesModel, ecModel, api)
+                : this._renderNormal(seriesModel, ecModel, api);
+        }
+        else if (__DEV__) {
+            console.warn('Only cartesian2d and polar supported for bar.');
+        }
+
+        return this.group;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this._clear();
+        this._updateDrawMode(seriesModel);
+    },
+
+    incrementalRender: function (params, seriesModel, ecModel, api) {
+        // Do not support progressive in normal mode.
+        this._incrementalRenderLarge(params, seriesModel);
+    },
+
+    _updateDrawMode: function (seriesModel) {
+        var isLargeDraw = seriesModel.pipelineContext.large;
+        if (this._isLargeDraw == null || isLargeDraw ^ this._isLargeDraw) {
+            this._isLargeDraw = isLargeDraw;
+            this._clear();
+        }
+    },
+
+    _renderNormal: function (seriesModel, ecModel, api) {
+        var group = this.group;
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        var coord = seriesModel.coordinateSystem;
+        var baseAxis = coord.getBaseAxis();
+        var isHorizontalOrRadial;
+
+        if (coord.type === 'cartesian2d') {
+            isHorizontalOrRadial = baseAxis.isHorizontal();
+        }
+        else if (coord.type === 'polar') {
+            isHorizontalOrRadial = baseAxis.dim === 'angle';
+        }
+
+        var animationModel = seriesModel.isAnimationEnabled() ? seriesModel : null;
+
+        data.diff(oldData)
+            .add(function (dataIndex) {
+                if (!data.hasValue(dataIndex)) {
+                    return;
+                }
+
+                var itemModel = data.getItemModel(dataIndex);
+                var layout = getLayout[coord.type](data, dataIndex, itemModel);
+                var el = elementCreator[coord.type](
+                    data, dataIndex, itemModel, layout, isHorizontalOrRadial, animationModel
+                );
+                data.setItemGraphicEl(dataIndex, el);
+                group.add(el);
+
+                updateStyle(
+                    el, data, dataIndex, itemModel, layout,
+                    seriesModel, isHorizontalOrRadial, coord.type === 'polar'
+                );
+            })
+            .update(function (newIndex, oldIndex) {
+                var el = oldData.getItemGraphicEl(oldIndex);
+
+                if (!data.hasValue(newIndex)) {
+                    group.remove(el);
+                    return;
+                }
+
+                var itemModel = data.getItemModel(newIndex);
+                var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+                if (el) {
+                    updateProps(el, {shape: layout}, animationModel, newIndex);
+                }
+                else {
+                    el = elementCreator[coord.type](
+                        data, newIndex, itemModel, layout, isHorizontalOrRadial, animationModel, true
+                    );
+                }
+
+                data.setItemGraphicEl(newIndex, el);
+                // Add back
+                group.add(el);
+
+                updateStyle(
+                    el, data, newIndex, itemModel, layout,
+                    seriesModel, isHorizontalOrRadial, coord.type === 'polar'
+                );
+            })
+            .remove(function (dataIndex) {
+                var el = oldData.getItemGraphicEl(dataIndex);
+                if (coord.type === 'cartesian2d') {
+                    el && removeRect(dataIndex, animationModel, el);
+                }
+                else {
+                    el && removeSector(dataIndex, animationModel, el);
+                }
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    _renderLarge: function (seriesModel, ecModel, api) {
+        this._clear();
+        createLarge(seriesModel, this.group);
+    },
+
+    _incrementalRenderLarge: function (params, seriesModel) {
+        createLarge(seriesModel, this.group, true);
+    },
+
+    dispose: noop,
+
+    remove: function (ecModel) {
+        this._clear(ecModel);
+    },
+
+    _clear: function (ecModel) {
+        var group = this.group;
+        var data = this._data;
+        if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+            data.eachItemGraphicEl(function (el) {
+                if (el.type === 'sector') {
+                    removeSector(el.dataIndex, ecModel, el);
+                }
+                else {
+                    removeRect(el.dataIndex, ecModel, el);
+                }
+            });
+        }
+        else {
+            group.removeAll();
+        }
+        this._data = null;
+    }
+
+});
+
+var elementCreator = {
+
+    cartesian2d: function (
+        data, dataIndex, itemModel, layout, isHorizontal,
+        animationModel, isUpdate
+    ) {
+        var rect = new Rect({shape: extend({}, layout)});
+
+        // Animation
+        if (animationModel) {
+            var rectShape = rect.shape;
+            var animateProperty = isHorizontal ? 'height' : 'width';
+            var animateTarget = {};
+            rectShape[animateProperty] = 0;
+            animateTarget[animateProperty] = layout[animateProperty];
+            graphic[isUpdate ? 'updateProps' : 'initProps'](rect, {
+                shape: animateTarget
+            }, animationModel, dataIndex);
+        }
+
+        return rect;
+    },
+
+    polar: function (
+        data, dataIndex, itemModel, layout, isRadial,
+        animationModel, isUpdate
+    ) {
+        // Keep the same logic with bar in catesion: use end value to control
+        // direction. Notice that if clockwise is true (by default), the sector
+        // will always draw clockwisely, no matter whether endAngle is greater
+        // or less than startAngle.
+        var clockwise = layout.startAngle < layout.endAngle;
+        var sector = new Sector({
+            shape: defaults({clockwise: clockwise}, layout)
+        });
+
+        // Animation
+        if (animationModel) {
+            var sectorShape = sector.shape;
+            var animateProperty = isRadial ? 'r' : 'endAngle';
+            var animateTarget = {};
+            sectorShape[animateProperty] = isRadial ? 0 : layout.startAngle;
+            animateTarget[animateProperty] = layout[animateProperty];
+            graphic[isUpdate ? 'updateProps' : 'initProps'](sector, {
+                shape: animateTarget
+            }, animationModel, dataIndex);
+        }
+
+        return sector;
+    }
+};
+
+function removeRect(dataIndex, animationModel, el) {
+    // Not show text when animating
+    el.style.text = null;
+    updateProps(el, {
+        shape: {
+            width: 0
+        }
+    }, animationModel, dataIndex, function () {
+        el.parent && el.parent.remove(el);
+    });
+}
+
+function removeSector(dataIndex, animationModel, el) {
+    // Not show text when animating
+    el.style.text = null;
+    updateProps(el, {
+        shape: {
+            r: el.shape.r0
+        }
+    }, animationModel, dataIndex, function () {
+        el.parent && el.parent.remove(el);
+    });
+}
+
+var getLayout = {
+    cartesian2d: function (data, dataIndex, itemModel) {
+        var layout = data.getItemLayout(dataIndex);
+        var fixedLineWidth = getLineWidth(itemModel, layout);
+
+        // fix layout with lineWidth
+        var signX = layout.width > 0 ? 1 : -1;
+        var signY = layout.height > 0 ? 1 : -1;
+        return {
+            x: layout.x + signX * fixedLineWidth / 2,
+            y: layout.y + signY * fixedLineWidth / 2,
+            width: layout.width - signX * fixedLineWidth,
+            height: layout.height - signY * fixedLineWidth
+        };
+    },
+
+    polar: function (data, dataIndex, itemModel) {
+        var layout = data.getItemLayout(dataIndex);
+        return {
+            cx: layout.cx,
+            cy: layout.cy,
+            r0: layout.r0,
+            r: layout.r,
+            startAngle: layout.startAngle,
+            endAngle: layout.endAngle
+        };
+    }
+};
+
+function updateStyle(
+    el, data, dataIndex, itemModel, layout, seriesModel, isHorizontal, isPolar
+) {
+    var color = data.getItemVisual(dataIndex, 'color');
+    var opacity = data.getItemVisual(dataIndex, 'opacity');
+    var itemStyleModel = itemModel.getModel('itemStyle');
+    var hoverStyle = itemModel.getModel('emphasis.itemStyle').getBarItemStyle();
+
+    if (!isPolar) {
+        el.setShape('r', itemStyleModel.get('barBorderRadius') || 0);
+    }
+
+    el.useStyle(defaults(
+        {
+            fill: color,
+            opacity: opacity
+        },
+        itemStyleModel.getBarItemStyle()
+    ));
+
+    var cursorStyle = itemModel.getShallow('cursor');
+    cursorStyle && el.attr('cursor', cursorStyle);
+
+    var labelPositionOutside = isHorizontal
+        ? (layout.height > 0 ? 'bottom' : 'top')
+        : (layout.width > 0 ? 'left' : 'right');
+
+    if (!isPolar) {
+        setLabel(
+            el.style, hoverStyle, itemModel, color,
+            seriesModel, dataIndex, labelPositionOutside
+        );
+    }
+
+    setHoverStyle(el, hoverStyle);
+}
+
+// In case width or height are too small.
+function getLineWidth(itemModel, rawLayout) {
+    var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
+    return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+}
+
+
+var LargePath = Path.extend({
+
+    type: 'largeBar',
+
+    shape: {points: []},
+
+    buildPath: function (ctx, shape) {
+        // Drawing lines is more efficient than drawing
+        // a whole line or drawing rects.
+        var points = shape.points;
+        var startPoint = this.__startPoint;
+        var valueIdx = this.__valueIdx;
+
+        for (var i = 0; i < points.length; i += 2) {
+            startPoint[this.__valueIdx] = points[i + valueIdx];
+            ctx.moveTo(startPoint[0], startPoint[1]);
+            ctx.lineTo(points[i], points[i + 1]);
+        }
+    }
+});
+
+function createLarge(seriesModel, group, incremental) {
+    // TODO support polar
+    var data = seriesModel.getData();
+    var startPoint = [];
+    var valueIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
+    startPoint[1 - valueIdx] = data.getLayout('valueAxisStart');
+
+    var el = new LargePath({
+        shape: {points: data.getLayout('largePoints')},
+        incremental: !!incremental,
+        __startPoint: startPoint,
+        __valueIdx: valueIdx
+    });
+    group.add(el);
+    setLargeStyle(el, seriesModel, data);
+}
+
+function setLargeStyle(el, seriesModel, data) {
+    var borderColor = data.getVisual('borderColor') || data.getVisual('color');
+    var itemStyle = seriesModel.getModel('itemStyle').getItemStyle(['color', 'borderColor']);
+
+    el.useStyle(itemStyle);
+    el.style.fill = null;
+    el.style.stroke = borderColor;
+    el.style.lineWidth = data.getLayout('barWidth');
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// In case developer forget to include grid component
+registerLayout(curry(layout, 'bar'));
+// Should after normal bar layout, otherwise it is blocked by normal bar layout.
+registerLayout(largeLayout);
+
+registerVisual({
+    seriesType: 'bar',
+    reset: function (seriesModel) {
+        // Visual coding for legend
+        seriesModel.getData().setVisual('legendSymbol', 'roundRect');
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+/**
+ * [Usage]:
+ * (1)
+ * createListSimply(seriesModel, ['value']);
+ * (2)
+ * createListSimply(seriesModel, {
+ *     coordDimensions: ['value'],
+ *     dimensionsCount: 5
+ * });
+ *
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {Object|Array.<string|Object>} opt opt or coordDimensions
+ *        The options in opt, see `echarts/data/helper/createDimensions`
+ * @param {Array.<string>} [nameList]
+ * @return {module:echarts/data/List}
+ */
+var createListSimply = function (seriesModel, opt, nameList) {
+    opt = isArray(opt) && {coordDimensions: opt} || extend({}, opt);
+
+    var source = seriesModel.getSource();
+
+    var dimensionsInfo = createDimensions(source, opt);
+
+    var list = new List(dimensionsInfo, seriesModel);
+    list.initData(source, nameList);
+
+    return list;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Data selectable mixin for chart series.
+ * To eanble data select, option of series must have `selectedMode`.
+ * And each data item will use `selected` to toggle itself selected status
+ */
+
+var selectableMixin = {
+
+    /**
+     * @param {Array.<Object>} targetList [{name, value, selected}, ...]
+     *        If targetList is an array, it should like [{name: ..., value: ...}, ...].
+     *        If targetList is a "List", it must have coordDim: 'value' dimension and name.
+     */
+    updateSelectedMap: function (targetList) {
+        this._targetList = isArray(targetList) ? targetList.slice() : [];
+
+        this._selectTargetMap = reduce(targetList || [], function (targetMap, target) {
+            targetMap.set(target.name, target);
+            return targetMap;
+        }, createHashMap());
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    // PENGING If selectedMode is null ?
+    select: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        var selectedMode = this.get('selectedMode');
+        if (selectedMode === 'single') {
+            this._selectTargetMap.each(function (target) {
+                target.selected = false;
+            });
+        }
+        target && (target.selected = true);
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    unSelect: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        // var selectedMode = this.get('selectedMode');
+        // selectedMode !== 'single' && target && (target.selected = false);
+        target && (target.selected = false);
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    toggleSelected: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        if (target != null) {
+            this[target.selected ? 'unSelect' : 'select'](name, id);
+            return target.selected;
+        }
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    isSelected: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        return target && target.selected;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PieSeries = extendSeriesModel({
+
+    type: 'series.pie',
+
+    // Overwrite
+    init: function (option) {
+        PieSeries.superApply(this, 'init', arguments);
+
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+
+        this.updateSelectedMap(this._createSelectableList());
+
+        this._defaultLabelLine(option);
+    },
+
+    // Overwrite
+    mergeOption: function (newOption) {
+        PieSeries.superCall(this, 'mergeOption', newOption);
+
+        this.updateSelectedMap(this._createSelectableList());
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListSimply(this, ['value']);
+    },
+
+    _createSelectableList: function () {
+        var data = this.getRawData();
+        var valueDim = data.mapDimension('value');
+        var targetList = [];
+        for (var i = 0, len = data.count(); i < len; i++) {
+            targetList.push({
+                name: data.getName(i),
+                value: data.get(valueDim, i),
+                selected: retrieveRawAttr(data, i, 'selected')
+            });
+        }
+        return targetList;
+    },
+
+    // Overwrite
+    getDataParams: function (dataIndex) {
+        var data = this.getData();
+        var params = PieSeries.superCall(this, 'getDataParams', dataIndex);
+        // FIXME toFixed?
+
+        var valueList = [];
+        data.each(data.mapDimension('value'), function (value) {
+            valueList.push(value);
+        });
+
+        params.percent = getPercentWithPrecision(
+            valueList,
+            dataIndex,
+            data.hostModel.get('percentPrecision')
+        );
+
+        params.$vars.push('percent');
+        return params;
+    },
+
+    _defaultLabelLine: function (option) {
+        // Extend labelLine emphasis
+        defaultEmphasis(option, 'labelLine', ['show']);
+
+        var labelLineNormalOpt = option.labelLine;
+        var labelLineEmphasisOpt = option.emphasis.labelLine;
+        // Not show label line if `label.normal.show = false`
+        labelLineNormalOpt.show = labelLineNormalOpt.show
+            && option.label.show;
+        labelLineEmphasisOpt.show = labelLineEmphasisOpt.show
+            && option.emphasis.label.show;
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // 默认全局居中
+        center: ['50%', '50%'],
+        radius: [0, '75%'],
+        // 默认顺时针
+        clockwise: true,
+        startAngle: 90,
+        // 最小角度改为0
+        minAngle: 0,
+        // 选中时扇区偏移量
+        selectedOffset: 10,
+        // 高亮扇区偏移量
+        hoverOffset: 10,
+
+        // If use strategy to avoid label overlapping
+        avoidLabelOverlap: true,
+        // 选择模式，默认关闭，可选single，multiple
+        // selectedMode: false,
+        // 南丁格尔玫瑰图模式，'radius'（半径） | 'area'（面积）
+        // roseType: null,
+
+        percentPrecision: 2,
+
+        // If still show when all data zero.
+        stillShowZeroSum: true,
+
+        // cursor: null,
+
+        label: {
+            // If rotate around circle
+            rotate: false,
+            show: true,
+            // 'outer', 'inside', 'center'
+            position: 'outer'
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+            // 默认使用全局文本样式，详见TEXTSTYLE
+            // distance: 当position为inner时有效，为label位置到圆心的距离与圆半径(环状图为内外半径和)的比例系数
+        },
+        // Enabled when label.normal.position is 'outer'
+        labelLine: {
+            show: true,
+            // 引导线两段中的第一段长度
+            length: 15,
+            // 引导线两段中的第二段长度
+            length2: 15,
+            smooth: false,
+            lineStyle: {
+                // color: 各异,
+                width: 1,
+                type: 'solid'
+            }
+        },
+        itemStyle: {
+            borderWidth: 1
+        },
+
+        // Animation type canbe expansion, scale
+        animationType: 'expansion',
+
+        animationEasing: 'cubicOut'
+    }
+});
+
+mixin(PieSeries, selectableMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {boolean} hasAnimation
+ * @inner
+ */
+function updateDataSelected(uid, seriesModel, hasAnimation, api) {
+    var data = seriesModel.getData();
+    var dataIndex = this.dataIndex;
+    var name = data.getName(dataIndex);
+    var selectedOffset = seriesModel.get('selectedOffset');
+
+    api.dispatchAction({
+        type: 'pieToggleSelect',
+        from: uid,
+        name: name,
+        seriesId: seriesModel.id
+    });
+
+    data.each(function (idx) {
+        toggleItemSelected(
+            data.getItemGraphicEl(idx),
+            data.getItemLayout(idx),
+            seriesModel.isSelected(data.getName(idx)),
+            selectedOffset,
+            hasAnimation
+        );
+    });
+}
+
+/**
+ * @param {module:zrender/graphic/Sector} el
+ * @param {Object} layout
+ * @param {boolean} isSelected
+ * @param {number} selectedOffset
+ * @param {boolean} hasAnimation
+ * @inner
+ */
+function toggleItemSelected(el, layout, isSelected, selectedOffset, hasAnimation) {
+    var midAngle = (layout.startAngle + layout.endAngle) / 2;
+
+    var dx = Math.cos(midAngle);
+    var dy = Math.sin(midAngle);
+
+    var offset = isSelected ? selectedOffset : 0;
+    var position = [dx * offset, dy * offset];
+
+    hasAnimation
+        // animateTo will stop revious animation like update transition
+        ? el.animate()
+            .when(200, {
+                position: position
+            })
+            .start('bounceOut')
+        : el.attr('position', position);
+}
+
+/**
+ * Piece of pie including Sector, Label, LabelLine
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ */
+function PiePiece(data, idx) {
+
+    Group.call(this);
+
+    var sector = new Sector({
+        z2: 2
+    });
+    var polyline = new Polyline();
+    var text = new Text();
+    this.add(sector);
+    this.add(polyline);
+    this.add(text);
+
+    this.updateData(data, idx, true);
+
+    // Hover to change label and labelLine
+    function onEmphasis() {
+        polyline.ignore = polyline.hoverIgnore;
+        text.ignore = text.hoverIgnore;
+    }
+    function onNormal() {
+        polyline.ignore = polyline.normalIgnore;
+        text.ignore = text.normalIgnore;
+    }
+    this.on('emphasis', onEmphasis)
+        .on('normal', onNormal)
+        .on('mouseover', onEmphasis)
+        .on('mouseout', onNormal);
+}
+
+var piePieceProto = PiePiece.prototype;
+
+piePieceProto.updateData = function (data, idx, firstCreate) {
+
+    var sector = this.childAt(0);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var sectorShape = extend({}, layout);
+    sectorShape.label = null;
+
+    if (firstCreate) {
+        sector.setShape(sectorShape);
+
+        var animationType = seriesModel.getShallow('animationType');
+        if (animationType === 'scale') {
+            sector.shape.r = layout.r0;
+            initProps(sector, {
+                shape: {
+                    r: layout.r
+                }
+            }, seriesModel, idx);
+        }
+        // Expansion
+        else {
+            sector.shape.endAngle = layout.startAngle;
+            updateProps(sector, {
+                shape: {
+                    endAngle: layout.endAngle
+                }
+            }, seriesModel, idx);
+        }
+
+    }
+    else {
+        updateProps(sector, {
+            shape: sectorShape
+        }, seriesModel, idx);
+    }
+
+    // Update common style
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    sector.useStyle(
+        defaults(
+            {
+                lineJoin: 'bevel',
+                fill: visualColor
+            },
+            itemModel.getModel('itemStyle').getItemStyle()
+        )
+    );
+    sector.hoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+
+    var cursorStyle = itemModel.getShallow('cursor');
+    cursorStyle && sector.attr('cursor', cursorStyle);
+
+    // Toggle selected
+    toggleItemSelected(
+        this,
+        data.getItemLayout(idx),
+        seriesModel.isSelected(null, idx),
+        seriesModel.get('selectedOffset'),
+        seriesModel.get('animation')
+    );
+
+    function onEmphasis() {
+        // Sector may has animation of updating data. Force to move to the last frame
+        // Or it may stopped on the wrong shape
+        sector.stopAnimation(true);
+        sector.animateTo({
+            shape: {
+                r: layout.r + seriesModel.get('hoverOffset')
+            }
+        }, 300, 'elasticOut');
+    }
+    function onNormal() {
+        sector.stopAnimation(true);
+        sector.animateTo({
+            shape: {
+                r: layout.r
+            }
+        }, 300, 'elasticOut');
+    }
+    sector.off('mouseover').off('mouseout').off('emphasis').off('normal');
+    if (itemModel.get('hoverAnimation') && seriesModel.isAnimationEnabled()) {
+        sector
+            .on('mouseover', onEmphasis)
+            .on('mouseout', onNormal)
+            .on('emphasis', onEmphasis)
+            .on('normal', onNormal);
+    }
+
+    this._updateLabel(data, idx);
+
+    setHoverStyle(this);
+};
+
+piePieceProto._updateLabel = function (data, idx) {
+
+    var labelLine = this.childAt(1);
+    var labelText = this.childAt(2);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var labelLayout = layout.label;
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    updateProps(labelLine, {
+        shape: {
+            points: labelLayout.linePoints || [
+                [labelLayout.x, labelLayout.y], [labelLayout.x, labelLayout.y], [labelLayout.x, labelLayout.y]
+            ]
+        }
+    }, seriesModel, idx);
+
+    updateProps(labelText, {
+        style: {
+            x: labelLayout.x,
+            y: labelLayout.y
+        }
+    }, seriesModel, idx);
+    labelText.attr({
+        rotation: labelLayout.rotation,
+        origin: [labelLayout.x, labelLayout.y],
+        z2: 10
+    });
+
+    var labelModel = itemModel.getModel('label');
+    var labelHoverModel = itemModel.getModel('emphasis.label');
+    var labelLineModel = itemModel.getModel('labelLine');
+    var labelLineHoverModel = itemModel.getModel('emphasis.labelLine');
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    setLabelStyle(
+        labelText.style, labelText.hoverStyle = {}, labelModel, labelHoverModel,
+        {
+            labelFetcher: data.hostModel,
+            labelDataIndex: idx,
+            defaultText: data.getName(idx),
+            autoColor: visualColor,
+            useInsideStyle: !!labelLayout.inside
+        },
+        {
+            textAlign: labelLayout.textAlign,
+            textVerticalAlign: labelLayout.verticalAlign,
+            opacity: data.getItemVisual(idx, 'opacity')
+        }
+    );
+
+    labelText.ignore = labelText.normalIgnore = !labelModel.get('show');
+    labelText.hoverIgnore = !labelHoverModel.get('show');
+
+    labelLine.ignore = labelLine.normalIgnore = !labelLineModel.get('show');
+    labelLine.hoverIgnore = !labelLineHoverModel.get('show');
+
+    // Default use item visual color
+    labelLine.setStyle({
+        stroke: visualColor,
+        opacity: data.getItemVisual(idx, 'opacity')
+    });
+    labelLine.setStyle(labelLineModel.getModel('lineStyle').getLineStyle());
+
+    labelLine.hoverStyle = labelLineHoverModel.getModel('lineStyle').getLineStyle();
+
+    var smooth = labelLineModel.get('smooth');
+    if (smooth && smooth === true) {
+        smooth = 0.4;
+    }
+    labelLine.setShape({
+        smooth: smooth
+    });
+};
+
+inherits(PiePiece, Group);
+
+
+// Pie view
+var PieView = Chart.extend({
+
+    type: 'pie',
+
+    init: function () {
+        var sectorGroup = new Group();
+        this._sectorGroup = sectorGroup;
+    },
+
+    render: function (seriesModel, ecModel, api, payload) {
+        if (payload && (payload.from === this.uid)) {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var oldData = this._data;
+        var group = this.group;
+
+        var hasAnimation = ecModel.get('animation');
+        var isFirstRender = !oldData;
+        var animationType = seriesModel.get('animationType');
+
+        var onSectorClick = curry(
+            updateDataSelected, this.uid, seriesModel, hasAnimation, api
+        );
+
+        var selectedMode = seriesModel.get('selectedMode');
+
+        data.diff(oldData)
+            .add(function (idx) {
+                var piePiece = new PiePiece(data, idx);
+                // Default expansion animation
+                if (isFirstRender && animationType !== 'scale') {
+                    piePiece.eachChild(function (child) {
+                        child.stopAnimation(true);
+                    });
+                }
+
+                selectedMode && piePiece.on('click', onSectorClick);
+
+                data.setItemGraphicEl(idx, piePiece);
+
+                group.add(piePiece);
+            })
+            .update(function (newIdx, oldIdx) {
+                var piePiece = oldData.getItemGraphicEl(oldIdx);
+
+                piePiece.updateData(data, newIdx);
+
+                piePiece.off('click');
+                selectedMode && piePiece.on('click', onSectorClick);
+                group.add(piePiece);
+                data.setItemGraphicEl(newIdx, piePiece);
+            })
+            .remove(function (idx) {
+                var piePiece = oldData.getItemGraphicEl(idx);
+                group.remove(piePiece);
+            })
+            .execute();
+
+        if (
+            hasAnimation && isFirstRender && data.count() > 0
+            // Default expansion animation
+            && animationType !== 'scale'
+        ) {
+            var shape = data.getItemLayout(0);
+            var r = Math.max(api.getWidth(), api.getHeight()) / 2;
+
+            var removeClipPath = bind(group.removeClipPath, group);
+            group.setClipPath(this._createClipPath(
+                shape.cx, shape.cy, r, shape.startAngle, shape.clockwise, removeClipPath, seriesModel
+            ));
+        }
+
+        this._data = data;
+    },
+
+    dispose: function () {},
+
+    _createClipPath: function (
+        cx, cy, r, startAngle, clockwise, cb, seriesModel
+    ) {
+        var clipPath = new Sector({
+            shape: {
+                cx: cx,
+                cy: cy,
+                r0: 0,
+                r: r,
+                startAngle: startAngle,
+                endAngle: startAngle,
+                clockwise: clockwise
+            }
+        });
+
+        initProps(clipPath, {
+            shape: {
+                endAngle: startAngle + (clockwise ? 1 : -1) * Math.PI * 2
+            }
+        }, seriesModel, cb);
+
+        return clipPath;
+    },
+
+    /**
+     * @implement
+     */
+    containPoint: function (point, seriesModel) {
+        var data = seriesModel.getData();
+        var itemLayout = data.getItemLayout(0);
+        if (itemLayout) {
+            var dx = point[0] - itemLayout.cx;
+            var dy = point[1] - itemLayout.cy;
+            var radius = Math.sqrt(dx * dx + dy * dy);
+            return radius <= itemLayout.r && radius >= itemLayout.r0;
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var createDataSelectAction = function (seriesType, actionInfos) {
+    each$1(actionInfos, function (actionInfo) {
+        actionInfo.update = 'updateView';
+        /**
+         * @payload
+         * @property {string} seriesName
+         * @property {string} name
+         */
+        registerAction(actionInfo, function (payload, ecModel) {
+            var selected = {};
+            ecModel.eachComponent(
+                {mainType: 'series', subType: seriesType, query: payload},
+                function (seriesModel) {
+                    if (seriesModel[actionInfo.method]) {
+                        seriesModel[actionInfo.method](
+                            payload.name,
+                            payload.dataIndex
+                        );
+                    }
+                    var data = seriesModel.getData();
+                    // Create selected map
+                    data.each(function (idx) {
+                        var name = data.getName(idx);
+                        selected[name] = seriesModel.isSelected(name)
+                            || false;
+                    });
+                }
+            );
+            return {
+                name: payload.name,
+                selected: selected
+            };
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Pick color from palette for each data item.
+// Applicable for charts that require applying color palette
+// in data level (like pie, funnel, chord).
+var dataColor = function (seriesType) {
+    return {
+        getTargetSeries: function (ecModel) {
+            // Pie and funnel may use diferrent scope
+            var paletteScope = {};
+            var seiresModelMap = createHashMap();
+
+            ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+                seriesModel.__paletteScope = paletteScope;
+                seiresModelMap.set(seriesModel.uid, seriesModel);
+            });
+
+            return seiresModelMap;
+        },
+        reset: function (seriesModel, ecModel) {
+            var dataAll = seriesModel.getRawData();
+            var idxMap = {};
+            var data = seriesModel.getData();
+
+            data.each(function (idx) {
+                var rawIdx = data.getRawIndex(idx);
+                idxMap[rawIdx] = idx;
+            });
+
+            dataAll.each(function (rawIdx) {
+                var filteredIdx = idxMap[rawIdx];
+
+                // If series.itemStyle.normal.color is a function. itemVisual may be encoded
+                var singleDataColor = filteredIdx != null
+                    && data.getItemVisual(filteredIdx, 'color', true);
+
+                if (!singleDataColor) {
+                    // FIXME Performance
+                    var itemModel = dataAll.getItemModel(rawIdx);
+
+                    var color = itemModel.get('itemStyle.color')
+                        || seriesModel.getColorFromPalette(
+                            dataAll.getName(rawIdx) || (rawIdx + ''), seriesModel.__paletteScope,
+                            dataAll.count()
+                        );
+                    // Legend may use the visual info in data before processed
+                    dataAll.setItemVisual(rawIdx, 'color', color);
+
+                    // Data is not filtered
+                    if (filteredIdx != null) {
+                        data.setItemVisual(filteredIdx, 'color', color);
+                    }
+                }
+                else {
+                    // Set data all color for legend
+                    dataAll.setItemVisual(rawIdx, 'color', singleDataColor);
+                }
+            });
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME emphasis label position is not same with normal label position
+
+function adjustSingleSide(list, cx, cy, r, dir, viewWidth, viewHeight) {
+    list.sort(function (a, b) {
+        return a.y - b.y;
+    });
+
+    // 压
+    function shiftDown(start, end, delta, dir) {
+        for (var j = start; j < end; j++) {
+            list[j].y += delta;
+            if (j > start
+                && j + 1 < end
+                && list[j + 1].y > list[j].y + list[j].height
+            ) {
+                shiftUp(j, delta / 2);
+                return;
+            }
+        }
+
+        shiftUp(end - 1, delta / 2);
+    }
+
+    // 弹
+    function shiftUp(end, delta) {
+        for (var j = end; j >= 0; j--) {
+            list[j].y -= delta;
+            if (j > 0
+                && list[j].y > list[j - 1].y + list[j - 1].height
+            ) {
+                break;
+            }
+        }
+    }
+
+    function changeX(list, isDownList, cx, cy, r, dir) {
+        var lastDeltaX = dir > 0
+            ? isDownList                // 右侧
+                ? Number.MAX_VALUE      // 下
+                : 0                     // 上
+            : isDownList                // 左侧
+                ? Number.MAX_VALUE      // 下
+                : 0;                    // 上
+
+        for (var i = 0, l = list.length; i < l; i++) {
+            // Not change x for center label
+            if (list[i].position === 'center') {
+                continue;
+            }
+            var deltaY = Math.abs(list[i].y - cy);
+            var length = list[i].len;
+            var length2 = list[i].len2;
+            var deltaX = (deltaY < r + length)
+                ? Math.sqrt(
+                        (r + length + length2) * (r + length + length2)
+                        - deltaY * deltaY
+                    )
+                : Math.abs(list[i].x - cx);
+            if (isDownList && deltaX >= lastDeltaX) {
+                // 右下，左下
+                deltaX = lastDeltaX - 10;
+            }
+            if (!isDownList && deltaX <= lastDeltaX) {
+                // 右上，左上
+                deltaX = lastDeltaX + 10;
+            }
+
+            list[i].x = cx + deltaX * dir;
+            lastDeltaX = deltaX;
+        }
+    }
+
+    var lastY = 0;
+    var delta;
+    var len = list.length;
+    var upList = [];
+    var downList = [];
+    for (var i = 0; i < len; i++) {
+        delta = list[i].y - lastY;
+        if (delta < 0) {
+            shiftDown(i, len, -delta, dir);
+        }
+        lastY = list[i].y + list[i].height;
+    }
+    if (viewHeight - lastY < 0) {
+        shiftUp(len - 1, lastY - viewHeight);
+    }
+    for (var i = 0; i < len; i++) {
+        if (list[i].y >= cy) {
+            downList.push(list[i]);
+        }
+        else {
+            upList.push(list[i]);
+        }
+    }
+    changeX(upList, false, cx, cy, r, dir);
+    changeX(downList, true, cx, cy, r, dir);
+}
+
+function avoidOverlap(labelLayoutList, cx, cy, r, viewWidth, viewHeight) {
+    var leftList = [];
+    var rightList = [];
+    for (var i = 0; i < labelLayoutList.length; i++) {
+        if (labelLayoutList[i].x < cx) {
+            leftList.push(labelLayoutList[i]);
+        }
+        else {
+            rightList.push(labelLayoutList[i]);
+        }
+    }
+
+    adjustSingleSide(rightList, cx, cy, r, 1, viewWidth, viewHeight);
+    adjustSingleSide(leftList, cx, cy, r, -1, viewWidth, viewHeight);
+
+    for (var i = 0; i < labelLayoutList.length; i++) {
+        var linePoints = labelLayoutList[i].linePoints;
+        if (linePoints) {
+            var dist = linePoints[1][0] - linePoints[2][0];
+            if (labelLayoutList[i].x < cx) {
+                linePoints[2][0] = labelLayoutList[i].x + 3;
+            }
+            else {
+                linePoints[2][0] = labelLayoutList[i].x - 3;
+            }
+            linePoints[1][1] = linePoints[2][1] = labelLayoutList[i].y;
+            linePoints[1][0] = linePoints[2][0] + dist;
+        }
+    }
+}
+
+var labelLayout = function (seriesModel, r, viewWidth, viewHeight) {
+    var data = seriesModel.getData();
+    var labelLayoutList = [];
+    var cx;
+    var cy;
+    var hasLabelRotate = false;
+
+    data.each(function (idx) {
+        var layout = data.getItemLayout(idx);
+
+        var itemModel = data.getItemModel(idx);
+        var labelModel = itemModel.getModel('label');
+        // Use position in normal or emphasis
+        var labelPosition = labelModel.get('position') || itemModel.get('emphasis.label.position');
+
+        var labelLineModel = itemModel.getModel('labelLine');
+        var labelLineLen = labelLineModel.get('length');
+        var labelLineLen2 = labelLineModel.get('length2');
+
+        var midAngle = (layout.startAngle + layout.endAngle) / 2;
+        var dx = Math.cos(midAngle);
+        var dy = Math.sin(midAngle);
+
+        var textX;
+        var textY;
+        var linePoints;
+        var textAlign;
+
+        cx = layout.cx;
+        cy = layout.cy;
+
+        var isLabelInside = labelPosition === 'inside' || labelPosition === 'inner';
+        if (labelPosition === 'center') {
+            textX = layout.cx;
+            textY = layout.cy;
+            textAlign = 'center';
+        }
+        else {
+            var x1 = (isLabelInside ? (layout.r + layout.r0) / 2 * dx : layout.r * dx) + cx;
+            var y1 = (isLabelInside ? (layout.r + layout.r0) / 2 * dy : layout.r * dy) + cy;
+
+            textX = x1 + dx * 3;
+            textY = y1 + dy * 3;
+
+            if (!isLabelInside) {
+                // For roseType
+                var x2 = x1 + dx * (labelLineLen + r - layout.r);
+                var y2 = y1 + dy * (labelLineLen + r - layout.r);
+                var x3 = x2 + ((dx < 0 ? -1 : 1) * labelLineLen2);
+                var y3 = y2;
+
+                textX = x3 + (dx < 0 ? -5 : 5);
+                textY = y3;
+                linePoints = [[x1, y1], [x2, y2], [x3, y3]];
+            }
+
+            textAlign = isLabelInside ? 'center' : (dx > 0 ? 'left' : 'right');
+        }
+        var font = labelModel.getFont();
+
+        var labelRotate = labelModel.get('rotate')
+            ? (dx < 0 ? -midAngle + Math.PI : -midAngle) : 0;
+        var text = seriesModel.getFormattedLabel(idx, 'normal')
+                    || data.getName(idx);
+        var textRect = getBoundingRect(
+            text, font, textAlign, 'top'
+        );
+        hasLabelRotate = !!labelRotate;
+        layout.label = {
+            x: textX,
+            y: textY,
+            position: labelPosition,
+            height: textRect.height,
+            len: labelLineLen,
+            len2: labelLineLen2,
+            linePoints: linePoints,
+            textAlign: textAlign,
+            verticalAlign: 'middle',
+            rotation: labelRotate,
+            inside: isLabelInside
+        };
+
+        // Not layout the inside label
+        if (!isLabelInside) {
+            labelLayoutList.push(layout.label);
+        }
+    });
+    if (!hasLabelRotate && seriesModel.get('avoidLabelOverlap')) {
+        avoidOverlap(labelLayoutList, cx, cy, r, viewWidth, viewHeight);
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var PI2$4 = Math.PI * 2;
+var RADIAN = Math.PI / 180;
+
+var pieLayout = function (seriesType, ecModel, api, payload) {
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+
+        var center = seriesModel.get('center');
+        var radius = seriesModel.get('radius');
+
+        if (!isArray(radius)) {
+            radius = [0, radius];
+        }
+        if (!isArray(center)) {
+            center = [center, center];
+        }
+
+        var width = api.getWidth();
+        var height = api.getHeight();
+        var size = Math.min(width, height);
+        var cx = parsePercent$1(center[0], width);
+        var cy = parsePercent$1(center[1], height);
+        var r0 = parsePercent$1(radius[0], size / 2);
+        var r = parsePercent$1(radius[1], size / 2);
+
+        var startAngle = -seriesModel.get('startAngle') * RADIAN;
+
+        var minAngle = seriesModel.get('minAngle') * RADIAN;
+
+        var validDataCount = 0;
+        data.each(valueDim, function (value) {
+            !isNaN(value) && validDataCount++;
+        });
+
+        var sum = data.getSum(valueDim);
+        // Sum may be 0
+        var unitRadian = Math.PI / (sum || validDataCount) * 2;
+
+        var clockwise = seriesModel.get('clockwise');
+
+        var roseType = seriesModel.get('roseType');
+        var stillShowZeroSum = seriesModel.get('stillShowZeroSum');
+
+        // [0...max]
+        var extent = data.getDataExtent(valueDim);
+        extent[0] = 0;
+
+        // In the case some sector angle is smaller than minAngle
+        var restAngle = PI2$4;
+        var valueSumLargerThanMinAngle = 0;
+
+        var currentAngle = startAngle;
+        var dir = clockwise ? 1 : -1;
+
+        data.each(valueDim, function (value, idx) {
+            var angle;
+            if (isNaN(value)) {
+                data.setItemLayout(idx, {
+                    angle: NaN,
+                    startAngle: NaN,
+                    endAngle: NaN,
+                    clockwise: clockwise,
+                    cx: cx,
+                    cy: cy,
+                    r0: r0,
+                    r: roseType
+                        ? NaN
+                        : r
+                });
+                return;
+            }
+
+            // FIXME 兼容 2.0 但是 roseType 是 area 的时候才是这样？
+            if (roseType !== 'area') {
+                angle = (sum === 0 && stillShowZeroSum)
+                    ? unitRadian : (value * unitRadian);
+            }
+            else {
+                angle = PI2$4 / validDataCount;
+            }
+
+            if (angle < minAngle) {
+                angle = minAngle;
+                restAngle -= minAngle;
+            }
+            else {
+                valueSumLargerThanMinAngle += value;
+            }
+
+            var endAngle = currentAngle + dir * angle;
+            data.setItemLayout(idx, {
+                angle: angle,
+                startAngle: currentAngle,
+                endAngle: endAngle,
+                clockwise: clockwise,
+                cx: cx,
+                cy: cy,
+                r0: r0,
+                r: roseType
+                    ? linearMap(value, extent, [r0, r])
+                    : r
+            });
+
+            currentAngle = endAngle;
+        });
+
+        // Some sector is constrained by minAngle
+        // Rest sectors needs recalculate angle
+        if (restAngle < PI2$4 && validDataCount) {
+            // Average the angle if rest angle is not enough after all angles is
+            // Constrained by minAngle
+            if (restAngle <= 1e-3) {
+                var angle = PI2$4 / validDataCount;
+                data.each(valueDim, function (value, idx) {
+                    if (!isNaN(value)) {
+                        var layout = data.getItemLayout(idx);
+                        layout.angle = angle;
+                        layout.startAngle = startAngle + dir * idx * angle;
+                        layout.endAngle = startAngle + dir * (idx + 1) * angle;
+                    }
+                });
+            }
+            else {
+                unitRadian = restAngle / valueSumLargerThanMinAngle;
+                currentAngle = startAngle;
+                data.each(valueDim, function (value, idx) {
+                    if (!isNaN(value)) {
+                        var layout = data.getItemLayout(idx);
+                        var angle = layout.angle === minAngle
+                            ? minAngle : value * unitRadian;
+                        layout.startAngle = currentAngle;
+                        layout.endAngle = currentAngle + dir * angle;
+                        currentAngle += dir * angle;
+                    }
+                });
+            }
+        }
+
+        labelLayout(seriesModel, r, width, height);
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var dataFilter = function (seriesType) {
+    return {
+        seriesType: seriesType,
+        reset: function (seriesModel, ecModel) {
+            var legendModels = ecModel.findComponents({
+                mainType: 'legend'
+            });
+            if (!legendModels || !legendModels.length) {
+                return;
+            }
+            var data = seriesModel.getData();
+            data.filterSelf(function (idx) {
+                var name = data.getName(idx);
+                // If in any legend component the status is not selected.
+                for (var i = 0; i < legendModels.length; i++) {
+                    if (!legendModels[i].isSelected(name)) {
+                        return false;
+                    }
+                }
+                return true;
+            });
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+createDataSelectAction('pie', [{
+    type: 'pieToggleSelect',
+    event: 'pieselectchanged',
+    method: 'toggleSelected'
+}, {
+    type: 'pieSelect',
+    event: 'pieselected',
+    method: 'select'
+}, {
+    type: 'pieUnSelect',
+    event: 'pieunselected',
+    method: 'unSelect'
+}]);
+
+registerVisual(dataColor('pie'));
+registerLayout(curry(pieLayout, 'pie'));
+registerProcessor(dataFilter('pie'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.scatter',
+
+    dependencies: ['grid', 'polar', 'geo', 'singleAxis', 'calendar'],
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    },
+
+    brushSelector: 'point',
+
+    getProgressive: function () {
+        var progressive = this.option.progressive;
+        if (progressive == null) {
+            // PENDING
+            return this.option.large ? 5e3 : this.get('progressive');
+        }
+        return progressive;
+    },
+
+    getProgressiveThreshold: function () {
+        var progressiveThreshold = this.option.progressiveThreshold;
+        if (progressiveThreshold == null) {
+            // PENDING
+            return this.option.large ? 1e4 : this.get('progressiveThreshold');
+        }
+        return progressiveThreshold;
+    },
+
+    defaultOption: {
+        coordinateSystem: 'cartesian2d',
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Polar coordinate system
+        // polarIndex: 0,
+
+        // Geo coordinate system
+        // geoIndex: 0,
+
+        // symbol: null,        // 图形类型
+        symbolSize: 10,          // 图形大小，半宽（半径）参数，当图形为方向或菱形则总宽度为symbolSize * 2
+        // symbolRotate: null,  // 图形旋转控制
+
+        large: false,
+        // Available when large is true
+        largeThreshold: 2000,
+        // cursor: null,
+
+        // label: {
+            // show: false
+            // distance: 5,
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+            // position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为
+            //           'inside'|'left'|'right'|'top'|'bottom'
+            // 默认使用全局文本样式，详见TEXTSTYLE
+        // },
+        itemStyle: {
+            opacity: 0.8
+            // color: 各异
+        }
+
+        // progressive: null
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Batch by color
+
+var BOOST_SIZE_THRESHOLD = 4;
+
+var LargeSymbolPath = extendShape({
+
+    shape: {
+        points: null
+    },
+
+    symbolProxy: null,
+
+    buildPath: function (path, shape) {
+        var points = shape.points;
+        var size = shape.size;
+
+        var symbolProxy = this.symbolProxy;
+        var symbolProxyShape = symbolProxy.shape;
+        var ctx = path.getContext ? path.getContext() : path;
+        var canBoost = ctx && size[0] < BOOST_SIZE_THRESHOLD;
+
+        // Do draw in afterBrush.
+        if (canBoost) {
+            return;
+        }
+
+        for (var i = 0; i < points.length;) {
+            var x = points[i++];
+            var y = points[i++];
+
+            if (isNaN(x) || isNaN(y)) {
+                continue;
+            }
+
+            symbolProxyShape.x = x - size[0] / 2;
+            symbolProxyShape.y = y - size[1] / 2;
+            symbolProxyShape.width = size[0];
+            symbolProxyShape.height = size[1];
+
+            symbolProxy.buildPath(path, symbolProxyShape, true);
+        }
+    },
+
+    afterBrush: function (ctx) {
+        var shape = this.shape;
+        var points = shape.points;
+        var size = shape.size;
+        var canBoost = size[0] < BOOST_SIZE_THRESHOLD;
+
+        if (!canBoost) {
+            return;
+        }
+
+        this.setTransform(ctx);
+        // PENDING If style or other canvas status changed?
+        for (var i = 0; i < points.length;) {
+            var x = points[i++];
+            var y = points[i++];
+            if (isNaN(x) || isNaN(y)) {
+                continue;
+            }
+            // fillRect is faster than building a rect path and draw.
+            // And it support light globalCompositeOperation.
+            ctx.fillRect(
+                x - size[0] / 2, y - size[1] / 2,
+                size[0], size[1]
+            );
+        }
+
+        this.restoreTransform(ctx);
+    },
+
+    findDataIndex: function (x, y) {
+        // TODO ???
+        // Consider transform
+
+        var shape = this.shape;
+        var points = shape.points;
+        var size = shape.size;
+
+        var w = Math.max(size[0], 4);
+        var h = Math.max(size[1], 4);
+
+        // Not consider transform
+        // Treat each element as a rect
+        // top down traverse
+        for (var idx = points.length / 2 - 1; idx >= 0; idx--) {
+            var i = idx * 2;
+            var x0 = points[i] - w / 2;
+            var y0 = points[i + 1] - h / 2;
+            if (x >= x0 && y >= y0 && x <= x0 + w && y <= y0 + h) {
+                return idx;
+            }
+        }
+
+        return -1;
+    }
+});
+
+function LargeSymbolDraw() {
+    this.group = new Group();
+}
+
+var largeSymbolProto = LargeSymbolDraw.prototype;
+
+largeSymbolProto.isPersistent = function () {
+    return !this._incremental;
+};
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ */
+largeSymbolProto.updateData = function (data) {
+    this.group.removeAll();
+    var symbolEl = new LargeSymbolPath({
+        rectHover: true,
+        cursor: 'default'
+    });
+
+    symbolEl.setShape({
+        points: data.getLayout('symbolPoints')
+    });
+    this._setCommon(symbolEl, data);
+    this.group.add(symbolEl);
+
+    this._incremental = null;
+};
+
+largeSymbolProto.updateLayout = function (data) {
+    if (this._incremental) {
+        return;
+    }
+
+    var points = data.getLayout('symbolPoints');
+    this.group.eachChild(function (child) {
+        if (child.startIndex != null) {
+            var len = (child.endIndex - child.startIndex) * 2;
+            var byteOffset = child.startIndex * 4 * 2;
+            points = new Float32Array(points.buffer, byteOffset, len);
+        }
+        child.setShape('points', points);
+    });
+};
+
+largeSymbolProto.incrementalPrepareUpdate = function (data) {
+    this.group.removeAll();
+
+    this._clearIncremental();
+    // Only use incremental displayables when data amount is larger than 2 million.
+    // PENDING Incremental data?
+    if (data.count() > 2e6) {
+        if (!this._incremental) {
+            this._incremental = new IncrementalDisplayble({
+                silent: true
+            });
+        }
+        this.group.add(this._incremental);
+    }
+    else {
+        this._incremental = null;
+    }
+};
+
+largeSymbolProto.incrementalUpdate = function (taskParams, data) {
+    var symbolEl;
+    if (this._incremental) {
+        symbolEl = new LargeSymbolPath();
+        this._incremental.addDisplayable(symbolEl, true);
+    }
+    else {
+        symbolEl = new LargeSymbolPath({
+            rectHover: true,
+            cursor: 'default',
+            startIndex: taskParams.start,
+            endIndex: taskParams.end
+        });
+        symbolEl.incremental = true;
+        this.group.add(symbolEl);
+    }
+
+    symbolEl.setShape({
+        points: data.getLayout('symbolPoints')
+    });
+    this._setCommon(symbolEl, data, !!this._incremental);
+};
+
+largeSymbolProto._setCommon = function (symbolEl, data, isIncremental) {
+    var hostModel = data.hostModel;
+
+    // TODO
+    // if (data.hasItemVisual.symbolSize) {
+    //     // TODO typed array?
+    //     symbolEl.setShape('sizes', data.mapArray(
+    //         function (idx) {
+    //             var size = data.getItemVisual(idx, 'symbolSize');
+    //             return (size instanceof Array) ? size : [size, size];
+    //         }
+    //     ));
+    // }
+    // else {
+    var size = data.getVisual('symbolSize');
+    symbolEl.setShape('size', (size instanceof Array) ? size : [size, size]);
+    // }
+
+    // Create symbolProxy to build path for each data
+    symbolEl.symbolProxy = createSymbol(
+        data.getVisual('symbol'), 0, 0, 0, 0
+    );
+    // Use symbolProxy setColor method
+    symbolEl.setColor = symbolEl.symbolProxy.setColor;
+
+    var extrudeShadow = symbolEl.shape.size[0] < BOOST_SIZE_THRESHOLD;
+    symbolEl.useStyle(
+        // Draw shadow when doing fillRect is extremely slow.
+        hostModel.getModel('itemStyle').getItemStyle(extrudeShadow ? ['color', 'shadowBlur', 'shadowColor'] : ['color'])
+    );
+
+    var visualColor = data.getVisual('color');
+    if (visualColor) {
+        symbolEl.setColor(visualColor);
+    }
+
+    if (!isIncremental) {
+        // Enable tooltip
+        // PENDING May have performance issue when path is extremely large
+        symbolEl.seriesIndex = hostModel.seriesIndex;
+        symbolEl.on('mousemove', function (e) {
+            symbolEl.dataIndex = null;
+            var dataIndex = symbolEl.findDataIndex(e.offsetX, e.offsetY);
+            if (dataIndex >= 0) {
+                // Provide dataIndex for tooltip
+                symbolEl.dataIndex = dataIndex + (symbolEl.startIndex || 0);
+            }
+        });
+    }
+};
+
+largeSymbolProto.remove = function () {
+    this._clearIncremental();
+    this._incremental = null;
+    this.group.removeAll();
+};
+
+largeSymbolProto._clearIncremental = function () {
+    var incremental = this._incremental;
+    if (incremental) {
+        incremental.clearDisplaybles();
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'scatter',
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var symbolDraw = this._updateSymbolDraw(data, seriesModel);
+        symbolDraw.updateData(data);
+
+        this._finished = true;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var symbolDraw = this._updateSymbolDraw(data, seriesModel);
+
+        symbolDraw.incrementalPrepareUpdate(data);
+
+        this._finished = false;
+    },
+
+    incrementalRender: function (taskParams, seriesModel, ecModel) {
+        this._symbolDraw.incrementalUpdate(taskParams, seriesModel.getData());
+
+        this._finished = taskParams.end === seriesModel.getData().count();
+    },
+
+    updateTransform: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        // Must mark group dirty and make sure the incremental layer will be cleared
+        // PENDING
+        this.group.dirty();
+
+        if (!this._finished || data.count() > 1e4 || !this._symbolDraw.isPersistent()) {
+            return {
+                update: true
+            };
+        }
+        else {
+            var res = pointsLayout().reset(seriesModel);
+            if (res.progress) {
+                res.progress({ start: 0, end: data.count() }, data);
+            }
+
+            this._symbolDraw.updateLayout(data);
+        }
+    },
+
+    _updateSymbolDraw: function (data, seriesModel) {
+        var symbolDraw = this._symbolDraw;
+        var pipelineContext = seriesModel.pipelineContext;
+        var isLargeDraw = pipelineContext.large;
+
+        if (!symbolDraw || isLargeDraw !== this._isLargeDraw) {
+            symbolDraw && symbolDraw.remove();
+            symbolDraw = this._symbolDraw = isLargeDraw
+                ? new LargeSymbolDraw()
+                : new SymbolDraw();
+            this._isLargeDraw = isLargeDraw;
+            this.group.removeAll();
+        }
+
+        this.group.add(symbolDraw.group);
+
+        return symbolDraw;
+    },
+
+    remove: function (ecModel, api) {
+        this._symbolDraw && this._symbolDraw.remove(true);
+        this._symbolDraw = null;
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// import * as zrUtil from 'zrender/src/core/util';
+
+// In case developer forget to include grid component
+registerVisual(visualSymbol('scatter', 'circle'));
+registerLayout(pointsLayout('scatter'));
+
+// echarts.registerProcessor(function (ecModel, api) {
+//     ecModel.eachSeriesByType('scatter', function (seriesModel) {
+//         var data = seriesModel.getData();
+//         var coordSys = seriesModel.coordinateSystem;
+//         if (coordSys.type !== 'geo') {
+//             return;
+//         }
+//         var startPt = coordSys.pointToData([0, 0]);
+//         var endPt = coordSys.pointToData([api.getWidth(), api.getHeight()]);
+
+//         var dims = zrUtil.map(coordSys.dimensions, function (dim) {
+//             return data.mapDimension(dim);
+//         });
+//         var range = {};
+//         range[dims[0]] = [Math.min(startPt[0], endPt[0]), Math.max(startPt[0], endPt[0])];
+//         range[dims[1]] = [Math.min(startPt[1], endPt[1]), Math.max(startPt[1], endPt[1])];
+
+//         data.selectRange(range);
+//     });
+// });
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function IndicatorAxis(dim, scale, radiusExtent) {
+    Axis.call(this, dim, scale, radiusExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = 'value';
+
+    this.angle = 0;
+
+    /**
+     * Indicator name
+     * @type {string}
+     */
+    this.name = '';
+    /**
+     * @type {module:echarts/model/Model}
+     */
+    this.model;
+}
+
+inherits(IndicatorAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO clockwise
+
+function Radar(radarModel, ecModel, api) {
+
+    this._model = radarModel;
+    /**
+     * Radar dimensions
+     * @type {Array.<string>}
+     */
+    this.dimensions = [];
+
+    this._indicatorAxes = map(radarModel.getIndicatorModels(), function (indicatorModel, idx) {
+        var dim = 'indicator_' + idx;
+        var indicatorAxis = new IndicatorAxis(dim, new IntervalScale());
+        indicatorAxis.name = indicatorModel.get('name');
+        // Inject model and axis
+        indicatorAxis.model = indicatorModel;
+        indicatorModel.axis = indicatorAxis;
+        this.dimensions.push(dim);
+        return indicatorAxis;
+    }, this);
+
+    this.resize(radarModel, api);
+
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.cx;
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.cy;
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.r;
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.startAngle;
+}
+
+Radar.prototype.getIndicatorAxes = function () {
+    return this._indicatorAxes;
+};
+
+Radar.prototype.dataToPoint = function (value, indicatorIndex) {
+    var indicatorAxis = this._indicatorAxes[indicatorIndex];
+
+    return this.coordToPoint(indicatorAxis.dataToCoord(value), indicatorIndex);
+};
+
+Radar.prototype.coordToPoint = function (coord, indicatorIndex) {
+    var indicatorAxis = this._indicatorAxes[indicatorIndex];
+    var angle = indicatorAxis.angle;
+    var x = this.cx + coord * Math.cos(angle);
+    var y = this.cy - coord * Math.sin(angle);
+    return [x, y];
+};
+
+Radar.prototype.pointToData = function (pt) {
+    var dx = pt[0] - this.cx;
+    var dy = pt[1] - this.cy;
+    var radius = Math.sqrt(dx * dx + dy * dy);
+    dx /= radius;
+    dy /= radius;
+
+    var radian = Math.atan2(-dy, dx);
+
+    // Find the closest angle
+    // FIXME index can calculated directly
+    var minRadianDiff = Infinity;
+    var closestAxis;
+    var closestAxisIdx = -1;
+    for (var i = 0; i < this._indicatorAxes.length; i++) {
+        var indicatorAxis = this._indicatorAxes[i];
+        var diff = Math.abs(radian - indicatorAxis.angle);
+        if (diff < minRadianDiff) {
+            closestAxis = indicatorAxis;
+            closestAxisIdx = i;
+            minRadianDiff = diff;
+        }
+    }
+
+    return [closestAxisIdx, +(closestAxis && closestAxis.coodToData(radius))];
+};
+
+Radar.prototype.resize = function (radarModel, api) {
+    var center = radarModel.get('center');
+    var viewWidth = api.getWidth();
+    var viewHeight = api.getHeight();
+    var viewSize = Math.min(viewWidth, viewHeight) / 2;
+    this.cx = parsePercent$1(center[0], viewWidth);
+    this.cy = parsePercent$1(center[1], viewHeight);
+
+    this.startAngle = radarModel.get('startAngle') * Math.PI / 180;
+
+    this.r = parsePercent$1(radarModel.get('radius'), viewSize);
+
+    each$1(this._indicatorAxes, function (indicatorAxis, idx) {
+        indicatorAxis.setExtent(0, this.r);
+        var angle = (this.startAngle + idx * Math.PI * 2 / this._indicatorAxes.length);
+        // Normalize to [-PI, PI]
+        angle = Math.atan2(Math.sin(angle), Math.cos(angle));
+        indicatorAxis.angle = angle;
+    }, this);
+};
+
+Radar.prototype.update = function (ecModel, api) {
+    var indicatorAxes = this._indicatorAxes;
+    var radarModel = this._model;
+    each$1(indicatorAxes, function (indicatorAxis) {
+        indicatorAxis.scale.setExtent(Infinity, -Infinity);
+    });
+    ecModel.eachSeriesByType('radar', function (radarSeries, idx) {
+        if (radarSeries.get('coordinateSystem') !== 'radar'
+            || ecModel.getComponent('radar', radarSeries.get('radarIndex')) !== radarModel
+        ) {
+            return;
+        }
+        var data = radarSeries.getData();
+        each$1(indicatorAxes, function (indicatorAxis) {
+            indicatorAxis.scale.unionExtentFromData(data, data.mapDimension(indicatorAxis.dim));
+        });
+    }, this);
+
+    var splitNumber = radarModel.get('splitNumber');
+
+    function increaseInterval(interval) {
+        var exp10 = Math.pow(10, Math.floor(Math.log(interval) / Math.LN10));
+        // Increase interval
+        var f = interval / exp10;
+        if (f === 2) {
+            f = 5;
+        }
+        else { // f is 2 or 5
+            f *= 2;
+        }
+        return f * exp10;
+    }
+    // Force all the axis fixing the maxSplitNumber.
+    each$1(indicatorAxes, function (indicatorAxis, idx) {
+        var rawExtent = getScaleExtent(indicatorAxis.scale, indicatorAxis.model);
+        niceScaleExtent(indicatorAxis.scale, indicatorAxis.model);
+
+        var axisModel = indicatorAxis.model;
+        var scale = indicatorAxis.scale;
+        var fixedMin = axisModel.getMin();
+        var fixedMax = axisModel.getMax();
+        var interval = scale.getInterval();
+
+        if (fixedMin != null && fixedMax != null) {
+            // User set min, max, divide to get new interval
+            scale.setExtent(+fixedMin, +fixedMax);
+            scale.setInterval(
+                (fixedMax - fixedMin) / splitNumber
+            );
+        }
+        else if (fixedMin != null) {
+            var max;
+            // User set min, expand extent on the other side
+            do {
+                max = fixedMin + interval * splitNumber;
+                scale.setExtent(+fixedMin, max);
+                // Interval must been set after extent
+                // FIXME
+                scale.setInterval(interval);
+
+                interval = increaseInterval(interval);
+            } while (max < rawExtent[1] && isFinite(max) && isFinite(rawExtent[1]));
+        }
+        else if (fixedMax != null) {
+            var min;
+            // User set min, expand extent on the other side
+            do {
+                min = fixedMax - interval * splitNumber;
+                scale.setExtent(min, +fixedMax);
+                scale.setInterval(interval);
+                interval = increaseInterval(interval);
+            } while (min > rawExtent[0] && isFinite(min) && isFinite(rawExtent[0]));
+        }
+        else {
+            var nicedSplitNumber = scale.getTicks().length - 1;
+            if (nicedSplitNumber > splitNumber) {
+                interval = increaseInterval(interval);
+            }
+            // PENDING
+            var center = Math.round((rawExtent[0] + rawExtent[1]) / 2 / interval) * interval;
+            var halfSplitNumber = Math.round(splitNumber / 2);
+            scale.setExtent(
+                round$1(center - halfSplitNumber * interval),
+                round$1(center + (splitNumber - halfSplitNumber) * interval)
+            );
+            scale.setInterval(interval);
+        }
+    });
+};
+
+/**
+ * Radar dimensions is based on the data
+ * @type {Array}
+ */
+Radar.dimensions = [];
+
+Radar.create = function (ecModel, api) {
+    var radarList = [];
+    ecModel.eachComponent('radar', function (radarModel) {
+        var radar = new Radar(radarModel, ecModel, api);
+        radarList.push(radar);
+        radarModel.coordinateSystem = radar;
+    });
+    ecModel.eachSeriesByType('radar', function (radarSeries) {
+        if (radarSeries.get('coordinateSystem') === 'radar') {
+            // Inject coordinate system
+            radarSeries.coordinateSystem = radarList[radarSeries.get('radarIndex') || 0];
+        }
+    });
+    return radarList;
+};
+
+CoordinateSystemManager.register('radar', Radar);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var valueAxisDefault = axisDefault.valueAxis;
+
+function defaultsShow(opt, show) {
+    return defaults({
+        show: show
+    }, opt);
+}
+
+var RadarModel = extendComponentModel({
+
+    type: 'radar',
+
+    optionUpdated: function () {
+        var boundaryGap = this.get('boundaryGap');
+        var splitNumber = this.get('splitNumber');
+        var scale = this.get('scale');
+        var axisLine = this.get('axisLine');
+        var axisTick = this.get('axisTick');
+        var axisLabel = this.get('axisLabel');
+        var nameTextStyle = this.get('name');
+        var showName = this.get('name.show');
+        var nameFormatter = this.get('name.formatter');
+        var nameGap = this.get('nameGap');
+        var triggerEvent = this.get('triggerEvent');
+
+        var indicatorModels = map(this.get('indicator') || [], function (indicatorOpt) {
+            // PENDING
+            if (indicatorOpt.max != null && indicatorOpt.max > 0 && !indicatorOpt.min) {
+                indicatorOpt.min = 0;
+            }
+            else if (indicatorOpt.min != null && indicatorOpt.min < 0 && !indicatorOpt.max) {
+                indicatorOpt.max = 0;
+            }
+            var iNameTextStyle = nameTextStyle;
+            if(indicatorOpt.color != null) {
+                iNameTextStyle = defaults({color: indicatorOpt.color}, nameTextStyle);
+            }
+            // Use same configuration
+            indicatorOpt = merge(clone(indicatorOpt), {
+                boundaryGap: boundaryGap,
+                splitNumber: splitNumber,
+                scale: scale,
+                axisLine: axisLine,
+                axisTick: axisTick,
+                axisLabel: axisLabel,
+                // Competitable with 2 and use text
+                name: indicatorOpt.text,
+                nameLocation: 'end',
+                nameGap: nameGap,
+                // min: 0,
+                nameTextStyle: iNameTextStyle,
+                triggerEvent: triggerEvent
+            }, false);
+            if (!showName) {
+                indicatorOpt.name = '';
+            }
+            if (typeof nameFormatter === 'string') {
+                var indName = indicatorOpt.name;
+                indicatorOpt.name = nameFormatter.replace('{value}', indName != null ? indName : '');
+            }
+            else if (typeof nameFormatter === 'function') {
+                indicatorOpt.name = nameFormatter(
+                    indicatorOpt.name, indicatorOpt
+                );
+            }
+            var model = extend(
+                new Model(indicatorOpt, null, this.ecModel),
+                axisModelCommonMixin
+            );
+
+            // For triggerEvent.
+            model.mainType = 'radar';
+            model.componentIndex = this.componentIndex;
+
+            return model;
+        }, this);
+
+        this.getIndicatorModels = function () {
+            return indicatorModels;
+        };
+    },
+
+    defaultOption: {
+
+        zlevel: 0,
+
+        z: 0,
+
+        center: ['50%', '50%'],
+
+        radius: '75%',
+
+        startAngle: 90,
+
+        name: {
+            show: true
+            // formatter: null
+            // textStyle: {}
+        },
+
+        boundaryGap: [0, 0],
+
+        splitNumber: 5,
+
+        nameGap: 15,
+
+        scale: false,
+
+        // Polygon or circle
+        shape: 'polygon',
+
+        axisLine: merge(
+            {
+                lineStyle: {
+                    color: '#bbb'
+                }
+            },
+            valueAxisDefault.axisLine
+        ),
+        axisLabel: defaultsShow(valueAxisDefault.axisLabel, false),
+        axisTick: defaultsShow(valueAxisDefault.axisTick, false),
+        splitLine: defaultsShow(valueAxisDefault.splitLine, true),
+        splitArea: defaultsShow(valueAxisDefault.splitArea, true),
+
+        // {text, min, max}
+        indicator: []
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisBuilderAttrs$1 = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+
+extendComponentView({
+
+    type: 'radar',
+
+    render: function (radarModel, ecModel, api) {
+        var group = this.group;
+        group.removeAll();
+
+        this._buildAxes(radarModel);
+        this._buildSplitLineAndArea(radarModel);
+    },
+
+    _buildAxes: function (radarModel) {
+        var radar = radarModel.coordinateSystem;
+        var indicatorAxes = radar.getIndicatorAxes();
+        var axisBuilders = map(indicatorAxes, function (indicatorAxis) {
+            var axisBuilder = new AxisBuilder(indicatorAxis.model, {
+                position: [radar.cx, radar.cy],
+                rotation: indicatorAxis.angle,
+                labelDirection: -1,
+                tickDirection: -1,
+                nameDirection: 1
+            });
+            return axisBuilder;
+        });
+
+        each$1(axisBuilders, function (axisBuilder) {
+            each$1(axisBuilderAttrs$1, axisBuilder.add, axisBuilder);
+            this.group.add(axisBuilder.getGroup());
+        }, this);
+    },
+
+    _buildSplitLineAndArea: function (radarModel) {
+        var radar = radarModel.coordinateSystem;
+        var indicatorAxes = radar.getIndicatorAxes();
+        if (!indicatorAxes.length) {
+            return;
+        }
+        var shape = radarModel.get('shape');
+        var splitLineModel = radarModel.getModel('splitLine');
+        var splitAreaModel = radarModel.getModel('splitArea');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+
+        var showSplitLine = splitLineModel.get('show');
+        var showSplitArea = splitAreaModel.get('show');
+        var splitLineColors = lineStyleModel.get('color');
+        var splitAreaColors = areaStyleModel.get('color');
+
+        splitLineColors = isArray(splitLineColors) ? splitLineColors : [splitLineColors];
+        splitAreaColors = isArray(splitAreaColors) ? splitAreaColors : [splitAreaColors];
+
+        var splitLines = [];
+        var splitAreas = [];
+
+        function getColorIndex(areaOrLine, areaOrLineColorList, idx) {
+            var colorIndex = idx % areaOrLineColorList.length;
+            areaOrLine[colorIndex] = areaOrLine[colorIndex] || [];
+            return colorIndex;
+        }
+
+        if (shape === 'circle') {
+            var ticksRadius = indicatorAxes[0].getTicksCoords();
+            var cx = radar.cx;
+            var cy = radar.cy;
+            for (var i = 0; i < ticksRadius.length; i++) {
+                if (showSplitLine) {
+                    var colorIndex = getColorIndex(splitLines, splitLineColors, i);
+                    splitLines[colorIndex].push(new Circle({
+                        shape: {
+                            cx: cx,
+                            cy: cy,
+                            r: ticksRadius[i].coord
+                        }
+                    }));
+                }
+                if (showSplitArea && i < ticksRadius.length - 1) {
+                    var colorIndex = getColorIndex(splitAreas, splitAreaColors, i);
+                    splitAreas[colorIndex].push(new Ring({
+                        shape: {
+                            cx: cx,
+                            cy: cy,
+                            r0: ticksRadius[i].coord,
+                            r: ticksRadius[i + 1].coord
+                        }
+                    }));
+                }
+            }
+        }
+        // Polyyon
+        else {
+            var realSplitNumber;
+            var axesTicksPoints = map(indicatorAxes, function (indicatorAxis, idx) {
+                var ticksCoords = indicatorAxis.getTicksCoords();
+                realSplitNumber = realSplitNumber == null
+                    ? ticksCoords.length - 1
+                    : Math.min(ticksCoords.length - 1, realSplitNumber);
+                return map(ticksCoords, function (tickCoord) {
+                    return radar.coordToPoint(tickCoord.coord, idx);
+                });
+            });
+
+            var prevPoints = [];
+            for (var i = 0; i <= realSplitNumber; i++) {
+                var points = [];
+                for (var j = 0; j < indicatorAxes.length; j++) {
+                    points.push(axesTicksPoints[j][i]);
+                }
+                // Close
+                if (points[0]) {
+                    points.push(points[0].slice());
+                }
+                else {
+                    if (__DEV__) {
+                        console.error('Can\'t draw value axis ' + i);
+                    }
+                }
+
+                if (showSplitLine) {
+                    var colorIndex = getColorIndex(splitLines, splitLineColors, i);
+                    splitLines[colorIndex].push(new Polyline({
+                        shape: {
+                            points: points
+                        }
+                    }));
+                }
+                if (showSplitArea && prevPoints) {
+                    var colorIndex = getColorIndex(splitAreas, splitAreaColors, i - 1);
+                    splitAreas[colorIndex].push(new Polygon({
+                        shape: {
+                            points: points.concat(prevPoints)
+                        }
+                    }));
+                }
+                prevPoints = points.slice().reverse();
+            }
+        }
+
+        var lineStyle = lineStyleModel.getLineStyle();
+        var areaStyle = areaStyleModel.getAreaStyle();
+        // Add splitArea before splitLine
+        each$1(splitAreas, function (splitAreas, idx) {
+            this.group.add(mergePath(
+                splitAreas, {
+                    style: defaults({
+                        stroke: 'none',
+                        fill: splitAreaColors[idx % splitAreaColors.length]
+                    }, areaStyle),
+                    silent: true
+                }
+            ));
+        }, this);
+
+        each$1(splitLines, function (splitLines, idx) {
+            this.group.add(mergePath(
+                splitLines, {
+                    style: defaults({
+                        fill: 'none',
+                        stroke: splitLineColors[idx % splitLineColors.length]
+                    }, lineStyle),
+                    silent: true
+                }
+            ));
+        }, this);
+
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var RadarSeries = SeriesModel.extend({
+
+    type: 'series.radar',
+
+    dependencies: ['radar'],
+
+
+    // Overwrite
+    init: function (option) {
+        RadarSeries.superApply(this, 'init', arguments);
+
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListSimply(this, {
+            generateCoord: 'indicator_',
+            generateCoordCount: Infinity
+        });
+    },
+
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var coordSys = this.coordinateSystem;
+        var indicatorAxes = coordSys.getIndicatorAxes();
+        var name = this.getData().getName(dataIndex);
+        return encodeHTML(name === '' ? this.name : name) + '<br/>'
+            + map(indicatorAxes, function (axis, idx) {
+                var val = data.get(data.mapDimension(axis.dim), dataIndex);
+                return encodeHTML(axis.name + ' : ' + val);
+            }).join('<br />');
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        coordinateSystem: 'radar',
+        legendHoverLink: true,
+        radarIndex: 0,
+        lineStyle: {
+            width: 2,
+            type: 'solid'
+        },
+        label: {
+            position: 'top'
+        },
+        // areaStyle: {
+        // },
+        // itemStyle: {}
+        symbol: 'emptyCircle',
+        symbolSize: 4
+        // symbolRotate: null
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function normalizeSymbolSize(symbolSize) {
+    if (!isArray(symbolSize)) {
+        symbolSize = [+symbolSize, +symbolSize];
+    }
+    return symbolSize;
+}
+
+extendChartView({
+
+    type: 'radar',
+
+    render: function (seriesModel, ecModel, api) {
+        var polar = seriesModel.coordinateSystem;
+        var group = this.group;
+
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        function createSymbol$$1(data, idx) {
+            var symbolType = data.getItemVisual(idx, 'symbol') || 'circle';
+            var color = data.getItemVisual(idx, 'color');
+            if (symbolType === 'none') {
+                return;
+            }
+            var symbolSize = normalizeSymbolSize(
+                data.getItemVisual(idx, 'symbolSize')
+            );
+            var symbolPath = createSymbol(
+                symbolType, -1, -1, 2, 2, color
+            );
+            symbolPath.attr({
+                style: {
+                    strokeNoScale: true
+                },
+                z2: 100,
+                scale: [symbolSize[0] / 2, symbolSize[1] / 2]
+            });
+            return symbolPath;
+        }
+
+        function updateSymbols(oldPoints, newPoints, symbolGroup, data, idx, isInit) {
+            // Simply rerender all
+            symbolGroup.removeAll();
+            for (var i = 0; i < newPoints.length - 1; i++) {
+                var symbolPath = createSymbol$$1(data, idx);
+                if (symbolPath) {
+                    symbolPath.__dimIdx = i;
+                    if (oldPoints[i]) {
+                        symbolPath.attr('position', oldPoints[i]);
+                        graphic[isInit ? 'initProps' : 'updateProps'](
+                            symbolPath, {
+                                position: newPoints[i]
+                            }, seriesModel, idx
+                        );
+                    }
+                    else {
+                        symbolPath.attr('position', newPoints[i]);
+                    }
+                    symbolGroup.add(symbolPath);
+                }
+            }
+        }
+
+        function getInitialPoints(points) {
+            return map(points, function (pt) {
+                return [polar.cx, polar.cy];
+            });
+        }
+        data.diff(oldData)
+            .add(function (idx) {
+                var points = data.getItemLayout(idx);
+                if (!points) {
+                    return;
+                }
+                var polygon = new Polygon();
+                var polyline = new Polyline();
+                var target = {
+                    shape: {
+                        points: points
+                    }
+                };
+                polygon.shape.points = getInitialPoints(points);
+                polyline.shape.points = getInitialPoints(points);
+                initProps(polygon, target, seriesModel, idx);
+                initProps(polyline, target, seriesModel, idx);
+
+                var itemGroup = new Group();
+                var symbolGroup = new Group();
+                itemGroup.add(polyline);
+                itemGroup.add(polygon);
+                itemGroup.add(symbolGroup);
+
+                updateSymbols(
+                    polyline.shape.points, points, symbolGroup, data, idx, true
+                );
+
+                data.setItemGraphicEl(idx, itemGroup);
+            })
+            .update(function (newIdx, oldIdx) {
+                var itemGroup = oldData.getItemGraphicEl(oldIdx);
+                var polyline = itemGroup.childAt(0);
+                var polygon = itemGroup.childAt(1);
+                var symbolGroup = itemGroup.childAt(2);
+                var target = {
+                    shape: {
+                        points: data.getItemLayout(newIdx)
+                    }
+                };
+                if (!target.shape.points) {
+                    return;
+                }
+                updateSymbols(
+                    polyline.shape.points, target.shape.points, symbolGroup, data, newIdx, false
+                );
+
+                updateProps(polyline, target, seriesModel);
+                updateProps(polygon, target, seriesModel);
+
+                data.setItemGraphicEl(newIdx, itemGroup);
+            })
+            .remove(function (idx) {
+                group.remove(oldData.getItemGraphicEl(idx));
+            })
+            .execute();
+
+        data.eachItemGraphicEl(function (itemGroup, idx) {
+            var itemModel = data.getItemModel(idx);
+            var polyline = itemGroup.childAt(0);
+            var polygon = itemGroup.childAt(1);
+            var symbolGroup = itemGroup.childAt(2);
+            var color = data.getItemVisual(idx, 'color');
+
+            group.add(itemGroup);
+
+            polyline.useStyle(
+                defaults(
+                    itemModel.getModel('lineStyle').getLineStyle(),
+                    {
+                        fill: 'none',
+                        stroke: color
+                    }
+                )
+            );
+            polyline.hoverStyle = itemModel.getModel('emphasis.lineStyle').getLineStyle();
+
+            var areaStyleModel = itemModel.getModel('areaStyle');
+            var hoverAreaStyleModel = itemModel.getModel('emphasis.areaStyle');
+            var polygonIgnore = areaStyleModel.isEmpty() && areaStyleModel.parentModel.isEmpty();
+            var hoverPolygonIgnore = hoverAreaStyleModel.isEmpty() && hoverAreaStyleModel.parentModel.isEmpty();
+
+            hoverPolygonIgnore = hoverPolygonIgnore && polygonIgnore;
+            polygon.ignore = polygonIgnore;
+
+            polygon.useStyle(
+                defaults(
+                    areaStyleModel.getAreaStyle(),
+                    {
+                        fill: color,
+                        opacity: 0.7
+                    }
+                )
+            );
+            polygon.hoverStyle = hoverAreaStyleModel.getAreaStyle();
+
+            var itemStyle = itemModel.getModel('itemStyle').getItemStyle(['color']);
+            var itemHoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+            var labelModel = itemModel.getModel('label');
+            var labelHoverModel = itemModel.getModel('emphasis.label');
+            symbolGroup.eachChild(function (symbolPath) {
+                symbolPath.setStyle(itemStyle);
+                symbolPath.hoverStyle = clone(itemHoverStyle);
+
+                setLabelStyle(
+                    symbolPath.style, symbolPath.hoverStyle, labelModel, labelHoverModel,
+                    {
+                        labelFetcher: data.hostModel,
+                        labelDataIndex: idx,
+                        labelDimIndex: symbolPath.__dimIdx,
+                        defaultText: data.get(data.dimensions[symbolPath.__dimIdx], idx),
+                        autoColor: color,
+                        isRectText: true
+                    }
+                );
+            });
+
+            function onEmphasis() {
+                polygon.attr('ignore', hoverPolygonIgnore);
+            }
+
+            function onNormal() {
+                polygon.attr('ignore', polygonIgnore);
+            }
+
+            itemGroup.off('mouseover').off('mouseout').off('normal').off('emphasis');
+            itemGroup.on('emphasis', onEmphasis)
+                .on('mouseover', onEmphasis)
+                .on('normal', onNormal)
+                .on('mouseout', onNormal);
+
+            setHoverStyle(itemGroup);
+        });
+
+        this._data = data;
+    },
+
+    remove: function () {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var radarLayout = function (ecModel) {
+    ecModel.eachSeriesByType('radar', function (seriesModel) {
+        var data = seriesModel.getData();
+        var points = [];
+        var coordSys = seriesModel.coordinateSystem;
+        if (!coordSys) {
+            return;
+        }
+
+        function pointsConverter(val, idx) {
+            points[idx] = points[idx] || [];
+            points[idx][i] = coordSys.dataToPoint(val, i);
+        }
+        var axes = coordSys.getIndicatorAxes();
+        for (var i = 0; i < axes.length; i++) {
+            data.each(data.mapDimension(axes[i].dim), pointsConverter);
+        }
+
+        data.each(function (idx) {
+            // Close polygon
+            points[idx][0] && points[idx].push(points[idx][0].slice());
+            data.setItemLayout(idx, points[idx]);
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Backward compat for radar chart in 2
+var backwardCompat$1 = function (option) {
+    var polarOptArr = option.polar;
+    if (polarOptArr) {
+        if (!isArray(polarOptArr)) {
+            polarOptArr = [polarOptArr];
+        }
+        var polarNotRadar = [];
+        each$1(polarOptArr, function (polarOpt, idx) {
+            if (polarOpt.indicator) {
+                if (polarOpt.type && !polarOpt.shape) {
+                    polarOpt.shape = polarOpt.type;
+                }
+                option.radar = option.radar || [];
+                if (!isArray(option.radar)) {
+                    option.radar = [option.radar];
+                }
+                option.radar.push(polarOpt);
+            }
+            else {
+                polarNotRadar.push(polarOpt);
+            }
+        });
+        option.polar = polarNotRadar;
+    }
+    each$1(option.series, function (seriesOpt) {
+        if (seriesOpt && seriesOpt.type === 'radar' && seriesOpt.polarIndex) {
+            seriesOpt.radarIndex = seriesOpt.polarIndex;
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+// Must use radar component
+registerVisual(dataColor('radar'));
+registerVisual(visualSymbol('radar', 'circle'));
+registerLayout(radarLayout);
+registerProcessor(dataFilter('radar'));
+registerPreprocessor(backwardCompat$1);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Simple view coordinate system
+ * Mapping given x, y to transformd view x, y
+ */
+
+var v2ApplyTransform$1 = applyTransform;
+
+// Dummy transform node
+function TransformDummy() {
+    Transformable.call(this);
+}
+mixin(TransformDummy, Transformable);
+
+function View(name) {
+    /**
+     * @type {string}
+     */
+    this.name = name;
+
+    /**
+     * @type {Object}
+     */
+    this.zoomLimit;
+
+    Transformable.call(this);
+
+    this._roamTransformable = new TransformDummy();
+
+    this._rawTransformable = new TransformDummy();
+
+    this._center;
+    this._zoom;
+}
+
+View.prototype = {
+
+    constructor: View,
+
+    type: 'view',
+
+    /**
+     * @param {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['x', 'y'],
+
+    /**
+     * Set bounding rect
+     * @param {number} x
+     * @param {number} y
+     * @param {number} width
+     * @param {number} height
+     */
+
+    // PENDING to getRect
+    setBoundingRect: function (x, y, width, height) {
+        this._rect = new BoundingRect(x, y, width, height);
+        return this._rect;
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    // PENDING to getRect
+    getBoundingRect: function () {
+        return this._rect;
+    },
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     * @param {number} width
+     * @param {number} height
+     */
+    setViewRect: function (x, y, width, height) {
+        this.transformTo(x, y, width, height);
+        this._viewRect = new BoundingRect(x, y, width, height);
+    },
+
+    /**
+     * Transformed to particular position and size
+     * @param {number} x
+     * @param {number} y
+     * @param {number} width
+     * @param {number} height
+     */
+    transformTo: function (x, y, width, height) {
+        var rect = this.getBoundingRect();
+        var rawTransform = this._rawTransformable;
+
+        rawTransform.transform = rect.calculateTransform(
+            new BoundingRect(x, y, width, height)
+        );
+
+        rawTransform.decomposeTransform();
+
+        this._updateTransform();
+    },
+
+    /**
+     * Set center of view
+     * @param {Array.<number>} [centerCoord]
+     */
+    setCenter: function (centerCoord) {
+        if (!centerCoord) {
+            return;
+        }
+        this._center = centerCoord;
+
+        this._updateCenterAndZoom();
+    },
+
+    /**
+     * @param {number} zoom
+     */
+    setZoom: function (zoom) {
+        zoom = zoom || 1;
+
+        var zoomLimit = this.zoomLimit;
+        if (zoomLimit) {
+            if (zoomLimit.max != null) {
+                zoom = Math.min(zoomLimit.max, zoom);
+            }
+            if (zoomLimit.min != null) {
+                zoom = Math.max(zoomLimit.min, zoom);
+            }
+        }
+        this._zoom = zoom;
+
+        this._updateCenterAndZoom();
+    },
+
+    /**
+     * Get default center without roam
+     */
+    getDefaultCenter: function () {
+        // Rect before any transform
+        var rawRect = this.getBoundingRect();
+        var cx = rawRect.x + rawRect.width / 2;
+        var cy = rawRect.y + rawRect.height / 2;
+
+        return [cx, cy];
+    },
+
+    getCenter: function () {
+        return this._center || this.getDefaultCenter();
+    },
+
+    getZoom: function () {
+        return this._zoom || 1;
+    },
+
+    /**
+     * @return {Array.<number}
+     */
+    getRoamTransform: function () {
+        return this._roamTransformable.getLocalTransform();
+    },
+
+    /**
+     * Remove roam
+     */
+
+    _updateCenterAndZoom: function () {
+        // Must update after view transform updated
+        var rawTransformMatrix = this._rawTransformable.getLocalTransform();
+        var roamTransform = this._roamTransformable;
+        var defaultCenter = this.getDefaultCenter();
+        var center = this.getCenter();
+        var zoom = this.getZoom();
+
+        center = applyTransform([], center, rawTransformMatrix);
+        defaultCenter = applyTransform([], defaultCenter, rawTransformMatrix);
+
+        roamTransform.origin = center;
+        roamTransform.position = [
+            defaultCenter[0] - center[0],
+            defaultCenter[1] - center[1]
+        ];
+        roamTransform.scale = [zoom, zoom];
+
+        this._updateTransform();
+    },
+
+    /**
+     * Update transform from roam and mapLocation
+     * @private
+     */
+    _updateTransform: function () {
+        var roamTransformable = this._roamTransformable;
+        var rawTransformable = this._rawTransformable;
+
+        rawTransformable.parent = roamTransformable;
+        roamTransformable.updateTransform();
+        rawTransformable.updateTransform();
+
+        copy$1(this.transform || (this.transform = []), rawTransformable.transform || create$1());
+
+        this._rawTransform = rawTransformable.getLocalTransform();
+
+        this.invTransform = this.invTransform || [];
+        invert(this.invTransform, this.transform);
+
+        this.decomposeTransform();
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getViewRect: function () {
+        return this._viewRect;
+    },
+
+    /**
+     * Get view rect after roam transform
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getViewRectAfterRoam: function () {
+        var rect = this.getBoundingRect().clone();
+        rect.applyTransform(this.transform);
+        return rect;
+    },
+
+    /**
+     * Convert a single (lon, lat) data item to (x, y) point.
+     * @param {Array.<number>} data
+     * @param {boolean} noRoam
+     * @param {Array.<number>} [out]
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, noRoam, out) {
+        var transform = noRoam ? this._rawTransform : this.transform;
+        out = out || [];
+        return transform
+            ? v2ApplyTransform$1(out, data, transform)
+            : copy(out, data);
+    },
+
+    /**
+     * Convert a (x, y) point to (lon, lat) data
+     * @param {Array.<number>} point
+     * @return {Array.<number>}
+     */
+    pointToData: function (point) {
+        var invTransform = this.invTransform;
+        return invTransform
+            ? v2ApplyTransform$1([], point, invTransform)
+            : [point[0], point[1]];
+    },
+
+    /**
+     * @implements
+     * see {module:echarts/CoodinateSystem}
+     */
+    convertToPixel: curry(doConvert$1, 'dataToPoint'),
+
+    /**
+     * @implements
+     * see {module:echarts/CoodinateSystem}
+     */
+    convertFromPixel: curry(doConvert$1, 'pointToData'),
+
+    /**
+     * @implements
+     * see {module:echarts/CoodinateSystem}
+     */
+    containPoint: function (point) {
+        return this.getViewRectAfterRoam().contain(point[0], point[1]);
+    }
+
+    /**
+     * @return {number}
+     */
+    // getScalarScale: function () {
+    //     // Use determinant square root of transform to mutiply scalar
+    //     var m = this.transform;
+    //     var det = Math.sqrt(Math.abs(m[0] * m[3] - m[2] * m[1]));
+    //     return det;
+    // }
+};
+
+mixin(View, Transformable);
+
+function doConvert$1(methodName, ecModel, finder, value) {
+    var seriesModel = finder.seriesModel;
+    var coordSys = seriesModel ? seriesModel.coordinateSystem : null; // e.g., graph.
+    return coordSys === this ? coordSys[methodName](value) : null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Fix for 南海诸岛
+
+var geoCoord = [126, 25];
+
+var points$1 = [
+    [[0,3.5],[7,11.2],[15,11.9],[30,7],[42,0.7],[52,0.7],
+        [56,7.7],[59,0.7],[64,0.7],[64,0],[5,0],[0,3.5]],
+    [[13,16.1],[19,14.7],[16,21.7],[11,23.1],[13,16.1]],
+    [[12,32.2],[14,38.5],[15,38.5],[13,32.2],[12,32.2]],
+    [[16,47.6],[12,53.2],[13,53.2],[18,47.6],[16,47.6]],
+    [[6,64.4],[8,70],[9,70],[8,64.4],[6,64.4]],
+    [[23,82.6],[29,79.8],[30,79.8],[25,82.6],[23,82.6]],
+    [[37,70.7],[43,62.3],[44,62.3],[39,70.7],[37,70.7]],
+    [[48,51.1],[51,45.5],[53,45.5],[50,51.1],[48,51.1]],
+    [[51,35],[51,28.7],[53,28.7],[53,35],[51,35]],
+    [[52,22.4],[55,17.5],[56,17.5],[53,22.4],[52,22.4]],
+    [[58,12.6],[62,7],[63,7],[60,12.6],[58,12.6]],
+    [[0,3.5],[0,93.1],[64,93.1],[64,0],[63,0],[63,92.4],
+        [1,92.4],[1,3.5],[0,3.5]]
+];
+
+for (var i$1 = 0; i$1 < points$1.length; i$1++) {
+    for (var k = 0; k < points$1[i$1].length; k++) {
+        points$1[i$1][k][0] /= 10.5;
+        points$1[i$1][k][1] /= -10.5 / 0.75;
+
+        points$1[i$1][k][0] += geoCoord[0];
+        points$1[i$1][k][1] += geoCoord[1];
+    }
+}
+
+var fixNanhai = function (geo) {
+    if (geo.map === 'china') {
+        geo.regions.push(new Region(
+            '南海诸岛',
+            map(points$1, function (exterior) {
+                return {
+                    type: 'polygon',
+                    exterior: exterior
+                };
+            }), geoCoord
+        ));
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var coordsOffsetMap = {
+    '南海诸岛' : [32, 80],
+    // 全国
+    '广东': [0, -10],
+    '香港': [10, 5],
+    '澳门': [-10, 10],
+    //'北京': [-10, 0],
+    '天津': [5, 5]
+};
+
+var fixTextCoord = function (geo) {
+    each$1(geo.regions, function (region) {
+        var coordFix = coordsOffsetMap[region.name];
+        if (coordFix) {
+            var cp = region.center;
+            cp[0] += coordFix[0] / 10.5;
+            cp[1] += -coordFix[1] / (10.5 / 0.75);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var geoCoordMap = {
+    'Russia': [100, 60],
+    'United States': [-99, 38],
+    'United States of America': [-99, 38]
+};
+
+var fixGeoCoord = function (geo) {
+    each$1(geo.regions, function (region) {
+        var geoCoord = geoCoordMap[region.name];
+        if (geoCoord) {
+            var cp = region.center;
+            cp[0] = geoCoord[0];
+            cp[1] = geoCoord[1];
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Fix for 钓鱼岛
+
+// var Region = require('../Region');
+// var zrUtil = require('zrender/src/core/util');
+
+// var geoCoord = [126, 25];
+
+var points$2 = [
+    [
+        [123.45165252685547, 25.73527164402261],
+        [123.49731445312499, 25.73527164402261],
+        [123.49731445312499, 25.750734064600884],
+        [123.45165252685547, 25.750734064600884],
+        [123.45165252685547, 25.73527164402261]
+    ]
+];
+
+var fixDiaoyuIsland = function (geo) {
+    if (geo.map === 'china') {
+        for (var i = 0, len = geo.regions.length; i < len; ++i) {
+            if (geo.regions[i].name === '台湾') {
+                geo.regions[i].geometries.push({
+                    type: 'polygon',
+                    exterior: points$2[0]
+                });
+            }
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Geo fix functions
+var geoFixFuncs = [
+    fixNanhai,
+    fixTextCoord,
+    fixGeoCoord,
+    fixDiaoyuIsland
+];
+
+/**
+ * [Geo description]
+ * @param {string} name Geo name
+ * @param {string} map Map type
+ * @param {Object} geoJson
+ * @param {Object} [specialAreas]
+ *        Specify the positioned areas by left, top, width, height
+ * @param {Object.<string, string>} [nameMap]
+ *        Specify name alias
+ */
+function Geo(name, map$$1, geoJson, specialAreas, nameMap) {
+
+    View.call(this, name);
+
+    /**
+     * Map type
+     * @type {string}
+     */
+    this.map = map$$1;
+
+    this._nameCoordMap = createHashMap();
+
+    this.loadGeoJson(geoJson, specialAreas, nameMap);
+}
+
+Geo.prototype = {
+
+    constructor: Geo,
+
+    type: 'geo',
+
+    /**
+     * @param {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['lng', 'lat'],
+
+    /**
+     * If contain given lng,lat coord
+     * @param {Array.<number>}
+     * @readOnly
+     */
+    containCoord: function (coord) {
+        var regions = this.regions;
+        for (var i = 0; i < regions.length; i++) {
+            if (regions[i].contain(coord)) {
+                return true;
+            }
+        }
+        return false;
+    },
+    /**
+     * @param {Object} geoJson
+     * @param {Object} [specialAreas]
+     *        Specify the positioned areas by left, top, width, height
+     * @param {Object.<string, string>} [nameMap]
+     *        Specify name alias
+     */
+    loadGeoJson: function (geoJson, specialAreas, nameMap) {
+        // https://jsperf.com/try-catch-performance-overhead
+        try {
+            this.regions = geoJson ? parseGeoJson$1(geoJson) : [];
+        }
+        catch (e) {
+            throw 'Invalid geoJson format\n' + e.message;
+        }
+        specialAreas = specialAreas || {};
+        nameMap = nameMap || {};
+        var regions = this.regions;
+        var regionsMap = createHashMap();
+        for (var i = 0; i < regions.length; i++) {
+            var regionName = regions[i].name;
+            // Try use the alias in nameMap
+            regionName = nameMap.hasOwnProperty(regionName) ? nameMap[regionName] : regionName;
+            regions[i].name = regionName;
+
+            regionsMap.set(regionName, regions[i]);
+            // Add geoJson
+            this.addGeoCoord(regionName, regions[i].center);
+
+            // Some area like Alaska in USA map needs to be tansformed
+            // to look better
+            var specialArea = specialAreas[regionName];
+            if (specialArea) {
+                regions[i].transformTo(
+                    specialArea.left, specialArea.top, specialArea.width, specialArea.height
+                );
+            }
+        }
+
+        this._regionsMap = regionsMap;
+
+        this._rect = null;
+
+        each$1(geoFixFuncs, function (fixFunc) {
+            fixFunc(this);
+        }, this);
+    },
+
+    // Overwrite
+    transformTo: function (x, y, width, height) {
+        var rect = this.getBoundingRect();
+
+        rect = rect.clone();
+        // Longitute is inverted
+        rect.y = -rect.y - rect.height;
+
+        var rawTransformable = this._rawTransformable;
+
+        rawTransformable.transform = rect.calculateTransform(
+            new BoundingRect(x, y, width, height)
+        );
+
+        rawTransformable.decomposeTransform();
+
+        var scale = rawTransformable.scale;
+        scale[1] = -scale[1];
+
+        rawTransformable.updateTransform();
+
+        this._updateTransform();
+    },
+
+    /**
+     * @param {string} name
+     * @return {module:echarts/coord/geo/Region}
+     */
+    getRegion: function (name) {
+        return this._regionsMap.get(name);
+    },
+
+    getRegionByCoord: function (coord) {
+        var regions = this.regions;
+        for (var i = 0; i < regions.length; i++) {
+            if (regions[i].contain(coord)) {
+                return regions[i];
+            }
+        }
+    },
+
+    /**
+     * Add geoCoord for indexing by name
+     * @param {string} name
+     * @param {Array.<number>} geoCoord
+     */
+    addGeoCoord: function (name, geoCoord) {
+        this._nameCoordMap.set(name, geoCoord);
+    },
+
+    /**
+     * Get geoCoord by name
+     * @param {string} name
+     * @return {Array.<number>}
+     */
+    getGeoCoord: function (name) {
+        return this._nameCoordMap.get(name);
+    },
+
+    // Overwrite
+    getBoundingRect: function () {
+        if (this._rect) {
+            return this._rect;
+        }
+        var rect;
+
+        var regions = this.regions;
+        for (var i = 0; i < regions.length; i++) {
+            var regionRect = regions[i].getBoundingRect();
+            rect = rect || regionRect.clone();
+            rect.union(regionRect);
+        }
+        // FIXME Always return new ?
+        return (this._rect = rect || new BoundingRect(0, 0, 0, 0));
+    },
+
+    /**
+     * @param {string|Array.<number>} data
+     * @param {boolean} noRoam
+     * @param {Array.<number>} [out]
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, noRoam, out) {
+        if (typeof data === 'string') {
+            // Map area name to geoCoord
+            data = this.getGeoCoord(data);
+        }
+        if (data) {
+            return View.prototype.dataToPoint.call(this, data, noRoam, out);
+        }
+    },
+
+    /**
+     * @inheritDoc
+     */
+    convertToPixel: curry(doConvert, 'dataToPoint'),
+
+    /**
+     * @inheritDoc
+     */
+    convertFromPixel: curry(doConvert, 'pointToData')
+
+};
+
+mixin(Geo, View);
+
+function doConvert(methodName, ecModel, finder, value) {
+    var geoModel = finder.geoModel;
+    var seriesModel = finder.seriesModel;
+
+    var coordSys = geoModel
+        ? geoModel.coordinateSystem
+        : seriesModel
+        ? (
+            seriesModel.coordinateSystem // For map.
+            || (seriesModel.getReferringComponents('geo')[0] || {}).coordinateSystem
+        )
+        : null;
+
+    return coordSys === this ? coordSys[methodName](value) : null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Resize method bound to the geo
+ * @param {module:echarts/coord/geo/GeoModel|module:echarts/chart/map/MapModel} geoModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function resizeGeo(geoModel, api) {
+
+    var boundingCoords = geoModel.get('boundingCoords');
+    if (boundingCoords != null) {
+        var leftTop = boundingCoords[0];
+        var rightBottom = boundingCoords[1];
+        if (isNaN(leftTop[0]) || isNaN(leftTop[1]) || isNaN(rightBottom[0]) || isNaN(rightBottom[1])) {
+            if (__DEV__) {
+                console.error('Invalid boundingCoords');
+            }
+        }
+        else {
+            this.setBoundingRect(leftTop[0], leftTop[1], rightBottom[0] - leftTop[0], rightBottom[1] - leftTop[1]);
+        }
+    }
+
+    var rect = this.getBoundingRect();
+
+    var boxLayoutOption;
+
+    var center = geoModel.get('layoutCenter');
+    var size = geoModel.get('layoutSize');
+
+    var viewWidth = api.getWidth();
+    var viewHeight = api.getHeight();
+
+    var aspectScale = geoModel.get('aspectScale') || 0.75;
+    var aspect = rect.width / rect.height * aspectScale;
+
+    var useCenterAndSize = false;
+
+    if (center && size) {
+        center = [
+            parsePercent$1(center[0], viewWidth),
+            parsePercent$1(center[1], viewHeight)
+        ];
+        size = parsePercent$1(size, Math.min(viewWidth, viewHeight));
+
+        if (!isNaN(center[0]) && !isNaN(center[1]) && !isNaN(size)) {
+            useCenterAndSize = true;
+        }
+        else {
+            if (__DEV__) {
+                console.warn('Given layoutCenter or layoutSize data are invalid. Use left/top/width/height instead.');
+            }
+        }
+    }
+
+    var viewRect;
+    if (useCenterAndSize) {
+        var viewRect = {};
+        if (aspect > 1) {
+            // Width is same with size
+            viewRect.width = size;
+            viewRect.height = size / aspect;
+        }
+        else {
+            viewRect.height = size;
+            viewRect.width = size * aspect;
+        }
+        viewRect.y = center[1] - viewRect.height / 2;
+        viewRect.x = center[0] - viewRect.width / 2;
+    }
+    else {
+        // Use left/top/width/height
+        boxLayoutOption = geoModel.getBoxLayoutParams();
+
+        // 0.75 rate
+        boxLayoutOption.aspect = aspect;
+
+        viewRect = getLayoutRect(boxLayoutOption, {
+            width: viewWidth,
+            height: viewHeight
+        });
+    }
+
+    this.setViewRect(viewRect.x, viewRect.y, viewRect.width, viewRect.height);
+
+    this.setCenter(geoModel.get('center'));
+    this.setZoom(geoModel.get('zoom'));
+}
+
+/**
+ * @param {module:echarts/coord/Geo} geo
+ * @param {module:echarts/model/Model} model
+ * @inner
+ */
+function setGeoCoords(geo, model) {
+    each$1(model.get('geoCoord'), function (geoCoord, name) {
+        geo.addGeoCoord(name, geoCoord);
+    });
+}
+
+if (__DEV__) {
+    var mapNotExistsError = function (name) {
+        console.error('Map ' + name + ' not exists. You can download map file on http://echarts.baidu.com/download-map.html');
+    };
+}
+
+var geoCreator = {
+
+    // For deciding which dimensions to use when creating list data
+    dimensions: Geo.prototype.dimensions,
+
+    create: function (ecModel, api) {
+        var geoList = [];
+
+        // FIXME Create each time may be slow
+        ecModel.eachComponent('geo', function (geoModel, idx) {
+            var name = geoModel.get('map');
+            var mapData = getMap(name);
+            if (__DEV__) {
+                if (!mapData) {
+                    mapNotExistsError(name);
+                }
+            }
+            var geo = new Geo(
+                name + idx, name,
+                mapData && mapData.geoJson, mapData && mapData.specialAreas,
+                geoModel.get('nameMap')
+            );
+            geo.zoomLimit = geoModel.get('scaleLimit');
+            geoList.push(geo);
+
+            setGeoCoords(geo, geoModel);
+
+            geoModel.coordinateSystem = geo;
+            geo.model = geoModel;
+
+            // Inject resize method
+            geo.resize = resizeGeo;
+
+            geo.resize(geoModel, api);
+        });
+
+        ecModel.eachSeries(function (seriesModel) {
+            var coordSys = seriesModel.get('coordinateSystem');
+            if (coordSys === 'geo') {
+                var geoIndex = seriesModel.get('geoIndex') || 0;
+                seriesModel.coordinateSystem = geoList[geoIndex];
+            }
+        });
+
+        // If has map series
+        var mapModelGroupBySeries = {};
+
+        ecModel.eachSeriesByType('map', function (seriesModel) {
+            if (!seriesModel.getHostGeoModel()) {
+                var mapType = seriesModel.getMapType();
+                mapModelGroupBySeries[mapType] = mapModelGroupBySeries[mapType] || [];
+                mapModelGroupBySeries[mapType].push(seriesModel);
+            }
+        });
+
+        each$1(mapModelGroupBySeries, function (mapSeries, mapType) {
+            var mapData = getMap(mapType);
+            if (__DEV__) {
+                if (!mapData) {
+                    mapNotExistsError(mapSeries[0].get('map'));
+                }
+            }
+
+            var nameMapList = map(mapSeries, function (singleMapSeries) {
+                return singleMapSeries.get('nameMap');
+            });
+            var geo = new Geo(
+                mapType, mapType,
+                mapData && mapData.geoJson, mapData && mapData.specialAreas,
+                mergeAll(nameMapList)
+            );
+            geo.zoomLimit = retrieve.apply(null, map(mapSeries, function (singleMapSeries) {
+                return singleMapSeries.get('scaleLimit');
+            }));
+            geoList.push(geo);
+
+            // Inject resize method
+            geo.resize = resizeGeo;
+
+            geo.resize(mapSeries[0], api);
+
+            each$1(mapSeries, function (singleMapSeries) {
+                singleMapSeries.coordinateSystem = geo;
+
+                setGeoCoords(geo, singleMapSeries);
+            });
+        });
+
+        return geoList;
+    },
+
+    /**
+     * Fill given regions array
+     * @param  {Array.<Object>} originRegionArr
+     * @param  {string} mapName
+     * @param  {Object} [nameMap]
+     * @return {Array}
+     */
+    getFilledRegions: function (originRegionArr, mapName, nameMap) {
+        // Not use the original
+        var regionsArr = (originRegionArr || []).slice();
+        nameMap = nameMap || {};
+
+        var map$$1 = getMap(mapName);
+        var geoJson = map$$1 && map$$1.geoJson;
+        if (!geoJson) {
+            if (__DEV__) {
+                mapNotExistsError(mapName);
+            }
+            return originRegionArr;
+        }
+
+        var dataNameMap = createHashMap();
+        var features = geoJson.features;
+        for (var i = 0; i < regionsArr.length; i++) {
+            dataNameMap.set(regionsArr[i].name, regionsArr[i]);
+        }
+
+        for (var i = 0; i < features.length; i++) {
+            var name = features[i].properties.name;
+            if (!dataNameMap.get(name)) {
+                if (nameMap.hasOwnProperty(name)) {
+                    name = nameMap[name];
+                }
+                regionsArr.push({
+                    name: name
+                });
+            }
+        }
+        return regionsArr;
+    }
+};
+
+registerCoordinateSystem('geo', geoCreator);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var MapSeries = SeriesModel.extend({
+
+    type: 'series.map',
+
+    dependencies: ['geo'],
+
+    layoutMode: 'box',
+
+    /**
+     * Only first map series of same mapType will drawMap
+     * @type {boolean}
+     */
+    needsDrawMap: false,
+
+    /**
+     * Group of all map series with same mapType
+     * @type {boolean}
+     */
+    seriesGroup: [],
+
+    init: function (option) {
+
+        // this._fillOption(option, this.getMapType());
+        // this.option = option;
+
+        MapSeries.superApply(this, 'init', arguments);
+
+        this.updateSelectedMap(this._createSelectableList());
+    },
+
+    getInitialData: function (option) {
+        return createListSimply(this, ['value']);
+    },
+
+    mergeOption: function (newOption) {
+        // this._fillOption(newOption, this.getMapType());
+
+        MapSeries.superApply(this, 'mergeOption', arguments);
+
+        this.updateSelectedMap(this._createSelectableList());
+    },
+
+    _createSelectableList: function () {
+        var data = this.getRawData();
+        var valueDim = data.mapDimension('value');
+        var targetList = [];
+        for (var i = 0, len = data.count(); i < len; i++) {
+            targetList.push({
+                name: data.getName(i),
+                value: data.get(valueDim, i),
+                selected: retrieveRawAttr(data, i, 'selected')
+            });
+        }
+
+        targetList = geoCreator.getFilledRegions(targetList, this.getMapType(), this.option.nameMap);
+
+        return targetList;
+    },
+
+    /**
+     * If no host geo model, return null, which means using a
+     * inner exclusive geo model.
+     */
+    getHostGeoModel: function () {
+        var geoIndex = this.option.geoIndex;
+        return geoIndex != null
+            ? this.dependentModels.geo[geoIndex]
+            : null;
+    },
+
+    getMapType: function () {
+        return (this.getHostGeoModel() || this).option.map;
+    },
+
+    _fillOption: function (option, mapName) {
+        // Shallow clone
+        // option = zrUtil.extend({}, option);
+
+        // option.data = geoCreator.getFilledRegions(option.data, mapName, option.nameMap);
+
+        // return option;
+    },
+
+    getRawValue: function (dataIndex) {
+        // Use value stored in data instead because it is calculated from multiple series
+        // FIXME Provide all value of multiple series ?
+        var data = this.getData();
+        return data.get(data.mapDimension('value'), dataIndex);
+    },
+
+    /**
+     * Get model of region
+     * @param  {string} name
+     * @return {module:echarts/model/Model}
+     */
+    getRegionModel: function (regionName) {
+        var data = this.getData();
+        return data.getItemModel(data.indexOfName(regionName));
+    },
+
+    /**
+     * Map tooltip formatter
+     *
+     * @param {number} dataIndex
+     */
+    formatTooltip: function (dataIndex) {
+        // FIXME orignalData and data is a bit confusing
+        var data = this.getData();
+        var formattedValue = addCommas(this.getRawValue(dataIndex));
+        var name = data.getName(dataIndex);
+
+        var seriesGroup = this.seriesGroup;
+        var seriesNames = [];
+        for (var i = 0; i < seriesGroup.length; i++) {
+            var otherIndex = seriesGroup[i].originalData.indexOfName(name);
+            var valueDim = data.mapDimension('value');
+            if (!isNaN(seriesGroup[i].originalData.get(valueDim, otherIndex))) {
+                seriesNames.push(
+                    encodeHTML(seriesGroup[i].name)
+                );
+            }
+        }
+
+        return seriesNames.join(', ') + '<br />'
+            + encodeHTML(name + ' : ' + formattedValue);
+    },
+
+    /**
+     * @implement
+     */
+    getTooltipPosition: function (dataIndex) {
+        if (dataIndex != null) {
+            var name = this.getData().getName(dataIndex);
+            var geo = this.coordinateSystem;
+            var region = geo.getRegion(name);
+
+            return region && geo.dataToPoint(region.center);
+        }
+    },
+
+    setZoom: function (zoom) {
+        this.option.zoom = zoom;
+    },
+
+    setCenter: function (center) {
+        this.option.center = center;
+    },
+
+    defaultOption: {
+        // 一级层叠
+        zlevel: 0,
+        // 二级层叠
+        z: 2,
+
+        coordinateSystem: 'geo',
+
+        // map should be explicitly specified since ec3.
+        map: '',
+
+        // If `geoIndex` is not specified, a exclusive geo will be
+        // created. Otherwise use the specified geo component, and
+        // `map` and `mapType` are ignored.
+        // geoIndex: 0,
+
+        // 'center' | 'left' | 'right' | 'x%' | {number}
+        left: 'center',
+        // 'center' | 'top' | 'bottom' | 'x%' | {number}
+        top: 'center',
+        // right
+        // bottom
+        // width:
+        // height
+
+        // Aspect is width / height. Inited to be geoJson bbox aspect
+        // This parameter is used for scale this aspect
+        aspectScale: 0.75,
+
+        ///// Layout with center and size
+        // If you wan't to put map in a fixed size box with right aspect ratio
+        // This two properties may more conveninet
+        // layoutCenter: [50%, 50%]
+        // layoutSize: 100
+
+
+        // 数值合并方式，默认加和，可选为：
+        // 'sum' | 'average' | 'max' | 'min'
+        // mapValueCalculation: 'sum',
+        // 地图数值计算结果小数精度
+        // mapValuePrecision: 0,
+
+
+        // 显示图例颜色标识（系列标识的小圆点），图例开启时有效
+        showLegendSymbol: true,
+        // 选择模式，默认关闭，可选single，multiple
+        // selectedMode: false,
+        dataRangeHoverLink: true,
+        // 是否开启缩放及漫游模式
+        // roam: false,
+
+        // Define left-top, right-bottom coords to control view
+        // For example, [ [180, 90], [-180, -90] ],
+        // higher priority than center and zoom
+        boundingCoords: null,
+
+        // Default on center of map
+        center: null,
+
+        zoom: 1,
+
+        scaleLimit: null,
+
+        label: {
+            show: false,
+            color: '#000'
+        },
+        // scaleLimit: null,
+        itemStyle: {
+            borderWidth: 0.5,
+            borderColor: '#444',
+            areaColor: '#eee'
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                color: 'rgb(100,0,0)'
+            },
+            itemStyle: {
+                areaColor: 'rgba(255,215,0,0.8)'
+            }
+        }
+    }
+
+});
+
+mixin(MapSeries, selectableMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ATTR = '\0_ec_interaction_mutex';
+
+function take(zr, resourceKey, userKey) {
+    var store = getStore(zr);
+    store[resourceKey] = userKey;
+}
+
+function release(zr, resourceKey, userKey) {
+    var store = getStore(zr);
+    var uKey = store[resourceKey];
+
+    if (uKey === userKey) {
+        store[resourceKey] = null;
+    }
+}
+
+function isTaken(zr, resourceKey) {
+    return !!getStore(zr)[resourceKey];
+}
+
+function getStore(zr) {
+    return zr[ATTR] || (zr[ATTR] = {});
+}
+
+/**
+ * payload: {
+ *     type: 'takeGlobalCursor',
+ *     key: 'dataZoomSelect', or 'brush', or ...,
+ *         If no userKey, release global cursor.
+ * }
+ */
+registerAction(
+    {type: 'takeGlobalCursor', event: 'globalCursorTaken', update: 'update'},
+    function () {}
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @alias module:echarts/component/helper/RoamController
+ * @constructor
+ * @mixin {module:zrender/mixin/Eventful}
+ *
+ * @param {module:zrender/zrender~ZRender} zr
+ */
+function RoamController(zr) {
+
+    /**
+     * @type {Function}
+     */
+    this.pointerChecker;
+
+    /**
+     * @type {module:zrender}
+     */
+    this._zr = zr;
+
+    /**
+     * @type {Object}
+     */
+    this._opt = {};
+
+    // Avoid two roamController bind the same handler
+    var bind$$1 = bind;
+    var mousedownHandler = bind$$1(mousedown, this);
+    var mousemoveHandler = bind$$1(mousemove, this);
+    var mouseupHandler = bind$$1(mouseup, this);
+    var mousewheelHandler = bind$$1(mousewheel, this);
+    var pinchHandler = bind$$1(pinch, this);
+
+    Eventful.call(this);
+
+    /**
+     * @param {Function} pointerChecker
+     *                   input: x, y
+     *                   output: boolean
+     */
+    this.setPointerChecker = function (pointerChecker) {
+        this.pointerChecker = pointerChecker;
+    };
+
+    /**
+     * Notice: only enable needed types. For example, if 'zoom'
+     * is not needed, 'zoom' should not be enabled, otherwise
+     * default mousewheel behaviour (scroll page) will be disabled.
+     *
+     * @param  {boolean|string} [controlType=true] Specify the control type,
+     *                          which can be null/undefined or true/false
+     *                          or 'pan/move' or 'zoom'/'scale'
+     * @param {Object} [opt]
+     * @param {Object} [opt.zoomOnMouseWheel=true]
+     * @param {Object} [opt.moveOnMouseMove=true]
+     * @param {Object} [opt.preventDefaultMouseMove=true] When pan.
+     */
+    this.enable = function (controlType, opt) {
+
+        // Disable previous first
+        this.disable();
+
+        this._opt = defaults(clone(opt) || {}, {
+            zoomOnMouseWheel: true,
+            moveOnMouseMove: true,
+            preventDefaultMouseMove: true
+        });
+
+        if (controlType == null) {
+            controlType = true;
+        }
+
+        if (controlType === true || (controlType === 'move' || controlType === 'pan')) {
+            zr.on('mousedown', mousedownHandler);
+            zr.on('mousemove', mousemoveHandler);
+            zr.on('mouseup', mouseupHandler);
+        }
+        if (controlType === true || (controlType === 'scale' || controlType === 'zoom')) {
+            zr.on('mousewheel', mousewheelHandler);
+            zr.on('pinch', pinchHandler);
+        }
+    };
+
+    this.disable = function () {
+        zr.off('mousedown', mousedownHandler);
+        zr.off('mousemove', mousemoveHandler);
+        zr.off('mouseup', mouseupHandler);
+        zr.off('mousewheel', mousewheelHandler);
+        zr.off('pinch', pinchHandler);
+    };
+
+    this.dispose = this.disable;
+
+    this.isDragging = function () {
+        return this._dragging;
+    };
+
+    this.isPinching = function () {
+        return this._pinching;
+    };
+}
+
+mixin(RoamController, Eventful);
+
+
+function mousedown(e) {
+    if (notLeftMouse(e)
+        || (e.target && e.target.draggable)
+    ) {
+        return;
+    }
+
+    var x = e.offsetX;
+    var y = e.offsetY;
+
+    // Only check on mosedown, but not mousemove.
+    // Mouse can be out of target when mouse moving.
+    if (this.pointerChecker && this.pointerChecker(e, x, y)) {
+        this._x = x;
+        this._y = y;
+        this._dragging = true;
+    }
+}
+
+function mousemove(e) {
+    if (notLeftMouse(e)
+        || !checkKeyBinding(this, 'moveOnMouseMove', e)
+        || !this._dragging
+        || e.gestureEvent === 'pinch'
+        || isTaken(this._zr, 'globalPan')
+    ) {
+        return;
+    }
+
+    var x = e.offsetX;
+    var y = e.offsetY;
+
+    var oldX = this._x;
+    var oldY = this._y;
+
+    var dx = x - oldX;
+    var dy = y - oldY;
+
+    this._x = x;
+    this._y = y;
+
+    this._opt.preventDefaultMouseMove && stop(e.event);
+
+    this.trigger('pan', dx, dy, oldX, oldY, x, y);
+}
+
+function mouseup(e) {
+    if (!notLeftMouse(e)) {
+        this._dragging = false;
+    }
+}
+
+function mousewheel(e) {
+    // wheelDelta maybe -0 in chrome mac.
+    if (!checkKeyBinding(this, 'zoomOnMouseWheel', e) || e.wheelDelta === 0) {
+        return;
+    }
+
+    // Convenience:
+    // Mac and VM Windows on Mac: scroll up: zoom out.
+    // Windows: scroll up: zoom in.
+    var zoomDelta = e.wheelDelta > 0 ? 1.1 : 1 / 1.1;
+    zoom.call(this, e, zoomDelta, e.offsetX, e.offsetY);
+}
+
+function pinch(e) {
+    if (isTaken(this._zr, 'globalPan')) {
+        return;
+    }
+    var zoomDelta = e.pinchScale > 1 ? 1.1 : 1 / 1.1;
+    zoom.call(this, e, zoomDelta, e.pinchX, e.pinchY);
+}
+
+function zoom(e, zoomDelta, zoomX, zoomY) {
+    if (this.pointerChecker && this.pointerChecker(e, zoomX, zoomY)) {
+        // When mouse is out of roamController rect,
+        // default befavoius should not be be disabled, otherwise
+        // page sliding is disabled, contrary to expectation.
+        stop(e.event);
+
+        this.trigger('zoom', zoomDelta, zoomX, zoomY);
+    }
+}
+
+function checkKeyBinding(roamController, prop, e) {
+    var setting = roamController._opt[prop];
+    return setting
+        && (!isString(setting) || e.event[setting + 'Key']);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+/**
+ * For geo and graph.
+ *
+ * @param {Object} controllerHost
+ * @param {module:zrender/Element} controllerHost.target
+ */
+function updateViewOnPan(controllerHost, dx, dy) {
+    var target = controllerHost.target;
+    var pos = target.position;
+    pos[0] += dx;
+    pos[1] += dy;
+    target.dirty();
+}
+
+/**
+ * For geo and graph.
+ *
+ * @param {Object} controllerHost
+ * @param {module:zrender/Element} controllerHost.target
+ * @param {number} controllerHost.zoom
+ * @param {number} controllerHost.zoomLimit like: {min: 1, max: 2}
+ */
+function updateViewOnZoom(controllerHost, zoomDelta, zoomX, zoomY) {
+    var target = controllerHost.target;
+    var zoomLimit = controllerHost.zoomLimit;
+    var pos = target.position;
+    var scale = target.scale;
+
+    var newZoom = controllerHost.zoom = controllerHost.zoom || 1;
+    newZoom *= zoomDelta;
+    if (zoomLimit) {
+        var zoomMin = zoomLimit.min || 0;
+        var zoomMax = zoomLimit.max || Infinity;
+        newZoom = Math.max(
+            Math.min(zoomMax, newZoom),
+            zoomMin
+        );
+    }
+    var zoomScale = newZoom / controllerHost.zoom;
+    controllerHost.zoom = newZoom;
+    // Keep the mouse center when scaling
+    pos[0] -= (zoomX - pos[0]) * (zoomScale - 1);
+    pos[1] -= (zoomY - pos[1]) * (zoomScale - 1);
+    scale[0] *= zoomScale;
+    scale[1] *= zoomScale;
+
+    target.dirty();
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var IRRELEVANT_EXCLUDES = {'axisPointer': 1, 'tooltip': 1, 'brush': 1};
+
+/**
+ * Avoid that: mouse click on a elements that is over geo or graph,
+ * but roam is triggered.
+ */
+function onIrrelevantElement(e, api, targetCoordSysModel) {
+    var model = api.getComponentByElement(e.topTarget);
+    // If model is axisModel, it works only if it is injected with coordinateSystem.
+    var coordSys = model && model.coordinateSystem;
+    return model
+        && model !== targetCoordSysModel
+        && !IRRELEVANT_EXCLUDES[model.mainType]
+        && (coordSys && coordSys.model !== targetCoordSysModel);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getFixedItemStyle(model, scale) {
+    var itemStyle = model.getItemStyle();
+    var areaColor = model.get('areaColor');
+
+    // If user want the color not to be changed when hover,
+    // they should both set areaColor and color to be null.
+    if (areaColor != null) {
+        itemStyle.fill = areaColor;
+    }
+
+    return itemStyle;
+}
+
+function updateMapSelectHandler(mapDraw, mapOrGeoModel, group, api, fromView) {
+    group.off('click');
+    group.off('mousedown');
+
+    if (mapOrGeoModel.get('selectedMode')) {
+
+        group.on('mousedown', function () {
+            mapDraw._mouseDownFlag = true;
+        });
+
+        group.on('click', function (e) {
+            if (!mapDraw._mouseDownFlag) {
+                return;
+            }
+            mapDraw._mouseDownFlag = false;
+
+            var el = e.target;
+            while (!el.__regions) {
+                el = el.parent;
+            }
+            if (!el) {
+                return;
+            }
+
+            var action = {
+                type: (mapOrGeoModel.mainType === 'geo' ? 'geo' : 'map') + 'ToggleSelect',
+                batch: map(el.__regions, function (region) {
+                    return {
+                        name: region.name,
+                        from: fromView.uid
+                    };
+                })
+            };
+            action[mapOrGeoModel.mainType + 'Id'] = mapOrGeoModel.id;
+
+            api.dispatchAction(action);
+
+            updateMapSelected(mapOrGeoModel, group);
+        });
+    }
+}
+
+function updateMapSelected(mapOrGeoModel, group) {
+    // FIXME
+    group.eachChild(function (otherRegionEl) {
+        each$1(otherRegionEl.__regions, function (region) {
+            otherRegionEl.trigger(mapOrGeoModel.isSelected(region.name) ? 'emphasis' : 'normal');
+        });
+    });
+}
+
+/**
+ * @alias module:echarts/component/helper/MapDraw
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {boolean} updateGroup
+ */
+function MapDraw(api, updateGroup) {
+
+    var group = new Group();
+
+    /**
+     * @type {module:echarts/component/helper/RoamController}
+     * @private
+     */
+    this._controller = new RoamController(api.getZr());
+
+    /**
+     * @type {Object} {target, zoom, zoomLimit}
+     * @private
+     */
+    this._controllerHost = {target: updateGroup ? group : null};
+
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = group;
+
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this._updateGroup = updateGroup;
+
+    /**
+     * This flag is used to make sure that only one among
+     * `pan`, `zoom`, `click` can occurs, otherwise 'selected'
+     * action may be triggered when `pan`, which is unexpected.
+     * @type {booelan}
+     */
+    this._mouseDownFlag;
+}
+
+MapDraw.prototype = {
+
+    constructor: MapDraw,
+
+    draw: function (mapOrGeoModel, ecModel, api, fromView, payload) {
+
+        var isGeo = mapOrGeoModel.mainType === 'geo';
+
+        // Map series has data. GEO model that controlled by map series
+        // will be assigned with map data. Other GEO model has no data.
+        var data = mapOrGeoModel.getData && mapOrGeoModel.getData();
+        isGeo && ecModel.eachComponent({mainType: 'series', subType: 'map'}, function (mapSeries) {
+            if (!data && mapSeries.getHostGeoModel() === mapOrGeoModel) {
+                data = mapSeries.getData();
+            }
+        });
+
+        var geo = mapOrGeoModel.coordinateSystem;
+
+        var group = this.group;
+
+        var scale = geo.scale;
+        var groupNewProp = {
+            position: geo.position,
+            scale: scale
+        };
+
+        // No animation when first draw or in action
+        if (!group.childAt(0) || payload) {
+            group.attr(groupNewProp);
+        }
+        else {
+            updateProps(group, groupNewProp, mapOrGeoModel);
+        }
+
+        group.removeAll();
+
+        var itemStyleAccessPath = ['itemStyle'];
+        var hoverItemStyleAccessPath = ['emphasis', 'itemStyle'];
+        var labelAccessPath = ['label'];
+        var hoverLabelAccessPath = ['emphasis', 'label'];
+        var nameMap = createHashMap();
+
+        each$1(geo.regions, function (region) {
+
+            // Consider in GeoJson properties.name may be duplicated, for example,
+            // there is multiple region named "United Kindom" or "France" (so many
+            // colonies). And it is not appropriate to merge them in geo, which
+            // will make them share the same label and bring trouble in label
+            // location calculation.
+            var regionGroup = nameMap.get(region.name)
+                || nameMap.set(region.name, new Group());
+
+            var compoundPath = new CompoundPath({
+                shape: {
+                    paths: []
+                }
+            });
+            regionGroup.add(compoundPath);
+
+            var regionModel = mapOrGeoModel.getRegionModel(region.name) || mapOrGeoModel;
+
+            var itemStyleModel = regionModel.getModel(itemStyleAccessPath);
+            var hoverItemStyleModel = regionModel.getModel(hoverItemStyleAccessPath);
+            var itemStyle = getFixedItemStyle(itemStyleModel, scale);
+            var hoverItemStyle = getFixedItemStyle(hoverItemStyleModel, scale);
+
+            var labelModel = regionModel.getModel(labelAccessPath);
+            var hoverLabelModel = regionModel.getModel(hoverLabelAccessPath);
+
+            var dataIdx;
+            // Use the itemStyle in data if has data
+            if (data) {
+                dataIdx = data.indexOfName(region.name);
+                // Only visual color of each item will be used. It can be encoded by dataRange
+                // But visual color of series is used in symbol drawing
+                //
+                // Visual color for each series is for the symbol draw
+                var visualColor = data.getItemVisual(dataIdx, 'color', true);
+                if (visualColor) {
+                    itemStyle.fill = visualColor;
+                }
+            }
+
+            each$1(region.geometries, function (geometry) {
+                if (geometry.type !== 'polygon') {
+                    return;
+                }
+                compoundPath.shape.paths.push(new Polygon({
+                    shape: {
+                        points: geometry.exterior
+                    }
+                }));
+
+                for (var i = 0; i < (geometry.interiors ? geometry.interiors.length : 0); i++) {
+                    compoundPath.shape.paths.push(new Polygon({
+                        shape: {
+                            points: geometry.interiors[i]
+                        }
+                    }));
+                }
+            });
+
+            compoundPath.setStyle(itemStyle);
+            compoundPath.style.strokeNoScale = true;
+            compoundPath.culling = true;
+            // Label
+            var showLabel = labelModel.get('show');
+            var hoverShowLabel = hoverLabelModel.get('show');
+
+            var isDataNaN = data && isNaN(data.get(data.mapDimension('value'), dataIdx));
+            var itemLayout = data && data.getItemLayout(dataIdx);
+            // In the following cases label will be drawn
+            // 1. In map series and data value is NaN
+            // 2. In geo component
+            // 4. Region has no series legendSymbol, which will be add a showLabel flag in mapSymbolLayout
+            if (
+                (isGeo || isDataNaN && (showLabel || hoverShowLabel))
+                || (itemLayout && itemLayout.showLabel)
+                ) {
+                var query = !isGeo ? dataIdx : region.name;
+                var labelFetcher;
+
+                // Consider dataIdx not found.
+                if (!data || dataIdx >= 0) {
+                    labelFetcher = mapOrGeoModel;
+                }
+
+                var textEl = new Text({
+                    position: region.center.slice(),
+                    scale: [1 / scale[0], 1 / scale[1]],
+                    z2: 10,
+                    silent: true
+                });
+
+                setLabelStyle(
+                    textEl.style, textEl.hoverStyle = {}, labelModel, hoverLabelModel,
+                    {
+                        labelFetcher: labelFetcher,
+                        labelDataIndex: query,
+                        defaultText: region.name,
+                        useInsideStyle: false
+                    },
+                    {
+                        textAlign: 'center',
+                        textVerticalAlign: 'middle'
+                    }
+                );
+
+                regionGroup.add(textEl);
+            }
+
+            // setItemGraphicEl, setHoverStyle after all polygons and labels
+            // are added to the rigionGroup
+            if (data) {
+                data.setItemGraphicEl(dataIdx, regionGroup);
+            }
+            else {
+                var regionModel = mapOrGeoModel.getRegionModel(region.name);
+                // Package custom mouse event for geo component
+                compoundPath.eventData = {
+                    componentType: 'geo',
+                    geoIndex: mapOrGeoModel.componentIndex,
+                    name: region.name,
+                    region: (regionModel && regionModel.option) || {}
+                };
+            }
+
+            var groupRegions = regionGroup.__regions || (regionGroup.__regions = []);
+            groupRegions.push(region);
+
+            setHoverStyle(
+                regionGroup,
+                hoverItemStyle,
+                {hoverSilentOnTouch: !!mapOrGeoModel.get('selectedMode')}
+            );
+
+            group.add(regionGroup);
+        });
+
+        this._updateController(mapOrGeoModel, ecModel, api);
+
+        updateMapSelectHandler(this, mapOrGeoModel, group, api, fromView);
+
+        updateMapSelected(mapOrGeoModel, group);
+    },
+
+    remove: function () {
+        this.group.removeAll();
+        this._controller.dispose();
+        this._controllerHost = {};
+    },
+
+    _updateController: function (mapOrGeoModel, ecModel, api) {
+        var geo = mapOrGeoModel.coordinateSystem;
+        var controller = this._controller;
+        var controllerHost = this._controllerHost;
+
+        controllerHost.zoomLimit = mapOrGeoModel.get('scaleLimit');
+        controllerHost.zoom = geo.getZoom();
+
+        // roamType is will be set default true if it is null
+        controller.enable(mapOrGeoModel.get('roam') || false);
+        var mainType = mapOrGeoModel.mainType;
+
+        function makeActionBase() {
+            var action = {
+                type: 'geoRoam',
+                componentType: mainType
+            };
+            action[mainType + 'Id'] = mapOrGeoModel.id;
+            return action;
+        }
+
+        controller.off('pan').on('pan', function (dx, dy) {
+            this._mouseDownFlag = false;
+
+            updateViewOnPan(controllerHost, dx, dy);
+
+            api.dispatchAction(extend(makeActionBase(), {
+                dx: dx,
+                dy: dy
+            }));
+        }, this);
+
+        controller.off('zoom').on('zoom', function (zoom, mouseX, mouseY) {
+            this._mouseDownFlag = false;
+
+            updateViewOnZoom(controllerHost, zoom, mouseX, mouseY);
+
+            api.dispatchAction(extend(makeActionBase(), {
+                zoom: zoom,
+                originX: mouseX,
+                originY: mouseY
+            }));
+
+            if (this._updateGroup) {
+                var group = this.group;
+                var scale = group.scale;
+                group.traverse(function (el) {
+                    if (el.type === 'text') {
+                        el.attr('scale', [1 / scale[0], 1 / scale[1]]);
+                    }
+                });
+            }
+        }, this);
+
+        controller.setPointerChecker(function (e, x, y) {
+            return geo.getViewRectAfterRoam().contain(x, y)
+                && !onIrrelevantElement(e, api, mapOrGeoModel);
+        });
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'map',
+
+    render: function (mapModel, ecModel, api, payload) {
+        // Not render if it is an toggleSelect action from self
+        if (payload && payload.type === 'mapToggleSelect'
+            && payload.from === this.uid
+        ) {
+            return;
+        }
+
+        var group = this.group;
+        group.removeAll();
+
+        if (mapModel.getHostGeoModel()) {
+            return;
+        }
+
+        // Not update map if it is an roam action from self
+        if (!(payload && payload.type === 'geoRoam'
+                && payload.componentType === 'series'
+                && payload.seriesId === mapModel.id
+            )
+        ) {
+            if (mapModel.needsDrawMap) {
+                var mapDraw = this._mapDraw || new MapDraw(api, true);
+                group.add(mapDraw.group);
+
+                mapDraw.draw(mapModel, ecModel, api, this, payload);
+
+                this._mapDraw = mapDraw;
+            }
+            else {
+                // Remove drawed map
+                this._mapDraw && this._mapDraw.remove();
+                this._mapDraw = null;
+            }
+        }
+        else {
+            var mapDraw = this._mapDraw;
+            mapDraw && group.add(mapDraw.group);
+        }
+
+        mapModel.get('showLegendSymbol') && ecModel.getComponent('legend')
+            && this._renderSymbols(mapModel, ecModel, api);
+    },
+
+    remove: function () {
+        this._mapDraw && this._mapDraw.remove();
+        this._mapDraw = null;
+        this.group.removeAll();
+    },
+
+    dispose: function () {
+        this._mapDraw && this._mapDraw.remove();
+        this._mapDraw = null;
+    },
+
+    _renderSymbols: function (mapModel, ecModel, api) {
+        var originalData = mapModel.originalData;
+        var group = this.group;
+
+        originalData.each(originalData.mapDimension('value'), function (value, idx) {
+            if (isNaN(value)) {
+                return;
+            }
+
+            var layout = originalData.getItemLayout(idx);
+
+            if (!layout || !layout.point) {
+                // Not exists in map
+                return;
+            }
+
+            var point = layout.point;
+            var offset = layout.offset;
+
+            var circle = new Circle({
+                style: {
+                    // Because the special of map draw.
+                    // Which needs statistic of multiple series and draw on one map.
+                    // And each series also need a symbol with legend color
+                    //
+                    // Layout and visual are put one the different data
+                    fill: mapModel.getData().getVisual('color')
+                },
+                shape: {
+                    cx: point[0] + offset * 9,
+                    cy: point[1],
+                    r: 3
+                },
+                silent: true,
+                // Do not overlap the first series, on which labels are displayed.
+                z2: !offset ? 10 : 8
+            });
+
+            // First data on the same region
+            if (!offset) {
+                var fullData = mapModel.mainSeries.getData();
+                var name = originalData.getName(idx);
+
+                var fullIndex = fullData.indexOfName(name);
+
+                var itemModel = originalData.getItemModel(idx);
+                var labelModel = itemModel.getModel('label');
+                var hoverLabelModel = itemModel.getModel('emphasis.label');
+
+                var polygonGroups = fullData.getItemGraphicEl(fullIndex);
+
+                var normalText = retrieve2(
+                    mapModel.getFormattedLabel(idx, 'normal'),
+                    name
+                );
+                var emphasisText = retrieve2(
+                    mapModel.getFormattedLabel(idx, 'emphasis'),
+                    normalText
+                );
+
+                var onEmphasis = function () {
+                    var hoverStyle = setTextStyle({}, hoverLabelModel, {
+                        text: hoverLabelModel.get('show') ? emphasisText : null
+                    }, {isRectText: true, useInsideStyle: false}, true);
+                    circle.style.extendFrom(hoverStyle);
+                    // Make label upper than others if overlaps.
+                    circle.__mapOriginalZ2 = circle.z2;
+                    circle.z2 += 1;
+                };
+
+                var onNormal = function () {
+                    setTextStyle(circle.style, labelModel, {
+                        text: labelModel.get('show') ? normalText : null,
+                        textPosition: labelModel.getShallow('position') || 'bottom'
+                    }, {isRectText: true, useInsideStyle: false});
+
+                    if (circle.__mapOriginalZ2 != null) {
+                        circle.z2 = circle.__mapOriginalZ2;
+                        circle.__mapOriginalZ2 = null;
+                    }
+                };
+
+                polygonGroups.on('mouseover', onEmphasis)
+                    .on('mouseout', onNormal)
+                    .on('emphasis', onEmphasis)
+                    .on('normal', onNormal);
+
+                onNormal();
+            }
+
+            group.add(circle);
+        });
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/coord/View} view
+ * @param {Object} payload
+ * @param {Object} [zoomLimit]
+ */
+function updateCenterAndZoom(
+    view, payload, zoomLimit
+) {
+    var previousZoom = view.getZoom();
+    var center = view.getCenter();
+    var zoom = payload.zoom;
+
+    var point = view.dataToPoint(center);
+
+    if (payload.dx != null && payload.dy != null) {
+        point[0] -= payload.dx;
+        point[1] -= payload.dy;
+
+        var center = view.pointToData(point);
+        view.setCenter(center);
+    }
+    if (zoom != null) {
+        if (zoomLimit) {
+            var zoomMin = zoomLimit.min || 0;
+            var zoomMax = zoomLimit.max || Infinity;
+            zoom = Math.max(
+                Math.min(previousZoom * zoom, zoomMax),
+                zoomMin
+            ) / previousZoom;
+        }
+
+        // Zoom on given point(originX, originY)
+        view.scale[0] *= zoom;
+        view.scale[1] *= zoom;
+        var position = view.position;
+        var fixX = (payload.originX - position[0]) * (zoom - 1);
+        var fixY = (payload.originY - position[1]) * (zoom - 1);
+
+        position[0] -= fixX;
+        position[1] -= fixY;
+
+        view.updateTransform();
+        // Get the new center
+        var center = view.pointToData(point);
+        view.setCenter(center);
+        view.setZoom(zoom * previousZoom);
+    }
+
+    return {
+        center: view.getCenter(),
+        zoom: view.getZoom()
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @payload
+ * @property {string} [componentType=series]
+ * @property {number} [dx]
+ * @property {number} [dy]
+ * @property {number} [zoom]
+ * @property {number} [originX]
+ * @property {number} [originY]
+ */
+registerAction({
+    type: 'geoRoam',
+    event: 'geoRoam',
+    update: 'updateTransform'
+}, function (payload, ecModel) {
+    var componentType = payload.componentType || 'series';
+
+    ecModel.eachComponent(
+        { mainType: componentType, query: payload },
+        function (componentModel) {
+            var geo = componentModel.coordinateSystem;
+            if (geo.type !== 'geo') {
+                return;
+            }
+
+            var res = updateCenterAndZoom(
+                geo, payload, componentModel.get('scaleLimit')
+            );
+
+            componentModel.setCenter
+                && componentModel.setCenter(res.center);
+
+            componentModel.setZoom
+                && componentModel.setZoom(res.zoom);
+
+            // All map series with same `map` use the same geo coordinate system
+            // So the center and zoom must be in sync. Include the series not selected by legend
+            if (componentType === 'series') {
+                each$1(componentModel.seriesGroup, function (seriesModel) {
+                    seriesModel.setCenter(res.center);
+                    seriesModel.setZoom(res.zoom);
+                });
+            }
+        }
+    );
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var mapSymbolLayout = function (ecModel) {
+
+    var processedMapType = {};
+
+    ecModel.eachSeriesByType('map', function (mapSeries) {
+        var mapType = mapSeries.getMapType();
+        if (mapSeries.getHostGeoModel() || processedMapType[mapType]) {
+            return;
+        }
+
+        var mapSymbolOffsets = {};
+
+        each$1(mapSeries.seriesGroup, function (subMapSeries) {
+            var geo = subMapSeries.coordinateSystem;
+            var data = subMapSeries.originalData;
+            if (subMapSeries.get('showLegendSymbol') && ecModel.getComponent('legend')) {
+                data.each(data.mapDimension('value'), function (value, idx) {
+                    var name = data.getName(idx);
+                    var region = geo.getRegion(name);
+
+                    // If input series.data is [11, 22, '-'/null/undefined, 44],
+                    // it will be filled with NaN: [11, 22, NaN, 44] and NaN will
+                    // not be drawn. So here must validate if value is NaN.
+                    if (!region || isNaN(value)) {
+                        return;
+                    }
+
+                    var offset = mapSymbolOffsets[name] || 0;
+
+                    var point = geo.dataToPoint(region.center);
+
+                    mapSymbolOffsets[name] = offset + 1;
+
+                    data.setItemLayout(idx, {
+                        point: point,
+                        offset: offset
+                    });
+                });
+            }
+        });
+
+        // Show label of those region not has legendSymbol(which is offset 0)
+        var data = mapSeries.getData();
+        data.each(function (idx) {
+            var name = data.getName(idx);
+            var layout = data.getItemLayout(idx) || {};
+            layout.showLabel = !mapSymbolOffsets[name];
+            data.setItemLayout(idx, layout);
+        });
+
+        processedMapType[mapType] = true;
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var mapVisual = function (ecModel) {
+    ecModel.eachSeriesByType('map', function (seriesModel) {
+        var colorList = seriesModel.get('color');
+        var itemStyleModel = seriesModel.getModel('itemStyle');
+
+        var areaColor = itemStyleModel.get('areaColor');
+        var color = itemStyleModel.get('color')
+            || colorList[seriesModel.seriesIndex % colorList.length];
+
+        seriesModel.getData().setVisual({
+            'areaColor': areaColor,
+            'color': color
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME 公用？
+/**
+ * @param {Array.<module:echarts/data/List>} datas
+ * @param {string} statisticType 'average' 'sum'
+ * @inner
+ */
+function dataStatistics(datas, statisticType) {
+    var dataNameMap = {};
+
+    each$1(datas, function (data) {
+        data.each(data.mapDimension('value'), function (value, idx) {
+            // Add prefix to avoid conflict with Object.prototype.
+            var mapKey = 'ec-' + data.getName(idx);
+            dataNameMap[mapKey] = dataNameMap[mapKey] || [];
+            if (!isNaN(value)) {
+                dataNameMap[mapKey].push(value);
+            }
+        });
+    });
+
+    return datas[0].map(datas[0].mapDimension('value'), function (value, idx) {
+        var mapKey = 'ec-' + datas[0].getName(idx);
+        var sum = 0;
+        var min = Infinity;
+        var max = -Infinity;
+        var len = dataNameMap[mapKey].length;
+        for (var i = 0; i < len; i++) {
+            min = Math.min(min, dataNameMap[mapKey][i]);
+            max = Math.max(max, dataNameMap[mapKey][i]);
+            sum += dataNameMap[mapKey][i];
+        }
+        var result;
+        if (statisticType === 'min') {
+            result = min;
+        }
+        else if (statisticType === 'max') {
+            result = max;
+        }
+        else if (statisticType === 'average') {
+            result = sum / len;
+        }
+        else {
+            result = sum;
+        }
+        return len === 0 ? NaN : result;
+    });
+}
+
+var mapDataStatistic = function (ecModel) {
+    var seriesGroups = {};
+    ecModel.eachSeriesByType('map', function (seriesModel) {
+        var hostGeoModel = seriesModel.getHostGeoModel();
+        var key = hostGeoModel ? 'o' + hostGeoModel.id : 'i' + seriesModel.getMapType();
+        (seriesGroups[key] = seriesGroups[key] || []).push(seriesModel);
+    });
+
+    each$1(seriesGroups, function (seriesList, key) {
+        var data = dataStatistics(
+            map(seriesList, function (seriesModel) {
+                return seriesModel.getData();
+            }),
+            seriesList[0].get('mapValueCalculation')
+        );
+
+        for (var i = 0; i < seriesList.length; i++) {
+            seriesList[i].originalData = seriesList[i].getData();
+        }
+
+        // FIXME Put where?
+        for (var i = 0; i < seriesList.length; i++) {
+            seriesList[i].seriesGroup = seriesList;
+            seriesList[i].needsDrawMap = i === 0 && !seriesList[i].getHostGeoModel();
+
+            seriesList[i].setData(data.cloneShallow());
+            seriesList[i].mainSeries = seriesList[0];
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var backwardCompat$2 = function (option) {
+    // Save geoCoord
+    var mapSeries = [];
+    each$1(option.series, function (seriesOpt) {
+        if (seriesOpt && seriesOpt.type === 'map') {
+            mapSeries.push(seriesOpt);
+            seriesOpt.map = seriesOpt.map || seriesOpt.mapType;
+            // Put x, y, width, height, x2, y2 in the top level
+            defaults(seriesOpt, seriesOpt.mapLocation);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(mapSymbolLayout);
+registerVisual(mapVisual);
+registerProcessor(PRIORITY.PROCESSOR.STATISTIC, mapDataStatistic);
+registerPreprocessor(backwardCompat$2);
+
+createDataSelectAction('map', [{
+    type: 'mapToggleSelect',
+    event: 'mapselectchanged',
+    method: 'toggleSelected'
+}, {
+    type: 'mapSelect',
+    event: 'mapselected',
+    method: 'select'
+}, {
+    type: 'mapUnSelect',
+    event: 'mapunselected',
+    method: 'unSelect'
+}]);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Link lists and struct (graph or tree)
+ */
+
+var each$7 = each$1;
+
+var DATAS = '\0__link_datas';
+var MAIN_DATA = '\0__link_mainData';
+
+// Caution:
+// In most case, either list or its shallow clones (see list.cloneShallow)
+// is active in echarts process. So considering heap memory consumption,
+// we do not clone tree or graph, but share them among list and its shallow clones.
+// But in some rare case, we have to keep old list (like do animation in chart). So
+// please take care that both the old list and the new list share the same tree/graph.
+
+/**
+ * @param {Object} opt
+ * @param {module:echarts/data/List} opt.mainData
+ * @param {Object} [opt.struct] For example, instance of Graph or Tree.
+ * @param {string} [opt.structAttr] designation: list[structAttr] = struct;
+ * @param {Object} [opt.datas] {dataType: data},
+ *                 like: {node: nodeList, edge: edgeList}.
+ *                 Should contain mainData.
+ * @param {Object} [opt.datasAttr] {dataType: attr},
+ *                 designation: struct[datasAttr[dataType]] = list;
+ */
+function linkList(opt) {
+    var mainData = opt.mainData;
+    var datas = opt.datas;
+
+    if (!datas) {
+        datas = {main: mainData};
+        opt.datasAttr = {main: 'data'};
+    }
+    opt.datas = opt.mainData = null;
+
+    linkAll(mainData, datas, opt);
+
+    // Porxy data original methods.
+    each$7(datas, function (data) {
+        each$7(mainData.TRANSFERABLE_METHODS, function (methodName) {
+            data.wrapMethod(methodName, curry(transferInjection, opt));
+        });
+
+    });
+
+    // Beyond transfer, additional features should be added to `cloneShallow`.
+    mainData.wrapMethod('cloneShallow', curry(cloneShallowInjection, opt));
+
+    // Only mainData trigger change, because struct.update may trigger
+    // another changable methods, which may bring about dead lock.
+    each$7(mainData.CHANGABLE_METHODS, function (methodName) {
+        mainData.wrapMethod(methodName, curry(changeInjection, opt));
+    });
+
+    // Make sure datas contains mainData.
+    assert$1(datas[mainData.dataType] === mainData);
+}
+
+function transferInjection(opt, res) {
+    if (isMainData(this)) {
+        // Transfer datas to new main data.
+        var datas = extend({}, this[DATAS]);
+        datas[this.dataType] = res;
+        linkAll(res, datas, opt);
+    }
+    else {
+        // Modify the reference in main data to point newData.
+        linkSingle(res, this.dataType, this[MAIN_DATA], opt);
+    }
+    return res;
+}
+
+function changeInjection(opt, res) {
+    opt.struct && opt.struct.update(this);
+    return res;
+}
+
+function cloneShallowInjection(opt, res) {
+    // cloneShallow, which brings about some fragilities, may be inappropriate
+    // to be exposed as an API. So for implementation simplicity we can make
+    // the restriction that cloneShallow of not-mainData should not be invoked
+    // outside, but only be invoked here.
+    each$7(res[DATAS], function (data, dataType) {
+        data !== res && linkSingle(data.cloneShallow(), dataType, res, opt);
+    });
+    return res;
+}
+
+/**
+ * Supplement method to List.
+ *
+ * @public
+ * @param {string} [dataType] If not specified, return mainData.
+ * @return {module:echarts/data/List}
+ */
+function getLinkedData(dataType) {
+    var mainData = this[MAIN_DATA];
+    return (dataType == null || mainData == null)
+        ? mainData
+        : mainData[DATAS][dataType];
+}
+
+function isMainData(data) {
+    return data[MAIN_DATA] === data;
+}
+
+function linkAll(mainData, datas, opt) {
+    mainData[DATAS] = {};
+    each$7(datas, function (data, dataType) {
+        linkSingle(data, dataType, mainData, opt);
+    });
+}
+
+function linkSingle(data, dataType, mainData, opt) {
+    mainData[DATAS][dataType] = data;
+    data[MAIN_DATA] = mainData;
+    data.dataType = dataType;
+
+    if (opt.struct) {
+        data[opt.structAttr] = opt.struct;
+        opt.struct[opt.datasAttr[dataType]] = data;
+    }
+
+    // Supplement method.
+    data.getLinkedData = getLinkedData;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Tree data structure
+ *
+ * @module echarts/data/Tree
+ */
+
+/**
+ * @constructor module:echarts/data/Tree~TreeNode
+ * @param {string} name
+ * @param {module:echarts/data/Tree} hostTree
+ */
+var TreeNode = function (name, hostTree) {
+    /**
+     * @type {string}
+     */
+    this.name = name || '';
+
+    /**
+     * Depth of node
+     *
+     * @type {number}
+     * @readOnly
+     */
+    this.depth = 0;
+
+    /**
+     * Height of the subtree rooted at this node.
+     * @type {number}
+     * @readOnly
+     */
+    this.height = 0;
+
+    /**
+     * @type {module:echarts/data/Tree~TreeNode}
+     * @readOnly
+     */
+    this.parentNode = null;
+
+    /**
+     * Reference to list item.
+     * Do not persistent dataIndex outside,
+     * besause it may be changed by list.
+     * If dataIndex -1,
+     * this node is logical deleted (filtered) in list.
+     *
+     * @type {Object}
+     * @readOnly
+     */
+    this.dataIndex = -1;
+
+    /**
+     * @type {Array.<module:echarts/data/Tree~TreeNode>}
+     * @readOnly
+     */
+    this.children = [];
+
+    /**
+     * @type {Array.<module:echarts/data/Tree~TreeNode>}
+     * @pubilc
+     */
+    this.viewChildren = [];
+
+    /**
+     * @type {moduel:echarts/data/Tree}
+     * @readOnly
+     */
+    this.hostTree = hostTree;
+};
+
+TreeNode.prototype = {
+
+    constructor: TreeNode,
+
+    /**
+     * The node is removed.
+     * @return {boolean} is removed.
+     */
+    isRemoved: function () {
+        return this.dataIndex < 0;
+    },
+
+    /**
+     * Travel this subtree (include this node).
+     * Usage:
+     *    node.eachNode(function () { ... }); // preorder
+     *    node.eachNode('preorder', function () { ... }); // preorder
+     *    node.eachNode('postorder', function () { ... }); // postorder
+     *    node.eachNode(
+     *        {order: 'postorder', attr: 'viewChildren'},
+     *        function () { ... }
+     *    ); // postorder
+     *
+     * @param {(Object|string)} options If string, means order.
+     * @param {string=} options.order 'preorder' or 'postorder'
+     * @param {string=} options.attr 'children' or 'viewChildren'
+     * @param {Function} cb If in preorder and return false,
+     *                      its subtree will not be visited.
+     * @param {Object} [context]
+     */
+    eachNode: function (options, cb, context) {
+        if (typeof options === 'function') {
+            context = cb;
+            cb = options;
+            options = null;
+        }
+
+        options = options || {};
+        if (isString(options)) {
+            options = {order: options};
+        }
+
+        var order = options.order || 'preorder';
+        var children = this[options.attr || 'children'];
+
+        var suppressVisitSub;
+        order === 'preorder' && (suppressVisitSub = cb.call(context, this));
+
+        for (var i = 0; !suppressVisitSub && i < children.length; i++) {
+            children[i].eachNode(options, cb, context);
+        }
+
+        order === 'postorder' && cb.call(context, this);
+    },
+
+    /**
+     * Update depth and height of this subtree.
+     *
+     * @param  {number} depth
+     */
+    updateDepthAndHeight: function (depth) {
+        var height = 0;
+        this.depth = depth;
+        for (var i = 0; i < this.children.length; i++) {
+            var child = this.children[i];
+            child.updateDepthAndHeight(depth + 1);
+            if (child.height > height) {
+                height = child.height;
+            }
+        }
+        this.height = height + 1;
+    },
+
+    /**
+     * @param  {string} id
+     * @return {module:echarts/data/Tree~TreeNode}
+     */
+    getNodeById: function (id) {
+        if (this.getId() === id) {
+            return this;
+        }
+        for (var i = 0, children = this.children, len = children.length; i < len; i++) {
+            var res = children[i].getNodeById(id);
+            if (res) {
+                return res;
+            }
+        }
+    },
+
+    /**
+     * @param {module:echarts/data/Tree~TreeNode} node
+     * @return {boolean}
+     */
+    contains: function (node) {
+        if (node === this) {
+            return true;
+        }
+        for (var i = 0, children = this.children, len = children.length; i < len; i++) {
+            var res = children[i].contains(node);
+            if (res) {
+                return res;
+            }
+        }
+    },
+
+    /**
+     * @param {boolean} includeSelf Default false.
+     * @return {Array.<module:echarts/data/Tree~TreeNode>} order: [root, child, grandchild, ...]
+     */
+    getAncestors: function (includeSelf) {
+        var ancestors = [];
+        var node = includeSelf ? this : this.parentNode;
+        while (node) {
+            ancestors.push(node);
+            node = node.parentNode;
+        }
+        ancestors.reverse();
+        return ancestors;
+    },
+
+    /**
+     * @param {string|Array=} [dimension='value'] Default 'value'. can be 0, 1, 2, 3
+     * @return {number} Value.
+     */
+    getValue: function (dimension) {
+        var data = this.hostTree.data;
+        return data.get(data.getDimension(dimension || 'value'), this.dataIndex);
+    },
+
+    /**
+     * @param {Object} layout
+     * @param {boolean=} [merge=false]
+     */
+    setLayout: function (layout, merge$$1) {
+        this.dataIndex >= 0
+            && this.hostTree.data.setItemLayout(this.dataIndex, layout, merge$$1);
+    },
+
+    /**
+     * @return {Object} layout
+     */
+    getLayout: function () {
+        return this.hostTree.data.getItemLayout(this.dataIndex);
+    },
+
+    /**
+     * @param {string} [path]
+     * @return {module:echarts/model/Model}
+     */
+    getModel: function (path) {
+        if (this.dataIndex < 0) {
+            return;
+        }
+        var hostTree = this.hostTree;
+        var itemModel = hostTree.data.getItemModel(this.dataIndex);
+        var levelModel = this.getLevelModel();
+        var leavesModel;
+        if (!levelModel && (this.children.length === 0 || (this.children.length !== 0 && this.isExpand === false))) {
+            leavesModel = this.getLeavesModel();
+        }
+        return itemModel.getModel(path, (levelModel || leavesModel || hostTree.hostModel).getModel(path));
+    },
+
+    /**
+     * @return {module:echarts/model/Model}
+     */
+    getLevelModel: function () {
+        return (this.hostTree.levelModels || [])[this.depth];
+    },
+
+    /**
+     * @return {module:echarts/model/Model}
+     */
+    getLeavesModel: function () {
+        return this.hostTree.leavesModel;
+    },
+
+    /**
+     * @example
+     *  setItemVisual('color', color);
+     *  setItemVisual({
+     *      'color': color
+     *  });
+     */
+    setVisual: function (key, value) {
+        this.dataIndex >= 0
+            && this.hostTree.data.setItemVisual(this.dataIndex, key, value);
+    },
+
+    /**
+     * Get item visual
+     */
+    getVisual: function (key, ignoreParent) {
+        return this.hostTree.data.getItemVisual(this.dataIndex, key, ignoreParent);
+    },
+
+    /**
+     * @public
+     * @return {number}
+     */
+    getRawIndex: function () {
+        return this.hostTree.data.getRawIndex(this.dataIndex);
+    },
+
+    /**
+     * @public
+     * @return {string}
+     */
+    getId: function () {
+        return this.hostTree.data.getId(this.dataIndex);
+    },
+
+    /**
+     * if this is an ancestor of another node
+     *
+     * @public
+     * @param {TreeNode} node another node
+     * @return {boolean} if is ancestor
+     */
+    isAncestorOf: function (node) {
+        var parent = node.parentNode;
+        while (parent) {
+            if (parent === this) {
+                return true;
+            }
+            parent = parent.parentNode;
+        }
+        return false;
+    },
+
+    /**
+     * if this is an descendant of another node
+     *
+     * @public
+     * @param {TreeNode} node another node
+     * @return {boolean} if is descendant
+     */
+    isDescendantOf: function (node) {
+        return node !== this && node.isAncestorOf(this);
+    }
+};
+
+/**
+ * @constructor
+ * @alias module:echarts/data/Tree
+ * @param {module:echarts/model/Model} hostModel
+ * @param {Array.<Object>} levelOptions
+ * @param {Object} leavesOption
+ */
+function Tree(hostModel, levelOptions, leavesOption) {
+    /**
+     * @type {module:echarts/data/Tree~TreeNode}
+     * @readOnly
+     */
+    this.root;
+
+    /**
+     * @type {module:echarts/data/List}
+     * @readOnly
+     */
+    this.data;
+
+    /**
+     * Index of each item is the same as the raw index of coresponding list item.
+     * @private
+     * @type {Array.<module:echarts/data/Tree~TreeNode}
+     */
+    this._nodes = [];
+
+    /**
+     * @private
+     * @readOnly
+     * @type {module:echarts/model/Model}
+     */
+    this.hostModel = hostModel;
+
+    /**
+     * @private
+     * @readOnly
+     * @type {Array.<module:echarts/model/Model}
+     */
+    this.levelModels = map(levelOptions || [], function (levelDefine) {
+        return new Model(levelDefine, hostModel, hostModel.ecModel);
+    });
+
+    this.leavesModel = new Model(leavesOption || {}, hostModel, hostModel.ecModel);
+}
+
+Tree.prototype = {
+
+    constructor: Tree,
+
+    type: 'tree',
+
+    /**
+     * Travel this subtree (include this node).
+     * Usage:
+     *    node.eachNode(function () { ... }); // preorder
+     *    node.eachNode('preorder', function () { ... }); // preorder
+     *    node.eachNode('postorder', function () { ... }); // postorder
+     *    node.eachNode(
+     *        {order: 'postorder', attr: 'viewChildren'},
+     *        function () { ... }
+     *    ); // postorder
+     *
+     * @param {(Object|string)} options If string, means order.
+     * @param {string=} options.order 'preorder' or 'postorder'
+     * @param {string=} options.attr 'children' or 'viewChildren'
+     * @param {Function} cb
+     * @param {Object}   [context]
+     */
+    eachNode: function(options, cb, context) {
+        this.root.eachNode(options, cb, context);
+    },
+
+    /**
+     * @param {number} dataIndex
+     * @return {module:echarts/data/Tree~TreeNode}
+     */
+    getNodeByDataIndex: function (dataIndex) {
+        var rawIndex = this.data.getRawIndex(dataIndex);
+        return this._nodes[rawIndex];
+    },
+
+    /**
+     * @param {string} name
+     * @return {module:echarts/data/Tree~TreeNode}
+     */
+    getNodeByName: function (name) {
+        return this.root.getNodeByName(name);
+    },
+
+    /**
+     * Update item available by list,
+     * when list has been performed options like 'filterSelf' or 'map'.
+     */
+    update: function () {
+        var data = this.data;
+        var nodes = this._nodes;
+
+        for (var i = 0, len = nodes.length; i < len; i++) {
+            nodes[i].dataIndex = -1;
+        }
+
+        for (var i = 0, len = data.count(); i < len; i++) {
+            nodes[data.getRawIndex(i)].dataIndex = i;
+        }
+    },
+
+    /**
+     * Clear all layouts
+     */
+    clearLayouts: function () {
+        this.data.clearItemLayouts();
+    }
+};
+
+/**
+ * data node format:
+ * {
+ *     name: ...
+ *     value: ...
+ *     children: [
+ *         {
+ *             name: ...
+ *             value: ...
+ *             children: ...
+ *         },
+ *         ...
+ *     ]
+ * }
+ *
+ * @static
+ * @param {Object} dataRoot Root node.
+ * @param {module:echarts/model/Model} hostModel
+ * @param {Object} treeOptions
+ * @param {Array.<Object>} treeOptions.levels
+ * @param {Array.<Object>} treeOptions.leaves
+ * @return module:echarts/data/Tree
+ */
+Tree.createTree = function (dataRoot, hostModel, treeOptions) {
+
+    var tree = new Tree(hostModel, treeOptions.levels, treeOptions.leaves);
+    var listData = [];
+    var dimMax = 1;
+
+    buildHierarchy(dataRoot);
+
+    function buildHierarchy(dataNode, parentNode) {
+        var value = dataNode.value;
+        dimMax = Math.max(dimMax, isArray(value) ? value.length : 1);
+
+        listData.push(dataNode);
+
+        var node = new TreeNode(dataNode.name, tree);
+        parentNode
+            ? addChild(node, parentNode)
+            : (tree.root = node);
+
+        tree._nodes.push(node);
+
+        var children = dataNode.children;
+        if (children) {
+            for (var i = 0; i < children.length; i++) {
+                buildHierarchy(children[i], node);
+            }
+        }
+    }
+
+    tree.root.updateDepthAndHeight(0);
+
+    var dimensionsInfo = createDimensions(listData, {
+        coordDimensions: ['value'],
+        dimensionsCount: dimMax
+    });
+
+    var list = new List(dimensionsInfo, hostModel);
+    list.initData(listData);
+
+    linkList({
+        mainData: list,
+        struct: tree,
+        structAttr: 'tree'
+    });
+
+    tree.update();
+
+    return tree;
+};
+
+/**
+ * It is needed to consider the mess of 'list', 'hostModel' when creating a TreeNote,
+ * so this function is not ready and not necessary to be public.
+ *
+ * @param {(module:echarts/data/Tree~TreeNode|Object)} child
+ */
+function addChild(child, node) {
+    var children = node.children;
+    if (child.parentNode === node) {
+        return;
+    }
+
+    children.push(child);
+    child.parentNode = node;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Create data struct and define tree view's series model
+ */
+
+SeriesModel.extend({
+
+    type: 'series.tree',
+
+    layoutInfo: null,
+
+    // can support the position parameters 'left', 'top','right','bottom', 'width',
+    // 'height' in the setOption() with 'merge' mode normal.
+    layoutMode: 'box',
+
+    /**
+     * Init a tree data structure from data in option series
+     * @param  {Object} option  the object used to config echarts view
+     * @return {module:echarts/data/List} storage initial data
+     */
+    getInitialData: function (option) {
+
+        //create an virtual root
+        var root = {name: option.name, children: option.data};
+
+        var leaves = option.leaves || {};
+
+        var treeOption = {};
+
+        treeOption.leaves = leaves;
+
+        var tree = Tree.createTree(root, this, treeOption);
+
+        var treeDepth = 0;
+
+        tree.eachNode('preorder', function (node) {
+            if (node.depth > treeDepth) {
+                treeDepth = node.depth;
+            }
+        });
+
+        var expandAndCollapse = option.expandAndCollapse;
+        var expandTreeDepth = (expandAndCollapse && option.initialTreeDepth >= 0)
+            ? option.initialTreeDepth : treeDepth;
+
+        tree.root.eachNode('preorder', function (node) {
+            var item = node.hostTree.data.getRawDataItem(node.dataIndex);
+            // add item.collapsed != null, because users can collapse node original in the series.data.
+            node.isExpand = (item && item.collapsed != null)
+                ? !item.collapsed
+                : node.depth <= expandTreeDepth;
+        });
+
+        return tree.data;
+    },
+    
+    /**
+     * Make the configuration 'orient' backward compatibly, with 'horizontal = LR', 'vertical = TB'.
+     * @returns {string} orient
+     */
+    getOrient: function () {
+        var orient = this.get('orient');
+        if (orient === 'horizontal') {
+            orient = 'LR';
+        }
+        else if (orient === 'vertical') {
+            orient = 'TB';
+        }
+        return orient;
+    },
+
+    /**
+     * @override
+     * @param {number} dataIndex
+     */
+    formatTooltip: function (dataIndex) {
+        var tree = this.getData().tree;
+        var realRoot = tree.root.children[0];
+        var node = tree.getNodeByDataIndex(dataIndex);
+        var value = node.getValue();
+        var name = node.name;
+        while (node && (node !== realRoot)) {
+            name = node.parentNode.name + '.' + name;
+            node = node.parentNode;
+        }
+        return encodeHTML(name + (
+            (isNaN(value) || value == null) ? '' : ' : ' + value
+        ));
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        // the position of the whole view
+        left: '12%',
+        top: '12%',
+        right: '12%',
+        bottom: '12%',
+
+        // the layout of the tree, two value can be selected, 'orthogonal' or 'radial'
+        layout: 'orthogonal',
+
+        // The orient of orthoginal layout, can be setted to 'LR', 'TB', 'RL', 'BT'.
+        // and the backward compatibility configuration 'horizontal = LR', 'vertical = TB'.
+        orient: 'LR',
+
+        symbol: 'emptyCircle',
+
+        symbolSize: 7,
+
+        expandAndCollapse: true,
+
+        initialTreeDepth: 2,
+
+        lineStyle: {
+            color: '#ccc',
+            width: 1.5,
+            curveness: 0.5
+        },
+
+        itemStyle: {
+            color: 'lightsteelblue',
+            borderColor: '#c23531',
+            borderWidth: 1.5
+        },
+
+        label: {
+            show: true,
+            color: '#555'
+        },
+
+        leaves: {
+            label: {
+                show: true
+            }
+        },
+
+        animationEasing: 'linear',
+
+        animationDuration: 700,
+
+        animationDurationUpdate: 1000
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The tree layout implementation references to d3.js
+* (https://github.com/d3/d3-hierarchy). The use of the source
+* code of this file is also subject to the terms and consitions
+* of its license (BSD-3Clause, see <echarts/src/licenses/LICENSE-d3>).
+*/
+
+/**
+ * @file The layout algorithm of node-link tree diagrams. Here we using Reingold-Tilford algorithm to drawing
+ *       the tree.
+ * @see https://github.com/d3/d3-hierarchy
+ */
+
+/**
+ * Initialize all computational message for following algorithm
+ * @param  {module:echarts/data/Tree~TreeNode} root   The virtual root of the tree
+ */
+function init$2(root) {
+    root.hierNode = {
+        defaultAncestor: null,
+        ancestor: root,
+        prelim: 0,
+        modifier: 0,
+        change: 0,
+        shift: 0,
+        i: 0,
+        thread: null
+    };
+
+    var nodes = [root];
+    var node;
+    var children;
+
+    while (node = nodes.pop()) { // jshint ignore:line
+        children = node.children;
+        if (node.isExpand && children.length) {
+            var n = children.length;
+            for (var i = n - 1; i >= 0; i--) {
+                var child = children[i];
+                child.hierNode = {
+                    defaultAncestor: null,
+                    ancestor: child,
+                    prelim: 0,
+                    modifier: 0,
+                    change: 0,
+                    shift: 0,
+                    i: i,
+                    thread: null
+                };
+                nodes.push(child);
+            }
+        }
+    }
+}
+
+/**
+ * Computes a preliminary x coordinate for node. Before that, this function is
+ * applied recursively to the children of node, as well as the function
+ * apportion(). After spacing out the children by calling executeShifts(), the
+ * node is placed to the midpoint of its outermost children.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @param {Function} separation
+ */
+function firstWalk(node, separation) {
+    var children = node.isExpand ? node.children : [];
+    var siblings = node.parentNode.children;
+    var subtreeW = node.hierNode.i ? siblings[node.hierNode.i -1] : null;
+    if (children.length) {
+        executeShifts(node);
+        var midPoint = (children[0].hierNode.prelim + children[children.length - 1].hierNode.prelim) / 2;
+        if (subtreeW) {
+            node.hierNode.prelim = subtreeW.hierNode.prelim + separation(node, subtreeW);
+            node.hierNode.modifier = node.hierNode.prelim - midPoint;
+        }
+        else {
+            node.hierNode.prelim = midPoint;
+        }
+    }
+    else if (subtreeW) {
+        node.hierNode.prelim = subtreeW.hierNode.prelim + separation(node, subtreeW);
+    }
+    node.parentNode.hierNode.defaultAncestor = apportion(node, subtreeW, node.parentNode.hierNode.defaultAncestor || siblings[0], separation);
+}
+
+
+/**
+ * Computes all real x-coordinates by summing up the modifiers recursively.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ */
+function secondWalk(node) {
+    var nodeX = node.hierNode.prelim + node.parentNode.hierNode.modifier;
+    node.setLayout({x: nodeX}, true);
+    node.hierNode.modifier += node.parentNode.hierNode.modifier;
+}
+
+
+function separation(cb) {
+    return arguments.length ? cb : defaultSeparation;
+}
+
+/**
+ * Transform the common coordinate to radial coordinate
+ * @param  {number} x
+ * @param  {number} y
+ * @return {Object}
+ */
+function radialCoordinate(x, y) {
+    var radialCoor = {};
+    x -= Math.PI / 2;
+    radialCoor.x = y * Math.cos(x);
+    radialCoor.y = y * Math.sin(x);
+    return radialCoor;
+}
+
+/**
+ * Get the layout position of the whole view
+ * @param {module:echarts/model/Series} seriesModel  the model object of sankey series
+ * @param {module:echarts/ExtensionAPI} api  provide the API list that the developer can call
+ * @return {module:zrender/core/BoundingRect}  size of rect to draw the sankey view
+ */
+function getViewRect(seriesModel, api) {
+    return getLayoutRect(
+        seriesModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        }
+    );
+}
+
+/**
+ * All other shifts, applied to the smaller subtrees between w- and w+, are
+ * performed by this function.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ */
+function executeShifts(node) {
+    var children = node.children;
+    var n = children.length;
+    var shift = 0;
+    var change = 0;
+    while (--n >= 0) {
+        var child = children[n];
+        child.hierNode.prelim += shift;
+        child.hierNode.modifier += shift;
+        change += child.hierNode.change;
+        shift += child.hierNode.shift + change;
+    }
+}
+
+/**
+ * The core of the algorithm. Here, a new subtree is combined with the
+ * previous subtrees. Threads are used to traverse the inside and outside
+ * contours of the left and right subtree up to the highest common level.
+ * Whenever two nodes of the inside contours conflict, we compute the left
+ * one of the greatest uncommon ancestors using the function nextAncestor()
+ * and call moveSubtree() to shift the subtree and prepare the shifts of
+ * smaller subtrees. Finally, we add a new thread (if necessary).
+ * @param  {module:echarts/data/Tree~TreeNode} subtreeV
+ * @param  {module:echarts/data/Tree~TreeNode} subtreeW
+ * @param  {module:echarts/data/Tree~TreeNode} ancestor
+ * @param  {Function} separation
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function apportion(subtreeV, subtreeW, ancestor, separation) {
+
+    if (subtreeW) {
+        var nodeOutRight = subtreeV;
+        var nodeInRight = subtreeV;
+        var nodeOutLeft = nodeInRight.parentNode.children[0];
+        var nodeInLeft = subtreeW;
+
+        var sumOutRight = nodeOutRight.hierNode.modifier;
+        var sumInRight = nodeInRight.hierNode.modifier;
+        var sumOutLeft = nodeOutLeft.hierNode.modifier;
+        var sumInLeft = nodeInLeft.hierNode.modifier;
+
+        while (nodeInLeft = nextRight(nodeInLeft), nodeInRight = nextLeft(nodeInRight), nodeInLeft && nodeInRight) {
+            nodeOutRight = nextRight(nodeOutRight);
+            nodeOutLeft = nextLeft(nodeOutLeft);
+            nodeOutRight.hierNode.ancestor = subtreeV;
+            var shift = nodeInLeft.hierNode.prelim + sumInLeft - nodeInRight.hierNode.prelim
+                    - sumInRight + separation(nodeInLeft, nodeInRight);
+            if (shift > 0) {
+                moveSubtree(nextAncestor(nodeInLeft, subtreeV, ancestor), subtreeV, shift);
+                sumInRight += shift;
+                sumOutRight += shift;
+            }
+            sumInLeft += nodeInLeft.hierNode.modifier;
+            sumInRight += nodeInRight.hierNode.modifier;
+            sumOutRight += nodeOutRight.hierNode.modifier;
+            sumOutLeft += nodeOutLeft.hierNode.modifier;
+        }
+        if (nodeInLeft && !nextRight(nodeOutRight)) {
+            nodeOutRight.hierNode.thread = nodeInLeft;
+            nodeOutRight.hierNode.modifier += sumInLeft - sumOutRight;
+
+        }
+        if (nodeInRight && !nextLeft(nodeOutLeft)) {
+            nodeOutLeft.hierNode.thread = nodeInRight;
+            nodeOutLeft.hierNode.modifier += sumInRight - sumOutLeft;
+            ancestor = subtreeV;
+        }
+    }
+    return ancestor;
+}
+
+/**
+ * This function is used to traverse the right contour of a subtree.
+ * It returns the rightmost child of node or the thread of node. The function
+ * returns null if and only if node is on the highest depth of its subtree.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function nextRight(node) {
+    var children = node.children;
+    return children.length && node.isExpand ? children[children.length - 1] : node.hierNode.thread;
+}
+
+/**
+ * This function is used to traverse the left contour of a subtree (or a subforest).
+ * It returns the leftmost child of node or the thread of node. The function
+ * returns null if and only if node is on the highest depth of its subtree.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function nextLeft(node) {
+    var children = node.children;
+    return children.length && node.isExpand ? children[0] : node.hierNode.thread;
+}
+
+/**
+ * If nodeInLeft’s ancestor is a sibling of node, returns nodeInLeft’s ancestor.
+ * Otherwise, returns the specified ancestor.
+ * @param  {module:echarts/data/Tree~TreeNode} nodeInLeft
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @param  {module:echarts/data/Tree~TreeNode} ancestor
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function nextAncestor(nodeInLeft, node, ancestor) {
+    return nodeInLeft.hierNode.ancestor.parentNode === node.parentNode
+        ? nodeInLeft.hierNode.ancestor : ancestor;
+}
+
+/**
+ * Shifts the current subtree rooted at wr. This is done by increasing prelim(w+) and modifier(w+) by shift.
+ * @param  {module:echarts/data/Tree~TreeNode} wl
+ * @param  {module:echarts/data/Tree~TreeNode} wr
+ * @param  {number} shift [description]
+ */
+function moveSubtree(wl, wr,shift) {
+    var change = shift / (wr.hierNode.i - wl.hierNode.i);
+    wr.hierNode.change -= change;
+    wr.hierNode.shift += shift;
+    wr.hierNode.modifier += shift;
+    wr.hierNode.prelim += shift;
+    wl.hierNode.change += change;
+}
+
+function defaultSeparation(node1, node2) {
+    return node1.parentNode === node2.parentNode ? 1 : 2;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  This file used to draw tree view
+ */
+
+extendChartView({
+
+    type: 'tree',
+
+    /**
+     * Init the chart
+     * @override
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    init: function (ecModel, api) {
+
+        /**
+         * @private
+         * @type {module:echarts/data/Tree}
+         */
+        this._oldTree;
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this._mainGroup = new Group();
+
+        this.group.add(this._mainGroup);
+    },
+
+    render: function (seriesModel, ecModel, api, payload) {
+
+        var data = seriesModel.getData();
+
+        var layoutInfo = seriesModel.layoutInfo;
+
+        var group = this._mainGroup;
+
+        var layout = seriesModel.get('layout');
+
+        if (layout === 'radial') {
+            group.attr('position', [layoutInfo.x + layoutInfo.width / 2, layoutInfo.y + layoutInfo.height / 2]);
+        }
+        else {
+            group.attr('position', [layoutInfo.x, layoutInfo.y]);
+        }
+
+        var oldData = this._data;
+
+        var seriesScope = {
+            expandAndCollapse: seriesModel.get('expandAndCollapse'),
+            layout: layout,
+            orient: seriesModel.getOrient(),
+            curvature: seriesModel.get('lineStyle.curveness'),
+            symbolRotate: seriesModel.get('symbolRotate'),
+            symbolOffset: seriesModel.get('symbolOffset'),
+            hoverAnimation: seriesModel.get('hoverAnimation'),
+            useNameLabel: true,
+            fadeIn: true
+        };
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                if (symbolNeedsDraw$1(data, newIdx)) {
+                    // create node and edge
+                    updateNode(data, newIdx, null, group, seriesModel, seriesScope);
+                }
+            })
+            .update(function (newIdx, oldIdx) {
+                var symbolEl = oldData.getItemGraphicEl(oldIdx);
+                if (!symbolNeedsDraw$1(data, newIdx)) {
+                    symbolEl && removeNode(oldData, oldIdx, symbolEl, group, seriesModel, seriesScope);
+                    return;
+                }
+                // update  node and edge
+                updateNode(data, newIdx, symbolEl, group, seriesModel, seriesScope);
+            })
+            .remove(function (oldIdx) {
+                var symbolEl = oldData.getItemGraphicEl(oldIdx);
+                // When remove a collapsed node of subtree, since the collapsed
+                // node haven't been initialized with a symbol element,
+                // you can't found it's symbol element through index.
+                // so if we want to remove the symbol element we should insure
+                // that the symbol element is not null.
+                if (symbolEl) {
+                    removeNode(oldData, oldIdx, symbolEl, group, seriesModel, seriesScope);
+                }
+            })
+            .execute();
+
+        if (seriesScope.expandAndCollapse === true) {
+            data.eachItemGraphicEl(function (el, dataIndex) {
+                el.off('click').on('click', function () {
+                    api.dispatchAction({
+                        type: 'treeExpandAndCollapse',
+                        seriesId: seriesModel.id,
+                        dataIndex: dataIndex
+                    });
+                });
+            });
+        }
+
+        this._data = data;
+    },
+
+    dispose: function () {},
+
+    remove: function () {
+        this._mainGroup.removeAll();
+        this._data = null;
+    }
+
+});
+
+function symbolNeedsDraw$1(data, dataIndex) {
+    var layout = data.getItemLayout(dataIndex);
+
+    return layout
+        && !isNaN(layout.x) && !isNaN(layout.y)
+        && data.getItemVisual(dataIndex, 'symbol') !== 'none';
+}
+
+function getTreeNodeStyle(node, itemModel, seriesScope) {
+    seriesScope.itemModel = itemModel;
+    seriesScope.itemStyle = itemModel.getModel('itemStyle').getItemStyle();
+    seriesScope.hoverItemStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+    seriesScope.lineStyle = itemModel.getModel('lineStyle').getLineStyle();
+    seriesScope.labelModel = itemModel.getModel('label');
+    seriesScope.hoverLabelModel = itemModel.getModel('emphasis.label');
+
+    if (node.isExpand === false && node.children.length !== 0) {
+        seriesScope.symbolInnerColor = seriesScope.itemStyle.fill;
+    }
+    else {
+        seriesScope.symbolInnerColor = '#fff';
+    }
+
+    return seriesScope;
+}
+
+function updateNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope) {
+    var isInit = !symbolEl;
+    var node = data.tree.getNodeByDataIndex(dataIndex);
+    var itemModel = node.getModel();
+    var seriesScope = getTreeNodeStyle(node, itemModel, seriesScope);
+    var virtualRoot = data.tree.root;
+
+    var source = node.parentNode === virtualRoot ? node : node.parentNode || node;
+    var sourceSymbolEl = data.getItemGraphicEl(source.dataIndex);
+    var sourceLayout = source.getLayout();
+    var sourceOldLayout = sourceSymbolEl
+        ? {
+            x: sourceSymbolEl.position[0],
+            y: sourceSymbolEl.position[1],
+            rawX: sourceSymbolEl.__radialOldRawX,
+            rawY: sourceSymbolEl.__radialOldRawY
+        }
+        : sourceLayout;
+    var targetLayout = node.getLayout();
+
+    if (isInit) {
+        symbolEl = new SymbolClz$1(data, dataIndex, seriesScope);
+        symbolEl.attr('position', [sourceOldLayout.x, sourceOldLayout.y]);
+    }
+    else {
+        symbolEl.updateData(data, dataIndex, seriesScope);
+    }
+
+    symbolEl.__radialOldRawX = symbolEl.__radialRawX;
+    symbolEl.__radialOldRawY = symbolEl.__radialRawY;
+    symbolEl.__radialRawX = targetLayout.rawX;
+    symbolEl.__radialRawY = targetLayout.rawY;
+
+    group.add(symbolEl);
+    data.setItemGraphicEl(dataIndex, symbolEl);
+    updateProps(symbolEl, {
+        position: [targetLayout.x, targetLayout.y]
+    }, seriesModel);
+
+    var symbolPath = symbolEl.getSymbolPath();
+
+    if (seriesScope.layout === 'radial') {
+        var realRoot = virtualRoot.children[0];
+        var rootLayout = realRoot.getLayout();
+        var length = realRoot.children.length;
+        var rad;
+        var isLeft;
+
+        if (targetLayout.x === rootLayout.x && node.isExpand === true) {
+            var center = {};
+            center.x = (realRoot.children[0].getLayout().x + realRoot.children[length - 1].getLayout().x) / 2;
+            center.y = (realRoot.children[0].getLayout().y + realRoot.children[length - 1].getLayout().y) / 2;
+            rad = Math.atan2(center.y - rootLayout.y, center.x - rootLayout.x);
+            if (rad < 0) {
+                rad = Math.PI * 2 + rad;
+            }
+            isLeft = center.x < rootLayout.x;
+            if (isLeft) {
+                rad = rad - Math.PI;
+            }
+        }
+        else {
+            rad = Math.atan2(targetLayout.y - rootLayout.y, targetLayout.x - rootLayout.x);
+            if (rad < 0) {
+                rad = Math.PI * 2 + rad;
+            }
+            if (node.children.length === 0 || (node.children.length !== 0 && node.isExpand === false)) {
+                isLeft = targetLayout.x < rootLayout.x;
+                if (isLeft) {
+                    rad = rad - Math.PI;
+                }
+            }
+            else {
+                isLeft = targetLayout.x > rootLayout.x;
+                if (!isLeft) {
+                    rad = rad - Math.PI;
+                }
+            }
+        }
+
+        var textPosition = isLeft ? 'left' : 'right';
+        symbolPath.setStyle({
+            textPosition: textPosition,
+            textRotation: -rad,
+            textOrigin: 'center',
+            verticalAlign: 'middle'
+        });
+    }
+
+    if (node.parentNode && node.parentNode !== virtualRoot) {
+        var edge = symbolEl.__edge;
+        if (!edge) {
+            edge = symbolEl.__edge = new BezierCurve({
+                shape: getEdgeShape(seriesScope, sourceOldLayout, sourceOldLayout),
+                style: defaults({opacity: 0}, seriesScope.lineStyle)
+            });
+        }
+
+        updateProps(edge, {
+            shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
+            style: {opacity: 1}
+        }, seriesModel);
+
+        group.add(edge);
+    }
+}
+
+function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope) {
+    var node = data.tree.getNodeByDataIndex(dataIndex);
+    var virtualRoot = data.tree.root;
+    var itemModel = node.getModel();
+    var seriesScope = getTreeNodeStyle(node, itemModel, seriesScope);
+
+    var source = node.parentNode === virtualRoot ? node : node.parentNode || node;
+    var sourceLayout;
+    while (sourceLayout = source.getLayout(), sourceLayout == null) {
+        source = source.parentNode === virtualRoot ? source : source.parentNode || source;
+    }
+
+    updateProps(symbolEl, {
+        position: [sourceLayout.x + 1, sourceLayout.y + 1]
+    }, seriesModel, function () {
+        group.remove(symbolEl);
+        data.setItemGraphicEl(dataIndex, null);
+    });
+
+    symbolEl.fadeOut(null, {keepLabel: true});
+
+    var edge = symbolEl.__edge;
+    if (edge) {
+        updateProps(edge, {
+            shape: getEdgeShape(seriesScope, sourceLayout, sourceLayout),
+            style: {
+                opacity: 0
+            }
+        }, seriesModel, function () {
+            group.remove(edge);
+        });
+    }
+}
+
+function getEdgeShape(seriesScope, sourceLayout, targetLayout) {
+    var cpx1;
+    var cpy1;
+    var cpx2;
+    var cpy2;
+    var orient = seriesScope.orient;
+
+    if (seriesScope.layout === 'radial') {
+        var x1 = sourceLayout.rawX;
+        var y1 = sourceLayout.rawY;
+        var x2 = targetLayout.rawX;
+        var y2 = targetLayout.rawY;
+
+        var radialCoor1 = radialCoordinate(x1, y1);
+        var radialCoor2 = radialCoordinate(x1, y1 + (y2 - y1) * seriesScope.curvature);
+        var radialCoor3 = radialCoordinate(x2, y2 + (y1 - y2) * seriesScope.curvature);
+        var radialCoor4 = radialCoordinate(x2, y2);
+
+        return {
+            x1: radialCoor1.x,
+            y1: radialCoor1.y,
+            x2: radialCoor4.x,
+            y2: radialCoor4.y,
+            cpx1: radialCoor2.x,
+            cpy1: radialCoor2.y,
+            cpx2: radialCoor3.x,
+            cpy2: radialCoor3.y
+        };
+    }
+    else {
+        var x1 = sourceLayout.x;
+        var y1 = sourceLayout.y;
+        var x2 = targetLayout.x;
+        var y2 = targetLayout.y;
+
+        if (orient === 'LR' || orient === 'RL') {
+            cpx1 = x1 + (x2 - x1) * seriesScope.curvature;
+            cpy1 = y1;
+            cpx2 = x2 + (x1 - x2) * seriesScope.curvature;
+            cpy2 = y2;
+        }
+        if (orient === 'TB' || orient === 'BT') {
+            cpx1 = x1;
+            cpy1 = y1 + (y2 - y1) * seriesScope.curvature;
+            cpx2 = x2;
+            cpy2 = y2 + (y1 - y2) * seriesScope.curvature;
+        }
+        return {
+            x1: x1,
+            y1: y1,
+            x2: x2,
+            y2: y2,
+            cpx1: cpx1,
+            cpy1: cpy1,
+            cpx2: cpx2,
+            cpy2: cpy2
+        };
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction({
+    type: 'treeExpandAndCollapse',
+    event: 'treeExpandAndCollapse',
+    update: 'update'
+}, function (payload, ecModel) {
+    ecModel.eachComponent({mainType: 'series', subType: 'tree', query: payload}, function (seriesModel) {
+        var dataIndex = payload.dataIndex;
+        var tree = seriesModel.getData().tree;
+        var node = tree.getNodeByDataIndex(dataIndex);
+        node.isExpand = !node.isExpand;
+
+    });
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+/**
+ * Traverse the tree from bottom to top and do something
+ * @param  {module:echarts/data/Tree~TreeNode} root  The real root of the tree
+ * @param  {Function} callback
+ */
+function eachAfter (root, callback, separation) {
+    var nodes = [root];
+    var next = [];
+    var node;
+
+    while (node = nodes.pop()) { // jshint ignore:line
+        next.push(node);
+        if (node.isExpand) {
+            var children = node.children;
+            if (children.length) {
+                for (var i = 0; i < children.length; i++) {
+                    nodes.push(children[i]);
+                }
+            }
+        }
+    }
+
+    while (node = next.pop()) { // jshint ignore:line
+        callback(node, separation);
+    }
+}
+
+/**
+ * Traverse the tree from top to bottom and do something
+ * @param  {module:echarts/data/Tree~TreeNode} root  The real root of the tree
+ * @param  {Function} callback
+ */
+function eachBefore (root, callback) {
+    var nodes = [root];
+    var node;
+    while (node = nodes.pop()) { // jshint ignore:line
+        callback(node);
+        if (node.isExpand) {
+            var children = node.children;
+            if (children.length) {
+                for (var i = children.length - 1; i >= 0; i--) {
+                    nodes.push(children[i]);
+                }
+            }
+        }
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var treeLayout = function (ecModel, api) {
+    ecModel.eachSeriesByType('tree', function (seriesModel) {
+        commonLayout(seriesModel, api);
+    });
+};
+
+function commonLayout(seriesModel, api) {
+    var layoutInfo = getViewRect(seriesModel, api);
+    seriesModel.layoutInfo = layoutInfo;
+    var layout = seriesModel.get('layout');
+    var width = 0;
+    var height = 0;
+    var separation$$1 = null;
+    
+    if (layout === 'radial') {
+        width = 2 * Math.PI;
+        height = Math.min(layoutInfo.height, layoutInfo.width) / 2;
+        separation$$1 = separation(function (node1, node2) {
+            return (node1.parentNode === node2.parentNode ? 1 : 2) / node1.depth;
+        });
+    }
+    else {
+        width = layoutInfo.width;
+        height = layoutInfo.height;
+        separation$$1 = separation();
+    }
+
+    var virtualRoot = seriesModel.getData().tree.root;
+    var realRoot = virtualRoot.children[0];
+
+    if (realRoot) {
+        init$2(virtualRoot);
+        eachAfter(realRoot, firstWalk, separation$$1);
+        virtualRoot.hierNode.modifier = - realRoot.hierNode.prelim;
+        eachBefore(realRoot, secondWalk);
+
+        var left = realRoot;
+        var right = realRoot;
+        var bottom = realRoot;
+        eachBefore(realRoot, function (node) {
+            var x = node.getLayout().x;
+            if (x < left.getLayout().x) {
+                left = node;
+            }
+            if (x > right.getLayout().x) {
+                right = node;
+            }
+            if (node.depth > bottom.depth) {
+                bottom = node;
+            }
+        });
+
+        var delta = left === right ? 1 : separation$$1(left, right) / 2;
+        var tx = delta - left.getLayout().x;
+        var kx = 0;
+        var ky = 0;
+        var coorX = 0;
+        var coorY = 0;
+        if (layout === 'radial') {
+            kx = width / (right.getLayout().x + delta + tx);
+            // here we use (node.depth - 1), bucause the real root's depth is 1
+            ky = height / ((bottom.depth - 1) || 1);
+            eachBefore(realRoot, function (node) {
+                coorX = (node.getLayout().x + tx) * kx;
+                coorY = (node.depth - 1) * ky;
+                var finalCoor = radialCoordinate(coorX, coorY);
+                node.setLayout({x: finalCoor.x, y: finalCoor.y, rawX: coorX, rawY: coorY}, true);
+            });
+        }
+        else {
+            var orient = seriesModel.getOrient(); 
+            if (orient === 'RL' || orient === 'LR') {
+                ky = height / (right.getLayout().x + delta + tx);
+                kx = width / ((bottom.depth - 1) || 1);
+                eachBefore(realRoot, function (node) {
+                    coorY = (node.getLayout().x + tx) * ky;
+                    coorX = orient === 'LR'
+                        ? (node.depth - 1) * kx
+                        : width - (node.depth - 1) * kx;
+                    node.setLayout({x: coorX, y: coorY}, true);
+                });
+            }
+            else if (orient === 'TB' || orient === 'BT') {
+                kx = width / (right.getLayout().x + delta + tx);
+                ky = height / ((bottom.depth - 1) || 1);
+                eachBefore(realRoot, function (node) {
+                    coorX = (node.getLayout().x + tx) * kx;
+                    coorY = orient === 'TB'
+                        ? (node.depth - 1) * ky
+                        : height - (node.depth - 1) * ky;
+                    node.setLayout({x: coorX, y: coorY}, true);
+                });
+            }
+        }
+    } 
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(visualSymbol('tree', 'circle'));
+registerLayout(treeLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function retrieveTargetInfo(payload, validPayloadTypes, seriesModel) {
+    if (payload && indexOf(validPayloadTypes, payload.type) >= 0) {
+        var root = seriesModel.getData().tree.root;
+        var targetNode = payload.targetNode;
+        if (targetNode && root.contains(targetNode)) {
+            return {node: targetNode};
+        }
+
+        var targetNodeId = payload.targetNodeId;
+        if (targetNodeId != null && (targetNode = root.getNodeById(targetNodeId))) {
+            return {node: targetNode};
+        }
+    }
+}
+
+// Not includes the given node at the last item.
+function getPathToRoot(node) {
+    var path = [];
+    while (node) {
+        node = node.parentNode;
+        node && path.push(node);
+    }
+    return path.reverse();
+}
+
+function aboveViewRoot(viewRoot, node) {
+    var viewPath = getPathToRoot(viewRoot);
+    return indexOf(viewPath, node) >= 0;
+}
+
+// From root to the input node (the input node will be included).
+function wrapTreePathInfo(node, seriesModel) {
+    var treePathInfo = [];
+
+    while (node) {
+        var nodeDataIndex = node.dataIndex;
+        treePathInfo.push({
+            name: node.name,
+            dataIndex: nodeDataIndex,
+            value: seriesModel.getRawValue(nodeDataIndex)
+        });
+        node = node.parentNode;
+    }
+
+    treePathInfo.reverse();
+
+    return treePathInfo;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.treemap',
+
+    layoutMode: 'box',
+
+    dependencies: ['grid', 'polar'],
+
+    /**
+     * @type {module:echarts/data/Tree~Node}
+     */
+    _viewRoot: null,
+
+    defaultOption: {
+        // Disable progressive rendering
+        progressive: 0,
+        hoverLayerThreshold: Infinity,
+        // center: ['50%', '50%'],          // not supported in ec3.
+        // size: ['80%', '80%'],            // deprecated, compatible with ec2.
+        left: 'center',
+        top: 'middle',
+        right: null,
+        bottom: null,
+        width: '80%',
+        height: '80%',
+        sort: true,                         // Can be null or false or true
+                                            // (order by desc default, asc not supported yet (strange effect))
+        clipWindow: 'origin',               // Size of clipped window when zooming. 'origin' or 'fullscreen'
+        squareRatio: 0.5 * (1 + Math.sqrt(5)), // golden ratio
+        leafDepth: null,                    // Nodes on depth from root are regarded as leaves.
+                                            // Count from zero (zero represents only view root).
+        drillDownIcon: '▶',                 // Use html character temporarily because it is complicated
+                                            // to align specialized icon. ▷▶❒❐▼✚
+
+        zoomToNodeRatio: 0.32 * 0.32,       // Be effective when using zoomToNode. Specify the proportion of the
+                                            // target node area in the view area.
+        roam: true,                         // true, false, 'scale' or 'zoom', 'move'.
+        nodeClick: 'zoomToNode',            // Leaf node click behaviour: 'zoomToNode', 'link', false.
+                                            // If leafDepth is set and clicking a node which has children but
+                                            // be on left depth, the behaviour would be changing root. Otherwise
+                                            // use behavious defined above.
+        animation: true,
+        animationDurationUpdate: 900,
+        animationEasing: 'quinticInOut',
+        breadcrumb: {
+            show: true,
+            height: 22,
+            left: 'center',
+            top: 'bottom',
+            // right
+            // bottom
+            emptyItemWidth: 25,             // Width of empty node.
+            itemStyle: {
+                color: 'rgba(0,0,0,0.7)', //'#5793f3',
+                borderColor: 'rgba(255,255,255,0.7)',
+                borderWidth: 1,
+                shadowColor: 'rgba(150,150,150,1)',
+                shadowBlur: 3,
+                shadowOffsetX: 0,
+                shadowOffsetY: 0,
+                textStyle: {
+                    color: '#fff'
+                }
+            },
+            emphasis: {
+                textStyle: {}
+            }
+        },
+        label: {
+            show: true,
+            // Do not use textDistance, for ellipsis rect just the same as treemap node rect.
+            distance: 0,
+            padding: 5,
+            position: 'inside', // Can be [5, '5%'] or position stirng like 'insideTopLeft', ...
+            // formatter: null,
+            color: '#fff',
+            ellipsis: true
+            // align
+            // verticalAlign
+        },
+        upperLabel: {                   // Label when node is parent.
+            show: false,
+            position: [0, '50%'],
+            height: 20,
+            // formatter: null,
+            color: '#fff',
+            ellipsis: true,
+            // align: null,
+            verticalAlign: 'middle'
+        },
+        itemStyle: {
+            color: null,            // Can be 'none' if not necessary.
+            colorAlpha: null,       // Can be 'none' if not necessary.
+            colorSaturation: null,  // Can be 'none' if not necessary.
+            borderWidth: 0,
+            gapWidth: 0,
+            borderColor: '#fff',
+            borderColorSaturation: null // If specified, borderColor will be ineffective, and the
+                                        // border color is evaluated by color of current node and
+                                        // borderColorSaturation.
+        },
+        emphasis: {
+            upperLabel: {
+                show: true,
+                position: [0, '50%'],
+                color: '#fff',
+                ellipsis: true,
+                verticalAlign: 'middle'
+            }
+        },
+
+        visualDimension: 0,                 // Can be 0, 1, 2, 3.
+        visualMin: null,
+        visualMax: null,
+
+        color: [],                  // + treemapSeries.color should not be modified. Please only modified
+                                    // level[n].color (if necessary).
+                                    // + Specify color list of each level. level[0].color would be global
+                                    // color list if not specified. (see method `setDefault`).
+                                    // + But set as a empty array to forbid fetch color from global palette
+                                    // when using nodeModel.get('color'), otherwise nodes on deep level
+                                    // will always has color palette set and are not able to inherit color
+                                    // from parent node.
+                                    // + TreemapSeries.color can not be set as 'none', otherwise effect
+                                    // legend color fetching (see seriesColor.js).
+        colorAlpha: null,           // Array. Specify color alpha range of each level, like [0.2, 0.8]
+        colorSaturation: null,      // Array. Specify color saturation of each level, like [0.2, 0.5]
+        colorMappingBy: 'index',    // 'value' or 'index' or 'id'.
+        visibleMin: 10,             // If area less than this threshold (unit: pixel^2), node will not
+                                    // be rendered. Only works when sort is 'asc' or 'desc'.
+        childrenVisibleMin: null,   // If area of a node less than this threshold (unit: pixel^2),
+                                    // grandchildren will not show.
+                                    // Why grandchildren? If not grandchildren but children,
+                                    // some siblings show children and some not,
+                                    // the appearance may be mess and not consistent,
+        levels: []                  // Each item: {
+                                    //     visibleMin, itemStyle, visualDimension, label
+                                    // }
+        // data: {
+        //      value: [],
+        //      children: [],
+        //      link: 'http://xxx.xxx.xxx',
+        //      target: 'blank' or 'self'
+        // }
+    },
+
+    /**
+     * @override
+     */
+    getInitialData: function (option, ecModel) {
+        // Create a virtual root.
+        var root = {name: option.name, children: option.data};
+
+        completeTreeValue(root);
+
+        var levels = option.levels || [];
+
+        levels = option.levels = setDefault(levels, ecModel);
+
+        var treeOption = {};
+
+        treeOption.levels = levels;
+
+        // Make sure always a new tree is created when setOption,
+        // in TreemapView, we check whether oldTree === newTree
+        // to choose mappings approach among old shapes and new shapes.
+        return Tree.createTree(root, this, treeOption).data;
+    },
+
+    optionUpdated: function () {
+        this.resetViewRoot();
+    },
+
+    /**
+     * @override
+     * @param {number} dataIndex
+     * @param {boolean} [mutipleSeries=false]
+     */
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var value = this.getRawValue(dataIndex);
+        var formattedValue = isArray(value)
+            ? addCommas(value[0]) : addCommas(value);
+        var name = data.getName(dataIndex);
+
+        return encodeHTML(name + ': ' + formattedValue);
+    },
+
+    /**
+     * Add tree path to tooltip param
+     *
+     * @override
+     * @param {number} dataIndex
+     * @return {Object}
+     */
+    getDataParams: function (dataIndex) {
+        var params = SeriesModel.prototype.getDataParams.apply(this, arguments);
+
+        var node = this.getData().tree.getNodeByDataIndex(dataIndex);
+        params.treePathInfo = wrapTreePathInfo(node, this);
+
+        return params;
+    },
+
+    /**
+     * @public
+     * @param {Object} layoutInfo {
+     *                                x: containerGroup x
+     *                                y: containerGroup y
+     *                                width: containerGroup width
+     *                                height: containerGroup height
+     *                            }
+     */
+    setLayoutInfo: function (layoutInfo) {
+        /**
+         * @readOnly
+         * @type {Object}
+         */
+        this.layoutInfo = this.layoutInfo || {};
+        extend(this.layoutInfo, layoutInfo);
+    },
+
+    /**
+     * @param  {string} id
+     * @return {number} index
+     */
+    mapIdToIndex: function (id) {
+        // A feature is implemented:
+        // index is monotone increasing with the sequence of
+        // input id at the first time.
+        // This feature can make sure that each data item and its
+        // mapped color have the same index between data list and
+        // color list at the beginning, which is useful for user
+        // to adjust data-color mapping.
+
+        /**
+         * @private
+         * @type {Object}
+         */
+        var idIndexMap = this._idIndexMap;
+
+        if (!idIndexMap) {
+            idIndexMap = this._idIndexMap = createHashMap();
+            /**
+             * @private
+             * @type {number}
+             */
+            this._idIndexMapCount = 0;
+        }
+
+        var index = idIndexMap.get(id);
+        if (index == null) {
+            idIndexMap.set(id, index = this._idIndexMapCount++);
+        }
+
+        return index;
+    },
+
+    getViewRoot: function () {
+        return this._viewRoot;
+    },
+
+    /**
+     * @param {module:echarts/data/Tree~Node} [viewRoot]
+     */
+    resetViewRoot: function (viewRoot) {
+        viewRoot
+            ? (this._viewRoot = viewRoot)
+            : (viewRoot = this._viewRoot);
+
+        var root = this.getRawData().tree.root;
+
+        if (!viewRoot
+            || (viewRoot !== root && !root.contains(viewRoot))
+        ) {
+            this._viewRoot = root;
+        }
+    }
+});
+
+/**
+ * @param {Object} dataNode
+ */
+function completeTreeValue(dataNode) {
+    // Postorder travel tree.
+    // If value of none-leaf node is not set,
+    // calculate it by suming up the value of all children.
+    var sum = 0;
+
+    each$1(dataNode.children, function (child) {
+
+        completeTreeValue(child);
+
+        var childValue = child.value;
+        isArray(childValue) && (childValue = childValue[0]);
+
+        sum += childValue;
+    });
+
+    var thisValue = dataNode.value;
+    if (isArray(thisValue)) {
+        thisValue = thisValue[0];
+    }
+
+    if (thisValue == null || isNaN(thisValue)) {
+        thisValue = sum;
+    }
+    // Value should not less than 0.
+    if (thisValue < 0) {
+        thisValue = 0;
+    }
+
+    isArray(dataNode.value)
+        ? (dataNode.value[0] = thisValue)
+        : (dataNode.value = thisValue);
+}
+
+/**
+ * set default to level configuration
+ */
+function setDefault(levels, ecModel) {
+    var globalColorList = ecModel.get('color');
+
+    if (!globalColorList) {
+        return;
+    }
+
+    levels = levels || [];
+    var hasColorDefine;
+    each$1(levels, function (levelDefine) {
+        var model = new Model(levelDefine);
+        var modelColor = model.get('color');
+
+        if (model.get('itemStyle.color')
+            || (modelColor && modelColor !== 'none')
+        ) {
+            hasColorDefine = true;
+        }
+    });
+
+    if (!hasColorDefine) {
+        var level0 = levels[0] || (levels[0] = {});
+        level0.color = globalColorList.slice();
+    }
+
+    return levels;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TEXT_PADDING = 8;
+var ITEM_GAP = 8;
+var ARRAY_LENGTH = 5;
+
+function Breadcrumb(containerGroup) {
+    /**
+     * @private
+     * @type {module:zrender/container/Group}
+     */
+    this.group = new Group();
+
+    containerGroup.add(this.group);
+}
+
+Breadcrumb.prototype = {
+
+    constructor: Breadcrumb,
+
+    render: function (seriesModel, api, targetNode, onSelect) {
+        var model = seriesModel.getModel('breadcrumb');
+        var thisGroup = this.group;
+
+        thisGroup.removeAll();
+
+        if (!model.get('show') || !targetNode) {
+            return;
+        }
+
+        var normalStyleModel = model.getModel('itemStyle');
+        // var emphasisStyleModel = model.getModel('emphasis.itemStyle');
+        var textStyleModel = normalStyleModel.getModel('textStyle');
+
+        var layoutParam = {
+            pos: {
+                left: model.get('left'),
+                right: model.get('right'),
+                top: model.get('top'),
+                bottom: model.get('bottom')
+            },
+            box: {
+                width: api.getWidth(),
+                height: api.getHeight()
+            },
+            emptyItemWidth: model.get('emptyItemWidth'),
+            totalWidth: 0,
+            renderList: []
+        };
+
+        this._prepare(targetNode, layoutParam, textStyleModel);
+        this._renderContent(seriesModel, layoutParam, normalStyleModel, textStyleModel, onSelect);
+
+        positionElement(thisGroup, layoutParam.pos, layoutParam.box);
+    },
+
+    /**
+     * Prepare render list and total width
+     * @private
+     */
+    _prepare: function (targetNode, layoutParam, textStyleModel) {
+        for (var node = targetNode; node; node = node.parentNode) {
+            var text = node.getModel().get('name');
+            var textRect = textStyleModel.getTextRect(text);
+            var itemWidth = Math.max(
+                textRect.width + TEXT_PADDING * 2,
+                layoutParam.emptyItemWidth
+            );
+            layoutParam.totalWidth += itemWidth + ITEM_GAP;
+            layoutParam.renderList.push({node: node, text: text, width: itemWidth});
+        }
+    },
+
+    /**
+     * @private
+     */
+    _renderContent: function (
+        seriesModel, layoutParam, normalStyleModel, textStyleModel, onSelect
+    ) {
+        // Start rendering.
+        var lastX = 0;
+        var emptyItemWidth = layoutParam.emptyItemWidth;
+        var height = seriesModel.get('breadcrumb.height');
+        var availableSize = getAvailableSize(layoutParam.pos, layoutParam.box);
+        var totalWidth = layoutParam.totalWidth;
+        var renderList = layoutParam.renderList;
+
+        for (var i = renderList.length - 1; i >= 0; i--) {
+            var item = renderList[i];
+            var itemNode = item.node;
+            var itemWidth = item.width;
+            var text = item.text;
+
+            // Hdie text and shorten width if necessary.
+            if (totalWidth > availableSize.width) {
+                totalWidth -= itemWidth - emptyItemWidth;
+                itemWidth = emptyItemWidth;
+                text = null;
+            }
+
+            var el = new Polygon({
+                shape: {
+                    points: makeItemPoints(
+                        lastX, 0, itemWidth, height,
+                        i === renderList.length - 1, i === 0
+                    )
+                },
+                style: defaults(
+                    normalStyleModel.getItemStyle(),
+                    {
+                        lineJoin: 'bevel',
+                        text: text,
+                        textFill: textStyleModel.getTextColor(),
+                        textFont: textStyleModel.getFont()
+                    }
+                ),
+                z: 10,
+                onclick: curry(onSelect, itemNode)
+            });
+            this.group.add(el);
+
+            packEventData(el, seriesModel, itemNode);
+
+            lastX += itemWidth + ITEM_GAP;
+        }
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this.group.removeAll();
+    }
+};
+
+function makeItemPoints(x, y, itemWidth, itemHeight, head, tail) {
+    var points = [
+        [head ? x : x - ARRAY_LENGTH, y],
+        [x + itemWidth, y],
+        [x + itemWidth, y + itemHeight],
+        [head ? x : x - ARRAY_LENGTH, y + itemHeight]
+    ];
+    !tail && points.splice(2, 0, [x + itemWidth + ARRAY_LENGTH, y + itemHeight / 2]);
+    !head && points.push([x, y + itemHeight / 2]);
+    return points;
+}
+
+// Package custom mouse event.
+function packEventData(el, seriesModel, itemNode) {
+    el.eventData = {
+        componentType: 'series',
+        componentSubType: 'treemap',
+        seriesIndex: seriesModel.componentIndex,
+        seriesName: seriesModel.name,
+        seriesType: 'treemap',
+        selfType: 'breadcrumb', // Distinguish with click event on treemap node.
+        nodeData: {
+            dataIndex: itemNode && itemNode.dataIndex,
+            name: itemNode && itemNode.name
+        },
+        treePathInfo: itemNode && wrapTreePathInfo(itemNode, seriesModel)
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {number} [time=500] Time in ms
+ * @param {string} [easing='linear']
+ * @param {number} [delay=0]
+ * @param {Function} [callback]
+ *
+ * @example
+ *  // Animate position
+ *  animation
+ *      .createWrap()
+ *      .add(el1, {position: [10, 10]})
+ *      .add(el2, {shape: {width: 500}, style: {fill: 'red'}}, 400)
+ *      .done(function () { // done })
+ *      .start('cubicOut');
+ */
+function createWrap() {
+
+    var storage = [];
+    var elExistsMap = {};
+    var doneCallback;
+
+    return {
+
+        /**
+         * Caution: a el can only be added once, otherwise 'done'
+         * might not be called. This method checks this (by el.id),
+         * suppresses adding and returns false when existing el found.
+         *
+         * @param {modele:zrender/Element} el
+         * @param {Object} target
+         * @param {number} [time=500]
+         * @param {number} [delay=0]
+         * @param {string} [easing='linear']
+         * @return {boolean} Whether adding succeeded.
+         *
+         * @example
+         *     add(el, target, time, delay, easing);
+         *     add(el, target, time, easing);
+         *     add(el, target, time);
+         *     add(el, target);
+         */
+        add: function (el, target, time, delay, easing) {
+            if (isString(delay)) {
+                easing = delay;
+                delay = 0;
+            }
+
+            if (elExistsMap[el.id]) {
+                return false;
+            }
+            elExistsMap[el.id] = 1;
+
+            storage.push(
+                {el: el, target: target, time: time, delay: delay, easing: easing}
+            );
+
+            return true;
+        },
+
+        /**
+         * Only execute when animation finished. Will not execute when any
+         * of 'stop' or 'stopAnimation' called.
+         *
+         * @param {Function} callback
+         */
+        done: function (callback) {
+            doneCallback = callback;
+            return this;
+        },
+
+        /**
+         * Will stop exist animation firstly.
+         */
+        start: function () {
+            var count = storage.length;
+
+            for (var i = 0, len = storage.length; i < len; i++) {
+                var item = storage[i];
+                item.el.animateTo(item.target, item.time, item.delay, item.easing, done);
+            }
+
+            return this;
+
+            function done() {
+                count--;
+                if (!count) {
+                    storage.length = 0;
+                    elExistsMap = {};
+                    doneCallback && doneCallback();
+                }
+            }
+        }
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$1 = bind;
+var Group$2 = Group;
+var Rect$1 = Rect;
+var each$8 = each$1;
+
+var DRAG_THRESHOLD = 3;
+var PATH_LABEL_NOAMAL = ['label'];
+var PATH_LABEL_EMPHASIS = ['emphasis', 'label'];
+var PATH_UPPERLABEL_NORMAL = ['upperLabel'];
+var PATH_UPPERLABEL_EMPHASIS = ['emphasis', 'upperLabel'];
+var Z_BASE = 10; // Should bigger than every z.
+var Z_BG = 1;
+var Z_CONTENT = 2;
+
+var getItemStyleEmphasis = makeStyleMapper([
+    ['fill', 'color'],
+    // `borderColor` and `borderWidth` has been occupied,
+    // so use `stroke` to indicate the stroke of the rect.
+    ['stroke', 'strokeColor'],
+    ['lineWidth', 'strokeWidth'],
+    ['shadowBlur'],
+    ['shadowOffsetX'],
+    ['shadowOffsetY'],
+    ['shadowColor']
+]);
+var getItemStyleNormal = function (model) {
+    // Normal style props should include emphasis style props.
+    var itemStyle = getItemStyleEmphasis(model);
+    // Clear styles set by emphasis.
+    itemStyle.stroke = itemStyle.fill = itemStyle.lineWidth = null;
+    return itemStyle;
+};
+
+extendChartView({
+
+    type: 'treemap',
+
+    /**
+     * @override
+     */
+    init: function (o, api) {
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this._containerGroup;
+
+        /**
+         * @private
+         * @type {Object.<string, Array.<module:zrender/container/Group>>}
+         */
+        this._storage = createStorage();
+
+        /**
+         * @private
+         * @type {module:echarts/data/Tree}
+         */
+        this._oldTree;
+
+        /**
+         * @private
+         * @type {module:echarts/chart/treemap/Breadcrumb}
+         */
+        this._breadcrumb;
+
+        /**
+         * @private
+         * @type {module:echarts/component/helper/RoamController}
+         */
+        this._controller;
+
+        /**
+         * 'ready', 'animating'
+         * @private
+         */
+        this._state = 'ready';
+    },
+
+    /**
+     * @override
+     */
+    render: function (seriesModel, ecModel, api, payload) {
+
+        var models = ecModel.findComponents({
+            mainType: 'series', subType: 'treemap', query: payload
+        });
+        if (indexOf(models, seriesModel) < 0) {
+            return;
+        }
+
+        this.seriesModel = seriesModel;
+        this.api = api;
+        this.ecModel = ecModel;
+
+        var types = ['treemapZoomToNode', 'treemapRootToNode'];
+        var targetInfo = retrieveTargetInfo(payload, types, seriesModel);
+        var payloadType = payload && payload.type;
+        var layoutInfo = seriesModel.layoutInfo;
+        var isInit = !this._oldTree;
+        var thisStorage = this._storage;
+
+        // Mark new root when action is treemapRootToNode.
+        var reRoot = (payloadType === 'treemapRootToNode' && targetInfo && thisStorage)
+            ? {
+                rootNodeGroup: thisStorage.nodeGroup[targetInfo.node.getRawIndex()],
+                direction: payload.direction
+            }
+            : null;
+
+        var containerGroup = this._giveContainerGroup(layoutInfo);
+
+        var renderResult = this._doRender(containerGroup, seriesModel, reRoot);
+        (
+            !isInit && (
+                !payloadType
+                || payloadType === 'treemapZoomToNode'
+                || payloadType === 'treemapRootToNode'
+            )
+        )
+            ? this._doAnimation(containerGroup, renderResult, seriesModel, reRoot)
+            : renderResult.renderFinally();
+
+        this._resetController(api);
+
+        this._renderBreadcrumb(seriesModel, api, targetInfo);
+    },
+
+    /**
+     * @private
+     */
+    _giveContainerGroup: function (layoutInfo) {
+        var containerGroup = this._containerGroup;
+        if (!containerGroup) {
+            // FIXME
+            // 加一层containerGroup是为了clip，但是现在clip功能并没有实现。
+            containerGroup = this._containerGroup = new Group$2();
+            this._initEvents(containerGroup);
+            this.group.add(containerGroup);
+        }
+        containerGroup.attr('position', [layoutInfo.x, layoutInfo.y]);
+
+        return containerGroup;
+    },
+
+    /**
+     * @private
+     */
+    _doRender: function (containerGroup, seriesModel, reRoot) {
+        var thisTree = seriesModel.getData().tree;
+        var oldTree = this._oldTree;
+
+        // Clear last shape records.
+        var lastsForAnimation = createStorage();
+        var thisStorage = createStorage();
+        var oldStorage = this._storage;
+        var willInvisibleEls = [];
+        var doRenderNode = curry(
+            renderNode, seriesModel,
+            thisStorage, oldStorage, reRoot,
+            lastsForAnimation, willInvisibleEls
+        );
+
+        // Notice: when thisTree and oldTree are the same tree (see list.cloneShallow),
+        // the oldTree is actually losted, so we can not find all of the old graphic
+        // elements from tree. So we use this stragegy: make element storage, move
+        // from old storage to new storage, clear old storage.
+
+        dualTravel(
+            thisTree.root ? [thisTree.root] : [],
+            (oldTree && oldTree.root) ? [oldTree.root] : [],
+            containerGroup,
+            thisTree === oldTree || !oldTree,
+            0
+        );
+
+        // Process all removing.
+        var willDeleteEls = clearStorage(oldStorage);
+
+        this._oldTree = thisTree;
+        this._storage = thisStorage;
+
+        return {
+            lastsForAnimation: lastsForAnimation,
+            willDeleteEls: willDeleteEls,
+            renderFinally: renderFinally
+        };
+
+        function dualTravel(thisViewChildren, oldViewChildren, parentGroup, sameTree, depth) {
+            // When 'render' is triggered by action,
+            // 'this' and 'old' may be the same tree,
+            // we use rawIndex in that case.
+            if (sameTree) {
+                oldViewChildren = thisViewChildren;
+                each$8(thisViewChildren, function (child, index) {
+                    !child.isRemoved() && processNode(index, index);
+                });
+            }
+            // Diff hierarchically (diff only in each subtree, but not whole).
+            // because, consistency of view is important.
+            else {
+                (new DataDiffer(oldViewChildren, thisViewChildren, getKey, getKey))
+                    .add(processNode)
+                    .update(processNode)
+                    .remove(curry(processNode, null))
+                    .execute();
+            }
+
+            function getKey(node) {
+                // Identify by name or raw index.
+                return node.getId();
+            }
+
+            function processNode(newIndex, oldIndex) {
+                var thisNode = newIndex != null ? thisViewChildren[newIndex] : null;
+                var oldNode = oldIndex != null ? oldViewChildren[oldIndex] : null;
+
+                var group = doRenderNode(thisNode, oldNode, parentGroup, depth);
+
+                group && dualTravel(
+                    thisNode && thisNode.viewChildren || [],
+                    oldNode && oldNode.viewChildren || [],
+                    group,
+                    sameTree,
+                    depth + 1
+                );
+            }
+        }
+
+        function clearStorage(storage) {
+            var willDeleteEls = createStorage();
+            storage && each$8(storage, function (store, storageName) {
+                var delEls = willDeleteEls[storageName];
+                each$8(store, function (el) {
+                    el && (delEls.push(el), el.__tmWillDelete = 1);
+                });
+            });
+            return willDeleteEls;
+        }
+
+        function renderFinally() {
+            each$8(willDeleteEls, function (els) {
+                each$8(els, function (el) {
+                    el.parent && el.parent.remove(el);
+                });
+            });
+            each$8(willInvisibleEls, function (el) {
+                el.invisible = true;
+                // Setting invisible is for optimizing, so no need to set dirty,
+                // just mark as invisible.
+                el.dirty();
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _doAnimation: function (containerGroup, renderResult, seriesModel, reRoot) {
+        if (!seriesModel.get('animation')) {
+            return;
+        }
+
+        var duration = seriesModel.get('animationDurationUpdate');
+        var easing = seriesModel.get('animationEasing');
+        var animationWrap = createWrap();
+
+        // Make delete animations.
+        each$8(renderResult.willDeleteEls, function (store, storageName) {
+            each$8(store, function (el, rawIndex) {
+                if (el.invisible) {
+                    return;
+                }
+
+                var parent = el.parent; // Always has parent, and parent is nodeGroup.
+                var target;
+
+                if (reRoot && reRoot.direction === 'drillDown') {
+                    target = parent === reRoot.rootNodeGroup
+                        // This is the content element of view root.
+                        // Only `content` will enter this branch, because
+                        // `background` and `nodeGroup` will not be deleted.
+                        ? {
+                            shape: {
+                                x: 0,
+                                y: 0,
+                                width: parent.__tmNodeWidth,
+                                height: parent.__tmNodeHeight
+                            },
+                            style: {
+                                opacity: 0
+                            }
+                        }
+                        // Others.
+                        : {style: {opacity: 0}};
+                }
+                else {
+                    var targetX = 0;
+                    var targetY = 0;
+
+                    if (!parent.__tmWillDelete) {
+                        // Let node animate to right-bottom corner, cooperating with fadeout,
+                        // which is appropriate for user understanding.
+                        // Divided by 2 for reRoot rolling up effect.
+                        targetX = parent.__tmNodeWidth / 2;
+                        targetY = parent.__tmNodeHeight / 2;
+                    }
+
+                    target = storageName === 'nodeGroup'
+                        ? {position: [targetX, targetY], style: {opacity: 0}}
+                        : {
+                            shape: {x: targetX, y: targetY, width: 0, height: 0},
+                            style: {opacity: 0}
+                        };
+                }
+
+                target && animationWrap.add(el, target, duration, easing);
+            });
+        });
+
+        // Make other animations
+        each$8(this._storage, function (store, storageName) {
+            each$8(store, function (el, rawIndex) {
+                var last = renderResult.lastsForAnimation[storageName][rawIndex];
+                var target = {};
+
+                if (!last) {
+                    return;
+                }
+
+                if (storageName === 'nodeGroup') {
+                    if (last.old) {
+                        target.position = el.position.slice();
+                        el.attr('position', last.old);
+                    }
+                }
+                else {
+                    if (last.old) {
+                        target.shape = extend({}, el.shape);
+                        el.setShape(last.old);
+                    }
+
+                    if (last.fadein) {
+                        el.setStyle('opacity', 0);
+                        target.style = {opacity: 1};
+                    }
+                    // When animation is stopped for succedent animation starting,
+                    // el.style.opacity might not be 1
+                    else if (el.style.opacity !== 1) {
+                        target.style = {opacity: 1};
+                    }
+                }
+
+                animationWrap.add(el, target, duration, easing);
+            });
+        }, this);
+
+        this._state = 'animating';
+
+        animationWrap
+            .done(bind$1(function () {
+                this._state = 'ready';
+                renderResult.renderFinally();
+            }, this))
+            .start();
+    },
+
+    /**
+     * @private
+     */
+    _resetController: function (api) {
+        var controller = this._controller;
+
+        // Init controller.
+        if (!controller) {
+            controller = this._controller = new RoamController(api.getZr());
+            controller.enable(this.seriesModel.get('roam'));
+            controller.on('pan', bind$1(this._onPan, this));
+            controller.on('zoom', bind$1(this._onZoom, this));
+        }
+
+        var rect = new BoundingRect(0, 0, api.getWidth(), api.getHeight());
+        controller.setPointerChecker(function (e, x, y) {
+            return rect.contain(x, y);
+        });
+    },
+
+    /**
+     * @private
+     */
+    _clearController: function () {
+        var controller = this._controller;
+        if (controller) {
+            controller.dispose();
+            controller = null;
+        }
+    },
+
+    /**
+     * @private
+     */
+    _onPan: function (dx, dy) {
+        if (this._state !== 'animating'
+            && (Math.abs(dx) > DRAG_THRESHOLD || Math.abs(dy) > DRAG_THRESHOLD)
+        ) {
+            // These param must not be cached.
+            var root = this.seriesModel.getData().tree.root;
+
+            if (!root) {
+                return;
+            }
+
+            var rootLayout = root.getLayout();
+
+            if (!rootLayout) {
+                return;
+            }
+
+            this.api.dispatchAction({
+                type: 'treemapMove',
+                from: this.uid,
+                seriesId: this.seriesModel.id,
+                rootRect: {
+                    x: rootLayout.x + dx, y: rootLayout.y + dy,
+                    width: rootLayout.width, height: rootLayout.height
+                }
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _onZoom: function (scale, mouseX, mouseY) {
+        if (this._state !== 'animating') {
+            // These param must not be cached.
+            var root = this.seriesModel.getData().tree.root;
+
+            if (!root) {
+                return;
+            }
+
+            var rootLayout = root.getLayout();
+
+            if (!rootLayout) {
+                return;
+            }
+
+            var rect = new BoundingRect(
+                rootLayout.x, rootLayout.y, rootLayout.width, rootLayout.height
+            );
+            var layoutInfo = this.seriesModel.layoutInfo;
+
+            // Transform mouse coord from global to containerGroup.
+            mouseX -= layoutInfo.x;
+            mouseY -= layoutInfo.y;
+
+            // Scale root bounding rect.
+            var m = create$1();
+            translate(m, m, [-mouseX, -mouseY]);
+            scale$1(m, m, [scale, scale]);
+            translate(m, m, [mouseX, mouseY]);
+
+            rect.applyTransform(m);
+
+            this.api.dispatchAction({
+                type: 'treemapRender',
+                from: this.uid,
+                seriesId: this.seriesModel.id,
+                rootRect: {
+                    x: rect.x, y: rect.y,
+                    width: rect.width, height: rect.height
+                }
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _initEvents: function (containerGroup) {
+        containerGroup.on('click', function (e) {
+            if (this._state !== 'ready') {
+                return;
+            }
+
+            var nodeClick = this.seriesModel.get('nodeClick', true);
+
+            if (!nodeClick) {
+                return;
+            }
+
+            var targetInfo = this.findTarget(e.offsetX, e.offsetY);
+
+            if (!targetInfo) {
+                return;
+            }
+
+            var node = targetInfo.node;
+            if (node.getLayout().isLeafRoot) {
+                this._rootToNode(targetInfo);
+            }
+            else {
+                if (nodeClick === 'zoomToNode') {
+                    this._zoomToNode(targetInfo);
+                }
+                else if (nodeClick === 'link') {
+                    var itemModel = node.hostTree.data.getItemModel(node.dataIndex);
+                    var link = itemModel.get('link', true);
+                    var linkTarget = itemModel.get('target', true) || 'blank';
+                    link && window.open(link, linkTarget);
+                }
+            }
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _renderBreadcrumb: function (seriesModel, api, targetInfo) {
+        if (!targetInfo) {
+            targetInfo = seriesModel.get('leafDepth', true) != null
+                ? {node: seriesModel.getViewRoot()}
+                // FIXME
+                // better way?
+                // Find breadcrumb tail on center of containerGroup.
+                : this.findTarget(api.getWidth() / 2, api.getHeight() / 2);
+
+            if (!targetInfo) {
+                targetInfo = {node: seriesModel.getData().tree.root};
+            }
+        }
+
+        (this._breadcrumb || (this._breadcrumb = new Breadcrumb(this.group)))
+            .render(seriesModel, api, targetInfo.node, bind$1(onSelect, this));
+
+        function onSelect(node) {
+            if (this._state !== 'animating') {
+                aboveViewRoot(seriesModel.getViewRoot(), node)
+                    ? this._rootToNode({node: node})
+                    : this._zoomToNode({node: node});
+            }
+        }
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._clearController();
+        this._containerGroup && this._containerGroup.removeAll();
+        this._storage = createStorage();
+        this._state = 'ready';
+        this._breadcrumb && this._breadcrumb.remove();
+    },
+
+    dispose: function () {
+        this._clearController();
+    },
+
+    /**
+     * @private
+     */
+    _zoomToNode: function (targetInfo) {
+        this.api.dispatchAction({
+            type: 'treemapZoomToNode',
+            from: this.uid,
+            seriesId: this.seriesModel.id,
+            targetNode: targetInfo.node
+        });
+    },
+
+    /**
+     * @private
+     */
+    _rootToNode: function (targetInfo) {
+        this.api.dispatchAction({
+            type: 'treemapRootToNode',
+            from: this.uid,
+            seriesId: this.seriesModel.id,
+            targetNode: targetInfo.node
+        });
+    },
+
+    /**
+     * @public
+     * @param {number} x Global coord x.
+     * @param {number} y Global coord y.
+     * @return {Object} info If not found, return undefined;
+     * @return {number} info.node Target node.
+     * @return {number} info.offsetX x refer to target node.
+     * @return {number} info.offsetY y refer to target node.
+     */
+    findTarget: function (x, y) {
+        var targetInfo;
+        var viewRoot = this.seriesModel.getViewRoot();
+
+        viewRoot.eachNode({attr: 'viewChildren', order: 'preorder'}, function (node) {
+            var bgEl = this._storage.background[node.getRawIndex()];
+            // If invisible, there might be no element.
+            if (bgEl) {
+                var point = bgEl.transformCoordToLocal(x, y);
+                var shape = bgEl.shape;
+
+                // For performance consideration, dont use 'getBoundingRect'.
+                if (shape.x <= point[0]
+                    && point[0] <= shape.x + shape.width
+                    && shape.y <= point[1]
+                    && point[1] <= shape.y + shape.height
+                ) {
+                    targetInfo = {node: node, offsetX: point[0], offsetY: point[1]};
+                }
+                else {
+                    return false; // Suppress visit subtree.
+                }
+            }
+        }, this);
+
+        return targetInfo;
+    }
+
+});
+
+/**
+ * @inner
+ */
+function createStorage() {
+    return {nodeGroup: [], background: [], content: []};
+}
+
+/**
+ * @inner
+ * @return Return undefined means do not travel further.
+ */
+function renderNode(
+    seriesModel, thisStorage, oldStorage, reRoot,
+    lastsForAnimation, willInvisibleEls,
+    thisNode, oldNode, parentGroup, depth
+) {
+    // Whether under viewRoot.
+    if (!thisNode) {
+        // Deleting nodes will be performed finally. This method just find
+        // element from old storage, or create new element, set them to new
+        // storage, and set styles.
+        return;
+    }
+
+    // -------------------------------------------------------------------
+    // Start of closure variables available in "Procedures in renderNode".
+
+    var thisLayout = thisNode.getLayout();
+
+    if (!thisLayout || !thisLayout.isInView) {
+        return;
+    }
+
+    var thisWidth = thisLayout.width;
+    var thisHeight = thisLayout.height;
+    var borderWidth = thisLayout.borderWidth;
+    var thisInvisible = thisLayout.invisible;
+
+    var thisRawIndex = thisNode.getRawIndex();
+    var oldRawIndex = oldNode && oldNode.getRawIndex();
+
+    var thisViewChildren = thisNode.viewChildren;
+    var upperHeight = thisLayout.upperHeight;
+    var isParent = thisViewChildren && thisViewChildren.length;
+    var itemStyleNormalModel = thisNode.getModel('itemStyle');
+    var itemStyleEmphasisModel = thisNode.getModel('emphasis.itemStyle');
+
+    // End of closure ariables available in "Procedures in renderNode".
+    // -----------------------------------------------------------------
+
+    // Node group
+    var group = giveGraphic('nodeGroup', Group$2);
+
+    if (!group) {
+        return;
+    }
+
+    parentGroup.add(group);
+    // x,y are not set when el is above view root.
+    group.attr('position', [thisLayout.x || 0, thisLayout.y || 0]);
+    group.__tmNodeWidth = thisWidth;
+    group.__tmNodeHeight = thisHeight;
+
+    if (thisLayout.isAboveViewRoot) {
+        return group;
+    }
+
+    // Background
+    var bg = giveGraphic('background', Rect$1, depth, Z_BG);
+    bg && renderBackground(group, bg, isParent && thisLayout.upperHeight);
+
+    // No children, render content.
+    if (!isParent) {
+        var content = giveGraphic('content', Rect$1, depth, Z_CONTENT);
+        content && renderContent(group, content);
+    }
+
+    return group;
+
+    // ----------------------------
+    // | Procedures in renderNode |
+    // ----------------------------
+
+    function renderBackground(group, bg, useUpperLabel) {
+        // For tooltip.
+        bg.dataIndex = thisNode.dataIndex;
+        bg.seriesIndex = seriesModel.seriesIndex;
+
+        bg.setShape({x: 0, y: 0, width: thisWidth, height: thisHeight});
+        var visualBorderColor = thisNode.getVisual('borderColor', true);
+        var emphasisBorderColor = itemStyleEmphasisModel.get('borderColor');
+
+        updateStyle(bg, function () {
+            var normalStyle = getItemStyleNormal(itemStyleNormalModel);
+            normalStyle.fill = visualBorderColor;
+            var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
+            emphasisStyle.fill = emphasisBorderColor;
+
+            if (useUpperLabel) {
+                var upperLabelWidth = thisWidth - 2 * borderWidth;
+
+                prepareText(
+                    normalStyle, emphasisStyle, visualBorderColor, upperLabelWidth, upperHeight,
+                    {x: borderWidth, y: 0, width: upperLabelWidth, height: upperHeight}
+                );
+            }
+            // For old bg.
+            else {
+                normalStyle.text = emphasisStyle.text = null;
+            }
+
+            bg.setStyle(normalStyle);
+            setHoverStyle(bg, emphasisStyle);
+        });
+
+        group.add(bg);
+    }
+
+    function renderContent(group, content) {
+        // For tooltip.
+        content.dataIndex = thisNode.dataIndex;
+        content.seriesIndex = seriesModel.seriesIndex;
+
+        var contentWidth = Math.max(thisWidth - 2 * borderWidth, 0);
+        var contentHeight = Math.max(thisHeight - 2 * borderWidth, 0);
+
+        content.culling = true;
+        content.setShape({
+            x: borderWidth,
+            y: borderWidth,
+            width: contentWidth,
+            height: contentHeight
+        });
+
+        var visualColor = thisNode.getVisual('color', true);
+        updateStyle(content, function () {
+            var normalStyle = getItemStyleNormal(itemStyleNormalModel);
+            normalStyle.fill = visualColor;
+            var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
+
+            prepareText(normalStyle, emphasisStyle, visualColor, contentWidth, contentHeight);
+
+            content.setStyle(normalStyle);
+            setHoverStyle(content, emphasisStyle);
+        });
+
+        group.add(content);
+    }
+
+    function updateStyle(element, cb) {
+        if (!thisInvisible) {
+            // If invisible, do not set visual, otherwise the element will
+            // change immediately before animation. We think it is OK to
+            // remain its origin color when moving out of the view window.
+            cb();
+
+            if (!element.__tmWillVisible) {
+                element.invisible = false;
+            }
+        }
+        else {
+            // Delay invisible setting utill animation finished,
+            // avoid element vanish suddenly before animation.
+            !element.invisible && willInvisibleEls.push(element);
+        }
+    }
+
+    function prepareText(normalStyle, emphasisStyle, visualColor, width, height, upperLabelRect) {
+        var nodeModel = thisNode.getModel();
+        var text = retrieve(
+            seriesModel.getFormattedLabel(
+                thisNode.dataIndex, 'normal', null, null, upperLabelRect ? 'upperLabel' : 'label'
+            ),
+            nodeModel.get('name')
+        );
+        if (!upperLabelRect && thisLayout.isLeafRoot) {
+            var iconChar = seriesModel.get('drillDownIcon', true);
+            text = iconChar ? iconChar + ' ' + text : text;
+        }
+
+        var normalLabelModel = nodeModel.getModel(
+            upperLabelRect ? PATH_UPPERLABEL_NORMAL : PATH_LABEL_NOAMAL
+        );
+        var emphasisLabelModel = nodeModel.getModel(
+            upperLabelRect ? PATH_UPPERLABEL_EMPHASIS : PATH_LABEL_EMPHASIS
+        );
+
+        var isShow = normalLabelModel.getShallow('show');
+
+        setLabelStyle(
+            normalStyle, emphasisStyle, normalLabelModel, emphasisLabelModel,
+            {
+                defaultText: isShow ? text : null,
+                autoColor: visualColor,
+                isRectText: true
+            }
+        );
+
+        upperLabelRect && (normalStyle.textRect = clone(upperLabelRect));
+
+        normalStyle.truncate = (isShow && normalLabelModel.get('ellipsis'))
+            ? {
+                outerWidth: width,
+                outerHeight: height,
+                minChar: 2
+            }
+            : null;
+    }
+
+    function giveGraphic(storageName, Ctor, depth, z) {
+        var element = oldRawIndex != null && oldStorage[storageName][oldRawIndex];
+        var lasts = lastsForAnimation[storageName];
+
+        if (element) {
+            // Remove from oldStorage
+            oldStorage[storageName][oldRawIndex] = null;
+            prepareAnimationWhenHasOld(lasts, element, storageName);
+        }
+        // If invisible and no old element, do not create new element (for optimizing).
+        else if (!thisInvisible) {
+            element = new Ctor({z: calculateZ(depth, z)});
+            element.__tmDepth = depth;
+            element.__tmStorageName = storageName;
+            prepareAnimationWhenNoOld(lasts, element, storageName);
+        }
+
+        // Set to thisStorage
+        return (thisStorage[storageName][thisRawIndex] = element);
+    }
+
+    function prepareAnimationWhenHasOld(lasts, element, storageName) {
+        var lastCfg = lasts[thisRawIndex] = {};
+        lastCfg.old = storageName === 'nodeGroup'
+            ? element.position.slice()
+            : extend({}, element.shape);
+    }
+
+    // If a element is new, we need to find the animation start point carefully,
+    // otherwise it will looks strange when 'zoomToNode'.
+    function prepareAnimationWhenNoOld(lasts, element, storageName) {
+        var lastCfg = lasts[thisRawIndex] = {};
+        var parentNode = thisNode.parentNode;
+
+        if (parentNode && (!reRoot || reRoot.direction === 'drillDown')) {
+            var parentOldX = 0;
+            var parentOldY = 0;
+
+            // New nodes appear from right-bottom corner in 'zoomToNode' animation.
+            // For convenience, get old bounding rect from background.
+            var parentOldBg = lastsForAnimation.background[parentNode.getRawIndex()];
+            if (!reRoot && parentOldBg && parentOldBg.old) {
+                parentOldX = parentOldBg.old.width;
+                parentOldY = parentOldBg.old.height;
+            }
+
+            // When no parent old shape found, its parent is new too,
+            // so we can just use {x:0, y:0}.
+            lastCfg.old = storageName === 'nodeGroup'
+                ? [0, parentOldY]
+                : {x: parentOldX, y: parentOldY, width: 0, height: 0};
+        }
+
+        // Fade in, user can be aware that these nodes are new.
+        lastCfg.fadein = storageName !== 'nodeGroup';
+    }
+}
+
+// We can not set all backgroud with the same z, Because the behaviour of
+// drill down and roll up differ background creation sequence from tree
+// hierarchy sequence, which cause that lowser background element overlap
+// upper ones. So we calculate z based on depth.
+// Moreover, we try to shrink down z interval to [0, 1] to avoid that
+// treemap with large z overlaps other components.
+function calculateZ(depth, zInLevel) {
+    var zb = depth * Z_BASE + zInLevel;
+    return (zb - 1) / zb;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Treemap action
+ */
+
+var noop$1 = function () {};
+
+var actionTypes = [
+    'treemapZoomToNode',
+    'treemapRender',
+    'treemapMove'
+];
+
+for (var i$2 = 0; i$2 < actionTypes.length; i$2++) {
+    registerAction({type: actionTypes[i$2], update: 'updateView'}, noop$1);
+}
+
+registerAction(
+    {type: 'treemapRootToNode', update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'treemap', query: payload},
+            handleRootToNode
+        );
+
+        function handleRootToNode(model, index) {
+            var types = ['treemapZoomToNode', 'treemapRootToNode'];
+            var targetInfo = retrieveTargetInfo(payload, types, model);
+
+            if (targetInfo) {
+                var originViewRoot = model.getViewRoot();
+                if (originViewRoot) {
+                    payload.direction = aboveViewRoot(originViewRoot, targetInfo.node)
+                        ? 'rollUp' : 'drillDown';
+                }
+                model.resetViewRoot(targetInfo.node);
+            }
+        }
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$9 = each$1;
+var isObject$5 = isObject$1;
+
+var CATEGORY_DEFAULT_VISUAL_INDEX = -1;
+
+/**
+ * @param {Object} option
+ * @param {string} [option.type] See visualHandlers.
+ * @param {string} [option.mappingMethod] 'linear' or 'piecewise' or 'category' or 'fixed'
+ * @param {Array.<number>=} [option.dataExtent] [minExtent, maxExtent],
+ *                                              required when mappingMethod is 'linear'
+ * @param {Array.<Object>=} [option.pieceList] [
+ *                                             {value: someValue},
+ *                                             {interval: [min1, max1], visual: {...}},
+ *                                             {interval: [min2, max2]}
+ *                                             ],
+ *                                            required when mappingMethod is 'piecewise'.
+ *                                            Visual for only each piece can be specified.
+ * @param {Array.<string|Object>=} [option.categories] ['cate1', 'cate2']
+ *                                            required when mappingMethod is 'category'.
+ *                                            If no option.categories, categories is set
+ *                                            as [0, 1, 2, ...].
+ * @param {boolean} [option.loop=false] Whether loop mapping when mappingMethod is 'category'.
+ * @param {(Array|Object|*)} [option.visual]  Visual data.
+ *                                            when mappingMethod is 'category',
+ *                                            visual data can be array or object
+ *                                            (like: {cate1: '#222', none: '#fff'})
+ *                                            or primary types (which represents
+ *                                            defualt category visual), otherwise visual
+ *                                            can be array or primary (which will be
+ *                                            normalized to array).
+ *
+ */
+var VisualMapping = function (option) {
+    var mappingMethod = option.mappingMethod;
+    var visualType = option.type;
+
+    /**
+     * @readOnly
+     * @type {Object}
+     */
+    var thisOption = this.option = clone(option);
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    this.type = visualType;
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    this.mappingMethod = mappingMethod;
+
+    /**
+     * @private
+     * @type {Function}
+     */
+    this._normalizeData = normalizers[mappingMethod];
+
+    var visualHandler = visualHandlers[visualType];
+
+    /**
+     * @public
+     * @type {Function}
+     */
+    this.applyVisual = visualHandler.applyVisual;
+
+    /**
+     * @public
+     * @type {Function}
+     */
+    this.getColorMapper = visualHandler.getColorMapper;
+
+    /**
+     * @private
+     * @type {Function}
+     */
+    this._doMap = visualHandler._doMap[mappingMethod];
+
+    if (mappingMethod === 'piecewise') {
+        normalizeVisualRange(thisOption);
+        preprocessForPiecewise(thisOption);
+    }
+    else if (mappingMethod === 'category') {
+        thisOption.categories
+            ? preprocessForSpecifiedCategory(thisOption)
+            // categories is ordinal when thisOption.categories not specified,
+            // which need no more preprocess except normalize visual.
+            : normalizeVisualRange(thisOption, true);
+    }
+    else { // mappingMethod === 'linear' or 'fixed'
+        assert$1(mappingMethod !== 'linear' || thisOption.dataExtent);
+        normalizeVisualRange(thisOption);
+    }
+};
+
+VisualMapping.prototype = {
+
+    constructor: VisualMapping,
+
+    mapValueToVisual: function (value) {
+        var normalized = this._normalizeData(value);
+        return this._doMap(normalized, value);
+    },
+
+    getNormalizer: function () {
+        return bind(this._normalizeData, this);
+    }
+};
+
+var visualHandlers = VisualMapping.visualHandlers = {
+
+    color: {
+
+        applyVisual: makeApplyVisual('color'),
+
+        /**
+         * Create a mapper function
+         * @return {Function}
+         */
+        getColorMapper: function () {
+            var thisOption = this.option;
+
+            return bind(
+                thisOption.mappingMethod === 'category'
+                    ? function (value, isNormalized) {
+                        !isNormalized && (value = this._normalizeData(value));
+                        return doMapCategory.call(this, value);
+                    }
+                    : function (value, isNormalized, out) {
+                        // If output rgb array
+                        // which will be much faster and useful in pixel manipulation
+                        var returnRGBArray = !!out;
+                        !isNormalized && (value = this._normalizeData(value));
+                        out = fastLerp(value, thisOption.parsedVisual, out);
+                        return returnRGBArray ? out : stringify(out, 'rgba');
+                    },
+                this
+            );
+        },
+
+        _doMap: {
+            linear: function (normalized) {
+                return stringify(
+                    fastLerp(normalized, this.option.parsedVisual),
+                    'rgba'
+                );
+            },
+            category: doMapCategory,
+            piecewise: function (normalized, value) {
+                var result = getSpecifiedVisual.call(this, value);
+                if (result == null) {
+                    result = stringify(
+                        fastLerp(normalized, this.option.parsedVisual),
+                        'rgba'
+                    );
+                }
+                return result;
+            },
+            fixed: doMapFixed
+        }
+    },
+
+    colorHue: makePartialColorVisualHandler(function (color, value) {
+        return modifyHSL(color, value);
+    }),
+
+    colorSaturation: makePartialColorVisualHandler(function (color, value) {
+        return modifyHSL(color, null, value);
+    }),
+
+    colorLightness: makePartialColorVisualHandler(function (color, value) {
+        return modifyHSL(color, null, null, value);
+    }),
+
+    colorAlpha: makePartialColorVisualHandler(function (color, value) {
+        return modifyAlpha(color, value);
+    }),
+
+    opacity: {
+        applyVisual: makeApplyVisual('opacity'),
+        _doMap: makeDoMap([0, 1])
+    },
+
+    liftZ: {
+        applyVisual: makeApplyVisual('liftZ'),
+        _doMap: {
+            linear: doMapFixed,
+            category: doMapFixed,
+            piecewise: doMapFixed,
+            fixed: doMapFixed
+        }
+    },
+
+    symbol: {
+        applyVisual: function (value, getter, setter) {
+            var symbolCfg = this.mapValueToVisual(value);
+            if (isString(symbolCfg)) {
+                setter('symbol', symbolCfg);
+            }
+            else if (isObject$5(symbolCfg)) {
+                for (var name in symbolCfg) {
+                    if (symbolCfg.hasOwnProperty(name)) {
+                        setter(name, symbolCfg[name]);
+                    }
+                }
+            }
+        },
+        _doMap: {
+            linear: doMapToArray,
+            category: doMapCategory,
+            piecewise: function (normalized, value) {
+                var result = getSpecifiedVisual.call(this, value);
+                if (result == null) {
+                    result = doMapToArray.call(this, normalized);
+                }
+                return result;
+            },
+            fixed: doMapFixed
+        }
+    },
+
+    symbolSize: {
+        applyVisual: makeApplyVisual('symbolSize'),
+        _doMap: makeDoMap([0, 1])
+    }
+};
+
+
+function preprocessForPiecewise(thisOption) {
+    var pieceList = thisOption.pieceList;
+    thisOption.hasSpecialVisual = false;
+
+    each$1(pieceList, function (piece, index) {
+        piece.originIndex = index;
+        // piece.visual is "result visual value" but not
+        // a visual range, so it does not need to be normalized.
+        if (piece.visual != null) {
+            thisOption.hasSpecialVisual = true;
+        }
+    });
+}
+
+function preprocessForSpecifiedCategory(thisOption) {
+    // Hash categories.
+    var categories = thisOption.categories;
+    var visual = thisOption.visual;
+
+    var categoryMap = thisOption.categoryMap = {};
+    each$9(categories, function (cate, index) {
+        categoryMap[cate] = index;
+    });
+
+    // Process visual map input.
+    if (!isArray(visual)) {
+        var visualArr = [];
+
+        if (isObject$1(visual)) {
+            each$9(visual, function (v, cate) {
+                var index = categoryMap[cate];
+                visualArr[index != null ? index : CATEGORY_DEFAULT_VISUAL_INDEX] = v;
+            });
+        }
+        else { // Is primary type, represents default visual.
+            visualArr[CATEGORY_DEFAULT_VISUAL_INDEX] = visual;
+        }
+
+        visual = setVisualToOption(thisOption, visualArr);
+    }
+
+    // Remove categories that has no visual,
+    // then we can mapping them to CATEGORY_DEFAULT_VISUAL_INDEX.
+    for (var i = categories.length - 1; i >= 0; i--) {
+        if (visual[i] == null) {
+            delete categoryMap[categories[i]];
+            categories.pop();
+        }
+    }
+}
+
+function normalizeVisualRange(thisOption, isCategory) {
+    var visual = thisOption.visual;
+    var visualArr = [];
+
+    if (isObject$1(visual)) {
+        each$9(visual, function (v) {
+            visualArr.push(v);
+        });
+    }
+    else if (visual != null) {
+        visualArr.push(visual);
+    }
+
+    var doNotNeedPair = {color: 1, symbol: 1};
+
+    if (!isCategory
+        && visualArr.length === 1
+        && !doNotNeedPair.hasOwnProperty(thisOption.type)
+    ) {
+        // Do not care visualArr.length === 0, which is illegal.
+        visualArr[1] = visualArr[0];
+    }
+
+    setVisualToOption(thisOption, visualArr);
+}
+
+function makePartialColorVisualHandler(applyValue) {
+    return {
+        applyVisual: function (value, getter, setter) {
+            value = this.mapValueToVisual(value);
+            // Must not be array value
+            setter('color', applyValue(getter('color'), value));
+        },
+        _doMap: makeDoMap([0, 1])
+    };
+}
+
+function doMapToArray(normalized) {
+    var visual = this.option.visual;
+    return visual[
+        Math.round(linearMap(normalized, [0, 1], [0, visual.length - 1], true))
+    ] || {};
+}
+
+function makeApplyVisual(visualType) {
+    return function (value, getter, setter) {
+        setter(visualType, this.mapValueToVisual(value));
+    };
+}
+
+function doMapCategory(normalized) {
+    var visual = this.option.visual;
+    return visual[
+        (this.option.loop && normalized !== CATEGORY_DEFAULT_VISUAL_INDEX)
+            ? normalized % visual.length
+            : normalized
+    ];
+}
+
+function doMapFixed() {
+    return this.option.visual[0];
+}
+
+function makeDoMap(sourceExtent) {
+    return {
+        linear: function (normalized) {
+            return linearMap(normalized, sourceExtent, this.option.visual, true);
+        },
+        category: doMapCategory,
+        piecewise: function (normalized, value) {
+            var result = getSpecifiedVisual.call(this, value);
+            if (result == null) {
+                result = linearMap(normalized, sourceExtent, this.option.visual, true);
+            }
+            return result;
+        },
+        fixed: doMapFixed
+    };
+}
+
+function getSpecifiedVisual(value) {
+    var thisOption = this.option;
+    var pieceList = thisOption.pieceList;
+    if (thisOption.hasSpecialVisual) {
+        var pieceIndex = VisualMapping.findPieceIndex(value, pieceList);
+        var piece = pieceList[pieceIndex];
+        if (piece && piece.visual) {
+            return piece.visual[this.type];
+        }
+    }
+}
+
+function setVisualToOption(thisOption, visualArr) {
+    thisOption.visual = visualArr;
+    if (thisOption.type === 'color') {
+        thisOption.parsedVisual = map(visualArr, function (item) {
+            return parse(item);
+        });
+    }
+    return visualArr;
+}
+
+
+/**
+ * Normalizers by mapping methods.
+ */
+var normalizers = {
+
+    linear: function (value) {
+        return linearMap(value, this.option.dataExtent, [0, 1], true);
+    },
+
+    piecewise: function (value) {
+        var pieceList = this.option.pieceList;
+        var pieceIndex = VisualMapping.findPieceIndex(value, pieceList, true);
+        if (pieceIndex != null) {
+            return linearMap(pieceIndex, [0, pieceList.length - 1], [0, 1], true);
+        }
+    },
+
+    category: function (value) {
+        var index = this.option.categories
+            ? this.option.categoryMap[value]
+            : value; // ordinal
+        return index == null ? CATEGORY_DEFAULT_VISUAL_INDEX : index;
+    },
+
+    fixed: noop
+};
+
+
+
+/**
+ * List available visual types.
+ *
+ * @public
+ * @return {Array.<string>}
+ */
+VisualMapping.listVisualTypes = function () {
+    var visualTypes = [];
+    each$1(visualHandlers, function (handler, key) {
+        visualTypes.push(key);
+    });
+    return visualTypes;
+};
+
+/**
+ * @public
+ */
+VisualMapping.addVisualHandler = function (name, handler) {
+    visualHandlers[name] = handler;
+};
+
+/**
+ * @public
+ */
+VisualMapping.isValidType = function (visualType) {
+    return visualHandlers.hasOwnProperty(visualType);
+};
+
+/**
+ * Convinent method.
+ * Visual can be Object or Array or primary type.
+ *
+ * @public
+ */
+VisualMapping.eachVisual = function (visual, callback, context) {
+    if (isObject$1(visual)) {
+        each$1(visual, callback, context);
+    }
+    else {
+        callback.call(context, visual);
+    }
+};
+
+VisualMapping.mapVisual = function (visual, callback, context) {
+    var isPrimary;
+    var newVisual = isArray(visual)
+        ? []
+        : isObject$1(visual)
+        ? {}
+        : (isPrimary = true, null);
+
+    VisualMapping.eachVisual(visual, function (v, key) {
+        var newVal = callback.call(context, v, key);
+        isPrimary ? (newVisual = newVal) : (newVisual[key] = newVal);
+    });
+    return newVisual;
+};
+
+/**
+ * @public
+ * @param {Object} obj
+ * @return {Object} new object containers visual values.
+ *                 If no visuals, return null.
+ */
+VisualMapping.retrieveVisuals = function (obj) {
+    var ret = {};
+    var hasVisual;
+
+    obj && each$9(visualHandlers, function (h, visualType) {
+        if (obj.hasOwnProperty(visualType)) {
+            ret[visualType] = obj[visualType];
+            hasVisual = true;
+        }
+    });
+
+    return hasVisual ? ret : null;
+};
+
+/**
+ * Give order to visual types, considering colorSaturation, colorAlpha depends on color.
+ *
+ * @public
+ * @param {(Object|Array)} visualTypes If Object, like: {color: ..., colorSaturation: ...}
+ *                                     IF Array, like: ['color', 'symbol', 'colorSaturation']
+ * @return {Array.<string>} Sorted visual types.
+ */
+VisualMapping.prepareVisualTypes = function (visualTypes) {
+    if (isObject$5(visualTypes)) {
+        var types = [];
+        each$9(visualTypes, function (item, type) {
+            types.push(type);
+        });
+        visualTypes = types;
+    }
+    else if (isArray(visualTypes)) {
+        visualTypes = visualTypes.slice();
+    }
+    else {
+        return [];
+    }
+
+    visualTypes.sort(function (type1, type2) {
+        // color should be front of colorSaturation, colorAlpha, ...
+        // symbol and symbolSize do not matter.
+        return (type2 === 'color' && type1 !== 'color' && type1.indexOf('color') === 0)
+            ? 1 : -1;
+    });
+
+    return visualTypes;
+};
+
+/**
+ * 'color', 'colorSaturation', 'colorAlpha', ... are depends on 'color'.
+ * Other visuals are only depends on themself.
+ *
+ * @public
+ * @param {string} visualType1
+ * @param {string} visualType2
+ * @return {boolean}
+ */
+VisualMapping.dependsOn = function (visualType1, visualType2) {
+    return visualType2 === 'color'
+        ? !!(visualType1 && visualType1.indexOf(visualType2) === 0)
+        : visualType1 === visualType2;
+};
+
+/**
+ * @param {number} value
+ * @param {Array.<Object>} pieceList [{value: ..., interval: [min, max]}, ...]
+ *                         Always from small to big.
+ * @param {boolean} [findClosestWhenOutside=false]
+ * @return {number} index
+ */
+VisualMapping.findPieceIndex = function (value, pieceList, findClosestWhenOutside) {
+    var possibleI;
+    var abs = Infinity;
+
+    // value has the higher priority.
+    for (var i = 0, len = pieceList.length; i < len; i++) {
+        var pieceValue = pieceList[i].value;
+        if (pieceValue != null) {
+            if (pieceValue === value
+                // FIXME
+                // It is supposed to compare value according to value type of dimension,
+                // but currently value type can exactly be string or number.
+                // Compromise for numeric-like string (like '12'), especially
+                // in the case that visualMap.categories is ['22', '33'].
+                || (typeof pieceValue === 'string' && pieceValue === value + '')
+            ) {
+                return i;
+            }
+            findClosestWhenOutside && updatePossible(pieceValue, i);
+        }
+    }
+
+    for (var i = 0, len = pieceList.length; i < len; i++) {
+        var piece = pieceList[i];
+        var interval = piece.interval;
+        var close = piece.close;
+
+        if (interval) {
+            if (interval[0] === -Infinity) {
+                if (littleThan(close[1], value, interval[1])) {
+                    return i;
+                }
+            }
+            else if (interval[1] === Infinity) {
+                if (littleThan(close[0], interval[0], value)) {
+                    return i;
+                }
+            }
+            else if (
+                littleThan(close[0], interval[0], value)
+                && littleThan(close[1], value, interval[1])
+            ) {
+                return i;
+            }
+            findClosestWhenOutside && updatePossible(interval[0], i);
+            findClosestWhenOutside && updatePossible(interval[1], i);
+        }
+    }
+
+    if (findClosestWhenOutside) {
+        return value === Infinity
+            ? pieceList.length - 1
+            : value === -Infinity
+            ? 0
+            : possibleI;
+    }
+
+    function updatePossible(val, index) {
+        var newAbs = Math.abs(val - value);
+        if (newAbs < abs) {
+            abs = newAbs;
+            possibleI = index;
+        }
+    }
+
+};
+
+function littleThan(close, a, b) {
+    return close ? a <= b : a < b;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var isArray$2 = isArray;
+
+var ITEM_STYLE_NORMAL = 'itemStyle';
+
+var treemapVisual = {
+    seriesType: 'treemap',
+    reset: function (seriesModel, ecModel, api, payload) {
+        var tree = seriesModel.getData().tree;
+        var root = tree.root;
+        var seriesItemStyleModel = seriesModel.getModel(ITEM_STYLE_NORMAL);
+
+        if (root.isRemoved()) {
+            return;
+        }
+
+        var levelItemStyles = map(tree.levelModels, function (levelModel) {
+            return levelModel ? levelModel.get(ITEM_STYLE_NORMAL) : null;
+        });
+
+        travelTree(
+            root, // Visual should calculate from tree root but not view root.
+            {},
+            levelItemStyles,
+            seriesItemStyleModel,
+            seriesModel.getViewRoot().getAncestors(),
+            seriesModel
+        );
+    }
+};
+
+function travelTree(
+    node, designatedVisual, levelItemStyles, seriesItemStyleModel,
+    viewRootAncestors, seriesModel
+) {
+    var nodeModel = node.getModel();
+    var nodeLayout = node.getLayout();
+
+    // Optimize
+    if (!nodeLayout || nodeLayout.invisible || !nodeLayout.isInView) {
+        return;
+    }
+
+    var nodeItemStyleModel = node.getModel(ITEM_STYLE_NORMAL);
+    var levelItemStyle = levelItemStyles[node.depth];
+    var visuals = buildVisuals(
+        nodeItemStyleModel, designatedVisual, levelItemStyle, seriesItemStyleModel
+    );
+
+    // calculate border color
+    var borderColor = nodeItemStyleModel.get('borderColor');
+    var borderColorSaturation = nodeItemStyleModel.get('borderColorSaturation');
+    var thisNodeColor;
+    if (borderColorSaturation != null) {
+        // For performance, do not always execute 'calculateColor'.
+        thisNodeColor = calculateColor(visuals, node);
+        borderColor = calculateBorderColor(borderColorSaturation, thisNodeColor);
+    }
+    node.setVisual('borderColor', borderColor);
+
+    var viewChildren = node.viewChildren;
+    if (!viewChildren || !viewChildren.length) {
+        thisNodeColor = calculateColor(visuals, node);
+        // Apply visual to this node.
+        node.setVisual('color', thisNodeColor);
+    }
+    else {
+        var mapping = buildVisualMapping(
+            node, nodeModel, nodeLayout, nodeItemStyleModel, visuals, viewChildren
+        );
+
+        // Designate visual to children.
+        each$1(viewChildren, function (child, index) {
+            // If higher than viewRoot, only ancestors of viewRoot is needed to visit.
+            if (child.depth >= viewRootAncestors.length
+                || child === viewRootAncestors[child.depth]
+            ) {
+                var childVisual = mapVisual$1(
+                    nodeModel, visuals, child, index, mapping, seriesModel
+                );
+                travelTree(
+                    child, childVisual, levelItemStyles, seriesItemStyleModel,
+                    viewRootAncestors, seriesModel
+                );
+            }
+        });
+    }
+}
+
+function buildVisuals(
+    nodeItemStyleModel, designatedVisual, levelItemStyle, seriesItemStyleModel
+) {
+    var visuals = extend({}, designatedVisual);
+
+    each$1(['color', 'colorAlpha', 'colorSaturation'], function (visualName) {
+        // Priority: thisNode > thisLevel > parentNodeDesignated > seriesModel
+        var val = nodeItemStyleModel.get(visualName, true); // Ignore parent
+        val == null && levelItemStyle && (val = levelItemStyle[visualName]);
+        val == null && (val = designatedVisual[visualName]);
+        val == null && (val = seriesItemStyleModel.get(visualName));
+
+        val != null && (visuals[visualName] = val);
+    });
+
+    return visuals;
+}
+
+function calculateColor(visuals) {
+    var color = getValueVisualDefine(visuals, 'color');
+
+    if (color) {
+        var colorAlpha = getValueVisualDefine(visuals, 'colorAlpha');
+        var colorSaturation = getValueVisualDefine(visuals, 'colorSaturation');
+        if (colorSaturation) {
+            color = modifyHSL(color, null, null, colorSaturation);
+        }
+        if (colorAlpha) {
+            color = modifyAlpha(color, colorAlpha);
+        }
+
+        return color;
+    }
+}
+
+function calculateBorderColor(borderColorSaturation, thisNodeColor) {
+    return thisNodeColor != null
+            ? modifyHSL(thisNodeColor, null, null, borderColorSaturation)
+            : null;
+}
+
+function getValueVisualDefine(visuals, name) {
+    var value = visuals[name];
+    if (value != null && value !== 'none') {
+        return value;
+    }
+}
+
+function buildVisualMapping(
+    node, nodeModel, nodeLayout, nodeItemStyleModel, visuals, viewChildren
+) {
+    if (!viewChildren || !viewChildren.length) {
+        return;
+    }
+
+    var rangeVisual = getRangeVisual(nodeModel, 'color')
+        || (
+            visuals.color != null
+            && visuals.color !== 'none'
+            && (
+                getRangeVisual(nodeModel, 'colorAlpha')
+                || getRangeVisual(nodeModel, 'colorSaturation')
+            )
+        );
+
+    if (!rangeVisual) {
+        return;
+    }
+
+    var visualMin = nodeModel.get('visualMin');
+    var visualMax = nodeModel.get('visualMax');
+    var dataExtent = nodeLayout.dataExtent.slice();
+    visualMin != null && visualMin < dataExtent[0] && (dataExtent[0] = visualMin);
+    visualMax != null && visualMax > dataExtent[1] && (dataExtent[1] = visualMax);
+
+    var colorMappingBy = nodeModel.get('colorMappingBy');
+    var opt = {
+        type: rangeVisual.name,
+        dataExtent: dataExtent,
+        visual: rangeVisual.range
+    };
+    if (opt.type === 'color'
+        && (colorMappingBy === 'index' || colorMappingBy === 'id')
+    ) {
+        opt.mappingMethod = 'category';
+        opt.loop = true;
+        // categories is ordinal, so do not set opt.categories.
+    }
+    else {
+        opt.mappingMethod = 'linear';
+    }
+
+    var mapping = new VisualMapping(opt);
+    mapping.__drColorMappingBy = colorMappingBy;
+
+    return mapping;
+}
+
+// Notice: If we dont have the attribute 'colorRange', but only use
+// attribute 'color' to represent both concepts of 'colorRange' and 'color',
+// (It means 'colorRange' when 'color' is Array, means 'color' when not array),
+// this problem will be encountered:
+// If a level-1 node dont have children, and its siblings has children,
+// and colorRange is set on level-1, then the node can not be colored.
+// So we separate 'colorRange' and 'color' to different attributes.
+function getRangeVisual(nodeModel, name) {
+    // 'colorRange', 'colorARange', 'colorSRange'.
+    // If not exsits on this node, fetch from levels and series.
+    var range = nodeModel.get(name);
+    return (isArray$2(range) && range.length) ? {name: name, range: range} : null;
+}
+
+function mapVisual$1(nodeModel, visuals, child, index, mapping, seriesModel) {
+    var childVisuals = extend({}, visuals);
+
+    if (mapping) {
+        var mappingType = mapping.type;
+        var colorMappingBy = mappingType === 'color' && mapping.__drColorMappingBy;
+        var value =
+            colorMappingBy === 'index'
+            ? index
+            : colorMappingBy === 'id'
+            ? seriesModel.mapIdToIndex(child.getId())
+            : child.getValue(nodeModel.get('visualDimension'));
+
+        childVisuals[mappingType] = mapping.mapValueToVisual(value);
+    }
+
+    return childVisuals;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The treemap layout implementation references to the treemap
+* layout of d3.js (d3/src/layout/treemap.js in v3). The use of
+* the source code of this file is also subject to the terms
+* and consitions of its license (BSD-3Clause, see
+* <echarts/src/licenses/LICENSE-d3>).
+*/
+
+var mathMax$4 = Math.max;
+var mathMin$4 = Math.min;
+var retrieveValue = retrieve;
+var each$10 = each$1;
+
+var PATH_BORDER_WIDTH = ['itemStyle', 'borderWidth'];
+var PATH_GAP_WIDTH = ['itemStyle', 'gapWidth'];
+var PATH_UPPER_LABEL_SHOW = ['upperLabel', 'show'];
+var PATH_UPPER_LABEL_HEIGHT = ['upperLabel', 'height'];
+
+/**
+ * @public
+ */
+var treemapLayout = {
+    seriesType: 'treemap',
+    reset: function (seriesModel, ecModel, api, payload) {
+        // Layout result in each node:
+        // {x, y, width, height, area, borderWidth}
+        var ecWidth = api.getWidth();
+        var ecHeight = api.getHeight();
+        var seriesOption = seriesModel.option;
+
+        var layoutInfo = getLayoutRect(
+            seriesModel.getBoxLayoutParams(),
+            {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }
+        );
+
+        var size = seriesOption.size || []; // Compatible with ec2.
+        var containerWidth = parsePercent$1(
+            retrieveValue(layoutInfo.width, size[0]),
+            ecWidth
+        );
+        var containerHeight = parsePercent$1(
+            retrieveValue(layoutInfo.height, size[1]),
+            ecHeight
+        );
+
+        // Fetch payload info.
+        var payloadType = payload && payload.type;
+        var types = ['treemapZoomToNode', 'treemapRootToNode'];
+        var targetInfo = retrieveTargetInfo(payload, types, seriesModel);
+        var rootRect = (payloadType === 'treemapRender' || payloadType === 'treemapMove')
+            ? payload.rootRect : null;
+        var viewRoot = seriesModel.getViewRoot();
+        var viewAbovePath = getPathToRoot(viewRoot);
+
+        if (payloadType !== 'treemapMove') {
+            var rootSize = payloadType === 'treemapZoomToNode'
+                ? estimateRootSize(
+                    seriesModel, targetInfo, viewRoot, containerWidth, containerHeight
+                )
+                : rootRect
+                ? [rootRect.width, rootRect.height]
+                : [containerWidth, containerHeight];
+
+            var sort = seriesOption.sort;
+            if (sort && sort !== 'asc' && sort !== 'desc') {
+                sort = 'desc';
+            }
+            var options = {
+                squareRatio: seriesOption.squareRatio,
+                sort: sort,
+                leafDepth: seriesOption.leafDepth
+            };
+
+            // layout should be cleared because using updateView but not update.
+            viewRoot.hostTree.clearLayouts();
+
+            // TODO
+            // optimize: if out of view clip, do not layout.
+            // But take care that if do not render node out of view clip,
+            // how to calculate start po
+
+            var viewRootLayout = {
+                x: 0, y: 0,
+                width: rootSize[0], height: rootSize[1],
+                area: rootSize[0] * rootSize[1]
+            };
+            viewRoot.setLayout(viewRootLayout);
+
+            squarify(viewRoot, options, false, 0);
+            // Supplement layout.
+            var viewRootLayout = viewRoot.getLayout();
+            each$10(viewAbovePath, function (node, index) {
+                var childValue = (viewAbovePath[index + 1] || viewRoot).getValue();
+                node.setLayout(extend(
+                    {dataExtent: [childValue, childValue], borderWidth: 0, upperHeight: 0},
+                    viewRootLayout
+                ));
+            });
+        }
+
+        var treeRoot = seriesModel.getData().tree.root;
+
+        treeRoot.setLayout(
+            calculateRootPosition(layoutInfo, rootRect, targetInfo),
+            true
+        );
+
+        seriesModel.setLayoutInfo(layoutInfo);
+
+        // FIXME
+        // 现在没有clip功能，暂时取ec高宽。
+        prunning(
+            treeRoot,
+            // Transform to base element coordinate system.
+            new BoundingRect(-layoutInfo.x, -layoutInfo.y, ecWidth, ecHeight),
+            viewAbovePath,
+            viewRoot,
+            0
+        );
+    }
+};
+
+/**
+ * Layout treemap with squarify algorithm.
+ * @see https://graphics.ethz.ch/teaching/scivis_common/Literature/squarifiedTreeMaps.pdf
+ * The implementation references to the treemap layout of d3.js.
+ * See the license statement at the head of this file.
+ *
+ * @protected
+ * @param {module:echarts/data/Tree~TreeNode} node
+ * @param {Object} options
+ * @param {string} options.sort 'asc' or 'desc'
+ * @param {number} options.squareRatio
+ * @param {boolean} hideChildren
+ * @param {number} depth
+ */
+function squarify(node, options, hideChildren, depth) {
+    var width;
+    var height;
+
+    if (node.isRemoved()) {
+        return;
+    }
+
+    var thisLayout = node.getLayout();
+    width = thisLayout.width;
+    height = thisLayout.height;
+
+    // Considering border and gap
+    var nodeModel = node.getModel();
+    var borderWidth = nodeModel.get(PATH_BORDER_WIDTH);
+    var halfGapWidth = nodeModel.get(PATH_GAP_WIDTH) / 2;
+    var upperLabelHeight = getUpperLabelHeight(nodeModel);
+    var upperHeight = Math.max(borderWidth, upperLabelHeight);
+    var layoutOffset = borderWidth - halfGapWidth;
+    var layoutOffsetUpper = upperHeight - halfGapWidth;
+    var nodeModel = node.getModel();
+
+    node.setLayout({
+        borderWidth: borderWidth,
+        upperHeight: upperHeight,
+        upperLabelHeight: upperLabelHeight
+    }, true);
+
+    width = mathMax$4(width - 2 * layoutOffset, 0);
+    height = mathMax$4(height - layoutOffset - layoutOffsetUpper, 0);
+
+    var totalArea = width * height;
+    var viewChildren = initChildren(
+        node, nodeModel, totalArea, options, hideChildren, depth
+    );
+
+    if (!viewChildren.length) {
+        return;
+    }
+
+    var rect = {x: layoutOffset, y: layoutOffsetUpper, width: width, height: height};
+    var rowFixedLength = mathMin$4(width, height);
+    var best = Infinity; // the best row score so far
+    var row = [];
+    row.area = 0;
+
+    for (var i = 0, len = viewChildren.length; i < len;) {
+        var child = viewChildren[i];
+
+        row.push(child);
+        row.area += child.getLayout().area;
+        var score = worst(row, rowFixedLength, options.squareRatio);
+
+        // continue with this orientation
+        if (score <= best) {
+            i++;
+            best = score;
+        }
+        // abort, and try a different orientation
+        else {
+            row.area -= row.pop().getLayout().area;
+            position(row, rowFixedLength, rect, halfGapWidth, false);
+            rowFixedLength = mathMin$4(rect.width, rect.height);
+            row.length = row.area = 0;
+            best = Infinity;
+        }
+    }
+
+    if (row.length) {
+        position(row, rowFixedLength, rect, halfGapWidth, true);
+    }
+
+    if (!hideChildren) {
+        var childrenVisibleMin = nodeModel.get('childrenVisibleMin');
+        if (childrenVisibleMin != null && totalArea < childrenVisibleMin) {
+            hideChildren = true;
+        }
+    }
+
+    for (var i = 0, len = viewChildren.length; i < len; i++) {
+        squarify(viewChildren[i], options, hideChildren, depth + 1);
+    }
+}
+
+/**
+ * Set area to each child, and calculate data extent for visual coding.
+ */
+function initChildren(node, nodeModel, totalArea, options, hideChildren, depth) {
+    var viewChildren = node.children || [];
+    var orderBy = options.sort;
+    orderBy !== 'asc' && orderBy !== 'desc' && (orderBy = null);
+
+    var overLeafDepth = options.leafDepth != null && options.leafDepth <= depth;
+
+    // leafDepth has higher priority.
+    if (hideChildren && !overLeafDepth) {
+        return (node.viewChildren = []);
+    }
+
+    // Sort children, order by desc.
+    viewChildren = filter(viewChildren, function (child) {
+        return !child.isRemoved();
+    });
+
+    sort$1(viewChildren, orderBy);
+
+    var info = statistic(nodeModel, viewChildren, orderBy);
+
+    if (info.sum === 0) {
+        return (node.viewChildren = []);
+    }
+
+    info.sum = filterByThreshold(nodeModel, totalArea, info.sum, orderBy, viewChildren);
+
+    if (info.sum === 0) {
+        return (node.viewChildren = []);
+    }
+
+    // Set area to each child.
+    for (var i = 0, len = viewChildren.length; i < len; i++) {
+        var area = viewChildren[i].getValue() / info.sum * totalArea;
+        // Do not use setLayout({...}, true), because it is needed to clear last layout.
+        viewChildren[i].setLayout({area: area});
+    }
+
+    if (overLeafDepth) {
+        viewChildren.length && node.setLayout({isLeafRoot: true}, true);
+        viewChildren.length = 0;
+    }
+
+    node.viewChildren = viewChildren;
+    node.setLayout({dataExtent: info.dataExtent}, true);
+
+    return viewChildren;
+}
+
+/**
+ * Consider 'visibleMin'. Modify viewChildren and get new sum.
+ */
+function filterByThreshold(nodeModel, totalArea, sum, orderBy, orderedChildren) {
+
+    // visibleMin is not supported yet when no option.sort.
+    if (!orderBy) {
+        return sum;
+    }
+
+    var visibleMin = nodeModel.get('visibleMin');
+    var len = orderedChildren.length;
+    var deletePoint = len;
+
+    // Always travel from little value to big value.
+    for (var i = len - 1; i >= 0; i--) {
+        var value = orderedChildren[
+            orderBy === 'asc' ? len - i - 1 : i
+        ].getValue();
+
+        if (value / sum * totalArea < visibleMin) {
+            deletePoint = i;
+            sum -= value;
+        }
+    }
+
+    orderBy === 'asc'
+        ? orderedChildren.splice(0, len - deletePoint)
+        : orderedChildren.splice(deletePoint, len - deletePoint);
+
+    return sum;
+}
+
+/**
+ * Sort
+ */
+function sort$1(viewChildren, orderBy) {
+    if (orderBy) {
+        viewChildren.sort(function (a, b) {
+            var diff = orderBy === 'asc'
+                ?  a.getValue() - b.getValue() : b.getValue() - a.getValue();
+            return diff === 0
+                ? (orderBy === 'asc'
+                    ? a.dataIndex - b.dataIndex : b.dataIndex - a.dataIndex
+                )
+                : diff;
+        });
+    }
+    return viewChildren;
+}
+
+/**
+ * Statistic
+ */
+function statistic(nodeModel, children, orderBy) {
+    // Calculate sum.
+    var sum = 0;
+    for (var i = 0, len = children.length; i < len; i++) {
+        sum += children[i].getValue();
+    }
+
+    // Statistic data extent for latter visual coding.
+    // Notice: data extent should be calculate based on raw children
+    // but not filtered view children, otherwise visual mapping will not
+    // be stable when zoom (where children is filtered by visibleMin).
+
+    var dimension = nodeModel.get('visualDimension');
+    var dataExtent;
+
+    // The same as area dimension.
+    if (!children || !children.length) {
+        dataExtent = [NaN, NaN];
+    }
+    else if (dimension === 'value' && orderBy) {
+        dataExtent = [
+            children[children.length - 1].getValue(),
+            children[0].getValue()
+        ];
+        orderBy === 'asc' && dataExtent.reverse();
+    }
+    // Other dimension.
+    else {
+        var dataExtent = [Infinity, -Infinity];
+        each$10(children, function (child) {
+            var value = child.getValue(dimension);
+            value < dataExtent[0] && (dataExtent[0] = value);
+            value > dataExtent[1] && (dataExtent[1] = value);
+        });
+    }
+
+    return {sum: sum, dataExtent: dataExtent};
+}
+
+/**
+ * Computes the score for the specified row,
+ * as the worst aspect ratio.
+ */
+function worst(row, rowFixedLength, ratio) {
+    var areaMax = 0;
+    var areaMin = Infinity;
+
+    for (var i = 0, area, len = row.length; i < len; i++) {
+        area = row[i].getLayout().area;
+        if (area) {
+            area < areaMin && (areaMin = area);
+            area > areaMax && (areaMax = area);
+        }
+    }
+
+    var squareArea = row.area * row.area;
+    var f = rowFixedLength * rowFixedLength * ratio;
+
+    return squareArea
+        ? mathMax$4(
+            (f * areaMax) / squareArea,
+            squareArea / (f * areaMin)
+        )
+        : Infinity;
+}
+
+/**
+ * Positions the specified row of nodes. Modifies `rect`.
+ */
+function position(row, rowFixedLength, rect, halfGapWidth, flush) {
+    // When rowFixedLength === rect.width,
+    // it is horizontal subdivision,
+    // rowFixedLength is the width of the subdivision,
+    // rowOtherLength is the height of the subdivision,
+    // and nodes will be positioned from left to right.
+
+    // wh[idx0WhenH] means: when horizontal,
+    //      wh[idx0WhenH] => wh[0] => 'width'.
+    //      xy[idx1WhenH] => xy[1] => 'y'.
+    var idx0WhenH = rowFixedLength === rect.width ? 0 : 1;
+    var idx1WhenH = 1 - idx0WhenH;
+    var xy = ['x', 'y'];
+    var wh = ['width', 'height'];
+
+    var last = rect[xy[idx0WhenH]];
+    var rowOtherLength = rowFixedLength
+        ? row.area / rowFixedLength : 0;
+
+    if (flush || rowOtherLength > rect[wh[idx1WhenH]]) {
+        rowOtherLength = rect[wh[idx1WhenH]]; // over+underflow
+    }
+    for (var i = 0, rowLen = row.length; i < rowLen; i++) {
+        var node = row[i];
+        var nodeLayout = {};
+        var step = rowOtherLength
+            ? node.getLayout().area / rowOtherLength : 0;
+
+        var wh1 = nodeLayout[wh[idx1WhenH]] = mathMax$4(rowOtherLength - 2 * halfGapWidth, 0);
+
+        // We use Math.max/min to avoid negative width/height when considering gap width.
+        var remain = rect[xy[idx0WhenH]] + rect[wh[idx0WhenH]] - last;
+        var modWH = (i === rowLen - 1 || remain < step) ? remain : step;
+        var wh0 = nodeLayout[wh[idx0WhenH]] = mathMax$4(modWH - 2 * halfGapWidth, 0);
+
+        nodeLayout[xy[idx1WhenH]] = rect[xy[idx1WhenH]] + mathMin$4(halfGapWidth, wh1 / 2);
+        nodeLayout[xy[idx0WhenH]] = last + mathMin$4(halfGapWidth, wh0 / 2);
+
+        last += modWH;
+        node.setLayout(nodeLayout, true);
+    }
+
+    rect[xy[idx1WhenH]] += rowOtherLength;
+    rect[wh[idx1WhenH]] -= rowOtherLength;
+}
+
+// Return [containerWidth, containerHeight] as defualt.
+function estimateRootSize(seriesModel, targetInfo, viewRoot, containerWidth, containerHeight) {
+    // If targetInfo.node exists, we zoom to the node,
+    // so estimate whold width and heigth by target node.
+    var currNode = (targetInfo || {}).node;
+    var defaultSize = [containerWidth, containerHeight];
+
+    if (!currNode || currNode === viewRoot) {
+        return defaultSize;
+    }
+
+    var parent;
+    var viewArea = containerWidth * containerHeight;
+    var area = viewArea * seriesModel.option.zoomToNodeRatio;
+
+    while (parent = currNode.parentNode) { // jshint ignore:line
+        var sum = 0;
+        var siblings = parent.children;
+
+        for (var i = 0, len = siblings.length; i < len; i++) {
+            sum += siblings[i].getValue();
+        }
+        var currNodeValue = currNode.getValue();
+        if (currNodeValue === 0) {
+            return defaultSize;
+        }
+        area *= sum / currNodeValue;
+
+        // Considering border, suppose aspect ratio is 1.
+        var parentModel = parent.getModel();
+        var borderWidth = parentModel.get(PATH_BORDER_WIDTH);
+        var upperHeight = Math.max(borderWidth, getUpperLabelHeight(parentModel, borderWidth));
+        area += 4 * borderWidth * borderWidth
+            + (3 * borderWidth + upperHeight) * Math.pow(area, 0.5);
+
+        area > MAX_SAFE_INTEGER && (area = MAX_SAFE_INTEGER);
+
+        currNode = parent;
+    }
+
+    area < viewArea && (area = viewArea);
+    var scale = Math.pow(area / viewArea, 0.5);
+
+    return [containerWidth * scale, containerHeight * scale];
+}
+
+// Root postion base on coord of containerGroup
+function calculateRootPosition(layoutInfo, rootRect, targetInfo) {
+    if (rootRect) {
+        return {x: rootRect.x, y: rootRect.y};
+    }
+
+    var defaultPosition = {x: 0, y: 0};
+    if (!targetInfo) {
+        return defaultPosition;
+    }
+
+    // If targetInfo is fetched by 'retrieveTargetInfo',
+    // old tree and new tree are the same tree,
+    // so the node still exists and we can visit it.
+
+    var targetNode = targetInfo.node;
+    var layout = targetNode.getLayout();
+
+    if (!layout) {
+        return defaultPosition;
+    }
+
+    // Transform coord from local to container.
+    var targetCenter = [layout.width / 2, layout.height / 2];
+    var node = targetNode;
+    while (node) {
+        var nodeLayout = node.getLayout();
+        targetCenter[0] += nodeLayout.x;
+        targetCenter[1] += nodeLayout.y;
+        node = node.parentNode;
+    }
+
+    return {
+        x: layoutInfo.width / 2 - targetCenter[0],
+        y: layoutInfo.height / 2 - targetCenter[1]
+    };
+}
+
+// Mark nodes visible for prunning when visual coding and rendering.
+// Prunning depends on layout and root position, so we have to do it after layout.
+function prunning(node, clipRect, viewAbovePath, viewRoot, depth) {
+    var nodeLayout = node.getLayout();
+    var nodeInViewAbovePath = viewAbovePath[depth];
+    var isAboveViewRoot = nodeInViewAbovePath && nodeInViewAbovePath === node;
+
+    if (
+        (nodeInViewAbovePath && !isAboveViewRoot)
+        || (depth === viewAbovePath.length && node !== viewRoot)
+    ) {
+        return;
+    }
+
+    node.setLayout({
+        // isInView means: viewRoot sub tree + viewAbovePath
+        isInView: true,
+        // invisible only means: outside view clip so that the node can not
+        // see but still layout for animation preparation but not render.
+        invisible: !isAboveViewRoot && !clipRect.intersect(nodeLayout),
+        isAboveViewRoot: isAboveViewRoot
+    }, true);
+
+    // Transform to child coordinate.
+    var childClipRect = new BoundingRect(
+        clipRect.x - nodeLayout.x,
+        clipRect.y - nodeLayout.y,
+        clipRect.width,
+        clipRect.height
+    );
+
+    each$10(node.viewChildren || [], function (child) {
+        prunning(child, childClipRect, viewAbovePath, viewRoot, depth + 1);
+    });
+}
+
+function getUpperLabelHeight(model) {
+    return model.get(PATH_UPPER_LABEL_SHOW) ? model.get(PATH_UPPER_LABEL_HEIGHT) : 0;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(treemapVisual);
+registerLayout(treemapLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Graph data structure
+ *
+ * @module echarts/data/Graph
+ * @author Yi Shen(https://www.github.com/pissang)
+ */
+
+// id may be function name of Object, add a prefix to avoid this problem.
+function generateNodeKey (id) {
+    return '_EC_' + id;
+}
+/**
+ * @alias module:echarts/data/Graph
+ * @constructor
+ * @param {boolean} directed
+ */
+var Graph = function(directed) {
+    /**
+     * 是否是有向图
+     * @type {boolean}
+     * @private
+     */
+    this._directed = directed || false;
+
+    /**
+     * @type {Array.<module:echarts/data/Graph.Node>}
+     * @readOnly
+     */
+    this.nodes = [];
+
+    /**
+     * @type {Array.<module:echarts/data/Graph.Edge>}
+     * @readOnly
+     */
+    this.edges = [];
+
+    /**
+     * @type {Object.<string, module:echarts/data/Graph.Node>}
+     * @private
+     */
+    this._nodesMap = {};
+    /**
+     * @type {Object.<string, module:echarts/data/Graph.Edge>}
+     * @private
+     */
+    this._edgesMap = {};
+
+    /**
+     * @type {module:echarts/data/List}
+     * @readOnly
+     */
+    this.data;
+
+    /**
+     * @type {module:echarts/data/List}
+     * @readOnly
+     */
+    this.edgeData;
+};
+
+var graphProto = Graph.prototype;
+/**
+ * @type {string}
+ */
+graphProto.type = 'graph';
+
+/**
+ * If is directed graph
+ * @return {boolean}
+ */
+graphProto.isDirected = function () {
+    return this._directed;
+};
+
+/**
+ * Add a new node
+ * @param {string} id
+ * @param {number} [dataIndex]
+ */
+graphProto.addNode = function (id, dataIndex) {
+    id = id || ('' + dataIndex);
+
+    var nodesMap = this._nodesMap;
+
+    if (nodesMap[generateNodeKey(id)]) {
+        if (__DEV__) {
+            console.error('Graph nodes have duplicate name or id');
+        }
+        return;
+    }
+
+    var node = new Node(id, dataIndex);
+    node.hostGraph = this;
+
+    this.nodes.push(node);
+
+    nodesMap[generateNodeKey(id)] = node;
+    return node;
+};
+
+/**
+ * Get node by data index
+ * @param  {number} dataIndex
+ * @return {module:echarts/data/Graph~Node}
+ */
+graphProto.getNodeByIndex = function (dataIndex) {
+    var rawIdx = this.data.getRawIndex(dataIndex);
+    return this.nodes[rawIdx];
+};
+/**
+ * Get node by id
+ * @param  {string} id
+ * @return {module:echarts/data/Graph.Node}
+ */
+graphProto.getNodeById = function (id) {
+    return this._nodesMap[generateNodeKey(id)];
+};
+
+/**
+ * Add a new edge
+ * @param {number|string|module:echarts/data/Graph.Node} n1
+ * @param {number|string|module:echarts/data/Graph.Node} n2
+ * @param {number} [dataIndex=-1]
+ * @return {module:echarts/data/Graph.Edge}
+ */
+graphProto.addEdge = function (n1, n2, dataIndex) {
+    var nodesMap = this._nodesMap;
+    var edgesMap = this._edgesMap;
+
+    // PNEDING
+    if (typeof n1 === 'number') {
+        n1 = this.nodes[n1];
+    }
+    if (typeof n2 === 'number') {
+        n2 = this.nodes[n2];
+    }
+
+    if (!Node.isInstance(n1)) {
+        n1 = nodesMap[generateNodeKey(n1)];
+    }
+    if (!Node.isInstance(n2)) {
+        n2 = nodesMap[generateNodeKey(n2)];
+    }
+    if (!n1 || !n2) {
+        return;
+    }
+
+    var key = n1.id + '-' + n2.id;
+    // PENDING
+    if (edgesMap[key]) {
+        return;
+    }
+
+    var edge = new Edge(n1, n2, dataIndex);
+    edge.hostGraph = this;
+
+    if (this._directed) {
+        n1.outEdges.push(edge);
+        n2.inEdges.push(edge);
+    }
+    n1.edges.push(edge);
+    if (n1 !== n2) {
+        n2.edges.push(edge);
+    }
+
+    this.edges.push(edge);
+    edgesMap[key] = edge;
+
+    return edge;
+};
+
+/**
+ * Get edge by data index
+ * @param  {number} dataIndex
+ * @return {module:echarts/data/Graph~Node}
+ */
+graphProto.getEdgeByIndex = function (dataIndex) {
+    var rawIdx = this.edgeData.getRawIndex(dataIndex);
+    return this.edges[rawIdx];
+};
+/**
+ * Get edge by two linked nodes
+ * @param  {module:echarts/data/Graph.Node|string} n1
+ * @param  {module:echarts/data/Graph.Node|string} n2
+ * @return {module:echarts/data/Graph.Edge}
+ */
+graphProto.getEdge = function (n1, n2) {
+    if (Node.isInstance(n1)) {
+        n1 = n1.id;
+    }
+    if (Node.isInstance(n2)) {
+        n2 = n2.id;
+    }
+
+    var edgesMap = this._edgesMap;
+
+    if (this._directed) {
+        return edgesMap[n1 + '-' + n2];
+    } else {
+        return edgesMap[n1 + '-' + n2]
+            || edgesMap[n2 + '-' + n1];
+    }
+};
+
+/**
+ * Iterate all nodes
+ * @param  {Function} cb
+ * @param  {*} [context]
+ */
+graphProto.eachNode = function (cb, context) {
+    var nodes = this.nodes;
+    var len = nodes.length;
+    for (var i = 0; i < len; i++) {
+        if (nodes[i].dataIndex >= 0) {
+            cb.call(context, nodes[i], i);
+        }
+    }
+};
+
+/**
+ * Iterate all edges
+ * @param  {Function} cb
+ * @param  {*} [context]
+ */
+graphProto.eachEdge = function (cb, context) {
+    var edges = this.edges;
+    var len = edges.length;
+    for (var i = 0; i < len; i++) {
+        if (edges[i].dataIndex >= 0
+            && edges[i].node1.dataIndex >= 0
+            && edges[i].node2.dataIndex >= 0
+        ) {
+            cb.call(context, edges[i], i);
+        }
+    }
+};
+
+/**
+ * Breadth first traverse
+ * @param {Function} cb
+ * @param {module:echarts/data/Graph.Node} startNode
+ * @param {string} [direction='none'] 'none'|'in'|'out'
+ * @param {*} [context]
+ */
+graphProto.breadthFirstTraverse = function (
+    cb, startNode, direction, context
+) {
+    if (!Node.isInstance(startNode)) {
+        startNode = this._nodesMap[generateNodeKey(startNode)];
+    }
+    if (!startNode) {
+        return;
+    }
+
+    var edgeType = direction === 'out'
+        ? 'outEdges' : (direction === 'in' ? 'inEdges' : 'edges');
+
+    for (var i = 0; i < this.nodes.length; i++) {
+        this.nodes[i].__visited = false;
+    }
+
+    if (cb.call(context, startNode, null)) {
+        return;
+    }
+
+    var queue = [startNode];
+    while (queue.length) {
+        var currentNode = queue.shift();
+        var edges = currentNode[edgeType];
+
+        for (var i = 0; i < edges.length; i++) {
+            var e = edges[i];
+            var otherNode = e.node1 === currentNode
+                ? e.node2 : e.node1;
+            if (!otherNode.__visited) {
+                if (cb.call(context, otherNode, currentNode)) {
+                    // Stop traversing
+                    return;
+                }
+                queue.push(otherNode);
+                otherNode.__visited = true;
+            }
+        }
+    }
+};
+
+// TODO
+// graphProto.depthFirstTraverse = function (
+//     cb, startNode, direction, context
+// ) {
+
+// };
+
+// Filter update
+graphProto.update = function () {
+    var data = this.data;
+    var edgeData = this.edgeData;
+    var nodes = this.nodes;
+    var edges = this.edges;
+
+    for (var i = 0, len = nodes.length; i < len; i++) {
+        nodes[i].dataIndex = -1;
+    }
+    for (var i = 0, len = data.count(); i < len; i++) {
+        nodes[data.getRawIndex(i)].dataIndex = i;
+    }
+
+    edgeData.filterSelf(function (idx) {
+        var edge = edges[edgeData.getRawIndex(idx)];
+        return edge.node1.dataIndex >= 0 && edge.node2.dataIndex >= 0;
+    });
+
+    // Update edge
+    for (var i = 0, len = edges.length; i < len; i++) {
+        edges[i].dataIndex = -1;
+    }
+    for (var i = 0, len = edgeData.count(); i < len; i++) {
+        edges[edgeData.getRawIndex(i)].dataIndex = i;
+    }
+};
+
+/**
+ * @return {module:echarts/data/Graph}
+ */
+graphProto.clone = function () {
+    var graph = new Graph(this._directed);
+    var nodes = this.nodes;
+    var edges = this.edges;
+    for (var i = 0; i < nodes.length; i++) {
+        graph.addNode(nodes[i].id, nodes[i].dataIndex);
+    }
+    for (var i = 0; i < edges.length; i++) {
+        var e = edges[i];
+        graph.addEdge(e.node1.id, e.node2.id, e.dataIndex);
+    }
+    return graph;
+};
+
+
+/**
+ * @alias module:echarts/data/Graph.Node
+ */
+function Node(id, dataIndex) {
+    /**
+    * @type {string}
+    */
+    this.id = id == null ? '' : id;
+
+    /**
+    * @type {Array.<module:echarts/data/Graph.Edge>}
+    */
+    this.inEdges = [];
+    /**
+    * @type {Array.<module:echarts/data/Graph.Edge>}
+    */
+    this.outEdges = [];
+    /**
+    * @type {Array.<module:echarts/data/Graph.Edge>}
+    */
+    this.edges = [];
+    /**
+     * @type {module:echarts/data/Graph}
+     */
+    this.hostGraph;
+
+    /**
+     * @type {number}
+     */
+    this.dataIndex = dataIndex == null ? -1 : dataIndex;
+}
+
+Node.prototype = {
+
+    constructor: Node,
+
+    /**
+     * @return {number}
+     */
+    degree: function () {
+        return this.edges.length;
+    },
+
+    /**
+     * @return {number}
+     */
+    inDegree: function () {
+        return this.inEdges.length;
+    },
+
+    /**
+    * @return {number}
+    */
+    outDegree: function () {
+        return this.outEdges.length;
+    },
+
+    /**
+     * @param {string} [path]
+     * @return {module:echarts/model/Model}
+     */
+    getModel: function (path) {
+        if (this.dataIndex < 0) {
+            return;
+        }
+        var graph = this.hostGraph;
+        var itemModel = graph.data.getItemModel(this.dataIndex);
+
+        return itemModel.getModel(path);
+    }
+};
+
+/**
+ * 图边
+ * @alias module:echarts/data/Graph.Edge
+ * @param {module:echarts/data/Graph.Node} n1
+ * @param {module:echarts/data/Graph.Node} n2
+ * @param {number} [dataIndex=-1]
+ */
+function Edge(n1, n2, dataIndex) {
+
+    /**
+     * 节点1，如果是有向图则为源节点
+     * @type {module:echarts/data/Graph.Node}
+     */
+    this.node1 = n1;
+
+    /**
+     * 节点2，如果是有向图则为目标节点
+     * @type {module:echarts/data/Graph.Node}
+     */
+    this.node2 = n2;
+
+    this.dataIndex = dataIndex == null ? -1 : dataIndex;
+}
+
+/**
+ * @param {string} [path]
+ * @return {module:echarts/model/Model}
+ */
+Edge.prototype.getModel = function (path) {
+    if (this.dataIndex < 0) {
+        return;
+    }
+    var graph = this.hostGraph;
+    var itemModel = graph.edgeData.getItemModel(this.dataIndex);
+
+    return itemModel.getModel(path);
+};
+
+var createGraphDataProxyMixin = function (hostName, dataName) {
+    return {
+        /**
+         * @param {string=} [dimension='value'] Default 'value'. can be 'a', 'b', 'c', 'd', 'e'.
+         * @return {number}
+         */
+        getValue: function (dimension) {
+            var data = this[hostName][dataName];
+            return data.get(data.getDimension(dimension || 'value'), this.dataIndex);
+        },
+
+        /**
+         * @param {Object|string} key
+         * @param {*} [value]
+         */
+        setVisual: function (key, value) {
+            this.dataIndex >= 0
+                && this[hostName][dataName].setItemVisual(this.dataIndex, key, value);
+        },
+
+        /**
+         * @param {string} key
+         * @return {boolean}
+         */
+        getVisual: function (key, ignoreParent) {
+            return this[hostName][dataName].getItemVisual(this.dataIndex, key, ignoreParent);
+        },
+
+        /**
+         * @param {Object} layout
+         * @return {boolean} [merge=false]
+         */
+        setLayout: function (layout, merge$$1) {
+            this.dataIndex >= 0
+                && this[hostName][dataName].setItemLayout(this.dataIndex, layout, merge$$1);
+        },
+
+        /**
+         * @return {Object}
+         */
+        getLayout: function () {
+            return this[hostName][dataName].getItemLayout(this.dataIndex);
+        },
+
+        /**
+         * @return {module:zrender/Element}
+         */
+        getGraphicEl: function () {
+            return this[hostName][dataName].getItemGraphicEl(this.dataIndex);
+        },
+
+        /**
+         * @return {number}
+         */
+        getRawIndex: function () {
+            return this[hostName][dataName].getRawIndex(this.dataIndex);
+        }
+    };
+};
+
+mixin(Node, createGraphDataProxyMixin('hostGraph', 'data'));
+mixin(Edge, createGraphDataProxyMixin('hostGraph', 'edgeData'));
+
+Graph.Node = Node;
+Graph.Edge = Edge;
+
+enableClassCheck(Node);
+enableClassCheck(Edge);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var createGraphFromNodeEdge = function (nodes, edges, seriesModel, directed, beforeLink) {
+    // ??? TODO
+    // support dataset?
+    var graph = new Graph(directed);
+    for (var i = 0; i < nodes.length; i++) {
+        graph.addNode(retrieve(
+            // Id, name, dataIndex
+            nodes[i].id, nodes[i].name, i
+        ), i);
+    }
+
+    var linkNameList = [];
+    var validEdges = [];
+    var linkCount = 0;
+    for (var i = 0; i < edges.length; i++) {
+        var link = edges[i];
+        var source = link.source;
+        var target = link.target;
+        // addEdge may fail when source or target not exists
+        if (graph.addEdge(source, target, linkCount)) {
+            validEdges.push(link);
+            linkNameList.push(retrieve(link.id, source + ' > ' + target));
+            linkCount++;
+        }
+    }
+
+    var coordSys = seriesModel.get('coordinateSystem');
+    var nodeData;
+    if (coordSys === 'cartesian2d' || coordSys === 'polar') {
+        nodeData = createListFromArray(nodes, seriesModel);
+    }
+    else {
+        var coordSysCtor = CoordinateSystemManager.get(coordSys);
+        var coordDimensions = (coordSysCtor && coordSysCtor.type !== 'view')
+            ? (coordSysCtor.dimensions || []) : [];
+        // FIXME: Some geo do not need `value` dimenson, whereas `calendar` needs
+        // `value` dimension, but graph need `value` dimension. It's better to
+        // uniform this behavior.
+        if (indexOf(coordDimensions, 'value') < 0) {
+            coordDimensions.concat(['value']);
+        }
+
+        var dimensionNames = createDimensions(nodes, {
+            coordDimensions: coordDimensions
+        });
+        nodeData = new List(dimensionNames, seriesModel);
+        nodeData.initData(nodes);
+    }
+
+    var edgeData = new List(['value'], seriesModel);
+    edgeData.initData(validEdges, linkNameList);
+
+    beforeLink && beforeLink(nodeData, edgeData);
+
+    linkList({
+        mainData: nodeData,
+        struct: graph,
+        structAttr: 'graph',
+        datas: {node: nodeData, edge: edgeData},
+        datasAttr: {node: 'data', edge: 'edgeData'}
+    });
+
+    // Update dataIndex of nodes and edges because invalid edge may be removed
+    graph.update();
+
+    return graph;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var GraphSeries = extendSeriesModel({
+
+    type: 'series.graph',
+
+    init: function (option) {
+        GraphSeries.superApply(this, 'init', arguments);
+
+        // Provide data for legend select
+        this.legendDataProvider = function () {
+            return this._categoriesData;
+        };
+
+        this.fillDataTextStyle(option.edges || option.links);
+
+        this._updateCategoriesData();
+    },
+
+    mergeOption: function (option) {
+        GraphSeries.superApply(this, 'mergeOption', arguments);
+
+        this.fillDataTextStyle(option.edges || option.links);
+
+        this._updateCategoriesData();
+    },
+
+    mergeDefaultAndTheme: function (option) {
+        GraphSeries.superApply(this, 'mergeDefaultAndTheme', arguments);
+        defaultEmphasis(option, ['edgeLabel'], ['show']);
+    },
+
+    getInitialData: function (option, ecModel) {
+        var edges = option.edges || option.links || [];
+        var nodes = option.data || option.nodes || [];
+        var self = this;
+
+        if (nodes && edges) {
+            return createGraphFromNodeEdge(nodes, edges, this, true, beforeLink).data;
+        }
+
+        function beforeLink(nodeData, edgeData) {
+            // Overwrite nodeData.getItemModel to
+            nodeData.wrapMethod('getItemModel', function (model) {
+                var categoriesModels = self._categoriesModels;
+                var categoryIdx = model.getShallow('category');
+                var categoryModel = categoriesModels[categoryIdx];
+                if (categoryModel) {
+                    categoryModel.parentModel = model.parentModel;
+                    model.parentModel = categoryModel;
+                }
+                return model;
+            });
+
+            var edgeLabelModel = self.getModel('edgeLabel');
+            // For option `edgeLabel` can be found by label.xxx.xxx on item mode.
+            var fakeSeriesModel = new Model(
+                {label: edgeLabelModel.option},
+                edgeLabelModel.parentModel,
+                ecModel
+            );
+            var emphasisEdgeLabelModel = self.getModel('emphasis.edgeLabel');
+            var emphasisFakeSeriesModel = new Model(
+                {emphasis: {label: emphasisEdgeLabelModel.option}},
+                emphasisEdgeLabelModel.parentModel,
+                ecModel
+            );
+
+            edgeData.wrapMethod('getItemModel', function (model) {
+                model.customizeGetParent(edgeGetParent);
+                return model;
+            });
+
+            function edgeGetParent(path) {
+                path = this.parsePath(path);
+                return (path && path[0] === 'label')
+                    ? fakeSeriesModel
+                    : (path && path[0] === 'emphasis' && path[1] === 'label')
+                    ? emphasisFakeSeriesModel
+                    : this.parentModel;
+            }
+        }
+    },
+
+    /**
+     * @return {module:echarts/data/Graph}
+     */
+    getGraph: function () {
+        return this.getData().graph;
+    },
+
+    /**
+     * @return {module:echarts/data/List}
+     */
+    getEdgeData: function () {
+        return this.getGraph().edgeData;
+    },
+
+    /**
+     * @return {module:echarts/data/List}
+     */
+    getCategoriesData: function () {
+        return this._categoriesData;
+    },
+
+    /**
+     * @override
+     */
+    formatTooltip: function (dataIndex, multipleSeries, dataType) {
+        if (dataType === 'edge') {
+            var nodeData = this.getData();
+            var params = this.getDataParams(dataIndex, dataType);
+            var edge = nodeData.graph.getEdgeByIndex(dataIndex);
+            var sourceName = nodeData.getName(edge.node1.dataIndex);
+            var targetName = nodeData.getName(edge.node2.dataIndex);
+
+            var html = [];
+            sourceName != null && html.push(sourceName);
+            targetName != null && html.push(targetName);
+            html = encodeHTML(html.join(' > '));
+
+            if (params.value) {
+                html += ' : ' + encodeHTML(params.value);
+            }
+            return html;
+        }
+        else { // dataType === 'node' or empty
+            return GraphSeries.superApply(this, 'formatTooltip', arguments);
+        }
+    },
+
+    _updateCategoriesData: function () {
+        var categories = map(this.option.categories || [], function (category) {
+            // Data must has value
+            return category.value != null ? category : extend({
+                value: 0
+            }, category);
+        });
+        var categoriesData = new List(['value'], this);
+        categoriesData.initData(categories);
+
+        this._categoriesData = categoriesData;
+
+        this._categoriesModels = categoriesData.mapArray(function (idx) {
+            return categoriesData.getItemModel(idx, true);
+        });
+    },
+
+    setZoom: function (zoom) {
+        this.option.zoom = zoom;
+    },
+
+    setCenter: function (center) {
+        this.option.center = center;
+    },
+
+    isAnimationEnabled: function () {
+        return GraphSeries.superCall(this, 'isAnimationEnabled')
+            // Not enable animation when do force layout
+            && !(this.get('layout') === 'force' && this.get('force.layoutAnimation'));
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        coordinateSystem: 'view',
+
+        // Default option for all coordinate systems
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+        // polarIndex: 0,
+        // geoIndex: 0,
+
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+
+        layout: null,
+
+        focusNodeAdjacency: false,
+
+        // Configuration of circular layout
+        circular: {
+            rotateLabel: false
+        },
+        // Configuration of force directed layout
+        force: {
+            initLayout: null,
+            // Node repulsion. Can be an array to represent range.
+            repulsion: [0, 50],
+            gravity: 0.1,
+
+            // Edge length. Can be an array to represent range.
+            edgeLength: 30,
+
+            layoutAnimation: true
+        },
+
+        left: 'center',
+        top: 'center',
+        // right: null,
+        // bottom: null,
+        // width: '80%',
+        // height: '80%',
+
+        symbol: 'circle',
+        symbolSize: 10,
+
+        edgeSymbol: ['none', 'none'],
+        edgeSymbolSize: 10,
+        edgeLabel: {
+            position: 'middle'
+        },
+
+        draggable: false,
+
+        roam: false,
+
+        // Default on center of graph
+        center: null,
+
+        zoom: 1,
+        // Symbol size scale ratio in roam
+        nodeScaleRatio: 0.6,
+        // cursor: null,
+
+        // categories: [],
+
+        // data: []
+        // Or
+        // nodes: []
+        //
+        // links: []
+        // Or
+        // edges: []
+
+        label: {
+            show: false,
+            formatter: '{b}'
+        },
+
+        itemStyle: {},
+
+        lineStyle: {
+            color: '#aaa',
+            width: 1,
+            curveness: 0,
+            opacity: 0.5
+        },
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Line path for bezier and straight line draw
+ */
+
+var straightLineProto = Line.prototype;
+var bezierCurveProto = BezierCurve.prototype;
+
+function isLine(shape) {
+    return isNaN(+shape.cpx1) || isNaN(+shape.cpy1);
+}
+
+var LinePath = extendShape({
+
+    type: 'ec-line',
+
+    style: {
+        stroke: '#000',
+        fill: null
+    },
+
+    shape: {
+        x1: 0,
+        y1: 0,
+        x2: 0,
+        y2: 0,
+        percent: 1,
+        cpx1: null,
+        cpy1: null
+    },
+
+    buildPath: function (ctx, shape) {
+        (isLine(shape) ? straightLineProto : bezierCurveProto).buildPath(ctx, shape);
+    },
+
+    pointAt: function (t) {
+        return isLine(this.shape)
+            ? straightLineProto.pointAt.call(this, t)
+            : bezierCurveProto.pointAt.call(this, t);
+    },
+
+    tangentAt: function (t) {
+        var shape = this.shape;
+        var p = isLine(shape)
+            ? [shape.x2 - shape.x1, shape.y2 - shape.y1]
+            : bezierCurveProto.tangentAt.call(this, t);
+        return normalize(p, p);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/Line
+ */
+
+var SYMBOL_CATEGORIES = ['fromSymbol', 'toSymbol'];
+
+function makeSymbolTypeKey(symbolCategory) {
+    return '_' + symbolCategory + 'Type';
+}
+/**
+ * @inner
+ */
+function createSymbol$1(name, lineData, idx) {
+    var color = lineData.getItemVisual(idx, 'color');
+    var symbolType = lineData.getItemVisual(idx, name);
+    var symbolSize = lineData.getItemVisual(idx, name + 'Size');
+
+    if (!symbolType || symbolType === 'none') {
+        return;
+    }
+
+    if (!isArray(symbolSize)) {
+        symbolSize = [symbolSize, symbolSize];
+    }
+    var symbolPath = createSymbol(
+        symbolType, -symbolSize[0] / 2, -symbolSize[1] / 2,
+        symbolSize[0], symbolSize[1], color
+    );
+
+    symbolPath.name = name;
+
+    return symbolPath;
+}
+
+function createLine(points) {
+    var line = new LinePath({
+        name: 'line'
+    });
+    setLinePoints(line.shape, points);
+    return line;
+}
+
+function setLinePoints(targetShape, points) {
+    var p1 = points[0];
+    var p2 = points[1];
+    var cp1 = points[2];
+    targetShape.x1 = p1[0];
+    targetShape.y1 = p1[1];
+    targetShape.x2 = p2[0];
+    targetShape.y2 = p2[1];
+    targetShape.percent = 1;
+
+    if (cp1) {
+        targetShape.cpx1 = cp1[0];
+        targetShape.cpy1 = cp1[1];
+    }
+    else {
+        targetShape.cpx1 = NaN;
+        targetShape.cpy1 = NaN;
+    }
+}
+
+function updateSymbolAndLabelBeforeLineUpdate () {
+    var lineGroup = this;
+    var symbolFrom = lineGroup.childOfName('fromSymbol');
+    var symbolTo = lineGroup.childOfName('toSymbol');
+    var label = lineGroup.childOfName('label');
+    // Quick reject
+    if (!symbolFrom && !symbolTo && label.ignore) {
+        return;
+    }
+
+    var invScale = 1;
+    var parentNode = this.parent;
+    while (parentNode) {
+        if (parentNode.scale) {
+            invScale /= parentNode.scale[0];
+        }
+        parentNode = parentNode.parent;
+    }
+
+    var line = lineGroup.childOfName('line');
+    // If line not changed
+    // FIXME Parent scale changed
+    if (!this.__dirty && !line.__dirty) {
+        return;
+    }
+
+    var percent = line.shape.percent;
+    var fromPos = line.pointAt(0);
+    var toPos = line.pointAt(percent);
+
+    var d = sub([], toPos, fromPos);
+    normalize(d, d);
+
+    if (symbolFrom) {
+        symbolFrom.attr('position', fromPos);
+        var tangent = line.tangentAt(0);
+        symbolFrom.attr('rotation', Math.PI / 2 - Math.atan2(
+            tangent[1], tangent[0]
+        ));
+        symbolFrom.attr('scale', [invScale * percent, invScale * percent]);
+    }
+    if (symbolTo) {
+        symbolTo.attr('position', toPos);
+        var tangent = line.tangentAt(1);
+        symbolTo.attr('rotation', -Math.PI / 2 - Math.atan2(
+            tangent[1], tangent[0]
+        ));
+        symbolTo.attr('scale', [invScale * percent, invScale * percent]);
+    }
+
+    if (!label.ignore) {
+        label.attr('position', toPos);
+
+        var textPosition;
+        var textAlign;
+        var textVerticalAlign;
+
+        var distance$$1 = 5 * invScale;
+        // End
+        if (label.__position === 'end') {
+            textPosition = [d[0] * distance$$1 + toPos[0], d[1] * distance$$1 + toPos[1]];
+            textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
+            textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
+        }
+        // Middle
+        else if (label.__position === 'middle') {
+            var halfPercent = percent / 2;
+            var tangent = line.tangentAt(halfPercent);
+            var n = [tangent[1], -tangent[0]];
+            var cp = line.pointAt(halfPercent);
+            if (n[1] > 0) {
+                n[0] = -n[0];
+                n[1] = -n[1];
+            }
+            textPosition = [cp[0] + n[0] * distance$$1, cp[1] + n[1] * distance$$1];
+            textAlign = 'center';
+            textVerticalAlign = 'bottom';
+            var rotation = -Math.atan2(tangent[1], tangent[0]);
+            if (toPos[0] < fromPos[0]) {
+                rotation = Math.PI + rotation;
+            }
+            label.attr('rotation', rotation);
+        }
+        // Start
+        else {
+            textPosition = [-d[0] * distance$$1 + fromPos[0], -d[1] * distance$$1 + fromPos[1]];
+            textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
+            textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+        }
+        label.attr({
+            style: {
+                // Use the user specified text align and baseline first
+                textVerticalAlign: label.__verticalAlign || textVerticalAlign,
+                textAlign: label.__textAlign || textAlign
+            },
+            position: textPosition,
+            scale: [invScale, invScale]
+        });
+    }
+}
+
+/**
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ * @alias {module:echarts/chart/helper/Line}
+ */
+function Line$1(lineData, idx, seriesScope) {
+    Group.call(this);
+
+    this._createLine(lineData, idx, seriesScope);
+}
+
+var lineProto = Line$1.prototype;
+
+// Update symbol position and rotation
+lineProto.beforeUpdate = updateSymbolAndLabelBeforeLineUpdate;
+
+lineProto._createLine = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+    var linePoints = lineData.getItemLayout(idx);
+
+    var line = createLine(linePoints);
+    line.shape.percent = 0;
+    initProps(line, {
+        shape: {
+            percent: 1
+        }
+    }, seriesModel, idx);
+
+    this.add(line);
+
+    var label = new Text({
+        name: 'label'
+    });
+    this.add(label);
+
+    each$1(SYMBOL_CATEGORIES, function (symbolCategory) {
+        var symbol = createSymbol$1(symbolCategory, lineData, idx);
+        // symbols must added after line to make sure
+        // it will be updated after line#update.
+        // Or symbol position and rotation update in line#beforeUpdate will be one frame slow
+        this.add(symbol);
+        this[makeSymbolTypeKey(symbolCategory)] = lineData.getItemVisual(idx, symbolCategory);
+    }, this);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+lineProto.updateData = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+
+    var line = this.childOfName('line');
+    var linePoints = lineData.getItemLayout(idx);
+    var target = {
+        shape: {}
+    };
+    setLinePoints(target.shape, linePoints);
+    updateProps(line, target, seriesModel, idx);
+
+    each$1(SYMBOL_CATEGORIES, function (symbolCategory) {
+        var symbolType = lineData.getItemVisual(idx, symbolCategory);
+        var key = makeSymbolTypeKey(symbolCategory);
+        // Symbol changed
+        if (this[key] !== symbolType) {
+            this.remove(this.childOfName(symbolCategory));
+            var symbol = createSymbol$1(symbolCategory, lineData, idx);
+            this.add(symbol);
+        }
+        this[key] = symbolType;
+    }, this);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+lineProto._updateCommonStl = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+
+    var line = this.childOfName('line');
+
+    var lineStyle = seriesScope && seriesScope.lineStyle;
+    var hoverLineStyle = seriesScope && seriesScope.hoverLineStyle;
+    var labelModel = seriesScope && seriesScope.labelModel;
+    var hoverLabelModel = seriesScope && seriesScope.hoverLabelModel;
+
+    // Optimization for large dataset
+    if (!seriesScope || lineData.hasItemOption) {
+        var itemModel = lineData.getItemModel(idx);
+
+        lineStyle = itemModel.getModel('lineStyle').getLineStyle();
+        hoverLineStyle = itemModel.getModel('emphasis.lineStyle').getLineStyle();
+
+        labelModel = itemModel.getModel('label');
+        hoverLabelModel = itemModel.getModel('emphasis.label');
+    }
+
+    var visualColor = lineData.getItemVisual(idx, 'color');
+    var visualOpacity = retrieve3(
+        lineData.getItemVisual(idx, 'opacity'),
+        lineStyle.opacity,
+        1
+    );
+
+    line.useStyle(defaults(
+        {
+            strokeNoScale: true,
+            fill: 'none',
+            stroke: visualColor,
+            opacity: visualOpacity
+        },
+        lineStyle
+    ));
+    line.hoverStyle = hoverLineStyle;
+
+    // Update symbol
+    each$1(SYMBOL_CATEGORIES, function (symbolCategory) {
+        var symbol = this.childOfName(symbolCategory);
+        if (symbol) {
+            symbol.setColor(visualColor);
+            symbol.setStyle({
+                opacity: visualOpacity
+            });
+        }
+    }, this);
+
+    var showLabel = labelModel.getShallow('show');
+    var hoverShowLabel = hoverLabelModel.getShallow('show');
+
+    var label = this.childOfName('label');
+    var defaultLabelColor;
+    var baseText;
+
+    // FIXME: the logic below probably should be merged to `graphic.setLabelStyle`.
+    if (showLabel || hoverShowLabel) {
+        defaultLabelColor = visualColor || '#000';
+
+        baseText = seriesModel.getFormattedLabel(idx, 'normal', lineData.dataType);
+        if (baseText == null) {
+            var rawVal = seriesModel.getRawValue(idx);
+            baseText = rawVal == null
+                ? lineData.getName(idx)
+                : isFinite(rawVal)
+                ? round$1(rawVal)
+                : rawVal;
+        }
+    }
+    var normalText = showLabel ? baseText : null;
+    var emphasisText = hoverShowLabel
+        ? retrieve2(
+            seriesModel.getFormattedLabel(idx, 'emphasis', lineData.dataType),
+            baseText
+        )
+        : null;
+
+    var labelStyle = label.style;
+
+    // Always set `textStyle` even if `normalStyle.text` is null, because default
+    // values have to be set on `normalStyle`.
+    if (normalText != null || emphasisText != null) {
+        setTextStyle(label.style, labelModel, {
+            text: normalText
+        }, {
+            autoColor: defaultLabelColor
+        });
+
+        label.__textAlign = labelStyle.textAlign;
+        label.__verticalAlign = labelStyle.textVerticalAlign;
+        // 'start', 'middle', 'end'
+        label.__position = labelModel.get('position') || 'middle';
+    }
+
+    if (emphasisText != null) {
+        // Only these properties supported in this emphasis style here.
+        label.hoverStyle = {
+            text: emphasisText,
+            textFill: hoverLabelModel.getTextColor(true),
+            // For merging hover style to normal style, do not use
+            // `hoverLabelModel.getFont()` here.
+            fontStyle: hoverLabelModel.getShallow('fontStyle'),
+            fontWeight: hoverLabelModel.getShallow('fontWeight'),
+            fontSize: hoverLabelModel.getShallow('fontSize'),
+            fontFamily: hoverLabelModel.getShallow('fontFamily')
+        };
+    }
+    else {
+        label.hoverStyle = {
+            text: null
+        };
+    }
+
+    label.ignore = !showLabel && !hoverShowLabel;
+
+    setHoverStyle(this);
+};
+
+lineProto.highlight = function () {
+    this.trigger('emphasis');
+};
+
+lineProto.downplay = function () {
+    this.trigger('normal');
+};
+
+lineProto.updateLayout = function (lineData, idx) {
+    this.setLinePoints(lineData.getItemLayout(idx));
+};
+
+lineProto.setLinePoints = function (points) {
+    var linePath = this.childOfName('line');
+    setLinePoints(linePath.shape, points);
+    linePath.dirty();
+};
+
+inherits(Line$1, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/LineDraw
+ */
+
+// import IncrementalDisplayable from 'zrender/src/graphic/IncrementalDisplayable';
+
+/**
+ * @alias module:echarts/component/marker/LineDraw
+ * @constructor
+ */
+function LineDraw(ctor) {
+    this._ctor = ctor || Line$1;
+
+    this.group = new Group();
+}
+
+var lineDrawProto = LineDraw.prototype;
+
+lineDrawProto.isPersistent = function () {
+    return true;
+};
+
+/**
+ * @param {module:echarts/data/List} lineData
+ */
+lineDrawProto.updateData = function (lineData) {
+    var lineDraw = this;
+    var group = lineDraw.group;
+
+    var oldLineData = lineDraw._lineData;
+    lineDraw._lineData = lineData;
+
+    // There is no oldLineData only when first rendering or switching from
+    // stream mode to normal mode, where previous elements should be removed.
+    if (!oldLineData) {
+        group.removeAll();
+    }
+
+    var seriesScope = makeSeriesScope$1(lineData);
+
+    lineData.diff(oldLineData)
+        .add(function (idx) {
+            doAdd(lineDraw, lineData, idx, seriesScope);
+        })
+        .update(function (newIdx, oldIdx) {
+            doUpdate(lineDraw, oldLineData, lineData, oldIdx, newIdx, seriesScope);
+        })
+        .remove(function (idx) {
+            group.remove(oldLineData.getItemGraphicEl(idx));
+        })
+        .execute();
+};
+
+function doAdd(lineDraw, lineData, idx, seriesScope) {
+    var itemLayout = lineData.getItemLayout(idx);
+
+    if (!lineNeedsDraw(itemLayout)) {
+        return;
+    }
+
+    var el = new lineDraw._ctor(lineData, idx, seriesScope);
+    lineData.setItemGraphicEl(idx, el);
+    lineDraw.group.add(el);
+}
+
+function doUpdate(lineDraw, oldLineData, newLineData, oldIdx, newIdx, seriesScope) {
+    var itemEl = oldLineData.getItemGraphicEl(oldIdx);
+
+    if (!lineNeedsDraw(newLineData.getItemLayout(newIdx))) {
+        lineDraw.group.remove(itemEl);
+        return;
+    }
+
+    if (!itemEl) {
+        itemEl = new lineDraw._ctor(newLineData, newIdx, seriesScope);
+    }
+    else {
+        itemEl.updateData(newLineData, newIdx, seriesScope);
+    }
+
+    newLineData.setItemGraphicEl(newIdx, itemEl);
+
+    lineDraw.group.add(itemEl);
+}
+
+lineDrawProto.updateLayout = function () {
+    var lineData = this._lineData;
+
+    // Do not support update layout in incremental mode.
+    if (!lineData) {
+        return;
+    }
+
+    lineData.eachItemGraphicEl(function (el, idx) {
+        el.updateLayout(lineData, idx);
+    }, this);
+};
+
+lineDrawProto.incrementalPrepareUpdate = function (lineData) {
+    this._seriesScope = makeSeriesScope$1(lineData);
+    this._lineData = null;
+    this.group.removeAll();
+};
+
+lineDrawProto.incrementalUpdate = function (taskParams, lineData) {
+    function updateIncrementalAndHover(el) {
+        if (!el.isGroup) {
+            el.incremental = el.useHoverLayer = true;
+        }
+    }
+
+    for (var idx = taskParams.start; idx < taskParams.end; idx++) {
+        var itemLayout = lineData.getItemLayout(idx);
+
+        if (lineNeedsDraw(itemLayout)) {
+            var el = new this._ctor(lineData, idx, this._seriesScope);
+            el.traverse(updateIncrementalAndHover);
+
+            this.group.add(el);
+            lineData.setItemGraphicEl(idx, el);
+        }
+    }
+};
+
+function makeSeriesScope$1(lineData) {
+    var hostModel = lineData.hostModel;
+    return {
+        lineStyle: hostModel.getModel('lineStyle').getLineStyle(),
+        hoverLineStyle: hostModel.getModel('emphasis.lineStyle').getLineStyle(),
+        labelModel: hostModel.getModel('label'),
+        hoverLabelModel: hostModel.getModel('emphasis.label')
+    };
+}
+
+lineDrawProto.remove = function () {
+    this._clearIncremental();
+    this._incremental = null;
+    this.group.removeAll();
+};
+
+lineDrawProto._clearIncremental = function () {
+    var incremental = this._incremental;
+    if (incremental) {
+        incremental.clearDisplaybles();
+    }
+};
+
+function isPointNaN(pt) {
+    return isNaN(pt[0]) || isNaN(pt[1]);
+}
+
+function lineNeedsDraw(pts) {
+    return !isPointNaN(pts[0]) && !isPointNaN(pts[1]);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var v1 = [];
+var v2 = [];
+var v3 = [];
+var quadraticAt$1 = quadraticAt;
+var v2DistSquare = distSquare;
+var mathAbs$1 = Math.abs;
+function intersectCurveCircle(curvePoints, center, radius) {
+    var p0 = curvePoints[0];
+    var p1 = curvePoints[1];
+    var p2 = curvePoints[2];
+
+    var d = Infinity;
+    var t;
+    var radiusSquare = radius * radius;
+    var interval = 0.1;
+
+    for (var _t = 0.1; _t <= 0.9; _t += 0.1) {
+        v1[0] = quadraticAt$1(p0[0], p1[0], p2[0], _t);
+        v1[1] = quadraticAt$1(p0[1], p1[1], p2[1], _t);
+        var diff = mathAbs$1(v2DistSquare(v1, center) - radiusSquare);
+        if (diff < d) {
+            d = diff;
+            t = _t;
+        }
+    }
+
+    // Assume the segment is monotone，Find root through Bisection method
+    // At most 32 iteration
+    for (var i = 0; i < 32; i++) {
+        // var prev = t - interval;
+        var next = t + interval;
+        // v1[0] = quadraticAt(p0[0], p1[0], p2[0], prev);
+        // v1[1] = quadraticAt(p0[1], p1[1], p2[1], prev);
+        v2[0] = quadraticAt$1(p0[0], p1[0], p2[0], t);
+        v2[1] = quadraticAt$1(p0[1], p1[1], p2[1], t);
+        v3[0] = quadraticAt$1(p0[0], p1[0], p2[0], next);
+        v3[1] = quadraticAt$1(p0[1], p1[1], p2[1], next);
+
+        var diff = v2DistSquare(v2, center) - radiusSquare;
+        if (mathAbs$1(diff) < 1e-2) {
+            break;
+        }
+
+        // var prevDiff = v2DistSquare(v1, center) - radiusSquare;
+        var nextDiff = v2DistSquare(v3, center) - radiusSquare;
+
+        interval /= 2;
+        if (diff < 0) {
+            if (nextDiff >= 0) {
+                t = t + interval;
+            }
+            else {
+                t = t - interval;
+            }
+        }
+        else {
+            if (nextDiff >= 0) {
+                t = t - interval;
+            }
+            else {
+                t = t + interval;
+            }
+        }
+    }
+
+    return t;
+}
+
+// Adjust edge to avoid
+var adjustEdge = function (graph, scale$$1) {
+    var tmp0 = [];
+    var quadraticSubdivide$$1 = quadraticSubdivide;
+    var pts = [[], [], []];
+    var pts2 = [[], []];
+    var v = [];
+    scale$$1 /= 2;
+
+    function getSymbolSize(node) {
+        var symbolSize = node.getVisual('symbolSize');
+        if (symbolSize instanceof Array) {
+            symbolSize = (symbolSize[0] + symbolSize[1]) / 2;
+        }
+        return symbolSize;
+    }
+    graph.eachEdge(function (edge, idx) {
+        var linePoints = edge.getLayout();
+        var fromSymbol = edge.getVisual('fromSymbol');
+        var toSymbol = edge.getVisual('toSymbol');
+
+        if (!linePoints.__original) {
+            linePoints.__original = [
+                clone$1(linePoints[0]),
+                clone$1(linePoints[1])
+            ];
+            if (linePoints[2]) {
+                linePoints.__original.push(clone$1(linePoints[2]));
+            }
+        }
+        var originalPoints = linePoints.__original;
+        // Quadratic curve
+        if (linePoints[2] != null) {
+            copy(pts[0], originalPoints[0]);
+            copy(pts[1], originalPoints[2]);
+            copy(pts[2], originalPoints[1]);
+            if (fromSymbol && fromSymbol != 'none') {
+                var symbolSize = getSymbolSize(edge.node1);
+
+                var t = intersectCurveCircle(pts, originalPoints[0], symbolSize * scale$$1);
+                // Subdivide and get the second
+                quadraticSubdivide$$1(pts[0][0], pts[1][0], pts[2][0], t, tmp0);
+                pts[0][0] = tmp0[3];
+                pts[1][0] = tmp0[4];
+                quadraticSubdivide$$1(pts[0][1], pts[1][1], pts[2][1], t, tmp0);
+                pts[0][1] = tmp0[3];
+                pts[1][1] = tmp0[4];
+            }
+            if (toSymbol && toSymbol != 'none') {
+                var symbolSize = getSymbolSize(edge.node2);
+
+                var t = intersectCurveCircle(pts, originalPoints[1], symbolSize * scale$$1);
+                // Subdivide and get the first
+                quadraticSubdivide$$1(pts[0][0], pts[1][0], pts[2][0], t, tmp0);
+                pts[1][0] = tmp0[1];
+                pts[2][0] = tmp0[2];
+                quadraticSubdivide$$1(pts[0][1], pts[1][1], pts[2][1], t, tmp0);
+                pts[1][1] = tmp0[1];
+                pts[2][1] = tmp0[2];
+            }
+            // Copy back to layout
+            copy(linePoints[0], pts[0]);
+            copy(linePoints[1], pts[2]);
+            copy(linePoints[2], pts[1]);
+        }
+        // Line
+        else {
+            copy(pts2[0], originalPoints[0]);
+            copy(pts2[1], originalPoints[1]);
+
+            sub(v, pts2[1], pts2[0]);
+            normalize(v, v);
+            if (fromSymbol && fromSymbol != 'none') {
+
+                var symbolSize = getSymbolSize(edge.node1);
+
+                scaleAndAdd(pts2[0], pts2[0], v, symbolSize * scale$$1);
+            }
+            if (toSymbol && toSymbol != 'none') {
+                var symbolSize = getSymbolSize(edge.node2);
+
+                scaleAndAdd(pts2[1], pts2[1], v, -symbolSize * scale$$1);
+            }
+            copy(linePoints[0], pts2[0]);
+            copy(linePoints[1], pts2[1]);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var nodeOpacityPath = ['itemStyle', 'opacity'];
+var lineOpacityPath = ['lineStyle', 'opacity'];
+
+function getItemOpacity(item, opacityPath) {
+    return item.getVisual('opacity') || item.getModel().get(opacityPath);
+}
+
+function fadeOutItem(item, opacityPath, opacityRatio) {
+    var el = item.getGraphicEl();
+
+    var opacity = getItemOpacity(item, opacityPath);
+    if (opacityRatio != null) {
+        opacity == null && (opacity = 1);
+        opacity *= opacityRatio;
+    }
+
+    el.downplay && el.downplay();
+    el.traverse(function (child) {
+        if (child.type !== 'group') {
+            child.setStyle('opacity', opacity);
+        }
+    });
+}
+
+function fadeInItem(item, opacityPath) {
+    var opacity = getItemOpacity(item, opacityPath);
+    var el = item.getGraphicEl();
+
+    el.highlight && el.highlight();
+    el.traverse(function (child) {
+        if (child.type !== 'group') {
+            child.setStyle('opacity', opacity);
+        }
+    });
+}
+
+extendChartView({
+
+    type: 'graph',
+
+    init: function (ecModel, api) {
+        var symbolDraw = new SymbolDraw();
+        var lineDraw = new LineDraw();
+        var group = this.group;
+
+        this._controller = new RoamController(api.getZr());
+        this._controllerHost = {target: group};
+
+        group.add(symbolDraw.group);
+        group.add(lineDraw.group);
+
+        this._symbolDraw = symbolDraw;
+        this._lineDraw = lineDraw;
+
+        this._firstRender = true;
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+
+        this._model = seriesModel;
+        this._nodeScaleRatio = seriesModel.get('nodeScaleRatio');
+
+        var symbolDraw = this._symbolDraw;
+        var lineDraw = this._lineDraw;
+
+        var group = this.group;
+
+        if (coordSys.type === 'view') {
+            var groupNewProp = {
+                position: coordSys.position,
+                scale: coordSys.scale
+            };
+            if (this._firstRender) {
+                group.attr(groupNewProp);
+            }
+            else {
+                updateProps(group, groupNewProp, seriesModel);
+            }
+        }
+        // Fix edge contact point with node
+        adjustEdge(seriesModel.getGraph(), this._getNodeGlobalScale(seriesModel));
+
+        var data = seriesModel.getData();
+        symbolDraw.updateData(data);
+
+        var edgeData = seriesModel.getEdgeData();
+        lineDraw.updateData(edgeData);
+
+        this._updateNodeAndLinkScale();
+
+        this._updateController(seriesModel, ecModel, api);
+
+        clearTimeout(this._layoutTimeout);
+        var forceLayout = seriesModel.forceLayout;
+        var layoutAnimation = seriesModel.get('force.layoutAnimation');
+        if (forceLayout) {
+            this._startForceLayoutIteration(forceLayout, layoutAnimation);
+        }
+
+        data.eachItemGraphicEl(function (el, idx) {
+            var itemModel = data.getItemModel(idx);
+            // Update draggable
+            el.off('drag').off('dragend');
+            var draggable = data.getItemModel(idx).get('draggable');
+            if (draggable) {
+                el.on('drag', function () {
+                    if (forceLayout) {
+                        forceLayout.warmUp();
+                        !this._layouting
+                            && this._startForceLayoutIteration(forceLayout, layoutAnimation);
+                        forceLayout.setFixed(idx);
+                        // Write position back to layout
+                        data.setItemLayout(idx, el.position);
+                    }
+                }, this).on('dragend', function () {
+                    if (forceLayout) {
+                        forceLayout.setUnfixed(idx);
+                    }
+                }, this);
+            }
+            el.setDraggable(draggable && forceLayout);
+
+            el.off('mouseover', el.__focusNodeAdjacency);
+            el.off('mouseout', el.__unfocusNodeAdjacency);
+
+            if (itemModel.get('focusNodeAdjacency')) {
+                el.on('mouseover', el.__focusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'focusNodeAdjacency',
+                        seriesId: seriesModel.id,
+                        dataIndex: el.dataIndex
+                    });
+                });
+                el.on('mouseout', el.__unfocusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'unfocusNodeAdjacency',
+                        seriesId: seriesModel.id
+                    });
+                });
+
+            }
+
+        }, this);
+
+        data.graph.eachEdge(function (edge) {
+            var el = edge.getGraphicEl();
+
+            el.off('mouseover', el.__focusNodeAdjacency);
+            el.off('mouseout', el.__unfocusNodeAdjacency);
+
+            if (edge.getModel().get('focusNodeAdjacency')) {
+                el.on('mouseover', el.__focusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'focusNodeAdjacency',
+                        seriesId: seriesModel.id,
+                        edgeDataIndex: edge.dataIndex
+                    });
+                });
+                el.on('mouseout', el.__unfocusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'unfocusNodeAdjacency',
+                        seriesId: seriesModel.id
+                    });
+                });
+            }
+        });
+
+        var circularRotateLabel = seriesModel.get('layout') === 'circular'
+            && seriesModel.get('circular.rotateLabel');
+        var cx = data.getLayout('cx');
+        var cy = data.getLayout('cy');
+        data.eachItemGraphicEl(function (el, idx) {
+            var symbolPath = el.getSymbolPath();
+            if (circularRotateLabel) {
+                var pos = data.getItemLayout(idx);
+                var rad = Math.atan2(pos[1] - cy, pos[0] - cx);
+                if (rad < 0) {
+                    rad = Math.PI * 2 + rad;
+                }
+                var isLeft = pos[0] < cx;
+                if (isLeft) {
+                    rad = rad - Math.PI;
+                }
+                var textPosition = isLeft ? 'left' : 'right';
+                symbolPath.setStyle({
+                    textRotation: -rad,
+                    textPosition: textPosition,
+                    textOrigin: 'center'
+                });
+                symbolPath.hoverStyle && (symbolPath.hoverStyle.textPosition = textPosition);
+            }
+            else {
+                symbolPath.setStyle({
+                    textRotation: 0
+                });
+            }
+        });
+
+        this._firstRender = false;
+    },
+
+    dispose: function () {
+        this._controller && this._controller.dispose();
+        this._controllerHost = {};
+    },
+
+    focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
+        var data = this._model.getData();
+        var graph = data.graph;
+        var dataIndex = payload.dataIndex;
+        var edgeDataIndex = payload.edgeDataIndex;
+
+        var node = graph.getNodeByIndex(dataIndex);
+        var edge = graph.getEdgeByIndex(edgeDataIndex);
+
+        if (!node && !edge) {
+            return;
+        }
+
+        graph.eachNode(function (node) {
+            fadeOutItem(node, nodeOpacityPath, 0.1);
+        });
+        graph.eachEdge(function (edge) {
+            fadeOutItem(edge, lineOpacityPath, 0.1);
+        });
+
+        if (node) {
+            fadeInItem(node, nodeOpacityPath);
+            each$1(node.edges, function (adjacentEdge) {
+                if (adjacentEdge.dataIndex < 0) {
+                    return;
+                }
+                fadeInItem(adjacentEdge, lineOpacityPath);
+                fadeInItem(adjacentEdge.node1, nodeOpacityPath);
+                fadeInItem(adjacentEdge.node2, nodeOpacityPath);
+            });
+        }
+        if (edge) {
+            fadeInItem(edge, lineOpacityPath);
+            fadeInItem(edge.node1, nodeOpacityPath);
+            fadeInItem(edge.node2, nodeOpacityPath);
+        }
+    },
+
+    unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
+        var graph = this._model.getData().graph;
+
+        graph.eachNode(function (node) {
+            fadeOutItem(node, nodeOpacityPath);
+        });
+        graph.eachEdge(function (edge) {
+            fadeOutItem(edge, lineOpacityPath);
+        });
+    },
+
+    _startForceLayoutIteration: function (forceLayout, layoutAnimation) {
+        var self = this;
+        (function step() {
+            forceLayout.step(function (stopped) {
+                self.updateLayout(self._model);
+                (self._layouting = !stopped) && (
+                    layoutAnimation
+                        ? (self._layoutTimeout = setTimeout(step, 16))
+                        : step()
+                );
+            });
+        })();
+    },
+
+    _updateController: function (seriesModel, ecModel, api) {
+        var controller = this._controller;
+        var controllerHost = this._controllerHost;
+        var group = this.group;
+
+        controller.setPointerChecker(function (e, x, y) {
+            var rect = group.getBoundingRect();
+            rect.applyTransform(group.transform);
+            return rect.contain(x, y)
+                && !onIrrelevantElement(e, api, seriesModel);
+        });
+
+        if (seriesModel.coordinateSystem.type !== 'view') {
+            controller.disable();
+            return;
+        }
+        controller.enable(seriesModel.get('roam'));
+        controllerHost.zoomLimit = seriesModel.get('scaleLimit');
+        controllerHost.zoom = seriesModel.coordinateSystem.getZoom();
+
+        controller
+            .off('pan')
+            .off('zoom')
+            .on('pan', function (dx, dy) {
+                updateViewOnPan(controllerHost, dx, dy);
+                api.dispatchAction({
+                    seriesId: seriesModel.id,
+                    type: 'graphRoam',
+                    dx: dx,
+                    dy: dy
+                });
+            })
+            .on('zoom', function (zoom, mouseX, mouseY) {
+                updateViewOnZoom(controllerHost, zoom, mouseX, mouseY);
+                api.dispatchAction({
+                    seriesId: seriesModel.id,
+                    type: 'graphRoam',
+                    zoom:  zoom,
+                    originX: mouseX,
+                    originY: mouseY
+                });
+                this._updateNodeAndLinkScale();
+                adjustEdge(seriesModel.getGraph(), this._getNodeGlobalScale(seriesModel));
+                this._lineDraw.updateLayout();
+            }, this);
+    },
+
+    _updateNodeAndLinkScale: function () {
+        var seriesModel = this._model;
+        var data = seriesModel.getData();
+
+        var nodeScale = this._getNodeGlobalScale(seriesModel);
+        var invScale = [nodeScale, nodeScale];
+
+        data.eachItemGraphicEl(function (el, idx) {
+            el.attr('scale', invScale);
+        });
+    },
+
+    _getNodeGlobalScale: function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys.type !== 'view') {
+            return 1;
+        }
+
+        var nodeScaleRatio = this._nodeScaleRatio;
+
+        var groupScale = coordSys.scale;
+        var groupZoom = (groupScale && groupScale[0]) || 1;
+        // Scale node when zoom changes
+        var roamZoom = coordSys.getZoom();
+        var nodeScale = (roamZoom - 1) * nodeScaleRatio + 1;
+
+        return nodeScale / groupZoom;
+    },
+
+    updateLayout: function (seriesModel) {
+        adjustEdge(seriesModel.getGraph(), this._getNodeGlobalScale(seriesModel));
+
+        this._symbolDraw.updateLayout();
+        this._lineDraw.updateLayout();
+    },
+
+    remove: function (ecModel, api) {
+        this._symbolDraw && this._symbolDraw.remove();
+        this._lineDraw && this._lineDraw.remove();
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var actionInfo = {
+    type: 'graphRoam',
+    event: 'graphRoam',
+    update: 'none'
+};
+
+/**
+ * @payload
+ * @property {string} name Series name
+ * @property {number} [dx]
+ * @property {number} [dy]
+ * @property {number} [zoom]
+ * @property {number} [originX]
+ * @property {number} [originY]
+ */
+registerAction(actionInfo, function (payload, ecModel) {
+    ecModel.eachComponent({mainType: 'series', query: payload}, function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+
+        var res = updateCenterAndZoom(coordSys, payload);
+
+        seriesModel.setCenter
+            && seriesModel.setCenter(res.center);
+
+        seriesModel.setZoom
+            && seriesModel.setZoom(res.zoom);
+    });
+});
+
+
+/**
+ * @payload
+ * @property {number} [seriesIndex]
+ * @property {string} [seriesId]
+ * @property {string} [seriesName]
+ * @property {number} [dataIndex]
+ */
+registerAction({
+    type: 'focusNodeAdjacency',
+    event: 'focusNodeAdjacency',
+    update: 'series.graph:focusNodeAdjacency'
+}, function () {});
+
+/**
+ * @payload
+ * @property {number} [seriesIndex]
+ * @property {string} [seriesId]
+ * @property {string} [seriesName]
+ */
+registerAction({
+    type: 'unfocusNodeAdjacency',
+    event: 'unfocusNodeAdjacency',
+    update: 'series.graph:unfocusNodeAdjacency'
+}, function () {});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var categoryFilter = function (ecModel) {
+    var legendModels = ecModel.findComponents({
+        mainType: 'legend'
+    });
+    if (!legendModels || !legendModels.length) {
+        return;
+    }
+    ecModel.eachSeriesByType('graph', function (graphSeries) {
+        var categoriesData = graphSeries.getCategoriesData();
+        var graph = graphSeries.getGraph();
+        var data = graph.data;
+
+        var categoryNames = categoriesData.mapArray(categoriesData.getName);
+
+        data.filterSelf(function (idx) {
+            var model = data.getItemModel(idx);
+            var category = model.getShallow('category');
+            if (category != null) {
+                if (typeof category === 'number') {
+                    category = categoryNames[category];
+                }
+                // If in any legend component the status is not selected.
+                for (var i = 0; i < legendModels.length; i++) {
+                    if (!legendModels[i].isSelected(category)) {
+                        return false;
+                    }
+                }
+            }
+            return true;
+        });
+    }, this);
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var categoryVisual = function (ecModel) {
+
+    var paletteScope = {};
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var categoriesData = seriesModel.getCategoriesData();
+        var data = seriesModel.getData();
+
+        var categoryNameIdxMap = {};
+
+        categoriesData.each(function (idx) {
+            var name = categoriesData.getName(idx);
+            // Add prefix to avoid conflict with Object.prototype.
+            categoryNameIdxMap['ec-' + name] = idx;
+
+            var itemModel = categoriesData.getItemModel(idx);
+            var color = itemModel.get('itemStyle.color')
+                || seriesModel.getColorFromPalette(name, paletteScope);
+            categoriesData.setItemVisual(idx, 'color', color);
+        });
+
+        // Assign category color to visual
+        if (categoriesData.count()) {
+            data.each(function (idx) {
+                var model = data.getItemModel(idx);
+                var category = model.getShallow('category');
+                if (category != null) {
+                    if (typeof category === 'string') {
+                        category = categoryNameIdxMap['ec-' + category];
+                    }
+                    if (!data.getItemVisual(idx, 'color', true)) {
+                        data.setItemVisual(
+                            idx, 'color',
+                            categoriesData.getItemVisual(category, 'color')
+                        );
+                    }
+                }
+            });
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function normalize$1(a) {
+    if (!(a instanceof Array)) {
+        a = [a, a];
+    }
+    return a;
+}
+
+var edgeVisual = function (ecModel) {
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var graph = seriesModel.getGraph();
+        var edgeData = seriesModel.getEdgeData();
+        var symbolType = normalize$1(seriesModel.get('edgeSymbol'));
+        var symbolSize = normalize$1(seriesModel.get('edgeSymbolSize'));
+
+        var colorQuery = 'lineStyle.color'.split('.');
+        var opacityQuery = 'lineStyle.opacity'.split('.');
+
+        edgeData.setVisual('fromSymbol', symbolType && symbolType[0]);
+        edgeData.setVisual('toSymbol', symbolType && symbolType[1]);
+        edgeData.setVisual('fromSymbolSize', symbolSize && symbolSize[0]);
+        edgeData.setVisual('toSymbolSize', symbolSize && symbolSize[1]);
+        edgeData.setVisual('color', seriesModel.get(colorQuery));
+        edgeData.setVisual('opacity', seriesModel.get(opacityQuery));
+
+        edgeData.each(function (idx) {
+            var itemModel = edgeData.getItemModel(idx);
+            var edge = graph.getEdgeByIndex(idx);
+            var symbolType = normalize$1(itemModel.getShallow('symbol', true));
+            var symbolSize = normalize$1(itemModel.getShallow('symbolSize', true));
+            // Edge visual must after node visual
+            var color = itemModel.get(colorQuery);
+            var opacity = itemModel.get(opacityQuery);
+            switch (color) {
+                case 'source':
+                    color = edge.node1.getVisual('color');
+                    break;
+                case 'target':
+                    color = edge.node2.getVisual('color');
+                    break;
+            }
+
+            symbolType[0] && edge.setVisual('fromSymbol', symbolType[0]);
+            symbolType[1] && edge.setVisual('toSymbol', symbolType[1]);
+            symbolSize[0] && edge.setVisual('fromSymbolSize', symbolSize[0]);
+            symbolSize[1] && edge.setVisual('toSymbolSize', symbolSize[1]);
+
+            edge.setVisual('color', color);
+            edge.setVisual('opacity', opacity);
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function simpleLayout$1(seriesModel) {
+    var coordSys = seriesModel.coordinateSystem;
+    if (coordSys && coordSys.type !== 'view') {
+        return;
+    }
+    var graph = seriesModel.getGraph();
+
+    graph.eachNode(function (node) {
+        var model = node.getModel();
+        node.setLayout([+model.get('x'), +model.get('y')]);
+    });
+
+    simpleLayoutEdge(graph);
+}
+
+function simpleLayoutEdge(graph) {
+    graph.eachEdge(function (edge) {
+        var curveness = edge.getModel().get('lineStyle.curveness') || 0;
+        var p1 = clone$1(edge.node1.getLayout());
+        var p2 = clone$1(edge.node2.getLayout());
+        var points = [p1, p2];
+        if (+curveness) {
+            points.push([
+                (p1[0] + p2[0]) / 2 - (p1[1] - p2[1]) * curveness,
+                (p1[1] + p2[1]) / 2 - (p2[0] - p1[0]) * curveness
+            ]);
+        }
+        edge.setLayout(points);
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var simpleLayout = function (ecModel, api) {
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var layout = seriesModel.get('layout');
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys && coordSys.type !== 'view') {
+            var data = seriesModel.getData();
+
+            var dimensions = [];
+            each$1(coordSys.dimensions, function (coordDim) {
+                dimensions = dimensions.concat(data.mapDimension(coordDim, true));
+            });
+
+            for (var dataIndex = 0; dataIndex < data.count(); dataIndex++) {
+                var value = [];
+                var hasValue = false;
+                for (var i = 0; i < dimensions.length; i++) {
+                    var val = data.get(dimensions[i], dataIndex);
+                    if (!isNaN(val)) {
+                        hasValue = true;
+                    }
+                    value.push(val);
+                }
+                if (hasValue) {
+                    data.setItemLayout(dataIndex, coordSys.dataToPoint(value));
+                }
+                else {
+                    // Also {Array.<number>}, not undefined to avoid if...else... statement
+                    data.setItemLayout(dataIndex, [NaN, NaN]);
+                }
+            }
+
+            simpleLayoutEdge(data.graph);
+        }
+        else if (!layout || layout === 'none') {
+            simpleLayout$1(seriesModel);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function circularLayout$1(seriesModel) {
+    var coordSys = seriesModel.coordinateSystem;
+    if (coordSys && coordSys.type !== 'view') {
+        return;
+    }
+
+    var rect = coordSys.getBoundingRect();
+
+    var nodeData = seriesModel.getData();
+    var graph = nodeData.graph;
+
+    var angle = 0;
+    var sum = nodeData.getSum('value');
+    var unitAngle = Math.PI * 2 / (sum || nodeData.count());
+
+    var cx = rect.width / 2 + rect.x;
+    var cy = rect.height / 2 + rect.y;
+
+    var r = Math.min(rect.width, rect.height) / 2;
+
+    graph.eachNode(function (node) {
+        var value = node.getValue('value');
+
+        angle += unitAngle * (sum ? value : 1) / 2;
+
+        node.setLayout([
+            r * Math.cos(angle) + cx,
+            r * Math.sin(angle) + cy
+        ]);
+
+        angle += unitAngle * (sum ? value : 1) / 2;
+    });
+
+    nodeData.setLayout({
+        cx: cx,
+        cy: cy
+    });
+
+    graph.eachEdge(function (edge) {
+        var curveness = edge.getModel().get('lineStyle.curveness') || 0;
+        var p1 = clone$1(edge.node1.getLayout());
+        var p2 = clone$1(edge.node2.getLayout());
+        var cp1;
+        var x12 = (p1[0] + p2[0]) / 2;
+        var y12 = (p1[1] + p2[1]) / 2;
+        if (+curveness) {
+            curveness *= 3;
+            cp1 = [
+                cx * curveness + x12 * (1 - curveness),
+                cy * curveness + y12 * (1 - curveness)
+            ];
+        }
+        edge.setLayout([p1, p2, cp1]);
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var circularLayout = function (ecModel) {
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        if (seriesModel.get('layout') === 'circular') {
+            circularLayout$1(seriesModel);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The layout implementation references to d3.js. The use of
+* the source code of this file is also subject to the terms
+* and consitions of its license (BSD-3Clause, see
+* <echarts/src/licenses/LICENSE-d3>).
+*/
+
+var scaleAndAdd$2 = scaleAndAdd;
+
+// function adjacentNode(n, e) {
+//     return e.n1 === n ? e.n2 : e.n1;
+// }
+
+function forceLayout$1(nodes, edges, opts) {
+    var rect = opts.rect;
+    var width = rect.width;
+    var height = rect.height;
+    var center = [rect.x + width / 2, rect.y + height / 2];
+    // var scale = opts.scale || 1;
+    var gravity = opts.gravity == null ? 0.1 : opts.gravity;
+
+    // for (var i = 0; i < edges.length; i++) {
+    //     var e = edges[i];
+    //     var n1 = e.n1;
+    //     var n2 = e.n2;
+    //     n1.edges = n1.edges || [];
+    //     n2.edges = n2.edges || [];
+    //     n1.edges.push(e);
+    //     n2.edges.push(e);
+    // }
+    // Init position
+    for (var i = 0; i < nodes.length; i++) {
+        var n = nodes[i];
+        if (!n.p) {
+            // Use the position from first adjecent node with defined position
+            // Or use a random position
+            // From d3
+            // if (n.edges) {
+            //     var j = -1;
+            //     while (++j < n.edges.length) {
+            //         var e = n.edges[j];
+            //         var other = adjacentNode(n, e);
+            //         if (other.p) {
+            //             n.p = vec2.clone(other.p);
+            //             break;
+            //         }
+            //     }
+            // }
+            // if (!n.p) {
+                n.p = create(
+                    width * (Math.random() - 0.5) + center[0],
+                    height * (Math.random() - 0.5) + center[1]
+                );
+            // }
+        }
+        n.pp = clone$1(n.p);
+        n.edges = null;
+    }
+
+    // Formula in 'Graph Drawing by Force-directed Placement'
+    // var k = scale * Math.sqrt(width * height / nodes.length);
+    // var k2 = k * k;
+
+    var friction = 0.6;
+
+    return {
+        warmUp: function () {
+            friction = 0.5;
+        },
+
+        setFixed: function (idx) {
+            nodes[idx].fixed = true;
+        },
+
+        setUnfixed: function (idx) {
+            nodes[idx].fixed = false;
+        },
+
+        step: function (cb) {
+            var v12 = [];
+            var nLen = nodes.length;
+            for (var i = 0; i < edges.length; i++) {
+                var e = edges[i];
+                var n1 = e.n1;
+                var n2 = e.n2;
+
+                sub(v12, n2.p, n1.p);
+                var d = len(v12) - e.d;
+                var w = n2.w / (n1.w + n2.w);
+
+                if (isNaN(w)) {
+                    w = 0;
+                }
+
+                normalize(v12, v12);
+
+                !n1.fixed && scaleAndAdd$2(n1.p, n1.p, v12, w * d * friction);
+                !n2.fixed && scaleAndAdd$2(n2.p, n2.p, v12, -(1 - w) * d * friction);
+            }
+            // Gravity
+            for (var i = 0; i < nLen; i++) {
+                var n = nodes[i];
+                if (!n.fixed) {
+                    sub(v12, center, n.p);
+                    // var d = vec2.len(v12);
+                    // vec2.scale(v12, v12, 1 / d);
+                    // var gravityFactor = gravity;
+                    scaleAndAdd$2(n.p, n.p, v12, gravity * friction);
+                }
+            }
+
+            // Repulsive
+            // PENDING
+            for (var i = 0; i < nLen; i++) {
+                var n1 = nodes[i];
+                for (var j = i + 1; j < nLen; j++) {
+                    var n2 = nodes[j];
+                    sub(v12, n2.p, n1.p);
+                    var d = len(v12);
+                    if (d === 0) {
+                        // Random repulse
+                        set(v12, Math.random() - 0.5, Math.random() - 0.5);
+                        d = 1;
+                    }
+                    var repFact = (n1.rep + n2.rep) / d / d;
+                    !n1.fixed && scaleAndAdd$2(n1.pp, n1.pp, v12, repFact);
+                    !n2.fixed && scaleAndAdd$2(n2.pp, n2.pp, v12, -repFact);
+                }
+            }
+            var v = [];
+            for (var i = 0; i < nLen; i++) {
+                var n = nodes[i];
+                if (!n.fixed) {
+                    sub(v, n.p, n.pp);
+                    scaleAndAdd$2(n.p, n.p, v, friction);
+                    copy(n.pp, n.p);
+                }
+            }
+
+            friction = friction * 0.992;
+
+            cb && cb(nodes, edges, friction < 0.01);
+        }
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var forceLayout = function (ecModel) {
+    ecModel.eachSeriesByType('graph', function (graphSeries) {
+        var coordSys = graphSeries.coordinateSystem;
+        if (coordSys && coordSys.type !== 'view') {
+            return;
+        }
+        if (graphSeries.get('layout') === 'force') {
+            var preservedPoints = graphSeries.preservedPoints || {};
+            var graph = graphSeries.getGraph();
+            var nodeData = graph.data;
+            var edgeData = graph.edgeData;
+            var forceModel = graphSeries.getModel('force');
+            var initLayout = forceModel.get('initLayout');
+            if (graphSeries.preservedPoints) {
+                nodeData.each(function (idx) {
+                    var id = nodeData.getId(idx);
+                    nodeData.setItemLayout(idx, preservedPoints[id] || [NaN, NaN]);
+                });
+            }
+            else if (!initLayout || initLayout === 'none') {
+                simpleLayout$1(graphSeries);
+            }
+            else if (initLayout === 'circular') {
+                circularLayout$1(graphSeries);
+            }
+
+            var nodeDataExtent = nodeData.getDataExtent('value');
+            var edgeDataExtent = edgeData.getDataExtent('value');
+            // var edgeDataExtent = edgeData.getDataExtent('value');
+            var repulsion = forceModel.get('repulsion');
+            var edgeLength = forceModel.get('edgeLength');
+            if (!isArray(repulsion)) {
+                repulsion = [repulsion, repulsion];
+            }
+            if (!isArray(edgeLength)) {
+                edgeLength = [edgeLength, edgeLength];
+            }
+            // Larger value has smaller length
+            edgeLength = [edgeLength[1], edgeLength[0]];
+
+            var nodes = nodeData.mapArray('value', function (value, idx) {
+                var point = nodeData.getItemLayout(idx);
+                var rep = linearMap(value, nodeDataExtent, repulsion);
+                if (isNaN(rep)) {
+                    rep = (repulsion[0] + repulsion[1]) / 2;
+                }
+                return {
+                    w: rep,
+                    rep: rep,
+                    fixed: nodeData.getItemModel(idx).get('fixed'),
+                    p: (!point || isNaN(point[0]) || isNaN(point[1])) ? null : point
+                };
+            });
+            var edges = edgeData.mapArray('value', function (value, idx) {
+                var edge = graph.getEdgeByIndex(idx);
+                var d = linearMap(value, edgeDataExtent, edgeLength);
+                if (isNaN(d)) {
+                    d = (edgeLength[0] + edgeLength[1]) / 2;
+                }
+                return {
+                    n1: nodes[edge.node1.dataIndex],
+                    n2: nodes[edge.node2.dataIndex],
+                    d: d,
+                    curveness: edge.getModel().get('lineStyle.curveness') || 0
+                };
+            });
+
+            var coordSys = graphSeries.coordinateSystem;
+            var rect = coordSys.getBoundingRect();
+            var forceInstance = forceLayout$1(nodes, edges, {
+                rect: rect,
+                gravity: forceModel.get('gravity')
+            });
+            var oldStep = forceInstance.step;
+            forceInstance.step = function (cb) {
+                for (var i = 0, l = nodes.length; i < l; i++) {
+                    if (nodes[i].fixed) {
+                        // Write back to layout instance
+                        copy(nodes[i].p, graph.getNodeByIndex(i).getLayout());
+                    }
+                }
+                oldStep(function (nodes, edges, stopped) {
+                    for (var i = 0, l = nodes.length; i < l; i++) {
+                        if (!nodes[i].fixed) {
+                            graph.getNodeByIndex(i).setLayout(nodes[i].p);
+                        }
+                        preservedPoints[nodeData.getId(i)] = nodes[i].p;
+                    }
+                    for (var i = 0, l = edges.length; i < l; i++) {
+                        var e = edges[i];
+                        var edge = graph.getEdgeByIndex(i);
+                        var p1 = e.n1.p;
+                        var p2 = e.n2.p;
+                        var points = edge.getLayout();
+                        points = points ? points.slice() : [];
+                        points[0] = points[0] || [];
+                        points[1] = points[1] || [];
+                        copy(points[0], p1);
+                        copy(points[1], p2);
+                        if (+e.curveness) {
+                            points[2] = [
+                                (p1[0] + p2[0]) / 2 - (p1[1] - p2[1]) * e.curveness,
+                                (p1[1] + p2[1]) / 2 - (p2[0] - p1[0]) * e.curveness
+                            ];
+                        }
+                        edge.setLayout(points);
+                    }
+                    // Update layout
+
+                    cb && cb(stopped);
+                });
+            };
+            graphSeries.forceLayout = forceInstance;
+            graphSeries.preservedPoints = preservedPoints;
+
+            // Step to get the layout
+            forceInstance.step();
+        }
+        else {
+            // Remove prev injected forceLayout instance
+            graphSeries.forceLayout = null;
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME Where to create the simple view coordinate system
+function getViewRect$1(seriesModel, api, aspect) {
+    var option = seriesModel.getBoxLayoutParams();
+    option.aspect = aspect;
+    return getLayoutRect(option, {
+        width: api.getWidth(),
+        height: api.getHeight()
+    });
+}
+
+var createView = function (ecModel, api) {
+    var viewList = [];
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var coordSysType = seriesModel.get('coordinateSystem');
+        if (!coordSysType || coordSysType === 'view') {
+
+            var data = seriesModel.getData();
+            var positions = data.mapArray(function (idx) {
+                var itemModel = data.getItemModel(idx);
+                return [+itemModel.get('x'), +itemModel.get('y')];
+            });
+
+            var min = [];
+            var max = [];
+
+            fromPoints(positions, min, max);
+
+            // If width or height is 0
+            if (max[0] - min[0] === 0) {
+                max[0] += 1;
+                min[0] -= 1;
+            }
+            if (max[1] - min[1] === 0) {
+                max[1] += 1;
+                min[1] -= 1;
+            }
+            var aspect = (max[0] - min[0]) / (max[1] - min[1]);
+            // FIXME If get view rect after data processed?
+            var viewRect = getViewRect$1(seriesModel, api, aspect);
+            // Position may be NaN, use view rect instead
+            if (isNaN(aspect)) {
+                min = [viewRect.x, viewRect.y];
+                max = [viewRect.x + viewRect.width, viewRect.y + viewRect.height];
+            }
+
+            var bbWidth = max[0] - min[0];
+            var bbHeight = max[1] - min[1];
+
+            var viewWidth = viewRect.width;
+            var viewHeight = viewRect.height;
+
+            var viewCoordSys = seriesModel.coordinateSystem = new View();
+            viewCoordSys.zoomLimit = seriesModel.get('scaleLimit');
+
+            viewCoordSys.setBoundingRect(
+                min[0], min[1], bbWidth, bbHeight
+            );
+            viewCoordSys.setViewRect(
+                viewRect.x, viewRect.y, viewWidth, viewHeight
+            );
+
+            // Update roam info
+            viewCoordSys.setCenter(seriesModel.get('center'));
+            viewCoordSys.setZoom(seriesModel.get('zoom'));
+
+            viewList.push(viewCoordSys);
+        }
+    });
+
+    return viewList;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerProcessor(categoryFilter);
+
+registerVisual(visualSymbol('graph', 'circle', null));
+registerVisual(categoryVisual);
+registerVisual(edgeVisual);
+
+registerLayout(simpleLayout);
+registerLayout(circularLayout);
+registerLayout(forceLayout);
+
+// Graph view coordinate system
+registerCoordinateSystem('graphView', {
+    create: createView
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var GaugeSeries = SeriesModel.extend({
+
+    type: 'series.gauge',
+
+    getInitialData: function (option, ecModel) {
+        var dataOpt = option.data || [];
+        if (!isArray(dataOpt)) {
+            dataOpt = [dataOpt];
+        }
+        option.data = dataOpt;
+        return createListSimply(this, ['value']);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        // 默认全局居中
+        center: ['50%', '50%'],
+        legendHoverLink: true,
+        radius: '75%',
+        startAngle: 225,
+        endAngle: -45,
+        clockwise: true,
+        // 最小值
+        min: 0,
+        // 最大值
+        max: 100,
+        // 分割段数，默认为10
+        splitNumber: 10,
+        // 坐标轴线
+        axisLine: {
+            // 默认显示，属性show控制显示与否
+            show: true,
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: [[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']],
+                width: 30
+            }
+        },
+        // 分隔线
+        splitLine: {
+            // 默认显示，属性show控制显示与否
+            show: true,
+            // 属性length控制线长
+            length: 30,
+            // 属性lineStyle（详见lineStyle）控制线条样式
+            lineStyle: {
+                color: '#eee',
+                width: 2,
+                type: 'solid'
+            }
+        },
+        // 坐标轴小标记
+        axisTick: {
+            // 属性show控制显示与否，默认不显示
+            show: true,
+            // 每份split细分多少段
+            splitNumber: 5,
+            // 属性length控制线长
+            length: 8,
+            // 属性lineStyle控制线条样式
+            lineStyle: {
+                color: '#eee',
+                width: 1,
+                type: 'solid'
+            }
+        },
+        axisLabel: {
+            show: true,
+            distance: 5,
+            // formatter: null,
+            color: 'auto'
+        },
+        pointer: {
+            show: true,
+            length: '80%',
+            width: 8
+        },
+        itemStyle: {
+            color: 'auto'
+        },
+        title: {
+            show: true,
+            // x, y，单位px
+            offsetCenter: [0, '-40%'],
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            color: '#333',
+            fontSize: 15
+        },
+        detail: {
+            show: true,
+            backgroundColor: 'rgba(0,0,0,0)',
+            borderWidth: 0,
+            borderColor: '#ccc',
+            width: 100,
+            height: null, // self-adaption
+            padding: [5, 10],
+            // x, y，单位px
+            offsetCenter: [0, '40%'],
+            // formatter: null,
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            color: 'auto',
+            fontSize: 30
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PointerPath = Path.extend({
+
+    type: 'echartsGaugePointer',
+
+    shape: {
+        angle: 0,
+
+        width: 10,
+
+        r: 10,
+
+        x: 0,
+
+        y: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var mathCos = Math.cos;
+        var mathSin = Math.sin;
+
+        var r = shape.r;
+        var width = shape.width;
+        var angle = shape.angle;
+        var x = shape.x - mathCos(angle) * width * (width >= r / 3 ? 1 : 2);
+        var y = shape.y - mathSin(angle) * width * (width >= r / 3 ? 1 : 2);
+
+        angle = shape.angle - Math.PI / 2;
+        ctx.moveTo(x, y);
+        ctx.lineTo(
+            shape.x + mathCos(angle) * width,
+            shape.y + mathSin(angle) * width
+        );
+        ctx.lineTo(
+            shape.x + mathCos(shape.angle) * r,
+            shape.y + mathSin(shape.angle) * r
+        );
+        ctx.lineTo(
+            shape.x - mathCos(angle) * width,
+            shape.y - mathSin(angle) * width
+        );
+        ctx.lineTo(x, y);
+        return;
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function parsePosition(seriesModel, api) {
+    var center = seriesModel.get('center');
+    var width = api.getWidth();
+    var height = api.getHeight();
+    var size = Math.min(width, height);
+    var cx = parsePercent$1(center[0], api.getWidth());
+    var cy = parsePercent$1(center[1], api.getHeight());
+    var r = parsePercent$1(seriesModel.get('radius'), size / 2);
+
+    return {
+        cx: cx,
+        cy: cy,
+        r: r
+    };
+}
+
+function formatLabel(label, labelFormatter) {
+    if (labelFormatter) {
+        if (typeof labelFormatter === 'string') {
+            label = labelFormatter.replace('{value}', label != null ? label : '');
+        }
+        else if (typeof labelFormatter === 'function') {
+            label = labelFormatter(label);
+        }
+    }
+
+    return label;
+}
+
+var PI2$5 = Math.PI * 2;
+
+var GaugeView = Chart.extend({
+
+    type: 'gauge',
+
+    render: function (seriesModel, ecModel, api) {
+
+        this.group.removeAll();
+
+        var colorList = seriesModel.get('axisLine.lineStyle.color');
+        var posInfo = parsePosition(seriesModel, api);
+
+        this._renderMain(
+            seriesModel, ecModel, api, colorList, posInfo
+        );
+    },
+
+    dispose: function () {},
+
+    _renderMain: function (seriesModel, ecModel, api, colorList, posInfo) {
+        var group = this.group;
+
+        var axisLineModel = seriesModel.getModel('axisLine');
+        var lineStyleModel = axisLineModel.getModel('lineStyle');
+
+        var clockwise = seriesModel.get('clockwise');
+        var startAngle = -seriesModel.get('startAngle') / 180 * Math.PI;
+        var endAngle = -seriesModel.get('endAngle') / 180 * Math.PI;
+
+        var angleRangeSpan = (endAngle - startAngle) % PI2$5;
+
+        var prevEndAngle = startAngle;
+        var axisLineWidth = lineStyleModel.get('width');
+
+        for (var i = 0; i < colorList.length; i++) {
+            // Clamp
+            var percent = Math.min(Math.max(colorList[i][0], 0), 1);
+            var endAngle = startAngle + angleRangeSpan * percent;
+            var sector = new Sector({
+                shape: {
+                    startAngle: prevEndAngle,
+                    endAngle: endAngle,
+                    cx: posInfo.cx,
+                    cy: posInfo.cy,
+                    clockwise: clockwise,
+                    r0: posInfo.r - axisLineWidth,
+                    r: posInfo.r
+                },
+                silent: true
+            });
+
+            sector.setStyle({
+                fill: colorList[i][1]
+            });
+
+            sector.setStyle(lineStyleModel.getLineStyle(
+                // Because we use sector to simulate arc
+                // so the properties for stroking are useless
+                ['color', 'borderWidth', 'borderColor']
+            ));
+
+            group.add(sector);
+
+            prevEndAngle = endAngle;
+        }
+
+        var getColor = function (percent) {
+            // Less than 0
+            if (percent <= 0) {
+                return colorList[0][1];
+            }
+            for (var i = 0; i < colorList.length; i++) {
+                if (colorList[i][0] >= percent
+                    && (i === 0 ? 0 : colorList[i - 1][0]) < percent
+                ) {
+                    return colorList[i][1];
+                }
+            }
+            // More than 1
+            return colorList[i - 1][1];
+        };
+
+        if (!clockwise) {
+            var tmp = startAngle;
+            startAngle = endAngle;
+            endAngle = tmp;
+        }
+
+        this._renderTicks(
+            seriesModel, ecModel, api, getColor, posInfo,
+            startAngle, endAngle, clockwise
+        );
+
+        this._renderPointer(
+            seriesModel, ecModel, api, getColor, posInfo,
+            startAngle, endAngle, clockwise
+        );
+
+        this._renderTitle(
+            seriesModel, ecModel, api, getColor, posInfo
+        );
+        this._renderDetail(
+            seriesModel, ecModel, api, getColor, posInfo
+        );
+    },
+
+    _renderTicks: function (
+        seriesModel, ecModel, api, getColor, posInfo,
+        startAngle, endAngle, clockwise
+    ) {
+        var group = this.group;
+        var cx = posInfo.cx;
+        var cy = posInfo.cy;
+        var r = posInfo.r;
+
+        var minVal = +seriesModel.get('min');
+        var maxVal = +seriesModel.get('max');
+
+        var splitLineModel = seriesModel.getModel('splitLine');
+        var tickModel = seriesModel.getModel('axisTick');
+        var labelModel = seriesModel.getModel('axisLabel');
+
+        var splitNumber = seriesModel.get('splitNumber');
+        var subSplitNumber = tickModel.get('splitNumber');
+
+        var splitLineLen = parsePercent$1(
+            splitLineModel.get('length'), r
+        );
+        var tickLen = parsePercent$1(
+            tickModel.get('length'), r
+        );
+
+        var angle = startAngle;
+        var step = (endAngle - startAngle) / splitNumber;
+        var subStep = step / subSplitNumber;
+
+        var splitLineStyle = splitLineModel.getModel('lineStyle').getLineStyle();
+        var tickLineStyle = tickModel.getModel('lineStyle').getLineStyle();
+
+        for (var i = 0; i <= splitNumber; i++) {
+            var unitX = Math.cos(angle);
+            var unitY = Math.sin(angle);
+            // Split line
+            if (splitLineModel.get('show')) {
+                var splitLine = new Line({
+                    shape: {
+                        x1: unitX * r + cx,
+                        y1: unitY * r + cy,
+                        x2: unitX * (r - splitLineLen) + cx,
+                        y2: unitY * (r - splitLineLen) + cy
+                    },
+                    style: splitLineStyle,
+                    silent: true
+                });
+                if (splitLineStyle.stroke === 'auto') {
+                    splitLine.setStyle({
+                        stroke: getColor(i / splitNumber)
+                    });
+                }
+
+                group.add(splitLine);
+            }
+
+            // Label
+            if (labelModel.get('show')) {
+                var label = formatLabel(
+                    round$1(i / splitNumber * (maxVal - minVal) + minVal),
+                    labelModel.get('formatter')
+                );
+                var distance = labelModel.get('distance');
+                var autoColor = getColor(i / splitNumber);
+
+                group.add(new Text({
+                    style: setTextStyle({}, labelModel, {
+                        text: label,
+                        x: unitX * (r - splitLineLen - distance) + cx,
+                        y: unitY * (r - splitLineLen - distance) + cy,
+                        textVerticalAlign: unitY < -0.4 ? 'top' : (unitY > 0.4 ? 'bottom' : 'middle'),
+                        textAlign: unitX < -0.4 ? 'left' : (unitX > 0.4 ? 'right' : 'center')
+                    }, {autoColor: autoColor}),
+                    silent: true
+                }));
+            }
+
+            // Axis tick
+            if (tickModel.get('show') && i !== splitNumber) {
+                for (var j = 0; j <= subSplitNumber; j++) {
+                    var unitX = Math.cos(angle);
+                    var unitY = Math.sin(angle);
+                    var tickLine = new Line({
+                        shape: {
+                            x1: unitX * r + cx,
+                            y1: unitY * r + cy,
+                            x2: unitX * (r - tickLen) + cx,
+                            y2: unitY * (r - tickLen) + cy
+                        },
+                        silent: true,
+                        style: tickLineStyle
+                    });
+
+                    if (tickLineStyle.stroke === 'auto') {
+                        tickLine.setStyle({
+                            stroke: getColor((i + j / subSplitNumber) / splitNumber)
+                        });
+                    }
+
+                    group.add(tickLine);
+                    angle += subStep;
+                }
+                angle -= subStep;
+            }
+            else {
+                angle += step;
+            }
+        }
+    },
+
+    _renderPointer: function (
+        seriesModel, ecModel, api, getColor, posInfo,
+        startAngle, endAngle, clockwise
+    ) {
+
+        var group = this.group;
+        var oldData = this._data;
+
+        if (!seriesModel.get('pointer.show')) {
+            // Remove old element
+            oldData && oldData.eachItemGraphicEl(function (el) {
+                group.remove(el);
+            });
+            return;
+        }
+
+        var valueExtent = [+seriesModel.get('min'), +seriesModel.get('max')];
+        var angleExtent = [startAngle, endAngle];
+
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+
+        data.diff(oldData)
+            .add(function (idx) {
+                var pointer = new PointerPath({
+                    shape: {
+                        angle: startAngle
+                    }
+                });
+
+                initProps(pointer, {
+                    shape: {
+                        angle: linearMap(data.get(valueDim, idx), valueExtent, angleExtent, true)
+                    }
+                }, seriesModel);
+
+                group.add(pointer);
+                data.setItemGraphicEl(idx, pointer);
+            })
+            .update(function (newIdx, oldIdx) {
+                var pointer = oldData.getItemGraphicEl(oldIdx);
+
+                updateProps(pointer, {
+                    shape: {
+                        angle: linearMap(data.get(valueDim, newIdx), valueExtent, angleExtent, true)
+                    }
+                }, seriesModel);
+
+                group.add(pointer);
+                data.setItemGraphicEl(newIdx, pointer);
+            })
+            .remove(function (idx) {
+                var pointer = oldData.getItemGraphicEl(idx);
+                group.remove(pointer);
+            })
+            .execute();
+
+        data.eachItemGraphicEl(function (pointer, idx) {
+            var itemModel = data.getItemModel(idx);
+            var pointerModel = itemModel.getModel('pointer');
+
+            pointer.setShape({
+                x: posInfo.cx,
+                y: posInfo.cy,
+                width: parsePercent$1(
+                    pointerModel.get('width'), posInfo.r
+                ),
+                r: parsePercent$1(pointerModel.get('length'), posInfo.r)
+            });
+
+            pointer.useStyle(itemModel.getModel('itemStyle').getItemStyle());
+
+            if (pointer.style.fill === 'auto') {
+                pointer.setStyle('fill', getColor(
+                    linearMap(data.get(valueDim, idx), valueExtent, [0, 1], true)
+                ));
+            }
+
+            setHoverStyle(
+                pointer, itemModel.getModel('emphasis.itemStyle').getItemStyle()
+            );
+        });
+
+        this._data = data;
+    },
+
+    _renderTitle: function (
+        seriesModel, ecModel, api, getColor, posInfo
+    ) {
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+        var titleModel = seriesModel.getModel('title');
+        if (titleModel.get('show')) {
+            var offsetCenter = titleModel.get('offsetCenter');
+            var x = posInfo.cx + parsePercent$1(offsetCenter[0], posInfo.r);
+            var y = posInfo.cy + parsePercent$1(offsetCenter[1], posInfo.r);
+
+            var minVal = +seriesModel.get('min');
+            var maxVal = +seriesModel.get('max');
+            var value = seriesModel.getData().get(valueDim, 0);
+            var autoColor = getColor(
+                linearMap(value, [minVal, maxVal], [0, 1], true)
+            );
+
+            this.group.add(new Text({
+                silent: true,
+                style: setTextStyle({}, titleModel, {
+                    x: x,
+                    y: y,
+                    // FIXME First data name ?
+                    text: data.getName(0),
+                    textAlign: 'center',
+                    textVerticalAlign: 'middle'
+                }, {autoColor: autoColor, forceRich: true})
+            }));
+        }
+    },
+
+    _renderDetail: function (
+        seriesModel, ecModel, api, getColor, posInfo
+    ) {
+        var detailModel = seriesModel.getModel('detail');
+        var minVal = +seriesModel.get('min');
+        var maxVal = +seriesModel.get('max');
+        if (detailModel.get('show')) {
+            var offsetCenter = detailModel.get('offsetCenter');
+            var x = posInfo.cx + parsePercent$1(offsetCenter[0], posInfo.r);
+            var y = posInfo.cy + parsePercent$1(offsetCenter[1], posInfo.r);
+            var width = parsePercent$1(detailModel.get('width'), posInfo.r);
+            var height = parsePercent$1(detailModel.get('height'), posInfo.r);
+            var data = seriesModel.getData();
+            var value = data.get(data.mapDimension('value'), 0);
+            var autoColor = getColor(
+                linearMap(value, [minVal, maxVal], [0, 1], true)
+            );
+
+            this.group.add(new Text({
+                silent: true,
+                style: setTextStyle({}, detailModel, {
+                    x: x,
+                    y: y,
+                    text: formatLabel(
+                        // FIXME First data name ?
+                        value, detailModel.get('formatter')
+                    ),
+                    textWidth: isNaN(width) ? null : width,
+                    textHeight: isNaN(height) ? null : height,
+                    textAlign: 'center',
+                    textVerticalAlign: 'middle'
+                }, {autoColor: autoColor, forceRich: true})
+            }));
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var FunnelSeries = extendSeriesModel({
+
+    type: 'series.funnel',
+
+    init: function (option) {
+        FunnelSeries.superApply(this, 'init', arguments);
+
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+        // Extend labelLine emphasis
+        this._defaultLabelLine(option);
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListSimply(this, ['value']);
+    },
+
+    _defaultLabelLine: function (option) {
+        // Extend labelLine emphasis
+        defaultEmphasis(option, 'labelLine', ['show']);
+
+        var labelLineNormalOpt = option.labelLine;
+        var labelLineEmphasisOpt = option.emphasis.labelLine;
+        // Not show label line if `label.normal.show = false`
+        labelLineNormalOpt.show = labelLineNormalOpt.show
+            && option.label.show;
+        labelLineEmphasisOpt.show = labelLineEmphasisOpt.show
+            && option.emphasis.label.show;
+    },
+
+    // Overwrite
+    getDataParams: function (dataIndex) {
+        var data = this.getData();
+        var params = FunnelSeries.superCall(this, 'getDataParams', dataIndex);
+        var valueDim = data.mapDimension('value');
+        var sum = data.getSum(valueDim);
+        // Percent is 0 if sum is 0
+        params.percent = !sum ? 0 : +(data.get(valueDim, dataIndex) / sum * 100).toFixed(2);
+
+        params.$vars.push('percent');
+        return params;
+    },
+
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+        legendHoverLink: true,
+        left: 80,
+        top: 60,
+        right: 80,
+        bottom: 60,
+        // width: {totalWidth} - left - right,
+        // height: {totalHeight} - top - bottom,
+
+        // 默认取数据最小最大值
+        // min: 0,
+        // max: 100,
+        minSize: '0%',
+        maxSize: '100%',
+        sort: 'descending', // 'ascending', 'descending'
+        gap: 0,
+        funnelAlign: 'center',
+        label: {
+            show: true,
+            position: 'outer'
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+        },
+        labelLine: {
+            show: true,
+            length: 20,
+            lineStyle: {
+                // color: 各异,
+                width: 1,
+                type: 'solid'
+            }
+        },
+        itemStyle: {
+            // color: 各异,
+            borderColor: '#fff',
+            borderWidth: 1
+        },
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Piece of pie including Sector, Label, LabelLine
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ */
+function FunnelPiece(data, idx) {
+
+    Group.call(this);
+
+    var polygon = new Polygon();
+    var labelLine = new Polyline();
+    var text = new Text();
+    this.add(polygon);
+    this.add(labelLine);
+    this.add(text);
+
+    this.updateData(data, idx, true);
+
+    // Hover to change label and labelLine
+    function onEmphasis() {
+        labelLine.ignore = labelLine.hoverIgnore;
+        text.ignore = text.hoverIgnore;
+    }
+    function onNormal() {
+        labelLine.ignore = labelLine.normalIgnore;
+        text.ignore = text.normalIgnore;
+    }
+    this.on('emphasis', onEmphasis)
+        .on('normal', onNormal)
+        .on('mouseover', onEmphasis)
+        .on('mouseout', onNormal);
+}
+
+var funnelPieceProto = FunnelPiece.prototype;
+
+var opacityAccessPath = ['itemStyle', 'opacity'];
+funnelPieceProto.updateData = function (data, idx, firstCreate) {
+
+    var polygon = this.childAt(0);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var opacity = data.getItemModel(idx).get(opacityAccessPath);
+    opacity = opacity == null ? 1 : opacity;
+
+    // Reset style
+    polygon.useStyle({});
+
+    if (firstCreate) {
+        polygon.setShape({
+            points: layout.points
+        });
+        polygon.setStyle({ opacity : 0 });
+        initProps(polygon, {
+            style: {
+                opacity: opacity
+            }
+        }, seriesModel, idx);
+    }
+    else {
+        updateProps(polygon, {
+            style: {
+                opacity: opacity
+            },
+            shape: {
+                points: layout.points
+            }
+        }, seriesModel, idx);
+    }
+
+    // Update common style
+    var itemStyleModel = itemModel.getModel('itemStyle');
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    polygon.setStyle(
+        defaults(
+            {
+                lineJoin: 'round',
+                fill: visualColor
+            },
+            itemStyleModel.getItemStyle(['opacity'])
+        )
+    );
+    polygon.hoverStyle = itemStyleModel.getModel('emphasis').getItemStyle();
+
+    this._updateLabel(data, idx);
+
+    setHoverStyle(this);
+};
+
+funnelPieceProto._updateLabel = function (data, idx) {
+
+    var labelLine = this.childAt(1);
+    var labelText = this.childAt(2);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var labelLayout = layout.label;
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    updateProps(labelLine, {
+        shape: {
+            points: labelLayout.linePoints || labelLayout.linePoints
+        }
+    }, seriesModel, idx);
+
+    updateProps(labelText, {
+        style: {
+            x: labelLayout.x,
+            y: labelLayout.y
+        }
+    }, seriesModel, idx);
+    labelText.attr({
+        rotation: labelLayout.rotation,
+        origin: [labelLayout.x, labelLayout.y],
+        z2: 10
+    });
+
+    var labelModel = itemModel.getModel('label');
+    var labelHoverModel = itemModel.getModel('emphasis.label');
+    var labelLineModel = itemModel.getModel('labelLine');
+    var labelLineHoverModel = itemModel.getModel('emphasis.labelLine');
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    setLabelStyle(
+        labelText.style, labelText.hoverStyle = {}, labelModel, labelHoverModel,
+        {
+            labelFetcher: data.hostModel,
+            labelDataIndex: idx,
+            defaultText: data.getName(idx),
+            autoColor: visualColor,
+            useInsideStyle: !!labelLayout.inside
+        },
+        {
+            textAlign: labelLayout.textAlign,
+            textVerticalAlign: labelLayout.verticalAlign
+        }
+    );
+
+    labelText.ignore = labelText.normalIgnore = !labelModel.get('show');
+    labelText.hoverIgnore = !labelHoverModel.get('show');
+
+    labelLine.ignore = labelLine.normalIgnore = !labelLineModel.get('show');
+    labelLine.hoverIgnore = !labelLineHoverModel.get('show');
+
+    // Default use item visual color
+    labelLine.setStyle({
+        stroke: visualColor
+    });
+    labelLine.setStyle(labelLineModel.getModel('lineStyle').getLineStyle());
+
+    labelLine.hoverStyle = labelLineHoverModel.getModel('lineStyle').getLineStyle();
+};
+
+inherits(FunnelPiece, Group);
+
+
+var FunnelView = Chart.extend({
+
+    type: 'funnel',
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        var group = this.group;
+
+        data.diff(oldData)
+            .add(function (idx) {
+                var funnelPiece = new FunnelPiece(data, idx);
+
+                data.setItemGraphicEl(idx, funnelPiece);
+
+                group.add(funnelPiece);
+            })
+            .update(function (newIdx, oldIdx) {
+                var piePiece = oldData.getItemGraphicEl(oldIdx);
+
+                piePiece.updateData(data, newIdx);
+
+                group.add(piePiece);
+                data.setItemGraphicEl(newIdx, piePiece);
+            })
+            .remove(function (idx) {
+                var piePiece = oldData.getItemGraphicEl(idx);
+                group.remove(piePiece);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    remove: function () {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getViewRect$2(seriesModel, api) {
+    return getLayoutRect(
+        seriesModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        }
+    );
+}
+
+function getSortedIndices(data, sort) {
+    var valueDim = data.mapDimension('value');
+    var valueArr = data.mapArray(valueDim, function (val) {
+        return val;
+    });
+    var indices = [];
+    var isAscending = sort === 'ascending';
+    for (var i = 0, len = data.count(); i < len; i++) {
+        indices[i] = i;
+    }
+
+    // Add custom sortable function & none sortable opetion by "options.sort"
+    if (typeof sort === 'function') {
+        indices.sort(sort);
+    } else if (sort !== 'none') {
+        indices.sort(function (a, b) {
+            return isAscending ? valueArr[a] - valueArr[b] : valueArr[b] - valueArr[a];
+        });
+    }
+    return indices;
+}
+
+function labelLayout$1(data) {
+    data.each(function (idx) {
+        var itemModel = data.getItemModel(idx);
+        var labelModel = itemModel.getModel('label');
+        var labelPosition = labelModel.get('position');
+
+        var labelLineModel = itemModel.getModel('labelLine');
+
+        var layout = data.getItemLayout(idx);
+        var points = layout.points;
+
+        var isLabelInside = labelPosition === 'inner'
+            || labelPosition === 'inside' || labelPosition === 'center';
+
+        var textAlign;
+        var textX;
+        var textY;
+        var linePoints;
+
+        if (isLabelInside) {
+            textX = (points[0][0] + points[1][0] + points[2][0] + points[3][0]) / 4;
+            textY = (points[0][1] + points[1][1] + points[2][1] + points[3][1]) / 4;
+            textAlign = 'center';
+            linePoints = [
+                [textX, textY], [textX, textY]
+            ];
+        }
+        else {
+            var x1;
+            var y1;
+            var x2;
+            var labelLineLen = labelLineModel.get('length');
+            if (labelPosition === 'left') {
+                // Left side
+                x1 = (points[3][0] + points[0][0]) / 2;
+                y1 = (points[3][1] + points[0][1]) / 2;
+                x2 = x1 - labelLineLen;
+                textX = x2 - 5;
+                textAlign = 'right';
+            }
+            else {
+                // Right side
+                x1 = (points[1][0] + points[2][0]) / 2;
+                y1 = (points[1][1] + points[2][1]) / 2;
+                x2 = x1 + labelLineLen;
+                textX = x2 + 5;
+                textAlign = 'left';
+            }
+            var y2 = y1;
+
+            linePoints = [[x1, y1], [x2, y2]];
+            textY = y2;
+        }
+
+        layout.label = {
+            linePoints: linePoints,
+            x: textX,
+            y: textY,
+            verticalAlign: 'middle',
+            textAlign: textAlign,
+            inside: isLabelInside
+        };
+    });
+}
+
+var funnelLayout = function (ecModel, api, payload) {
+    ecModel.eachSeriesByType('funnel', function (seriesModel) {
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+        var sort = seriesModel.get('sort');
+        var viewRect = getViewRect$2(seriesModel, api);
+        var indices = getSortedIndices(data, sort);
+
+        var sizeExtent = [
+            parsePercent$1(seriesModel.get('minSize'), viewRect.width),
+            parsePercent$1(seriesModel.get('maxSize'), viewRect.width)
+        ];
+        var dataExtent = data.getDataExtent(valueDim);
+        var min = seriesModel.get('min');
+        var max = seriesModel.get('max');
+        if (min == null) {
+            min = Math.min(dataExtent[0], 0);
+        }
+        if (max == null) {
+            max = dataExtent[1];
+        }
+
+        var funnelAlign = seriesModel.get('funnelAlign');
+        var gap = seriesModel.get('gap');
+        var itemHeight = (viewRect.height - gap * (data.count() - 1)) / data.count();
+
+        var y = viewRect.y;
+
+        var getLinePoints = function (idx, offY) {
+            // End point index is data.count() and we assign it 0
+            var val = data.get(valueDim, idx) || 0;
+            var itemWidth = linearMap(val, [min, max], sizeExtent, true);
+            var x0;
+            switch (funnelAlign) {
+                case 'left':
+                    x0 = viewRect.x;
+                    break;
+                case 'center':
+                    x0 = viewRect.x + (viewRect.width - itemWidth) / 2;
+                    break;
+                case 'right':
+                    x0 = viewRect.x + viewRect.width - itemWidth;
+                    break;
+            }
+            return [
+                [x0, offY],
+                [x0 + itemWidth, offY]
+            ];
+        };
+
+        if (sort === 'ascending') {
+            // From bottom to top
+            itemHeight = -itemHeight;
+            gap = -gap;
+            y += viewRect.height;
+            indices = indices.reverse();
+        }
+
+        for (var i = 0; i < indices.length; i++) {
+            var idx = indices[i];
+            var nextIdx = indices[i + 1];
+
+            var itemModel = data.getItemModel(idx);
+            var height = itemModel.get('itemStyle.height');
+            if (height == null) {
+                height = itemHeight;
+            }
+            else {
+                height = parsePercent$1(height, viewRect.height);
+                if (sort === 'ascending') {
+                    height = -height;
+                }
+            }
+
+            var start = getLinePoints(idx, y);
+            var end = getLinePoints(nextIdx, y + height);
+
+            y += height + gap;
+
+            data.setItemLayout(idx, {
+                points: start.concat(end.slice().reverse())
+            });
+        }
+
+        labelLayout$1(data);
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(dataColor('funnel'));
+registerLayout(funnelLayout);
+registerProcessor(dataFilter('funnel'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var parallelPreprocessor = function (option) {
+    createParallelIfNeeded(option);
+    mergeAxisOptionFromParallel(option);
+};
+
+/**
+ * Create a parallel coordinate if not exists.
+ * @inner
+ */
+function createParallelIfNeeded(option) {
+    if (option.parallel) {
+        return;
+    }
+
+    var hasParallelSeries = false;
+
+    each$1(option.series, function (seriesOpt) {
+        if (seriesOpt && seriesOpt.type === 'parallel') {
+            hasParallelSeries = true;
+        }
+    });
+
+    if (hasParallelSeries) {
+        option.parallel = [{}];
+    }
+}
+
+/**
+ * Merge aixs definition from parallel option (if exists) to axis option.
+ * @inner
+ */
+function mergeAxisOptionFromParallel(option) {
+    var axes = normalizeToArray(option.parallelAxis);
+
+    each$1(axes, function (axisOption) {
+        if (!isObject$1(axisOption)) {
+            return;
+        }
+
+        var parallelIndex = axisOption.parallelIndex || 0;
+        var parallelOption = normalizeToArray(option.parallel)[parallelIndex];
+
+        if (parallelOption && parallelOption.parallelAxisDefault) {
+            merge(axisOption, parallelOption.parallelAxisDefault, false);
+        }
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @constructor module:echarts/coord/parallel/ParallelAxis
+ * @extends {module:echarts/coord/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ */
+var ParallelAxis = function (dim, scale, coordExtent, axisType, axisIndex) {
+
+    Axis.call(this, dim, scale, coordExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.axisIndex = axisIndex;
+};
+
+ParallelAxis.prototype = {
+
+    constructor: ParallelAxis,
+
+    /**
+     * Axis model
+     * @param {module:echarts/coord/parallel/AxisModel}
+     */
+    model: null,
+
+    /**
+     * @override
+     */
+    isHorizontal: function () {
+        return this.coordinateSystem.getModel().get('layout') !== 'horizontal';
+    }
+
+};
+
+inherits(ParallelAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Calculate slider move result.
+ * Usage:
+ * (1) If both handle0 and handle1 are needed to be moved, set minSpan the same as
+ * maxSpan and the same as `Math.abs(handleEnd[1] - handleEnds[0])`.
+ * (2) If handle0 is forbidden to cross handle1, set minSpan as `0`.
+ *
+ * @param {number} delta Move length.
+ * @param {Array.<number>} handleEnds handleEnds[0] can be bigger then handleEnds[1].
+ *              handleEnds will be modified in this method.
+ * @param {Array.<number>} extent handleEnds is restricted by extent.
+ *              extent[0] should less or equals than extent[1].
+ * @param {number|string} handleIndex Can be 'all', means that both move the two handleEnds,
+ *              where the input minSpan and maxSpan will not work.
+ * @param {number} [minSpan] The range of dataZoom can not be smaller than that.
+ *              If not set, handle0 and cross handle1. If set as a non-negative
+ *              number (including `0`), handles will push each other when reaching
+ *              the minSpan.
+ * @param {number} [maxSpan] The range of dataZoom can not be larger than that.
+ * @return {Array.<number>} The input handleEnds.
+ */
+var sliderMove = function (delta, handleEnds, extent, handleIndex, minSpan, maxSpan) {
+    // Normalize firstly.
+    handleEnds[0] = restrict$1(handleEnds[0], extent);
+    handleEnds[1] = restrict$1(handleEnds[1], extent);
+
+    delta = delta || 0;
+
+    var extentSpan = extent[1] - extent[0];
+
+    // Notice maxSpan and minSpan can be null/undefined.
+    if (minSpan != null) {
+        minSpan = restrict$1(minSpan, [0, extentSpan]);
+    }
+    if (maxSpan != null) {
+        maxSpan = Math.max(maxSpan, minSpan != null ? minSpan : 0);
+    }
+    if (handleIndex === 'all') {
+        minSpan = maxSpan = Math.abs(handleEnds[1] - handleEnds[0]);
+        handleIndex = 0;
+    }
+
+    var originalDistSign = getSpanSign(handleEnds, handleIndex);
+
+    handleEnds[handleIndex] += delta;
+
+    // Restrict in extent.
+    var extentMinSpan = minSpan || 0;
+    var realExtent = extent.slice();
+    originalDistSign.sign < 0 ? (realExtent[0] += extentMinSpan) : (realExtent[1] -= extentMinSpan);
+    handleEnds[handleIndex] = restrict$1(handleEnds[handleIndex], realExtent);
+
+    // Expand span.
+    var currDistSign = getSpanSign(handleEnds, handleIndex);
+    if (minSpan != null && (
+        currDistSign.sign !== originalDistSign.sign || currDistSign.span < minSpan
+    )) {
+        // If minSpan exists, 'cross' is forbinden.
+        handleEnds[1 - handleIndex] = handleEnds[handleIndex] + originalDistSign.sign * minSpan;
+    }
+
+    // Shrink span.
+    var currDistSign = getSpanSign(handleEnds, handleIndex);
+    if (maxSpan != null && currDistSign.span > maxSpan) {
+        handleEnds[1 - handleIndex] = handleEnds[handleIndex] + currDistSign.sign * maxSpan;
+    }
+
+    return handleEnds;
+};
+
+function getSpanSign(handleEnds, handleIndex) {
+    var dist = handleEnds[handleIndex] - handleEnds[1 - handleIndex];
+    // If `handleEnds[0] === handleEnds[1]`, always believe that handleEnd[0]
+    // is at left of handleEnds[1] for non-cross case.
+    return {span: Math.abs(dist), sign: dist > 0 ? -1 : dist < 0 ? 1 : handleIndex ? -1 : 1};
+}
+
+function restrict$1(value, extend) {
+    return Math.min(extend[1], Math.max(extend[0], value));
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Parallel Coordinates
+ * <https://en.wikipedia.org/wiki/Parallel_coordinates>
+ */
+
+var each$11 = each$1;
+var mathMin$5 = Math.min;
+var mathMax$5 = Math.max;
+var mathFloor$2 = Math.floor;
+var mathCeil$2 = Math.ceil;
+var round$2 = round$1;
+
+var PI$3 = Math.PI;
+
+function Parallel(parallelModel, ecModel, api) {
+
+    /**
+     * key: dimension
+     * @type {Object.<string, module:echarts/coord/parallel/Axis>}
+     * @private
+     */
+    this._axesMap = createHashMap();
+
+    /**
+     * key: dimension
+     * value: {position: [], rotation, }
+     * @type {Object.<string, Object>}
+     * @private
+     */
+    this._axesLayout = {};
+
+    /**
+     * Always follow axis order.
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    this.dimensions = parallelModel.dimensions;
+
+    /**
+     * @type {module:zrender/core/BoundingRect}
+     */
+    this._rect;
+
+    /**
+     * @type {module:echarts/coord/parallel/ParallelModel}
+     */
+    this._model = parallelModel;
+
+    this._init(parallelModel, ecModel, api);
+}
+
+Parallel.prototype = {
+
+    type: 'parallel',
+
+    constructor: Parallel,
+
+    /**
+     * Initialize cartesian coordinate systems
+     * @private
+     */
+    _init: function (parallelModel, ecModel, api) {
+
+        var dimensions = parallelModel.dimensions;
+        var parallelAxisIndex = parallelModel.parallelAxisIndex;
+
+        each$11(dimensions, function (dim, idx) {
+
+            var axisIndex = parallelAxisIndex[idx];
+            var axisModel = ecModel.getComponent('parallelAxis', axisIndex);
+
+            var axis = this._axesMap.set(dim, new ParallelAxis(
+                dim,
+                createScaleByModel(axisModel),
+                [0, 0],
+                axisModel.get('type'),
+                axisIndex
+            ));
+
+            var isCategory = axis.type === 'category';
+            axis.onBand = isCategory && axisModel.get('boundaryGap');
+            axis.inverse = axisModel.get('inverse');
+
+            // Injection
+            axisModel.axis = axis;
+            axis.model = axisModel;
+            axis.coordinateSystem = axisModel.coordinateSystem = this;
+
+        }, this);
+    },
+
+    /**
+     * Update axis scale after data processed
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    update: function (ecModel, api) {
+        this._updateAxesFromSeries(this._model, ecModel);
+    },
+
+    /**
+     * @override
+     */
+    containPoint: function (point) {
+        var layoutInfo = this._makeLayoutInfo();
+        var axisBase = layoutInfo.axisBase;
+        var layoutBase = layoutInfo.layoutBase;
+        var pixelDimIndex = layoutInfo.pixelDimIndex;
+        var pAxis = point[1 - pixelDimIndex];
+        var pLayout = point[pixelDimIndex];
+
+        return pAxis >= axisBase
+            && pAxis <= axisBase + layoutInfo.axisLength
+            && pLayout >= layoutBase
+            && pLayout <= layoutBase + layoutInfo.layoutLength;
+    },
+
+    getModel: function () {
+        return this._model;
+    },
+
+    /**
+     * Update properties from series
+     * @private
+     */
+    _updateAxesFromSeries: function (parallelModel, ecModel) {
+        ecModel.eachSeries(function (seriesModel) {
+
+            if (!parallelModel.contains(seriesModel, ecModel)) {
+                return;
+            }
+
+            var data = seriesModel.getData();
+
+            each$11(this.dimensions, function (dim) {
+                var axis = this._axesMap.get(dim);
+                axis.scale.unionExtentFromData(data, data.mapDimension(dim));
+                niceScaleExtent(axis.scale, axis.model);
+            }, this);
+        }, this);
+    },
+
+    /**
+     * Resize the parallel coordinate system.
+     * @param {module:echarts/coord/parallel/ParallelModel} parallelModel
+     * @param {module:echarts/ExtensionAPI} api
+     */
+    resize: function (parallelModel, api) {
+        this._rect = getLayoutRect(
+            parallelModel.getBoxLayoutParams(),
+            {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }
+        );
+
+        this._layoutAxes();
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getRect: function () {
+        return this._rect;
+    },
+
+    /**
+     * @private
+     */
+    _makeLayoutInfo: function () {
+        var parallelModel = this._model;
+        var rect = this._rect;
+        var xy = ['x', 'y'];
+        var wh = ['width', 'height'];
+        var layout = parallelModel.get('layout');
+        var pixelDimIndex = layout === 'horizontal' ? 0 : 1;
+        var layoutLength = rect[wh[pixelDimIndex]];
+        var layoutExtent = [0, layoutLength];
+        var axisCount = this.dimensions.length;
+
+        var axisExpandWidth = restrict(parallelModel.get('axisExpandWidth'), layoutExtent);
+        var axisExpandCount = restrict(parallelModel.get('axisExpandCount') || 0, [0, axisCount]);
+        var axisExpandable = parallelModel.get('axisExpandable')
+            && axisCount > 3
+            && axisCount > axisExpandCount
+            && axisExpandCount > 1
+            && axisExpandWidth > 0
+            && layoutLength > 0;
+
+        // `axisExpandWindow` is According to the coordinates of [0, axisExpandLength],
+        // for sake of consider the case that axisCollapseWidth is 0 (when screen is narrow),
+        // where collapsed axes should be overlapped.
+        var axisExpandWindow = parallelModel.get('axisExpandWindow');
+        var winSize;
+        if (!axisExpandWindow) {
+            winSize = restrict(axisExpandWidth * (axisExpandCount - 1), layoutExtent);
+            var axisExpandCenter = parallelModel.get('axisExpandCenter') || mathFloor$2(axisCount / 2);
+            axisExpandWindow = [axisExpandWidth * axisExpandCenter - winSize / 2];
+            axisExpandWindow[1] = axisExpandWindow[0] + winSize;
+        }
+        else {
+                winSize = restrict(axisExpandWindow[1] - axisExpandWindow[0], layoutExtent);
+                axisExpandWindow[1] = axisExpandWindow[0] + winSize;
+        }
+
+        var axisCollapseWidth = (layoutLength - winSize) / (axisCount - axisExpandCount);
+        // Avoid axisCollapseWidth is too small.
+        axisCollapseWidth < 3 && (axisCollapseWidth = 0);
+
+        // Find the first and last indices > ewin[0] and < ewin[1].
+        var winInnerIndices = [
+            mathFloor$2(round$2(axisExpandWindow[0] / axisExpandWidth, 1)) + 1,
+            mathCeil$2(round$2(axisExpandWindow[1] / axisExpandWidth, 1)) - 1
+        ];
+
+        // Pos in ec coordinates.
+        var axisExpandWindow0Pos = axisCollapseWidth / axisExpandWidth * axisExpandWindow[0];
+
+        return {
+            layout: layout,
+            pixelDimIndex: pixelDimIndex,
+            layoutBase: rect[xy[pixelDimIndex]],
+            layoutLength: layoutLength,
+            axisBase: rect[xy[1 - pixelDimIndex]],
+            axisLength: rect[wh[1 - pixelDimIndex]],
+            axisExpandable: axisExpandable,
+            axisExpandWidth: axisExpandWidth,
+            axisCollapseWidth: axisCollapseWidth,
+            axisExpandWindow: axisExpandWindow,
+            axisCount: axisCount,
+            winInnerIndices: winInnerIndices,
+            axisExpandWindow0Pos: axisExpandWindow0Pos
+        };
+    },
+
+    /**
+     * @private
+     */
+    _layoutAxes: function () {
+        var rect = this._rect;
+        var axes = this._axesMap;
+        var dimensions = this.dimensions;
+        var layoutInfo = this._makeLayoutInfo();
+        var layout = layoutInfo.layout;
+
+        axes.each(function (axis) {
+            var axisExtent = [0, layoutInfo.axisLength];
+            var idx = axis.inverse ? 1 : 0;
+            axis.setExtent(axisExtent[idx], axisExtent[1 - idx]);
+        });
+
+        each$11(dimensions, function (dim, idx) {
+            var posInfo = (layoutInfo.axisExpandable
+                ? layoutAxisWithExpand : layoutAxisWithoutExpand
+            )(idx, layoutInfo);
+
+            var positionTable = {
+                horizontal: {
+                    x: posInfo.position,
+                    y: layoutInfo.axisLength
+                },
+                vertical: {
+                    x: 0,
+                    y: posInfo.position
+                }
+            };
+            var rotationTable = {
+                horizontal: PI$3 / 2,
+                vertical: 0
+            };
+
+            var position = [
+                positionTable[layout].x + rect.x,
+                positionTable[layout].y + rect.y
+            ];
+
+            var rotation = rotationTable[layout];
+            var transform = create$1();
+            rotate(transform, transform, rotation);
+            translate(transform, transform, position);
+
+            // TODO
+            // tick等排布信息。
+
+            // TODO
+            // 根据axis order 更新 dimensions顺序。
+
+            this._axesLayout[dim] = {
+                position: position,
+                rotation: rotation,
+                transform: transform,
+                axisNameAvailableWidth: posInfo.axisNameAvailableWidth,
+                axisLabelShow: posInfo.axisLabelShow,
+                nameTruncateMaxWidth: posInfo.nameTruncateMaxWidth,
+                tickDirection: 1,
+                labelDirection: 1
+            };
+        }, this);
+    },
+
+    /**
+     * Get axis by dim.
+     * @param {string} dim
+     * @return {module:echarts/coord/parallel/ParallelAxis} [description]
+     */
+    getAxis: function (dim) {
+        return this._axesMap.get(dim);
+    },
+
+    /**
+     * Convert a dim value of a single item of series data to Point.
+     * @param {*} value
+     * @param {string} dim
+     * @return {Array}
+     */
+    dataToPoint: function (value, dim) {
+        return this.axisCoordToPoint(
+            this._axesMap.get(dim).dataToCoord(value),
+            dim
+        );
+    },
+
+    /**
+     * Travel data for one time, get activeState of each data item.
+     * @param {module:echarts/data/List} data
+     * @param {Functio} cb param: {string} activeState 'active' or 'inactive' or 'normal'
+     *                            {number} dataIndex
+     * @param {number} [start=0] the start dataIndex that travel from.
+     * @param {number} [end=data.count()] the next dataIndex of the last dataIndex will be travel.
+     */
+    eachActiveState: function (data, callback, start, end) {
+        start == null && (start = 0);
+        end == null && (end = data.count());
+
+        var axesMap = this._axesMap;
+        var dimensions = this.dimensions;
+        var dataDimensions = [];
+        var axisModels = [];
+
+        each$1(dimensions, function (axisDim) {
+            dataDimensions.push(data.mapDimension(axisDim));
+            axisModels.push(axesMap.get(axisDim).model);
+        });
+
+        var hasActiveSet = this.hasAxisBrushed();
+
+        for (var dataIndex = start; dataIndex < end; dataIndex++) {
+            var activeState;
+
+            if (!hasActiveSet) {
+                activeState = 'normal';
+            }
+            else {
+                activeState = 'active';
+                var values = data.getValues(dataDimensions, dataIndex);
+                for (var j = 0, lenj = dimensions.length; j < lenj; j++) {
+                    var state = axisModels[j].getActiveState(values[j]);
+
+                    if (state === 'inactive') {
+                        activeState = 'inactive';
+                        break;
+                    }
+                }
+            }
+
+            callback(activeState, dataIndex);
+        }
+    },
+
+    /**
+     * Whether has any activeSet.
+     * @return {boolean}
+     */
+    hasAxisBrushed: function () {
+        var dimensions = this.dimensions;
+        var axesMap = this._axesMap;
+        var hasActiveSet = false;
+
+        for (var j = 0, lenj = dimensions.length; j < lenj; j++) {
+            if (axesMap.get(dimensions[j]).model.getActiveState() !== 'normal') {
+                hasActiveSet = true;
+            }
+        }
+
+        return hasActiveSet;
+    },
+
+    /**
+     * Convert coords of each axis to Point.
+     *  Return point. For example: [10, 20]
+     * @param {Array.<number>} coords
+     * @param {string} dim
+     * @return {Array.<number>}
+     */
+    axisCoordToPoint: function (coord, dim) {
+        var axisLayout = this._axesLayout[dim];
+        return applyTransform$1([coord, 0], axisLayout.transform);
+    },
+
+    /**
+     * Get axis layout.
+     */
+    getAxisLayout: function (dim) {
+        return clone(this._axesLayout[dim]);
+    },
+
+    /**
+     * @param {Array.<number>} point
+     * @return {Object} {axisExpandWindow, delta, behavior: 'jump' | 'slide' | 'none'}.
+     */
+    getSlidedAxisExpandWindow: function (point) {
+        var layoutInfo = this._makeLayoutInfo();
+        var pixelDimIndex = layoutInfo.pixelDimIndex;
+        var axisExpandWindow = layoutInfo.axisExpandWindow.slice();
+        var winSize = axisExpandWindow[1] - axisExpandWindow[0];
+        var extent = [0, layoutInfo.axisExpandWidth * (layoutInfo.axisCount - 1)];
+
+        // Out of the area of coordinate system.
+        if (!this.containPoint(point)) {
+            return {behavior: 'none', axisExpandWindow: axisExpandWindow};
+        }
+
+        // Conver the point from global to expand coordinates.
+        var pointCoord = point[pixelDimIndex] - layoutInfo.layoutBase - layoutInfo.axisExpandWindow0Pos;
+
+        // For dragging operation convenience, the window should not be
+        // slided when mouse is the center area of the window.
+        var delta;
+        var behavior = 'slide';
+        var axisCollapseWidth = layoutInfo.axisCollapseWidth;
+        var triggerArea = this._model.get('axisExpandSlideTriggerArea');
+        // But consider touch device, jump is necessary.
+        var useJump = triggerArea[0] != null;
+
+        if (axisCollapseWidth) {
+            if (useJump && axisCollapseWidth && pointCoord < winSize * triggerArea[0]) {
+                behavior = 'jump';
+                delta = pointCoord - winSize * triggerArea[2];
+            }
+            else if (useJump && axisCollapseWidth && pointCoord > winSize * (1 - triggerArea[0])) {
+                behavior = 'jump';
+                delta = pointCoord - winSize * (1 - triggerArea[2]);
+            }
+            else {
+                (delta = pointCoord - winSize * triggerArea[1]) >= 0
+                    && (delta = pointCoord - winSize * (1 - triggerArea[1])) <= 0
+                    && (delta = 0);
+            }
+            delta *= layoutInfo.axisExpandWidth / axisCollapseWidth;
+            delta
+                ? sliderMove(delta, axisExpandWindow, extent, 'all')
+                // Avoid nonsense triger on mousemove.
+                : (behavior = 'none');
+        }
+        // When screen is too narrow, make it visible and slidable, although it is hard to interact.
+        else {
+            var winSize = axisExpandWindow[1] - axisExpandWindow[0];
+            var pos = extent[1] * pointCoord / winSize;
+            axisExpandWindow = [mathMax$5(0, pos - winSize / 2)];
+            axisExpandWindow[1] = mathMin$5(extent[1], axisExpandWindow[0] + winSize);
+            axisExpandWindow[0] = axisExpandWindow[1] - winSize;
+        }
+
+        return {
+            axisExpandWindow: axisExpandWindow,
+            behavior: behavior
+        };
+    }
+};
+
+function restrict(len, extent) {
+    return mathMin$5(mathMax$5(len, extent[0]), extent[1]);
+}
+
+function layoutAxisWithoutExpand(axisIndex, layoutInfo) {
+    var step = layoutInfo.layoutLength / (layoutInfo.axisCount - 1);
+    return {
+        position: step * axisIndex,
+        axisNameAvailableWidth: step,
+        axisLabelShow: true
+    };
+}
+
+function layoutAxisWithExpand(axisIndex, layoutInfo) {
+    var layoutLength = layoutInfo.layoutLength;
+    var axisExpandWidth = layoutInfo.axisExpandWidth;
+    var axisCount = layoutInfo.axisCount;
+    var axisCollapseWidth = layoutInfo.axisCollapseWidth;
+    var winInnerIndices = layoutInfo.winInnerIndices;
+
+    var position;
+    var axisNameAvailableWidth = axisCollapseWidth;
+    var axisLabelShow = false;
+    var nameTruncateMaxWidth;
+
+    if (axisIndex < winInnerIndices[0]) {
+        position = axisIndex * axisCollapseWidth;
+        nameTruncateMaxWidth = axisCollapseWidth;
+    }
+    else if (axisIndex <= winInnerIndices[1]) {
+        position = layoutInfo.axisExpandWindow0Pos
+            + axisIndex * axisExpandWidth - layoutInfo.axisExpandWindow[0];
+        axisNameAvailableWidth = axisExpandWidth;
+        axisLabelShow = true;
+    }
+    else {
+        position = layoutLength - (axisCount - 1 - axisIndex) * axisCollapseWidth;
+        nameTruncateMaxWidth = axisCollapseWidth;
+    }
+
+    return {
+        position: position,
+        axisNameAvailableWidth: axisNameAvailableWidth,
+        axisLabelShow: axisLabelShow,
+        nameTruncateMaxWidth: nameTruncateMaxWidth
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Parallel coordinate system creater.
+ */
+
+function create$2(ecModel, api) {
+    var coordSysList = [];
+
+    ecModel.eachComponent('parallel', function (parallelModel, idx) {
+        var coordSys = new Parallel(parallelModel, ecModel, api);
+
+        coordSys.name = 'parallel_' + idx;
+        coordSys.resize(parallelModel, api);
+
+        parallelModel.coordinateSystem = coordSys;
+        coordSys.model = parallelModel;
+
+        coordSysList.push(coordSys);
+    });
+
+    // Inject the coordinateSystems into seriesModel
+    ecModel.eachSeries(function (seriesModel) {
+        if (seriesModel.get('coordinateSystem') === 'parallel') {
+            var parallelModel = ecModel.queryComponents({
+                mainType: 'parallel',
+                index: seriesModel.get('parallelIndex'),
+                id: seriesModel.get('parallelId')
+            })[0];
+            seriesModel.coordinateSystem = parallelModel.coordinateSystem;
+        }
+    });
+
+    return coordSysList;
+}
+
+CoordinateSystemManager.register('parallel', {create: create$2});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisModel$2 = ComponentModel.extend({
+
+    type: 'baseParallelAxis',
+
+    /**
+     * @type {module:echarts/coord/parallel/Axis}
+     */
+    axis: null,
+
+    /**
+     * @type {Array.<Array.<number>}
+     * @readOnly
+     */
+    activeIntervals: [],
+
+    /**
+     * @return {Object}
+     */
+    getAreaSelectStyle: function () {
+        return makeStyleMapper(
+            [
+                ['fill', 'color'],
+                ['lineWidth', 'borderWidth'],
+                ['stroke', 'borderColor'],
+                ['width', 'width'],
+                ['opacity', 'opacity']
+            ]
+        )(this.getModel('areaSelectStyle'));
+    },
+
+    /**
+     * The code of this feature is put on AxisModel but not ParallelAxis,
+     * because axisModel can be alive after echarts updating but instance of
+     * ParallelAxis having been disposed. this._activeInterval should be kept
+     * when action dispatched (i.e. legend click).
+     *
+     * @param {Array.<Array<number>>} intervals interval.length === 0
+     *                                          means set all active.
+     * @public
+     */
+    setActiveIntervals: function (intervals) {
+        var activeIntervals = this.activeIntervals = clone(intervals);
+
+        // Normalize
+        if (activeIntervals) {
+            for (var i = activeIntervals.length - 1; i >= 0; i--) {
+                asc(activeIntervals[i]);
+            }
+        }
+    },
+
+    /**
+     * @param {number|string} [value] When attempting to detect 'no activeIntervals set',
+     *                         value can not be input.
+     * @return {string} 'normal': no activeIntervals set,
+     *                  'active',
+     *                  'inactive'.
+     * @public
+     */
+    getActiveState: function (value) {
+        var activeIntervals = this.activeIntervals;
+
+        if (!activeIntervals.length) {
+            return 'normal';
+        }
+
+        if (value == null || isNaN(value)) {
+            return 'inactive';
+        }
+
+        // Simple optimization
+        if (activeIntervals.length === 1) {
+            var interval = activeIntervals[0];
+            if (interval[0] <= value && value <= interval[1]) {
+                return 'active';
+            }
+        }
+        else {
+            for (var i = 0, len = activeIntervals.length; i < len; i++) {
+                if (activeIntervals[i][0] <= value && value <= activeIntervals[i][1]) {
+                    return 'active';
+                }
+            }
+        }
+
+        return 'inactive';
+    }
+
+});
+
+var defaultOption$1 = {
+
+    type: 'value',
+
+    /**
+     * @type {Array.<number>}
+     */
+    dim: null, // 0, 1, 2, ...
+
+    // parallelIndex: null,
+
+    areaSelectStyle: {
+        width: 20,
+        borderWidth: 1,
+        borderColor: 'rgba(160,197,232)',
+        color: 'rgba(160,197,232)',
+        opacity: 0.3
+    },
+
+    realtime: true, // Whether realtime update view when select.
+
+    z: 10
+};
+
+merge(AxisModel$2.prototype, axisModelCommonMixin);
+
+function getAxisType$1(axisName, option) {
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+axisModelCreator('parallel', AxisModel$2, getAxisType$1, defaultOption$1);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.extend({
+
+    type: 'parallel',
+
+    dependencies: ['parallelAxis'],
+
+    /**
+     * @type {module:echarts/coord/parallel/Parallel}
+     */
+    coordinateSystem: null,
+
+    /**
+     * Each item like: 'dim0', 'dim1', 'dim2', ...
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: null,
+
+    /**
+     * Coresponding to dimensions.
+     * @type {Array.<number>}
+     * @readOnly
+     */
+    parallelAxisIndex: null,
+
+    layoutMode: 'box',
+
+    defaultOption: {
+        zlevel: 0,
+        z: 0,
+        left: 80,
+        top: 60,
+        right: 80,
+        bottom: 60,
+        // width: {totalWidth} - left - right,
+        // height: {totalHeight} - top - bottom,
+
+        layout: 'horizontal',      // 'horizontal' or 'vertical'
+
+        // FIXME
+        // naming?
+        axisExpandable: false,
+        axisExpandCenter: null,
+        axisExpandCount: 0,
+        axisExpandWidth: 50,      // FIXME '10%' ?
+        axisExpandRate: 17,
+        axisExpandDebounce: 50,
+        // [out, in, jumpTarget]. In percentage. If use [null, 0.05], null means full.
+        // Do not doc to user until necessary.
+        axisExpandSlideTriggerArea: [-0.15, 0.05, 0.4],
+        axisExpandTriggerOn: 'click', // 'mousemove' or 'click'
+
+        parallelAxisDefault: null
+    },
+
+    /**
+     * @override
+     */
+    init: function () {
+        ComponentModel.prototype.init.apply(this, arguments);
+
+        this.mergeOption({});
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (newOption) {
+        var thisOption = this.option;
+
+        newOption && merge(thisOption, newOption, true);
+
+        this._initDimensions();
+    },
+
+    /**
+     * Whether series or axis is in this coordinate system.
+     * @param {module:echarts/model/Series|module:echarts/coord/parallel/AxisModel} model
+     * @param {module:echarts/model/Global} ecModel
+     */
+    contains: function (model, ecModel) {
+        var parallelIndex = model.get('parallelIndex');
+        return parallelIndex != null
+            && ecModel.getComponent('parallel', parallelIndex) === this;
+    },
+
+    setAxisExpand: function (opt) {
+        each$1(
+            ['axisExpandable', 'axisExpandCenter', 'axisExpandCount', 'axisExpandWidth', 'axisExpandWindow'],
+            function (name) {
+                if (opt.hasOwnProperty(name)) {
+                    this.option[name] = opt[name];
+                }
+            },
+            this
+        );
+    },
+
+    /**
+     * @private
+     */
+    _initDimensions: function () {
+        var dimensions = this.dimensions = [];
+        var parallelAxisIndex = this.parallelAxisIndex = [];
+
+        var axisModels = filter(this.dependentModels.parallelAxis, function (axisModel) {
+            // Can not use this.contains here, because
+            // initialization has not been completed yet.
+            return (axisModel.get('parallelIndex') || 0) === this.componentIndex;
+        }, this);
+
+        each$1(axisModels, function (axisModel) {
+            dimensions.push('dim' + axisModel.get('dim'));
+            parallelAxisIndex.push(axisModel.componentIndex);
+        });
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @payload
+ * @property {string} parallelAxisId
+ * @property {Array.<Array.<number>>} intervals
+ */
+var actionInfo$1 = {
+    type: 'axisAreaSelect',
+    event: 'axisAreaSelected'
+    // update: 'updateVisual'
+};
+
+registerAction(actionInfo$1, function (payload, ecModel) {
+    ecModel.eachComponent(
+        {mainType: 'parallelAxis', query: payload},
+        function (parallelAxisModel) {
+            parallelAxisModel.axis.model.setActiveIntervals(payload.intervals);
+        }
+    );
+});
+
+/**
+ * @payload
+ */
+registerAction('parallelAxisExpand', function (payload, ecModel) {
+    ecModel.eachComponent(
+        {mainType: 'parallel', query: payload},
+        function (parallelModel) {
+            parallelModel.setAxisExpand(payload);
+        }
+    );
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var curry$2 = curry;
+var each$12 = each$1;
+var map$2 = map;
+var mathMin$6 = Math.min;
+var mathMax$6 = Math.max;
+var mathPow$2 = Math.pow;
+
+var COVER_Z = 10000;
+var UNSELECT_THRESHOLD = 6;
+var MIN_RESIZE_LINE_WIDTH = 6;
+var MUTEX_RESOURCE_KEY = 'globalPan';
+
+var DIRECTION_MAP = {
+    w: [0, 0],
+    e: [0, 1],
+    n: [1, 0],
+    s: [1, 1]
+};
+var CURSOR_MAP = {
+    w: 'ew',
+    e: 'ew',
+    n: 'ns',
+    s: 'ns',
+    ne: 'nesw',
+    sw: 'nesw',
+    nw: 'nwse',
+    se: 'nwse'
+};
+var DEFAULT_BRUSH_OPT = {
+    brushStyle: {
+        lineWidth: 2,
+        stroke: 'rgba(0,0,0,0.3)',
+        fill: 'rgba(0,0,0,0.1)'
+    },
+    transformable: true,
+    brushMode: 'single',
+    removeOnClick: false
+};
+
+var baseUID = 0;
+
+/**
+ * @alias module:echarts/component/helper/BrushController
+ * @constructor
+ * @mixin {module:zrender/mixin/Eventful}
+ * @event module:echarts/component/helper/BrushController#brush
+ *        params:
+ *            areas: Array.<Array>, coord relates to container group,
+ *                                    If no container specified, to global.
+ *            opt {
+ *                isEnd: boolean,
+ *                removeOnClick: boolean
+ *            }
+ *
+ * @param {module:zrender/zrender~ZRender} zr
+ */
+function BrushController(zr) {
+
+    if (__DEV__) {
+        assert$1(zr);
+    }
+
+    Eventful.call(this);
+
+    /**
+     * @type {module:zrender/zrender~ZRender}
+     * @private
+     */
+    this._zr = zr;
+
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = new Group();
+
+    /**
+     * Only for drawing (after enabledBrush).
+     *     'line', 'rect', 'polygon' or false
+     *     If passing false/null/undefined, disable brush.
+     *     If passing 'auto', determined by panel.defaultBrushType
+     * @private
+     * @type {string}
+     */
+    this._brushType;
+
+    /**
+     * Only for drawing (after enabledBrush).
+     *
+     * @private
+     * @type {Object}
+     */
+    this._brushOption;
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._panels;
+
+    /**
+     * @private
+     * @type {Array.<nubmer>}
+     */
+    this._track = [];
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._dragging;
+
+    /**
+     * @private
+     * @type {Array}
+     */
+    this._covers = [];
+
+    /**
+     * @private
+     * @type {moudule:zrender/container/Group}
+     */
+    this._creatingCover;
+
+    /**
+     * `true` means global panel
+     * @private
+     * @type {module:zrender/container/Group|boolean}
+     */
+    this._creatingPanel;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._enableGlobalPan;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    if (__DEV__) {
+        this._mounted;
+    }
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._uid = 'brushController_' + baseUID++;
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._handlers = {};
+    each$12(mouseHandlers, function (handler, eventName) {
+        this._handlers[eventName] = bind(handler, this);
+    }, this);
+}
+
+BrushController.prototype = {
+
+    constructor: BrushController,
+
+    /**
+     * If set to null/undefined/false, select disabled.
+     * @param {Object} brushOption
+     * @param {string|boolean} brushOption.brushType 'line', 'rect', 'polygon' or false
+     *                          If passing false/null/undefined, disable brush.
+     *                          If passing 'auto', determined by panel.defaultBrushType.
+     *                              ('auto' can not be used in global panel)
+     * @param {number} [brushOption.brushMode='single'] 'single' or 'multiple'
+     * @param {boolean} [brushOption.transformable=true]
+     * @param {boolean} [brushOption.removeOnClick=false]
+     * @param {Object} [brushOption.brushStyle]
+     * @param {number} [brushOption.brushStyle.width]
+     * @param {number} [brushOption.brushStyle.lineWidth]
+     * @param {string} [brushOption.brushStyle.stroke]
+     * @param {string} [brushOption.brushStyle.fill]
+     * @param {number} [brushOption.z]
+     */
+    enableBrush: function (brushOption) {
+        if (__DEV__) {
+            assert$1(this._mounted);
+        }
+
+        this._brushType && doDisableBrush(this);
+        brushOption.brushType && doEnableBrush(this, brushOption);
+
+        return this;
+    },
+
+    /**
+     * @param {Array.<Object>} panelOpts If not pass, it is global brush.
+     *        Each items: {
+     *            panelId, // mandatory.
+     *            clipPath, // mandatory. function.
+     *            isTargetByCursor, // mandatory. function.
+     *            defaultBrushType, // optional, only used when brushType is 'auto'.
+     *            getLinearBrushOtherExtent, // optional. function.
+     *        }
+     */
+    setPanels: function (panelOpts) {
+        if (panelOpts && panelOpts.length) {
+            var panels = this._panels = {};
+            each$1(panelOpts, function (panelOpts) {
+                panels[panelOpts.panelId] = clone(panelOpts);
+            });
+        }
+        else {
+            this._panels = null;
+        }
+        return this;
+    },
+
+    /**
+     * @param {Object} [opt]
+     * @return {boolean} [opt.enableGlobalPan=false]
+     */
+    mount: function (opt) {
+        opt = opt || {};
+
+        if (__DEV__) {
+            this._mounted = true; // should be at first.
+        }
+
+        this._enableGlobalPan = opt.enableGlobalPan;
+
+        var thisGroup = this.group;
+        this._zr.add(thisGroup);
+
+        thisGroup.attr({
+            position: opt.position || [0, 0],
+            rotation: opt.rotation || 0,
+            scale: opt.scale || [1, 1]
+        });
+        this._transform = thisGroup.getLocalTransform();
+
+        return this;
+    },
+
+    eachCover: function (cb, context) {
+        each$12(this._covers, cb, context);
+    },
+
+    /**
+     * Update covers.
+     * @param {Array.<Object>} brushOptionList Like:
+     *        [
+     *            {id: 'xx', brushType: 'line', range: [23, 44], brushStyle, transformable},
+     *            {id: 'yy', brushType: 'rect', range: [[23, 44], [23, 54]]},
+     *            ...
+     *        ]
+     *        `brushType` is required in each cover info. (can not be 'auto')
+     *        `id` is not mandatory.
+     *        `brushStyle`, `transformable` is not mandatory, use DEFAULT_BRUSH_OPT by default.
+     *        If brushOptionList is null/undefined, all covers removed.
+     */
+    updateCovers: function (brushOptionList) {
+        if (__DEV__) {
+            assert$1(this._mounted);
+        }
+
+        brushOptionList = map(brushOptionList, function (brushOption) {
+            return merge(clone(DEFAULT_BRUSH_OPT), brushOption, true);
+        });
+
+        var tmpIdPrefix = '\0-brush-index-';
+        var oldCovers = this._covers;
+        var newCovers = this._covers = [];
+        var controller = this;
+        var creatingCover = this._creatingCover;
+
+        (new DataDiffer(oldCovers, brushOptionList, oldGetKey, getKey))
+            .add(addOrUpdate)
+            .update(addOrUpdate)
+            .remove(remove)
+            .execute();
+
+        return this;
+
+        function getKey(brushOption, index) {
+            return (brushOption.id != null ? brushOption.id : tmpIdPrefix + index)
+                + '-' + brushOption.brushType;
+        }
+
+        function oldGetKey(cover, index) {
+            return getKey(cover.__brushOption, index);
+        }
+
+        function addOrUpdate(newIndex, oldIndex) {
+            var newBrushOption = brushOptionList[newIndex];
+            // Consider setOption in event listener of brushSelect,
+            // where updating cover when creating should be forbiden.
+            if (oldIndex != null && oldCovers[oldIndex] === creatingCover) {
+                newCovers[newIndex] = oldCovers[oldIndex];
+            }
+            else {
+                var cover = newCovers[newIndex] = oldIndex != null
+                    ? (
+                        oldCovers[oldIndex].__brushOption = newBrushOption,
+                        oldCovers[oldIndex]
+                    )
+                    : endCreating(controller, createCover(controller, newBrushOption));
+                updateCoverAfterCreation(controller, cover);
+            }
+        }
+
+        function remove(oldIndex) {
+            if (oldCovers[oldIndex] !== creatingCover) {
+                controller.group.remove(oldCovers[oldIndex]);
+            }
+        }
+    },
+
+    unmount: function () {
+        if (__DEV__) {
+            if (!this._mounted) {
+                return;
+            }
+        }
+
+        this.enableBrush(false);
+
+        // container may 'removeAll' outside.
+        clearCovers(this);
+        this._zr.remove(this.group);
+
+        if (__DEV__) {
+            this._mounted = false; // should be at last.
+        }
+
+        return this;
+    },
+
+    dispose: function () {
+        this.unmount();
+        this.off();
+    }
+};
+
+mixin(BrushController, Eventful);
+
+function doEnableBrush(controller, brushOption) {
+    var zr = controller._zr;
+
+    // Consider roam, which takes globalPan too.
+    if (!controller._enableGlobalPan) {
+        take(zr, MUTEX_RESOURCE_KEY, controller._uid);
+    }
+
+    each$12(controller._handlers, function (handler, eventName) {
+        zr.on(eventName, handler);
+    });
+
+    controller._brushType = brushOption.brushType;
+    controller._brushOption = merge(clone(DEFAULT_BRUSH_OPT), brushOption, true);
+}
+
+function doDisableBrush(controller) {
+    var zr = controller._zr;
+
+    release(zr, MUTEX_RESOURCE_KEY, controller._uid);
+
+    each$12(controller._handlers, function (handler, eventName) {
+        zr.off(eventName, handler);
+    });
+
+    controller._brushType = controller._brushOption = null;
+}
+
+function createCover(controller, brushOption) {
+    var cover = coverRenderers[brushOption.brushType].createCover(controller, brushOption);
+    cover.__brushOption = brushOption;
+    updateZ$1(cover, brushOption);
+    controller.group.add(cover);
+    return cover;
+}
+
+function endCreating(controller, creatingCover) {
+    var coverRenderer = getCoverRenderer(creatingCover);
+    if (coverRenderer.endCreating) {
+        coverRenderer.endCreating(controller, creatingCover);
+        updateZ$1(creatingCover, creatingCover.__brushOption);
+    }
+    return creatingCover;
+}
+
+function updateCoverShape(controller, cover) {
+    var brushOption = cover.__brushOption;
+    getCoverRenderer(cover).updateCoverShape(
+        controller, cover, brushOption.range, brushOption
+    );
+}
+
+function updateZ$1(cover, brushOption) {
+    var z = brushOption.z;
+    z == null && (z = COVER_Z);
+    cover.traverse(function (el) {
+        el.z = z;
+        el.z2 = z; // Consider in given container.
+    });
+}
+
+function updateCoverAfterCreation(controller, cover) {
+    getCoverRenderer(cover).updateCommon(controller, cover);
+    updateCoverShape(controller, cover);
+}
+
+function getCoverRenderer(cover) {
+    return coverRenderers[cover.__brushOption.brushType];
+}
+
+// return target panel or `true` (means global panel)
+function getPanelByPoint(controller, e, localCursorPoint) {
+    var panels = controller._panels;
+    if (!panels) {
+        return true; // Global panel
+    }
+    var panel;
+    var transform = controller._transform;
+    each$12(panels, function (pn) {
+        pn.isTargetByCursor(e, localCursorPoint, transform) && (panel = pn);
+    });
+    return panel;
+}
+
+// Return a panel or true
+function getPanelByCover(controller, cover) {
+    var panels = controller._panels;
+    if (!panels) {
+        return true; // Global panel
+    }
+    var panelId = cover.__brushOption.panelId;
+    // User may give cover without coord sys info,
+    // which is then treated as global panel.
+    return panelId != null ? panels[panelId] : true;
+}
+
+function clearCovers(controller) {
+    var covers = controller._covers;
+    var originalLength = covers.length;
+    each$12(covers, function (cover) {
+        controller.group.remove(cover);
+    }, controller);
+    covers.length = 0;
+
+    return !!originalLength;
+}
+
+function trigger(controller, opt) {
+    var areas = map$2(controller._covers, function (cover) {
+        var brushOption = cover.__brushOption;
+        var range = clone(brushOption.range);
+        return {
+            brushType: brushOption.brushType,
+            panelId: brushOption.panelId,
+            range: range
+        };
+    });
+
+    controller.trigger('brush', areas, {
+        isEnd: !!opt.isEnd,
+        removeOnClick: !!opt.removeOnClick
+    });
+}
+
+function shouldShowCover(controller) {
+    var track = controller._track;
+
+    if (!track.length) {
+        return false;
+    }
+
+    var p2 = track[track.length - 1];
+    var p1 = track[0];
+    var dx = p2[0] - p1[0];
+    var dy = p2[1] - p1[1];
+    var dist = mathPow$2(dx * dx + dy * dy, 0.5);
+
+    return dist > UNSELECT_THRESHOLD;
+}
+
+function getTrackEnds(track) {
+    var tail = track.length - 1;
+    tail < 0 && (tail = 0);
+    return [track[0], track[tail]];
+}
+
+function createBaseRectCover(doDrift, controller, brushOption, edgeNames) {
+    var cover = new Group();
+
+    cover.add(new Rect({
+        name: 'main',
+        style: makeStyle(brushOption),
+        silent: true,
+        draggable: true,
+        cursor: 'move',
+        drift: curry$2(doDrift, controller, cover, 'nswe'),
+        ondragend: curry$2(trigger, controller, {isEnd: true})
+    }));
+
+    each$12(
+        edgeNames,
+        function (name) {
+            cover.add(new Rect({
+                name: name,
+                style: {opacity: 0},
+                draggable: true,
+                silent: true,
+                invisible: true,
+                drift: curry$2(doDrift, controller, cover, name),
+                ondragend: curry$2(trigger, controller, {isEnd: true})
+            }));
+        }
+    );
+
+    return cover;
+}
+
+function updateBaseRect(controller, cover, localRange, brushOption) {
+    var lineWidth = brushOption.brushStyle.lineWidth || 0;
+    var handleSize = mathMax$6(lineWidth, MIN_RESIZE_LINE_WIDTH);
+    var x = localRange[0][0];
+    var y = localRange[1][0];
+    var xa = x - lineWidth / 2;
+    var ya = y - lineWidth / 2;
+    var x2 = localRange[0][1];
+    var y2 = localRange[1][1];
+    var x2a = x2 - handleSize + lineWidth / 2;
+    var y2a = y2 - handleSize + lineWidth / 2;
+    var width = x2 - x;
+    var height = y2 - y;
+    var widtha = width + lineWidth;
+    var heighta = height + lineWidth;
+
+    updateRectShape(controller, cover, 'main', x, y, width, height);
+
+    if (brushOption.transformable) {
+        updateRectShape(controller, cover, 'w', xa, ya, handleSize, heighta);
+        updateRectShape(controller, cover, 'e', x2a, ya, handleSize, heighta);
+        updateRectShape(controller, cover, 'n', xa, ya, widtha, handleSize);
+        updateRectShape(controller, cover, 's', xa, y2a, widtha, handleSize);
+
+        updateRectShape(controller, cover, 'nw', xa, ya, handleSize, handleSize);
+        updateRectShape(controller, cover, 'ne', x2a, ya, handleSize, handleSize);
+        updateRectShape(controller, cover, 'sw', xa, y2a, handleSize, handleSize);
+        updateRectShape(controller, cover, 'se', x2a, y2a, handleSize, handleSize);
+    }
+}
+
+function updateCommon(controller, cover) {
+    var brushOption = cover.__brushOption;
+    var transformable = brushOption.transformable;
+
+    var mainEl = cover.childAt(0);
+    mainEl.useStyle(makeStyle(brushOption));
+    mainEl.attr({
+        silent: !transformable,
+        cursor: transformable ? 'move' : 'default'
+    });
+
+    each$12(
+        ['w', 'e', 'n', 's', 'se', 'sw', 'ne', 'nw'],
+        function (name) {
+            var el = cover.childOfName(name);
+            var globalDir = getGlobalDirection(controller, name);
+
+            el && el.attr({
+                silent: !transformable,
+                invisible: !transformable,
+                cursor: transformable ? CURSOR_MAP[globalDir] + '-resize' : null
+            });
+        }
+    );
+}
+
+function updateRectShape(controller, cover, name, x, y, w, h) {
+    var el = cover.childOfName(name);
+    el && el.setShape(pointsToRect(
+        clipByPanel(controller, cover, [[x, y], [x + w, y + h]])
+    ));
+}
+
+function makeStyle(brushOption) {
+    return defaults({strokeNoScale: true}, brushOption.brushStyle);
+}
+
+function formatRectRange(x, y, x2, y2) {
+    var min = [mathMin$6(x, x2), mathMin$6(y, y2)];
+    var max = [mathMax$6(x, x2), mathMax$6(y, y2)];
+
+    return [
+        [min[0], max[0]], // x range
+        [min[1], max[1]] // y range
+    ];
+}
+
+function getTransform$1(controller) {
+    return getTransform(controller.group);
+}
+
+function getGlobalDirection(controller, localDirection) {
+    if (localDirection.length > 1) {
+        localDirection = localDirection.split('');
+        var globalDir = [
+            getGlobalDirection(controller, localDirection[0]),
+            getGlobalDirection(controller, localDirection[1])
+        ];
+        (globalDir[0] === 'e' || globalDir[0] === 'w') && globalDir.reverse();
+        return globalDir.join('');
+    }
+    else {
+        var map$$1 = {w: 'left', e: 'right', n: 'top', s: 'bottom'};
+        var inverseMap = {left: 'w', right: 'e', top: 'n', bottom: 's'};
+        var globalDir = transformDirection(
+            map$$1[localDirection], getTransform$1(controller)
+        );
+        return inverseMap[globalDir];
+    }
+}
+
+function driftRect(toRectRange, fromRectRange, controller, cover, name, dx, dy, e) {
+    var brushOption = cover.__brushOption;
+    var rectRange = toRectRange(brushOption.range);
+    var localDelta = toLocalDelta(controller, dx, dy);
+
+    each$12(name.split(''), function (namePart) {
+        var ind = DIRECTION_MAP[namePart];
+        rectRange[ind[0]][ind[1]] += localDelta[ind[0]];
+    });
+
+    brushOption.range = fromRectRange(formatRectRange(
+        rectRange[0][0], rectRange[1][0], rectRange[0][1], rectRange[1][1]
+    ));
+
+    updateCoverAfterCreation(controller, cover);
+    trigger(controller, {isEnd: false});
+}
+
+function driftPolygon(controller, cover, dx, dy, e) {
+    var range = cover.__brushOption.range;
+    var localDelta = toLocalDelta(controller, dx, dy);
+
+    each$12(range, function (point) {
+        point[0] += localDelta[0];
+        point[1] += localDelta[1];
+    });
+
+    updateCoverAfterCreation(controller, cover);
+    trigger(controller, {isEnd: false});
+}
+
+function toLocalDelta(controller, dx, dy) {
+    var thisGroup = controller.group;
+    var localD = thisGroup.transformCoordToLocal(dx, dy);
+    var localZero = thisGroup.transformCoordToLocal(0, 0);
+
+    return [localD[0] - localZero[0], localD[1] - localZero[1]];
+}
+
+function clipByPanel(controller, cover, data) {
+    var panel = getPanelByCover(controller, cover);
+
+    return (panel && panel !== true)
+        ? panel.clipPath(data, controller._transform)
+        : clone(data);
+}
+
+function pointsToRect(points) {
+    var xmin = mathMin$6(points[0][0], points[1][0]);
+    var ymin = mathMin$6(points[0][1], points[1][1]);
+    var xmax = mathMax$6(points[0][0], points[1][0]);
+    var ymax = mathMax$6(points[0][1], points[1][1]);
+
+    return {
+        x: xmin,
+        y: ymin,
+        width: xmax - xmin,
+        height: ymax - ymin
+    };
+}
+
+function resetCursor(controller, e, localCursorPoint) {
+    // Check active
+    if (!controller._brushType) {
+        return;
+    }
+
+    var zr = controller._zr;
+    var covers = controller._covers;
+    var currPanel = getPanelByPoint(controller, e, localCursorPoint);
+
+    // Check whether in covers.
+    if (!controller._dragging) {
+        for (var i = 0; i < covers.length; i++) {
+            var brushOption = covers[i].__brushOption;
+            if (currPanel
+                && (currPanel === true || brushOption.panelId === currPanel.panelId)
+                && coverRenderers[brushOption.brushType].contain(
+                    covers[i], localCursorPoint[0], localCursorPoint[1]
+                )
+            ) {
+                // Use cursor style set on cover.
+                return;
+            }
+        }
+    }
+
+    currPanel && zr.setCursorStyle('crosshair');
+}
+
+function preventDefault(e) {
+    var rawE = e.event;
+    rawE.preventDefault && rawE.preventDefault();
+}
+
+function mainShapeContain(cover, x, y) {
+    return cover.childOfName('main').contain(x, y);
+}
+
+function updateCoverByMouse(controller, e, localCursorPoint, isEnd) {
+    var creatingCover = controller._creatingCover;
+    var panel = controller._creatingPanel;
+    var thisBrushOption = controller._brushOption;
+    var eventParams;
+
+    controller._track.push(localCursorPoint.slice());
+
+    if (shouldShowCover(controller) || creatingCover) {
+
+        if (panel && !creatingCover) {
+            thisBrushOption.brushMode === 'single' && clearCovers(controller);
+            var brushOption = clone(thisBrushOption);
+            brushOption.brushType = determineBrushType(brushOption.brushType, panel);
+            brushOption.panelId = panel === true ? null : panel.panelId;
+            creatingCover = controller._creatingCover = createCover(controller, brushOption);
+            controller._covers.push(creatingCover);
+        }
+
+        if (creatingCover) {
+            var coverRenderer = coverRenderers[determineBrushType(controller._brushType, panel)];
+            var coverBrushOption = creatingCover.__brushOption;
+
+            coverBrushOption.range = coverRenderer.getCreatingRange(
+                clipByPanel(controller, creatingCover, controller._track)
+            );
+
+            if (isEnd) {
+                endCreating(controller, creatingCover);
+                coverRenderer.updateCommon(controller, creatingCover);
+            }
+
+            updateCoverShape(controller, creatingCover);
+
+            eventParams = {isEnd: isEnd};
+        }
+    }
+    else if (
+        isEnd
+        && thisBrushOption.brushMode === 'single'
+        && thisBrushOption.removeOnClick
+    ) {
+        // Help user to remove covers easily, only by a tiny drag, in 'single' mode.
+        // But a single click do not clear covers, because user may have casual
+        // clicks (for example, click on other component and do not expect covers
+        // disappear).
+        // Only some cover removed, trigger action, but not every click trigger action.
+        if (getPanelByPoint(controller, e, localCursorPoint) && clearCovers(controller)) {
+            eventParams = {isEnd: isEnd, removeOnClick: true};
+        }
+    }
+
+    return eventParams;
+}
+
+function determineBrushType(brushType, panel) {
+    if (brushType === 'auto') {
+        if (__DEV__) {
+            assert$1(
+                panel && panel.defaultBrushType,
+                'MUST have defaultBrushType when brushType is "atuo"'
+            );
+        }
+        return panel.defaultBrushType;
+    }
+    return brushType;
+}
+
+var mouseHandlers = {
+
+    mousedown: function (e) {
+        if (this._dragging) {
+            // In case some browser do not support globalOut,
+            // and release mose out side the browser.
+            handleDragEnd.call(this, e);
+        }
+        else if (!e.target || !e.target.draggable) {
+
+            preventDefault(e);
+
+            var localCursorPoint = this.group.transformCoordToLocal(e.offsetX, e.offsetY);
+
+            this._creatingCover = null;
+            var panel = this._creatingPanel = getPanelByPoint(this, e, localCursorPoint);
+
+            if (panel) {
+                this._dragging = true;
+                this._track = [localCursorPoint.slice()];
+            }
+        }
+    },
+
+    mousemove: function (e) {
+        var localCursorPoint = this.group.transformCoordToLocal(e.offsetX, e.offsetY);
+
+        resetCursor(this, e, localCursorPoint);
+
+        if (this._dragging) {
+
+            preventDefault(e);
+
+            var eventParams = updateCoverByMouse(this, e, localCursorPoint, false);
+
+            eventParams && trigger(this, eventParams);
+        }
+    },
+
+    mouseup: handleDragEnd //,
+
+    // FIXME
+    // in tooltip, globalout should not be triggered.
+    // globalout: handleDragEnd
+};
+
+function handleDragEnd(e) {
+    if (this._dragging) {
+
+        preventDefault(e);
+
+        var localCursorPoint = this.group.transformCoordToLocal(e.offsetX, e.offsetY);
+        var eventParams = updateCoverByMouse(this, e, localCursorPoint, true);
+
+        this._dragging = false;
+        this._track = [];
+        this._creatingCover = null;
+
+        // trigger event shoule be at final, after procedure will be nested.
+        eventParams && trigger(this, eventParams);
+    }
+}
+
+/**
+ * key: brushType
+ * @type {Object}
+ */
+var coverRenderers = {
+
+    lineX: getLineRenderer(0),
+
+    lineY: getLineRenderer(1),
+
+    rect: {
+        createCover: function (controller, brushOption) {
+            return createBaseRectCover(
+                curry$2(
+                    driftRect,
+                    function (range) {
+                        return range;
+                    },
+                    function (range) {
+                        return range;
+                    }
+                ),
+                controller,
+                brushOption,
+                ['w', 'e', 'n', 's', 'se', 'sw', 'ne', 'nw']
+            );
+        },
+        getCreatingRange: function (localTrack) {
+            var ends = getTrackEnds(localTrack);
+            return formatRectRange(ends[1][0], ends[1][1], ends[0][0], ends[0][1]);
+        },
+        updateCoverShape: function (controller, cover, localRange, brushOption) {
+            updateBaseRect(controller, cover, localRange, brushOption);
+        },
+        updateCommon: updateCommon,
+        contain: mainShapeContain
+    },
+
+    polygon: {
+        createCover: function (controller, brushOption) {
+            var cover = new Group();
+
+            // Do not use graphic.Polygon because graphic.Polyline do not close the
+            // border of the shape when drawing, which is a better experience for user.
+            cover.add(new Polyline({
+                name: 'main',
+                style: makeStyle(brushOption),
+                silent: true
+            }));
+
+            return cover;
+        },
+        getCreatingRange: function (localTrack) {
+            return localTrack;
+        },
+        endCreating: function (controller, cover) {
+            cover.remove(cover.childAt(0));
+            // Use graphic.Polygon close the shape.
+            cover.add(new Polygon({
+                name: 'main',
+                draggable: true,
+                drift: curry$2(driftPolygon, controller, cover),
+                ondragend: curry$2(trigger, controller, {isEnd: true})
+            }));
+        },
+        updateCoverShape: function (controller, cover, localRange, brushOption) {
+            cover.childAt(0).setShape({
+                points: clipByPanel(controller, cover, localRange)
+            });
+        },
+        updateCommon: updateCommon,
+        contain: mainShapeContain
+    }
+};
+
+function getLineRenderer(xyIndex) {
+    return {
+        createCover: function (controller, brushOption) {
+            return createBaseRectCover(
+                curry$2(
+                    driftRect,
+                    function (range) {
+                        var rectRange = [range, [0, 100]];
+                        xyIndex && rectRange.reverse();
+                        return rectRange;
+                    },
+                    function (rectRange) {
+                        return rectRange[xyIndex];
+                    }
+                ),
+                controller,
+                brushOption,
+                [['w', 'e'], ['n', 's']][xyIndex]
+            );
+        },
+        getCreatingRange: function (localTrack) {
+            var ends = getTrackEnds(localTrack);
+            var min = mathMin$6(ends[0][xyIndex], ends[1][xyIndex]);
+            var max = mathMax$6(ends[0][xyIndex], ends[1][xyIndex]);
+
+            return [min, max];
+        },
+        updateCoverShape: function (controller, cover, localRange, brushOption) {
+            var otherExtent;
+            // If brushWidth not specified, fit the panel.
+            var panel = getPanelByCover(controller, cover);
+            if (panel !== true && panel.getLinearBrushOtherExtent) {
+                otherExtent = panel.getLinearBrushOtherExtent(
+                    xyIndex, controller._transform
+                );
+            }
+            else {
+                var zr = controller._zr;
+                otherExtent = [0, [zr.getWidth(), zr.getHeight()][1 - xyIndex]];
+            }
+            var rectRange = [localRange, otherExtent];
+            xyIndex && rectRange.reverse();
+
+            updateBaseRect(controller, cover, rectRange, brushOption);
+        },
+        updateCommon: updateCommon,
+        contain: mainShapeContain
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function makeRectPanelClipPath(rect) {
+    rect = normalizeRect(rect);
+    return function (localPoints, transform) {
+        return clipPointsByRect(localPoints, rect);
+    };
+}
+
+function makeLinearBrushOtherExtent(rect, specifiedXYIndex) {
+    rect = normalizeRect(rect);
+    return function (xyIndex) {
+        var idx = specifiedXYIndex != null ? specifiedXYIndex : xyIndex;
+        var brushWidth = idx ? rect.width : rect.height;
+        var base = idx ? rect.x : rect.y;
+        return [base, base + (brushWidth || 0)];
+    };
+}
+
+function makeRectIsTargetByCursor(rect, api, targetModel) {
+    rect = normalizeRect(rect);
+    return function (e, localCursorPoint, transform) {
+        return rect.contain(localCursorPoint[0], localCursorPoint[1])
+            && !onIrrelevantElement(e, api, targetModel);
+    };
+}
+
+// Consider width/height is negative.
+function normalizeRect(rect) {
+    return BoundingRect.create(rect);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var elementList = ['axisLine', 'axisTickLabel', 'axisName'];
+
+var AxisView$2 = extendComponentView({
+
+    type: 'parallelAxis',
+
+    /**
+     * @override
+     */
+    init: function (ecModel, api) {
+        AxisView$2.superApply(this, 'init', arguments);
+
+        /**
+         * @type {module:echarts/component/helper/BrushController}
+         */
+        (this._brushController = new BrushController(api.getZr()))
+            .on('brush', bind(this._onBrush, this));
+    },
+
+    /**
+     * @override
+     */
+    render: function (axisModel, ecModel, api, payload) {
+        if (fromAxisAreaSelect(axisModel, ecModel, payload)) {
+            return;
+        }
+
+        this.axisModel = axisModel;
+        this.api = api;
+
+        this.group.removeAll();
+
+        var oldAxisGroup = this._axisGroup;
+        this._axisGroup = new Group();
+        this.group.add(this._axisGroup);
+
+        if (!axisModel.get('show')) {
+            return;
+        }
+
+        var coordSysModel = getCoordSysModel(axisModel, ecModel);
+        var coordSys = coordSysModel.coordinateSystem;
+
+        var areaSelectStyle = axisModel.getAreaSelectStyle();
+        var areaWidth = areaSelectStyle.width;
+
+        var dim = axisModel.axis.dim;
+        var axisLayout = coordSys.getAxisLayout(dim);
+
+        var builderOpt = extend(
+            {strokeContainThreshold: areaWidth},
+            axisLayout
+        );
+
+        var axisBuilder = new AxisBuilder(axisModel, builderOpt);
+
+        each$1(elementList, axisBuilder.add, axisBuilder);
+
+        this._axisGroup.add(axisBuilder.getGroup());
+
+        this._refreshBrushController(
+            builderOpt, areaSelectStyle, axisModel, coordSysModel, areaWidth, api
+        );
+
+        var animationModel = (payload && payload.animation === false) ? null : axisModel;
+        groupTransition(oldAxisGroup, this._axisGroup, animationModel);
+    },
+
+    // /**
+    //  * @override
+    //  */
+    // updateVisual: function (axisModel, ecModel, api, payload) {
+    //     this._brushController && this._brushController
+    //         .updateCovers(getCoverInfoList(axisModel));
+    // },
+
+    _refreshBrushController: function (
+        builderOpt, areaSelectStyle, axisModel, coordSysModel, areaWidth, api
+    ) {
+        // After filtering, axis may change, select area needs to be update.
+        var extent = axisModel.axis.getExtent();
+        var extentLen = extent[1] - extent[0];
+        var extra = Math.min(30, Math.abs(extentLen) * 0.1); // Arbitrary value.
+
+        // width/height might be negative, which will be
+        // normalized in BoundingRect.
+        var rect = BoundingRect.create({
+            x: extent[0],
+            y: -areaWidth / 2,
+            width: extentLen,
+            height: areaWidth
+        });
+        rect.x -= extra;
+        rect.width += 2 * extra;
+
+        this._brushController
+            .mount({
+                enableGlobalPan: true,
+                rotation: builderOpt.rotation,
+                position: builderOpt.position
+            })
+            .setPanels([{
+                panelId: 'pl',
+                clipPath: makeRectPanelClipPath(rect),
+                isTargetByCursor: makeRectIsTargetByCursor(rect, api, coordSysModel),
+                getLinearBrushOtherExtent: makeLinearBrushOtherExtent(rect, 0)
+            }])
+            .enableBrush({
+                brushType: 'lineX',
+                brushStyle: areaSelectStyle,
+                removeOnClick: true
+            })
+            .updateCovers(getCoverInfoList(axisModel));
+    },
+
+    _onBrush: function (coverInfoList, opt) {
+        // Do not cache these object, because the mey be changed.
+        var axisModel = this.axisModel;
+        var axis = axisModel.axis;
+        var intervals = map(coverInfoList, function (coverInfo) {
+            return [
+                axis.coordToData(coverInfo.range[0], true),
+                axis.coordToData(coverInfo.range[1], true)
+            ];
+        });
+
+        // If realtime is true, action is not dispatched on drag end, because
+        // the drag end emits the same params with the last drag move event,
+        // and may have some delay when using touch pad.
+        if (!axisModel.option.realtime === opt.isEnd || opt.removeOnClick) { // jshint ignore:line
+            this.api.dispatchAction({
+                type: 'axisAreaSelect',
+                parallelAxisId: axisModel.id,
+                intervals: intervals
+            });
+        }
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._brushController.dispose();
+    }
+});
+
+function fromAxisAreaSelect(axisModel, ecModel, payload) {
+    return payload
+        && payload.type === 'axisAreaSelect'
+        && ecModel.findComponents(
+            {mainType: 'parallelAxis', query: payload}
+        )[0] === axisModel;
+}
+
+function getCoverInfoList(axisModel) {
+    var axis = axisModel.axis;
+    return map(axisModel.activeIntervals, function (interval) {
+        return {
+            brushType: 'lineX',
+            panelId: 'pl',
+            range: [
+                axis.dataToCoord(interval[0], true),
+                axis.dataToCoord(interval[1], true)
+            ]
+        };
+    });
+}
+
+function getCoordSysModel(axisModel, ecModel) {
+    return ecModel.getComponent(
+        'parallel', axisModel.get('parallelIndex')
+    );
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CLICK_THRESHOLD = 5; // > 4
+
+// Parallel view
+extendComponentView({
+    type: 'parallel',
+
+    render: function (parallelModel, ecModel, api) {
+        this._model = parallelModel;
+        this._api = api;
+
+        if (!this._handlers) {
+            this._handlers = {};
+            each$1(handlers, function (handler, eventName) {
+                api.getZr().on(eventName, this._handlers[eventName] = bind(handler, this));
+            }, this);
+        }
+
+        createOrUpdate(
+            this,
+            '_throttledDispatchExpand',
+            parallelModel.get('axisExpandRate'),
+            'fixRate'
+        );
+    },
+
+    dispose: function (ecModel, api) {
+        each$1(this._handlers, function (handler, eventName) {
+            api.getZr().off(eventName, handler);
+        });
+        this._handlers = null;
+    },
+
+    /**
+     * @param {Object} [opt] If null, cancle the last action triggering for debounce.
+     */
+    _throttledDispatchExpand: function (opt) {
+        this._dispatchExpand(opt);
+    },
+
+    _dispatchExpand: function (opt) {
+        opt && this._api.dispatchAction(
+            extend({type: 'parallelAxisExpand'}, opt)
+        );
+    }
+
+});
+
+var handlers = {
+
+    mousedown: function (e) {
+        if (checkTrigger(this, 'click')) {
+            this._mouseDownPoint = [e.offsetX, e.offsetY];
+        }
+    },
+
+    mouseup: function (e) {
+        var mouseDownPoint = this._mouseDownPoint;
+
+        if (checkTrigger(this, 'click') && mouseDownPoint) {
+            var point = [e.offsetX, e.offsetY];
+            var dist = Math.pow(mouseDownPoint[0] - point[0], 2)
+                + Math.pow(mouseDownPoint[1] - point[1], 2);
+
+            if (dist > CLICK_THRESHOLD) {
+                return;
+            }
+
+            var result = this._model.coordinateSystem.getSlidedAxisExpandWindow(
+                [e.offsetX, e.offsetY]
+            );
+
+            result.behavior !== 'none' && this._dispatchExpand({
+                axisExpandWindow: result.axisExpandWindow
+            });
+        }
+
+        this._mouseDownPoint = null;
+    },
+
+    mousemove: function (e) {
+        // Should do nothing when brushing.
+        if (this._mouseDownPoint || !checkTrigger(this, 'mousemove')) {
+            return;
+        }
+        var model = this._model;
+        var result = model.coordinateSystem.getSlidedAxisExpandWindow(
+            [e.offsetX, e.offsetY]
+        );
+
+        var behavior = result.behavior;
+        behavior === 'jump' && this._throttledDispatchExpand.debounceNextCall(model.get('axisExpandDebounce'));
+        this._throttledDispatchExpand(
+            behavior === 'none'
+                ? null // Cancle the last trigger, in case that mouse slide out of the area quickly.
+                : {
+                    axisExpandWindow: result.axisExpandWindow,
+                    // Jumping uses animation, and sliding suppresses animation.
+                    animation: behavior === 'jump'  ? null : false
+                }
+        );
+    }
+};
+
+function checkTrigger(view, triggerOn) {
+    var model = view._model;
+    return model.get('axisExpandable') && model.get('axisExpandTriggerOn') === triggerOn;
+}
+
+registerPreprocessor(parallelPreprocessor);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.parallel',
+
+    dependencies: ['parallel'],
+
+    visualColorAccessPath: 'lineStyle.color',
+
+    getInitialData: function (option, ecModel) {
+        var source = this.getSource();
+
+        setEncodeAndDimensions(source, this);
+
+        return createListFromArray(source, this);
+    },
+
+    /**
+     * User can get data raw indices on 'axisAreaSelected' event received.
+     *
+     * @public
+     * @param {string} activeState 'active' or 'inactive' or 'normal'
+     * @return {Array.<number>} Raw indices
+     */
+    getRawIndicesByActiveState: function (activeState) {
+        var coordSys = this.coordinateSystem;
+        var data = this.getData();
+        var indices = [];
+
+        coordSys.eachActiveState(data, function (theActiveState, dataIndex) {
+            if (activeState === theActiveState) {
+                indices.push(data.getRawIndex(dataIndex));
+            }
+        });
+
+        return indices;
+    },
+
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+
+        coordinateSystem: 'parallel',
+        parallelIndex: 0,
+
+        label: {
+            show: false
+        },
+
+        inactiveOpacity: 0.05,
+        activeOpacity: 1,
+
+        lineStyle: {
+            width: 1,
+            opacity: 0.45,
+            type: 'solid'
+        },
+        emphasis: {
+            label: {
+                show: false
+            }
+        },
+
+        progressive: 500,
+        smooth: false, // true | false | number
+
+        animationEasing: 'linear'
+    }
+});
+
+function setEncodeAndDimensions(source, seriesModel) {
+    // The mapping of parallelAxis dimension to data dimension can
+    // be specified in parallelAxis.option.dim. For example, if
+    // parallelAxis.option.dim is 'dim3', it mapping to the third
+    // dimension of data. But `data.encode` has higher priority.
+    // Moreover, parallelModel.dimension should not be regarded as data
+    // dimensions. Consider dimensions = ['dim4', 'dim2', 'dim6'];
+
+    if (source.encodeDefine) {
+        return;
+    }
+
+    var parallelModel = seriesModel.ecModel.getComponent(
+        'parallel', seriesModel.get('parallelIndex')
+    );
+    if (!parallelModel) {
+        return;
+    }
+
+    var encodeDefine = source.encodeDefine = createHashMap();
+    each$1(parallelModel.dimensions, function (axisDim) {
+        var dataDimIndex = convertDimNameToNumber(axisDim);
+        encodeDefine.set(axisDim, dataDimIndex);
+    });
+}
+
+function convertDimNameToNumber(dimName) {
+    return +dimName.replace('dim', '');
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DEFAULT_SMOOTH = 0.3;
+
+var ParallelView = Chart.extend({
+
+    type: 'parallel',
+
+    init: function () {
+
+        /**
+         * @type {module:zrender/container/Group}
+         * @private
+         */
+        this._dataGroup = new Group();
+
+        this.group.add(this._dataGroup);
+
+        /**
+         * @type {module:echarts/data/List}
+         */
+        this._data;
+
+        /**
+         * @type {boolean}
+         */
+        this._initialized;
+    },
+
+    /**
+     * @override
+     */
+    render: function (seriesModel, ecModel, api, payload) {
+        var dataGroup = this._dataGroup;
+        var data = seriesModel.getData();
+        var oldData = this._data;
+        var coordSys = seriesModel.coordinateSystem;
+        var dimensions = coordSys.dimensions;
+        var seriesScope = makeSeriesScope$2(seriesModel);
+
+        data.diff(oldData)
+            .add(add)
+            .update(update)
+            .remove(remove)
+            .execute();
+
+        function add(newDataIndex) {
+            var line = addEl(data, dataGroup, newDataIndex, dimensions, coordSys);
+            updateElCommon(line, data, newDataIndex, seriesScope);
+        }
+
+        function update(newDataIndex, oldDataIndex) {
+            var line = oldData.getItemGraphicEl(oldDataIndex);
+            var points = createLinePoints(data, newDataIndex, dimensions, coordSys);
+            data.setItemGraphicEl(newDataIndex, line);
+            var animationModel = (payload && payload.animation === false) ? null : seriesModel;
+            updateProps(line, {shape: {points: points}}, animationModel, newDataIndex);
+
+            updateElCommon(line, data, newDataIndex, seriesScope);
+        }
+
+        function remove(oldDataIndex) {
+            var line = oldData.getItemGraphicEl(oldDataIndex);
+            dataGroup.remove(line);
+        }
+
+        // First create
+        if (!this._initialized) {
+            this._initialized = true;
+            var clipPath = createGridClipShape$1(
+                coordSys, seriesModel, function () {
+                    // Callback will be invoked immediately if there is no animation
+                    setTimeout(function () {
+                        dataGroup.removeClipPath();
+                    });
+                }
+            );
+            dataGroup.setClipPath(clipPath);
+        }
+
+        this._data = data;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this._initialized = true;
+        this._data = null;
+        this._dataGroup.removeAll();
+    },
+
+    incrementalRender: function (taskParams, seriesModel, ecModel) {
+        var data = seriesModel.getData();
+        var coordSys = seriesModel.coordinateSystem;
+        var dimensions = coordSys.dimensions;
+        var seriesScope = makeSeriesScope$2(seriesModel);
+
+        for (var dataIndex = taskParams.start; dataIndex < taskParams.end; dataIndex++) {
+            var line = addEl(data, this._dataGroup, dataIndex, dimensions, coordSys);
+            line.incremental = true;
+            updateElCommon(line, data, dataIndex, seriesScope);
+        }
+    },
+
+    dispose: function () {},
+
+    // _renderForProgressive: function (seriesModel) {
+    //     var dataGroup = this._dataGroup;
+    //     var data = seriesModel.getData();
+    //     var oldData = this._data;
+    //     var coordSys = seriesModel.coordinateSystem;
+    //     var dimensions = coordSys.dimensions;
+    //     var option = seriesModel.option;
+    //     var progressive = option.progressive;
+    //     var smooth = option.smooth ? SMOOTH : null;
+
+    //     // In progressive animation is disabled, so use simple data diff,
+    //     // which effects performance less.
+    //     // (Typically performance for data with length 7000+ like:
+    //     // simpleDiff: 60ms, addEl: 184ms,
+    //     // in RMBP 2.4GHz intel i7, OSX 10.9 chrome 50.0.2661.102 (64-bit))
+    //     if (simpleDiff(oldData, data, dimensions)) {
+    //         dataGroup.removeAll();
+    //         data.each(function (dataIndex) {
+    //             addEl(data, dataGroup, dataIndex, dimensions, coordSys);
+    //         });
+    //     }
+
+    //     updateElCommon(data, progressive, smooth);
+
+    //     // Consider switch between progressive and not.
+    //     data.__plProgressive = true;
+    //     this._data = data;
+    // },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._dataGroup && this._dataGroup.removeAll();
+        this._data = null;
+    }
+});
+
+function createGridClipShape$1(coordSys, seriesModel, cb) {
+    var parallelModel = coordSys.model;
+    var rect = coordSys.getRect();
+    var rectEl = new Rect({
+        shape: {
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        }
+    });
+
+    var dim = parallelModel.get('layout') === 'horizontal' ? 'width' : 'height';
+    rectEl.setShape(dim, 0);
+    initProps(rectEl, {
+        shape: {
+            width: rect.width,
+            height: rect.height
+        }
+    }, seriesModel, cb);
+    return rectEl;
+}
+
+function createLinePoints(data, dataIndex, dimensions, coordSys) {
+    var points = [];
+    for (var i = 0; i < dimensions.length; i++) {
+        var dimName = dimensions[i];
+        var value = data.get(data.mapDimension(dimName), dataIndex);
+        if (!isEmptyValue(value, coordSys.getAxis(dimName).type)) {
+            points.push(coordSys.dataToPoint(value, dimName));
+        }
+    }
+    return points;
+}
+
+function addEl(data, dataGroup, dataIndex, dimensions, coordSys) {
+    var points = createLinePoints(data, dataIndex, dimensions, coordSys);
+    var line = new Polyline({
+        shape: {points: points},
+        silent: true,
+        z2: 10
+    });
+    dataGroup.add(line);
+    data.setItemGraphicEl(dataIndex, line);
+    return line;
+}
+
+function makeSeriesScope$2(seriesModel) {
+    var smooth = seriesModel.get('smooth', true);
+    smooth === true && (smooth = DEFAULT_SMOOTH);
+    return {
+        lineStyle: seriesModel.getModel('lineStyle').getLineStyle(),
+        smooth: smooth != null ? smooth : DEFAULT_SMOOTH
+    };
+}
+
+function updateElCommon(el, data, dataIndex, seriesScope) {
+    var lineStyle = seriesScope.lineStyle;
+
+    if (data.hasItemOption) {
+        var lineStyleModel = data.getItemModel(dataIndex).getModel('lineStyle');
+        lineStyle = lineStyleModel.getLineStyle();
+    }
+
+    el.useStyle(lineStyle);
+
+    var elStyle = el.style;
+    elStyle.fill = null;
+    // lineStyle.color have been set to itemVisual in module:echarts/visual/seriesColor.
+    elStyle.stroke = data.getItemVisual(dataIndex, 'color');
+    // lineStyle.opacity have been set to itemVisual in parallelVisual.
+    elStyle.opacity = data.getItemVisual(dataIndex, 'opacity');
+
+    seriesScope.smooth && (el.shape.smooth = seriesScope.smooth);
+}
+
+// function simpleDiff(oldData, newData, dimensions) {
+//     var oldLen;
+//     if (!oldData
+//         || !oldData.__plProgressive
+//         || (oldLen = oldData.count()) !== newData.count()
+//     ) {
+//         return true;
+//     }
+
+//     var dimLen = dimensions.length;
+//     for (var i = 0; i < oldLen; i++) {
+//         for (var j = 0; j < dimLen; j++) {
+//             if (oldData.get(dimensions[j], i) !== newData.get(dimensions[j], i)) {
+//                 return true;
+//             }
+//         }
+//     }
+
+//     return false;
+// }
+
+// FIXME
+// 公用方法?
+function isEmptyValue(val, axisType) {
+    return axisType === 'category'
+        ? val == null
+        : (val == null || isNaN(val)); // axisType === 'value'
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var opacityAccessPath$1 = ['lineStyle', 'normal', 'opacity'];
+
+var parallelVisual = {
+
+    seriesType: 'parallel',
+
+    reset: function (seriesModel, ecModel, api) {
+
+        var itemStyleModel = seriesModel.getModel('itemStyle');
+        var lineStyleModel = seriesModel.getModel('lineStyle');
+        var globalColors = ecModel.get('color');
+
+        var color = lineStyleModel.get('color')
+            || itemStyleModel.get('color')
+            || globalColors[seriesModel.seriesIndex % globalColors.length];
+        var inactiveOpacity = seriesModel.get('inactiveOpacity');
+        var activeOpacity = seriesModel.get('activeOpacity');
+        var lineStyle = seriesModel.getModel('lineStyle').getLineStyle();
+
+        var coordSys = seriesModel.coordinateSystem;
+        var data = seriesModel.getData();
+
+        var opacityMap = {
+            normal: lineStyle.opacity,
+            active: activeOpacity,
+            inactive: inactiveOpacity
+        };
+
+        data.setVisual('color', color);
+
+        function progress(params, data) {
+            coordSys.eachActiveState(data, function (activeState, dataIndex) {
+                var opacity = opacityMap[activeState];
+                if (activeState === 'normal' && data.hasItemOption) {
+                    var itemOpacity = data.getItemModel(dataIndex).get(opacityAccessPath$1, true);
+                    itemOpacity != null && (opacity = itemOpacity);
+                }
+                data.setItemVisual(dataIndex, 'opacity', opacity);
+            }, params.start, params.end);
+        }
+
+        return {progress: progress};
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(parallelVisual);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Get initial data and define sankey view's series model
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var SankeySeries = SeriesModel.extend({
+
+    type: 'series.sankey',
+
+    layoutInfo: null,
+
+    /**
+     * Init a graph data structure from data in option series
+     *
+     * @param  {Object} option  the object used to config echarts view
+     * @return {module:echarts/data/List} storage initial data
+     */
+    getInitialData: function (option) {
+        var links = option.edges || option.links;
+        var nodes = option.data || option.nodes;
+        if (nodes && links) {
+            var graph = createGraphFromNodeEdge(nodes, links, this, true);
+            return graph.data;
+        }
+    },
+
+    setNodePosition: function (dataIndex, localPosition) {
+        var dataItem = this.option.data[dataIndex];
+        dataItem.localX = localPosition[0];
+        dataItem.localY = localPosition[1];
+    },
+
+    /**
+     * Return the graphic data structure
+     *
+     * @return {module:echarts/data/Graph} graphic data structure
+     */
+    getGraph: function () {
+        return this.getData().graph;
+    },
+
+    /**
+     * Get edge data of graphic data structure
+     *
+     * @return {module:echarts/data/List} data structure of list
+     */
+    getEdgeData: function () {
+        return this.getGraph().edgeData;
+    },
+
+    /**
+     * @override
+     */
+    formatTooltip: function (dataIndex, multipleSeries, dataType) {
+        // dataType === 'node' or empty do not show tooltip by default
+        if (dataType === 'edge') {
+            var params = this.getDataParams(dataIndex, dataType);
+            var rawDataOpt = params.data;
+            var html = rawDataOpt.source + ' -- ' + rawDataOpt.target;
+            if (params.value) {
+                html += ' : ' + params.value;
+            }
+            return encodeHTML(html);
+        }
+
+        return SankeySeries.superCall(this, 'formatTooltip', dataIndex, multipleSeries);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        coordinateSystem: 'view',
+
+        layout: null,
+
+        // the position of the whole view
+        left: '5%',
+        top: '5%',
+        right: '20%',
+        bottom: '5%',
+
+        // the dx of the node
+        nodeWidth: 20,
+
+        // the vertical distance between two nodes
+        nodeGap: 8,
+
+        // control if the node can move or not
+        draggable: true,
+
+        // the number of iterations to change the position of the node
+        layoutIterations: 32,
+
+        label: {
+            show: true,
+            position: 'right',
+            color: '#000',
+            fontSize: 12
+        },
+
+        itemStyle: {
+            borderWidth: 1,
+            borderColor: '#333'
+        },
+
+        lineStyle: {
+            color: '#314656',
+            opacity: 0.2,
+            curveness: 0.5
+        },
+
+        emphasis: {
+            label: {
+                show: true
+            },
+            lineStyle: {
+                opacity: 0.6
+            }
+        },
+
+        animationEasing: 'linear',
+
+        animationDuration: 1000
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  The file used to draw sankey view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+var SankeyShape = extendShape({
+    shape: {
+        x1: 0, y1: 0,
+        x2: 0, y2: 0,
+        cpx1: 0, cpy1: 0,
+        cpx2: 0, cpy2: 0,
+
+        extent: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var halfExtent = shape.extent / 2;
+        ctx.moveTo(shape.x1, shape.y1 - halfExtent);
+        ctx.bezierCurveTo(
+            shape.cpx1, shape.cpy1 - halfExtent,
+            shape.cpx2, shape.cpy2 - halfExtent,
+            shape.x2, shape.y2 - halfExtent
+        );
+        ctx.lineTo(shape.x2, shape.y2 + halfExtent);
+        ctx.bezierCurveTo(
+            shape.cpx2, shape.cpy2 + halfExtent,
+            shape.cpx1, shape.cpy1 + halfExtent,
+            shape.x1, shape.y1 + halfExtent
+        );
+        ctx.closePath();
+    }
+});
+
+extendChartView({
+
+    type: 'sankey',
+
+    /**
+     * @private
+     * @type {module:echarts/chart/sankey/SankeySeries}
+     */
+    _model: null,
+
+    render: function (seriesModel, ecModel, api) {
+        var graph = seriesModel.getGraph();
+        var group = this.group;
+        var layoutInfo = seriesModel.layoutInfo;
+        // view width
+        var width = layoutInfo.width;
+        // view height
+        var height = layoutInfo.height;
+        
+        var nodeData = seriesModel.getData();
+        var edgeData = seriesModel.getData('edge');
+
+        this._model = seriesModel;
+
+        group.removeAll();
+
+        group.attr('position', [layoutInfo.x, layoutInfo.y]);
+
+        // generate a bezire Curve for each edge
+        graph.eachEdge(function (edge) {
+            var curve = new SankeyShape();
+            curve.dataIndex = edge.dataIndex;
+            curve.seriesIndex = seriesModel.seriesIndex;
+            curve.dataType = 'edge';
+            var lineStyleModel = edge.getModel('lineStyle');
+            var curvature = lineStyleModel.get('curveness');
+            var n1Layout = edge.node1.getLayout();
+            var node1Model =edge.node1.getModel();
+            var dragX1 = node1Model.get('localX');
+            var dragY1 = node1Model.get('localY');
+            var n2Layout = edge.node2.getLayout();
+            var node2Model = edge.node2.getModel();
+            var dragX2 = node2Model.get('localX');
+            var dragY2 = node2Model.get('localY');
+            var edgeLayout = edge.getLayout();
+
+            curve.shape.extent = Math.max(1, edgeLayout.dy);
+
+            var x1 = (dragX1 != null ? dragX1 * width : n1Layout.x) + n1Layout.dx;
+            var y1 = (dragY1 != null ? dragY1 * height : n1Layout.y) + edgeLayout.sy + edgeLayout.dy / 2;
+            var x2 = dragX2 != null ? dragX2 * width : n2Layout.x;
+            var y2 = (dragY2 != null ? dragY2 * height : n2Layout.y) + edgeLayout.ty + edgeLayout.dy / 2;
+            var cpx1 = x1 * (1 - curvature) + x2 * curvature;
+            var cpy1 = y1;
+            var cpx2 = x1 * curvature + x2 * (1 - curvature);
+            var cpy2 = y2;
+
+            curve.setShape({
+                x1: x1,
+                y1: y1,
+                x2: x2,
+                y2: y2,
+                cpx1: cpx1,
+                cpy1: cpy1,
+                cpx2: cpx2,
+                cpy2: cpy2
+            });
+
+            curve.setStyle(lineStyleModel.getItemStyle());
+            // Special color, use source node color or target node color
+            switch (curve.style.fill) {
+                case 'source':
+                    curve.style.fill = edge.node1.getVisual('color');
+                    break;
+                case 'target':
+                    curve.style.fill = edge.node2.getVisual('color');
+                    break;
+            }
+
+            setHoverStyle(curve, edge.getModel('emphasis.lineStyle').getItemStyle());
+
+            group.add(curve);
+
+            edgeData.setItemGraphicEl(edge.dataIndex, curve);
+        });
+
+        // generate a rect for each node
+        graph.eachNode(function (node) {
+            var layout = node.getLayout();
+            var itemModel = node.getModel();
+            var dragX = itemModel.get('localX');
+            var dragY = itemModel.get('localY');
+            var labelModel = itemModel.getModel('label');
+            var labelHoverModel = itemModel.getModel('emphasis.label');
+
+            var rect = new Rect({
+                shape: {
+                    x: dragX != null ? dragX * width : layout.x,
+                    y: dragY != null ? dragY * height : layout.y,
+                    width: layout.dx,
+                    height: layout.dy
+                },
+                style: itemModel.getModel('itemStyle').getItemStyle()
+            });
+
+            var hoverStyle = node.getModel('emphasis.itemStyle').getItemStyle();
+
+            setLabelStyle(
+                rect.style, hoverStyle, labelModel, labelHoverModel,
+                {
+                    labelFetcher: seriesModel,
+                    labelDataIndex: node.dataIndex,
+                    defaultText: node.id,
+                    isRectText: true
+                }
+            );
+
+            rect.setStyle('fill', node.getVisual('color'));
+
+            setHoverStyle(rect, hoverStyle);
+
+            group.add(rect);
+
+            nodeData.setItemGraphicEl(node.dataIndex, rect);
+
+            rect.dataType = 'node';
+        });
+
+        var draggable = seriesModel.get('draggable');
+        if (draggable) {
+            nodeData.eachItemGraphicEl(function (el, dataIndex) {
+                el.drift = function (dx, dy) {
+                    this.shape.x += dx;
+                    this.shape.y += dy;
+                    this.dirty();
+                    api.dispatchAction({
+                        type: 'dragNode',
+                        seriesId: seriesModel.id,
+                        dataIndex: nodeData.getRawIndex(dataIndex),
+                        localX: this.shape.x / width,
+                        localY: this.shape.y / height
+                    });
+                };
+        
+                el.draggable = true;
+                el.cursor = 'move';
+            });
+        }
+        
+        if (!this._data && seriesModel.get('animation')) {
+            group.setClipPath(createGridClipShape$2(group.getBoundingRect(), seriesModel, function () {
+                group.removeClipPath();
+            }));
+        }
+
+        this._data = seriesModel.getData();
+    },
+
+    dispose: function () {}
+});
+
+// add animation to the view
+function createGridClipShape$2(rect, seriesModel, cb) {
+    var rectEl = new Rect({
+        shape: {
+            x: rect.x - 10,
+            y: rect.y - 10,
+            width: 0,
+            height: rect.height + 20
+        }
+    });
+    initProps(rectEl, {
+        shape: {
+            width: rect.width + 20,
+            height: rect.height + 20
+        }
+    }, seriesModel, cb);
+
+    return rectEl;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction({
+    type: 'dragNode',
+    event: 'dragNode',
+    // here can only use 'update' now, other value is not support in echarts.
+    update: 'update'
+}, function (payload, ecModel) {
+    ecModel.eachComponent({mainType: 'series', subType: 'sankey', query: payload}, function (seriesModel) {
+        seriesModel.setNodePosition(payload.dataIndex, [payload.localX, payload.localY]);
+    });
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The implementation references to d3.js. The use of the source
+* code of this file is also subject to the terms and consitions
+* of its license (BSD-3Clause, see <echarts/src/licenses/LICENSE-d3>).
+*/
+
+
+/**
+ * nest helper used to group by the array.
+ * can specified the keys and sort the keys.
+ */
+function nest() {
+
+    var keysFunction = [];
+    var sortKeysFunction = [];
+
+    /**
+     * map an Array into the mapObject.
+     * @param {Array} array
+     * @param {number} depth
+     */
+    function map$$1(array, depth) {
+        if (depth >= keysFunction.length) {
+            return array;
+        }
+        var i = -1;
+        var n = array.length;
+        var keyFunction = keysFunction[depth++];
+        var mapObject = {};
+        var valuesByKey = {};
+
+        while (++i < n) {
+            var keyValue = keyFunction(array[i]);
+            var values = valuesByKey[keyValue];
+
+            if (values) {
+                values.push(array[i]);
+            }
+            else {
+                valuesByKey[keyValue] = [array[i]];
+            }
+        }
+
+        each$1(valuesByKey, function (value, key) {
+            mapObject[key] = map$$1(value, depth);
+        });
+
+        return mapObject;
+    }
+
+    /**
+     * transform the Map Object to multidimensional Array
+     * @param {Object} map
+     * @param {number} depth
+     */
+    function entriesMap(mapObject, depth) {
+        if (depth >= keysFunction.length) {
+            return mapObject;
+        }
+        var array = [];
+        var sortKeyFunction = sortKeysFunction[depth++];
+
+        each$1(mapObject, function (value, key) {
+            array.push({
+                key: key, values: entriesMap(value, depth)
+            });
+        });
+
+        if (sortKeyFunction) {
+            return array.sort(function (a, b) {
+                return sortKeyFunction(a.key, b.key);
+            });
+        }
+        else {
+            return array;
+        }
+    }
+
+    return {
+        /**
+         * specified the key to groupby the arrays.
+         * users can specified one more keys.
+         * @param {Function} d
+         */
+        key: function (d) {
+            keysFunction.push(d);
+            return this;
+        },
+
+        /**
+         * specified the comparator to sort the keys
+         * @param {Function} order
+         */
+        sortKeys: function (order) {
+            sortKeysFunction[keysFunction.length - 1] = order;
+            return this;
+        },
+
+        /**
+         * the array to be grouped by.
+         * @param {Array} array
+         */
+        entries: function (array) {
+            return entriesMap(map$$1(array, 0), 0);
+        }
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file The layout algorithm of sankey view
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var sankeyLayout = function (ecModel, api, payload) {
+
+    ecModel.eachSeriesByType('sankey', function (seriesModel) {
+
+        var nodeWidth = seriesModel.get('nodeWidth');
+        var nodeGap = seriesModel.get('nodeGap');
+
+        var layoutInfo = getViewRect$3(seriesModel, api);
+
+        seriesModel.layoutInfo = layoutInfo;
+
+        var width = layoutInfo.width;
+        var height = layoutInfo.height;
+
+        var graph = seriesModel.getGraph();
+
+        var nodes = graph.nodes;
+        var edges = graph.edges;
+
+        computeNodeValues(nodes);
+
+        var filteredNodes = filter(nodes, function (node) {
+            return node.getLayout().value === 0;
+        });
+
+        var iterations = filteredNodes.length !== 0
+            ? 0 : seriesModel.get('layoutIterations');
+
+        layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations);
+    });
+};
+
+/**
+ * Get the layout position of the whole view
+ *
+ * @param {module:echarts/model/Series} seriesModel  the model object of sankey series
+ * @param {module:echarts/ExtensionAPI} api  provide the API list that the developer can call
+ * @return {module:zrender/core/BoundingRect}  size of rect to draw the sankey view
+ */
+function getViewRect$3(seriesModel, api) {
+    return getLayoutRect(
+        seriesModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        }
+    );
+}
+
+function layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations) {
+    computeNodeBreadths(nodes, edges, nodeWidth, width);
+    computeNodeDepths(nodes, edges, height, nodeGap, iterations);
+    computeEdgeDepths(nodes);
+}
+
+/**
+ * Compute the value of each node by summing the associated edge's value
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ */
+function computeNodeValues(nodes) {
+    each$1(nodes, function (node) {
+        var value1 = sum(node.outEdges, getEdgeValue);
+        var value2 = sum(node.inEdges, getEdgeValue);
+        var value = Math.max(value1, value2);
+        node.setLayout({value: value}, true);
+    });
+}
+
+/**
+ * Compute the x-position for each node.
+ * 
+ * Here we use Kahn algorithm to detect cycle when we traverse
+ * the node to computer the initial x position.
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param  {number} nodeWidth  the dx of the node
+ * @param  {number} width  the whole width of the area to draw the view
+ */
+function computeNodeBreadths(nodes, edges, nodeWidth, width) {
+    // Used to mark whether the edge is deleted. if it is deleted,
+    // the value is 0, otherwise it is 1.
+    var remainEdges = [];
+    // Storage each node's indegree.
+    var indegreeArr = [];
+    //Used to storage the node with indegree is equal to 0.
+    var zeroIndegrees = [];
+    var nextNode = [];
+    var x = 0;
+    var kx = 0;
+
+    for (var i = 0; i < edges.length; i++) {
+        remainEdges[i] = 1;
+    }
+
+    for (var i = 0; i < nodes.length; i++) {
+        indegreeArr[i] = nodes[i].inEdges.length;
+        if (indegreeArr[i] === 0) {
+            zeroIndegrees.push(nodes[i]);
+        }
+    }
+    
+    while (zeroIndegrees.length) {
+        each$1(zeroIndegrees, function (node) {
+            node.setLayout({x: x}, true);
+            node.setLayout({dx: nodeWidth}, true);
+            each$1(node.outEdges, function (edge) {
+                var indexEdge = edges.indexOf(edge);
+                remainEdges[indexEdge] = 0;
+                var targetNode = edge.node2;
+                var nodeIndex = nodes.indexOf(targetNode);
+                if (--indegreeArr[nodeIndex] === 0) {
+                    nextNode.push(targetNode);
+                }
+            });
+        });
+       
+        ++x;
+        zeroIndegrees = nextNode;
+        nextNode = [];
+    }
+    
+    for (var i = 0; i < remainEdges.length; i++) {
+        if (__DEV__) {
+            if (remainEdges[i] === 1) {
+                throw new Error('Sankey is a DAG, the original data has cycle!');
+            }
+        } 
+    }
+
+    moveSinksRight(nodes, x);
+    kx = (width - nodeWidth) / (x - 1);
+
+    scaleNodeBreadths(nodes, kx);
+}
+
+/**
+ * All the node without outEgdes are assigned maximum x-position and
+ *     be aligned in the last column.
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {number} x  value (x-1) use to assign to node without outEdges
+ *     as x-position
+ */
+function moveSinksRight(nodes, x) {
+    each$1(nodes, function (node) {
+        if (!node.outEdges.length) {
+            node.setLayout({x: x - 1}, true);
+        }
+    });
+}
+
+/**
+ * Scale node x-position to the width
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {number} kx   multiple used to scale nodes
+ */
+function scaleNodeBreadths(nodes, kx) {
+    each$1(nodes, function (node) {
+        var nodeX = node.getLayout().x * kx;
+        node.setLayout({x: nodeX}, true);
+    });
+}
+
+/**
+ * Using Gauss-Seidel iterations method to compute the node depth(y-position)
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {module:echarts/data/Graph~Edge} edges  edge of sankey view
+ * @param {number} height  the whole height of the area to draw the view
+ * @param {number} nodeGap  the vertical distance between two nodes
+ *     in the same column.
+ * @param {number} iterations  the number of iterations for the algorithm
+ */
+function computeNodeDepths(nodes, edges, height, nodeGap, iterations) {
+    var nodesByBreadth = nest()
+        .key(function (d) {
+            return d.getLayout().x;
+        })
+        .sortKeys(ascending)
+        .entries(nodes)
+        .map(function (d) {
+            return d.values;
+        });
+
+    initializeNodeDepth(nodes, nodesByBreadth, edges, height, nodeGap);
+    resolveCollisions(nodesByBreadth, nodeGap, height);
+
+    for (var alpha = 1; iterations > 0; iterations--) {
+        // 0.99 is a experience parameter, ensure that each iterations of
+        // changes as small as possible.
+        alpha *= 0.99;
+        relaxRightToLeft(nodesByBreadth, alpha);
+        resolveCollisions(nodesByBreadth, nodeGap, height);
+        relaxLeftToRight(nodesByBreadth, alpha);
+        resolveCollisions(nodesByBreadth, nodeGap, height);
+    }
+}
+
+/**
+ * Compute the original y-position for each node
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the nodes x-position.
+ * @param {module:echarts/data/Graph~Edge} edges  edge of sankey view
+ * @param {number} height  the whole height of the area to draw the view
+ * @param {number} nodeGap  the vertical distance between two nodes
+ */
+function initializeNodeDepth(nodes, nodesByBreadth, edges, height, nodeGap) {
+    var kyArray = [];
+    each$1(nodesByBreadth, function (nodes) {
+        var n = nodes.length;
+        var sum = 0;
+        each$1(nodes, function (node) {
+            sum += node.getLayout().value;
+        });
+        var ky = (height - (n - 1) * nodeGap) / sum;
+        kyArray.push(ky);
+    });
+
+    kyArray.sort(function (a, b) {
+        return a - b;
+    });
+    var ky0 = kyArray[0];
+
+    each$1(nodesByBreadth, function (nodes) {
+        each$1(nodes, function (node, i) {
+            node.setLayout({y: i}, true);
+            var nodeDy = node.getLayout().value * ky0;
+            node.setLayout({dy: nodeDy}, true);
+        });
+    });
+
+    each$1(edges, function (edge) {
+        var edgeDy = +edge.getValue() * ky0;
+        edge.setLayout({dy: edgeDy}, true);
+    });
+}
+
+/**
+ * Resolve the collision of initialized depth (y-position)
+ *
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the nodes x-position.
+ * @param {number} nodeGap  the vertical distance between two nodes
+ * @param {number} height  the whole height of the area to draw the view
+ */
+function resolveCollisions(nodesByBreadth, nodeGap, height) {
+    each$1(nodesByBreadth, function (nodes) {
+        var node;
+        var dy;
+        var y0 = 0;
+        var n = nodes.length;
+        var i;
+
+        nodes.sort(ascendingDepth);
+
+        for (i = 0; i < n; i++) {
+            node = nodes[i];
+            dy = y0 - node.getLayout().y;
+            if (dy > 0) {
+                var nodeY = node.getLayout().y + dy;
+                node.setLayout({y: nodeY}, true);
+            }
+            y0 = node.getLayout().y + node.getLayout().dy + nodeGap;
+        }
+
+        // If the bottommost node goes outside the bounds, push it back up
+        dy = y0 - nodeGap - height;
+        if (dy > 0) {
+            var nodeY = node.getLayout().y - dy;
+            node.setLayout({y: nodeY}, true);
+            y0 = node.getLayout().y;
+            for (i = n - 2; i >= 0; --i) {
+                node = nodes[i];
+                dy = node.getLayout().y + node.getLayout().dy + nodeGap - y0;
+                if (dy > 0) {
+                    nodeY = node.getLayout().y - dy;
+                    node.setLayout({y: nodeY}, true);
+                }
+                y0 = node.getLayout().y;
+            }
+        }
+    });
+}
+
+/**
+ * Change the y-position of the nodes, except most the right side nodes
+ *
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the node x-position.
+ * @param {number} alpha  parameter used to adjust the nodes y-position
+ */
+function relaxRightToLeft(nodesByBreadth, alpha) {
+    each$1(nodesByBreadth.slice().reverse(), function (nodes) {
+        each$1(nodes, function (node) {
+            if (node.outEdges.length) {
+                var y = sum(node.outEdges, weightedTarget) / sum(node.outEdges, getEdgeValue);
+                var nodeY = node.getLayout().y + (y - center$1(node)) * alpha;
+                node.setLayout({y: nodeY}, true);
+            }
+        });
+    });
+}
+
+function weightedTarget(edge) {
+    return center$1(edge.node2) * edge.getValue();
+}
+
+/**
+ * Change the y-position of the nodes, except most the left side nodes
+ *
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the node x-position.
+ * @param {number} alpha  parameter used to adjust the nodes y-position
+ */
+function relaxLeftToRight(nodesByBreadth, alpha) {
+    each$1(nodesByBreadth, function (nodes) {
+        each$1(nodes, function (node) {
+            if (node.inEdges.length) {
+                var y = sum(node.inEdges, weightedSource) / sum(node.inEdges, getEdgeValue);
+                var nodeY = node.getLayout().y + (y - center$1(node)) * alpha;
+                node.setLayout({y: nodeY}, true);
+            }
+        });
+    });
+}
+
+function weightedSource(edge) {
+    return center$1(edge.node1) * edge.getValue();
+}
+
+/**
+ * Compute the depth(y-position) of each edge
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ */
+function computeEdgeDepths(nodes) {
+    each$1(nodes, function (node) {
+        node.outEdges.sort(ascendingTargetDepth);
+        node.inEdges.sort(ascendingSourceDepth);
+    });
+    each$1(nodes, function (node) {
+        var sy = 0;
+        var ty = 0;
+        each$1(node.outEdges, function (edge) {
+            edge.setLayout({sy: sy}, true);
+            sy += edge.getLayout().dy;
+        });
+        each$1(node.inEdges, function (edge) {
+            edge.setLayout({ty: ty}, true);
+            ty += edge.getLayout().dy;
+        });
+    });
+}
+
+function ascendingTargetDepth(a, b) {
+    return a.node2.getLayout().y - b.node2.getLayout().y;
+}
+
+function ascendingSourceDepth(a, b) {
+    return a.node1.getLayout().y - b.node1.getLayout().y;
+}
+
+function sum(array, f) {
+    var sum = 0;
+    var len = array.length;
+    var i = -1;
+    while (++i < len) {
+        var value = +f.call(array, array[i], i);
+        if (!isNaN(value)) {
+            sum += value;
+        }
+    }
+    return sum;
+}
+
+function center$1(node) {
+    return node.getLayout().y + node.getLayout().dy / 2;
+}
+
+function ascendingDepth(a, b) {
+    return a.getLayout().y - b.getLayout().y;
+}
+
+function ascending(a, b) {
+    return a - b;
+}
+
+function getEdgeValue(edge) {
+    return edge.getValue();
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual encoding for sankey view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+var sankeyVisual = function (ecModel, payload) {
+    ecModel.eachSeriesByType('sankey', function (seriesModel) {
+        var graph = seriesModel.getGraph();
+        var nodes = graph.nodes;
+        if (nodes.length) {
+            var minValue = Infinity;
+            var maxValue = -Infinity;
+            each$1(nodes, function (node) {
+                var nodeValue = node.getLayout().value;
+                if (nodeValue < minValue) {
+                    minValue = nodeValue;
+                }
+                if (nodeValue > maxValue) {
+                    maxValue = nodeValue;
+                }
+            });
+            
+            each$1(nodes, function (node) {
+                var mapping = new VisualMapping({
+                    type: 'color',
+                    mappingMethod: 'linear',
+                    dataExtent: [minValue, maxValue],
+                    visual: seriesModel.get('color')
+                });
+    
+                var mapValueToColor = mapping.mapValueToVisual(node.getLayout().value);
+                node.setVisual('color', mapValueToColor);
+                // If set itemStyle.normal.color
+                var itemModel = node.getModel();
+                var customColor = itemModel.get('itemStyle.color');
+                if (customColor != null) {
+                    node.setVisual('color', customColor);
+                }
+            });
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(sankeyLayout);
+registerVisual(sankeyVisual);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var seriesModelMixin = {
+
+    /**
+     * @private
+     * @type {string}
+     */
+    _baseAxisDim: null,
+
+    /**
+     * @override
+     */
+    getInitialData: function (option, ecModel) {
+        // When both types of xAxis and yAxis are 'value', layout is
+        // needed to be specified by user. Otherwise, layout can be
+        // judged by which axis is category.
+
+        var ordinalMeta;
+
+        var xAxisModel = ecModel.getComponent('xAxis', this.get('xAxisIndex'));
+        var yAxisModel = ecModel.getComponent('yAxis', this.get('yAxisIndex'));
+        var xAxisType = xAxisModel.get('type');
+        var yAxisType = yAxisModel.get('type');
+        var addOrdinal;
+
+        // FIXME
+        // 考虑时间轴
+
+        if (xAxisType === 'category') {
+            option.layout = 'horizontal';
+            ordinalMeta = xAxisModel.getOrdinalMeta();
+            addOrdinal = true;
+        }
+        else if (yAxisType  === 'category') {
+            option.layout = 'vertical';
+            ordinalMeta = yAxisModel.getOrdinalMeta();
+            addOrdinal = true;
+        }
+        else {
+            option.layout = option.layout || 'horizontal';
+        }
+
+        var coordDims = ['x', 'y'];
+        var baseAxisDimIndex = option.layout === 'horizontal' ? 0 : 1;
+        var baseAxisDim = this._baseAxisDim = coordDims[baseAxisDimIndex];
+        var otherAxisDim = coordDims[1 - baseAxisDimIndex];
+        var axisModels = [xAxisModel, yAxisModel];
+        var baseAxisType = axisModels[baseAxisDimIndex].get('type');
+        var otherAxisType = axisModels[1 - baseAxisDimIndex].get('type');
+        var data = option.data;
+
+        // ??? FIXME make a stage to perform data transfrom.
+        // MUST create a new data, consider setOption({}) again.
+        if (data && addOrdinal) {
+            var newOptionData = [];
+            each$1(data, function (item, index) {
+                var newItem;
+                if (item.value && isArray(item.value)) {
+                    newItem = item.value.slice();
+                    item.value.unshift(index);
+                }
+                else if (isArray(item)) {
+                    newItem = item.slice();
+                    item.unshift(index);
+                }
+                else {
+                    newItem = item;
+                }
+                newOptionData.push(newItem);
+            });
+            option.data = newOptionData;
+        }
+
+        var defaultValueDimensions = this.defaultValueDimensions;
+
+        return createListSimply(
+            this,
+            {
+                coordDimensions: [{
+                    name: baseAxisDim,
+                    type: getDimensionTypeByAxis(baseAxisType),
+                    ordinalMeta: ordinalMeta,
+                    otherDims: {
+                        tooltip: false,
+                        itemName: 0
+                    },
+                    dimsDef: ['base']
+                }, {
+                    name: otherAxisDim,
+                    type: getDimensionTypeByAxis(otherAxisType),
+                    dimsDef: defaultValueDimensions.slice()
+                }],
+                dimensionsCount: defaultValueDimensions.length + 1
+            }
+        );
+    },
+
+    /**
+     * If horizontal, base axis is x, otherwise y.
+     * @override
+     */
+    getBaseAxis: function () {
+        var dim = this._baseAxisDim;
+        return this.ecModel.getComponent(dim + 'Axis', this.get(dim + 'AxisIndex')).axis;
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BoxplotSeries = SeriesModel.extend({
+
+    type: 'series.boxplot',
+
+    dependencies: ['xAxis', 'yAxis', 'grid'],
+
+    // TODO
+    // box width represents group size, so dimension should have 'size'.
+
+    /**
+     * @see <https://en.wikipedia.org/wiki/Box_plot>
+     * The meanings of 'min' and 'max' depend on user,
+     * and echarts do not need to know it.
+     * @readOnly
+     */
+    defaultValueDimensions: [
+        {name: 'min', defaultTooltip: true},
+        {name: 'Q1', defaultTooltip: true},
+        {name: 'median', defaultTooltip: true},
+        {name: 'Q3', defaultTooltip: true},
+        {name: 'max', defaultTooltip: true}
+    ],
+
+    /**
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: null,
+
+    /**
+     * @override
+     */
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        layout: null,               // 'horizontal' or 'vertical'
+        boxWidth: [7, 50],       // [min, max] can be percent of band width.
+
+        itemStyle: {
+            color: '#fff',
+            borderWidth: 1
+        },
+
+        emphasis: {
+            itemStyle: {
+                borderWidth: 2,
+                shadowBlur: 5,
+                shadowOffsetX: 2,
+                shadowOffsetY: 2,
+                shadowColor: 'rgba(0,0,0,0.4)'
+            }
+        },
+
+        animationEasing: 'elasticOut',
+        animationDuration: 800
+    }
+});
+
+mixin(BoxplotSeries, seriesModelMixin, true);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Update common properties
+var NORMAL_ITEM_STYLE_PATH = ['itemStyle'];
+var EMPHASIS_ITEM_STYLE_PATH = ['emphasis', 'itemStyle'];
+
+var BoxplotView = Chart.extend({
+
+    type: 'boxplot',
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var group = this.group;
+        var oldData = this._data;
+
+        // There is no old data only when first rendering or switching from
+        // stream mode to normal mode, where previous elements should be removed.
+        if (!this._data) {
+            group.removeAll();
+        }
+
+        var constDim = seriesModel.get('layout') === 'horizontal' ? 1 : 0;
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                if (data.hasValue(newIdx)) {
+                    var itemLayout = data.getItemLayout(newIdx);
+                    var symbolEl = createNormalBox(itemLayout, data, newIdx, constDim, true);
+                    data.setItemGraphicEl(newIdx, symbolEl);
+                    group.add(symbolEl);
+                }
+            })
+            .update(function (newIdx, oldIdx) {
+                var symbolEl = oldData.getItemGraphicEl(oldIdx);
+
+                // Empty data
+                if (!data.hasValue(newIdx)) {
+                    group.remove(symbolEl);
+                    return;
+                }
+
+                var itemLayout = data.getItemLayout(newIdx);
+                if (!symbolEl) {
+                    symbolEl = createNormalBox(itemLayout, data, newIdx, constDim);
+                }
+                else {
+                    updateNormalBoxData(itemLayout, symbolEl, data, newIdx);
+                }
+
+                group.add(symbolEl);
+
+                data.setItemGraphicEl(newIdx, symbolEl);
+            })
+            .remove(function (oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                el && group.remove(el);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    remove: function (ecModel) {
+        var group = this.group;
+        var data = this._data;
+        this._data = null;
+        data && data.eachItemGraphicEl(function (el) {
+            el && group.remove(el);
+        });
+    },
+
+    dispose: noop
+
+});
+
+
+var BoxPath = Path.extend({
+
+    type: 'boxplotBoxPath',
+
+    shape: {},
+
+    buildPath: function (ctx, shape) {
+        var ends = shape.points;
+
+        var i = 0;
+        ctx.moveTo(ends[i][0], ends[i][1]);
+        i++;
+        for (; i < 4; i++) {
+            ctx.lineTo(ends[i][0], ends[i][1]);
+        }
+        ctx.closePath();
+
+        for (; i < ends.length; i++) {
+            ctx.moveTo(ends[i][0], ends[i][1]);
+            i++;
+            ctx.lineTo(ends[i][0], ends[i][1]);
+        }
+    }
+});
+
+
+function createNormalBox(itemLayout, data, dataIndex, constDim, isInit) {
+    var ends = itemLayout.ends;
+
+    var el = new BoxPath({
+        shape: {
+            points: isInit
+                ? transInit(ends, constDim, itemLayout)
+                : ends
+        }
+    });
+
+    updateNormalBoxData(itemLayout, el, data, dataIndex, isInit);
+
+    return el;
+}
+
+function updateNormalBoxData(itemLayout, el, data, dataIndex, isInit) {
+    var seriesModel = data.hostModel;
+    var updateMethod = graphic[isInit ? 'initProps' : 'updateProps'];
+
+    updateMethod(
+        el,
+        {shape: {points: itemLayout.ends}},
+        seriesModel,
+        dataIndex
+    );
+
+    var itemModel = data.getItemModel(dataIndex);
+    var normalItemStyleModel = itemModel.getModel(NORMAL_ITEM_STYLE_PATH);
+    var borderColor = data.getItemVisual(dataIndex, 'color');
+
+    // Exclude borderColor.
+    var itemStyle = normalItemStyleModel.getItemStyle(['borderColor']);
+    itemStyle.stroke = borderColor;
+    itemStyle.strokeNoScale = true;
+    el.useStyle(itemStyle);
+
+    el.z2 = 100;
+
+    var hoverStyle = itemModel.getModel(EMPHASIS_ITEM_STYLE_PATH).getItemStyle();
+    setHoverStyle(el, hoverStyle);
+}
+
+function transInit(points, dim, itemLayout) {
+    return map(points, function (point) {
+        point = point.slice();
+        point[dim] = itemLayout.initBaseline;
+        return point;
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var borderColorQuery = ['itemStyle', 'borderColor'];
+
+var boxplotVisual = function (ecModel, api) {
+
+    var globalColors = ecModel.get('color');
+
+    ecModel.eachRawSeriesByType('boxplot', function (seriesModel) {
+
+        var defaulColor = globalColors[seriesModel.seriesIndex % globalColors.length];
+        var data = seriesModel.getData();
+
+        data.setVisual({
+            legendSymbol: 'roundRect',
+            // Use name 'color' but not 'borderColor' for legend usage and
+            // visual coding from other component like dataRange.
+            color: seriesModel.get(borderColorQuery) || defaulColor
+        });
+
+        // Only visible series has each data be visual encoded
+        if (!ecModel.isSeriesFiltered(seriesModel)) {
+            data.each(function (idx) {
+                var itemModel = data.getItemModel(idx);
+                data.setItemVisual(
+                    idx,
+                    {color: itemModel.get(borderColorQuery, true)}
+                );
+            });
+        }
+    });
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$13 = each$1;
+
+var boxplotLayout = function (ecModel) {
+
+    var groupResult = groupSeriesByAxis(ecModel);
+
+    each$13(groupResult, function (groupItem) {
+        var seriesModels = groupItem.seriesModels;
+
+        if (!seriesModels.length) {
+            return;
+        }
+
+        calculateBase(groupItem);
+
+        each$13(seriesModels, function (seriesModel, idx) {
+            layoutSingleSeries(
+                seriesModel,
+                groupItem.boxOffsetList[idx],
+                groupItem.boxWidthList[idx]
+            );
+        });
+    });
+};
+
+/**
+ * Group series by axis.
+ */
+function groupSeriesByAxis(ecModel) {
+    var result = [];
+    var axisList = [];
+
+    ecModel.eachSeriesByType('boxplot', function (seriesModel) {
+        var baseAxis = seriesModel.getBaseAxis();
+        var idx = indexOf(axisList, baseAxis);
+
+        if (idx < 0) {
+            idx = axisList.length;
+            axisList[idx] = baseAxis;
+            result[idx] = {axis: baseAxis, seriesModels: []};
+        }
+
+        result[idx].seriesModels.push(seriesModel);
+    });
+
+    return result;
+}
+
+/**
+ * Calculate offset and box width for each series.
+ */
+function calculateBase(groupItem) {
+    var extent;
+    var baseAxis = groupItem.axis;
+    var seriesModels = groupItem.seriesModels;
+    var seriesCount = seriesModels.length;
+
+    var boxWidthList = groupItem.boxWidthList = [];
+    var boxOffsetList = groupItem.boxOffsetList = [];
+    var boundList = [];
+
+    var bandWidth;
+    if (baseAxis.type === 'category') {
+        bandWidth = baseAxis.getBandWidth();
+    }
+    else {
+        var maxDataCount = 0;
+        each$13(seriesModels, function (seriesModel) {
+            maxDataCount = Math.max(maxDataCount, seriesModel.getData().count());
+        });
+        extent = baseAxis.getExtent(),
+        Math.abs(extent[1] - extent[0]) / maxDataCount;
+    }
+
+    each$13(seriesModels, function (seriesModel) {
+        var boxWidthBound = seriesModel.get('boxWidth');
+        if (!isArray(boxWidthBound)) {
+            boxWidthBound = [boxWidthBound, boxWidthBound];
+        }
+        boundList.push([
+            parsePercent$1(boxWidthBound[0], bandWidth) || 0,
+            parsePercent$1(boxWidthBound[1], bandWidth) || 0
+        ]);
+    });
+
+    var availableWidth = bandWidth * 0.8 - 2;
+    var boxGap = availableWidth / seriesCount * 0.3;
+    var boxWidth = (availableWidth - boxGap * (seriesCount - 1)) / seriesCount;
+    var base = boxWidth / 2 - availableWidth / 2;
+
+    each$13(seriesModels, function (seriesModel, idx) {
+        boxOffsetList.push(base);
+        base += boxGap + boxWidth;
+
+        boxWidthList.push(
+            Math.min(Math.max(boxWidth, boundList[idx][0]), boundList[idx][1])
+        );
+    });
+}
+
+/**
+ * Calculate points location for each series.
+ */
+function layoutSingleSeries(seriesModel, offset, boxWidth) {
+    var coordSys = seriesModel.coordinateSystem;
+    var data = seriesModel.getData();
+    var halfWidth = boxWidth / 2;
+    var cDimIdx = seriesModel.get('layout') === 'horizontal' ? 0 : 1;
+    var vDimIdx = 1 - cDimIdx;
+    var coordDims = ['x', 'y'];
+    var cDim = data.mapDimension(coordDims[cDimIdx]);
+    var vDims = data.mapDimension(coordDims[vDimIdx], true);
+
+    if (cDim == null || vDims.length < 5) {
+        return;
+    }
+
+    for (var dataIndex = 0; dataIndex < data.count(); dataIndex++) {
+        var axisDimVal = data.get(cDim, dataIndex);
+
+        var median = getPoint(axisDimVal, vDims[2], dataIndex);
+        var end1 = getPoint(axisDimVal, vDims[0], dataIndex);
+        var end2 = getPoint(axisDimVal, vDims[1], dataIndex);
+        var end4 = getPoint(axisDimVal, vDims[3], dataIndex);
+        var end5 = getPoint(axisDimVal, vDims[4], dataIndex);
+
+        var ends = [];
+        addBodyEnd(ends, end2, 0);
+        addBodyEnd(ends, end4, 1);
+
+        ends.push(end1, end2, end5, end4);
+        layEndLine(ends, end1);
+        layEndLine(ends, end5);
+        layEndLine(ends, median);
+
+        data.setItemLayout(dataIndex, {
+            initBaseline: median[vDimIdx],
+            ends: ends
+        });
+    }
+
+    function getPoint(axisDimVal, dimIdx, dataIndex) {
+        var val = data.get(dimIdx, dataIndex);
+        var p = [];
+        p[cDimIdx] = axisDimVal;
+        p[vDimIdx] = val;
+        var point;
+        if (isNaN(axisDimVal) || isNaN(val)) {
+            point = [NaN, NaN];
+        }
+        else {
+            point = coordSys.dataToPoint(p);
+            point[cDimIdx] += offset;
+        }
+        return point;
+    }
+
+    function addBodyEnd(ends, point, start) {
+        var point1 = point.slice();
+        var point2 = point.slice();
+        point1[cDimIdx] += halfWidth;
+        point2[cDimIdx] -= halfWidth;
+        start
+            ? ends.push(point1, point2)
+            : ends.push(point2, point1);
+    }
+
+    function layEndLine(ends, endCenter) {
+        var from = endCenter.slice();
+        var to = endCenter.slice();
+        from[cDimIdx] -= halfWidth;
+        to[cDimIdx] += halfWidth;
+        ends.push(from, to);
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(boxplotVisual);
+registerLayout(boxplotLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CandlestickSeries = SeriesModel.extend({
+
+    type: 'series.candlestick',
+
+    dependencies: ['xAxis', 'yAxis', 'grid'],
+
+    /**
+     * @readOnly
+     */
+    defaultValueDimensions: [
+        {name: 'open', defaultTooltip: true},
+        {name: 'close', defaultTooltip: true},
+        {name: 'lowest', defaultTooltip: true},
+        {name: 'highest', defaultTooltip: true}
+    ],
+
+    /**
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: null,
+
+    /**
+     * @override
+     */
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        layout: null, // 'horizontal' or 'vertical'
+
+        itemStyle: {
+            color: '#c23531', // 阳线 positive
+            color0: '#314656', // 阴线 negative     '#c23531', '#314656'
+            borderWidth: 1,
+            // FIXME
+            // ec2中使用的是lineStyle.color 和 lineStyle.color0
+            borderColor: '#c23531',
+            borderColor0: '#314656'
+        },
+
+        emphasis: {
+            itemStyle: {
+                borderWidth: 2
+            }
+        },
+
+        barMaxWidth: null,
+        barMinWidth: null,
+        barWidth: null,
+
+        large: true,
+        largeThreshold: 600,
+
+        progressive: 3e3,
+        progressiveThreshold: 1e4,
+        progressiveChunkMode: 'mod',
+
+        animationUpdate: false,
+        animationEasing: 'linear',
+        animationDuration: 300
+    },
+
+    /**
+     * Get dimension for shadow in dataZoom
+     * @return {string} dimension name
+     */
+    getShadowDim: function () {
+        return 'open';
+    },
+
+    brushSelector: function (dataIndex, data, selectors) {
+        var itemLayout = data.getItemLayout(dataIndex);
+        return itemLayout && selectors.rect(itemLayout.brushRect);
+    }
+
+});
+
+mixin(CandlestickSeries, seriesModelMixin, true);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var NORMAL_ITEM_STYLE_PATH$1 = ['itemStyle'];
+var EMPHASIS_ITEM_STYLE_PATH$1 = ['emphasis', 'itemStyle'];
+var SKIP_PROPS = ['color', 'color0', 'borderColor', 'borderColor0'];
+
+
+var CandlestickView = Chart.extend({
+
+    type: 'candlestick',
+
+    render: function (seriesModel, ecModel, api) {
+        this._updateDrawMode(seriesModel);
+
+        this._isLargeDraw
+            ? this._renderLarge(seriesModel)
+            : this._renderNormal(seriesModel);
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this._clear();
+        this._updateDrawMode(seriesModel);
+    },
+
+    incrementalRender: function (params, seriesModel, ecModel, api) {
+        this._isLargeDraw
+             ? this._incrementalRenderLarge(params, seriesModel)
+             : this._incrementalRenderNormal(params, seriesModel);
+    },
+
+    _updateDrawMode: function (seriesModel) {
+        var isLargeDraw = seriesModel.pipelineContext.large;
+        if (this._isLargeDraw == null || isLargeDraw ^ this._isLargeDraw) {
+            this._isLargeDraw = isLargeDraw;
+            this._clear();
+        }
+    },
+
+    _renderNormal: function (seriesModel) {
+        var data = seriesModel.getData();
+        var oldData = this._data;
+        var group = this.group;
+        var isSimpleBox = data.getLayout('isSimpleBox');
+
+        // There is no old data only when first rendering or switching from
+        // stream mode to normal mode, where previous elements should be removed.
+        if (!this._data) {
+            group.removeAll();
+        }
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                if (data.hasValue(newIdx)) {
+                    var el;
+
+                    var itemLayout = data.getItemLayout(newIdx);
+                    el = createNormalBox$1(itemLayout, newIdx, true);
+                    initProps(el, {shape: {points: itemLayout.ends}}, seriesModel, newIdx);
+
+                    setBoxCommon(el, data, newIdx, isSimpleBox);
+
+                    group.add(el);
+                    data.setItemGraphicEl(newIdx, el);
+                }
+            })
+            .update(function (newIdx, oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+
+                // Empty data
+                if (!data.hasValue(newIdx)) {
+                    group.remove(el);
+                    return;
+                }
+
+                var itemLayout = data.getItemLayout(newIdx);
+                if (!el) {
+                    el = createNormalBox$1(itemLayout, newIdx);
+                }
+                else {
+                    updateProps(el, {shape: {points: itemLayout.ends}}, seriesModel, newIdx);
+                }
+
+                setBoxCommon(el, data, newIdx, isSimpleBox);
+
+                group.add(el);
+                data.setItemGraphicEl(newIdx, el);
+            })
+            .remove(function (oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                el && group.remove(el);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    _renderLarge: function (seriesModel) {
+        this._clear();
+        createLarge$1(seriesModel, this.group);
+    },
+
+    _incrementalRenderNormal: function (params, seriesModel) {
+        var data = seriesModel.getData();
+        var isSimpleBox = data.getLayout('isSimpleBox');
+
+        var dataIndex;
+        while ((dataIndex = params.next()) != null) {
+            var el;
+
+            var itemLayout = data.getItemLayout(dataIndex);
+            el = createNormalBox$1(itemLayout, dataIndex);
+            setBoxCommon(el, data, dataIndex, isSimpleBox);
+
+            el.incremental = true;
+            this.group.add(el);
+        }
+    },
+
+    _incrementalRenderLarge: function (params, seriesModel) {
+        createLarge$1(seriesModel, this.group, true);
+    },
+
+    remove: function (ecModel) {
+        this._clear();
+    },
+
+    _clear: function () {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    dispose: noop
+
+});
+
+
+var NormalBoxPath = Path.extend({
+
+    type: 'normalCandlestickBox',
+
+    shape: {},
+
+    buildPath: function (ctx, shape) {
+        var ends = shape.points;
+
+        if (this.__simpleBox) {
+            ctx.moveTo(ends[4][0], ends[4][1]);
+            ctx.lineTo(ends[6][0], ends[6][1]);
+        }
+        else {
+            ctx.moveTo(ends[0][0], ends[0][1]);
+            ctx.lineTo(ends[1][0], ends[1][1]);
+            ctx.lineTo(ends[2][0], ends[2][1]);
+            ctx.lineTo(ends[3][0], ends[3][1]);
+            ctx.closePath();
+
+            ctx.moveTo(ends[4][0], ends[4][1]);
+            ctx.lineTo(ends[5][0], ends[5][1]);
+            ctx.moveTo(ends[6][0], ends[6][1]);
+            ctx.lineTo(ends[7][0], ends[7][1]);
+        }
+    }
+});
+
+function createNormalBox$1(itemLayout, dataIndex, isInit) {
+    var ends = itemLayout.ends;
+    return new NormalBoxPath({
+        shape: {
+            points: isInit
+                ? transInit$1(ends, itemLayout)
+                : ends
+        },
+        z2: 100
+    });
+}
+
+function setBoxCommon(el, data, dataIndex, isSimpleBox) {
+    var itemModel = data.getItemModel(dataIndex);
+    var normalItemStyleModel = itemModel.getModel(NORMAL_ITEM_STYLE_PATH$1);
+    var color = data.getItemVisual(dataIndex, 'color');
+    var borderColor = data.getItemVisual(dataIndex, 'borderColor') || color;
+
+    // Color must be excluded.
+    // Because symbol provide setColor individually to set fill and stroke
+    var itemStyle = normalItemStyleModel.getItemStyle(SKIP_PROPS);
+
+    el.useStyle(itemStyle);
+    el.style.strokeNoScale = true;
+    el.style.fill = color;
+    el.style.stroke = borderColor;
+
+    el.__simpleBox = isSimpleBox;
+
+    var hoverStyle = itemModel.getModel(EMPHASIS_ITEM_STYLE_PATH$1).getItemStyle();
+    setHoverStyle(el, hoverStyle);
+}
+
+function transInit$1(points, itemLayout) {
+    return map(points, function (point) {
+        point = point.slice();
+        point[1] = itemLayout.initBaseline;
+        return point;
+    });
+}
+
+
+
+var LargeBoxPath = Path.extend({
+
+    type: 'largeCandlestickBox',
+
+    shape: {},
+
+    buildPath: function (ctx, shape) {
+        // Drawing lines is more efficient than drawing
+        // a whole line or drawing rects.
+        var points = shape.points;
+        for (var i = 0; i < points.length;) {
+            if (this.__sign === points[i++]) {
+                var x = points[i++];
+                ctx.moveTo(x, points[i++]);
+                ctx.lineTo(x, points[i++]);
+            }
+            else {
+                i += 3;
+            }
+        }
+    }
+});
+
+function createLarge$1(seriesModel, group, incremental) {
+    var data = seriesModel.getData();
+    var largePoints = data.getLayout('largePoints');
+
+    var elP = new LargeBoxPath({
+        shape: {points: largePoints},
+        __sign: 1
+    });
+    group.add(elP);
+    var elN = new LargeBoxPath({
+        shape: {points: largePoints},
+        __sign: -1
+    });
+    group.add(elN);
+
+    setLargeStyle$1(1, elP, seriesModel, data);
+    setLargeStyle$1(-1, elN, seriesModel, data);
+
+    if (incremental) {
+        elP.incremental = true;
+        elN.incremental = true;
+    }
+}
+
+function setLargeStyle$1(sign, el, seriesModel, data) {
+    var suffix = sign > 0 ? 'P' : 'N';
+    var borderColor = data.getVisual('borderColor' + suffix)
+        || data.getVisual('color' + suffix);
+
+    // Color must be excluded.
+    // Because symbol provide setColor individually to set fill and stroke
+    var itemStyle = seriesModel.getModel(NORMAL_ITEM_STYLE_PATH$1).getItemStyle(SKIP_PROPS);
+
+    el.useStyle(itemStyle);
+    el.style.fill = null;
+    el.style.stroke = borderColor;
+    // No different
+    // el.style.lineWidth = .5;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var preprocessor = function (option) {
+    if (!option || !isArray(option.series)) {
+        return;
+    }
+
+    // Translate 'k' to 'candlestick'.
+    each$1(option.series, function (seriesItem) {
+        if (isObject$1(seriesItem) && seriesItem.type === 'k') {
+            seriesItem.type = 'candlestick';
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var positiveBorderColorQuery = ['itemStyle', 'borderColor'];
+var negativeBorderColorQuery = ['itemStyle', 'borderColor0'];
+var positiveColorQuery = ['itemStyle', 'color'];
+var negativeColorQuery = ['itemStyle', 'color0'];
+
+var candlestickVisual = {
+
+    seriesType: 'candlestick',
+
+    plan: createRenderPlanner(),
+
+    // For legend.
+    performRawSeries: true,
+
+    reset: function (seriesModel, ecModel) {
+
+        var data = seriesModel.getData();
+        var isLargeRender = seriesModel.pipelineContext.large;
+
+        data.setVisual({
+            legendSymbol: 'roundRect',
+            colorP: getColor(1, seriesModel),
+            colorN: getColor(-1, seriesModel),
+            borderColorP: getBorderColor(1, seriesModel),
+            borderColorN: getBorderColor(-1, seriesModel)
+        });
+
+        // Only visible series has each data be visual encoded
+        if (ecModel.isSeriesFiltered(seriesModel)) {
+            return;
+        }
+
+        return !isLargeRender && {progress: progress};
+
+
+        function progress(params, data) {
+            var dataIndex;
+            while ((dataIndex = params.next()) != null) {
+                var itemModel = data.getItemModel(dataIndex);
+                var sign = data.getItemLayout(dataIndex).sign;
+
+                data.setItemVisual(
+                    dataIndex,
+                    {
+                        color: getColor(sign, itemModel),
+                        borderColor: getBorderColor(sign, itemModel)
+                    }
+                );
+            }
+        }
+
+        function getColor(sign, model) {
+            return model.get(
+                sign > 0 ? positiveColorQuery : negativeColorQuery
+            );
+        }
+
+        function getBorderColor(sign, model) {
+            return model.get(
+                sign > 0 ? positiveBorderColorQuery : negativeBorderColorQuery
+            );
+        }
+
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var LargeArr$1 = typeof Float32Array !== 'undefined' ? Float32Array : Array;
+
+var candlestickLayout = {
+
+    seriesType: 'candlestick',
+
+    plan: createRenderPlanner(),
+
+    reset: function (seriesModel) {
+
+        var coordSys = seriesModel.coordinateSystem;
+        var data = seriesModel.getData();
+        var candleWidth = calculateCandleWidth(seriesModel, data);
+        var cDimIdx = 0;
+        var vDimIdx = 1;
+        var coordDims = ['x', 'y'];
+        var cDim = data.mapDimension(coordDims[cDimIdx]);
+        var vDims = data.mapDimension(coordDims[vDimIdx], true);
+        var openDim = vDims[0];
+        var closeDim = vDims[1];
+        var lowestDim = vDims[2];
+        var highestDim = vDims[3];
+
+        data.setLayout({
+            candleWidth: candleWidth,
+            // The value is experimented visually.
+            isSimpleBox: candleWidth <= 1.3
+        });
+
+        if (cDim == null || vDims.length < 4) {
+            return;
+        }
+
+        return {
+            progress: seriesModel.pipelineContext.large
+                ? largeProgress : normalProgress
+        };
+
+        function normalProgress(params, data) {
+            var dataIndex;
+            while ((dataIndex = params.next()) != null) {
+
+                var axisDimVal = data.get(cDim, dataIndex);
+                var openVal = data.get(openDim, dataIndex);
+                var closeVal = data.get(closeDim, dataIndex);
+                var lowestVal = data.get(lowestDim, dataIndex);
+                var highestVal = data.get(highestDim, dataIndex);
+
+                var ocLow = Math.min(openVal, closeVal);
+                var ocHigh = Math.max(openVal, closeVal);
+
+                var ocLowPoint = getPoint(ocLow, axisDimVal);
+                var ocHighPoint = getPoint(ocHigh, axisDimVal);
+                var lowestPoint = getPoint(lowestVal, axisDimVal);
+                var highestPoint = getPoint(highestVal, axisDimVal);
+
+                var ends = [];
+                addBodyEnd(ends, ocHighPoint, 0);
+                addBodyEnd(ends, ocLowPoint, 1);
+
+                ends.push(
+                    subPixelOptimizePoint(highestPoint),
+                    subPixelOptimizePoint(ocHighPoint),
+                    subPixelOptimizePoint(lowestPoint),
+                    subPixelOptimizePoint(ocLowPoint)
+                );
+
+                data.setItemLayout(dataIndex, {
+                    sign: getSign(data, dataIndex, openVal, closeVal, closeDim),
+                    initBaseline: openVal > closeVal
+                        ? ocHighPoint[vDimIdx] : ocLowPoint[vDimIdx], // open point.
+                    ends: ends,
+                    brushRect: makeBrushRect(lowestVal, highestVal, axisDimVal)
+                });
+            }
+
+            function getPoint(val, axisDimVal) {
+                var p = [];
+                p[cDimIdx] = axisDimVal;
+                p[vDimIdx] = val;
+                return (isNaN(axisDimVal) || isNaN(val))
+                    ? [NaN, NaN]
+                    : coordSys.dataToPoint(p);
+            }
+
+            function addBodyEnd(ends, point, start) {
+                var point1 = point.slice();
+                var point2 = point.slice();
+
+                point1[cDimIdx] = subPixelOptimize(
+                    point1[cDimIdx] + candleWidth / 2, 1, false
+                );
+                point2[cDimIdx] = subPixelOptimize(
+                    point2[cDimIdx] - candleWidth / 2, 1, true
+                );
+
+                start
+                    ? ends.push(point1, point2)
+                    : ends.push(point2, point1);
+            }
+
+            function makeBrushRect(lowestVal, highestVal, axisDimVal) {
+                var pmin = getPoint(lowestVal, axisDimVal);
+                var pmax = getPoint(highestVal, axisDimVal);
+
+                pmin[cDimIdx] -= candleWidth / 2;
+                pmax[cDimIdx] -= candleWidth / 2;
+
+                return {
+                    x: pmin[0],
+                    y: pmin[1],
+                    width: vDimIdx ? candleWidth : pmax[0] - pmin[0],
+                    height: vDimIdx ? pmax[1] - pmin[1] : candleWidth
+                };
+            }
+
+            function subPixelOptimizePoint(point) {
+                point[cDimIdx] = subPixelOptimize(point[cDimIdx], 1);
+                return point;
+            }
+        }
+
+        function largeProgress(params, data) {
+            // Structure: [sign, x, yhigh, ylow, sign, x, yhigh, ylow, ...]
+            var points = new LargeArr$1(params.count * 5);
+            var offset = 0;
+            var point;
+            var tmpIn = [];
+            var tmpOut = [];
+            var dataIndex;
+
+            while ((dataIndex = params.next()) != null) {
+                var axisDimVal = data.get(cDim, dataIndex);
+                var openVal = data.get(openDim, dataIndex);
+                var closeVal = data.get(closeDim, dataIndex);
+                var lowestVal = data.get(lowestDim, dataIndex);
+                var highestVal = data.get(highestDim, dataIndex);
+
+                if (isNaN(axisDimVal) || isNaN(lowestVal) || isNaN(highestVal)) {
+                    points[offset++] = NaN;
+                    offset += 4;
+                    continue;
+                }
+
+                points[offset++] = getSign(data, dataIndex, openVal, closeVal, closeDim);
+
+                tmpIn[cDimIdx] = axisDimVal;
+
+                tmpIn[vDimIdx] = lowestVal;
+                point = coordSys.dataToPoint(tmpIn, null, tmpOut);
+                points[offset++] = point ? point[0] : NaN;
+                points[offset++] = point ? point[1] : NaN;
+                tmpIn[vDimIdx] = highestVal;
+                point = coordSys.dataToPoint(tmpIn, null, tmpOut);
+                points[offset++] = point ? point[1] : NaN;
+            }
+
+            data.setLayout('largePoints', points);
+        }
+    }
+};
+
+function getSign(data, dataIndex, openVal, closeVal, closeDim) {
+    var sign;
+    if (openVal > closeVal) {
+        sign = -1;
+    }
+    else if (openVal < closeVal) {
+        sign = 1;
+    }
+    else {
+        sign = dataIndex > 0
+            // If close === open, compare with close of last record
+            ? (data.get(closeDim, dataIndex - 1) <= closeVal ? 1 : -1)
+            // No record of previous, set to be positive
+            : 1;
+    }
+
+    return sign;
+}
+
+function calculateCandleWidth(seriesModel, data) {
+    var baseAxis = seriesModel.getBaseAxis();
+    var extent;
+
+    var bandWidth = baseAxis.type === 'category'
+        ? baseAxis.getBandWidth()
+        : (
+            extent = baseAxis.getExtent(),
+            Math.abs(extent[1] - extent[0]) / data.count()
+        );
+
+    var barMaxWidth = parsePercent$1(
+        retrieve2(seriesModel.get('barMaxWidth'), bandWidth),
+        bandWidth
+    );
+    var barMinWidth = parsePercent$1(
+        retrieve2(seriesModel.get('barMinWidth'), 1),
+        bandWidth
+    );
+    var barWidth = seriesModel.get('barWidth');
+
+    return barWidth != null
+        ? parsePercent$1(barWidth, bandWidth)
+        // Put max outer to ensure bar visible in spite of overlap.
+        : Math.max(Math.min(bandWidth / 2, barMaxWidth), barMinWidth);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerPreprocessor(preprocessor);
+registerVisual(candlestickVisual);
+registerLayout(candlestickLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.effectScatter',
+
+    dependencies: ['grid', 'polar'],
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    },
+
+    brushSelector: 'point',
+
+    defaultOption: {
+        coordinateSystem: 'cartesian2d',
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        effectType: 'ripple',
+
+        progressive: 0,
+
+        // When to show the effect, option: 'render'|'emphasis'
+        showEffectOn: 'render',
+
+        // Ripple effect config
+        rippleEffect: {
+            period: 4,
+            // Scale of ripple
+            scale: 2.5,
+            // Brush type can be fill or stroke
+            brushType: 'fill'
+        },
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Polar coordinate system
+        // polarIndex: 0,
+
+        // Geo coordinate system
+        // geoIndex: 0,
+
+        // symbol: null,        // 图形类型
+        symbolSize: 10          // 图形大小，半宽（半径）参数，当图形为方向或菱形则总宽度为symbolSize * 2
+        // symbolRotate: null,  // 图形旋转控制
+
+        // large: false,
+        // Available when large is true
+        // largeThreshold: 2000,
+
+        // itemStyle: {
+        //     opacity: 1
+        // }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Symbol with ripple effect
+ * @module echarts/chart/helper/EffectSymbol
+ */
+
+var EFFECT_RIPPLE_NUMBER = 3;
+
+function normalizeSymbolSize$1(symbolSize) {
+    if (!isArray(symbolSize)) {
+        symbolSize = [+symbolSize, +symbolSize];
+    }
+    return symbolSize;
+}
+
+function updateRipplePath(rippleGroup, effectCfg) {
+    rippleGroup.eachChild(function (ripplePath) {
+        ripplePath.attr({
+            z: effectCfg.z,
+            zlevel: effectCfg.zlevel,
+            style: {
+                stroke: effectCfg.brushType === 'stroke' ? effectCfg.color : null,
+                fill: effectCfg.brushType === 'fill' ? effectCfg.color : null
+            }
+        });
+    });
+}
+/**
+ * @constructor
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @extends {module:zrender/graphic/Group}
+ */
+function EffectSymbol(data, idx) {
+    Group.call(this);
+
+    var symbol = new SymbolClz$1(data, idx);
+    var rippleGroup = new Group();
+    this.add(symbol);
+    this.add(rippleGroup);
+
+    rippleGroup.beforeUpdate = function () {
+        this.attr(symbol.getScale());
+    };
+    this.updateData(data, idx);
+}
+
+var effectSymbolProto = EffectSymbol.prototype;
+
+effectSymbolProto.stopEffectAnimation = function () {
+    this.childAt(1).removeAll();
+};
+
+effectSymbolProto.startEffectAnimation = function (effectCfg) {
+    var symbolType = effectCfg.symbolType;
+    var color = effectCfg.color;
+    var rippleGroup = this.childAt(1);
+
+    for (var i = 0; i < EFFECT_RIPPLE_NUMBER; i++) {
+        // var ripplePath = createSymbol(
+        //     symbolType, -0.5, -0.5, 1, 1, color
+        // );
+        // If width/height are set too small (e.g., set to 1) on ios10
+        // and macOS Sierra, a circle stroke become a rect, no matter what
+        // the scale is set. So we set width/height as 2. See #4136.
+        var ripplePath = createSymbol(
+            symbolType, -1, -1, 2, 2, color
+        );
+        ripplePath.attr({
+            style: {
+                strokeNoScale: true
+            },
+            z2: 99,
+            silent: true,
+            scale: [0.5, 0.5]
+        });
+
+        var delay = -i / EFFECT_RIPPLE_NUMBER * effectCfg.period + effectCfg.effectOffset;
+        // TODO Configurable effectCfg.period
+        ripplePath.animate('', true)
+            .when(effectCfg.period, {
+                scale: [effectCfg.rippleScale / 2, effectCfg.rippleScale / 2]
+            })
+            .delay(delay)
+            .start();
+        ripplePath.animateStyle(true)
+            .when(effectCfg.period, {
+                opacity: 0
+            })
+            .delay(delay)
+            .start();
+
+        rippleGroup.add(ripplePath);
+    }
+
+    updateRipplePath(rippleGroup, effectCfg);
+};
+
+/**
+ * Update effect symbol
+ */
+effectSymbolProto.updateEffectAnimation = function (effectCfg) {
+    var oldEffectCfg = this._effectCfg;
+    var rippleGroup = this.childAt(1);
+
+    // Must reinitialize effect if following configuration changed
+    var DIFFICULT_PROPS = ['symbolType', 'period', 'rippleScale'];
+    for (var i = 0; i < DIFFICULT_PROPS.length; i++) {
+        var propName = DIFFICULT_PROPS[i];
+        if (oldEffectCfg[propName] !== effectCfg[propName]) {
+            this.stopEffectAnimation();
+            this.startEffectAnimation(effectCfg);
+            return;
+        }
+    }
+
+    updateRipplePath(rippleGroup, effectCfg);
+};
+
+/**
+ * Highlight symbol
+ */
+effectSymbolProto.highlight = function () {
+    this.trigger('emphasis');
+};
+
+/**
+ * Downplay symbol
+ */
+effectSymbolProto.downplay = function () {
+    this.trigger('normal');
+};
+
+/**
+ * Update symbol properties
+ * @param  {module:echarts/data/List} data
+ * @param  {number} idx
+ */
+effectSymbolProto.updateData = function (data, idx) {
+    var seriesModel = data.hostModel;
+
+    this.childAt(0).updateData(data, idx);
+
+    var rippleGroup = this.childAt(1);
+    var itemModel = data.getItemModel(idx);
+    var symbolType = data.getItemVisual(idx, 'symbol');
+    var symbolSize = normalizeSymbolSize$1(data.getItemVisual(idx, 'symbolSize'));
+    var color = data.getItemVisual(idx, 'color');
+
+    rippleGroup.attr('scale', symbolSize);
+
+    rippleGroup.traverse(function (ripplePath) {
+        ripplePath.attr({
+            fill: color
+        });
+    });
+
+    var symbolOffset = itemModel.getShallow('symbolOffset');
+    if (symbolOffset) {
+        var pos = rippleGroup.position;
+        pos[0] = parsePercent$1(symbolOffset[0], symbolSize[0]);
+        pos[1] = parsePercent$1(symbolOffset[1], symbolSize[1]);
+    }
+    rippleGroup.rotation = (itemModel.getShallow('symbolRotate') || 0) * Math.PI / 180 || 0;
+
+    var effectCfg = {};
+
+    effectCfg.showEffectOn = seriesModel.get('showEffectOn');
+    effectCfg.rippleScale = itemModel.get('rippleEffect.scale');
+    effectCfg.brushType = itemModel.get('rippleEffect.brushType');
+    effectCfg.period = itemModel.get('rippleEffect.period') * 1000;
+    effectCfg.effectOffset = idx / data.count();
+    effectCfg.z = itemModel.getShallow('z') || 0;
+    effectCfg.zlevel = itemModel.getShallow('zlevel') || 0;
+    effectCfg.symbolType = symbolType;
+    effectCfg.color = color;
+
+    this.off('mouseover').off('mouseout').off('emphasis').off('normal');
+
+    if (effectCfg.showEffectOn === 'render') {
+        this._effectCfg
+            ? this.updateEffectAnimation(effectCfg)
+            : this.startEffectAnimation(effectCfg);
+
+        this._effectCfg = effectCfg;
+    }
+    else {
+        // Not keep old effect config
+        this._effectCfg = null;
+
+        this.stopEffectAnimation();
+        var symbol = this.childAt(0);
+        var onEmphasis = function () {
+            symbol.highlight();
+            if (effectCfg.showEffectOn !== 'render') {
+                this.startEffectAnimation(effectCfg);
+            }
+        };
+        var onNormal = function () {
+            symbol.downplay();
+            if (effectCfg.showEffectOn !== 'render') {
+                this.stopEffectAnimation();
+            }
+        };
+        this.on('mouseover', onEmphasis, this)
+            .on('mouseout', onNormal, this)
+            .on('emphasis', onEmphasis, this)
+            .on('normal', onNormal, this);
+    }
+
+    this._effectCfg = effectCfg;
+};
+
+effectSymbolProto.fadeOut = function (cb) {
+    this.off('mouseover').off('mouseout').off('emphasis').off('normal');
+    cb && cb();
+};
+
+inherits(EffectSymbol, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'effectScatter',
+
+    init: function () {
+        this._symbolDraw = new SymbolDraw(EffectSymbol);
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var effectSymbolDraw = this._symbolDraw;
+        effectSymbolDraw.updateData(data);
+        this.group.add(effectSymbolDraw.group);
+    },
+
+    updateTransform: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        this.group.dirty();
+
+        var res = pointsLayout().reset(seriesModel);
+        if (res.progress) {
+            res.progress({ start: 0, end: data.count() }, data);
+        }
+
+        this._symbolDraw.updateLayout(data);
+    },
+
+    _updateGroupTransform: function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys && coordSys.getRoamTransform) {
+            this.group.transform = clone$2(coordSys.getRoamTransform());
+            this.group.decomposeTransform();
+        }
+    },
+
+    remove: function (ecModel, api) {
+        this._symbolDraw && this._symbolDraw.remove(api);
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(visualSymbol('effectScatter', 'circle'));
+registerLayout(pointsLayout('effectScatter'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var Uint32Arr = typeof Uint32Array === 'undefined' ? Array : Uint32Array;
+var Float64Arr = typeof Float64Array === 'undefined' ? Array : Float64Array;
+
+function compatEc2(seriesOpt) {
+    var data = seriesOpt.data;
+    if (data && data[0] && data[0][0] && data[0][0].coord) {
+        if (__DEV__) {
+            console.warn('Lines data configuration has been changed to'
+                + ' { coords:[[1,2],[2,3]] }');
+        }
+        seriesOpt.data = map(data, function (itemOpt) {
+            var coords = [
+                itemOpt[0].coord, itemOpt[1].coord
+            ];
+            var target = {
+                coords: coords
+            };
+            if (itemOpt[0].name) {
+                target.fromName = itemOpt[0].name;
+            }
+            if (itemOpt[1].name) {
+                target.toName = itemOpt[1].name;
+            }
+            return mergeAll([target, itemOpt[0], itemOpt[1]]);
+        });
+    }
+}
+
+var LinesSeries = SeriesModel.extend({
+
+    type: 'series.lines',
+
+    dependencies: ['grid', 'polar'],
+
+    visualColorAccessPath: 'lineStyle.color',
+
+    init: function (option) {
+        // The input data may be null/undefined.
+        option.data = option.data || [];
+
+        // Not using preprocessor because mergeOption may not have series.type
+        compatEc2(option);
+
+        var result = this._processFlatCoordsArray(option.data);
+        this._flatCoords = result.flatCoords;
+        this._flatCoordsOffset = result.flatCoordsOffset;
+        if (result.flatCoords) {
+            option.data = new Float32Array(result.count);
+        }
+
+        LinesSeries.superApply(this, 'init', arguments);
+    },
+
+    mergeOption: function (option) {
+        // The input data may be null/undefined.
+        option.data = option.data || [];
+
+        compatEc2(option);
+
+        if (option.data) {
+            // Only update when have option data to merge.
+            var result = this._processFlatCoordsArray(option.data);
+            this._flatCoords = result.flatCoords;
+            this._flatCoordsOffset = result.flatCoordsOffset;
+            if (result.flatCoords) {
+                option.data = new Float32Array(result.count);
+            }
+        }
+
+        LinesSeries.superApply(this, 'mergeOption', arguments);
+    },
+
+    appendData: function (params) {
+        var result = this._processFlatCoordsArray(params.data);
+        if (result.flatCoords) {
+            if (!this._flatCoords) {
+                this._flatCoords = result.flatCoords;
+                this._flatCoordsOffset = result.flatCoordsOffset;
+            }
+            else {
+                this._flatCoords = concatArray(this._flatCoords, result.flatCoords);
+                this._flatCoordsOffset = concatArray(this._flatCoordsOffset, result.flatCoordsOffset);
+            }
+            params.data = new Float32Array(result.count);
+        }
+
+        this.getRawData().appendData(params.data);
+    },
+
+    _getCoordsFromItemModel: function (idx) {
+        var itemModel = this.getData().getItemModel(idx);
+        var coords = (itemModel.option instanceof Array)
+            ? itemModel.option : itemModel.getShallow('coords');
+
+        if (__DEV__) {
+            if (!(coords instanceof Array && coords.length > 0 && coords[0] instanceof Array)) {
+                throw new Error('Invalid coords ' + JSON.stringify(coords) + '. Lines must have 2d coords array in data item.');
+            }
+        }
+        return coords;
+    },
+
+    getLineCoordsCount: function (idx) {
+        if (this._flatCoordsOffset) {
+            return this._flatCoordsOffset[idx * 2 + 1];
+        }
+        else {
+            return this._getCoordsFromItemModel(idx).length;
+        }
+    },
+
+    getLineCoords: function (idx, out) {
+        if (this._flatCoordsOffset) {
+            var offset = this._flatCoordsOffset[idx * 2];
+            var len = this._flatCoordsOffset[idx * 2 + 1];
+            for (var i = 0; i < len; i++) {
+                out[i] = out[i] || [];
+                out[i][0] = this._flatCoords[offset + i * 2];
+                out[i][1] = this._flatCoords[offset + i * 2 + 1];
+            }
+            return len;
+        }
+        else {
+            var coords = this._getCoordsFromItemModel(idx);
+            for (var i = 0; i < coords.length; i++) {
+                out[i] = out[i] || [];
+                out[i][0] = coords[i][0];
+                out[i][1] = coords[i][1];
+            }
+            return coords.length;
+        }
+    },
+
+    _processFlatCoordsArray: function (data) {
+        var startOffset = 0;
+        if (this._flatCoords) {
+            startOffset = this._flatCoords.length;
+        }
+        // Stored as a typed array. In format
+        // Points Count(2) | x | y | x | y | Points Count(3) | x |  y | x | y | x | y |
+        if (typeof data[0] === 'number') {
+            var len = data.length;
+            // Store offset and len of each segment
+            var coordsOffsetAndLenStorage = new Uint32Arr(len);
+            var coordsStorage = new Float64Arr(len);
+            var coordsCursor = 0;
+            var offsetCursor = 0;
+            var dataCount = 0;
+            for (var i = 0; i < len;) {
+                dataCount++;
+                var count = data[i++];
+                // Offset
+                coordsOffsetAndLenStorage[offsetCursor++] = coordsCursor + startOffset;
+                // Len
+                coordsOffsetAndLenStorage[offsetCursor++] = count;
+                for (var k = 0; k < count; k++) {
+                    var x = data[i++];
+                    var y = data[i++];
+                    coordsStorage[coordsCursor++] = x;
+                    coordsStorage[coordsCursor++] = y;
+
+                    if (i > len) {
+                        if (__DEV__) {
+                            throw new Error('Invalid data format.');
+                        }
+                    }
+                }
+            }
+
+            return {
+                flatCoordsOffset: new Uint32Array(coordsOffsetAndLenStorage.buffer, 0, offsetCursor),
+                flatCoords: coordsStorage,
+                count: dataCount
+            };
+        }
+
+        return {
+            flatCoordsOffset: null,
+            flatCoords: null,
+            count: data.length
+        };
+    },
+
+    getInitialData: function (option, ecModel) {
+        if (__DEV__) {
+            var CoordSys = CoordinateSystemManager.get(option.coordinateSystem);
+            if (!CoordSys) {
+                throw new Error('Unkown coordinate system ' + option.coordinateSystem);
+            }
+        }
+
+        var lineData = new List(['value'], this);
+        lineData.hasItemOption = false;
+
+        lineData.initData(option.data, [], function (dataItem, dimName, dataIndex, dimIndex) {
+            // dataItem is simply coords
+            if (dataItem instanceof Array) {
+                return NaN;
+            }
+            else {
+                lineData.hasItemOption = true;
+                var value = dataItem.value;
+                if (value != null) {
+                    return value instanceof Array ? value[dimIndex] : value;
+                }
+            }
+        });
+
+        return lineData;
+    },
+
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var itemModel = data.getItemModel(dataIndex);
+        var name = itemModel.get('name');
+        if (name) {
+            return name;
+        }
+        var fromName = itemModel.get('fromName');
+        var toName = itemModel.get('toName');
+        var html = [];
+        fromName != null && html.push(fromName);
+        toName != null && html.push(toName);
+
+        return encodeHTML(html.join(' > '));
+    },
+
+    preventIncremental: function () {
+        return !!this.get('effect.show');
+    },
+
+    getProgressive: function () {
+        var progressive = this.option.progressive;
+        if (progressive == null) {
+            return this.option.large ? 1e4 : this.get('progressive');
+        }
+        return progressive;
+    },
+
+    getProgressiveThreshold: function () {
+        var progressiveThreshold = this.option.progressiveThreshold;
+        if (progressiveThreshold == null) {
+            return this.option.large ? 2e4 : this.get('progressiveThreshold');
+        }
+        return progressiveThreshold;
+    },
+
+    defaultOption: {
+        coordinateSystem: 'geo',
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // Cartesian coordinate system
+        xAxisIndex: 0,
+        yAxisIndex: 0,
+
+        symbol: ['none', 'none'],
+        symbolSize: [10, 10],
+        // Geo coordinate system
+        geoIndex: 0,
+
+        effect: {
+            show: false,
+            period: 4,
+            // Animation delay. support callback
+            // delay: 0,
+            // If move with constant speed px/sec
+            // period will be ignored if this property is > 0,
+            constantSpeed: 0,
+            symbol: 'circle',
+            symbolSize: 3,
+            loop: true,
+            // Length of trail, 0 - 1
+            trailLength: 0.2
+            // Same with lineStyle.color
+            // color
+        },
+
+        large: false,
+        // Available when large is true
+        largeThreshold: 2000,
+
+        // If lines are polyline
+        // polyline not support curveness, label, animation
+        polyline: false,
+
+        label: {
+            show: false,
+            position: 'end'
+            // distance: 5,
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+        },
+
+        lineStyle: {
+            opacity: 0.5
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Provide effect for line
+ * @module echarts/chart/helper/EffectLine
+ */
+
+/**
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ * @alias {module:echarts/chart/helper/Line}
+ */
+function EffectLine(lineData, idx, seriesScope) {
+    Group.call(this);
+
+    this.add(this.createLine(lineData, idx, seriesScope));
+
+    this._updateEffectSymbol(lineData, idx);
+}
+
+var effectLineProto = EffectLine.prototype;
+
+effectLineProto.createLine = function (lineData, idx, seriesScope) {
+    return new Line$1(lineData, idx, seriesScope);
+};
+
+effectLineProto._updateEffectSymbol = function (lineData, idx) {
+    var itemModel = lineData.getItemModel(idx);
+    var effectModel = itemModel.getModel('effect');
+    var size = effectModel.get('symbolSize');
+    var symbolType = effectModel.get('symbol');
+    if (!isArray(size)) {
+        size = [size, size];
+    }
+    var color = effectModel.get('color') || lineData.getItemVisual(idx, 'color');
+    var symbol = this.childAt(1);
+
+    if (this._symbolType !== symbolType) {
+        // Remove previous
+        this.remove(symbol);
+
+        symbol = createSymbol(
+            symbolType, -0.5, -0.5, 1, 1, color
+        );
+        symbol.z2 = 100;
+        symbol.culling = true;
+
+        this.add(symbol);
+    }
+
+    // Symbol may be removed if loop is false
+    if (!symbol) {
+        return;
+    }
+
+    // Shadow color is same with color in default
+    symbol.setStyle('shadowColor', color);
+    symbol.setStyle(effectModel.getItemStyle(['color']));
+
+    symbol.attr('scale', size);
+
+    symbol.setColor(color);
+    symbol.attr('scale', size);
+
+    this._symbolType = symbolType;
+
+    this._updateEffectAnimation(lineData, effectModel, idx);
+};
+
+effectLineProto._updateEffectAnimation = function (lineData, effectModel, idx) {
+
+    var symbol = this.childAt(1);
+    if (!symbol) {
+        return;
+    }
+
+    var self = this;
+
+    var points = lineData.getItemLayout(idx);
+
+    var period = effectModel.get('period') * 1000;
+    var loop = effectModel.get('loop');
+    var constantSpeed = effectModel.get('constantSpeed');
+    var delayExpr = retrieve(effectModel.get('delay'), function (idx) {
+        return idx / lineData.count() * period / 3;
+    });
+    var isDelayFunc = typeof delayExpr === 'function';
+
+    // Ignore when updating
+    symbol.ignore = true;
+
+    this.updateAnimationPoints(symbol, points);
+
+    if (constantSpeed > 0) {
+        period = this.getLineLength(symbol) / constantSpeed * 1000;
+    }
+
+    if (period !== this._period || loop !== this._loop) {
+
+        symbol.stopAnimation();
+
+        var delay = delayExpr;
+        if (isDelayFunc) {
+            delay = delayExpr(idx);
+        }
+        if (symbol.__t > 0) {
+            delay = -period * symbol.__t;
+        }
+        symbol.__t = 0;
+        var animator = symbol.animate('', loop)
+            .when(period, {
+                __t: 1
+            })
+            .delay(delay)
+            .during(function () {
+                self.updateSymbolPosition(symbol);
+            });
+        if (!loop) {
+            animator.done(function () {
+                self.remove(symbol);
+            });
+        }
+        animator.start();
+    }
+
+    this._period = period;
+    this._loop = loop;
+};
+
+effectLineProto.getLineLength = function (symbol) {
+    // Not so accurate
+    return (dist(symbol.__p1, symbol.__cp1)
+        + dist(symbol.__cp1, symbol.__p2));
+};
+
+effectLineProto.updateAnimationPoints = function (symbol, points) {
+    symbol.__p1 = points[0];
+    symbol.__p2 = points[1];
+    symbol.__cp1 = points[2] || [
+        (points[0][0] + points[1][0]) / 2,
+        (points[0][1] + points[1][1]) / 2
+    ];
+};
+
+effectLineProto.updateData = function (lineData, idx, seriesScope) {
+    this.childAt(0).updateData(lineData, idx, seriesScope);
+    this._updateEffectSymbol(lineData, idx);
+};
+
+effectLineProto.updateSymbolPosition = function (symbol) {
+    var p1 = symbol.__p1;
+    var p2 = symbol.__p2;
+    var cp1 = symbol.__cp1;
+    var t = symbol.__t;
+    var pos = symbol.position;
+    var quadraticAt$$1 = quadraticAt;
+    var quadraticDerivativeAt$$1 = quadraticDerivativeAt;
+    pos[0] = quadraticAt$$1(p1[0], cp1[0], p2[0], t);
+    pos[1] = quadraticAt$$1(p1[1], cp1[1], p2[1], t);
+
+    // Tangent
+    var tx = quadraticDerivativeAt$$1(p1[0], cp1[0], p2[0], t);
+    var ty = quadraticDerivativeAt$$1(p1[1], cp1[1], p2[1], t);
+
+    symbol.rotation = -Math.atan2(ty, tx) - Math.PI / 2;
+
+    symbol.ignore = false;
+};
+
+
+effectLineProto.updateLayout = function (lineData, idx) {
+    this.childAt(0).updateLayout(lineData, idx);
+
+    var effectModel = lineData.getItemModel(idx).getModel('effect');
+    this._updateEffectAnimation(lineData, effectModel, idx);
+};
+
+inherits(EffectLine, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/Line
+ */
+
+/**
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ * @alias {module:echarts/chart/helper/Polyline}
+ */
+function Polyline$2(lineData, idx, seriesScope) {
+    Group.call(this);
+
+    this._createPolyline(lineData, idx, seriesScope);
+}
+
+var polylineProto = Polyline$2.prototype;
+
+polylineProto._createPolyline = function (lineData, idx, seriesScope) {
+    // var seriesModel = lineData.hostModel;
+    var points = lineData.getItemLayout(idx);
+
+    var line = new Polyline({
+        shape: {
+            points: points
+        }
+    });
+
+    this.add(line);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+polylineProto.updateData = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+
+    var line = this.childAt(0);
+    var target = {
+        shape: {
+            points: lineData.getItemLayout(idx)
+        }
+    };
+    updateProps(line, target, seriesModel, idx);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+polylineProto._updateCommonStl = function (lineData, idx, seriesScope) {
+    var line = this.childAt(0);
+    var itemModel = lineData.getItemModel(idx);
+
+    var visualColor = lineData.getItemVisual(idx, 'color');
+
+    var lineStyle = seriesScope && seriesScope.lineStyle;
+    var hoverLineStyle = seriesScope && seriesScope.hoverLineStyle;
+
+    if (!seriesScope || lineData.hasItemOption) {
+        lineStyle = itemModel.getModel('lineStyle').getLineStyle();
+        hoverLineStyle = itemModel.getModel('emphasis.lineStyle').getLineStyle();
+    }
+    line.useStyle(defaults(
+        {
+            strokeNoScale: true,
+            fill: 'none',
+            stroke: visualColor
+        },
+        lineStyle
+    ));
+    line.hoverStyle = hoverLineStyle;
+
+    setHoverStyle(this);
+};
+
+polylineProto.updateLayout = function (lineData, idx) {
+    var polyline = this.childAt(0);
+    polyline.setShape('points', lineData.getItemLayout(idx));
+};
+
+inherits(Polyline$2, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Provide effect for line
+ * @module echarts/chart/helper/EffectLine
+ */
+
+/**
+ * @constructor
+ * @extends {module:echarts/chart/helper/EffectLine}
+ * @alias {module:echarts/chart/helper/Polyline}
+ */
+function EffectPolyline(lineData, idx, seriesScope) {
+    EffectLine.call(this, lineData, idx, seriesScope);
+    this._lastFrame = 0;
+    this._lastFramePercent = 0;
+}
+
+var effectPolylineProto = EffectPolyline.prototype;
+
+// Overwrite
+effectPolylineProto.createLine = function (lineData, idx, seriesScope) {
+    return new Polyline$2(lineData, idx, seriesScope);
+};
+
+// Overwrite
+effectPolylineProto.updateAnimationPoints = function (symbol, points) {
+    this._points = points;
+    var accLenArr = [0];
+    var len$$1 = 0;
+    for (var i = 1; i < points.length; i++) {
+        var p1 = points[i - 1];
+        var p2 = points[i];
+        len$$1 += dist(p1, p2);
+        accLenArr.push(len$$1);
+    }
+    if (len$$1 === 0) {
+        return;
+    }
+
+    for (var i = 0; i < accLenArr.length; i++) {
+        accLenArr[i] /= len$$1;
+    }
+    this._offsets = accLenArr;
+    this._length = len$$1;
+};
+
+// Overwrite
+effectPolylineProto.getLineLength = function (symbol) {
+    return this._length;
+};
+
+// Overwrite
+effectPolylineProto.updateSymbolPosition = function (symbol) {
+    var t = symbol.__t;
+    var points = this._points;
+    var offsets = this._offsets;
+    var len$$1 = points.length;
+
+    if (!offsets) {
+        // Has length 0
+        return;
+    }
+
+    var lastFrame = this._lastFrame;
+    var frame;
+
+    if (t < this._lastFramePercent) {
+        // Start from the next frame
+        // PENDING start from lastFrame ?
+        var start = Math.min(lastFrame + 1, len$$1 - 1);
+        for (frame = start; frame >= 0; frame--) {
+            if (offsets[frame] <= t) {
+                break;
+            }
+        }
+        // PENDING really need to do this ?
+        frame = Math.min(frame, len$$1 - 2);
+    }
+    else {
+        for (var frame = lastFrame; frame < len$$1; frame++) {
+            if (offsets[frame] > t) {
+                break;
+            }
+        }
+        frame = Math.min(frame - 1, len$$1 - 2);
+    }
+
+    lerp(
+        symbol.position, points[frame], points[frame + 1],
+        (t - offsets[frame]) / (offsets[frame + 1] - offsets[frame])
+    );
+
+    var tx = points[frame + 1][0] - points[frame][0];
+    var ty = points[frame + 1][1] - points[frame][1];
+    symbol.rotation = -Math.atan2(ty, tx) - Math.PI / 2;
+
+    this._lastFrame = frame;
+    this._lastFramePercent = t;
+
+    symbol.ignore = false;
+};
+
+inherits(EffectPolyline, EffectLine);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Batch by color
+
+var LargeLineShape = extendShape({
+
+    shape: {
+        polyline: false,
+        curveness: 0,
+        segs: []
+    },
+
+    buildPath: function (path, shape) {
+        var segs = shape.segs;
+        var curveness = shape.curveness;
+
+        if (shape.polyline) {
+            for (var i = 0; i < segs.length;) {
+                var count = segs[i++];
+                if (count > 0) {
+                    path.moveTo(segs[i++], segs[i++]);
+                    for (var k = 1; k < count; k++) {
+                        path.lineTo(segs[i++], segs[i++]);
+                    }
+                }
+            }
+        }
+        else {
+            for (var i = 0; i < segs.length;) {
+                var x0 = segs[i++];
+                var y0 = segs[i++];
+                var x1 = segs[i++];
+                var y1 = segs[i++];
+                path.moveTo(x0, y0);
+                if (curveness > 0) {
+                    var x2 = (x0 + x1) / 2 - (y0 - y1) * curveness;
+                    var y2 = (y0 + y1) / 2 - (x1 - x0) * curveness;
+                    path.quadraticCurveTo(x2, y2, x1, y1);
+                }
+                else {
+                    path.lineTo(x1, y1);
+                }
+            }
+        }
+    },
+
+    findDataIndex: function (x, y) {
+
+        var shape = this.shape;
+        var segs = shape.segs;
+        var curveness = shape.curveness;
+
+        if (shape.polyline) {
+            var dataIndex = 0;
+            for (var i = 0; i < segs.length;) {
+                var count = segs[i++];
+                if (count > 0) {
+                    var x0 = segs[i++];
+                    var y0 = segs[i++];
+                    for (var k = 1; k < count; k++) {
+                        var x1 = segs[i++];
+                        var y1 = segs[i++];
+                        if (containStroke$1(x0, y0, x1, y1)) {
+                            return dataIndex;
+                        }
+                    }
+                }
+
+                dataIndex++;
+            }
+        }
+        else {
+            var dataIndex = 0;
+            for (var i = 0; i < segs.length;) {
+                var x0 = segs[i++];
+                var y0 = segs[i++];
+                var x1 = segs[i++];
+                var y1 = segs[i++];
+                if (curveness > 0) {
+                    var x2 = (x0 + x1) / 2 - (y0 - y1) * curveness;
+                    var y2 = (y0 + y1) / 2 - (x1 - x0) * curveness;
+
+                    if (containStroke$3(x0, y0, x2, y2, x1, y1)) {
+                        return dataIndex;
+                    }
+                }
+                else {
+                    if (containStroke$1(x0, y0, x1, y1)) {
+                        return dataIndex;
+                    }
+                }
+
+                dataIndex++;
+            }
+        }
+
+        return -1;
+    }
+});
+
+function LargeLineDraw() {
+    this.group = new Group();
+}
+
+var largeLineProto = LargeLineDraw.prototype;
+
+largeLineProto.isPersistent = function () {
+    return !this._incremental;
+};
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ */
+largeLineProto.updateData = function (data) {
+    this.group.removeAll();
+
+    var lineEl = new LargeLineShape({
+        rectHover: true,
+        cursor: 'default'
+    });
+    lineEl.setShape({
+        segs: data.getLayout('linesPoints')
+    });
+
+    this._setCommon(lineEl, data);
+
+    // Add back
+    this.group.add(lineEl);
+
+    this._incremental = null;
+};
+
+/**
+ * @override
+ */
+largeLineProto.incrementalPrepareUpdate = function (data) {
+    this.group.removeAll();
+
+    this._clearIncremental();
+
+    if (data.count() > 5e5) {
+        if (!this._incremental) {
+            this._incremental = new IncrementalDisplayble({
+                silent: true
+            });
+        }
+        this.group.add(this._incremental);
+    }
+    else {
+        this._incremental = null;
+    }
+};
+
+/**
+ * @override
+ */
+largeLineProto.incrementalUpdate = function (taskParams, data) {
+    var lineEl = new LargeLineShape();
+    lineEl.setShape({
+        segs: data.getLayout('linesPoints')
+    });
+
+    this._setCommon(lineEl, data, !!this._incremental);
+
+    if (!this._incremental) {
+        lineEl.rectHover = true;
+        lineEl.cursor = 'default';
+        lineEl.__startIndex = taskParams.start;
+        this.group.add(lineEl);
+    }
+    else {
+        this._incremental.addDisplayable(lineEl, true);
+    }
+};
+
+/**
+ * @override
+ */
+largeLineProto.remove = function () {
+    this._clearIncremental();
+    this._incremental = null;
+    this.group.removeAll();
+};
+
+largeLineProto._setCommon = function (lineEl, data, isIncremental) {
+    var hostModel = data.hostModel;
+
+    lineEl.setShape({
+        polyline: hostModel.get('polyline'),
+        curveness: hostModel.get('lineStyle.curveness')
+    });
+
+    lineEl.useStyle(
+        hostModel.getModel('lineStyle').getLineStyle()
+    );
+    lineEl.style.strokeNoScale = true;
+
+    var visualColor = data.getVisual('color');
+    if (visualColor) {
+        lineEl.setStyle('stroke', visualColor);
+    }
+    lineEl.setStyle('fill');
+
+    if (!isIncremental) {
+        // Enable tooltip
+        // PENDING May have performance issue when path is extremely large
+        lineEl.seriesIndex = hostModel.seriesIndex;
+        lineEl.on('mousemove', function (e) {
+            lineEl.dataIndex = null;
+            var dataIndex = lineEl.findDataIndex(e.offsetX, e.offsetY);
+            if (dataIndex > 0) {
+                // Provide dataIndex for tooltip
+                lineEl.dataIndex = dataIndex + lineEl.__startIndex;
+            }
+        });
+    }
+};
+
+largeLineProto._clearIncremental = function () {
+    var incremental = this._incremental;
+    if (incremental) {
+        incremental.clearDisplaybles();
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var linesLayout = {
+    seriesType: 'lines',
+
+    plan: createRenderPlanner(),
+
+    reset: function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+        var isPolyline = seriesModel.get('polyline');
+        var isLarge = seriesModel.pipelineContext.large;
+
+        function progress(params, lineData) {
+            var lineCoords = [];
+            if (isLarge) {
+                var points;
+                var segCount = params.end - params.start;
+                if (isPolyline) {
+                    var totalCoordsCount = 0;
+                    for (var i = params.start; i < params.end; i++) {
+                        totalCoordsCount += seriesModel.getLineCoordsCount(i);
+                    }
+                    points = new Float32Array(segCount + totalCoordsCount * 2);
+                }
+                else {
+                    points = new Float32Array(segCount * 4);
+                }
+
+                var offset = 0;
+                var pt = [];
+                for (var i = params.start; i < params.end; i++) {
+                    var len = seriesModel.getLineCoords(i, lineCoords);
+                    if (isPolyline) {
+                        points[offset++] = len;
+                    }
+                    for (var k = 0; k < len; k++) {
+                        pt = coordSys.dataToPoint(lineCoords[k], false, pt);
+                        points[offset++] = pt[0];
+                        points[offset++] = pt[1];
+                    }
+                }
+
+                lineData.setLayout('linesPoints', points);
+            }
+            else {
+                for (var i = params.start; i < params.end; i++) {
+                    var itemModel = lineData.getItemModel(i);
+                    var len = seriesModel.getLineCoords(i, lineCoords);
+
+                    var pts = [];
+                    if (isPolyline) {
+                        for (var j = 0; j < len; j++) {
+                            pts.push(coordSys.dataToPoint(lineCoords[j]));
+                        }
+                    }
+                    else {
+                        pts[0] = coordSys.dataToPoint(lineCoords[0]);
+                        pts[1] = coordSys.dataToPoint(lineCoords[1]);
+
+                        var curveness = itemModel.get('lineStyle.curveness');
+                        if (+curveness) {
+                            pts[2] = [
+                                (pts[0][0] + pts[1][0]) / 2 - (pts[0][1] - pts[1][1]) * curveness,
+                                (pts[0][1] + pts[1][1]) / 2 - (pts[1][0] - pts[0][0]) * curveness
+                            ];
+                        }
+                    }
+                    lineData.setItemLayout(i, pts);
+                }
+            }
+        }
+
+        return { progress: progress };
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'lines',
+
+    init: function () {},
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var lineDraw = this._updateLineDraw(data, seriesModel);
+
+        var zlevel = seriesModel.get('zlevel');
+        var trailLength = seriesModel.get('effect.trailLength');
+
+        var zr = api.getZr();
+        // Avoid the drag cause ghost shadow
+        // FIXME Better way ?
+        // SVG doesn't support
+        var isSvg = zr.painter.getType() === 'svg';
+        if (!isSvg) {
+            zr.painter.getLayer(zlevel).clear(true);
+        }
+        // Config layer with motion blur
+        if (this._lastZlevel != null && !isSvg) {
+            zr.configLayer(this._lastZlevel, {
+                motionBlur: false
+            });
+        }
+        if (this._showEffect(seriesModel) && trailLength) {
+            if (__DEV__) {
+                var notInIndividual = false;
+                ecModel.eachSeries(function (otherSeriesModel) {
+                    if (otherSeriesModel !== seriesModel && otherSeriesModel.get('zlevel') === zlevel) {
+                        notInIndividual = true;
+                    }
+                });
+                notInIndividual && console.warn('Lines with trail effect should have an individual zlevel');
+            }
+
+            if (!isSvg) {
+                zr.configLayer(zlevel, {
+                    motionBlur: true,
+                    lastFrameAlpha: Math.max(Math.min(trailLength / 10 + 0.9, 1), 0)
+                });
+            }
+        }
+
+        lineDraw.updateData(data);
+
+        this._lastZlevel = zlevel;
+
+        this._finished = true;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var lineDraw = this._updateLineDraw(data, seriesModel);
+
+        lineDraw.incrementalPrepareUpdate(data);
+
+        this._clearLayer(api);
+
+        this._finished = false;
+    },
+
+    incrementalRender: function (taskParams, seriesModel, ecModel) {
+        this._lineDraw.incrementalUpdate(taskParams, seriesModel.getData());
+
+        this._finished = taskParams.end === seriesModel.getData().count();
+    },
+
+    updateTransform: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var pipelineContext = seriesModel.pipelineContext;
+
+        if (!this._finished || pipelineContext.large || pipelineContext.progressiveRender) {
+            // TODO Don't have to do update in large mode. Only do it when there are millions of data.
+            return {
+                update: true
+            };
+        }
+        else {
+            // TODO Use same logic with ScatterView.
+            // Manually update layout
+            var res = linesLayout.reset(seriesModel);
+            if (res.progress) {
+                res.progress({ start: 0, end: data.count() }, data);
+            }
+            this._lineDraw.updateLayout();
+            this._clearLayer(api);
+        }
+    },
+
+    _updateLineDraw: function (data, seriesModel) {
+        var lineDraw = this._lineDraw;
+        var hasEffect = this._showEffect(seriesModel);
+        var isPolyline = !!seriesModel.get('polyline');
+        var pipelineContext = seriesModel.pipelineContext;
+        var isLargeDraw = pipelineContext.large;
+
+        if (__DEV__) {
+            if (hasEffect && isLargeDraw) {
+                console.warn('Large lines not support effect');
+            }
+        }
+        if (!lineDraw
+            || hasEffect !== this._hasEffet
+            || isPolyline !== this._isPolyline
+            || isLargeDraw !== this._isLargeDraw
+        ) {
+            if (lineDraw) {
+                lineDraw.remove();
+            }
+            lineDraw = this._lineDraw = isLargeDraw
+                ? new LargeLineDraw()
+                : new LineDraw(
+                    isPolyline
+                        ? (hasEffect ? EffectPolyline : Polyline$2)
+                        : (hasEffect ? EffectLine : Line$1)
+                );
+            this._hasEffet = hasEffect;
+            this._isPolyline = isPolyline;
+            this._isLargeDraw = isLargeDraw;
+            this.group.removeAll();
+        }
+
+        this.group.add(lineDraw.group);
+
+        return lineDraw;
+    },
+
+    _showEffect: function (seriesModel) {
+        return !!seriesModel.get('effect.show');
+    },
+
+    _clearLayer: function (api) {
+        // Not use motion when dragging or zooming
+        var zr = api.getZr();
+        var isSvg = zr.painter.getType() === 'svg';
+        if (!isSvg && this._lastZlevel != null) {
+            zr.painter.getLayer(this._lastZlevel).clear(true);
+        }
+    },
+
+    remove: function (ecModel, api) {
+        this._lineDraw && this._lineDraw.remove();
+        this._lineDraw = null;
+        // Clear motion when lineDraw is removed
+        this._clearLayer(api);
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function normalize$2(a) {
+    if (!(a instanceof Array)) {
+        a = [a, a];
+    }
+    return a;
+}
+
+var opacityQuery = 'lineStyle.opacity'.split('.');
+
+var linesVisual = {
+    seriesType: 'lines',
+    reset: function (seriesModel, ecModel, api) {
+        var symbolType = normalize$2(seriesModel.get('symbol'));
+        var symbolSize = normalize$2(seriesModel.get('symbolSize'));
+        var data = seriesModel.getData();
+
+        data.setVisual('fromSymbol', symbolType && symbolType[0]);
+        data.setVisual('toSymbol', symbolType && symbolType[1]);
+        data.setVisual('fromSymbolSize', symbolSize && symbolSize[0]);
+        data.setVisual('toSymbolSize', symbolSize && symbolSize[1]);
+        data.setVisual('opacity', seriesModel.get(opacityQuery));
+
+        function dataEach(data, idx) {
+            var itemModel = data.getItemModel(idx);
+            var symbolType = normalize$2(itemModel.getShallow('symbol', true));
+            var symbolSize = normalize$2(itemModel.getShallow('symbolSize', true));
+            var opacity = itemModel.get(opacityQuery);
+
+            symbolType[0] && data.setItemVisual(idx, 'fromSymbol', symbolType[0]);
+            symbolType[1] && data.setItemVisual(idx, 'toSymbol', symbolType[1]);
+            symbolSize[0] && data.setItemVisual(idx, 'fromSymbolSize', symbolSize[0]);
+            symbolSize[1] && data.setItemVisual(idx, 'toSymbolSize', symbolSize[1]);
+
+            data.setItemVisual(idx, 'opacity', opacity);
+        }
+
+        return {dataEach: data.hasItemOption ? dataEach : null};
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(linesLayout);
+registerVisual(linesVisual);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+    type: 'series.heatmap',
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this, {
+            generateCoord: 'value'
+        });
+    },
+
+    preventIncremental: function () {
+        var coordSysCreator = CoordinateSystemManager.get(this.get('coordinateSystem'));
+        if (coordSysCreator && coordSysCreator.dimensions) {
+            return coordSysCreator.dimensions[0] === 'lng' && coordSysCreator.dimensions[1] === 'lat';
+        }
+    },
+
+    defaultOption: {
+
+        // Cartesian2D or geo
+        coordinateSystem: 'cartesian2d',
+
+        zlevel: 0,
+
+        z: 2,
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Geo coordinate system
+        geoIndex: 0,
+
+        blurSize: 30,
+
+        pointSize: 20,
+
+        maxOpacity: 1,
+
+        minOpacity: 0
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file defines echarts Heatmap Chart
+ * @author Ovilia (me@zhangwenli.com)
+ * Inspired by https://github.com/mourner/simpleheat
+ *
+ * @module
+ */
+
+var GRADIENT_LEVELS = 256;
+
+/**
+ * Heatmap Chart
+ *
+ * @class
+ */
+function Heatmap() {
+    var canvas = createCanvas();
+    this.canvas = canvas;
+
+    this.blurSize = 30;
+    this.pointSize = 20;
+
+    this.maxOpacity = 1;
+    this.minOpacity = 0;
+
+    this._gradientPixels = {};
+}
+
+Heatmap.prototype = {
+    /**
+     * Renders Heatmap and returns the rendered canvas
+     * @param {Array} data array of data, each has x, y, value
+     * @param {number} width canvas width
+     * @param {number} height canvas height
+     */
+    update: function(data, width, height, normalize, colorFunc, isInRange) {
+        var brush = this._getBrush();
+        var gradientInRange = this._getGradient(data, colorFunc, 'inRange');
+        var gradientOutOfRange = this._getGradient(data, colorFunc, 'outOfRange');
+        var r = this.pointSize + this.blurSize;
+
+        var canvas = this.canvas;
+        var ctx = canvas.getContext('2d');
+        var len = data.length;
+        canvas.width = width;
+        canvas.height = height;
+        for (var i = 0; i < len; ++i) {
+            var p = data[i];
+            var x = p[0];
+            var y = p[1];
+            var value = p[2];
+
+            // calculate alpha using value
+            var alpha = normalize(value);
+
+            // draw with the circle brush with alpha
+            ctx.globalAlpha = alpha;
+            ctx.drawImage(brush, x - r, y - r);
+        }
+
+        if (!canvas.width || !canvas.height) {
+            // Avoid "Uncaught DOMException: Failed to execute 'getImageData' on
+            // 'CanvasRenderingContext2D': The source height is 0."
+            return canvas;
+        }
+
+        // colorize the canvas using alpha value and set with gradient
+        var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+
+        var pixels = imageData.data;
+        var offset = 0;
+        var pixelLen = pixels.length;
+        var minOpacity = this.minOpacity;
+        var maxOpacity = this.maxOpacity;
+        var diffOpacity = maxOpacity - minOpacity;
+
+        while(offset < pixelLen) {
+            var alpha = pixels[offset + 3] / 256;
+            var gradientOffset = Math.floor(alpha * (GRADIENT_LEVELS - 1)) * 4;
+            // Simple optimize to ignore the empty data
+            if (alpha > 0) {
+                var gradient = isInRange(alpha) ? gradientInRange : gradientOutOfRange;
+                // Any alpha > 0 will be mapped to [minOpacity, maxOpacity]
+                alpha > 0 && (alpha = alpha * diffOpacity + minOpacity);
+                pixels[offset++] = gradient[gradientOffset];
+                pixels[offset++] = gradient[gradientOffset + 1];
+                pixels[offset++] = gradient[gradientOffset + 2];
+                pixels[offset++] = gradient[gradientOffset + 3] * alpha * 256;
+            }
+            else {
+                offset += 4;
+            }
+        }
+        ctx.putImageData(imageData, 0, 0);
+
+        return canvas;
+    },
+
+    /**
+     * get canvas of a black circle brush used for canvas to draw later
+     * @private
+     * @returns {Object} circle brush canvas
+     */
+    _getBrush: function() {
+        var brushCanvas = this._brushCanvas || (this._brushCanvas = createCanvas());
+        // set brush size
+        var r = this.pointSize + this.blurSize;
+        var d = r * 2;
+        brushCanvas.width = d;
+        brushCanvas.height = d;
+
+        var ctx = brushCanvas.getContext('2d');
+        ctx.clearRect(0, 0, d, d);
+
+        // in order to render shadow without the distinct circle,
+        // draw the distinct circle in an invisible place,
+        // and use shadowOffset to draw shadow in the center of the canvas
+        ctx.shadowOffsetX = d;
+        ctx.shadowBlur = this.blurSize;
+        // draw the shadow in black, and use alpha and shadow blur to generate
+        // color in color map
+        ctx.shadowColor = '#000';
+
+        // draw circle in the left to the canvas
+        ctx.beginPath();
+        ctx.arc(-r, r, this.pointSize, 0, Math.PI * 2, true);
+        ctx.closePath();
+        ctx.fill();
+        return brushCanvas;
+    },
+
+    /**
+     * get gradient color map
+     * @private
+     */
+    _getGradient: function (data, colorFunc, state) {
+        var gradientPixels = this._gradientPixels;
+        var pixelsSingleState = gradientPixels[state] || (gradientPixels[state] = new Uint8ClampedArray(256 * 4));
+        var color = [0, 0, 0, 0];
+        var off = 0;
+        for (var i = 0; i < 256; i++) {
+            colorFunc[state](i / 255, true, color);
+            pixelsSingleState[off++] = color[0];
+            pixelsSingleState[off++] = color[1];
+            pixelsSingleState[off++] = color[2];
+            pixelsSingleState[off++] = color[3];
+        }
+        return pixelsSingleState;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getIsInPiecewiseRange(dataExtent, pieceList, selected) {
+    var dataSpan = dataExtent[1] - dataExtent[0];
+    pieceList = map(pieceList, function (piece) {
+        return {
+            interval: [
+                (piece.interval[0] - dataExtent[0]) / dataSpan,
+                (piece.interval[1] - dataExtent[0]) / dataSpan
+            ]
+        };
+    });
+    var len = pieceList.length;
+    var lastIndex = 0;
+
+    return function (val) {
+        // Try to find in the location of the last found
+        for (var i = lastIndex; i < len; i++) {
+            var interval = pieceList[i].interval;
+            if (interval[0] <= val && val <= interval[1]) {
+                lastIndex = i;
+                break;
+            }
+        }
+        if (i === len) { // Not found, back interation
+            for (var i = lastIndex - 1; i >= 0; i--) {
+                var interval = pieceList[i].interval;
+                if (interval[0] <= val && val <= interval[1]) {
+                    lastIndex = i;
+                    break;
+                }
+            }
+        }
+        return i >= 0 && i < len && selected[i];
+    };
+}
+
+function getIsInContinuousRange(dataExtent, range) {
+    var dataSpan = dataExtent[1] - dataExtent[0];
+    range = [
+        (range[0] - dataExtent[0]) / dataSpan,
+        (range[1] - dataExtent[0]) / dataSpan
+    ];
+    return function (val) {
+        return val >= range[0] && val <= range[1];
+    };
+}
+
+function isGeoCoordSys(coordSys) {
+    var dimensions = coordSys.dimensions;
+    // Not use coorSys.type === 'geo' because coordSys maybe extended
+    return dimensions[0] === 'lng' && dimensions[1] === 'lat';
+}
+
+extendChartView({
+
+    type: 'heatmap',
+
+    render: function (seriesModel, ecModel, api) {
+        var visualMapOfThisSeries;
+        ecModel.eachComponent('visualMap', function (visualMap) {
+            visualMap.eachTargetSeries(function (targetSeries) {
+                if (targetSeries === seriesModel) {
+                    visualMapOfThisSeries = visualMap;
+                }
+            });
+        });
+
+        if (__DEV__) {
+            if (!visualMapOfThisSeries) {
+                throw new Error('Heatmap must use with visualMap');
+            }
+        }
+
+        this.group.removeAll();
+
+        this._incrementalDisplayable = null;
+
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys.type === 'cartesian2d' || coordSys.type === 'calendar') {
+            this._renderOnCartesianAndCalendar(seriesModel, api, 0, seriesModel.getData().count());
+        }
+        else if (isGeoCoordSys(coordSys)) {
+            this._renderOnGeo(
+                coordSys, seriesModel, visualMapOfThisSeries, api
+            );
+        }
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this.group.removeAll();
+    },
+
+    incrementalRender: function (params, seriesModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys) {
+            this._renderOnCartesianAndCalendar(seriesModel, api, params.start, params.end, true);
+        }
+    },
+
+    _renderOnCartesianAndCalendar: function (seriesModel, api, start, end, incremental) {
+
+        var coordSys = seriesModel.coordinateSystem;
+        var width;
+        var height;
+
+        if (coordSys.type === 'cartesian2d') {
+            var xAxis = coordSys.getAxis('x');
+            var yAxis = coordSys.getAxis('y');
+
+            if (__DEV__) {
+                if (!(xAxis.type === 'category' && yAxis.type === 'category')) {
+                    throw new Error('Heatmap on cartesian must have two category axes');
+                }
+                if (!(xAxis.onBand && yAxis.onBand)) {
+                    throw new Error('Heatmap on cartesian must have two axes with boundaryGap true');
+                }
+            }
+
+            width = xAxis.getBandWidth();
+            height = yAxis.getBandWidth();
+        }
+
+        var group = this.group;
+        var data = seriesModel.getData();
+
+        var itemStyleQuery = 'itemStyle';
+        var hoverItemStyleQuery = 'emphasis.itemStyle';
+        var labelQuery = 'label';
+        var hoverLabelQuery = 'emphasis.label';
+        var style = seriesModel.getModel(itemStyleQuery).getItemStyle(['color']);
+        var hoverStl = seriesModel.getModel(hoverItemStyleQuery).getItemStyle();
+        var labelModel = seriesModel.getModel(labelQuery);
+        var hoverLabelModel = seriesModel.getModel(hoverLabelQuery);
+        var coordSysType = coordSys.type;
+
+
+        var dataDims = coordSysType === 'cartesian2d'
+            ? [
+                data.mapDimension('x'),
+                data.mapDimension('y'),
+                data.mapDimension('value')
+            ]
+            : [
+                data.mapDimension('time'),
+                data.mapDimension('value')
+            ];
+
+        for (var idx = start; idx < end; idx++) {
+            var rect;
+
+            if (coordSysType === 'cartesian2d') {
+                // Ignore empty data
+                if (isNaN(data.get(dataDims[2], idx))) {
+                    continue;
+                }
+
+                var point = coordSys.dataToPoint([
+                    data.get(dataDims[0], idx),
+                    data.get(dataDims[1], idx)
+                ]);
+
+                rect = new Rect({
+                    shape: {
+                        x: point[0] - width / 2,
+                        y: point[1] - height / 2,
+                        width: width,
+                        height: height
+                    },
+                    style: {
+                        fill: data.getItemVisual(idx, 'color'),
+                        opacity: data.getItemVisual(idx, 'opacity')
+                    }
+                });
+            }
+            else {
+                // Ignore empty data
+                if (isNaN(data.get(dataDims[1], idx))) {
+                    continue;
+                }
+
+                rect = new Rect({
+                    z2: 1,
+                    shape: coordSys.dataToRect([data.get(dataDims[0], idx)]).contentShape,
+                    style: {
+                        fill: data.getItemVisual(idx, 'color'),
+                        opacity: data.getItemVisual(idx, 'opacity')
+                    }
+                });
+            }
+
+            var itemModel = data.getItemModel(idx);
+
+            // Optimization for large datset
+            if (data.hasItemOption) {
+                style = itemModel.getModel(itemStyleQuery).getItemStyle(['color']);
+                hoverStl = itemModel.getModel(hoverItemStyleQuery).getItemStyle();
+                labelModel = itemModel.getModel(labelQuery);
+                hoverLabelModel = itemModel.getModel(hoverLabelQuery);
+            }
+
+            var rawValue = seriesModel.getRawValue(idx);
+            var defaultText = '-';
+            if (rawValue && rawValue[2] != null) {
+                defaultText = rawValue[2];
+            }
+
+            setLabelStyle(
+                style, hoverStl, labelModel, hoverLabelModel,
+                {
+                    labelFetcher: seriesModel,
+                    labelDataIndex: idx,
+                    defaultText: defaultText,
+                    isRectText: true
+                }
+            );
+
+            rect.setStyle(style);
+            setHoverStyle(rect, data.hasItemOption ? hoverStl : extend({}, hoverStl));
+
+            rect.incremental = incremental;
+            // PENDING
+            if (incremental) {
+                // Rect must use hover layer if it's incremental.
+                rect.useHoverLayer = true;
+            }
+
+            group.add(rect);
+            data.setItemGraphicEl(idx, rect);
+        }
+    },
+
+    _renderOnGeo: function (geo, seriesModel, visualMapModel, api) {
+        var inRangeVisuals = visualMapModel.targetVisuals.inRange;
+        var outOfRangeVisuals = visualMapModel.targetVisuals.outOfRange;
+        // if (!visualMapping) {
+        //     throw new Error('Data range must have color visuals');
+        // }
+
+        var data = seriesModel.getData();
+        var hmLayer = this._hmLayer || (this._hmLayer || new Heatmap());
+        hmLayer.blurSize = seriesModel.get('blurSize');
+        hmLayer.pointSize = seriesModel.get('pointSize');
+        hmLayer.minOpacity = seriesModel.get('minOpacity');
+        hmLayer.maxOpacity = seriesModel.get('maxOpacity');
+
+        var rect = geo.getViewRect().clone();
+        var roamTransform = geo.getRoamTransform();
+        rect.applyTransform(roamTransform);
+
+        // Clamp on viewport
+        var x = Math.max(rect.x, 0);
+        var y = Math.max(rect.y, 0);
+        var x2 = Math.min(rect.width + rect.x, api.getWidth());
+        var y2 = Math.min(rect.height + rect.y, api.getHeight());
+        var width = x2 - x;
+        var height = y2 - y;
+
+        var dims = [
+            data.mapDimension('lng'),
+            data.mapDimension('lat'),
+            data.mapDimension('value')
+        ];
+
+        var points = data.mapArray(dims, function (lng, lat, value) {
+            var pt = geo.dataToPoint([lng, lat]);
+            pt[0] -= x;
+            pt[1] -= y;
+            pt.push(value);
+            return pt;
+        });
+
+        var dataExtent = visualMapModel.getExtent();
+        var isInRange = visualMapModel.type === 'visualMap.continuous'
+            ? getIsInContinuousRange(dataExtent, visualMapModel.option.range)
+            : getIsInPiecewiseRange(
+                dataExtent, visualMapModel.getPieceList(), visualMapModel.option.selected
+            );
+
+        hmLayer.update(
+            points, width, height,
+            inRangeVisuals.color.getNormalizer(),
+            {
+                inRange: inRangeVisuals.color.getColorMapper(),
+                outOfRange: outOfRangeVisuals.color.getColorMapper()
+            },
+            isInRange
+        );
+        var img = new ZImage({
+            style: {
+                width: width,
+                height: height,
+                x: x,
+                y: y,
+                image: hmLayer.canvas
+            },
+            silent: true
+        });
+        this.group.add(img);
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PictorialBarSeries = BaseBarSeries.extend({
+
+    type: 'series.pictorialBar',
+
+    dependencies: ['grid'],
+
+    defaultOption: {
+        symbol: 'circle',     // Customized bar shape
+        symbolSize: null,     // Can be ['100%', '100%'], null means auto.
+        symbolRotate: null,
+
+        symbolPosition: null, // 'start' or 'end' or 'center', null means auto.
+        symbolOffset: null,
+        symbolMargin: null,   // start margin and end margin. Can be a number or a percent string.
+                                // Auto margin by defualt.
+        symbolRepeat: false,  // false/null/undefined, means no repeat.
+                                // Can be true, means auto calculate repeat times and cut by data.
+                                // Can be a number, specifies repeat times, and do not cut by data.
+                                // Can be 'fixed', means auto calculate repeat times but do not cut by data.
+        symbolRepeatDirection: 'end', // 'end' means from 'start' to 'end'.
+
+        symbolClip: false,
+        symbolBoundingData: null, // Can be 60 or -40 or [-40, 60]
+        symbolPatternSize: 400, // 400 * 400 px
+
+        barGap: '-100%',      // In most case, overlap is needed.
+
+        // z can be set in data item, which is z2 actually.
+
+        // Disable progressive
+        progressive: 0,
+        hoverAnimation: false // Open only when needed.
+    },
+
+    getInitialData: function (option) {
+        // Disable stack.
+        option.stack = null;
+        return PictorialBarSeries.superApply(this, 'getInitialData', arguments);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BAR_BORDER_WIDTH_QUERY$1 = ['itemStyle', 'borderWidth'];
+
+// index: +isHorizontal
+var LAYOUT_ATTRS = [
+    {xy: 'x', wh: 'width', index: 0, posDesc: ['left', 'right']},
+    {xy: 'y', wh: 'height', index: 1, posDesc: ['top', 'bottom']}
+];
+
+var pathForLineWidth = new Circle();
+
+var BarView$1 = extendChartView({
+
+    type: 'pictorialBar',
+
+    render: function (seriesModel, ecModel, api) {
+        var group = this.group;
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+        var isHorizontal = !!baseAxis.isHorizontal();
+        var coordSysRect = cartesian.grid.getRect();
+
+        var opt = {
+            ecSize: {width: api.getWidth(), height: api.getHeight()},
+            seriesModel: seriesModel,
+            coordSys: cartesian,
+            coordSysExtent: [
+                [coordSysRect.x, coordSysRect.x + coordSysRect.width],
+                [coordSysRect.y, coordSysRect.y + coordSysRect.height]
+            ],
+            isHorizontal: isHorizontal,
+            valueDim: LAYOUT_ATTRS[+isHorizontal],
+            categoryDim: LAYOUT_ATTRS[1 - isHorizontal]
+        };
+
+        data.diff(oldData)
+            .add(function (dataIndex) {
+                if (!data.hasValue(dataIndex)) {
+                    return;
+                }
+
+                var itemModel = getItemModel(data, dataIndex);
+                var symbolMeta = getSymbolMeta(data, dataIndex, itemModel, opt);
+
+                var bar = createBar(data, opt, symbolMeta);
+
+                data.setItemGraphicEl(dataIndex, bar);
+                group.add(bar);
+
+                updateCommon$1(bar, opt, symbolMeta);
+            })
+            .update(function (newIndex, oldIndex) {
+                var bar = oldData.getItemGraphicEl(oldIndex);
+
+                if (!data.hasValue(newIndex)) {
+                    group.remove(bar);
+                    return;
+                }
+
+                var itemModel = getItemModel(data, newIndex);
+                var symbolMeta = getSymbolMeta(data, newIndex, itemModel, opt);
+
+                var pictorialShapeStr = getShapeStr(data, symbolMeta);
+                if (bar && pictorialShapeStr !== bar.__pictorialShapeStr) {
+                    group.remove(bar);
+                    data.setItemGraphicEl(newIndex, null);
+                    bar = null;
+                }
+
+                if (bar) {
+                    updateBar(bar, opt, symbolMeta);
+                }
+                else {
+                    bar = createBar(data, opt, symbolMeta, true);
+                }
+
+                data.setItemGraphicEl(newIndex, bar);
+                bar.__pictorialSymbolMeta = symbolMeta;
+                // Add back
+                group.add(bar);
+
+                updateCommon$1(bar, opt, symbolMeta);
+            })
+            .remove(function (dataIndex) {
+                var bar = oldData.getItemGraphicEl(dataIndex);
+                bar && removeBar(oldData, dataIndex, bar.__pictorialSymbolMeta.animationModel, bar);
+            })
+            .execute();
+
+        this._data = data;
+
+        return this.group;
+    },
+
+    dispose: noop,
+
+    remove: function (ecModel, api) {
+        var group = this.group;
+        var data = this._data;
+        if (ecModel.get('animation')) {
+            if (data) {
+                data.eachItemGraphicEl(function (bar) {
+                    removeBar(data, bar.dataIndex, ecModel, bar);
+                });
+            }
+        }
+        else {
+            group.removeAll();
+        }
+    }
+});
+
+
+// Set or calculate default value about symbol, and calculate layout info.
+function getSymbolMeta(data, dataIndex, itemModel, opt) {
+    var layout = data.getItemLayout(dataIndex);
+    var symbolRepeat = itemModel.get('symbolRepeat');
+    var symbolClip = itemModel.get('symbolClip');
+    var symbolPosition = itemModel.get('symbolPosition') || 'start';
+    var symbolRotate = itemModel.get('symbolRotate');
+    var rotation = (symbolRotate || 0) * Math.PI / 180 || 0;
+    var symbolPatternSize = itemModel.get('symbolPatternSize') || 2;
+    var isAnimationEnabled = itemModel.isAnimationEnabled();
+
+    var symbolMeta = {
+        dataIndex: dataIndex,
+        layout: layout,
+        itemModel: itemModel,
+        symbolType: data.getItemVisual(dataIndex, 'symbol') || 'circle',
+        color: data.getItemVisual(dataIndex, 'color'),
+        symbolClip: symbolClip,
+        symbolRepeat: symbolRepeat,
+        symbolRepeatDirection: itemModel.get('symbolRepeatDirection'),
+        symbolPatternSize: symbolPatternSize,
+        rotation: rotation,
+        animationModel: isAnimationEnabled ? itemModel : null,
+        hoverAnimation: isAnimationEnabled && itemModel.get('hoverAnimation'),
+        z2: itemModel.getShallow('z', true) || 0
+    };
+
+    prepareBarLength(itemModel, symbolRepeat, layout, opt, symbolMeta);
+
+    prepareSymbolSize(
+        data, dataIndex, layout, symbolRepeat, symbolClip, symbolMeta.boundingLength,
+        symbolMeta.pxSign, symbolPatternSize, opt, symbolMeta
+    );
+
+    prepareLineWidth(itemModel, symbolMeta.symbolScale, rotation, opt, symbolMeta);
+
+    var symbolSize = symbolMeta.symbolSize;
+    var symbolOffset = itemModel.get('symbolOffset');
+    if (isArray(symbolOffset)) {
+        symbolOffset = [
+            parsePercent$1(symbolOffset[0], symbolSize[0]),
+            parsePercent$1(symbolOffset[1], symbolSize[1])
+        ];
+    }
+
+    prepareLayoutInfo(
+        itemModel, symbolSize, layout, symbolRepeat, symbolClip, symbolOffset,
+        symbolPosition, symbolMeta.valueLineWidth, symbolMeta.boundingLength, symbolMeta.repeatCutLength,
+        opt, symbolMeta
+    );
+
+    return symbolMeta;
+}
+
+// bar length can be negative.
+function prepareBarLength(itemModel, symbolRepeat, layout, opt, output) {
+    var valueDim = opt.valueDim;
+    var symbolBoundingData = itemModel.get('symbolBoundingData');
+    var valueAxis = opt.coordSys.getOtherAxis(opt.coordSys.getBaseAxis());
+    var zeroPx = valueAxis.toGlobalCoord(valueAxis.dataToCoord(0));
+    var pxSignIdx = 1 - +(layout[valueDim.wh] <= 0);
+    var boundingLength;
+
+    if (isArray(symbolBoundingData)) {
+        var symbolBoundingExtent = [
+            convertToCoordOnAxis(valueAxis, symbolBoundingData[0]) - zeroPx,
+            convertToCoordOnAxis(valueAxis, symbolBoundingData[1]) - zeroPx
+        ];
+        symbolBoundingExtent[1] < symbolBoundingExtent[0] && (symbolBoundingExtent.reverse());
+        boundingLength = symbolBoundingExtent[pxSignIdx];
+    }
+    else if (symbolBoundingData != null) {
+        boundingLength = convertToCoordOnAxis(valueAxis, symbolBoundingData) - zeroPx;
+    }
+    else if (symbolRepeat) {
+        boundingLength = opt.coordSysExtent[valueDim.index][pxSignIdx] - zeroPx;
+    }
+    else {
+        boundingLength = layout[valueDim.wh];
+    }
+
+    output.boundingLength = boundingLength;
+
+    if (symbolRepeat) {
+        output.repeatCutLength = layout[valueDim.wh];
+    }
+
+    output.pxSign = boundingLength > 0 ? 1 : boundingLength < 0 ? -1 : 0;
+}
+
+function convertToCoordOnAxis(axis, value) {
+    return axis.toGlobalCoord(axis.dataToCoord(axis.scale.parse(value)));
+}
+
+// Support ['100%', '100%']
+function prepareSymbolSize(
+    data, dataIndex, layout, symbolRepeat, symbolClip, boundingLength,
+    pxSign, symbolPatternSize, opt, output
+) {
+    var valueDim = opt.valueDim;
+    var categoryDim = opt.categoryDim;
+    var categorySize = Math.abs(layout[categoryDim.wh]);
+
+    var symbolSize = data.getItemVisual(dataIndex, 'symbolSize');
+    if (isArray(symbolSize)) {
+        symbolSize = symbolSize.slice();
+    }
+    else {
+        if (symbolSize == null) {
+            symbolSize = '100%';
+        }
+        symbolSize = [symbolSize, symbolSize];
+    }
+
+    // Note: percentage symbolSize (like '100%') do not consider lineWidth, because it is
+    // to complicated to calculate real percent value if considering scaled lineWidth.
+    // So the actual size will bigger than layout size if lineWidth is bigger than zero,
+    // which can be tolerated in pictorial chart.
+
+    symbolSize[categoryDim.index] = parsePercent$1(
+        symbolSize[categoryDim.index],
+        categorySize
+    );
+    symbolSize[valueDim.index] = parsePercent$1(
+        symbolSize[valueDim.index],
+        symbolRepeat ? categorySize : Math.abs(boundingLength)
+    );
+
+    output.symbolSize = symbolSize;
+
+    // If x or y is less than zero, show reversed shape.
+    var symbolScale = output.symbolScale = [
+        symbolSize[0] / symbolPatternSize,
+        symbolSize[1] / symbolPatternSize
+    ];
+    // Follow convention, 'right' and 'top' is the normal scale.
+    symbolScale[valueDim.index] *= (opt.isHorizontal ? -1 : 1) * pxSign;
+}
+
+function prepareLineWidth(itemModel, symbolScale, rotation, opt, output) {
+    // In symbols are drawn with scale, so do not need to care about the case that width
+    // or height are too small. But symbol use strokeNoScale, where acture lineWidth should
+    // be calculated.
+    var valueLineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY$1) || 0;
+
+    if (valueLineWidth) {
+        pathForLineWidth.attr({
+            scale: symbolScale.slice(),
+            rotation: rotation
+        });
+        pathForLineWidth.updateTransform();
+        valueLineWidth /= pathForLineWidth.getLineScale();
+        valueLineWidth *= symbolScale[opt.valueDim.index];
+    }
+
+    output.valueLineWidth = valueLineWidth;
+}
+
+function prepareLayoutInfo(
+    itemModel, symbolSize, layout, symbolRepeat, symbolClip, symbolOffset,
+    symbolPosition, valueLineWidth, boundingLength, repeatCutLength, opt, output
+) {
+    var categoryDim = opt.categoryDim;
+    var valueDim = opt.valueDim;
+    var pxSign = output.pxSign;
+
+    var unitLength = Math.max(symbolSize[valueDim.index] + valueLineWidth, 0);
+    var pathLen = unitLength;
+
+    // Note: rotation will not effect the layout of symbols, because user may
+    // want symbols to rotate on its center, which should not be translated
+    // when rotating.
+
+    if (symbolRepeat) {
+        var absBoundingLength = Math.abs(boundingLength);
+
+        var symbolMargin = retrieve(itemModel.get('symbolMargin'), '15%') + '';
+        var hasEndGap = false;
+        if (symbolMargin.lastIndexOf('!') === symbolMargin.length - 1) {
+            hasEndGap = true;
+            symbolMargin = symbolMargin.slice(0, symbolMargin.length - 1);
+        }
+        symbolMargin = parsePercent$1(symbolMargin, symbolSize[valueDim.index]);
+
+        var uLenWithMargin = Math.max(unitLength + symbolMargin * 2, 0);
+
+        // When symbol margin is less than 0, margin at both ends will be subtracted
+        // to ensure that all of the symbols will not be overflow the given area.
+        var endFix = hasEndGap ? 0 : symbolMargin * 2;
+
+        // Both final repeatTimes and final symbolMargin area calculated based on
+        // boundingLength.
+        var repeatSpecified = isNumeric(symbolRepeat);
+        var repeatTimes = repeatSpecified
+            ? symbolRepeat
+            : toIntTimes((absBoundingLength + endFix) / uLenWithMargin);
+
+        // Adjust calculate margin, to ensure each symbol is displayed
+        // entirely in the given layout area.
+        var mDiff = absBoundingLength - repeatTimes * unitLength;
+        symbolMargin = mDiff / 2 / (hasEndGap ? repeatTimes : repeatTimes - 1);
+        uLenWithMargin = unitLength + symbolMargin * 2;
+        endFix = hasEndGap ? 0 : symbolMargin * 2;
+
+        // Update repeatTimes when not all symbol will be shown.
+        if (!repeatSpecified && symbolRepeat !== 'fixed') {
+            repeatTimes = repeatCutLength
+                ? toIntTimes((Math.abs(repeatCutLength) + endFix) / uLenWithMargin)
+                : 0;
+        }
+
+        pathLen = repeatTimes * uLenWithMargin - endFix;
+        output.repeatTimes = repeatTimes;
+        output.symbolMargin = symbolMargin;
+    }
+
+    var sizeFix = pxSign * (pathLen / 2);
+    var pathPosition = output.pathPosition = [];
+    pathPosition[categoryDim.index] = layout[categoryDim.wh] / 2;
+    pathPosition[valueDim.index] = symbolPosition === 'start'
+        ? sizeFix
+        : symbolPosition === 'end'
+        ? boundingLength - sizeFix
+        : boundingLength / 2; // 'center'
+    if (symbolOffset) {
+        pathPosition[0] += symbolOffset[0];
+        pathPosition[1] += symbolOffset[1];
+    }
+
+    var bundlePosition = output.bundlePosition = [];
+    bundlePosition[categoryDim.index] = layout[categoryDim.xy];
+    bundlePosition[valueDim.index] = layout[valueDim.xy];
+
+    var barRectShape = output.barRectShape = extend({}, layout);
+    barRectShape[valueDim.wh] = pxSign * Math.max(
+        Math.abs(layout[valueDim.wh]), Math.abs(pathPosition[valueDim.index] + sizeFix)
+    );
+    barRectShape[categoryDim.wh] = layout[categoryDim.wh];
+
+    var clipShape = output.clipShape = {};
+    // Consider that symbol may be overflow layout rect.
+    clipShape[categoryDim.xy] = -layout[categoryDim.xy];
+    clipShape[categoryDim.wh] = opt.ecSize[categoryDim.wh];
+    clipShape[valueDim.xy] = 0;
+    clipShape[valueDim.wh] = layout[valueDim.wh];
+}
+
+function createPath(symbolMeta) {
+    var symbolPatternSize = symbolMeta.symbolPatternSize;
+    var path = createSymbol(
+        // Consider texture img, make a big size.
+        symbolMeta.symbolType,
+        -symbolPatternSize / 2,
+        -symbolPatternSize / 2,
+        symbolPatternSize,
+        symbolPatternSize,
+        symbolMeta.color
+    );
+    path.attr({
+        culling: true
+    });
+    path.type !== 'image' && path.setStyle({
+        strokeNoScale: true
+    });
+
+    return path;
+}
+
+function createOrUpdateRepeatSymbols(bar, opt, symbolMeta, isUpdate) {
+    var bundle = bar.__pictorialBundle;
+    var symbolSize = symbolMeta.symbolSize;
+    var valueLineWidth = symbolMeta.valueLineWidth;
+    var pathPosition = symbolMeta.pathPosition;
+    var valueDim = opt.valueDim;
+    var repeatTimes = symbolMeta.repeatTimes || 0;
+
+    var index = 0;
+    var unit = symbolSize[opt.valueDim.index] + valueLineWidth + symbolMeta.symbolMargin * 2;
+
+    eachPath(bar, function (path) {
+        path.__pictorialAnimationIndex = index;
+        path.__pictorialRepeatTimes = repeatTimes;
+        if (index < repeatTimes) {
+            updateAttr(path, null, makeTarget(index), symbolMeta, isUpdate);
+        }
+        else {
+            updateAttr(path, null, {scale: [0, 0]}, symbolMeta, isUpdate, function () {
+                bundle.remove(path);
+            });
+        }
+
+        updateHoverAnimation(path, symbolMeta);
+
+        index++;
+    });
+
+    for (; index < repeatTimes; index++) {
+        var path = createPath(symbolMeta);
+        path.__pictorialAnimationIndex = index;
+        path.__pictorialRepeatTimes = repeatTimes;
+        bundle.add(path);
+
+        var target = makeTarget(index);
+
+        updateAttr(
+            path,
+            {
+                position: target.position,
+                scale: [0, 0]
+            },
+            {
+                scale: target.scale,
+                rotation: target.rotation
+            },
+            symbolMeta,
+            isUpdate
+        );
+
+        // FIXME
+        // If all emphasis/normal through action.
+        path
+            .on('mouseover', onMouseOver)
+            .on('mouseout', onMouseOut);
+
+        updateHoverAnimation(path, symbolMeta);
+    }
+
+    function makeTarget(index) {
+        var position = pathPosition.slice();
+        // (start && pxSign > 0) || (end && pxSign < 0): i = repeatTimes - index
+        // Otherwise: i = index;
+        var pxSign = symbolMeta.pxSign;
+        var i = index;
+        if (symbolMeta.symbolRepeatDirection === 'start' ? pxSign > 0 : pxSign < 0) {
+            i = repeatTimes - 1 - index;
+        }
+        position[valueDim.index] = unit * (i - repeatTimes / 2 + 0.5) + pathPosition[valueDim.index];
+
+        return {
+            position: position,
+            scale: symbolMeta.symbolScale.slice(),
+            rotation: symbolMeta.rotation
+        };
+    }
+
+    function onMouseOver() {
+        eachPath(bar, function (path) {
+            path.trigger('emphasis');
+        });
+    }
+
+    function onMouseOut() {
+        eachPath(bar, function (path) {
+            path.trigger('normal');
+        });
+    }
+}
+
+function createOrUpdateSingleSymbol(bar, opt, symbolMeta, isUpdate) {
+    var bundle = bar.__pictorialBundle;
+    var mainPath = bar.__pictorialMainPath;
+
+    if (!mainPath) {
+        mainPath = bar.__pictorialMainPath = createPath(symbolMeta);
+        bundle.add(mainPath);
+
+        updateAttr(
+            mainPath,
+            {
+                position: symbolMeta.pathPosition.slice(),
+                scale: [0, 0],
+                rotation: symbolMeta.rotation
+            },
+            {
+                scale: symbolMeta.symbolScale.slice()
+            },
+            symbolMeta,
+            isUpdate
+        );
+
+        mainPath
+            .on('mouseover', onMouseOver)
+            .on('mouseout', onMouseOut);
+    }
+    else {
+        updateAttr(
+            mainPath,
+            null,
+            {
+                position: symbolMeta.pathPosition.slice(),
+                scale: symbolMeta.symbolScale.slice(),
+                rotation: symbolMeta.rotation
+            },
+            symbolMeta,
+            isUpdate
+        );
+    }
+
+    updateHoverAnimation(mainPath, symbolMeta);
+
+    function onMouseOver() {
+        this.trigger('emphasis');
+    }
+
+    function onMouseOut() {
+        this.trigger('normal');
+    }
+}
+
+// bar rect is used for label.
+function createOrUpdateBarRect(bar, symbolMeta, isUpdate) {
+    var rectShape = extend({}, symbolMeta.barRectShape);
+
+    var barRect = bar.__pictorialBarRect;
+    if (!barRect) {
+        barRect = bar.__pictorialBarRect = new Rect({
+            z2: 2,
+            shape: rectShape,
+            silent: true,
+            style: {
+                stroke: 'transparent',
+                fill: 'transparent',
+                lineWidth: 0
+            }
+        });
+
+        bar.add(barRect);
+    }
+    else {
+        updateAttr(barRect, null, {shape: rectShape}, symbolMeta, isUpdate);
+    }
+}
+
+function createOrUpdateClip(bar, opt, symbolMeta, isUpdate) {
+    // If not clip, symbol will be remove and rebuilt.
+    if (symbolMeta.symbolClip) {
+        var clipPath = bar.__pictorialClipPath;
+        var clipShape = extend({}, symbolMeta.clipShape);
+        var valueDim = opt.valueDim;
+        var animationModel = symbolMeta.animationModel;
+        var dataIndex = symbolMeta.dataIndex;
+
+        if (clipPath) {
+            updateProps(
+                clipPath, {shape: clipShape}, animationModel, dataIndex
+            );
+        }
+        else {
+            clipShape[valueDim.wh] = 0;
+            clipPath = new Rect({shape: clipShape});
+            bar.__pictorialBundle.setClipPath(clipPath);
+            bar.__pictorialClipPath = clipPath;
+
+            var target = {};
+            target[valueDim.wh] = symbolMeta.clipShape[valueDim.wh];
+
+            graphic[isUpdate ? 'updateProps' : 'initProps'](
+                clipPath, {shape: target}, animationModel, dataIndex
+            );
+        }
+    }
+}
+
+function getItemModel(data, dataIndex) {
+    var itemModel = data.getItemModel(dataIndex);
+    itemModel.getAnimationDelayParams = getAnimationDelayParams;
+    itemModel.isAnimationEnabled = isAnimationEnabled;
+    return itemModel;
+}
+
+function getAnimationDelayParams(path) {
+    // The order is the same as the z-order, see `symbolRepeatDiretion`.
+    return {
+        index: path.__pictorialAnimationIndex,
+        count: path.__pictorialRepeatTimes
+    };
+}
+
+function isAnimationEnabled() {
+    // `animation` prop can be set on itemModel in pictorial bar chart.
+    return this.parentModel.isAnimationEnabled() && !!this.getShallow('animation');
+}
+
+function updateHoverAnimation(path, symbolMeta) {
+    path.off('emphasis').off('normal');
+
+    var scale = symbolMeta.symbolScale.slice();
+
+    symbolMeta.hoverAnimation && path
+        .on('emphasis', function() {
+            this.animateTo({
+                scale: [scale[0] * 1.1, scale[1] * 1.1]
+            }, 400, 'elasticOut');
+        })
+        .on('normal', function() {
+            this.animateTo({
+                scale: scale.slice()
+            }, 400, 'elasticOut');
+        });
+}
+
+function createBar(data, opt, symbolMeta, isUpdate) {
+    // bar is the main element for each data.
+    var bar = new Group();
+    // bundle is used for location and clip.
+    var bundle = new Group();
+    bar.add(bundle);
+    bar.__pictorialBundle = bundle;
+    bundle.attr('position', symbolMeta.bundlePosition.slice());
+
+    if (symbolMeta.symbolRepeat) {
+        createOrUpdateRepeatSymbols(bar, opt, symbolMeta);
+    }
+    else {
+        createOrUpdateSingleSymbol(bar, opt, symbolMeta);
+    }
+
+    createOrUpdateBarRect(bar, symbolMeta, isUpdate);
+
+    createOrUpdateClip(bar, opt, symbolMeta, isUpdate);
+
+    bar.__pictorialShapeStr = getShapeStr(data, symbolMeta);
+    bar.__pictorialSymbolMeta = symbolMeta;
+
+    return bar;
+}
+
+function updateBar(bar, opt, symbolMeta) {
+    var animationModel = symbolMeta.animationModel;
+    var dataIndex = symbolMeta.dataIndex;
+    var bundle = bar.__pictorialBundle;
+
+    updateProps(
+        bundle, {position: symbolMeta.bundlePosition.slice()}, animationModel, dataIndex
+    );
+
+    if (symbolMeta.symbolRepeat) {
+        createOrUpdateRepeatSymbols(bar, opt, symbolMeta, true);
+    }
+    else {
+        createOrUpdateSingleSymbol(bar, opt, symbolMeta, true);
+    }
+
+    createOrUpdateBarRect(bar, symbolMeta, true);
+
+    createOrUpdateClip(bar, opt, symbolMeta, true);
+}
+
+function removeBar(data, dataIndex, animationModel, bar) {
+    // Not show text when animating
+    var labelRect = bar.__pictorialBarRect;
+    labelRect && (labelRect.style.text = null);
+
+    var pathes = [];
+    eachPath(bar, function (path) {
+        pathes.push(path);
+    });
+    bar.__pictorialMainPath && pathes.push(bar.__pictorialMainPath);
+
+    // I do not find proper remove animation for clip yet.
+    bar.__pictorialClipPath && (animationModel = null);
+
+    each$1(pathes, function (path) {
+        updateProps(
+            path, {scale: [0, 0]}, animationModel, dataIndex,
+            function () {
+                bar.parent && bar.parent.remove(bar);
+            }
+        );
+    });
+
+    data.setItemGraphicEl(dataIndex, null);
+}
+
+function getShapeStr(data, symbolMeta) {
+    return [
+        data.getItemVisual(symbolMeta.dataIndex, 'symbol') || 'none',
+        !!symbolMeta.symbolRepeat,
+        !!symbolMeta.symbolClip
+    ].join(':');
+}
+
+function eachPath(bar, cb, context) {
+    // Do not use Group#eachChild, because it do not support remove.
+    each$1(bar.__pictorialBundle.children(), function (el) {
+        el !== bar.__pictorialBarRect && cb.call(context, el);
+    });
+}
+
+function updateAttr(el, immediateAttrs, animationAttrs, symbolMeta, isUpdate, cb) {
+    immediateAttrs && el.attr(immediateAttrs);
+    // when symbolCip used, only clip path has init animation, otherwise it would be weird effect.
+    if (symbolMeta.symbolClip && !isUpdate) {
+        animationAttrs && el.attr(animationAttrs);
+    }
+    else {
+        animationAttrs && graphic[isUpdate ? 'updateProps' : 'initProps'](
+            el, animationAttrs, symbolMeta.animationModel, symbolMeta.dataIndex, cb
+        );
+    }
+}
+
+function updateCommon$1(bar, opt, symbolMeta) {
+    var color = symbolMeta.color;
+    var dataIndex = symbolMeta.dataIndex;
+    var itemModel = symbolMeta.itemModel;
+    // Color must be excluded.
+    // Because symbol provide setColor individually to set fill and stroke
+    var normalStyle = itemModel.getModel('itemStyle').getItemStyle(['color']);
+    var hoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+    var cursorStyle = itemModel.getShallow('cursor');
+
+    eachPath(bar, function (path) {
+        // PENDING setColor should be before setStyle!!!
+        path.setColor(color);
+        path.setStyle(defaults(
+            {
+                fill: color,
+                opacity: symbolMeta.opacity
+            },
+            normalStyle
+        ));
+        setHoverStyle(path, hoverStyle);
+
+        cursorStyle && (path.cursor = cursorStyle);
+        path.z2 = symbolMeta.z2;
+    });
+
+    var barRectHoverStyle = {};
+    var barPositionOutside = opt.valueDim.posDesc[+(symbolMeta.boundingLength > 0)];
+    var barRect = bar.__pictorialBarRect;
+
+    setLabel(
+        barRect.style, barRectHoverStyle, itemModel,
+        color, opt.seriesModel, dataIndex, barPositionOutside
+    );
+
+    setHoverStyle(barRect, barRectHoverStyle);
+}
+
+function toIntTimes(times) {
+    var roundedTimes = Math.round(times);
+    // Escapse accurate error
+    return Math.abs(times - roundedTimes) < 1e-4
+        ? roundedTimes
+        : Math.ceil(times);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// In case developer forget to include grid component
+registerLayout(curry(
+    layout, 'pictorialBar'
+));
+registerVisual(visualSymbol('pictorialBar', 'roundRect'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @constructor  module:echarts/coord/single/SingleAxis
+ * @extends {module:echarts/coord/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ * @param {string} position
+ */
+var SingleAxis = function (dim, scale, coordExtent, axisType, position) {
+
+    Axis.call(this, dim, scale, coordExtent);
+
+    /**
+     * Axis type
+     * - 'category'
+     * - 'value'
+     * - 'time'
+     * - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * Axis position
+     *  - 'top'
+     *  - 'bottom'
+     *  - 'left'
+     *  - 'right'
+     *  @type {string}
+     */
+    this.position = position || 'bottom';
+
+    /**
+     * Axis orient
+     *  - 'horizontal'
+     *  - 'vertical'
+     * @type {[type]}
+     */
+    this.orient = null;
+
+};
+
+SingleAxis.prototype = {
+
+    constructor: SingleAxis,
+
+    /**
+     * Axis model
+     * @type {module:echarts/coord/single/AxisModel}
+     */
+    model: null,
+
+    /**
+     * Judge the orient of the axis.
+     * @return {boolean}
+     */
+    isHorizontal: function () {
+        var position = this.position;
+        return position === 'top' || position === 'bottom';
+
+    },
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.coordinateSystem.pointToData(point, clamp)[0];
+    },
+
+    /**
+     * Convert the local coord(processed by dataToCoord())
+     * to global coord(concrete pixel coord).
+     * designated by module:echarts/coord/single/Single.
+     * @type {Function}
+     */
+    toGlobalCoord: null,
+
+    /**
+     * Convert the global coord to local coord.
+     * designated by module:echarts/coord/single/Single.
+     * @type {Function}
+     */
+    toLocalCoord: null
+
+};
+
+inherits(SingleAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Single coordinates system.
+ */
+
+/**
+ * Create a single coordinates system.
+ *
+ * @param {module:echarts/coord/single/AxisModel} axisModel
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function Single(axisModel, ecModel, api) {
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.dimension = 'single';
+
+    /**
+     * Add it just for draw tooltip.
+     *
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    this.dimensions = ['single'];
+
+    /**
+     * @private
+     * @type {module:echarts/coord/single/SingleAxis}.
+     */
+    this._axis = null;
+
+    /**
+     * @private
+     * @type {module:zrender/core/BoundingRect}
+     */
+    this._rect;
+
+    this._init(axisModel, ecModel, api);
+
+    /**
+     * @type {module:echarts/coord/single/AxisModel}
+     */
+    this.model = axisModel;
+}
+
+Single.prototype = {
+
+    type: 'singleAxis',
+
+    axisPointerEnabled: true,
+
+    constructor: Single,
+
+    /**
+     * Initialize single coordinate system.
+     *
+     * @param  {module:echarts/coord/single/AxisModel} axisModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @private
+     */
+    _init: function (axisModel, ecModel, api) {
+
+        var dim = this.dimension;
+
+        var axis = new SingleAxis(
+            dim,
+            createScaleByModel(axisModel),
+            [0, 0],
+            axisModel.get('type'),
+            axisModel.get('position')
+        );
+
+        var isCategory = axis.type === 'category';
+        axis.onBand = isCategory && axisModel.get('boundaryGap');
+        axis.inverse = axisModel.get('inverse');
+        axis.orient = axisModel.get('orient');
+
+        axisModel.axis = axis;
+        axis.model = axisModel;
+        axis.coordinateSystem = this;
+        this._axis = axis;
+    },
+
+    /**
+     * Update axis scale after data processed
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    update: function (ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            if (seriesModel.coordinateSystem === this) {
+                var data = seriesModel.getData();
+                each$1(data.mapDimension(this.dimension, true), function (dim) {
+                    this._axis.scale.unionExtentFromData(data, dim);
+                }, this);
+                niceScaleExtent(this._axis.scale, this._axis.model);
+            }
+        }, this);
+    },
+
+    /**
+     * Resize the single coordinate system.
+     *
+     * @param  {module:echarts/coord/single/AxisModel} axisModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    resize: function (axisModel, api) {
+        this._rect = getLayoutRect(
+            {
+                left: axisModel.get('left'),
+                top: axisModel.get('top'),
+                right: axisModel.get('right'),
+                bottom: axisModel.get('bottom'),
+                width: axisModel.get('width'),
+                height: axisModel.get('height')
+            },
+            {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }
+        );
+
+        this._adjustAxis();
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getRect: function () {
+        return this._rect;
+    },
+
+    /**
+     * @private
+     */
+    _adjustAxis: function () {
+
+        var rect = this._rect;
+        var axis = this._axis;
+
+        var isHorizontal = axis.isHorizontal();
+        var extent = isHorizontal ? [0, rect.width] : [0, rect.height];
+        var idx =  axis.reverse ? 1 : 0;
+
+        axis.setExtent(extent[idx], extent[1 - idx]);
+
+        this._updateAxisTransform(axis, isHorizontal ? rect.x : rect.y);
+
+    },
+
+    /**
+     * @param  {module:echarts/coord/single/SingleAxis} axis
+     * @param  {number} coordBase
+     */
+    _updateAxisTransform: function (axis, coordBase) {
+
+        var axisExtent = axis.getExtent();
+        var extentSum = axisExtent[0] + axisExtent[1];
+        var isHorizontal = axis.isHorizontal();
+
+        axis.toGlobalCoord = isHorizontal
+            ? function (coord) {
+                return coord + coordBase;
+            }
+            : function (coord) {
+                return extentSum - coord + coordBase;
+            };
+
+        axis.toLocalCoord = isHorizontal
+            ? function (coord) {
+                return coord - coordBase;
+            }
+            : function (coord) {
+                return extentSum - coord + coordBase;
+            };
+    },
+
+    /**
+     * Get axis.
+     *
+     * @return {module:echarts/coord/single/SingleAxis}
+     */
+    getAxis: function () {
+        return this._axis;
+    },
+
+    /**
+     * Get axis, add it just for draw tooltip.
+     *
+     * @return {[type]} [description]
+     */
+    getBaseAxis: function () {
+        return this._axis;
+    },
+
+    /**
+     * @return {Array.<module:echarts/coord/Axis>}
+     */
+    getAxes: function () {
+        return [this._axis];
+    },
+
+    /**
+     * @return {Object} {baseAxes: [], otherAxes: []}
+     */
+    getTooltipAxes: function () {
+        return {baseAxes: [this.getAxis()]};
+    },
+
+    /**
+     * If contain point.
+     *
+     * @param  {Array.<number>} point
+     * @return {boolean}
+     */
+    containPoint: function (point) {
+        var rect = this.getRect();
+        var axis = this.getAxis();
+        var orient = axis.orient;
+        if (orient === 'horizontal') {
+            return axis.contain(axis.toLocalCoord(point[0]))
+            && (point[1] >= rect.y && point[1] <= (rect.y + rect.height));
+        }
+        else {
+            return axis.contain(axis.toLocalCoord(point[1]))
+            && (point[0] >= rect.y && point[0] <= (rect.y + rect.height));
+        }
+    },
+
+    /**
+     * @param {Array.<number>} point
+     * @return {Array.<number>}
+     */
+    pointToData: function (point) {
+        var axis = this.getAxis();
+        return [axis.coordToData(axis.toLocalCoord(
+            point[axis.orient === 'horizontal' ? 0 : 1]
+        ))];
+    },
+
+    /**
+     * Convert the series data to concrete point.
+     *
+     * @param  {number|Array.<number>} val
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (val) {
+        var axis = this.getAxis();
+        var rect = this.getRect();
+        var pt = [];
+        var idx = axis.orient === 'horizontal' ? 0 : 1;
+
+        if (val instanceof Array) {
+            val = val[0];
+        }
+
+        pt[idx] = axis.toGlobalCoord(axis.dataToCoord(+val));
+        pt[1 - idx] = idx === 0 ? (rect.y + rect.height / 2) : (rect.x + rect.width / 2);
+        return pt;
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Single coordinate system creator.
+ */
+
+/**
+ * Create single coordinate system and inject it into seriesModel.
+ *
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ * @return {Array.<module:echarts/coord/single/Single>}
+ */
+function create$3(ecModel, api) {
+    var singles = [];
+
+    ecModel.eachComponent('singleAxis', function(axisModel, idx) {
+
+        var single = new Single(axisModel, ecModel, api);
+        single.name = 'single_' + idx;
+        single.resize(axisModel, api);
+        axisModel.coordinateSystem = single;
+        singles.push(single);
+
+    });
+
+    ecModel.eachSeries(function (seriesModel) {
+        if (seriesModel.get('coordinateSystem') === 'singleAxis') {
+            var singleAxisModel = ecModel.queryComponents({
+                mainType: 'singleAxis',
+                index: seriesModel.get('singleAxisIndex'),
+                id: seriesModel.get('singleAxisId')
+            })[0];
+            seriesModel.coordinateSystem = singleAxisModel && singleAxisModel.coordinateSystem;
+        }
+    });
+
+    return singles;
+}
+
+CoordinateSystemManager.register('single', {
+    create: create$3,
+    dimensions: Single.prototype.dimensions
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} opt {labelInside}
+ * @return {Object} {
+ *  position, rotation, labelDirection, labelOffset,
+ *  tickDirection, labelRotate, z2
+ * }
+ */
+function layout$2(axisModel, opt) {
+    opt = opt || {};
+    var single = axisModel.coordinateSystem;
+    var axis = axisModel.axis;
+    var layout = {};
+
+    var axisPosition = axis.position;
+    var orient = axis.orient;
+
+    var rect = single.getRect();
+    var rectBound = [rect.x, rect.x + rect.width, rect.y, rect.y + rect.height];
+
+    var positionMap = {
+        horizontal: {top: rectBound[2], bottom: rectBound[3]},
+        vertical: {left: rectBound[0], right: rectBound[1]}
+    };
+
+    layout.position = [
+        orient === 'vertical'
+            ? positionMap.vertical[axisPosition]
+            : rectBound[0],
+        orient === 'horizontal'
+            ? positionMap.horizontal[axisPosition]
+            : rectBound[3]
+    ];
+
+    var r = {horizontal: 0, vertical: 1};
+    layout.rotation = Math.PI / 2 * r[orient];
+
+    var directionMap = {top: -1, bottom: 1, right: 1, left: -1};
+
+    layout.labelDirection = layout.tickDirection
+        = layout.nameDirection
+        = directionMap[axisPosition];
+
+    if (axisModel.get('axisTick.inside')) {
+        layout.tickDirection = -layout.tickDirection;
+    }
+
+    if (retrieve(opt.labelInside, axisModel.get('axisLabel.inside'))) {
+        layout.labelDirection = -layout.labelDirection;
+    }
+
+    var labelRotation = opt.rotate;
+    labelRotation == null && (labelRotation = axisModel.get('axisLabel.rotate'));
+    layout.labelRotation = axisPosition === 'top' ? -labelRotation : labelRotation;
+
+    layout.z2 = 1;
+
+    return layout;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var axisBuilderAttrs$2 = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+
+var selfBuilderAttr = 'splitLine';
+
+var SingleAxisView = AxisView.extend({
+
+    type: 'singleAxis',
+
+    axisPointerClass: 'SingleAxisPointer',
+
+    render: function (axisModel, ecModel, api, payload) {
+
+        var group = this.group;
+
+        group.removeAll();
+
+        var layout =  layout$2(axisModel);
+
+        var axisBuilder = new AxisBuilder(axisModel, layout);
+
+        each$1(axisBuilderAttrs$2, axisBuilder.add, axisBuilder);
+
+        group.add(axisBuilder.getGroup());
+
+        if (axisModel.get(selfBuilderAttr + '.show')) {
+            this['_' + selfBuilderAttr](axisModel);
+        }
+
+        SingleAxisView.superCall(this, 'render', axisModel, ecModel, api, payload);
+    },
+
+    _splitLine: function(axisModel) {
+        var axis = axisModel.axis;
+
+        if (axis.scale.isBlank()) {
+            return;
+        }
+
+        var splitLineModel = axisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineWidth = lineStyleModel.get('width');
+        var lineColors = lineStyleModel.get('color');
+
+        lineColors = lineColors instanceof Array ? lineColors : [lineColors];
+
+        var gridRect = axisModel.coordinateSystem.getRect();
+        var isHorizontal = axis.isHorizontal();
+
+        var splitLines = [];
+        var lineCount = 0;
+
+        var ticksCoords = axis.getTicksCoords({
+            tickModel: splitLineModel
+        });
+
+        var p1 = [];
+        var p2 = [];
+
+        for (var i = 0; i < ticksCoords.length; ++i) {
+            var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+            if (isHorizontal) {
+                p1[0] = tickCoord;
+                p1[1] = gridRect.y;
+                p2[0] = tickCoord;
+                p2[1] = gridRect.y + gridRect.height;
+            }
+            else {
+                p1[0] = gridRect.x;
+                p1[1] = tickCoord;
+                p2[0] = gridRect.x + gridRect.width;
+                p2[1] = tickCoord;
+            }
+            var colorIndex = (lineCount++) % lineColors.length;
+            splitLines[colorIndex] = splitLines[colorIndex] || [];
+            splitLines[colorIndex].push(new Line(
+                subPixelOptimizeLine({
+                    shape: {
+                        x1: p1[0],
+                        y1: p1[1],
+                        x2: p2[0],
+                        y2: p2[1]
+                    },
+                    style: {
+                        lineWidth: lineWidth
+                    },
+                    silent: true
+                })));
+        }
+
+        for (var i = 0; i < splitLines.length; ++i) {
+            this.group.add(mergePath(splitLines[i], {
+                style: {
+                    stroke: lineColors[i % lineColors.length],
+                    lineDash: lineStyleModel.getLineDash(lineWidth),
+                    lineWidth: lineWidth
+                },
+                silent: true
+            }));
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisModel$4 = ComponentModel.extend({
+
+    type: 'singleAxis',
+
+    layoutMode: 'box',
+
+    /**
+     * @type {module:echarts/coord/single/SingleAxis}
+     */
+    axis: null,
+
+    /**
+     * @type {module:echarts/coord/single/Single}
+     */
+    coordinateSystem: null,
+
+    /**
+     * @override
+     */
+    getCoordSysModel: function () {
+        return this;
+    }
+
+});
+
+var defaultOption$2 = {
+
+    left: '5%',
+    top: '5%',
+    right: '5%',
+    bottom: '5%',
+
+    type: 'value',
+
+    position: 'bottom',
+
+    orient: 'horizontal',
+
+    axisLine: {
+        show: true,
+        lineStyle: {
+            width: 2,
+            type: 'solid'
+        }
+    },
+
+    // Single coordinate system and single axis is the,
+    // which is used as the parent tooltip model.
+    // same model, so we set default tooltip show as true.
+    tooltip: {
+        show: true
+    },
+
+    axisTick: {
+        show: true,
+        length: 6,
+        lineStyle: {
+            width: 2
+        }
+    },
+
+    axisLabel: {
+        show: true,
+        interval: 'auto'
+    },
+
+    splitLine: {
+        show: true,
+        lineStyle: {
+            type: 'dashed',
+            opacity: 0.2
+        }
+    }
+};
+
+function getAxisType$2(axisName, option) {
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+merge(AxisModel$4.prototype, axisModelCommonMixin);
+
+axisModelCreator('single', AxisModel$4, getAxisType$2, defaultOption$2);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} finder contains {seriesIndex, dataIndex, dataIndexInside}
+ * @param {module:echarts/model/Global} ecModel
+ * @return {Object} {point: [x, y], el: ...} point Will not be null.
+ */
+var findPointFromSeries = function (finder, ecModel) {
+    var point = [];
+    var seriesIndex = finder.seriesIndex;
+    var seriesModel;
+    if (seriesIndex == null || !(
+        seriesModel = ecModel.getSeriesByIndex(seriesIndex)
+    )) {
+        return {point: []};
+    }
+
+    var data = seriesModel.getData();
+    var dataIndex = queryDataIndex(data, finder);
+    if (dataIndex == null || dataIndex < 0 || isArray(dataIndex)) {
+        return {point: []};
+    }
+
+    var el = data.getItemGraphicEl(dataIndex);
+    var coordSys = seriesModel.coordinateSystem;
+
+    if (seriesModel.getTooltipPosition) {
+        point = seriesModel.getTooltipPosition(dataIndex) || [];
+    }
+    else if (coordSys && coordSys.dataToPoint) {
+        point = coordSys.dataToPoint(
+            data.getValues(
+                map(coordSys.dimensions, function (dim) {
+                    return data.mapDimension(dim);
+                }), dataIndex, true
+            )
+        ) || [];
+    }
+    else if (el) {
+        // Use graphic bounding rect
+        var rect = el.getBoundingRect().clone();
+        rect.applyTransform(el.transform);
+        point = [
+            rect.x + rect.width / 2,
+            rect.y + rect.height / 2
+        ];
+    }
+
+    return {point: point, el: el};
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$14 = each$1;
+var curry$3 = curry;
+var inner$7 = makeInner();
+
+/**
+ * Basic logic: check all axis, if they do not demand show/highlight,
+ * then hide/downplay them.
+ *
+ * @param {Object} coordSysAxesInfo
+ * @param {Object} payload
+ * @param {string} [payload.currTrigger] 'click' | 'mousemove' | 'leave'
+ * @param {Array.<number>} [payload.x] x and y, which are mandatory, specify a point to
+ *              trigger axisPointer and tooltip.
+ * @param {Array.<number>} [payload.y] x and y, which are mandatory, specify a point to
+ *              trigger axisPointer and tooltip.
+ * @param {Object} [payload.seriesIndex] finder, optional, restrict target axes.
+ * @param {Object} [payload.dataIndex] finder, restrict target axes.
+ * @param {Object} [payload.axesInfo] finder, restrict target axes.
+ *        [{
+ *          axisDim: 'x'|'y'|'angle'|...,
+ *          axisIndex: ...,
+ *          value: ...
+ *        }, ...]
+ * @param {Function} [payload.dispatchAction]
+ * @param {Object} [payload.tooltipOption]
+ * @param {Object|Array.<number>|Function} [payload.position] Tooltip position,
+ *        which can be specified in dispatchAction
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ * @return {Object} content of event obj for echarts.connect.
+ */
+var axisTrigger = function (payload, ecModel, api) {
+    var currTrigger = payload.currTrigger;
+    var point = [payload.x, payload.y];
+    var finder = payload;
+    var dispatchAction = payload.dispatchAction || bind(api.dispatchAction, api);
+    var coordSysAxesInfo = ecModel.getComponent('axisPointer').coordSysAxesInfo;
+
+    // Pending
+    // See #6121. But we are not able to reproduce it yet.
+    if (!coordSysAxesInfo) {
+        return;
+    }
+
+    if (illegalPoint(point)) {
+        // Used in the default behavior of `connection`: use the sample seriesIndex
+        // and dataIndex. And also used in the tooltipView trigger.
+        point = findPointFromSeries({
+            seriesIndex: finder.seriesIndex,
+            // Do not use dataIndexInside from other ec instance.
+            // FIXME: auto detect it?
+            dataIndex: finder.dataIndex
+        }, ecModel).point;
+    }
+    var isIllegalPoint = illegalPoint(point);
+
+    // Axis and value can be specified when calling dispatchAction({type: 'updateAxisPointer'}).
+    // Notice: In this case, it is difficult to get the `point` (which is necessary to show
+    // tooltip, so if point is not given, we just use the point found by sample seriesIndex
+    // and dataIndex.
+    var inputAxesInfo = finder.axesInfo;
+
+    var axesInfo = coordSysAxesInfo.axesInfo;
+    var shouldHide = currTrigger === 'leave' || illegalPoint(point);
+    var outputFinder = {};
+
+    var showValueMap = {};
+    var dataByCoordSys = {list: [], map: {}};
+    var updaters = {
+        showPointer: curry$3(showPointer, showValueMap),
+        showTooltip: curry$3(showTooltip, dataByCoordSys)
+    };
+
+    // Process for triggered axes.
+    each$14(coordSysAxesInfo.coordSysMap, function (coordSys, coordSysKey) {
+        // If a point given, it must be contained by the coordinate system.
+        var coordSysContainsPoint = isIllegalPoint || coordSys.containPoint(point);
+
+        each$14(coordSysAxesInfo.coordSysAxesInfo[coordSysKey], function (axisInfo, key) {
+            var axis = axisInfo.axis;
+            var inputAxisInfo = findInputAxisInfo(inputAxesInfo, axisInfo);
+            // If no inputAxesInfo, no axis is restricted.
+            if (!shouldHide && coordSysContainsPoint && (!inputAxesInfo || inputAxisInfo)) {
+                var val = inputAxisInfo && inputAxisInfo.value;
+                if (val == null && !isIllegalPoint) {
+                    val = axis.pointToData(point);
+                }
+                val != null && processOnAxis(axisInfo, val, updaters, false, outputFinder);
+            }
+        });
+    });
+
+    // Process for linked axes.
+    var linkTriggers = {};
+    each$14(axesInfo, function (tarAxisInfo, tarKey) {
+        var linkGroup = tarAxisInfo.linkGroup;
+
+        // If axis has been triggered in the previous stage, it should not be triggered by link.
+        if (linkGroup && !showValueMap[tarKey]) {
+            each$14(linkGroup.axesInfo, function (srcAxisInfo, srcKey) {
+                var srcValItem = showValueMap[srcKey];
+                // If srcValItem exist, source axis is triggered, so link to target axis.
+                if (srcAxisInfo !== tarAxisInfo && srcValItem) {
+                    var val = srcValItem.value;
+                    linkGroup.mapper && (val = tarAxisInfo.axis.scale.parse(linkGroup.mapper(
+                        val, makeMapperParam(srcAxisInfo), makeMapperParam(tarAxisInfo)
+                    )));
+                    linkTriggers[tarAxisInfo.key] = val;
+                }
+            });
+        }
+    });
+    each$14(linkTriggers, function (val, tarKey) {
+        processOnAxis(axesInfo[tarKey], val, updaters, true, outputFinder);
+    });
+
+    updateModelActually(showValueMap, axesInfo, outputFinder);
+    dispatchTooltipActually(dataByCoordSys, point, payload, dispatchAction);
+    dispatchHighDownActually(axesInfo, dispatchAction, api);
+
+    return outputFinder;
+};
+
+function processOnAxis(axisInfo, newValue, updaters, dontSnap, outputFinder) {
+    var axis = axisInfo.axis;
+
+    if (axis.scale.isBlank() || !axis.containData(newValue)) {
+        return;
+    }
+
+    if (!axisInfo.involveSeries) {
+        updaters.showPointer(axisInfo, newValue);
+        return;
+    }
+
+    // Heavy calculation. So put it after axis.containData checking.
+    var payloadInfo = buildPayloadsBySeries(newValue, axisInfo);
+    var payloadBatch = payloadInfo.payloadBatch;
+    var snapToValue = payloadInfo.snapToValue;
+
+    // Fill content of event obj for echarts.connect.
+    // By defualt use the first involved series data as a sample to connect.
+    if (payloadBatch[0] && outputFinder.seriesIndex == null) {
+        extend(outputFinder, payloadBatch[0]);
+    }
+
+    // If no linkSource input, this process is for collecting link
+    // target, where snap should not be accepted.
+    if (!dontSnap && axisInfo.snap) {
+        if (axis.containData(snapToValue) && snapToValue != null) {
+            newValue = snapToValue;
+        }
+    }
+
+    updaters.showPointer(axisInfo, newValue, payloadBatch, outputFinder);
+    // Tooltip should always be snapToValue, otherwise there will be
+    // incorrect "axis value ~ series value" mapping displayed in tooltip.
+    updaters.showTooltip(axisInfo, payloadInfo, snapToValue);
+}
+
+function buildPayloadsBySeries(value, axisInfo) {
+    var axis = axisInfo.axis;
+    var dim = axis.dim;
+    var snapToValue = value;
+    var payloadBatch = [];
+    var minDist = Number.MAX_VALUE;
+    var minDiff = -1;
+
+    each$14(axisInfo.seriesModels, function (series, idx) {
+        var dataDim = series.getData().mapDimension(dim, true);
+        var seriesNestestValue;
+        var dataIndices;
+
+        if (series.getAxisTooltipData) {
+            var result = series.getAxisTooltipData(dataDim, value, axis);
+            dataIndices = result.dataIndices;
+            seriesNestestValue = result.nestestValue;
+        }
+        else {
+            dataIndices = series.getData().indicesOfNearest(
+                dataDim[0],
+                value,
+                // Add a threshold to avoid find the wrong dataIndex
+                // when data length is not same.
+                // false,
+                axis.type === 'category' ? 0.5 : null
+            );
+            if (!dataIndices.length) {
+                return;
+            }
+            seriesNestestValue = series.getData().get(dataDim[0], dataIndices[0]);
+        }
+
+        if (seriesNestestValue == null || !isFinite(seriesNestestValue)) {
+            return;
+        }
+
+        var diff = value - seriesNestestValue;
+        var dist = Math.abs(diff);
+        // Consider category case
+        if (dist <= minDist) {
+            if (dist < minDist || (diff >= 0 && minDiff < 0)) {
+                minDist = dist;
+                minDiff = diff;
+                snapToValue = seriesNestestValue;
+                payloadBatch.length = 0;
+            }
+            each$14(dataIndices, function (dataIndex) {
+                payloadBatch.push({
+                    seriesIndex: series.seriesIndex,
+                    dataIndexInside: dataIndex,
+                    dataIndex: series.getData().getRawIndex(dataIndex)
+                });
+            });
+        }
+    });
+
+    return {
+        payloadBatch: payloadBatch,
+        snapToValue: snapToValue
+    };
+}
+
+function showPointer(showValueMap, axisInfo, value, payloadBatch) {
+    showValueMap[axisInfo.key] = {value: value, payloadBatch: payloadBatch};
+}
+
+function showTooltip(dataByCoordSys, axisInfo, payloadInfo, value) {
+    var payloadBatch = payloadInfo.payloadBatch;
+    var axis = axisInfo.axis;
+    var axisModel = axis.model;
+    var axisPointerModel = axisInfo.axisPointerModel;
+
+    // If no data, do not create anything in dataByCoordSys,
+    // whose length will be used to judge whether dispatch action.
+    if (!axisInfo.triggerTooltip || !payloadBatch.length) {
+        return;
+    }
+
+    var coordSysModel = axisInfo.coordSys.model;
+    var coordSysKey = makeKey(coordSysModel);
+    var coordSysItem = dataByCoordSys.map[coordSysKey];
+    if (!coordSysItem) {
+        coordSysItem = dataByCoordSys.map[coordSysKey] = {
+            coordSysId: coordSysModel.id,
+            coordSysIndex: coordSysModel.componentIndex,
+            coordSysType: coordSysModel.type,
+            coordSysMainType: coordSysModel.mainType,
+            dataByAxis: []
+        };
+        dataByCoordSys.list.push(coordSysItem);
+    }
+
+    coordSysItem.dataByAxis.push({
+        axisDim: axis.dim,
+        axisIndex: axisModel.componentIndex,
+        axisType: axisModel.type,
+        axisId: axisModel.id,
+        value: value,
+        // Caustion: viewHelper.getValueLabel is actually on "view stage", which
+        // depends that all models have been updated. So it should not be performed
+        // here. Considering axisPointerModel used here is volatile, which is hard
+        // to be retrieve in TooltipView, we prepare parameters here.
+        valueLabelOpt: {
+            precision: axisPointerModel.get('label.precision'),
+            formatter: axisPointerModel.get('label.formatter')
+        },
+        seriesDataIndices: payloadBatch.slice()
+    });
+}
+
+function updateModelActually(showValueMap, axesInfo, outputFinder) {
+    var outputAxesInfo = outputFinder.axesInfo = [];
+    // Basic logic: If no 'show' required, 'hide' this axisPointer.
+    each$14(axesInfo, function (axisInfo, key) {
+        var option = axisInfo.axisPointerModel.option;
+        var valItem = showValueMap[key];
+
+        if (valItem) {
+            !axisInfo.useHandle && (option.status = 'show');
+            option.value = valItem.value;
+            // For label formatter param and highlight.
+            option.seriesDataIndices = (valItem.payloadBatch || []).slice();
+        }
+        // When always show (e.g., handle used), remain
+        // original value and status.
+        else {
+            // If hide, value still need to be set, consider
+            // click legend to toggle axis blank.
+            !axisInfo.useHandle && (option.status = 'hide');
+        }
+
+        // If status is 'hide', should be no info in payload.
+        option.status === 'show' && outputAxesInfo.push({
+            axisDim: axisInfo.axis.dim,
+            axisIndex: axisInfo.axis.model.componentIndex,
+            value: option.value
+        });
+    });
+}
+
+function dispatchTooltipActually(dataByCoordSys, point, payload, dispatchAction) {
+    // Basic logic: If no showTip required, hideTip will be dispatched.
+    if (illegalPoint(point) || !dataByCoordSys.list.length) {
+        dispatchAction({type: 'hideTip'});
+        return;
+    }
+
+    // In most case only one axis (or event one series is used). It is
+    // convinient to fetch payload.seriesIndex and payload.dataIndex
+    // dirtectly. So put the first seriesIndex and dataIndex of the first
+    // axis on the payload.
+    var sampleItem = ((dataByCoordSys.list[0].dataByAxis[0] || {}).seriesDataIndices || [])[0] || {};
+
+    dispatchAction({
+        type: 'showTip',
+        escapeConnect: true,
+        x: point[0],
+        y: point[1],
+        tooltipOption: payload.tooltipOption,
+        position: payload.position,
+        dataIndexInside: sampleItem.dataIndexInside,
+        dataIndex: sampleItem.dataIndex,
+        seriesIndex: sampleItem.seriesIndex,
+        dataByCoordSys: dataByCoordSys.list
+    });
+}
+
+function dispatchHighDownActually(axesInfo, dispatchAction, api) {
+    // FIXME
+    // highlight status modification shoule be a stage of main process?
+    // (Consider confilct (e.g., legend and axisPointer) and setOption)
+
+    var zr = api.getZr();
+    var highDownKey = 'axisPointerLastHighlights';
+    var lastHighlights = inner$7(zr)[highDownKey] || {};
+    var newHighlights = inner$7(zr)[highDownKey] = {};
+
+    // Update highlight/downplay status according to axisPointer model.
+    // Build hash map and remove duplicate incidentally.
+    each$14(axesInfo, function (axisInfo, key) {
+        var option = axisInfo.axisPointerModel.option;
+        option.status === 'show' && each$14(option.seriesDataIndices, function (batchItem) {
+            var key = batchItem.seriesIndex + ' | ' + batchItem.dataIndex;
+            newHighlights[key] = batchItem;
+        });
+    });
+
+    // Diff.
+    var toHighlight = [];
+    var toDownplay = [];
+    each$1(lastHighlights, function (batchItem, key) {
+        !newHighlights[key] && toDownplay.push(batchItem);
+    });
+    each$1(newHighlights, function (batchItem, key) {
+        !lastHighlights[key] && toHighlight.push(batchItem);
+    });
+
+    toDownplay.length && api.dispatchAction({
+        type: 'downplay', escapeConnect: true, batch: toDownplay
+    });
+    toHighlight.length && api.dispatchAction({
+        type: 'highlight', escapeConnect: true, batch: toHighlight
+    });
+}
+
+function findInputAxisInfo(inputAxesInfo, axisInfo) {
+    for (var i = 0; i < (inputAxesInfo || []).length; i++) {
+        var inputAxisInfo = inputAxesInfo[i];
+        if (axisInfo.axis.dim === inputAxisInfo.axisDim
+            && axisInfo.axis.model.componentIndex === inputAxisInfo.axisIndex
+        ) {
+            return inputAxisInfo;
+        }
+    }
+}
+
+function makeMapperParam(axisInfo) {
+    var axisModel = axisInfo.axis.model;
+    var item = {};
+    var dim = item.axisDim = axisInfo.axis.dim;
+    item.axisIndex = item[dim + 'AxisIndex'] = axisModel.componentIndex;
+    item.axisName = item[dim + 'AxisName'] = axisModel.name;
+    item.axisId = item[dim + 'AxisId'] = axisModel.id;
+    return item;
+}
+
+function illegalPoint(point) {
+    return !point || point[0] == null || isNaN(point[0]) || point[1] == null || isNaN(point[1]);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisPointerModel = extendComponentModel({
+
+    type: 'axisPointer',
+
+    coordSysAxesInfo: null,
+
+    defaultOption: {
+        // 'auto' means that show when triggered by tooltip or handle.
+        show: 'auto',
+        // 'click' | 'mousemove' | 'none'
+        triggerOn: null, // set default in AxisPonterView.js
+
+        zlevel: 0,
+        z: 50,
+
+        type: 'line',
+        // axispointer triggered by tootip determine snap automatically,
+        // see `modelHelper`.
+        snap: false,
+        triggerTooltip: true,
+
+        value: null,
+        status: null, // Init value depends on whether handle is used.
+
+        // [group0, group1, ...]
+        // Each group can be: {
+        //      mapper: function () {},
+        //      singleTooltip: 'multiple',  // 'multiple' or 'single'
+        //      xAxisId: ...,
+        //      yAxisName: ...,
+        //      angleAxisIndex: ...
+        // }
+        // mapper: can be ignored.
+        //      input: {axisInfo, value}
+        //      output: {axisInfo, value}
+        link: [],
+
+        // Do not set 'auto' here, otherwise global animation: false
+        // will not effect at this axispointer.
+        animation: null,
+        animationDurationUpdate: 200,
+
+        lineStyle: {
+            color: '#aaa',
+            width: 1,
+            type: 'solid'
+        },
+
+        shadowStyle: {
+            color: 'rgba(150,150,150,0.3)'
+        },
+
+        label: {
+            show: true,
+            formatter: null, // string | Function
+            precision: 'auto', // Or a number like 0, 1, 2 ...
+            margin: 3,
+            color: '#fff',
+            padding: [5, 7, 5, 7],
+            backgroundColor: 'auto', // default: axis line color
+            borderColor: null,
+            borderWidth: 0,
+            shadowBlur: 3,
+            shadowColor: '#aaa'
+            // Considering applicability, common style should
+            // better not have shadowOffset.
+            // shadowOffsetX: 0,
+            // shadowOffsetY: 2
+        },
+
+        handle: {
+            show: false,
+            icon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4h1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7v-1.2h6.6z M13.3,22H6.7v-1.2h6.6z M13.3,19.6H6.7v-1.2h6.6z', // jshint ignore:line
+            size: 45,
+            // handle margin is from symbol center to axis, which is stable when circular move.
+            margin: 50,
+            // color: '#1b8bbd'
+            // color: '#2f4554'
+            color: '#333',
+            shadowBlur: 3,
+            shadowColor: '#aaa',
+            shadowOffsetX: 0,
+            shadowOffsetY: 2,
+
+            // For mobile performance
+            throttle: 40
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$8 = makeInner();
+var each$15 = each$1;
+
+/**
+ * @param {string} key
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Function} handler
+ *      param: {string} currTrigger
+ *      param: {Array.<number>} point
+ */
+function register(key, api, handler) {
+    if (env$1.node) {
+        return;
+    }
+
+    var zr = api.getZr();
+    inner$8(zr).records || (inner$8(zr).records = {});
+
+    initGlobalListeners(zr, api);
+
+    var record = inner$8(zr).records[key] || (inner$8(zr).records[key] = {});
+    record.handler = handler;
+}
+
+function initGlobalListeners(zr, api) {
+    if (inner$8(zr).initialized) {
+        return;
+    }
+
+    inner$8(zr).initialized = true;
+
+    useHandler('click', curry(doEnter, 'click'));
+    useHandler('mousemove', curry(doEnter, 'mousemove'));
+    // useHandler('mouseout', onLeave);
+    useHandler('globalout', onLeave);
+
+    function useHandler(eventType, cb) {
+        zr.on(eventType, function (e) {
+            var dis = makeDispatchAction(api);
+
+            each$15(inner$8(zr).records, function (record) {
+                record && cb(record, e, dis.dispatchAction);
+            });
+
+            dispatchTooltipFinally(dis.pendings, api);
+        });
+    }
+}
+
+function dispatchTooltipFinally(pendings, api) {
+    var showLen = pendings.showTip.length;
+    var hideLen = pendings.hideTip.length;
+
+    var actuallyPayload;
+    if (showLen) {
+        actuallyPayload = pendings.showTip[showLen - 1];
+    }
+    else if (hideLen) {
+        actuallyPayload = pendings.hideTip[hideLen - 1];
+    }
+    if (actuallyPayload) {
+        actuallyPayload.dispatchAction = null;
+        api.dispatchAction(actuallyPayload);
+    }
+}
+
+function onLeave(record, e, dispatchAction) {
+    record.handler('leave', null, dispatchAction);
+}
+
+function doEnter(currTrigger, record, e, dispatchAction) {
+    record.handler(currTrigger, e, dispatchAction);
+}
+
+function makeDispatchAction(api) {
+    var pendings = {
+        showTip: [],
+        hideTip: []
+    };
+    // FIXME
+    // better approach?
+    // 'showTip' and 'hideTip' can be triggered by axisPointer and tooltip,
+    // which may be conflict, (axisPointer call showTip but tooltip call hideTip);
+    // So we have to add "final stage" to merge those dispatched actions.
+    var dispatchAction = function (payload) {
+        var pendingList = pendings[payload.type];
+        if (pendingList) {
+            pendingList.push(payload);
+        }
+        else {
+            payload.dispatchAction = dispatchAction;
+            api.dispatchAction(payload);
+        }
+    };
+
+    return {
+        dispatchAction: dispatchAction,
+        pendings: pendings
+    };
+}
+
+/**
+ * @param {string} key
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function unregister(key, api) {
+    if (env$1.node) {
+        return;
+    }
+    var zr = api.getZr();
+    var record = (inner$8(zr).records || {})[key];
+    if (record) {
+        inner$8(zr).records[key] = null;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisPointerView = extendComponentView({
+
+    type: 'axisPointer',
+
+    render: function (globalAxisPointerModel, ecModel, api) {
+        var globalTooltipModel = ecModel.getComponent('tooltip');
+        var triggerOn = globalAxisPointerModel.get('triggerOn')
+            || (globalTooltipModel && globalTooltipModel.get('triggerOn') || 'mousemove|click');
+
+        // Register global listener in AxisPointerView to enable
+        // AxisPointerView to be independent to Tooltip.
+        register(
+            'axisPointer',
+            api,
+            function (currTrigger, e, dispatchAction) {
+                // If 'none', it is not controlled by mouse totally.
+                if (triggerOn !== 'none'
+                    && (currTrigger === 'leave' || triggerOn.indexOf(currTrigger) >= 0)
+                ) {
+                    dispatchAction({
+                        type: 'updateAxisPointer',
+                        currTrigger: currTrigger,
+                        x: e && e.offsetX,
+                        y: e && e.offsetY
+                    });
+                }
+            }
+        );
+    },
+
+    /**
+     * @override
+     */
+    remove: function (ecModel, api) {
+        unregister(api.getZr(), 'axisPointer');
+        AxisPointerView.superApply(this._model, 'remove', arguments);
+    },
+
+    /**
+     * @override
+     */
+    dispose: function (ecModel, api) {
+        unregister('axisPointer', api);
+        AxisPointerView.superApply(this._model, 'dispose', arguments);
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$9 = makeInner();
+var clone$4 = clone;
+var bind$2 = bind;
+
+/**
+ * Base axis pointer class in 2D.
+ * Implemenents {module:echarts/component/axis/IAxisPointer}.
+ */
+function BaseAxisPointer () {
+}
+
+BaseAxisPointer.prototype = {
+
+    /**
+     * @private
+     */
+    _group: null,
+
+    /**
+     * @private
+     */
+    _lastGraphicKey: null,
+
+    /**
+     * @private
+     */
+    _handle: null,
+
+    /**
+     * @private
+     */
+    _dragging: false,
+
+    /**
+     * @private
+     */
+    _lastValue: null,
+
+    /**
+     * @private
+     */
+    _lastStatus: null,
+
+    /**
+     * @private
+     */
+    _payloadInfo: null,
+
+    /**
+     * In px, arbitrary value. Do not set too small,
+     * no animation is ok for most cases.
+     * @protected
+     */
+    animationThreshold: 15,
+
+    /**
+     * @implement
+     */
+    render: function (axisModel, axisPointerModel, api, forceRender) {
+        var value = axisPointerModel.get('value');
+        var status = axisPointerModel.get('status');
+
+        // Bind them to `this`, not in closure, otherwise they will not
+        // be replaced when user calling setOption in not merge mode.
+        this._axisModel = axisModel;
+        this._axisPointerModel = axisPointerModel;
+        this._api = api;
+
+        // Optimize: `render` will be called repeatly during mouse move.
+        // So it is power consuming if performing `render` each time,
+        // especially on mobile device.
+        if (!forceRender
+            && this._lastValue === value
+            && this._lastStatus === status
+        ) {
+            return;
+        }
+        this._lastValue = value;
+        this._lastStatus = status;
+
+        var group = this._group;
+        var handle = this._handle;
+
+        if (!status || status === 'hide') {
+            // Do not clear here, for animation better.
+            group && group.hide();
+            handle && handle.hide();
+            return;
+        }
+        group && group.show();
+        handle && handle.show();
+
+        // Otherwise status is 'show'
+        var elOption = {};
+        this.makeElOption(elOption, value, axisModel, axisPointerModel, api);
+
+        // Enable change axis pointer type.
+        var graphicKey = elOption.graphicKey;
+        if (graphicKey !== this._lastGraphicKey) {
+            this.clear(api);
+        }
+        this._lastGraphicKey = graphicKey;
+
+        var moveAnimation = this._moveAnimation =
+            this.determineAnimation(axisModel, axisPointerModel);
+
+        if (!group) {
+            group = this._group = new Group();
+            this.createPointerEl(group, elOption, axisModel, axisPointerModel);
+            this.createLabelEl(group, elOption, axisModel, axisPointerModel);
+            api.getZr().add(group);
+        }
+        else {
+            var doUpdateProps = curry(updateProps$1, axisPointerModel, moveAnimation);
+            this.updatePointerEl(group, elOption, doUpdateProps, axisPointerModel);
+            this.updateLabelEl(group, elOption, doUpdateProps, axisPointerModel);
+        }
+
+        updateMandatoryProps(group, axisPointerModel, true);
+
+        this._renderHandle(value);
+    },
+
+    /**
+     * @implement
+     */
+    remove: function (api) {
+        this.clear(api);
+    },
+
+    /**
+     * @implement
+     */
+    dispose: function (api) {
+        this.clear(api);
+    },
+
+    /**
+     * @protected
+     */
+    determineAnimation: function (axisModel, axisPointerModel) {
+        var animation = axisPointerModel.get('animation');
+        var axis = axisModel.axis;
+        var isCategoryAxis = axis.type === 'category';
+        var useSnap = axisPointerModel.get('snap');
+
+        // Value axis without snap always do not snap.
+        if (!useSnap && !isCategoryAxis) {
+            return false;
+        }
+
+        if (animation === 'auto' || animation == null) {
+            var animationThreshold = this.animationThreshold;
+            if (isCategoryAxis && axis.getBandWidth() > animationThreshold) {
+                return true;
+            }
+
+            // It is important to auto animation when snap used. Consider if there is
+            // a dataZoom, animation will be disabled when too many points exist, while
+            // it will be enabled for better visual effect when little points exist.
+            if (useSnap) {
+                var seriesDataCount = getAxisInfo(axisModel).seriesDataCount;
+                var axisExtent = axis.getExtent();
+                // Approximate band width
+                return Math.abs(axisExtent[0] - axisExtent[1]) / seriesDataCount > animationThreshold;
+            }
+
+            return false;
+        }
+
+        return animation === true;
+    },
+
+    /**
+     * add {pointer, label, graphicKey} to elOption
+     * @protected
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        // Shoule be implemenented by sub-class.
+    },
+
+    /**
+     * @protected
+     */
+    createPointerEl: function (group, elOption, axisModel, axisPointerModel) {
+        var pointerOption = elOption.pointer;
+        if (pointerOption) {
+            var pointerEl = inner$9(group).pointerEl = new graphic[pointerOption.type](
+                clone$4(elOption.pointer)
+            );
+            group.add(pointerEl);
+        }
+    },
+
+    /**
+     * @protected
+     */
+    createLabelEl: function (group, elOption, axisModel, axisPointerModel) {
+        if (elOption.label) {
+            var labelEl = inner$9(group).labelEl = new Rect(
+                clone$4(elOption.label)
+            );
+
+            group.add(labelEl);
+            updateLabelShowHide(labelEl, axisPointerModel);
+        }
+    },
+
+    /**
+     * @protected
+     */
+    updatePointerEl: function (group, elOption, updateProps$$1) {
+        var pointerEl = inner$9(group).pointerEl;
+        if (pointerEl) {
+            pointerEl.setStyle(elOption.pointer.style);
+            updateProps$$1(pointerEl, {shape: elOption.pointer.shape});
+        }
+    },
+
+    /**
+     * @protected
+     */
+    updateLabelEl: function (group, elOption, updateProps$$1, axisPointerModel) {
+        var labelEl = inner$9(group).labelEl;
+        if (labelEl) {
+            labelEl.setStyle(elOption.label.style);
+            updateProps$$1(labelEl, {
+                // Consider text length change in vertical axis, animation should
+                // be used on shape, otherwise the effect will be weird.
+                shape: elOption.label.shape,
+                position: elOption.label.position
+            });
+
+            updateLabelShowHide(labelEl, axisPointerModel);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _renderHandle: function (value) {
+        if (this._dragging || !this.updateHandleTransform) {
+            return;
+        }
+
+        var axisPointerModel = this._axisPointerModel;
+        var zr = this._api.getZr();
+        var handle = this._handle;
+        var handleModel = axisPointerModel.getModel('handle');
+
+        var status = axisPointerModel.get('status');
+        if (!handleModel.get('show') || !status || status === 'hide') {
+            handle && zr.remove(handle);
+            this._handle = null;
+            return;
+        }
+
+        var isInit;
+        if (!this._handle) {
+            isInit = true;
+            handle = this._handle = createIcon(
+                handleModel.get('icon'),
+                {
+                    cursor: 'move',
+                    draggable: true,
+                    onmousemove: function (e) {
+                        // Fot mobile devicem, prevent screen slider on the button.
+                        stop(e.event);
+                    },
+                    onmousedown: bind$2(this._onHandleDragMove, this, 0, 0),
+                    drift: bind$2(this._onHandleDragMove, this),
+                    ondragend: bind$2(this._onHandleDragEnd, this)
+                }
+            );
+            zr.add(handle);
+        }
+
+        updateMandatoryProps(handle, axisPointerModel, false);
+
+        // update style
+        var includeStyles = [
+            'color', 'borderColor', 'borderWidth', 'opacity',
+            'shadowColor', 'shadowBlur', 'shadowOffsetX', 'shadowOffsetY'
+        ];
+        handle.setStyle(handleModel.getItemStyle(null, includeStyles));
+
+        // update position
+        var handleSize = handleModel.get('size');
+        if (!isArray(handleSize)) {
+            handleSize = [handleSize, handleSize];
+        }
+        handle.attr('scale', [handleSize[0] / 2, handleSize[1] / 2]);
+
+        createOrUpdate(
+            this,
+            '_doDispatchAxisPointer',
+            handleModel.get('throttle') || 0,
+            'fixRate'
+        );
+
+        this._moveHandleToValue(value, isInit);
+    },
+
+    /**
+     * @private
+     */
+    _moveHandleToValue: function (value, isInit) {
+        updateProps$1(
+            this._axisPointerModel,
+            !isInit && this._moveAnimation,
+            this._handle,
+            getHandleTransProps(this.getHandleTransform(
+                value, this._axisModel, this._axisPointerModel
+            ))
+        );
+    },
+
+    /**
+     * @private
+     */
+    _onHandleDragMove: function (dx, dy) {
+        var handle = this._handle;
+        if (!handle) {
+            return;
+        }
+
+        this._dragging = true;
+
+        // Persistent for throttle.
+        var trans = this.updateHandleTransform(
+            getHandleTransProps(handle),
+            [dx, dy],
+            this._axisModel,
+            this._axisPointerModel
+        );
+        this._payloadInfo = trans;
+
+        handle.stopAnimation();
+        handle.attr(getHandleTransProps(trans));
+        inner$9(handle).lastProp = null;
+
+        this._doDispatchAxisPointer();
+    },
+
+    /**
+     * Throttled method.
+     * @private
+     */
+    _doDispatchAxisPointer: function () {
+        var handle = this._handle;
+        if (!handle) {
+            return;
+        }
+
+        var payloadInfo = this._payloadInfo;
+        var axisModel = this._axisModel;
+        this._api.dispatchAction({
+            type: 'updateAxisPointer',
+            x: payloadInfo.cursorPoint[0],
+            y: payloadInfo.cursorPoint[1],
+            tooltipOption: payloadInfo.tooltipOption,
+            axesInfo: [{
+                axisDim: axisModel.axis.dim,
+                axisIndex: axisModel.componentIndex
+            }]
+        });
+    },
+
+    /**
+     * @private
+     */
+    _onHandleDragEnd: function (moveAnimation) {
+        this._dragging = false;
+        var handle = this._handle;
+        if (!handle) {
+            return;
+        }
+
+        var value = this._axisPointerModel.get('value');
+        // Consider snap or categroy axis, handle may be not consistent with
+        // axisPointer. So move handle to align the exact value position when
+        // drag ended.
+        this._moveHandleToValue(value);
+
+        // For the effect: tooltip will be shown when finger holding on handle
+        // button, and will be hidden after finger left handle button.
+        this._api.dispatchAction({
+            type: 'hideTip'
+        });
+    },
+
+    /**
+     * Should be implemenented by sub-class if support `handle`.
+     * @protected
+     * @param {number} value
+     * @param {module:echarts/model/Model} axisModel
+     * @param {module:echarts/model/Model} axisPointerModel
+     * @return {Object} {position: [x, y], rotation: 0}
+     */
+    getHandleTransform: null,
+
+    /**
+     * * Should be implemenented by sub-class if support `handle`.
+     * @protected
+     * @param {Object} transform {position, rotation}
+     * @param {Array.<number>} delta [dx, dy]
+     * @param {module:echarts/model/Model} axisModel
+     * @param {module:echarts/model/Model} axisPointerModel
+     * @return {Object} {position: [x, y], rotation: 0, cursorPoint: [x, y]}
+     */
+    updateHandleTransform: null,
+
+    /**
+     * @private
+     */
+    clear: function (api) {
+        this._lastValue = null;
+        this._lastStatus = null;
+
+        var zr = api.getZr();
+        var group = this._group;
+        var handle = this._handle;
+        if (zr && group) {
+            this._lastGraphicKey = null;
+            group && zr.remove(group);
+            handle && zr.remove(handle);
+            this._group = null;
+            this._handle = null;
+            this._payloadInfo = null;
+        }
+    },
+
+    /**
+     * @protected
+     */
+    doClear: function () {
+        // Implemented by sub-class if necessary.
+    },
+
+    /**
+     * @protected
+     * @param {Array.<number>} xy
+     * @param {Array.<number>} wh
+     * @param {number} [xDimIndex=0] or 1
+     */
+    buildLabel: function (xy, wh, xDimIndex) {
+        xDimIndex = xDimIndex || 0;
+        return {
+            x: xy[xDimIndex],
+            y: xy[1 - xDimIndex],
+            width: wh[xDimIndex],
+            height: wh[1 - xDimIndex]
+        };
+    }
+};
+
+BaseAxisPointer.prototype.constructor = BaseAxisPointer;
+
+
+function updateProps$1(animationModel, moveAnimation, el, props) {
+    // Animation optimize.
+    if (!propsEqual(inner$9(el).lastProp, props)) {
+        inner$9(el).lastProp = props;
+        moveAnimation
+            ? updateProps(el, props, animationModel)
+            : (el.stopAnimation(), el.attr(props));
+    }
+}
+
+function propsEqual(lastProps, newProps) {
+    if (isObject$1(lastProps) && isObject$1(newProps)) {
+        var equals = true;
+        each$1(newProps, function (item, key) {
+            equals = equals && propsEqual(lastProps[key], item);
+        });
+        return !!equals;
+    }
+    else {
+        return lastProps === newProps;
+    }
+}
+
+function updateLabelShowHide(labelEl, axisPointerModel) {
+    labelEl[axisPointerModel.get('label.show') ? 'show' : 'hide']();
+}
+
+function getHandleTransProps(trans) {
+    return {
+        position: trans.position.slice(),
+        rotation: trans.rotation || 0
+    };
+}
+
+function updateMandatoryProps(group, axisPointerModel, silent) {
+    var z = axisPointerModel.get('z');
+    var zlevel = axisPointerModel.get('zlevel');
+
+    group && group.traverse(function (el) {
+        if (el.type !== 'group') {
+            z != null && (el.z = z);
+            zlevel != null && (el.zlevel = zlevel);
+            el.silent = silent;
+        }
+    });
+}
+
+enableClassExtend(BaseAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/model/Model} axisPointerModel
+ */
+function buildElStyle(axisPointerModel) {
+    var axisPointerType = axisPointerModel.get('type');
+    var styleModel = axisPointerModel.getModel(axisPointerType + 'Style');
+    var style;
+    if (axisPointerType === 'line') {
+        style = styleModel.getLineStyle();
+        style.fill = null;
+    }
+    else if (axisPointerType === 'shadow') {
+        style = styleModel.getAreaStyle();
+        style.stroke = null;
+    }
+    return style;
+}
+
+/**
+ * @param {Function} labelPos {align, verticalAlign, position}
+ */
+function buildLabelElOption(
+    elOption, axisModel, axisPointerModel, api, labelPos
+) {
+    var value = axisPointerModel.get('value');
+    var text = getValueLabel(
+        value, axisModel.axis, axisModel.ecModel,
+        axisPointerModel.get('seriesDataIndices'),
+        {
+            precision: axisPointerModel.get('label.precision'),
+            formatter: axisPointerModel.get('label.formatter')
+        }
+    );
+    var labelModel = axisPointerModel.getModel('label');
+    var paddings = normalizeCssArray$1(labelModel.get('padding') || 0);
+
+    var font = labelModel.getFont();
+    var textRect = getBoundingRect(text, font);
+
+    var position = labelPos.position;
+    var width = textRect.width + paddings[1] + paddings[3];
+    var height = textRect.height + paddings[0] + paddings[2];
+
+    // Adjust by align.
+    var align = labelPos.align;
+    align === 'right' && (position[0] -= width);
+    align === 'center' && (position[0] -= width / 2);
+    var verticalAlign = labelPos.verticalAlign;
+    verticalAlign === 'bottom' && (position[1] -= height);
+    verticalAlign === 'middle' && (position[1] -= height / 2);
+
+    // Not overflow ec container
+    confineInContainer(position, width, height, api);
+
+    var bgColor = labelModel.get('backgroundColor');
+    if (!bgColor || bgColor === 'auto') {
+        bgColor = axisModel.get('axisLine.lineStyle.color');
+    }
+
+    elOption.label = {
+        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        position: position.slice(),
+        // TODO: rich
+        style: {
+            text: text,
+            textFont: font,
+            textFill: labelModel.getTextColor(),
+            textPosition: 'inside',
+            fill: bgColor,
+            stroke: labelModel.get('borderColor') || 'transparent',
+            lineWidth: labelModel.get('borderWidth') || 0,
+            shadowBlur: labelModel.get('shadowBlur'),
+            shadowColor: labelModel.get('shadowColor'),
+            shadowOffsetX: labelModel.get('shadowOffsetX'),
+            shadowOffsetY: labelModel.get('shadowOffsetY')
+        },
+        // Lable should be over axisPointer.
+        z2: 10
+    };
+}
+
+// Do not overflow ec container
+function confineInContainer(position, width, height, api) {
+    var viewWidth = api.getWidth();
+    var viewHeight = api.getHeight();
+    position[0] = Math.min(position[0] + width, viewWidth) - width;
+    position[1] = Math.min(position[1] + height, viewHeight) - height;
+    position[0] = Math.max(position[0], 0);
+    position[1] = Math.max(position[1], 0);
+}
+
+/**
+ * @param {number} value
+ * @param {module:echarts/coord/Axis} axis
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} opt
+ * @param {Array.<Object>} seriesDataIndices
+ * @param {number|string} opt.precision 'auto' or a number
+ * @param {string|Function} opt.formatter label formatter
+ */
+function getValueLabel(value, axis, ecModel, seriesDataIndices, opt) {
+    value = axis.scale.parse(value);
+    var text = axis.scale.getLabel(
+        // If `precision` is set, width can be fixed (like '12.00500'), which
+        // helps to debounce when when moving label.
+        value, {precision: opt.precision}
+    );
+    var formatter = opt.formatter;
+
+    if (formatter) {
+        var params = {
+            value: getAxisRawValue(axis, value),
+            seriesData: []
+        };
+        each$1(seriesDataIndices, function (idxItem) {
+            var series = ecModel.getSeriesByIndex(idxItem.seriesIndex);
+            var dataIndex = idxItem.dataIndexInside;
+            var dataParams = series && series.getDataParams(dataIndex);
+            dataParams && params.seriesData.push(dataParams);
+        });
+
+        if (isString(formatter)) {
+            text = formatter.replace('{value}', text);
+        }
+        else if (isFunction$1(formatter)) {
+            text = formatter(params);
+        }
+    }
+
+    return text;
+}
+
+/**
+ * @param {module:echarts/coord/Axis} axis
+ * @param {number} value
+ * @param {Object} layoutInfo {
+ *  rotation, position, labelOffset, labelDirection, labelMargin
+ * }
+ */
+function getTransformedPosition (axis, value, layoutInfo) {
+    var transform = create$1();
+    rotate(transform, transform, layoutInfo.rotation);
+    translate(transform, transform, layoutInfo.position);
+
+    return applyTransform$1([
+        axis.dataToCoord(value),
+        (layoutInfo.labelOffset || 0)
+            + (layoutInfo.labelDirection || 1) * (layoutInfo.labelMargin || 0)
+    ], transform);
+}
+
+function buildCartesianSingleLabelElOption(
+    value, elOption, layoutInfo, axisModel, axisPointerModel, api
+) {
+    var textLayout = AxisBuilder.innerTextLayout(
+        layoutInfo.rotation, 0, layoutInfo.labelDirection
+    );
+    layoutInfo.labelMargin = axisPointerModel.get('label.margin');
+    buildLabelElOption(elOption, axisModel, axisPointerModel, api, {
+        position: getTransformedPosition(axisModel.axis, value, layoutInfo),
+        align: textLayout.textAlign,
+        verticalAlign: textLayout.textVerticalAlign
+    });
+}
+
+/**
+ * @param {Array.<number>} p1
+ * @param {Array.<number>} p2
+ * @param {number} [xDimIndex=0] or 1
+ */
+function makeLineShape(p1, p2, xDimIndex) {
+    xDimIndex = xDimIndex || 0;
+    return {
+        x1: p1[xDimIndex],
+        y1: p1[1 - xDimIndex],
+        x2: p2[xDimIndex],
+        y2: p2[1 - xDimIndex]
+    };
+}
+
+/**
+ * @param {Array.<number>} xy
+ * @param {Array.<number>} wh
+ * @param {number} [xDimIndex=0] or 1
+ */
+function makeRectShape(xy, wh, xDimIndex) {
+    xDimIndex = xDimIndex || 0;
+    return {
+        x: xy[xDimIndex],
+        y: xy[1 - xDimIndex],
+        width: wh[xDimIndex],
+        height: wh[1 - xDimIndex]
+    };
+}
+
+function makeSectorShape(cx, cy, r0, r, startAngle, endAngle) {
+    return {
+        cx: cx,
+        cy: cy,
+        r0: r0,
+        r: r,
+        startAngle: startAngle,
+        endAngle: endAngle,
+        clockwise: true
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CartesianAxisPointer = BaseAxisPointer.extend({
+
+    /**
+     * @override
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        var axis = axisModel.axis;
+        var grid = axis.grid;
+        var axisPointerType = axisPointerModel.get('type');
+        var otherExtent = getCartesian(grid, axis).getOtherAxis(axis).getGlobalExtent();
+        var pixelValue = axis.toGlobalCoord(axis.dataToCoord(value, true));
+
+        if (axisPointerType && axisPointerType !== 'none') {
+            var elStyle = buildElStyle(axisPointerModel);
+            var pointerOption = pointerShapeBuilder[axisPointerType](
+                axis, pixelValue, otherExtent, elStyle
+            );
+            pointerOption.style = elStyle;
+            elOption.graphicKey = pointerOption.type;
+            elOption.pointer = pointerOption;
+        }
+
+        var layoutInfo = layout$1(grid.model, axisModel);
+        buildCartesianSingleLabelElOption(
+            value, elOption, layoutInfo, axisModel, axisPointerModel, api
+        );
+    },
+
+    /**
+     * @override
+     */
+    getHandleTransform: function (value, axisModel, axisPointerModel) {
+        var layoutInfo = layout$1(axisModel.axis.grid.model, axisModel, {
+            labelInside: false
+        });
+        layoutInfo.labelMargin = axisPointerModel.get('handle.margin');
+        return {
+            position: getTransformedPosition(axisModel.axis, value, layoutInfo),
+            rotation: layoutInfo.rotation + (layoutInfo.labelDirection < 0 ? Math.PI : 0)
+        };
+    },
+
+    /**
+     * @override
+     */
+    updateHandleTransform: function (transform, delta, axisModel, axisPointerModel) {
+        var axis = axisModel.axis;
+        var grid = axis.grid;
+        var axisExtent = axis.getGlobalExtent(true);
+        var otherExtent = getCartesian(grid, axis).getOtherAxis(axis).getGlobalExtent();
+        var dimIndex = axis.dim === 'x' ? 0 : 1;
+
+        var currPosition = transform.position;
+        currPosition[dimIndex] += delta[dimIndex];
+        currPosition[dimIndex] = Math.min(axisExtent[1], currPosition[dimIndex]);
+        currPosition[dimIndex] = Math.max(axisExtent[0], currPosition[dimIndex]);
+
+        var cursorOtherValue = (otherExtent[1] + otherExtent[0]) / 2;
+        var cursorPoint = [cursorOtherValue, cursorOtherValue];
+        cursorPoint[dimIndex] = currPosition[dimIndex];
+
+        // Make tooltip do not overlap axisPointer and in the middle of the grid.
+        var tooltipOptions = [{verticalAlign: 'middle'}, {align: 'center'}];
+
+        return {
+            position: currPosition,
+            rotation: transform.rotation,
+            cursorPoint: cursorPoint,
+            tooltipOption: tooltipOptions[dimIndex]
+        };
+    }
+
+});
+
+function getCartesian(grid, axis) {
+    var opt = {};
+    opt[axis.dim + 'AxisIndex'] = axis.index;
+    return grid.getCartesian(opt);
+}
+
+var pointerShapeBuilder = {
+
+    line: function (axis, pixelValue, otherExtent, elStyle) {
+        var targetShape = makeLineShape(
+            [pixelValue, otherExtent[0]],
+            [pixelValue, otherExtent[1]],
+            getAxisDimIndex(axis)
+        );
+        subPixelOptimizeLine({
+            shape: targetShape,
+            style: elStyle
+        });
+        return {
+            type: 'Line',
+            shape: targetShape
+        };
+    },
+
+    shadow: function (axis, pixelValue, otherExtent, elStyle) {
+        var bandWidth = Math.max(1, axis.getBandWidth());
+        var span = otherExtent[1] - otherExtent[0];
+        return {
+            type: 'Rect',
+            shape: makeRectShape(
+                [pixelValue - bandWidth / 2, otherExtent[0]],
+                [bandWidth, span],
+                getAxisDimIndex(axis)
+            )
+        };
+    }
+};
+
+function getAxisDimIndex(axis) {
+    return axis.dim === 'x' ? 0 : 1;
+}
+
+AxisView.registerAxisPointerClass('CartesianAxisPointer', CartesianAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// CartesianAxisPointer is not supposed to be required here. But consider
+// echarts.simple.js and online build tooltip, which only require gridSimple,
+// CartesianAxisPointer should be able to required somewhere.
+registerPreprocessor(function (option) {
+    // Always has a global axisPointerModel for default setting.
+    if (option) {
+        (!option.axisPointer || option.axisPointer.length === 0)
+            && (option.axisPointer = {});
+
+        var link = option.axisPointer.link;
+        // Normalize to array to avoid object mergin. But if link
+        // is not set, remain null/undefined, otherwise it will
+        // override existent link setting.
+        if (link && !isArray(link)) {
+            option.axisPointer.link = [link];
+        }
+    }
+});
+
+// This process should proformed after coordinate systems created
+// and series data processed. So put it on statistic processing stage.
+registerProcessor(PRIORITY.PROCESSOR.STATISTIC, function (ecModel, api) {
+    // Build axisPointerModel, mergin tooltip.axisPointer model for each axis.
+    // allAxesInfo should be updated when setOption performed.
+    ecModel.getComponent('axisPointer').coordSysAxesInfo
+        = collect(ecModel, api);
+});
+
+// Broadcast to all views.
+registerAction({
+    type: 'updateAxisPointer',
+    event: 'updateAxisPointer',
+    update: ':updateAxisPointer'
+}, axisTrigger);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var XY = ['x', 'y'];
+var WH = ['width', 'height'];
+
+var SingleAxisPointer = BaseAxisPointer.extend({
+
+    /**
+     * @override
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        var axis = axisModel.axis;
+        var coordSys = axis.coordinateSystem;
+        var otherExtent = getGlobalExtent(coordSys, 1 - getPointDimIndex(axis));
+        var pixelValue = coordSys.dataToPoint(value)[0];
+
+        var axisPointerType = axisPointerModel.get('type');
+        if (axisPointerType && axisPointerType !== 'none') {
+            var elStyle = buildElStyle(axisPointerModel);
+            var pointerOption = pointerShapeBuilder$1[axisPointerType](
+                axis, pixelValue, otherExtent, elStyle
+            );
+            pointerOption.style = elStyle;
+
+            elOption.graphicKey = pointerOption.type;
+            elOption.pointer = pointerOption;
+        }
+
+        var layoutInfo = layout$2(axisModel);
+        buildCartesianSingleLabelElOption(
+            value, elOption, layoutInfo, axisModel, axisPointerModel, api
+        );
+    },
+
+    /**
+     * @override
+     */
+    getHandleTransform: function (value, axisModel, axisPointerModel) {
+        var layoutInfo = layout$2(axisModel, {labelInside: false});
+        layoutInfo.labelMargin = axisPointerModel.get('handle.margin');
+        return {
+            position: getTransformedPosition(axisModel.axis, value, layoutInfo),
+            rotation: layoutInfo.rotation + (layoutInfo.labelDirection < 0 ? Math.PI : 0)
+        };
+    },
+
+    /**
+     * @override
+     */
+    updateHandleTransform: function (transform, delta, axisModel, axisPointerModel) {
+        var axis = axisModel.axis;
+        var coordSys = axis.coordinateSystem;
+        var dimIndex = getPointDimIndex(axis);
+        var axisExtent = getGlobalExtent(coordSys, dimIndex);
+        var currPosition = transform.position;
+        currPosition[dimIndex] += delta[dimIndex];
+        currPosition[dimIndex] = Math.min(axisExtent[1], currPosition[dimIndex]);
+        currPosition[dimIndex] = Math.max(axisExtent[0], currPosition[dimIndex]);
+        var otherExtent = getGlobalExtent(coordSys, 1 - dimIndex);
+        var cursorOtherValue = (otherExtent[1] + otherExtent[0]) / 2;
+        var cursorPoint = [cursorOtherValue, cursorOtherValue];
+        cursorPoint[dimIndex] = currPosition[dimIndex];
+
+        return {
+            position: currPosition,
+            rotation: transform.rotation,
+            cursorPoint: cursorPoint,
+            tooltipOption: {
+                verticalAlign: 'middle'
+            }
+        };
+    }
+});
+
+var pointerShapeBuilder$1 = {
+
+    line: function (axis, pixelValue, otherExtent, elStyle) {
+        var targetShape = makeLineShape(
+            [pixelValue, otherExtent[0]],
+            [pixelValue, otherExtent[1]],
+            getPointDimIndex(axis)
+        );
+        subPixelOptimizeLine({
+            shape: targetShape,
+            style: elStyle
+        });
+        return {
+            type: 'Line',
+            shape: targetShape
+        };
+    },
+
+    shadow: function (axis, pixelValue, otherExtent, elStyle) {
+        var bandWidth = axis.getBandWidth();
+        var span = otherExtent[1] - otherExtent[0];
+        return {
+            type: 'Rect',
+            shape: makeRectShape(
+                [pixelValue - bandWidth / 2, otherExtent[0]],
+                [bandWidth, span],
+                getPointDimIndex(axis)
+            )
+        };
+    }
+};
+
+function getPointDimIndex(axis) {
+    return axis.isHorizontal() ? 0 : 1;
+}
+
+function getGlobalExtent(coordSys, dimIndex) {
+    var rect = coordSys.getRect();
+    return [rect[XY[dimIndex]], rect[XY[dimIndex]] + rect[WH[dimIndex]]];
+}
+
+AxisView.registerAxisPointerClass('SingleAxisPointer', SingleAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+    type: 'single'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  Define the themeRiver view's series model
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var DATA_NAME_INDEX = 2;
+
+var ThemeRiverSeries = SeriesModel.extend({
+
+    type: 'series.themeRiver',
+
+    dependencies: ['singleAxis'],
+
+    /**
+     * @readOnly
+     * @type {module:zrender/core/util#HashMap}
+     */
+    nameMap: null,
+
+    /**
+     * @override
+     */
+    init: function (option) {
+        ThemeRiverSeries.superApply(this, 'init', arguments);
+
+        // Put this function here is for the sake of consistency of code style.
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+    },
+
+    /**
+     * If there is no value of a certain point in the time for some event,set it value to 0.
+     *
+     * @param {Array} data  initial data in the option
+     * @return {Array}
+     */
+    fixData: function (data) {
+        var rawDataLength = data.length;
+
+        // grouped data by name
+        var dataByName = nest()
+            .key(function (dataItem) {
+                return dataItem[2];
+            })
+            .entries(data);
+
+        // data group in each layer
+        var layData = map(dataByName, function (d) {
+            return {
+                name: d.key,
+                dataList: d.values
+            };
+        });
+
+        var layerNum = layData.length;
+        var largestLayer = -1;
+        var index = -1;
+        for (var i = 0; i < layerNum; ++i) {
+            var len = layData[i].dataList.length;
+            if (len > largestLayer) {
+                largestLayer = len;
+                index = i;
+            }
+        }
+
+        for (var k = 0; k < layerNum; ++k) {
+            if (k === index) {
+                continue;
+            }
+            var name = layData[k].name;
+            for (var j = 0; j < largestLayer; ++j) {
+                var timeValue = layData[index].dataList[j][0];
+                var length = layData[k].dataList.length;
+                var keyIndex = -1;
+                for (var l = 0; l < length; ++l) {
+                    var value = layData[k].dataList[l][0];
+                    if (value === timeValue) {
+                        keyIndex = l;
+                        break;
+                    }
+                }
+                if (keyIndex === -1) {
+                    data[rawDataLength] = [];
+                    data[rawDataLength][0] = timeValue;
+                    data[rawDataLength][1] = 0;
+                    data[rawDataLength][2] = name;
+                    rawDataLength++;
+
+                }
+            }
+        }
+        return data;
+    },
+
+    /**
+     * @override
+     * @param  {Object} option  the initial option that user gived
+     * @param  {module:echarts/model/Model} ecModel  the model object for themeRiver option
+     * @return {module:echarts/data/List}
+     */
+    getInitialData: function (option, ecModel) {
+
+        var singleAxisModel = ecModel.queryComponents({
+            mainType: 'singleAxis',
+            index: this.get('singleAxisIndex'),
+            id: this.get('singleAxisId')
+        })[0];
+
+        var axisType = singleAxisModel.get('type');
+
+        // filter the data item with the value of label is undefined
+        var filterData = filter(option.data, function (dataItem) {
+            return dataItem[2] !== undefined;
+        });
+
+        // ??? TODO design a stage to transfer data for themeRiver and lines?
+        var data = this.fixData(filterData || []);
+        var nameList = [];
+        var nameMap = this.nameMap = createHashMap();
+        var count = 0;
+
+        for (var i = 0; i < data.length; ++i) {
+            nameList.push(data[i][DATA_NAME_INDEX]);
+            if (!nameMap.get(data[i][DATA_NAME_INDEX])) {
+                nameMap.set(data[i][DATA_NAME_INDEX], count);
+                count++;
+            }
+        }
+
+        var dimensionsInfo = createDimensions(data, {
+            coordDimensions: ['single'],
+            dimensionsDefine: [
+                {
+                    name: 'time',
+                    type: getDimensionTypeByAxis(axisType)
+                },
+                {
+                    name: 'value',
+                    type: 'float'
+                },
+                {
+                    name: 'name',
+                    type: 'ordinal'
+                }
+            ],
+            encodeDefine: {
+                single: 0,
+                value: 1,
+                itemName: 2
+            }
+        });
+
+        var list = new List(dimensionsInfo, this);
+        list.initData(data);
+
+        return list;
+    },
+
+    /**
+     * The raw data is divided into multiple layers and each layer
+     *     has same name.
+     *
+     * @return {Array.<Array.<number>>}
+     */
+    getLayerSeries: function () {
+        var data = this.getData();
+        var lenCount = data.count();
+        var indexArr = [];
+
+        for (var i = 0; i < lenCount; ++i) {
+            indexArr[i] = i;
+        }
+        // data group by name
+        var dataByName = nest()
+            .key(function (index) {
+                return data.get('name', index);
+            })
+            .entries(indexArr);
+
+        var layerSeries = map(dataByName, function (d) {
+            return {
+                name: d.key,
+                indices: d.values
+            };
+        });
+
+        var timeDim = data.mapDimension('single');
+
+        for (var j = 0; j < layerSeries.length; ++j) {
+            layerSeries[j].indices.sort(comparer);
+        }
+
+        function comparer(index1, index2) {
+            return data.get(timeDim, index1) - data.get(timeDim, index2);
+        }
+
+        return layerSeries;
+    },
+
+    /**
+     * Get data indices for show tooltip content
+     *
+     * @param {Array.<string>|string} dim  single coordinate dimension
+     * @param {number} value axis value
+     * @param {module:echarts/coord/single/SingleAxis} baseAxis  single Axis used
+     *     the themeRiver.
+     * @return {Object} {dataIndices, nestestValue}
+     */
+    getAxisTooltipData: function (dim, value, baseAxis) {
+        if (!isArray(dim)) {
+            dim = dim ? [dim] : [];
+        }
+
+        var data = this.getData();
+        var layerSeries = this.getLayerSeries();
+        var indices = [];
+        var layerNum = layerSeries.length;
+        var nestestValue;
+
+        for (var i = 0; i < layerNum; ++i) {
+            var minDist = Number.MAX_VALUE;
+            var nearestIdx = -1;
+            var pointNum = layerSeries[i].indices.length;
+            for (var j = 0; j < pointNum; ++j) {
+                var theValue = data.get(dim[0], layerSeries[i].indices[j]);
+                var dist = Math.abs(theValue - value);
+                if (dist <= minDist) {
+                    nestestValue = theValue;
+                    minDist = dist;
+                    nearestIdx = layerSeries[i].indices[j];
+                }
+            }
+            indices.push(nearestIdx);
+        }
+
+        return {dataIndices: indices, nestestValue: nestestValue};
+    },
+
+    /**
+     * @override
+     * @param {number} dataIndex  index of data
+     */
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var htmlName = data.getName(dataIndex);
+        var htmlValue = data.get(data.mapDimension('value'), dataIndex);
+        if (isNaN(htmlValue) || htmlValue == null) {
+            htmlValue = '-';
+        }
+        return encodeHTML(htmlName + ' : ' + htmlValue);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        coordinateSystem: 'singleAxis',
+
+        // gap in axis's orthogonal orientation
+        boundaryGap: ['10%', '10%'],
+
+        // legendHoverLink: true,
+
+        singleAxisIndex: 0,
+
+        animationEasing: 'linear',
+
+        label: {
+            margin: 4,
+            show: true,
+            position: 'left',
+            color: '#000',
+            fontSize: 11
+        },
+
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  The file used to draw themeRiver view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+extendChartView({
+
+    type: 'themeRiver',
+
+    init: function () {
+        this._layers = [];
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var group = this.group;
+
+        var layerSeries = seriesModel.getLayerSeries();
+
+        var layoutInfo = data.getLayout('layoutInfo');
+        var rect = layoutInfo.rect;
+        var boundaryGap = layoutInfo.boundaryGap;
+
+        group.attr('position', [0, rect.y + boundaryGap[0]]);
+
+        function keyGetter(item) {
+            return item.name;
+        }
+        var dataDiffer = new DataDiffer(
+            this._layersSeries || [], layerSeries,
+            keyGetter, keyGetter
+        );
+
+        var newLayersGroups = {};
+
+        dataDiffer
+            .add(bind(process, this, 'add'))
+            .update(bind(process, this, 'update'))
+            .remove(bind(process, this, 'remove'))
+            .execute();
+
+        function process(status, idx, oldIdx) {
+            var oldLayersGroups = this._layers;
+            if (status === 'remove') {
+                group.remove(oldLayersGroups[idx]);
+                return;
+            }
+            var points0 = [];
+            var points1 = [];
+            var color;
+            var indices = layerSeries[idx].indices;
+            for (var j = 0; j < indices.length; j++) {
+                var layout = data.getItemLayout(indices[j]);
+                var x = layout.x;
+                var y0 = layout.y0;
+                var y = layout.y;
+
+                points0.push([x, y0]);
+                points1.push([x, y0 + y]);
+
+                color = data.getItemVisual(indices[j], 'color');
+            }
+
+            var polygon;
+            var text;
+            var textLayout = data.getItemLayout(indices[0]);
+            var itemModel = data.getItemModel(indices[j - 1]);
+            var labelModel = itemModel.getModel('label');
+            var margin = labelModel.get('margin');
+            if (status === 'add') {
+                var layerGroup = newLayersGroups[idx] = new Group();
+                polygon = new Polygon$1({
+                    shape: {
+                        points: points0,
+                        stackedOnPoints: points1,
+                        smooth: 0.4,
+                        stackedOnSmooth: 0.4,
+                        smoothConstraint: false
+                    },
+                    z2: 0
+                });
+                text = new Text({
+                    style: {
+                        x: textLayout.x - margin,
+                        y: textLayout.y0 + textLayout.y / 2
+                    }
+                });
+                layerGroup.add(polygon);
+                layerGroup.add(text);
+                group.add(layerGroup);
+
+                polygon.setClipPath(createGridClipShape$3(polygon.getBoundingRect(), seriesModel, function () {
+                    polygon.removeClipPath();
+                }));
+            }
+            else {
+                var layerGroup = oldLayersGroups[oldIdx];
+                polygon = layerGroup.childAt(0);
+                text = layerGroup.childAt(1);
+                group.add(layerGroup);
+
+                newLayersGroups[idx] = layerGroup;
+
+                updateProps(polygon, {
+                    shape: {
+                        points: points0,
+                        stackedOnPoints: points1
+                    }
+                }, seriesModel);
+
+                updateProps(text, {
+                    style: {
+                        x: textLayout.x - margin,
+                        y: textLayout.y0 + textLayout.y / 2
+                    }
+                }, seriesModel);
+            }
+
+            var hoverItemStyleModel = itemModel.getModel('emphasis.itemStyle');
+            var itemStyleModel = itemModel.getModel('itemStyle');
+
+            setTextStyle(text.style, labelModel, {
+                text: labelModel.get('show')
+                    ? seriesModel.getFormattedLabel(indices[j - 1], 'normal')
+                        || data.getName(indices[j - 1])
+                    : null,
+                textVerticalAlign: 'middle'
+            });
+
+            polygon.setStyle(extend({
+                fill: color
+            }, itemStyleModel.getItemStyle(['color'])));
+
+            setHoverStyle(polygon, hoverItemStyleModel.getItemStyle());
+        }
+
+        this._layersSeries = layerSeries;
+        this._layers = newLayersGroups;
+    },
+
+    dispose: function () {}
+});
+
+// add animation to the view
+function createGridClipShape$3(rect, seriesModel, cb) {
+    var rectEl = new Rect({
+        shape: {
+            x: rect.x - 10,
+            y: rect.y - 10,
+            width: 0,
+            height: rect.height + 20
+        }
+    });
+    initProps(rectEl, {
+        shape: {
+            width: rect.width + 20,
+            height: rect.height + 20
+        }
+    }, seriesModel, cb);
+
+    return rectEl;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  Using layout algorithm transform the raw data to layout information.
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var themeRiverLayout = function (ecModel, api) {
+
+    ecModel.eachSeriesByType('themeRiver', function (seriesModel) {
+
+        var data = seriesModel.getData();
+
+        var single = seriesModel.coordinateSystem;
+
+        var layoutInfo = {};
+
+        // use the axis boundingRect for view
+        var rect = single.getRect();
+
+        layoutInfo.rect = rect;
+
+        var boundaryGap = seriesModel.get('boundaryGap');
+
+        var axis = single.getAxis();
+
+        layoutInfo.boundaryGap = boundaryGap;
+
+        if (axis.orient === 'horizontal') {
+            boundaryGap[0] = parsePercent$1(boundaryGap[0], rect.height);
+            boundaryGap[1] = parsePercent$1(boundaryGap[1], rect.height);
+            var height = rect.height - boundaryGap[0] - boundaryGap[1];
+            themeRiverLayout$1(data, seriesModel, height);
+        }
+        else {
+            boundaryGap[0] = parsePercent$1(boundaryGap[0], rect.width);
+            boundaryGap[1] = parsePercent$1(boundaryGap[1], rect.width);
+            var width = rect.width - boundaryGap[0] - boundaryGap[1];
+            themeRiverLayout$1(data, seriesModel, width);
+        }
+
+        data.setLayout('layoutInfo', layoutInfo);
+    });
+};
+
+/**
+ * The layout information about themeriver
+ *
+ * @param {module:echarts/data/List} data  data in the series
+ * @param {module:echarts/model/Series} seriesModel  the model object of themeRiver series
+ * @param {number} height  value used to compute every series height
+ */
+function themeRiverLayout$1(data, seriesModel, height) {
+    if (!data.count()) {
+        return;
+    }
+    var coordSys = seriesModel.coordinateSystem;
+    // the data in each layer are organized into a series.
+    var layerSeries = seriesModel.getLayerSeries();
+
+    // the points in each layer.
+    var timeDim = data.mapDimension('single');
+    var valueDim = data.mapDimension('value');
+    var layerPoints = map(layerSeries, function (singleLayer) {
+        return map(singleLayer.indices, function (idx) {
+            var pt = coordSys.dataToPoint(data.get(timeDim, idx));
+            pt[1] = data.get(valueDim, idx);
+            return pt;
+        });
+    });
+
+    var base = computeBaseline(layerPoints);
+    var baseLine = base.y0;
+    var ky = height / base.max;
+
+    // set layout information for each item.
+    var n = layerSeries.length;
+    var m = layerSeries[0].indices.length;
+    var baseY0;
+    for (var j = 0; j < m; ++j) {
+        baseY0 = baseLine[j] * ky;
+        data.setItemLayout(layerSeries[0].indices[j], {
+            layerIndex: 0,
+            x: layerPoints[0][j][0],
+            y0: baseY0,
+            y: layerPoints[0][j][1] * ky
+        });
+        for (var i = 1; i < n; ++i) {
+            baseY0 += layerPoints[i - 1][j][1] * ky;
+            data.setItemLayout(layerSeries[i].indices[j], {
+                layerIndex: i,
+                x: layerPoints[i][j][0],
+                y0: baseY0,
+                y: layerPoints[i][j][1] * ky
+            });
+        }
+    }
+}
+
+/**
+ * Compute the baseLine of the rawdata
+ * Inspired by Lee Byron's paper Stacked Graphs - Geometry & Aesthetics
+ *
+ * @param  {Array.<Array>} data  the points in each layer
+ * @return {Object}
+ */
+function computeBaseline(data) {
+    var layerNum = data.length;
+    var pointNum = data[0].length;
+    var sums = [];
+    var y0 = [];
+    var max = 0;
+    var temp;
+    var base = {};
+
+    for (var i = 0; i < pointNum; ++i) {
+        for (var j = 0, temp = 0; j < layerNum; ++j) {
+            temp += data[j][i][1];
+        }
+        if (temp > max) {
+            max = temp;
+        }
+        sums.push(temp);
+    }
+
+    for (var k = 0; k < pointNum; ++k) {
+        y0[k] = (max - sums[k]) / 2;
+    }
+    max = 0;
+
+    for (var l = 0; l < pointNum; ++l) {
+        var sum = sums[l] + y0[l];
+        if (sum > max) {
+            max = sum;
+        }
+    }
+    base.y0 = y0;
+    base.max = max;
+
+    return base;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual encoding for themeRiver view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+var themeRiverVisual = function (ecModel) {
+    ecModel.eachSeriesByType('themeRiver', function (seriesModel) {
+        var data = seriesModel.getData();
+        var rawData = seriesModel.getRawData();
+        var colorList = seriesModel.get('color');
+        var idxMap = createHashMap();
+
+        data.each(function (idx) {
+            idxMap.set(data.getRawIndex(idx), idx);
+        });
+
+        rawData.each(function (rawIndex) {
+            var name = rawData.getName(rawIndex);
+            var color = colorList[(seriesModel.nameMap.get(name) - 1) % colorList.length];
+
+            rawData.setItemVisual(rawIndex, 'color', color);
+
+            var idx = idxMap.get(rawIndex);
+
+            if (idx != null) {
+                data.setItemVisual(idx, 'color', color);
+            }
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(themeRiverLayout);
+registerVisual(themeRiverVisual);
+registerProcessor(dataFilter('themeRiver'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.sunburst',
+
+    /**
+     * @type {module:echarts/data/Tree~Node}
+     */
+    _viewRoot: null,
+
+    getInitialData: function (option, ecModel) {
+        // Create a virtual root.
+        var root = { name: option.name, children: option.data };
+
+        completeTreeValue$1(root);
+
+        var levels = option.levels || [];
+
+        // levels = option.levels = setDefault(levels, ecModel);
+
+        var treeOption = {};
+
+        treeOption.levels = levels;
+
+        // Make sure always a new tree is created when setOption,
+        // in TreemapView, we check whether oldTree === newTree
+        // to choose mappings approach among old shapes and new shapes.
+        return Tree.createTree(root, this, treeOption).data;
+    },
+
+    optionUpdated: function () {
+        this.resetViewRoot();
+    },
+
+    /*
+     * @override
+     */
+    getDataParams: function (dataIndex) {
+        var params = SeriesModel.prototype.getDataParams.apply(this, arguments);
+
+        var node = this.getData().tree.getNodeByDataIndex(dataIndex);
+        params.treePathInfo = wrapTreePathInfo(node, this);
+
+        return params;
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        // 默认全局居中
+        center: ['50%', '50%'],
+        radius: [0, '75%'],
+        // 默认顺时针
+        clockwise: true,
+        startAngle: 90,
+        // 最小角度改为0
+        minAngle: 0,
+
+        percentPrecision: 2,
+
+        // If still show when all data zero.
+        stillShowZeroSum: true,
+
+        // Policy of highlighting pieces when hover on one
+        // Valid values: 'none' (for not downplay others), 'descendant',
+        // 'ancestor', 'self'
+        highlightPolicy: 'descendant',
+
+        // 'rootToNode', 'link', or false
+        nodeClick: 'rootToNode',
+
+        renderLabelForZeroData: false,
+
+        label: {
+            // could be: 'radial', 'tangential', or 'none'
+            rotate: 'radial',
+            show: true,
+            opacity: 1,
+            // 'left' is for inner side of inside, and 'right' is for outter
+            // side for inside
+            align: 'center',
+            position: 'inside',
+            distance: 5,
+            silent: true,
+            emphasis: {}
+        },
+        itemStyle: {
+            borderWidth: 1,
+            borderColor: 'white',
+            opacity: 1,
+            emphasis: {},
+            highlight: {
+                opacity: 1
+            },
+            downplay: {
+                opacity: 0.9
+            }
+        },
+
+        // Animation type canbe expansion, scale
+        animationType: 'expansion',
+        animationDuration: 1000,
+        animationDurationUpdate: 500,
+        animationEasing: 'cubicOut',
+
+        data: [],
+
+        levels: [],
+
+        /**
+         * Sort order.
+         *
+         * Valid values: 'desc', 'asc', null, or callback function.
+         * 'desc' and 'asc' for descend and ascendant order;
+         * null for not sorting;
+         * example of callback function:
+         * function(nodeA, nodeB) {
+         *     return nodeA.getValue() - nodeB.getValue();
+         * }
+         */
+        sort: 'desc'
+    },
+
+    getViewRoot: function () {
+        return this._viewRoot;
+    },
+
+    /**
+     * @param {module:echarts/data/Tree~Node} [viewRoot]
+     */
+    resetViewRoot: function (viewRoot) {
+        viewRoot
+            ? (this._viewRoot = viewRoot)
+            : (viewRoot = this._viewRoot);
+
+        var root = this.getRawData().tree.root;
+
+        if (!viewRoot
+            || (viewRoot !== root && !root.contains(viewRoot))
+        ) {
+            this._viewRoot = root;
+        }
+    }
+});
+
+
+
+/**
+ * @param {Object} dataNode
+ */
+function completeTreeValue$1(dataNode) {
+    // Postorder travel tree.
+    // If value of none-leaf node is not set,
+    // calculate it by suming up the value of all children.
+    var sum = 0;
+
+    each$1(dataNode.children, function (child) {
+
+        completeTreeValue$1(child);
+
+        var childValue = child.value;
+        isArray(childValue) && (childValue = childValue[0]);
+
+        sum += childValue;
+    });
+
+    var thisValue = dataNode.value;
+    if (isArray(thisValue)) {
+        thisValue = thisValue[0];
+    }
+
+    if (thisValue == null || isNaN(thisValue)) {
+        thisValue = sum;
+    }
+    // Value should not less than 0.
+    if (thisValue < 0) {
+        thisValue = 0;
+    }
+
+    isArray(dataNode.value)
+        ? (dataNode.value[0] = thisValue)
+        : (dataNode.value = thisValue);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var NodeHighlightPolicy = {
+    NONE: 'none', // not downplay others
+    DESCENDANT: 'descendant',
+    ANCESTOR: 'ancestor',
+    SELF: 'self'
+};
+
+var DEFAULT_SECTOR_Z = 2;
+var DEFAULT_TEXT_Z = 4;
+
+/**
+ * Sunburstce of Sunburst including Sector, Label, LabelLine
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ */
+function SunburstPiece(node, seriesModel, ecModel) {
+
+    Group.call(this);
+
+    var sector = new Sector({
+        z2: DEFAULT_SECTOR_Z
+    });
+    sector.seriesIndex = seriesModel.seriesIndex;
+
+    var text = new Text({
+        z2: DEFAULT_TEXT_Z,
+        silent: node.getModel('label').get('silent')
+    });
+    this.add(sector);
+    this.add(text);
+
+    this.updateData(true, node, 'normal', seriesModel, ecModel);
+
+    // Hover to change label and labelLine
+    function onEmphasis() {
+        text.ignore = text.hoverIgnore;
+    }
+    function onNormal() {
+        text.ignore = text.normalIgnore;
+    }
+    this.on('emphasis', onEmphasis)
+        .on('normal', onNormal)
+        .on('mouseover', onEmphasis)
+        .on('mouseout', onNormal);
+}
+
+var SunburstPieceProto = SunburstPiece.prototype;
+
+SunburstPieceProto.updateData = function (
+    firstCreate,
+    node,
+    state,
+    seriesModel,
+    ecModel
+) {
+    this.node = node;
+    node.piece = this;
+
+    seriesModel = seriesModel || this._seriesModel;
+    ecModel = ecModel || this._ecModel;
+
+    var sector = this.childAt(0);
+    sector.dataIndex = node.dataIndex;
+
+    var itemModel = node.getModel();
+    var layout = node.getLayout();
+    if (!layout) {
+        console.log(node.getLayout());
+    }
+    var sectorShape = extend({}, layout);
+    sectorShape.label = null;
+
+    var visualColor = getNodeColor(node, seriesModel, ecModel);
+
+    var normalStyle = itemModel.getModel('itemStyle').getItemStyle();
+    var style;
+    if (state === 'normal') {
+        style = normalStyle;
+    }
+    else {
+        var stateStyle = itemModel.getModel(state + '.itemStyle')
+            .getItemStyle();
+        style = merge(stateStyle, normalStyle);
+    }
+    style = defaults(
+        {
+            lineJoin: 'bevel',
+            fill: style.fill || visualColor
+        },
+        style
+    );
+
+    if (firstCreate) {
+        sector.setShape(sectorShape);
+        sector.shape.r = layout.r0;
+        updateProps(
+            sector,
+            {
+                shape: {
+                    r: layout.r
+                }
+            },
+            seriesModel,
+            node.dataIndex
+        );
+        sector.useStyle(style);
+    }
+    else if (typeof style.fill === 'object' && style.fill.type
+        || typeof sector.style.fill === 'object' && sector.style.fill.type
+    ) {
+        // Disable animation for gradient since no interpolation method
+        // is supported for gradient
+        updateProps(sector, {
+            shape: sectorShape
+        }, seriesModel);
+        sector.useStyle(style);
+    }
+    else {
+        updateProps(sector, {
+            shape: sectorShape,
+            style: style
+        }, seriesModel);
+    }
+
+    this._updateLabel(seriesModel, visualColor, state);
+
+    var cursorStyle = itemModel.getShallow('cursor');
+    cursorStyle && sector.attr('cursor', cursorStyle);
+
+    if (firstCreate) {
+        var highlightPolicy = seriesModel.getShallow('highlightPolicy');
+        this._initEvents(sector, node, seriesModel, highlightPolicy);
+    }
+
+    this._seriesModel = seriesModel || this._seriesModel;
+    this._ecModel = ecModel || this._ecModel;
+};
+
+SunburstPieceProto.onEmphasis = function (highlightPolicy) {
+    var that = this;
+    this.node.hostTree.root.eachNode(function (n) {
+        if (n.piece) {
+            if (that.node === n) {
+                n.piece.updateData(false, n, 'emphasis');
+            }
+            else if (isNodeHighlighted(n, that.node, highlightPolicy)) {
+                n.piece.childAt(0).trigger('highlight');
+            }
+            else if (highlightPolicy !== NodeHighlightPolicy.NONE) {
+                n.piece.childAt(0).trigger('downplay');
+            }
+        }
+    });
+};
+
+SunburstPieceProto.onNormal = function () {
+    this.node.hostTree.root.eachNode(function (n) {
+        if (n.piece) {
+            n.piece.updateData(false, n, 'normal');
+        }
+    });
+};
+
+SunburstPieceProto.onHighlight = function () {
+    this.updateData(false, this.node, 'highlight');
+};
+
+SunburstPieceProto.onDownplay = function () {
+    this.updateData(false, this.node, 'downplay');
+};
+
+SunburstPieceProto._updateLabel = function (seriesModel, visualColor, state) {
+    var itemModel = this.node.getModel();
+    var normalModel = itemModel.getModel('label');
+    var labelModel = state === 'normal' || state === 'emphasis'
+        ? normalModel
+        : itemModel.getModel(state + '.label');
+    var labelHoverModel = itemModel.getModel('emphasis.label');
+
+    var text = retrieve(
+        seriesModel.getFormattedLabel(
+            this.node.dataIndex, 'normal', null, null, 'label'
+        ),
+        this.node.name
+    );
+    if (getLabelAttr('show') === false) {
+        text = '';
+    }
+
+    var layout = this.node.getLayout();
+    var labelMinAngle = labelModel.get('minAngle');
+    if (labelMinAngle == null) {
+        labelMinAngle = normalModel.get('minAngle');
+    }
+    labelMinAngle = labelMinAngle / 180 * Math.PI;
+    var angle = layout.endAngle - layout.startAngle;
+    if (labelMinAngle != null && Math.abs(angle) < labelMinAngle) {
+        // Not displaying text when angle is too small
+        text = '';
+    }
+
+    var label = this.childAt(1);
+
+    setLabelStyle(
+        label.style, label.hoverStyle || {}, normalModel, labelHoverModel,
+        {
+            defaultText: labelModel.getShallow('show') ? text : null,
+            autoColor: visualColor,
+            useInsideStyle: true
+        }
+    );
+
+    var midAngle = (layout.startAngle + layout.endAngle) / 2;
+    var dx = Math.cos(midAngle);
+    var dy = Math.sin(midAngle);
+
+    var r;
+    var labelPosition = getLabelAttr('position');
+    var labelPadding = getLabelAttr('distance') || 0;
+    var textAlign = getLabelAttr('align');
+    if (labelPosition === 'outside') {
+        r = layout.r + labelPadding;
+        textAlign = midAngle > Math.PI / 2 ? 'right' : 'left';
+    }
+    else {
+        if (!textAlign || textAlign === 'center') {
+            r = (layout.r + layout.r0) / 2;
+            textAlign = 'center';
+        }
+        else if (textAlign === 'left') {
+            r = layout.r0 + labelPadding;
+            if (midAngle > Math.PI / 2) {
+                textAlign = 'right';
+            }
+        }
+        else if (textAlign === 'right') {
+            r = layout.r - labelPadding;
+            if (midAngle > Math.PI / 2) {
+                textAlign = 'left';
+            }
+        }
+    }
+
+    label.attr('style', {
+        text: text,
+        textAlign: textAlign,
+        textVerticalAlign: getLabelAttr('verticalAlign') || 'middle',
+        opacity: getLabelAttr('opacity')
+    });
+
+    var textX = r * dx + layout.cx;
+    var textY = r * dy + layout.cy;
+    label.attr('position', [textX, textY]);
+
+    var rotateType = getLabelAttr('rotate');
+    var rotate = 0;
+    if (rotateType === 'radial') {
+        rotate = -midAngle;
+        if (rotate < -Math.PI / 2) {
+            rotate += Math.PI;
+        }
+    }
+    else if (rotateType === 'tangential') {
+        rotate = Math.PI / 2 - midAngle;
+        if (rotate > Math.PI / 2) {
+            rotate -= Math.PI;
+        }
+        else if (rotate < -Math.PI / 2) {
+            rotate += Math.PI;
+        }
+    } else if (typeof rotateType === 'number') {
+        rotate = rotateType * Math.PI / 180;
+    }
+    label.attr('rotation', rotate);
+
+    function getLabelAttr(name) {
+        var stateAttr = labelModel.get(name);
+        if (stateAttr == null) {
+            return normalModel.get(name);
+        }
+        else {
+            return stateAttr;
+        }
+    }
+};
+
+SunburstPieceProto._initEvents = function (
+    sector,
+    node,
+    seriesModel,
+    highlightPolicy
+) {
+    sector.off('mouseover').off('mouseout').off('emphasis').off('normal');
+
+    var that = this;
+    var onEmphasis = function () {
+        that.onEmphasis(highlightPolicy);
+    };
+    var onNormal = function () {
+        that.onNormal();
+    };
+    var onDownplay = function () {
+        that.onDownplay();
+    };
+    var onHighlight = function () {
+        that.onHighlight();
+    };
+
+    if (seriesModel.isAnimationEnabled()) {
+        sector
+            .on('mouseover', onEmphasis)
+            .on('mouseout', onNormal)
+            .on('emphasis', onEmphasis)
+            .on('normal', onNormal)
+            .on('downplay', onDownplay)
+            .on('highlight', onHighlight);
+    }
+};
+
+inherits(SunburstPiece, Group);
+
+/**
+ * Get node color
+ *
+ * @param {TreeNode} node the node to get color
+ * @param {module:echarts/model/Series} seriesModel series
+ * @param {module:echarts/model/Global} ecModel echarts defaults
+ */
+function getNodeColor(node, seriesModel, ecModel) {
+    // Color from visualMap
+    var visualColor = node.getVisual('color');
+    var visualMetaList = node.getVisual('visualMeta');
+    if (!visualMetaList || visualMetaList.length === 0) {
+        // Use first-generation color if has no visualMap
+        visualColor = null;
+    }
+
+    // Self color or level color
+    var color = node.getModel('itemStyle').get('color');
+    if (color) {
+        return color;
+    }
+    else if (visualColor) {
+        // Color mapping
+        return visualColor;
+    }
+    else if (node.depth === 0) {
+        // Virtual root node
+        return ecModel.option.color[0];
+    }
+    else {
+        // First-generation color
+        var length = ecModel.option.color.length;
+        color = ecModel.option.color[getRootId(node) % length];
+    }
+    return color;
+}
+
+/**
+ * Get index of root in sorted order
+ *
+ * @param {TreeNode} node current node
+ * @return {number} index in root
+ */
+function getRootId(node) {
+    var ancestor = node;
+    while (ancestor.depth > 1) {
+        ancestor = ancestor.parentNode;
+    }
+
+    var virtualRoot = node.getAncestors()[0];
+    return indexOf(virtualRoot.children, ancestor);
+}
+
+function isNodeHighlighted(node, activeNode, policy) {
+    if (policy === NodeHighlightPolicy.NONE) {
+        return false;
+    }
+    else if (policy === NodeHighlightPolicy.SELF) {
+        return node === activeNode;
+    }
+    else if (policy === NodeHighlightPolicy.ANCESTOR) {
+        return node === activeNode || node.isAncestorOf(activeNode);
+    }
+    else {
+        return node === activeNode || node.isDescendantOf(activeNode);
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ROOT_TO_NODE_ACTION = 'sunburstRootToNode';
+
+var SunburstView = Chart.extend({
+
+    type: 'sunburst',
+
+    init: function () {
+    },
+
+    render: function (seriesModel, ecModel, api, payload) {
+        var that = this;
+
+        this.seriesModel = seriesModel;
+        this.api = api;
+        this.ecModel = ecModel;
+
+        var data = seriesModel.getData();
+        var virtualRoot = data.tree.root;
+
+        var newRoot = seriesModel.getViewRoot();
+
+        var group = this.group;
+
+        var renderLabelForZeroData = seriesModel.get('renderLabelForZeroData');
+
+        var newChildren = [];
+        newRoot.eachNode(function (node) {
+            newChildren.push(node);
+        });
+        var oldChildren = this._oldChildren || [];
+
+        dualTravel(newChildren, oldChildren);
+
+        renderRollUp(virtualRoot, newRoot);
+
+        if (payload && payload.highlight && payload.highlight.piece) {
+            var highlightPolicy = seriesModel.getShallow('highlightPolicy');
+            payload.highlight.piece.onEmphasis(highlightPolicy);
+        }
+        else if (payload && payload.unhighlight) {
+            var piece = this.virtualPiece;
+            if (!piece && virtualRoot.children.length) {
+                piece = virtualRoot.children[0].piece;
+            }
+            if (piece) {
+                piece.onNormal();
+            }
+        }
+
+        this._initEvents();
+
+        this._oldChildren = newChildren;
+
+        function dualTravel(newChildren, oldChildren) {
+            if (newChildren.length === 0 && oldChildren.length === 0) {
+                return;
+            }
+
+            new DataDiffer(oldChildren, newChildren, getKey, getKey)
+                .add(processNode)
+                .update(processNode)
+                .remove(curry(processNode, null))
+                .execute();
+
+            function getKey(node) {
+                return node.getId();
+            }
+
+            function processNode(newId, oldId) {
+                var newNode = newId == null ? null : newChildren[newId];
+                var oldNode = oldId == null ? null : oldChildren[oldId];
+
+                doRenderNode(newNode, oldNode);
+            }
+        }
+
+        function doRenderNode(newNode, oldNode) {
+            if (!renderLabelForZeroData && newNode && !newNode.getValue()) {
+                // Not render data with value 0
+                newNode = null;
+            }
+
+            if (newNode !== virtualRoot && oldNode !== virtualRoot) {
+                if (oldNode && oldNode.piece) {
+                    if (newNode) {
+                        // Update
+                        oldNode.piece.updateData(
+                            false, newNode, 'normal', seriesModel, ecModel);
+
+                        // For tooltip
+                        data.setItemGraphicEl(newNode.dataIndex, oldNode.piece);
+                    }
+                    else {
+                        // Remove
+                        removeNode(oldNode);
+                    }
+                }
+                else if (newNode) {
+                    // Add
+                    var piece = new SunburstPiece(
+                        newNode,
+                        seriesModel,
+                        ecModel
+                    );
+                    group.add(piece);
+
+                    // For tooltip
+                    data.setItemGraphicEl(newNode.dataIndex, piece);
+                }
+            }
+        }
+
+        function removeNode(node) {
+            if (!node) {
+                return;
+            }
+
+            if (node.piece) {
+                group.remove(node.piece);
+                node.piece = null;
+            }
+        }
+
+        function renderRollUp(virtualRoot, viewRoot) {
+            if (viewRoot.depth > 0) {
+                // Render
+                if (that.virtualPiece) {
+                    // Update
+                    that.virtualPiece.updateData(
+                        false, virtualRoot, 'normal', seriesModel, ecModel);
+                }
+                else {
+                    // Add
+                    that.virtualPiece = new SunburstPiece(
+                        virtualRoot,
+                        seriesModel,
+                        ecModel
+                    );
+                    group.add(that.virtualPiece);
+                }
+
+                if (viewRoot.piece._onclickEvent) {
+                    viewRoot.piece.off('click', viewRoot.piece._onclickEvent);
+                }
+                var event = function (e) {
+                    that._rootToNode(viewRoot.parentNode);
+                };
+                viewRoot.piece._onclickEvent = event;
+                that.virtualPiece.on('click', event);
+            }
+            else if (that.virtualPiece) {
+                // Remove
+                group.remove(that.virtualPiece);
+                that.virtualPiece = null;
+            }
+        }
+    },
+
+    dispose: function () {
+    },
+
+    /**
+     * @private
+     */
+    _initEvents: function () {
+        var that = this;
+
+        var event = function (e) {
+            var targetFound = false;
+            var viewRoot = that.seriesModel.getViewRoot();
+            viewRoot.eachNode(function (node) {
+                if (!targetFound
+                    && node.piece && node.piece.childAt(0) === e.target
+                ) {
+                    var nodeClick = node.getModel().get('nodeClick');
+                    if (nodeClick === 'rootToNode') {
+                        that._rootToNode(node);
+                    }
+                    else if (nodeClick === 'link') {
+                        var itemModel = node.getModel();
+                        var link = itemModel.get('link');
+                        if (link) {
+                            var linkTarget = itemModel.get('target', true)
+                                || '_blank';
+                            window.open(link, linkTarget);
+                        }
+                    }
+                    targetFound = true;
+                }
+            });
+        };
+
+        if (this.group._onclickEvent) {
+            this.group.off('click', this.group._onclickEvent);
+        }
+        this.group.on('click', event);
+        this.group._onclickEvent = event;
+    },
+
+    /**
+     * @private
+     */
+    _rootToNode: function (node) {
+        if (node !== this.seriesModel.getViewRoot()) {
+            this.api.dispatchAction({
+                type: ROOT_TO_NODE_ACTION,
+                from: this.uid,
+                seriesId: this.seriesModel.id,
+                targetNode: node
+            });
+        }
+    },
+
+    /**
+     * @implement
+     */
+    containPoint: function (point, seriesModel) {
+        var treeRoot = seriesModel.getData();
+        var itemLayout = treeRoot.getItemLayout(0);
+        if (itemLayout) {
+            var dx = point[0] - itemLayout.cx;
+            var dy = point[1] - itemLayout.cy;
+            var radius = Math.sqrt(dx * dx + dy * dy);
+            return radius <= itemLayout.r && radius >= itemLayout.r0;
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Sunburst action
+ */
+
+var ROOT_TO_NODE_ACTION$1 = 'sunburstRootToNode';
+
+registerAction(
+    {type: ROOT_TO_NODE_ACTION$1, update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'sunburst', query: payload},
+            handleRootToNode
+        );
+
+        function handleRootToNode(model, index) {
+            var targetInfo = retrieveTargetInfo(payload, [ROOT_TO_NODE_ACTION$1], model);
+
+            if (targetInfo) {
+                var originViewRoot = model.getViewRoot();
+                if (originViewRoot) {
+                    payload.direction = aboveViewRoot(originViewRoot, targetInfo.node)
+                        ? 'rollUp' : 'drillDown';
+                }
+                model.resetViewRoot(targetInfo.node);
+            }
+        }
+    }
+);
+
+
+var HIGHLIGHT_ACTION = 'sunburstHighlight';
+
+registerAction(
+    {type: HIGHLIGHT_ACTION, update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'sunburst', query: payload},
+            handleHighlight
+        );
+
+        function handleHighlight(model, index) {
+            var targetInfo = retrieveTargetInfo(payload, [HIGHLIGHT_ACTION], model);
+
+            if (targetInfo) {
+                payload.highlight = targetInfo.node;
+            }
+        }
+    }
+);
+
+
+var UNHIGHLIGHT_ACTION = 'sunburstUnhighlight';
+
+registerAction(
+    {type: UNHIGHLIGHT_ACTION, update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'sunburst', query: payload},
+            handleUnhighlight
+        );
+
+        function handleUnhighlight(model, index) {
+            payload.unhighlight = true;
+        }
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var RADIAN$1 = Math.PI / 180;
+
+var sunburstLayout = function (seriesType, ecModel, api, payload) {
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        var center = seriesModel.get('center');
+        var radius = seriesModel.get('radius');
+
+        if (!isArray(radius)) {
+            radius = [0, radius];
+        }
+        if (!isArray(center)) {
+            center = [center, center];
+        }
+
+        var width = api.getWidth();
+        var height = api.getHeight();
+        var size = Math.min(width, height);
+        var cx = parsePercent$1(center[0], width);
+        var cy = parsePercent$1(center[1], height);
+        var r0 = parsePercent$1(radius[0], size / 2);
+        var r = parsePercent$1(radius[1], size / 2);
+
+        var startAngle = -seriesModel.get('startAngle') * RADIAN$1;
+        var minAngle = seriesModel.get('minAngle') * RADIAN$1;
+
+        var virtualRoot = seriesModel.getData().tree.root;
+        var treeRoot = seriesModel.getViewRoot();
+        var rootDepth = treeRoot.depth;
+
+        var sort = seriesModel.get('sort');
+        if (sort != null) {
+            initChildren$1(treeRoot, sort);
+        }
+
+        var validDataCount = 0;
+        each$1(treeRoot.children, function (child) {
+            !isNaN(child.getValue()) && validDataCount++;
+        });
+
+        var sum = treeRoot.getValue();
+        // Sum may be 0
+        var unitRadian = Math.PI / (sum || validDataCount) * 2;
+
+        var renderRollupNode = treeRoot.depth > 0;
+        var levels = treeRoot.height - (renderRollupNode ? -1 : 1);
+        var rPerLevel = (r - r0) / (levels || 1);
+
+        var clockwise = seriesModel.get('clockwise');
+
+        var stillShowZeroSum = seriesModel.get('stillShowZeroSum');
+
+        // In the case some sector angle is smaller than minAngle
+        var dir = clockwise ? 1 : -1;
+
+        /**
+         * Render a tree
+         * @return increased angle
+         */
+        var renderNode = function (node, startAngle) {
+            if (!node) {
+                return;
+            }
+
+            var endAngle = startAngle;
+
+            // Render self
+            if (node !== virtualRoot) {
+                // Tree node is virtual, so it doesn't need to be drawn
+                var value = node.getValue();
+
+                var angle = (sum === 0 && stillShowZeroSum)
+                    ? unitRadian : (value * unitRadian);
+                if (angle < minAngle) {
+                    angle = minAngle;
+                    
+                }
+                else {
+                    
+                }
+
+                endAngle = startAngle + dir * angle;
+
+                var depth = node.depth - rootDepth
+                    - (renderRollupNode ? -1 : 1);
+                var rStart = r0 + rPerLevel * depth;
+                var rEnd = r0 + rPerLevel * (depth + 1);
+
+                var itemModel = node.getModel();
+                if (itemModel.get('r0') != null) {
+                    rStart = parsePercent$1(itemModel.get('r0'), size / 2);
+                }
+                if (itemModel.get('r') != null) {
+                    rEnd = parsePercent$1(itemModel.get('r'), size / 2);
+                }
+
+                node.setLayout({
+                    angle: angle,
+                    startAngle: startAngle,
+                    endAngle: endAngle,
+                    clockwise: clockwise,
+                    cx: cx,
+                    cy: cy,
+                    r0: rStart,
+                    r: rEnd
+                });
+            }
+
+            // Render children
+            if (node.children && node.children.length) {
+                // currentAngle = startAngle;
+                var siblingAngle = 0;
+                each$1(node.children, function (node) {
+                    siblingAngle += renderNode(node, startAngle + siblingAngle);
+                });
+            }
+
+            return endAngle - startAngle;
+        };
+
+        // Virtual root node for roll up
+        if (renderRollupNode) {
+            var rStart = r0;
+            var rEnd = r0 + rPerLevel;
+
+            var angle = Math.PI * 2;
+            virtualRoot.setLayout({
+                angle: angle,
+                startAngle: startAngle,
+                endAngle: startAngle + angle,
+                clockwise: clockwise,
+                cx: cx,
+                cy: cy,
+                r0: rStart,
+                r: rEnd
+            });
+        }
+
+        renderNode(treeRoot, startAngle);
+    });
+};
+
+/**
+ * Init node children by order and update visual
+ *
+ * @param {TreeNode} node  root node
+ * @param {boolean}  isAsc if is in ascendant order
+ */
+function initChildren$1(node, isAsc) {
+    var children = node.children || [];
+
+    node.children = sort$2(children, isAsc);
+
+    // Init children recursively
+    if (children.length) {
+        each$1(node.children, function (child) {
+            initChildren$1(child, isAsc);
+        });
+    }
+}
+
+/**
+ * Sort children nodes
+ *
+ * @param {TreeNode[]}               children children of node to be sorted
+ * @param {string | function | null} sort sort method
+ *                                   See SunburstSeries.js for details.
+ */
+function sort$2(children, sortOrder) {
+    if (typeof sortOrder === 'function') {
+        return children.sort(sortOrder);
+    }
+    else {
+        var isAsc = sortOrder === 'asc';
+        return children.sort(function (a, b) {
+            var diff = (a.getValue() - b.getValue()) * (isAsc ? 1 : -1);
+            return diff === 0
+                ? (a.dataIndex - b.dataIndex) * (isAsc ? -1 : 1)
+                : diff;
+        });
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(curry(dataColor, 'sunburst'));
+registerLayout(curry(sunburstLayout, 'sunburst'));
+registerProcessor(curry(dataFilter, 'sunburst'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize(dataSize, dataItem) {
+    // dataItem is necessary in log axis.
+    dataItem = dataItem || [0, 0];
+    return map(['x', 'y'], function (dim, dimIdx) {
+        var axis = this.getAxis(dim);
+        var val = dataItem[dimIdx];
+        var halfSize = dataSize[dimIdx] / 2;
+        return axis.type === 'category'
+            ? axis.getBandWidth()
+            : Math.abs(axis.dataToCoord(val - halfSize) - axis.dataToCoord(val + halfSize));
+    }, this);
+}
+
+var prepareCartesian2d = function (coordSys) {
+    var rect = coordSys.grid.getRect();
+    return {
+        coordSys: {
+            // The name exposed to user is always 'cartesian2d' but not 'grid'.
+            type: 'cartesian2d',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        api: {
+            coord: function (data) {
+                // do not provide "out" param
+                return coordSys.dataToPoint(data);
+            },
+            size: bind(dataToCoordSize, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize$1(dataSize, dataItem) {
+    dataItem = dataItem || [0, 0];
+    return map([0, 1], function (dimIdx) {
+        var val = dataItem[dimIdx];
+        var halfSize = dataSize[dimIdx] / 2;
+        var p1 = [];
+        var p2 = [];
+        p1[dimIdx] = val - halfSize;
+        p2[dimIdx] = val + halfSize;
+        p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx];
+        return Math.abs(this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]);
+    }, this);
+}
+
+var prepareGeo = function (coordSys) {
+    var rect = coordSys.getBoundingRect();
+    return {
+        coordSys: {
+            type: 'geo',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        api: {
+            coord: function (data) {
+                // do not provide "out" and noRoam param,
+                // Compatible with this usage:
+                // echarts.util.map(item.points, api.coord)
+                return coordSys.dataToPoint(data);
+            },
+            size: bind(dataToCoordSize$1, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize$2(dataSize, dataItem) {
+    // dataItem is necessary in log axis.
+    var axis = this.getAxis();
+    var val = dataItem instanceof Array ? dataItem[0] : dataItem;
+    var halfSize = (dataSize instanceof Array ? dataSize[0] : dataSize) / 2;
+    return axis.type === 'category'
+        ? axis.getBandWidth()
+        : Math.abs(axis.dataToCoord(val - halfSize) - axis.dataToCoord(val + halfSize));
+}
+
+var prepareSingleAxis = function (coordSys) {
+    var rect = coordSys.getRect();
+
+    return {
+        coordSys: {
+            type: 'singleAxis',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        api: {
+            coord: function (val) {
+                // do not provide "out" param
+                return coordSys.dataToPoint(val);
+            },
+            size: bind(dataToCoordSize$2, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize$3(dataSize, dataItem) {
+    // dataItem is necessary in log axis.
+    return map(['Radius', 'Angle'], function (dim, dimIdx) {
+        var axis = this['get' + dim + 'Axis']();
+        var val = dataItem[dimIdx];
+        var halfSize = dataSize[dimIdx] / 2;
+        var method = 'dataTo' + dim;
+
+        var result = axis.type === 'category'
+            ? axis.getBandWidth()
+            : Math.abs(axis[method](val - halfSize) - axis[method](val + halfSize));
+
+        if (dim === 'Angle') {
+            result = result * Math.PI / 180;
+        }
+
+        return result;
+
+    }, this);
+}
+
+var preparePolar = function (coordSys) {
+    var radiusAxis = coordSys.getRadiusAxis();
+    var angleAxis = coordSys.getAngleAxis();
+    var radius = radiusAxis.getExtent();
+    radius[0] > radius[1] && radius.reverse();
+
+    return {
+        coordSys: {
+            type: 'polar',
+            cx: coordSys.cx,
+            cy: coordSys.cy,
+            r: radius[1],
+            r0: radius[0]
+        },
+        api: {
+            coord: bind(function (data) {
+                var radius = radiusAxis.dataToRadius(data[0]);
+                var angle = angleAxis.dataToAngle(data[1]);
+                var coord = coordSys.coordToPoint([radius, angle]);
+                coord.push(radius, angle * Math.PI / 180);
+                return coord;
+            }),
+            size: bind(dataToCoordSize$3, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var prepareCalendar = function (coordSys) {
+    var rect = coordSys.getRect();
+    var rangeInfo = coordSys.getRangeInfo();
+
+    return {
+        coordSys: {
+            type: 'calendar',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height,
+            cellWidth: coordSys.getCellWidth(),
+            cellHeight: coordSys.getCellHeight(),
+            rangeInfo: {
+                start: rangeInfo.start,
+                end: rangeInfo.end,
+                weeks: rangeInfo.weeks,
+                dayCount: rangeInfo.allDay
+            }
+        },
+        api: {
+            coord: function (data, clamp) {
+                return coordSys.dataToPoint(data, clamp);
+            }
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ITEM_STYLE_NORMAL_PATH = ['itemStyle'];
+var ITEM_STYLE_EMPHASIS_PATH = ['emphasis', 'itemStyle'];
+var LABEL_NORMAL = ['label'];
+var LABEL_EMPHASIS = ['emphasis', 'label'];
+// Use prefix to avoid index to be the same as el.name,
+// which will cause weird udpate animation.
+var GROUP_DIFF_PREFIX = 'e\0\0';
+
+/**
+ * To reduce total package size of each coordinate systems, the modules `prepareCustom`
+ * of each coordinate systems are not required by each coordinate systems directly, but
+ * required by the module `custom`.
+ *
+ * prepareInfoForCustomSeries {Function}: optional
+ *     @return {Object} {coordSys: {...}, api: {
+ *         coord: function (data, clamp) {}, // return point in global.
+ *         size: function (dataSize, dataItem) {} // return size of each axis in coordSys.
+ *     }}
+ */
+var prepareCustoms = {
+    cartesian2d: prepareCartesian2d,
+    geo: prepareGeo,
+    singleAxis: prepareSingleAxis,
+    polar: preparePolar,
+    calendar: prepareCalendar
+};
+
+// ------
+// Model
+// ------
+
+extendSeriesModel({
+
+    type: 'series.custom',
+
+    dependencies: ['grid', 'polar', 'geo', 'singleAxis', 'calendar'],
+
+    defaultOption: {
+        coordinateSystem: 'cartesian2d', // Can be set as 'none'
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Polar coordinate system
+        // polarIndex: 0,
+
+        // Geo coordinate system
+        // geoIndex: 0,
+
+        // label: {}
+        // itemStyle: {}
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    }
+});
+
+// -----
+// View
+// -----
+
+extendChartView({
+
+    type: 'custom',
+
+    /**
+     * @private
+     * @type {module:echarts/data/List}
+     */
+    _data: null,
+
+    /**
+     * @override
+     */
+    render: function (customSeries, ecModel, api) {
+        var oldData = this._data;
+        var data = customSeries.getData();
+        var group = this.group;
+        var renderItem = makeRenderItem(customSeries, data, ecModel, api);
+
+        this.group.removeAll();
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                createOrUpdate$1(
+                    null, newIdx, renderItem(newIdx), customSeries, group, data
+                );
+            })
+            .update(function (newIdx, oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                createOrUpdate$1(
+                    el, newIdx, renderItem(newIdx), customSeries, group, data
+                );
+            })
+            .remove(function (oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                el && group.remove(el);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    incrementalPrepareRender: function (customSeries, ecModel, api) {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    incrementalRender: function (params, customSeries, ecModel, api) {
+        var data = customSeries.getData();
+        var renderItem = makeRenderItem(customSeries, data, ecModel, api);
+        function setIncrementalAndHoverLayer(el) {
+            if (!el.isGroup) {
+                el.incremental = true;
+                el.useHoverLayer = true;
+            }
+        }
+        for (var idx = params.start; idx < params.end; idx++) {
+            var el = createOrUpdate$1(null, idx, renderItem(idx), customSeries, this.group, data);
+            el.traverse(setIncrementalAndHoverLayer);
+        }
+    },
+
+    /**
+     * @override
+     */
+    dispose: noop
+});
+
+
+function createEl(elOption) {
+    var graphicType = elOption.type;
+    var el;
+
+    if (graphicType === 'path') {
+        var shape = elOption.shape;
+        el = makePath(
+            shape.pathData,
+            null,
+            {
+                x: shape.x || 0,
+                y: shape.y || 0,
+                width: shape.width || 0,
+                height: shape.height || 0
+            },
+            'center'
+        );
+        el.__customPathData = elOption.pathData;
+    }
+    else if (graphicType === 'image') {
+        el = new ZImage({
+        });
+        el.__customImagePath = elOption.style.image;
+    }
+    else if (graphicType === 'text') {
+        el = new Text({
+        });
+        el.__customText = elOption.style.text;
+    }
+    else {
+        var Clz = graphic[graphicType.charAt(0).toUpperCase() + graphicType.slice(1)];
+
+        if (__DEV__) {
+            assert$1(Clz, 'graphic type "' + graphicType + '" can not be found.');
+        }
+
+        el = new Clz();
+    }
+
+    el.__customGraphicType = graphicType;
+    el.name = elOption.name;
+
+    return el;
+}
+
+function updateEl(el, dataIndex, elOption, animatableModel, data, isInit) {
+    var targetProps = {};
+    var elOptionStyle = elOption.style || {};
+
+    elOption.shape && (targetProps.shape = clone(elOption.shape));
+    elOption.position && (targetProps.position = elOption.position.slice());
+    elOption.scale && (targetProps.scale = elOption.scale.slice());
+    elOption.origin && (targetProps.origin = elOption.origin.slice());
+    elOption.rotation && (targetProps.rotation = elOption.rotation);
+
+    if (el.type === 'image' && elOption.style) {
+        var targetStyle = targetProps.style = {};
+        each$1(['x', 'y', 'width', 'height'], function (prop) {
+            prepareStyleTransition(prop, targetStyle, elOptionStyle, el.style, isInit);
+        });
+    }
+
+    if (el.type === 'text' && elOption.style) {
+        var targetStyle = targetProps.style = {};
+        each$1(['x', 'y'], function (prop) {
+            prepareStyleTransition(prop, targetStyle, elOptionStyle, el.style, isInit);
+        });
+        // Compatible with previous: both support
+        // textFill and fill, textStroke and stroke in 'text' element.
+        !elOptionStyle.hasOwnProperty('textFill') && elOptionStyle.fill && (
+            elOptionStyle.textFill = elOptionStyle.fill
+        );
+        !elOptionStyle.hasOwnProperty('textStroke') && elOptionStyle.stroke && (
+            elOptionStyle.textStroke = elOptionStyle.stroke
+        );
+    }
+
+    if (el.type !== 'group') {
+        el.useStyle(elOptionStyle);
+
+        // Init animation.
+        if (isInit) {
+            el.style.opacity = 0;
+            var targetOpacity = elOptionStyle.opacity;
+            targetOpacity == null && (targetOpacity = 1);
+            initProps(el, {style: {opacity: targetOpacity}}, animatableModel, dataIndex);
+        }
+    }
+
+    if (isInit) {
+        el.attr(targetProps);
+    }
+    else {
+        updateProps(el, targetProps, animatableModel, dataIndex);
+    }
+
+    // z2 must not be null/undefined, otherwise sort error may occur.
+    el.attr({z2: elOption.z2 || 0, silent: elOption.silent});
+
+    elOption.styleEmphasis !== false && setHoverStyle(el, elOption.styleEmphasis);
+}
+
+function prepareStyleTransition(prop, targetStyle, elOptionStyle, oldElStyle, isInit) {
+    if (elOptionStyle[prop] != null && !isInit) {
+        targetStyle[prop] = elOptionStyle[prop];
+        elOptionStyle[prop] = oldElStyle[prop];
+    }
+}
+
+function makeRenderItem(customSeries, data, ecModel, api) {
+    var renderItem = customSeries.get('renderItem');
+    var coordSys = customSeries.coordinateSystem;
+    var prepareResult = {};
+
+    if (coordSys) {
+        if (__DEV__) {
+            assert$1(renderItem, 'series.render is required.');
+            assert$1(
+                coordSys.prepareCustoms || prepareCustoms[coordSys.type],
+                'This coordSys does not support custom series.'
+            );
+        }
+
+        prepareResult = coordSys.prepareCustoms
+            ? coordSys.prepareCustoms()
+            : prepareCustoms[coordSys.type](coordSys);
+    }
+
+    var userAPI = defaults({
+        getWidth: api.getWidth,
+        getHeight: api.getHeight,
+        getZr: api.getZr,
+        getDevicePixelRatio: api.getDevicePixelRatio,
+        value: value,
+        style: style,
+        styleEmphasis: styleEmphasis,
+        visual: visual,
+        barLayout: barLayout,
+        currentSeriesIndices: currentSeriesIndices,
+        font: font
+    }, prepareResult.api || {});
+
+    var userParams = {
+        context: {},
+        seriesId: customSeries.id,
+        seriesName: customSeries.name,
+        seriesIndex: customSeries.seriesIndex,
+        coordSys: prepareResult.coordSys,
+        dataInsideLength: data.count(),
+        encode: wrapEncodeDef(customSeries.getData())
+    };
+
+    // Do not support call `api` asynchronously without dataIndexInside input.
+    var currDataIndexInside;
+    var currDirty = true;
+    var currItemModel;
+    var currLabelNormalModel;
+    var currLabelEmphasisModel;
+    var currVisualColor;
+
+    return function (dataIndexInside) {
+        currDataIndexInside = dataIndexInside;
+        currDirty = true;
+        return renderItem && renderItem(
+            defaults({
+                dataIndexInside: dataIndexInside,
+                dataIndex: data.getRawIndex(dataIndexInside)
+            }, userParams),
+            userAPI
+        ) || {};
+    };
+
+    // Do not update cache until api called.
+    function updateCache(dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        if (currDirty) {
+            currItemModel = data.getItemModel(dataIndexInside);
+            currLabelNormalModel = currItemModel.getModel(LABEL_NORMAL);
+            currLabelEmphasisModel = currItemModel.getModel(LABEL_EMPHASIS);
+            currVisualColor = data.getItemVisual(dataIndexInside, 'color');
+
+            currDirty = false;
+        }
+    }
+
+    /**
+     * @public
+     * @param {number|string} dim
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     * @return {number|string} value
+     */
+    function value(dim, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        return data.get(data.getDimension(dim || 0), dataIndexInside);
+    }
+
+    /**
+     * By default, `visual` is applied to style (to support visualMap).
+     * `visual.color` is applied at `fill`. If user want apply visual.color on `stroke`,
+     * it can be implemented as:
+     * `api.style({stroke: api.visual('color'), fill: null})`;
+     * @public
+     * @param {Object} [extra]
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     */
+    function style(extra, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        updateCache(dataIndexInside);
+
+        var itemStyle = currItemModel.getModel(ITEM_STYLE_NORMAL_PATH).getItemStyle();
+
+        currVisualColor != null && (itemStyle.fill = currVisualColor);
+        var opacity = data.getItemVisual(dataIndexInside, 'opacity');
+        opacity != null && (itemStyle.opacity = opacity);
+
+        setTextStyle(itemStyle, currLabelNormalModel, null, {
+            autoColor: currVisualColor,
+            isRectText: true
+        });
+
+        itemStyle.text = currLabelNormalModel.getShallow('show')
+            ? retrieve2(
+                customSeries.getFormattedLabel(dataIndexInside, 'normal'),
+                getDefaultLabel(data, dataIndexInside)
+            )
+            : null;
+
+        extra && extend(itemStyle, extra);
+        return itemStyle;
+    }
+
+    /**
+     * @public
+     * @param {Object} [extra]
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     */
+    function styleEmphasis(extra, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        updateCache(dataIndexInside);
+
+        var itemStyle = currItemModel.getModel(ITEM_STYLE_EMPHASIS_PATH).getItemStyle();
+
+        setTextStyle(itemStyle, currLabelEmphasisModel, null, {
+            isRectText: true
+        }, true);
+
+        itemStyle.text = currLabelEmphasisModel.getShallow('show')
+            ? retrieve3(
+                customSeries.getFormattedLabel(dataIndexInside, 'emphasis'),
+                customSeries.getFormattedLabel(dataIndexInside, 'normal'),
+                getDefaultLabel(data, dataIndexInside)
+            )
+            : null;
+
+        extra && extend(itemStyle, extra);
+        return itemStyle;
+    }
+
+    /**
+     * @public
+     * @param {string} visualType
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     */
+    function visual(visualType, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        return data.getItemVisual(dataIndexInside, visualType);
+    }
+
+    /**
+     * @public
+     * @param {number} opt.count Positive interger.
+     * @param {number} [opt.barWidth]
+     * @param {number} [opt.barMaxWidth]
+     * @param {number} [opt.barGap]
+     * @param {number} [opt.barCategoryGap]
+     * @return {Object} {width, offset, offsetCenter} is not support, return undefined.
+     */
+    function barLayout(opt) {
+        if (coordSys.getBaseAxis) {
+            var baseAxis = coordSys.getBaseAxis();
+            return getLayoutOnAxis(defaults({axis: baseAxis}, opt), api);
+        }
+    }
+
+    /**
+     * @public
+     * @return {Array.<number>}
+     */
+    function currentSeriesIndices() {
+        return ecModel.getCurrentSeriesIndices();
+    }
+
+    /**
+     * @public
+     * @param {Object} opt
+     * @param {string} [opt.fontStyle]
+     * @param {number} [opt.fontWeight]
+     * @param {number} [opt.fontSize]
+     * @param {string} [opt.fontFamily]
+     * @return {string} font string
+     */
+    function font(opt) {
+        return getFont(opt, ecModel);
+    }
+}
+
+function wrapEncodeDef(data) {
+    var encodeDef = {};
+    each$1(data.dimensions, function (dimName, dataDimIndex) {
+        var dimInfo = data.getDimensionInfo(dimName);
+        if (!dimInfo.isExtraCoord) {
+            var coordDim = dimInfo.coordDim;
+            var dataDims = encodeDef[coordDim] = encodeDef[coordDim] || [];
+            dataDims[dimInfo.coordDimIndex] = dataDimIndex;
+        }
+    });
+    return encodeDef;
+}
+
+function createOrUpdate$1(el, dataIndex, elOption, animatableModel, group, data) {
+    el = doCreateOrUpdate(el, dataIndex, elOption, animatableModel, group, data);
+    el && data.setItemGraphicEl(dataIndex, el);
+
+    return el;
+}
+
+function doCreateOrUpdate(el, dataIndex, elOption, animatableModel, group, data) {
+    var elOptionType = elOption.type;
+    if (el
+        && elOptionType !== el.__customGraphicType
+        && (elOptionType !== 'path' || elOption.pathData !== el.__customPathData)
+        && (elOptionType !== 'image' || elOption.style.image !== el.__customImagePath)
+        && (elOptionType !== 'text' || elOption.style.text !== el.__customText)
+    ) {
+        group.remove(el);
+        el = null;
+    }
+
+    // `elOption.type` is undefined when `renderItem` returns nothing.
+    if (elOptionType == null) {
+        return;
+    }
+
+    var isInit = !el;
+    !el && (el = createEl(elOption));
+    updateEl(el, dataIndex, elOption, animatableModel, data, isInit);
+
+    if (elOptionType === 'group') {
+        var oldChildren = el.children() || [];
+        var newChildren = elOption.children || [];
+
+        if (elOption.diffChildrenByName) {
+            // lower performance.
+            diffGroupChildren({
+                oldChildren: oldChildren,
+                newChildren: newChildren,
+                dataIndex: dataIndex,
+                animatableModel: animatableModel,
+                group: el,
+                data: data
+            });
+        }
+        else {
+            // better performance.
+            var index = 0;
+            for (; index < newChildren.length; index++) {
+                doCreateOrUpdate(
+                    el.childAt(index),
+                    dataIndex,
+                    newChildren[index],
+                    animatableModel,
+                    el,
+                    data
+                );
+            }
+            for (; index < oldChildren.length; index++) {
+                oldChildren[index] && el.remove(oldChildren[index]);
+            }
+        }
+    }
+
+    group.add(el);
+
+    return el;
+}
+
+function diffGroupChildren(context) {
+    (new DataDiffer(
+        context.oldChildren,
+        context.newChildren,
+        getKey,
+        getKey,
+        context
+    ))
+        .add(processAddUpdate)
+        .update(processAddUpdate)
+        .remove(processRemove)
+        .execute();
+}
+
+function getKey(item, idx) {
+    var name = item && item.name;
+    return name != null ? name : GROUP_DIFF_PREFIX + idx;
+}
+
+function processAddUpdate(newIndex, oldIndex) {
+    var context = this.context;
+    var childOption = newIndex != null ? context.newChildren[newIndex] : null;
+    var child = oldIndex != null ? context.oldChildren[oldIndex] : null;
+
+    doCreateOrUpdate(
+        child,
+        context.dataIndex,
+        childOption,
+        context.animatableModel,
+        context.group,
+        context.data
+    );
+}
+
+function processRemove(oldIndex) {
+    var context = this.context;
+    var child = context.oldChildren[oldIndex];
+    child && context.group.remove(child);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// -------------
+// Preprocessor
+// -------------
+
+registerPreprocessor(function (option) {
+    var graphicOption = option.graphic;
+
+    // Convert
+    // {graphic: [{left: 10, type: 'circle'}, ...]}
+    // or
+    // {graphic: {left: 10, type: 'circle'}}
+    // to
+    // {graphic: [{elements: [{left: 10, type: 'circle'}, ...]}]}
+    if (isArray(graphicOption)) {
+        if (!graphicOption[0] || !graphicOption[0].elements) {
+            option.graphic = [{elements: graphicOption}];
+        }
+        else {
+            // Only one graphic instance can be instantiated. (We dont
+            // want that too many views are created in echarts._viewMap)
+            option.graphic = [option.graphic[0]];
+        }
+    }
+    else if (graphicOption && !graphicOption.elements) {
+        option.graphic = [{elements: [graphicOption]}];
+    }
+});
+
+// ------
+// Model
+// ------
+
+var GraphicModel = extendComponentModel({
+
+    type: 'graphic',
+
+    defaultOption: {
+
+        // Extra properties for each elements:
+        //
+        // left/right/top/bottom: (like 12, '22%', 'center', default undefined)
+        //      If left/rigth is set, shape.x/shape.cx/position will not be used.
+        //      If top/bottom is set, shape.y/shape.cy/position will not be used.
+        //      This mechanism is useful when you want to position a group/element
+        //      against the right side or the center of this container.
+        //
+        // width/height: (can only be pixel value, default 0)
+        //      Only be used to specify contianer(group) size, if needed. And
+        //      can not be percentage value (like '33%'). See the reason in the
+        //      layout algorithm below.
+        //
+        // bounding: (enum: 'all' (default) | 'raw')
+        //      Specify how to calculate boundingRect when locating.
+        //      'all': Get uioned and transformed boundingRect
+        //          from both itself and its descendants.
+        //          This mode simplies confining a group of elements in the bounding
+        //          of their ancester container (e.g., using 'right: 0').
+        //      'raw': Only use the boundingRect of itself and before transformed.
+        //          This mode is similar to css behavior, which is useful when you
+        //          want an element to be able to overflow its container. (Consider
+        //          a rotated circle needs to be located in a corner.)
+
+        // Note: elements is always behind its ancestors in this elements array.
+        elements: [],
+        parentId: null
+    },
+
+    /**
+     * Save el options for the sake of the performance (only update modified graphics).
+     * The order is the same as those in option. (ancesters -> descendants)
+     *
+     * @private
+     * @type {Array.<Object>}
+     */
+    _elOptionsToUpdate: null,
+
+    /**
+     * @override
+     */
+    mergeOption: function (option) {
+        // Prevent default merge to elements
+        var elements = this.option.elements;
+        this.option.elements = null;
+
+        GraphicModel.superApply(this, 'mergeOption', arguments);
+
+        this.option.elements = elements;
+    },
+
+    /**
+     * @override
+     */
+    optionUpdated: function (newOption, isInit) {
+        var thisOption = this.option;
+        var newList = (isInit ? thisOption : newOption).elements;
+        var existList = thisOption.elements = isInit ? [] : thisOption.elements;
+
+        var flattenedList = [];
+        this._flatten(newList, flattenedList);
+
+        var mappingResult = mappingToExists(existList, flattenedList);
+        makeIdAndName(mappingResult);
+
+        // Clear elOptionsToUpdate
+        var elOptionsToUpdate = this._elOptionsToUpdate = [];
+
+        each$1(mappingResult, function (resultItem, index) {
+            var newElOption = resultItem.option;
+
+            if (__DEV__) {
+                assert$1(
+                    isObject$1(newElOption) || resultItem.exist,
+                    'Empty graphic option definition'
+                );
+            }
+
+            if (!newElOption) {
+                return;
+            }
+
+            elOptionsToUpdate.push(newElOption);
+
+            setKeyInfoToNewElOption(resultItem, newElOption);
+
+            mergeNewElOptionToExist(existList, index, newElOption);
+
+            setLayoutInfoToExist(existList[index], newElOption);
+
+        }, this);
+
+        // Clean
+        for (var i = existList.length - 1; i >= 0; i--) {
+            if (existList[i] == null) {
+                existList.splice(i, 1);
+            }
+            else {
+                // $action should be volatile, otherwise option gotten from
+                // `getOption` will contain unexpected $action.
+                delete existList[i].$action;
+            }
+        }
+    },
+
+    /**
+     * Convert
+     * [{
+     *  type: 'group',
+     *  id: 'xx',
+     *  children: [{type: 'circle'}, {type: 'polygon'}]
+     * }]
+     * to
+     * [
+     *  {type: 'group', id: 'xx'},
+     *  {type: 'circle', parentId: 'xx'},
+     *  {type: 'polygon', parentId: 'xx'}
+     * ]
+     *
+     * @private
+     * @param {Array.<Object>} optionList option list
+     * @param {Array.<Object>} result result of flatten
+     * @param {Object} parentOption parent option
+     */
+    _flatten: function (optionList, result, parentOption) {
+        each$1(optionList, function (option) {
+            if (!option) {
+                return;
+            }
+
+            if (parentOption) {
+                option.parentOption = parentOption;
+            }
+
+            result.push(option);
+
+            var children = option.children;
+            if (option.type === 'group' && children) {
+                this._flatten(children, result, option);
+            }
+            // Deleting for JSON output, and for not affecting group creation.
+            delete option.children;
+        }, this);
+    },
+
+    // FIXME
+    // Pass to view using payload? setOption has a payload?
+    useElOptionsToUpdate: function () {
+        var els = this._elOptionsToUpdate;
+        // Clear to avoid render duplicately when zooming.
+        this._elOptionsToUpdate = null;
+        return els;
+    }
+});
+
+// -----
+// View
+// -----
+
+extendComponentView({
+
+    type: 'graphic',
+
+    /**
+     * @override
+     */
+    init: function (ecModel, api) {
+
+        /**
+         * @private
+         * @type {module:zrender/core/util.HashMap}
+         */
+        this._elMap = createHashMap();
+
+        /**
+         * @private
+         * @type {module:echarts/graphic/GraphicModel}
+         */
+        this._lastGraphicModel;
+    },
+
+    /**
+     * @override
+     */
+    render: function (graphicModel, ecModel, api) {
+
+        // Having leveraged between use cases and algorithm complexity, a very
+        // simple layout mechanism is used:
+        // The size(width/height) can be determined by itself or its parent (not
+        // implemented yet), but can not by its children. (Top-down travel)
+        // The location(x/y) can be determined by the bounding rect of itself
+        // (can including its descendants or not) and the size of its parent.
+        // (Bottom-up travel)
+
+        // When `chart.clear()` or `chart.setOption({...}, true)` with the same id,
+        // view will be reused.
+        if (graphicModel !== this._lastGraphicModel) {
+            this._clear();
+        }
+        this._lastGraphicModel = graphicModel;
+
+        this._updateElements(graphicModel, api);
+        this._relocate(graphicModel, api);
+    },
+
+    /**
+     * Update graphic elements.
+     *
+     * @private
+     * @param {Object} graphicModel graphic model
+     * @param {module:echarts/ExtensionAPI} api extension API
+     */
+    _updateElements: function (graphicModel, api) {
+        var elOptionsToUpdate = graphicModel.useElOptionsToUpdate();
+
+        if (!elOptionsToUpdate) {
+            return;
+        }
+
+        var elMap = this._elMap;
+        var rootGroup = this.group;
+
+        // Top-down tranverse to assign graphic settings to each elements.
+        each$1(elOptionsToUpdate, function (elOption) {
+            var $action = elOption.$action;
+            var id = elOption.id;
+            var existEl = elMap.get(id);
+            var parentId = elOption.parentId;
+            var targetElParent = parentId != null ? elMap.get(parentId) : rootGroup;
+
+            if (elOption.type === 'text') {
+                var elOptionStyle = elOption.style;
+
+                // In top/bottom mode, textVerticalAlign should not be used, which cause
+                // inaccurately locating.
+                if (elOption.hv && elOption.hv[1]) {
+                    elOptionStyle.textVerticalAlign = elOptionStyle.textBaseline = null;
+                }
+
+                // Compatible with previous setting: both support fill and textFill,
+                // stroke and textStroke.
+                !elOptionStyle.hasOwnProperty('textFill') && elOptionStyle.fill && (
+                    elOptionStyle.textFill = elOptionStyle.fill
+                );
+                !elOptionStyle.hasOwnProperty('textStroke') && elOptionStyle.stroke && (
+                    elOptionStyle.textStroke = elOptionStyle.stroke
+                );
+            }
+
+            // Remove unnecessary props to avoid potential problems.
+            var elOptionCleaned = getCleanedElOption(elOption);
+
+            // For simple, do not support parent change, otherwise reorder is needed.
+            if (__DEV__) {
+                existEl && assert$1(
+                    targetElParent === existEl.parent,
+                    'Changing parent is not supported.'
+                );
+            }
+
+            if (!$action || $action === 'merge') {
+                existEl
+                    ? existEl.attr(elOptionCleaned)
+                    : createEl$1(id, targetElParent, elOptionCleaned, elMap);
+            }
+            else if ($action === 'replace') {
+                removeEl(existEl, elMap);
+                createEl$1(id, targetElParent, elOptionCleaned, elMap);
+            }
+            else if ($action === 'remove') {
+                removeEl(existEl, elMap);
+            }
+
+            var el = elMap.get(id);
+            if (el) {
+                el.__ecGraphicWidth = elOption.width;
+                el.__ecGraphicHeight = elOption.height;
+            }
+        });
+    },
+
+    /**
+     * Locate graphic elements.
+     *
+     * @private
+     * @param {Object} graphicModel graphic model
+     * @param {module:echarts/ExtensionAPI} api extension API
+     */
+    _relocate: function (graphicModel, api) {
+        var elOptions = graphicModel.option.elements;
+        var rootGroup = this.group;
+        var elMap = this._elMap;
+
+        // Bottom-up tranvese all elements (consider ec resize) to locate elements.
+        for (var i = elOptions.length - 1; i >= 0; i--) {
+            var elOption = elOptions[i];
+            var el = elMap.get(elOption.id);
+
+            if (!el) {
+                continue;
+            }
+
+            var parentEl = el.parent;
+            var containerInfo = parentEl === rootGroup
+                ? {
+                    width: api.getWidth(),
+                    height: api.getHeight()
+                }
+                : { // Like 'position:absolut' in css, default 0.
+                    width: parentEl.__ecGraphicWidth || 0,
+                    height: parentEl.__ecGraphicHeight || 0
+                };
+
+            positionElement(
+                el, elOption, containerInfo, null,
+                {hv: elOption.hv, boundingMode: elOption.bounding}
+            );
+        }
+    },
+
+    /**
+     * Clear all elements.
+     *
+     * @private
+     */
+    _clear: function () {
+        var elMap = this._elMap;
+        elMap.each(function (el) {
+            removeEl(el, elMap);
+        });
+        this._elMap = createHashMap();
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._clear();
+    }
+});
+
+function createEl$1(id, targetElParent, elOption, elMap) {
+    var graphicType = elOption.type;
+
+    if (__DEV__) {
+        assert$1(graphicType, 'graphic type MUST be set');
+    }
+
+    var Clz = graphic[graphicType.charAt(0).toUpperCase() + graphicType.slice(1)];
+
+    if (__DEV__) {
+        assert$1(Clz, 'graphic type can not be found');
+    }
+
+    var el = new Clz(elOption);
+    targetElParent.add(el);
+    elMap.set(id, el);
+    el.__ecGraphicId = id;
+}
+
+function removeEl(existEl, elMap) {
+    var existElParent = existEl && existEl.parent;
+    if (existElParent) {
+        existEl.type === 'group' && existEl.traverse(function (el) {
+            removeEl(el, elMap);
+        });
+        elMap.removeKey(existEl.__ecGraphicId);
+        existElParent.remove(existEl);
+    }
+}
+
+// Remove unnecessary props to avoid potential problems.
+function getCleanedElOption(elOption) {
+    elOption = extend({}, elOption);
+    each$1(
+        ['id', 'parentId', '$action', 'hv', 'bounding'].concat(LOCATION_PARAMS),
+        function (name) {
+            delete elOption[name];
+        }
+    );
+    return elOption;
+}
+
+function isSetLoc(obj, props) {
+    var isSet;
+    each$1(props, function (prop) {
+        obj[prop] != null && obj[prop] !== 'auto' && (isSet = true);
+    });
+    return isSet;
+}
+
+function setKeyInfoToNewElOption(resultItem, newElOption) {
+    var existElOption = resultItem.exist;
+
+    // Set id and type after id assigned.
+    newElOption.id = resultItem.keyInfo.id;
+    !newElOption.type && existElOption && (newElOption.type = existElOption.type);
+
+    // Set parent id if not specified
+    if (newElOption.parentId == null) {
+        var newElParentOption = newElOption.parentOption;
+        if (newElParentOption) {
+            newElOption.parentId = newElParentOption.id;
+        }
+        else if (existElOption) {
+            newElOption.parentId = existElOption.parentId;
+        }
+    }
+
+    // Clear
+    newElOption.parentOption = null;
+}
+
+function mergeNewElOptionToExist(existList, index, newElOption) {
+    // Update existing options, for `getOption` feature.
+    var newElOptCopy = extend({}, newElOption);
+    var existElOption = existList[index];
+
+    var $action = newElOption.$action || 'merge';
+    if ($action === 'merge') {
+        if (existElOption) {
+
+            if (__DEV__) {
+                var newType = newElOption.type;
+                assert$1(
+                    !newType || existElOption.type === newType,
+                    'Please set $action: "replace" to change `type`'
+                );
+            }
+
+            // We can ensure that newElOptCopy and existElOption are not
+            // the same object, so `merge` will not change newElOptCopy.
+            merge(existElOption, newElOptCopy, true);
+            // Rigid body, use ignoreSize.
+            mergeLayoutParam(existElOption, newElOptCopy, {ignoreSize: true});
+            // Will be used in render.
+            copyLayoutParams(newElOption, existElOption);
+        }
+        else {
+            existList[index] = newElOptCopy;
+        }
+    }
+    else if ($action === 'replace') {
+        existList[index] = newElOptCopy;
+    }
+    else if ($action === 'remove') {
+        // null will be cleaned later.
+        existElOption && (existList[index] = null);
+    }
+}
+
+function setLayoutInfoToExist(existItem, newElOption) {
+    if (!existItem) {
+        return;
+    }
+    existItem.hv = newElOption.hv = [
+        // Rigid body, dont care `width`.
+        isSetLoc(newElOption, ['left', 'right']),
+        // Rigid body, dont care `height`.
+        isSetLoc(newElOption, ['top', 'bottom'])
+    ];
+    // Give default group size. Otherwise layout error may occur.
+    if (existItem.type === 'group') {
+        existItem.width == null && (existItem.width = newElOption.width = 0);
+        existItem.height == null && (existItem.height = newElOption.height = 0);
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var LegendModel = extendComponentModel({
+
+    type: 'legend.plain',
+
+    dependencies: ['series'],
+
+    layoutMode: {
+        type: 'box',
+        // legend.width/height are maxWidth/maxHeight actually,
+        // whereas realy width/height is calculated by its content.
+        // (Setting {left: 10, right: 10} does not make sense).
+        // So consider the case:
+        // `setOption({legend: {left: 10});`
+        // then `setOption({legend: {right: 10});`
+        // The previous `left` should be cleared by setting `ignoreSize`.
+        ignoreSize: true
+    },
+
+    init: function (option, parentModel, ecModel) {
+        this.mergeDefaultAndTheme(option, ecModel);
+
+        option.selected = option.selected || {};
+    },
+
+    mergeOption: function (option) {
+        LegendModel.superCall(this, 'mergeOption', option);
+    },
+
+    optionUpdated: function () {
+        this._updateData(this.ecModel);
+
+        var legendData = this._data;
+
+        // If selectedMode is single, try to select one
+        if (legendData[0] && this.get('selectedMode') === 'single') {
+            var hasSelected = false;
+            // If has any selected in option.selected
+            for (var i = 0; i < legendData.length; i++) {
+                var name = legendData[i].get('name');
+                if (this.isSelected(name)) {
+                    // Force to unselect others
+                    this.select(name);
+                    hasSelected = true;
+                    break;
+                }
+            }
+            // Try select the first if selectedMode is single
+            !hasSelected && this.select(legendData[0].get('name'));
+        }
+    },
+
+    _updateData: function (ecModel) {
+        var potentialData = [];
+        var availableNames = [];
+
+        ecModel.eachRawSeries(function (seriesModel) {
+            var seriesName = seriesModel.name;
+            availableNames.push(seriesName);
+            var isPotential;
+
+            if (seriesModel.legendDataProvider) {
+                var data = seriesModel.legendDataProvider();
+                var names = data.mapArray(data.getName);
+
+                if (!ecModel.isSeriesFiltered(seriesModel)) {
+                    availableNames = availableNames.concat(names);
+                }
+
+                if (names.length) {
+                    potentialData = potentialData.concat(names);
+                }
+                else {
+                    isPotential = true;
+                }
+            }
+            else {
+                isPotential = true;
+            }
+
+            if (isPotential && isNameSpecified(seriesModel)) {
+                potentialData.push(seriesModel.name);
+            }
+        });
+
+        /**
+         * @type {Array.<string>}
+         * @private
+         */
+        this._availableNames = availableNames;
+
+        // If legend.data not specified in option, use availableNames as data,
+        // which is convinient for user preparing option.
+        var rawData = this.get('data') || potentialData;
+
+        var legendData = map(rawData, function (dataItem) {
+            // Can be string or number
+            if (typeof dataItem === 'string' || typeof dataItem === 'number') {
+                dataItem = {
+                    name: dataItem
+                };
+            }
+            return new Model(dataItem, this, this.ecModel);
+        }, this);
+
+        /**
+         * @type {Array.<module:echarts/model/Model>}
+         * @private
+         */
+        this._data = legendData;
+    },
+
+    /**
+     * @return {Array.<module:echarts/model/Model>}
+     */
+    getData: function () {
+        return this._data;
+    },
+
+    /**
+     * @param {string} name
+     */
+    select: function (name) {
+        var selected = this.option.selected;
+        var selectedMode = this.get('selectedMode');
+        if (selectedMode === 'single') {
+            var data = this._data;
+            each$1(data, function (dataItem) {
+                selected[dataItem.get('name')] = false;
+            });
+        }
+        selected[name] = true;
+    },
+
+    /**
+     * @param {string} name
+     */
+    unSelect: function (name) {
+        if (this.get('selectedMode') !== 'single') {
+            this.option.selected[name] = false;
+        }
+    },
+
+    /**
+     * @param {string} name
+     */
+    toggleSelected: function (name) {
+        var selected = this.option.selected;
+        // Default is true
+        if (!selected.hasOwnProperty(name)) {
+            selected[name] = true;
+        }
+        this[selected[name] ? 'unSelect' : 'select'](name);
+    },
+
+    /**
+     * @param {string} name
+     */
+    isSelected: function (name) {
+        var selected = this.option.selected;
+        return !(selected.hasOwnProperty(name) && !selected[name])
+            && indexOf(this._availableNames, name) >= 0;
+    },
+
+    defaultOption: {
+        // 一级层叠
+        zlevel: 0,
+        // 二级层叠
+        z: 4,
+        show: true,
+
+        // 布局方式，默认为水平布局，可选为：
+        // 'horizontal' | 'vertical'
+        orient: 'horizontal',
+
+        left: 'center',
+        // right: 'center',
+
+        top: 0,
+        // bottom: null,
+
+        // 水平对齐
+        // 'auto' | 'left' | 'right'
+        // 默认为 'auto', 根据 x 的位置判断是左对齐还是右对齐
+        align: 'auto',
+
+        backgroundColor: 'rgba(0,0,0,0)',
+        // 图例边框颜色
+        borderColor: '#ccc',
+        borderRadius: 0,
+        // 图例边框线宽，单位px，默认为0（无边框）
+        borderWidth: 0,
+        // 图例内边距，单位px，默认各方向内边距为5，
+        // 接受数组分别设定上右下左边距，同css
+        padding: 5,
+        // 各个item之间的间隔，单位px，默认为10，
+        // 横向布局时为水平间隔，纵向布局时为纵向间隔
+        itemGap: 10,
+        // 图例图形宽度
+        itemWidth: 25,
+        // 图例图形高度
+        itemHeight: 14,
+
+        // 图例关闭时候的颜色
+        inactiveColor: '#ccc',
+
+        textStyle: {
+            // 图例文字颜色
+            color: '#333'
+        },
+        // formatter: '',
+        // 选择模式，默认开启图例开关
+        selectedMode: true,
+        // 配置默认选中状态，可配合LEGEND.SELECTED事件做动态数据载入
+        // selected: null,
+        // 图例内容（详见legend.data，数组中每一项代表一个item
+        // data: [],
+
+        // Tooltip 相关配置
+        tooltip: {
+            show: false
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function legendSelectActionHandler(methodName, payload, ecModel) {
+    var selectedMap = {};
+    var isToggleSelect = methodName === 'toggleSelected';
+    var isSelected;
+    // Update all legend components
+    ecModel.eachComponent('legend', function (legendModel) {
+        if (isToggleSelect && isSelected != null) {
+            // Force other legend has same selected status
+            // Or the first is toggled to true and other are toggled to false
+            // In the case one legend has some item unSelected in option. And if other legend
+            // doesn't has the item, they will assume it is selected.
+            legendModel[isSelected ? 'select' : 'unSelect'](payload.name);
+        }
+        else {
+            legendModel[methodName](payload.name);
+            isSelected = legendModel.isSelected(payload.name);
+        }
+        var legendData = legendModel.getData();
+        each$1(legendData, function (model) {
+            var name = model.get('name');
+            // Wrap element
+            if (name === '\n' || name === '') {
+                return;
+            }
+            var isItemSelected = legendModel.isSelected(name);
+            if (selectedMap.hasOwnProperty(name)) {
+                // Unselected if any legend is unselected
+                selectedMap[name] = selectedMap[name] && isItemSelected;
+            }
+            else {
+                selectedMap[name] = isItemSelected;
+            }
+        });
+    });
+    // Return the event explicitly
+    return {
+        name: payload.name,
+        selected: selectedMap
+    };
+}
+/**
+ * @event legendToggleSelect
+ * @type {Object}
+ * @property {string} type 'legendToggleSelect'
+ * @property {string} [from]
+ * @property {string} name Series name or data item name
+ */
+registerAction(
+    'legendToggleSelect', 'legendselectchanged',
+    curry(legendSelectActionHandler, 'toggleSelected')
+);
+
+/**
+ * @event legendSelect
+ * @type {Object}
+ * @property {string} type 'legendSelect'
+ * @property {string} name Series name or data item name
+ */
+registerAction(
+    'legendSelect', 'legendselected',
+    curry(legendSelectActionHandler, 'select')
+);
+
+/**
+ * @event legendUnSelect
+ * @type {Object}
+ * @property {string} type 'legendUnSelect'
+ * @property {string} name Series name or data item name
+ */
+registerAction(
+    'legendUnSelect', 'legendunselected',
+    curry(legendSelectActionHandler, 'unSelect')
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Layout list like component.
+ * It will box layout each items in group of component and then position the whole group in the viewport
+ * @param {module:zrender/group/Group} group
+ * @param {module:echarts/model/Component} componentModel
+ * @param {module:echarts/ExtensionAPI}
+ */
+function layout$3(group, componentModel, api) {
+    var boxLayoutParams = componentModel.getBoxLayoutParams();
+    var padding = componentModel.get('padding');
+    var viewportSize = {width: api.getWidth(), height: api.getHeight()};
+
+    var rect = getLayoutRect(
+        boxLayoutParams,
+        viewportSize,
+        padding
+    );
+
+    box(
+        componentModel.get('orient'),
+        group,
+        componentModel.get('itemGap'),
+        rect.width,
+        rect.height
+    );
+
+    positionElement(
+        group,
+        boxLayoutParams,
+        viewportSize,
+        padding
+    );
+}
+
+function makeBackground(rect, componentModel) {
+    var padding = normalizeCssArray$1(
+        componentModel.get('padding')
+    );
+    var style = componentModel.getItemStyle(['color', 'opacity']);
+    style.fill = componentModel.get('backgroundColor');
+    var rect = new Rect({
+        shape: {
+            x: rect.x - padding[3],
+            y: rect.y - padding[0],
+            width: rect.width + padding[1] + padding[3],
+            height: rect.height + padding[0] + padding[2],
+            r: componentModel.get('borderRadius')
+        },
+        style: style,
+        silent: true,
+        z2: -1
+    });
+    // FIXME
+    // `subPixelOptimizeRect` may bring some gap between edge of viewpart
+    // and background rect when setting like `left: 0`, `top: 0`.
+    // graphic.subPixelOptimizeRect(rect);
+
+    return rect;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var curry$4 = curry;
+var each$16 = each$1;
+var Group$3 = Group;
+
+var LegendView = extendComponentView({
+
+    type: 'legend.plain',
+
+    newlineDisabled: false,
+
+    /**
+     * @override
+     */
+    init: function () {
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this.group.add(this._contentGroup = new Group$3());
+
+        /**
+         * @private
+         * @type {module:zrender/Element}
+         */
+        this._backgroundEl;
+    },
+
+    /**
+     * @protected
+     */
+    getContentGroup: function () {
+        return this._contentGroup;
+    },
+
+    /**
+     * @override
+     */
+    render: function (legendModel, ecModel, api) {
+
+        this.resetInner();
+
+        if (!legendModel.get('show', true)) {
+            return;
+        }
+
+        var itemAlign = legendModel.get('align');
+        if (!itemAlign || itemAlign === 'auto') {
+            itemAlign = (
+                legendModel.get('left') === 'right'
+                && legendModel.get('orient') === 'vertical'
+            ) ? 'right' : 'left';
+        }
+
+        this.renderInner(itemAlign, legendModel, ecModel, api);
+
+        // Perform layout.
+        var positionInfo = legendModel.getBoxLayoutParams();
+        var viewportSize = {width: api.getWidth(), height: api.getHeight()};
+        var padding = legendModel.get('padding');
+
+        var maxSize = getLayoutRect(positionInfo, viewportSize, padding);
+        var mainRect = this.layoutInner(legendModel, itemAlign, maxSize);
+
+        // Place mainGroup, based on the calculated `mainRect`.
+        var layoutRect = getLayoutRect(
+            defaults({width: mainRect.width, height: mainRect.height}, positionInfo),
+            viewportSize,
+            padding
+        );
+        this.group.attr('position', [layoutRect.x - mainRect.x, layoutRect.y - mainRect.y]);
+
+        // Render background after group is layout.
+        this.group.add(
+            this._backgroundEl = makeBackground(mainRect, legendModel)
+        );
+    },
+
+    /**
+     * @protected
+     */
+    resetInner: function () {
+        this.getContentGroup().removeAll();
+        this._backgroundEl && this.group.remove(this._backgroundEl);
+    },
+
+    /**
+     * @protected
+     */
+    renderInner: function (itemAlign, legendModel, ecModel, api) {
+        var contentGroup = this.getContentGroup();
+        var legendDrawnMap = createHashMap();
+        var selectMode = legendModel.get('selectedMode');
+
+        var excludeSeriesId = [];
+        ecModel.eachRawSeries(function (seriesModel) {
+            !seriesModel.get('legendHoverLink') && excludeSeriesId.push(seriesModel.id);
+        });
+
+        each$16(legendModel.getData(), function (itemModel, dataIndex) {
+            var name = itemModel.get('name');
+
+            // Use empty string or \n as a newline string
+            if (!this.newlineDisabled && (name === '' || name === '\n')) {
+                contentGroup.add(new Group$3({
+                    newline: true
+                }));
+                return;
+            }
+
+            // Representitive series.
+            var seriesModel = ecModel.getSeriesByName(name)[0];
+
+            if (legendDrawnMap.get(name)) {
+                // Have been drawed
+                return;
+            }
+
+            // Series legend
+            if (seriesModel) {
+                var data = seriesModel.getData();
+                var color = data.getVisual('color');
+
+                // If color is a callback function
+                if (typeof color === 'function') {
+                    // Use the first data
+                    color = color(seriesModel.getDataParams(0));
+                }
+
+                // Using rect symbol defaultly
+                var legendSymbolType = data.getVisual('legendSymbol') || 'roundRect';
+                var symbolType = data.getVisual('symbol');
+
+                var itemGroup = this._createItem(
+                    name, dataIndex, itemModel, legendModel,
+                    legendSymbolType, symbolType,
+                    itemAlign, color,
+                    selectMode
+                );
+
+                itemGroup.on('click', curry$4(dispatchSelectAction, name, api))
+                    .on('mouseover', curry$4(dispatchHighlightAction, seriesModel, null, api, excludeSeriesId))
+                    .on('mouseout', curry$4(dispatchDownplayAction, seriesModel, null, api, excludeSeriesId));
+
+                legendDrawnMap.set(name, true);
+            }
+            else {
+                // Data legend of pie, funnel
+                ecModel.eachRawSeries(function (seriesModel) {
+                    // In case multiple series has same data name
+                    if (legendDrawnMap.get(name)) {
+                        return;
+                    }
+
+                    if (seriesModel.legendDataProvider) {
+                        var data = seriesModel.legendDataProvider();
+                        var idx = data.indexOfName(name);
+                        if (idx < 0) {
+                            return;
+                        }
+
+                        var color = data.getItemVisual(idx, 'color');
+
+                        var legendSymbolType = 'roundRect';
+
+                        var itemGroup = this._createItem(
+                            name, dataIndex, itemModel, legendModel,
+                            legendSymbolType, null,
+                            itemAlign, color,
+                            selectMode
+                        );
+
+                        // FIXME: consider different series has items with the same name.
+                        itemGroup.on('click', curry$4(dispatchSelectAction, name, api))
+                            // FIXME Should not specify the series name
+                            .on('mouseover', curry$4(dispatchHighlightAction, seriesModel, name, api, excludeSeriesId))
+                            .on('mouseout', curry$4(dispatchDownplayAction, seriesModel, name, api, excludeSeriesId));
+
+                        legendDrawnMap.set(name, true);
+                    }
+
+                }, this);
+            }
+
+            if (__DEV__) {
+                if (!legendDrawnMap.get(name)) {
+                    console.warn(name + ' series not exists. Legend data should be same with series name or data name.');
+                }
+            }
+        }, this);
+    },
+
+    _createItem: function (
+        name, dataIndex, itemModel, legendModel,
+        legendSymbolType, symbolType,
+        itemAlign, color, selectMode
+    ) {
+        var itemWidth = legendModel.get('itemWidth');
+        var itemHeight = legendModel.get('itemHeight');
+        var inactiveColor = legendModel.get('inactiveColor');
+        var symbolKeepAspect = legendModel.get('symbolKeepAspect');
+
+        var isSelected = legendModel.isSelected(name);
+        var itemGroup = new Group$3();
+
+        var textStyleModel = itemModel.getModel('textStyle');
+
+        var itemIcon = itemModel.get('icon');
+
+        var tooltipModel = itemModel.getModel('tooltip');
+        var legendGlobalTooltipModel = tooltipModel.parentModel;
+
+        // Use user given icon first
+        legendSymbolType = itemIcon || legendSymbolType;
+        itemGroup.add(createSymbol(
+            legendSymbolType,
+            0,
+            0,
+            itemWidth,
+            itemHeight,
+            isSelected ? color : inactiveColor,
+            // symbolKeepAspect default true for legend
+            symbolKeepAspect == null ? true : symbolKeepAspect
+        ));
+
+        // Compose symbols
+        // PENDING
+        if (!itemIcon && symbolType
+            // At least show one symbol, can't be all none
+            && ((symbolType !== legendSymbolType) || symbolType == 'none')
+        ) {
+            var size = itemHeight * 0.8;
+            if (symbolType === 'none') {
+                symbolType = 'circle';
+            }
+            // Put symbol in the center
+            itemGroup.add(createSymbol(
+                symbolType,
+                (itemWidth - size) / 2,
+                (itemHeight - size) / 2,
+                size,
+                size,
+                isSelected ? color : inactiveColor,
+                // symbolKeepAspect default true for legend
+                symbolKeepAspect == null ? true : symbolKeepAspect
+            ));
+        }
+
+        var textX = itemAlign === 'left' ? itemWidth + 5 : -5;
+        var textAlign = itemAlign;
+
+        var formatter = legendModel.get('formatter');
+        var content = name;
+        if (typeof formatter === 'string' && formatter) {
+            content = formatter.replace('{name}', name != null ? name : '');
+        }
+        else if (typeof formatter === 'function') {
+            content = formatter(name);
+        }
+
+        itemGroup.add(new Text({
+            style: setTextStyle({}, textStyleModel, {
+                text: content,
+                x: textX,
+                y: itemHeight / 2,
+                textFill: isSelected ? textStyleModel.getTextColor() : inactiveColor,
+                textAlign: textAlign,
+                textVerticalAlign: 'middle'
+            })
+        }));
+
+        // Add a invisible rect to increase the area of mouse hover
+        var hitRect = new Rect({
+            shape: itemGroup.getBoundingRect(),
+            invisible: true,
+            tooltip: tooltipModel.get('show') ? extend({
+                content: name,
+                // Defaul formatter
+                formatter: legendGlobalTooltipModel.get('formatter', true) || function () {
+                    return name;
+                },
+                formatterParams: {
+                    componentType: 'legend',
+                    legendIndex: legendModel.componentIndex,
+                    name: name,
+                    $vars: ['name']
+                }
+            }, tooltipModel.option) : null
+        });
+        itemGroup.add(hitRect);
+
+        itemGroup.eachChild(function (child) {
+            child.silent = true;
+        });
+
+        hitRect.silent = !selectMode;
+
+        this.getContentGroup().add(itemGroup);
+
+        setHoverStyle(itemGroup);
+
+        itemGroup.__legendDataIndex = dataIndex;
+
+        return itemGroup;
+    },
+
+    /**
+     * @protected
+     */
+    layoutInner: function (legendModel, itemAlign, maxSize) {
+        var contentGroup = this.getContentGroup();
+
+        // Place items in contentGroup.
+        box(
+            legendModel.get('orient'),
+            contentGroup,
+            legendModel.get('itemGap'),
+            maxSize.width,
+            maxSize.height
+        );
+
+        var contentRect = contentGroup.getBoundingRect();
+        contentGroup.attr('position', [-contentRect.x, -contentRect.y]);
+
+        return this.group.getBoundingRect();
+    }
+
+});
+
+function dispatchSelectAction(name, api) {
+    api.dispatchAction({
+        type: 'legendToggleSelect',
+        name: name
+    });
+}
+
+function dispatchHighlightAction(seriesModel, dataName, api, excludeSeriesId) {
+    // If element hover will move to a hoverLayer.
+    var el = api.getZr().storage.getDisplayList()[0];
+    if (!(el && el.useHoverLayer)) {
+        api.dispatchAction({
+            type: 'highlight',
+            seriesName: seriesModel.name,
+            name: dataName,
+            excludeSeriesId: excludeSeriesId
+        });
+    }
+}
+
+function dispatchDownplayAction(seriesModel, dataName, api, excludeSeriesId) {
+    // If element hover will move to a hoverLayer.
+    var el = api.getZr().storage.getDisplayList()[0];
+    if (!(el && el.useHoverLayer)) {
+        api.dispatchAction({
+            type: 'downplay',
+            seriesName: seriesModel.name,
+            name: dataName,
+            excludeSeriesId: excludeSeriesId
+        });
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var legendFilter = function (ecModel) {
+
+    var legendModels = ecModel.findComponents({
+        mainType: 'legend'
+    });
+    if (legendModels && legendModels.length) {
+        ecModel.filterSeries(function (series) {
+            // If in any legend component the status is not selected.
+            // Because in legend series is assumed selected when it is not in the legend data.
+            for (var i = 0; i < legendModels.length; i++) {
+                if (!legendModels[i].isSelected(series.name)) {
+                    return false;
+                }
+            }
+            return true;
+        });
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+// Do not contain scrollable legend, for sake of file size.
+
+// Series Filter
+registerProcessor(legendFilter);
+
+ComponentModel.registerSubTypeDefaulter('legend', function () {
+    // Default 'plain' when no type specified.
+    return 'plain';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ScrollableLegendModel = LegendModel.extend({
+
+    type: 'legend.scroll',
+
+    /**
+     * @param {number} scrollDataIndex
+     */
+    setScrollDataIndex: function (scrollDataIndex) {
+        this.option.scrollDataIndex = scrollDataIndex;
+    },
+
+    defaultOption: {
+        scrollDataIndex: 0,
+        pageButtonItemGap: 5,
+        pageButtonGap: null,
+        pageButtonPosition: 'end', // 'start' or 'end'
+        pageFormatter: '{current}/{total}', // If null/undefined, do not show page.
+        pageIcons: {
+            horizontal: ['M0,0L12,-10L12,10z', 'M0,0L-12,-10L-12,10z'],
+            vertical: ['M0,0L20,0L10,-20z', 'M0,0L20,0L10,20z']
+        },
+        pageIconColor: '#2f4554',
+        pageIconInactiveColor: '#aaa',
+        pageIconSize: 15, // Can be [10, 3], which represents [width, height]
+        pageTextStyle: {
+            color: '#333'
+        },
+
+        animationDurationUpdate: 800
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel, extraOpt) {
+        var inputPositionParams = getLayoutParams(option);
+
+        ScrollableLegendModel.superCall(this, 'init', option, parentModel, ecModel, extraOpt);
+
+        mergeAndNormalizeLayoutParams(this, option, inputPositionParams);
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (option, extraOpt) {
+        ScrollableLegendModel.superCall(this, 'mergeOption', option, extraOpt);
+
+        mergeAndNormalizeLayoutParams(this, this.option, option);
+    },
+
+    getOrient: function () {
+        return this.get('orient') === 'vertical'
+            ? {index: 1, name: 'vertical'}
+            : {index: 0, name: 'horizontal'};
+    }
+
+});
+
+// Do not `ignoreSize` to enable setting {left: 10, right: 10}.
+function mergeAndNormalizeLayoutParams(legendModel, target, raw) {
+    var orient = legendModel.getOrient();
+    var ignoreSize = [1, 1];
+    ignoreSize[orient.index] = 0;
+    mergeLayoutParam(target, raw, {
+        type: 'box', ignoreSize: ignoreSize
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Separate legend and scrollable legend to reduce package size.
+ */
+
+var Group$4 = Group;
+
+var WH$1 = ['width', 'height'];
+var XY$1 = ['x', 'y'];
+
+var ScrollableLegendView = LegendView.extend({
+
+    type: 'legend.scroll',
+
+    newlineDisabled: true,
+
+    init: function () {
+
+        ScrollableLegendView.superCall(this, 'init');
+
+        /**
+         * @private
+         * @type {number} For `scroll`.
+         */
+        this._currentIndex = 0;
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this.group.add(this._containerGroup = new Group$4());
+        this._containerGroup.add(this.getContentGroup());
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this.group.add(this._controllerGroup = new Group$4());
+
+        /**
+         *
+         * @private
+         */
+        this._showController;
+    },
+
+    /**
+     * @override
+     */
+    resetInner: function () {
+        ScrollableLegendView.superCall(this, 'resetInner');
+
+        this._controllerGroup.removeAll();
+        this._containerGroup.removeClipPath();
+        this._containerGroup.__rectSize = null;
+    },
+
+    /**
+     * @override
+     */
+    renderInner: function (itemAlign, legendModel, ecModel, api) {
+        var me = this;
+
+        // Render content items.
+        ScrollableLegendView.superCall(this, 'renderInner', itemAlign, legendModel, ecModel, api);
+
+        var controllerGroup = this._controllerGroup;
+
+        var pageIconSize = legendModel.get('pageIconSize', true);
+        if (!isArray(pageIconSize)) {
+            pageIconSize = [pageIconSize, pageIconSize];
+        }
+
+        createPageButton('pagePrev', 0);
+
+        var pageTextStyleModel = legendModel.getModel('pageTextStyle');
+        controllerGroup.add(new Text({
+            name: 'pageText',
+            style: {
+                textFill: pageTextStyleModel.getTextColor(),
+                font: pageTextStyleModel.getFont(),
+                textVerticalAlign: 'middle',
+                textAlign: 'center'
+            },
+            silent: true
+        }));
+
+        createPageButton('pageNext', 1);
+
+        function createPageButton(name, iconIdx) {
+            var pageDataIndexName = name + 'DataIndex';
+            var icon = createIcon(
+                legendModel.get('pageIcons', true)[legendModel.getOrient().name][iconIdx],
+                {
+                    // Buttons will be created in each render, so we do not need
+                    // to worry about avoiding using legendModel kept in scope.
+                    onclick: bind(
+                        me._pageGo, me, pageDataIndexName, legendModel, api
+                    )
+                },
+                {
+                    x: -pageIconSize[0] / 2,
+                    y: -pageIconSize[1] / 2,
+                    width: pageIconSize[0],
+                    height: pageIconSize[1]
+                }
+            );
+            icon.name = name;
+            controllerGroup.add(icon);
+        }
+    },
+
+    /**
+     * @override
+     */
+    layoutInner: function (legendModel, itemAlign, maxSize) {
+        var contentGroup = this.getContentGroup();
+        var containerGroup = this._containerGroup;
+        var controllerGroup = this._controllerGroup;
+
+        var orientIdx = legendModel.getOrient().index;
+        var wh = WH$1[orientIdx];
+        var hw = WH$1[1 - orientIdx];
+        var yx = XY$1[1 - orientIdx];
+
+        // Place items in contentGroup.
+        box(
+            legendModel.get('orient'),
+            contentGroup,
+            legendModel.get('itemGap'),
+            !orientIdx ? null : maxSize.width,
+            orientIdx ? null : maxSize.height
+        );
+
+        box(
+            // Buttons in controller are layout always horizontally.
+            'horizontal',
+            controllerGroup,
+            legendModel.get('pageButtonItemGap', true)
+        );
+
+        var contentRect = contentGroup.getBoundingRect();
+        var controllerRect = controllerGroup.getBoundingRect();
+        var showController = this._showController = contentRect[wh] > maxSize[wh];
+
+        var contentPos = [-contentRect.x, -contentRect.y];
+        // Remain contentPos when scroll animation perfroming.
+        contentPos[orientIdx] = contentGroup.position[orientIdx];
+
+        // Layout container group based on 0.
+        var containerPos = [0, 0];
+        var controllerPos = [-controllerRect.x, -controllerRect.y];
+        var pageButtonGap = retrieve2(
+            legendModel.get('pageButtonGap', true), legendModel.get('itemGap', true)
+        );
+
+        // Place containerGroup and controllerGroup and contentGroup.
+        if (showController) {
+            var pageButtonPosition = legendModel.get('pageButtonPosition', true);
+            // controller is on the right / bottom.
+            if (pageButtonPosition === 'end') {
+                controllerPos[orientIdx] += maxSize[wh] - controllerRect[wh];
+            }
+            // controller is on the left / top.
+            else {
+                containerPos[orientIdx] += controllerRect[wh] + pageButtonGap;
+            }
+        }
+
+        // Always align controller to content as 'middle'.
+        controllerPos[1 - orientIdx] += contentRect[hw] / 2 - controllerRect[hw] / 2;
+
+        contentGroup.attr('position', contentPos);
+        containerGroup.attr('position', containerPos);
+        controllerGroup.attr('position', controllerPos);
+
+        // Calculate `mainRect` and set `clipPath`.
+        // mainRect should not be calculated by `this.group.getBoundingRect()`
+        // for sake of the overflow.
+        var mainRect = this.group.getBoundingRect();
+        var mainRect = {x: 0, y: 0};
+        // Consider content may be overflow (should be clipped).
+        mainRect[wh] = showController ? maxSize[wh] : contentRect[wh];
+        mainRect[hw] = Math.max(contentRect[hw], controllerRect[hw]);
+        // `containerRect[yx] + containerPos[1 - orientIdx]` is 0.
+        mainRect[yx] = Math.min(0, controllerRect[yx] + controllerPos[1 - orientIdx]);
+
+        containerGroup.__rectSize = maxSize[wh];
+        if (showController) {
+            var clipShape = {x: 0, y: 0};
+            clipShape[wh] = Math.max(maxSize[wh] - controllerRect[wh] - pageButtonGap, 0);
+            clipShape[hw] = mainRect[hw];
+            containerGroup.setClipPath(new Rect({shape: clipShape}));
+            // Consider content may be larger than container, container rect
+            // can not be obtained from `containerGroup.getBoundingRect()`.
+            containerGroup.__rectSize = clipShape[wh];
+        }
+        else {
+            // Do not remove or ignore controller. Keep them set as place holders.
+            controllerGroup.eachChild(function (child) {
+                child.attr({invisible: true, silent: true});
+            });
+        }
+
+        // Content translate animation.
+        var pageInfo = this._getPageInfo(legendModel);
+        pageInfo.pageIndex != null && updateProps(
+            contentGroup,
+            {position: pageInfo.contentPosition},
+            // When switch from "show controller" to "not show controller", view should be
+            // updated immediately without animation, otherwise causes weird efffect.
+            showController ? legendModel : false
+        );
+
+        this._updatePageInfoView(legendModel, pageInfo);
+
+        return mainRect;
+    },
+
+    _pageGo: function (to, legendModel, api) {
+        var scrollDataIndex = this._getPageInfo(legendModel)[to];
+
+        scrollDataIndex != null && api.dispatchAction({
+            type: 'legendScroll',
+            scrollDataIndex: scrollDataIndex,
+            legendId: legendModel.id
+        });
+    },
+
+    _updatePageInfoView: function (legendModel, pageInfo) {
+        var controllerGroup = this._controllerGroup;
+
+        each$1(['pagePrev', 'pageNext'], function (name) {
+            var canJump = pageInfo[name + 'DataIndex'] != null;
+            var icon = controllerGroup.childOfName(name);
+            if (icon) {
+                icon.setStyle(
+                    'fill',
+                    canJump
+                        ? legendModel.get('pageIconColor', true)
+                        : legendModel.get('pageIconInactiveColor', true)
+                );
+                icon.cursor = canJump ? 'pointer' : 'default';
+            }
+        });
+
+        var pageText = controllerGroup.childOfName('pageText');
+        var pageFormatter = legendModel.get('pageFormatter');
+        var pageIndex = pageInfo.pageIndex;
+        var current = pageIndex != null ? pageIndex + 1 : 0;
+        var total = pageInfo.pageCount;
+
+        pageText && pageFormatter && pageText.setStyle(
+            'text',
+            isString(pageFormatter)
+                ? pageFormatter.replace('{current}', current).replace('{total}', total)
+                : pageFormatter({current: current, total: total})
+        );
+    },
+
+    /**
+     * @param {module:echarts/model/Model} legendModel
+     * @return {Object} {
+     *  contentPosition: Array.<number>, null when data item not found.
+     *  pageIndex: number, null when data item not found.
+     *  pageCount: number, always be a number, can be 0.
+     *  pagePrevDataIndex: number, null when no next page.
+     *  pageNextDataIndex: number, null when no previous page.
+     * }
+     */
+    _getPageInfo: function (legendModel) {
+        // Align left or top by the current dataIndex.
+        var currDataIndex = legendModel.get('scrollDataIndex', true);
+        var contentGroup = this.getContentGroup();
+        var contentRect = contentGroup.getBoundingRect();
+        var containerRectSize = this._containerGroup.__rectSize;
+
+        var orientIdx = legendModel.getOrient().index;
+        var wh = WH$1[orientIdx];
+        var hw = WH$1[1 - orientIdx];
+        var xy = XY$1[orientIdx];
+        var contentPos = contentGroup.position.slice();
+
+        var pageIndex;
+        var pagePrevDataIndex;
+        var pageNextDataIndex;
+
+        var targetItemGroup;
+        if (this._showController) {
+            contentGroup.eachChild(function (child) {
+                if (child.__legendDataIndex === currDataIndex) {
+                    targetItemGroup = child;
+                }
+            });
+        }
+        else {
+            targetItemGroup = contentGroup.childAt(0);
+        }
+
+        var pageCount = containerRectSize ? Math.ceil(contentRect[wh] / containerRectSize) : 0;
+
+        if (targetItemGroup) {
+            var itemRect = targetItemGroup.getBoundingRect();
+            var itemLoc = targetItemGroup.position[orientIdx] + itemRect[xy];
+            contentPos[orientIdx] = -itemLoc - contentRect[xy];
+            pageIndex = Math.floor(
+                pageCount * (itemLoc + itemRect[xy] + containerRectSize / 2) / contentRect[wh]
+            );
+            pageIndex = (contentRect[wh] && pageCount)
+                ? Math.max(0, Math.min(pageCount - 1, pageIndex))
+                : -1;
+
+            var winRect = {x: 0, y: 0};
+            winRect[wh] = containerRectSize;
+            winRect[hw] = contentRect[hw];
+            winRect[xy] = -contentPos[orientIdx] - contentRect[xy];
+
+            var startIdx;
+            var children = contentGroup.children();
+
+            contentGroup.eachChild(function (child, index) {
+                var itemRect = getItemRect(child);
+
+                if (itemRect.intersect(winRect)) {
+                    startIdx == null && (startIdx = index);
+                    // It is user-friendly that the last item shown in the
+                    // current window is shown at the begining of next window.
+                    pageNextDataIndex = child.__legendDataIndex;
+                }
+
+                // If the last item is shown entirely, no next page.
+                if (index === children.length - 1
+                    && itemRect[xy] + itemRect[wh] <= winRect[xy] + winRect[wh]
+                ) {
+                    pageNextDataIndex = null;
+                }
+            });
+
+            // Always align based on the left/top most item, so the left/top most
+            // item in the previous window is needed to be found here.
+            if (startIdx != null) {
+                var startItem = children[startIdx];
+                var startRect = getItemRect(startItem);
+                winRect[xy] = startRect[xy] + startRect[wh] - winRect[wh];
+
+                // If the first item is shown entirely, no previous page.
+                if (startIdx <= 0 && startRect[xy] >= winRect[xy]) {
+                    pagePrevDataIndex = null;
+                }
+                else {
+                    while (startIdx > 0 && getItemRect(children[startIdx - 1]).intersect(winRect)) {
+                        startIdx--;
+                    }
+                    pagePrevDataIndex = children[startIdx].__legendDataIndex;
+                }
+            }
+        }
+
+        return {
+            contentPosition: contentPos,
+            pageIndex: pageIndex,
+            pageCount: pageCount,
+            pagePrevDataIndex: pagePrevDataIndex,
+            pageNextDataIndex: pageNextDataIndex
+        };
+
+        function getItemRect(el) {
+            var itemRect = el.getBoundingRect().clone();
+            itemRect[xy] += el.position[orientIdx];
+            return itemRect;
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @event legendScroll
+ * @type {Object}
+ * @property {string} type 'legendScroll'
+ * @property {string} scrollDataIndex
+ */
+registerAction(
+    'legendScroll', 'legendscroll',
+    function (payload, ecModel) {
+        var scrollDataIndex = payload.scrollDataIndex;
+
+        scrollDataIndex != null && ecModel.eachComponent(
+            {mainType: 'legend', subType: 'scroll', query: payload},
+            function (legendModel) {
+                legendModel.setScrollDataIndex(scrollDataIndex);
+            }
+        );
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Legend component entry file8
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentModel({
+
+    type: 'tooltip',
+
+    dependencies: ['axisPointer'],
+
+    defaultOption: {
+        zlevel: 0,
+
+        z: 8,
+
+        show: true,
+
+        // tooltip主体内容
+        showContent: true,
+
+        // 'trigger' only works on coordinate system.
+        // 'item' | 'axis' | 'none'
+        trigger: 'item',
+
+        // 'click' | 'mousemove' | 'none'
+        triggerOn: 'mousemove|click',
+
+        alwaysShowContent: false,
+
+        displayMode: 'single', // 'single' | 'multipleByCoordSys'
+
+        // 位置 {Array} | {Function}
+        // position: null
+        // Consider triggered from axisPointer handle, verticalAlign should be 'middle'
+        // align: null,
+        // verticalAlign: null,
+
+        // 是否约束 content 在 viewRect 中。默认 false 是为了兼容以前版本。
+        confine: false,
+
+        // 内容格式器：{string}（Template） ¦ {Function}
+        // formatter: null
+
+        showDelay: 0,
+
+        // 隐藏延迟，单位ms
+        hideDelay: 100,
+
+        // 动画变换时间，单位s
+        transitionDuration: 0.4,
+
+        enterable: false,
+
+        // 提示背景颜色，默认为透明度为0.7的黑色
+        backgroundColor: 'rgba(50,50,50,0.7)',
+
+        // 提示边框颜色
+        borderColor: '#333',
+
+        // 提示边框圆角，单位px，默认为4
+        borderRadius: 4,
+
+        // 提示边框线宽，单位px，默认为0（无边框）
+        borderWidth: 0,
+
+        // 提示内边距，单位px，默认各方向内边距为5，
+        // 接受数组分别设定上右下左边距，同css
+        padding: 5,
+
+        // Extra css text
+        extraCssText: '',
+
+        // 坐标轴指示器，坐标轴触发有效
+        axisPointer: {
+            // 默认为直线
+            // 可选为：'line' | 'shadow' | 'cross'
+            type: 'line',
+
+            // type 为 line 的时候有效，指定 tooltip line 所在的轴，可选
+            // 可选 'x' | 'y' | 'angle' | 'radius' | 'auto'
+            // 默认 'auto'，会选择类型为 category 的轴，对于双数值轴，笛卡尔坐标系会默认选择 x 轴
+            // 极坐标系会默认选择 angle 轴
+            axis: 'auto',
+
+            animation: 'auto',
+            animationDurationUpdate: 200,
+            animationEasingUpdate: 'exponentialOut',
+
+            crossStyle: {
+                color: '#999',
+                width: 1,
+                type: 'dashed',
+
+                // TODO formatter
+                textStyle: {}
+            }
+
+            // lineStyle and shadowStyle should not be specified here,
+            // otherwise it will always override those styles on option.axisPointer.
+        },
+        textStyle: {
+            color: '#fff',
+            fontSize: 14
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$18 = each$1;
+var toCamelCase$1 = toCamelCase;
+
+var vendors = ['', '-webkit-', '-moz-', '-o-'];
+
+var gCssText = 'position:absolute;display:block;border-style:solid;white-space:nowrap;z-index:9999999;';
+
+/**
+ * @param {number} duration
+ * @return {string}
+ * @inner
+ */
+function assembleTransition(duration) {
+    var transitionCurve = 'cubic-bezier(0.23, 1, 0.32, 1)';
+    var transitionText = 'left ' + duration + 's ' + transitionCurve + ','
+                        + 'top ' + duration + 's ' + transitionCurve;
+    return map(vendors, function (vendorPrefix) {
+        return vendorPrefix + 'transition:' + transitionText;
+    }).join(';');
+}
+
+/**
+ * @param {Object} textStyle
+ * @return {string}
+ * @inner
+ */
+function assembleFont(textStyleModel) {
+    var cssText = [];
+
+    var fontSize = textStyleModel.get('fontSize');
+    var color = textStyleModel.getTextColor();
+
+    color && cssText.push('color:' + color);
+
+    cssText.push('font:' + textStyleModel.getFont());
+
+    fontSize &&
+        cssText.push('line-height:' + Math.round(fontSize * 3 / 2) + 'px');
+
+    each$18(['decoration', 'align'], function (name) {
+        var val = textStyleModel.get(name);
+        val && cssText.push('text-' + name + ':' + val);
+    });
+
+    return cssText.join(';');
+}
+
+/**
+ * @param {Object} tooltipModel
+ * @return {string}
+ * @inner
+ */
+function assembleCssText(tooltipModel) {
+
+    var cssText = [];
+
+    var transitionDuration = tooltipModel.get('transitionDuration');
+    var backgroundColor = tooltipModel.get('backgroundColor');
+    var textStyleModel = tooltipModel.getModel('textStyle');
+    var padding = tooltipModel.get('padding');
+
+    // Animation transition. Do not animate when transitionDuration is 0.
+    transitionDuration &&
+        cssText.push(assembleTransition(transitionDuration));
+
+    if (backgroundColor) {
+        if (env$1.canvasSupported) {
+            cssText.push('background-Color:' + backgroundColor);
+        }
+        else {
+            // for ie
+            cssText.push(
+                'background-Color:#' + toHex(backgroundColor)
+            );
+            cssText.push('filter:alpha(opacity=70)');
+        }
+    }
+
+    // Border style
+    each$18(['width', 'color', 'radius'], function (name) {
+        var borderName = 'border-' + name;
+        var camelCase = toCamelCase$1(borderName);
+        var val = tooltipModel.get(camelCase);
+        val != null &&
+            cssText.push(borderName + ':' + val + (name === 'color' ? '' : 'px'));
+    });
+
+    // Text style
+    cssText.push(assembleFont(textStyleModel));
+
+    // Padding
+    if (padding != null) {
+        cssText.push('padding:' + normalizeCssArray$1(padding).join('px ') + 'px');
+    }
+
+    return cssText.join(';') + ';';
+}
+
+/**
+ * @alias module:echarts/component/tooltip/TooltipContent
+ * @constructor
+ */
+function TooltipContent(container, api) {
+    if (env$1.wxa) {
+        return null;
+    }
+
+    var el = document.createElement('div');
+    var zr = this._zr = api.getZr();
+
+    this.el = el;
+
+    this._x = api.getWidth() / 2;
+    this._y = api.getHeight() / 2;
+
+    container.appendChild(el);
+
+    this._container = container;
+
+    this._show = false;
+
+    /**
+     * @private
+     */
+    this._hideTimeout;
+
+    var self = this;
+    el.onmouseenter = function () {
+        // clear the timeout in hideLater and keep showing tooltip
+        if (self._enterable) {
+            clearTimeout(self._hideTimeout);
+            self._show = true;
+        }
+        self._inContent = true;
+    };
+    el.onmousemove = function (e) {
+        e = e || window.event;
+        if (!self._enterable) {
+            // Try trigger zrender event to avoid mouse
+            // in and out shape too frequently
+            var handler = zr.handler;
+            normalizeEvent(container, e, true);
+            handler.dispatch('mousemove', e);
+        }
+    };
+    el.onmouseleave = function () {
+        if (self._enterable) {
+            if (self._show) {
+                self.hideLater(self._hideDelay);
+            }
+        }
+        self._inContent = false;
+    };
+}
+
+TooltipContent.prototype = {
+
+    constructor: TooltipContent,
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    _enterable: true,
+
+    /**
+     * Update when tooltip is rendered
+     */
+    update: function () {
+        // FIXME
+        // Move this logic to ec main?
+        var container = this._container;
+        var stl = container.currentStyle
+            || document.defaultView.getComputedStyle(container);
+        var domStyle = container.style;
+        if (domStyle.position !== 'absolute' && stl.position !== 'absolute') {
+            domStyle.position = 'relative';
+        }
+        // Hide the tooltip
+        // PENDING
+        // this.hide();
+    },
+
+    show: function (tooltipModel) {
+        clearTimeout(this._hideTimeout);
+        var el = this.el;
+
+        el.style.cssText = gCssText + assembleCssText(tooltipModel)
+            // http://stackoverflow.com/questions/21125587/css3-transition-not-working-in-chrome-anymore
+            + ';left:' + this._x + 'px;top:' + this._y + 'px;'
+            + (tooltipModel.get('extraCssText') || '');
+
+        el.style.display = el.innerHTML ?  'block' : 'none';
+
+        this._show = true;
+    },
+
+    setContent: function (content) {
+        this.el.innerHTML = content == null ? '' : content;
+    },
+
+    setEnterable: function (enterable) {
+        this._enterable = enterable;
+    },
+
+    getSize: function () {
+        var el = this.el;
+        return [el.clientWidth, el.clientHeight];
+    },
+
+    moveTo: function (x, y) {
+        // xy should be based on canvas root. But tooltipContent is
+        // the sibling of canvas root. So padding of ec container
+        // should be considered here.
+        var zr = this._zr;
+        var viewportRootOffset;
+        if (zr && zr.painter && (viewportRootOffset = zr.painter.getViewportRootOffset())) {
+            x += viewportRootOffset.offsetLeft;
+            y += viewportRootOffset.offsetTop;
+        }
+
+        var style = this.el.style;
+        style.left = x + 'px';
+        style.top = y + 'px';
+
+        this._x = x;
+        this._y = y;
+    },
+
+    hide: function () {
+        this.el.style.display = 'none';
+        this._show = false;
+    },
+
+    hideLater: function (time) {
+        if (this._show && !(this._inContent && this._enterable)) {
+            if (time) {
+                this._hideDelay = time;
+                // Set show false to avoid invoke hideLater mutiple times
+                this._show = false;
+                this._hideTimeout = setTimeout(bind(this.hide, this), time);
+            }
+            else {
+                this.hide();
+            }
+        }
+    },
+
+    isShow: function () {
+        return this._show;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$3 = bind;
+var each$17 = each$1;
+var parsePercent$2 = parsePercent$1;
+
+var proxyRect = new Rect({
+    shape: {x: -1, y: -1, width: 2, height: 2}
+});
+
+extendComponentView({
+
+    type: 'tooltip',
+
+    init: function (ecModel, api) {
+        if (env$1.node) {
+            return;
+        }
+        var tooltipContent = new TooltipContent(api.getDom(), api);
+        this._tooltipContent = tooltipContent;
+    },
+
+    render: function (tooltipModel, ecModel, api) {
+        if (env$1.node || env$1.wxa) {
+            return;
+        }
+
+        // Reset
+        this.group.removeAll();
+
+        /**
+         * @private
+         * @type {module:echarts/component/tooltip/TooltipModel}
+         */
+        this._tooltipModel = tooltipModel;
+
+        /**
+         * @private
+         * @type {module:echarts/model/Global}
+         */
+        this._ecModel = ecModel;
+
+        /**
+         * @private
+         * @type {module:echarts/ExtensionAPI}
+         */
+        this._api = api;
+
+        /**
+         * Should be cleaned when render.
+         * @private
+         * @type {Array.<Array.<Object>>}
+         */
+        this._lastDataByCoordSys = null;
+
+        /**
+         * @private
+         * @type {boolean}
+         */
+        this._alwaysShowContent = tooltipModel.get('alwaysShowContent');
+
+        var tooltipContent = this._tooltipContent;
+        tooltipContent.update();
+        tooltipContent.setEnterable(tooltipModel.get('enterable'));
+
+        this._initGlobalListener();
+
+        this._keepShow();
+    },
+
+    _initGlobalListener: function () {
+        var tooltipModel = this._tooltipModel;
+        var triggerOn = tooltipModel.get('triggerOn');
+
+        register(
+            'itemTooltip',
+            this._api,
+            bind$3(function (currTrigger, e, dispatchAction) {
+                // If 'none', it is not controlled by mouse totally.
+                if (triggerOn !== 'none') {
+                    if (triggerOn.indexOf(currTrigger) >= 0) {
+                        this._tryShow(e, dispatchAction);
+                    }
+                    else if (currTrigger === 'leave') {
+                        this._hide(dispatchAction);
+                    }
+                }
+            }, this)
+        );
+    },
+
+    _keepShow: function () {
+        var tooltipModel = this._tooltipModel;
+        var ecModel = this._ecModel;
+        var api = this._api;
+
+        // Try to keep the tooltip show when refreshing
+        if (this._lastX != null
+            && this._lastY != null
+            // When user is willing to control tooltip totally using API,
+            // self.manuallyShowTip({x, y}) might cause tooltip hide,
+            // which is not expected.
+            && tooltipModel.get('triggerOn') !== 'none'
+        ) {
+            var self = this;
+            clearTimeout(this._refreshUpdateTimeout);
+            this._refreshUpdateTimeout = setTimeout(function () {
+                // Show tip next tick after other charts are rendered
+                // In case highlight action has wrong result
+                // FIXME
+                self.manuallyShowTip(tooltipModel, ecModel, api, {
+                    x: self._lastX,
+                    y: self._lastY
+                });
+            });
+        }
+    },
+
+    /**
+     * Show tip manually by
+     * dispatchAction({
+     *     type: 'showTip',
+     *     x: 10,
+     *     y: 10
+     * });
+     * Or
+     * dispatchAction({
+     *      type: 'showTip',
+     *      seriesIndex: 0,
+     *      dataIndex or dataIndexInside or name
+     * });
+     *
+     *  TODO Batch
+     */
+    manuallyShowTip: function (tooltipModel, ecModel, api, payload) {
+        if (payload.from === this.uid || env$1.node) {
+            return;
+        }
+
+        var dispatchAction = makeDispatchAction$1(payload, api);
+
+        // Reset ticket
+        this._ticket = '';
+
+        // When triggered from axisPointer.
+        var dataByCoordSys = payload.dataByCoordSys;
+
+        if (payload.tooltip && payload.x != null && payload.y != null) {
+            var el = proxyRect;
+            el.position = [payload.x, payload.y];
+            el.update();
+            el.tooltip = payload.tooltip;
+            // Manually show tooltip while view is not using zrender elements.
+            this._tryShow({
+                offsetX: payload.x,
+                offsetY: payload.y,
+                target: el
+            }, dispatchAction);
+        }
+        else if (dataByCoordSys) {
+            this._tryShow({
+                offsetX: payload.x,
+                offsetY: payload.y,
+                position: payload.position,
+                event: {},
+                dataByCoordSys: payload.dataByCoordSys,
+                tooltipOption: payload.tooltipOption
+            }, dispatchAction);
+        }
+        else if (payload.seriesIndex != null) {
+
+            if (this._manuallyAxisShowTip(tooltipModel, ecModel, api, payload)) {
+                return;
+            }
+
+            var pointInfo = findPointFromSeries(payload, ecModel);
+            var cx = pointInfo.point[0];
+            var cy = pointInfo.point[1];
+            if (cx != null && cy != null) {
+                this._tryShow({
+                    offsetX: cx,
+                    offsetY: cy,
+                    position: payload.position,
+                    target: pointInfo.el,
+                    event: {}
+                }, dispatchAction);
+            }
+        }
+        else if (payload.x != null && payload.y != null) {
+            // FIXME
+            // should wrap dispatchAction like `axisPointer/globalListener` ?
+            api.dispatchAction({
+                type: 'updateAxisPointer',
+                x: payload.x,
+                y: payload.y
+            });
+
+            this._tryShow({
+                offsetX: payload.x,
+                offsetY: payload.y,
+                position: payload.position,
+                target: api.getZr().findHover(payload.x, payload.y).target,
+                event: {}
+            }, dispatchAction);
+        }
+    },
+
+    manuallyHideTip: function (tooltipModel, ecModel, api, payload) {
+        var tooltipContent = this._tooltipContent;
+
+        if (!this._alwaysShowContent && this._tooltipModel) {
+            tooltipContent.hideLater(this._tooltipModel.get('hideDelay'));
+        }
+
+        this._lastX = this._lastY = null;
+
+        if (payload.from !== this.uid) {
+            this._hide(makeDispatchAction$1(payload, api));
+        }
+    },
+
+    // Be compatible with previous design, that is, when tooltip.type is 'axis' and
+    // dispatchAction 'showTip' with seriesIndex and dataIndex will trigger axis pointer
+    // and tooltip.
+    _manuallyAxisShowTip: function (tooltipModel, ecModel, api, payload) {
+        var seriesIndex = payload.seriesIndex;
+        var dataIndex = payload.dataIndex;
+        var coordSysAxesInfo = ecModel.getComponent('axisPointer').coordSysAxesInfo;
+
+        if (seriesIndex == null || dataIndex == null || coordSysAxesInfo == null) {
+            return;
+        }
+
+        var seriesModel = ecModel.getSeriesByIndex(seriesIndex);
+        if (!seriesModel) {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var tooltipModel = buildTooltipModel([
+            data.getItemModel(dataIndex),
+            seriesModel,
+            (seriesModel.coordinateSystem || {}).model,
+            tooltipModel
+        ]);
+
+        if (tooltipModel.get('trigger') !== 'axis') {
+            return;
+        }
+
+        api.dispatchAction({
+            type: 'updateAxisPointer',
+            seriesIndex: seriesIndex,
+            dataIndex: dataIndex,
+            position: payload.position
+        });
+
+        return true;
+    },
+
+    _tryShow: function (e, dispatchAction) {
+        var el = e.target;
+        var tooltipModel = this._tooltipModel;
+
+        if (!tooltipModel) {
+            return;
+        }
+
+        // Save mouse x, mouse y. So we can try to keep showing the tip if chart is refreshed
+        this._lastX = e.offsetX;
+        this._lastY = e.offsetY;
+
+        var dataByCoordSys = e.dataByCoordSys;
+        if (dataByCoordSys && dataByCoordSys.length) {
+            this._showAxisTooltip(dataByCoordSys, e);
+        }
+        // Always show item tooltip if mouse is on the element with dataIndex
+        else if (el && el.dataIndex != null) {
+            this._lastDataByCoordSys = null;
+            this._showSeriesItemTooltip(e, el, dispatchAction);
+        }
+        // Tooltip provided directly. Like legend.
+        else if (el && el.tooltip) {
+            this._lastDataByCoordSys = null;
+            this._showComponentItemTooltip(e, el, dispatchAction);
+        }
+        else {
+            this._lastDataByCoordSys = null;
+            this._hide(dispatchAction);
+        }
+    },
+
+    _showOrMove: function (tooltipModel, cb) {
+        // showDelay is used in this case: tooltip.enterable is set
+        // as true. User intent to move mouse into tooltip and click
+        // something. `showDelay` makes it easyer to enter the content
+        // but tooltip do not move immediately.
+        var delay = tooltipModel.get('showDelay');
+        cb = bind(cb, this);
+        clearTimeout(this._showTimout);
+        delay > 0
+            ? (this._showTimout = setTimeout(cb, delay))
+            : cb();
+    },
+
+    _showAxisTooltip: function (dataByCoordSys, e) {
+        var ecModel = this._ecModel;
+        var globalTooltipModel = this._tooltipModel;
+        var point = [e.offsetX, e.offsetY];
+        var singleDefaultHTML = [];
+        var singleParamsList = [];
+        var singleTooltipModel = buildTooltipModel([
+            e.tooltipOption,
+            globalTooltipModel
+        ]);
+
+        each$17(dataByCoordSys, function (itemCoordSys) {
+            // var coordParamList = [];
+            // var coordDefaultHTML = [];
+            // var coordTooltipModel = buildTooltipModel([
+            //     e.tooltipOption,
+            //     itemCoordSys.tooltipOption,
+            //     ecModel.getComponent(itemCoordSys.coordSysMainType, itemCoordSys.coordSysIndex),
+            //     globalTooltipModel
+            // ]);
+            // var displayMode = coordTooltipModel.get('displayMode');
+            // var paramsList = displayMode === 'single' ? singleParamsList : [];
+
+            each$17(itemCoordSys.dataByAxis, function (item) {
+                var axisModel = ecModel.getComponent(item.axisDim + 'Axis', item.axisIndex);
+                var axisValue = item.value;
+                var seriesDefaultHTML = [];
+
+                if (!axisModel || axisValue == null) {
+                    return;
+                }
+
+                var valueLabel = getValueLabel(
+                    axisValue, axisModel.axis, ecModel,
+                    item.seriesDataIndices,
+                    item.valueLabelOpt
+                );
+
+                each$1(item.seriesDataIndices, function (idxItem) {
+                    var series = ecModel.getSeriesByIndex(idxItem.seriesIndex);
+                    var dataIndex = idxItem.dataIndexInside;
+                    var dataParams = series && series.getDataParams(dataIndex);
+                    dataParams.axisDim = item.axisDim;
+                    dataParams.axisIndex = item.axisIndex;
+                    dataParams.axisType = item.axisType;
+                    dataParams.axisId = item.axisId;
+                    dataParams.axisValue = getAxisRawValue(axisModel.axis, axisValue);
+                    dataParams.axisValueLabel = valueLabel;
+
+                    if (dataParams) {
+                        singleParamsList.push(dataParams);
+                        seriesDefaultHTML.push(series.formatTooltip(dataIndex, true));
+                    }
+                });
+
+                // Default tooltip content
+                // FIXME
+                // (1) shold be the first data which has name?
+                // (2) themeRiver, firstDataIndex is array, and first line is unnecessary.
+                var firstLine = valueLabel;
+                singleDefaultHTML.push(
+                    (firstLine ? encodeHTML(firstLine) + '<br />' : '')
+                    + seriesDefaultHTML.join('<br />')
+                );
+            });
+        }, this);
+
+        // In most case, the second axis is shown upper than the first one.
+        singleDefaultHTML.reverse();
+        singleDefaultHTML = singleDefaultHTML.join('<br /><br />');
+
+        var positionExpr = e.position;
+        this._showOrMove(singleTooltipModel, function () {
+            if (this._updateContentNotChangedOnAxis(dataByCoordSys)) {
+                this._updatePosition(
+                    singleTooltipModel,
+                    positionExpr,
+                    point[0], point[1],
+                    this._tooltipContent,
+                    singleParamsList
+                );
+            }
+            else {
+                this._showTooltipContent(
+                    singleTooltipModel, singleDefaultHTML, singleParamsList, Math.random(),
+                    point[0], point[1], positionExpr
+                );
+            }
+        });
+
+        // Do not trigger events here, because this branch only be entered
+        // from dispatchAction.
+    },
+
+    _showSeriesItemTooltip: function (e, el, dispatchAction) {
+        var ecModel = this._ecModel;
+        // Use dataModel in element if possible
+        // Used when mouseover on a element like markPoint or edge
+        // In which case, the data is not main data in series.
+        var seriesIndex = el.seriesIndex;
+        var seriesModel = ecModel.getSeriesByIndex(seriesIndex);
+
+        // For example, graph link.
+        var dataModel = el.dataModel || seriesModel;
+        var dataIndex = el.dataIndex;
+        var dataType = el.dataType;
+        var data = dataModel.getData();
+
+        var tooltipModel = buildTooltipModel([
+            data.getItemModel(dataIndex),
+            dataModel,
+            seriesModel && (seriesModel.coordinateSystem || {}).model,
+            this._tooltipModel
+        ]);
+
+        var tooltipTrigger = tooltipModel.get('trigger');
+        if (tooltipTrigger != null && tooltipTrigger !== 'item') {
+            return;
+        }
+
+        var params = dataModel.getDataParams(dataIndex, dataType);
+        var defaultHtml = dataModel.formatTooltip(dataIndex, false, dataType);
+        var asyncTicket = 'item_' + dataModel.name + '_' + dataIndex;
+
+        this._showOrMove(tooltipModel, function () {
+            this._showTooltipContent(
+                tooltipModel, defaultHtml, params, asyncTicket,
+                e.offsetX, e.offsetY, e.position, e.target
+            );
+        });
+
+        // FIXME
+        // duplicated showtip if manuallyShowTip is called from dispatchAction.
+        dispatchAction({
+            type: 'showTip',
+            dataIndexInside: dataIndex,
+            dataIndex: data.getRawIndex(dataIndex),
+            seriesIndex: seriesIndex,
+            from: this.uid
+        });
+    },
+
+    _showComponentItemTooltip: function (e, el, dispatchAction) {
+        var tooltipOpt = el.tooltip;
+        if (typeof tooltipOpt === 'string') {
+            var content = tooltipOpt;
+            tooltipOpt = {
+                content: content,
+                // Fixed formatter
+                formatter: content
+            };
+        }
+        var subTooltipModel = new Model(tooltipOpt, this._tooltipModel, this._ecModel);
+        var defaultHtml = subTooltipModel.get('content');
+        var asyncTicket = Math.random();
+
+        // Do not check whether `trigger` is 'none' here, because `trigger`
+        // only works on cooridinate system. In fact, we have not found case
+        // that requires setting `trigger` nothing on component yet.
+
+        this._showOrMove(subTooltipModel, function () {
+            this._showTooltipContent(
+                subTooltipModel, defaultHtml, subTooltipModel.get('formatterParams') || {},
+                asyncTicket, e.offsetX, e.offsetY, e.position, el
+            );
+        });
+
+        // If not dispatch showTip, tip may be hide triggered by axis.
+        dispatchAction({
+            type: 'showTip',
+            from: this.uid
+        });
+    },
+
+    _showTooltipContent: function (
+        tooltipModel, defaultHtml, params, asyncTicket, x, y, positionExpr, el
+    ) {
+        // Reset ticket
+        this._ticket = '';
+
+        if (!tooltipModel.get('showContent') || !tooltipModel.get('show')) {
+            return;
+        }
+
+        var tooltipContent = this._tooltipContent;
+
+        var formatter = tooltipModel.get('formatter');
+        positionExpr = positionExpr || tooltipModel.get('position');
+        var html = defaultHtml;
+
+        if (formatter && typeof formatter === 'string') {
+            html = formatTpl(formatter, params, true);
+        }
+        else if (typeof formatter === 'function') {
+            var callback = bind$3(function (cbTicket, html) {
+                if (cbTicket === this._ticket) {
+                    tooltipContent.setContent(html);
+                    this._updatePosition(
+                        tooltipModel, positionExpr, x, y, tooltipContent, params, el
+                    );
+                }
+            }, this);
+            this._ticket = asyncTicket;
+            html = formatter(params, asyncTicket, callback);
+        }
+
+        tooltipContent.setContent(html);
+        tooltipContent.show(tooltipModel);
+
+        this._updatePosition(
+            tooltipModel, positionExpr, x, y, tooltipContent, params, el
+        );
+    },
+
+    /**
+     * @param  {string|Function|Array.<number>|Object} positionExpr
+     * @param  {number} x Mouse x
+     * @param  {number} y Mouse y
+     * @param  {boolean} confine Whether confine tooltip content in view rect.
+     * @param  {Object|<Array.<Object>} params
+     * @param  {module:zrender/Element} el target element
+     * @param  {module:echarts/ExtensionAPI} api
+     * @return {Array.<number>}
+     */
+    _updatePosition: function (tooltipModel, positionExpr, x, y, content, params, el) {
+        var viewWidth = this._api.getWidth();
+        var viewHeight = this._api.getHeight();
+        positionExpr = positionExpr || tooltipModel.get('position');
+
+        var contentSize = content.getSize();
+        var align = tooltipModel.get('align');
+        var vAlign = tooltipModel.get('verticalAlign');
+        var rect = el && el.getBoundingRect().clone();
+        el && rect.applyTransform(el.transform);
+
+        if (typeof positionExpr === 'function') {
+            // Callback of position can be an array or a string specify the position
+            positionExpr = positionExpr([x, y], params, content.el, rect, {
+                viewSize: [viewWidth, viewHeight],
+                contentSize: contentSize.slice()
+            });
+        }
+
+        if (isArray(positionExpr)) {
+            x = parsePercent$2(positionExpr[0], viewWidth);
+            y = parsePercent$2(positionExpr[1], viewHeight);
+        }
+        else if (isObject$1(positionExpr)) {
+            positionExpr.width = contentSize[0];
+            positionExpr.height = contentSize[1];
+            var layoutRect = getLayoutRect(
+                positionExpr, {width: viewWidth, height: viewHeight}
+            );
+            x = layoutRect.x;
+            y = layoutRect.y;
+            align = null;
+            // When positionExpr is left/top/right/bottom,
+            // align and verticalAlign will not work.
+            vAlign = null;
+        }
+        // Specify tooltip position by string 'top' 'bottom' 'left' 'right' around graphic element
+        else if (typeof positionExpr === 'string' && el) {
+            var pos = calcTooltipPosition(
+                positionExpr, rect, contentSize
+            );
+            x = pos[0];
+            y = pos[1];
+        }
+        else {
+            var pos = refixTooltipPosition(
+                x, y, content.el, viewWidth, viewHeight, align ? null : 20, vAlign ? null : 20
+            );
+            x = pos[0];
+            y = pos[1];
+        }
+
+        align && (x -= isCenterAlign(align) ? contentSize[0] / 2 : align === 'right' ? contentSize[0] : 0);
+        vAlign && (y -= isCenterAlign(vAlign) ? contentSize[1] / 2 : vAlign === 'bottom' ? contentSize[1] : 0);
+
+        if (tooltipModel.get('confine')) {
+            var pos = confineTooltipPosition(
+                x, y, content.el, viewWidth, viewHeight
+            );
+            x = pos[0];
+            y = pos[1];
+        }
+
+        content.moveTo(x, y);
+    },
+
+    // FIXME
+    // Should we remove this but leave this to user?
+    _updateContentNotChangedOnAxis: function (dataByCoordSys) {
+        var lastCoordSys = this._lastDataByCoordSys;
+        var contentNotChanged = !!lastCoordSys
+            && lastCoordSys.length === dataByCoordSys.length;
+
+        contentNotChanged && each$17(lastCoordSys, function (lastItemCoordSys, indexCoordSys) {
+            var lastDataByAxis = lastItemCoordSys.dataByAxis || {};
+            var thisItemCoordSys = dataByCoordSys[indexCoordSys] || {};
+            var thisDataByAxis = thisItemCoordSys.dataByAxis || [];
+            contentNotChanged &= lastDataByAxis.length === thisDataByAxis.length;
+
+            contentNotChanged && each$17(lastDataByAxis, function (lastItem, indexAxis) {
+                var thisItem = thisDataByAxis[indexAxis] || {};
+                var lastIndices = lastItem.seriesDataIndices || [];
+                var newIndices = thisItem.seriesDataIndices || [];
+
+                contentNotChanged &=
+                    lastItem.value === thisItem.value
+                    && lastItem.axisType === thisItem.axisType
+                    && lastItem.axisId === thisItem.axisId
+                    && lastIndices.length === newIndices.length;
+
+                contentNotChanged && each$17(lastIndices, function (lastIdxItem, j) {
+                    var newIdxItem = newIndices[j];
+                    contentNotChanged &=
+                        lastIdxItem.seriesIndex === newIdxItem.seriesIndex
+                        && lastIdxItem.dataIndex === newIdxItem.dataIndex;
+                });
+            });
+        });
+
+        this._lastDataByCoordSys = dataByCoordSys;
+
+        return !!contentNotChanged;
+    },
+
+    _hide: function (dispatchAction) {
+        // Do not directly hideLater here, because this behavior may be prevented
+        // in dispatchAction when showTip is dispatched.
+
+        // FIXME
+        // duplicated hideTip if manuallyHideTip is called from dispatchAction.
+        this._lastDataByCoordSys = null;
+        dispatchAction({
+            type: 'hideTip',
+            from: this.uid
+        });
+    },
+
+    dispose: function (ecModel, api) {
+        if (env$1.node || env$1.wxa) {
+            return;
+        }
+        this._tooltipContent.hide();
+        unregister('itemTooltip', api);
+    }
+});
+
+
+/**
+ * @param {Array.<Object|module:echarts/model/Model>} modelCascade
+ * From top to bottom. (the last one should be globalTooltipModel);
+ */
+function buildTooltipModel(modelCascade) {
+    var resultModel = modelCascade.pop();
+    while (modelCascade.length) {
+        var tooltipOpt = modelCascade.pop();
+        if (tooltipOpt) {
+            if (Model.isInstance(tooltipOpt)) {
+                tooltipOpt = tooltipOpt.get('tooltip', true);
+            }
+            // In each data item tooltip can be simply write:
+            // {
+            //  value: 10,
+            //  tooltip: 'Something you need to know'
+            // }
+            if (typeof tooltipOpt === 'string') {
+                tooltipOpt = {formatter: tooltipOpt};
+            }
+            resultModel = new Model(tooltipOpt, resultModel, resultModel.ecModel);
+        }
+    }
+    return resultModel;
+}
+
+function makeDispatchAction$1(payload, api) {
+    return payload.dispatchAction || bind(api.dispatchAction, api);
+}
+
+function refixTooltipPosition(x, y, el, viewWidth, viewHeight, gapH, gapV) {
+    var size = getOuterSize(el);
+    var width = size.width;
+    var height = size.height;
+
+    if (gapH != null) {
+        if (x + width + gapH > viewWidth) {
+            x -= width + gapH;
+        }
+        else {
+            x += gapH;
+        }
+    }
+    if (gapV != null) {
+        if (y + height + gapV > viewHeight) {
+            y -= height + gapV;
+        }
+        else {
+            y += gapV;
+        }
+    }
+    return [x, y];
+}
+
+function confineTooltipPosition(x, y, el, viewWidth, viewHeight) {
+    var size = getOuterSize(el);
+    var width = size.width;
+    var height = size.height;
+
+    x = Math.min(x + width, viewWidth) - width;
+    y = Math.min(y + height, viewHeight) - height;
+    x = Math.max(x, 0);
+    y = Math.max(y, 0);
+
+    return [x, y];
+}
+
+function getOuterSize(el) {
+    var width = el.clientWidth;
+    var height = el.clientHeight;
+
+    // Consider browser compatibility.
+    // IE8 does not support getComputedStyle.
+    if (document.defaultView && document.defaultView.getComputedStyle) {
+        var stl = document.defaultView.getComputedStyle(el);
+        if (stl) {
+            width += parseInt(stl.paddingLeft, 10) + parseInt(stl.paddingRight, 10)
+                + parseInt(stl.borderLeftWidth, 10) + parseInt(stl.borderRightWidth, 10);
+            height += parseInt(stl.paddingTop, 10) + parseInt(stl.paddingBottom, 10)
+                + parseInt(stl.borderTopWidth, 10) + parseInt(stl.borderBottomWidth, 10);
+        }
+    }
+
+    return {width: width, height: height};
+}
+
+function calcTooltipPosition(position, rect, contentSize) {
+    var domWidth = contentSize[0];
+    var domHeight = contentSize[1];
+    var gap = 5;
+    var x = 0;
+    var y = 0;
+    var rectWidth = rect.width;
+    var rectHeight = rect.height;
+    switch (position) {
+        case 'inside':
+            x = rect.x + rectWidth / 2 - domWidth / 2;
+            y = rect.y + rectHeight / 2 - domHeight / 2;
+            break;
+        case 'top':
+            x = rect.x + rectWidth / 2 - domWidth / 2;
+            y = rect.y - domHeight - gap;
+            break;
+        case 'bottom':
+            x = rect.x + rectWidth / 2 - domWidth / 2;
+            y = rect.y + rectHeight + gap;
+            break;
+        case 'left':
+            x = rect.x - domWidth - gap;
+            y = rect.y + rectHeight / 2 - domHeight / 2;
+            break;
+        case 'right':
+            x = rect.x + rectWidth + gap;
+            y = rect.y + rectHeight / 2 - domHeight / 2;
+    }
+    return [x, y];
+}
+
+function isCenterAlign(align) {
+    return align === 'center' || align === 'middle';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME Better way to pack data in graphic element
+
+/**
+ * @action
+ * @property {string} type
+ * @property {number} seriesIndex
+ * @property {number} dataIndex
+ * @property {number} [x]
+ * @property {number} [y]
+ */
+registerAction(
+    {
+        type: 'showTip',
+        event: 'showTip',
+        update: 'tooltip:manuallyShowTip'
+    },
+    // noop
+    function () {}
+);
+
+registerAction(
+    {
+        type: 'hideTip',
+        event: 'hideTip',
+        update: 'tooltip:manuallyHideTip'
+    },
+    // noop
+    function () {}
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getSeriesStackId$1(seriesModel) {
+    return seriesModel.get('stack')
+        || '__ec_stack_' + seriesModel.seriesIndex;
+}
+
+function getAxisKey$1(axis) {
+    return axis.dim;
+}
+
+/**
+ * @param {string} seriesType
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function barLayoutPolar(seriesType, ecModel, api) {
+
+    var width = api.getWidth();
+    var height = api.getHeight();
+
+    var lastStackCoords = {};
+
+    var barWidthAndOffset = calRadialBar(
+        filter(
+            ecModel.getSeriesByType(seriesType),
+            function (seriesModel) {
+                return !ecModel.isSeriesFiltered(seriesModel)
+                    && seriesModel.coordinateSystem
+                    && seriesModel.coordinateSystem.type === 'polar';
+            }
+        )
+    );
+
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        // Check series coordinate, do layout for polar only
+        if (seriesModel.coordinateSystem.type !== 'polar') {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var polar = seriesModel.coordinateSystem;
+        var baseAxis = polar.getBaseAxis();
+
+        var stackId = getSeriesStackId$1(seriesModel);
+        var columnLayoutInfo
+            = barWidthAndOffset[getAxisKey$1(baseAxis)][stackId];
+        var columnOffset = columnLayoutInfo.offset;
+        var columnWidth = columnLayoutInfo.width;
+        var valueAxis = polar.getOtherAxis(baseAxis);
+
+        var center = seriesModel.get('center') || ['50%', '50%'];
+        var cx = parsePercent$1(center[0], width);
+        var cy = parsePercent$1(center[1], height);
+
+        var barMinHeight = seriesModel.get('barMinHeight') || 0;
+        var barMinAngle = seriesModel.get('barMinAngle') || 0;
+
+        lastStackCoords[stackId] = lastStackCoords[stackId] || [];
+
+        var valueDim = data.mapDimension(valueAxis.dim);
+        var baseDim = data.mapDimension(baseAxis.dim);
+        var stacked = isDimensionStacked(data, valueDim /*, baseDim*/);
+
+        var valueAxisStart = valueAxis.getExtent()[0];
+
+        for (var idx = 0, len = data.count(); idx < len; idx++) {
+            var value = data.get(valueDim, idx);
+            var baseValue = data.get(baseDim, idx);
+
+            if (isNaN(value)) {
+                continue;
+            }
+
+            var sign = value >= 0 ? 'p' : 'n';
+            var baseCoord = valueAxisStart;
+
+            // Because of the barMinHeight, we can not use the value in
+            // stackResultDimension directly.
+            // Only ordinal axis can be stacked.
+            if (stacked) {
+                if (!lastStackCoords[stackId][baseValue]) {
+                    lastStackCoords[stackId][baseValue] = {
+                        p: valueAxisStart, // Positive stack
+                        n: valueAxisStart  // Negative stack
+                    };
+                }
+                // Should also consider #4243
+                baseCoord = lastStackCoords[stackId][baseValue][sign];
+            }
+
+            var r0;
+            var r;
+            var startAngle;
+            var endAngle;
+
+            // radial sector
+            if (valueAxis.dim === 'radius') {
+                var radiusSpan = valueAxis.dataToRadius(value) - valueAxisStart;
+                var angle = baseAxis.dataToAngle(baseValue);
+
+                if (Math.abs(radiusSpan) < barMinHeight) {
+                    radiusSpan = (radiusSpan < 0 ? -1 : 1) * barMinHeight;
+                }
+
+                r0 = baseCoord;
+                r = baseCoord + radiusSpan;
+                startAngle = angle - columnOffset;
+                endAngle = startAngle - columnWidth;
+
+                stacked && (lastStackCoords[stackId][baseValue][sign] = r);
+            }
+            // tangential sector
+            else {
+                // angleAxis must be clamped.
+                var angleSpan = valueAxis.dataToAngle(value, true) - valueAxisStart;
+                var radius = baseAxis.dataToRadius(baseValue);
+
+                if (Math.abs(angleSpan) < barMinAngle) {
+                    angleSpan = (angleSpan < 0 ? -1 : 1) * barMinAngle;
+                }
+
+                r0 = radius + columnOffset;
+                r = r0 + columnWidth;
+                startAngle = baseCoord;
+                endAngle = baseCoord + angleSpan;
+
+                // if the previous stack is at the end of the ring,
+                // add a round to differentiate it from origin
+                // var extent = angleAxis.getExtent();
+                // var stackCoord = angle;
+                // if (stackCoord === extent[0] && value > 0) {
+                //     stackCoord = extent[1];
+                // }
+                // else if (stackCoord === extent[1] && value < 0) {
+                //     stackCoord = extent[0];
+                // }
+                stacked && (lastStackCoords[stackId][baseValue][sign] = endAngle);
+            }
+
+            data.setItemLayout(idx, {
+                cx: cx,
+                cy: cy,
+                r0: r0,
+                r: r,
+                // Consider that positive angle is anti-clockwise,
+                // while positive radian of sector is clockwise
+                startAngle: -startAngle * Math.PI / 180,
+                endAngle: -endAngle * Math.PI / 180
+            });
+
+        }
+
+    }, this);
+
+}
+
+/**
+ * Calculate bar width and offset for radial bar charts
+ */
+function calRadialBar(barSeries, api) {
+    // Columns info on each category axis. Key is polar name
+    var columnsMap = {};
+
+    each$1(barSeries, function (seriesModel, idx) {
+        var data = seriesModel.getData();
+        var polar = seriesModel.coordinateSystem;
+
+        var baseAxis = polar.getBaseAxis();
+
+        var axisExtent = baseAxis.getExtent();
+        var bandWidth = baseAxis.type === 'category'
+            ? baseAxis.getBandWidth()
+            : (Math.abs(axisExtent[1] - axisExtent[0]) / data.count());
+
+        var columnsOnAxis = columnsMap[getAxisKey$1(baseAxis)] || {
+            bandWidth: bandWidth,
+            remainedWidth: bandWidth,
+            autoWidthCount: 0,
+            categoryGap: '20%',
+            gap: '30%',
+            stacks: {}
+        };
+        var stacks = columnsOnAxis.stacks;
+        columnsMap[getAxisKey$1(baseAxis)] = columnsOnAxis;
+
+        var stackId = getSeriesStackId$1(seriesModel);
+
+        if (!stacks[stackId]) {
+            columnsOnAxis.autoWidthCount++;
+        }
+        stacks[stackId] = stacks[stackId] || {
+            width: 0,
+            maxWidth: 0
+        };
+
+        var barWidth = parsePercent$1(
+            seriesModel.get('barWidth'),
+            bandWidth
+        );
+        var barMaxWidth = parsePercent$1(
+            seriesModel.get('barMaxWidth'),
+            bandWidth
+        );
+        var barGap = seriesModel.get('barGap');
+        var barCategoryGap = seriesModel.get('barCategoryGap');
+
+        if (barWidth && !stacks[stackId].width) {
+            barWidth = Math.min(columnsOnAxis.remainedWidth, barWidth);
+            stacks[stackId].width = barWidth;
+            columnsOnAxis.remainedWidth -= barWidth;
+        }
+
+        barMaxWidth && (stacks[stackId].maxWidth = barMaxWidth);
+        (barGap != null) && (columnsOnAxis.gap = barGap);
+        (barCategoryGap != null) && (columnsOnAxis.categoryGap = barCategoryGap);
+    });
+
+
+    var result = {};
+
+    each$1(columnsMap, function (columnsOnAxis, coordSysName) {
+
+        result[coordSysName] = {};
+
+        var stacks = columnsOnAxis.stacks;
+        var bandWidth = columnsOnAxis.bandWidth;
+        var categoryGap = parsePercent$1(columnsOnAxis.categoryGap, bandWidth);
+        var barGapPercent = parsePercent$1(columnsOnAxis.gap, 1);
+
+        var remainedWidth = columnsOnAxis.remainedWidth;
+        var autoWidthCount = columnsOnAxis.autoWidthCount;
+        var autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        // Find if any auto calculated bar exceeded maxBarWidth
+        each$1(stacks, function (column, stack) {
+            var maxWidth = column.maxWidth;
+            if (maxWidth && maxWidth < autoWidth) {
+                maxWidth = Math.min(maxWidth, remainedWidth);
+                if (column.width) {
+                    maxWidth = Math.min(maxWidth, column.width);
+                }
+                remainedWidth -= maxWidth;
+                column.width = maxWidth;
+                autoWidthCount--;
+            }
+        });
+
+        // Recalculate width again
+        autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        var widthSum = 0;
+        var lastColumn;
+        each$1(stacks, function (column, idx) {
+            if (!column.width) {
+                column.width = autoWidth;
+            }
+            lastColumn = column;
+            widthSum += column.width * (1 + barGapPercent);
+        });
+        if (lastColumn) {
+            widthSum -= lastColumn.width * barGapPercent;
+        }
+
+        var offset = -widthSum / 2;
+        each$1(stacks, function (column, stackId) {
+            result[coordSysName][stackId] = result[coordSysName][stackId] || {
+                offset: offset,
+                width: column.width
+            };
+
+            offset += column.width * (1 + barGapPercent);
+        });
+    });
+
+    return result;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function RadiusAxis(scale, radiusExtent) {
+
+    Axis.call(this, 'radius', scale, radiusExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = 'category';
+}
+
+RadiusAxis.prototype = {
+
+    constructor: RadiusAxis,
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.polar.pointToData(point, clamp)[this.dim === 'radius' ? 0 : 1];
+    },
+
+    dataToRadius: Axis.prototype.dataToCoord,
+
+    radiusToData: Axis.prototype.coordToData
+};
+
+inherits(RadiusAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function AngleAxis(scale, angleExtent) {
+
+    angleExtent = angleExtent || [0, 360];
+
+    Axis.call(this, 'angle', scale, angleExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = 'category';
+}
+
+AngleAxis.prototype = {
+
+    constructor: AngleAxis,
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.polar.pointToData(point, clamp)[this.dim === 'radius' ? 0 : 1];
+    },
+
+    dataToAngle: Axis.prototype.dataToCoord,
+
+    angleToData: Axis.prototype.coordToData
+};
+
+inherits(AngleAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/coord/polar/Polar
+ */
+
+/**
+ * @alias {module:echarts/coord/polar/Polar}
+ * @constructor
+ * @param {string} name
+ */
+var Polar = function (name) {
+
+    /**
+     * @type {string}
+     */
+    this.name = name || '';
+
+    /**
+     * x of polar center
+     * @type {number}
+     */
+    this.cx = 0;
+
+    /**
+     * y of polar center
+     * @type {number}
+     */
+    this.cy = 0;
+
+    /**
+     * @type {module:echarts/coord/polar/RadiusAxis}
+     * @private
+     */
+    this._radiusAxis = new RadiusAxis();
+
+    /**
+     * @type {module:echarts/coord/polar/AngleAxis}
+     * @private
+     */
+    this._angleAxis = new AngleAxis();
+
+    this._radiusAxis.polar = this._angleAxis.polar = this;
+};
+
+Polar.prototype = {
+
+    type: 'polar',
+
+    axisPointerEnabled: true,
+
+    constructor: Polar,
+
+    /**
+     * @param {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['radius', 'angle'],
+
+    /**
+     * @type {module:echarts/coord/PolarModel}
+     */
+    model: null,
+
+    /**
+     * If contain coord
+     * @param {Array.<number>} point
+     * @return {boolean}
+     */
+    containPoint: function (point) {
+        var coord = this.pointToCoord(point);
+        return this._radiusAxis.contain(coord[0])
+            && this._angleAxis.contain(coord[1]);
+    },
+
+    /**
+     * If contain data
+     * @param {Array.<number>} data
+     * @return {boolean}
+     */
+    containData: function (data) {
+        return this._radiusAxis.containData(data[0])
+            && this._angleAxis.containData(data[1]);
+    },
+
+    /**
+     * @param {string} dim
+     * @return {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+     */
+    getAxis: function (dim) {
+        return this['_' + dim + 'Axis'];
+    },
+
+    /**
+     * @return {Array.<module:echarts/coord/Axis>}
+     */
+    getAxes: function () {
+        return [this._radiusAxis, this._angleAxis];
+    },
+
+    /**
+     * Get axes by type of scale
+     * @param {string} scaleType
+     * @return {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+     */
+    getAxesByScale: function (scaleType) {
+        var axes = [];
+        var angleAxis = this._angleAxis;
+        var radiusAxis = this._radiusAxis;
+        angleAxis.scale.type === scaleType && axes.push(angleAxis);
+        radiusAxis.scale.type === scaleType && axes.push(radiusAxis);
+
+        return axes;
+    },
+
+    /**
+     * @return {module:echarts/coord/polar/AngleAxis}
+     */
+    getAngleAxis: function () {
+        return this._angleAxis;
+    },
+
+    /**
+     * @return {module:echarts/coord/polar/RadiusAxis}
+     */
+    getRadiusAxis: function () {
+        return this._radiusAxis;
+    },
+
+    /**
+     * @param {module:echarts/coord/polar/Axis}
+     * @return {module:echarts/coord/polar/Axis}
+     */
+    getOtherAxis: function (axis) {
+        var angleAxis = this._angleAxis;
+        return axis === angleAxis ? this._radiusAxis : angleAxis;
+    },
+
+    /**
+     * Base axis will be used on stacking.
+     *
+     * @return {module:echarts/coord/polar/Axis}
+     */
+    getBaseAxis: function () {
+        return this.getAxesByScale('ordinal')[0]
+            || this.getAxesByScale('time')[0]
+            || this.getAngleAxis();
+    },
+
+    /**
+     * @param {string} [dim] 'radius' or 'angle' or 'auto' or null/undefined
+     * @return {Object} {baseAxes: [], otherAxes: []}
+     */
+    getTooltipAxes: function (dim) {
+        var baseAxis = (dim != null && dim !== 'auto')
+            ? this.getAxis(dim) : this.getBaseAxis();
+        return {
+            baseAxes: [baseAxis],
+            otherAxes: [this.getOtherAxis(baseAxis)]
+        };
+    },
+
+    /**
+     * Convert a single data item to (x, y) point.
+     * Parameter data is an array which the first element is radius and the second is angle
+     * @param {Array.<number>} data
+     * @param {boolean} [clamp=false]
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, clamp) {
+        return this.coordToPoint([
+            this._radiusAxis.dataToRadius(data[0], clamp),
+            this._angleAxis.dataToAngle(data[1], clamp)
+        ]);
+    },
+
+    /**
+     * Convert a (x, y) point to data
+     * @param {Array.<number>} point
+     * @param {boolean} [clamp=false]
+     * @return {Array.<number>}
+     */
+    pointToData: function (point, clamp) {
+        var coord = this.pointToCoord(point);
+        return [
+            this._radiusAxis.radiusToData(coord[0], clamp),
+            this._angleAxis.angleToData(coord[1], clamp)
+        ];
+    },
+
+    /**
+     * Convert a (x, y) point to (radius, angle) coord
+     * @param {Array.<number>} point
+     * @return {Array.<number>}
+     */
+    pointToCoord: function (point) {
+        var dx = point[0] - this.cx;
+        var dy = point[1] - this.cy;
+        var angleAxis = this.getAngleAxis();
+        var extent = angleAxis.getExtent();
+        var minAngle = Math.min(extent[0], extent[1]);
+        var maxAngle = Math.max(extent[0], extent[1]);
+        // Fix fixed extent in polarCreator
+        // FIXME
+        angleAxis.inverse
+            ? (minAngle = maxAngle - 360)
+            : (maxAngle = minAngle + 360);
+
+        var radius = Math.sqrt(dx * dx + dy * dy);
+        dx /= radius;
+        dy /= radius;
+
+        var radian = Math.atan2(-dy, dx) / Math.PI * 180;
+
+        // move to angleExtent
+        var dir = radian < minAngle ? 1 : -1;
+        while (radian < minAngle || radian > maxAngle) {
+            radian += dir * 360;
+        }
+
+        return [radius, radian];
+    },
+
+    /**
+     * Convert a (radius, angle) coord to (x, y) point
+     * @param {Array.<number>} coord
+     * @return {Array.<number>}
+     */
+    coordToPoint: function (coord) {
+        var radius = coord[0];
+        var radian = coord[1] / 180 * Math.PI;
+        var x = Math.cos(radian) * radius + this.cx;
+        // Inverse the y
+        var y = -Math.sin(radian) * radius + this.cy;
+
+        return [x, y];
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PolarAxisModel = ComponentModel.extend({
+
+    type: 'polarAxis',
+
+    /**
+     * @type {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+     */
+    axis: null,
+
+    /**
+     * @override
+     */
+    getCoordSysModel: function () {
+        return this.ecModel.queryComponents({
+            mainType: 'polar',
+            index: this.option.polarIndex,
+            id: this.option.polarId
+        })[0];
+    }
+
+});
+
+merge(PolarAxisModel.prototype, axisModelCommonMixin);
+
+var polarAxisDefaultExtendedOption = {
+    angle: {
+        // polarIndex: 0,
+        // polarId: '',
+
+        startAngle: 90,
+
+        clockwise: true,
+
+        splitNumber: 12,
+
+        axisLabel: {
+            rotate: false
+        }
+    },
+    radius: {
+        // polarIndex: 0,
+        // polarId: '',
+
+        splitNumber: 5
+    }
+};
+
+function getAxisType$3(axisDim, option) {
+    // Default axis with data is category axis
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+axisModelCreator('angle', PolarAxisModel, getAxisType$3, polarAxisDefaultExtendedOption.angle);
+axisModelCreator('radius', PolarAxisModel, getAxisType$3, polarAxisDefaultExtendedOption.radius);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentModel({
+
+    type: 'polar',
+
+    dependencies: ['polarAxis', 'angleAxis'],
+
+    /**
+     * @type {module:echarts/coord/polar/Polar}
+     */
+    coordinateSystem: null,
+
+    /**
+     * @param {string} axisType
+     * @return {module:echarts/coord/polar/AxisModel}
+     */
+    findAxisModel: function (axisType) {
+        var foundAxisModel;
+        var ecModel = this.ecModel;
+
+        ecModel.eachComponent(axisType, function (axisModel) {
+            if (axisModel.getCoordSysModel() === this) {
+                foundAxisModel = axisModel;
+            }
+        }, this);
+        return foundAxisModel;
+    },
+
+    defaultOption: {
+
+        zlevel: 0,
+
+        z: 0,
+
+        center: ['50%', '50%'],
+
+        radius: '80%'
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Axis scale
+
+/**
+ * Resize method bound to the polar
+ * @param {module:echarts/coord/polar/PolarModel} polarModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function resizePolar(polar, polarModel, api) {
+    var center = polarModel.get('center');
+    var width = api.getWidth();
+    var height = api.getHeight();
+
+    polar.cx = parsePercent$1(center[0], width);
+    polar.cy = parsePercent$1(center[1], height);
+
+    var radiusAxis = polar.getRadiusAxis();
+    var size = Math.min(width, height) / 2;
+    var radius = parsePercent$1(polarModel.get('radius'), size);
+    radiusAxis.inverse
+        ? radiusAxis.setExtent(radius, 0)
+        : radiusAxis.setExtent(0, radius);
+}
+
+/**
+ * Update polar
+ */
+function updatePolarScale(ecModel, api) {
+    var polar = this;
+    var angleAxis = polar.getAngleAxis();
+    var radiusAxis = polar.getRadiusAxis();
+    // Reset scale
+    angleAxis.scale.setExtent(Infinity, -Infinity);
+    radiusAxis.scale.setExtent(Infinity, -Infinity);
+
+    ecModel.eachSeries(function (seriesModel) {
+        if (seriesModel.coordinateSystem === polar) {
+            var data = seriesModel.getData();
+            each$1(data.mapDimension('radius', true), function (dim) {
+                radiusAxis.scale.unionExtentFromData(
+                    data, getStackedDimension(data, dim)
+                );
+            });
+            each$1(data.mapDimension('angle', true), function (dim) {
+                angleAxis.scale.unionExtentFromData(
+                    data, getStackedDimension(data, dim)
+                );
+            });
+        }
+    });
+
+    niceScaleExtent(angleAxis.scale, angleAxis.model);
+    niceScaleExtent(radiusAxis.scale, radiusAxis.model);
+
+    // Fix extent of category angle axis
+    if (angleAxis.type === 'category' && !angleAxis.onBand) {
+        var extent = angleAxis.getExtent();
+        var diff = 360 / angleAxis.scale.count();
+        angleAxis.inverse ? (extent[1] += diff) : (extent[1] -= diff);
+        angleAxis.setExtent(extent[0], extent[1]);
+    }
+}
+
+/**
+ * Set common axis properties
+ * @param {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+ * @param {module:echarts/coord/polar/AxisModel}
+ * @inner
+ */
+function setAxis(axis, axisModel) {
+    axis.type = axisModel.get('type');
+    axis.scale = createScaleByModel(axisModel);
+    axis.onBand = axisModel.get('boundaryGap') && axis.type === 'category';
+    axis.inverse = axisModel.get('inverse');
+
+    if (axisModel.mainType === 'angleAxis') {
+        axis.inverse ^= axisModel.get('clockwise');
+        var startAngle = axisModel.get('startAngle');
+        axis.setExtent(startAngle, startAngle + (axis.inverse ? -360 : 360));
+    }
+
+    // Inject axis instance
+    axisModel.axis = axis;
+    axis.model = axisModel;
+}
+
+
+var polarCreator = {
+
+    dimensions: Polar.prototype.dimensions,
+
+    create: function (ecModel, api) {
+        var polarList = [];
+        ecModel.eachComponent('polar', function (polarModel, idx) {
+            var polar = new Polar(idx);
+            // Inject resize and update method
+            polar.update = updatePolarScale;
+
+            var radiusAxis = polar.getRadiusAxis();
+            var angleAxis = polar.getAngleAxis();
+
+            var radiusAxisModel = polarModel.findAxisModel('radiusAxis');
+            var angleAxisModel = polarModel.findAxisModel('angleAxis');
+
+            setAxis(radiusAxis, radiusAxisModel);
+            setAxis(angleAxis, angleAxisModel);
+
+            resizePolar(polar, polarModel, api);
+
+            polarList.push(polar);
+
+            polarModel.coordinateSystem = polar;
+            polar.model = polarModel;
+        });
+        // Inject coordinateSystem to series
+        ecModel.eachSeries(function (seriesModel) {
+            if (seriesModel.get('coordinateSystem') === 'polar') {
+                var polarModel = ecModel.queryComponents({
+                    mainType: 'polar',
+                    index: seriesModel.get('polarIndex'),
+                    id: seriesModel.get('polarId')
+                })[0];
+
+                if (__DEV__) {
+                    if (!polarModel) {
+                        throw new Error(
+                            'Polar "' + retrieve(
+                                seriesModel.get('polarIndex'),
+                                seriesModel.get('polarId'),
+                                0
+                            ) + '" not found'
+                        );
+                    }
+                }
+                seriesModel.coordinateSystem = polarModel.coordinateSystem;
+            }
+        });
+
+        return polarList;
+    }
+};
+
+CoordinateSystemManager.register('polar', polarCreator);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var elementList$1 = ['axisLine', 'axisLabel', 'axisTick', 'splitLine', 'splitArea'];
+
+function getAxisLineShape(polar, rExtent, angle) {
+    rExtent[1] > rExtent[0] && (rExtent = rExtent.slice().reverse());
+    var start = polar.coordToPoint([rExtent[0], angle]);
+    var end = polar.coordToPoint([rExtent[1], angle]);
+
+    return {
+        x1: start[0],
+        y1: start[1],
+        x2: end[0],
+        y2: end[1]
+    };
+}
+
+function getRadiusIdx(polar) {
+    var radiusAxis = polar.getRadiusAxis();
+    return radiusAxis.inverse ? 0 : 1;
+}
+
+// Remove the last tick which will overlap the first tick
+function fixAngleOverlap(list) {
+    var firstItem = list[0];
+    var lastItem = list[list.length - 1];
+    if (firstItem
+        && lastItem
+        && Math.abs(Math.abs(firstItem.coord - lastItem.coord) - 360) < 1e-4
+    ) {
+        list.pop();
+    }
+}
+
+AxisView.extend({
+
+    type: 'angleAxis',
+
+    axisPointerClass: 'PolarAxisPointer',
+
+    render: function (angleAxisModel, ecModel) {
+        this.group.removeAll();
+        if (!angleAxisModel.get('show')) {
+            return;
+        }
+
+        var angleAxis = angleAxisModel.axis;
+        var polar = angleAxis.polar;
+        var radiusExtent = polar.getRadiusAxis().getExtent();
+
+        var ticksAngles = angleAxis.getTicksCoords();
+        var labels = map(angleAxis.getViewLabels(), function (labelItem) {
+            var labelItem = clone(labelItem);
+            labelItem.coord = angleAxis.dataToCoord(labelItem.tickValue);
+            return labelItem;
+        });
+
+        fixAngleOverlap(labels);
+        fixAngleOverlap(ticksAngles);
+
+        each$1(elementList$1, function (name) {
+            if (angleAxisModel.get(name +'.show')
+                && (!angleAxis.scale.isBlank() || name === 'axisLine')
+            ) {
+                this['_' + name](angleAxisModel, polar, ticksAngles, radiusExtent, labels);
+            }
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _axisLine: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        var lineStyleModel = angleAxisModel.getModel('axisLine.lineStyle');
+
+        var circle = new Circle({
+            shape: {
+                cx: polar.cx,
+                cy: polar.cy,
+                r: radiusExtent[getRadiusIdx(polar)]
+            },
+            style: lineStyleModel.getLineStyle(),
+            z2: 1,
+            silent: true
+        });
+        circle.style.fill = null;
+
+        this.group.add(circle);
+    },
+
+    /**
+     * @private
+     */
+    _axisTick: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        var tickModel = angleAxisModel.getModel('axisTick');
+
+        var tickLen = (tickModel.get('inside') ? -1 : 1) * tickModel.get('length');
+        var radius = radiusExtent[getRadiusIdx(polar)];
+
+        var lines = map(ticksAngles, function (tickAngleItem) {
+            return new Line({
+                shape: getAxisLineShape(polar, [radius, radius + tickLen], tickAngleItem.coord)
+            });
+        });
+        this.group.add(mergePath(
+            lines, {
+                style: defaults(
+                    tickModel.getModel('lineStyle').getLineStyle(),
+                    {
+                        stroke: angleAxisModel.get('axisLine.lineStyle.color')
+                    }
+                )
+            }
+        ));
+    },
+
+    /**
+     * @private
+     */
+    _axisLabel: function (angleAxisModel, polar, ticksAngles, radiusExtent, labels) {
+        var rawCategoryData = angleAxisModel.getCategories(true);
+
+        var commonLabelModel = angleAxisModel.getModel('axisLabel');
+
+        var labelMargin = commonLabelModel.get('margin');
+
+        // Use length of ticksAngles because it may remove the last tick to avoid overlapping
+        each$1(labels, function (labelItem, idx) {
+            var labelModel = commonLabelModel;
+            var tickValue = labelItem.tickValue;
+
+            var r = radiusExtent[getRadiusIdx(polar)];
+            var p = polar.coordToPoint([r + labelMargin, labelItem.coord]);
+            var cx = polar.cx;
+            var cy = polar.cy;
+
+            var labelTextAlign = Math.abs(p[0] - cx) / r < 0.3
+                ? 'center' : (p[0] > cx ? 'left' : 'right');
+            var labelTextVerticalAlign = Math.abs(p[1] - cy) / r < 0.3
+                ? 'middle' : (p[1] > cy ? 'top' : 'bottom');
+
+            if (rawCategoryData && rawCategoryData[tickValue] && rawCategoryData[tickValue].textStyle) {
+                labelModel = new Model(rawCategoryData[tickValue].textStyle, commonLabelModel, commonLabelModel.ecModel);
+            }
+
+            var textEl = new Text({silent: true});
+            this.group.add(textEl);
+            setTextStyle(textEl.style, labelModel, {
+                x: p[0],
+                y: p[1],
+                textFill: labelModel.getTextColor() || angleAxisModel.get('axisLine.lineStyle.color'),
+                text: labelItem.formattedLabel,
+                textAlign: labelTextAlign,
+                textVerticalAlign: labelTextVerticalAlign
+            });
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _splitLine: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        var splitLineModel = angleAxisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineColors = lineStyleModel.get('color');
+        var lineCount = 0;
+
+        lineColors = lineColors instanceof Array ? lineColors : [lineColors];
+
+        var splitLines = [];
+
+        for (var i = 0; i < ticksAngles.length; i++) {
+            var colorIndex = (lineCount++) % lineColors.length;
+            splitLines[colorIndex] = splitLines[colorIndex] || [];
+            splitLines[colorIndex].push(new Line({
+                shape: getAxisLineShape(polar, radiusExtent, ticksAngles[i].coord)
+            }));
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitLines.length; i++) {
+            this.group.add(mergePath(splitLines[i], {
+                style: defaults({
+                    stroke: lineColors[i % lineColors.length]
+                }, lineStyleModel.getLineStyle()),
+                silent: true,
+                z: angleAxisModel.get('z')
+            }));
+        }
+    },
+
+    /**
+     * @private
+     */
+    _splitArea: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        if (!ticksAngles.length) {
+            return;
+        }
+
+        var splitAreaModel = angleAxisModel.getModel('splitArea');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+        var areaColors = areaStyleModel.get('color');
+        var lineCount = 0;
+
+        areaColors = areaColors instanceof Array ? areaColors : [areaColors];
+
+        var splitAreas = [];
+
+        var RADIAN = Math.PI / 180;
+        var prevAngle = -ticksAngles[0].coord * RADIAN;
+        var r0 = Math.min(radiusExtent[0], radiusExtent[1]);
+        var r1 = Math.max(radiusExtent[0], radiusExtent[1]);
+
+        var clockwise = angleAxisModel.get('clockwise');
+
+        for (var i = 1; i < ticksAngles.length; i++) {
+            var colorIndex = (lineCount++) % areaColors.length;
+            splitAreas[colorIndex] = splitAreas[colorIndex] || [];
+            splitAreas[colorIndex].push(new Sector({
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r0: r0,
+                    r: r1,
+                    startAngle: prevAngle,
+                    endAngle: -ticksAngles[i].coord * RADIAN,
+                    clockwise: clockwise
+                },
+                silent: true
+            }));
+            prevAngle = -ticksAngles[i].coord * RADIAN;
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitAreas.length; i++) {
+            this.group.add(mergePath(splitAreas[i], {
+                style: defaults({
+                    fill: areaColors[i % areaColors.length]
+                }, areaStyleModel.getAreaStyle()),
+                silent: true
+            }));
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisBuilderAttrs$3 = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+var selfBuilderAttrs$1 = [
+    'splitLine', 'splitArea'
+];
+
+AxisView.extend({
+
+    type: 'radiusAxis',
+
+    axisPointerClass: 'PolarAxisPointer',
+
+    render: function (radiusAxisModel, ecModel) {
+        this.group.removeAll();
+        if (!radiusAxisModel.get('show')) {
+            return;
+        }
+        var radiusAxis = radiusAxisModel.axis;
+        var polar = radiusAxis.polar;
+        var angleAxis = polar.getAngleAxis();
+        var ticksCoords = radiusAxis.getTicksCoords();
+        var axisAngle = angleAxis.getExtent()[0];
+        var radiusExtent = radiusAxis.getExtent();
+
+        var layout = layoutAxis(polar, radiusAxisModel, axisAngle);
+        var axisBuilder = new AxisBuilder(radiusAxisModel, layout);
+        each$1(axisBuilderAttrs$3, axisBuilder.add, axisBuilder);
+        this.group.add(axisBuilder.getGroup());
+
+        each$1(selfBuilderAttrs$1, function (name) {
+            if (radiusAxisModel.get(name +'.show') && !radiusAxis.scale.isBlank()) {
+                this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords);
+            }
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _splitLine: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords) {
+        var splitLineModel = radiusAxisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineColors = lineStyleModel.get('color');
+        var lineCount = 0;
+
+        lineColors = lineColors instanceof Array ? lineColors : [lineColors];
+
+        var splitLines = [];
+
+        for (var i = 0; i < ticksCoords.length; i++) {
+            var colorIndex = (lineCount++) % lineColors.length;
+            splitLines[colorIndex] = splitLines[colorIndex] || [];
+            splitLines[colorIndex].push(new Circle({
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r: ticksCoords[i].coord
+                },
+                silent: true
+            }));
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitLines.length; i++) {
+            this.group.add(mergePath(splitLines[i], {
+                style: defaults({
+                    stroke: lineColors[i % lineColors.length],
+                    fill: null
+                }, lineStyleModel.getLineStyle()),
+                silent: true
+            }));
+        }
+    },
+
+    /**
+     * @private
+     */
+    _splitArea: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords) {
+        if (!ticksCoords.length) {
+            return;
+        }
+
+        var splitAreaModel = radiusAxisModel.getModel('splitArea');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+        var areaColors = areaStyleModel.get('color');
+        var lineCount = 0;
+
+        areaColors = areaColors instanceof Array ? areaColors : [areaColors];
+
+        var splitAreas = [];
+
+        var prevRadius = ticksCoords[0].coord;
+        for (var i = 1; i < ticksCoords.length; i++) {
+            var colorIndex = (lineCount++) % areaColors.length;
+            splitAreas[colorIndex] = splitAreas[colorIndex] || [];
+            splitAreas[colorIndex].push(new Sector({
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r0: prevRadius,
+                    r: ticksCoords[i].coord,
+                    startAngle: 0,
+                    endAngle: Math.PI * 2
+                },
+                silent: true
+            }));
+            prevRadius = ticksCoords[i].coord;
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitAreas.length; i++) {
+            this.group.add(mergePath(splitAreas[i], {
+                style: defaults({
+                    fill: areaColors[i % areaColors.length]
+                }, areaStyleModel.getAreaStyle()),
+                silent: true
+            }));
+        }
+    }
+});
+
+/**
+ * @inner
+ */
+function layoutAxis(polar, radiusAxisModel, axisAngle) {
+    return {
+        position: [polar.cx, polar.cy],
+        rotation: axisAngle / 180 * Math.PI,
+        labelDirection: -1,
+        tickDirection: -1,
+        nameDirection: 1,
+        labelRotate: radiusAxisModel.getModel('axisLabel').get('rotate'),
+        // Over splitLine and splitArea
+        z2: 1
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PolarAxisPointer = BaseAxisPointer.extend({
+
+    /**
+     * @override
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        var axis = axisModel.axis;
+
+        if (axis.dim === 'angle') {
+            this.animationThreshold = Math.PI / 18;
+        }
+
+        var polar = axis.polar;
+        var otherAxis = polar.getOtherAxis(axis);
+        var otherExtent = otherAxis.getExtent();
+
+        var coordValue;
+        coordValue = axis['dataTo' + capitalFirst(axis.dim)](value);
+
+        var axisPointerType = axisPointerModel.get('type');
+        if (axisPointerType && axisPointerType !== 'none') {
+            var elStyle = buildElStyle(axisPointerModel);
+            var pointerOption = pointerShapeBuilder$2[axisPointerType](
+                axis, polar, coordValue, otherExtent, elStyle
+            );
+            pointerOption.style = elStyle;
+            elOption.graphicKey = pointerOption.type;
+            elOption.pointer = pointerOption;
+        }
+
+        var labelMargin = axisPointerModel.get('label.margin');
+        var labelPos = getLabelPosition(value, axisModel, axisPointerModel, polar, labelMargin);
+        buildLabelElOption(elOption, axisModel, axisPointerModel, api, labelPos);
+    }
+
+    // Do not support handle, utill any user requires it.
+
+});
+
+function getLabelPosition(value, axisModel, axisPointerModel, polar, labelMargin) {
+    var axis = axisModel.axis;
+    var coord = axis.dataToCoord(value);
+    var axisAngle = polar.getAngleAxis().getExtent()[0];
+    axisAngle = axisAngle / 180 * Math.PI;
+    var radiusExtent = polar.getRadiusAxis().getExtent();
+    var position;
+    var align;
+    var verticalAlign;
+
+    if (axis.dim === 'radius') {
+        var transform = create$1();
+        rotate(transform, transform, axisAngle);
+        translate(transform, transform, [polar.cx, polar.cy]);
+        position = applyTransform$1([coord, -labelMargin], transform);
+
+        var labelRotation = axisModel.getModel('axisLabel').get('rotate') || 0;
+        var labelLayout = AxisBuilder.innerTextLayout(
+            axisAngle, labelRotation * Math.PI / 180, -1
+        );
+        align = labelLayout.textAlign;
+        verticalAlign = labelLayout.textVerticalAlign;
+    }
+    else { // angle axis
+        var r = radiusExtent[1];
+        position = polar.coordToPoint([r + labelMargin, coord]);
+        var cx = polar.cx;
+        var cy = polar.cy;
+        align = Math.abs(position[0] - cx) / r < 0.3
+            ? 'center' : (position[0] > cx ? 'left' : 'right');
+        verticalAlign = Math.abs(position[1] - cy) / r < 0.3
+            ? 'middle' : (position[1] > cy ? 'top' : 'bottom');
+    }
+
+    return {
+        position: position,
+        align: align,
+        verticalAlign: verticalAlign
+    };
+}
+
+
+var pointerShapeBuilder$2 = {
+
+    line: function (axis, polar, coordValue, otherExtent, elStyle) {
+        return axis.dim === 'angle'
+            ? {
+                type: 'Line',
+                shape: makeLineShape(
+                    polar.coordToPoint([otherExtent[0], coordValue]),
+                    polar.coordToPoint([otherExtent[1], coordValue])
+                )
+            }
+            : {
+                type: 'Circle',
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r: coordValue
+                }
+            };
+    },
+
+    shadow: function (axis, polar, coordValue, otherExtent, elStyle) {
+        var bandWidth = Math.max(1, axis.getBandWidth());
+        var radian = Math.PI / 180;
+
+        return axis.dim === 'angle'
+            ? {
+                type: 'Sector',
+                shape: makeSectorShape(
+                    polar.cx, polar.cy,
+                    otherExtent[0], otherExtent[1],
+                    // In ECharts y is negative if angle is positive
+                    (-coordValue - bandWidth / 2) * radian,
+                    (-coordValue + bandWidth / 2) * radian
+                )
+            }
+            : {
+                type: 'Sector',
+                shape: makeSectorShape(
+                    polar.cx, polar.cy,
+                    coordValue - bandWidth / 2,
+                    coordValue + bandWidth / 2,
+                    0, Math.PI * 2
+                )
+            };
+    }
+};
+
+AxisView.registerAxisPointerClass('PolarAxisPointer', PolarAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// For reducing size of echarts.min, barLayoutPolar is required by polar.
+registerLayout(curry(barLayoutPolar, 'bar'));
+
+// Polar view
+extendComponentView({
+    type: 'polar'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var GeoModel = ComponentModel.extend({
+
+    type: 'geo',
+
+    /**
+     * @type {module:echarts/coord/geo/Geo}
+     */
+    coordinateSystem: null,
+
+    layoutMode: 'box',
+
+    init: function (option) {
+        ComponentModel.prototype.init.apply(this, arguments);
+
+        // Default label emphasis `show`
+        defaultEmphasis(option, 'label', ['show']);
+    },
+
+    optionUpdated: function () {
+        var option = this.option;
+        var self = this;
+
+        option.regions = geoCreator.getFilledRegions(option.regions, option.map, option.nameMap);
+
+        this._optionModelMap = reduce(option.regions || [], function (optionModelMap, regionOpt) {
+            if (regionOpt.name) {
+                optionModelMap.set(regionOpt.name, new Model(regionOpt, self));
+            }
+            return optionModelMap;
+        }, createHashMap());
+
+        this.updateSelectedMap(option.regions);
+    },
+
+    defaultOption: {
+
+        zlevel: 0,
+
+        z: 0,
+
+        show: true,
+
+        left: 'center',
+
+        top: 'center',
+
+
+        // width:,
+        // height:,
+        // right
+        // bottom
+
+        // Aspect is width / height. Inited to be geoJson bbox aspect
+        // This parameter is used for scale this aspect
+        aspectScale: 0.75,
+
+        ///// Layout with center and size
+        // If you wan't to put map in a fixed size box with right aspect ratio
+        // This two properties may more conveninet
+        // layoutCenter: [50%, 50%]
+        // layoutSize: 100
+
+
+        silent: false,
+
+        // Map type
+        map: '',
+
+        // Define left-top, right-bottom coords to control view
+        // For example, [ [180, 90], [-180, -90] ]
+        boundingCoords: null,
+
+        // Default on center of map
+        center: null,
+
+        zoom: 1,
+
+        scaleLimit: null,
+
+        // selectedMode: false
+
+        label: {
+            show: false,
+            color: '#000'
+        },
+
+        itemStyle: {
+            // color: 各异,
+            borderWidth: 0.5,
+            borderColor: '#444',
+            color: '#eee'
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                color: 'rgb(100,0,0)'
+            },
+            itemStyle: {
+                color: 'rgba(255,215,0,0.8)'
+            }
+        },
+
+        regions: []
+    },
+
+    /**
+     * Get model of region
+     * @param  {string} name
+     * @return {module:echarts/model/Model}
+     */
+    getRegionModel: function (name) {
+        return this._optionModelMap.get(name) || new Model(null, this, this.ecModel);
+    },
+
+    /**
+     * Format label
+     * @param {string} name Region name
+     * @param {string} [status='normal'] 'normal' or 'emphasis'
+     * @return {string}
+     */
+    getFormattedLabel: function (name, status) {
+        var regionModel = this.getRegionModel(name);
+        var formatter = regionModel.get('label.' + status + '.formatter');
+        var params = {
+            name: name
+        };
+        if (typeof formatter === 'function') {
+            params.status = status;
+            return formatter(params);
+        }
+        else if (typeof formatter === 'string') {
+            return formatter.replace('{a}', name != null ? name : '');
+        }
+    },
+
+    setZoom: function (zoom) {
+        this.option.zoom = zoom;
+    },
+
+    setCenter: function (center) {
+        this.option.center = center;
+    }
+});
+
+mixin(GeoModel, selectableMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+
+    type: 'geo',
+
+    init: function (ecModel, api) {
+        var mapDraw = new MapDraw(api, true);
+        this._mapDraw = mapDraw;
+
+        this.group.add(mapDraw.group);
+    },
+
+    render: function (geoModel, ecModel, api, payload) {
+        // Not render if it is an toggleSelect action from self
+        if (payload && payload.type === 'geoToggleSelect'
+            && payload.from === this.uid
+        ) {
+            return;
+        }
+
+        var mapDraw = this._mapDraw;
+        if (geoModel.get('show')) {
+            mapDraw.draw(geoModel, ecModel, api, this, payload);
+        }
+        else {
+            this._mapDraw.group.removeAll();
+        }
+
+        this.group.silent = geoModel.get('silent');
+    },
+
+    dispose: function () {
+        this._mapDraw && this._mapDraw.remove();
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function makeAction(method, actionInfo) {
+    actionInfo.update = 'updateView';
+    registerAction(actionInfo, function (payload, ecModel) {
+        var selected = {};
+
+        ecModel.eachComponent(
+            { mainType: 'geo', query: payload},
+            function (geoModel) {
+                geoModel[method](payload.name);
+                var geo = geoModel.coordinateSystem;
+                each$1(geo.regions, function (region) {
+                    selected[region.name] = geoModel.isSelected(region.name) || false;
+                });
+            }
+        );
+
+        return {
+            selected: selected,
+            name: payload.name
+        };
+    });
+}
+
+makeAction('toggleSelected', {
+    type: 'geoToggleSelect',
+    event: 'geoselectchanged'
+});
+makeAction('select', {
+    type: 'geoSelect',
+    event: 'geoselected'
+});
+makeAction('unSelect', {
+    type: 'geoUnSelect',
+    event: 'geounselected'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DEFAULT_TOOLBOX_BTNS = ['rect', 'polygon', 'keep', 'clear'];
+
+var preprocessor$1 = function (option, isNew) {
+    var brushComponents = option && option.brush;
+    if (!isArray(brushComponents)) {
+        brushComponents = brushComponents ? [brushComponents] : [];
+    }
+
+    if (!brushComponents.length) {
+        return;
+    }
+
+    var brushComponentSpecifiedBtns = [];
+
+    each$1(brushComponents, function (brushOpt) {
+        var tbs = brushOpt.hasOwnProperty('toolbox')
+            ? brushOpt.toolbox : [];
+
+        if (tbs instanceof Array) {
+            brushComponentSpecifiedBtns = brushComponentSpecifiedBtns.concat(tbs);
+        }
+    });
+
+    var toolbox = option && option.toolbox;
+
+    if (isArray(toolbox)) {
+        toolbox = toolbox[0];
+    }
+    if (!toolbox) {
+        toolbox = {feature: {}};
+        option.toolbox = [toolbox];
+    }
+
+    var toolboxFeature = (toolbox.feature || (toolbox.feature = {}));
+    var toolboxBrush = toolboxFeature.brush || (toolboxFeature.brush = {});
+    var brushTypes = toolboxBrush.type || (toolboxBrush.type = []);
+
+    brushTypes.push.apply(brushTypes, brushComponentSpecifiedBtns);
+
+    removeDuplicate(brushTypes);
+
+    if (isNew && !brushTypes.length) {
+        brushTypes.push.apply(brushTypes, DEFAULT_TOOLBOX_BTNS);
+    }
+};
+
+function removeDuplicate(arr) {
+    var map$$1 = {};
+    each$1(arr, function (val) {
+        map$$1[val] = 1;
+    });
+    arr.length = 0;
+    each$1(map$$1, function (flag, val) {
+        arr.push(val);
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual solution, for consistent option specification.
+ */
+
+var each$19 = each$1;
+
+function hasKeys(obj) {
+    if (obj) {
+        for (var name in obj){
+            if (obj.hasOwnProperty(name)) {
+                return true;
+            }
+        }
+    }
+}
+
+/**
+ * @param {Object} option
+ * @param {Array.<string>} stateList
+ * @param {Function} [supplementVisualOption]
+ * @return {Object} visualMappings <state, <visualType, module:echarts/visual/VisualMapping>>
+ */
+function createVisualMappings(option, stateList, supplementVisualOption) {
+    var visualMappings = {};
+
+    each$19(stateList, function (state) {
+        var mappings = visualMappings[state] = createMappings();
+
+        each$19(option[state], function (visualData, visualType) {
+            if (!VisualMapping.isValidType(visualType)) {
+                return;
+            }
+            var mappingOption = {
+                type: visualType,
+                visual: visualData
+            };
+            supplementVisualOption && supplementVisualOption(mappingOption, state);
+            mappings[visualType] = new VisualMapping(mappingOption);
+
+            // Prepare a alpha for opacity, for some case that opacity
+            // is not supported, such as rendering using gradient color.
+            if (visualType === 'opacity') {
+                mappingOption = clone(mappingOption);
+                mappingOption.type = 'colorAlpha';
+                mappings.__hidden.__alphaForOpacity = new VisualMapping(mappingOption);
+            }
+        });
+    });
+
+    return visualMappings;
+
+    function createMappings() {
+        var Creater = function () {};
+        // Make sure hidden fields will not be visited by
+        // object iteration (with hasOwnProperty checking).
+        Creater.prototype.__hidden = Creater.prototype;
+        var obj = new Creater();
+        return obj;
+    }
+}
+
+/**
+ * @param {Object} thisOption
+ * @param {Object} newOption
+ * @param {Array.<string>} keys
+ */
+function replaceVisualOption(thisOption, newOption, keys) {
+    // Visual attributes merge is not supported, otherwise it
+    // brings overcomplicated merge logic. See #2853. So if
+    // newOption has anyone of these keys, all of these keys
+    // will be reset. Otherwise, all keys remain.
+    var has;
+    each$1(keys, function (key) {
+        if (newOption.hasOwnProperty(key) && hasKeys(newOption[key])) {
+            has = true;
+        }
+    });
+    has && each$1(keys, function (key) {
+        if (newOption.hasOwnProperty(key) && hasKeys(newOption[key])) {
+            thisOption[key] = clone(newOption[key]);
+        }
+        else {
+            delete thisOption[key];
+        }
+    });
+}
+
+/**
+ * @param {Array.<string>} stateList
+ * @param {Object} visualMappings <state, Object.<visualType, module:echarts/visual/VisualMapping>>
+ * @param {module:echarts/data/List} list
+ * @param {Function} getValueState param: valueOrIndex, return: state.
+ * @param {object} [scope] Scope for getValueState
+ * @param {string} [dimension] Concrete dimension, if used.
+ */
+// ???! handle brush?
+function applyVisual(stateList, visualMappings, data, getValueState, scope, dimension) {
+    var visualTypesMap = {};
+    each$1(stateList, function (state) {
+        var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
+        visualTypesMap[state] = visualTypes;
+    });
+
+    var dataIndex;
+
+    function getVisual(key) {
+        return data.getItemVisual(dataIndex, key);
+    }
+
+    function setVisual(key, value) {
+        data.setItemVisual(dataIndex, key, value);
+    }
+
+    if (dimension == null) {
+        data.each(eachItem);
+    }
+    else {
+        data.each([dimension], eachItem);
+    }
+
+    function eachItem(valueOrIndex, index) {
+        dataIndex = dimension == null ? valueOrIndex : index;
+
+        var rawDataItem = data.getRawDataItem(dataIndex);
+        // Consider performance
+        if (rawDataItem && rawDataItem.visualMap === false) {
+            return;
+        }
+
+        var valueState = getValueState.call(scope, valueOrIndex);
+        var mappings = visualMappings[valueState];
+        var visualTypes = visualTypesMap[valueState];
+
+        for (var i = 0, len = visualTypes.length; i < len; i++) {
+            var type = visualTypes[i];
+            mappings[type] && mappings[type].applyVisual(
+                valueOrIndex, getVisual, setVisual
+            );
+        }
+    }
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {Array.<string>} stateList
+ * @param {Object} visualMappings <state, Object.<visualType, module:echarts/visual/VisualMapping>>
+ * @param {Function} getValueState param: valueOrIndex, return: state.
+ * @param {number} [dim] dimension or dimension index.
+ */
+function incrementalApplyVisual(stateList, visualMappings, getValueState, dim) {
+    var visualTypesMap = {};
+    each$1(stateList, function (state) {
+        var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
+        visualTypesMap[state] = visualTypes;
+    });
+
+    function progress(params, data) {
+        if (dim != null) {
+            dim = data.getDimension(dim);
+        }
+
+        function getVisual(key) {
+            return data.getItemVisual(dataIndex, key);
+        }
+
+        function setVisual(key, value) {
+            data.setItemVisual(dataIndex, key, value);
+        }
+
+        var dataIndex;
+        while ((dataIndex = params.next()) != null) {
+            var rawDataItem = data.getRawDataItem(dataIndex);
+
+            // Consider performance
+            if (rawDataItem && rawDataItem.visualMap === false) {
+                return;
+            }
+
+            var value = dim != null
+                ? data.get(dim, dataIndex, true)
+                : dataIndex;
+
+            var valueState = getValueState(value);
+            var mappings = visualMappings[valueState];
+            var visualTypes = visualTypesMap[valueState];
+
+            for (var i = 0, len = visualTypes.length; i < len; i++) {
+                var type = visualTypes[i];
+                mappings[type] && mappings[type].applyVisual(value, getVisual, setVisual);
+            }
+        }
+    }
+
+    return {progress: progress};
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Key of the first level is brushType: `line`, `rect`, `polygon`.
+// Key of the second level is chart element type: `point`, `rect`.
+// See moudule:echarts/component/helper/BrushController
+// function param:
+//      {Object} itemLayout fetch from data.getItemLayout(dataIndex)
+//      {Object} selectors {point: selector, rect: selector, ...}
+//      {Object} area {range: [[], [], ..], boudingRect}
+// function return:
+//      {boolean} Whether in the given brush.
+var selector = {
+    lineX: getLineSelectors(0),
+    lineY: getLineSelectors(1),
+    rect: {
+        point: function (itemLayout, selectors, area) {
+            return itemLayout && area.boundingRect.contain(itemLayout[0], itemLayout[1]);
+        },
+        rect: function (itemLayout, selectors, area) {
+            return itemLayout && area.boundingRect.intersect(itemLayout);
+        }
+    },
+    polygon: {
+        point: function (itemLayout, selectors, area) {
+            return itemLayout
+                && area.boundingRect.contain(itemLayout[0], itemLayout[1])
+                && contain$1(area.range, itemLayout[0], itemLayout[1]);
+        },
+        rect: function (itemLayout, selectors, area) {
+            var points = area.range;
+
+            if (!itemLayout || points.length <= 1) {
+                return false;
+            }
+
+            var x = itemLayout.x;
+            var y = itemLayout.y;
+            var width = itemLayout.width;
+            var height = itemLayout.height;
+            var p = points[0];
+
+            if (contain$1(points, x, y)
+                || contain$1(points, x + width, y)
+                || contain$1(points, x, y + height)
+                || contain$1(points, x + width, y + height)
+                || BoundingRect.create(itemLayout).contain(p[0], p[1])
+                || lineIntersectPolygon(x, y, x + width, y, points)
+                || lineIntersectPolygon(x, y, x, y + height, points)
+                || lineIntersectPolygon(x + width, y, x + width, y + height, points)
+                || lineIntersectPolygon(x, y + height, x + width, y + height, points)
+            ) {
+                return true;
+            }
+        }
+    }
+};
+
+function getLineSelectors(xyIndex) {
+    var xy = ['x', 'y'];
+    var wh = ['width', 'height'];
+
+    return {
+        point: function (itemLayout, selectors, area) {
+            if (itemLayout) {
+                var range = area.range;
+                var p = itemLayout[xyIndex];
+                return inLineRange(p, range);
+            }
+        },
+        rect: function (itemLayout, selectors, area) {
+            if (itemLayout) {
+                var range = area.range;
+                var layoutRange = [
+                    itemLayout[xy[xyIndex]],
+                    itemLayout[xy[xyIndex]] + itemLayout[wh[xyIndex]]
+                ];
+                layoutRange[1] < layoutRange[0] && layoutRange.reverse();
+                return inLineRange(layoutRange[0], range)
+                    || inLineRange(layoutRange[1], range)
+                    || inLineRange(range[0], layoutRange)
+                    || inLineRange(range[1], layoutRange);
+            }
+        }
+    };
+}
+
+function inLineRange(p, range) {
+    return range[0] <= p && p <= range[1];
+}
+
+function lineIntersectPolygon(lx, ly, l2x, l2y, points) {
+    for (var i = 0, p2 = points[points.length - 1]; i < points.length; i++) {
+        var p = points[i];
+        if (lineIntersect(lx, ly, l2x, l2y, p[0], p[1], p2[0], p2[1])) {
+            return true;
+        }
+        p2 = p;
+    }
+}
+
+// Code from <http://blog.csdn.net/rickliuxiao/article/details/6259322> with some fix.
+// See <https://en.wikipedia.org/wiki/Line%E2%80%93line_intersection>
+function lineIntersect(a1x, a1y, a2x, a2y, b1x, b1y, b2x, b2y) {
+    var delta = determinant(a2x - a1x, b1x - b2x, a2y - a1y, b1y - b2y);
+    if (nearZero(delta)) { // parallel
+        return false;
+    }
+    var namenda = determinant(b1x - a1x, b1x - b2x, b1y - a1y, b1y - b2y) / delta;
+    if (namenda < 0 || namenda > 1) {
+        return false;
+    }
+    var miu = determinant(a2x - a1x, b1x - a1x, a2y - a1y, b1y - a1y) / delta;
+    if (miu < 0 || miu > 1) {
+        return false;
+    }
+    return true;
+}
+
+function nearZero(val) {
+    return val <= (1e-6) && val >= -(1e-6);
+}
+
+function determinant(v1, v2, v3, v4) {
+    return v1 * v4 - v2 * v3;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$20 = each$1;
+var indexOf$1 = indexOf;
+var curry$5 = curry;
+
+var COORD_CONVERTS = ['dataToPoint', 'pointToData'];
+
+// FIXME
+// how to genarialize to more coordinate systems.
+var INCLUDE_FINDER_MAIN_TYPES = [
+    'grid', 'xAxis', 'yAxis', 'geo', 'graph',
+    'polar', 'radiusAxis', 'angleAxis', 'bmap'
+];
+
+/**
+ * [option in constructor]:
+ * {
+ *     Index/Id/Name of geo, xAxis, yAxis, grid: See util/model#parseFinder.
+ * }
+ *
+ *
+ * [targetInfo]:
+ *
+ * There can be multiple axes in a single targetInfo. Consider the case
+ * of `grid` component, a targetInfo represents a grid which contains one or more
+ * cartesian and one or more axes. And consider the case of parallel system,
+ * which has multiple axes in a coordinate system.
+ * Can be {
+ *     panelId: ...,
+ *     coordSys: <a representitive cartesian in grid (first cartesian by default)>,
+ *     coordSyses: all cartesians.
+ *     gridModel: <grid component>
+ *     xAxes: correspond to coordSyses on index
+ *     yAxes: correspond to coordSyses on index
+ * }
+ * or {
+ *     panelId: ...,
+ *     coordSys: <geo coord sys>
+ *     coordSyses: [<geo coord sys>]
+ *     geoModel: <geo component>
+ * }
+ *
+ *
+ * [panelOpt]:
+ *
+ * Make from targetInfo. Input to BrushController.
+ * {
+ *     panelId: ...,
+ *     rect: ...
+ * }
+ *
+ *
+ * [area]:
+ *
+ * Generated by BrushController or user input.
+ * {
+ *     panelId: Used to locate coordInfo directly. If user inpput, no panelId.
+ *     brushType: determine how to convert to/from coord('rect' or 'polygon' or 'lineX/Y').
+ *     Index/Id/Name of geo, xAxis, yAxis, grid: See util/model#parseFinder.
+ *     range: pixel range.
+ *     coordRange: representitive coord range (the first one of coordRanges).
+ *     coordRanges: <Array> coord ranges, used in multiple cartesian in one grid.
+ * }
+ */
+
+/**
+ * @param {Object} option contains Index/Id/Name of xAxis/yAxis/geo/grid
+ *        Each can be {number|Array.<number>}. like: {xAxisIndex: [3, 4]}
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} [opt]
+ * @param {Array.<string>} [opt.include] include coordinate system types.
+ */
+function BrushTargetManager(option, ecModel, opt) {
+    /**
+     * @private
+     * @type {Array.<Object>}
+     */
+    var targetInfoList = this._targetInfoList = [];
+    var info = {};
+    var foundCpts = parseFinder$1(ecModel, option);
+
+    each$20(targetInfoBuilders, function (builder, type) {
+        if (!opt || !opt.include || indexOf$1(opt.include, type) >= 0) {
+            builder(foundCpts, targetInfoList, info);
+        }
+    });
+}
+
+var proto$2 = BrushTargetManager.prototype;
+
+proto$2.setOutputRanges = function (areas, ecModel) {
+    this.matchOutputRanges(areas, ecModel, function (area, coordRange, coordSys) {
+        (area.coordRanges || (area.coordRanges = [])).push(coordRange);
+        // area.coordRange is the first of area.coordRanges
+        if (!area.coordRange) {
+            area.coordRange = coordRange;
+            // In 'category' axis, coord to pixel is not reversible, so we can not
+            // rebuild range by coordRange accrately, which may bring trouble when
+            // brushing only one item. So we use __rangeOffset to rebuilding range
+            // by coordRange. And this it only used in brush component so it is no
+            // need to be adapted to coordRanges.
+            var result = coordConvert[area.brushType](0, coordSys, coordRange);
+            area.__rangeOffset = {
+                offset: diffProcessor[area.brushType](result.values, area.range, [1, 1]),
+                xyMinMax: result.xyMinMax
+            };
+        }
+    });
+};
+
+proto$2.matchOutputRanges = function (areas, ecModel, cb) {
+    each$20(areas, function (area) {
+        var targetInfo = this.findTargetInfo(area, ecModel);
+
+        if (targetInfo && targetInfo !== true) {
+            each$1(
+                targetInfo.coordSyses,
+                function (coordSys) {
+                    var result = coordConvert[area.brushType](1, coordSys, area.range);
+                    cb(area, result.values, coordSys, ecModel);
+                }
+            );
+        }
+    }, this);
+};
+
+proto$2.setInputRanges = function (areas, ecModel) {
+    each$20(areas, function (area) {
+        var targetInfo = this.findTargetInfo(area, ecModel);
+
+        if (__DEV__) {
+            assert$1(
+                !targetInfo || targetInfo === true || area.coordRange,
+                'coordRange must be specified when coord index specified.'
+            );
+            assert$1(
+                !targetInfo || targetInfo !== true || area.range,
+                'range must be specified in global brush.'
+            );
+        }
+
+        area.range = area.range || [];
+
+        // convert coordRange to global range and set panelId.
+        if (targetInfo && targetInfo !== true) {
+            area.panelId = targetInfo.panelId;
+            // (1) area.range shoule always be calculate from coordRange but does
+            // not keep its original value, for the sake of the dataZoom scenario,
+            // where area.coordRange remains unchanged but area.range may be changed.
+            // (2) Only support converting one coordRange to pixel range in brush
+            // component. So do not consider `coordRanges`.
+            // (3) About __rangeOffset, see comment above.
+            var result = coordConvert[area.brushType](0, targetInfo.coordSys, area.coordRange);
+            var rangeOffset = area.__rangeOffset;
+            area.range = rangeOffset
+                ? diffProcessor[area.brushType](
+                    result.values,
+                    rangeOffset.offset,
+                    getScales(result.xyMinMax, rangeOffset.xyMinMax)
+                )
+                : result.values;
+        }
+    }, this);
+};
+
+proto$2.makePanelOpts = function (api, getDefaultBrushType) {
+    return map(this._targetInfoList, function (targetInfo) {
+        var rect = targetInfo.getPanelRect();
+        return {
+            panelId: targetInfo.panelId,
+            defaultBrushType: getDefaultBrushType && getDefaultBrushType(targetInfo),
+            clipPath: makeRectPanelClipPath(rect),
+            isTargetByCursor: makeRectIsTargetByCursor(
+                rect, api, targetInfo.coordSysModel
+            ),
+            getLinearBrushOtherExtent: makeLinearBrushOtherExtent(rect)
+        };
+    });
+};
+
+proto$2.controlSeries = function (area, seriesModel, ecModel) {
+    // Check whether area is bound in coord, and series do not belong to that coord.
+    // If do not do this check, some brush (like lineX) will controll all axes.
+    var targetInfo = this.findTargetInfo(area, ecModel);
+    return targetInfo === true || (
+        targetInfo && indexOf$1(targetInfo.coordSyses, seriesModel.coordinateSystem) >= 0
+    );
+};
+
+/**
+ * If return Object, a coord found.
+ * If reutrn true, global found.
+ * Otherwise nothing found.
+ *
+ * @param {Object} area
+ * @param {Array} targetInfoList
+ * @return {Object|boolean}
+ */
+proto$2.findTargetInfo = function (area, ecModel) {
+    var targetInfoList = this._targetInfoList;
+    var foundCpts = parseFinder$1(ecModel, area);
+
+    for (var i = 0; i < targetInfoList.length; i++) {
+        var targetInfo = targetInfoList[i];
+        var areaPanelId = area.panelId;
+        if (areaPanelId) {
+            if (targetInfo.panelId === areaPanelId) {
+                return targetInfo;
+            }
+        }
+        else {
+            for (var i = 0; i < targetInfoMatchers.length; i++) {
+                if (targetInfoMatchers[i](foundCpts, targetInfo)) {
+                    return targetInfo;
+                }
+            }
+        }
+    }
+
+    return true;
+};
+
+function formatMinMax(minMax) {
+    minMax[0] > minMax[1] && minMax.reverse();
+    return minMax;
+}
+
+function parseFinder$1(ecModel, option) {
+    return parseFinder(
+        ecModel, option, {includeMainTypes: INCLUDE_FINDER_MAIN_TYPES}
+    );
+}
+
+var targetInfoBuilders = {
+
+    grid: function (foundCpts, targetInfoList) {
+        var xAxisModels = foundCpts.xAxisModels;
+        var yAxisModels = foundCpts.yAxisModels;
+        var gridModels = foundCpts.gridModels;
+        // Remove duplicated.
+        var gridModelMap = createHashMap();
+        var xAxesHas = {};
+        var yAxesHas = {};
+
+        if (!xAxisModels && !yAxisModels && !gridModels) {
+            return;
+        }
+
+        each$20(xAxisModels, function (axisModel) {
+            var gridModel = axisModel.axis.grid.model;
+            gridModelMap.set(gridModel.id, gridModel);
+            xAxesHas[gridModel.id] = true;
+        });
+        each$20(yAxisModels, function (axisModel) {
+            var gridModel = axisModel.axis.grid.model;
+            gridModelMap.set(gridModel.id, gridModel);
+            yAxesHas[gridModel.id] = true;
+        });
+        each$20(gridModels, function (gridModel) {
+            gridModelMap.set(gridModel.id, gridModel);
+            xAxesHas[gridModel.id] = true;
+            yAxesHas[gridModel.id] = true;
+        });
+
+        gridModelMap.each(function (gridModel) {
+            var grid = gridModel.coordinateSystem;
+            var cartesians = [];
+
+            each$20(grid.getCartesians(), function (cartesian, index) {
+                if (indexOf$1(xAxisModels, cartesian.getAxis('x').model) >= 0
+                    || indexOf$1(yAxisModels, cartesian.getAxis('y').model) >= 0
+                ) {
+                    cartesians.push(cartesian);
+                }
+            });
+            targetInfoList.push({
+                panelId: 'grid--' + gridModel.id,
+                gridModel: gridModel,
+                coordSysModel: gridModel,
+                // Use the first one as the representitive coordSys.
+                coordSys: cartesians[0],
+                coordSyses: cartesians,
+                getPanelRect: panelRectBuilder.grid,
+                xAxisDeclared: xAxesHas[gridModel.id],
+                yAxisDeclared: yAxesHas[gridModel.id]
+            });
+        });
+    },
+
+    geo: function (foundCpts, targetInfoList) {
+        each$20(foundCpts.geoModels, function (geoModel) {
+            var coordSys = geoModel.coordinateSystem;
+            targetInfoList.push({
+                panelId: 'geo--' + geoModel.id,
+                geoModel: geoModel,
+                coordSysModel: geoModel,
+                coordSys: coordSys,
+                coordSyses: [coordSys],
+                getPanelRect: panelRectBuilder.geo
+            });
+        });
+    }
+};
+
+var targetInfoMatchers = [
+
+    // grid
+    function (foundCpts, targetInfo) {
+        var xAxisModel = foundCpts.xAxisModel;
+        var yAxisModel = foundCpts.yAxisModel;
+        var gridModel = foundCpts.gridModel;
+
+        !gridModel && xAxisModel && (gridModel = xAxisModel.axis.grid.model);
+        !gridModel && yAxisModel && (gridModel = yAxisModel.axis.grid.model);
+
+        return gridModel && gridModel === targetInfo.gridModel;
+    },
+
+    // geo
+    function (foundCpts, targetInfo) {
+        var geoModel = foundCpts.geoModel;
+        return geoModel && geoModel === targetInfo.geoModel;
+    }
+];
+
+var panelRectBuilder = {
+
+    grid: function () {
+        // grid is not Transformable.
+        return this.coordSys.grid.getRect().clone();
+    },
+
+    geo: function () {
+        var coordSys = this.coordSys;
+        var rect = coordSys.getBoundingRect().clone();
+        // geo roam and zoom transform
+        rect.applyTransform(getTransform(coordSys));
+        return rect;
+    }
+};
+
+var coordConvert = {
+
+    lineX: curry$5(axisConvert, 0),
+
+    lineY: curry$5(axisConvert, 1),
+
+    rect: function (to, coordSys, rangeOrCoordRange) {
+        var xminymin = coordSys[COORD_CONVERTS[to]]([rangeOrCoordRange[0][0], rangeOrCoordRange[1][0]]);
+        var xmaxymax = coordSys[COORD_CONVERTS[to]]([rangeOrCoordRange[0][1], rangeOrCoordRange[1][1]]);
+        var values = [
+            formatMinMax([xminymin[0], xmaxymax[0]]),
+            formatMinMax([xminymin[1], xmaxymax[1]])
+        ];
+        return {values: values, xyMinMax: values};
+    },
+
+    polygon: function (to, coordSys, rangeOrCoordRange) {
+        var xyMinMax = [[Infinity, -Infinity], [Infinity, -Infinity]];
+        var values = map(rangeOrCoordRange, function (item) {
+            var p = coordSys[COORD_CONVERTS[to]](item);
+            xyMinMax[0][0] = Math.min(xyMinMax[0][0], p[0]);
+            xyMinMax[1][0] = Math.min(xyMinMax[1][0], p[1]);
+            xyMinMax[0][1] = Math.max(xyMinMax[0][1], p[0]);
+            xyMinMax[1][1] = Math.max(xyMinMax[1][1], p[1]);
+            return p;
+        });
+        return {values: values, xyMinMax: xyMinMax};
+    }
+};
+
+function axisConvert(axisNameIndex, to, coordSys, rangeOrCoordRange) {
+    if (__DEV__) {
+        assert$1(
+            coordSys.type === 'cartesian2d',
+            'lineX/lineY brush is available only in cartesian2d.'
+        );
+    }
+
+    var axis = coordSys.getAxis(['x', 'y'][axisNameIndex]);
+    var values = formatMinMax(map([0, 1], function (i) {
+        return to
+            ? axis.coordToData(axis.toLocalCoord(rangeOrCoordRange[i]))
+            : axis.toGlobalCoord(axis.dataToCoord(rangeOrCoordRange[i]));
+    }));
+    var xyMinMax = [];
+    xyMinMax[axisNameIndex] = values;
+    xyMinMax[1 - axisNameIndex] = [NaN, NaN];
+
+    return {values: values, xyMinMax: xyMinMax};
+}
+
+var diffProcessor = {
+    lineX: curry$5(axisDiffProcessor, 0),
+
+    lineY: curry$5(axisDiffProcessor, 1),
+
+    rect: function (values, refer, scales) {
+        return [
+            [values[0][0] - scales[0] * refer[0][0], values[0][1] - scales[0] * refer[0][1]],
+            [values[1][0] - scales[1] * refer[1][0], values[1][1] - scales[1] * refer[1][1]]
+        ];
+    },
+
+    polygon: function (values, refer, scales) {
+        return map(values, function (item, idx) {
+            return [item[0] - scales[0] * refer[idx][0], item[1] - scales[1] * refer[idx][1]];
+        });
+    }
+};
+
+function axisDiffProcessor(axisNameIndex, values, refer, scales) {
+    return [
+        values[0] - scales[axisNameIndex] * refer[0],
+        values[1] - scales[axisNameIndex] * refer[1]
+    ];
+}
+
+// We have to process scale caused by dataZoom manually,
+// although it might be not accurate.
+function getScales(xyMinMaxCurr, xyMinMaxOrigin) {
+    var sizeCurr = getSize(xyMinMaxCurr);
+    var sizeOrigin = getSize(xyMinMaxOrigin);
+    var scales = [sizeCurr[0] / sizeOrigin[0], sizeCurr[1] / sizeOrigin[1]];
+    isNaN(scales[0]) && (scales[0] = 1);
+    isNaN(scales[1]) && (scales[1] = 1);
+    return scales;
+}
+
+function getSize(xyMinMax) {
+    return xyMinMax
+        ? [xyMinMax[0][1] - xyMinMax[0][0], xyMinMax[1][1] - xyMinMax[1][0]]
+        : [NaN, NaN];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var STATE_LIST = ['inBrush', 'outOfBrush'];
+var DISPATCH_METHOD = '__ecBrushSelect';
+var DISPATCH_FLAG = '__ecInBrushSelectEvent';
+var PRIORITY_BRUSH = PRIORITY.VISUAL.BRUSH;
+
+/**
+ * Layout for visual, the priority higher than other layout, and before brush visual.
+ */
+registerLayout(PRIORITY_BRUSH, function (ecModel, api, payload) {
+    ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
+
+        payload && payload.type === 'takeGlobalCursor' && brushModel.setBrushOption(
+            payload.key === 'brush' ? payload.brushOption : {brushType: false}
+        );
+
+        var brushTargetManager = brushModel.brushTargetManager = new BrushTargetManager(brushModel.option, ecModel);
+
+        brushTargetManager.setInputRanges(brushModel.areas, ecModel);
+    });
+});
+
+/**
+ * Register the visual encoding if this modules required.
+ */
+registerVisual(PRIORITY_BRUSH, function (ecModel, api, payload) {
+
+    var brushSelected = [];
+    var throttleType;
+    var throttleDelay;
+
+    ecModel.eachComponent({mainType: 'brush'}, function (brushModel, brushIndex) {
+
+        var thisBrushSelected = {
+            brushId: brushModel.id,
+            brushIndex: brushIndex,
+            brushName: brushModel.name,
+            areas: clone(brushModel.areas),
+            selected: []
+        };
+        // Every brush component exists in event params, convenient
+        // for user to find by index.
+        brushSelected.push(thisBrushSelected);
+
+        var brushOption = brushModel.option;
+        var brushLink = brushOption.brushLink;
+        var linkedSeriesMap = [];
+        var selectedDataIndexForLink = [];
+        var rangeInfoBySeries = [];
+        var hasBrushExists = 0;
+
+        if (!brushIndex) { // Only the first throttle setting works.
+            throttleType = brushOption.throttleType;
+            throttleDelay = brushOption.throttleDelay;
+        }
+
+        // Add boundingRect and selectors to range.
+        var areas = map(brushModel.areas, function (area) {
+            return bindSelector(
+                defaults(
+                    {boundingRect: boundingRectBuilders[area.brushType](area)},
+                    area
+                )
+            );
+        });
+
+        var visualMappings = createVisualMappings(
+            brushModel.option, STATE_LIST, function (mappingOption) {
+                mappingOption.mappingMethod = 'fixed';
+            }
+        );
+
+        isArray(brushLink) && each$1(brushLink, function (seriesIndex) {
+            linkedSeriesMap[seriesIndex] = 1;
+        });
+
+        function linkOthers(seriesIndex) {
+            return brushLink === 'all' || linkedSeriesMap[seriesIndex];
+        }
+
+        // If no supported brush or no brush on the series,
+        // all visuals should be in original state.
+        function brushed(rangeInfoList) {
+            return !!rangeInfoList.length;
+        }
+
+        /**
+         * Logic for each series: (If the logic has to be modified one day, do it carefully!)
+         *
+         * ( brushed ┬ && ┬hasBrushExist ┬ && linkOthers  ) => StepA: ┬record, ┬ StepB: ┬visualByRecord.
+         *   !brushed┘    ├hasBrushExist ┤                            └nothing,┘        ├visualByRecord.
+         *                └!hasBrushExist┘                                              └nothing.
+         * ( !brushed  && ┬hasBrushExist ┬ && linkOthers  ) => StepA:  nothing,  StepB: ┬visualByRecord.
+         *                └!hasBrushExist┘                                              └nothing.
+         * ( brushed ┬ &&                     !linkOthers ) => StepA:  nothing,  StepB: ┬visualByCheck.
+         *   !brushed┘                                                                  └nothing.
+         * ( !brushed  &&                     !linkOthers ) => StepA:  nothing,  StepB:  nothing.
+         */
+
+        // Step A
+        ecModel.eachSeries(function (seriesModel, seriesIndex) {
+            var rangeInfoList = rangeInfoBySeries[seriesIndex] = [];
+
+            seriesModel.subType === 'parallel'
+                ? stepAParallel(seriesModel, seriesIndex, rangeInfoList)
+                : stepAOthers(seriesModel, seriesIndex, rangeInfoList);
+        });
+
+        function stepAParallel(seriesModel, seriesIndex) {
+            var coordSys = seriesModel.coordinateSystem;
+            hasBrushExists |= coordSys.hasAxisBrushed();
+
+            linkOthers(seriesIndex) && coordSys.eachActiveState(
+                seriesModel.getData(),
+                function (activeState, dataIndex) {
+                    activeState === 'active' && (selectedDataIndexForLink[dataIndex] = 1);
+                }
+            );
+        }
+
+        function stepAOthers(seriesModel, seriesIndex, rangeInfoList) {
+            var selectorsByBrushType = getSelectorsByBrushType(seriesModel);
+            if (!selectorsByBrushType || brushModelNotControll(brushModel, seriesIndex)) {
+                return;
+            }
+
+            each$1(areas, function (area) {
+                selectorsByBrushType[area.brushType]
+                    && brushModel.brushTargetManager.controlSeries(area, seriesModel, ecModel)
+                    && rangeInfoList.push(area);
+                hasBrushExists |= brushed(rangeInfoList);
+            });
+
+            if (linkOthers(seriesIndex) && brushed(rangeInfoList)) {
+                var data = seriesModel.getData();
+                data.each(function (dataIndex) {
+                    if (checkInRange(selectorsByBrushType, rangeInfoList, data, dataIndex)) {
+                        selectedDataIndexForLink[dataIndex] = 1;
+                    }
+                });
+            }
+        }
+
+        // Step B
+        ecModel.eachSeries(function (seriesModel, seriesIndex) {
+            var seriesBrushSelected = {
+                seriesId: seriesModel.id,
+                seriesIndex: seriesIndex,
+                seriesName: seriesModel.name,
+                dataIndex: []
+            };
+            // Every series exists in event params, convenient
+            // for user to find series by seriesIndex.
+            thisBrushSelected.selected.push(seriesBrushSelected);
+
+            var selectorsByBrushType = getSelectorsByBrushType(seriesModel);
+            var rangeInfoList = rangeInfoBySeries[seriesIndex];
+
+            var data = seriesModel.getData();
+            var getValueState = linkOthers(seriesIndex)
+                ? function (dataIndex) {
+                    return selectedDataIndexForLink[dataIndex]
+                        ? (seriesBrushSelected.dataIndex.push(data.getRawIndex(dataIndex)), 'inBrush')
+                        : 'outOfBrush';
+                }
+                : function (dataIndex) {
+                    return checkInRange(selectorsByBrushType, rangeInfoList, data, dataIndex)
+                        ? (seriesBrushSelected.dataIndex.push(data.getRawIndex(dataIndex)), 'inBrush')
+                        : 'outOfBrush';
+                };
+
+            // If no supported brush or no brush, all visuals are in original state.
+            (linkOthers(seriesIndex) ? hasBrushExists : brushed(rangeInfoList))
+                && applyVisual(
+                    STATE_LIST, visualMappings, data, getValueState
+                );
+        });
+
+    });
+
+    dispatchAction(api, throttleType, throttleDelay, brushSelected, payload);
+});
+
+function dispatchAction(api, throttleType, throttleDelay, brushSelected, payload) {
+    // This event will not be triggered when `setOpion`, otherwise dead lock may
+    // triggered when do `setOption` in event listener, which we do not find
+    // satisfactory way to solve yet. Some considered resolutions:
+    // (a) Diff with prevoius selected data ant only trigger event when changed.
+    // But store previous data and diff precisely (i.e., not only by dataIndex, but
+    // also detect value changes in selected data) might bring complexity or fragility.
+    // (b) Use spectial param like `silent` to suppress event triggering.
+    // But such kind of volatile param may be weird in `setOption`.
+    if (!payload) {
+        return;
+    }
+
+    var zr = api.getZr();
+    if (zr[DISPATCH_FLAG]) {
+        return;
+    }
+
+    if (!zr[DISPATCH_METHOD]) {
+        zr[DISPATCH_METHOD] = doDispatch;
+    }
+
+    var fn = createOrUpdate(zr, DISPATCH_METHOD, throttleDelay, throttleType);
+
+    fn(api, brushSelected);
+}
+
+function doDispatch(api, brushSelected) {
+    if (!api.isDisposed()) {
+        var zr = api.getZr();
+        zr[DISPATCH_FLAG] = true;
+        api.dispatchAction({
+            type: 'brushSelect',
+            batch: brushSelected
+        });
+        zr[DISPATCH_FLAG] = false;
+    }
+}
+
+function checkInRange(selectorsByBrushType, rangeInfoList, data, dataIndex) {
+    for (var i = 0, len = rangeInfoList.length; i < len; i++) {
+        var area = rangeInfoList[i];
+        if (selectorsByBrushType[area.brushType](
+            dataIndex, data, area.selectors, area
+        )) {
+            return true;
+        }
+    }
+}
+
+function getSelectorsByBrushType(seriesModel) {
+    var brushSelector = seriesModel.brushSelector;
+    if (isString(brushSelector)) {
+        var sels = [];
+        each$1(selector, function (selectorsByElementType, brushType) {
+            sels[brushType] = function (dataIndex, data, selectors, area) {
+                var itemLayout = data.getItemLayout(dataIndex);
+                return selectorsByElementType[brushSelector](itemLayout, selectors, area);
+            };
+        });
+        return sels;
+    }
+    else if (isFunction$1(brushSelector)) {
+        var bSelector = {};
+        each$1(selector, function (sel, brushType) {
+            bSelector[brushType] = brushSelector;
+        });
+        return bSelector;
+    }
+    return brushSelector;
+}
+
+function brushModelNotControll(brushModel, seriesIndex) {
+    var seriesIndices = brushModel.option.seriesIndex;
+    return seriesIndices != null
+        && seriesIndices !== 'all'
+        && (
+            isArray(seriesIndices)
+            ? indexOf(seriesIndices, seriesIndex) < 0
+            : seriesIndex !== seriesIndices
+        );
+}
+
+function bindSelector(area) {
+    var selectors = area.selectors = {};
+    each$1(selector[area.brushType], function (selFn, elType) {
+        // Do not use function binding or curry for performance.
+        selectors[elType] = function (itemLayout) {
+            return selFn(itemLayout, selectors, area);
+        };
+    });
+    return area;
+}
+
+var boundingRectBuilders = {
+
+    lineX: noop,
+
+    lineY: noop,
+
+    rect: function (area) {
+        return getBoundingRectFromMinMax(area.range);
+    },
+
+    polygon: function (area) {
+        var minMax;
+        var range = area.range;
+
+        for (var i = 0, len = range.length; i < len; i++) {
+            minMax = minMax || [[Infinity, -Infinity], [Infinity, -Infinity]];
+            var rg = range[i];
+            rg[0] < minMax[0][0] && (minMax[0][0] = rg[0]);
+            rg[0] > minMax[0][1] && (minMax[0][1] = rg[0]);
+            rg[1] < minMax[1][0] && (minMax[1][0] = rg[1]);
+            rg[1] > minMax[1][1] && (minMax[1][1] = rg[1]);
+        }
+
+        return minMax && getBoundingRectFromMinMax(minMax);
+    }
+};
+
+function getBoundingRectFromMinMax(minMax) {
+    return new BoundingRect(
+        minMax[0][0],
+        minMax[1][0],
+        minMax[0][1] - minMax[0][0],
+        minMax[1][1] - minMax[1][0]
+    );
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DEFAULT_OUT_OF_BRUSH_COLOR = ['#ddd'];
+
+var BrushModel = extendComponentModel({
+
+    type: 'brush',
+
+    dependencies: ['geo', 'grid', 'xAxis', 'yAxis', 'parallel', 'series'],
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        // inBrush: null,
+        // outOfBrush: null,
+        toolbox: null,          // Default value see preprocessor.
+        brushLink: null,        // Series indices array, broadcast using dataIndex.
+                                // or 'all', which means all series. 'none' or null means no series.
+        seriesIndex: 'all',     // seriesIndex array, specify series controlled by this brush component.
+        geoIndex: null,         //
+        xAxisIndex: null,
+        yAxisIndex: null,
+
+        brushType: 'rect',      // Default brushType, see BrushController.
+        brushMode: 'single',    // Default brushMode, 'single' or 'multiple'
+        transformable: true,    // Default transformable.
+        brushStyle: {           // Default brushStyle
+            borderWidth: 1,
+            color: 'rgba(120,140,180,0.3)',
+            borderColor: 'rgba(120,140,180,0.8)'
+        },
+
+        throttleType: 'fixRate',// Throttle in brushSelected event. 'fixRate' or 'debounce'.
+                                // If null, no throttle. Valid only in the first brush component
+        throttleDelay: 0,       // Unit: ms, 0 means every event will be triggered.
+
+        // FIXME
+        // 试验效果
+        removeOnClick: true,
+
+        z: 10000
+    },
+
+    /**
+     * @readOnly
+     * @type {Array.<Object>}
+     */
+    areas: [],
+
+    /**
+     * Current activated brush type.
+     * If null, brush is inactived.
+     * see module:echarts/component/helper/BrushController
+     * @readOnly
+     * @type {string}
+     */
+    brushType: null,
+
+    /**
+     * Current brush opt.
+     * see module:echarts/component/helper/BrushController
+     * @readOnly
+     * @type {Object}
+     */
+    brushOption: {},
+
+    /**
+     * @readOnly
+     * @type {Array.<Object>}
+     */
+    coordInfoList: [],
+
+    optionUpdated: function (newOption, isInit) {
+        var thisOption = this.option;
+
+        !isInit && replaceVisualOption(
+            thisOption, newOption, ['inBrush', 'outOfBrush']
+        );
+
+        var inBrush = thisOption.inBrush = thisOption.inBrush || {};
+        // Always give default visual, consider setOption at the second time.
+        thisOption.outOfBrush = thisOption.outOfBrush || {color: DEFAULT_OUT_OF_BRUSH_COLOR};
+
+        if (!inBrush.hasOwnProperty('liftZ')) {
+            // Bigger than the highlight z lift, otherwise it will
+            // be effected by the highlight z when brush.
+            inBrush.liftZ = 5;
+        }
+    },
+
+    /**
+     * If ranges is null/undefined, range state remain.
+     *
+     * @param {Array.<Object>} [ranges]
+     */
+    setAreas: function (areas) {
+        if (__DEV__) {
+            assert$1(isArray(areas));
+            each$1(areas, function (area) {
+                assert$1(area.brushType, 'Illegal areas');
+            });
+        }
+
+        // If ranges is null/undefined, range state remain.
+        // This helps user to dispatchAction({type: 'brush'}) with no areas
+        // set but just want to get the current brush select info from a `brush` event.
+        if (!areas) {
+            return;
+        }
+
+        this.areas = map(areas, function (area) {
+            return generateBrushOption(this.option, area);
+        }, this);
+    },
+
+    /**
+     * see module:echarts/component/helper/BrushController
+     * @param {Object} brushOption
+     */
+    setBrushOption: function (brushOption) {
+        this.brushOption = generateBrushOption(this.option, brushOption);
+        this.brushType = this.brushOption.brushType;
+    }
+
+});
+
+function generateBrushOption(option, brushOption) {
+    return merge(
+        {
+            brushType: option.brushType,
+            brushMode: option.brushMode,
+            transformable: option.transformable,
+            brushStyle: new Model(option.brushStyle).getItemStyle(),
+            removeOnClick: option.removeOnClick,
+            z: option.z
+        },
+        brushOption,
+        true
+    );
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+
+    type: 'brush',
+
+    init: function (ecModel, api) {
+
+        /**
+         * @readOnly
+         * @type {module:echarts/model/Global}
+         */
+        this.ecModel = ecModel;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/ExtensionAPI}
+         */
+        this.api = api;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/component/brush/BrushModel}
+         */
+        this.model;
+
+        /**
+         * @private
+         * @type {module:echarts/component/helper/BrushController}
+         */
+        (this._brushController = new BrushController(api.getZr()))
+            .on('brush', bind(this._onBrush, this))
+            .mount();
+    },
+
+    /**
+     * @override
+     */
+    render: function (brushModel) {
+        this.model = brushModel;
+        return updateController.apply(this, arguments);
+    },
+
+    /**
+     * @override
+     */
+    updateTransform: updateController,
+
+    /**
+     * @override
+     */
+    updateView: updateController,
+
+    // /**
+    //  * @override
+    //  */
+    // updateLayout: updateController,
+
+    // /**
+    //  * @override
+    //  */
+    // updateVisual: updateController,
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._brushController.dispose();
+    },
+
+    /**
+     * @private
+     */
+    _onBrush: function (areas, opt) {
+        var modelId = this.model.id;
+
+        this.model.brushTargetManager.setOutputRanges(areas, this.ecModel);
+
+        // Action is not dispatched on drag end, because the drag end
+        // emits the same params with the last drag move event, and
+        // may have some delay when using touch pad, which makes
+        // animation not smooth (when using debounce).
+        (!opt.isEnd || opt.removeOnClick) && this.api.dispatchAction({
+            type: 'brush',
+            brushId: modelId,
+            areas: clone(areas),
+            $from: modelId
+        });
+    }
+
+});
+
+function updateController(brushModel, ecModel, api, payload) {
+    // Do not update controller when drawing.
+    (!payload || payload.$from !== brushModel.id) && this._brushController
+        .setPanels(brushModel.brushTargetManager.makePanelOpts(api))
+        .enableBrush(brushModel.brushOption)
+        .updateCovers(brushModel.areas.slice());
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * payload: {
+ *      brushIndex: number, or,
+ *      brushId: string, or,
+ *      brushName: string,
+ *      globalRanges: Array
+ * }
+ */
+registerAction(
+        {type: 'brush', event: 'brush' /*, update: 'updateView' */},
+    function (payload, ecModel) {
+        ecModel.eachComponent({mainType: 'brush', query: payload}, function (brushModel) {
+            brushModel.setAreas(payload.areas);
+        });
+    }
+);
+
+/**
+ * payload: {
+ *      brushComponents: [
+ *          {
+ *              brushId,
+ *              brushIndex,
+ *              brushName,
+ *              series: [
+ *                  {
+ *                      seriesId,
+ *                      seriesIndex,
+ *                      seriesName,
+ *                      rawIndices: [21, 34, ...]
+ *                  },
+ *                  ...
+ *              ]
+ *          },
+ *          ...
+ *      ]
+ * }
+ */
+registerAction(
+        {type: 'brushSelect', event: 'brushSelected', update: 'none'},
+    function () {}
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var features = {};
+
+function register$1(name, ctor) {
+    features[name] = ctor;
+}
+
+function get$1(name) {
+    return features[name];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var brushLang = lang.toolbox.brush;
+
+function Brush(model, ecModel, api) {
+    this.model = model;
+    this.ecModel = ecModel;
+    this.api = api;
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._brushType;
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._brushMode;
+}
+
+Brush.defaultOption = {
+    show: true,
+    type: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
+    icon: {
+        rect: 'M7.3,34.7 M0.4,10V-0.2h9.8 M89.6,10V-0.2h-9.8 M0.4,60v10.2h9.8 M89.6,60v10.2h-9.8 M12.3,22.4V10.5h13.1 M33.6,10.5h7.8 M49.1,10.5h7.8 M77.5,22.4V10.5h-13 M12.3,31.1v8.2 M77.7,31.1v8.2 M12.3,47.6v11.9h13.1 M33.6,59.5h7.6 M49.1,59.5 h7.7 M77.5,47.6v11.9h-13', // jshint ignore:line
+        polygon: 'M55.2,34.9c1.7,0,3.1,1.4,3.1,3.1s-1.4,3.1-3.1,3.1 s-3.1-1.4-3.1-3.1S53.5,34.9,55.2,34.9z M50.4,51c1.7,0,3.1,1.4,3.1,3.1c0,1.7-1.4,3.1-3.1,3.1c-1.7,0-3.1-1.4-3.1-3.1 C47.3,52.4,48.7,51,50.4,51z M55.6,37.1l1.5-7.8 M60.1,13.5l1.6-8.7l-7.8,4 M59,19l-1,5.3 M24,16.1l6.4,4.9l6.4-3.3 M48.5,11.6 l-5.9,3.1 M19.1,12.8L9.7,5.1l1.1,7.7 M13.4,29.8l1,7.3l6.6,1.6 M11.6,18.4l1,6.1 M32.8,41.9 M26.6,40.4 M27.3,40.2l6.1,1.6 M49.9,52.1l-5.6-7.6l-4.9-1.2', // jshint ignore:line
+        lineX: 'M15.2,30 M19.7,15.6V1.9H29 M34.8,1.9H40.4 M55.3,15.6V1.9H45.9 M19.7,44.4V58.1H29 M34.8,58.1H40.4 M55.3,44.4 V58.1H45.9 M12.5,20.3l-9.4,9.6l9.6,9.8 M3.1,29.9h16.5 M62.5,20.3l9.4,9.6L62.3,39.7 M71.9,29.9H55.4', // jshint ignore:line
+        lineY: 'M38.8,7.7 M52.7,12h13.2v9 M65.9,26.6V32 M52.7,46.3h13.2v-9 M24.9,12H11.8v9 M11.8,26.6V32 M24.9,46.3H11.8v-9 M48.2,5.1l-9.3-9l-9.4,9.2 M38.9-3.9V12 M48.2,53.3l-9.3,9l-9.4-9.2 M38.9,62.3V46.4', // jshint ignore:line
+        keep: 'M4,10.5V1h10.3 M20.7,1h6.1 M33,1h6.1 M55.4,10.5V1H45.2 M4,17.3v6.6 M55.6,17.3v6.6 M4,30.5V40h10.3 M20.7,40 h6.1 M33,40h6.1 M55.4,30.5V40H45.2 M21,18.9h62.9v48.6H21V18.9z', // jshint ignore:line
+        clear: 'M22,14.7l30.9,31 M52.9,14.7L22,45.7 M4.7,16.8V4.2h13.1 M26,4.2h7.8 M41.6,4.2h7.8 M70.3,16.8V4.2H57.2 M4.7,25.9v8.6 M70.3,25.9v8.6 M4.7,43.2v12.6h13.1 M26,55.8h7.8 M41.6,55.8h7.8 M70.3,43.2v12.6H57.2' // jshint ignore:line
+    },
+    // `rect`, `polygon`, `lineX`, `lineY`, `keep`, `clear`
+    title: clone(brushLang.title)
+};
+
+var proto$3 = Brush.prototype;
+
+// proto.updateLayout = function (featureModel, ecModel, api) {
+proto$3.render =
+proto$3.updateView = function (featureModel, ecModel, api) {
+    var brushType;
+    var brushMode;
+    var isBrushed;
+
+    ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
+        brushType = brushModel.brushType;
+        brushMode = brushModel.brushOption.brushMode || 'single';
+        isBrushed |= brushModel.areas.length;
+    });
+    this._brushType = brushType;
+    this._brushMode = brushMode;
+
+    each$1(featureModel.get('type', true), function (type) {
+        featureModel.setIconStatus(
+            type,
+            (
+                type === 'keep'
+                ? brushMode === 'multiple'
+                : type === 'clear'
+                ? isBrushed
+                : type === brushType
+            ) ? 'emphasis' : 'normal'
+        );
+    });
+};
+
+proto$3.getIcons = function () {
+    var model = this.model;
+    var availableIcons = model.get('icon', true);
+    var icons = {};
+    each$1(model.get('type', true), function (type) {
+        if (availableIcons[type]) {
+            icons[type] = availableIcons[type];
+        }
+    });
+    return icons;
+};
+
+proto$3.onclick = function (ecModel, api, type) {
+    var brushType = this._brushType;
+    var brushMode = this._brushMode;
+
+    if (type === 'clear') {
+        // Trigger parallel action firstly
+        api.dispatchAction({
+            type: 'axisAreaSelect',
+            intervals: []
+        });
+
+        api.dispatchAction({
+            type: 'brush',
+            command: 'clear',
+            // Clear all areas of all brush components.
+            areas: []
+        });
+    }
+    else {
+        api.dispatchAction({
+            type: 'takeGlobalCursor',
+            key: 'brush',
+            brushOption: {
+                brushType: type === 'keep'
+                    ? brushType
+                    : (brushType === type ? false : type),
+                brushMode: type === 'keep'
+                    ? (brushMode === 'multiple' ? 'single' : 'multiple')
+                    : brushMode
+            }
+        });
+    }
+};
+
+register$1('brush', Brush);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Brush component entry
+ */
+
+registerPreprocessor(preprocessor$1);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// (24*60*60*1000)
+var PROXIMATE_ONE_DAY = 86400000;
+
+/**
+ * Calendar
+ *
+ * @constructor
+ *
+ * @param {Object} calendarModel calendarModel
+ * @param {Object} ecModel       ecModel
+ * @param {Object} api           api
+ */
+function Calendar(calendarModel, ecModel, api) {
+    this._model = calendarModel;
+}
+
+Calendar.prototype = {
+
+    constructor: Calendar,
+
+    type: 'calendar',
+
+    dimensions: ['time', 'value'],
+
+    // Required in createListFromData
+    getDimensionsInfo: function () {
+        return [{name: 'time', type: 'time'}, 'value'];
+    },
+
+    getRangeInfo: function () {
+        return this._rangeInfo;
+    },
+
+    getModel: function () {
+        return this._model;
+    },
+
+    getRect: function () {
+        return this._rect;
+    },
+
+    getCellWidth: function () {
+        return this._sw;
+    },
+
+    getCellHeight: function () {
+        return this._sh;
+    },
+
+    getOrient: function () {
+        return this._orient;
+    },
+
+    /**
+     * getFirstDayOfWeek
+     *
+     * @example
+     *     0 : start at Sunday
+     *     1 : start at Monday
+     *
+     * @return {number}
+     */
+    getFirstDayOfWeek: function () {
+        return this._firstDayOfWeek;
+    },
+
+    /**
+     * get date info
+     *
+     * @param  {string|number} date date
+     * @return {Object}
+     * {
+     *      y: string, local full year, eg., '1940',
+     *      m: string, local month, from '01' ot '12',
+     *      d: string, local date, from '01' to '31' (if exists),
+     *      day: It is not date.getDay(). It is the location of the cell in a week, from 0 to 6,
+     *      time: timestamp,
+     *      formatedDate: string, yyyy-MM-dd,
+     *      date: original date object.
+     * }
+     */
+    getDateInfo: function (date) {
+
+        date = parseDate(date);
+
+        var y = date.getFullYear();
+
+        var m = date.getMonth() + 1;
+        m = m < 10 ? '0' + m : m;
+
+        var d = date.getDate();
+        d = d < 10 ? '0' + d : d;
+
+        var day = date.getDay();
+
+        day = Math.abs((day + 7 - this.getFirstDayOfWeek()) % 7);
+
+        return {
+            y: y,
+            m: m,
+            d: d,
+            day: day,
+            time: date.getTime(),
+            formatedDate: y + '-' + m + '-' + d,
+            date: date
+        };
+    },
+
+    getNextNDay: function (date, n) {
+        n = n || 0;
+        if (n === 0) {
+            return this.getDateInfo(date);
+        }
+
+        date = new Date(this.getDateInfo(date).time);
+        date.setDate(date.getDate() + n);
+
+        return this.getDateInfo(date);
+    },
+
+    update: function (ecModel, api) {
+
+        this._firstDayOfWeek = +this._model.getModel('dayLabel').get('firstDay');
+        this._orient = this._model.get('orient');
+        this._lineWidth = this._model.getModel('itemStyle').getItemStyle().lineWidth || 0;
+
+
+        this._rangeInfo = this._getRangeInfo(this._initRangeOption());
+        var weeks = this._rangeInfo.weeks || 1;
+        var whNames = ['width', 'height'];
+        var cellSize = this._model.get('cellSize').slice();
+        var layoutParams = this._model.getBoxLayoutParams();
+        var cellNumbers = this._orient === 'horizontal' ? [weeks, 7] : [7, weeks];
+
+        each$1([0, 1], function (idx) {
+            if (cellSizeSpecified(cellSize, idx)) {
+                layoutParams[whNames[idx]] = cellSize[idx] * cellNumbers[idx];
+            }
+        });
+
+        var whGlobal = {
+            width: api.getWidth(),
+            height: api.getHeight()
+        };
+        var calendarRect = this._rect = getLayoutRect(layoutParams, whGlobal);
+
+        each$1([0, 1], function (idx) {
+            if (!cellSizeSpecified(cellSize, idx)) {
+                cellSize[idx] = calendarRect[whNames[idx]] / cellNumbers[idx];
+            }
+        });
+
+        function cellSizeSpecified(cellSize, idx) {
+            return cellSize[idx] != null && cellSize[idx] !== 'auto';
+        }
+
+        this._sw = cellSize[0];
+        this._sh = cellSize[1];
+    },
+
+
+    /**
+     * Convert a time data(time, value) item to (x, y) point.
+     *
+     * @override
+     * @param  {Array|number} data data
+     * @param  {boolean} [clamp=true] out of range
+     * @return {Array} point
+     */
+    dataToPoint: function (data, clamp) {
+        isArray(data) && (data = data[0]);
+        clamp == null && (clamp = true);
+
+        var dayInfo = this.getDateInfo(data);
+        var range = this._rangeInfo;
+        var date = dayInfo.formatedDate;
+
+        // if not in range return [NaN, NaN]
+        if (clamp && !(
+            dayInfo.time >= range.start.time
+            && dayInfo.time < range.end.time + PROXIMATE_ONE_DAY
+        )) {
+            return [NaN, NaN];
+        }
+
+        var week = dayInfo.day;
+        var nthWeek = this._getRangeInfo([range.start.time, date]).nthWeek;
+
+        if (this._orient === 'vertical') {
+            return [
+                this._rect.x + week * this._sw + this._sw / 2,
+                this._rect.y + nthWeek * this._sh + this._sh / 2
+            ];
+
+        }
+
+        return [
+            this._rect.x + nthWeek * this._sw + this._sw / 2,
+            this._rect.y + week * this._sh + this._sh / 2
+        ];
+
+    },
+
+    /**
+     * Convert a (x, y) point to time data
+     *
+     * @override
+     * @param  {string} point point
+     * @return {string}       data
+     */
+    pointToData: function (point) {
+
+        var date = this.pointToDate(point);
+
+        return date && date.time;
+    },
+
+    /**
+     * Convert a time date item to (x, y) four point.
+     *
+     * @param  {Array} data  date[0] is date
+     * @param  {boolean} [clamp=true]  out of range
+     * @return {Object}       point
+     */
+    dataToRect: function (data, clamp) {
+        var point = this.dataToPoint(data, clamp);
+
+        return {
+            contentShape: {
+                x: point[0] - (this._sw - this._lineWidth) / 2,
+                y: point[1] - (this._sh - this._lineWidth) / 2,
+                width: this._sw - this._lineWidth,
+                height: this._sh - this._lineWidth
+            },
+
+            center: point,
+
+            tl: [
+                point[0] - this._sw / 2,
+                point[1] - this._sh / 2
+            ],
+
+            tr: [
+                point[0] + this._sw / 2,
+                point[1] - this._sh / 2
+            ],
+
+            br: [
+                point[0] + this._sw / 2,
+                point[1] + this._sh / 2
+            ],
+
+            bl: [
+                point[0] - this._sw / 2,
+                point[1] + this._sh / 2
+            ]
+
+        };
+    },
+
+    /**
+     * Convert a (x, y) point to time date
+     *
+     * @param  {Array} point point
+     * @return {Object}       date
+     */
+    pointToDate: function (point) {
+        var nthX = Math.floor((point[0] - this._rect.x) / this._sw) + 1;
+        var nthY = Math.floor((point[1] - this._rect.y) / this._sh) + 1;
+        var range = this._rangeInfo.range;
+
+        if (this._orient === 'vertical') {
+            return this._getDateByWeeksAndDay(nthY, nthX - 1, range);
+        }
+
+        return this._getDateByWeeksAndDay(nthX, nthY - 1, range);
+    },
+
+    /**
+     * @inheritDoc
+     */
+    convertToPixel: curry(doConvert$2, 'dataToPoint'),
+
+    /**
+     * @inheritDoc
+     */
+    convertFromPixel: curry(doConvert$2, 'pointToData'),
+
+    /**
+     * initRange
+     *
+     * @private
+     * @return {Array} [start, end]
+     */
+    _initRangeOption: function () {
+        var range = this._model.get('range');
+
+        var rg = range;
+
+        if (isArray(rg) && rg.length === 1) {
+            rg = rg[0];
+        }
+
+        if (/^\d{4}$/.test(rg)) {
+            range = [rg + '-01-01', rg + '-12-31'];
+        }
+
+        if (/^\d{4}[\/|-]\d{1,2}$/.test(rg)) {
+
+            var start = this.getDateInfo(rg);
+            var firstDay = start.date;
+            firstDay.setMonth(firstDay.getMonth() + 1);
+
+            var end = this.getNextNDay(firstDay, -1);
+            range = [start.formatedDate, end.formatedDate];
+        }
+
+        if (/^\d{4}[\/|-]\d{1,2}[\/|-]\d{1,2}$/.test(rg)) {
+            range = [rg, rg];
+        }
+
+        var tmp = this._getRangeInfo(range);
+
+        if (tmp.start.time > tmp.end.time) {
+            range.reverse();
+        }
+
+        return range;
+    },
+
+    /**
+     * range info
+     *
+     * @private
+     * @param  {Array} range range ['2017-01-01', '2017-07-08']
+     *  If range[0] > range[1], they will not be reversed.
+     * @return {Object}       obj
+     */
+    _getRangeInfo: function (range) {
+        range = [
+            this.getDateInfo(range[0]),
+            this.getDateInfo(range[1])
+        ];
+
+        var reversed;
+        if (range[0].time > range[1].time) {
+            reversed = true;
+            range.reverse();
+        }
+
+        var allDay = Math.floor(range[1].time / PROXIMATE_ONE_DAY)
+            - Math.floor(range[0].time / PROXIMATE_ONE_DAY) + 1;
+
+        // Consider case:
+        // Firstly set system timezone as "Time Zone: America/Toronto",
+        // ```
+        // var first = new Date(1478412000000 - 3600 * 1000 * 2.5);
+        // var second = new Date(1478412000000);
+        // var allDays = Math.floor(second / ONE_DAY) - Math.floor(first / ONE_DAY) + 1;
+        // ```
+        // will get wrong result because of DST. So we should fix it.
+        var date = new Date(range[0].time);
+        var startDateNum = date.getDate();
+        var endDateNum = range[1].date.getDate();
+        date.setDate(startDateNum + allDay - 1);
+        // The bias can not over a month, so just compare date.
+        if (date.getDate() !== endDateNum) {
+            var sign = date.getTime() - range[1].time > 0 ? 1 : -1;
+            while (date.getDate() !== endDateNum && (date.getTime() - range[1].time) * sign > 0) {
+                allDay -= sign;
+                date.setDate(startDateNum + allDay - 1);
+            }
+        }
+
+        var weeks = Math.floor((allDay + range[0].day + 6) / 7);
+        var nthWeek = reversed ? -weeks + 1: weeks - 1;
+
+        reversed && range.reverse();
+
+        return {
+            range: [range[0].formatedDate, range[1].formatedDate],
+            start: range[0],
+            end: range[1],
+            allDay: allDay,
+            weeks: weeks,
+            // From 0.
+            nthWeek: nthWeek,
+            fweek: range[0].day,
+            lweek: range[1].day
+        };
+    },
+
+    /**
+     * get date by nthWeeks and week day in range
+     *
+     * @private
+     * @param  {number} nthWeek the week
+     * @param  {number} day   the week day
+     * @param  {Array} range [d1, d2]
+     * @return {Object}
+     */
+    _getDateByWeeksAndDay: function (nthWeek, day, range) {
+        var rangeInfo = this._getRangeInfo(range);
+
+        if (nthWeek > rangeInfo.weeks
+            || (nthWeek === 0 && day < rangeInfo.fweek)
+            || (nthWeek === rangeInfo.weeks && day > rangeInfo.lweek)
+        ) {
+            return false;
+        }
+
+        var nthDay = (nthWeek - 1) * 7 - rangeInfo.fweek + day;
+        var date = new Date(rangeInfo.start.time);
+        date.setDate(rangeInfo.start.d + nthDay);
+
+        return this.getDateInfo(date);
+    }
+};
+
+Calendar.dimensions =  Calendar.prototype.dimensions;
+
+Calendar.getDimensionsInfo =  Calendar.prototype.getDimensionsInfo;
+
+Calendar.create = function (ecModel, api) {
+    var calendarList = [];
+
+    ecModel.eachComponent('calendar', function (calendarModel) {
+        var calendar = new Calendar(calendarModel, ecModel, api);
+        calendarList.push(calendar);
+        calendarModel.coordinateSystem = calendar;
+    });
+
+    ecModel.eachSeries(function (calendarSeries) {
+        if (calendarSeries.get('coordinateSystem') === 'calendar') {
+            // Inject coordinate system
+            calendarSeries.coordinateSystem = calendarList[calendarSeries.get('calendarIndex') || 0];
+        }
+    });
+    return calendarList;
+};
+
+function doConvert$2(methodName, ecModel, finder, value) {
+    var calendarModel = finder.calendarModel;
+    var seriesModel = finder.seriesModel;
+
+    var coordSys = calendarModel
+        ? calendarModel.coordinateSystem
+        : seriesModel
+        ? seriesModel.coordinateSystem
+        : null;
+
+    return coordSys === this ? coordSys[methodName](value) : null;
+}
+
+CoordinateSystemManager.register('calendar', Calendar);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CalendarModel = ComponentModel.extend({
+
+    type: 'calendar',
+
+    /**
+     * @type {module:echarts/coord/calendar/Calendar}
+     */
+    coordinateSystem: null,
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        left: 80,
+        top: 60,
+
+        cellSize: 20,
+
+        // horizontal vertical
+        orient: 'horizontal',
+
+        // month separate line style
+        splitLine: {
+            show: true,
+            lineStyle: {
+                color: '#000',
+                width: 1,
+                type: 'solid'
+            }
+        },
+
+        // rect style  temporarily unused emphasis
+        itemStyle: {
+            color: '#fff',
+            borderWidth: 1,
+            borderColor: '#ccc'
+        },
+
+        // week text style
+        dayLabel: {
+            show: true,
+
+            // a week first day
+            firstDay: 0,
+
+            // start end
+            position: 'start',
+            margin: '50%', // 50% of cellSize
+            nameMap: 'en',
+            color: '#000'
+        },
+
+        // month text style
+        monthLabel: {
+            show: true,
+
+            // start end
+            position: 'start',
+            margin: 5,
+
+            // center or left
+            align: 'center',
+
+            // cn en []
+            nameMap: 'en',
+            formatter: null,
+            color: '#000'
+        },
+
+        // year text style
+        yearLabel: {
+            show: true,
+
+            // top bottom left right
+            position: null,
+            margin: 30,
+            formatter: null,
+            color: '#ccc',
+            fontFamily: 'sans-serif',
+            fontWeight: 'bolder',
+            fontSize: 20
+        }
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel, extraOpt) {
+        var inputPositionParams = getLayoutParams(option);
+
+        CalendarModel.superApply(this, 'init', arguments);
+
+        mergeAndNormalizeLayoutParams$1(option, inputPositionParams);
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (option, extraOpt) {
+        CalendarModel.superApply(this, 'mergeOption', arguments);
+
+        mergeAndNormalizeLayoutParams$1(this.option, option);
+    }
+});
+
+function mergeAndNormalizeLayoutParams$1(target, raw) {
+    // Normalize cellSize
+    var cellSize = target.cellSize;
+
+    if (!isArray(cellSize)) {
+        cellSize = target.cellSize = [cellSize, cellSize];
+    }
+    else if (cellSize.length === 1) {
+        cellSize[1] = cellSize[0];
+    }
+
+    var ignoreSize = map([0, 1], function (hvIdx) {
+        // If user have set `width` or both `left` and `right`, cellSize
+        // will be automatically set to 'auto', otherwise the default
+        // setting of cellSize will make `width` setting not work.
+        if (sizeCalculable(raw, hvIdx)) {
+            cellSize[hvIdx] = 'auto';
+        }
+        return cellSize[hvIdx] != null && cellSize[hvIdx] !== 'auto';
+    });
+
+    mergeLayoutParam(target, raw, {
+        type: 'box', ignoreSize: ignoreSize
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var MONTH_TEXT = {
+    EN: [
+        'Jan', 'Feb', 'Mar',
+        'Apr', 'May', 'Jun',
+        'Jul', 'Aug', 'Sep',
+        'Oct', 'Nov', 'Dec'
+    ],
+    CN: [
+        '一月', '二月', '三月',
+        '四月', '五月', '六月',
+        '七月', '八月', '九月',
+        '十月', '十一月', '十二月'
+    ]
+};
+
+var WEEK_TEXT = {
+    EN: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
+    CN: ['日', '一', '二', '三', '四', '五', '六']
+};
+
+extendComponentView({
+
+    type: 'calendar',
+
+    /**
+     * top/left line points
+     *  @private
+     */
+    _tlpoints: null,
+
+    /**
+     * bottom/right line points
+     *  @private
+     */
+    _blpoints: null,
+
+    /**
+     * first day of month
+     *  @private
+     */
+    _firstDayOfMonth: null,
+
+    /**
+     * first day point of month
+     *  @private
+     */
+    _firstDayPoints: null,
+
+    render: function (calendarModel, ecModel, api) {
+
+        var group = this.group;
+
+        group.removeAll();
+
+        var coordSys = calendarModel.coordinateSystem;
+
+        // range info
+        var rangeData = coordSys.getRangeInfo();
+        var orient = coordSys.getOrient();
+
+        this._renderDayRect(calendarModel, rangeData, group);
+
+        // _renderLines must be called prior to following function
+        this._renderLines(calendarModel, rangeData, orient, group);
+
+        this._renderYearText(calendarModel, rangeData, orient, group);
+
+        this._renderMonthText(calendarModel, orient, group);
+
+        this._renderWeekText(calendarModel, rangeData, orient, group);
+    },
+
+    // render day rect
+    _renderDayRect: function (calendarModel, rangeData, group) {
+        var coordSys = calendarModel.coordinateSystem;
+        var itemRectStyleModel = calendarModel.getModel('itemStyle').getItemStyle();
+        var sw = coordSys.getCellWidth();
+        var sh = coordSys.getCellHeight();
+
+        for (var i = rangeData.start.time;
+            i <= rangeData.end.time;
+            i = coordSys.getNextNDay(i, 1).time
+        ) {
+
+            var point = coordSys.dataToRect([i], false).tl;
+
+            // every rect
+            var rect = new Rect({
+                shape: {
+                    x: point[0],
+                    y: point[1],
+                    width: sw,
+                    height: sh
+                },
+                cursor: 'default',
+                style: itemRectStyleModel
+            });
+
+            group.add(rect);
+        }
+
+    },
+
+    // render separate line
+    _renderLines: function (calendarModel, rangeData, orient, group) {
+
+        var self = this;
+
+        var coordSys = calendarModel.coordinateSystem;
+
+        var lineStyleModel = calendarModel.getModel('splitLine.lineStyle').getLineStyle();
+        var show = calendarModel.get('splitLine.show');
+
+        var lineWidth = lineStyleModel.lineWidth;
+
+        this._tlpoints = [];
+        this._blpoints = [];
+        this._firstDayOfMonth = [];
+        this._firstDayPoints = [];
+
+
+        var firstDay = rangeData.start;
+
+        for (var i = 0; firstDay.time <= rangeData.end.time; i++) {
+            addPoints(firstDay.formatedDate);
+
+            if (i === 0) {
+                firstDay = coordSys.getDateInfo(rangeData.start.y + '-' + rangeData.start.m);
+            }
+
+            var date = firstDay.date;
+            date.setMonth(date.getMonth() + 1);
+            firstDay = coordSys.getDateInfo(date);
+        }
+
+        addPoints(coordSys.getNextNDay(rangeData.end.time, 1).formatedDate);
+
+        function addPoints(date) {
+
+            self._firstDayOfMonth.push(coordSys.getDateInfo(date));
+            self._firstDayPoints.push(coordSys.dataToRect([date], false).tl);
+
+            var points = self._getLinePointsOfOneWeek(calendarModel, date, orient);
+
+            self._tlpoints.push(points[0]);
+            self._blpoints.push(points[points.length - 1]);
+
+            show && self._drawSplitline(points, lineStyleModel, group);
+        }
+
+
+        // render top/left line
+        show && this._drawSplitline(self._getEdgesPoints(self._tlpoints, lineWidth, orient), lineStyleModel, group);
+
+        // render bottom/right line
+        show && this._drawSplitline(self._getEdgesPoints(self._blpoints, lineWidth, orient), lineStyleModel, group);
+
+    },
+
+    // get points at both ends
+    _getEdgesPoints: function (points, lineWidth, orient) {
+        var rs = [points[0].slice(), points[points.length - 1].slice()];
+        var idx = orient === 'horizontal' ? 0 : 1;
+
+        // both ends of the line are extend half lineWidth
+        rs[0][idx] = rs[0][idx] - lineWidth / 2;
+        rs[1][idx] = rs[1][idx] + lineWidth / 2;
+
+        return rs;
+    },
+
+    // render split line
+    _drawSplitline: function (points, lineStyleModel, group) {
+
+        var poyline = new Polyline({
+            z2: 20,
+            shape: {
+                points: points
+            },
+            style: lineStyleModel
+        });
+
+        group.add(poyline);
+    },
+
+    // render month line of one week points
+    _getLinePointsOfOneWeek: function (calendarModel, date, orient) {
+
+        var coordSys = calendarModel.coordinateSystem;
+        date = coordSys.getDateInfo(date);
+
+        var points = [];
+
+        for (var i = 0; i < 7; i++) {
+
+            var tmpD = coordSys.getNextNDay(date.time, i);
+            var point = coordSys.dataToRect([tmpD.time], false);
+
+            points[2 * tmpD.day] = point.tl;
+            points[2 * tmpD.day + 1] = point[orient === 'horizontal' ? 'bl' : 'tr'];
+        }
+
+        return points;
+
+    },
+
+    _formatterLabel: function (formatter, params) {
+
+        if (typeof formatter === 'string' && formatter) {
+            return formatTplSimple(formatter, params);
+        }
+
+        if (typeof formatter === 'function') {
+            return formatter(params);
+        }
+
+        return params.nameMap;
+
+    },
+
+    _yearTextPositionControl: function (textEl, point, orient, position, margin) {
+
+        point = point.slice();
+        var aligns = ['center', 'bottom'];
+
+        if (position === 'bottom') {
+            point[1] += margin;
+            aligns = ['center', 'top'];
+        }
+        else if (position === 'left') {
+            point[0] -= margin;
+        }
+        else if (position === 'right') {
+            point[0] += margin;
+            aligns = ['center', 'top'];
+        }
+        else { // top
+            point[1] -= margin;
+        }
+
+        var rotate = 0;
+        if (position === 'left' || position === 'right') {
+            rotate = Math.PI / 2;
+        }
+
+        return {
+            rotation: rotate,
+            position: point,
+            style: {
+                textAlign: aligns[0],
+                textVerticalAlign: aligns[1]
+            }
+        };
+    },
+
+    // render year
+    _renderYearText: function (calendarModel, rangeData, orient, group) {
+        var yearLabel = calendarModel.getModel('yearLabel');
+
+        if (!yearLabel.get('show')) {
+            return;
+        }
+
+        var margin = yearLabel.get('margin');
+        var pos = yearLabel.get('position');
+
+        if (!pos) {
+            pos = orient !== 'horizontal' ? 'top' : 'left';
+        }
+
+        var points = [this._tlpoints[this._tlpoints.length - 1], this._blpoints[0]];
+        var xc = (points[0][0] + points[1][0]) / 2;
+        var yc = (points[0][1] + points[1][1]) / 2;
+
+        var idx = orient === 'horizontal' ? 0 : 1;
+
+        var posPoints = {
+            top: [xc, points[idx][1]],
+            bottom: [xc, points[1 - idx][1]],
+            left: [points[1 - idx][0], yc],
+            right: [points[idx][0], yc]
+        };
+
+        var name = rangeData.start.y;
+
+        if (+rangeData.end.y > +rangeData.start.y) {
+            name = name + '-' + rangeData.end.y;
+        }
+
+        var formatter = yearLabel.get('formatter');
+
+        var params = {
+            start: rangeData.start.y,
+            end: rangeData.end.y,
+            nameMap: name
+        };
+
+        var content = this._formatterLabel(formatter, params);
+
+        var yearText = new Text({z2: 30});
+        setTextStyle(yearText.style, yearLabel, {text: content}),
+        yearText.attr(this._yearTextPositionControl(yearText, posPoints[pos], orient, pos, margin));
+
+        group.add(yearText);
+    },
+
+    _monthTextPositionControl: function (point, isCenter, orient, position, margin) {
+        var align = 'left';
+        var vAlign = 'top';
+        var x = point[0];
+        var y = point[1];
+
+        if (orient === 'horizontal') {
+            y = y + margin;
+
+            if (isCenter) {
+                align = 'center';
+            }
+
+            if (position === 'start') {
+                vAlign = 'bottom';
+            }
+        }
+        else {
+            x = x + margin;
+
+            if (isCenter) {
+                vAlign = 'middle';
+            }
+
+            if (position === 'start') {
+                align = 'right';
+            }
+        }
+
+        return {
+            x: x,
+            y: y,
+            textAlign: align,
+            textVerticalAlign: vAlign
+        };
+    },
+
+    // render month and year text
+    _renderMonthText: function (calendarModel, orient, group) {
+        var monthLabel = calendarModel.getModel('monthLabel');
+
+        if (!monthLabel.get('show')) {
+            return;
+        }
+
+        var nameMap = monthLabel.get('nameMap');
+        var margin = monthLabel.get('margin');
+        var pos = monthLabel.get('position');
+        var align = monthLabel.get('align');
+
+        var termPoints = [this._tlpoints, this._blpoints];
+
+        if (isString(nameMap)) {
+            nameMap = MONTH_TEXT[nameMap.toUpperCase()] || [];
+        }
+
+        var idx = pos === 'start' ? 0 : 1;
+        var axis = orient === 'horizontal' ? 0 : 1;
+        margin = pos === 'start' ? -margin : margin;
+        var isCenter = (align === 'center');
+
+        for (var i = 0; i < termPoints[idx].length - 1; i++) {
+
+            var tmp = termPoints[idx][i].slice();
+            var firstDay = this._firstDayOfMonth[i];
+
+            if (isCenter) {
+                var firstDayPoints = this._firstDayPoints[i];
+                tmp[axis] = (firstDayPoints[axis] + termPoints[0][i + 1][axis]) / 2;
+            }
+
+            var formatter = monthLabel.get('formatter');
+            var name = nameMap[+firstDay.m - 1];
+            var params = {
+                yyyy: firstDay.y,
+                yy: (firstDay.y + '').slice(2),
+                MM: firstDay.m,
+                M: +firstDay.m,
+                nameMap: name
+            };
+
+            var content = this._formatterLabel(formatter, params);
+
+            var monthText = new Text({z2: 30});
+            extend(
+                setTextStyle(monthText.style, monthLabel, {text: content}),
+                this._monthTextPositionControl(tmp, isCenter, orient, pos, margin)
+            );
+
+            group.add(monthText);
+        }
+    },
+
+    _weekTextPositionControl: function (point, orient, position, margin, cellSize) {
+        var align = 'center';
+        var vAlign = 'middle';
+        var x = point[0];
+        var y = point[1];
+        var isStart = position === 'start';
+
+        if (orient === 'horizontal') {
+            x = x + margin + (isStart ? 1 : -1) * cellSize[0] / 2;
+            align = isStart ? 'right' : 'left';
+        }
+        else {
+            y = y + margin + (isStart ? 1 : -1) * cellSize[1] / 2;
+            vAlign = isStart ? 'bottom' : 'top';
+        }
+
+        return {
+            x: x,
+            y: y,
+            textAlign: align,
+            textVerticalAlign: vAlign
+        };
+    },
+
+    // render weeks
+    _renderWeekText: function (calendarModel, rangeData, orient, group) {
+        var dayLabel = calendarModel.getModel('dayLabel');
+
+        if (!dayLabel.get('show')) {
+            return;
+        }
+
+        var coordSys = calendarModel.coordinateSystem;
+        var pos = dayLabel.get('position');
+        var nameMap = dayLabel.get('nameMap');
+        var margin = dayLabel.get('margin');
+        var firstDayOfWeek = coordSys.getFirstDayOfWeek();
+
+        if (isString(nameMap)) {
+            nameMap = WEEK_TEXT[nameMap.toUpperCase()] || [];
+        }
+
+        var start = coordSys.getNextNDay(
+            rangeData.end.time, (7 - rangeData.lweek)
+        ).time;
+
+        var cellSize = [coordSys.getCellWidth(), coordSys.getCellHeight()];
+        margin = parsePercent$1(margin, cellSize[orient === 'horizontal' ? 0 : 1]);
+
+        if (pos === 'start') {
+            start = coordSys.getNextNDay(
+                rangeData.start.time, -(7 + rangeData.fweek)
+            ).time;
+            margin = -margin;
+        }
+
+        for (var i = 0; i < 7; i++) {
+
+            var tmpD = coordSys.getNextNDay(start, i);
+            var point = coordSys.dataToRect([tmpD.time], false).center;
+            var day = i;
+            day = Math.abs((i + firstDayOfWeek) % 7);
+            var weekText = new Text({z2: 30});
+
+            extend(
+                setTextStyle(weekText.style, dayLabel, {text: nameMap[day]}),
+                this._weekTextPositionControl(point, orient, pos, margin, cellSize)
+            );
+            group.add(weekText);
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file calendar.js
+ * @author dxh
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Model
+extendComponentModel({
+
+    type: 'title',
+
+    layoutMode: {type: 'box', ignoreSize: true},
+
+    defaultOption: {
+        // 一级层叠
+        zlevel: 0,
+        // 二级层叠
+        z: 6,
+        show: true,
+
+        text: '',
+        // 超链接跳转
+        // link: null,
+        // 仅支持self | blank
+        target: 'blank',
+        subtext: '',
+
+        // 超链接跳转
+        // sublink: null,
+        // 仅支持self | blank
+        subtarget: 'blank',
+
+        // 'center' ¦ 'left' ¦ 'right'
+        // ¦ {number}（x坐标，单位px）
+        left: 0,
+        // 'top' ¦ 'bottom' ¦ 'center'
+        // ¦ {number}（y坐标，单位px）
+        top: 0,
+
+        // 水平对齐
+        // 'auto' | 'left' | 'right' | 'center'
+        // 默认根据 left 的位置判断是左对齐还是右对齐
+        // textAlign: null
+        //
+        // 垂直对齐
+        // 'auto' | 'top' | 'bottom' | 'middle'
+        // 默认根据 top 位置判断是上对齐还是下对齐
+        // textBaseline: null
+
+        backgroundColor: 'rgba(0,0,0,0)',
+
+        // 标题边框颜色
+        borderColor: '#ccc',
+
+        // 标题边框线宽，单位px，默认为0（无边框）
+        borderWidth: 0,
+
+        // 标题内边距，单位px，默认各方向内边距为5，
+        // 接受数组分别设定上右下左边距，同css
+        padding: 5,
+
+        // 主副标题纵向间隔，单位px，默认为10，
+        itemGap: 10,
+        textStyle: {
+            fontSize: 18,
+            fontWeight: 'bolder',
+            color: '#333'
+        },
+        subtextStyle: {
+            color: '#aaa'
+        }
+    }
+});
+
+// View
+extendComponentView({
+
+    type: 'title',
+
+    render: function (titleModel, ecModel, api) {
+        this.group.removeAll();
+
+        if (!titleModel.get('show')) {
+            return;
+        }
+
+        var group = this.group;
+
+        var textStyleModel = titleModel.getModel('textStyle');
+        var subtextStyleModel = titleModel.getModel('subtextStyle');
+
+        var textAlign = titleModel.get('textAlign');
+        var textBaseline = titleModel.get('textBaseline');
+
+        var textEl = new Text({
+            style: setTextStyle({}, textStyleModel, {
+                text: titleModel.get('text'),
+                textFill: textStyleModel.getTextColor()
+            }, {disableBox: true}),
+            z2: 10
+        });
+
+        var textRect = textEl.getBoundingRect();
+
+        var subText = titleModel.get('subtext');
+        var subTextEl = new Text({
+            style: setTextStyle({}, subtextStyleModel, {
+                text: subText,
+                textFill: subtextStyleModel.getTextColor(),
+                y: textRect.height + titleModel.get('itemGap'),
+                textVerticalAlign: 'top'
+            }, {disableBox: true}),
+            z2: 10
+        });
+
+        var link = titleModel.get('link');
+        var sublink = titleModel.get('sublink');
+
+        textEl.silent = !link;
+        subTextEl.silent = !sublink;
+
+        if (link) {
+            textEl.on('click', function () {
+                window.open(link, '_' + titleModel.get('target'));
+            });
+        }
+        if (sublink) {
+            subTextEl.on('click', function () {
+                window.open(sublink, '_' + titleModel.get('subtarget'));
+            });
+        }
+
+        group.add(textEl);
+        subText && group.add(subTextEl);
+        // If no subText, but add subTextEl, there will be an empty line.
+
+        var groupRect = group.getBoundingRect();
+        var layoutOption = titleModel.getBoxLayoutParams();
+        layoutOption.width = groupRect.width;
+        layoutOption.height = groupRect.height;
+        var layoutRect = getLayoutRect(
+            layoutOption, {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }, titleModel.get('padding')
+        );
+        // Adjust text align based on position
+        if (!textAlign) {
+            // Align left if title is on the left. center and right is same
+            textAlign = titleModel.get('left') || titleModel.get('right');
+            if (textAlign === 'middle') {
+                textAlign = 'center';
+            }
+            // Adjust layout by text align
+            if (textAlign === 'right') {
+                layoutRect.x += layoutRect.width;
+            }
+            else if (textAlign === 'center') {
+                layoutRect.x += layoutRect.width / 2;
+            }
+        }
+        if (!textBaseline) {
+            textBaseline = titleModel.get('top') || titleModel.get('bottom');
+            if (textBaseline === 'center') {
+                textBaseline = 'middle';
+            }
+            if (textBaseline === 'bottom') {
+                layoutRect.y += layoutRect.height;
+            }
+            else if (textBaseline === 'middle') {
+                layoutRect.y += layoutRect.height / 2;
+            }
+
+            textBaseline = textBaseline || 'top';
+        }
+
+        group.attr('position', [layoutRect.x, layoutRect.y]);
+        var alignStyle = {
+            textAlign: textAlign,
+            textVerticalAlign: textBaseline
+        };
+        textEl.setStyle(alignStyle);
+        subTextEl.setStyle(alignStyle);
+
+        // Render background
+        // Get groupRect again because textAlign has been changed
+        groupRect = group.getBoundingRect();
+        var padding = layoutRect.margin;
+        var style = titleModel.getItemStyle(['color', 'opacity']);
+        style.fill = titleModel.get('backgroundColor');
+        var rect = new Rect({
+            shape: {
+                x: groupRect.x - padding[3],
+                y: groupRect.y - padding[0],
+                width: groupRect.width + padding[1] + padding[3],
+                height: groupRect.height + padding[0] + padding[2],
+                r: titleModel.get('borderRadius')
+            },
+            style: style,
+            silent: true
+        });
+        subPixelOptimizeRect(rect);
+
+        group.add(rect);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.registerSubTypeDefaulter('dataZoom', function () {
+    // Default 'slider' when no type specified.
+    return 'slider';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AXIS_DIMS = ['x', 'y', 'z', 'radius', 'angle', 'single'];
+// Supported coords.
+var COORDS = ['cartesian2d', 'polar', 'singleAxis'];
+
+/**
+ * @param {string} coordType
+ * @return {boolean}
+ */
+function isCoordSupported(coordType) {
+    return indexOf(COORDS, coordType) >= 0;
+}
+
+/**
+ * Create "each" method to iterate names.
+ *
+ * @pubilc
+ * @param  {Array.<string>} names
+ * @param  {Array.<string>=} attrs
+ * @return {Function}
+ */
+function createNameEach(names, attrs) {
+    names = names.slice();
+    var capitalNames = map(names, capitalFirst);
+    attrs = (attrs || []).slice();
+    var capitalAttrs = map(attrs, capitalFirst);
+
+    return function (callback, context) {
+        each$1(names, function (name, index) {
+            var nameObj = {name: name, capital: capitalNames[index]};
+
+            for (var j = 0; j < attrs.length; j++) {
+                nameObj[attrs[j]] = name + capitalAttrs[j];
+            }
+
+            callback.call(context, nameObj);
+        });
+    };
+}
+
+/**
+ * Iterate each dimension name.
+ *
+ * @public
+ * @param {Function} callback The parameter is like:
+ *                            {
+ *                                name: 'angle',
+ *                                capital: 'Angle',
+ *                                axis: 'angleAxis',
+ *                                axisIndex: 'angleAixs',
+ *                                index: 'angleIndex'
+ *                            }
+ * @param {Object} context
+ */
+var eachAxisDim$1 = createNameEach(AXIS_DIMS, ['axisIndex', 'axis', 'index', 'id']);
+
+/**
+ * If tow dataZoomModels has the same axis controlled, we say that they are 'linked'.
+ * dataZoomModels and 'links' make up one or more graphics.
+ * This function finds the graphic where the source dataZoomModel is in.
+ *
+ * @public
+ * @param {Function} forEachNode Node iterator.
+ * @param {Function} forEachEdgeType edgeType iterator
+ * @param {Function} edgeIdGetter Giving node and edgeType, return an array of edge id.
+ * @return {Function} Input: sourceNode, Output: Like {nodes: [], dims: {}}
+ */
+function createLinkedNodesFinder(forEachNode, forEachEdgeType, edgeIdGetter) {
+
+    return function (sourceNode) {
+        var result = {
+            nodes: [],
+            records: {} // key: edgeType.name, value: Object (key: edge id, value: boolean).
+        };
+
+        forEachEdgeType(function (edgeType) {
+            result.records[edgeType.name] = {};
+        });
+
+        if (!sourceNode) {
+            return result;
+        }
+
+        absorb(sourceNode, result);
+
+        var existsLink;
+        do {
+            existsLink = false;
+            forEachNode(processSingleNode);
+        }
+        while (existsLink);
+
+        function processSingleNode(node) {
+            if (!isNodeAbsorded(node, result) && isLinked(node, result)) {
+                absorb(node, result);
+                existsLink = true;
+            }
+        }
+
+        return result;
+    };
+
+    function isNodeAbsorded(node, result) {
+        return indexOf(result.nodes, node) >= 0;
+    }
+
+    function isLinked(node, result) {
+        var hasLink = false;
+        forEachEdgeType(function (edgeType) {
+            each$1(edgeIdGetter(node, edgeType) || [], function (edgeId) {
+                result.records[edgeType.name][edgeId] && (hasLink = true);
+            });
+        });
+        return hasLink;
+    }
+
+    function absorb(node, result) {
+        result.nodes.push(node);
+        forEachEdgeType(function (edgeType) {
+            each$1(edgeIdGetter(node, edgeType) || [], function (edgeId) {
+                result.records[edgeType.name][edgeId] = true;
+            });
+        });
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$22 = each$1;
+var asc$1 = asc;
+
+/**
+ * Operate single axis.
+ * One axis can only operated by one axis operator.
+ * Different dataZoomModels may be defined to operate the same axis.
+ * (i.e. 'inside' data zoom and 'slider' data zoom components)
+ * So dataZoomModels share one axisProxy in that case.
+ *
+ * @class
+ */
+var AxisProxy = function (dimName, axisIndex, dataZoomModel, ecModel) {
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._dimName = dimName;
+
+    /**
+     * @private
+     */
+    this._axisIndex = axisIndex;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._valueWindow;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._percentWindow;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._dataExtent;
+
+    /**
+     * {minSpan, maxSpan, minValueSpan, maxValueSpan}
+     * @private
+     * @type {Object}
+     */
+    this._minMaxSpan;
+
+    /**
+     * @readOnly
+     * @type {module: echarts/model/Global}
+     */
+    this.ecModel = ecModel;
+
+    /**
+     * @private
+     * @type {module: echarts/component/dataZoom/DataZoomModel}
+     */
+    this._dataZoomModel = dataZoomModel;
+
+    // /**
+    //  * @readOnly
+    //  * @private
+    //  */
+    // this.hasSeriesStacked;
+};
+
+AxisProxy.prototype = {
+
+    constructor: AxisProxy,
+
+    /**
+     * Whether the axisProxy is hosted by dataZoomModel.
+     *
+     * @public
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     * @return {boolean}
+     */
+    hostedBy: function (dataZoomModel) {
+        return this._dataZoomModel === dataZoomModel;
+    },
+
+    /**
+     * @return {Array.<number>} Value can only be NaN or finite value.
+     */
+    getDataValueWindow: function () {
+        return this._valueWindow.slice();
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getDataPercentWindow: function () {
+        return this._percentWindow.slice();
+    },
+
+    /**
+     * @public
+     * @param {number} axisIndex
+     * @return {Array} seriesModels
+     */
+    getTargetSeriesModels: function () {
+        var seriesModels = [];
+        var ecModel = this.ecModel;
+
+        ecModel.eachSeries(function (seriesModel) {
+            if (isCoordSupported(seriesModel.get('coordinateSystem'))) {
+                var dimName = this._dimName;
+                var axisModel = ecModel.queryComponents({
+                    mainType: dimName + 'Axis',
+                    index: seriesModel.get(dimName + 'AxisIndex'),
+                    id: seriesModel.get(dimName + 'AxisId')
+                })[0];
+                if (this._axisIndex === (axisModel && axisModel.componentIndex)) {
+                    seriesModels.push(seriesModel);
+                }
+            }
+        }, this);
+
+        return seriesModels;
+    },
+
+    getAxisModel: function () {
+        return this.ecModel.getComponent(this._dimName + 'Axis', this._axisIndex);
+    },
+
+    getOtherAxisModel: function () {
+        var axisDim = this._dimName;
+        var ecModel = this.ecModel;
+        var axisModel = this.getAxisModel();
+        var isCartesian = axisDim === 'x' || axisDim === 'y';
+        var otherAxisDim;
+        var coordSysIndexName;
+        if (isCartesian) {
+            coordSysIndexName = 'gridIndex';
+            otherAxisDim = axisDim === 'x' ? 'y' : 'x';
+        }
+        else {
+            coordSysIndexName = 'polarIndex';
+            otherAxisDim = axisDim === 'angle' ? 'radius' : 'angle';
+        }
+        var foundOtherAxisModel;
+        ecModel.eachComponent(otherAxisDim + 'Axis', function (otherAxisModel) {
+            if ((otherAxisModel.get(coordSysIndexName) || 0)
+                === (axisModel.get(coordSysIndexName) || 0)
+            ) {
+                foundOtherAxisModel = otherAxisModel;
+            }
+        });
+        return foundOtherAxisModel;
+    },
+
+    getMinMaxSpan: function () {
+        return clone(this._minMaxSpan);
+    },
+
+    /**
+     * Only calculate by given range and this._dataExtent, do not change anything.
+     *
+     * @param {Object} opt
+     * @param {number} [opt.start]
+     * @param {number} [opt.end]
+     * @param {number} [opt.startValue]
+     * @param {number} [opt.endValue]
+     */
+    calculateDataWindow: function (opt) {
+        var dataExtent = this._dataExtent;
+        var axisModel = this.getAxisModel();
+        var scale = axisModel.axis.scale;
+        var rangePropMode = this._dataZoomModel.getRangePropMode();
+        var percentExtent = [0, 100];
+        var percentWindow = [
+            opt.start,
+            opt.end
+        ];
+        var valueWindow = [];
+
+        each$22(['startValue', 'endValue'], function (prop) {
+            valueWindow.push(opt[prop] != null ? scale.parse(opt[prop]) : null);
+        });
+
+        // Normalize bound.
+        each$22([0, 1], function (idx) {
+            var boundValue = valueWindow[idx];
+            var boundPercent = percentWindow[idx];
+
+            // Notice: dataZoom is based either on `percentProp` ('start', 'end') or
+            // on `valueProp` ('startValue', 'endValue'). The former one is suitable
+            // for cases that a dataZoom component controls multiple axes with different
+            // unit or extent, and the latter one is suitable for accurate zoom by pixel
+            // (e.g., in dataZoomSelect). `valueProp` can be calculated from `percentProp`,
+            // but it is awkward that `percentProp` can not be obtained from `valueProp`
+            // accurately (because all of values that are overflow the `dataExtent` will
+            // be calculated to percent '100%'). So we have to use
+            // `dataZoom.getRangePropMode()` to mark which prop is used.
+            // `rangePropMode` is updated only when setOption or dispatchAction, otherwise
+            // it remains its original value.
+
+            if (rangePropMode[idx] === 'percent') {
+                if (boundPercent == null) {
+                    boundPercent = percentExtent[idx];
+                }
+                // Use scale.parse to math round for category or time axis.
+                boundValue = scale.parse(linearMap(
+                    boundPercent, percentExtent, dataExtent, true
+                ));
+            }
+            else {
+                // Calculating `percent` from `value` may be not accurate, because
+                // This calculation can not be inversed, because all of values that
+                // are overflow the `dataExtent` will be calculated to percent '100%'
+                boundPercent = linearMap(
+                    boundValue, dataExtent, percentExtent, true
+                );
+            }
+
+            // valueWindow[idx] = round(boundValue);
+            // percentWindow[idx] = round(boundPercent);
+            valueWindow[idx] = boundValue;
+            percentWindow[idx] = boundPercent;
+        });
+
+        return {
+            valueWindow: asc$1(valueWindow),
+            percentWindow: asc$1(percentWindow)
+        };
+    },
+
+    /**
+     * Notice: reset should not be called before series.restoreData() called,
+     * so it is recommanded to be called in "process stage" but not "model init
+     * stage".
+     *
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     */
+    reset: function (dataZoomModel) {
+        if (dataZoomModel !== this._dataZoomModel) {
+            return;
+        }
+
+        var targetSeries = this.getTargetSeriesModels();
+        // Culculate data window and data extent, and record them.
+        this._dataExtent = calculateDataExtent(this, this._dimName, targetSeries);
+
+        // this.hasSeriesStacked = false;
+        // each(targetSeries, function (series) {
+            // var data = series.getData();
+            // var dataDim = data.mapDimension(this._dimName);
+            // var stackedDimension = data.getCalculationInfo('stackedDimension');
+            // if (stackedDimension && stackedDimension === dataDim) {
+                // this.hasSeriesStacked = true;
+            // }
+        // }, this);
+
+        var dataWindow = this.calculateDataWindow(dataZoomModel.option);
+
+        this._valueWindow = dataWindow.valueWindow;
+        this._percentWindow = dataWindow.percentWindow;
+
+        setMinMaxSpan(this);
+
+        // Update axis setting then.
+        setAxisModel(this);
+    },
+
+    /**
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     */
+    restore: function (dataZoomModel) {
+        if (dataZoomModel !== this._dataZoomModel) {
+            return;
+        }
+
+        this._valueWindow = this._percentWindow = null;
+        setAxisModel(this, true);
+    },
+
+    /**
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     */
+    filterData: function (dataZoomModel, api) {
+        if (dataZoomModel !== this._dataZoomModel) {
+            return;
+        }
+
+        var axisDim = this._dimName;
+        var seriesModels = this.getTargetSeriesModels();
+        var filterMode = dataZoomModel.get('filterMode');
+        var valueWindow = this._valueWindow;
+
+        if (filterMode === 'none') {
+            return;
+        }
+
+        // FIXME
+        // Toolbox may has dataZoom injected. And if there are stacked bar chart
+        // with NaN data, NaN will be filtered and stack will be wrong.
+        // So we need to force the mode to be set empty.
+        // In fect, it is not a big deal that do not support filterMode-'filter'
+        // when using toolbox#dataZoom, utill tooltip#dataZoom support "single axis
+        // selection" some day, which might need "adapt to data extent on the
+        // otherAxis", which is disabled by filterMode-'empty'.
+        // But currently, stack has been fixed to based on value but not index,
+        // so this is not an issue any more.
+        // var otherAxisModel = this.getOtherAxisModel();
+        // if (dataZoomModel.get('$fromToolbox')
+        //     && otherAxisModel
+        //     && otherAxisModel.hasSeriesStacked
+        // ) {
+        //     filterMode = 'empty';
+        // }
+
+        // TODO
+        // filterMode 'weakFilter' and 'empty' is not optimized for huge data yet.
+
+        // Process series data
+        each$22(seriesModels, function (seriesModel) {
+            var seriesData = seriesModel.getData();
+            var dataDims = seriesData.mapDimension(axisDim, true);
+
+            if (filterMode === 'weakFilter') {
+                seriesData.filterSelf(function (dataIndex) {
+                    var leftOut;
+                    var rightOut;
+                    var hasValue;
+                    for (var i = 0; i < dataDims.length; i++) {
+                        var value = seriesData.get(dataDims[i], dataIndex);
+                        var thisHasValue = !isNaN(value);
+                        var thisLeftOut = value < valueWindow[0];
+                        var thisRightOut = value > valueWindow[1];
+                        if (thisHasValue && !thisLeftOut && !thisRightOut) {
+                            return true;
+                        }
+                        thisHasValue && (hasValue = true);
+                        thisLeftOut && (leftOut = true);
+                        thisRightOut && (rightOut = true);
+                    }
+                    // If both left out and right out, do not filter.
+                    return hasValue && leftOut && rightOut;
+                });
+            }
+            else {
+                each$22(dataDims, function (dim) {
+                    if (filterMode === 'empty') {
+                        seriesModel.setData(
+                            seriesData.map(dim, function (value) {
+                                return !isInWindow(value) ? NaN : value;
+                            })
+                        );
+                    }
+                    else {
+                        var range = {};
+                        range[dim] = valueWindow;
+
+                        // console.time('select');
+                        seriesData.selectRange(range);
+                        // console.timeEnd('select');
+                    }
+                });
+            }
+
+            each$22(dataDims, function (dim) {
+                seriesData.setApproximateExtent(valueWindow, dim);
+            });
+        });
+
+        function isInWindow(value) {
+            return value >= valueWindow[0] && value <= valueWindow[1];
+        }
+    }
+};
+
+function calculateDataExtent(axisProxy, axisDim, seriesModels) {
+    var dataExtent = [Infinity, -Infinity];
+
+    each$22(seriesModels, function (seriesModel) {
+        var seriesData = seriesModel.getData();
+        if (seriesData) {
+            each$22(seriesData.mapDimension(axisDim, true), function (dim) {
+                var seriesExtent = seriesData.getApproximateExtent(dim);
+                seriesExtent[0] < dataExtent[0] && (dataExtent[0] = seriesExtent[0]);
+                seriesExtent[1] > dataExtent[1] && (dataExtent[1] = seriesExtent[1]);
+            });
+        }
+    });
+
+    if (dataExtent[1] < dataExtent[0]) {
+        dataExtent = [NaN, NaN];
+    }
+
+    // It is important to get "consistent" extent when more then one axes is
+    // controlled by a `dataZoom`, otherwise those axes will not be synchronized
+    // when zooming. But it is difficult to know what is "consistent", considering
+    // axes have different type or even different meanings (For example, two
+    // time axes are used to compare data of the same date in different years).
+    // So basically dataZoom just obtains extent by series.data (in category axis
+    // extent can be obtained from axis.data).
+    // Nevertheless, user can set min/max/scale on axes to make extent of axes
+    // consistent.
+    fixExtentByAxis(axisProxy, dataExtent);
+
+    return dataExtent;
+}
+
+function fixExtentByAxis(axisProxy, dataExtent) {
+    var axisModel = axisProxy.getAxisModel();
+    var min = axisModel.getMin(true);
+
+    // For category axis, if min/max/scale are not set, extent is determined
+    // by axis.data by default.
+    var isCategoryAxis = axisModel.get('type') === 'category';
+    var axisDataLen = isCategoryAxis && axisModel.getCategories().length;
+
+    if (min != null && min !== 'dataMin' && typeof min !== 'function') {
+        dataExtent[0] = min;
+    }
+    else if (isCategoryAxis) {
+        dataExtent[0] = axisDataLen > 0 ? 0 : NaN;
+    }
+
+    var max = axisModel.getMax(true);
+    if (max != null && max !== 'dataMax' && typeof max !== 'function') {
+        dataExtent[1] = max;
+    }
+    else if (isCategoryAxis) {
+        dataExtent[1] = axisDataLen > 0 ? axisDataLen - 1 : NaN;
+    }
+
+    if (!axisModel.get('scale', true)) {
+        dataExtent[0] > 0 && (dataExtent[0] = 0);
+        dataExtent[1] < 0 && (dataExtent[1] = 0);
+    }
+
+    // For value axis, if min/max/scale are not set, we just use the extent obtained
+    // by series data, which may be a little different from the extent calculated by
+    // `axisHelper.getScaleExtent`. But the different just affects the experience a
+    // little when zooming. So it will not be fixed until some users require it strongly.
+
+    return dataExtent;
+}
+
+function setAxisModel(axisProxy, isRestore) {
+    var axisModel = axisProxy.getAxisModel();
+
+    var percentWindow = axisProxy._percentWindow;
+    var valueWindow = axisProxy._valueWindow;
+
+    if (!percentWindow) {
+        return;
+    }
+
+    // [0, 500]: arbitrary value, guess axis extent.
+    var precision = getPixelPrecision(valueWindow, [0, 500]);
+    precision = Math.min(precision, 20);
+    // isRestore or isFull
+    var useOrigin = isRestore || (percentWindow[0] === 0 && percentWindow[1] === 100);
+
+    axisModel.setRange(
+        useOrigin ? null : +valueWindow[0].toFixed(precision),
+        useOrigin ? null : +valueWindow[1].toFixed(precision)
+    );
+}
+
+function setMinMaxSpan(axisProxy) {
+    var minMaxSpan = axisProxy._minMaxSpan = {};
+    var dataZoomModel = axisProxy._dataZoomModel;
+
+    each$22(['min', 'max'], function (minMax) {
+        minMaxSpan[minMax + 'Span'] = dataZoomModel.get(minMax + 'Span');
+
+        // minValueSpan and maxValueSpan has higher priority than minSpan and maxSpan
+        var valueSpan = dataZoomModel.get(minMax + 'ValueSpan');
+
+        if (valueSpan != null) {
+            minMaxSpan[minMax + 'ValueSpan'] = valueSpan;
+            valueSpan = axisProxy.getAxisModel().axis.scale.parse(valueSpan);
+
+            if (valueSpan != null) {
+                var dataExtent = axisProxy._dataExtent;
+                minMaxSpan[minMax + 'Span'] = linearMap(
+                    dataExtent[0] + valueSpan, dataExtent, [0, 100], true
+                );
+            }
+        }
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$21 = each$1;
+var eachAxisDim = eachAxisDim$1;
+
+var DataZoomModel = extendComponentModel({
+
+    type: 'dataZoom',
+
+    dependencies: [
+        'xAxis', 'yAxis', 'zAxis', 'radiusAxis', 'angleAxis', 'singleAxis', 'series'
+    ],
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        zlevel: 0,
+        z: 4,                   // Higher than normal component (z: 2).
+        orient: null,           // Default auto by axisIndex. Possible value: 'horizontal', 'vertical'.
+        xAxisIndex: null,       // Default the first horizontal category axis.
+        yAxisIndex: null,       // Default the first vertical category axis.
+
+        filterMode: 'filter',   // Possible values: 'filter' or 'empty' or 'weakFilter'.
+                                // 'filter': data items which are out of window will be removed. This option is
+                                //          applicable when filtering outliers. For each data item, it will be
+                                //          filtered if one of the relevant dimensions is out of the window.
+                                // 'weakFilter': data items which are out of window will be removed. This option
+                                //          is applicable when filtering outliers. For each data item, it will be
+                                //          filtered only if all  of the relevant dimensions are out of the same
+                                //          side of the window.
+                                // 'empty': data items which are out of window will be set to empty.
+                                //          This option is applicable when user should not neglect
+                                //          that there are some data items out of window.
+                                // 'none': Do not filter.
+                                // Taking line chart as an example, line will be broken in
+                                // the filtered points when filterModel is set to 'empty', but
+                                // be connected when set to 'filter'.
+
+        throttle: null,         // Dispatch action by the fixed rate, avoid frequency.
+                                // default 100. Do not throttle when use null/undefined.
+                                // If animation === true and animationDurationUpdate > 0,
+                                // default value is 100, otherwise 20.
+        start: 0,               // Start percent. 0 ~ 100
+        end: 100,               // End percent. 0 ~ 100
+        startValue: null,       // Start value. If startValue specified, start is ignored.
+        endValue: null,         // End value. If endValue specified, end is ignored.
+        minSpan: null,          // 0 ~ 100
+        maxSpan: null,          // 0 ~ 100
+        minValueSpan: null,     // The range of dataZoom can not be smaller than that.
+        maxValueSpan: null,     // The range of dataZoom can not be larger than that.
+        rangeMode: null         // Array, can be 'value' or 'percent'.
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel) {
+
+        /**
+         * key like x_0, y_1
+         * @private
+         * @type {Object}
+         */
+        this._dataIntervalByAxis = {};
+
+        /**
+         * @private
+         */
+        this._dataInfo = {};
+
+        /**
+         * key like x_0, y_1
+         * @private
+         */
+        this._axisProxies = {};
+
+        /**
+         * @readOnly
+         */
+        this.textStyleModel;
+
+        /**
+         * @private
+         */
+        this._autoThrottle = true;
+
+        /**
+         * 'percent' or 'value'
+         * @private
+         */
+        this._rangePropMode = ['percent', 'percent'];
+
+        var rawOption = retrieveRaw(option);
+
+        this.mergeDefaultAndTheme(option, ecModel);
+
+        this.doInit(rawOption);
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (newOption) {
+        var rawOption = retrieveRaw(newOption);
+
+        //FIX #2591
+        merge(this.option, newOption, true);
+
+        this.doInit(rawOption);
+    },
+
+    /**
+     * @protected
+     */
+    doInit: function (rawOption) {
+        var thisOption = this.option;
+
+        // Disable realtime view update if canvas is not supported.
+        if (!env$1.canvasSupported) {
+            thisOption.realtime = false;
+        }
+
+        this._setDefaultThrottle(rawOption);
+
+        updateRangeUse(this, rawOption);
+
+        each$21([['start', 'startValue'], ['end', 'endValue']], function (names, index) {
+            // start/end has higher priority over startValue/endValue if they
+            // both set, but we should make chart.setOption({endValue: 1000})
+            // effective, rather than chart.setOption({endValue: 1000, end: null}).
+            if (this._rangePropMode[index] === 'value') {
+                thisOption[names[0]] = null;
+            }
+            // Otherwise do nothing and use the merge result.
+        }, this);
+
+        this.textStyleModel = this.getModel('textStyle');
+
+        this._resetTarget();
+
+        this._giveAxisProxies();
+    },
+
+    /**
+     * @private
+     */
+    _giveAxisProxies: function () {
+        var axisProxies = this._axisProxies;
+
+        this.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel, ecModel) {
+            var axisModel = this.dependentModels[dimNames.axis][axisIndex];
+
+            // If exists, share axisProxy with other dataZoomModels.
+            var axisProxy = axisModel.__dzAxisProxy || (
+                // Use the first dataZoomModel as the main model of axisProxy.
+                axisModel.__dzAxisProxy = new AxisProxy(
+                    dimNames.name, axisIndex, this, ecModel
+                )
+            );
+            // FIXME
+            // dispose __dzAxisProxy
+
+            axisProxies[dimNames.name + '_' + axisIndex] = axisProxy;
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _resetTarget: function () {
+        var thisOption = this.option;
+
+        var autoMode = this._judgeAutoMode();
+
+        eachAxisDim(function (dimNames) {
+            var axisIndexName = dimNames.axisIndex;
+            thisOption[axisIndexName] = normalizeToArray(
+                thisOption[axisIndexName]
+            );
+        }, this);
+
+        if (autoMode === 'axisIndex') {
+            this._autoSetAxisIndex();
+        }
+        else if (autoMode === 'orient') {
+            this._autoSetOrient();
+        }
+    },
+
+    /**
+     * @private
+     */
+    _judgeAutoMode: function () {
+        // Auto set only works for setOption at the first time.
+        // The following is user's reponsibility. So using merged
+        // option is OK.
+        var thisOption = this.option;
+
+        var hasIndexSpecified = false;
+        eachAxisDim(function (dimNames) {
+            // When user set axisIndex as a empty array, we think that user specify axisIndex
+            // but do not want use auto mode. Because empty array may be encountered when
+            // some error occured.
+            if (thisOption[dimNames.axisIndex] != null) {
+                hasIndexSpecified = true;
+            }
+        }, this);
+
+        var orient = thisOption.orient;
+
+        if (orient == null && hasIndexSpecified) {
+            return 'orient';
+        }
+        else if (!hasIndexSpecified) {
+            if (orient == null) {
+                thisOption.orient = 'horizontal';
+            }
+            return 'axisIndex';
+        }
+    },
+
+    /**
+     * @private
+     */
+    _autoSetAxisIndex: function () {
+        var autoAxisIndex = true;
+        var orient = this.get('orient', true);
+        var thisOption = this.option;
+        var dependentModels = this.dependentModels;
+
+        if (autoAxisIndex) {
+            // Find axis that parallel to dataZoom as default.
+            var dimName = orient === 'vertical' ? 'y' : 'x';
+
+            if (dependentModels[dimName + 'Axis'].length) {
+                thisOption[dimName + 'AxisIndex'] = [0];
+                autoAxisIndex = false;
+            }
+            else {
+                each$21(dependentModels.singleAxis, function (singleAxisModel) {
+                    if (autoAxisIndex && singleAxisModel.get('orient', true) === orient) {
+                        thisOption.singleAxisIndex = [singleAxisModel.componentIndex];
+                        autoAxisIndex = false;
+                    }
+                });
+            }
+        }
+
+        if (autoAxisIndex) {
+            // Find the first category axis as default. (consider polar)
+            eachAxisDim(function (dimNames) {
+                if (!autoAxisIndex) {
+                    return;
+                }
+                var axisIndices = [];
+                var axisModels = this.dependentModels[dimNames.axis];
+                if (axisModels.length && !axisIndices.length) {
+                    for (var i = 0, len = axisModels.length; i < len; i++) {
+                        if (axisModels[i].get('type') === 'category') {
+                            axisIndices.push(i);
+                        }
+                    }
+                }
+                thisOption[dimNames.axisIndex] = axisIndices;
+                if (axisIndices.length) {
+                    autoAxisIndex = false;
+                }
+            }, this);
+        }
+
+        if (autoAxisIndex) {
+            // FIXME
+            // 这里是兼容ec2的写法（没指定xAxisIndex和yAxisIndex时把scatter和双数值轴折柱纳入dataZoom控制），
+            // 但是实际是否需要Grid.js#getScaleByOption来判断（考虑time，log等axis type）？
+
+            // If both dataZoom.xAxisIndex and dataZoom.yAxisIndex is not specified,
+            // dataZoom component auto adopts series that reference to
+            // both xAxis and yAxis which type is 'value'.
+            this.ecModel.eachSeries(function (seriesModel) {
+                if (this._isSeriesHasAllAxesTypeOf(seriesModel, 'value')) {
+                    eachAxisDim(function (dimNames) {
+                        var axisIndices = thisOption[dimNames.axisIndex];
+
+                        var axisIndex = seriesModel.get(dimNames.axisIndex);
+                        var axisId = seriesModel.get(dimNames.axisId);
+
+                        var axisModel = seriesModel.ecModel.queryComponents({
+                            mainType: dimNames.axis,
+                            index: axisIndex,
+                            id: axisId
+                        })[0];
+
+                        if (__DEV__) {
+                            if (!axisModel) {
+                                throw new Error(
+                                    dimNames.axis + ' "' + retrieve(
+                                        axisIndex,
+                                        axisId,
+                                        0
+                                    ) + '" not found'
+                                );
+                            }
+                        }
+                        axisIndex = axisModel.componentIndex;
+
+                        if (indexOf(axisIndices, axisIndex) < 0) {
+                            axisIndices.push(axisIndex);
+                        }
+                    });
+                }
+            }, this);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _autoSetOrient: function () {
+        var dim;
+
+        // Find the first axis
+        this.eachTargetAxis(function (dimNames) {
+            !dim && (dim = dimNames.name);
+        }, this);
+
+        this.option.orient = dim === 'y' ? 'vertical' : 'horizontal';
+    },
+
+    /**
+     * @private
+     */
+    _isSeriesHasAllAxesTypeOf: function (seriesModel, axisType) {
+        // FIXME
+        // 需要series的xAxisIndex和yAxisIndex都首先自动设置上。
+        // 例如series.type === scatter时。
+
+        var is = true;
+        eachAxisDim(function (dimNames) {
+            var seriesAxisIndex = seriesModel.get(dimNames.axisIndex);
+            var axisModel = this.dependentModels[dimNames.axis][seriesAxisIndex];
+
+            if (!axisModel || axisModel.get('type') !== axisType) {
+                is = false;
+            }
+        }, this);
+        return is;
+    },
+
+    /**
+     * @private
+     */
+    _setDefaultThrottle: function (rawOption) {
+        // When first time user set throttle, auto throttle ends.
+        if (rawOption.hasOwnProperty('throttle')) {
+            this._autoThrottle = false;
+        }
+        if (this._autoThrottle) {
+            var globalOption = this.ecModel.option;
+            this.option.throttle =
+                (globalOption.animation && globalOption.animationDurationUpdate > 0)
+                ? 100 : 20;
+        }
+    },
+
+    /**
+     * @public
+     */
+    getFirstTargetAxisModel: function () {
+        var firstAxisModel;
+        eachAxisDim(function (dimNames) {
+            if (firstAxisModel == null) {
+                var indices = this.get(dimNames.axisIndex);
+                if (indices.length) {
+                    firstAxisModel = this.dependentModels[dimNames.axis][indices[0]];
+                }
+            }
+        }, this);
+
+        return firstAxisModel;
+    },
+
+    /**
+     * @public
+     * @param {Function} callback param: axisModel, dimNames, axisIndex, dataZoomModel, ecModel
+     */
+    eachTargetAxis: function (callback, context) {
+        var ecModel = this.ecModel;
+        eachAxisDim(function (dimNames) {
+            each$21(
+                this.get(dimNames.axisIndex),
+                function (axisIndex) {
+                    callback.call(context, dimNames, axisIndex, this, ecModel);
+                },
+                this
+            );
+        }, this);
+    },
+
+    /**
+     * @param {string} dimName
+     * @param {number} axisIndex
+     * @return {module:echarts/component/dataZoom/AxisProxy} If not found, return null/undefined.
+     */
+    getAxisProxy: function (dimName, axisIndex) {
+        return this._axisProxies[dimName + '_' + axisIndex];
+    },
+
+    /**
+     * @param {string} dimName
+     * @param {number} axisIndex
+     * @return {module:echarts/model/Model} If not found, return null/undefined.
+     */
+    getAxisModel: function (dimName, axisIndex) {
+        var axisProxy = this.getAxisProxy(dimName, axisIndex);
+        return axisProxy && axisProxy.getAxisModel();
+    },
+
+    /**
+     * If not specified, set to undefined.
+     *
+     * @public
+     * @param {Object} opt
+     * @param {number} [opt.start]
+     * @param {number} [opt.end]
+     * @param {number} [opt.startValue]
+     * @param {number} [opt.endValue]
+     * @param {boolean} [ignoreUpdateRangeUsg=false]
+     */
+    setRawRange: function (opt, ignoreUpdateRangeUsg) {
+        var option = this.option;
+        each$21([['start', 'startValue'], ['end', 'endValue']], function (names) {
+            // If only one of 'start' and 'startValue' is not null/undefined, the other
+            // should be cleared, which enable clear the option.
+            // If both of them are not set, keep option with the original value, which
+            // enable use only set start but not set end when calling `dispatchAction`.
+            // The same as 'end' and 'endValue'.
+            if (opt[names[0]] != null || opt[names[1]] != null) {
+                option[names[0]] = opt[names[0]];
+                option[names[1]] = opt[names[1]];
+            }
+        }, this);
+
+        !ignoreUpdateRangeUsg && updateRangeUse(this, opt);
+    },
+
+    /**
+     * @public
+     * @return {Array.<number>} [startPercent, endPercent]
+     */
+    getPercentRange: function () {
+        var axisProxy = this.findRepresentativeAxisProxy();
+        if (axisProxy) {
+            return axisProxy.getDataPercentWindow();
+        }
+    },
+
+    /**
+     * @public
+     * For example, chart.getModel().getComponent('dataZoom').getValueRange('y', 0);
+     *
+     * @param {string} [axisDimName]
+     * @param {number} [axisIndex]
+     * @return {Array.<number>} [startValue, endValue] value can only be '-' or finite number.
+     */
+    getValueRange: function (axisDimName, axisIndex) {
+        if (axisDimName == null && axisIndex == null) {
+            var axisProxy = this.findRepresentativeAxisProxy();
+            if (axisProxy) {
+                return axisProxy.getDataValueWindow();
+            }
+        }
+        else {
+            return this.getAxisProxy(axisDimName, axisIndex).getDataValueWindow();
+        }
+    },
+
+    /**
+     * @public
+     * @param {module:echarts/model/Model} [axisModel] If axisModel given, find axisProxy
+     *      corresponding to the axisModel
+     * @return {module:echarts/component/dataZoom/AxisProxy}
+     */
+    findRepresentativeAxisProxy: function (axisModel) {
+        if (axisModel) {
+            return axisModel.__dzAxisProxy;
+        }
+
+        // Find the first hosted axisProxy
+        var axisProxies = this._axisProxies;
+        for (var key in axisProxies) {
+            if (axisProxies.hasOwnProperty(key) && axisProxies[key].hostedBy(this)) {
+                return axisProxies[key];
+            }
+        }
+
+        // If no hosted axis find not hosted axisProxy.
+        // Consider this case: dataZoomModel1 and dataZoomModel2 control the same axis,
+        // and the option.start or option.end settings are different. The percentRange
+        // should follow axisProxy.
+        // (We encounter this problem in toolbox data zoom.)
+        for (var key in axisProxies) {
+            if (axisProxies.hasOwnProperty(key) && !axisProxies[key].hostedBy(this)) {
+                return axisProxies[key];
+            }
+        }
+    },
+
+    /**
+     * @return {Array.<string>}
+     */
+    getRangePropMode: function () {
+        return this._rangePropMode.slice();
+    }
+
+});
+
+function retrieveRaw(option) {
+    var ret = {};
+    each$21(
+        ['start', 'end', 'startValue', 'endValue', 'throttle'],
+        function (name) {
+            option.hasOwnProperty(name) && (ret[name] = option[name]);
+        }
+    );
+    return ret;
+}
+
+function updateRangeUse(dataZoomModel, rawOption) {
+    var rangePropMode = dataZoomModel._rangePropMode;
+    var rangeModeInOption = dataZoomModel.get('rangeMode');
+
+    each$21([['start', 'startValue'], ['end', 'endValue']], function (names, index) {
+        var percentSpecified = rawOption[names[0]] != null;
+        var valueSpecified = rawOption[names[1]] != null;
+        if (percentSpecified && !valueSpecified) {
+            rangePropMode[index] = 'percent';
+        }
+        else if (!percentSpecified && valueSpecified) {
+            rangePropMode[index] = 'value';
+        }
+        else if (rangeModeInOption) {
+            rangePropMode[index] = rangeModeInOption[index];
+        }
+        else if (percentSpecified) { // percentSpecified && valueSpecified
+            rangePropMode[index] = 'percent';
+        }
+        // else remain its original setting.
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DataZoomView = Component.extend({
+
+    type: 'dataZoom',
+
+    render: function (dataZoomModel, ecModel, api, payload) {
+        this.dataZoomModel = dataZoomModel;
+        this.ecModel = ecModel;
+        this.api = api;
+    },
+
+    /**
+     * Find the first target coordinate system.
+     *
+     * @protected
+     * @return {Object} {
+     *                   grid: [
+     *                       {model: coord0, axisModels: [axis1, axis3], coordIndex: 1},
+     *                       {model: coord1, axisModels: [axis0, axis2], coordIndex: 0},
+     *                       ...
+     *                   ],  // cartesians must not be null/undefined.
+     *                   polar: [
+     *                       {model: coord0, axisModels: [axis4], coordIndex: 0},
+     *                       ...
+     *                   ],  // polars must not be null/undefined.
+     *                   singleAxis: [
+     *                       {model: coord0, axisModels: [], coordIndex: 0}
+     *                   ]
+     */
+    getTargetCoordInfo: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var ecModel = this.ecModel;
+        var coordSysLists = {};
+
+        dataZoomModel.eachTargetAxis(function (dimNames, axisIndex) {
+            var axisModel = ecModel.getComponent(dimNames.axis, axisIndex);
+            if (axisModel) {
+                var coordModel = axisModel.getCoordSysModel();
+                coordModel && save(
+                    coordModel,
+                    axisModel,
+                    coordSysLists[coordModel.mainType] || (coordSysLists[coordModel.mainType] = []),
+                    coordModel.componentIndex
+                );
+            }
+        }, this);
+
+        function save(coordModel, axisModel, store, coordIndex) {
+            var item;
+            for (var i = 0; i < store.length; i++) {
+                if (store[i].model === coordModel) {
+                    item = store[i];
+                    break;
+                }
+            }
+            if (!item) {
+                store.push(item = {
+                    model: coordModel, axisModels: [], coordIndex: coordIndex
+                });
+            }
+            item.axisModels.push(axisModel);
+        }
+
+        return coordSysLists;
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var SliderZoomModel = DataZoomModel.extend({
+
+    type: 'dataZoom.slider',
+
+    layoutMode: 'box',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        show: true,
+
+        // ph => placeholder. Using placehoder here because
+        // deault value can only be drived in view stage.
+        right: 'ph',  // Default align to grid rect.
+        top: 'ph',    // Default align to grid rect.
+        width: 'ph',  // Default align to grid rect.
+        height: 'ph', // Default align to grid rect.
+        left: null,   // Default align to grid rect.
+        bottom: null, // Default align to grid rect.
+
+        backgroundColor: 'rgba(47,69,84,0)',    // Background of slider zoom component.
+        // dataBackgroundColor: '#ddd',         // Background coor of data shadow and border of box,
+                                                // highest priority, remain for compatibility of
+                                                // previous version, but not recommended any more.
+        dataBackground: {
+            lineStyle: {
+                color: '#2f4554',
+                width: 0.5,
+                opacity: 0.3
+            },
+            areaStyle: {
+                color: 'rgba(47,69,84,0.3)',
+                opacity: 0.3
+            }
+        },
+        borderColor: '#ddd',                    // border color of the box. For compatibility,
+                                                // if dataBackgroundColor is set, borderColor
+                                                // is ignored.
+
+        fillerColor: 'rgba(167,183,204,0.4)',     // Color of selected area.
+        // handleColor: 'rgba(89,170,216,0.95)',     // Color of handle.
+        // handleIcon: 'path://M4.9,17.8c0-1.4,4.5-10.5,5.5-12.4c0-0.1,0.6-1.1,0.9-1.1c0.4,0,0.9,1,0.9,1.1c1.1,2.2,5.4,11,5.4,12.4v17.8c0,1.5-0.6,2.1-1.3,2.1H6.1c-0.7,0-1.3-0.6-1.3-2.1V17.8z',
+        handleIcon: 'M8.2,13.6V3.9H6.3v9.7H3.1v14.9h3.3v9.7h1.8v-9.7h3.3V13.6H8.2z M9.7,24.4H4.8v-1.4h4.9V24.4z M9.7,19.1H4.8v-1.4h4.9V19.1z',
+        // Percent of the slider height
+        handleSize: '100%',
+
+        handleStyle: {
+            color: '#a7b7cc'
+        },
+
+        labelPrecision: null,
+        labelFormatter: null,
+        showDetail: true,
+        showDataShadow: 'auto',                 // Default auto decision.
+        realtime: true,
+        zoomLock: false,                        // Whether disable zoom.
+        textStyle: {
+            color: '#333'
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var Rect$2 = Rect;
+var linearMap$1 = linearMap;
+var asc$2 = asc;
+var bind$4 = bind;
+var each$23 = each$1;
+
+// Constants
+var DEFAULT_LOCATION_EDGE_GAP = 7;
+var DEFAULT_FRAME_BORDER_WIDTH = 1;
+var DEFAULT_FILLER_SIZE = 30;
+var HORIZONTAL = 'horizontal';
+var VERTICAL = 'vertical';
+var LABEL_GAP = 5;
+var SHOW_DATA_SHADOW_SERIES_TYPE = ['line', 'bar', 'candlestick', 'scatter'];
+
+var SliderZoomView = DataZoomView.extend({
+
+    type: 'dataZoom.slider',
+
+    init: function (ecModel, api) {
+
+        /**
+         * @private
+         * @type {Object}
+         */
+        this._displayables = {};
+
+        /**
+         * @private
+         * @type {string}
+         */
+        this._orient;
+
+        /**
+         * [0, 100]
+         * @private
+         */
+        this._range;
+
+        /**
+         * [coord of the first handle, coord of the second handle]
+         * @private
+         */
+        this._handleEnds;
+
+        /**
+         * [length, thick]
+         * @private
+         * @type {Array.<number>}
+         */
+        this._size;
+
+        /**
+         * @private
+         * @type {number}
+         */
+        this._handleWidth;
+
+        /**
+         * @private
+         * @type {number}
+         */
+        this._handleHeight;
+
+        /**
+         * @private
+         */
+        this._location;
+
+        /**
+         * @private
+         */
+        this._dragging;
+
+        /**
+         * @private
+         */
+        this._dataShadowInfo;
+
+        this.api = api;
+    },
+
+    /**
+     * @override
+     */
+    render: function (dataZoomModel, ecModel, api, payload) {
+        SliderZoomView.superApply(this, 'render', arguments);
+
+        createOrUpdate(
+            this,
+            '_dispatchZoomAction',
+            this.dataZoomModel.get('throttle'),
+            'fixRate'
+        );
+
+        this._orient = dataZoomModel.get('orient');
+
+        if (this.dataZoomModel.get('show') === false) {
+            this.group.removeAll();
+            return;
+        }
+
+        // Notice: this._resetInterval() should not be executed when payload.type
+        // is 'dataZoom', origin this._range should be maintained, otherwise 'pan'
+        // or 'zoom' info will be missed because of 'throttle' of this.dispatchAction,
+        if (!payload || payload.type !== 'dataZoom' || payload.from !== this.uid) {
+            this._buildView();
+        }
+
+        this._updateView();
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        SliderZoomView.superApply(this, 'remove', arguments);
+        clear(this, '_dispatchZoomAction');
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        SliderZoomView.superApply(this, 'dispose', arguments);
+        clear(this, '_dispatchZoomAction');
+    },
+
+    _buildView: function () {
+        var thisGroup = this.group;
+
+        thisGroup.removeAll();
+
+        this._resetLocation();
+        this._resetInterval();
+
+        var barGroup = this._displayables.barGroup = new Group();
+
+        this._renderBackground();
+
+        this._renderHandle();
+
+        this._renderDataShadow();
+
+        thisGroup.add(barGroup);
+
+        this._positionGroup();
+    },
+
+    /**
+     * @private
+     */
+    _resetLocation: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var api = this.api;
+
+        // If some of x/y/width/height are not specified,
+        // auto-adapt according to target grid.
+        var coordRect = this._findCoordRect();
+        var ecSize = {width: api.getWidth(), height: api.getHeight()};
+        // Default align by coordinate system rect.
+        var positionInfo = this._orient === HORIZONTAL
+            ? {
+                // Why using 'right', because right should be used in vertical,
+                // and it is better to be consistent for dealing with position param merge.
+                right: ecSize.width - coordRect.x - coordRect.width,
+                top: (ecSize.height - DEFAULT_FILLER_SIZE - DEFAULT_LOCATION_EDGE_GAP),
+                width: coordRect.width,
+                height: DEFAULT_FILLER_SIZE
+            }
+            : { // vertical
+                right: DEFAULT_LOCATION_EDGE_GAP,
+                top: coordRect.y,
+                width: DEFAULT_FILLER_SIZE,
+                height: coordRect.height
+            };
+
+        // Do not write back to option and replace value 'ph', because
+        // the 'ph' value should be recalculated when resize.
+        var layoutParams = getLayoutParams(dataZoomModel.option);
+
+        // Replace the placeholder value.
+        each$1(['right', 'top', 'width', 'height'], function (name) {
+            if (layoutParams[name] === 'ph') {
+                layoutParams[name] = positionInfo[name];
+            }
+        });
+
+        var layoutRect = getLayoutRect(
+            layoutParams,
+            ecSize,
+            dataZoomModel.padding
+        );
+
+        this._location = {x: layoutRect.x, y: layoutRect.y};
+        this._size = [layoutRect.width, layoutRect.height];
+        this._orient === VERTICAL && this._size.reverse();
+    },
+
+    /**
+     * @private
+     */
+    _positionGroup: function () {
+        var thisGroup = this.group;
+        var location = this._location;
+        var orient = this._orient;
+
+        // Just use the first axis to determine mapping.
+        var targetAxisModel = this.dataZoomModel.getFirstTargetAxisModel();
+        var inverse = targetAxisModel && targetAxisModel.get('inverse');
+
+        var barGroup = this._displayables.barGroup;
+        var otherAxisInverse = (this._dataShadowInfo || {}).otherAxisInverse;
+
+        // Transform barGroup.
+        barGroup.attr(
+            (orient === HORIZONTAL && !inverse)
+            ? {scale: otherAxisInverse ? [1, 1] : [1, -1]}
+            : (orient === HORIZONTAL && inverse)
+            ? {scale: otherAxisInverse ? [-1, 1] : [-1, -1]}
+            : (orient === VERTICAL && !inverse)
+            ? {scale: otherAxisInverse ? [1, -1] : [1, 1], rotation: Math.PI / 2}
+            // Dont use Math.PI, considering shadow direction.
+            : {scale: otherAxisInverse ? [-1, -1] : [-1, 1], rotation: Math.PI / 2}
+        );
+
+        // Position barGroup
+        var rect = thisGroup.getBoundingRect([barGroup]);
+        thisGroup.attr('position', [location.x - rect.x, location.y - rect.y]);
+    },
+
+    /**
+     * @private
+     */
+    _getViewExtent: function () {
+        return [0, this._size[0]];
+    },
+
+    _renderBackground: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var size = this._size;
+        var barGroup = this._displayables.barGroup;
+
+        barGroup.add(new Rect$2({
+            silent: true,
+            shape: {
+                x: 0, y: 0, width: size[0], height: size[1]
+            },
+            style: {
+                fill: dataZoomModel.get('backgroundColor')
+            },
+            z2: -40
+        }));
+
+        // Click panel, over shadow, below handles.
+        barGroup.add(new Rect$2({
+            shape: {
+                x: 0, y: 0, width: size[0], height: size[1]
+            },
+            style: {
+                fill: 'transparent'
+            },
+            z2: 0,
+            onclick: bind(this._onClickPanelClick, this)
+        }));
+    },
+
+    _renderDataShadow: function () {
+        var info = this._dataShadowInfo = this._prepareDataShadowInfo();
+
+        if (!info) {
+            return;
+        }
+
+        var size = this._size;
+        var seriesModel = info.series;
+        var data = seriesModel.getRawData();
+
+        var otherDim = seriesModel.getShadowDim
+            ? seriesModel.getShadowDim() // @see candlestick
+            : info.otherDim;
+
+        if (otherDim == null) {
+            return;
+        }
+
+        var otherDataExtent = data.getDataExtent(otherDim);
+        // Nice extent.
+        var otherOffset = (otherDataExtent[1] - otherDataExtent[0]) * 0.3;
+        otherDataExtent = [
+            otherDataExtent[0] - otherOffset,
+            otherDataExtent[1] + otherOffset
+        ];
+        var otherShadowExtent = [0, size[1]];
+
+        var thisShadowExtent = [0, size[0]];
+
+        var areaPoints = [[size[0], 0], [0, 0]];
+        var linePoints = [];
+        var step = thisShadowExtent[1] / (data.count() - 1);
+        var thisCoord = 0;
+
+        // Optimize for large data shadow
+        var stride = Math.round(data.count() / size[0]);
+        var lastIsEmpty;
+        data.each([otherDim], function (value, index) {
+            if (stride > 0 && (index % stride)) {
+                thisCoord += step;
+                return;
+            }
+
+            // FIXME
+            // Should consider axis.min/axis.max when drawing dataShadow.
+
+            // FIXME
+            // 应该使用统一的空判断？还是在list里进行空判断？
+            var isEmpty = value == null || isNaN(value) || value === '';
+            // See #4235.
+            var otherCoord = isEmpty
+                ? 0 : linearMap$1(value, otherDataExtent, otherShadowExtent, true);
+
+            // Attempt to draw data shadow precisely when there are empty value.
+            if (isEmpty && !lastIsEmpty && index) {
+                areaPoints.push([areaPoints[areaPoints.length - 1][0], 0]);
+                linePoints.push([linePoints[linePoints.length - 1][0], 0]);
+            }
+            else if (!isEmpty && lastIsEmpty) {
+                areaPoints.push([thisCoord, 0]);
+                linePoints.push([thisCoord, 0]);
+            }
+
+            areaPoints.push([thisCoord, otherCoord]);
+            linePoints.push([thisCoord, otherCoord]);
+
+            thisCoord += step;
+            lastIsEmpty = isEmpty;
+        });
+
+        var dataZoomModel = this.dataZoomModel;
+        // var dataBackgroundModel = dataZoomModel.getModel('dataBackground');
+        this._displayables.barGroup.add(new Polygon({
+            shape: {points: areaPoints},
+            style: defaults(
+                {fill: dataZoomModel.get('dataBackgroundColor')},
+                dataZoomModel.getModel('dataBackground.areaStyle').getAreaStyle()
+            ),
+            silent: true,
+            z2: -20
+        }));
+        this._displayables.barGroup.add(new Polyline({
+            shape: {points: linePoints},
+            style: dataZoomModel.getModel('dataBackground.lineStyle').getLineStyle(),
+            silent: true,
+            z2: -19
+        }));
+    },
+
+    _prepareDataShadowInfo: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var showDataShadow = dataZoomModel.get('showDataShadow');
+
+        if (showDataShadow === false) {
+            return;
+        }
+
+        // Find a representative series.
+        var result;
+        var ecModel = this.ecModel;
+
+        dataZoomModel.eachTargetAxis(function (dimNames, axisIndex) {
+            var seriesModels = dataZoomModel
+                .getAxisProxy(dimNames.name, axisIndex)
+                .getTargetSeriesModels();
+
+            each$1(seriesModels, function (seriesModel) {
+                if (result) {
+                    return;
+                }
+
+                if (showDataShadow !== true && indexOf(
+                        SHOW_DATA_SHADOW_SERIES_TYPE, seriesModel.get('type')
+                    ) < 0
+                ) {
+                    return;
+                }
+
+                var thisAxis = ecModel.getComponent(dimNames.axis, axisIndex).axis;
+                var otherDim = getOtherDim(dimNames.name);
+                var otherAxisInverse;
+                var coordSys = seriesModel.coordinateSystem;
+
+                if (otherDim != null && coordSys.getOtherAxis) {
+                    otherAxisInverse = coordSys.getOtherAxis(thisAxis).inverse;
+                }
+
+                otherDim = seriesModel.getData().mapDimension(otherDim);
+
+                result = {
+                    thisAxis: thisAxis,
+                    series: seriesModel,
+                    thisDim: dimNames.name,
+                    otherDim: otherDim,
+                    otherAxisInverse: otherAxisInverse
+                };
+
+            }, this);
+
+        }, this);
+
+        return result;
+    },
+
+    _renderHandle: function () {
+        var displaybles = this._displayables;
+        var handles = displaybles.handles = [];
+        var handleLabels = displaybles.handleLabels = [];
+        var barGroup = this._displayables.barGroup;
+        var size = this._size;
+        var dataZoomModel = this.dataZoomModel;
+
+        barGroup.add(displaybles.filler = new Rect$2({
+            draggable: true,
+            cursor: getCursor(this._orient),
+            drift: bind$4(this._onDragMove, this, 'all'),
+            onmousemove: function (e) {
+                // Fot mobile devicem, prevent screen slider on the button.
+                stop(e.event);
+            },
+            ondragstart: bind$4(this._showDataInfo, this, true),
+            ondragend: bind$4(this._onDragEnd, this),
+            onmouseover: bind$4(this._showDataInfo, this, true),
+            onmouseout: bind$4(this._showDataInfo, this, false),
+            style: {
+                fill: dataZoomModel.get('fillerColor'),
+                textPosition : 'inside'
+            }
+        }));
+
+        // Frame border.
+        barGroup.add(new Rect$2(subPixelOptimizeRect({
+            silent: true,
+            shape: {
+                x: 0,
+                y: 0,
+                width: size[0],
+                height: size[1]
+            },
+            style: {
+                stroke: dataZoomModel.get('dataBackgroundColor')
+                    || dataZoomModel.get('borderColor'),
+                lineWidth: DEFAULT_FRAME_BORDER_WIDTH,
+                fill: 'rgba(0,0,0,0)'
+            }
+        })));
+
+        each$23([0, 1], function (handleIndex) {
+            var path = createIcon(
+                dataZoomModel.get('handleIcon'),
+                {
+                    cursor: getCursor(this._orient),
+                    draggable: true,
+                    drift: bind$4(this._onDragMove, this, handleIndex),
+                    onmousemove: function (e) {
+                        // Fot mobile devicem, prevent screen slider on the button.
+                        stop(e.event);
+                    },
+                    ondragend: bind$4(this._onDragEnd, this),
+                    onmouseover: bind$4(this._showDataInfo, this, true),
+                    onmouseout: bind$4(this._showDataInfo, this, false)
+                },
+                {x: -1, y: 0, width: 2, height: 2}
+            );
+
+            var bRect = path.getBoundingRect();
+            this._handleHeight = parsePercent$1(dataZoomModel.get('handleSize'), this._size[1]);
+            this._handleWidth = bRect.width / bRect.height * this._handleHeight;
+
+            path.setStyle(dataZoomModel.getModel('handleStyle').getItemStyle());
+            var handleColor = dataZoomModel.get('handleColor');
+            // Compatitable with previous version
+            if (handleColor != null) {
+                path.style.fill = handleColor;
+            }
+
+            barGroup.add(handles[handleIndex] = path);
+
+            var textStyleModel = dataZoomModel.textStyleModel;
+
+            this.group.add(
+                handleLabels[handleIndex] = new Text({
+                silent: true,
+                invisible: true,
+                style: {
+                    x: 0, y: 0, text: '',
+                    textVerticalAlign: 'middle',
+                    textAlign: 'center',
+                    textFill: textStyleModel.getTextColor(),
+                    textFont: textStyleModel.getFont()
+                },
+                z2: 10
+            }));
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _resetInterval: function () {
+        var range = this._range = this.dataZoomModel.getPercentRange();
+        var viewExtent = this._getViewExtent();
+
+        this._handleEnds = [
+            linearMap$1(range[0], [0, 100], viewExtent, true),
+            linearMap$1(range[1], [0, 100], viewExtent, true)
+        ];
+    },
+
+    /**
+     * @private
+     * @param {(number|string)} handleIndex 0 or 1 or 'all'
+     * @param {number} delta
+     * @return {boolean} changed
+     */
+    _updateInterval: function (handleIndex, delta) {
+        var dataZoomModel = this.dataZoomModel;
+        var handleEnds = this._handleEnds;
+        var viewExtend = this._getViewExtent();
+        var minMaxSpan = dataZoomModel.findRepresentativeAxisProxy().getMinMaxSpan();
+        var percentExtent = [0, 100];
+
+        sliderMove(
+            delta,
+            handleEnds,
+            viewExtend,
+            dataZoomModel.get('zoomLock') ? 'all' : handleIndex,
+            minMaxSpan.minSpan != null
+                ? linearMap$1(minMaxSpan.minSpan, percentExtent, viewExtend, true) : null,
+            minMaxSpan.maxSpan != null
+                ? linearMap$1(minMaxSpan.maxSpan, percentExtent, viewExtend, true) : null
+        );
+
+        var lastRange = this._range;
+        var range = this._range = asc$2([
+            linearMap$1(handleEnds[0], viewExtend, percentExtent, true),
+            linearMap$1(handleEnds[1], viewExtend, percentExtent, true)
+        ]);
+
+        return !lastRange || lastRange[0] !== range[0] || lastRange[1] !== range[1];
+    },
+
+    /**
+     * @private
+     */
+    _updateView: function (nonRealtime) {
+        var displaybles = this._displayables;
+        var handleEnds = this._handleEnds;
+        var handleInterval = asc$2(handleEnds.slice());
+        var size = this._size;
+
+        each$23([0, 1], function (handleIndex) {
+            // Handles
+            var handle = displaybles.handles[handleIndex];
+            var handleHeight = this._handleHeight;
+            handle.attr({
+                scale: [handleHeight / 2, handleHeight / 2],
+                position: [handleEnds[handleIndex], size[1] / 2 - handleHeight / 2]
+            });
+        }, this);
+
+        // Filler
+        displaybles.filler.setShape({
+            x: handleInterval[0],
+            y: 0,
+            width: handleInterval[1] - handleInterval[0],
+            height: size[1]
+        });
+
+        this._updateDataInfo(nonRealtime);
+    },
+
+    /**
+     * @private
+     */
+    _updateDataInfo: function (nonRealtime) {
+        var dataZoomModel = this.dataZoomModel;
+        var displaybles = this._displayables;
+        var handleLabels = displaybles.handleLabels;
+        var orient = this._orient;
+        var labelTexts = ['', ''];
+
+        // FIXME
+        // date型，支持formatter，autoformatter（ec2 date.getAutoFormatter）
+        if (dataZoomModel.get('showDetail')) {
+            var axisProxy = dataZoomModel.findRepresentativeAxisProxy();
+
+            if (axisProxy) {
+                var axis = axisProxy.getAxisModel().axis;
+                var range = this._range;
+
+                var dataInterval = nonRealtime
+                    // See #4434, data and axis are not processed and reset yet in non-realtime mode.
+                    ? axisProxy.calculateDataWindow({
+                        start: range[0], end: range[1]
+                    }).valueWindow
+                    : axisProxy.getDataValueWindow();
+
+                labelTexts = [
+                    this._formatLabel(dataInterval[0], axis),
+                    this._formatLabel(dataInterval[1], axis)
+                ];
+            }
+        }
+
+        var orderedHandleEnds = asc$2(this._handleEnds.slice());
+
+        setLabel.call(this, 0);
+        setLabel.call(this, 1);
+
+        function setLabel(handleIndex) {
+            // Label
+            // Text should not transform by barGroup.
+            // Ignore handlers transform
+            var barTransform = getTransform(
+                displaybles.handles[handleIndex].parent, this.group
+            );
+            var direction = transformDirection(
+                handleIndex === 0 ? 'right' : 'left', barTransform
+            );
+            var offset = this._handleWidth / 2 + LABEL_GAP;
+            var textPoint = applyTransform$1(
+                [
+                    orderedHandleEnds[handleIndex] + (handleIndex === 0 ? -offset : offset),
+                    this._size[1] / 2
+                ],
+                barTransform
+            );
+            handleLabels[handleIndex].setStyle({
+                x: textPoint[0],
+                y: textPoint[1],
+                textVerticalAlign: orient === HORIZONTAL ? 'middle' : direction,
+                textAlign: orient === HORIZONTAL ? direction : 'center',
+                text: labelTexts[handleIndex]
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _formatLabel: function (value, axis) {
+        var dataZoomModel = this.dataZoomModel;
+        var labelFormatter = dataZoomModel.get('labelFormatter');
+
+        var labelPrecision = dataZoomModel.get('labelPrecision');
+        if (labelPrecision == null || labelPrecision === 'auto') {
+            labelPrecision = axis.getPixelPrecision();
+        }
+
+        var valueStr = (value == null || isNaN(value))
+            ? ''
+            // FIXME Glue code
+            : (axis.type === 'category' || axis.type === 'time')
+                ? axis.scale.getLabel(Math.round(value))
+                // param of toFixed should less then 20.
+                : value.toFixed(Math.min(labelPrecision, 20));
+
+        return isFunction$1(labelFormatter)
+            ? labelFormatter(value, valueStr)
+            : isString(labelFormatter)
+            ? labelFormatter.replace('{value}', valueStr)
+            : valueStr;
+    },
+
+    /**
+     * @private
+     * @param {boolean} showOrHide true: show, false: hide
+     */
+    _showDataInfo: function (showOrHide) {
+        // Always show when drgging.
+        showOrHide = this._dragging || showOrHide;
+
+        var handleLabels = this._displayables.handleLabels;
+        handleLabels[0].attr('invisible', !showOrHide);
+        handleLabels[1].attr('invisible', !showOrHide);
+    },
+
+    _onDragMove: function (handleIndex, dx, dy) {
+        this._dragging = true;
+
+        // Transform dx, dy to bar coordination.
+        var barTransform = this._displayables.barGroup.getLocalTransform();
+        var vertex = applyTransform$1([dx, dy], barTransform, true);
+
+        var changed = this._updateInterval(handleIndex, vertex[0]);
+
+        var realtime = this.dataZoomModel.get('realtime');
+
+        this._updateView(!realtime);
+
+        // Avoid dispatch dataZoom repeatly but range not changed,
+        // which cause bad visual effect when progressive enabled.
+        changed && realtime && this._dispatchZoomAction();
+    },
+
+    _onDragEnd: function () {
+        this._dragging = false;
+        this._showDataInfo(false);
+
+        // While in realtime mode and stream mode, dispatch action when
+        // drag end will cause the whole view rerender, which is unnecessary.
+        var realtime = this.dataZoomModel.get('realtime');
+        !realtime && this._dispatchZoomAction();
+    },
+
+    _onClickPanelClick: function (e) {
+        var size = this._size;
+        var localPoint = this._displayables.barGroup.transformCoordToLocal(e.offsetX, e.offsetY);
+
+        if (localPoint[0] < 0 || localPoint[0] > size[0]
+            || localPoint[1] < 0 || localPoint[1] > size[1]
+        ) {
+            return;
+        }
+
+        var handleEnds = this._handleEnds;
+        var center = (handleEnds[0] + handleEnds[1]) / 2;
+
+        var changed = this._updateInterval('all', localPoint[0] - center);
+        this._updateView();
+        changed && this._dispatchZoomAction();
+    },
+
+    /**
+     * This action will be throttled.
+     * @private
+     */
+    _dispatchZoomAction: function () {
+        var range = this._range;
+
+        this.api.dispatchAction({
+            type: 'dataZoom',
+            from: this.uid,
+            dataZoomId: this.dataZoomModel.id,
+            start: range[0],
+            end: range[1]
+        });
+    },
+
+    /**
+     * @private
+     */
+    _findCoordRect: function () {
+        // Find the grid coresponding to the first axis referred by dataZoom.
+        var rect;
+        each$23(this.getTargetCoordInfo(), function (coordInfoList) {
+            if (!rect && coordInfoList.length) {
+                var coordSys = coordInfoList[0].model.coordinateSystem;
+                rect = coordSys.getRect && coordSys.getRect();
+            }
+        });
+        if (!rect) {
+            var width = this.api.getWidth();
+            var height = this.api.getHeight();
+            rect = {
+                x: width * 0.2,
+                y: height * 0.2,
+                width: width * 0.6,
+                height: height * 0.6
+            };
+        }
+
+        return rect;
+    }
+
+});
+
+function getOtherDim(thisDim) {
+    // FIXME
+    // 这个逻辑和getOtherAxis里一致，但是写在这里是否不好
+    var map$$1 = {x: 'y', y: 'x', radius: 'angle', angle: 'radius'};
+    return map$$1[thisDim];
+}
+
+function getCursor(orient) {
+    return orient === 'vertical' ? 'ns-resize' : 'ew-resize';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+DataZoomModel.extend({
+
+    type: 'dataZoom.inside',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        disabled: false,   // Whether disable this inside zoom.
+        zoomLock: false,   // Whether disable zoom but only pan.
+        zoomOnMouseWheel: true, // Can be: true / false / 'shift' / 'ctrl' / 'alt'.
+        moveOnMouseMove: true,   // Can be: true / false / 'shift' / 'ctrl' / 'alt'.
+        preventDefaultMouseMove: true
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Only create one roam controller for each coordinate system.
+// one roam controller might be refered by two inside data zoom
+// components (for example, one for x and one for y). When user
+// pan or zoom, only dispatch one action for those data zoom
+// components.
+
+var curry$6 = curry;
+
+var ATTR$1 = '\0_ec_dataZoom_roams';
+
+
+/**
+ * @public
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Object} dataZoomInfo
+ * @param {string} dataZoomInfo.coordId
+ * @param {Function} dataZoomInfo.containsPoint
+ * @param {Array.<string>} dataZoomInfo.allCoordIds
+ * @param {string} dataZoomInfo.dataZoomId
+ * @param {number} dataZoomInfo.throttleRate
+ * @param {Function} dataZoomInfo.panGetRange
+ * @param {Function} dataZoomInfo.zoomGetRange
+ * @param {boolean} [dataZoomInfo.zoomLock]
+ * @param {boolean} [dataZoomInfo.disabled]
+ */
+function register$2(api, dataZoomInfo) {
+    var store = giveStore(api);
+    var theDataZoomId = dataZoomInfo.dataZoomId;
+    var theCoordId = dataZoomInfo.coordId;
+
+    // Do clean when a dataZoom changes its target coordnate system.
+    // Avoid memory leak, dispose all not-used-registered.
+    each$1(store, function (record, coordId) {
+        var dataZoomInfos = record.dataZoomInfos;
+        if (dataZoomInfos[theDataZoomId]
+            && indexOf(dataZoomInfo.allCoordIds, theCoordId) < 0
+        ) {
+            delete dataZoomInfos[theDataZoomId];
+            record.count--;
+        }
+    });
+
+    cleanStore(store);
+
+    var record = store[theCoordId];
+    // Create if needed.
+    if (!record) {
+        record = store[theCoordId] = {
+            coordId: theCoordId,
+            dataZoomInfos: {},
+            count: 0
+        };
+        record.controller = createController(api, record);
+        record.dispatchAction = curry(dispatchAction$1, api);
+    }
+
+    // Update reference of dataZoom.
+    !(record.dataZoomInfos[theDataZoomId]) && record.count++;
+    record.dataZoomInfos[theDataZoomId] = dataZoomInfo;
+
+    var controllerParams = mergeControllerParams(record.dataZoomInfos);
+    record.controller.enable(controllerParams.controlType, controllerParams.opt);
+
+    // Consider resize, area should be always updated.
+    record.controller.setPointerChecker(dataZoomInfo.containsPoint);
+
+    // Update throttle.
+    createOrUpdate(
+        record,
+        'dispatchAction',
+        dataZoomInfo.throttleRate,
+        'fixRate'
+    );
+}
+
+/**
+ * @public
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {string} dataZoomId
+ */
+function unregister$1(api, dataZoomId) {
+    var store = giveStore(api);
+
+    each$1(store, function (record) {
+        record.controller.dispose();
+        var dataZoomInfos = record.dataZoomInfos;
+        if (dataZoomInfos[dataZoomId]) {
+            delete dataZoomInfos[dataZoomId];
+            record.count--;
+        }
+    });
+
+    cleanStore(store);
+}
+
+/**
+ * @public
+ */
+function generateCoordId(coordModel) {
+    return coordModel.type + '\0_' + coordModel.id;
+}
+
+/**
+ * Key: coordId, value: {dataZoomInfos: [], count, controller}
+ * @type {Array.<Object>}
+ */
+function giveStore(api) {
+    // Mount store on zrender instance, so that we do not
+    // need to worry about dispose.
+    var zr = api.getZr();
+    return zr[ATTR$1] || (zr[ATTR$1] = {});
+}
+
+function createController(api, newRecord) {
+    var controller = new RoamController(api.getZr());
+    controller.on('pan', curry$6(onPan, newRecord));
+    controller.on('zoom', curry$6(onZoom, newRecord));
+
+    return controller;
+}
+
+function cleanStore(store) {
+    each$1(store, function (record, coordId) {
+        if (!record.count) {
+            record.controller.dispose();
+            delete store[coordId];
+        }
+    });
+}
+
+function onPan(record, dx, dy, oldX, oldY, newX, newY) {
+    wrapAndDispatch(record, function (info) {
+        return info.panGetRange(record.controller, dx, dy, oldX, oldY, newX, newY);
+    });
+}
+
+function onZoom(record, scale, mouseX, mouseY) {
+    wrapAndDispatch(record, function (info) {
+        return info.zoomGetRange(record.controller, scale, mouseX, mouseY);
+    });
+}
+
+function wrapAndDispatch(record, getRange) {
+    var batch = [];
+
+    each$1(record.dataZoomInfos, function (info) {
+        var range = getRange(info);
+        !info.disabled && range && batch.push({
+            dataZoomId: info.dataZoomId,
+            start: range[0],
+            end: range[1]
+        });
+    });
+
+    batch.length && record.dispatchAction(batch);
+}
+
+/**
+ * This action will be throttled.
+ */
+function dispatchAction$1(api, batch) {
+    api.dispatchAction({
+        type: 'dataZoom',
+        batch: batch
+    });
+}
+
+/**
+ * Merge roamController settings when multiple dataZooms share one roamController.
+ */
+function mergeControllerParams(dataZoomInfos) {
+    var controlType;
+    var opt = {};
+    // DO NOT use reserved word (true, false, undefined) as key literally. Even if encapsulated
+    // as string, it is probably revert to reserved word by compress tool. See #7411.
+    var prefix = 'type_';
+    var typePriority = {
+        'type_true': 2,
+        'type_move': 1,
+        'type_false': 0,
+        'type_undefined': -1
+    };
+    each$1(dataZoomInfos, function (dataZoomInfo) {
+        var oneType = dataZoomInfo.disabled ? false : dataZoomInfo.zoomLock ? 'move' : true;
+        if (typePriority[prefix + oneType] > typePriority[prefix + controlType]) {
+            controlType = oneType;
+        }
+        // Do not support that different 'shift'/'ctrl'/'alt' setting used in one coord sys.
+        extend(opt, dataZoomInfo.roamControllerOpt);
+    });
+
+    return {
+        controlType: controlType,
+        opt: opt
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$5 = bind;
+
+var InsideZoomView = DataZoomView.extend({
+
+    type: 'dataZoom.inside',
+
+    /**
+     * @override
+     */
+    init: function (ecModel, api) {
+        /**
+         * 'throttle' is used in this.dispatchAction, so we save range
+         * to avoid missing some 'pan' info.
+         * @private
+         * @type {Array.<number>}
+         */
+        this._range;
+    },
+
+    /**
+     * @override
+     */
+    render: function (dataZoomModel, ecModel, api, payload) {
+        InsideZoomView.superApply(this, 'render', arguments);
+
+        // Hance the `throttle` util ensures to preserve command order,
+        // here simply updating range all the time will not cause missing
+        // any of the the roam change.
+        this._range = dataZoomModel.getPercentRange();
+
+        // Reset controllers.
+        each$1(this.getTargetCoordInfo(), function (coordInfoList, coordSysName) {
+
+            var allCoordIds = map(coordInfoList, function (coordInfo) {
+                return generateCoordId(coordInfo.model);
+            });
+
+            each$1(coordInfoList, function (coordInfo) {
+                var coordModel = coordInfo.model;
+                var dataZoomOption = dataZoomModel.option;
+
+                register$2(
+                    api,
+                    {
+                        coordId: generateCoordId(coordModel),
+                        allCoordIds: allCoordIds,
+                        containsPoint: function (e, x, y) {
+                            return coordModel.coordinateSystem.containPoint([x, y]);
+                        },
+                        dataZoomId: dataZoomModel.id,
+                        throttleRate: dataZoomModel.get('throttle', true),
+                        panGetRange: bind$5(this._onPan, this, coordInfo, coordSysName),
+                        zoomGetRange: bind$5(this._onZoom, this, coordInfo, coordSysName),
+                        zoomLock: dataZoomOption.zoomLock,
+                        disabled: dataZoomOption.disabled,
+                        roamControllerOpt: {
+                            zoomOnMouseWheel: dataZoomOption.zoomOnMouseWheel,
+                            moveOnMouseMove: dataZoomOption.moveOnMouseMove,
+                            preventDefaultMouseMove: dataZoomOption.preventDefaultMouseMove
+                        }
+                    }
+                );
+            }, this);
+
+        }, this);
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        unregister$1(this.api, this.dataZoomModel.id);
+        InsideZoomView.superApply(this, 'dispose', arguments);
+        this._range = null;
+    },
+
+    /**
+     * @private
+     */
+    _onPan: function (coordInfo, coordSysName, controller, dx, dy, oldX, oldY, newX, newY) {
+        var lastRange = this._range;
+        var range = lastRange.slice();
+
+        // Calculate transform by the first axis.
+        var axisModel = coordInfo.axisModels[0];
+        if (!axisModel) {
+            return;
+        }
+
+        var directionInfo = getDirectionInfo[coordSysName](
+            [oldX, oldY], [newX, newY], axisModel, controller, coordInfo
+        );
+
+        var percentDelta = directionInfo.signal
+            * (range[1] - range[0])
+            * directionInfo.pixel / directionInfo.pixelLength;
+
+        sliderMove(percentDelta, range, [0, 100], 'all');
+
+        this._range = range;
+
+        if (lastRange[0] !== range[0] || lastRange[1] !== range[1]) {
+            return range;
+        }
+    },
+
+    /**
+     * @private
+     */
+    _onZoom: function (coordInfo, coordSysName, controller, scale, mouseX, mouseY) {
+        var lastRange = this._range;
+        var range = lastRange.slice();
+
+        // Calculate transform by the first axis.
+        var axisModel = coordInfo.axisModels[0];
+        if (!axisModel) {
+            return;
+        }
+
+        var directionInfo = getDirectionInfo[coordSysName](
+            null, [mouseX, mouseY], axisModel, controller, coordInfo
+        );
+        var percentPoint = (
+            directionInfo.signal > 0
+                ? (directionInfo.pixelStart + directionInfo.pixelLength - directionInfo.pixel)
+                : (directionInfo.pixel - directionInfo.pixelStart)
+            ) / directionInfo.pixelLength * (range[1] - range[0]) + range[0];
+
+        scale = Math.max(1 / scale, 0);
+        range[0] = (range[0] - percentPoint) * scale + percentPoint;
+        range[1] = (range[1] - percentPoint) * scale + percentPoint;
+
+        // Restrict range.
+        var minMaxSpan = this.dataZoomModel.findRepresentativeAxisProxy().getMinMaxSpan();
+
+        sliderMove(0, range, [0, 100], 0, minMaxSpan.minSpan, minMaxSpan.maxSpan);
+
+        this._range = range;
+
+        if (lastRange[0] !== range[0] || lastRange[1] !== range[1]) {
+            return range;
+        }
+    }
+
+});
+
+var getDirectionInfo = {
+
+    grid: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
+        var axis = axisModel.axis;
+        var ret = {};
+        var rect = coordInfo.model.coordinateSystem.getRect();
+        oldPoint = oldPoint || [0, 0];
+
+        if (axis.dim === 'x') {
+            ret.pixel = newPoint[0] - oldPoint[0];
+            ret.pixelLength = rect.width;
+            ret.pixelStart = rect.x;
+            ret.signal = axis.inverse ? 1 : -1;
+        }
+        else { // axis.dim === 'y'
+            ret.pixel = newPoint[1] - oldPoint[1];
+            ret.pixelLength = rect.height;
+            ret.pixelStart = rect.y;
+            ret.signal = axis.inverse ? -1 : 1;
+        }
+
+        return ret;
+    },
+
+    polar: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
+        var axis = axisModel.axis;
+        var ret = {};
+        var polar = coordInfo.model.coordinateSystem;
+        var radiusExtent = polar.getRadiusAxis().getExtent();
+        var angleExtent = polar.getAngleAxis().getExtent();
+
+        oldPoint = oldPoint ? polar.pointToCoord(oldPoint) : [0, 0];
+        newPoint = polar.pointToCoord(newPoint);
+
+        if (axisModel.mainType === 'radiusAxis') {
+            ret.pixel = newPoint[0] - oldPoint[0];
+            // ret.pixelLength = Math.abs(radiusExtent[1] - radiusExtent[0]);
+            // ret.pixelStart = Math.min(radiusExtent[0], radiusExtent[1]);
+            ret.pixelLength = radiusExtent[1] - radiusExtent[0];
+            ret.pixelStart = radiusExtent[0];
+            ret.signal = axis.inverse ? 1 : -1;
+        }
+        else { // 'angleAxis'
+            ret.pixel = newPoint[1] - oldPoint[1];
+            // ret.pixelLength = Math.abs(angleExtent[1] - angleExtent[0]);
+            // ret.pixelStart = Math.min(angleExtent[0], angleExtent[1]);
+            ret.pixelLength = angleExtent[1] - angleExtent[0];
+            ret.pixelStart = angleExtent[0];
+            ret.signal = axis.inverse ? -1 : 1;
+        }
+
+        return ret;
+    },
+
+    singleAxis: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
+        var axis = axisModel.axis;
+        var rect = coordInfo.model.coordinateSystem.getRect();
+        var ret = {};
+
+        oldPoint = oldPoint || [0, 0];
+
+        if (axis.orient === 'horizontal') {
+            ret.pixel = newPoint[0] - oldPoint[0];
+            ret.pixelLength = rect.width;
+            ret.pixelStart = rect.x;
+            ret.signal = axis.inverse ? 1 : -1;
+        }
+        else { // 'vertical'
+            ret.pixel = newPoint[1] - oldPoint[1];
+            ret.pixelLength = rect.height;
+            ret.pixelStart = rect.y;
+            ret.signal = axis.inverse ? -1 : 1;
+        }
+
+        return ret;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerProcessor({
+
+    // `dataZoomProcessor` will only be performed in needed series. Consider if
+    // there is a line series and a pie series, it is better not to update the
+    // line series if only pie series is needed to be updated.
+    getTargetSeries: function (ecModel) {
+        var seriesModelMap = createHashMap();
+
+        ecModel.eachComponent('dataZoom', function (dataZoomModel) {
+            dataZoomModel.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel) {
+                var axisProxy = dataZoomModel.getAxisProxy(dimNames.name, axisIndex);
+                each$1(axisProxy.getTargetSeriesModels(), function (seriesModel) {
+                    seriesModelMap.set(seriesModel.uid, seriesModel);
+                });
+            });
+        });
+
+        return seriesModelMap;
+    },
+
+    modifyOutputEnd: true,
+
+    // Consider appendData, where filter should be performed. Because data process is
+    // in block mode currently, it is not need to worry about that the overallProgress
+    // execute every frame.
+    overallReset: function (ecModel, api) {
+
+        ecModel.eachComponent('dataZoom', function (dataZoomModel) {
+            // We calculate window and reset axis here but not in model
+            // init stage and not after action dispatch handler, because
+            // reset should be called after seriesData.restoreData.
+            dataZoomModel.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel) {
+                dataZoomModel.getAxisProxy(dimNames.name, axisIndex).reset(dataZoomModel, api);
+            });
+
+            // Caution: data zoom filtering is order sensitive when using
+            // percent range and no min/max/scale set on axis.
+            // For example, we have dataZoom definition:
+            // [
+            //      {xAxisIndex: 0, start: 30, end: 70},
+            //      {yAxisIndex: 0, start: 20, end: 80}
+            // ]
+            // In this case, [20, 80] of y-dataZoom should be based on data
+            // that have filtered by x-dataZoom using range of [30, 70],
+            // but should not be based on full raw data. Thus sliding
+            // x-dataZoom will change both ranges of xAxis and yAxis,
+            // while sliding y-dataZoom will only change the range of yAxis.
+            // So we should filter x-axis after reset x-axis immediately,
+            // and then reset y-axis and filter y-axis.
+            dataZoomModel.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel) {
+                dataZoomModel.getAxisProxy(dimNames.name, axisIndex).filterData(dataZoomModel, api);
+            });
+        });
+
+        ecModel.eachComponent('dataZoom', function (dataZoomModel) {
+            // Fullfill all of the range props so that user
+            // is able to get them from chart.getOption().
+            var axisProxy = dataZoomModel.findRepresentativeAxisProxy();
+            var percentRange = axisProxy.getDataPercentWindow();
+            var valueRange = axisProxy.getDataValueWindow();
+
+            dataZoomModel.setRawRange({
+                start: percentRange[0],
+                end: percentRange[1],
+                startValue: valueRange[0],
+                endValue: valueRange[1]
+            }, true);
+        });
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction('dataZoom', function (payload, ecModel) {
+
+    var linkedNodesFinder = createLinkedNodesFinder(
+        bind(ecModel.eachComponent, ecModel, 'dataZoom'),
+        eachAxisDim$1,
+        function (model, dimNames) {
+            return model.get(dimNames.axisIndex);
+        }
+    );
+
+    var effectedModels = [];
+
+    ecModel.eachComponent(
+        {mainType: 'dataZoom', query: payload},
+        function (model, index) {
+            effectedModels.push.apply(
+                effectedModels, linkedNodesFinder(model).nodes
+            );
+        }
+    );
+
+    each$1(effectedModels, function (dataZoomModel, index) {
+        dataZoomModel.setRawRange({
+            start: payload.start,
+            end: payload.end,
+            startValue: payload.startValue,
+            endValue: payload.endValue
+        });
+    });
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$24 = each$1;
+
+var preprocessor$2 = function (option) {
+    var visualMap = option && option.visualMap;
+
+    if (!isArray(visualMap)) {
+        visualMap = visualMap ? [visualMap] : [];
+    }
+
+    each$24(visualMap, function (opt) {
+        if (!opt) {
+            return;
+        }
+
+        // rename splitList to pieces
+        if (has$1(opt, 'splitList') && !has$1(opt, 'pieces')) {
+            opt.pieces = opt.splitList;
+            delete opt.splitList;
+        }
+
+        var pieces = opt.pieces;
+        if (pieces && isArray(pieces)) {
+            each$24(pieces, function (piece) {
+                if (isObject$1(piece)) {
+                    if (has$1(piece, 'start') && !has$1(piece, 'min')) {
+                        piece.min = piece.start;
+                    }
+                    if (has$1(piece, 'end') && !has$1(piece, 'max')) {
+                        piece.max = piece.end;
+                    }
+                }
+            });
+        }
+    });
+};
+
+function has$1(obj, name) {
+    return obj && obj.hasOwnProperty && obj.hasOwnProperty(name);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.registerSubTypeDefaulter('visualMap', function (option) {
+    // Compatible with ec2, when splitNumber === 0, continuous visualMap will be used.
+    return (
+            !option.categories
+            && (
+                !(
+                    option.pieces
+                        ? option.pieces.length > 0
+                        : option.splitNumber > 0
+                )
+                || option.calculable
+            )
+        )
+        ? 'continuous' : 'piecewise';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var VISUAL_PRIORITY = PRIORITY.VISUAL.COMPONENT;
+
+registerVisual(VISUAL_PRIORITY, {
+    createOnAllSeries: true,
+    reset: function (seriesModel, ecModel) {
+        var resetDefines = [];
+        ecModel.eachComponent('visualMap', function (visualMapModel) {
+            var pipelineContext = seriesModel.pipelineContext;
+            if (!visualMapModel.isTargetSeries(seriesModel)
+                || (pipelineContext && pipelineContext.large)
+            ) {
+                return;
+            }
+
+            resetDefines.push(incrementalApplyVisual(
+                visualMapModel.stateList,
+                visualMapModel.targetVisuals,
+                bind(visualMapModel.getValueState, visualMapModel),
+                visualMapModel.getDataDimension(seriesModel.getData())
+            ));
+        });
+
+        return resetDefines;
+    }
+});
+
+// Only support color.
+registerVisual(VISUAL_PRIORITY, {
+    createOnAllSeries: true,
+    reset: function (seriesModel, ecModel) {
+        var data = seriesModel.getData();
+        var visualMetaList = [];
+
+        ecModel.eachComponent('visualMap', function (visualMapModel) {
+            if (visualMapModel.isTargetSeries(seriesModel)) {
+                var visualMeta = visualMapModel.getVisualMeta(
+                    bind(getColorVisual, null, seriesModel, visualMapModel)
+                ) || {stops: [], outerColors: []};
+
+                var concreteDim = visualMapModel.getDataDimension(data);
+                var dimInfo = data.getDimensionInfo(concreteDim);
+                if (dimInfo != null) {
+                    // visualMeta.dimension should be dimension index, but not concrete dimension.
+                    visualMeta.dimension = dimInfo.index;
+                    visualMetaList.push(visualMeta);
+                }
+            }
+        });
+
+        // console.log(JSON.stringify(visualMetaList.map(a => a.stops)));
+        seriesModel.getData().setVisual('visualMeta', visualMetaList);
+    }
+});
+
+// FIXME
+// performance and export for heatmap?
+// value can be Infinity or -Infinity
+function getColorVisual(seriesModel, visualMapModel, value, valueState) {
+    var mappings = visualMapModel.targetVisuals[valueState];
+    var visualTypes = VisualMapping.prepareVisualTypes(mappings);
+    var resultVisual = {
+        color: seriesModel.getData().getVisual('color') // default color.
+    };
+
+    for (var i = 0, len = visualTypes.length; i < len; i++) {
+        var type = visualTypes[i];
+        var mapping = mappings[
+            type === 'opacity' ? '__alphaForOpacity' : type
+        ];
+        mapping && mapping.applyVisual(value, getVisual, setVisual);
+    }
+
+    return resultVisual.color;
+
+    function getVisual(key) {
+        return resultVisual[key];
+    }
+
+    function setVisual(key, value) {
+        resultVisual[key] = value;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual mapping.
+ */
+
+var visualDefault = {
+
+    /**
+     * @public
+     */
+    get: function (visualType, key, isCategory) {
+        var value = clone(
+            (defaultOption$3[visualType] || {})[key]
+        );
+
+        return isCategory
+            ? (isArray(value) ? value[value.length - 1] : value)
+            : value;
+    }
+
+};
+
+var defaultOption$3 = {
+
+    color: {
+        active: ['#006edd', '#e0ffff'],
+        inactive: ['rgba(0,0,0,0)']
+    },
+
+    colorHue: {
+        active: [0, 360],
+        inactive: [0, 0]
+    },
+
+    colorSaturation: {
+        active: [0.3, 1],
+        inactive: [0, 0]
+    },
+
+    colorLightness: {
+        active: [0.9, 0.5],
+        inactive: [0, 0]
+    },
+
+    colorAlpha: {
+        active: [0.3, 1],
+        inactive: [0, 0]
+    },
+
+    opacity: {
+        active: [0.3, 1],
+        inactive: [0, 0]
+    },
+
+    symbol: {
+        active: ['circle', 'roundRect', 'diamond'],
+        inactive: ['none']
+    },
+
+    symbolSize: {
+        active: [10, 50],
+        inactive: [0, 0]
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var mapVisual$2 = VisualMapping.mapVisual;
+var eachVisual = VisualMapping.eachVisual;
+var isArray$3 = isArray;
+var each$25 = each$1;
+var asc$3 = asc;
+var linearMap$2 = linearMap;
+var noop$2 = noop;
+
+var VisualMapModel = extendComponentModel({
+
+    type: 'visualMap',
+
+    dependencies: ['series'],
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    stateList: ['inRange', 'outOfRange'],
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    replacableOptionKeys: [
+        'inRange', 'outOfRange', 'target', 'controller', 'color'
+    ],
+
+    /**
+     * [lowerBound, upperBound]
+     *
+     * @readOnly
+     * @type {Array.<number>}
+     */
+    dataBound: [-Infinity, Infinity],
+
+    /**
+     * @readOnly
+     * @type {string|Object}
+     */
+    layoutMode: {type: 'box', ignoreSize: true},
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        show: true,
+
+        zlevel: 0,
+        z: 4,
+
+        seriesIndex: 'all',     // 'all' or null/undefined: all series.
+                                // A number or an array of number: the specified series.
+
+                                // set min: 0, max: 200, only for campatible with ec2.
+                                // In fact min max should not have default value.
+        min: 0,                 // min value, must specified if pieces is not specified.
+        max: 200,               // max value, must specified if pieces is not specified.
+
+        dimension: null,
+        inRange: null,          // 'color', 'colorHue', 'colorSaturation', 'colorLightness', 'colorAlpha',
+                                // 'symbol', 'symbolSize'
+        outOfRange: null,       // 'color', 'colorHue', 'colorSaturation',
+                                // 'colorLightness', 'colorAlpha',
+                                // 'symbol', 'symbolSize'
+
+        left: 0,                // 'center' ¦ 'left' ¦ 'right' ¦ {number} (px)
+        right: null,            // The same as left.
+        top: null,              // 'top' ¦ 'bottom' ¦ 'center' ¦ {number} (px)
+        bottom: 0,              // The same as top.
+
+        itemWidth: null,
+        itemHeight: null,
+        inverse: false,
+        orient: 'vertical',        // 'horizontal' ¦ 'vertical'
+
+        backgroundColor: 'rgba(0,0,0,0)',
+        borderColor: '#ccc',       // 值域边框颜色
+        contentColor: '#5793f3',
+        inactiveColor: '#aaa',
+        borderWidth: 0,            // 值域边框线宽，单位px，默认为0（无边框）
+        padding: 5,                // 值域内边距，单位px，默认各方向内边距为5，
+                                    // 接受数组分别设定上右下左边距，同css
+        textGap: 10,               //
+        precision: 0,              // 小数精度，默认为0，无小数点
+        color: null,               //颜色（deprecated，兼容ec2，顺序同pieces，不同于inRange/outOfRange）
+
+        formatter: null,
+        text: null,                // 文本，如['高', '低']，兼容ec2，text[0]对应高值，text[1]对应低值
+        textStyle: {
+            color: '#333'          // 值域文字颜色
+        }
+    },
+
+    /**
+     * @protected
+     */
+    init: function (option, parentModel, ecModel) {
+
+        /**
+         * @private
+         * @type {Array.<number>}
+         */
+        this._dataExtent;
+
+        /**
+         * @readOnly
+         */
+        this.targetVisuals = {};
+
+        /**
+         * @readOnly
+         */
+        this.controllerVisuals = {};
+
+        /**
+         * @readOnly
+         */
+        this.textStyleModel;
+
+        /**
+         * [width, height]
+         * @readOnly
+         * @type {Array.<number>}
+         */
+        this.itemSize;
+
+        this.mergeDefaultAndTheme(option, ecModel);
+    },
+
+    /**
+     * @protected
+     */
+    optionUpdated: function (newOption, isInit) {
+        var thisOption = this.option;
+
+        // FIXME
+        // necessary?
+        // Disable realtime view update if canvas is not supported.
+        if (!env$1.canvasSupported) {
+            thisOption.realtime = false;
+        }
+
+        !isInit && replaceVisualOption(
+            thisOption, newOption, this.replacableOptionKeys
+        );
+
+        this.textStyleModel = this.getModel('textStyle');
+
+        this.resetItemSize();
+
+        this.completeVisualOption();
+    },
+
+    /**
+     * @protected
+     */
+    resetVisual: function (supplementVisualOption) {
+        var stateList = this.stateList;
+        supplementVisualOption = bind(supplementVisualOption, this);
+
+        this.controllerVisuals = createVisualMappings(
+            this.option.controller, stateList, supplementVisualOption
+        );
+        this.targetVisuals = createVisualMappings(
+            this.option.target, stateList, supplementVisualOption
+        );
+    },
+
+    /**
+     * @protected
+     * @return {Array.<number>} An array of series indices.
+     */
+    getTargetSeriesIndices: function () {
+        var optionSeriesIndex = this.option.seriesIndex;
+        var seriesIndices = [];
+
+        if (optionSeriesIndex == null || optionSeriesIndex === 'all') {
+            this.ecModel.eachSeries(function (seriesModel, index) {
+                seriesIndices.push(index);
+            });
+        }
+        else {
+            seriesIndices = normalizeToArray(optionSeriesIndex);
+        }
+
+        return seriesIndices;
+    },
+
+    /**
+     * @public
+     */
+    eachTargetSeries: function (callback, context) {
+        each$1(this.getTargetSeriesIndices(), function (seriesIndex) {
+            callback.call(context, this.ecModel.getSeriesByIndex(seriesIndex));
+        }, this);
+    },
+
+    /**
+     * @pubilc
+     */
+    isTargetSeries: function (seriesModel) {
+        var is = false;
+        this.eachTargetSeries(function (model) {
+            model === seriesModel && (is = true);
+        });
+        return is;
+    },
+
+    /**
+     * @example
+     * this.formatValueText(someVal); // format single numeric value to text.
+     * this.formatValueText(someVal, true); // format single category value to text.
+     * this.formatValueText([min, max]); // format numeric min-max to text.
+     * this.formatValueText([this.dataBound[0], max]); // using data lower bound.
+     * this.formatValueText([min, this.dataBound[1]]); // using data upper bound.
+     *
+     * @param {number|Array.<number>} value Real value, or this.dataBound[0 or 1].
+     * @param {boolean} [isCategory=false] Only available when value is number.
+     * @param {Array.<string>} edgeSymbols Open-close symbol when value is interval.
+     * @return {string}
+     * @protected
+     */
+    formatValueText: function(value, isCategory, edgeSymbols) {
+        var option = this.option;
+        var precision = option.precision;
+        var dataBound = this.dataBound;
+        var formatter = option.formatter;
+        var isMinMax;
+        var textValue;
+        edgeSymbols = edgeSymbols || ['<', '>'];
+
+        if (isArray(value)) {
+            value = value.slice();
+            isMinMax = true;
+        }
+
+        textValue = isCategory
+            ? value
+            : (isMinMax
+                ? [toFixed(value[0]), toFixed(value[1])]
+                : toFixed(value)
+            );
+
+        if (isString(formatter)) {
+            return formatter
+                .replace('{value}', isMinMax ? textValue[0] : textValue)
+                .replace('{value2}', isMinMax ? textValue[1] : textValue);
+        }
+        else if (isFunction$1(formatter)) {
+            return isMinMax
+                ? formatter(value[0], value[1])
+                : formatter(value);
+        }
+
+        if (isMinMax) {
+            if (value[0] === dataBound[0]) {
+                return edgeSymbols[0] + ' ' + textValue[1];
+            }
+            else if (value[1] === dataBound[1]) {
+                return edgeSymbols[1] + ' ' + textValue[0];
+            }
+            else {
+                return textValue[0] + ' - ' + textValue[1];
+            }
+        }
+        else { // Format single value (includes category case).
+            return textValue;
+        }
+
+        function toFixed(val) {
+            return val === dataBound[0]
+                ? 'min'
+                : val === dataBound[1]
+                ? 'max'
+                : (+val).toFixed(Math.min(precision, 20));
+        }
+    },
+
+    /**
+     * @protected
+     */
+    resetExtent: function () {
+        var thisOption = this.option;
+
+        // Can not calculate data extent by data here.
+        // Because series and data may be modified in processing stage.
+        // So we do not support the feature "auto min/max".
+
+        var extent = asc$3([thisOption.min, thisOption.max]);
+
+        this._dataExtent = extent;
+    },
+
+    /**
+     * @public
+     * @param {module:echarts/data/List} list
+     * @return {string} Concrete dimention. If return null/undefined,
+     *                  no dimension used.
+     */
+    getDataDimension: function (list) {
+        var optDim = this.option.dimension;
+        var listDimensions = list.dimensions;
+        if (optDim == null && !listDimensions.length) {
+            return;
+        }
+
+        if (optDim != null) {
+            return list.getDimension(optDim);
+        }
+
+        var dimNames = list.dimensions;
+        for (var i = dimNames.length - 1; i >= 0; i--) {
+            var dimName = dimNames[i];
+            var dimInfo = list.getDimensionInfo(dimName);
+            if (!dimInfo.isCalculationCoord) {
+                return dimName;
+            }
+        }
+    },
+
+    /**
+     * @public
+     * @override
+     */
+    getExtent: function () {
+        return this._dataExtent.slice();
+    },
+
+    /**
+     * @protected
+     */
+    completeVisualOption: function () {
+        var ecModel = this.ecModel;
+        var thisOption = this.option;
+        var base = {inRange: thisOption.inRange, outOfRange: thisOption.outOfRange};
+
+        var target = thisOption.target || (thisOption.target = {});
+        var controller = thisOption.controller || (thisOption.controller = {});
+
+        merge(target, base); // Do not override
+        merge(controller, base); // Do not override
+
+        var isCategory = this.isCategory();
+
+        completeSingle.call(this, target);
+        completeSingle.call(this, controller);
+        completeInactive.call(this, target, 'inRange', 'outOfRange');
+        // completeInactive.call(this, target, 'outOfRange', 'inRange');
+        completeController.call(this, controller);
+
+        function completeSingle(base) {
+            // Compatible with ec2 dataRange.color.
+            // The mapping order of dataRange.color is: [high value, ..., low value]
+            // whereas inRange.color and outOfRange.color is [low value, ..., high value]
+            // Notice: ec2 has no inverse.
+            if (isArray$3(thisOption.color)
+                // If there has been inRange: {symbol: ...}, adding color is a mistake.
+                // So adding color only when no inRange defined.
+                && !base.inRange
+            ) {
+                base.inRange = {color: thisOption.color.slice().reverse()};
+            }
+
+            // Compatible with previous logic, always give a defautl color, otherwise
+            // simple config with no inRange and outOfRange will not work.
+            // Originally we use visualMap.color as the default color, but setOption at
+            // the second time the default color will be erased. So we change to use
+            // constant DEFAULT_COLOR.
+            // If user do not want the defualt color, set inRange: {color: null}.
+            base.inRange = base.inRange || {color: ecModel.get('gradientColor')};
+
+            // If using shortcut like: {inRange: 'symbol'}, complete default value.
+            each$25(this.stateList, function (state) {
+                var visualType = base[state];
+
+                if (isString(visualType)) {
+                    var defa = visualDefault.get(visualType, 'active', isCategory);
+                    if (defa) {
+                        base[state] = {};
+                        base[state][visualType] = defa;
+                    }
+                    else {
+                        // Mark as not specified.
+                        delete base[state];
+                    }
+                }
+            }, this);
+        }
+
+        function completeInactive(base, stateExist, stateAbsent) {
+            var optExist = base[stateExist];
+            var optAbsent = base[stateAbsent];
+
+            if (optExist && !optAbsent) {
+                optAbsent = base[stateAbsent] = {};
+                each$25(optExist, function (visualData, visualType) {
+                    if (!VisualMapping.isValidType(visualType)) {
+                        return;
+                    }
+
+                    var defa = visualDefault.get(visualType, 'inactive', isCategory);
+
+                    if (defa != null) {
+                        optAbsent[visualType] = defa;
+
+                        // Compatibable with ec2:
+                        // Only inactive color to rgba(0,0,0,0) can not
+                        // make label transparent, so use opacity also.
+                        if (visualType === 'color'
+                            && !optAbsent.hasOwnProperty('opacity')
+                            && !optAbsent.hasOwnProperty('colorAlpha')
+                        ) {
+                            optAbsent.opacity = [0, 0];
+                        }
+                    }
+                });
+            }
+        }
+
+        function completeController(controller) {
+            var symbolExists = (controller.inRange || {}).symbol
+                || (controller.outOfRange || {}).symbol;
+            var symbolSizeExists = (controller.inRange || {}).symbolSize
+                || (controller.outOfRange || {}).symbolSize;
+            var inactiveColor = this.get('inactiveColor');
+
+            each$25(this.stateList, function (state) {
+
+                var itemSize = this.itemSize;
+                var visuals = controller[state];
+
+                // Set inactive color for controller if no other color
+                // attr (like colorAlpha) specified.
+                if (!visuals) {
+                    visuals = controller[state] = {
+                        color: isCategory ? inactiveColor : [inactiveColor]
+                    };
+                }
+
+                // Consistent symbol and symbolSize if not specified.
+                if (visuals.symbol == null) {
+                    visuals.symbol = symbolExists
+                        && clone(symbolExists)
+                        || (isCategory ? 'roundRect' : ['roundRect']);
+                }
+                if (visuals.symbolSize == null) {
+                    visuals.symbolSize = symbolSizeExists
+                        && clone(symbolSizeExists)
+                        || (isCategory ? itemSize[0] : [itemSize[0], itemSize[0]]);
+                }
+
+                // Filter square and none.
+                visuals.symbol = mapVisual$2(visuals.symbol, function (symbol) {
+                    return (symbol === 'none' || symbol === 'square') ? 'roundRect' : symbol;
+                });
+
+                // Normalize symbolSize
+                var symbolSize = visuals.symbolSize;
+
+                if (symbolSize != null) {
+                    var max = -Infinity;
+                    // symbolSize can be object when categories defined.
+                    eachVisual(symbolSize, function (value) {
+                        value > max && (max = value);
+                    });
+                    visuals.symbolSize = mapVisual$2(symbolSize, function (value) {
+                        return linearMap$2(value, [0, max], [0, itemSize[0]], true);
+                    });
+                }
+
+            }, this);
+        }
+    },
+
+    /**
+     * @protected
+     */
+    resetItemSize: function () {
+        this.itemSize = [
+            parseFloat(this.get('itemWidth')),
+            parseFloat(this.get('itemHeight'))
+        ];
+    },
+
+    /**
+     * @public
+     */
+    isCategory: function () {
+        return !!this.option.categories;
+    },
+
+    /**
+     * @public
+     * @abstract
+     */
+    setSelected: noop$2,
+
+    /**
+     * @public
+     * @abstract
+     * @param {*|module:echarts/data/List} valueOrData
+     * @param {number} dataIndex
+     * @return {string} state See this.stateList
+     */
+    getValueState: noop$2,
+
+    /**
+     * FIXME
+     * Do not publish to thirt-part-dev temporarily
+     * util the interface is stable. (Should it return
+     * a function but not visual meta?)
+     *
+     * @pubilc
+     * @abstract
+     * @param {Function} getColorVisual
+     *        params: value, valueState
+     *        return: color
+     * @return {Object} visualMeta
+     *        should includes {stops, outerColors}
+     *        outerColor means [colorBeyondMinValue, colorBeyondMaxValue]
+     */
+    getVisualMeta: noop$2
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Constant
+var DEFAULT_BAR_BOUND = [20, 140];
+
+var ContinuousModel = VisualMapModel.extend({
+
+    type: 'visualMap.continuous',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        align: 'auto',          // 'auto', 'left', 'right', 'top', 'bottom'
+        calculable: false,      // This prop effect default component type determine,
+                                // See echarts/component/visualMap/typeDefaulter.
+        range: null,            // selected range. In default case `range` is [min, max]
+                                // and can auto change along with modification of min max,
+                                // util use specifid a range.
+        realtime: true,         // Whether realtime update.
+        itemHeight: null,       // The length of the range control edge.
+        itemWidth: null,        // The length of the other side.
+        hoverLink: true,        // Enable hover highlight.
+        hoverLinkDataSize: null,// The size of hovered data.
+        hoverLinkOnHandle: null // Whether trigger hoverLink when hover handle.
+                                // If not specified, follow the value of `realtime`.
+    },
+
+    /**
+     * @override
+     */
+    optionUpdated: function (newOption, isInit) {
+        ContinuousModel.superApply(this, 'optionUpdated', arguments);
+
+        this.resetExtent();
+
+        this.resetVisual(function (mappingOption) {
+            mappingOption.mappingMethod = 'linear';
+            mappingOption.dataExtent = this.getExtent();
+        });
+
+        this._resetRange();
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    resetItemSize: function () {
+        ContinuousModel.superApply(this, 'resetItemSize', arguments);
+
+        var itemSize = this.itemSize;
+
+        this._orient === 'horizontal' && itemSize.reverse();
+
+        (itemSize[0] == null || isNaN(itemSize[0])) && (itemSize[0] = DEFAULT_BAR_BOUND[0]);
+        (itemSize[1] == null || isNaN(itemSize[1])) && (itemSize[1] = DEFAULT_BAR_BOUND[1]);
+    },
+
+    /**
+     * @private
+     */
+    _resetRange: function () {
+        var dataExtent = this.getExtent();
+        var range = this.option.range;
+
+        if (!range || range.auto) {
+            // `range` should always be array (so we dont use other
+            // value like 'auto') for user-friend. (consider getOption).
+            dataExtent.auto = 1;
+            this.option.range = dataExtent;
+        }
+        else if (isArray(range)) {
+            if (range[0] > range[1]) {
+                range.reverse();
+            }
+            range[0] = Math.max(range[0], dataExtent[0]);
+            range[1] = Math.min(range[1], dataExtent[1]);
+        }
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    completeVisualOption: function () {
+        VisualMapModel.prototype.completeVisualOption.apply(this, arguments);
+
+        each$1(this.stateList, function (state) {
+            var symbolSize = this.option.controller[state].symbolSize;
+            if (symbolSize && symbolSize[0] !== symbolSize[1]) {
+                symbolSize[0] = 0; // For good looking.
+            }
+        }, this);
+    },
+
+    /**
+     * @override
+     */
+    setSelected: function (selected) {
+        this.option.range = selected.slice();
+        this._resetRange();
+    },
+
+    /**
+     * @public
+     */
+    getSelected: function () {
+        var dataExtent = this.getExtent();
+
+        var dataInterval = asc(
+            (this.get('range') || []).slice()
+        );
+
+        // Clamp
+        dataInterval[0] > dataExtent[1] && (dataInterval[0] = dataExtent[1]);
+        dataInterval[1] > dataExtent[1] && (dataInterval[1] = dataExtent[1]);
+        dataInterval[0] < dataExtent[0] && (dataInterval[0] = dataExtent[0]);
+        dataInterval[1] < dataExtent[0] && (dataInterval[1] = dataExtent[0]);
+
+        return dataInterval;
+    },
+
+    /**
+     * @override
+     */
+    getValueState: function (value) {
+        var range = this.option.range;
+        var dataExtent = this.getExtent();
+
+        // When range[0] === dataExtent[0], any value larger than dataExtent[0] maps to 'inRange'.
+        // range[1] is processed likewise.
+        return (
+            (range[0] <= dataExtent[0] || range[0] <= value)
+            && (range[1] >= dataExtent[1] || value <= range[1])
+        ) ? 'inRange' : 'outOfRange';
+    },
+
+    /**
+     * @params {Array.<number>} range target value: range[0] <= value && value <= range[1]
+     * @return {Array.<Object>} [{seriesId, dataIndices: <Array.<number>>}, ...]
+     */
+    findTargetDataIndices: function (range) {
+        var result = [];
+
+        this.eachTargetSeries(function (seriesModel) {
+            var dataIndices = [];
+            var data = seriesModel.getData();
+
+            data.each(this.getDataDimension(data), function (value, dataIndex) {
+                range[0] <= value && value <= range[1] && dataIndices.push(dataIndex);
+            }, this);
+
+            result.push({seriesId: seriesModel.id, dataIndex: dataIndices});
+        }, this);
+
+        return result;
+    },
+
+    /**
+     * @implement
+     */
+    getVisualMeta: function (getColorVisual) {
+        var oVals = getColorStopValues(this, 'outOfRange', this.getExtent());
+        var iVals = getColorStopValues(this, 'inRange', this.option.range.slice());
+        var stops = [];
+
+        function setStop(value, valueState) {
+            stops.push({
+                value: value,
+                color: getColorVisual(value, valueState)
+            });
+        }
+
+        // Format to: outOfRange -- inRange -- outOfRange.
+        var iIdx = 0;
+        var oIdx = 0;
+        var iLen = iVals.length;
+        var oLen = oVals.length;
+
+        for (; oIdx < oLen && (!iVals.length || oVals[oIdx] <= iVals[0]); oIdx++) {
+            // If oVal[oIdx] === iVals[iIdx], oVal[oIdx] should be ignored.
+            if (oVals[oIdx] < iVals[iIdx]) {
+                setStop(oVals[oIdx], 'outOfRange');
+            }
+        }
+        for (var first = 1; iIdx < iLen; iIdx++, first = 0) {
+            // If range is full, value beyond min, max will be clamped.
+            // make a singularity
+            first && stops.length && setStop(iVals[iIdx], 'outOfRange');
+            setStop(iVals[iIdx], 'inRange');
+        }
+        for (var first = 1; oIdx < oLen; oIdx++) {
+            if (!iVals.length || iVals[iVals.length - 1] < oVals[oIdx]) {
+                // make a singularity
+                if (first) {
+                    stops.length && setStop(stops[stops.length - 1].value, 'outOfRange');
+                    first = 0;
+                }
+                setStop(oVals[oIdx], 'outOfRange');
+            }
+        }
+
+        var stopsLen = stops.length;
+
+        return {
+            stops: stops,
+            outerColors: [
+                stopsLen ? stops[0].color : 'transparent',
+                stopsLen ? stops[stopsLen - 1].color : 'transparent'
+            ]
+        };
+    }
+
+});
+
+function getColorStopValues(visualMapModel, valueState, dataExtent) {
+    if (dataExtent[0] === dataExtent[1]) {
+        return dataExtent.slice();
+    }
+
+    // When using colorHue mapping, it is not linear color any more.
+    // Moreover, canvas gradient seems not to be accurate linear.
+    // FIXME
+    // Should be arbitrary value 100? or based on pixel size?
+    var count = 200;
+    var step = (dataExtent[1] - dataExtent[0]) / count;
+
+    var value = dataExtent[0];
+    var stopValues = [];
+    for (var i = 0; i <= count && value < dataExtent[1]; i++) {
+        stopValues.push(value);
+        value += step;
+    }
+    stopValues.push(dataExtent[1]);
+
+    return stopValues;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var VisualMapView = extendComponentView({
+
+    type: 'visualMap',
+
+    /**
+     * @readOnly
+     * @type {Object}
+     */
+    autoPositionValues: {left: 1, right: 1, top: 1, bottom: 1},
+
+    init: function (ecModel, api) {
+        /**
+         * @readOnly
+         * @type {module:echarts/model/Global}
+         */
+        this.ecModel = ecModel;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/ExtensionAPI}
+         */
+        this.api = api;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/component/visualMap/visualMapModel}
+         */
+        this.visualMapModel;
+    },
+
+    /**
+     * @protected
+     */
+    render: function (visualMapModel, ecModel, api, payload) {
+        this.visualMapModel = visualMapModel;
+
+        if (visualMapModel.get('show') === false) {
+            this.group.removeAll();
+            return;
+        }
+
+        this.doRender.apply(this, arguments);
+    },
+
+    /**
+     * @protected
+     */
+    renderBackground: function (group) {
+        var visualMapModel = this.visualMapModel;
+        var padding = normalizeCssArray$1(visualMapModel.get('padding') || 0);
+        var rect = group.getBoundingRect();
+
+        group.add(new Rect({
+            z2: -1, // Lay background rect on the lowest layer.
+            silent: true,
+            shape: {
+                x: rect.x - padding[3],
+                y: rect.y - padding[0],
+                width: rect.width + padding[3] + padding[1],
+                height: rect.height + padding[0] + padding[2]
+            },
+            style: {
+                fill: visualMapModel.get('backgroundColor'),
+                stroke: visualMapModel.get('borderColor'),
+                lineWidth: visualMapModel.get('borderWidth')
+            }
+        }));
+    },
+
+    /**
+     * @protected
+     * @param {number} targetValue can be Infinity or -Infinity
+     * @param {string=} visualCluster Only can be 'color' 'opacity' 'symbol' 'symbolSize'
+     * @param {Object} [opts]
+     * @param {string=} [opts.forceState] Specify state, instead of using getValueState method.
+     * @param {string=} [opts.convertOpacityToAlpha=false] For color gradient in controller widget.
+     * @return {*} Visual value.
+     */
+    getControllerVisual: function (targetValue, visualCluster, opts) {
+        opts = opts || {};
+
+        var forceState = opts.forceState;
+        var visualMapModel = this.visualMapModel;
+        var visualObj = {};
+
+        // Default values.
+        if (visualCluster === 'symbol') {
+            visualObj.symbol = visualMapModel.get('itemSymbol');
+        }
+        if (visualCluster === 'color') {
+            var defaultColor = visualMapModel.get('contentColor');
+            visualObj.color = defaultColor;
+        }
+
+        function getter(key) {
+            return visualObj[key];
+        }
+
+        function setter(key, value) {
+            visualObj[key] = value;
+        }
+
+        var mappings = visualMapModel.controllerVisuals[
+            forceState || visualMapModel.getValueState(targetValue)
+        ];
+        var visualTypes = VisualMapping.prepareVisualTypes(mappings);
+
+        each$1(visualTypes, function (type) {
+            var visualMapping = mappings[type];
+            if (opts.convertOpacityToAlpha && type === 'opacity') {
+                type = 'colorAlpha';
+                visualMapping = mappings.__alphaForOpacity;
+            }
+            if (VisualMapping.dependsOn(type, visualCluster)) {
+                visualMapping && visualMapping.applyVisual(
+                    targetValue, getter, setter
+                );
+            }
+        });
+
+        return visualObj[visualCluster];
+    },
+
+    /**
+     * @protected
+     */
+    positionGroup: function (group) {
+        var model = this.visualMapModel;
+        var api = this.api;
+
+        positionElement(
+            group,
+            model.getBoxLayoutParams(),
+            {width: api.getWidth(), height: api.getHeight()}
+        );
+    },
+
+    /**
+     * @protected
+     * @abstract
+     */
+    doRender: noop
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/component/visualMap/VisualMapModel} visualMapModel\
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Array.<number>} itemSize always [short, long]
+ * @return {string} 'left' or 'right' or 'top' or 'bottom'
+ */
+function getItemAlign(visualMapModel, api, itemSize) {
+    var modelOption = visualMapModel.option;
+    var itemAlign = modelOption.align;
+
+    if (itemAlign != null && itemAlign !== 'auto') {
+        return itemAlign;
+    }
+
+    // Auto decision align.
+    var ecSize = {width: api.getWidth(), height: api.getHeight()};
+    var realIndex = modelOption.orient === 'horizontal' ? 1 : 0;
+
+    var paramsSet = [
+        ['left', 'right', 'width'],
+        ['top', 'bottom', 'height']
+    ];
+    var reals = paramsSet[realIndex];
+    var fakeValue = [0, null, 10];
+
+    var layoutInput = {};
+    for (var i = 0; i < 3; i++) {
+        layoutInput[paramsSet[1 - realIndex][i]] = fakeValue[i];
+        layoutInput[reals[i]] = i === 2 ? itemSize[0] : modelOption[reals[i]];
+    }
+
+    var rParam = [['x', 'width', 3], ['y', 'height', 0]][realIndex];
+    var rect = getLayoutRect(layoutInput, ecSize, modelOption.padding);
+
+    return reals[
+        (rect.margin[rParam[2]] || 0) + rect[rParam[0]] + rect[rParam[1]] * 0.5
+            < ecSize[rParam[1]] * 0.5 ? 0 : 1
+    ];
+}
+
+/**
+ * Prepare dataIndex for outside usage, where dataIndex means rawIndex, and
+ * dataIndexInside means filtered index.
+ */
+function convertDataIndex(batch) {
+    each$1(batch || [], function (batchItem) {
+        if (batch.dataIndex != null) {
+            batch.dataIndexInside = batch.dataIndex;
+            batch.dataIndex = null;
+        }
+    });
+    return batch;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var linearMap$3 = linearMap;
+var each$26 = each$1;
+var mathMin$7 = Math.min;
+var mathMax$7 = Math.max;
+
+// Arbitrary value
+var HOVER_LINK_SIZE = 12;
+var HOVER_LINK_OUT = 6;
+
+// Notice:
+// Any "interval" should be by the order of [low, high].
+// "handle0" (handleIndex === 0) maps to
+// low data value: this._dataInterval[0] and has low coord.
+// "handle1" (handleIndex === 1) maps to
+// high data value: this._dataInterval[1] and has high coord.
+// The logic of transform is implemented in this._createBarGroup.
+
+var ContinuousView = VisualMapView.extend({
+
+    type: 'visualMap.continuous',
+
+    /**
+     * @override
+     */
+    init: function () {
+
+        ContinuousView.superApply(this, 'init', arguments);
+
+        /**
+         * @private
+         */
+        this._shapes = {};
+
+        /**
+         * @private
+         */
+        this._dataInterval = [];
+
+        /**
+         * @private
+         */
+        this._handleEnds = [];
+
+        /**
+         * @private
+         */
+        this._orient;
+
+        /**
+         * @private
+         */
+        this._useHandle;
+
+        /**
+         * @private
+         */
+        this._hoverLinkDataIndices = [];
+
+        /**
+         * @private
+         */
+        this._dragging;
+
+        /**
+         * @private
+         */
+        this._hovering;
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    doRender: function (visualMapModel, ecModel, api, payload) {
+        if (!payload || payload.type !== 'selectDataRange' || payload.from !== this.uid) {
+            this._buildView();
+        }
+    },
+
+    /**
+     * @private
+     */
+    _buildView: function () {
+        this.group.removeAll();
+
+        var visualMapModel = this.visualMapModel;
+        var thisGroup = this.group;
+
+        this._orient = visualMapModel.get('orient');
+        this._useHandle = visualMapModel.get('calculable');
+
+        this._resetInterval();
+
+        this._renderBar(thisGroup);
+
+        var dataRangeText = visualMapModel.get('text');
+        this._renderEndsText(thisGroup, dataRangeText, 0);
+        this._renderEndsText(thisGroup, dataRangeText, 1);
+
+        // Do this for background size calculation.
+        this._updateView(true);
+
+        // After updating view, inner shapes is built completely,
+        // and then background can be rendered.
+        this.renderBackground(thisGroup);
+
+        // Real update view
+        this._updateView();
+
+        this._enableHoverLinkToSeries();
+        this._enableHoverLinkFromSeries();
+
+        this.positionGroup(thisGroup);
+    },
+
+    /**
+     * @private
+     */
+    _renderEndsText: function (group, dataRangeText, endsIndex) {
+        if (!dataRangeText) {
+            return;
+        }
+
+        // Compatible with ec2, text[0] map to high value, text[1] map low value.
+        var text = dataRangeText[1 - endsIndex];
+        text = text != null ? text + '' : '';
+
+        var visualMapModel = this.visualMapModel;
+        var textGap = visualMapModel.get('textGap');
+        var itemSize = visualMapModel.itemSize;
+
+        var barGroup = this._shapes.barGroup;
+        var position = this._applyTransform(
+            [
+                itemSize[0] / 2,
+                endsIndex === 0 ? -textGap : itemSize[1] + textGap
+            ],
+            barGroup
+        );
+        var align = this._applyTransform(
+            endsIndex === 0 ? 'bottom' : 'top',
+            barGroup
+        );
+        var orient = this._orient;
+        var textStyleModel = this.visualMapModel.textStyleModel;
+
+        this.group.add(new Text({
+            style: {
+                x: position[0],
+                y: position[1],
+                textVerticalAlign: orient === 'horizontal' ? 'middle' : align,
+                textAlign: orient === 'horizontal' ? align : 'center',
+                text: text,
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        }));
+    },
+
+    /**
+     * @private
+     */
+    _renderBar: function (targetGroup) {
+        var visualMapModel = this.visualMapModel;
+        var shapes = this._shapes;
+        var itemSize = visualMapModel.itemSize;
+        var orient = this._orient;
+        var useHandle = this._useHandle;
+        var itemAlign = getItemAlign(visualMapModel, this.api, itemSize);
+        var barGroup = shapes.barGroup = this._createBarGroup(itemAlign);
+
+        // Bar
+        barGroup.add(shapes.outOfRange = createPolygon());
+        barGroup.add(shapes.inRange = createPolygon(
+            null,
+            useHandle ? getCursor$1(this._orient) : null,
+            bind(this._dragHandle, this, 'all', false),
+            bind(this._dragHandle, this, 'all', true)
+        ));
+
+        var textRect = visualMapModel.textStyleModel.getTextRect('国');
+        var textSize = mathMax$7(textRect.width, textRect.height);
+
+        // Handle
+        if (useHandle) {
+            shapes.handleThumbs = [];
+            shapes.handleLabels = [];
+            shapes.handleLabelPoints = [];
+
+            this._createHandle(barGroup, 0, itemSize, textSize, orient, itemAlign);
+            this._createHandle(barGroup, 1, itemSize, textSize, orient, itemAlign);
+        }
+
+        this._createIndicator(barGroup, itemSize, textSize, orient);
+
+        targetGroup.add(barGroup);
+    },
+
+    /**
+     * @private
+     */
+    _createHandle: function (barGroup, handleIndex, itemSize, textSize, orient) {
+        var onDrift = bind(this._dragHandle, this, handleIndex, false);
+        var onDragEnd = bind(this._dragHandle, this, handleIndex, true);
+        var handleThumb = createPolygon(
+            createHandlePoints(handleIndex, textSize),
+            getCursor$1(this._orient),
+            onDrift,
+            onDragEnd
+        );
+        handleThumb.position[0] = itemSize[0];
+        barGroup.add(handleThumb);
+
+        // Text is always horizontal layout but should not be effected by
+        // transform (orient/inverse). So label is built separately but not
+        // use zrender/graphic/helper/RectText, and is located based on view
+        // group (according to handleLabelPoint) but not barGroup.
+        var textStyleModel = this.visualMapModel.textStyleModel;
+        var handleLabel = new Text({
+            draggable: true,
+            drift: onDrift,
+            onmousemove: function (e) {
+                // Fot mobile devicem, prevent screen slider on the button.
+                stop(e.event);
+            },
+            ondragend: onDragEnd,
+            style: {
+                x: 0, y: 0, text: '',
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        });
+        this.group.add(handleLabel);
+
+        var handleLabelPoint = [
+            orient === 'horizontal'
+                ? textSize / 2
+                : textSize * 1.5,
+            orient === 'horizontal'
+                ? (handleIndex === 0 ? -(textSize * 1.5) : (textSize * 1.5))
+                : (handleIndex === 0 ? -textSize / 2 : textSize / 2)
+        ];
+
+        var shapes = this._shapes;
+        shapes.handleThumbs[handleIndex] = handleThumb;
+        shapes.handleLabelPoints[handleIndex] = handleLabelPoint;
+        shapes.handleLabels[handleIndex] = handleLabel;
+    },
+
+    /**
+     * @private
+     */
+    _createIndicator: function (barGroup, itemSize, textSize, orient) {
+        var indicator = createPolygon([[0, 0]], 'move');
+        indicator.position[0] = itemSize[0];
+        indicator.attr({invisible: true, silent: true});
+        barGroup.add(indicator);
+
+        var textStyleModel = this.visualMapModel.textStyleModel;
+        var indicatorLabel = new Text({
+            silent: true,
+            invisible: true,
+            style: {
+                x: 0, y: 0, text: '',
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        });
+        this.group.add(indicatorLabel);
+
+        var indicatorLabelPoint = [
+            orient === 'horizontal' ? textSize / 2 : HOVER_LINK_OUT + 3,
+            0
+        ];
+
+        var shapes = this._shapes;
+        shapes.indicator = indicator;
+        shapes.indicatorLabel = indicatorLabel;
+        shapes.indicatorLabelPoint = indicatorLabelPoint;
+    },
+
+    /**
+     * @private
+     */
+    _dragHandle: function (handleIndex, isEnd, dx, dy) {
+        if (!this._useHandle) {
+            return;
+        }
+
+        this._dragging = !isEnd;
+
+        if (!isEnd) {
+            // Transform dx, dy to bar coordination.
+            var vertex = this._applyTransform([dx, dy], this._shapes.barGroup, true);
+            this._updateInterval(handleIndex, vertex[1]);
+
+            // Considering realtime, update view should be executed
+            // before dispatch action.
+            this._updateView();
+        }
+
+        // dragEnd do not dispatch action when realtime.
+        if (isEnd === !this.visualMapModel.get('realtime')) { // jshint ignore:line
+            this.api.dispatchAction({
+                type: 'selectDataRange',
+                from: this.uid,
+                visualMapId: this.visualMapModel.id,
+                selected: this._dataInterval.slice()
+            });
+        }
+
+        if (isEnd) {
+            !this._hovering && this._clearHoverLinkToSeries();
+        }
+        else if (useHoverLinkOnHandle(this.visualMapModel)) {
+            this._doHoverLinkToSeries(this._handleEnds[handleIndex], false);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _resetInterval: function () {
+        var visualMapModel = this.visualMapModel;
+
+        var dataInterval = this._dataInterval = visualMapModel.getSelected();
+        var dataExtent = visualMapModel.getExtent();
+        var sizeExtent = [0, visualMapModel.itemSize[1]];
+
+        this._handleEnds = [
+            linearMap$3(dataInterval[0], dataExtent, sizeExtent, true),
+            linearMap$3(dataInterval[1], dataExtent, sizeExtent, true)
+        ];
+    },
+
+    /**
+     * @private
+     * @param {(number|string)} handleIndex 0 or 1 or 'all'
+     * @param {number} dx
+     * @param {number} dy
+     */
+    _updateInterval: function (handleIndex, delta) {
+        delta = delta || 0;
+        var visualMapModel = this.visualMapModel;
+        var handleEnds = this._handleEnds;
+        var sizeExtent = [0, visualMapModel.itemSize[1]];
+
+        sliderMove(
+            delta,
+            handleEnds,
+            sizeExtent,
+            handleIndex,
+            // cross is forbiden
+            0
+        );
+
+        var dataExtent = visualMapModel.getExtent();
+        // Update data interval.
+        this._dataInterval = [
+            linearMap$3(handleEnds[0], sizeExtent, dataExtent, true),
+            linearMap$3(handleEnds[1], sizeExtent, dataExtent, true)
+        ];
+    },
+
+    /**
+     * @private
+     */
+    _updateView: function (forSketch) {
+        var visualMapModel = this.visualMapModel;
+        var dataExtent = visualMapModel.getExtent();
+        var shapes = this._shapes;
+
+        var outOfRangeHandleEnds = [0, visualMapModel.itemSize[1]];
+        var inRangeHandleEnds = forSketch ? outOfRangeHandleEnds : this._handleEnds;
+
+        var visualInRange = this._createBarVisual(
+            this._dataInterval, dataExtent, inRangeHandleEnds, 'inRange'
+        );
+        var visualOutOfRange = this._createBarVisual(
+            dataExtent, dataExtent, outOfRangeHandleEnds, 'outOfRange'
+        );
+
+        shapes.inRange
+            .setStyle({
+                fill: visualInRange.barColor,
+                opacity: visualInRange.opacity
+            })
+            .setShape('points', visualInRange.barPoints);
+        shapes.outOfRange
+            .setStyle({
+                fill: visualOutOfRange.barColor,
+                opacity: visualOutOfRange.opacity
+            })
+            .setShape('points', visualOutOfRange.barPoints);
+
+        this._updateHandle(inRangeHandleEnds, visualInRange);
+    },
+
+    /**
+     * @private
+     */
+    _createBarVisual: function (dataInterval, dataExtent, handleEnds, forceState) {
+        var opts = {
+            forceState: forceState,
+            convertOpacityToAlpha: true
+        };
+        var colorStops = this._makeColorGradient(dataInterval, opts);
+
+        var symbolSizes = [
+            this.getControllerVisual(dataInterval[0], 'symbolSize', opts),
+            this.getControllerVisual(dataInterval[1], 'symbolSize', opts)
+        ];
+        var barPoints = this._createBarPoints(handleEnds, symbolSizes);
+
+        return {
+            barColor: new LinearGradient(0, 0, 0, 1, colorStops),
+            barPoints: barPoints,
+            handlesColor: [
+                colorStops[0].color,
+                colorStops[colorStops.length - 1].color
+            ]
+        };
+    },
+
+    /**
+     * @private
+     */
+    _makeColorGradient: function (dataInterval, opts) {
+        // Considering colorHue, which is not linear, so we have to sample
+        // to calculate gradient color stops, but not only caculate head
+        // and tail.
+        var sampleNumber = 100; // Arbitrary value.
+        var colorStops = [];
+        var step = (dataInterval[1] - dataInterval[0]) / sampleNumber;
+
+        colorStops.push({
+            color: this.getControllerVisual(dataInterval[0], 'color', opts),
+            offset: 0
+        });
+
+        for (var i = 1; i < sampleNumber; i++) {
+            var currValue = dataInterval[0] + step * i;
+            if (currValue > dataInterval[1]) {
+                break;
+            }
+            colorStops.push({
+                color: this.getControllerVisual(currValue, 'color', opts),
+                offset: i / sampleNumber
+            });
+        }
+
+        colorStops.push({
+            color: this.getControllerVisual(dataInterval[1], 'color', opts),
+            offset: 1
+        });
+
+        return colorStops;
+    },
+
+    /**
+     * @private
+     */
+    _createBarPoints: function (handleEnds, symbolSizes) {
+        var itemSize = this.visualMapModel.itemSize;
+
+        return [
+            [itemSize[0] - symbolSizes[0], handleEnds[0]],
+            [itemSize[0], handleEnds[0]],
+            [itemSize[0], handleEnds[1]],
+            [itemSize[0] - symbolSizes[1], handleEnds[1]]
+        ];
+    },
+
+    /**
+     * @private
+     */
+    _createBarGroup: function (itemAlign) {
+        var orient = this._orient;
+        var inverse = this.visualMapModel.get('inverse');
+
+        return new Group(
+            (orient === 'horizontal' && !inverse)
+            ? {scale: itemAlign === 'bottom' ? [1, 1] : [-1, 1], rotation: Math.PI / 2}
+            : (orient === 'horizontal' && inverse)
+            ? {scale: itemAlign === 'bottom' ? [-1, 1] : [1, 1], rotation: -Math.PI / 2}
+            : (orient === 'vertical' && !inverse)
+            ? {scale: itemAlign === 'left' ? [1, -1] : [-1, -1]}
+            : {scale: itemAlign === 'left' ? [1, 1] : [-1, 1]}
+        );
+    },
+
+    /**
+     * @private
+     */
+    _updateHandle: function (handleEnds, visualInRange) {
+        if (!this._useHandle) {
+            return;
+        }
+
+        var shapes = this._shapes;
+        var visualMapModel = this.visualMapModel;
+        var handleThumbs = shapes.handleThumbs;
+        var handleLabels = shapes.handleLabels;
+
+        each$26([0, 1], function (handleIndex) {
+            var handleThumb = handleThumbs[handleIndex];
+            handleThumb.setStyle('fill', visualInRange.handlesColor[handleIndex]);
+            handleThumb.position[1] = handleEnds[handleIndex];
+
+            // Update handle label position.
+            var textPoint = applyTransform$1(
+                shapes.handleLabelPoints[handleIndex],
+                getTransform(handleThumb, this.group)
+            );
+            handleLabels[handleIndex].setStyle({
+                x: textPoint[0],
+                y: textPoint[1],
+                text: visualMapModel.formatValueText(this._dataInterval[handleIndex]),
+                textVerticalAlign: 'middle',
+                textAlign: this._applyTransform(
+                    this._orient === 'horizontal'
+                        ? (handleIndex === 0 ? 'bottom' : 'top')
+                        : 'left',
+                    shapes.barGroup
+                )
+            });
+        }, this);
+    },
+
+    /**
+     * @private
+     * @param {number} cursorValue
+     * @param {number} textValue
+     * @param {string} [rangeSymbol]
+     * @param {number} [halfHoverLinkSize]
+     */
+    _showIndicator: function (cursorValue, textValue, rangeSymbol, halfHoverLinkSize) {
+        var visualMapModel = this.visualMapModel;
+        var dataExtent = visualMapModel.getExtent();
+        var itemSize = visualMapModel.itemSize;
+        var sizeExtent = [0, itemSize[1]];
+        var pos = linearMap$3(cursorValue, dataExtent, sizeExtent, true);
+
+        var shapes = this._shapes;
+        var indicator = shapes.indicator;
+        if (!indicator) {
+            return;
+        }
+
+        indicator.position[1] = pos;
+        indicator.attr('invisible', false);
+        indicator.setShape('points', createIndicatorPoints(
+            !!rangeSymbol, halfHoverLinkSize, pos, itemSize[1]
+        ));
+
+        var opts = {convertOpacityToAlpha: true};
+        var color = this.getControllerVisual(cursorValue, 'color', opts);
+        indicator.setStyle('fill', color);
+
+        // Update handle label position.
+        var textPoint = applyTransform$1(
+            shapes.indicatorLabelPoint,
+            getTransform(indicator, this.group)
+        );
+
+        var indicatorLabel = shapes.indicatorLabel;
+        indicatorLabel.attr('invisible', false);
+        var align = this._applyTransform('left', shapes.barGroup);
+        var orient = this._orient;
+        indicatorLabel.setStyle({
+            text: (rangeSymbol ? rangeSymbol : '') + visualMapModel.formatValueText(textValue),
+            textVerticalAlign: orient === 'horizontal' ? align : 'middle',
+            textAlign: orient === 'horizontal' ? 'center' : align,
+            x: textPoint[0],
+            y: textPoint[1]
+        });
+    },
+
+    /**
+     * @private
+     */
+    _enableHoverLinkToSeries: function () {
+        var self = this;
+        this._shapes.barGroup
+
+            .on('mousemove', function (e) {
+                self._hovering = true;
+
+                if (!self._dragging) {
+                    var itemSize = self.visualMapModel.itemSize;
+                    var pos = self._applyTransform(
+                        [e.offsetX, e.offsetY], self._shapes.barGroup, true, true
+                    );
+                    // For hover link show when hover handle, which might be
+                    // below or upper than sizeExtent.
+                    pos[1] = mathMin$7(mathMax$7(0, pos[1]), itemSize[1]);
+                    self._doHoverLinkToSeries(
+                        pos[1],
+                        0 <= pos[0] && pos[0] <= itemSize[0]
+                    );
+                }
+            })
+
+            .on('mouseout', function () {
+                // When mouse is out of handle, hoverLink still need
+                // to be displayed when realtime is set as false.
+                self._hovering = false;
+                !self._dragging && self._clearHoverLinkToSeries();
+            });
+    },
+
+    /**
+     * @private
+     */
+    _enableHoverLinkFromSeries: function () {
+        var zr = this.api.getZr();
+
+        if (this.visualMapModel.option.hoverLink) {
+            zr.on('mouseover', this._hoverLinkFromSeriesMouseOver, this);
+            zr.on('mouseout', this._hideIndicator, this);
+        }
+        else {
+            this._clearHoverLinkFromSeries();
+        }
+    },
+
+    /**
+     * @private
+     */
+    _doHoverLinkToSeries: function (cursorPos, hoverOnBar) {
+        var visualMapModel = this.visualMapModel;
+        var itemSize = visualMapModel.itemSize;
+
+        if (!visualMapModel.option.hoverLink) {
+            return;
+        }
+
+        var sizeExtent = [0, itemSize[1]];
+        var dataExtent = visualMapModel.getExtent();
+
+        // For hover link show when hover handle, which might be below or upper than sizeExtent.
+        cursorPos = mathMin$7(mathMax$7(sizeExtent[0], cursorPos), sizeExtent[1]);
+
+        var halfHoverLinkSize = getHalfHoverLinkSize(visualMapModel, dataExtent, sizeExtent);
+        var hoverRange = [cursorPos - halfHoverLinkSize, cursorPos + halfHoverLinkSize];
+        var cursorValue = linearMap$3(cursorPos, sizeExtent, dataExtent, true);
+        var valueRange = [
+            linearMap$3(hoverRange[0], sizeExtent, dataExtent, true),
+            linearMap$3(hoverRange[1], sizeExtent, dataExtent, true)
+        ];
+        // Consider data range is out of visualMap range, see test/visualMap-continuous.html,
+        // where china and india has very large population.
+        hoverRange[0] < sizeExtent[0] && (valueRange[0] = -Infinity);
+        hoverRange[1] > sizeExtent[1] && (valueRange[1] = Infinity);
+
+        // Do not show indicator when mouse is over handle,
+        // otherwise labels overlap, especially when dragging.
+        if (hoverOnBar) {
+            if (valueRange[0] === -Infinity) {
+                this._showIndicator(cursorValue, valueRange[1], '< ', halfHoverLinkSize);
+            }
+            else if (valueRange[1] === Infinity) {
+                this._showIndicator(cursorValue, valueRange[0], '> ', halfHoverLinkSize);
+            }
+            else {
+                this._showIndicator(cursorValue, cursorValue, '≈ ', halfHoverLinkSize);
+            }
+        }
+
+        // When realtime is set as false, handles, which are in barGroup,
+        // also trigger hoverLink, which help user to realize where they
+        // focus on when dragging. (see test/heatmap-large.html)
+        // When realtime is set as true, highlight will not show when hover
+        // handle, because the label on handle, which displays a exact value
+        // but not range, might mislead users.
+        var oldBatch = this._hoverLinkDataIndices;
+        var newBatch = [];
+        if (hoverOnBar || useHoverLinkOnHandle(visualMapModel)) {
+            newBatch = this._hoverLinkDataIndices = visualMapModel.findTargetDataIndices(valueRange);
+        }
+
+        var resultBatches = compressBatches(oldBatch, newBatch);
+
+        this._dispatchHighDown('downplay', convertDataIndex(resultBatches[0]));
+        this._dispatchHighDown('highlight', convertDataIndex(resultBatches[1]));
+    },
+
+    /**
+     * @private
+     */
+    _hoverLinkFromSeriesMouseOver: function (e) {
+        var el = e.target;
+        var visualMapModel = this.visualMapModel;
+
+        if (!el || el.dataIndex == null) {
+            return;
+        }
+
+        var dataModel = this.ecModel.getSeriesByIndex(el.seriesIndex);
+
+        if (!visualMapModel.isTargetSeries(dataModel)) {
+            return;
+        }
+
+        var data = dataModel.getData(el.dataType);
+        var value = data.get(visualMapModel.getDataDimension(data), el.dataIndex, true);
+
+        if (!isNaN(value)) {
+            this._showIndicator(value, value);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _hideIndicator: function () {
+        var shapes = this._shapes;
+        shapes.indicator && shapes.indicator.attr('invisible', true);
+        shapes.indicatorLabel && shapes.indicatorLabel.attr('invisible', true);
+    },
+
+    /**
+     * @private
+     */
+    _clearHoverLinkToSeries: function () {
+        this._hideIndicator();
+
+        var indices = this._hoverLinkDataIndices;
+        this._dispatchHighDown('downplay', convertDataIndex(indices));
+
+        indices.length = 0;
+    },
+
+    /**
+     * @private
+     */
+    _clearHoverLinkFromSeries: function () {
+        this._hideIndicator();
+
+        var zr = this.api.getZr();
+        zr.off('mouseover', this._hoverLinkFromSeriesMouseOver);
+        zr.off('mouseout', this._hideIndicator);
+    },
+
+    /**
+     * @private
+     */
+    _applyTransform: function (vertex, element, inverse, global) {
+        var transform = getTransform(element, global ? null : this.group);
+
+        return graphic[
+            isArray(vertex) ? 'applyTransform' : 'transformDirection'
+        ](vertex, transform, inverse);
+    },
+
+    /**
+     * @private
+     */
+    _dispatchHighDown: function (type, batch) {
+        batch && batch.length && this.api.dispatchAction({
+            type: type,
+            batch: batch
+        });
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._clearHoverLinkFromSeries();
+        this._clearHoverLinkToSeries();
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._clearHoverLinkFromSeries();
+        this._clearHoverLinkToSeries();
+    }
+
+});
+
+function createPolygon(points, cursor, onDrift, onDragEnd) {
+    return new Polygon({
+        shape: {points: points},
+        draggable: !!onDrift,
+        cursor: cursor,
+        drift: onDrift,
+        onmousemove: function (e) {
+            // Fot mobile devicem, prevent screen slider on the button.
+            stop(e.event);
+        },
+        ondragend: onDragEnd
+    });
+}
+
+function createHandlePoints(handleIndex, textSize) {
+    return handleIndex === 0
+        ? [[0, 0], [textSize, 0], [textSize, -textSize]]
+        : [[0, 0], [textSize, 0], [textSize, textSize]];
+}
+
+function createIndicatorPoints(isRange, halfHoverLinkSize, pos, extentMax) {
+    return isRange
+        ? [ // indicate range
+            [0, -mathMin$7(halfHoverLinkSize, mathMax$7(pos, 0))],
+            [HOVER_LINK_OUT, 0],
+            [0, mathMin$7(halfHoverLinkSize, mathMax$7(extentMax - pos, 0))]
+        ]
+        : [ // indicate single value
+            [0, 0], [5, -5], [5, 5]
+        ];
+}
+
+function getHalfHoverLinkSize(visualMapModel, dataExtent, sizeExtent) {
+    var halfHoverLinkSize = HOVER_LINK_SIZE / 2;
+    var hoverLinkDataSize = visualMapModel.get('hoverLinkDataSize');
+    if (hoverLinkDataSize) {
+        halfHoverLinkSize = linearMap$3(hoverLinkDataSize, dataExtent, sizeExtent, true) / 2;
+    }
+    return halfHoverLinkSize;
+}
+
+function useHoverLinkOnHandle(visualMapModel) {
+    var hoverLinkOnHandle = visualMapModel.get('hoverLinkOnHandle');
+    return !!(hoverLinkOnHandle == null ? visualMapModel.get('realtime') : hoverLinkOnHandle);
+}
+
+function getCursor$1(orient) {
+    return orient === 'vertical' ? 'ns-resize' : 'ew-resize';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var actionInfo$2 = {
+    type: 'selectDataRange',
+    event: 'dataRangeSelected',
+    // FIXME use updateView appears wrong
+    update: 'update'
+};
+
+registerAction(actionInfo$2, function (payload, ecModel) {
+
+    ecModel.eachComponent({mainType: 'visualMap', query: payload}, function (model) {
+        model.setSelected(payload.selected);
+    });
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+registerPreprocessor(preprocessor$2);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PiecewiseModel = VisualMapModel.extend({
+
+    type: 'visualMap.piecewise',
+
+    /**
+     * Order Rule:
+     *
+     * option.categories / option.pieces / option.text / option.selected:
+     *     If !option.inverse,
+     *     Order when vertical: ['top', ..., 'bottom'].
+     *     Order when horizontal: ['left', ..., 'right'].
+     *     If option.inverse, the meaning of
+     *     the order should be reversed.
+     *
+     * this._pieceList:
+     *     The order is always [low, ..., high].
+     *
+     * Mapping from location to low-high:
+     *     If !option.inverse
+     *     When vertical, top is high.
+     *     When horizontal, right is high.
+     *     If option.inverse, reverse.
+     */
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        selected: null,             // Object. If not specified, means selected.
+                                    // When pieces and splitNumber: {'0': true, '5': true}
+                                    // When categories: {'cate1': false, 'cate3': true}
+                                    // When selected === false, means all unselected.
+
+        minOpen: false,             // Whether include values that smaller than `min`.
+        maxOpen: false,             // Whether include values that bigger than `max`.
+
+        align: 'auto',              // 'auto', 'left', 'right'
+        itemWidth: 20,              // When put the controller vertically, it is the length of
+                                    // horizontal side of each item. Otherwise, vertical side.
+        itemHeight: 14,             // When put the controller vertically, it is the length of
+                                    // vertical side of each item. Otherwise, horizontal side.
+        itemSymbol: 'roundRect',
+        pieceList: null,            // Each item is Object, with some of those attrs:
+                                    // {min, max, lt, gt, lte, gte, value,
+                                    // color, colorSaturation, colorAlpha, opacity,
+                                    // symbol, symbolSize}, which customize the range or visual
+                                    // coding of the certain piece. Besides, see "Order Rule".
+        categories: null,           // category names, like: ['some1', 'some2', 'some3'].
+                                    // Attr min/max are ignored when categories set. See "Order Rule"
+        splitNumber: 5,             // If set to 5, auto split five pieces equally.
+                                    // If set to 0 and component type not set, component type will be
+                                    // determined as "continuous". (It is less reasonable but for ec2
+                                    // compatibility, see echarts/component/visualMap/typeDefaulter)
+        selectedMode: 'multiple',   // Can be 'multiple' or 'single'.
+        itemGap: 10,                // The gap between two items, in px.
+        hoverLink: true,            // Enable hover highlight.
+
+        showLabel: null             // By default, when text is used, label will hide (the logic
+                                    // is remained for compatibility reason)
+    },
+
+    /**
+     * @override
+     */
+    optionUpdated: function (newOption, isInit) {
+        PiecewiseModel.superApply(this, 'optionUpdated', arguments);
+
+        /**
+         * The order is always [low, ..., high].
+         * [{text: string, interval: Array.<number>}, ...]
+         * @private
+         * @type {Array.<Object>}
+         */
+        this._pieceList = [];
+
+        this.resetExtent();
+
+        /**
+         * 'pieces', 'categories', 'splitNumber'
+         * @type {string}
+         */
+        var mode = this._mode = this._determineMode();
+
+        resetMethods[this._mode].call(this);
+
+        this._resetSelected(newOption, isInit);
+
+        var categories = this.option.categories;
+
+        this.resetVisual(function (mappingOption, state) {
+            if (mode === 'categories') {
+                mappingOption.mappingMethod = 'category';
+                mappingOption.categories = clone(categories);
+            }
+            else {
+                mappingOption.dataExtent = this.getExtent();
+                mappingOption.mappingMethod = 'piecewise';
+                mappingOption.pieceList = map(this._pieceList, function (piece) {
+                    var piece = clone(piece);
+                    if (state !== 'inRange') {
+                        // FIXME
+                        // outOfRange do not support special visual in pieces.
+                        piece.visual = null;
+                    }
+                    return piece;
+                });
+            }
+        });
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    completeVisualOption: function () {
+        // Consider this case:
+        // visualMap: {
+        //      pieces: [{symbol: 'circle', lt: 0}, {symbol: 'rect', gte: 0}]
+        // }
+        // where no inRange/outOfRange set but only pieces. So we should make
+        // default inRange/outOfRange for this case, otherwise visuals that only
+        // appear in `pieces` will not be taken into account in visual encoding.
+
+        var option = this.option;
+        var visualTypesInPieces = {};
+        var visualTypes = VisualMapping.listVisualTypes();
+        var isCategory = this.isCategory();
+
+        each$1(option.pieces, function (piece) {
+            each$1(visualTypes, function (visualType) {
+                if (piece.hasOwnProperty(visualType)) {
+                    visualTypesInPieces[visualType] = 1;
+                }
+            });
+        });
+
+        each$1(visualTypesInPieces, function (v, visualType) {
+            var exists = 0;
+            each$1(this.stateList, function (state) {
+                exists |= has(option, state, visualType)
+                    || has(option.target, state, visualType);
+            }, this);
+
+            !exists && each$1(this.stateList, function (state) {
+                (option[state] || (option[state] = {}))[visualType] = visualDefault.get(
+                    visualType, state === 'inRange' ? 'active' : 'inactive', isCategory
+                );
+            });
+        }, this);
+
+        function has(obj, state, visualType) {
+            return obj && obj[state] && (
+                isObject$1(obj[state])
+                    ? obj[state].hasOwnProperty(visualType)
+                    : obj[state] === visualType // e.g., inRange: 'symbol'
+            );
+        }
+
+        VisualMapModel.prototype.completeVisualOption.apply(this, arguments);
+    },
+
+    _resetSelected: function (newOption, isInit) {
+        var thisOption = this.option;
+        var pieceList = this._pieceList;
+
+        // Selected do not merge but all override.
+        var selected = (isInit ? thisOption : newOption).selected || {};
+        thisOption.selected = selected;
+
+        // Consider 'not specified' means true.
+        each$1(pieceList, function (piece, index) {
+            var key = this.getSelectedMapKey(piece);
+            if (!selected.hasOwnProperty(key)) {
+                selected[key] = true;
+            }
+        }, this);
+
+        if (thisOption.selectedMode === 'single') {
+            // Ensure there is only one selected.
+            var hasSel = false;
+
+            each$1(pieceList, function (piece, index) {
+                var key = this.getSelectedMapKey(piece);
+                if (selected[key]) {
+                    hasSel
+                        ? (selected[key] = false)
+                        : (hasSel = true);
+                }
+            }, this);
+        }
+        // thisOption.selectedMode === 'multiple', default: all selected.
+    },
+
+    /**
+     * @public
+     */
+    getSelectedMapKey: function (piece) {
+        return this._mode === 'categories'
+            ? piece.value + '' : piece.index + '';
+    },
+
+    /**
+     * @public
+     */
+    getPieceList: function () {
+        return this._pieceList;
+    },
+
+    /**
+     * @private
+     * @return {string}
+     */
+    _determineMode: function () {
+        var option = this.option;
+
+        return option.pieces && option.pieces.length > 0
+            ? 'pieces'
+            : this.option.categories
+            ? 'categories'
+            : 'splitNumber';
+    },
+
+    /**
+     * @public
+     * @override
+     */
+    setSelected: function (selected) {
+        this.option.selected = clone(selected);
+    },
+
+    /**
+     * @public
+     * @override
+     */
+    getValueState: function (value) {
+        var index = VisualMapping.findPieceIndex(value, this._pieceList);
+
+        return index != null
+            ? (this.option.selected[this.getSelectedMapKey(this._pieceList[index])]
+                ? 'inRange' : 'outOfRange'
+            )
+            : 'outOfRange';
+    },
+
+    /**
+     * @public
+     * @params {number} pieceIndex piece index in visualMapModel.getPieceList()
+     * @return {Array.<Object>} [{seriesId, dataIndices: <Array.<number>>}, ...]
+     */
+    findTargetDataIndices: function (pieceIndex) {
+        var result = [];
+
+        this.eachTargetSeries(function (seriesModel) {
+            var dataIndices = [];
+            var data = seriesModel.getData();
+
+            data.each(this.getDataDimension(data), function (value, dataIndex) {
+                // Should always base on model pieceList, because it is order sensitive.
+                var pIdx = VisualMapping.findPieceIndex(value, this._pieceList);
+                pIdx === pieceIndex && dataIndices.push(dataIndex);
+            }, this);
+
+            result.push({seriesId: seriesModel.id, dataIndex: dataIndices});
+        }, this);
+
+        return result;
+    },
+
+    /**
+     * @private
+     * @param {Object} piece piece.value or piece.interval is required.
+     * @return {number} Can be Infinity or -Infinity
+     */
+    getRepresentValue: function (piece) {
+        var representValue;
+        if (this.isCategory()) {
+            representValue = piece.value;
+        }
+        else {
+            if (piece.value != null) {
+                representValue = piece.value;
+            }
+            else {
+                var pieceInterval = piece.interval || [];
+                representValue = (pieceInterval[0] === -Infinity && pieceInterval[1] === Infinity)
+                    ? 0
+                    : (pieceInterval[0] + pieceInterval[1]) / 2;
+            }
+        }
+        return representValue;
+    },
+
+    getVisualMeta: function (getColorVisual) {
+        // Do not support category. (category axis is ordinal, numerical)
+        if (this.isCategory()) {
+            return;
+        }
+
+        var stops = [];
+        var outerColors = [];
+        var visualMapModel = this;
+
+        function setStop(interval, valueState) {
+            var representValue = visualMapModel.getRepresentValue({interval: interval});
+            if (!valueState) {
+                valueState = visualMapModel.getValueState(representValue);
+            }
+            var color = getColorVisual(representValue, valueState);
+            if (interval[0] === -Infinity) {
+                outerColors[0] = color;
+            }
+            else if (interval[1] === Infinity) {
+                outerColors[1] = color;
+            }
+            else {
+                stops.push(
+                    {value: interval[0], color: color},
+                    {value: interval[1], color: color}
+                );
+            }
+        }
+
+        // Suplement
+        var pieceList = this._pieceList.slice();
+        if (!pieceList.length) {
+            pieceList.push({interval: [-Infinity, Infinity]});
+        }
+        else {
+            var edge = pieceList[0].interval[0];
+            edge !== -Infinity && pieceList.unshift({interval: [-Infinity, edge]});
+            edge = pieceList[pieceList.length - 1].interval[1];
+            edge !== Infinity && pieceList.push({interval: [edge, Infinity]});
+        }
+
+        var curr = -Infinity;
+        each$1(pieceList, function (piece) {
+            var interval = piece.interval;
+            if (interval) {
+                // Fulfill gap.
+                interval[0] > curr && setStop([curr, interval[0]], 'outOfRange');
+                setStop(interval.slice());
+                curr = interval[1];
+            }
+        }, this);
+
+        return {stops: stops, outerColors: outerColors};
+    }
+
+});
+
+/**
+ * Key is this._mode
+ * @type {Object}
+ * @this {module:echarts/component/viusalMap/PiecewiseMode}
+ */
+var resetMethods = {
+
+    splitNumber: function () {
+        var thisOption = this.option;
+        var pieceList = this._pieceList;
+        var precision = Math.min(thisOption.precision, 20);
+        var dataExtent = this.getExtent();
+        var splitNumber = thisOption.splitNumber;
+        splitNumber = Math.max(parseInt(splitNumber, 10), 1);
+        thisOption.splitNumber = splitNumber;
+
+        var splitStep = (dataExtent[1] - dataExtent[0]) / splitNumber;
+        // Precision auto-adaption
+        while (+splitStep.toFixed(precision) !== splitStep && precision < 5) {
+            precision++;
+        }
+        thisOption.precision = precision;
+        splitStep = +splitStep.toFixed(precision);
+
+        var index = 0;
+
+        if (thisOption.minOpen) {
+            pieceList.push({
+                index: index++,
+                interval: [-Infinity, dataExtent[0]],
+                close: [0, 0]
+            });
+        }
+
+        for (
+            var curr = dataExtent[0], len = index + splitNumber;
+            index < len;
+            curr += splitStep
+        ) {
+            var max = index === splitNumber - 1 ? dataExtent[1] : (curr + splitStep);
+
+            pieceList.push({
+                index: index++,
+                interval: [curr, max],
+                close: [1, 1]
+            });
+        }
+
+        if (thisOption.maxOpen) {
+            pieceList.push({
+                index: index++,
+                interval: [dataExtent[1], Infinity],
+                close: [0, 0]
+            });
+        }
+
+        reformIntervals(pieceList);
+
+        each$1(pieceList, function (piece) {
+            piece.text = this.formatValueText(piece.interval);
+        }, this);
+    },
+
+    categories: function () {
+        var thisOption = this.option;
+        each$1(thisOption.categories, function (cate) {
+            // FIXME category模式也使用pieceList，但在visualMapping中不是使用pieceList。
+            // 是否改一致。
+            this._pieceList.push({
+                text: this.formatValueText(cate, true),
+                value: cate
+            });
+        }, this);
+
+        // See "Order Rule".
+        normalizeReverse(thisOption, this._pieceList);
+    },
+
+    pieces: function () {
+        var thisOption = this.option;
+        var pieceList = this._pieceList;
+
+        each$1(thisOption.pieces, function (pieceListItem, index) {
+
+            if (!isObject$1(pieceListItem)) {
+                pieceListItem = {value: pieceListItem};
+            }
+
+            var item = {text: '', index: index};
+
+            if (pieceListItem.label != null) {
+                item.text = pieceListItem.label;
+            }
+
+            if (pieceListItem.hasOwnProperty('value')) {
+                var value = item.value = pieceListItem.value;
+                item.interval = [value, value];
+                item.close = [1, 1];
+            }
+            else {
+                // `min` `max` is legacy option.
+                // `lt` `gt` `lte` `gte` is recommanded.
+                var interval = item.interval = [];
+                var close = item.close = [0, 0];
+
+                var closeList = [1, 0, 1];
+                var infinityList = [-Infinity, Infinity];
+
+                var useMinMax = [];
+                for (var lg = 0; lg < 2; lg++) {
+                    var names = [['gte', 'gt', 'min'], ['lte', 'lt', 'max']][lg];
+                    for (var i = 0; i < 3 && interval[lg] == null; i++) {
+                        interval[lg] = pieceListItem[names[i]];
+                        close[lg] = closeList[i];
+                        useMinMax[lg] = i === 2;
+                    }
+                    interval[lg] == null && (interval[lg] = infinityList[lg]);
+                }
+                useMinMax[0] && interval[1] === Infinity && (close[0] = 0);
+                useMinMax[1] && interval[0] === -Infinity && (close[1] = 0);
+
+                if (__DEV__) {
+                    if (interval[0] > interval[1]) {
+                        console.warn(
+                            'Piece ' + index + 'is illegal: ' + interval
+                            + ' lower bound should not greater then uppper bound.'
+                        );
+                    }
+                }
+
+                if (interval[0] === interval[1] && close[0] && close[1]) {
+                    // Consider: [{min: 5, max: 5, visual: {...}}, {min: 0, max: 5}],
+                    // we use value to lift the priority when min === max
+                    item.value = interval[0];
+                }
+            }
+
+            item.visual = VisualMapping.retrieveVisuals(pieceListItem);
+
+            pieceList.push(item);
+
+        }, this);
+
+        // See "Order Rule".
+        normalizeReverse(thisOption, pieceList);
+        // Only pieces
+        reformIntervals(pieceList);
+
+        each$1(pieceList, function (piece) {
+            var close = piece.close;
+            var edgeSymbols = [['<', '≤'][close[1]], ['>', '≥'][close[0]]];
+            piece.text = piece.text || this.formatValueText(
+                piece.value != null ? piece.value : piece.interval,
+                false,
+                edgeSymbols
+            );
+        }, this);
+    }
+};
+
+function normalizeReverse(thisOption, pieceList) {
+    var inverse = thisOption.inverse;
+    if (thisOption.orient === 'vertical' ? !inverse : inverse) {
+            pieceList.reverse();
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PiecewiseVisualMapView = VisualMapView.extend({
+
+    type: 'visualMap.piecewise',
+
+    /**
+     * @protected
+     * @override
+     */
+    doRender: function () {
+        var thisGroup = this.group;
+
+        thisGroup.removeAll();
+
+        var visualMapModel = this.visualMapModel;
+        var textGap = visualMapModel.get('textGap');
+        var textStyleModel = visualMapModel.textStyleModel;
+        var textFont = textStyleModel.getFont();
+        var textFill = textStyleModel.getTextColor();
+        var itemAlign = this._getItemAlign();
+        var itemSize = visualMapModel.itemSize;
+        var viewData = this._getViewData();
+        var endsText = viewData.endsText;
+        var showLabel = retrieve(visualMapModel.get('showLabel', true), !endsText);
+
+        endsText && this._renderEndsText(
+            thisGroup, endsText[0], itemSize, showLabel, itemAlign
+        );
+
+        each$1(viewData.viewPieceList, renderItem, this);
+
+        endsText && this._renderEndsText(
+            thisGroup, endsText[1], itemSize, showLabel, itemAlign
+        );
+
+        box(
+            visualMapModel.get('orient'), thisGroup, visualMapModel.get('itemGap')
+        );
+
+        this.renderBackground(thisGroup);
+
+        this.positionGroup(thisGroup);
+
+        function renderItem(item) {
+            var piece = item.piece;
+
+            var itemGroup = new Group();
+            itemGroup.onclick = bind(this._onItemClick, this, piece);
+
+            this._enableHoverLink(itemGroup, item.indexInModelPieceList);
+
+            var representValue = visualMapModel.getRepresentValue(piece);
+
+            this._createItemSymbol(
+                itemGroup, representValue, [0, 0, itemSize[0], itemSize[1]]
+            );
+
+            if (showLabel) {
+                var visualState = this.visualMapModel.getValueState(representValue);
+
+                itemGroup.add(new Text({
+                    style: {
+                        x: itemAlign === 'right' ? -textGap : itemSize[0] + textGap,
+                        y: itemSize[1] / 2,
+                        text: piece.text,
+                        textVerticalAlign: 'middle',
+                        textAlign: itemAlign,
+                        textFont: textFont,
+                        textFill: textFill,
+                        opacity: visualState === 'outOfRange' ? 0.5 : 1
+                    }
+                }));
+            }
+
+            thisGroup.add(itemGroup);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _enableHoverLink: function (itemGroup, pieceIndex) {
+        itemGroup
+            .on('mouseover', bind(onHoverLink, this, 'highlight'))
+            .on('mouseout', bind(onHoverLink, this, 'downplay'));
+
+        function onHoverLink(method) {
+            var visualMapModel = this.visualMapModel;
+
+            visualMapModel.option.hoverLink && this.api.dispatchAction({
+                type: method,
+                batch: convertDataIndex(
+                    visualMapModel.findTargetDataIndices(pieceIndex)
+                )
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _getItemAlign: function () {
+        var visualMapModel = this.visualMapModel;
+        var modelOption = visualMapModel.option;
+
+        if (modelOption.orient === 'vertical') {
+            return getItemAlign(
+                visualMapModel, this.api, visualMapModel.itemSize
+            );
+        }
+        else { // horizontal, most case left unless specifying right.
+            var align = modelOption.align;
+            if (!align || align === 'auto') {
+                align = 'left';
+            }
+            return align;
+        }
+    },
+
+    /**
+     * @private
+     */
+    _renderEndsText: function (group, text, itemSize, showLabel, itemAlign) {
+        if (!text) {
+            return;
+        }
+
+        var itemGroup = new Group();
+        var textStyleModel = this.visualMapModel.textStyleModel;
+
+        itemGroup.add(new Text({
+            style: {
+                x: showLabel ? (itemAlign === 'right' ? itemSize[0] : 0) : itemSize[0] / 2,
+                y: itemSize[1] / 2,
+                textVerticalAlign: 'middle',
+                textAlign: showLabel ? itemAlign : 'center',
+                text: text,
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        }));
+
+        group.add(itemGroup);
+    },
+
+    /**
+     * @private
+     * @return {Object} {peiceList, endsText} The order is the same as screen pixel order.
+     */
+    _getViewData: function () {
+        var visualMapModel = this.visualMapModel;
+
+        var viewPieceList = map(visualMapModel.getPieceList(), function (piece, index) {
+            return {piece: piece, indexInModelPieceList: index};
+        });
+        var endsText = visualMapModel.get('text');
+
+        // Consider orient and inverse.
+        var orient = visualMapModel.get('orient');
+        var inverse = visualMapModel.get('inverse');
+
+        // Order of model pieceList is always [low, ..., high]
+        if (orient === 'horizontal' ? inverse : !inverse) {
+            viewPieceList.reverse();
+        }
+        // Origin order of endsText is [high, low]
+        else if (endsText) {
+            endsText = endsText.slice().reverse();
+        }
+
+        return {viewPieceList: viewPieceList, endsText: endsText};
+    },
+
+    /**
+     * @private
+     */
+    _createItemSymbol: function (group, representValue, shapeParam) {
+        group.add(createSymbol(
+            this.getControllerVisual(representValue, 'symbol'),
+            shapeParam[0], shapeParam[1], shapeParam[2], shapeParam[3],
+            this.getControllerVisual(representValue, 'color')
+        ));
+    },
+
+    /**
+     * @private
+     */
+    _onItemClick: function (piece) {
+        var visualMapModel = this.visualMapModel;
+        var option = visualMapModel.option;
+        var selected = clone(option.selected);
+        var newKey = visualMapModel.getSelectedMapKey(piece);
+
+        if (option.selectedMode === 'single') {
+            selected[newKey] = true;
+            each$1(selected, function (o, key) {
+                selected[key] = key === newKey;
+            });
+        }
+        else {
+            selected[newKey] = !selected[newKey];
+        }
+
+        this.api.dispatchAction({
+            type: 'selectDataRange',
+            from: this.uid,
+            visualMapId: this.visualMapModel.id,
+            selected: selected
+        });
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+registerPreprocessor(preprocessor$2);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * visualMap component entry
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var addCommas$1 = addCommas;
+var encodeHTML$1 = encodeHTML;
+
+function fillLabel(opt) {
+    defaultEmphasis(opt, 'label', ['show']);
+}
+var MarkerModel = extendComponentModel({
+
+    type: 'marker',
+
+    dependencies: ['series', 'grid', 'polar', 'geo'],
+
+    /**
+     * @overrite
+     */
+    init: function (option, parentModel, ecModel, extraOpt) {
+
+        if (__DEV__) {
+            if (this.type === 'marker') {
+                throw new Error('Marker component is abstract component. Use markLine, markPoint, markArea instead.');
+            }
+        }
+        this.mergeDefaultAndTheme(option, ecModel);
+        this.mergeOption(option, ecModel, extraOpt.createdBySelf, true);
+    },
+
+    /**
+     * @return {boolean}
+     */
+    isAnimationEnabled: function () {
+        if (env$1.node) {
+            return false;
+        }
+
+        var hostSeries = this.__hostSeries;
+        return this.getShallow('animation') && hostSeries && hostSeries.isAnimationEnabled();
+    },
+
+    mergeOption: function (newOpt, ecModel, createdBySelf, isInit) {
+        var MarkerModel = this.constructor;
+        var modelPropName = this.mainType + 'Model';
+        if (!createdBySelf) {
+            ecModel.eachSeries(function (seriesModel) {
+
+                var markerOpt = seriesModel.get(this.mainType, true);
+
+                var markerModel = seriesModel[modelPropName];
+                if (!markerOpt || !markerOpt.data) {
+                    seriesModel[modelPropName] = null;
+                    return;
+                }
+                if (!markerModel) {
+                    if (isInit) {
+                        // Default label emphasis `position` and `show`
+                        fillLabel(markerOpt);
+                    }
+                    each$1(markerOpt.data, function (item) {
+                        // FIXME Overwrite fillLabel method ?
+                        if (item instanceof Array) {
+                            fillLabel(item[0]);
+                            fillLabel(item[1]);
+                        }
+                        else {
+                            fillLabel(item);
+                        }
+                    });
+
+                    markerModel = new MarkerModel(
+                        markerOpt, this, ecModel
+                    );
+
+                    extend(markerModel, {
+                        mainType: this.mainType,
+                        // Use the same series index and name
+                        seriesIndex: seriesModel.seriesIndex,
+                        name: seriesModel.name,
+                        createdBySelf: true
+                    });
+
+                    markerModel.__hostSeries = seriesModel;
+                }
+                else {
+                    markerModel.mergeOption(markerOpt, ecModel, true);
+                }
+                seriesModel[modelPropName] = markerModel;
+            }, this);
+        }
+    },
+
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var value = this.getRawValue(dataIndex);
+        var formattedValue = isArray(value)
+            ? map(value, addCommas$1).join(', ') : addCommas$1(value);
+        var name = data.getName(dataIndex);
+        var html = encodeHTML$1(this.name);
+        if (value != null || name) {
+            html += '<br />';
+        }
+        if (name) {
+            html += encodeHTML$1(name);
+            if (value != null) {
+                html += ' : ';
+            }
+        }
+        if (value != null) {
+            html += encodeHTML$1(formattedValue);
+        }
+        return html;
+    },
+
+    getData: function () {
+        return this._data;
+    },
+
+    setData: function (data) {
+        this._data = data;
+    }
+});
+
+mixin(MarkerModel, dataFormatMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+MarkerModel.extend({
+
+    type: 'markPoint',
+
+    defaultOption: {
+        zlevel: 0,
+        z: 5,
+        symbol: 'pin',
+        symbolSize: 50,
+        //symbolRotate: 0,
+        //symbolOffset: [0, 0]
+        tooltip: {
+            trigger: 'item'
+        },
+        label: {
+            show: true,
+            position: 'inside'
+        },
+        itemStyle: {
+            borderWidth: 2
+        },
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var indexOf$2 = indexOf;
+
+function hasXOrY(item) {
+    return !(isNaN(parseFloat(item.x)) && isNaN(parseFloat(item.y)));
+}
+
+function hasXAndY(item) {
+    return !isNaN(parseFloat(item.x)) && !isNaN(parseFloat(item.y));
+}
+
+// Make it simple, do not visit all stacked value to count precision.
+// function getPrecision(data, valueAxisDim, dataIndex) {
+//     var precision = -1;
+//     var stackedDim = data.mapDimension(valueAxisDim);
+//     do {
+//         precision = Math.max(
+//             numberUtil.getPrecision(data.get(stackedDim, dataIndex)),
+//             precision
+//         );
+//         var stackedOnSeries = data.getCalculationInfo('stackedOnSeries');
+//         if (stackedOnSeries) {
+//             var byValue = data.get(data.getCalculationInfo('stackedByDimension'), dataIndex);
+//             data = stackedOnSeries.getData();
+//             dataIndex = data.indexOf(data.getCalculationInfo('stackedByDimension'), byValue);
+//             stackedDim = data.getCalculationInfo('stackedDimension');
+//         }
+//         else {
+//             data = null;
+//         }
+//     } while (data);
+
+//     return precision;
+// }
+
+function markerTypeCalculatorWithExtent(
+    mlType, data, otherDataDim, targetDataDim, otherCoordIndex, targetCoordIndex
+) {
+    var coordArr = [];
+
+    var stacked = isDimensionStacked(data, targetDataDim /*, otherDataDim*/);
+    var calcDataDim = stacked
+        ? data.getCalculationInfo('stackResultDimension')
+        : targetDataDim;
+
+    var value = numCalculate(data, calcDataDim, mlType);
+
+    var dataIndex = data.indicesOfNearest(calcDataDim, value)[0];
+    coordArr[otherCoordIndex] = data.get(otherDataDim, dataIndex);
+    coordArr[targetCoordIndex] = data.get(targetDataDim, dataIndex);
+
+    // Make it simple, do not visit all stacked value to count precision.
+    var precision = getPrecision(data.get(targetDataDim, dataIndex));
+    precision = Math.min(precision, 20);
+    if (precision >= 0) {
+        coordArr[targetCoordIndex] = +coordArr[targetCoordIndex].toFixed(precision);
+    }
+
+    return coordArr;
+}
+
+var curry$7 = curry;
+// TODO Specified percent
+var markerTypeCalculator = {
+    /**
+     * @method
+     * @param {module:echarts/data/List} data
+     * @param {string} baseAxisDim
+     * @param {string} valueAxisDim
+     */
+    min: curry$7(markerTypeCalculatorWithExtent, 'min'),
+    /**
+     * @method
+     * @param {module:echarts/data/List} data
+     * @param {string} baseAxisDim
+     * @param {string} valueAxisDim
+     */
+    max: curry$7(markerTypeCalculatorWithExtent, 'max'),
+
+    /**
+     * @method
+     * @param {module:echarts/data/List} data
+     * @param {string} baseAxisDim
+     * @param {string} valueAxisDim
+     */
+    average: curry$7(markerTypeCalculatorWithExtent, 'average')
+};
+
+/**
+ * Transform markPoint data item to format used in List by do the following
+ * 1. Calculate statistic like `max`, `min`, `average`
+ * 2. Convert `item.xAxis`, `item.yAxis` to `item.coord` array
+ * @param  {module:echarts/model/Series} seriesModel
+ * @param  {module:echarts/coord/*} [coordSys]
+ * @param  {Object} item
+ * @return {Object}
+ */
+function dataTransform(seriesModel, item) {
+    var data = seriesModel.getData();
+    var coordSys = seriesModel.coordinateSystem;
+
+    // 1. If not specify the position with pixel directly
+    // 2. If `coord` is not a data array. Which uses `xAxis`,
+    // `yAxis` to specify the coord on each dimension
+
+    // parseFloat first because item.x and item.y can be percent string like '20%'
+    if (item && !hasXAndY(item) && !isArray(item.coord) && coordSys) {
+        var dims = coordSys.dimensions;
+        var axisInfo = getAxisInfo$1(item, data, coordSys, seriesModel);
+
+        // Clone the option
+        // Transform the properties xAxis, yAxis, radiusAxis, angleAxis, geoCoord to value
+        item = clone(item);
+
+        if (item.type
+            && markerTypeCalculator[item.type]
+            && axisInfo.baseAxis && axisInfo.valueAxis
+        ) {
+            var otherCoordIndex = indexOf$2(dims, axisInfo.baseAxis.dim);
+            var targetCoordIndex = indexOf$2(dims, axisInfo.valueAxis.dim);
+
+            item.coord = markerTypeCalculator[item.type](
+                data, axisInfo.baseDataDim, axisInfo.valueDataDim,
+                otherCoordIndex, targetCoordIndex
+            );
+            // Force to use the value of calculated value.
+            item.value = item.coord[targetCoordIndex];
+        }
+        else {
+            // FIXME Only has one of xAxis and yAxis.
+            var coord = [
+                item.xAxis != null ? item.xAxis : item.radiusAxis,
+                item.yAxis != null ? item.yAxis : item.angleAxis
+            ];
+            // Each coord support max, min, average
+            for (var i = 0; i < 2; i++) {
+                if (markerTypeCalculator[coord[i]]) {
+                    coord[i] = numCalculate(data, data.mapDimension(dims[i]), coord[i]);
+                }
+            }
+            item.coord = coord;
+        }
+    }
+    return item;
+}
+
+function getAxisInfo$1(item, data, coordSys, seriesModel) {
+    var ret = {};
+
+    if (item.valueIndex != null || item.valueDim != null) {
+        ret.valueDataDim = item.valueIndex != null
+            ? data.getDimension(item.valueIndex) : item.valueDim;
+        ret.valueAxis = coordSys.getAxis(dataDimToCoordDim(seriesModel, ret.valueDataDim));
+        ret.baseAxis = coordSys.getOtherAxis(ret.valueAxis);
+        ret.baseDataDim = data.mapDimension(ret.baseAxis.dim);
+    }
+    else {
+        ret.baseAxis = seriesModel.getBaseAxis();
+        ret.valueAxis = coordSys.getOtherAxis(ret.baseAxis);
+        ret.baseDataDim = data.mapDimension(ret.baseAxis.dim);
+        ret.valueDataDim = data.mapDimension(ret.valueAxis.dim);
+    }
+
+    return ret;
+}
+
+function dataDimToCoordDim(seriesModel, dataDim) {
+    var data = seriesModel.getData();
+    var dimensions = data.dimensions;
+    dataDim = data.getDimension(dataDim);
+    for (var i = 0; i < dimensions.length; i++) {
+        var dimItem = data.getDimensionInfo(dimensions[i]);
+        if (dimItem.name === dataDim) {
+            return dimItem.coordDim;
+        }
+    }
+}
+
+/**
+ * Filter data which is out of coordinateSystem range
+ * [dataFilter description]
+ * @param  {module:echarts/coord/*} [coordSys]
+ * @param  {Object} item
+ * @return {boolean}
+ */
+function dataFilter$1(coordSys, item) {
+    // Alwalys return true if there is no coordSys
+    return (coordSys && coordSys.containData && item.coord && !hasXOrY(item))
+        ? coordSys.containData(item.coord) : true;
+}
+
+function dimValueGetter(item, dimName, dataIndex, dimIndex) {
+    // x, y, radius, angle
+    if (dimIndex < 2) {
+        return item.coord && item.coord[dimIndex];
+    }
+    return item.value;
+}
+
+function numCalculate(data, valueDataDim, type) {
+    if (type === 'average') {
+        var sum = 0;
+        var count = 0;
+        data.each(valueDataDim, function (val, idx) {
+            if (!isNaN(val)) {
+                sum += val;
+                count++;
+            }
+        });
+        return sum / count;
+    }
+    else if (type === 'median') {
+        return data.getMedian(valueDataDim);
+    }
+    else {
+        // max & min
+        return data.getDataExtent(valueDataDim, true)[type === 'max' ? 1 : 0];
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var MarkerView = extendComponentView({
+
+    type: 'marker',
+
+    init: function () {
+        /**
+         * Markline grouped by series
+         * @private
+         * @type {module:zrender/core/util.HashMap}
+         */
+        this.markerGroupMap = createHashMap();
+    },
+
+    render: function (markerModel, ecModel, api) {
+        var markerGroupMap = this.markerGroupMap;
+        markerGroupMap.each(function (item) {
+            item.__keep = false;
+        });
+
+        var markerModelKey = this.type + 'Model';
+        ecModel.eachSeries(function (seriesModel) {
+            var markerModel = seriesModel[markerModelKey];
+            markerModel && this.renderSeries(seriesModel, markerModel, ecModel, api);
+        }, this);
+
+        markerGroupMap.each(function (item) {
+            !item.__keep && this.group.remove(item.group);
+        }, this);
+    },
+
+    renderSeries: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function updateMarkerLayout(mpData, seriesModel, api) {
+    var coordSys = seriesModel.coordinateSystem;
+    mpData.each(function (idx) {
+        var itemModel = mpData.getItemModel(idx);
+        var point;
+        var xPx = parsePercent$1(itemModel.get('x'), api.getWidth());
+        var yPx = parsePercent$1(itemModel.get('y'), api.getHeight());
+        if (!isNaN(xPx) && !isNaN(yPx)) {
+            point = [xPx, yPx];
+        }
+        // Chart like bar may have there own marker positioning logic
+        else if (seriesModel.getMarkerPosition) {
+            // Use the getMarkerPoisition
+            point = seriesModel.getMarkerPosition(
+                mpData.getValues(mpData.dimensions, idx)
+            );
+        }
+        else if (coordSys) {
+            var x = mpData.get(coordSys.dimensions[0], idx);
+            var y = mpData.get(coordSys.dimensions[1], idx);
+            point = coordSys.dataToPoint([x, y]);
+
+        }
+
+        // Use x, y if has any
+        if (!isNaN(xPx)) {
+            point[0] = xPx;
+        }
+        if (!isNaN(yPx)) {
+            point[1] = yPx;
+        }
+
+        mpData.setItemLayout(idx, point);
+    });
+}
+
+MarkerView.extend({
+
+    type: 'markPoint',
+
+    // updateLayout: function (markPointModel, ecModel, api) {
+    //     ecModel.eachSeries(function (seriesModel) {
+    //         var mpModel = seriesModel.markPointModel;
+    //         if (mpModel) {
+    //             updateMarkerLayout(mpModel.getData(), seriesModel, api);
+    //             this.markerGroupMap.get(seriesModel.id).updateLayout(mpModel);
+    //         }
+    //     }, this);
+    // },
+
+    updateTransform: function (markPointModel, ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            var mpModel = seriesModel.markPointModel;
+            if (mpModel) {
+                updateMarkerLayout(mpModel.getData(), seriesModel, api);
+                this.markerGroupMap.get(seriesModel.id).updateLayout(mpModel);
+            }
+        }, this);
+    },
+
+    renderSeries: function (seriesModel, mpModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesId = seriesModel.id;
+        var seriesData = seriesModel.getData();
+
+        var symbolDrawMap = this.markerGroupMap;
+        var symbolDraw = symbolDrawMap.get(seriesId)
+            || symbolDrawMap.set(seriesId, new SymbolDraw());
+
+        var mpData = createList$1(coordSys, seriesModel, mpModel);
+
+        // FIXME
+        mpModel.setData(mpData);
+
+        updateMarkerLayout(mpModel.getData(), seriesModel, api);
+
+        mpData.each(function (idx) {
+            var itemModel = mpData.getItemModel(idx);
+            var symbolSize = itemModel.getShallow('symbolSize');
+            if (typeof symbolSize === 'function') {
+                // FIXME 这里不兼容 ECharts 2.x，2.x 貌似参数是整个数据？
+                symbolSize = symbolSize(
+                    mpModel.getRawValue(idx), mpModel.getDataParams(idx)
+                );
+            }
+            mpData.setItemVisual(idx, {
+                symbolSize: symbolSize,
+                color: itemModel.get('itemStyle.color')
+                    || seriesData.getVisual('color'),
+                symbol: itemModel.getShallow('symbol')
+            });
+        });
+
+        // TODO Text are wrong
+        symbolDraw.updateData(mpData);
+        this.group.add(symbolDraw.group);
+
+        // Set host model for tooltip
+        // FIXME
+        mpData.eachItemGraphicEl(function (el) {
+            el.traverse(function (child) {
+                child.dataModel = mpModel;
+            });
+        });
+
+        symbolDraw.__keep = true;
+
+        symbolDraw.group.silent = mpModel.get('silent') || seriesModel.get('silent');
+    }
+});
+
+/**
+ * @inner
+ * @param {module:echarts/coord/*} [coordSys]
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {module:echarts/model/Model} mpModel
+ */
+function createList$1(coordSys, seriesModel, mpModel) {
+    var coordDimsInfos;
+    if (coordSys) {
+        coordDimsInfos = map(coordSys && coordSys.dimensions, function (coordDim) {
+            var info = seriesModel.getData().getDimensionInfo(
+                seriesModel.getData().mapDimension(coordDim)
+            ) || {};
+            // In map series data don't have lng and lat dimension. Fallback to same with coordSys
+            return defaults({name: coordDim}, info);
+        });
+    }
+    else {
+        coordDimsInfos =[{
+            name: 'value',
+            type: 'float'
+        }];
+    }
+
+    var mpData = new List(coordDimsInfos, mpModel);
+    var dataOpt = map(mpModel.get('data'), curry(
+            dataTransform, seriesModel
+        ));
+    if (coordSys) {
+        dataOpt = filter(
+            dataOpt, curry(dataFilter$1, coordSys)
+        );
+    }
+
+    mpData.initData(dataOpt, null,
+        coordSys ? dimValueGetter : function (item) {
+            return item.value;
+        }
+    );
+
+    return mpData;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// HINT Markpoint can't be used too much
+registerPreprocessor(function (opt) {
+    // Make sure markPoint component is enabled
+    opt.markPoint = opt.markPoint || {};
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+MarkerModel.extend({
+
+    type: 'markLine',
+
+    defaultOption: {
+        zlevel: 0,
+        z: 5,
+
+        symbol: ['circle', 'arrow'],
+        symbolSize: [8, 16],
+
+        //symbolRotate: 0,
+
+        precision: 2,
+        tooltip: {
+            trigger: 'item'
+        },
+        label: {
+            show: true,
+            position: 'end'
+        },
+        lineStyle: {
+            type: 'dashed'
+        },
+        emphasis: {
+            label: {
+                show: true
+            },
+            lineStyle: {
+                width: 3
+            }
+        },
+        animationEasing: 'linear'
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var markLineTransform = function (seriesModel, coordSys, mlModel, item) {
+    var data = seriesModel.getData();
+    // Special type markLine like 'min', 'max', 'average', 'median'
+    var mlType = item.type;
+
+    if (!isArray(item)
+        && (
+            mlType === 'min' || mlType === 'max' || mlType === 'average' || mlType === 'median'
+            // In case
+            // data: [{
+            //   yAxis: 10
+            // }]
+            || (item.xAxis != null || item.yAxis != null)
+        )
+    ) {
+        var valueAxis;
+        var valueDataDim;
+        var value;
+
+        if (item.yAxis != null || item.xAxis != null) {
+            valueDataDim = item.yAxis != null ? 'y' : 'x';
+            valueAxis = coordSys.getAxis(valueDataDim);
+
+            value = retrieve(item.yAxis, item.xAxis);
+        }
+        else {
+            var axisInfo = getAxisInfo$1(item, data, coordSys, seriesModel);
+            valueDataDim = axisInfo.valueDataDim;
+            valueAxis = axisInfo.valueAxis;
+            value = numCalculate(data, valueDataDim, mlType);
+        }
+        var valueIndex = valueDataDim === 'x' ? 0 : 1;
+        var baseIndex = 1 - valueIndex;
+
+        var mlFrom = clone(item);
+        var mlTo = {};
+
+        mlFrom.type = null;
+
+        mlFrom.coord = [];
+        mlTo.coord = [];
+        mlFrom.coord[baseIndex] = -Infinity;
+        mlTo.coord[baseIndex] = Infinity;
+
+        var precision = mlModel.get('precision');
+        if (precision >= 0 && typeof value === 'number') {
+            value = +value.toFixed(Math.min(precision, 20));
+        }
+
+        mlFrom.coord[valueIndex] = mlTo.coord[valueIndex] = value;
+
+        item = [mlFrom, mlTo, { // Extra option for tooltip and label
+            type: mlType,
+            valueIndex: item.valueIndex,
+            // Force to use the value of calculated value.
+            value: value
+        }];
+    }
+
+    item = [
+        dataTransform(seriesModel, item[0]),
+        dataTransform(seriesModel, item[1]),
+        extend({}, item[2])
+    ];
+
+    // Avoid line data type is extended by from(to) data type
+    item[2].type = item[2].type || '';
+
+    // Merge from option and to option into line option
+    merge(item[2], item[0]);
+    merge(item[2], item[1]);
+
+    return item;
+};
+
+function isInifinity(val) {
+    return !isNaN(val) && !isFinite(val);
+}
+
+// If a markLine has one dim
+function ifMarkLineHasOnlyDim(dimIndex, fromCoord, toCoord, coordSys) {
+    var otherDimIndex = 1 - dimIndex;
+    var dimName = coordSys.dimensions[dimIndex];
+    return isInifinity(fromCoord[otherDimIndex]) && isInifinity(toCoord[otherDimIndex])
+        && fromCoord[dimIndex] === toCoord[dimIndex] && coordSys.getAxis(dimName).containData(fromCoord[dimIndex]);
+}
+
+function markLineFilter(coordSys, item) {
+    if (coordSys.type === 'cartesian2d') {
+        var fromCoord = item[0].coord;
+        var toCoord = item[1].coord;
+        // In case
+        // {
+        //  markLine: {
+        //    data: [{ yAxis: 2 }]
+        //  }
+        // }
+        if (
+            fromCoord && toCoord &&
+            (ifMarkLineHasOnlyDim(1, fromCoord, toCoord, coordSys)
+            || ifMarkLineHasOnlyDim(0, fromCoord, toCoord, coordSys))
+        ) {
+            return true;
+        }
+    }
+    return dataFilter$1(coordSys, item[0])
+        && dataFilter$1(coordSys, item[1]);
+}
+
+function updateSingleMarkerEndLayout(
+    data, idx, isFrom, seriesModel, api
+) {
+    var coordSys = seriesModel.coordinateSystem;
+    var itemModel = data.getItemModel(idx);
+
+    var point;
+    var xPx = parsePercent$1(itemModel.get('x'), api.getWidth());
+    var yPx = parsePercent$1(itemModel.get('y'), api.getHeight());
+    if (!isNaN(xPx) && !isNaN(yPx)) {
+        point = [xPx, yPx];
+    }
+    else {
+        // Chart like bar may have there own marker positioning logic
+        if (seriesModel.getMarkerPosition) {
+            // Use the getMarkerPoisition
+            point = seriesModel.getMarkerPosition(
+                data.getValues(data.dimensions, idx)
+            );
+        }
+        else {
+            var dims = coordSys.dimensions;
+            var x = data.get(dims[0], idx);
+            var y = data.get(dims[1], idx);
+            point = coordSys.dataToPoint([x, y]);
+        }
+        // Expand line to the edge of grid if value on one axis is Inifnity
+        // In case
+        //  markLine: {
+        //    data: [{
+        //      yAxis: 2
+        //      // or
+        //      type: 'average'
+        //    }]
+        //  }
+        if (coordSys.type === 'cartesian2d') {
+            var xAxis = coordSys.getAxis('x');
+            var yAxis = coordSys.getAxis('y');
+            var dims = coordSys.dimensions;
+            if (isInifinity(data.get(dims[0], idx))) {
+                point[0] = xAxis.toGlobalCoord(xAxis.getExtent()[isFrom ? 0 : 1]);
+            }
+            else if (isInifinity(data.get(dims[1], idx))) {
+                point[1] = yAxis.toGlobalCoord(yAxis.getExtent()[isFrom ? 0 : 1]);
+            }
+        }
+
+        // Use x, y if has any
+        if (!isNaN(xPx)) {
+            point[0] = xPx;
+        }
+        if (!isNaN(yPx)) {
+            point[1] = yPx;
+        }
+    }
+
+    data.setItemLayout(idx, point);
+}
+
+MarkerView.extend({
+
+    type: 'markLine',
+
+    // updateLayout: function (markLineModel, ecModel, api) {
+    //     ecModel.eachSeries(function (seriesModel) {
+    //         var mlModel = seriesModel.markLineModel;
+    //         if (mlModel) {
+    //             var mlData = mlModel.getData();
+    //             var fromData = mlModel.__from;
+    //             var toData = mlModel.__to;
+    //             // Update visual and layout of from symbol and to symbol
+    //             fromData.each(function (idx) {
+    //                 updateSingleMarkerEndLayout(fromData, idx, true, seriesModel, api);
+    //                 updateSingleMarkerEndLayout(toData, idx, false, seriesModel, api);
+    //             });
+    //             // Update layout of line
+    //             mlData.each(function (idx) {
+    //                 mlData.setItemLayout(idx, [
+    //                     fromData.getItemLayout(idx),
+    //                     toData.getItemLayout(idx)
+    //                 ]);
+    //             });
+
+    //             this.markerGroupMap.get(seriesModel.id).updateLayout();
+
+    //         }
+    //     }, this);
+    // },
+
+    updateTransform: function (markLineModel, ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            var mlModel = seriesModel.markLineModel;
+            if (mlModel) {
+                var mlData = mlModel.getData();
+                var fromData = mlModel.__from;
+                var toData = mlModel.__to;
+                // Update visual and layout of from symbol and to symbol
+                fromData.each(function (idx) {
+                    updateSingleMarkerEndLayout(fromData, idx, true, seriesModel, api);
+                    updateSingleMarkerEndLayout(toData, idx, false, seriesModel, api);
+                });
+                // Update layout of line
+                mlData.each(function (idx) {
+                    mlData.setItemLayout(idx, [
+                        fromData.getItemLayout(idx),
+                        toData.getItemLayout(idx)
+                    ]);
+                });
+
+                this.markerGroupMap.get(seriesModel.id).updateLayout();
+
+            }
+        }, this);
+    },
+
+    renderSeries: function (seriesModel, mlModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesId = seriesModel.id;
+        var seriesData = seriesModel.getData();
+
+        var lineDrawMap = this.markerGroupMap;
+        var lineDraw = lineDrawMap.get(seriesId)
+            || lineDrawMap.set(seriesId, new LineDraw());
+        this.group.add(lineDraw.group);
+
+        var mlData = createList$2(coordSys, seriesModel, mlModel);
+
+        var fromData = mlData.from;
+        var toData = mlData.to;
+        var lineData = mlData.line;
+
+        mlModel.__from = fromData;
+        mlModel.__to = toData;
+        // Line data for tooltip and formatter
+        mlModel.setData(lineData);
+
+        var symbolType = mlModel.get('symbol');
+        var symbolSize = mlModel.get('symbolSize');
+        if (!isArray(symbolType)) {
+            symbolType = [symbolType, symbolType];
+        }
+        if (typeof symbolSize === 'number') {
+            symbolSize = [symbolSize, symbolSize];
+        }
+
+        // Update visual and layout of from symbol and to symbol
+        mlData.from.each(function (idx) {
+            updateDataVisualAndLayout(fromData, idx, true);
+            updateDataVisualAndLayout(toData, idx, false);
+        });
+
+        // Update visual and layout of line
+        lineData.each(function (idx) {
+            var lineColor = lineData.getItemModel(idx).get('lineStyle.color');
+            lineData.setItemVisual(idx, {
+                color: lineColor || fromData.getItemVisual(idx, 'color')
+            });
+            lineData.setItemLayout(idx, [
+                fromData.getItemLayout(idx),
+                toData.getItemLayout(idx)
+            ]);
+
+            lineData.setItemVisual(idx, {
+                'fromSymbolSize': fromData.getItemVisual(idx, 'symbolSize'),
+                'fromSymbol': fromData.getItemVisual(idx, 'symbol'),
+                'toSymbolSize': toData.getItemVisual(idx, 'symbolSize'),
+                'toSymbol': toData.getItemVisual(idx, 'symbol')
+            });
+        });
+
+        lineDraw.updateData(lineData);
+
+        // Set host model for tooltip
+        // FIXME
+        mlData.line.eachItemGraphicEl(function (el, idx) {
+            el.traverse(function (child) {
+                child.dataModel = mlModel;
+            });
+        });
+
+        function updateDataVisualAndLayout(data, idx, isFrom) {
+            var itemModel = data.getItemModel(idx);
+
+            updateSingleMarkerEndLayout(
+                data, idx, isFrom, seriesModel, api
+            );
+
+            data.setItemVisual(idx, {
+                symbolSize: itemModel.get('symbolSize') || symbolSize[isFrom ? 0 : 1],
+                symbol: itemModel.get('symbol', true) || symbolType[isFrom ? 0 : 1],
+                color: itemModel.get('itemStyle.color') || seriesData.getVisual('color')
+            });
+        }
+
+        lineDraw.__keep = true;
+
+        lineDraw.group.silent = mlModel.get('silent') || seriesModel.get('silent');
+    }
+});
+
+/**
+ * @inner
+ * @param {module:echarts/coord/*} coordSys
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {module:echarts/model/Model} mpModel
+ */
+function createList$2(coordSys, seriesModel, mlModel) {
+
+    var coordDimsInfos;
+    if (coordSys) {
+        coordDimsInfos = map(coordSys && coordSys.dimensions, function (coordDim) {
+            var info = seriesModel.getData().getDimensionInfo(
+                seriesModel.getData().mapDimension(coordDim)
+            ) || {};
+            // In map series data don't have lng and lat dimension. Fallback to same with coordSys
+            return defaults({name: coordDim}, info);
+        });
+    }
+    else {
+        coordDimsInfos =[{
+            name: 'value',
+            type: 'float'
+        }];
+    }
+
+    var fromData = new List(coordDimsInfos, mlModel);
+    var toData = new List(coordDimsInfos, mlModel);
+    // No dimensions
+    var lineData = new List([], mlModel);
+
+    var optData = map(mlModel.get('data'), curry(
+        markLineTransform, seriesModel, coordSys, mlModel
+    ));
+    if (coordSys) {
+        optData = filter(
+            optData, curry(markLineFilter, coordSys)
+        );
+    }
+    var dimValueGetter$$1 = coordSys ? dimValueGetter : function (item) {
+        return item.value;
+    };
+    fromData.initData(
+        map(optData, function (item) { return item[0]; }),
+        null, dimValueGetter$$1
+    );
+    toData.initData(
+        map(optData, function (item) { return item[1]; }),
+        null, dimValueGetter$$1
+    );
+    lineData.initData(
+        map(optData, function (item) { return item[2]; })
+    );
+    lineData.hasItemOption = true;
+
+    return {
+        from: fromData,
+        to: toData,
+        line: lineData
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerPreprocessor(function (opt) {
+    // Make sure markLine component is enabled
+    opt.markLine = opt.markLine || {};
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+MarkerModel.extend({
+
+    type: 'markArea',
+
+    defaultOption: {
+        zlevel: 0,
+        // PENDING
+        z: 1,
+        tooltip: {
+            trigger: 'item'
+        },
+        // markArea should fixed on the coordinate system
+        animation: false,
+        label: {
+            show: true,
+            position: 'top'
+        },
+        itemStyle: {
+            // color and borderColor default to use color from series
+            // color: 'auto'
+            // borderColor: 'auto'
+            borderWidth: 0
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                position: 'top'
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Better on polar
+
+var markAreaTransform = function (seriesModel, coordSys, maModel, item) {
+    var lt = dataTransform(seriesModel, item[0]);
+    var rb = dataTransform(seriesModel, item[1]);
+    var retrieve$$1 = retrieve;
+
+    // FIXME make sure lt is less than rb
+    var ltCoord = lt.coord;
+    var rbCoord = rb.coord;
+    ltCoord[0] = retrieve$$1(ltCoord[0], -Infinity);
+    ltCoord[1] = retrieve$$1(ltCoord[1], -Infinity);
+
+    rbCoord[0] = retrieve$$1(rbCoord[0], Infinity);
+    rbCoord[1] = retrieve$$1(rbCoord[1], Infinity);
+
+    // Merge option into one
+    var result = mergeAll([{}, lt, rb]);
+
+    result.coord = [
+        lt.coord, rb.coord
+    ];
+    result.x0 = lt.x;
+    result.y0 = lt.y;
+    result.x1 = rb.x;
+    result.y1 = rb.y;
+    return result;
+};
+
+function isInifinity$1(val) {
+    return !isNaN(val) && !isFinite(val);
+}
+
+// If a markArea has one dim
+function ifMarkLineHasOnlyDim$1(dimIndex, fromCoord, toCoord, coordSys) {
+    var otherDimIndex = 1 - dimIndex;
+    return isInifinity$1(fromCoord[otherDimIndex]) && isInifinity$1(toCoord[otherDimIndex]);
+}
+
+function markAreaFilter(coordSys, item) {
+    var fromCoord = item.coord[0];
+    var toCoord = item.coord[1];
+    if (coordSys.type === 'cartesian2d') {
+        // In case
+        // {
+        //  markArea: {
+        //    data: [{ yAxis: 2 }]
+        //  }
+        // }
+        if (
+            fromCoord && toCoord &&
+            (ifMarkLineHasOnlyDim$1(1, fromCoord, toCoord, coordSys)
+            || ifMarkLineHasOnlyDim$1(0, fromCoord, toCoord, coordSys))
+        ) {
+            return true;
+        }
+    }
+    return dataFilter$1(coordSys, {
+            coord: fromCoord,
+            x: item.x0,
+            y: item.y0
+        })
+        || dataFilter$1(coordSys, {
+            coord: toCoord,
+            x: item.x1,
+            y: item.y1
+        });
+}
+
+// dims can be ['x0', 'y0'], ['x1', 'y1'], ['x0', 'y1'], ['x1', 'y0']
+function getSingleMarkerEndPoint(data, idx, dims, seriesModel, api) {
+    var coordSys = seriesModel.coordinateSystem;
+    var itemModel = data.getItemModel(idx);
+
+    var point;
+    var xPx = parsePercent$1(itemModel.get(dims[0]), api.getWidth());
+    var yPx = parsePercent$1(itemModel.get(dims[1]), api.getHeight());
+    if (!isNaN(xPx) && !isNaN(yPx)) {
+        point = [xPx, yPx];
+    }
+    else {
+        // Chart like bar may have there own marker positioning logic
+        if (seriesModel.getMarkerPosition) {
+            // Use the getMarkerPoisition
+            point = seriesModel.getMarkerPosition(
+                data.getValues(dims, idx)
+            );
+        }
+        else {
+            var x = data.get(dims[0], idx);
+            var y = data.get(dims[1], idx);
+            var pt = [x, y];
+            coordSys.clampData && coordSys.clampData(pt, pt);
+            point = coordSys.dataToPoint(pt, true);
+        }
+        if (coordSys.type === 'cartesian2d') {
+            var xAxis = coordSys.getAxis('x');
+            var yAxis = coordSys.getAxis('y');
+            var x = data.get(dims[0], idx);
+            var y = data.get(dims[1], idx);
+            if (isInifinity$1(x)) {
+                point[0] = xAxis.toGlobalCoord(xAxis.getExtent()[dims[0] === 'x0' ? 0 : 1]);
+            }
+            else if (isInifinity$1(y)) {
+                point[1] = yAxis.toGlobalCoord(yAxis.getExtent()[dims[1] === 'y0' ? 0 : 1]);
+            }
+        }
+
+        // Use x, y if has any
+        if (!isNaN(xPx)) {
+            point[0] = xPx;
+        }
+        if (!isNaN(yPx)) {
+            point[1] = yPx;
+        }
+    }
+
+    return point;
+}
+
+var dimPermutations = [['x0', 'y0'], ['x1', 'y0'], ['x1', 'y1'], ['x0', 'y1']];
+
+MarkerView.extend({
+
+    type: 'markArea',
+
+    // updateLayout: function (markAreaModel, ecModel, api) {
+    //     ecModel.eachSeries(function (seriesModel) {
+    //         var maModel = seriesModel.markAreaModel;
+    //         if (maModel) {
+    //             var areaData = maModel.getData();
+    //             areaData.each(function (idx) {
+    //                 var points = zrUtil.map(dimPermutations, function (dim) {
+    //                     return getSingleMarkerEndPoint(areaData, idx, dim, seriesModel, api);
+    //                 });
+    //                 // Layout
+    //                 areaData.setItemLayout(idx, points);
+    //                 var el = areaData.getItemGraphicEl(idx);
+    //                 el.setShape('points', points);
+    //             });
+    //         }
+    //     }, this);
+    // },
+
+    updateTransform: function (markAreaModel, ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            var maModel = seriesModel.markAreaModel;
+            if (maModel) {
+                var areaData = maModel.getData();
+                areaData.each(function (idx) {
+                    var points = map(dimPermutations, function (dim) {
+                        return getSingleMarkerEndPoint(areaData, idx, dim, seriesModel, api);
+                    });
+                    // Layout
+                    areaData.setItemLayout(idx, points);
+                    var el = areaData.getItemGraphicEl(idx);
+                    el.setShape('points', points);
+                });
+            }
+        }, this);
+    },
+
+    renderSeries: function (seriesModel, maModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesId = seriesModel.id;
+        var seriesData = seriesModel.getData();
+
+        var areaGroupMap = this.markerGroupMap;
+        var polygonGroup = areaGroupMap.get(seriesId)
+            || areaGroupMap.set(seriesId, {group: new Group()});
+
+        this.group.add(polygonGroup.group);
+        polygonGroup.__keep = true;
+
+        var areaData = createList$3(coordSys, seriesModel, maModel);
+
+        // Line data for tooltip and formatter
+        maModel.setData(areaData);
+
+        // Update visual and layout of line
+        areaData.each(function (idx) {
+            // Layout
+            areaData.setItemLayout(idx, map(dimPermutations, function (dim) {
+                return getSingleMarkerEndPoint(areaData, idx, dim, seriesModel, api);
+            }));
+
+            // Visual
+            areaData.setItemVisual(idx, {
+                color: seriesData.getVisual('color')
+            });
+        });
+
+
+        areaData.diff(polygonGroup.__data)
+            .add(function (idx) {
+                var polygon = new Polygon({
+                    shape: {
+                        points: areaData.getItemLayout(idx)
+                    }
+                });
+                areaData.setItemGraphicEl(idx, polygon);
+                polygonGroup.group.add(polygon);
+            })
+            .update(function (newIdx, oldIdx) {
+                var polygon = polygonGroup.__data.getItemGraphicEl(oldIdx);
+                updateProps(polygon, {
+                    shape: {
+                        points: areaData.getItemLayout(newIdx)
+                    }
+                }, maModel, newIdx);
+                polygonGroup.group.add(polygon);
+                areaData.setItemGraphicEl(newIdx, polygon);
+            })
+            .remove(function (idx) {
+                var polygon = polygonGroup.__data.getItemGraphicEl(idx);
+                polygonGroup.group.remove(polygon);
+            })
+            .execute();
+
+        areaData.eachItemGraphicEl(function (polygon, idx) {
+            var itemModel = areaData.getItemModel(idx);
+            var labelModel = itemModel.getModel('label');
+            var labelHoverModel = itemModel.getModel('emphasis.label');
+            var color = areaData.getItemVisual(idx, 'color');
+            polygon.useStyle(
+                defaults(
+                    itemModel.getModel('itemStyle').getItemStyle(),
+                    {
+                        fill: modifyAlpha(color, 0.4),
+                        stroke: color
+                    }
+                )
+            );
+
+            polygon.hoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+
+            setLabelStyle(
+                polygon.style, polygon.hoverStyle, labelModel, labelHoverModel,
+                {
+                    labelFetcher: maModel,
+                    labelDataIndex: idx,
+                    defaultText: areaData.getName(idx) || '',
+                    isRectText: true,
+                    autoColor: color
+                }
+            );
+
+            setHoverStyle(polygon, {});
+
+            polygon.dataModel = maModel;
+        });
+
+        polygonGroup.__data = areaData;
+
+        polygonGroup.group.silent = maModel.get('silent') || seriesModel.get('silent');
+    }
+});
+
+/**
+ * @inner
+ * @param {module:echarts/coord/*} coordSys
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {module:echarts/model/Model} mpModel
+ */
+function createList$3(coordSys, seriesModel, maModel) {
+
+    var coordDimsInfos;
+    var areaData;
+    var dims = ['x0', 'y0', 'x1', 'y1'];
+    if (coordSys) {
+        coordDimsInfos = map(coordSys && coordSys.dimensions, function (coordDim) {
+            var data = seriesModel.getData();
+            var info = data.getDimensionInfo(
+                data.mapDimension(coordDim)
+            ) || {};
+            // In map series data don't have lng and lat dimension. Fallback to same with coordSys
+            return defaults({name: coordDim}, info);
+        });
+        areaData = new List(map(dims, function (dim, idx) {
+            return {
+                name: dim,
+                type: coordDimsInfos[idx % 2].type
+            };
+        }), maModel);
+    }
+    else {
+        coordDimsInfos =[{
+            name: 'value',
+            type: 'float'
+        }];
+        areaData = new List(coordDimsInfos, maModel);
+    }
+
+    var optData = map(maModel.get('data'), curry(
+        markAreaTransform, seriesModel, coordSys, maModel
+    ));
+    if (coordSys) {
+        optData = filter(
+            optData, curry(markAreaFilter, coordSys)
+        );
+    }
+
+    var dimValueGetter$$1 = coordSys ? function (item, dimName, dataIndex, dimIndex) {
+        return item.coord[Math.floor(dimIndex / 2)][dimIndex % 2];
+    } : function (item) {
+        return item.value;
+    };
+    areaData.initData(optData, null, dimValueGetter$$1);
+    areaData.hasItemOption = true;
+    return areaData;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerPreprocessor(function (opt) {
+    // Make sure markArea component is enabled
+    opt.markArea = opt.markArea || {};
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var preprocessor$3 = function (option) {
+    var timelineOpt = option && option.timeline;
+
+    if (!isArray(timelineOpt)) {
+        timelineOpt = timelineOpt ? [timelineOpt] : [];
+    }
+
+    each$1(timelineOpt, function (opt) {
+        if (!opt) {
+            return;
+        }
+
+        compatibleEC2(opt);
+    });
+};
+
+function compatibleEC2(opt) {
+    var type = opt.type;
+
+    var ec2Types = {'number': 'value', 'time': 'time'};
+
+    // Compatible with ec2
+    if (ec2Types[type]) {
+        opt.axisType = ec2Types[type];
+        delete opt.type;
+    }
+
+    transferItem(opt);
+
+    if (has$2(opt, 'controlPosition')) {
+        var controlStyle = opt.controlStyle || (opt.controlStyle = {});
+        if (!has$2(controlStyle, 'position')) {
+            controlStyle.position = opt.controlPosition;
+        }
+        if (controlStyle.position === 'none' && !has$2(controlStyle, 'show')) {
+            controlStyle.show = false;
+            delete controlStyle.position;
+        }
+        delete opt.controlPosition;
+    }
+
+    each$1(opt.data || [], function (dataItem) {
+        if (isObject$1(dataItem) && !isArray(dataItem)) {
+            if (!has$2(dataItem, 'value') && has$2(dataItem, 'name')) {
+                // In ec2, using name as value.
+                dataItem.value = dataItem.name;
+            }
+            transferItem(dataItem);
+        }
+    });
+}
+
+function transferItem(opt) {
+    var itemStyle = opt.itemStyle || (opt.itemStyle = {});
+
+    var itemStyleEmphasis = itemStyle.emphasis || (itemStyle.emphasis = {});
+
+    // Transfer label out
+    var label = opt.label || (opt.label || {});
+    var labelNormal = label.normal || (label.normal = {});
+    var excludeLabelAttr = {normal: 1, emphasis: 1};
+
+    each$1(label, function (value, name) {
+        if (!excludeLabelAttr[name] && !has$2(labelNormal, name)) {
+            labelNormal[name] = value;
+        }
+    });
+
+    if (itemStyleEmphasis.label && !has$2(label, 'emphasis')) {
+        label.emphasis = itemStyleEmphasis.label;
+        delete itemStyleEmphasis.label;
+    }
+}
+
+function has$2(obj, attr) {
+    return obj.hasOwnProperty(attr);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.registerSubTypeDefaulter('timeline', function () {
+    // Only slider now.
+    return 'slider';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction(
+
+    {type: 'timelineChange', event: 'timelineChanged', update: 'prepareAndUpdate'},
+
+    function (payload, ecModel) {
+
+        var timelineModel = ecModel.getComponent('timeline');
+        if (timelineModel && payload.currentIndex != null) {
+            timelineModel.setCurrentIndex(payload.currentIndex);
+
+            if (!timelineModel.get('loop', true) && timelineModel.isIndexMax()) {
+                timelineModel.setPlayState(false);
+            }
+        }
+
+        // Set normalized currentIndex to payload.
+        ecModel.resetOption('timeline');
+
+        return defaults({
+            currentIndex: timelineModel.option.currentIndex
+        }, payload);
+    }
+);
+
+registerAction(
+
+    {type: 'timelinePlayChange', event: 'timelinePlayChanged', update: 'update'},
+
+    function (payload, ecModel) {
+        var timelineModel = ecModel.getComponent('timeline');
+        if (timelineModel && payload.playState != null) {
+            timelineModel.setPlayState(payload.playState);
+        }
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TimelineModel = ComponentModel.extend({
+
+    type: 'timeline',
+
+    layoutMode: 'box',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+
+        zlevel: 0,                  // 一级层叠
+        z: 4,                       // 二级层叠
+        show: true,
+
+        axisType: 'time',  // 模式是时间类型，支持 value, category
+
+        realtime: true,
+
+        left: '20%',
+        top: null,
+        right: '20%',
+        bottom: 0,
+        width: null,
+        height: 40,
+        padding: 5,
+
+        controlPosition: 'left',           // 'left' 'right' 'top' 'bottom' 'none'
+        autoPlay: false,
+        rewind: false,                     // 反向播放
+        loop: true,
+        playInterval: 2000,                // 播放时间间隔，单位ms
+
+        currentIndex: 0,
+
+        itemStyle: {},
+        label: {
+            color: '#000'
+        },
+
+        data: []
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel) {
+
+        /**
+         * @private
+         * @type {module:echarts/data/List}
+         */
+        this._data;
+
+        /**
+         * @private
+         * @type {Array.<string>}
+         */
+        this._names;
+
+        this.mergeDefaultAndTheme(option, ecModel);
+        this._initData();
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (option) {
+        TimelineModel.superApply(this, 'mergeOption', arguments);
+        this._initData();
+    },
+
+    /**
+     * @param {number} [currentIndex]
+     */
+    setCurrentIndex: function (currentIndex) {
+        if (currentIndex == null) {
+            currentIndex = this.option.currentIndex;
+        }
+        var count = this._data.count();
+
+        if (this.option.loop) {
+            currentIndex = (currentIndex % count + count) % count;
+        }
+        else {
+            currentIndex >= count && (currentIndex = count - 1);
+            currentIndex < 0 && (currentIndex = 0);
+        }
+
+        this.option.currentIndex = currentIndex;
+    },
+
+    /**
+     * @return {number} currentIndex
+     */
+    getCurrentIndex: function () {
+        return this.option.currentIndex;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    isIndexMax: function () {
+        return this.getCurrentIndex() >= this._data.count() - 1;
+    },
+
+    /**
+     * @param {boolean} state true: play, false: stop
+     */
+    setPlayState: function (state) {
+        this.option.autoPlay = !!state;
+    },
+
+    /**
+     * @return {boolean} true: play, false: stop
+     */
+    getPlayState: function () {
+        return !!this.option.autoPlay;
+    },
+
+    /**
+     * @private
+     */
+    _initData: function () {
+        var thisOption = this.option;
+        var dataArr = thisOption.data || [];
+        var axisType = thisOption.axisType;
+        var names = this._names = [];
+
+        if (axisType === 'category') {
+            var idxArr = [];
+            each$1(dataArr, function (item, index) {
+                var value = getDataItemValue(item);
+                var newItem;
+
+                if (isObject$1(item)) {
+                    newItem = clone(item);
+                    newItem.value = index;
+                }
+                else {
+                    newItem = index;
+                }
+
+                idxArr.push(newItem);
+
+                if (!isString(value) && (value == null || isNaN(value))) {
+                    value = '';
+                }
+
+                names.push(value + '');
+            });
+            dataArr = idxArr;
+        }
+
+        var dimType = ({category: 'ordinal', time: 'time'})[axisType] || 'number';
+
+        var data = this._data = new List([{name: 'value', type: dimType}], this);
+
+        data.initData(dataArr, names);
+    },
+
+    getData: function () {
+        return this._data;
+    },
+
+    /**
+     * @public
+     * @return {Array.<string>} categoreis
+     */
+    getCategories: function () {
+        if (this.get('axisType') === 'category') {
+            return this._names.slice();
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var SliderTimelineModel = TimelineModel.extend({
+
+    type: 'timeline.slider',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+
+        backgroundColor: 'rgba(0,0,0,0)',   // 时间轴背景颜色
+        borderColor: '#ccc',               // 时间轴边框颜色
+        borderWidth: 0,                    // 时间轴边框线宽，单位px，默认为0（无边框）
+
+        orient: 'horizontal',              // 'vertical'
+        inverse: false,
+
+        tooltip: {                          // boolean or Object
+            trigger: 'item'                 // data item may also have tootip attr.
+        },
+
+        symbol: 'emptyCircle',
+        symbolSize: 10,
+
+        lineStyle: {
+            show: true,
+            width: 2,
+            color: '#304654'
+        },
+        label: {                            // 文本标签
+            position: 'auto',           // auto left right top bottom
+                                        // When using number, label position is not
+                                        // restricted by viewRect.
+                                        // positive: right/bottom, negative: left/top
+            show: true,
+            interval: 'auto',
+            rotate: 0,
+            // formatter: null,
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            color: '#304654'
+        },
+        itemStyle: {
+            color: '#304654',
+            borderWidth: 1
+        },
+
+        checkpointStyle: {
+            symbol: 'circle',
+            symbolSize: 13,
+            color: '#c23531',
+            borderWidth: 5,
+            borderColor: 'rgba(194,53,49, 0.5)',
+            animation: true,
+            animationDuration: 300,
+            animationEasing: 'quinticInOut'
+        },
+
+        controlStyle: {
+            show: true,
+            showPlayBtn: true,
+            showPrevBtn: true,
+            showNextBtn: true,
+            itemSize: 22,
+            itemGap: 12,
+            position: 'left',  // 'left' 'right' 'top' 'bottom'
+            playIcon: 'path://M31.6,53C17.5,53,6,41.5,6,27.4S17.5,1.8,31.6,1.8C45.7,1.8,57.2,13.3,57.2,27.4S45.7,53,31.6,53z M31.6,3.3 C18.4,3.3,7.5,14.1,7.5,27.4c0,13.3,10.8,24.1,24.1,24.1C44.9,51.5,55.7,40.7,55.7,27.4C55.7,14.1,44.9,3.3,31.6,3.3z M24.9,21.3 c0-2.2,1.6-3.1,3.5-2l10.5,6.1c1.899,1.1,1.899,2.9,0,4l-10.5,6.1c-1.9,1.1-3.5,0.2-3.5-2V21.3z', // jshint ignore:line
+            stopIcon: 'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z', // jshint ignore:line
+            nextIcon: 'path://M18.6,50.8l22.5-22.5c0.2-0.2,0.3-0.4,0.3-0.7c0-0.3-0.1-0.5-0.3-0.7L18.7,4.4c-0.1-0.1-0.2-0.3-0.2-0.5 c0-0.4,0.3-0.8,0.8-0.8c0.2,0,0.5,0.1,0.6,0.3l23.5,23.5l0,0c0.2,0.2,0.3,0.4,0.3,0.7c0,0.3-0.1,0.5-0.3,0.7l-0.1,0.1L19.7,52 c-0.1,0.1-0.3,0.2-0.5,0.2c-0.4,0-0.8-0.3-0.8-0.8C18.4,51.2,18.5,51,18.6,50.8z', // jshint ignore:line
+            prevIcon: 'path://M43,52.8L20.4,30.3c-0.2-0.2-0.3-0.4-0.3-0.7c0-0.3,0.1-0.5,0.3-0.7L42.9,6.4c0.1-0.1,0.2-0.3,0.2-0.5 c0-0.4-0.3-0.8-0.8-0.8c-0.2,0-0.5,0.1-0.6,0.3L18.3,28.8l0,0c-0.2,0.2-0.3,0.4-0.3,0.7c0,0.3,0.1,0.5,0.3,0.7l0.1,0.1L41.9,54 c0.1,0.1,0.3,0.2,0.5,0.2c0.4,0,0.8-0.3,0.8-0.8C43.2,53.2,43.1,53,43,52.8z', // jshint ignore:line
+
+            color: '#304654',
+            borderColor: '#304654',
+            borderWidth: 1
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: '#c23531'
+            },
+
+            itemStyle: {
+                color: '#c23531'
+            },
+
+            controlStyle: {
+                color: '#c23531',
+                borderColor: '#c23531',
+                borderWidth: 2
+            }
+        },
+        data: []
+    }
+
+});
+
+mixin(SliderTimelineModel, dataFormatMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TimelineView = Component.extend({
+    type: 'timeline'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Extend axis 2d
+ * @constructor module:echarts/coord/cartesian/Axis2D
+ * @extends {module:echarts/coord/cartesian/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ * @param {string} position
+ */
+var TimelineAxis = function (dim, scale, coordExtent, axisType) {
+
+    Axis.call(this, dim, scale, coordExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * Axis model
+     * @param {module:echarts/component/TimelineModel}
+     */
+    this.model = null;
+};
+
+TimelineAxis.prototype = {
+
+    constructor: TimelineAxis,
+
+    /**
+     * @override
+     */
+    getLabelModel: function () {
+        return this.model.getModel('label');
+    },
+
+    /**
+     * @override
+     */
+    isHorizontal: function () {
+        return this.model.get('orient') === 'horizontal';
+    }
+
+};
+
+inherits(TimelineAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$6 = bind;
+var each$27 = each$1;
+
+var PI$4 = Math.PI;
+
+TimelineView.extend({
+
+    type: 'timeline.slider',
+
+    init: function (ecModel, api) {
+
+        this.api = api;
+
+        /**
+         * @private
+         * @type {module:echarts/component/timeline/TimelineAxis}
+         */
+        this._axis;
+
+        /**
+         * @private
+         * @type {module:zrender/core/BoundingRect}
+         */
+        this._viewRect;
+
+        /**
+         * @type {number}
+         */
+        this._timer;
+
+        /**
+         * @type {module:zrender/Element}
+         */
+        this._currentPointer;
+
+        /**
+         * @type {module:zrender/container/Group}
+         */
+        this._mainGroup;
+
+        /**
+         * @type {module:zrender/container/Group}
+         */
+        this._labelGroup;
+    },
+
+    /**
+     * @override
+     */
+    render: function (timelineModel, ecModel, api, payload) {
+        this.model = timelineModel;
+        this.api = api;
+        this.ecModel = ecModel;
+
+        this.group.removeAll();
+
+        if (timelineModel.get('show', true)) {
+
+            var layoutInfo = this._layout(timelineModel, api);
+            var mainGroup = this._createGroup('mainGroup');
+            var labelGroup = this._createGroup('labelGroup');
+
+            /**
+             * @private
+             * @type {module:echarts/component/timeline/TimelineAxis}
+             */
+            var axis = this._axis = this._createAxis(layoutInfo, timelineModel);
+
+            timelineModel.formatTooltip = function (dataIndex) {
+                return encodeHTML(axis.scale.getLabel(dataIndex));
+            };
+
+            each$27(
+                ['AxisLine', 'AxisTick', 'Control', 'CurrentPointer'],
+                function (name) {
+                    this['_render' + name](layoutInfo, mainGroup, axis, timelineModel);
+                },
+                this
+            );
+
+            this._renderAxisLabel(layoutInfo, labelGroup, axis, timelineModel);
+            this._position(layoutInfo, timelineModel);
+        }
+
+        this._doPlayStop();
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._clearTimer();
+        this.group.removeAll();
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._clearTimer();
+    },
+
+    _layout: function (timelineModel, api) {
+        var labelPosOpt = timelineModel.get('label.position');
+        var orient = timelineModel.get('orient');
+        var viewRect = getViewRect$4(timelineModel, api);
+        // Auto label offset.
+        if (labelPosOpt == null || labelPosOpt === 'auto') {
+            labelPosOpt = orient === 'horizontal'
+                ? ((viewRect.y + viewRect.height / 2) < api.getHeight() / 2 ? '-' : '+')
+                : ((viewRect.x + viewRect.width / 2) < api.getWidth() / 2 ? '+' : '-');
+        }
+        else if (isNaN(labelPosOpt)) {
+            labelPosOpt = ({
+                horizontal: {top: '-', bottom: '+'},
+                vertical: {left: '-', right: '+'}
+            })[orient][labelPosOpt];
+        }
+
+        var labelAlignMap = {
+            horizontal: 'center',
+            vertical: (labelPosOpt >= 0 || labelPosOpt === '+') ? 'left' : 'right'
+        };
+
+        var labelBaselineMap = {
+            horizontal: (labelPosOpt >= 0 || labelPosOpt === '+') ? 'top' : 'bottom',
+            vertical: 'middle'
+        };
+        var rotationMap = {
+            horizontal: 0,
+            vertical: PI$4 / 2
+        };
+
+        // Position
+        var mainLength = orient === 'vertical' ? viewRect.height : viewRect.width;
+
+        var controlModel = timelineModel.getModel('controlStyle');
+        var showControl = controlModel.get('show', true);
+        var controlSize = showControl ? controlModel.get('itemSize') : 0;
+        var controlGap = showControl ? controlModel.get('itemGap') : 0;
+        var sizePlusGap = controlSize + controlGap;
+
+        // Special label rotate.
+        var labelRotation = timelineModel.get('label.rotate') || 0;
+        labelRotation = labelRotation * PI$4 / 180; // To radian.
+
+        var playPosition;
+        var prevBtnPosition;
+        var nextBtnPosition;
+        var axisExtent;
+        var controlPosition = controlModel.get('position', true);
+        var showPlayBtn = showControl && controlModel.get('showPlayBtn', true);
+        var showPrevBtn = showControl && controlModel.get('showPrevBtn', true);
+        var showNextBtn = showControl && controlModel.get('showNextBtn', true);
+        var xLeft = 0;
+        var xRight = mainLength;
+
+        // position[0] means left, position[1] means middle.
+        if (controlPosition === 'left' || controlPosition === 'bottom') {
+            showPlayBtn && (playPosition = [0, 0], xLeft += sizePlusGap);
+            showPrevBtn && (prevBtnPosition = [xLeft, 0], xLeft += sizePlusGap);
+            showNextBtn && (nextBtnPosition = [xRight - controlSize, 0], xRight -= sizePlusGap);
+        }
+        else { // 'top' 'right'
+            showPlayBtn && (playPosition = [xRight - controlSize, 0], xRight -= sizePlusGap);
+            showPrevBtn && (prevBtnPosition = [0, 0], xLeft += sizePlusGap);
+            showNextBtn && (nextBtnPosition = [xRight - controlSize, 0], xRight -= sizePlusGap);
+        }
+        axisExtent = [xLeft, xRight];
+
+        if (timelineModel.get('inverse')) {
+            axisExtent.reverse();
+        }
+
+        return {
+            viewRect: viewRect,
+            mainLength: mainLength,
+            orient: orient,
+
+            rotation: rotationMap[orient],
+            labelRotation: labelRotation,
+            labelPosOpt: labelPosOpt,
+            labelAlign: timelineModel.get('label.align') || labelAlignMap[orient],
+            labelBaseline: timelineModel.get('label.verticalAlign')
+                || timelineModel.get('label.baseline')
+                || labelBaselineMap[orient],
+
+            // Based on mainGroup.
+            playPosition: playPosition,
+            prevBtnPosition: prevBtnPosition,
+            nextBtnPosition: nextBtnPosition,
+            axisExtent: axisExtent,
+
+            controlSize: controlSize,
+            controlGap: controlGap
+        };
+    },
+
+    _position: function (layoutInfo, timelineModel) {
+        // Position is be called finally, because bounding rect is needed for
+        // adapt content to fill viewRect (auto adapt offset).
+
+        // Timeline may be not all in the viewRect when 'offset' is specified
+        // as a number, because it is more appropriate that label aligns at
+        // 'offset' but not the other edge defined by viewRect.
+
+        var mainGroup = this._mainGroup;
+        var labelGroup = this._labelGroup;
+
+        var viewRect = layoutInfo.viewRect;
+        if (layoutInfo.orient === 'vertical') {
+            // transform to horizontal, inverse rotate by left-top point.
+            var m = create$1();
+            var rotateOriginX = viewRect.x;
+            var rotateOriginY = viewRect.y + viewRect.height;
+            translate(m, m, [-rotateOriginX, -rotateOriginY]);
+            rotate(m, m, -PI$4 / 2);
+            translate(m, m, [rotateOriginX, rotateOriginY]);
+            viewRect = viewRect.clone();
+            viewRect.applyTransform(m);
+        }
+
+        var viewBound = getBound(viewRect);
+        var mainBound = getBound(mainGroup.getBoundingRect());
+        var labelBound = getBound(labelGroup.getBoundingRect());
+
+        var mainPosition = mainGroup.position;
+        var labelsPosition = labelGroup.position;
+
+        labelsPosition[0] = mainPosition[0] = viewBound[0][0];
+
+        var labelPosOpt = layoutInfo.labelPosOpt;
+
+        if (isNaN(labelPosOpt)) { // '+' or '-'
+            var mainBoundIdx = labelPosOpt === '+' ? 0 : 1;
+            toBound(mainPosition, mainBound, viewBound, 1, mainBoundIdx);
+            toBound(labelsPosition, labelBound, viewBound, 1, 1 - mainBoundIdx);
+        }
+        else {
+            var mainBoundIdx = labelPosOpt >= 0 ? 0 : 1;
+            toBound(mainPosition, mainBound, viewBound, 1, mainBoundIdx);
+            labelsPosition[1] = mainPosition[1] + labelPosOpt;
+        }
+
+        mainGroup.attr('position', mainPosition);
+        labelGroup.attr('position', labelsPosition);
+        mainGroup.rotation = labelGroup.rotation = layoutInfo.rotation;
+
+        setOrigin(mainGroup);
+        setOrigin(labelGroup);
+
+        function setOrigin(targetGroup) {
+            var pos = targetGroup.position;
+            targetGroup.origin = [
+                viewBound[0][0] - pos[0],
+                viewBound[1][0] - pos[1]
+            ];
+        }
+
+        function getBound(rect) {
+            // [[xmin, xmax], [ymin, ymax]]
+            return [
+                [rect.x, rect.x + rect.width],
+                [rect.y, rect.y + rect.height]
+            ];
+        }
+
+        function toBound(fromPos, from, to, dimIdx, boundIdx) {
+            fromPos[dimIdx] += to[dimIdx][boundIdx] - from[dimIdx][boundIdx];
+        }
+    },
+
+    _createAxis: function (layoutInfo, timelineModel) {
+        var data = timelineModel.getData();
+        var axisType = timelineModel.get('axisType');
+
+        var scale = createScaleByModel(timelineModel, axisType);
+
+        // Customize scale. The `tickValue` is `dataIndex`.
+        scale.getTicks = function () {
+            return data.mapArray(['value'], function (value) {
+                return value;
+            });
+        };
+
+        var dataExtent = data.getDataExtent('value');
+        scale.setExtent(dataExtent[0], dataExtent[1]);
+        scale.niceTicks();
+
+        var axis = new TimelineAxis('value', scale, layoutInfo.axisExtent, axisType);
+        axis.model = timelineModel;
+
+        return axis;
+    },
+
+    _createGroup: function (name) {
+        var newGroup = this['_' + name] = new Group();
+        this.group.add(newGroup);
+        return newGroup;
+    },
+
+    _renderAxisLine: function (layoutInfo, group, axis, timelineModel) {
+        var axisExtent = axis.getExtent();
+
+        if (!timelineModel.get('lineStyle.show')) {
+            return;
+        }
+
+        group.add(new Line({
+            shape: {
+                x1: axisExtent[0], y1: 0,
+                x2: axisExtent[1], y2: 0
+            },
+            style: extend(
+                {lineCap: 'round'},
+                timelineModel.getModel('lineStyle').getLineStyle()
+            ),
+            silent: true,
+            z2: 1
+        }));
+    },
+
+    /**
+     * @private
+     */
+    _renderAxisTick: function (layoutInfo, group, axis, timelineModel) {
+        var data = timelineModel.getData();
+        // Show all ticks, despite ignoring strategy.
+        var ticks = axis.scale.getTicks();
+
+        // The value is dataIndex, see the costomized scale.
+        each$27(ticks, function (value) {
+            var tickCoord = axis.dataToCoord(value);
+            var itemModel = data.getItemModel(value);
+            var itemStyleModel = itemModel.getModel('itemStyle');
+            var hoverStyleModel = itemModel.getModel('emphasis.itemStyle');
+            var symbolOpt = {
+                position: [tickCoord, 0],
+                onclick: bind$6(this._changeTimeline, this, value)
+            };
+            var el = giveSymbol(itemModel, itemStyleModel, group, symbolOpt);
+            setHoverStyle(el, hoverStyleModel.getItemStyle());
+
+            if (itemModel.get('tooltip')) {
+                el.dataIndex = value;
+                el.dataModel = timelineModel;
+            }
+            else {
+                el.dataIndex = el.dataModel = null;
+            }
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _renderAxisLabel: function (layoutInfo, group, axis, timelineModel) {
+        var labelModel = axis.getLabelModel();
+
+        if (!labelModel.get('show')) {
+            return;
+        }
+
+        var data = timelineModel.getData();
+        var labels = axis.getViewLabels();
+
+        each$27(labels, function (labelItem) {
+            // The tickValue is dataIndex, see the costomized scale.
+            var dataIndex = labelItem.tickValue;
+
+            var itemModel = data.getItemModel(dataIndex);
+            var normalLabelModel = itemModel.getModel('label');
+            var hoverLabelModel = itemModel.getModel('emphasis.label');
+            var tickCoord = axis.dataToCoord(labelItem.tickValue);
+            var textEl = new Text({
+                position: [tickCoord, 0],
+                rotation: layoutInfo.labelRotation - layoutInfo.rotation,
+                onclick: bind$6(this._changeTimeline, this, dataIndex),
+                silent: false
+            });
+            setTextStyle(textEl.style, normalLabelModel, {
+                text: labelItem.formattedLabel,
+                textAlign: layoutInfo.labelAlign,
+                textVerticalAlign: layoutInfo.labelBaseline
+            });
+
+            group.add(textEl);
+            setHoverStyle(
+                textEl, setTextStyle({}, hoverLabelModel)
+            );
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _renderControl: function (layoutInfo, group, axis, timelineModel) {
+        var controlSize = layoutInfo.controlSize;
+        var rotation = layoutInfo.rotation;
+
+        var itemStyle = timelineModel.getModel('controlStyle').getItemStyle();
+        var hoverStyle = timelineModel.getModel('emphasis.controlStyle').getItemStyle();
+        var rect = [0, -controlSize / 2, controlSize, controlSize];
+        var playState = timelineModel.getPlayState();
+        var inverse = timelineModel.get('inverse', true);
+
+        makeBtn(
+            layoutInfo.nextBtnPosition,
+            'controlStyle.nextIcon',
+            bind$6(this._changeTimeline, this, inverse ? '-' : '+')
+        );
+        makeBtn(
+            layoutInfo.prevBtnPosition,
+            'controlStyle.prevIcon',
+            bind$6(this._changeTimeline, this, inverse ? '+' : '-')
+        );
+        makeBtn(
+            layoutInfo.playPosition,
+            'controlStyle.' + (playState ? 'stopIcon' : 'playIcon'),
+            bind$6(this._handlePlayClick, this, !playState),
+            true
+        );
+
+        function makeBtn(position, iconPath, onclick, willRotate) {
+            if (!position) {
+                return;
+            }
+            var opt = {
+                position: position,
+                origin: [controlSize / 2, 0],
+                rotation: willRotate ? -rotation : 0,
+                rectHover: true,
+                style: itemStyle,
+                onclick: onclick
+            };
+            var btn = makeIcon(timelineModel, iconPath, rect, opt);
+            group.add(btn);
+            setHoverStyle(btn, hoverStyle);
+        }
+    },
+
+    _renderCurrentPointer: function (layoutInfo, group, axis, timelineModel) {
+        var data = timelineModel.getData();
+        var currentIndex = timelineModel.getCurrentIndex();
+        var pointerModel = data.getItemModel(currentIndex).getModel('checkpointStyle');
+        var me = this;
+
+        var callback = {
+            onCreate: function (pointer) {
+                pointer.draggable = true;
+                pointer.drift = bind$6(me._handlePointerDrag, me);
+                pointer.ondragend = bind$6(me._handlePointerDragend, me);
+                pointerMoveTo(pointer, currentIndex, axis, timelineModel, true);
+            },
+            onUpdate: function (pointer) {
+                pointerMoveTo(pointer, currentIndex, axis, timelineModel);
+            }
+        };
+
+        // Reuse when exists, for animation and drag.
+        this._currentPointer = giveSymbol(
+            pointerModel, pointerModel, this._mainGroup, {}, this._currentPointer, callback
+        );
+    },
+
+    _handlePlayClick: function (nextState) {
+        this._clearTimer();
+        this.api.dispatchAction({
+            type: 'timelinePlayChange',
+            playState: nextState,
+            from: this.uid
+        });
+    },
+
+    _handlePointerDrag: function (dx, dy, e) {
+        this._clearTimer();
+        this._pointerChangeTimeline([e.offsetX, e.offsetY]);
+    },
+
+    _handlePointerDragend: function (e) {
+        this._pointerChangeTimeline([e.offsetX, e.offsetY], true);
+    },
+
+    _pointerChangeTimeline: function (mousePos, trigger) {
+        var toCoord = this._toAxisCoord(mousePos)[0];
+
+        var axis = this._axis;
+        var axisExtent = asc(axis.getExtent().slice());
+
+        toCoord > axisExtent[1] && (toCoord = axisExtent[1]);
+        toCoord < axisExtent[0] && (toCoord = axisExtent[0]);
+
+        this._currentPointer.position[0] = toCoord;
+        this._currentPointer.dirty();
+
+        var targetDataIndex = this._findNearestTick(toCoord);
+        var timelineModel = this.model;
+
+        if (trigger || (
+            targetDataIndex !== timelineModel.getCurrentIndex()
+            && timelineModel.get('realtime')
+        )) {
+            this._changeTimeline(targetDataIndex);
+        }
+    },
+
+    _doPlayStop: function () {
+        this._clearTimer();
+
+        if (this.model.getPlayState()) {
+            this._timer = setTimeout(
+                bind$6(handleFrame, this),
+                this.model.get('playInterval')
+            );
+        }
+
+        function handleFrame() {
+            // Do not cache
+            var timelineModel = this.model;
+            this._changeTimeline(
+                timelineModel.getCurrentIndex()
+                + (timelineModel.get('rewind', true) ? -1 : 1)
+            );
+        }
+    },
+
+    _toAxisCoord: function (vertex) {
+        var trans = this._mainGroup.getLocalTransform();
+        return applyTransform$1(vertex, trans, true);
+    },
+
+    _findNearestTick: function (axisCoord) {
+        var data = this.model.getData();
+        var dist = Infinity;
+        var targetDataIndex;
+        var axis = this._axis;
+
+        data.each(['value'], function (value, dataIndex) {
+            var coord = axis.dataToCoord(value);
+            var d = Math.abs(coord - axisCoord);
+            if (d < dist) {
+                dist = d;
+                targetDataIndex = dataIndex;
+            }
+        });
+
+        return targetDataIndex;
+    },
+
+    _clearTimer: function () {
+        if (this._timer) {
+            clearTimeout(this._timer);
+            this._timer = null;
+        }
+    },
+
+    _changeTimeline: function (nextIndex) {
+        var currentIndex = this.model.getCurrentIndex();
+
+        if (nextIndex === '+') {
+            nextIndex = currentIndex + 1;
+        }
+        else if (nextIndex === '-') {
+            nextIndex = currentIndex - 1;
+        }
+
+        this.api.dispatchAction({
+            type: 'timelineChange',
+            currentIndex: nextIndex,
+            from: this.uid
+        });
+    }
+
+});
+
+function getViewRect$4(model, api) {
+    return getLayoutRect(
+        model.getBoxLayoutParams(),
+        {
+            width: api.getWidth(),
+            height: api.getHeight()
+        },
+        model.get('padding')
+    );
+}
+
+function makeIcon(timelineModel, objPath, rect, opts) {
+    var icon = makePath(
+        timelineModel.get(objPath).replace(/^path:\/\//, ''),
+        clone(opts || {}),
+        new BoundingRect(rect[0], rect[1], rect[2], rect[3]),
+        'center'
+    );
+
+    return icon;
+}
+
+/**
+ * Create symbol or update symbol
+ * opt: basic position and event handlers
+ */
+function giveSymbol(hostModel, itemStyleModel, group, opt, symbol, callback) {
+    var color = itemStyleModel.get('color');
+
+    if (!symbol) {
+        var symbolType = hostModel.get('symbol');
+        symbol = createSymbol(symbolType, -1, -1, 2, 2, color);
+        symbol.setStyle('strokeNoScale', true);
+        group.add(symbol);
+        callback && callback.onCreate(symbol);
+    }
+    else {
+        symbol.setColor(color);
+        group.add(symbol); // Group may be new, also need to add.
+        callback && callback.onUpdate(symbol);
+    }
+
+    // Style
+    var itemStyle = itemStyleModel.getItemStyle(['color', 'symbol', 'symbolSize']);
+    symbol.setStyle(itemStyle);
+
+    // Transform and events.
+    opt = merge({
+        rectHover: true,
+        z2: 100
+    }, opt, true);
+
+    var symbolSize = hostModel.get('symbolSize');
+    symbolSize = symbolSize instanceof Array
+        ? symbolSize.slice()
+        : [+symbolSize, +symbolSize];
+    symbolSize[0] /= 2;
+    symbolSize[1] /= 2;
+    opt.scale = symbolSize;
+
+    var symbolOffset = hostModel.get('symbolOffset');
+    if (symbolOffset) {
+        var pos = opt.position = opt.position || [0, 0];
+        pos[0] += parsePercent$1(symbolOffset[0], symbolSize[0]);
+        pos[1] += parsePercent$1(symbolOffset[1], symbolSize[1]);
+    }
+
+    var symbolRotate = hostModel.get('symbolRotate');
+    opt.rotation = (symbolRotate || 0) * Math.PI / 180 || 0;
+
+    symbol.attr(opt);
+
+    // FIXME
+    // (1) When symbol.style.strokeNoScale is true and updateTransform is not performed,
+    // getBoundingRect will return wrong result.
+    // (This is supposed to be resolved in zrender, but it is a little difficult to
+    // leverage performance and auto updateTransform)
+    // (2) All of ancesters of symbol do not scale, so we can just updateTransform symbol.
+    symbol.updateTransform();
+
+    return symbol;
+}
+
+function pointerMoveTo(pointer, dataIndex, axis, timelineModel, noAnimation) {
+    if (pointer.dragging) {
+        return;
+    }
+
+    var pointerModel = timelineModel.getModel('checkpointStyle');
+    var toCoord = axis.dataToCoord(timelineModel.getData().get(['value'], dataIndex));
+
+    if (noAnimation || !pointerModel.get('animation', true)) {
+        pointer.attr({position: [toCoord, 0]});
+    }
+    else {
+        pointer.stopAnimation(true);
+        pointer.animateTo(
+            {position: [toCoord, 0]},
+            pointerModel.get('animationDuration', true),
+            pointerModel.get('animationEasing', true)
+        );
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+registerPreprocessor(preprocessor$3);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ToolboxModel = extendComponentModel({
+
+    type: 'toolbox',
+
+    layoutMode: {
+        type: 'box',
+        ignoreSize: true
+    },
+
+    optionUpdated: function () {
+        ToolboxModel.superApply(this, 'optionUpdated', arguments);
+
+        each$1(this.option.feature, function (featureOpt, featureName) {
+            var Feature = get$1(featureName);
+            Feature && merge(featureOpt, Feature.defaultOption);
+        });
+    },
+
+    defaultOption: {
+
+        show: true,
+
+        z: 6,
+
+        zlevel: 0,
+
+        orient: 'horizontal',
+
+        left: 'right',
+
+        top: 'top',
+
+        // right
+        // bottom
+
+        backgroundColor: 'transparent',
+
+        borderColor: '#ccc',
+
+        borderRadius: 0,
+
+        borderWidth: 0,
+
+        padding: 5,
+
+        itemSize: 15,
+
+        itemGap: 8,
+
+        showTitle: true,
+
+        iconStyle: {
+            borderColor: '#666',
+            color: 'none'
+        },
+        emphasis: {
+            iconStyle: {
+                borderColor: '#3E98C5'
+            }
+        }
+        // textStyle: {},
+
+        // feature
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+
+    type: 'toolbox',
+
+    render: function (toolboxModel, ecModel, api, payload) {
+        var group = this.group;
+        group.removeAll();
+
+        if (!toolboxModel.get('show')) {
+            return;
+        }
+
+        var itemSize = +toolboxModel.get('itemSize');
+        var featureOpts = toolboxModel.get('feature') || {};
+        var features = this._features || (this._features = {});
+
+        var featureNames = [];
+        each$1(featureOpts, function (opt, name) {
+            featureNames.push(name);
+        });
+
+        (new DataDiffer(this._featureNames || [], featureNames))
+            .add(processFeature)
+            .update(processFeature)
+            .remove(curry(processFeature, null))
+            .execute();
+
+        // Keep for diff.
+        this._featureNames = featureNames;
+
+        function processFeature(newIndex, oldIndex) {
+            var featureName = featureNames[newIndex];
+            var oldName = featureNames[oldIndex];
+            var featureOpt = featureOpts[featureName];
+            var featureModel = new Model(featureOpt, toolboxModel, toolboxModel.ecModel);
+            var feature;
+
+            if (featureName && !oldName) { // Create
+                if (isUserFeatureName(featureName)) {
+                    feature = {
+                        model: featureModel,
+                        onclick: featureModel.option.onclick,
+                        featureName: featureName
+                    };
+                }
+                else {
+                    var Feature = get$1(featureName);
+                    if (!Feature) {
+                        return;
+                    }
+                    feature = new Feature(featureModel, ecModel, api);
+                }
+                features[featureName] = feature;
+            }
+            else {
+                feature = features[oldName];
+                // If feature does not exsit.
+                if (!feature) {
+                    return;
+                }
+                feature.model = featureModel;
+                feature.ecModel = ecModel;
+                feature.api = api;
+            }
+
+            if (!featureName && oldName) {
+                feature.dispose && feature.dispose(ecModel, api);
+                return;
+            }
+
+            if (!featureModel.get('show') || feature.unusable) {
+                feature.remove && feature.remove(ecModel, api);
+                return;
+            }
+
+            createIconPaths(featureModel, feature, featureName);
+
+            featureModel.setIconStatus = function (iconName, status) {
+                var option = this.option;
+                var iconPaths = this.iconPaths;
+                option.iconStatus = option.iconStatus || {};
+                option.iconStatus[iconName] = status;
+                // FIXME
+                iconPaths[iconName] && iconPaths[iconName].trigger(status);
+            };
+
+            if (feature.render) {
+                feature.render(featureModel, ecModel, api, payload);
+            }
+        }
+
+        function createIconPaths(featureModel, feature, featureName) {
+            var iconStyleModel = featureModel.getModel('iconStyle');
+            var iconStyleEmphasisModel = featureModel.getModel('emphasis.iconStyle');
+
+            // If one feature has mutiple icon. they are orginaized as
+            // {
+            //     icon: {
+            //         foo: '',
+            //         bar: ''
+            //     },
+            //     title: {
+            //         foo: '',
+            //         bar: ''
+            //     }
+            // }
+            var icons = feature.getIcons ? feature.getIcons() : featureModel.get('icon');
+            var titles = featureModel.get('title') || {};
+            if (typeof icons === 'string') {
+                var icon = icons;
+                var title = titles;
+                icons = {};
+                titles = {};
+                icons[featureName] = icon;
+                titles[featureName] = title;
+            }
+            var iconPaths = featureModel.iconPaths = {};
+            each$1(icons, function (iconStr, iconName) {
+                var path = createIcon(
+                    iconStr,
+                    {},
+                    {
+                        x: -itemSize / 2,
+                        y: -itemSize / 2,
+                        width: itemSize,
+                        height: itemSize
+                    }
+                );
+                path.setStyle(iconStyleModel.getItemStyle());
+                path.hoverStyle = iconStyleEmphasisModel.getItemStyle();
+
+                setHoverStyle(path);
+
+                if (toolboxModel.get('showTitle')) {
+                    path.__title = titles[iconName];
+                    path.on('mouseover', function () {
+                            // Should not reuse above hoverStyle, which might be modified.
+                            var hoverStyle = iconStyleEmphasisModel.getItemStyle();
+                            path.setStyle({
+                                text: titles[iconName],
+                                textPosition: hoverStyle.textPosition || 'bottom',
+                                textFill: hoverStyle.fill || hoverStyle.stroke || '#000',
+                                textAlign: hoverStyle.textAlign || 'center'
+                            });
+                        })
+                        .on('mouseout', function () {
+                            path.setStyle({
+                                textFill: null
+                            });
+                        });
+                }
+                path.trigger(featureModel.get('iconStatus.' + iconName) || 'normal');
+
+                group.add(path);
+                path.on('click', bind(
+                    feature.onclick, feature, ecModel, api, iconName
+                ));
+
+                iconPaths[iconName] = path;
+            });
+        }
+
+        layout$3(group, toolboxModel, api);
+        // Render background after group is layout
+        // FIXME
+        group.add(makeBackground(group.getBoundingRect(), toolboxModel));
+
+        // Adjust icon title positions to avoid them out of screen
+        group.eachChild(function (icon) {
+            var titleText = icon.__title;
+            var hoverStyle = icon.hoverStyle;
+            // May be background element
+            if (hoverStyle && titleText) {
+                var rect = getBoundingRect(
+                    titleText, makeFont(hoverStyle)
+                );
+                var offsetX = icon.position[0] + group.position[0];
+                var offsetY = icon.position[1] + group.position[1] + itemSize;
+
+                var needPutOnTop = false;
+                if (offsetY + rect.height > api.getHeight()) {
+                    hoverStyle.textPosition = 'top';
+                    needPutOnTop = true;
+                }
+                var topOffset = needPutOnTop ? (-5 - rect.height) : (itemSize + 8);
+                if (offsetX + rect.width /  2 > api.getWidth()) {
+                    hoverStyle.textPosition = ['100%', topOffset];
+                    hoverStyle.textAlign = 'right';
+                }
+                else if (offsetX - rect.width / 2 < 0) {
+                    hoverStyle.textPosition = [0, topOffset];
+                    hoverStyle.textAlign = 'left';
+                }
+            }
+        });
+    },
+
+    updateView: function (toolboxModel, ecModel, api, payload) {
+        each$1(this._features, function (feature) {
+            feature.updateView && feature.updateView(feature.model, ecModel, api, payload);
+        });
+    },
+
+    // updateLayout: function (toolboxModel, ecModel, api, payload) {
+    //     zrUtil.each(this._features, function (feature) {
+    //         feature.updateLayout && feature.updateLayout(feature.model, ecModel, api, payload);
+    //     });
+    // },
+
+    remove: function (ecModel, api) {
+        each$1(this._features, function (feature) {
+            feature.remove && feature.remove(ecModel, api);
+        });
+        this.group.removeAll();
+    },
+
+    dispose: function (ecModel, api) {
+        each$1(this._features, function (feature) {
+            feature.dispose && feature.dispose(ecModel, api);
+        });
+    }
+});
+
+function isUserFeatureName(featureName) {
+    return featureName.indexOf('my') === 0;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var saveAsImageLang = lang.toolbox.saveAsImage;
+
+function SaveAsImage(model) {
+    this.model = model;
+}
+
+SaveAsImage.defaultOption = {
+    show: true,
+    icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+    title: saveAsImageLang.title,
+    type: 'png',
+    // Default use option.backgroundColor
+    // backgroundColor: '#fff',
+    name: '',
+    excludeComponents: ['toolbox'],
+    pixelRatio: 1,
+    lang: saveAsImageLang.lang.slice()
+};
+
+SaveAsImage.prototype.unusable = !env$1.canvasSupported;
+
+var proto$4 = SaveAsImage.prototype;
+
+proto$4.onclick = function (ecModel, api) {
+    var model = this.model;
+    var title = model.get('name') || ecModel.get('title.0.text') || 'echarts';
+    var $a = document.createElement('a');
+    var type = model.get('type', true) || 'png';
+    $a.download = title + '.' + type;
+    $a.target = '_blank';
+    var url = api.getConnectedDataURL({
+        type: type,
+        backgroundColor: model.get('backgroundColor', true)
+            || ecModel.get('backgroundColor') || '#fff',
+        excludeComponents: model.get('excludeComponents'),
+        pixelRatio: model.get('pixelRatio')
+    });
+    $a.href = url;
+    // Chrome and Firefox
+    if (typeof MouseEvent === 'function' && !env$1.browser.ie && !env$1.browser.edge) {
+        var evt = new MouseEvent('click', {
+            view: window,
+            bubbles: true,
+            cancelable: false
+        });
+        $a.dispatchEvent(evt);
+    }
+    // IE
+    else {
+        if (window.navigator.msSaveOrOpenBlob) {
+            var bstr = atob(url.split(',')[1]);
+            var n = bstr.length;
+            var u8arr = new Uint8Array(n);
+            while(n--) {
+                u8arr[n] = bstr.charCodeAt(n);
+            }
+            var blob = new Blob([u8arr]);
+            window.navigator.msSaveOrOpenBlob(blob, title + '.' + type);
+        }
+        else {
+            var lang$$1 = model.get('lang');
+            var html = '' +
+                '<body style="margin:0;">' +
+                '<img src="' + url + '" style="max-width:100%;" title="' + ((lang$$1 && lang$$1[0]) || '') + '" />' +
+                '</body>';
+            var tab = window.open();
+            tab.document.write(html);
+        }
+    }
+};
+
+register$1(
+    'saveAsImage', SaveAsImage
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var magicTypeLang = lang.toolbox.magicType;
+
+function MagicType(model) {
+    this.model = model;
+}
+
+MagicType.defaultOption = {
+    show: true,
+    type: [],
+    // Icon group
+    icon: {
+        line: 'M4.1,28.9h7.1l9.3-22l7.4,38l9.7-19.7l3,12.8h14.9M4.1,58h51.4',
+        bar: 'M6.7,22.9h10V48h-10V22.9zM24.9,13h10v35h-10V13zM43.2,2h10v46h-10V2zM3.1,58h53.7',
+        stack: 'M8.2,38.4l-8.4,4.1l30.6,15.3L60,42.5l-8.1-4.1l-21.5,11L8.2,38.4z M51.9,30l-8.1,4.2l-13.4,6.9l-13.9-6.9L8.2,30l-8.4,4.2l8.4,4.2l22.2,11l21.5-11l8.1-4.2L51.9,30z M51.9,21.7l-8.1,4.2L35.7,30l-5.3,2.8L24.9,30l-8.4-4.1l-8.3-4.2l-8.4,4.2L8.2,30l8.3,4.2l13.9,6.9l13.4-6.9l8.1-4.2l8.1-4.1L51.9,21.7zM30.4,2.2L-0.2,17.5l8.4,4.1l8.3,4.2l8.4,4.2l5.5,2.7l5.3-2.7l8.1-4.2l8.1-4.2l8.1-4.1L30.4,2.2z', // jshint ignore:line
+        tiled: 'M2.3,2.2h22.8V25H2.3V2.2z M35,2.2h22.8V25H35V2.2zM2.3,35h22.8v22.8H2.3V35z M35,35h22.8v22.8H35V35z'
+    },
+    // `line`, `bar`, `stack`, `tiled`
+    title: clone(magicTypeLang.title),
+    option: {},
+    seriesIndex: {}
+};
+
+var proto$5 = MagicType.prototype;
+
+proto$5.getIcons = function () {
+    var model = this.model;
+    var availableIcons = model.get('icon');
+    var icons = {};
+    each$1(model.get('type'), function (type) {
+        if (availableIcons[type]) {
+            icons[type] = availableIcons[type];
+        }
+    });
+    return icons;
+};
+
+var seriesOptGenreator = {
+    'line': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'bar') {
+            return merge({
+                id: seriesId,
+                type: 'line',
+                // Preserve data related option
+                data: seriesModel.get('data'),
+                stack: seriesModel.get('stack'),
+                markPoint: seriesModel.get('markPoint'),
+                markLine: seriesModel.get('markLine')
+            }, model.get('option.line') || {}, true);
+        }
+    },
+    'bar': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'line') {
+            return merge({
+                id: seriesId,
+                type: 'bar',
+                // Preserve data related option
+                data: seriesModel.get('data'),
+                stack: seriesModel.get('stack'),
+                markPoint: seriesModel.get('markPoint'),
+                markLine: seriesModel.get('markLine')
+            }, model.get('option.bar') || {}, true);
+        }
+    },
+    'stack': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'line' || seriesType === 'bar') {
+            return merge({
+                id: seriesId,
+                stack: '__ec_magicType_stack__'
+            }, model.get('option.stack') || {}, true);
+        }
+    },
+    'tiled': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'line' || seriesType === 'bar') {
+            return merge({
+                id: seriesId,
+                stack: ''
+            }, model.get('option.tiled') || {}, true);
+        }
+    }
+};
+
+var radioTypes = [
+    ['line', 'bar'],
+    ['stack', 'tiled']
+];
+
+proto$5.onclick = function (ecModel, api, type) {
+    var model = this.model;
+    var seriesIndex = model.get('seriesIndex.' + type);
+    // Not supported magicType
+    if (!seriesOptGenreator[type]) {
+        return;
+    }
+    var newOption = {
+        series: []
+    };
+    var generateNewSeriesTypes = function (seriesModel) {
+        var seriesType = seriesModel.subType;
+        var seriesId = seriesModel.id;
+        var newSeriesOpt = seriesOptGenreator[type](
+            seriesType, seriesId, seriesModel, model
+        );
+        if (newSeriesOpt) {
+            // PENDING If merge original option?
+            defaults(newSeriesOpt, seriesModel.option);
+            newOption.series.push(newSeriesOpt);
+        }
+        // Modify boundaryGap
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys && coordSys.type === 'cartesian2d' && (type === 'line' || type === 'bar')) {
+            var categoryAxis = coordSys.getAxesByScale('ordinal')[0];
+            if (categoryAxis) {
+                var axisDim = categoryAxis.dim;
+                var axisType = axisDim + 'Axis';
+                var axisModel = ecModel.queryComponents({
+                    mainType: axisType,
+                    index: seriesModel.get(name + 'Index'),
+                    id: seriesModel.get(name + 'Id')
+                })[0];
+                var axisIndex = axisModel.componentIndex;
+
+                newOption[axisType] = newOption[axisType] || [];
+                for (var i = 0; i <= axisIndex; i++) {
+                    newOption[axisType][axisIndex] = newOption[axisType][axisIndex] || {};
+                }
+                newOption[axisType][axisIndex].boundaryGap = type === 'bar' ? true : false;
+            }
+        }
+    };
+
+    each$1(radioTypes, function (radio) {
+        if (indexOf(radio, type) >= 0) {
+            each$1(radio, function (item) {
+                model.setIconStatus(item, 'normal');
+            });
+        }
+    });
+
+    model.setIconStatus(type, 'emphasis');
+
+    ecModel.eachComponent(
+        {
+            mainType: 'series',
+            query: seriesIndex == null ? null : {
+                seriesIndex: seriesIndex
+            }
+        }, generateNewSeriesTypes
+    );
+    api.dispatchAction({
+        type: 'changeMagicType',
+        currentType: type,
+        newOption: newOption
+    });
+};
+
+registerAction({
+    type: 'changeMagicType',
+    event: 'magicTypeChanged',
+    update: 'prepareAndUpdate'
+}, function (payload, ecModel) {
+    ecModel.mergeOption(payload.newOption);
+});
+
+register$1('magicType', MagicType);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var dataViewLang = lang.toolbox.dataView;
+
+var BLOCK_SPLITER = new Array(60).join('-');
+var ITEM_SPLITER = '\t';
+/**
+ * Group series into two types
+ *  1. on category axis, like line, bar
+ *  2. others, like scatter, pie
+ * @param {module:echarts/model/Global} ecModel
+ * @return {Object}
+ * @inner
+ */
+function groupSeries(ecModel) {
+    var seriesGroupByCategoryAxis = {};
+    var otherSeries = [];
+    var meta = [];
+    ecModel.eachRawSeries(function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+
+        if (coordSys && (coordSys.type === 'cartesian2d' || coordSys.type === 'polar')) {
+            var baseAxis = coordSys.getBaseAxis();
+            if (baseAxis.type === 'category') {
+                var key = baseAxis.dim + '_' + baseAxis.index;
+                if (!seriesGroupByCategoryAxis[key]) {
+                    seriesGroupByCategoryAxis[key] = {
+                        categoryAxis: baseAxis,
+                        valueAxis: coordSys.getOtherAxis(baseAxis),
+                        series: []
+                    };
+                    meta.push({
+                        axisDim: baseAxis.dim,
+                        axisIndex: baseAxis.index
+                    });
+                }
+                seriesGroupByCategoryAxis[key].series.push(seriesModel);
+            }
+            else {
+                otherSeries.push(seriesModel);
+            }
+        }
+        else {
+            otherSeries.push(seriesModel);
+        }
+    });
+
+    return {
+        seriesGroupByCategoryAxis: seriesGroupByCategoryAxis,
+        other: otherSeries,
+        meta: meta
+    };
+}
+
+/**
+ * Assemble content of series on cateogory axis
+ * @param {Array.<module:echarts/model/Series>} series
+ * @return {string}
+ * @inner
+ */
+function assembleSeriesWithCategoryAxis(series) {
+    var tables = [];
+    each$1(series, function (group, key) {
+        var categoryAxis = group.categoryAxis;
+        var valueAxis = group.valueAxis;
+        var valueAxisDim = valueAxis.dim;
+
+        var headers = [' '].concat(map(group.series, function (series) {
+            return series.name;
+        }));
+        var columns = [categoryAxis.model.getCategories()];
+        each$1(group.series, function (series) {
+            columns.push(series.getRawData().mapArray(valueAxisDim, function (val) {
+                return val;
+            }));
+        });
+        // Assemble table content
+        var lines = [headers.join(ITEM_SPLITER)];
+        for (var i = 0; i < columns[0].length; i++) {
+            var items = [];
+            for (var j = 0; j < columns.length; j++) {
+                items.push(columns[j][i]);
+            }
+            lines.push(items.join(ITEM_SPLITER));
+        }
+        tables.push(lines.join('\n'));
+    });
+    return tables.join('\n\n' +  BLOCK_SPLITER + '\n\n');
+}
+
+/**
+ * Assemble content of other series
+ * @param {Array.<module:echarts/model/Series>} series
+ * @return {string}
+ * @inner
+ */
+function assembleOtherSeries(series) {
+    return map(series, function (series) {
+        var data = series.getRawData();
+        var lines = [series.name];
+        var vals = [];
+        data.each(data.dimensions, function () {
+            var argLen = arguments.length;
+            var dataIndex = arguments[argLen - 1];
+            var name = data.getName(dataIndex);
+            for (var i = 0; i < argLen - 1; i++) {
+                vals[i] = arguments[i];
+            }
+            lines.push((name ? (name + ITEM_SPLITER) : '') + vals.join(ITEM_SPLITER));
+        });
+        return lines.join('\n');
+    }).join('\n\n' + BLOCK_SPLITER + '\n\n');
+}
+
+/**
+ * @param {module:echarts/model/Global}
+ * @return {Object}
+ * @inner
+ */
+function getContentFromModel(ecModel) {
+
+    var result = groupSeries(ecModel);
+
+    return {
+        value: filter([
+                assembleSeriesWithCategoryAxis(result.seriesGroupByCategoryAxis),
+                assembleOtherSeries(result.other)
+            ], function (str) {
+                return str.replace(/[\n\t\s]/g, '');
+            }).join('\n\n' + BLOCK_SPLITER + '\n\n'),
+
+        meta: result.meta
+    };
+}
+
+
+function trim$1(str) {
+    return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
+}
+/**
+ * If a block is tsv format
+ */
+function isTSVFormat(block) {
+    // Simple method to find out if a block is tsv format
+    var firstLine = block.slice(0, block.indexOf('\n'));
+    if (firstLine.indexOf(ITEM_SPLITER) >= 0) {
+        return true;
+    }
+}
+
+var itemSplitRegex = new RegExp('[' + ITEM_SPLITER + ']+', 'g');
+/**
+ * @param {string} tsv
+ * @return {Object}
+ */
+function parseTSVContents(tsv) {
+    var tsvLines = tsv.split(/\n+/g);
+    var headers = trim$1(tsvLines.shift()).split(itemSplitRegex);
+
+    var categories = [];
+    var series = map(headers, function (header) {
+        return {
+            name: header,
+            data: []
+        };
+    });
+    for (var i = 0; i < tsvLines.length; i++) {
+        var items = trim$1(tsvLines[i]).split(itemSplitRegex);
+        categories.push(items.shift());
+        for (var j = 0; j < items.length; j++) {
+            series[j] && (series[j].data[i] = items[j]);
+        }
+    }
+    return {
+        series: series,
+        categories: categories
+    };
+}
+
+/**
+ * @param {string} str
+ * @return {Array.<Object>}
+ * @inner
+ */
+function parseListContents(str) {
+    var lines = str.split(/\n+/g);
+    var seriesName = trim$1(lines.shift());
+
+    var data = [];
+    for (var i = 0; i < lines.length; i++) {
+        var items = trim$1(lines[i]).split(itemSplitRegex);
+        var name = '';
+        var value;
+        var hasName = false;
+        if (isNaN(items[0])) { // First item is name
+            hasName = true;
+            name = items[0];
+            items = items.slice(1);
+            data[i] = {
+                name: name,
+                value: []
+            };
+            value = data[i].value;
+        }
+        else {
+            value = data[i] = [];
+        }
+        for (var j = 0; j < items.length; j++) {
+            value.push(+items[j]);
+        }
+        if (value.length === 1) {
+            hasName ? (data[i].value = value[0]) : (data[i] = value[0]);
+        }
+    }
+
+    return {
+        name: seriesName,
+        data: data
+    };
+}
+
+/**
+ * @param {string} str
+ * @param {Array.<Object>} blockMetaList
+ * @return {Object}
+ * @inner
+ */
+function parseContents(str, blockMetaList) {
+    var blocks = str.split(new RegExp('\n*' + BLOCK_SPLITER + '\n*', 'g'));
+    var newOption = {
+        series: []
+    };
+    each$1(blocks, function (block, idx) {
+        if (isTSVFormat(block)) {
+            var result = parseTSVContents(block);
+            var blockMeta = blockMetaList[idx];
+            var axisKey = blockMeta.axisDim + 'Axis';
+
+            if (blockMeta) {
+                newOption[axisKey] = newOption[axisKey] || [];
+                newOption[axisKey][blockMeta.axisIndex] = {
+                    data: result.categories
+                };
+                newOption.series = newOption.series.concat(result.series);
+            }
+        }
+        else {
+            var result = parseListContents(block);
+            newOption.series.push(result);
+        }
+    });
+    return newOption;
+}
+
+/**
+ * @alias {module:echarts/component/toolbox/feature/DataView}
+ * @constructor
+ * @param {module:echarts/model/Model} model
+ */
+function DataView(model) {
+
+    this._dom = null;
+
+    this.model = model;
+}
+
+DataView.defaultOption = {
+    show: true,
+    readOnly: false,
+    optionToContent: null,
+    contentToOption: null,
+
+    icon: 'M17.5,17.3H33 M17.5,17.3H33 M45.4,29.5h-28 M11.5,2v56H51V14.8L38.4,2H11.5z M38.4,2.2v12.7H51 M45.4,41.7h-28',
+    title: clone(dataViewLang.title),
+    lang: clone(dataViewLang.lang),
+    backgroundColor: '#fff',
+    textColor: '#000',
+    textareaColor: '#fff',
+    textareaBorderColor: '#333',
+    buttonColor: '#c23531',
+    buttonTextColor: '#fff'
+};
+
+DataView.prototype.onclick = function (ecModel, api) {
+    var container = api.getDom();
+    var model = this.model;
+    if (this._dom) {
+        container.removeChild(this._dom);
+    }
+    var root = document.createElement('div');
+    root.style.cssText = 'position:absolute;left:5px;top:5px;bottom:5px;right:5px;';
+    root.style.backgroundColor = model.get('backgroundColor') || '#fff';
+
+    // Create elements
+    var header = document.createElement('h4');
+    var lang$$1 = model.get('lang') || [];
+    header.innerHTML = lang$$1[0] || model.get('title');
+    header.style.cssText = 'margin: 10px 20px;';
+    header.style.color = model.get('textColor');
+
+    var viewMain = document.createElement('div');
+    var textarea = document.createElement('textarea');
+    viewMain.style.cssText = 'display:block;width:100%;overflow:auto;';
+
+    var optionToContent = model.get('optionToContent');
+    var contentToOption = model.get('contentToOption');
+    var result = getContentFromModel(ecModel);
+    if (typeof optionToContent === 'function') {
+        var htmlOrDom = optionToContent(api.getOption());
+        if (typeof htmlOrDom === 'string') {
+            viewMain.innerHTML = htmlOrDom;
+        }
+        else if (isDom(htmlOrDom)) {
+            viewMain.appendChild(htmlOrDom);
+        }
+    }
+    else {
+        // Use default textarea
+        viewMain.appendChild(textarea);
+        textarea.readOnly = model.get('readOnly');
+        textarea.style.cssText = 'width:100%;height:100%;font-family:monospace;font-size:14px;line-height:1.6rem;';
+        textarea.style.color = model.get('textColor');
+        textarea.style.borderColor = model.get('textareaBorderColor');
+        textarea.style.backgroundColor = model.get('textareaColor');
+        textarea.value = result.value;
+    }
+
+    var blockMetaList = result.meta;
+
+    var buttonContainer = document.createElement('div');
+    buttonContainer.style.cssText = 'position:absolute;bottom:0;left:0;right:0;';
+
+    var buttonStyle = 'float:right;margin-right:20px;border:none;'
+        + 'cursor:pointer;padding:2px 5px;font-size:12px;border-radius:3px';
+    var closeButton = document.createElement('div');
+    var refreshButton = document.createElement('div');
+
+    buttonStyle += ';background-color:' + model.get('buttonColor');
+    buttonStyle += ';color:' + model.get('buttonTextColor');
+
+    var self = this;
+
+    function close() {
+        container.removeChild(root);
+        self._dom = null;
+    }
+    addEventListener(closeButton, 'click', close);
+
+    addEventListener(refreshButton, 'click', function () {
+        var newOption;
+        try {
+            if (typeof contentToOption === 'function') {
+                newOption = contentToOption(viewMain, api.getOption());
+            }
+            else {
+                newOption = parseContents(textarea.value, blockMetaList);
+            }
+        }
+        catch (e) {
+            close();
+            throw new Error('Data view format error ' + e);
+        }
+        if (newOption) {
+            api.dispatchAction({
+                type: 'changeDataView',
+                newOption: newOption
+            });
+        }
+
+        close();
+    });
+
+    closeButton.innerHTML = lang$$1[1];
+    refreshButton.innerHTML = lang$$1[2];
+    refreshButton.style.cssText = buttonStyle;
+    closeButton.style.cssText = buttonStyle;
+
+    !model.get('readOnly') && buttonContainer.appendChild(refreshButton);
+    buttonContainer.appendChild(closeButton);
+
+    // http://stackoverflow.com/questions/6637341/use-tab-to-indent-in-textarea
+    addEventListener(textarea, 'keydown', function (e) {
+        if ((e.keyCode || e.which) === 9) {
+            // get caret position/selection
+            var val = this.value;
+            var start = this.selectionStart;
+            var end = this.selectionEnd;
+
+            // set textarea value to: text before caret + tab + text after caret
+            this.value = val.substring(0, start) + ITEM_SPLITER + val.substring(end);
+
+            // put caret at right position again
+            this.selectionStart = this.selectionEnd = start + 1;
+
+            // prevent the focus lose
+            stop(e);
+        }
+    });
+
+    root.appendChild(header);
+    root.appendChild(viewMain);
+    root.appendChild(buttonContainer);
+
+    viewMain.style.height = (container.clientHeight - 80) + 'px';
+
+    container.appendChild(root);
+    this._dom = root;
+};
+
+DataView.prototype.remove = function (ecModel, api) {
+    this._dom && api.getDom().removeChild(this._dom);
+};
+
+DataView.prototype.dispose = function (ecModel, api) {
+    this.remove(ecModel, api);
+};
+
+/**
+ * @inner
+ */
+function tryMergeDataOption(newData, originalData) {
+    return map(newData, function (newVal, idx) {
+        var original = originalData && originalData[idx];
+        if (isObject$1(original) && !isArray(original)) {
+            if (isObject$1(newVal) && !isArray(newVal)) {
+                newVal = newVal.value;
+            }
+            // Original data has option
+            return defaults({
+                value: newVal
+            }, original);
+        }
+        else {
+            return newVal;
+        }
+    });
+}
+
+register$1('dataView', DataView);
+
+registerAction({
+    type: 'changeDataView',
+    event: 'dataViewChanged',
+    update: 'prepareAndUpdate'
+}, function (payload, ecModel) {
+    var newSeriesOptList = [];
+    each$1(payload.newOption.series, function (seriesOpt) {
+        var seriesModel = ecModel.getSeriesByName(seriesOpt.name)[0];
+        if (!seriesModel) {
+            // New created series
+            // Geuss the series type
+            newSeriesOptList.push(extend({
+                // Default is scatter
+                type: 'scatter'
+            }, seriesOpt));
+        }
+        else {
+            var originalData = seriesModel.get('data');
+            newSeriesOptList.push({
+                name: seriesOpt.name,
+                data: tryMergeDataOption(seriesOpt.data, originalData)
+            });
+        }
+    });
+
+    ecModel.mergeOption(defaults({
+        series: newSeriesOptList
+    }, payload.newOption));
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$29 = each$1;
+
+var ATTR$2 = '\0_ec_hist_store';
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} newSnapshot {dataZoomId, batch: [payloadInfo, ...]}
+ */
+function push(ecModel, newSnapshot) {
+    var store = giveStore$1(ecModel);
+
+    // If previous dataZoom can not be found,
+    // complete an range with current range.
+    each$29(newSnapshot, function (batchItem, dataZoomId) {
+        var i = store.length - 1;
+        for (; i >= 0; i--) {
+            var snapshot = store[i];
+            if (snapshot[dataZoomId]) {
+                break;
+            }
+        }
+        if (i < 0) {
+            // No origin range set, create one by current range.
+            var dataZoomModel = ecModel.queryComponents(
+                {mainType: 'dataZoom', subType: 'select', id: dataZoomId}
+            )[0];
+            if (dataZoomModel) {
+                var percentRange = dataZoomModel.getPercentRange();
+                store[0][dataZoomId] = {
+                    dataZoomId: dataZoomId,
+                    start: percentRange[0],
+                    end: percentRange[1]
+                };
+            }
+        }
+    });
+
+    store.push(newSnapshot);
+}
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @return {Object} snapshot
+ */
+function pop(ecModel) {
+    var store = giveStore$1(ecModel);
+    var head = store[store.length - 1];
+    store.length > 1 && store.pop();
+
+    // Find top for all dataZoom.
+    var snapshot = {};
+    each$29(head, function (batchItem, dataZoomId) {
+        for (var i = store.length - 1; i >= 0; i--) {
+            var batchItem = store[i][dataZoomId];
+            if (batchItem) {
+                snapshot[dataZoomId] = batchItem;
+                break;
+            }
+        }
+    });
+
+    return snapshot;
+}
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ */
+function clear$1(ecModel) {
+    ecModel[ATTR$2] = null;
+}
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @return {number} records. always >= 1.
+ */
+function count(ecModel) {
+    return giveStore$1(ecModel).length;
+}
+
+/**
+ * [{key: dataZoomId, value: {dataZoomId, range}}, ...]
+ * History length of each dataZoom may be different.
+ * this._history[0] is used to store origin range.
+ * @type {Array.<Object>}
+ */
+function giveStore$1(ecModel) {
+    var store = ecModel[ATTR$2];
+    if (!store) {
+        store = ecModel[ATTR$2] = [{}];
+    }
+    return store;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+DataZoomModel.extend({
+    type: 'dataZoom.select'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+DataZoomView.extend({
+    type: 'dataZoom.select'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Use dataZoomSelect
+var dataZoomLang = lang.toolbox.dataZoom;
+var each$28 = each$1;
+
+// Spectial component id start with \0ec\0, see echarts/model/Global.js~hasInnerId
+var DATA_ZOOM_ID_BASE = '\0_ec_\0toolbox-dataZoom_';
+
+function DataZoom(model, ecModel, api) {
+
+    /**
+     * @private
+     * @type {module:echarts/component/helper/BrushController}
+     */
+    (this._brushController = new BrushController(api.getZr()))
+        .on('brush', bind(this._onBrush, this))
+        .mount();
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._isZoomActive;
+}
+
+DataZoom.defaultOption = {
+    show: true,
+    // Icon group
+    icon: {
+        zoom: 'M0,13.5h26.9 M13.5,26.9V0 M32.1,13.5H58V58H13.5 V32.1',
+        back: 'M22,1.4L9.9,13.5l12.3,12.3 M10.3,13.5H54.9v44.6 H10.3v-26'
+    },
+    // `zoom`, `back`
+    title: clone(dataZoomLang.title)
+};
+
+var proto$6 = DataZoom.prototype;
+
+proto$6.render = function (featureModel, ecModel, api, payload) {
+    this.model = featureModel;
+    this.ecModel = ecModel;
+    this.api = api;
+
+    updateZoomBtnStatus(featureModel, ecModel, this, payload, api);
+    updateBackBtnStatus(featureModel, ecModel);
+};
+
+proto$6.onclick = function (ecModel, api, type) {
+    handlers$1[type].call(this);
+};
+
+proto$6.remove = function (ecModel, api) {
+    this._brushController.unmount();
+};
+
+proto$6.dispose = function (ecModel, api) {
+    this._brushController.dispose();
+};
+
+/**
+ * @private
+ */
+var handlers$1 = {
+
+    zoom: function () {
+        var nextActive = !this._isZoomActive;
+
+        this.api.dispatchAction({
+            type: 'takeGlobalCursor',
+            key: 'dataZoomSelect',
+            dataZoomSelectActive: nextActive
+        });
+    },
+
+    back: function () {
+        this._dispatchZoomAction(pop(this.ecModel));
+    }
+};
+
+/**
+ * @private
+ */
+proto$6._onBrush = function (areas, opt) {
+    if (!opt.isEnd || !areas.length) {
+        return;
+    }
+    var snapshot = {};
+    var ecModel = this.ecModel;
+
+    this._brushController.updateCovers([]); // remove cover
+
+    var brushTargetManager = new BrushTargetManager(
+        retrieveAxisSetting(this.model.option), ecModel, {include: ['grid']}
+    );
+    brushTargetManager.matchOutputRanges(areas, ecModel, function (area, coordRange, coordSys) {
+        if (coordSys.type !== 'cartesian2d') {
+            return;
+        }
+
+        var brushType = area.brushType;
+        if (brushType === 'rect') {
+            setBatch('x', coordSys, coordRange[0]);
+            setBatch('y', coordSys, coordRange[1]);
+        }
+        else {
+            setBatch(({lineX: 'x', lineY: 'y'})[brushType], coordSys, coordRange);
+        }
+    });
+
+    push(ecModel, snapshot);
+
+    this._dispatchZoomAction(snapshot);
+
+    function setBatch(dimName, coordSys, minMax) {
+        var axis = coordSys.getAxis(dimName);
+        var axisModel = axis.model;
+        var dataZoomModel = findDataZoom(dimName, axisModel, ecModel);
+
+        // Restrict range.
+        var minMaxSpan = dataZoomModel.findRepresentativeAxisProxy(axisModel).getMinMaxSpan();
+        if (minMaxSpan.minValueSpan != null || minMaxSpan.maxValueSpan != null) {
+            minMax = sliderMove(
+                0, minMax.slice(), axis.scale.getExtent(), 0,
+                minMaxSpan.minValueSpan, minMaxSpan.maxValueSpan
+            );
+        }
+
+        dataZoomModel && (snapshot[dataZoomModel.id] = {
+            dataZoomId: dataZoomModel.id,
+            startValue: minMax[0],
+            endValue: minMax[1]
+        });
+    }
+
+    function findDataZoom(dimName, axisModel, ecModel) {
+        var found;
+        ecModel.eachComponent({mainType: 'dataZoom', subType: 'select'}, function (dzModel) {
+            var has = dzModel.getAxisModel(dimName, axisModel.componentIndex);
+            has && (found = dzModel);
+        });
+        return found;
+    }
+};
+
+/**
+ * @private
+ */
+proto$6._dispatchZoomAction = function (snapshot) {
+    var batch = [];
+
+    // Convert from hash map to array.
+    each$28(snapshot, function (batchItem, dataZoomId) {
+        batch.push(clone(batchItem));
+    });
+
+    batch.length && this.api.dispatchAction({
+        type: 'dataZoom',
+        from: this.uid,
+        batch: batch
+    });
+};
+
+function retrieveAxisSetting(option) {
+    var setting = {};
+    // Compatible with previous setting: null => all axis, false => no axis.
+    each$1(['xAxisIndex', 'yAxisIndex'], function (name) {
+        setting[name] = option[name];
+        setting[name] == null && (setting[name] = 'all');
+        (setting[name] === false || setting[name] === 'none') && (setting[name] = []);
+    });
+    return setting;
+}
+
+function updateBackBtnStatus(featureModel, ecModel) {
+    featureModel.setIconStatus(
+        'back',
+        count(ecModel) > 1 ? 'emphasis' : 'normal'
+    );
+}
+
+function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
+    var zoomActive = view._isZoomActive;
+
+    if (payload && payload.type === 'takeGlobalCursor') {
+        zoomActive = payload.key === 'dataZoomSelect'
+            ? payload.dataZoomSelectActive : false;
+    }
+
+    view._isZoomActive = zoomActive;
+
+    featureModel.setIconStatus('zoom', zoomActive ? 'emphasis' : 'normal');
+
+    var brushTargetManager = new BrushTargetManager(
+        retrieveAxisSetting(featureModel.option), ecModel, {include: ['grid']}
+    );
+
+    view._brushController
+        .setPanels(brushTargetManager.makePanelOpts(api, function (targetInfo) {
+            return (targetInfo.xAxisDeclared && !targetInfo.yAxisDeclared)
+                ? 'lineX'
+                : (!targetInfo.xAxisDeclared && targetInfo.yAxisDeclared)
+                ? 'lineY'
+                : 'rect';
+        }))
+        .enableBrush(
+            zoomActive
+            ? {
+                brushType: 'auto',
+                brushStyle: {
+                    // FIXME user customized?
+                    lineWidth: 0,
+                    fill: 'rgba(0,0,0,0.2)'
+                }
+            }
+            : false
+        );
+}
+
+
+register$1('dataZoom', DataZoom);
+
+
+// Create special dataZoom option for select
+// FIXME consider the case of merge option, where axes options are not exists.
+registerPreprocessor(function (option) {
+    if (!option) {
+        return;
+    }
+
+    var dataZoomOpts = option.dataZoom || (option.dataZoom = []);
+    if (!isArray(dataZoomOpts)) {
+        option.dataZoom = dataZoomOpts = [dataZoomOpts];
+    }
+
+    var toolboxOpt = option.toolbox;
+    if (toolboxOpt) {
+        // Assume there is only one toolbox
+        if (isArray(toolboxOpt)) {
+            toolboxOpt = toolboxOpt[0];
+        }
+
+        if (toolboxOpt && toolboxOpt.feature) {
+            var dataZoomOpt = toolboxOpt.feature.dataZoom;
+            // FIXME: If add dataZoom when setOption in merge mode,
+            // no axis info to be added. See `test/dataZoom-extreme.html`
+            addForAxis('xAxis', dataZoomOpt);
+            addForAxis('yAxis', dataZoomOpt);
+        }
+    }
+
+    function addForAxis(axisName, dataZoomOpt) {
+        if (!dataZoomOpt) {
+            return;
+        }
+
+        // Try not to modify model, because it is not merged yet.
+        var axisIndicesName = axisName + 'Index';
+        var givenAxisIndices = dataZoomOpt[axisIndicesName];
+        if (givenAxisIndices != null
+            && givenAxisIndices != 'all'
+            && !isArray(givenAxisIndices)
+        ) {
+            givenAxisIndices = (givenAxisIndices === false || givenAxisIndices === 'none') ? [] : [givenAxisIndices];
+        }
+
+        forEachComponent(axisName, function (axisOpt, axisIndex) {
+            if (givenAxisIndices != null
+                && givenAxisIndices != 'all'
+                && indexOf(givenAxisIndices, axisIndex) === -1
+            ) {
+                return;
+            }
+            var newOpt = {
+                type: 'select',
+                $fromToolbox: true,
+                // Id for merge mapping.
+                id: DATA_ZOOM_ID_BASE + axisName + axisIndex
+            };
+            // FIXME
+            // Only support one axis now.
+            newOpt[axisIndicesName] = axisIndex;
+            dataZoomOpts.push(newOpt);
+        });
+    }
+
+    function forEachComponent(mainType, cb) {
+        var opts = option[mainType];
+        if (!isArray(opts)) {
+            opts = opts ? [opts] : [];
+        }
+        each$28(opts, cb);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var restoreLang = lang.toolbox.restore;
+
+function Restore(model) {
+    this.model = model;
+}
+
+Restore.defaultOption = {
+    show: true,
+    icon: 'M3.8,33.4 M47,18.9h9.8V8.7 M56.3,20.1 C52.1,9,40.5,0.6,26.8,2.1C12.6,3.7,1.6,16.2,2.1,30.6 M13,41.1H3.1v10.2 M3.7,39.9c4.2,11.1,15.8,19.5,29.5,18 c14.2-1.6,25.2-14.1,24.7-28.5',
+    title: restoreLang.title
+};
+
+var proto$7 = Restore.prototype;
+
+proto$7.onclick = function (ecModel, api, type) {
+    clear$1(ecModel);
+
+    api.dispatchAction({
+        type: 'restore',
+        from: this.uid
+    });
+};
+
+register$1('restore', Restore);
+
+registerAction(
+    {type: 'restore', event: 'restore', update: 'prepareAndUpdate'},
+    function (payload, ecModel) {
+        ecModel.resetOption('recreate');
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var urn = 'urn:schemas-microsoft-com:vml';
+var win = typeof window === 'undefined' ? null : window;
+
+var vmlInited = false;
+
+var doc = win && win.document;
+
+function createNode(tagName) {
+    return doCreateNode(tagName);
+}
+
+// Avoid assign to an exported variable, for transforming to cjs.
+var doCreateNode;
+
+if (doc && !env$1.canvasSupported) {
+    try {
+        !doc.namespaces.zrvml && doc.namespaces.add('zrvml', urn);
+        doCreateNode = function (tagName) {
+            return doc.createElement('<zrvml:' + tagName + ' class="zrvml">');
+        };
+    }
+    catch (e) {
+        doCreateNode = function (tagName) {
+            return doc.createElement('<' + tagName + ' xmlns="' + urn + '" class="zrvml">');
+        };
+    }
+}
+
+// From raphael
+function initVML() {
+    if (vmlInited || !doc) {
+        return;
+    }
+    vmlInited = true;
+
+    var styleSheets = doc.styleSheets;
+    if (styleSheets.length < 31) {
+        doc.createStyleSheet().addRule('.zrvml', 'behavior:url(#default#VML)');
+    }
+    else {
+        // http://msdn.microsoft.com/en-us/library/ms531194%28VS.85%29.aspx
+        styleSheets[0].addRule('.zrvml', 'behavior:url(#default#VML)');
+    }
+}
+
+// http://www.w3.org/TR/NOTE-VML
+// TODO Use proxy like svg instead of overwrite brush methods
+
+var CMD$3 = PathProxy.CMD;
+var round$3 = Math.round;
+var sqrt = Math.sqrt;
+var abs$1 = Math.abs;
+var cos = Math.cos;
+var sin = Math.sin;
+var mathMax$8 = Math.max;
+
+if (!env$1.canvasSupported) {
+
+    var comma = ',';
+    var imageTransformPrefix = 'progid:DXImageTransform.Microsoft';
+
+    var Z = 21600;
+    var Z2 = Z / 2;
+
+    var ZLEVEL_BASE = 100000;
+    var Z_BASE$1 = 1000;
+
+    var initRootElStyle = function (el) {
+        el.style.cssText = 'position:absolute;left:0;top:0;width:1px;height:1px;';
+        el.coordsize = Z + ','  + Z;
+        el.coordorigin = '0,0';
+    };
+
+    var encodeHtmlAttribute = function (s) {
+        return String(s).replace(/&/g, '&amp;').replace(/"/g, '&quot;');
+    };
+
+    var rgb2Str = function (r, g, b) {
+        return 'rgb(' + [r, g, b].join(',') + ')';
+    };
+
+    var append = function (parent, child) {
+        if (child && parent && child.parentNode !== parent) {
+            parent.appendChild(child);
+        }
+    };
+
+    var remove = function (parent, child) {
+        if (child && parent && child.parentNode === parent) {
+            parent.removeChild(child);
+        }
+    };
+
+    var getZIndex = function (zlevel, z, z2) {
+        // z 的取值范围为 [0, 1000]
+        return (parseFloat(zlevel) || 0) * ZLEVEL_BASE + (parseFloat(z) || 0) * Z_BASE$1 + z2;
+    };
+
+    var parsePercent$3 = function (value, maxValue) {
+        if (typeof value === 'string') {
+            if (value.lastIndexOf('%') >= 0) {
+                return parseFloat(value) / 100 * maxValue;
+            }
+            return parseFloat(value);
+        }
+        return value;
+    };
+
+    /***************************************************
+     * PATH
+     **************************************************/
+
+    var setColorAndOpacity = function (el, color, opacity) {
+        var colorArr = parse(color);
+        opacity = +opacity;
+        if (isNaN(opacity)) {
+            opacity = 1;
+        }
+        if (colorArr) {
+            el.color = rgb2Str(colorArr[0], colorArr[1], colorArr[2]);
+            el.opacity = opacity * colorArr[3];
+        }
+    };
+
+    var getColorAndAlpha = function (color) {
+        var colorArr = parse(color);
+        return [
+            rgb2Str(colorArr[0], colorArr[1], colorArr[2]),
+            colorArr[3]
+        ];
+    };
+
+    var updateFillNode = function (el, style, zrEl) {
+        // TODO pattern
+        var fill = style.fill;
+        if (fill != null) {
+            // Modified from excanvas
+            if (fill instanceof Gradient) {
+                var gradientType;
+                var angle = 0;
+                var focus = [0, 0];
+                // additional offset
+                var shift = 0;
+                // scale factor for offset
+                var expansion = 1;
+                var rect = zrEl.getBoundingRect();
+                var rectWidth = rect.width;
+                var rectHeight = rect.height;
+                if (fill.type === 'linear') {
+                    gradientType = 'gradient';
+                    var transform = zrEl.transform;
+                    var p0 = [fill.x * rectWidth, fill.y * rectHeight];
+                    var p1 = [fill.x2 * rectWidth, fill.y2 * rectHeight];
+                    if (transform) {
+                        applyTransform(p0, p0, transform);
+                        applyTransform(p1, p1, transform);
+                    }
+                    var dx = p1[0] - p0[0];
+                    var dy = p1[1] - p0[1];
+                    angle = Math.atan2(dx, dy) * 180 / Math.PI;
+                    // The angle should be a non-negative number.
+                    if (angle < 0) {
+                        angle += 360;
+                    }
+
+                    // Very small angles produce an unexpected result because they are
+                    // converted to a scientific notation string.
+                    if (angle < 1e-6) {
+                        angle = 0;
+                    }
+                }
+                else {
+                    gradientType = 'gradientradial';
+                    var p0 = [fill.x * rectWidth, fill.y * rectHeight];
+                    var transform = zrEl.transform;
+                    var scale$$1 = zrEl.scale;
+                    var width = rectWidth;
+                    var height = rectHeight;
+                    focus = [
+                        // Percent in bounding rect
+                        (p0[0] - rect.x) / width,
+                        (p0[1] - rect.y) / height
+                    ];
+                    if (transform) {
+                        applyTransform(p0, p0, transform);
+                    }
+
+                    width /= scale$$1[0] * Z;
+                    height /= scale$$1[1] * Z;
+                    var dimension = mathMax$8(width, height);
+                    shift = 2 * 0 / dimension;
+                    expansion = 2 * fill.r / dimension - shift;
+                }
+
+                // We need to sort the color stops in ascending order by offset,
+                // otherwise IE won't interpret it correctly.
+                var stops = fill.colorStops.slice();
+                stops.sort(function(cs1, cs2) {
+                    return cs1.offset - cs2.offset;
+                });
+
+                var length$$1 = stops.length;
+                // Color and alpha list of first and last stop
+                var colorAndAlphaList = [];
+                var colors = [];
+                for (var i = 0; i < length$$1; i++) {
+                    var stop = stops[i];
+                    var colorAndAlpha = getColorAndAlpha(stop.color);
+                    colors.push(stop.offset * expansion + shift + ' ' + colorAndAlpha[0]);
+                    if (i === 0 || i === length$$1 - 1) {
+                        colorAndAlphaList.push(colorAndAlpha);
+                    }
+                }
+
+                if (length$$1 >= 2) {
+                    var color1 = colorAndAlphaList[0][0];
+                    var color2 = colorAndAlphaList[1][0];
+                    var opacity1 = colorAndAlphaList[0][1] * style.opacity;
+                    var opacity2 = colorAndAlphaList[1][1] * style.opacity;
+
+                    el.type = gradientType;
+                    el.method = 'none';
+                    el.focus = '100%';
+                    el.angle = angle;
+                    el.color = color1;
+                    el.color2 = color2;
+                    el.colors = colors.join(',');
+                    // When colors attribute is used, the meanings of opacity and o:opacity2
+                    // are reversed.
+                    el.opacity = opacity2;
+                    // FIXME g_o_:opacity ?
+                    el.opacity2 = opacity1;
+                }
+                if (gradientType === 'radial') {
+                    el.focusposition = focus.join(',');
+                }
+            }
+            else {
+                // FIXME Change from Gradient fill to color fill
+                setColorAndOpacity(el, fill, style.opacity);
+            }
+        }
+    };
+
+    var updateStrokeNode = function (el, style) {
+        // if (style.lineJoin != null) {
+        //     el.joinstyle = style.lineJoin;
+        // }
+        // if (style.miterLimit != null) {
+        //     el.miterlimit = style.miterLimit * Z;
+        // }
+        // if (style.lineCap != null) {
+        //     el.endcap = style.lineCap;
+        // }
+        if (style.lineDash != null) {
+            el.dashstyle = style.lineDash.join(' ');
+        }
+        if (style.stroke != null && !(style.stroke instanceof Gradient)) {
+            setColorAndOpacity(el, style.stroke, style.opacity);
+        }
+    };
+
+    var updateFillAndStroke = function (vmlEl, type, style, zrEl) {
+        var isFill = type == 'fill';
+        var el = vmlEl.getElementsByTagName(type)[0];
+        // Stroke must have lineWidth
+        if (style[type] != null && style[type] !== 'none' && (isFill || (!isFill && style.lineWidth))) {
+            vmlEl[isFill ? 'filled' : 'stroked'] = 'true';
+            // FIXME Remove before updating, or set `colors` will throw error
+            if (style[type] instanceof Gradient) {
+                remove(vmlEl, el);
+            }
+            if (!el) {
+                el = createNode(type);
+            }
+
+            isFill ? updateFillNode(el, style, zrEl) : updateStrokeNode(el, style);
+            append(vmlEl, el);
+        }
+        else {
+            vmlEl[isFill ? 'filled' : 'stroked'] = 'false';
+            remove(vmlEl, el);
+        }
+    };
+
+    var points$3 = [[], [], []];
+    var pathDataToString = function (path, m) {
+        var M = CMD$3.M;
+        var C = CMD$3.C;
+        var L = CMD$3.L;
+        var A = CMD$3.A;
+        var Q = CMD$3.Q;
+
+        var str = [];
+        var nPoint;
+        var cmdStr;
+        var cmd;
+        var i;
+        var xi;
+        var yi;
+        var data = path.data;
+        var dataLength = path.len();
+        for (i = 0; i < dataLength;) {
+            cmd = data[i++];
+            cmdStr = '';
+            nPoint = 0;
+            switch (cmd) {
+                case M:
+                    cmdStr = ' m ';
+                    nPoint = 1;
+                    xi = data[i++];
+                    yi = data[i++];
+                    points$3[0][0] = xi;
+                    points$3[0][1] = yi;
+                    break;
+                case L:
+                    cmdStr = ' l ';
+                    nPoint = 1;
+                    xi = data[i++];
+                    yi = data[i++];
+                    points$3[0][0] = xi;
+                    points$3[0][1] = yi;
+                    break;
+                case Q:
+                case C:
+                    cmdStr = ' c ';
+                    nPoint = 3;
+                    var x1 = data[i++];
+                    var y1 = data[i++];
+                    var x2 = data[i++];
+                    var y2 = data[i++];
+                    var x3;
+                    var y3;
+                    if (cmd === Q) {
+                        // Convert quadratic to cubic using degree elevation
+                        x3 = x2;
+                        y3 = y2;
+                        x2 = (x2 + 2 * x1) / 3;
+                        y2 = (y2 + 2 * y1) / 3;
+                        x1 = (xi + 2 * x1) / 3;
+                        y1 = (yi + 2 * y1) / 3;
+                    }
+                    else {
+                        x3 = data[i++];
+                        y3 = data[i++];
+                    }
+                    points$3[0][0] = x1;
+                    points$3[0][1] = y1;
+                    points$3[1][0] = x2;
+                    points$3[1][1] = y2;
+                    points$3[2][0] = x3;
+                    points$3[2][1] = y3;
+
+                    xi = x3;
+                    yi = y3;
+                    break;
+                case A:
+                    var x = 0;
+                    var y = 0;
+                    var sx = 1;
+                    var sy = 1;
+                    var angle = 0;
+                    if (m) {
+                        // Extract SRT from matrix
+                        x = m[4];
+                        y = m[5];
+                        sx = sqrt(m[0] * m[0] + m[1] * m[1]);
+                        sy = sqrt(m[2] * m[2] + m[3] * m[3]);
+                        angle = Math.atan2(-m[1] / sy, m[0] / sx);
+                    }
+
+                    var cx = data[i++];
+                    var cy = data[i++];
+                    var rx = data[i++];
+                    var ry = data[i++];
+                    var startAngle = data[i++] + angle;
+                    var endAngle = data[i++] + startAngle + angle;
+                    // FIXME
+                    // var psi = data[i++];
+                    i++;
+                    var clockwise = data[i++];
+
+                    var x0 = cx + cos(startAngle) * rx;
+                    var y0 = cy + sin(startAngle) * ry;
+
+                    var x1 = cx + cos(endAngle) * rx;
+                    var y1 = cy + sin(endAngle) * ry;
+
+                    var type = clockwise ? ' wa ' : ' at ';
+                    if (Math.abs(x0 - x1) < 1e-4) {
+                        // IE won't render arches drawn counter clockwise if x0 == x1.
+                        if (Math.abs(endAngle - startAngle) > 1e-2) {
+                            // Offset x0 by 1/80 of a pixel. Use something
+                            // that can be represented in binary
+                            if (clockwise) {
+                                x0 += 270 / Z;
+                            }
+                        }
+                        else {
+                            // Avoid case draw full circle
+                            if (Math.abs(y0 - cy) < 1e-4) {
+                                if ((clockwise && x0 < cx) || (!clockwise && x0 > cx)) {
+                                    y1 -= 270 / Z;
+                                }
+                                else {
+                                    y1 += 270 / Z;
+                                }
+                            }
+                            else if ((clockwise && y0 < cy) || (!clockwise && y0 > cy)) {
+                                x1 += 270 / Z;
+                            }
+                            else {
+                                x1 -= 270 / Z;
+                            }
+                        }
+                    }
+                    str.push(
+                        type,
+                        round$3(((cx - rx) * sx + x) * Z - Z2), comma,
+                        round$3(((cy - ry) * sy + y) * Z - Z2), comma,
+                        round$3(((cx + rx) * sx + x) * Z - Z2), comma,
+                        round$3(((cy + ry) * sy + y) * Z - Z2), comma,
+                        round$3((x0 * sx + x) * Z - Z2), comma,
+                        round$3((y0 * sy + y) * Z - Z2), comma,
+                        round$3((x1 * sx + x) * Z - Z2), comma,
+                        round$3((y1 * sy + y) * Z - Z2)
+                    );
+
+                    xi = x1;
+                    yi = y1;
+                    break;
+                case CMD$3.R:
+                    var p0 = points$3[0];
+                    var p1 = points$3[1];
+                    // x0, y0
+                    p0[0] = data[i++];
+                    p0[1] = data[i++];
+                    // x1, y1
+                    p1[0] = p0[0] + data[i++];
+                    p1[1] = p0[1] + data[i++];
+
+                    if (m) {
+                        applyTransform(p0, p0, m);
+                        applyTransform(p1, p1, m);
+                    }
+
+                    p0[0] = round$3(p0[0] * Z - Z2);
+                    p1[0] = round$3(p1[0] * Z - Z2);
+                    p0[1] = round$3(p0[1] * Z - Z2);
+                    p1[1] = round$3(p1[1] * Z - Z2);
+                    str.push(
+                        // x0, y0
+                        ' m ', p0[0], comma, p0[1],
+                        // x1, y0
+                        ' l ', p1[0], comma, p0[1],
+                        // x1, y1
+                        ' l ', p1[0], comma, p1[1],
+                        // x0, y1
+                        ' l ', p0[0], comma, p1[1]
+                    );
+                    break;
+                case CMD$3.Z:
+                    // FIXME Update xi, yi
+                    str.push(' x ');
+            }
+
+            if (nPoint > 0) {
+                str.push(cmdStr);
+                for (var k = 0; k < nPoint; k++) {
+                    var p = points$3[k];
+
+                    m && applyTransform(p, p, m);
+                    // 不 round 会非常慢
+                    str.push(
+                        round$3(p[0] * Z - Z2), comma, round$3(p[1] * Z - Z2),
+                        k < nPoint - 1 ? comma : ''
+                    );
+                }
+            }
+        }
+
+        return str.join('');
+    };
+
+    // Rewrite the original path method
+    Path.prototype.brushVML = function (vmlRoot) {
+        var style = this.style;
+
+        var vmlEl = this._vmlEl;
+        if (!vmlEl) {
+            vmlEl = createNode('shape');
+            initRootElStyle(vmlEl);
+
+            this._vmlEl = vmlEl;
+        }
+
+        updateFillAndStroke(vmlEl, 'fill', style, this);
+        updateFillAndStroke(vmlEl, 'stroke', style, this);
+
+        var m = this.transform;
+        var needTransform = m != null;
+        var strokeEl = vmlEl.getElementsByTagName('stroke')[0];
+        if (strokeEl) {
+            var lineWidth = style.lineWidth;
+            // Get the line scale.
+            // Determinant of this.m_ means how much the area is enlarged by the
+            // transformation. So its square root can be used as a scale factor
+            // for width.
+            if (needTransform && !style.strokeNoScale) {
+                var det = m[0] * m[3] - m[1] * m[2];
+                lineWidth *= sqrt(abs$1(det));
+            }
+            strokeEl.weight = lineWidth + 'px';
+        }
+
+        var path = this.path || (this.path = new PathProxy());
+        if (this.__dirtyPath) {
+            path.beginPath();
+            this.buildPath(path, this.shape);
+            path.toStatic();
+            this.__dirtyPath = false;
+        }
+
+        vmlEl.path = pathDataToString(path, this.transform);
+
+        vmlEl.style.zIndex = getZIndex(this.zlevel, this.z, this.z2);
+
+        // Append to root
+        append(vmlRoot, vmlEl);
+
+        // Text
+        if (style.text != null) {
+            this.drawRectText(vmlRoot, this.getBoundingRect());
+        }
+        else {
+            this.removeRectText(vmlRoot);
+        }
+    };
+
+    Path.prototype.onRemove = function (vmlRoot) {
+        remove(vmlRoot, this._vmlEl);
+        this.removeRectText(vmlRoot);
+    };
+
+    Path.prototype.onAdd = function (vmlRoot) {
+        append(vmlRoot, this._vmlEl);
+        this.appendRectText(vmlRoot);
+    };
+
+    /***************************************************
+     * IMAGE
+     **************************************************/
+    var isImage = function (img) {
+        // FIXME img instanceof Image 如果 img 是一个字符串的时候，IE8 下会报错
+        return (typeof img === 'object') && img.tagName && img.tagName.toUpperCase() === 'IMG';
+        // return img instanceof Image;
+    };
+
+    // Rewrite the original path method
+    ZImage.prototype.brushVML = function (vmlRoot) {
+        var style = this.style;
+        var image = style.image;
+
+        // Image original width, height
+        var ow;
+        var oh;
+
+        if (isImage(image)) {
+            var src = image.src;
+            if (src === this._imageSrc) {
+                ow = this._imageWidth;
+                oh = this._imageHeight;
+            }
+            else {
+                var imageRuntimeStyle = image.runtimeStyle;
+                var oldRuntimeWidth = imageRuntimeStyle.width;
+                var oldRuntimeHeight = imageRuntimeStyle.height;
+                imageRuntimeStyle.width = 'auto';
+                imageRuntimeStyle.height = 'auto';
+
+                // get the original size
+                ow = image.width;
+                oh = image.height;
+
+                // and remove overides
+                imageRuntimeStyle.width = oldRuntimeWidth;
+                imageRuntimeStyle.height = oldRuntimeHeight;
+
+                // Caching image original width, height and src
+                this._imageSrc = src;
+                this._imageWidth = ow;
+                this._imageHeight = oh;
+            }
+            image = src;
+        }
+        else {
+            if (image === this._imageSrc) {
+                ow = this._imageWidth;
+                oh = this._imageHeight;
+            }
+        }
+        if (!image) {
+            return;
+        }
+
+        var x = style.x || 0;
+        var y = style.y || 0;
+
+        var dw = style.width;
+        var dh = style.height;
+
+        var sw = style.sWidth;
+        var sh = style.sHeight;
+        var sx = style.sx || 0;
+        var sy = style.sy || 0;
+
+        var hasCrop = sw && sh;
+
+        var vmlEl = this._vmlEl;
+        if (!vmlEl) {
+            // FIXME 使用 group 在 left, top 都不是 0 的时候就无法显示了。
+            // vmlEl = vmlCore.createNode('group');
+            vmlEl = doc.createElement('div');
+            initRootElStyle(vmlEl);
+
+            this._vmlEl = vmlEl;
+        }
+
+        var vmlElStyle = vmlEl.style;
+        var hasRotation = false;
+        var m;
+        var scaleX = 1;
+        var scaleY = 1;
+        if (this.transform) {
+            m = this.transform;
+            scaleX = sqrt(m[0] * m[0] + m[1] * m[1]);
+            scaleY = sqrt(m[2] * m[2] + m[3] * m[3]);
+
+            hasRotation = m[1] || m[2];
+        }
+        if (hasRotation) {
+            // If filters are necessary (rotation exists), create them
+            // filters are bog-slow, so only create them if abbsolutely necessary
+            // The following check doesn't account for skews (which don't exist
+            // in the canvas spec (yet) anyway.
+            // From excanvas
+            var p0 = [x, y];
+            var p1 = [x + dw, y];
+            var p2 = [x, y + dh];
+            var p3 = [x + dw, y + dh];
+            applyTransform(p0, p0, m);
+            applyTransform(p1, p1, m);
+            applyTransform(p2, p2, m);
+            applyTransform(p3, p3, m);
+
+            var maxX = mathMax$8(p0[0], p1[0], p2[0], p3[0]);
+            var maxY = mathMax$8(p0[1], p1[1], p2[1], p3[1]);
+
+            var transformFilter = [];
+            transformFilter.push('M11=', m[0] / scaleX, comma,
+                        'M12=', m[2] / scaleY, comma,
+                        'M21=', m[1] / scaleX, comma,
+                        'M22=', m[3] / scaleY, comma,
+                        'Dx=', round$3(x * scaleX + m[4]), comma,
+                        'Dy=', round$3(y * scaleY + m[5]));
+
+            vmlElStyle.padding = '0 ' + round$3(maxX) + 'px ' + round$3(maxY) + 'px 0';
+            // FIXME DXImageTransform 在 IE11 的兼容模式下不起作用
+            vmlElStyle.filter = imageTransformPrefix + '.Matrix('
+                + transformFilter.join('') + ', SizingMethod=clip)';
+
+        }
+        else {
+            if (m) {
+                x = x * scaleX + m[4];
+                y = y * scaleY + m[5];
+            }
+            vmlElStyle.filter = '';
+            vmlElStyle.left = round$3(x) + 'px';
+            vmlElStyle.top = round$3(y) + 'px';
+        }
+
+        var imageEl = this._imageEl;
+        var cropEl = this._cropEl;
+
+        if (!imageEl) {
+            imageEl = doc.createElement('div');
+            this._imageEl = imageEl;
+        }
+        var imageELStyle = imageEl.style;
+        if (hasCrop) {
+            // Needs know image original width and height
+            if (! (ow && oh)) {
+                var tmpImage = new Image();
+                var self = this;
+                tmpImage.onload = function () {
+                    tmpImage.onload = null;
+                    ow = tmpImage.width;
+                    oh = tmpImage.height;
+                    // Adjust image width and height to fit the ratio destinationSize / sourceSize
+                    imageELStyle.width = round$3(scaleX * ow * dw / sw) + 'px';
+                    imageELStyle.height = round$3(scaleY * oh * dh / sh) + 'px';
+
+                    // Caching image original width, height and src
+                    self._imageWidth = ow;
+                    self._imageHeight = oh;
+                    self._imageSrc = image;
+                };
+                tmpImage.src = image;
+            }
+            else {
+                imageELStyle.width = round$3(scaleX * ow * dw / sw) + 'px';
+                imageELStyle.height = round$3(scaleY * oh * dh / sh) + 'px';
+            }
+
+            if (! cropEl) {
+                cropEl = doc.createElement('div');
+                cropEl.style.overflow = 'hidden';
+                this._cropEl = cropEl;
+            }
+            var cropElStyle = cropEl.style;
+            cropElStyle.width = round$3((dw + sx * dw / sw) * scaleX);
+            cropElStyle.height = round$3((dh + sy * dh / sh) * scaleY);
+            cropElStyle.filter = imageTransformPrefix + '.Matrix(Dx='
+                    + (-sx * dw / sw * scaleX) + ',Dy=' + (-sy * dh / sh * scaleY) + ')';
+
+            if (! cropEl.parentNode) {
+                vmlEl.appendChild(cropEl);
+            }
+            if (imageEl.parentNode != cropEl) {
+                cropEl.appendChild(imageEl);
+            }
+        }
+        else {
+            imageELStyle.width = round$3(scaleX * dw) + 'px';
+            imageELStyle.height = round$3(scaleY * dh) + 'px';
+
+            vmlEl.appendChild(imageEl);
+
+            if (cropEl && cropEl.parentNode) {
+                vmlEl.removeChild(cropEl);
+                this._cropEl = null;
+            }
+        }
+
+        var filterStr = '';
+        var alpha = style.opacity;
+        if (alpha < 1) {
+            filterStr += '.Alpha(opacity=' + round$3(alpha * 100) + ') ';
+        }
+        filterStr += imageTransformPrefix + '.AlphaImageLoader(src=' + image + ', SizingMethod=scale)';
+
+        imageELStyle.filter = filterStr;
+
+        vmlEl.style.zIndex = getZIndex(this.zlevel, this.z, this.z2);
+
+        // Append to root
+        append(vmlRoot, vmlEl);
+
+        // Text
+        if (style.text != null) {
+            this.drawRectText(vmlRoot, this.getBoundingRect());
+        }
+    };
+
+    ZImage.prototype.onRemove = function (vmlRoot) {
+        remove(vmlRoot, this._vmlEl);
+
+        this._vmlEl = null;
+        this._cropEl = null;
+        this._imageEl = null;
+
+        this.removeRectText(vmlRoot);
+    };
+
+    ZImage.prototype.onAdd = function (vmlRoot) {
+        append(vmlRoot, this._vmlEl);
+        this.appendRectText(vmlRoot);
+    };
+
+
+    /***************************************************
+     * TEXT
+     **************************************************/
+
+    var DEFAULT_STYLE_NORMAL = 'normal';
+
+    var fontStyleCache = {};
+    var fontStyleCacheCount = 0;
+    var MAX_FONT_CACHE_SIZE = 100;
+    var fontEl = document.createElement('div');
+
+    var getFontStyle = function (fontString) {
+        var fontStyle = fontStyleCache[fontString];
+        if (!fontStyle) {
+            // Clear cache
+            if (fontStyleCacheCount > MAX_FONT_CACHE_SIZE) {
+                fontStyleCacheCount = 0;
+                fontStyleCache = {};
+            }
+
+            var style = fontEl.style;
+            var fontFamily;
+            try {
+                style.font = fontString;
+                fontFamily = style.fontFamily.split(',')[0];
+            }
+            catch (e) {
+            }
+
+            fontStyle = {
+                style: style.fontStyle || DEFAULT_STYLE_NORMAL,
+                variant: style.fontVariant || DEFAULT_STYLE_NORMAL,
+                weight: style.fontWeight || DEFAULT_STYLE_NORMAL,
+                size: parseFloat(style.fontSize || 12) | 0,
+                family: fontFamily || 'Microsoft YaHei'
+            };
+
+            fontStyleCache[fontString] = fontStyle;
+            fontStyleCacheCount++;
+        }
+        return fontStyle;
+    };
+
+    var textMeasureEl;
+    // Overwrite measure text method
+    $override$1('measureText', function (text, textFont) {
+        var doc$$1 = doc;
+        if (!textMeasureEl) {
+            textMeasureEl = doc$$1.createElement('div');
+            textMeasureEl.style.cssText = 'position:absolute;top:-20000px;left:0;'
+                + 'padding:0;margin:0;border:none;white-space:pre;';
+            doc.body.appendChild(textMeasureEl);
+        }
+
+        try {
+            textMeasureEl.style.font = textFont;
+        } catch (ex) {
+            // Ignore failures to set to invalid font.
+        }
+        textMeasureEl.innerHTML = '';
+        // Don't use innerHTML or innerText because they allow markup/whitespace.
+        textMeasureEl.appendChild(doc$$1.createTextNode(text));
+        return {
+            width: textMeasureEl.offsetWidth
+        };
+    });
+
+    var tmpRect$2 = new BoundingRect();
+
+    var drawRectText = function (vmlRoot, rect, textRect, fromTextEl) {
+
+        var style = this.style;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        var text = style.text;
+        // Convert to string
+        text != null && (text += '');
+        if (!text) {
+            return;
+        }
+
+        // Convert rich text to plain text. Rich text is not supported in
+        // IE8-, but tags in rich text template will be removed.
+        if (style.rich) {
+            var contentBlock = parseRichText(text, style);
+            text = [];
+            for (var i = 0; i < contentBlock.lines.length; i++) {
+                var tokens = contentBlock.lines[i].tokens;
+                var textLine = [];
+                for (var j = 0; j < tokens.length; j++) {
+                    textLine.push(tokens[j].text);
+                }
+                text.push(textLine.join(''));
+            }
+            text = text.join('\n');
+        }
+
+        var x;
+        var y;
+        var align = style.textAlign;
+        var verticalAlign = style.textVerticalAlign;
+
+        var fontStyle = getFontStyle(style.font);
+        // FIXME encodeHtmlAttribute ?
+        var font = fontStyle.style + ' ' + fontStyle.variant + ' ' + fontStyle.weight + ' '
+            + fontStyle.size + 'px "' + fontStyle.family + '"';
+
+        textRect = textRect || getBoundingRect(text, font, align, verticalAlign);
+
+        // Transform rect to view space
+        var m = this.transform;
+        // Ignore transform for text in other element
+        if (m && !fromTextEl) {
+            tmpRect$2.copy(rect);
+            tmpRect$2.applyTransform(m);
+            rect = tmpRect$2;
+        }
+
+        if (!fromTextEl) {
+            var textPosition = style.textPosition;
+            var distance$$1 = style.textDistance;
+            // Text position represented by coord
+            if (textPosition instanceof Array) {
+                x = rect.x + parsePercent$3(textPosition[0], rect.width);
+                y = rect.y + parsePercent$3(textPosition[1], rect.height);
+
+                align = align || 'left';
+            }
+            else {
+                var res = adjustTextPositionOnRect(
+                    textPosition, rect, distance$$1
+                );
+                x = res.x;
+                y = res.y;
+
+                // Default align and baseline when has textPosition
+                align = align || res.textAlign;
+                verticalAlign = verticalAlign || res.textVerticalAlign;
+            }
+        }
+        else {
+            x = rect.x;
+            y = rect.y;
+        }
+
+        x = adjustTextX(x, textRect.width, align);
+        y = adjustTextY(y, textRect.height, verticalAlign);
+
+        // Force baseline 'middle'
+        y += textRect.height / 2;
+
+        // var fontSize = fontStyle.size;
+        // 1.75 is an arbitrary number, as there is no info about the text baseline
+        // switch (baseline) {
+            // case 'hanging':
+            // case 'top':
+            //     y += fontSize / 1.75;
+            //     break;
+        //     case 'middle':
+        //         break;
+        //     default:
+        //     // case null:
+        //     // case 'alphabetic':
+        //     // case 'ideographic':
+        //     // case 'bottom':
+        //         y -= fontSize / 2.25;
+        //         break;
+        // }
+
+        // switch (align) {
+        //     case 'left':
+        //         break;
+        //     case 'center':
+        //         x -= textRect.width / 2;
+        //         break;
+        //     case 'right':
+        //         x -= textRect.width;
+        //         break;
+            // case 'end':
+                // align = elementStyle.direction == 'ltr' ? 'right' : 'left';
+                // break;
+            // case 'start':
+                // align = elementStyle.direction == 'rtl' ? 'right' : 'left';
+                // break;
+            // default:
+            //     align = 'left';
+        // }
+
+        var createNode$$1 = createNode;
+
+        var textVmlEl = this._textVmlEl;
+        var pathEl;
+        var textPathEl;
+        var skewEl;
+        if (!textVmlEl) {
+            textVmlEl = createNode$$1('line');
+            pathEl = createNode$$1('path');
+            textPathEl = createNode$$1('textpath');
+            skewEl = createNode$$1('skew');
+
+            // FIXME Why here is not cammel case
+            // Align 'center' seems wrong
+            textPathEl.style['v-text-align'] = 'left';
+
+            initRootElStyle(textVmlEl);
+
+            pathEl.textpathok = true;
+            textPathEl.on = true;
+
+            textVmlEl.from = '0 0';
+            textVmlEl.to = '1000 0.05';
+
+            append(textVmlEl, skewEl);
+            append(textVmlEl, pathEl);
+            append(textVmlEl, textPathEl);
+
+            this._textVmlEl = textVmlEl;
+        }
+        else {
+            // 这里是在前面 appendChild 保证顺序的前提下
+            skewEl = textVmlEl.firstChild;
+            pathEl = skewEl.nextSibling;
+            textPathEl = pathEl.nextSibling;
+        }
+
+        var coords = [x, y];
+        var textVmlElStyle = textVmlEl.style;
+        // Ignore transform for text in other element
+        if (m && fromTextEl) {
+            applyTransform(coords, coords, m);
+
+            skewEl.on = true;
+
+            skewEl.matrix = m[0].toFixed(3) + comma + m[2].toFixed(3) + comma +
+            m[1].toFixed(3) + comma + m[3].toFixed(3) + ',0,0';
+
+            // Text position
+            skewEl.offset = (round$3(coords[0]) || 0) + ',' + (round$3(coords[1]) || 0);
+            // Left top point as origin
+            skewEl.origin = '0 0';
+
+            textVmlElStyle.left = '0px';
+            textVmlElStyle.top = '0px';
+        }
+        else {
+            skewEl.on = false;
+            textVmlElStyle.left = round$3(x) + 'px';
+            textVmlElStyle.top = round$3(y) + 'px';
+        }
+
+        textPathEl.string = encodeHtmlAttribute(text);
+        // TODO
+        try {
+            textPathEl.style.font = font;
+        }
+        // Error font format
+        catch (e) {}
+
+        updateFillAndStroke(textVmlEl, 'fill', {
+            fill: style.textFill,
+            opacity: style.opacity
+        }, this);
+        updateFillAndStroke(textVmlEl, 'stroke', {
+            stroke: style.textStroke,
+            opacity: style.opacity,
+            lineDash: style.lineDash
+        }, this);
+
+        textVmlEl.style.zIndex = getZIndex(this.zlevel, this.z, this.z2);
+
+        // Attached to root
+        append(vmlRoot, textVmlEl);
+    };
+
+    var removeRectText = function (vmlRoot) {
+        remove(vmlRoot, this._textVmlEl);
+        this._textVmlEl = null;
+    };
+
+    var appendRectText = function (vmlRoot) {
+        append(vmlRoot, this._textVmlEl);
+    };
+
+    var list = [RectText, Displayable, ZImage, Path, Text];
+
+    // In case Displayable has been mixed in RectText
+    for (var i$3 = 0; i$3 < list.length; i$3++) {
+        var proto$8 = list[i$3].prototype;
+        proto$8.drawRectText = drawRectText;
+        proto$8.removeRectText = removeRectText;
+        proto$8.appendRectText = appendRectText;
+    }
+
+    Text.prototype.brushVML = function (vmlRoot) {
+        var style = this.style;
+        if (style.text != null) {
+            this.drawRectText(vmlRoot, {
+                x: style.x || 0, y: style.y || 0,
+                width: 0, height: 0
+            }, this.getBoundingRect(), true);
+        }
+        else {
+            this.removeRectText(vmlRoot);
+        }
+    };
+
+    Text.prototype.onRemove = function (vmlRoot) {
+        this.removeRectText(vmlRoot);
+    };
+
+    Text.prototype.onAdd = function (vmlRoot) {
+        this.appendRectText(vmlRoot);
+    };
+}
+
+/**
+ * VML Painter.
+ *
+ * @module zrender/vml/Painter
+ */
+
+function parseInt10$1(val) {
+    return parseInt(val, 10);
+}
+
+/**
+ * @alias module:zrender/vml/Painter
+ */
+function VMLPainter(root, storage) {
+
+    initVML();
+
+    this.root = root;
+
+    this.storage = storage;
+
+    var vmlViewport = document.createElement('div');
+
+    var vmlRoot = document.createElement('div');
+
+    vmlViewport.style.cssText = 'display:inline-block;overflow:hidden;position:relative;width:300px;height:150px;';
+
+    vmlRoot.style.cssText = 'position:absolute;left:0;top:0;';
+
+    root.appendChild(vmlViewport);
+
+    this._vmlRoot = vmlRoot;
+    this._vmlViewport = vmlViewport;
+
+    this.resize();
+
+    // Modify storage
+    var oldDelFromStorage = storage.delFromStorage;
+    var oldAddToStorage = storage.addToStorage;
+    storage.delFromStorage = function (el) {
+        oldDelFromStorage.call(storage, el);
+
+        if (el) {
+            el.onRemove && el.onRemove(vmlRoot);
+        }
+    };
+
+    storage.addToStorage = function (el) {
+        // Displayable already has a vml node
+        el.onAdd && el.onAdd(vmlRoot);
+
+        oldAddToStorage.call(storage, el);
+    };
+
+    this._firstPaint = true;
+}
+
+VMLPainter.prototype = {
+
+    constructor: VMLPainter,
+
+    getType: function () {
+        return 'vml';
+    },
+
+    /**
+     * @return {HTMLDivElement}
+     */
+    getViewportRoot: function () {
+        return this._vmlViewport;
+    },
+
+    getViewportRootOffset: function () {
+        var viewportRoot = this.getViewportRoot();
+        if (viewportRoot) {
+            return {
+                offsetLeft: viewportRoot.offsetLeft || 0,
+                offsetTop: viewportRoot.offsetTop || 0
+            };
+        }
+    },
+
+    /**
+     * 刷新
+     */
+    refresh: function () {
+
+        var list = this.storage.getDisplayList(true, true);
+
+        this._paintList(list);
+    },
+
+    _paintList: function (list) {
+        var vmlRoot = this._vmlRoot;
+        for (var i = 0; i < list.length; i++) {
+            var el = list[i];
+            if (el.invisible || el.ignore) {
+                if (!el.__alreadyNotVisible) {
+                    el.onRemove(vmlRoot);
+                }
+                // Set as already invisible
+                el.__alreadyNotVisible = true;
+            }
+            else {
+                if (el.__alreadyNotVisible) {
+                    el.onAdd(vmlRoot);
+                }
+                el.__alreadyNotVisible = false;
+                if (el.__dirty) {
+                    el.beforeBrush && el.beforeBrush();
+                    (el.brushVML || el.brush).call(el, vmlRoot);
+                    el.afterBrush && el.afterBrush();
+                }
+            }
+            el.__dirty = false;
+        }
+
+        if (this._firstPaint) {
+            // Detached from document at first time
+            // to avoid page refreshing too many times
+
+            // FIXME 如果每次都先 removeChild 可能会导致一些填充和描边的效果改变
+            this._vmlViewport.appendChild(vmlRoot);
+            this._firstPaint = false;
+        }
+    },
+
+    resize: function (width, height) {
+        var width = width == null ? this._getWidth() : width;
+        var height = height == null ? this._getHeight() : height;
+
+        if (this._width != width || this._height != height) {
+            this._width = width;
+            this._height = height;
+
+            var vmlViewportStyle = this._vmlViewport.style;
+            vmlViewportStyle.width = width + 'px';
+            vmlViewportStyle.height = height + 'px';
+        }
+    },
+
+    dispose: function () {
+        this.root.innerHTML = '';
+
+        this._vmlRoot =
+        this._vmlViewport =
+        this.storage = null;
+    },
+
+    getWidth: function () {
+        return this._width;
+    },
+
+    getHeight: function () {
+        return this._height;
+    },
+
+    clear: function () {
+        if (this._vmlViewport) {
+            this.root.removeChild(this._vmlViewport);
+        }
+    },
+
+    _getWidth: function () {
+        var root = this.root;
+        var stl = root.currentStyle;
+
+        return ((root.clientWidth || parseInt10$1(stl.width))
+                - parseInt10$1(stl.paddingLeft)
+                - parseInt10$1(stl.paddingRight)) | 0;
+    },
+
+    _getHeight: function () {
+        var root = this.root;
+        var stl = root.currentStyle;
+
+        return ((root.clientHeight || parseInt10$1(stl.height))
+                - parseInt10$1(stl.paddingTop)
+                - parseInt10$1(stl.paddingBottom)) | 0;
+    }
+};
+
+// Not supported methods
+function createMethodNotSupport(method) {
+    return function () {
+        zrLog('In IE8.0 VML mode painter not support method "' + method + '"');
+    };
+}
+
+// Unsupported methods
+each$1([
+    'getLayer', 'insertLayer', 'eachLayer', 'eachBuiltinLayer', 'eachOtherLayer', 'getLayers',
+    'modLayer', 'delLayer', 'clearLayer', 'toDataURL', 'pathToImage'
+], function (name) {
+    VMLPainter.prototype[name] = createMethodNotSupport(name);
+});
+
+registerPainter('vml', VMLPainter);
+
+var svgURI = 'http://www.w3.org/2000/svg';
+
+function createElement(name) {
+    return document.createElementNS(svgURI, name);
+}
+
+// TODO
+// 1. shadow
+// 2. Image: sx, sy, sw, sh
+
+var CMD$4 = PathProxy.CMD;
+var arrayJoin = Array.prototype.join;
+
+var NONE = 'none';
+var mathRound = Math.round;
+var mathSin$3 = Math.sin;
+var mathCos$3 = Math.cos;
+var PI$5 = Math.PI;
+var PI2$7 = Math.PI * 2;
+var degree = 180 / PI$5;
+
+var EPSILON$4 = 1e-4;
+
+function round4(val) {
+    return mathRound(val * 1e4) / 1e4;
+}
+
+function isAroundZero$1(val) {
+    return val < EPSILON$4 && val > -EPSILON$4;
+}
+
+function pathHasFill(style, isText) {
+    var fill = isText ? style.textFill : style.fill;
+    return fill != null && fill !== NONE;
+}
+
+function pathHasStroke(style, isText) {
+    var stroke = isText ? style.textStroke : style.stroke;
+    return stroke != null && stroke !== NONE;
+}
+
+function setTransform(svgEl, m) {
+    if (m) {
+        attr(svgEl, 'transform', 'matrix(' + arrayJoin.call(m, ',') + ')');
+    }
+}
+
+function attr(el, key, val) {
+    if (!val || val.type !== 'linear' && val.type !== 'radial') {
+        // Don't set attribute for gradient, since it need new dom nodes
+        if (typeof val === 'string' && val.indexOf('NaN') > -1) {
+            console.log(val);
+        }
+        el.setAttribute(key, val);
+    }
+}
+
+function attrXLink(el, key, val) {
+    el.setAttributeNS('http://www.w3.org/1999/xlink', key, val);
+}
+
+function bindStyle(svgEl, style, isText) {
+    if (pathHasFill(style, isText)) {
+        var fill = isText ? style.textFill : style.fill;
+        fill = fill === 'transparent' ? NONE : fill;
+
+        /**
+         * FIXME:
+         * This is a temporary fix for Chrome's clipping bug
+         * that happens when a clip-path is referring another one.
+         * This fix should be used before Chrome's bug is fixed.
+         * For an element that has clip-path, and fill is none,
+         * set it to be "rgba(0, 0, 0, 0.002)" will hide the element.
+         * Otherwise, it will show black fill color.
+         * 0.002 is used because this won't work for alpha values smaller
+         * than 0.002.
+         *
+         * See
+         * https://bugs.chromium.org/p/chromium/issues/detail?id=659790
+         * for more information.
+         */
+        if (svgEl.getAttribute('clip-path') !== 'none' && fill === NONE) {
+            fill = 'rgba(0, 0, 0, 0.002)';
+        }
+
+        attr(svgEl, 'fill', fill);
+        attr(svgEl, 'fill-opacity', style.opacity);
+    }
+    else {
+        attr(svgEl, 'fill', NONE);
+    }
+
+    if (pathHasStroke(style, isText)) {
+        var stroke = isText ? style.textStroke : style.stroke;
+        stroke = stroke === 'transparent' ? NONE : stroke;
+        attr(svgEl, 'stroke', stroke);
+        var strokeWidth = isText
+            ? style.textStrokeWidth
+            : style.lineWidth;
+        var strokeScale = !isText && style.strokeNoScale
+            ? style.host.getLineScale()
+            : 1;
+        attr(svgEl, 'stroke-width', strokeWidth / strokeScale);
+        // stroke then fill for text; fill then stroke for others
+        attr(svgEl, 'paint-order', isText ? 'stroke' : 'fill');
+        attr(svgEl, 'stroke-opacity', style.opacity);
+        var lineDash = style.lineDash;
+        if (lineDash) {
+            attr(svgEl, 'stroke-dasharray', style.lineDash.join(','));
+            attr(svgEl, 'stroke-dashoffset', mathRound(style.lineDashOffset || 0));
+        }
+        else {
+            attr(svgEl, 'stroke-dasharray', '');
+        }
+
+        // PENDING
+        style.lineCap && attr(svgEl, 'stroke-linecap', style.lineCap);
+        style.lineJoin && attr(svgEl, 'stroke-linejoin', style.lineJoin);
+        style.miterLimit && attr(svgEl, 'stroke-miterlimit', style.miterLimit);
+    }
+    else {
+        attr(svgEl, 'stroke', NONE);
+    }
+}
+
+/***************************************************
+ * PATH
+ **************************************************/
+function pathDataToString$1(path) {
+    var str = [];
+    var data = path.data;
+    var dataLength = path.len();
+    for (var i = 0; i < dataLength;) {
+        var cmd = data[i++];
+        var cmdStr = '';
+        var nData = 0;
+        switch (cmd) {
+            case CMD$4.M:
+                cmdStr = 'M';
+                nData = 2;
+                break;
+            case CMD$4.L:
+                cmdStr = 'L';
+                nData = 2;
+                break;
+            case CMD$4.Q:
+                cmdStr = 'Q';
+                nData = 4;
+                break;
+            case CMD$4.C:
+                cmdStr = 'C';
+                nData = 6;
+                break;
+            case CMD$4.A:
+                var cx = data[i++];
+                var cy = data[i++];
+                var rx = data[i++];
+                var ry = data[i++];
+                var theta = data[i++];
+                var dTheta = data[i++];
+                var psi = data[i++];
+                var clockwise = data[i++];
+
+                var dThetaPositive = Math.abs(dTheta);
+                var isCircle = isAroundZero$1(dThetaPositive - PI2$7)
+                    && !isAroundZero$1(dThetaPositive);
+
+                var large = false;
+                if (dThetaPositive >= PI2$7) {
+                    large = true;
+                }
+                else if (isAroundZero$1(dThetaPositive)) {
+                    large = false;
+                }
+                else {
+                    large = (dTheta > -PI$5 && dTheta < 0 || dTheta > PI$5)
+                        === !!clockwise;
+                }
+
+                var x0 = round4(cx + rx * mathCos$3(theta));
+                var y0 = round4(cy + ry * mathSin$3(theta));
+
+                // It will not draw if start point and end point are exactly the same
+                // We need to shift the end point with a small value
+                // FIXME A better way to draw circle ?
+                if (isCircle) {
+                    if (clockwise) {
+                        dTheta = PI2$7 - 1e-4;
+                    }
+                    else {
+                        dTheta = -PI2$7 + 1e-4;
+                    }
+
+                    large = true;
+
+                    if (i === 9) {
+                        // Move to (x0, y0) only when CMD.A comes at the
+                        // first position of a shape.
+                        // For instance, when drawing a ring, CMD.A comes
+                        // after CMD.M, so it's unnecessary to move to
+                        // (x0, y0).
+                        str.push('M', x0, y0);
+                    }
+                }
+
+                var x = round4(cx + rx * mathCos$3(theta + dTheta));
+                var y = round4(cy + ry * mathSin$3(theta + dTheta));
+
+                // FIXME Ellipse
+                str.push('A', round4(rx), round4(ry),
+                    mathRound(psi * degree), +large, +clockwise, x, y);
+                break;
+            case CMD$4.Z:
+                cmdStr = 'Z';
+                break;
+            case CMD$4.R:
+                var x = round4(data[i++]);
+                var y = round4(data[i++]);
+                var w = round4(data[i++]);
+                var h = round4(data[i++]);
+                str.push(
+                    'M', x, y,
+                    'L', x + w, y,
+                    'L', x + w, y + h,
+                    'L', x, y + h,
+                    'L', x, y
+                );
+                break;
+        }
+        cmdStr && str.push(cmdStr);
+        for (var j = 0; j < nData; j++) {
+            // PENDING With scale
+            str.push(round4(data[i++]));
+        }
+    }
+    return str.join(' ');
+}
+
+var svgPath = {};
+svgPath.brush = function (el) {
+    var style = el.style;
+
+    var svgEl = el.__svgEl;
+    if (!svgEl) {
+        svgEl = createElement('path');
+        el.__svgEl = svgEl;
+    }
+
+    if (!el.path) {
+        el.createPathProxy();
+    }
+    var path = el.path;
+
+    if (el.__dirtyPath) {
+        path.beginPath();
+        el.buildPath(path, el.shape);
+        el.__dirtyPath = false;
+
+        var pathStr = pathDataToString$1(path);
+        if (pathStr.indexOf('NaN') < 0) {
+            // Ignore illegal path, which may happen such in out-of-range
+            // data in Calendar series.
+            attr(svgEl, 'd', pathStr);
+        }
+    }
+
+    bindStyle(svgEl, style);
+    setTransform(svgEl, el.transform);
+
+    if (style.text != null) {
+        svgTextDrawRectText(el, el.getBoundingRect());
+    }
+};
+
+/***************************************************
+ * IMAGE
+ **************************************************/
+var svgImage = {};
+svgImage.brush = function (el) {
+    var style = el.style;
+    var image = style.image;
+
+    if (image instanceof HTMLImageElement) {
+        var src = image.src;
+        image = src;
+    }
+    if (! image) {
+        return;
+    }
+
+    var x = style.x || 0;
+    var y = style.y || 0;
+
+    var dw = style.width;
+    var dh = style.height;
+
+    var svgEl = el.__svgEl;
+    if (! svgEl) {
+        svgEl = createElement('image');
+        el.__svgEl = svgEl;
+    }
+
+    if (image !== el.__imageSrc) {
+        attrXLink(svgEl, 'href', image);
+        // Caching image src
+        el.__imageSrc = image;
+    }
+
+    attr(svgEl, 'width', dw);
+    attr(svgEl, 'height', dh);
+
+    attr(svgEl, 'x', x);
+    attr(svgEl, 'y', y);
+
+    setTransform(svgEl, el.transform);
+
+    if (style.text != null) {
+        svgTextDrawRectText(el, el.getBoundingRect());
+    }
+};
+
+/***************************************************
+ * TEXT
+ **************************************************/
+var svgText = {};
+var tmpRect$3 = new BoundingRect();
+
+var svgTextDrawRectText = function (el, rect, textRect) {
+    var style = el.style;
+
+    el.__dirty && normalizeTextStyle(style, true);
+
+    var text = style.text;
+    // Convert to string
+    if (text == null) {
+        // Draw no text only when text is set to null, but not ''
+        return;
+    }
+    else {
+        text += '';
+    }
+
+    var textSvgEl = el.__textSvgEl;
+    if (! textSvgEl) {
+        textSvgEl = createElement('text');
+        el.__textSvgEl = textSvgEl;
+    }
+
+    var x;
+    var y;
+    var textPosition = style.textPosition;
+    var distance = style.textDistance;
+    var align = style.textAlign || 'left';
+
+    if (typeof style.fontSize === 'number') {
+        style.fontSize += 'px';
+    }
+    var font = style.font
+        || [
+            style.fontStyle || '',
+            style.fontWeight || '',
+            style.fontSize || '',
+            style.fontFamily || ''
+        ].join(' ')
+        || DEFAULT_FONT;
+
+    var verticalAlign = getVerticalAlignForSvg(style.textVerticalAlign);
+
+    textRect = getBoundingRect(text, font, align,
+        verticalAlign);
+
+    var lineHeight = textRect.lineHeight;
+    // Text position represented by coord
+    if (textPosition instanceof Array) {
+        x = rect.x + textPosition[0];
+        y = rect.y + textPosition[1];
+    }
+    else {
+        var newPos = adjustTextPositionOnRect(
+            textPosition, rect, distance
+        );
+        x = newPos.x;
+        y = newPos.y;
+        verticalAlign = getVerticalAlignForSvg(newPos.textVerticalAlign);
+        align = newPos.textAlign;
+    }
+
+    attr(textSvgEl, 'alignment-baseline', verticalAlign);
+
+    if (font) {
+        textSvgEl.style.font = font;
+    }
+
+    var textPadding = style.textPadding;
+
+    // Make baseline top
+    attr(textSvgEl, 'x', x);
+    attr(textSvgEl, 'y', y);
+
+    bindStyle(textSvgEl, style, true);
+    if (el instanceof Text || el.style.transformText) {
+        // Transform text with element
+        setTransform(textSvgEl, el.transform);
+    }
+    else {
+        if (el.transform) {
+            tmpRect$3.copy(rect);
+            tmpRect$3.applyTransform(el.transform);
+            rect = tmpRect$3;
+        }
+        else {
+            var pos = el.transformCoordToGlobal(rect.x, rect.y);
+            rect.x = pos[0];
+            rect.y = pos[1];
+        }
+
+        // Text rotation, but no element transform
+        var origin = style.textOrigin;
+        if (origin === 'center') {
+            x = textRect.width / 2 + x;
+            y = textRect.height / 2 + y;
+        }
+        else if (origin) {
+            x = origin[0] + x;
+            y = origin[1] + y;
+        }
+        var rotate$$1 = -style.textRotation || 0;
+        var transform = create$1();
+        // Apply textRotate to element matrix
+        rotate(transform, el.transform, rotate$$1);
+        setTransform(textSvgEl, transform);
+    }
+
+    var textLines = text.split('\n');
+    var nTextLines = textLines.length;
+    var textAnchor = align;
+    // PENDING
+    if (textAnchor === 'left')  {
+        textAnchor = 'start';
+        textPadding && (x += textPadding[3]);
+    }
+    else if (textAnchor === 'right') {
+        textAnchor = 'end';
+        textPadding && (x -= textPadding[1]);
+    }
+    else if (textAnchor === 'center') {
+        textAnchor = 'middle';
+        textPadding && (x += (textPadding[3] - textPadding[1]) / 2);
+    }
+
+    var dy = 0;
+    if (verticalAlign === 'baseline') {
+        dy = -textRect.height + lineHeight;
+        textPadding && (dy -= textPadding[2]);
+    }
+    else if (verticalAlign === 'middle') {
+        dy = (-textRect.height + lineHeight) / 2;
+        textPadding && (y += (textPadding[0] - textPadding[2]) / 2);
+    }
+    else {
+        textPadding && (dy += textPadding[0]);
+    }
+
+    // Font may affect position of each tspan elements
+    if (el.__text !== text || el.__textFont !== font) {
+        var tspanList = el.__tspanList || [];
+        el.__tspanList = tspanList;
+        for (var i = 0; i < nTextLines; i++) {
+            // Using cached tspan elements
+            var tspan = tspanList[i];
+            if (! tspan) {
+                tspan = tspanList[i] = createElement('tspan');
+                textSvgEl.appendChild(tspan);
+                attr(tspan, 'alignment-baseline', verticalAlign);
+                attr(tspan, 'text-anchor', textAnchor);
+            }
+            else {
+                tspan.innerHTML = '';
+            }
+            attr(tspan, 'x', x);
+            attr(tspan, 'y', y + i * lineHeight + dy);
+            tspan.appendChild(document.createTextNode(textLines[i]));
+        }
+        // Remove unsed tspan elements
+        for (; i < tspanList.length; i++) {
+            textSvgEl.removeChild(tspanList[i]);
+        }
+        tspanList.length = nTextLines;
+
+        el.__text = text;
+        el.__textFont = font;
+    }
+    else if (el.__tspanList.length) {
+        // Update span x and y
+        var len = el.__tspanList.length;
+        for (var i = 0; i < len; ++i) {
+            var tspan = el.__tspanList[i];
+            if (tspan) {
+                attr(tspan, 'x', x);
+                attr(tspan, 'y', y + i * lineHeight + dy);
+            }
+        }
+    }
+};
+
+function getVerticalAlignForSvg(verticalAlign) {
+    if (verticalAlign === 'middle') {
+        return 'middle';
+    }
+    else if (verticalAlign === 'bottom') {
+        return 'baseline';
+    }
+    else {
+        return 'hanging';
+    }
+}
+
+svgText.drawRectText = svgTextDrawRectText;
+
+svgText.brush = function (el) {
+    var style = el.style;
+    if (style.text != null) {
+        // 强制设置 textPosition
+        style.textPosition = [0, 0];
+        svgTextDrawRectText(el, {
+            x: style.x || 0, y: style.y || 0,
+            width: 0, height: 0
+        }, el.getBoundingRect());
+    }
+};
+
+// Myers' Diff Algorithm
+// Modified from https://github.com/kpdecker/jsdiff/blob/master/src/diff/base.js
+
+function Diff() {}
+
+Diff.prototype = {
+    diff: function (oldArr, newArr, equals) {
+        if (!equals) {
+            equals = function (a, b) {
+                return a === b;
+            };
+        }
+        this.equals = equals;
+
+        var self = this;
+
+        oldArr = oldArr.slice();
+        newArr = newArr.slice();
+        // Allow subclasses to massage the input prior to running
+        var newLen = newArr.length;
+        var oldLen = oldArr.length;
+        var editLength = 1;
+        var maxEditLength = newLen + oldLen;
+        var bestPath = [{ newPos: -1, components: [] }];
+
+        // Seed editLength = 0, i.e. the content starts with the same values
+        var oldPos = this.extractCommon(bestPath[0], newArr, oldArr, 0);
+        if (bestPath[0].newPos + 1 >= newLen && oldPos + 1 >= oldLen) {
+            var indices = [];
+            for (var i = 0; i < newArr.length; i++) {
+                indices.push(i);
+            }
+            // Identity per the equality and tokenizer
+            return [{
+                indices: indices, count: newArr.length
+            }];
+        }
+
+        // Main worker method. checks all permutations of a given edit length for acceptance.
+        function execEditLength() {
+            for (var diagonalPath = -1 * editLength; diagonalPath <= editLength; diagonalPath += 2) {
+                var basePath;
+                var addPath = bestPath[diagonalPath - 1];
+                var removePath = bestPath[diagonalPath + 1];
+                var oldPos = (removePath ? removePath.newPos : 0) - diagonalPath;
+                if (addPath) {
+                    // No one else is going to attempt to use this value, clear it
+                    bestPath[diagonalPath - 1] = undefined;
+                }
+
+                var canAdd = addPath && addPath.newPos + 1 < newLen;
+                var canRemove = removePath && 0 <= oldPos && oldPos < oldLen;
+                if (!canAdd && !canRemove) {
+                    // If this path is a terminal then prune
+                    bestPath[diagonalPath] = undefined;
+                    continue;
+                }
+
+                // Select the diagonal that we want to branch from. We select the prior
+                // path whose position in the new string is the farthest from the origin
+                // and does not pass the bounds of the diff graph
+                if (!canAdd || (canRemove && addPath.newPos < removePath.newPos)) {
+                    basePath = clonePath(removePath);
+                    self.pushComponent(basePath.components, undefined, true);
+                }
+                else {
+                    basePath = addPath;   // No need to clone, we've pulled it from the list
+                    basePath.newPos++;
+                    self.pushComponent(basePath.components, true, undefined);
+                }
+
+                oldPos = self.extractCommon(basePath, newArr, oldArr, diagonalPath);
+
+                // If we have hit the end of both strings, then we are done
+                if (basePath.newPos + 1 >= newLen && oldPos + 1 >= oldLen) {
+                    return buildValues(self, basePath.components, newArr, oldArr);
+                }
+                else {
+                    // Otherwise track this path as a potential candidate and continue.
+                    bestPath[diagonalPath] = basePath;
+                }
+            }
+
+            editLength++;
+        }
+
+        while (editLength <= maxEditLength) {
+            var ret = execEditLength();
+            if (ret) {
+                return ret;
+            }
+        }
+    },
+
+    pushComponent: function (components, added, removed) {
+        var last = components[components.length - 1];
+        if (last && last.added === added && last.removed === removed) {
+            // We need to clone here as the component clone operation is just
+            // as shallow array clone
+            components[components.length - 1] = {count: last.count + 1, added: added, removed: removed };
+        }
+        else {
+            components.push({count: 1, added: added, removed: removed });
+        }
+    },
+    extractCommon: function (basePath, newArr, oldArr, diagonalPath) {
+        var newLen = newArr.length;
+        var oldLen = oldArr.length;
+        var newPos = basePath.newPos;
+        var oldPos = newPos - diagonalPath;
+        var commonCount = 0;
+
+        while (newPos + 1 < newLen && oldPos + 1 < oldLen && this.equals(newArr[newPos + 1], oldArr[oldPos + 1])) {
+            newPos++;
+            oldPos++;
+            commonCount++;
+        }
+
+        if (commonCount) {
+            basePath.components.push({count: commonCount});
+        }
+
+        basePath.newPos = newPos;
+        return oldPos;
+    },
+    tokenize: function (value) {
+        return value.slice();
+    },
+    join: function (value) {
+        return value.slice();
+    }
+};
+
+function buildValues(diff, components, newArr, oldArr) {
+    var componentPos = 0;
+    var componentLen = components.length;
+    var newPos = 0;
+    var oldPos = 0;
+
+    for (; componentPos < componentLen; componentPos++) {
+        var component = components[componentPos];
+        if (!component.removed) {
+            var indices = [];
+            for (var i = newPos; i < newPos + component.count; i++) {
+                indices.push(i);
+            }
+            component.indices = indices;
+            newPos += component.count;
+            // Common case
+            if (!component.added) {
+                oldPos += component.count;
+            }
+        }
+        else {
+            var indices = [];
+            for (var i = oldPos; i < oldPos + component.count; i++) {
+                indices.push(i);
+            }
+            component.indices = indices;
+            oldPos += component.count;
+        }
+    }
+
+    return components;
+}
+
+function clonePath(path) {
+    return { newPos: path.newPos, components: path.components.slice(0) };
+}
+
+var arrayDiff = new Diff();
+
+var arrayDiff$1 = function (oldArr, newArr, callback) {
+    return arrayDiff.diff(oldArr, newArr, callback);
+};
+
+/**
+ * @file Manages elements that can be defined in <defs> in SVG,
+ *       e.g., gradients, clip path, etc.
+ * @author Zhang Wenli
+ */
+
+var MARK_UNUSED = '0';
+var MARK_USED = '1';
+
+/**
+ * Manages elements that can be defined in <defs> in SVG,
+ * e.g., gradients, clip path, etc.
+ *
+ * @class
+ * @param {number}          zrId      zrender instance id
+ * @param {SVGElement}      svgRoot   root of SVG document
+ * @param {string|string[]} tagNames  possible tag names
+ * @param {string}          markLabel label name to make if the element
+ *                                    is used
+ */
+function Definable(
+    zrId,
+    svgRoot,
+    tagNames,
+    markLabel,
+    domName
+) {
+    this._zrId = zrId;
+    this._svgRoot = svgRoot;
+    this._tagNames = typeof tagNames === 'string' ? [tagNames] : tagNames;
+    this._markLabel = markLabel;
+    this._domName = domName || '_dom';
+
+    this.nextId = 0;
+}
+
+
+Definable.prototype.createElement = createElement;
+
+
+/**
+ * Get the <defs> tag for svgRoot; optionally creates one if not exists.
+ *
+ * @param {boolean} isForceCreating if need to create when not exists
+ * @return {SVGDefsElement} SVG <defs> element, null if it doesn't
+ * exist and isForceCreating is false
+ */
+Definable.prototype.getDefs = function (isForceCreating) {
+    var svgRoot = this._svgRoot;
+    var defs = this._svgRoot.getElementsByTagName('defs');
+    if (defs.length === 0) {
+        // Not exist
+        if (isForceCreating) {
+            defs = svgRoot.insertBefore(
+                this.createElement('defs'), // Create new tag
+                svgRoot.firstChild // Insert in the front of svg
+            );
+            if (!defs.contains) {
+                // IE doesn't support contains method
+                defs.contains = function (el) {
+                    var children = defs.children;
+                    if (!children) {
+                        return false;
+                    }
+                    for (var i = children.length - 1; i >= 0; --i) {
+                        if (children[i] === el) {
+                            return true;
+                        }
+                    }
+                    return false;
+                };
+            }
+            return defs;
+        }
+        else {
+            return null;
+        }
+    }
+    else {
+        return defs[0];
+    }
+};
+
+
+/**
+ * Update DOM element if necessary.
+ *
+ * @param {Object|string} element style element. e.g., for gradient,
+ *                                it may be '#ccc' or {type: 'linear', ...}
+ * @param {Function|undefined} onUpdate update callback
+ */
+Definable.prototype.update = function (element, onUpdate) {
+    if (!element) {
+        return;
+    }
+
+    var defs = this.getDefs(false);
+    if (element[this._domName] && defs.contains(element[this._domName])) {
+        // Update DOM
+        if (typeof onUpdate === 'function') {
+            onUpdate(element);
+        }
+    }
+    else {
+        // No previous dom, create new
+        var dom = this.add(element);
+        if (dom) {
+            element[this._domName] = dom;
+        }
+    }
+};
+
+
+/**
+ * Add gradient dom to defs
+ *
+ * @param {SVGElement} dom DOM to be added to <defs>
+ */
+Definable.prototype.addDom = function (dom) {
+    var defs = this.getDefs(true);
+    defs.appendChild(dom);
+};
+
+
+/**
+ * Remove DOM of a given element.
+ *
+ * @param {SVGElement} element element to remove dom
+ */
+Definable.prototype.removeDom = function (element) {
+    var defs = this.getDefs(false);
+    if (defs && element[this._domName]) {
+        defs.removeChild(element[this._domName]);
+        element[this._domName] = null;
+    }
+};
+
+
+/**
+ * Get DOMs of this element.
+ *
+ * @return {HTMLDomElement} doms of this defineable elements in <defs>
+ */
+Definable.prototype.getDoms = function () {
+    var defs = this.getDefs(false);
+    if (!defs) {
+        // No dom when defs is not defined
+        return [];
+    }
+
+    var doms = [];
+    each$1(this._tagNames, function (tagName) {
+        var tags = defs.getElementsByTagName(tagName);
+        // Note that tags is HTMLCollection, which is array-like
+        // rather than real array.
+        // So `doms.concat(tags)` add tags as one object.
+        doms = doms.concat([].slice.call(tags));
+    });
+
+    return doms;
+};
+
+
+/**
+ * Mark DOMs to be unused before painting, and clear unused ones at the end
+ * of the painting.
+ */
+Definable.prototype.markAllUnused = function () {
+    var doms = this.getDoms();
+    var that = this;
+    each$1(doms, function (dom) {
+        dom[that._markLabel] = MARK_UNUSED;
+    });
+};
+
+
+/**
+ * Mark a single DOM to be used.
+ *
+ * @param {SVGElement} dom DOM to mark
+ */
+Definable.prototype.markUsed = function (dom) {
+    if (dom) {
+        dom[this._markLabel] = MARK_USED;
+    }
+};
+
+
+/**
+ * Remove unused DOMs defined in <defs>
+ */
+Definable.prototype.removeUnused = function () {
+    var defs = this.getDefs(false);
+    if (!defs) {
+        // Nothing to remove
+        return;
+    }
+
+    var doms = this.getDoms();
+    var that = this;
+    each$1(doms, function (dom) {
+        if (dom[that._markLabel] !== MARK_USED) {
+            // Remove gradient
+            defs.removeChild(dom);
+        }
+    });
+};
+
+
+/**
+ * Get SVG proxy.
+ *
+ * @param {Displayable} displayable displayable element
+ * @return {Path|Image|Text} svg proxy of given element
+ */
+Definable.prototype.getSvgProxy = function (displayable) {
+    if (displayable instanceof Path) {
+        return svgPath;
+    }
+    else if (displayable instanceof ZImage) {
+        return svgImage;
+    }
+    else if (displayable instanceof Text) {
+        return svgText;
+    }
+    else {
+        return svgPath;
+    }
+};
+
+
+/**
+ * Get text SVG element.
+ *
+ * @param {Displayable} displayable displayable element
+ * @return {SVGElement} SVG element of text
+ */
+Definable.prototype.getTextSvgElement = function (displayable) {
+    return displayable.__textSvgEl;
+};
+
+
+/**
+ * Get SVG element.
+ *
+ * @param {Displayable} displayable displayable element
+ * @return {SVGElement} SVG element
+ */
+Definable.prototype.getSvgElement = function (displayable) {
+    return displayable.__svgEl;
+};
+
+/**
+ * @file Manages SVG gradient elements.
+ * @author Zhang Wenli
+ */
+
+/**
+ * Manages SVG gradient elements.
+ *
+ * @class
+ * @extends Definable
+ * @param   {number}     zrId    zrender instance id
+ * @param   {SVGElement} svgRoot root of SVG document
+ */
+function GradientManager(zrId, svgRoot) {
+    Definable.call(
+        this,
+        zrId,
+        svgRoot,
+        ['linearGradient', 'radialGradient'],
+        '__gradient_in_use__'
+    );
+}
+
+
+inherits(GradientManager, Definable);
+
+
+/**
+ * Create new gradient DOM for fill or stroke if not exist,
+ * but will not update gradient if exists.
+ *
+ * @param {SvgElement}  svgElement   SVG element to paint
+ * @param {Displayable} displayable  zrender displayable element
+ */
+GradientManager.prototype.addWithoutUpdate = function (
+    svgElement,
+    displayable
+) {
+    if (displayable && displayable.style) {
+        var that = this;
+        each$1(['fill', 'stroke'], function (fillOrStroke) {
+            if (displayable.style[fillOrStroke]
+                && (displayable.style[fillOrStroke].type === 'linear'
+                || displayable.style[fillOrStroke].type === 'radial')
+            ) {
+                var gradient = displayable.style[fillOrStroke];
+                var defs = that.getDefs(true);
+
+                // Create dom in <defs> if not exists
+                var dom;
+                if (gradient._dom) {
+                    // Gradient exists
+                    dom = gradient._dom;
+                    if (!defs.contains(gradient._dom)) {
+                        // _dom is no longer in defs, recreate
+                        that.addDom(dom);
+                    }
+                }
+                else {
+                    // New dom
+                    dom = that.add(gradient);
+                }
+
+                that.markUsed(displayable);
+
+                var id = dom.getAttribute('id');
+                svgElement.setAttribute(fillOrStroke, 'url(#' + id + ')');
+            }
+        });
+    }
+};
+
+
+/**
+ * Add a new gradient tag in <defs>
+ *
+ * @param   {Gradient} gradient zr gradient instance
+ * @return {SVGLinearGradientElement | SVGRadialGradientElement}
+ *                            created DOM
+ */
+GradientManager.prototype.add = function (gradient) {
+    var dom;
+    if (gradient.type === 'linear') {
+        dom = this.createElement('linearGradient');
+    }
+    else if (gradient.type === 'radial') {
+        dom = this.createElement('radialGradient');
+    }
+    else {
+        zrLog('Illegal gradient type.');
+        return null;
+    }
+
+    // Set dom id with gradient id, since each gradient instance
+    // will have no more than one dom element.
+    // id may exists before for those dirty elements, in which case
+    // id should remain the same, and other attributes should be
+    // updated.
+    gradient.id = gradient.id || this.nextId++;
+    dom.setAttribute('id', 'zr' + this._zrId
+        + '-gradient-' + gradient.id);
+
+    this.updateDom(gradient, dom);
+    this.addDom(dom);
+
+    return dom;
+};
+
+
+/**
+ * Update gradient.
+ *
+ * @param {Gradient} gradient zr gradient instance
+ */
+GradientManager.prototype.update = function (gradient) {
+    var that = this;
+    Definable.prototype.update.call(this, gradient, function () {
+        var type = gradient.type;
+        var tagName = gradient._dom.tagName;
+        if (type === 'linear' && tagName === 'linearGradient'
+            || type === 'radial' && tagName === 'radialGradient'
+        ) {
+            // Gradient type is not changed, update gradient
+            that.updateDom(gradient, gradient._dom);
+        }
+        else {
+            // Remove and re-create if type is changed
+            that.removeDom(gradient);
+            that.add(gradient);
+        }
+    });
+};
+
+
+/**
+ * Update gradient dom
+ *
+ * @param {Gradient} gradient zr gradient instance
+ * @param {SVGLinearGradientElement | SVGRadialGradientElement} dom
+ *                            DOM to update
+ */
+GradientManager.prototype.updateDom = function (gradient, dom) {
+    if (gradient.type === 'linear') {
+        dom.setAttribute('x1', gradient.x);
+        dom.setAttribute('y1', gradient.y);
+        dom.setAttribute('x2', gradient.x2);
+        dom.setAttribute('y2', gradient.y2);
+    }
+    else if (gradient.type === 'radial') {
+        dom.setAttribute('cx', gradient.x);
+        dom.setAttribute('cy', gradient.y);
+        dom.setAttribute('r', gradient.r);
+    }
+    else {
+        zrLog('Illegal gradient type.');
+        return;
+    }
+
+    if (gradient.global) {
+        // x1, x2, y1, y2 in range of 0 to canvas width or height
+        dom.setAttribute('gradientUnits', 'userSpaceOnUse');
+    }
+    else {
+        // x1, x2, y1, y2 in range of 0 to 1
+        dom.setAttribute('gradientUnits', 'objectBoundingBox');
+    }
+
+    // Remove color stops if exists
+    dom.innerHTML = '';
+
+    // Add color stops
+    var colors = gradient.colorStops;
+    for (var i = 0, len = colors.length; i < len; ++i) {
+        var stop = this.createElement('stop');
+        stop.setAttribute('offset', colors[i].offset * 100 + '%');
+        stop.setAttribute('stop-color', colors[i].color);
+        dom.appendChild(stop);
+    }
+
+    // Store dom element in gradient, to avoid creating multiple
+    // dom instances for the same gradient element
+    gradient._dom = dom;
+};
+
+/**
+ * Mark a single gradient to be used
+ *
+ * @param {Displayable} displayable displayable element
+ */
+GradientManager.prototype.markUsed = function (displayable) {
+    if (displayable.style) {
+        var gradient = displayable.style.fill;
+        if (gradient && gradient._dom) {
+            Definable.prototype.markUsed.call(this, gradient._dom);
+        }
+
+        gradient = displayable.style.stroke;
+        if (gradient && gradient._dom) {
+            Definable.prototype.markUsed.call(this, gradient._dom);
+        }
+    }
+};
+
+/**
+ * @file Manages SVG clipPath elements.
+ * @author Zhang Wenli
+ */
+
+/**
+ * Manages SVG clipPath elements.
+ *
+ * @class
+ * @extends Definable
+ * @param   {number}     zrId    zrender instance id
+ * @param   {SVGElement} svgRoot root of SVG document
+ */
+function ClippathManager(zrId, svgRoot) {
+    Definable.call(this, zrId, svgRoot, 'clipPath', '__clippath_in_use__');
+}
+
+
+inherits(ClippathManager, Definable);
+
+
+/**
+ * Update clipPath.
+ *
+ * @param {Displayable} displayable displayable element
+ */
+ClippathManager.prototype.update = function (displayable) {
+    var svgEl = this.getSvgElement(displayable);
+    if (svgEl) {
+        this.updateDom(svgEl, displayable.__clipPaths, false);
+    }
+
+    var textEl = this.getTextSvgElement(displayable);
+    if (textEl) {
+        // Make another clipPath for text, since it's transform
+        // matrix is not the same with svgElement
+        this.updateDom(textEl, displayable.__clipPaths, true);
+    }
+
+    this.markUsed(displayable);
+};
+
+
+/**
+ * Create an SVGElement of displayable and create a <clipPath> of its
+ * clipPath
+ *
+ * @param {Displayable} parentEl  parent element
+ * @param {ClipPath[]}  clipPaths clipPaths of parent element
+ * @param {boolean}     isText    if parent element is Text
+ */
+ClippathManager.prototype.updateDom = function (
+    parentEl,
+    clipPaths,
+    isText
+) {
+    if (clipPaths && clipPaths.length > 0) {
+        // Has clipPath, create <clipPath> with the first clipPath
+        var defs = this.getDefs(true);
+        var clipPath = clipPaths[0];
+        var clipPathEl;
+        var id;
+
+        var dom = isText ? '_textDom' : '_dom';
+
+        if (clipPath[dom]) {
+            // Use a dom that is already in <defs>
+            id = clipPath[dom].getAttribute('id');
+            clipPathEl = clipPath[dom];
+
+            // Use a dom that is already in <defs>
+            if (!defs.contains(clipPathEl)) {
+                // This happens when set old clipPath that has
+                // been previously removed
+                defs.appendChild(clipPathEl);
+            }
+        }
+        else {
+            // New <clipPath>
+            id = 'zr' + this._zrId + '-clip-' + this.nextId;
+            ++this.nextId;
+            clipPathEl = this.createElement('clipPath');
+            clipPathEl.setAttribute('id', id);
+            defs.appendChild(clipPathEl);
+
+            clipPath[dom] = clipPathEl;
+        }
+
+        // Build path and add to <clipPath>
+        var svgProxy = this.getSvgProxy(clipPath);
+        if (clipPath.transform
+            && clipPath.parent.invTransform
+            && !isText
+        ) {
+            /**
+             * If a clipPath has a parent with transform, the transform
+             * of parent should not be considered when setting transform
+             * of clipPath. So we need to transform back from parent's
+             * transform, which is done by multiplying parent's inverse
+             * transform.
+             */
+            // Store old transform
+            var transform = Array.prototype.slice.call(
+                clipPath.transform
+            );
+
+            // Transform back from parent, and brush path
+            mul$1(
+                clipPath.transform,
+                clipPath.parent.invTransform,
+                clipPath.transform
+            );
+            svgProxy.brush(clipPath);
+
+            // Set back transform of clipPath
+            clipPath.transform = transform;
+        }
+        else {
+            svgProxy.brush(clipPath);
+        }
+
+        var pathEl = this.getSvgElement(clipPath);
+
+        clipPathEl.innerHTML = '';
+        /**
+         * Use `cloneNode()` here to appendChild to multiple parents,
+         * which may happend when Text and other shapes are using the same
+         * clipPath. Since Text will create an extra clipPath DOM due to
+         * different transform rules.
+         */
+        clipPathEl.appendChild(pathEl.cloneNode());
+
+        parentEl.setAttribute('clip-path', 'url(#' + id + ')');
+
+        if (clipPaths.length > 1) {
+            // Make the other clipPaths recursively
+            this.updateDom(clipPathEl, clipPaths.slice(1), isText);
+        }
+    }
+    else {
+        // No clipPath
+        if (parentEl) {
+            parentEl.setAttribute('clip-path', 'none');
+        }
+    }
+};
+
+/**
+ * Mark a single clipPath to be used
+ *
+ * @param {Displayable} displayable displayable element
+ */
+ClippathManager.prototype.markUsed = function (displayable) {
+    var that = this;
+    if (displayable.__clipPaths && displayable.__clipPaths.length > 0) {
+        each$1(displayable.__clipPaths, function (clipPath) {
+            if (clipPath._dom) {
+                Definable.prototype.markUsed.call(that, clipPath._dom);
+            }
+            if (clipPath._textDom) {
+                Definable.prototype.markUsed.call(that, clipPath._textDom);
+            }
+        });
+    }
+};
+
+/**
+ * @file Manages SVG shadow elements.
+ * @author Zhang Wenli
+ */
+
+/**
+ * Manages SVG shadow elements.
+ *
+ * @class
+ * @extends Definable
+ * @param   {number}     zrId    zrender instance id
+ * @param   {SVGElement} svgRoot root of SVG document
+ */
+function ShadowManager(zrId, svgRoot) {
+    Definable.call(
+        this,
+        zrId,
+        svgRoot,
+        ['filter'],
+        '__filter_in_use__',
+        '_shadowDom'
+    );
+}
+
+
+inherits(ShadowManager, Definable);
+
+
+/**
+ * Create new shadow DOM for fill or stroke if not exist,
+ * but will not update shadow if exists.
+ *
+ * @param {SvgElement}  svgElement   SVG element to paint
+ * @param {Displayable} displayable  zrender displayable element
+ */
+ShadowManager.prototype.addWithoutUpdate = function (
+    svgElement,
+    displayable
+) {
+    if (displayable && hasShadow(displayable.style)) {
+        var style = displayable.style;
+
+        // Create dom in <defs> if not exists
+        var dom;
+        if (style._shadowDom) {
+            // Gradient exists
+            dom = style._shadowDom;
+
+            var defs = this.getDefs(true);
+            if (!defs.contains(style._shadowDom)) {
+                // _shadowDom is no longer in defs, recreate
+                this.addDom(dom);
+            }
+        }
+        else {
+            // New dom
+            dom = this.add(displayable);
+        }
+
+        this.markUsed(displayable);
+
+        var id = dom.getAttribute('id');
+        svgElement.style.filter = 'url(#' + id + ')';
+    }
+};
+
+
+/**
+ * Add a new shadow tag in <defs>
+ *
+ * @param {Displayable} displayable  zrender displayable element
+ * @return {SVGFilterElement} created DOM
+ */
+ShadowManager.prototype.add = function (displayable) {
+    var dom = this.createElement('filter');
+    var style = displayable.style;
+
+    // Set dom id with shadow id, since each shadow instance
+    // will have no more than one dom element.
+    // id may exists before for those dirty elements, in which case
+    // id should remain the same, and other attributes should be
+    // updated.
+    style._shadowDomId = style._shadowDomId || this.nextId++;
+    dom.setAttribute('id', 'zr' + this._zrId
+        + '-shadow-' + style._shadowDomId);
+
+    this.updateDom(displayable, dom);
+    this.addDom(dom);
+
+    return dom;
+};
+
+
+/**
+ * Update shadow.
+ *
+ * @param {Displayable} displayable  zrender displayable element
+ */
+ShadowManager.prototype.update = function (svgElement, displayable) {
+    var style = displayable.style;
+    if (hasShadow(style)) {
+        var that = this;
+        Definable.prototype.update.call(this, displayable, function (style) {
+            that.updateDom(displayable, style._shadowDom);
+        });
+    }
+    else {
+        // Remove shadow
+        this.remove(svgElement, style);
+    }
+};
+
+
+/**
+ * Remove DOM and clear parent filter
+ */
+ShadowManager.prototype.remove = function (svgElement, style) {
+    if (style._shadowDomId != null) {
+        this.removeDom(style);
+        svgElement.style.filter = '';
+    }
+};
+
+
+/**
+ * Update shadow dom
+ *
+ * @param {Displayable} displayable  zrender displayable element
+ * @param {SVGFilterElement} dom DOM to update
+ */
+ShadowManager.prototype.updateDom = function (displayable, dom) {
+    var domChild = dom.getElementsByTagName('feDropShadow');
+    if (domChild.length === 0) {
+        domChild = this.createElement('feDropShadow');
+    }
+    else {
+        domChild = domChild[0];
+    }
+
+    var style = displayable.style;
+    var scaleX = displayable.scale ? (displayable.scale[0] || 1) : 1;
+    var scaleY = displayable.scale ? (displayable.scale[1] || 1) : 1;
+
+    // TODO: textBoxShadowBlur is not supported yet
+    var offsetX, offsetY, blur, color;
+    if (style.shadowBlur || style.shadowOffsetX || style.shadowOffsetY) {
+        offsetX = style.shadowOffsetX || 0;
+        offsetY = style.shadowOffsetY || 0;
+        blur = style.shadowBlur;
+        color = style.shadowColor;
+    }
+    else if (style.textShadowBlur) {
+        offsetX = style.textShadowOffsetX || 0;
+        offsetY = style.textShadowOffsetY || 0;
+        blur = style.textShadowBlur;
+        color = style.textShadowColor;
+    }
+    else {
+        // Remove shadow
+        this.removeDom(dom, style);
+        return;
+    }
+
+    domChild.setAttribute('dx', offsetX / scaleX);
+    domChild.setAttribute('dy', offsetY / scaleY);
+    domChild.setAttribute('flood-color', color);
+
+    // Divide by two here so that it looks the same as in canvas
+    // See: https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-shadowblur
+    var stdDx = blur / 2 / scaleX;
+    var stdDy = blur / 2 / scaleY;
+    var stdDeviation = stdDx + ' ' + stdDy;
+    domChild.setAttribute('stdDeviation', stdDeviation);
+
+    // Fix filter clipping problem
+    dom.setAttribute('x', '-100%');
+    dom.setAttribute('y', '-100%');
+    dom.setAttribute('width', Math.ceil(blur / 2 * 200) + '%');
+    dom.setAttribute('height', Math.ceil(blur / 2 * 200) + '%');
+
+    dom.appendChild(domChild);
+
+    // Store dom element in shadow, to avoid creating multiple
+    // dom instances for the same shadow element
+    style._shadowDom = dom;
+};
+
+/**
+ * Mark a single shadow to be used
+ *
+ * @param {Displayable} displayable displayable element
+ */
+ShadowManager.prototype.markUsed = function (displayable) {
+    var style = displayable.style;
+    if (style && style._shadowDom) {
+        Definable.prototype.markUsed.call(this, style._shadowDom);
+    }
+};
+
+function hasShadow(style) {
+    // TODO: textBoxShadowBlur is not supported yet
+    return style
+        && (style.shadowBlur || style.shadowOffsetX || style.shadowOffsetY
+            || style.textShadowBlur || style.textShadowOffsetX
+            || style.textShadowOffsetY);
+}
+
+/**
+ * SVG Painter
+ * @module zrender/svg/Painter
+ */
+
+function parseInt10$2(val) {
+    return parseInt(val, 10);
+}
+
+function getSvgProxy(el) {
+    if (el instanceof Path) {
+        return svgPath;
+    }
+    else if (el instanceof ZImage) {
+        return svgImage;
+    }
+    else if (el instanceof Text) {
+        return svgText;
+    }
+    else {
+        return svgPath;
+    }
+}
+
+function checkParentAvailable(parent, child) {
+    return child && parent && child.parentNode !== parent;
+}
+
+function insertAfter(parent, child, prevSibling) {
+    if (checkParentAvailable(parent, child) && prevSibling) {
+        var nextSibling = prevSibling.nextSibling;
+        nextSibling ? parent.insertBefore(child, nextSibling)
+            : parent.appendChild(child);
+    }
+}
+
+function prepend(parent, child) {
+    if (checkParentAvailable(parent, child)) {
+        var firstChild = parent.firstChild;
+        firstChild ? parent.insertBefore(child, firstChild)
+            : parent.appendChild(child);
+    }
+}
+
+function remove$1(parent, child) {
+    if (child && parent && child.parentNode === parent) {
+        parent.removeChild(child);
+    }
+}
+
+function getTextSvgElement(displayable) {
+    return displayable.__textSvgEl;
+}
+
+function getSvgElement(displayable) {
+    return displayable.__svgEl;
+}
+
+/**
+ * @alias module:zrender/svg/Painter
+ * @constructor
+ * @param {HTMLElement} root 绘图容器
+ * @param {module:zrender/Storage} storage
+ * @param {Object} opts
+ */
+var SVGPainter = function (root, storage, opts, zrId) {
+
+    this.root = root;
+    this.storage = storage;
+    this._opts = opts = extend({}, opts || {});
+
+    var svgRoot = createElement('svg');
+    svgRoot.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+    svgRoot.setAttribute('version', '1.1');
+    svgRoot.setAttribute('baseProfile', 'full');
+    svgRoot.style.cssText = 'user-select:none;position:absolute;left:0;top:0;';
+
+    this.gradientManager = new GradientManager(zrId, svgRoot);
+    this.clipPathManager = new ClippathManager(zrId, svgRoot);
+    this.shadowManager = new ShadowManager(zrId, svgRoot);
+
+    var viewport = document.createElement('div');
+    viewport.style.cssText = 'overflow:hidden;position:relative';
+
+    this._svgRoot = svgRoot;
+    this._viewport = viewport;
+
+    root.appendChild(viewport);
+    viewport.appendChild(svgRoot);
+
+    this.resize(opts.width, opts.height);
+
+    this._visibleList = [];
+};
+
+SVGPainter.prototype = {
+
+    constructor: SVGPainter,
+
+    getType: function () {
+        return 'svg';
+    },
+
+    getViewportRoot: function () {
+        return this._viewport;
+    },
+
+    getViewportRootOffset: function () {
+        var viewportRoot = this.getViewportRoot();
+        if (viewportRoot) {
+            return {
+                offsetLeft: viewportRoot.offsetLeft || 0,
+                offsetTop: viewportRoot.offsetTop || 0
+            };
+        }
+    },
+
+    refresh: function () {
+
+        var list = this.storage.getDisplayList(true);
+
+        this._paintList(list);
+    },
+
+    setBackgroundColor: function (backgroundColor) {
+        // TODO gradient
+        this._viewport.style.background = backgroundColor;
+    },
+
+    _paintList: function (list) {
+        this.gradientManager.markAllUnused();
+        this.clipPathManager.markAllUnused();
+        this.shadowManager.markAllUnused();
+
+        var svgRoot = this._svgRoot;
+        var visibleList = this._visibleList;
+        var listLen = list.length;
+
+        var newVisibleList = [];
+        var i;
+        for (i = 0; i < listLen; i++) {
+            var displayable = list[i];
+            var svgProxy = getSvgProxy(displayable);
+            var svgElement = getSvgElement(displayable)
+                || getTextSvgElement(displayable);
+            if (!displayable.invisible) {
+                if (displayable.__dirty) {
+                    svgProxy && svgProxy.brush(displayable);
+
+                    // Update clipPath
+                    this.clipPathManager.update(displayable);
+
+                    // Update gradient and shadow
+                    if (displayable.style) {
+                        this.gradientManager
+                            .update(displayable.style.fill);
+                        this.gradientManager
+                            .update(displayable.style.stroke);
+
+                        this.shadowManager
+                            .update(svgElement, displayable);
+                    }
+
+                    displayable.__dirty = false;
+                }
+                newVisibleList.push(displayable);
+            }
+        }
+
+        var diff = arrayDiff$1(visibleList, newVisibleList);
+        var prevSvgElement;
+
+        // First do remove, in case element moved to the head and do remove
+        // after add
+        for (i = 0; i < diff.length; i++) {
+            var item = diff[i];
+            if (item.removed) {
+                for (var k = 0; k < item.count; k++) {
+                    var displayable = visibleList[item.indices[k]];
+                    var svgElement = getSvgElement(displayable);
+                    var textSvgElement = getTextSvgElement(displayable);
+                    remove$1(svgRoot, svgElement);
+                    remove$1(svgRoot, textSvgElement);
+                }
+            }
+        }
+        for (i = 0; i < diff.length; i++) {
+            var item = diff[i];
+            if (item.added) {
+                for (var k = 0; k < item.count; k++) {
+                    var displayable = newVisibleList[item.indices[k]];
+                    var svgElement = getSvgElement(displayable);
+                    var textSvgElement = getTextSvgElement(displayable);
+                    prevSvgElement
+                        ? insertAfter(svgRoot, svgElement, prevSvgElement)
+                        : prepend(svgRoot, svgElement);
+                    if (svgElement) {
+                        insertAfter(svgRoot, textSvgElement, svgElement);
+                    }
+                    else if (prevSvgElement) {
+                        insertAfter(
+                            svgRoot, textSvgElement, prevSvgElement
+                        );
+                    }
+                    else {
+                        prepend(svgRoot, textSvgElement);
+                    }
+                    // Insert text
+                    insertAfter(svgRoot, textSvgElement, svgElement);
+                    prevSvgElement = textSvgElement || svgElement
+                        || prevSvgElement;
+
+                    this.gradientManager
+                        .addWithoutUpdate(svgElement, displayable);
+                    this.shadowManager
+                        .addWithoutUpdate(prevSvgElement, displayable);
+                    this.clipPathManager.markUsed(displayable);
+                }
+            }
+            else if (!item.removed) {
+                for (var k = 0; k < item.count; k++) {
+                    var displayable = newVisibleList[item.indices[k]];
+                    prevSvgElement
+                        = svgElement
+                        = getTextSvgElement(displayable)
+                        || getSvgElement(displayable)
+                        || prevSvgElement;
+
+                    this.gradientManager.markUsed(displayable);
+                    this.gradientManager
+                        .addWithoutUpdate(svgElement, displayable);
+
+                    this.shadowManager.markUsed(displayable);
+                    this.shadowManager
+                        .addWithoutUpdate(svgElement, displayable);
+
+                    this.clipPathManager.markUsed(displayable);
+                }
+            }
+        }
+
+        this.gradientManager.removeUnused();
+        this.clipPathManager.removeUnused();
+        this.shadowManager.removeUnused();
+
+        this._visibleList = newVisibleList;
+    },
+
+    _getDefs: function (isForceCreating) {
+        var svgRoot = this._svgRoot;
+        var defs = this._svgRoot.getElementsByTagName('defs');
+        if (defs.length === 0) {
+            // Not exist
+            if (isForceCreating) {
+                var defs = svgRoot.insertBefore(
+                    createElement('defs'), // Create new tag
+                    svgRoot.firstChild // Insert in the front of svg
+                );
+                if (!defs.contains) {
+                    // IE doesn't support contains method
+                    defs.contains = function (el) {
+                        var children = defs.children;
+                        if (!children) {
+                            return false;
+                        }
+                        for (var i = children.length - 1; i >= 0; --i) {
+                            if (children[i] === el) {
+                                return true;
+                            }
+                        }
+                        return false;
+                    };
+                }
+                return defs;
+            }
+            else {
+                return null;
+            }
+        }
+        else {
+            return defs[0];
+        }
+    },
+
+    resize: function (width, height) {
+        var viewport = this._viewport;
+        // FIXME Why ?
+        viewport.style.display = 'none';
+
+        // Save input w/h
+        var opts = this._opts;
+        width != null && (opts.width = width);
+        height != null && (opts.height = height);
+
+        width = this._getSize(0);
+        height = this._getSize(1);
+
+        viewport.style.display = '';
+
+        if (this._width !== width || this._height !== height) {
+            this._width = width;
+            this._height = height;
+
+            var viewportStyle = viewport.style;
+            viewportStyle.width = width + 'px';
+            viewportStyle.height = height + 'px';
+
+            var svgRoot = this._svgRoot;
+            // Set width by 'svgRoot.width = width' is invalid
+            svgRoot.setAttribute('width', width);
+            svgRoot.setAttribute('height', height);
+        }
+    },
+
+    /**
+     * 获取绘图区域宽度
+     */
+    getWidth: function () {
+        return this._width;
+    },
+
+    /**
+     * 获取绘图区域高度
+     */
+    getHeight: function () {
+        return this._height;
+    },
+
+    _getSize: function (whIdx) {
+        var opts = this._opts;
+        var wh = ['width', 'height'][whIdx];
+        var cwh = ['clientWidth', 'clientHeight'][whIdx];
+        var plt = ['paddingLeft', 'paddingTop'][whIdx];
+        var prb = ['paddingRight', 'paddingBottom'][whIdx];
+
+        if (opts[wh] != null && opts[wh] !== 'auto') {
+            return parseFloat(opts[wh]);
+        }
+
+        var root = this.root;
+        // IE8 does not support getComputedStyle, but it use VML.
+        var stl = document.defaultView.getComputedStyle(root);
+
+        return (
+            (root[cwh] || parseInt10$2(stl[wh]) || parseInt10$2(root.style[wh]))
+            - (parseInt10$2(stl[plt]) || 0)
+            - (parseInt10$2(stl[prb]) || 0)
+        ) | 0;
+    },
+
+    dispose: function () {
+        this.root.innerHTML = '';
+
+        this._svgRoot
+            = this._viewport
+            = this.storage
+            = null;
+    },
+
+    clear: function () {
+        if (this._viewport) {
+            this.root.removeChild(this._viewport);
+        }
+    },
+
+    pathToDataUrl: function () {
+        this.refresh();
+        var html = this._svgRoot.outerHTML;
+        return 'data:image/svg+xml;charset=UTF-8,' + html;
+    }
+};
+
+// Not supported methods
+function createMethodNotSupport$1(method) {
+    return function () {
+        zrLog('In SVG mode painter not support method "' + method + '"');
+    };
+}
+
+// Unsuppoted methods
+each$1([
+    'getLayer', 'insertLayer', 'eachLayer', 'eachBuiltinLayer',
+    'eachOtherLayer', 'getLayers', 'modLayer', 'delLayer', 'clearLayer',
+    'toDataURL', 'pathToImage'
+], function (name) {
+    SVGPainter.prototype[name] = createMethodNotSupport$1(name);
+});
+
+registerPainter('svg', SVGPainter);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Import all charts and components
+
+exports.version = version;
+exports.dependencies = dependencies;
+exports.PRIORITY = PRIORITY;
+exports.init = init;
+exports.connect = connect;
+exports.disConnect = disConnect;
+exports.disconnect = disconnect;
+exports.dispose = dispose;
+exports.getInstanceByDom = getInstanceByDom;
+exports.getInstanceById = getInstanceById;
+exports.registerTheme = registerTheme;
+exports.registerPreprocessor = registerPreprocessor;
+exports.registerProcessor = registerProcessor;
+exports.registerPostUpdate = registerPostUpdate;
+exports.registerAction = registerAction;
+exports.registerCoordinateSystem = registerCoordinateSystem;
+exports.getCoordinateSystemDimensions = getCoordinateSystemDimensions;
+exports.registerLayout = registerLayout;
+exports.registerVisual = registerVisual;
+exports.registerLoading = registerLoading;
+exports.extendComponentModel = extendComponentModel;
+exports.extendComponentView = extendComponentView;
+exports.extendSeriesModel = extendSeriesModel;
+exports.extendChartView = extendChartView;
+exports.setCanvasCreator = setCanvasCreator;
+exports.registerMap = registerMap;
+exports.getMap = getMap;
+exports.dataTool = dataTool;
+exports.zrender = zrender;
+exports.graphic = graphic;
+exports.number = number;
+exports.format = format;
+exports.throttle = throttle;
+exports.helper = helper;
+exports.matrix = matrix;
+exports.vector = vector;
+exports.color = color;
+exports.parseGeoJSON = parseGeoJson$1;
+exports.parseGeoJson = parseGeoJson;
+exports.util = ecUtil;
+exports.List = List;
+exports.Model = Model;
+exports.Axis = Axis;
+exports.env = env$1;
+
+})));
+//# sourceMappingURL=echarts.js.map
+;
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+
+// This is CodeMirror (https://codemirror.net), a code editor
+// implemented in JavaScript on top of the browser's DOM.
+//
+// You can find some technical background for some of the code below
+// at http://marijnhaverbeke.nl/blog/#cm-internals .
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+  typeof define === 'function' && define.amd ? define(factory) :
+  (global.CodeMirror = factory());
+}(this, (function () { 'use strict';
+
+  // Kludges for bugs and behavior differences that can't be feature
+  // detected are enabled based on userAgent etc sniffing.
+  var userAgent = navigator.userAgent;
+  var platform = navigator.platform;
+
+  var gecko = /gecko\/\d/i.test(userAgent);
+  var ie_upto10 = /MSIE \d/.test(userAgent);
+  var ie_11up = /Trident\/(?:[7-9]|\d{2,})\..*rv:(\d+)/.exec(userAgent);
+  var edge = /Edge\/(\d+)/.exec(userAgent);
+  var ie = ie_upto10 || ie_11up || edge;
+  var ie_version = ie && (ie_upto10 ? document.documentMode || 6 : +(edge || ie_11up)[1]);
+  var webkit = !edge && /WebKit\//.test(userAgent);
+  var qtwebkit = webkit && /Qt\/\d+\.\d+/.test(userAgent);
+  var chrome = !edge && /Chrome\//.test(userAgent);
+  var presto = /Opera\//.test(userAgent);
+  var safari = /Apple Computer/.test(navigator.vendor);
+  var mac_geMountainLion = /Mac OS X 1\d\D([8-9]|\d\d)\D/.test(userAgent);
+  var phantom = /PhantomJS/.test(userAgent);
+
+  var ios = !edge && /AppleWebKit/.test(userAgent) && /Mobile\/\w+/.test(userAgent);
+  var android = /Android/.test(userAgent);
+  // This is woefully incomplete. Suggestions for alternative methods welcome.
+  var mobile = ios || android || /webOS|BlackBerry|Opera Mini|Opera Mobi|IEMobile/i.test(userAgent);
+  var mac = ios || /Mac/.test(platform);
+  var chromeOS = /\bCrOS\b/.test(userAgent);
+  var windows = /win/i.test(platform);
+
+  var presto_version = presto && userAgent.match(/Version\/(\d*\.\d*)/);
+  if (presto_version) { presto_version = Number(presto_version[1]); }
+  if (presto_version && presto_version >= 15) { presto = false; webkit = true; }
+  // Some browsers use the wrong event properties to signal cmd/ctrl on OS X
+  var flipCtrlCmd = mac && (qtwebkit || presto && (presto_version == null || presto_version < 12.11));
+  var captureRightClick = gecko || (ie && ie_version >= 9);
+
+  function classTest(cls) { return new RegExp("(^|\\s)" + cls + "(?:$|\\s)\\s*") }
+
+  var rmClass = function(node, cls) {
+    var current = node.className;
+    var match = classTest(cls).exec(current);
+    if (match) {
+      var after = current.slice(match.index + match[0].length);
+      node.className = current.slice(0, match.index) + (after ? match[1] + after : "");
+    }
+  };
+
+  function removeChildren(e) {
+    for (var count = e.childNodes.length; count > 0; --count)
+      { e.removeChild(e.firstChild); }
+    return e
+  }
+
+  function removeChildrenAndAdd(parent, e) {
+    return removeChildren(parent).appendChild(e)
+  }
+
+  function elt(tag, content, className, style) {
+    var e = document.createElement(tag);
+    if (className) { e.className = className; }
+    if (style) { e.style.cssText = style; }
+    if (typeof content == "string") { e.appendChild(document.createTextNode(content)); }
+    else if (content) { for (var i = 0; i < content.length; ++i) { e.appendChild(content[i]); } }
+    return e
+  }
+  // wrapper for elt, which removes the elt from the accessibility tree
+  function eltP(tag, content, className, style) {
+    var e = elt(tag, content, className, style);
+    e.setAttribute("role", "presentation");
+    return e
+  }
+
+  var range;
+  if (document.createRange) { range = function(node, start, end, endNode) {
+    var r = document.createRange();
+    r.setEnd(endNode || node, end);
+    r.setStart(node, start);
+    return r
+  }; }
+  else { range = function(node, start, end) {
+    var r = document.body.createTextRange();
+    try { r.moveToElementText(node.parentNode); }
+    catch(e) { return r }
+    r.collapse(true);
+    r.moveEnd("character", end);
+    r.moveStart("character", start);
+    return r
+  }; }
+
+  function contains(parent, child) {
+    if (child.nodeType == 3) // Android browser always returns false when child is a textnode
+      { child = child.parentNode; }
+    if (parent.contains)
+      { return parent.contains(child) }
+    do {
+      if (child.nodeType == 11) { child = child.host; }
+      if (child == parent) { return true }
+    } while (child = child.parentNode)
+  }
+
+  function activeElt() {
+    // IE and Edge may throw an "Unspecified Error" when accessing document.activeElement.
+    // IE < 10 will throw when accessed while the page is loading or in an iframe.
+    // IE > 9 and Edge will throw when accessed in an iframe if document.body is unavailable.
+    var activeElement;
+    try {
+      activeElement = document.activeElement;
+    } catch(e) {
+      activeElement = document.body || null;
+    }
+    while (activeElement && activeElement.shadowRoot && activeElement.shadowRoot.activeElement)
+      { activeElement = activeElement.shadowRoot.activeElement; }
+    return activeElement
+  }
+
+  function addClass(node, cls) {
+    var current = node.className;
+    if (!classTest(cls).test(current)) { node.className += (current ? " " : "") + cls; }
+  }
+  function joinClasses(a, b) {
+    var as = a.split(" ");
+    for (var i = 0; i < as.length; i++)
+      { if (as[i] && !classTest(as[i]).test(b)) { b += " " + as[i]; } }
+    return b
+  }
+
+  var selectInput = function(node) { node.select(); };
+  if (ios) // Mobile Safari apparently has a bug where select() is broken.
+    { selectInput = function(node) { node.selectionStart = 0; node.selectionEnd = node.value.length; }; }
+  else if (ie) // Suppress mysterious IE10 errors
+    { selectInput = function(node) { try { node.select(); } catch(_e) {} }; }
+
+  function bind(f) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return function(){return f.apply(null, args)}
+  }
+
+  function copyObj(obj, target, overwrite) {
+    if (!target) { target = {}; }
+    for (var prop in obj)
+      { if (obj.hasOwnProperty(prop) && (overwrite !== false || !target.hasOwnProperty(prop)))
+        { target[prop] = obj[prop]; } }
+    return target
+  }
+
+  // Counts the column offset in a string, taking tabs into account.
+  // Used mostly to find indentation.
+  function countColumn(string, end, tabSize, startIndex, startValue) {
+    if (end == null) {
+      end = string.search(/[^\s\u00a0]/);
+      if (end == -1) { end = string.length; }
+    }
+    for (var i = startIndex || 0, n = startValue || 0;;) {
+      var nextTab = string.indexOf("\t", i);
+      if (nextTab < 0 || nextTab >= end)
+        { return n + (end - i) }
+      n += nextTab - i;
+      n += tabSize - (n % tabSize);
+      i = nextTab + 1;
+    }
+  }
+
+  var Delayed = function() {this.id = null;};
+  Delayed.prototype.set = function (ms, f) {
+    clearTimeout(this.id);
+    this.id = setTimeout(f, ms);
+  };
+
+  function indexOf(array, elt) {
+    for (var i = 0; i < array.length; ++i)
+      { if (array[i] == elt) { return i } }
+    return -1
+  }
+
+  // Number of pixels added to scroller and sizer to hide scrollbar
+  var scrollerGap = 30;
+
+  // Returned or thrown by various protocols to signal 'I'm not
+  // handling this'.
+  var Pass = {toString: function(){return "CodeMirror.Pass"}};
+
+  // Reused option objects for setSelection & friends
+  var sel_dontScroll = {scroll: false}, sel_mouse = {origin: "*mouse"}, sel_move = {origin: "+move"};
+
+  // The inverse of countColumn -- find the offset that corresponds to
+  // a particular column.
+  function findColumn(string, goal, tabSize) {
+    for (var pos = 0, col = 0;;) {
+      var nextTab = string.indexOf("\t", pos);
+      if (nextTab == -1) { nextTab = string.length; }
+      var skipped = nextTab - pos;
+      if (nextTab == string.length || col + skipped >= goal)
+        { return pos + Math.min(skipped, goal - col) }
+      col += nextTab - pos;
+      col += tabSize - (col % tabSize);
+      pos = nextTab + 1;
+      if (col >= goal) { return pos }
+    }
+  }
+
+  var spaceStrs = [""];
+  function spaceStr(n) {
+    while (spaceStrs.length <= n)
+      { spaceStrs.push(lst(spaceStrs) + " "); }
+    return spaceStrs[n]
+  }
+
+  function lst(arr) { return arr[arr.length-1] }
+
+  function map(array, f) {
+    var out = [];
+    for (var i = 0; i < array.length; i++) { out[i] = f(array[i], i); }
+    return out
+  }
+
+  function insertSorted(array, value, score) {
+    var pos = 0, priority = score(value);
+    while (pos < array.length && score(array[pos]) <= priority) { pos++; }
+    array.splice(pos, 0, value);
+  }
+
+  function nothing() {}
+
+  function createObj(base, props) {
+    var inst;
+    if (Object.create) {
+      inst = Object.create(base);
+    } else {
+      nothing.prototype = base;
+      inst = new nothing();
+    }
+    if (props) { copyObj(props, inst); }
+    return inst
+  }
+
+  var nonASCIISingleCaseWordChar = /[\u00df\u0587\u0590-\u05f4\u0600-\u06ff\u3040-\u309f\u30a0-\u30ff\u3400-\u4db5\u4e00-\u9fcc\uac00-\ud7af]/;
+  function isWordCharBasic(ch) {
+    return /\w/.test(ch) || ch > "\x80" &&
+      (ch.toUpperCase() != ch.toLowerCase() || nonASCIISingleCaseWordChar.test(ch))
+  }
+  function isWordChar(ch, helper) {
+    if (!helper) { return isWordCharBasic(ch) }
+    if (helper.source.indexOf("\\w") > -1 && isWordCharBasic(ch)) { return true }
+    return helper.test(ch)
+  }
+
+  function isEmpty(obj) {
+    for (var n in obj) { if (obj.hasOwnProperty(n) && obj[n]) { return false } }
+    return true
+  }
+
+  // Extending unicode characters. A series of a non-extending char +
+  // any number of extending chars is treated as a single unit as far
+  // as editing and measuring is concerned. This is not fully correct,
+  // since some scripts/fonts/browsers also treat other configurations
+  // of code points as a group.
+  var extendingChars = /[\u0300-\u036f\u0483-\u0489\u0591-\u05bd\u05bf\u05c1\u05c2\u05c4\u05c5\u05c7\u0610-\u061a\u064b-\u065e\u0670\u06d6-\u06dc\u06de-\u06e4\u06e7\u06e8\u06ea-\u06ed\u0711\u0730-\u074a\u07a6-\u07b0\u07eb-\u07f3\u0816-\u0819\u081b-\u0823\u0825-\u0827\u0829-\u082d\u0900-\u0902\u093c\u0941-\u0948\u094d\u0951-\u0955\u0962\u0963\u0981\u09bc\u09be\u09c1-\u09c4\u09cd\u09d7\u09e2\u09e3\u0a01\u0a02\u0a3c\u0a41\u0a42\u0a47\u0a48\u0a4b-\u0a4d\u0a51\u0a70\u0a71\u0a75\u0a81\u0a82\u0abc\u0ac1-\u0ac5\u0ac7\u0ac8\u0acd\u0ae2\u0ae3\u0b01\u0b3c\u0b3e\u0b3f\u0b41-\u0b44\u0b4d\u0b56\u0b57\u0b62\u0b63\u0b82\u0bbe\u0bc0\u0bcd\u0bd7\u0c3e-\u0c40\u0c46-\u0c48\u0c4a-\u0c4d\u0c55\u0c56\u0c62\u0c63\u0cbc\u0cbf\u0cc2\u0cc6\u0ccc\u0ccd\u0cd5\u0cd6\u0ce2\u0ce3\u0d3e\u0d41-\u0d44\u0d4d\u0d57\u0d62\u0d63\u0dca\u0dcf\u0dd2-\u0dd4\u0dd6\u0ddf\u0e31\u0e34-\u0e3a\u0e47-\u0e4e\u0eb1\u0eb4-\u0eb9\u0ebb\u0ebc\u0ec8-\u0ecd\u0f18\u0f19\u0f35\u0f37\u0f39\u0f71-\u0f7e\u0f80-\u0f84\u0f86\u0f87\u0f90-\u0f97\u0f99-\u0fbc\u0fc6\u102d-\u1030\u1032-\u1037\u1039\u103a\u103d\u103e\u1058\u1059\u105e-\u1060\u1071-\u1074\u1082\u1085\u1086\u108d\u109d\u135f\u1712-\u1714\u1732-\u1734\u1752\u1753\u1772\u1773\u17b7-\u17bd\u17c6\u17c9-\u17d3\u17dd\u180b-\u180d\u18a9\u1920-\u1922\u1927\u1928\u1932\u1939-\u193b\u1a17\u1a18\u1a56\u1a58-\u1a5e\u1a60\u1a62\u1a65-\u1a6c\u1a73-\u1a7c\u1a7f\u1b00-\u1b03\u1b34\u1b36-\u1b3a\u1b3c\u1b42\u1b6b-\u1b73\u1b80\u1b81\u1ba2-\u1ba5\u1ba8\u1ba9\u1c2c-\u1c33\u1c36\u1c37\u1cd0-\u1cd2\u1cd4-\u1ce0\u1ce2-\u1ce8\u1ced\u1dc0-\u1de6\u1dfd-\u1dff\u200c\u200d\u20d0-\u20f0\u2cef-\u2cf1\u2de0-\u2dff\u302a-\u302f\u3099\u309a\ua66f-\ua672\ua67c\ua67d\ua6f0\ua6f1\ua802\ua806\ua80b\ua825\ua826\ua8c4\ua8e0-\ua8f1\ua926-\ua92d\ua947-\ua951\ua980-\ua982\ua9b3\ua9b6-\ua9b9\ua9bc\uaa29-\uaa2e\uaa31\uaa32\uaa35\uaa36\uaa43\uaa4c\uaab0\uaab2-\uaab4\uaab7\uaab8\uaabe\uaabf\uaac1\uabe5\uabe8\uabed\udc00-\udfff\ufb1e\ufe00-\ufe0f\ufe20-\ufe26\uff9e\uff9f]/;
+  function isExtendingChar(ch) { return ch.charCodeAt(0) >= 768 && extendingChars.test(ch) }
+
+  // Returns a number from the range [`0`; `str.length`] unless `pos` is outside that range.
+  function skipExtendingChars(str, pos, dir) {
+    while ((dir < 0 ? pos > 0 : pos < str.length) && isExtendingChar(str.charAt(pos))) { pos += dir; }
+    return pos
+  }
+
+  // Returns the value from the range [`from`; `to`] that satisfies
+  // `pred` and is closest to `from`. Assumes that at least `to`
+  // satisfies `pred`. Supports `from` being greater than `to`.
+  function findFirst(pred, from, to) {
+    // At any point we are certain `to` satisfies `pred`, don't know
+    // whether `from` does.
+    var dir = from > to ? -1 : 1;
+    for (;;) {
+      if (from == to) { return from }
+      var midF = (from + to) / 2, mid = dir < 0 ? Math.ceil(midF) : Math.floor(midF);
+      if (mid == from) { return pred(mid) ? from : to }
+      if (pred(mid)) { to = mid; }
+      else { from = mid + dir; }
+    }
+  }
+
+  // BIDI HELPERS
+
+  function iterateBidiSections(order, from, to, f) {
+    if (!order) { return f(from, to, "ltr", 0) }
+    var found = false;
+    for (var i = 0; i < order.length; ++i) {
+      var part = order[i];
+      if (part.from < to && part.to > from || from == to && part.to == from) {
+        f(Math.max(part.from, from), Math.min(part.to, to), part.level == 1 ? "rtl" : "ltr", i);
+        found = true;
+      }
+    }
+    if (!found) { f(from, to, "ltr"); }
+  }
+
+  var bidiOther = null;
+  function getBidiPartAt(order, ch, sticky) {
+    var found;
+    bidiOther = null;
+    for (var i = 0; i < order.length; ++i) {
+      var cur = order[i];
+      if (cur.from < ch && cur.to > ch) { return i }
+      if (cur.to == ch) {
+        if (cur.from != cur.to && sticky == "before") { found = i; }
+        else { bidiOther = i; }
+      }
+      if (cur.from == ch) {
+        if (cur.from != cur.to && sticky != "before") { found = i; }
+        else { bidiOther = i; }
+      }
+    }
+    return found != null ? found : bidiOther
+  }
+
+  // Bidirectional ordering algorithm
+  // See http://unicode.org/reports/tr9/tr9-13.html for the algorithm
+  // that this (partially) implements.
+
+  // One-char codes used for character types:
+  // L (L):   Left-to-Right
+  // R (R):   Right-to-Left
+  // r (AL):  Right-to-Left Arabic
+  // 1 (EN):  European Number
+  // + (ES):  European Number Separator
+  // % (ET):  European Number Terminator
+  // n (AN):  Arabic Number
+  // , (CS):  Common Number Separator
+  // m (NSM): Non-Spacing Mark
+  // b (BN):  Boundary Neutral
+  // s (B):   Paragraph Separator
+  // t (S):   Segment Separator
+  // w (WS):  Whitespace
+  // N (ON):  Other Neutrals
+
+  // Returns null if characters are ordered as they appear
+  // (left-to-right), or an array of sections ({from, to, level}
+  // objects) in the order in which they occur visually.
+  var bidiOrdering = (function() {
+    // Character types for codepoints 0 to 0xff
+    var lowTypes = "bbbbbbbbbtstwsbbbbbbbbbbbbbbssstwNN%%%NNNNNN,N,N1111111111NNNNNNNLLLLLLLLLLLLLLLLLLLLLLLLLLNNNNNNLLLLLLLLLLLLLLLLLLLLLLLLLLNNNNbbbbbbsbbbbbbbbbbbbbbbbbbbbbbbbbb,N%%%%NNNNLNNNNN%%11NLNNN1LNNNNNLLLLLLLLLLLLLLLLLLLLLLLNLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLN";
+    // Character types for codepoints 0x600 to 0x6f9
+    var arabicTypes = "nnnnnnNNr%%r,rNNmmmmmmmmmmmrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrmmmmmmmmmmmmmmmmmmmmmnnnnnnnnnn%nnrrrmrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrmmmmmmmnNmmmmmmrrmmNmmmmrr1111111111";
+    function charType(code) {
+      if (code <= 0xf7) { return lowTypes.charAt(code) }
+      else if (0x590 <= code && code <= 0x5f4) { return "R" }
+      else if (0x600 <= code && code <= 0x6f9) { return arabicTypes.charAt(code - 0x600) }
+      else if (0x6ee <= code && code <= 0x8ac) { return "r" }
+      else if (0x2000 <= code && code <= 0x200b) { return "w" }
+      else if (code == 0x200c) { return "b" }
+      else { return "L" }
+    }
+
+    var bidiRE = /[\u0590-\u05f4\u0600-\u06ff\u0700-\u08ac]/;
+    var isNeutral = /[stwN]/, isStrong = /[LRr]/, countsAsLeft = /[Lb1n]/, countsAsNum = /[1n]/;
+
+    function BidiSpan(level, from, to) {
+      this.level = level;
+      this.from = from; this.to = to;
+    }
+
+    return function(str, direction) {
+      var outerType = direction == "ltr" ? "L" : "R";
+
+      if (str.length == 0 || direction == "ltr" && !bidiRE.test(str)) { return false }
+      var len = str.length, types = [];
+      for (var i = 0; i < len; ++i)
+        { types.push(charType(str.charCodeAt(i))); }
+
+      // W1. Examine each non-spacing mark (NSM) in the level run, and
+      // change the type of the NSM to the type of the previous
+      // character. If the NSM is at the start of the level run, it will
+      // get the type of sor.
+      for (var i$1 = 0, prev = outerType; i$1 < len; ++i$1) {
+        var type = types[i$1];
+        if (type == "m") { types[i$1] = prev; }
+        else { prev = type; }
+      }
+
+      // W2. Search backwards from each instance of a European number
+      // until the first strong type (R, L, AL, or sor) is found. If an
+      // AL is found, change the type of the European number to Arabic
+      // number.
+      // W3. Change all ALs to R.
+      for (var i$2 = 0, cur = outerType; i$2 < len; ++i$2) {
+        var type$1 = types[i$2];
+        if (type$1 == "1" && cur == "r") { types[i$2] = "n"; }
+        else if (isStrong.test(type$1)) { cur = type$1; if (type$1 == "r") { types[i$2] = "R"; } }
+      }
+
+      // W4. A single European separator between two European numbers
+      // changes to a European number. A single common separator between
+      // two numbers of the same type changes to that type.
+      for (var i$3 = 1, prev$1 = types[0]; i$3 < len - 1; ++i$3) {
+        var type$2 = types[i$3];
+        if (type$2 == "+" && prev$1 == "1" && types[i$3+1] == "1") { types[i$3] = "1"; }
+        else if (type$2 == "," && prev$1 == types[i$3+1] &&
+                 (prev$1 == "1" || prev$1 == "n")) { types[i$3] = prev$1; }
+        prev$1 = type$2;
+      }
+
+      // W5. A sequence of European terminators adjacent to European
+      // numbers changes to all European numbers.
+      // W6. Otherwise, separators and terminators change to Other
+      // Neutral.
+      for (var i$4 = 0; i$4 < len; ++i$4) {
+        var type$3 = types[i$4];
+        if (type$3 == ",") { types[i$4] = "N"; }
+        else if (type$3 == "%") {
+          var end = (void 0);
+          for (end = i$4 + 1; end < len && types[end] == "%"; ++end) {}
+          var replace = (i$4 && types[i$4-1] == "!") || (end < len && types[end] == "1") ? "1" : "N";
+          for (var j = i$4; j < end; ++j) { types[j] = replace; }
+          i$4 = end - 1;
+        }
+      }
+
+      // W7. Search backwards from each instance of a European number
+      // until the first strong type (R, L, or sor) is found. If an L is
+      // found, then change the type of the European number to L.
+      for (var i$5 = 0, cur$1 = outerType; i$5 < len; ++i$5) {
+        var type$4 = types[i$5];
+        if (cur$1 == "L" && type$4 == "1") { types[i$5] = "L"; }
+        else if (isStrong.test(type$4)) { cur$1 = type$4; }
+      }
+
+      // N1. A sequence of neutrals takes the direction of the
+      // surrounding strong text if the text on both sides has the same
+      // direction. European and Arabic numbers act as if they were R in
+      // terms of their influence on neutrals. Start-of-level-run (sor)
+      // and end-of-level-run (eor) are used at level run boundaries.
+      // N2. Any remaining neutrals take the embedding direction.
+      for (var i$6 = 0; i$6 < len; ++i$6) {
+        if (isNeutral.test(types[i$6])) {
+          var end$1 = (void 0);
+          for (end$1 = i$6 + 1; end$1 < len && isNeutral.test(types[end$1]); ++end$1) {}
+          var before = (i$6 ? types[i$6-1] : outerType) == "L";
+          var after = (end$1 < len ? types[end$1] : outerType) == "L";
+          var replace$1 = before == after ? (before ? "L" : "R") : outerType;
+          for (var j$1 = i$6; j$1 < end$1; ++j$1) { types[j$1] = replace$1; }
+          i$6 = end$1 - 1;
+        }
+      }
+
+      // Here we depart from the documented algorithm, in order to avoid
+      // building up an actual levels array. Since there are only three
+      // levels (0, 1, 2) in an implementation that doesn't take
+      // explicit embedding into account, we can build up the order on
+      // the fly, without following the level-based algorithm.
+      var order = [], m;
+      for (var i$7 = 0; i$7 < len;) {
+        if (countsAsLeft.test(types[i$7])) {
+          var start = i$7;
+          for (++i$7; i$7 < len && countsAsLeft.test(types[i$7]); ++i$7) {}
+          order.push(new BidiSpan(0, start, i$7));
+        } else {
+          var pos = i$7, at = order.length;
+          for (++i$7; i$7 < len && types[i$7] != "L"; ++i$7) {}
+          for (var j$2 = pos; j$2 < i$7;) {
+            if (countsAsNum.test(types[j$2])) {
+              if (pos < j$2) { order.splice(at, 0, new BidiSpan(1, pos, j$2)); }
+              var nstart = j$2;
+              for (++j$2; j$2 < i$7 && countsAsNum.test(types[j$2]); ++j$2) {}
+              order.splice(at, 0, new BidiSpan(2, nstart, j$2));
+              pos = j$2;
+            } else { ++j$2; }
+          }
+          if (pos < i$7) { order.splice(at, 0, new BidiSpan(1, pos, i$7)); }
+        }
+      }
+      if (direction == "ltr") {
+        if (order[0].level == 1 && (m = str.match(/^\s+/))) {
+          order[0].from = m[0].length;
+          order.unshift(new BidiSpan(0, 0, m[0].length));
+        }
+        if (lst(order).level == 1 && (m = str.match(/\s+$/))) {
+          lst(order).to -= m[0].length;
+          order.push(new BidiSpan(0, len - m[0].length, len));
+        }
+      }
+
+      return direction == "rtl" ? order.reverse() : order
+    }
+  })();
+
+  // Get the bidi ordering for the given line (and cache it). Returns
+  // false for lines that are fully left-to-right, and an array of
+  // BidiSpan objects otherwise.
+  function getOrder(line, direction) {
+    var order = line.order;
+    if (order == null) { order = line.order = bidiOrdering(line.text, direction); }
+    return order
+  }
+
+  // EVENT HANDLING
+
+  // Lightweight event framework. on/off also work on DOM nodes,
+  // registering native DOM handlers.
+
+  var noHandlers = [];
+
+  var on = function(emitter, type, f) {
+    if (emitter.addEventListener) {
+      emitter.addEventListener(type, f, false);
+    } else if (emitter.attachEvent) {
+      emitter.attachEvent("on" + type, f);
+    } else {
+      var map$$1 = emitter._handlers || (emitter._handlers = {});
+      map$$1[type] = (map$$1[type] || noHandlers).concat(f);
+    }
+  };
+
+  function getHandlers(emitter, type) {
+    return emitter._handlers && emitter._handlers[type] || noHandlers
+  }
+
+  function off(emitter, type, f) {
+    if (emitter.removeEventListener) {
+      emitter.removeEventListener(type, f, false);
+    } else if (emitter.detachEvent) {
+      emitter.detachEvent("on" + type, f);
+    } else {
+      var map$$1 = emitter._handlers, arr = map$$1 && map$$1[type];
+      if (arr) {
+        var index = indexOf(arr, f);
+        if (index > -1)
+          { map$$1[type] = arr.slice(0, index).concat(arr.slice(index + 1)); }
+      }
+    }
+  }
+
+  function signal(emitter, type /*, values...*/) {
+    var handlers = getHandlers(emitter, type);
+    if (!handlers.length) { return }
+    var args = Array.prototype.slice.call(arguments, 2);
+    for (var i = 0; i < handlers.length; ++i) { handlers[i].apply(null, args); }
+  }
+
+  // The DOM events that CodeMirror handles can be overridden by
+  // registering a (non-DOM) handler on the editor for the event name,
+  // and preventDefault-ing the event in that handler.
+  function signalDOMEvent(cm, e, override) {
+    if (typeof e == "string")
+      { e = {type: e, preventDefault: function() { this.defaultPrevented = true; }}; }
+    signal(cm, override || e.type, cm, e);
+    return e_defaultPrevented(e) || e.codemirrorIgnore
+  }
+
+  function signalCursorActivity(cm) {
+    var arr = cm._handlers && cm._handlers.cursorActivity;
+    if (!arr) { return }
+    var set = cm.curOp.cursorActivityHandlers || (cm.curOp.cursorActivityHandlers = []);
+    for (var i = 0; i < arr.length; ++i) { if (indexOf(set, arr[i]) == -1)
+      { set.push(arr[i]); } }
+  }
+
+  function hasHandler(emitter, type) {
+    return getHandlers(emitter, type).length > 0
+  }
+
+  // Add on and off methods to a constructor's prototype, to make
+  // registering events on such objects more convenient.
+  function eventMixin(ctor) {
+    ctor.prototype.on = function(type, f) {on(this, type, f);};
+    ctor.prototype.off = function(type, f) {off(this, type, f);};
+  }
+
+  // Due to the fact that we still support jurassic IE versions, some
+  // compatibility wrappers are needed.
+
+  function e_preventDefault(e) {
+    if (e.preventDefault) { e.preventDefault(); }
+    else { e.returnValue = false; }
+  }
+  function e_stopPropagation(e) {
+    if (e.stopPropagation) { e.stopPropagation(); }
+    else { e.cancelBubble = true; }
+  }
+  function e_defaultPrevented(e) {
+    return e.defaultPrevented != null ? e.defaultPrevented : e.returnValue == false
+  }
+  function e_stop(e) {e_preventDefault(e); e_stopPropagation(e);}
+
+  function e_target(e) {return e.target || e.srcElement}
+  function e_button(e) {
+    var b = e.which;
+    if (b == null) {
+      if (e.button & 1) { b = 1; }
+      else if (e.button & 2) { b = 3; }
+      else if (e.button & 4) { b = 2; }
+    }
+    if (mac && e.ctrlKey && b == 1) { b = 3; }
+    return b
+  }
+
+  // Detect drag-and-drop
+  var dragAndDrop = function() {
+    // There is *some* kind of drag-and-drop support in IE6-8, but I
+    // couldn't get it to work yet.
+    if (ie && ie_version < 9) { return false }
+    var div = elt('div');
+    return "draggable" in div || "dragDrop" in div
+  }();
+
+  var zwspSupported;
+  function zeroWidthElement(measure) {
+    if (zwspSupported == null) {
+      var test = elt("span", "\u200b");
+      removeChildrenAndAdd(measure, elt("span", [test, document.createTextNode("x")]));
+      if (measure.firstChild.offsetHeight != 0)
+        { zwspSupported = test.offsetWidth <= 1 && test.offsetHeight > 2 && !(ie && ie_version < 8); }
+    }
+    var node = zwspSupported ? elt("span", "\u200b") :
+      elt("span", "\u00a0", null, "display: inline-block; width: 1px; margin-right: -1px");
+    node.setAttribute("cm-text", "");
+    return node
+  }
+
+  // Feature-detect IE's crummy client rect reporting for bidi text
+  var badBidiRects;
+  function hasBadBidiRects(measure) {
+    if (badBidiRects != null) { return badBidiRects }
+    var txt = removeChildrenAndAdd(measure, document.createTextNode("A\u062eA"));
+    var r0 = range(txt, 0, 1).getBoundingClientRect();
+    var r1 = range(txt, 1, 2).getBoundingClientRect();
+    removeChildren(measure);
+    if (!r0 || r0.left == r0.right) { return false } // Safari returns null in some cases (#2780)
+    return badBidiRects = (r1.right - r0.right < 3)
+  }
+
+  // See if "".split is the broken IE version, if so, provide an
+  // alternative way to split lines.
+  var splitLinesAuto = "\n\nb".split(/\n/).length != 3 ? function (string) {
+    var pos = 0, result = [], l = string.length;
+    while (pos <= l) {
+      var nl = string.indexOf("\n", pos);
+      if (nl == -1) { nl = string.length; }
+      var line = string.slice(pos, string.charAt(nl - 1) == "\r" ? nl - 1 : nl);
+      var rt = line.indexOf("\r");
+      if (rt != -1) {
+        result.push(line.slice(0, rt));
+        pos += rt + 1;
+      } else {
+        result.push(line);
+        pos = nl + 1;
+      }
+    }
+    return result
+  } : function (string) { return string.split(/\r\n?|\n/); };
+
+  var hasSelection = window.getSelection ? function (te) {
+    try { return te.selectionStart != te.selectionEnd }
+    catch(e) { return false }
+  } : function (te) {
+    var range$$1;
+    try {range$$1 = te.ownerDocument.selection.createRange();}
+    catch(e) {}
+    if (!range$$1 || range$$1.parentElement() != te) { return false }
+    return range$$1.compareEndPoints("StartToEnd", range$$1) != 0
+  };
+
+  var hasCopyEvent = (function () {
+    var e = elt("div");
+    if ("oncopy" in e) { return true }
+    e.setAttribute("oncopy", "return;");
+    return typeof e.oncopy == "function"
+  })();
+
+  var badZoomedRects = null;
+  function hasBadZoomedRects(measure) {
+    if (badZoomedRects != null) { return badZoomedRects }
+    var node = removeChildrenAndAdd(measure, elt("span", "x"));
+    var normal = node.getBoundingClientRect();
+    var fromRange = range(node, 0, 1).getBoundingClientRect();
+    return badZoomedRects = Math.abs(normal.left - fromRange.left) > 1
+  }
+
+  // Known modes, by name and by MIME
+  var modes = {}, mimeModes = {};
+
+  // Extra arguments are stored as the mode's dependencies, which is
+  // used by (legacy) mechanisms like loadmode.js to automatically
+  // load a mode. (Preferred mechanism is the require/define calls.)
+  function defineMode(name, mode) {
+    if (arguments.length > 2)
+      { mode.dependencies = Array.prototype.slice.call(arguments, 2); }
+    modes[name] = mode;
+  }
+
+  function defineMIME(mime, spec) {
+    mimeModes[mime] = spec;
+  }
+
+  // Given a MIME type, a {name, ...options} config object, or a name
+  // string, return a mode config object.
+  function resolveMode(spec) {
+    if (typeof spec == "string" && mimeModes.hasOwnProperty(spec)) {
+      spec = mimeModes[spec];
+    } else if (spec && typeof spec.name == "string" && mimeModes.hasOwnProperty(spec.name)) {
+      var found = mimeModes[spec.name];
+      if (typeof found == "string") { found = {name: found}; }
+      spec = createObj(found, spec);
+      spec.name = found.name;
+    } else if (typeof spec == "string" && /^[\w\-]+\/[\w\-]+\+xml$/.test(spec)) {
+      return resolveMode("application/xml")
+    } else if (typeof spec == "string" && /^[\w\-]+\/[\w\-]+\+json$/.test(spec)) {
+      return resolveMode("application/json")
+    }
+    if (typeof spec == "string") { return {name: spec} }
+    else { return spec || {name: "null"} }
+  }
+
+  // Given a mode spec (anything that resolveMode accepts), find and
+  // initialize an actual mode object.
+  function getMode(options, spec) {
+    spec = resolveMode(spec);
+    var mfactory = modes[spec.name];
+    if (!mfactory) { return getMode(options, "text/plain") }
+    var modeObj = mfactory(options, spec);
+    if (modeExtensions.hasOwnProperty(spec.name)) {
+      var exts = modeExtensions[spec.name];
+      for (var prop in exts) {
+        if (!exts.hasOwnProperty(prop)) { continue }
+        if (modeObj.hasOwnProperty(prop)) { modeObj["_" + prop] = modeObj[prop]; }
+        modeObj[prop] = exts[prop];
+      }
+    }
+    modeObj.name = spec.name;
+    if (spec.helperType) { modeObj.helperType = spec.helperType; }
+    if (spec.modeProps) { for (var prop$1 in spec.modeProps)
+      { modeObj[prop$1] = spec.modeProps[prop$1]; } }
+
+    return modeObj
+  }
+
+  // This can be used to attach properties to mode objects from
+  // outside the actual mode definition.
+  var modeExtensions = {};
+  function extendMode(mode, properties) {
+    var exts = modeExtensions.hasOwnProperty(mode) ? modeExtensions[mode] : (modeExtensions[mode] = {});
+    copyObj(properties, exts);
+  }
+
+  function copyState(mode, state) {
+    if (state === true) { return state }
+    if (mode.copyState) { return mode.copyState(state) }
+    var nstate = {};
+    for (var n in state) {
+      var val = state[n];
+      if (val instanceof Array) { val = val.concat([]); }
+      nstate[n] = val;
+    }
+    return nstate
+  }
+
+  // Given a mode and a state (for that mode), find the inner mode and
+  // state at the position that the state refers to.
+  function innerMode(mode, state) {
+    var info;
+    while (mode.innerMode) {
+      info = mode.innerMode(state);
+      if (!info || info.mode == mode) { break }
+      state = info.state;
+      mode = info.mode;
+    }
+    return info || {mode: mode, state: state}
+  }
+
+  function startState(mode, a1, a2) {
+    return mode.startState ? mode.startState(a1, a2) : true
+  }
+
+  // STRING STREAM
+
+  // Fed to the mode parsers, provides helper functions to make
+  // parsers more succinct.
+
+  var StringStream = function(string, tabSize, lineOracle) {
+    this.pos = this.start = 0;
+    this.string = string;
+    this.tabSize = tabSize || 8;
+    this.lastColumnPos = this.lastColumnValue = 0;
+    this.lineStart = 0;
+    this.lineOracle = lineOracle;
+  };
+
+  StringStream.prototype.eol = function () {return this.pos >= this.string.length};
+  StringStream.prototype.sol = function () {return this.pos == this.lineStart};
+  StringStream.prototype.peek = function () {return this.string.charAt(this.pos) || undefined};
+  StringStream.prototype.next = function () {
+    if (this.pos < this.string.length)
+      { return this.string.charAt(this.pos++) }
+  };
+  StringStream.prototype.eat = function (match) {
+    var ch = this.string.charAt(this.pos);
+    var ok;
+    if (typeof match == "string") { ok = ch == match; }
+    else { ok = ch && (match.test ? match.test(ch) : match(ch)); }
+    if (ok) {++this.pos; return ch}
+  };
+  StringStream.prototype.eatWhile = function (match) {
+    var start = this.pos;
+    while (this.eat(match)){}
+    return this.pos > start
+  };
+  StringStream.prototype.eatSpace = function () {
+      var this$1 = this;
+
+    var start = this.pos;
+    while (/[\s\u00a0]/.test(this.string.charAt(this.pos))) { ++this$1.pos; }
+    return this.pos > start
+  };
+  StringStream.prototype.skipToEnd = function () {this.pos = this.string.length;};
+  StringStream.prototype.skipTo = function (ch) {
+    var found = this.string.indexOf(ch, this.pos);
+    if (found > -1) {this.pos = found; return true}
+  };
+  StringStream.prototype.backUp = function (n) {this.pos -= n;};
+  StringStream.prototype.column = function () {
+    if (this.lastColumnPos < this.start) {
+      this.lastColumnValue = countColumn(this.string, this.start, this.tabSize, this.lastColumnPos, this.lastColumnValue);
+      this.lastColumnPos = this.start;
+    }
+    return this.lastColumnValue - (this.lineStart ? countColumn(this.string, this.lineStart, this.tabSize) : 0)
+  };
+  StringStream.prototype.indentation = function () {
+    return countColumn(this.string, null, this.tabSize) -
+      (this.lineStart ? countColumn(this.string, this.lineStart, this.tabSize) : 0)
+  };
+  StringStream.prototype.match = function (pattern, consume, caseInsensitive) {
+    if (typeof pattern == "string") {
+      var cased = function (str) { return caseInsensitive ? str.toLowerCase() : str; };
+      var substr = this.string.substr(this.pos, pattern.length);
+      if (cased(substr) == cased(pattern)) {
+        if (consume !== false) { this.pos += pattern.length; }
+        return true
+      }
+    } else {
+      var match = this.string.slice(this.pos).match(pattern);
+      if (match && match.index > 0) { return null }
+      if (match && consume !== false) { this.pos += match[0].length; }
+      return match
+    }
+  };
+  StringStream.prototype.current = function (){return this.string.slice(this.start, this.pos)};
+  StringStream.prototype.hideFirstChars = function (n, inner) {
+    this.lineStart += n;
+    try { return inner() }
+    finally { this.lineStart -= n; }
+  };
+  StringStream.prototype.lookAhead = function (n) {
+    var oracle = this.lineOracle;
+    return oracle && oracle.lookAhead(n)
+  };
+  StringStream.prototype.baseToken = function () {
+    var oracle = this.lineOracle;
+    return oracle && oracle.baseToken(this.pos)
+  };
+
+  // Find the line object corresponding to the given line number.
+  function getLine(doc, n) {
+    n -= doc.first;
+    if (n < 0 || n >= doc.size) { throw new Error("There is no line " + (n + doc.first) + " in the document.") }
+    var chunk = doc;
+    while (!chunk.lines) {
+      for (var i = 0;; ++i) {
+        var child = chunk.children[i], sz = child.chunkSize();
+        if (n < sz) { chunk = child; break }
+        n -= sz;
+      }
+    }
+    return chunk.lines[n]
+  }
+
+  // Get the part of a document between two positions, as an array of
+  // strings.
+  function getBetween(doc, start, end) {
+    var out = [], n = start.line;
+    doc.iter(start.line, end.line + 1, function (line) {
+      var text = line.text;
+      if (n == end.line) { text = text.slice(0, end.ch); }
+      if (n == start.line) { text = text.slice(start.ch); }
+      out.push(text);
+      ++n;
+    });
+    return out
+  }
+  // Get the lines between from and to, as array of strings.
+  function getLines(doc, from, to) {
+    var out = [];
+    doc.iter(from, to, function (line) { out.push(line.text); }); // iter aborts when callback returns truthy value
+    return out
+  }
+
+  // Update the height of a line, propagating the height change
+  // upwards to parent nodes.
+  function updateLineHeight(line, height) {
+    var diff = height - line.height;
+    if (diff) { for (var n = line; n; n = n.parent) { n.height += diff; } }
+  }
+
+  // Given a line object, find its line number by walking up through
+  // its parent links.
+  function lineNo(line) {
+    if (line.parent == null) { return null }
+    var cur = line.parent, no = indexOf(cur.lines, line);
+    for (var chunk = cur.parent; chunk; cur = chunk, chunk = chunk.parent) {
+      for (var i = 0;; ++i) {
+        if (chunk.children[i] == cur) { break }
+        no += chunk.children[i].chunkSize();
+      }
+    }
+    return no + cur.first
+  }
+
+  // Find the line at the given vertical position, using the height
+  // information in the document tree.
+  function lineAtHeight(chunk, h) {
+    var n = chunk.first;
+    outer: do {
+      for (var i$1 = 0; i$1 < chunk.children.length; ++i$1) {
+        var child = chunk.children[i$1], ch = child.height;
+        if (h < ch) { chunk = child; continue outer }
+        h -= ch;
+        n += child.chunkSize();
+      }
+      return n
+    } while (!chunk.lines)
+    var i = 0;
+    for (; i < chunk.lines.length; ++i) {
+      var line = chunk.lines[i], lh = line.height;
+      if (h < lh) { break }
+      h -= lh;
+    }
+    return n + i
+  }
+
+  function isLine(doc, l) {return l >= doc.first && l < doc.first + doc.size}
+
+  function lineNumberFor(options, i) {
+    return String(options.lineNumberFormatter(i + options.firstLineNumber))
+  }
+
+  // A Pos instance represents a position within the text.
+  function Pos(line, ch, sticky) {
+    if ( sticky === void 0 ) sticky = null;
+
+    if (!(this instanceof Pos)) { return new Pos(line, ch, sticky) }
+    this.line = line;
+    this.ch = ch;
+    this.sticky = sticky;
+  }
+
+  // Compare two positions, return 0 if they are the same, a negative
+  // number when a is less, and a positive number otherwise.
+  function cmp(a, b) { return a.line - b.line || a.ch - b.ch }
+
+  function equalCursorPos(a, b) { return a.sticky == b.sticky && cmp(a, b) == 0 }
+
+  function copyPos(x) {return Pos(x.line, x.ch)}
+  function maxPos(a, b) { return cmp(a, b) < 0 ? b : a }
+  function minPos(a, b) { return cmp(a, b) < 0 ? a : b }
+
+  // Most of the external API clips given positions to make sure they
+  // actually exist within the document.
+  function clipLine(doc, n) {return Math.max(doc.first, Math.min(n, doc.first + doc.size - 1))}
+  function clipPos(doc, pos) {
+    if (pos.line < doc.first) { return Pos(doc.first, 0) }
+    var last = doc.first + doc.size - 1;
+    if (pos.line > last) { return Pos(last, getLine(doc, last).text.length) }
+    return clipToLen(pos, getLine(doc, pos.line).text.length)
+  }
+  function clipToLen(pos, linelen) {
+    var ch = pos.ch;
+    if (ch == null || ch > linelen) { return Pos(pos.line, linelen) }
+    else if (ch < 0) { return Pos(pos.line, 0) }
+    else { return pos }
+  }
+  function clipPosArray(doc, array) {
+    var out = [];
+    for (var i = 0; i < array.length; i++) { out[i] = clipPos(doc, array[i]); }
+    return out
+  }
+
+  var SavedContext = function(state, lookAhead) {
+    this.state = state;
+    this.lookAhead = lookAhead;
+  };
+
+  var Context = function(doc, state, line, lookAhead) {
+    this.state = state;
+    this.doc = doc;
+    this.line = line;
+    this.maxLookAhead = lookAhead || 0;
+    this.baseTokens = null;
+    this.baseTokenPos = 1;
+  };
+
+  Context.prototype.lookAhead = function (n) {
+    var line = this.doc.getLine(this.line + n);
+    if (line != null && n > this.maxLookAhead) { this.maxLookAhead = n; }
+    return line
+  };
+
+  Context.prototype.baseToken = function (n) {
+      var this$1 = this;
+
+    if (!this.baseTokens) { return null }
+    while (this.baseTokens[this.baseTokenPos] <= n)
+      { this$1.baseTokenPos += 2; }
+    var type = this.baseTokens[this.baseTokenPos + 1];
+    return {type: type && type.replace(/( |^)overlay .*/, ""),
+            size: this.baseTokens[this.baseTokenPos] - n}
+  };
+
+  Context.prototype.nextLine = function () {
+    this.line++;
+    if (this.maxLookAhead > 0) { this.maxLookAhead--; }
+  };
+
+  Context.fromSaved = function (doc, saved, line) {
+    if (saved instanceof SavedContext)
+      { return new Context(doc, copyState(doc.mode, saved.state), line, saved.lookAhead) }
+    else
+      { return new Context(doc, copyState(doc.mode, saved), line) }
+  };
+
+  Context.prototype.save = function (copy) {
+    var state = copy !== false ? copyState(this.doc.mode, this.state) : this.state;
+    return this.maxLookAhead > 0 ? new SavedContext(state, this.maxLookAhead) : state
+  };
+
+
+  // Compute a style array (an array starting with a mode generation
+  // -- for invalidation -- followed by pairs of end positions and
+  // style strings), which is used to highlight the tokens on the
+  // line.
+  function highlightLine(cm, line, context, forceToEnd) {
+    // A styles array always starts with a number identifying the
+    // mode/overlays that it is based on (for easy invalidation).
+    var st = [cm.state.modeGen], lineClasses = {};
+    // Compute the base array of styles
+    runMode(cm, line.text, cm.doc.mode, context, function (end, style) { return st.push(end, style); },
+            lineClasses, forceToEnd);
+    var state = context.state;
+
+    // Run overlays, adjust style array.
+    var loop = function ( o ) {
+      context.baseTokens = st;
+      var overlay = cm.state.overlays[o], i = 1, at = 0;
+      context.state = true;
+      runMode(cm, line.text, overlay.mode, context, function (end, style) {
+        var start = i;
+        // Ensure there's a token end at the current position, and that i points at it
+        while (at < end) {
+          var i_end = st[i];
+          if (i_end > end)
+            { st.splice(i, 1, end, st[i+1], i_end); }
+          i += 2;
+          at = Math.min(end, i_end);
+        }
+        if (!style) { return }
+        if (overlay.opaque) {
+          st.splice(start, i - start, end, "overlay " + style);
+          i = start + 2;
+        } else {
+          for (; start < i; start += 2) {
+            var cur = st[start+1];
+            st[start+1] = (cur ? cur + " " : "") + "overlay " + style;
+          }
+        }
+      }, lineClasses);
+      context.state = state;
+      context.baseTokens = null;
+      context.baseTokenPos = 1;
+    };
+
+    for (var o = 0; o < cm.state.overlays.length; ++o) loop( o );
+
+    return {styles: st, classes: lineClasses.bgClass || lineClasses.textClass ? lineClasses : null}
+  }
+
+  function getLineStyles(cm, line, updateFrontier) {
+    if (!line.styles || line.styles[0] != cm.state.modeGen) {
+      var context = getContextBefore(cm, lineNo(line));
+      var resetState = line.text.length > cm.options.maxHighlightLength && copyState(cm.doc.mode, context.state);
+      var result = highlightLine(cm, line, context);
+      if (resetState) { context.state = resetState; }
+      line.stateAfter = context.save(!resetState);
+      line.styles = result.styles;
+      if (result.classes) { line.styleClasses = result.classes; }
+      else if (line.styleClasses) { line.styleClasses = null; }
+      if (updateFrontier === cm.doc.highlightFrontier)
+        { cm.doc.modeFrontier = Math.max(cm.doc.modeFrontier, ++cm.doc.highlightFrontier); }
+    }
+    return line.styles
+  }
+
+  function getContextBefore(cm, n, precise) {
+    var doc = cm.doc, display = cm.display;
+    if (!doc.mode.startState) { return new Context(doc, true, n) }
+    var start = findStartLine(cm, n, precise);
+    var saved = start > doc.first && getLine(doc, start - 1).stateAfter;
+    var context = saved ? Context.fromSaved(doc, saved, start) : new Context(doc, startState(doc.mode), start);
+
+    doc.iter(start, n, function (line) {
+      processLine(cm, line.text, context);
+      var pos = context.line;
+      line.stateAfter = pos == n - 1 || pos % 5 == 0 || pos >= display.viewFrom && pos < display.viewTo ? context.save() : null;
+      context.nextLine();
+    });
+    if (precise) { doc.modeFrontier = context.line; }
+    return context
+  }
+
+  // Lightweight form of highlight -- proceed over this line and
+  // update state, but don't save a style array. Used for lines that
+  // aren't currently visible.
+  function processLine(cm, text, context, startAt) {
+    var mode = cm.doc.mode;
+    var stream = new StringStream(text, cm.options.tabSize, context);
+    stream.start = stream.pos = startAt || 0;
+    if (text == "") { callBlankLine(mode, context.state); }
+    while (!stream.eol()) {
+      readToken(mode, stream, context.state);
+      stream.start = stream.pos;
+    }
+  }
+
+  function callBlankLine(mode, state) {
+    if (mode.blankLine) { return mode.blankLine(state) }
+    if (!mode.innerMode) { return }
+    var inner = innerMode(mode, state);
+    if (inner.mode.blankLine) { return inner.mode.blankLine(inner.state) }
+  }
+
+  function readToken(mode, stream, state, inner) {
+    for (var i = 0; i < 10; i++) {
+      if (inner) { inner[0] = innerMode(mode, state).mode; }
+      var style = mode.token(stream, state);
+      if (stream.pos > stream.start) { return style }
+    }
+    throw new Error("Mode " + mode.name + " failed to advance stream.")
+  }
+
+  var Token = function(stream, type, state) {
+    this.start = stream.start; this.end = stream.pos;
+    this.string = stream.current();
+    this.type = type || null;
+    this.state = state;
+  };
+
+  // Utility for getTokenAt and getLineTokens
+  function takeToken(cm, pos, precise, asArray) {
+    var doc = cm.doc, mode = doc.mode, style;
+    pos = clipPos(doc, pos);
+    var line = getLine(doc, pos.line), context = getContextBefore(cm, pos.line, precise);
+    var stream = new StringStream(line.text, cm.options.tabSize, context), tokens;
+    if (asArray) { tokens = []; }
+    while ((asArray || stream.pos < pos.ch) && !stream.eol()) {
+      stream.start = stream.pos;
+      style = readToken(mode, stream, context.state);
+      if (asArray) { tokens.push(new Token(stream, style, copyState(doc.mode, context.state))); }
+    }
+    return asArray ? tokens : new Token(stream, style, context.state)
+  }
+
+  function extractLineClasses(type, output) {
+    if (type) { for (;;) {
+      var lineClass = type.match(/(?:^|\s+)line-(background-)?(\S+)/);
+      if (!lineClass) { break }
+      type = type.slice(0, lineClass.index) + type.slice(lineClass.index + lineClass[0].length);
+      var prop = lineClass[1] ? "bgClass" : "textClass";
+      if (output[prop] == null)
+        { output[prop] = lineClass[2]; }
+      else if (!(new RegExp("(?:^|\s)" + lineClass[2] + "(?:$|\s)")).test(output[prop]))
+        { output[prop] += " " + lineClass[2]; }
+    } }
+    return type
+  }
+
+  // Run the given mode's parser over a line, calling f for each token.
+  function runMode(cm, text, mode, context, f, lineClasses, forceToEnd) {
+    var flattenSpans = mode.flattenSpans;
+    if (flattenSpans == null) { flattenSpans = cm.options.flattenSpans; }
+    var curStart = 0, curStyle = null;
+    var stream = new StringStream(text, cm.options.tabSize, context), style;
+    var inner = cm.options.addModeClass && [null];
+    if (text == "") { extractLineClasses(callBlankLine(mode, context.state), lineClasses); }
+    while (!stream.eol()) {
+      if (stream.pos > cm.options.maxHighlightLength) {
+        flattenSpans = false;
+        if (forceToEnd) { processLine(cm, text, context, stream.pos); }
+        stream.pos = text.length;
+        style = null;
+      } else {
+        style = extractLineClasses(readToken(mode, stream, context.state, inner), lineClasses);
+      }
+      if (inner) {
+        var mName = inner[0].name;
+        if (mName) { style = "m-" + (style ? mName + " " + style : mName); }
+      }
+      if (!flattenSpans || curStyle != style) {
+        while (curStart < stream.start) {
+          curStart = Math.min(stream.start, curStart + 5000);
+          f(curStart, curStyle);
+        }
+        curStyle = style;
+      }
+      stream.start = stream.pos;
+    }
+    while (curStart < stream.pos) {
+      // Webkit seems to refuse to render text nodes longer than 57444
+      // characters, and returns inaccurate measurements in nodes
+      // starting around 5000 chars.
+      var pos = Math.min(stream.pos, curStart + 5000);
+      f(pos, curStyle);
+      curStart = pos;
+    }
+  }
+
+  // Finds the line to start with when starting a parse. Tries to
+  // find a line with a stateAfter, so that it can start with a
+  // valid state. If that fails, it returns the line with the
+  // smallest indentation, which tends to need the least context to
+  // parse correctly.
+  function findStartLine(cm, n, precise) {
+    var minindent, minline, doc = cm.doc;
+    var lim = precise ? -1 : n - (cm.doc.mode.innerMode ? 1000 : 100);
+    for (var search = n; search > lim; --search) {
+      if (search <= doc.first) { return doc.first }
+      var line = getLine(doc, search - 1), after = line.stateAfter;
+      if (after && (!precise || search + (after instanceof SavedContext ? after.lookAhead : 0) <= doc.modeFrontier))
+        { return search }
+      var indented = countColumn(line.text, null, cm.options.tabSize);
+      if (minline == null || minindent > indented) {
+        minline = search - 1;
+        minindent = indented;
+      }
+    }
+    return minline
+  }
+
+  function retreatFrontier(doc, n) {
+    doc.modeFrontier = Math.min(doc.modeFrontier, n);
+    if (doc.highlightFrontier < n - 10) { return }
+    var start = doc.first;
+    for (var line = n - 1; line > start; line--) {
+      var saved = getLine(doc, line).stateAfter;
+      // change is on 3
+      // state on line 1 looked ahead 2 -- so saw 3
+      // test 1 + 2 < 3 should cover this
+      if (saved && (!(saved instanceof SavedContext) || line + saved.lookAhead < n)) {
+        start = line + 1;
+        break
+      }
+    }
+    doc.highlightFrontier = Math.min(doc.highlightFrontier, start);
+  }
+
+  // Optimize some code when these features are not used.
+  var sawReadOnlySpans = false, sawCollapsedSpans = false;
+
+  function seeReadOnlySpans() {
+    sawReadOnlySpans = true;
+  }
+
+  function seeCollapsedSpans() {
+    sawCollapsedSpans = true;
+  }
+
+  // TEXTMARKER SPANS
+
+  function MarkedSpan(marker, from, to) {
+    this.marker = marker;
+    this.from = from; this.to = to;
+  }
+
+  // Search an array of spans for a span matching the given marker.
+  function getMarkedSpanFor(spans, marker) {
+    if (spans) { for (var i = 0; i < spans.length; ++i) {
+      var span = spans[i];
+      if (span.marker == marker) { return span }
+    } }
+  }
+  // Remove a span from an array, returning undefined if no spans are
+  // left (we don't store arrays for lines without spans).
+  function removeMarkedSpan(spans, span) {
+    var r;
+    for (var i = 0; i < spans.length; ++i)
+      { if (spans[i] != span) { (r || (r = [])).push(spans[i]); } }
+    return r
+  }
+  // Add a span to a line.
+  function addMarkedSpan(line, span) {
+    line.markedSpans = line.markedSpans ? line.markedSpans.concat([span]) : [span];
+    span.marker.attachLine(line);
+  }
+
+  // Used for the algorithm that adjusts markers for a change in the
+  // document. These functions cut an array of spans at a given
+  // character position, returning an array of remaining chunks (or
+  // undefined if nothing remains).
+  function markedSpansBefore(old, startCh, isInsert) {
+    var nw;
+    if (old) { for (var i = 0; i < old.length; ++i) {
+      var span = old[i], marker = span.marker;
+      var startsBefore = span.from == null || (marker.inclusiveLeft ? span.from <= startCh : span.from < startCh);
+      if (startsBefore || span.from == startCh && marker.type == "bookmark" && (!isInsert || !span.marker.insertLeft)) {
+        var endsAfter = span.to == null || (marker.inclusiveRight ? span.to >= startCh : span.to > startCh)
+        ;(nw || (nw = [])).push(new MarkedSpan(marker, span.from, endsAfter ? null : span.to));
+      }
+    } }
+    return nw
+  }
+  function markedSpansAfter(old, endCh, isInsert) {
+    var nw;
+    if (old) { for (var i = 0; i < old.length; ++i) {
+      var span = old[i], marker = span.marker;
+      var endsAfter = span.to == null || (marker.inclusiveRight ? span.to >= endCh : span.to > endCh);
+      if (endsAfter || span.from == endCh && marker.type == "bookmark" && (!isInsert || span.marker.insertLeft)) {
+        var startsBefore = span.from == null || (marker.inclusiveLeft ? span.from <= endCh : span.from < endCh)
+        ;(nw || (nw = [])).push(new MarkedSpan(marker, startsBefore ? null : span.from - endCh,
+                                              span.to == null ? null : span.to - endCh));
+      }
+    } }
+    return nw
+  }
+
+  // Given a change object, compute the new set of marker spans that
+  // cover the line in which the change took place. Removes spans
+  // entirely within the change, reconnects spans belonging to the
+  // same marker that appear on both sides of the change, and cuts off
+  // spans partially within the change. Returns an array of span
+  // arrays with one element for each line in (after) the change.
+  function stretchSpansOverChange(doc, change) {
+    if (change.full) { return null }
+    var oldFirst = isLine(doc, change.from.line) && getLine(doc, change.from.line).markedSpans;
+    var oldLast = isLine(doc, change.to.line) && getLine(doc, change.to.line).markedSpans;
+    if (!oldFirst && !oldLast) { return null }
+
+    var startCh = change.from.ch, endCh = change.to.ch, isInsert = cmp(change.from, change.to) == 0;
+    // Get the spans that 'stick out' on both sides
+    var first = markedSpansBefore(oldFirst, startCh, isInsert);
+    var last = markedSpansAfter(oldLast, endCh, isInsert);
+
+    // Next, merge those two ends
+    var sameLine = change.text.length == 1, offset = lst(change.text).length + (sameLine ? startCh : 0);
+    if (first) {
+      // Fix up .to properties of first
+      for (var i = 0; i < first.length; ++i) {
+        var span = first[i];
+        if (span.to == null) {
+          var found = getMarkedSpanFor(last, span.marker);
+          if (!found) { span.to = startCh; }
+          else if (sameLine) { span.to = found.to == null ? null : found.to + offset; }
+        }
+      }
+    }
+    if (last) {
+      // Fix up .from in last (or move them into first in case of sameLine)
+      for (var i$1 = 0; i$1 < last.length; ++i$1) {
+        var span$1 = last[i$1];
+        if (span$1.to != null) { span$1.to += offset; }
+        if (span$1.from == null) {
+          var found$1 = getMarkedSpanFor(first, span$1.marker);
+          if (!found$1) {
+            span$1.from = offset;
+            if (sameLine) { (first || (first = [])).push(span$1); }
+          }
+        } else {
+          span$1.from += offset;
+          if (sameLine) { (first || (first = [])).push(span$1); }
+        }
+      }
+    }
+    // Make sure we didn't create any zero-length spans
+    if (first) { first = clearEmptySpans(first); }
+    if (last && last != first) { last = clearEmptySpans(last); }
+
+    var newMarkers = [first];
+    if (!sameLine) {
+      // Fill gap with whole-line-spans
+      var gap = change.text.length - 2, gapMarkers;
+      if (gap > 0 && first)
+        { for (var i$2 = 0; i$2 < first.length; ++i$2)
+          { if (first[i$2].to == null)
+            { (gapMarkers || (gapMarkers = [])).push(new MarkedSpan(first[i$2].marker, null, null)); } } }
+      for (var i$3 = 0; i$3 < gap; ++i$3)
+        { newMarkers.push(gapMarkers); }
+      newMarkers.push(last);
+    }
+    return newMarkers
+  }
+
+  // Remove spans that are empty and don't have a clearWhenEmpty
+  // option of false.
+  function clearEmptySpans(spans) {
+    for (var i = 0; i < spans.length; ++i) {
+      var span = spans[i];
+      if (span.from != null && span.from == span.to && span.marker.clearWhenEmpty !== false)
+        { spans.splice(i--, 1); }
+    }
+    if (!spans.length) { return null }
+    return spans
+  }
+
+  // Used to 'clip' out readOnly ranges when making a change.
+  function removeReadOnlyRanges(doc, from, to) {
+    var markers = null;
+    doc.iter(from.line, to.line + 1, function (line) {
+      if (line.markedSpans) { for (var i = 0; i < line.markedSpans.length; ++i) {
+        var mark = line.markedSpans[i].marker;
+        if (mark.readOnly && (!markers || indexOf(markers, mark) == -1))
+          { (markers || (markers = [])).push(mark); }
+      } }
+    });
+    if (!markers) { return null }
+    var parts = [{from: from, to: to}];
+    for (var i = 0; i < markers.length; ++i) {
+      var mk = markers[i], m = mk.find(0);
+      for (var j = 0; j < parts.length; ++j) {
+        var p = parts[j];
+        if (cmp(p.to, m.from) < 0 || cmp(p.from, m.to) > 0) { continue }
+        var newParts = [j, 1], dfrom = cmp(p.from, m.from), dto = cmp(p.to, m.to);
+        if (dfrom < 0 || !mk.inclusiveLeft && !dfrom)
+          { newParts.push({from: p.from, to: m.from}); }
+        if (dto > 0 || !mk.inclusiveRight && !dto)
+          { newParts.push({from: m.to, to: p.to}); }
+        parts.splice.apply(parts, newParts);
+        j += newParts.length - 3;
+      }
+    }
+    return parts
+  }
+
+  // Connect or disconnect spans from a line.
+  function detachMarkedSpans(line) {
+    var spans = line.markedSpans;
+    if (!spans) { return }
+    for (var i = 0; i < spans.length; ++i)
+      { spans[i].marker.detachLine(line); }
+    line.markedSpans = null;
+  }
+  function attachMarkedSpans(line, spans) {
+    if (!spans) { return }
+    for (var i = 0; i < spans.length; ++i)
+      { spans[i].marker.attachLine(line); }
+    line.markedSpans = spans;
+  }
+
+  // Helpers used when computing which overlapping collapsed span
+  // counts as the larger one.
+  function extraLeft(marker) { return marker.inclusiveLeft ? -1 : 0 }
+  function extraRight(marker) { return marker.inclusiveRight ? 1 : 0 }
+
+  // Returns a number indicating which of two overlapping collapsed
+  // spans is larger (and thus includes the other). Falls back to
+  // comparing ids when the spans cover exactly the same range.
+  function compareCollapsedMarkers(a, b) {
+    var lenDiff = a.lines.length - b.lines.length;
+    if (lenDiff != 0) { return lenDiff }
+    var aPos = a.find(), bPos = b.find();
+    var fromCmp = cmp(aPos.from, bPos.from) || extraLeft(a) - extraLeft(b);
+    if (fromCmp) { return -fromCmp }
+    var toCmp = cmp(aPos.to, bPos.to) || extraRight(a) - extraRight(b);
+    if (toCmp) { return toCmp }
+    return b.id - a.id
+  }
+
+  // Find out whether a line ends or starts in a collapsed span. If
+  // so, return the marker for that span.
+  function collapsedSpanAtSide(line, start) {
+    var sps = sawCollapsedSpans && line.markedSpans, found;
+    if (sps) { for (var sp = (void 0), i = 0; i < sps.length; ++i) {
+      sp = sps[i];
+      if (sp.marker.collapsed && (start ? sp.from : sp.to) == null &&
+          (!found || compareCollapsedMarkers(found, sp.marker) < 0))
+        { found = sp.marker; }
+    } }
+    return found
+  }
+  function collapsedSpanAtStart(line) { return collapsedSpanAtSide(line, true) }
+  function collapsedSpanAtEnd(line) { return collapsedSpanAtSide(line, false) }
+
+  function collapsedSpanAround(line, ch) {
+    var sps = sawCollapsedSpans && line.markedSpans, found;
+    if (sps) { for (var i = 0; i < sps.length; ++i) {
+      var sp = sps[i];
+      if (sp.marker.collapsed && (sp.from == null || sp.from < ch) && (sp.to == null || sp.to > ch) &&
+          (!found || compareCollapsedMarkers(found, sp.marker) < 0)) { found = sp.marker; }
+    } }
+    return found
+  }
+
+  // Test whether there exists a collapsed span that partially
+  // overlaps (covers the start or end, but not both) of a new span.
+  // Such overlap is not allowed.
+  function conflictingCollapsedRange(doc, lineNo$$1, from, to, marker) {
+    var line = getLine(doc, lineNo$$1);
+    var sps = sawCollapsedSpans && line.markedSpans;
+    if (sps) { for (var i = 0; i < sps.length; ++i) {
+      var sp = sps[i];
+      if (!sp.marker.collapsed) { continue }
+      var found = sp.marker.find(0);
+      var fromCmp = cmp(found.from, from) || extraLeft(sp.marker) - extraLeft(marker);
+      var toCmp = cmp(found.to, to) || extraRight(sp.marker) - extraRight(marker);
+      if (fromCmp >= 0 && toCmp <= 0 || fromCmp <= 0 && toCmp >= 0) { continue }
+      if (fromCmp <= 0 && (sp.marker.inclusiveRight && marker.inclusiveLeft ? cmp(found.to, from) >= 0 : cmp(found.to, from) > 0) ||
+          fromCmp >= 0 && (sp.marker.inclusiveRight && marker.inclusiveLeft ? cmp(found.from, to) <= 0 : cmp(found.from, to) < 0))
+        { return true }
+    } }
+  }
+
+  // A visual line is a line as drawn on the screen. Folding, for
+  // example, can cause multiple logical lines to appear on the same
+  // visual line. This finds the start of the visual line that the
+  // given line is part of (usually that is the line itself).
+  function visualLine(line) {
+    var merged;
+    while (merged = collapsedSpanAtStart(line))
+      { line = merged.find(-1, true).line; }
+    return line
+  }
+
+  function visualLineEnd(line) {
+    var merged;
+    while (merged = collapsedSpanAtEnd(line))
+      { line = merged.find(1, true).line; }
+    return line
+  }
+
+  // Returns an array of logical lines that continue the visual line
+  // started by the argument, or undefined if there are no such lines.
+  function visualLineContinued(line) {
+    var merged, lines;
+    while (merged = collapsedSpanAtEnd(line)) {
+      line = merged.find(1, true).line
+      ;(lines || (lines = [])).push(line);
+    }
+    return lines
+  }
+
+  // Get the line number of the start of the visual line that the
+  // given line number is part of.
+  function visualLineNo(doc, lineN) {
+    var line = getLine(doc, lineN), vis = visualLine(line);
+    if (line == vis) { return lineN }
+    return lineNo(vis)
+  }
+
+  // Get the line number of the start of the next visual line after
+  // the given line.
+  function visualLineEndNo(doc, lineN) {
+    if (lineN > doc.lastLine()) { return lineN }
+    var line = getLine(doc, lineN), merged;
+    if (!lineIsHidden(doc, line)) { return lineN }
+    while (merged = collapsedSpanAtEnd(line))
+      { line = merged.find(1, true).line; }
+    return lineNo(line) + 1
+  }
+
+  // Compute whether a line is hidden. Lines count as hidden when they
+  // are part of a visual line that starts with another line, or when
+  // they are entirely covered by collapsed, non-widget span.
+  function lineIsHidden(doc, line) {
+    var sps = sawCollapsedSpans && line.markedSpans;
+    if (sps) { for (var sp = (void 0), i = 0; i < sps.length; ++i) {
+      sp = sps[i];
+      if (!sp.marker.collapsed) { continue }
+      if (sp.from == null) { return true }
+      if (sp.marker.widgetNode) { continue }
+      if (sp.from == 0 && sp.marker.inclusiveLeft && lineIsHiddenInner(doc, line, sp))
+        { return true }
+    } }
+  }
+  function lineIsHiddenInner(doc, line, span) {
+    if (span.to == null) {
+      var end = span.marker.find(1, true);
+      return lineIsHiddenInner(doc, end.line, getMarkedSpanFor(end.line.markedSpans, span.marker))
+    }
+    if (span.marker.inclusiveRight && span.to == line.text.length)
+      { return true }
+    for (var sp = (void 0), i = 0; i < line.markedSpans.length; ++i) {
+      sp = line.markedSpans[i];
+      if (sp.marker.collapsed && !sp.marker.widgetNode && sp.from == span.to &&
+          (sp.to == null || sp.to != span.from) &&
+          (sp.marker.inclusiveLeft || span.marker.inclusiveRight) &&
+          lineIsHiddenInner(doc, line, sp)) { return true }
+    }
+  }
+
+  // Find the height above the given line.
+  function heightAtLine(lineObj) {
+    lineObj = visualLine(lineObj);
+
+    var h = 0, chunk = lineObj.parent;
+    for (var i = 0; i < chunk.lines.length; ++i) {
+      var line = chunk.lines[i];
+      if (line == lineObj) { break }
+      else { h += line.height; }
+    }
+    for (var p = chunk.parent; p; chunk = p, p = chunk.parent) {
+      for (var i$1 = 0; i$1 < p.children.length; ++i$1) {
+        var cur = p.children[i$1];
+        if (cur == chunk) { break }
+        else { h += cur.height; }
+      }
+    }
+    return h
+  }
+
+  // Compute the character length of a line, taking into account
+  // collapsed ranges (see markText) that might hide parts, and join
+  // other lines onto it.
+  function lineLength(line) {
+    if (line.height == 0) { return 0 }
+    var len = line.text.length, merged, cur = line;
+    while (merged = collapsedSpanAtStart(cur)) {
+      var found = merged.find(0, true);
+      cur = found.from.line;
+      len += found.from.ch - found.to.ch;
+    }
+    cur = line;
+    while (merged = collapsedSpanAtEnd(cur)) {
+      var found$1 = merged.find(0, true);
+      len -= cur.text.length - found$1.from.ch;
+      cur = found$1.to.line;
+      len += cur.text.length - found$1.to.ch;
+    }
+    return len
+  }
+
+  // Find the longest line in the document.
+  function findMaxLine(cm) {
+    var d = cm.display, doc = cm.doc;
+    d.maxLine = getLine(doc, doc.first);
+    d.maxLineLength = lineLength(d.maxLine);
+    d.maxLineChanged = true;
+    doc.iter(function (line) {
+      var len = lineLength(line);
+      if (len > d.maxLineLength) {
+        d.maxLineLength = len;
+        d.maxLine = line;
+      }
+    });
+  }
+
+  // LINE DATA STRUCTURE
+
+  // Line objects. These hold state related to a line, including
+  // highlighting info (the styles array).
+  var Line = function(text, markedSpans, estimateHeight) {
+    this.text = text;
+    attachMarkedSpans(this, markedSpans);
+    this.height = estimateHeight ? estimateHeight(this) : 1;
+  };
+
+  Line.prototype.lineNo = function () { return lineNo(this) };
+  eventMixin(Line);
+
+  // Change the content (text, markers) of a line. Automatically
+  // invalidates cached information and tries to re-estimate the
+  // line's height.
+  function updateLine(line, text, markedSpans, estimateHeight) {
+    line.text = text;
+    if (line.stateAfter) { line.stateAfter = null; }
+    if (line.styles) { line.styles = null; }
+    if (line.order != null) { line.order = null; }
+    detachMarkedSpans(line);
+    attachMarkedSpans(line, markedSpans);
+    var estHeight = estimateHeight ? estimateHeight(line) : 1;
+    if (estHeight != line.height) { updateLineHeight(line, estHeight); }
+  }
+
+  // Detach a line from the document tree and its markers.
+  function cleanUpLine(line) {
+    line.parent = null;
+    detachMarkedSpans(line);
+  }
+
+  // Convert a style as returned by a mode (either null, or a string
+  // containing one or more styles) to a CSS style. This is cached,
+  // and also looks for line-wide styles.
+  var styleToClassCache = {}, styleToClassCacheWithMode = {};
+  function interpretTokenStyle(style, options) {
+    if (!style || /^\s*$/.test(style)) { return null }
+    var cache = options.addModeClass ? styleToClassCacheWithMode : styleToClassCache;
+    return cache[style] ||
+      (cache[style] = style.replace(/\S+/g, "cm-$&"))
+  }
+
+  // Render the DOM representation of the text of a line. Also builds
+  // up a 'line map', which points at the DOM nodes that represent
+  // specific stretches of text, and is used by the measuring code.
+  // The returned object contains the DOM node, this map, and
+  // information about line-wide styles that were set by the mode.
+  function buildLineContent(cm, lineView) {
+    // The padding-right forces the element to have a 'border', which
+    // is needed on Webkit to be able to get line-level bounding
+    // rectangles for it (in measureChar).
+    var content = eltP("span", null, null, webkit ? "padding-right: .1px" : null);
+    var builder = {pre: eltP("pre", [content], "CodeMirror-line"), content: content,
+                   col: 0, pos: 0, cm: cm,
+                   trailingSpace: false,
+                   splitSpaces: cm.getOption("lineWrapping")};
+    lineView.measure = {};
+
+    // Iterate over the logical lines that make up this visual line.
+    for (var i = 0; i <= (lineView.rest ? lineView.rest.length : 0); i++) {
+      var line = i ? lineView.rest[i - 1] : lineView.line, order = (void 0);
+      builder.pos = 0;
+      builder.addToken = buildToken;
+      // Optionally wire in some hacks into the token-rendering
+      // algorithm, to deal with browser quirks.
+      if (hasBadBidiRects(cm.display.measure) && (order = getOrder(line, cm.doc.direction)))
+        { builder.addToken = buildTokenBadBidi(builder.addToken, order); }
+      builder.map = [];
+      var allowFrontierUpdate = lineView != cm.display.externalMeasured && lineNo(line);
+      insertLineContent(line, builder, getLineStyles(cm, line, allowFrontierUpdate));
+      if (line.styleClasses) {
+        if (line.styleClasses.bgClass)
+          { builder.bgClass = joinClasses(line.styleClasses.bgClass, builder.bgClass || ""); }
+        if (line.styleClasses.textClass)
+          { builder.textClass = joinClasses(line.styleClasses.textClass, builder.textClass || ""); }
+      }
+
+      // Ensure at least a single node is present, for measuring.
+      if (builder.map.length == 0)
+        { builder.map.push(0, 0, builder.content.appendChild(zeroWidthElement(cm.display.measure))); }
+
+      // Store the map and a cache object for the current logical line
+      if (i == 0) {
+        lineView.measure.map = builder.map;
+        lineView.measure.cache = {};
+      } else {
+  (lineView.measure.maps || (lineView.measure.maps = [])).push(builder.map)
+        ;(lineView.measure.caches || (lineView.measure.caches = [])).push({});
+      }
+    }
+
+    // See issue #2901
+    if (webkit) {
+      var last = builder.content.lastChild;
+      if (/\bcm-tab\b/.test(last.className) || (last.querySelector && last.querySelector(".cm-tab")))
+        { builder.content.className = "cm-tab-wrap-hack"; }
+    }
+
+    signal(cm, "renderLine", cm, lineView.line, builder.pre);
+    if (builder.pre.className)
+      { builder.textClass = joinClasses(builder.pre.className, builder.textClass || ""); }
+
+    return builder
+  }
+
+  function defaultSpecialCharPlaceholder(ch) {
+    var token = elt("span", "\u2022", "cm-invalidchar");
+    token.title = "\\u" + ch.charCodeAt(0).toString(16);
+    token.setAttribute("aria-label", token.title);
+    return token
+  }
+
+  // Build up the DOM representation for a single token, and add it to
+  // the line map. Takes care to render special characters separately.
+  function buildToken(builder, text, style, startStyle, endStyle, css, attributes) {
+    if (!text) { return }
+    var displayText = builder.splitSpaces ? splitSpaces(text, builder.trailingSpace) : text;
+    var special = builder.cm.state.specialChars, mustWrap = false;
+    var content;
+    if (!special.test(text)) {
+      builder.col += text.length;
+      content = document.createTextNode(displayText);
+      builder.map.push(builder.pos, builder.pos + text.length, content);
+      if (ie && ie_version < 9) { mustWrap = true; }
+      builder.pos += text.length;
+    } else {
+      content = document.createDocumentFragment();
+      var pos = 0;
+      while (true) {
+        special.lastIndex = pos;
+        var m = special.exec(text);
+        var skipped = m ? m.index - pos : text.length - pos;
+        if (skipped) {
+          var txt = document.createTextNode(displayText.slice(pos, pos + skipped));
+          if (ie && ie_version < 9) { content.appendChild(elt("span", [txt])); }
+          else { content.appendChild(txt); }
+          builder.map.push(builder.pos, builder.pos + skipped, txt);
+          builder.col += skipped;
+          builder.pos += skipped;
+        }
+        if (!m) { break }
+        pos += skipped + 1;
+        var txt$1 = (void 0);
+        if (m[0] == "\t") {
+          var tabSize = builder.cm.options.tabSize, tabWidth = tabSize - builder.col % tabSize;
+          txt$1 = content.appendChild(elt("span", spaceStr(tabWidth), "cm-tab"));
+          txt$1.setAttribute("role", "presentation");
+          txt$1.setAttribute("cm-text", "\t");
+          builder.col += tabWidth;
+        } else if (m[0] == "\r" || m[0] == "\n") {
+          txt$1 = content.appendChild(elt("span", m[0] == "\r" ? "\u240d" : "\u2424", "cm-invalidchar"));
+          txt$1.setAttribute("cm-text", m[0]);
+          builder.col += 1;
+        } else {
+          txt$1 = builder.cm.options.specialCharPlaceholder(m[0]);
+          txt$1.setAttribute("cm-text", m[0]);
+          if (ie && ie_version < 9) { content.appendChild(elt("span", [txt$1])); }
+          else { content.appendChild(txt$1); }
+          builder.col += 1;
+        }
+        builder.map.push(builder.pos, builder.pos + 1, txt$1);
+        builder.pos++;
+      }
+    }
+    builder.trailingSpace = displayText.charCodeAt(text.length - 1) == 32;
+    if (style || startStyle || endStyle || mustWrap || css) {
+      var fullStyle = style || "";
+      if (startStyle) { fullStyle += startStyle; }
+      if (endStyle) { fullStyle += endStyle; }
+      var token = elt("span", [content], fullStyle, css);
+      if (attributes) {
+        for (var attr in attributes) { if (attributes.hasOwnProperty(attr) && attr != "style" && attr != "class")
+          { token.setAttribute(attr, attributes[attr]); } }
+      }
+      return builder.content.appendChild(token)
+    }
+    builder.content.appendChild(content);
+  }
+
+  // Change some spaces to NBSP to prevent the browser from collapsing
+  // trailing spaces at the end of a line when rendering text (issue #1362).
+  function splitSpaces(text, trailingBefore) {
+    if (text.length > 1 && !/  /.test(text)) { return text }
+    var spaceBefore = trailingBefore, result = "";
+    for (var i = 0; i < text.length; i++) {
+      var ch = text.charAt(i);
+      if (ch == " " && spaceBefore && (i == text.length - 1 || text.charCodeAt(i + 1) == 32))
+        { ch = "\u00a0"; }
+      result += ch;
+      spaceBefore = ch == " ";
+    }
+    return result
+  }
+
+  // Work around nonsense dimensions being reported for stretches of
+  // right-to-left text.
+  function buildTokenBadBidi(inner, order) {
+    return function (builder, text, style, startStyle, endStyle, css, attributes) {
+      style = style ? style + " cm-force-border" : "cm-force-border";
+      var start = builder.pos, end = start + text.length;
+      for (;;) {
+        // Find the part that overlaps with the start of this text
+        var part = (void 0);
+        for (var i = 0; i < order.length; i++) {
+          part = order[i];
+          if (part.to > start && part.from <= start) { break }
+        }
+        if (part.to >= end) { return inner(builder, text, style, startStyle, endStyle, css, attributes) }
+        inner(builder, text.slice(0, part.to - start), style, startStyle, null, css, attributes);
+        startStyle = null;
+        text = text.slice(part.to - start);
+        start = part.to;
+      }
+    }
+  }
+
+  function buildCollapsedSpan(builder, size, marker, ignoreWidget) {
+    var widget = !ignoreWidget && marker.widgetNode;
+    if (widget) { builder.map.push(builder.pos, builder.pos + size, widget); }
+    if (!ignoreWidget && builder.cm.display.input.needsContentAttribute) {
+      if (!widget)
+        { widget = builder.content.appendChild(document.createElement("span")); }
+      widget.setAttribute("cm-marker", marker.id);
+    }
+    if (widget) {
+      builder.cm.display.input.setUneditable(widget);
+      builder.content.appendChild(widget);
+    }
+    builder.pos += size;
+    builder.trailingSpace = false;
+  }
+
+  // Outputs a number of spans to make up a line, taking highlighting
+  // and marked text into account.
+  function insertLineContent(line, builder, styles) {
+    var spans = line.markedSpans, allText = line.text, at = 0;
+    if (!spans) {
+      for (var i$1 = 1; i$1 < styles.length; i$1+=2)
+        { builder.addToken(builder, allText.slice(at, at = styles[i$1]), interpretTokenStyle(styles[i$1+1], builder.cm.options)); }
+      return
+    }
+
+    var len = allText.length, pos = 0, i = 1, text = "", style, css;
+    var nextChange = 0, spanStyle, spanEndStyle, spanStartStyle, collapsed, attributes;
+    for (;;) {
+      if (nextChange == pos) { // Update current marker set
+        spanStyle = spanEndStyle = spanStartStyle = css = "";
+        attributes = null;
+        collapsed = null; nextChange = Infinity;
+        var foundBookmarks = [], endStyles = (void 0);
+        for (var j = 0; j < spans.length; ++j) {
+          var sp = spans[j], m = sp.marker;
+          if (m.type == "bookmark" && sp.from == pos && m.widgetNode) {
+            foundBookmarks.push(m);
+          } else if (sp.from <= pos && (sp.to == null || sp.to > pos || m.collapsed && sp.to == pos && sp.from == pos)) {
+            if (sp.to != null && sp.to != pos && nextChange > sp.to) {
+              nextChange = sp.to;
+              spanEndStyle = "";
+            }
+            if (m.className) { spanStyle += " " + m.className; }
+            if (m.css) { css = (css ? css + ";" : "") + m.css; }
+            if (m.startStyle && sp.from == pos) { spanStartStyle += " " + m.startStyle; }
+            if (m.endStyle && sp.to == nextChange) { (endStyles || (endStyles = [])).push(m.endStyle, sp.to); }
+            // support for the old title property
+            // https://github.com/codemirror/CodeMirror/pull/5673
+            if (m.title) { (attributes || (attributes = {})).title = m.title; }
+            if (m.attributes) {
+              for (var attr in m.attributes)
+                { (attributes || (attributes = {}))[attr] = m.attributes[attr]; }
+            }
+            if (m.collapsed && (!collapsed || compareCollapsedMarkers(collapsed.marker, m) < 0))
+              { collapsed = sp; }
+          } else if (sp.from > pos && nextChange > sp.from) {
+            nextChange = sp.from;
+          }
+        }
+        if (endStyles) { for (var j$1 = 0; j$1 < endStyles.length; j$1 += 2)
+          { if (endStyles[j$1 + 1] == nextChange) { spanEndStyle += " " + endStyles[j$1]; } } }
+
+        if (!collapsed || collapsed.from == pos) { for (var j$2 = 0; j$2 < foundBookmarks.length; ++j$2)
+          { buildCollapsedSpan(builder, 0, foundBookmarks[j$2]); } }
+        if (collapsed && (collapsed.from || 0) == pos) {
+          buildCollapsedSpan(builder, (collapsed.to == null ? len + 1 : collapsed.to) - pos,
+                             collapsed.marker, collapsed.from == null);
+          if (collapsed.to == null) { return }
+          if (collapsed.to == pos) { collapsed = false; }
+        }
+      }
+      if (pos >= len) { break }
+
+      var upto = Math.min(len, nextChange);
+      while (true) {
+        if (text) {
+          var end = pos + text.length;
+          if (!collapsed) {
+            var tokenText = end > upto ? text.slice(0, upto - pos) : text;
+            builder.addToken(builder, tokenText, style ? style + spanStyle : spanStyle,
+                             spanStartStyle, pos + tokenText.length == nextChange ? spanEndStyle : "", css, attributes);
+          }
+          if (end >= upto) {text = text.slice(upto - pos); pos = upto; break}
+          pos = end;
+          spanStartStyle = "";
+        }
+        text = allText.slice(at, at = styles[i++]);
+        style = interpretTokenStyle(styles[i++], builder.cm.options);
+      }
+    }
+  }
+
+
+  // These objects are used to represent the visible (currently drawn)
+  // part of the document. A LineView may correspond to multiple
+  // logical lines, if those are connected by collapsed ranges.
+  function LineView(doc, line, lineN) {
+    // The starting line
+    this.line = line;
+    // Continuing lines, if any
+    this.rest = visualLineContinued(line);
+    // Number of logical lines in this visual line
+    this.size = this.rest ? lineNo(lst(this.rest)) - lineN + 1 : 1;
+    this.node = this.text = null;
+    this.hidden = lineIsHidden(doc, line);
+  }
+
+  // Create a range of LineView objects for the given lines.
+  function buildViewArray(cm, from, to) {
+    var array = [], nextPos;
+    for (var pos = from; pos < to; pos = nextPos) {
+      var view = new LineView(cm.doc, getLine(cm.doc, pos), pos);
+      nextPos = pos + view.size;
+      array.push(view);
+    }
+    return array
+  }
+
+  var operationGroup = null;
+
+  function pushOperation(op) {
+    if (operationGroup) {
+      operationGroup.ops.push(op);
+    } else {
+      op.ownsGroup = operationGroup = {
+        ops: [op],
+        delayedCallbacks: []
+      };
+    }
+  }
+
+  function fireCallbacksForOps(group) {
+    // Calls delayed callbacks and cursorActivity handlers until no
+    // new ones appear
+    var callbacks = group.delayedCallbacks, i = 0;
+    do {
+      for (; i < callbacks.length; i++)
+        { callbacks[i].call(null); }
+      for (var j = 0; j < group.ops.length; j++) {
+        var op = group.ops[j];
+        if (op.cursorActivityHandlers)
+          { while (op.cursorActivityCalled < op.cursorActivityHandlers.length)
+            { op.cursorActivityHandlers[op.cursorActivityCalled++].call(null, op.cm); } }
+      }
+    } while (i < callbacks.length)
+  }
+
+  function finishOperation(op, endCb) {
+    var group = op.ownsGroup;
+    if (!group) { return }
+
+    try { fireCallbacksForOps(group); }
+    finally {
+      operationGroup = null;
+      endCb(group);
+    }
+  }
+
+  var orphanDelayedCallbacks = null;
+
+  // Often, we want to signal events at a point where we are in the
+  // middle of some work, but don't want the handler to start calling
+  // other methods on the editor, which might be in an inconsistent
+  // state or simply not expect any other events to happen.
+  // signalLater looks whether there are any handlers, and schedules
+  // them to be executed when the last operation ends, or, if no
+  // operation is active, when a timeout fires.
+  function signalLater(emitter, type /*, values...*/) {
+    var arr = getHandlers(emitter, type);
+    if (!arr.length) { return }
+    var args = Array.prototype.slice.call(arguments, 2), list;
+    if (operationGroup) {
+      list = operationGroup.delayedCallbacks;
+    } else if (orphanDelayedCallbacks) {
+      list = orphanDelayedCallbacks;
+    } else {
+      list = orphanDelayedCallbacks = [];
+      setTimeout(fireOrphanDelayed, 0);
+    }
+    var loop = function ( i ) {
+      list.push(function () { return arr[i].apply(null, args); });
+    };
+
+    for (var i = 0; i < arr.length; ++i)
+      loop( i );
+  }
+
+  function fireOrphanDelayed() {
+    var delayed = orphanDelayedCallbacks;
+    orphanDelayedCallbacks = null;
+    for (var i = 0; i < delayed.length; ++i) { delayed[i](); }
+  }
+
+  // When an aspect of a line changes, a string is added to
+  // lineView.changes. This updates the relevant part of the line's
+  // DOM structure.
+  function updateLineForChanges(cm, lineView, lineN, dims) {
+    for (var j = 0; j < lineView.changes.length; j++) {
+      var type = lineView.changes[j];
+      if (type == "text") { updateLineText(cm, lineView); }
+      else if (type == "gutter") { updateLineGutter(cm, lineView, lineN, dims); }
+      else if (type == "class") { updateLineClasses(cm, lineView); }
+      else if (type == "widget") { updateLineWidgets(cm, lineView, dims); }
+    }
+    lineView.changes = null;
+  }
+
+  // Lines with gutter elements, widgets or a background class need to
+  // be wrapped, and have the extra elements added to the wrapper div
+  function ensureLineWrapped(lineView) {
+    if (lineView.node == lineView.text) {
+      lineView.node = elt("div", null, null, "position: relative");
+      if (lineView.text.parentNode)
+        { lineView.text.parentNode.replaceChild(lineView.node, lineView.text); }
+      lineView.node.appendChild(lineView.text);
+      if (ie && ie_version < 8) { lineView.node.style.zIndex = 2; }
+    }
+    return lineView.node
+  }
+
+  function updateLineBackground(cm, lineView) {
+    var cls = lineView.bgClass ? lineView.bgClass + " " + (lineView.line.bgClass || "") : lineView.line.bgClass;
+    if (cls) { cls += " CodeMirror-linebackground"; }
+    if (lineView.background) {
+      if (cls) { lineView.background.className = cls; }
+      else { lineView.background.parentNode.removeChild(lineView.background); lineView.background = null; }
+    } else if (cls) {
+      var wrap = ensureLineWrapped(lineView);
+      lineView.background = wrap.insertBefore(elt("div", null, cls), wrap.firstChild);
+      cm.display.input.setUneditable(lineView.background);
+    }
+  }
+
+  // Wrapper around buildLineContent which will reuse the structure
+  // in display.externalMeasured when possible.
+  function getLineContent(cm, lineView) {
+    var ext = cm.display.externalMeasured;
+    if (ext && ext.line == lineView.line) {
+      cm.display.externalMeasured = null;
+      lineView.measure = ext.measure;
+      return ext.built
+    }
+    return buildLineContent(cm, lineView)
+  }
+
+  // Redraw the line's text. Interacts with the background and text
+  // classes because the mode may output tokens that influence these
+  // classes.
+  function updateLineText(cm, lineView) {
+    var cls = lineView.text.className;
+    var built = getLineContent(cm, lineView);
+    if (lineView.text == lineView.node) { lineView.node = built.pre; }
+    lineView.text.parentNode.replaceChild(built.pre, lineView.text);
+    lineView.text = built.pre;
+    if (built.bgClass != lineView.bgClass || built.textClass != lineView.textClass) {
+      lineView.bgClass = built.bgClass;
+      lineView.textClass = built.textClass;
+      updateLineClasses(cm, lineView);
+    } else if (cls) {
+      lineView.text.className = cls;
+    }
+  }
+
+  function updateLineClasses(cm, lineView) {
+    updateLineBackground(cm, lineView);
+    if (lineView.line.wrapClass)
+      { ensureLineWrapped(lineView).className = lineView.line.wrapClass; }
+    else if (lineView.node != lineView.text)
+      { lineView.node.className = ""; }
+    var textClass = lineView.textClass ? lineView.textClass + " " + (lineView.line.textClass || "") : lineView.line.textClass;
+    lineView.text.className = textClass || "";
+  }
+
+  function updateLineGutter(cm, lineView, lineN, dims) {
+    if (lineView.gutter) {
+      lineView.node.removeChild(lineView.gutter);
+      lineView.gutter = null;
+    }
+    if (lineView.gutterBackground) {
+      lineView.node.removeChild(lineView.gutterBackground);
+      lineView.gutterBackground = null;
+    }
+    if (lineView.line.gutterClass) {
+      var wrap = ensureLineWrapped(lineView);
+      lineView.gutterBackground = elt("div", null, "CodeMirror-gutter-background " + lineView.line.gutterClass,
+                                      ("left: " + (cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth) + "px; width: " + (dims.gutterTotalWidth) + "px"));
+      cm.display.input.setUneditable(lineView.gutterBackground);
+      wrap.insertBefore(lineView.gutterBackground, lineView.text);
+    }
+    var markers = lineView.line.gutterMarkers;
+    if (cm.options.lineNumbers || markers) {
+      var wrap$1 = ensureLineWrapped(lineView);
+      var gutterWrap = lineView.gutter = elt("div", null, "CodeMirror-gutter-wrapper", ("left: " + (cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth) + "px"));
+      cm.display.input.setUneditable(gutterWrap);
+      wrap$1.insertBefore(gutterWrap, lineView.text);
+      if (lineView.line.gutterClass)
+        { gutterWrap.className += " " + lineView.line.gutterClass; }
+      if (cm.options.lineNumbers && (!markers || !markers["CodeMirror-linenumbers"]))
+        { lineView.lineNumber = gutterWrap.appendChild(
+          elt("div", lineNumberFor(cm.options, lineN),
+              "CodeMirror-linenumber CodeMirror-gutter-elt",
+              ("left: " + (dims.gutterLeft["CodeMirror-linenumbers"]) + "px; width: " + (cm.display.lineNumInnerWidth) + "px"))); }
+      if (markers) { for (var k = 0; k < cm.display.gutterSpecs.length; ++k) {
+        var id = cm.display.gutterSpecs[k].className, found = markers.hasOwnProperty(id) && markers[id];
+        if (found)
+          { gutterWrap.appendChild(elt("div", [found], "CodeMirror-gutter-elt",
+                                     ("left: " + (dims.gutterLeft[id]) + "px; width: " + (dims.gutterWidth[id]) + "px"))); }
+      } }
+    }
+  }
+
+  function updateLineWidgets(cm, lineView, dims) {
+    if (lineView.alignable) { lineView.alignable = null; }
+    for (var node = lineView.node.firstChild, next = (void 0); node; node = next) {
+      next = node.nextSibling;
+      if (node.className == "CodeMirror-linewidget")
+        { lineView.node.removeChild(node); }
+    }
+    insertLineWidgets(cm, lineView, dims);
+  }
+
+  // Build a line's DOM representation from scratch
+  function buildLineElement(cm, lineView, lineN, dims) {
+    var built = getLineContent(cm, lineView);
+    lineView.text = lineView.node = built.pre;
+    if (built.bgClass) { lineView.bgClass = built.bgClass; }
+    if (built.textClass) { lineView.textClass = built.textClass; }
+
+    updateLineClasses(cm, lineView);
+    updateLineGutter(cm, lineView, lineN, dims);
+    insertLineWidgets(cm, lineView, dims);
+    return lineView.node
+  }
+
+  // A lineView may contain multiple logical lines (when merged by
+  // collapsed spans). The widgets for all of them need to be drawn.
+  function insertLineWidgets(cm, lineView, dims) {
+    insertLineWidgetsFor(cm, lineView.line, lineView, dims, true);
+    if (lineView.rest) { for (var i = 0; i < lineView.rest.length; i++)
+      { insertLineWidgetsFor(cm, lineView.rest[i], lineView, dims, false); } }
+  }
+
+  function insertLineWidgetsFor(cm, line, lineView, dims, allowAbove) {
+    if (!line.widgets) { return }
+    var wrap = ensureLineWrapped(lineView);
+    for (var i = 0, ws = line.widgets; i < ws.length; ++i) {
+      var widget = ws[i], node = elt("div", [widget.node], "CodeMirror-linewidget");
+      if (!widget.handleMouseEvents) { node.setAttribute("cm-ignore-events", "true"); }
+      positionLineWidget(widget, node, lineView, dims);
+      cm.display.input.setUneditable(node);
+      if (allowAbove && widget.above)
+        { wrap.insertBefore(node, lineView.gutter || lineView.text); }
+      else
+        { wrap.appendChild(node); }
+      signalLater(widget, "redraw");
+    }
+  }
+
+  function positionLineWidget(widget, node, lineView, dims) {
+    if (widget.noHScroll) {
+  (lineView.alignable || (lineView.alignable = [])).push(node);
+      var width = dims.wrapperWidth;
+      node.style.left = dims.fixedPos + "px";
+      if (!widget.coverGutter) {
+        width -= dims.gutterTotalWidth;
+        node.style.paddingLeft = dims.gutterTotalWidth + "px";
+      }
+      node.style.width = width + "px";
+    }
+    if (widget.coverGutter) {
+      node.style.zIndex = 5;
+      node.style.position = "relative";
+      if (!widget.noHScroll) { node.style.marginLeft = -dims.gutterTotalWidth + "px"; }
+    }
+  }
+
+  function widgetHeight(widget) {
+    if (widget.height != null) { return widget.height }
+    var cm = widget.doc.cm;
+    if (!cm) { return 0 }
+    if (!contains(document.body, widget.node)) {
+      var parentStyle = "position: relative;";
+      if (widget.coverGutter)
+        { parentStyle += "margin-left: -" + cm.display.gutters.offsetWidth + "px;"; }
+      if (widget.noHScroll)
+        { parentStyle += "width: " + cm.display.wrapper.clientWidth + "px;"; }
+      removeChildrenAndAdd(cm.display.measure, elt("div", [widget.node], null, parentStyle));
+    }
+    return widget.height = widget.node.parentNode.offsetHeight
+  }
+
+  // Return true when the given mouse event happened in a widget
+  function eventInWidget(display, e) {
+    for (var n = e_target(e); n != display.wrapper; n = n.parentNode) {
+      if (!n || (n.nodeType == 1 && n.getAttribute("cm-ignore-events") == "true") ||
+          (n.parentNode == display.sizer && n != display.mover))
+        { return true }
+    }
+  }
+
+  // POSITION MEASUREMENT
+
+  function paddingTop(display) {return display.lineSpace.offsetTop}
+  function paddingVert(display) {return display.mover.offsetHeight - display.lineSpace.offsetHeight}
+  function paddingH(display) {
+    if (display.cachedPaddingH) { return display.cachedPaddingH }
+    var e = removeChildrenAndAdd(display.measure, elt("pre", "x", "CodeMirror-line-like"));
+    var style = window.getComputedStyle ? window.getComputedStyle(e) : e.currentStyle;
+    var data = {left: parseInt(style.paddingLeft), right: parseInt(style.paddingRight)};
+    if (!isNaN(data.left) && !isNaN(data.right)) { display.cachedPaddingH = data; }
+    return data
+  }
+
+  function scrollGap(cm) { return scrollerGap - cm.display.nativeBarWidth }
+  function displayWidth(cm) {
+    return cm.display.scroller.clientWidth - scrollGap(cm) - cm.display.barWidth
+  }
+  function displayHeight(cm) {
+    return cm.display.scroller.clientHeight - scrollGap(cm) - cm.display.barHeight
+  }
+
+  // Ensure the lineView.wrapping.heights array is populated. This is
+  // an array of bottom offsets for the lines that make up a drawn
+  // line. When lineWrapping is on, there might be more than one
+  // height.
+  function ensureLineHeights(cm, lineView, rect) {
+    var wrapping = cm.options.lineWrapping;
+    var curWidth = wrapping && displayWidth(cm);
+    if (!lineView.measure.heights || wrapping && lineView.measure.width != curWidth) {
+      var heights = lineView.measure.heights = [];
+      if (wrapping) {
+        lineView.measure.width = curWidth;
+        var rects = lineView.text.firstChild.getClientRects();
+        for (var i = 0; i < rects.length - 1; i++) {
+          var cur = rects[i], next = rects[i + 1];
+          if (Math.abs(cur.bottom - next.bottom) > 2)
+            { heights.push((cur.bottom + next.top) / 2 - rect.top); }
+        }
+      }
+      heights.push(rect.bottom - rect.top);
+    }
+  }
+
+  // Find a line map (mapping character offsets to text nodes) and a
+  // measurement cache for the given line number. (A line view might
+  // contain multiple lines when collapsed ranges are present.)
+  function mapFromLineView(lineView, line, lineN) {
+    if (lineView.line == line)
+      { return {map: lineView.measure.map, cache: lineView.measure.cache} }
+    for (var i = 0; i < lineView.rest.length; i++)
+      { if (lineView.rest[i] == line)
+        { return {map: lineView.measure.maps[i], cache: lineView.measure.caches[i]} } }
+    for (var i$1 = 0; i$1 < lineView.rest.length; i$1++)
+      { if (lineNo(lineView.rest[i$1]) > lineN)
+        { return {map: lineView.measure.maps[i$1], cache: lineView.measure.caches[i$1], before: true} } }
+  }
+
+  // Render a line into the hidden node display.externalMeasured. Used
+  // when measurement is needed for a line that's not in the viewport.
+  function updateExternalMeasurement(cm, line) {
+    line = visualLine(line);
+    var lineN = lineNo(line);
+    var view = cm.display.externalMeasured = new LineView(cm.doc, line, lineN);
+    view.lineN = lineN;
+    var built = view.built = buildLineContent(cm, view);
+    view.text = built.pre;
+    removeChildrenAndAdd(cm.display.lineMeasure, built.pre);
+    return view
+  }
+
+  // Get a {top, bottom, left, right} box (in line-local coordinates)
+  // for a given character.
+  function measureChar(cm, line, ch, bias) {
+    return measureCharPrepared(cm, prepareMeasureForLine(cm, line), ch, bias)
+  }
+
+  // Find a line view that corresponds to the given line number.
+  function findViewForLine(cm, lineN) {
+    if (lineN >= cm.display.viewFrom && lineN < cm.display.viewTo)
+      { return cm.display.view[findViewIndex(cm, lineN)] }
+    var ext = cm.display.externalMeasured;
+    if (ext && lineN >= ext.lineN && lineN < ext.lineN + ext.size)
+      { return ext }
+  }
+
+  // Measurement can be split in two steps, the set-up work that
+  // applies to the whole line, and the measurement of the actual
+  // character. Functions like coordsChar, that need to do a lot of
+  // measurements in a row, can thus ensure that the set-up work is
+  // only done once.
+  function prepareMeasureForLine(cm, line) {
+    var lineN = lineNo(line);
+    var view = findViewForLine(cm, lineN);
+    if (view && !view.text) {
+      view = null;
+    } else if (view && view.changes) {
+      updateLineForChanges(cm, view, lineN, getDimensions(cm));
+      cm.curOp.forceUpdate = true;
+    }
+    if (!view)
+      { view = updateExternalMeasurement(cm, line); }
+
+    var info = mapFromLineView(view, line, lineN);
+    return {
+      line: line, view: view, rect: null,
+      map: info.map, cache: info.cache, before: info.before,
+      hasHeights: false
+    }
+  }
+
+  // Given a prepared measurement object, measures the position of an
+  // actual character (or fetches it from the cache).
+  function measureCharPrepared(cm, prepared, ch, bias, varHeight) {
+    if (prepared.before) { ch = -1; }
+    var key = ch + (bias || ""), found;
+    if (prepared.cache.hasOwnProperty(key)) {
+      found = prepared.cache[key];
+    } else {
+      if (!prepared.rect)
+        { prepared.rect = prepared.view.text.getBoundingClientRect(); }
+      if (!prepared.hasHeights) {
+        ensureLineHeights(cm, prepared.view, prepared.rect);
+        prepared.hasHeights = true;
+      }
+      found = measureCharInner(cm, prepared, ch, bias);
+      if (!found.bogus) { prepared.cache[key] = found; }
+    }
+    return {left: found.left, right: found.right,
+            top: varHeight ? found.rtop : found.top,
+            bottom: varHeight ? found.rbottom : found.bottom}
+  }
+
+  var nullRect = {left: 0, right: 0, top: 0, bottom: 0};
+
+  function nodeAndOffsetInLineMap(map$$1, ch, bias) {
+    var node, start, end, collapse, mStart, mEnd;
+    // First, search the line map for the text node corresponding to,
+    // or closest to, the target character.
+    for (var i = 0; i < map$$1.length; i += 3) {
+      mStart = map$$1[i];
+      mEnd = map$$1[i + 1];
+      if (ch < mStart) {
+        start = 0; end = 1;
+        collapse = "left";
+      } else if (ch < mEnd) {
+        start = ch - mStart;
+        end = start + 1;
+      } else if (i == map$$1.length - 3 || ch == mEnd && map$$1[i + 3] > ch) {
+        end = mEnd - mStart;
+        start = end - 1;
+        if (ch >= mEnd) { collapse = "right"; }
+      }
+      if (start != null) {
+        node = map$$1[i + 2];
+        if (mStart == mEnd && bias == (node.insertLeft ? "left" : "right"))
+          { collapse = bias; }
+        if (bias == "left" && start == 0)
+          { while (i && map$$1[i - 2] == map$$1[i - 3] && map$$1[i - 1].insertLeft) {
+            node = map$$1[(i -= 3) + 2];
+            collapse = "left";
+          } }
+        if (bias == "right" && start == mEnd - mStart)
+          { while (i < map$$1.length - 3 && map$$1[i + 3] == map$$1[i + 4] && !map$$1[i + 5].insertLeft) {
+            node = map$$1[(i += 3) + 2];
+            collapse = "right";
+          } }
+        break
+      }
+    }
+    return {node: node, start: start, end: end, collapse: collapse, coverStart: mStart, coverEnd: mEnd}
+  }
+
+  function getUsefulRect(rects, bias) {
+    var rect = nullRect;
+    if (bias == "left") { for (var i = 0; i < rects.length; i++) {
+      if ((rect = rects[i]).left != rect.right) { break }
+    } } else { for (var i$1 = rects.length - 1; i$1 >= 0; i$1--) {
+      if ((rect = rects[i$1]).left != rect.right) { break }
+    } }
+    return rect
+  }
+
+  function measureCharInner(cm, prepared, ch, bias) {
+    var place = nodeAndOffsetInLineMap(prepared.map, ch, bias);
+    var node = place.node, start = place.start, end = place.end, collapse = place.collapse;
+
+    var rect;
+    if (node.nodeType == 3) { // If it is a text node, use a range to retrieve the coordinates.
+      for (var i$1 = 0; i$1 < 4; i$1++) { // Retry a maximum of 4 times when nonsense rectangles are returned
+        while (start && isExtendingChar(prepared.line.text.charAt(place.coverStart + start))) { --start; }
+        while (place.coverStart + end < place.coverEnd && isExtendingChar(prepared.line.text.charAt(place.coverStart + end))) { ++end; }
+        if (ie && ie_version < 9 && start == 0 && end == place.coverEnd - place.coverStart)
+          { rect = node.parentNode.getBoundingClientRect(); }
+        else
+          { rect = getUsefulRect(range(node, start, end).getClientRects(), bias); }
+        if (rect.left || rect.right || start == 0) { break }
+        end = start;
+        start = start - 1;
+        collapse = "right";
+      }
+      if (ie && ie_version < 11) { rect = maybeUpdateRectForZooming(cm.display.measure, rect); }
+    } else { // If it is a widget, simply get the box for the whole widget.
+      if (start > 0) { collapse = bias = "right"; }
+      var rects;
+      if (cm.options.lineWrapping && (rects = node.getClientRects()).length > 1)
+        { rect = rects[bias == "right" ? rects.length - 1 : 0]; }
+      else
+        { rect = node.getBoundingClientRect(); }
+    }
+    if (ie && ie_version < 9 && !start && (!rect || !rect.left && !rect.right)) {
+      var rSpan = node.parentNode.getClientRects()[0];
+      if (rSpan)
+        { rect = {left: rSpan.left, right: rSpan.left + charWidth(cm.display), top: rSpan.top, bottom: rSpan.bottom}; }
+      else
+        { rect = nullRect; }
+    }
+
+    var rtop = rect.top - prepared.rect.top, rbot = rect.bottom - prepared.rect.top;
+    var mid = (rtop + rbot) / 2;
+    var heights = prepared.view.measure.heights;
+    var i = 0;
+    for (; i < heights.length - 1; i++)
+      { if (mid < heights[i]) { break } }
+    var top = i ? heights[i - 1] : 0, bot = heights[i];
+    var result = {left: (collapse == "right" ? rect.right : rect.left) - prepared.rect.left,
+                  right: (collapse == "left" ? rect.left : rect.right) - prepared.rect.left,
+                  top: top, bottom: bot};
+    if (!rect.left && !rect.right) { result.bogus = true; }
+    if (!cm.options.singleCursorHeightPerLine) { result.rtop = rtop; result.rbottom = rbot; }
+
+    return result
+  }
+
+  // Work around problem with bounding client rects on ranges being
+  // returned incorrectly when zoomed on IE10 and below.
+  function maybeUpdateRectForZooming(measure, rect) {
+    if (!window.screen || screen.logicalXDPI == null ||
+        screen.logicalXDPI == screen.deviceXDPI || !hasBadZoomedRects(measure))
+      { return rect }
+    var scaleX = screen.logicalXDPI / screen.deviceXDPI;
+    var scaleY = screen.logicalYDPI / screen.deviceYDPI;
+    return {left: rect.left * scaleX, right: rect.right * scaleX,
+            top: rect.top * scaleY, bottom: rect.bottom * scaleY}
+  }
+
+  function clearLineMeasurementCacheFor(lineView) {
+    if (lineView.measure) {
+      lineView.measure.cache = {};
+      lineView.measure.heights = null;
+      if (lineView.rest) { for (var i = 0; i < lineView.rest.length; i++)
+        { lineView.measure.caches[i] = {}; } }
+    }
+  }
+
+  function clearLineMeasurementCache(cm) {
+    cm.display.externalMeasure = null;
+    removeChildren(cm.display.lineMeasure);
+    for (var i = 0; i < cm.display.view.length; i++)
+      { clearLineMeasurementCacheFor(cm.display.view[i]); }
+  }
+
+  function clearCaches(cm) {
+    clearLineMeasurementCache(cm);
+    cm.display.cachedCharWidth = cm.display.cachedTextHeight = cm.display.cachedPaddingH = null;
+    if (!cm.options.lineWrapping) { cm.display.maxLineChanged = true; }
+    cm.display.lineNumChars = null;
+  }
+
+  function pageScrollX() {
+    // Work around https://bugs.chromium.org/p/chromium/issues/detail?id=489206
+    // which causes page_Offset and bounding client rects to use
+    // different reference viewports and invalidate our calculations.
+    if (chrome && android) { return -(document.body.getBoundingClientRect().left - parseInt(getComputedStyle(document.body).marginLeft)) }
+    return window.pageXOffset || (document.documentElement || document.body).scrollLeft
+  }
+  function pageScrollY() {
+    if (chrome && android) { return -(document.body.getBoundingClientRect().top - parseInt(getComputedStyle(document.body).marginTop)) }
+    return window.pageYOffset || (document.documentElement || document.body).scrollTop
+  }
+
+  function widgetTopHeight(lineObj) {
+    var height = 0;
+    if (lineObj.widgets) { for (var i = 0; i < lineObj.widgets.length; ++i) { if (lineObj.widgets[i].above)
+      { height += widgetHeight(lineObj.widgets[i]); } } }
+    return height
+  }
+
+  // Converts a {top, bottom, left, right} box from line-local
+  // coordinates into another coordinate system. Context may be one of
+  // "line", "div" (display.lineDiv), "local"./null (editor), "window",
+  // or "page".
+  function intoCoordSystem(cm, lineObj, rect, context, includeWidgets) {
+    if (!includeWidgets) {
+      var height = widgetTopHeight(lineObj);
+      rect.top += height; rect.bottom += height;
+    }
+    if (context == "line") { return rect }
+    if (!context) { context = "local"; }
+    var yOff = heightAtLine(lineObj);
+    if (context == "local") { yOff += paddingTop(cm.display); }
+    else { yOff -= cm.display.viewOffset; }
+    if (context == "page" || context == "window") {
+      var lOff = cm.display.lineSpace.getBoundingClientRect();
+      yOff += lOff.top + (context == "window" ? 0 : pageScrollY());
+      var xOff = lOff.left + (context == "window" ? 0 : pageScrollX());
+      rect.left += xOff; rect.right += xOff;
+    }
+    rect.top += yOff; rect.bottom += yOff;
+    return rect
+  }
+
+  // Coverts a box from "div" coords to another coordinate system.
+  // Context may be "window", "page", "div", or "local"./null.
+  function fromCoordSystem(cm, coords, context) {
+    if (context == "div") { return coords }
+    var left = coords.left, top = coords.top;
+    // First move into "page" coordinate system
+    if (context == "page") {
+      left -= pageScrollX();
+      top -= pageScrollY();
+    } else if (context == "local" || !context) {
+      var localBox = cm.display.sizer.getBoundingClientRect();
+      left += localBox.left;
+      top += localBox.top;
+    }
+
+    var lineSpaceBox = cm.display.lineSpace.getBoundingClientRect();
+    return {left: left - lineSpaceBox.left, top: top - lineSpaceBox.top}
+  }
+
+  function charCoords(cm, pos, context, lineObj, bias) {
+    if (!lineObj) { lineObj = getLine(cm.doc, pos.line); }
+    return intoCoordSystem(cm, lineObj, measureChar(cm, lineObj, pos.ch, bias), context)
+  }
+
+  // Returns a box for a given cursor position, which may have an
+  // 'other' property containing the position of the secondary cursor
+  // on a bidi boundary.
+  // A cursor Pos(line, char, "before") is on the same visual line as `char - 1`
+  // and after `char - 1` in writing order of `char - 1`
+  // A cursor Pos(line, char, "after") is on the same visual line as `char`
+  // and before `char` in writing order of `char`
+  // Examples (upper-case letters are RTL, lower-case are LTR):
+  //     Pos(0, 1, ...)
+  //     before   after
+  // ab     a|b     a|b
+  // aB     a|B     aB|
+  // Ab     |Ab     A|b
+  // AB     B|A     B|A
+  // Every position after the last character on a line is considered to stick
+  // to the last character on the line.
+  function cursorCoords(cm, pos, context, lineObj, preparedMeasure, varHeight) {
+    lineObj = lineObj || getLine(cm.doc, pos.line);
+    if (!preparedMeasure) { preparedMeasure = prepareMeasureForLine(cm, lineObj); }
+    function get(ch, right) {
+      var m = measureCharPrepared(cm, preparedMeasure, ch, right ? "right" : "left", varHeight);
+      if (right) { m.left = m.right; } else { m.right = m.left; }
+      return intoCoordSystem(cm, lineObj, m, context)
+    }
+    var order = getOrder(lineObj, cm.doc.direction), ch = pos.ch, sticky = pos.sticky;
+    if (ch >= lineObj.text.length) {
+      ch = lineObj.text.length;
+      sticky = "before";
+    } else if (ch <= 0) {
+      ch = 0;
+      sticky = "after";
+    }
+    if (!order) { return get(sticky == "before" ? ch - 1 : ch, sticky == "before") }
+
+    function getBidi(ch, partPos, invert) {
+      var part = order[partPos], right = part.level == 1;
+      return get(invert ? ch - 1 : ch, right != invert)
+    }
+    var partPos = getBidiPartAt(order, ch, sticky);
+    var other = bidiOther;
+    var val = getBidi(ch, partPos, sticky == "before");
+    if (other != null) { val.other = getBidi(ch, other, sticky != "before"); }
+    return val
+  }
+
+  // Used to cheaply estimate the coordinates for a position. Used for
+  // intermediate scroll updates.
+  function estimateCoords(cm, pos) {
+    var left = 0;
+    pos = clipPos(cm.doc, pos);
+    if (!cm.options.lineWrapping) { left = charWidth(cm.display) * pos.ch; }
+    var lineObj = getLine(cm.doc, pos.line);
+    var top = heightAtLine(lineObj) + paddingTop(cm.display);
+    return {left: left, right: left, top: top, bottom: top + lineObj.height}
+  }
+
+  // Positions returned by coordsChar contain some extra information.
+  // xRel is the relative x position of the input coordinates compared
+  // to the found position (so xRel > 0 means the coordinates are to
+  // the right of the character position, for example). When outside
+  // is true, that means the coordinates lie outside the line's
+  // vertical range.
+  function PosWithInfo(line, ch, sticky, outside, xRel) {
+    var pos = Pos(line, ch, sticky);
+    pos.xRel = xRel;
+    if (outside) { pos.outside = outside; }
+    return pos
+  }
+
+  // Compute the character position closest to the given coordinates.
+  // Input must be lineSpace-local ("div" coordinate system).
+  function coordsChar(cm, x, y) {
+    var doc = cm.doc;
+    y += cm.display.viewOffset;
+    if (y < 0) { return PosWithInfo(doc.first, 0, null, -1, -1) }
+    var lineN = lineAtHeight(doc, y), last = doc.first + doc.size - 1;
+    if (lineN > last)
+      { return PosWithInfo(doc.first + doc.size - 1, getLine(doc, last).text.length, null, 1, 1) }
+    if (x < 0) { x = 0; }
+
+    var lineObj = getLine(doc, lineN);
+    for (;;) {
+      var found = coordsCharInner(cm, lineObj, lineN, x, y);
+      var collapsed = collapsedSpanAround(lineObj, found.ch + (found.xRel > 0 || found.outside > 0 ? 1 : 0));
+      if (!collapsed) { return found }
+      var rangeEnd = collapsed.find(1);
+      if (rangeEnd.line == lineN) { return rangeEnd }
+      lineObj = getLine(doc, lineN = rangeEnd.line);
+    }
+  }
+
+  function wrappedLineExtent(cm, lineObj, preparedMeasure, y) {
+    y -= widgetTopHeight(lineObj);
+    var end = lineObj.text.length;
+    var begin = findFirst(function (ch) { return measureCharPrepared(cm, preparedMeasure, ch - 1).bottom <= y; }, end, 0);
+    end = findFirst(function (ch) { return measureCharPrepared(cm, preparedMeasure, ch).top > y; }, begin, end);
+    return {begin: begin, end: end}
+  }
+
+  function wrappedLineExtentChar(cm, lineObj, preparedMeasure, target) {
+    if (!preparedMeasure) { preparedMeasure = prepareMeasureForLine(cm, lineObj); }
+    var targetTop = intoCoordSystem(cm, lineObj, measureCharPrepared(cm, preparedMeasure, target), "line").top;
+    return wrappedLineExtent(cm, lineObj, preparedMeasure, targetTop)
+  }
+
+  // Returns true if the given side of a box is after the given
+  // coordinates, in top-to-bottom, left-to-right order.
+  function boxIsAfter(box, x, y, left) {
+    return box.bottom <= y ? false : box.top > y ? true : (left ? box.left : box.right) > x
+  }
+
+  function coordsCharInner(cm, lineObj, lineNo$$1, x, y) {
+    // Move y into line-local coordinate space
+    y -= heightAtLine(lineObj);
+    var preparedMeasure = prepareMeasureForLine(cm, lineObj);
+    // When directly calling `measureCharPrepared`, we have to adjust
+    // for the widgets at this line.
+    var widgetHeight$$1 = widgetTopHeight(lineObj);
+    var begin = 0, end = lineObj.text.length, ltr = true;
+
+    var order = getOrder(lineObj, cm.doc.direction);
+    // If the line isn't plain left-to-right text, first figure out
+    // which bidi section the coordinates fall into.
+    if (order) {
+      var part = (cm.options.lineWrapping ? coordsBidiPartWrapped : coordsBidiPart)
+                   (cm, lineObj, lineNo$$1, preparedMeasure, order, x, y);
+      ltr = part.level != 1;
+      // The awkward -1 offsets are needed because findFirst (called
+      // on these below) will treat its first bound as inclusive,
+      // second as exclusive, but we want to actually address the
+      // characters in the part's range
+      begin = ltr ? part.from : part.to - 1;
+      end = ltr ? part.to : part.from - 1;
+    }
+
+    // A binary search to find the first character whose bounding box
+    // starts after the coordinates. If we run across any whose box wrap
+    // the coordinates, store that.
+    var chAround = null, boxAround = null;
+    var ch = findFirst(function (ch) {
+      var box = measureCharPrepared(cm, preparedMeasure, ch);
+      box.top += widgetHeight$$1; box.bottom += widgetHeight$$1;
+      if (!boxIsAfter(box, x, y, false)) { return false }
+      if (box.top <= y && box.left <= x) {
+        chAround = ch;
+        boxAround = box;
+      }
+      return true
+    }, begin, end);
+
+    var baseX, sticky, outside = false;
+    // If a box around the coordinates was found, use that
+    if (boxAround) {
+      // Distinguish coordinates nearer to the left or right side of the box
+      var atLeft = x - boxAround.left < boxAround.right - x, atStart = atLeft == ltr;
+      ch = chAround + (atStart ? 0 : 1);
+      sticky = atStart ? "after" : "before";
+      baseX = atLeft ? boxAround.left : boxAround.right;
+    } else {
+      // (Adjust for extended bound, if necessary.)
+      if (!ltr && (ch == end || ch == begin)) { ch++; }
+      // To determine which side to associate with, get the box to the
+      // left of the character and compare it's vertical position to the
+      // coordinates
+      sticky = ch == 0 ? "after" : ch == lineObj.text.length ? "before" :
+        (measureCharPrepared(cm, preparedMeasure, ch - (ltr ? 1 : 0)).bottom + widgetHeight$$1 <= y) == ltr ?
+        "after" : "before";
+      // Now get accurate coordinates for this place, in order to get a
+      // base X position
+      var coords = cursorCoords(cm, Pos(lineNo$$1, ch, sticky), "line", lineObj, preparedMeasure);
+      baseX = coords.left;
+      outside = y < coords.top ? -1 : y >= coords.bottom ? 1 : 0;
+    }
+
+    ch = skipExtendingChars(lineObj.text, ch, 1);
+    return PosWithInfo(lineNo$$1, ch, sticky, outside, x - baseX)
+  }
+
+  function coordsBidiPart(cm, lineObj, lineNo$$1, preparedMeasure, order, x, y) {
+    // Bidi parts are sorted left-to-right, and in a non-line-wrapping
+    // situation, we can take this ordering to correspond to the visual
+    // ordering. This finds the first part whose end is after the given
+    // coordinates.
+    var index = findFirst(function (i) {
+      var part = order[i], ltr = part.level != 1;
+      return boxIsAfter(cursorCoords(cm, Pos(lineNo$$1, ltr ? part.to : part.from, ltr ? "before" : "after"),
+                                     "line", lineObj, preparedMeasure), x, y, true)
+    }, 0, order.length - 1);
+    var part = order[index];
+    // If this isn't the first part, the part's start is also after
+    // the coordinates, and the coordinates aren't on the same line as
+    // that start, move one part back.
+    if (index > 0) {
+      var ltr = part.level != 1;
+      var start = cursorCoords(cm, Pos(lineNo$$1, ltr ? part.from : part.to, ltr ? "after" : "before"),
+                               "line", lineObj, preparedMeasure);
+      if (boxIsAfter(start, x, y, true) && start.top > y)
+        { part = order[index - 1]; }
+    }
+    return part
+  }
+
+  function coordsBidiPartWrapped(cm, lineObj, _lineNo, preparedMeasure, order, x, y) {
+    // In a wrapped line, rtl text on wrapping boundaries can do things
+    // that don't correspond to the ordering in our `order` array at
+    // all, so a binary search doesn't work, and we want to return a
+    // part that only spans one line so that the binary search in
+    // coordsCharInner is safe. As such, we first find the extent of the
+    // wrapped line, and then do a flat search in which we discard any
+    // spans that aren't on the line.
+    var ref = wrappedLineExtent(cm, lineObj, preparedMeasure, y);
+    var begin = ref.begin;
+    var end = ref.end;
+    if (/\s/.test(lineObj.text.charAt(end - 1))) { end--; }
+    var part = null, closestDist = null;
+    for (var i = 0; i < order.length; i++) {
+      var p = order[i];
+      if (p.from >= end || p.to <= begin) { continue }
+      var ltr = p.level != 1;
+      var endX = measureCharPrepared(cm, preparedMeasure, ltr ? Math.min(end, p.to) - 1 : Math.max(begin, p.from)).right;
+      // Weigh against spans ending before this, so that they are only
+      // picked if nothing ends after
+      var dist = endX < x ? x - endX + 1e9 : endX - x;
+      if (!part || closestDist > dist) {
+        part = p;
+        closestDist = dist;
+      }
+    }
+    if (!part) { part = order[order.length - 1]; }
+    // Clip the part to the wrapped line.
+    if (part.from < begin) { part = {from: begin, to: part.to, level: part.level}; }
+    if (part.to > end) { part = {from: part.from, to: end, level: part.level}; }
+    return part
+  }
+
+  var measureText;
+  // Compute the default text height.
+  function textHeight(display) {
+    if (display.cachedTextHeight != null) { return display.cachedTextHeight }
+    if (measureText == null) {
+      measureText = elt("pre", null, "CodeMirror-line-like");
+      // Measure a bunch of lines, for browsers that compute
+      // fractional heights.
+      for (var i = 0; i < 49; ++i) {
+        measureText.appendChild(document.createTextNode("x"));
+        measureText.appendChild(elt("br"));
+      }
+      measureText.appendChild(document.createTextNode("x"));
+    }
+    removeChildrenAndAdd(display.measure, measureText);
+    var height = measureText.offsetHeight / 50;
+    if (height > 3) { display.cachedTextHeight = height; }
+    removeChildren(display.measure);
+    return height || 1
+  }
+
+  // Compute the default character width.
+  function charWidth(display) {
+    if (display.cachedCharWidth != null) { return display.cachedCharWidth }
+    var anchor = elt("span", "xxxxxxxxxx");
+    var pre = elt("pre", [anchor], "CodeMirror-line-like");
+    removeChildrenAndAdd(display.measure, pre);
+    var rect = anchor.getBoundingClientRect(), width = (rect.right - rect.left) / 10;
+    if (width > 2) { display.cachedCharWidth = width; }
+    return width || 10
+  }
+
+  // Do a bulk-read of the DOM positions and sizes needed to draw the
+  // view, so that we don't interleave reading and writing to the DOM.
+  function getDimensions(cm) {
+    var d = cm.display, left = {}, width = {};
+    var gutterLeft = d.gutters.clientLeft;
+    for (var n = d.gutters.firstChild, i = 0; n; n = n.nextSibling, ++i) {
+      var id = cm.display.gutterSpecs[i].className;
+      left[id] = n.offsetLeft + n.clientLeft + gutterLeft;
+      width[id] = n.clientWidth;
+    }
+    return {fixedPos: compensateForHScroll(d),
+            gutterTotalWidth: d.gutters.offsetWidth,
+            gutterLeft: left,
+            gutterWidth: width,
+            wrapperWidth: d.wrapper.clientWidth}
+  }
+
+  // Computes display.scroller.scrollLeft + display.gutters.offsetWidth,
+  // but using getBoundingClientRect to get a sub-pixel-accurate
+  // result.
+  function compensateForHScroll(display) {
+    return display.scroller.getBoundingClientRect().left - display.sizer.getBoundingClientRect().left
+  }
+
+  // Returns a function that estimates the height of a line, to use as
+  // first approximation until the line becomes visible (and is thus
+  // properly measurable).
+  function estimateHeight(cm) {
+    var th = textHeight(cm.display), wrapping = cm.options.lineWrapping;
+    var perLine = wrapping && Math.max(5, cm.display.scroller.clientWidth / charWidth(cm.display) - 3);
+    return function (line) {
+      if (lineIsHidden(cm.doc, line)) { return 0 }
+
+      var widgetsHeight = 0;
+      if (line.widgets) { for (var i = 0; i < line.widgets.length; i++) {
+        if (line.widgets[i].height) { widgetsHeight += line.widgets[i].height; }
+      } }
+
+      if (wrapping)
+        { return widgetsHeight + (Math.ceil(line.text.length / perLine) || 1) * th }
+      else
+        { return widgetsHeight + th }
+    }
+  }
+
+  function estimateLineHeights(cm) {
+    var doc = cm.doc, est = estimateHeight(cm);
+    doc.iter(function (line) {
+      var estHeight = est(line);
+      if (estHeight != line.height) { updateLineHeight(line, estHeight); }
+    });
+  }
+
+  // Given a mouse event, find the corresponding position. If liberal
+  // is false, it checks whether a gutter or scrollbar was clicked,
+  // and returns null if it was. forRect is used by rectangular
+  // selections, and tries to estimate a character position even for
+  // coordinates beyond the right of the text.
+  function posFromMouse(cm, e, liberal, forRect) {
+    var display = cm.display;
+    if (!liberal && e_target(e).getAttribute("cm-not-content") == "true") { return null }
+
+    var x, y, space = display.lineSpace.getBoundingClientRect();
+    // Fails unpredictably on IE[67] when mouse is dragged around quickly.
+    try { x = e.clientX - space.left; y = e.clientY - space.top; }
+    catch (e) { return null }
+    var coords = coordsChar(cm, x, y), line;
+    if (forRect && coords.xRel == 1 && (line = getLine(cm.doc, coords.line).text).length == coords.ch) {
+      var colDiff = countColumn(line, line.length, cm.options.tabSize) - line.length;
+      coords = Pos(coords.line, Math.max(0, Math.round((x - paddingH(cm.display).left) / charWidth(cm.display)) - colDiff));
+    }
+    return coords
+  }
+
+  // Find the view element corresponding to a given line. Return null
+  // when the line isn't visible.
+  function findViewIndex(cm, n) {
+    if (n >= cm.display.viewTo) { return null }
+    n -= cm.display.viewFrom;
+    if (n < 0) { return null }
+    var view = cm.display.view;
+    for (var i = 0; i < view.length; i++) {
+      n -= view[i].size;
+      if (n < 0) { return i }
+    }
+  }
+
+  // Updates the display.view data structure for a given change to the
+  // document. From and to are in pre-change coordinates. Lendiff is
+  // the amount of lines added or subtracted by the change. This is
+  // used for changes that span multiple lines, or change the way
+  // lines are divided into visual lines. regLineChange (below)
+  // registers single-line changes.
+  function regChange(cm, from, to, lendiff) {
+    if (from == null) { from = cm.doc.first; }
+    if (to == null) { to = cm.doc.first + cm.doc.size; }
+    if (!lendiff) { lendiff = 0; }
+
+    var display = cm.display;
+    if (lendiff && to < display.viewTo &&
+        (display.updateLineNumbers == null || display.updateLineNumbers > from))
+      { display.updateLineNumbers = from; }
+
+    cm.curOp.viewChanged = true;
+
+    if (from >= display.viewTo) { // Change after
+      if (sawCollapsedSpans && visualLineNo(cm.doc, from) < display.viewTo)
+        { resetView(cm); }
+    } else if (to <= display.viewFrom) { // Change before
+      if (sawCollapsedSpans && visualLineEndNo(cm.doc, to + lendiff) > display.viewFrom) {
+        resetView(cm);
+      } else {
+        display.viewFrom += lendiff;
+        display.viewTo += lendiff;
+      }
+    } else if (from <= display.viewFrom && to >= display.viewTo) { // Full overlap
+      resetView(cm);
+    } else if (from <= display.viewFrom) { // Top overlap
+      var cut = viewCuttingPoint(cm, to, to + lendiff, 1);
+      if (cut) {
+        display.view = display.view.slice(cut.index);
+        display.viewFrom = cut.lineN;
+        display.viewTo += lendiff;
+      } else {
+        resetView(cm);
+      }
+    } else if (to >= display.viewTo) { // Bottom overlap
+      var cut$1 = viewCuttingPoint(cm, from, from, -1);
+      if (cut$1) {
+        display.view = display.view.slice(0, cut$1.index);
+        display.viewTo = cut$1.lineN;
+      } else {
+        resetView(cm);
+      }
+    } else { // Gap in the middle
+      var cutTop = viewCuttingPoint(cm, from, from, -1);
+      var cutBot = viewCuttingPoint(cm, to, to + lendiff, 1);
+      if (cutTop && cutBot) {
+        display.view = display.view.slice(0, cutTop.index)
+          .concat(buildViewArray(cm, cutTop.lineN, cutBot.lineN))
+          .concat(display.view.slice(cutBot.index));
+        display.viewTo += lendiff;
+      } else {
+        resetView(cm);
+      }
+    }
+
+    var ext = display.externalMeasured;
+    if (ext) {
+      if (to < ext.lineN)
+        { ext.lineN += lendiff; }
+      else if (from < ext.lineN + ext.size)
+        { display.externalMeasured = null; }
+    }
+  }
+
+  // Register a change to a single line. Type must be one of "text",
+  // "gutter", "class", "widget"
+  function regLineChange(cm, line, type) {
+    cm.curOp.viewChanged = true;
+    var display = cm.display, ext = cm.display.externalMeasured;
+    if (ext && line >= ext.lineN && line < ext.lineN + ext.size)
+      { display.externalMeasured = null; }
+
+    if (line < display.viewFrom || line >= display.viewTo) { return }
+    var lineView = display.view[findViewIndex(cm, line)];
+    if (lineView.node == null) { return }
+    var arr = lineView.changes || (lineView.changes = []);
+    if (indexOf(arr, type) == -1) { arr.push(type); }
+  }
+
+  // Clear the view.
+  function resetView(cm) {
+    cm.display.viewFrom = cm.display.viewTo = cm.doc.first;
+    cm.display.view = [];
+    cm.display.viewOffset = 0;
+  }
+
+  function viewCuttingPoint(cm, oldN, newN, dir) {
+    var index = findViewIndex(cm, oldN), diff, view = cm.display.view;
+    if (!sawCollapsedSpans || newN == cm.doc.first + cm.doc.size)
+      { return {index: index, lineN: newN} }
+    var n = cm.display.viewFrom;
+    for (var i = 0; i < index; i++)
+      { n += view[i].size; }
+    if (n != oldN) {
+      if (dir > 0) {
+        if (index == view.length - 1) { return null }
+        diff = (n + view[index].size) - oldN;
+        index++;
+      } else {
+        diff = n - oldN;
+      }
+      oldN += diff; newN += diff;
+    }
+    while (visualLineNo(cm.doc, newN) != newN) {
+      if (index == (dir < 0 ? 0 : view.length - 1)) { return null }
+      newN += dir * view[index - (dir < 0 ? 1 : 0)].size;
+      index += dir;
+    }
+    return {index: index, lineN: newN}
+  }
+
+  // Force the view to cover a given range, adding empty view element
+  // or clipping off existing ones as needed.
+  function adjustView(cm, from, to) {
+    var display = cm.display, view = display.view;
+    if (view.length == 0 || from >= display.viewTo || to <= display.viewFrom) {
+      display.view = buildViewArray(cm, from, to);
+      display.viewFrom = from;
+    } else {
+      if (display.viewFrom > from)
+        { display.view = buildViewArray(cm, from, display.viewFrom).concat(display.view); }
+      else if (display.viewFrom < from)
+        { display.view = display.view.slice(findViewIndex(cm, from)); }
+      display.viewFrom = from;
+      if (display.viewTo < to)
+        { display.view = display.view.concat(buildViewArray(cm, display.viewTo, to)); }
+      else if (display.viewTo > to)
+        { display.view = display.view.slice(0, findViewIndex(cm, to)); }
+    }
+    display.viewTo = to;
+  }
+
+  // Count the number of lines in the view whose DOM representation is
+  // out of date (or nonexistent).
+  function countDirtyView(cm) {
+    var view = cm.display.view, dirty = 0;
+    for (var i = 0; i < view.length; i++) {
+      var lineView = view[i];
+      if (!lineView.hidden && (!lineView.node || lineView.changes)) { ++dirty; }
+    }
+    return dirty
+  }
+
+  function updateSelection(cm) {
+    cm.display.input.showSelection(cm.display.input.prepareSelection());
+  }
+
+  function prepareSelection(cm, primary) {
+    if ( primary === void 0 ) primary = true;
+
+    var doc = cm.doc, result = {};
+    var curFragment = result.cursors = document.createDocumentFragment();
+    var selFragment = result.selection = document.createDocumentFragment();
+
+    for (var i = 0; i < doc.sel.ranges.length; i++) {
+      if (!primary && i == doc.sel.primIndex) { continue }
+      var range$$1 = doc.sel.ranges[i];
+      if (range$$1.from().line >= cm.display.viewTo || range$$1.to().line < cm.display.viewFrom) { continue }
+      var collapsed = range$$1.empty();
+      if (collapsed || cm.options.showCursorWhenSelecting)
+        { drawSelectionCursor(cm, range$$1.head, curFragment); }
+      if (!collapsed)
+        { drawSelectionRange(cm, range$$1, selFragment); }
+    }
+    return result
+  }
+
+  // Draws a cursor for the given range
+  function drawSelectionCursor(cm, head, output) {
+    var pos = cursorCoords(cm, head, "div", null, null, !cm.options.singleCursorHeightPerLine);
+
+    var cursor = output.appendChild(elt("div", "\u00a0", "CodeMirror-cursor"));
+    cursor.style.left = pos.left + "px";
+    cursor.style.top = pos.top + "px";
+    cursor.style.height = Math.max(0, pos.bottom - pos.top) * cm.options.cursorHeight + "px";
+
+    if (pos.other) {
+      // Secondary cursor, shown when on a 'jump' in bi-directional text
+      var otherCursor = output.appendChild(elt("div", "\u00a0", "CodeMirror-cursor CodeMirror-secondarycursor"));
+      otherCursor.style.display = "";
+      otherCursor.style.left = pos.other.left + "px";
+      otherCursor.style.top = pos.other.top + "px";
+      otherCursor.style.height = (pos.other.bottom - pos.other.top) * .85 + "px";
+    }
+  }
+
+  function cmpCoords(a, b) { return a.top - b.top || a.left - b.left }
+
+  // Draws the given range as a highlighted selection
+  function drawSelectionRange(cm, range$$1, output) {
+    var display = cm.display, doc = cm.doc;
+    var fragment = document.createDocumentFragment();
+    var padding = paddingH(cm.display), leftSide = padding.left;
+    var rightSide = Math.max(display.sizerWidth, displayWidth(cm) - display.sizer.offsetLeft) - padding.right;
+    var docLTR = doc.direction == "ltr";
+
+    function add(left, top, width, bottom) {
+      if (top < 0) { top = 0; }
+      top = Math.round(top);
+      bottom = Math.round(bottom);
+      fragment.appendChild(elt("div", null, "CodeMirror-selected", ("position: absolute; left: " + left + "px;\n                             top: " + top + "px; width: " + (width == null ? rightSide - left : width) + "px;\n                             height: " + (bottom - top) + "px")));
+    }
+
+    function drawForLine(line, fromArg, toArg) {
+      var lineObj = getLine(doc, line);
+      var lineLen = lineObj.text.length;
+      var start, end;
+      function coords(ch, bias) {
+        return charCoords(cm, Pos(line, ch), "div", lineObj, bias)
+      }
+
+      function wrapX(pos, dir, side) {
+        var extent = wrappedLineExtentChar(cm, lineObj, null, pos);
+        var prop = (dir == "ltr") == (side == "after") ? "left" : "right";
+        var ch = side == "after" ? extent.begin : extent.end - (/\s/.test(lineObj.text.charAt(extent.end - 1)) ? 2 : 1);
+        return coords(ch, prop)[prop]
+      }
+
+      var order = getOrder(lineObj, doc.direction);
+      iterateBidiSections(order, fromArg || 0, toArg == null ? lineLen : toArg, function (from, to, dir, i) {
+        var ltr = dir == "ltr";
+        var fromPos = coords(from, ltr ? "left" : "right");
+        var toPos = coords(to - 1, ltr ? "right" : "left");
+
+        var openStart = fromArg == null && from == 0, openEnd = toArg == null && to == lineLen;
+        var first = i == 0, last = !order || i == order.length - 1;
+        if (toPos.top - fromPos.top <= 3) { // Single line
+          var openLeft = (docLTR ? openStart : openEnd) && first;
+          var openRight = (docLTR ? openEnd : openStart) && last;
+          var left = openLeft ? leftSide : (ltr ? fromPos : toPos).left;
+          var right = openRight ? rightSide : (ltr ? toPos : fromPos).right;
+          add(left, fromPos.top, right - left, fromPos.bottom);
+        } else { // Multiple lines
+          var topLeft, topRight, botLeft, botRight;
+          if (ltr) {
+            topLeft = docLTR && openStart && first ? leftSide : fromPos.left;
+            topRight = docLTR ? rightSide : wrapX(from, dir, "before");
+            botLeft = docLTR ? leftSide : wrapX(to, dir, "after");
+            botRight = docLTR && openEnd && last ? rightSide : toPos.right;
+          } else {
+            topLeft = !docLTR ? leftSide : wrapX(from, dir, "before");
+            topRight = !docLTR && openStart && first ? rightSide : fromPos.right;
+            botLeft = !docLTR && openEnd && last ? leftSide : toPos.left;
+            botRight = !docLTR ? rightSide : wrapX(to, dir, "after");
+          }
+          add(topLeft, fromPos.top, topRight - topLeft, fromPos.bottom);
+          if (fromPos.bottom < toPos.top) { add(leftSide, fromPos.bottom, null, toPos.top); }
+          add(botLeft, toPos.top, botRight - botLeft, toPos.bottom);
+        }
+
+        if (!start || cmpCoords(fromPos, start) < 0) { start = fromPos; }
+        if (cmpCoords(toPos, start) < 0) { start = toPos; }
+        if (!end || cmpCoords(fromPos, end) < 0) { end = fromPos; }
+        if (cmpCoords(toPos, end) < 0) { end = toPos; }
+      });
+      return {start: start, end: end}
+    }
+
+    var sFrom = range$$1.from(), sTo = range$$1.to();
+    if (sFrom.line == sTo.line) {
+      drawForLine(sFrom.line, sFrom.ch, sTo.ch);
+    } else {
+      var fromLine = getLine(doc, sFrom.line), toLine = getLine(doc, sTo.line);
+      var singleVLine = visualLine(fromLine) == visualLine(toLine);
+      var leftEnd = drawForLine(sFrom.line, sFrom.ch, singleVLine ? fromLine.text.length + 1 : null).end;
+      var rightStart = drawForLine(sTo.line, singleVLine ? 0 : null, sTo.ch).start;
+      if (singleVLine) {
+        if (leftEnd.top < rightStart.top - 2) {
+          add(leftEnd.right, leftEnd.top, null, leftEnd.bottom);
+          add(leftSide, rightStart.top, rightStart.left, rightStart.bottom);
+        } else {
+          add(leftEnd.right, leftEnd.top, rightStart.left - leftEnd.right, leftEnd.bottom);
+        }
+      }
+      if (leftEnd.bottom < rightStart.top)
+        { add(leftSide, leftEnd.bottom, null, rightStart.top); }
+    }
+
+    output.appendChild(fragment);
+  }
+
+  // Cursor-blinking
+  function restartBlink(cm) {
+    if (!cm.state.focused) { return }
+    var display = cm.display;
+    clearInterval(display.blinker);
+    var on = true;
+    display.cursorDiv.style.visibility = "";
+    if (cm.options.cursorBlinkRate > 0)
+      { display.blinker = setInterval(function () { return display.cursorDiv.style.visibility = (on = !on) ? "" : "hidden"; },
+        cm.options.cursorBlinkRate); }
+    else if (cm.options.cursorBlinkRate < 0)
+      { display.cursorDiv.style.visibility = "hidden"; }
+  }
+
+  function ensureFocus(cm) {
+    if (!cm.state.focused) { cm.display.input.focus(); onFocus(cm); }
+  }
+
+  function delayBlurEvent(cm) {
+    cm.state.delayingBlurEvent = true;
+    setTimeout(function () { if (cm.state.delayingBlurEvent) {
+      cm.state.delayingBlurEvent = false;
+      onBlur(cm);
+    } }, 100);
+  }
+
+  function onFocus(cm, e) {
+    if (cm.state.delayingBlurEvent) { cm.state.delayingBlurEvent = false; }
+
+    if (cm.options.readOnly == "nocursor") { return }
+    if (!cm.state.focused) {
+      signal(cm, "focus", cm, e);
+      cm.state.focused = true;
+      addClass(cm.display.wrapper, "CodeMirror-focused");
+      // This test prevents this from firing when a context
+      // menu is closed (since the input reset would kill the
+      // select-all detection hack)
+      if (!cm.curOp && cm.display.selForContextMenu != cm.doc.sel) {
+        cm.display.input.reset();
+        if (webkit) { setTimeout(function () { return cm.display.input.reset(true); }, 20); } // Issue #1730
+      }
+      cm.display.input.receivedFocus();
+    }
+    restartBlink(cm);
+  }
+  function onBlur(cm, e) {
+    if (cm.state.delayingBlurEvent) { return }
+
+    if (cm.state.focused) {
+      signal(cm, "blur", cm, e);
+      cm.state.focused = false;
+      rmClass(cm.display.wrapper, "CodeMirror-focused");
+    }
+    clearInterval(cm.display.blinker);
+    setTimeout(function () { if (!cm.state.focused) { cm.display.shift = false; } }, 150);
+  }
+
+  // Read the actual heights of the rendered lines, and update their
+  // stored heights to match.
+  function updateHeightsInViewport(cm) {
+    var display = cm.display;
+    var prevBottom = display.lineDiv.offsetTop;
+    for (var i = 0; i < display.view.length; i++) {
+      var cur = display.view[i], wrapping = cm.options.lineWrapping;
+      var height = (void 0), width = 0;
+      if (cur.hidden) { continue }
+      if (ie && ie_version < 8) {
+        var bot = cur.node.offsetTop + cur.node.offsetHeight;
+        height = bot - prevBottom;
+        prevBottom = bot;
+      } else {
+        var box = cur.node.getBoundingClientRect();
+        height = box.bottom - box.top;
+        // Check that lines don't extend past the right of the current
+        // editor width
+        if (!wrapping && cur.text.firstChild)
+          { width = cur.text.firstChild.getBoundingClientRect().right - box.left - 1; }
+      }
+      var diff = cur.line.height - height;
+      if (diff > .005 || diff < -.005) {
+        updateLineHeight(cur.line, height);
+        updateWidgetHeight(cur.line);
+        if (cur.rest) { for (var j = 0; j < cur.rest.length; j++)
+          { updateWidgetHeight(cur.rest[j]); } }
+      }
+      if (width > cm.display.sizerWidth) {
+        var chWidth = Math.ceil(width / charWidth(cm.display));
+        if (chWidth > cm.display.maxLineLength) {
+          cm.display.maxLineLength = chWidth;
+          cm.display.maxLine = cur.line;
+          cm.display.maxLineChanged = true;
+        }
+      }
+    }
+  }
+
+  // Read and store the height of line widgets associated with the
+  // given line.
+  function updateWidgetHeight(line) {
+    if (line.widgets) { for (var i = 0; i < line.widgets.length; ++i) {
+      var w = line.widgets[i], parent = w.node.parentNode;
+      if (parent) { w.height = parent.offsetHeight; }
+    } }
+  }
+
+  // Compute the lines that are visible in a given viewport (defaults
+  // the the current scroll position). viewport may contain top,
+  // height, and ensure (see op.scrollToPos) properties.
+  function visibleLines(display, doc, viewport) {
+    var top = viewport && viewport.top != null ? Math.max(0, viewport.top) : display.scroller.scrollTop;
+    top = Math.floor(top - paddingTop(display));
+    var bottom = viewport && viewport.bottom != null ? viewport.bottom : top + display.wrapper.clientHeight;
+
+    var from = lineAtHeight(doc, top), to = lineAtHeight(doc, bottom);
+    // Ensure is a {from: {line, ch}, to: {line, ch}} object, and
+    // forces those lines into the viewport (if possible).
+    if (viewport && viewport.ensure) {
+      var ensureFrom = viewport.ensure.from.line, ensureTo = viewport.ensure.to.line;
+      if (ensureFrom < from) {
+        from = ensureFrom;
+        to = lineAtHeight(doc, heightAtLine(getLine(doc, ensureFrom)) + display.wrapper.clientHeight);
+      } else if (Math.min(ensureTo, doc.lastLine()) >= to) {
+        from = lineAtHeight(doc, heightAtLine(getLine(doc, ensureTo)) - display.wrapper.clientHeight);
+        to = ensureTo;
+      }
+    }
+    return {from: from, to: Math.max(to, from + 1)}
+  }
+
+  // SCROLLING THINGS INTO VIEW
+
+  // If an editor sits on the top or bottom of the window, partially
+  // scrolled out of view, this ensures that the cursor is visible.
+  function maybeScrollWindow(cm, rect) {
+    if (signalDOMEvent(cm, "scrollCursorIntoView")) { return }
+
+    var display = cm.display, box = display.sizer.getBoundingClientRect(), doScroll = null;
+    if (rect.top + box.top < 0) { doScroll = true; }
+    else if (rect.bottom + box.top > (window.innerHeight || document.documentElement.clientHeight)) { doScroll = false; }
+    if (doScroll != null && !phantom) {
+      var scrollNode = elt("div", "\u200b", null, ("position: absolute;\n                         top: " + (rect.top - display.viewOffset - paddingTop(cm.display)) + "px;\n                         height: " + (rect.bottom - rect.top + scrollGap(cm) + display.barHeight) + "px;\n                         left: " + (rect.left) + "px; width: " + (Math.max(2, rect.right - rect.left)) + "px;"));
+      cm.display.lineSpace.appendChild(scrollNode);
+      scrollNode.scrollIntoView(doScroll);
+      cm.display.lineSpace.removeChild(scrollNode);
+    }
+  }
+
+  // Scroll a given position into view (immediately), verifying that
+  // it actually became visible (as line heights are accurately
+  // measured, the position of something may 'drift' during drawing).
+  function scrollPosIntoView(cm, pos, end, margin) {
+    if (margin == null) { margin = 0; }
+    var rect;
+    if (!cm.options.lineWrapping && pos == end) {
+      // Set pos and end to the cursor positions around the character pos sticks to
+      // If pos.sticky == "before", that is around pos.ch - 1, otherwise around pos.ch
+      // If pos == Pos(_, 0, "before"), pos and end are unchanged
+      pos = pos.ch ? Pos(pos.line, pos.sticky == "before" ? pos.ch - 1 : pos.ch, "after") : pos;
+      end = pos.sticky == "before" ? Pos(pos.line, pos.ch + 1, "before") : pos;
+    }
+    for (var limit = 0; limit < 5; limit++) {
+      var changed = false;
+      var coords = cursorCoords(cm, pos);
+      var endCoords = !end || end == pos ? coords : cursorCoords(cm, end);
+      rect = {left: Math.min(coords.left, endCoords.left),
+              top: Math.min(coords.top, endCoords.top) - margin,
+              right: Math.max(coords.left, endCoords.left),
+              bottom: Math.max(coords.bottom, endCoords.bottom) + margin};
+      var scrollPos = calculateScrollPos(cm, rect);
+      var startTop = cm.doc.scrollTop, startLeft = cm.doc.scrollLeft;
+      if (scrollPos.scrollTop != null) {
+        updateScrollTop(cm, scrollPos.scrollTop);
+        if (Math.abs(cm.doc.scrollTop - startTop) > 1) { changed = true; }
+      }
+      if (scrollPos.scrollLeft != null) {
+        setScrollLeft(cm, scrollPos.scrollLeft);
+        if (Math.abs(cm.doc.scrollLeft - startLeft) > 1) { changed = true; }
+      }
+      if (!changed) { break }
+    }
+    return rect
+  }
+
+  // Scroll a given set of coordinates into view (immediately).
+  function scrollIntoView(cm, rect) {
+    var scrollPos = calculateScrollPos(cm, rect);
+    if (scrollPos.scrollTop != null) { updateScrollTop(cm, scrollPos.scrollTop); }
+    if (scrollPos.scrollLeft != null) { setScrollLeft(cm, scrollPos.scrollLeft); }
+  }
+
+  // Calculate a new scroll position needed to scroll the given
+  // rectangle into view. Returns an object with scrollTop and
+  // scrollLeft properties. When these are undefined, the
+  // vertical/horizontal position does not need to be adjusted.
+  function calculateScrollPos(cm, rect) {
+    var display = cm.display, snapMargin = textHeight(cm.display);
+    if (rect.top < 0) { rect.top = 0; }
+    var screentop = cm.curOp && cm.curOp.scrollTop != null ? cm.curOp.scrollTop : display.scroller.scrollTop;
+    var screen = displayHeight(cm), result = {};
+    if (rect.bottom - rect.top > screen) { rect.bottom = rect.top + screen; }
+    var docBottom = cm.doc.height + paddingVert(display);
+    var atTop = rect.top < snapMargin, atBottom = rect.bottom > docBottom - snapMargin;
+    if (rect.top < screentop) {
+      result.scrollTop = atTop ? 0 : rect.top;
+    } else if (rect.bottom > screentop + screen) {
+      var newTop = Math.min(rect.top, (atBottom ? docBottom : rect.bottom) - screen);
+      if (newTop != screentop) { result.scrollTop = newTop; }
+    }
+
+    var screenleft = cm.curOp && cm.curOp.scrollLeft != null ? cm.curOp.scrollLeft : display.scroller.scrollLeft;
+    var screenw = displayWidth(cm) - (cm.options.fixedGutter ? display.gutters.offsetWidth : 0);
+    var tooWide = rect.right - rect.left > screenw;
+    if (tooWide) { rect.right = rect.left + screenw; }
+    if (rect.left < 10)
+      { result.scrollLeft = 0; }
+    else if (rect.left < screenleft)
+      { result.scrollLeft = Math.max(0, rect.left - (tooWide ? 0 : 10)); }
+    else if (rect.right > screenw + screenleft - 3)
+      { result.scrollLeft = rect.right + (tooWide ? 0 : 10) - screenw; }
+    return result
+  }
+
+  // Store a relative adjustment to the scroll position in the current
+  // operation (to be applied when the operation finishes).
+  function addToScrollTop(cm, top) {
+    if (top == null) { return }
+    resolveScrollToPos(cm);
+    cm.curOp.scrollTop = (cm.curOp.scrollTop == null ? cm.doc.scrollTop : cm.curOp.scrollTop) + top;
+  }
+
+  // Make sure that at the end of the operation the current cursor is
+  // shown.
+  function ensureCursorVisible(cm) {
+    resolveScrollToPos(cm);
+    var cur = cm.getCursor();
+    cm.curOp.scrollToPos = {from: cur, to: cur, margin: cm.options.cursorScrollMargin};
+  }
+
+  function scrollToCoords(cm, x, y) {
+    if (x != null || y != null) { resolveScrollToPos(cm); }
+    if (x != null) { cm.curOp.scrollLeft = x; }
+    if (y != null) { cm.curOp.scrollTop = y; }
+  }
+
+  function scrollToRange(cm, range$$1) {
+    resolveScrollToPos(cm);
+    cm.curOp.scrollToPos = range$$1;
+  }
+
+  // When an operation has its scrollToPos property set, and another
+  // scroll action is applied before the end of the operation, this
+  // 'simulates' scrolling that position into view in a cheap way, so
+  // that the effect of intermediate scroll commands is not ignored.
+  function resolveScrollToPos(cm) {
+    var range$$1 = cm.curOp.scrollToPos;
+    if (range$$1) {
+      cm.curOp.scrollToPos = null;
+      var from = estimateCoords(cm, range$$1.from), to = estimateCoords(cm, range$$1.to);
+      scrollToCoordsRange(cm, from, to, range$$1.margin);
+    }
+  }
+
+  function scrollToCoordsRange(cm, from, to, margin) {
+    var sPos = calculateScrollPos(cm, {
+      left: Math.min(from.left, to.left),
+      top: Math.min(from.top, to.top) - margin,
+      right: Math.max(from.right, to.right),
+      bottom: Math.max(from.bottom, to.bottom) + margin
+    });
+    scrollToCoords(cm, sPos.scrollLeft, sPos.scrollTop);
+  }
+
+  // Sync the scrollable area and scrollbars, ensure the viewport
+  // covers the visible area.
+  function updateScrollTop(cm, val) {
+    if (Math.abs(cm.doc.scrollTop - val) < 2) { return }
+    if (!gecko) { updateDisplaySimple(cm, {top: val}); }
+    setScrollTop(cm, val, true);
+    if (gecko) { updateDisplaySimple(cm); }
+    startWorker(cm, 100);
+  }
+
+  function setScrollTop(cm, val, forceScroll) {
+    val = Math.min(cm.display.scroller.scrollHeight - cm.display.scroller.clientHeight, val);
+    if (cm.display.scroller.scrollTop == val && !forceScroll) { return }
+    cm.doc.scrollTop = val;
+    cm.display.scrollbars.setScrollTop(val);
+    if (cm.display.scroller.scrollTop != val) { cm.display.scroller.scrollTop = val; }
+  }
+
+  // Sync scroller and scrollbar, ensure the gutter elements are
+  // aligned.
+  function setScrollLeft(cm, val, isScroller, forceScroll) {
+    val = Math.min(val, cm.display.scroller.scrollWidth - cm.display.scroller.clientWidth);
+    if ((isScroller ? val == cm.doc.scrollLeft : Math.abs(cm.doc.scrollLeft - val) < 2) && !forceScroll) { return }
+    cm.doc.scrollLeft = val;
+    alignHorizontally(cm);
+    if (cm.display.scroller.scrollLeft != val) { cm.display.scroller.scrollLeft = val; }
+    cm.display.scrollbars.setScrollLeft(val);
+  }
+
+  // SCROLLBARS
+
+  // Prepare DOM reads needed to update the scrollbars. Done in one
+  // shot to minimize update/measure roundtrips.
+  function measureForScrollbars(cm) {
+    var d = cm.display, gutterW = d.gutters.offsetWidth;
+    var docH = Math.round(cm.doc.height + paddingVert(cm.display));
+    return {
+      clientHeight: d.scroller.clientHeight,
+      viewHeight: d.wrapper.clientHeight,
+      scrollWidth: d.scroller.scrollWidth, clientWidth: d.scroller.clientWidth,
+      viewWidth: d.wrapper.clientWidth,
+      barLeft: cm.options.fixedGutter ? gutterW : 0,
+      docHeight: docH,
+      scrollHeight: docH + scrollGap(cm) + d.barHeight,
+      nativeBarWidth: d.nativeBarWidth,
+      gutterWidth: gutterW
+    }
+  }
+
+  var NativeScrollbars = function(place, scroll, cm) {
+    this.cm = cm;
+    var vert = this.vert = elt("div", [elt("div", null, null, "min-width: 1px")], "CodeMirror-vscrollbar");
+    var horiz = this.horiz = elt("div", [elt("div", null, null, "height: 100%; min-height: 1px")], "CodeMirror-hscrollbar");
+    vert.tabIndex = horiz.tabIndex = -1;
+    place(vert); place(horiz);
+
+    on(vert, "scroll", function () {
+      if (vert.clientHeight) { scroll(vert.scrollTop, "vertical"); }
+    });
+    on(horiz, "scroll", function () {
+      if (horiz.clientWidth) { scroll(horiz.scrollLeft, "horizontal"); }
+    });
+
+    this.checkedZeroWidth = false;
+    // Need to set a minimum width to see the scrollbar on IE7 (but must not set it on IE8).
+    if (ie && ie_version < 8) { this.horiz.style.minHeight = this.vert.style.minWidth = "18px"; }
+  };
+
+  NativeScrollbars.prototype.update = function (measure) {
+    var needsH = measure.scrollWidth > measure.clientWidth + 1;
+    var needsV = measure.scrollHeight > measure.clientHeight + 1;
+    var sWidth = measure.nativeBarWidth;
+
+    if (needsV) {
+      this.vert.style.display = "block";
+      this.vert.style.bottom = needsH ? sWidth + "px" : "0";
+      var totalHeight = measure.viewHeight - (needsH ? sWidth : 0);
+      // A bug in IE8 can cause this value to be negative, so guard it.
+      this.vert.firstChild.style.height =
+        Math.max(0, measure.scrollHeight - measure.clientHeight + totalHeight) + "px";
+    } else {
+      this.vert.style.display = "";
+      this.vert.firstChild.style.height = "0";
+    }
+
+    if (needsH) {
+      this.horiz.style.display = "block";
+      this.horiz.style.right = needsV ? sWidth + "px" : "0";
+      this.horiz.style.left = measure.barLeft + "px";
+      var totalWidth = measure.viewWidth - measure.barLeft - (needsV ? sWidth : 0);
+      this.horiz.firstChild.style.width =
+        Math.max(0, measure.scrollWidth - measure.clientWidth + totalWidth) + "px";
+    } else {
+      this.horiz.style.display = "";
+      this.horiz.firstChild.style.width = "0";
+    }
+
+    if (!this.checkedZeroWidth && measure.clientHeight > 0) {
+      if (sWidth == 0) { this.zeroWidthHack(); }
+      this.checkedZeroWidth = true;
+    }
+
+    return {right: needsV ? sWidth : 0, bottom: needsH ? sWidth : 0}
+  };
+
+  NativeScrollbars.prototype.setScrollLeft = function (pos) {
+    if (this.horiz.scrollLeft != pos) { this.horiz.scrollLeft = pos; }
+    if (this.disableHoriz) { this.enableZeroWidthBar(this.horiz, this.disableHoriz, "horiz"); }
+  };
+
+  NativeScrollbars.prototype.setScrollTop = function (pos) {
+    if (this.vert.scrollTop != pos) { this.vert.scrollTop = pos; }
+    if (this.disableVert) { this.enableZeroWidthBar(this.vert, this.disableVert, "vert"); }
+  };
+
+  NativeScrollbars.prototype.zeroWidthHack = function () {
+    var w = mac && !mac_geMountainLion ? "12px" : "18px";
+    this.horiz.style.height = this.vert.style.width = w;
+    this.horiz.style.pointerEvents = this.vert.style.pointerEvents = "none";
+    this.disableHoriz = new Delayed;
+    this.disableVert = new Delayed;
+  };
+
+  NativeScrollbars.prototype.enableZeroWidthBar = function (bar, delay, type) {
+    bar.style.pointerEvents = "auto";
+    function maybeDisable() {
+      // To find out whether the scrollbar is still visible, we
+      // check whether the element under the pixel in the bottom
+      // right corner of the scrollbar box is the scrollbar box
+      // itself (when the bar is still visible) or its filler child
+      // (when the bar is hidden). If it is still visible, we keep
+      // it enabled, if it's hidden, we disable pointer events.
+      var box = bar.getBoundingClientRect();
+      var elt$$1 = type == "vert" ? document.elementFromPoint(box.right - 1, (box.top + box.bottom) / 2)
+          : document.elementFromPoint((box.right + box.left) / 2, box.bottom - 1);
+      if (elt$$1 != bar) { bar.style.pointerEvents = "none"; }
+      else { delay.set(1000, maybeDisable); }
+    }
+    delay.set(1000, maybeDisable);
+  };
+
+  NativeScrollbars.prototype.clear = function () {
+    var parent = this.horiz.parentNode;
+    parent.removeChild(this.horiz);
+    parent.removeChild(this.vert);
+  };
+
+  var NullScrollbars = function () {};
+
+  NullScrollbars.prototype.update = function () { return {bottom: 0, right: 0} };
+  NullScrollbars.prototype.setScrollLeft = function () {};
+  NullScrollbars.prototype.setScrollTop = function () {};
+  NullScrollbars.prototype.clear = function () {};
+
+  function updateScrollbars(cm, measure) {
+    if (!measure) { measure = measureForScrollbars(cm); }
+    var startWidth = cm.display.barWidth, startHeight = cm.display.barHeight;
+    updateScrollbarsInner(cm, measure);
+    for (var i = 0; i < 4 && startWidth != cm.display.barWidth || startHeight != cm.display.barHeight; i++) {
+      if (startWidth != cm.display.barWidth && cm.options.lineWrapping)
+        { updateHeightsInViewport(cm); }
+      updateScrollbarsInner(cm, measureForScrollbars(cm));
+      startWidth = cm.display.barWidth; startHeight = cm.display.barHeight;
+    }
+  }
+
+  // Re-synchronize the fake scrollbars with the actual size of the
+  // content.
+  function updateScrollbarsInner(cm, measure) {
+    var d = cm.display;
+    var sizes = d.scrollbars.update(measure);
+
+    d.sizer.style.paddingRight = (d.barWidth = sizes.right) + "px";
+    d.sizer.style.paddingBottom = (d.barHeight = sizes.bottom) + "px";
+    d.heightForcer.style.borderBottom = sizes.bottom + "px solid transparent";
+
+    if (sizes.right && sizes.bottom) {
+      d.scrollbarFiller.style.display = "block";
+      d.scrollbarFiller.style.height = sizes.bottom + "px";
+      d.scrollbarFiller.style.width = sizes.right + "px";
+    } else { d.scrollbarFiller.style.display = ""; }
+    if (sizes.bottom && cm.options.coverGutterNextToScrollbar && cm.options.fixedGutter) {
+      d.gutterFiller.style.display = "block";
+      d.gutterFiller.style.height = sizes.bottom + "px";
+      d.gutterFiller.style.width = measure.gutterWidth + "px";
+    } else { d.gutterFiller.style.display = ""; }
+  }
+
+  var scrollbarModel = {"native": NativeScrollbars, "null": NullScrollbars};
+
+  function initScrollbars(cm) {
+    if (cm.display.scrollbars) {
+      cm.display.scrollbars.clear();
+      if (cm.display.scrollbars.addClass)
+        { rmClass(cm.display.wrapper, cm.display.scrollbars.addClass); }
+    }
+
+    cm.display.scrollbars = new scrollbarModel[cm.options.scrollbarStyle](function (node) {
+      cm.display.wrapper.insertBefore(node, cm.display.scrollbarFiller);
+      // Prevent clicks in the scrollbars from killing focus
+      on(node, "mousedown", function () {
+        if (cm.state.focused) { setTimeout(function () { return cm.display.input.focus(); }, 0); }
+      });
+      node.setAttribute("cm-not-content", "true");
+    }, function (pos, axis) {
+      if (axis == "horizontal") { setScrollLeft(cm, pos); }
+      else { updateScrollTop(cm, pos); }
+    }, cm);
+    if (cm.display.scrollbars.addClass)
+      { addClass(cm.display.wrapper, cm.display.scrollbars.addClass); }
+  }
+
+  // Operations are used to wrap a series of changes to the editor
+  // state in such a way that each change won't have to update the
+  // cursor and display (which would be awkward, slow, and
+  // error-prone). Instead, display updates are batched and then all
+  // combined and executed at once.
+
+  var nextOpId = 0;
+  // Start a new operation.
+  function startOperation(cm) {
+    cm.curOp = {
+      cm: cm,
+      viewChanged: false,      // Flag that indicates that lines might need to be redrawn
+      startHeight: cm.doc.height, // Used to detect need to update scrollbar
+      forceUpdate: false,      // Used to force a redraw
+      updateInput: 0,       // Whether to reset the input textarea
+      typing: false,           // Whether this reset should be careful to leave existing text (for compositing)
+      changeObjs: null,        // Accumulated changes, for firing change events
+      cursorActivityHandlers: null, // Set of handlers to fire cursorActivity on
+      cursorActivityCalled: 0, // Tracks which cursorActivity handlers have been called already
+      selectionChanged: false, // Whether the selection needs to be redrawn
+      updateMaxLine: false,    // Set when the widest line needs to be determined anew
+      scrollLeft: null, scrollTop: null, // Intermediate scroll position, not pushed to DOM yet
+      scrollToPos: null,       // Used to scroll to a specific position
+      focus: false,
+      id: ++nextOpId           // Unique ID
+    };
+    pushOperation(cm.curOp);
+  }
+
+  // Finish an operation, updating the display and signalling delayed events
+  function endOperation(cm) {
+    var op = cm.curOp;
+    if (op) { finishOperation(op, function (group) {
+      for (var i = 0; i < group.ops.length; i++)
+        { group.ops[i].cm.curOp = null; }
+      endOperations(group);
+    }); }
+  }
+
+  // The DOM updates done when an operation finishes are batched so
+  // that the minimum number of relayouts are required.
+  function endOperations(group) {
+    var ops = group.ops;
+    for (var i = 0; i < ops.length; i++) // Read DOM
+      { endOperation_R1(ops[i]); }
+    for (var i$1 = 0; i$1 < ops.length; i$1++) // Write DOM (maybe)
+      { endOperation_W1(ops[i$1]); }
+    for (var i$2 = 0; i$2 < ops.length; i$2++) // Read DOM
+      { endOperation_R2(ops[i$2]); }
+    for (var i$3 = 0; i$3 < ops.length; i$3++) // Write DOM (maybe)
+      { endOperation_W2(ops[i$3]); }
+    for (var i$4 = 0; i$4 < ops.length; i$4++) // Read DOM
+      { endOperation_finish(ops[i$4]); }
+  }
+
+  function endOperation_R1(op) {
+    var cm = op.cm, display = cm.display;
+    maybeClipScrollbars(cm);
+    if (op.updateMaxLine) { findMaxLine(cm); }
+
+    op.mustUpdate = op.viewChanged || op.forceUpdate || op.scrollTop != null ||
+      op.scrollToPos && (op.scrollToPos.from.line < display.viewFrom ||
+                         op.scrollToPos.to.line >= display.viewTo) ||
+      display.maxLineChanged && cm.options.lineWrapping;
+    op.update = op.mustUpdate &&
+      new DisplayUpdate(cm, op.mustUpdate && {top: op.scrollTop, ensure: op.scrollToPos}, op.forceUpdate);
+  }
+
+  function endOperation_W1(op) {
+    op.updatedDisplay = op.mustUpdate && updateDisplayIfNeeded(op.cm, op.update);
+  }
+
+  function endOperation_R2(op) {
+    var cm = op.cm, display = cm.display;
+    if (op.updatedDisplay) { updateHeightsInViewport(cm); }
+
+    op.barMeasure = measureForScrollbars(cm);
+
+    // If the max line changed since it was last measured, measure it,
+    // and ensure the document's width matches it.
+    // updateDisplay_W2 will use these properties to do the actual resizing
+    if (display.maxLineChanged && !cm.options.lineWrapping) {
+      op.adjustWidthTo = measureChar(cm, display.maxLine, display.maxLine.text.length).left + 3;
+      cm.display.sizerWidth = op.adjustWidthTo;
+      op.barMeasure.scrollWidth =
+        Math.max(display.scroller.clientWidth, display.sizer.offsetLeft + op.adjustWidthTo + scrollGap(cm) + cm.display.barWidth);
+      op.maxScrollLeft = Math.max(0, display.sizer.offsetLeft + op.adjustWidthTo - displayWidth(cm));
+    }
+
+    if (op.updatedDisplay || op.selectionChanged)
+      { op.preparedSelection = display.input.prepareSelection(); }
+  }
+
+  function endOperation_W2(op) {
+    var cm = op.cm;
+
+    if (op.adjustWidthTo != null) {
+      cm.display.sizer.style.minWidth = op.adjustWidthTo + "px";
+      if (op.maxScrollLeft < cm.doc.scrollLeft)
+        { setScrollLeft(cm, Math.min(cm.display.scroller.scrollLeft, op.maxScrollLeft), true); }
+      cm.display.maxLineChanged = false;
+    }
+
+    var takeFocus = op.focus && op.focus == activeElt();
+    if (op.preparedSelection)
+      { cm.display.input.showSelection(op.preparedSelection, takeFocus); }
+    if (op.updatedDisplay || op.startHeight != cm.doc.height)
+      { updateScrollbars(cm, op.barMeasure); }
+    if (op.updatedDisplay)
+      { setDocumentHeight(cm, op.barMeasure); }
+
+    if (op.selectionChanged) { restartBlink(cm); }
+
+    if (cm.state.focused && op.updateInput)
+      { cm.display.input.reset(op.typing); }
+    if (takeFocus) { ensureFocus(op.cm); }
+  }
+
+  function endOperation_finish(op) {
+    var cm = op.cm, display = cm.display, doc = cm.doc;
+
+    if (op.updatedDisplay) { postUpdateDisplay(cm, op.update); }
+
+    // Abort mouse wheel delta measurement, when scrolling explicitly
+    if (display.wheelStartX != null && (op.scrollTop != null || op.scrollLeft != null || op.scrollToPos))
+      { display.wheelStartX = display.wheelStartY = null; }
+
+    // Propagate the scroll position to the actual DOM scroller
+    if (op.scrollTop != null) { setScrollTop(cm, op.scrollTop, op.forceScroll); }
+
+    if (op.scrollLeft != null) { setScrollLeft(cm, op.scrollLeft, true, true); }
+    // If we need to scroll a specific position into view, do so.
+    if (op.scrollToPos) {
+      var rect = scrollPosIntoView(cm, clipPos(doc, op.scrollToPos.from),
+                                   clipPos(doc, op.scrollToPos.to), op.scrollToPos.margin);
+      maybeScrollWindow(cm, rect);
+    }
+
+    // Fire events for markers that are hidden/unidden by editing or
+    // undoing
+    var hidden = op.maybeHiddenMarkers, unhidden = op.maybeUnhiddenMarkers;
+    if (hidden) { for (var i = 0; i < hidden.length; ++i)
+      { if (!hidden[i].lines.length) { signal(hidden[i], "hide"); } } }
+    if (unhidden) { for (var i$1 = 0; i$1 < unhidden.length; ++i$1)
+      { if (unhidden[i$1].lines.length) { signal(unhidden[i$1], "unhide"); } } }
+
+    if (display.wrapper.offsetHeight)
+      { doc.scrollTop = cm.display.scroller.scrollTop; }
+
+    // Fire change events, and delayed event handlers
+    if (op.changeObjs)
+      { signal(cm, "changes", cm, op.changeObjs); }
+    if (op.update)
+      { op.update.finish(); }
+  }
+
+  // Run the given function in an operation
+  function runInOp(cm, f) {
+    if (cm.curOp) { return f() }
+    startOperation(cm);
+    try { return f() }
+    finally { endOperation(cm); }
+  }
+  // Wraps a function in an operation. Returns the wrapped function.
+  function operation(cm, f) {
+    return function() {
+      if (cm.curOp) { return f.apply(cm, arguments) }
+      startOperation(cm);
+      try { return f.apply(cm, arguments) }
+      finally { endOperation(cm); }
+    }
+  }
+  // Used to add methods to editor and doc instances, wrapping them in
+  // operations.
+  function methodOp(f) {
+    return function() {
+      if (this.curOp) { return f.apply(this, arguments) }
+      startOperation(this);
+      try { return f.apply(this, arguments) }
+      finally { endOperation(this); }
+    }
+  }
+  function docMethodOp(f) {
+    return function() {
+      var cm = this.cm;
+      if (!cm || cm.curOp) { return f.apply(this, arguments) }
+      startOperation(cm);
+      try { return f.apply(this, arguments) }
+      finally { endOperation(cm); }
+    }
+  }
+
+  // HIGHLIGHT WORKER
+
+  function startWorker(cm, time) {
+    if (cm.doc.highlightFrontier < cm.display.viewTo)
+      { cm.state.highlight.set(time, bind(highlightWorker, cm)); }
+  }
+
+  function highlightWorker(cm) {
+    var doc = cm.doc;
+    if (doc.highlightFrontier >= cm.display.viewTo) { return }
+    var end = +new Date + cm.options.workTime;
+    var context = getContextBefore(cm, doc.highlightFrontier);
+    var changedLines = [];
+
+    doc.iter(context.line, Math.min(doc.first + doc.size, cm.display.viewTo + 500), function (line) {
+      if (context.line >= cm.display.viewFrom) { // Visible
+        var oldStyles = line.styles;
+        var resetState = line.text.length > cm.options.maxHighlightLength ? copyState(doc.mode, context.state) : null;
+        var highlighted = highlightLine(cm, line, context, true);
+        if (resetState) { context.state = resetState; }
+        line.styles = highlighted.styles;
+        var oldCls = line.styleClasses, newCls = highlighted.classes;
+        if (newCls) { line.styleClasses = newCls; }
+        else if (oldCls) { line.styleClasses = null; }
+        var ischange = !oldStyles || oldStyles.length != line.styles.length ||
+          oldCls != newCls && (!oldCls || !newCls || oldCls.bgClass != newCls.bgClass || oldCls.textClass != newCls.textClass);
+        for (var i = 0; !ischange && i < oldStyles.length; ++i) { ischange = oldStyles[i] != line.styles[i]; }
+        if (ischange) { changedLines.push(context.line); }
+        line.stateAfter = context.save();
+        context.nextLine();
+      } else {
+        if (line.text.length <= cm.options.maxHighlightLength)
+          { processLine(cm, line.text, context); }
+        line.stateAfter = context.line % 5 == 0 ? context.save() : null;
+        context.nextLine();
+      }
+      if (+new Date > end) {
+        startWorker(cm, cm.options.workDelay);
+        return true
+      }
+    });
+    doc.highlightFrontier = context.line;
+    doc.modeFrontier = Math.max(doc.modeFrontier, context.line);
+    if (changedLines.length) { runInOp(cm, function () {
+      for (var i = 0; i < changedLines.length; i++)
+        { regLineChange(cm, changedLines[i], "text"); }
+    }); }
+  }
+
+  // DISPLAY DRAWING
+
+  var DisplayUpdate = function(cm, viewport, force) {
+    var display = cm.display;
+
+    this.viewport = viewport;
+    // Store some values that we'll need later (but don't want to force a relayout for)
+    this.visible = visibleLines(display, cm.doc, viewport);
+    this.editorIsHidden = !display.wrapper.offsetWidth;
+    this.wrapperHeight = display.wrapper.clientHeight;
+    this.wrapperWidth = display.wrapper.clientWidth;
+    this.oldDisplayWidth = displayWidth(cm);
+    this.force = force;
+    this.dims = getDimensions(cm);
+    this.events = [];
+  };
+
+  DisplayUpdate.prototype.signal = function (emitter, type) {
+    if (hasHandler(emitter, type))
+      { this.events.push(arguments); }
+  };
+  DisplayUpdate.prototype.finish = function () {
+      var this$1 = this;
+
+    for (var i = 0; i < this.events.length; i++)
+      { signal.apply(null, this$1.events[i]); }
+  };
+
+  function maybeClipScrollbars(cm) {
+    var display = cm.display;
+    if (!display.scrollbarsClipped && display.scroller.offsetWidth) {
+      display.nativeBarWidth = display.scroller.offsetWidth - display.scroller.clientWidth;
+      display.heightForcer.style.height = scrollGap(cm) + "px";
+      display.sizer.style.marginBottom = -display.nativeBarWidth + "px";
+      display.sizer.style.borderRightWidth = scrollGap(cm) + "px";
+      display.scrollbarsClipped = true;
+    }
+  }
+
+  function selectionSnapshot(cm) {
+    if (cm.hasFocus()) { return null }
+    var active = activeElt();
+    if (!active || !contains(cm.display.lineDiv, active)) { return null }
+    var result = {activeElt: active};
+    if (window.getSelection) {
+      var sel = window.getSelection();
+      if (sel.anchorNode && sel.extend && contains(cm.display.lineDiv, sel.anchorNode)) {
+        result.anchorNode = sel.anchorNode;
+        result.anchorOffset = sel.anchorOffset;
+        result.focusNode = sel.focusNode;
+        result.focusOffset = sel.focusOffset;
+      }
+    }
+    return result
+  }
+
+  function restoreSelection(snapshot) {
+    if (!snapshot || !snapshot.activeElt || snapshot.activeElt == activeElt()) { return }
+    snapshot.activeElt.focus();
+    if (snapshot.anchorNode && contains(document.body, snapshot.anchorNode) && contains(document.body, snapshot.focusNode)) {
+      var sel = window.getSelection(), range$$1 = document.createRange();
+      range$$1.setEnd(snapshot.anchorNode, snapshot.anchorOffset);
+      range$$1.collapse(false);
+      sel.removeAllRanges();
+      sel.addRange(range$$1);
+      sel.extend(snapshot.focusNode, snapshot.focusOffset);
+    }
+  }
+
+  // Does the actual updating of the line display. Bails out
+  // (returning false) when there is nothing to be done and forced is
+  // false.
+  function updateDisplayIfNeeded(cm, update) {
+    var display = cm.display, doc = cm.doc;
+
+    if (update.editorIsHidden) {
+      resetView(cm);
+      return false
+    }
+
+    // Bail out if the visible area is already rendered and nothing changed.
+    if (!update.force &&
+        update.visible.from >= display.viewFrom && update.visible.to <= display.viewTo &&
+        (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo) &&
+        display.renderedView == display.view && countDirtyView(cm) == 0)
+      { return false }
+
+    if (maybeUpdateLineNumberWidth(cm)) {
+      resetView(cm);
+      update.dims = getDimensions(cm);
+    }
+
+    // Compute a suitable new viewport (from & to)
+    var end = doc.first + doc.size;
+    var from = Math.max(update.visible.from - cm.options.viewportMargin, doc.first);
+    var to = Math.min(end, update.visible.to + cm.options.viewportMargin);
+    if (display.viewFrom < from && from - display.viewFrom < 20) { from = Math.max(doc.first, display.viewFrom); }
+    if (display.viewTo > to && display.viewTo - to < 20) { to = Math.min(end, display.viewTo); }
+    if (sawCollapsedSpans) {
+      from = visualLineNo(cm.doc, from);
+      to = visualLineEndNo(cm.doc, to);
+    }
+
+    var different = from != display.viewFrom || to != display.viewTo ||
+      display.lastWrapHeight != update.wrapperHeight || display.lastWrapWidth != update.wrapperWidth;
+    adjustView(cm, from, to);
+
+    display.viewOffset = heightAtLine(getLine(cm.doc, display.viewFrom));
+    // Position the mover div to align with the current scroll position
+    cm.display.mover.style.top = display.viewOffset + "px";
+
+    var toUpdate = countDirtyView(cm);
+    if (!different && toUpdate == 0 && !update.force && display.renderedView == display.view &&
+        (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo))
+      { return false }
+
+    // For big changes, we hide the enclosing element during the
+    // update, since that speeds up the operations on most browsers.
+    var selSnapshot = selectionSnapshot(cm);
+    if (toUpdate > 4) { display.lineDiv.style.display = "none"; }
+    patchDisplay(cm, display.updateLineNumbers, update.dims);
+    if (toUpdate > 4) { display.lineDiv.style.display = ""; }
+    display.renderedView = display.view;
+    // There might have been a widget with a focused element that got
+    // hidden or updated, if so re-focus it.
+    restoreSelection(selSnapshot);
+
+    // Prevent selection and cursors from interfering with the scroll
+    // width and height.
+    removeChildren(display.cursorDiv);
+    removeChildren(display.selectionDiv);
+    display.gutters.style.height = display.sizer.style.minHeight = 0;
+
+    if (different) {
+      display.lastWrapHeight = update.wrapperHeight;
+      display.lastWrapWidth = update.wrapperWidth;
+      startWorker(cm, 400);
+    }
+
+    display.updateLineNumbers = null;
+
+    return true
+  }
+
+  function postUpdateDisplay(cm, update) {
+    var viewport = update.viewport;
+
+    for (var first = true;; first = false) {
+      if (!first || !cm.options.lineWrapping || update.oldDisplayWidth == displayWidth(cm)) {
+        // Clip forced viewport to actual scrollable area.
+        if (viewport && viewport.top != null)
+          { viewport = {top: Math.min(cm.doc.height + paddingVert(cm.display) - displayHeight(cm), viewport.top)}; }
+        // Updated line heights might result in the drawn area not
+        // actually covering the viewport. Keep looping until it does.
+        update.visible = visibleLines(cm.display, cm.doc, viewport);
+        if (update.visible.from >= cm.display.viewFrom && update.visible.to <= cm.display.viewTo)
+          { break }
+      }
+      if (!updateDisplayIfNeeded(cm, update)) { break }
+      updateHeightsInViewport(cm);
+      var barMeasure = measureForScrollbars(cm);
+      updateSelection(cm);
+      updateScrollbars(cm, barMeasure);
+      setDocumentHeight(cm, barMeasure);
+      update.force = false;
+    }
+
+    update.signal(cm, "update", cm);
+    if (cm.display.viewFrom != cm.display.reportedViewFrom || cm.display.viewTo != cm.display.reportedViewTo) {
+      update.signal(cm, "viewportChange", cm, cm.display.viewFrom, cm.display.viewTo);
+      cm.display.reportedViewFrom = cm.display.viewFrom; cm.display.reportedViewTo = cm.display.viewTo;
+    }
+  }
+
+  function updateDisplaySimple(cm, viewport) {
+    var update = new DisplayUpdate(cm, viewport);
+    if (updateDisplayIfNeeded(cm, update)) {
+      updateHeightsInViewport(cm);
+      postUpdateDisplay(cm, update);
+      var barMeasure = measureForScrollbars(cm);
+      updateSelection(cm);
+      updateScrollbars(cm, barMeasure);
+      setDocumentHeight(cm, barMeasure);
+      update.finish();
+    }
+  }
+
+  // Sync the actual display DOM structure with display.view, removing
+  // nodes for lines that are no longer in view, and creating the ones
+  // that are not there yet, and updating the ones that are out of
+  // date.
+  function patchDisplay(cm, updateNumbersFrom, dims) {
+    var display = cm.display, lineNumbers = cm.options.lineNumbers;
+    var container = display.lineDiv, cur = container.firstChild;
+
+    function rm(node) {
+      var next = node.nextSibling;
+      // Works around a throw-scroll bug in OS X Webkit
+      if (webkit && mac && cm.display.currentWheelTarget == node)
+        { node.style.display = "none"; }
+      else
+        { node.parentNode.removeChild(node); }
+      return next
+    }
+
+    var view = display.view, lineN = display.viewFrom;
+    // Loop over the elements in the view, syncing cur (the DOM nodes
+    // in display.lineDiv) with the view as we go.
+    for (var i = 0; i < view.length; i++) {
+      var lineView = view[i];
+      if (lineView.hidden) ; else if (!lineView.node || lineView.node.parentNode != container) { // Not drawn yet
+        var node = buildLineElement(cm, lineView, lineN, dims);
+        container.insertBefore(node, cur);
+      } else { // Already drawn
+        while (cur != lineView.node) { cur = rm(cur); }
+        var updateNumber = lineNumbers && updateNumbersFrom != null &&
+          updateNumbersFrom <= lineN && lineView.lineNumber;
+        if (lineView.changes) {
+          if (indexOf(lineView.changes, "gutter") > -1) { updateNumber = false; }
+          updateLineForChanges(cm, lineView, lineN, dims);
+        }
+        if (updateNumber) {
+          removeChildren(lineView.lineNumber);
+          lineView.lineNumber.appendChild(document.createTextNode(lineNumberFor(cm.options, lineN)));
+        }
+        cur = lineView.node.nextSibling;
+      }
+      lineN += lineView.size;
+    }
+    while (cur) { cur = rm(cur); }
+  }
+
+  function updateGutterSpace(display) {
+    var width = display.gutters.offsetWidth;
+    display.sizer.style.marginLeft = width + "px";
+  }
+
+  function setDocumentHeight(cm, measure) {
+    cm.display.sizer.style.minHeight = measure.docHeight + "px";
+    cm.display.heightForcer.style.top = measure.docHeight + "px";
+    cm.display.gutters.style.height = (measure.docHeight + cm.display.barHeight + scrollGap(cm)) + "px";
+  }
+
+  // Re-align line numbers and gutter marks to compensate for
+  // horizontal scrolling.
+  function alignHorizontally(cm) {
+    var display = cm.display, view = display.view;
+    if (!display.alignWidgets && (!display.gutters.firstChild || !cm.options.fixedGutter)) { return }
+    var comp = compensateForHScroll(display) - display.scroller.scrollLeft + cm.doc.scrollLeft;
+    var gutterW = display.gutters.offsetWidth, left = comp + "px";
+    for (var i = 0; i < view.length; i++) { if (!view[i].hidden) {
+      if (cm.options.fixedGutter) {
+        if (view[i].gutter)
+          { view[i].gutter.style.left = left; }
+        if (view[i].gutterBackground)
+          { view[i].gutterBackground.style.left = left; }
+      }
+      var align = view[i].alignable;
+      if (align) { for (var j = 0; j < align.length; j++)
+        { align[j].style.left = left; } }
+    } }
+    if (cm.options.fixedGutter)
+      { display.gutters.style.left = (comp + gutterW) + "px"; }
+  }
+
+  // Used to ensure that the line number gutter is still the right
+  // size for the current document size. Returns true when an update
+  // is needed.
+  function maybeUpdateLineNumberWidth(cm) {
+    if (!cm.options.lineNumbers) { return false }
+    var doc = cm.doc, last = lineNumberFor(cm.options, doc.first + doc.size - 1), display = cm.display;
+    if (last.length != display.lineNumChars) {
+      var test = display.measure.appendChild(elt("div", [elt("div", last)],
+                                                 "CodeMirror-linenumber CodeMirror-gutter-elt"));
+      var innerW = test.firstChild.offsetWidth, padding = test.offsetWidth - innerW;
+      display.lineGutter.style.width = "";
+      display.lineNumInnerWidth = Math.max(innerW, display.lineGutter.offsetWidth - padding) + 1;
+      display.lineNumWidth = display.lineNumInnerWidth + padding;
+      display.lineNumChars = display.lineNumInnerWidth ? last.length : -1;
+      display.lineGutter.style.width = display.lineNumWidth + "px";
+      updateGutterSpace(cm.display);
+      return true
+    }
+    return false
+  }
+
+  function getGutters(gutters, lineNumbers) {
+    var result = [], sawLineNumbers = false;
+    for (var i = 0; i < gutters.length; i++) {
+      var name = gutters[i], style = null;
+      if (typeof name != "string") { style = name.style; name = name.className; }
+      if (name == "CodeMirror-linenumbers") {
+        if (!lineNumbers) { continue }
+        else { sawLineNumbers = true; }
+      }
+      result.push({className: name, style: style});
+    }
+    if (lineNumbers && !sawLineNumbers) { result.push({className: "CodeMirror-linenumbers", style: null}); }
+    return result
+  }
+
+  // Rebuild the gutter elements, ensure the margin to the left of the
+  // code matches their width.
+  function renderGutters(display) {
+    var gutters = display.gutters, specs = display.gutterSpecs;
+    removeChildren(gutters);
+    display.lineGutter = null;
+    for (var i = 0; i < specs.length; ++i) {
+      var ref = specs[i];
+      var className = ref.className;
+      var style = ref.style;
+      var gElt = gutters.appendChild(elt("div", null, "CodeMirror-gutter " + className));
+      if (style) { gElt.style.cssText = style; }
+      if (className == "CodeMirror-linenumbers") {
+        display.lineGutter = gElt;
+        gElt.style.width = (display.lineNumWidth || 1) + "px";
+      }
+    }
+    gutters.style.display = specs.length ? "" : "none";
+    updateGutterSpace(display);
+  }
+
+  function updateGutters(cm) {
+    renderGutters(cm.display);
+    regChange(cm);
+    alignHorizontally(cm);
+  }
+
+  // The display handles the DOM integration, both for input reading
+  // and content drawing. It holds references to DOM nodes and
+  // display-related state.
+
+  function Display(place, doc, input, options) {
+    var d = this;
+    this.input = input;
+
+    // Covers bottom-right square when both scrollbars are present.
+    d.scrollbarFiller = elt("div", null, "CodeMirror-scrollbar-filler");
+    d.scrollbarFiller.setAttribute("cm-not-content", "true");
+    // Covers bottom of gutter when coverGutterNextToScrollbar is on
+    // and h scrollbar is present.
+    d.gutterFiller = elt("div", null, "CodeMirror-gutter-filler");
+    d.gutterFiller.setAttribute("cm-not-content", "true");
+    // Will contain the actual code, positioned to cover the viewport.
+    d.lineDiv = eltP("div", null, "CodeMirror-code");
+    // Elements are added to these to represent selection and cursors.
+    d.selectionDiv = elt("div", null, null, "position: relative; z-index: 1");
+    d.cursorDiv = elt("div", null, "CodeMirror-cursors");
+    // A visibility: hidden element used to find the size of things.
+    d.measure = elt("div", null, "CodeMirror-measure");
+    // When lines outside of the viewport are measured, they are drawn in this.
+    d.lineMeasure = elt("div", null, "CodeMirror-measure");
+    // Wraps everything that needs to exist inside the vertically-padded coordinate system
+    d.lineSpace = eltP("div", [d.measure, d.lineMeasure, d.selectionDiv, d.cursorDiv, d.lineDiv],
+                      null, "position: relative; outline: none");
+    var lines = eltP("div", [d.lineSpace], "CodeMirror-lines");
+    // Moved around its parent to cover visible view.
+    d.mover = elt("div", [lines], null, "position: relative");
+    // Set to the height of the document, allowing scrolling.
+    d.sizer = elt("div", [d.mover], "CodeMirror-sizer");
+    d.sizerWidth = null;
+    // Behavior of elts with overflow: auto and padding is
+    // inconsistent across browsers. This is used to ensure the
+    // scrollable area is big enough.
+    d.heightForcer = elt("div", null, null, "position: absolute; height: " + scrollerGap + "px; width: 1px;");
+    // Will contain the gutters, if any.
+    d.gutters = elt("div", null, "CodeMirror-gutters");
+    d.lineGutter = null;
+    // Actual scrollable element.
+    d.scroller = elt("div", [d.sizer, d.heightForcer, d.gutters], "CodeMirror-scroll");
+    d.scroller.setAttribute("tabIndex", "-1");
+    // The element in which the editor live_links.
+    d.wrapper = elt("div", [d.scrollbarFiller, d.gutterFiller, d.scroller], "CodeMirror");
+
+    // Work around IE7 z-index bug (not perfect, hence IE7 not really being supported)
+    if (ie && ie_version < 8) { d.gutters.style.zIndex = -1; d.scroller.style.paddingRight = 0; }
+    if (!webkit && !(gecko && mobile)) { d.scroller.draggable = true; }
+
+    if (place) {
+      if (place.appendChild) { place.appendChild(d.wrapper); }
+      else { place(d.wrapper); }
+    }
+
+    // Current rendered range (may be bigger than the view window).
+    d.viewFrom = d.viewTo = doc.first;
+    d.reportedViewFrom = d.reportedViewTo = doc.first;
+    // Information about the rendered lines.
+    d.view = [];
+    d.renderedView = null;
+    // Holds info about a single rendered line when it was rendered
+    // for measurement, while not in view.
+    d.externalMeasured = null;
+    // Empty space (in pixels) above the view
+    d.viewOffset = 0;
+    d.lastWrapHeight = d.lastWrapWidth = 0;
+    d.updateLineNumbers = null;
+
+    d.nativeBarWidth = d.barHeight = d.barWidth = 0;
+    d.scrollbarsClipped = false;
+
+    // Used to only resize the line number gutter when necessary (when
+    // the amount of lines crosses a boundary that makes its width change)
+    d.lineNumWidth = d.lineNumInnerWidth = d.lineNumChars = null;
+    // Set to true when a non-horizontal-scrolling line widget is
+    // added. As an optimization, line widget aligning is skipped when
+    // this is false.
+    d.alignWidgets = false;
+
+    d.cachedCharWidth = d.cachedTextHeight = d.cachedPaddingH = null;
+
+    // Tracks the maximum line length so that the horizontal scrollbar
+    // can be kept static when scrolling.
+    d.maxLine = null;
+    d.maxLineLength = 0;
+    d.maxLineChanged = false;
+
+    // Used for measuring wheel scrolling granularity
+    d.wheelDX = d.wheelDY = d.wheelStartX = d.wheelStartY = null;
+
+    // True when shift is held down.
+    d.shift = false;
+
+    // Used to track whether anything happened since the context menu
+    // was opened.
+    d.selForContextMenu = null;
+
+    d.activeTouch = null;
+
+    d.gutterSpecs = getGutters(options.gutters, options.lineNumbers);
+    renderGutters(d);
+
+    input.init(d);
+  }
+
+  // Since the delta values reported on mouse wheel events are
+  // unstandardized between browsers and even browser versions, and
+  // generally horribly unpredictable, this code starts by measuring
+  // the scroll effect that the first few mouse wheel events have,
+  // and, from that, detects the way it can convert deltas to pixel
+  // offsets afterwards.
+  //
+  // The reason we want to know the amount a wheel event will scroll
+  // is that it gives us a chance to update the display before the
+  // actual scrolling happens, reducing flickering.
+
+  var wheelSamples = 0, wheelPixelsPerUnit = null;
+  // Fill in a browser-detected starting value on browsers where we
+  // know one. These don't have to be accurate -- the result of them
+  // being wrong would just be a slight flicker on the first wheel
+  // scroll (if it is large enough).
+  if (ie) { wheelPixelsPerUnit = -.53; }
+  else if (gecko) { wheelPixelsPerUnit = 15; }
+  else if (chrome) { wheelPixelsPerUnit = -.7; }
+  else if (safari) { wheelPixelsPerUnit = -1/3; }
+
+  function wheelEventDelta(e) {
+    var dx = e.wheelDeltaX, dy = e.wheelDeltaY;
+    if (dx == null && e.detail && e.axis == e.HORIZONTAL_AXIS) { dx = e.detail; }
+    if (dy == null && e.detail && e.axis == e.VERTICAL_AXIS) { dy = e.detail; }
+    else if (dy == null) { dy = e.wheelDelta; }
+    return {x: dx, y: dy}
+  }
+  function wheelEventPixels(e) {
+    var delta = wheelEventDelta(e);
+    delta.x *= wheelPixelsPerUnit;
+    delta.y *= wheelPixelsPerUnit;
+    return delta
+  }
+
+  function onScrollWheel(cm, e) {
+    var delta = wheelEventDelta(e), dx = delta.x, dy = delta.y;
+
+    var display = cm.display, scroll = display.scroller;
+    // Quit if there's nothing to scroll here
+    var canScrollX = scroll.scrollWidth > scroll.clientWidth;
+    var canScrollY = scroll.scrollHeight > scroll.clientHeight;
+    if (!(dx && canScrollX || dy && canScrollY)) { return }
+
+    // Webkit browsers on OS X abort momentum scrolls when the target
+    // of the scroll event is removed from the scrollable element.
+    // This hack (see related code in patchDisplay) makes sure the
+    // element is kept around.
+    if (dy && mac && webkit) {
+      outer: for (var cur = e.target, view = display.view; cur != scroll; cur = cur.parentNode) {
+        for (var i = 0; i < view.length; i++) {
+          if (view[i].node == cur) {
+            cm.display.currentWheelTarget = cur;
+            break outer
+          }
+        }
+      }
+    }
+
+    // On some browsers, horizontal scrolling will cause redraws to
+    // happen before the gutter has been realigned, causing it to
+    // wriggle around in a most unseemly way. When we have an
+    // estimated pixels/delta value, we just handle horizontal
+    // scrolling entirely here. It'll be slightly off from native, but
+    // better than glitching out.
+    if (dx && !gecko && !presto && wheelPixelsPerUnit != null) {
+      if (dy && canScrollY)
+        { updateScrollTop(cm, Math.max(0, scroll.scrollTop + dy * wheelPixelsPerUnit)); }
+      setScrollLeft(cm, Math.max(0, scroll.scrollLeft + dx * wheelPixelsPerUnit));
+      // Only prevent default scrolling if vertical scrolling is
+      // actually possible. Otherwise, it causes vertical scroll
+      // jitter on OSX trackpads when deltaX is small and deltaY
+      // is large (issue #3579)
+      if (!dy || (dy && canScrollY))
+        { e_preventDefault(e); }
+      display.wheelStartX = null; // Abort measurement, if in progress
+      return
+    }
+
+    // 'Project' the visible viewport to cover the area that is being
+    // scrolled into view (if we know enough to estimate it).
+    if (dy && wheelPixelsPerUnit != null) {
+      var pixels = dy * wheelPixelsPerUnit;
+      var top = cm.doc.scrollTop, bot = top + display.wrapper.clientHeight;
+      if (pixels < 0) { top = Math.max(0, top + pixels - 50); }
+      else { bot = Math.min(cm.doc.height, bot + pixels + 50); }
+      updateDisplaySimple(cm, {top: top, bottom: bot});
+    }
+
+    if (wheelSamples < 20) {
+      if (display.wheelStartX == null) {
+        display.wheelStartX = scroll.scrollLeft; display.wheelStartY = scroll.scrollTop;
+        display.wheelDX = dx; display.wheelDY = dy;
+        setTimeout(function () {
+          if (display.wheelStartX == null) { return }
+          var movedX = scroll.scrollLeft - display.wheelStartX;
+          var movedY = scroll.scrollTop - display.wheelStartY;
+          var sample = (movedY && display.wheelDY && movedY / display.wheelDY) ||
+            (movedX && display.wheelDX && movedX / display.wheelDX);
+          display.wheelStartX = display.wheelStartY = null;
+          if (!sample) { return }
+          wheelPixelsPerUnit = (wheelPixelsPerUnit * wheelSamples + sample) / (wheelSamples + 1);
+          ++wheelSamples;
+        }, 200);
+      } else {
+        display.wheelDX += dx; display.wheelDY += dy;
+      }
+    }
+  }
+
+  // Selection objects are immutable. A new one is created every time
+  // the selection changes. A selection is one or more non-overlapping
+  // (and non-touching) ranges, sorted, and an integer that indicates
+  // which one is the primary selection (the one that's scrolled into
+  // view, that getCursor returns, etc).
+  var Selection = function(ranges, primIndex) {
+    this.ranges = ranges;
+    this.primIndex = primIndex;
+  };
+
+  Selection.prototype.primary = function () { return this.ranges[this.primIndex] };
+
+  Selection.prototype.equals = function (other) {
+      var this$1 = this;
+
+    if (other == this) { return true }
+    if (other.primIndex != this.primIndex || other.ranges.length != this.ranges.length) { return false }
+    for (var i = 0; i < this.ranges.length; i++) {
+      var here = this$1.ranges[i], there = other.ranges[i];
+      if (!equalCursorPos(here.anchor, there.anchor) || !equalCursorPos(here.head, there.head)) { return false }
+    }
+    return true
+  };
+
+  Selection.prototype.deepCopy = function () {
+      var this$1 = this;
+
+    var out = [];
+    for (var i = 0; i < this.ranges.length; i++)
+      { out[i] = new Range(copyPos(this$1.ranges[i].anchor), copyPos(this$1.ranges[i].head)); }
+    return new Selection(out, this.primIndex)
+  };
+
+  Selection.prototype.somethingSelected = function () {
+      var this$1 = this;
+
+    for (var i = 0; i < this.ranges.length; i++)
+      { if (!this$1.ranges[i].empty()) { return true } }
+    return false
+  };
+
+  Selection.prototype.contains = function (pos, end) {
+      var this$1 = this;
+
+    if (!end) { end = pos; }
+    for (var i = 0; i < this.ranges.length; i++) {
+      var range = this$1.ranges[i];
+      if (cmp(end, range.from()) >= 0 && cmp(pos, range.to()) <= 0)
+        { return i }
+    }
+    return -1
+  };
+
+  var Range = function(anchor, head) {
+    this.anchor = anchor; this.head = head;
+  };
+
+  Range.prototype.from = function () { return minPos(this.anchor, this.head) };
+  Range.prototype.to = function () { return maxPos(this.anchor, this.head) };
+  Range.prototype.empty = function () { return this.head.line == this.anchor.line && this.head.ch == this.anchor.ch };
+
+  // Take an unsorted, potentially overlapping set of ranges, and
+  // build a selection out of it. 'Consumes' ranges array (modifying
+  // it).
+  function normalizeSelection(cm, ranges, primIndex) {
+    var mayTouch = cm && cm.options.selectionsMayTouch;
+    var prim = ranges[primIndex];
+    ranges.sort(function (a, b) { return cmp(a.from(), b.from()); });
+    primIndex = indexOf(ranges, prim);
+    for (var i = 1; i < ranges.length; i++) {
+      var cur = ranges[i], prev = ranges[i - 1];
+      var diff = cmp(prev.to(), cur.from());
+      if (mayTouch && !cur.empty() ? diff > 0 : diff >= 0) {
+        var from = minPos(prev.from(), cur.from()), to = maxPos(prev.to(), cur.to());
+        var inv = prev.empty() ? cur.from() == cur.head : prev.from() == prev.head;
+        if (i <= primIndex) { --primIndex; }
+        ranges.splice(--i, 2, new Range(inv ? to : from, inv ? from : to));
+      }
+    }
+    return new Selection(ranges, primIndex)
+  }
+
+  function simpleSelection(anchor, head) {
+    return new Selection([new Range(anchor, head || anchor)], 0)
+  }
+
+  // Compute the position of the end of a change (its 'to' property
+  // refers to the pre-change end).
+  function changeEnd(change) {
+    if (!change.text) { return change.to }
+    return Pos(change.from.line + change.text.length - 1,
+               lst(change.text).length + (change.text.length == 1 ? change.from.ch : 0))
+  }
+
+  // Adjust a position to refer to the post-change position of the
+  // same text, or the end of the change if the change covers it.
+  function adjustForChange(pos, change) {
+    if (cmp(pos, change.from) < 0) { return pos }
+    if (cmp(pos, change.to) <= 0) { return changeEnd(change) }
+
+    var line = pos.line + change.text.length - (change.to.line - change.from.line) - 1, ch = pos.ch;
+    if (pos.line == change.to.line) { ch += changeEnd(change).ch - change.to.ch; }
+    return Pos(line, ch)
+  }
+
+  function computeSelAfterChange(doc, change) {
+    var out = [];
+    for (var i = 0; i < doc.sel.ranges.length; i++) {
+      var range = doc.sel.ranges[i];
+      out.push(new Range(adjustForChange(range.anchor, change),
+                         adjustForChange(range.head, change)));
+    }
+    return normalizeSelection(doc.cm, out, doc.sel.primIndex)
+  }
+
+  function offsetPos(pos, old, nw) {
+    if (pos.line == old.line)
+      { return Pos(nw.line, pos.ch - old.ch + nw.ch) }
+    else
+      { return Pos(nw.line + (pos.line - old.line), pos.ch) }
+  }
+
+  // Used by replaceSelections to allow moving the selection to the
+  // start or around the replaced test. Hint may be "start" or "around".
+  function computeReplacedSel(doc, changes, hint) {
+    var out = [];
+    var oldPrev = Pos(doc.first, 0), newPrev = oldPrev;
+    for (var i = 0; i < changes.length; i++) {
+      var change = changes[i];
+      var from = offsetPos(change.from, oldPrev, newPrev);
+      var to = offsetPos(changeEnd(change), oldPrev, newPrev);
+      oldPrev = change.to;
+      newPrev = to;
+      if (hint == "around") {
+        var range = doc.sel.ranges[i], inv = cmp(range.head, range.anchor) < 0;
+        out[i] = new Range(inv ? to : from, inv ? from : to);
+      } else {
+        out[i] = new Range(from, from);
+      }
+    }
+    return new Selection(out, doc.sel.primIndex)
+  }
+
+  // Used to get the editor into a consistent state again when options change.
+
+  function loadMode(cm) {
+    cm.doc.mode = getMode(cm.options, cm.doc.modeOption);
+    resetModeState(cm);
+  }
+
+  function resetModeState(cm) {
+    cm.doc.iter(function (line) {
+      if (line.stateAfter) { line.stateAfter = null; }
+      if (line.styles) { line.styles = null; }
+    });
+    cm.doc.modeFrontier = cm.doc.highlightFrontier = cm.doc.first;
+    startWorker(cm, 100);
+    cm.state.modeGen++;
+    if (cm.curOp) { regChange(cm); }
+  }
+
+  // DOCUMENT DATA STRUCTURE
+
+  // By default, updates that start and end at the beginning of a line
+  // are treated specially, in order to make the association of line
+  // widgets and marker elements with the text behave more intuitive.
+  function isWholeLineUpdate(doc, change) {
+    return change.from.ch == 0 && change.to.ch == 0 && lst(change.text) == "" &&
+      (!doc.cm || doc.cm.options.wholeLineUpdateBefore)
+  }
+
+  // Perform a change on the document data structure.
+  function updateDoc(doc, change, markedSpans, estimateHeight$$1) {
+    function spansFor(n) {return markedSpans ? markedSpans[n] : null}
+    function update(line, text, spans) {
+      updateLine(line, text, spans, estimateHeight$$1);
+      signalLater(line, "change", line, change);
+    }
+    function linesFor(start, end) {
+      var result = [];
+      for (var i = start; i < end; ++i)
+        { result.push(new Line(text[i], spansFor(i), estimateHeight$$1)); }
+      return result
+    }
+
+    var from = change.from, to = change.to, text = change.text;
+    var firstLine = getLine(doc, from.line), lastLine = getLine(doc, to.line);
+    var lastText = lst(text), lastSpans = spansFor(text.length - 1), nlines = to.line - from.line;
+
+    // Adjust the line structure
+    if (change.full) {
+      doc.insert(0, linesFor(0, text.length));
+      doc.remove(text.length, doc.size - text.length);
+    } else if (isWholeLineUpdate(doc, change)) {
+      // This is a whole-line replace. Treated specially to make
+      // sure line objects move the way they are supposed to.
+      var added = linesFor(0, text.length - 1);
+      update(lastLine, lastLine.text, lastSpans);
+      if (nlines) { doc.remove(from.line, nlines); }
+      if (added.length) { doc.insert(from.line, added); }
+    } else if (firstLine == lastLine) {
+      if (text.length == 1) {
+        update(firstLine, firstLine.text.slice(0, from.ch) + lastText + firstLine.text.slice(to.ch), lastSpans);
+      } else {
+        var added$1 = linesFor(1, text.length - 1);
+        added$1.push(new Line(lastText + firstLine.text.slice(to.ch), lastSpans, estimateHeight$$1));
+        update(firstLine, firstLine.text.slice(0, from.ch) + text[0], spansFor(0));
+        doc.insert(from.line + 1, added$1);
+      }
+    } else if (text.length == 1) {
+      update(firstLine, firstLine.text.slice(0, from.ch) + text[0] + lastLine.text.slice(to.ch), spansFor(0));
+      doc.remove(from.line + 1, nlines);
+    } else {
+      update(firstLine, firstLine.text.slice(0, from.ch) + text[0], spansFor(0));
+      update(lastLine, lastText + lastLine.text.slice(to.ch), lastSpans);
+      var added$2 = linesFor(1, text.length - 1);
+      if (nlines > 1) { doc.remove(from.line + 1, nlines - 1); }
+      doc.insert(from.line + 1, added$2);
+    }
+
+    signalLater(doc, "change", doc, change);
+  }
+
+  // Call f for all linked documents.
+  function linkedDocs(doc, f, sharedHistOnly) {
+    function propagate(doc, skip, sharedHist) {
+      if (doc.linked) { for (var i = 0; i < doc.linked.length; ++i) {
+        var rel = doc.linked[i];
+        if (rel.doc == skip) { continue }
+        var shared = sharedHist && rel.sharedHist;
+        if (sharedHistOnly && !shared) { continue }
+        f(rel.doc, shared);
+        propagate(rel.doc, doc, shared);
+      } }
+    }
+    propagate(doc, null, true);
+  }
+
+  // Attach a document to an editor.
+  function attachDoc(cm, doc) {
+    if (doc.cm) { throw new Error("This document is already in use.") }
+    cm.doc = doc;
+    doc.cm = cm;
+    estimateLineHeights(cm);
+    loadMode(cm);
+    setDirectionClass(cm);
+    if (!cm.options.lineWrapping) { findMaxLine(cm); }
+    cm.options.mode = doc.modeOption;
+    regChange(cm);
+  }
+
+  function setDirectionClass(cm) {
+  (cm.doc.direction == "rtl" ? addClass : rmClass)(cm.display.lineDiv, "CodeMirror-rtl");
+  }
+
+  function directionChanged(cm) {
+    runInOp(cm, function () {
+      setDirectionClass(cm);
+      regChange(cm);
+    });
+  }
+
+  function History(startGen) {
+    // Arrays of change events and selections. Doing something adds an
+    // event to done and clears undo. Undoing moves events from done
+    // to undone, redoing moves them in the other direction.
+    this.done = []; this.undone = [];
+    this.undoDepth = Infinity;
+    // Used to track when changes can be merged into a single undo
+    // event
+    this.lastModTime = this.lastSelTime = 0;
+    this.lastOp = this.lastSelOp = null;
+    this.lastOrigin = this.lastSelOrigin = null;
+    // Used by the isClean() method
+    this.generation = this.maxGeneration = startGen || 1;
+  }
+
+  // Create a history change event from an updateDoc-style change
+  // object.
+  function historyChangeFromChange(doc, change) {
+    var histChange = {from: copyPos(change.from), to: changeEnd(change), text: getBetween(doc, change.from, change.to)};
+    attachLocalSpans(doc, histChange, change.from.line, change.to.line + 1);
+    linkedDocs(doc, function (doc) { return attachLocalSpans(doc, histChange, change.from.line, change.to.line + 1); }, true);
+    return histChange
+  }
+
+  // Pop all selection events off the end of a history array. Stop at
+  // a change event.
+  function clearSelectionEvents(array) {
+    while (array.length) {
+      var last = lst(array);
+      if (last.ranges) { array.pop(); }
+      else { break }
+    }
+  }
+
+  // Find the top change event in the history. Pop off selection
+  // events that are in the way.
+  function lastChangeEvent(hist, force) {
+    if (force) {
+      clearSelectionEvents(hist.done);
+      return lst(hist.done)
+    } else if (hist.done.length && !lst(hist.done).ranges) {
+      return lst(hist.done)
+    } else if (hist.done.length > 1 && !hist.done[hist.done.length - 2].ranges) {
+      hist.done.pop();
+      return lst(hist.done)
+    }
+  }
+
+  // Register a change in the history. Merges changes that are within
+  // a single operation, or are close together with an origin that
+  // allows merging (starting with "+") into a single event.
+  function addChangeToHistory(doc, change, selAfter, opId) {
+    var hist = doc.history;
+    hist.undone.length = 0;
+    var time = +new Date, cur;
+    var last;
+
+    if ((hist.lastOp == opId ||
+         hist.lastOrigin == change.origin && change.origin &&
+         ((change.origin.charAt(0) == "+" && hist.lastModTime > time - (doc.cm ? doc.cm.options.historyEventDelay : 500)) ||
+          change.origin.charAt(0) == "*")) &&
+        (cur = lastChangeEvent(hist, hist.lastOp == opId))) {
+      // Merge this change into the last event
+      last = lst(cur.changes);
+      if (cmp(change.from, change.to) == 0 && cmp(change.from, last.to) == 0) {
+        // Optimized case for simple insertion -- don't want to add
+        // new changesets for every character typed
+        last.to = changeEnd(change);
+      } else {
+        // Add new sub-event
+        cur.changes.push(historyChangeFromChange(doc, change));
+      }
+    } else {
+      // Can not be merged, start a new event.
+      var before = lst(hist.done);
+      if (!before || !before.ranges)
+        { pushSelectionToHistory(doc.sel, hist.done); }
+      cur = {changes: [historyChangeFromChange(doc, change)],
+             generation: hist.generation};
+      hist.done.push(cur);
+      while (hist.done.length > hist.undoDepth) {
+        hist.done.shift();
+        if (!hist.done[0].ranges) { hist.done.shift(); }
+      }
+    }
+    hist.done.push(selAfter);
+    hist.generation = ++hist.maxGeneration;
+    hist.lastModTime = hist.lastSelTime = time;
+    hist.lastOp = hist.lastSelOp = opId;
+    hist.lastOrigin = hist.lastSelOrigin = change.origin;
+
+    if (!last) { signal(doc, "historyAdded"); }
+  }
+
+  function selectionEventCanBeMerged(doc, origin, prev, sel) {
+    var ch = origin.charAt(0);
+    return ch == "*" ||
+      ch == "+" &&
+      prev.ranges.length == sel.ranges.length &&
+      prev.somethingSelected() == sel.somethingSelected() &&
+      new Date - doc.history.lastSelTime <= (doc.cm ? doc.cm.options.historyEventDelay : 500)
+  }
+
+  // Called whenever the selection changes, sets the new selection as
+  // the pending selection in the history, and pushes the old pending
+  // selection into the 'done' array when it was significantly
+  // different (in number of selected ranges, emptiness, or time).
+  function addSelectionToHistory(doc, sel, opId, options) {
+    var hist = doc.history, origin = options && options.origin;
+
+    // A new event is started when the previous origin does not match
+    // the current, or the origins don't allow matching. Origins
+    // starting with * are always merged, those starting with + are
+    // merged when similar and close together in time.
+    if (opId == hist.lastSelOp ||
+        (origin && hist.lastSelOrigin == origin &&
+         (hist.lastModTime == hist.lastSelTime && hist.lastOrigin == origin ||
+          selectionEventCanBeMerged(doc, origin, lst(hist.done), sel))))
+      { hist.done[hist.done.length - 1] = sel; }
+    else
+      { pushSelectionToHistory(sel, hist.done); }
+
+    hist.lastSelTime = +new Date;
+    hist.lastSelOrigin = origin;
+    hist.lastSelOp = opId;
+    if (options && options.clearRedo !== false)
+      { clearSelectionEvents(hist.undone); }
+  }
+
+  function pushSelectionToHistory(sel, dest) {
+    var top = lst(dest);
+    if (!(top && top.ranges && top.equals(sel)))
+      { dest.push(sel); }
+  }
+
+  // Used to store marked span information in the history.
+  function attachLocalSpans(doc, change, from, to) {
+    var existing = change["spans_" + doc.id], n = 0;
+    doc.iter(Math.max(doc.first, from), Math.min(doc.first + doc.size, to), function (line) {
+      if (line.markedSpans)
+        { (existing || (existing = change["spans_" + doc.id] = {}))[n] = line.markedSpans; }
+      ++n;
+    });
+  }
+
+  // When un/re-doing restores text containing marked spans, those
+  // that have been explicitly cleared should not be restored.
+  function removeClearedSpans(spans) {
+    if (!spans) { return null }
+    var out;
+    for (var i = 0; i < spans.length; ++i) {
+      if (spans[i].marker.explicitlyCleared) { if (!out) { out = spans.slice(0, i); } }
+      else if (out) { out.push(spans[i]); }
+    }
+    return !out ? spans : out.length ? out : null
+  }
+
+  // Retrieve and filter the old marked spans stored in a change event.
+  function getOldSpans(doc, change) {
+    var found = change["spans_" + doc.id];
+    if (!found) { return null }
+    var nw = [];
+    for (var i = 0; i < change.text.length; ++i)
+      { nw.push(removeClearedSpans(found[i])); }
+    return nw
+  }
+
+  // Used for un/re-doing changes from the history. Combines the
+  // result of computing the existing spans with the set of spans that
+  // existed in the history (so that deleting around a span and then
+  // undoing brings back the span).
+  function mergeOldSpans(doc, change) {
+    var old = getOldSpans(doc, change);
+    var stretched = stretchSpansOverChange(doc, change);
+    if (!old) { return stretched }
+    if (!stretched) { return old }
+
+    for (var i = 0; i < old.length; ++i) {
+      var oldCur = old[i], stretchCur = stretched[i];
+      if (oldCur && stretchCur) {
+        spans: for (var j = 0; j < stretchCur.length; ++j) {
+          var span = stretchCur[j];
+          for (var k = 0; k < oldCur.length; ++k)
+            { if (oldCur[k].marker == span.marker) { continue spans } }
+          oldCur.push(span);
+        }
+      } else if (stretchCur) {
+        old[i] = stretchCur;
+      }
+    }
+    return old
+  }
+
+  // Used both to provide a JSON-safe object in .getHistory, and, when
+  // detaching a document, to split the history in two
+  function copyHistoryArray(events, newGroup, instantiateSel) {
+    var copy = [];
+    for (var i = 0; i < events.length; ++i) {
+      var event = events[i];
+      if (event.ranges) {
+        copy.push(instantiateSel ? Selection.prototype.deepCopy.call(event) : event);
+        continue
+      }
+      var changes = event.changes, newChanges = [];
+      copy.push({changes: newChanges});
+      for (var j = 0; j < changes.length; ++j) {
+        var change = changes[j], m = (void 0);
+        newChanges.push({from: change.from, to: change.to, text: change.text});
+        if (newGroup) { for (var prop in change) { if (m = prop.match(/^spans_(\d+)$/)) {
+          if (indexOf(newGroup, Number(m[1])) > -1) {
+            lst(newChanges)[prop] = change[prop];
+            delete change[prop];
+          }
+        } } }
+      }
+    }
+    return copy
+  }
+
+  // The 'scroll' parameter given to many of these indicated whether
+  // the new cursor position should be scrolled into view after
+  // modifying the selection.
+
+  // If shift is held or the extend flag is set, extends a range to
+  // include a given position (and optionally a second position).
+  // Otherwise, simply returns the range between the given positions.
+  // Used for cursor motion and such.
+  function extendRange(range, head, other, extend) {
+    if (extend) {
+      var anchor = range.anchor;
+      if (other) {
+        var posBefore = cmp(head, anchor) < 0;
+        if (posBefore != (cmp(other, anchor) < 0)) {
+          anchor = head;
+          head = other;
+        } else if (posBefore != (cmp(head, other) < 0)) {
+          head = other;
+        }
+      }
+      return new Range(anchor, head)
+    } else {
+      return new Range(other || head, head)
+    }
+  }
+
+  // Extend the primary selection range, discard the rest.
+  function extendSelection(doc, head, other, options, extend) {
+    if (extend == null) { extend = doc.cm && (doc.cm.display.shift || doc.extend); }
+    setSelection(doc, new Selection([extendRange(doc.sel.primary(), head, other, extend)], 0), options);
+  }
+
+  // Extend all selections (pos is an array of selections with length
+  // equal the number of selections)
+  function extendSelections(doc, heads, options) {
+    var out = [];
+    var extend = doc.cm && (doc.cm.display.shift || doc.extend);
+    for (var i = 0; i < doc.sel.ranges.length; i++)
+      { out[i] = extendRange(doc.sel.ranges[i], heads[i], null, extend); }
+    var newSel = normalizeSelection(doc.cm, out, doc.sel.primIndex);
+    setSelection(doc, newSel, options);
+  }
+
+  // Updates a single range in the selection.
+  function replaceOneSelection(doc, i, range, options) {
+    var ranges = doc.sel.ranges.slice(0);
+    ranges[i] = range;
+    setSelection(doc, normalizeSelection(doc.cm, ranges, doc.sel.primIndex), options);
+  }
+
+  // Reset the selection to a single range.
+  function setSimpleSelection(doc, anchor, head, options) {
+    setSelection(doc, simpleSelection(anchor, head), options);
+  }
+
+  // Give beforeSelectionChange handlers a change to influence a
+  // selection update.
+  function filterSelectionChange(doc, sel, options) {
+    var obj = {
+      ranges: sel.ranges,
+      update: function(ranges) {
+        var this$1 = this;
+
+        this.ranges = [];
+        for (var i = 0; i < ranges.length; i++)
+          { this$1.ranges[i] = new Range(clipPos(doc, ranges[i].anchor),
+                                     clipPos(doc, ranges[i].head)); }
+      },
+      origin: options && options.origin
+    };
+    signal(doc, "beforeSelectionChange", doc, obj);
+    if (doc.cm) { signal(doc.cm, "beforeSelectionChange", doc.cm, obj); }
+    if (obj.ranges != sel.ranges) { return normalizeSelection(doc.cm, obj.ranges, obj.ranges.length - 1) }
+    else { return sel }
+  }
+
+  function setSelectionReplaceHistory(doc, sel, options) {
+    var done = doc.history.done, last = lst(done);
+    if (last && last.ranges) {
+      done[done.length - 1] = sel;
+      setSelectionNoUndo(doc, sel, options);
+    } else {
+      setSelection(doc, sel, options);
+    }
+  }
+
+  // Set a new selection.
+  function setSelection(doc, sel, options) {
+    setSelectionNoUndo(doc, sel, options);
+    addSelectionToHistory(doc, doc.sel, doc.cm ? doc.cm.curOp.id : NaN, options);
+  }
+
+  function setSelectionNoUndo(doc, sel, options) {
+    if (hasHandler(doc, "beforeSelectionChange") || doc.cm && hasHandler(doc.cm, "beforeSelectionChange"))
+      { sel = filterSelectionChange(doc, sel, options); }
+
+    var bias = options && options.bias ||
+      (cmp(sel.primary().head, doc.sel.primary().head) < 0 ? -1 : 1);
+    setSelectionInner(doc, skipAtomicInSelection(doc, sel, bias, true));
+
+    if (!(options && options.scroll === false) && doc.cm)
+      { ensureCursorVisible(doc.cm); }
+  }
+
+  function setSelectionInner(doc, sel) {
+    if (sel.equals(doc.sel)) { return }
+
+    doc.sel = sel;
+
+    if (doc.cm) {
+      doc.cm.curOp.updateInput = 1;
+      doc.cm.curOp.selectionChanged = true;
+      signalCursorActivity(doc.cm);
+    }
+    signalLater(doc, "cursorActivity", doc);
+  }
+
+  // Verify that the selection does not partially select any atomic
+  // marked ranges.
+  function reCheckSelection(doc) {
+    setSelectionInner(doc, skipAtomicInSelection(doc, doc.sel, null, false));
+  }
+
+  // Return a selection that does not partially select any atomic
+  // ranges.
+  function skipAtomicInSelection(doc, sel, bias, mayClear) {
+    var out;
+    for (var i = 0; i < sel.ranges.length; i++) {
+      var range = sel.ranges[i];
+      var old = sel.ranges.length == doc.sel.ranges.length && doc.sel.ranges[i];
+      var newAnchor = skipAtomic(doc, range.anchor, old && old.anchor, bias, mayClear);
+      var newHead = skipAtomic(doc, range.head, old && old.head, bias, mayClear);
+      if (out || newAnchor != range.anchor || newHead != range.head) {
+        if (!out) { out = sel.ranges.slice(0, i); }
+        out[i] = new Range(newAnchor, newHead);
+      }
+    }
+    return out ? normalizeSelection(doc.cm, out, sel.primIndex) : sel
+  }
+
+  function skipAtomicInner(doc, pos, oldPos, dir, mayClear) {
+    var line = getLine(doc, pos.line);
+    if (line.markedSpans) { for (var i = 0; i < line.markedSpans.length; ++i) {
+      var sp = line.markedSpans[i], m = sp.marker;
+
+      // Determine if we should prevent the cursor being placed to the left/right of an atomic marker
+      // Historically this was determined using the inclusiveLeft/Right option, but the new way to control it
+      // is with selectLeft/Right
+      var preventCursorLeft = ("selectLeft" in m) ? !m.selectLeft : m.inclusiveLeft;
+      var preventCursorRight = ("selectRight" in m) ? !m.selectRight : m.inclusiveRight;
+
+      if ((sp.from == null || (preventCursorLeft ? sp.from <= pos.ch : sp.from < pos.ch)) &&
+          (sp.to == null || (preventCursorRight ? sp.to >= pos.ch : sp.to > pos.ch))) {
+        if (mayClear) {
+          signal(m, "beforeCursorEnter");
+          if (m.explicitlyCleared) {
+            if (!line.markedSpans) { break }
+            else {--i; continue}
+          }
+        }
+        if (!m.atomic) { continue }
+
+        if (oldPos) {
+          var near = m.find(dir < 0 ? 1 : -1), diff = (void 0);
+          if (dir < 0 ? preventCursorRight : preventCursorLeft)
+            { near = movePos(doc, near, -dir, near && near.line == pos.line ? line : null); }
+          if (near && near.line == pos.line && (diff = cmp(near, oldPos)) && (dir < 0 ? diff < 0 : diff > 0))
+            { return skipAtomicInner(doc, near, pos, dir, mayClear) }
+        }
+
+        var far = m.find(dir < 0 ? -1 : 1);
+        if (dir < 0 ? preventCursorLeft : preventCursorRight)
+          { far = movePos(doc, far, dir, far.line == pos.line ? line : null); }
+        return far ? skipAtomicInner(doc, far, pos, dir, mayClear) : null
+      }
+    } }
+    return pos
+  }
+
+  // Ensure a given position is not inside an atomic range.
+  function skipAtomic(doc, pos, oldPos, bias, mayClear) {
+    var dir = bias || 1;
+    var found = skipAtomicInner(doc, pos, oldPos, dir, mayClear) ||
+        (!mayClear && skipAtomicInner(doc, pos, oldPos, dir, true)) ||
+        skipAtomicInner(doc, pos, oldPos, -dir, mayClear) ||
+        (!mayClear && skipAtomicInner(doc, pos, oldPos, -dir, true));
+    if (!found) {
+      doc.cantEdit = true;
+      return Pos(doc.first, 0)
+    }
+    return found
+  }
+
+  function movePos(doc, pos, dir, line) {
+    if (dir < 0 && pos.ch == 0) {
+      if (pos.line > doc.first) { return clipPos(doc, Pos(pos.line - 1)) }
+      else { return null }
+    } else if (dir > 0 && pos.ch == (line || getLine(doc, pos.line)).text.length) {
+      if (pos.line < doc.first + doc.size - 1) { return Pos(pos.line + 1, 0) }
+      else { return null }
+    } else {
+      return new Pos(pos.line, pos.ch + dir)
+    }
+  }
+
+  function selectAll(cm) {
+    cm.setSelection(Pos(cm.firstLine(), 0), Pos(cm.lastLine()), sel_dontScroll);
+  }
+
+  // UPDATING
+
+  // Allow "beforeChange" event handlers to influence a change
+  function filterChange(doc, change, update) {
+    var obj = {
+      canceled: false,
+      from: change.from,
+      to: change.to,
+      text: change.text,
+      origin: change.origin,
+      cancel: function () { return obj.canceled = true; }
+    };
+    if (update) { obj.update = function (from, to, text, origin) {
+      if (from) { obj.from = clipPos(doc, from); }
+      if (to) { obj.to = clipPos(doc, to); }
+      if (text) { obj.text = text; }
+      if (origin !== undefined) { obj.origin = origin; }
+    }; }
+    signal(doc, "beforeChange", doc, obj);
+    if (doc.cm) { signal(doc.cm, "beforeChange", doc.cm, obj); }
+
+    if (obj.canceled) {
+      if (doc.cm) { doc.cm.curOp.updateInput = 2; }
+      return null
+    }
+    return {from: obj.from, to: obj.to, text: obj.text, origin: obj.origin}
+  }
+
+  // Apply a change to a document, and add it to the document's
+  // history, and propagating it to all linked documents.
+  function makeChange(doc, change, ignoreReadOnly) {
+    if (doc.cm) {
+      if (!doc.cm.curOp) { return operation(doc.cm, makeChange)(doc, change, ignoreReadOnly) }
+      if (doc.cm.state.suppressEdits) { return }
+    }
+
+    if (hasHandler(doc, "beforeChange") || doc.cm && hasHandler(doc.cm, "beforeChange")) {
+      change = filterChange(doc, change, true);
+      if (!change) { return }
+    }
+
+    // Possibly split or suppress the update based on the presence
+    // of read-only spans in its range.
+    var split = sawReadOnlySpans && !ignoreReadOnly && removeReadOnlyRanges(doc, change.from, change.to);
+    if (split) {
+      for (var i = split.length - 1; i >= 0; --i)
+        { makeChangeInner(doc, {from: split[i].from, to: split[i].to, text: i ? [""] : change.text, origin: change.origin}); }
+    } else {
+      makeChangeInner(doc, change);
+    }
+  }
+
+  function makeChangeInner(doc, change) {
+    if (change.text.length == 1 && change.text[0] == "" && cmp(change.from, change.to) == 0) { return }
+    var selAfter = computeSelAfterChange(doc, change);
+    addChangeToHistory(doc, change, selAfter, doc.cm ? doc.cm.curOp.id : NaN);
+
+    makeChangeSingleDoc(doc, change, selAfter, stretchSpansOverChange(doc, change));
+    var rebased = [];
+
+    linkedDocs(doc, function (doc, sharedHist) {
+      if (!sharedHist && indexOf(rebased, doc.history) == -1) {
+        rebaseHist(doc.history, change);
+        rebased.push(doc.history);
+      }
+      makeChangeSingleDoc(doc, change, null, stretchSpansOverChange(doc, change));
+    });
+  }
+
+  // Revert a change stored in a document's history.
+  function makeChangeFromHistory(doc, type, allowSelectionOnly) {
+    var suppress = doc.cm && doc.cm.state.suppressEdits;
+    if (suppress && !allowSelectionOnly) { return }
+
+    var hist = doc.history, event, selAfter = doc.sel;
+    var source = type == "undo" ? hist.done : hist.undone, dest = type == "undo" ? hist.undone : hist.done;
+
+    // Verify that there is a useable event (so that ctrl-z won't
+    // needlessly clear selection events)
+    var i = 0;
+    for (; i < source.length; i++) {
+      event = source[i];
+      if (allowSelectionOnly ? event.ranges && !event.equals(doc.sel) : !event.ranges)
+        { break }
+    }
+    if (i == source.length) { return }
+    hist.lastOrigin = hist.lastSelOrigin = null;
+
+    for (;;) {
+      event = source.pop();
+      if (event.ranges) {
+        pushSelectionToHistory(event, dest);
+        if (allowSelectionOnly && !event.equals(doc.sel)) {
+          setSelection(doc, event, {clearRedo: false});
+          return
+        }
+        selAfter = event;
+      } else if (suppress) {
+        source.push(event);
+        return
+      } else { break }
+    }
+
+    // Build up a reverse change object to add to the opposite history
+    // stack (redo when undoing, and vice versa).
+    var antiChanges = [];
+    pushSelectionToHistory(selAfter, dest);
+    dest.push({changes: antiChanges, generation: hist.generation});
+    hist.generation = event.generation || ++hist.maxGeneration;
+
+    var filter = hasHandler(doc, "beforeChange") || doc.cm && hasHandler(doc.cm, "beforeChange");
+
+    var loop = function ( i ) {
+      var change = event.changes[i];
+      change.origin = type;
+      if (filter && !filterChange(doc, change, false)) {
+        source.length = 0;
+        return {}
+      }
+
+      antiChanges.push(historyChangeFromChange(doc, change));
+
+      var after = i ? computeSelAfterChange(doc, change) : lst(source);
+      makeChangeSingleDoc(doc, change, after, mergeOldSpans(doc, change));
+      if (!i && doc.cm) { doc.cm.scrollIntoView({from: change.from, to: changeEnd(change)}); }
+      var rebased = [];
+
+      // Propagate to the linked documents
+      linkedDocs(doc, function (doc, sharedHist) {
+        if (!sharedHist && indexOf(rebased, doc.history) == -1) {
+          rebaseHist(doc.history, change);
+          rebased.push(doc.history);
+        }
+        makeChangeSingleDoc(doc, change, null, mergeOldSpans(doc, change));
+      });
+    };
+
+    for (var i$1 = event.changes.length - 1; i$1 >= 0; --i$1) {
+      var returned = loop( i$1 );
+
+      if ( returned ) return returned.v;
+    }
+  }
+
+  // Sub-views need their line numbers shifted when text is added
+  // above or below them in the parent document.
+  function shiftDoc(doc, distance) {
+    if (distance == 0) { return }
+    doc.first += distance;
+    doc.sel = new Selection(map(doc.sel.ranges, function (range) { return new Range(
+      Pos(range.anchor.line + distance, range.anchor.ch),
+      Pos(range.head.line + distance, range.head.ch)
+    ); }), doc.sel.primIndex);
+    if (doc.cm) {
+      regChange(doc.cm, doc.first, doc.first - distance, distance);
+      for (var d = doc.cm.display, l = d.viewFrom; l < d.viewTo; l++)
+        { regLineChange(doc.cm, l, "gutter"); }
+    }
+  }
+
+  // More lower-level change function, handling only a single document
+  // (not linked ones).
+  function makeChangeSingleDoc(doc, change, selAfter, spans) {
+    if (doc.cm && !doc.cm.curOp)
+      { return operation(doc.cm, makeChangeSingleDoc)(doc, change, selAfter, spans) }
+
+    if (change.to.line < doc.first) {
+      shiftDoc(doc, change.text.length - 1 - (change.to.line - change.from.line));
+      return
+    }
+    if (change.from.line > doc.lastLine()) { return }
+
+    // Clip the change to the size of this doc
+    if (change.from.line < doc.first) {
+      var shift = change.text.length - 1 - (doc.first - change.from.line);
+      shiftDoc(doc, shift);
+      change = {from: Pos(doc.first, 0), to: Pos(change.to.line + shift, change.to.ch),
+                text: [lst(change.text)], origin: change.origin};
+    }
+    var last = doc.lastLine();
+    if (change.to.line > last) {
+      change = {from: change.from, to: Pos(last, getLine(doc, last).text.length),
+                text: [change.text[0]], origin: change.origin};
+    }
+
+    change.removed = getBetween(doc, change.from, change.to);
+
+    if (!selAfter) { selAfter = computeSelAfterChange(doc, change); }
+    if (doc.cm) { makeChangeSingleDocInEditor(doc.cm, change, spans); }
+    else { updateDoc(doc, change, spans); }
+    setSelectionNoUndo(doc, selAfter, sel_dontScroll);
+
+    if (doc.cantEdit && skipAtomic(doc, Pos(doc.firstLine(), 0)))
+      { doc.cantEdit = false; }
+  }
+
+  // Handle the interaction of a change to a document with the editor
+  // that this document is part of.
+  function makeChangeSingleDocInEditor(cm, change, spans) {
+    var doc = cm.doc, display = cm.display, from = change.from, to = change.to;
+
+    var recomputeMaxLength = false, checkWidthStart = from.line;
+    if (!cm.options.lineWrapping) {
+      checkWidthStart = lineNo(visualLine(getLine(doc, from.line)));
+      doc.iter(checkWidthStart, to.line + 1, function (line) {
+        if (line == display.maxLine) {
+          recomputeMaxLength = true;
+          return true
+        }
+      });
+    }
+
+    if (doc.sel.contains(change.from, change.to) > -1)
+      { signalCursorActivity(cm); }
+
+    updateDoc(doc, change, spans, estimateHeight(cm));
+
+    if (!cm.options.lineWrapping) {
+      doc.iter(checkWidthStart, from.line + change.text.length, function (line) {
+        var len = lineLength(line);
+        if (len > display.maxLineLength) {
+          display.maxLine = line;
+          display.maxLineLength = len;
+          display.maxLineChanged = true;
+          recomputeMaxLength = false;
+        }
+      });
+      if (recomputeMaxLength) { cm.curOp.updateMaxLine = true; }
+    }
+
+    retreatFrontier(doc, from.line);
+    startWorker(cm, 400);
+
+    var lendiff = change.text.length - (to.line - from.line) - 1;
+    // Remember that these lines changed, for updating the display
+    if (change.full)
+      { regChange(cm); }
+    else if (from.line == to.line && change.text.length == 1 && !isWholeLineUpdate(cm.doc, change))
+      { regLineChange(cm, from.line, "text"); }
+    else
+      { regChange(cm, from.line, to.line + 1, lendiff); }
+
+    var changesHandler = hasHandler(cm, "changes"), changeHandler = hasHandler(cm, "change");
+    if (changeHandler || changesHandler) {
+      var obj = {
+        from: from, to: to,
+        text: change.text,
+        removed: change.removed,
+        origin: change.origin
+      };
+      if (changeHandler) { signalLater(cm, "change", cm, obj); }
+      if (changesHandler) { (cm.curOp.changeObjs || (cm.curOp.changeObjs = [])).push(obj); }
+    }
+    cm.display.selForContextMenu = null;
+  }
+
+  function replaceRange(doc, code, from, to, origin) {
+    var assign;
+
+    if (!to) { to = from; }
+    if (cmp(to, from) < 0) { (assign = [to, from], from = assign[0], to = assign[1]); }
+    if (typeof code == "string") { code = doc.splitLines(code); }
+    makeChange(doc, {from: from, to: to, text: code, origin: origin});
+  }
+
+  // Rebasing/resetting history to deal with externally-sourced changes
+
+  function rebaseHistSelSingle(pos, from, to, diff) {
+    if (to < pos.line) {
+      pos.line += diff;
+    } else if (from < pos.line) {
+      pos.line = from;
+      pos.ch = 0;
+    }
+  }
+
+  // Tries to rebase an array of history events given a change in the
+  // document. If the change touches the same lines as the event, the
+  // event, and everything 'behind' it, is discarded. If the change is
+  // before the event, the event's positions are updated. Uses a
+  // copy-on-write scheme for the positions, to avoid having to
+  // reallocate them all on every rebase, but also avoid problems with
+  // shared position objects being unsafely updated.
+  function rebaseHistArray(array, from, to, diff) {
+    for (var i = 0; i < array.length; ++i) {
+      var sub = array[i], ok = true;
+      if (sub.ranges) {
+        if (!sub.copied) { sub = array[i] = sub.deepCopy(); sub.copied = true; }
+        for (var j = 0; j < sub.ranges.length; j++) {
+          rebaseHistSelSingle(sub.ranges[j].anchor, from, to, diff);
+          rebaseHistSelSingle(sub.ranges[j].head, from, to, diff);
+        }
+        continue
+      }
+      for (var j$1 = 0; j$1 < sub.changes.length; ++j$1) {
+        var cur = sub.changes[j$1];
+        if (to < cur.from.line) {
+          cur.from = Pos(cur.from.line + diff, cur.from.ch);
+          cur.to = Pos(cur.to.line + diff, cur.to.ch);
+        } else if (from <= cur.to.line) {
+          ok = false;
+          break
+        }
+      }
+      if (!ok) {
+        array.splice(0, i + 1);
+        i = 0;
+      }
+    }
+  }
+
+  function rebaseHist(hist, change) {
+    var from = change.from.line, to = change.to.line, diff = change.text.length - (to - from) - 1;
+    rebaseHistArray(hist.done, from, to, diff);
+    rebaseHistArray(hist.undone, from, to, diff);
+  }
+
+  // Utility for applying a change to a line by handle or number,
+  // returning the number and optionally registering the line as
+  // changed.
+  function changeLine(doc, handle, changeType, op) {
+    var no = handle, line = handle;
+    if (typeof handle == "number") { line = getLine(doc, clipLine(doc, handle)); }
+    else { no = lineNo(handle); }
+    if (no == null) { return null }
+    if (op(line, no) && doc.cm) { regLineChange(doc.cm, no, changeType); }
+    return line
+  }
+
+  // The document is represented as a BTree consisting of leaves, with
+  // chunk of lines in them, and branches, with up to ten leaves or
+  // other branch nodes below them. The top node is always a branch
+  // node, and is the document object itself (meaning it has
+  // additional methods and properties).
+  //
+  // All nodes have parent links. The tree is used both to go from
+  // line numbers to line objects, and to go from objects to numbers.
+  // It also indexes by height, and is used to convert between height
+  // and line object, and to find the total height of the document.
+  //
+  // See also http://marijnhaverbeke.nl/blog/codemirror-line-tree.html
+
+  function LeafChunk(lines) {
+    var this$1 = this;
+
+    this.lines = lines;
+    this.parent = null;
+    var height = 0;
+    for (var i = 0; i < lines.length; ++i) {
+      lines[i].parent = this$1;
+      height += lines[i].height;
+    }
+    this.height = height;
+  }
+
+  LeafChunk.prototype = {
+    chunkSize: function() { return this.lines.length },
+
+    // Remove the n lines at offset 'at'.
+    removeInner: function(at, n) {
+      var this$1 = this;
+
+      for (var i = at, e = at + n; i < e; ++i) {
+        var line = this$1.lines[i];
+        this$1.height -= line.height;
+        cleanUpLine(line);
+        signalLater(line, "delete");
+      }
+      this.lines.splice(at, n);
+    },
+
+    // Helper used to collapse a small branch into a single leaf.
+    collapse: function(lines) {
+      lines.push.apply(lines, this.lines);
+    },
+
+    // Insert the given array of lines at offset 'at', count them as
+    // having the given height.
+    insertInner: function(at, lines, height) {
+      var this$1 = this;
+
+      this.height += height;
+      this.lines = this.lines.slice(0, at).concat(lines).concat(this.lines.slice(at));
+      for (var i = 0; i < lines.length; ++i) { lines[i].parent = this$1; }
+    },
+
+    // Used to iterate over a part of the tree.
+    iterN: function(at, n, op) {
+      var this$1 = this;
+
+      for (var e = at + n; at < e; ++at)
+        { if (op(this$1.lines[at])) { return true } }
+    }
+  };
+
+  function BranchChunk(children) {
+    var this$1 = this;
+
+    this.children = children;
+    var size = 0, height = 0;
+    for (var i = 0; i < children.length; ++i) {
+      var ch = children[i];
+      size += ch.chunkSize(); height += ch.height;
+      ch.parent = this$1;
+    }
+    this.size = size;
+    this.height = height;
+    this.parent = null;
+  }
+
+  BranchChunk.prototype = {
+    chunkSize: function() { return this.size },
+
+    removeInner: function(at, n) {
+      var this$1 = this;
+
+      this.size -= n;
+      for (var i = 0; i < this.children.length; ++i) {
+        var child = this$1.children[i], sz = child.chunkSize();
+        if (at < sz) {
+          var rm = Math.min(n, sz - at), oldHeight = child.height;
+          child.removeInner(at, rm);
+          this$1.height -= oldHeight - child.height;
+          if (sz == rm) { this$1.children.splice(i--, 1); child.parent = null; }
+          if ((n -= rm) == 0) { break }
+          at = 0;
+        } else { at -= sz; }
+      }
+      // If the result is smaller than 25 lines, ensure that it is a
+      // single leaf node.
+      if (this.size - n < 25 &&
+          (this.children.length > 1 || !(this.children[0] instanceof LeafChunk))) {
+        var lines = [];
+        this.collapse(lines);
+        this.children = [new LeafChunk(lines)];
+        this.children[0].parent = this;
+      }
+    },
+
+    collapse: function(lines) {
+      var this$1 = this;
+
+      for (var i = 0; i < this.children.length; ++i) { this$1.children[i].collapse(lines); }
+    },
+
+    insertInner: function(at, lines, height) {
+      var this$1 = this;
+
+      this.size += lines.length;
+      this.height += height;
+      for (var i = 0; i < this.children.length; ++i) {
+        var child = this$1.children[i], sz = child.chunkSize();
+        if (at <= sz) {
+          child.insertInner(at, lines, height);
+          if (child.lines && child.lines.length > 50) {
+            // To avoid memory thrashing when child.lines is huge (e.g. first view of a large file), it's never spliced.
+            // Instead, small slices are taken. They're taken in order because sequential memory accesses are fastest.
+            var remaining = child.lines.length % 25 + 25;
+            for (var pos = remaining; pos < child.lines.length;) {
+              var leaf = new LeafChunk(child.lines.slice(pos, pos += 25));
+              child.height -= leaf.height;
+              this$1.children.splice(++i, 0, leaf);
+              leaf.parent = this$1;
+            }
+            child.lines = child.lines.slice(0, remaining);
+            this$1.maybeSpill();
+          }
+          break
+        }
+        at -= sz;
+      }
+    },
+
+    // When a node has grown, check whether it should be split.
+    maybeSpill: function() {
+      if (this.children.length <= 10) { return }
+      var me = this;
+      do {
+        var spilled = me.children.splice(me.children.length - 5, 5);
+        var sibling = new BranchChunk(spilled);
+        if (!me.parent) { // Become the parent node
+          var copy = new BranchChunk(me.children);
+          copy.parent = me;
+          me.children = [copy, sibling];
+          me = copy;
+       } else {
+          me.size -= sibling.size;
+          me.height -= sibling.height;
+          var myIndex = indexOf(me.parent.children, me);
+          me.parent.children.splice(myIndex + 1, 0, sibling);
+        }
+        sibling.parent = me.parent;
+      } while (me.children.length > 10)
+      me.parent.maybeSpill();
+    },
+
+    iterN: function(at, n, op) {
+      var this$1 = this;
+
+      for (var i = 0; i < this.children.length; ++i) {
+        var child = this$1.children[i], sz = child.chunkSize();
+        if (at < sz) {
+          var used = Math.min(n, sz - at);
+          if (child.iterN(at, used, op)) { return true }
+          if ((n -= used) == 0) { break }
+          at = 0;
+        } else { at -= sz; }
+      }
+    }
+  };
+
+  // Line widgets are block elements displayed above or below a line.
+
+  var LineWidget = function(doc, node, options) {
+    var this$1 = this;
+
+    if (options) { for (var opt in options) { if (options.hasOwnProperty(opt))
+      { this$1[opt] = options[opt]; } } }
+    this.doc = doc;
+    this.node = node;
+  };
+
+  LineWidget.prototype.clear = function () {
+      var this$1 = this;
+
+    var cm = this.doc.cm, ws = this.line.widgets, line = this.line, no = lineNo(line);
+    if (no == null || !ws) { return }
+    for (var i = 0; i < ws.length; ++i) { if (ws[i] == this$1) { ws.splice(i--, 1); } }
+    if (!ws.length) { line.widgets = null; }
+    var height = widgetHeight(this);
+    updateLineHeight(line, Math.max(0, line.height - height));
+    if (cm) {
+      runInOp(cm, function () {
+        adjustScrollWhenAboveVisible(cm, line, -height);
+        regLineChange(cm, no, "widget");
+      });
+      signalLater(cm, "lineWidgetCleared", cm, this, no);
+    }
+  };
+
+  LineWidget.prototype.changed = function () {
+      var this$1 = this;
+
+    var oldH = this.height, cm = this.doc.cm, line = this.line;
+    this.height = null;
+    var diff = widgetHeight(this) - oldH;
+    if (!diff) { return }
+    if (!lineIsHidden(this.doc, line)) { updateLineHeight(line, line.height + diff); }
+    if (cm) {
+      runInOp(cm, function () {
+        cm.curOp.forceUpdate = true;
+        adjustScrollWhenAboveVisible(cm, line, diff);
+        signalLater(cm, "lineWidgetChanged", cm, this$1, lineNo(line));
+      });
+    }
+  };
+  eventMixin(LineWidget);
+
+  function adjustScrollWhenAboveVisible(cm, line, diff) {
+    if (heightAtLine(line) < ((cm.curOp && cm.curOp.scrollTop) || cm.doc.scrollTop))
+      { addToScrollTop(cm, diff); }
+  }
+
+  function addLineWidget(doc, handle, node, options) {
+    var widget = new LineWidget(doc, node, options);
+    var cm = doc.cm;
+    if (cm && widget.noHScroll) { cm.display.alignWidgets = true; }
+    changeLine(doc, handle, "widget", function (line) {
+      var widgets = line.widgets || (line.widgets = []);
+      if (widget.insertAt == null) { widgets.push(widget); }
+      else { widgets.splice(Math.min(widgets.length - 1, Math.max(0, widget.insertAt)), 0, widget); }
+      widget.line = line;
+      if (cm && !lineIsHidden(doc, line)) {
+        var aboveVisible = heightAtLine(line) < doc.scrollTop;
+        updateLineHeight(line, line.height + widgetHeight(widget));
+        if (aboveVisible) { addToScrollTop(cm, widget.height); }
+        cm.curOp.forceUpdate = true;
+      }
+      return true
+    });
+    if (cm) { signalLater(cm, "lineWidgetAdded", cm, widget, typeof handle == "number" ? handle : lineNo(handle)); }
+    return widget
+  }
+
+  // TEXTMARKERS
+
+  // Created with markText and setBookmark methods. A TextMarker is a
+  // handle that can be used to clear or find a marked position in the
+  // document. Line objects hold arrays (markedSpans) containing
+  // {from, to, marker} object pointing to such marker objects, and
+  // indicating that such a marker is present on that line. Multiple
+  // lines may point to the same marker when it spans across lines.
+  // The spans will have null for their from/to properties when the
+  // marker continues beyond the start/end of the line. Markers have
+  // links back to the lines they currently touch.
+
+  // Collapsed markers have unique ids, in order to be able to order
+  // them, which is needed for uniquely determining an outer marker
+  // when they overlap (they may nest, but not partially overlap).
+  var nextMarkerId = 0;
+
+  var TextMarker = function(doc, type) {
+    this.lines = [];
+    this.type = type;
+    this.doc = doc;
+    this.id = ++nextMarkerId;
+  };
+
+  // Clear the marker.
+  TextMarker.prototype.clear = function () {
+      var this$1 = this;
+
+    if (this.explicitlyCleared) { return }
+    var cm = this.doc.cm, withOp = cm && !cm.curOp;
+    if (withOp) { startOperation(cm); }
+    if (hasHandler(this, "clear")) {
+      var found = this.find();
+      if (found) { signalLater(this, "clear", found.from, found.to); }
+    }
+    var min = null, max = null;
+    for (var i = 0; i < this.lines.length; ++i) {
+      var line = this$1.lines[i];
+      var span = getMarkedSpanFor(line.markedSpans, this$1);
+      if (cm && !this$1.collapsed) { regLineChange(cm, lineNo(line), "text"); }
+      else if (cm) {
+        if (span.to != null) { max = lineNo(line); }
+        if (span.from != null) { min = lineNo(line); }
+      }
+      line.markedSpans = removeMarkedSpan(line.markedSpans, span);
+      if (span.from == null && this$1.collapsed && !lineIsHidden(this$1.doc, line) && cm)
+        { updateLineHeight(line, textHeight(cm.display)); }
+    }
+    if (cm && this.collapsed && !cm.options.lineWrapping) { for (var i$1 = 0; i$1 < this.lines.length; ++i$1) {
+      var visual = visualLine(this$1.lines[i$1]), len = lineLength(visual);
+      if (len > cm.display.maxLineLength) {
+        cm.display.maxLine = visual;
+        cm.display.maxLineLength = len;
+        cm.display.maxLineChanged = true;
+      }
+    } }
+
+    if (min != null && cm && this.collapsed) { regChange(cm, min, max + 1); }
+    this.lines.length = 0;
+    this.explicitlyCleared = true;
+    if (this.atomic && this.doc.cantEdit) {
+      this.doc.cantEdit = false;
+      if (cm) { reCheckSelection(cm.doc); }
+    }
+    if (cm) { signalLater(cm, "markerCleared", cm, this, min, max); }
+    if (withOp) { endOperation(cm); }
+    if (this.parent) { this.parent.clear(); }
+  };
+
+  // Find the position of the marker in the document. Returns a {from,
+  // to} object by default. Side can be passed to get a specific side
+  // -- 0 (both), -1 (left), or 1 (right). When lineObj is true, the
+  // Pos objects returned contain a line object, rather than a line
+  // number (used to prevent looking up the same line twice).
+  TextMarker.prototype.find = function (side, lineObj) {
+      var this$1 = this;
+
+    if (side == null && this.type == "bookmark") { side = 1; }
+    var from, to;
+    for (var i = 0; i < this.lines.length; ++i) {
+      var line = this$1.lines[i];
+      var span = getMarkedSpanFor(line.markedSpans, this$1);
+      if (span.from != null) {
+        from = Pos(lineObj ? line : lineNo(line), span.from);
+        if (side == -1) { return from }
+      }
+      if (span.to != null) {
+        to = Pos(lineObj ? line : lineNo(line), span.to);
+        if (side == 1) { return to }
+      }
+    }
+    return from && {from: from, to: to}
+  };
+
+  // Signals that the marker's widget changed, and surrounding layout
+  // should be recomputed.
+  TextMarker.prototype.changed = function () {
+      var this$1 = this;
+
+    var pos = this.find(-1, true), widget = this, cm = this.doc.cm;
+    if (!pos || !cm) { return }
+    runInOp(cm, function () {
+      var line = pos.line, lineN = lineNo(pos.line);
+      var view = findViewForLine(cm, lineN);
+      if (view) {
+        clearLineMeasurementCacheFor(view);
+        cm.curOp.selectionChanged = cm.curOp.forceUpdate = true;
+      }
+      cm.curOp.updateMaxLine = true;
+      if (!lineIsHidden(widget.doc, line) && widget.height != null) {
+        var oldHeight = widget.height;
+        widget.height = null;
+        var dHeight = widgetHeight(widget) - oldHeight;
+        if (dHeight)
+          { updateLineHeight(line, line.height + dHeight); }
+      }
+      signalLater(cm, "markerChanged", cm, this$1);
+    });
+  };
+
+  TextMarker.prototype.attachLine = function (line) {
+    if (!this.lines.length && this.doc.cm) {
+      var op = this.doc.cm.curOp;
+      if (!op.maybeHiddenMarkers || indexOf(op.maybeHiddenMarkers, this) == -1)
+        { (op.maybeUnhiddenMarkers || (op.maybeUnhiddenMarkers = [])).push(this); }
+    }
+    this.lines.push(line);
+  };
+
+  TextMarker.prototype.detachLine = function (line) {
+    this.lines.splice(indexOf(this.lines, line), 1);
+    if (!this.lines.length && this.doc.cm) {
+      var op = this.doc.cm.curOp
+      ;(op.maybeHiddenMarkers || (op.maybeHiddenMarkers = [])).push(this);
+    }
+  };
+  eventMixin(TextMarker);
+
+  // Create a marker, wire it up to the right lines, and
+  function markText(doc, from, to, options, type) {
+    // Shared markers (across linked documents) are handled separately
+    // (markTextShared will call out to this again, once per
+    // document).
+    if (options && options.shared) { return markTextShared(doc, from, to, options, type) }
+    // Ensure we are in an operation.
+    if (doc.cm && !doc.cm.curOp) { return operation(doc.cm, markText)(doc, from, to, options, type) }
+
+    var marker = new TextMarker(doc, type), diff = cmp(from, to);
+    if (options) { copyObj(options, marker, false); }
+    // Don't connect empty markers unless clearWhenEmpty is false
+    if (diff > 0 || diff == 0 && marker.clearWhenEmpty !== false)
+      { return marker }
+    if (marker.replacedWith) {
+      // Showing up as a widget implies collapsed (widget replaces text)
+      marker.collapsed = true;
+      marker.widgetNode = eltP("span", [marker.replacedWith], "CodeMirror-widget");
+      if (!options.handleMouseEvents) { marker.widgetNode.setAttribute("cm-ignore-events", "true"); }
+      if (options.insertLeft) { marker.widgetNode.insertLeft = true; }
+    }
+    if (marker.collapsed) {
+      if (conflictingCollapsedRange(doc, from.line, from, to, marker) ||
+          from.line != to.line && conflictingCollapsedRange(doc, to.line, from, to, marker))
+        { throw new Error("Inserting collapsed marker partially overlapping an existing one") }
+      seeCollapsedSpans();
+    }
+
+    if (marker.addToHistory)
+      { addChangeToHistory(doc, {from: from, to: to, origin: "markText"}, doc.sel, NaN); }
+
+    var curLine = from.line, cm = doc.cm, updateMaxLine;
+    doc.iter(curLine, to.line + 1, function (line) {
+      if (cm && marker.collapsed && !cm.options.lineWrapping && visualLine(line) == cm.display.maxLine)
+        { updateMaxLine = true; }
+      if (marker.collapsed && curLine != from.line) { updateLineHeight(line, 0); }
+      addMarkedSpan(line, new MarkedSpan(marker,
+                                         curLine == from.line ? from.ch : null,
+                                         curLine == to.line ? to.ch : null));
+      ++curLine;
+    });
+    // lineIsHidden depends on the presence of the spans, so needs a second pass
+    if (marker.collapsed) { doc.iter(from.line, to.line + 1, function (line) {
+      if (lineIsHidden(doc, line)) { updateLineHeight(line, 0); }
+    }); }
+
+    if (marker.clearOnEnter) { on(marker, "beforeCursorEnter", function () { return marker.clear(); }); }
+
+    if (marker.readOnly) {
+      seeReadOnlySpans();
+      if (doc.history.done.length || doc.history.undone.length)
+        { doc.clearHistory(); }
+    }
+    if (marker.collapsed) {
+      marker.id = ++nextMarkerId;
+      marker.atomic = true;
+    }
+    if (cm) {
+      // Sync editor state
+      if (updateMaxLine) { cm.curOp.updateMaxLine = true; }
+      if (marker.collapsed)
+        { regChange(cm, from.line, to.line + 1); }
+      else if (marker.className || marker.startStyle || marker.endStyle || marker.css ||
+               marker.attributes || marker.title)
+        { for (var i = from.line; i <= to.line; i++) { regLineChange(cm, i, "text"); } }
+      if (marker.atomic) { reCheckSelection(cm.doc); }
+      signalLater(cm, "markerAdded", cm, marker);
+    }
+    return marker
+  }
+
+  // SHARED TEXTMARKERS
+
+  // A shared marker spans multiple linked documents. It is
+  // implemented as a meta-marker-object controlling multiple normal
+  // markers.
+  var SharedTextMarker = function(markers, primary) {
+    var this$1 = this;
+
+    this.markers = markers;
+    this.primary = primary;
+    for (var i = 0; i < markers.length; ++i)
+      { markers[i].parent = this$1; }
+  };
+
+  SharedTextMarker.prototype.clear = function () {
+      var this$1 = this;
+
+    if (this.explicitlyCleared) { return }
+    this.explicitlyCleared = true;
+    for (var i = 0; i < this.markers.length; ++i)
+      { this$1.markers[i].clear(); }
+    signalLater(this, "clear");
+  };
+
+  SharedTextMarker.prototype.find = function (side, lineObj) {
+    return this.primary.find(side, lineObj)
+  };
+  eventMixin(SharedTextMarker);
+
+  function markTextShared(doc, from, to, options, type) {
+    options = copyObj(options);
+    options.shared = false;
+    var markers = [markText(doc, from, to, options, type)], primary = markers[0];
+    var widget = options.widgetNode;
+    linkedDocs(doc, function (doc) {
+      if (widget) { options.widgetNode = widget.cloneNode(true); }
+      markers.push(markText(doc, clipPos(doc, from), clipPos(doc, to), options, type));
+      for (var i = 0; i < doc.linked.length; ++i)
+        { if (doc.linked[i].isParent) { return } }
+      primary = lst(markers);
+    });
+    return new SharedTextMarker(markers, primary)
+  }
+
+  function findSharedMarkers(doc) {
+    return doc.findMarks(Pos(doc.first, 0), doc.clipPos(Pos(doc.lastLine())), function (m) { return m.parent; })
+  }
+
+  function copySharedMarkers(doc, markers) {
+    for (var i = 0; i < markers.length; i++) {
+      var marker = markers[i], pos = marker.find();
+      var mFrom = doc.clipPos(pos.from), mTo = doc.clipPos(pos.to);
+      if (cmp(mFrom, mTo)) {
+        var subMark = markText(doc, mFrom, mTo, marker.primary, marker.primary.type);
+        marker.markers.push(subMark);
+        subMark.parent = marker;
+      }
+    }
+  }
+
+  function detachSharedMarkers(markers) {
+    var loop = function ( i ) {
+      var marker = markers[i], linked = [marker.primary.doc];
+      linkedDocs(marker.primary.doc, function (d) { return linked.push(d); });
+      for (var j = 0; j < marker.markers.length; j++) {
+        var subMarker = marker.markers[j];
+        if (indexOf(linked, subMarker.doc) == -1) {
+          subMarker.parent = null;
+          marker.markers.splice(j--, 1);
+        }
+      }
+    };
+
+    for (var i = 0; i < markers.length; i++) loop( i );
+  }
+
+  var nextDocId = 0;
+  var Doc = function(text, mode, firstLine, lineSep, direction) {
+    if (!(this instanceof Doc)) { return new Doc(text, mode, firstLine, lineSep, direction) }
+    if (firstLine == null) { firstLine = 0; }
+
+    BranchChunk.call(this, [new LeafChunk([new Line("", null)])]);
+    this.first = firstLine;
+    this.scrollTop = this.scrollLeft = 0;
+    this.cantEdit = false;
+    this.cleanGeneration = 1;
+    this.modeFrontier = this.highlightFrontier = firstLine;
+    var start = Pos(firstLine, 0);
+    this.sel = simpleSelection(start);
+    this.history = new History(null);
+    this.id = ++nextDocId;
+    this.modeOption = mode;
+    this.lineSep = lineSep;
+    this.direction = (direction == "rtl") ? "rtl" : "ltr";
+    this.extend = false;
+
+    if (typeof text == "string") { text = this.splitLines(text); }
+    updateDoc(this, {from: start, to: start, text: text});
+    setSelection(this, simpleSelection(start), sel_dontScroll);
+  };
+
+  Doc.prototype = createObj(BranchChunk.prototype, {
+    constructor: Doc,
+    // Iterate over the document. Supports two forms -- with only one
+    // argument, it calls that for each line in the document. With
+    // three, it iterates over the range given by the first two (with
+    // the second being non-inclusive).
+    iter: function(from, to, op) {
+      if (op) { this.iterN(from - this.first, to - from, op); }
+      else { this.iterN(this.first, this.first + this.size, from); }
+    },
+
+    // Non-public interface for adding and removing lines.
+    insert: function(at, lines) {
+      var height = 0;
+      for (var i = 0; i < lines.length; ++i) { height += lines[i].height; }
+      this.insertInner(at - this.first, lines, height);
+    },
+    remove: function(at, n) { this.removeInner(at - this.first, n); },
+
+    // From here, the methods are part of the public interface. Most
+    // are also available from CodeMirror (editor) instances.
+
+    getValue: function(lineSep) {
+      var lines = getLines(this, this.first, this.first + this.size);
+      if (lineSep === false) { return lines }
+      return lines.join(lineSep || this.lineSeparator())
+    },
+    setValue: docMethodOp(function(code) {
+      var top = Pos(this.first, 0), last = this.first + this.size - 1;
+      makeChange(this, {from: top, to: Pos(last, getLine(this, last).text.length),
+                        text: this.splitLines(code), origin: "setValue", full: true}, true);
+      if (this.cm) { scrollToCoords(this.cm, 0, 0); }
+      setSelection(this, simpleSelection(top), sel_dontScroll);
+    }),
+    replaceRange: function(code, from, to, origin) {
+      from = clipPos(this, from);
+      to = to ? clipPos(this, to) : from;
+      replaceRange(this, code, from, to, origin);
+    },
+    getRange: function(from, to, lineSep) {
+      var lines = getBetween(this, clipPos(this, from), clipPos(this, to));
+      if (lineSep === false) { return lines }
+      return lines.join(lineSep || this.lineSeparator())
+    },
+
+    getLine: function(line) {var l = this.getLineHandle(line); return l && l.text},
+
+    getLineHandle: function(line) {if (isLine(this, line)) { return getLine(this, line) }},
+    getLineNumber: function(line) {return lineNo(line)},
+
+    getLineHandleVisualStart: function(line) {
+      if (typeof line == "number") { line = getLine(this, line); }
+      return visualLine(line)
+    },
+
+    lineCount: function() {return this.size},
+    firstLine: function() {return this.first},
+    lastLine: function() {return this.first + this.size - 1},
+
+    clipPos: function(pos) {return clipPos(this, pos)},
+
+    getCursor: function(start) {
+      var range$$1 = this.sel.primary(), pos;
+      if (start == null || start == "head") { pos = range$$1.head; }
+      else if (start == "anchor") { pos = range$$1.anchor; }
+      else if (start == "end" || start == "to" || start === false) { pos = range$$1.to(); }
+      else { pos = range$$1.from(); }
+      return pos
+    },
+    listSelections: function() { return this.sel.ranges },
+    somethingSelected: function() {return this.sel.somethingSelected()},
+
+    setCursor: docMethodOp(function(line, ch, options) {
+      setSimpleSelection(this, clipPos(this, typeof line == "number" ? Pos(line, ch || 0) : line), null, options);
+    }),
+    setSelection: docMethodOp(function(anchor, head, options) {
+      setSimpleSelection(this, clipPos(this, anchor), clipPos(this, head || anchor), options);
+    }),
+    extendSelection: docMethodOp(function(head, other, options) {
+      extendSelection(this, clipPos(this, head), other && clipPos(this, other), options);
+    }),
+    extendSelections: docMethodOp(function(heads, options) {
+      extendSelections(this, clipPosArray(this, heads), options);
+    }),
+    extendSelectionsBy: docMethodOp(function(f, options) {
+      var heads = map(this.sel.ranges, f);
+      extendSelections(this, clipPosArray(this, heads), options);
+    }),
+    setSelections: docMethodOp(function(ranges, primary, options) {
+      var this$1 = this;
+
+      if (!ranges.length) { return }
+      var out = [];
+      for (var i = 0; i < ranges.length; i++)
+        { out[i] = new Range(clipPos(this$1, ranges[i].anchor),
+                           clipPos(this$1, ranges[i].head)); }
+      if (primary == null) { primary = Math.min(ranges.length - 1, this.sel.primIndex); }
+      setSelection(this, normalizeSelection(this.cm, out, primary), options);
+    }),
+    addSelection: docMethodOp(function(anchor, head, options) {
+      var ranges = this.sel.ranges.slice(0);
+      ranges.push(new Range(clipPos(this, anchor), clipPos(this, head || anchor)));
+      setSelection(this, normalizeSelection(this.cm, ranges, ranges.length - 1), options);
+    }),
+
+    getSelection: function(lineSep) {
+      var this$1 = this;
+
+      var ranges = this.sel.ranges, lines;
+      for (var i = 0; i < ranges.length; i++) {
+        var sel = getBetween(this$1, ranges[i].from(), ranges[i].to());
+        lines = lines ? lines.concat(sel) : sel;
+      }
+      if (lineSep === false) { return lines }
+      else { return lines.join(lineSep || this.lineSeparator()) }
+    },
+    getSelections: function(lineSep) {
+      var this$1 = this;
+
+      var parts = [], ranges = this.sel.ranges;
+      for (var i = 0; i < ranges.length; i++) {
+        var sel = getBetween(this$1, ranges[i].from(), ranges[i].to());
+        if (lineSep !== false) { sel = sel.join(lineSep || this$1.lineSeparator()); }
+        parts[i] = sel;
+      }
+      return parts
+    },
+    replaceSelection: function(code, collapse, origin) {
+      var dup = [];
+      for (var i = 0; i < this.sel.ranges.length; i++)
+        { dup[i] = code; }
+      this.replaceSelections(dup, collapse, origin || "+input");
+    },
+    replaceSelections: docMethodOp(function(code, collapse, origin) {
+      var this$1 = this;
+
+      var changes = [], sel = this.sel;
+      for (var i = 0; i < sel.ranges.length; i++) {
+        var range$$1 = sel.ranges[i];
+        changes[i] = {from: range$$1.from(), to: range$$1.to(), text: this$1.splitLines(code[i]), origin: origin};
+      }
+      var newSel = collapse && collapse != "end" && computeReplacedSel(this, changes, collapse);
+      for (var i$1 = changes.length - 1; i$1 >= 0; i$1--)
+        { makeChange(this$1, changes[i$1]); }
+      if (newSel) { setSelectionReplaceHistory(this, newSel); }
+      else if (this.cm) { ensureCursorVisible(this.cm); }
+    }),
+    undo: docMethodOp(function() {makeChangeFromHistory(this, "undo");}),
+    redo: docMethodOp(function() {makeChangeFromHistory(this, "redo");}),
+    undoSelection: docMethodOp(function() {makeChangeFromHistory(this, "undo", true);}),
+    redoSelection: docMethodOp(function() {makeChangeFromHistory(this, "redo", true);}),
+
+    setExtending: function(val) {this.extend = val;},
+    getExtending: function() {return this.extend},
+
+    historySize: function() {
+      var hist = this.history, done = 0, undone = 0;
+      for (var i = 0; i < hist.done.length; i++) { if (!hist.done[i].ranges) { ++done; } }
+      for (var i$1 = 0; i$1 < hist.undone.length; i$1++) { if (!hist.undone[i$1].ranges) { ++undone; } }
+      return {undo: done, redo: undone}
+    },
+    clearHistory: function() {this.history = new History(this.history.maxGeneration);},
+
+    markClean: function() {
+      this.cleanGeneration = this.changeGeneration(true);
+    },
+    changeGeneration: function(forceSplit) {
+      if (forceSplit)
+        { this.history.lastOp = this.history.lastSelOp = this.history.lastOrigin = null; }
+      return this.history.generation
+    },
+    isClean: function (gen) {
+      return this.history.generation == (gen || this.cleanGeneration)
+    },
+
+    getHistory: function() {
+      return {done: copyHistoryArray(this.history.done),
+              undone: copyHistoryArray(this.history.undone)}
+    },
+    setHistory: function(histData) {
+      var hist = this.history = new History(this.history.maxGeneration);
+      hist.done = copyHistoryArray(histData.done.slice(0), null, true);
+      hist.undone = copyHistoryArray(histData.undone.slice(0), null, true);
+    },
+
+    setGutterMarker: docMethodOp(function(line, gutterID, value) {
+      return changeLine(this, line, "gutter", function (line) {
+        var markers = line.gutterMarkers || (line.gutterMarkers = {});
+        markers[gutterID] = value;
+        if (!value && isEmpty(markers)) { line.gutterMarkers = null; }
+        return true
+      })
+    }),
+
+    clearGutter: docMethodOp(function(gutterID) {
+      var this$1 = this;
+
+      this.iter(function (line) {
+        if (line.gutterMarkers && line.gutterMarkers[gutterID]) {
+          changeLine(this$1, line, "gutter", function () {
+            line.gutterMarkers[gutterID] = null;
+            if (isEmpty(line.gutterMarkers)) { line.gutterMarkers = null; }
+            return true
+          });
+        }
+      });
+    }),
+
+    lineInfo: function(line) {
+      var n;
+      if (typeof line == "number") {
+        if (!isLine(this, line)) { return null }
+        n = line;
+        line = getLine(this, line);
+        if (!line) { return null }
+      } else {
+        n = lineNo(line);
+        if (n == null) { return null }
+      }
+      return {line: n, handle: line, text: line.text, gutterMarkers: line.gutterMarkers,
+              textClass: line.textClass, bgClass: line.bgClass, wrapClass: line.wrapClass,
+              widgets: line.widgets}
+    },
+
+    addLineClass: docMethodOp(function(handle, where, cls) {
+      return changeLine(this, handle, where == "gutter" ? "gutter" : "class", function (line) {
+        var prop = where == "text" ? "textClass"
+                 : where == "background" ? "bgClass"
+                 : where == "gutter" ? "gutterClass" : "wrapClass";
+        if (!line[prop]) { line[prop] = cls; }
+        else if (classTest(cls).test(line[prop])) { return false }
+        else { line[prop] += " " + cls; }
+        return true
+      })
+    }),
+    removeLineClass: docMethodOp(function(handle, where, cls) {
+      return changeLine(this, handle, where == "gutter" ? "gutter" : "class", function (line) {
+        var prop = where == "text" ? "textClass"
+                 : where == "background" ? "bgClass"
+                 : where == "gutter" ? "gutterClass" : "wrapClass";
+        var cur = line[prop];
+        if (!cur) { return false }
+        else if (cls == null) { line[prop] = null; }
+        else {
+          var found = cur.match(classTest(cls));
+          if (!found) { return false }
+          var end = found.index + found[0].length;
+          line[prop] = cur.slice(0, found.index) + (!found.index || end == cur.length ? "" : " ") + cur.slice(end) || null;
+        }
+        return true
+      })
+    }),
+
+    addLineWidget: docMethodOp(function(handle, node, options) {
+      return addLineWidget(this, handle, node, options)
+    }),
+    removeLineWidget: function(widget) { widget.clear(); },
+
+    markText: function(from, to, options) {
+      return markText(this, clipPos(this, from), clipPos(this, to), options, options && options.type || "range")
+    },
+    setBookmark: function(pos, options) {
+      var realOpts = {replacedWith: options && (options.nodeType == null ? options.widget : options),
+                      insertLeft: options && options.insertLeft,
+                      clearWhenEmpty: false, shared: options && options.shared,
+                      handleMouseEvents: options && options.handleMouseEvents};
+      pos = clipPos(this, pos);
+      return markText(this, pos, pos, realOpts, "bookmark")
+    },
+    findMarksAt: function(pos) {
+      pos = clipPos(this, pos);
+      var markers = [], spans = getLine(this, pos.line).markedSpans;
+      if (spans) { for (var i = 0; i < spans.length; ++i) {
+        var span = spans[i];
+        if ((span.from == null || span.from <= pos.ch) &&
+            (span.to == null || span.to >= pos.ch))
+          { markers.push(span.marker.parent || span.marker); }
+      } }
+      return markers
+    },
+    findMarks: function(from, to, filter) {
+      from = clipPos(this, from); to = clipPos(this, to);
+      var found = [], lineNo$$1 = from.line;
+      this.iter(from.line, to.line + 1, function (line) {
+        var spans = line.markedSpans;
+        if (spans) { for (var i = 0; i < spans.length; i++) {
+          var span = spans[i];
+          if (!(span.to != null && lineNo$$1 == from.line && from.ch >= span.to ||
+                span.from == null && lineNo$$1 != from.line ||
+                span.from != null && lineNo$$1 == to.line && span.from >= to.ch) &&
+              (!filter || filter(span.marker)))
+            { found.push(span.marker.parent || span.marker); }
+        } }
+        ++lineNo$$1;
+      });
+      return found
+    },
+    getAllMarks: function() {
+      var markers = [];
+      this.iter(function (line) {
+        var sps = line.markedSpans;
+        if (sps) { for (var i = 0; i < sps.length; ++i)
+          { if (sps[i].from != null) { markers.push(sps[i].marker); } } }
+      });
+      return markers
+    },
+
+    posFromIndex: function(off) {
+      var ch, lineNo$$1 = this.first, sepSize = this.lineSeparator().length;
+      this.iter(function (line) {
+        var sz = line.text.length + sepSize;
+        if (sz > off) { ch = off; return true }
+        off -= sz;
+        ++lineNo$$1;
+      });
+      return clipPos(this, Pos(lineNo$$1, ch))
+    },
+    indexFromPos: function (coords) {
+      coords = clipPos(this, coords);
+      var index = coords.ch;
+      if (coords.line < this.first || coords.ch < 0) { return 0 }
+      var sepSize = this.lineSeparator().length;
+      this.iter(this.first, coords.line, function (line) { // iter aborts when callback returns a truthy value
+        index += line.text.length + sepSize;
+      });
+      return index
+    },
+
+    copy: function(copyHistory) {
+      var doc = new Doc(getLines(this, this.first, this.first + this.size),
+                        this.modeOption, this.first, this.lineSep, this.direction);
+      doc.scrollTop = this.scrollTop; doc.scrollLeft = this.scrollLeft;
+      doc.sel = this.sel;
+      doc.extend = false;
+      if (copyHistory) {
+        doc.history.undoDepth = this.history.undoDepth;
+        doc.setHistory(this.getHistory());
+      }
+      return doc
+    },
+
+    linkedDoc: function(options) {
+      if (!options) { options = {}; }
+      var from = this.first, to = this.first + this.size;
+      if (options.from != null && options.from > from) { from = options.from; }
+      if (options.to != null && options.to < to) { to = options.to; }
+      var copy = new Doc(getLines(this, from, to), options.mode || this.modeOption, from, this.lineSep, this.direction);
+      if (options.sharedHist) { copy.history = this.history
+      ; }(this.linked || (this.linked = [])).push({doc: copy, sharedHist: options.sharedHist});
+      copy.linked = [{doc: this, isParent: true, sharedHist: options.sharedHist}];
+      copySharedMarkers(copy, findSharedMarkers(this));
+      return copy
+    },
+    unlinkDoc: function(other) {
+      var this$1 = this;
+
+      if (other instanceof CodeMirror) { other = other.doc; }
+      if (this.linked) { for (var i = 0; i < this.linked.length; ++i) {
+        var link = this$1.linked[i];
+        if (link.doc != other) { continue }
+        this$1.linked.splice(i, 1);
+        other.unlinkDoc(this$1);
+        detachSharedMarkers(findSharedMarkers(this$1));
+        break
+      } }
+      // If the histories were shared, split them again
+      if (other.history == this.history) {
+        var splitIds = [other.id];
+        linkedDocs(other, function (doc) { return splitIds.push(doc.id); }, true);
+        other.history = new History(null);
+        other.history.done = copyHistoryArray(this.history.done, splitIds);
+        other.history.undone = copyHistoryArray(this.history.undone, splitIds);
+      }
+    },
+    iterLinkedDocs: function(f) {linkedDocs(this, f);},
+
+    getMode: function() {return this.mode},
+    getEditor: function() {return this.cm},
+
+    splitLines: function(str) {
+      if (this.lineSep) { return str.split(this.lineSep) }
+      return splitLinesAuto(str)
+    },
+    lineSeparator: function() { return this.lineSep || "\n" },
+
+    setDirection: docMethodOp(function (dir) {
+      if (dir != "rtl") { dir = "ltr"; }
+      if (dir == this.direction) { return }
+      this.direction = dir;
+      this.iter(function (line) { return line.order = null; });
+      if (this.cm) { directionChanged(this.cm); }
+    })
+  });
+
+  // Public alias.
+  Doc.prototype.eachLine = Doc.prototype.iter;
+
+  // Kludge to work around strange IE behavior where it'll sometimes
+  // re-fire a series of drag-related events right after the drop (#1551)
+  var lastDrop = 0;
+
+  function onDrop(e) {
+    var cm = this;
+    clearDragCursor(cm);
+    if (signalDOMEvent(cm, e) || eventInWidget(cm.display, e))
+      { return }
+    e_preventDefault(e);
+    if (ie) { lastDrop = +new Date; }
+    var pos = posFromMouse(cm, e, true), files = e.dataTransfer.files;
+    if (!pos || cm.isReadOnly()) { return }
+    // Might be a file drop, in which case we simply extract the text
+    // and insert it.
+    if (files && files.length && window.FileReader && window.File) {
+      var n = files.length, text = Array(n), read = 0;
+      var loadFile = function (file, i) {
+        if (cm.options.allowDropFileTypes &&
+            indexOf(cm.options.allowDropFileTypes, file.type) == -1)
+          { return }
+
+        var reader = new FileReader;
+        reader.onload = operation(cm, function () {
+          var content = reader.result;
+          if (/[\x00-\x08\x0e-\x1f]{2}/.test(content)) { content = ""; }
+          text[i] = content;
+          if (++read == n) {
+            pos = clipPos(cm.doc, pos);
+            var change = {from: pos, to: pos,
+                          text: cm.doc.splitLines(text.join(cm.doc.lineSeparator())),
+                          origin: "paste"};
+            makeChange(cm.doc, change);
+            setSelectionReplaceHistory(cm.doc, simpleSelection(pos, changeEnd(change)));
+          }
+        });
+        reader.readAsText(file);
+      };
+      for (var i = 0; i < n; ++i) { loadFile(files[i], i); }
+    } else { // Normal drop
+      // Don't do a replace if the drop happened inside of the selected text.
+      if (cm.state.draggingText && cm.doc.sel.contains(pos) > -1) {
+        cm.state.draggingText(e);
+        // Ensure the editor is re-focused
+        setTimeout(function () { return cm.display.input.focus(); }, 20);
+        return
+      }
+      try {
+        var text$1 = e.dataTransfer.getData("Text");
+        if (text$1) {
+          var selected;
+          if (cm.state.draggingText && !cm.state.draggingText.copy)
+            { selected = cm.listSelections(); }
+          setSelectionNoUndo(cm.doc, simpleSelection(pos, pos));
+          if (selected) { for (var i$1 = 0; i$1 < selected.length; ++i$1)
+            { replaceRange(cm.doc, "", selected[i$1].anchor, selected[i$1].head, "drag"); } }
+          cm.replaceSelection(text$1, "around", "paste");
+          cm.display.input.focus();
+        }
+      }
+      catch(e){}
+    }
+  }
+
+  function onDragStart(cm, e) {
+    if (ie && (!cm.state.draggingText || +new Date - lastDrop < 100)) { e_stop(e); return }
+    if (signalDOMEvent(cm, e) || eventInWidget(cm.display, e)) { return }
+
+    e.dataTransfer.setData("Text", cm.getSelection());
+    e.dataTransfer.effectAllowed = "copyMove";
+
+    // Use dummy image instead of default browsers image.
+    // Recent Safari (~6.0.2) have a tendency to segfault when this happens, so we don't do it there.
+    if (e.dataTransfer.setDragImage && !safari) {
+      var img = elt("img", null, null, "position: fixed; left: 0; top: 0;");
+      img.src = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";
+      if (presto) {
+        img.width = img.height = 1;
+        cm.display.wrapper.appendChild(img);
+        // Force a relayout, or Opera won't use our image for some obscure reason
+        img._top = img.offsetTop;
+      }
+      e.dataTransfer.setDragImage(img, 0, 0);
+      if (presto) { img.parentNode.removeChild(img); }
+    }
+  }
+
+  function onDragOver(cm, e) {
+    var pos = posFromMouse(cm, e);
+    if (!pos) { return }
+    var frag = document.createDocumentFragment();
+    drawSelectionCursor(cm, pos, frag);
+    if (!cm.display.dragCursor) {
+      cm.display.dragCursor = elt("div", null, "CodeMirror-cursors CodeMirror-dragcursors");
+      cm.display.lineSpace.insertBefore(cm.display.dragCursor, cm.display.cursorDiv);
+    }
+    removeChildrenAndAdd(cm.display.dragCursor, frag);
+  }
+
+  function clearDragCursor(cm) {
+    if (cm.display.dragCursor) {
+      cm.display.lineSpace.removeChild(cm.display.dragCursor);
+      cm.display.dragCursor = null;
+    }
+  }
+
+  // These must be handled carefully, because naively registering a
+  // handler for each editor will cause the editors to never be
+  // garbage collected.
+
+  function forEachCodeMirror(f) {
+    if (!document.getElementsByClassName) { return }
+    var byClass = document.getElementsByClassName("CodeMirror"), editors = [];
+    for (var i = 0; i < byClass.length; i++) {
+      var cm = byClass[i].CodeMirror;
+      if (cm) { editors.push(cm); }
+    }
+    if (editors.length) { editors[0].operation(function () {
+      for (var i = 0; i < editors.length; i++) { f(editors[i]); }
+    }); }
+  }
+
+  var globalsRegistered = false;
+  function ensureGlobalHandlers() {
+    if (globalsRegistered) { return }
+    registerGlobalHandlers();
+    globalsRegistered = true;
+  }
+  function registerGlobalHandlers() {
+    // When the window resizes, we need to refresh active editors.
+    var resizeTimer;
+    on(window, "resize", function () {
+      if (resizeTimer == null) { resizeTimer = setTimeout(function () {
+        resizeTimer = null;
+        forEachCodeMirror(onResize);
+      }, 100); }
+    });
+    // When the window loses focus, we want to show the editor as blurred
+    on(window, "blur", function () { return forEachCodeMirror(onBlur); });
+  }
+  // Called when the window resizes
+  function onResize(cm) {
+    var d = cm.display;
+    // Might be a text scaling operation, clear size caches.
+    d.cachedCharWidth = d.cachedTextHeight = d.cachedPaddingH = null;
+    d.scrollbarsClipped = false;
+    cm.setSize();
+  }
+
+  var keyNames = {
+    3: "Pause", 8: "Backspace", 9: "Tab", 13: "Enter", 16: "Shift", 17: "Ctrl", 18: "Alt",
+    19: "Pause", 20: "CapsLock", 27: "Esc", 32: "Space", 33: "PageUp", 34: "PageDown", 35: "End",
+    36: "Home", 37: "Left", 38: "Up", 39: "Right", 40: "Down", 44: "PrintScrn", 45: "Insert",
+    46: "Delete", 59: ";", 61: "=", 91: "Mod", 92: "Mod", 93: "Mod",
+    106: "*", 107: "=", 109: "-", 110: ".", 111: "/", 145: "ScrollLock",
+    173: "-", 186: ";", 187: "=", 188: ",", 189: "-", 190: ".", 191: "/", 192: "`", 219: "[", 220: "\\",
+    221: "]", 222: "'", 63232: "Up", 63233: "Down", 63234: "Left", 63235: "Right", 63272: "Delete",
+    63273: "Home", 63275: "End", 63276: "PageUp", 63277: "PageDown", 63302: "Insert"
+  };
+
+  // Number keys
+  for (var i = 0; i < 10; i++) { keyNames[i + 48] = keyNames[i + 96] = String(i); }
+  // Alphabetic keys
+  for (var i$1 = 65; i$1 <= 90; i$1++) { keyNames[i$1] = String.fromCharCode(i$1); }
+  // Function keys
+  for (var i$2 = 1; i$2 <= 12; i$2++) { keyNames[i$2 + 111] = keyNames[i$2 + 63235] = "F" + i$2; }
+
+  var keyMap = {};
+
+  keyMap.basic = {
+    "Left": "goCharLeft", "Right": "goCharRight", "Up": "goLineUp", "Down": "goLineDown",
+    "End": "goLineEnd", "Home": "goLineStartSmart", "PageUp": "goPageUp", "PageDown": "goPageDown",
+    "Delete": "delCharAfter", "Backspace": "delCharBefore", "Shift-Backspace": "delCharBefore",
+    "Tab": "defaultTab", "Shift-Tab": "indentAuto",
+    "Enter": "newlineAndIndent", "Insert": "toggleOverwrite",
+    "Esc": "singleSelection"
+  };
+  // Note that the save and find-related commands aren't defined by
+  // default. User code or addons can define them. Unknown commands
+  // are simply ignored.
+  keyMap.pcDefault = {
+    "Ctrl-A": "selectAll", "Ctrl-D": "deleteLine", "Ctrl-Z": "undo", "Shift-Ctrl-Z": "redo", "Ctrl-Y": "redo",
+    "Ctrl-Home": "goDocStart", "Ctrl-End": "goDocEnd", "Ctrl-Up": "goLineUp", "Ctrl-Down": "goLineDown",
+    "Ctrl-Left": "goGroupLeft", "Ctrl-Right": "goGroupRight", "Alt-Left": "goLineStart", "Alt-Right": "goLineEnd",
+    "Ctrl-Backspace": "delGroupBefore", "Ctrl-Delete": "delGroupAfter", "Ctrl-S": "save", "Ctrl-F": "find",
+    "Ctrl-G": "findNext", "Shift-Ctrl-G": "findPrev", "Shift-Ctrl-F": "replace", "Shift-Ctrl-R": "replaceAll",
+    "Ctrl-[": "indentLess", "Ctrl-]": "indentMore",
+    "Ctrl-U": "undoSelection", "Shift-Ctrl-U": "redoSelection", "Alt-U": "redoSelection",
+    "fallthrough": "basic"
+  };
+  // Very basic readline/emacs-style bindings, which are standard on Mac.
+  keyMap.emacsy = {
+    "Ctrl-F": "goCharRight", "Ctrl-B": "goCharLeft", "Ctrl-P": "goLineUp", "Ctrl-N": "goLineDown",
+    "Alt-F": "goWordRight", "Alt-B": "goWordLeft", "Ctrl-A": "goLineStart", "Ctrl-E": "goLineEnd",
+    "Ctrl-V": "goPageDown", "Shift-Ctrl-V": "goPageUp", "Ctrl-D": "delCharAfter", "Ctrl-H": "delCharBefore",
+    "Alt-D": "delWordAfter", "Alt-Backspace": "delWordBefore", "Ctrl-K": "killLine", "Ctrl-T": "transposeChars",
+    "Ctrl-O": "openLine"
+  };
+  keyMap.macDefault = {
+    "Cmd-A": "selectAll", "Cmd-D": "deleteLine", "Cmd-Z": "undo", "Shift-Cmd-Z": "redo", "Cmd-Y": "redo",
+    "Cmd-Home": "goDocStart", "Cmd-Up": "goDocStart", "Cmd-End": "goDocEnd", "Cmd-Down": "goDocEnd", "Alt-Left": "goGroupLeft",
+    "Alt-Right": "goGroupRight", "Cmd-Left": "goLineLeft", "Cmd-Right": "goLineRight", "Alt-Backspace": "delGroupBefore",
+    "Ctrl-Alt-Backspace": "delGroupAfter", "Alt-Delete": "delGroupAfter", "Cmd-S": "save", "Cmd-F": "find",
+    "Cmd-G": "findNext", "Shift-Cmd-G": "findPrev", "Cmd-Alt-F": "replace", "Shift-Cmd-Alt-F": "replaceAll",
+    "Cmd-[": "indentLess", "Cmd-]": "indentMore", "Cmd-Backspace": "delWrappedLineLeft", "Cmd-Delete": "delWrappedLineRight",
+    "Cmd-U": "undoSelection", "Shift-Cmd-U": "redoSelection", "Ctrl-Up": "goDocStart", "Ctrl-Down": "goDocEnd",
+    "fallthrough": ["basic", "emacsy"]
+  };
+  keyMap["default"] = mac ? keyMap.macDefault : keyMap.pcDefault;
+
+  // KEYMAP DISPATCH
+
+  function normalizeKeyName(name) {
+    var parts = name.split(/-(?!$)/);
+    name = parts[parts.length - 1];
+    var alt, ctrl, shift, cmd;
+    for (var i = 0; i < parts.length - 1; i++) {
+      var mod = parts[i];
+      if (/^(cmd|meta|m)$/i.test(mod)) { cmd = true; }
+      else if (/^a(lt)?$/i.test(mod)) { alt = true; }
+      else if (/^(c|ctrl|control)$/i.test(mod)) { ctrl = true; }
+      else if (/^s(hift)?$/i.test(mod)) { shift = true; }
+      else { throw new Error("Unrecognized modifier name: " + mod) }
+    }
+    if (alt) { name = "Alt-" + name; }
+    if (ctrl) { name = "Ctrl-" + name; }
+    if (cmd) { name = "Cmd-" + name; }
+    if (shift) { name = "Shift-" + name; }
+    return name
+  }
+
+  // This is a kludge to keep keymaps mostly working as raw objects
+  // (backwards compatibility) while at the same time support features
+  // like normalization and multi-stroke key bindings. It compiles a
+  // new normalized keymap, and then updates the old object to reflect
+  // this.
+  function normalizeKeyMap(keymap) {
+    var copy = {};
+    for (var keyname in keymap) { if (keymap.hasOwnProperty(keyname)) {
+      var value = keymap[keyname];
+      if (/^(name|fallthrough|(de|at)tach)$/.test(keyname)) { continue }
+      if (value == "...") { delete keymap[keyname]; continue }
+
+      var keys = map(keyname.split(" "), normalizeKeyName);
+      for (var i = 0; i < keys.length; i++) {
+        var val = (void 0), name = (void 0);
+        if (i == keys.length - 1) {
+          name = keys.join(" ");
+          val = value;
+        } else {
+          name = keys.slice(0, i + 1).join(" ");
+          val = "...";
+        }
+        var prev = copy[name];
+        if (!prev) { copy[name] = val; }
+        else if (prev != val) { throw new Error("Inconsistent bindings for " + name) }
+      }
+      delete keymap[keyname];
+    } }
+    for (var prop in copy) { keymap[prop] = copy[prop]; }
+    return keymap
+  }
+
+  function lookupKey(key, map$$1, handle, context) {
+    map$$1 = getKeyMap(map$$1);
+    var found = map$$1.call ? map$$1.call(key, context) : map$$1[key];
+    if (found === false) { return "nothing" }
+    if (found === "...") { return "multi" }
+    if (found != null && handle(found)) { return "handled" }
+
+    if (map$$1.fallthrough) {
+      if (Object.prototype.toString.call(map$$1.fallthrough) != "[object Array]")
+        { return lookupKey(key, map$$1.fallthrough, handle, context) }
+      for (var i = 0; i < map$$1.fallthrough.length; i++) {
+        var result = lookupKey(key, map$$1.fallthrough[i], handle, context);
+        if (result) { return result }
+      }
+    }
+  }
+
+  // Modifier key presses don't count as 'real' key presses for the
+  // purpose of keymap fallthrough.
+  function isModifierKey(value) {
+    var name = typeof value == "string" ? value : keyNames[value.keyCode];
+    return name == "Ctrl" || name == "Alt" || name == "Shift" || name == "Mod"
+  }
+
+  function addModifierNames(name, event, noShift) {
+    var base = name;
+    if (event.altKey && base != "Alt") { name = "Alt-" + name; }
+    if ((flipCtrlCmd ? event.metaKey : event.ctrlKey) && base != "Ctrl") { name = "Ctrl-" + name; }
+    if ((flipCtrlCmd ? event.ctrlKey : event.metaKey) && base != "Cmd") { name = "Cmd-" + name; }
+    if (!noShift && event.shiftKey && base != "Shift") { name = "Shift-" + name; }
+    return name
+  }
+
+  // Look up the name of a key as indicated by an event object.
+  function keyName(event, noShift) {
+    if (presto && event.keyCode == 34 && event["char"]) { return false }
+    var name = keyNames[event.keyCode];
+    if (name == null || event.altGraphKey) { return false }
+    // Ctrl-ScrollLock has keyCode 3, same as Ctrl-Pause,
+    // so we'll use event.code when available (Chrome 48+, FF 38+, Safari 10.1+)
+    if (event.keyCode == 3 && event.code) { name = event.code; }
+    return addModifierNames(name, event, noShift)
+  }
+
+  function getKeyMap(val) {
+    return typeof val == "string" ? keyMap[val] : val
+  }
+
+  // Helper for deleting text near the selection(s), used to implement
+  // backspace, delete, and similar functionality.
+  function deleteNearSelection(cm, compute) {
+    var ranges = cm.doc.sel.ranges, kill = [];
+    // Build up a set of ranges to kill first, merging overlapping
+    // ranges.
+    for (var i = 0; i < ranges.length; i++) {
+      var toKill = compute(ranges[i]);
+      while (kill.length && cmp(toKill.from, lst(kill).to) <= 0) {
+        var replaced = kill.pop();
+        if (cmp(replaced.from, toKill.from) < 0) {
+          toKill.from = replaced.from;
+          break
+        }
+      }
+      kill.push(toKill);
+    }
+    // Next, remove those actual ranges.
+    runInOp(cm, function () {
+      for (var i = kill.length - 1; i >= 0; i--)
+        { replaceRange(cm.doc, "", kill[i].from, kill[i].to, "+delete"); }
+      ensureCursorVisible(cm);
+    });
+  }
+
+  function moveCharLogically(line, ch, dir) {
+    var target = skipExtendingChars(line.text, ch + dir, dir);
+    return target < 0 || target > line.text.length ? null : target
+  }
+
+  function moveLogically(line, start, dir) {
+    var ch = moveCharLogically(line, start.ch, dir);
+    return ch == null ? null : new Pos(start.line, ch, dir < 0 ? "after" : "before")
+  }
+
+  function endOfLine(visually, cm, lineObj, lineNo, dir) {
+    if (visually) {
+      var order = getOrder(lineObj, cm.doc.direction);
+      if (order) {
+        var part = dir < 0 ? lst(order) : order[0];
+        var moveInStorageOrder = (dir < 0) == (part.level == 1);
+        var sticky = moveInStorageOrder ? "after" : "before";
+        var ch;
+        // With a wrapped rtl chunk (possibly spanning multiple bidi parts),
+        // it could be that the last bidi part is not on the last visual line,
+        // since visual lines contain content order-consecutive chunks.
+        // Thus, in rtl, we are looking for the first (content-order) character
+        // in the rtl chunk that is on the last line (that is, the same line
+        // as the last (content-order) character).
+        if (part.level > 0 || cm.doc.direction == "rtl") {
+          var prep = prepareMeasureForLine(cm, lineObj);
+          ch = dir < 0 ? lineObj.text.length - 1 : 0;
+          var targetTop = measureCharPrepared(cm, prep, ch).top;
+          ch = findFirst(function (ch) { return measureCharPrepared(cm, prep, ch).top == targetTop; }, (dir < 0) == (part.level == 1) ? part.from : part.to - 1, ch);
+          if (sticky == "before") { ch = moveCharLogically(lineObj, ch, 1); }
+        } else { ch = dir < 0 ? part.to : part.from; }
+        return new Pos(lineNo, ch, sticky)
+      }
+    }
+    return new Pos(lineNo, dir < 0 ? lineObj.text.length : 0, dir < 0 ? "before" : "after")
+  }
+
+  function moveVisually(cm, line, start, dir) {
+    var bidi = getOrder(line, cm.doc.direction);
+    if (!bidi) { return moveLogically(line, start, dir) }
+    if (start.ch >= line.text.length) {
+      start.ch = line.text.length;
+      start.sticky = "before";
+    } else if (start.ch <= 0) {
+      start.ch = 0;
+      start.sticky = "after";
+    }
+    var partPos = getBidiPartAt(bidi, start.ch, start.sticky), part = bidi[partPos];
+    if (cm.doc.direction == "ltr" && part.level % 2 == 0 && (dir > 0 ? part.to > start.ch : part.from < start.ch)) {
+      // Case 1: We move within an ltr part in an ltr editor. Even with wrapped lines,
+      // nothing interesting happens.
+      return moveLogically(line, start, dir)
+    }
+
+    var mv = function (pos, dir) { return moveCharLogically(line, pos instanceof Pos ? pos.ch : pos, dir); };
+    var prep;
+    var getWrappedLineExtent = function (ch) {
+      if (!cm.options.lineWrapping) { return {begin: 0, end: line.text.length} }
+      prep = prep || prepareMeasureForLine(cm, line);
+      return wrappedLineExtentChar(cm, line, prep, ch)
+    };
+    var wrappedLineExtent = getWrappedLineExtent(start.sticky == "before" ? mv(start, -1) : start.ch);
+
+    if (cm.doc.direction == "rtl" || part.level == 1) {
+      var moveInStorageOrder = (part.level == 1) == (dir < 0);
+      var ch = mv(start, moveInStorageOrder ? 1 : -1);
+      if (ch != null && (!moveInStorageOrder ? ch >= part.from && ch >= wrappedLineExtent.begin : ch <= part.to && ch <= wrappedLineExtent.end)) {
+        // Case 2: We move within an rtl part or in an rtl editor on the same visual line
+        var sticky = moveInStorageOrder ? "before" : "after";
+        return new Pos(start.line, ch, sticky)
+      }
+    }
+
+    // Case 3: Could not move within this bidi part in this visual line, so leave
+    // the current bidi part
+
+    var searchInVisualLine = function (partPos, dir, wrappedLineExtent) {
+      var getRes = function (ch, moveInStorageOrder) { return moveInStorageOrder
+        ? new Pos(start.line, mv(ch, 1), "before")
+        : new Pos(start.line, ch, "after"); };
+
+      for (; partPos >= 0 && partPos < bidi.length; partPos += dir) {
+        var part = bidi[partPos];
+        var moveInStorageOrder = (dir > 0) == (part.level != 1);
+        var ch = moveInStorageOrder ? wrappedLineExtent.begin : mv(wrappedLineExtent.end, -1);
+        if (part.from <= ch && ch < part.to) { return getRes(ch, moveInStorageOrder) }
+        ch = moveInStorageOrder ? part.from : mv(part.to, -1);
+        if (wrappedLineExtent.begin <= ch && ch < wrappedLineExtent.end) { return getRes(ch, moveInStorageOrder) }
+      }
+    };
+
+    // Case 3a: Look for other bidi parts on the same visual line
+    var res = searchInVisualLine(partPos + dir, dir, wrappedLineExtent);
+    if (res) { return res }
+
+    // Case 3b: Look for other bidi parts on the next visual line
+    var nextCh = dir > 0 ? wrappedLineExtent.end : mv(wrappedLineExtent.begin, -1);
+    if (nextCh != null && !(dir > 0 && nextCh == line.text.length)) {
+      res = searchInVisualLine(dir > 0 ? 0 : bidi.length - 1, dir, getWrappedLineExtent(nextCh));
+      if (res) { return res }
+    }
+
+    // Case 4: Nowhere to move
+    return null
+  }
+
+  // Commands are parameter-less actions that can be performed on an
+  // editor, mostly used for keybindings.
+  var commands = {
+    selectAll: selectAll,
+    singleSelection: function (cm) { return cm.setSelection(cm.getCursor("anchor"), cm.getCursor("head"), sel_dontScroll); },
+    killLine: function (cm) { return deleteNearSelection(cm, function (range) {
+      if (range.empty()) {
+        var len = getLine(cm.doc, range.head.line).text.length;
+        if (range.head.ch == len && range.head.line < cm.lastLine())
+          { return {from: range.head, to: Pos(range.head.line + 1, 0)} }
+        else
+          { return {from: range.head, to: Pos(range.head.line, len)} }
+      } else {
+        return {from: range.from(), to: range.to()}
+      }
+    }); },
+    deleteLine: function (cm) { return deleteNearSelection(cm, function (range) { return ({
+      from: Pos(range.from().line, 0),
+      to: clipPos(cm.doc, Pos(range.to().line + 1, 0))
+    }); }); },
+    delLineLeft: function (cm) { return deleteNearSelection(cm, function (range) { return ({
+      from: Pos(range.from().line, 0), to: range.from()
+    }); }); },
+    delWrappedLineLeft: function (cm) { return deleteNearSelection(cm, function (range) {
+      var top = cm.charCoords(range.head, "div").top + 5;
+      var leftPos = cm.coordsChar({left: 0, top: top}, "div");
+      return {from: leftPos, to: range.from()}
+    }); },
+    delWrappedLineRight: function (cm) { return deleteNearSelection(cm, function (range) {
+      var top = cm.charCoords(range.head, "div").top + 5;
+      var rightPos = cm.coordsChar({left: cm.display.lineDiv.offsetWidth + 100, top: top}, "div");
+      return {from: range.from(), to: rightPos }
+    }); },
+    undo: function (cm) { return cm.undo(); },
+    redo: function (cm) { return cm.redo(); },
+    undoSelection: function (cm) { return cm.undoSelection(); },
+    redoSelection: function (cm) { return cm.redoSelection(); },
+    goDocStart: function (cm) { return cm.extendSelection(Pos(cm.firstLine(), 0)); },
+    goDocEnd: function (cm) { return cm.extendSelection(Pos(cm.lastLine())); },
+    goLineStart: function (cm) { return cm.extendSelectionsBy(function (range) { return lineStart(cm, range.head.line); },
+      {origin: "+move", bias: 1}
+    ); },
+    goLineStartSmart: function (cm) { return cm.extendSelectionsBy(function (range) { return lineStartSmart(cm, range.head); },
+      {origin: "+move", bias: 1}
+    ); },
+    goLineEnd: function (cm) { return cm.extendSelectionsBy(function (range) { return lineEnd(cm, range.head.line); },
+      {origin: "+move", bias: -1}
+    ); },
+    goLineRight: function (cm) { return cm.extendSelectionsBy(function (range) {
+      var top = cm.cursorCoords(range.head, "div").top + 5;
+      return cm.coordsChar({left: cm.display.lineDiv.offsetWidth + 100, top: top}, "div")
+    }, sel_move); },
+    goLineLeft: function (cm) { return cm.extendSelectionsBy(function (range) {
+      var top = cm.cursorCoords(range.head, "div").top + 5;
+      return cm.coordsChar({left: 0, top: top}, "div")
+    }, sel_move); },
+    goLineLeftSmart: function (cm) { return cm.extendSelectionsBy(function (range) {
+      var top = cm.cursorCoords(range.head, "div").top + 5;
+      var pos = cm.coordsChar({left: 0, top: top}, "div");
+      if (pos.ch < cm.getLine(pos.line).search(/\S/)) { return lineStartSmart(cm, range.head) }
+      return pos
+    }, sel_move); },
+    goLineUp: function (cm) { return cm.moveV(-1, "line"); },
+    goLineDown: function (cm) { return cm.moveV(1, "line"); },
+    goPageUp: function (cm) { return cm.moveV(-1, "page"); },
+    goPageDown: function (cm) { return cm.moveV(1, "page"); },
+    goCharLeft: function (cm) { return cm.moveH(-1, "char"); },
+    goCharRight: function (cm) { return cm.moveH(1, "char"); },
+    goColumnLeft: function (cm) { return cm.moveH(-1, "column"); },
+    goColumnRight: function (cm) { return cm.moveH(1, "column"); },
+    goWordLeft: function (cm) { return cm.moveH(-1, "word"); },
+    goGroupRight: function (cm) { return cm.moveH(1, "group"); },
+    goGroupLeft: function (cm) { return cm.moveH(-1, "group"); },
+    goWordRight: function (cm) { return cm.moveH(1, "word"); },
+    delCharBefore: function (cm) { return cm.deleteH(-1, "char"); },
+    delCharAfter: function (cm) { return cm.deleteH(1, "char"); },
+    delWordBefore: function (cm) { return cm.deleteH(-1, "word"); },
+    delWordAfter: function (cm) { return cm.deleteH(1, "word"); },
+    delGroupBefore: function (cm) { return cm.deleteH(-1, "group"); },
+    delGroupAfter: function (cm) { return cm.deleteH(1, "group"); },
+    indentAuto: function (cm) { return cm.indentSelection("smart"); },
+    indentMore: function (cm) { return cm.indentSelection("add"); },
+    indentLess: function (cm) { return cm.indentSelection("subtract"); },
+    insertTab: function (cm) { return cm.replaceSelection("\t"); },
+    insertSoftTab: function (cm) {
+      var spaces = [], ranges = cm.listSelections(), tabSize = cm.options.tabSize;
+      for (var i = 0; i < ranges.length; i++) {
+        var pos = ranges[i].from();
+        var col = countColumn(cm.getLine(pos.line), pos.ch, tabSize);
+        spaces.push(spaceStr(tabSize - col % tabSize));
+      }
+      cm.replaceSelections(spaces);
+    },
+    defaultTab: function (cm) {
+      if (cm.somethingSelected()) { cm.indentSelection("add"); }
+      else { cm.execCommand("insertTab"); }
+    },
+    // Swap the two chars left and right of each selection's head.
+    // Move cursor behind the two swapped characters afterwards.
+    //
+    // Doesn't consider line feeds a character.
+    // Doesn't scan more than one line above to find a character.
+    // Doesn't do anything on an empty line.
+    // Doesn't do anything with non-empty selections.
+    transposeChars: function (cm) { return runInOp(cm, function () {
+      var ranges = cm.listSelections(), newSel = [];
+      for (var i = 0; i < ranges.length; i++) {
+        if (!ranges[i].empty()) { continue }
+        var cur = ranges[i].head, line = getLine(cm.doc, cur.line).text;
+        if (line) {
+          if (cur.ch == line.length) { cur = new Pos(cur.line, cur.ch - 1); }
+          if (cur.ch > 0) {
+            cur = new Pos(cur.line, cur.ch + 1);
+            cm.replaceRange(line.charAt(cur.ch - 1) + line.charAt(cur.ch - 2),
+                            Pos(cur.line, cur.ch - 2), cur, "+transpose");
+          } else if (cur.line > cm.doc.first) {
+            var prev = getLine(cm.doc, cur.line - 1).text;
+            if (prev) {
+              cur = new Pos(cur.line, 1);
+              cm.replaceRange(line.charAt(0) + cm.doc.lineSeparator() +
+                              prev.charAt(prev.length - 1),
+                              Pos(cur.line - 1, prev.length - 1), cur, "+transpose");
+            }
+          }
+        }
+        newSel.push(new Range(cur, cur));
+      }
+      cm.setSelections(newSel);
+    }); },
+    newlineAndIndent: function (cm) { return runInOp(cm, function () {
+      var sels = cm.listSelections();
+      for (var i = sels.length - 1; i >= 0; i--)
+        { cm.replaceRange(cm.doc.lineSeparator(), sels[i].anchor, sels[i].head, "+input"); }
+      sels = cm.listSelections();
+      for (var i$1 = 0; i$1 < sels.length; i$1++)
+        { cm.indentLine(sels[i$1].from().line, null, true); }
+      ensureCursorVisible(cm);
+    }); },
+    openLine: function (cm) { return cm.replaceSelection("\n", "start"); },
+    toggleOverwrite: function (cm) { return cm.toggleOverwrite(); }
+  };
+
+
+  function lineStart(cm, lineN) {
+    var line = getLine(cm.doc, lineN);
+    var visual = visualLine(line);
+    if (visual != line) { lineN = lineNo(visual); }
+    return endOfLine(true, cm, visual, lineN, 1)
+  }
+  function lineEnd(cm, lineN) {
+    var line = getLine(cm.doc, lineN);
+    var visual = visualLineEnd(line);
+    if (visual != line) { lineN = lineNo(visual); }
+    return endOfLine(true, cm, line, lineN, -1)
+  }
+  function lineStartSmart(cm, pos) {
+    var start = lineStart(cm, pos.line);
+    var line = getLine(cm.doc, start.line);
+    var order = getOrder(line, cm.doc.direction);
+    if (!order || order[0].level == 0) {
+      var firstNonWS = Math.max(0, line.text.search(/\S/));
+      var inWS = pos.line == start.line && pos.ch <= firstNonWS && pos.ch;
+      return Pos(start.line, inWS ? 0 : firstNonWS, start.sticky)
+    }
+    return start
+  }
+
+  // Run a handler that was bound to a key.
+  function doHandleBinding(cm, bound, dropShift) {
+    if (typeof bound == "string") {
+      bound = commands[bound];
+      if (!bound) { return false }
+    }
+    // Ensure previous input has been read, so that the handler sees a
+    // consistent view of the document
+    cm.display.input.ensurePolled();
+    var prevShift = cm.display.shift, done = false;
+    try {
+      if (cm.isReadOnly()) { cm.state.suppressEdits = true; }
+      if (dropShift) { cm.display.shift = false; }
+      done = bound(cm) != Pass;
+    } finally {
+      cm.display.shift = prevShift;
+      cm.state.suppressEdits = false;
+    }
+    return done
+  }
+
+  function lookupKeyForEditor(cm, name, handle) {
+    for (var i = 0; i < cm.state.keyMaps.length; i++) {
+      var result = lookupKey(name, cm.state.keyMaps[i], handle, cm);
+      if (result) { return result }
+    }
+    return (cm.options.extraKeys && lookupKey(name, cm.options.extraKeys, handle, cm))
+      || lookupKey(name, cm.options.keyMap, handle, cm)
+  }
+
+  // Note that, despite the name, this function is also used to check
+  // for bound mouse clicks.
+
+  var stopSeq = new Delayed;
+
+  function dispatchKey(cm, name, e, handle) {
+    var seq = cm.state.keySeq;
+    if (seq) {
+      if (isModifierKey(name)) { return "handled" }
+      if (/\'$/.test(name))
+        { cm.state.keySeq = null; }
+      else
+        { stopSeq.set(50, function () {
+          if (cm.state.keySeq == seq) {
+            cm.state.keySeq = null;
+            cm.display.input.reset();
+          }
+        }); }
+      if (dispatchKeyInner(cm, seq + " " + name, e, handle)) { return true }
+    }
+    return dispatchKeyInner(cm, name, e, handle)
+  }
+
+  function dispatchKeyInner(cm, name, e, handle) {
+    var result = lookupKeyForEditor(cm, name, handle);
+
+    if (result == "multi")
+      { cm.state.keySeq = name; }
+    if (result == "handled")
+      { signalLater(cm, "keyHandled", cm, name, e); }
+
+    if (result == "handled" || result == "multi") {
+      e_preventDefault(e);
+      restartBlink(cm);
+    }
+
+    return !!result
+  }
+
+  // Handle a key from the keydown event.
+  function handleKeyBinding(cm, e) {
+    var name = keyName(e, true);
+    if (!name) { return false }
+
+    if (e.shiftKey && !cm.state.keySeq) {
+      // First try to resolve full name (including 'Shift-'). Failing
+      // that, see if there is a cursor-motion command (starting with
+      // 'go') bound to the keyname without 'Shift-'.
+      return dispatchKey(cm, "Shift-" + name, e, function (b) { return doHandleBinding(cm, b, true); })
+          || dispatchKey(cm, name, e, function (b) {
+               if (typeof b == "string" ? /^go[A-Z]/.test(b) : b.motion)
+                 { return doHandleBinding(cm, b) }
+             })
+    } else {
+      return dispatchKey(cm, name, e, function (b) { return doHandleBinding(cm, b); })
+    }
+  }
+
+  // Handle a key from the keypress event
+  function handleCharBinding(cm, e, ch) {
+    return dispatchKey(cm, "'" + ch + "'", e, function (b) { return doHandleBinding(cm, b, true); })
+  }
+
+  var lastStoppedKey = null;
+  function onKeyDown(e) {
+    var cm = this;
+    cm.curOp.focus = activeElt();
+    if (signalDOMEvent(cm, e)) { return }
+    // IE does strange things with escape.
+    if (ie && ie_version < 11 && e.keyCode == 27) { e.returnValue = false; }
+    var code = e.keyCode;
+    cm.display.shift = code == 16 || e.shiftKey;
+    var handled = handleKeyBinding(cm, e);
+    if (presto) {
+      lastStoppedKey = handled ? code : null;
+      // Opera has no cut event... we try to at least catch the key combo
+      if (!handled && code == 88 && !hasCopyEvent && (mac ? e.metaKey : e.ctrlKey))
+        { cm.replaceSelection("", null, "cut"); }
+    }
+
+    // Turn mouse into crosshair when Alt is held on Mac.
+    if (code == 18 && !/\bCodeMirror-crosshair\b/.test(cm.display.lineDiv.className))
+      { showCrossHair(cm); }
+  }
+
+  function showCrossHair(cm) {
+    var lineDiv = cm.display.lineDiv;
+    addClass(lineDiv, "CodeMirror-crosshair");
+
+    function up(e) {
+      if (e.keyCode == 18 || !e.altKey) {
+        rmClass(lineDiv, "CodeMirror-crosshair");
+        off(document, "keyup", up);
+        off(document, "mouseover", up);
+      }
+    }
+    on(document, "keyup", up);
+    on(document, "mouseover", up);
+  }
+
+  function onKeyUp(e) {
+    if (e.keyCode == 16) { this.doc.sel.shift = false; }
+    signalDOMEvent(this, e);
+  }
+
+  function onKeyPress(e) {
+    var cm = this;
+    if (eventInWidget(cm.display, e) || signalDOMEvent(cm, e) || e.ctrlKey && !e.altKey || mac && e.metaKey) { return }
+    var keyCode = e.keyCode, charCode = e.charCode;
+    if (presto && keyCode == lastStoppedKey) {lastStoppedKey = null; e_preventDefault(e); return}
+    if ((presto && (!e.which || e.which < 10)) && handleKeyBinding(cm, e)) { return }
+    var ch = String.fromCharCode(charCode == null ? keyCode : charCode);
+    // Some browsers fire keypress events for backspace
+    if (ch == "\x08") { return }
+    if (handleCharBinding(cm, e, ch)) { return }
+    cm.display.input.onKeyPress(e);
+  }
+
+  var DOUBLECLICK_DELAY = 400;
+
+  var PastClick = function(time, pos, button) {
+    this.time = time;
+    this.pos = pos;
+    this.button = button;
+  };
+
+  PastClick.prototype.compare = function (time, pos, button) {
+    return this.time + DOUBLECLICK_DELAY > time &&
+      cmp(pos, this.pos) == 0 && button == this.button
+  };
+
+  var lastClick, lastDoubleClick;
+  function clickRepeat(pos, button) {
+    var now = +new Date;
+    if (lastDoubleClick && lastDoubleClick.compare(now, pos, button)) {
+      lastClick = lastDoubleClick = null;
+      return "triple"
+    } else if (lastClick && lastClick.compare(now, pos, button)) {
+      lastDoubleClick = new PastClick(now, pos, button);
+      lastClick = null;
+      return "double"
+    } else {
+      lastClick = new PastClick(now, pos, button);
+      lastDoubleClick = null;
+      return "single"
+    }
+  }
+
+  // A mouse down can be a single click, double click, triple click,
+  // start of selection drag, start of text drag, new cursor
+  // (ctrl-click), rectangle drag (alt-drag), or xwin
+  // middle-click-paste. Or it might be a click on something we should
+  // not interfere with, such as a scrollbar or widget.
+  function onMouseDown(e) {
+    var cm = this, display = cm.display;
+    if (signalDOMEvent(cm, e) || display.activeTouch && display.input.supportsTouch()) { return }
+    display.input.ensurePolled();
+    display.shift = e.shiftKey;
+
+    if (eventInWidget(display, e)) {
+      if (!webkit) {
+        // Briefly turn off draggability, to allow widgets to do
+        // normal dragging things.
+        display.scroller.draggable = false;
+        setTimeout(function () { return display.scroller.draggable = true; }, 100);
+      }
+      return
+    }
+    if (clickInGutter(cm, e)) { return }
+    var pos = posFromMouse(cm, e), button = e_button(e), repeat = pos ? clickRepeat(pos, button) : "single";
+    window.focus();
+
+    // #3261: make sure, that we're not starting a second selection
+    if (button == 1 && cm.state.selectingText)
+      { cm.state.selectingText(e); }
+
+    if (pos && handleMappedButton(cm, button, pos, repeat, e)) { return }
+
+    if (button == 1) {
+      if (pos) { leftButtonDown(cm, pos, repeat, e); }
+      else if (e_target(e) == display.scroller) { e_preventDefault(e); }
+    } else if (button == 2) {
+      if (pos) { extendSelection(cm.doc, pos); }
+      setTimeout(function () { return display.input.focus(); }, 20);
+    } else if (button == 3) {
+      if (captureRightClick) { cm.display.input.onContextMenu(e); }
+      else { delayBlurEvent(cm); }
+    }
+  }
+
+  function handleMappedButton(cm, button, pos, repeat, event) {
+    var name = "Click";
+    if (repeat == "double") { name = "Double" + name; }
+    else if (repeat == "triple") { name = "Triple" + name; }
+    name = (button == 1 ? "Left" : button == 2 ? "Middle" : "Right") + name;
+
+    return dispatchKey(cm,  addModifierNames(name, event), event, function (bound) {
+      if (typeof bound == "string") { bound = commands[bound]; }
+      if (!bound) { return false }
+      var done = false;
+      try {
+        if (cm.isReadOnly()) { cm.state.suppressEdits = true; }
+        done = bound(cm, pos) != Pass;
+      } finally {
+        cm.state.suppressEdits = false;
+      }
+      return done
+    })
+  }
+
+  function configureMouse(cm, repeat, event) {
+    var option = cm.getOption("configureMouse");
+    var value = option ? option(cm, repeat, event) : {};
+    if (value.unit == null) {
+      var rect = chromeOS ? event.shiftKey && event.metaKey : event.altKey;
+      value.unit = rect ? "rectangle" : repeat == "single" ? "char" : repeat == "double" ? "word" : "line";
+    }
+    if (value.extend == null || cm.doc.extend) { value.extend = cm.doc.extend || event.shiftKey; }
+    if (value.addNew == null) { value.addNew = mac ? event.metaKey : event.ctrlKey; }
+    if (value.moveOnDrag == null) { value.moveOnDrag = !(mac ? event.altKey : event.ctrlKey); }
+    return value
+  }
+
+  function leftButtonDown(cm, pos, repeat, event) {
+    if (ie) { setTimeout(bind(ensureFocus, cm), 0); }
+    else { cm.curOp.focus = activeElt(); }
+
+    var behavior = configureMouse(cm, repeat, event);
+
+    var sel = cm.doc.sel, contained;
+    if (cm.options.dragDrop && dragAndDrop && !cm.isReadOnly() &&
+        repeat == "single" && (contained = sel.contains(pos)) > -1 &&
+        (cmp((contained = sel.ranges[contained]).from(), pos) < 0 || pos.xRel > 0) &&
+        (cmp(contained.to(), pos) > 0 || pos.xRel < 0))
+      { leftButtonStartDrag(cm, event, pos, behavior); }
+    else
+      { leftButtonSelect(cm, event, pos, behavior); }
+  }
+
+  // Start a text drag. When it ends, see if any dragging actually
+  // happen, and treat as a click if it didn't.
+  function leftButtonStartDrag(cm, event, pos, behavior) {
+    var display = cm.display, moved = false;
+    var dragEnd = operation(cm, function (e) {
+      if (webkit) { display.scroller.draggable = false; }
+      cm.state.draggingText = false;
+      off(display.wrapper.ownerDocument, "mouseup", dragEnd);
+      off(display.wrapper.ownerDocument, "mousemove", mouseMove);
+      off(display.scroller, "dragstart", dragStart);
+      off(display.scroller, "drop", dragEnd);
+      if (!moved) {
+        e_preventDefault(e);
+        if (!behavior.addNew)
+          { extendSelection(cm.doc, pos, null, null, behavior.extend); }
+        // Work around unexplainable focus problem in IE9 (#2127) and Chrome (#3081)
+        if (webkit || ie && ie_version == 9)
+          { setTimeout(function () {display.wrapper.ownerDocument.body.focus(); display.input.focus();}, 20); }
+        else
+          { display.input.focus(); }
+      }
+    });
+    var mouseMove = function(e2) {
+      moved = moved || Math.abs(event.clientX - e2.clientX) + Math.abs(event.clientY - e2.clientY) >= 10;
+    };
+    var dragStart = function () { return moved = true; };
+    // Let the drag handler handle this.
+    if (webkit) { display.scroller.draggable = true; }
+    cm.state.draggingText = dragEnd;
+    dragEnd.copy = !behavior.moveOnDrag;
+    // IE's approach to draggable
+    if (display.scroller.dragDrop) { display.scroller.dragDrop(); }
+    on(display.wrapper.ownerDocument, "mouseup", dragEnd);
+    on(display.wrapper.ownerDocument, "mousemove", mouseMove);
+    on(display.scroller, "dragstart", dragStart);
+    on(display.scroller, "drop", dragEnd);
+
+    delayBlurEvent(cm);
+    setTimeout(function () { return display.input.focus(); }, 20);
+  }
+
+  function rangeForUnit(cm, pos, unit) {
+    if (unit == "char") { return new Range(pos, pos) }
+    if (unit == "word") { return cm.findWordAt(pos) }
+    if (unit == "line") { return new Range(Pos(pos.line, 0), clipPos(cm.doc, Pos(pos.line + 1, 0))) }
+    var result = unit(cm, pos);
+    return new Range(result.from, result.to)
+  }
+
+  // Normal selection, as opposed to text dragging.
+  function leftButtonSelect(cm, event, start, behavior) {
+    var display = cm.display, doc = cm.doc;
+    e_preventDefault(event);
+
+    var ourRange, ourIndex, startSel = doc.sel, ranges = startSel.ranges;
+    if (behavior.addNew && !behavior.extend) {
+      ourIndex = doc.sel.contains(start);
+      if (ourIndex > -1)
+        { ourRange = ranges[ourIndex]; }
+      else
+        { ourRange = new Range(start, start); }
+    } else {
+      ourRange = doc.sel.primary();
+      ourIndex = doc.sel.primIndex;
+    }
+
+    if (behavior.unit == "rectangle") {
+      if (!behavior.addNew) { ourRange = new Range(start, start); }
+      start = posFromMouse(cm, event, true, true);
+      ourIndex = -1;
+    } else {
+      var range$$1 = rangeForUnit(cm, start, behavior.unit);
+      if (behavior.extend)
+        { ourRange = extendRange(ourRange, range$$1.anchor, range$$1.head, behavior.extend); }
+      else
+        { ourRange = range$$1; }
+    }
+
+    if (!behavior.addNew) {
+      ourIndex = 0;
+      setSelection(doc, new Selection([ourRange], 0), sel_mouse);
+      startSel = doc.sel;
+    } else if (ourIndex == -1) {
+      ourIndex = ranges.length;
+      setSelection(doc, normalizeSelection(cm, ranges.concat([ourRange]), ourIndex),
+                   {scroll: false, origin: "*mouse"});
+    } else if (ranges.length > 1 && ranges[ourIndex].empty() && behavior.unit == "char" && !behavior.extend) {
+      setSelection(doc, normalizeSelection(cm, ranges.slice(0, ourIndex).concat(ranges.slice(ourIndex + 1)), 0),
+                   {scroll: false, origin: "*mouse"});
+      startSel = doc.sel;
+    } else {
+      replaceOneSelection(doc, ourIndex, ourRange, sel_mouse);
+    }
+
+    var lastPos = start;
+    function extendTo(pos) {
+      if (cmp(lastPos, pos) == 0) { return }
+      lastPos = pos;
+
+      if (behavior.unit == "rectangle") {
+        var ranges = [], tabSize = cm.options.tabSize;
+        var startCol = countColumn(getLine(doc, start.line).text, start.ch, tabSize);
+        var posCol = countColumn(getLine(doc, pos.line).text, pos.ch, tabSize);
+        var left = Math.min(startCol, posCol), right = Math.max(startCol, posCol);
+        for (var line = Math.min(start.line, pos.line), end = Math.min(cm.lastLine(), Math.max(start.line, pos.line));
+             line <= end; line++) {
+          var text = getLine(doc, line).text, leftPos = findColumn(text, left, tabSize);
+          if (left == right)
+            { ranges.push(new Range(Pos(line, leftPos), Pos(line, leftPos))); }
+          else if (text.length > leftPos)
+            { ranges.push(new Range(Pos(line, leftPos), Pos(line, findColumn(text, right, tabSize)))); }
+        }
+        if (!ranges.length) { ranges.push(new Range(start, start)); }
+        setSelection(doc, normalizeSelection(cm, startSel.ranges.slice(0, ourIndex).concat(ranges), ourIndex),
+                     {origin: "*mouse", scroll: false});
+        cm.scrollIntoView(pos);
+      } else {
+        var oldRange = ourRange;
+        var range$$1 = rangeForUnit(cm, pos, behavior.unit);
+        var anchor = oldRange.anchor, head;
+        if (cmp(range$$1.anchor, anchor) > 0) {
+          head = range$$1.head;
+          anchor = minPos(oldRange.from(), range$$1.anchor);
+        } else {
+          head = range$$1.anchor;
+          anchor = maxPos(oldRange.to(), range$$1.head);
+        }
+        var ranges$1 = startSel.ranges.slice(0);
+        ranges$1[ourIndex] = bidiSimplify(cm, new Range(clipPos(doc, anchor), head));
+        setSelection(doc, normalizeSelection(cm, ranges$1, ourIndex), sel_mouse);
+      }
+    }
+
+    var editorSize = display.wrapper.getBoundingClientRect();
+    // Used to ensure timeout re-tries don't fire when another extend
+    // happened in the meantime (clearTimeout isn't reliable -- at
+    // least on Chrome, the timeouts still happen even when cleared,
+    // if the clear happens after their scheduled firing time).
+    var counter = 0;
+
+    function extend(e) {
+      var curCount = ++counter;
+      var cur = posFromMouse(cm, e, true, behavior.unit == "rectangle");
+      if (!cur) { return }
+      if (cmp(cur, lastPos) != 0) {
+        cm.curOp.focus = activeElt();
+        extendTo(cur);
+        var visible = visibleLines(display, doc);
+        if (cur.line >= visible.to || cur.line < visible.from)
+          { setTimeout(operation(cm, function () {if (counter == curCount) { extend(e); }}), 150); }
+      } else {
+        var outside = e.clientY < editorSize.top ? -20 : e.clientY > editorSize.bottom ? 20 : 0;
+        if (outside) { setTimeout(operation(cm, function () {
+          if (counter != curCount) { return }
+          display.scroller.scrollTop += outside;
+          extend(e);
+        }), 50); }
+      }
+    }
+
+    function done(e) {
+      cm.state.selectingText = false;
+      counter = Infinity;
+      // If e is null or undefined we interpret this as someone trying
+      // to explicitly cancel the selection rather than the user
+      // letting go of the mouse button.
+      if (e) {
+        e_preventDefault(e);
+        display.input.focus();
+      }
+      off(display.wrapper.ownerDocument, "mousemove", move);
+      off(display.wrapper.ownerDocument, "mouseup", up);
+      doc.history.lastSelOrigin = null;
+    }
+
+    var move = operation(cm, function (e) {
+      if (e.buttons === 0 || !e_button(e)) { done(e); }
+      else { extend(e); }
+    });
+    var up = operation(cm, done);
+    cm.state.selectingText = up;
+    on(display.wrapper.ownerDocument, "mousemove", move);
+    on(display.wrapper.ownerDocument, "mouseup", up);
+  }
+
+  // Used when mouse-selecting to adjust the anchor to the proper side
+  // of a bidi jump depending on the visual position of the head.
+  function bidiSimplify(cm, range$$1) {
+    var anchor = range$$1.anchor;
+    var head = range$$1.head;
+    var anchorLine = getLine(cm.doc, anchor.line);
+    if (cmp(anchor, head) == 0 && anchor.sticky == head.sticky) { return range$$1 }
+    var order = getOrder(anchorLine);
+    if (!order) { return range$$1 }
+    var index = getBidiPartAt(order, anchor.ch, anchor.sticky), part = order[index];
+    if (part.from != anchor.ch && part.to != anchor.ch) { return range$$1 }
+    var boundary = index + ((part.from == anchor.ch) == (part.level != 1) ? 0 : 1);
+    if (boundary == 0 || boundary == order.length) { return range$$1 }
+
+    // Compute the relative visual position of the head compared to the
+    // anchor (<0 is to the left, >0 to the right)
+    var leftSide;
+    if (head.line != anchor.line) {
+      leftSide = (head.line - anchor.line) * (cm.doc.direction == "ltr" ? 1 : -1) > 0;
+    } else {
+      var headIndex = getBidiPartAt(order, head.ch, head.sticky);
+      var dir = headIndex - index || (head.ch - anchor.ch) * (part.level == 1 ? -1 : 1);
+      if (headIndex == boundary - 1 || headIndex == boundary)
+        { leftSide = dir < 0; }
+      else
+        { leftSide = dir > 0; }
+    }
+
+    var usePart = order[boundary + (leftSide ? -1 : 0)];
+    var from = leftSide == (usePart.level == 1);
+    var ch = from ? usePart.from : usePart.to, sticky = from ? "after" : "before";
+    return anchor.ch == ch && anchor.sticky == sticky ? range$$1 : new Range(new Pos(anchor.line, ch, sticky), head)
+  }
+
+
+  // Determines whether an event happened in the gutter, and fires the
+  // handlers for the corresponding event.
+  function gutterEvent(cm, e, type, prevent) {
+    var mX, mY;
+    if (e.touches) {
+      mX = e.touches[0].clientX;
+      mY = e.touches[0].clientY;
+    } else {
+      try { mX = e.clientX; mY = e.clientY; }
+      catch(e) { return false }
+    }
+    if (mX >= Math.floor(cm.display.gutters.getBoundingClientRect().right)) { return false }
+    if (prevent) { e_preventDefault(e); }
+
+    var display = cm.display;
+    var lineBox = display.lineDiv.getBoundingClientRect();
+
+    if (mY > lineBox.bottom || !hasHandler(cm, type)) { return e_defaultPrevented(e) }
+    mY -= lineBox.top - display.viewOffset;
+
+    for (var i = 0; i < cm.display.gutterSpecs.length; ++i) {
+      var g = display.gutters.childNodes[i];
+      if (g && g.getBoundingClientRect().right >= mX) {
+        var line = lineAtHeight(cm.doc, mY);
+        var gutter = cm.display.gutterSpecs[i];
+        signal(cm, type, cm, line, gutter.className, e);
+        return e_defaultPrevented(e)
+      }
+    }
+  }
+
+  function clickInGutter(cm, e) {
+    return gutterEvent(cm, e, "gutterClick", true)
+  }
+
+  // CONTEXT MENU HANDLING
+
+  // To make the context menu work, we need to briefly unhide the
+  // textarea (making it as unobtrusive as possible) to let the
+  // right-click take effect on it.
+  function onContextMenu(cm, e) {
+    if (eventInWidget(cm.display, e) || contextMenuInGutter(cm, e)) { return }
+    if (signalDOMEvent(cm, e, "contextmenu")) { return }
+    if (!captureRightClick) { cm.display.input.onContextMenu(e); }
+  }
+
+  function contextMenuInGutter(cm, e) {
+    if (!hasHandler(cm, "gutterContextMenu")) { return false }
+    return gutterEvent(cm, e, "gutterContextMenu", false)
+  }
+
+  function themeChanged(cm) {
+    cm.display.wrapper.className = cm.display.wrapper.className.replace(/\s*cm-s-\S+/g, "") +
+      cm.options.theme.replace(/(^|\s)\s*/g, " cm-s-");
+    clearCaches(cm);
+  }
+
+  var Init = {toString: function(){return "CodeMirror.Init"}};
+
+  var defaults = {};
+  var optionHandlers = {};
+
+  function defineOptions(CodeMirror) {
+    var optionHandlers = CodeMirror.optionHandlers;
+
+    function option(name, deflt, handle, notOnInit) {
+      CodeMirror.defaults[name] = deflt;
+      if (handle) { optionHandlers[name] =
+        notOnInit ? function (cm, val, old) {if (old != Init) { handle(cm, val, old); }} : handle; }
+    }
+
+    CodeMirror.defineOption = option;
+
+    // Passed to option handlers when there is no old value.
+    CodeMirror.Init = Init;
+
+    // These two are, on init, called from the constructor because they
+    // have to be initialized before the editor can start at all.
+    option("value", "", function (cm, val) { return cm.setValue(val); }, true);
+    option("mode", null, function (cm, val) {
+      cm.doc.modeOption = val;
+      loadMode(cm);
+    }, true);
+
+    option("indentUnit", 2, loadMode, true);
+    option("indentWithTabs", false);
+    option("smartIndent", true);
+    option("tabSize", 4, function (cm) {
+      resetModeState(cm);
+      clearCaches(cm);
+      regChange(cm);
+    }, true);
+
+    option("lineSeparator", null, function (cm, val) {
+      cm.doc.lineSep = val;
+      if (!val) { return }
+      var newBreaks = [], lineNo = cm.doc.first;
+      cm.doc.iter(function (line) {
+        for (var pos = 0;;) {
+          var found = line.text.indexOf(val, pos);
+          if (found == -1) { break }
+          pos = found + val.length;
+          newBreaks.push(Pos(lineNo, found));
+        }
+        lineNo++;
+      });
+      for (var i = newBreaks.length - 1; i >= 0; i--)
+        { replaceRange(cm.doc, val, newBreaks[i], Pos(newBreaks[i].line, newBreaks[i].ch + val.length)); }
+    });
+    option("specialChars", /[\u0000-\u001f\u007f-\u009f\u00ad\u061c\u200b-\u200f\u2028\u2029\ufeff\ufff9-\ufffc]/g, function (cm, val, old) {
+      cm.state.specialChars = new RegExp(val.source + (val.test("\t") ? "" : "|\t"), "g");
+      if (old != Init) { cm.refresh(); }
+    });
+    option("specialCharPlaceholder", defaultSpecialCharPlaceholder, function (cm) { return cm.refresh(); }, true);
+    option("electricChars", true);
+    option("inputStyle", mobile ? "contenteditable" : "textarea", function () {
+      throw new Error("inputStyle can not (yet) be changed in a running editor") // FIXME
+    }, true);
+    option("spellcheck", false, function (cm, val) { return cm.getInputField().spellcheck = val; }, true);
+    option("autocorrect", false, function (cm, val) { return cm.getInputField().autocorrect = val; }, true);
+    option("autocapitalize", false, function (cm, val) { return cm.getInputField().autocapitalize = val; }, true);
+    option("rtlMoveVisually", !windows);
+    option("wholeLineUpdateBefore", true);
+
+    option("theme", "default", function (cm) {
+      themeChanged(cm);
+      updateGutters(cm);
+    }, true);
+    option("keyMap", "default", function (cm, val, old) {
+      var next = getKeyMap(val);
+      var prev = old != Init && getKeyMap(old);
+      if (prev && prev.detach) { prev.detach(cm, next); }
+      if (next.attach) { next.attach(cm, prev || null); }
+    });
+    option("extraKeys", null);
+    option("configureMouse", null);
+
+    option("lineWrapping", false, wrappingChanged, true);
+    option("gutters", [], function (cm, val) {
+      cm.display.gutterSpecs = getGutters(val, cm.options.lineNumbers);
+      updateGutters(cm);
+    }, true);
+    option("fixedGutter", true, function (cm, val) {
+      cm.display.gutters.style.left = val ? compensateForHScroll(cm.display) + "px" : "0";
+      cm.refresh();
+    }, true);
+    option("coverGutterNextToScrollbar", false, function (cm) { return updateScrollbars(cm); }, true);
+    option("scrollbarStyle", "native", function (cm) {
+      initScrollbars(cm);
+      updateScrollbars(cm);
+      cm.display.scrollbars.setScrollTop(cm.doc.scrollTop);
+      cm.display.scrollbars.setScrollLeft(cm.doc.scrollLeft);
+    }, true);
+    option("lineNumbers", false, function (cm, val) {
+      cm.display.gutterSpecs = getGutters(cm.options.gutters, val);
+      updateGutters(cm);
+    }, true);
+    option("firstLineNumber", 1, updateGutters, true);
+    option("lineNumberFormatter", function (integer) { return integer; }, updateGutters, true);
+    option("showCursorWhenSelecting", false, updateSelection, true);
+
+    option("resetSelectionOnContextMenu", true);
+    option("lineWiseCopyCut", true);
+    option("pasteLinesPerSelection", true);
+    option("selectionsMayTouch", false);
+
+    option("readOnly", false, function (cm, val) {
+      if (val == "nocursor") {
+        onBlur(cm);
+        cm.display.input.blur();
+      }
+      cm.display.input.readOnlyChanged(val);
+    });
+    option("disableInput", false, function (cm, val) {if (!val) { cm.display.input.reset(); }}, true);
+    option("dragDrop", true, dragDropChanged);
+    option("allowDropFileTypes", null);
+
+    option("cursorBlinkRate", 530);
+    option("cursorScrollMargin", 0);
+    option("cursorHeight", 1, updateSelection, true);
+    option("singleCursorHeightPerLine", true, updateSelection, true);
+    option("workTime", 100);
+    option("workDelay", 100);
+    option("flattenSpans", true, resetModeState, true);
+    option("addModeClass", false, resetModeState, true);
+    option("pollInterval", 100);
+    option("undoDepth", 200, function (cm, val) { return cm.doc.history.undoDepth = val; });
+    option("historyEventDelay", 1250);
+    option("viewportMargin", 10, function (cm) { return cm.refresh(); }, true);
+    option("maxHighlightLength", 10000, resetModeState, true);
+    option("moveInputWithCursor", true, function (cm, val) {
+      if (!val) { cm.display.input.resetPosition(); }
+    });
+
+    option("tabindex", null, function (cm, val) { return cm.display.input.getField().tabIndex = val || ""; });
+    option("autofocus", null);
+    option("direction", "ltr", function (cm, val) { return cm.doc.setDirection(val); }, true);
+    option("phrases", null);
+  }
+
+  function dragDropChanged(cm, value, old) {
+    var wasOn = old && old != Init;
+    if (!value != !wasOn) {
+      var funcs = cm.display.dragFunctions;
+      var toggle = value ? on : off;
+      toggle(cm.display.scroller, "dragstart", funcs.start);
+      toggle(cm.display.scroller, "dragenter", funcs.enter);
+      toggle(cm.display.scroller, "dragover", funcs.over);
+      toggle(cm.display.scroller, "dragleave", funcs.leave);
+      toggle(cm.display.scroller, "drop", funcs.drop);
+    }
+  }
+
+  function wrappingChanged(cm) {
+    if (cm.options.lineWrapping) {
+      addClass(cm.display.wrapper, "CodeMirror-wrap");
+      cm.display.sizer.style.minWidth = "";
+      cm.display.sizerWidth = null;
+    } else {
+      rmClass(cm.display.wrapper, "CodeMirror-wrap");
+      findMaxLine(cm);
+    }
+    estimateLineHeights(cm);
+    regChange(cm);
+    clearCaches(cm);
+    setTimeout(function () { return updateScrollbars(cm); }, 100);
+  }
+
+  // A CodeMirror instance represents an editor. This is the object
+  // that user code is usually dealing with.
+
+  function CodeMirror(place, options) {
+    var this$1 = this;
+
+    if (!(this instanceof CodeMirror)) { return new CodeMirror(place, options) }
+
+    this.options = options = options ? copyObj(options) : {};
+    // Determine effective options based on given values and defaults.
+    copyObj(defaults, options, false);
+
+    var doc = options.value;
+    if (typeof doc == "string") { doc = new Doc(doc, options.mode, null, options.lineSeparator, options.direction); }
+    else if (options.mode) { doc.modeOption = options.mode; }
+    this.doc = doc;
+
+    var input = new CodeMirror.inputStyles[options.inputStyle](this);
+    var display = this.display = new Display(place, doc, input, options);
+    display.wrapper.CodeMirror = this;
+    themeChanged(this);
+    if (options.lineWrapping)
+      { this.display.wrapper.className += " CodeMirror-wrap"; }
+    initScrollbars(this);
+
+    this.state = {
+      keyMaps: [],  // stores maps added by addKeyMap
+      overlays: [], // highlighting overlays, as added by addOverlay
+      modeGen: 0,   // bumped when mode/overlay changes, used to invalidate highlighting info
+      overwrite: false,
+      delayingBlurEvent: false,
+      focused: false,
+      suppressEdits: false, // used to disable editing during key handlers when in readOnly mode
+      pasteIncoming: -1, cutIncoming: -1, // help recognize paste/cut edits in input.poll
+      selectingText: false,
+      draggingText: false,
+      highlight: new Delayed(), // stores highlight worker timeout
+      keySeq: null,  // Unfinished key sequence
+      specialChars: null
+    };
+
+    if (options.autofocus && !mobile) { display.input.focus(); }
+
+    // Override magic textarea content restore that IE sometimes does
+    // on our hidden textarea on reload
+    if (ie && ie_version < 11) { setTimeout(function () { return this$1.display.input.reset(true); }, 20); }
+
+    registerEventHandlers(this);
+    ensureGlobalHandlers();
+
+    startOperation(this);
+    this.curOp.forceUpdate = true;
+    attachDoc(this, doc);
+
+    if ((options.autofocus && !mobile) || this.hasFocus())
+      { setTimeout(bind(onFocus, this), 20); }
+    else
+      { onBlur(this); }
+
+    for (var opt in optionHandlers) { if (optionHandlers.hasOwnProperty(opt))
+      { optionHandlers[opt](this$1, options[opt], Init); } }
+    maybeUpdateLineNumberWidth(this);
+    if (options.finishInit) { options.finishInit(this); }
+    for (var i = 0; i < initHooks.length; ++i) { initHooks[i](this$1); }
+    endOperation(this);
+    // Suppress optimizelegibility in Webkit, since it breaks text
+    // measuring on line wrapping boundaries.
+    if (webkit && options.lineWrapping &&
+        getComputedStyle(display.lineDiv).textRendering == "optimizelegibility")
+      { display.lineDiv.style.textRendering = "auto"; }
+  }
+
+  // The default configuration options.
+  CodeMirror.defaults = defaults;
+  // Functions to run when options are changed.
+  CodeMirror.optionHandlers = optionHandlers;
+
+  // Attach the necessary event handlers when initializing the editor
+  function registerEventHandlers(cm) {
+    var d = cm.display;
+    on(d.scroller, "mousedown", operation(cm, onMouseDown));
+    // Older IE's will not fire a second mousedown for a double click
+    if (ie && ie_version < 11)
+      { on(d.scroller, "dblclick", operation(cm, function (e) {
+        if (signalDOMEvent(cm, e)) { return }
+        var pos = posFromMouse(cm, e);
+        if (!pos || clickInGutter(cm, e) || eventInWidget(cm.display, e)) { return }
+        e_preventDefault(e);
+        var word = cm.findWordAt(pos);
+        extendSelection(cm.doc, word.anchor, word.head);
+      })); }
+    else
+      { on(d.scroller, "dblclick", function (e) { return signalDOMEvent(cm, e) || e_preventDefault(e); }); }
+    // Some browsers fire contextmenu *after* opening the menu, at
+    // which point we can't mess with it anymore. Context menu is
+    // handled in onMouseDown for these browsers.
+    on(d.scroller, "contextmenu", function (e) { return onContextMenu(cm, e); });
+
+    // Used to suppress mouse event handling when a touch happens
+    var touchFinished, prevTouch = {end: 0};
+    function finishTouch() {
+      if (d.activeTouch) {
+        touchFinished = setTimeout(function () { return d.activeTouch = null; }, 1000);
+        prevTouch = d.activeTouch;
+        prevTouch.end = +new Date;
+      }
+    }
+    function isMouseLikeTouchEvent(e) {
+      if (e.touches.length != 1) { return false }
+      var touch = e.touches[0];
+      return touch.radiusX <= 1 && touch.radiusY <= 1
+    }
+    function farAway(touch, other) {
+      if (other.left == null) { return true }
+      var dx = other.left - touch.left, dy = other.top - touch.top;
+      return dx * dx + dy * dy > 20 * 20
+    }
+    on(d.scroller, "touchstart", function (e) {
+      if (!signalDOMEvent(cm, e) && !isMouseLikeTouchEvent(e) && !clickInGutter(cm, e)) {
+        d.input.ensurePolled();
+        clearTimeout(touchFinished);
+        var now = +new Date;
+        d.activeTouch = {start: now, moved: false,
+                         prev: now - prevTouch.end <= 300 ? prevTouch : null};
+        if (e.touches.length == 1) {
+          d.activeTouch.left = e.touches[0].pageX;
+          d.activeTouch.top = e.touches[0].pageY;
+        }
+      }
+    });
+    on(d.scroller, "touchmove", function () {
+      if (d.activeTouch) { d.activeTouch.moved = true; }
+    });
+    on(d.scroller, "touchend", function (e) {
+      var touch = d.activeTouch;
+      if (touch && !eventInWidget(d, e) && touch.left != null &&
+          !touch.moved && new Date - touch.start < 300) {
+        var pos = cm.coordsChar(d.activeTouch, "page"), range;
+        if (!touch.prev || farAway(touch, touch.prev)) // Single tap
+          { range = new Range(pos, pos); }
+        else if (!touch.prev.prev || farAway(touch, touch.prev.prev)) // Double tap
+          { range = cm.findWordAt(pos); }
+        else // Triple tap
+          { range = new Range(Pos(pos.line, 0), clipPos(cm.doc, Pos(pos.line + 1, 0))); }
+        cm.setSelection(range.anchor, range.head);
+        cm.focus();
+        e_preventDefault(e);
+      }
+      finishTouch();
+    });
+    on(d.scroller, "touchcancel", finishTouch);
+
+    // Sync scrolling between fake scrollbars and real scrollable
+    // area, ensure viewport is updated when scrolling.
+    on(d.scroller, "scroll", function () {
+      if (d.scroller.clientHeight) {
+        updateScrollTop(cm, d.scroller.scrollTop);
+        setScrollLeft(cm, d.scroller.scrollLeft, true);
+        signal(cm, "scroll", cm);
+      }
+    });
+
+    // Listen to wheel events in order to try and update the viewport on time.
+    on(d.scroller, "mousewheel", function (e) { return onScrollWheel(cm, e); });
+    on(d.scroller, "DOMMouseScroll", function (e) { return onScrollWheel(cm, e); });
+
+    // Prevent wrapper from ever scrolling
+    on(d.wrapper, "scroll", function () { return d.wrapper.scrollTop = d.wrapper.scrollLeft = 0; });
+
+    d.dragFunctions = {
+      enter: function (e) {if (!signalDOMEvent(cm, e)) { e_stop(e); }},
+      over: function (e) {if (!signalDOMEvent(cm, e)) { onDragOver(cm, e); e_stop(e); }},
+      start: function (e) { return onDragStart(cm, e); },
+      drop: operation(cm, onDrop),
+      leave: function (e) {if (!signalDOMEvent(cm, e)) { clearDragCursor(cm); }}
+    };
+
+    var inp = d.input.getField();
+    on(inp, "keyup", function (e) { return onKeyUp.call(cm, e); });
+    on(inp, "keydown", operation(cm, onKeyDown));
+    on(inp, "keypress", operation(cm, onKeyPress));
+    on(inp, "focus", function (e) { return onFocus(cm, e); });
+    on(inp, "blur", function (e) { return onBlur(cm, e); });
+  }
+
+  var initHooks = [];
+  CodeMirror.defineInitHook = function (f) { return initHooks.push(f); };
+
+  // Indent the given line. The how parameter can be "smart",
+  // "add"/null, "subtract", or "prev". When aggressive is false
+  // (typically set to true for forced single-line indents), empty
+  // lines are not indented, and places where the mode returns Pass
+  // are left alone.
+  function indentLine(cm, n, how, aggressive) {
+    var doc = cm.doc, state;
+    if (how == null) { how = "add"; }
+    if (how == "smart") {
+      // Fall back to "prev" when the mode doesn't have an indentation
+      // method.
+      if (!doc.mode.indent) { how = "prev"; }
+      else { state = getContextBefore(cm, n).state; }
+    }
+
+    var tabSize = cm.options.tabSize;
+    var line = getLine(doc, n), curSpace = countColumn(line.text, null, tabSize);
+    if (line.stateAfter) { line.stateAfter = null; }
+    var curSpaceString = line.text.match(/^\s*/)[0], indentation;
+    if (!aggressive && !/\S/.test(line.text)) {
+      indentation = 0;
+      how = "not";
+    } else if (how == "smart") {
+      indentation = doc.mode.indent(state, line.text.slice(curSpaceString.length), line.text);
+      if (indentation == Pass || indentation > 150) {
+        if (!aggressive) { return }
+        how = "prev";
+      }
+    }
+    if (how == "prev") {
+      if (n > doc.first) { indentation = countColumn(getLine(doc, n-1).text, null, tabSize); }
+      else { indentation = 0; }
+    } else if (how == "add") {
+      indentation = curSpace + cm.options.indentUnit;
+    } else if (how == "subtract") {
+      indentation = curSpace - cm.options.indentUnit;
+    } else if (typeof how == "number") {
+      indentation = curSpace + how;
+    }
+    indentation = Math.max(0, indentation);
+
+    var indentString = "", pos = 0;
+    if (cm.options.indentWithTabs)
+      { for (var i = Math.floor(indentation / tabSize); i; --i) {pos += tabSize; indentString += "\t";} }
+    if (pos < indentation) { indentString += spaceStr(indentation - pos); }
+
+    if (indentString != curSpaceString) {
+      replaceRange(doc, indentString, Pos(n, 0), Pos(n, curSpaceString.length), "+input");
+      line.stateAfter = null;
+      return true
+    } else {
+      // Ensure that, if the cursor was in the whitespace at the start
+      // of the line, it is moved to the end of that space.
+      for (var i$1 = 0; i$1 < doc.sel.ranges.length; i$1++) {
+        var range = doc.sel.ranges[i$1];
+        if (range.head.line == n && range.head.ch < curSpaceString.length) {
+          var pos$1 = Pos(n, curSpaceString.length);
+          replaceOneSelection(doc, i$1, new Range(pos$1, pos$1));
+          break
+        }
+      }
+    }
+  }
+
+  // This will be set to a {lineWise: bool, text: [string]} object, so
+  // that, when pasting, we know what kind of selections the copied
+  // text was made out of.
+  var lastCopied = null;
+
+  function setLastCopied(newLastCopied) {
+    lastCopied = newLastCopied;
+  }
+
+  function applyTextInput(cm, inserted, deleted, sel, origin) {
+    var doc = cm.doc;
+    cm.display.shift = false;
+    if (!sel) { sel = doc.sel; }
+
+    var recent = +new Date - 200;
+    var paste = origin == "paste" || cm.state.pasteIncoming > recent;
+    var textLines = splitLinesAuto(inserted), multiPaste = null;
+    // When pasting N lines into N selections, insert one line per selection
+    if (paste && sel.ranges.length > 1) {
+      if (lastCopied && lastCopied.text.join("\n") == inserted) {
+        if (sel.ranges.length % lastCopied.text.length == 0) {
+          multiPaste = [];
+          for (var i = 0; i < lastCopied.text.length; i++)
+            { multiPaste.push(doc.splitLines(lastCopied.text[i])); }
+        }
+      } else if (textLines.length == sel.ranges.length && cm.options.pasteLinesPerSelection) {
+        multiPaste = map(textLines, function (l) { return [l]; });
+      }
+    }
+
+    var updateInput = cm.curOp.updateInput;
+    // Normal behavior is to insert the new text into every selection
+    for (var i$1 = sel.ranges.length - 1; i$1 >= 0; i$1--) {
+      var range$$1 = sel.ranges[i$1];
+      var from = range$$1.from(), to = range$$1.to();
+      if (range$$1.empty()) {
+        if (deleted && deleted > 0) // Handle deletion
+          { from = Pos(from.line, from.ch - deleted); }
+        else if (cm.state.overwrite && !paste) // Handle overwrite
+          { to = Pos(to.line, Math.min(getLine(doc, to.line).text.length, to.ch + lst(textLines).length)); }
+        else if (paste && lastCopied && lastCopied.lineWise && lastCopied.text.join("\n") == inserted)
+          { from = to = Pos(from.line, 0); }
+      }
+      var changeEvent = {from: from, to: to, text: multiPaste ? multiPaste[i$1 % multiPaste.length] : textLines,
+                         origin: origin || (paste ? "paste" : cm.state.cutIncoming > recent ? "cut" : "+input")};
+      makeChange(cm.doc, changeEvent);
+      signalLater(cm, "inputRead", cm, changeEvent);
+    }
+    if (inserted && !paste)
+      { triggerElectric(cm, inserted); }
+
+    ensureCursorVisible(cm);
+    if (cm.curOp.updateInput < 2) { cm.curOp.updateInput = updateInput; }
+    cm.curOp.typing = true;
+    cm.state.pasteIncoming = cm.state.cutIncoming = -1;
+  }
+
+  function handlePaste(e, cm) {
+    var pasted = e.clipboardData && e.clipboardData.getData("Text");
+    if (pasted) {
+      e.preventDefault();
+      if (!cm.isReadOnly() && !cm.options.disableInput)
+        { runInOp(cm, function () { return applyTextInput(cm, pasted, 0, null, "paste"); }); }
+      return true
+    }
+  }
+
+  function triggerElectric(cm, inserted) {
+    // When an 'electric' character is inserted, immediately trigger a reindent
+    if (!cm.options.electricChars || !cm.options.smartIndent) { return }
+    var sel = cm.doc.sel;
+
+    for (var i = sel.ranges.length - 1; i >= 0; i--) {
+      var range$$1 = sel.ranges[i];
+      if (range$$1.head.ch > 100 || (i && sel.ranges[i - 1].head.line == range$$1.head.line)) { continue }
+      var mode = cm.getModeAt(range$$1.head);
+      var indented = false;
+      if (mode.electricChars) {
+        for (var j = 0; j < mode.electricChars.length; j++)
+          { if (inserted.indexOf(mode.electricChars.charAt(j)) > -1) {
+            indented = indentLine(cm, range$$1.head.line, "smart");
+            break
+          } }
+      } else if (mode.electricInput) {
+        if (mode.electricInput.test(getLine(cm.doc, range$$1.head.line).text.slice(0, range$$1.head.ch)))
+          { indented = indentLine(cm, range$$1.head.line, "smart"); }
+      }
+      if (indented) { signalLater(cm, "electricInput", cm, range$$1.head.line); }
+    }
+  }
+
+  function copyableRanges(cm) {
+    var text = [], ranges = [];
+    for (var i = 0; i < cm.doc.sel.ranges.length; i++) {
+      var line = cm.doc.sel.ranges[i].head.line;
+      var lineRange = {anchor: Pos(line, 0), head: Pos(line + 1, 0)};
+      ranges.push(lineRange);
+      text.push(cm.getRange(lineRange.anchor, lineRange.head));
+    }
+    return {text: text, ranges: ranges}
+  }
+
+  function disableBrowserMagic(field, spellcheck, autocorrect, autocapitalize) {
+    field.setAttribute("autocorrect", autocorrect ? "" : "off");
+    field.setAttribute("autocapitalize", autocapitalize ? "" : "off");
+    field.setAttribute("spellcheck", !!spellcheck);
+  }
+
+  function hiddenTextarea() {
+    var te = elt("textarea", null, null, "position: absolute; bottom: -1em; padding: 0; width: 1px; height: 1em; outline: none");
+    var div = elt("div", [te], null, "overflow: hidden; position: relative; width: 3px; height: 0px;");
+    // The textarea is kept positioned near the cursor to prevent the
+    // fact that it'll be scrolled into view on input from scrolling
+    // our fake cursor out of view. On webkit, when wrap=off, paste is
+    // very slow. So make the area wide instead.
+    if (webkit) { te.style.width = "1000px"; }
+    else { te.setAttribute("wrap", "off"); }
+    // If border: 0; -- iOS fails to open keyboard (issue #1287)
+    if (ios) { te.style.border = "1px solid black"; }
+    disableBrowserMagic(te);
+    return div
+  }
+
+  // The publicly visible API. Note that methodOp(f) means
+  // 'wrap f in an operation, performed on its `this` parameter'.
+
+  // This is not the complete set of editor methods. Most of the
+  // methods defined on the Doc type are also injected into
+  // CodeMirror.prototype, for backwards compatibility and
+  // convenience.
+
+  function addEditorMethods(CodeMirror) {
+    var optionHandlers = CodeMirror.optionHandlers;
+
+    var helpers = CodeMirror.helpers = {};
+
+    CodeMirror.prototype = {
+      constructor: CodeMirror,
+      focus: function(){window.focus(); this.display.input.focus();},
+
+      setOption: function(option, value) {
+        var options = this.options, old = options[option];
+        if (options[option] == value && option != "mode") { return }
+        options[option] = value;
+        if (optionHandlers.hasOwnProperty(option))
+          { operation(this, optionHandlers[option])(this, value, old); }
+        signal(this, "optionChange", this, option);
+      },
+
+      getOption: function(option) {return this.options[option]},
+      getDoc: function() {return this.doc},
+
+      addKeyMap: function(map$$1, bottom) {
+        this.state.keyMaps[bottom ? "push" : "unshift"](getKeyMap(map$$1));
+      },
+      removeKeyMap: function(map$$1) {
+        var maps = this.state.keyMaps;
+        for (var i = 0; i < maps.length; ++i)
+          { if (maps[i] == map$$1 || maps[i].name == map$$1) {
+            maps.splice(i, 1);
+            return true
+          } }
+      },
+
+      addOverlay: methodOp(function(spec, options) {
+        var mode = spec.token ? spec : CodeMirror.getMode(this.options, spec);
+        if (mode.startState) { throw new Error("Overlays may not be stateful.") }
+        insertSorted(this.state.overlays,
+                     {mode: mode, modeSpec: spec, opaque: options && options.opaque,
+                      priority: (options && options.priority) || 0},
+                     function (overlay) { return overlay.priority; });
+        this.state.modeGen++;
+        regChange(this);
+      }),
+      removeOverlay: methodOp(function(spec) {
+        var this$1 = this;
+
+        var overlays = this.state.overlays;
+        for (var i = 0; i < overlays.length; ++i) {
+          var cur = overlays[i].modeSpec;
+          if (cur == spec || typeof spec == "string" && cur.name == spec) {
+            overlays.splice(i, 1);
+            this$1.state.modeGen++;
+            regChange(this$1);
+            return
+          }
+        }
+      }),
+
+      indentLine: methodOp(function(n, dir, aggressive) {
+        if (typeof dir != "string" && typeof dir != "number") {
+          if (dir == null) { dir = this.options.smartIndent ? "smart" : "prev"; }
+          else { dir = dir ? "add" : "subtract"; }
+        }
+        if (isLine(this.doc, n)) { indentLine(this, n, dir, aggressive); }
+      }),
+      indentSelection: methodOp(function(how) {
+        var this$1 = this;
+
+        var ranges = this.doc.sel.ranges, end = -1;
+        for (var i = 0; i < ranges.length; i++) {
+          var range$$1 = ranges[i];
+          if (!range$$1.empty()) {
+            var from = range$$1.from(), to = range$$1.to();
+            var start = Math.max(end, from.line);
+            end = Math.min(this$1.lastLine(), to.line - (to.ch ? 0 : 1)) + 1;
+            for (var j = start; j < end; ++j)
+              { indentLine(this$1, j, how); }
+            var newRanges = this$1.doc.sel.ranges;
+            if (from.ch == 0 && ranges.length == newRanges.length && newRanges[i].from().ch > 0)
+              { replaceOneSelection(this$1.doc, i, new Range(from, newRanges[i].to()), sel_dontScroll); }
+          } else if (range$$1.head.line > end) {
+            indentLine(this$1, range$$1.head.line, how, true);
+            end = range$$1.head.line;
+            if (i == this$1.doc.sel.primIndex) { ensureCursorVisible(this$1); }
+          }
+        }
+      }),
+
+      // Fetch the parser token for a given character. Useful for hacks
+      // that want to inspect the mode state (say, for completion).
+      getTokenAt: function(pos, precise) {
+        return takeToken(this, pos, precise)
+      },
+
+      getLineTokens: function(line, precise) {
+        return takeToken(this, Pos(line), precise, true)
+      },
+
+      getTokenTypeAt: function(pos) {
+        pos = clipPos(this.doc, pos);
+        var styles = getLineStyles(this, getLine(this.doc, pos.line));
+        var before = 0, after = (styles.length - 1) / 2, ch = pos.ch;
+        var type;
+        if (ch == 0) { type = styles[2]; }
+        else { for (;;) {
+          var mid = (before + after) >> 1;
+          if ((mid ? styles[mid * 2 - 1] : 0) >= ch) { after = mid; }
+          else if (styles[mid * 2 + 1] < ch) { before = mid + 1; }
+          else { type = styles[mid * 2 + 2]; break }
+        } }
+        var cut = type ? type.indexOf("overlay ") : -1;
+        return cut < 0 ? type : cut == 0 ? null : type.slice(0, cut - 1)
+      },
+
+      getModeAt: function(pos) {
+        var mode = this.doc.mode;
+        if (!mode.innerMode) { return mode }
+        return CodeMirror.innerMode(mode, this.getTokenAt(pos).state).mode
+      },
+
+      getHelper: function(pos, type) {
+        return this.getHelpers(pos, type)[0]
+      },
+
+      getHelpers: function(pos, type) {
+        var this$1 = this;
+
+        var found = [];
+        if (!helpers.hasOwnProperty(type)) { return found }
+        var help = helpers[type], mode = this.getModeAt(pos);
+        if (typeof mode[type] == "string") {
+          if (help[mode[type]]) { found.push(help[mode[type]]); }
+        } else if (mode[type]) {
+          for (var i = 0; i < mode[type].length; i++) {
+            var val = help[mode[type][i]];
+            if (val) { found.push(val); }
+          }
+        } else if (mode.helperType && help[mode.helperType]) {
+          found.push(help[mode.helperType]);
+        } else if (help[mode.name]) {
+          found.push(help[mode.name]);
+        }
+        for (var i$1 = 0; i$1 < help._global.length; i$1++) {
+          var cur = help._global[i$1];
+          if (cur.pred(mode, this$1) && indexOf(found, cur.val) == -1)
+            { found.push(cur.val); }
+        }
+        return found
+      },
+
+      getStateAfter: function(line, precise) {
+        var doc = this.doc;
+        line = clipLine(doc, line == null ? doc.first + doc.size - 1: line);
+        return getContextBefore(this, line + 1, precise).state
+      },
+
+      cursorCoords: function(start, mode) {
+        var pos, range$$1 = this.doc.sel.primary();
+        if (start == null) { pos = range$$1.head; }
+        else if (typeof start == "object") { pos = clipPos(this.doc, start); }
+        else { pos = start ? range$$1.from() : range$$1.to(); }
+        return cursorCoords(this, pos, mode || "page")
+      },
+
+      charCoords: function(pos, mode) {
+        return charCoords(this, clipPos(this.doc, pos), mode || "page")
+      },
+
+      coordsChar: function(coords, mode) {
+        coords = fromCoordSystem(this, coords, mode || "page");
+        return coordsChar(this, coords.left, coords.top)
+      },
+
+      lineAtHeight: function(height, mode) {
+        height = fromCoordSystem(this, {top: height, left: 0}, mode || "page").top;
+        return lineAtHeight(this.doc, height + this.display.viewOffset)
+      },
+      heightAtLine: function(line, mode, includeWidgets) {
+        var end = false, lineObj;
+        if (typeof line == "number") {
+          var last = this.doc.first + this.doc.size - 1;
+          if (line < this.doc.first) { line = this.doc.first; }
+          else if (line > last) { line = last; end = true; }
+          lineObj = getLine(this.doc, line);
+        } else {
+          lineObj = line;
+        }
+        return intoCoordSystem(this, lineObj, {top: 0, left: 0}, mode || "page", includeWidgets || end).top +
+          (end ? this.doc.height - heightAtLine(lineObj) : 0)
+      },
+
+      defaultTextHeight: function() { return textHeight(this.display) },
+      defaultCharWidth: function() { return charWidth(this.display) },
+
+      getViewport: function() { return {from: this.display.viewFrom, to: this.display.viewTo}},
+
+      addWidget: function(pos, node, scroll, vert, horiz) {
+        var display = this.display;
+        pos = cursorCoords(this, clipPos(this.doc, pos));
+        var top = pos.bottom, left = pos.left;
+        node.style.position = "absolute";
+        node.setAttribute("cm-ignore-events", "true");
+        this.display.input.setUneditable(node);
+        display.sizer.appendChild(node);
+        if (vert == "over") {
+          top = pos.top;
+        } else if (vert == "above" || vert == "near") {
+          var vspace = Math.max(display.wrapper.clientHeight, this.doc.height),
+          hspace = Math.max(display.sizer.clientWidth, display.lineSpace.clientWidth);
+          // Default to positioning above (if specified and possible); otherwise default to positioning below
+          if ((vert == 'above' || pos.bottom + node.offsetHeight > vspace) && pos.top > node.offsetHeight)
+            { top = pos.top - node.offsetHeight; }
+          else if (pos.bottom + node.offsetHeight <= vspace)
+            { top = pos.bottom; }
+          if (left + node.offsetWidth > hspace)
+            { left = hspace - node.offsetWidth; }
+        }
+        node.style.top = top + "px";
+        node.style.left = node.style.right = "";
+        if (horiz == "right") {
+          left = display.sizer.clientWidth - node.offsetWidth;
+          node.style.right = "0px";
+        } else {
+          if (horiz == "left") { left = 0; }
+          else if (horiz == "middle") { left = (display.sizer.clientWidth - node.offsetWidth) / 2; }
+          node.style.left = left + "px";
+        }
+        if (scroll)
+          { scrollIntoView(this, {left: left, top: top, right: left + node.offsetWidth, bottom: top + node.offsetHeight}); }
+      },
+
+      triggerOnKeyDown: methodOp(onKeyDown),
+      triggerOnKeyPress: methodOp(onKeyPress),
+      triggerOnKeyUp: onKeyUp,
+      triggerOnMouseDown: methodOp(onMouseDown),
+
+      execCommand: function(cmd) {
+        if (commands.hasOwnProperty(cmd))
+          { return commands[cmd].call(null, this) }
+      },
+
+      triggerElectric: methodOp(function(text) { triggerElectric(this, text); }),
+
+      findPosH: function(from, amount, unit, visually) {
+        var this$1 = this;
+
+        var dir = 1;
+        if (amount < 0) { dir = -1; amount = -amount; }
+        var cur = clipPos(this.doc, from);
+        for (var i = 0; i < amount; ++i) {
+          cur = findPosH(this$1.doc, cur, dir, unit, visually);
+          if (cur.hitSide) { break }
+        }
+        return cur
+      },
+
+      moveH: methodOp(function(dir, unit) {
+        var this$1 = this;
+
+        this.extendSelectionsBy(function (range$$1) {
+          if (this$1.display.shift || this$1.doc.extend || range$$1.empty())
+            { return findPosH(this$1.doc, range$$1.head, dir, unit, this$1.options.rtlMoveVisually) }
+          else
+            { return dir < 0 ? range$$1.from() : range$$1.to() }
+        }, sel_move);
+      }),
+
+      deleteH: methodOp(function(dir, unit) {
+        var sel = this.doc.sel, doc = this.doc;
+        if (sel.somethingSelected())
+          { doc.replaceSelection("", null, "+delete"); }
+        else
+          { deleteNearSelection(this, function (range$$1) {
+            var other = findPosH(doc, range$$1.head, dir, unit, false);
+            return dir < 0 ? {from: other, to: range$$1.head} : {from: range$$1.head, to: other}
+          }); }
+      }),
+
+      findPosV: function(from, amount, unit, goalColumn) {
+        var this$1 = this;
+
+        var dir = 1, x = goalColumn;
+        if (amount < 0) { dir = -1; amount = -amount; }
+        var cur = clipPos(this.doc, from);
+        for (var i = 0; i < amount; ++i) {
+          var coords = cursorCoords(this$1, cur, "div");
+          if (x == null) { x = coords.left; }
+          else { coords.left = x; }
+          cur = findPosV(this$1, coords, dir, unit);
+          if (cur.hitSide) { break }
+        }
+        return cur
+      },
+
+      moveV: methodOp(function(dir, unit) {
+        var this$1 = this;
+
+        var doc = this.doc, goals = [];
+        var collapse = !this.display.shift && !doc.extend && doc.sel.somethingSelected();
+        doc.extendSelectionsBy(function (range$$1) {
+          if (collapse)
+            { return dir < 0 ? range$$1.from() : range$$1.to() }
+          var headPos = cursorCoords(this$1, range$$1.head, "div");
+          if (range$$1.goalColumn != null) { headPos.left = range$$1.goalColumn; }
+          goals.push(headPos.left);
+          var pos = findPosV(this$1, headPos, dir, unit);
+          if (unit == "page" && range$$1 == doc.sel.primary())
+            { addToScrollTop(this$1, charCoords(this$1, pos, "div").top - headPos.top); }
+          return pos
+        }, sel_move);
+        if (goals.length) { for (var i = 0; i < doc.sel.ranges.length; i++)
+          { doc.sel.ranges[i].goalColumn = goals[i]; } }
+      }),
+
+      // Find the word at the given position (as returned by coordsChar).
+      findWordAt: function(pos) {
+        var doc = this.doc, line = getLine(doc, pos.line).text;
+        var start = pos.ch, end = pos.ch;
+        if (line) {
+          var helper = this.getHelper(pos, "wordChars");
+          if ((pos.sticky == "before" || end == line.length) && start) { --start; } else { ++end; }
+          var startChar = line.charAt(start);
+          var check = isWordChar(startChar, helper)
+            ? function (ch) { return isWordChar(ch, helper); }
+            : /\s/.test(startChar) ? function (ch) { return /\s/.test(ch); }
+            : function (ch) { return (!/\s/.test(ch) && !isWordChar(ch)); };
+          while (start > 0 && check(line.charAt(start - 1))) { --start; }
+          while (end < line.length && check(line.charAt(end))) { ++end; }
+        }
+        return new Range(Pos(pos.line, start), Pos(pos.line, end))
+      },
+
+      toggleOverwrite: function(value) {
+        if (value != null && value == this.state.overwrite) { return }
+        if (this.state.overwrite = !this.state.overwrite)
+          { addClass(this.display.cursorDiv, "CodeMirror-overwrite"); }
+        else
+          { rmClass(this.display.cursorDiv, "CodeMirror-overwrite"); }
+
+        signal(this, "overwriteToggle", this, this.state.overwrite);
+      },
+      hasFocus: function() { return this.display.input.getField() == activeElt() },
+      isReadOnly: function() { return !!(this.options.readOnly || this.doc.cantEdit) },
+
+      scrollTo: methodOp(function (x, y) { scrollToCoords(this, x, y); }),
+      getScrollInfo: function() {
+        var scroller = this.display.scroller;
+        return {left: scroller.scrollLeft, top: scroller.scrollTop,
+                height: scroller.scrollHeight - scrollGap(this) - this.display.barHeight,
+                width: scroller.scrollWidth - scrollGap(this) - this.display.barWidth,
+                clientHeight: displayHeight(this), clientWidth: displayWidth(this)}
+      },
+
+      scrollIntoView: methodOp(function(range$$1, margin) {
+        if (range$$1 == null) {
+          range$$1 = {from: this.doc.sel.primary().head, to: null};
+          if (margin == null) { margin = this.options.cursorScrollMargin; }
+        } else if (typeof range$$1 == "number") {
+          range$$1 = {from: Pos(range$$1, 0), to: null};
+        } else if (range$$1.from == null) {
+          range$$1 = {from: range$$1, to: null};
+        }
+        if (!range$$1.to) { range$$1.to = range$$1.from; }
+        range$$1.margin = margin || 0;
+
+        if (range$$1.from.line != null) {
+          scrollToRange(this, range$$1);
+        } else {
+          scrollToCoordsRange(this, range$$1.from, range$$1.to, range$$1.margin);
+        }
+      }),
+
+      setSize: methodOp(function(width, height) {
+        var this$1 = this;
+
+        var interpret = function (val) { return typeof val == "number" || /^\d+$/.test(String(val)) ? val + "px" : val; };
+        if (width != null) { this.display.wrapper.style.width = interpret(width); }
+        if (height != null) { this.display.wrapper.style.height = interpret(height); }
+        if (this.options.lineWrapping) { clearLineMeasurementCache(this); }
+        var lineNo$$1 = this.display.viewFrom;
+        this.doc.iter(lineNo$$1, this.display.viewTo, function (line) {
+          if (line.widgets) { for (var i = 0; i < line.widgets.length; i++)
+            { if (line.widgets[i].noHScroll) { regLineChange(this$1, lineNo$$1, "widget"); break } } }
+          ++lineNo$$1;
+        });
+        this.curOp.forceUpdate = true;
+        signal(this, "refresh", this);
+      }),
+
+      operation: function(f){return runInOp(this, f)},
+      startOperation: function(){return startOperation(this)},
+      endOperation: function(){return endOperation(this)},
+
+      refresh: methodOp(function() {
+        var oldHeight = this.display.cachedTextHeight;
+        regChange(this);
+        this.curOp.forceUpdate = true;
+        clearCaches(this);
+        scrollToCoords(this, this.doc.scrollLeft, this.doc.scrollTop);
+        updateGutterSpace(this.display);
+        if (oldHeight == null || Math.abs(oldHeight - textHeight(this.display)) > .5)
+          { estimateLineHeights(this); }
+        signal(this, "refresh", this);
+      }),
+
+      swapDoc: methodOp(function(doc) {
+        var old = this.doc;
+        old.cm = null;
+        // Cancel the current text selection if any (#5821)
+        if (this.state.selectingText) { this.state.selectingText(); }
+        attachDoc(this, doc);
+        clearCaches(this);
+        this.display.input.reset();
+        scrollToCoords(this, doc.scrollLeft, doc.scrollTop);
+        this.curOp.forceScroll = true;
+        signalLater(this, "swapDoc", this, old);
+        return old
+      }),
+
+      phrase: function(phraseText) {
+        var phrases = this.options.phrases;
+        return phrases && Object.prototype.hasOwnProperty.call(phrases, phraseText) ? phrases[phraseText] : phraseText
+      },
+
+      getInputField: function(){return this.display.input.getField()},
+      getWrapperElement: function(){return this.display.wrapper},
+      getScrollerElement: function(){return this.display.scroller},
+      getGutterElement: function(){return this.display.gutters}
+    };
+    eventMixin(CodeMirror);
+
+    CodeMirror.registerHelper = function(type, name, value) {
+      if (!helpers.hasOwnProperty(type)) { helpers[type] = CodeMirror[type] = {_global: []}; }
+      helpers[type][name] = value;
+    };
+    CodeMirror.registerGlobalHelper = function(type, name, predicate, value) {
+      CodeMirror.registerHelper(type, name, value);
+      helpers[type]._global.push({pred: predicate, val: value});
+    };
+  }
+
+  // Used for horizontal relative motion. Dir is -1 or 1 (left or
+  // right), unit can be "char", "column" (like char, but doesn't
+  // cross line boundaries), "word" (across next word), or "group" (to
+  // the start of next group of word or non-word-non-whitespace
+  // chars). The visually param controls whether, in right-to-left
+  // text, direction 1 means to move towards the next index in the
+  // string, or towards the character to the right of the current
+  // position. The resulting position will have a hitSide=true
+  // property if it reached the end of the document.
+  function findPosH(doc, pos, dir, unit, visually) {
+    var oldPos = pos;
+    var origDir = dir;
+    var lineObj = getLine(doc, pos.line);
+    function findNextLine() {
+      var l = pos.line + dir;
+      if (l < doc.first || l >= doc.first + doc.size) { return false }
+      pos = new Pos(l, pos.ch, pos.sticky);
+      return lineObj = getLine(doc, l)
+    }
+    function moveOnce(boundToLine) {
+      var next;
+      if (visually) {
+        next = moveVisually(doc.cm, lineObj, pos, dir);
+      } else {
+        next = moveLogically(lineObj, pos, dir);
+      }
+      if (next == null) {
+        if (!boundToLine && findNextLine())
+          { pos = endOfLine(visually, doc.cm, lineObj, pos.line, dir); }
+        else
+          { return false }
+      } else {
+        pos = next;
+      }
+      return true
+    }
+
+    if (unit == "char") {
+      moveOnce();
+    } else if (unit == "column") {
+      moveOnce(true);
+    } else if (unit == "word" || unit == "group") {
+      var sawType = null, group = unit == "group";
+      var helper = doc.cm && doc.cm.getHelper(pos, "wordChars");
+      for (var first = true;; first = false) {
+        if (dir < 0 && !moveOnce(!first)) { break }
+        var cur = lineObj.text.charAt(pos.ch) || "\n";
+        var type = isWordChar(cur, helper) ? "w"
+          : group && cur == "\n" ? "n"
+          : !group || /\s/.test(cur) ? null
+          : "p";
+        if (group && !first && !type) { type = "s"; }
+        if (sawType && sawType != type) {
+          if (dir < 0) {dir = 1; moveOnce(); pos.sticky = "after";}
+          break
+        }
+
+        if (type) { sawType = type; }
+        if (dir > 0 && !moveOnce(!first)) { break }
+      }
+    }
+    var result = skipAtomic(doc, pos, oldPos, origDir, true);
+    if (equalCursorPos(oldPos, result)) { result.hitSide = true; }
+    return result
+  }
+
+  // For relative vertical movement. Dir may be -1 or 1. Unit can be
+  // "page" or "line". The resulting position will have a hitSide=true
+  // property if it reached the end of the document.
+  function findPosV(cm, pos, dir, unit) {
+    var doc = cm.doc, x = pos.left, y;
+    if (unit == "page") {
+      var pageSize = Math.min(cm.display.wrapper.clientHeight, window.innerHeight || document.documentElement.clientHeight);
+      var moveAmount = Math.max(pageSize - .5 * textHeight(cm.display), 3);
+      y = (dir > 0 ? pos.bottom : pos.top) + dir * moveAmount;
+
+    } else if (unit == "line") {
+      y = dir > 0 ? pos.bottom + 3 : pos.top - 3;
+    }
+    var target;
+    for (;;) {
+      target = coordsChar(cm, x, y);
+      if (!target.outside) { break }
+      if (dir < 0 ? y <= 0 : y >= doc.height) { target.hitSide = true; break }
+      y += dir * 5;
+    }
+    return target
+  }
+
+  // CONTENTEDITABLE INPUT STYLE
+
+  var ContentEditableInput = function(cm) {
+    this.cm = cm;
+    this.lastAnchorNode = this.lastAnchorOffset = this.lastFocusNode = this.lastFocusOffset = null;
+    this.polling = new Delayed();
+    this.composing = null;
+    this.gracePeriod = false;
+    this.readDOMTimeout = null;
+  };
+
+  ContentEditableInput.prototype.init = function (display) {
+      var this$1 = this;
+
+    var input = this, cm = input.cm;
+    var div = input.div = display.lineDiv;
+    disableBrowserMagic(div, cm.options.spellcheck, cm.options.autocorrect, cm.options.autocapitalize);
+
+    on(div, "paste", function (e) {
+      if (signalDOMEvent(cm, e) || handlePaste(e, cm)) { return }
+      // IE doesn't fire input events, so we schedule a read for the pasted content in this way
+      if (ie_version <= 11) { setTimeout(operation(cm, function () { return this$1.updateFromDOM(); }), 20); }
+    });
+
+    on(div, "compositionstart", function (e) {
+      this$1.composing = {data: e.data, done: false};
+    });
+    on(div, "compositionupdate", function (e) {
+      if (!this$1.composing) { this$1.composing = {data: e.data, done: false}; }
+    });
+    on(div, "compositionend", function (e) {
+      if (this$1.composing) {
+        if (e.data != this$1.composing.data) { this$1.readFromDOMSoon(); }
+        this$1.composing.done = true;
+      }
+    });
+
+    on(div, "touchstart", function () { return input.forceCompositionEnd(); });
+
+    on(div, "input", function () {
+      if (!this$1.composing) { this$1.readFromDOMSoon(); }
+    });
+
+    function onCopyCut(e) {
+      if (signalDOMEvent(cm, e)) { return }
+      if (cm.somethingSelected()) {
+        setLastCopied({lineWise: false, text: cm.getSelections()});
+        if (e.type == "cut") { cm.replaceSelection("", null, "cut"); }
+      } else if (!cm.options.lineWiseCopyCut) {
+        return
+      } else {
+        var ranges = copyableRanges(cm);
+        setLastCopied({lineWise: true, text: ranges.text});
+        if (e.type == "cut") {
+          cm.operation(function () {
+            cm.setSelections(ranges.ranges, 0, sel_dontScroll);
+            cm.replaceSelection("", null, "cut");
+          });
+        }
+      }
+      if (e.clipboardData) {
+        e.clipboardData.clearData();
+        var content = lastCopied.text.join("\n");
+        // iOS exposes the clipboard API, but seems to discard content inserted into it
+        e.clipboardData.setData("Text", content);
+        if (e.clipboardData.getData("Text") == content) {
+          e.preventDefault();
+          return
+        }
+      }
+      // Old-fashioned briefly-focus-a-textarea hack
+      var kludge = hiddenTextarea(), te = kludge.firstChild;
+      cm.display.lineSpace.insertBefore(kludge, cm.display.lineSpace.firstChild);
+      te.value = lastCopied.text.join("\n");
+      var hadFocus = document.activeElement;
+      selectInput(te);
+      setTimeout(function () {
+        cm.display.lineSpace.removeChild(kludge);
+        hadFocus.focus();
+        if (hadFocus == div) { input.showPrimarySelection(); }
+      }, 50);
+    }
+    on(div, "copy", onCopyCut);
+    on(div, "cut", onCopyCut);
+  };
+
+  ContentEditableInput.prototype.prepareSelection = function () {
+    var result = prepareSelection(this.cm, false);
+    result.focus = this.cm.state.focused;
+    return result
+  };
+
+  ContentEditableInput.prototype.showSelection = function (info, takeFocus) {
+    if (!info || !this.cm.display.view.length) { return }
+    if (info.focus || takeFocus) { this.showPrimarySelection(); }
+    this.showMultipleSelections(info);
+  };
+
+  ContentEditableInput.prototype.getSelection = function () {
+    return this.cm.display.wrapper.ownerDocument.getSelection()
+  };
+
+  ContentEditableInput.prototype.showPrimarySelection = function () {
+    var sel = this.getSelection(), cm = this.cm, prim = cm.doc.sel.primary();
+    var from = prim.from(), to = prim.to();
+
+    if (cm.display.viewTo == cm.display.viewFrom || from.line >= cm.display.viewTo || to.line < cm.display.viewFrom) {
+      sel.removeAllRanges();
+      return
+    }
+
+    var curAnchor = domToPos(cm, sel.anchorNode, sel.anchorOffset);
+    var curFocus = domToPos(cm, sel.focusNode, sel.focusOffset);
+    if (curAnchor && !curAnchor.bad && curFocus && !curFocus.bad &&
+        cmp(minPos(curAnchor, curFocus), from) == 0 &&
+        cmp(maxPos(curAnchor, curFocus), to) == 0)
+      { return }
+
+    var view = cm.display.view;
+    var start = (from.line >= cm.display.viewFrom && posToDOM(cm, from)) ||
+        {node: view[0].measure.map[2], offset: 0};
+    var end = to.line < cm.display.viewTo && posToDOM(cm, to);
+    if (!end) {
+      var measure = view[view.length - 1].measure;
+      var map$$1 = measure.maps ? measure.maps[measure.maps.length - 1] : measure.map;
+      end = {node: map$$1[map$$1.length - 1], offset: map$$1[map$$1.length - 2] - map$$1[map$$1.length - 3]};
+    }
+
+    if (!start || !end) {
+      sel.removeAllRanges();
+      return
+    }
+
+    var old = sel.rangeCount && sel.getRangeAt(0), rng;
+    try { rng = range(start.node, start.offset, end.offset, end.node); }
+    catch(e) {} // Our model of the DOM might be outdated, in which case the range we try to set can be impossible
+    if (rng) {
+      if (!gecko && cm.state.focused) {
+        sel.collapse(start.node, start.offset);
+        if (!rng.collapsed) {
+          sel.removeAllRanges();
+          sel.addRange(rng);
+        }
+      } else {
+        sel.removeAllRanges();
+        sel.addRange(rng);
+      }
+      if (old && sel.anchorNode == null) { sel.addRange(old); }
+      else if (gecko) { this.startGracePeriod(); }
+    }
+    this.rememberSelection();
+  };
+
+  ContentEditableInput.prototype.startGracePeriod = function () {
+      var this$1 = this;
+
+    clearTimeout(this.gracePeriod);
+    this.gracePeriod = setTimeout(function () {
+      this$1.gracePeriod = false;
+      if (this$1.selectionChanged())
+        { this$1.cm.operation(function () { return this$1.cm.curOp.selectionChanged = true; }); }
+    }, 20);
+  };
+
+  ContentEditableInput.prototype.showMultipleSelections = function (info) {
+    removeChildrenAndAdd(this.cm.display.cursorDiv, info.cursors);
+    removeChildrenAndAdd(this.cm.display.selectionDiv, info.selection);
+  };
+
+  ContentEditableInput.prototype.rememberSelection = function () {
+    var sel = this.getSelection();
+    this.lastAnchorNode = sel.anchorNode; this.lastAnchorOffset = sel.anchorOffset;
+    this.lastFocusNode = sel.focusNode; this.lastFocusOffset = sel.focusOffset;
+  };
+
+  ContentEditableInput.prototype.selectionInEditor = function () {
+    var sel = this.getSelection();
+    if (!sel.rangeCount) { return false }
+    var node = sel.getRangeAt(0).commonAncestorContainer;
+    return contains(this.div, node)
+  };
+
+  ContentEditableInput.prototype.focus = function () {
+    if (this.cm.options.readOnly != "nocursor") {
+      if (!this.selectionInEditor())
+        { this.showSelection(this.prepareSelection(), true); }
+      this.div.focus();
+    }
+  };
+  ContentEditableInput.prototype.blur = function () { this.div.blur(); };
+  ContentEditableInput.prototype.getField = function () { return this.div };
+
+  ContentEditableInput.prototype.supportsTouch = function () { return true };
+
+  ContentEditableInput.prototype.receivedFocus = function () {
+    var input = this;
+    if (this.selectionInEditor())
+      { this.pollSelection(); }
+    else
+      { runInOp(this.cm, function () { return input.cm.curOp.selectionChanged = true; }); }
+
+    function poll() {
+      if (input.cm.state.focused) {
+        input.pollSelection();
+        input.polling.set(input.cm.options.pollInterval, poll);
+      }
+    }
+    this.polling.set(this.cm.options.pollInterval, poll);
+  };
+
+  ContentEditableInput.prototype.selectionChanged = function () {
+    var sel = this.getSelection();
+    return sel.anchorNode != this.lastAnchorNode || sel.anchorOffset != this.lastAnchorOffset ||
+      sel.focusNode != this.lastFocusNode || sel.focusOffset != this.lastFocusOffset
+  };
+
+  ContentEditableInput.prototype.pollSelection = function () {
+    if (this.readDOMTimeout != null || this.gracePeriod || !this.selectionChanged()) { return }
+    var sel = this.getSelection(), cm = this.cm;
+    // On Android Chrome (version 56, at least), backspacing into an
+    // uneditable block element will put the cursor in that element,
+    // and then, because it's not editable, hide the virtual keyboard.
+    // Because Android doesn't allow us to actually detect backspace
+    // presses in a sane way, this code checks for when that happens
+    // and simulates a backspace press in this case.
+    if (android && chrome && this.cm.display.gutterSpecs.length && isInGutter(sel.anchorNode)) {
+      this.cm.triggerOnKeyDown({type: "keydown", keyCode: 8, preventDefault: Math.abs});
+      this.blur();
+      this.focus();
+      return
+    }
+    if (this.composing) { return }
+    this.rememberSelection();
+    var anchor = domToPos(cm, sel.anchorNode, sel.anchorOffset);
+    var head = domToPos(cm, sel.focusNode, sel.focusOffset);
+    if (anchor && head) { runInOp(cm, function () {
+      setSelection(cm.doc, simpleSelection(anchor, head), sel_dontScroll);
+      if (anchor.bad || head.bad) { cm.curOp.selectionChanged = true; }
+    }); }
+  };
+
+  ContentEditableInput.prototype.pollContent = function () {
+    if (this.readDOMTimeout != null) {
+      clearTimeout(this.readDOMTimeout);
+      this.readDOMTimeout = null;
+    }
+
+    var cm = this.cm, display = cm.display, sel = cm.doc.sel.primary();
+    var from = sel.from(), to = sel.to();
+    if (from.ch == 0 && from.line > cm.firstLine())
+      { from = Pos(from.line - 1, getLine(cm.doc, from.line - 1).length); }
+    if (to.ch == getLine(cm.doc, to.line).text.length && to.line < cm.lastLine())
+      { to = Pos(to.line + 1, 0); }
+    if (from.line < display.viewFrom || to.line > display.viewTo - 1) { return false }
+
+    var fromIndex, fromLine, fromNode;
+    if (from.line == display.viewFrom || (fromIndex = findViewIndex(cm, from.line)) == 0) {
+      fromLine = lineNo(display.view[0].line);
+      fromNode = display.view[0].node;
+    } else {
+      fromLine = lineNo(display.view[fromIndex].line);
+      fromNode = display.view[fromIndex - 1].node.nextSibling;
+    }
+    var toIndex = findViewIndex(cm, to.line);
+    var toLine, toNode;
+    if (toIndex == display.view.length - 1) {
+      toLine = display.viewTo - 1;
+      toNode = display.lineDiv.lastChild;
+    } else {
+      toLine = lineNo(display.view[toIndex + 1].line) - 1;
+      toNode = display.view[toIndex + 1].node.previousSibling;
+    }
+
+    if (!fromNode) { return false }
+    var newText = cm.doc.splitLines(domTextBetween(cm, fromNode, toNode, fromLine, toLine));
+    var oldText = getBetween(cm.doc, Pos(fromLine, 0), Pos(toLine, getLine(cm.doc, toLine).text.length));
+    while (newText.length > 1 && oldText.length > 1) {
+      if (lst(newText) == lst(oldText)) { newText.pop(); oldText.pop(); toLine--; }
+      else if (newText[0] == oldText[0]) { newText.shift(); oldText.shift(); fromLine++; }
+      else { break }
+    }
+
+    var cutFront = 0, cutEnd = 0;
+    var newTop = newText[0], oldTop = oldText[0], maxCutFront = Math.min(newTop.length, oldTop.length);
+    while (cutFront < maxCutFront && newTop.charCodeAt(cutFront) == oldTop.charCodeAt(cutFront))
+      { ++cutFront; }
+    var newBot = lst(newText), oldBot = lst(oldText);
+    var maxCutEnd = Math.min(newBot.length - (newText.length == 1 ? cutFront : 0),
+                             oldBot.length - (oldText.length == 1 ? cutFront : 0));
+    while (cutEnd < maxCutEnd &&
+           newBot.charCodeAt(newBot.length - cutEnd - 1) == oldBot.charCodeAt(oldBot.length - cutEnd - 1))
+      { ++cutEnd; }
+    // Try to move start of change to start of selection if ambiguous
+    if (newText.length == 1 && oldText.length == 1 && fromLine == from.line) {
+      while (cutFront && cutFront > from.ch &&
+             newBot.charCodeAt(newBot.length - cutEnd - 1) == oldBot.charCodeAt(oldBot.length - cutEnd - 1)) {
+        cutFront--;
+        cutEnd++;
+      }
+    }
+
+    newText[newText.length - 1] = newBot.slice(0, newBot.length - cutEnd).replace(/^\u200b+/, "");
+    newText[0] = newText[0].slice(cutFront).replace(/\u200b+$/, "");
+
+    var chFrom = Pos(fromLine, cutFront);
+    var chTo = Pos(toLine, oldText.length ? lst(oldText).length - cutEnd : 0);
+    if (newText.length > 1 || newText[0] || cmp(chFrom, chTo)) {
+      replaceRange(cm.doc, newText, chFrom, chTo, "+input");
+      return true
+    }
+  };
+
+  ContentEditableInput.prototype.ensurePolled = function () {
+    this.forceCompositionEnd();
+  };
+  ContentEditableInput.prototype.reset = function () {
+    this.forceCompositionEnd();
+  };
+  ContentEditableInput.prototype.forceCompositionEnd = function () {
+    if (!this.composing) { return }
+    clearTimeout(this.readDOMTimeout);
+    this.composing = null;
+    this.updateFromDOM();
+    this.div.blur();
+    this.div.focus();
+  };
+  ContentEditableInput.prototype.readFromDOMSoon = function () {
+      var this$1 = this;
+
+    if (this.readDOMTimeout != null) { return }
+    this.readDOMTimeout = setTimeout(function () {
+      this$1.readDOMTimeout = null;
+      if (this$1.composing) {
+        if (this$1.composing.done) { this$1.composing = null; }
+        else { return }
+      }
+      this$1.updateFromDOM();
+    }, 80);
+  };
+
+  ContentEditableInput.prototype.updateFromDOM = function () {
+      var this$1 = this;
+
+    if (this.cm.isReadOnly() || !this.pollContent())
+      { runInOp(this.cm, function () { return regChange(this$1.cm); }); }
+  };
+
+  ContentEditableInput.prototype.setUneditable = function (node) {
+    node.contentEditable = "false";
+  };
+
+  ContentEditableInput.prototype.onKeyPress = function (e) {
+    if (e.charCode == 0 || this.composing) { return }
+    e.preventDefault();
+    if (!this.cm.isReadOnly())
+      { operation(this.cm, applyTextInput)(this.cm, String.fromCharCode(e.charCode == null ? e.keyCode : e.charCode), 0); }
+  };
+
+  ContentEditableInput.prototype.readOnlyChanged = function (val) {
+    this.div.contentEditable = String(val != "nocursor");
+  };
+
+  ContentEditableInput.prototype.onContextMenu = function () {};
+  ContentEditableInput.prototype.resetPosition = function () {};
+
+  ContentEditableInput.prototype.needsContentAttribute = true;
+
+  function posToDOM(cm, pos) {
+    var view = findViewForLine(cm, pos.line);
+    if (!view || view.hidden) { return null }
+    var line = getLine(cm.doc, pos.line);
+    var info = mapFromLineView(view, line, pos.line);
+
+    var order = getOrder(line, cm.doc.direction), side = "left";
+    if (order) {
+      var partPos = getBidiPartAt(order, pos.ch);
+      side = partPos % 2 ? "right" : "left";
+    }
+    var result = nodeAndOffsetInLineMap(info.map, pos.ch, side);
+    result.offset = result.collapse == "right" ? result.end : result.start;
+    return result
+  }
+
+  function isInGutter(node) {
+    for (var scan = node; scan; scan = scan.parentNode)
+      { if (/CodeMirror-gutter-wrapper/.test(scan.className)) { return true } }
+    return false
+  }
+
+  function badPos(pos, bad) { if (bad) { pos.bad = true; } return pos }
+
+  function domTextBetween(cm, from, to, fromLine, toLine) {
+    var text = "", closing = false, lineSep = cm.doc.lineSeparator(), extraLinebreak = false;
+    function recognizeMarker(id) { return function (marker) { return marker.id == id; } }
+    function close() {
+      if (closing) {
+        text += lineSep;
+        if (extraLinebreak) { text += lineSep; }
+        closing = extraLinebreak = false;
+      }
+    }
+    function addText(str) {
+      if (str) {
+        close();
+        text += str;
+      }
+    }
+    function walk(node) {
+      if (node.nodeType == 1) {
+        var cmText = node.getAttribute("cm-text");
+        if (cmText) {
+          addText(cmText);
+          return
+        }
+        var markerID = node.getAttribute("cm-marker"), range$$1;
+        if (markerID) {
+          var found = cm.findMarks(Pos(fromLine, 0), Pos(toLine + 1, 0), recognizeMarker(+markerID));
+          if (found.length && (range$$1 = found[0].find(0)))
+            { addText(getBetween(cm.doc, range$$1.from, range$$1.to).join(lineSep)); }
+          return
+        }
+        if (node.getAttribute("contenteditable") == "false") { return }
+        var isBlock = /^(pre|div|p|li|table|br)$/i.test(node.nodeName);
+        if (!/^br$/i.test(node.nodeName) && node.textContent.length == 0) { return }
+
+        if (isBlock) { close(); }
+        for (var i = 0; i < node.childNodes.length; i++)
+          { walk(node.childNodes[i]); }
+
+        if (/^(pre|p)$/i.test(node.nodeName)) { extraLinebreak = true; }
+        if (isBlock) { closing = true; }
+      } else if (node.nodeType == 3) {
+        addText(node.nodeValue.replace(/\u200b/g, "").replace(/\u00a0/g, " "));
+      }
+    }
+    for (;;) {
+      walk(from);
+      if (from == to) { break }
+      from = from.nextSibling;
+      extraLinebreak = false;
+    }
+    return text
+  }
+
+  function domToPos(cm, node, offset) {
+    var lineNode;
+    if (node == cm.display.lineDiv) {
+      lineNode = cm.display.lineDiv.childNodes[offset];
+      if (!lineNode) { return badPos(cm.clipPos(Pos(cm.display.viewTo - 1)), true) }
+      node = null; offset = 0;
+    } else {
+      for (lineNode = node;; lineNode = lineNode.parentNode) {
+        if (!lineNode || lineNode == cm.display.lineDiv) { return null }
+        if (lineNode.parentNode && lineNode.parentNode == cm.display.lineDiv) { break }
+      }
+    }
+    for (var i = 0; i < cm.display.view.length; i++) {
+      var lineView = cm.display.view[i];
+      if (lineView.node == lineNode)
+        { return locateNodeInLineView(lineView, node, offset) }
+    }
+  }
+
+  function locateNodeInLineView(lineView, node, offset) {
+    var wrapper = lineView.text.firstChild, bad = false;
+    if (!node || !contains(wrapper, node)) { return badPos(Pos(lineNo(lineView.line), 0), true) }
+    if (node == wrapper) {
+      bad = true;
+      node = wrapper.childNodes[offset];
+      offset = 0;
+      if (!node) {
+        var line = lineView.rest ? lst(lineView.rest) : lineView.line;
+        return badPos(Pos(lineNo(line), line.text.length), bad)
+      }
+    }
+
+    var textNode = node.nodeType == 3 ? node : null, topNode = node;
+    if (!textNode && node.childNodes.length == 1 && node.firstChild.nodeType == 3) {
+      textNode = node.firstChild;
+      if (offset) { offset = textNode.nodeValue.length; }
+    }
+    while (topNode.parentNode != wrapper) { topNode = topNode.parentNode; }
+    var measure = lineView.measure, maps = measure.maps;
+
+    function find(textNode, topNode, offset) {
+      for (var i = -1; i < (maps ? maps.length : 0); i++) {
+        var map$$1 = i < 0 ? measure.map : maps[i];
+        for (var j = 0; j < map$$1.length; j += 3) {
+          var curNode = map$$1[j + 2];
+          if (curNode == textNode || curNode == topNode) {
+            var line = lineNo(i < 0 ? lineView.line : lineView.rest[i]);
+            var ch = map$$1[j] + offset;
+            if (offset < 0 || curNode != textNode) { ch = map$$1[j + (offset ? 1 : 0)]; }
+            return Pos(line, ch)
+          }
+        }
+      }
+    }
+    var found = find(textNode, topNode, offset);
+    if (found) { return badPos(found, bad) }
+
+    // FIXME this is all really shaky. might handle the few cases it needs to handle, but likely to cause problems
+    for (var after = topNode.nextSibling, dist = textNode ? textNode.nodeValue.length - offset : 0; after; after = after.nextSibling) {
+      found = find(after, after.firstChild, 0);
+      if (found)
+        { return badPos(Pos(found.line, found.ch - dist), bad) }
+      else
+        { dist += after.textContent.length; }
+    }
+    for (var before = topNode.previousSibling, dist$1 = offset; before; before = before.previousSibling) {
+      found = find(before, before.firstChild, -1);
+      if (found)
+        { return badPos(Pos(found.line, found.ch + dist$1), bad) }
+      else
+        { dist$1 += before.textContent.length; }
+    }
+  }
+
+  // TEXTAREA INPUT STYLE
+
+  var TextareaInput = function(cm) {
+    this.cm = cm;
+    // See input.poll and input.reset
+    this.prevInput = "";
+
+    // Flag that indicates whether we expect input to appear real soon
+    // now (after some event like 'keypress' or 'input') and are
+    // polling intensively.
+    this.pollingFast = false;
+    // Self-resetting timeout for the poller
+    this.polling = new Delayed();
+    // Used to work around IE issue with selection being forgotten when focus moves away from textarea
+    this.hasSelection = false;
+    this.composing = null;
+  };
+
+  TextareaInput.prototype.init = function (display) {
+      var this$1 = this;
+
+    var input = this, cm = this.cm;
+    this.createField(display);
+    var te = this.textarea;
+
+    display.wrapper.insertBefore(this.wrapper, display.wrapper.firstChild);
+
+    // Needed to hide big blue blinking cursor on Mobile Safari (doesn't seem to work in iOS 8 anymore)
+    if (ios) { te.style.width = "0px"; }
+
+    on(te, "input", function () {
+      if (ie && ie_version >= 9 && this$1.hasSelection) { this$1.hasSelection = null; }
+      input.poll();
+    });
+
+    on(te, "paste", function (e) {
+      if (signalDOMEvent(cm, e) || handlePaste(e, cm)) { return }
+
+      cm.state.pasteIncoming = +new Date;
+      input.fastPoll();
+    });
+
+    function prepareCopyCut(e) {
+      if (signalDOMEvent(cm, e)) { return }
+      if (cm.somethingSelected()) {
+        setLastCopied({lineWise: false, text: cm.getSelections()});
+      } else if (!cm.options.lineWiseCopyCut) {
+        return
+      } else {
+        var ranges = copyableRanges(cm);
+        setLastCopied({lineWise: true, text: ranges.text});
+        if (e.type == "cut") {
+          cm.setSelections(ranges.ranges, null, sel_dontScroll);
+        } else {
+          input.prevInput = "";
+          te.value = ranges.text.join("\n");
+          selectInput(te);
+        }
+      }
+      if (e.type == "cut") { cm.state.cutIncoming = +new Date; }
+    }
+    on(te, "cut", prepareCopyCut);
+    on(te, "copy", prepareCopyCut);
+
+    on(display.scroller, "paste", function (e) {
+      if (eventInWidget(display, e) || signalDOMEvent(cm, e)) { return }
+      if (!te.dispatchEvent) {
+        cm.state.pasteIncoming = +new Date;
+        input.focus();
+        return
+      }
+
+      // Pass the `paste` event to the textarea so it's handled by its event listener.
+      var event = new Event("paste");
+      event.clipboardData = e.clipboardData;
+      te.dispatchEvent(event);
+    });
+
+    // Prevent normal selection in the editor (we handle our own)
+    on(display.lineSpace, "selectstart", function (e) {
+      if (!eventInWidget(display, e)) { e_preventDefault(e); }
+    });
+
+    on(te, "compositionstart", function () {
+      var start = cm.getCursor("from");
+      if (input.composing) { input.composing.range.clear(); }
+      input.composing = {
+        start: start,
+        range: cm.markText(start, cm.getCursor("to"), {className: "CodeMirror-composing"})
+      };
+    });
+    on(te, "compositionend", function () {
+      if (input.composing) {
+        input.poll();
+        input.composing.range.clear();
+        input.composing = null;
+      }
+    });
+  };
+
+  TextareaInput.prototype.createField = function (_display) {
+    // Wraps and hides input textarea
+    this.wrapper = hiddenTextarea();
+    // The semihidden textarea that is focused when the editor is
+    // focused, and receives input.
+    this.textarea = this.wrapper.firstChild;
+  };
+
+  TextareaInput.prototype.prepareSelection = function () {
+    // Redraw the selection and/or cursor
+    var cm = this.cm, display = cm.display, doc = cm.doc;
+    var result = prepareSelection(cm);
+
+    // Move the hidden textarea near the cursor to prevent scrolling artifacts
+    if (cm.options.moveInputWithCursor) {
+      var headPos = cursorCoords(cm, doc.sel.primary().head, "div");
+      var wrapOff = display.wrapper.getBoundingClientRect(), lineOff = display.lineDiv.getBoundingClientRect();
+      result.teTop = Math.max(0, Math.min(display.wrapper.clientHeight - 10,
+                                          headPos.top + lineOff.top - wrapOff.top));
+      result.teLeft = Math.max(0, Math.min(display.wrapper.clientWidth - 10,
+                                           headPos.left + lineOff.left - wrapOff.left));
+    }
+
+    return result
+  };
+
+  TextareaInput.prototype.showSelection = function (drawn) {
+    var cm = this.cm, display = cm.display;
+    removeChildrenAndAdd(display.cursorDiv, drawn.cursors);
+    removeChildrenAndAdd(display.selectionDiv, drawn.selection);
+    if (drawn.teTop != null) {
+      this.wrapper.style.top = drawn.teTop + "px";
+      this.wrapper.style.left = drawn.teLeft + "px";
+    }
+  };
+
+  // Reset the input to correspond to the selection (or to be empty,
+  // when not typing and nothing is selected)
+  TextareaInput.prototype.reset = function (typing) {
+    if (this.contextMenuPending || this.composing) { return }
+    var cm = this.cm;
+    if (cm.somethingSelected()) {
+      this.prevInput = "";
+      var content = cm.getSelection();
+      this.textarea.value = content;
+      if (cm.state.focused) { selectInput(this.textarea); }
+      if (ie && ie_version >= 9) { this.hasSelection = content; }
+    } else if (!typing) {
+      this.prevInput = this.textarea.value = "";
+      if (ie && ie_version >= 9) { this.hasSelection = null; }
+    }
+  };
+
+  TextareaInput.prototype.getField = function () { return this.textarea };
+
+  TextareaInput.prototype.supportsTouch = function () { return false };
+
+  TextareaInput.prototype.focus = function () {
+    if (this.cm.options.readOnly != "nocursor" && (!mobile || activeElt() != this.textarea)) {
+      try { this.textarea.focus(); }
+      catch (e) {} // IE8 will throw if the textarea is display: none or not in DOM
+    }
+  };
+
+  TextareaInput.prototype.blur = function () { this.textarea.blur(); };
+
+  TextareaInput.prototype.resetPosition = function () {
+    this.wrapper.style.top = this.wrapper.style.left = 0;
+  };
+
+  TextareaInput.prototype.receivedFocus = function () { this.slowPoll(); };
+
+  // Poll for input changes, using the normal rate of polling. This
+  // runs as long as the editor is focused.
+  TextareaInput.prototype.slowPoll = function () {
+      var this$1 = this;
+
+    if (this.pollingFast) { return }
+    this.polling.set(this.cm.options.pollInterval, function () {
+      this$1.poll();
+      if (this$1.cm.state.focused) { this$1.slowPoll(); }
+    });
+  };
+
+  // When an event has just come in that is likely to add or change
+  // something in the input textarea, we poll faster, to ensure that
+  // the change appears on the screen quickly.
+  TextareaInput.prototype.fastPoll = function () {
+    var missed = false, input = this;
+    input.pollingFast = true;
+    function p() {
+      var changed = input.poll();
+      if (!changed && !missed) {missed = true; input.polling.set(60, p);}
+      else {input.pollingFast = false; input.slowPoll();}
+    }
+    input.polling.set(20, p);
+  };
+
+  // Read input from the textarea, and update the document to match.
+  // When something is selected, it is present in the textarea, and
+  // selected (unless it is huge, in which case a placeholder is
+  // used). When nothing is selected, the cursor sits after previously
+  // seen text (can be empty), which is stored in prevInput (we must
+  // not reset the textarea when typing, because that breaks IME).
+  TextareaInput.prototype.poll = function () {
+      var this$1 = this;
+
+    var cm = this.cm, input = this.textarea, prevInput = this.prevInput;
+    // Since this is called a *lot*, try to bail out as cheaply as
+    // possible when it is clear that nothing happened. hasSelection
+    // will be the case when there is a lot of text in the textarea,
+    // in which case reading its value would be expensive.
+    if (this.contextMenuPending || !cm.state.focused ||
+        (hasSelection(input) && !prevInput && !this.composing) ||
+        cm.isReadOnly() || cm.options.disableInput || cm.state.keySeq)
+      { return false }
+
+    var text = input.value;
+    // If nothing changed, bail.
+    if (text == prevInput && !cm.somethingSelected()) { return false }
+    // Work around nonsensical selection resetting in IE9/10, and
+    // inexplicable appearance of private area unicode characters on
+    // some key combos in Mac (#2689).
+    if (ie && ie_version >= 9 && this.hasSelection === text ||
+        mac && /[\uf700-\uf7ff]/.test(text)) {
+      cm.display.input.reset();
+      return false
+    }
+
+    if (cm.doc.sel == cm.display.selForContextMenu) {
+      var first = text.charCodeAt(0);
+      if (first == 0x200b && !prevInput) { prevInput = "\u200b"; }
+      if (first == 0x21da) { this.reset(); return this.cm.execCommand("undo") }
+    }
+    // Find the part of the input that is actually new
+    var same = 0, l = Math.min(prevInput.length, text.length);
+    while (same < l && prevInput.charCodeAt(same) == text.charCodeAt(same)) { ++same; }
+
+    runInOp(cm, function () {
+      applyTextInput(cm, text.slice(same), prevInput.length - same,
+                     null, this$1.composing ? "*compose" : null);
+
+      // Don't leave long text in the textarea, since it makes further polling slow
+      if (text.length > 1000 || text.indexOf("\n") > -1) { input.value = this$1.prevInput = ""; }
+      else { this$1.prevInput = text; }
+
+      if (this$1.composing) {
+        this$1.composing.range.clear();
+        this$1.composing.range = cm.markText(this$1.composing.start, cm.getCursor("to"),
+                                           {className: "CodeMirror-composing"});
+      }
+    });
+    return true
+  };
+
+  TextareaInput.prototype.ensurePolled = function () {
+    if (this.pollingFast && this.poll()) { this.pollingFast = false; }
+  };
+
+  TextareaInput.prototype.onKeyPress = function () {
+    if (ie && ie_version >= 9) { this.hasSelection = null; }
+    this.fastPoll();
+  };
+
+  TextareaInput.prototype.onContextMenu = function (e) {
+    var input = this, cm = input.cm, display = cm.display, te = input.textarea;
+    if (input.contextMenuPending) { input.contextMenuPending(); }
+    var pos = posFromMouse(cm, e), scrollPos = display.scroller.scrollTop;
+    if (!pos || presto) { return } // Opera is difficult.
+
+    // Reset the current text selection only if the click is done outside of the selection
+    // and 'resetSelectionOnContextMenu' option is true.
+    var reset = cm.options.resetSelectionOnContextMenu;
+    if (reset && cm.doc.sel.contains(pos) == -1)
+      { operation(cm, setSelection)(cm.doc, simpleSelection(pos), sel_dontScroll); }
+
+    var oldCSS = te.style.cssText, oldWrapperCSS = input.wrapper.style.cssText;
+    var wrapperBox = input.wrapper.offsetParent.getBoundingClientRect();
+    input.wrapper.style.cssText = "position: static";
+    te.style.cssText = "position: absolute; width: 30px; height: 30px;\n      top: " + (e.clientY - wrapperBox.top - 5) + "px; left: " + (e.clientX - wrapperBox.left - 5) + "px;\n      z-index: 1000; background: " + (ie ? "rgba(255, 255, 255, .05)" : "transparent") + ";\n      outline: none; border-width: 0; outline: none; overflow: hidden; opacity: .05; filter: alpha(opacity=5);";
+    var oldScrollY;
+    if (webkit) { oldScrollY = window.scrollY; } // Work around Chrome issue (#2712)
+    display.input.focus();
+    if (webkit) { window.scrollTo(null, oldScrollY); }
+    display.input.reset();
+    // Adds "Select all" to context menu in FF
+    if (!cm.somethingSelected()) { te.value = input.prevInput = " "; }
+    input.contextMenuPending = rehide;
+    display.selForContextMenu = cm.doc.sel;
+    clearTimeout(display.detectingSelectAll);
+
+    // Select-all will be greyed out if there's nothing to select, so
+    // this adds a zero-width space so that we can later check whether
+    // it got selected.
+    function prepareSelectAllHack() {
+      if (te.selectionStart != null) {
+        var selected = cm.somethingSelected();
+        var extval = "\u200b" + (selected ? te.value : "");
+        te.value = "\u21da"; // Used to catch context-menu undo
+        te.value = extval;
+        input.prevInput = selected ? "" : "\u200b";
+        te.selectionStart = 1; te.selectionEnd = extval.length;
+        // Re-set this, in case some other handler touched the
+        // selection in the meantime.
+        display.selForContextMenu = cm.doc.sel;
+      }
+    }
+    function rehide() {
+      if (input.contextMenuPending != rehide) { return }
+      input.contextMenuPending = false;
+      input.wrapper.style.cssText = oldWrapperCSS;
+      te.style.cssText = oldCSS;
+      if (ie && ie_version < 9) { display.scrollbars.setScrollTop(display.scroller.scrollTop = scrollPos); }
+
+      // Try to detect the user choosing select-all
+      if (te.selectionStart != null) {
+        if (!ie || (ie && ie_version < 9)) { prepareSelectAllHack(); }
+        var i = 0, poll = function () {
+          if (display.selForContextMenu == cm.doc.sel && te.selectionStart == 0 &&
+              te.selectionEnd > 0 && input.prevInput == "\u200b") {
+            operation(cm, selectAll)(cm);
+          } else if (i++ < 10) {
+            display.detectingSelectAll = setTimeout(poll, 500);
+          } else {
+            display.selForContextMenu = null;
+            display.input.reset();
+          }
+        };
+        display.detectingSelectAll = setTimeout(poll, 200);
+      }
+    }
+
+    if (ie && ie_version >= 9) { prepareSelectAllHack(); }
+    if (captureRightClick) {
+      e_stop(e);
+      var mouseup = function () {
+        off(window, "mouseup", mouseup);
+        setTimeout(rehide, 20);
+      };
+      on(window, "mouseup", mouseup);
+    } else {
+      setTimeout(rehide, 50);
+    }
+  };
+
+  TextareaInput.prototype.readOnlyChanged = function (val) {
+    if (!val) { this.reset(); }
+    this.textarea.disabled = val == "nocursor";
+  };
+
+  TextareaInput.prototype.setUneditable = function () {};
+
+  TextareaInput.prototype.needsContentAttribute = false;
+
+  function fromTextArea(textarea, options) {
+    options = options ? copyObj(options) : {};
+    options.value = textarea.value;
+    if (!options.tabindex && textarea.tabIndex)
+      { options.tabindex = textarea.tabIndex; }
+    if (!options.placeholder && textarea.placeholder)
+      { options.placeholder = textarea.placeholder; }
+    // Set autofocus to true if this textarea is focused, or if it has
+    // autofocus and no other element is focused.
+    if (options.autofocus == null) {
+      var hasFocus = activeElt();
+      options.autofocus = hasFocus == textarea ||
+        textarea.getAttribute("autofocus") != null && hasFocus == document.body;
+    }
+
+    function save() {textarea.value = cm.getValue();}
+
+    var realSubmit;
+    if (textarea.form) {
+      on(textarea.form, "submit", save);
+      // Deplorable hack to make the submit method do the right thing.
+      if (!options.leaveSubmitMethodAlone) {
+        var form = textarea.form;
+        realSubmit = form.submit;
+        try {
+          var wrappedSubmit = form.submit = function () {
+            save();
+            form.submit = realSubmit;
+            form.submit();
+            form.submit = wrappedSubmit;
+          };
+        } catch(e) {}
+      }
+    }
+
+    options.finishInit = function (cm) {
+      cm.save = save;
+      cm.getTextArea = function () { return textarea; };
+      cm.toTextArea = function () {
+        cm.toTextArea = isNaN; // Prevent this from being ran twice
+        save();
+        textarea.parentNode.removeChild(cm.getWrapperElement());
+        textarea.style.display = "";
+        if (textarea.form) {
+          off(textarea.form, "submit", save);
+          if (typeof textarea.form.submit == "function")
+            { textarea.form.submit = realSubmit; }
+        }
+      };
+    };
+
+    textarea.style.display = "none";
+    var cm = CodeMirror(function (node) { return textarea.parentNode.insertBefore(node, textarea.nextSibling); },
+      options);
+    return cm
+  }
+
+  function addLegacyProps(CodeMirror) {
+    CodeMirror.off = off;
+    CodeMirror.on = on;
+    CodeMirror.wheelEventPixels = wheelEventPixels;
+    CodeMirror.Doc = Doc;
+    CodeMirror.splitLines = splitLinesAuto;
+    CodeMirror.countColumn = countColumn;
+    CodeMirror.findColumn = findColumn;
+    CodeMirror.isWordChar = isWordCharBasic;
+    CodeMirror.Pass = Pass;
+    CodeMirror.signal = signal;
+    CodeMirror.Line = Line;
+    CodeMirror.changeEnd = changeEnd;
+    CodeMirror.scrollbarModel = scrollbarModel;
+    CodeMirror.Pos = Pos;
+    CodeMirror.cmpPos = cmp;
+    CodeMirror.modes = modes;
+    CodeMirror.mimeModes = mimeModes;
+    CodeMirror.resolveMode = resolveMode;
+    CodeMirror.getMode = getMode;
+    CodeMirror.modeExtensions = modeExtensions;
+    CodeMirror.extendMode = extendMode;
+    CodeMirror.copyState = copyState;
+    CodeMirror.startState = startState;
+    CodeMirror.innerMode = innerMode;
+    CodeMirror.commands = commands;
+    CodeMirror.keyMap = keyMap;
+    CodeMirror.keyName = keyName;
+    CodeMirror.isModifierKey = isModifierKey;
+    CodeMirror.lookupKey = lookupKey;
+    CodeMirror.normalizeKeyMap = normalizeKeyMap;
+    CodeMirror.StringStream = StringStream;
+    CodeMirror.SharedTextMarker = SharedTextMarker;
+    CodeMirror.TextMarker = TextMarker;
+    CodeMirror.LineWidget = LineWidget;
+    CodeMirror.e_preventDefault = e_preventDefault;
+    CodeMirror.e_stopPropagation = e_stopPropagation;
+    CodeMirror.e_stop = e_stop;
+    CodeMirror.addClass = addClass;
+    CodeMirror.contains = contains;
+    CodeMirror.rmClass = rmClass;
+    CodeMirror.keyNames = keyNames;
+  }
+
+  // EDITOR CONSTRUCTOR
+
+  defineOptions(CodeMirror);
+
+  addEditorMethods(CodeMirror);
+
+  // Set up methods on CodeMirror's prototype to redirect to the editor's document.
+  var dontDelegate = "iter insert remove copy getEditor constructor".split(" ");
+  for (var prop in Doc.prototype) { if (Doc.prototype.hasOwnProperty(prop) && indexOf(dontDelegate, prop) < 0)
+    { CodeMirror.prototype[prop] = (function(method) {
+      return function() {return method.apply(this.doc, arguments)}
+    })(Doc.prototype[prop]); } }
+
+  eventMixin(Doc);
+  CodeMirror.inputStyles = {"textarea": TextareaInput, "contenteditable": ContentEditableInput};
+
+  // Extra arguments are stored as the mode's dependencies, which is
+  // used by (legacy) mechanisms like loadmode.js to automatically
+  // load a mode. (Preferred mechanism is the require/define calls.)
+  CodeMirror.defineMode = function(name/*, mode, …*/) {
+    if (!CodeMirror.defaults.mode && name != "null") { CodeMirror.defaults.mode = name; }
+    defineMode.apply(this, arguments);
+  };
+
+  CodeMirror.defineMIME = defineMIME;
+
+  // Minimal default mode.
+  CodeMirror.defineMode("null", function () { return ({token: function (stream) { return stream.skipToEnd(); }}); });
+  CodeMirror.defineMIME("text/plain", "null");
+
+  // EXTENSIONS
+
+  CodeMirror.defineExtension = function (name, func) {
+    CodeMirror.prototype[name] = func;
+  };
+  CodeMirror.defineDocExtension = function (name, func) {
+    Doc.prototype[name] = func;
+  };
+
+  CodeMirror.fromTextArea = fromTextArea;
+
+  addLegacyProps(CodeMirror);
+
+  CodeMirror.version = "5.48.4";
+
+  return CodeMirror;
+
+})));
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+
+(function(mod) {
+  if (typeof exports == "object" && typeof module == "object") // CommonJS
+    mod(require("../../lib/codemirror"));
+  else if (typeof define == "function" && define.amd) // AMD
+    define(["../../lib/codemirror"], mod);
+  else // Plain browser env
+    mod(CodeMirror);
+})(function(CodeMirror) {
+"use strict";
+
+CodeMirror.defineMode('shell', function() {
+
+  var words = {};
+  function define(style, dict) {
+    for(var i = 0; i < dict.length; i++) {
+      words[dict[i]] = style;
+    }
+  };
+
+  var commonAtoms = ["true", "false"];
+  var commonKeywords = ["if", "then", "do", "else", "elif", "while", "until", "for", "in", "esac", "fi",
+    "fin", "fil", "done", "exit", "set", "unset", "export", "function"];
+  var commonCommands = ["ab", "awk", "bash", "beep", "cat", "cc", "cd", "chown", "chmod", "chroot", "clear",
+    "cp", "curl", "cut", "diff", "echo", "find", "gawk", "gcc", "get", "git", "grep", "hg", "kill", "killall",
+    "ln", "ls", "make", "mkdir", "openssl", "mv", "nc", "nl", "node", "npm", "ping", "ps", "restart", "rm",
+    "rmdir", "sed", "service", "sh", "shopt", "shred", "source", "sort", "sleep", "ssh", "start", "stop",
+    "su", "sudo", "svn", "tee", "telnet", "top", "touch", "vi", "vim", "wall", "wc", "wget", "who", "write",
+    "yes", "zsh"];
+
+  CodeMirror.registerHelper("hintWords", "shell", commonAtoms.concat(commonKeywords, commonCommands));
+
+  define('atom', commonAtoms);
+  define('keyword', commonKeywords);
+  define('builtin', commonCommands);
+
+  function tokenBase(stream, state) {
+    if (stream.eatSpace()) return null;
+
+    var sol = stream.sol();
+    var ch = stream.next();
+
+    if (ch === '\\') {
+      stream.next();
+      return null;
+    }
+    if (ch === '\'' || ch === '"' || ch === '`') {
+      state.tokens.unshift(tokenString(ch, ch === "`" ? "quote" : "string"));
+      return tokenize(stream, state);
+    }
+    if (ch === '#') {
+      if (sol && stream.eat('!')) {
+        stream.skipToEnd();
+        return 'meta'; // 'comment'?
+      }
+      stream.skipToEnd();
+      return 'comment';
+    }
+    if (ch === '$') {
+      state.tokens.unshift(tokenDollar);
+      return tokenize(stream, state);
+    }
+    if (ch === '+' || ch === '=') {
+      return 'operator';
+    }
+    if (ch === '-') {
+      stream.eat('-');
+      stream.eatWhile(/\w/);
+      return 'attribute';
+    }
+    if (/\d/.test(ch)) {
+      stream.eatWhile(/\d/);
+      if(stream.eol() || !/\w/.test(stream.peek())) {
+        return 'number';
+      }
+    }
+    stream.eatWhile(/[\w-]/);
+    var cur = stream.current();
+    if (stream.peek() === '=' && /\w+/.test(cur)) return 'def';
+    return words.hasOwnProperty(cur) ? words[cur] : null;
+  }
+
+  function tokenString(quote, style) {
+    var close = quote == "(" ? ")" : quote == "{" ? "}" : quote
+    return function(stream, state) {
+      var next, escaped = false;
+      while ((next = stream.next()) != null) {
+        if (next === close && !escaped) {
+          state.tokens.shift();
+          break;
+        } else if (next === '$' && !escaped && quote !== "'" && stream.peek() != close) {
+          escaped = true;
+          stream.backUp(1);
+          state.tokens.unshift(tokenDollar);
+          break;
+        } else if (!escaped && quote !== close && next === quote) {
+          state.tokens.unshift(tokenString(quote, style))
+          return tokenize(stream, state)
+        } else if (!escaped && /['"]/.test(next) && !/['"]/.test(quote)) {
+          state.tokens.unshift(tokenStringStart(next, "string"));
+          stream.backUp(1);
+          break;
+        }
+        escaped = !escaped && next === '\\';
+      }
+      return style;
+    };
+  };
+
+  function tokenStringStart(quote, style) {
+    return function(stream, state) {
+      state.tokens[0] = tokenString(quote, style)
+      stream.next()
+      return tokenize(stream, state)
+    }
+  }
+
+  var tokenDollar = function(stream, state) {
+    if (state.tokens.length > 1) stream.eat('$');
+    var ch = stream.next()
+    if (/['"({]/.test(ch)) {
+      state.tokens[0] = tokenString(ch, ch == "(" ? "quote" : ch == "{" ? "def" : "string");
+      return tokenize(stream, state);
+    }
+    if (!/\d/.test(ch)) stream.eatWhile(/\w/);
+    state.tokens.shift();
+    return 'def';
+  };
+
+  function tokenize(stream, state) {
+    return (state.tokens[0] || tokenBase) (stream, state);
+  };
+
+  return {
+    startState: function() {return {tokens:[]};},
+    token: function(stream, state) {
+      return tokenize(stream, state);
+    },
+    closeBrackets: "()[]{}''\"\"``",
+    lineComment: '#',
+    fold: "brace"
+  };
+});
+
+CodeMirror.defineMIME('text/x-sh', 'shell');
+// Apache uses a slightly different Media Type for Shell scripts
+// http://svn.apache.org/repos/asf/httpd/httpd/trunk/docs/conf/mime.types
+CodeMirror.defineMIME('application/x-sh', 'shell');
+
+});
+/*
+ * Editor.md
+ *
+ * @file        editormd.js 
+ * @version     v1.5.0 
+ * @description Open source online markdown editor.
+ * @license     MIT License
+ * @author      Pandao
+ * {@link       https://github.com/pandao/editor.md}
+ * @updateTime  2015-06-09
+ */
+
+
+;(function(factory) {
+    "use strict";
+    
+	// CommonJS/Node.js
+	if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
+    { 
+        module.exports = factory;
+    }
+	else if (typeof define === "function")  // AMD/CMD/Sea.js
+	{
+        if (define.amd) // for Require.js
+        {
+            /* Require.js define replace */
+        } 
+        else 
+        {
+		    define(["jquery"], factory);  // for Sea.js
+        }
+	} 
+	else
+	{ 
+        window.editormd = factory();
+	}
+    
+}(function() {    
+
+    /* Require.js assignment replace */
+    
+    "use strict";
+    
+    var $ = (typeof (jQuery) !== "undefined") ? jQuery : Zepto;
+
+	if (typeof ($) === "undefined") {
+		return ;
+	}
+    
+    /**
+     * editormd
+     * 
+     * @param   {String} id           编辑器的ID
+     * @param   {Object} options      配置选项 Key/Value
+     * @returns {Object} editormd     返回editormd对象
+     */
+    
+    var editormd         = function (id, options) {
+        return new editormd.fn.init(id, options);
+    };
+    
+    editormd.title        = editormd.$name = "Editor.md";
+    editormd.version      = "1.5.0";
+    editormd.homePage     = "https://pandao.github.io/editor.md/";
+    editormd.classPrefix  = "editormd-";
+    
+    editormd.toolbarModes = {
+        full : [
+            "undo", "redo", "|", 
+            "bold", "del", "italic", "quote", "ucwords", "uppercase", "lowercase", "|", 
+            "h1", "h2", "h3", "h4", "h5", "h6", "|", 
+            "list-ul", "list-ol", "hr", "|",
+            "link", "reference-link", "image", "code", "preformatted-text", "code-block", "table", "datetime", "emoji", "html-entities", "pagebreak", "|",
+            "goto-line", "watch", "preview", "fullscreen", "clear", "search", "|",
+            "help", "info"
+        ],
+        simple : [
+            "undo", "redo", "|", 
+            "bold", "del", "italic", "quote", "uppercase", "lowercase", "|", 
+            "h1", "h2", "h3", "h4", "h5", "h6", "|", 
+            "list-ul", "list-ol", "hr", "|",
+            "watch", "preview", "fullscreen", "|",
+            "help", "info"
+        ],
+        mini : [
+            "undo", "redo", "|",
+            "watch", "preview", "|",
+            "help", "info"
+        ]
+    };
+    
+    editormd.defaults     = {
+        mode                 : "gfm",          //gfm or markdown
+        name                 : "",             // Form element name
+        value                : "",             // value for CodeMirror, if mode not gfm/markdown
+        theme                : "",             // Editor.md self themes, before v1.5.0 is CodeMirror theme, default empty
+        editorTheme          : "default",      // Editor area, this is CodeMirror theme at v1.5.0
+        previewTheme         : "",             // Preview area theme, default empty
+        markdown             : "",             // Markdown source code
+        appendMarkdown       : "",             // if in init textarea value not empty, append markdown to textarea
+        width                : "100%",
+        height               : "100%",
+        path                 : "./lib/",       // Dependents module file directory
+        pluginPath           : "",             // If this empty, default use settings.path + "../plugins/"
+        delay                : 300,            // Delay parse markdown to html, Uint : ms
+        autoLoadModules      : true,           // Automatic load dependent module files
+        watch                : true,
+        placeholder          : "Enjoy Markdown! coding now...",
+        gotoLine             : true,
+        codeFold             : false,
+        autoHeight           : false,
+		autoFocus            : true,
+        autoCloseTags        : true,
+        searchReplace        : true,
+        syncScrolling        : true,           // true | false | "single", default true
+        readOnly             : false,
+        tabSize              : 4,
+		indentUnit           : 4,
+        lineNumbers          : true,
+		lineWrapping         : true,
+		autoCloseBrackets    : true,
+		showTrailingSpace    : true,
+		matchBrackets        : true,
+		indentWithTabs       : true,
+		styleSelectedText    : true,
+        matchWordHighlight   : true,           // options: true, false, "onselected"
+        styleActiveLine      : true,           // Highlight the current line
+        dialogLockScreen     : true,
+        dialogShowMask       : true,
+        dialogDraggable      : true,
+        dialogMaskBgColor    : "#fff",
+        dialogMaskOpacity    : 0.1,
+        fontSize             : "13px",
+        saveHTMLToTextarea   : false,
+        disabledKeyMaps      : [],
+        
+        onload               : function() {},
+        onresize             : function() {},
+        onchange             : function() {},
+        onwatch              : null,
+        onunwatch            : null,
+        onpreviewing         : function() {},
+        onpreviewed          : function() {},
+        onfullscreen         : function() {},
+        onfullscreenExit     : function() {},
+        onscroll             : function() {},
+        onpreviewscroll      : function() {},
+        
+        imageUpload          : false,
+        imageFormats         : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
+        imageUploadURL       : "",
+        crossDomainUpload    : false,
+        uploadCallbackURL    : "",
+        
+        toc                  : true,           // Table of contents
+        tocm                 : false,           // Using [TOCM], auto create ToC dropdown menu
+        tocTitle             : "",             // for ToC dropdown menu btn
+        tocDropdown          : false,
+        tocContainer         : "",
+        tocStartLevel        : 1,              // Said from H1 to create ToC
+        htmlDecode           : false,          // Open the HTML tag identification 
+        pageBreak            : true,           // Enable parse page break [========]
+        atLink               : true,           // for @link
+        emailLink            : true,           // for email address auto link
+        taskList             : false,          // Enable Github Flavored Markdown task lists
+        emoji                : false,          // :emoji: , Support Github emoji, Twitter Emoji (Twemoji);
+                                               // Support FontAwesome icon emoji :fa-xxx: > Using fontAwesome icon web fonts;
+                                               // Support Editor.md logo icon emoji :editormd-logo: :editormd-logo-1x: > 1~8x;
+        tex                  : false,          // TeX(LaTeX), based on KaTeX
+        flowChart            : false,          // flowChart.js only support IE9+
+        sequenceDiagram      : false,          // sequenceDiagram.js only support IE9+
+        previewCodeHighlight : true,
+                
+        toolbar              : true,           // show/hide toolbar
+        toolbarAutoFixed     : true,           // on window scroll auto fixed position
+        toolbarIcons         : "full",
+        toolbarTitles        : {},
+        toolbarHandlers      : {
+            ucwords : function() {
+                return editormd.toolbarHandlers.ucwords;
+            },
+            lowercase : function() {
+                return editormd.toolbarHandlers.lowercase;
+            }
+        },
+        toolbarCustomIcons   : {               // using html tag create toolbar icon, unused default <a> tag.
+            lowercase        : "<a href=\"javascript:;\" title=\"Lowercase\" unselectable=\"on\"><i class=\"fa\" name=\"lowercase\" style=\"font-size:24px;margin-top: -10px;\">a</i></a>",
+            "ucwords"        : "<a href=\"javascript:;\" title=\"ucwords\" unselectable=\"on\"><i class=\"fa\" name=\"ucwords\" style=\"font-size:20px;margin-top: -3px;\">Aa</i></a>"
+        }, 
+        toolbarIconsClass    : {
+            undo             : "fa-undo",
+            redo             : "fa-repeat",
+            bold             : "fa-bold",
+            del              : "fa-strikethrough",
+            italic           : "fa-italic",
+            quote            : "fa-quote-left",
+            uppercase        : "fa-font",
+            h1               : editormd.classPrefix + "bold",
+            h2               : editormd.classPrefix + "bold",
+            h3               : editormd.classPrefix + "bold",
+            h4               : editormd.classPrefix + "bold",
+            h5               : editormd.classPrefix + "bold",
+            h6               : editormd.classPrefix + "bold",
+            "list-ul"        : "fa-list-ul",
+            "list-ol"        : "fa-list-ol",
+            hr               : "fa-minus",
+            link             : "fa-link",
+            "reference-link" : "fa-anchor",
+            image            : "fa-picture-o",
+            code             : "fa-code",
+            "preformatted-text" : "fa-file-code-o",
+            "code-block"     : "fa-file-code-o",
+            table            : "fa-table",
+            datetime         : "fa-clock-o",
+            emoji            : "fa-smile-o",
+            "html-entities"  : "fa-copyright",
+            pagebreak        : "fa-newspaper-o",
+            "goto-line"      : "fa-terminal", // fa-crosshairs
+            watch            : "fa-eye-slash",
+            unwatch          : "fa-eye",
+            preview          : "fa-desktop",
+            search           : "fa-search",
+            fullscreen       : "fa-arrows-alt",
+            clear            : "fa-eraser",
+            help             : "fa-question-circle",
+            info             : "fa-info-circle"
+        },        
+        toolbarIconTexts     : {},
+        
+        lang : {
+            name        : "zh-cn",
+            description : "开源在线Markdown编辑器<br/>Open source online Markdown editor.",
+            tocTitle    : "目录",
+            toolbar     : {
+                undo             : "撤销（Ctrl+Z）",
+                redo             : "重做（Ctrl+Y）",
+                bold             : "粗体",
+                del              : "删除线",
+                italic           : "斜体",
+                quote            : "引用",
+                ucwords          : "将每个单词首字母转成大写",
+                uppercase        : "将所选转换成大写",
+                lowercase        : "将所选转换成小写",
+                h1               : "标题1",
+                h2               : "标题2",
+                h3               : "标题3",
+                h4               : "标题4",
+                h5               : "标题5",
+                h6               : "标题6",
+                "list-ul"        : "无序列表",
+                "list-ol"        : "有序列表",
+                hr               : "横线",
+                link             : "链接",
+                "reference-link" : "引用链接",
+                image            : "添加图片",
+                code             : "行内代码",
+                "preformatted-text" : "预格式文本 / 代码块（缩进风格）",
+                "code-block"     : "代码块（多语言风格）",
+                table            : "添加表格",
+                datetime         : "日期时间",
+                emoji            : "Emoji表情",
+                "html-entities"  : "HTML实体字符",
+                pagebreak        : "插入分页符",
+                "goto-line"      : "跳转到行",
+                watch            : "关闭实时预览",
+                unwatch          : "开启实时预览",
+                preview          : "全窗口预览HTML（按 Shift + ESC还原）",
+                fullscreen       : "全屏（按ESC还原）",
+                clear            : "清空",
+                search           : "搜索",
+                help             : "使用帮助",
+                info             : "关于" + editormd.title
+            },
+            buttons : {
+                enter  : "确定",
+                cancel : "取消",
+                close  : "关闭"
+            },
+            dialog : {
+                link : {
+                    title    : "添加链接",
+                    url      : "链接地址",
+                    urlTitle : "链接标题",
+                    urlEmpty : "错误：请填写链接地址。"
+                },
+                referenceLink : {
+                    title    : "添加引用链接",
+                    name     : "引用名称",
+                    url      : "链接地址",
+                    urlId    : "链接ID",
+                    urlTitle : "链接标题",
+                    nameEmpty: "错误：引用链接的名称不能为空。",
+                    idEmpty  : "错误：请填写引用链接的ID。",
+                    urlEmpty : "错误：请填写引用链接的URL地址。"
+                },
+                image : {
+                    title    : "添加图片",
+                    url      : "图片地址",
+                    link     : "图片链接",
+                    alt      : "图片描述",
+                    uploadButton     : "本地上传",
+                    imageURLEmpty    : "错误：图片地址不能为空。",
+                    uploadFileEmpty  : "错误：上传的图片不能为空。",
+                    formatNotAllowed : "错误：只允许上传图片文件，允许上传的图片文件格式有："
+                },
+                preformattedText : {
+                    title             : "添加预格式文本或代码块", 
+                    emptyAlert        : "错误：请填写预格式文本或代码的内容。"
+                },
+                codeBlock : {
+                    title             : "添加代码块",                    
+                    selectLabel       : "代码语言：",
+                    selectDefaultText : "请选择代码语言",
+                    otherLanguage     : "其他语言",
+                    unselectedLanguageAlert : "错误：请选择代码所属的语言类型。",
+                    codeEmptyAlert    : "错误：请填写代码内容。"
+                },
+                htmlEntities : {
+                    title : "HTML 实体字符"
+                },
+                help : {
+                    title : "使用帮助"
+                }
+            }
+        }
+    };
+    
+    editormd.classNames  = {
+        tex : editormd.classPrefix + "tex"
+    };
+
+    editormd.dialogZindex = 99999;
+    
+    editormd.$katex       = null;
+    editormd.$marked      = null;
+    editormd.$CodeMirror  = null;
+    editormd.$prettyPrint = null;
+    
+    var timer, flowchartTimer;
+
+    editormd.prototype    = editormd.fn = {
+        state : {
+            watching   : false,
+            loaded     : false,
+            preview    : false,
+            fullscreen : false
+        },
+        
+        /**
+         * 构造函数/实例初始化
+         * Constructor / instance initialization
+         * 
+         * @param   {String}   id            编辑器的ID
+         * @param   {Object}   [options={}]  配置选项 Key/Value
+         * @returns {editormd}               返回editormd的实例对象
+         */
+        
+        init : function (id, options) {
+            
+            options              = options || {};
+            
+            if (typeof id === "object")
+            {
+                options = id;
+            }
+            
+            var _this            = this;
+            var classPrefix      = this.classPrefix  = editormd.classPrefix; 
+            var settings         = this.settings     = $.extend(true, editormd.defaults, options);
+            
+            id                   = (typeof id === "object") ? settings.id : id;
+            
+            var editor           = this.editor       = $("#" + id);
+            
+            this.id              = id;
+            this.lang            = settings.lang;
+            
+            var classNames       = this.classNames   = {
+                textarea : {
+                    html     : classPrefix + "html-textarea",
+                    markdown : classPrefix + "markdown-textarea"
+                }
+            };
+            
+            settings.pluginPath = (settings.pluginPath === "") ? settings.path + "../plugins/" : settings.pluginPath; 
+            
+            this.state.watching = (settings.watch) ? true : false;
+            
+            if ( !editor.hasClass("editormd") ) {
+                editor.addClass("editormd");
+            }
+            
+            editor.css({
+                width  : (typeof settings.width  === "number") ? settings.width  + "px" : settings.width,
+                height : (typeof settings.height === "number") ? settings.height + "px" : settings.height
+            });
+            
+            if (settings.autoHeight)
+            {
+                editor.css("height", "auto");
+            }
+                        
+            var markdownTextarea = this.markdownTextarea = editor.children("textarea");
+            
+            if (markdownTextarea.length < 1)
+            {
+                editor.append("<textarea></textarea>");
+                markdownTextarea = this.markdownTextarea = editor.children("textarea");
+            }
+            
+            markdownTextarea.addClass(classNames.textarea.markdown).attr("placeholder", settings.placeholder);
+            
+            if (typeof markdownTextarea.attr("name") === "undefined" || markdownTextarea.attr("name") === "")
+            {
+                markdownTextarea.attr("name", (settings.name !== "") ? settings.name : id + "-markdown-doc");
+            }
+            
+            var appendElements = [
+                (!settings.readOnly) ? "<a href=\"javascript:;\" class=\"fa fa-close " + classPrefix + "preview-close-btn\"></a>" : "",
+                ( (settings.saveHTMLToTextarea) ? "<textarea class=\"" + classNames.textarea.html + "\" name=\"" + id + "-html-code\"></textarea>" : "" ),
+                "<div class=\"" + classPrefix + "preview\"><div class=\"markdown-body " + classPrefix + "preview-container\"></div></div>",
+                "<div class=\"" + classPrefix + "container-mask\" style=\"display:block;\"></div>",
+                "<div class=\"" + classPrefix + "mask\"></div>"
+            ].join("\n");
+            
+            editor.append(appendElements).addClass(classPrefix + "vertical");
+            
+            if (settings.theme !== "") 
+            {
+                editor.addClass(classPrefix + "theme-" + settings.theme);
+            }
+            
+            this.mask          = editor.children("." + classPrefix + "mask");    
+            this.containerMask = editor.children("." + classPrefix  + "container-mask");
+            
+            if (settings.markdown !== "")
+            {
+                markdownTextarea.val(settings.markdown);
+            }
+            
+            if (settings.appendMarkdown !== "")
+            {
+                markdownTextarea.val(markdownTextarea.val() + settings.appendMarkdown);
+            }
+            
+            this.htmlTextarea     = editor.children("." + classNames.textarea.html);            
+            this.preview          = editor.children("." + classPrefix + "preview");
+            this.previewContainer = this.preview.children("." + classPrefix + "preview-container");
+            
+            if (settings.previewTheme !== "") 
+            {
+                this.preview.addClass(classPrefix + "preview-theme-" + settings.previewTheme);
+            }
+            
+            if (typeof define === "function" && define.amd)
+            {
+                if (typeof katex !== "undefined") 
+                {
+                    editormd.$katex = katex;
+                }
+                
+                if (settings.searchReplace && !settings.readOnly) 
+                {
+                    editormd.loadCSS(settings.path + "codemirror/addon/dialog/dialog");
+                    editormd.loadCSS(settings.path + "codemirror/addon/search/matchesonscrollbar");
+                }
+            }
+            
+            if ((typeof define === "function" && define.amd) || !settings.autoLoadModules)
+            {
+                if (typeof CodeMirror !== "undefined") {
+                    editormd.$CodeMirror = CodeMirror;
+                }
+                
+                if (typeof marked     !== "undefined") {
+                    editormd.$marked     = marked;
+                }
+                
+                this.setCodeMirror().setToolbar().loadedDisplay();
+            } 
+            else 
+            {
+                this.loadQueues();
+            }
+
+            return this;
+        },
+        
+        /**
+         * 所需组件加载队列
+         * Required components loading queue
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        loadQueues : function() {
+            var _this        = this;
+            var settings     = this.settings;
+            var loadPath     = settings.path;
+                                
+            var loadFlowChartOrSequenceDiagram = function() {
+                
+                if (editormd.isIE8) 
+                {
+                    _this.loadedDisplay();
+                    
+                    return ;
+                }
+
+                if (settings.flowChart || settings.sequenceDiagram) 
+                {
+                    editormd.loadScript(loadPath + "raphael.min", function() {
+
+                        editormd.loadScript(loadPath + "underscore.min", function() {  
+
+                            if (!settings.flowChart && settings.sequenceDiagram) 
+                            {
+                                editormd.loadScript(loadPath + "sequence-diagram.min", function() {
+                                    _this.loadedDisplay();
+                                });
+                            }
+                            else if (settings.flowChart && !settings.sequenceDiagram) 
+                            {      
+                                editormd.loadScript(loadPath + "flowchart.min", function() {  
+                                    editormd.loadScript(loadPath + "jquery.flowchart.min", function() {
+                                        _this.loadedDisplay();
+                                    });
+                                });
+                            }
+                            else if (settings.flowChart && settings.sequenceDiagram) 
+                            {  
+                                editormd.loadScript(loadPath + "flowchart.min", function() {  
+                                    editormd.loadScript(loadPath + "jquery.flowchart.min", function() {
+                                        editormd.loadScript(loadPath + "sequence-diagram.min", function() {
+                                            _this.loadedDisplay();
+                                        });
+                                    });
+                                });
+                            }
+                        });
+
+                    });
+                } 
+                else
+                {
+                    _this.loadedDisplay();
+                }
+            }; 
+
+            editormd.loadCSS(loadPath + "codemirror/codemirror.min");
+            
+            if (settings.searchReplace && !settings.readOnly)
+            {
+                editormd.loadCSS(loadPath + "codemirror/addon/dialog/dialog");
+                editormd.loadCSS(loadPath + "codemirror/addon/search/matchesonscrollbar");
+            }
+            
+            if (settings.codeFold)
+            {
+                editormd.loadCSS(loadPath + "codemirror/addon/fold/foldgutter");            
+            }
+            
+            editormd.loadScript(loadPath + "codemirror/codemirror.min", function() {
+                editormd.$CodeMirror = CodeMirror;
+                
+                editormd.loadScript(loadPath + "codemirror/modes.min", function() {
+                    
+                    editormd.loadScript(loadPath + "codemirror/addons.min", function() {
+                        
+                        _this.setCodeMirror();
+                        
+                        if (settings.mode !== "gfm" && settings.mode !== "markdown") 
+                        {
+                            _this.loadedDisplay();
+                            
+                            return false;
+                        }
+                        
+                        _this.setToolbar();
+
+                        editormd.loadScript(loadPath + "marked.min", function() {
+
+                            editormd.$marked = marked;
+                                
+                            if (settings.previewCodeHighlight) 
+                            {
+                                editormd.loadScript(loadPath + "prettify.min", function() {
+                                    loadFlowChartOrSequenceDiagram();
+                                });
+                            } 
+                            else
+                            {                  
+                                loadFlowChartOrSequenceDiagram();
+                            }
+                        });
+                        
+                    });
+                    
+                });
+                
+            });
+
+            return this;
+        },
+        
+        /**
+         * 设置 Editor.md 的整体主题，主要是工具栏
+         * Setting Editor.md theme
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setTheme : function(theme) {
+            var editor      = this.editor;
+            var oldTheme    = this.settings.theme;
+            var themePrefix = this.classPrefix + "theme-";
+            
+            editor.removeClass(themePrefix + oldTheme).addClass(themePrefix + theme);
+            
+            this.settings.theme = theme;
+            
+            return this;
+        },
+        
+        /**
+         * 设置 CodeMirror（编辑区）的主题
+         * Setting CodeMirror (Editor area) theme
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setEditorTheme : function(theme) {  
+            var settings   = this.settings;  
+            settings.editorTheme = theme;  
+            
+            if (theme !== "default")
+            {
+                editormd.loadCSS(settings.path + "codemirror/theme/" + settings.editorTheme);
+            }
+            
+            this.cm.setOption("theme", theme);
+            
+            return this;
+        },
+        
+        /**
+         * setEditorTheme() 的别名
+         * setEditorTheme() alias
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setCodeMirrorTheme : function (theme) {            
+            this.setEditorTheme(theme);
+            
+            return this;
+        },
+        
+        /**
+         * 设置 Editor.md 的主题
+         * Setting Editor.md theme
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setPreviewTheme : function(theme) {  
+            var preview     = this.preview;
+            var oldTheme    = this.settings.previewTheme;
+            var themePrefix = this.classPrefix + "preview-theme-";
+            
+            preview.removeClass(themePrefix + oldTheme).addClass(themePrefix + theme);
+            
+            this.settings.previewTheme = theme;
+            
+            return this;
+        },
+        
+        /**
+         * 配置和初始化CodeMirror组件
+         * CodeMirror initialization
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setCodeMirror : function() { 
+            var settings         = this.settings;
+            var editor           = this.editor;
+            
+            if (settings.editorTheme !== "default")
+            {
+                editormd.loadCSS(settings.path + "codemirror/theme/" + settings.editorTheme);
+            }
+            
+            var codeMirrorConfig = {
+                mode                      : settings.mode,
+                theme                     : settings.editorTheme,
+                tabSize                   : settings.tabSize,
+                dragDrop                  : false,
+                autofocus                 : settings.autoFocus,
+                autoCloseTags             : settings.autoCloseTags,
+                readOnly                  : (settings.readOnly) ? "nocursor" : false,
+                indentUnit                : settings.indentUnit,
+                lineNumbers               : settings.lineNumbers,
+                lineWrapping              : settings.lineWrapping,
+                extraKeys                 : {
+                                                "Ctrl-Q": function(cm) { 
+                                                    cm.foldCode(cm.getCursor()); 
+                                                }
+                                            },
+                foldGutter                : settings.codeFold,
+                gutters                   : ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
+                matchBrackets             : settings.matchBrackets,
+                indentWithTabs            : settings.indentWithTabs,
+                styleActiveLine           : settings.styleActiveLine,
+                styleSelectedText         : settings.styleSelectedText,
+                autoCloseBrackets         : settings.autoCloseBrackets,
+                showTrailingSpace         : settings.showTrailingSpace,
+                highlightSelectionMatches : ( (!settings.matchWordHighlight) ? false : { showToken: (settings.matchWordHighlight === "onselected") ? false : /\w/ } )
+            };
+            
+            this.codeEditor = this.cm        = editormd.$CodeMirror.fromTextArea(this.markdownTextarea[0], codeMirrorConfig);
+            this.codeMirror = this.cmElement = editor.children(".CodeMirror");
+            
+            if (settings.value !== "")
+            {
+                this.cm.setValue(settings.value);
+            }
+
+            this.codeMirror.css({
+                fontSize : settings.fontSize,
+                width    : (!settings.watch) ? "100%" : "50%"
+            });
+            
+            if (settings.autoHeight)
+            {
+                this.codeMirror.css("height", "auto");
+                this.cm.setOption("viewportMargin", Infinity);
+            }
+            
+            if (!settings.lineNumbers)
+            {
+                this.codeMirror.find(".CodeMirror-gutters").css("border-right", "none");
+            }
+
+            return this;
+        },
+        
+        /**
+         * 获取CodeMirror的配置选项
+         * Get CodeMirror setting options
+         * 
+         * @returns {Mixed}                  return CodeMirror setting option value
+         */
+        
+        getCodeMirrorOption : function(key) {            
+            return this.cm.getOption(key);
+        },
+        
+        /**
+         * 配置和重配置CodeMirror的选项
+         * CodeMirror setting options / resettings
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setCodeMirrorOption : function(key, value) {
+            
+            this.cm.setOption(key, value);
+            
+            return this;
+        },
+        
+        /**
+         * 添加 CodeMirror 键盘快捷键
+         * Add CodeMirror keyboard shortcuts key map
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        addKeyMap : function(map, bottom) {
+            this.cm.addKeyMap(map, bottom);
+            
+            return this;
+        },
+        
+        /**
+         * 移除 CodeMirror 键盘快捷键
+         * Remove CodeMirror keyboard shortcuts key map
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        removeKeyMap : function(map) {
+            this.cm.removeKeyMap(map);
+            
+            return this;
+        },
+        
+        /**
+         * 跳转到指定的行
+         * Goto CodeMirror line
+         * 
+         * @param   {String|Intiger}   line      line number or "first"|"last"
+         * @returns {editormd}                   返回editormd的实例对象
+         */
+        
+        gotoLine : function (line) {
+            
+            var settings = this.settings;
+            
+            if (!settings.gotoLine)
+            {
+                return this;
+            }
+            
+            var cm       = this.cm;
+            var editor   = this.editor;
+            var count    = cm.lineCount();
+            var preview  = this.preview;
+            
+            if (typeof line === "string")
+            {
+                if(line === "last")
+                {
+                    line = count;
+                }
+            
+                if (line === "first")
+                {
+                    line = 1;
+                }
+            }
+            
+            if (typeof line !== "number") 
+            {  
+                alert("Error: The line number must be an integer.");
+                return this;
+            }
+            
+            line  = parseInt(line) - 1;
+            
+            if (line > count)
+            {
+                alert("Error: The line number range 1-" + count);
+                
+                return this;
+            }
+            
+            cm.setCursor( {line : line, ch : 0} );
+            
+            var scrollInfo   = cm.getScrollInfo();
+            var clientHeight = scrollInfo.clientHeight; 
+            var coords       = cm.charCoords({line : line, ch : 0}, "local");
+            
+            cm.scrollTo(null, (coords.top + coords.bottom - clientHeight) / 2);
+            
+            if (settings.watch)
+            {            
+                var cmScroll  = this.codeMirror.find(".CodeMirror-scroll")[0];
+                var height    = $(cmScroll).height(); 
+                var scrollTop = cmScroll.scrollTop;         
+                var percent   = (scrollTop / cmScroll.scrollHeight);
+
+                if (scrollTop === 0)
+                {
+                    preview.scrollTop(0);
+                } 
+                else if (scrollTop + height >= cmScroll.scrollHeight - 16)
+                { 
+                    preview.scrollTop(preview[0].scrollHeight);                    
+                } 
+                else
+                {                    
+                    preview.scrollTop(preview[0].scrollHeight * percent);
+                }
+            }
+
+            cm.focus();
+            
+            return this;
+        },
+        
+        /**
+         * 扩展当前实例对象，可同时设置多个或者只设置一个
+         * Extend editormd instance object, can mutil setting.
+         * 
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        extend : function() {
+            if (typeof arguments[1] !== "undefined")
+            {
+                if (typeof arguments[1] === "function")
+                {
+                    arguments[1] = $.proxy(arguments[1], this);
+                }
+
+                this[arguments[0]] = arguments[1];
+            }
+            
+            if (typeof arguments[0] === "object" && typeof arguments[0].length === "undefined")
+            {
+                $.extend(true, this, arguments[0]);
+            }
+
+            return this;
+        },
+        
+        /**
+         * 设置或扩展当前实例对象，单个设置
+         * Extend editormd instance object, one by one
+         * 
+         * @param   {String|Object}   key       option key
+         * @param   {String|Object}   value     option value
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        set : function (key, value) {
+            
+            if (typeof value !== "undefined" && typeof value === "function")
+            {
+                value = $.proxy(value, this);
+            }
+            
+            this[key] = value;
+
+            return this;
+        },
+        
+        /**
+         * 重新配置
+         * Resetting editor options
+         * 
+         * @param   {String|Object}   key       option key
+         * @param   {String|Object}   value     option value
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        config : function(key, value) {
+            var settings = this.settings;
+            
+            if (typeof key === "object")
+            {
+                settings = $.extend(true, settings, key);
+            }
+            
+            if (typeof key === "string")
+            {
+                settings[key] = value;
+            }
+            
+            this.settings = settings;
+            this.recreate();
+            
+            return this;
+        },
+        
+        /**
+         * 注册事件处理方法
+         * Bind editor event handle
+         * 
+         * @param   {String}     eventType      event type
+         * @param   {Function}   callback       回调函数
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        on : function(eventType, callback) {
+            var settings = this.settings;
+            
+            if (typeof settings["on" + eventType] !== "undefined") 
+            {                
+                settings["on" + eventType] = $.proxy(callback, this);      
+            }
+
+            return this;
+        },
+        
+        /**
+         * 解除事件处理方法
+         * Unbind editor event handle
+         * 
+         * @param   {String}   eventType          event type
+         * @returns {editormd}                    this(editormd instance object.)
+         */
+        
+        off : function(eventType) {
+            var settings = this.settings;
+            
+            if (typeof settings["on" + eventType] !== "undefined") 
+            {
+                settings["on" + eventType] = function(){};
+            }
+            
+            return this;
+        },
+        
+        /**
+         * 显示工具栏
+         * Display toolbar
+         * 
+         * @param   {Function} [callback=function(){}] 回调函数
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        showToolbar : function(callback) {
+            var settings = this.settings;
+            
+            if(settings.readOnly) {
+                return this;
+            }
+            
+            if (settings.toolbar && (this.toolbar.length < 1 || this.toolbar.find("." + this.classPrefix + "menu").html() === "") )
+            {
+                this.setToolbar();
+            }
+            
+            settings.toolbar = true; 
+            
+            this.toolbar.show();
+            this.resize();
+            
+            $.proxy(callback || function(){}, this)();
+
+            return this;
+        },
+        
+        /**
+         * 隐藏工具栏
+         * Hide toolbar
+         * 
+         * @param   {Function} [callback=function(){}] 回调函数
+         * @returns {editormd}                         this(editormd instance object.)
+         */
+        
+        hideToolbar : function(callback) { 
+            var settings = this.settings;
+            
+            settings.toolbar = false;  
+            this.toolbar.hide();
+            this.resize();
+            
+            $.proxy(callback || function(){}, this)();
+
+            return this;
+        },
+        
+        /**
+         * 页面滚动时工具栏的固定定位
+         * Set toolbar in window scroll auto fixed position
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setToolbarAutoFixed : function(fixed) {
+            
+            var state    = this.state;
+            var editor   = this.editor;
+            var toolbar  = this.toolbar;
+            var settings = this.settings;
+            
+            if (typeof fixed !== "undefined")
+            {
+                settings.toolbarAutoFixed = fixed;
+            }
+            
+            var autoFixedHandle = function(){
+                var $window = $(window);
+                var top     = $window.scrollTop();
+                
+                if (!settings.toolbarAutoFixed)
+                {
+                    return false;
+                }
+
+                if (top - editor.offset().top > 10 && top < editor.height())
+                {
+                    toolbar.css({
+                        position : "fixed",
+                        width    : editor.width() + "px",
+                        left     : ($window.width() - editor.width()) / 2 + "px"
+                    });
+                }
+                else
+                {
+                    toolbar.css({
+                        position : "absolute",
+                        width    : "100%",
+                        left     : 0
+                    });
+                }
+            };
+            
+            if (!state.fullscreen && !state.preview && settings.toolbar && settings.toolbarAutoFixed)
+            {
+                $(window).bind("scroll", autoFixedHandle);
+            }
+
+            return this;
+        },
+        
+        /**
+         * 配置和初始化工具栏
+         * Set toolbar and Initialization
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setToolbar : function() {
+            var settings    = this.settings;  
+            
+            if(settings.readOnly) {
+                return this;
+            }
+            
+            var editor      = this.editor;
+            var preview     = this.preview;
+            var classPrefix = this.classPrefix;
+            
+            var toolbar     = this.toolbar = editor.children("." + classPrefix + "toolbar");
+            
+            if (settings.toolbar && toolbar.length < 1)
+            {            
+                var toolbarHTML = "<div class=\"" + classPrefix + "toolbar\"><div class=\"" + classPrefix + "toolbar-container\"><ul class=\"" + classPrefix + "menu\"></ul></div></div>";
+                
+                editor.append(toolbarHTML);
+                toolbar = this.toolbar = editor.children("." + classPrefix + "toolbar");
+            }
+            
+            if (!settings.toolbar) 
+            {
+                toolbar.hide();
+                
+                return this;
+            }
+            
+            toolbar.show();
+            
+            var icons       = (typeof settings.toolbarIcons === "function") ? settings.toolbarIcons() 
+                            : ((typeof settings.toolbarIcons === "string")  ? editormd.toolbarModes[settings.toolbarIcons] : settings.toolbarIcons);
+            
+            var toolbarMenu = toolbar.find("." + this.classPrefix + "menu"), menu = "";
+            var pullRight   = false;
+            
+            for (var i = 0, len = icons.length; i < len; i++)
+            {
+                var name = icons[i];
+
+                if (name === "||") 
+                { 
+                    pullRight = true;
+                } 
+                else if (name === "|")
+                {
+                    menu += "<li class=\"divider\" unselectable=\"on\">|</li>";
+                }
+                else
+                {
+                    var isHeader = (/h(\d)/.test(name));
+                    var index    = name;
+                    
+                    if (name === "watch" && !settings.watch) {
+                        index = "unwatch";
+                    }
+                    
+                    var title     = settings.lang.toolbar[index];
+                    var iconTexts = settings.toolbarIconTexts[index];
+                    var iconClass = settings.toolbarIconsClass[index];
+                    
+                    title     = (typeof title     === "undefined") ? "" : title;
+                    iconTexts = (typeof iconTexts === "undefined") ? "" : iconTexts;
+                    iconClass = (typeof iconClass === "undefined") ? "" : iconClass;
+
+                    var menuItem = pullRight ? "<li class=\"pull-right\">" : "<li>";
+                    
+                    if (typeof settings.toolbarCustomIcons[name] !== "undefined" && typeof settings.toolbarCustomIcons[name] !== "function")
+                    {
+                        menuItem += settings.toolbarCustomIcons[name];
+                    }
+                    else 
+                    {
+                        menuItem += "<a href=\"javascript:;\" title=\"" + title + "\" unselectable=\"on\">";
+                        menuItem += "<i class=\"fa " + iconClass + "\" name=\""+name+"\" unselectable=\"on\">"+((isHeader) ? name.toUpperCase() : ( (iconClass === "") ? iconTexts : "") ) + "</i>";
+                        menuItem += "</a>";
+                    }
+
+                    menuItem += "</li>";
+
+                    menu = pullRight ? menuItem + menu : menu + menuItem;
+                }
+            }
+
+            toolbarMenu.html(menu);
+            
+            toolbarMenu.find("[title=\"Lowercase\"]").attr("title", settings.lang.toolbar.lowercase);
+            toolbarMenu.find("[title=\"ucwords\"]").attr("title", settings.lang.toolbar.ucwords);
+            
+            this.setToolbarHandler();
+            this.setToolbarAutoFixed();
+
+            return this;
+        },
+        
+        /**
+         * 工具栏图标事件处理对象序列
+         * Get toolbar icons event handlers
+         * 
+         * @param   {Object}   cm    CodeMirror的实例对象
+         * @param   {String}   name  要获取的事件处理器名称
+         * @returns {Object}         返回处理对象序列
+         */
+            
+        dialogLockScreen : function() {
+            $.proxy(editormd.dialogLockScreen, this)();
+            
+            return this;
+        },
+
+        dialogShowMask : function(dialog) {
+            $.proxy(editormd.dialogShowMask, this)(dialog);
+            
+            return this;
+        },
+        
+        getToolbarHandles : function(name) {  
+            var toolbarHandlers = this.toolbarHandlers = editormd.toolbarHandlers;
+            
+            return (name && typeof toolbarIconHandlers[name] !== "undefined") ? toolbarHandlers[name] : toolbarHandlers;
+        },
+        
+        /**
+         * 工具栏图标事件处理器
+         * Bind toolbar icons event handle
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setToolbarHandler : function() {
+            var _this               = this;
+            var settings            = this.settings;
+            
+            if (!settings.toolbar || settings.readOnly) {
+                return this;
+            }
+            
+            var toolbar             = this.toolbar;
+            var cm                  = this.cm;
+            var classPrefix         = this.classPrefix;           
+            var toolbarIcons        = this.toolbarIcons = toolbar.find("." + classPrefix + "menu > li > a");  
+            var toolbarIconHandlers = this.getToolbarHandles();  
+                
+            toolbarIcons.bind(editormd.mouseOrTouch("click", "touchend"), function(event) {
+
+                var icon                = $(this).children(".fa");
+                var name                = icon.attr("name");
+                var cursor              = cm.getCursor();
+                var selection           = cm.getSelection();
+
+                if (name === "") {
+                    return ;
+                }
+                
+                _this.activeIcon = icon;
+
+                if (typeof toolbarIconHandlers[name] !== "undefined") 
+                {
+                    $.proxy(toolbarIconHandlers[name], _this)(cm);
+                }
+                else 
+                {
+                    if (typeof settings.toolbarHandlers[name] !== "undefined") 
+                    {
+                        $.proxy(settings.toolbarHandlers[name], _this)(cm, icon, cursor, selection);
+                    }
+                }
+                
+                if (name !== "link" && name !== "reference-link" && name !== "image" && name !== "code-block" && 
+                    name !== "preformatted-text" && name !== "watch" && name !== "preview" && name !== "search" && name !== "fullscreen" && name !== "info") 
+                {
+                    cm.focus();
+                }
+
+                return false;
+
+            });
+
+            return this;
+        },
+        
+        /**
+         * 动态创建对话框
+         * Creating custom dialogs
+         * 
+         * @param   {Object} options  配置项键值对 Key/Value
+         * @returns {dialog}          返回创建的dialog的jQuery实例对象
+         */
+        
+        createDialog : function(options) {            
+            return $.proxy(editormd.createDialog, this)(options);
+        },
+        
+        /**
+         * 创建关于Editor.md的对话框
+         * Create about Editor.md dialog
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        createInfoDialog : function() {
+            var _this        = this;
+			var editor       = this.editor;
+            var classPrefix  = this.classPrefix;  
+            
+            var infoDialogHTML = [
+                "<div class=\"" + classPrefix + "dialog " + classPrefix + "dialog-info\" style=\"\">",
+                "<div class=\"" + classPrefix + "dialog-container\">",
+                "<h1><i class=\"editormd-logo editormd-logo-lg editormd-logo-color\"></i> " + editormd.title + "<small>v" + editormd.version + "</small></h1>",
+                "<p>" + this.lang.description + "</p>",
+                "<p style=\"margin: 10px 0 20px 0;\"><a href=\"" + editormd.homePage + "\" target=\"_blank\">" + editormd.homePage + " <i class=\"fa fa-external-link\"></i></a></p>",
+                "<p style=\"font-size: 0.85em;\">Copyright &copy; 2015 <a href=\"https://github.com/pandao\" target=\"_blank\" class=\"hover-link\">Pandao</a>, The <a href=\"https://github.com/pandao/editor.md/blob/master/LICENSE\" target=\"_blank\" class=\"hover-link\">MIT</a> License.</p>",
+                "</div>",
+                "<a href=\"javascript:;\" class=\"fa fa-close " + classPrefix + "dialog-close\"></a>",
+                "</div>"
+            ].join("\n");
+
+            editor.append(infoDialogHTML);
+            
+            var infoDialog  = this.infoDialog = editor.children("." + classPrefix + "dialog-info");
+
+            infoDialog.find("." + classPrefix + "dialog-close").bind(editormd.mouseOrTouch("click", "touchend"), function() {
+                _this.hideInfoDialog();
+            });
+            
+            infoDialog.css("border", (editormd.isIE8) ? "1px solid #ddd" : "").css("z-index", editormd.dialogZindex).show();
+            
+            this.infoDialogPosition();
+
+            return this;
+        },
+        
+        /**
+         * 关于Editor.md对话居中定位
+         * Editor.md dialog position handle
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        infoDialogPosition : function() {
+            var infoDialog = this.infoDialog;
+            
+			var _infoDialogPosition = function() {
+				infoDialog.css({
+					top  : ($(window).height() - infoDialog.height()) / 2 + "px",
+					left : ($(window).width()  - infoDialog.width()) / 2  + "px"
+				});
+			};
+
+			_infoDialogPosition();
+
+			$(window).resize(_infoDialogPosition);
+            
+            return this;
+        },
+        
+        /**
+         * 显示关于Editor.md
+         * Display about Editor.md dialog
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        showInfoDialog : function() {
+
+            $("html,body").css("overflow-x", "hidden");
+            
+            var _this       = this;
+			var editor      = this.editor;
+            var settings    = this.settings;         
+			var infoDialog  = this.infoDialog = editor.children("." + this.classPrefix + "dialog-info");
+            
+            if (infoDialog.length < 1)
+            {
+                this.createInfoDialog();
+            }
+            
+            this.lockScreen(true);
+            
+            this.mask.css({
+						opacity         : settings.dialogMaskOpacity,
+						backgroundColor : settings.dialogMaskBgColor
+					}).show();
+
+			infoDialog.css("z-index", editormd.dialogZindex).show();
+
+			this.infoDialogPosition();
+
+            return this;
+        },
+        
+        /**
+         * 隐藏关于Editor.md
+         * Hide about Editor.md dialog
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        hideInfoDialog : function() {            
+            $("html,body").css("overflow-x", "");
+            this.infoDialog.hide();
+            this.mask.hide();
+            this.lockScreen(false);
+
+            return this;
+        },
+        
+        /**
+         * 锁屏
+         * lock screen
+         * 
+         * @param   {Boolean}    lock    Boolean 布尔值，是否锁屏
+         * @returns {editormd}           返回editormd的实例对象
+         */
+        
+        lockScreen : function(lock) {
+            editormd.lockScreen(lock);
+            this.resize();
+
+            return this;
+        },
+        
+        /**
+         * 编辑器界面重建，用于动态语言包或模块加载等
+         * Recreate editor
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        recreate : function() {
+            var _this            = this;
+            var editor           = this.editor;
+            var settings         = this.settings;
+            
+            this.codeMirror.remove();
+            
+            this.setCodeMirror();
+
+            if (!settings.readOnly) 
+            {
+                if (editor.find(".editormd-dialog").length > 0) {
+                    editor.find(".editormd-dialog").remove();
+                }
+                
+                if (settings.toolbar) 
+                {  
+                    this.getToolbarHandles();                  
+                    this.setToolbar();
+                }
+            }
+            
+            this.loadedDisplay(true);
+
+            return this;
+        },
+        
+        /**
+         * 高亮预览HTML的pre代码部分
+         * highlight of preview codes
+         * 
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        previewCodeHighlight : function() {    
+            var settings         = this.settings;
+            var previewContainer = this.previewContainer;
+            
+            if (settings.previewCodeHighlight) 
+            {
+                previewContainer.find("pre").addClass("prettyprint linenums");
+                
+                if (typeof prettyPrint !== "undefined")
+                {                    
+                    prettyPrint();
+                }
+            }
+
+            return this;
+        },
+        
+        /**
+         * 解析TeX(KaTeX)科学公式
+         * TeX(KaTeX) Renderer
+         * 
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        katexRender : function() {
+            
+            if (timer === null)
+            {
+                return this;
+            }
+            
+            this.previewContainer.find("." + editormd.classNames.tex).each(function(){
+                var tex  = $(this);
+                editormd.$katex.render(tex.text(), tex[0]);
+                
+                tex.find(".katex").css("font-size", "1.6em");
+            });   
+
+            return this;
+        },
+        
+        /**
+         * 解析和渲染流程图及时序图
+         * FlowChart and SequenceDiagram Renderer
+         * 
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        flowChartAndSequenceDiagramRender : function() {
+            var $this            = this;
+            var settings         = this.settings;
+            var previewContainer = this.previewContainer;
+            
+            if (editormd.isIE8) {
+                return this;
+            }
+
+            if (settings.flowChart) {
+                if (flowchartTimer === null) {
+                    return this;
+                }
+                
+                previewContainer.find(".flowchart").flowChart(); 
+            }
+
+            if (settings.sequenceDiagram) {
+                previewContainer.find(".sequence-diagram").sequenceDiagram({theme: "simple"});
+            }
+                    
+            var preview    = $this.preview;
+            var codeMirror = $this.codeMirror;
+            var codeView   = codeMirror.find(".CodeMirror-scroll");
+
+            var height    = codeView.height();
+            var scrollTop = codeView.scrollTop();                    
+            var percent   = (scrollTop / codeView[0].scrollHeight);
+            var tocHeight = 0;
+
+            preview.find(".markdown-toc-list").each(function(){
+                tocHeight += $(this).height();
+            });
+
+            var tocMenuHeight = preview.find(".editormd-toc-menu").height(); 
+            tocMenuHeight = (!tocMenuHeight) ? 0 : tocMenuHeight;
+
+            if (scrollTop === 0) 
+            {
+                preview.scrollTop(0);
+            } 
+            else if (scrollTop + height >= codeView[0].scrollHeight - 16)
+            { 
+                preview.scrollTop(preview[0].scrollHeight);                        
+            } 
+            else
+            {                  
+                preview.scrollTop((preview[0].scrollHeight + tocHeight + tocMenuHeight) * percent);
+            }
+
+            return this;
+        },
+        
+        /**
+         * 注册键盘快捷键处理
+         * Register CodeMirror keyMaps (keyboard shortcuts).
+         * 
+         * @param   {Object}    keyMap      KeyMap key/value {"(Ctrl/Shift/Alt)-Key" : function(){}}
+         * @returns {editormd}              return this
+         */
+        
+        registerKeyMaps : function(keyMap) {
+            
+            var _this           = this;
+            var cm              = this.cm;
+            var settings        = this.settings;
+            var toolbarHandlers = editormd.toolbarHandlers;
+            var disabledKeyMaps = settings.disabledKeyMaps;
+            
+            keyMap              = keyMap || null;
+            
+            if (keyMap)
+            {
+                for (var i in keyMap)
+                {
+                    if ($.inArray(i, disabledKeyMaps) < 0)
+                    {
+                        var map = {};
+                        map[i]  = keyMap[i];
+
+                        cm.addKeyMap(keyMap);
+                    }
+                }
+            }
+            else
+            {
+                for (var k in editormd.keyMaps)
+                {
+                    var _keyMap = editormd.keyMaps[k];
+                    var handle = (typeof _keyMap === "string") ? $.proxy(toolbarHandlers[_keyMap], _this) : $.proxy(_keyMap, _this);
+                    
+                    if ($.inArray(k, ["F9", "F10", "F11"]) < 0 && $.inArray(k, disabledKeyMaps) < 0)
+                    {
+                        var _map = {};
+                        _map[k] = handle;
+
+                        cm.addKeyMap(_map);
+                    }
+                }
+                
+                $(window).keydown(function(event) {
+                    
+                    var keymaps = {
+                        "120" : "F9",
+                        "121" : "F10",
+                        "122" : "F11"
+                    };
+                    
+                    if ( $.inArray(keymaps[event.keyCode], disabledKeyMaps) < 0 )
+                    {
+                        switch (event.keyCode)
+                        {
+                            case 120:
+                                    $.proxy(toolbarHandlers["watch"], _this)();
+                                    return false;
+                                break;
+                                
+                            case 121:
+                                    $.proxy(toolbarHandlers["preview"], _this)();
+                                    return false;
+                                break;
+                                
+                            case 122:
+                                    $.proxy(toolbarHandlers["fullscreen"], _this)();                        
+                                    return false;
+                                break;
+                                
+                            default:
+                                break;
+                        }
+                    }
+                });
+            }
+
+            return this;
+        },
+        
+        /**
+         * 绑定同步滚动
+         * 
+         * @returns {editormd} return this
+         */
+        
+        bindScrollEvent : function() {
+            
+            var _this            = this;
+            var preview          = this.preview;
+            var settings         = this.settings;
+            var codeMirror       = this.codeMirror;
+            var mouseOrTouch     = editormd.mouseOrTouch;
+            
+            if (!settings.syncScrolling) {
+                return this;
+            }
+                
+            var cmBindScroll = function() {    
+                codeMirror.find(".CodeMirror-scroll").bind(mouseOrTouch("scroll", "touchmove"), function(event) {
+                    var height    = $(this).height();
+                    var scrollTop = $(this).scrollTop();                    
+                    var percent   = (scrollTop / $(this)[0].scrollHeight);
+                    
+                    var tocHeight = 0;
+                    
+                    preview.find(".markdown-toc-list").each(function(){
+                        tocHeight += $(this).height();
+                    });
+                    
+                    var tocMenuHeight = preview.find(".editormd-toc-menu").height();
+                    tocMenuHeight = (!tocMenuHeight) ? 0 : tocMenuHeight;
+
+                    if (scrollTop === 0) 
+                    {
+                        preview.scrollTop(0);
+                    } 
+                    else if (scrollTop + height >= $(this)[0].scrollHeight - 16)
+                    { 
+                        preview.scrollTop(preview[0].scrollHeight);                        
+                    } 
+                    else
+                    {
+                        preview.scrollTop((preview[0].scrollHeight  + tocHeight + tocMenuHeight) * percent);
+                    }
+                    
+                    $.proxy(settings.onscroll, _this)(event);
+                });
+            };
+
+            var cmUnbindScroll = function() {
+                codeMirror.find(".CodeMirror-scroll").unbind(mouseOrTouch("scroll", "touchmove"));
+            };
+
+            var previewBindScroll = function() {
+                
+                preview.bind(mouseOrTouch("scroll", "touchmove"), function(event) {
+                    var height    = $(this).height();
+                    var scrollTop = $(this).scrollTop();         
+                    var percent   = (scrollTop / $(this)[0].scrollHeight);
+                    var codeView  = codeMirror.find(".CodeMirror-scroll");
+
+                    if(scrollTop === 0) 
+                    {
+                        codeView.scrollTop(0);
+                    }
+                    else if (scrollTop + height >= $(this)[0].scrollHeight)
+                    {
+                        codeView.scrollTop(codeView[0].scrollHeight);                        
+                    }
+                    else 
+                    {
+                        codeView.scrollTop(codeView[0].scrollHeight * percent);
+                    }
+                    
+                    $.proxy(settings.onpreviewscroll, _this)(event);
+                });
+
+            };
+
+            var previewUnbindScroll = function() {
+                preview.unbind(mouseOrTouch("scroll", "touchmove"));
+            }; 
+
+			codeMirror.bind({
+				mouseover  : cmBindScroll,
+				mouseout   : cmUnbindScroll,
+				touchstart : cmBindScroll,
+				touchend   : cmUnbindScroll
+			});
+            
+            if (settings.syncScrolling === "single") {
+                return this;
+            }
+            
+			preview.bind({
+				mouseover  : previewBindScroll,
+				mouseout   : previewUnbindScroll,
+				touchstart : previewBindScroll,
+				touchend   : previewUnbindScroll
+			});
+
+            return this;
+        },
+        
+        bindChangeEvent : function() {
+            
+            var _this            = this;
+            var cm               = this.cm;
+            var settings         = this.settings;
+            
+            if (!settings.syncScrolling) {
+                return this;
+            }
+            
+            cm.on("change", function(_cm, changeObj) {
+                
+                if (settings.watch)
+                {
+                    _this.previewContainer.css("padding", settings.autoHeight ? "20px 20px 50px 40px" : "20px");
+                }
+                
+                timer = setTimeout(function() {
+                    clearTimeout(timer);
+                    _this.save();
+                    timer = null;
+                }, settings.delay);
+            });
+
+            return this;
+        },
+        
+        /**
+         * 加载队列完成之后的显示处理
+         * Display handle of the module queues loaded after.
+         * 
+         * @param   {Boolean}   recreate   是否为重建编辑器
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        loadedDisplay : function(recreate) {
+            
+            recreate             = recreate || false;
+            
+            var _this            = this;
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var settings         = this.settings;
+            
+            this.containerMask.hide();
+            
+            this.save();
+            
+            if (settings.watch) {
+                preview.show();
+            }
+            
+            editor.data("oldWidth", editor.width()).data("oldHeight", editor.height()); // 为了兼容Zepto
+            
+            this.resize();
+            this.registerKeyMaps();
+            
+            $(window).resize(function(){
+                _this.resize();
+            });
+            
+            this.bindScrollEvent().bindChangeEvent();
+            
+            if (!recreate)
+            {
+                $.proxy(settings.onload, this)();
+            }
+            
+            this.state.loaded = true;
+
+            return this;
+        },
+        
+        /**
+         * 设置编辑器的宽度
+         * Set editor width
+         * 
+         * @param   {Number|String} width  编辑器宽度值
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        width : function(width) {
+                
+            this.editor.css("width", (typeof width === "number") ? width  + "px" : width);            
+            this.resize();
+            
+            return this;
+        },
+        
+        /**
+         * 设置编辑器的高度
+         * Set editor height
+         * 
+         * @param   {Number|String} height  编辑器高度值
+         * @returns {editormd}              返回editormd的实例对象
+         */
+        
+        height : function(height) {
+                
+            this.editor.css("height", (typeof height === "number")  ? height  + "px" : height);            
+            this.resize();
+            
+            return this;
+        },
+        
+        /**
+         * 调整编辑器的尺寸和布局
+         * Resize editor layout
+         * 
+         * @param   {Number|String} [width=null]  编辑器宽度值
+         * @param   {Number|String} [height=null] 编辑器高度值
+         * @returns {editormd}                    返回editormd的实例对象
+         */
+        
+        resize : function(width, height) {
+            
+            width  = width  || null;
+            height = height || null;
+            
+            var state      = this.state;
+            var editor     = this.editor;
+            var preview    = this.preview;
+            var toolbar    = this.toolbar;
+            var settings   = this.settings;
+            var codeMirror = this.codeMirror;
+            
+            if (width)
+            {
+                editor.css("width", (typeof width  === "number") ? width  + "px" : width);
+            }
+            
+            if (settings.autoHeight && !state.fullscreen && !state.preview)
+            {
+                editor.css("height", "auto");
+                codeMirror.css("height", "auto");
+            } 
+            else 
+            {
+                if (height) 
+                {
+                    editor.css("height", (typeof height === "number") ? height + "px" : height);
+                }
+                
+                if (state.fullscreen)
+                {
+                    editor.height($(window).height());
+                }
+
+                if (settings.toolbar && !settings.readOnly) 
+                {
+                    codeMirror.css("margin-top", toolbar.height() + 1).height(editor.height() - toolbar.height());
+                } 
+                else
+                {
+                    codeMirror.css("margin-top", 0).height(editor.height());
+                }
+            }
+            
+            if(settings.watch) 
+            {
+                codeMirror.width(editor.width() / 2);
+                preview.width((!state.preview) ? editor.width() / 2 : editor.width());
+                
+                this.previewContainer.css("padding", settings.autoHeight ? "20px 20px 50px 40px" : "20px");
+                
+                if (settings.toolbar && !settings.readOnly) 
+                {
+                    preview.css("top", toolbar.height() + 1);
+                } 
+                else 
+                {
+                    preview.css("top", 0);
+                }
+                
+                if (settings.autoHeight && !state.fullscreen && !state.preview)
+                {
+                    preview.height("");
+                }
+                else
+                {                
+                    var previewHeight = (settings.toolbar && !settings.readOnly) ? editor.height() - toolbar.height() : editor.height();
+                    
+                    preview.height(previewHeight);
+                }
+            } 
+            else 
+            {
+                codeMirror.width(editor.width());
+                preview.hide();
+            }
+            
+            if (state.loaded) 
+            {
+                $.proxy(settings.onresize, this)();
+            }
+
+            return this;
+        },
+        
+        /**
+         * 解析和保存Markdown代码
+         * Parse & Saving Markdown source code
+         * 
+         * @returns {editormd}     返回editormd的实例对象
+         */
+        
+        save : function() {
+            
+            if (timer === null)
+            {
+                return this;
+            }
+            
+            var _this            = this;
+            var state            = this.state;
+            var settings         = this.settings;
+            var cm               = this.cm;            
+            var cmValue          = cm.getValue();
+            var previewContainer = this.previewContainer;
+
+            if (settings.mode !== "gfm" && settings.mode !== "markdown") 
+            {
+                this.markdownTextarea.val(cmValue);
+                
+                return this;
+            }
+            
+            var marked          = editormd.$marked;
+            var markdownToC     = this.markdownToC = [];            
+            var rendererOptions = this.markedRendererOptions = {  
+                toc                  : settings.toc,
+                tocm                 : settings.tocm,
+                tocStartLevel        : settings.tocStartLevel,
+                pageBreak            : settings.pageBreak,
+                taskList             : settings.taskList,
+                emoji                : settings.emoji,
+                tex                  : settings.tex,
+                atLink               : settings.atLink,           // for @link
+                emailLink            : settings.emailLink,        // for mail address auto link
+                flowChart            : settings.flowChart,
+                sequenceDiagram      : settings.sequenceDiagram,
+                previewCodeHighlight : settings.previewCodeHighlight,
+            };
+            
+            var markedOptions = this.markedOptions = {
+                renderer    : editormd.markedRenderer(markdownToC, rendererOptions),
+                gfm         : true,
+                tables      : true,
+                breaks      : true,
+                pedantic    : false,
+                sanitize    : (settings.htmlDecode) ? false : true,  // 关闭忽略HTML标签，即开启识别HTML标签，默认为false
+                smartLists  : true,
+                smartypants : true
+            };
+            
+            marked.setOptions(markedOptions);
+                    
+            var newMarkdownDoc = editormd.$marked(cmValue, markedOptions);
+            
+            //console.info("cmValue", cmValue, newMarkdownDoc);
+            
+            newMarkdownDoc = editormd.filterHTMLTags(newMarkdownDoc, settings.htmlDecode);
+            
+            //console.error("cmValue", cmValue, newMarkdownDoc);
+            
+            this.markdownTextarea.text(cmValue);
+            
+            cm.save();
+            
+            if (settings.saveHTMLToTextarea) 
+            {
+                this.htmlTextarea.text(newMarkdownDoc);
+            }
+            
+            if(settings.watch || (!settings.watch && state.preview))
+            {
+                previewContainer.html(newMarkdownDoc);
+
+                this.previewCodeHighlight();
+                
+                if (settings.toc) 
+                {
+                    var tocContainer = (settings.tocContainer === "") ? previewContainer : $(settings.tocContainer);
+                    var tocMenu      = tocContainer.find("." + this.classPrefix + "toc-menu");
+                    
+                    tocContainer.attr("previewContainer", (settings.tocContainer === "") ? "true" : "false");
+                    
+                    if (settings.tocContainer !== "" && tocMenu.length > 0)
+                    {
+                        tocMenu.remove();
+                    }
+                    
+                    editormd.markdownToCRenderer(markdownToC, tocContainer, settings.tocDropdown, settings.tocStartLevel);
+            
+                    if (settings.tocDropdown || tocContainer.find("." + this.classPrefix + "toc-menu").length > 0)
+                    {
+                        editormd.tocDropdownMenu(tocContainer, (settings.tocTitle !== "") ? settings.tocTitle : this.lang.tocTitle);
+                    }
+            
+                    if (settings.tocContainer !== "")
+                    {
+                        previewContainer.find(".markdown-toc").css("border", "none");
+                    }
+                }
+                
+                if (settings.tex)
+                {
+                    if (!editormd.kaTeXLoaded && settings.autoLoadModules) 
+                    {
+                        editormd.loadKaTeX(function() {
+                            editormd.$katex = katex;
+                            editormd.kaTeXLoaded = true;
+                            _this.katexRender();
+                        });
+                    } 
+                    else 
+                    {
+                        editormd.$katex = katex;
+                        this.katexRender();
+                    }
+                }                
+                
+                if (settings.flowChart || settings.sequenceDiagram)
+                {
+                    flowchartTimer = setTimeout(function(){
+                        clearTimeout(flowchartTimer);
+                        _this.flowChartAndSequenceDiagramRender();
+                        flowchartTimer = null;
+                    }, 10);
+                }
+
+                if (state.loaded) 
+                {
+                    $.proxy(settings.onchange, this)();
+                }
+            }
+
+            return this;
+        },
+        
+        /**
+         * 聚焦光标位置
+         * Focusing the cursor position
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        focus : function() {
+            this.cm.focus();
+
+            return this;
+        },
+        
+        /**
+         * 设置光标的位置
+         * Set cursor position
+         * 
+         * @param   {Object}    cursor 要设置的光标位置键值对象，例：{line:1, ch:0}
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        setCursor : function(cursor) {
+            this.cm.setCursor(cursor);
+
+            return this;
+        },
+        
+        /**
+         * 获取当前光标的位置
+         * Get the current position of the cursor
+         * 
+         * @returns {Cursor}         返回一个光标Cursor对象
+         */
+        
+        getCursor : function() {
+            return this.cm.getCursor();
+        },
+        
+        /**
+         * 设置光标选中的范围
+         * Set cursor selected ranges
+         * 
+         * @param   {Object}    from   开始位置的光标键值对象，例：{line:1, ch:0}
+         * @param   {Object}    to     结束位置的光标键值对象，例：{line:1, ch:0}
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        setSelection : function(from, to) {
+        
+            this.cm.setSelection(from, to);
+        
+            return this;
+        },
+        
+        /**
+         * 获取光标选中的文本
+         * Get the texts from cursor selected
+         * 
+         * @returns {String}         返回选中文本的字符串形式
+         */
+        
+        getSelection : function() {
+            return this.cm.getSelection();
+        },
+        
+        /**
+         * 设置光标选中的文本范围
+         * Set the cursor selection ranges
+         * 
+         * @param   {Array}    ranges  cursor selection ranges array
+         * @returns {Array}            return this
+         */
+        
+        setSelections : function(ranges) {
+            this.cm.setSelections(ranges);
+            
+            return this;
+        },
+        
+        /**
+         * 获取光标选中的文本范围
+         * Get the cursor selection ranges
+         * 
+         * @returns {Array}         return selection ranges array
+         */
+        
+        getSelections : function() {
+            return this.cm.getSelections();
+        },
+        
+        /**
+         * 替换当前光标选中的文本或在当前光标处插入新字符
+         * Replace the text at the current cursor selected or insert a new character at the current cursor position
+         * 
+         * @param   {String}    value  要插入的字符值
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        replaceSelection : function(value) {
+            this.cm.replaceSelection(value);
+
+            return this;
+        },
+        
+        /**
+         * 在当前光标处插入新字符
+         * Insert a new character at the current cursor position
+         *
+         * 同replaceSelection()方法
+         * With the replaceSelection() method
+         * 
+         * @param   {String}    value  要插入的字符值
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        insertValue : function(value) {
+            this.replaceSelection(value);
+
+            return this;
+        },
+        
+        /**
+         * 追加markdown
+         * append Markdown to editor
+         * 
+         * @param   {String}    md     要追加的markdown源文档
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        appendMarkdown : function(md) {
+            var settings = this.settings;
+            var cm       = this.cm;
+            
+            cm.setValue(cm.getValue() + md);
+            
+            return this;
+        },
+        
+        /**
+         * 设置和传入编辑器的markdown源文档
+         * Set Markdown source document
+         * 
+         * @param   {String}    md     要传入的markdown源文档
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        setMarkdown : function(md) {
+            this.cm.setValue(md || this.settings.markdown);
+            
+            return this;
+        },
+        
+        /**
+         * 获取编辑器的markdown源文档
+         * Set Editor.md markdown/CodeMirror value
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        getMarkdown : function() {
+            return this.cm.getValue();
+        },
+        
+        /**
+         * 获取编辑器的源文档
+         * Get CodeMirror value
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        getValue : function() {
+            return this.cm.getValue();
+        },
+        
+        /**
+         * 设置编辑器的源文档
+         * Set CodeMirror value
+         * 
+         * @param   {String}     value   set code/value/string/text
+         * @returns {editormd}           返回editormd的实例对象
+         */
+        
+        setValue : function(value) {
+            this.cm.setValue(value);
+            
+            return this;
+        },
+        
+        /**
+         * 清空编辑器
+         * Empty CodeMirror editor container
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        clear : function() {
+            this.cm.setValue("");
+            
+            return this;
+        },
+        
+        /**
+         * 获取解析后存放在Textarea的HTML源码
+         * Get parsed html code from Textarea
+         * 
+         * @returns {String}               返回HTML源码
+         */
+        
+        getHTML : function() {
+            if (!this.settings.saveHTMLToTextarea)
+            {
+                alert("Error: settings.saveHTMLToTextarea == false");
+
+                return false;
+            }
+            
+            return this.htmlTextarea.val();
+        },
+        
+        /**
+         * getHTML()的别名
+         * getHTML (alias)
+         * 
+         * @returns {String}           Return html code 返回HTML源码
+         */
+        
+        getTextareaSavedHTML : function() {
+            return this.getHTML();
+        },
+        
+        /**
+         * 获取预览窗口的HTML源码
+         * Get html from preview container
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        getPreviewedHTML : function() {
+            if (!this.settings.watch)
+            {
+                alert("Error: settings.watch == false");
+
+                return false;
+            }
+            
+            return this.previewContainer.html();
+        },
+        
+        /**
+         * 开启实时预览
+         * Enable real-time watching
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        watch : function(callback) {     
+            var settings        = this.settings;
+            
+            if ($.inArray(settings.mode, ["gfm", "markdown"]) < 0)
+            {
+                return this;
+            }
+            
+            this.state.watching = settings.watch = true;
+            this.preview.show();
+            
+            if (this.toolbar)
+            {
+                var watchIcon   = settings.toolbarIconsClass.watch;
+                var unWatchIcon = settings.toolbarIconsClass.unwatch;
+                
+                var icon        = this.toolbar.find(".fa[name=watch]");
+                icon.parent().attr("title", settings.lang.toolbar.watch);
+                icon.removeClass(unWatchIcon).addClass(watchIcon);
+            }
+            
+            this.codeMirror.css("border-right", "1px solid #ddd").width(this.editor.width() / 2); 
+            
+            timer = 0;
+            
+            this.save().resize();
+            
+            if (!settings.onwatch)
+            {
+                settings.onwatch = callback || function() {};
+            }
+            
+            $.proxy(settings.onwatch, this)();
+            
+            return this;
+        },
+        
+        /**
+         * 关闭实时预览
+         * Disable real-time watching
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        unwatch : function(callback) {
+            var settings        = this.settings;
+            this.state.watching = settings.watch = false;
+            this.preview.hide();
+            
+            if (this.toolbar) 
+            {
+                var watchIcon   = settings.toolbarIconsClass.watch;
+                var unWatchIcon = settings.toolbarIconsClass.unwatch;
+                
+                var icon    = this.toolbar.find(".fa[name=watch]");
+                icon.parent().attr("title", settings.lang.toolbar.unwatch);
+                icon.removeClass(watchIcon).addClass(unWatchIcon);
+            }
+            
+            this.codeMirror.css("border-right", "none").width(this.editor.width());
+            
+            this.resize();
+            
+            if (!settings.onunwatch)
+            {
+                settings.onunwatch = callback || function() {};
+            }
+            
+            $.proxy(settings.onunwatch, this)();
+            
+            return this;
+        },
+        
+        /**
+         * 显示编辑器
+         * Show editor
+         * 
+         * @param   {Function} [callback=function()] 回调函数
+         * @returns {editormd}                       返回editormd的实例对象
+         */
+        
+        show : function(callback) {
+            callback  = callback || function() {};
+            
+            var _this = this;
+            this.editor.show(0, function() {
+                $.proxy(callback, _this)();
+            });
+            
+            return this;
+        },
+        
+        /**
+         * 隐藏编辑器
+         * Hide editor
+         * 
+         * @param   {Function} [callback=function()] 回调函数
+         * @returns {editormd}                       返回editormd的实例对象
+         */
+        
+        hide : function(callback) {
+            callback  = callback || function() {};
+            
+            var _this = this;
+            this.editor.hide(0, function() {
+                $.proxy(callback, _this)();
+            });
+            
+            return this;
+        },
+        
+        /**
+         * 隐藏编辑器部分，只预览HTML
+         * Enter preview html state
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        previewing : function() {
+            
+            var _this            = this;
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var toolbar          = this.toolbar;
+            var settings         = this.settings;
+            var codeMirror       = this.codeMirror;
+            var previewContainer = this.previewContainer;
+            
+            if ($.inArray(settings.mode, ["gfm", "markdown"]) < 0) {
+                return this;
+            }
+            
+            if (settings.toolbar && toolbar) {
+                toolbar.toggle();
+                toolbar.find(".fa[name=preview]").toggleClass("active");
+            }
+            
+            codeMirror.toggle();
+            
+            var escHandle = function(event) {
+                if (event.shiftKey && event.keyCode === 27) {
+                    _this.previewed();
+                }
+            };
+
+            if (codeMirror.css("display") === "none") // 为了兼容Zepto，而不使用codeMirror.is(":hidden")
+            {
+                this.state.preview = true;
+
+                if (this.state.fullscreen) {
+                    preview.css("background", "#fff");
+                }
+                
+                editor.find("." + this.classPrefix + "preview-close-btn").show().bind(editormd.mouseOrTouch("click", "touchend"), function(){
+                    _this.previewed();
+                });
+            
+                if (!settings.watch)
+                {
+                    this.save();
+                } 
+                else 
+                {
+                    previewContainer.css("padding", "");
+                }
+                
+                previewContainer.addClass(this.classPrefix + "preview-active");
+
+                preview.show().css({
+                    position  : "",
+                    top       : 0,
+                    width     : editor.width(),
+                    height    : (settings.autoHeight && !this.state.fullscreen) ? "auto" : editor.height()
+                });
+                
+                if (this.state.loaded)
+                {
+                    $.proxy(settings.onpreviewing, this)();
+                }
+
+                $(window).bind("keyup", escHandle);
+            } 
+            else 
+            {
+                $(window).unbind("keyup", escHandle);
+                this.previewed();
+            }
+        },
+        
+        /**
+         * 显示编辑器部分，退出只预览HTML
+         * Exit preview html state
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        previewed : function() {
+            
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var toolbar          = this.toolbar;
+            var settings         = this.settings;
+            var previewContainer = this.previewContainer;
+            var previewCloseBtn  = editor.find("." + this.classPrefix + "preview-close-btn");
+
+            this.state.preview   = false;
+            
+            this.codeMirror.show();
+            
+            if (settings.toolbar) {
+                toolbar.show();
+            }
+            
+            preview[(settings.watch) ? "show" : "hide"]();
+            
+            previewCloseBtn.hide().unbind(editormd.mouseOrTouch("click", "touchend"));
+                
+            previewContainer.removeClass(this.classPrefix + "preview-active");
+                
+            if (settings.watch)
+            {
+                previewContainer.css("padding", "20px");
+            }
+            
+            preview.css({ 
+                background : null,
+                position   : "absolute",
+                width      : editor.width() / 2,
+                height     : (settings.autoHeight && !this.state.fullscreen) ? "auto" : editor.height() - toolbar.height(),
+                top        : (settings.toolbar)    ? toolbar.height() : 0
+            });
+
+            if (this.state.loaded)
+            {
+                $.proxy(settings.onpreviewed, this)();
+            }
+            
+            return this;
+        },
+        
+        /**
+         * 编辑器全屏显示
+         * Fullscreen show
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        fullscreen : function() {
+            
+            var _this            = this;
+            var state            = this.state;
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var toolbar          = this.toolbar;
+            var settings         = this.settings;
+            var fullscreenClass  = this.classPrefix + "fullscreen";
+            
+            if (toolbar) {
+                toolbar.find(".fa[name=fullscreen]").parent().toggleClass("active"); 
+            }
+            
+            var escHandle = function(event) {
+                if (!event.shiftKey && event.keyCode === 27) 
+                {
+                    if (state.fullscreen)
+                    {
+                        _this.fullscreenExit();
+                    }
+                }
+            };
+
+            if (!editor.hasClass(fullscreenClass)) 
+            {
+                state.fullscreen = true;
+
+                $("html,body").css("overflow", "hidden");
+                
+                editor.css({
+                    width    : $(window).width(),
+                    height   : $(window).height()
+                }).addClass(fullscreenClass);
+
+                this.resize();
+    
+                $.proxy(settings.onfullscreen, this)();
+
+                $(window).bind("keyup", escHandle);
+            }
+            else
+            {           
+                $(window).unbind("keyup", escHandle); 
+                this.fullscreenExit();
+            }
+
+            return this;
+        },
+        
+        /**
+         * 编辑器退出全屏显示
+         * Exit fullscreen state
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        fullscreenExit : function() {
+            
+            var editor            = this.editor;
+            var settings          = this.settings;
+            var toolbar           = this.toolbar;
+            var fullscreenClass   = this.classPrefix + "fullscreen";  
+            
+            this.state.fullscreen = false;
+            
+            if (toolbar) {
+                toolbar.find(".fa[name=fullscreen]").parent().removeClass("active"); 
+            }
+
+            $("html,body").css("overflow", "");
+
+            editor.css({
+                width    : editor.data("oldWidth"),
+                height   : editor.data("oldHeight")
+            }).removeClass(fullscreenClass);
+
+            this.resize();
+            
+            $.proxy(settings.onfullscreenExit, this)();
+
+            return this;
+        },
+        
+        /**
+         * 加载并执行插件
+         * Load and execute the plugin
+         * 
+         * @param   {String}     name    plugin name / function name
+         * @param   {String}     path    plugin load path
+         * @returns {editormd}           返回editormd的实例对象
+         */
+        
+        executePlugin : function(name, path) {
+            
+            var _this    = this;
+            var cm       = this.cm;
+            var settings = this.settings;
+            
+            path = settings.pluginPath + path;
+            
+            if (typeof define === "function") 
+            {            
+                if (typeof this[name] === "undefined")
+                {
+                    alert("Error: " + name + " plugin is not found, you are not load this plugin.");
+                    
+                    return this;
+                }
+                
+                this[name](cm);
+                
+                return this;
+            }
+            
+            if ($.inArray(path, editormd.loadFiles.plugin) < 0)
+            {
+                editormd.loadPlugin(path, function() {
+                    editormd.loadPlugins[name] = _this[name];
+                    _this[name](cm);
+                });
+            }
+            else
+            {
+                $.proxy(editormd.loadPlugins[name], this)(cm);
+            }
+            
+            return this;
+        },
+                
+        /**
+         * 搜索替换
+         * Search & replace
+         * 
+         * @param   {String}     command    CodeMirror serach commands, "find, fintNext, fintPrev, clearSearch, replace, replaceAll"
+         * @returns {editormd}              return this
+         */
+        
+        search : function(command) {
+            var settings = this.settings;
+            
+            if (!settings.searchReplace)
+            {
+                alert("Error: settings.searchReplace == false");
+                return this;
+            }
+            
+            if (!settings.readOnly)
+            {
+                this.cm.execCommand(command || "find");
+            }
+            
+            return this;
+        },
+        
+        searchReplace : function() {            
+            this.search("replace");
+            
+            return this;
+        },
+        
+        searchReplaceAll : function() {          
+            this.search("replaceAll");
+            
+            return this;
+        }
+    };
+    
+    editormd.fn.init.prototype = editormd.fn; 
+   
+    /**
+     * 锁屏
+     * lock screen when dialog opening
+     * 
+     * @returns {void}
+     */
+
+    editormd.dialogLockScreen = function() {
+        var settings = this.settings || {dialogLockScreen : true};
+        
+        if (settings.dialogLockScreen) 
+        {            
+            $("html,body").css("overflow", "hidden");
+            this.resize();
+        }
+    };
+   
+    /**
+     * 显示透明背景层
+     * Display mask layer when dialog opening
+     * 
+     * @param   {Object}     dialog    dialog jQuery object
+     * @returns {void}
+     */
+    
+    editormd.dialogShowMask = function(dialog) {
+        var editor   = this.editor;
+        var settings = this.settings || {dialogShowMask : true};
+        
+        dialog.css({
+            top  : ($(window).height() - dialog.height()) / 2 + "px",
+            left : ($(window).width()  - dialog.width())  / 2 + "px"
+        });
+
+        if (settings.dialogShowMask) {
+            editor.children("." + this.classPrefix + "mask").css("z-index", parseInt(dialog.css("z-index")) - 1).show();
+        }
+    };
+
+    editormd.toolbarHandlers = {
+        undo : function() {
+            this.cm.undo();
+        },
+        
+        redo : function() {
+            this.cm.redo();
+        },
+        
+        bold : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("**" + selection + "**");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+        },
+        
+        del : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("~~" + selection + "~~");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+        },
+
+        italic : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("*" + selection + "*");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+
+        quote : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("> " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+            else
+            {
+                cm.replaceSelection("> " + selection);
+            }
+
+            //cm.replaceSelection("> " + selection);
+            //cm.setCursor(cursor.line, (selection === "") ? cursor.ch + 2 : cursor.ch + selection.length + 2);
+        },
+        
+        ucfirst : function() {
+            var cm         = this.cm;
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+
+            cm.replaceSelection(editormd.firstUpperCase(selection));
+            cm.setSelections(selections);
+        },
+        
+        ucwords : function() {
+            var cm         = this.cm;
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+
+            cm.replaceSelection(editormd.wordsFirstUpperCase(selection));
+            cm.setSelections(selections);
+        },
+        
+        uppercase : function() {
+            var cm         = this.cm;
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+
+            cm.replaceSelection(selection.toUpperCase());
+            cm.setSelections(selections);
+        },
+        
+        lowercase : function() {
+            var cm         = this.cm;
+            var cursor     = cm.getCursor();
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+            
+            cm.replaceSelection(selection.toLowerCase());
+            cm.setSelections(selections);
+        },
+
+        h1 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("# " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+            else
+            {
+                cm.replaceSelection("# " + selection);
+            }
+        },
+
+        h2 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("## " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 3);
+            }
+            else
+            {
+                cm.replaceSelection("## " + selection);
+            }
+        },
+
+        h3 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 4);
+            }
+            else
+            {
+                cm.replaceSelection("### " + selection);
+            }
+        },
+
+        h4 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("#### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 5);
+            }
+            else
+            {
+                cm.replaceSelection("#### " + selection);
+            }
+        },
+
+        h5 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("##### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 6);
+            }
+            else
+            {
+                cm.replaceSelection("##### " + selection);
+            }
+        },
+
+        h6 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("###### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 7);
+            }
+            else
+            {
+                cm.replaceSelection("###### " + selection);
+            }
+        },
+
+        "list-ul" : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (selection === "") 
+            {
+                cm.replaceSelection("- " + selection);
+            } 
+            else 
+            {
+                var selectionText = selection.split("\n");
+
+                for (var i = 0, len = selectionText.length; i < len; i++) 
+                {
+                    selectionText[i] = (selectionText[i] === "") ? "" : "- " + selectionText[i];
+                }
+
+                cm.replaceSelection(selectionText.join("\n"));
+            }
+        },
+
+        "list-ol" : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if(selection === "") 
+            {
+                cm.replaceSelection("1. " + selection);
+            }
+            else
+            {
+                var selectionText = selection.split("\n");
+
+                for (var i = 0, len = selectionText.length; i < len; i++) 
+                {
+                    selectionText[i] = (selectionText[i] === "") ? "" : (i+1) + ". " + selectionText[i];
+                }
+
+                cm.replaceSelection(selectionText.join("\n"));
+            }
+        },
+
+        hr : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection(((cursor.ch !== 0) ? "\n\n" : "\n") + "------------\n\n");
+        },
+
+        tex : function() {
+            if (!this.settings.tex)
+            {
+                alert("settings.tex === false");
+                return this;
+            }
+            
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("$$" + selection + "$$");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+        },
+
+        link : function() {
+            this.executePlugin("linkDialog", "link-dialog/link-dialog");
+        },
+
+        "reference-link" : function() {
+            this.executePlugin("referenceLinkDialog", "reference-link-dialog/reference-link-dialog");
+        },
+
+        pagebreak : function() {
+            if (!this.settings.pageBreak)
+            {
+                alert("settings.pageBreak === false");
+                return this;
+            }
+            
+            var cm        = this.cm;
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("\r\n[========]\r\n");
+        },
+
+        image : function() {
+            this.executePlugin("imageDialog", "image-dialog/image-dialog");
+        },
+        
+        code : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("`" + selection + "`");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+
+        "code-block" : function() {
+            this.executePlugin("codeBlockDialog", "code-block-dialog/code-block-dialog");            
+        },
+
+        "preformatted-text" : function() {
+            this.executePlugin("preformattedTextDialog", "preformatted-text-dialog/preformatted-text-dialog");
+        },
+        
+        table : function() {
+            this.executePlugin("tableDialog", "table-dialog/table-dialog");         
+        },
+        
+        datetime : function() {
+            var cm        = this.cm;
+            var selection = cm.getSelection();
+            var date      = new Date();
+            var langName  = this.settings.lang.name;
+            var datefmt   = editormd.dateFormat() + " " + editormd.dateFormat((langName === "zh-cn" || langName === "zh-tw") ? "cn-week-day" : "week-day");
+
+            cm.replaceSelection(datefmt);
+        },
+        
+        emoji : function() {
+            this.executePlugin("emojiDialog", "emoji-dialog/emoji-dialog");
+        },
+                
+        "html-entities" : function() {
+            this.executePlugin("htmlEntitiesDialog", "html-entities-dialog/html-entities-dialog");
+        },
+                
+        "goto-line" : function() {
+            this.executePlugin("gotoLineDialog", "goto-line-dialog/goto-line-dialog");
+        },
+
+        watch : function() {    
+            this[this.settings.watch ? "unwatch" : "watch"]();
+        },
+
+        preview : function() {
+            this.previewing();
+        },
+
+        fullscreen : function() {
+            this.fullscreen();
+        },
+
+        clear : function() {
+            this.clear();
+        },
+        
+        search : function() {
+            this.search();
+        },
+
+        help : function() {
+            this.executePlugin("helpDialog", "help-dialog/help-dialog");
+        },
+
+        info : function() {
+            this.showInfoDialog();
+        }
+    };
+    
+    editormd.keyMaps = {
+        "Ctrl-1"       : "h1",
+        "Ctrl-2"       : "h2",
+        "Ctrl-3"       : "h3",
+        "Ctrl-4"       : "h4",
+        "Ctrl-5"       : "h5",
+        "Ctrl-6"       : "h6",
+        "Ctrl-B"       : "bold",  // if this is string ==  editormd.toolbarHandlers.xxxx
+        "Ctrl-D"       : "datetime",
+        
+        "Ctrl-E"       : function() { // emoji
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            if (!this.settings.emoji)
+            {
+                alert("Error: settings.emoji == false");
+                return ;
+            }
+
+            cm.replaceSelection(":" + selection + ":");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+        "Ctrl-Alt-G"   : "goto-line",
+        "Ctrl-H"       : "hr",
+        "Ctrl-I"       : "italic",
+        "Ctrl-K"       : "code",
+        
+        "Ctrl-L"        : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            var title = (selection === "") ? "" : " \""+selection+"\"";
+
+            cm.replaceSelection("[" + selection + "]("+title+")");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+        "Ctrl-U"         : "list-ul",
+        
+        "Shift-Ctrl-A"   : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            if (!this.settings.atLink)
+            {
+                alert("Error: settings.atLink == false");
+                return ;
+            }
+
+            cm.replaceSelection("@" + selection);
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+        
+        "Shift-Ctrl-C"     : "code",
+        "Shift-Ctrl-Q"     : "quote",
+        "Shift-Ctrl-S"     : "del",
+        "Shift-Ctrl-K"     : "tex",  // KaTeX
+        
+        "Shift-Alt-C"      : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            cm.replaceSelection(["```", selection, "```"].join("\n"));
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 3);
+            } 
+        },
+        
+        "Shift-Ctrl-Alt-C" : "code-block",
+        "Shift-Ctrl-H"     : "html-entities",
+        "Shift-Alt-H"      : "help",
+        "Shift-Ctrl-E"     : "emoji",
+        "Shift-Ctrl-U"     : "uppercase",
+        "Shift-Alt-U"      : "ucwords",
+        "Shift-Ctrl-Alt-U" : "ucfirst",
+        "Shift-Alt-L"      : "lowercase",
+        
+        "Shift-Ctrl-I"     : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            var title = (selection === "") ? "" : " \""+selection+"\"";
+
+            cm.replaceSelection("![" + selection + "]("+title+")");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 4);
+            }
+        },
+        
+        "Shift-Ctrl-Alt-I" : "image",
+        "Shift-Ctrl-L"     : "link",
+        "Shift-Ctrl-O"     : "list-ol",
+        "Shift-Ctrl-P"     : "preformatted-text",
+        "Shift-Ctrl-T"     : "table",
+        "Shift-Alt-P"      : "pagebreak",
+        "F9"               : "watch",
+        "F10"              : "preview",
+        "F11"              : "fullscreen",
+    };
+    
+    /**
+     * 清除字符串两边的空格
+     * Clear the space of strings both sides.
+     * 
+     * @param   {String}    str            string
+     * @returns {String}                   trimed string    
+     */
+    
+    var trim = function(str) {
+        return (!String.prototype.trim) ? str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, "") : str.trim();
+    };
+    
+    editormd.trim = trim;
+    
+    /**
+     * 所有单词首字母大写
+     * Words first to uppercase
+     * 
+     * @param   {String}    str            string
+     * @returns {String}                   string
+     */
+    
+    var ucwords = function (str) {
+        return str.toLowerCase().replace(/\b(\w)|\s(\w)/g, function($1) {  
+            return $1.toUpperCase();
+        });
+    };
+    
+    editormd.ucwords = editormd.wordsFirstUpperCase = ucwords;
+    
+    /**
+     * 字符串首字母大写
+     * Only string first char to uppercase
+     * 
+     * @param   {String}    str            string
+     * @returns {String}                   string
+     */
+    
+    var firstUpperCase = function(str) {        
+        return str.toLowerCase().replace(/\b(\w)/, function($1){
+            return $1.toUpperCase();
+        });
+    };
+    
+    var ucfirst = firstUpperCase;
+    
+    editormd.firstUpperCase = editormd.ucfirst = firstUpperCase;
+    
+    editormd.urls = {
+        atLinkBase : "https://github.com/"
+    };
+    
+    editormd.regexs = {
+        atLink        : /@(\w+)/g,
+        email         : /(\w+)@(\w+)\.(\w+)\.?(\w+)?/g,
+        emailLink     : /(mailto:)?([\w\.\_]+)@(\w+)\.(\w+)\.?(\w+)?/g,
+        emoji         : /:([\w\+-]+):/g,
+        emojiDatetime : /(\d{2}:\d{2}:\d{2})/g,
+        twemoji       : /:(tw-([\w]+)-?(\w+)?):/g,
+        fontAwesome   : /:(fa-([\w]+)(-(\w+)){0,}):/g,
+        editormdLogo  : /:(editormd-logo-?(\w+)?):/g,
+        pageBreak     : /^\[[=]{8,}\]$/
+    };
+
+    // Emoji graphics files url path
+    editormd.emoji     = {
+        path  : "http://www.emoji-cheat-sheet.com/graphics/emojis/",
+        ext   : ".png"
+    };
+
+    // Twitter Emoji (Twemoji)  graphics files url path    
+    editormd.twemoji = {
+        path : "http://twemoji.maxcdn.com/36x36/",
+        ext  : ".png"
+    };
+
+    /**
+     * 自定义marked的解析器
+     * Custom Marked renderer rules
+     * 
+     * @param   {Array}    markdownToC     传入用于接收TOC的数组
+     * @returns {Renderer} markedRenderer  返回marked的Renderer自定义对象
+     */
+
+    editormd.markedRenderer = function(markdownToC, options) {
+        var defaults = {
+            toc                  : true,           // Table of contents
+            tocm                 : false,
+            tocStartLevel        : 1,              // Said from H1 to create ToC  
+            pageBreak            : true,
+            atLink               : true,           // for @link
+            emailLink            : true,           // for mail address auto link
+            taskList             : false,          // Enable Github Flavored Markdown task lists
+            emoji                : false,          // :emoji: , Support Twemoji, fontAwesome, Editor.md logo emojis.
+            tex                  : false,          // TeX(LaTeX), based on KaTeX
+            flowChart            : false,          // flowChart.js only support IE9+
+            sequenceDiagram      : false,          // sequenceDiagram.js only support IE9+
+        };
+        
+        var settings        = $.extend(defaults, options || {});    
+        var marked          = editormd.$marked;
+        var markedRenderer  = new marked.Renderer();
+        markdownToC         = markdownToC || [];        
+            
+        var regexs          = editormd.regexs;
+        var atLinkReg       = regexs.atLink;
+        var emojiReg        = regexs.emoji;
+        var emailReg        = regexs.email;
+        var emailLinkReg    = regexs.emailLink;
+        var twemojiReg      = regexs.twemoji;
+        var faIconReg       = regexs.fontAwesome;
+        var editormdLogoReg = regexs.editormdLogo;
+        var pageBreakReg    = regexs.pageBreak;
+
+        markedRenderer.emoji = function(text) {
+            
+            text = text.replace(editormd.regexs.emojiDatetime, function($1) {           
+                return $1.replace(/:/g, "&#58;");
+            });
+            
+            var matchs = text.match(emojiReg);
+
+            if (!matchs || !settings.emoji) {
+                return text;
+            }
+
+            for (var i = 0, len = matchs.length; i < len; i++)
+            {            
+                if (matchs[i] === ":+1:") {
+                    matchs[i] = ":\\+1:";
+                }
+
+                text = text.replace(new RegExp(matchs[i]), function($1, $2){
+                    var faMatchs = $1.match(faIconReg);
+                    var name     = $1.replace(/:/g, "");
+
+                    if (faMatchs)
+                    {                        
+                        for (var fa = 0, len1 = faMatchs.length; fa < len1; fa++)
+                        {
+                            var faName = faMatchs[fa].replace(/:/g, "");
+                            
+                            return "<i class=\"fa " + faName + " fa-emoji\" title=\"" + faName.replace("fa-", "") + "\"></i>";
+                        }
+                    }
+                    else
+                    {
+                        var emdlogoMathcs = $1.match(editormdLogoReg);
+                        var twemojiMatchs = $1.match(twemojiReg);
+
+                        if (emdlogoMathcs)                                        
+                        {                            
+                            for (var x = 0, len2 = emdlogoMathcs.length; x < len2; x++)
+                            {
+                                var logoName = emdlogoMathcs[x].replace(/:/g, "");
+                                return "<i class=\"" + logoName + "\" title=\"Editor.md logo (" + logoName + ")\"></i>";
+                            }
+                        }
+                        else if (twemojiMatchs) 
+                        {
+                            for (var t = 0, len3 = twemojiMatchs.length; t < len3; t++)
+                            {
+                                var twe = twemojiMatchs[t].replace(/:/g, "").replace("tw-", "");
+                                return "<img src=\"" + editormd.twemoji.path + twe + editormd.twemoji.ext + "\" title=\"twemoji-" + twe + "\" alt=\"twemoji-" + twe + "\" class=\"emoji twemoji\" />";
+                            }
+                        }
+                        else
+                        {
+                            var src = (name === "+1") ? "plus1" : name;
+                            src     = (src === "black_large_square") ? "black_square" : src;
+                            src     = (src === "moon") ? "waxing_gibbous_moon" : src;
+
+                            return "<img src=\"" + editormd.emoji.path + src + editormd.emoji.ext + "\" class=\"emoji\" title=\"&#58;" + name + "&#58;\" alt=\"&#58;" + name + "&#58;\" />";
+                        }
+                    }
+                });
+            }
+
+            return text;
+        };
+
+        markedRenderer.atLink = function(text) {
+
+            if (atLinkReg.test(text))
+            { 
+                if (settings.atLink) 
+                {
+                    text = text.replace(emailReg, function($1, $2, $3, $4) {
+                        return $1.replace(/@/g, "_#_&#64;_#_");
+                    });
+
+                    text = text.replace(atLinkReg, function($1, $2) {
+                        return "<a href=\"" + editormd.urls.atLinkBase + "" + $2 + "\" title=\"&#64;" + $2 + "\" class=\"at-link\">" + $1 + "</a>";
+                    }).replace(/_#_&#64;_#_/g, "@");
+                }
+                
+                if (settings.emailLink)
+                {
+                    text = text.replace(emailLinkReg, function($1, $2, $3, $4, $5) {
+                        return (!$2 && $.inArray($5, "jpg|jpeg|png|gif|webp|ico|icon|pdf".split("|")) < 0) ? "<a href=\"mailto:" + $1 + "\">"+$1+"</a>" : $1;
+                    });
+                }
+
+                return text;
+            }
+
+            return text;
+        };
+                
+        markedRenderer.link = function (href, title, text) {
+
+            if (this.options.sanitize) {
+                try {
+                    var prot = decodeURIComponent(unescape(href)).replace(/[^\w:]/g,"").toLowerCase();
+                } catch(e) {
+                    return "";
+                }
+
+                if (prot.indexOf("javascript:") === 0) {
+                    return "";
+                }
+            }
+
+            var out = "<a href=\"" + href + "\"";
+            
+            if (atLinkReg.test(title) || atLinkReg.test(text))
+            {
+                if (title)
+                {
+                    out += " title=\"" + title.replace(/@/g, "&#64;");
+                }
+                
+                return out + "\">" + text.replace(/@/g, "&#64;") + "</a>";
+            }
+
+            if (title) {
+                out += " title=\"" + title + "\"";
+            }
+
+            out += ">" + text + "</a>";
+
+            return out;
+        };
+        
+        markedRenderer.heading = function(text, level, raw) {
+                    
+            var linkText       = text;
+            var hasLinkReg     = /\s*\<a\s*href\=\"(.*)\"\s*([^\>]*)\>(.*)\<\/a\>\s*/;
+            var getLinkTextReg = /\s*\<a\s*([^\>]+)\>([^\>]*)\<\/a\>\s*/g;
+
+            if (hasLinkReg.test(text)) 
+            {
+                var tempText = [];
+                text         = text.split(/\<a\s*([^\>]+)\>([^\>]*)\<\/a\>/);
+
+                for (var i = 0, len = text.length; i < len; i++)
+                {
+                    tempText.push(text[i].replace(/\s*href\=\"(.*)\"\s*/g, ""));
+                }
+
+                text = tempText.join(" ");
+            }
+            
+            text = trim(text);
+            
+            var escapedText    = text.toLowerCase().replace(/[^\w]+/g, "-");
+            var toc = {
+                text  : text,
+                level : level,
+                slug  : escapedText
+            };
+            
+            var isChinese = /^[\u4e00-\u9fa5]+$/.test(text);
+            var id        = (isChinese) ? escape(text).replace(/\%/g, "") : text.toLowerCase().replace(/[^\w]+/g, "-");
+
+            markdownToC.push(toc);
+            
+            var headingHTML = "<h" + level + " id=\"h"+ level + "-" + this.options.headerPrefix + id +"\">";
+            
+            headingHTML    += "<a name=\"" + text + "\" class=\"reference-link\"></a>";
+            headingHTML    += "<span class=\"header-link octicon octicon-link\"></span>";
+            headingHTML    += (hasLinkReg) ? this.atLink(this.emoji(linkText)) : this.atLink(this.emoji(text));
+            headingHTML    += "</h" + level + ">";
+
+            return headingHTML;
+        };
+        
+        markedRenderer.pageBreak = function(text) {
+            if (pageBreakReg.test(text) && settings.pageBreak)
+            {
+                text = "<hr style=\"page-break-after:always;\" class=\"page-break editormd-page-break\" />";
+            }
+            
+            return text;
+        };
+
+        markedRenderer.paragraph = function(text) {
+            var isTeXInline     = /\$\$(.*)\$\$/g.test(text);
+            var isTeXLine       = /^\$\$(.*)\$\$$/.test(text);
+            var isTeXAddClass   = (isTeXLine)     ? " class=\"" + editormd.classNames.tex + "\"" : "";
+            var isToC           = (settings.tocm) ? /^(\[TOC\]|\[TOCM\])$/.test(text) : /^\[TOC\]$/.test(text);
+            var isToCMenu       = /^\[TOCM\]$/.test(text);
+            
+            if (!isTeXLine && isTeXInline) 
+            {
+                text = text.replace(/(\$\$([^\$]*)\$\$)+/g, function($1, $2) {
+                    return "<span class=\"" + editormd.classNames.tex + "\">" + $2.replace(/\$/g, "") + "</span>";
+                });
+            } 
+            else 
+            {
+                text = (isTeXLine) ? text.replace(/\$/g, "") : text;
+            }
+            
+            var tocHTML = "<div class=\"markdown-toc editormd-markdown-toc\">" + text + "</div>";
+            
+            return (isToC) ? ( (isToCMenu) ? "<div class=\"editormd-toc-menu\">" + tocHTML + "</div><br/>" : tocHTML )
+                           : ( (pageBreakReg.test(text)) ? this.pageBreak(text) : "<p" + isTeXAddClass + ">" + this.atLink(this.emoji(text)) + "</p>\n" );
+        };
+
+        markedRenderer.code = function (code, lang, escaped) { 
+
+            if (lang === "seq" || lang === "sequence")
+            {
+                return "<div class=\"sequence-diagram\">" + code + "</div>";
+            } 
+            else if ( lang === "flow")
+            {
+                return "<div class=\"flowchart\">" + code + "</div>";
+            } 
+            else if ( lang === "math" || lang === "latex" || lang === "katex")
+            {
+                return "<p class=\"" + editormd.classNames.tex + "\">" + code + "</p>";
+            } 
+            else 
+            {
+
+                return marked.Renderer.prototype.code.apply(this, arguments);
+            }
+        };
+
+        markedRenderer.tablecell = function(content, flags) {
+            var type = (flags.header) ? "th" : "td";
+            var tag  = (flags.align)  ? "<" + type +" style=\"text-align:" + flags.align + "\">" : "<" + type + ">";
+            
+            return tag + this.atLink(this.emoji(content)) + "</" + type + ">\n";
+        };
+
+        markedRenderer.listitem = function(text) {
+            if (settings.taskList && /^\s*\[[x\s]\]\s*/.test(text)) 
+            {
+                text = text.replace(/^\s*\[\s\]\s*/, "<input type=\"checkbox\" class=\"task-list-item-checkbox\" /> ")
+                           .replace(/^\s*\[x\]\s*/,  "<input type=\"checkbox\" class=\"task-list-item-checkbox\" checked disabled /> ");
+
+                return "<li style=\"list-style: none;\">" + this.atLink(this.emoji(text)) + "</li>";
+            }
+            else 
+            {
+                return "<li>" + this.atLink(this.emoji(text)) + "</li>";
+            }
+        };
+        
+        return markedRenderer;
+    };
+    
+    /**
+     *
+     * 生成TOC(Table of Contents)
+     * Creating ToC (Table of Contents)
+     * 
+     * @param   {Array}    toc             从marked获取的TOC数组列表
+     * @param   {Element}  container       插入TOC的容器元素
+     * @param   {Integer}  startLevel      Hx 起始层级
+     * @returns {Object}   tocContainer    返回ToC列表容器层的jQuery对象元素
+     */
+    
+    editormd.markdownToCRenderer = function(toc, container, tocDropdown, startLevel) {
+        
+        var html        = "";    
+        var lastLevel   = 0;
+        var classPrefix = this.classPrefix;
+        
+        startLevel      = startLevel  || 1;
+        
+        for (var i = 0, len = toc.length; i < len; i++) 
+        {
+            var text  = toc[i].text;
+            var level = toc[i].level;
+            
+            if (level < startLevel) {
+                continue;
+            }
+            
+            if (level > lastLevel) 
+            {
+                html += "";
+            }
+            else if (level < lastLevel) 
+            {
+                html += (new Array(lastLevel - level + 2)).join("</ul></li>");
+            } 
+            else 
+            {
+                html += "</ul></li>";
+            }
+
+            html += "<li><a class=\"toc-level-" + level + "\" href=\"#" + text + "\" level=\"" + level + "\">" + text + "</a><ul>";
+            lastLevel = level;
+        }
+        
+        var tocContainer = container.find(".markdown-toc");
+        
+        if ((tocContainer.length < 1 && container.attr("previewContainer") === "false"))
+        {
+            var tocHTML = "<div class=\"markdown-toc " + classPrefix + "markdown-toc\"></div>";
+            
+            tocHTML = (tocDropdown) ? "<div class=\"" + classPrefix + "toc-menu\">" + tocHTML + "</div>" : tocHTML;
+            
+            container.html(tocHTML);
+            
+            tocContainer = container.find(".markdown-toc");
+        }
+        
+        if (tocDropdown)
+        {
+            tocContainer.wrap("<div class=\"" + classPrefix + "toc-menu\"></div><br/>");
+        }
+        
+        tocContainer.html("<ul class=\"markdown-toc-list\"></ul>").children(".markdown-toc-list").html(html.replace(/\r?\n?\<ul\>\<\/ul\>/g, ""));
+        
+        return tocContainer;
+    };
+    
+    /**
+     *
+     * 生成TOC下拉菜单
+     * Creating ToC dropdown menu
+     * 
+     * @param   {Object}   container       插入TOC的容器jQuery对象元素
+     * @param   {String}   tocTitle        ToC title
+     * @returns {Object}                   return toc-menu object
+     */
+    
+    editormd.tocDropdownMenu = function(container, tocTitle) {
+        
+        tocTitle      = tocTitle || "Table of Contents";
+        
+        var zindex    = 400;
+        var tocMenus  = container.find("." + this.classPrefix + "toc-menu");
+
+        tocMenus.each(function() {
+            var $this  = $(this);
+            var toc    = $this.children(".markdown-toc");
+            var icon   = "<i class=\"fa fa-angle-down\"></i>";
+            var btn    = "<a href=\"javascript:;\" class=\"toc-menu-btn\">" + icon + tocTitle + "</a>";
+            var menu   = toc.children("ul");            
+            var list   = menu.find("li");
+            
+            toc.append(btn);
+            
+            list.first().before("<li><h1>" + tocTitle + " " + icon + "</h1></li>");
+            
+            $this.mouseover(function(){
+                menu.show();
+
+                list.each(function(){
+                    var li = $(this);
+                    var ul = li.children("ul");
+
+                    if (ul.html() === "")
+                    {
+                        ul.remove();
+                    }
+
+                    if (ul.length > 0 && ul.html() !== "")
+                    {
+                        var firstA = li.children("a").first();
+
+                        if (firstA.children(".fa").length < 1)
+                        {
+                            firstA.append( $(icon).css({ float:"right", paddingTop:"4px" }) );
+                        }
+                    }
+
+                    li.mouseover(function(){
+                        ul.css("z-index", zindex).show();
+                        zindex += 1;
+                    }).mouseleave(function(){
+                        ul.hide();
+                    });
+                });
+            }).mouseleave(function(){
+                menu.hide();
+            }); 
+        });       
+        
+        return tocMenus;
+    };
+    
+    /**
+     * 简单地过滤指定的HTML标签
+     * Filter custom html tags
+     * 
+     * @param   {String}   html          要过滤HTML
+     * @param   {String}   filters       要过滤的标签
+     * @returns {String}   html          返回过滤的HTML
+     */
+    
+    editormd.filterHTMLTags = function(html, filters) {
+        
+        if (typeof html !== "string") {
+            html = new String(html);
+        }
+            
+        if (typeof filters !== "string") {
+            return html;
+        }
+
+        var expression = filters.split("|");
+        var filterTags = expression[0].split(",");
+        var attrs      = expression[1];
+
+        for (var i = 0, len = filterTags.length; i < len; i++)
+        {
+            var tag = filterTags[i];
+
+            html = html.replace(new RegExp("\<\s*" + tag + "\s*([^\>]*)\>([^\>]*)\<\s*\/" + tag + "\s*\>", "igm"), "");
+        }
+        
+        //return html;
+
+        if (typeof attrs !== "undefined")
+        {
+            var htmlTagRegex = /\<(\w+)\s*([^\>]*)\>([^\>]*)\<\/(\w+)\>/ig;
+
+            if (attrs === "*")
+            {
+                html = html.replace(htmlTagRegex, function($1, $2, $3, $4, $5) {
+                    return "<" + $2 + ">" + $4 + "</" + $5 + ">";
+                });         
+            }
+            else if (attrs === "on*")
+            {
+                html = html.replace(htmlTagRegex, function($1, $2, $3, $4, $5) {
+                    var el = $("<" + $2 + ">" + $4 + "</" + $5 + ">");
+                    var _attrs = $($1)[0].attributes;
+                    var $attrs = {};
+                    
+                    $.each(_attrs, function(i, e) {
+                        if (e.nodeName !== '"') $attrs[e.nodeName] = e.nodeValue;
+                    });
+                    
+                    $.each($attrs, function(i) {                        
+                        if (i.indexOf("on") === 0) {
+                            delete $attrs[i];
+                        }
+                    });
+                    
+                    el.attr($attrs);
+                    
+                    var text = (typeof el[1] !== "undefined") ? $(el[1]).text() : "";
+
+                    return el[0].outerHTML + text;
+                });
+            }
+            else
+            {
+                html = html.replace(htmlTagRegex, function($1, $2, $3, $4) {
+                    var filterAttrs = attrs.split(",");
+                    var el = $($1);
+                    el.html($4);
+
+                    $.each(filterAttrs, function(i) {
+                        el.attr(filterAttrs[i], null);
+                    });
+
+                    return el[0].outerHTML;
+                });
+            }
+        }
+        
+        return html;
+    };
+    
+    /**
+     * 将Markdown文档解析为HTML用于前台显示
+     * Parse Markdown to HTML for Font-end preview.
+     * 
+     * @param   {String}   id            用于显示HTML的对象ID
+     * @param   {Object}   [options={}]  配置选项，可选
+     * @returns {Object}   div           返回jQuery对象元素
+     */
+    
+    editormd.markdownToHTML = function(id, options) {
+        var defaults = {
+            gfm                  : true,
+            toc                  : true,
+            tocm                 : false,
+            tocStartLevel        : 1,
+            tocTitle             : "目录",
+            tocDropdown          : false,
+            tocContainer         : "",
+            markdown             : "",
+            markdownSourceCode   : false,
+            htmlDecode           : false,
+            autoLoadKaTeX        : true,
+            pageBreak            : true,
+            atLink               : true,    // for @link
+            emailLink            : true,    // for mail address auto link
+            tex                  : false,
+            taskList             : false,   // Github Flavored Markdown task lists
+            emoji                : false,
+            flowChart            : false,
+            sequenceDiagram      : false,
+            previewCodeHighlight : true
+        };
+        
+        editormd.$marked  = marked;
+
+        var div           = $("#" + id);
+        var settings      = div.settings = $.extend(true, defaults, options || {});
+        var saveTo        = div.find("textarea");
+        
+        if (saveTo.length < 1)
+        {
+            div.append("<textarea></textarea>");
+            saveTo        = div.find("textarea");
+        }        
+        
+        var markdownDoc   = (settings.markdown === "") ? saveTo.val() : settings.markdown; 
+        var markdownToC   = [];
+
+        var rendererOptions = {  
+            toc                  : settings.toc,
+            tocm                 : settings.tocm,
+            tocStartLevel        : settings.tocStartLevel,
+            taskList             : settings.taskList,
+            emoji                : settings.emoji,
+            tex                  : settings.tex,
+            pageBreak            : settings.pageBreak,
+            atLink               : settings.atLink,           // for @link
+            emailLink            : settings.emailLink,        // for mail address auto link
+            flowChart            : settings.flowChart,
+            sequenceDiagram      : settings.sequenceDiagram,
+            previewCodeHighlight : settings.previewCodeHighlight,
+        };
+
+        var markedOptions = {
+            renderer    : editormd.markedRenderer(markdownToC, rendererOptions),
+            gfm         : settings.gfm,
+            tables      : true,
+            breaks      : true,
+            pedantic    : false,
+            sanitize    : (settings.htmlDecode) ? false : true, // 是否忽略HTML标签，即是否开启HTML标签解析，为了安全性，默认不开启
+            smartLists  : true,
+            smartypants : true
+        };
+        
+		markdownDoc = new String(markdownDoc);
+        
+        var markdownParsed = marked(markdownDoc, markedOptions);
+        
+        markdownParsed = editormd.filterHTMLTags(markdownParsed, settings.htmlDecode);
+        
+        if (settings.markdownSourceCode) {
+            saveTo.text(markdownDoc);
+        } else {
+            saveTo.remove();
+        }
+        
+        div.addClass("markdown-body " + this.classPrefix + "html-preview").append(markdownParsed);
+        
+        var tocContainer = (settings.tocContainer !== "") ? $(settings.tocContainer) : div;
+        
+        if (settings.tocContainer !== "")
+        {
+            tocContainer.attr("previewContainer", false);
+        }
+         
+        if (settings.toc) 
+        {
+            div.tocContainer = this.markdownToCRenderer(markdownToC, tocContainer, settings.tocDropdown, settings.tocStartLevel);
+            
+            if (settings.tocDropdown || div.find("." + this.classPrefix + "toc-menu").length > 0)
+            {
+                this.tocDropdownMenu(div, settings.tocTitle);
+            }
+            
+            if (settings.tocContainer !== "")
+            {
+                div.find(".editormd-toc-menu, .editormd-markdown-toc").remove();
+            }
+        }
+            
+        if (settings.previewCodeHighlight) 
+        {
+            div.find("pre").addClass("prettyprint linenums");
+            prettyPrint();
+        }
+        
+        if (!editormd.isIE8) 
+        {
+            if (settings.flowChart) {
+                div.find(".flowchart").flowChart(); 
+            }
+
+            if (settings.sequenceDiagram) {
+                div.find(".sequence-diagram").sequenceDiagram({theme: "simple"});
+            }
+        }
+
+        if (settings.tex)
+        {
+            var katexHandle = function() {
+                div.find("." + editormd.classNames.tex).each(function(){
+                    var tex  = $(this);                    
+                    katex.render(tex.html().replace(/&lt;/g, "<").replace(/&gt;/g, ">"), tex[0]);                    
+                    tex.find(".katex").css("font-size", "1.6em");
+                });
+            };
+            
+            if (settings.autoLoadKaTeX && !editormd.$katex && !editormd.kaTeXLoaded)
+            {
+                this.loadKaTeX(function() {
+                    editormd.$katex      = katex;
+                    editormd.kaTeXLoaded = true;
+                    katexHandle();
+                });
+            }
+            else
+            {
+                katexHandle();
+            }
+        }
+        
+        div.getMarkdown = function() {            
+            return saveTo.val();
+        };
+        
+        return div;
+    };
+    
+    // Editor.md themes, change toolbar themes etc.
+    // added @1.5.0
+    editormd.themes        = ["default", "dark"];
+    
+    // Preview area themes
+    // added @1.5.0
+    editormd.previewThemes = ["default", "dark"];
+    
+    // CodeMirror / editor area themes
+    // @1.5.0 rename -> editorThemes, old version -> themes
+    editormd.editorThemes = [
+        "default", "3024-day", "3024-night",
+        "ambiance", "ambiance-mobile",
+        "base16-dark", "base16-light", "blackboard",
+        "cobalt",
+        "eclipse", "elegant", "erlang-dark",
+        "lesser-dark",
+        "mbo", "mdn-like", "midnight", "monokai",
+        "neat", "neo", "night",
+        "paraiso-dark", "paraiso-light", "pastel-on-dark",
+        "rubyblue",
+        "solarized",
+        "the-matrix", "tomorrow-night-eighties", "twilight",
+        "vibrant-ink",
+        "xq-dark", "xq-light"
+    ];
+
+    editormd.loadPlugins = {};
+    
+    editormd.loadFiles = {
+        js     : [],
+        css    : [],
+        plugin : []
+    };
+    
+    /**
+     * 动态加载Editor.md插件，但不立即执行
+     * Load editor.md plugins
+     * 
+     * @param {String}   fileName              插件文件路径
+     * @param {Function} [callback=function()] 加载成功后执行的回调函数
+     * @param {String}   [into="head"]         嵌入页面的位置
+     */
+    
+    editormd.loadPlugin = function(fileName, callback, into) {
+        callback   = callback || function() {};
+        
+        this.loadScript(fileName, function() {
+            editormd.loadFiles.plugin.push(fileName);
+            callback();
+        }, into);
+    };
+    
+    /**
+     * 动态加载CSS文件的方法
+     * Load css file method
+     * 
+     * @param {String}   fileName              CSS文件名
+     * @param {Function} [callback=function()] 加载成功后执行的回调函数
+     * @param {String}   [into="head"]         嵌入页面的位置
+     */
+    
+    editormd.loadCSS   = function(fileName, callback, into) {
+        into       = into     || "head";        
+        callback   = callback || function() {};
+        
+        var css    = document.createElement("link");
+        css.type   = "text/css";
+        css.rel    = "stylesheet";
+        css.onload = css.onreadystatechange = function() {
+            editormd.loadFiles.css.push(fileName);
+            callback();
+        };
+
+        css.href   = fileName + ".css";
+
+        if(into === "head") {
+            document.getElementsByTagName("head")[0].appendChild(css);
+        } else {
+            document.body.appendChild(css);
+        }
+    };
+    
+    editormd.isIE    = (navigator.appName == "Microsoft Internet Explorer");
+    editormd.isIE8   = (editormd.isIE && navigator.appVersion.match(/8./i) == "8.");
+
+    /**
+     * 动态加载JS文件的方法
+     * Load javascript file method
+     * 
+     * @param {String}   fileName              JS文件名
+     * @param {Function} [callback=function()] 加载成功后执行的回调函数
+     * @param {String}   [into="head"]         嵌入页面的位置
+     */
+
+    editormd.loadScript = function(fileName, callback, into) {
+        
+        into          = into     || "head";
+        callback      = callback || function() {};
+        
+        var script    = null; 
+        script        = document.createElement("script");
+        script.id     = fileName.replace(/[\./]+/g, "-");
+        script.type   = "text/javascript";        
+        script.src    = fileName + ".js";
+        
+        if (editormd.isIE8) 
+        {            
+            script.onreadystatechange = function() {
+                if(script.readyState) 
+                {
+                    if (script.readyState === "loaded" || script.readyState === "complete") 
+                    {
+                        script.onreadystatechange = null; 
+                        editormd.loadFiles.js.push(fileName);
+                        callback();
+                    }
+                } 
+            };
+        }
+        else
+        {
+            script.onload = function() {
+                editormd.loadFiles.js.push(fileName);
+                callback();
+            };
+        }
+
+        if (into === "head") {
+            document.getElementsByTagName("head")[0].appendChild(script);
+        } else {
+            document.body.appendChild(script);
+        }
+    };
+    
+    // 使用国外的CDN，加载速度有时会很慢，或者自定义URL
+    // You can custom KaTeX load url.
+    editormd.katexURL  = {
+        css : "//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.3.0/katex.min",
+        js  : "//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.3.0/katex.min"
+    };
+    
+    editormd.kaTeXLoaded = false;
+    
+    /**
+     * 加载KaTeX文件
+     * load KaTeX files
+     * 
+     * @param {Function} [callback=function()]  加载成功后执行的回调函数
+     */
+    
+    editormd.loadKaTeX = function (callback) {
+        editormd.loadCSS(editormd.katexURL.css, function(){
+            editormd.loadScript(editormd.katexURL.js, callback || function(){});
+        });
+    };
+        
+    /**
+     * 锁屏
+     * lock screen
+     * 
+     * @param   {Boolean}   lock   Boolean 布尔值，是否锁屏
+     * @returns {void}
+     */
+    
+    editormd.lockScreen = function(lock) {
+        $("html,body").css("overflow", (lock) ? "hidden" : "");
+    };
+        
+    /**
+     * 动态创建对话框
+     * Creating custom dialogs
+     * 
+     * @param   {Object} options 配置项键值对 Key/Value
+     * @returns {dialog} 返回创建的dialog的jQuery实例对象
+     */
+
+    editormd.createDialog = function(options) {
+        var defaults = {
+            name : "",
+            width : 420,
+            height: 240,
+            title : "",
+            drag  : true,
+            closed : true,
+            content : "",
+            mask : true,
+            maskStyle : {
+                backgroundColor : "#fff",
+                opacity : 0.1
+            },
+            lockScreen : true,
+            footer : true,
+            buttons : false
+        };
+
+        options          = $.extend(true, defaults, options);
+        
+        var $this        = this;
+        var editor       = this.editor;
+        var classPrefix  = editormd.classPrefix;
+        var guid         = (new Date()).getTime();
+        var dialogName   = ( (options.name === "") ? classPrefix + "dialog-" + guid : options.name);
+        var mouseOrTouch = editormd.mouseOrTouch;
+
+        var html         = "<div class=\"" + classPrefix + "dialog " + dialogName + "\">";
+
+        if (options.title !== "")
+        {
+            html += "<div class=\"" + classPrefix + "dialog-header\"" + ( (options.drag) ? " style=\"cursor: move;\"" : "" ) + ">";
+            html += "<strong class=\"" + classPrefix + "dialog-title\">" + options.title + "</strong>";
+            html += "</div>";
+        }
+
+        if (options.closed)
+        {
+            html += "<a href=\"javascript:;\" class=\"fa fa-close " + classPrefix + "dialog-close\"></a>";
+        }
+
+        html += "<div class=\"" + classPrefix + "dialog-container\">" + options.content;                    
+
+        if (options.footer || typeof options.footer === "string") 
+        {
+            html += "<div class=\"" + classPrefix + "dialog-footer\">" + ( (typeof options.footer === "boolean") ? "" : options.footer) + "</div>";
+        }
+
+        html += "</div>";
+
+        html += "<div class=\"" + classPrefix + "dialog-mask " + classPrefix + "dialog-mask-bg\"></div>";
+        html += "<div class=\"" + classPrefix + "dialog-mask " + classPrefix + "dialog-mask-con\"></div>";
+        html += "</div>";
+
+        editor.append(html);
+
+        var dialog = editor.find("." + dialogName);
+
+        dialog.lockScreen = function(lock) {
+            if (options.lockScreen)
+            {                
+                $("html,body").css("overflow", (lock) ? "hidden" : "");
+                $this.resize();
+            }
+
+            return dialog;
+        };
+
+        dialog.showMask = function() {
+            if (options.mask)
+            {
+                editor.find("." + classPrefix + "mask").css(options.maskStyle).css("z-index", editormd.dialogZindex - 1).show();
+            }
+            return dialog;
+        };
+
+        dialog.hideMask = function() {
+            if (options.mask)
+            {
+                editor.find("." + classPrefix + "mask").hide();
+            }
+
+            return dialog;
+        };
+
+        dialog.loading = function(show) {                        
+            var loading = dialog.find("." + classPrefix + "dialog-mask");
+            loading[(show) ? "show" : "hide"]();
+
+            return dialog;
+        };
+
+        dialog.lockScreen(true).showMask();
+
+        dialog.show().css({
+            zIndex : editormd.dialogZindex,
+            border : (editormd.isIE8) ? "1px solid #ddd" : "",
+            width  : (typeof options.width  === "number") ? options.width + "px"  : options.width,
+            height : (typeof options.height === "number") ? options.height + "px" : options.height
+        });
+
+        var dialogPosition = function(){
+            dialog.css({
+                top    : ($(window).height() - dialog.height()) / 2 + "px",
+                left   : ($(window).width() - dialog.width()) / 2 + "px"
+            });
+        };
+
+        dialogPosition();
+
+        $(window).resize(dialogPosition);
+
+        dialog.children("." + classPrefix + "dialog-close").bind(mouseOrTouch("click", "touchend"), function() {
+            dialog.hide().lockScreen(false).hideMask();
+        });
+
+        if (typeof options.buttons === "object")
+        {
+            var footer = dialog.footer = dialog.find("." + classPrefix + "dialog-footer");
+
+            for (var key in options.buttons)
+            {
+                var btn = options.buttons[key];
+                var btnClassName = classPrefix + key + "-btn";
+
+                footer.append("<button class=\"" + classPrefix + "btn " + btnClassName + "\">" + btn[0] + "</button>");
+                btn[1] = $.proxy(btn[1], dialog);
+                footer.children("." + btnClassName).bind(mouseOrTouch("click", "touchend"), btn[1]);
+            }
+        }
+
+        if (options.title !== "" && options.drag)
+        {                        
+            var posX, posY;
+            var dialogHeader = dialog.children("." + classPrefix + "dialog-header");
+
+            if (!options.mask) {
+                dialogHeader.bind(mouseOrTouch("click", "touchend"), function(){
+                    editormd.dialogZindex += 2;
+                    dialog.css("z-index", editormd.dialogZindex);
+                });
+            }
+
+            dialogHeader.mousedown(function(e) {
+                e = e || window.event;  //IE
+                posX = e.clientX - parseInt(dialog[0].style.left);
+                posY = e.clientY - parseInt(dialog[0].style.top);
+
+                document.onmousemove = moveAction;                   
+            });
+
+            var userCanSelect = function (obj) {
+                obj.removeClass(classPrefix + "user-unselect").off("selectstart");
+            };
+
+            var userUnselect = function (obj) {
+                obj.addClass(classPrefix + "user-unselect").on("selectstart", function(event) { // selectstart for IE                        
+                    return false;
+                });
+            };
+
+            var moveAction = function (e) {
+                e = e || window.event;  //IE
+
+                var left, top, nowLeft = parseInt(dialog[0].style.left), nowTop = parseInt(dialog[0].style.top);
+
+                if( nowLeft >= 0 ) {
+                    if( nowLeft + dialog.width() <= $(window).width()) {
+                        left = e.clientX - posX;
+                    } else {	
+                        left = $(window).width() - dialog.width();
+                        document.onmousemove = null;
+                    }
+                } else {
+                    left = 0;
+                    document.onmousemove = null;
+                }
+
+                if( nowTop >= 0 ) {
+                    top = e.clientY - posY;
+                } else {
+                    top = 0;
+                    document.onmousemove = null;
+                }
+
+
+                document.onselectstart = function() {
+                    return false;
+                };
+
+                userUnselect($("body"));
+                userUnselect(dialog);
+                dialog[0].style.left = left + "px";
+                dialog[0].style.top  = top + "px";
+            };
+
+            document.onmouseup = function() {                            
+                userCanSelect($("body"));
+                userCanSelect(dialog);
+
+                document.onselectstart = null;         
+                document.onmousemove = null;
+            };
+
+            dialogHeader.touchDraggable = function() {
+                var offset = null;
+                var start  = function(e) {
+                    var orig = e.originalEvent; 
+                    var pos  = $(this).parent().position();
+
+                    offset = {
+                        x : orig.changedTouches[0].pageX - pos.left,
+                        y : orig.changedTouches[0].pageY - pos.top
+                    };
+                };
+
+                var move = function(e) {
+                    e.preventDefault();
+                    var orig = e.originalEvent;
+
+                    $(this).parent().css({
+                        top  : orig.changedTouches[0].pageY - offset.y,
+                        left : orig.changedTouches[0].pageX - offset.x
+                    });
+                };
+
+                this.bind("touchstart", start).bind("touchmove", move);
+            };
+
+            dialogHeader.touchDraggable();
+        }
+
+        editormd.dialogZindex += 2;
+
+        return dialog;
+    };
+    
+    /**
+     * 鼠标和触摸事件的判断/选择方法
+     * MouseEvent or TouchEvent type switch
+     * 
+     * @param   {String} [mouseEventType="click"]    供选择的鼠标事件
+     * @param   {String} [touchEventType="touchend"] 供选择的触摸事件
+     * @returns {String} EventType                   返回事件类型名称
+     */
+    
+    editormd.mouseOrTouch = function(mouseEventType, touchEventType) {
+        mouseEventType = mouseEventType || "click";
+        touchEventType = touchEventType || "touchend";
+        
+        var eventType  = mouseEventType;
+
+        try {
+            document.createEvent("TouchEvent");
+            eventType = touchEventType;
+        } catch(e) {}
+
+        return eventType;
+    };
+    
+    /**
+     * 日期时间的格式化方法
+     * Datetime format method
+     * 
+     * @param   {String}   [format=""]  日期时间的格式，类似PHP的格式
+     * @returns {String}   datefmt      返回格式化后的日期时间字符串
+     */
+    
+    editormd.dateFormat = function(format) {                
+        format      = format || "";
+
+        var addZero = function(d) {
+            return (d < 10) ? "0" + d : d;
+        };
+
+        var date    = new Date(); 
+        var year    = date.getFullYear();
+        var year2   = year.toString().slice(2, 4);
+        var month   = addZero(date.getMonth() + 1);
+        var day     = addZero(date.getDate());
+        var weekDay = date.getDay();
+        var hour    = addZero(date.getHours());
+        var min     = addZero(date.getMinutes());
+        var second  = addZero(date.getSeconds());
+        var ms      = addZero(date.getMilliseconds()); 
+        var datefmt = "";
+
+        var ymd     = year2 + "-" + month + "-" + day;
+        var fymd    = year  + "-" + month + "-" + day;
+        var hms     = hour  + ":" + min   + ":" + second;
+
+        switch (format) 
+        {
+            case "UNIX Time" :
+                    datefmt = date.getTime();
+                break;
+
+            case "UTC" :
+                    datefmt = date.toUTCString();
+                break;	
+
+            case "yy" :
+                    datefmt = year2;
+                break;	
+
+            case "year" :
+            case "yyyy" :
+                    datefmt = year;
+                break;
+
+            case "month" :
+            case "mm" :
+                    datefmt = month;
+                break;                        
+
+            case "cn-week-day" :
+            case "cn-wd" :
+                    var cnWeekDays = ["日", "一", "二", "三", "四", "五", "六"];
+                    datefmt = "星期" + cnWeekDays[weekDay];
+                break;
+
+            case "week-day" :
+            case "wd" :
+                    var weekDays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
+                    datefmt = weekDays[weekDay];
+                break;
+
+            case "day" :
+            case "dd" :
+                    datefmt = day;
+                break;
+
+            case "hour" :
+            case "hh" :
+                    datefmt = hour;
+                break;
+
+            case "min" :
+            case "ii" :
+                    datefmt = min;
+                break;
+
+            case "second" :
+            case "ss" :
+                    datefmt = second;
+                break;
+
+            case "ms" :
+                    datefmt = ms;
+                break;
+
+            case "yy-mm-dd" :
+                    datefmt = ymd;
+                break;
+
+            case "yyyy-mm-dd" :
+                    datefmt = fymd;
+                break;
+
+            case "yyyy-mm-dd h:i:s ms" :
+            case "full + ms" : 
+                    datefmt = fymd + " " + hms + " " + ms;
+                break;
+
+            case "full" :
+            case "yyyy-mm-dd h:i:s" :
+                default:
+                    datefmt = fymd + " " + hms;
+                break;
+        }
+
+        return datefmt;
+    };
+
+    return editormd;
+
+}));
+(function(){
+    var factory = function (exports) {
+        var lang = {
+            name : "zh-tw",
+            description : "開源在線Markdown編輯器<br/>Open source online Markdown editor.",
+            tocTitle    : "目錄",
+            toolbar     : {
+                undo             : "撤銷（Ctrl+Z）",
+                redo             : "重做（Ctrl+Y）",
+                bold             : "粗體",
+                del              : "刪除線",
+                italic           : "斜體",
+                quote            : "引用",
+                ucwords          : "將所選的每個單詞首字母轉成大寫",
+                uppercase        : "將所選文本轉成大寫",
+                lowercase        : "將所選文本轉成小寫",
+                h1               : "標題1",
+                h2               : "標題2",
+                h3               : "標題3",
+                h4               : "標題4",
+                h5               : "標題5",
+                h6               : "標題6",
+                "list-ul"        : "無序列表",
+                "list-ol"        : "有序列表",
+                hr               : "横线",
+                link             : "链接",
+                "reference-link" : "引用鏈接",
+                image            : "圖片",
+                code             : "行內代碼",
+                "preformatted-text" : "預格式文本 / 代碼塊（縮進風格）",
+                "code-block"     : "代碼塊（多語言風格）",
+                table            : "添加表格",
+                datetime         : "日期時間",
+                emoji            : "Emoji 表情",
+                "html-entities"  : "HTML 實體字符",
+                pagebreak        : "插入分頁符",
+                watch            : "關閉實時預覽",
+                unwatch          : "開啟實時預覽",
+                preview          : "全窗口預覽HTML（按 Shift + ESC 退出）",
+                fullscreen       : "全屏（按 ESC 退出）",
+                clear            : "清空",
+                search           : "搜尋",
+                help             : "使用幫助",
+                info             : "關於" + exports.title
+            },
+            buttons : {
+                enter  : "確定",
+                cancel : "取消",
+                close  : "關閉"
+            },
+            dialog : {
+                link   : {
+                    title    : "添加鏈接",
+                    url      : "鏈接地址",
+                    urlTitle : "鏈接標題",
+                    urlEmpty : "錯誤：請填寫鏈接地址。"
+                },
+                referenceLink : {
+                    title    : "添加引用鏈接",
+                    name     : "引用名稱",
+                    url      : "鏈接地址",
+                    urlId    : "鏈接ID",
+                    urlTitle : "鏈接標題",
+                    nameEmpty: "錯誤：引用鏈接的名稱不能為空。",
+                    idEmpty  : "錯誤：請填寫引用鏈接的ID。",
+                    urlEmpty : "錯誤：請填寫引用鏈接的URL地址。"
+                },
+                image  : {
+                    title    : "添加圖片",
+                    url      : "圖片地址",
+                    link     : "圖片鏈接",
+                    alt      : "圖片描述",
+                    uploadButton     : "本地上傳",
+                    imageURLEmpty    : "錯誤：圖片地址不能為空。",
+                    uploadFileEmpty  : "錯誤：上傳的圖片不能為空！",
+                    formatNotAllowed : "錯誤：只允許上傳圖片文件，允許上傳的圖片文件格式有："
+                },
+                preformattedText : {
+                    title             : "添加預格式文本或代碼塊", 
+                    emptyAlert        : "錯誤：請填寫預格式文本或代碼的內容。"
+                },
+                codeBlock : {
+                    title             : "添加代碼塊",                 
+                    selectLabel       : "代碼語言：",
+                    selectDefaultText : "請語言代碼語言",
+                    otherLanguage     : "其他語言",
+                    unselectedLanguageAlert : "錯誤：請選擇代碼所屬的語言類型。",
+                    codeEmptyAlert    : "錯誤：請填寫代碼內容。"
+                },
+                htmlEntities : {
+                    title : "HTML實體字符"
+                },
+                help : {
+                    title : "使用幫助"
+                }
+            }
+        };
+        
+        exports.defaults.lang = lang;
+    };
+    
+	// CommonJS/Node.js
+	if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
+    { 
+        module.exports = factory;
+    }
+	else if (typeof define === "function")  // AMD/CMD/Sea.js
+    {
+		if (define.amd) { // for Require.js
+
+			define(["editormd"], function(editormd) {
+                factory(editormd);
+            });
+
+		} else { // for Sea.js
+			define(function(require) {
+                var editormd = require("../editormd");
+                factory(editormd);
+            });
+		}
+	} 
+	else
+	{
+        factory(window.editormd);
+	}
+    
+})();
+(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.dragula = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+'use strict';
+
+var cache = {};
+var start = '(?:^|\\s)';
+var end = '(?:\\s|$)';
+
+function lookupClass (className) {
+  var cached = cache[className];
+  if (cached) {
+    cached.lastIndex = 0;
+  } else {
+    cache[className] = cached = new RegExp(start + className + end, 'g');
+  }
+  return cached;
+}
+
+function addClass (el, className) {
+  var current = el.className;
+  if (!current.length) {
+    el.className = className;
+  } else if (!lookupClass(className).test(current)) {
+    el.className += ' ' + className;
+  }
+}
+
+function rmClass (el, className) {
+  el.className = el.className.replace(lookupClass(className), ' ').trim();
+}
+
+module.exports = {
+  add: addClass,
+  rm: rmClass
+};
+
+},{}],2:[function(require,module,exports){
+(function (global){
+'use strict';
+
+var emitter = require('contra/emitter');
+var crossvent = require('crossvent');
+var classes = require('./classes');
+var doc = document;
+var documentElement = doc.documentElement;
+
+function dragula (initialContainers, options) {
+  var len = arguments.length;
+  if (len === 1 && Array.isArray(initialContainers) === false) {
+    options = initialContainers;
+    initialContainers = [];
+  }
+  var _mirror; // mirror image
+  var _source; // source container
+  var _item; // item being dragged
+  var _offsetX; // reference x
+  var _offsetY; // reference y
+  var _moveX; // reference move x
+  var _moveY; // reference move y
+  var _initialSibling; // reference sibling when grabbed
+  var _currentSibling; // reference sibling now
+  var _copy; // item used for copying
+  var _renderTimer; // timer for setTimeout renderMirrorImage
+  var _lastDropTarget = null; // last container item was over
+  var _grabbed; // holds mousedown context until first mousemove
+
+  var o = options || {};
+  if (o.moves === void 0) { o.moves = always; }
+  if (o.accepts === void 0) { o.accepts = always; }
+  if (o.invalid === void 0) { o.invalid = invalidTarget; }
+  if (o.containers === void 0) { o.containers = initialContainers || []; }
+  if (o.isContainer === void 0) { o.isContainer = never; }
+  if (o.copy === void 0) { o.copy = false; }
+  if (o.copySortSource === void 0) { o.copySortSource = false; }
+  if (o.revertOnSpill === void 0) { o.revertOnSpill = false; }
+  if (o.removeOnSpill === void 0) { o.removeOnSpill = false; }
+  if (o.direction === void 0) { o.direction = 'vertical'; }
+  if (o.ignoreInputTextSelection === void 0) { o.ignoreInputTextSelection = true; }
+  if (o.mirrorContainer === void 0) { o.mirrorContainer = doc.body; }
+
+  var drake = emitter({
+    containers: o.containers,
+    start: manualStart,
+    end: end,
+    cancel: cancel,
+    remove: remove,
+    destroy: destroy,
+    canMove: canMove,
+    dragging: false
+  });
+
+  if (o.removeOnSpill === true) {
+    drake.on('over', spillOver).on('out', spillOut);
+  }
+
+  events();
+
+  return drake;
+
+  function isContainer (el) {
+    return drake.containers.indexOf(el) !== -1 || o.isContainer(el);
+  }
+
+  function events (remove) {
+    var op = remove ? 'remove' : 'add';
+    touchy(documentElement, op, 'mousedown', grab);
+    touchy(documentElement, op, 'mouseup', release);
+  }
+
+  function eventualMovements (remove) {
+    var op = remove ? 'remove' : 'add';
+    touchy(documentElement, op, 'mousemove', startBecauseMouseMoved);
+  }
+
+  function movements (remove) {
+    var op = remove ? 'remove' : 'add';
+    crossvent[op](documentElement, 'selectstart', preventGrabbed); // IE8
+    crossvent[op](documentElement, 'click', preventGrabbed);
+  }
+
+  function destroy () {
+    events(true);
+    release({});
+  }
+
+  function preventGrabbed (e) {
+    if (_grabbed) {
+      e.preventDefault();
+    }
+  }
+
+  function grab (e) {
+    _moveX = e.clientX;
+    _moveY = e.clientY;
+
+    var ignore = whichMouseButton(e) !== 1 || e.metaKey || e.ctrlKey;
+    if (ignore) {
+      return; // we only care about honest-to-god left clicks and touch events
+    }
+    var item = e.target;
+    var context = canStart(item);
+    if (!context) {
+      return;
+    }
+    _grabbed = context;
+    eventualMovements();
+    if (e.type === 'mousedown') {
+      if (isInput(item)) { // see also: https://github.com/bevacqua/dragula/issues/208
+        item.focus(); // fixes https://github.com/bevacqua/dragula/issues/176
+      } else {
+        e.preventDefault(); // fixes https://github.com/bevacqua/dragula/issues/155
+      }
+    }
+  }
+
+  function startBecauseMouseMoved (e) {
+    if (!_grabbed) {
+      return;
+    }
+    if (whichMouseButton(e) === 0) {
+      release({});
+      return; // when text is selected on an input and then dragged, mouseup doesn't fire. this is our only hope
+    }
+    // truthy check fixes #239, equality fixes #207
+    if (e.clientX !== void 0 && e.clientX === _moveX && e.clientY !== void 0 && e.clientY === _moveY) {
+      return;
+    }
+    if (o.ignoreInputTextSelection) {
+      var clientX = getCoord('clientX', e);
+      var clientY = getCoord('clientY', e);
+      var elementBehindCursor = doc.elementFromPoint(clientX, clientY);
+      if (isInput(elementBehindCursor)) {
+        return;
+      }
+    }
+
+    var grabbed = _grabbed; // call to end() unsets _grabbed
+    eventualMovements(true);
+    movements();
+    end();
+    start(grabbed);
+
+    var offset = getOffset(_item);
+    _offsetX = getCoord('pageX', e) - offset.left;
+    _offsetY = getCoord('pageY', e) - offset.top;
+
+    classes.add(_copy || _item, 'gu-transit');
+    renderMirrorImage();
+    drag(e);
+  }
+
+  function canStart (item) {
+    if (drake.dragging && _mirror) {
+      return;
+    }
+    if (isContainer(item)) {
+      return; // don't drag container itself
+    }
+    var handle = item;
+    while (getParent(item) && isContainer(getParent(item)) === false) {
+      if (o.invalid(item, handle)) {
+        return;
+      }
+      item = getParent(item); // drag target should be a top element
+      if (!item) {
+        return;
+      }
+    }
+    var source = getParent(item);
+    if (!source) {
+      return;
+    }
+    if (o.invalid(item, handle)) {
+      return;
+    }
+
+    var movable = o.moves(item, source, handle, nextEl(item));
+    if (!movable) {
+      return;
+    }
+
+    return {
+      item: item,
+      source: source
+    };
+  }
+
+  function canMove (item) {
+    return !!canStart(item);
+  }
+
+  function manualStart (item) {
+    var context = canStart(item);
+    if (context) {
+      start(context);
+    }
+  }
+
+  function start (context) {
+    if (isCopy(context.item, context.source)) {
+      _copy = context.item.cloneNode(true);
+      drake.emit('cloned', _copy, context.item, 'copy');
+    }
+
+    _source = context.source;
+    _item = context.item;
+    _initialSibling = _currentSibling = nextEl(context.item);
+
+    drake.dragging = true;
+    drake.emit('drag', _item, _source);
+  }
+
+  function invalidTarget () {
+    return false;
+  }
+
+  function end () {
+    if (!drake.dragging) {
+      return;
+    }
+    var item = _copy || _item;
+    drop(item, getParent(item));
+  }
+
+  function ungrab () {
+    _grabbed = false;
+    eventualMovements(true);
+    movements(true);
+  }
+
+  function release (e) {
+    ungrab();
+
+    if (!drake.dragging) {
+      return;
+    }
+    var item = _copy || _item;
+    var clientX = getCoord('clientX', e);
+    var clientY = getCoord('clientY', e);
+    var elementBehindCursor = getElementBehindPoint(_mirror, clientX, clientY);
+    var dropTarget = findDropTarget(elementBehindCursor, clientX, clientY);
+    if (dropTarget && ((_copy && o.copySortSource) || (!_copy || dropTarget !== _source))) {
+      drop(item, dropTarget);
+    } else if (o.removeOnSpill) {
+      remove();
+    } else {
+      cancel();
+    }
+  }
+
+  function drop (item, target) {
+    var parent = getParent(item);
+    if (_copy && o.copySortSource && target === _source) {
+      parent.removeChild(_item);
+    }
+    if (isInitialPlacement(target)) {
+      drake.emit('cancel', item, _source, _source);
+    } else {
+      drake.emit('drop', item, target, _source, _currentSibling);
+    }
+    cleanup();
+  }
+
+  function remove () {
+    if (!drake.dragging) {
+      return;
+    }
+    var item = _copy || _item;
+    var parent = getParent(item);
+    if (parent) {
+      parent.removeChild(item);
+    }
+    drake.emit(_copy ? 'cancel' : 'remove', item, parent, _source);
+    cleanup();
+  }
+
+  function cancel (revert) {
+    if (!drake.dragging) {
+      return;
+    }
+    var reverts = arguments.length > 0 ? revert : o.revertOnSpill;
+    var item = _copy || _item;
+    var parent = getParent(item);
+    var initial = isInitialPlacement(parent);
+    if (initial === false && reverts) {
+      if (_copy) {
+        if (parent) {
+          parent.removeChild(_copy);
+        }
+      } else {
+        _source.insertBefore(item, _initialSibling);
+      }
+    }
+    if (initial || reverts) {
+      drake.emit('cancel', item, _source, _source);
+    } else {
+      drake.emit('drop', item, parent, _source, _currentSibling);
+    }
+    cleanup();
+  }
+
+  function cleanup () {
+    var item = _copy || _item;
+    ungrab();
+    removeMirrorImage();
+    if (item) {
+      classes.rm(item, 'gu-transit');
+    }
+    if (_renderTimer) {
+      clearTimeout(_renderTimer);
+    }
+    drake.dragging = false;
+    if (_lastDropTarget) {
+      drake.emit('out', item, _lastDropTarget, _source);
+    }
+    drake.emit('dragend', item);
+    _source = _item = _copy = _initialSibling = _currentSibling = _renderTimer = _lastDropTarget = null;
+  }
+
+  function isInitialPlacement (target, s) {
+    var sibling;
+    if (s !== void 0) {
+      sibling = s;
+    } else if (_mirror) {
+      sibling = _currentSibling;
+    } else {
+      sibling = nextEl(_copy || _item);
+    }
+    return target === _source && sibling === _initialSibling;
+  }
+
+  function findDropTarget (elementBehindCursor, clientX, clientY) {
+    var target = elementBehindCursor;
+    while (target && !accepted()) {
+      target = getParent(target);
+    }
+    return target;
+
+    function accepted () {
+      var droppable = isContainer(target);
+      if (droppable === false) {
+        return false;
+      }
+
+      var immediate = getImmediateChild(target, elementBehindCursor);
+      var reference = getReference(target, immediate, clientX, clientY);
+      var initial = isInitialPlacement(target, reference);
+      if (initial) {
+        return true; // should always be able to drop it right back where it was
+      }
+      return o.accepts(_item, target, _source, reference);
+    }
+  }
+
+  function drag (e) {
+    if (!_mirror) {
+      return;
+    }
+    e.preventDefault();
+
+    var clientX = getCoord('clientX', e);
+    var clientY = getCoord('clientY', e);
+    var x = clientX - _offsetX;
+    var y = clientY - _offsetY;
+
+    _mirror.style.left = x + 'px';
+    _mirror.style.top = y + 'px';
+
+    var item = _copy || _item;
+    var elementBehindCursor = getElementBehindPoint(_mirror, clientX, clientY);
+    var dropTarget = findDropTarget(elementBehindCursor, clientX, clientY);
+    var changed = dropTarget !== null && dropTarget !== _lastDropTarget;
+    if (changed || dropTarget === null) {
+      out();
+      _lastDropTarget = dropTarget;
+      over();
+    }
+    var parent = getParent(item);
+    if (dropTarget === _source && _copy && !o.copySortSource) {
+      if (parent) {
+        parent.removeChild(item);
+      }
+      return;
+    }
+    var reference;
+    var immediate = getImmediateChild(dropTarget, elementBehindCursor);
+    if (immediate !== null) {
+      reference = getReference(dropTarget, immediate, clientX, clientY);
+    } else if (o.revertOnSpill === true && !_copy) {
+      reference = _initialSibling;
+      dropTarget = _source;
+    } else {
+      if (_copy && parent) {
+        parent.removeChild(item);
+      }
+      return;
+    }
+    if (
+      (reference === null && changed) ||
+      reference !== item &&
+      reference !== nextEl(item)
+    ) {
+      _currentSibling = reference;
+      dropTarget.insertBefore(item, reference);
+      drake.emit('shadow', item, dropTarget, _source);
+    }
+    function moved (type) { drake.emit(type, item, _lastDropTarget, _source); }
+    function over () { if (changed) { moved('over'); } }
+    function out () { if (_lastDropTarget) { moved('out'); } }
+  }
+
+  function spillOver (el) {
+    classes.rm(el, 'gu-hide');
+  }
+
+  function spillOut (el) {
+    if (drake.dragging) { classes.add(el, 'gu-hide'); }
+  }
+
+  function renderMirrorImage () {
+    if (_mirror) {
+      return;
+    }
+    var rect = _item.getBoundingClientRect();
+    _mirror = _item.cloneNode(true);
+    _mirror.style.width = getRectWidth(rect) + 'px';
+    _mirror.style.height = getRectHeight(rect) + 'px';
+    classes.rm(_mirror, 'gu-transit');
+    classes.add(_mirror, 'gu-mirror');
+    o.mirrorContainer.appendChild(_mirror);
+    touchy(documentElement, 'add', 'mousemove', drag);
+    classes.add(o.mirrorContainer, 'gu-unselectable');
+    drake.emit('cloned', _mirror, _item, 'mirror');
+  }
+
+  function removeMirrorImage () {
+    if (_mirror) {
+      classes.rm(o.mirrorContainer, 'gu-unselectable');
+      touchy(documentElement, 'remove', 'mousemove', drag);
+      getParent(_mirror).removeChild(_mirror);
+      _mirror = null;
+    }
+  }
+
+  function getImmediateChild (dropTarget, target) {
+    var immediate = target;
+    while (immediate !== dropTarget && getParent(immediate) !== dropTarget) {
+      immediate = getParent(immediate);
+    }
+    if (immediate === documentElement) {
+      return null;
+    }
+    return immediate;
+  }
+
+  function getReference (dropTarget, target, x, y) {
+    var horizontal = o.direction === 'horizontal';
+    var reference = target !== dropTarget ? inside() : outside();
+    return reference;
+
+    function outside () { // slower, but able to figure out any position
+      var len = dropTarget.children.length;
+      var i;
+      var el;
+      var rect;
+      for (i = 0; i < len; i++) {
+        el = dropTarget.children[i];
+        rect = el.getBoundingClientRect();
+        if (horizontal && (rect.left + rect.width / 2) > x) { return el; }
+        if (!horizontal && (rect.top + rect.height / 2) > y) { return el; }
+      }
+      return null;
+    }
+
+    function inside () { // faster, but only available if dropped inside a child element
+      var rect = target.getBoundingClientRect();
+      if (horizontal) {
+        return resolve(x > rect.left + getRectWidth(rect) / 2);
+      }
+      return resolve(y > rect.top + getRectHeight(rect) / 2);
+    }
+
+    function resolve (after) {
+      return after ? nextEl(target) : target;
+    }
+  }
+
+  function isCopy (item, container) {
+    return typeof o.copy === 'boolean' ? o.copy : o.copy(item, container);
+  }
+}
+
+function touchy (el, op, type, fn) {
+  var touch = {
+    mouseup: 'touchend',
+    mousedown: 'touchstart',
+    mousemove: 'touchmove'
+  };
+  var pointers = {
+    mouseup: 'pointerup',
+    mousedown: 'pointerdown',
+    mousemove: 'pointermove'
+  };
+  var microsoft = {
+    mouseup: 'MSPointerUp',
+    mousedown: 'MSPointerDown',
+    mousemove: 'MSPointerMove'
+  };
+  if (global.navigator.pointerEnabled) {
+    crossvent[op](el, pointers[type], fn);
+  } else if (global.navigator.msPointerEnabled) {
+    crossvent[op](el, microsoft[type], fn);
+  } else {
+    crossvent[op](el, touch[type], fn);
+    crossvent[op](el, type, fn);
+  }
+}
+
+function whichMouseButton (e) {
+  if (e.touches !== void 0) { return e.touches.length; }
+  if (e.which !== void 0 && e.which !== 0) { return e.which; } // see https://github.com/bevacqua/dragula/issues/261
+  if (e.buttons !== void 0) { return e.buttons; }
+  var button = e.button;
+  if (button !== void 0) { // see https://github.com/jquery/jquery/blob/99e8ff1baa7ae341e94bb89c3e84570c7c3ad9ea/src/event.js#L573-L575
+    return button & 1 ? 1 : button & 2 ? 3 : (button & 4 ? 2 : 0);
+  }
+}
+
+function getOffset (el) {
+  var rect = el.getBoundingClientRect();
+  return {
+    left: rect.left + getScroll('scrollLeft', 'pageXOffset'),
+    top: rect.top + getScroll('scrollTop', 'pageYOffset')
+  };
+}
+
+function getScroll (scrollProp, offsetProp) {
+  if (typeof global[offsetProp] !== 'undefined') {
+    return global[offsetProp];
+  }
+  if (documentElement.clientHeight) {
+    return documentElement[scrollProp];
+  }
+  return doc.body[scrollProp];
+}
+
+function getElementBehindPoint (point, x, y) {
+  var p = point || {};
+  var state = p.className;
+  var el;
+  p.className += ' gu-hide';
+  el = doc.elementFromPoint(x, y);
+  p.className = state;
+  return el;
+}
+
+function never () { return false; }
+function always () { return true; }
+function getRectWidth (rect) { return rect.width || (rect.right - rect.left); }
+function getRectHeight (rect) { return rect.height || (rect.bottom - rect.top); }
+function getParent (el) { return el.parentNode === doc ? null : el.parentNode; }
+function isInput (el) { return el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT' || isEditable(el); }
+function isEditable (el) {
+  if (!el) { return false; } // no parents were editable
+  if (el.contentEditable === 'false') { return false; } // stop the lookup
+  if (el.contentEditable === 'true') { return true; } // found a contentEditable element in the chain
+  return isEditable(getParent(el)); // contentEditable is set to 'inherit'
+}
+
+function nextEl (el) {
+  return el.nextElementSibling || manually();
+  function manually () {
+    var sibling = el;
+    do {
+      sibling = sibling.nextSibling;
+    } while (sibling && sibling.nodeType !== 1);
+    return sibling;
+  }
+}
+
+function getEventHost (e) {
+  // on touchend event, we have to use `e.changedTouches`
+  // see http://stackoverflow.com/questions/7192563/touchend-event-properties
+  // see https://github.com/bevacqua/dragula/issues/34
+  if (e.targetTouches && e.targetTouches.length) {
+    return e.targetTouches[0];
+  }
+  if (e.changedTouches && e.changedTouches.length) {
+    return e.changedTouches[0];
+  }
+  return e;
+}
+
+function getCoord (coord, e) {
+  var host = getEventHost(e);
+  var missMap = {
+    pageX: 'clientX', // IE8
+    pageY: 'clientY' // IE8
+  };
+  if (coord in missMap && !(coord in host) && missMap[coord] in host) {
+    coord = missMap[coord];
+  }
+  return host[coord];
+}
+
+module.exports = dragula;
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{"./classes":1,"contra/emitter":5,"crossvent":6}],3:[function(require,module,exports){
+module.exports = function atoa (a, n) { return Array.prototype.slice.call(a, n); }
+
+},{}],4:[function(require,module,exports){
+'use strict';
+
+var ticky = require('ticky');
+
+module.exports = function debounce (fn, args, ctx) {
+  if (!fn) { return; }
+  ticky(function run () {
+    fn.apply(ctx || null, args || []);
+  });
+};
+
+},{"ticky":9}],5:[function(require,module,exports){
+'use strict';
+
+var atoa = require('atoa');
+var debounce = require('./debounce');
+
+module.exports = function emitter (thing, options) {
+  var opts = options || {};
+  var evt = {};
+  if (thing === undefined) { thing = {}; }
+  thing.on = function (type, fn) {
+    if (!evt[type]) {
+      evt[type] = [fn];
+    } else {
+      evt[type].push(fn);
+    }
+    return thing;
+  };
+  thing.once = function (type, fn) {
+    fn._once = true; // thing.off(fn) still works!
+    thing.on(type, fn);
+    return thing;
+  };
+  thing.off = function (type, fn) {
+    var c = arguments.length;
+    if (c === 1) {
+      delete evt[type];
+    } else if (c === 0) {
+      evt = {};
+    } else {
+      var et = evt[type];
+      if (!et) { return thing; }
+      et.splice(et.indexOf(fn), 1);
+    }
+    return thing;
+  };
+  thing.emit = function () {
+    var args = atoa(arguments);
+    return thing.emitterSnapshot(args.shift()).apply(this, args);
+  };
+  thing.emitterSnapshot = function (type) {
+    var et = (evt[type] || []).slice(0);
+    return function () {
+      var args = atoa(arguments);
+      var ctx = this || thing;
+      if (type === 'error' && opts.throws !== false && !et.length) { throw args.length === 1 ? args[0] : args; }
+      et.forEach(function emitter (listen) {
+        if (opts.async) { debounce(listen, args, ctx); } else { listen.apply(ctx, args); }
+        if (listen._once) { thing.off(type, listen); }
+      });
+      return thing;
+    };
+  };
+  return thing;
+};
+
+},{"./debounce":4,"atoa":3}],6:[function(require,module,exports){
+(function (global){
+'use strict';
+
+var customEvent = require('custom-event');
+var eventmap = require('./eventmap');
+var doc = global.document;
+var addEvent = addEventEasy;
+var removeEvent = removeEventEasy;
+var hardCache = [];
+
+if (!global.addEventListener) {
+  addEvent = addEventHard;
+  removeEvent = removeEventHard;
+}
+
+module.exports = {
+  add: addEvent,
+  remove: removeEvent,
+  fabricate: fabricateEvent
+};
+
+function addEventEasy (el, type, fn, capturing) {
+  return el.addEventListener(type, fn, capturing);
+}
+
+function addEventHard (el, type, fn) {
+  return el.attachEvent('on' + type, wrap(el, type, fn));
+}
+
+function removeEventEasy (el, type, fn, capturing) {
+  return el.removeEventListener(type, fn, capturing);
+}
+
+function removeEventHard (el, type, fn) {
+  var listener = unwrap(el, type, fn);
+  if (listener) {
+    return el.detachEvent('on' + type, listener);
+  }
+}
+
+function fabricateEvent (el, type, model) {
+  var e = eventmap.indexOf(type) === -1 ? makeCustomEvent() : makeClassicEvent();
+  if (el.dispatchEvent) {
+    el.dispatchEvent(e);
+  } else {
+    el.fireEvent('on' + type, e);
+  }
+  function makeClassicEvent () {
+    var e;
+    if (doc.createEvent) {
+      e = doc.createEvent('Event');
+      e.initEvent(type, true, true);
+    } else if (doc.createEventObject) {
+      e = doc.createEventObject();
+    }
+    return e;
+  }
+  function makeCustomEvent () {
+    return new customEvent(type, { detail: model });
+  }
+}
+
+function wrapperFactory (el, type, fn) {
+  return function wrapper (originalEvent) {
+    var e = originalEvent || global.event;
+    e.target = e.target || e.srcElement;
+    e.preventDefault = e.preventDefault || function preventDefault () { e.returnValue = false; };
+    e.stopPropagation = e.stopPropagation || function stopPropagation () { e.cancelBubble = true; };
+    e.which = e.which || e.keyCode;
+    fn.call(el, e);
+  };
+}
+
+function wrap (el, type, fn) {
+  var wrapper = unwrap(el, type, fn) || wrapperFactory(el, type, fn);
+  hardCache.push({
+    wrapper: wrapper,
+    element: el,
+    type: type,
+    fn: fn
+  });
+  return wrapper;
+}
+
+function unwrap (el, type, fn) {
+  var i = find(el, type, fn);
+  if (i) {
+    var wrapper = hardCache[i].wrapper;
+    hardCache.splice(i, 1); // free up a tad of memory
+    return wrapper;
+  }
+}
+
+function find (el, type, fn) {
+  var i, item;
+  for (i = 0; i < hardCache.length; i++) {
+    item = hardCache[i];
+    if (item.element === el && item.type === type && item.fn === fn) {
+      return i;
+    }
+  }
+}
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{"./eventmap":7,"custom-event":8}],7:[function(require,module,exports){
+(function (global){
+'use strict';
+
+var eventmap = [];
+var eventname = '';
+var ron = /^on/;
+
+for (eventname in global) {
+  if (ron.test(eventname)) {
+    eventmap.push(eventname.slice(2));
+  }
+}
+
+module.exports = eventmap;
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{}],8:[function(require,module,exports){
+(function (global){
+
+var NativeCustomEvent = global.CustomEvent;
+
+function useNative () {
+  try {
+    var p = new NativeCustomEvent('cat', { detail: { foo: 'bar' } });
+    return  'cat' === p.type && 'bar' === p.detail.foo;
+  } catch (e) {
+  }
+  return false;
+}
+
+/**
+ * Cross-browser `CustomEvent` constructor.
+ *
+ * https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent.CustomEvent
+ *
+ * @public
+ */
+
+module.exports = useNative() ? NativeCustomEvent :
+
+// IE >= 9
+'function' === typeof document.createEvent ? function CustomEvent (type, params) {
+  var e = document.createEvent('CustomEvent');
+  if (params) {
+    e.initCustomEvent(type, params.bubbles, params.cancelable, params.detail);
+  } else {
+    e.initCustomEvent(type, false, false, void 0);
+  }
+  return e;
+} :
+
+// IE <= 8
+function CustomEvent (type, params) {
+  var e = document.createEventObject();
+  e.type = type;
+  if (params) {
+    e.bubbles = Boolean(params.bubbles);
+    e.cancelable = Boolean(params.cancelable);
+    e.detail = params.detail;
+  } else {
+    e.bubbles = false;
+    e.cancelable = false;
+    e.detail = void 0;
+  }
+  return e;
+}
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{}],9:[function(require,module,exports){
+var si = typeof setImmediate === 'function', tick;
+if (si) {
+  tick = function (fn) { setImmediate(fn); };
+} else {
+  tick = function (fn) { setTimeout(fn, 0); };
+}
+
+module.exports = tick;
+},{}]},{},[2])(2)
+});
+//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm5vZGVfbW9kdWxlcy9icm93c2VyLXBhY2svX3ByZWx1ZGUuanMiLCJjbGFzc2VzLmpzIiwiZHJhZ3VsYS5qcyIsIm5vZGVfbW9kdWxlcy9hdG9hL2F0b2EuanMiLCJub2RlX21vZHVsZXMvY29udHJhL2RlYm91bmNlLmpzIiwibm9kZV9tb2R1bGVzL2NvbnRyYS9lbWl0dGVyLmpzIiwibm9kZV9tb2R1bGVzL2Nyb3NzdmVudC9zcmMvY3Jvc3N2ZW50LmpzIiwibm9kZV9tb2R1bGVzL2Nyb3NzdmVudC9zcmMvZXZlbnRtYXAuanMiLCJub2RlX21vZHVsZXMvY3VzdG9tLWV2ZW50L2luZGV4LmpzIiwibm9kZV9tb2R1bGVzL3RpY2t5L3RpY2t5LWJyb3dzZXIuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7QUNBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTs7O0FDakNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTs7OztBQ2htQkE7QUFDQTs7QUNEQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOztBQ1ZBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7QUN0REE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7OztBQ3JHQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7OztBQ2JBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7O0FDaERBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0EiLCJmaWxlIjoiZ2VuZXJhdGVkLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXNDb250ZW50IjpbIihmdW5jdGlvbiBlKHQsbixyKXtmdW5jdGlvbiBzKG8sdSl7aWYoIW5bb10pe2lmKCF0W29dKXt2YXIgYT10eXBlb2YgcmVxdWlyZT09XCJmdW5jdGlvblwiJiZyZXF1aXJlO2lmKCF1JiZhKXJldHVybiBhKG8sITApO2lmKGkpcmV0dXJuIGkobywhMCk7dmFyIGY9bmV3IEVycm9yKFwiQ2Fubm90IGZpbmQgbW9kdWxlICdcIitvK1wiJ1wiKTt0aHJvdyBmLmNvZGU9XCJNT0RVTEVfTk9UX0ZPVU5EXCIsZn12YXIgbD1uW29dPXtleHBvcnRzOnt9fTt0W29dWzBdLmNhbGwobC5leHBvcnRzLGZ1bmN0aW9uKGUpe3ZhciBuPXRbb11bMV1bZV07cmV0dXJuIHMobj9uOmUpfSxsLGwuZXhwb3J0cyxlLHQsbixyKX1yZXR1cm4gbltvXS5leHBvcnRzfXZhciBpPXR5cGVvZiByZXF1aXJlPT1cImZ1bmN0aW9uXCImJnJlcXVpcmU7Zm9yKHZhciBvPTA7bzxyLmxlbmd0aDtvKyspcyhyW29dKTtyZXR1cm4gc30pIiwiJ3VzZSBzdHJpY3QnO1xuXG52YXIgY2FjaGUgPSB7fTtcbnZhciBzdGFydCA9ICcoPzpefFxcXFxzKSc7XG52YXIgZW5kID0gJyg/OlxcXFxzfCQpJztcblxuZnVuY3Rpb24gbG9va3VwQ2xhc3MgKGNsYXNzTmFtZSkge1xuICB2YXIgY2FjaGVkID0gY2FjaGVbY2xhc3NOYW1lXTtcbiAgaWYgKGNhY2hlZCkge1xuICAgIGNhY2hlZC5sYXN0SW5kZXggPSAwO1xuICB9IGVsc2Uge1xuICAgIGNhY2hlW2NsYXNzTmFtZV0gPSBjYWNoZWQgPSBuZXcgUmVnRXhwKHN0YXJ0ICsgY2xhc3NOYW1lICsgZW5kLCAnZycpO1xuICB9XG4gIHJldHVybiBjYWNoZWQ7XG59XG5cbmZ1bmN0aW9uIGFkZENsYXNzIChlbCwgY2xhc3NOYW1lKSB7XG4gIHZhciBjdXJyZW50ID0gZWwuY2xhc3NOYW1lO1xuICBpZiAoIWN1cnJlbnQubGVuZ3RoKSB7XG4gICAgZWwuY2xhc3NOYW1lID0gY2xhc3NOYW1lO1xuICB9IGVsc2UgaWYgKCFsb29rdXBDbGFzcyhjbGFzc05hbWUpLnRlc3QoY3VycmVudCkpIHtcbiAgICBlbC5jbGFzc05hbWUgKz0gJyAnICsgY2xhc3NOYW1lO1xuICB9XG59XG5cbmZ1bmN0aW9uIHJtQ2xhc3MgKGVsLCBjbGFzc05hbWUpIHtcbiAgZWwuY2xhc3NOYW1lID0gZWwuY2xhc3NOYW1lLnJlcGxhY2UobG9va3VwQ2xhc3MoY2xhc3NOYW1lKSwgJyAnKS50cmltKCk7XG59XG5cbm1vZHVsZS5leHBvcnRzID0ge1xuICBhZGQ6IGFkZENsYXNzLFxuICBybTogcm1DbGFzc1xufTtcbiIsIid1c2Ugc3RyaWN0JztcblxudmFyIGVtaXR0ZXIgPSByZXF1aXJlKCdjb250cmEvZW1pdHRlcicpO1xudmFyIGNyb3NzdmVudCA9IHJlcXVpcmUoJ2Nyb3NzdmVudCcpO1xudmFyIGNsYXNzZXMgPSByZXF1aXJlKCcuL2NsYXNzZXMnKTtcbnZhciBkb2MgPSBkb2N1bWVudDtcbnZhciBkb2N1bWVudEVsZW1lbnQgPSBkb2MuZG9jdW1lbnRFbGVtZW50O1xuXG5mdW5jdGlvbiBkcmFndWxhIChpbml0aWFsQ29udGFpbmVycywgb3B0aW9ucykge1xuICB2YXIgbGVuID0gYXJndW1lbnRzLmxlbmd0aDtcbiAgaWYgKGxlbiA9PT0gMSAmJiBBcnJheS5pc0FycmF5KGluaXRpYWxDb250YWluZXJzKSA9PT0gZmFsc2UpIHtcbiAgICBvcHRpb25zID0gaW5pdGlhbENvbnRhaW5lcnM7XG4gICAgaW5pdGlhbENvbnRhaW5lcnMgPSBbXTtcbiAgfVxuICB2YXIgX21pcnJvcjsgLy8gbWlycm9yIGltYWdlXG4gIHZhciBfc291cmNlOyAvLyBzb3VyY2UgY29udGFpbmVyXG4gIHZhciBfaXRlbTsgLy8gaXRlbSBiZWluZyBkcmFnZ2VkXG4gIHZhciBfb2Zmc2V0WDsgLy8gcmVmZXJlbmNlIHhcbiAgdmFyIF9vZmZzZXRZOyAvLyByZWZlcmVuY2UgeVxuICB2YXIgX21vdmVYOyAvLyByZWZlcmVuY2UgbW92ZSB4XG4gIHZhciBfbW92ZVk7IC8vIHJlZmVyZW5jZSBtb3ZlIHlcbiAgdmFyIF9pbml0aWFsU2libGluZzsgLy8gcmVmZXJlbmNlIHNpYmxpbmcgd2hlbiBncmFiYmVkXG4gIHZhciBfY3VycmVudFNpYmxpbmc7IC8vIHJlZmVyZW5jZSBzaWJsaW5nIG5vd1xuICB2YXIgX2NvcHk7IC8vIGl0ZW0gdXNlZCBmb3IgY29weWluZ1xuICB2YXIgX3JlbmRlclRpbWVyOyAvLyB0aW1lciBmb3Igc2V0VGltZW91dCByZW5kZXJNaXJyb3JJbWFnZVxuICB2YXIgX2xhc3REcm9wVGFyZ2V0ID0gbnVsbDsgLy8gbGFzdCBjb250YWluZXIgaXRlbSB3YXMgb3ZlclxuICB2YXIgX2dyYWJiZWQ7IC8vIGhvbGRzIG1vdXNlZG93biBjb250ZXh0IHVudGlsIGZpcnN0IG1vdXNlbW92ZVxuXG4gIHZhciBvID0gb3B0aW9ucyB8fCB7fTtcbiAgaWYgKG8ubW92ZXMgPT09IHZvaWQgMCkgeyBvLm1vdmVzID0gYWx3YXlzOyB9XG4gIGlmIChvLmFjY2VwdHMgPT09IHZvaWQgMCkgeyBvLmFjY2VwdHMgPSBhbHdheXM7IH1cbiAgaWYgKG8uaW52YWxpZCA9PT0gdm9pZCAwKSB7IG8uaW52YWxpZCA9IGludmFsaWRUYXJnZXQ7IH1cbiAgaWYgKG8uY29udGFpbmVycyA9PT0gdm9pZCAwKSB7IG8uY29udGFpbmVycyA9IGluaXRpYWxDb250YWluZXJzIHx8IFtdOyB9XG4gIGlmIChvLmlzQ29udGFpbmVyID09PSB2b2lkIDApIHsgby5pc0NvbnRhaW5lciA9IG5ldmVyOyB9XG4gIGlmIChvLmNvcHkgPT09IHZvaWQgMCkgeyBvLmNvcHkgPSBmYWxzZTsgfVxuICBpZiAoby5jb3B5U29ydFNvdXJjZSA9PT0gdm9pZCAwKSB7IG8uY29weVNvcnRTb3VyY2UgPSBmYWxzZTsgfVxuICBpZiAoby5yZXZlcnRPblNwaWxsID09PSB2b2lkIDApIHsgby5yZXZlcnRPblNwaWxsID0gZmFsc2U7IH1cbiAgaWYgKG8ucmVtb3ZlT25TcGlsbCA9PT0gdm9pZCAwKSB7IG8ucmVtb3ZlT25TcGlsbCA9IGZhbHNlOyB9XG4gIGlmIChvLmRpcmVjdGlvbiA9PT0gdm9pZCAwKSB7IG8uZGlyZWN0aW9uID0gJ3ZlcnRpY2FsJzsgfVxuICBpZiAoby5pZ25vcmVJbnB1dFRleHRTZWxlY3Rpb24gPT09IHZvaWQgMCkgeyBvLmlnbm9yZUlucHV0VGV4dFNlbGVjdGlvbiA9IHRydWU7IH1cbiAgaWYgKG8ubWlycm9yQ29udGFpbmVyID09PSB2b2lkIDApIHsgby5taXJyb3JDb250YWluZXIgPSBkb2MuYm9keTsgfVxuXG4gIHZhciBkcmFrZSA9IGVtaXR0ZXIoe1xuICAgIGNvbnRhaW5lcnM6IG8uY29udGFpbmVycyxcbiAgICBzdGFydDogbWFudWFsU3RhcnQsXG4gICAgZW5kOiBlbmQsXG4gICAgY2FuY2VsOiBjYW5jZWwsXG4gICAgcmVtb3ZlOiByZW1vdmUsXG4gICAgZGVzdHJveTogZGVzdHJveSxcbiAgICBjYW5Nb3ZlOiBjYW5Nb3ZlLFxuICAgIGRyYWdnaW5nOiBmYWxzZVxuICB9KTtcblxuICBpZiAoby5yZW1vdmVPblNwaWxsID09PSB0cnVlKSB7XG4gICAgZHJha2Uub24oJ292ZXInLCBzcGlsbE92ZXIpLm9uKCdvdXQnLCBzcGlsbE91dCk7XG4gIH1cblxuICBldmVudHMoKTtcblxuICByZXR1cm4gZHJha2U7XG5cbiAgZnVuY3Rpb24gaXNDb250YWluZXIgKGVsKSB7XG4gICAgcmV0dXJuIGRyYWtlLmNvbnRhaW5lcnMuaW5kZXhPZihlbCkgIT09IC0xIHx8IG8uaXNDb250YWluZXIoZWwpO1xuICB9XG5cbiAgZnVuY3Rpb24gZXZlbnRzIChyZW1vdmUpIHtcbiAgICB2YXIgb3AgPSByZW1vdmUgPyAncmVtb3ZlJyA6ICdhZGQnO1xuICAgIHRvdWNoeShkb2N1bWVudEVsZW1lbnQsIG9wLCAnbW91c2Vkb3duJywgZ3JhYik7XG4gICAgdG91Y2h5KGRvY3VtZW50RWxlbWVudCwgb3AsICdtb3VzZXVwJywgcmVsZWFzZSk7XG4gIH1cblxuICBmdW5jdGlvbiBldmVudHVhbE1vdmVtZW50cyAocmVtb3ZlKSB7XG4gICAgdmFyIG9wID0gcmVtb3ZlID8gJ3JlbW92ZScgOiAnYWRkJztcbiAgICB0b3VjaHkoZG9jdW1lbnRFbGVtZW50LCBvcCwgJ21vdXNlbW92ZScsIHN0YXJ0QmVjYXVzZU1vdXNlTW92ZWQpO1xuICB9XG5cbiAgZnVuY3Rpb24gbW92ZW1lbnRzIChyZW1vdmUpIHtcbiAgICB2YXIgb3AgPSByZW1vdmUgPyAncmVtb3ZlJyA6ICdhZGQnO1xuICAgIGNyb3NzdmVudFtvcF0oZG9jdW1lbnRFbGVtZW50LCAnc2VsZWN0c3RhcnQnLCBwcmV2ZW50R3JhYmJlZCk7IC8vIElFOFxuICAgIGNyb3NzdmVudFtvcF0oZG9jdW1lbnRFbGVtZW50LCAnY2xpY2snLCBwcmV2ZW50R3JhYmJlZCk7XG4gIH1cblxuICBmdW5jdGlvbiBkZXN0cm95ICgpIHtcbiAgICBldmVudHModHJ1ZSk7XG4gICAgcmVsZWFzZSh7fSk7XG4gIH1cblxuICBmdW5jdGlvbiBwcmV2ZW50R3JhYmJlZCAoZSkge1xuICAgIGlmIChfZ3JhYmJlZCkge1xuICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIGdyYWIgKGUpIHtcbiAgICBfbW92ZVggPSBlLmNsaWVudFg7XG4gICAgX21vdmVZID0gZS5jbGllbnRZO1xuXG4gICAgdmFyIGlnbm9yZSA9IHdoaWNoTW91c2VCdXR0b24oZSkgIT09IDEgfHwgZS5tZXRhS2V5IHx8IGUuY3RybEtleTtcbiAgICBpZiAoaWdub3JlKSB7XG4gICAgICByZXR1cm47IC8vIHdlIG9ubHkgY2FyZSBhYm91dCBob25lc3QtdG8tZ29kIGxlZnQgY2xpY2tzIGFuZCB0b3VjaCBldmVudHNcbiAgICB9XG4gICAgdmFyIGl0ZW0gPSBlLnRhcmdldDtcbiAgICB2YXIgY29udGV4dCA9IGNhblN0YXJ0KGl0ZW0pO1xuICAgIGlmICghY29udGV4dCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBfZ3JhYmJlZCA9IGNvbnRleHQ7XG4gICAgZXZlbnR1YWxNb3ZlbWVudHMoKTtcbiAgICBpZiAoZS50eXBlID09PSAnbW91c2Vkb3duJykge1xuICAgICAgaWYgKGlzSW5wdXQoaXRlbSkpIHsgLy8gc2VlIGFsc286IGh0dHBzOi8vZ2l0aHViLmNvbS9iZXZhY3F1YS9kcmFndWxhL2lzc3Vlcy8yMDhcbiAgICAgICAgaXRlbS5mb2N1cygpOyAvLyBmaXhlcyBodHRwczovL2dpdGh1Yi5jb20vYmV2YWNxdWEvZHJhZ3VsYS9pc3N1ZXMvMTc2XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7IC8vIGZpeGVzIGh0dHBzOi8vZ2l0aHViLmNvbS9iZXZhY3F1YS9kcmFndWxhL2lzc3Vlcy8xNTVcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBmdW5jdGlvbiBzdGFydEJlY2F1c2VNb3VzZU1vdmVkIChlKSB7XG4gICAgaWYgKCFfZ3JhYmJlZCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAod2hpY2hNb3VzZUJ1dHRvbihlKSA9PT0gMCkge1xuICAgICAgcmVsZWFzZSh7fSk7XG4gICAgICByZXR1cm47IC8vIHdoZW4gdGV4dCBpcyBzZWxlY3RlZCBvbiBhbiBpbnB1dCBhbmQgdGhlbiBkcmFnZ2VkLCBtb3VzZXVwIGRvZXNuJ3QgZmlyZS4gdGhpcyBpcyBvdXIgb25seSBob3BlXG4gICAgfVxuICAgIC8vIHRydXRoeSBjaGVjayBmaXhlcyAjMjM5LCBlcXVhbGl0eSBmaXhlcyAjMjA3XG4gICAgaWYgKGUuY2xpZW50WCAhPT0gdm9pZCAwICYmIGUuY2xpZW50WCA9PT0gX21vdmVYICYmIGUuY2xpZW50WSAhPT0gdm9pZCAwICYmIGUuY2xpZW50WSA9PT0gX21vdmVZKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGlmIChvLmlnbm9yZUlucHV0VGV4dFNlbGVjdGlvbikge1xuICAgICAgdmFyIGNsaWVudFggPSBnZXRDb29yZCgnY2xpZW50WCcsIGUpO1xuICAgICAgdmFyIGNsaWVudFkgPSBnZXRDb29yZCgnY2xpZW50WScsIGUpO1xuICAgICAgdmFyIGVsZW1lbnRCZWhpbmRDdXJzb3IgPSBkb2MuZWxlbWVudEZyb21Qb2ludChjbGllbnRYLCBjbGllbnRZKTtcbiAgICAgIGlmIChpc0lucHV0KGVsZW1lbnRCZWhpbmRDdXJzb3IpKSB7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cbiAgICB9XG5cbiAgICB2YXIgZ3JhYmJlZCA9IF9ncmFiYmVkOyAvLyBjYWxsIHRvIGVuZCgpIHVuc2V0cyBfZ3JhYmJlZFxuICAgIGV2ZW50dWFsTW92ZW1lbnRzKHRydWUpO1xuICAgIG1vdmVtZW50cygpO1xuICAgIGVuZCgpO1xuICAgIHN0YXJ0KGdyYWJiZWQpO1xuXG4gICAgdmFyIG9mZnNldCA9IGdldE9mZnNldChfaXRlbSk7XG4gICAgX29mZnNldFggPSBnZXRDb29yZCgncGFnZVgnLCBlKSAtIG9mZnNldC5sZWZ0O1xuICAgIF9vZmZzZXRZID0gZ2V0Q29vcmQoJ3BhZ2VZJywgZSkgLSBvZmZzZXQudG9wO1xuXG4gICAgY2xhc3Nlcy5hZGQoX2NvcHkgfHwgX2l0ZW0sICdndS10cmFuc2l0Jyk7XG4gICAgcmVuZGVyTWlycm9ySW1hZ2UoKTtcbiAgICBkcmFnKGUpO1xuICB9XG5cbiAgZnVuY3Rpb24gY2FuU3RhcnQgKGl0ZW0pIHtcbiAgICBpZiAoZHJha2UuZHJhZ2dpbmcgJiYgX21pcnJvcikge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAoaXNDb250YWluZXIoaXRlbSkpIHtcbiAgICAgIHJldHVybjsgLy8gZG9uJ3QgZHJhZyBjb250YWluZXIgaXRzZWxmXG4gICAgfVxuICAgIHZhciBoYW5kbGUgPSBpdGVtO1xuICAgIHdoaWxlIChnZXRQYXJlbnQoaXRlbSkgJiYgaXNDb250YWluZXIoZ2V0UGFyZW50KGl0ZW0pKSA9PT0gZmFsc2UpIHtcbiAgICAgIGlmIChvLmludmFsaWQoaXRlbSwgaGFuZGxlKSkge1xuICAgICAgICByZXR1cm47XG4gICAgICB9XG4gICAgICBpdGVtID0gZ2V0UGFyZW50KGl0ZW0pOyAvLyBkcmFnIHRhcmdldCBzaG91bGQgYmUgYSB0b3AgZWxlbWVudFxuICAgICAgaWYgKCFpdGVtKSB7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cbiAgICB9XG4gICAgdmFyIHNvdXJjZSA9IGdldFBhcmVudChpdGVtKTtcbiAgICBpZiAoIXNvdXJjZSkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAoby5pbnZhbGlkKGl0ZW0sIGhhbmRsZSkpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB2YXIgbW92YWJsZSA9IG8ubW92ZXMoaXRlbSwgc291cmNlLCBoYW5kbGUsIG5leHRFbChpdGVtKSk7XG4gICAgaWYgKCFtb3ZhYmxlKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgcmV0dXJuIHtcbiAgICAgIGl0ZW06IGl0ZW0sXG4gICAgICBzb3VyY2U6IHNvdXJjZVxuICAgIH07XG4gIH1cblxuICBmdW5jdGlvbiBjYW5Nb3ZlIChpdGVtKSB7XG4gICAgcmV0dXJuICEhY2FuU3RhcnQoaXRlbSk7XG4gIH1cblxuICBmdW5jdGlvbiBtYW51YWxTdGFydCAoaXRlbSkge1xuICAgIHZhciBjb250ZXh0ID0gY2FuU3RhcnQoaXRlbSk7XG4gICAgaWYgKGNvbnRleHQpIHtcbiAgICAgIHN0YXJ0KGNvbnRleHQpO1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIHN0YXJ0IChjb250ZXh0KSB7XG4gICAgaWYgKGlzQ29weShjb250ZXh0Lml0ZW0sIGNvbnRleHQuc291cmNlKSkge1xuICAgICAgX2NvcHkgPSBjb250ZXh0Lml0ZW0uY2xvbmVOb2RlKHRydWUpO1xuICAgICAgZHJha2UuZW1pdCgnY2xvbmVkJywgX2NvcHksIGNvbnRleHQuaXRlbSwgJ2NvcHknKTtcbiAgICB9XG5cbiAgICBfc291cmNlID0gY29udGV4dC5zb3VyY2U7XG4gICAgX2l0ZW0gPSBjb250ZXh0Lml0ZW07XG4gICAgX2luaXRpYWxTaWJsaW5nID0gX2N1cnJlbnRTaWJsaW5nID0gbmV4dEVsKGNvbnRleHQuaXRlbSk7XG5cbiAgICBkcmFrZS5kcmFnZ2luZyA9IHRydWU7XG4gICAgZHJha2UuZW1pdCgnZHJhZycsIF9pdGVtLCBfc291cmNlKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIGludmFsaWRUYXJnZXQgKCkge1xuICAgIHJldHVybiBmYWxzZTtcbiAgfVxuXG4gIGZ1bmN0aW9uIGVuZCAoKSB7XG4gICAgaWYgKCFkcmFrZS5kcmFnZ2luZykge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB2YXIgaXRlbSA9IF9jb3B5IHx8IF9pdGVtO1xuICAgIGRyb3AoaXRlbSwgZ2V0UGFyZW50KGl0ZW0pKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIHVuZ3JhYiAoKSB7XG4gICAgX2dyYWJiZWQgPSBmYWxzZTtcbiAgICBldmVudHVhbE1vdmVtZW50cyh0cnVlKTtcbiAgICBtb3ZlbWVudHModHJ1ZSk7XG4gIH1cblxuICBmdW5jdGlvbiByZWxlYXNlIChlKSB7XG4gICAgdW5ncmFiKCk7XG5cbiAgICBpZiAoIWRyYWtlLmRyYWdnaW5nKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHZhciBpdGVtID0gX2NvcHkgfHwgX2l0ZW07XG4gICAgdmFyIGNsaWVudFggPSBnZXRDb29yZCgnY2xpZW50WCcsIGUpO1xuICAgIHZhciBjbGllbnRZID0gZ2V0Q29vcmQoJ2NsaWVudFknLCBlKTtcbiAgICB2YXIgZWxlbWVudEJlaGluZEN1cnNvciA9IGdldEVsZW1lbnRCZWhpbmRQb2ludChfbWlycm9yLCBjbGllbnRYLCBjbGllbnRZKTtcbiAgICB2YXIgZHJvcFRhcmdldCA9IGZpbmREcm9wVGFyZ2V0KGVsZW1lbnRCZWhpbmRDdXJzb3IsIGNsaWVudFgsIGNsaWVudFkpO1xuICAgIGlmIChkcm9wVGFyZ2V0ICYmICgoX2NvcHkgJiYgby5jb3B5U29ydFNvdXJjZSkgfHwgKCFfY29weSB8fCBkcm9wVGFyZ2V0ICE9PSBfc291cmNlKSkpIHtcbiAgICAgIGRyb3AoaXRlbSwgZHJvcFRhcmdldCk7XG4gICAgfSBlbHNlIGlmIChvLnJlbW92ZU9uU3BpbGwpIHtcbiAgICAgIHJlbW92ZSgpO1xuICAgIH0gZWxzZSB7XG4gICAgICBjYW5jZWwoKTtcbiAgICB9XG4gIH1cblxuICBmdW5jdGlvbiBkcm9wIChpdGVtLCB0YXJnZXQpIHtcbiAgICB2YXIgcGFyZW50ID0gZ2V0UGFyZW50KGl0ZW0pO1xuICAgIGlmIChfY29weSAmJiBvLmNvcHlTb3J0U291cmNlICYmIHRhcmdldCA9PT0gX3NvdXJjZSkge1xuICAgICAgcGFyZW50LnJlbW92ZUNoaWxkKF9pdGVtKTtcbiAgICB9XG4gICAgaWYgKGlzSW5pdGlhbFBsYWNlbWVudCh0YXJnZXQpKSB7XG4gICAgICBkcmFrZS5lbWl0KCdjYW5jZWwnLCBpdGVtLCBfc291cmNlLCBfc291cmNlKTtcbiAgICB9IGVsc2Uge1xuICAgICAgZHJha2UuZW1pdCgnZHJvcCcsIGl0ZW0sIHRhcmdldCwgX3NvdXJjZSwgX2N1cnJlbnRTaWJsaW5nKTtcbiAgICB9XG4gICAgY2xlYW51cCgpO1xuICB9XG5cbiAgZnVuY3Rpb24gcmVtb3ZlICgpIHtcbiAgICBpZiAoIWRyYWtlLmRyYWdnaW5nKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHZhciBpdGVtID0gX2NvcHkgfHwgX2l0ZW07XG4gICAgdmFyIHBhcmVudCA9IGdldFBhcmVudChpdGVtKTtcbiAgICBpZiAocGFyZW50KSB7XG4gICAgICBwYXJlbnQucmVtb3ZlQ2hpbGQoaXRlbSk7XG4gICAgfVxuICAgIGRyYWtlLmVtaXQoX2NvcHkgPyAnY2FuY2VsJyA6ICdyZW1vdmUnLCBpdGVtLCBwYXJlbnQsIF9zb3VyY2UpO1xuICAgIGNsZWFudXAoKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIGNhbmNlbCAocmV2ZXJ0KSB7XG4gICAgaWYgKCFkcmFrZS5kcmFnZ2luZykge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB2YXIgcmV2ZXJ0cyA9IGFyZ3VtZW50cy5sZW5ndGggPiAwID8gcmV2ZXJ0IDogby5yZXZlcnRPblNwaWxsO1xuICAgIHZhciBpdGVtID0gX2NvcHkgfHwgX2l0ZW07XG4gICAgdmFyIHBhcmVudCA9IGdldFBhcmVudChpdGVtKTtcbiAgICB2YXIgaW5pdGlhbCA9IGlzSW5pdGlhbFBsYWNlbWVudChwYXJlbnQpO1xuICAgIGlmIChpbml0aWFsID09PSBmYWxzZSAmJiByZXZlcnRzKSB7XG4gICAgICBpZiAoX2NvcHkpIHtcbiAgICAgICAgaWYgKHBhcmVudCkge1xuICAgICAgICAgIHBhcmVudC5yZW1vdmVDaGlsZChfY29weSk7XG4gICAgICAgIH1cbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIF9zb3VyY2UuaW5zZXJ0QmVmb3JlKGl0ZW0sIF9pbml0aWFsU2libGluZyk7XG4gICAgICB9XG4gICAgfVxuICAgIGlmIChpbml0aWFsIHx8IHJldmVydHMpIHtcbiAgICAgIGRyYWtlLmVtaXQoJ2NhbmNlbCcsIGl0ZW0sIF9zb3VyY2UsIF9zb3VyY2UpO1xuICAgIH0gZWxzZSB7XG4gICAgICBkcmFrZS5lbWl0KCdkcm9wJywgaXRlbSwgcGFyZW50LCBfc291cmNlLCBfY3VycmVudFNpYmxpbmcpO1xuICAgIH1cbiAgICBjbGVhbnVwKCk7XG4gIH1cblxuICBmdW5jdGlvbiBjbGVhbnVwICgpIHtcbiAgICB2YXIgaXRlbSA9IF9jb3B5IHx8IF9pdGVtO1xuICAgIHVuZ3JhYigpO1xuICAgIHJlbW92ZU1pcnJvckltYWdlKCk7XG4gICAgaWYgKGl0ZW0pIHtcbiAgICAgIGNsYXNzZXMucm0oaXRlbSwgJ2d1LXRyYW5zaXQnKTtcbiAgICB9XG4gICAgaWYgKF9yZW5kZXJUaW1lcikge1xuICAgICAgY2xlYXJUaW1lb3V0KF9yZW5kZXJUaW1lcik7XG4gICAgfVxuICAgIGRyYWtlLmRyYWdnaW5nID0gZmFsc2U7XG4gICAgaWYgKF9sYXN0RHJvcFRhcmdldCkge1xuICAgICAgZHJha2UuZW1pdCgnb3V0JywgaXRlbSwgX2xhc3REcm9wVGFyZ2V0LCBfc291cmNlKTtcbiAgICB9XG4gICAgZHJha2UuZW1pdCgnZHJhZ2VuZCcsIGl0ZW0pO1xuICAgIF9zb3VyY2UgPSBfaXRlbSA9IF9jb3B5ID0gX2luaXRpYWxTaWJsaW5nID0gX2N1cnJlbnRTaWJsaW5nID0gX3JlbmRlclRpbWVyID0gX2xhc3REcm9wVGFyZ2V0ID0gbnVsbDtcbiAgfVxuXG4gIGZ1bmN0aW9uIGlzSW5pdGlhbFBsYWNlbWVudCAodGFyZ2V0LCBzKSB7XG4gICAgdmFyIHNpYmxpbmc7XG4gICAgaWYgKHMgIT09IHZvaWQgMCkge1xuICAgICAgc2libGluZyA9IHM7XG4gICAgfSBlbHNlIGlmIChfbWlycm9yKSB7XG4gICAgICBzaWJsaW5nID0gX2N1cnJlbnRTaWJsaW5nO1xuICAgIH0gZWxzZSB7XG4gICAgICBzaWJsaW5nID0gbmV4dEVsKF9jb3B5IHx8IF9pdGVtKTtcbiAgICB9XG4gICAgcmV0dXJuIHRhcmdldCA9PT0gX3NvdXJjZSAmJiBzaWJsaW5nID09PSBfaW5pdGlhbFNpYmxpbmc7XG4gIH1cblxuICBmdW5jdGlvbiBmaW5kRHJvcFRhcmdldCAoZWxlbWVudEJlaGluZEN1cnNvciwgY2xpZW50WCwgY2xpZW50WSkge1xuICAgIHZhciB0YXJnZXQgPSBlbGVtZW50QmVoaW5kQ3Vyc29yO1xuICAgIHdoaWxlICh0YXJnZXQgJiYgIWFjY2VwdGVkKCkpIHtcbiAgICAgIHRhcmdldCA9IGdldFBhcmVudCh0YXJnZXQpO1xuICAgIH1cbiAgICByZXR1cm4gdGFyZ2V0O1xuXG4gICAgZnVuY3Rpb24gYWNjZXB0ZWQgKCkge1xuICAgICAgdmFyIGRyb3BwYWJsZSA9IGlzQ29udGFpbmVyKHRhcmdldCk7XG4gICAgICBpZiAoZHJvcHBhYmxlID09PSBmYWxzZSkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG5cbiAgICAgIHZhciBpbW1lZGlhdGUgPSBnZXRJbW1lZGlhdGVDaGlsZCh0YXJnZXQsIGVsZW1lbnRCZWhpbmRDdXJzb3IpO1xuICAgICAgdmFyIHJlZmVyZW5jZSA9IGdldFJlZmVyZW5jZSh0YXJnZXQsIGltbWVkaWF0ZSwgY2xpZW50WCwgY2xpZW50WSk7XG4gICAgICB2YXIgaW5pdGlhbCA9IGlzSW5pdGlhbFBsYWNlbWVudCh0YXJnZXQsIHJlZmVyZW5jZSk7XG4gICAgICBpZiAoaW5pdGlhbCkge1xuICAgICAgICByZXR1cm4gdHJ1ZTsgLy8gc2hvdWxkIGFsd2F5cyBiZSBhYmxlIHRvIGRyb3AgaXQgcmlnaHQgYmFjayB3aGVyZSBpdCB3YXNcbiAgICAgIH1cbiAgICAgIHJldHVybiBvLmFjY2VwdHMoX2l0ZW0sIHRhcmdldCwgX3NvdXJjZSwgcmVmZXJlbmNlKTtcbiAgICB9XG4gIH1cblxuICBmdW5jdGlvbiBkcmFnIChlKSB7XG4gICAgaWYgKCFfbWlycm9yKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGUucHJldmVudERlZmF1bHQoKTtcblxuICAgIHZhciBjbGllbnRYID0gZ2V0Q29vcmQoJ2NsaWVudFgnLCBlKTtcbiAgICB2YXIgY2xpZW50WSA9IGdldENvb3JkKCdjbGllbnRZJywgZSk7XG4gICAgdmFyIHggPSBjbGllbnRYIC0gX29mZnNldFg7XG4gICAgdmFyIHkgPSBjbGllbnRZIC0gX29mZnNldFk7XG5cbiAgICBfbWlycm9yLnN0eWxlLmxlZnQgPSB4ICsgJ3B4JztcbiAgICBfbWlycm9yLnN0eWxlLnRvcCA9IHkgKyAncHgnO1xuXG4gICAgdmFyIGl0ZW0gPSBfY29weSB8fCBfaXRlbTtcbiAgICB2YXIgZWxlbWVudEJlaGluZEN1cnNvciA9IGdldEVsZW1lbnRCZWhpbmRQb2ludChfbWlycm9yLCBjbGllbnRYLCBjbGllbnRZKTtcbiAgICB2YXIgZHJvcFRhcmdldCA9IGZpbmREcm9wVGFyZ2V0KGVsZW1lbnRCZWhpbmRDdXJzb3IsIGNsaWVudFgsIGNsaWVudFkpO1xuICAgIHZhciBjaGFuZ2VkID0gZHJvcFRhcmdldCAhPT0gbnVsbCAmJiBkcm9wVGFyZ2V0ICE9PSBfbGFzdERyb3BUYXJnZXQ7XG4gICAgaWYgKGNoYW5nZWQgfHwgZHJvcFRhcmdldCA9PT0gbnVsbCkge1xuICAgICAgb3V0KCk7XG4gICAgICBfbGFzdERyb3BUYXJnZXQgPSBkcm9wVGFyZ2V0O1xuICAgICAgb3ZlcigpO1xuICAgIH1cbiAgICB2YXIgcGFyZW50ID0gZ2V0UGFyZW50KGl0ZW0pO1xuICAgIGlmIChkcm9wVGFyZ2V0ID09PSBfc291cmNlICYmIF9jb3B5ICYmICFvLmNvcHlTb3J0U291cmNlKSB7XG4gICAgICBpZiAocGFyZW50KSB7XG4gICAgICAgIHBhcmVudC5yZW1vdmVDaGlsZChpdGVtKTtcbiAgICAgIH1cbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdmFyIHJlZmVyZW5jZTtcbiAgICB2YXIgaW1tZWRpYXRlID0gZ2V0SW1tZWRpYXRlQ2hpbGQoZHJvcFRhcmdldCwgZWxlbWVudEJlaGluZEN1cnNvcik7XG4gICAgaWYgKGltbWVkaWF0ZSAhPT0gbnVsbCkge1xuICAgICAgcmVmZXJlbmNlID0gZ2V0UmVmZXJlbmNlKGRyb3BUYXJnZXQsIGltbWVkaWF0ZSwgY2xpZW50WCwgY2xpZW50WSk7XG4gICAgfSBlbHNlIGlmIChvLnJldmVydE9uU3BpbGwgPT09IHRydWUgJiYgIV9jb3B5KSB7XG4gICAgICByZWZlcmVuY2UgPSBfaW5pdGlhbFNpYmxpbmc7XG4gICAgICBkcm9wVGFyZ2V0ID0gX3NvdXJjZTtcbiAgICB9IGVsc2Uge1xuICAgICAgaWYgKF9jb3B5ICYmIHBhcmVudCkge1xuICAgICAgICBwYXJlbnQucmVtb3ZlQ2hpbGQoaXRlbSk7XG4gICAgICB9XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGlmIChcbiAgICAgIChyZWZlcmVuY2UgPT09IG51bGwgJiYgY2hhbmdlZCkgfHxcbiAgICAgIHJlZmVyZW5jZSAhPT0gaXRlbSAmJlxuICAgICAgcmVmZXJlbmNlICE9PSBuZXh0RWwoaXRlbSlcbiAgICApIHtcbiAgICAgIF9jdXJyZW50U2libGluZyA9IHJlZmVyZW5jZTtcbiAgICAgIGRyb3BUYXJnZXQuaW5zZXJ0QmVmb3JlKGl0ZW0sIHJlZmVyZW5jZSk7XG4gICAgICBkcmFrZS5lbWl0KCdzaGFkb3cnLCBpdGVtLCBkcm9wVGFyZ2V0LCBfc291cmNlKTtcbiAgICB9XG4gICAgZnVuY3Rpb24gbW92ZWQgKHR5cGUpIHsgZHJha2UuZW1pdCh0eXBlLCBpdGVtLCBfbGFzdERyb3BUYXJnZXQsIF9zb3VyY2UpOyB9XG4gICAgZnVuY3Rpb24gb3ZlciAoKSB7IGlmIChjaGFuZ2VkKSB7IG1vdmVkKCdvdmVyJyk7IH0gfVxuICAgIGZ1bmN0aW9uIG91dCAoKSB7IGlmIChfbGFzdERyb3BUYXJnZXQpIHsgbW92ZWQoJ291dCcpOyB9IH1cbiAgfVxuXG4gIGZ1bmN0aW9uIHNwaWxsT3ZlciAoZWwpIHtcbiAgICBjbGFzc2VzLnJtKGVsLCAnZ3UtaGlkZScpO1xuICB9XG5cbiAgZnVuY3Rpb24gc3BpbGxPdXQgKGVsKSB7XG4gICAgaWYgKGRyYWtlLmRyYWdnaW5nKSB7IGNsYXNzZXMuYWRkKGVsLCAnZ3UtaGlkZScpOyB9XG4gIH1cblxuICBmdW5jdGlvbiByZW5kZXJNaXJyb3JJbWFnZSAoKSB7XG4gICAgaWYgKF9taXJyb3IpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdmFyIHJlY3QgPSBfaXRlbS5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgICBfbWlycm9yID0gX2l0ZW0uY2xvbmVOb2RlKHRydWUpO1xuICAgIF9taXJyb3Iuc3R5bGUud2lkdGggPSBnZXRSZWN0V2lkdGgocmVjdCkgKyAncHgnO1xuICAgIF9taXJyb3Iuc3R5bGUuaGVpZ2h0ID0gZ2V0UmVjdEhlaWdodChyZWN0KSArICdweCc7XG4gICAgY2xhc3Nlcy5ybShfbWlycm9yLCAnZ3UtdHJhbnNpdCcpO1xuICAgIGNsYXNzZXMuYWRkKF9taXJyb3IsICdndS1taXJyb3InKTtcbiAgICBvLm1pcnJvckNvbnRhaW5lci5hcHBlbmRDaGlsZChfbWlycm9yKTtcbiAgICB0b3VjaHkoZG9jdW1lbnRFbGVtZW50LCAnYWRkJywgJ21vdXNlbW92ZScsIGRyYWcpO1xuICAgIGNsYXNzZXMuYWRkKG8ubWlycm9yQ29udGFpbmVyLCAnZ3UtdW5zZWxlY3RhYmxlJyk7XG4gICAgZHJha2UuZW1pdCgnY2xvbmVkJywgX21pcnJvciwgX2l0ZW0sICdtaXJyb3InKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIHJlbW92ZU1pcnJvckltYWdlICgpIHtcbiAgICBpZiAoX21pcnJvcikge1xuICAgICAgY2xhc3Nlcy5ybShvLm1pcnJvckNvbnRhaW5lciwgJ2d1LXVuc2VsZWN0YWJsZScpO1xuICAgICAgdG91Y2h5KGRvY3VtZW50RWxlbWVudCwgJ3JlbW92ZScsICdtb3VzZW1vdmUnLCBkcmFnKTtcbiAgICAgIGdldFBhcmVudChfbWlycm9yKS5yZW1vdmVDaGlsZChfbWlycm9yKTtcbiAgICAgIF9taXJyb3IgPSBudWxsO1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIGdldEltbWVkaWF0ZUNoaWxkIChkcm9wVGFyZ2V0LCB0YXJnZXQpIHtcbiAgICB2YXIgaW1tZWRpYXRlID0gdGFyZ2V0O1xuICAgIHdoaWxlIChpbW1lZGlhdGUgIT09IGRyb3BUYXJnZXQgJiYgZ2V0UGFyZW50KGltbWVkaWF0ZSkgIT09IGRyb3BUYXJnZXQpIHtcbiAgICAgIGltbWVkaWF0ZSA9IGdldFBhcmVudChpbW1lZGlhdGUpO1xuICAgIH1cbiAgICBpZiAoaW1tZWRpYXRlID09PSBkb2N1bWVudEVsZW1lbnQpIHtcbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cbiAgICByZXR1cm4gaW1tZWRpYXRlO1xuICB9XG5cbiAgZnVuY3Rpb24gZ2V0UmVmZXJlbmNlIChkcm9wVGFyZ2V0LCB0YXJnZXQsIHgsIHkpIHtcbiAgICB2YXIgaG9yaXpvbnRhbCA9IG8uZGlyZWN0aW9uID09PSAnaG9yaXpvbnRhbCc7XG4gICAgdmFyIHJlZmVyZW5jZSA9IHRhcmdldCAhPT0gZHJvcFRhcmdldCA/IGluc2lkZSgpIDogb3V0c2lkZSgpO1xuICAgIHJldHVybiByZWZlcmVuY2U7XG5cbiAgICBmdW5jdGlvbiBvdXRzaWRlICgpIHsgLy8gc2xvd2VyLCBidXQgYWJsZSB0byBmaWd1cmUgb3V0IGFueSBwb3NpdGlvblxuICAgICAgdmFyIGxlbiA9IGRyb3BUYXJnZXQuY2hpbGRyZW4ubGVuZ3RoO1xuICAgICAgdmFyIGk7XG4gICAgICB2YXIgZWw7XG4gICAgICB2YXIgcmVjdDtcbiAgICAgIGZvciAoaSA9IDA7IGkgPCBsZW47IGkrKykge1xuICAgICAgICBlbCA9IGRyb3BUYXJnZXQuY2hpbGRyZW5baV07XG4gICAgICAgIHJlY3QgPSBlbC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgICAgICAgaWYgKGhvcml6b250YWwgJiYgKHJlY3QubGVmdCArIHJlY3Qud2lkdGggLyAyKSA+IHgpIHsgcmV0dXJuIGVsOyB9XG4gICAgICAgIGlmICghaG9yaXpvbnRhbCAmJiAocmVjdC50b3AgKyByZWN0LmhlaWdodCAvIDIpID4geSkgeyByZXR1cm4gZWw7IH1cbiAgICAgIH1cbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cblxuICAgIGZ1bmN0aW9uIGluc2lkZSAoKSB7IC8vIGZhc3RlciwgYnV0IG9ubHkgYXZhaWxhYmxlIGlmIGRyb3BwZWQgaW5zaWRlIGEgY2hpbGQgZWxlbWVudFxuICAgICAgdmFyIHJlY3QgPSB0YXJnZXQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG4gICAgICBpZiAoaG9yaXpvbnRhbCkge1xuICAgICAgICByZXR1cm4gcmVzb2x2ZSh4ID4gcmVjdC5sZWZ0ICsgZ2V0UmVjdFdpZHRoKHJlY3QpIC8gMik7XG4gICAgICB9XG4gICAgICByZXR1cm4gcmVzb2x2ZSh5ID4gcmVjdC50b3AgKyBnZXRSZWN0SGVpZ2h0KHJlY3QpIC8gMik7XG4gICAgfVxuXG4gICAgZnVuY3Rpb24gcmVzb2x2ZSAoYWZ0ZXIpIHtcbiAgICAgIHJldHVybiBhZnRlciA/IG5leHRFbCh0YXJnZXQpIDogdGFyZ2V0O1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIGlzQ29weSAoaXRlbSwgY29udGFpbmVyKSB7XG4gICAgcmV0dXJuIHR5cGVvZiBvLmNvcHkgPT09ICdib29sZWFuJyA/IG8uY29weSA6IG8uY29weShpdGVtLCBjb250YWluZXIpO1xuICB9XG59XG5cbmZ1bmN0aW9uIHRvdWNoeSAoZWwsIG9wLCB0eXBlLCBmbikge1xuICB2YXIgdG91Y2ggPSB7XG4gICAgbW91c2V1cDogJ3RvdWNoZW5kJyxcbiAgICBtb3VzZWRvd246ICd0b3VjaHN0YXJ0JyxcbiAgICBtb3VzZW1vdmU6ICd0b3VjaG1vdmUnXG4gIH07XG4gIHZhciBwb2ludGVycyA9IHtcbiAgICBtb3VzZXVwOiAncG9pbnRlcnVwJyxcbiAgICBtb3VzZWRvd246ICdwb2ludGVyZG93bicsXG4gICAgbW91c2Vtb3ZlOiAncG9pbnRlcm1vdmUnXG4gIH07XG4gIHZhciBtaWNyb3NvZnQgPSB7XG4gICAgbW91c2V1cDogJ01TUG9pbnRlclVwJyxcbiAgICBtb3VzZWRvd246ICdNU1BvaW50ZXJEb3duJyxcbiAgICBtb3VzZW1vdmU6ICdNU1BvaW50ZXJNb3ZlJ1xuICB9O1xuICBpZiAoZ2xvYmFsLm5hdmlnYXRvci5wb2ludGVyRW5hYmxlZCkge1xuICAgIGNyb3NzdmVudFtvcF0oZWwsIHBvaW50ZXJzW3R5cGVdLCBmbik7XG4gIH0gZWxzZSBpZiAoZ2xvYmFsLm5hdmlnYXRvci5tc1BvaW50ZXJFbmFibGVkKSB7XG4gICAgY3Jvc3N2ZW50W29wXShlbCwgbWljcm9zb2Z0W3R5cGVdLCBmbik7XG4gIH0gZWxzZSB7XG4gICAgY3Jvc3N2ZW50W29wXShlbCwgdG91Y2hbdHlwZV0sIGZuKTtcbiAgICBjcm9zc3ZlbnRbb3BdKGVsLCB0eXBlLCBmbik7XG4gIH1cbn1cblxuZnVuY3Rpb24gd2hpY2hNb3VzZUJ1dHRvbiAoZSkge1xuICBpZiAoZS50b3VjaGVzICE9PSB2b2lkIDApIHsgcmV0dXJuIGUudG91Y2hlcy5sZW5ndGg7IH1cbiAgaWYgKGUud2hpY2ggIT09IHZvaWQgMCAmJiBlLndoaWNoICE9PSAwKSB7IHJldHVybiBlLndoaWNoOyB9IC8vIHNlZSBodHRwczovL2dpdGh1Yi5jb20vYmV2YWNxdWEvZHJhZ3VsYS9pc3N1ZXMvMjYxXG4gIGlmIChlLmJ1dHRvbnMgIT09IHZvaWQgMCkgeyByZXR1cm4gZS5idXR0b25zOyB9XG4gIHZhciBidXR0b24gPSBlLmJ1dHRvbjtcbiAgaWYgKGJ1dHRvbiAhPT0gdm9pZCAwKSB7IC8vIHNlZSBodHRwczovL2dpdGh1Yi5jb20vanF1ZXJ5L2pxdWVyeS9ibG9iLzk5ZThmZjFiYWE3YWUzNDFlOTRiYjg5YzNlODQ1NzBjN2MzYWQ5ZWEvc3JjL2V2ZW50LmpzI0w1NzMtTDU3NVxuICAgIHJldHVybiBidXR0b24gJiAxID8gMSA6IGJ1dHRvbiAmIDIgPyAzIDogKGJ1dHRvbiAmIDQgPyAyIDogMCk7XG4gIH1cbn1cblxuZnVuY3Rpb24gZ2V0T2Zmc2V0IChlbCkge1xuICB2YXIgcmVjdCA9IGVsLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICByZXR1cm4ge1xuICAgIGxlZnQ6IHJlY3QubGVmdCArIGdldFNjcm9sbCgnc2Nyb2xsTGVmdCcsICdwYWdlWE9mZnNldCcpLFxuICAgIHRvcDogcmVjdC50b3AgKyBnZXRTY3JvbGwoJ3Njcm9sbFRvcCcsICdwYWdlWU9mZnNldCcpXG4gIH07XG59XG5cbmZ1bmN0aW9uIGdldFNjcm9sbCAoc2Nyb2xsUHJvcCwgb2Zmc2V0UHJvcCkge1xuICBpZiAodHlwZW9mIGdsb2JhbFtvZmZzZXRQcm9wXSAhPT0gJ3VuZGVmaW5lZCcpIHtcbiAgICByZXR1cm4gZ2xvYmFsW29mZnNldFByb3BdO1xuICB9XG4gIGlmIChkb2N1bWVudEVsZW1lbnQuY2xpZW50SGVpZ2h0KSB7XG4gICAgcmV0dXJuIGRvY3VtZW50RWxlbWVudFtzY3JvbGxQcm9wXTtcbiAgfVxuICByZXR1cm4gZG9jLmJvZHlbc2Nyb2xsUHJvcF07XG59XG5cbmZ1bmN0aW9uIGdldEVsZW1lbnRCZWhpbmRQb2ludCAocG9pbnQsIHgsIHkpIHtcbiAgdmFyIHAgPSBwb2ludCB8fCB7fTtcbiAgdmFyIHN0YXRlID0gcC5jbGFzc05hbWU7XG4gIHZhciBlbDtcbiAgcC5jbGFzc05hbWUgKz0gJyBndS1oaWRlJztcbiAgZWwgPSBkb2MuZWxlbWVudEZyb21Qb2ludCh4LCB5KTtcbiAgcC5jbGFzc05hbWUgPSBzdGF0ZTtcbiAgcmV0dXJuIGVsO1xufVxuXG5mdW5jdGlvbiBuZXZlciAoKSB7IHJldHVybiBmYWxzZTsgfVxuZnVuY3Rpb24gYWx3YXlzICgpIHsgcmV0dXJuIHRydWU7IH1cbmZ1bmN0aW9uIGdldFJlY3RXaWR0aCAocmVjdCkgeyByZXR1cm4gcmVjdC53aWR0aCB8fCAocmVjdC5yaWdodCAtIHJlY3QubGVmdCk7IH1cbmZ1bmN0aW9uIGdldFJlY3RIZWlnaHQgKHJlY3QpIHsgcmV0dXJuIHJlY3QuaGVpZ2h0IHx8IChyZWN0LmJvdHRvbSAtIHJlY3QudG9wKTsgfVxuZnVuY3Rpb24gZ2V0UGFyZW50IChlbCkgeyByZXR1cm4gZWwucGFyZW50Tm9kZSA9PT0gZG9jID8gbnVsbCA6IGVsLnBhcmVudE5vZGU7IH1cbmZ1bmN0aW9uIGlzSW5wdXQgKGVsKSB7IHJldHVybiBlbC50YWdOYW1lID09PSAnSU5QVVQnIHx8IGVsLnRhZ05hbWUgPT09ICdURVhUQVJFQScgfHwgZWwudGFnTmFtZSA9PT0gJ1NFTEVDVCcgfHwgaXNFZGl0YWJsZShlbCk7IH1cbmZ1bmN0aW9uIGlzRWRpdGFibGUgKGVsKSB7XG4gIGlmICghZWwpIHsgcmV0dXJuIGZhbHNlOyB9IC8vIG5vIHBhcmVudHMgd2VyZSBlZGl0YWJsZVxuICBpZiAoZWwuY29udGVudEVkaXRhYmxlID09PSAnZmFsc2UnKSB7IHJldHVybiBmYWxzZTsgfSAvLyBzdG9wIHRoZSBsb29rdXBcbiAgaWYgKGVsLmNvbnRlbnRFZGl0YWJsZSA9PT0gJ3RydWUnKSB7IHJldHVybiB0cnVlOyB9IC8vIGZvdW5kIGEgY29udGVudEVkaXRhYmxlIGVsZW1lbnQgaW4gdGhlIGNoYWluXG4gIHJldHVybiBpc0VkaXRhYmxlKGdldFBhcmVudChlbCkpOyAvLyBjb250ZW50RWRpdGFibGUgaXMgc2V0IHRvICdpbmhlcml0J1xufVxuXG5mdW5jdGlvbiBuZXh0RWwgKGVsKSB7XG4gIHJldHVybiBlbC5uZXh0RWxlbWVudFNpYmxpbmcgfHwgbWFudWFsbHkoKTtcbiAgZnVuY3Rpb24gbWFudWFsbHkgKCkge1xuICAgIHZhciBzaWJsaW5nID0gZWw7XG4gICAgZG8ge1xuICAgICAgc2libGluZyA9IHNpYmxpbmcubmV4dFNpYmxpbmc7XG4gICAgfSB3aGlsZSAoc2libGluZyAmJiBzaWJsaW5nLm5vZGVUeXBlICE9PSAxKTtcbiAgICByZXR1cm4gc2libGluZztcbiAgfVxufVxuXG5mdW5jdGlvbiBnZXRFdmVudEhvc3QgKGUpIHtcbiAgLy8gb24gdG91Y2hlbmQgZXZlbnQsIHdlIGhhdmUgdG8gdXNlIGBlLmNoYW5nZWRUb3VjaGVzYFxuICAvLyBzZWUgaHR0cDovL3N0YWNrb3ZlcmZsb3cuY29tL3F1ZXN0aW9ucy83MTkyNTYzL3RvdWNoZW5kLWV2ZW50LXByb3BlcnRpZXNcbiAgLy8gc2VlIGh0dHBzOi8vZ2l0aHViLmNvbS9iZXZhY3F1YS9kcmFndWxhL2lzc3Vlcy8zNFxuICBpZiAoZS50YXJnZXRUb3VjaGVzICYmIGUudGFyZ2V0VG91Y2hlcy5sZW5ndGgpIHtcbiAgICByZXR1cm4gZS50YXJnZXRUb3VjaGVzWzBdO1xuICB9XG4gIGlmIChlLmNoYW5nZWRUb3VjaGVzICYmIGUuY2hhbmdlZFRvdWNoZXMubGVuZ3RoKSB7XG4gICAgcmV0dXJuIGUuY2hhbmdlZFRvdWNoZXNbMF07XG4gIH1cbiAgcmV0dXJuIGU7XG59XG5cbmZ1bmN0aW9uIGdldENvb3JkIChjb29yZCwgZSkge1xuICB2YXIgaG9zdCA9IGdldEV2ZW50SG9zdChlKTtcbiAgdmFyIG1pc3NNYXAgPSB7XG4gICAgcGFnZVg6ICdjbGllbnRYJywgLy8gSUU4XG4gICAgcGFnZVk6ICdjbGllbnRZJyAvLyBJRThcbiAgfTtcbiAgaWYgKGNvb3JkIGluIG1pc3NNYXAgJiYgIShjb29yZCBpbiBob3N0KSAmJiBtaXNzTWFwW2Nvb3JkXSBpbiBob3N0KSB7XG4gICAgY29vcmQgPSBtaXNzTWFwW2Nvb3JkXTtcbiAgfVxuICByZXR1cm4gaG9zdFtjb29yZF07XG59XG5cbm1vZHVsZS5leHBvcnRzID0gZHJhZ3VsYTtcbiIsIm1vZHVsZS5leHBvcnRzID0gZnVuY3Rpb24gYXRvYSAoYSwgbikgeyByZXR1cm4gQXJyYXkucHJvdG90eXBlLnNsaWNlLmNhbGwoYSwgbik7IH1cbiIsIid1c2Ugc3RyaWN0JztcblxudmFyIHRpY2t5ID0gcmVxdWlyZSgndGlja3knKTtcblxubW9kdWxlLmV4cG9ydHMgPSBmdW5jdGlvbiBkZWJvdW5jZSAoZm4sIGFyZ3MsIGN0eCkge1xuICBpZiAoIWZuKSB7IHJldHVybjsgfVxuICB0aWNreShmdW5jdGlvbiBydW4gKCkge1xuICAgIGZuLmFwcGx5KGN0eCB8fCBudWxsLCBhcmdzIHx8IFtdKTtcbiAgfSk7XG59O1xuIiwiJ3VzZSBzdHJpY3QnO1xuXG52YXIgYXRvYSA9IHJlcXVpcmUoJ2F0b2EnKTtcbnZhciBkZWJvdW5jZSA9IHJlcXVpcmUoJy4vZGVib3VuY2UnKTtcblxubW9kdWxlLmV4cG9ydHMgPSBmdW5jdGlvbiBlbWl0dGVyICh0aGluZywgb3B0aW9ucykge1xuICB2YXIgb3B0cyA9IG9wdGlvbnMgfHwge307XG4gIHZhciBldnQgPSB7fTtcbiAgaWYgKHRoaW5nID09PSB1bmRlZmluZWQpIHsgdGhpbmcgPSB7fTsgfVxuICB0aGluZy5vbiA9IGZ1bmN0aW9uICh0eXBlLCBmbikge1xuICAgIGlmICghZXZ0W3R5cGVdKSB7XG4gICAgICBldnRbdHlwZV0gPSBbZm5dO1xuICAgIH0gZWxzZSB7XG4gICAgICBldnRbdHlwZV0ucHVzaChmbik7XG4gICAgfVxuICAgIHJldHVybiB0aGluZztcbiAgfTtcbiAgdGhpbmcub25jZSA9IGZ1bmN0aW9uICh0eXBlLCBmbikge1xuICAgIGZuLl9vbmNlID0gdHJ1ZTsgLy8gdGhpbmcub2ZmKGZuKSBzdGlsbCB3b3JrcyFcbiAgICB0aGluZy5vbih0eXBlLCBmbik7XG4gICAgcmV0dXJuIHRoaW5nO1xuICB9O1xuICB0aGluZy5vZmYgPSBmdW5jdGlvbiAodHlwZSwgZm4pIHtcbiAgICB2YXIgYyA9IGFyZ3VtZW50cy5sZW5ndGg7XG4gICAgaWYgKGMgPT09IDEpIHtcbiAgICAgIGRlbGV0ZSBldnRbdHlwZV07XG4gICAgfSBlbHNlIGlmIChjID09PSAwKSB7XG4gICAgICBldnQgPSB7fTtcbiAgICB9IGVsc2Uge1xuICAgICAgdmFyIGV0ID0gZXZ0W3R5cGVdO1xuICAgICAgaWYgKCFldCkgeyByZXR1cm4gdGhpbmc7IH1cbiAgICAgIGV0LnNwbGljZShldC5pbmRleE9mKGZuKSwgMSk7XG4gICAgfVxuICAgIHJldHVybiB0aGluZztcbiAgfTtcbiAgdGhpbmcuZW1pdCA9IGZ1bmN0aW9uICgpIHtcbiAgICB2YXIgYXJncyA9IGF0b2EoYXJndW1lbnRzKTtcbiAgICByZXR1cm4gdGhpbmcuZW1pdHRlclNuYXBzaG90KGFyZ3Muc2hpZnQoKSkuYXBwbHkodGhpcywgYXJncyk7XG4gIH07XG4gIHRoaW5nLmVtaXR0ZXJTbmFwc2hvdCA9IGZ1bmN0aW9uICh0eXBlKSB7XG4gICAgdmFyIGV0ID0gKGV2dFt0eXBlXSB8fCBbXSkuc2xpY2UoMCk7XG4gICAgcmV0dXJuIGZ1bmN0aW9uICgpIHtcbiAgICAgIHZhciBhcmdzID0gYXRvYShhcmd1bWVudHMpO1xuICAgICAgdmFyIGN0eCA9IHRoaXMgfHwgdGhpbmc7XG4gICAgICBpZiAodHlwZSA9PT0gJ2Vycm9yJyAmJiBvcHRzLnRocm93cyAhPT0gZmFsc2UgJiYgIWV0Lmxlbmd0aCkgeyB0aHJvdyBhcmdzLmxlbmd0aCA9PT0gMSA/IGFyZ3NbMF0gOiBhcmdzOyB9XG4gICAgICBldC5mb3JFYWNoKGZ1bmN0aW9uIGVtaXR0ZXIgKGxpc3Rlbikge1xuICAgICAgICBpZiAob3B0cy5hc3luYykgeyBkZWJvdW5jZShsaXN0ZW4sIGFyZ3MsIGN0eCk7IH0gZWxzZSB7IGxpc3Rlbi5hcHBseShjdHgsIGFyZ3MpOyB9XG4gICAgICAgIGlmIChsaXN0ZW4uX29uY2UpIHsgdGhpbmcub2ZmKHR5cGUsIGxpc3Rlbik7IH1cbiAgICAgIH0pO1xuICAgICAgcmV0dXJuIHRoaW5nO1xuICAgIH07XG4gIH07XG4gIHJldHVybiB0aGluZztcbn07XG4iLCIndXNlIHN0cmljdCc7XG5cbnZhciBjdXN0b21FdmVudCA9IHJlcXVpcmUoJ2N1c3RvbS1ldmVudCcpO1xudmFyIGV2ZW50bWFwID0gcmVxdWlyZSgnLi9ldmVudG1hcCcpO1xudmFyIGRvYyA9IGdsb2JhbC5kb2N1bWVudDtcbnZhciBhZGRFdmVudCA9IGFkZEV2ZW50RWFzeTtcbnZhciByZW1vdmVFdmVudCA9IHJlbW92ZUV2ZW50RWFzeTtcbnZhciBoYXJkQ2FjaGUgPSBbXTtcblxuaWYgKCFnbG9iYWwuYWRkRXZlbnRMaXN0ZW5lcikge1xuICBhZGRFdmVudCA9IGFkZEV2ZW50SGFyZDtcbiAgcmVtb3ZlRXZlbnQgPSByZW1vdmVFdmVudEhhcmQ7XG59XG5cbm1vZHVsZS5leHBvcnRzID0ge1xuICBhZGQ6IGFkZEV2ZW50LFxuICByZW1vdmU6IHJlbW92ZUV2ZW50LFxuICBmYWJyaWNhdGU6IGZhYnJpY2F0ZUV2ZW50XG59O1xuXG5mdW5jdGlvbiBhZGRFdmVudEVhc3kgKGVsLCB0eXBlLCBmbiwgY2FwdHVyaW5nKSB7XG4gIHJldHVybiBlbC5hZGRFdmVudExpc3RlbmVyKHR5cGUsIGZuLCBjYXB0dXJpbmcpO1xufVxuXG5mdW5jdGlvbiBhZGRFdmVudEhhcmQgKGVsLCB0eXBlLCBmbikge1xuICByZXR1cm4gZWwuYXR0YWNoRXZlbnQoJ29uJyArIHR5cGUsIHdyYXAoZWwsIHR5cGUsIGZuKSk7XG59XG5cbmZ1bmN0aW9uIHJlbW92ZUV2ZW50RWFzeSAoZWwsIHR5cGUsIGZuLCBjYXB0dXJpbmcpIHtcbiAgcmV0dXJuIGVsLnJlbW92ZUV2ZW50TGlzdGVuZXIodHlwZSwgZm4sIGNhcHR1cmluZyk7XG59XG5cbmZ1bmN0aW9uIHJlbW92ZUV2ZW50SGFyZCAoZWwsIHR5cGUsIGZuKSB7XG4gIHZhciBsaXN0ZW5lciA9IHVud3JhcChlbCwgdHlwZSwgZm4pO1xuICBpZiAobGlzdGVuZXIpIHtcbiAgICByZXR1cm4gZWwuZGV0YWNoRXZlbnQoJ29uJyArIHR5cGUsIGxpc3RlbmVyKTtcbiAgfVxufVxuXG5mdW5jdGlvbiBmYWJyaWNhdGVFdmVudCAoZWwsIHR5cGUsIG1vZGVsKSB7XG4gIHZhciBlID0gZXZlbnRtYXAuaW5kZXhPZih0eXBlKSA9PT0gLTEgPyBtYWtlQ3VzdG9tRXZlbnQoKSA6IG1ha2VDbGFzc2ljRXZlbnQoKTtcbiAgaWYgKGVsLmRpc3BhdGNoRXZlbnQpIHtcbiAgICBlbC5kaXNwYXRjaEV2ZW50KGUpO1xuICB9IGVsc2Uge1xuICAgIGVsLmZpcmVFdmVudCgnb24nICsgdHlwZSwgZSk7XG4gIH1cbiAgZnVuY3Rpb24gbWFrZUNsYXNzaWNFdmVudCAoKSB7XG4gICAgdmFyIGU7XG4gICAgaWYgKGRvYy5jcmVhdGVFdmVudCkge1xuICAgICAgZSA9IGRvYy5jcmVhdGVFdmVudCgnRXZlbnQnKTtcbiAgICAgIGUuaW5pdEV2ZW50KHR5cGUsIHRydWUsIHRydWUpO1xuICAgIH0gZWxzZSBpZiAoZG9jLmNyZWF0ZUV2ZW50T2JqZWN0KSB7XG4gICAgICBlID0gZG9jLmNyZWF0ZUV2ZW50T2JqZWN0KCk7XG4gICAgfVxuICAgIHJldHVybiBlO1xuICB9XG4gIGZ1bmN0aW9uIG1ha2VDdXN0b21FdmVudCAoKSB7XG4gICAgcmV0dXJuIG5ldyBjdXN0b21FdmVudCh0eXBlLCB7IGRldGFpbDogbW9kZWwgfSk7XG4gIH1cbn1cblxuZnVuY3Rpb24gd3JhcHBlckZhY3RvcnkgKGVsLCB0eXBlLCBmbikge1xuICByZXR1cm4gZnVuY3Rpb24gd3JhcHBlciAob3JpZ2luYWxFdmVudCkge1xuICAgIHZhciBlID0gb3JpZ2luYWxFdmVudCB8fCBnbG9iYWwuZXZlbnQ7XG4gICAgZS50YXJnZXQgPSBlLnRhcmdldCB8fCBlLnNyY0VsZW1lbnQ7XG4gICAgZS5wcmV2ZW50RGVmYXVsdCA9IGUucHJldmVudERlZmF1bHQgfHwgZnVuY3Rpb24gcHJldmVudERlZmF1bHQgKCkgeyBlLnJldHVyblZhbHVlID0gZmFsc2U7IH07XG4gICAgZS5zdG9wUHJvcGFnYXRpb24gPSBlLnN0b3BQcm9wYWdhdGlvbiB8fCBmdW5jdGlvbiBzdG9wUHJvcGFnYXRpb24gKCkgeyBlLmNhbmNlbEJ1YmJsZSA9IHRydWU7IH07XG4gICAgZS53aGljaCA9IGUud2hpY2ggfHwgZS5rZXlDb2RlO1xuICAgIGZuLmNhbGwoZWwsIGUpO1xuICB9O1xufVxuXG5mdW5jdGlvbiB3cmFwIChlbCwgdHlwZSwgZm4pIHtcbiAgdmFyIHdyYXBwZXIgPSB1bndyYXAoZWwsIHR5cGUsIGZuKSB8fCB3cmFwcGVyRmFjdG9yeShlbCwgdHlwZSwgZm4pO1xuICBoYXJkQ2FjaGUucHVzaCh7XG4gICAgd3JhcHBlcjogd3JhcHBlcixcbiAgICBlbGVtZW50OiBlbCxcbiAgICB0eXBlOiB0eXBlLFxuICAgIGZuOiBmblxuICB9KTtcbiAgcmV0dXJuIHdyYXBwZXI7XG59XG5cbmZ1bmN0aW9uIHVud3JhcCAoZWwsIHR5cGUsIGZuKSB7XG4gIHZhciBpID0gZmluZChlbCwgdHlwZSwgZm4pO1xuICBpZiAoaSkge1xuICAgIHZhciB3cmFwcGVyID0gaGFyZENhY2hlW2ldLndyYXBwZXI7XG4gICAgaGFyZENhY2hlLnNwbGljZShpLCAxKTsgLy8gZnJlZSB1cCBhIHRhZCBvZiBtZW1vcnlcbiAgICByZXR1cm4gd3JhcHBlcjtcbiAgfVxufVxuXG5mdW5jdGlvbiBmaW5kIChlbCwgdHlwZSwgZm4pIHtcbiAgdmFyIGksIGl0ZW07XG4gIGZvciAoaSA9IDA7IGkgPCBoYXJkQ2FjaGUubGVuZ3RoOyBpKyspIHtcbiAgICBpdGVtID0gaGFyZENhY2hlW2ldO1xuICAgIGlmIChpdGVtLmVsZW1lbnQgPT09IGVsICYmIGl0ZW0udHlwZSA9PT0gdHlwZSAmJiBpdGVtLmZuID09PSBmbikge1xuICAgICAgcmV0dXJuIGk7XG4gICAgfVxuICB9XG59XG4iLCIndXNlIHN0cmljdCc7XG5cbnZhciBldmVudG1hcCA9IFtdO1xudmFyIGV2ZW50bmFtZSA9ICcnO1xudmFyIHJvbiA9IC9eb24vO1xuXG5mb3IgKGV2ZW50bmFtZSBpbiBnbG9iYWwpIHtcbiAgaWYgKHJvbi50ZXN0KGV2ZW50bmFtZSkpIHtcbiAgICBldmVudG1hcC5wdXNoKGV2ZW50bmFtZS5zbGljZSgyKSk7XG4gIH1cbn1cblxubW9kdWxlLmV4cG9ydHMgPSBldmVudG1hcDtcbiIsIlxudmFyIE5hdGl2ZUN1c3RvbUV2ZW50ID0gZ2xvYmFsLkN1c3RvbUV2ZW50O1xuXG5mdW5jdGlvbiB1c2VOYXRpdmUgKCkge1xuICB0cnkge1xuICAgIHZhciBwID0gbmV3IE5hdGl2ZUN1c3RvbUV2ZW50KCdjYXQnLCB7IGRldGFpbDogeyBmb286ICdiYXInIH0gfSk7XG4gICAgcmV0dXJuICAnY2F0JyA9PT0gcC50eXBlICYmICdiYXInID09PSBwLmRldGFpbC5mb287XG4gIH0gY2F0Y2ggKGUpIHtcbiAgfVxuICByZXR1cm4gZmFsc2U7XG59XG5cbi8qKlxuICogQ3Jvc3MtYnJvd3NlciBgQ3VzdG9tRXZlbnRgIGNvbnN0cnVjdG9yLlxuICpcbiAqIGh0dHBzOi8vZGV2ZWxvcGVyLm1vemlsbGEub3JnL2VuLVVTL2RvY3MvV2ViL0FQSS9DdXN0b21FdmVudC5DdXN0b21FdmVudFxuICpcbiAqIEBwdWJsaWNcbiAqL1xuXG5tb2R1bGUuZXhwb3J0cyA9IHVzZU5hdGl2ZSgpID8gTmF0aXZlQ3VzdG9tRXZlbnQgOlxuXG4vLyBJRSA+PSA5XG4nZnVuY3Rpb24nID09PSB0eXBlb2YgZG9jdW1lbnQuY3JlYXRlRXZlbnQgPyBmdW5jdGlvbiBDdXN0b21FdmVudCAodHlwZSwgcGFyYW1zKSB7XG4gIHZhciBlID0gZG9jdW1lbnQuY3JlYXRlRXZlbnQoJ0N1c3RvbUV2ZW50Jyk7XG4gIGlmIChwYXJhbXMpIHtcbiAgICBlLmluaXRDdXN0b21FdmVudCh0eXBlLCBwYXJhbXMuYnViYmxlcywgcGFyYW1zLmNhbmNlbGFibGUsIHBhcmFtcy5kZXRhaWwpO1xuICB9IGVsc2Uge1xuICAgIGUuaW5pdEN1c3RvbUV2ZW50KHR5cGUsIGZhbHNlLCBmYWxzZSwgdm9pZCAwKTtcbiAgfVxuICByZXR1cm4gZTtcbn0gOlxuXG4vLyBJRSA8PSA4XG5mdW5jdGlvbiBDdXN0b21FdmVudCAodHlwZSwgcGFyYW1zKSB7XG4gIHZhciBlID0gZG9jdW1lbnQuY3JlYXRlRXZlbnRPYmplY3QoKTtcbiAgZS50eXBlID0gdHlwZTtcbiAgaWYgKHBhcmFtcykge1xuICAgIGUuYnViYmxlcyA9IEJvb2xlYW4ocGFyYW1zLmJ1YmJsZXMpO1xuICAgIGUuY2FuY2VsYWJsZSA9IEJvb2xlYW4ocGFyYW1zLmNhbmNlbGFibGUpO1xuICAgIGUuZGV0YWlsID0gcGFyYW1zLmRldGFpbDtcbiAgfSBlbHNlIHtcbiAgICBlLmJ1YmJsZXMgPSBmYWxzZTtcbiAgICBlLmNhbmNlbGFibGUgPSBmYWxzZTtcbiAgICBlLmRldGFpbCA9IHZvaWQgMDtcbiAgfVxuICByZXR1cm4gZTtcbn1cbiIsInZhciBzaSA9IHR5cGVvZiBzZXRJbW1lZGlhdGUgPT09ICdmdW5jdGlvbicsIHRpY2s7XG5pZiAoc2kpIHtcbiAgdGljayA9IGZ1bmN0aW9uIChmbikgeyBzZXRJbW1lZGlhdGUoZm4pOyB9O1xufSBlbHNlIHtcbiAgdGljayA9IGZ1bmN0aW9uIChmbikgeyBzZXRUaW1lb3V0KGZuLCAwKTsgfTtcbn1cblxubW9kdWxlLmV4cG9ydHMgPSB0aWNrOyJdfQ==
+;
+!function(a){a.fn.datepicker.dates["zh-CN"]={days:["星期日","星期一","星期二","星期三","星期四","星期五","星期六"],daysShort:["周日","周一","周二","周三","周四","周五","周六"],daysMin:["日","一","二","三","四","五","六"],months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],monthsShort:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],today:"今天",monthsTitle:"选择月份",clear:"清除",format:"yyyy-mm-dd",titleFormat:"yyyy年mm月",weekStart:1}}(jQuery);
+/**
+ * Simplified Chinese translation for bootstrap-datetimepicker
+ * Yuan Cheung <advanimal@gmail.com>
+ */
+
+;(function($){
+	$.fn.datetimepicker.dates['zh-CN'] = {
+			days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
+			daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
+			daysMin:  ["日", "一", "二", "三", "四", "五", "六", "日"],
+			months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
+			monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
+			today: "今天",
+			suffix: [],
+			meridiem: ["上午", "下午"]
+	};
+}(jQuery));
+(function( factory ) {
+  if ( typeof define === "function" && define.amd ) {
+    define( ["jquery", "../jquery.validate"], factory );
+  } else {
+    factory( jQuery );
+  }
+}(function( $ ) {
+
+  /*
+   * Translated default messages for the jQuery validation plugin.
+   * Locale: ZH (Chinese, 中文 (Zhōngwén), 汉语, 漢語)
+   */
+  $.extend($.validator.messages, {
+    required: "这是必填字段",
+    remote: "请修正此字段",
+    email: "请输入有效的电子邮件地址",
+    url: "请输入有效的网址",
+    date: "请输入有效的日期",
+    dateISO: "请输入有效的日期 (YYYY-MM-DD)",
+    number: "请输入有效的数字",
+    digits: "只能输入数字",
+    creditcard: "请输入有效的信用卡号码",
+    equalTo: "你的输入不相同",
+    extension: "请输入有效的后缀",
+    maxlength: $.validator.format("最多可以输入 {0} 个字符"),
+    minlength: $.validator.format("最少要输入 {0} 个字符"),
+    rangelength: $.validator.format("请输入长度在 {0} 到 {1} 之间的字符串"),
+    range: $.validator.format("请输入范围在 {0} 到 {1} 之间的数值"),
+    max: $.validator.format("请输入不大于 {0} 的数值"),
+    min: $.validator.format("请输入不小于 {0} 的数值")
+  });
+
+}));
+/*! Select2 4.0.8 | https://github.com/select2/select2/blob/master/LICENSE.md */
+
+
+!function(){if(jQuery&&jQuery.fn&&jQuery.fn.select2&&jQuery.fn.select2.amd)var n=jQuery.fn.select2.amd;n.define("select2/i18n/zh-CN",[],function(){return{errorLoading:function(){return"无法载入结果。"},inputTooLong:function(n){return"请删除"+(n.input.length-n.maximum)+"个字符"},inputTooShort:function(n){return"请再输入至少"+(n.minimum-n.input.length)+"个字符"},loadingMore:function(){return"载入更多结果…"},maximumSelected:function(n){return"最多只能选择"+n.maximum+"个项目"},noResults:function(){return"未找到结果"},searching:function(){return"搜索中…"},removeAllItems:function(){return"删除所有项目"}}}),n.define,n.require}();
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-abouts-edit-page, body.admins-abouts-update-page').length > 0) {
+    createMDEditor('about-us-editor', {});
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-agreements-edit-page, body.admins-agreements-update-page').length > 0) {
+    createMDEditor('agreement-editor', {});
+  }
+})
+;
+
+function show_add_manager(id) {
+  $(".auth-schools-user-add").modal("show");
+
+  $(".auth-schools-user-add").find("#school_id_input").val(id)
+}
+;
+$(document).on('turbolinks:load', function(){
+  $(document).on('click', '.batch-all-check-box', function(){
+    var $checkAll = $(this);
+
+    $('.batch-check-box').prop('checked', $checkAll.is(':checked'));
+  })
+
+  $(document).on('click', '.batch-check-box', function(){
+    var allChecked = $('.batch-check-box:checked').length === $('.batch-check-box').length
+    $('.batch-all-check-box').prop('checked', allChecked);
+  })
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-carousels-index-page').length > 0) {
+    var laboratoryId = $('#carousels-container').data('laboratoryId');
+    var resetNo = function(){
+      $('#carousels-container .custom-carousel-item-no').each(function(index, ele){
+        $(ele).html(index + 1);
+      })
+    }
+    // 删除后
+    $(document).on('delete_success', resetNo);
+
+    // ------------ 保存链接 -----------
+    $('.carousels-card').on('click', '.save-data-btn', function(){
+      var $link = $(this);
+      var id = $link.data('id');
+      var link = $('.custom-carousel-item-' + id).find('.link-input').val();
+      var name = $('.custom-carousel-item-' + id).find('.name-input').val();
+      if(!name || name.length == 0){
+        $.notify({ message: '名称不能为空' },{ type: 'danger' });
+        return;
+      }
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/laboratories/' + laboratoryId + '/carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { link: link, name: name },
+        success: function(data){
+          $.notify({ message: '操作成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+    // -------------- 是否在首页展示 --------------
+    $('.carousels-card').on('change', '.online-check-box', function(){
+      var $checkbox = $(this);
+      var id = $checkbox.data('id');
+      var checked = $checkbox.is(':checked');
+      $checkbox.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/laboratories/' + laboratoryId + '/carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { status: checked },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          var box = $('.custom-carousel-item-' + id).find('.drag');
+          if(checked){
+            box.removeClass('not_active');
+          }else{
+            box.addClass('not_active');
+          }
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $checkbox.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/laboratories/' + laboratoryId + '/carousels/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+          resetNo();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('carousels-container');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-carousel-modal');
+    var $createForm = $createModal.find('form.admin-add-carousel-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "portal_image[image]": {
+          required: true
+        },
+        "portal_image[name]": {
+          required: true
+        },
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $carouselItem = $('.custom-carousel-item-' + data.source_id);
+      $carouselItem.find('.custom-carousel-item-img img').attr('src', data.url);
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  var $refuseModal = $('.admin-common-refuse-modal');
+  if ($refuseModal.length > 0) {
+    var $form = $refuseModal.find('form.admin-common-refuse-form');
+    var $applyIdInput = $refuseModal.find('.modal-body input[name="apply_id"]');
+    var $applyTitle = $refuseModal.find('.modal-title');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        reason: {
+          required: true,
+          maxlength: 200
+        },
+      }
+    });
+
+    // modal ready fire
+    $refuseModal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var applyId = $link.data('id');
+      var url = $link.data('url');
+      var title = $link.data('title');
+      var type = $link.data('type');
+      var form_method = "POST";
+      if(typeof title !== 'undefined'){
+        $applyTitle.html(title)
+      }
+      if(typeof type !== 'undefined'){
+        form_method = type;
+      }
+
+      $applyIdInput.val(applyId);
+      $form.data('url', url);
+      $form.data('type', form_method);
+    });
+    // modal visited fire
+    $refuseModal.on('shown.bs.modal', function(){
+      $refuseModal.find('.modal-body textarea[name="reason"]').focus();
+    });
+    $refuseModal.on('hide.bs.modal', function () {
+      $applyIdInput.val('');
+      $refuseModal.find('.modal-body textarea[name="reason"]').val('');
+      $form.data('url', '');
+    })
+
+    $refuseModal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+        var form_method = $form.data('type');
+
+        $.ajax({
+          method: form_method,
+          dataType: 'script',
+          url: url,
+          data: $form.serialize(),
+        }).done(function(){
+          $refuseModal.modal('hide');
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function(){
+    if ($('body.admins-competition-settings-index-page').length > 0) {
+
+        var dateOptions = {
+            autoclose: true,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd',
+            startDate: '2017-04-01'
+        };
+
+        var timeOptions = {
+            autoclose: 1,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd hh:ii',
+            minuteStep: 30
+        };
+
+        var defineDateRangeSelect = function (element) {
+            var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, dateOptions);
+            $(element).datepicker(options);
+
+            $(element).find('.start-date').datepicker().on('changeDate', function (e) {
+                $(element).find('.end-date').datepicker('setStartDate', e.date);
+            });
+        };
+        $(".competition-start-end-date .start-date").datetimepicker(timeOptions);
+
+        $(".competition-start-end-date .end-date").datetimepicker(timeOptions);
+
+        $(".nav-setting-form .enroll_end_time").datetimepicker(timeOptions);
+
+        $(".stage-update-form .section-start-time").datetimepicker(timeOptions);
+        $(".stage-update-form .section-end-time").datetimepicker(timeOptions);
+
+        defineDateRangeSelect('.teaching-mode-date');
+        // defineTimeRangeSelect('.competition-start-end-date');
+
+        var $basicForm = $('form.basic-setting-form');
+
+        $basicForm.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: "required",
+                subTitle: "required",
+                startTime: "required",
+                endTime: "required",
+                mode: "required",
+                identifier: "required"
+            }
+        });
+
+        // 保存按钮
+        $basicForm.on('click', ".submit-btn", function () {
+            $basicForm.find('.submit-btn').attr('disabled', 'disabled');
+            $basicForm.find('.error').html('');
+            var valid = $basicForm.valid();
+
+            if ($("input[name='mode']:checked").val() == 2) {
+                var $courseId = $("input[name='course_id']");
+                if ($courseId.val() === undefined || $courseId.val().length === 0) {
+                    $courseId.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $courseId.removeClass('danger text-danger');
+                }
+            } else if ($("input[name='mode']:checked").val() == 3) {
+                var $techStartTime = $("input[name='teach_start_time']");
+                var $techEndTime = $("input[name='teach_end_time']");
+                if ($techStartTime.val() === undefined || $techStartTime.val().length === 0) {
+                    $techStartTime.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $techStartTime.removeClass('danger text-danger');
+                }
+
+                if ($techEndTime.val() === undefined || $techEndTime.val().length === 0) {
+                    $techEndTime.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $techEndTime.removeClass('danger text-danger');
+                }
+            } else {
+                $("input[name='course_id']").removeClass('danger text-danger');
+                $("input[name='teach_start_time']").removeClass('danger text-danger');
+                $("input[name='teach_end_time']").removeClass('danger text-danger');
+            }
+
+            if (!valid) return;
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: $basicForm.attr('action'),
+                data: new FormData($basicForm[0]),
+                processData: false,
+                contentType: false,
+                success: function (data) {
+                    $.notify({message: '保存成功'});
+                    // window.location.reload();
+                },
+                error: function (res) {
+                    var data = res.responseJSON;
+                    $basicForm.find('.error').html(data.message);
+                },
+                complete: function () {
+                    $basicForm.find('.submit-btn').attr('disabled', false);
+                }
+            });
+        });
+
+        var selectOptions = {
+            theme: 'bootstrap4',
+              placeholder: '请输入要添加的单位名称',
+              multiple: true,
+              minimumInputLength: 1,
+              ajax: {
+              delay: 500,
+                url: '/api/schools/search.json',
+                dataType: 'json',
+                data: function(params){
+                return { keyword: params.term };
+              },
+              processResults: function(data){
+                return { results: data.schools }
+              }
+            },
+            templateResult: function (item) {
+              if(!item.id || item.id === '') return item.text;
+              return item.name || item.text;
+            },
+            templateSelection: function(item){
+              return item.name || item.text;
+            }
+        };
+
+        $('.sponsor-select').select2(selectOptions);
+        $('.allow-school-select').select2(selectOptions);
+
+        $('.manager-select').select2({
+          theme: 'bootstrap4',
+          placeholder: '请输入要添加的管理员姓名',
+          multiple: true,
+          minimumInputLength: 1,
+          ajax: {
+            delay: 500,
+            url: '/admins/users',
+            dataType: 'json',
+            data: function(params){
+              return { keyword: params.term };
+            },
+            processResults: function(data){
+              return { results: data.users }
+            }
+          },
+          templateResult: function (item) {
+            if(!item.id || item.id === '') return item.text;
+						return $("<div class='row px-0'><span class='col-3'>" + item.real_name + "</span><span class='col-5 font-12'>" + item.school_name + "</span><span class='col-4 font-12'>" + item.hidden_phone + "</span></div>");
+          },
+          templateSelection: function(item){
+            if (item.id) {
+            }
+            return item.real_name || item.text;
+          }
+        });
+
+
+        // 排行榜
+        //链接
+        $(".nav-setting-form").on("click",".add_linkBtn",function () {
+            var length=$(".nav-setting-form").find(".linkFormItem").length + 1;
+            var html='<div class="row mt-2 align-items-center linkFormItem">\n' +
+                '          <div class="col-1 text-right">\n' +
+                '            <label class="checkbox checkbox-primary mt-1">\n' +
+                '              <input type="checkbox" name="navbar[][hidden]" value="0" hidden class="font-16" checked="checked">\n' +
+                '              <input type="checkbox" value="0" class="font-16 module_hidden" checked="checked">\n' +
+                '            </label>\n' +
+                '          </div>\n' +
+                '          <div class="col-md-label mt-1"><input type="hidden" value="md" name="navbar[][module_type]">\n' +
+                '          <input type="text" name="navbar[][name]" value="" class="form-control" placeholder="模块名称"></div>\n' +
+                '          <div class="col-md-1 mt-1"><input type="text" name="navbar[][position]" value="" class="form-control" placeholder="位置"></div>\n' +
+                '          <div class="col-md-3 mt-1"><input type="text" name="navbar[][url]" value="" class="form-control" placeholder="请输入资料下载地址"></div>\n' +
+                '          <a class="mt-1 btn btn-primary waves-effect waves-light btn-xs setBtn_s add_linkBtn" href="javascript:void(0)">+</a>\n' +
+                '          <a class="mt-1 btn btn-icon waves-effect btn-default waves-light setBtn_s ml10 del_linkBtn" href="javascript:void(0)">×</a>\n' +
+                '        </div>';
+            $(this).parents(".linkFormItem").after(html);
+        });
+
+        $(".nav-setting-form").on("click", ".del_linkBtn", function () {
+            $(this).parents(".linkFormItem").remove();
+        });
+
+        //有关报名要求
+        $(".addRequireBtn").on("click",function () {
+            var length=$("#requireForm").find(".requireForm_item").length + 1;
+            var html='<div class="row mt-2 mb-4 requireForm_item">\n' +
+                '          <div class="col-1 text-right">&nbsp;&nbsp;</div>\n' +
+                '          <div class="col-1 text-left mt-1">\n' +
+                '            <input type="text" class="form-control" name="competition_staffs[][minimum]" value="0">\n' +
+                '          </div>\n' +
+                '          <span class="mt-2">~</span>\n' +
+                '          <div class="col-1 mt-1">\n' +
+                '            <input type="text" class="form-control" name="competition_staffs[][maximum]" value="1">\n' +
+                '          </div>\n' +
+                '          <span class="mt-2">人</span>\n' +
+                '          <div class="col-2 mt-1">\n' +
+                '            <select class="form-control" name="competition_staffs[][category]">\n' +
+                '              <option value="student">学生</option>\n' +
+                '              <option value="teacher">教师</option>\n' +
+                '            </select>\n' +
+                '          </div>\n' +
+                '          <div class="col-2 mt-1">\n' +
+                '            <label class="radio checkbox-primary mt-1" value="require_'+length+'_1">\n' +
+                '              <input id="require_'+length+'_1" class="mutiple-limited-radio" value="false" checked name="competition_staffs[][mutiple_limited]" type="checkbox">\n' +
+                '              <label for="require_'+length+'_1">可多次报名</label>\n' +
+                '            </label>\n' +
+                '          </div>\n' +
+                '          <div class="col-2 mt-1">\n' +
+                '            <label class="radio checkbox-primary mt-1" value="require_'+length+'_2">\n' +
+                '              <input id="require_'+length+'_2" class="mutiple-limited-radio" value="true" name="competition_staffs[][mutiple_limited]" type="checkbox">\n' +
+                '              <label for="require_'+length+'_2">不可多次报名</label>\n' +
+                '            </label>\n' +
+                '            <a href="javascript:void(0)" class="ml20 delRequrieBtn">\n' +
+                '              <i class="fa fa-times-circle font-20 color-grey-c"></i>\n' +
+                '            </a>\n' +
+                '          </div>\n' +
+                '        </div>';
+            $("#requireForm").append(html);
+        });
+
+        $("#requireForm").on("click",".delRequrieBtn",function () {
+            $(this).parents(".requireForm_item").remove();
+        });
+
+        $('.nav-setting-form').on('click', '.module_hidden', function(){
+            var checkEle = $(this);
+            if (checkEle.is(':checked')) {
+                checkEle.prev().val(0);
+            } else {
+                checkEle.prev().val(1);
+            }
+        });
+
+        $('.competition-staff-settings').on('click', '.mutiple-limited-radio', function(){
+            var radio = $(this);
+            if (radio.is(':checked')) {
+                radio.parent().parent().siblings().find('.mutiple-limited-radio').attr('checked', false)
+            } else {
+                radio.parent().parent().siblings().find('.mutiple-limited-radio').attr('checked', true)
+            }
+        });
+
+        var $navForm = $('form.nav-setting-form');
+        $navForm.on('click', ".submit-btn", function () {
+            $navForm.find('.submit-btn').attr('disabled', 'disabled');
+            $navForm.find('.error').html('');
+            var valid = $navForm.valid();
+
+            if (!valid) return;
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: $navForm.attr('action'),
+                data: new FormData($navForm[0]),
+                processData: false,
+                contentType: false,
+                success: function (data) {
+                    $.notify({message: '保存成功'});
+                    // window.location.reload();
+                },
+                error: function (res) {
+                    var data = res.responseJSON;
+                    $navForm.find('.error').html(data.message);
+                },
+                complete: function () {
+                    $navForm.find('.submit-btn').attr('disabled', false);
+                }
+            });
+        });
+
+//    排行榜设置
+        //删除小阶段
+        $("#large_panel").on("click",".small_panel_item_del",function () {
+            var list = $(this).parents(".small_panel");
+            $(this).parents(".small_panel_item").remove();
+
+            for(var i=0;i < $(list).find(".subName").length;i++){
+                console.log(i);
+                $(list).find(".subName").eq(i).html("第"+parseInt(i+1)+"阶段");
+            }
+        });
+
+        // $('form.stage-update-form').validate({
+        //     errorElement: 'span',
+        //     errorClass: 'danger text-danger',
+        //     rules: {
+        //         stage_name: "required",
+        //         "stage[][start_time]": "required",
+        //         "stage[][end_time]": "required",
+        //         "stage[][mission_count]": {
+        //             required: true,
+        //             min: 1
+        //         },
+        //         "stage[][entry]": {
+        //             required: true,
+        //             min: 1
+        //         },
+        //         score_rate: {
+        //             required: true,
+        //             range: [0, 100]
+        //         }
+        //     },
+        //     messages: {
+        //         "stage[][mission_count]": {
+        //             min: ">=1"
+        //         },
+        //         "stage[][entry]": {
+        //             min: ">=1"
+        //         },
+        //     }
+        // });
+
+        $('.competition-chart-setting').on('click', ".update-stage", function () {
+            var updateForm = $(this).parents("form");
+            $(this).attr('disabled', 'disabled');
+            updateForm.find('.error').html('');
+            // var valid = updateForm.valid();
+            var valid = true;
+
+            var $stageName = updateForm.find('input[name="stage_name"]');
+            if($stageName.val() === undefined || $stageName.val().length === 0){
+                $stageName.addClass('danger text-danger');
+                valid = false;
+            } else {
+                $stageName.removeClass('danger text-danger');
+            }
+
+            var $scoreRate = updateForm.find('input[name="score_rate"]');
+            if($scoreRate.val() === undefined || $scoreRate.val().length === 0){
+                $scoreRate.addClass('danger text-danger');
+                valid = false;
+            } else if (parseInt($scoreRate.val()) > 100 || parseInt($scoreRate.val()) < 0) {
+                $scoreRate.addClass('danger text-danger');
+                $scoreRate.after('<span class="danger text-danger">0-100之间的数值</span>');
+                valid = false;
+            } else {
+                $scoreRate.removeClass('danger text-danger');
+                $scoreRate.siblings().remove();
+            }
+
+            updateForm.find('input[name="stage[][start_time]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                }
+            });
+
+            updateForm.find('input[name="stage[][end_time]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                }
+            });
+
+            updateForm.find('input[name="stage[][mission_count]"]').each(function(i, e){
+                var $ele = $(e);
+                var $entry = updateForm.find('input[name="stage[][entry]"]').eq(i);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else if (parseInt($ele.val()) < 1) {
+                    $ele.addClass('danger text-danger');
+                    $ele.after('<span class="danger text-danger">大于等于1</span>');
+                    valid = false;
+                } else if (parseInt($ele.val()) > parseInt($entry.val())) {
+                    $ele.addClass('danger text-danger');
+                    $ele.after('<span class="danger text-danger">不能大于总任务数</span>');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                    $ele.siblings().remove();
+                }
+            });
+
+            updateForm.find('input[name="stage[][entry]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else if (parseInt($ele.val()) < 1) {
+                    $ele.addClass('danger text-danger');
+                    $ele.after('<span class="danger text-danger">大于等于1</span>');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                    $ele.siblings().remove();
+                }
+            });
+
+            updateForm.find('input[name="stage[][identifiers][]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                }
+            });
+
+            if (!valid) return;
+
+            updateForm.find('input[name="stage[][mission_count]"]').each(function(_, e){
+                var $missionCount = $(e);
+                var $entryCount = $(e).parents("div.row").find('input[name="stage[][mission_count]"]');
+                if(parseInt($missionCount.val()) > parseInt($entryCount.val()) ){
+                    $missionCount.addClass('danger text-danger');
+                    $missionCount.after('<span class="danger text-danger">不能大于总任务数</span>');
+                    valid = false;
+                } else {
+                    $missionCount.removeClass('danger text-danger');
+                    $missionCount.siblings().remove();
+                }
+            });
+
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: updateForm.attr('action'),
+                data: new FormData(updateForm[0]),
+                processData: false,
+                contentType: false,
+                success: function (data) {
+                    $.notify({message: '保存成功'});
+                    window.location.reload();
+                },
+                error: function (res) {
+                    var data = res.responseJSON;
+                    $navForm.find('.error').html(data.message);
+                },
+                complete: function () {
+                    $navForm.find('.submit-btn').attr('disabled', false);
+                }
+            });
+        });
+
+        $(".competition-chart-stages").on("click", ".add-new-tab", function () {
+            if($(".new-stage-form").length > 0){
+                alert("请先保存上一个tab");
+            } else {
+                var count = parseInt($("#large_panel").find(".large_panel_part").length)+1;
+                var html = '<form class="stage-update-form new-stage-form flex-1" action="/admins/competitions/'+$(this).attr("data-competition-id")+'/competition_stages" accept-charset="UTF-8" data-remote="true" method="post">' +
+                    '<div class="large_panel_part" attr_line="'+count+'"><div class="row d-flex mt-3">\n' +
+                    '          <span class="col-1 mt-2">tab标题</span>\n' +
+                    '          <div class="col-2 no_padding">\n' +
+                    '            <input type="text" class="form-control" name="stage_name"/>\n' +
+                    '          </div>\n' +
+                    '          <span class="col-1 text-right mt-2 no_padding">总排行榜占比:</span>\n' +
+                    '          <div class="col-1 no_padding">\n' +
+                    '            <input type="number" class="form-control" name="score_rate" value="100"/>\n' +
+                    '          </div><span class=" mt-2">%</span>\n' +
+                    '          <div class="flex-1">\n' +
+                    '            <a href="javascript:void(0)"class="btn btn-outline-primary export-action ml20 add-task-sub">新增子阶段</a>\n' +
+                    '          </div>\n' +
+                    '          <a href="javascript:void(0)" class="btn btn-default ml20" onclick="Del_tab(this)">删除</a>\n' +
+                    '          <a href="javascript:void(0)" class="btn btn-outline-primary update-stage export-action ml20">保存</a>\n' +
+                    '        </div>\n' +
+                    '        <div id="small_panel_'+count+'" class="small_panel">\n' +
+                    '                <div class="row d-flex small_panel_item" attr_line="sub_new_new" count="1">\n' +
+                    '                  <span class="mt-2 subName mr10">第1阶段</span>\n' +
+                    '                  <div class="flex-1">\n' +
+                    '                    <div class="row">\n' +
+                    '                      <div class="row col-6"><span class="mt-2 ml20">有效时间:</span>\n' +
+                    '                      <div class="col-4 no_padding">\n' +
+                    '                        <input type="text" name="stage[][start_time]" id="stage__start_time" value="" autocomplete="off" class="section-start-time form-control" placeholder="有效开始时间">\n' +
+                    '                      </div>\n' +
+                    '                      <span class="mt-2">~</span>\n' +
+                    '                      <div class="col-4 no_padding ">\n' +
+                    '                        <input type="text" name="stage[][end_time]" id="stage__end_time" value="" autocomplete="off" class="section-end-time form-control" placeholder="有效结束时间">\n' +
+                    '                      </div></div>\n' +
+                    '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding">总任务数:</span>\n' +
+                    '                      <div class="col-6 no_padding ">\n' +
+                    '                        <input type="number" class="form-control" onchange="change_total(this)" value="3" name="stage[][entry]">\n' +
+                    '                      </div></div>\n' +
+                    '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding">成绩来源:</span>\n' +
+                    '                      <div class="col-6 no_padding ">\n' +
+                    '                        <select class="form-control" name="stage[][score_source]">\n' +
+                    '                          <option value="0">经验值</option>\n' +
+                    '                          <option value="1">预测准确率</option>\n' +
+                    '                        </select>\n' +
+                    '                      </div></div>\n' +
+                    '                    </div>\n' +
+                    '                    <div class="row mt-2" id="task_Input_sub_new_new">\n' +
+                    '                      <div class="col-4 row task_Input_div">\n' +
+                    '                        <span class="col-4 text-right mt-3 no_padding mr10">任务1</span>\n' +
+                    '                        <div class="col-6 no_padding">\n' +
+                    '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                    '                        </div>\n' +
+                    '                      </div>\n' +
+                    '                      <div class="col-4 row task_Input_div">\n' +
+                    '                        <span class="col-4 text-right mt-3 no_padding mr10">任务2</span>\n' +
+                    '                        <div class="col-6 no_padding">\n' +
+                    '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                    '                        </div>\n' +
+                    '                      </div>\n' +
+                    '                      <div class="col-4 row task_Input_div">\n' +
+                    '                        <span class="col-4 text-right mt-3 no_padding mr10">任务3</span>\n' +
+                    '                        <div class="col-6 no_padding">\n' +
+                    '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                    '                        </div>\n' +
+                    '                      </div>\n' +
+                    '                    </div>\n' +
+                    '                  </div>\n' +
+                    '                  <span>\n' +
+                    '              <a href="javascript:void(0)" class="btn btn-default ml20 small_panel_item_del">删除</a>\n' +
+                    '            </span>\n' +
+                    '                </div>\n' +
+                    '</div></div></form>';
+                $("#large_panel").append(html);
+
+                $(".stage-update-form .section-start-time").datetimepicker(timeOptions);
+                $(".stage-update-form .section-end-time").datetimepicker(timeOptions);
+            }
+        });
+
+        //新增子阶段
+        $(".competition-chart-stages").on("click", ".add-task-sub", function () {
+            var index = $(this).parents(".large_panel_part").attr("attr_line");
+            var count= 0;
+
+            console.log("sdfsf");
+            console.log($("#small_panel_"+index).find(".small_panel_item").length > 0);
+
+            if($("#small_panel_"+index).find(".small_panel_item").length > 0){
+                count = parseInt($("#small_panel_"+index).find(".small_panel_item").last().attr("count")) + 1;
+
+                console.log($("#small_panel_"+index).find(".small_panel_item").last().attr("count"));
+            }else{
+                count = 1;
+            }
+
+            var showCount=parseInt($("#small_panel_"+index).find(".small_panel_item").length) + 1;
+
+
+            var html='<div class="row d-flex small_panel_item" attr_line="sub_'+index+'_'+count+'" count="'+count+'">\n' +
+                '            <span class="mr10 mt-2 subName">第'+showCount+'阶段</span>\n' +
+                '            <div class="flex-1">\n' +
+                '                    <div class="row">\n' +
+                '                      <div class="row col-6"><span class="mt-2 ml20 mr10">有效时间:</span>\n' +
+                '                      <div class="col-4 no_padding ">\n' +
+                '                        <input type="text" name="stage[][start_time]" id="stage__start_time" value="" autocomplete="off" class="section-start-time form-control" placeholder="有效开始时间">\n' +
+                '                      </div>\n' +
+                '                      <span class="mt-2">~</span>\n' +
+                '                      <div class="col-4 no_padding ">\n' +
+                '                        <input type="text" name="stage[][end_time]" id="stage__end_time" value="" autocomplete="off" class="section-end-time form-control" placeholder="有效结束时间">\n' +
+                '                      </div></div>\n' +
+                '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding mr10">总任务数:</span>\n' +
+                '                      <div class="col-6 no_padding ">\n' +
+                '                        <input type="number" class="form-control" onchange="change_total(this)" value="3" name="stage[][entry]">\n' +
+                '                      </div></div>\n' +
+                '                      <div class="row col-3"><span class="col-4 mr10 text-right mt-2 no_padding">成绩来源:</span>\n' +
+                '                      <div class="col-6 no_padding ">\n' +
+                '                        <select class="form-control" name="stage[][score_source]">\n' +
+                '                          <option value="0">经验值</option>\n' +
+                '                          <option value="1">预测准确率</option>\n' +
+                '                        </select>\n' +
+                '                      </div></div>\n' +
+                '                    </div>\n' +
+                '              <div class="row mt-2" id="task_Input_sub_'+index+'_'+count+'">\n'+
+                '                      <div class="col-4 row task_Input_div">\n' +
+                '                        <span class="col-4 text-right mt-3 no_padding mr10">任务1</span>\n' +
+                '                        <div class="col-6 no_padding">\n' +
+                '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '                        </div>\n' +
+                '                      </div>\n' +
+                '                      <div class="col-4 row task_Input_div">\n' +
+                '                        <span class="col-4 text-right mt-3 no_padding mr10">任务2</span>\n' +
+                '                        <div class="col-6 no_padding">\n' +
+                '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '                        </div>\n' +
+                '                      </div>\n' +
+                '                      <div class="col-4 row task_Input_div">\n' +
+                '                        <span class="col-4 text-right mt-3 no_padding mr10">任务3</span>\n' +
+                '                        <div class="col-6 no_padding">\n' +
+                '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '                        </div>\n' +
+                '                      </div>\n' +
+                '            </div>\n' +
+                '            </div>\n' +
+                '            <span>\n' +
+                '              <a href="javascript:void(0)" class="btn btn-default ml20 small_panel_item_del">删除</a>\n' +
+                '            </span>\n' +
+                '          </div>';
+            $("#small_panel_"+index).append(html);
+
+            $(".stage-update-form .section-start-time").datetimepicker(timeOptions);
+            $(".stage-update-form .section-end-time").datetimepicker(timeOptions);
+        });
+
+        // 奖项设置
+        var $prizeContainer = $('#competition-prize-card');
+        var competitionId = $prizeContainer.data('id');
+        $(document).on('prize.save.success', function(){
+          $.ajax({
+            method: 'GET',
+            url: '/admins/competitions/' + competitionId + '/competition_prizes',
+            dataType: 'script'
+          })
+        });
+
+        $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+          var $imageElement;
+          if(data.suffix === '_member'){
+            $imageElement = $('.prize-member-image-' + data.source_id);
+          } else if(data.suffix === '_team'){
+            $imageElement = $('.prize-team-image-' + data.source_id);
+          } else {
+            $imageElement = $('.prize-teacher-image-' + data.source_id);
+          }
+          $imageElement.attr('src', data.url);
+          $imageElement.show();
+          $imageElement.next().html('重新上传');
+        })
+
+        // 生成获奖记录
+        $prizeContainer.on('click', '.generate-prize-user-action', function(){
+          var $link = $(this);
+
+          var generateRequest = function(){
+            return $.ajax({
+              method: 'POST',
+              url: '/admins/competitions/' + competitionId + '/competition_prize_users',
+              dataType: 'json',
+              success: function(data){
+                if(data && data.status === 0){
+                  show_success_flash();
+                  $link.remove();
+                } else {
+                  showErrorNotify(data.message);
+                }
+              },
+              error: function(res){
+                var data = res.responseJSON;
+                showErrorNotify(data.message);
+              }
+            })
+          }
+
+          customConfirm({
+            content: '确认生成吗？',
+            ok: function () {
+              customLoading({
+                ajax: generateRequest
+              })
+            }
+          })
+        });
+    } else {
+      $(document).unbind('prize.save.success');
+    }
+});
+
+//添加主办方或者开放范围
+function addSponsor(item){
+    var html='<div class="sponsor_label">\n' +
+        '              <input type="hidden" value="school_id" />\n' +
+        '              <span>caicai</span>\n' +
+        '              <a href="javascript:void(0)" onclick="del_sponsor(this)">×</a>\n' +
+        '            </div>';
+    $(item).parents(".sponsorPanel").append(html);
+}
+//删除
+function del_sponsor(item){
+    $(item).parents(".sponsor_label").remove();
+}
+
+//    小阶段修改总任务数
+function change_total(item) {
+    var count=parseInt($(item).val());
+
+
+    var index = $(item).parents(".small_panel_item").attr("attr_line");
+    var indexLarge = $(item).parents(".large_panel_part").attr("attr_line");
+    console.log(indexLarge);
+    console.log(index);
+
+    var divCount=parseInt($("#task_Input_"+index).find(".task_Input_div").length);
+
+
+    var html = "";
+    if(count > divCount){
+        for(var i=0;i < count-divCount ;i++){
+            html+='<div class="col-4 row task_Input_div"><span class="col-4 text-right mt-3 no_padding mr10">任务'+(divCount+i+1)+'</span>\n' +
+                '<div class="col-6 no_padding">\n' +
+                '<input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '</div>\n' +
+                '</div>';
+        }
+        $("#task_Input_"+index).append(html);
+    }else{
+        var delCount = divCount - count ;
+        console.log(divCount);
+        console.log(count);
+        var _max=parseInt($("#task_Input_"+index).find(".task_Input_div:last").index());
+
+        console.log(_max);
+        var _get= _max - delCount;
+
+        console.log(_get);
+        if(count == 0){
+            $("#task_Input_"+index).empty();
+        }else{
+            $("#task_Input_"+index).find(".task_Input_div:gt("+_get+")").remove();
+        }
+
+    }
+
+}
+
+//删除tab
+function  Del_tab(item) {
+    $(item).parents(".large_panel_part").remove();
+}
+//新增tab
+function addNewTab(competition_id) {
+    if($(".new-stage-form").length > 0){
+        alert("请先保存上一个tab");
+    } else {
+        var count = parseInt($("#large_panel").find(".large_panel_part").length)+1;
+        var html = '<form class="stage-update-form new-stage-form flex-1" action="/admins/competitions/'+competition_id+'/competition_stages" accept-charset="UTF-8" data-remote="true" method="post">' +
+            '<div class="large_panel_part" attr_line="'+count+'"><div class="row d-flex mt-3">\n' +
+            '          <span class="col-1 mt-2">tab标题</span>\n' +
+            '          <div class="col-2 no_padding">\n' +
+            '            <input type="text" class="form-control" name="stage_name"/>\n' +
+            '          </div>\n' +
+            '          <span class="col-1 text-right mt-2 no_padding">总排行榜占比:</span>\n' +
+            '          <div class="col-1 no_padding">\n' +
+            '            <input type="number" class="form-control" name="score_rate" value="100"/>\n' +
+            '          </div><span class=" mt-2">%</span>\n' +
+            '          <div class="flex-1">\n' +
+            '            <a href="javascript:void(0)"class="btn btn-outline-primary export-action ml20 add-task-sub">新增子阶段</a>\n' +
+            '          </div>\n' +
+            '          <a href="javascript:void(0)" class="btn btn-default ml20" onclick="Del_tab(this)">删除</a>\n' +
+            '          <a href="javascript:void(0)" class="btn btn-outline-primary update-stage export-action ml20">保存</a>\n' +
+            '        </div>\n' +
+            '        <div id="small_panel_'+count+'" class="small_panel">\n' +
+            '                <div class="row d-flex small_panel_item" attr_line="sub_new_new" count="1">\n' +
+            '                  <span class="mt-2 subName mr10">第1阶段</span>\n' +
+            '                  <div class="flex-1">\n' +
+            '                    <div class="row">\n' +
+            '                      <div class="row col-6"><span class="mt-2 ml20 mr10">有效时间:</span>\n' +
+            '                      <div class="col-4 no_padding ">\n' +
+            '                        <input type="text" name="stage[][start_time]" id="stage__start_time" value="" autocomplete="off" class="section-start-time form-control" placeholder="有效开始时间">\n' +
+            '                      </div>\n' +
+            '                      <span class="mt-2">~</span>\n' +
+            '                      <div class="col-4 no_padding input_middle">\n' +
+            '                        <input type="text" name="stage[][end_time]" id="stage__end_time" value="" autocomplete="off" class="section-end-time form-control" placeholder="有效结束时间">\n' +
+            '                      </div></div>\n' +
+            '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding mr10">总任务数:</span>\n' +
+            '                      <div class="col-6 no_padding ">\n' +
+            '                        <input type="number" class="form-control" onchange="change_total(this)" value="3" name="stage[][entry]">\n' +
+            '                      </div></div>\n' +
+            '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding mr10">成绩来源:</span>\n' +
+            '                      <div class="col-6 no_padding ">\n' +
+            '                        <select class="form-control" name="stage[][score_source]">\n' +
+            '                          <option value="0">经验值</option>\n' +
+            '                          <option value="1">预测准确率</option>\n' +
+            '                        </select>\n' +
+            '                      </div></div>\n' +
+            '                    </div>\n' +
+            '                    <div class="row mt-2" id="task_Input_sub_new_new">\n' +
+            '                      <div class="col-4 row task_Input_div">\n' +
+            '                        <span class="col-3 text-right mt-3 no_padding mr10">任务1</span>\n' +
+            '                        <div class="col-8 no_padding">\n' +
+            '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+            '                        </div>\n' +
+            '                      </div>\n' +
+            '                      <div class="col-4 row task_Input_div">\n' +
+            '                        <span class="col-3 text-right mt-3 no_padding mr10">任务2</span>\n' +
+            '                        <div class="col-8 no_padding">\n' +
+            '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+            '                        </div>\n' +
+            '                      </div>\n' +
+            '                      <div class="col-4 row task_Input_div">\n' +
+            '                        <span class="col-3 text-right no_padding mr10 mt-3">任务3</span>\n' +
+            '                        <div class="col-8 no_padding">\n' +
+            '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+            '                        </div>\n' +
+            '                      </div>\n' +
+            '                    </div>\n' +
+            '                  </div>\n' +
+            '                  <span>\n' +
+            '              <a href="javascript:void(0)" class="btn btn-default ml20 small_panel_item_del">删除</a>\n' +
+            '            </span>\n' +
+            '                </div>\n' +
+            '</div></div></form>';
+        $("#large_panel").append(html);
+    }
+}
+;
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-competitions-index-page').length > 0) {
+        $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+            var $imageElement = $('.competition-image-' + data.source_id);
+            $imageElement.attr('src', data.url);
+            $imageElement.show();
+            $imageElement.next().html('重新上传');
+        });
+    }
+
+    $(".admin-competition-list-form").on("change", '.competitions-hot-select', function () {
+        var s_value = $(this).get(0).checked ? 1 : 0;
+        var json = {};
+        json["hot"] = s_value;
+        $.ajax({
+            url: "/admins/competitions/hot_setting",
+            type: "POST",
+            dataType:'json',
+            data: json,
+            success: function(){
+                $.notify({ message: '操作成功' });
+            }
+        });
+    });
+
+    // ============== 新增竞赛 ===============
+    var $modal = $('.modal.admin-create-competition-modal');
+    var $form = $modal.find('form.admin-create-competition-form');
+    var $competitionNameInput = $form.find('input[name="competition_name"]');
+
+    $form.validate({
+        errorElement: 'span',
+        errorClass: 'danger text-danger',
+        rules: {
+            competition_name: {
+                required: true
+            }
+        }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $competitionNameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+        $form.find('.error').html('');
+
+        if ($form.valid()) {
+            var url = $form.data('url');
+
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: url,
+                data: $form.serialize(),
+                success: function(){
+                    $.notify({ message: '创建成功' });
+                    $modal.modal('hide');
+
+                    setTimeout(function(){
+                        window.location.reload();
+                    }, 500);
+                },
+                error: function(res){
+                    var data = res.responseJSON;
+                    $form.find('.error').html(data.message);
+                }
+            });
+        }
+    });
+
+    // 导入学生
+    var $importScoreModal = $('.modal.admin-import-competition-score-modal');
+    var $importScoreForm = $importScoreModal.find('form.admin-import-competition-score-form');
+    var $competitionIdInput = $importScoreForm.find('input[name="competition_id"]');
+
+    $importScoreModal.on('show.bs.modal', function(event){
+        resetFileInputFunc($importScoreModal.find('.upload-file-input'));
+        $importScoreModal.find('.file-names').html('选择文件');
+        $importScoreModal.find('.upload-file-input').trigger('click');
+
+        var $link = $(event.relatedTarget);
+        var competitionId = $link.data('competition-id');
+        $competitionIdInput.val(competitionId);
+    });
+
+    $importScoreModal.on('change', '.upload-file-input', function(e){
+        var file = $(this)[0].files[0];
+        $importScoreModal.find('.file-names').html(file ? file.name : '请选择文件');
+    });
+
+    var importUserFormValid = function(){
+        if($importScoreForm.find('input[name="file"]').val() == undefined || $importScoreForm.find('input[name="file"]').val().length == 0){
+            $importScoreForm.find('.error').html('请选择文件');
+            return false;
+        }
+
+        return true;
+    };
+
+    var buildResultMessage = function(data){
+        var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+        if(data.fail.length > 0){
+            messageHtml += '<table class="table"><thead class="thead-light"><tr><th>数据</th><th>失败原因</th></tr></thead><tbody>';
+
+            data.fail.forEach(function(item){
+                messageHtml += '<tr><td>' + item.data + '</td><td>' + item.message + '</td></tr>';
+            });
+
+            messageHtml += '</tbody></table>'
+        }
+
+        return messageHtml;
+    };
+
+    $importScoreModal.on('click', '.submit-btn', function(){
+        $importScoreForm.find('.error').html('');
+
+        if (importUserFormValid()) {
+            $('body').mLoading({ text: '正在导入...' });
+
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: '/admins/import_competition_scores',
+                data: new FormData($importScoreForm[0]),
+                processData: false,
+                contentType: false,
+                success: function(data){
+                    $('body').mLoading('destroy');
+                    $importScoreModal.modal('hide');
+
+                    showMessageModal(buildResultMessage(data), function(){
+                        window.location.reload();
+                    });
+                },
+                error: function(res){
+                    $('body').mLoading('destroy');
+                    var data = res.responseJSON;
+                    $importScoreForm.find('.error').html(data.message);
+                }
+            });
+        }
+    });
+});
+
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-cooperatives-index-page').length > 0) {
+    // ------------ 保存链接 -----------
+    $('.coo-img-card').on('click', '.save-url-btn', function(){
+      var $link = $(this);
+      var cooId = $link.data('id');
+      var url = $('.coo-img-item-' + cooId).find('.url-input').val();
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/cooperatives/' + cooId,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { url: url },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/cooperatives/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('coo-img-container-alliance_coop');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+    var ele2 = document.getElementById('coo-img-container-com_coop');
+    dragula([ele2], { mirrorContainer: ele2 }).on('drop', onDropFunc);
+    var ele3 = document.getElementById('coo-img-container-edu_coop');
+    dragula([ele3], { mirrorContainer: ele3 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-cooperative-modal');
+    var $createForm = $createModal.find('form.admin-add-cooperative-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "coo_img[image]": {
+          required: true
+        }
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+
+      var $link = $(event.relatedTarget);
+      var imgType = $link.data('imgType');
+      $createForm.find('input[name="coo_img[img_type]"]').val(imgType);
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $cooImgItem = $('.coo-img-item-' + data.source_id);
+      $.post('/admins/cooperatives/'+ data.source_id + '/replace_image_url');
+      $cooImgItem.find('.coo-img-item-img img').attr('src', data.url);
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-courses-index-page').length > 0) {
+    let searchContainer = $(".course-list-form");
+    let searchForm = $("form.search-form",searchContainer);
+
+    searchContainer.on('change', '.course-homepage-show', function(){
+      searchForm.find('input[type="submit"]').trigger('click');
+    });
+
+    //导出
+    searchContainer.on('click', "#course-export", function () {
+      window.location.href = "/admins/courses.xlsx?" + searchForm.serialize();
+    });
+
+   $(".course-list-container").on("change", '.course-setting-form', function () {
+     var s_id = $(this).attr("data-id");
+     var s_value = $(this).val();
+     var s_name = $(this).attr("name");
+     var json = {};
+     json[s_name] = s_value;
+     $.ajax({
+       url: "/admins/courses/" + s_id,
+       type: "PUT",
+       dataType:'script',
+       data: json
+     });
+   });
+
+      // 清空
+      searchForm.on('click', '.clear-btn', function () {
+          searchForm.find('select[name="status"]').val('');
+          searchForm.find('.school-select').val('').trigger('change');
+          searchForm.find('input[name="keyword"]').val('');
+          searchForm.find('#homepage_show').attr('checked', false);
+          searchForm.find('input[type="submit"]').trigger('click');
+      });
+
+  // ************** 学校选择 *************
+  searchForm.find('.school-select').select2({
+      theme: 'bootstrap4',
+      placeholder: '请选择单位',
+      minimumInputLength: 1,
+      ajax: {
+          delay: 500,
+          url: '/api/schools/search.json',
+          dataType: 'json',
+          data: function (params) {
+              return {keyword: params.term};
+          },
+          processResults: function (data) {
+              return {results: data.schools}
+          }
+      },
+      templateResult: function (item) {
+          if (!item.id || item.id === '') return item.text;
+          return item.name;
+      },
+      templateSelection: function (item) {
+          if (item.id) {
+          }
+          return item.name || item.text;
+      }
+  });
+  }
+});
+
+$(document).on('turbolinks:load', function(){
+  if ($('body.admins-daily-school-statistics-index-page').length > 0) {
+    $('.export-action').on('click', function(){
+      var form = $(".daily-school-statistic-list-form .search-form")
+      var exportLink = $(this);
+      var keyword = form.find("input[name='keyword']").val();
+
+      var url = exportLink.data("url").split('?')[0] + "?keyword=" + keyword;
+      window.open(url);
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-dashboards-index-page').length > 0) {
+    // 月新增用户
+    var monthChart = echarts.init(document.getElementById('month-active-user'));
+    monthChart.setOption({
+      tooltip: {
+        show: "true",
+        trigger: 'item',
+        formatter: '{c0}',
+        backgroundColor: 'rgba(0,0,0,0.7)', // 背景
+        padding: [8, 10], //内边距
+        extraCssText: 'box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);', //添加阴影
+        axisPointer: { // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      series : [
+        {
+          name: '访问来源',
+          type: 'pie',
+          radius: '55%',
+          data: []
+        }
+      ]
+    });
+    monthChart.showLoading();
+    $.get('/admins/dashboards/month_active_user.json').done(function(data){
+      monthChart.setOption({
+        series: [
+          { data: data.data }
+        ]
+      });
+
+      monthChart.hideLoading();
+    });
+
+
+    // 近七天评测次数
+    // var evaluateChart = echarts.init(document.getElementById('evaluate-pie'));
+    // evaluateChart.setOption({
+    //   tooltip: {
+    //     show: "true",
+    //     trigger: 'item',
+    //     formatter: '{c0}',
+    //     backgroundColor: 'rgba(0,0,0,0.7)', // 背景
+    //     padding: [8, 10], //内边距
+    //     extraCssText: 'box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);', //添加阴影
+    //     axisPointer: { // 坐标轴指示器，坐标轴触发有效
+    //       type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+    //     }
+    //   },
+    //   xAxis: { type: 'category', boundaryGap: false, data: [] },
+    //   yAxis: { type: 'value' },
+    //   series: [{ data: [], type: 'line', areaStyle: {} }]
+    // });
+    // evaluateChart.showLoading();
+    // $.get('/admins/dashboards/evaluate.json').done(function(data){
+    //   evaluateChart.setOption({
+    //     xAxis: { data: data.names },
+    //     series: [{ data: data.data }]
+    //   });
+    //
+    //   evaluateChart.hideLoading();
+    // });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-departments-index-page').length > 0) {
+    var $searchContainer = $('.department-list-form');
+    var $searchForm = $searchContainer.find('form.search-form');
+    var $list = $('.department-list-container');
+
+    $searchContainer.on('change', '.form-check-input', function(){
+      $searchForm.find('input[type="submit"]').trigger('click');
+    });
+
+    // ============== 新建部门 ===============
+    var $modal = $('.modal.admin-create-department-modal');
+    var $form = $modal.find('form.admin-create-department-form');
+    var $departmentNameInput = $form.find('input[name="department_name"]');
+    var $schoolSelect = $modal.find('.school-select');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        school_id: {
+          required: true
+        },
+        department_name: {
+          required: true
+        }
+      },
+      messages: {
+        school_id: {
+          required: '请选择所属单位'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+      $departmentNameInput.val('');
+      $schoolSelect.select2('val', ' ');
+    });
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    };
+
+    var defineSchoolSelect = function(schools) {
+      $schoolSelect.select2({
+        theme: 'bootstrap4',
+        placeholder: '请选择所属单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#school_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    }
+
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+    // ============= 添加部门管理员 ==============
+    var $addMemberModal = $('.admin-add-department-member-modal');
+    var $addMemberForm = $addMemberModal.find('.admin-add-department-member-form');
+    var $memberSelect = $addMemberModal.find('.department-member-select');
+    var $departmentIdInput = $addMemberForm.find('input[name="department_id"]')
+
+    $addMemberModal.on('show.bs.modal', function(event){
+      var $link = $(event.relatedTarget);
+      var departmentId = $link.data('department-id');
+      $departmentIdInput.val(departmentId);
+
+      $memberSelect.select2('val', ' ');
+    });
+
+    $memberSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入要添加的管理员姓名',
+      multiple: true,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/admins/users',
+        dataType: 'json',
+        data: function(params){
+          return { name: params.term };
+        },
+        processResults: function(data){
+          return { results: data.users }
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        return item.real_name;
+      },
+      templateSelection: function(item){
+        if (item.id) {
+        }
+        return item.real_name || item.text;
+      }
+    });
+
+    $addMemberModal.on('click', '.submit-btn', function(){
+      $addMemberForm.find('.error').html('');
+
+      var departmentId = $departmentIdInput.val();
+      var memberIds = $memberSelect.val();
+      if (departmentId && memberIds && memberIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: '/admins/departments/' + departmentId + '/department_member',
+          data: { user_ids: memberIds }
+        });
+      } else {
+        $addMemberModal.modal('hide');
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-disciplines-index-page').length > 0) {
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-discipline-modal');
+    var $form = $modal.find('form.admin-create-discipline-form');
+    var $nameInput = $form.find('input[name="name"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        name: {
+          required: true
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $nameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+      $(".discipline-list-container").on("change", '.discipline-source-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/disciplines/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+
+      // 导入学生
+      var $importDisciplineModal = $('.modal.admin-import-discipline-modal');
+      var $importDisciplineForm = $importDisciplineModal.find('form.admin-import-discipline-form');
+
+      $importDisciplineModal.on('show.bs.modal', function(){
+          resetFileInputFunc($importDisciplineModal.find('.upload-file-input'));
+          $importDisciplineModal.find('.file-names').html('选择文件');
+          $importDisciplineModal.find('.upload-file-input').trigger('click');
+      });
+      $importDisciplineModal.on('change', '.upload-file-input', function(e){
+          var file = $(this)[0].files[0];
+          $importDisciplineModal.find('.file-names').html(file ? file.name : '请选择文件');
+      });
+
+      var importDisciplineFormValid = function(){
+          if($importDisciplineForm.find('input[name="file"]').val() == undefined || $importDisciplineForm.find('input[name="file"]').val().length == 0){
+              $importDisciplineForm.find('.error').html('请选择文件');
+              return false;
+          }
+
+          return true;
+      };
+
+      var buildResultMessage = function(data){
+          var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+          return messageHtml;
+      };
+
+      $importDisciplineModal.on('click', '.submit-btn', function(){
+          $importDisciplineForm.find('.error').html('');
+
+          if (importDisciplineFormValid()) {
+              $('body').mLoading({ text: '正在导入...' });
+
+              $.ajax({
+                  method: 'POST',
+                  dataType: 'json',
+                  url: '/admins/import_disciplines',
+                  data: new FormData($importDisciplineForm[0]),
+                  processData: false,
+                  contentType: false,
+                  success: function(data){
+                      $('body').mLoading('destroy');
+                      $importDisciplineModal.modal('hide');
+
+                      showMessageModal(buildResultMessage(data), function(){
+                          window.location.reload();
+                      });
+                  },
+                  error: function(res){
+                      $('body').mLoading('destroy');
+                      var data = res.responseJSON;
+                      $importDisciplineForm.find('.error').html(data.message);
+                  }
+              });
+          }
+      });
+
+      // ------------ 上移/下移 -------------
+      $('.discipline-list-container').on('click', ".move-action", function () {
+          var $doAction = $(this);
+
+          var disciplineId = $doAction.data('id');
+          var opr = $doAction.data('opr');
+          $.ajax({
+              url: '/admins/disciplines/' + disciplineId + '/adjust_position',
+              method: 'POST',
+              dataType: 'script',
+              data: {opr: opr}
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-ec-templates-index-page').length > 0) {
+    var add_modal = $(".ec-templates-new-add");
+    var template_file_name = add_modal.find(".template-file-upload");
+    var attachment_id_input = add_modal.find(".template_attachment_id");
+    var template_container = $(".ec-templates-list-container");
+
+    //编辑附件
+    template_container.on("click", ".edit-template-content", function () {
+      var t_id = $(this).attr("data-id");
+      var t_name = $(this).attr("data-name");
+      var template_name = $(this).attr("data-template-name");
+      var t_msg = $(this).attr("data-msg");
+      var template_id = $(this).attr("data-template-id");
+      add_modal.modal("show");
+      add_modal.find(".template_add_title").html(t_msg);
+      attachment_id_input.val(template_id);
+      add_modal.find(".template_show_id").val(t_id);
+      add_modal.find("input[name='name']").val(t_name);
+      add_modal.find("i.delete-template-icon").attr("data-id", template_id);
+      if(template_id !== "-1"){
+        template_file_name.find("span.template-file-input").hide();
+        template_file_name.find("span.template_file_show").show();
+        template_file_name.find("span.template_file_show_title").html(template_name);
+      }
+    });
+
+
+    //删除附件
+    add_modal.on("click",".delete-template-icon",function () {
+      var attachment_id = $(this).attr("data-id");
+      $.ajax({
+        url: "/api/attachments/" + attachment_id,
+        type: "delete",
+        contentType:"application/json",
+        dataType:"json",
+        success: function (data) {
+          template_file_name.find("span.template-file-input").show();
+          template_file_name.find("span.template_file_show").hide();
+          attachment_id_input.attr("value","-1")
+        }
+      })
+    });
+
+    //上传附件
+    add_modal.on("change", "#upload_template_file",function () {
+
+      var template = document.getElementById('upload_template_file').files[0];
+
+      var file_content = new FormData();
+
+      file_content.append("file", template);
+
+      $.ajax({
+        type: "POST",
+        url: "/api/attachments",
+        data:file_content,
+        contentType: false,
+        processData: false,
+        success: function (data) {
+          template_file_name.find("span.template-file-input").hide();
+          template_file_name.find("span.template_file_show").show();
+          template_file_name.find("span.template_file_show_title").html(template.name);
+          template_file_name.find("i.delete-template-icon").attr("data-id",data.id);
+          attachment_id_input.val(data.id)
+        }
+      })
+    })
+  }
+});
+$(document).on('turbolinks:load', function() {
+    if($('body.admins-enroll-lists-index-page').length > 0){
+        var search_form = $(".search-form");
+        //导出
+        $(".competition-enroll-list-form").on("click","#enroll-lists-export",function () {
+            window.location.href = "/admins/competitions/"+$(this).attr("data-competition-id")+"/enroll_lists/export.xlsx?" + search_form.serialize();
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-examination-authentications-index-page').length > 0) {
+    var $searchFrom = $('.examination-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if($(".admins-graduation-standards-index-page").length > 0){
+    $(".admin-body-container").on("click", ".standard-create-modal", function () {
+      var content = $(this).attr("data-content");
+      var g_id = $(this).attr("data-id");
+      var g_msg = $(this).attr("data-msg");
+
+      $("#graduation-modal-type").html(g_msg);
+      $("#graduation_standard_id").val(g_id);
+      $("textarea[name='content']").val(content);
+    })
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-help-centers-edit-page, body.admins-help-centers-update-page').length > 0) {
+    createMDEditor('help-center-editor', {});
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-identity-authentications-index-page').length > 0) {
+    var $searchFrom = $('.identity-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+
+    $('.batch-agree-btn').on('click', function(){
+      if($('.batch-check-box:checked').length === 0){
+        $.notify({ message: '请先选择数据' }, { type: 'info' });
+        return;
+      }
+
+      customConfirm({
+        content: '确认审核通过？',
+        ok: function(){
+          var ids = $('.batch-check-box:checked').map(function(_, e){ return $(e).val() }).get();
+
+          $.ajax({
+            url: '/admins/identity_authentications/batch_agree',
+            method: 'POST',
+            dataType: 'json',
+            data: { ids: ids },
+            success: function(data){
+              $.notify({ message: '操作成功' });
+              window.location.reload();
+            },
+            error: function(res){
+              $.notify({ message: res.responseJSON.message }, { type: 'danger' });
+            }
+          })
+        }
+      })
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-item-authentications-index-page').length > 0) {
+    var $searchFrom = $('.item-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratory-settings-show-page, body.admins-laboratory-settings-update-page').length > 0) {
+    var $container = $('.edit-laboratory-setting-container');
+    var $form = $container.find('.edit_laboratory');
+
+    $('.logo-item-left, .banner-item-bottom').on("change", 'input[type="file"]', function () {
+      var $fileInput = $(this);
+      var file = this.files[0];
+      var imageType = /image.*/;
+      if (file && file.type.match(imageType)) {
+        var reader = new FileReader();
+        reader.onload = function () {
+          var $box = $fileInput.parent();
+          $box.find('img').attr('src', reader.result).css('display', 'block');
+          $box.addClass('has-img');
+        };
+        reader.readAsDataURL(file);
+      } else {
+      }
+    });
+
+    createMDEditor('laboratory-footer-editor', { height: 200, placeholder: '请输入备案信息' });
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      errorPlacement:function(error,element){
+        if(element.parent().hasClass("input-group")){
+          element.parent().after(error);
+        }else{
+          element.after(error)
+        }
+      },
+      rules: {
+        identifier: {
+          required: true,
+          checkSite: true
+        },
+        name: {
+          required: true
+        }
+      }
+    });
+    $.validator.addMethod("checkSite",function(value,element,params){
+      var checkSite = /^(?=^.{3,255}$)[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+$/;
+      return this.optional(element)||(checkSite.test(value + '.educoder.com'));
+    },"域名不合法！");
+
+    $form.on('click', '.submit-btn', function(){
+      $form.find('.submit-btn').attr('disabled', 'disabled');
+      $form.find('.error').html('');
+      var valid = $form.valid();
+
+      $('input[name="navbar[][name]"]').each(function(_, e){
+        var $ele = $(e);
+        if($ele.val() === undefined || $ele.val().length === 0){
+          $ele.addClass('danger text-danger');
+          valid = false;
+        } else {
+          $ele.removeClass('danger text-danger');
+        }
+      });
+
+      if(!valid) return;
+      $.ajax({
+        method: 'PATCH',
+        dataType: 'json',
+        url: $form.attr('action'),
+        data: new FormData($form[0]),
+        processData: false,
+        contentType: false,
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          window.location.reload();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $form.find('.error').html(data.message);
+        },
+        complete: function(){
+          $form.find('.submit-btn').attr('disabled', false);
+        }
+      });
+    })
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratories-index-page').length > 0) {
+    var $searchContainer = $('.laboratory-list-form');
+    var $searchForm = $searchContainer.find('form.search-form');
+    var $list = $('.laboratory-list-container');
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-laboratory-modal');
+    var $form = $modal.find('form.admin-create-laboratory-form');
+    var $schoolSelect = $modal.find('.school-select');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        school_id: {
+          required: true
+        }
+      },
+      messages: {
+        school_id: {
+          required: '请选择所属单位'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+      $schoolSelect.select2('val', ' ');
+    });
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    };
+
+    var defineSchoolSelect = function(schools) {
+      $schoolSelect.select2({
+        theme: 'bootstrap4',
+        placeholder: '请选择单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#school_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+    // ============= 添加管理员 ==============
+    var $addMemberModal = $('.admin-add-laboratory-user-modal');
+    var $addMemberForm = $addMemberModal.find('.admin-add-laboratory-user-form');
+    var $memberSelect = $addMemberModal.find('.laboratory-user-select');
+    var $laboratoryIdInput = $addMemberForm.find('input[name="laboratory_id"]')
+
+    $addMemberModal.on('show.bs.modal', function(event){
+      var $link = $(event.relatedTarget);
+      var laboratoryId = $link.data('laboratory-id');
+      $laboratoryIdInput.val(laboratoryId);
+
+      $memberSelect.select2('val', ' ');
+    });
+
+    $memberSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入要添加的管理员姓名',
+      multiple: true,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/admins/users',
+        dataType: 'json',
+        data: function(params){
+          return { name: params.term };
+        },
+        processResults: function(data){
+          return { results: data.users }
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        return $("<span>" + item.real_name + " <span class='font-12'>" + item.school_name + ' ' + item.hidden_phone + "</span></span>");
+      },
+      templateSelection: function(item){
+        if (item.id) {
+        }
+        return item.real_name || item.text;
+      }
+    });
+
+    $addMemberModal.on('click', '.submit-btn', function(){
+      $addMemberForm.find('.error').html('');
+
+      var laboratoryId = $laboratoryIdInput.val();
+      var memberIds = $memberSelect.val();
+      if (laboratoryId && memberIds && memberIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: '/admins/laboratories/' + laboratoryId + '/laboratory_user',
+          data: { user_ids: memberIds }
+        });
+      } else {
+        $addMemberModal.modal('hide');
+      }
+    });
+
+      $(".laboratory-list-container").on("change", '.laboratory-sync-course', function () {
+          var s_id = $(this).attr("data-id");
+          var json = {};
+          $.ajax({
+              url: "/admins/laboratories/" + s_id + "/update_sync_course",
+              type: "POST",
+              dataType:'script',
+              data: json
+          })
+      });
+
+      $(".laboratory-list-container").on("change", '.laboratory-sync-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/laboratories/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratory-shixuns-index-page').length > 0) {
+    var $searchForm = $('.laboratory-shixun-list-form .search-form');
+    var laboratoryId = $('.laboratory-shixun-list-container').data('id');
+
+    $searchForm.find('select#tag_id').select2({
+      placeholder: "请选择",
+      allowClear: true
+    });
+
+    // 定义状态切换监听事件
+    var defineStatusChangeFunc = function (doElement, undoElement, url, callback) {
+      $('.laboratory-shixun-list-container').on('click', doElement, function () {
+        var $doAction = $(this);
+        var $undoAction = $doAction.siblings(undoElement);
+
+        var laboratoryShixunId = $doAction.data('id');
+        customConfirm({
+          content: '确认进行该操作吗？',
+          ok: function () {
+            $.ajax({
+              url: '/admins/laboratories/' + laboratoryId + '/laboratory_shixuns/' + laboratoryShixunId + url,
+              method: 'POST',
+              dataType: 'json',
+              success: function () {
+                show_success_flash();
+                $doAction.hide();
+                $undoAction.show();
+                if (callback && typeof callback === "function") {
+                  callback(laboratoryShixunId, url);
+                }
+              }
+            });
+          }
+        });
+      });
+    }
+
+    // 首页展示与取消首页展示
+    var homepageShowCallback = function (laboratoryShixunId, url) {
+      var $laboratoryShixunItem = $('.laboratory-shixun-list-container').find('.laboratory-shixun-item-' + laboratoryShixunId);
+
+      if (url === '/homepage') {
+        $laboratoryShixunItem.find('.homepage-badge').show();
+      } else {
+        $laboratoryShixunItem.find('.homepage-badge').hide();
+      }
+    }
+    defineStatusChangeFunc('.homepage-show-action', '.homepage-hide-action', '/homepage', homepageShowCallback);
+    defineStatusChangeFunc('.homepage-hide-action', '.homepage-show-action', '/cancel_homepage', homepageShowCallback);
+
+    // 添加实训功能
+    var $addModal = $('.modal.admin-add-laboratory-shixun-modal');
+    var $addForm = $addModal.find('form.admin-add-laboratory-user-form');
+    var $shixunSelect = $addForm.find('select.shixun-select');
+
+    $addModal.on('show.bs.modal', function(){
+      $addModal.find('.error').html('');
+      $shixunSelect.select2('val', ' ');
+    });
+
+    $shixunSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入实训名称/创建者检索',
+      multiple: true,
+      closeOnSelect: false,
+      ajax: {
+        delay: 500,
+        url: '/admins/laboratories/' + laboratoryId + '/shixuns_for_select',
+        dataType: 'json',
+        data: function(params){
+          return { keyword: params.term, page: params.page || 1, per_page: 20 };
+        },
+        processResults: function(data, params){
+          params.page = params.page || 1;
+
+          return {
+            results: data.shixuns,
+            pagination: {
+              more: (params.page * 20) < data.count
+            }
+          };
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        var ele = '<span>'
+        ele += '<span>' + item.name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.creator_name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.status_text+ '</span>';
+        ele += '</span>';
+
+        return $(ele);
+      },
+      templateSelection: function(item){
+        if (item.id) {
+        }
+        var ele = '<span>' + (item.name || item.text) + '<span class="font-12"> -- ' + item.creator_name + '</span></span>'
+        return $(ele);
+      }
+    });
+
+    $addModal.on('click', '.submit-btn', function(){
+      $addModal.find('.error').html('');
+
+      var shixunIds = $shixunSelect.val();
+      if (shixunIds && shixunIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/laboratories/' + laboratoryId + '/laboratory_shixuns',
+          data: { shixun_ids: shixunIds },
+          success: function(){
+            show_success_flash();
+            window.location.reload();
+          },
+          error: function(res){
+            $addModal.find('.error').html(res.responseJSON.message);
+          }
+        });
+      } else {
+        $addModal.find('.error').html('请选择实训');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratory-subjects-index-page').length > 0) {
+    var $searchForm = $('.laboratory-subject-list-form .search-form');
+    var laboratoryId = $('.laboratory-subject-list-container').data('id');
+
+    // ************** 学校选择 *************
+    $searchForm.find('.school-select').select2({
+      theme: 'bootstrap4',
+      placeholder: '请选择创建者单位',
+      allowClear: true,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/api/schools/search.json',
+        dataType: 'json',
+        data: function (params) {
+          return {keyword: params.term};
+        },
+        processResults: function (data) {
+          return {results: data.schools}
+        }
+      },
+      templateResult: function (item) {
+        if (!item.id || item.id === '') return item.text;
+        return item.name;
+      },
+      templateSelection: function (item) {
+        if (item.id) {
+        }
+        return item.name || item.text;
+      }
+    });
+
+    // 定义状态切换监听事件
+    var defineStatusChangeFunc = function (doElement, undoElement, url, callback) {
+      $('.laboratory-subject-list-container').on('click', doElement, function () {
+        var $doAction = $(this);
+        var $undoAction = $doAction.siblings(undoElement);
+
+        var laboratorySubjectId = $doAction.data('id');
+        customConfirm({
+          content: '确认进行该操作吗？',
+          ok: function () {
+            $.ajax({
+              url: '/admins/laboratories/' + laboratoryId + '/laboratory_subjects/' + laboratorySubjectId + url,
+              method: 'POST',
+              dataType: 'json',
+              success: function () {
+                show_success_flash();
+                $doAction.hide();
+                $undoAction.show();
+                if (callback && typeof callback === "function") {
+                  callback(laboratorySubjectId, url);
+                }
+              }
+            });
+          }
+        });
+      });
+    }
+
+    // 首页展示与取消首页展示
+    var homepageShowCallback = function (laboratoryShixunId, url) {
+      var $laboratoryShixunItem = $('.laboratory-subject-list-container').find('.laboratory-subject-item-' + laboratoryShixunId);
+
+      if (url === '/homepage') {
+        $laboratoryShixunItem.find('.homepage-badge').show();
+      } else {
+        $laboratoryShixunItem.find('.homepage-badge').hide();
+      }
+    }
+    defineStatusChangeFunc('.homepage-show-action', '.homepage-hide-action', '/homepage', homepageShowCallback);
+    defineStatusChangeFunc('.homepage-hide-action', '.homepage-show-action', '/cancel_homepage', homepageShowCallback);
+
+    // 添加实践课程功能
+    var $addModal = $('.modal.admin-add-laboratory-subject-modal');
+    var $addForm = $addModal.find('form.admin-add-laboratory-user-form');
+    var $subjectSelect = $addForm.find('select.subject-select');
+
+    $addModal.on('show.bs.modal', function(){
+      $addModal.find('.error').html('');
+      $subjectSelect.select2('val', ' ');
+    });
+
+    $subjectSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入课程名称/创建者检索',
+      multiple: false,
+      closeOnSelect: true,
+      ajax: {
+        delay: 500,
+        url: '/admins/laboratories/' + laboratoryId + '/subjects_for_select',
+        dataType: 'json',
+        data: function(params){
+          return { keyword: params.term, page: params.page || 1, per_page: 20 }
+        },
+        processResults: function(data, params){
+          params.page = params.page || 1;
+
+          return {
+            results: data.subjects,
+            pagination: {
+              more: (params.page * 20) < data.count
+            }
+          };
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        var ele = '<span>';
+        ele += '<span>' + item.name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.creator_name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.status_text+ '</span>';
+        ele += '</span>';
+
+        return $(ele);
+      },
+      templateSelection: function(item){
+          if(!item.id || item.id === '') return item.text;
+          var ele = '<span>' + (item.name || item.text) + '<span class="font-12"> -- ' + item.creator_name + '</span></span>';
+          return $(ele);
+      }
+    });
+
+    $addModal.on('click', '.submit-btn', function(){
+      $addModal.find('.error').html('');
+
+      var subjectIds = $subjectSelect.val();
+      if (subjectIds && subjectIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/laboratories/' + laboratoryId + '/laboratory_subjects',
+          data: { subject_id: subjectIds },
+          success: function(){
+            show_success_flash();
+            window.location.reload();
+          },
+          error: function(res){
+            $addModal.find('.error').html(res.responseJSON.message);
+          }
+        });
+      } else {
+        $addModal.find('.error').html('请选择课程');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-library-applies-index-page').length > 0) {
+    var $searchFrom = $('.library-applies-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-major-informations-index-page').length > 0) {
+    var box_contain = $(".major-informations-list-container");
+    box_contain.on("click",".collapse-item",function () {
+      var a_fa = $(this).find("i");
+      if(a_fa.hasClass("fa-caret-right")){
+        a_fa.removeClass("fa-caret-right").addClass("fa-caret-down");
+      }else{
+        a_fa.removeClass("fa-caret-down").addClass("fa-caret-right");
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-message-modal');
+  var $submitBtn = $modal.find('.submit-btn');
+  if ($modal.length > 0) {
+    $modal.on('hide.bs.modal', function(){
+      $modal.find('.modal-body').html('');
+      $submitBtn.unbind();
+    });
+  }
+});
+
+function showMessageModal(html, callback) {
+  var $modal = $('.modal.admin-message-modal');
+  var $submitBtn = $modal.find('.submit-btn');
+  $submitBtn.unbind();
+  if(callback !== undefined && typeof callback === 'function'){
+    $submitBtn.on('click', callback);
+  }
+
+  $modal.find('.modal-body').html(html);
+  $modal.modal('show');
+}
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-mirror-repositories-edit-page, body.admins-mirror-repositories-update-page').length > 0) {
+    var $form = $('form.edit-mirror');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "mirror_repository[type_name]": {
+          required: true
+        }
+      }
+    });
+
+    $form.submit(function(e){
+      if(!$form.valid()){ e.preventDefault(); }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-mirror-repositories-index-page').length > 0) {
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-mirror-scripts-edit-page, body.admins-mirror-scripts-update-page, body.admins-mirror-scripts-new-page, body.admins-mirror-scripts-create-page').length > 0) {
+    var $form = $('form.script-form');
+
+    // codemirror编辑器
+    var scriptEditor = CodeMirror.fromTextArea(document.getElementById('mirror_script_script'), {
+      lineNumbers: true,
+      mode: 'shell',
+      theme: "default",
+      indentUnit: 4, //代码缩进为一个tab的距离
+      matchBrackets: true,
+      autoRefresh: true,
+      smartIndent: true,//智能换行
+      styleActiveLine: true,
+      lint: true
+    });
+    scriptEditor.setSize('auto', '600px');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "mirror_script[script_type]": {
+          required: true
+        }
+      }
+    });
+
+    $form.submit(function(e){
+      if(!$form.valid()){ e.preventDefault(); }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-choose-mirror-modal', function(){
+    var $modal = $('.modal.admin-choose-mirror-modal');
+    var $form = $modal.find('form.admin-choose-mirror-form');
+
+    var validateForm = function(){
+      var checkedValue = $form.find('input[name="mirror_number"]:checked').val();
+
+      if(checkedValue == undefined){
+        $modal.find('.error').html('必须选择一种镜像保存！');
+        return false;
+      }
+      return true;
+    }
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if (validateForm()) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: url,
+          data: $form.serialize(),
+        }).done(function(){
+          $modal.modal('hide');
+        });
+      }
+    });
+  })
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-department-modal', function(){
+    var $modal = $('.modal.admin-edit-department-modal');
+    var $form = $modal.find('form.admin-edit-department-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'department[name]': {
+          required: true,
+          maxlength: 20
+        },
+        'department[host_count]': {
+          digits: true
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if ($form.valid()) {
+        $.ajax({
+          method: 'PATCH',
+          dataType: 'script',
+          url: url,
+          data: $form.serialize()
+        });
+      }
+    });
+  })
+});
+$(document).on('turbolinks:load', function () {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-discipline-modal', function () {
+        var $modal = $('.modal.admin-edit-discipline-modal');
+        var $form = $modal.find('form.admin-edit-discipline-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'discipline[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', submit_edit_form);
+
+        $form.find("#discipline_name").keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_edit_form();
+                return false;
+            }
+        });
+
+        function submit_edit_form() {
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        }
+    });
+});
+$(document).on('turbolinks:load', function() {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-repertoire-modal', function(){
+        var $modal = $('.modal.admin-edit-repertoire-modal');
+        var $form = $modal.find('form.admin-edit-repertoire-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'repertoire[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', function(){
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        });
+    });
+});
+$(document).on('turbolinks:load', function () {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-sub-discipline-modal', function () {
+        var $modal = $('.modal.admin-edit-sub-discipline-modal');
+        var $form = $modal.find('form.admin-edit-sub-discipline-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'sub_discipline[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', submit_edit_form);
+
+        $form.find("#sub_discipline_name").keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_edit_form();
+                return false;
+            }
+        });
+
+        function submit_edit_form() {
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        }
+
+    });
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-sub-repertoire-modal', function(){
+    var $modal = $('.modal.admin-edit-sub-repertoire-modal');
+    var $form = $modal.find('form.admin-edit-sub-repertoire-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'sub_repertoire[name]': {
+          required: true,
+          maxlength: 20
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if ($form.valid()) {
+        $.ajax({
+            method: 'PATCH',
+            dataType: 'script',
+            url: url,
+            data: $form.serialize()
+        });
+      }
+    });
+  });
+});
+$(document).on('turbolinks:load', function () {
+	$('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-subject-modal', function () {
+		var $modal = $('.modal.admin-edit-subject-modal');
+		var $form = $modal.find('form.admin-edit-subject-form');
+
+		$modal.on('click', '.submit-btn', function () {
+			$form.find('.error').html('');
+			var url = $form.attr('action');
+
+			$.ajax({
+				method: 'PATCH',
+				dataType: 'script',
+				url: url,
+				data: $form.serialize()
+			});
+		});
+	})
+});
+$(document).on('turbolinks:load', function () {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-tag-discipline-modal', function () {
+        var $modal = $('.modal.admin-edit-tag-discipline-modal');
+        var $form = $modal.find('form.admin-edit-tag-discipline-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'tag_discipline[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', submit_edit_form);
+
+        $form.find("#tag_discipline_name").keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_edit_form();
+                return false;
+            }
+        });
+
+        function submit_edit_form() {
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        }
+    });
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-tag-repertoire-modal', function(){
+    var $modal = $('.modal.admin-edit-tag-repertoire-modal');
+    var $form = $modal.find('form.admin-edit-tag-repertoire-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'tag_repertoire[name]': {
+          required: true,
+          maxlength: 20
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if ($form.valid()) {
+        $.ajax({
+            method: 'PATCH',
+            dataType: 'script',
+            url: url,
+            data: $form.serialize()
+        });
+      }
+    });
+  });
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-import-course-member-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-import-course-member-form');
+
+    var resetFileInputFunc = function(file){
+      file.after(file.clone().val(""));
+      file.remove();
+    }
+
+    $modal.on('show.bs.modal', function(){
+      $modal.find('.file-names').html('选择文件');
+      $modal.find('.upload-file-input').trigger('click');
+    });
+    $modal.on('hide.bs.modal', function(){
+      resetFileInputFunc($modal.find('.upload-file-input'));
+    });
+    $modal.on('change', '.upload-file-input', function(e){
+      var file = $(this)[0].files[0];
+      $modal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    var importFormValid = function(){
+      if($form.find('input[name="file"]').val() == undefined || $form.find('input[name="file"]').val().length == 0){
+        $form.find('.error').html('请选择文件');
+        return false;
+      }
+
+      return true;
+    };
+
+    var buildResultMessage = function(data){
+      var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+      if(data.fail.length > 0){
+        messageHtml += '<table class="table"><thead class="thead-light"><tr><th>数据</th><th>失败原因</th></tr></thead><tbody>';
+
+        data.fail.forEach(function(item){
+          messageHtml += '<tr><td>' + item.data + '</td><td>' + item.message + '</td></tr>';
+        });
+
+        messageHtml += '</tbody></table>'
+      }
+
+      return messageHtml;
+    }
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if (importFormValid()) {
+        $('body').mLoading({ text: '正在导入...' });
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/import_course_members',
+          data: new FormData($form[0]),
+          processData: false,
+          contentType: false,
+          success: function(data){
+            $('body').mLoading('destroy');
+            $modal.modal('hide');
+
+            showMessageModal(buildResultMessage(data), function(){
+              window.location.reload();
+            });
+          },
+          error: function(res){
+            $('body').mLoading('destroy');
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-merge-course-list-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-merge-course-list-form');
+    var $originCourseListIdInput = $form.find('input[name="origin_course_list_id"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+          course_list_name: {
+          required: true
+        }
+      },
+      messages: {
+          course_list_name: {
+          required: '请输入课程名称'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var couresListId = $link.data('courseListId');
+      var url = $link.data('url');
+
+      $originCourseListIdInput.val(couresListId);
+      $form.data('url', url);
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '操作成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-merge-department-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-merge-department-form');
+    var $schoolIdInput = $form.find('input[name="school_id"]');
+    var $originDepartmentIdInput = $form.find('input[name="origin_department_id"]');
+    var $departmentSelect = $modal.find('.department-select');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        department_id: {
+          required: true
+        }
+      },
+      messages: {
+        department_id: {
+          required: '请选择部门'
+        }
+      }
+    });
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    };
+
+    var defineDepartmentSelect = function(departments) {
+      $departmentSelect.empty();
+
+      $departmentSelect.select2({
+        theme: 'bootstrap4',
+        placeholder: '请选择所属部门',
+        data: departments,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $form.find('#department_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+      $departmentSelect.select2('val', ' ');
+    };
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var schoolId = $link.data('schoolId');
+      var url = $link.data('url');
+
+      $schoolIdInput.val(schoolId);
+      $originDepartmentIdInput.val($link.data('departmentId'));
+      $form.data('url', url);
+      $.ajax({
+        url: '/api/schools/' + schoolId + '/departments/for_option.json',
+        dataType: 'json',
+        type: 'GET',
+        success: function(data) {
+          defineDepartmentSelect(data.departments);
+        }
+      });
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '操作成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-replace-mirror-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-replace-mirror-form');
+    var $mirrorIdInput = $modal.find('.modal-body input[name="mirror_id"]');
+    var $mirrorSelect = $modal.find('.new-mirror-select');
+
+    var setMirror = function(id, name){
+      $mirrorIdInput.val(id);
+      $form.find('.mirror-id-container').html(id);
+      $form.find('.mirror-name-container').html(name);
+    }
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        new_mirror_id: {
+          required: true
+        },
+      },
+      messages: {
+        new_mirror_id: {
+          required: '请选择新镜像'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var mirrorId = $link.data('id');
+      var mirrorName = $link.data('name');
+
+      setMirror(mirrorId, mirrorName);
+      $mirrorSelect.select2('val', ' ');
+    });
+    $modal.on('hide.bs.modal', function () {
+      setMirror('', '');
+      $mirrorSelect.select2('val', ' ');
+      $('#new_mirror_id-error').remove();
+    });
+
+    $mirrorSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '输入要合并的镜像名',
+      minimumInputLength: 1,
+      ajax: {
+        url: '/admins/mirror_repositories/for_select',
+        dataType: 'json',
+        data: function(params){
+          return { keyword: params.term };
+        },
+        processResults: function(data){
+          return { results: data.mirrors }
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        return item.name;
+      },
+      templateSelection: function(item){
+        if (item.id) {
+          $('#new_mirror_id-error').remove();
+          $('#new_mirror_id').val(item.id);
+        }
+        return item.name || item.text;
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: url,
+          data: $form.serialize(),
+        }).done(function(){
+          $modal.modal('hide');
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.admin-save-competition-prize-modal', function(event){
+    var $modal = $('.modal.admin-save-competition-prize-modal');
+    var $form = $modal.find('form.admin-save-competition-prize-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'competition_prize[name]': {
+          required: true,
+          maxlength: 10
+        },
+        'competition_prize[num]': {
+          required: true,
+          digits: true,
+          min: 1
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+      var formMethod = $form.data('form-method')
+
+      if ($form.valid()) {
+        $.ajax({
+          method: formMethod,
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(data){
+            if(data && data.status === 0) {
+              show_success_flash();
+              $(document).trigger('prize.save.success');
+              $modal.modal('hide');
+            } else {
+              $modal.find('.error').html(data.message)
+            }
+          }
+        });
+      }
+    });
+  })
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-select-school-modal');
+  if ($modal.length > 0) {
+    var $link = null;
+    var $form = $modal.find('form.admin-select-school-form');
+    var multiple = $form.data('multiple');
+
+    $form.find('.school-select').select2({
+      theme: 'bootstrap4',
+      placeholder: '请选择',
+      multiple: multiple,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/api/schools/search.json',
+        dataType: 'json',
+        data: function (params) {
+          return {keyword: params.term};
+        },
+        processResults: function (data) {
+          return {results: data.schools}
+        }
+      },
+      templateResult: function (item) {
+        if (!item.id || item.id === '') return item.text;
+        var html = "<span>" + item.name + "<span class='ml-4 font-12'>";
+        if(item.province){ html += item.province }
+        html += "</span></span>";
+        return $(html);
+      },
+      templateSelection: function (item) {
+        if (item.id) {
+        }
+        return item.name || item.text;
+      }
+    });
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        school_ids: {
+          required: true
+        }
+      },
+      messages: {
+        school_ids: {
+          required: '请选择'
+        }
+      }
+    });
+
+    $modal.on('show.bs.modal', function(event){
+      $link = $(event.relatedTarget);
+    });
+
+    $modal.on('hide.bs.modal', function(){
+      $form.find('.error').html('');
+      $form.find('.school-select').select2('val', ' ');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if($form.valid()){
+        var url = $form.data('url');
+        var schoolIds = $form.find('#school_ids').val();
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: { school_ids: schoolIds },
+          success: function(){
+            $.notify({ message: '操作成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-upload-file-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-upload-file-form')
+    var $sourceIdInput = $modal.find('input[name="source_id"]');
+    var $sourceTypeInput = $modal.find('input[name="source_type"]');
+    var $suffixInput = $modal.find('input[name="suffix"]');
+
+    $modal.on('show.bs.modal', function(event){
+      var $link = $(event.relatedTarget);
+      var sourceId = $link.data('sourceId');
+      var sourceType = $link.data('sourceType');
+      var suffix = $link.data('suffix');
+
+      $sourceIdInput.val(sourceId);
+      $sourceTypeInput.val(sourceType);
+      if(suffix != undefined){ $suffixInput.val(suffix); }
+
+      $modal.find('.upload-file-input').trigger('click');
+    });
+
+    $modal.find('.upload-file-input').on('change', function(e){
+      var file = $(this)[0].files[0];
+
+      if(file){
+        $modal.find('.file-names').html(file.name);
+        $modal.find('.submit-btn').trigger('click');
+      }
+    })
+
+    var formValid = function(){
+      if($form.find('input[name="file"]').val() == undefined || $form.find('input[name="file"]').val().length == 0){
+        $form.find('.error').html('请选择文件');
+        return false;
+      }
+
+      return true;
+    };
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if (formValid()) {
+        var formDataString = $form.serialize();
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/files?' + formDataString,
+          data: new FormData($form[0]),
+          processData: false,
+          contentType: false,
+          success: function(data){
+            $.notify({ message: '上传成功' });
+            $modal.find('.file-names').html('');
+            $modal.trigger('upload:success', data);
+            $modal.modal('hide');
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-professional-authentications-index-page').length > 0) {
+    var $searchFrom = $('.professional-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+
+    $('.batch-agree-btn').on('click', function(){
+      if($('.batch-check-box:checked').length === 0){
+        $.notify({ message: '请先选择数据' }, { type: 'info' });
+        return;
+      }
+
+      customConfirm({
+        content: '确认审核通过？',
+        ok: function(){
+          var ids = $('.batch-check-box:checked').map(function(_, e){ return $(e).val() }).get();
+
+          $.ajax({
+            url: '/admins/professional_authentications/batch_agree',
+            method: 'POST',
+            dataType: 'json',
+            data: { ids: ids },
+            success: function(data){
+              $.notify({ message: '操作成功' });
+              window.location.reload();
+            },
+            error: function(res){
+              $.notify({ message: res.responseJSON.message }, { type: 'danger' });
+            }
+          })
+        }
+      })
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-project-package-applies-index-page').length > 0) {
+    var $searchFrom = $('.project-package-applies-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('all');
+
+      if($link.data('value') === 'all'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-projects-index-page').length > 0) {
+        var $form = $('.search-form');
+
+        // 清空
+        $form.on('click', '.clear-btn', function () {
+            $form.find('input[name="search"]').val('');
+            $form.find('input[type="submit"]').trigger('click');
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-repertoires-index-page').length > 0) {
+
+        // ============== 新建 ===============
+        var $modal = $('.modal.admin-create-repertoire-modal');
+        var $form = $modal.find('form.admin-create-repertoire-form');
+        var $nameInput = $form.find('input[name="name"]');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: {
+                    required: true
+                }
+            }
+        });
+
+        // modal ready fire
+        $modal.on('show.bs.modal', function () {
+            $nameInput.val('');
+        });
+
+        $modal.on('click', '.submit-btn', function(){
+            $form.find('.error').html('');
+
+            if ($form.valid()) {
+                var url = $form.data('url');
+
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $modal.modal('hide');
+
+                        setTimeout(function(){
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            }
+        });
+
+        $(".repertoire-list-container").on("change", '.repertoire-source-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/repertoires/" + s_id,
+                type: "PUT",
+                dataType:'script',
+                data: json
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-salesman-channels-index-page').length > 0) {
+
+        // ============= 添加销售人员 ==============
+        var $addMemberModal = $('.admin-add-salesman-channel-user-modal');
+        var $addMemberForm = $addMemberModal.find('.admin-add-salesman-channel-user-form');
+        var $memberSelect = $addMemberModal.find('.salesman-channel-user-select');
+        var $form = $addMemberModal.find('form.admin-add-salesman-user-form');
+
+        // 搜索
+        var searchscForm = $(".saleman-channel-list-form .search-form");
+
+
+        $addMemberModal.on('show.bs.modal', function(event){
+            $memberSelect.select2('val', ' ');
+        });
+
+        $memberSelect.select2({
+            theme: 'bootstrap4',
+            placeholder: '请输入要添加的单位',
+            multiple: true,
+            minimumInputLength: 1,
+            ajax: {
+                delay: 500,
+                url: '/admins/schools',
+                dataType: 'json',
+                data: function(params){
+                    return { keyword: params.term };
+                },
+                processResults: function(data){
+                    return { results: data.schools }
+                }
+            },
+            templateResult: function (item) {
+                if(!item.id || item.id === '') return '';
+                return $("<span>" + item.name  + "</span>");
+            },
+            templateSelection: function(item){
+                if (item.id) {
+                }
+                return item.name || '';
+            }
+        });
+
+        $addMemberModal.on('click', '.submit-btn', function(){
+            $addMemberForm.find('.error').html('');
+
+            // var salesmanId = $salesmanIdInput.val();
+            var memberIds = $memberSelect.val();
+            if (memberIds && memberIds.length > 0) {
+                var url = $form.data('url');
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $addMemberModal.modal('hide');
+                        searchscForm.find('input[name="keyword"]').val('');
+
+                        setTimeout(function(){
+                            submitForm();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $addMemberForm.find('.error').html(data.message);
+                    }
+                });
+            } else {
+                $addMemberModal.modal('hide');
+            }
+        });
+
+
+        // 清空
+        searchscForm.on('click', '.clear-btn', function () {
+            searchscForm.find('.start_date').val('');
+            searchscForm.find('.end_date').val('').trigger('change');
+            searchscForm.find('input[name="keyword"]').val('');
+        });
+
+        // 时间跨度
+        var baseOptions = {
+            autoclose: true,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd',
+            startDate: '2017-04-01'
+        };
+
+        var defineDateRangeSelect = function(element){
+            var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, baseOptions);
+            $(element).datepicker(options);
+
+            $(element).find('.start-date').datepicker().on('changeDate', function(e){
+                $(element).find('.end-date').datepicker('setStartDate', e.date);
+            });
+        };
+
+        defineDateRangeSelect('.grow-date-input-daterange');
+
+
+        // 区间搜索
+        searchscForm.on('click', ".search-btn", function(){
+            submitForm();
+        });
+
+        var submitForm = function(){
+            var url =  searchscForm.data('search-form-url');
+            var form = searchscForm;
+            $.ajax({
+                url: url,
+                data: form.serialize(),
+                dataType: "script"
+            })
+        };
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-salesman-customers-index-page').length > 0) {
+
+        // ============= 添加销售人员 ==============
+        var $addMemberModal = $('.admin-add-salesman-customer-user-modal');
+        var $addMemberForm = $addMemberModal.find('.admin-add-salesman-customer-user-form');
+        var $memberSelect = $addMemberModal.find('.salesman-customer-user-select');
+        var $salesmanIdInput = $('.salesman-customer-list-form').find(".btn-primary");
+
+        $addMemberModal.on('show.bs.modal', function(event){
+            var $link = $(event.relatedTarget);
+            // var salesmanId = $link.data('salesman_id');
+            // $salesmanIdInput.val(salesmanId);
+
+            $memberSelect.select2('val', ' ');
+        });
+
+        $memberSelect.select2({
+            theme: 'bootstrap4',
+            placeholder: '请输入要添加的销售姓名',
+            multiple: true,
+            minimumInputLength: 1,
+            ajax: {
+                delay: 500,
+                url: '/admins/users',
+                dataType: 'json',
+                data: function(params){
+                    return { name: params.term };
+                },
+                processResults: function(data){
+                    return { results: data.users }
+                }
+            },
+            templateResult: function (item) {
+                if(!item.id || item.id === '') return item.text;
+                return $("<span>" + item.real_name + " <span class='font-12'>" + item.school_name + ' ' + item.hidden_phone + "</span></span>");
+            },
+            templateSelection: function(item){
+                if (item.id) {
+                }
+                return item.real_name || item.text;
+            }
+        });
+
+        $addMemberModal.on('click', '.submit-btn', function(){
+            $addMemberForm.find('.error').html('');
+
+            // var salesmanId = $salesmanIdInput.val();
+            var memberIds = $memberSelect.val();
+            if (memberIds && memberIds.length > 0) {
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: '/admins/salesman_customers/batch_add',
+                    data: { salesman_id: $salesmanIdInput.data("salesman-id"), user_ids: memberIds },
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $addMemberModal.modal('hide');
+
+                        setTimeout(function(){
+                            listForm();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            } else {
+                $addMemberModal.modal('hide');
+            }
+        });
+
+
+        var listForm = function(){
+            $.ajax({
+                url: '/admins/salesman_customers?salesman_id='+ $salesmanIdInput.data("salesman-id"),
+                dataType: "script"
+            });
+        };
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-salesmans-index-page').length > 0) {
+
+        // ============= 添加销售人员 ==============
+        var $addMemberModal = $('.admin-add-salesman-user-modal');
+        var $addMemberForm = $addMemberModal.find('.admin-add-salesman-user-form');
+        var $memberSelect = $addMemberModal.find('.salesman-user-select');
+        // var $salesmanIdInput = $addMemberForm.find('input[name="salesman_id"]')
+
+        $addMemberModal.on('show.bs.modal', function(event){
+            var $link = $(event.relatedTarget);
+            // var salesmanId = $link.data('salesman-id');
+            // $salesmanIdInput.val(salesmanId);
+
+            $memberSelect.select2('val', ' ');
+        });
+
+        $memberSelect.select2({
+            theme: 'bootstrap4',
+            placeholder: '请输入要添加的销售姓名',
+            multiple: true,
+            minimumInputLength: 1,
+            ajax: {
+                delay: 500,
+                url: '/admins/users',
+                dataType: 'json',
+                data: function(params){
+                    return { name: params.term };
+                },
+                processResults: function(data){
+                    return { results: data.users }
+                }
+            },
+            templateResult: function (item) {
+                if(!item.id || item.id === '') return item.text;
+                return $("<span>" + item.real_name + " <span class='font-12'>" + item.school_name + ' ' + item.hidden_phone + "</span></span>");
+            },
+            templateSelection: function(item){
+                if (item.id) {
+                }
+                return item.real_name || item.text;
+            }
+        });
+
+        $addMemberModal.on('click', '.submit-btn', function(){
+            $addMemberForm.find('.error').html('');
+
+            // var salesmanId = $salesmanIdInput.val();
+            var memberIds = $memberSelect.val();
+            if (memberIds && memberIds.length > 0) {
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: '/admins/salesmans/batch_add',
+                    data: { user_ids: memberIds },
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $addMemberModal.modal('hide');
+
+                        setTimeout(function(){
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            } else {
+                $addMemberModal.modal('hide');
+            }
+        });
+
+        $(".salesman-list-container").on("change", '.salesman-sync-course', function () {
+            var s_id = $(this).attr("data-id");
+            var json = {};
+            $.ajax({
+                url: "/admins/salesmans/" + s_id + "/update_sync_course",
+                type: "POST",
+                dataType:'script',
+                data: json
+            })
+        });
+
+        $(".salesman-list-container").on("change", '.salesman-sync-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/salesmans/" + s_id,
+                type: "PUT",
+                dataType:'script',
+                data: json
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function(){
+  if ($('body.admins-school-statistics-index-page').length > 0) {
+    var searchForm = $(".school-statistic-list-form .search-form");
+    var growFormUrl = searchForm.data('grow-form-url');
+    var contrastFormUrl = searchForm.data('contrast-form-url');
+
+    var dataTypeInput = searchForm.find("input[name='data_type']");
+    var keywordInput = searchForm.find("input[name='keyword']");
+    var contrastBtn = searchForm.find(".contrast-btn");
+    var growBtn = searchForm.find(".grow-btn");
+    var contrastDateContainer = searchForm.find('.contrast-date-container');
+    var growDateContainer = searchForm.find('.grow-date-container');
+
+    // 数据对比日期输入框
+    var beginDateInput = searchForm.find("input[name='begin_date']");
+    var endDateInput = searchForm.find("input[name='end_date']");
+    var otherBeginDateInput = searchForm.find("input[name='other_begin_date']");
+    var otherEndDateInput = searchForm.find("input[name='other_end_date']");
+
+    // 新增数据日期输入框
+    var growBeginDateInput = searchForm.find("input[name='grow_begin_date']");
+    var growEndDateInput = searchForm.find("input[name='grow_end_date']");
+
+    // 数据展示切换: 数据对比、新增数据
+    searchForm.on('click', ".contrast-btn", function(){
+      if(contrastBtn.hasClass("active")) { return }
+      changeDataType("contrast");
+      submitForm();
+    });
+    searchForm.on('click', ".grow-btn", function(){
+      if(growBtn.hasClass("active")) { return }
+      changeDataType("grow");
+      submitForm();
+    });
+
+    // 搜索按钮
+    searchForm.on('click', ".search-btn", function(){
+      console.log('submit');
+      submitForm();
+    });
+
+    $('.school-statistic-list-container').on('change', '.contrast-column-select', function() {
+      searchForm.find("input[name='contrast_column']").val($('.contrast-column-select').val());
+      submitForm();
+    });
+
+    var submitForm = function(){
+      if(!validateFrom()) { return }
+
+      var form = searchForm;
+      var url = dataTypeInput.val() == "contrast" ? contrastFormUrl : growFormUrl;
+
+      $.ajax({
+        url: url,
+        data: form.serialize(),
+        dataType: "script"
+      })
+    };
+
+    var validateFrom = function(){
+      if (dataTypeInput.val() != "contrast") { return true; }
+
+      // 全部为空时，需要展示空数据页
+      if (beginDateInput.val() == "" && endDateInput.val() == "" &&
+        otherBeginDateInput.val() == "" && otherBeginDateInput.val() == "") {
+        return true;
+      }
+
+      if (beginDateInput.val() != "" && endDateInput.val() != "" &&
+        otherBeginDateInput.val() != "" && otherBeginDateInput.val() != "") {
+        return true;
+      }
+
+      return false;
+    };
+
+    var changeDataType = function(dataType){
+      if (dataTypeInput.val() == dataType) { return }
+
+      if (dataType == "contrast") {
+        contrastBtn.addClass("active");
+        growBtn.removeClass("active");
+        dataTypeInput.val('contrast');
+        growDateContainer.hide();
+        contrastDateContainer.show();
+
+        clearGrowDateInput();
+      } else {
+        contrastBtn.removeClass("active");
+        growBtn.addClass("active");
+        dataTypeInput.val('grow');
+        growDateContainer.show();
+        contrastDateContainer.hide();
+
+        clearContrastDateInput();
+      }
+    };
+
+    var clearGrowDateInput = function() {
+      searchForm.find("input[name='grow_begin_date']").val('');
+      searchForm.find("input[name='grow_end_date']").val('');
+      searchForm.find("input[name='grow_date_input']").val('');
+    };
+
+    var clearContrastDateInput = function(){
+      searchForm.find("input[name='begin_date']").val('');
+      searchForm.find("input[name='end_date']").val('');
+      searchForm.find("input[name='other_begin_date']").val('');
+      searchForm.find("input[name='other_end_date']").val('');
+      searchForm.find("input[name='date_input']").val('');
+      searchForm.find("input[name='other_date_input']").val('');
+    };
+
+    var baseOptions = {
+      autoclose: true,
+      language: 'zh-CN',
+      format: 'yyyy-mm-dd',
+      startDate: '2017-04-01',
+      endDate: '-1d'
+    }
+
+    var defineDateRangeSelect = function(element){
+      var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, baseOptions);
+      $(element).datepicker(options);
+
+      $(element).find('.start-date').datepicker().on('changeDate', function(e){
+        $(element).find('.end-date').datepicker('setStartDate', e.date);
+      })
+    };
+
+    defineDateRangeSelect('.grow-date-input-daterange');
+    defineDateRangeSelect('.date-input-daterange');
+    defineDateRangeSelect('.other-date-input-daterange');
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-schools-index-page').length > 0) {
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $tabs = $('.search-form-container .search-form-tabs');
+  if ($tabs.length > 0) {
+    $tabs.on('click', '.search-form-tab', function(){
+      var $activeTab = $(this);
+      $tabs.find('.search-form-tab').removeClass('active');
+      $activeTab.addClass('active');
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-shixun-authorizations-index-page').length > 0) {
+    var $searchFrom = $('.shixun-authorization-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function(){
+    if ($('body.admins-shixun-feedback-messages-index-page').length > 0) {
+
+        $(".content-img img").addClass("w-20").addClass("preview-image");
+
+        var baseOptions = {
+            autoclose: true,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd 00:00:00',
+            startDate: '2017-04-01'
+        };
+
+        var defineDateRangeSelect = function(element){
+            var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, baseOptions);
+            $(element).datepicker(options);
+
+            $(element).find('.start-date').datepicker().on('changeDate', function(e){
+                $(element).find('.end-date').datepicker('setStartDate', e.date);
+            });
+        };
+
+        defineDateRangeSelect('.grow-date-input-daterange');
+    }
+});
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-shixun-modify-records-index-page').length > 0) {
+        var $form = $('.search-form');
+
+        // 清空
+        $form.on('click', '.clear-btn', function () {
+            $form.find('select[name="date"]').val('weekly');
+            $form.find('input[name="user_name"]').val('');
+            $form.find('input[type="submit"]').trigger('click');
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-shixun-settings-index-page').length > 0) {
+    let searchContainer = $(".shixun-settings-list-form");
+    let searchForm = $("form.search-form",searchContainer);
+
+    searchContainer.on('change', '.shixun-settings-select', function(){
+      searchForm.find('input[type="submit"]').trigger('click');
+    });
+
+    //导出
+    searchContainer.on('click',"#shixun-settings-export",function () {
+      window.location.href = "/admins/shixun_settings.xls?" + searchForm.serialize();
+    });
+
+    // 基础数据导出
+      searchContainer.on('click', "#shixun-settings-base-export", function () {
+          window.location.href = "/admins/shixun_settings.xls?base_data=1" + searchForm.serialize();
+      });
+
+   $(".shixun-settings-list-container").on("change", '.shixun-setting-form', function () {
+     var s_id = $(this).attr("data-id");
+     var s_value = $(this).val();
+     var s_name = $(this).attr("name");
+     var json = {};
+     var s_index = $(this).parent("td").siblings(".shixun-line-no").text();
+     json[s_name] = s_value;
+     json["page_no"] = s_index;
+     $.ajax({
+       url: "/admins/shixun_settings/" + s_id,
+       type: "PUT",
+       dataType:'script',
+       data: json
+     });
+   });
+
+      $(".shixun-settings-list-container").on("change", '.repertoire-setting-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/shixun_settings/" + s_id + "/update_tag_repertoires",
+              type: "POST",
+              dataType:'script',
+              data: json
+          });
+      });
+
+   $("select#settings-tag-choosed").select2({
+     placeholder: "请选择分类",
+     allowClear: true
+   });
+
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      if(data.suffix == '_weapp'){
+        var $imageElement = $('.shixun-weapp-image-' + data.source_id);
+        $imageElement.attr('src', data.url);
+        $imageElement.show();
+        $imageElement.next().html('重新上传');
+      } else {
+        var $imageElement = $('.shixun-image-' + data.source_id);
+        $imageElement.attr('src', data.url);
+        $imageElement.show();
+        $imageElement.next().html('重新上传');
+      }
+    })
+  }
+});
+
+$(document).on('turbolinks:load', function() {
+  if($('body.admins-shixuns-index-page').length > 0){
+    $('select#tag-choosed').select2({
+      placeholder: "请选择分类",
+      allowClear: true
+    });
+
+    var search_form = $(".search-form");
+    //导出
+    $(".shixuns-list-form").on("click","#shixuns-export",function () {
+      window.location.href = "/admins/shixuns.xls?" + search_form.serialize();
+    });
+  }
+});
+$(document).on('turbolinks:load', function(){
+  $('#sidebarCollapse').on('click', function () {
+    $(this).toggleClass('active');
+    $('#sidebar').toggleClass('active');
+    $.cookie('admin_sidebar_collapse', $(this).hasClass('active'), {path: '/admins'});
+  });
+
+  var sidebarController = $('#sidebar').data('current-controller');
+  if (sidebarController.length > 0) {
+    $('#sidebar a.active').removeClass('active');
+    $('#sidebar ul.collapse.show').removeClass('show');
+    var activeLi = $('#sidebar a[data-controller="' + sidebarController + '"]');
+    activeLi.addClass('active');
+    activeLi.parent().parent('ul.collapse').addClass('show');
+  }
+});
+$(document).on('turbolinks:load', function () {
+    if ($('body.admins-sub-disciplines-index-page').length > 0) {
+
+        // ============== 新建 ===============
+        var $modal = $('.modal.admin-create-sub-discipline-modal');
+        var $form = $modal.find('form.admin-create-sub-discipline-form');
+        var $nameInput = $form.find('input[name="name"]');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: {
+                    required: true
+                }
+            }
+        });
+
+        // modal ready fire
+        $modal.on('show.bs.modal', function () {
+            $nameInput.val('');
+        });
+
+        $modal.on('click', '.submit-btn', submit_create_form);
+
+        $nameInput.keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_create_form();
+                return false;
+            }
+        });
+
+        function submit_create_form() {
+            $form.find('.error').html('');
+
+            if ($form.valid()) {
+                var url = $form.data('url');
+
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function () {
+                        $.notify({message: '创建成功'});
+                        $modal.modal('hide');
+
+                        setTimeout(function () {
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function (res) {
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            }
+        }
+
+        $(".sub-discipline-list-container").on("change", '.sub-discipline-source-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/sub_disciplines/" + s_id,
+                type: "PUT",
+                dataType: 'script',
+                data: json
+            });
+        });
+        // ------------ 上移/下移 -------------
+        $('.sub-discipline-list-container').on('click', ".move-action", function () {
+            var $doAction = $(this);
+
+            var objectId = $doAction.data('id');
+            var opr = $doAction.data('opr');
+            $.ajax({
+                url: '/admins/sub_disciplines/' + objectId + '/adjust_position',
+                method: 'POST',
+                dataType: 'script',
+                data: {opr: opr}
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-sub-repertoires-index-page').length > 0) {
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-sub-repertoire-modal');
+    var $form = $modal.find('form.admin-create-sub-repertoire-form');
+    var $nameInput = $form.find('input[name="name"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        name: {
+          required: true
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $nameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+      $(".sub-repertoire-list-container").on("change", '.sub-repertoire-source-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/sub_repertoires/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-subject-authorizations-index-page').length > 0) {
+    var $searchFrom = $('.subject-authorization-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-subject-settings-index-page').length > 0) {
+		var $form = $('.subject-setting-list-form');
+
+		// ************** 学校选择 *************
+		$form.find('.school-select').select2({
+			theme: 'bootstrap4',
+			placeholder: '请选择创建者单位',
+			minimumInputLength: 1,
+			ajax: {
+				delay: 500,
+				url: '/api/schools/search.json',
+				dataType: 'json',
+				data: function (params) {
+					return {keyword: params.term};
+				},
+				processResults: function (data) {
+					return {results: data.schools}
+				}
+			},
+			templateResult: function (item) {
+				if (!item.id || item.id === '') return item.text;
+				return item.name;
+			},
+			templateSelection: function (item) {
+				if (item.id) {
+				}
+				return item.name || item.text;
+			}
+		});
+
+
+        $(".subject-setting-list-container").on("change", '.subject-setting-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/subject_settings/" + s_id,
+                type: "PUT",
+                dataType:'script',
+                data: json
+            })
+        });
+
+		// 清空
+		$form.on('click', '.clear-btn', function () {
+			$form.find('select[name="status"]').val('');
+			$form.find('.school-select').val('').trigger('change');
+			$form.find('input[name="keyword"]').val('');
+			$form.find('#homepage_show').attr('checked', false);
+			$form.find('#excellent').attr('checked', false);
+			$form.find('input[type="submit"]').trigger('click');
+		});
+
+		// 上传图片
+		$('.modal.admin-upload-file-modal').on('upload:success', function (e, data) {
+            if(data.suffix == '_qrcode'){
+                var $imageElement = $('.subject-weapp-image-' + data.source_id);
+                $imageElement.attr('src', data.url);
+                $imageElement.show();
+                $imageElement.next().html('重新上传');
+            } else {
+                var $imageElement = $('.subject-image-' + data.source_id);
+                $imageElement.attr('src', data.url);
+                $imageElement.show();
+                $imageElement.next().html('重新上传');
+            }
+		});
+	}
+});
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-subjects-index-page').length > 0) {
+		var $form = $('.subject-list-form');
+
+		// ************** 学校选择 *************
+		$form.find('.school-select').select2({
+			theme: 'bootstrap4',
+			placeholder: '请选择创建者单位',
+			minimumInputLength: 1,
+			ajax: {
+				delay: 500,
+				url: '/api/schools/search.json',
+				dataType: 'json',
+				data: function (params) {
+					return {keyword: params.term};
+				},
+				processResults: function (data) {
+					return {results: data.schools}
+				}
+			},
+			templateResult: function (item) {
+				if (!item.id || item.id === '') return item.text;
+				return item.name;
+			},
+			templateSelection: function (item) {
+				if (item.id) {
+				}
+				return item.name || item.text;
+			}
+		});
+
+		// 清空
+		$form.on('click', '.clear-btn', function () {
+			$form.find('select[name="status"]').val('');
+			$form.find('.school-select').val('').trigger('change');
+			$form.find('input[name="keyword"]').val('');
+			$form.find('#homepage_show').attr('checked', false);
+			$form.find('#excellent').attr('checked', false);
+			$form.find('input[type="submit"]').trigger('click');
+		});
+
+		// 定义状态切换监听事件
+		var defineStatusChangeFunc = function (doElement, undoElement, url, callback) {
+			$('.subject-list-container').on('click', doElement, function () {
+				var $doAction = $(this);
+				var $undoAction = $doAction.siblings(undoElement);
+
+				var subjectId = $doAction.data('id');
+				customConfirm({
+					content: '确认进行该操作吗？',
+					ok: function () {
+						$.ajax({
+							url: '/admins/subjects/' + subjectId + url,
+							method: 'POST',
+							dataType: 'json',
+							success: function () {
+								show_success_flash();
+								$doAction.hide();
+								$undoAction.show();
+								if (callback && typeof callback === "function") {
+									callback(subjectId, url);
+								}
+							}
+						});
+					}
+				});
+			});
+		}
+		// 隐藏与取消隐藏
+		defineStatusChangeFunc('.hide-action', '.active-action', '/hide');
+		defineStatusChangeFunc('.active-action', '.hide-action', '/cancel_hide');
+
+		// 首页展示与取消首页展示
+		var homepageShowCallback = function (subjectId, url) {
+			var $subjectItem = $('.subject-list-container').find('.subject-item-' + subjectId);
+
+			if (url === '/homepage_show') {
+				$subjectItem.find('.homepage-show-badge').show();
+			} else {
+				$subjectItem.find('.homepage-show-badge').hide();
+			}
+		}
+		defineStatusChangeFunc('.homepage-show-action', '.homepage-hide-action', '/homepage_show', homepageShowCallback);
+		defineStatusChangeFunc('.homepage-hide-action', '.homepage-show-action', '/cancel_homepage_show', homepageShowCallback);
+
+		// 设为金课与取消金课
+		var excellentCallback = function (subjectId, url) {
+			var $subjectItem = $('.subject-list-container').find('.subject-item-' + subjectId);
+
+			if (url === '/excellent') {
+				$subjectItem.find('.excellent-badge').show();
+			} else {
+				$subjectItem.find('.excellent-badge').hide();
+			}
+		}
+		defineStatusChangeFunc('.excellent-action', '.cancel-excellent-action', '/excellent', excellentCallback);
+		defineStatusChangeFunc('.cancel-excellent-action', '.excellent-action', '/cancel_excellent', excellentCallback);
+	}
+});
+$(document).on('turbolinks:load', function () {
+    if ($('body.admins-tag-disciplines-index-page').length > 0) {
+
+        // ============== 新建 ===============
+        var $modal = $('.modal.admin-create-tag-discipline-modal');
+        var $form = $modal.find('form.admin-create-tag-discipline-form');
+        var $nameInput = $form.find('input[name="name"]');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: {
+                    required: true
+                }
+            }
+        });
+
+        // modal ready fire
+        $modal.on('show.bs.modal', function () {
+            $nameInput.val('');
+        });
+
+        $modal.on('click', '.submit-btn', submit_create_form);
+
+        $nameInput.keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_create_form();
+                return false;
+            }
+        });
+
+        function submit_create_form() {
+            $form.find('.error').html('');
+
+            if ($form.valid()) {
+                var url = $form.data('url');
+
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function () {
+                        $.notify({message: '创建成功'});
+                        $modal.modal('hide');
+
+                        setTimeout(function () {
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function (res) {
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            }
+        }
+
+        $(".tag-discipline-list-container").on("change", '.tag-discipline-source-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/tag_disciplines/" + s_id,
+                type: "PUT",
+                dataType: 'script',
+                data: json
+            });
+        });
+
+        // ------------ 上移/下移 -------------
+        $('.tag-discipline-list-container').on('click', ".move-action", function () {
+            var $doAction = $(this);
+
+            var objectId = $doAction.data('id');
+            var opr = $doAction.data('opr');
+            $.ajax({
+                url: '/admins/tag_disciplines/' + objectId + '/adjust_position',
+                method: 'POST',
+                dataType: 'script',
+                data: {opr: opr}
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-tag-repertoires-index-page').length > 0) {
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-tag-repertoire-modal');
+    var $form = $modal.find('form.admin-create-tag-repertoire-form');
+    var $nameInput = $form.find('input[name="name"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        name: {
+          required: true
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $nameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+      $(".tag-repertoire-list-container").on("change", '.tag-repertoire-source-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/tag_repertoires/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-user-statistics-index-page').length > 0) {
+    var $form = $('.user-statistic-list-form');
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    }
+
+    var defineSchoolSelect = function (schools) {
+      $form.find('.school-select').select2({
+        theme: 'bootstrap4',
+        placeholder: '选择学校/单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $form.find('#school_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+
+    // 初始化学校选择器
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    // 清空
+    $form.on('click', '.clear-btn', function(){
+      $form.find('select[name="date"]').val('');
+      $form.find('.school-select').val('').trigger('change');
+      $form.find('input[type="submit"]').trigger('click');
+    })
+
+
+    // 导出
+    $('.export-action').on('click', function(){
+      var form = $(".user-statistic-list-form .search-form")
+      var exportLink = $(this);
+      var date = form.find("select[name='date']").val();
+      var schoolId = form.find('input[name="school_id"]').val();
+
+      var url = exportLink.data("url").split('?')[0] + "?date=" + date + "&school_id=" + schoolId;
+      window.open(url);
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-users-edit-page, body.admins-users-update-page').length > 0) {
+    var initDepartmentSelect = true;
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    }
+
+    var defineSchoolSelect = function (schools) {
+      $('.school-select').select2({
+        theme: 'bootstrap4',
+        placeholder: '查询学校/单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#user_school_id').val(item.id);
+            getDepartmentsData(item.id, defineDepartmentSelect2);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+    var defineDepartmentSelect2 = function(departments){
+      departments.unshift({ id: '-1', name: '未选择' }); // 可不选
+
+      if (!initDepartmentSelect) { $('.department-select').empty(); } // 为了能够回填部门
+      initDepartmentSelect = false;
+
+      $('.department-select').select2({
+        theme: 'bootstrap4',
+        placeholder: '查询学院/部门',
+        minimumInputLength: 0,
+        data: departments,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#user_department_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+    var getDepartmentsData = function(school_id, callback){
+      $.ajax({
+        url: '/api/schools/' + school_id + '/departments/for_option.json',
+        dataType: 'json',
+        type: 'GET',
+        success: function(data) {
+          callback(data.departments);
+        }
+      })
+    }
+
+    // 初始化学校选择器
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    // **************** 地区选择 ****************
+    $('.province-city-select').cxSelect({
+      url: '/javascripts/educoder/province-data.json',
+      selects: ['province-select', 'city-select']
+    });
+
+    // *********** 职业选择 ************
+    var identityData = [
+      {
+        "v": "teacher",
+        "n": "教师",
+        "s": [{"n": "教授", "v": "教授"},{"n": "副教授", "v": "副教授"},{"n": "讲师", "v": "讲师"},{"n": "助教", "v": "助教"}]
+      },
+      {
+        "v": "student",
+        "n": "学生",
+        "s": []
+      },
+      {
+        "v": "professional",
+        "n": "专业人士",
+        "s": [{"n": "企业管理者", "v": "企业管理者"},{"n": "部门管理者", "v": "部门管理者"},{"n": "高级工程师", "v": "高级工程师"},{"n": "工程师", "v": "工程师"},{"n": "助理工程师", "v": "助理工程师"}]
+      }
+    ];
+    $('.user-identity-select').cxSelect({
+      data: identityData,
+      jsonValue: 'v',
+      selects: ['identity-select', 'technical-title-select']
+    });
+    $('.identity-select').on('change', function(){
+      if($(this).val() === 'student'){
+        $('.technical-title-select-wrapper').hide();
+        $('.form-group.user_student_id').show();
+      } else {
+        $('.technical-title-select-wrapper').show();
+        $('.form-group.user_student_id').hide();
+      }
+    })
+
+
+    var $form = $('form.edit_user')
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "user[password]": {
+          required: false,
+          minlength: 5
+        },
+        "user[password_confirmation]": {
+          required: false,
+          minlength: 5,
+          equalTo: "#user_password"
+        },
+      },
+      messages: {
+        "user[password_confirmation]": {
+          equalTo: "两次密码输入不一致"
+        }
+      }
+    })
+
+    $form.submit(function(e){
+      if(!$form.valid()){ e.preventDefault(); }
+    })
+  }
+});
+$(document).on('turbolinks:load', function(){
+  if ($('body.admins-users-index-page').length > 0) {
+
+    var showSuccessNotify = function() {
+      $.notify({
+        message: '操作成功'
+      },{
+        type: 'success'
+      });
+    }
+
+    // lock user
+    $('.users-list-container').on('click', '.lock-action', function(){
+      var $lockAction = $(this);
+      var $unlockAction = $lockAction.siblings('.unlock-action');
+
+      var userId = $lockAction.data('id');
+      customConfirm({
+        content: '确认加锁吗？',
+        ok: function(){
+          $.ajax({
+            url: '/admins/users/' + userId + '/lock',
+            method: 'POST',
+            dataType: 'json',
+            success: function() {
+              showSuccessNotify();
+              $lockAction.hide();
+              $unlockAction.show();
+            }
+          });
+        }
+      });
+    });
+
+    // unlock user
+    $('.users-list-container').on('click', '.unlock-action', function(){
+      var $unlockAction = $(this);
+      var $lockAction = $unlockAction.siblings('.lock-action');
+
+      var userId = $unlockAction.data('id');
+      customConfirm({
+        content: '确认解锁吗？',
+        ok: function () {
+          $.ajax({
+            url: '/admins/users/' + userId + '/unlock',
+            method: 'POST',
+            dataType: 'json',
+            success: function() {
+              showSuccessNotify();
+              $lockAction.show();
+              $unlockAction.hide();
+            }
+          });
+        }
+      })
+    });
+
+    // active user
+    $('.users-list-container').on('click', '.active-action', function(){
+      var $activeAction = $(this);
+      var $unlockAction = $activeAction.siblings('.unlock-action');
+      var $lockAction = $activeAction.siblings('.lock-action');
+
+      var userId = $activeAction.data('id');
+      customConfirm({
+        content: '确认激活吗？',
+        ok: function () {
+          $.ajax({
+            url: '/admins/users/' + userId + '/unlock',
+            method: 'POST',
+            dataType: 'json',
+            success: function() {
+              showSuccessNotify();
+              $activeAction.hide();
+              $lockAction.show();
+              $unlockAction.hide();
+            }
+          });
+        }
+      })
+    });
+
+    // reset user login times
+    $('.users-list-container').on('click', '.reset-login-times-action', function(){
+      var $action = $(this);
+
+      var userId = $action.data('id');
+      $.ajax({
+        url: '/admins/users/' + userId + '/reset_login_times',
+        method: 'POST',
+        dataType: 'json',
+        success: function() {
+          showSuccessNotify();
+        }
+      });
+    });
+
+    // ***************** reward grade modal *****************
+    var $rewardGradeModal = $('.admin-users-reward-grade-modal');
+    var $form = $rewardGradeModal.find('form.admin-users-reward-grade-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        grade: {
+          required: true,
+          digits: true
+        },
+      }
+    });
+
+    // modal ready fire
+    $rewardGradeModal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var userId = $link.data('id');
+      $rewardGradeModal.find('.modal-body input[name="user_id"]').val(userId);
+    });
+    // modal visited fire
+    $rewardGradeModal.on('shown.bs.modal', function(){
+      $rewardGradeModal.find('.modal-body input[name="grade"]').focus();
+    });
+
+    $('.admin-users-reward-grade-modal .submit-btn').on('click', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var userId = $form.find('input[name="user_id"]').val();
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: "/admins/users/" + userId + "/reward_grade",
+          data: $form.serialize(),
+          success: function(data) {
+            showSuccessNotify();
+            $('.users-list-container .user-item-' + userId + ' td.grade-content').html(data.grade);
+            $rewardGradeModal.modal('hide');
+          },
+          error: function(res) {
+            $rewardGradeModal.find('.error').html(res.responseJSON.message);
+          }
+        });
+      }
+    });
+
+
+    // 导入学生
+    var $importUserModal = $('.modal.admin-import-user-modal');
+    var $importUserForm = $importUserModal.find('form.admin-import-user-form')
+
+    $importUserModal.on('show.bs.modal', function(){
+      resetFileInputFunc($importUserModal.find('.upload-file-input'));
+      $importUserModal.find('.file-names').html('选择文件');
+      $importUserModal.find('.upload-file-input').trigger('click');
+    });
+    $importUserModal.on('change', '.upload-file-input', function(e){
+      var file = $(this)[0].files[0];
+      $importUserModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    var importUserFormValid = function(){
+      if($importUserForm.find('input[name="file"]').val() == undefined || $importUserForm.find('input[name="file"]').val().length == 0){
+        $importUserForm.find('.error').html('请选择文件');
+        return false;
+      }
+
+      return true;
+    };
+
+    var buildResultMessage = function(data){
+      var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+      if(data.fail.length > 0){
+        messageHtml += '<table class="table"><thead class="thead-light"><tr><th>数据</th><th>失败原因</th></tr></thead><tbody>';
+
+        data.fail.forEach(function(item){
+          messageHtml += '<tr><td>' + item.data + '</td><td>' + item.message + '</td></tr>';
+        });
+
+        messageHtml += '</tbody></table>'
+      }
+
+      return messageHtml;
+    }
+
+    $importUserModal.on('click', '.submit-btn', function(){
+      $importUserForm.find('.error').html('');
+
+      if (importUserFormValid()) {
+        $('body').mLoading({ text: '正在导入...' });
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/import_users',
+          data: new FormData($importUserForm[0]),
+          processData: false,
+          contentType: false,
+          success: function(data){
+            $('body').mLoading('destroy');
+            $importUserModal.modal('hide');
+
+            showMessageModal(buildResultMessage(data), function(){
+              window.location.reload();
+            });
+          },
+          error: function(res){
+            $('body').mLoading('destroy');
+            var data = res.responseJSON;
+            $importUserForm.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-video-applies-index-page').length > 0) {
+    var $searchFrom = $('.video-applies-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('all');
+
+      if($link.data('value') === 'all'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-weapp-adverts-index-page').length > 0) {
+    var resetNo = function(){
+      $('#adverts-container .advert-item-no').each(function(index, ele){
+        $(ele).html(index + 1);
+      })
+    }
+
+    // ------------ 保存链接 -----------
+    $('.adverts-card').on('click', '.save-data-btn', function(){
+      var $link = $(this);
+      var id = $link.data('id');
+      var link = $('.advert-item-' + id).find('.link-input').val();
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_adverts/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { link: link },
+        success: function(data){
+          $.notify({ message: '操作成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+    // -------------- 是否在首页展示 --------------
+    $('.adverts-card').on('change', '.online-check-box', function(){
+      var $checkbox = $(this);
+      var id = $checkbox.data('id');
+      var checked = $checkbox.is(':checked');
+      $checkbox.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_adverts/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { online: checked },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          var box = $('.advert-item-' + id).find('.drag');
+          if(checked){
+            box.removeClass('not_active');
+          }else{
+            box.addClass('not_active');
+          }
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $checkbox.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/weapp_adverts/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+          resetNo();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('adverts-container');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-weapp-advert-modal');
+    var $createForm = $createModal.find('form.admin-add-weapp-advert-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "weapp_settings_advert[image]": {
+          required: true
+        }
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $advertItem = $('.advert-item-' + data.source_id);
+      $advertItem.find('.advert-item-img img').attr('src', data.url);
+    })
+
+    // 删除后
+    $(document).on('delete_success', resetNo)
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-weapp-carousels-index-page').length > 0) {
+    var resetNo = function(){
+      $('#carousels-container .custom-carousel-item-no').each(function(index, ele){
+        $(ele).html(index + 1);
+      })
+    }
+    // ------------ 保存链接 -----------
+    $('.carousels-card').on('click', '.save-data-btn', function(){
+      var $link = $(this);
+      var id = $link.data('id');
+      var link = $('.custom-carousel-item-' + id).find('.link-input').val();
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { link: link },
+        success: function(data){
+          $.notify({ message: '操作成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+    // -------------- 是否在首页展示 --------------
+    $('.carousels-card').on('change', '.online-check-box', function(){
+      var $checkbox = $(this);
+      var id = $checkbox.data('id');
+      var checked = $checkbox.is(':checked');
+      $checkbox.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { online: checked },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          var box = $('.custom-carousel-item-' + id).find('.drag');
+          if(checked){
+            box.removeClass('not_active');
+          }else{
+            box.addClass('not_active');
+          }
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $checkbox.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/weapp_carousels/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+          resetNo();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('carousels-container');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-weapp-carousel-modal');
+    var $createForm = $createModal.find('form.admin-add-weapp-carousel-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "weapp_settings_carousel[image]": {
+          required: true
+        }
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $carouselItem = $('.custom-carousel-item-' + data.source_id);
+      $carouselItem.find('.custom-carousel-item-img img').attr('src', data.url);
+    })
+
+    // 删除后
+    $(document).on('delete_success', resetNo)
+  }
+})
+;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+$.ajaxSetup({
+  beforeSend: function(xhr) {
+    xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
+  }
+});
+
+// ******** select2 global config ********
+$.fn.select2.defaults.set('theme', 'bootstrap4');
+$.fn.select2.defaults.set('language', 'zh-CN');
+
+Turbolinks.setProgressBarDelay(200);
+
+$.notifyDefaults({
+  type: 'success',
+  z_index: 9999,
+  delay: 2000
+});
+
+function show_success_flash(){
+  $.notify({
+    message: '操作成功'
+  },{
+    type: 'success'
+  });
+}
+
+$(document).on('turbolinks:load', function(){
+  $('[data-toggle="tooltip"]').tooltip({ trigger : 'hover' });
+  $('[data-toggle="popover"]').popover();
+
+  // 图片查看大图
+  $('img.preview-image').bootstrapViewer();
+
+  // flash alert提示框自动关闭
+  if($('.admin-alert-container .alert').length > 0){
+    setTimeout(function(){
+      $('.admin-alert-container .alert:not(.alert-danger)').alert('close');
+    }, 2000);
+    setTimeout(function(){
+      $('.admin-alert-container .alert.alert-danger').alert('close');
+    }, 5000);
+  }
+});
+
+$(document).on("turbolinks:before-cache", function () {
+  $('[data-toggle="tooltip"]').tooltip('hide');
+  $('[data-toggle="popover"]').popover('hide');
+});
+// var progressBar = new Turbolinks.ProgressBar();
+
+// $(document).on('ajax:send', function(event){
+//   console.log('ajax send', event);
+//   progressBar.setValue(0)
+//   progressBar.show()
+// });
+//
+// $(document).on('ajax:complete', function(event){
+//   console.log('ajax complete', event);
+//   progressBar.setValue(1)
+//   progressBar.hide() // 分页时不触发，奇怪
+// });
+// $(document).on('ajax:success', function(event){
+//   console.log('ajax success', event);
+// });
+// $(document).on('ajax:error', function(event){
+//   console.log('ajax error', event);
+// });
+
+$(function () {
+});
diff --git a/public/assets/admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js.gz b/public/assets/admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js.gz
new file mode 100644
index 000000000..85d1f310c
Binary files /dev/null and b/public/assets/admin-8cb0e9724b33e253621a5f1020bdc270f828cb7d602de8434d3cc606e0b4dbc2.js.gz differ
diff --git a/public/assets/admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js b/public/assets/admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js
new file mode 100644
index 000000000..fc08255ff
--- /dev/null
+++ b/public/assets/admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js
@@ -0,0 +1,142301 @@
+/*
+Unobtrusive JavaScript
+https://github.com/rails/rails/blob/master/actionview/app/assets/javascripts
+Released under the MIT license
+ */
+
+
+(function() {
+  var context = this;
+
+  (function() {
+    (function() {
+      this.Rails = {
+        linkClickSelector: 'a[data-confirm], a[data-method], a[data-remote]:not([disabled]), a[data-disable-with], a[data-disable]',
+        buttonClickSelector: {
+          selector: 'button[data-remote]:not([form]), button[data-confirm]:not([form])',
+          exclude: 'form button'
+        },
+        inputChangeSelector: 'select[data-remote], input[data-remote], textarea[data-remote]',
+        formSubmitSelector: 'form',
+        formInputClickSelector: 'form input[type=submit], form input[type=image], form button[type=submit], form button:not([type]), input[type=submit][form], input[type=image][form], button[type=submit][form], button[form]:not([type])',
+        formDisableSelector: 'input[data-disable-with]:enabled, button[data-disable-with]:enabled, textarea[data-disable-with]:enabled, input[data-disable]:enabled, button[data-disable]:enabled, textarea[data-disable]:enabled',
+        formEnableSelector: 'input[data-disable-with]:disabled, button[data-disable-with]:disabled, textarea[data-disable-with]:disabled, input[data-disable]:disabled, button[data-disable]:disabled, textarea[data-disable]:disabled',
+        fileInputSelector: 'input[name][type=file]:not([disabled])',
+        linkDisableSelector: 'a[data-disable-with], a[data-disable]',
+        buttonDisableSelector: 'button[data-remote][data-disable-with], button[data-remote][data-disable]'
+      };
+
+    }).call(this);
+  }).call(context);
+
+  var Rails = context.Rails;
+
+  (function() {
+    (function() {
+      var nonce;
+
+      nonce = null;
+
+      Rails.loadCSPNonce = function() {
+        var ref;
+        return nonce = (ref = document.querySelector("meta[name=csp-nonce]")) != null ? ref.content : void 0;
+      };
+
+      Rails.cspNonce = function() {
+        return nonce != null ? nonce : Rails.loadCSPNonce();
+      };
+
+    }).call(this);
+    (function() {
+      var expando, m;
+
+      m = Element.prototype.matches || Element.prototype.matchesSelector || Element.prototype.mozMatchesSelector || Element.prototype.msMatchesSelector || Element.prototype.oMatchesSelector || Element.prototype.webkitMatchesSelector;
+
+      Rails.matches = function(element, selector) {
+        if (selector.exclude != null) {
+          return m.call(element, selector.selector) && !m.call(element, selector.exclude);
+        } else {
+          return m.call(element, selector);
+        }
+      };
+
+      expando = '_ujsData';
+
+      Rails.getData = function(element, key) {
+        var ref;
+        return (ref = element[expando]) != null ? ref[key] : void 0;
+      };
+
+      Rails.setData = function(element, key, value) {
+        if (element[expando] == null) {
+          element[expando] = {};
+        }
+        return element[expando][key] = value;
+      };
+
+      Rails.$ = function(selector) {
+        return Array.prototype.slice.call(document.querySelectorAll(selector));
+      };
+
+    }).call(this);
+    (function() {
+      var $, csrfParam, csrfToken;
+
+      $ = Rails.$;
+
+      csrfToken = Rails.csrfToken = function() {
+        var meta;
+        meta = document.querySelector('meta[name=csrf-token]');
+        return meta && meta.content;
+      };
+
+      csrfParam = Rails.csrfParam = function() {
+        var meta;
+        meta = document.querySelector('meta[name=csrf-param]');
+        return meta && meta.content;
+      };
+
+      Rails.CSRFProtection = function(xhr) {
+        var token;
+        token = csrfToken();
+        if (token != null) {
+          return xhr.setRequestHeader('X-CSRF-Token', token);
+        }
+      };
+
+      Rails.refreshCSRFTokens = function() {
+        var param, token;
+        token = csrfToken();
+        param = csrfParam();
+        if ((token != null) && (param != null)) {
+          return $('form input[name="' + param + '"]').forEach(function(input) {
+            return input.value = token;
+          });
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var CustomEvent, fire, matches, preventDefault;
+
+      matches = Rails.matches;
+
+      CustomEvent = window.CustomEvent;
+
+      if (typeof CustomEvent !== 'function') {
+        CustomEvent = function(event, params) {
+          var evt;
+          evt = document.createEvent('CustomEvent');
+          evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail);
+          return evt;
+        };
+        CustomEvent.prototype = window.Event.prototype;
+        preventDefault = CustomEvent.prototype.preventDefault;
+        CustomEvent.prototype.preventDefault = function() {
+          var result;
+          result = preventDefault.call(this);
+          if (this.cancelable && !this.defaultPrevented) {
+            Object.defineProperty(this, 'defaultPrevented', {
+              get: function() {
+                return true;
+              }
+            });
+          }
+          return result;
+        };
+      }
+
+      fire = Rails.fire = function(obj, name, data) {
+        var event;
+        event = new CustomEvent(name, {
+          bubbles: true,
+          cancelable: true,
+          detail: data
+        });
+        obj.dispatchEvent(event);
+        return !event.defaultPrevented;
+      };
+
+      Rails.stopEverything = function(e) {
+        fire(e.target, 'ujs:everythingStopped');
+        e.preventDefault();
+        e.stopPropagation();
+        return e.stopImmediatePropagation();
+      };
+
+      Rails.delegate = function(element, selector, eventType, handler) {
+        return element.addEventListener(eventType, function(e) {
+          var target;
+          target = e.target;
+          while (!(!(target instanceof Element) || matches(target, selector))) {
+            target = target.parentNode;
+          }
+          if (target instanceof Element && handler.call(target, e) === false) {
+            e.preventDefault();
+            return e.stopPropagation();
+          }
+        });
+      };
+
+    }).call(this);
+    (function() {
+      var AcceptHeaders, CSRFProtection, createXHR, cspNonce, fire, prepareOptions, processResponse;
+
+      cspNonce = Rails.cspNonce, CSRFProtection = Rails.CSRFProtection, fire = Rails.fire;
+
+      AcceptHeaders = {
+        '*': '*/*',
+        text: 'text/plain',
+        html: 'text/html',
+        xml: 'application/xml, text/xml',
+        json: 'application/json, text/javascript',
+        script: 'text/javascript, application/javascript, application/ecmascript, application/x-ecmascript'
+      };
+
+      Rails.ajax = function(options) {
+        var xhr;
+        options = prepareOptions(options);
+        xhr = createXHR(options, function() {
+          var ref, response;
+          response = processResponse((ref = xhr.response) != null ? ref : xhr.responseText, xhr.getResponseHeader('Content-Type'));
+          if (Math.floor(xhr.status / 100) === 2) {
+            if (typeof options.success === "function") {
+              options.success(response, xhr.statusText, xhr);
+            }
+          } else {
+            if (typeof options.error === "function") {
+              options.error(response, xhr.statusText, xhr);
+            }
+          }
+          return typeof options.complete === "function" ? options.complete(xhr, xhr.statusText) : void 0;
+        });
+        if ((options.beforeSend != null) && !options.beforeSend(xhr, options)) {
+          return false;
+        }
+        if (xhr.readyState === XMLHttpRequest.OPENED) {
+          return xhr.send(options.data);
+        }
+      };
+
+      prepareOptions = function(options) {
+        options.url = options.url || location.href;
+        options.type = options.type.toUpperCase();
+        if (options.type === 'GET' && options.data) {
+          if (options.url.indexOf('?') < 0) {
+            options.url += '?' + options.data;
+          } else {
+            options.url += '&' + options.data;
+          }
+        }
+        if (AcceptHeaders[options.dataType] == null) {
+          options.dataType = '*';
+        }
+        options.accept = AcceptHeaders[options.dataType];
+        if (options.dataType !== '*') {
+          options.accept += ', */*; q=0.01';
+        }
+        return options;
+      };
+
+      createXHR = function(options, done) {
+        var xhr;
+        xhr = new XMLHttpRequest();
+        xhr.open(options.type, options.url, true);
+        xhr.setRequestHeader('Accept', options.accept);
+        if (typeof options.data === 'string') {
+          xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
+        }
+        if (!options.crossDomain) {
+          xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
+        }
+        CSRFProtection(xhr);
+        xhr.withCredentials = !!options.withCredentials;
+        xhr.onreadystatechange = function() {
+          if (xhr.readyState === XMLHttpRequest.DONE) {
+            return done(xhr);
+          }
+        };
+        return xhr;
+      };
+
+      processResponse = function(response, type) {
+        var parser, script;
+        if (typeof response === 'string' && typeof type === 'string') {
+          if (type.match(/\bjson\b/)) {
+            try {
+              response = JSON.parse(response);
+            } catch (error) {}
+          } else if (type.match(/\b(?:java|ecma)script\b/)) {
+            script = document.createElement('script');
+            script.setAttribute('nonce', cspNonce());
+            script.text = response;
+            document.head.appendChild(script).parentNode.removeChild(script);
+          } else if (type.match(/\b(xml|html|svg)\b/)) {
+            parser = new DOMParser();
+            type = type.replace(/;.+/, '');
+            try {
+              response = parser.parseFromString(response, type);
+            } catch (error) {}
+          }
+        }
+        return response;
+      };
+
+      Rails.href = function(element) {
+        return element.href;
+      };
+
+      Rails.isCrossDomain = function(url) {
+        var e, originAnchor, urlAnchor;
+        originAnchor = document.createElement('a');
+        originAnchor.href = location.href;
+        urlAnchor = document.createElement('a');
+        try {
+          urlAnchor.href = url;
+          return !(((!urlAnchor.protocol || urlAnchor.protocol === ':') && !urlAnchor.host) || (originAnchor.protocol + '//' + originAnchor.host === urlAnchor.protocol + '//' + urlAnchor.host));
+        } catch (error) {
+          e = error;
+          return true;
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var matches, toArray;
+
+      matches = Rails.matches;
+
+      toArray = function(e) {
+        return Array.prototype.slice.call(e);
+      };
+
+      Rails.serializeElement = function(element, additionalParam) {
+        var inputs, params;
+        inputs = [element];
+        if (matches(element, 'form')) {
+          inputs = toArray(element.elements);
+        }
+        params = [];
+        inputs.forEach(function(input) {
+          if (!input.name || input.disabled) {
+            return;
+          }
+          if (matches(input, 'select')) {
+            return toArray(input.options).forEach(function(option) {
+              if (option.selected) {
+                return params.push({
+                  name: input.name,
+                  value: option.value
+                });
+              }
+            });
+          } else if (input.checked || ['radio', 'checkbox', 'submit'].indexOf(input.type) === -1) {
+            return params.push({
+              name: input.name,
+              value: input.value
+            });
+          }
+        });
+        if (additionalParam) {
+          params.push(additionalParam);
+        }
+        return params.map(function(param) {
+          if (param.name != null) {
+            return (encodeURIComponent(param.name)) + "=" + (encodeURIComponent(param.value));
+          } else {
+            return param;
+          }
+        }).join('&');
+      };
+
+      Rails.formElements = function(form, selector) {
+        if (matches(form, 'form')) {
+          return toArray(form.elements).filter(function(el) {
+            return matches(el, selector);
+          });
+        } else {
+          return toArray(form.querySelectorAll(selector));
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var allowAction, fire, stopEverything;
+
+      fire = Rails.fire, stopEverything = Rails.stopEverything;
+
+      Rails.handleConfirm = function(e) {
+        if (!allowAction(this)) {
+          return stopEverything(e);
+        }
+      };
+
+      allowAction = function(element) {
+        var answer, callback, message;
+        message = element.getAttribute('data-confirm');
+        if (!message) {
+          return true;
+        }
+        answer = false;
+        if (fire(element, 'confirm')) {
+          try {
+            answer = confirm(message);
+          } catch (error) {}
+          callback = fire(element, 'confirm:complete', [answer]);
+        }
+        return answer && callback;
+      };
+
+    }).call(this);
+    (function() {
+      var disableFormElement, disableFormElements, disableLinkElement, enableFormElement, enableFormElements, enableLinkElement, formElements, getData, matches, setData, stopEverything;
+
+      matches = Rails.matches, getData = Rails.getData, setData = Rails.setData, stopEverything = Rails.stopEverything, formElements = Rails.formElements;
+
+      Rails.handleDisabledElement = function(e) {
+        var element;
+        element = this;
+        if (element.disabled) {
+          return stopEverything(e);
+        }
+      };
+
+      Rails.enableElement = function(e) {
+        var element;
+        element = e instanceof Event ? e.target : e;
+        if (matches(element, Rails.linkDisableSelector)) {
+          return enableLinkElement(element);
+        } else if (matches(element, Rails.buttonDisableSelector) || matches(element, Rails.formEnableSelector)) {
+          return enableFormElement(element);
+        } else if (matches(element, Rails.formSubmitSelector)) {
+          return enableFormElements(element);
+        }
+      };
+
+      Rails.disableElement = function(e) {
+        var element;
+        element = e instanceof Event ? e.target : e;
+        if (matches(element, Rails.linkDisableSelector)) {
+          return disableLinkElement(element);
+        } else if (matches(element, Rails.buttonDisableSelector) || matches(element, Rails.formDisableSelector)) {
+          return disableFormElement(element);
+        } else if (matches(element, Rails.formSubmitSelector)) {
+          return disableFormElements(element);
+        }
+      };
+
+      disableLinkElement = function(element) {
+        var replacement;
+        replacement = element.getAttribute('data-disable-with');
+        if (replacement != null) {
+          setData(element, 'ujs:enable-with', element.innerHTML);
+          element.innerHTML = replacement;
+        }
+        element.addEventListener('click', stopEverything);
+        return setData(element, 'ujs:disabled', true);
+      };
+
+      enableLinkElement = function(element) {
+        var originalText;
+        originalText = getData(element, 'ujs:enable-with');
+        if (originalText != null) {
+          element.innerHTML = originalText;
+          setData(element, 'ujs:enable-with', null);
+        }
+        element.removeEventListener('click', stopEverything);
+        return setData(element, 'ujs:disabled', null);
+      };
+
+      disableFormElements = function(form) {
+        return formElements(form, Rails.formDisableSelector).forEach(disableFormElement);
+      };
+
+      disableFormElement = function(element) {
+        var replacement;
+        replacement = element.getAttribute('data-disable-with');
+        if (replacement != null) {
+          if (matches(element, 'button')) {
+            setData(element, 'ujs:enable-with', element.innerHTML);
+            element.innerHTML = replacement;
+          } else {
+            setData(element, 'ujs:enable-with', element.value);
+            element.value = replacement;
+          }
+        }
+        element.disabled = true;
+        return setData(element, 'ujs:disabled', true);
+      };
+
+      enableFormElements = function(form) {
+        return formElements(form, Rails.formEnableSelector).forEach(enableFormElement);
+      };
+
+      enableFormElement = function(element) {
+        var originalText;
+        originalText = getData(element, 'ujs:enable-with');
+        if (originalText != null) {
+          if (matches(element, 'button')) {
+            element.innerHTML = originalText;
+          } else {
+            element.value = originalText;
+          }
+          setData(element, 'ujs:enable-with', null);
+        }
+        element.disabled = false;
+        return setData(element, 'ujs:disabled', null);
+      };
+
+    }).call(this);
+    (function() {
+      var stopEverything;
+
+      stopEverything = Rails.stopEverything;
+
+      Rails.handleMethod = function(e) {
+        var csrfParam, csrfToken, form, formContent, href, link, method;
+        link = this;
+        method = link.getAttribute('data-method');
+        if (!method) {
+          return;
+        }
+        href = Rails.href(link);
+        csrfToken = Rails.csrfToken();
+        csrfParam = Rails.csrfParam();
+        form = document.createElement('form');
+        formContent = "<input name='_method' value='" + method + "' type='hidden' />";
+        if ((csrfParam != null) && (csrfToken != null) && !Rails.isCrossDomain(href)) {
+          formContent += "<input name='" + csrfParam + "' value='" + csrfToken + "' type='hidden' />";
+        }
+        formContent += '<input type="submit" />';
+        form.method = 'post';
+        form.action = href;
+        form.target = link.target;
+        form.innerHTML = formContent;
+        form.style.display = 'none';
+        document.body.appendChild(form);
+        form.querySelector('[type="submit"]').click();
+        return stopEverything(e);
+      };
+
+    }).call(this);
+    (function() {
+      var ajax, fire, getData, isCrossDomain, isRemote, matches, serializeElement, setData, stopEverything,
+        slice = [].slice;
+
+      matches = Rails.matches, getData = Rails.getData, setData = Rails.setData, fire = Rails.fire, stopEverything = Rails.stopEverything, ajax = Rails.ajax, isCrossDomain = Rails.isCrossDomain, serializeElement = Rails.serializeElement;
+
+      isRemote = function(element) {
+        var value;
+        value = element.getAttribute('data-remote');
+        return (value != null) && value !== 'false';
+      };
+
+      Rails.handleRemote = function(e) {
+        var button, data, dataType, element, method, url, withCredentials;
+        element = this;
+        if (!isRemote(element)) {
+          return true;
+        }
+        if (!fire(element, 'ajax:before')) {
+          fire(element, 'ajax:stopped');
+          return false;
+        }
+        withCredentials = element.getAttribute('data-with-credentials');
+        dataType = element.getAttribute('data-type') || 'script';
+        if (matches(element, Rails.formSubmitSelector)) {
+          button = getData(element, 'ujs:submit-button');
+          method = getData(element, 'ujs:submit-button-formmethod') || element.method;
+          url = getData(element, 'ujs:submit-button-formaction') || element.getAttribute('action') || location.href;
+          if (method.toUpperCase() === 'GET') {
+            url = url.replace(/\?.*$/, '');
+          }
+          if (element.enctype === 'multipart/form-data') {
+            data = new FormData(element);
+            if (button != null) {
+              data.append(button.name, button.value);
+            }
+          } else {
+            data = serializeElement(element, button);
+          }
+          setData(element, 'ujs:submit-button', null);
+          setData(element, 'ujs:submit-button-formmethod', null);
+          setData(element, 'ujs:submit-button-formaction', null);
+        } else if (matches(element, Rails.buttonClickSelector) || matches(element, Rails.inputChangeSelector)) {
+          method = element.getAttribute('data-method');
+          url = element.getAttribute('data-url');
+          data = serializeElement(element, element.getAttribute('data-params'));
+        } else {
+          method = element.getAttribute('data-method');
+          url = Rails.href(element);
+          data = element.getAttribute('data-params');
+        }
+        ajax({
+          type: method || 'GET',
+          url: url,
+          data: data,
+          dataType: dataType,
+          beforeSend: function(xhr, options) {
+            if (fire(element, 'ajax:beforeSend', [xhr, options])) {
+              return fire(element, 'ajax:send', [xhr]);
+            } else {
+              fire(element, 'ajax:stopped');
+              return false;
+            }
+          },
+          success: function() {
+            var args;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return fire(element, 'ajax:success', args);
+          },
+          error: function() {
+            var args;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return fire(element, 'ajax:error', args);
+          },
+          complete: function() {
+            var args;
+            args = 1 <= arguments.length ? slice.call(arguments, 0) : [];
+            return fire(element, 'ajax:complete', args);
+          },
+          crossDomain: isCrossDomain(url),
+          withCredentials: (withCredentials != null) && withCredentials !== 'false'
+        });
+        return stopEverything(e);
+      };
+
+      Rails.formSubmitButtonClick = function(e) {
+        var button, form;
+        button = this;
+        form = button.form;
+        if (!form) {
+          return;
+        }
+        if (button.name) {
+          setData(form, 'ujs:submit-button', {
+            name: button.name,
+            value: button.value
+          });
+        }
+        setData(form, 'ujs:formnovalidate-button', button.formNoValidate);
+        setData(form, 'ujs:submit-button-formaction', button.getAttribute('formaction'));
+        return setData(form, 'ujs:submit-button-formmethod', button.getAttribute('formmethod'));
+      };
+
+      Rails.preventInsignificantClick = function(e) {
+        var data, insignificantMetaClick, link, metaClick, method, primaryMouseKey;
+        link = this;
+        method = (link.getAttribute('data-method') || 'GET').toUpperCase();
+        data = link.getAttribute('data-params');
+        metaClick = e.metaKey || e.ctrlKey;
+        insignificantMetaClick = metaClick && method === 'GET' && !data;
+        primaryMouseKey = e.button === 0;
+        if (!primaryMouseKey || insignificantMetaClick) {
+          return e.stopImmediatePropagation();
+        }
+      };
+
+    }).call(this);
+    (function() {
+      var $, CSRFProtection, delegate, disableElement, enableElement, fire, formSubmitButtonClick, getData, handleConfirm, handleDisabledElement, handleMethod, handleRemote, loadCSPNonce, preventInsignificantClick, refreshCSRFTokens;
+
+      fire = Rails.fire, delegate = Rails.delegate, getData = Rails.getData, $ = Rails.$, refreshCSRFTokens = Rails.refreshCSRFTokens, CSRFProtection = Rails.CSRFProtection, loadCSPNonce = Rails.loadCSPNonce, enableElement = Rails.enableElement, disableElement = Rails.disableElement, handleDisabledElement = Rails.handleDisabledElement, handleConfirm = Rails.handleConfirm, preventInsignificantClick = Rails.preventInsignificantClick, handleRemote = Rails.handleRemote, formSubmitButtonClick = Rails.formSubmitButtonClick, handleMethod = Rails.handleMethod;
+
+      if ((typeof jQuery !== "undefined" && jQuery !== null) && (jQuery.ajax != null)) {
+        if (jQuery.rails) {
+          throw new Error('If you load both jquery_ujs and rails-ujs, use rails-ujs only.');
+        }
+        jQuery.rails = Rails;
+        jQuery.ajaxPrefilter(function(options, originalOptions, xhr) {
+          if (!options.crossDomain) {
+            return CSRFProtection(xhr);
+          }
+        });
+      }
+
+      Rails.start = function() {
+        if (window._rails_loaded) {
+          throw new Error('rails-ujs has already been loaded!');
+        }
+        window.addEventListener('pageshow', function() {
+          $(Rails.formEnableSelector).forEach(function(el) {
+            if (getData(el, 'ujs:disabled')) {
+              return enableElement(el);
+            }
+          });
+          return $(Rails.linkDisableSelector).forEach(function(el) {
+            if (getData(el, 'ujs:disabled')) {
+              return enableElement(el);
+            }
+          });
+        });
+        delegate(document, Rails.linkDisableSelector, 'ajax:complete', enableElement);
+        delegate(document, Rails.linkDisableSelector, 'ajax:stopped', enableElement);
+        delegate(document, Rails.buttonDisableSelector, 'ajax:complete', enableElement);
+        delegate(document, Rails.buttonDisableSelector, 'ajax:stopped', enableElement);
+        delegate(document, Rails.linkClickSelector, 'click', preventInsignificantClick);
+        delegate(document, Rails.linkClickSelector, 'click', handleDisabledElement);
+        delegate(document, Rails.linkClickSelector, 'click', handleConfirm);
+        delegate(document, Rails.linkClickSelector, 'click', disableElement);
+        delegate(document, Rails.linkClickSelector, 'click', handleRemote);
+        delegate(document, Rails.linkClickSelector, 'click', handleMethod);
+        delegate(document, Rails.buttonClickSelector, 'click', preventInsignificantClick);
+        delegate(document, Rails.buttonClickSelector, 'click', handleDisabledElement);
+        delegate(document, Rails.buttonClickSelector, 'click', handleConfirm);
+        delegate(document, Rails.buttonClickSelector, 'click', disableElement);
+        delegate(document, Rails.buttonClickSelector, 'click', handleRemote);
+        delegate(document, Rails.inputChangeSelector, 'change', handleDisabledElement);
+        delegate(document, Rails.inputChangeSelector, 'change', handleConfirm);
+        delegate(document, Rails.inputChangeSelector, 'change', handleRemote);
+        delegate(document, Rails.formSubmitSelector, 'submit', handleDisabledElement);
+        delegate(document, Rails.formSubmitSelector, 'submit', handleConfirm);
+        delegate(document, Rails.formSubmitSelector, 'submit', handleRemote);
+        delegate(document, Rails.formSubmitSelector, 'submit', function(e) {
+          return setTimeout((function() {
+            return disableElement(e);
+          }), 13);
+        });
+        delegate(document, Rails.formSubmitSelector, 'ajax:send', disableElement);
+        delegate(document, Rails.formSubmitSelector, 'ajax:complete', enableElement);
+        delegate(document, Rails.formInputClickSelector, 'click', preventInsignificantClick);
+        delegate(document, Rails.formInputClickSelector, 'click', handleDisabledElement);
+        delegate(document, Rails.formInputClickSelector, 'click', handleConfirm);
+        delegate(document, Rails.formInputClickSelector, 'click', formSubmitButtonClick);
+        document.addEventListener('DOMContentLoaded', refreshCSRFTokens);
+        document.addEventListener('DOMContentLoaded', loadCSPNonce);
+        return window._rails_loaded = true;
+      };
+
+      if (window.Rails === Rails && fire(document, 'rails:attachBindings')) {
+        Rails.start();
+      }
+
+    }).call(this);
+  }).call(this);
+
+  if (typeof module === "object" && module.exports) {
+    module.exports = Rails;
+  } else if (typeof define === "function" && define.amd) {
+    define(Rails);
+  }
+}).call(this);
+(function(global, factory) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports) : typeof define === "function" && define.amd ? define([ "exports" ], factory) : factory(global.ActiveStorage = {});
+})(this, function(exports) {
+  "use strict";
+  function createCommonjsModule(fn, module) {
+    return module = {
+      exports: {}
+    }, fn(module, module.exports), module.exports;
+  }
+  var sparkMd5 = createCommonjsModule(function(module, exports) {
+    (function(factory) {
+      {
+        module.exports = factory();
+      }
+    })(function(undefined) {
+      var hex_chr = [ "0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "a", "b", "c", "d", "e", "f" ];
+      function md5cycle(x, k) {
+        var a = x[0], b = x[1], c = x[2], d = x[3];
+        a += (b & c | ~b & d) + k[0] - 680876936 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[1] - 389564586 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[2] + 606105819 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[3] - 1044525330 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & c | ~b & d) + k[4] - 176418897 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[5] + 1200080426 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[6] - 1473231341 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[7] - 45705983 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & c | ~b & d) + k[8] + 1770035416 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[9] - 1958414417 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[10] - 42063 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[11] - 1990404162 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & c | ~b & d) + k[12] + 1804603682 | 0;
+        a = (a << 7 | a >>> 25) + b | 0;
+        d += (a & b | ~a & c) + k[13] - 40341101 | 0;
+        d = (d << 12 | d >>> 20) + a | 0;
+        c += (d & a | ~d & b) + k[14] - 1502002290 | 0;
+        c = (c << 17 | c >>> 15) + d | 0;
+        b += (c & d | ~c & a) + k[15] + 1236535329 | 0;
+        b = (b << 22 | b >>> 10) + c | 0;
+        a += (b & d | c & ~d) + k[1] - 165796510 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[6] - 1069501632 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[11] + 643717713 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[0] - 373897302 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b & d | c & ~d) + k[5] - 701558691 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[10] + 38016083 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[15] - 660478335 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[4] - 405537848 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b & d | c & ~d) + k[9] + 568446438 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[14] - 1019803690 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[3] - 187363961 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[8] + 1163531501 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b & d | c & ~d) + k[13] - 1444681467 | 0;
+        a = (a << 5 | a >>> 27) + b | 0;
+        d += (a & c | b & ~c) + k[2] - 51403784 | 0;
+        d = (d << 9 | d >>> 23) + a | 0;
+        c += (d & b | a & ~b) + k[7] + 1735328473 | 0;
+        c = (c << 14 | c >>> 18) + d | 0;
+        b += (c & a | d & ~a) + k[12] - 1926607734 | 0;
+        b = (b << 20 | b >>> 12) + c | 0;
+        a += (b ^ c ^ d) + k[5] - 378558 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[8] - 2022574463 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[11] + 1839030562 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[14] - 35309556 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (b ^ c ^ d) + k[1] - 1530992060 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[4] + 1272893353 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[7] - 155497632 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[10] - 1094730640 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (b ^ c ^ d) + k[13] + 681279174 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[0] - 358537222 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[3] - 722521979 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[6] + 76029189 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (b ^ c ^ d) + k[9] - 640364487 | 0;
+        a = (a << 4 | a >>> 28) + b | 0;
+        d += (a ^ b ^ c) + k[12] - 421815835 | 0;
+        d = (d << 11 | d >>> 21) + a | 0;
+        c += (d ^ a ^ b) + k[15] + 530742520 | 0;
+        c = (c << 16 | c >>> 16) + d | 0;
+        b += (c ^ d ^ a) + k[2] - 995338651 | 0;
+        b = (b << 23 | b >>> 9) + c | 0;
+        a += (c ^ (b | ~d)) + k[0] - 198630844 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[7] + 1126891415 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[14] - 1416354905 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[5] - 57434055 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        a += (c ^ (b | ~d)) + k[12] + 1700485571 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[3] - 1894986606 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[10] - 1051523 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[1] - 2054922799 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        a += (c ^ (b | ~d)) + k[8] + 1873313359 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[15] - 30611744 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[6] - 1560198380 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[13] + 1309151649 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        a += (c ^ (b | ~d)) + k[4] - 145523070 | 0;
+        a = (a << 6 | a >>> 26) + b | 0;
+        d += (b ^ (a | ~c)) + k[11] - 1120210379 | 0;
+        d = (d << 10 | d >>> 22) + a | 0;
+        c += (a ^ (d | ~b)) + k[2] + 718787259 | 0;
+        c = (c << 15 | c >>> 17) + d | 0;
+        b += (d ^ (c | ~a)) + k[9] - 343485551 | 0;
+        b = (b << 21 | b >>> 11) + c | 0;
+        x[0] = a + x[0] | 0;
+        x[1] = b + x[1] | 0;
+        x[2] = c + x[2] | 0;
+        x[3] = d + x[3] | 0;
+      }
+      function md5blk(s) {
+        var md5blks = [], i;
+        for (i = 0; i < 64; i += 4) {
+          md5blks[i >> 2] = s.charCodeAt(i) + (s.charCodeAt(i + 1) << 8) + (s.charCodeAt(i + 2) << 16) + (s.charCodeAt(i + 3) << 24);
+        }
+        return md5blks;
+      }
+      function md5blk_array(a) {
+        var md5blks = [], i;
+        for (i = 0; i < 64; i += 4) {
+          md5blks[i >> 2] = a[i] + (a[i + 1] << 8) + (a[i + 2] << 16) + (a[i + 3] << 24);
+        }
+        return md5blks;
+      }
+      function md51(s) {
+        var n = s.length, state = [ 1732584193, -271733879, -1732584194, 271733878 ], i, length, tail, tmp, lo, hi;
+        for (i = 64; i <= n; i += 64) {
+          md5cycle(state, md5blk(s.substring(i - 64, i)));
+        }
+        s = s.substring(i - 64);
+        length = s.length;
+        tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= s.charCodeAt(i) << (i % 4 << 3);
+        }
+        tail[i >> 2] |= 128 << (i % 4 << 3);
+        if (i > 55) {
+          md5cycle(state, tail);
+          for (i = 0; i < 16; i += 1) {
+            tail[i] = 0;
+          }
+        }
+        tmp = n * 8;
+        tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
+        lo = parseInt(tmp[2], 16);
+        hi = parseInt(tmp[1], 16) || 0;
+        tail[14] = lo;
+        tail[15] = hi;
+        md5cycle(state, tail);
+        return state;
+      }
+      function md51_array(a) {
+        var n = a.length, state = [ 1732584193, -271733879, -1732584194, 271733878 ], i, length, tail, tmp, lo, hi;
+        for (i = 64; i <= n; i += 64) {
+          md5cycle(state, md5blk_array(a.subarray(i - 64, i)));
+        }
+        a = i - 64 < n ? a.subarray(i - 64) : new Uint8Array(0);
+        length = a.length;
+        tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ];
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= a[i] << (i % 4 << 3);
+        }
+        tail[i >> 2] |= 128 << (i % 4 << 3);
+        if (i > 55) {
+          md5cycle(state, tail);
+          for (i = 0; i < 16; i += 1) {
+            tail[i] = 0;
+          }
+        }
+        tmp = n * 8;
+        tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
+        lo = parseInt(tmp[2], 16);
+        hi = parseInt(tmp[1], 16) || 0;
+        tail[14] = lo;
+        tail[15] = hi;
+        md5cycle(state, tail);
+        return state;
+      }
+      function rhex(n) {
+        var s = "", j;
+        for (j = 0; j < 4; j += 1) {
+          s += hex_chr[n >> j * 8 + 4 & 15] + hex_chr[n >> j * 8 & 15];
+        }
+        return s;
+      }
+      function hex(x) {
+        var i;
+        for (i = 0; i < x.length; i += 1) {
+          x[i] = rhex(x[i]);
+        }
+        return x.join("");
+      }
+      if (hex(md51("hello")) !== "5d41402abc4b2a76b9719d911017c592") ;
+      if (typeof ArrayBuffer !== "undefined" && !ArrayBuffer.prototype.slice) {
+        (function() {
+          function clamp(val, length) {
+            val = val | 0 || 0;
+            if (val < 0) {
+              return Math.max(val + length, 0);
+            }
+            return Math.min(val, length);
+          }
+          ArrayBuffer.prototype.slice = function(from, to) {
+            var length = this.byteLength, begin = clamp(from, length), end = length, num, target, targetArray, sourceArray;
+            if (to !== undefined) {
+              end = clamp(to, length);
+            }
+            if (begin > end) {
+              return new ArrayBuffer(0);
+            }
+            num = end - begin;
+            target = new ArrayBuffer(num);
+            targetArray = new Uint8Array(target);
+            sourceArray = new Uint8Array(this, begin, num);
+            targetArray.set(sourceArray);
+            return target;
+          };
+        })();
+      }
+      function toUtf8(str) {
+        if (/[\u0080-\uFFFF]/.test(str)) {
+          str = unescape(encodeURIComponent(str));
+        }
+        return str;
+      }
+      function utf8Str2ArrayBuffer(str, returnUInt8Array) {
+        var length = str.length, buff = new ArrayBuffer(length), arr = new Uint8Array(buff), i;
+        for (i = 0; i < length; i += 1) {
+          arr[i] = str.charCodeAt(i);
+        }
+        return returnUInt8Array ? arr : buff;
+      }
+      function arrayBuffer2Utf8Str(buff) {
+        return String.fromCharCode.apply(null, new Uint8Array(buff));
+      }
+      function concatenateArrayBuffers(first, second, returnUInt8Array) {
+        var result = new Uint8Array(first.byteLength + second.byteLength);
+        result.set(new Uint8Array(first));
+        result.set(new Uint8Array(second), first.byteLength);
+        return returnUInt8Array ? result : result.buffer;
+      }
+      function hexToBinaryString(hex) {
+        var bytes = [], length = hex.length, x;
+        for (x = 0; x < length - 1; x += 2) {
+          bytes.push(parseInt(hex.substr(x, 2), 16));
+        }
+        return String.fromCharCode.apply(String, bytes);
+      }
+      function SparkMD5() {
+        this.reset();
+      }
+      SparkMD5.prototype.append = function(str) {
+        this.appendBinary(toUtf8(str));
+        return this;
+      };
+      SparkMD5.prototype.appendBinary = function(contents) {
+        this._buff += contents;
+        this._length += contents.length;
+        var length = this._buff.length, i;
+        for (i = 64; i <= length; i += 64) {
+          md5cycle(this._hash, md5blk(this._buff.substring(i - 64, i)));
+        }
+        this._buff = this._buff.substring(i - 64);
+        return this;
+      };
+      SparkMD5.prototype.end = function(raw) {
+        var buff = this._buff, length = buff.length, i, tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], ret;
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= buff.charCodeAt(i) << (i % 4 << 3);
+        }
+        this._finish(tail, length);
+        ret = hex(this._hash);
+        if (raw) {
+          ret = hexToBinaryString(ret);
+        }
+        this.reset();
+        return ret;
+      };
+      SparkMD5.prototype.reset = function() {
+        this._buff = "";
+        this._length = 0;
+        this._hash = [ 1732584193, -271733879, -1732584194, 271733878 ];
+        return this;
+      };
+      SparkMD5.prototype.getState = function() {
+        return {
+          buff: this._buff,
+          length: this._length,
+          hash: this._hash
+        };
+      };
+      SparkMD5.prototype.setState = function(state) {
+        this._buff = state.buff;
+        this._length = state.length;
+        this._hash = state.hash;
+        return this;
+      };
+      SparkMD5.prototype.destroy = function() {
+        delete this._hash;
+        delete this._buff;
+        delete this._length;
+      };
+      SparkMD5.prototype._finish = function(tail, length) {
+        var i = length, tmp, lo, hi;
+        tail[i >> 2] |= 128 << (i % 4 << 3);
+        if (i > 55) {
+          md5cycle(this._hash, tail);
+          for (i = 0; i < 16; i += 1) {
+            tail[i] = 0;
+          }
+        }
+        tmp = this._length * 8;
+        tmp = tmp.toString(16).match(/(.*?)(.{0,8})$/);
+        lo = parseInt(tmp[2], 16);
+        hi = parseInt(tmp[1], 16) || 0;
+        tail[14] = lo;
+        tail[15] = hi;
+        md5cycle(this._hash, tail);
+      };
+      SparkMD5.hash = function(str, raw) {
+        return SparkMD5.hashBinary(toUtf8(str), raw);
+      };
+      SparkMD5.hashBinary = function(content, raw) {
+        var hash = md51(content), ret = hex(hash);
+        return raw ? hexToBinaryString(ret) : ret;
+      };
+      SparkMD5.ArrayBuffer = function() {
+        this.reset();
+      };
+      SparkMD5.ArrayBuffer.prototype.append = function(arr) {
+        var buff = concatenateArrayBuffers(this._buff.buffer, arr, true), length = buff.length, i;
+        this._length += arr.byteLength;
+        for (i = 64; i <= length; i += 64) {
+          md5cycle(this._hash, md5blk_array(buff.subarray(i - 64, i)));
+        }
+        this._buff = i - 64 < length ? new Uint8Array(buff.buffer.slice(i - 64)) : new Uint8Array(0);
+        return this;
+      };
+      SparkMD5.ArrayBuffer.prototype.end = function(raw) {
+        var buff = this._buff, length = buff.length, tail = [ 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0 ], i, ret;
+        for (i = 0; i < length; i += 1) {
+          tail[i >> 2] |= buff[i] << (i % 4 << 3);
+        }
+        this._finish(tail, length);
+        ret = hex(this._hash);
+        if (raw) {
+          ret = hexToBinaryString(ret);
+        }
+        this.reset();
+        return ret;
+      };
+      SparkMD5.ArrayBuffer.prototype.reset = function() {
+        this._buff = new Uint8Array(0);
+        this._length = 0;
+        this._hash = [ 1732584193, -271733879, -1732584194, 271733878 ];
+        return this;
+      };
+      SparkMD5.ArrayBuffer.prototype.getState = function() {
+        var state = SparkMD5.prototype.getState.call(this);
+        state.buff = arrayBuffer2Utf8Str(state.buff);
+        return state;
+      };
+      SparkMD5.ArrayBuffer.prototype.setState = function(state) {
+        state.buff = utf8Str2ArrayBuffer(state.buff, true);
+        return SparkMD5.prototype.setState.call(this, state);
+      };
+      SparkMD5.ArrayBuffer.prototype.destroy = SparkMD5.prototype.destroy;
+      SparkMD5.ArrayBuffer.prototype._finish = SparkMD5.prototype._finish;
+      SparkMD5.ArrayBuffer.hash = function(arr, raw) {
+        var hash = md51_array(new Uint8Array(arr)), ret = hex(hash);
+        return raw ? hexToBinaryString(ret) : ret;
+      };
+      return SparkMD5;
+    });
+  });
+  var classCallCheck = function(instance, Constructor) {
+    if (!(instance instanceof Constructor)) {
+      throw new TypeError("Cannot call a class as a function");
+    }
+  };
+  var createClass = function() {
+    function defineProperties(target, props) {
+      for (var i = 0; i < props.length; i++) {
+        var descriptor = props[i];
+        descriptor.enumerable = descriptor.enumerable || false;
+        descriptor.configurable = true;
+        if ("value" in descriptor) descriptor.writable = true;
+        Object.defineProperty(target, descriptor.key, descriptor);
+      }
+    }
+    return function(Constructor, protoProps, staticProps) {
+      if (protoProps) defineProperties(Constructor.prototype, protoProps);
+      if (staticProps) defineProperties(Constructor, staticProps);
+      return Constructor;
+    };
+  }();
+  var fileSlice = File.prototype.slice || File.prototype.mozSlice || File.prototype.webkitSlice;
+  var FileChecksum = function() {
+    createClass(FileChecksum, null, [ {
+      key: "create",
+      value: function create(file, callback) {
+        var instance = new FileChecksum(file);
+        instance.create(callback);
+      }
+    } ]);
+    function FileChecksum(file) {
+      classCallCheck(this, FileChecksum);
+      this.file = file;
+      this.chunkSize = 2097152;
+      this.chunkCount = Math.ceil(this.file.size / this.chunkSize);
+      this.chunkIndex = 0;
+    }
+    createClass(FileChecksum, [ {
+      key: "create",
+      value: function create(callback) {
+        var _this = this;
+        this.callback = callback;
+        this.md5Buffer = new sparkMd5.ArrayBuffer();
+        this.fileReader = new FileReader();
+        this.fileReader.addEventListener("load", function(event) {
+          return _this.fileReaderDidLoad(event);
+        });
+        this.fileReader.addEventListener("error", function(event) {
+          return _this.fileReaderDidError(event);
+        });
+        this.readNextChunk();
+      }
+    }, {
+      key: "fileReaderDidLoad",
+      value: function fileReaderDidLoad(event) {
+        this.md5Buffer.append(event.target.result);
+        if (!this.readNextChunk()) {
+          var binaryDigest = this.md5Buffer.end(true);
+          var base64digest = btoa(binaryDigest);
+          this.callback(null, base64digest);
+        }
+      }
+    }, {
+      key: "fileReaderDidError",
+      value: function fileReaderDidError(event) {
+        this.callback("Error reading " + this.file.name);
+      }
+    }, {
+      key: "readNextChunk",
+      value: function readNextChunk() {
+        if (this.chunkIndex < this.chunkCount || this.chunkIndex == 0 && this.chunkCount == 0) {
+          var start = this.chunkIndex * this.chunkSize;
+          var end = Math.min(start + this.chunkSize, this.file.size);
+          var bytes = fileSlice.call(this.file, start, end);
+          this.fileReader.readAsArrayBuffer(bytes);
+          this.chunkIndex++;
+          return true;
+        } else {
+          return false;
+        }
+      }
+    } ]);
+    return FileChecksum;
+  }();
+  function getMetaValue(name) {
+    var element = findElement(document.head, 'meta[name="' + name + '"]');
+    if (element) {
+      return element.getAttribute("content");
+    }
+  }
+  function findElements(root, selector) {
+    if (typeof root == "string") {
+      selector = root;
+      root = document;
+    }
+    var elements = root.querySelectorAll(selector);
+    return toArray$1(elements);
+  }
+  function findElement(root, selector) {
+    if (typeof root == "string") {
+      selector = root;
+      root = document;
+    }
+    return root.querySelector(selector);
+  }
+  function dispatchEvent(element, type) {
+    var eventInit = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    var disabled = element.disabled;
+    var bubbles = eventInit.bubbles, cancelable = eventInit.cancelable, detail = eventInit.detail;
+    var event = document.createEvent("Event");
+    event.initEvent(type, bubbles || true, cancelable || true);
+    event.detail = detail || {};
+    try {
+      element.disabled = false;
+      element.dispatchEvent(event);
+    } finally {
+      element.disabled = disabled;
+    }
+    return event;
+  }
+  function toArray$1(value) {
+    if (Array.isArray(value)) {
+      return value;
+    } else if (Array.from) {
+      return Array.from(value);
+    } else {
+      return [].slice.call(value);
+    }
+  }
+  var BlobRecord = function() {
+    function BlobRecord(file, checksum, url) {
+      var _this = this;
+      classCallCheck(this, BlobRecord);
+      this.file = file;
+      this.attributes = {
+        filename: file.name,
+        content_type: file.type,
+        byte_size: file.size,
+        checksum: checksum
+      };
+      this.xhr = new XMLHttpRequest();
+      this.xhr.open("POST", url, true);
+      this.xhr.responseType = "json";
+      this.xhr.setRequestHeader("Content-Type", "application/json");
+      this.xhr.setRequestHeader("Accept", "application/json");
+      this.xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
+      this.xhr.setRequestHeader("X-CSRF-Token", getMetaValue("csrf-token"));
+      this.xhr.addEventListener("load", function(event) {
+        return _this.requestDidLoad(event);
+      });
+      this.xhr.addEventListener("error", function(event) {
+        return _this.requestDidError(event);
+      });
+    }
+    createClass(BlobRecord, [ {
+      key: "create",
+      value: function create(callback) {
+        this.callback = callback;
+        this.xhr.send(JSON.stringify({
+          blob: this.attributes
+        }));
+      }
+    }, {
+      key: "requestDidLoad",
+      value: function requestDidLoad(event) {
+        if (this.status >= 200 && this.status < 300) {
+          var response = this.response;
+          var direct_upload = response.direct_upload;
+          delete response.direct_upload;
+          this.attributes = response;
+          this.directUploadData = direct_upload;
+          this.callback(null, this.toJSON());
+        } else {
+          this.requestDidError(event);
+        }
+      }
+    }, {
+      key: "requestDidError",
+      value: function requestDidError(event) {
+        this.callback('Error creating Blob for "' + this.file.name + '". Status: ' + this.status);
+      }
+    }, {
+      key: "toJSON",
+      value: function toJSON() {
+        var result = {};
+        for (var key in this.attributes) {
+          result[key] = this.attributes[key];
+        }
+        return result;
+      }
+    }, {
+      key: "status",
+      get: function get$$1() {
+        return this.xhr.status;
+      }
+    }, {
+      key: "response",
+      get: function get$$1() {
+        var _xhr = this.xhr, responseType = _xhr.responseType, response = _xhr.response;
+        if (responseType == "json") {
+          return response;
+        } else {
+          return JSON.parse(response);
+        }
+      }
+    } ]);
+    return BlobRecord;
+  }();
+  var BlobUpload = function() {
+    function BlobUpload(blob) {
+      var _this = this;
+      classCallCheck(this, BlobUpload);
+      this.blob = blob;
+      this.file = blob.file;
+      var _blob$directUploadDat = blob.directUploadData, url = _blob$directUploadDat.url, headers = _blob$directUploadDat.headers;
+      this.xhr = new XMLHttpRequest();
+      this.xhr.open("PUT", url, true);
+      this.xhr.responseType = "text";
+      for (var key in headers) {
+        this.xhr.setRequestHeader(key, headers[key]);
+      }
+      this.xhr.addEventListener("load", function(event) {
+        return _this.requestDidLoad(event);
+      });
+      this.xhr.addEventListener("error", function(event) {
+        return _this.requestDidError(event);
+      });
+    }
+    createClass(BlobUpload, [ {
+      key: "create",
+      value: function create(callback) {
+        this.callback = callback;
+        this.xhr.send(this.file.slice());
+      }
+    }, {
+      key: "requestDidLoad",
+      value: function requestDidLoad(event) {
+        var _xhr = this.xhr, status = _xhr.status, response = _xhr.response;
+        if (status >= 200 && status < 300) {
+          this.callback(null, response);
+        } else {
+          this.requestDidError(event);
+        }
+      }
+    }, {
+      key: "requestDidError",
+      value: function requestDidError(event) {
+        this.callback('Error storing "' + this.file.name + '". Status: ' + this.xhr.status);
+      }
+    } ]);
+    return BlobUpload;
+  }();
+  var id = 0;
+  var DirectUpload = function() {
+    function DirectUpload(file, url, delegate) {
+      classCallCheck(this, DirectUpload);
+      this.id = ++id;
+      this.file = file;
+      this.url = url;
+      this.delegate = delegate;
+    }
+    createClass(DirectUpload, [ {
+      key: "create",
+      value: function create(callback) {
+        var _this = this;
+        FileChecksum.create(this.file, function(error, checksum) {
+          if (error) {
+            callback(error);
+            return;
+          }
+          var blob = new BlobRecord(_this.file, checksum, _this.url);
+          notify(_this.delegate, "directUploadWillCreateBlobWithXHR", blob.xhr);
+          blob.create(function(error) {
+            if (error) {
+              callback(error);
+            } else {
+              var upload = new BlobUpload(blob);
+              notify(_this.delegate, "directUploadWillStoreFileWithXHR", upload.xhr);
+              upload.create(function(error) {
+                if (error) {
+                  callback(error);
+                } else {
+                  callback(null, blob.toJSON());
+                }
+              });
+            }
+          });
+        });
+      }
+    } ]);
+    return DirectUpload;
+  }();
+  function notify(object, methodName) {
+    if (object && typeof object[methodName] == "function") {
+      for (var _len = arguments.length, messages = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+        messages[_key - 2] = arguments[_key];
+      }
+      return object[methodName].apply(object, messages);
+    }
+  }
+  var DirectUploadController = function() {
+    function DirectUploadController(input, file) {
+      classCallCheck(this, DirectUploadController);
+      this.input = input;
+      this.file = file;
+      this.directUpload = new DirectUpload(this.file, this.url, this);
+      this.dispatch("initialize");
+    }
+    createClass(DirectUploadController, [ {
+      key: "start",
+      value: function start(callback) {
+        var _this = this;
+        var hiddenInput = document.createElement("input");
+        hiddenInput.type = "hidden";
+        hiddenInput.name = this.input.name;
+        this.input.insertAdjacentElement("beforebegin", hiddenInput);
+        this.dispatch("start");
+        this.directUpload.create(function(error, attributes) {
+          if (error) {
+            hiddenInput.parentNode.removeChild(hiddenInput);
+            _this.dispatchError(error);
+          } else {
+            hiddenInput.value = attributes.signed_id;
+          }
+          _this.dispatch("end");
+          callback(error);
+        });
+      }
+    }, {
+      key: "uploadRequestDidProgress",
+      value: function uploadRequestDidProgress(event) {
+        var progress = event.loaded / event.total * 100;
+        if (progress) {
+          this.dispatch("progress", {
+            progress: progress
+          });
+        }
+      }
+    }, {
+      key: "dispatch",
+      value: function dispatch(name) {
+        var detail = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+        detail.file = this.file;
+        detail.id = this.directUpload.id;
+        return dispatchEvent(this.input, "direct-upload:" + name, {
+          detail: detail
+        });
+      }
+    }, {
+      key: "dispatchError",
+      value: function dispatchError(error) {
+        var event = this.dispatch("error", {
+          error: error
+        });
+        if (!event.defaultPrevented) {
+          alert(error);
+        }
+      }
+    }, {
+      key: "directUploadWillCreateBlobWithXHR",
+      value: function directUploadWillCreateBlobWithXHR(xhr) {
+        this.dispatch("before-blob-request", {
+          xhr: xhr
+        });
+      }
+    }, {
+      key: "directUploadWillStoreFileWithXHR",
+      value: function directUploadWillStoreFileWithXHR(xhr) {
+        var _this2 = this;
+        this.dispatch("before-storage-request", {
+          xhr: xhr
+        });
+        xhr.upload.addEventListener("progress", function(event) {
+          return _this2.uploadRequestDidProgress(event);
+        });
+      }
+    }, {
+      key: "url",
+      get: function get$$1() {
+        return this.input.getAttribute("data-direct-upload-url");
+      }
+    } ]);
+    return DirectUploadController;
+  }();
+  var inputSelector = "input[type=file][data-direct-upload-url]:not([disabled])";
+  var DirectUploadsController = function() {
+    function DirectUploadsController(form) {
+      classCallCheck(this, DirectUploadsController);
+      this.form = form;
+      this.inputs = findElements(form, inputSelector).filter(function(input) {
+        return input.files.length;
+      });
+    }
+    createClass(DirectUploadsController, [ {
+      key: "start",
+      value: function start(callback) {
+        var _this = this;
+        var controllers = this.createDirectUploadControllers();
+        var startNextController = function startNextController() {
+          var controller = controllers.shift();
+          if (controller) {
+            controller.start(function(error) {
+              if (error) {
+                callback(error);
+                _this.dispatch("end");
+              } else {
+                startNextController();
+              }
+            });
+          } else {
+            callback();
+            _this.dispatch("end");
+          }
+        };
+        this.dispatch("start");
+        startNextController();
+      }
+    }, {
+      key: "createDirectUploadControllers",
+      value: function createDirectUploadControllers() {
+        var controllers = [];
+        this.inputs.forEach(function(input) {
+          toArray$1(input.files).forEach(function(file) {
+            var controller = new DirectUploadController(input, file);
+            controllers.push(controller);
+          });
+        });
+        return controllers;
+      }
+    }, {
+      key: "dispatch",
+      value: function dispatch(name) {
+        var detail = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+        return dispatchEvent(this.form, "direct-uploads:" + name, {
+          detail: detail
+        });
+      }
+    } ]);
+    return DirectUploadsController;
+  }();
+  var processingAttribute = "data-direct-uploads-processing";
+  var submitButtonsByForm = new WeakMap();
+  var started = false;
+  function start() {
+    if (!started) {
+      started = true;
+      document.addEventListener("click", didClick, true);
+      document.addEventListener("submit", didSubmitForm);
+      document.addEventListener("ajax:before", didSubmitRemoteElement);
+    }
+  }
+  function didClick(event) {
+    var target = event.target;
+    if ((target.tagName == "INPUT" || target.tagName == "BUTTON") && target.type == "submit" && target.form) {
+      submitButtonsByForm.set(target.form, target);
+    }
+  }
+  function didSubmitForm(event) {
+    handleFormSubmissionEvent(event);
+  }
+  function didSubmitRemoteElement(event) {
+    if (event.target.tagName == "FORM") {
+      handleFormSubmissionEvent(event);
+    }
+  }
+  function handleFormSubmissionEvent(event) {
+    var form = event.target;
+    if (form.hasAttribute(processingAttribute)) {
+      event.preventDefault();
+      return;
+    }
+    var controller = new DirectUploadsController(form);
+    var inputs = controller.inputs;
+    if (inputs.length) {
+      event.preventDefault();
+      form.setAttribute(processingAttribute, "");
+      inputs.forEach(disable);
+      controller.start(function(error) {
+        form.removeAttribute(processingAttribute);
+        if (error) {
+          inputs.forEach(enable);
+        } else {
+          submitForm(form);
+        }
+      });
+    }
+  }
+  function submitForm(form) {
+    var button = submitButtonsByForm.get(form) || findElement(form, "input[type=submit], button[type=submit]");
+    if (button) {
+      var _button = button, disabled = _button.disabled;
+      button.disabled = false;
+      button.focus();
+      button.click();
+      button.disabled = disabled;
+    } else {
+      button = document.createElement("input");
+      button.type = "submit";
+      button.style.display = "none";
+      form.appendChild(button);
+      button.click();
+      form.removeChild(button);
+    }
+    submitButtonsByForm.delete(form);
+  }
+  function disable(input) {
+    input.disabled = true;
+  }
+  function enable(input) {
+    input.disabled = false;
+  }
+  function autostart() {
+    if (window.ActiveStorage) {
+      start();
+    }
+  }
+  setTimeout(autostart, 1);
+  exports.start = start;
+  exports.DirectUpload = DirectUpload;
+  Object.defineProperty(exports, "__esModule", {
+    value: true
+  });
+});
+/*
+Turbolinks 5.2.0
+Copyright © 2018 Basecamp, LLC
+ */
+
+(function(){var t=this;(function(){(function(){this.Turbolinks={supported:function(){return null!=window.history.pushState&&null!=window.requestAnimationFrame&&null!=window.addEventListener}(),visit:function(t,r){return e.controller.visit(t,r)},clearCache:function(){return e.controller.clearCache()},setProgressBarDelay:function(t){return e.controller.setProgressBarDelay(t)}}}).call(this)}).call(t);var e=t.Turbolinks;(function(){(function(){var t,r,n,o=[].slice;e.copyObject=function(t){var e,r,n;r={};for(e in t)n=t[e],r[e]=n;return r},e.closest=function(e,r){return t.call(e,r)},t=function(){var t,e;return t=document.documentElement,null!=(e=t.closest)?e:function(t){var e;for(e=this;e;){if(e.nodeType===Node.ELEMENT_NODE&&r.call(e,t))return e;e=e.parentNode}}}(),e.defer=function(t){return setTimeout(t,1)},e.throttle=function(t){var e;return e=null,function(){var r;return r=1<=arguments.length?o.call(arguments,0):[],null!=e?e:e=requestAnimationFrame(function(n){return function(){return e=null,t.apply(n,r)}}(this))}},e.dispatch=function(t,e){var r,o,i,s,a,u;return a=null!=e?e:{},u=a.target,r=a.cancelable,o=a.data,i=document.createEvent("Events"),i.initEvent(t,!0,r===!0),i.data=null!=o?o:{},i.cancelable&&!n&&(s=i.preventDefault,i.preventDefault=function(){return this.defaultPrevented||Object.defineProperty(this,"defaultPrevented",{get:function(){return!0}}),s.call(this)}),(null!=u?u:document).dispatchEvent(i),i},n=function(){var t;return t=document.createEvent("Events"),t.initEvent("test",!0,!0),t.preventDefault(),t.defaultPrevented}(),e.match=function(t,e){return r.call(t,e)},r=function(){var t,e,r,n;return t=document.documentElement,null!=(e=null!=(r=null!=(n=t.matchesSelector)?n:t.webkitMatchesSelector)?r:t.msMatchesSelector)?e:t.mozMatchesSelector}(),e.uuid=function(){var t,e,r;for(r="",t=e=1;36>=e;t=++e)r+=9===t||14===t||19===t||24===t?"-":15===t?"4":20===t?(Math.floor(4*Math.random())+8).toString(16):Math.floor(15*Math.random()).toString(16);return r}}).call(this),function(){e.Location=function(){function t(t){var e,r;null==t&&(t=""),r=document.createElement("a"),r.href=t.toString(),this.absoluteURL=r.href,e=r.hash.length,2>e?this.requestURL=this.absoluteURL:(this.requestURL=this.absoluteURL.slice(0,-e),this.anchor=r.hash.slice(1))}var e,r,n,o;return t.wrap=function(t){return t instanceof this?t:new this(t)},t.prototype.getOrigin=function(){return this.absoluteURL.split("/",3).join("/")},t.prototype.getPath=function(){var t,e;return null!=(t=null!=(e=this.requestURL.match(/\/\/[^\/]*(\/[^?;]*)/))?e[1]:void 0)?t:"/"},t.prototype.getPathComponents=function(){return this.getPath().split("/").slice(1)},t.prototype.getLastPathComponent=function(){return this.getPathComponents().slice(-1)[0]},t.prototype.getExtension=function(){var t,e;return null!=(t=null!=(e=this.getLastPathComponent().match(/\.[^.]*$/))?e[0]:void 0)?t:""},t.prototype.isHTML=function(){return this.getExtension().match(/^(?:|\.(?:htm|html|xhtml))$/)},t.prototype.isPrefixedBy=function(t){var e;return e=r(t),this.isEqualTo(t)||o(this.absoluteURL,e)},t.prototype.isEqualTo=function(t){return this.absoluteURL===(null!=t?t.absoluteURL:void 0)},t.prototype.toCacheKey=function(){return this.requestURL},t.prototype.toJSON=function(){return this.absoluteURL},t.prototype.toString=function(){return this.absoluteURL},t.prototype.valueOf=function(){return this.absoluteURL},r=function(t){return e(t.getOrigin()+t.getPath())},e=function(t){return n(t,"/")?t:t+"/"},o=function(t,e){return t.slice(0,e.length)===e},n=function(t,e){return t.slice(-e.length)===e},t}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.HttpRequest=function(){function r(r,n,o){this.delegate=r,this.requestCanceled=t(this.requestCanceled,this),this.requestTimedOut=t(this.requestTimedOut,this),this.requestFailed=t(this.requestFailed,this),this.requestLoaded=t(this.requestLoaded,this),this.requestProgressed=t(this.requestProgressed,this),this.url=e.Location.wrap(n).requestURL,this.referrer=e.Location.wrap(o).absoluteURL,this.createXHR()}return r.NETWORK_FAILURE=0,r.TIMEOUT_FAILURE=-1,r.timeout=60,r.prototype.send=function(){var t;return this.xhr&&!this.sent?(this.notifyApplicationBeforeRequestStart(),this.setProgress(0),this.xhr.send(),this.sent=!0,"function"==typeof(t=this.delegate).requestStarted?t.requestStarted():void 0):void 0},r.prototype.cancel=function(){return this.xhr&&this.sent?this.xhr.abort():void 0},r.prototype.requestProgressed=function(t){return t.lengthComputable?this.setProgress(t.loaded/t.total):void 0},r.prototype.requestLoaded=function(){return this.endRequest(function(t){return function(){var e;return 200<=(e=t.xhr.status)&&300>e?t.delegate.requestCompletedWithResponse(t.xhr.responseText,t.xhr.getResponseHeader("Turbolinks-Location")):(t.failed=!0,t.delegate.requestFailedWithStatusCode(t.xhr.status,t.xhr.responseText))}}(this))},r.prototype.requestFailed=function(){return this.endRequest(function(t){return function(){return t.failed=!0,t.delegate.requestFailedWithStatusCode(t.constructor.NETWORK_FAILURE)}}(this))},r.prototype.requestTimedOut=function(){return this.endRequest(function(t){return function(){return t.failed=!0,t.delegate.requestFailedWithStatusCode(t.constructor.TIMEOUT_FAILURE)}}(this))},r.prototype.requestCanceled=function(){return this.endRequest()},r.prototype.notifyApplicationBeforeRequestStart=function(){return e.dispatch("turbolinks:request-start",{data:{url:this.url,xhr:this.xhr}})},r.prototype.notifyApplicationAfterRequestEnd=function(){return e.dispatch("turbolinks:request-end",{data:{url:this.url,xhr:this.xhr}})},r.prototype.createXHR=function(){return this.xhr=new XMLHttpRequest,this.xhr.open("GET",this.url,!0),this.xhr.timeout=1e3*this.constructor.timeout,this.xhr.setRequestHeader("Accept","text/html, application/xhtml+xml"),this.xhr.setRequestHeader("Turbolinks-Referrer",this.referrer),this.xhr.onprogress=this.requestProgressed,this.xhr.onload=this.requestLoaded,this.xhr.onerror=this.requestFailed,this.xhr.ontimeout=this.requestTimedOut,this.xhr.onabort=this.requestCanceled},r.prototype.endRequest=function(t){return this.xhr?(this.notifyApplicationAfterRequestEnd(),null!=t&&t.call(this),this.destroy()):void 0},r.prototype.setProgress=function(t){var e;return this.progress=t,"function"==typeof(e=this.delegate).requestProgressed?e.requestProgressed(this.progress):void 0},r.prototype.destroy=function(){var t;return this.setProgress(1),"function"==typeof(t=this.delegate).requestFinished&&t.requestFinished(),this.delegate=null,this.xhr=null},r}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.ProgressBar=function(){function e(){this.trickle=t(this.trickle,this),this.stylesheetElement=this.createStylesheetElement(),this.progressElement=this.createProgressElement()}var r;return r=300,e.defaultCSS=".turbolinks-progress-bar {\n  position: fixed;\n  display: block;\n  top: 0;\n  left: 0;\n  height: 3px;\n  background: #0076ff;\n  z-index: 9999;\n  transition: width "+r+"ms ease-out, opacity "+r/2+"ms "+r/2+"ms ease-in;\n  transform: translate3d(0, 0, 0);\n}",e.prototype.show=function(){return this.visible?void 0:(this.visible=!0,this.installStylesheetElement(),this.installProgressElement(),this.startTrickling())},e.prototype.hide=function(){return this.visible&&!this.hiding?(this.hiding=!0,this.fadeProgressElement(function(t){return function(){return t.uninstallProgressElement(),t.stopTrickling(),t.visible=!1,t.hiding=!1}}(this))):void 0},e.prototype.setValue=function(t){return this.value=t,this.refresh()},e.prototype.installStylesheetElement=function(){return document.head.insertBefore(this.stylesheetElement,document.head.firstChild)},e.prototype.installProgressElement=function(){return this.progressElement.style.width=0,this.progressElement.style.opacity=1,document.documentElement.insertBefore(this.progressElement,document.body),this.refresh()},e.prototype.fadeProgressElement=function(t){return this.progressElement.style.opacity=0,setTimeout(t,1.5*r)},e.prototype.uninstallProgressElement=function(){return this.progressElement.parentNode?document.documentElement.removeChild(this.progressElement):void 0},e.prototype.startTrickling=function(){return null!=this.trickleInterval?this.trickleInterval:this.trickleInterval=setInterval(this.trickle,r)},e.prototype.stopTrickling=function(){return clearInterval(this.trickleInterval),this.trickleInterval=null},e.prototype.trickle=function(){return this.setValue(this.value+Math.random()/100)},e.prototype.refresh=function(){return requestAnimationFrame(function(t){return function(){return t.progressElement.style.width=10+90*t.value+"%"}}(this))},e.prototype.createStylesheetElement=function(){var t;return t=document.createElement("style"),t.type="text/css",t.textContent=this.constructor.defaultCSS,t},e.prototype.createProgressElement=function(){var t;return t=document.createElement("div"),t.className="turbolinks-progress-bar",t},e}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.BrowserAdapter=function(){function r(r){this.controller=r,this.showProgressBar=t(this.showProgressBar,this),this.progressBar=new e.ProgressBar}var n,o,i;return i=e.HttpRequest,n=i.NETWORK_FAILURE,o=i.TIMEOUT_FAILURE,r.prototype.visitProposedToLocationWithAction=function(t,e){return this.controller.startVisitToLocationWithAction(t,e)},r.prototype.visitStarted=function(t){return t.issueRequest(),t.changeHistory(),t.loadCachedSnapshot()},r.prototype.visitRequestStarted=function(t){return this.progressBar.setValue(0),t.hasCachedSnapshot()||"restore"!==t.action?this.showProgressBarAfterDelay():this.showProgressBar()},r.prototype.visitRequestProgressed=function(t){return this.progressBar.setValue(t.progress)},r.prototype.visitRequestCompleted=function(t){return t.loadResponse()},r.prototype.visitRequestFailedWithStatusCode=function(t,e){switch(e){case n:case o:return this.reload();default:return t.loadResponse()}},r.prototype.visitRequestFinished=function(t){return this.hideProgressBar()},r.prototype.visitCompleted=function(t){return t.followRedirect()},r.prototype.pageInvalidated=function(){return this.reload()},r.prototype.showProgressBarAfterDelay=function(){return this.progressBarTimeout=setTimeout(this.showProgressBar,this.controller.progressBarDelay)},r.prototype.showProgressBar=function(){return this.progressBar.show()},r.prototype.hideProgressBar=function(){return this.progressBar.hide(),clearTimeout(this.progressBarTimeout)},r.prototype.reload=function(){return window.location.reload()},r}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.History=function(){function r(e){this.delegate=e,this.onPageLoad=t(this.onPageLoad,this),this.onPopState=t(this.onPopState,this)}return r.prototype.start=function(){return this.started?void 0:(addEventListener("popstate",this.onPopState,!1),addEventListener("load",this.onPageLoad,!1),this.started=!0)},r.prototype.stop=function(){return this.started?(removeEventListener("popstate",this.onPopState,!1),removeEventListener("load",this.onPageLoad,!1),this.started=!1):void 0},r.prototype.push=function(t,r){return t=e.Location.wrap(t),this.update("push",t,r)},r.prototype.replace=function(t,r){return t=e.Location.wrap(t),this.update("replace",t,r)},r.prototype.onPopState=function(t){var r,n,o,i;return this.shouldHandlePopState()&&(i=null!=(n=t.state)?n.turbolinks:void 0)?(r=e.Location.wrap(window.location),o=i.restorationIdentifier,this.delegate.historyPoppedToLocationWithRestorationIdentifier(r,o)):void 0},r.prototype.onPageLoad=function(t){return e.defer(function(t){return function(){return t.pageLoaded=!0}}(this))},r.prototype.shouldHandlePopState=function(){return this.pageIsLoaded()},r.prototype.pageIsLoaded=function(){return this.pageLoaded||"complete"===document.readyState},r.prototype.update=function(t,e,r){var n;return n={turbolinks:{restorationIdentifier:r}},history[t+"State"](n,null,e)},r}()}.call(this),function(){e.HeadDetails=function(){function t(t){var e,r,n,s,a,u;for(this.elements={},n=0,a=t.length;a>n;n++)u=t[n],u.nodeType===Node.ELEMENT_NODE&&(s=u.outerHTML,r=null!=(e=this.elements)[s]?e[s]:e[s]={type:i(u),tracked:o(u),elements:[]},r.elements.push(u))}var e,r,n,o,i;return t.fromHeadElement=function(t){var e;return new this(null!=(e=null!=t?t.childNodes:void 0)?e:[])},t.prototype.hasElementWithKey=function(t){return t in this.elements},t.prototype.getTrackedElementSignature=function(){var t,e;return function(){var r,n;r=this.elements,n=[];for(t in r)e=r[t].tracked,e&&n.push(t);return n}.call(this).join("")},t.prototype.getScriptElementsNotInDetails=function(t){return this.getElementsMatchingTypeNotInDetails("script",t)},t.prototype.getStylesheetElementsNotInDetails=function(t){return this.getElementsMatchingTypeNotInDetails("stylesheet",t)},t.prototype.getElementsMatchingTypeNotInDetails=function(t,e){var r,n,o,i,s,a;o=this.elements,s=[];for(n in o)i=o[n],a=i.type,r=i.elements,a!==t||e.hasElementWithKey(n)||s.push(r[0]);return s},t.prototype.getProvisionalElements=function(){var t,e,r,n,o,i,s;r=[],n=this.elements;for(e in n)o=n[e],s=o.type,i=o.tracked,t=o.elements,null!=s||i?t.length>1&&r.push.apply(r,t.slice(1)):r.push.apply(r,t);return r},t.prototype.getMetaValue=function(t){var e;return null!=(e=this.findMetaElementByName(t))?e.getAttribute("content"):void 0},t.prototype.findMetaElementByName=function(t){var r,n,o,i;r=void 0,i=this.elements;for(o in i)n=i[o].elements,e(n[0],t)&&(r=n[0]);return r},i=function(t){return r(t)?"script":n(t)?"stylesheet":void 0},o=function(t){return"reload"===t.getAttribute("data-turbolinks-track")},r=function(t){var e;return e=t.tagName.toLowerCase(),"script"===e},n=function(t){var e;return e=t.tagName.toLowerCase(),"style"===e||"link"===e&&"stylesheet"===t.getAttribute("rel")},e=function(t,e){var r;return r=t.tagName.toLowerCase(),"meta"===r&&t.getAttribute("name")===e},t}()}.call(this),function(){e.Snapshot=function(){function t(t,e){this.headDetails=t,this.bodyElement=e}return t.wrap=function(t){return t instanceof this?t:"string"==typeof t?this.fromHTMLString(t):this.fromHTMLElement(t)},t.fromHTMLString=function(t){var e;return e=document.createElement("html"),e.innerHTML=t,this.fromHTMLElement(e)},t.fromHTMLElement=function(t){var r,n,o,i;return o=t.querySelector("head"),r=null!=(i=t.querySelector("body"))?i:document.createElement("body"),n=e.HeadDetails.fromHeadElement(o),new this(n,r)},t.prototype.clone=function(){return new this.constructor(this.headDetails,this.bodyElement.cloneNode(!0))},t.prototype.getRootLocation=function(){var t,r;return r=null!=(t=this.getSetting("root"))?t:"/",new e.Location(r)},t.prototype.getCacheControlValue=function(){return this.getSetting("cache-control")},t.prototype.getElementForAnchor=function(t){try{return this.bodyElement.querySelector("[id='"+t+"'], a[name='"+t+"']")}catch(e){}},t.prototype.getPermanentElements=function(){return this.bodyElement.querySelectorAll("[id][data-turbolinks-permanent]")},t.prototype.getPermanentElementById=function(t){return this.bodyElement.querySelector("#"+t+"[data-turbolinks-permanent]")},t.prototype.getPermanentElementsPresentInSnapshot=function(t){var e,r,n,o,i;for(o=this.getPermanentElements(),i=[],r=0,n=o.length;n>r;r++)e=o[r],t.getPermanentElementById(e.id)&&i.push(e);return i},t.prototype.findFirstAutofocusableElement=function(){return this.bodyElement.querySelector("[autofocus]")},t.prototype.hasAnchor=function(t){return null!=this.getElementForAnchor(t)},t.prototype.isPreviewable=function(){return"no-preview"!==this.getCacheControlValue()},t.prototype.isCacheable=function(){return"no-cache"!==this.getCacheControlValue()},t.prototype.isVisitable=function(){return"reload"!==this.getSetting("visit-control")},t.prototype.getSetting=function(t){return this.headDetails.getMetaValue("turbolinks-"+t)},t}()}.call(this),function(){var t=[].slice;e.Renderer=function(){function e(){}var r;return e.render=function(){var e,r,n,o;return n=arguments[0],r=arguments[1],e=3<=arguments.length?t.call(arguments,2):[],o=function(t,e,r){r.prototype=t.prototype;var n=new r,o=t.apply(n,e);return Object(o)===o?o:n}(this,e,function(){}),o.delegate=n,o.render(r),o},e.prototype.renderView=function(t){return this.delegate.viewWillRender(this.newBody),t(),this.delegate.viewRendered(this.newBody)},e.prototype.invalidateView=function(){return this.delegate.viewInvalidated()},e.prototype.createScriptElement=function(t){var e;return"false"===t.getAttribute("data-turbolinks-eval")?t:(e=document.createElement("script"),e.textContent=t.textContent,e.async=!1,r(e,t),e)},r=function(t,e){var r,n,o,i,s,a,u;for(i=e.attributes,a=[],r=0,n=i.length;n>r;r++)s=i[r],o=s.name,u=s.value,a.push(t.setAttribute(o,u));return a},e}()}.call(this),function(){var t,r,n=function(t,e){function r(){this.constructor=t}for(var n in e)o.call(e,n)&&(t[n]=e[n]);return r.prototype=e.prototype,t.prototype=new r,t.__super__=e.prototype,t},o={}.hasOwnProperty;e.SnapshotRenderer=function(e){function o(t,e,r){this.currentSnapshot=t,this.newSnapshot=e,this.isPreview=r,this.currentHeadDetails=this.currentSnapshot.headDetails,this.newHeadDetails=this.newSnapshot.headDetails,this.currentBody=this.currentSnapshot.bodyElement,this.newBody=this.newSnapshot.bodyElement}return n(o,e),o.prototype.render=function(t){return this.shouldRender()?(this.mergeHead(),this.renderView(function(e){return function(){return e.replaceBody(),e.isPreview||e.focusFirstAutofocusableElement(),t()}}(this))):this.invalidateView()},o.prototype.mergeHead=function(){return this.copyNewHeadStylesheetElements(),this.copyNewHeadScriptElements(),this.removeCurrentHeadProvisionalElements(),this.copyNewHeadProvisionalElements()},o.prototype.replaceBody=function(){var t;return t=this.relocateCurrentBodyPermanentElements(),this.activateNewBodyScriptElements(),this.assignNewBody(),this.replacePlaceholderElementsWithClonedPermanentElements(t)},o.prototype.shouldRender=function(){return this.newSnapshot.isVisitable()&&this.trackedElementsAreIdentical()},o.prototype.trackedElementsAreIdentical=function(){return this.currentHeadDetails.getTrackedElementSignature()===this.newHeadDetails.getTrackedElementSignature()},o.prototype.copyNewHeadStylesheetElements=function(){var t,e,r,n,o;for(n=this.getNewHeadStylesheetElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.appendChild(t));return o},o.prototype.copyNewHeadScriptElements=function(){var t,e,r,n,o;for(n=this.getNewHeadScriptElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.appendChild(this.createScriptElement(t)));return o},o.prototype.removeCurrentHeadProvisionalElements=function(){var t,e,r,n,o;for(n=this.getCurrentHeadProvisionalElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.removeChild(t));return o},o.prototype.copyNewHeadProvisionalElements=function(){var t,e,r,n,o;for(n=this.getNewHeadProvisionalElements(),o=[],e=0,r=n.length;r>e;e++)t=n[e],o.push(document.head.appendChild(t));return o},o.prototype.relocateCurrentBodyPermanentElements=function(){var e,n,o,i,s,a,u;for(a=this.getCurrentBodyPermanentElements(),u=[],e=0,n=a.length;n>e;e++)i=a[e],s=t(i),o=this.newSnapshot.getPermanentElementById(i.id),r(i,s.element),r(o,i),u.push(s);return u},o.prototype.replacePlaceholderElementsWithClonedPermanentElements=function(t){var e,n,o,i,s,a,u;for(u=[],o=0,i=t.length;i>o;o++)a=t[o],n=a.element,s=a.permanentElement,e=s.cloneNode(!0),u.push(r(n,e));return u},o.prototype.activateNewBodyScriptElements=function(){var t,e,n,o,i,s;for(i=this.getNewBodyScriptElements(),s=[],e=0,o=i.length;o>e;e++)n=i[e],t=this.createScriptElement(n),s.push(r(n,t));return s},o.prototype.assignNewBody=function(){return document.body=this.newBody},o.prototype.focusFirstAutofocusableElement=function(){var t;return null!=(t=this.newSnapshot.findFirstAutofocusableElement())?t.focus():void 0},o.prototype.getNewHeadStylesheetElements=function(){return this.newHeadDetails.getStylesheetElementsNotInDetails(this.currentHeadDetails)},o.prototype.getNewHeadScriptElements=function(){return this.newHeadDetails.getScriptElementsNotInDetails(this.currentHeadDetails)},o.prototype.getCurrentHeadProvisionalElements=function(){return this.currentHeadDetails.getProvisionalElements()},o.prototype.getNewHeadProvisionalElements=function(){return this.newHeadDetails.getProvisionalElements()},o.prototype.getCurrentBodyPermanentElements=function(){return this.currentSnapshot.getPermanentElementsPresentInSnapshot(this.newSnapshot)},o.prototype.getNewBodyScriptElements=function(){return this.newBody.querySelectorAll("script")},o}(e.Renderer),t=function(t){var e;return e=document.createElement("meta"),e.setAttribute("name","turbolinks-permanent-placeholder"),e.setAttribute("content",t.id),{element:e,permanentElement:t}},r=function(t,e){var r;return(r=t.parentNode)?r.replaceChild(e,t):void 0}}.call(this),function(){var t=function(t,e){function n(){this.constructor=t}for(var o in e)r.call(e,o)&&(t[o]=e[o]);return n.prototype=e.prototype,t.prototype=new n,t.__super__=e.prototype,t},r={}.hasOwnProperty;e.ErrorRenderer=function(e){function r(t){var e;e=document.createElement("html"),e.innerHTML=t,this.newHead=e.querySelector("head"),this.newBody=e.querySelector("body")}return t(r,e),r.prototype.render=function(t){return this.renderView(function(e){return function(){return e.replaceHeadAndBody(),e.activateBodyScriptElements(),t()}}(this))},r.prototype.replaceHeadAndBody=function(){var t,e;return e=document.head,t=document.body,e.parentNode.replaceChild(this.newHead,e),t.parentNode.replaceChild(this.newBody,t)},r.prototype.activateBodyScriptElements=function(){var t,e,r,n,o,i;for(n=this.getScriptElements(),i=[],e=0,r=n.length;r>e;e++)o=n[e],t=this.createScriptElement(o),i.push(o.parentNode.replaceChild(t,o));return i},r.prototype.getScriptElements=function(){return document.documentElement.querySelectorAll("script")},r}(e.Renderer)}.call(this),function(){e.View=function(){function t(t){this.delegate=t,this.htmlElement=document.documentElement}return t.prototype.getRootLocation=function(){return this.getSnapshot().getRootLocation()},t.prototype.getElementForAnchor=function(t){return this.getSnapshot().getElementForAnchor(t)},t.prototype.getSnapshot=function(){return e.Snapshot.fromHTMLElement(this.htmlElement)},t.prototype.render=function(t,e){var r,n,o;return o=t.snapshot,r=t.error,n=t.isPreview,this.markAsPreview(n),null!=o?this.renderSnapshot(o,n,e):this.renderError(r,e)},t.prototype.markAsPreview=function(t){return t?this.htmlElement.setAttribute("data-turbolinks-preview",""):this.htmlElement.removeAttribute("data-turbolinks-preview")},t.prototype.renderSnapshot=function(t,r,n){return e.SnapshotRenderer.render(this.delegate,n,this.getSnapshot(),e.Snapshot.wrap(t),r)},t.prototype.renderError=function(t,r){return e.ErrorRenderer.render(this.delegate,r,t)},t}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.ScrollManager=function(){function r(r){this.delegate=r,this.onScroll=t(this.onScroll,this),this.onScroll=e.throttle(this.onScroll)}return r.prototype.start=function(){return this.started?void 0:(addEventListener("scroll",this.onScroll,!1),this.onScroll(),this.started=!0)},r.prototype.stop=function(){return this.started?(removeEventListener("scroll",this.onScroll,!1),this.started=!1):void 0},r.prototype.scrollToElement=function(t){return t.scrollIntoView()},r.prototype.scrollToPosition=function(t){var e,r;return e=t.x,r=t.y,window.scrollTo(e,r)},r.prototype.onScroll=function(t){return this.updatePosition({x:window.pageXOffset,y:window.pageYOffset})},r.prototype.updatePosition=function(t){var e;return this.position=t,null!=(e=this.delegate)?e.scrollPositionChanged(this.position):void 0},r}()}.call(this),function(){e.SnapshotCache=function(){function t(t){this.size=t,this.keys=[],this.snapshots={}}var r;return t.prototype.has=function(t){var e;return e=r(t),e in this.snapshots},t.prototype.get=function(t){var e;if(this.has(t))return e=this.read(t),this.touch(t),e},t.prototype.put=function(t,e){return this.write(t,e),this.touch(t),e},t.prototype.read=function(t){var e;return e=r(t),this.snapshots[e]},t.prototype.write=function(t,e){var n;return n=r(t),this.snapshots[n]=e},t.prototype.touch=function(t){var e,n;return n=r(t),e=this.keys.indexOf(n),e>-1&&this.keys.splice(e,1),this.keys.unshift(n),this.trim()},t.prototype.trim=function(){var t,e,r,n,o;for(n=this.keys.splice(this.size),o=[],t=0,r=n.length;r>t;t++)e=n[t],o.push(delete this.snapshots[e]);return o},r=function(t){return e.Location.wrap(t).toCacheKey()},t}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.Visit=function(){function r(r,n,o){this.controller=r,this.action=o,this.performScroll=t(this.performScroll,this),this.identifier=e.uuid(),this.location=e.Location.wrap(n),this.adapter=this.controller.adapter,this.state="initialized",this.timingMetrics={}}var n;return r.prototype.start=function(){return"initialized"===this.state?(this.recordTimingMetric("visitStart"),this.state="started",this.adapter.visitStarted(this)):void 0},r.prototype.cancel=function(){var t;return"started"===this.state?(null!=(t=this.request)&&t.cancel(),this.cancelRender(),this.state="canceled"):void 0},r.prototype.complete=function(){var t;return"started"===this.state?(this.recordTimingMetric("visitEnd"),this.state="completed","function"==typeof(t=this.adapter).visitCompleted&&t.visitCompleted(this),this.controller.visitCompleted(this)):void 0},r.prototype.fail=function(){var t;return"started"===this.state?(this.state="failed","function"==typeof(t=this.adapter).visitFailed?t.visitFailed(this):void 0):void 0},r.prototype.changeHistory=function(){var t,e;return this.historyChanged?void 0:(t=this.location.isEqualTo(this.referrer)?"replace":this.action,e=n(t),this.controller[e](this.location,this.restorationIdentifier),this.historyChanged=!0)},r.prototype.issueRequest=function(){return this.shouldIssueRequest()&&null==this.request?(this.progress=0,this.request=new e.HttpRequest(this,this.location,this.referrer),this.request.send()):void 0},r.prototype.getCachedSnapshot=function(){var t;return!(t=this.controller.getCachedSnapshotForLocation(this.location))||null!=this.location.anchor&&!t.hasAnchor(this.location.anchor)||"restore"!==this.action&&!t.isPreviewable()?void 0:t},r.prototype.hasCachedSnapshot=function(){return null!=this.getCachedSnapshot()},r.prototype.loadCachedSnapshot=function(){var t,e;return(e=this.getCachedSnapshot())?(t=this.shouldIssueRequest(),this.render(function(){var r;return this.cacheSnapshot(),this.controller.render({snapshot:e,isPreview:t},this.performScroll),"function"==typeof(r=this.adapter).visitRendered&&r.visitRendered(this),t?void 0:this.complete()})):void 0},r.prototype.loadResponse=function(){return null!=this.response?this.render(function(){var t,e;return this.cacheSnapshot(),this.request.failed?(this.controller.render({error:this.response},this.performScroll),"function"==typeof(t=this.adapter).visitRendered&&t.visitRendered(this),this.fail()):(this.controller.render({snapshot:this.response},this.performScroll),"function"==typeof(e=this.adapter).visitRendered&&e.visitRendered(this),this.complete())}):void 0},r.prototype.followRedirect=function(){return this.redirectedToLocation&&!this.followedRedirect?(this.location=this.redirectedToLocation,this.controller.replaceHistoryWithLocationAndRestorationIdentifier(this.redirectedToLocation,this.restorationIdentifier),this.followedRedirect=!0):void 0},r.prototype.requestStarted=function(){var t;return this.recordTimingMetric("requestStart"),"function"==typeof(t=this.adapter).visitRequestStarted?t.visitRequestStarted(this):void 0},r.prototype.requestProgressed=function(t){var e;return this.progress=t,"function"==typeof(e=this.adapter).visitRequestProgressed?e.visitRequestProgressed(this):void 0},r.prototype.requestCompletedWithResponse=function(t,r){return this.response=t,null!=r&&(this.redirectedToLocation=e.Location.wrap(r)),this.adapter.visitRequestCompleted(this)},r.prototype.requestFailedWithStatusCode=function(t,e){return this.response=e,this.adapter.visitRequestFailedWithStatusCode(this,t)},r.prototype.requestFinished=function(){var t;return this.recordTimingMetric("requestEnd"),"function"==typeof(t=this.adapter).visitRequestFinished?t.visitRequestFinished(this):void 0},r.prototype.performScroll=function(){return this.scrolled?void 0:("restore"===this.action?this.scrollToRestoredPosition()||this.scrollToTop():this.scrollToAnchor()||this.scrollToTop(),this.scrolled=!0)},r.prototype.scrollToRestoredPosition=function(){var t,e;return t=null!=(e=this.restorationData)?e.scrollPosition:void 0,null!=t?(this.controller.scrollToPosition(t),!0):void 0},r.prototype.scrollToAnchor=function(){return null!=this.location.anchor?(this.controller.scrollToAnchor(this.location.anchor),!0):void 0},r.prototype.scrollToTop=function(){return this.controller.scrollToPosition({x:0,y:0})},r.prototype.recordTimingMetric=function(t){var e;return null!=(e=this.timingMetrics)[t]?e[t]:e[t]=(new Date).getTime()},r.prototype.getTimingMetrics=function(){return e.copyObject(this.timingMetrics)},n=function(t){switch(t){case"replace":return"replaceHistoryWithLocationAndRestorationIdentifier";case"advance":case"restore":return"pushHistoryWithLocationAndRestorationIdentifier"}},r.prototype.shouldIssueRequest=function(){return"restore"===this.action?!this.hasCachedSnapshot():!0},r.prototype.cacheSnapshot=function(){return this.snapshotCached?void 0:(this.controller.cacheSnapshot(),this.snapshotCached=!0)},r.prototype.render=function(t){return this.cancelRender(),this.frame=requestAnimationFrame(function(e){return function(){return e.frame=null,t.call(e)}}(this))},r.prototype.cancelRender=function(){return this.frame?cancelAnimationFrame(this.frame):void 0},r}()}.call(this),function(){var t=function(t,e){return function(){return t.apply(e,arguments)}};e.Controller=function(){function r(){this.clickBubbled=t(this.clickBubbled,this),this.clickCaptured=t(this.clickCaptured,this),this.pageLoaded=t(this.pageLoaded,this),this.history=new e.History(this),this.view=new e.View(this),this.scrollManager=new e.ScrollManager(this),this.restorationData={},this.clearCache(),this.setProgressBarDelay(500)}return r.prototype.start=function(){return e.supported&&!this.started?(addEventListener("click",this.clickCaptured,!0),addEventListener("DOMContentLoaded",this.pageLoaded,!1),this.scrollManager.start(),this.startHistory(),this.started=!0,this.enabled=!0):void 0},r.prototype.disable=function(){return this.enabled=!1},r.prototype.stop=function(){return this.started?(removeEventListener("click",this.clickCaptured,!0),removeEventListener("DOMContentLoaded",this.pageLoaded,!1),this.scrollManager.stop(),this.stopHistory(),this.started=!1):void 0},r.prototype.clearCache=function(){return this.cache=new e.SnapshotCache(10)},r.prototype.visit=function(t,r){var n,o;return null==r&&(r={}),t=e.Location.wrap(t),this.applicationAllowsVisitingLocation(t)?this.locationIsVisitable(t)?(n=null!=(o=r.action)?o:"advance",this.adapter.visitProposedToLocationWithAction(t,n)):window.location=t:void 0},r.prototype.startVisitToLocationWithAction=function(t,r,n){var o;return e.supported?(o=this.getRestorationDataForIdentifier(n),this.startVisit(t,r,{restorationData:o})):window.location=t},r.prototype.setProgressBarDelay=function(t){return this.progressBarDelay=t},r.prototype.startHistory=function(){return this.location=e.Location.wrap(window.location),this.restorationIdentifier=e.uuid(),this.history.start(),this.history.replace(this.location,this.restorationIdentifier)},r.prototype.stopHistory=function(){return this.history.stop()},r.prototype.pushHistoryWithLocationAndRestorationIdentifier=function(t,r){return this.restorationIdentifier=r,this.location=e.Location.wrap(t),this.history.push(this.location,this.restorationIdentifier)},r.prototype.replaceHistoryWithLocationAndRestorationIdentifier=function(t,r){return this.restorationIdentifier=r,this.location=e.Location.wrap(t),this.history.replace(this.location,this.restorationIdentifier)},r.prototype.historyPoppedToLocationWithRestorationIdentifier=function(t,r){var n;return this.restorationIdentifier=r,this.enabled?(n=this.getRestorationDataForIdentifier(this.restorationIdentifier),this.startVisit(t,"restore",{restorationIdentifier:this.restorationIdentifier,restorationData:n,historyChanged:!0}),this.location=e.Location.wrap(t)):this.adapter.pageInvalidated()},r.prototype.getCachedSnapshotForLocation=function(t){var e;return null!=(e=this.cache.get(t))?e.clone():void 0},r.prototype.shouldCacheSnapshot=function(){return this.view.getSnapshot().isCacheable();
+},r.prototype.cacheSnapshot=function(){var t,r;return this.shouldCacheSnapshot()?(this.notifyApplicationBeforeCachingSnapshot(),r=this.view.getSnapshot(),t=this.lastRenderedLocation,e.defer(function(e){return function(){return e.cache.put(t,r.clone())}}(this))):void 0},r.prototype.scrollToAnchor=function(t){var e;return(e=this.view.getElementForAnchor(t))?this.scrollToElement(e):this.scrollToPosition({x:0,y:0})},r.prototype.scrollToElement=function(t){return this.scrollManager.scrollToElement(t)},r.prototype.scrollToPosition=function(t){return this.scrollManager.scrollToPosition(t)},r.prototype.scrollPositionChanged=function(t){var e;return e=this.getCurrentRestorationData(),e.scrollPosition=t},r.prototype.render=function(t,e){return this.view.render(t,e)},r.prototype.viewInvalidated=function(){return this.adapter.pageInvalidated()},r.prototype.viewWillRender=function(t){return this.notifyApplicationBeforeRender(t)},r.prototype.viewRendered=function(){return this.lastRenderedLocation=this.currentVisit.location,this.notifyApplicationAfterRender()},r.prototype.pageLoaded=function(){return this.lastRenderedLocation=this.location,this.notifyApplicationAfterPageLoad()},r.prototype.clickCaptured=function(){return removeEventListener("click",this.clickBubbled,!1),addEventListener("click",this.clickBubbled,!1)},r.prototype.clickBubbled=function(t){var e,r,n;return this.enabled&&this.clickEventIsSignificant(t)&&(r=this.getVisitableLinkForNode(t.target))&&(n=this.getVisitableLocationForLink(r))&&this.applicationAllowsFollowingLinkToLocation(r,n)?(t.preventDefault(),e=this.getActionForLink(r),this.visit(n,{action:e})):void 0},r.prototype.applicationAllowsFollowingLinkToLocation=function(t,e){var r;return r=this.notifyApplicationAfterClickingLinkToLocation(t,e),!r.defaultPrevented},r.prototype.applicationAllowsVisitingLocation=function(t){var e;return e=this.notifyApplicationBeforeVisitingLocation(t),!e.defaultPrevented},r.prototype.notifyApplicationAfterClickingLinkToLocation=function(t,r){return e.dispatch("turbolinks:click",{target:t,data:{url:r.absoluteURL},cancelable:!0})},r.prototype.notifyApplicationBeforeVisitingLocation=function(t){return e.dispatch("turbolinks:before-visit",{data:{url:t.absoluteURL},cancelable:!0})},r.prototype.notifyApplicationAfterVisitingLocation=function(t){return e.dispatch("turbolinks:visit",{data:{url:t.absoluteURL}})},r.prototype.notifyApplicationBeforeCachingSnapshot=function(){return e.dispatch("turbolinks:before-cache")},r.prototype.notifyApplicationBeforeRender=function(t){return e.dispatch("turbolinks:before-render",{data:{newBody:t}})},r.prototype.notifyApplicationAfterRender=function(){return e.dispatch("turbolinks:render")},r.prototype.notifyApplicationAfterPageLoad=function(t){return null==t&&(t={}),e.dispatch("turbolinks:load",{data:{url:this.location.absoluteURL,timing:t}})},r.prototype.startVisit=function(t,e,r){var n;return null!=(n=this.currentVisit)&&n.cancel(),this.currentVisit=this.createVisit(t,e,r),this.currentVisit.start(),this.notifyApplicationAfterVisitingLocation(t)},r.prototype.createVisit=function(t,r,n){var o,i,s,a,u;return i=null!=n?n:{},a=i.restorationIdentifier,s=i.restorationData,o=i.historyChanged,u=new e.Visit(this,t,r),u.restorationIdentifier=null!=a?a:e.uuid(),u.restorationData=e.copyObject(s),u.historyChanged=o,u.referrer=this.location,u},r.prototype.visitCompleted=function(t){return this.notifyApplicationAfterPageLoad(t.getTimingMetrics())},r.prototype.clickEventIsSignificant=function(t){return!(t.defaultPrevented||t.target.isContentEditable||t.which>1||t.altKey||t.ctrlKey||t.metaKey||t.shiftKey)},r.prototype.getVisitableLinkForNode=function(t){return this.nodeIsVisitable(t)?e.closest(t,"a[href]:not([target]):not([download])"):void 0},r.prototype.getVisitableLocationForLink=function(t){var r;return r=new e.Location(t.getAttribute("href")),this.locationIsVisitable(r)?r:void 0},r.prototype.getActionForLink=function(t){var e;return null!=(e=t.getAttribute("data-turbolinks-action"))?e:"advance"},r.prototype.nodeIsVisitable=function(t){var r;return(r=e.closest(t,"[data-turbolinks]"))?"false"!==r.getAttribute("data-turbolinks"):!0},r.prototype.locationIsVisitable=function(t){return t.isPrefixedBy(this.view.getRootLocation())&&t.isHTML()},r.prototype.getCurrentRestorationData=function(){return this.getRestorationDataForIdentifier(this.restorationIdentifier)},r.prototype.getRestorationDataForIdentifier=function(t){var e;return null!=(e=this.restorationData)[t]?e[t]:e[t]={}},r}()}.call(this),function(){!function(){var t,e;if((t=e=document.currentScript)&&!e.hasAttribute("data-turbolinks-suppress-warning"))for(;t=t.parentNode;)if(t===document.body)return console.warn("You are loading Turbolinks from a <script> element inside the <body> element. This is probably not what you meant to do!\n\nLoad your application\u2019s JavaScript bundle inside the <head> element instead. <script> elements in <body> are evaluated with each page change.\n\nFor more information, see: https://github.com/turbolinks/turbolinks#working-with-script-elements\n\n\u2014\u2014\nSuppress this warning by adding a `data-turbolinks-suppress-warning` attribute to: %s",e.outerHTML)}()}.call(this),function(){var t,r,n;e.start=function(){return r()?(null==e.controller&&(e.controller=t()),e.controller.start()):void 0},r=function(){return null==window.Turbolinks&&(window.Turbolinks=e),n()},t=function(){var t;return t=new e.Controller,t.adapter=new e.BrowserAdapter(t),t},n=function(){return window.Turbolinks===e},n()&&e.start()}.call(this)}).call(this),"object"==typeof module&&module.exports?module.exports=e:"function"==typeof define&&define.amd&&define(e)}).call(this);
+/*!
+ * jQuery JavaScript Library v3.4.1
+ * https://jquery.com/
+ *
+ * Includes Sizzle.js
+ * https://sizzlejs.com/
+ *
+ * Copyright JS Foundation and other contributors
+ * Released under the MIT license
+ * https://jquery.org/license
+ *
+ * Date: 2019-05-01T21:04Z
+ */
+
+( function( global, factory ) {
+
+	"use strict";
+
+	if ( typeof module === "object" && typeof module.exports === "object" ) {
+
+		// For CommonJS and CommonJS-like environments where a proper `window`
+		// is present, execute the factory and get jQuery.
+		// For environments that do not have a `window` with a `document`
+		// (such as Node.js), expose a factory as module.exports.
+		// This accentuates the need for the creation of a real `window`.
+		// e.g. var jQuery = require("jquery")(window);
+		// See ticket #14549 for more info.
+		module.exports = global.document ?
+			factory( global, true ) :
+			function( w ) {
+				if ( !w.document ) {
+					throw new Error( "jQuery requires a window with a document" );
+				}
+				return factory( w );
+			};
+	} else {
+		factory( global );
+	}
+
+// Pass this if window is not defined yet
+} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {
+
+// Edge <= 12 - 13+, Firefox <=18 - 45+, IE 10 - 11, Safari 5.1 - 9+, iOS 6 - 9.1
+// throw exceptions when non-strict code (e.g., ASP.NET 4.5) accesses strict mode
+// arguments.callee.caller (trac-13335). But as of jQuery 3.0 (2016), strict mode should be common
+// enough that all such attempts are guarded in a try block.
+"use strict";
+
+var arr = [];
+
+var document = window.document;
+
+var getProto = Object.getPrototypeOf;
+
+var slice = arr.slice;
+
+var concat = arr.concat;
+
+var push = arr.push;
+
+var indexOf = arr.indexOf;
+
+var class2type = {};
+
+var toString = class2type.toString;
+
+var hasOwn = class2type.hasOwnProperty;
+
+var fnToString = hasOwn.toString;
+
+var ObjectFunctionString = fnToString.call( Object );
+
+var support = {};
+
+var isFunction = function isFunction( obj ) {
+
+      // Support: Chrome <=57, Firefox <=52
+      // In some browsers, typeof returns "function" for HTML <object> elements
+      // (i.e., `typeof document.createElement( "object" ) === "function"`).
+      // We don't want to classify *any* DOM node as a function.
+      return typeof obj === "function" && typeof obj.nodeType !== "number";
+  };
+
+
+var isWindow = function isWindow( obj ) {
+		return obj != null && obj === obj.window;
+	};
+
+
+
+
+	var preservedScriptAttributes = {
+		type: true,
+		src: true,
+		nonce: true,
+		noModule: true
+	};
+
+	function DOMEval( code, node, doc ) {
+		doc = doc || document;
+
+		var i, val,
+			script = doc.createElement( "script" );
+
+		script.text = code;
+		if ( node ) {
+			for ( i in preservedScriptAttributes ) {
+
+				// Support: Firefox 64+, Edge 18+
+				// Some browsers don't support the "nonce" property on scripts.
+				// On the other hand, just using `getAttribute` is not enough as
+				// the `nonce` attribute is reset to an empty string whenever it
+				// becomes browsing-context connected.
+				// See https://github.com/whatwg/html/issues/2369
+				// See https://html.spec.whatwg.org/#nonce-attributes
+				// The `node.getAttribute` check was added for the sake of
+				// `jQuery.globalEval` so that it can fake a nonce-containing node
+				// via an object.
+				val = node[ i ] || node.getAttribute && node.getAttribute( i );
+				if ( val ) {
+					script.setAttribute( i, val );
+				}
+			}
+		}
+		doc.head.appendChild( script ).parentNode.removeChild( script );
+	}
+
+
+function toType( obj ) {
+	if ( obj == null ) {
+		return obj + "";
+	}
+
+	// Support: Android <=2.3 only (functionish RegExp)
+	return typeof obj === "object" || typeof obj === "function" ?
+		class2type[ toString.call( obj ) ] || "object" :
+		typeof obj;
+}
+/* global Symbol */
+// Defining this global in .eslintrc.json would create a danger of using the global
+// unguarded in another place, it seems safer to define global only for this module
+
+
+
+var
+	version = "3.4.1",
+
+	// Define a local copy of jQuery
+	jQuery = function( selector, context ) {
+
+		// The jQuery object is actually just the init constructor 'enhanced'
+		// Need init if jQuery is called (just allow error to be thrown if not included)
+		return new jQuery.fn.init( selector, context );
+	},
+
+	// Support: Android <=4.0 only
+	// Make sure we trim BOM and NBSP
+	rtrim = /^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g;
+
+jQuery.fn = jQuery.prototype = {
+
+	// The current version of jQuery being used
+	jquery: version,
+
+	constructor: jQuery,
+
+	// The default length of a jQuery object is 0
+	length: 0,
+
+	toArray: function() {
+		return slice.call( this );
+	},
+
+	// Get the Nth element in the matched element set OR
+	// Get the whole matched element set as a clean array
+	get: function( num ) {
+
+		// Return all the elements in a clean array
+		if ( num == null ) {
+			return slice.call( this );
+		}
+
+		// Return just the one element from the set
+		return num < 0 ? this[ num + this.length ] : this[ num ];
+	},
+
+	// Take an array of elements and push it onto the stack
+	// (returning the new matched element set)
+	pushStack: function( elems ) {
+
+		// Build a new jQuery matched element set
+		var ret = jQuery.merge( this.constructor(), elems );
+
+		// Add the old object onto the stack (as a reference)
+		ret.prevObject = this;
+
+		// Return the newly-formed element set
+		return ret;
+	},
+
+	// Execute a callback for every element in the matched set.
+	each: function( callback ) {
+		return jQuery.each( this, callback );
+	},
+
+	map: function( callback ) {
+		return this.pushStack( jQuery.map( this, function( elem, i ) {
+			return callback.call( elem, i, elem );
+		} ) );
+	},
+
+	slice: function() {
+		return this.pushStack( slice.apply( this, arguments ) );
+	},
+
+	first: function() {
+		return this.eq( 0 );
+	},
+
+	last: function() {
+		return this.eq( -1 );
+	},
+
+	eq: function( i ) {
+		var len = this.length,
+			j = +i + ( i < 0 ? len : 0 );
+		return this.pushStack( j >= 0 && j < len ? [ this[ j ] ] : [] );
+	},
+
+	end: function() {
+		return this.prevObject || this.constructor();
+	},
+
+	// For internal use only.
+	// Behaves like an Array's method, not like a jQuery method.
+	push: push,
+	sort: arr.sort,
+	splice: arr.splice
+};
+
+jQuery.extend = jQuery.fn.extend = function() {
+	var options, name, src, copy, copyIsArray, clone,
+		target = arguments[ 0 ] || {},
+		i = 1,
+		length = arguments.length,
+		deep = false;
+
+	// Handle a deep copy situation
+	if ( typeof target === "boolean" ) {
+		deep = target;
+
+		// Skip the boolean and the target
+		target = arguments[ i ] || {};
+		i++;
+	}
+
+	// Handle case when target is a string or something (possible in deep copy)
+	if ( typeof target !== "object" && !isFunction( target ) ) {
+		target = {};
+	}
+
+	// Extend jQuery itself if only one argument is passed
+	if ( i === length ) {
+		target = this;
+		i--;
+	}
+
+	for ( ; i < length; i++ ) {
+
+		// Only deal with non-null/undefined values
+		if ( ( options = arguments[ i ] ) != null ) {
+
+			// Extend the base object
+			for ( name in options ) {
+				copy = options[ name ];
+
+				// Prevent Object.prototype pollution
+				// Prevent never-ending loop
+				if ( name === "__proto__" || target === copy ) {
+					continue;
+				}
+
+				// Recurse if we're merging plain objects or arrays
+				if ( deep && copy && ( jQuery.isPlainObject( copy ) ||
+					( copyIsArray = Array.isArray( copy ) ) ) ) {
+					src = target[ name ];
+
+					// Ensure proper type for the source value
+					if ( copyIsArray && !Array.isArray( src ) ) {
+						clone = [];
+					} else if ( !copyIsArray && !jQuery.isPlainObject( src ) ) {
+						clone = {};
+					} else {
+						clone = src;
+					}
+					copyIsArray = false;
+
+					// Never move original objects, clone them
+					target[ name ] = jQuery.extend( deep, clone, copy );
+
+				// Don't bring in undefined values
+				} else if ( copy !== undefined ) {
+					target[ name ] = copy;
+				}
+			}
+		}
+	}
+
+	// Return the modified object
+	return target;
+};
+
+jQuery.extend( {
+
+	// Unique for each copy of jQuery on the page
+	expando: "jQuery" + ( version + Math.random() ).replace( /\D/g, "" ),
+
+	// Assume jQuery is ready without the ready module
+	isReady: true,
+
+	error: function( msg ) {
+		throw new Error( msg );
+	},
+
+	noop: function() {},
+
+	isPlainObject: function( obj ) {
+		var proto, Ctor;
+
+		// Detect obvious negatives
+		// Use toString instead of jQuery.type to catch host objects
+		if ( !obj || toString.call( obj ) !== "[object Object]" ) {
+			return false;
+		}
+
+		proto = getProto( obj );
+
+		// Objects with no prototype (e.g., `Object.create( null )`) are plain
+		if ( !proto ) {
+			return true;
+		}
+
+		// Objects with prototype are plain iff they were constructed by a global Object function
+		Ctor = hasOwn.call( proto, "constructor" ) && proto.constructor;
+		return typeof Ctor === "function" && fnToString.call( Ctor ) === ObjectFunctionString;
+	},
+
+	isEmptyObject: function( obj ) {
+		var name;
+
+		for ( name in obj ) {
+			return false;
+		}
+		return true;
+	},
+
+	// Evaluates a script in a global context
+	globalEval: function( code, options ) {
+		DOMEval( code, { nonce: options && options.nonce } );
+	},
+
+	each: function( obj, callback ) {
+		var length, i = 0;
+
+		if ( isArrayLike( obj ) ) {
+			length = obj.length;
+			for ( ; i < length; i++ ) {
+				if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
+					break;
+				}
+			}
+		} else {
+			for ( i in obj ) {
+				if ( callback.call( obj[ i ], i, obj[ i ] ) === false ) {
+					break;
+				}
+			}
+		}
+
+		return obj;
+	},
+
+	// Support: Android <=4.0 only
+	trim: function( text ) {
+		return text == null ?
+			"" :
+			( text + "" ).replace( rtrim, "" );
+	},
+
+	// results is for internal usage only
+	makeArray: function( arr, results ) {
+		var ret = results || [];
+
+		if ( arr != null ) {
+			if ( isArrayLike( Object( arr ) ) ) {
+				jQuery.merge( ret,
+					typeof arr === "string" ?
+					[ arr ] : arr
+				);
+			} else {
+				push.call( ret, arr );
+			}
+		}
+
+		return ret;
+	},
+
+	inArray: function( elem, arr, i ) {
+		return arr == null ? -1 : indexOf.call( arr, elem, i );
+	},
+
+	// Support: Android <=4.0 only, PhantomJS 1 only
+	// push.apply(_, arraylike) throws on ancient WebKit
+	merge: function( first, second ) {
+		var len = +second.length,
+			j = 0,
+			i = first.length;
+
+		for ( ; j < len; j++ ) {
+			first[ i++ ] = second[ j ];
+		}
+
+		first.length = i;
+
+		return first;
+	},
+
+	grep: function( elems, callback, invert ) {
+		var callbackInverse,
+			matches = [],
+			i = 0,
+			length = elems.length,
+			callbackExpect = !invert;
+
+		// Go through the array, only saving the items
+		// that pass the validator function
+		for ( ; i < length; i++ ) {
+			callbackInverse = !callback( elems[ i ], i );
+			if ( callbackInverse !== callbackExpect ) {
+				matches.push( elems[ i ] );
+			}
+		}
+
+		return matches;
+	},
+
+	// arg is for internal usage only
+	map: function( elems, callback, arg ) {
+		var length, value,
+			i = 0,
+			ret = [];
+
+		// Go through the array, translating each of the items to their new values
+		if ( isArrayLike( elems ) ) {
+			length = elems.length;
+			for ( ; i < length; i++ ) {
+				value = callback( elems[ i ], i, arg );
+
+				if ( value != null ) {
+					ret.push( value );
+				}
+			}
+
+		// Go through every key on the object,
+		} else {
+			for ( i in elems ) {
+				value = callback( elems[ i ], i, arg );
+
+				if ( value != null ) {
+					ret.push( value );
+				}
+			}
+		}
+
+		// Flatten any nested arrays
+		return concat.apply( [], ret );
+	},
+
+	// A global GUID counter for objects
+	guid: 1,
+
+	// jQuery.support is not used in Core but other projects attach their
+	// properties to it so it needs to exist.
+	support: support
+} );
+
+if ( typeof Symbol === "function" ) {
+	jQuery.fn[ Symbol.iterator ] = arr[ Symbol.iterator ];
+}
+
+// Populate the class2type map
+jQuery.each( "Boolean Number String Function Array Date RegExp Object Error Symbol".split( " " ),
+function( i, name ) {
+	class2type[ "[object " + name + "]" ] = name.toLowerCase();
+} );
+
+function isArrayLike( obj ) {
+
+	// Support: real iOS 8.2 only (not reproducible in simulator)
+	// `in` check used to prevent JIT error (gh-2145)
+	// hasOwn isn't used here due to false negatives
+	// regarding Nodelist length in IE
+	var length = !!obj && "length" in obj && obj.length,
+		type = toType( obj );
+
+	if ( isFunction( obj ) || isWindow( obj ) ) {
+		return false;
+	}
+
+	return type === "array" || length === 0 ||
+		typeof length === "number" && length > 0 && ( length - 1 ) in obj;
+}
+var Sizzle =
+/*!
+ * Sizzle CSS Selector Engine v2.3.4
+ * https://sizzlejs.com/
+ *
+ * Copyright JS Foundation and other contributors
+ * Released under the MIT license
+ * https://js.foundation/
+ *
+ * Date: 2019-04-08
+ */
+(function( window ) {
+
+var i,
+	support,
+	Expr,
+	getText,
+	isXML,
+	tokenize,
+	compile,
+	select,
+	outermostContext,
+	sortInput,
+	hasDuplicate,
+
+	// Local document vars
+	setDocument,
+	document,
+	docElem,
+	documentIsHTML,
+	rbuggyQSA,
+	rbuggyMatches,
+	matches,
+	contains,
+
+	// Instance-specific data
+	expando = "sizzle" + 1 * new Date(),
+	preferredDoc = window.document,
+	dirruns = 0,
+	done = 0,
+	classCache = createCache(),
+	tokenCache = createCache(),
+	compilerCache = createCache(),
+	nonnativeSelectorCache = createCache(),
+	sortOrder = function( a, b ) {
+		if ( a === b ) {
+			hasDuplicate = true;
+		}
+		return 0;
+	},
+
+	// Instance methods
+	hasOwn = ({}).hasOwnProperty,
+	arr = [],
+	pop = arr.pop,
+	push_native = arr.push,
+	push = arr.push,
+	slice = arr.slice,
+	// Use a stripped-down indexOf as it's faster than native
+	// https://jsperf.com/thor-indexof-vs-for/5
+	indexOf = function( list, elem ) {
+		var i = 0,
+			len = list.length;
+		for ( ; i < len; i++ ) {
+			if ( list[i] === elem ) {
+				return i;
+			}
+		}
+		return -1;
+	},
+
+	booleans = "checked|selected|async|autofocus|autoplay|controls|defer|disabled|hidden|ismap|loop|multiple|open|readonly|required|scoped",
+
+	// Regular expressions
+
+	// http://www.w3.org/TR/css3-selectors/#whitespace
+	whitespace = "[\\x20\\t\\r\\n\\f]",
+
+	// http://www.w3.org/TR/CSS21/syndata.html#value-def-identifier
+	identifier = "(?:\\\\.|[\\w-]|[^\0-\\xa0])+",
+
+	// Attribute selectors: http://www.w3.org/TR/selectors/#attribute-selectors
+	attributes = "\\[" + whitespace + "*(" + identifier + ")(?:" + whitespace +
+		// Operator (capture 2)
+		"*([*^$|!~]?=)" + whitespace +
+		// "Attribute values must be CSS identifiers [capture 5] or strings [capture 3 or capture 4]"
+		"*(?:'((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\"|(" + identifier + "))|)" + whitespace +
+		"*\\]",
+
+	pseudos = ":(" + identifier + ")(?:\\((" +
+		// To reduce the number of selectors needing tokenize in the preFilter, prefer arguments:
+		// 1. quoted (capture 3; capture 4 or capture 5)
+		"('((?:\\\\.|[^\\\\'])*)'|\"((?:\\\\.|[^\\\\\"])*)\")|" +
+		// 2. simple (capture 6)
+		"((?:\\\\.|[^\\\\()[\\]]|" + attributes + ")*)|" +
+		// 3. anything else (capture 2)
+		".*" +
+		")\\)|)",
+
+	// Leading and non-escaped trailing whitespace, capturing some non-whitespace characters preceding the latter
+	rwhitespace = new RegExp( whitespace + "+", "g" ),
+	rtrim = new RegExp( "^" + whitespace + "+|((?:^|[^\\\\])(?:\\\\.)*)" + whitespace + "+$", "g" ),
+
+	rcomma = new RegExp( "^" + whitespace + "*," + whitespace + "*" ),
+	rcombinators = new RegExp( "^" + whitespace + "*([>+~]|" + whitespace + ")" + whitespace + "*" ),
+	rdescend = new RegExp( whitespace + "|>" ),
+
+	rpseudo = new RegExp( pseudos ),
+	ridentifier = new RegExp( "^" + identifier + "$" ),
+
+	matchExpr = {
+		"ID": new RegExp( "^#(" + identifier + ")" ),
+		"CLASS": new RegExp( "^\\.(" + identifier + ")" ),
+		"TAG": new RegExp( "^(" + identifier + "|[*])" ),
+		"ATTR": new RegExp( "^" + attributes ),
+		"PSEUDO": new RegExp( "^" + pseudos ),
+		"CHILD": new RegExp( "^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\(" + whitespace +
+			"*(even|odd|(([+-]|)(\\d*)n|)" + whitespace + "*(?:([+-]|)" + whitespace +
+			"*(\\d+)|))" + whitespace + "*\\)|)", "i" ),
+		"bool": new RegExp( "^(?:" + booleans + ")$", "i" ),
+		// For use in libraries implementing .is()
+		// We use this for POS matching in `select`
+		"needsContext": new RegExp( "^" + whitespace + "*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\(" +
+			whitespace + "*((?:-\\d)?\\d*)" + whitespace + "*\\)|)(?=[^-]|$)", "i" )
+	},
+
+	rhtml = /HTML$/i,
+	rinputs = /^(?:input|select|textarea|button)$/i,
+	rheader = /^h\d$/i,
+
+	rnative = /^[^{]+\{\s*\[native \w/,
+
+	// Easily-parseable/retrievable ID or TAG or CLASS selectors
+	rquickExpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,
+
+	rsibling = /[+~]/,
+
+	// CSS escapes
+	// http://www.w3.org/TR/CSS21/syndata.html#escaped-characters
+	runescape = new RegExp( "\\\\([\\da-f]{1,6}" + whitespace + "?|(" + whitespace + ")|.)", "ig" ),
+	funescape = function( _, escaped, escapedWhitespace ) {
+		var high = "0x" + escaped - 0x10000;
+		// NaN means non-codepoint
+		// Support: Firefox<24
+		// Workaround erroneous numeric interpretation of +"0x"
+		return high !== high || escapedWhitespace ?
+			escaped :
+			high < 0 ?
+				// BMP codepoint
+				String.fromCharCode( high + 0x10000 ) :
+				// Supplemental Plane codepoint (surrogate pair)
+				String.fromCharCode( high >> 10 | 0xD800, high & 0x3FF | 0xDC00 );
+	},
+
+	// CSS string/identifier serialization
+	// https://drafts.csswg.org/cssom/#common-serializing-idioms
+	rcssescape = /([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,
+	fcssescape = function( ch, asCodePoint ) {
+		if ( asCodePoint ) {
+
+			// U+0000 NULL becomes U+FFFD REPLACEMENT CHARACTER
+			if ( ch === "\0" ) {
+				return "\uFFFD";
+			}
+
+			// Control characters and (dependent upon position) numbers get escaped as code points
+			return ch.slice( 0, -1 ) + "\\" + ch.charCodeAt( ch.length - 1 ).toString( 16 ) + " ";
+		}
+
+		// Other potentially-special ASCII characters get backslash-escaped
+		return "\\" + ch;
+	},
+
+	// Used for iframes
+	// See setDocument()
+	// Removing the function wrapper causes a "Permission Denied"
+	// error in IE
+	unloadHandler = function() {
+		setDocument();
+	},
+
+	inDisabledFieldset = addCombinator(
+		function( elem ) {
+			return elem.disabled === true && elem.nodeName.toLowerCase() === "fieldset";
+		},
+		{ dir: "parentNode", next: "legend" }
+	);
+
+// Optimize for push.apply( _, NodeList )
+try {
+	push.apply(
+		(arr = slice.call( preferredDoc.childNodes )),
+		preferredDoc.childNodes
+	);
+	// Support: Android<4.0
+	// Detect silently failing push.apply
+	arr[ preferredDoc.childNodes.length ].nodeType;
+} catch ( e ) {
+	push = { apply: arr.length ?
+
+		// Leverage slice if possible
+		function( target, els ) {
+			push_native.apply( target, slice.call(els) );
+		} :
+
+		// Support: IE<9
+		// Otherwise append directly
+		function( target, els ) {
+			var j = target.length,
+				i = 0;
+			// Can't trust NodeList.length
+			while ( (target[j++] = els[i++]) ) {}
+			target.length = j - 1;
+		}
+	};
+}
+
+function Sizzle( selector, context, results, seed ) {
+	var m, i, elem, nid, match, groups, newSelector,
+		newContext = context && context.ownerDocument,
+
+		// nodeType defaults to 9, since context defaults to document
+		nodeType = context ? context.nodeType : 9;
+
+	results = results || [];
+
+	// Return early from calls with invalid selector or context
+	if ( typeof selector !== "string" || !selector ||
+		nodeType !== 1 && nodeType !== 9 && nodeType !== 11 ) {
+
+		return results;
+	}
+
+	// Try to shortcut find operations (as opposed to filters) in HTML documents
+	if ( !seed ) {
+
+		if ( ( context ? context.ownerDocument || context : preferredDoc ) !== document ) {
+			setDocument( context );
+		}
+		context = context || document;
+
+		if ( documentIsHTML ) {
+
+			// If the selector is sufficiently simple, try using a "get*By*" DOM method
+			// (excepting DocumentFragment context, where the methods don't exist)
+			if ( nodeType !== 11 && (match = rquickExpr.exec( selector )) ) {
+
+				// ID selector
+				if ( (m = match[1]) ) {
+
+					// Document context
+					if ( nodeType === 9 ) {
+						if ( (elem = context.getElementById( m )) ) {
+
+							// Support: IE, Opera, Webkit
+							// TODO: identify versions
+							// getElementById can match elements by name instead of ID
+							if ( elem.id === m ) {
+								results.push( elem );
+								return results;
+							}
+						} else {
+							return results;
+						}
+
+					// Element context
+					} else {
+
+						// Support: IE, Opera, Webkit
+						// TODO: identify versions
+						// getElementById can match elements by name instead of ID
+						if ( newContext && (elem = newContext.getElementById( m )) &&
+							contains( context, elem ) &&
+							elem.id === m ) {
+
+							results.push( elem );
+							return results;
+						}
+					}
+
+				// Type selector
+				} else if ( match[2] ) {
+					push.apply( results, context.getElementsByTagName( selector ) );
+					return results;
+
+				// Class selector
+				} else if ( (m = match[3]) && support.getElementsByClassName &&
+					context.getElementsByClassName ) {
+
+					push.apply( results, context.getElementsByClassName( m ) );
+					return results;
+				}
+			}
+
+			// Take advantage of querySelectorAll
+			if ( support.qsa &&
+				!nonnativeSelectorCache[ selector + " " ] &&
+				(!rbuggyQSA || !rbuggyQSA.test( selector )) &&
+
+				// Support: IE 8 only
+				// Exclude object elements
+				(nodeType !== 1 || context.nodeName.toLowerCase() !== "object") ) {
+
+				newSelector = selector;
+				newContext = context;
+
+				// qSA considers elements outside a scoping root when evaluating child or
+				// descendant combinators, which is not what we want.
+				// In such cases, we work around the behavior by prefixing every selector in the
+				// list with an ID selector referencing the scope context.
+				// Thanks to Andrew Dupont for this technique.
+				if ( nodeType === 1 && rdescend.test( selector ) ) {
+
+					// Capture the context ID, setting it first if necessary
+					if ( (nid = context.getAttribute( "id" )) ) {
+						nid = nid.replace( rcssescape, fcssescape );
+					} else {
+						context.setAttribute( "id", (nid = expando) );
+					}
+
+					// Prefix every selector in the list
+					groups = tokenize( selector );
+					i = groups.length;
+					while ( i-- ) {
+						groups[i] = "#" + nid + " " + toSelector( groups[i] );
+					}
+					newSelector = groups.join( "," );
+
+					// Expand context for sibling selectors
+					newContext = rsibling.test( selector ) && testContext( context.parentNode ) ||
+						context;
+				}
+
+				try {
+					push.apply( results,
+						newContext.querySelectorAll( newSelector )
+					);
+					return results;
+				} catch ( qsaError ) {
+					nonnativeSelectorCache( selector, true );
+				} finally {
+					if ( nid === expando ) {
+						context.removeAttribute( "id" );
+					}
+				}
+			}
+		}
+	}
+
+	// All others
+	return select( selector.replace( rtrim, "$1" ), context, results, seed );
+}
+
+/**
+ * Create key-value caches of limited size
+ * @returns {function(string, object)} Returns the Object data after storing it on itself with
+ *	property name the (space-suffixed) string and (if the cache is larger than Expr.cacheLength)
+ *	deleting the oldest entry
+ */
+function createCache() {
+	var keys = [];
+
+	function cache( key, value ) {
+		// Use (key + " ") to avoid collision with native prototype properties (see Issue #157)
+		if ( keys.push( key + " " ) > Expr.cacheLength ) {
+			// Only keep the most recent entries
+			delete cache[ keys.shift() ];
+		}
+		return (cache[ key + " " ] = value);
+	}
+	return cache;
+}
+
+/**
+ * Mark a function for special use by Sizzle
+ * @param {Function} fn The function to mark
+ */
+function markFunction( fn ) {
+	fn[ expando ] = true;
+	return fn;
+}
+
+/**
+ * Support testing using an element
+ * @param {Function} fn Passed the created element and returns a boolean result
+ */
+function assert( fn ) {
+	var el = document.createElement("fieldset");
+
+	try {
+		return !!fn( el );
+	} catch (e) {
+		return false;
+	} finally {
+		// Remove from its parent by default
+		if ( el.parentNode ) {
+			el.parentNode.removeChild( el );
+		}
+		// release memory in IE
+		el = null;
+	}
+}
+
+/**
+ * Adds the same handler for all of the specified attrs
+ * @param {String} attrs Pipe-separated list of attributes
+ * @param {Function} handler The method that will be applied
+ */
+function addHandle( attrs, handler ) {
+	var arr = attrs.split("|"),
+		i = arr.length;
+
+	while ( i-- ) {
+		Expr.attrHandle[ arr[i] ] = handler;
+	}
+}
+
+/**
+ * Checks document order of two siblings
+ * @param {Element} a
+ * @param {Element} b
+ * @returns {Number} Returns less than 0 if a precedes b, greater than 0 if a follows b
+ */
+function siblingCheck( a, b ) {
+	var cur = b && a,
+		diff = cur && a.nodeType === 1 && b.nodeType === 1 &&
+			a.sourceIndex - b.sourceIndex;
+
+	// Use IE sourceIndex if available on both nodes
+	if ( diff ) {
+		return diff;
+	}
+
+	// Check if b follows a
+	if ( cur ) {
+		while ( (cur = cur.nextSibling) ) {
+			if ( cur === b ) {
+				return -1;
+			}
+		}
+	}
+
+	return a ? 1 : -1;
+}
+
+/**
+ * Returns a function to use in pseudos for input types
+ * @param {String} type
+ */
+function createInputPseudo( type ) {
+	return function( elem ) {
+		var name = elem.nodeName.toLowerCase();
+		return name === "input" && elem.type === type;
+	};
+}
+
+/**
+ * Returns a function to use in pseudos for buttons
+ * @param {String} type
+ */
+function createButtonPseudo( type ) {
+	return function( elem ) {
+		var name = elem.nodeName.toLowerCase();
+		return (name === "input" || name === "button") && elem.type === type;
+	};
+}
+
+/**
+ * Returns a function to use in pseudos for :enabled/:disabled
+ * @param {Boolean} disabled true for :disabled; false for :enabled
+ */
+function createDisabledPseudo( disabled ) {
+
+	// Known :disabled false positives: fieldset[disabled] > legend:nth-of-type(n+2) :can-disable
+	return function( elem ) {
+
+		// Only certain elements can match :enabled or :disabled
+		// https://html.spec.whatwg.org/multipage/scripting.html#selector-enabled
+		// https://html.spec.whatwg.org/multipage/scripting.html#selector-disabled
+		if ( "form" in elem ) {
+
+			// Check for inherited disabledness on relevant non-disabled elements:
+			// * listed form-associated elements in a disabled fieldset
+			//   https://html.spec.whatwg.org/multipage/forms.html#category-listed
+			//   https://html.spec.whatwg.org/multipage/forms.html#concept-fe-disabled
+			// * option elements in a disabled optgroup
+			//   https://html.spec.whatwg.org/multipage/forms.html#concept-option-disabled
+			// All such elements have a "form" property.
+			if ( elem.parentNode && elem.disabled === false ) {
+
+				// Option elements defer to a parent optgroup if present
+				if ( "label" in elem ) {
+					if ( "label" in elem.parentNode ) {
+						return elem.parentNode.disabled === disabled;
+					} else {
+						return elem.disabled === disabled;
+					}
+				}
+
+				// Support: IE 6 - 11
+				// Use the isDisabled shortcut property to check for disabled fieldset ancestors
+				return elem.isDisabled === disabled ||
+
+					// Where there is no isDisabled, check manually
+					/* jshint -W018 */
+					elem.isDisabled !== !disabled &&
+						inDisabledFieldset( elem ) === disabled;
+			}
+
+			return elem.disabled === disabled;
+
+		// Try to winnow out elements that can't be disabled before trusting the disabled property.
+		// Some victims get caught in our net (label, legend, menu, track), but it shouldn't
+		// even exist on them, let alone have a boolean value.
+		} else if ( "label" in elem ) {
+			return elem.disabled === disabled;
+		}
+
+		// Remaining elements are neither :enabled nor :disabled
+		return false;
+	};
+}
+
+/**
+ * Returns a function to use in pseudos for positionals
+ * @param {Function} fn
+ */
+function createPositionalPseudo( fn ) {
+	return markFunction(function( argument ) {
+		argument = +argument;
+		return markFunction(function( seed, matches ) {
+			var j,
+				matchIndexes = fn( [], seed.length, argument ),
+				i = matchIndexes.length;
+
+			// Match elements found at the specified indexes
+			while ( i-- ) {
+				if ( seed[ (j = matchIndexes[i]) ] ) {
+					seed[j] = !(matches[j] = seed[j]);
+				}
+			}
+		});
+	});
+}
+
+/**
+ * Checks a node for validity as a Sizzle context
+ * @param {Element|Object=} context
+ * @returns {Element|Object|Boolean} The input node if acceptable, otherwise a falsy value
+ */
+function testContext( context ) {
+	return context && typeof context.getElementsByTagName !== "undefined" && context;
+}
+
+// Expose support vars for convenience
+support = Sizzle.support = {};
+
+/**
+ * Detects XML nodes
+ * @param {Element|Object} elem An element or a document
+ * @returns {Boolean} True iff elem is a non-HTML XML node
+ */
+isXML = Sizzle.isXML = function( elem ) {
+	var namespace = elem.namespaceURI,
+		docElem = (elem.ownerDocument || elem).documentElement;
+
+	// Support: IE <=8
+	// Assume HTML when documentElement doesn't yet exist, such as inside loading iframes
+	// https://bugs.jquery.com/ticket/4833
+	return !rhtml.test( namespace || docElem && docElem.nodeName || "HTML" );
+};
+
+/**
+ * Sets document-related variables once based on the current document
+ * @param {Element|Object} [doc] An element or document object to use to set the document
+ * @returns {Object} Returns the current document
+ */
+setDocument = Sizzle.setDocument = function( node ) {
+	var hasCompare, subWindow,
+		doc = node ? node.ownerDocument || node : preferredDoc;
+
+	// Return early if doc is invalid or already selected
+	if ( doc === document || doc.nodeType !== 9 || !doc.documentElement ) {
+		return document;
+	}
+
+	// Update global variables
+	document = doc;
+	docElem = document.documentElement;
+	documentIsHTML = !isXML( document );
+
+	// Support: IE 9-11, Edge
+	// Accessing iframe documents after unload throws "permission denied" errors (jQuery #13936)
+	if ( preferredDoc !== document &&
+		(subWindow = document.defaultView) && subWindow.top !== subWindow ) {
+
+		// Support: IE 11, Edge
+		if ( subWindow.addEventListener ) {
+			subWindow.addEventListener( "unload", unloadHandler, false );
+
+		// Support: IE 9 - 10 only
+		} else if ( subWindow.attachEvent ) {
+			subWindow.attachEvent( "onunload", unloadHandler );
+		}
+	}
+
+	/* Attributes
+	---------------------------------------------------------------------- */
+
+	// Support: IE<8
+	// Verify that getAttribute really returns attributes and not properties
+	// (excepting IE8 booleans)
+	support.attributes = assert(function( el ) {
+		el.className = "i";
+		return !el.getAttribute("className");
+	});
+
+	/* getElement(s)By*
+	---------------------------------------------------------------------- */
+
+	// Check if getElementsByTagName("*") returns only elements
+	support.getElementsByTagName = assert(function( el ) {
+		el.appendChild( document.createComment("") );
+		return !el.getElementsByTagName("*").length;
+	});
+
+	// Support: IE<9
+	support.getElementsByClassName = rnative.test( document.getElementsByClassName );
+
+	// Support: IE<10
+	// Check if getElementById returns elements by name
+	// The broken getElementById methods don't pick up programmatically-set names,
+	// so use a roundabout getElementsByName test
+	support.getById = assert(function( el ) {
+		docElem.appendChild( el ).id = expando;
+		return !document.getElementsByName || !document.getElementsByName( expando ).length;
+	});
+
+	// ID filter and find
+	if ( support.getById ) {
+		Expr.filter["ID"] = function( id ) {
+			var attrId = id.replace( runescape, funescape );
+			return function( elem ) {
+				return elem.getAttribute("id") === attrId;
+			};
+		};
+		Expr.find["ID"] = function( id, context ) {
+			if ( typeof context.getElementById !== "undefined" && documentIsHTML ) {
+				var elem = context.getElementById( id );
+				return elem ? [ elem ] : [];
+			}
+		};
+	} else {
+		Expr.filter["ID"] =  function( id ) {
+			var attrId = id.replace( runescape, funescape );
+			return function( elem ) {
+				var node = typeof elem.getAttributeNode !== "undefined" &&
+					elem.getAttributeNode("id");
+				return node && node.value === attrId;
+			};
+		};
+
+		// Support: IE 6 - 7 only
+		// getElementById is not reliable as a find shortcut
+		Expr.find["ID"] = function( id, context ) {
+			if ( typeof context.getElementById !== "undefined" && documentIsHTML ) {
+				var node, i, elems,
+					elem = context.getElementById( id );
+
+				if ( elem ) {
+
+					// Verify the id attribute
+					node = elem.getAttributeNode("id");
+					if ( node && node.value === id ) {
+						return [ elem ];
+					}
+
+					// Fall back on getElementsByName
+					elems = context.getElementsByName( id );
+					i = 0;
+					while ( (elem = elems[i++]) ) {
+						node = elem.getAttributeNode("id");
+						if ( node && node.value === id ) {
+							return [ elem ];
+						}
+					}
+				}
+
+				return [];
+			}
+		};
+	}
+
+	// Tag
+	Expr.find["TAG"] = support.getElementsByTagName ?
+		function( tag, context ) {
+			if ( typeof context.getElementsByTagName !== "undefined" ) {
+				return context.getElementsByTagName( tag );
+
+			// DocumentFragment nodes don't have gEBTN
+			} else if ( support.qsa ) {
+				return context.querySelectorAll( tag );
+			}
+		} :
+
+		function( tag, context ) {
+			var elem,
+				tmp = [],
+				i = 0,
+				// By happy coincidence, a (broken) gEBTN appears on DocumentFragment nodes too
+				results = context.getElementsByTagName( tag );
+
+			// Filter out possible comments
+			if ( tag === "*" ) {
+				while ( (elem = results[i++]) ) {
+					if ( elem.nodeType === 1 ) {
+						tmp.push( elem );
+					}
+				}
+
+				return tmp;
+			}
+			return results;
+		};
+
+	// Class
+	Expr.find["CLASS"] = support.getElementsByClassName && function( className, context ) {
+		if ( typeof context.getElementsByClassName !== "undefined" && documentIsHTML ) {
+			return context.getElementsByClassName( className );
+		}
+	};
+
+	/* QSA/matchesSelector
+	---------------------------------------------------------------------- */
+
+	// QSA and matchesSelector support
+
+	// matchesSelector(:active) reports false when true (IE9/Opera 11.5)
+	rbuggyMatches = [];
+
+	// qSa(:focus) reports false when true (Chrome 21)
+	// We allow this because of a bug in IE8/9 that throws an error
+	// whenever `document.activeElement` is accessed on an iframe
+	// So, we allow :focus to pass through QSA all the time to avoid the IE error
+	// See https://bugs.jquery.com/ticket/13378
+	rbuggyQSA = [];
+
+	if ( (support.qsa = rnative.test( document.querySelectorAll )) ) {
+		// Build QSA regex
+		// Regex strategy adopted from Diego Perini
+		assert(function( el ) {
+			// Select is set to empty string on purpose
+			// This is to test IE's treatment of not explicitly
+			// setting a boolean content attribute,
+			// since its presence should be enough
+			// https://bugs.jquery.com/ticket/12359
+			docElem.appendChild( el ).innerHTML = "<a id='" + expando + "'></a>" +
+				"<select id='" + expando + "-\r\\' msallowcapture=''>" +
+				"<option selected=''></option></select>";
+
+			// Support: IE8, Opera 11-12.16
+			// Nothing should be selected when empty strings follow ^= or $= or *=
+			// The test attribute must be unknown in Opera but "safe" for WinRT
+			// https://msdn.microsoft.com/en-us/library/ie/hh465388.aspx#attribute_section
+			if ( el.querySelectorAll("[msallowcapture^='']").length ) {
+				rbuggyQSA.push( "[*^$]=" + whitespace + "*(?:''|\"\")" );
+			}
+
+			// Support: IE8
+			// Boolean attributes and "value" are not treated correctly
+			if ( !el.querySelectorAll("[selected]").length ) {
+				rbuggyQSA.push( "\\[" + whitespace + "*(?:value|" + booleans + ")" );
+			}
+
+			// Support: Chrome<29, Android<4.4, Safari<7.0+, iOS<7.0+, PhantomJS<1.9.8+
+			if ( !el.querySelectorAll( "[id~=" + expando + "-]" ).length ) {
+				rbuggyQSA.push("~=");
+			}
+
+			// Webkit/Opera - :checked should return selected option elements
+			// http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked
+			// IE8 throws error here and will not see later tests
+			if ( !el.querySelectorAll(":checked").length ) {
+				rbuggyQSA.push(":checked");
+			}
+
+			// Support: Safari 8+, iOS 8+
+			// https://bugs.webkit.org/show_bug.cgi?id=136851
+			// In-page `selector#id sibling-combinator selector` fails
+			if ( !el.querySelectorAll( "a#" + expando + "+*" ).length ) {
+				rbuggyQSA.push(".#.+[+~]");
+			}
+		});
+
+		assert(function( el ) {
+			el.innerHTML = "<a href='' disabled='disabled'></a>" +
+				"<select disabled='disabled'><option/></select>";
+
+			// Support: Windows 8 Native Apps
+			// The type and name attributes are restricted during .innerHTML assignment
+			var input = document.createElement("input");
+			input.setAttribute( "type", "hidden" );
+			el.appendChild( input ).setAttribute( "name", "D" );
+
+			// Support: IE8
+			// Enforce case-sensitivity of name attribute
+			if ( el.querySelectorAll("[name=d]").length ) {
+				rbuggyQSA.push( "name" + whitespace + "*[*^$|!~]?=" );
+			}
+
+			// FF 3.5 - :enabled/:disabled and hidden elements (hidden elements are still enabled)
+			// IE8 throws error here and will not see later tests
+			if ( el.querySelectorAll(":enabled").length !== 2 ) {
+				rbuggyQSA.push( ":enabled", ":disabled" );
+			}
+
+			// Support: IE9-11+
+			// IE's :disabled selector does not pick up the children of disabled fieldsets
+			docElem.appendChild( el ).disabled = true;
+			if ( el.querySelectorAll(":disabled").length !== 2 ) {
+				rbuggyQSA.push( ":enabled", ":disabled" );
+			}
+
+			// Opera 10-11 does not throw on post-comma invalid pseudos
+			el.querySelectorAll("*,:x");
+			rbuggyQSA.push(",.*:");
+		});
+	}
+
+	if ( (support.matchesSelector = rnative.test( (matches = docElem.matches ||
+		docElem.webkitMatchesSelector ||
+		docElem.mozMatchesSelector ||
+		docElem.oMatchesSelector ||
+		docElem.msMatchesSelector) )) ) {
+
+		assert(function( el ) {
+			// Check to see if it's possible to do matchesSelector
+			// on a disconnected node (IE 9)
+			support.disconnectedMatch = matches.call( el, "*" );
+
+			// This should fail with an exception
+			// Gecko does not error, returns false instead
+			matches.call( el, "[s!='']:x" );
+			rbuggyMatches.push( "!=", pseudos );
+		});
+	}
+
+	rbuggyQSA = rbuggyQSA.length && new RegExp( rbuggyQSA.join("|") );
+	rbuggyMatches = rbuggyMatches.length && new RegExp( rbuggyMatches.join("|") );
+
+	/* Contains
+	---------------------------------------------------------------------- */
+	hasCompare = rnative.test( docElem.compareDocumentPosition );
+
+	// Element contains another
+	// Purposefully self-exclusive
+	// As in, an element does not contain itself
+	contains = hasCompare || rnative.test( docElem.contains ) ?
+		function( a, b ) {
+			var adown = a.nodeType === 9 ? a.documentElement : a,
+				bup = b && b.parentNode;
+			return a === bup || !!( bup && bup.nodeType === 1 && (
+				adown.contains ?
+					adown.contains( bup ) :
+					a.compareDocumentPosition && a.compareDocumentPosition( bup ) & 16
+			));
+		} :
+		function( a, b ) {
+			if ( b ) {
+				while ( (b = b.parentNode) ) {
+					if ( b === a ) {
+						return true;
+					}
+				}
+			}
+			return false;
+		};
+
+	/* Sorting
+	---------------------------------------------------------------------- */
+
+	// Document order sorting
+	sortOrder = hasCompare ?
+	function( a, b ) {
+
+		// Flag for duplicate removal
+		if ( a === b ) {
+			hasDuplicate = true;
+			return 0;
+		}
+
+		// Sort on method existence if only one input has compareDocumentPosition
+		var compare = !a.compareDocumentPosition - !b.compareDocumentPosition;
+		if ( compare ) {
+			return compare;
+		}
+
+		// Calculate position if both inputs belong to the same document
+		compare = ( a.ownerDocument || a ) === ( b.ownerDocument || b ) ?
+			a.compareDocumentPosition( b ) :
+
+			// Otherwise we know they are disconnected
+			1;
+
+		// Disconnected nodes
+		if ( compare & 1 ||
+			(!support.sortDetached && b.compareDocumentPosition( a ) === compare) ) {
+
+			// Choose the first element that is related to our preferred document
+			if ( a === document || a.ownerDocument === preferredDoc && contains(preferredDoc, a) ) {
+				return -1;
+			}
+			if ( b === document || b.ownerDocument === preferredDoc && contains(preferredDoc, b) ) {
+				return 1;
+			}
+
+			// Maintain original order
+			return sortInput ?
+				( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) :
+				0;
+		}
+
+		return compare & 4 ? -1 : 1;
+	} :
+	function( a, b ) {
+		// Exit early if the nodes are identical
+		if ( a === b ) {
+			hasDuplicate = true;
+			return 0;
+		}
+
+		var cur,
+			i = 0,
+			aup = a.parentNode,
+			bup = b.parentNode,
+			ap = [ a ],
+			bp = [ b ];
+
+		// Parentless nodes are either documents or disconnected
+		if ( !aup || !bup ) {
+			return a === document ? -1 :
+				b === document ? 1 :
+				aup ? -1 :
+				bup ? 1 :
+				sortInput ?
+				( indexOf( sortInput, a ) - indexOf( sortInput, b ) ) :
+				0;
+
+		// If the nodes are siblings, we can do a quick check
+		} else if ( aup === bup ) {
+			return siblingCheck( a, b );
+		}
+
+		// Otherwise we need full lists of their ancestors for comparison
+		cur = a;
+		while ( (cur = cur.parentNode) ) {
+			ap.unshift( cur );
+		}
+		cur = b;
+		while ( (cur = cur.parentNode) ) {
+			bp.unshift( cur );
+		}
+
+		// Walk down the tree looking for a discrepancy
+		while ( ap[i] === bp[i] ) {
+			i++;
+		}
+
+		return i ?
+			// Do a sibling check if the nodes have a common ancestor
+			siblingCheck( ap[i], bp[i] ) :
+
+			// Otherwise nodes in our document sort first
+			ap[i] === preferredDoc ? -1 :
+			bp[i] === preferredDoc ? 1 :
+			0;
+	};
+
+	return document;
+};
+
+Sizzle.matches = function( expr, elements ) {
+	return Sizzle( expr, null, null, elements );
+};
+
+Sizzle.matchesSelector = function( elem, expr ) {
+	// Set document vars if needed
+	if ( ( elem.ownerDocument || elem ) !== document ) {
+		setDocument( elem );
+	}
+
+	if ( support.matchesSelector && documentIsHTML &&
+		!nonnativeSelectorCache[ expr + " " ] &&
+		( !rbuggyMatches || !rbuggyMatches.test( expr ) ) &&
+		( !rbuggyQSA     || !rbuggyQSA.test( expr ) ) ) {
+
+		try {
+			var ret = matches.call( elem, expr );
+
+			// IE 9's matchesSelector returns false on disconnected nodes
+			if ( ret || support.disconnectedMatch ||
+					// As well, disconnected nodes are said to be in a document
+					// fragment in IE 9
+					elem.document && elem.document.nodeType !== 11 ) {
+				return ret;
+			}
+		} catch (e) {
+			nonnativeSelectorCache( expr, true );
+		}
+	}
+
+	return Sizzle( expr, document, null, [ elem ] ).length > 0;
+};
+
+Sizzle.contains = function( context, elem ) {
+	// Set document vars if needed
+	if ( ( context.ownerDocument || context ) !== document ) {
+		setDocument( context );
+	}
+	return contains( context, elem );
+};
+
+Sizzle.attr = function( elem, name ) {
+	// Set document vars if needed
+	if ( ( elem.ownerDocument || elem ) !== document ) {
+		setDocument( elem );
+	}
+
+	var fn = Expr.attrHandle[ name.toLowerCase() ],
+		// Don't get fooled by Object.prototype properties (jQuery #13807)
+		val = fn && hasOwn.call( Expr.attrHandle, name.toLowerCase() ) ?
+			fn( elem, name, !documentIsHTML ) :
+			undefined;
+
+	return val !== undefined ?
+		val :
+		support.attributes || !documentIsHTML ?
+			elem.getAttribute( name ) :
+			(val = elem.getAttributeNode(name)) && val.specified ?
+				val.value :
+				null;
+};
+
+Sizzle.escape = function( sel ) {
+	return (sel + "").replace( rcssescape, fcssescape );
+};
+
+Sizzle.error = function( msg ) {
+	throw new Error( "Syntax error, unrecognized expression: " + msg );
+};
+
+/**
+ * Document sorting and removing duplicates
+ * @param {ArrayLike} results
+ */
+Sizzle.uniqueSort = function( results ) {
+	var elem,
+		duplicates = [],
+		j = 0,
+		i = 0;
+
+	// Unless we *know* we can detect duplicates, assume their presence
+	hasDuplicate = !support.detectDuplicates;
+	sortInput = !support.sortStable && results.slice( 0 );
+	results.sort( sortOrder );
+
+	if ( hasDuplicate ) {
+		while ( (elem = results[i++]) ) {
+			if ( elem === results[ i ] ) {
+				j = duplicates.push( i );
+			}
+		}
+		while ( j-- ) {
+			results.splice( duplicates[ j ], 1 );
+		}
+	}
+
+	// Clear input after sorting to release objects
+	// See https://github.com/jquery/sizzle/pull/225
+	sortInput = null;
+
+	return results;
+};
+
+/**
+ * Utility function for retrieving the text value of an array of DOM nodes
+ * @param {Array|Element} elem
+ */
+getText = Sizzle.getText = function( elem ) {
+	var node,
+		ret = "",
+		i = 0,
+		nodeType = elem.nodeType;
+
+	if ( !nodeType ) {
+		// If no nodeType, this is expected to be an array
+		while ( (node = elem[i++]) ) {
+			// Do not traverse comment nodes
+			ret += getText( node );
+		}
+	} else if ( nodeType === 1 || nodeType === 9 || nodeType === 11 ) {
+		// Use textContent for elements
+		// innerText usage removed for consistency of new lines (jQuery #11153)
+		if ( typeof elem.textContent === "string" ) {
+			return elem.textContent;
+		} else {
+			// Traverse its children
+			for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {
+				ret += getText( elem );
+			}
+		}
+	} else if ( nodeType === 3 || nodeType === 4 ) {
+		return elem.nodeValue;
+	}
+	// Do not include comment or processing instruction nodes
+
+	return ret;
+};
+
+Expr = Sizzle.selectors = {
+
+	// Can be adjusted by the user
+	cacheLength: 50,
+
+	createPseudo: markFunction,
+
+	match: matchExpr,
+
+	attrHandle: {},
+
+	find: {},
+
+	relative: {
+		">": { dir: "parentNode", first: true },
+		" ": { dir: "parentNode" },
+		"+": { dir: "previousSibling", first: true },
+		"~": { dir: "previousSibling" }
+	},
+
+	preFilter: {
+		"ATTR": function( match ) {
+			match[1] = match[1].replace( runescape, funescape );
+
+			// Move the given value to match[3] whether quoted or unquoted
+			match[3] = ( match[3] || match[4] || match[5] || "" ).replace( runescape, funescape );
+
+			if ( match[2] === "~=" ) {
+				match[3] = " " + match[3] + " ";
+			}
+
+			return match.slice( 0, 4 );
+		},
+
+		"CHILD": function( match ) {
+			/* matches from matchExpr["CHILD"]
+				1 type (only|nth|...)
+				2 what (child|of-type)
+				3 argument (even|odd|\d*|\d*n([+-]\d+)?|...)
+				4 xn-component of xn+y argument ([+-]?\d*n|)
+				5 sign of xn-component
+				6 x of xn-component
+				7 sign of y-component
+				8 y of y-component
+			*/
+			match[1] = match[1].toLowerCase();
+
+			if ( match[1].slice( 0, 3 ) === "nth" ) {
+				// nth-* requires argument
+				if ( !match[3] ) {
+					Sizzle.error( match[0] );
+				}
+
+				// numeric x and y parameters for Expr.filter.CHILD
+				// remember that false/true cast respectively to 0/1
+				match[4] = +( match[4] ? match[5] + (match[6] || 1) : 2 * ( match[3] === "even" || match[3] === "odd" ) );
+				match[5] = +( ( match[7] + match[8] ) || match[3] === "odd" );
+
+			// other types prohibit arguments
+			} else if ( match[3] ) {
+				Sizzle.error( match[0] );
+			}
+
+			return match;
+		},
+
+		"PSEUDO": function( match ) {
+			var excess,
+				unquoted = !match[6] && match[2];
+
+			if ( matchExpr["CHILD"].test( match[0] ) ) {
+				return null;
+			}
+
+			// Accept quoted arguments as-is
+			if ( match[3] ) {
+				match[2] = match[4] || match[5] || "";
+
+			// Strip excess characters from unquoted arguments
+			} else if ( unquoted && rpseudo.test( unquoted ) &&
+				// Get excess from tokenize (recursively)
+				(excess = tokenize( unquoted, true )) &&
+				// advance to the next closing parenthesis
+				(excess = unquoted.indexOf( ")", unquoted.length - excess ) - unquoted.length) ) {
+
+				// excess is a negative index
+				match[0] = match[0].slice( 0, excess );
+				match[2] = unquoted.slice( 0, excess );
+			}
+
+			// Return only captures needed by the pseudo filter method (type and argument)
+			return match.slice( 0, 3 );
+		}
+	},
+
+	filter: {
+
+		"TAG": function( nodeNameSelector ) {
+			var nodeName = nodeNameSelector.replace( runescape, funescape ).toLowerCase();
+			return nodeNameSelector === "*" ?
+				function() { return true; } :
+				function( elem ) {
+					return elem.nodeName && elem.nodeName.toLowerCase() === nodeName;
+				};
+		},
+
+		"CLASS": function( className ) {
+			var pattern = classCache[ className + " " ];
+
+			return pattern ||
+				(pattern = new RegExp( "(^|" + whitespace + ")" + className + "(" + whitespace + "|$)" )) &&
+				classCache( className, function( elem ) {
+					return pattern.test( typeof elem.className === "string" && elem.className || typeof elem.getAttribute !== "undefined" && elem.getAttribute("class") || "" );
+				});
+		},
+
+		"ATTR": function( name, operator, check ) {
+			return function( elem ) {
+				var result = Sizzle.attr( elem, name );
+
+				if ( result == null ) {
+					return operator === "!=";
+				}
+				if ( !operator ) {
+					return true;
+				}
+
+				result += "";
+
+				return operator === "=" ? result === check :
+					operator === "!=" ? result !== check :
+					operator === "^=" ? check && result.indexOf( check ) === 0 :
+					operator === "*=" ? check && result.indexOf( check ) > -1 :
+					operator === "$=" ? check && result.slice( -check.length ) === check :
+					operator === "~=" ? ( " " + result.replace( rwhitespace, " " ) + " " ).indexOf( check ) > -1 :
+					operator === "|=" ? result === check || result.slice( 0, check.length + 1 ) === check + "-" :
+					false;
+			};
+		},
+
+		"CHILD": function( type, what, argument, first, last ) {
+			var simple = type.slice( 0, 3 ) !== "nth",
+				forward = type.slice( -4 ) !== "last",
+				ofType = what === "of-type";
+
+			return first === 1 && last === 0 ?
+
+				// Shortcut for :nth-*(n)
+				function( elem ) {
+					return !!elem.parentNode;
+				} :
+
+				function( elem, context, xml ) {
+					var cache, uniqueCache, outerCache, node, nodeIndex, start,
+						dir = simple !== forward ? "nextSibling" : "previousSibling",
+						parent = elem.parentNode,
+						name = ofType && elem.nodeName.toLowerCase(),
+						useCache = !xml && !ofType,
+						diff = false;
+
+					if ( parent ) {
+
+						// :(first|last|only)-(child|of-type)
+						if ( simple ) {
+							while ( dir ) {
+								node = elem;
+								while ( (node = node[ dir ]) ) {
+									if ( ofType ?
+										node.nodeName.toLowerCase() === name :
+										node.nodeType === 1 ) {
+
+										return false;
+									}
+								}
+								// Reverse direction for :only-* (if we haven't yet done so)
+								start = dir = type === "only" && !start && "nextSibling";
+							}
+							return true;
+						}
+
+						start = [ forward ? parent.firstChild : parent.lastChild ];
+
+						// non-xml :nth-child(...) stores cache data on `parent`
+						if ( forward && useCache ) {
+
+							// Seek `elem` from a previously-cached index
+
+							// ...in a gzip-friendly way
+							node = parent;
+							outerCache = node[ expando ] || (node[ expando ] = {});
+
+							// Support: IE <9 only
+							// Defend against cloned attroperties (jQuery gh-1709)
+							uniqueCache = outerCache[ node.uniqueID ] ||
+								(outerCache[ node.uniqueID ] = {});
+
+							cache = uniqueCache[ type ] || [];
+							nodeIndex = cache[ 0 ] === dirruns && cache[ 1 ];
+							diff = nodeIndex && cache[ 2 ];
+							node = nodeIndex && parent.childNodes[ nodeIndex ];
+
+							while ( (node = ++nodeIndex && node && node[ dir ] ||
+
+								// Fallback to seeking `elem` from the start
+								(diff = nodeIndex = 0) || start.pop()) ) {
+
+								// When found, cache indexes on `parent` and break
+								if ( node.nodeType === 1 && ++diff && node === elem ) {
+									uniqueCache[ type ] = [ dirruns, nodeIndex, diff ];
+									break;
+								}
+							}
+
+						} else {
+							// Use previously-cached element index if available
+							if ( useCache ) {
+								// ...in a gzip-friendly way
+								node = elem;
+								outerCache = node[ expando ] || (node[ expando ] = {});
+
+								// Support: IE <9 only
+								// Defend against cloned attroperties (jQuery gh-1709)
+								uniqueCache = outerCache[ node.uniqueID ] ||
+									(outerCache[ node.uniqueID ] = {});
+
+								cache = uniqueCache[ type ] || [];
+								nodeIndex = cache[ 0 ] === dirruns && cache[ 1 ];
+								diff = nodeIndex;
+							}
+
+							// xml :nth-child(...)
+							// or :nth-last-child(...) or :nth(-last)?-of-type(...)
+							if ( diff === false ) {
+								// Use the same loop as above to seek `elem` from the start
+								while ( (node = ++nodeIndex && node && node[ dir ] ||
+									(diff = nodeIndex = 0) || start.pop()) ) {
+
+									if ( ( ofType ?
+										node.nodeName.toLowerCase() === name :
+										node.nodeType === 1 ) &&
+										++diff ) {
+
+										// Cache the index of each encountered element
+										if ( useCache ) {
+											outerCache = node[ expando ] || (node[ expando ] = {});
+
+											// Support: IE <9 only
+											// Defend against cloned attroperties (jQuery gh-1709)
+											uniqueCache = outerCache[ node.uniqueID ] ||
+												(outerCache[ node.uniqueID ] = {});
+
+											uniqueCache[ type ] = [ dirruns, diff ];
+										}
+
+										if ( node === elem ) {
+											break;
+										}
+									}
+								}
+							}
+						}
+
+						// Incorporate the offset, then check against cycle size
+						diff -= last;
+						return diff === first || ( diff % first === 0 && diff / first >= 0 );
+					}
+				};
+		},
+
+		"PSEUDO": function( pseudo, argument ) {
+			// pseudo-class names are case-insensitive
+			// http://www.w3.org/TR/selectors/#pseudo-classes
+			// Prioritize by case sensitivity in case custom pseudos are added with uppercase letters
+			// Remember that setFilters inherits from pseudos
+			var args,
+				fn = Expr.pseudos[ pseudo ] || Expr.setFilters[ pseudo.toLowerCase() ] ||
+					Sizzle.error( "unsupported pseudo: " + pseudo );
+
+			// The user may use createPseudo to indicate that
+			// arguments are needed to create the filter function
+			// just as Sizzle does
+			if ( fn[ expando ] ) {
+				return fn( argument );
+			}
+
+			// But maintain support for old signatures
+			if ( fn.length > 1 ) {
+				args = [ pseudo, pseudo, "", argument ];
+				return Expr.setFilters.hasOwnProperty( pseudo.toLowerCase() ) ?
+					markFunction(function( seed, matches ) {
+						var idx,
+							matched = fn( seed, argument ),
+							i = matched.length;
+						while ( i-- ) {
+							idx = indexOf( seed, matched[i] );
+							seed[ idx ] = !( matches[ idx ] = matched[i] );
+						}
+					}) :
+					function( elem ) {
+						return fn( elem, 0, args );
+					};
+			}
+
+			return fn;
+		}
+	},
+
+	pseudos: {
+		// Potentially complex pseudos
+		"not": markFunction(function( selector ) {
+			// Trim the selector passed to compile
+			// to avoid treating leading and trailing
+			// spaces as combinators
+			var input = [],
+				results = [],
+				matcher = compile( selector.replace( rtrim, "$1" ) );
+
+			return matcher[ expando ] ?
+				markFunction(function( seed, matches, context, xml ) {
+					var elem,
+						unmatched = matcher( seed, null, xml, [] ),
+						i = seed.length;
+
+					// Match elements unmatched by `matcher`
+					while ( i-- ) {
+						if ( (elem = unmatched[i]) ) {
+							seed[i] = !(matches[i] = elem);
+						}
+					}
+				}) :
+				function( elem, context, xml ) {
+					input[0] = elem;
+					matcher( input, null, xml, results );
+					// Don't keep the element (issue #299)
+					input[0] = null;
+					return !results.pop();
+				};
+		}),
+
+		"has": markFunction(function( selector ) {
+			return function( elem ) {
+				return Sizzle( selector, elem ).length > 0;
+			};
+		}),
+
+		"contains": markFunction(function( text ) {
+			text = text.replace( runescape, funescape );
+			return function( elem ) {
+				return ( elem.textContent || getText( elem ) ).indexOf( text ) > -1;
+			};
+		}),
+
+		// "Whether an element is represented by a :lang() selector
+		// is based solely on the element's language value
+		// being equal to the identifier C,
+		// or beginning with the identifier C immediately followed by "-".
+		// The matching of C against the element's language value is performed case-insensitively.
+		// The identifier C does not have to be a valid language name."
+		// http://www.w3.org/TR/selectors/#lang-pseudo
+		"lang": markFunction( function( lang ) {
+			// lang value must be a valid identifier
+			if ( !ridentifier.test(lang || "") ) {
+				Sizzle.error( "unsupported lang: " + lang );
+			}
+			lang = lang.replace( runescape, funescape ).toLowerCase();
+			return function( elem ) {
+				var elemLang;
+				do {
+					if ( (elemLang = documentIsHTML ?
+						elem.lang :
+						elem.getAttribute("xml:lang") || elem.getAttribute("lang")) ) {
+
+						elemLang = elemLang.toLowerCase();
+						return elemLang === lang || elemLang.indexOf( lang + "-" ) === 0;
+					}
+				} while ( (elem = elem.parentNode) && elem.nodeType === 1 );
+				return false;
+			};
+		}),
+
+		// Miscellaneous
+		"target": function( elem ) {
+			var hash = window.location && window.location.hash;
+			return hash && hash.slice( 1 ) === elem.id;
+		},
+
+		"root": function( elem ) {
+			return elem === docElem;
+		},
+
+		"focus": function( elem ) {
+			return elem === document.activeElement && (!document.hasFocus || document.hasFocus()) && !!(elem.type || elem.href || ~elem.tabIndex);
+		},
+
+		// Boolean properties
+		"enabled": createDisabledPseudo( false ),
+		"disabled": createDisabledPseudo( true ),
+
+		"checked": function( elem ) {
+			// In CSS3, :checked should return both checked and selected elements
+			// http://www.w3.org/TR/2011/REC-css3-selectors-20110929/#checked
+			var nodeName = elem.nodeName.toLowerCase();
+			return (nodeName === "input" && !!elem.checked) || (nodeName === "option" && !!elem.selected);
+		},
+
+		"selected": function( elem ) {
+			// Accessing this property makes selected-by-default
+			// options in Safari work properly
+			if ( elem.parentNode ) {
+				elem.parentNode.selectedIndex;
+			}
+
+			return elem.selected === true;
+		},
+
+		// Contents
+		"empty": function( elem ) {
+			// http://www.w3.org/TR/selectors/#empty-pseudo
+			// :empty is negated by element (1) or content nodes (text: 3; cdata: 4; entity ref: 5),
+			//   but not by others (comment: 8; processing instruction: 7; etc.)
+			// nodeType < 6 works because attributes (2) do not appear as children
+			for ( elem = elem.firstChild; elem; elem = elem.nextSibling ) {
+				if ( elem.nodeType < 6 ) {
+					return false;
+				}
+			}
+			return true;
+		},
+
+		"parent": function( elem ) {
+			return !Expr.pseudos["empty"]( elem );
+		},
+
+		// Element/input types
+		"header": function( elem ) {
+			return rheader.test( elem.nodeName );
+		},
+
+		"input": function( elem ) {
+			return rinputs.test( elem.nodeName );
+		},
+
+		"button": function( elem ) {
+			var name = elem.nodeName.toLowerCase();
+			return name === "input" && elem.type === "button" || name === "button";
+		},
+
+		"text": function( elem ) {
+			var attr;
+			return elem.nodeName.toLowerCase() === "input" &&
+				elem.type === "text" &&
+
+				// Support: IE<8
+				// New HTML5 attribute values (e.g., "search") appear with elem.type === "text"
+				( (attr = elem.getAttribute("type")) == null || attr.toLowerCase() === "text" );
+		},
+
+		// Position-in-collection
+		"first": createPositionalPseudo(function() {
+			return [ 0 ];
+		}),
+
+		"last": createPositionalPseudo(function( matchIndexes, length ) {
+			return [ length - 1 ];
+		}),
+
+		"eq": createPositionalPseudo(function( matchIndexes, length, argument ) {
+			return [ argument < 0 ? argument + length : argument ];
+		}),
+
+		"even": createPositionalPseudo(function( matchIndexes, length ) {
+			var i = 0;
+			for ( ; i < length; i += 2 ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		}),
+
+		"odd": createPositionalPseudo(function( matchIndexes, length ) {
+			var i = 1;
+			for ( ; i < length; i += 2 ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		}),
+
+		"lt": createPositionalPseudo(function( matchIndexes, length, argument ) {
+			var i = argument < 0 ?
+				argument + length :
+				argument > length ?
+					length :
+					argument;
+			for ( ; --i >= 0; ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		}),
+
+		"gt": createPositionalPseudo(function( matchIndexes, length, argument ) {
+			var i = argument < 0 ? argument + length : argument;
+			for ( ; ++i < length; ) {
+				matchIndexes.push( i );
+			}
+			return matchIndexes;
+		})
+	}
+};
+
+Expr.pseudos["nth"] = Expr.pseudos["eq"];
+
+// Add button/input type pseudos
+for ( i in { radio: true, checkbox: true, file: true, password: true, image: true } ) {
+	Expr.pseudos[ i ] = createInputPseudo( i );
+}
+for ( i in { submit: true, reset: true } ) {
+	Expr.pseudos[ i ] = createButtonPseudo( i );
+}
+
+// Easy API for creating new setFilters
+function setFilters() {}
+setFilters.prototype = Expr.filters = Expr.pseudos;
+Expr.setFilters = new setFilters();
+
+tokenize = Sizzle.tokenize = function( selector, parseOnly ) {
+	var matched, match, tokens, type,
+		soFar, groups, preFilters,
+		cached = tokenCache[ selector + " " ];
+
+	if ( cached ) {
+		return parseOnly ? 0 : cached.slice( 0 );
+	}
+
+	soFar = selector;
+	groups = [];
+	preFilters = Expr.preFilter;
+
+	while ( soFar ) {
+
+		// Comma and first run
+		if ( !matched || (match = rcomma.exec( soFar )) ) {
+			if ( match ) {
+				// Don't consume trailing commas as valid
+				soFar = soFar.slice( match[0].length ) || soFar;
+			}
+			groups.push( (tokens = []) );
+		}
+
+		matched = false;
+
+		// Combinators
+		if ( (match = rcombinators.exec( soFar )) ) {
+			matched = match.shift();
+			tokens.push({
+				value: matched,
+				// Cast descendant combinators to space
+				type: match[0].replace( rtrim, " " )
+			});
+			soFar = soFar.slice( matched.length );
+		}
+
+		// Filters
+		for ( type in Expr.filter ) {
+			if ( (match = matchExpr[ type ].exec( soFar )) && (!preFilters[ type ] ||
+				(match = preFilters[ type ]( match ))) ) {
+				matched = match.shift();
+				tokens.push({
+					value: matched,
+					type: type,
+					matches: match
+				});
+				soFar = soFar.slice( matched.length );
+			}
+		}
+
+		if ( !matched ) {
+			break;
+		}
+	}
+
+	// Return the length of the invalid excess
+	// if we're just parsing
+	// Otherwise, throw an error or return tokens
+	return parseOnly ?
+		soFar.length :
+		soFar ?
+			Sizzle.error( selector ) :
+			// Cache the tokens
+			tokenCache( selector, groups ).slice( 0 );
+};
+
+function toSelector( tokens ) {
+	var i = 0,
+		len = tokens.length,
+		selector = "";
+	for ( ; i < len; i++ ) {
+		selector += tokens[i].value;
+	}
+	return selector;
+}
+
+function addCombinator( matcher, combinator, base ) {
+	var dir = combinator.dir,
+		skip = combinator.next,
+		key = skip || dir,
+		checkNonElements = base && key === "parentNode",
+		doneName = done++;
+
+	return combinator.first ?
+		// Check against closest ancestor/preceding element
+		function( elem, context, xml ) {
+			while ( (elem = elem[ dir ]) ) {
+				if ( elem.nodeType === 1 || checkNonElements ) {
+					return matcher( elem, context, xml );
+				}
+			}
+			return false;
+		} :
+
+		// Check against all ancestor/preceding elements
+		function( elem, context, xml ) {
+			var oldCache, uniqueCache, outerCache,
+				newCache = [ dirruns, doneName ];
+
+			// We can't set arbitrary data on XML nodes, so they don't benefit from combinator caching
+			if ( xml ) {
+				while ( (elem = elem[ dir ]) ) {
+					if ( elem.nodeType === 1 || checkNonElements ) {
+						if ( matcher( elem, context, xml ) ) {
+							return true;
+						}
+					}
+				}
+			} else {
+				while ( (elem = elem[ dir ]) ) {
+					if ( elem.nodeType === 1 || checkNonElements ) {
+						outerCache = elem[ expando ] || (elem[ expando ] = {});
+
+						// Support: IE <9 only
+						// Defend against cloned attroperties (jQuery gh-1709)
+						uniqueCache = outerCache[ elem.uniqueID ] || (outerCache[ elem.uniqueID ] = {});
+
+						if ( skip && skip === elem.nodeName.toLowerCase() ) {
+							elem = elem[ dir ] || elem;
+						} else if ( (oldCache = uniqueCache[ key ]) &&
+							oldCache[ 0 ] === dirruns && oldCache[ 1 ] === doneName ) {
+
+							// Assign to newCache so results back-propagate to previous elements
+							return (newCache[ 2 ] = oldCache[ 2 ]);
+						} else {
+							// Reuse newcache so results back-propagate to previous elements
+							uniqueCache[ key ] = newCache;
+
+							// A match means we're done; a fail means we have to keep checking
+							if ( (newCache[ 2 ] = matcher( elem, context, xml )) ) {
+								return true;
+							}
+						}
+					}
+				}
+			}
+			return false;
+		};
+}
+
+function elementMatcher( matchers ) {
+	return matchers.length > 1 ?
+		function( elem, context, xml ) {
+			var i = matchers.length;
+			while ( i-- ) {
+				if ( !matchers[i]( elem, context, xml ) ) {
+					return false;
+				}
+			}
+			return true;
+		} :
+		matchers[0];
+}
+
+function multipleContexts( selector, contexts, results ) {
+	var i = 0,
+		len = contexts.length;
+	for ( ; i < len; i++ ) {
+		Sizzle( selector, contexts[i], results );
+	}
+	return results;
+}
+
+function condense( unmatched, map, filter, context, xml ) {
+	var elem,
+		newUnmatched = [],
+		i = 0,
+		len = unmatched.length,
+		mapped = map != null;
+
+	for ( ; i < len; i++ ) {
+		if ( (elem = unmatched[i]) ) {
+			if ( !filter || filter( elem, context, xml ) ) {
+				newUnmatched.push( elem );
+				if ( mapped ) {
+					map.push( i );
+				}
+			}
+		}
+	}
+
+	return newUnmatched;
+}
+
+function setMatcher( preFilter, selector, matcher, postFilter, postFinder, postSelector ) {
+	if ( postFilter && !postFilter[ expando ] ) {
+		postFilter = setMatcher( postFilter );
+	}
+	if ( postFinder && !postFinder[ expando ] ) {
+		postFinder = setMatcher( postFinder, postSelector );
+	}
+	return markFunction(function( seed, results, context, xml ) {
+		var temp, i, elem,
+			preMap = [],
+			postMap = [],
+			preexisting = results.length,
+
+			// Get initial elements from seed or context
+			elems = seed || multipleContexts( selector || "*", context.nodeType ? [ context ] : context, [] ),
+
+			// Prefilter to get matcher input, preserving a map for seed-results synchronization
+			matcherIn = preFilter && ( seed || !selector ) ?
+				condense( elems, preMap, preFilter, context, xml ) :
+				elems,
+
+			matcherOut = matcher ?
+				// If we have a postFinder, or filtered seed, or non-seed postFilter or preexisting results,
+				postFinder || ( seed ? preFilter : preexisting || postFilter ) ?
+
+					// ...intermediate processing is necessary
+					[] :
+
+					// ...otherwise use results directly
+					results :
+				matcherIn;
+
+		// Find primary matches
+		if ( matcher ) {
+			matcher( matcherIn, matcherOut, context, xml );
+		}
+
+		// Apply postFilter
+		if ( postFilter ) {
+			temp = condense( matcherOut, postMap );
+			postFilter( temp, [], context, xml );
+
+			// Un-match failing elements by moving them back to matcherIn
+			i = temp.length;
+			while ( i-- ) {
+				if ( (elem = temp[i]) ) {
+					matcherOut[ postMap[i] ] = !(matcherIn[ postMap[i] ] = elem);
+				}
+			}
+		}
+
+		if ( seed ) {
+			if ( postFinder || preFilter ) {
+				if ( postFinder ) {
+					// Get the final matcherOut by condensing this intermediate into postFinder contexts
+					temp = [];
+					i = matcherOut.length;
+					while ( i-- ) {
+						if ( (elem = matcherOut[i]) ) {
+							// Restore matcherIn since elem is not yet a final match
+							temp.push( (matcherIn[i] = elem) );
+						}
+					}
+					postFinder( null, (matcherOut = []), temp, xml );
+				}
+
+				// Move matched elements from seed to results to keep them synchronized
+				i = matcherOut.length;
+				while ( i-- ) {
+					if ( (elem = matcherOut[i]) &&
+						(temp = postFinder ? indexOf( seed, elem ) : preMap[i]) > -1 ) {
+
+						seed[temp] = !(results[temp] = elem);
+					}
+				}
+			}
+
+		// Add elements to results, through postFinder if defined
+		} else {
+			matcherOut = condense(
+				matcherOut === results ?
+					matcherOut.splice( preexisting, matcherOut.length ) :
+					matcherOut
+			);
+			if ( postFinder ) {
+				postFinder( null, results, matcherOut, xml );
+			} else {
+				push.apply( results, matcherOut );
+			}
+		}
+	});
+}
+
+function matcherFromTokens( tokens ) {
+	var checkContext, matcher, j,
+		len = tokens.length,
+		leadingRelative = Expr.relative[ tokens[0].type ],
+		implicitRelative = leadingRelative || Expr.relative[" "],
+		i = leadingRelative ? 1 : 0,
+
+		// The foundational matcher ensures that elements are reachable from top-level context(s)
+		matchContext = addCombinator( function( elem ) {
+			return elem === checkContext;
+		}, implicitRelative, true ),
+		matchAnyContext = addCombinator( function( elem ) {
+			return indexOf( checkContext, elem ) > -1;
+		}, implicitRelative, true ),
+		matchers = [ function( elem, context, xml ) {
+			var ret = ( !leadingRelative && ( xml || context !== outermostContext ) ) || (
+				(checkContext = context).nodeType ?
+					matchContext( elem, context, xml ) :
+					matchAnyContext( elem, context, xml ) );
+			// Avoid hanging onto element (issue #299)
+			checkContext = null;
+			return ret;
+		} ];
+
+	for ( ; i < len; i++ ) {
+		if ( (matcher = Expr.relative[ tokens[i].type ]) ) {
+			matchers = [ addCombinator(elementMatcher( matchers ), matcher) ];
+		} else {
+			matcher = Expr.filter[ tokens[i].type ].apply( null, tokens[i].matches );
+
+			// Return special upon seeing a positional matcher
+			if ( matcher[ expando ] ) {
+				// Find the next relative operator (if any) for proper handling
+				j = ++i;
+				for ( ; j < len; j++ ) {
+					if ( Expr.relative[ tokens[j].type ] ) {
+						break;
+					}
+				}
+				return setMatcher(
+					i > 1 && elementMatcher( matchers ),
+					i > 1 && toSelector(
+						// If the preceding token was a descendant combinator, insert an implicit any-element `*`
+						tokens.slice( 0, i - 1 ).concat({ value: tokens[ i - 2 ].type === " " ? "*" : "" })
+					).replace( rtrim, "$1" ),
+					matcher,
+					i < j && matcherFromTokens( tokens.slice( i, j ) ),
+					j < len && matcherFromTokens( (tokens = tokens.slice( j )) ),
+					j < len && toSelector( tokens )
+				);
+			}
+			matchers.push( matcher );
+		}
+	}
+
+	return elementMatcher( matchers );
+}
+
+function matcherFromGroupMatchers( elementMatchers, setMatchers ) {
+	var bySet = setMatchers.length > 0,
+		byElement = elementMatchers.length > 0,
+		superMatcher = function( seed, context, xml, results, outermost ) {
+			var elem, j, matcher,
+				matchedCount = 0,
+				i = "0",
+				unmatched = seed && [],
+				setMatched = [],
+				contextBackup = outermostContext,
+				// We must always have either seed elements or outermost context
+				elems = seed || byElement && Expr.find["TAG"]( "*", outermost ),
+				// Use integer dirruns iff this is the outermost matcher
+				dirrunsUnique = (dirruns += contextBackup == null ? 1 : Math.random() || 0.1),
+				len = elems.length;
+
+			if ( outermost ) {
+				outermostContext = context === document || context || outermost;
+			}
+
+			// Add elements passing elementMatchers directly to results
+			// Support: IE<9, Safari
+			// Tolerate NodeList properties (IE: "length"; Safari: <number>) matching elements by id
+			for ( ; i !== len && (elem = elems[i]) != null; i++ ) {
+				if ( byElement && elem ) {
+					j = 0;
+					if ( !context && elem.ownerDocument !== document ) {
+						setDocument( elem );
+						xml = !documentIsHTML;
+					}
+					while ( (matcher = elementMatchers[j++]) ) {
+						if ( matcher( elem, context || document, xml) ) {
+							results.push( elem );
+							break;
+						}
+					}
+					if ( outermost ) {
+						dirruns = dirrunsUnique;
+					}
+				}
+
+				// Track unmatched elements for set filters
+				if ( bySet ) {
+					// They will have gone through all possible matchers
+					if ( (elem = !matcher && elem) ) {
+						matchedCount--;
+					}
+
+					// Lengthen the array for every element, matched or not
+					if ( seed ) {
+						unmatched.push( elem );
+					}
+				}
+			}
+
+			// `i` is now the count of elements visited above, and adding it to `matchedCount`
+			// makes the latter nonnegative.
+			matchedCount += i;
+
+			// Apply set filters to unmatched elements
+			// NOTE: This can be skipped if there are no unmatched elements (i.e., `matchedCount`
+			// equals `i`), unless we didn't visit _any_ elements in the above loop because we have
+			// no element matchers and no seed.
+			// Incrementing an initially-string "0" `i` allows `i` to remain a string only in that
+			// case, which will result in a "00" `matchedCount` that differs from `i` but is also
+			// numerically zero.
+			if ( bySet && i !== matchedCount ) {
+				j = 0;
+				while ( (matcher = setMatchers[j++]) ) {
+					matcher( unmatched, setMatched, context, xml );
+				}
+
+				if ( seed ) {
+					// Reintegrate element matches to eliminate the need for sorting
+					if ( matchedCount > 0 ) {
+						while ( i-- ) {
+							if ( !(unmatched[i] || setMatched[i]) ) {
+								setMatched[i] = pop.call( results );
+							}
+						}
+					}
+
+					// Discard index placeholder values to get only actual matches
+					setMatched = condense( setMatched );
+				}
+
+				// Add matches to results
+				push.apply( results, setMatched );
+
+				// Seedless set matches succeeding multiple successful matchers stipulate sorting
+				if ( outermost && !seed && setMatched.length > 0 &&
+					( matchedCount + setMatchers.length ) > 1 ) {
+
+					Sizzle.uniqueSort( results );
+				}
+			}
+
+			// Override manipulation of globals by nested matchers
+			if ( outermost ) {
+				dirruns = dirrunsUnique;
+				outermostContext = contextBackup;
+			}
+
+			return unmatched;
+		};
+
+	return bySet ?
+		markFunction( superMatcher ) :
+		superMatcher;
+}
+
+compile = Sizzle.compile = function( selector, match /* Internal Use Only */ ) {
+	var i,
+		setMatchers = [],
+		elementMatchers = [],
+		cached = compilerCache[ selector + " " ];
+
+	if ( !cached ) {
+		// Generate a function of recursive functions that can be used to check each element
+		if ( !match ) {
+			match = tokenize( selector );
+		}
+		i = match.length;
+		while ( i-- ) {
+			cached = matcherFromTokens( match[i] );
+			if ( cached[ expando ] ) {
+				setMatchers.push( cached );
+			} else {
+				elementMatchers.push( cached );
+			}
+		}
+
+		// Cache the compiled function
+		cached = compilerCache( selector, matcherFromGroupMatchers( elementMatchers, setMatchers ) );
+
+		// Save selector and tokenization
+		cached.selector = selector;
+	}
+	return cached;
+};
+
+/**
+ * A low-level selection function that works with Sizzle's compiled
+ *  selector functions
+ * @param {String|Function} selector A selector or a pre-compiled
+ *  selector function built with Sizzle.compile
+ * @param {Element} context
+ * @param {Array} [results]
+ * @param {Array} [seed] A set of elements to match against
+ */
+select = Sizzle.select = function( selector, context, results, seed ) {
+	var i, tokens, token, type, find,
+		compiled = typeof selector === "function" && selector,
+		match = !seed && tokenize( (selector = compiled.selector || selector) );
+
+	results = results || [];
+
+	// Try to minimize operations if there is only one selector in the list and no seed
+	// (the latter of which guarantees us context)
+	if ( match.length === 1 ) {
+
+		// Reduce context if the leading compound selector is an ID
+		tokens = match[0] = match[0].slice( 0 );
+		if ( tokens.length > 2 && (token = tokens[0]).type === "ID" &&
+				context.nodeType === 9 && documentIsHTML && Expr.relative[ tokens[1].type ] ) {
+
+			context = ( Expr.find["ID"]( token.matches[0].replace(runescape, funescape), context ) || [] )[0];
+			if ( !context ) {
+				return results;
+
+			// Precompiled matchers will still verify ancestry, so step up a level
+			} else if ( compiled ) {
+				context = context.parentNode;
+			}
+
+			selector = selector.slice( tokens.shift().value.length );
+		}
+
+		// Fetch a seed set for right-to-left matching
+		i = matchExpr["needsContext"].test( selector ) ? 0 : tokens.length;
+		while ( i-- ) {
+			token = tokens[i];
+
+			// Abort if we hit a combinator
+			if ( Expr.relative[ (type = token.type) ] ) {
+				break;
+			}
+			if ( (find = Expr.find[ type ]) ) {
+				// Search, expanding context for leading sibling combinators
+				if ( (seed = find(
+					token.matches[0].replace( runescape, funescape ),
+					rsibling.test( tokens[0].type ) && testContext( context.parentNode ) || context
+				)) ) {
+
+					// If seed is empty or no tokens remain, we can return early
+					tokens.splice( i, 1 );
+					selector = seed.length && toSelector( tokens );
+					if ( !selector ) {
+						push.apply( results, seed );
+						return results;
+					}
+
+					break;
+				}
+			}
+		}
+	}
+
+	// Compile and execute a filtering function if one is not provided
+	// Provide `match` to avoid retokenization if we modified the selector above
+	( compiled || compile( selector, match ) )(
+		seed,
+		context,
+		!documentIsHTML,
+		results,
+		!context || rsibling.test( selector ) && testContext( context.parentNode ) || context
+	);
+	return results;
+};
+
+// One-time assignments
+
+// Sort stability
+support.sortStable = expando.split("").sort( sortOrder ).join("") === expando;
+
+// Support: Chrome 14-35+
+// Always assume duplicates if they aren't passed to the comparison function
+support.detectDuplicates = !!hasDuplicate;
+
+// Initialize against the default document
+setDocument();
+
+// Support: Webkit<537.32 - Safari 6.0.3/Chrome 25 (fixed in Chrome 27)
+// Detached nodes confoundingly follow *each other*
+support.sortDetached = assert(function( el ) {
+	// Should return 1, but returns 4 (following)
+	return el.compareDocumentPosition( document.createElement("fieldset") ) & 1;
+});
+
+// Support: IE<8
+// Prevent attribute/property "interpolation"
+// https://msdn.microsoft.com/en-us/library/ms536429%28VS.85%29.aspx
+if ( !assert(function( el ) {
+	el.innerHTML = "<a href='#'></a>";
+	return el.firstChild.getAttribute("href") === "#" ;
+}) ) {
+	addHandle( "type|href|height|width", function( elem, name, isXML ) {
+		if ( !isXML ) {
+			return elem.getAttribute( name, name.toLowerCase() === "type" ? 1 : 2 );
+		}
+	});
+}
+
+// Support: IE<9
+// Use defaultValue in place of getAttribute("value")
+if ( !support.attributes || !assert(function( el ) {
+	el.innerHTML = "<input/>";
+	el.firstChild.setAttribute( "value", "" );
+	return el.firstChild.getAttribute( "value" ) === "";
+}) ) {
+	addHandle( "value", function( elem, name, isXML ) {
+		if ( !isXML && elem.nodeName.toLowerCase() === "input" ) {
+			return elem.defaultValue;
+		}
+	});
+}
+
+// Support: IE<9
+// Use getAttributeNode to fetch booleans when getAttribute lies
+if ( !assert(function( el ) {
+	return el.getAttribute("disabled") == null;
+}) ) {
+	addHandle( booleans, function( elem, name, isXML ) {
+		var val;
+		if ( !isXML ) {
+			return elem[ name ] === true ? name.toLowerCase() :
+					(val = elem.getAttributeNode( name )) && val.specified ?
+					val.value :
+				null;
+		}
+	});
+}
+
+return Sizzle;
+
+})( window );
+
+
+
+jQuery.find = Sizzle;
+jQuery.expr = Sizzle.selectors;
+
+// Deprecated
+jQuery.expr[ ":" ] = jQuery.expr.pseudos;
+jQuery.uniqueSort = jQuery.unique = Sizzle.uniqueSort;
+jQuery.text = Sizzle.getText;
+jQuery.isXMLDoc = Sizzle.isXML;
+jQuery.contains = Sizzle.contains;
+jQuery.escapeSelector = Sizzle.escape;
+
+
+
+
+var dir = function( elem, dir, until ) {
+	var matched = [],
+		truncate = until !== undefined;
+
+	while ( ( elem = elem[ dir ] ) && elem.nodeType !== 9 ) {
+		if ( elem.nodeType === 1 ) {
+			if ( truncate && jQuery( elem ).is( until ) ) {
+				break;
+			}
+			matched.push( elem );
+		}
+	}
+	return matched;
+};
+
+
+var siblings = function( n, elem ) {
+	var matched = [];
+
+	for ( ; n; n = n.nextSibling ) {
+		if ( n.nodeType === 1 && n !== elem ) {
+			matched.push( n );
+		}
+	}
+
+	return matched;
+};
+
+
+var rneedsContext = jQuery.expr.match.needsContext;
+
+
+
+function nodeName( elem, name ) {
+
+  return elem.nodeName && elem.nodeName.toLowerCase() === name.toLowerCase();
+
+};
+var rsingleTag = ( /^<([a-z][^\/\0>:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i );
+
+
+
+// Implement the identical functionality for filter and not
+function winnow( elements, qualifier, not ) {
+	if ( isFunction( qualifier ) ) {
+		return jQuery.grep( elements, function( elem, i ) {
+			return !!qualifier.call( elem, i, elem ) !== not;
+		} );
+	}
+
+	// Single element
+	if ( qualifier.nodeType ) {
+		return jQuery.grep( elements, function( elem ) {
+			return ( elem === qualifier ) !== not;
+		} );
+	}
+
+	// Arraylike of elements (jQuery, arguments, Array)
+	if ( typeof qualifier !== "string" ) {
+		return jQuery.grep( elements, function( elem ) {
+			return ( indexOf.call( qualifier, elem ) > -1 ) !== not;
+		} );
+	}
+
+	// Filtered directly for both simple and complex selectors
+	return jQuery.filter( qualifier, elements, not );
+}
+
+jQuery.filter = function( expr, elems, not ) {
+	var elem = elems[ 0 ];
+
+	if ( not ) {
+		expr = ":not(" + expr + ")";
+	}
+
+	if ( elems.length === 1 && elem.nodeType === 1 ) {
+		return jQuery.find.matchesSelector( elem, expr ) ? [ elem ] : [];
+	}
+
+	return jQuery.find.matches( expr, jQuery.grep( elems, function( elem ) {
+		return elem.nodeType === 1;
+	} ) );
+};
+
+jQuery.fn.extend( {
+	find: function( selector ) {
+		var i, ret,
+			len = this.length,
+			self = this;
+
+		if ( typeof selector !== "string" ) {
+			return this.pushStack( jQuery( selector ).filter( function() {
+				for ( i = 0; i < len; i++ ) {
+					if ( jQuery.contains( self[ i ], this ) ) {
+						return true;
+					}
+				}
+			} ) );
+		}
+
+		ret = this.pushStack( [] );
+
+		for ( i = 0; i < len; i++ ) {
+			jQuery.find( selector, self[ i ], ret );
+		}
+
+		return len > 1 ? jQuery.uniqueSort( ret ) : ret;
+	},
+	filter: function( selector ) {
+		return this.pushStack( winnow( this, selector || [], false ) );
+	},
+	not: function( selector ) {
+		return this.pushStack( winnow( this, selector || [], true ) );
+	},
+	is: function( selector ) {
+		return !!winnow(
+			this,
+
+			// If this is a positional/relative selector, check membership in the returned set
+			// so $("p:first").is("p:last") won't return true for a doc with two "p".
+			typeof selector === "string" && rneedsContext.test( selector ) ?
+				jQuery( selector ) :
+				selector || [],
+			false
+		).length;
+	}
+} );
+
+
+// Initialize a jQuery object
+
+
+// A central reference to the root jQuery(document)
+var rootjQuery,
+
+	// A simple way to check for HTML strings
+	// Prioritize #id over <tag> to avoid XSS via location.hash (#9521)
+	// Strict HTML recognition (#11290: must start with <)
+	// Shortcut simple #id case for speed
+	rquickExpr = /^(?:\s*(<[\w\W]+>)[^>]*|#([\w-]+))$/,
+
+	init = jQuery.fn.init = function( selector, context, root ) {
+		var match, elem;
+
+		// HANDLE: $(""), $(null), $(undefined), $(false)
+		if ( !selector ) {
+			return this;
+		}
+
+		// Method init() accepts an alternate rootjQuery
+		// so migrate can support jQuery.sub (gh-2101)
+		root = root || rootjQuery;
+
+		// Handle HTML strings
+		if ( typeof selector === "string" ) {
+			if ( selector[ 0 ] === "<" &&
+				selector[ selector.length - 1 ] === ">" &&
+				selector.length >= 3 ) {
+
+				// Assume that strings that start and end with <> are HTML and skip the regex check
+				match = [ null, selector, null ];
+
+			} else {
+				match = rquickExpr.exec( selector );
+			}
+
+			// Match html or make sure no context is specified for #id
+			if ( match && ( match[ 1 ] || !context ) ) {
+
+				// HANDLE: $(html) -> $(array)
+				if ( match[ 1 ] ) {
+					context = context instanceof jQuery ? context[ 0 ] : context;
+
+					// Option to run scripts is true for back-compat
+					// Intentionally let the error be thrown if parseHTML is not present
+					jQuery.merge( this, jQuery.parseHTML(
+						match[ 1 ],
+						context && context.nodeType ? context.ownerDocument || context : document,
+						true
+					) );
+
+					// HANDLE: $(html, props)
+					if ( rsingleTag.test( match[ 1 ] ) && jQuery.isPlainObject( context ) ) {
+						for ( match in context ) {
+
+							// Properties of context are called as methods if possible
+							if ( isFunction( this[ match ] ) ) {
+								this[ match ]( context[ match ] );
+
+							// ...and otherwise set as attributes
+							} else {
+								this.attr( match, context[ match ] );
+							}
+						}
+					}
+
+					return this;
+
+				// HANDLE: $(#id)
+				} else {
+					elem = document.getElementById( match[ 2 ] );
+
+					if ( elem ) {
+
+						// Inject the element directly into the jQuery object
+						this[ 0 ] = elem;
+						this.length = 1;
+					}
+					return this;
+				}
+
+			// HANDLE: $(expr, $(...))
+			} else if ( !context || context.jquery ) {
+				return ( context || root ).find( selector );
+
+			// HANDLE: $(expr, context)
+			// (which is just equivalent to: $(context).find(expr)
+			} else {
+				return this.constructor( context ).find( selector );
+			}
+
+		// HANDLE: $(DOMElement)
+		} else if ( selector.nodeType ) {
+			this[ 0 ] = selector;
+			this.length = 1;
+			return this;
+
+		// HANDLE: $(function)
+		// Shortcut for document ready
+		} else if ( isFunction( selector ) ) {
+			return root.ready !== undefined ?
+				root.ready( selector ) :
+
+				// Execute immediately if ready is not present
+				selector( jQuery );
+		}
+
+		return jQuery.makeArray( selector, this );
+	};
+
+// Give the init function the jQuery prototype for later instantiation
+init.prototype = jQuery.fn;
+
+// Initialize central reference
+rootjQuery = jQuery( document );
+
+
+var rparentsprev = /^(?:parents|prev(?:Until|All))/,
+
+	// Methods guaranteed to produce a unique set when starting from a unique set
+	guaranteedUnique = {
+		children: true,
+		contents: true,
+		next: true,
+		prev: true
+	};
+
+jQuery.fn.extend( {
+	has: function( target ) {
+		var targets = jQuery( target, this ),
+			l = targets.length;
+
+		return this.filter( function() {
+			var i = 0;
+			for ( ; i < l; i++ ) {
+				if ( jQuery.contains( this, targets[ i ] ) ) {
+					return true;
+				}
+			}
+		} );
+	},
+
+	closest: function( selectors, context ) {
+		var cur,
+			i = 0,
+			l = this.length,
+			matched = [],
+			targets = typeof selectors !== "string" && jQuery( selectors );
+
+		// Positional selectors never match, since there's no _selection_ context
+		if ( !rneedsContext.test( selectors ) ) {
+			for ( ; i < l; i++ ) {
+				for ( cur = this[ i ]; cur && cur !== context; cur = cur.parentNode ) {
+
+					// Always skip document fragments
+					if ( cur.nodeType < 11 && ( targets ?
+						targets.index( cur ) > -1 :
+
+						// Don't pass non-elements to Sizzle
+						cur.nodeType === 1 &&
+							jQuery.find.matchesSelector( cur, selectors ) ) ) {
+
+						matched.push( cur );
+						break;
+					}
+				}
+			}
+		}
+
+		return this.pushStack( matched.length > 1 ? jQuery.uniqueSort( matched ) : matched );
+	},
+
+	// Determine the position of an element within the set
+	index: function( elem ) {
+
+		// No argument, return index in parent
+		if ( !elem ) {
+			return ( this[ 0 ] && this[ 0 ].parentNode ) ? this.first().prevAll().length : -1;
+		}
+
+		// Index in selector
+		if ( typeof elem === "string" ) {
+			return indexOf.call( jQuery( elem ), this[ 0 ] );
+		}
+
+		// Locate the position of the desired element
+		return indexOf.call( this,
+
+			// If it receives a jQuery object, the first element is used
+			elem.jquery ? elem[ 0 ] : elem
+		);
+	},
+
+	add: function( selector, context ) {
+		return this.pushStack(
+			jQuery.uniqueSort(
+				jQuery.merge( this.get(), jQuery( selector, context ) )
+			)
+		);
+	},
+
+	addBack: function( selector ) {
+		return this.add( selector == null ?
+			this.prevObject : this.prevObject.filter( selector )
+		);
+	}
+} );
+
+function sibling( cur, dir ) {
+	while ( ( cur = cur[ dir ] ) && cur.nodeType !== 1 ) {}
+	return cur;
+}
+
+jQuery.each( {
+	parent: function( elem ) {
+		var parent = elem.parentNode;
+		return parent && parent.nodeType !== 11 ? parent : null;
+	},
+	parents: function( elem ) {
+		return dir( elem, "parentNode" );
+	},
+	parentsUntil: function( elem, i, until ) {
+		return dir( elem, "parentNode", until );
+	},
+	next: function( elem ) {
+		return sibling( elem, "nextSibling" );
+	},
+	prev: function( elem ) {
+		return sibling( elem, "previousSibling" );
+	},
+	nextAll: function( elem ) {
+		return dir( elem, "nextSibling" );
+	},
+	prevAll: function( elem ) {
+		return dir( elem, "previousSibling" );
+	},
+	nextUntil: function( elem, i, until ) {
+		return dir( elem, "nextSibling", until );
+	},
+	prevUntil: function( elem, i, until ) {
+		return dir( elem, "previousSibling", until );
+	},
+	siblings: function( elem ) {
+		return siblings( ( elem.parentNode || {} ).firstChild, elem );
+	},
+	children: function( elem ) {
+		return siblings( elem.firstChild );
+	},
+	contents: function( elem ) {
+		if ( typeof elem.contentDocument !== "undefined" ) {
+			return elem.contentDocument;
+		}
+
+		// Support: IE 9 - 11 only, iOS 7 only, Android Browser <=4.3 only
+		// Treat the template element as a regular one in browsers that
+		// don't support it.
+		if ( nodeName( elem, "template" ) ) {
+			elem = elem.content || elem;
+		}
+
+		return jQuery.merge( [], elem.childNodes );
+	}
+}, function( name, fn ) {
+	jQuery.fn[ name ] = function( until, selector ) {
+		var matched = jQuery.map( this, fn, until );
+
+		if ( name.slice( -5 ) !== "Until" ) {
+			selector = until;
+		}
+
+		if ( selector && typeof selector === "string" ) {
+			matched = jQuery.filter( selector, matched );
+		}
+
+		if ( this.length > 1 ) {
+
+			// Remove duplicates
+			if ( !guaranteedUnique[ name ] ) {
+				jQuery.uniqueSort( matched );
+			}
+
+			// Reverse order for parents* and prev-derivatives
+			if ( rparentsprev.test( name ) ) {
+				matched.reverse();
+			}
+		}
+
+		return this.pushStack( matched );
+	};
+} );
+var rnothtmlwhite = ( /[^\x20\t\r\n\f]+/g );
+
+
+
+// Convert String-formatted options into Object-formatted ones
+function createOptions( options ) {
+	var object = {};
+	jQuery.each( options.match( rnothtmlwhite ) || [], function( _, flag ) {
+		object[ flag ] = true;
+	} );
+	return object;
+}
+
+/*
+ * Create a callback list using the following parameters:
+ *
+ *	options: an optional list of space-separated options that will change how
+ *			the callback list behaves or a more traditional option object
+ *
+ * By default a callback list will act like an event callback list and can be
+ * "fired" multiple times.
+ *
+ * Possible options:
+ *
+ *	once:			will ensure the callback list can only be fired once (like a Deferred)
+ *
+ *	memory:			will keep track of previous values and will call any callback added
+ *					after the list has been fired right away with the latest "memorized"
+ *					values (like a Deferred)
+ *
+ *	unique:			will ensure a callback can only be added once (no duplicate in the list)
+ *
+ *	stopOnFalse:	interrupt callings when a callback returns false
+ *
+ */
+jQuery.Callbacks = function( options ) {
+
+	// Convert options from String-formatted to Object-formatted if needed
+	// (we check in cache first)
+	options = typeof options === "string" ?
+		createOptions( options ) :
+		jQuery.extend( {}, options );
+
+	var // Flag to know if list is currently firing
+		firing,
+
+		// Last fire value for non-forgettable lists
+		memory,
+
+		// Flag to know if list was already fired
+		fired,
+
+		// Flag to prevent firing
+		locked,
+
+		// Actual callback list
+		list = [],
+
+		// Queue of execution data for repeatable lists
+		queue = [],
+
+		// Index of currently firing callback (modified by add/remove as needed)
+		firingIndex = -1,
+
+		// Fire callbacks
+		fire = function() {
+
+			// Enforce single-firing
+			locked = locked || options.once;
+
+			// Execute callbacks for all pending executions,
+			// respecting firingIndex overrides and runtime changes
+			fired = firing = true;
+			for ( ; queue.length; firingIndex = -1 ) {
+				memory = queue.shift();
+				while ( ++firingIndex < list.length ) {
+
+					// Run callback and check for early termination
+					if ( list[ firingIndex ].apply( memory[ 0 ], memory[ 1 ] ) === false &&
+						options.stopOnFalse ) {
+
+						// Jump to end and forget the data so .add doesn't re-fire
+						firingIndex = list.length;
+						memory = false;
+					}
+				}
+			}
+
+			// Forget the data if we're done with it
+			if ( !options.memory ) {
+				memory = false;
+			}
+
+			firing = false;
+
+			// Clean up if we're done firing for good
+			if ( locked ) {
+
+				// Keep an empty list if we have data for future add calls
+				if ( memory ) {
+					list = [];
+
+				// Otherwise, this object is spent
+				} else {
+					list = "";
+				}
+			}
+		},
+
+		// Actual Callbacks object
+		self = {
+
+			// Add a callback or a collection of callbacks to the list
+			add: function() {
+				if ( list ) {
+
+					// If we have memory from a past run, we should fire after adding
+					if ( memory && !firing ) {
+						firingIndex = list.length - 1;
+						queue.push( memory );
+					}
+
+					( function add( args ) {
+						jQuery.each( args, function( _, arg ) {
+							if ( isFunction( arg ) ) {
+								if ( !options.unique || !self.has( arg ) ) {
+									list.push( arg );
+								}
+							} else if ( arg && arg.length && toType( arg ) !== "string" ) {
+
+								// Inspect recursively
+								add( arg );
+							}
+						} );
+					} )( arguments );
+
+					if ( memory && !firing ) {
+						fire();
+					}
+				}
+				return this;
+			},
+
+			// Remove a callback from the list
+			remove: function() {
+				jQuery.each( arguments, function( _, arg ) {
+					var index;
+					while ( ( index = jQuery.inArray( arg, list, index ) ) > -1 ) {
+						list.splice( index, 1 );
+
+						// Handle firing indexes
+						if ( index <= firingIndex ) {
+							firingIndex--;
+						}
+					}
+				} );
+				return this;
+			},
+
+			// Check if a given callback is in the list.
+			// If no argument is given, return whether or not list has callbacks attached.
+			has: function( fn ) {
+				return fn ?
+					jQuery.inArray( fn, list ) > -1 :
+					list.length > 0;
+			},
+
+			// Remove all callbacks from the list
+			empty: function() {
+				if ( list ) {
+					list = [];
+				}
+				return this;
+			},
+
+			// Disable .fire and .add
+			// Abort any current/pending executions
+			// Clear all callbacks and values
+			disable: function() {
+				locked = queue = [];
+				list = memory = "";
+				return this;
+			},
+			disabled: function() {
+				return !list;
+			},
+
+			// Disable .fire
+			// Also disable .add unless we have memory (since it would have no effect)
+			// Abort any pending executions
+			lock: function() {
+				locked = queue = [];
+				if ( !memory && !firing ) {
+					list = memory = "";
+				}
+				return this;
+			},
+			locked: function() {
+				return !!locked;
+			},
+
+			// Call all callbacks with the given context and arguments
+			fireWith: function( context, args ) {
+				if ( !locked ) {
+					args = args || [];
+					args = [ context, args.slice ? args.slice() : args ];
+					queue.push( args );
+					if ( !firing ) {
+						fire();
+					}
+				}
+				return this;
+			},
+
+			// Call all the callbacks with the given arguments
+			fire: function() {
+				self.fireWith( this, arguments );
+				return this;
+			},
+
+			// To know if the callbacks have already been called at least once
+			fired: function() {
+				return !!fired;
+			}
+		};
+
+	return self;
+};
+
+
+function Identity( v ) {
+	return v;
+}
+function Thrower( ex ) {
+	throw ex;
+}
+
+function adoptValue( value, resolve, reject, noValue ) {
+	var method;
+
+	try {
+
+		// Check for promise aspect first to privilege synchronous behavior
+		if ( value && isFunction( ( method = value.promise ) ) ) {
+			method.call( value ).done( resolve ).fail( reject );
+
+		// Other thenables
+		} else if ( value && isFunction( ( method = value.then ) ) ) {
+			method.call( value, resolve, reject );
+
+		// Other non-thenables
+		} else {
+
+			// Control `resolve` arguments by letting Array#slice cast boolean `noValue` to integer:
+			// * false: [ value ].slice( 0 ) => resolve( value )
+			// * true: [ value ].slice( 1 ) => resolve()
+			resolve.apply( undefined, [ value ].slice( noValue ) );
+		}
+
+	// For Promises/A+, convert exceptions into rejections
+	// Since jQuery.when doesn't unwrap thenables, we can skip the extra checks appearing in
+	// Deferred#then to conditionally suppress rejection.
+	} catch ( value ) {
+
+		// Support: Android 4.0 only
+		// Strict mode functions invoked without .call/.apply get global-object context
+		reject.apply( undefined, [ value ] );
+	}
+}
+
+jQuery.extend( {
+
+	Deferred: function( func ) {
+		var tuples = [
+
+				// action, add listener, callbacks,
+				// ... .then handlers, argument index, [final state]
+				[ "notify", "progress", jQuery.Callbacks( "memory" ),
+					jQuery.Callbacks( "memory" ), 2 ],
+				[ "resolve", "done", jQuery.Callbacks( "once memory" ),
+					jQuery.Callbacks( "once memory" ), 0, "resolved" ],
+				[ "reject", "fail", jQuery.Callbacks( "once memory" ),
+					jQuery.Callbacks( "once memory" ), 1, "rejected" ]
+			],
+			state = "pending",
+			promise = {
+				state: function() {
+					return state;
+				},
+				always: function() {
+					deferred.done( arguments ).fail( arguments );
+					return this;
+				},
+				"catch": function( fn ) {
+					return promise.then( null, fn );
+				},
+
+				// Keep pipe for back-compat
+				pipe: function( /* fnDone, fnFail, fnProgress */ ) {
+					var fns = arguments;
+
+					return jQuery.Deferred( function( newDefer ) {
+						jQuery.each( tuples, function( i, tuple ) {
+
+							// Map tuples (progress, done, fail) to arguments (done, fail, progress)
+							var fn = isFunction( fns[ tuple[ 4 ] ] ) && fns[ tuple[ 4 ] ];
+
+							// deferred.progress(function() { bind to newDefer or newDefer.notify })
+							// deferred.done(function() { bind to newDefer or newDefer.resolve })
+							// deferred.fail(function() { bind to newDefer or newDefer.reject })
+							deferred[ tuple[ 1 ] ]( function() {
+								var returned = fn && fn.apply( this, arguments );
+								if ( returned && isFunction( returned.promise ) ) {
+									returned.promise()
+										.progress( newDefer.notify )
+										.done( newDefer.resolve )
+										.fail( newDefer.reject );
+								} else {
+									newDefer[ tuple[ 0 ] + "With" ](
+										this,
+										fn ? [ returned ] : arguments
+									);
+								}
+							} );
+						} );
+						fns = null;
+					} ).promise();
+				},
+				then: function( onFulfilled, onRejected, onProgress ) {
+					var maxDepth = 0;
+					function resolve( depth, deferred, handler, special ) {
+						return function() {
+							var that = this,
+								args = arguments,
+								mightThrow = function() {
+									var returned, then;
+
+									// Support: Promises/A+ section 2.3.3.3.3
+									// https://promisesaplus.com/#point-59
+									// Ignore double-resolution attempts
+									if ( depth < maxDepth ) {
+										return;
+									}
+
+									returned = handler.apply( that, args );
+
+									// Support: Promises/A+ section 2.3.1
+									// https://promisesaplus.com/#point-48
+									if ( returned === deferred.promise() ) {
+										throw new TypeError( "Thenable self-resolution" );
+									}
+
+									// Support: Promises/A+ sections 2.3.3.1, 3.5
+									// https://promisesaplus.com/#point-54
+									// https://promisesaplus.com/#point-75
+									// Retrieve `then` only once
+									then = returned &&
+
+										// Support: Promises/A+ section 2.3.4
+										// https://promisesaplus.com/#point-64
+										// Only check objects and functions for thenability
+										( typeof returned === "object" ||
+											typeof returned === "function" ) &&
+										returned.then;
+
+									// Handle a returned thenable
+									if ( isFunction( then ) ) {
+
+										// Special processors (notify) just wait for resolution
+										if ( special ) {
+											then.call(
+												returned,
+												resolve( maxDepth, deferred, Identity, special ),
+												resolve( maxDepth, deferred, Thrower, special )
+											);
+
+										// Normal processors (resolve) also hook into progress
+										} else {
+
+											// ...and disregard older resolution values
+											maxDepth++;
+
+											then.call(
+												returned,
+												resolve( maxDepth, deferred, Identity, special ),
+												resolve( maxDepth, deferred, Thrower, special ),
+												resolve( maxDepth, deferred, Identity,
+													deferred.notifyWith )
+											);
+										}
+
+									// Handle all other returned values
+									} else {
+
+										// Only substitute handlers pass on context
+										// and multiple values (non-spec behavior)
+										if ( handler !== Identity ) {
+											that = undefined;
+											args = [ returned ];
+										}
+
+										// Process the value(s)
+										// Default process is resolve
+										( special || deferred.resolveWith )( that, args );
+									}
+								},
+
+								// Only normal processors (resolve) catch and reject exceptions
+								process = special ?
+									mightThrow :
+									function() {
+										try {
+											mightThrow();
+										} catch ( e ) {
+
+											if ( jQuery.Deferred.exceptionHook ) {
+												jQuery.Deferred.exceptionHook( e,
+													process.stackTrace );
+											}
+
+											// Support: Promises/A+ section 2.3.3.3.4.1
+											// https://promisesaplus.com/#point-61
+											// Ignore post-resolution exceptions
+											if ( depth + 1 >= maxDepth ) {
+
+												// Only substitute handlers pass on context
+												// and multiple values (non-spec behavior)
+												if ( handler !== Thrower ) {
+													that = undefined;
+													args = [ e ];
+												}
+
+												deferred.rejectWith( that, args );
+											}
+										}
+									};
+
+							// Support: Promises/A+ section 2.3.3.3.1
+							// https://promisesaplus.com/#point-57
+							// Re-resolve promises immediately to dodge false rejection from
+							// subsequent errors
+							if ( depth ) {
+								process();
+							} else {
+
+								// Call an optional hook to record the stack, in case of exception
+								// since it's otherwise lost when execution goes async
+								if ( jQuery.Deferred.getStackHook ) {
+									process.stackTrace = jQuery.Deferred.getStackHook();
+								}
+								window.setTimeout( process );
+							}
+						};
+					}
+
+					return jQuery.Deferred( function( newDefer ) {
+
+						// progress_handlers.add( ... )
+						tuples[ 0 ][ 3 ].add(
+							resolve(
+								0,
+								newDefer,
+								isFunction( onProgress ) ?
+									onProgress :
+									Identity,
+								newDefer.notifyWith
+							)
+						);
+
+						// fulfilled_handlers.add( ... )
+						tuples[ 1 ][ 3 ].add(
+							resolve(
+								0,
+								newDefer,
+								isFunction( onFulfilled ) ?
+									onFulfilled :
+									Identity
+							)
+						);
+
+						// rejected_handlers.add( ... )
+						tuples[ 2 ][ 3 ].add(
+							resolve(
+								0,
+								newDefer,
+								isFunction( onRejected ) ?
+									onRejected :
+									Thrower
+							)
+						);
+					} ).promise();
+				},
+
+				// Get a promise for this deferred
+				// If obj is provided, the promise aspect is added to the object
+				promise: function( obj ) {
+					return obj != null ? jQuery.extend( obj, promise ) : promise;
+				}
+			},
+			deferred = {};
+
+		// Add list-specific methods
+		jQuery.each( tuples, function( i, tuple ) {
+			var list = tuple[ 2 ],
+				stateString = tuple[ 5 ];
+
+			// promise.progress = list.add
+			// promise.done = list.add
+			// promise.fail = list.add
+			promise[ tuple[ 1 ] ] = list.add;
+
+			// Handle state
+			if ( stateString ) {
+				list.add(
+					function() {
+
+						// state = "resolved" (i.e., fulfilled)
+						// state = "rejected"
+						state = stateString;
+					},
+
+					// rejected_callbacks.disable
+					// fulfilled_callbacks.disable
+					tuples[ 3 - i ][ 2 ].disable,
+
+					// rejected_handlers.disable
+					// fulfilled_handlers.disable
+					tuples[ 3 - i ][ 3 ].disable,
+
+					// progress_callbacks.lock
+					tuples[ 0 ][ 2 ].lock,
+
+					// progress_handlers.lock
+					tuples[ 0 ][ 3 ].lock
+				);
+			}
+
+			// progress_handlers.fire
+			// fulfilled_handlers.fire
+			// rejected_handlers.fire
+			list.add( tuple[ 3 ].fire );
+
+			// deferred.notify = function() { deferred.notifyWith(...) }
+			// deferred.resolve = function() { deferred.resolveWith(...) }
+			// deferred.reject = function() { deferred.rejectWith(...) }
+			deferred[ tuple[ 0 ] ] = function() {
+				deferred[ tuple[ 0 ] + "With" ]( this === deferred ? undefined : this, arguments );
+				return this;
+			};
+
+			// deferred.notifyWith = list.fireWith
+			// deferred.resolveWith = list.fireWith
+			// deferred.rejectWith = list.fireWith
+			deferred[ tuple[ 0 ] + "With" ] = list.fireWith;
+		} );
+
+		// Make the deferred a promise
+		promise.promise( deferred );
+
+		// Call given func if any
+		if ( func ) {
+			func.call( deferred, deferred );
+		}
+
+		// All done!
+		return deferred;
+	},
+
+	// Deferred helper
+	when: function( singleValue ) {
+		var
+
+			// count of uncompleted subordinates
+			remaining = arguments.length,
+
+			// count of unprocessed arguments
+			i = remaining,
+
+			// subordinate fulfillment data
+			resolveContexts = Array( i ),
+			resolveValues = slice.call( arguments ),
+
+			// the master Deferred
+			master = jQuery.Deferred(),
+
+			// subordinate callback factory
+			updateFunc = function( i ) {
+				return function( value ) {
+					resolveContexts[ i ] = this;
+					resolveValues[ i ] = arguments.length > 1 ? slice.call( arguments ) : value;
+					if ( !( --remaining ) ) {
+						master.resolveWith( resolveContexts, resolveValues );
+					}
+				};
+			};
+
+		// Single- and empty arguments are adopted like Promise.resolve
+		if ( remaining <= 1 ) {
+			adoptValue( singleValue, master.done( updateFunc( i ) ).resolve, master.reject,
+				!remaining );
+
+			// Use .then() to unwrap secondary thenables (cf. gh-3000)
+			if ( master.state() === "pending" ||
+				isFunction( resolveValues[ i ] && resolveValues[ i ].then ) ) {
+
+				return master.then();
+			}
+		}
+
+		// Multiple arguments are aggregated like Promise.all array elements
+		while ( i-- ) {
+			adoptValue( resolveValues[ i ], updateFunc( i ), master.reject );
+		}
+
+		return master.promise();
+	}
+} );
+
+
+// These usually indicate a programmer mistake during development,
+// warn about them ASAP rather than swallowing them by default.
+var rerrorNames = /^(Eval|Internal|Range|Reference|Syntax|Type|URI)Error$/;
+
+jQuery.Deferred.exceptionHook = function( error, stack ) {
+
+	// Support: IE 8 - 9 only
+	// Console exists when dev tools are open, which can happen at any time
+	if ( window.console && window.console.warn && error && rerrorNames.test( error.name ) ) {
+		window.console.warn( "jQuery.Deferred exception: " + error.message, error.stack, stack );
+	}
+};
+
+
+
+
+jQuery.readyException = function( error ) {
+	window.setTimeout( function() {
+		throw error;
+	} );
+};
+
+
+
+
+// The deferred used on DOM ready
+var readyList = jQuery.Deferred();
+
+jQuery.fn.ready = function( fn ) {
+
+	readyList
+		.then( fn )
+
+		// Wrap jQuery.readyException in a function so that the lookup
+		// happens at the time of error handling instead of callback
+		// registration.
+		.catch( function( error ) {
+			jQuery.readyException( error );
+		} );
+
+	return this;
+};
+
+jQuery.extend( {
+
+	// Is the DOM ready to be used? Set to true once it occurs.
+	isReady: false,
+
+	// A counter to track how many items to wait for before
+	// the ready event fires. See #6781
+	readyWait: 1,
+
+	// Handle when the DOM is ready
+	ready: function( wait ) {
+
+		// Abort if there are pending holds or we're already ready
+		if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) {
+			return;
+		}
+
+		// Remember that the DOM is ready
+		jQuery.isReady = true;
+
+		// If a normal DOM Ready event fired, decrement, and wait if need be
+		if ( wait !== true && --jQuery.readyWait > 0 ) {
+			return;
+		}
+
+		// If there are functions bound, to execute
+		readyList.resolveWith( document, [ jQuery ] );
+	}
+} );
+
+jQuery.ready.then = readyList.then;
+
+// The ready event handler and self cleanup method
+function completed() {
+	document.removeEventListener( "DOMContentLoaded", completed );
+	window.removeEventListener( "load", completed );
+	jQuery.ready();
+}
+
+// Catch cases where $(document).ready() is called
+// after the browser event has already occurred.
+// Support: IE <=9 - 10 only
+// Older IE sometimes signals "interactive" too soon
+if ( document.readyState === "complete" ||
+	( document.readyState !== "loading" && !document.documentElement.doScroll ) ) {
+
+	// Handle it asynchronously to allow scripts the opportunity to delay ready
+	window.setTimeout( jQuery.ready );
+
+} else {
+
+	// Use the handy event callback
+	document.addEventListener( "DOMContentLoaded", completed );
+
+	// A fallback to window.onload, that will always work
+	window.addEventListener( "load", completed );
+}
+
+
+
+
+// Multifunctional method to get and set values of a collection
+// The value/s can optionally be executed if it's a function
+var access = function( elems, fn, key, value, chainable, emptyGet, raw ) {
+	var i = 0,
+		len = elems.length,
+		bulk = key == null;
+
+	// Sets many values
+	if ( toType( key ) === "object" ) {
+		chainable = true;
+		for ( i in key ) {
+			access( elems, fn, i, key[ i ], true, emptyGet, raw );
+		}
+
+	// Sets one value
+	} else if ( value !== undefined ) {
+		chainable = true;
+
+		if ( !isFunction( value ) ) {
+			raw = true;
+		}
+
+		if ( bulk ) {
+
+			// Bulk operations run against the entire set
+			if ( raw ) {
+				fn.call( elems, value );
+				fn = null;
+
+			// ...except when executing function values
+			} else {
+				bulk = fn;
+				fn = function( elem, key, value ) {
+					return bulk.call( jQuery( elem ), value );
+				};
+			}
+		}
+
+		if ( fn ) {
+			for ( ; i < len; i++ ) {
+				fn(
+					elems[ i ], key, raw ?
+					value :
+					value.call( elems[ i ], i, fn( elems[ i ], key ) )
+				);
+			}
+		}
+	}
+
+	if ( chainable ) {
+		return elems;
+	}
+
+	// Gets
+	if ( bulk ) {
+		return fn.call( elems );
+	}
+
+	return len ? fn( elems[ 0 ], key ) : emptyGet;
+};
+
+
+// Matches dashed string for camelizing
+var rmsPrefix = /^-ms-/,
+	rdashAlpha = /-([a-z])/g;
+
+// Used by camelCase as callback to replace()
+function fcamelCase( all, letter ) {
+	return letter.toUpperCase();
+}
+
+// Convert dashed to camelCase; used by the css and data modules
+// Support: IE <=9 - 11, Edge 12 - 15
+// Microsoft forgot to hump their vendor prefix (#9572)
+function camelCase( string ) {
+	return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );
+}
+var acceptData = function( owner ) {
+
+	// Accepts only:
+	//  - Node
+	//    - Node.ELEMENT_NODE
+	//    - Node.DOCUMENT_NODE
+	//  - Object
+	//    - Any
+	return owner.nodeType === 1 || owner.nodeType === 9 || !( +owner.nodeType );
+};
+
+
+
+
+function Data() {
+	this.expando = jQuery.expando + Data.uid++;
+}
+
+Data.uid = 1;
+
+Data.prototype = {
+
+	cache: function( owner ) {
+
+		// Check if the owner object already has a cache
+		var value = owner[ this.expando ];
+
+		// If not, create one
+		if ( !value ) {
+			value = {};
+
+			// We can accept data for non-element nodes in modern browsers,
+			// but we should not, see #8335.
+			// Always return an empty object.
+			if ( acceptData( owner ) ) {
+
+				// If it is a node unlikely to be stringify-ed or looped over
+				// use plain assignment
+				if ( owner.nodeType ) {
+					owner[ this.expando ] = value;
+
+				// Otherwise secure it in a non-enumerable property
+				// configurable must be true to allow the property to be
+				// deleted when data is removed
+				} else {
+					Object.defineProperty( owner, this.expando, {
+						value: value,
+						configurable: true
+					} );
+				}
+			}
+		}
+
+		return value;
+	},
+	set: function( owner, data, value ) {
+		var prop,
+			cache = this.cache( owner );
+
+		// Handle: [ owner, key, value ] args
+		// Always use camelCase key (gh-2257)
+		if ( typeof data === "string" ) {
+			cache[ camelCase( data ) ] = value;
+
+		// Handle: [ owner, { properties } ] args
+		} else {
+
+			// Copy the properties one-by-one to the cache object
+			for ( prop in data ) {
+				cache[ camelCase( prop ) ] = data[ prop ];
+			}
+		}
+		return cache;
+	},
+	get: function( owner, key ) {
+		return key === undefined ?
+			this.cache( owner ) :
+
+			// Always use camelCase key (gh-2257)
+			owner[ this.expando ] && owner[ this.expando ][ camelCase( key ) ];
+	},
+	access: function( owner, key, value ) {
+
+		// In cases where either:
+		//
+		//   1. No key was specified
+		//   2. A string key was specified, but no value provided
+		//
+		// Take the "read" path and allow the get method to determine
+		// which value to return, respectively either:
+		//
+		//   1. The entire cache object
+		//   2. The data stored at the key
+		//
+		if ( key === undefined ||
+				( ( key && typeof key === "string" ) && value === undefined ) ) {
+
+			return this.get( owner, key );
+		}
+
+		// When the key is not a string, or both a key and value
+		// are specified, set or extend (existing objects) with either:
+		//
+		//   1. An object of properties
+		//   2. A key and value
+		//
+		this.set( owner, key, value );
+
+		// Since the "set" path can have two possible entry points
+		// return the expected data based on which path was taken[*]
+		return value !== undefined ? value : key;
+	},
+	remove: function( owner, key ) {
+		var i,
+			cache = owner[ this.expando ];
+
+		if ( cache === undefined ) {
+			return;
+		}
+
+		if ( key !== undefined ) {
+
+			// Support array or space separated string of keys
+			if ( Array.isArray( key ) ) {
+
+				// If key is an array of keys...
+				// We always set camelCase keys, so remove that.
+				key = key.map( camelCase );
+			} else {
+				key = camelCase( key );
+
+				// If a key with the spaces exists, use it.
+				// Otherwise, create an array by matching non-whitespace
+				key = key in cache ?
+					[ key ] :
+					( key.match( rnothtmlwhite ) || [] );
+			}
+
+			i = key.length;
+
+			while ( i-- ) {
+				delete cache[ key[ i ] ];
+			}
+		}
+
+		// Remove the expando if there's no more data
+		if ( key === undefined || jQuery.isEmptyObject( cache ) ) {
+
+			// Support: Chrome <=35 - 45
+			// Webkit & Blink performance suffers when deleting properties
+			// from DOM nodes, so set to undefined instead
+			// https://bugs.chromium.org/p/chromium/issues/detail?id=378607 (bug restricted)
+			if ( owner.nodeType ) {
+				owner[ this.expando ] = undefined;
+			} else {
+				delete owner[ this.expando ];
+			}
+		}
+	},
+	hasData: function( owner ) {
+		var cache = owner[ this.expando ];
+		return cache !== undefined && !jQuery.isEmptyObject( cache );
+	}
+};
+var dataPriv = new Data();
+
+var dataUser = new Data();
+
+
+
+//	Implementation Summary
+//
+//	1. Enforce API surface and semantic compatibility with 1.9.x branch
+//	2. Improve the module's maintainability by reducing the storage
+//		paths to a single mechanism.
+//	3. Use the same single mechanism to support "private" and "user" data.
+//	4. _Never_ expose "private" data to user code (TODO: Drop _data, _removeData)
+//	5. Avoid exposing implementation details on user objects (eg. expando properties)
+//	6. Provide a clear path for implementation upgrade to WeakMap in 2014
+
+var rbrace = /^(?:\{[\w\W]*\}|\[[\w\W]*\])$/,
+	rmultiDash = /[A-Z]/g;
+
+function getData( data ) {
+	if ( data === "true" ) {
+		return true;
+	}
+
+	if ( data === "false" ) {
+		return false;
+	}
+
+	if ( data === "null" ) {
+		return null;
+	}
+
+	// Only convert to a number if it doesn't change the string
+	if ( data === +data + "" ) {
+		return +data;
+	}
+
+	if ( rbrace.test( data ) ) {
+		return JSON.parse( data );
+	}
+
+	return data;
+}
+
+function dataAttr( elem, key, data ) {
+	var name;
+
+	// If nothing was found internally, try to fetch any
+	// data from the HTML5 data-* attribute
+	if ( data === undefined && elem.nodeType === 1 ) {
+		name = "data-" + key.replace( rmultiDash, "-$&" ).toLowerCase();
+		data = elem.getAttribute( name );
+
+		if ( typeof data === "string" ) {
+			try {
+				data = getData( data );
+			} catch ( e ) {}
+
+			// Make sure we set the data so it isn't changed later
+			dataUser.set( elem, key, data );
+		} else {
+			data = undefined;
+		}
+	}
+	return data;
+}
+
+jQuery.extend( {
+	hasData: function( elem ) {
+		return dataUser.hasData( elem ) || dataPriv.hasData( elem );
+	},
+
+	data: function( elem, name, data ) {
+		return dataUser.access( elem, name, data );
+	},
+
+	removeData: function( elem, name ) {
+		dataUser.remove( elem, name );
+	},
+
+	// TODO: Now that all calls to _data and _removeData have been replaced
+	// with direct calls to dataPriv methods, these can be deprecated.
+	_data: function( elem, name, data ) {
+		return dataPriv.access( elem, name, data );
+	},
+
+	_removeData: function( elem, name ) {
+		dataPriv.remove( elem, name );
+	}
+} );
+
+jQuery.fn.extend( {
+	data: function( key, value ) {
+		var i, name, data,
+			elem = this[ 0 ],
+			attrs = elem && elem.attributes;
+
+		// Gets all values
+		if ( key === undefined ) {
+			if ( this.length ) {
+				data = dataUser.get( elem );
+
+				if ( elem.nodeType === 1 && !dataPriv.get( elem, "hasDataAttrs" ) ) {
+					i = attrs.length;
+					while ( i-- ) {
+
+						// Support: IE 11 only
+						// The attrs elements can be null (#14894)
+						if ( attrs[ i ] ) {
+							name = attrs[ i ].name;
+							if ( name.indexOf( "data-" ) === 0 ) {
+								name = camelCase( name.slice( 5 ) );
+								dataAttr( elem, name, data[ name ] );
+							}
+						}
+					}
+					dataPriv.set( elem, "hasDataAttrs", true );
+				}
+			}
+
+			return data;
+		}
+
+		// Sets multiple values
+		if ( typeof key === "object" ) {
+			return this.each( function() {
+				dataUser.set( this, key );
+			} );
+		}
+
+		return access( this, function( value ) {
+			var data;
+
+			// The calling jQuery object (element matches) is not empty
+			// (and therefore has an element appears at this[ 0 ]) and the
+			// `value` parameter was not undefined. An empty jQuery object
+			// will result in `undefined` for elem = this[ 0 ] which will
+			// throw an exception if an attempt to read a data cache is made.
+			if ( elem && value === undefined ) {
+
+				// Attempt to get data from the cache
+				// The key will always be camelCased in Data
+				data = dataUser.get( elem, key );
+				if ( data !== undefined ) {
+					return data;
+				}
+
+				// Attempt to "discover" the data in
+				// HTML5 custom data-* attrs
+				data = dataAttr( elem, key );
+				if ( data !== undefined ) {
+					return data;
+				}
+
+				// We tried really hard, but the data doesn't exist.
+				return;
+			}
+
+			// Set the data...
+			this.each( function() {
+
+				// We always store the camelCased key
+				dataUser.set( this, key, value );
+			} );
+		}, null, value, arguments.length > 1, null, true );
+	},
+
+	removeData: function( key ) {
+		return this.each( function() {
+			dataUser.remove( this, key );
+		} );
+	}
+} );
+
+
+jQuery.extend( {
+	queue: function( elem, type, data ) {
+		var queue;
+
+		if ( elem ) {
+			type = ( type || "fx" ) + "queue";
+			queue = dataPriv.get( elem, type );
+
+			// Speed up dequeue by getting out quickly if this is just a lookup
+			if ( data ) {
+				if ( !queue || Array.isArray( data ) ) {
+					queue = dataPriv.access( elem, type, jQuery.makeArray( data ) );
+				} else {
+					queue.push( data );
+				}
+			}
+			return queue || [];
+		}
+	},
+
+	dequeue: function( elem, type ) {
+		type = type || "fx";
+
+		var queue = jQuery.queue( elem, type ),
+			startLength = queue.length,
+			fn = queue.shift(),
+			hooks = jQuery._queueHooks( elem, type ),
+			next = function() {
+				jQuery.dequeue( elem, type );
+			};
+
+		// If the fx queue is dequeued, always remove the progress sentinel
+		if ( fn === "inprogress" ) {
+			fn = queue.shift();
+			startLength--;
+		}
+
+		if ( fn ) {
+
+			// Add a progress sentinel to prevent the fx queue from being
+			// automatically dequeued
+			if ( type === "fx" ) {
+				queue.unshift( "inprogress" );
+			}
+
+			// Clear up the last queue stop function
+			delete hooks.stop;
+			fn.call( elem, next, hooks );
+		}
+
+		if ( !startLength && hooks ) {
+			hooks.empty.fire();
+		}
+	},
+
+	// Not public - generate a queueHooks object, or return the current one
+	_queueHooks: function( elem, type ) {
+		var key = type + "queueHooks";
+		return dataPriv.get( elem, key ) || dataPriv.access( elem, key, {
+			empty: jQuery.Callbacks( "once memory" ).add( function() {
+				dataPriv.remove( elem, [ type + "queue", key ] );
+			} )
+		} );
+	}
+} );
+
+jQuery.fn.extend( {
+	queue: function( type, data ) {
+		var setter = 2;
+
+		if ( typeof type !== "string" ) {
+			data = type;
+			type = "fx";
+			setter--;
+		}
+
+		if ( arguments.length < setter ) {
+			return jQuery.queue( this[ 0 ], type );
+		}
+
+		return data === undefined ?
+			this :
+			this.each( function() {
+				var queue = jQuery.queue( this, type, data );
+
+				// Ensure a hooks for this queue
+				jQuery._queueHooks( this, type );
+
+				if ( type === "fx" && queue[ 0 ] !== "inprogress" ) {
+					jQuery.dequeue( this, type );
+				}
+			} );
+	},
+	dequeue: function( type ) {
+		return this.each( function() {
+			jQuery.dequeue( this, type );
+		} );
+	},
+	clearQueue: function( type ) {
+		return this.queue( type || "fx", [] );
+	},
+
+	// Get a promise resolved when queues of a certain type
+	// are emptied (fx is the type by default)
+	promise: function( type, obj ) {
+		var tmp,
+			count = 1,
+			defer = jQuery.Deferred(),
+			elements = this,
+			i = this.length,
+			resolve = function() {
+				if ( !( --count ) ) {
+					defer.resolveWith( elements, [ elements ] );
+				}
+			};
+
+		if ( typeof type !== "string" ) {
+			obj = type;
+			type = undefined;
+		}
+		type = type || "fx";
+
+		while ( i-- ) {
+			tmp = dataPriv.get( elements[ i ], type + "queueHooks" );
+			if ( tmp && tmp.empty ) {
+				count++;
+				tmp.empty.add( resolve );
+			}
+		}
+		resolve();
+		return defer.promise( obj );
+	}
+} );
+var pnum = ( /[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/ ).source;
+
+var rcssNum = new RegExp( "^(?:([+-])=|)(" + pnum + ")([a-z%]*)$", "i" );
+
+
+var cssExpand = [ "Top", "Right", "Bottom", "Left" ];
+
+var documentElement = document.documentElement;
+
+
+
+	var isAttached = function( elem ) {
+			return jQuery.contains( elem.ownerDocument, elem );
+		},
+		composed = { composed: true };
+
+	// Support: IE 9 - 11+, Edge 12 - 18+, iOS 10.0 - 10.2 only
+	// Check attachment across shadow DOM boundaries when possible (gh-3504)
+	// Support: iOS 10.0-10.2 only
+	// Early iOS 10 versions support `attachShadow` but not `getRootNode`,
+	// leading to errors. We need to check for `getRootNode`.
+	if ( documentElement.getRootNode ) {
+		isAttached = function( elem ) {
+			return jQuery.contains( elem.ownerDocument, elem ) ||
+				elem.getRootNode( composed ) === elem.ownerDocument;
+		};
+	}
+var isHiddenWithinTree = function( elem, el ) {
+
+		// isHiddenWithinTree might be called from jQuery#filter function;
+		// in that case, element will be second argument
+		elem = el || elem;
+
+		// Inline style trumps all
+		return elem.style.display === "none" ||
+			elem.style.display === "" &&
+
+			// Otherwise, check computed style
+			// Support: Firefox <=43 - 45
+			// Disconnected elements can have computed display: none, so first confirm that elem is
+			// in the document.
+			isAttached( elem ) &&
+
+			jQuery.css( elem, "display" ) === "none";
+	};
+
+var swap = function( elem, options, callback, args ) {
+	var ret, name,
+		old = {};
+
+	// Remember the old values, and insert the new ones
+	for ( name in options ) {
+		old[ name ] = elem.style[ name ];
+		elem.style[ name ] = options[ name ];
+	}
+
+	ret = callback.apply( elem, args || [] );
+
+	// Revert the old values
+	for ( name in options ) {
+		elem.style[ name ] = old[ name ];
+	}
+
+	return ret;
+};
+
+
+
+
+function adjustCSS( elem, prop, valueParts, tween ) {
+	var adjusted, scale,
+		maxIterations = 20,
+		currentValue = tween ?
+			function() {
+				return tween.cur();
+			} :
+			function() {
+				return jQuery.css( elem, prop, "" );
+			},
+		initial = currentValue(),
+		unit = valueParts && valueParts[ 3 ] || ( jQuery.cssNumber[ prop ] ? "" : "px" ),
+
+		// Starting value computation is required for potential unit mismatches
+		initialInUnit = elem.nodeType &&
+			( jQuery.cssNumber[ prop ] || unit !== "px" && +initial ) &&
+			rcssNum.exec( jQuery.css( elem, prop ) );
+
+	if ( initialInUnit && initialInUnit[ 3 ] !== unit ) {
+
+		// Support: Firefox <=54
+		// Halve the iteration target value to prevent interference from CSS upper bounds (gh-2144)
+		initial = initial / 2;
+
+		// Trust units reported by jQuery.css
+		unit = unit || initialInUnit[ 3 ];
+
+		// Iteratively approximate from a nonzero starting point
+		initialInUnit = +initial || 1;
+
+		while ( maxIterations-- ) {
+
+			// Evaluate and update our best guess (doubling guesses that zero out).
+			// Finish if the scale equals or crosses 1 (making the old*new product non-positive).
+			jQuery.style( elem, prop, initialInUnit + unit );
+			if ( ( 1 - scale ) * ( 1 - ( scale = currentValue() / initial || 0.5 ) ) <= 0 ) {
+				maxIterations = 0;
+			}
+			initialInUnit = initialInUnit / scale;
+
+		}
+
+		initialInUnit = initialInUnit * 2;
+		jQuery.style( elem, prop, initialInUnit + unit );
+
+		// Make sure we update the tween properties later on
+		valueParts = valueParts || [];
+	}
+
+	if ( valueParts ) {
+		initialInUnit = +initialInUnit || +initial || 0;
+
+		// Apply relative offset (+=/-=) if specified
+		adjusted = valueParts[ 1 ] ?
+			initialInUnit + ( valueParts[ 1 ] + 1 ) * valueParts[ 2 ] :
+			+valueParts[ 2 ];
+		if ( tween ) {
+			tween.unit = unit;
+			tween.start = initialInUnit;
+			tween.end = adjusted;
+		}
+	}
+	return adjusted;
+}
+
+
+var defaultDisplayMap = {};
+
+function getDefaultDisplay( elem ) {
+	var temp,
+		doc = elem.ownerDocument,
+		nodeName = elem.nodeName,
+		display = defaultDisplayMap[ nodeName ];
+
+	if ( display ) {
+		return display;
+	}
+
+	temp = doc.body.appendChild( doc.createElement( nodeName ) );
+	display = jQuery.css( temp, "display" );
+
+	temp.parentNode.removeChild( temp );
+
+	if ( display === "none" ) {
+		display = "block";
+	}
+	defaultDisplayMap[ nodeName ] = display;
+
+	return display;
+}
+
+function showHide( elements, show ) {
+	var display, elem,
+		values = [],
+		index = 0,
+		length = elements.length;
+
+	// Determine new display value for elements that need to change
+	for ( ; index < length; index++ ) {
+		elem = elements[ index ];
+		if ( !elem.style ) {
+			continue;
+		}
+
+		display = elem.style.display;
+		if ( show ) {
+
+			// Since we force visibility upon cascade-hidden elements, an immediate (and slow)
+			// check is required in this first loop unless we have a nonempty display value (either
+			// inline or about-to-be-restored)
+			if ( display === "none" ) {
+				values[ index ] = dataPriv.get( elem, "display" ) || null;
+				if ( !values[ index ] ) {
+					elem.style.display = "";
+				}
+			}
+			if ( elem.style.display === "" && isHiddenWithinTree( elem ) ) {
+				values[ index ] = getDefaultDisplay( elem );
+			}
+		} else {
+			if ( display !== "none" ) {
+				values[ index ] = "none";
+
+				// Remember what we're overwriting
+				dataPriv.set( elem, "display", display );
+			}
+		}
+	}
+
+	// Set the display of the elements in a second loop to avoid constant reflow
+	for ( index = 0; index < length; index++ ) {
+		if ( values[ index ] != null ) {
+			elements[ index ].style.display = values[ index ];
+		}
+	}
+
+	return elements;
+}
+
+jQuery.fn.extend( {
+	show: function() {
+		return showHide( this, true );
+	},
+	hide: function() {
+		return showHide( this );
+	},
+	toggle: function( state ) {
+		if ( typeof state === "boolean" ) {
+			return state ? this.show() : this.hide();
+		}
+
+		return this.each( function() {
+			if ( isHiddenWithinTree( this ) ) {
+				jQuery( this ).show();
+			} else {
+				jQuery( this ).hide();
+			}
+		} );
+	}
+} );
+var rcheckableType = ( /^(?:checkbox|radio)$/i );
+
+var rtagName = ( /<([a-z][^\/\0>\x20\t\r\n\f]*)/i );
+
+var rscriptType = ( /^$|^module$|\/(?:java|ecma)script/i );
+
+
+
+// We have to close these tags to support XHTML (#13200)
+var wrapMap = {
+
+	// Support: IE <=9 only
+	option: [ 1, "<select multiple='multiple'>", "</select>" ],
+
+	// XHTML parsers do not magically insert elements in the
+	// same way that tag soup parsers do. So we cannot shorten
+	// this by omitting <tbody> or other required elements.
+	thead: [ 1, "<table>", "</table>" ],
+	col: [ 2, "<table><colgroup>", "</colgroup></table>" ],
+	tr: [ 2, "<table><tbody>", "</tbody></table>" ],
+	td: [ 3, "<table><tbody><tr>", "</tr></tbody></table>" ],
+
+	_default: [ 0, "", "" ]
+};
+
+// Support: IE <=9 only
+wrapMap.optgroup = wrapMap.option;
+
+wrapMap.tbody = wrapMap.tfoot = wrapMap.colgroup = wrapMap.caption = wrapMap.thead;
+wrapMap.th = wrapMap.td;
+
+
+function getAll( context, tag ) {
+
+	// Support: IE <=9 - 11 only
+	// Use typeof to avoid zero-argument method invocation on host objects (#15151)
+	var ret;
+
+	if ( typeof context.getElementsByTagName !== "undefined" ) {
+		ret = context.getElementsByTagName( tag || "*" );
+
+	} else if ( typeof context.querySelectorAll !== "undefined" ) {
+		ret = context.querySelectorAll( tag || "*" );
+
+	} else {
+		ret = [];
+	}
+
+	if ( tag === undefined || tag && nodeName( context, tag ) ) {
+		return jQuery.merge( [ context ], ret );
+	}
+
+	return ret;
+}
+
+
+// Mark scripts as having already been evaluated
+function setGlobalEval( elems, refElements ) {
+	var i = 0,
+		l = elems.length;
+
+	for ( ; i < l; i++ ) {
+		dataPriv.set(
+			elems[ i ],
+			"globalEval",
+			!refElements || dataPriv.get( refElements[ i ], "globalEval" )
+		);
+	}
+}
+
+
+var rhtml = /<|&#?\w+;/;
+
+function buildFragment( elems, context, scripts, selection, ignored ) {
+	var elem, tmp, tag, wrap, attached, j,
+		fragment = context.createDocumentFragment(),
+		nodes = [],
+		i = 0,
+		l = elems.length;
+
+	for ( ; i < l; i++ ) {
+		elem = elems[ i ];
+
+		if ( elem || elem === 0 ) {
+
+			// Add nodes directly
+			if ( toType( elem ) === "object" ) {
+
+				// Support: Android <=4.0 only, PhantomJS 1 only
+				// push.apply(_, arraylike) throws on ancient WebKit
+				jQuery.merge( nodes, elem.nodeType ? [ elem ] : elem );
+
+			// Convert non-html into a text node
+			} else if ( !rhtml.test( elem ) ) {
+				nodes.push( context.createTextNode( elem ) );
+
+			// Convert html into DOM nodes
+			} else {
+				tmp = tmp || fragment.appendChild( context.createElement( "div" ) );
+
+				// Deserialize a standard representation
+				tag = ( rtagName.exec( elem ) || [ "", "" ] )[ 1 ].toLowerCase();
+				wrap = wrapMap[ tag ] || wrapMap._default;
+				tmp.innerHTML = wrap[ 1 ] + jQuery.htmlPrefilter( elem ) + wrap[ 2 ];
+
+				// Descend through wrappers to the right content
+				j = wrap[ 0 ];
+				while ( j-- ) {
+					tmp = tmp.lastChild;
+				}
+
+				// Support: Android <=4.0 only, PhantomJS 1 only
+				// push.apply(_, arraylike) throws on ancient WebKit
+				jQuery.merge( nodes, tmp.childNodes );
+
+				// Remember the top-level container
+				tmp = fragment.firstChild;
+
+				// Ensure the created nodes are orphaned (#12392)
+				tmp.textContent = "";
+			}
+		}
+	}
+
+	// Remove wrapper from fragment
+	fragment.textContent = "";
+
+	i = 0;
+	while ( ( elem = nodes[ i++ ] ) ) {
+
+		// Skip elements already in the context collection (trac-4087)
+		if ( selection && jQuery.inArray( elem, selection ) > -1 ) {
+			if ( ignored ) {
+				ignored.push( elem );
+			}
+			continue;
+		}
+
+		attached = isAttached( elem );
+
+		// Append to fragment
+		tmp = getAll( fragment.appendChild( elem ), "script" );
+
+		// Preserve script evaluation history
+		if ( attached ) {
+			setGlobalEval( tmp );
+		}
+
+		// Capture executables
+		if ( scripts ) {
+			j = 0;
+			while ( ( elem = tmp[ j++ ] ) ) {
+				if ( rscriptType.test( elem.type || "" ) ) {
+					scripts.push( elem );
+				}
+			}
+		}
+	}
+
+	return fragment;
+}
+
+
+( function() {
+	var fragment = document.createDocumentFragment(),
+		div = fragment.appendChild( document.createElement( "div" ) ),
+		input = document.createElement( "input" );
+
+	// Support: Android 4.0 - 4.3 only
+	// Check state lost if the name is set (#11217)
+	// Support: Windows Web Apps (WWA)
+	// `name` and `type` must use .setAttribute for WWA (#14901)
+	input.setAttribute( "type", "radio" );
+	input.setAttribute( "checked", "checked" );
+	input.setAttribute( "name", "t" );
+
+	div.appendChild( input );
+
+	// Support: Android <=4.1 only
+	// Older WebKit doesn't clone checked state correctly in fragments
+	support.checkClone = div.cloneNode( true ).cloneNode( true ).lastChild.checked;
+
+	// Support: IE <=11 only
+	// Make sure textarea (and checkbox) defaultValue is properly cloned
+	div.innerHTML = "<textarea>x</textarea>";
+	support.noCloneChecked = !!div.cloneNode( true ).lastChild.defaultValue;
+} )();
+
+
+var
+	rkeyEvent = /^key/,
+	rmouseEvent = /^(?:mouse|pointer|contextmenu|drag|drop)|click/,
+	rtypenamespace = /^([^.]*)(?:\.(.+)|)/;
+
+function returnTrue() {
+	return true;
+}
+
+function returnFalse() {
+	return false;
+}
+
+// Support: IE <=9 - 11+
+// focus() and blur() are asynchronous, except when they are no-op.
+// So expect focus to be synchronous when the element is already active,
+// and blur to be synchronous when the element is not already active.
+// (focus and blur are always synchronous in other supported browsers,
+// this just defines when we can count on it).
+function expectSync( elem, type ) {
+	return ( elem === safeActiveElement() ) === ( type === "focus" );
+}
+
+// Support: IE <=9 only
+// Accessing document.activeElement can throw unexpectedly
+// https://bugs.jquery.com/ticket/13393
+function safeActiveElement() {
+	try {
+		return document.activeElement;
+	} catch ( err ) { }
+}
+
+function on( elem, types, selector, data, fn, one ) {
+	var origFn, type;
+
+	// Types can be a map of types/handlers
+	if ( typeof types === "object" ) {
+
+		// ( types-Object, selector, data )
+		if ( typeof selector !== "string" ) {
+
+			// ( types-Object, data )
+			data = data || selector;
+			selector = undefined;
+		}
+		for ( type in types ) {
+			on( elem, type, selector, data, types[ type ], one );
+		}
+		return elem;
+	}
+
+	if ( data == null && fn == null ) {
+
+		// ( types, fn )
+		fn = selector;
+		data = selector = undefined;
+	} else if ( fn == null ) {
+		if ( typeof selector === "string" ) {
+
+			// ( types, selector, fn )
+			fn = data;
+			data = undefined;
+		} else {
+
+			// ( types, data, fn )
+			fn = data;
+			data = selector;
+			selector = undefined;
+		}
+	}
+	if ( fn === false ) {
+		fn = returnFalse;
+	} else if ( !fn ) {
+		return elem;
+	}
+
+	if ( one === 1 ) {
+		origFn = fn;
+		fn = function( event ) {
+
+			// Can use an empty set, since event contains the info
+			jQuery().off( event );
+			return origFn.apply( this, arguments );
+		};
+
+		// Use same guid so caller can remove using origFn
+		fn.guid = origFn.guid || ( origFn.guid = jQuery.guid++ );
+	}
+	return elem.each( function() {
+		jQuery.event.add( this, types, fn, data, selector );
+	} );
+}
+
+/*
+ * Helper functions for managing events -- not part of the public interface.
+ * Props to Dean Edwards' addEvent library for many of the ideas.
+ */
+jQuery.event = {
+
+	global: {},
+
+	add: function( elem, types, handler, data, selector ) {
+
+		var handleObjIn, eventHandle, tmp,
+			events, t, handleObj,
+			special, handlers, type, namespaces, origType,
+			elemData = dataPriv.get( elem );
+
+		// Don't attach events to noData or text/comment nodes (but allow plain objects)
+		if ( !elemData ) {
+			return;
+		}
+
+		// Caller can pass in an object of custom data in lieu of the handler
+		if ( handler.handler ) {
+			handleObjIn = handler;
+			handler = handleObjIn.handler;
+			selector = handleObjIn.selector;
+		}
+
+		// Ensure that invalid selectors throw exceptions at attach time
+		// Evaluate against documentElement in case elem is a non-element node (e.g., document)
+		if ( selector ) {
+			jQuery.find.matchesSelector( documentElement, selector );
+		}
+
+		// Make sure that the handler has a unique ID, used to find/remove it later
+		if ( !handler.guid ) {
+			handler.guid = jQuery.guid++;
+		}
+
+		// Init the element's event structure and main handler, if this is the first
+		if ( !( events = elemData.events ) ) {
+			events = elemData.events = {};
+		}
+		if ( !( eventHandle = elemData.handle ) ) {
+			eventHandle = elemData.handle = function( e ) {
+
+				// Discard the second event of a jQuery.event.trigger() and
+				// when an event is called after a page has unloaded
+				return typeof jQuery !== "undefined" && jQuery.event.triggered !== e.type ?
+					jQuery.event.dispatch.apply( elem, arguments ) : undefined;
+			};
+		}
+
+		// Handle multiple events separated by a space
+		types = ( types || "" ).match( rnothtmlwhite ) || [ "" ];
+		t = types.length;
+		while ( t-- ) {
+			tmp = rtypenamespace.exec( types[ t ] ) || [];
+			type = origType = tmp[ 1 ];
+			namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort();
+
+			// There *must* be a type, no attaching namespace-only handlers
+			if ( !type ) {
+				continue;
+			}
+
+			// If event changes its type, use the special event handlers for the changed type
+			special = jQuery.event.special[ type ] || {};
+
+			// If selector defined, determine special event api type, otherwise given type
+			type = ( selector ? special.delegateType : special.bindType ) || type;
+
+			// Update special based on newly reset type
+			special = jQuery.event.special[ type ] || {};
+
+			// handleObj is passed to all event handlers
+			handleObj = jQuery.extend( {
+				type: type,
+				origType: origType,
+				data: data,
+				handler: handler,
+				guid: handler.guid,
+				selector: selector,
+				needsContext: selector && jQuery.expr.match.needsContext.test( selector ),
+				namespace: namespaces.join( "." )
+			}, handleObjIn );
+
+			// Init the event handler queue if we're the first
+			if ( !( handlers = events[ type ] ) ) {
+				handlers = events[ type ] = [];
+				handlers.delegateCount = 0;
+
+				// Only use addEventListener if the special events handler returns false
+				if ( !special.setup ||
+					special.setup.call( elem, data, namespaces, eventHandle ) === false ) {
+
+					if ( elem.addEventListener ) {
+						elem.addEventListener( type, eventHandle );
+					}
+				}
+			}
+
+			if ( special.add ) {
+				special.add.call( elem, handleObj );
+
+				if ( !handleObj.handler.guid ) {
+					handleObj.handler.guid = handler.guid;
+				}
+			}
+
+			// Add to the element's handler list, delegates in front
+			if ( selector ) {
+				handlers.splice( handlers.delegateCount++, 0, handleObj );
+			} else {
+				handlers.push( handleObj );
+			}
+
+			// Keep track of which events have ever been used, for event optimization
+			jQuery.event.global[ type ] = true;
+		}
+
+	},
+
+	// Detach an event or set of events from an element
+	remove: function( elem, types, handler, selector, mappedTypes ) {
+
+		var j, origCount, tmp,
+			events, t, handleObj,
+			special, handlers, type, namespaces, origType,
+			elemData = dataPriv.hasData( elem ) && dataPriv.get( elem );
+
+		if ( !elemData || !( events = elemData.events ) ) {
+			return;
+		}
+
+		// Once for each type.namespace in types; type may be omitted
+		types = ( types || "" ).match( rnothtmlwhite ) || [ "" ];
+		t = types.length;
+		while ( t-- ) {
+			tmp = rtypenamespace.exec( types[ t ] ) || [];
+			type = origType = tmp[ 1 ];
+			namespaces = ( tmp[ 2 ] || "" ).split( "." ).sort();
+
+			// Unbind all events (on this namespace, if provided) for the element
+			if ( !type ) {
+				for ( type in events ) {
+					jQuery.event.remove( elem, type + types[ t ], handler, selector, true );
+				}
+				continue;
+			}
+
+			special = jQuery.event.special[ type ] || {};
+			type = ( selector ? special.delegateType : special.bindType ) || type;
+			handlers = events[ type ] || [];
+			tmp = tmp[ 2 ] &&
+				new RegExp( "(^|\\.)" + namespaces.join( "\\.(?:.*\\.|)" ) + "(\\.|$)" );
+
+			// Remove matching events
+			origCount = j = handlers.length;
+			while ( j-- ) {
+				handleObj = handlers[ j ];
+
+				if ( ( mappedTypes || origType === handleObj.origType ) &&
+					( !handler || handler.guid === handleObj.guid ) &&
+					( !tmp || tmp.test( handleObj.namespace ) ) &&
+					( !selector || selector === handleObj.selector ||
+						selector === "**" && handleObj.selector ) ) {
+					handlers.splice( j, 1 );
+
+					if ( handleObj.selector ) {
+						handlers.delegateCount--;
+					}
+					if ( special.remove ) {
+						special.remove.call( elem, handleObj );
+					}
+				}
+			}
+
+			// Remove generic event handler if we removed something and no more handlers exist
+			// (avoids potential for endless recursion during removal of special event handlers)
+			if ( origCount && !handlers.length ) {
+				if ( !special.teardown ||
+					special.teardown.call( elem, namespaces, elemData.handle ) === false ) {
+
+					jQuery.removeEvent( elem, type, elemData.handle );
+				}
+
+				delete events[ type ];
+			}
+		}
+
+		// Remove data and the expando if it's no longer used
+		if ( jQuery.isEmptyObject( events ) ) {
+			dataPriv.remove( elem, "handle events" );
+		}
+	},
+
+	dispatch: function( nativeEvent ) {
+
+		// Make a writable jQuery.Event from the native event object
+		var event = jQuery.event.fix( nativeEvent );
+
+		var i, j, ret, matched, handleObj, handlerQueue,
+			args = new Array( arguments.length ),
+			handlers = ( dataPriv.get( this, "events" ) || {} )[ event.type ] || [],
+			special = jQuery.event.special[ event.type ] || {};
+
+		// Use the fix-ed jQuery.Event rather than the (read-only) native event
+		args[ 0 ] = event;
+
+		for ( i = 1; i < arguments.length; i++ ) {
+			args[ i ] = arguments[ i ];
+		}
+
+		event.delegateTarget = this;
+
+		// Call the preDispatch hook for the mapped type, and let it bail if desired
+		if ( special.preDispatch && special.preDispatch.call( this, event ) === false ) {
+			return;
+		}
+
+		// Determine handlers
+		handlerQueue = jQuery.event.handlers.call( this, event, handlers );
+
+		// Run delegates first; they may want to stop propagation beneath us
+		i = 0;
+		while ( ( matched = handlerQueue[ i++ ] ) && !event.isPropagationStopped() ) {
+			event.currentTarget = matched.elem;
+
+			j = 0;
+			while ( ( handleObj = matched.handlers[ j++ ] ) &&
+				!event.isImmediatePropagationStopped() ) {
+
+				// If the event is namespaced, then each handler is only invoked if it is
+				// specially universal or its namespaces are a superset of the event's.
+				if ( !event.rnamespace || handleObj.namespace === false ||
+					event.rnamespace.test( handleObj.namespace ) ) {
+
+					event.handleObj = handleObj;
+					event.data = handleObj.data;
+
+					ret = ( ( jQuery.event.special[ handleObj.origType ] || {} ).handle ||
+						handleObj.handler ).apply( matched.elem, args );
+
+					if ( ret !== undefined ) {
+						if ( ( event.result = ret ) === false ) {
+							event.preventDefault();
+							event.stopPropagation();
+						}
+					}
+				}
+			}
+		}
+
+		// Call the postDispatch hook for the mapped type
+		if ( special.postDispatch ) {
+			special.postDispatch.call( this, event );
+		}
+
+		return event.result;
+	},
+
+	handlers: function( event, handlers ) {
+		var i, handleObj, sel, matchedHandlers, matchedSelectors,
+			handlerQueue = [],
+			delegateCount = handlers.delegateCount,
+			cur = event.target;
+
+		// Find delegate handlers
+		if ( delegateCount &&
+
+			// Support: IE <=9
+			// Black-hole SVG <use> instance trees (trac-13180)
+			cur.nodeType &&
+
+			// Support: Firefox <=42
+			// Suppress spec-violating clicks indicating a non-primary pointer button (trac-3861)
+			// https://www.w3.org/TR/DOM-Level-3-Events/#event-type-click
+			// Support: IE 11 only
+			// ...but not arrow key "clicks" of radio inputs, which can have `button` -1 (gh-2343)
+			!( event.type === "click" && event.button >= 1 ) ) {
+
+			for ( ; cur !== this; cur = cur.parentNode || this ) {
+
+				// Don't check non-elements (#13208)
+				// Don't process clicks on disabled elements (#6911, #8165, #11382, #11764)
+				if ( cur.nodeType === 1 && !( event.type === "click" && cur.disabled === true ) ) {
+					matchedHandlers = [];
+					matchedSelectors = {};
+					for ( i = 0; i < delegateCount; i++ ) {
+						handleObj = handlers[ i ];
+
+						// Don't conflict with Object.prototype properties (#13203)
+						sel = handleObj.selector + " ";
+
+						if ( matchedSelectors[ sel ] === undefined ) {
+							matchedSelectors[ sel ] = handleObj.needsContext ?
+								jQuery( sel, this ).index( cur ) > -1 :
+								jQuery.find( sel, this, null, [ cur ] ).length;
+						}
+						if ( matchedSelectors[ sel ] ) {
+							matchedHandlers.push( handleObj );
+						}
+					}
+					if ( matchedHandlers.length ) {
+						handlerQueue.push( { elem: cur, handlers: matchedHandlers } );
+					}
+				}
+			}
+		}
+
+		// Add the remaining (directly-bound) handlers
+		cur = this;
+		if ( delegateCount < handlers.length ) {
+			handlerQueue.push( { elem: cur, handlers: handlers.slice( delegateCount ) } );
+		}
+
+		return handlerQueue;
+	},
+
+	addProp: function( name, hook ) {
+		Object.defineProperty( jQuery.Event.prototype, name, {
+			enumerable: true,
+			configurable: true,
+
+			get: isFunction( hook ) ?
+				function() {
+					if ( this.originalEvent ) {
+							return hook( this.originalEvent );
+					}
+				} :
+				function() {
+					if ( this.originalEvent ) {
+							return this.originalEvent[ name ];
+					}
+				},
+
+			set: function( value ) {
+				Object.defineProperty( this, name, {
+					enumerable: true,
+					configurable: true,
+					writable: true,
+					value: value
+				} );
+			}
+		} );
+	},
+
+	fix: function( originalEvent ) {
+		return originalEvent[ jQuery.expando ] ?
+			originalEvent :
+			new jQuery.Event( originalEvent );
+	},
+
+	special: {
+		load: {
+
+			// Prevent triggered image.load events from bubbling to window.load
+			noBubble: true
+		},
+		click: {
+
+			// Utilize native event to ensure correct state for checkable inputs
+			setup: function( data ) {
+
+				// For mutual compressibility with _default, replace `this` access with a local var.
+				// `|| data` is dead code meant only to preserve the variable through minification.
+				var el = this || data;
+
+				// Claim the first handler
+				if ( rcheckableType.test( el.type ) &&
+					el.click && nodeName( el, "input" ) ) {
+
+					// dataPriv.set( el, "click", ... )
+					leverageNative( el, "click", returnTrue );
+				}
+
+				// Return false to allow normal processing in the caller
+				return false;
+			},
+			trigger: function( data ) {
+
+				// For mutual compressibility with _default, replace `this` access with a local var.
+				// `|| data` is dead code meant only to preserve the variable through minification.
+				var el = this || data;
+
+				// Force setup before triggering a click
+				if ( rcheckableType.test( el.type ) &&
+					el.click && nodeName( el, "input" ) ) {
+
+					leverageNative( el, "click" );
+				}
+
+				// Return non-false to allow normal event-path propagation
+				return true;
+			},
+
+			// For cross-browser consistency, suppress native .click() on links
+			// Also prevent it if we're currently inside a leveraged native-event stack
+			_default: function( event ) {
+				var target = event.target;
+				return rcheckableType.test( target.type ) &&
+					target.click && nodeName( target, "input" ) &&
+					dataPriv.get( target, "click" ) ||
+					nodeName( target, "a" );
+			}
+		},
+
+		beforeunload: {
+			postDispatch: function( event ) {
+
+				// Support: Firefox 20+
+				// Firefox doesn't alert if the returnValue field is not set.
+				if ( event.result !== undefined && event.originalEvent ) {
+					event.originalEvent.returnValue = event.result;
+				}
+			}
+		}
+	}
+};
+
+// Ensure the presence of an event listener that handles manually-triggered
+// synthetic events by interrupting progress until reinvoked in response to
+// *native* events that it fires directly, ensuring that state changes have
+// already occurred before other listeners are invoked.
+function leverageNative( el, type, expectSync ) {
+
+	// Missing expectSync indicates a trigger call, which must force setup through jQuery.event.add
+	if ( !expectSync ) {
+		if ( dataPriv.get( el, type ) === undefined ) {
+			jQuery.event.add( el, type, returnTrue );
+		}
+		return;
+	}
+
+	// Register the controller as a special universal handler for all event namespaces
+	dataPriv.set( el, type, false );
+	jQuery.event.add( el, type, {
+		namespace: false,
+		handler: function( event ) {
+			var notAsync, result,
+				saved = dataPriv.get( this, type );
+
+			if ( ( event.isTrigger & 1 ) && this[ type ] ) {
+
+				// Interrupt processing of the outer synthetic .trigger()ed event
+				// Saved data should be false in such cases, but might be a leftover capture object
+				// from an async native handler (gh-4350)
+				if ( !saved.length ) {
+
+					// Store arguments for use when handling the inner native event
+					// There will always be at least one argument (an event object), so this array
+					// will not be confused with a leftover capture object.
+					saved = slice.call( arguments );
+					dataPriv.set( this, type, saved );
+
+					// Trigger the native event and capture its result
+					// Support: IE <=9 - 11+
+					// focus() and blur() are asynchronous
+					notAsync = expectSync( this, type );
+					this[ type ]();
+					result = dataPriv.get( this, type );
+					if ( saved !== result || notAsync ) {
+						dataPriv.set( this, type, false );
+					} else {
+						result = {};
+					}
+					if ( saved !== result ) {
+
+						// Cancel the outer synthetic event
+						event.stopImmediatePropagation();
+						event.preventDefault();
+						return result.value;
+					}
+
+				// If this is an inner synthetic event for an event with a bubbling surrogate
+				// (focus or blur), assume that the surrogate already propagated from triggering the
+				// native event and prevent that from happening again here.
+				// This technically gets the ordering wrong w.r.t. to `.trigger()` (in which the
+				// bubbling surrogate propagates *after* the non-bubbling base), but that seems
+				// less bad than duplication.
+				} else if ( ( jQuery.event.special[ type ] || {} ).delegateType ) {
+					event.stopPropagation();
+				}
+
+			// If this is a native event triggered above, everything is now in order
+			// Fire an inner synthetic event with the original arguments
+			} else if ( saved.length ) {
+
+				// ...and capture the result
+				dataPriv.set( this, type, {
+					value: jQuery.event.trigger(
+
+						// Support: IE <=9 - 11+
+						// Extend with the prototype to reset the above stopImmediatePropagation()
+						jQuery.extend( saved[ 0 ], jQuery.Event.prototype ),
+						saved.slice( 1 ),
+						this
+					)
+				} );
+
+				// Abort handling of the native event
+				event.stopImmediatePropagation();
+			}
+		}
+	} );
+}
+
+jQuery.removeEvent = function( elem, type, handle ) {
+
+	// This "if" is needed for plain objects
+	if ( elem.removeEventListener ) {
+		elem.removeEventListener( type, handle );
+	}
+};
+
+jQuery.Event = function( src, props ) {
+
+	// Allow instantiation without the 'new' keyword
+	if ( !( this instanceof jQuery.Event ) ) {
+		return new jQuery.Event( src, props );
+	}
+
+	// Event object
+	if ( src && src.type ) {
+		this.originalEvent = src;
+		this.type = src.type;
+
+		// Events bubbling up the document may have been marked as prevented
+		// by a handler lower down the tree; reflect the correct value.
+		this.isDefaultPrevented = src.defaultPrevented ||
+				src.defaultPrevented === undefined &&
+
+				// Support: Android <=2.3 only
+				src.returnValue === false ?
+			returnTrue :
+			returnFalse;
+
+		// Create target properties
+		// Support: Safari <=6 - 7 only
+		// Target should not be a text node (#504, #13143)
+		this.target = ( src.target && src.target.nodeType === 3 ) ?
+			src.target.parentNode :
+			src.target;
+
+		this.currentTarget = src.currentTarget;
+		this.relatedTarget = src.relatedTarget;
+
+	// Event type
+	} else {
+		this.type = src;
+	}
+
+	// Put explicitly provided properties onto the event object
+	if ( props ) {
+		jQuery.extend( this, props );
+	}
+
+	// Create a timestamp if incoming event doesn't have one
+	this.timeStamp = src && src.timeStamp || Date.now();
+
+	// Mark it as fixed
+	this[ jQuery.expando ] = true;
+};
+
+// jQuery.Event is based on DOM3 Events as specified by the ECMAScript Language Binding
+// https://www.w3.org/TR/2003/WD-DOM-Level-3-Events-20030331/ecma-script-binding.html
+jQuery.Event.prototype = {
+	constructor: jQuery.Event,
+	isDefaultPrevented: returnFalse,
+	isPropagationStopped: returnFalse,
+	isImmediatePropagationStopped: returnFalse,
+	isSimulated: false,
+
+	preventDefault: function() {
+		var e = this.originalEvent;
+
+		this.isDefaultPrevented = returnTrue;
+
+		if ( e && !this.isSimulated ) {
+			e.preventDefault();
+		}
+	},
+	stopPropagation: function() {
+		var e = this.originalEvent;
+
+		this.isPropagationStopped = returnTrue;
+
+		if ( e && !this.isSimulated ) {
+			e.stopPropagation();
+		}
+	},
+	stopImmediatePropagation: function() {
+		var e = this.originalEvent;
+
+		this.isImmediatePropagationStopped = returnTrue;
+
+		if ( e && !this.isSimulated ) {
+			e.stopImmediatePropagation();
+		}
+
+		this.stopPropagation();
+	}
+};
+
+// Includes all common event props including KeyEvent and MouseEvent specific props
+jQuery.each( {
+	altKey: true,
+	bubbles: true,
+	cancelable: true,
+	changedTouches: true,
+	ctrlKey: true,
+	detail: true,
+	eventPhase: true,
+	metaKey: true,
+	pageX: true,
+	pageY: true,
+	shiftKey: true,
+	view: true,
+	"char": true,
+	code: true,
+	charCode: true,
+	key: true,
+	keyCode: true,
+	button: true,
+	buttons: true,
+	clientX: true,
+	clientY: true,
+	offsetX: true,
+	offsetY: true,
+	pointerId: true,
+	pointerType: true,
+	screenX: true,
+	screenY: true,
+	targetTouches: true,
+	toElement: true,
+	touches: true,
+
+	which: function( event ) {
+		var button = event.button;
+
+		// Add which for key events
+		if ( event.which == null && rkeyEvent.test( event.type ) ) {
+			return event.charCode != null ? event.charCode : event.keyCode;
+		}
+
+		// Add which for click: 1 === left; 2 === middle; 3 === right
+		if ( !event.which && button !== undefined && rmouseEvent.test( event.type ) ) {
+			if ( button & 1 ) {
+				return 1;
+			}
+
+			if ( button & 2 ) {
+				return 3;
+			}
+
+			if ( button & 4 ) {
+				return 2;
+			}
+
+			return 0;
+		}
+
+		return event.which;
+	}
+}, jQuery.event.addProp );
+
+jQuery.each( { focus: "focusin", blur: "focusout" }, function( type, delegateType ) {
+	jQuery.event.special[ type ] = {
+
+		// Utilize native event if possible so blur/focus sequence is correct
+		setup: function() {
+
+			// Claim the first handler
+			// dataPriv.set( this, "focus", ... )
+			// dataPriv.set( this, "blur", ... )
+			leverageNative( this, type, expectSync );
+
+			// Return false to allow normal processing in the caller
+			return false;
+		},
+		trigger: function() {
+
+			// Force setup before trigger
+			leverageNative( this, type );
+
+			// Return non-false to allow normal event-path propagation
+			return true;
+		},
+
+		delegateType: delegateType
+	};
+} );
+
+// Create mouseenter/leave events using mouseover/out and event-time checks
+// so that event delegation works in jQuery.
+// Do the same for pointerenter/pointerleave and pointerover/pointerout
+//
+// Support: Safari 7 only
+// Safari sends mouseenter too often; see:
+// https://bugs.chromium.org/p/chromium/issues/detail?id=470258
+// for the description of the bug (it existed in older Chrome versions as well).
+jQuery.each( {
+	mouseenter: "mouseover",
+	mouseleave: "mouseout",
+	pointerenter: "pointerover",
+	pointerleave: "pointerout"
+}, function( orig, fix ) {
+	jQuery.event.special[ orig ] = {
+		delegateType: fix,
+		bindType: fix,
+
+		handle: function( event ) {
+			var ret,
+				target = this,
+				related = event.relatedTarget,
+				handleObj = event.handleObj;
+
+			// For mouseenter/leave call the handler if related is outside the target.
+			// NB: No relatedTarget if the mouse left/entered the browser window
+			if ( !related || ( related !== target && !jQuery.contains( target, related ) ) ) {
+				event.type = handleObj.origType;
+				ret = handleObj.handler.apply( this, arguments );
+				event.type = fix;
+			}
+			return ret;
+		}
+	};
+} );
+
+jQuery.fn.extend( {
+
+	on: function( types, selector, data, fn ) {
+		return on( this, types, selector, data, fn );
+	},
+	one: function( types, selector, data, fn ) {
+		return on( this, types, selector, data, fn, 1 );
+	},
+	off: function( types, selector, fn ) {
+		var handleObj, type;
+		if ( types && types.preventDefault && types.handleObj ) {
+
+			// ( event )  dispatched jQuery.Event
+			handleObj = types.handleObj;
+			jQuery( types.delegateTarget ).off(
+				handleObj.namespace ?
+					handleObj.origType + "." + handleObj.namespace :
+					handleObj.origType,
+				handleObj.selector,
+				handleObj.handler
+			);
+			return this;
+		}
+		if ( typeof types === "object" ) {
+
+			// ( types-object [, selector] )
+			for ( type in types ) {
+				this.off( type, selector, types[ type ] );
+			}
+			return this;
+		}
+		if ( selector === false || typeof selector === "function" ) {
+
+			// ( types [, fn] )
+			fn = selector;
+			selector = undefined;
+		}
+		if ( fn === false ) {
+			fn = returnFalse;
+		}
+		return this.each( function() {
+			jQuery.event.remove( this, types, fn, selector );
+		} );
+	}
+} );
+
+
+var
+
+	/* eslint-disable max-len */
+
+	// See https://github.com/eslint/eslint/issues/3229
+	rxhtmlTag = /<(?!area|br|col|embed|hr|img|input|link|meta|param)(([a-z][^\/\0>\x20\t\r\n\f]*)[^>]*)\/>/gi,
+
+	/* eslint-enable */
+
+	// Support: IE <=10 - 11, Edge 12 - 13 only
+	// In IE/Edge using regex groups here causes severe slowdowns.
+	// See https://connect.microsoft.com/IE/feedback/details/1736512/
+	rnoInnerhtml = /<script|<style|<link/i,
+
+	// checked="checked" or checked
+	rchecked = /checked\s*(?:[^=]|=\s*.checked.)/i,
+	rcleanScript = /^\s*<!(?:\[CDATA\[|--)|(?:\]\]|--)>\s*$/g;
+
+// Prefer a tbody over its parent table for containing new rows
+function manipulationTarget( elem, content ) {
+	if ( nodeName( elem, "table" ) &&
+		nodeName( content.nodeType !== 11 ? content : content.firstChild, "tr" ) ) {
+
+		return jQuery( elem ).children( "tbody" )[ 0 ] || elem;
+	}
+
+	return elem;
+}
+
+// Replace/restore the type attribute of script elements for safe DOM manipulation
+function disableScript( elem ) {
+	elem.type = ( elem.getAttribute( "type" ) !== null ) + "/" + elem.type;
+	return elem;
+}
+function restoreScript( elem ) {
+	if ( ( elem.type || "" ).slice( 0, 5 ) === "true/" ) {
+		elem.type = elem.type.slice( 5 );
+	} else {
+		elem.removeAttribute( "type" );
+	}
+
+	return elem;
+}
+
+function cloneCopyEvent( src, dest ) {
+	var i, l, type, pdataOld, pdataCur, udataOld, udataCur, events;
+
+	if ( dest.nodeType !== 1 ) {
+		return;
+	}
+
+	// 1. Copy private data: events, handlers, etc.
+	if ( dataPriv.hasData( src ) ) {
+		pdataOld = dataPriv.access( src );
+		pdataCur = dataPriv.set( dest, pdataOld );
+		events = pdataOld.events;
+
+		if ( events ) {
+			delete pdataCur.handle;
+			pdataCur.events = {};
+
+			for ( type in events ) {
+				for ( i = 0, l = events[ type ].length; i < l; i++ ) {
+					jQuery.event.add( dest, type, events[ type ][ i ] );
+				}
+			}
+		}
+	}
+
+	// 2. Copy user data
+	if ( dataUser.hasData( src ) ) {
+		udataOld = dataUser.access( src );
+		udataCur = jQuery.extend( {}, udataOld );
+
+		dataUser.set( dest, udataCur );
+	}
+}
+
+// Fix IE bugs, see support tests
+function fixInput( src, dest ) {
+	var nodeName = dest.nodeName.toLowerCase();
+
+	// Fails to persist the checked state of a cloned checkbox or radio button.
+	if ( nodeName === "input" && rcheckableType.test( src.type ) ) {
+		dest.checked = src.checked;
+
+	// Fails to return the selected option to the default selected state when cloning options
+	} else if ( nodeName === "input" || nodeName === "textarea" ) {
+		dest.defaultValue = src.defaultValue;
+	}
+}
+
+function domManip( collection, args, callback, ignored ) {
+
+	// Flatten any nested arrays
+	args = concat.apply( [], args );
+
+	var fragment, first, scripts, hasScripts, node, doc,
+		i = 0,
+		l = collection.length,
+		iNoClone = l - 1,
+		value = args[ 0 ],
+		valueIsFunction = isFunction( value );
+
+	// We can't cloneNode fragments that contain checked, in WebKit
+	if ( valueIsFunction ||
+			( l > 1 && typeof value === "string" &&
+				!support.checkClone && rchecked.test( value ) ) ) {
+		return collection.each( function( index ) {
+			var self = collection.eq( index );
+			if ( valueIsFunction ) {
+				args[ 0 ] = value.call( this, index, self.html() );
+			}
+			domManip( self, args, callback, ignored );
+		} );
+	}
+
+	if ( l ) {
+		fragment = buildFragment( args, collection[ 0 ].ownerDocument, false, collection, ignored );
+		first = fragment.firstChild;
+
+		if ( fragment.childNodes.length === 1 ) {
+			fragment = first;
+		}
+
+		// Require either new content or an interest in ignored elements to invoke the callback
+		if ( first || ignored ) {
+			scripts = jQuery.map( getAll( fragment, "script" ), disableScript );
+			hasScripts = scripts.length;
+
+			// Use the original fragment for the last item
+			// instead of the first because it can end up
+			// being emptied incorrectly in certain situations (#8070).
+			for ( ; i < l; i++ ) {
+				node = fragment;
+
+				if ( i !== iNoClone ) {
+					node = jQuery.clone( node, true, true );
+
+					// Keep references to cloned scripts for later restoration
+					if ( hasScripts ) {
+
+						// Support: Android <=4.0 only, PhantomJS 1 only
+						// push.apply(_, arraylike) throws on ancient WebKit
+						jQuery.merge( scripts, getAll( node, "script" ) );
+					}
+				}
+
+				callback.call( collection[ i ], node, i );
+			}
+
+			if ( hasScripts ) {
+				doc = scripts[ scripts.length - 1 ].ownerDocument;
+
+				// Reenable scripts
+				jQuery.map( scripts, restoreScript );
+
+				// Evaluate executable scripts on first document insertion
+				for ( i = 0; i < hasScripts; i++ ) {
+					node = scripts[ i ];
+					if ( rscriptType.test( node.type || "" ) &&
+						!dataPriv.access( node, "globalEval" ) &&
+						jQuery.contains( doc, node ) ) {
+
+						if ( node.src && ( node.type || "" ).toLowerCase()  !== "module" ) {
+
+							// Optional AJAX dependency, but won't run scripts if not present
+							if ( jQuery._evalUrl && !node.noModule ) {
+								jQuery._evalUrl( node.src, {
+									nonce: node.nonce || node.getAttribute( "nonce" )
+								} );
+							}
+						} else {
+							DOMEval( node.textContent.replace( rcleanScript, "" ), node, doc );
+						}
+					}
+				}
+			}
+		}
+	}
+
+	return collection;
+}
+
+function remove( elem, selector, keepData ) {
+	var node,
+		nodes = selector ? jQuery.filter( selector, elem ) : elem,
+		i = 0;
+
+	for ( ; ( node = nodes[ i ] ) != null; i++ ) {
+		if ( !keepData && node.nodeType === 1 ) {
+			jQuery.cleanData( getAll( node ) );
+		}
+
+		if ( node.parentNode ) {
+			if ( keepData && isAttached( node ) ) {
+				setGlobalEval( getAll( node, "script" ) );
+			}
+			node.parentNode.removeChild( node );
+		}
+	}
+
+	return elem;
+}
+
+jQuery.extend( {
+	htmlPrefilter: function( html ) {
+		return html.replace( rxhtmlTag, "<$1></$2>" );
+	},
+
+	clone: function( elem, dataAndEvents, deepDataAndEvents ) {
+		var i, l, srcElements, destElements,
+			clone = elem.cloneNode( true ),
+			inPage = isAttached( elem );
+
+		// Fix IE cloning issues
+		if ( !support.noCloneChecked && ( elem.nodeType === 1 || elem.nodeType === 11 ) &&
+				!jQuery.isXMLDoc( elem ) ) {
+
+			// We eschew Sizzle here for performance reasons: https://jsperf.com/getall-vs-sizzle/2
+			destElements = getAll( clone );
+			srcElements = getAll( elem );
+
+			for ( i = 0, l = srcElements.length; i < l; i++ ) {
+				fixInput( srcElements[ i ], destElements[ i ] );
+			}
+		}
+
+		// Copy the events from the original to the clone
+		if ( dataAndEvents ) {
+			if ( deepDataAndEvents ) {
+				srcElements = srcElements || getAll( elem );
+				destElements = destElements || getAll( clone );
+
+				for ( i = 0, l = srcElements.length; i < l; i++ ) {
+					cloneCopyEvent( srcElements[ i ], destElements[ i ] );
+				}
+			} else {
+				cloneCopyEvent( elem, clone );
+			}
+		}
+
+		// Preserve script evaluation history
+		destElements = getAll( clone, "script" );
+		if ( destElements.length > 0 ) {
+			setGlobalEval( destElements, !inPage && getAll( elem, "script" ) );
+		}
+
+		// Return the cloned set
+		return clone;
+	},
+
+	cleanData: function( elems ) {
+		var data, elem, type,
+			special = jQuery.event.special,
+			i = 0;
+
+		for ( ; ( elem = elems[ i ] ) !== undefined; i++ ) {
+			if ( acceptData( elem ) ) {
+				if ( ( data = elem[ dataPriv.expando ] ) ) {
+					if ( data.events ) {
+						for ( type in data.events ) {
+							if ( special[ type ] ) {
+								jQuery.event.remove( elem, type );
+
+							// This is a shortcut to avoid jQuery.event.remove's overhead
+							} else {
+								jQuery.removeEvent( elem, type, data.handle );
+							}
+						}
+					}
+
+					// Support: Chrome <=35 - 45+
+					// Assign undefined instead of using delete, see Data#remove
+					elem[ dataPriv.expando ] = undefined;
+				}
+				if ( elem[ dataUser.expando ] ) {
+
+					// Support: Chrome <=35 - 45+
+					// Assign undefined instead of using delete, see Data#remove
+					elem[ dataUser.expando ] = undefined;
+				}
+			}
+		}
+	}
+} );
+
+jQuery.fn.extend( {
+	detach: function( selector ) {
+		return remove( this, selector, true );
+	},
+
+	remove: function( selector ) {
+		return remove( this, selector );
+	},
+
+	text: function( value ) {
+		return access( this, function( value ) {
+			return value === undefined ?
+				jQuery.text( this ) :
+				this.empty().each( function() {
+					if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
+						this.textContent = value;
+					}
+				} );
+		}, null, value, arguments.length );
+	},
+
+	append: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
+				var target = manipulationTarget( this, elem );
+				target.appendChild( elem );
+			}
+		} );
+	},
+
+	prepend: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.nodeType === 1 || this.nodeType === 11 || this.nodeType === 9 ) {
+				var target = manipulationTarget( this, elem );
+				target.insertBefore( elem, target.firstChild );
+			}
+		} );
+	},
+
+	before: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.parentNode ) {
+				this.parentNode.insertBefore( elem, this );
+			}
+		} );
+	},
+
+	after: function() {
+		return domManip( this, arguments, function( elem ) {
+			if ( this.parentNode ) {
+				this.parentNode.insertBefore( elem, this.nextSibling );
+			}
+		} );
+	},
+
+	empty: function() {
+		var elem,
+			i = 0;
+
+		for ( ; ( elem = this[ i ] ) != null; i++ ) {
+			if ( elem.nodeType === 1 ) {
+
+				// Prevent memory leaks
+				jQuery.cleanData( getAll( elem, false ) );
+
+				// Remove any remaining nodes
+				elem.textContent = "";
+			}
+		}
+
+		return this;
+	},
+
+	clone: function( dataAndEvents, deepDataAndEvents ) {
+		dataAndEvents = dataAndEvents == null ? false : dataAndEvents;
+		deepDataAndEvents = deepDataAndEvents == null ? dataAndEvents : deepDataAndEvents;
+
+		return this.map( function() {
+			return jQuery.clone( this, dataAndEvents, deepDataAndEvents );
+		} );
+	},
+
+	html: function( value ) {
+		return access( this, function( value ) {
+			var elem = this[ 0 ] || {},
+				i = 0,
+				l = this.length;
+
+			if ( value === undefined && elem.nodeType === 1 ) {
+				return elem.innerHTML;
+			}
+
+			// See if we can take a shortcut and just use innerHTML
+			if ( typeof value === "string" && !rnoInnerhtml.test( value ) &&
+				!wrapMap[ ( rtagName.exec( value ) || [ "", "" ] )[ 1 ].toLowerCase() ] ) {
+
+				value = jQuery.htmlPrefilter( value );
+
+				try {
+					for ( ; i < l; i++ ) {
+						elem = this[ i ] || {};
+
+						// Remove element nodes and prevent memory leaks
+						if ( elem.nodeType === 1 ) {
+							jQuery.cleanData( getAll( elem, false ) );
+							elem.innerHTML = value;
+						}
+					}
+
+					elem = 0;
+
+				// If using innerHTML throws an exception, use the fallback method
+				} catch ( e ) {}
+			}
+
+			if ( elem ) {
+				this.empty().append( value );
+			}
+		}, null, value, arguments.length );
+	},
+
+	replaceWith: function() {
+		var ignored = [];
+
+		// Make the changes, replacing each non-ignored context element with the new content
+		return domManip( this, arguments, function( elem ) {
+			var parent = this.parentNode;
+
+			if ( jQuery.inArray( this, ignored ) < 0 ) {
+				jQuery.cleanData( getAll( this ) );
+				if ( parent ) {
+					parent.replaceChild( elem, this );
+				}
+			}
+
+		// Force callback invocation
+		}, ignored );
+	}
+} );
+
+jQuery.each( {
+	appendTo: "append",
+	prependTo: "prepend",
+	insertBefore: "before",
+	insertAfter: "after",
+	replaceAll: "replaceWith"
+}, function( name, original ) {
+	jQuery.fn[ name ] = function( selector ) {
+		var elems,
+			ret = [],
+			insert = jQuery( selector ),
+			last = insert.length - 1,
+			i = 0;
+
+		for ( ; i <= last; i++ ) {
+			elems = i === last ? this : this.clone( true );
+			jQuery( insert[ i ] )[ original ]( elems );
+
+			// Support: Android <=4.0 only, PhantomJS 1 only
+			// .get() because push.apply(_, arraylike) throws on ancient WebKit
+			push.apply( ret, elems.get() );
+		}
+
+		return this.pushStack( ret );
+	};
+} );
+var rnumnonpx = new RegExp( "^(" + pnum + ")(?!px)[a-z%]+$", "i" );
+
+var getStyles = function( elem ) {
+
+		// Support: IE <=11 only, Firefox <=30 (#15098, #14150)
+		// IE throws on elements created in popups
+		// FF meanwhile throws on frame elements through "defaultView.getComputedStyle"
+		var view = elem.ownerDocument.defaultView;
+
+		if ( !view || !view.opener ) {
+			view = window;
+		}
+
+		return view.getComputedStyle( elem );
+	};
+
+var rboxStyle = new RegExp( cssExpand.join( "|" ), "i" );
+
+
+
+( function() {
+
+	// Executing both pixelPosition & boxSizingReliable tests require only one layout
+	// so they're executed at the same time to save the second computation.
+	function computeStyleTests() {
+
+		// This is a singleton, we need to execute it only once
+		if ( !div ) {
+			return;
+		}
+
+		container.style.cssText = "position:absolute;left:-11111px;width:60px;" +
+			"margin-top:1px;padding:0;border:0";
+		div.style.cssText =
+			"position:relative;display:block;box-sizing:border-box;overflow:scroll;" +
+			"margin:auto;border:1px;padding:1px;" +
+			"width:60%;top:1%";
+		documentElement.appendChild( container ).appendChild( div );
+
+		var divStyle = window.getComputedStyle( div );
+		pixelPositionVal = divStyle.top !== "1%";
+
+		// Support: Android 4.0 - 4.3 only, Firefox <=3 - 44
+		reliableMarginLeftVal = roundPixelMeasures( divStyle.marginLeft ) === 12;
+
+		// Support: Android 4.0 - 4.3 only, Safari <=9.1 - 10.1, iOS <=7.0 - 9.3
+		// Some styles come back with percentage values, even though they shouldn't
+		div.style.right = "60%";
+		pixelBoxStylesVal = roundPixelMeasures( divStyle.right ) === 36;
+
+		// Support: IE 9 - 11 only
+		// Detect misreporting of content dimensions for box-sizing:border-box elements
+		boxSizingReliableVal = roundPixelMeasures( divStyle.width ) === 36;
+
+		// Support: IE 9 only
+		// Detect overflow:scroll screwiness (gh-3699)
+		// Support: Chrome <=64
+		// Don't get tricked when zoom affects offsetWidth (gh-4029)
+		div.style.position = "absolute";
+		scrollboxSizeVal = roundPixelMeasures( div.offsetWidth / 3 ) === 12;
+
+		documentElement.removeChild( container );
+
+		// Nullify the div so it wouldn't be stored in the memory and
+		// it will also be a sign that checks already performed
+		div = null;
+	}
+
+	function roundPixelMeasures( measure ) {
+		return Math.round( parseFloat( measure ) );
+	}
+
+	var pixelPositionVal, boxSizingReliableVal, scrollboxSizeVal, pixelBoxStylesVal,
+		reliableMarginLeftVal,
+		container = document.createElement( "div" ),
+		div = document.createElement( "div" );
+
+	// Finish early in limited (non-browser) environments
+	if ( !div.style ) {
+		return;
+	}
+
+	// Support: IE <=9 - 11 only
+	// Style of cloned element affects source element cloned (#8908)
+	div.style.backgroundClip = "content-box";
+	div.cloneNode( true ).style.backgroundClip = "";
+	support.clearCloneStyle = div.style.backgroundClip === "content-box";
+
+	jQuery.extend( support, {
+		boxSizingReliable: function() {
+			computeStyleTests();
+			return boxSizingReliableVal;
+		},
+		pixelBoxStyles: function() {
+			computeStyleTests();
+			return pixelBoxStylesVal;
+		},
+		pixelPosition: function() {
+			computeStyleTests();
+			return pixelPositionVal;
+		},
+		reliableMarginLeft: function() {
+			computeStyleTests();
+			return reliableMarginLeftVal;
+		},
+		scrollboxSize: function() {
+			computeStyleTests();
+			return scrollboxSizeVal;
+		}
+	} );
+} )();
+
+
+function curCSS( elem, name, computed ) {
+	var width, minWidth, maxWidth, ret,
+
+		// Support: Firefox 51+
+		// Retrieving style before computed somehow
+		// fixes an issue with getting wrong values
+		// on detached elements
+		style = elem.style;
+
+	computed = computed || getStyles( elem );
+
+	// getPropertyValue is needed for:
+	//   .css('filter') (IE 9 only, #12537)
+	//   .css('--customProperty) (#3144)
+	if ( computed ) {
+		ret = computed.getPropertyValue( name ) || computed[ name ];
+
+		if ( ret === "" && !isAttached( elem ) ) {
+			ret = jQuery.style( elem, name );
+		}
+
+		// A tribute to the "awesome hack by Dean Edwards"
+		// Android Browser returns percentage for some values,
+		// but width seems to be reliably pixels.
+		// This is against the CSSOM draft spec:
+		// https://drafts.csswg.org/cssom/#resolved-values
+		if ( !support.pixelBoxStyles() && rnumnonpx.test( ret ) && rboxStyle.test( name ) ) {
+
+			// Remember the original values
+			width = style.width;
+			minWidth = style.minWidth;
+			maxWidth = style.maxWidth;
+
+			// Put in the new values to get a computed value out
+			style.minWidth = style.maxWidth = style.width = ret;
+			ret = computed.width;
+
+			// Revert the changed values
+			style.width = width;
+			style.minWidth = minWidth;
+			style.maxWidth = maxWidth;
+		}
+	}
+
+	return ret !== undefined ?
+
+		// Support: IE <=9 - 11 only
+		// IE returns zIndex value as an integer.
+		ret + "" :
+		ret;
+}
+
+
+function addGetHookIf( conditionFn, hookFn ) {
+
+	// Define the hook, we'll check on the first run if it's really needed.
+	return {
+		get: function() {
+			if ( conditionFn() ) {
+
+				// Hook not needed (or it's not possible to use it due
+				// to missing dependency), remove it.
+				delete this.get;
+				return;
+			}
+
+			// Hook needed; redefine it so that the support test is not executed again.
+			return ( this.get = hookFn ).apply( this, arguments );
+		}
+	};
+}
+
+
+var cssPrefixes = [ "Webkit", "Moz", "ms" ],
+	emptyStyle = document.createElement( "div" ).style,
+	vendorProps = {};
+
+// Return a vendor-prefixed property or undefined
+function vendorPropName( name ) {
+
+	// Check for vendor prefixed names
+	var capName = name[ 0 ].toUpperCase() + name.slice( 1 ),
+		i = cssPrefixes.length;
+
+	while ( i-- ) {
+		name = cssPrefixes[ i ] + capName;
+		if ( name in emptyStyle ) {
+			return name;
+		}
+	}
+}
+
+// Return a potentially-mapped jQuery.cssProps or vendor prefixed property
+function finalPropName( name ) {
+	var final = jQuery.cssProps[ name ] || vendorProps[ name ];
+
+	if ( final ) {
+		return final;
+	}
+	if ( name in emptyStyle ) {
+		return name;
+	}
+	return vendorProps[ name ] = vendorPropName( name ) || name;
+}
+
+
+var
+
+	// Swappable if display is none or starts with table
+	// except "table", "table-cell", or "table-caption"
+	// See here for display values: https://developer.mozilla.org/en-US/docs/CSS/display
+	rdisplayswap = /^(none|table(?!-c[ea]).+)/,
+	rcustomProp = /^--/,
+	cssShow = { position: "absolute", visibility: "hidden", display: "block" },
+	cssNormalTransform = {
+		letterSpacing: "0",
+		fontWeight: "400"
+	};
+
+function setPositiveNumber( elem, value, subtract ) {
+
+	// Any relative (+/-) values have already been
+	// normalized at this point
+	var matches = rcssNum.exec( value );
+	return matches ?
+
+		// Guard against undefined "subtract", e.g., when used as in cssHooks
+		Math.max( 0, matches[ 2 ] - ( subtract || 0 ) ) + ( matches[ 3 ] || "px" ) :
+		value;
+}
+
+function boxModelAdjustment( elem, dimension, box, isBorderBox, styles, computedVal ) {
+	var i = dimension === "width" ? 1 : 0,
+		extra = 0,
+		delta = 0;
+
+	// Adjustment may not be necessary
+	if ( box === ( isBorderBox ? "border" : "content" ) ) {
+		return 0;
+	}
+
+	for ( ; i < 4; i += 2 ) {
+
+		// Both box models exclude margin
+		if ( box === "margin" ) {
+			delta += jQuery.css( elem, box + cssExpand[ i ], true, styles );
+		}
+
+		// If we get here with a content-box, we're seeking "padding" or "border" or "margin"
+		if ( !isBorderBox ) {
+
+			// Add padding
+			delta += jQuery.css( elem, "padding" + cssExpand[ i ], true, styles );
+
+			// For "border" or "margin", add border
+			if ( box !== "padding" ) {
+				delta += jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles );
+
+			// But still keep track of it otherwise
+			} else {
+				extra += jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles );
+			}
+
+		// If we get here with a border-box (content + padding + border), we're seeking "content" or
+		// "padding" or "margin"
+		} else {
+
+			// For "content", subtract padding
+			if ( box === "content" ) {
+				delta -= jQuery.css( elem, "padding" + cssExpand[ i ], true, styles );
+			}
+
+			// For "content" or "padding", subtract border
+			if ( box !== "margin" ) {
+				delta -= jQuery.css( elem, "border" + cssExpand[ i ] + "Width", true, styles );
+			}
+		}
+	}
+
+	// Account for positive content-box scroll gutter when requested by providing computedVal
+	if ( !isBorderBox && computedVal >= 0 ) {
+
+		// offsetWidth/offsetHeight is a rounded sum of content, padding, scroll gutter, and border
+		// Assuming integer scroll gutter, subtract the rest and round down
+		delta += Math.max( 0, Math.ceil(
+			elem[ "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] -
+			computedVal -
+			delta -
+			extra -
+			0.5
+
+		// If offsetWidth/offsetHeight is unknown, then we can't determine content-box scroll gutter
+		// Use an explicit zero to avoid NaN (gh-3964)
+		) ) || 0;
+	}
+
+	return delta;
+}
+
+function getWidthOrHeight( elem, dimension, extra ) {
+
+	// Start with computed style
+	var styles = getStyles( elem ),
+
+		// To avoid forcing a reflow, only fetch boxSizing if we need it (gh-4322).
+		// Fake content-box until we know it's needed to know the true value.
+		boxSizingNeeded = !support.boxSizingReliable() || extra,
+		isBorderBox = boxSizingNeeded &&
+			jQuery.css( elem, "boxSizing", false, styles ) === "border-box",
+		valueIsBorderBox = isBorderBox,
+
+		val = curCSS( elem, dimension, styles ),
+		offsetProp = "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 );
+
+	// Support: Firefox <=54
+	// Return a confounding non-pixel value or feign ignorance, as appropriate.
+	if ( rnumnonpx.test( val ) ) {
+		if ( !extra ) {
+			return val;
+		}
+		val = "auto";
+	}
+
+
+	// Fall back to offsetWidth/offsetHeight when value is "auto"
+	// This happens for inline elements with no explicit setting (gh-3571)
+	// Support: Android <=4.1 - 4.3 only
+	// Also use offsetWidth/offsetHeight for misreported inline dimensions (gh-3602)
+	// Support: IE 9-11 only
+	// Also use offsetWidth/offsetHeight for when box sizing is unreliable
+	// We use getClientRects() to check for hidden/disconnected.
+	// In those cases, the computed value can be trusted to be border-box
+	if ( ( !support.boxSizingReliable() && isBorderBox ||
+		val === "auto" ||
+		!parseFloat( val ) && jQuery.css( elem, "display", false, styles ) === "inline" ) &&
+		elem.getClientRects().length ) {
+
+		isBorderBox = jQuery.css( elem, "boxSizing", false, styles ) === "border-box";
+
+		// Where available, offsetWidth/offsetHeight approximate border box dimensions.
+		// Where not available (e.g., SVG), assume unreliable box-sizing and interpret the
+		// retrieved value as a content box dimension.
+		valueIsBorderBox = offsetProp in elem;
+		if ( valueIsBorderBox ) {
+			val = elem[ offsetProp ];
+		}
+	}
+
+	// Normalize "" and auto
+	val = parseFloat( val ) || 0;
+
+	// Adjust for the element's box model
+	return ( val +
+		boxModelAdjustment(
+			elem,
+			dimension,
+			extra || ( isBorderBox ? "border" : "content" ),
+			valueIsBorderBox,
+			styles,
+
+			// Provide the current computed size to request scroll gutter calculation (gh-3589)
+			val
+		)
+	) + "px";
+}
+
+jQuery.extend( {
+
+	// Add in style property hooks for overriding the default
+	// behavior of getting and setting a style property
+	cssHooks: {
+		opacity: {
+			get: function( elem, computed ) {
+				if ( computed ) {
+
+					// We should always get a number back from opacity
+					var ret = curCSS( elem, "opacity" );
+					return ret === "" ? "1" : ret;
+				}
+			}
+		}
+	},
+
+	// Don't automatically add "px" to these possibly-unitless properties
+	cssNumber: {
+		"animationIterationCount": true,
+		"columnCount": true,
+		"fillOpacity": true,
+		"flexGrow": true,
+		"flexShrink": true,
+		"fontWeight": true,
+		"gridArea": true,
+		"gridColumn": true,
+		"gridColumnEnd": true,
+		"gridColumnStart": true,
+		"gridRow": true,
+		"gridRowEnd": true,
+		"gridRowStart": true,
+		"lineHeight": true,
+		"opacity": true,
+		"order": true,
+		"orphans": true,
+		"widows": true,
+		"zIndex": true,
+		"zoom": true
+	},
+
+	// Add in properties whose names you wish to fix before
+	// setting or getting the value
+	cssProps: {},
+
+	// Get and set the style property on a DOM Node
+	style: function( elem, name, value, extra ) {
+
+		// Don't set styles on text and comment nodes
+		if ( !elem || elem.nodeType === 3 || elem.nodeType === 8 || !elem.style ) {
+			return;
+		}
+
+		// Make sure that we're working with the right name
+		var ret, type, hooks,
+			origName = camelCase( name ),
+			isCustomProp = rcustomProp.test( name ),
+			style = elem.style;
+
+		// Make sure that we're working with the right name. We don't
+		// want to query the value if it is a CSS custom property
+		// since they are user-defined.
+		if ( !isCustomProp ) {
+			name = finalPropName( origName );
+		}
+
+		// Gets hook for the prefixed version, then unprefixed version
+		hooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ];
+
+		// Check if we're setting a value
+		if ( value !== undefined ) {
+			type = typeof value;
+
+			// Convert "+=" or "-=" to relative numbers (#7345)
+			if ( type === "string" && ( ret = rcssNum.exec( value ) ) && ret[ 1 ] ) {
+				value = adjustCSS( elem, name, ret );
+
+				// Fixes bug #9237
+				type = "number";
+			}
+
+			// Make sure that null and NaN values aren't set (#7116)
+			if ( value == null || value !== value ) {
+				return;
+			}
+
+			// If a number was passed in, add the unit (except for certain CSS properties)
+			// The isCustomProp check can be removed in jQuery 4.0 when we only auto-append
+			// "px" to a few hardcoded values.
+			if ( type === "number" && !isCustomProp ) {
+				value += ret && ret[ 3 ] || ( jQuery.cssNumber[ origName ] ? "" : "px" );
+			}
+
+			// background-* props affect original clone's values
+			if ( !support.clearCloneStyle && value === "" && name.indexOf( "background" ) === 0 ) {
+				style[ name ] = "inherit";
+			}
+
+			// If a hook was provided, use that value, otherwise just set the specified value
+			if ( !hooks || !( "set" in hooks ) ||
+				( value = hooks.set( elem, value, extra ) ) !== undefined ) {
+
+				if ( isCustomProp ) {
+					style.setProperty( name, value );
+				} else {
+					style[ name ] = value;
+				}
+			}
+
+		} else {
+
+			// If a hook was provided get the non-computed value from there
+			if ( hooks && "get" in hooks &&
+				( ret = hooks.get( elem, false, extra ) ) !== undefined ) {
+
+				return ret;
+			}
+
+			// Otherwise just get the value from the style object
+			return style[ name ];
+		}
+	},
+
+	css: function( elem, name, extra, styles ) {
+		var val, num, hooks,
+			origName = camelCase( name ),
+			isCustomProp = rcustomProp.test( name );
+
+		// Make sure that we're working with the right name. We don't
+		// want to modify the value if it is a CSS custom property
+		// since they are user-defined.
+		if ( !isCustomProp ) {
+			name = finalPropName( origName );
+		}
+
+		// Try prefixed name followed by the unprefixed name
+		hooks = jQuery.cssHooks[ name ] || jQuery.cssHooks[ origName ];
+
+		// If a hook was provided get the computed value from there
+		if ( hooks && "get" in hooks ) {
+			val = hooks.get( elem, true, extra );
+		}
+
+		// Otherwise, if a way to get the computed value exists, use that
+		if ( val === undefined ) {
+			val = curCSS( elem, name, styles );
+		}
+
+		// Convert "normal" to computed value
+		if ( val === "normal" && name in cssNormalTransform ) {
+			val = cssNormalTransform[ name ];
+		}
+
+		// Make numeric if forced or a qualifier was provided and val looks numeric
+		if ( extra === "" || extra ) {
+			num = parseFloat( val );
+			return extra === true || isFinite( num ) ? num || 0 : val;
+		}
+
+		return val;
+	}
+} );
+
+jQuery.each( [ "height", "width" ], function( i, dimension ) {
+	jQuery.cssHooks[ dimension ] = {
+		get: function( elem, computed, extra ) {
+			if ( computed ) {
+
+				// Certain elements can have dimension info if we invisibly show them
+				// but it must have a current display style that would benefit
+				return rdisplayswap.test( jQuery.css( elem, "display" ) ) &&
+
+					// Support: Safari 8+
+					// Table columns in Safari have non-zero offsetWidth & zero
+					// getBoundingClientRect().width unless display is changed.
+					// Support: IE <=11 only
+					// Running getBoundingClientRect on a disconnected node
+					// in IE throws an error.
+					( !elem.getClientRects().length || !elem.getBoundingClientRect().width ) ?
+						swap( elem, cssShow, function() {
+							return getWidthOrHeight( elem, dimension, extra );
+						} ) :
+						getWidthOrHeight( elem, dimension, extra );
+			}
+		},
+
+		set: function( elem, value, extra ) {
+			var matches,
+				styles = getStyles( elem ),
+
+				// Only read styles.position if the test has a chance to fail
+				// to avoid forcing a reflow.
+				scrollboxSizeBuggy = !support.scrollboxSize() &&
+					styles.position === "absolute",
+
+				// To avoid forcing a reflow, only fetch boxSizing if we need it (gh-3991)
+				boxSizingNeeded = scrollboxSizeBuggy || extra,
+				isBorderBox = boxSizingNeeded &&
+					jQuery.css( elem, "boxSizing", false, styles ) === "border-box",
+				subtract = extra ?
+					boxModelAdjustment(
+						elem,
+						dimension,
+						extra,
+						isBorderBox,
+						styles
+					) :
+					0;
+
+			// Account for unreliable border-box dimensions by comparing offset* to computed and
+			// faking a content-box to get border and padding (gh-3699)
+			if ( isBorderBox && scrollboxSizeBuggy ) {
+				subtract -= Math.ceil(
+					elem[ "offset" + dimension[ 0 ].toUpperCase() + dimension.slice( 1 ) ] -
+					parseFloat( styles[ dimension ] ) -
+					boxModelAdjustment( elem, dimension, "border", false, styles ) -
+					0.5
+				);
+			}
+
+			// Convert to pixels if value adjustment is needed
+			if ( subtract && ( matches = rcssNum.exec( value ) ) &&
+				( matches[ 3 ] || "px" ) !== "px" ) {
+
+				elem.style[ dimension ] = value;
+				value = jQuery.css( elem, dimension );
+			}
+
+			return setPositiveNumber( elem, value, subtract );
+		}
+	};
+} );
+
+jQuery.cssHooks.marginLeft = addGetHookIf( support.reliableMarginLeft,
+	function( elem, computed ) {
+		if ( computed ) {
+			return ( parseFloat( curCSS( elem, "marginLeft" ) ) ||
+				elem.getBoundingClientRect().left -
+					swap( elem, { marginLeft: 0 }, function() {
+						return elem.getBoundingClientRect().left;
+					} )
+				) + "px";
+		}
+	}
+);
+
+// These hooks are used by animate to expand properties
+jQuery.each( {
+	margin: "",
+	padding: "",
+	border: "Width"
+}, function( prefix, suffix ) {
+	jQuery.cssHooks[ prefix + suffix ] = {
+		expand: function( value ) {
+			var i = 0,
+				expanded = {},
+
+				// Assumes a single number if not a string
+				parts = typeof value === "string" ? value.split( " " ) : [ value ];
+
+			for ( ; i < 4; i++ ) {
+				expanded[ prefix + cssExpand[ i ] + suffix ] =
+					parts[ i ] || parts[ i - 2 ] || parts[ 0 ];
+			}
+
+			return expanded;
+		}
+	};
+
+	if ( prefix !== "margin" ) {
+		jQuery.cssHooks[ prefix + suffix ].set = setPositiveNumber;
+	}
+} );
+
+jQuery.fn.extend( {
+	css: function( name, value ) {
+		return access( this, function( elem, name, value ) {
+			var styles, len,
+				map = {},
+				i = 0;
+
+			if ( Array.isArray( name ) ) {
+				styles = getStyles( elem );
+				len = name.length;
+
+				for ( ; i < len; i++ ) {
+					map[ name[ i ] ] = jQuery.css( elem, name[ i ], false, styles );
+				}
+
+				return map;
+			}
+
+			return value !== undefined ?
+				jQuery.style( elem, name, value ) :
+				jQuery.css( elem, name );
+		}, name, value, arguments.length > 1 );
+	}
+} );
+
+
+function Tween( elem, options, prop, end, easing ) {
+	return new Tween.prototype.init( elem, options, prop, end, easing );
+}
+jQuery.Tween = Tween;
+
+Tween.prototype = {
+	constructor: Tween,
+	init: function( elem, options, prop, end, easing, unit ) {
+		this.elem = elem;
+		this.prop = prop;
+		this.easing = easing || jQuery.easing._default;
+		this.options = options;
+		this.start = this.now = this.cur();
+		this.end = end;
+		this.unit = unit || ( jQuery.cssNumber[ prop ] ? "" : "px" );
+	},
+	cur: function() {
+		var hooks = Tween.propHooks[ this.prop ];
+
+		return hooks && hooks.get ?
+			hooks.get( this ) :
+			Tween.propHooks._default.get( this );
+	},
+	run: function( percent ) {
+		var eased,
+			hooks = Tween.propHooks[ this.prop ];
+
+		if ( this.options.duration ) {
+			this.pos = eased = jQuery.easing[ this.easing ](
+				percent, this.options.duration * percent, 0, 1, this.options.duration
+			);
+		} else {
+			this.pos = eased = percent;
+		}
+		this.now = ( this.end - this.start ) * eased + this.start;
+
+		if ( this.options.step ) {
+			this.options.step.call( this.elem, this.now, this );
+		}
+
+		if ( hooks && hooks.set ) {
+			hooks.set( this );
+		} else {
+			Tween.propHooks._default.set( this );
+		}
+		return this;
+	}
+};
+
+Tween.prototype.init.prototype = Tween.prototype;
+
+Tween.propHooks = {
+	_default: {
+		get: function( tween ) {
+			var result;
+
+			// Use a property on the element directly when it is not a DOM element,
+			// or when there is no matching style property that exists.
+			if ( tween.elem.nodeType !== 1 ||
+				tween.elem[ tween.prop ] != null && tween.elem.style[ tween.prop ] == null ) {
+				return tween.elem[ tween.prop ];
+			}
+
+			// Passing an empty string as a 3rd parameter to .css will automatically
+			// attempt a parseFloat and fallback to a string if the parse fails.
+			// Simple values such as "10px" are parsed to Float;
+			// complex values such as "rotate(1rad)" are returned as-is.
+			result = jQuery.css( tween.elem, tween.prop, "" );
+
+			// Empty strings, null, undefined and "auto" are converted to 0.
+			return !result || result === "auto" ? 0 : result;
+		},
+		set: function( tween ) {
+
+			// Use step hook for back compat.
+			// Use cssHook if its there.
+			// Use .style if available and use plain properties where available.
+			if ( jQuery.fx.step[ tween.prop ] ) {
+				jQuery.fx.step[ tween.prop ]( tween );
+			} else if ( tween.elem.nodeType === 1 && (
+					jQuery.cssHooks[ tween.prop ] ||
+					tween.elem.style[ finalPropName( tween.prop ) ] != null ) ) {
+				jQuery.style( tween.elem, tween.prop, tween.now + tween.unit );
+			} else {
+				tween.elem[ tween.prop ] = tween.now;
+			}
+		}
+	}
+};
+
+// Support: IE <=9 only
+// Panic based approach to setting things on disconnected nodes
+Tween.propHooks.scrollTop = Tween.propHooks.scrollLeft = {
+	set: function( tween ) {
+		if ( tween.elem.nodeType && tween.elem.parentNode ) {
+			tween.elem[ tween.prop ] = tween.now;
+		}
+	}
+};
+
+jQuery.easing = {
+	linear: function( p ) {
+		return p;
+	},
+	swing: function( p ) {
+		return 0.5 - Math.cos( p * Math.PI ) / 2;
+	},
+	_default: "swing"
+};
+
+jQuery.fx = Tween.prototype.init;
+
+// Back compat <1.8 extension point
+jQuery.fx.step = {};
+
+
+
+
+var
+	fxNow, inProgress,
+	rfxtypes = /^(?:toggle|show|hide)$/,
+	rrun = /queueHooks$/;
+
+function schedule() {
+	if ( inProgress ) {
+		if ( document.hidden === false && window.requestAnimationFrame ) {
+			window.requestAnimationFrame( schedule );
+		} else {
+			window.setTimeout( schedule, jQuery.fx.interval );
+		}
+
+		jQuery.fx.tick();
+	}
+}
+
+// Animations created synchronously will run synchronously
+function createFxNow() {
+	window.setTimeout( function() {
+		fxNow = undefined;
+	} );
+	return ( fxNow = Date.now() );
+}
+
+// Generate parameters to create a standard animation
+function genFx( type, includeWidth ) {
+	var which,
+		i = 0,
+		attrs = { height: type };
+
+	// If we include width, step value is 1 to do all cssExpand values,
+	// otherwise step value is 2 to skip over Left and Right
+	includeWidth = includeWidth ? 1 : 0;
+	for ( ; i < 4; i += 2 - includeWidth ) {
+		which = cssExpand[ i ];
+		attrs[ "margin" + which ] = attrs[ "padding" + which ] = type;
+	}
+
+	if ( includeWidth ) {
+		attrs.opacity = attrs.width = type;
+	}
+
+	return attrs;
+}
+
+function createTween( value, prop, animation ) {
+	var tween,
+		collection = ( Animation.tweeners[ prop ] || [] ).concat( Animation.tweeners[ "*" ] ),
+		index = 0,
+		length = collection.length;
+	for ( ; index < length; index++ ) {
+		if ( ( tween = collection[ index ].call( animation, prop, value ) ) ) {
+
+			// We're done with this property
+			return tween;
+		}
+	}
+}
+
+function defaultPrefilter( elem, props, opts ) {
+	var prop, value, toggle, hooks, oldfire, propTween, restoreDisplay, display,
+		isBox = "width" in props || "height" in props,
+		anim = this,
+		orig = {},
+		style = elem.style,
+		hidden = elem.nodeType && isHiddenWithinTree( elem ),
+		dataShow = dataPriv.get( elem, "fxshow" );
+
+	// Queue-skipping animations hijack the fx hooks
+	if ( !opts.queue ) {
+		hooks = jQuery._queueHooks( elem, "fx" );
+		if ( hooks.unqueued == null ) {
+			hooks.unqueued = 0;
+			oldfire = hooks.empty.fire;
+			hooks.empty.fire = function() {
+				if ( !hooks.unqueued ) {
+					oldfire();
+				}
+			};
+		}
+		hooks.unqueued++;
+
+		anim.always( function() {
+
+			// Ensure the complete handler is called before this completes
+			anim.always( function() {
+				hooks.unqueued--;
+				if ( !jQuery.queue( elem, "fx" ).length ) {
+					hooks.empty.fire();
+				}
+			} );
+		} );
+	}
+
+	// Detect show/hide animations
+	for ( prop in props ) {
+		value = props[ prop ];
+		if ( rfxtypes.test( value ) ) {
+			delete props[ prop ];
+			toggle = toggle || value === "toggle";
+			if ( value === ( hidden ? "hide" : "show" ) ) {
+
+				// Pretend to be hidden if this is a "show" and
+				// there is still data from a stopped show/hide
+				if ( value === "show" && dataShow && dataShow[ prop ] !== undefined ) {
+					hidden = true;
+
+				// Ignore all other no-op show/hide data
+				} else {
+					continue;
+				}
+			}
+			orig[ prop ] = dataShow && dataShow[ prop ] || jQuery.style( elem, prop );
+		}
+	}
+
+	// Bail out if this is a no-op like .hide().hide()
+	propTween = !jQuery.isEmptyObject( props );
+	if ( !propTween && jQuery.isEmptyObject( orig ) ) {
+		return;
+	}
+
+	// Restrict "overflow" and "display" styles during box animations
+	if ( isBox && elem.nodeType === 1 ) {
+
+		// Support: IE <=9 - 11, Edge 12 - 15
+		// Record all 3 overflow attributes because IE does not infer the shorthand
+		// from identically-valued overflowX and overflowY and Edge just mirrors
+		// the overflowX value there.
+		opts.overflow = [ style.overflow, style.overflowX, style.overflowY ];
+
+		// Identify a display type, preferring old show/hide data over the CSS cascade
+		restoreDisplay = dataShow && dataShow.display;
+		if ( restoreDisplay == null ) {
+			restoreDisplay = dataPriv.get( elem, "display" );
+		}
+		display = jQuery.css( elem, "display" );
+		if ( display === "none" ) {
+			if ( restoreDisplay ) {
+				display = restoreDisplay;
+			} else {
+
+				// Get nonempty value(s) by temporarily forcing visibility
+				showHide( [ elem ], true );
+				restoreDisplay = elem.style.display || restoreDisplay;
+				display = jQuery.css( elem, "display" );
+				showHide( [ elem ] );
+			}
+		}
+
+		// Animate inline elements as inline-block
+		if ( display === "inline" || display === "inline-block" && restoreDisplay != null ) {
+			if ( jQuery.css( elem, "float" ) === "none" ) {
+
+				// Restore the original display value at the end of pure show/hide animations
+				if ( !propTween ) {
+					anim.done( function() {
+						style.display = restoreDisplay;
+					} );
+					if ( restoreDisplay == null ) {
+						display = style.display;
+						restoreDisplay = display === "none" ? "" : display;
+					}
+				}
+				style.display = "inline-block";
+			}
+		}
+	}
+
+	if ( opts.overflow ) {
+		style.overflow = "hidden";
+		anim.always( function() {
+			style.overflow = opts.overflow[ 0 ];
+			style.overflowX = opts.overflow[ 1 ];
+			style.overflowY = opts.overflow[ 2 ];
+		} );
+	}
+
+	// Implement show/hide animations
+	propTween = false;
+	for ( prop in orig ) {
+
+		// General show/hide setup for this element animation
+		if ( !propTween ) {
+			if ( dataShow ) {
+				if ( "hidden" in dataShow ) {
+					hidden = dataShow.hidden;
+				}
+			} else {
+				dataShow = dataPriv.access( elem, "fxshow", { display: restoreDisplay } );
+			}
+
+			// Store hidden/visible for toggle so `.stop().toggle()` "reverses"
+			if ( toggle ) {
+				dataShow.hidden = !hidden;
+			}
+
+			// Show elements before animating them
+			if ( hidden ) {
+				showHide( [ elem ], true );
+			}
+
+			/* eslint-disable no-loop-func */
+
+			anim.done( function() {
+
+			/* eslint-enable no-loop-func */
+
+				// The final step of a "hide" animation is actually hiding the element
+				if ( !hidden ) {
+					showHide( [ elem ] );
+				}
+				dataPriv.remove( elem, "fxshow" );
+				for ( prop in orig ) {
+					jQuery.style( elem, prop, orig[ prop ] );
+				}
+			} );
+		}
+
+		// Per-property setup
+		propTween = createTween( hidden ? dataShow[ prop ] : 0, prop, anim );
+		if ( !( prop in dataShow ) ) {
+			dataShow[ prop ] = propTween.start;
+			if ( hidden ) {
+				propTween.end = propTween.start;
+				propTween.start = 0;
+			}
+		}
+	}
+}
+
+function propFilter( props, specialEasing ) {
+	var index, name, easing, value, hooks;
+
+	// camelCase, specialEasing and expand cssHook pass
+	for ( index in props ) {
+		name = camelCase( index );
+		easing = specialEasing[ name ];
+		value = props[ index ];
+		if ( Array.isArray( value ) ) {
+			easing = value[ 1 ];
+			value = props[ index ] = value[ 0 ];
+		}
+
+		if ( index !== name ) {
+			props[ name ] = value;
+			delete props[ index ];
+		}
+
+		hooks = jQuery.cssHooks[ name ];
+		if ( hooks && "expand" in hooks ) {
+			value = hooks.expand( value );
+			delete props[ name ];
+
+			// Not quite $.extend, this won't overwrite existing keys.
+			// Reusing 'index' because we have the correct "name"
+			for ( index in value ) {
+				if ( !( index in props ) ) {
+					props[ index ] = value[ index ];
+					specialEasing[ index ] = easing;
+				}
+			}
+		} else {
+			specialEasing[ name ] = easing;
+		}
+	}
+}
+
+function Animation( elem, properties, options ) {
+	var result,
+		stopped,
+		index = 0,
+		length = Animation.prefilters.length,
+		deferred = jQuery.Deferred().always( function() {
+
+			// Don't match elem in the :animated selector
+			delete tick.elem;
+		} ),
+		tick = function() {
+			if ( stopped ) {
+				return false;
+			}
+			var currentTime = fxNow || createFxNow(),
+				remaining = Math.max( 0, animation.startTime + animation.duration - currentTime ),
+
+				// Support: Android 2.3 only
+				// Archaic crash bug won't allow us to use `1 - ( 0.5 || 0 )` (#12497)
+				temp = remaining / animation.duration || 0,
+				percent = 1 - temp,
+				index = 0,
+				length = animation.tweens.length;
+
+			for ( ; index < length; index++ ) {
+				animation.tweens[ index ].run( percent );
+			}
+
+			deferred.notifyWith( elem, [ animation, percent, remaining ] );
+
+			// If there's more to do, yield
+			if ( percent < 1 && length ) {
+				return remaining;
+			}
+
+			// If this was an empty animation, synthesize a final progress notification
+			if ( !length ) {
+				deferred.notifyWith( elem, [ animation, 1, 0 ] );
+			}
+
+			// Resolve the animation and report its conclusion
+			deferred.resolveWith( elem, [ animation ] );
+			return false;
+		},
+		animation = deferred.promise( {
+			elem: elem,
+			props: jQuery.extend( {}, properties ),
+			opts: jQuery.extend( true, {
+				specialEasing: {},
+				easing: jQuery.easing._default
+			}, options ),
+			originalProperties: properties,
+			originalOptions: options,
+			startTime: fxNow || createFxNow(),
+			duration: options.duration,
+			tweens: [],
+			createTween: function( prop, end ) {
+				var tween = jQuery.Tween( elem, animation.opts, prop, end,
+						animation.opts.specialEasing[ prop ] || animation.opts.easing );
+				animation.tweens.push( tween );
+				return tween;
+			},
+			stop: function( gotoEnd ) {
+				var index = 0,
+
+					// If we are going to the end, we want to run all the tweens
+					// otherwise we skip this part
+					length = gotoEnd ? animation.tweens.length : 0;
+				if ( stopped ) {
+					return this;
+				}
+				stopped = true;
+				for ( ; index < length; index++ ) {
+					animation.tweens[ index ].run( 1 );
+				}
+
+				// Resolve when we played the last frame; otherwise, reject
+				if ( gotoEnd ) {
+					deferred.notifyWith( elem, [ animation, 1, 0 ] );
+					deferred.resolveWith( elem, [ animation, gotoEnd ] );
+				} else {
+					deferred.rejectWith( elem, [ animation, gotoEnd ] );
+				}
+				return this;
+			}
+		} ),
+		props = animation.props;
+
+	propFilter( props, animation.opts.specialEasing );
+
+	for ( ; index < length; index++ ) {
+		result = Animation.prefilters[ index ].call( animation, elem, props, animation.opts );
+		if ( result ) {
+			if ( isFunction( result.stop ) ) {
+				jQuery._queueHooks( animation.elem, animation.opts.queue ).stop =
+					result.stop.bind( result );
+			}
+			return result;
+		}
+	}
+
+	jQuery.map( props, createTween, animation );
+
+	if ( isFunction( animation.opts.start ) ) {
+		animation.opts.start.call( elem, animation );
+	}
+
+	// Attach callbacks from options
+	animation
+		.progress( animation.opts.progress )
+		.done( animation.opts.done, animation.opts.complete )
+		.fail( animation.opts.fail )
+		.always( animation.opts.always );
+
+	jQuery.fx.timer(
+		jQuery.extend( tick, {
+			elem: elem,
+			anim: animation,
+			queue: animation.opts.queue
+		} )
+	);
+
+	return animation;
+}
+
+jQuery.Animation = jQuery.extend( Animation, {
+
+	tweeners: {
+		"*": [ function( prop, value ) {
+			var tween = this.createTween( prop, value );
+			adjustCSS( tween.elem, prop, rcssNum.exec( value ), tween );
+			return tween;
+		} ]
+	},
+
+	tweener: function( props, callback ) {
+		if ( isFunction( props ) ) {
+			callback = props;
+			props = [ "*" ];
+		} else {
+			props = props.match( rnothtmlwhite );
+		}
+
+		var prop,
+			index = 0,
+			length = props.length;
+
+		for ( ; index < length; index++ ) {
+			prop = props[ index ];
+			Animation.tweeners[ prop ] = Animation.tweeners[ prop ] || [];
+			Animation.tweeners[ prop ].unshift( callback );
+		}
+	},
+
+	prefilters: [ defaultPrefilter ],
+
+	prefilter: function( callback, prepend ) {
+		if ( prepend ) {
+			Animation.prefilters.unshift( callback );
+		} else {
+			Animation.prefilters.push( callback );
+		}
+	}
+} );
+
+jQuery.speed = function( speed, easing, fn ) {
+	var opt = speed && typeof speed === "object" ? jQuery.extend( {}, speed ) : {
+		complete: fn || !fn && easing ||
+			isFunction( speed ) && speed,
+		duration: speed,
+		easing: fn && easing || easing && !isFunction( easing ) && easing
+	};
+
+	// Go to the end state if fx are off
+	if ( jQuery.fx.off ) {
+		opt.duration = 0;
+
+	} else {
+		if ( typeof opt.duration !== "number" ) {
+			if ( opt.duration in jQuery.fx.speeds ) {
+				opt.duration = jQuery.fx.speeds[ opt.duration ];
+
+			} else {
+				opt.duration = jQuery.fx.speeds._default;
+			}
+		}
+	}
+
+	// Normalize opt.queue - true/undefined/null -> "fx"
+	if ( opt.queue == null || opt.queue === true ) {
+		opt.queue = "fx";
+	}
+
+	// Queueing
+	opt.old = opt.complete;
+
+	opt.complete = function() {
+		if ( isFunction( opt.old ) ) {
+			opt.old.call( this );
+		}
+
+		if ( opt.queue ) {
+			jQuery.dequeue( this, opt.queue );
+		}
+	};
+
+	return opt;
+};
+
+jQuery.fn.extend( {
+	fadeTo: function( speed, to, easing, callback ) {
+
+		// Show any hidden elements after setting opacity to 0
+		return this.filter( isHiddenWithinTree ).css( "opacity", 0 ).show()
+
+			// Animate to the value specified
+			.end().animate( { opacity: to }, speed, easing, callback );
+	},
+	animate: function( prop, speed, easing, callback ) {
+		var empty = jQuery.isEmptyObject( prop ),
+			optall = jQuery.speed( speed, easing, callback ),
+			doAnimation = function() {
+
+				// Operate on a copy of prop so per-property easing won't be lost
+				var anim = Animation( this, jQuery.extend( {}, prop ), optall );
+
+				// Empty animations, or finishing resolves immediately
+				if ( empty || dataPriv.get( this, "finish" ) ) {
+					anim.stop( true );
+				}
+			};
+			doAnimation.finish = doAnimation;
+
+		return empty || optall.queue === false ?
+			this.each( doAnimation ) :
+			this.queue( optall.queue, doAnimation );
+	},
+	stop: function( type, clearQueue, gotoEnd ) {
+		var stopQueue = function( hooks ) {
+			var stop = hooks.stop;
+			delete hooks.stop;
+			stop( gotoEnd );
+		};
+
+		if ( typeof type !== "string" ) {
+			gotoEnd = clearQueue;
+			clearQueue = type;
+			type = undefined;
+		}
+		if ( clearQueue && type !== false ) {
+			this.queue( type || "fx", [] );
+		}
+
+		return this.each( function() {
+			var dequeue = true,
+				index = type != null && type + "queueHooks",
+				timers = jQuery.timers,
+				data = dataPriv.get( this );
+
+			if ( index ) {
+				if ( data[ index ] && data[ index ].stop ) {
+					stopQueue( data[ index ] );
+				}
+			} else {
+				for ( index in data ) {
+					if ( data[ index ] && data[ index ].stop && rrun.test( index ) ) {
+						stopQueue( data[ index ] );
+					}
+				}
+			}
+
+			for ( index = timers.length; index--; ) {
+				if ( timers[ index ].elem === this &&
+					( type == null || timers[ index ].queue === type ) ) {
+
+					timers[ index ].anim.stop( gotoEnd );
+					dequeue = false;
+					timers.splice( index, 1 );
+				}
+			}
+
+			// Start the next in the queue if the last step wasn't forced.
+			// Timers currently will call their complete callbacks, which
+			// will dequeue but only if they were gotoEnd.
+			if ( dequeue || !gotoEnd ) {
+				jQuery.dequeue( this, type );
+			}
+		} );
+	},
+	finish: function( type ) {
+		if ( type !== false ) {
+			type = type || "fx";
+		}
+		return this.each( function() {
+			var index,
+				data = dataPriv.get( this ),
+				queue = data[ type + "queue" ],
+				hooks = data[ type + "queueHooks" ],
+				timers = jQuery.timers,
+				length = queue ? queue.length : 0;
+
+			// Enable finishing flag on private data
+			data.finish = true;
+
+			// Empty the queue first
+			jQuery.queue( this, type, [] );
+
+			if ( hooks && hooks.stop ) {
+				hooks.stop.call( this, true );
+			}
+
+			// Look for any active animations, and finish them
+			for ( index = timers.length; index--; ) {
+				if ( timers[ index ].elem === this && timers[ index ].queue === type ) {
+					timers[ index ].anim.stop( true );
+					timers.splice( index, 1 );
+				}
+			}
+
+			// Look for any animations in the old queue and finish them
+			for ( index = 0; index < length; index++ ) {
+				if ( queue[ index ] && queue[ index ].finish ) {
+					queue[ index ].finish.call( this );
+				}
+			}
+
+			// Turn off finishing flag
+			delete data.finish;
+		} );
+	}
+} );
+
+jQuery.each( [ "toggle", "show", "hide" ], function( i, name ) {
+	var cssFn = jQuery.fn[ name ];
+	jQuery.fn[ name ] = function( speed, easing, callback ) {
+		return speed == null || typeof speed === "boolean" ?
+			cssFn.apply( this, arguments ) :
+			this.animate( genFx( name, true ), speed, easing, callback );
+	};
+} );
+
+// Generate shortcuts for custom animations
+jQuery.each( {
+	slideDown: genFx( "show" ),
+	slideUp: genFx( "hide" ),
+	slideToggle: genFx( "toggle" ),
+	fadeIn: { opacity: "show" },
+	fadeOut: { opacity: "hide" },
+	fadeToggle: { opacity: "toggle" }
+}, function( name, props ) {
+	jQuery.fn[ name ] = function( speed, easing, callback ) {
+		return this.animate( props, speed, easing, callback );
+	};
+} );
+
+jQuery.timers = [];
+jQuery.fx.tick = function() {
+	var timer,
+		i = 0,
+		timers = jQuery.timers;
+
+	fxNow = Date.now();
+
+	for ( ; i < timers.length; i++ ) {
+		timer = timers[ i ];
+
+		// Run the timer and safely remove it when done (allowing for external removal)
+		if ( !timer() && timers[ i ] === timer ) {
+			timers.splice( i--, 1 );
+		}
+	}
+
+	if ( !timers.length ) {
+		jQuery.fx.stop();
+	}
+	fxNow = undefined;
+};
+
+jQuery.fx.timer = function( timer ) {
+	jQuery.timers.push( timer );
+	jQuery.fx.start();
+};
+
+jQuery.fx.interval = 13;
+jQuery.fx.start = function() {
+	if ( inProgress ) {
+		return;
+	}
+
+	inProgress = true;
+	schedule();
+};
+
+jQuery.fx.stop = function() {
+	inProgress = null;
+};
+
+jQuery.fx.speeds = {
+	slow: 600,
+	fast: 200,
+
+	// Default speed
+	_default: 400
+};
+
+
+// Based off of the plugin by Clint Helfers, with permission.
+// https://web.archive.org/web/20100324014747/http://blindsignals.com/index.php/2009/07/jquery-delay/
+jQuery.fn.delay = function( time, type ) {
+	time = jQuery.fx ? jQuery.fx.speeds[ time ] || time : time;
+	type = type || "fx";
+
+	return this.queue( type, function( next, hooks ) {
+		var timeout = window.setTimeout( next, time );
+		hooks.stop = function() {
+			window.clearTimeout( timeout );
+		};
+	} );
+};
+
+
+( function() {
+	var input = document.createElement( "input" ),
+		select = document.createElement( "select" ),
+		opt = select.appendChild( document.createElement( "option" ) );
+
+	input.type = "checkbox";
+
+	// Support: Android <=4.3 only
+	// Default value for a checkbox should be "on"
+	support.checkOn = input.value !== "";
+
+	// Support: IE <=11 only
+	// Must access selectedIndex to make default options select
+	support.optSelected = opt.selected;
+
+	// Support: IE <=11 only
+	// An input loses its value after becoming a radio
+	input = document.createElement( "input" );
+	input.value = "t";
+	input.type = "radio";
+	support.radioValue = input.value === "t";
+} )();
+
+
+var boolHook,
+	attrHandle = jQuery.expr.attrHandle;
+
+jQuery.fn.extend( {
+	attr: function( name, value ) {
+		return access( this, jQuery.attr, name, value, arguments.length > 1 );
+	},
+
+	removeAttr: function( name ) {
+		return this.each( function() {
+			jQuery.removeAttr( this, name );
+		} );
+	}
+} );
+
+jQuery.extend( {
+	attr: function( elem, name, value ) {
+		var ret, hooks,
+			nType = elem.nodeType;
+
+		// Don't get/set attributes on text, comment and attribute nodes
+		if ( nType === 3 || nType === 8 || nType === 2 ) {
+			return;
+		}
+
+		// Fallback to prop when attributes are not supported
+		if ( typeof elem.getAttribute === "undefined" ) {
+			return jQuery.prop( elem, name, value );
+		}
+
+		// Attribute hooks are determined by the lowercase version
+		// Grab necessary hook if one is defined
+		if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {
+			hooks = jQuery.attrHooks[ name.toLowerCase() ] ||
+				( jQuery.expr.match.bool.test( name ) ? boolHook : undefined );
+		}
+
+		if ( value !== undefined ) {
+			if ( value === null ) {
+				jQuery.removeAttr( elem, name );
+				return;
+			}
+
+			if ( hooks && "set" in hooks &&
+				( ret = hooks.set( elem, value, name ) ) !== undefined ) {
+				return ret;
+			}
+
+			elem.setAttribute( name, value + "" );
+			return value;
+		}
+
+		if ( hooks && "get" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) {
+			return ret;
+		}
+
+		ret = jQuery.find.attr( elem, name );
+
+		// Non-existent attributes return null, we normalize to undefined
+		return ret == null ? undefined : ret;
+	},
+
+	attrHooks: {
+		type: {
+			set: function( elem, value ) {
+				if ( !support.radioValue && value === "radio" &&
+					nodeName( elem, "input" ) ) {
+					var val = elem.value;
+					elem.setAttribute( "type", value );
+					if ( val ) {
+						elem.value = val;
+					}
+					return value;
+				}
+			}
+		}
+	},
+
+	removeAttr: function( elem, value ) {
+		var name,
+			i = 0,
+
+			// Attribute names can contain non-HTML whitespace characters
+			// https://html.spec.whatwg.org/multipage/syntax.html#attributes-2
+			attrNames = value && value.match( rnothtmlwhite );
+
+		if ( attrNames && elem.nodeType === 1 ) {
+			while ( ( name = attrNames[ i++ ] ) ) {
+				elem.removeAttribute( name );
+			}
+		}
+	}
+} );
+
+// Hooks for boolean attributes
+boolHook = {
+	set: function( elem, value, name ) {
+		if ( value === false ) {
+
+			// Remove boolean attributes when set to false
+			jQuery.removeAttr( elem, name );
+		} else {
+			elem.setAttribute( name, name );
+		}
+		return name;
+	}
+};
+
+jQuery.each( jQuery.expr.match.bool.source.match( /\w+/g ), function( i, name ) {
+	var getter = attrHandle[ name ] || jQuery.find.attr;
+
+	attrHandle[ name ] = function( elem, name, isXML ) {
+		var ret, handle,
+			lowercaseName = name.toLowerCase();
+
+		if ( !isXML ) {
+
+			// Avoid an infinite loop by temporarily removing this function from the getter
+			handle = attrHandle[ lowercaseName ];
+			attrHandle[ lowercaseName ] = ret;
+			ret = getter( elem, name, isXML ) != null ?
+				lowercaseName :
+				null;
+			attrHandle[ lowercaseName ] = handle;
+		}
+		return ret;
+	};
+} );
+
+
+
+
+var rfocusable = /^(?:input|select|textarea|button)$/i,
+	rclickable = /^(?:a|area)$/i;
+
+jQuery.fn.extend( {
+	prop: function( name, value ) {
+		return access( this, jQuery.prop, name, value, arguments.length > 1 );
+	},
+
+	removeProp: function( name ) {
+		return this.each( function() {
+			delete this[ jQuery.propFix[ name ] || name ];
+		} );
+	}
+} );
+
+jQuery.extend( {
+	prop: function( elem, name, value ) {
+		var ret, hooks,
+			nType = elem.nodeType;
+
+		// Don't get/set properties on text, comment and attribute nodes
+		if ( nType === 3 || nType === 8 || nType === 2 ) {
+			return;
+		}
+
+		if ( nType !== 1 || !jQuery.isXMLDoc( elem ) ) {
+
+			// Fix name and attach hooks
+			name = jQuery.propFix[ name ] || name;
+			hooks = jQuery.propHooks[ name ];
+		}
+
+		if ( value !== undefined ) {
+			if ( hooks && "set" in hooks &&
+				( ret = hooks.set( elem, value, name ) ) !== undefined ) {
+				return ret;
+			}
+
+			return ( elem[ name ] = value );
+		}
+
+		if ( hooks && "get" in hooks && ( ret = hooks.get( elem, name ) ) !== null ) {
+			return ret;
+		}
+
+		return elem[ name ];
+	},
+
+	propHooks: {
+		tabIndex: {
+			get: function( elem ) {
+
+				// Support: IE <=9 - 11 only
+				// elem.tabIndex doesn't always return the
+				// correct value when it hasn't been explicitly set
+				// https://web.archive.org/web/20141116233347/http://fluidproject.org/blog/2008/01/09/getting-setting-and-removing-tabindex-values-with-javascript/
+				// Use proper attribute retrieval(#12072)
+				var tabindex = jQuery.find.attr( elem, "tabindex" );
+
+				if ( tabindex ) {
+					return parseInt( tabindex, 10 );
+				}
+
+				if (
+					rfocusable.test( elem.nodeName ) ||
+					rclickable.test( elem.nodeName ) &&
+					elem.href
+				) {
+					return 0;
+				}
+
+				return -1;
+			}
+		}
+	},
+
+	propFix: {
+		"for": "htmlFor",
+		"class": "className"
+	}
+} );
+
+// Support: IE <=11 only
+// Accessing the selectedIndex property
+// forces the browser to respect setting selected
+// on the option
+// The getter ensures a default option is selected
+// when in an optgroup
+// eslint rule "no-unused-expressions" is disabled for this code
+// since it considers such accessions noop
+if ( !support.optSelected ) {
+	jQuery.propHooks.selected = {
+		get: function( elem ) {
+
+			/* eslint no-unused-expressions: "off" */
+
+			var parent = elem.parentNode;
+			if ( parent && parent.parentNode ) {
+				parent.parentNode.selectedIndex;
+			}
+			return null;
+		},
+		set: function( elem ) {
+
+			/* eslint no-unused-expressions: "off" */
+
+			var parent = elem.parentNode;
+			if ( parent ) {
+				parent.selectedIndex;
+
+				if ( parent.parentNode ) {
+					parent.parentNode.selectedIndex;
+				}
+			}
+		}
+	};
+}
+
+jQuery.each( [
+	"tabIndex",
+	"readOnly",
+	"maxLength",
+	"cellSpacing",
+	"cellPadding",
+	"rowSpan",
+	"colSpan",
+	"useMap",
+	"frameBorder",
+	"contentEditable"
+], function() {
+	jQuery.propFix[ this.toLowerCase() ] = this;
+} );
+
+
+
+
+	// Strip and collapse whitespace according to HTML spec
+	// https://infra.spec.whatwg.org/#strip-and-collapse-ascii-whitespace
+	function stripAndCollapse( value ) {
+		var tokens = value.match( rnothtmlwhite ) || [];
+		return tokens.join( " " );
+	}
+
+
+function getClass( elem ) {
+	return elem.getAttribute && elem.getAttribute( "class" ) || "";
+}
+
+function classesToArray( value ) {
+	if ( Array.isArray( value ) ) {
+		return value;
+	}
+	if ( typeof value === "string" ) {
+		return value.match( rnothtmlwhite ) || [];
+	}
+	return [];
+}
+
+jQuery.fn.extend( {
+	addClass: function( value ) {
+		var classes, elem, cur, curValue, clazz, j, finalValue,
+			i = 0;
+
+		if ( isFunction( value ) ) {
+			return this.each( function( j ) {
+				jQuery( this ).addClass( value.call( this, j, getClass( this ) ) );
+			} );
+		}
+
+		classes = classesToArray( value );
+
+		if ( classes.length ) {
+			while ( ( elem = this[ i++ ] ) ) {
+				curValue = getClass( elem );
+				cur = elem.nodeType === 1 && ( " " + stripAndCollapse( curValue ) + " " );
+
+				if ( cur ) {
+					j = 0;
+					while ( ( clazz = classes[ j++ ] ) ) {
+						if ( cur.indexOf( " " + clazz + " " ) < 0 ) {
+							cur += clazz + " ";
+						}
+					}
+
+					// Only assign if different to avoid unneeded rendering.
+					finalValue = stripAndCollapse( cur );
+					if ( curValue !== finalValue ) {
+						elem.setAttribute( "class", finalValue );
+					}
+				}
+			}
+		}
+
+		return this;
+	},
+
+	removeClass: function( value ) {
+		var classes, elem, cur, curValue, clazz, j, finalValue,
+			i = 0;
+
+		if ( isFunction( value ) ) {
+			return this.each( function( j ) {
+				jQuery( this ).removeClass( value.call( this, j, getClass( this ) ) );
+			} );
+		}
+
+		if ( !arguments.length ) {
+			return this.attr( "class", "" );
+		}
+
+		classes = classesToArray( value );
+
+		if ( classes.length ) {
+			while ( ( elem = this[ i++ ] ) ) {
+				curValue = getClass( elem );
+
+				// This expression is here for better compressibility (see addClass)
+				cur = elem.nodeType === 1 && ( " " + stripAndCollapse( curValue ) + " " );
+
+				if ( cur ) {
+					j = 0;
+					while ( ( clazz = classes[ j++ ] ) ) {
+
+						// Remove *all* instances
+						while ( cur.indexOf( " " + clazz + " " ) > -1 ) {
+							cur = cur.replace( " " + clazz + " ", " " );
+						}
+					}
+
+					// Only assign if different to avoid unneeded rendering.
+					finalValue = stripAndCollapse( cur );
+					if ( curValue !== finalValue ) {
+						elem.setAttribute( "class", finalValue );
+					}
+				}
+			}
+		}
+
+		return this;
+	},
+
+	toggleClass: function( value, stateVal ) {
+		var type = typeof value,
+			isValidValue = type === "string" || Array.isArray( value );
+
+		if ( typeof stateVal === "boolean" && isValidValue ) {
+			return stateVal ? this.addClass( value ) : this.removeClass( value );
+		}
+
+		if ( isFunction( value ) ) {
+			return this.each( function( i ) {
+				jQuery( this ).toggleClass(
+					value.call( this, i, getClass( this ), stateVal ),
+					stateVal
+				);
+			} );
+		}
+
+		return this.each( function() {
+			var className, i, self, classNames;
+
+			if ( isValidValue ) {
+
+				// Toggle individual class names
+				i = 0;
+				self = jQuery( this );
+				classNames = classesToArray( value );
+
+				while ( ( className = classNames[ i++ ] ) ) {
+
+					// Check each className given, space separated list
+					if ( self.hasClass( className ) ) {
+						self.removeClass( className );
+					} else {
+						self.addClass( className );
+					}
+				}
+
+			// Toggle whole class name
+			} else if ( value === undefined || type === "boolean" ) {
+				className = getClass( this );
+				if ( className ) {
+
+					// Store className if set
+					dataPriv.set( this, "__className__", className );
+				}
+
+				// If the element has a class name or if we're passed `false`,
+				// then remove the whole classname (if there was one, the above saved it).
+				// Otherwise bring back whatever was previously saved (if anything),
+				// falling back to the empty string if nothing was stored.
+				if ( this.setAttribute ) {
+					this.setAttribute( "class",
+						className || value === false ?
+						"" :
+						dataPriv.get( this, "__className__" ) || ""
+					);
+				}
+			}
+		} );
+	},
+
+	hasClass: function( selector ) {
+		var className, elem,
+			i = 0;
+
+		className = " " + selector + " ";
+		while ( ( elem = this[ i++ ] ) ) {
+			if ( elem.nodeType === 1 &&
+				( " " + stripAndCollapse( getClass( elem ) ) + " " ).indexOf( className ) > -1 ) {
+					return true;
+			}
+		}
+
+		return false;
+	}
+} );
+
+
+
+
+var rreturn = /\r/g;
+
+jQuery.fn.extend( {
+	val: function( value ) {
+		var hooks, ret, valueIsFunction,
+			elem = this[ 0 ];
+
+		if ( !arguments.length ) {
+			if ( elem ) {
+				hooks = jQuery.valHooks[ elem.type ] ||
+					jQuery.valHooks[ elem.nodeName.toLowerCase() ];
+
+				if ( hooks &&
+					"get" in hooks &&
+					( ret = hooks.get( elem, "value" ) ) !== undefined
+				) {
+					return ret;
+				}
+
+				ret = elem.value;
+
+				// Handle most common string cases
+				if ( typeof ret === "string" ) {
+					return ret.replace( rreturn, "" );
+				}
+
+				// Handle cases where value is null/undef or number
+				return ret == null ? "" : ret;
+			}
+
+			return;
+		}
+
+		valueIsFunction = isFunction( value );
+
+		return this.each( function( i ) {
+			var val;
+
+			if ( this.nodeType !== 1 ) {
+				return;
+			}
+
+			if ( valueIsFunction ) {
+				val = value.call( this, i, jQuery( this ).val() );
+			} else {
+				val = value;
+			}
+
+			// Treat null/undefined as ""; convert numbers to string
+			if ( val == null ) {
+				val = "";
+
+			} else if ( typeof val === "number" ) {
+				val += "";
+
+			} else if ( Array.isArray( val ) ) {
+				val = jQuery.map( val, function( value ) {
+					return value == null ? "" : value + "";
+				} );
+			}
+
+			hooks = jQuery.valHooks[ this.type ] || jQuery.valHooks[ this.nodeName.toLowerCase() ];
+
+			// If set returns undefined, fall back to normal setting
+			if ( !hooks || !( "set" in hooks ) || hooks.set( this, val, "value" ) === undefined ) {
+				this.value = val;
+			}
+		} );
+	}
+} );
+
+jQuery.extend( {
+	valHooks: {
+		option: {
+			get: function( elem ) {
+
+				var val = jQuery.find.attr( elem, "value" );
+				return val != null ?
+					val :
+
+					// Support: IE <=10 - 11 only
+					// option.text throws exceptions (#14686, #14858)
+					// Strip and collapse whitespace
+					// https://html.spec.whatwg.org/#strip-and-collapse-whitespace
+					stripAndCollapse( jQuery.text( elem ) );
+			}
+		},
+		select: {
+			get: function( elem ) {
+				var value, option, i,
+					options = elem.options,
+					index = elem.selectedIndex,
+					one = elem.type === "select-one",
+					values = one ? null : [],
+					max = one ? index + 1 : options.length;
+
+				if ( index < 0 ) {
+					i = max;
+
+				} else {
+					i = one ? index : 0;
+				}
+
+				// Loop through all the selected options
+				for ( ; i < max; i++ ) {
+					option = options[ i ];
+
+					// Support: IE <=9 only
+					// IE8-9 doesn't update selected after form reset (#2551)
+					if ( ( option.selected || i === index ) &&
+
+							// Don't return options that are disabled or in a disabled optgroup
+							!option.disabled &&
+							( !option.parentNode.disabled ||
+								!nodeName( option.parentNode, "optgroup" ) ) ) {
+
+						// Get the specific value for the option
+						value = jQuery( option ).val();
+
+						// We don't need an array for one selects
+						if ( one ) {
+							return value;
+						}
+
+						// Multi-Selects return an array
+						values.push( value );
+					}
+				}
+
+				return values;
+			},
+
+			set: function( elem, value ) {
+				var optionSet, option,
+					options = elem.options,
+					values = jQuery.makeArray( value ),
+					i = options.length;
+
+				while ( i-- ) {
+					option = options[ i ];
+
+					/* eslint-disable no-cond-assign */
+
+					if ( option.selected =
+						jQuery.inArray( jQuery.valHooks.option.get( option ), values ) > -1
+					) {
+						optionSet = true;
+					}
+
+					/* eslint-enable no-cond-assign */
+				}
+
+				// Force browsers to behave consistently when non-matching value is set
+				if ( !optionSet ) {
+					elem.selectedIndex = -1;
+				}
+				return values;
+			}
+		}
+	}
+} );
+
+// Radios and checkboxes getter/setter
+jQuery.each( [ "radio", "checkbox" ], function() {
+	jQuery.valHooks[ this ] = {
+		set: function( elem, value ) {
+			if ( Array.isArray( value ) ) {
+				return ( elem.checked = jQuery.inArray( jQuery( elem ).val(), value ) > -1 );
+			}
+		}
+	};
+	if ( !support.checkOn ) {
+		jQuery.valHooks[ this ].get = function( elem ) {
+			return elem.getAttribute( "value" ) === null ? "on" : elem.value;
+		};
+	}
+} );
+
+
+
+
+// Return jQuery for attributes-only inclusion
+
+
+support.focusin = "onfocusin" in window;
+
+
+var rfocusMorph = /^(?:focusinfocus|focusoutblur)$/,
+	stopPropagationCallback = function( e ) {
+		e.stopPropagation();
+	};
+
+jQuery.extend( jQuery.event, {
+
+	trigger: function( event, data, elem, onlyHandlers ) {
+
+		var i, cur, tmp, bubbleType, ontype, handle, special, lastElement,
+			eventPath = [ elem || document ],
+			type = hasOwn.call( event, "type" ) ? event.type : event,
+			namespaces = hasOwn.call( event, "namespace" ) ? event.namespace.split( "." ) : [];
+
+		cur = lastElement = tmp = elem = elem || document;
+
+		// Don't do events on text and comment nodes
+		if ( elem.nodeType === 3 || elem.nodeType === 8 ) {
+			return;
+		}
+
+		// focus/blur morphs to focusin/out; ensure we're not firing them right now
+		if ( rfocusMorph.test( type + jQuery.event.triggered ) ) {
+			return;
+		}
+
+		if ( type.indexOf( "." ) > -1 ) {
+
+			// Namespaced trigger; create a regexp to match event type in handle()
+			namespaces = type.split( "." );
+			type = namespaces.shift();
+			namespaces.sort();
+		}
+		ontype = type.indexOf( ":" ) < 0 && "on" + type;
+
+		// Caller can pass in a jQuery.Event object, Object, or just an event type string
+		event = event[ jQuery.expando ] ?
+			event :
+			new jQuery.Event( type, typeof event === "object" && event );
+
+		// Trigger bitmask: & 1 for native handlers; & 2 for jQuery (always true)
+		event.isTrigger = onlyHandlers ? 2 : 3;
+		event.namespace = namespaces.join( "." );
+		event.rnamespace = event.namespace ?
+			new RegExp( "(^|\\.)" + namespaces.join( "\\.(?:.*\\.|)" ) + "(\\.|$)" ) :
+			null;
+
+		// Clean up the event in case it is being reused
+		event.result = undefined;
+		if ( !event.target ) {
+			event.target = elem;
+		}
+
+		// Clone any incoming data and prepend the event, creating the handler arg list
+		data = data == null ?
+			[ event ] :
+			jQuery.makeArray( data, [ event ] );
+
+		// Allow special events to draw outside the lines
+		special = jQuery.event.special[ type ] || {};
+		if ( !onlyHandlers && special.trigger && special.trigger.apply( elem, data ) === false ) {
+			return;
+		}
+
+		// Determine event propagation path in advance, per W3C events spec (#9951)
+		// Bubble up to document, then to window; watch for a global ownerDocument var (#9724)
+		if ( !onlyHandlers && !special.noBubble && !isWindow( elem ) ) {
+
+			bubbleType = special.delegateType || type;
+			if ( !rfocusMorph.test( bubbleType + type ) ) {
+				cur = cur.parentNode;
+			}
+			for ( ; cur; cur = cur.parentNode ) {
+				eventPath.push( cur );
+				tmp = cur;
+			}
+
+			// Only add window if we got to document (e.g., not plain obj or detached DOM)
+			if ( tmp === ( elem.ownerDocument || document ) ) {
+				eventPath.push( tmp.defaultView || tmp.parentWindow || window );
+			}
+		}
+
+		// Fire handlers on the event path
+		i = 0;
+		while ( ( cur = eventPath[ i++ ] ) && !event.isPropagationStopped() ) {
+			lastElement = cur;
+			event.type = i > 1 ?
+				bubbleType :
+				special.bindType || type;
+
+			// jQuery handler
+			handle = ( dataPriv.get( cur, "events" ) || {} )[ event.type ] &&
+				dataPriv.get( cur, "handle" );
+			if ( handle ) {
+				handle.apply( cur, data );
+			}
+
+			// Native handler
+			handle = ontype && cur[ ontype ];
+			if ( handle && handle.apply && acceptData( cur ) ) {
+				event.result = handle.apply( cur, data );
+				if ( event.result === false ) {
+					event.preventDefault();
+				}
+			}
+		}
+		event.type = type;
+
+		// If nobody prevented the default action, do it now
+		if ( !onlyHandlers && !event.isDefaultPrevented() ) {
+
+			if ( ( !special._default ||
+				special._default.apply( eventPath.pop(), data ) === false ) &&
+				acceptData( elem ) ) {
+
+				// Call a native DOM method on the target with the same name as the event.
+				// Don't do default actions on window, that's where global variables be (#6170)
+				if ( ontype && isFunction( elem[ type ] ) && !isWindow( elem ) ) {
+
+					// Don't re-trigger an onFOO event when we call its FOO() method
+					tmp = elem[ ontype ];
+
+					if ( tmp ) {
+						elem[ ontype ] = null;
+					}
+
+					// Prevent re-triggering of the same event, since we already bubbled it above
+					jQuery.event.triggered = type;
+
+					if ( event.isPropagationStopped() ) {
+						lastElement.addEventListener( type, stopPropagationCallback );
+					}
+
+					elem[ type ]();
+
+					if ( event.isPropagationStopped() ) {
+						lastElement.removeEventListener( type, stopPropagationCallback );
+					}
+
+					jQuery.event.triggered = undefined;
+
+					if ( tmp ) {
+						elem[ ontype ] = tmp;
+					}
+				}
+			}
+		}
+
+		return event.result;
+	},
+
+	// Piggyback on a donor event to simulate a different one
+	// Used only for `focus(in | out)` events
+	simulate: function( type, elem, event ) {
+		var e = jQuery.extend(
+			new jQuery.Event(),
+			event,
+			{
+				type: type,
+				isSimulated: true
+			}
+		);
+
+		jQuery.event.trigger( e, null, elem );
+	}
+
+} );
+
+jQuery.fn.extend( {
+
+	trigger: function( type, data ) {
+		return this.each( function() {
+			jQuery.event.trigger( type, data, this );
+		} );
+	},
+	triggerHandler: function( type, data ) {
+		var elem = this[ 0 ];
+		if ( elem ) {
+			return jQuery.event.trigger( type, data, elem, true );
+		}
+	}
+} );
+
+
+// Support: Firefox <=44
+// Firefox doesn't have focus(in | out) events
+// Related ticket - https://bugzilla.mozilla.org/show_bug.cgi?id=687787
+//
+// Support: Chrome <=48 - 49, Safari <=9.0 - 9.1
+// focus(in | out) events fire after focus & blur events,
+// which is spec violation - http://www.w3.org/TR/DOM-Level-3-Events/#events-focusevent-event-order
+// Related ticket - https://bugs.chromium.org/p/chromium/issues/detail?id=449857
+if ( !support.focusin ) {
+	jQuery.each( { focus: "focusin", blur: "focusout" }, function( orig, fix ) {
+
+		// Attach a single capturing handler on the document while someone wants focusin/focusout
+		var handler = function( event ) {
+			jQuery.event.simulate( fix, event.target, jQuery.event.fix( event ) );
+		};
+
+		jQuery.event.special[ fix ] = {
+			setup: function() {
+				var doc = this.ownerDocument || this,
+					attaches = dataPriv.access( doc, fix );
+
+				if ( !attaches ) {
+					doc.addEventListener( orig, handler, true );
+				}
+				dataPriv.access( doc, fix, ( attaches || 0 ) + 1 );
+			},
+			teardown: function() {
+				var doc = this.ownerDocument || this,
+					attaches = dataPriv.access( doc, fix ) - 1;
+
+				if ( !attaches ) {
+					doc.removeEventListener( orig, handler, true );
+					dataPriv.remove( doc, fix );
+
+				} else {
+					dataPriv.access( doc, fix, attaches );
+				}
+			}
+		};
+	} );
+}
+var location = window.location;
+
+var nonce = Date.now();
+
+var rquery = ( /\?/ );
+
+
+
+// Cross-browser xml parsing
+jQuery.parseXML = function( data ) {
+	var xml;
+	if ( !data || typeof data !== "string" ) {
+		return null;
+	}
+
+	// Support: IE 9 - 11 only
+	// IE throws on parseFromString with invalid input.
+	try {
+		xml = ( new window.DOMParser() ).parseFromString( data, "text/xml" );
+	} catch ( e ) {
+		xml = undefined;
+	}
+
+	if ( !xml || xml.getElementsByTagName( "parsererror" ).length ) {
+		jQuery.error( "Invalid XML: " + data );
+	}
+	return xml;
+};
+
+
+var
+	rbracket = /\[\]$/,
+	rCRLF = /\r?\n/g,
+	rsubmitterTypes = /^(?:submit|button|image|reset|file)$/i,
+	rsubmittable = /^(?:input|select|textarea|keygen)/i;
+
+function buildParams( prefix, obj, traditional, add ) {
+	var name;
+
+	if ( Array.isArray( obj ) ) {
+
+		// Serialize array item.
+		jQuery.each( obj, function( i, v ) {
+			if ( traditional || rbracket.test( prefix ) ) {
+
+				// Treat each array item as a scalar.
+				add( prefix, v );
+
+			} else {
+
+				// Item is non-scalar (array or object), encode its numeric index.
+				buildParams(
+					prefix + "[" + ( typeof v === "object" && v != null ? i : "" ) + "]",
+					v,
+					traditional,
+					add
+				);
+			}
+		} );
+
+	} else if ( !traditional && toType( obj ) === "object" ) {
+
+		// Serialize object item.
+		for ( name in obj ) {
+			buildParams( prefix + "[" + name + "]", obj[ name ], traditional, add );
+		}
+
+	} else {
+
+		// Serialize scalar item.
+		add( prefix, obj );
+	}
+}
+
+// Serialize an array of form elements or a set of
+// key/values into a query string
+jQuery.param = function( a, traditional ) {
+	var prefix,
+		s = [],
+		add = function( key, valueOrFunction ) {
+
+			// If value is a function, invoke it and use its return value
+			var value = isFunction( valueOrFunction ) ?
+				valueOrFunction() :
+				valueOrFunction;
+
+			s[ s.length ] = encodeURIComponent( key ) + "=" +
+				encodeURIComponent( value == null ? "" : value );
+		};
+
+	if ( a == null ) {
+		return "";
+	}
+
+	// If an array was passed in, assume that it is an array of form elements.
+	if ( Array.isArray( a ) || ( a.jquery && !jQuery.isPlainObject( a ) ) ) {
+
+		// Serialize the form elements
+		jQuery.each( a, function() {
+			add( this.name, this.value );
+		} );
+
+	} else {
+
+		// If traditional, encode the "old" way (the way 1.3.2 or older
+		// did it), otherwise encode params recursively.
+		for ( prefix in a ) {
+			buildParams( prefix, a[ prefix ], traditional, add );
+		}
+	}
+
+	// Return the resulting serialization
+	return s.join( "&" );
+};
+
+jQuery.fn.extend( {
+	serialize: function() {
+		return jQuery.param( this.serializeArray() );
+	},
+	serializeArray: function() {
+		return this.map( function() {
+
+			// Can add propHook for "elements" to filter or add form elements
+			var elements = jQuery.prop( this, "elements" );
+			return elements ? jQuery.makeArray( elements ) : this;
+		} )
+		.filter( function() {
+			var type = this.type;
+
+			// Use .is( ":disabled" ) so that fieldset[disabled] works
+			return this.name && !jQuery( this ).is( ":disabled" ) &&
+				rsubmittable.test( this.nodeName ) && !rsubmitterTypes.test( type ) &&
+				( this.checked || !rcheckableType.test( type ) );
+		} )
+		.map( function( i, elem ) {
+			var val = jQuery( this ).val();
+
+			if ( val == null ) {
+				return null;
+			}
+
+			if ( Array.isArray( val ) ) {
+				return jQuery.map( val, function( val ) {
+					return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
+				} );
+			}
+
+			return { name: elem.name, value: val.replace( rCRLF, "\r\n" ) };
+		} ).get();
+	}
+} );
+
+
+var
+	r20 = /%20/g,
+	rhash = /#.*$/,
+	rantiCache = /([?&])_=[^&]*/,
+	rheaders = /^(.*?):[ \t]*([^\r\n]*)$/mg,
+
+	// #7653, #8125, #8152: local protocol detection
+	rlocalProtocol = /^(?:about|app|app-storage|.+-extension|file|res|widget):$/,
+	rnoContent = /^(?:GET|HEAD)$/,
+	rprotocol = /^\/\//,
+
+	/* Prefilters
+	 * 1) They are useful to introduce custom dataTypes (see ajax/jsonp.js for an example)
+	 * 2) These are called:
+	 *    - BEFORE asking for a transport
+	 *    - AFTER param serialization (s.data is a string if s.processData is true)
+	 * 3) key is the dataType
+	 * 4) the catchall symbol "*" can be used
+	 * 5) execution will start with transport dataType and THEN continue down to "*" if needed
+	 */
+	prefilters = {},
+
+	/* Transports bindings
+	 * 1) key is the dataType
+	 * 2) the catchall symbol "*" can be used
+	 * 3) selection will start with transport dataType and THEN go to "*" if needed
+	 */
+	transports = {},
+
+	// Avoid comment-prolog char sequence (#10098); must appease lint and evade compression
+	allTypes = "*/".concat( "*" ),
+
+	// Anchor tag for parsing the document origin
+	originAnchor = document.createElement( "a" );
+	originAnchor.href = location.href;
+
+// Base "constructor" for jQuery.ajaxPrefilter and jQuery.ajaxTransport
+function addToPrefiltersOrTransports( structure ) {
+
+	// dataTypeExpression is optional and defaults to "*"
+	return function( dataTypeExpression, func ) {
+
+		if ( typeof dataTypeExpression !== "string" ) {
+			func = dataTypeExpression;
+			dataTypeExpression = "*";
+		}
+
+		var dataType,
+			i = 0,
+			dataTypes = dataTypeExpression.toLowerCase().match( rnothtmlwhite ) || [];
+
+		if ( isFunction( func ) ) {
+
+			// For each dataType in the dataTypeExpression
+			while ( ( dataType = dataTypes[ i++ ] ) ) {
+
+				// Prepend if requested
+				if ( dataType[ 0 ] === "+" ) {
+					dataType = dataType.slice( 1 ) || "*";
+					( structure[ dataType ] = structure[ dataType ] || [] ).unshift( func );
+
+				// Otherwise append
+				} else {
+					( structure[ dataType ] = structure[ dataType ] || [] ).push( func );
+				}
+			}
+		}
+	};
+}
+
+// Base inspection function for prefilters and transports
+function inspectPrefiltersOrTransports( structure, options, originalOptions, jqXHR ) {
+
+	var inspected = {},
+		seekingTransport = ( structure === transports );
+
+	function inspect( dataType ) {
+		var selected;
+		inspected[ dataType ] = true;
+		jQuery.each( structure[ dataType ] || [], function( _, prefilterOrFactory ) {
+			var dataTypeOrTransport = prefilterOrFactory( options, originalOptions, jqXHR );
+			if ( typeof dataTypeOrTransport === "string" &&
+				!seekingTransport && !inspected[ dataTypeOrTransport ] ) {
+
+				options.dataTypes.unshift( dataTypeOrTransport );
+				inspect( dataTypeOrTransport );
+				return false;
+			} else if ( seekingTransport ) {
+				return !( selected = dataTypeOrTransport );
+			}
+		} );
+		return selected;
+	}
+
+	return inspect( options.dataTypes[ 0 ] ) || !inspected[ "*" ] && inspect( "*" );
+}
+
+// A special extend for ajax options
+// that takes "flat" options (not to be deep extended)
+// Fixes #9887
+function ajaxExtend( target, src ) {
+	var key, deep,
+		flatOptions = jQuery.ajaxSettings.flatOptions || {};
+
+	for ( key in src ) {
+		if ( src[ key ] !== undefined ) {
+			( flatOptions[ key ] ? target : ( deep || ( deep = {} ) ) )[ key ] = src[ key ];
+		}
+	}
+	if ( deep ) {
+		jQuery.extend( true, target, deep );
+	}
+
+	return target;
+}
+
+/* Handles responses to an ajax request:
+ * - finds the right dataType (mediates between content-type and expected dataType)
+ * - returns the corresponding response
+ */
+function ajaxHandleResponses( s, jqXHR, responses ) {
+
+	var ct, type, finalDataType, firstDataType,
+		contents = s.contents,
+		dataTypes = s.dataTypes;
+
+	// Remove auto dataType and get content-type in the process
+	while ( dataTypes[ 0 ] === "*" ) {
+		dataTypes.shift();
+		if ( ct === undefined ) {
+			ct = s.mimeType || jqXHR.getResponseHeader( "Content-Type" );
+		}
+	}
+
+	// Check if we're dealing with a known content-type
+	if ( ct ) {
+		for ( type in contents ) {
+			if ( contents[ type ] && contents[ type ].test( ct ) ) {
+				dataTypes.unshift( type );
+				break;
+			}
+		}
+	}
+
+	// Check to see if we have a response for the expected dataType
+	if ( dataTypes[ 0 ] in responses ) {
+		finalDataType = dataTypes[ 0 ];
+	} else {
+
+		// Try convertible dataTypes
+		for ( type in responses ) {
+			if ( !dataTypes[ 0 ] || s.converters[ type + " " + dataTypes[ 0 ] ] ) {
+				finalDataType = type;
+				break;
+			}
+			if ( !firstDataType ) {
+				firstDataType = type;
+			}
+		}
+
+		// Or just use first one
+		finalDataType = finalDataType || firstDataType;
+	}
+
+	// If we found a dataType
+	// We add the dataType to the list if needed
+	// and return the corresponding response
+	if ( finalDataType ) {
+		if ( finalDataType !== dataTypes[ 0 ] ) {
+			dataTypes.unshift( finalDataType );
+		}
+		return responses[ finalDataType ];
+	}
+}
+
+/* Chain conversions given the request and the original response
+ * Also sets the responseXXX fields on the jqXHR instance
+ */
+function ajaxConvert( s, response, jqXHR, isSuccess ) {
+	var conv2, current, conv, tmp, prev,
+		converters = {},
+
+		// Work with a copy of dataTypes in case we need to modify it for conversion
+		dataTypes = s.dataTypes.slice();
+
+	// Create converters map with lowercased keys
+	if ( dataTypes[ 1 ] ) {
+		for ( conv in s.converters ) {
+			converters[ conv.toLowerCase() ] = s.converters[ conv ];
+		}
+	}
+
+	current = dataTypes.shift();
+
+	// Convert to each sequential dataType
+	while ( current ) {
+
+		if ( s.responseFields[ current ] ) {
+			jqXHR[ s.responseFields[ current ] ] = response;
+		}
+
+		// Apply the dataFilter if provided
+		if ( !prev && isSuccess && s.dataFilter ) {
+			response = s.dataFilter( response, s.dataType );
+		}
+
+		prev = current;
+		current = dataTypes.shift();
+
+		if ( current ) {
+
+			// There's only work to do if current dataType is non-auto
+			if ( current === "*" ) {
+
+				current = prev;
+
+			// Convert response if prev dataType is non-auto and differs from current
+			} else if ( prev !== "*" && prev !== current ) {
+
+				// Seek a direct converter
+				conv = converters[ prev + " " + current ] || converters[ "* " + current ];
+
+				// If none found, seek a pair
+				if ( !conv ) {
+					for ( conv2 in converters ) {
+
+						// If conv2 outputs current
+						tmp = conv2.split( " " );
+						if ( tmp[ 1 ] === current ) {
+
+							// If prev can be converted to accepted input
+							conv = converters[ prev + " " + tmp[ 0 ] ] ||
+								converters[ "* " + tmp[ 0 ] ];
+							if ( conv ) {
+
+								// Condense equivalence converters
+								if ( conv === true ) {
+									conv = converters[ conv2 ];
+
+								// Otherwise, insert the intermediate dataType
+								} else if ( converters[ conv2 ] !== true ) {
+									current = tmp[ 0 ];
+									dataTypes.unshift( tmp[ 1 ] );
+								}
+								break;
+							}
+						}
+					}
+				}
+
+				// Apply converter (if not an equivalence)
+				if ( conv !== true ) {
+
+					// Unless errors are allowed to bubble, catch and return them
+					if ( conv && s.throws ) {
+						response = conv( response );
+					} else {
+						try {
+							response = conv( response );
+						} catch ( e ) {
+							return {
+								state: "parsererror",
+								error: conv ? e : "No conversion from " + prev + " to " + current
+							};
+						}
+					}
+				}
+			}
+		}
+	}
+
+	return { state: "success", data: response };
+}
+
+jQuery.extend( {
+
+	// Counter for holding the number of active queries
+	active: 0,
+
+	// Last-Modified header cache for next request
+	lastModified: {},
+	etag: {},
+
+	ajaxSettings: {
+		url: location.href,
+		type: "GET",
+		isLocal: rlocalProtocol.test( location.protocol ),
+		global: true,
+		processData: true,
+		async: true,
+		contentType: "application/x-www-form-urlencoded; charset=UTF-8",
+
+		/*
+		timeout: 0,
+		data: null,
+		dataType: null,
+		username: null,
+		password: null,
+		cache: null,
+		throws: false,
+		traditional: false,
+		headers: {},
+		*/
+
+		accepts: {
+			"*": allTypes,
+			text: "text/plain",
+			html: "text/html",
+			xml: "application/xml, text/xml",
+			json: "application/json, text/javascript"
+		},
+
+		contents: {
+			xml: /\bxml\b/,
+			html: /\bhtml/,
+			json: /\bjson\b/
+		},
+
+		responseFields: {
+			xml: "responseXML",
+			text: "responseText",
+			json: "responseJSON"
+		},
+
+		// Data converters
+		// Keys separate source (or catchall "*") and destination types with a single space
+		converters: {
+
+			// Convert anything to text
+			"* text": String,
+
+			// Text to html (true = no transformation)
+			"text html": true,
+
+			// Evaluate text as a json expression
+			"text json": JSON.parse,
+
+			// Parse text as xml
+			"text xml": jQuery.parseXML
+		},
+
+		// For options that shouldn't be deep extended:
+		// you can add your own custom options here if
+		// and when you create one that shouldn't be
+		// deep extended (see ajaxExtend)
+		flatOptions: {
+			url: true,
+			context: true
+		}
+	},
+
+	// Creates a full fledged settings object into target
+	// with both ajaxSettings and settings fields.
+	// If target is omitted, writes into ajaxSettings.
+	ajaxSetup: function( target, settings ) {
+		return settings ?
+
+			// Building a settings object
+			ajaxExtend( ajaxExtend( target, jQuery.ajaxSettings ), settings ) :
+
+			// Extending ajaxSettings
+			ajaxExtend( jQuery.ajaxSettings, target );
+	},
+
+	ajaxPrefilter: addToPrefiltersOrTransports( prefilters ),
+	ajaxTransport: addToPrefiltersOrTransports( transports ),
+
+	// Main method
+	ajax: function( url, options ) {
+
+		// If url is an object, simulate pre-1.5 signature
+		if ( typeof url === "object" ) {
+			options = url;
+			url = undefined;
+		}
+
+		// Force options to be an object
+		options = options || {};
+
+		var transport,
+
+			// URL without anti-cache param
+			cacheURL,
+
+			// Response headers
+			responseHeadersString,
+			responseHeaders,
+
+			// timeout handle
+			timeoutTimer,
+
+			// Url cleanup var
+			urlAnchor,
+
+			// Request state (becomes false upon send and true upon completion)
+			completed,
+
+			// To know if global events are to be dispatched
+			fireGlobals,
+
+			// Loop variable
+			i,
+
+			// uncached part of the url
+			uncached,
+
+			// Create the final options object
+			s = jQuery.ajaxSetup( {}, options ),
+
+			// Callbacks context
+			callbackContext = s.context || s,
+
+			// Context for global events is callbackContext if it is a DOM node or jQuery collection
+			globalEventContext = s.context &&
+				( callbackContext.nodeType || callbackContext.jquery ) ?
+					jQuery( callbackContext ) :
+					jQuery.event,
+
+			// Deferreds
+			deferred = jQuery.Deferred(),
+			completeDeferred = jQuery.Callbacks( "once memory" ),
+
+			// Status-dependent callbacks
+			statusCode = s.statusCode || {},
+
+			// Headers (they are sent all at once)
+			requestHeaders = {},
+			requestHeadersNames = {},
+
+			// Default abort message
+			strAbort = "canceled",
+
+			// Fake xhr
+			jqXHR = {
+				readyState: 0,
+
+				// Builds headers hashtable if needed
+				getResponseHeader: function( key ) {
+					var match;
+					if ( completed ) {
+						if ( !responseHeaders ) {
+							responseHeaders = {};
+							while ( ( match = rheaders.exec( responseHeadersString ) ) ) {
+								responseHeaders[ match[ 1 ].toLowerCase() + " " ] =
+									( responseHeaders[ match[ 1 ].toLowerCase() + " " ] || [] )
+										.concat( match[ 2 ] );
+							}
+						}
+						match = responseHeaders[ key.toLowerCase() + " " ];
+					}
+					return match == null ? null : match.join( ", " );
+				},
+
+				// Raw string
+				getAllResponseHeaders: function() {
+					return completed ? responseHeadersString : null;
+				},
+
+				// Caches the header
+				setRequestHeader: function( name, value ) {
+					if ( completed == null ) {
+						name = requestHeadersNames[ name.toLowerCase() ] =
+							requestHeadersNames[ name.toLowerCase() ] || name;
+						requestHeaders[ name ] = value;
+					}
+					return this;
+				},
+
+				// Overrides response content-type header
+				overrideMimeType: function( type ) {
+					if ( completed == null ) {
+						s.mimeType = type;
+					}
+					return this;
+				},
+
+				// Status-dependent callbacks
+				statusCode: function( map ) {
+					var code;
+					if ( map ) {
+						if ( completed ) {
+
+							// Execute the appropriate callbacks
+							jqXHR.always( map[ jqXHR.status ] );
+						} else {
+
+							// Lazy-add the new callbacks in a way that preserves old ones
+							for ( code in map ) {
+								statusCode[ code ] = [ statusCode[ code ], map[ code ] ];
+							}
+						}
+					}
+					return this;
+				},
+
+				// Cancel the request
+				abort: function( statusText ) {
+					var finalText = statusText || strAbort;
+					if ( transport ) {
+						transport.abort( finalText );
+					}
+					done( 0, finalText );
+					return this;
+				}
+			};
+
+		// Attach deferreds
+		deferred.promise( jqXHR );
+
+		// Add protocol if not provided (prefilters might expect it)
+		// Handle falsy url in the settings object (#10093: consistency with old signature)
+		// We also use the url parameter if available
+		s.url = ( ( url || s.url || location.href ) + "" )
+			.replace( rprotocol, location.protocol + "//" );
+
+		// Alias method option to type as per ticket #12004
+		s.type = options.method || options.type || s.method || s.type;
+
+		// Extract dataTypes list
+		s.dataTypes = ( s.dataType || "*" ).toLowerCase().match( rnothtmlwhite ) || [ "" ];
+
+		// A cross-domain request is in order when the origin doesn't match the current origin.
+		if ( s.crossDomain == null ) {
+			urlAnchor = document.createElement( "a" );
+
+			// Support: IE <=8 - 11, Edge 12 - 15
+			// IE throws exception on accessing the href property if url is malformed,
+			// e.g. http://example.com:80x/
+			try {
+				urlAnchor.href = s.url;
+
+				// Support: IE <=8 - 11 only
+				// Anchor's host property isn't correctly set when s.url is relative
+				urlAnchor.href = urlAnchor.href;
+				s.crossDomain = originAnchor.protocol + "//" + originAnchor.host !==
+					urlAnchor.protocol + "//" + urlAnchor.host;
+			} catch ( e ) {
+
+				// If there is an error parsing the URL, assume it is crossDomain,
+				// it can be rejected by the transport if it is invalid
+				s.crossDomain = true;
+			}
+		}
+
+		// Convert data if not already a string
+		if ( s.data && s.processData && typeof s.data !== "string" ) {
+			s.data = jQuery.param( s.data, s.traditional );
+		}
+
+		// Apply prefilters
+		inspectPrefiltersOrTransports( prefilters, s, options, jqXHR );
+
+		// If request was aborted inside a prefilter, stop there
+		if ( completed ) {
+			return jqXHR;
+		}
+
+		// We can fire global events as of now if asked to
+		// Don't fire events if jQuery.event is undefined in an AMD-usage scenario (#15118)
+		fireGlobals = jQuery.event && s.global;
+
+		// Watch for a new set of requests
+		if ( fireGlobals && jQuery.active++ === 0 ) {
+			jQuery.event.trigger( "ajaxStart" );
+		}
+
+		// Uppercase the type
+		s.type = s.type.toUpperCase();
+
+		// Determine if request has content
+		s.hasContent = !rnoContent.test( s.type );
+
+		// Save the URL in case we're toying with the If-Modified-Since
+		// and/or If-None-Match header later on
+		// Remove hash to simplify url manipulation
+		cacheURL = s.url.replace( rhash, "" );
+
+		// More options handling for requests with no content
+		if ( !s.hasContent ) {
+
+			// Remember the hash so we can put it back
+			uncached = s.url.slice( cacheURL.length );
+
+			// If data is available and should be processed, append data to url
+			if ( s.data && ( s.processData || typeof s.data === "string" ) ) {
+				cacheURL += ( rquery.test( cacheURL ) ? "&" : "?" ) + s.data;
+
+				// #9682: remove data so that it's not used in an eventual retry
+				delete s.data;
+			}
+
+			// Add or update anti-cache param if needed
+			if ( s.cache === false ) {
+				cacheURL = cacheURL.replace( rantiCache, "$1" );
+				uncached = ( rquery.test( cacheURL ) ? "&" : "?" ) + "_=" + ( nonce++ ) + uncached;
+			}
+
+			// Put hash and anti-cache on the URL that will be requested (gh-1732)
+			s.url = cacheURL + uncached;
+
+		// Change '%20' to '+' if this is encoded form body content (gh-2658)
+		} else if ( s.data && s.processData &&
+			( s.contentType || "" ).indexOf( "application/x-www-form-urlencoded" ) === 0 ) {
+			s.data = s.data.replace( r20, "+" );
+		}
+
+		// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.
+		if ( s.ifModified ) {
+			if ( jQuery.lastModified[ cacheURL ] ) {
+				jqXHR.setRequestHeader( "If-Modified-Since", jQuery.lastModified[ cacheURL ] );
+			}
+			if ( jQuery.etag[ cacheURL ] ) {
+				jqXHR.setRequestHeader( "If-None-Match", jQuery.etag[ cacheURL ] );
+			}
+		}
+
+		// Set the correct header, if data is being sent
+		if ( s.data && s.hasContent && s.contentType !== false || options.contentType ) {
+			jqXHR.setRequestHeader( "Content-Type", s.contentType );
+		}
+
+		// Set the Accepts header for the server, depending on the dataType
+		jqXHR.setRequestHeader(
+			"Accept",
+			s.dataTypes[ 0 ] && s.accepts[ s.dataTypes[ 0 ] ] ?
+				s.accepts[ s.dataTypes[ 0 ] ] +
+					( s.dataTypes[ 0 ] !== "*" ? ", " + allTypes + "; q=0.01" : "" ) :
+				s.accepts[ "*" ]
+		);
+
+		// Check for headers option
+		for ( i in s.headers ) {
+			jqXHR.setRequestHeader( i, s.headers[ i ] );
+		}
+
+		// Allow custom headers/mimetypes and early abort
+		if ( s.beforeSend &&
+			( s.beforeSend.call( callbackContext, jqXHR, s ) === false || completed ) ) {
+
+			// Abort if not done already and return
+			return jqXHR.abort();
+		}
+
+		// Aborting is no longer a cancellation
+		strAbort = "abort";
+
+		// Install callbacks on deferreds
+		completeDeferred.add( s.complete );
+		jqXHR.done( s.success );
+		jqXHR.fail( s.error );
+
+		// Get transport
+		transport = inspectPrefiltersOrTransports( transports, s, options, jqXHR );
+
+		// If no transport, we auto-abort
+		if ( !transport ) {
+			done( -1, "No Transport" );
+		} else {
+			jqXHR.readyState = 1;
+
+			// Send global event
+			if ( fireGlobals ) {
+				globalEventContext.trigger( "ajaxSend", [ jqXHR, s ] );
+			}
+
+			// If request was aborted inside ajaxSend, stop there
+			if ( completed ) {
+				return jqXHR;
+			}
+
+			// Timeout
+			if ( s.async && s.timeout > 0 ) {
+				timeoutTimer = window.setTimeout( function() {
+					jqXHR.abort( "timeout" );
+				}, s.timeout );
+			}
+
+			try {
+				completed = false;
+				transport.send( requestHeaders, done );
+			} catch ( e ) {
+
+				// Rethrow post-completion exceptions
+				if ( completed ) {
+					throw e;
+				}
+
+				// Propagate others as results
+				done( -1, e );
+			}
+		}
+
+		// Callback for when everything is done
+		function done( status, nativeStatusText, responses, headers ) {
+			var isSuccess, success, error, response, modified,
+				statusText = nativeStatusText;
+
+			// Ignore repeat invocations
+			if ( completed ) {
+				return;
+			}
+
+			completed = true;
+
+			// Clear timeout if it exists
+			if ( timeoutTimer ) {
+				window.clearTimeout( timeoutTimer );
+			}
+
+			// Dereference transport for early garbage collection
+			// (no matter how long the jqXHR object will be used)
+			transport = undefined;
+
+			// Cache response headers
+			responseHeadersString = headers || "";
+
+			// Set readyState
+			jqXHR.readyState = status > 0 ? 4 : 0;
+
+			// Determine if successful
+			isSuccess = status >= 200 && status < 300 || status === 304;
+
+			// Get response data
+			if ( responses ) {
+				response = ajaxHandleResponses( s, jqXHR, responses );
+			}
+
+			// Convert no matter what (that way responseXXX fields are always set)
+			response = ajaxConvert( s, response, jqXHR, isSuccess );
+
+			// If successful, handle type chaining
+			if ( isSuccess ) {
+
+				// Set the If-Modified-Since and/or If-None-Match header, if in ifModified mode.
+				if ( s.ifModified ) {
+					modified = jqXHR.getResponseHeader( "Last-Modified" );
+					if ( modified ) {
+						jQuery.lastModified[ cacheURL ] = modified;
+					}
+					modified = jqXHR.getResponseHeader( "etag" );
+					if ( modified ) {
+						jQuery.etag[ cacheURL ] = modified;
+					}
+				}
+
+				// if no content
+				if ( status === 204 || s.type === "HEAD" ) {
+					statusText = "nocontent";
+
+				// if not modified
+				} else if ( status === 304 ) {
+					statusText = "notmodified";
+
+				// If we have data, let's convert it
+				} else {
+					statusText = response.state;
+					success = response.data;
+					error = response.error;
+					isSuccess = !error;
+				}
+			} else {
+
+				// Extract error from statusText and normalize for non-aborts
+				error = statusText;
+				if ( status || !statusText ) {
+					statusText = "error";
+					if ( status < 0 ) {
+						status = 0;
+					}
+				}
+			}
+
+			// Set data for the fake xhr object
+			jqXHR.status = status;
+			jqXHR.statusText = ( nativeStatusText || statusText ) + "";
+
+			// Success/Error
+			if ( isSuccess ) {
+				deferred.resolveWith( callbackContext, [ success, statusText, jqXHR ] );
+			} else {
+				deferred.rejectWith( callbackContext, [ jqXHR, statusText, error ] );
+			}
+
+			// Status-dependent callbacks
+			jqXHR.statusCode( statusCode );
+			statusCode = undefined;
+
+			if ( fireGlobals ) {
+				globalEventContext.trigger( isSuccess ? "ajaxSuccess" : "ajaxError",
+					[ jqXHR, s, isSuccess ? success : error ] );
+			}
+
+			// Complete
+			completeDeferred.fireWith( callbackContext, [ jqXHR, statusText ] );
+
+			if ( fireGlobals ) {
+				globalEventContext.trigger( "ajaxComplete", [ jqXHR, s ] );
+
+				// Handle the global AJAX counter
+				if ( !( --jQuery.active ) ) {
+					jQuery.event.trigger( "ajaxStop" );
+				}
+			}
+		}
+
+		return jqXHR;
+	},
+
+	getJSON: function( url, data, callback ) {
+		return jQuery.get( url, data, callback, "json" );
+	},
+
+	getScript: function( url, callback ) {
+		return jQuery.get( url, undefined, callback, "script" );
+	}
+} );
+
+jQuery.each( [ "get", "post" ], function( i, method ) {
+	jQuery[ method ] = function( url, data, callback, type ) {
+
+		// Shift arguments if data argument was omitted
+		if ( isFunction( data ) ) {
+			type = type || callback;
+			callback = data;
+			data = undefined;
+		}
+
+		// The url can be an options object (which then must have .url)
+		return jQuery.ajax( jQuery.extend( {
+			url: url,
+			type: method,
+			dataType: type,
+			data: data,
+			success: callback
+		}, jQuery.isPlainObject( url ) && url ) );
+	};
+} );
+
+
+jQuery._evalUrl = function( url, options ) {
+	return jQuery.ajax( {
+		url: url,
+
+		// Make this explicit, since user can override this through ajaxSetup (#11264)
+		type: "GET",
+		dataType: "script",
+		cache: true,
+		async: false,
+		global: false,
+
+		// Only evaluate the response if it is successful (gh-4126)
+		// dataFilter is not invoked for failure responses, so using it instead
+		// of the default converter is kludgy but it works.
+		converters: {
+			"text script": function() {}
+		},
+		dataFilter: function( response ) {
+			jQuery.globalEval( response, options );
+		}
+	} );
+};
+
+
+jQuery.fn.extend( {
+	wrapAll: function( html ) {
+		var wrap;
+
+		if ( this[ 0 ] ) {
+			if ( isFunction( html ) ) {
+				html = html.call( this[ 0 ] );
+			}
+
+			// The elements to wrap the target around
+			wrap = jQuery( html, this[ 0 ].ownerDocument ).eq( 0 ).clone( true );
+
+			if ( this[ 0 ].parentNode ) {
+				wrap.insertBefore( this[ 0 ] );
+			}
+
+			wrap.map( function() {
+				var elem = this;
+
+				while ( elem.firstElementChild ) {
+					elem = elem.firstElementChild;
+				}
+
+				return elem;
+			} ).append( this );
+		}
+
+		return this;
+	},
+
+	wrapInner: function( html ) {
+		if ( isFunction( html ) ) {
+			return this.each( function( i ) {
+				jQuery( this ).wrapInner( html.call( this, i ) );
+			} );
+		}
+
+		return this.each( function() {
+			var self = jQuery( this ),
+				contents = self.contents();
+
+			if ( contents.length ) {
+				contents.wrapAll( html );
+
+			} else {
+				self.append( html );
+			}
+		} );
+	},
+
+	wrap: function( html ) {
+		var htmlIsFunction = isFunction( html );
+
+		return this.each( function( i ) {
+			jQuery( this ).wrapAll( htmlIsFunction ? html.call( this, i ) : html );
+		} );
+	},
+
+	unwrap: function( selector ) {
+		this.parent( selector ).not( "body" ).each( function() {
+			jQuery( this ).replaceWith( this.childNodes );
+		} );
+		return this;
+	}
+} );
+
+
+jQuery.expr.pseudos.hidden = function( elem ) {
+	return !jQuery.expr.pseudos.visible( elem );
+};
+jQuery.expr.pseudos.visible = function( elem ) {
+	return !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length );
+};
+
+
+
+
+jQuery.ajaxSettings.xhr = function() {
+	try {
+		return new window.XMLHttpRequest();
+	} catch ( e ) {}
+};
+
+var xhrSuccessStatus = {
+
+		// File protocol always yields status code 0, assume 200
+		0: 200,
+
+		// Support: IE <=9 only
+		// #1450: sometimes IE returns 1223 when it should be 204
+		1223: 204
+	},
+	xhrSupported = jQuery.ajaxSettings.xhr();
+
+support.cors = !!xhrSupported && ( "withCredentials" in xhrSupported );
+support.ajax = xhrSupported = !!xhrSupported;
+
+jQuery.ajaxTransport( function( options ) {
+	var callback, errorCallback;
+
+	// Cross domain only allowed if supported through XMLHttpRequest
+	if ( support.cors || xhrSupported && !options.crossDomain ) {
+		return {
+			send: function( headers, complete ) {
+				var i,
+					xhr = options.xhr();
+
+				xhr.open(
+					options.type,
+					options.url,
+					options.async,
+					options.username,
+					options.password
+				);
+
+				// Apply custom fields if provided
+				if ( options.xhrFields ) {
+					for ( i in options.xhrFields ) {
+						xhr[ i ] = options.xhrFields[ i ];
+					}
+				}
+
+				// Override mime type if needed
+				if ( options.mimeType && xhr.overrideMimeType ) {
+					xhr.overrideMimeType( options.mimeType );
+				}
+
+				// X-Requested-With header
+				// For cross-domain requests, seeing as conditions for a preflight are
+				// akin to a jigsaw puzzle, we simply never set it to be sure.
+				// (it can always be set on a per-request basis or even using ajaxSetup)
+				// For same-domain requests, won't change header if already provided.
+				if ( !options.crossDomain && !headers[ "X-Requested-With" ] ) {
+					headers[ "X-Requested-With" ] = "XMLHttpRequest";
+				}
+
+				// Set headers
+				for ( i in headers ) {
+					xhr.setRequestHeader( i, headers[ i ] );
+				}
+
+				// Callback
+				callback = function( type ) {
+					return function() {
+						if ( callback ) {
+							callback = errorCallback = xhr.onload =
+								xhr.onerror = xhr.onabort = xhr.ontimeout =
+									xhr.onreadystatechange = null;
+
+							if ( type === "abort" ) {
+								xhr.abort();
+							} else if ( type === "error" ) {
+
+								// Support: IE <=9 only
+								// On a manual native abort, IE9 throws
+								// errors on any property access that is not readyState
+								if ( typeof xhr.status !== "number" ) {
+									complete( 0, "error" );
+								} else {
+									complete(
+
+										// File: protocol always yields status 0; see #8605, #14207
+										xhr.status,
+										xhr.statusText
+									);
+								}
+							} else {
+								complete(
+									xhrSuccessStatus[ xhr.status ] || xhr.status,
+									xhr.statusText,
+
+									// Support: IE <=9 only
+									// IE9 has no XHR2 but throws on binary (trac-11426)
+									// For XHR2 non-text, let the caller handle it (gh-2498)
+									( xhr.responseType || "text" ) !== "text"  ||
+									typeof xhr.responseText !== "string" ?
+										{ binary: xhr.response } :
+										{ text: xhr.responseText },
+									xhr.getAllResponseHeaders()
+								);
+							}
+						}
+					};
+				};
+
+				// Listen to events
+				xhr.onload = callback();
+				errorCallback = xhr.onerror = xhr.ontimeout = callback( "error" );
+
+				// Support: IE 9 only
+				// Use onreadystatechange to replace onabort
+				// to handle uncaught aborts
+				if ( xhr.onabort !== undefined ) {
+					xhr.onabort = errorCallback;
+				} else {
+					xhr.onreadystatechange = function() {
+
+						// Check readyState before timeout as it changes
+						if ( xhr.readyState === 4 ) {
+
+							// Allow onerror to be called first,
+							// but that will not handle a native abort
+							// Also, save errorCallback to a variable
+							// as xhr.onerror cannot be accessed
+							window.setTimeout( function() {
+								if ( callback ) {
+									errorCallback();
+								}
+							} );
+						}
+					};
+				}
+
+				// Create the abort callback
+				callback = callback( "abort" );
+
+				try {
+
+					// Do send the request (this may raise an exception)
+					xhr.send( options.hasContent && options.data || null );
+				} catch ( e ) {
+
+					// #14683: Only rethrow if this hasn't been notified as an error yet
+					if ( callback ) {
+						throw e;
+					}
+				}
+			},
+
+			abort: function() {
+				if ( callback ) {
+					callback();
+				}
+			}
+		};
+	}
+} );
+
+
+
+
+// Prevent auto-execution of scripts when no explicit dataType was provided (See gh-2432)
+jQuery.ajaxPrefilter( function( s ) {
+	if ( s.crossDomain ) {
+		s.contents.script = false;
+	}
+} );
+
+// Install script dataType
+jQuery.ajaxSetup( {
+	accepts: {
+		script: "text/javascript, application/javascript, " +
+			"application/ecmascript, application/x-ecmascript"
+	},
+	contents: {
+		script: /\b(?:java|ecma)script\b/
+	},
+	converters: {
+		"text script": function( text ) {
+			jQuery.globalEval( text );
+			return text;
+		}
+	}
+} );
+
+// Handle cache's special case and crossDomain
+jQuery.ajaxPrefilter( "script", function( s ) {
+	if ( s.cache === undefined ) {
+		s.cache = false;
+	}
+	if ( s.crossDomain ) {
+		s.type = "GET";
+	}
+} );
+
+// Bind script tag hack transport
+jQuery.ajaxTransport( "script", function( s ) {
+
+	// This transport only deals with cross domain or forced-by-attrs requests
+	if ( s.crossDomain || s.scriptAttrs ) {
+		var script, callback;
+		return {
+			send: function( _, complete ) {
+				script = jQuery( "<script>" )
+					.attr( s.scriptAttrs || {} )
+					.prop( { charset: s.scriptCharset, src: s.url } )
+					.on( "load error", callback = function( evt ) {
+						script.remove();
+						callback = null;
+						if ( evt ) {
+							complete( evt.type === "error" ? 404 : 200, evt.type );
+						}
+					} );
+
+				// Use native DOM manipulation to avoid our domManip AJAX trickery
+				document.head.appendChild( script[ 0 ] );
+			},
+			abort: function() {
+				if ( callback ) {
+					callback();
+				}
+			}
+		};
+	}
+} );
+
+
+
+
+var oldCallbacks = [],
+	rjsonp = /(=)\?(?=&|$)|\?\?/;
+
+// Default jsonp settings
+jQuery.ajaxSetup( {
+	jsonp: "callback",
+	jsonpCallback: function() {
+		var callback = oldCallbacks.pop() || ( jQuery.expando + "_" + ( nonce++ ) );
+		this[ callback ] = true;
+		return callback;
+	}
+} );
+
+// Detect, normalize options and install callbacks for jsonp requests
+jQuery.ajaxPrefilter( "json jsonp", function( s, originalSettings, jqXHR ) {
+
+	var callbackName, overwritten, responseContainer,
+		jsonProp = s.jsonp !== false && ( rjsonp.test( s.url ) ?
+			"url" :
+			typeof s.data === "string" &&
+				( s.contentType || "" )
+					.indexOf( "application/x-www-form-urlencoded" ) === 0 &&
+				rjsonp.test( s.data ) && "data"
+		);
+
+	// Handle iff the expected data type is "jsonp" or we have a parameter to set
+	if ( jsonProp || s.dataTypes[ 0 ] === "jsonp" ) {
+
+		// Get callback name, remembering preexisting value associated with it
+		callbackName = s.jsonpCallback = isFunction( s.jsonpCallback ) ?
+			s.jsonpCallback() :
+			s.jsonpCallback;
+
+		// Insert callback into url or form data
+		if ( jsonProp ) {
+			s[ jsonProp ] = s[ jsonProp ].replace( rjsonp, "$1" + callbackName );
+		} else if ( s.jsonp !== false ) {
+			s.url += ( rquery.test( s.url ) ? "&" : "?" ) + s.jsonp + "=" + callbackName;
+		}
+
+		// Use data converter to retrieve json after script execution
+		s.converters[ "script json" ] = function() {
+			if ( !responseContainer ) {
+				jQuery.error( callbackName + " was not called" );
+			}
+			return responseContainer[ 0 ];
+		};
+
+		// Force json dataType
+		s.dataTypes[ 0 ] = "json";
+
+		// Install callback
+		overwritten = window[ callbackName ];
+		window[ callbackName ] = function() {
+			responseContainer = arguments;
+		};
+
+		// Clean-up function (fires after converters)
+		jqXHR.always( function() {
+
+			// If previous value didn't exist - remove it
+			if ( overwritten === undefined ) {
+				jQuery( window ).removeProp( callbackName );
+
+			// Otherwise restore preexisting value
+			} else {
+				window[ callbackName ] = overwritten;
+			}
+
+			// Save back as free
+			if ( s[ callbackName ] ) {
+
+				// Make sure that re-using the options doesn't screw things around
+				s.jsonpCallback = originalSettings.jsonpCallback;
+
+				// Save the callback name for future use
+				oldCallbacks.push( callbackName );
+			}
+
+			// Call if it was a function and we have a response
+			if ( responseContainer && isFunction( overwritten ) ) {
+				overwritten( responseContainer[ 0 ] );
+			}
+
+			responseContainer = overwritten = undefined;
+		} );
+
+		// Delegate to script
+		return "script";
+	}
+} );
+
+
+
+
+// Support: Safari 8 only
+// In Safari 8 documents created via document.implementation.createHTMLDocument
+// collapse sibling forms: the second one becomes a child of the first one.
+// Because of that, this security measure has to be disabled in Safari 8.
+// https://bugs.webkit.org/show_bug.cgi?id=137337
+support.createHTMLDocument = ( function() {
+	var body = document.implementation.createHTMLDocument( "" ).body;
+	body.innerHTML = "<form></form><form></form>";
+	return body.childNodes.length === 2;
+} )();
+
+
+// Argument "data" should be string of html
+// context (optional): If specified, the fragment will be created in this context,
+// defaults to document
+// keepScripts (optional): If true, will include scripts passed in the html string
+jQuery.parseHTML = function( data, context, keepScripts ) {
+	if ( typeof data !== "string" ) {
+		return [];
+	}
+	if ( typeof context === "boolean" ) {
+		keepScripts = context;
+		context = false;
+	}
+
+	var base, parsed, scripts;
+
+	if ( !context ) {
+
+		// Stop scripts or inline event handlers from being executed immediately
+		// by using document.implementation
+		if ( support.createHTMLDocument ) {
+			context = document.implementation.createHTMLDocument( "" );
+
+			// Set the base href for the created document
+			// so any parsed elements with URLs
+			// are based on the document's URL (gh-2965)
+			base = context.createElement( "base" );
+			base.href = document.location.href;
+			context.head.appendChild( base );
+		} else {
+			context = document;
+		}
+	}
+
+	parsed = rsingleTag.exec( data );
+	scripts = !keepScripts && [];
+
+	// Single tag
+	if ( parsed ) {
+		return [ context.createElement( parsed[ 1 ] ) ];
+	}
+
+	parsed = buildFragment( [ data ], context, scripts );
+
+	if ( scripts && scripts.length ) {
+		jQuery( scripts ).remove();
+	}
+
+	return jQuery.merge( [], parsed.childNodes );
+};
+
+
+/**
+ * Load a url into a page
+ */
+jQuery.fn.load = function( url, params, callback ) {
+	var selector, type, response,
+		self = this,
+		off = url.indexOf( " " );
+
+	if ( off > -1 ) {
+		selector = stripAndCollapse( url.slice( off ) );
+		url = url.slice( 0, off );
+	}
+
+	// If it's a function
+	if ( isFunction( params ) ) {
+
+		// We assume that it's the callback
+		callback = params;
+		params = undefined;
+
+	// Otherwise, build a param string
+	} else if ( params && typeof params === "object" ) {
+		type = "POST";
+	}
+
+	// If we have elements to modify, make the request
+	if ( self.length > 0 ) {
+		jQuery.ajax( {
+			url: url,
+
+			// If "type" variable is undefined, then "GET" method will be used.
+			// Make value of this field explicit since
+			// user can override it through ajaxSetup method
+			type: type || "GET",
+			dataType: "html",
+			data: params
+		} ).done( function( responseText ) {
+
+			// Save response for use in complete callback
+			response = arguments;
+
+			self.html( selector ?
+
+				// If a selector was specified, locate the right elements in a dummy div
+				// Exclude scripts to avoid IE 'Permission Denied' errors
+				jQuery( "<div>" ).append( jQuery.parseHTML( responseText ) ).find( selector ) :
+
+				// Otherwise use the full result
+				responseText );
+
+		// If the request succeeds, this function gets "data", "status", "jqXHR"
+		// but they are ignored because response was set above.
+		// If it fails, this function gets "jqXHR", "status", "error"
+		} ).always( callback && function( jqXHR, status ) {
+			self.each( function() {
+				callback.apply( this, response || [ jqXHR.responseText, status, jqXHR ] );
+			} );
+		} );
+	}
+
+	return this;
+};
+
+
+
+
+// Attach a bunch of functions for handling common AJAX events
+jQuery.each( [
+	"ajaxStart",
+	"ajaxStop",
+	"ajaxComplete",
+	"ajaxError",
+	"ajaxSuccess",
+	"ajaxSend"
+], function( i, type ) {
+	jQuery.fn[ type ] = function( fn ) {
+		return this.on( type, fn );
+	};
+} );
+
+
+
+
+jQuery.expr.pseudos.animated = function( elem ) {
+	return jQuery.grep( jQuery.timers, function( fn ) {
+		return elem === fn.elem;
+	} ).length;
+};
+
+
+
+
+jQuery.offset = {
+	setOffset: function( elem, options, i ) {
+		var curPosition, curLeft, curCSSTop, curTop, curOffset, curCSSLeft, calculatePosition,
+			position = jQuery.css( elem, "position" ),
+			curElem = jQuery( elem ),
+			props = {};
+
+		// Set position first, in-case top/left are set even on static elem
+		if ( position === "static" ) {
+			elem.style.position = "relative";
+		}
+
+		curOffset = curElem.offset();
+		curCSSTop = jQuery.css( elem, "top" );
+		curCSSLeft = jQuery.css( elem, "left" );
+		calculatePosition = ( position === "absolute" || position === "fixed" ) &&
+			( curCSSTop + curCSSLeft ).indexOf( "auto" ) > -1;
+
+		// Need to be able to calculate position if either
+		// top or left is auto and position is either absolute or fixed
+		if ( calculatePosition ) {
+			curPosition = curElem.position();
+			curTop = curPosition.top;
+			curLeft = curPosition.left;
+
+		} else {
+			curTop = parseFloat( curCSSTop ) || 0;
+			curLeft = parseFloat( curCSSLeft ) || 0;
+		}
+
+		if ( isFunction( options ) ) {
+
+			// Use jQuery.extend here to allow modification of coordinates argument (gh-1848)
+			options = options.call( elem, i, jQuery.extend( {}, curOffset ) );
+		}
+
+		if ( options.top != null ) {
+			props.top = ( options.top - curOffset.top ) + curTop;
+		}
+		if ( options.left != null ) {
+			props.left = ( options.left - curOffset.left ) + curLeft;
+		}
+
+		if ( "using" in options ) {
+			options.using.call( elem, props );
+
+		} else {
+			curElem.css( props );
+		}
+	}
+};
+
+jQuery.fn.extend( {
+
+	// offset() relates an element's border box to the document origin
+	offset: function( options ) {
+
+		// Preserve chaining for setter
+		if ( arguments.length ) {
+			return options === undefined ?
+				this :
+				this.each( function( i ) {
+					jQuery.offset.setOffset( this, options, i );
+				} );
+		}
+
+		var rect, win,
+			elem = this[ 0 ];
+
+		if ( !elem ) {
+			return;
+		}
+
+		// Return zeros for disconnected and hidden (display: none) elements (gh-2310)
+		// Support: IE <=11 only
+		// Running getBoundingClientRect on a
+		// disconnected node in IE throws an error
+		if ( !elem.getClientRects().length ) {
+			return { top: 0, left: 0 };
+		}
+
+		// Get document-relative position by adding viewport scroll to viewport-relative gBCR
+		rect = elem.getBoundingClientRect();
+		win = elem.ownerDocument.defaultView;
+		return {
+			top: rect.top + win.pageYOffset,
+			left: rect.left + win.pageXOffset
+		};
+	},
+
+	// position() relates an element's margin box to its offset parent's padding box
+	// This corresponds to the behavior of CSS absolute positioning
+	position: function() {
+		if ( !this[ 0 ] ) {
+			return;
+		}
+
+		var offsetParent, offset, doc,
+			elem = this[ 0 ],
+			parentOffset = { top: 0, left: 0 };
+
+		// position:fixed elements are offset from the viewport, which itself always has zero offset
+		if ( jQuery.css( elem, "position" ) === "fixed" ) {
+
+			// Assume position:fixed implies availability of getBoundingClientRect
+			offset = elem.getBoundingClientRect();
+
+		} else {
+			offset = this.offset();
+
+			// Account for the *real* offset parent, which can be the document or its root element
+			// when a statically positioned element is identified
+			doc = elem.ownerDocument;
+			offsetParent = elem.offsetParent || doc.documentElement;
+			while ( offsetParent &&
+				( offsetParent === doc.body || offsetParent === doc.documentElement ) &&
+				jQuery.css( offsetParent, "position" ) === "static" ) {
+
+				offsetParent = offsetParent.parentNode;
+			}
+			if ( offsetParent && offsetParent !== elem && offsetParent.nodeType === 1 ) {
+
+				// Incorporate borders into its offset, since they are outside its content origin
+				parentOffset = jQuery( offsetParent ).offset();
+				parentOffset.top += jQuery.css( offsetParent, "borderTopWidth", true );
+				parentOffset.left += jQuery.css( offsetParent, "borderLeftWidth", true );
+			}
+		}
+
+		// Subtract parent offsets and element margins
+		return {
+			top: offset.top - parentOffset.top - jQuery.css( elem, "marginTop", true ),
+			left: offset.left - parentOffset.left - jQuery.css( elem, "marginLeft", true )
+		};
+	},
+
+	// This method will return documentElement in the following cases:
+	// 1) For the element inside the iframe without offsetParent, this method will return
+	//    documentElement of the parent window
+	// 2) For the hidden or detached element
+	// 3) For body or html element, i.e. in case of the html node - it will return itself
+	//
+	// but those exceptions were never presented as a real life use-cases
+	// and might be considered as more preferable results.
+	//
+	// This logic, however, is not guaranteed and can change at any point in the future
+	offsetParent: function() {
+		return this.map( function() {
+			var offsetParent = this.offsetParent;
+
+			while ( offsetParent && jQuery.css( offsetParent, "position" ) === "static" ) {
+				offsetParent = offsetParent.offsetParent;
+			}
+
+			return offsetParent || documentElement;
+		} );
+	}
+} );
+
+// Create scrollLeft and scrollTop methods
+jQuery.each( { scrollLeft: "pageXOffset", scrollTop: "pageYOffset" }, function( method, prop ) {
+	var top = "pageYOffset" === prop;
+
+	jQuery.fn[ method ] = function( val ) {
+		return access( this, function( elem, method, val ) {
+
+			// Coalesce documents and windows
+			var win;
+			if ( isWindow( elem ) ) {
+				win = elem;
+			} else if ( elem.nodeType === 9 ) {
+				win = elem.defaultView;
+			}
+
+			if ( val === undefined ) {
+				return win ? win[ prop ] : elem[ method ];
+			}
+
+			if ( win ) {
+				win.scrollTo(
+					!top ? val : win.pageXOffset,
+					top ? val : win.pageYOffset
+				);
+
+			} else {
+				elem[ method ] = val;
+			}
+		}, method, val, arguments.length );
+	};
+} );
+
+// Support: Safari <=7 - 9.1, Chrome <=37 - 49
+// Add the top/left cssHooks using jQuery.fn.position
+// Webkit bug: https://bugs.webkit.org/show_bug.cgi?id=29084
+// Blink bug: https://bugs.chromium.org/p/chromium/issues/detail?id=589347
+// getComputedStyle returns percent when specified for top/left/bottom/right;
+// rather than make the css module depend on the offset module, just check for it here
+jQuery.each( [ "top", "left" ], function( i, prop ) {
+	jQuery.cssHooks[ prop ] = addGetHookIf( support.pixelPosition,
+		function( elem, computed ) {
+			if ( computed ) {
+				computed = curCSS( elem, prop );
+
+				// If curCSS returns percentage, fallback to offset
+				return rnumnonpx.test( computed ) ?
+					jQuery( elem ).position()[ prop ] + "px" :
+					computed;
+			}
+		}
+	);
+} );
+
+
+// Create innerHeight, innerWidth, height, width, outerHeight and outerWidth methods
+jQuery.each( { Height: "height", Width: "width" }, function( name, type ) {
+	jQuery.each( { padding: "inner" + name, content: type, "": "outer" + name },
+		function( defaultExtra, funcName ) {
+
+		// Margin is only for outerHeight, outerWidth
+		jQuery.fn[ funcName ] = function( margin, value ) {
+			var chainable = arguments.length && ( defaultExtra || typeof margin !== "boolean" ),
+				extra = defaultExtra || ( margin === true || value === true ? "margin" : "border" );
+
+			return access( this, function( elem, type, value ) {
+				var doc;
+
+				if ( isWindow( elem ) ) {
+
+					// $( window ).outerWidth/Height return w/h including scrollbars (gh-1729)
+					return funcName.indexOf( "outer" ) === 0 ?
+						elem[ "inner" + name ] :
+						elem.document.documentElement[ "client" + name ];
+				}
+
+				// Get document width or height
+				if ( elem.nodeType === 9 ) {
+					doc = elem.documentElement;
+
+					// Either scroll[Width/Height] or offset[Width/Height] or client[Width/Height],
+					// whichever is greatest
+					return Math.max(
+						elem.body[ "scroll" + name ], doc[ "scroll" + name ],
+						elem.body[ "offset" + name ], doc[ "offset" + name ],
+						doc[ "client" + name ]
+					);
+				}
+
+				return value === undefined ?
+
+					// Get width or height on the element, requesting but not forcing parseFloat
+					jQuery.css( elem, type, extra ) :
+
+					// Set width or height on the element
+					jQuery.style( elem, type, value, extra );
+			}, type, chainable ? margin : undefined, chainable );
+		};
+	} );
+} );
+
+
+jQuery.each( ( "blur focus focusin focusout resize scroll click dblclick " +
+	"mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave " +
+	"change select submit keydown keypress keyup contextmenu" ).split( " " ),
+	function( i, name ) {
+
+	// Handle event binding
+	jQuery.fn[ name ] = function( data, fn ) {
+		return arguments.length > 0 ?
+			this.on( name, null, data, fn ) :
+			this.trigger( name );
+	};
+} );
+
+jQuery.fn.extend( {
+	hover: function( fnOver, fnOut ) {
+		return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
+	}
+} );
+
+
+
+
+jQuery.fn.extend( {
+
+	bind: function( types, data, fn ) {
+		return this.on( types, null, data, fn );
+	},
+	unbind: function( types, fn ) {
+		return this.off( types, null, fn );
+	},
+
+	delegate: function( selector, types, data, fn ) {
+		return this.on( types, selector, data, fn );
+	},
+	undelegate: function( selector, types, fn ) {
+
+		// ( namespace ) or ( selector, types [, fn] )
+		return arguments.length === 1 ?
+			this.off( selector, "**" ) :
+			this.off( types, selector || "**", fn );
+	}
+} );
+
+// Bind a function to a context, optionally partially applying any
+// arguments.
+// jQuery.proxy is deprecated to promote standards (specifically Function#bind)
+// However, it is not slated for removal any time soon
+jQuery.proxy = function( fn, context ) {
+	var tmp, args, proxy;
+
+	if ( typeof context === "string" ) {
+		tmp = fn[ context ];
+		context = fn;
+		fn = tmp;
+	}
+
+	// Quick check to determine if target is callable, in the spec
+	// this throws a TypeError, but we will just return undefined.
+	if ( !isFunction( fn ) ) {
+		return undefined;
+	}
+
+	// Simulated bind
+	args = slice.call( arguments, 2 );
+	proxy = function() {
+		return fn.apply( context || this, args.concat( slice.call( arguments ) ) );
+	};
+
+	// Set the guid of unique handler to the same of original handler, so it can be removed
+	proxy.guid = fn.guid = fn.guid || jQuery.guid++;
+
+	return proxy;
+};
+
+jQuery.holdReady = function( hold ) {
+	if ( hold ) {
+		jQuery.readyWait++;
+	} else {
+		jQuery.ready( true );
+	}
+};
+jQuery.isArray = Array.isArray;
+jQuery.parseJSON = JSON.parse;
+jQuery.nodeName = nodeName;
+jQuery.isFunction = isFunction;
+jQuery.isWindow = isWindow;
+jQuery.camelCase = camelCase;
+jQuery.type = toType;
+
+jQuery.now = Date.now;
+
+jQuery.isNumeric = function( obj ) {
+
+	// As of jQuery 3.0, isNumeric is limited to
+	// strings and numbers (primitives or objects)
+	// that can be coerced to finite numbers (gh-2662)
+	var type = jQuery.type( obj );
+	return ( type === "number" || type === "string" ) &&
+
+		// parseFloat NaNs numeric-cast false positives ("")
+		// ...but misinterprets leading-number strings, particularly hex literals ("0x...")
+		// subtraction forces infinities to NaN
+		!isNaN( obj - parseFloat( obj ) );
+};
+
+
+
+
+// Register as a named AMD module, since jQuery can be concatenated with other
+// files that may use define, but not via a proper concatenation script that
+// understands anonymous AMD modules. A named AMD is safest and most robust
+// way to register. Lowercase jquery is used because AMD module names are
+// derived from file names, and jQuery is normally delivered in a lowercase
+// file name. Do this after creating the global so that if an AMD module wants
+// to call noConflict to hide this version of jQuery, it will work.
+
+// Note that for maximum portability, libraries that are not jQuery should
+// declare themselves as anonymous modules, and avoid setting a global if an
+// AMD loader is present. jQuery is a special case. For more information, see
+// https://github.com/jrburke/requirejs/wiki/Updating-existing-libraries#wiki-anon
+
+if ( typeof define === "function" && define.amd ) {
+	define( "jquery", [], function() {
+		return jQuery;
+	} );
+}
+
+
+
+
+var
+
+	// Map over jQuery in case of overwrite
+	_jQuery = window.jQuery,
+
+	// Map over the $ in case of overwrite
+	_$ = window.$;
+
+jQuery.noConflict = function( deep ) {
+	if ( window.$ === jQuery ) {
+		window.$ = _$;
+	}
+
+	if ( deep && window.jQuery === jQuery ) {
+		window.jQuery = _jQuery;
+	}
+
+	return jQuery;
+};
+
+// Expose jQuery and $ identifiers, even in AMD
+// (#7102#comment:10, https://github.com/jquery/jquery/pull/557)
+// and CommonJS for browser emulators (#13566)
+if ( !noGlobal ) {
+	window.jQuery = window.$ = jQuery;
+}
+
+
+
+
+return jQuery;
+} );
+/**!
+ * @fileOverview Kickass library to create and place poppers near their reference elements.
+ * @version 1.14.5
+ * @license
+ * Copyright (c) 2016 Federico Zivolo and contributors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ * SOFTWARE.
+ */
+
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global.Popper = factory());
+}(this, (function () { 'use strict';
+
+var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined';
+
+var longerTimeoutBrowsers = ['Edge', 'Trident', 'Firefox'];
+var timeoutDuration = 0;
+for (var i = 0; i < longerTimeoutBrowsers.length; i += 1) {
+  if (isBrowser && navigator.userAgent.indexOf(longerTimeoutBrowsers[i]) >= 0) {
+    timeoutDuration = 1;
+    break;
+  }
+}
+
+function microtaskDebounce(fn) {
+  var called = false;
+  return function () {
+    if (called) {
+      return;
+    }
+    called = true;
+    window.Promise.resolve().then(function () {
+      called = false;
+      fn();
+    });
+  };
+}
+
+function taskDebounce(fn) {
+  var scheduled = false;
+  return function () {
+    if (!scheduled) {
+      scheduled = true;
+      setTimeout(function () {
+        scheduled = false;
+        fn();
+      }, timeoutDuration);
+    }
+  };
+}
+
+var supportsMicroTasks = isBrowser && window.Promise;
+
+/**
+* Create a debounced version of a method, that's asynchronously deferred
+* but called in the minimum time possible.
+*
+* @method
+* @memberof Popper.Utils
+* @argument {Function} fn
+* @returns {Function}
+*/
+var debounce = supportsMicroTasks ? microtaskDebounce : taskDebounce;
+
+/**
+ * Check if the given variable is a function
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Any} functionToCheck - variable to check
+ * @returns {Boolean} answer to: is a function?
+ */
+function isFunction(functionToCheck) {
+  var getType = {};
+  return functionToCheck && getType.toString.call(functionToCheck) === '[object Function]';
+}
+
+/**
+ * Get CSS computed property of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Eement} element
+ * @argument {String} property
+ */
+function getStyleComputedProperty(element, property) {
+  if (element.nodeType !== 1) {
+    return [];
+  }
+  // NOTE: 1 DOM access here
+  var window = element.ownerDocument.defaultView;
+  var css = window.getComputedStyle(element, null);
+  return property ? css[property] : css;
+}
+
+/**
+ * Returns the parentNode or the host of the element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} parent
+ */
+function getParentNode(element) {
+  if (element.nodeName === 'HTML') {
+    return element;
+  }
+  return element.parentNode || element.host;
+}
+
+/**
+ * Returns the scrolling parent of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} scroll parent
+ */
+function getScrollParent(element) {
+  // Return body, `getScroll` will take care to get the correct `scrollTop` from it
+  if (!element) {
+    return document.body;
+  }
+
+  switch (element.nodeName) {
+    case 'HTML':
+    case 'BODY':
+      return element.ownerDocument.body;
+    case '#document':
+      return element.body;
+  }
+
+  // Firefox want us to check `-x` and `-y` variations as well
+
+  var _getStyleComputedProp = getStyleComputedProperty(element),
+      overflow = _getStyleComputedProp.overflow,
+      overflowX = _getStyleComputedProp.overflowX,
+      overflowY = _getStyleComputedProp.overflowY;
+
+  if (/(auto|scroll|overlay)/.test(overflow + overflowY + overflowX)) {
+    return element;
+  }
+
+  return getScrollParent(getParentNode(element));
+}
+
+var isIE11 = isBrowser && !!(window.MSInputMethodContext && document.documentMode);
+var isIE10 = isBrowser && /MSIE 10/.test(navigator.userAgent);
+
+/**
+ * Determines if the browser is Internet Explorer
+ * @method
+ * @memberof Popper.Utils
+ * @param {Number} version to check
+ * @returns {Boolean} isIE
+ */
+function isIE(version) {
+  if (version === 11) {
+    return isIE11;
+  }
+  if (version === 10) {
+    return isIE10;
+  }
+  return isIE11 || isIE10;
+}
+
+/**
+ * Returns the offset parent of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} offset parent
+ */
+function getOffsetParent(element) {
+  if (!element) {
+    return document.documentElement;
+  }
+
+  var noOffsetParent = isIE(10) ? document.body : null;
+
+  // NOTE: 1 DOM access here
+  var offsetParent = element.offsetParent || null;
+  // Skip hidden elements which don't have an offsetParent
+  while (offsetParent === noOffsetParent && element.nextElementSibling) {
+    offsetParent = (element = element.nextElementSibling).offsetParent;
+  }
+
+  var nodeName = offsetParent && offsetParent.nodeName;
+
+  if (!nodeName || nodeName === 'BODY' || nodeName === 'HTML') {
+    return element ? element.ownerDocument.documentElement : document.documentElement;
+  }
+
+  // .offsetParent will return the closest TH, TD or TABLE in case
+  // no offsetParent is present, I hate this job...
+  if (['TH', 'TD', 'TABLE'].indexOf(offsetParent.nodeName) !== -1 && getStyleComputedProperty(offsetParent, 'position') === 'static') {
+    return getOffsetParent(offsetParent);
+  }
+
+  return offsetParent;
+}
+
+function isOffsetContainer(element) {
+  var nodeName = element.nodeName;
+
+  if (nodeName === 'BODY') {
+    return false;
+  }
+  return nodeName === 'HTML' || getOffsetParent(element.firstElementChild) === element;
+}
+
+/**
+ * Finds the root node (document, shadowDOM root) of the given element
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} node
+ * @returns {Element} root node
+ */
+function getRoot(node) {
+  if (node.parentNode !== null) {
+    return getRoot(node.parentNode);
+  }
+
+  return node;
+}
+
+/**
+ * Finds the offset parent common to the two provided nodes
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element1
+ * @argument {Element} element2
+ * @returns {Element} common offset parent
+ */
+function findCommonOffsetParent(element1, element2) {
+  // This check is needed to avoid errors in case one of the elements isn't defined for any reason
+  if (!element1 || !element1.nodeType || !element2 || !element2.nodeType) {
+    return document.documentElement;
+  }
+
+  // Here we make sure to give as "start" the element that comes first in the DOM
+  var order = element1.compareDocumentPosition(element2) & Node.DOCUMENT_POSITION_FOLLOWING;
+  var start = order ? element1 : element2;
+  var end = order ? element2 : element1;
+
+  // Get common ancestor container
+  var range = document.createRange();
+  range.setStart(start, 0);
+  range.setEnd(end, 0);
+  var commonAncestorContainer = range.commonAncestorContainer;
+
+  // Both nodes are inside #document
+
+  if (element1 !== commonAncestorContainer && element2 !== commonAncestorContainer || start.contains(end)) {
+    if (isOffsetContainer(commonAncestorContainer)) {
+      return commonAncestorContainer;
+    }
+
+    return getOffsetParent(commonAncestorContainer);
+  }
+
+  // one of the nodes is inside shadowDOM, find which one
+  var element1root = getRoot(element1);
+  if (element1root.host) {
+    return findCommonOffsetParent(element1root.host, element2);
+  } else {
+    return findCommonOffsetParent(element1, getRoot(element2).host);
+  }
+}
+
+/**
+ * Gets the scroll value of the given element in the given side (top and left)
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @argument {String} side `top` or `left`
+ * @returns {number} amount of scrolled pixels
+ */
+function getScroll(element) {
+  var side = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'top';
+
+  var upperSide = side === 'top' ? 'scrollTop' : 'scrollLeft';
+  var nodeName = element.nodeName;
+
+  if (nodeName === 'BODY' || nodeName === 'HTML') {
+    var html = element.ownerDocument.documentElement;
+    var scrollingElement = element.ownerDocument.scrollingElement || html;
+    return scrollingElement[upperSide];
+  }
+
+  return element[upperSide];
+}
+
+/*
+ * Sum or subtract the element scroll values (left and top) from a given rect object
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} rect - Rect object you want to change
+ * @param {HTMLElement} element - The element from the function reads the scroll values
+ * @param {Boolean} subtract - set to true if you want to subtract the scroll values
+ * @return {Object} rect - The modifier rect object
+ */
+function includeScroll(rect, element) {
+  var subtract = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+  var scrollTop = getScroll(element, 'top');
+  var scrollLeft = getScroll(element, 'left');
+  var modifier = subtract ? -1 : 1;
+  rect.top += scrollTop * modifier;
+  rect.bottom += scrollTop * modifier;
+  rect.left += scrollLeft * modifier;
+  rect.right += scrollLeft * modifier;
+  return rect;
+}
+
+/*
+ * Helper to detect borders of a given element
+ * @method
+ * @memberof Popper.Utils
+ * @param {CSSStyleDeclaration} styles
+ * Result of `getStyleComputedProperty` on the given element
+ * @param {String} axis - `x` or `y`
+ * @return {number} borders - The borders size of the given axis
+ */
+
+function getBordersSize(styles, axis) {
+  var sideA = axis === 'x' ? 'Left' : 'Top';
+  var sideB = sideA === 'Left' ? 'Right' : 'Bottom';
+
+  return parseFloat(styles['border' + sideA + 'Width'], 10) + parseFloat(styles['border' + sideB + 'Width'], 10);
+}
+
+function getSize(axis, body, html, computedStyle) {
+  return Math.max(body['offset' + axis], body['scroll' + axis], html['client' + axis], html['offset' + axis], html['scroll' + axis], isIE(10) ? parseInt(html['offset' + axis]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Top' : 'Left')]) + parseInt(computedStyle['margin' + (axis === 'Height' ? 'Bottom' : 'Right')]) : 0);
+}
+
+function getWindowSizes(document) {
+  var body = document.body;
+  var html = document.documentElement;
+  var computedStyle = isIE(10) && getComputedStyle(html);
+
+  return {
+    height: getSize('Height', body, html, computedStyle),
+    width: getSize('Width', body, html, computedStyle)
+  };
+}
+
+var classCallCheck = function (instance, Constructor) {
+  if (!(instance instanceof Constructor)) {
+    throw new TypeError("Cannot call a class as a function");
+  }
+};
+
+var createClass = function () {
+  function defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  return function (Constructor, protoProps, staticProps) {
+    if (protoProps) defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) defineProperties(Constructor, staticProps);
+    return Constructor;
+  };
+}();
+
+
+
+
+
+var defineProperty = function (obj, key, value) {
+  if (key in obj) {
+    Object.defineProperty(obj, key, {
+      value: value,
+      enumerable: true,
+      configurable: true,
+      writable: true
+    });
+  } else {
+    obj[key] = value;
+  }
+
+  return obj;
+};
+
+var _extends = Object.assign || function (target) {
+  for (var i = 1; i < arguments.length; i++) {
+    var source = arguments[i];
+
+    for (var key in source) {
+      if (Object.prototype.hasOwnProperty.call(source, key)) {
+        target[key] = source[key];
+      }
+    }
+  }
+
+  return target;
+};
+
+/**
+ * Given element offsets, generate an output similar to getBoundingClientRect
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Object} offsets
+ * @returns {Object} ClientRect like output
+ */
+function getClientRect(offsets) {
+  return _extends({}, offsets, {
+    right: offsets.left + offsets.width,
+    bottom: offsets.top + offsets.height
+  });
+}
+
+/**
+ * Get bounding client rect of given element
+ * @method
+ * @memberof Popper.Utils
+ * @param {HTMLElement} element
+ * @return {Object} client rect
+ */
+function getBoundingClientRect(element) {
+  var rect = {};
+
+  // IE10 10 FIX: Please, don't ask, the element isn't
+  // considered in DOM in some circumstances...
+  // This isn't reproducible in IE10 compatibility mode of IE11
+  try {
+    if (isIE(10)) {
+      rect = element.getBoundingClientRect();
+      var scrollTop = getScroll(element, 'top');
+      var scrollLeft = getScroll(element, 'left');
+      rect.top += scrollTop;
+      rect.left += scrollLeft;
+      rect.bottom += scrollTop;
+      rect.right += scrollLeft;
+    } else {
+      rect = element.getBoundingClientRect();
+    }
+  } catch (e) {}
+
+  var result = {
+    left: rect.left,
+    top: rect.top,
+    width: rect.right - rect.left,
+    height: rect.bottom - rect.top
+  };
+
+  // subtract scrollbar size from sizes
+  var sizes = element.nodeName === 'HTML' ? getWindowSizes(element.ownerDocument) : {};
+  var width = sizes.width || element.clientWidth || result.right - result.left;
+  var height = sizes.height || element.clientHeight || result.bottom - result.top;
+
+  var horizScrollbar = element.offsetWidth - width;
+  var vertScrollbar = element.offsetHeight - height;
+
+  // if an hypothetical scrollbar is detected, we must be sure it's not a `border`
+  // we make this check conditional for performance reasons
+  if (horizScrollbar || vertScrollbar) {
+    var styles = getStyleComputedProperty(element);
+    horizScrollbar -= getBordersSize(styles, 'x');
+    vertScrollbar -= getBordersSize(styles, 'y');
+
+    result.width -= horizScrollbar;
+    result.height -= vertScrollbar;
+  }
+
+  return getClientRect(result);
+}
+
+function getOffsetRectRelativeToArbitraryNode(children, parent) {
+  var fixedPosition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+
+  var isIE10 = isIE(10);
+  var isHTML = parent.nodeName === 'HTML';
+  var childrenRect = getBoundingClientRect(children);
+  var parentRect = getBoundingClientRect(parent);
+  var scrollParent = getScrollParent(children);
+
+  var styles = getStyleComputedProperty(parent);
+  var borderTopWidth = parseFloat(styles.borderTopWidth, 10);
+  var borderLeftWidth = parseFloat(styles.borderLeftWidth, 10);
+
+  // In cases where the parent is fixed, we must ignore negative scroll in offset calc
+  if (fixedPosition && isHTML) {
+    parentRect.top = Math.max(parentRect.top, 0);
+    parentRect.left = Math.max(parentRect.left, 0);
+  }
+  var offsets = getClientRect({
+    top: childrenRect.top - parentRect.top - borderTopWidth,
+    left: childrenRect.left - parentRect.left - borderLeftWidth,
+    width: childrenRect.width,
+    height: childrenRect.height
+  });
+  offsets.marginTop = 0;
+  offsets.marginLeft = 0;
+
+  // Subtract margins of documentElement in case it's being used as parent
+  // we do this only on HTML because it's the only element that behaves
+  // differently when margins are applied to it. The margins are included in
+  // the box of the documentElement, in the other cases not.
+  if (!isIE10 && isHTML) {
+    var marginTop = parseFloat(styles.marginTop, 10);
+    var marginLeft = parseFloat(styles.marginLeft, 10);
+
+    offsets.top -= borderTopWidth - marginTop;
+    offsets.bottom -= borderTopWidth - marginTop;
+    offsets.left -= borderLeftWidth - marginLeft;
+    offsets.right -= borderLeftWidth - marginLeft;
+
+    // Attach marginTop and marginLeft because in some circumstances we may need them
+    offsets.marginTop = marginTop;
+    offsets.marginLeft = marginLeft;
+  }
+
+  if (isIE10 && !fixedPosition ? parent.contains(scrollParent) : parent === scrollParent && scrollParent.nodeName !== 'BODY') {
+    offsets = includeScroll(offsets, parent);
+  }
+
+  return offsets;
+}
+
+function getViewportOffsetRectRelativeToArtbitraryNode(element) {
+  var excludeScroll = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var html = element.ownerDocument.documentElement;
+  var relativeOffset = getOffsetRectRelativeToArbitraryNode(element, html);
+  var width = Math.max(html.clientWidth, window.innerWidth || 0);
+  var height = Math.max(html.clientHeight, window.innerHeight || 0);
+
+  var scrollTop = !excludeScroll ? getScroll(html) : 0;
+  var scrollLeft = !excludeScroll ? getScroll(html, 'left') : 0;
+
+  var offset = {
+    top: scrollTop - relativeOffset.top + relativeOffset.marginTop,
+    left: scrollLeft - relativeOffset.left + relativeOffset.marginLeft,
+    width: width,
+    height: height
+  };
+
+  return getClientRect(offset);
+}
+
+/**
+ * Check if the given element is fixed or is inside a fixed parent
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @argument {Element} customContainer
+ * @returns {Boolean} answer to "isFixed?"
+ */
+function isFixed(element) {
+  var nodeName = element.nodeName;
+  if (nodeName === 'BODY' || nodeName === 'HTML') {
+    return false;
+  }
+  if (getStyleComputedProperty(element, 'position') === 'fixed') {
+    return true;
+  }
+  return isFixed(getParentNode(element));
+}
+
+/**
+ * Finds the first parent of an element that has a transformed property defined
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Element} first transformed parent or documentElement
+ */
+
+function getFixedPositionOffsetParent(element) {
+  // This check is needed to avoid errors in case one of the elements isn't defined for any reason
+  if (!element || !element.parentElement || isIE()) {
+    return document.documentElement;
+  }
+  var el = element.parentElement;
+  while (el && getStyleComputedProperty(el, 'transform') === 'none') {
+    el = el.parentElement;
+  }
+  return el || document.documentElement;
+}
+
+/**
+ * Computed the boundaries limits and return them
+ * @method
+ * @memberof Popper.Utils
+ * @param {HTMLElement} popper
+ * @param {HTMLElement} reference
+ * @param {number} padding
+ * @param {HTMLElement} boundariesElement - Element used to define the boundaries
+ * @param {Boolean} fixedPosition - Is in fixed position mode
+ * @returns {Object} Coordinates of the boundaries
+ */
+function getBoundaries(popper, reference, padding, boundariesElement) {
+  var fixedPosition = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : false;
+
+  // NOTE: 1 DOM access here
+
+  var boundaries = { top: 0, left: 0 };
+  var offsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference);
+
+  // Handle viewport case
+  if (boundariesElement === 'viewport') {
+    boundaries = getViewportOffsetRectRelativeToArtbitraryNode(offsetParent, fixedPosition);
+  } else {
+    // Handle other cases based on DOM element used as boundaries
+    var boundariesNode = void 0;
+    if (boundariesElement === 'scrollParent') {
+      boundariesNode = getScrollParent(getParentNode(reference));
+      if (boundariesNode.nodeName === 'BODY') {
+        boundariesNode = popper.ownerDocument.documentElement;
+      }
+    } else if (boundariesElement === 'window') {
+      boundariesNode = popper.ownerDocument.documentElement;
+    } else {
+      boundariesNode = boundariesElement;
+    }
+
+    var offsets = getOffsetRectRelativeToArbitraryNode(boundariesNode, offsetParent, fixedPosition);
+
+    // In case of HTML, we need a different computation
+    if (boundariesNode.nodeName === 'HTML' && !isFixed(offsetParent)) {
+      var _getWindowSizes = getWindowSizes(popper.ownerDocument),
+          height = _getWindowSizes.height,
+          width = _getWindowSizes.width;
+
+      boundaries.top += offsets.top - offsets.marginTop;
+      boundaries.bottom = height + offsets.top;
+      boundaries.left += offsets.left - offsets.marginLeft;
+      boundaries.right = width + offsets.left;
+    } else {
+      // for all the other DOM elements, this one is good
+      boundaries = offsets;
+    }
+  }
+
+  // Add paddings
+  padding = padding || 0;
+  var isPaddingNumber = typeof padding === 'number';
+  boundaries.left += isPaddingNumber ? padding : padding.left || 0;
+  boundaries.top += isPaddingNumber ? padding : padding.top || 0;
+  boundaries.right -= isPaddingNumber ? padding : padding.right || 0;
+  boundaries.bottom -= isPaddingNumber ? padding : padding.bottom || 0;
+
+  return boundaries;
+}
+
+function getArea(_ref) {
+  var width = _ref.width,
+      height = _ref.height;
+
+  return width * height;
+}
+
+/**
+ * Utility used to transform the `auto` placement to the placement with more
+ * available space.
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function computeAutoPlacement(placement, refRect, popper, reference, boundariesElement) {
+  var padding = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 0;
+
+  if (placement.indexOf('auto') === -1) {
+    return placement;
+  }
+
+  var boundaries = getBoundaries(popper, reference, padding, boundariesElement);
+
+  var rects = {
+    top: {
+      width: boundaries.width,
+      height: refRect.top - boundaries.top
+    },
+    right: {
+      width: boundaries.right - refRect.right,
+      height: boundaries.height
+    },
+    bottom: {
+      width: boundaries.width,
+      height: boundaries.bottom - refRect.bottom
+    },
+    left: {
+      width: refRect.left - boundaries.left,
+      height: boundaries.height
+    }
+  };
+
+  var sortedAreas = Object.keys(rects).map(function (key) {
+    return _extends({
+      key: key
+    }, rects[key], {
+      area: getArea(rects[key])
+    });
+  }).sort(function (a, b) {
+    return b.area - a.area;
+  });
+
+  var filteredAreas = sortedAreas.filter(function (_ref2) {
+    var width = _ref2.width,
+        height = _ref2.height;
+    return width >= popper.clientWidth && height >= popper.clientHeight;
+  });
+
+  var computedPlacement = filteredAreas.length > 0 ? filteredAreas[0].key : sortedAreas[0].key;
+
+  var variation = placement.split('-')[1];
+
+  return computedPlacement + (variation ? '-' + variation : '');
+}
+
+/**
+ * Get offsets to the reference element
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} state
+ * @param {Element} popper - the popper element
+ * @param {Element} reference - the reference element (the popper will be relative to this)
+ * @param {Element} fixedPosition - is in fixed position mode
+ * @returns {Object} An object containing the offsets which will be applied to the popper
+ */
+function getReferenceOffsets(state, popper, reference) {
+  var fixedPosition = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
+
+  var commonOffsetParent = fixedPosition ? getFixedPositionOffsetParent(popper) : findCommonOffsetParent(popper, reference);
+  return getOffsetRectRelativeToArbitraryNode(reference, commonOffsetParent, fixedPosition);
+}
+
+/**
+ * Get the outer sizes of the given element (offset size + margins)
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element
+ * @returns {Object} object containing width and height properties
+ */
+function getOuterSizes(element) {
+  var window = element.ownerDocument.defaultView;
+  var styles = window.getComputedStyle(element);
+  var x = parseFloat(styles.marginTop) + parseFloat(styles.marginBottom);
+  var y = parseFloat(styles.marginLeft) + parseFloat(styles.marginRight);
+  var result = {
+    width: element.offsetWidth + y,
+    height: element.offsetHeight + x
+  };
+  return result;
+}
+
+/**
+ * Get the opposite placement of the given one
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement
+ * @returns {String} flipped placement
+ */
+function getOppositePlacement(placement) {
+  var hash = { left: 'right', right: 'left', bottom: 'top', top: 'bottom' };
+  return placement.replace(/left|right|bottom|top/g, function (matched) {
+    return hash[matched];
+  });
+}
+
+/**
+ * Get offsets to the popper
+ * @method
+ * @memberof Popper.Utils
+ * @param {Object} position - CSS position the Popper will get applied
+ * @param {HTMLElement} popper - the popper element
+ * @param {Object} referenceOffsets - the reference offsets (the popper will be relative to this)
+ * @param {String} placement - one of the valid placement options
+ * @returns {Object} popperOffsets - An object containing the offsets which will be applied to the popper
+ */
+function getPopperOffsets(popper, referenceOffsets, placement) {
+  placement = placement.split('-')[0];
+
+  // Get popper node sizes
+  var popperRect = getOuterSizes(popper);
+
+  // Add position, width and height to our offsets object
+  var popperOffsets = {
+    width: popperRect.width,
+    height: popperRect.height
+  };
+
+  // depending by the popper placement we have to compute its offsets slightly differently
+  var isHoriz = ['right', 'left'].indexOf(placement) !== -1;
+  var mainSide = isHoriz ? 'top' : 'left';
+  var secondarySide = isHoriz ? 'left' : 'top';
+  var measurement = isHoriz ? 'height' : 'width';
+  var secondaryMeasurement = !isHoriz ? 'height' : 'width';
+
+  popperOffsets[mainSide] = referenceOffsets[mainSide] + referenceOffsets[measurement] / 2 - popperRect[measurement] / 2;
+  if (placement === secondarySide) {
+    popperOffsets[secondarySide] = referenceOffsets[secondarySide] - popperRect[secondaryMeasurement];
+  } else {
+    popperOffsets[secondarySide] = referenceOffsets[getOppositePlacement(secondarySide)];
+  }
+
+  return popperOffsets;
+}
+
+/**
+ * Mimics the `find` method of Array
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Array} arr
+ * @argument prop
+ * @argument value
+ * @returns index or -1
+ */
+function find(arr, check) {
+  // use native find if supported
+  if (Array.prototype.find) {
+    return arr.find(check);
+  }
+
+  // use `filter` to obtain the same behavior of `find`
+  return arr.filter(check)[0];
+}
+
+/**
+ * Return the index of the matching object
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Array} arr
+ * @argument prop
+ * @argument value
+ * @returns index or -1
+ */
+function findIndex(arr, prop, value) {
+  // use native findIndex if supported
+  if (Array.prototype.findIndex) {
+    return arr.findIndex(function (cur) {
+      return cur[prop] === value;
+    });
+  }
+
+  // use `find` + `indexOf` if `findIndex` isn't supported
+  var match = find(arr, function (obj) {
+    return obj[prop] === value;
+  });
+  return arr.indexOf(match);
+}
+
+/**
+ * Loop trough the list of modifiers and run them in order,
+ * each of them will then edit the data object.
+ * @method
+ * @memberof Popper.Utils
+ * @param {dataObject} data
+ * @param {Array} modifiers
+ * @param {String} ends - Optional modifier name used as stopper
+ * @returns {dataObject}
+ */
+function runModifiers(modifiers, data, ends) {
+  var modifiersToRun = ends === undefined ? modifiers : modifiers.slice(0, findIndex(modifiers, 'name', ends));
+
+  modifiersToRun.forEach(function (modifier) {
+    if (modifier['function']) {
+      // eslint-disable-line dot-notation
+      console.warn('`modifier.function` is deprecated, use `modifier.fn`!');
+    }
+    var fn = modifier['function'] || modifier.fn; // eslint-disable-line dot-notation
+    if (modifier.enabled && isFunction(fn)) {
+      // Add properties to offsets to make them a complete clientRect object
+      // we do this before each modifier to make sure the previous one doesn't
+      // mess with these values
+      data.offsets.popper = getClientRect(data.offsets.popper);
+      data.offsets.reference = getClientRect(data.offsets.reference);
+
+      data = fn(data, modifier);
+    }
+  });
+
+  return data;
+}
+
+/**
+ * Updates the position of the popper, computing the new offsets and applying
+ * the new style.<br />
+ * Prefer `scheduleUpdate` over `update` because of performance reasons.
+ * @method
+ * @memberof Popper
+ */
+function update() {
+  // if popper is destroyed, don't perform any further update
+  if (this.state.isDestroyed) {
+    return;
+  }
+
+  var data = {
+    instance: this,
+    styles: {},
+    arrowStyles: {},
+    attributes: {},
+    flipped: false,
+    offsets: {}
+  };
+
+  // compute reference element offsets
+  data.offsets.reference = getReferenceOffsets(this.state, this.popper, this.reference, this.options.positionFixed);
+
+  // compute auto placement, store placement inside the data object,
+  // modifiers will be able to edit `placement` if needed
+  // and refer to originalPlacement to know the original value
+  data.placement = computeAutoPlacement(this.options.placement, data.offsets.reference, this.popper, this.reference, this.options.modifiers.flip.boundariesElement, this.options.modifiers.flip.padding);
+
+  // store the computed placement inside `originalPlacement`
+  data.originalPlacement = data.placement;
+
+  data.positionFixed = this.options.positionFixed;
+
+  // compute the popper offsets
+  data.offsets.popper = getPopperOffsets(this.popper, data.offsets.reference, data.placement);
+
+  data.offsets.popper.position = this.options.positionFixed ? 'fixed' : 'absolute';
+
+  // run the modifiers
+  data = runModifiers(this.modifiers, data);
+
+  // the first `update` will call `onCreate` callback
+  // the other ones will call `onUpdate` callback
+  if (!this.state.isCreated) {
+    this.state.isCreated = true;
+    this.options.onCreate(data);
+  } else {
+    this.options.onUpdate(data);
+  }
+}
+
+/**
+ * Helper used to know if the given modifier is enabled.
+ * @method
+ * @memberof Popper.Utils
+ * @returns {Boolean}
+ */
+function isModifierEnabled(modifiers, modifierName) {
+  return modifiers.some(function (_ref) {
+    var name = _ref.name,
+        enabled = _ref.enabled;
+    return enabled && name === modifierName;
+  });
+}
+
+/**
+ * Get the prefixed supported property name
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} property (camelCase)
+ * @returns {String} prefixed property (camelCase or PascalCase, depending on the vendor prefix)
+ */
+function getSupportedPropertyName(property) {
+  var prefixes = [false, 'ms', 'Webkit', 'Moz', 'O'];
+  var upperProp = property.charAt(0).toUpperCase() + property.slice(1);
+
+  for (var i = 0; i < prefixes.length; i++) {
+    var prefix = prefixes[i];
+    var toCheck = prefix ? '' + prefix + upperProp : property;
+    if (typeof document.body.style[toCheck] !== 'undefined') {
+      return toCheck;
+    }
+  }
+  return null;
+}
+
+/**
+ * Destroys the popper.
+ * @method
+ * @memberof Popper
+ */
+function destroy() {
+  this.state.isDestroyed = true;
+
+  // touch DOM only if `applyStyle` modifier is enabled
+  if (isModifierEnabled(this.modifiers, 'applyStyle')) {
+    this.popper.removeAttribute('x-placement');
+    this.popper.style.position = '';
+    this.popper.style.top = '';
+    this.popper.style.left = '';
+    this.popper.style.right = '';
+    this.popper.style.bottom = '';
+    this.popper.style.willChange = '';
+    this.popper.style[getSupportedPropertyName('transform')] = '';
+  }
+
+  this.disableEventListeners();
+
+  // remove the popper if user explicity asked for the deletion on destroy
+  // do not use `remove` because IE11 doesn't support it
+  if (this.options.removeOnDestroy) {
+    this.popper.parentNode.removeChild(this.popper);
+  }
+  return this;
+}
+
+/**
+ * Get the window associated with the element
+ * @argument {Element} element
+ * @returns {Window}
+ */
+function getWindow(element) {
+  var ownerDocument = element.ownerDocument;
+  return ownerDocument ? ownerDocument.defaultView : window;
+}
+
+function attachToScrollParents(scrollParent, event, callback, scrollParents) {
+  var isBody = scrollParent.nodeName === 'BODY';
+  var target = isBody ? scrollParent.ownerDocument.defaultView : scrollParent;
+  target.addEventListener(event, callback, { passive: true });
+
+  if (!isBody) {
+    attachToScrollParents(getScrollParent(target.parentNode), event, callback, scrollParents);
+  }
+  scrollParents.push(target);
+}
+
+/**
+ * Setup needed event listeners used to update the popper position
+ * @method
+ * @memberof Popper.Utils
+ * @private
+ */
+function setupEventListeners(reference, options, state, updateBound) {
+  // Resize event listener on window
+  state.updateBound = updateBound;
+  getWindow(reference).addEventListener('resize', state.updateBound, { passive: true });
+
+  // Scroll event listener on scroll parents
+  var scrollElement = getScrollParent(reference);
+  attachToScrollParents(scrollElement, 'scroll', state.updateBound, state.scrollParents);
+  state.scrollElement = scrollElement;
+  state.eventsEnabled = true;
+
+  return state;
+}
+
+/**
+ * It will add resize/scroll events and start recalculating
+ * position of the popper element when they are triggered.
+ * @method
+ * @memberof Popper
+ */
+function enableEventListeners() {
+  if (!this.state.eventsEnabled) {
+    this.state = setupEventListeners(this.reference, this.options, this.state, this.scheduleUpdate);
+  }
+}
+
+/**
+ * Remove event listeners used to update the popper position
+ * @method
+ * @memberof Popper.Utils
+ * @private
+ */
+function removeEventListeners(reference, state) {
+  // Remove resize event listener on window
+  getWindow(reference).removeEventListener('resize', state.updateBound);
+
+  // Remove scroll event listener on scroll parents
+  state.scrollParents.forEach(function (target) {
+    target.removeEventListener('scroll', state.updateBound);
+  });
+
+  // Reset state
+  state.updateBound = null;
+  state.scrollParents = [];
+  state.scrollElement = null;
+  state.eventsEnabled = false;
+  return state;
+}
+
+/**
+ * It will remove resize/scroll events and won't recalculate popper position
+ * when they are triggered. It also won't trigger `onUpdate` callback anymore,
+ * unless you call `update` method manually.
+ * @method
+ * @memberof Popper
+ */
+function disableEventListeners() {
+  if (this.state.eventsEnabled) {
+    cancelAnimationFrame(this.scheduleUpdate);
+    this.state = removeEventListeners(this.reference, this.state);
+  }
+}
+
+/**
+ * Tells if a given input is a number
+ * @method
+ * @memberof Popper.Utils
+ * @param {*} input to check
+ * @return {Boolean}
+ */
+function isNumeric(n) {
+  return n !== '' && !isNaN(parseFloat(n)) && isFinite(n);
+}
+
+/**
+ * Set the style to the given popper
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element - Element to apply the style to
+ * @argument {Object} styles
+ * Object with a list of properties and values which will be applied to the element
+ */
+function setStyles(element, styles) {
+  Object.keys(styles).forEach(function (prop) {
+    var unit = '';
+    // add unit if the value is numeric and is one of the following
+    if (['width', 'height', 'top', 'right', 'bottom', 'left'].indexOf(prop) !== -1 && isNumeric(styles[prop])) {
+      unit = 'px';
+    }
+    element.style[prop] = styles[prop] + unit;
+  });
+}
+
+/**
+ * Set the attributes to the given popper
+ * @method
+ * @memberof Popper.Utils
+ * @argument {Element} element - Element to apply the attributes to
+ * @argument {Object} styles
+ * Object with a list of properties and values which will be applied to the element
+ */
+function setAttributes(element, attributes) {
+  Object.keys(attributes).forEach(function (prop) {
+    var value = attributes[prop];
+    if (value !== false) {
+      element.setAttribute(prop, attributes[prop]);
+    } else {
+      element.removeAttribute(prop);
+    }
+  });
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} data.styles - List of style properties - values to apply to popper element
+ * @argument {Object} data.attributes - List of attribute properties - values to apply to popper element
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The same data object
+ */
+function applyStyle(data) {
+  // any property present in `data.styles` will be applied to the popper,
+  // in this way we can make the 3rd party modifiers add custom styles to it
+  // Be aware, modifiers could override the properties defined in the previous
+  // lines of this modifier!
+  setStyles(data.instance.popper, data.styles);
+
+  // any property present in `data.attributes` will be applied to the popper,
+  // they will be set as HTML attributes of the element
+  setAttributes(data.instance.popper, data.attributes);
+
+  // if arrowElement is defined and arrowStyles has some properties
+  if (data.arrowElement && Object.keys(data.arrowStyles).length) {
+    setStyles(data.arrowElement, data.arrowStyles);
+  }
+
+  return data;
+}
+
+/**
+ * Set the x-placement attribute before everything else because it could be used
+ * to add margins to the popper margins needs to be calculated to get the
+ * correct popper offsets.
+ * @method
+ * @memberof Popper.modifiers
+ * @param {HTMLElement} reference - The reference element used to position the popper
+ * @param {HTMLElement} popper - The HTML element used as popper
+ * @param {Object} options - Popper.js options
+ */
+function applyStyleOnLoad(reference, popper, options, modifierOptions, state) {
+  // compute reference element offsets
+  var referenceOffsets = getReferenceOffsets(state, popper, reference, options.positionFixed);
+
+  // compute auto placement, store placement inside the data object,
+  // modifiers will be able to edit `placement` if needed
+  // and refer to originalPlacement to know the original value
+  var placement = computeAutoPlacement(options.placement, referenceOffsets, popper, reference, options.modifiers.flip.boundariesElement, options.modifiers.flip.padding);
+
+  popper.setAttribute('x-placement', placement);
+
+  // Apply `position` to popper before anything else because
+  // without the position applied we can't guarantee correct computations
+  setStyles(popper, { position: options.positionFixed ? 'fixed' : 'absolute' });
+
+  return options;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function computeStyle(data, options) {
+  var x = options.x,
+      y = options.y;
+  var popper = data.offsets.popper;
+
+  // Remove this legacy support in Popper.js v2
+
+  var legacyGpuAccelerationOption = find(data.instance.modifiers, function (modifier) {
+    return modifier.name === 'applyStyle';
+  }).gpuAcceleration;
+  if (legacyGpuAccelerationOption !== undefined) {
+    console.warn('WARNING: `gpuAcceleration` option moved to `computeStyle` modifier and will not be supported in future versions of Popper.js!');
+  }
+  var gpuAcceleration = legacyGpuAccelerationOption !== undefined ? legacyGpuAccelerationOption : options.gpuAcceleration;
+
+  var offsetParent = getOffsetParent(data.instance.popper);
+  var offsetParentRect = getBoundingClientRect(offsetParent);
+
+  // Styles
+  var styles = {
+    position: popper.position
+  };
+
+  // Avoid blurry text by using full pixel integers.
+  // For pixel-perfect positioning, top/bottom prefers rounded
+  // values, while left/right prefers floored values.
+  var offsets = {
+    left: Math.floor(popper.left),
+    top: Math.round(popper.top),
+    bottom: Math.round(popper.bottom),
+    right: Math.floor(popper.right)
+  };
+
+  var sideA = x === 'bottom' ? 'top' : 'bottom';
+  var sideB = y === 'right' ? 'left' : 'right';
+
+  // if gpuAcceleration is set to `true` and transform is supported,
+  //  we use `translate3d` to apply the position to the popper we
+  // automatically use the supported prefixed version if needed
+  var prefixedProperty = getSupportedPropertyName('transform');
+
+  // now, let's make a step back and look at this code closely (wtf?)
+  // If the content of the popper grows once it's been positioned, it
+  // may happen that the popper gets misplaced because of the new content
+  // overflowing its reference element
+  // To avoid this problem, we provide two options (x and y), which allow
+  // the consumer to define the offset origin.
+  // If we position a popper on top of a reference element, we can set
+  // `x` to `top` to make the popper grow towards its top instead of
+  // its bottom.
+  var left = void 0,
+      top = void 0;
+  if (sideA === 'bottom') {
+    // when offsetParent is <html> the positioning is relative to the bottom of the screen (excluding the scrollbar)
+    // and not the bottom of the html element
+    if (offsetParent.nodeName === 'HTML') {
+      top = -offsetParent.clientHeight + offsets.bottom;
+    } else {
+      top = -offsetParentRect.height + offsets.bottom;
+    }
+  } else {
+    top = offsets.top;
+  }
+  if (sideB === 'right') {
+    if (offsetParent.nodeName === 'HTML') {
+      left = -offsetParent.clientWidth + offsets.right;
+    } else {
+      left = -offsetParentRect.width + offsets.right;
+    }
+  } else {
+    left = offsets.left;
+  }
+  if (gpuAcceleration && prefixedProperty) {
+    styles[prefixedProperty] = 'translate3d(' + left + 'px, ' + top + 'px, 0)';
+    styles[sideA] = 0;
+    styles[sideB] = 0;
+    styles.willChange = 'transform';
+  } else {
+    // othwerise, we use the standard `top`, `left`, `bottom` and `right` properties
+    var invertTop = sideA === 'bottom' ? -1 : 1;
+    var invertLeft = sideB === 'right' ? -1 : 1;
+    styles[sideA] = top * invertTop;
+    styles[sideB] = left * invertLeft;
+    styles.willChange = sideA + ', ' + sideB;
+  }
+
+  // Attributes
+  var attributes = {
+    'x-placement': data.placement
+  };
+
+  // Update `data` attributes, styles and arrowStyles
+  data.attributes = _extends({}, attributes, data.attributes);
+  data.styles = _extends({}, styles, data.styles);
+  data.arrowStyles = _extends({}, data.offsets.arrow, data.arrowStyles);
+
+  return data;
+}
+
+/**
+ * Helper used to know if the given modifier depends from another one.<br />
+ * It checks if the needed modifier is listed and enabled.
+ * @method
+ * @memberof Popper.Utils
+ * @param {Array} modifiers - list of modifiers
+ * @param {String} requestingName - name of requesting modifier
+ * @param {String} requestedName - name of requested modifier
+ * @returns {Boolean}
+ */
+function isModifierRequired(modifiers, requestingName, requestedName) {
+  var requesting = find(modifiers, function (_ref) {
+    var name = _ref.name;
+    return name === requestingName;
+  });
+
+  var isRequired = !!requesting && modifiers.some(function (modifier) {
+    return modifier.name === requestedName && modifier.enabled && modifier.order < requesting.order;
+  });
+
+  if (!isRequired) {
+    var _requesting = '`' + requestingName + '`';
+    var requested = '`' + requestedName + '`';
+    console.warn(requested + ' modifier is required by ' + _requesting + ' modifier in order to work, be sure to include it before ' + _requesting + '!');
+  }
+  return isRequired;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function arrow(data, options) {
+  var _data$offsets$arrow;
+
+  // arrow depends on keepTogether in order to work
+  if (!isModifierRequired(data.instance.modifiers, 'arrow', 'keepTogether')) {
+    return data;
+  }
+
+  var arrowElement = options.element;
+
+  // if arrowElement is a string, suppose it's a CSS selector
+  if (typeof arrowElement === 'string') {
+    arrowElement = data.instance.popper.querySelector(arrowElement);
+
+    // if arrowElement is not found, don't run the modifier
+    if (!arrowElement) {
+      return data;
+    }
+  } else {
+    // if the arrowElement isn't a query selector we must check that the
+    // provided DOM node is child of its popper node
+    if (!data.instance.popper.contains(arrowElement)) {
+      console.warn('WARNING: `arrow.element` must be child of its popper element!');
+      return data;
+    }
+  }
+
+  var placement = data.placement.split('-')[0];
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var isVertical = ['left', 'right'].indexOf(placement) !== -1;
+
+  var len = isVertical ? 'height' : 'width';
+  var sideCapitalized = isVertical ? 'Top' : 'Left';
+  var side = sideCapitalized.toLowerCase();
+  var altSide = isVertical ? 'left' : 'top';
+  var opSide = isVertical ? 'bottom' : 'right';
+  var arrowElementSize = getOuterSizes(arrowElement)[len];
+
+  //
+  // extends keepTogether behavior making sure the popper and its
+  // reference have enough pixels in conjunction
+  //
+
+  // top/left side
+  if (reference[opSide] - arrowElementSize < popper[side]) {
+    data.offsets.popper[side] -= popper[side] - (reference[opSide] - arrowElementSize);
+  }
+  // bottom/right side
+  if (reference[side] + arrowElementSize > popper[opSide]) {
+    data.offsets.popper[side] += reference[side] + arrowElementSize - popper[opSide];
+  }
+  data.offsets.popper = getClientRect(data.offsets.popper);
+
+  // compute center of the popper
+  var center = reference[side] + reference[len] / 2 - arrowElementSize / 2;
+
+  // Compute the sideValue using the updated popper offsets
+  // take popper margin in account because we don't have this info available
+  var css = getStyleComputedProperty(data.instance.popper);
+  var popperMarginSide = parseFloat(css['margin' + sideCapitalized], 10);
+  var popperBorderSide = parseFloat(css['border' + sideCapitalized + 'Width'], 10);
+  var sideValue = center - data.offsets.popper[side] - popperMarginSide - popperBorderSide;
+
+  // prevent arrowElement from being placed not contiguously to its popper
+  sideValue = Math.max(Math.min(popper[len] - arrowElementSize, sideValue), 0);
+
+  data.arrowElement = arrowElement;
+  data.offsets.arrow = (_data$offsets$arrow = {}, defineProperty(_data$offsets$arrow, side, Math.round(sideValue)), defineProperty(_data$offsets$arrow, altSide, ''), _data$offsets$arrow);
+
+  return data;
+}
+
+/**
+ * Get the opposite placement variation of the given one
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement variation
+ * @returns {String} flipped placement variation
+ */
+function getOppositeVariation(variation) {
+  if (variation === 'end') {
+    return 'start';
+  } else if (variation === 'start') {
+    return 'end';
+  }
+  return variation;
+}
+
+/**
+ * List of accepted placements to use as values of the `placement` option.<br />
+ * Valid placements are:
+ * - `auto`
+ * - `top`
+ * - `right`
+ * - `bottom`
+ * - `left`
+ *
+ * Each placement can have a variation from this list:
+ * - `-start`
+ * - `-end`
+ *
+ * Variations are interpreted easily if you think of them as the left to right
+ * written languages. Horizontally (`top` and `bottom`), `start` is left and `end`
+ * is right.<br />
+ * Vertically (`left` and `right`), `start` is top and `end` is bottom.
+ *
+ * Some valid examples are:
+ * - `top-end` (on top of reference, right aligned)
+ * - `right-start` (on right of reference, top aligned)
+ * - `bottom` (on bottom, centered)
+ * - `auto-end` (on the side with more space available, alignment depends by placement)
+ *
+ * @static
+ * @type {Array}
+ * @enum {String}
+ * @readonly
+ * @method placements
+ * @memberof Popper
+ */
+var placements = ['auto-start', 'auto', 'auto-end', 'top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start'];
+
+// Get rid of `auto` `auto-start` and `auto-end`
+var validPlacements = placements.slice(3);
+
+/**
+ * Given an initial placement, returns all the subsequent placements
+ * clockwise (or counter-clockwise).
+ *
+ * @method
+ * @memberof Popper.Utils
+ * @argument {String} placement - A valid placement (it accepts variations)
+ * @argument {Boolean} counter - Set to true to walk the placements counterclockwise
+ * @returns {Array} placements including their variations
+ */
+function clockwise(placement) {
+  var counter = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+
+  var index = validPlacements.indexOf(placement);
+  var arr = validPlacements.slice(index + 1).concat(validPlacements.slice(0, index));
+  return counter ? arr.reverse() : arr;
+}
+
+var BEHAVIORS = {
+  FLIP: 'flip',
+  CLOCKWISE: 'clockwise',
+  COUNTERCLOCKWISE: 'counterclockwise'
+};
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function flip(data, options) {
+  // if `inner` modifier is enabled, we can't use the `flip` modifier
+  if (isModifierEnabled(data.instance.modifiers, 'inner')) {
+    return data;
+  }
+
+  if (data.flipped && data.placement === data.originalPlacement) {
+    // seems like flip is trying to loop, probably there's not enough space on any of the flippable sides
+    return data;
+  }
+
+  var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, options.boundariesElement, data.positionFixed);
+
+  var placement = data.placement.split('-')[0];
+  var placementOpposite = getOppositePlacement(placement);
+  var variation = data.placement.split('-')[1] || '';
+
+  var flipOrder = [];
+
+  switch (options.behavior) {
+    case BEHAVIORS.FLIP:
+      flipOrder = [placement, placementOpposite];
+      break;
+    case BEHAVIORS.CLOCKWISE:
+      flipOrder = clockwise(placement);
+      break;
+    case BEHAVIORS.COUNTERCLOCKWISE:
+      flipOrder = clockwise(placement, true);
+      break;
+    default:
+      flipOrder = options.behavior;
+  }
+
+  flipOrder.forEach(function (step, index) {
+    if (placement !== step || flipOrder.length === index + 1) {
+      return data;
+    }
+
+    placement = data.placement.split('-')[0];
+    placementOpposite = getOppositePlacement(placement);
+
+    var popperOffsets = data.offsets.popper;
+    var refOffsets = data.offsets.reference;
+
+    // using floor because the reference offsets may contain decimals we are not going to consider here
+    var floor = Math.floor;
+    var overlapsRef = placement === 'left' && floor(popperOffsets.right) > floor(refOffsets.left) || placement === 'right' && floor(popperOffsets.left) < floor(refOffsets.right) || placement === 'top' && floor(popperOffsets.bottom) > floor(refOffsets.top) || placement === 'bottom' && floor(popperOffsets.top) < floor(refOffsets.bottom);
+
+    var overflowsLeft = floor(popperOffsets.left) < floor(boundaries.left);
+    var overflowsRight = floor(popperOffsets.right) > floor(boundaries.right);
+    var overflowsTop = floor(popperOffsets.top) < floor(boundaries.top);
+    var overflowsBottom = floor(popperOffsets.bottom) > floor(boundaries.bottom);
+
+    var overflowsBoundaries = placement === 'left' && overflowsLeft || placement === 'right' && overflowsRight || placement === 'top' && overflowsTop || placement === 'bottom' && overflowsBottom;
+
+    // flip the variation if required
+    var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;
+    var flippedVariation = !!options.flipVariations && (isVertical && variation === 'start' && overflowsLeft || isVertical && variation === 'end' && overflowsRight || !isVertical && variation === 'start' && overflowsTop || !isVertical && variation === 'end' && overflowsBottom);
+
+    if (overlapsRef || overflowsBoundaries || flippedVariation) {
+      // this boolean to detect any flip loop
+      data.flipped = true;
+
+      if (overlapsRef || overflowsBoundaries) {
+        placement = flipOrder[index + 1];
+      }
+
+      if (flippedVariation) {
+        variation = getOppositeVariation(variation);
+      }
+
+      data.placement = placement + (variation ? '-' + variation : '');
+
+      // this object contains `position`, we want to preserve it along with
+      // any additional property we may add in the future
+      data.offsets.popper = _extends({}, data.offsets.popper, getPopperOffsets(data.instance.popper, data.offsets.reference, data.placement));
+
+      data = runModifiers(data.instance.modifiers, data, 'flip');
+    }
+  });
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function keepTogether(data) {
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var placement = data.placement.split('-')[0];
+  var floor = Math.floor;
+  var isVertical = ['top', 'bottom'].indexOf(placement) !== -1;
+  var side = isVertical ? 'right' : 'bottom';
+  var opSide = isVertical ? 'left' : 'top';
+  var measurement = isVertical ? 'width' : 'height';
+
+  if (popper[side] < floor(reference[opSide])) {
+    data.offsets.popper[opSide] = floor(reference[opSide]) - popper[measurement];
+  }
+  if (popper[opSide] > floor(reference[side])) {
+    data.offsets.popper[opSide] = floor(reference[side]);
+  }
+
+  return data;
+}
+
+/**
+ * Converts a string containing value + unit into a px value number
+ * @function
+ * @memberof {modifiers~offset}
+ * @private
+ * @argument {String} str - Value + unit string
+ * @argument {String} measurement - `height` or `width`
+ * @argument {Object} popperOffsets
+ * @argument {Object} referenceOffsets
+ * @returns {Number|String}
+ * Value in pixels, or original string if no values were extracted
+ */
+function toValue(str, measurement, popperOffsets, referenceOffsets) {
+  // separate value from unit
+  var split = str.match(/((?:\-|\+)?\d*\.?\d*)(.*)/);
+  var value = +split[1];
+  var unit = split[2];
+
+  // If it's not a number it's an operator, I guess
+  if (!value) {
+    return str;
+  }
+
+  if (unit.indexOf('%') === 0) {
+    var element = void 0;
+    switch (unit) {
+      case '%p':
+        element = popperOffsets;
+        break;
+      case '%':
+      case '%r':
+      default:
+        element = referenceOffsets;
+    }
+
+    var rect = getClientRect(element);
+    return rect[measurement] / 100 * value;
+  } else if (unit === 'vh' || unit === 'vw') {
+    // if is a vh or vw, we calculate the size based on the viewport
+    var size = void 0;
+    if (unit === 'vh') {
+      size = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
+    } else {
+      size = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
+    }
+    return size / 100 * value;
+  } else {
+    // if is an explicit pixel unit, we get rid of the unit and keep the value
+    // if is an implicit unit, it's px, and we return just the value
+    return value;
+  }
+}
+
+/**
+ * Parse an `offset` string to extrapolate `x` and `y` numeric offsets.
+ * @function
+ * @memberof {modifiers~offset}
+ * @private
+ * @argument {String} offset
+ * @argument {Object} popperOffsets
+ * @argument {Object} referenceOffsets
+ * @argument {String} basePlacement
+ * @returns {Array} a two cells array with x and y offsets in numbers
+ */
+function parseOffset(offset, popperOffsets, referenceOffsets, basePlacement) {
+  var offsets = [0, 0];
+
+  // Use height if placement is left or right and index is 0 otherwise use width
+  // in this way the first offset will use an axis and the second one
+  // will use the other one
+  var useHeight = ['right', 'left'].indexOf(basePlacement) !== -1;
+
+  // Split the offset string to obtain a list of values and operands
+  // The regex addresses values with the plus or minus sign in front (+10, -20, etc)
+  var fragments = offset.split(/(\+|\-)/).map(function (frag) {
+    return frag.trim();
+  });
+
+  // Detect if the offset string contains a pair of values or a single one
+  // they could be separated by comma or space
+  var divider = fragments.indexOf(find(fragments, function (frag) {
+    return frag.search(/,|\s/) !== -1;
+  }));
+
+  if (fragments[divider] && fragments[divider].indexOf(',') === -1) {
+    console.warn('Offsets separated by white space(s) are deprecated, use a comma (,) instead.');
+  }
+
+  // If divider is found, we divide the list of values and operands to divide
+  // them by ofset X and Y.
+  var splitRegex = /\s*,\s*|\s+/;
+  var ops = divider !== -1 ? [fragments.slice(0, divider).concat([fragments[divider].split(splitRegex)[0]]), [fragments[divider].split(splitRegex)[1]].concat(fragments.slice(divider + 1))] : [fragments];
+
+  // Convert the values with units to absolute pixels to allow our computations
+  ops = ops.map(function (op, index) {
+    // Most of the units rely on the orientation of the popper
+    var measurement = (index === 1 ? !useHeight : useHeight) ? 'height' : 'width';
+    var mergeWithPrevious = false;
+    return op
+    // This aggregates any `+` or `-` sign that aren't considered operators
+    // e.g.: 10 + +5 => [10, +, +5]
+    .reduce(function (a, b) {
+      if (a[a.length - 1] === '' && ['+', '-'].indexOf(b) !== -1) {
+        a[a.length - 1] = b;
+        mergeWithPrevious = true;
+        return a;
+      } else if (mergeWithPrevious) {
+        a[a.length - 1] += b;
+        mergeWithPrevious = false;
+        return a;
+      } else {
+        return a.concat(b);
+      }
+    }, [])
+    // Here we convert the string values into number values (in px)
+    .map(function (str) {
+      return toValue(str, measurement, popperOffsets, referenceOffsets);
+    });
+  });
+
+  // Loop trough the offsets arrays and execute the operations
+  ops.forEach(function (op, index) {
+    op.forEach(function (frag, index2) {
+      if (isNumeric(frag)) {
+        offsets[index] += frag * (op[index2 - 1] === '-' ? -1 : 1);
+      }
+    });
+  });
+  return offsets;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @argument {Number|String} options.offset=0
+ * The offset value as described in the modifier description
+ * @returns {Object} The data object, properly modified
+ */
+function offset(data, _ref) {
+  var offset = _ref.offset;
+  var placement = data.placement,
+      _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var basePlacement = placement.split('-')[0];
+
+  var offsets = void 0;
+  if (isNumeric(+offset)) {
+    offsets = [+offset, 0];
+  } else {
+    offsets = parseOffset(offset, popper, reference, basePlacement);
+  }
+
+  if (basePlacement === 'left') {
+    popper.top += offsets[0];
+    popper.left -= offsets[1];
+  } else if (basePlacement === 'right') {
+    popper.top += offsets[0];
+    popper.left += offsets[1];
+  } else if (basePlacement === 'top') {
+    popper.left += offsets[0];
+    popper.top -= offsets[1];
+  } else if (basePlacement === 'bottom') {
+    popper.left += offsets[0];
+    popper.top += offsets[1];
+  }
+
+  data.popper = popper;
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function preventOverflow(data, options) {
+  var boundariesElement = options.boundariesElement || getOffsetParent(data.instance.popper);
+
+  // If offsetParent is the reference element, we really want to
+  // go one step up and use the next offsetParent as reference to
+  // avoid to make this modifier completely useless and look like broken
+  if (data.instance.reference === boundariesElement) {
+    boundariesElement = getOffsetParent(boundariesElement);
+  }
+
+  // NOTE: DOM access here
+  // resets the popper's position so that the document size can be calculated excluding
+  // the size of the popper element itself
+  var transformProp = getSupportedPropertyName('transform');
+  var popperStyles = data.instance.popper.style; // assignment to help minification
+  var top = popperStyles.top,
+      left = popperStyles.left,
+      transform = popperStyles[transformProp];
+
+  popperStyles.top = '';
+  popperStyles.left = '';
+  popperStyles[transformProp] = '';
+
+  var boundaries = getBoundaries(data.instance.popper, data.instance.reference, options.padding, boundariesElement, data.positionFixed);
+
+  // NOTE: DOM access here
+  // restores the original style properties after the offsets have been computed
+  popperStyles.top = top;
+  popperStyles.left = left;
+  popperStyles[transformProp] = transform;
+
+  options.boundaries = boundaries;
+
+  var order = options.priority;
+  var popper = data.offsets.popper;
+
+  var check = {
+    primary: function primary(placement) {
+      var value = popper[placement];
+      if (popper[placement] < boundaries[placement] && !options.escapeWithReference) {
+        value = Math.max(popper[placement], boundaries[placement]);
+      }
+      return defineProperty({}, placement, value);
+    },
+    secondary: function secondary(placement) {
+      var mainSide = placement === 'right' ? 'left' : 'top';
+      var value = popper[mainSide];
+      if (popper[placement] > boundaries[placement] && !options.escapeWithReference) {
+        value = Math.min(popper[mainSide], boundaries[placement] - (placement === 'right' ? popper.width : popper.height));
+      }
+      return defineProperty({}, mainSide, value);
+    }
+  };
+
+  order.forEach(function (placement) {
+    var side = ['left', 'top'].indexOf(placement) !== -1 ? 'primary' : 'secondary';
+    popper = _extends({}, popper, check[side](placement));
+  });
+
+  data.offsets.popper = popper;
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function shift(data) {
+  var placement = data.placement;
+  var basePlacement = placement.split('-')[0];
+  var shiftvariation = placement.split('-')[1];
+
+  // if shift shiftvariation is specified, run the modifier
+  if (shiftvariation) {
+    var _data$offsets = data.offsets,
+        reference = _data$offsets.reference,
+        popper = _data$offsets.popper;
+
+    var isVertical = ['bottom', 'top'].indexOf(basePlacement) !== -1;
+    var side = isVertical ? 'left' : 'top';
+    var measurement = isVertical ? 'width' : 'height';
+
+    var shiftOffsets = {
+      start: defineProperty({}, side, reference[side]),
+      end: defineProperty({}, side, reference[side] + reference[measurement] - popper[measurement])
+    };
+
+    data.offsets.popper = _extends({}, popper, shiftOffsets[shiftvariation]);
+  }
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by update method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function hide(data) {
+  if (!isModifierRequired(data.instance.modifiers, 'hide', 'preventOverflow')) {
+    return data;
+  }
+
+  var refRect = data.offsets.reference;
+  var bound = find(data.instance.modifiers, function (modifier) {
+    return modifier.name === 'preventOverflow';
+  }).boundaries;
+
+  if (refRect.bottom < bound.top || refRect.left > bound.right || refRect.top > bound.bottom || refRect.right < bound.left) {
+    // Avoid unnecessary DOM access if visibility hasn't changed
+    if (data.hide === true) {
+      return data;
+    }
+
+    data.hide = true;
+    data.attributes['x-out-of-boundaries'] = '';
+  } else {
+    // Avoid unnecessary DOM access if visibility hasn't changed
+    if (data.hide === false) {
+      return data;
+    }
+
+    data.hide = false;
+    data.attributes['x-out-of-boundaries'] = false;
+  }
+
+  return data;
+}
+
+/**
+ * @function
+ * @memberof Modifiers
+ * @argument {Object} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {Object} The data object, properly modified
+ */
+function inner(data) {
+  var placement = data.placement;
+  var basePlacement = placement.split('-')[0];
+  var _data$offsets = data.offsets,
+      popper = _data$offsets.popper,
+      reference = _data$offsets.reference;
+
+  var isHoriz = ['left', 'right'].indexOf(basePlacement) !== -1;
+
+  var subtractLength = ['top', 'left'].indexOf(basePlacement) === -1;
+
+  popper[isHoriz ? 'left' : 'top'] = reference[basePlacement] - (subtractLength ? popper[isHoriz ? 'width' : 'height'] : 0);
+
+  data.placement = getOppositePlacement(placement);
+  data.offsets.popper = getClientRect(popper);
+
+  return data;
+}
+
+/**
+ * Modifier function, each modifier can have a function of this type assigned
+ * to its `fn` property.<br />
+ * These functions will be called on each update, this means that you must
+ * make sure they are performant enough to avoid performance bottlenecks.
+ *
+ * @function ModifierFn
+ * @argument {dataObject} data - The data object generated by `update` method
+ * @argument {Object} options - Modifiers configuration and options
+ * @returns {dataObject} The data object, properly modified
+ */
+
+/**
+ * Modifiers are plugins used to alter the behavior of your poppers.<br />
+ * Popper.js uses a set of 9 modifiers to provide all the basic functionalities
+ * needed by the library.
+ *
+ * Usually you don't want to override the `order`, `fn` and `onLoad` props.
+ * All the other properties are configurations that could be tweaked.
+ * @namespace modifiers
+ */
+var modifiers = {
+  /**
+   * Modifier used to shift the popper on the start or end of its reference
+   * element.<br />
+   * It will read the variation of the `placement` property.<br />
+   * It can be one either `-end` or `-start`.
+   * @memberof modifiers
+   * @inner
+   */
+  shift: {
+    /** @prop {number} order=100 - Index used to define the order of execution */
+    order: 100,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: shift
+  },
+
+  /**
+   * The `offset` modifier can shift your popper on both its axis.
+   *
+   * It accepts the following units:
+   * - `px` or unit-less, interpreted as pixels
+   * - `%` or `%r`, percentage relative to the length of the reference element
+   * - `%p`, percentage relative to the length of the popper element
+   * - `vw`, CSS viewport width unit
+   * - `vh`, CSS viewport height unit
+   *
+   * For length is intended the main axis relative to the placement of the popper.<br />
+   * This means that if the placement is `top` or `bottom`, the length will be the
+   * `width`. In case of `left` or `right`, it will be the `height`.
+   *
+   * You can provide a single value (as `Number` or `String`), or a pair of values
+   * as `String` divided by a comma or one (or more) white spaces.<br />
+   * The latter is a deprecated method because it leads to confusion and will be
+   * removed in v2.<br />
+   * Additionally, it accepts additions and subtractions between different units.
+   * Note that multiplications and divisions aren't supported.
+   *
+   * Valid examples are:
+   * ```
+   * 10
+   * '10%'
+   * '10, 10'
+   * '10%, 10'
+   * '10 + 10%'
+   * '10 - 5vh + 3%'
+   * '-10px + 5vh, 5px - 6%'
+   * ```
+   * > **NB**: If you desire to apply offsets to your poppers in a way that may make them overlap
+   * > with their reference element, unfortunately, you will have to disable the `flip` modifier.
+   * > You can read more on this at this [issue](https://github.com/FezVrasta/popper.js/issues/373).
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  offset: {
+    /** @prop {number} order=200 - Index used to define the order of execution */
+    order: 200,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: offset,
+    /** @prop {Number|String} offset=0
+     * The offset value as described in the modifier description
+     */
+    offset: 0
+  },
+
+  /**
+   * Modifier used to prevent the popper from being positioned outside the boundary.
+   *
+   * A scenario exists where the reference itself is not within the boundaries.<br />
+   * We can say it has "escaped the boundaries" — or just "escaped".<br />
+   * In this case we need to decide whether the popper should either:
+   *
+   * - detach from the reference and remain "trapped" in the boundaries, or
+   * - if it should ignore the boundary and "escape with its reference"
+   *
+   * When `escapeWithReference` is set to`true` and reference is completely
+   * outside its boundaries, the popper will overflow (or completely leave)
+   * the boundaries in order to remain attached to the edge of the reference.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  preventOverflow: {
+    /** @prop {number} order=300 - Index used to define the order of execution */
+    order: 300,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: preventOverflow,
+    /**
+     * @prop {Array} [priority=['left','right','top','bottom']]
+     * Popper will try to prevent overflow following these priorities by default,
+     * then, it could overflow on the left and on top of the `boundariesElement`
+     */
+    priority: ['left', 'right', 'top', 'bottom'],
+    /**
+     * @prop {number} padding=5
+     * Amount of pixel used to define a minimum distance between the boundaries
+     * and the popper. This makes sure the popper always has a little padding
+     * between the edges of its container
+     */
+    padding: 5,
+    /**
+     * @prop {String|HTMLElement} boundariesElement='scrollParent'
+     * Boundaries used by the modifier. Can be `scrollParent`, `window`,
+     * `viewport` or any DOM element.
+     */
+    boundariesElement: 'scrollParent'
+  },
+
+  /**
+   * Modifier used to make sure the reference and its popper stay near each other
+   * without leaving any gap between the two. Especially useful when the arrow is
+   * enabled and you want to ensure that it points to its reference element.
+   * It cares only about the first axis. You can still have poppers with margin
+   * between the popper and its reference element.
+   * @memberof modifiers
+   * @inner
+   */
+  keepTogether: {
+    /** @prop {number} order=400 - Index used to define the order of execution */
+    order: 400,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: keepTogether
+  },
+
+  /**
+   * This modifier is used to move the `arrowElement` of the popper to make
+   * sure it is positioned between the reference element and its popper element.
+   * It will read the outer size of the `arrowElement` node to detect how many
+   * pixels of conjunction are needed.
+   *
+   * It has no effect if no `arrowElement` is provided.
+   * @memberof modifiers
+   * @inner
+   */
+  arrow: {
+    /** @prop {number} order=500 - Index used to define the order of execution */
+    order: 500,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: arrow,
+    /** @prop {String|HTMLElement} element='[x-arrow]' - Selector or node used as arrow */
+    element: '[x-arrow]'
+  },
+
+  /**
+   * Modifier used to flip the popper's placement when it starts to overlap its
+   * reference element.
+   *
+   * Requires the `preventOverflow` modifier before it in order to work.
+   *
+   * **NOTE:** this modifier will interrupt the current update cycle and will
+   * restart it if it detects the need to flip the placement.
+   * @memberof modifiers
+   * @inner
+   */
+  flip: {
+    /** @prop {number} order=600 - Index used to define the order of execution */
+    order: 600,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: flip,
+    /**
+     * @prop {String|Array} behavior='flip'
+     * The behavior used to change the popper's placement. It can be one of
+     * `flip`, `clockwise`, `counterclockwise` or an array with a list of valid
+     * placements (with optional variations)
+     */
+    behavior: 'flip',
+    /**
+     * @prop {number} padding=5
+     * The popper will flip if it hits the edges of the `boundariesElement`
+     */
+    padding: 5,
+    /**
+     * @prop {String|HTMLElement} boundariesElement='viewport'
+     * The element which will define the boundaries of the popper position.
+     * The popper will never be placed outside of the defined boundaries
+     * (except if `keepTogether` is enabled)
+     */
+    boundariesElement: 'viewport'
+  },
+
+  /**
+   * Modifier used to make the popper flow toward the inner of the reference element.
+   * By default, when this modifier is disabled, the popper will be placed outside
+   * the reference element.
+   * @memberof modifiers
+   * @inner
+   */
+  inner: {
+    /** @prop {number} order=700 - Index used to define the order of execution */
+    order: 700,
+    /** @prop {Boolean} enabled=false - Whether the modifier is enabled or not */
+    enabled: false,
+    /** @prop {ModifierFn} */
+    fn: inner
+  },
+
+  /**
+   * Modifier used to hide the popper when its reference element is outside of the
+   * popper boundaries. It will set a `x-out-of-boundaries` attribute which can
+   * be used to hide with a CSS selector the popper when its reference is
+   * out of boundaries.
+   *
+   * Requires the `preventOverflow` modifier before it in order to work.
+   * @memberof modifiers
+   * @inner
+   */
+  hide: {
+    /** @prop {number} order=800 - Index used to define the order of execution */
+    order: 800,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: hide
+  },
+
+  /**
+   * Computes the style that will be applied to the popper element to gets
+   * properly positioned.
+   *
+   * Note that this modifier will not touch the DOM, it just prepares the styles
+   * so that `applyStyle` modifier can apply it. This separation is useful
+   * in case you need to replace `applyStyle` with a custom implementation.
+   *
+   * This modifier has `850` as `order` value to maintain backward compatibility
+   * with previous versions of Popper.js. Expect the modifiers ordering method
+   * to change in future major versions of the library.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  computeStyle: {
+    /** @prop {number} order=850 - Index used to define the order of execution */
+    order: 850,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: computeStyle,
+    /**
+     * @prop {Boolean} gpuAcceleration=true
+     * If true, it uses the CSS 3D transformation to position the popper.
+     * Otherwise, it will use the `top` and `left` properties
+     */
+    gpuAcceleration: true,
+    /**
+     * @prop {string} [x='bottom']
+     * Where to anchor the X axis (`bottom` or `top`). AKA X offset origin.
+     * Change this if your popper should grow in a direction different from `bottom`
+     */
+    x: 'bottom',
+    /**
+     * @prop {string} [x='left']
+     * Where to anchor the Y axis (`left` or `right`). AKA Y offset origin.
+     * Change this if your popper should grow in a direction different from `right`
+     */
+    y: 'right'
+  },
+
+  /**
+   * Applies the computed styles to the popper element.
+   *
+   * All the DOM manipulations are limited to this modifier. This is useful in case
+   * you want to integrate Popper.js inside a framework or view library and you
+   * want to delegate all the DOM manipulations to it.
+   *
+   * Note that if you disable this modifier, you must make sure the popper element
+   * has its position set to `absolute` before Popper.js can do its work!
+   *
+   * Just disable this modifier and define your own to achieve the desired effect.
+   *
+   * @memberof modifiers
+   * @inner
+   */
+  applyStyle: {
+    /** @prop {number} order=900 - Index used to define the order of execution */
+    order: 900,
+    /** @prop {Boolean} enabled=true - Whether the modifier is enabled or not */
+    enabled: true,
+    /** @prop {ModifierFn} */
+    fn: applyStyle,
+    /** @prop {Function} */
+    onLoad: applyStyleOnLoad,
+    /**
+     * @deprecated since version 1.10.0, the property moved to `computeStyle` modifier
+     * @prop {Boolean} gpuAcceleration=true
+     * If true, it uses the CSS 3D transformation to position the popper.
+     * Otherwise, it will use the `top` and `left` properties
+     */
+    gpuAcceleration: undefined
+  }
+};
+
+/**
+ * The `dataObject` is an object containing all the information used by Popper.js.
+ * This object is passed to modifiers and to the `onCreate` and `onUpdate` callbacks.
+ * @name dataObject
+ * @property {Object} data.instance The Popper.js instance
+ * @property {String} data.placement Placement applied to popper
+ * @property {String} data.originalPlacement Placement originally defined on init
+ * @property {Boolean} data.flipped True if popper has been flipped by flip modifier
+ * @property {Boolean} data.hide True if the reference element is out of boundaries, useful to know when to hide the popper
+ * @property {HTMLElement} data.arrowElement Node used as arrow by arrow modifier
+ * @property {Object} data.styles Any CSS property defined here will be applied to the popper. It expects the JavaScript nomenclature (eg. `marginBottom`)
+ * @property {Object} data.arrowStyles Any CSS property defined here will be applied to the popper arrow. It expects the JavaScript nomenclature (eg. `marginBottom`)
+ * @property {Object} data.boundaries Offsets of the popper boundaries
+ * @property {Object} data.offsets The measurements of popper, reference and arrow elements
+ * @property {Object} data.offsets.popper `top`, `left`, `width`, `height` values
+ * @property {Object} data.offsets.reference `top`, `left`, `width`, `height` values
+ * @property {Object} data.offsets.arrow] `top` and `left` offsets, only one of them will be different from 0
+ */
+
+/**
+ * Default options provided to Popper.js constructor.<br />
+ * These can be overridden using the `options` argument of Popper.js.<br />
+ * To override an option, simply pass an object with the same
+ * structure of the `options` object, as the 3rd argument. For example:
+ * ```
+ * new Popper(ref, pop, {
+ *   modifiers: {
+ *     preventOverflow: { enabled: false }
+ *   }
+ * })
+ * ```
+ * @type {Object}
+ * @static
+ * @memberof Popper
+ */
+var Defaults = {
+  /**
+   * Popper's placement.
+   * @prop {Popper.placements} placement='bottom'
+   */
+  placement: 'bottom',
+
+  /**
+   * Set this to true if you want popper to position it self in 'fixed' mode
+   * @prop {Boolean} positionFixed=false
+   */
+  positionFixed: false,
+
+  /**
+   * Whether events (resize, scroll) are initially enabled.
+   * @prop {Boolean} eventsEnabled=true
+   */
+  eventsEnabled: true,
+
+  /**
+   * Set to true if you want to automatically remove the popper when
+   * you call the `destroy` method.
+   * @prop {Boolean} removeOnDestroy=false
+   */
+  removeOnDestroy: false,
+
+  /**
+   * Callback called when the popper is created.<br />
+   * By default, it is set to no-op.<br />
+   * Access Popper.js instance with `data.instance`.
+   * @prop {onCreate}
+   */
+  onCreate: function onCreate() {},
+
+  /**
+   * Callback called when the popper is updated. This callback is not called
+   * on the initialization/creation of the popper, but only on subsequent
+   * updates.<br />
+   * By default, it is set to no-op.<br />
+   * Access Popper.js instance with `data.instance`.
+   * @prop {onUpdate}
+   */
+  onUpdate: function onUpdate() {},
+
+  /**
+   * List of modifiers used to modify the offsets before they are applied to the popper.
+   * They provide most of the functionalities of Popper.js.
+   * @prop {modifiers}
+   */
+  modifiers: modifiers
+};
+
+/**
+ * @callback onCreate
+ * @param {dataObject} data
+ */
+
+/**
+ * @callback onUpdate
+ * @param {dataObject} data
+ */
+
+// Utils
+// Methods
+var Popper = function () {
+  /**
+   * Creates a new Popper.js instance.
+   * @class Popper
+   * @param {HTMLElement|referenceObject} reference - The reference element used to position the popper
+   * @param {HTMLElement} popper - The HTML element used as the popper
+   * @param {Object} options - Your custom options to override the ones defined in [Defaults](#defaults)
+   * @return {Object} instance - The generated Popper.js instance
+   */
+  function Popper(reference, popper) {
+    var _this = this;
+
+    var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
+    classCallCheck(this, Popper);
+
+    this.scheduleUpdate = function () {
+      return requestAnimationFrame(_this.update);
+    };
+
+    // make update() debounced, so that it only runs at most once-per-tick
+    this.update = debounce(this.update.bind(this));
+
+    // with {} we create a new object with the options inside it
+    this.options = _extends({}, Popper.Defaults, options);
+
+    // init state
+    this.state = {
+      isDestroyed: false,
+      isCreated: false,
+      scrollParents: []
+    };
+
+    // get reference and popper elements (allow jQuery wrappers)
+    this.reference = reference && reference.jquery ? reference[0] : reference;
+    this.popper = popper && popper.jquery ? popper[0] : popper;
+
+    // Deep merge modifiers options
+    this.options.modifiers = {};
+    Object.keys(_extends({}, Popper.Defaults.modifiers, options.modifiers)).forEach(function (name) {
+      _this.options.modifiers[name] = _extends({}, Popper.Defaults.modifiers[name] || {}, options.modifiers ? options.modifiers[name] : {});
+    });
+
+    // Refactoring modifiers' list (Object => Array)
+    this.modifiers = Object.keys(this.options.modifiers).map(function (name) {
+      return _extends({
+        name: name
+      }, _this.options.modifiers[name]);
+    })
+    // sort the modifiers by order
+    .sort(function (a, b) {
+      return a.order - b.order;
+    });
+
+    // modifiers have the ability to execute arbitrary code when Popper.js get inited
+    // such code is executed in the same order of its modifier
+    // they could add new properties to their options configuration
+    // BE AWARE: don't add options to `options.modifiers.name` but to `modifierOptions`!
+    this.modifiers.forEach(function (modifierOptions) {
+      if (modifierOptions.enabled && isFunction(modifierOptions.onLoad)) {
+        modifierOptions.onLoad(_this.reference, _this.popper, _this.options, modifierOptions, _this.state);
+      }
+    });
+
+    // fire the first update to position the popper in the right place
+    this.update();
+
+    var eventsEnabled = this.options.eventsEnabled;
+    if (eventsEnabled) {
+      // setup event listeners, they will take care of update the position in specific situations
+      this.enableEventListeners();
+    }
+
+    this.state.eventsEnabled = eventsEnabled;
+  }
+
+  // We can't use class properties because they don't get listed in the
+  // class prototype and break stuff like Sinon stubs
+
+
+  createClass(Popper, [{
+    key: 'update',
+    value: function update$$1() {
+      return update.call(this);
+    }
+  }, {
+    key: 'destroy',
+    value: function destroy$$1() {
+      return destroy.call(this);
+    }
+  }, {
+    key: 'enableEventListeners',
+    value: function enableEventListeners$$1() {
+      return enableEventListeners.call(this);
+    }
+  }, {
+    key: 'disableEventListeners',
+    value: function disableEventListeners$$1() {
+      return disableEventListeners.call(this);
+    }
+
+    /**
+     * Schedules an update. It will run on the next UI update available.
+     * @method scheduleUpdate
+     * @memberof Popper
+     */
+
+
+    /**
+     * Collection of utilities useful when writing custom modifiers.
+     * Starting from version 1.7, this method is available only if you
+     * include `popper-utils.js` before `popper.js`.
+     *
+     * **DEPRECATION**: This way to access PopperUtils is deprecated
+     * and will be removed in v2! Use the PopperUtils module directly instead.
+     * Due to the high instability of the methods contained in Utils, we can't
+     * guarantee them to follow semver. Use them at your own risk!
+     * @static
+     * @private
+     * @type {Object}
+     * @deprecated since version 1.8
+     * @member Utils
+     * @memberof Popper
+     */
+
+  }]);
+  return Popper;
+}();
+
+/**
+ * The `referenceObject` is an object that provides an interface compatible with Popper.js
+ * and lets you use it as replacement of a real DOM node.<br />
+ * You can use this method to position a popper relatively to a set of coordinates
+ * in case you don't have a DOM node to use as reference.
+ *
+ * ```
+ * new Popper(referenceObject, popperNode);
+ * ```
+ *
+ * NB: This feature isn't supported in Internet Explorer 10.
+ * @name referenceObject
+ * @property {Function} data.getBoundingClientRect
+ * A function that returns a set of coordinates compatible with the native `getBoundingClientRect` method.
+ * @property {number} data.clientWidth
+ * An ES6 getter that will return the width of the virtual reference element.
+ * @property {number} data.clientHeight
+ * An ES6 getter that will return the height of the virtual reference element.
+ */
+
+
+Popper.Utils = (typeof window !== 'undefined' ? window : global).PopperUtils;
+Popper.placements = placements;
+Popper.Defaults = Defaults;
+
+return Popper;
+
+})));
+/*!
+  * Bootstrap util.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery')) :
+  typeof define === 'function' && define.amd ? define(['jquery'], factory) :
+  (global = global || self, global.Util = factory(global.jQuery));
+}(this, function ($) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+
+  /**
+   * --------------------------------------------------------------------------
+   * Bootstrap (v4.3.1): util.js
+   * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+   * --------------------------------------------------------------------------
+   */
+  /**
+   * ------------------------------------------------------------------------
+   * Private TransitionEnd Helpers
+   * ------------------------------------------------------------------------
+   */
+
+  var TRANSITION_END = 'transitionend';
+  var MAX_UID = 1000000;
+  var MILLISECONDS_MULTIPLIER = 1000; // Shoutout AngusCroll (https://goo.gl/pxwQGp)
+
+  function toType(obj) {
+    return {}.toString.call(obj).match(/\s([a-z]+)/i)[1].toLowerCase();
+  }
+
+  function getSpecialTransitionEndEvent() {
+    return {
+      bindType: TRANSITION_END,
+      delegateType: TRANSITION_END,
+      handle: function handle(event) {
+        if ($(event.target).is(this)) {
+          return event.handleObj.handler.apply(this, arguments); // eslint-disable-line prefer-rest-params
+        }
+
+        return undefined; // eslint-disable-line no-undefined
+      }
+    };
+  }
+
+  function transitionEndEmulator(duration) {
+    var _this = this;
+
+    var called = false;
+    $(this).one(Util.TRANSITION_END, function () {
+      called = true;
+    });
+    setTimeout(function () {
+      if (!called) {
+        Util.triggerTransitionEnd(_this);
+      }
+    }, duration);
+    return this;
+  }
+
+  function setTransitionEndSupport() {
+    $.fn.emulateTransitionEnd = transitionEndEmulator;
+    $.event.special[Util.TRANSITION_END] = getSpecialTransitionEndEvent();
+  }
+  /**
+   * --------------------------------------------------------------------------
+   * Public Util Api
+   * --------------------------------------------------------------------------
+   */
+
+
+  var Util = {
+    TRANSITION_END: 'bsTransitionEnd',
+    getUID: function getUID(prefix) {
+      do {
+        // eslint-disable-next-line no-bitwise
+        prefix += ~~(Math.random() * MAX_UID); // "~~" acts like a faster Math.floor() here
+      } while (document.getElementById(prefix));
+
+      return prefix;
+    },
+    getSelectorFromElement: function getSelectorFromElement(element) {
+      var selector = element.getAttribute('data-target');
+
+      if (!selector || selector === '#') {
+        var hrefAttr = element.getAttribute('href');
+        selector = hrefAttr && hrefAttr !== '#' ? hrefAttr.trim() : '';
+      }
+
+      try {
+        return document.querySelector(selector) ? selector : null;
+      } catch (err) {
+        return null;
+      }
+    },
+    getTransitionDurationFromElement: function getTransitionDurationFromElement(element) {
+      if (!element) {
+        return 0;
+      } // Get transition-duration of the element
+
+
+      var transitionDuration = $(element).css('transition-duration');
+      var transitionDelay = $(element).css('transition-delay');
+      var floatTransitionDuration = parseFloat(transitionDuration);
+      var floatTransitionDelay = parseFloat(transitionDelay); // Return 0 if element or transition duration is not found
+
+      if (!floatTransitionDuration && !floatTransitionDelay) {
+        return 0;
+      } // If multiple durations are defined, take the first
+
+
+      transitionDuration = transitionDuration.split(',')[0];
+      transitionDelay = transitionDelay.split(',')[0];
+      return (parseFloat(transitionDuration) + parseFloat(transitionDelay)) * MILLISECONDS_MULTIPLIER;
+    },
+    reflow: function reflow(element) {
+      return element.offsetHeight;
+    },
+    triggerTransitionEnd: function triggerTransitionEnd(element) {
+      $(element).trigger(TRANSITION_END);
+    },
+    // TODO: Remove in v5
+    supportsTransitionEnd: function supportsTransitionEnd() {
+      return Boolean(TRANSITION_END);
+    },
+    isElement: function isElement(obj) {
+      return (obj[0] || obj).nodeType;
+    },
+    typeCheckConfig: function typeCheckConfig(componentName, config, configTypes) {
+      for (var property in configTypes) {
+        if (Object.prototype.hasOwnProperty.call(configTypes, property)) {
+          var expectedTypes = configTypes[property];
+          var value = config[property];
+          var valueType = value && Util.isElement(value) ? 'element' : toType(value);
+
+          if (!new RegExp(expectedTypes).test(valueType)) {
+            throw new Error(componentName.toUpperCase() + ": " + ("Option \"" + property + "\" provided type \"" + valueType + "\" ") + ("but expected type \"" + expectedTypes + "\"."));
+          }
+        }
+      }
+    },
+    findShadowRoot: function findShadowRoot(element) {
+      if (!document.documentElement.attachShadow) {
+        return null;
+      } // Can find the shadow root otherwise it'll return the document
+
+
+      if (typeof element.getRootNode === 'function') {
+        var root = element.getRootNode();
+        return root instanceof ShadowRoot ? root : null;
+      }
+
+      if (element instanceof ShadowRoot) {
+        return element;
+      } // when we don't find a shadow root
+
+
+      if (!element.parentNode) {
+        return null;
+      }
+
+      return Util.findShadowRoot(element.parentNode);
+    }
+  };
+  setTransitionEndSupport();
+
+  return Util;
+
+}));
+/*!
+  * Bootstrap alert.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Alert = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'alert';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.alert';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Selector = {
+    DISMISS: '[data-dismiss="alert"]'
+  };
+  var Event = {
+    CLOSE: "close" + EVENT_KEY,
+    CLOSED: "closed" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    ALERT: 'alert',
+    FADE: 'fade',
+    SHOW: 'show'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Alert =
+  /*#__PURE__*/
+  function () {
+    function Alert(element) {
+      this._element = element;
+    } // Getters
+
+
+    var _proto = Alert.prototype;
+
+    // Public
+    _proto.close = function close(element) {
+      var rootElement = this._element;
+
+      if (element) {
+        rootElement = this._getRootElement(element);
+      }
+
+      var customEvent = this._triggerCloseEvent(rootElement);
+
+      if (customEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      this._removeElement(rootElement);
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+    } // Private
+    ;
+
+    _proto._getRootElement = function _getRootElement(element) {
+      var selector = Util.getSelectorFromElement(element);
+      var parent = false;
+
+      if (selector) {
+        parent = document.querySelector(selector);
+      }
+
+      if (!parent) {
+        parent = $(element).closest("." + ClassName.ALERT)[0];
+      }
+
+      return parent;
+    };
+
+    _proto._triggerCloseEvent = function _triggerCloseEvent(element) {
+      var closeEvent = $.Event(Event.CLOSE);
+      $(element).trigger(closeEvent);
+      return closeEvent;
+    };
+
+    _proto._removeElement = function _removeElement(element) {
+      var _this = this;
+
+      $(element).removeClass(ClassName.SHOW);
+
+      if (!$(element).hasClass(ClassName.FADE)) {
+        this._destroyElement(element);
+
+        return;
+      }
+
+      var transitionDuration = Util.getTransitionDurationFromElement(element);
+      $(element).one(Util.TRANSITION_END, function (event) {
+        return _this._destroyElement(element, event);
+      }).emulateTransitionEnd(transitionDuration);
+    };
+
+    _proto._destroyElement = function _destroyElement(element) {
+      $(element).detach().trigger(Event.CLOSED).remove();
+    } // Static
+    ;
+
+    Alert._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $element = $(this);
+        var data = $element.data(DATA_KEY);
+
+        if (!data) {
+          data = new Alert(this);
+          $element.data(DATA_KEY, data);
+        }
+
+        if (config === 'close') {
+          data[config](this);
+        }
+      });
+    };
+
+    Alert._handleDismiss = function _handleDismiss(alertInstance) {
+      return function (event) {
+        if (event) {
+          event.preventDefault();
+        }
+
+        alertInstance.close(this);
+      };
+    };
+
+    _createClass(Alert, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }]);
+
+    return Alert;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DISMISS, Alert._handleDismiss(new Alert()));
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Alert._jQueryInterface;
+  $.fn[NAME].Constructor = Alert;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Alert._jQueryInterface;
+  };
+
+  return Alert;
+
+}));
+/*!
+  * Bootstrap button.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery')) :
+  typeof define === 'function' && define.amd ? define(['jquery'], factory) :
+  (global = global || self, global.Button = factory(global.jQuery));
+}(this, function ($) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'button';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.button';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ClassName = {
+    ACTIVE: 'active',
+    BUTTON: 'btn',
+    FOCUS: 'focus'
+  };
+  var Selector = {
+    DATA_TOGGLE_CARROT: '[data-toggle^="button"]',
+    DATA_TOGGLE: '[data-toggle="buttons"]',
+    INPUT: 'input:not([type="hidden"])',
+    ACTIVE: '.active',
+    BUTTON: '.btn'
+  };
+  var Event = {
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
+    FOCUS_BLUR_DATA_API: "focus" + EVENT_KEY + DATA_API_KEY + " " + ("blur" + EVENT_KEY + DATA_API_KEY)
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Button =
+  /*#__PURE__*/
+  function () {
+    function Button(element) {
+      this._element = element;
+    } // Getters
+
+
+    var _proto = Button.prototype;
+
+    // Public
+    _proto.toggle = function toggle() {
+      var triggerChangeEvent = true;
+      var addAriaPressed = true;
+      var rootElement = $(this._element).closest(Selector.DATA_TOGGLE)[0];
+
+      if (rootElement) {
+        var input = this._element.querySelector(Selector.INPUT);
+
+        if (input) {
+          if (input.type === 'radio') {
+            if (input.checked && this._element.classList.contains(ClassName.ACTIVE)) {
+              triggerChangeEvent = false;
+            } else {
+              var activeElement = rootElement.querySelector(Selector.ACTIVE);
+
+              if (activeElement) {
+                $(activeElement).removeClass(ClassName.ACTIVE);
+              }
+            }
+          }
+
+          if (triggerChangeEvent) {
+            if (input.hasAttribute('disabled') || rootElement.hasAttribute('disabled') || input.classList.contains('disabled') || rootElement.classList.contains('disabled')) {
+              return;
+            }
+
+            input.checked = !this._element.classList.contains(ClassName.ACTIVE);
+            $(input).trigger('change');
+          }
+
+          input.focus();
+          addAriaPressed = false;
+        }
+      }
+
+      if (addAriaPressed) {
+        this._element.setAttribute('aria-pressed', !this._element.classList.contains(ClassName.ACTIVE));
+      }
+
+      if (triggerChangeEvent) {
+        $(this._element).toggleClass(ClassName.ACTIVE);
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+    } // Static
+    ;
+
+    Button._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        if (!data) {
+          data = new Button(this);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (config === 'toggle') {
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Button, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }]);
+
+    return Button;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE_CARROT, function (event) {
+    event.preventDefault();
+    var button = event.target;
+
+    if (!$(button).hasClass(ClassName.BUTTON)) {
+      button = $(button).closest(Selector.BUTTON);
+    }
+
+    Button._jQueryInterface.call($(button), 'toggle');
+  }).on(Event.FOCUS_BLUR_DATA_API, Selector.DATA_TOGGLE_CARROT, function (event) {
+    var button = $(event.target).closest(Selector.BUTTON)[0];
+    $(button).toggleClass(ClassName.FOCUS, /^focus(in)?$/.test(event.type));
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Button._jQueryInterface;
+  $.fn[NAME].Constructor = Button;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Button._jQueryInterface;
+  };
+
+  return Button;
+
+}));
+/*!
+  * Bootstrap carousel.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Carousel = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'carousel';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.carousel';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ARROW_LEFT_KEYCODE = 37; // KeyboardEvent.which value for left arrow key
+
+  var ARROW_RIGHT_KEYCODE = 39; // KeyboardEvent.which value for right arrow key
+
+  var TOUCHEVENT_COMPAT_WAIT = 500; // Time for mouse compat events to fire after touch
+
+  var SWIPE_THRESHOLD = 40;
+  var Default = {
+    interval: 5000,
+    keyboard: true,
+    slide: false,
+    pause: 'hover',
+    wrap: true,
+    touch: true
+  };
+  var DefaultType = {
+    interval: '(number|boolean)',
+    keyboard: 'boolean',
+    slide: '(boolean|string)',
+    pause: '(string|boolean)',
+    wrap: 'boolean',
+    touch: 'boolean'
+  };
+  var Direction = {
+    NEXT: 'next',
+    PREV: 'prev',
+    LEFT: 'left',
+    RIGHT: 'right'
+  };
+  var Event = {
+    SLIDE: "slide" + EVENT_KEY,
+    SLID: "slid" + EVENT_KEY,
+    KEYDOWN: "keydown" + EVENT_KEY,
+    MOUSEENTER: "mouseenter" + EVENT_KEY,
+    MOUSELEAVE: "mouseleave" + EVENT_KEY,
+    TOUCHSTART: "touchstart" + EVENT_KEY,
+    TOUCHMOVE: "touchmove" + EVENT_KEY,
+    TOUCHEND: "touchend" + EVENT_KEY,
+    POINTERDOWN: "pointerdown" + EVENT_KEY,
+    POINTERUP: "pointerup" + EVENT_KEY,
+    DRAG_START: "dragstart" + EVENT_KEY,
+    LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    CAROUSEL: 'carousel',
+    ACTIVE: 'active',
+    SLIDE: 'slide',
+    RIGHT: 'carousel-item-right',
+    LEFT: 'carousel-item-left',
+    NEXT: 'carousel-item-next',
+    PREV: 'carousel-item-prev',
+    ITEM: 'carousel-item',
+    POINTER_EVENT: 'pointer-event'
+  };
+  var Selector = {
+    ACTIVE: '.active',
+    ACTIVE_ITEM: '.active.carousel-item',
+    ITEM: '.carousel-item',
+    ITEM_IMG: '.carousel-item img',
+    NEXT_PREV: '.carousel-item-next, .carousel-item-prev',
+    INDICATORS: '.carousel-indicators',
+    DATA_SLIDE: '[data-slide], [data-slide-to]',
+    DATA_RIDE: '[data-ride="carousel"]'
+  };
+  var PointerType = {
+    TOUCH: 'touch',
+    PEN: 'pen'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Carousel =
+  /*#__PURE__*/
+  function () {
+    function Carousel(element, config) {
+      this._items = null;
+      this._interval = null;
+      this._activeElement = null;
+      this._isPaused = false;
+      this._isSliding = false;
+      this.touchTimeout = null;
+      this.touchStartX = 0;
+      this.touchDeltaX = 0;
+      this._config = this._getConfig(config);
+      this._element = element;
+      this._indicatorsElement = this._element.querySelector(Selector.INDICATORS);
+      this._touchSupported = 'ontouchstart' in document.documentElement || navigator.maxTouchPoints > 0;
+      this._pointerEvent = Boolean(window.PointerEvent || window.MSPointerEvent);
+
+      this._addEventListeners();
+    } // Getters
+
+
+    var _proto = Carousel.prototype;
+
+    // Public
+    _proto.next = function next() {
+      if (!this._isSliding) {
+        this._slide(Direction.NEXT);
+      }
+    };
+
+    _proto.nextWhenVisible = function nextWhenVisible() {
+      // Don't call next when the page isn't visible
+      // or the carousel or its parent isn't visible
+      if (!document.hidden && $(this._element).is(':visible') && $(this._element).css('visibility') !== 'hidden') {
+        this.next();
+      }
+    };
+
+    _proto.prev = function prev() {
+      if (!this._isSliding) {
+        this._slide(Direction.PREV);
+      }
+    };
+
+    _proto.pause = function pause(event) {
+      if (!event) {
+        this._isPaused = true;
+      }
+
+      if (this._element.querySelector(Selector.NEXT_PREV)) {
+        Util.triggerTransitionEnd(this._element);
+        this.cycle(true);
+      }
+
+      clearInterval(this._interval);
+      this._interval = null;
+    };
+
+    _proto.cycle = function cycle(event) {
+      if (!event) {
+        this._isPaused = false;
+      }
+
+      if (this._interval) {
+        clearInterval(this._interval);
+        this._interval = null;
+      }
+
+      if (this._config.interval && !this._isPaused) {
+        this._interval = setInterval((document.visibilityState ? this.nextWhenVisible : this.next).bind(this), this._config.interval);
+      }
+    };
+
+    _proto.to = function to(index) {
+      var _this = this;
+
+      this._activeElement = this._element.querySelector(Selector.ACTIVE_ITEM);
+
+      var activeIndex = this._getItemIndex(this._activeElement);
+
+      if (index > this._items.length - 1 || index < 0) {
+        return;
+      }
+
+      if (this._isSliding) {
+        $(this._element).one(Event.SLID, function () {
+          return _this.to(index);
+        });
+        return;
+      }
+
+      if (activeIndex === index) {
+        this.pause();
+        this.cycle();
+        return;
+      }
+
+      var direction = index > activeIndex ? Direction.NEXT : Direction.PREV;
+
+      this._slide(direction, this._items[index]);
+    };
+
+    _proto.dispose = function dispose() {
+      $(this._element).off(EVENT_KEY);
+      $.removeData(this._element, DATA_KEY);
+      this._items = null;
+      this._config = null;
+      this._element = null;
+      this._interval = null;
+      this._isPaused = null;
+      this._isSliding = null;
+      this._activeElement = null;
+      this._indicatorsElement = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, config);
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._handleSwipe = function _handleSwipe() {
+      var absDeltax = Math.abs(this.touchDeltaX);
+
+      if (absDeltax <= SWIPE_THRESHOLD) {
+        return;
+      }
+
+      var direction = absDeltax / this.touchDeltaX; // swipe left
+
+      if (direction > 0) {
+        this.prev();
+      } // swipe right
+
+
+      if (direction < 0) {
+        this.next();
+      }
+    };
+
+    _proto._addEventListeners = function _addEventListeners() {
+      var _this2 = this;
+
+      if (this._config.keyboard) {
+        $(this._element).on(Event.KEYDOWN, function (event) {
+          return _this2._keydown(event);
+        });
+      }
+
+      if (this._config.pause === 'hover') {
+        $(this._element).on(Event.MOUSEENTER, function (event) {
+          return _this2.pause(event);
+        }).on(Event.MOUSELEAVE, function (event) {
+          return _this2.cycle(event);
+        });
+      }
+
+      if (this._config.touch) {
+        this._addTouchEventListeners();
+      }
+    };
+
+    _proto._addTouchEventListeners = function _addTouchEventListeners() {
+      var _this3 = this;
+
+      if (!this._touchSupported) {
+        return;
+      }
+
+      var start = function start(event) {
+        if (_this3._pointerEvent && PointerType[event.originalEvent.pointerType.toUpperCase()]) {
+          _this3.touchStartX = event.originalEvent.clientX;
+        } else if (!_this3._pointerEvent) {
+          _this3.touchStartX = event.originalEvent.touches[0].clientX;
+        }
+      };
+
+      var move = function move(event) {
+        // ensure swiping with one touch and not pinching
+        if (event.originalEvent.touches && event.originalEvent.touches.length > 1) {
+          _this3.touchDeltaX = 0;
+        } else {
+          _this3.touchDeltaX = event.originalEvent.touches[0].clientX - _this3.touchStartX;
+        }
+      };
+
+      var end = function end(event) {
+        if (_this3._pointerEvent && PointerType[event.originalEvent.pointerType.toUpperCase()]) {
+          _this3.touchDeltaX = event.originalEvent.clientX - _this3.touchStartX;
+        }
+
+        _this3._handleSwipe();
+
+        if (_this3._config.pause === 'hover') {
+          // If it's a touch-enabled device, mouseenter/leave are fired as
+          // part of the mouse compatibility events on first tap - the carousel
+          // would stop cycling until user tapped out of it;
+          // here, we listen for touchend, explicitly pause the carousel
+          // (as if it's the second time we tap on it, mouseenter compat event
+          // is NOT fired) and after a timeout (to allow for mouse compatibility
+          // events to fire) we explicitly restart cycling
+          _this3.pause();
+
+          if (_this3.touchTimeout) {
+            clearTimeout(_this3.touchTimeout);
+          }
+
+          _this3.touchTimeout = setTimeout(function (event) {
+            return _this3.cycle(event);
+          }, TOUCHEVENT_COMPAT_WAIT + _this3._config.interval);
+        }
+      };
+
+      $(this._element.querySelectorAll(Selector.ITEM_IMG)).on(Event.DRAG_START, function (e) {
+        return e.preventDefault();
+      });
+
+      if (this._pointerEvent) {
+        $(this._element).on(Event.POINTERDOWN, function (event) {
+          return start(event);
+        });
+        $(this._element).on(Event.POINTERUP, function (event) {
+          return end(event);
+        });
+
+        this._element.classList.add(ClassName.POINTER_EVENT);
+      } else {
+        $(this._element).on(Event.TOUCHSTART, function (event) {
+          return start(event);
+        });
+        $(this._element).on(Event.TOUCHMOVE, function (event) {
+          return move(event);
+        });
+        $(this._element).on(Event.TOUCHEND, function (event) {
+          return end(event);
+        });
+      }
+    };
+
+    _proto._keydown = function _keydown(event) {
+      if (/input|textarea/i.test(event.target.tagName)) {
+        return;
+      }
+
+      switch (event.which) {
+        case ARROW_LEFT_KEYCODE:
+          event.preventDefault();
+          this.prev();
+          break;
+
+        case ARROW_RIGHT_KEYCODE:
+          event.preventDefault();
+          this.next();
+          break;
+
+        default:
+      }
+    };
+
+    _proto._getItemIndex = function _getItemIndex(element) {
+      this._items = element && element.parentNode ? [].slice.call(element.parentNode.querySelectorAll(Selector.ITEM)) : [];
+      return this._items.indexOf(element);
+    };
+
+    _proto._getItemByDirection = function _getItemByDirection(direction, activeElement) {
+      var isNextDirection = direction === Direction.NEXT;
+      var isPrevDirection = direction === Direction.PREV;
+
+      var activeIndex = this._getItemIndex(activeElement);
+
+      var lastItemIndex = this._items.length - 1;
+      var isGoingToWrap = isPrevDirection && activeIndex === 0 || isNextDirection && activeIndex === lastItemIndex;
+
+      if (isGoingToWrap && !this._config.wrap) {
+        return activeElement;
+      }
+
+      var delta = direction === Direction.PREV ? -1 : 1;
+      var itemIndex = (activeIndex + delta) % this._items.length;
+      return itemIndex === -1 ? this._items[this._items.length - 1] : this._items[itemIndex];
+    };
+
+    _proto._triggerSlideEvent = function _triggerSlideEvent(relatedTarget, eventDirectionName) {
+      var targetIndex = this._getItemIndex(relatedTarget);
+
+      var fromIndex = this._getItemIndex(this._element.querySelector(Selector.ACTIVE_ITEM));
+
+      var slideEvent = $.Event(Event.SLIDE, {
+        relatedTarget: relatedTarget,
+        direction: eventDirectionName,
+        from: fromIndex,
+        to: targetIndex
+      });
+      $(this._element).trigger(slideEvent);
+      return slideEvent;
+    };
+
+    _proto._setActiveIndicatorElement = function _setActiveIndicatorElement(element) {
+      if (this._indicatorsElement) {
+        var indicators = [].slice.call(this._indicatorsElement.querySelectorAll(Selector.ACTIVE));
+        $(indicators).removeClass(ClassName.ACTIVE);
+
+        var nextIndicator = this._indicatorsElement.children[this._getItemIndex(element)];
+
+        if (nextIndicator) {
+          $(nextIndicator).addClass(ClassName.ACTIVE);
+        }
+      }
+    };
+
+    _proto._slide = function _slide(direction, element) {
+      var _this4 = this;
+
+      var activeElement = this._element.querySelector(Selector.ACTIVE_ITEM);
+
+      var activeElementIndex = this._getItemIndex(activeElement);
+
+      var nextElement = element || activeElement && this._getItemByDirection(direction, activeElement);
+
+      var nextElementIndex = this._getItemIndex(nextElement);
+
+      var isCycling = Boolean(this._interval);
+      var directionalClassName;
+      var orderClassName;
+      var eventDirectionName;
+
+      if (direction === Direction.NEXT) {
+        directionalClassName = ClassName.LEFT;
+        orderClassName = ClassName.NEXT;
+        eventDirectionName = Direction.LEFT;
+      } else {
+        directionalClassName = ClassName.RIGHT;
+        orderClassName = ClassName.PREV;
+        eventDirectionName = Direction.RIGHT;
+      }
+
+      if (nextElement && $(nextElement).hasClass(ClassName.ACTIVE)) {
+        this._isSliding = false;
+        return;
+      }
+
+      var slideEvent = this._triggerSlideEvent(nextElement, eventDirectionName);
+
+      if (slideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      if (!activeElement || !nextElement) {
+        // Some weirdness is happening, so we bail
+        return;
+      }
+
+      this._isSliding = true;
+
+      if (isCycling) {
+        this.pause();
+      }
+
+      this._setActiveIndicatorElement(nextElement);
+
+      var slidEvent = $.Event(Event.SLID, {
+        relatedTarget: nextElement,
+        direction: eventDirectionName,
+        from: activeElementIndex,
+        to: nextElementIndex
+      });
+
+      if ($(this._element).hasClass(ClassName.SLIDE)) {
+        $(nextElement).addClass(orderClassName);
+        Util.reflow(nextElement);
+        $(activeElement).addClass(directionalClassName);
+        $(nextElement).addClass(directionalClassName);
+        var nextElementInterval = parseInt(nextElement.getAttribute('data-interval'), 10);
+
+        if (nextElementInterval) {
+          this._config.defaultInterval = this._config.defaultInterval || this._config.interval;
+          this._config.interval = nextElementInterval;
+        } else {
+          this._config.interval = this._config.defaultInterval || this._config.interval;
+        }
+
+        var transitionDuration = Util.getTransitionDurationFromElement(activeElement);
+        $(activeElement).one(Util.TRANSITION_END, function () {
+          $(nextElement).removeClass(directionalClassName + " " + orderClassName).addClass(ClassName.ACTIVE);
+          $(activeElement).removeClass(ClassName.ACTIVE + " " + orderClassName + " " + directionalClassName);
+          _this4._isSliding = false;
+          setTimeout(function () {
+            return $(_this4._element).trigger(slidEvent);
+          }, 0);
+        }).emulateTransitionEnd(transitionDuration);
+      } else {
+        $(activeElement).removeClass(ClassName.ACTIVE);
+        $(nextElement).addClass(ClassName.ACTIVE);
+        this._isSliding = false;
+        $(this._element).trigger(slidEvent);
+      }
+
+      if (isCycling) {
+        this.cycle();
+      }
+    } // Static
+    ;
+
+    Carousel._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = _objectSpread({}, Default, $(this).data());
+
+        if (typeof config === 'object') {
+          _config = _objectSpread({}, _config, config);
+        }
+
+        var action = typeof config === 'string' ? config : _config.slide;
+
+        if (!data) {
+          data = new Carousel(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'number') {
+          data.to(config);
+        } else if (typeof action === 'string') {
+          if (typeof data[action] === 'undefined') {
+            throw new TypeError("No method named \"" + action + "\"");
+          }
+
+          data[action]();
+        } else if (_config.interval && _config.ride) {
+          data.pause();
+          data.cycle();
+        }
+      });
+    };
+
+    Carousel._dataApiClickHandler = function _dataApiClickHandler(event) {
+      var selector = Util.getSelectorFromElement(this);
+
+      if (!selector) {
+        return;
+      }
+
+      var target = $(selector)[0];
+
+      if (!target || !$(target).hasClass(ClassName.CAROUSEL)) {
+        return;
+      }
+
+      var config = _objectSpread({}, $(target).data(), $(this).data());
+
+      var slideIndex = this.getAttribute('data-slide-to');
+
+      if (slideIndex) {
+        config.interval = false;
+      }
+
+      Carousel._jQueryInterface.call($(target), config);
+
+      if (slideIndex) {
+        $(target).data(DATA_KEY).to(slideIndex);
+      }
+
+      event.preventDefault();
+    };
+
+    _createClass(Carousel, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Carousel;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_SLIDE, Carousel._dataApiClickHandler);
+  $(window).on(Event.LOAD_DATA_API, function () {
+    var carousels = [].slice.call(document.querySelectorAll(Selector.DATA_RIDE));
+
+    for (var i = 0, len = carousels.length; i < len; i++) {
+      var $carousel = $(carousels[i]);
+
+      Carousel._jQueryInterface.call($carousel, $carousel.data());
+    }
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Carousel._jQueryInterface;
+  $.fn[NAME].Constructor = Carousel;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Carousel._jQueryInterface;
+  };
+
+  return Carousel;
+
+}));
+/*!
+  * Bootstrap collapse.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Collapse = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'collapse';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.collapse';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Default = {
+    toggle: true,
+    parent: ''
+  };
+  var DefaultType = {
+    toggle: 'boolean',
+    parent: '(string|element)'
+  };
+  var Event = {
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    SHOW: 'show',
+    COLLAPSE: 'collapse',
+    COLLAPSING: 'collapsing',
+    COLLAPSED: 'collapsed'
+  };
+  var Dimension = {
+    WIDTH: 'width',
+    HEIGHT: 'height'
+  };
+  var Selector = {
+    ACTIVES: '.show, .collapsing',
+    DATA_TOGGLE: '[data-toggle="collapse"]'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Collapse =
+  /*#__PURE__*/
+  function () {
+    function Collapse(element, config) {
+      this._isTransitioning = false;
+      this._element = element;
+      this._config = this._getConfig(config);
+      this._triggerArray = [].slice.call(document.querySelectorAll("[data-toggle=\"collapse\"][href=\"#" + element.id + "\"]," + ("[data-toggle=\"collapse\"][data-target=\"#" + element.id + "\"]")));
+      var toggleList = [].slice.call(document.querySelectorAll(Selector.DATA_TOGGLE));
+
+      for (var i = 0, len = toggleList.length; i < len; i++) {
+        var elem = toggleList[i];
+        var selector = Util.getSelectorFromElement(elem);
+        var filterElement = [].slice.call(document.querySelectorAll(selector)).filter(function (foundElem) {
+          return foundElem === element;
+        });
+
+        if (selector !== null && filterElement.length > 0) {
+          this._selector = selector;
+
+          this._triggerArray.push(elem);
+        }
+      }
+
+      this._parent = this._config.parent ? this._getParent() : null;
+
+      if (!this._config.parent) {
+        this._addAriaAndCollapsedClass(this._element, this._triggerArray);
+      }
+
+      if (this._config.toggle) {
+        this.toggle();
+      }
+    } // Getters
+
+
+    var _proto = Collapse.prototype;
+
+    // Public
+    _proto.toggle = function toggle() {
+      if ($(this._element).hasClass(ClassName.SHOW)) {
+        this.hide();
+      } else {
+        this.show();
+      }
+    };
+
+    _proto.show = function show() {
+      var _this = this;
+
+      if (this._isTransitioning || $(this._element).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var actives;
+      var activesData;
+
+      if (this._parent) {
+        actives = [].slice.call(this._parent.querySelectorAll(Selector.ACTIVES)).filter(function (elem) {
+          if (typeof _this._config.parent === 'string') {
+            return elem.getAttribute('data-parent') === _this._config.parent;
+          }
+
+          return elem.classList.contains(ClassName.COLLAPSE);
+        });
+
+        if (actives.length === 0) {
+          actives = null;
+        }
+      }
+
+      if (actives) {
+        activesData = $(actives).not(this._selector).data(DATA_KEY);
+
+        if (activesData && activesData._isTransitioning) {
+          return;
+        }
+      }
+
+      var startEvent = $.Event(Event.SHOW);
+      $(this._element).trigger(startEvent);
+
+      if (startEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      if (actives) {
+        Collapse._jQueryInterface.call($(actives).not(this._selector), 'hide');
+
+        if (!activesData) {
+          $(actives).data(DATA_KEY, null);
+        }
+      }
+
+      var dimension = this._getDimension();
+
+      $(this._element).removeClass(ClassName.COLLAPSE).addClass(ClassName.COLLAPSING);
+      this._element.style[dimension] = 0;
+
+      if (this._triggerArray.length) {
+        $(this._triggerArray).removeClass(ClassName.COLLAPSED).attr('aria-expanded', true);
+      }
+
+      this.setTransitioning(true);
+
+      var complete = function complete() {
+        $(_this._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).addClass(ClassName.SHOW);
+        _this._element.style[dimension] = '';
+
+        _this.setTransitioning(false);
+
+        $(_this._element).trigger(Event.SHOWN);
+      };
+
+      var capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);
+      var scrollSize = "scroll" + capitalizedDimension;
+      var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+      $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      this._element.style[dimension] = this._element[scrollSize] + "px";
+    };
+
+    _proto.hide = function hide() {
+      var _this2 = this;
+
+      if (this._isTransitioning || !$(this._element).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var startEvent = $.Event(Event.HIDE);
+      $(this._element).trigger(startEvent);
+
+      if (startEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      var dimension = this._getDimension();
+
+      this._element.style[dimension] = this._element.getBoundingClientRect()[dimension] + "px";
+      Util.reflow(this._element);
+      $(this._element).addClass(ClassName.COLLAPSING).removeClass(ClassName.COLLAPSE).removeClass(ClassName.SHOW);
+      var triggerArrayLength = this._triggerArray.length;
+
+      if (triggerArrayLength > 0) {
+        for (var i = 0; i < triggerArrayLength; i++) {
+          var trigger = this._triggerArray[i];
+          var selector = Util.getSelectorFromElement(trigger);
+
+          if (selector !== null) {
+            var $elem = $([].slice.call(document.querySelectorAll(selector)));
+
+            if (!$elem.hasClass(ClassName.SHOW)) {
+              $(trigger).addClass(ClassName.COLLAPSED).attr('aria-expanded', false);
+            }
+          }
+        }
+      }
+
+      this.setTransitioning(true);
+
+      var complete = function complete() {
+        _this2.setTransitioning(false);
+
+        $(_this2._element).removeClass(ClassName.COLLAPSING).addClass(ClassName.COLLAPSE).trigger(Event.HIDDEN);
+      };
+
+      this._element.style[dimension] = '';
+      var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+      $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+    };
+
+    _proto.setTransitioning = function setTransitioning(isTransitioning) {
+      this._isTransitioning = isTransitioning;
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._config = null;
+      this._parent = null;
+      this._element = null;
+      this._triggerArray = null;
+      this._isTransitioning = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, config);
+      config.toggle = Boolean(config.toggle); // Coerce string values
+
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._getDimension = function _getDimension() {
+      var hasWidth = $(this._element).hasClass(Dimension.WIDTH);
+      return hasWidth ? Dimension.WIDTH : Dimension.HEIGHT;
+    };
+
+    _proto._getParent = function _getParent() {
+      var _this3 = this;
+
+      var parent;
+
+      if (Util.isElement(this._config.parent)) {
+        parent = this._config.parent; // It's a jQuery object
+
+        if (typeof this._config.parent.jquery !== 'undefined') {
+          parent = this._config.parent[0];
+        }
+      } else {
+        parent = document.querySelector(this._config.parent);
+      }
+
+      var selector = "[data-toggle=\"collapse\"][data-parent=\"" + this._config.parent + "\"]";
+      var children = [].slice.call(parent.querySelectorAll(selector));
+      $(children).each(function (i, element) {
+        _this3._addAriaAndCollapsedClass(Collapse._getTargetFromElement(element), [element]);
+      });
+      return parent;
+    };
+
+    _proto._addAriaAndCollapsedClass = function _addAriaAndCollapsedClass(element, triggerArray) {
+      var isOpen = $(element).hasClass(ClassName.SHOW);
+
+      if (triggerArray.length) {
+        $(triggerArray).toggleClass(ClassName.COLLAPSED, !isOpen).attr('aria-expanded', isOpen);
+      }
+    } // Static
+    ;
+
+    Collapse._getTargetFromElement = function _getTargetFromElement(element) {
+      var selector = Util.getSelectorFromElement(element);
+      return selector ? document.querySelector(selector) : null;
+    };
+
+    Collapse._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $this = $(this);
+        var data = $this.data(DATA_KEY);
+
+        var _config = _objectSpread({}, Default, $this.data(), typeof config === 'object' && config ? config : {});
+
+        if (!data && _config.toggle && /show|hide/.test(config)) {
+          _config.toggle = false;
+        }
+
+        if (!data) {
+          data = new Collapse(this, _config);
+          $this.data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Collapse, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Collapse;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    // preventDefault only for <a> elements (which change the URL) not inside the collapsible element
+    if (event.currentTarget.tagName === 'A') {
+      event.preventDefault();
+    }
+
+    var $trigger = $(this);
+    var selector = Util.getSelectorFromElement(this);
+    var selectors = [].slice.call(document.querySelectorAll(selector));
+    $(selectors).each(function () {
+      var $target = $(this);
+      var data = $target.data(DATA_KEY);
+      var config = data ? 'toggle' : $trigger.data();
+
+      Collapse._jQueryInterface.call($target, config);
+    });
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Collapse._jQueryInterface;
+  $.fn[NAME].Constructor = Collapse;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Collapse._jQueryInterface;
+  };
+
+  return Collapse;
+
+}));
+/*!
+  * Bootstrap dropdown.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('popper.js'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', 'popper.js', './util.js'], factory) :
+  (global = global || self, global.Dropdown = factory(global.jQuery, global.Popper, global.Util));
+}(this, function ($, Popper, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Popper = Popper && Popper.hasOwnProperty('default') ? Popper['default'] : Popper;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'dropdown';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.dropdown';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
+
+  var SPACE_KEYCODE = 32; // KeyboardEvent.which value for space key
+
+  var TAB_KEYCODE = 9; // KeyboardEvent.which value for tab key
+
+  var ARROW_UP_KEYCODE = 38; // KeyboardEvent.which value for up arrow key
+
+  var ARROW_DOWN_KEYCODE = 40; // KeyboardEvent.which value for down arrow key
+
+  var RIGHT_MOUSE_BUTTON_WHICH = 3; // MouseEvent.which value for the right button (assuming a right-handed mouse)
+
+  var REGEXP_KEYDOWN = new RegExp(ARROW_UP_KEYCODE + "|" + ARROW_DOWN_KEYCODE + "|" + ESCAPE_KEYCODE);
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    CLICK: "click" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY,
+    KEYDOWN_DATA_API: "keydown" + EVENT_KEY + DATA_API_KEY,
+    KEYUP_DATA_API: "keyup" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    DISABLED: 'disabled',
+    SHOW: 'show',
+    DROPUP: 'dropup',
+    DROPRIGHT: 'dropright',
+    DROPLEFT: 'dropleft',
+    MENURIGHT: 'dropdown-menu-right',
+    MENULEFT: 'dropdown-menu-left',
+    POSITION_STATIC: 'position-static'
+  };
+  var Selector = {
+    DATA_TOGGLE: '[data-toggle="dropdown"]',
+    FORM_CHILD: '.dropdown form',
+    MENU: '.dropdown-menu',
+    NAVBAR_NAV: '.navbar-nav',
+    VISIBLE_ITEMS: '.dropdown-menu .dropdown-item:not(.disabled):not(:disabled)'
+  };
+  var AttachmentMap = {
+    TOP: 'top-start',
+    TOPEND: 'top-end',
+    BOTTOM: 'bottom-start',
+    BOTTOMEND: 'bottom-end',
+    RIGHT: 'right-start',
+    RIGHTEND: 'right-end',
+    LEFT: 'left-start',
+    LEFTEND: 'left-end'
+  };
+  var Default = {
+    offset: 0,
+    flip: true,
+    boundary: 'scrollParent',
+    reference: 'toggle',
+    display: 'dynamic'
+  };
+  var DefaultType = {
+    offset: '(number|string|function)',
+    flip: 'boolean',
+    boundary: '(string|element)',
+    reference: '(string|element)',
+    display: 'string'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Dropdown =
+  /*#__PURE__*/
+  function () {
+    function Dropdown(element, config) {
+      this._element = element;
+      this._popper = null;
+      this._config = this._getConfig(config);
+      this._menu = this._getMenuElement();
+      this._inNavbar = this._detectNavbar();
+
+      this._addEventListeners();
+    } // Getters
+
+
+    var _proto = Dropdown.prototype;
+
+    // Public
+    _proto.toggle = function toggle() {
+      if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED)) {
+        return;
+      }
+
+      var parent = Dropdown._getParentFromElement(this._element);
+
+      var isActive = $(this._menu).hasClass(ClassName.SHOW);
+
+      Dropdown._clearMenus();
+
+      if (isActive) {
+        return;
+      }
+
+      var relatedTarget = {
+        relatedTarget: this._element
+      };
+      var showEvent = $.Event(Event.SHOW, relatedTarget);
+      $(parent).trigger(showEvent);
+
+      if (showEvent.isDefaultPrevented()) {
+        return;
+      } // Disable totally Popper.js for Dropdown in Navbar
+
+
+      if (!this._inNavbar) {
+        /**
+         * Check for Popper dependency
+         * Popper - https://popper.js.org
+         */
+        if (typeof Popper === 'undefined') {
+          throw new TypeError('Bootstrap\'s dropdowns require Popper.js (https://popper.js.org/)');
+        }
+
+        var referenceElement = this._element;
+
+        if (this._config.reference === 'parent') {
+          referenceElement = parent;
+        } else if (Util.isElement(this._config.reference)) {
+          referenceElement = this._config.reference; // Check if it's jQuery element
+
+          if (typeof this._config.reference.jquery !== 'undefined') {
+            referenceElement = this._config.reference[0];
+          }
+        } // If boundary is not `scrollParent`, then set position to `static`
+        // to allow the menu to "escape" the scroll parent's boundaries
+        // https://github.com/twbs/bootstrap/issues/24251
+
+
+        if (this._config.boundary !== 'scrollParent') {
+          $(parent).addClass(ClassName.POSITION_STATIC);
+        }
+
+        this._popper = new Popper(referenceElement, this._menu, this._getPopperConfig());
+      } // If this is a touch-enabled device we add extra
+      // empty mouseover listeners to the body's immediate children;
+      // only needed because of broken event delegation on iOS
+      // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
+
+
+      if ('ontouchstart' in document.documentElement && $(parent).closest(Selector.NAVBAR_NAV).length === 0) {
+        $(document.body).children().on('mouseover', null, $.noop);
+      }
+
+      this._element.focus();
+
+      this._element.setAttribute('aria-expanded', true);
+
+      $(this._menu).toggleClass(ClassName.SHOW);
+      $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
+    };
+
+    _proto.show = function show() {
+      if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || $(this._menu).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var relatedTarget = {
+        relatedTarget: this._element
+      };
+      var showEvent = $.Event(Event.SHOW, relatedTarget);
+
+      var parent = Dropdown._getParentFromElement(this._element);
+
+      $(parent).trigger(showEvent);
+
+      if (showEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      $(this._menu).toggleClass(ClassName.SHOW);
+      $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.SHOWN, relatedTarget));
+    };
+
+    _proto.hide = function hide() {
+      if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || !$(this._menu).hasClass(ClassName.SHOW)) {
+        return;
+      }
+
+      var relatedTarget = {
+        relatedTarget: this._element
+      };
+      var hideEvent = $.Event(Event.HIDE, relatedTarget);
+
+      var parent = Dropdown._getParentFromElement(this._element);
+
+      $(parent).trigger(hideEvent);
+
+      if (hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      $(this._menu).toggleClass(ClassName.SHOW);
+      $(parent).toggleClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      $(this._element).off(EVENT_KEY);
+      this._element = null;
+      this._menu = null;
+
+      if (this._popper !== null) {
+        this._popper.destroy();
+
+        this._popper = null;
+      }
+    };
+
+    _proto.update = function update() {
+      this._inNavbar = this._detectNavbar();
+
+      if (this._popper !== null) {
+        this._popper.scheduleUpdate();
+      }
+    } // Private
+    ;
+
+    _proto._addEventListeners = function _addEventListeners() {
+      var _this = this;
+
+      $(this._element).on(Event.CLICK, function (event) {
+        event.preventDefault();
+        event.stopPropagation();
+
+        _this.toggle();
+      });
+    };
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, this.constructor.Default, $(this._element).data(), config);
+      Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+      return config;
+    };
+
+    _proto._getMenuElement = function _getMenuElement() {
+      if (!this._menu) {
+        var parent = Dropdown._getParentFromElement(this._element);
+
+        if (parent) {
+          this._menu = parent.querySelector(Selector.MENU);
+        }
+      }
+
+      return this._menu;
+    };
+
+    _proto._getPlacement = function _getPlacement() {
+      var $parentDropdown = $(this._element.parentNode);
+      var placement = AttachmentMap.BOTTOM; // Handle dropup
+
+      if ($parentDropdown.hasClass(ClassName.DROPUP)) {
+        placement = AttachmentMap.TOP;
+
+        if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
+          placement = AttachmentMap.TOPEND;
+        }
+      } else if ($parentDropdown.hasClass(ClassName.DROPRIGHT)) {
+        placement = AttachmentMap.RIGHT;
+      } else if ($parentDropdown.hasClass(ClassName.DROPLEFT)) {
+        placement = AttachmentMap.LEFT;
+      } else if ($(this._menu).hasClass(ClassName.MENURIGHT)) {
+        placement = AttachmentMap.BOTTOMEND;
+      }
+
+      return placement;
+    };
+
+    _proto._detectNavbar = function _detectNavbar() {
+      return $(this._element).closest('.navbar').length > 0;
+    };
+
+    _proto._getOffset = function _getOffset() {
+      var _this2 = this;
+
+      var offset = {};
+
+      if (typeof this._config.offset === 'function') {
+        offset.fn = function (data) {
+          data.offsets = _objectSpread({}, data.offsets, _this2._config.offset(data.offsets, _this2._element) || {});
+          return data;
+        };
+      } else {
+        offset.offset = this._config.offset;
+      }
+
+      return offset;
+    };
+
+    _proto._getPopperConfig = function _getPopperConfig() {
+      var popperConfig = {
+        placement: this._getPlacement(),
+        modifiers: {
+          offset: this._getOffset(),
+          flip: {
+            enabled: this._config.flip
+          },
+          preventOverflow: {
+            boundariesElement: this._config.boundary
+          }
+        } // Disable Popper.js if we have a static display
+
+      };
+
+      if (this._config.display === 'static') {
+        popperConfig.modifiers.applyStyle = {
+          enabled: false
+        };
+      }
+
+      return popperConfig;
+    } // Static
+    ;
+
+    Dropdown._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' ? config : null;
+
+        if (!data) {
+          data = new Dropdown(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    Dropdown._clearMenus = function _clearMenus(event) {
+      if (event && (event.which === RIGHT_MOUSE_BUTTON_WHICH || event.type === 'keyup' && event.which !== TAB_KEYCODE)) {
+        return;
+      }
+
+      var toggles = [].slice.call(document.querySelectorAll(Selector.DATA_TOGGLE));
+
+      for (var i = 0, len = toggles.length; i < len; i++) {
+        var parent = Dropdown._getParentFromElement(toggles[i]);
+
+        var context = $(toggles[i]).data(DATA_KEY);
+        var relatedTarget = {
+          relatedTarget: toggles[i]
+        };
+
+        if (event && event.type === 'click') {
+          relatedTarget.clickEvent = event;
+        }
+
+        if (!context) {
+          continue;
+        }
+
+        var dropdownMenu = context._menu;
+
+        if (!$(parent).hasClass(ClassName.SHOW)) {
+          continue;
+        }
+
+        if (event && (event.type === 'click' && /input|textarea/i.test(event.target.tagName) || event.type === 'keyup' && event.which === TAB_KEYCODE) && $.contains(parent, event.target)) {
+          continue;
+        }
+
+        var hideEvent = $.Event(Event.HIDE, relatedTarget);
+        $(parent).trigger(hideEvent);
+
+        if (hideEvent.isDefaultPrevented()) {
+          continue;
+        } // If this is a touch-enabled device we remove the extra
+        // empty mouseover listeners we added for iOS support
+
+
+        if ('ontouchstart' in document.documentElement) {
+          $(document.body).children().off('mouseover', null, $.noop);
+        }
+
+        toggles[i].setAttribute('aria-expanded', 'false');
+        $(dropdownMenu).removeClass(ClassName.SHOW);
+        $(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));
+      }
+    };
+
+    Dropdown._getParentFromElement = function _getParentFromElement(element) {
+      var parent;
+      var selector = Util.getSelectorFromElement(element);
+
+      if (selector) {
+        parent = document.querySelector(selector);
+      }
+
+      return parent || element.parentNode;
+    } // eslint-disable-next-line complexity
+    ;
+
+    Dropdown._dataApiKeydownHandler = function _dataApiKeydownHandler(event) {
+      // If not input/textarea:
+      //  - And not a key in REGEXP_KEYDOWN => not a dropdown command
+      // If input/textarea:
+      //  - If space key => not a dropdown command
+      //  - If key is other than escape
+      //    - If key is not up or down => not a dropdown command
+      //    - If trigger inside the menu => not a dropdown command
+      if (/input|textarea/i.test(event.target.tagName) ? event.which === SPACE_KEYCODE || event.which !== ESCAPE_KEYCODE && (event.which !== ARROW_DOWN_KEYCODE && event.which !== ARROW_UP_KEYCODE || $(event.target).closest(Selector.MENU).length) : !REGEXP_KEYDOWN.test(event.which)) {
+        return;
+      }
+
+      event.preventDefault();
+      event.stopPropagation();
+
+      if (this.disabled || $(this).hasClass(ClassName.DISABLED)) {
+        return;
+      }
+
+      var parent = Dropdown._getParentFromElement(this);
+
+      var isActive = $(parent).hasClass(ClassName.SHOW);
+
+      if (!isActive || isActive && (event.which === ESCAPE_KEYCODE || event.which === SPACE_KEYCODE)) {
+        if (event.which === ESCAPE_KEYCODE) {
+          var toggle = parent.querySelector(Selector.DATA_TOGGLE);
+          $(toggle).trigger('focus');
+        }
+
+        $(this).trigger('click');
+        return;
+      }
+
+      var items = [].slice.call(parent.querySelectorAll(Selector.VISIBLE_ITEMS));
+
+      if (items.length === 0) {
+        return;
+      }
+
+      var index = items.indexOf(event.target);
+
+      if (event.which === ARROW_UP_KEYCODE && index > 0) {
+        // Up
+        index--;
+      }
+
+      if (event.which === ARROW_DOWN_KEYCODE && index < items.length - 1) {
+        // Down
+        index++;
+      }
+
+      if (index < 0) {
+        index = 0;
+      }
+
+      items[index].focus();
+    };
+
+    _createClass(Dropdown, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }]);
+
+    return Dropdown;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.KEYDOWN_DATA_API, Selector.DATA_TOGGLE, Dropdown._dataApiKeydownHandler).on(Event.KEYDOWN_DATA_API, Selector.MENU, Dropdown._dataApiKeydownHandler).on(Event.CLICK_DATA_API + " " + Event.KEYUP_DATA_API, Dropdown._clearMenus).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    event.preventDefault();
+    event.stopPropagation();
+
+    Dropdown._jQueryInterface.call($(this), 'toggle');
+  }).on(Event.CLICK_DATA_API, Selector.FORM_CHILD, function (e) {
+    e.stopPropagation();
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Dropdown._jQueryInterface;
+  $.fn[NAME].Constructor = Dropdown;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Dropdown._jQueryInterface;
+  };
+
+  return Dropdown;
+
+}));
+/*!
+  * Bootstrap modal.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Modal = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'modal';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.modal';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var ESCAPE_KEYCODE = 27; // KeyboardEvent.which value for Escape (Esc) key
+
+  var Default = {
+    backdrop: true,
+    keyboard: true,
+    focus: true,
+    show: true
+  };
+  var DefaultType = {
+    backdrop: '(boolean|string)',
+    keyboard: 'boolean',
+    focus: 'boolean',
+    show: 'boolean'
+  };
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    FOCUSIN: "focusin" + EVENT_KEY,
+    RESIZE: "resize" + EVENT_KEY,
+    CLICK_DISMISS: "click.dismiss" + EVENT_KEY,
+    KEYDOWN_DISMISS: "keydown.dismiss" + EVENT_KEY,
+    MOUSEUP_DISMISS: "mouseup.dismiss" + EVENT_KEY,
+    MOUSEDOWN_DISMISS: "mousedown.dismiss" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    SCROLLABLE: 'modal-dialog-scrollable',
+    SCROLLBAR_MEASURER: 'modal-scrollbar-measure',
+    BACKDROP: 'modal-backdrop',
+    OPEN: 'modal-open',
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    DIALOG: '.modal-dialog',
+    MODAL_BODY: '.modal-body',
+    DATA_TOGGLE: '[data-toggle="modal"]',
+    DATA_DISMISS: '[data-dismiss="modal"]',
+    FIXED_CONTENT: '.fixed-top, .fixed-bottom, .is-fixed, .sticky-top',
+    STICKY_CONTENT: '.sticky-top'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Modal =
+  /*#__PURE__*/
+  function () {
+    function Modal(element, config) {
+      this._config = this._getConfig(config);
+      this._element = element;
+      this._dialog = element.querySelector(Selector.DIALOG);
+      this._backdrop = null;
+      this._isShown = false;
+      this._isBodyOverflowing = false;
+      this._ignoreBackdropClick = false;
+      this._isTransitioning = false;
+      this._scrollbarWidth = 0;
+    } // Getters
+
+
+    var _proto = Modal.prototype;
+
+    // Public
+    _proto.toggle = function toggle(relatedTarget) {
+      return this._isShown ? this.hide() : this.show(relatedTarget);
+    };
+
+    _proto.show = function show(relatedTarget) {
+      var _this = this;
+
+      if (this._isShown || this._isTransitioning) {
+        return;
+      }
+
+      if ($(this._element).hasClass(ClassName.FADE)) {
+        this._isTransitioning = true;
+      }
+
+      var showEvent = $.Event(Event.SHOW, {
+        relatedTarget: relatedTarget
+      });
+      $(this._element).trigger(showEvent);
+
+      if (this._isShown || showEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      this._isShown = true;
+
+      this._checkScrollbar();
+
+      this._setScrollbar();
+
+      this._adjustDialog();
+
+      this._setEscapeEvent();
+
+      this._setResizeEvent();
+
+      $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function (event) {
+        return _this.hide(event);
+      });
+      $(this._dialog).on(Event.MOUSEDOWN_DISMISS, function () {
+        $(_this._element).one(Event.MOUSEUP_DISMISS, function (event) {
+          if ($(event.target).is(_this._element)) {
+            _this._ignoreBackdropClick = true;
+          }
+        });
+      });
+
+      this._showBackdrop(function () {
+        return _this._showElement(relatedTarget);
+      });
+    };
+
+    _proto.hide = function hide(event) {
+      var _this2 = this;
+
+      if (event) {
+        event.preventDefault();
+      }
+
+      if (!this._isShown || this._isTransitioning) {
+        return;
+      }
+
+      var hideEvent = $.Event(Event.HIDE);
+      $(this._element).trigger(hideEvent);
+
+      if (!this._isShown || hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      this._isShown = false;
+      var transition = $(this._element).hasClass(ClassName.FADE);
+
+      if (transition) {
+        this._isTransitioning = true;
+      }
+
+      this._setEscapeEvent();
+
+      this._setResizeEvent();
+
+      $(document).off(Event.FOCUSIN);
+      $(this._element).removeClass(ClassName.SHOW);
+      $(this._element).off(Event.CLICK_DISMISS);
+      $(this._dialog).off(Event.MOUSEDOWN_DISMISS);
+
+      if (transition) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+        $(this._element).one(Util.TRANSITION_END, function (event) {
+          return _this2._hideModal(event);
+        }).emulateTransitionEnd(transitionDuration);
+      } else {
+        this._hideModal();
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      [window, this._element, this._dialog].forEach(function (htmlElement) {
+        return $(htmlElement).off(EVENT_KEY);
+      });
+      /**
+       * `document` has 2 events `Event.FOCUSIN` and `Event.CLICK_DATA_API`
+       * Do not move `document` in `htmlElements` array
+       * It will remove `Event.CLICK_DATA_API` event that should remain
+       */
+
+      $(document).off(Event.FOCUSIN);
+      $.removeData(this._element, DATA_KEY);
+      this._config = null;
+      this._element = null;
+      this._dialog = null;
+      this._backdrop = null;
+      this._isShown = null;
+      this._isBodyOverflowing = null;
+      this._ignoreBackdropClick = null;
+      this._isTransitioning = null;
+      this._scrollbarWidth = null;
+    };
+
+    _proto.handleUpdate = function handleUpdate() {
+      this._adjustDialog();
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, config);
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._showElement = function _showElement(relatedTarget) {
+      var _this3 = this;
+
+      var transition = $(this._element).hasClass(ClassName.FADE);
+
+      if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
+        // Don't move modal's DOM position
+        document.body.appendChild(this._element);
+      }
+
+      this._element.style.display = 'block';
+
+      this._element.removeAttribute('aria-hidden');
+
+      this._element.setAttribute('aria-modal', true);
+
+      if ($(this._dialog).hasClass(ClassName.SCROLLABLE)) {
+        this._dialog.querySelector(Selector.MODAL_BODY).scrollTop = 0;
+      } else {
+        this._element.scrollTop = 0;
+      }
+
+      if (transition) {
+        Util.reflow(this._element);
+      }
+
+      $(this._element).addClass(ClassName.SHOW);
+
+      if (this._config.focus) {
+        this._enforceFocus();
+      }
+
+      var shownEvent = $.Event(Event.SHOWN, {
+        relatedTarget: relatedTarget
+      });
+
+      var transitionComplete = function transitionComplete() {
+        if (_this3._config.focus) {
+          _this3._element.focus();
+        }
+
+        _this3._isTransitioning = false;
+        $(_this3._element).trigger(shownEvent);
+      };
+
+      if (transition) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._dialog);
+        $(this._dialog).one(Util.TRANSITION_END, transitionComplete).emulateTransitionEnd(transitionDuration);
+      } else {
+        transitionComplete();
+      }
+    };
+
+    _proto._enforceFocus = function _enforceFocus() {
+      var _this4 = this;
+
+      $(document).off(Event.FOCUSIN) // Guard against infinite focus loop
+      .on(Event.FOCUSIN, function (event) {
+        if (document !== event.target && _this4._element !== event.target && $(_this4._element).has(event.target).length === 0) {
+          _this4._element.focus();
+        }
+      });
+    };
+
+    _proto._setEscapeEvent = function _setEscapeEvent() {
+      var _this5 = this;
+
+      if (this._isShown && this._config.keyboard) {
+        $(this._element).on(Event.KEYDOWN_DISMISS, function (event) {
+          if (event.which === ESCAPE_KEYCODE) {
+            event.preventDefault();
+
+            _this5.hide();
+          }
+        });
+      } else if (!this._isShown) {
+        $(this._element).off(Event.KEYDOWN_DISMISS);
+      }
+    };
+
+    _proto._setResizeEvent = function _setResizeEvent() {
+      var _this6 = this;
+
+      if (this._isShown) {
+        $(window).on(Event.RESIZE, function (event) {
+          return _this6.handleUpdate(event);
+        });
+      } else {
+        $(window).off(Event.RESIZE);
+      }
+    };
+
+    _proto._hideModal = function _hideModal() {
+      var _this7 = this;
+
+      this._element.style.display = 'none';
+
+      this._element.setAttribute('aria-hidden', true);
+
+      this._element.removeAttribute('aria-modal');
+
+      this._isTransitioning = false;
+
+      this._showBackdrop(function () {
+        $(document.body).removeClass(ClassName.OPEN);
+
+        _this7._resetAdjustments();
+
+        _this7._resetScrollbar();
+
+        $(_this7._element).trigger(Event.HIDDEN);
+      });
+    };
+
+    _proto._removeBackdrop = function _removeBackdrop() {
+      if (this._backdrop) {
+        $(this._backdrop).remove();
+        this._backdrop = null;
+      }
+    };
+
+    _proto._showBackdrop = function _showBackdrop(callback) {
+      var _this8 = this;
+
+      var animate = $(this._element).hasClass(ClassName.FADE) ? ClassName.FADE : '';
+
+      if (this._isShown && this._config.backdrop) {
+        this._backdrop = document.createElement('div');
+        this._backdrop.className = ClassName.BACKDROP;
+
+        if (animate) {
+          this._backdrop.classList.add(animate);
+        }
+
+        $(this._backdrop).appendTo(document.body);
+        $(this._element).on(Event.CLICK_DISMISS, function (event) {
+          if (_this8._ignoreBackdropClick) {
+            _this8._ignoreBackdropClick = false;
+            return;
+          }
+
+          if (event.target !== event.currentTarget) {
+            return;
+          }
+
+          if (_this8._config.backdrop === 'static') {
+            _this8._element.focus();
+          } else {
+            _this8.hide();
+          }
+        });
+
+        if (animate) {
+          Util.reflow(this._backdrop);
+        }
+
+        $(this._backdrop).addClass(ClassName.SHOW);
+
+        if (!callback) {
+          return;
+        }
+
+        if (!animate) {
+          callback();
+          return;
+        }
+
+        var backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop);
+        $(this._backdrop).one(Util.TRANSITION_END, callback).emulateTransitionEnd(backdropTransitionDuration);
+      } else if (!this._isShown && this._backdrop) {
+        $(this._backdrop).removeClass(ClassName.SHOW);
+
+        var callbackRemove = function callbackRemove() {
+          _this8._removeBackdrop();
+
+          if (callback) {
+            callback();
+          }
+        };
+
+        if ($(this._element).hasClass(ClassName.FADE)) {
+          var _backdropTransitionDuration = Util.getTransitionDurationFromElement(this._backdrop);
+
+          $(this._backdrop).one(Util.TRANSITION_END, callbackRemove).emulateTransitionEnd(_backdropTransitionDuration);
+        } else {
+          callbackRemove();
+        }
+      } else if (callback) {
+        callback();
+      }
+    } // ----------------------------------------------------------------------
+    // the following methods are used to handle overflowing modals
+    // todo (fat): these should probably be refactored out of modal.js
+    // ----------------------------------------------------------------------
+    ;
+
+    _proto._adjustDialog = function _adjustDialog() {
+      var isModalOverflowing = this._element.scrollHeight > document.documentElement.clientHeight;
+
+      if (!this._isBodyOverflowing && isModalOverflowing) {
+        this._element.style.paddingLeft = this._scrollbarWidth + "px";
+      }
+
+      if (this._isBodyOverflowing && !isModalOverflowing) {
+        this._element.style.paddingRight = this._scrollbarWidth + "px";
+      }
+    };
+
+    _proto._resetAdjustments = function _resetAdjustments() {
+      this._element.style.paddingLeft = '';
+      this._element.style.paddingRight = '';
+    };
+
+    _proto._checkScrollbar = function _checkScrollbar() {
+      var rect = document.body.getBoundingClientRect();
+      this._isBodyOverflowing = rect.left + rect.right < window.innerWidth;
+      this._scrollbarWidth = this._getScrollbarWidth();
+    };
+
+    _proto._setScrollbar = function _setScrollbar() {
+      var _this9 = this;
+
+      if (this._isBodyOverflowing) {
+        // Note: DOMNode.style.paddingRight returns the actual value or '' if not set
+        //   while $(DOMNode).css('padding-right') returns the calculated value or 0 if not set
+        var fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT));
+        var stickyContent = [].slice.call(document.querySelectorAll(Selector.STICKY_CONTENT)); // Adjust fixed content padding
+
+        $(fixedContent).each(function (index, element) {
+          var actualPadding = element.style.paddingRight;
+          var calculatedPadding = $(element).css('padding-right');
+          $(element).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + _this9._scrollbarWidth + "px");
+        }); // Adjust sticky content margin
+
+        $(stickyContent).each(function (index, element) {
+          var actualMargin = element.style.marginRight;
+          var calculatedMargin = $(element).css('margin-right');
+          $(element).data('margin-right', actualMargin).css('margin-right', parseFloat(calculatedMargin) - _this9._scrollbarWidth + "px");
+        }); // Adjust body padding
+
+        var actualPadding = document.body.style.paddingRight;
+        var calculatedPadding = $(document.body).css('padding-right');
+        $(document.body).data('padding-right', actualPadding).css('padding-right', parseFloat(calculatedPadding) + this._scrollbarWidth + "px");
+      }
+
+      $(document.body).addClass(ClassName.OPEN);
+    };
+
+    _proto._resetScrollbar = function _resetScrollbar() {
+      // Restore fixed content padding
+      var fixedContent = [].slice.call(document.querySelectorAll(Selector.FIXED_CONTENT));
+      $(fixedContent).each(function (index, element) {
+        var padding = $(element).data('padding-right');
+        $(element).removeData('padding-right');
+        element.style.paddingRight = padding ? padding : '';
+      }); // Restore sticky content
+
+      var elements = [].slice.call(document.querySelectorAll("" + Selector.STICKY_CONTENT));
+      $(elements).each(function (index, element) {
+        var margin = $(element).data('margin-right');
+
+        if (typeof margin !== 'undefined') {
+          $(element).css('margin-right', margin).removeData('margin-right');
+        }
+      }); // Restore body padding
+
+      var padding = $(document.body).data('padding-right');
+      $(document.body).removeData('padding-right');
+      document.body.style.paddingRight = padding ? padding : '';
+    };
+
+    _proto._getScrollbarWidth = function _getScrollbarWidth() {
+      // thx d.walsh
+      var scrollDiv = document.createElement('div');
+      scrollDiv.className = ClassName.SCROLLBAR_MEASURER;
+      document.body.appendChild(scrollDiv);
+      var scrollbarWidth = scrollDiv.getBoundingClientRect().width - scrollDiv.clientWidth;
+      document.body.removeChild(scrollDiv);
+      return scrollbarWidth;
+    } // Static
+    ;
+
+    Modal._jQueryInterface = function _jQueryInterface(config, relatedTarget) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = _objectSpread({}, Default, $(this).data(), typeof config === 'object' && config ? config : {});
+
+        if (!data) {
+          data = new Modal(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config](relatedTarget);
+        } else if (_config.show) {
+          data.show(relatedTarget);
+        }
+      });
+    };
+
+    _createClass(Modal, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Modal;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    var _this10 = this;
+
+    var target;
+    var selector = Util.getSelectorFromElement(this);
+
+    if (selector) {
+      target = document.querySelector(selector);
+    }
+
+    var config = $(target).data(DATA_KEY) ? 'toggle' : _objectSpread({}, $(target).data(), $(this).data());
+
+    if (this.tagName === 'A' || this.tagName === 'AREA') {
+      event.preventDefault();
+    }
+
+    var $target = $(target).one(Event.SHOW, function (showEvent) {
+      if (showEvent.isDefaultPrevented()) {
+        // Only register focus restorer if modal will actually get shown
+        return;
+      }
+
+      $target.one(Event.HIDDEN, function () {
+        if ($(_this10).is(':visible')) {
+          _this10.focus();
+        }
+      });
+    });
+
+    Modal._jQueryInterface.call($(target), config, this);
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Modal._jQueryInterface;
+  $.fn[NAME].Constructor = Modal;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Modal._jQueryInterface;
+  };
+
+  return Modal;
+
+}));
+/*!
+  * Bootstrap tooltip.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('popper.js'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', 'popper.js', './util.js'], factory) :
+  (global = global || self, global.Tooltip = factory(global.jQuery, global.Popper, global.Util));
+}(this, function ($, Popper, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Popper = Popper && Popper.hasOwnProperty('default') ? Popper['default'] : Popper;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * --------------------------------------------------------------------------
+   * Bootstrap (v4.3.1): tools/sanitizer.js
+   * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+   * --------------------------------------------------------------------------
+   */
+  var uriAttrs = ['background', 'cite', 'href', 'itemtype', 'longdesc', 'poster', 'src', 'xlink:href'];
+  var ARIA_ATTRIBUTE_PATTERN = /^aria-[\w-]*$/i;
+  var DefaultWhitelist = {
+    // Global attributes allowed on any supplied element below.
+    '*': ['class', 'dir', 'id', 'lang', 'role', ARIA_ATTRIBUTE_PATTERN],
+    a: ['target', 'href', 'title', 'rel'],
+    area: [],
+    b: [],
+    br: [],
+    col: [],
+    code: [],
+    div: [],
+    em: [],
+    hr: [],
+    h1: [],
+    h2: [],
+    h3: [],
+    h4: [],
+    h5: [],
+    h6: [],
+    i: [],
+    img: ['src', 'alt', 'title', 'width', 'height'],
+    li: [],
+    ol: [],
+    p: [],
+    pre: [],
+    s: [],
+    small: [],
+    span: [],
+    sub: [],
+    sup: [],
+    strong: [],
+    u: [],
+    ul: []
+    /**
+     * A pattern that recognizes a commonly useful subset of URLs that are safe.
+     *
+     * Shoutout to Angular 7 https://github.com/angular/angular/blob/7.2.4/packages/core/src/sanitization/url_sanitizer.ts
+     */
+
+  };
+  var SAFE_URL_PATTERN = /^(?:(?:https?|mailto|ftp|tel|file):|[^&:/?#]*(?:[/?#]|$))/gi;
+  /**
+   * A pattern that matches safe data URLs. Only matches image, video and audio types.
+   *
+   * Shoutout to Angular 7 https://github.com/angular/angular/blob/7.2.4/packages/core/src/sanitization/url_sanitizer.ts
+   */
+
+  var DATA_URL_PATTERN = /^data:(?:image\/(?:bmp|gif|jpeg|jpg|png|tiff|webp)|video\/(?:mpeg|mp4|ogg|webm)|audio\/(?:mp3|oga|ogg|opus));base64,[a-z0-9+/]+=*$/i;
+
+  function allowedAttribute(attr, allowedAttributeList) {
+    var attrName = attr.nodeName.toLowerCase();
+
+    if (allowedAttributeList.indexOf(attrName) !== -1) {
+      if (uriAttrs.indexOf(attrName) !== -1) {
+        return Boolean(attr.nodeValue.match(SAFE_URL_PATTERN) || attr.nodeValue.match(DATA_URL_PATTERN));
+      }
+
+      return true;
+    }
+
+    var regExp = allowedAttributeList.filter(function (attrRegex) {
+      return attrRegex instanceof RegExp;
+    }); // Check if a regular expression validates the attribute.
+
+    for (var i = 0, l = regExp.length; i < l; i++) {
+      if (attrName.match(regExp[i])) {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
+  function sanitizeHtml(unsafeHtml, whiteList, sanitizeFn) {
+    if (unsafeHtml.length === 0) {
+      return unsafeHtml;
+    }
+
+    if (sanitizeFn && typeof sanitizeFn === 'function') {
+      return sanitizeFn(unsafeHtml);
+    }
+
+    var domParser = new window.DOMParser();
+    var createdDocument = domParser.parseFromString(unsafeHtml, 'text/html');
+    var whitelistKeys = Object.keys(whiteList);
+    var elements = [].slice.call(createdDocument.body.querySelectorAll('*'));
+
+    var _loop = function _loop(i, len) {
+      var el = elements[i];
+      var elName = el.nodeName.toLowerCase();
+
+      if (whitelistKeys.indexOf(el.nodeName.toLowerCase()) === -1) {
+        el.parentNode.removeChild(el);
+        return "continue";
+      }
+
+      var attributeList = [].slice.call(el.attributes);
+      var whitelistedAttributes = [].concat(whiteList['*'] || [], whiteList[elName] || []);
+      attributeList.forEach(function (attr) {
+        if (!allowedAttribute(attr, whitelistedAttributes)) {
+          el.removeAttribute(attr.nodeName);
+        }
+      });
+    };
+
+    for (var i = 0, len = elements.length; i < len; i++) {
+      var _ret = _loop(i, len);
+
+      if (_ret === "continue") continue;
+    }
+
+    return createdDocument.body.innerHTML;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'tooltip';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.tooltip';
+  var EVENT_KEY = "." + DATA_KEY;
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var CLASS_PREFIX = 'bs-tooltip';
+  var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
+  var DISALLOWED_ATTRIBUTES = ['sanitize', 'whiteList', 'sanitizeFn'];
+  var DefaultType = {
+    animation: 'boolean',
+    template: 'string',
+    title: '(string|element|function)',
+    trigger: 'string',
+    delay: '(number|object)',
+    html: 'boolean',
+    selector: '(string|boolean)',
+    placement: '(string|function)',
+    offset: '(number|string|function)',
+    container: '(string|element|boolean)',
+    fallbackPlacement: '(string|array)',
+    boundary: '(string|element)',
+    sanitize: 'boolean',
+    sanitizeFn: '(null|function)',
+    whiteList: 'object'
+  };
+  var AttachmentMap = {
+    AUTO: 'auto',
+    TOP: 'top',
+    RIGHT: 'right',
+    BOTTOM: 'bottom',
+    LEFT: 'left'
+  };
+  var Default = {
+    animation: true,
+    template: '<div class="tooltip" role="tooltip">' + '<div class="arrow"></div>' + '<div class="tooltip-inner"></div></div>',
+    trigger: 'hover focus',
+    title: '',
+    delay: 0,
+    html: false,
+    selector: false,
+    placement: 'top',
+    offset: 0,
+    container: false,
+    fallbackPlacement: 'flip',
+    boundary: 'scrollParent',
+    sanitize: true,
+    sanitizeFn: null,
+    whiteList: DefaultWhitelist
+  };
+  var HoverState = {
+    SHOW: 'show',
+    OUT: 'out'
+  };
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    INSERTED: "inserted" + EVENT_KEY,
+    CLICK: "click" + EVENT_KEY,
+    FOCUSIN: "focusin" + EVENT_KEY,
+    FOCUSOUT: "focusout" + EVENT_KEY,
+    MOUSEENTER: "mouseenter" + EVENT_KEY,
+    MOUSELEAVE: "mouseleave" + EVENT_KEY
+  };
+  var ClassName = {
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    TOOLTIP: '.tooltip',
+    TOOLTIP_INNER: '.tooltip-inner',
+    ARROW: '.arrow'
+  };
+  var Trigger = {
+    HOVER: 'hover',
+    FOCUS: 'focus',
+    CLICK: 'click',
+    MANUAL: 'manual'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Tooltip =
+  /*#__PURE__*/
+  function () {
+    function Tooltip(element, config) {
+      /**
+       * Check for Popper dependency
+       * Popper - https://popper.js.org
+       */
+      if (typeof Popper === 'undefined') {
+        throw new TypeError('Bootstrap\'s tooltips require Popper.js (https://popper.js.org/)');
+      } // private
+
+
+      this._isEnabled = true;
+      this._timeout = 0;
+      this._hoverState = '';
+      this._activeTrigger = {};
+      this._popper = null; // Protected
+
+      this.element = element;
+      this.config = this._getConfig(config);
+      this.tip = null;
+
+      this._setListeners();
+    } // Getters
+
+
+    var _proto = Tooltip.prototype;
+
+    // Public
+    _proto.enable = function enable() {
+      this._isEnabled = true;
+    };
+
+    _proto.disable = function disable() {
+      this._isEnabled = false;
+    };
+
+    _proto.toggleEnabled = function toggleEnabled() {
+      this._isEnabled = !this._isEnabled;
+    };
+
+    _proto.toggle = function toggle(event) {
+      if (!this._isEnabled) {
+        return;
+      }
+
+      if (event) {
+        var dataKey = this.constructor.DATA_KEY;
+        var context = $(event.currentTarget).data(dataKey);
+
+        if (!context) {
+          context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+          $(event.currentTarget).data(dataKey, context);
+        }
+
+        context._activeTrigger.click = !context._activeTrigger.click;
+
+        if (context._isWithActiveTrigger()) {
+          context._enter(null, context);
+        } else {
+          context._leave(null, context);
+        }
+      } else {
+        if ($(this.getTipElement()).hasClass(ClassName.SHOW)) {
+          this._leave(null, this);
+
+          return;
+        }
+
+        this._enter(null, this);
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      clearTimeout(this._timeout);
+      $.removeData(this.element, this.constructor.DATA_KEY);
+      $(this.element).off(this.constructor.EVENT_KEY);
+      $(this.element).closest('.modal').off('hide.bs.modal');
+
+      if (this.tip) {
+        $(this.tip).remove();
+      }
+
+      this._isEnabled = null;
+      this._timeout = null;
+      this._hoverState = null;
+      this._activeTrigger = null;
+
+      if (this._popper !== null) {
+        this._popper.destroy();
+      }
+
+      this._popper = null;
+      this.element = null;
+      this.config = null;
+      this.tip = null;
+    };
+
+    _proto.show = function show() {
+      var _this = this;
+
+      if ($(this.element).css('display') === 'none') {
+        throw new Error('Please use show on visible elements');
+      }
+
+      var showEvent = $.Event(this.constructor.Event.SHOW);
+
+      if (this.isWithContent() && this._isEnabled) {
+        $(this.element).trigger(showEvent);
+        var shadowRoot = Util.findShadowRoot(this.element);
+        var isInTheDom = $.contains(shadowRoot !== null ? shadowRoot : this.element.ownerDocument.documentElement, this.element);
+
+        if (showEvent.isDefaultPrevented() || !isInTheDom) {
+          return;
+        }
+
+        var tip = this.getTipElement();
+        var tipId = Util.getUID(this.constructor.NAME);
+        tip.setAttribute('id', tipId);
+        this.element.setAttribute('aria-describedby', tipId);
+        this.setContent();
+
+        if (this.config.animation) {
+          $(tip).addClass(ClassName.FADE);
+        }
+
+        var placement = typeof this.config.placement === 'function' ? this.config.placement.call(this, tip, this.element) : this.config.placement;
+
+        var attachment = this._getAttachment(placement);
+
+        this.addAttachmentClass(attachment);
+
+        var container = this._getContainer();
+
+        $(tip).data(this.constructor.DATA_KEY, this);
+
+        if (!$.contains(this.element.ownerDocument.documentElement, this.tip)) {
+          $(tip).appendTo(container);
+        }
+
+        $(this.element).trigger(this.constructor.Event.INSERTED);
+        this._popper = new Popper(this.element, tip, {
+          placement: attachment,
+          modifiers: {
+            offset: this._getOffset(),
+            flip: {
+              behavior: this.config.fallbackPlacement
+            },
+            arrow: {
+              element: Selector.ARROW
+            },
+            preventOverflow: {
+              boundariesElement: this.config.boundary
+            }
+          },
+          onCreate: function onCreate(data) {
+            if (data.originalPlacement !== data.placement) {
+              _this._handlePopperPlacementChange(data);
+            }
+          },
+          onUpdate: function onUpdate(data) {
+            return _this._handlePopperPlacementChange(data);
+          }
+        });
+        $(tip).addClass(ClassName.SHOW); // If this is a touch-enabled device we add extra
+        // empty mouseover listeners to the body's immediate children;
+        // only needed because of broken event delegation on iOS
+        // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
+
+        if ('ontouchstart' in document.documentElement) {
+          $(document.body).children().on('mouseover', null, $.noop);
+        }
+
+        var complete = function complete() {
+          if (_this.config.animation) {
+            _this._fixTransition();
+          }
+
+          var prevHoverState = _this._hoverState;
+          _this._hoverState = null;
+          $(_this.element).trigger(_this.constructor.Event.SHOWN);
+
+          if (prevHoverState === HoverState.OUT) {
+            _this._leave(null, _this);
+          }
+        };
+
+        if ($(this.tip).hasClass(ClassName.FADE)) {
+          var transitionDuration = Util.getTransitionDurationFromElement(this.tip);
+          $(this.tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+        } else {
+          complete();
+        }
+      }
+    };
+
+    _proto.hide = function hide(callback) {
+      var _this2 = this;
+
+      var tip = this.getTipElement();
+      var hideEvent = $.Event(this.constructor.Event.HIDE);
+
+      var complete = function complete() {
+        if (_this2._hoverState !== HoverState.SHOW && tip.parentNode) {
+          tip.parentNode.removeChild(tip);
+        }
+
+        _this2._cleanTipClass();
+
+        _this2.element.removeAttribute('aria-describedby');
+
+        $(_this2.element).trigger(_this2.constructor.Event.HIDDEN);
+
+        if (_this2._popper !== null) {
+          _this2._popper.destroy();
+        }
+
+        if (callback) {
+          callback();
+        }
+      };
+
+      $(this.element).trigger(hideEvent);
+
+      if (hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      $(tip).removeClass(ClassName.SHOW); // If this is a touch-enabled device we remove the extra
+      // empty mouseover listeners we added for iOS support
+
+      if ('ontouchstart' in document.documentElement) {
+        $(document.body).children().off('mouseover', null, $.noop);
+      }
+
+      this._activeTrigger[Trigger.CLICK] = false;
+      this._activeTrigger[Trigger.FOCUS] = false;
+      this._activeTrigger[Trigger.HOVER] = false;
+
+      if ($(this.tip).hasClass(ClassName.FADE)) {
+        var transitionDuration = Util.getTransitionDurationFromElement(tip);
+        $(tip).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+
+      this._hoverState = '';
+    };
+
+    _proto.update = function update() {
+      if (this._popper !== null) {
+        this._popper.scheduleUpdate();
+      }
+    } // Protected
+    ;
+
+    _proto.isWithContent = function isWithContent() {
+      return Boolean(this.getTitle());
+    };
+
+    _proto.addAttachmentClass = function addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
+    };
+
+    _proto.getTipElement = function getTipElement() {
+      this.tip = this.tip || $(this.config.template)[0];
+      return this.tip;
+    };
+
+    _proto.setContent = function setContent() {
+      var tip = this.getTipElement();
+      this.setElementContent($(tip.querySelectorAll(Selector.TOOLTIP_INNER)), this.getTitle());
+      $(tip).removeClass(ClassName.FADE + " " + ClassName.SHOW);
+    };
+
+    _proto.setElementContent = function setElementContent($element, content) {
+      if (typeof content === 'object' && (content.nodeType || content.jquery)) {
+        // Content is a DOM node or a jQuery
+        if (this.config.html) {
+          if (!$(content).parent().is($element)) {
+            $element.empty().append(content);
+          }
+        } else {
+          $element.text($(content).text());
+        }
+
+        return;
+      }
+
+      if (this.config.html) {
+        if (this.config.sanitize) {
+          content = sanitizeHtml(content, this.config.whiteList, this.config.sanitizeFn);
+        }
+
+        $element.html(content);
+      } else {
+        $element.text(content);
+      }
+    };
+
+    _proto.getTitle = function getTitle() {
+      var title = this.element.getAttribute('data-original-title');
+
+      if (!title) {
+        title = typeof this.config.title === 'function' ? this.config.title.call(this.element) : this.config.title;
+      }
+
+      return title;
+    } // Private
+    ;
+
+    _proto._getOffset = function _getOffset() {
+      var _this3 = this;
+
+      var offset = {};
+
+      if (typeof this.config.offset === 'function') {
+        offset.fn = function (data) {
+          data.offsets = _objectSpread({}, data.offsets, _this3.config.offset(data.offsets, _this3.element) || {});
+          return data;
+        };
+      } else {
+        offset.offset = this.config.offset;
+      }
+
+      return offset;
+    };
+
+    _proto._getContainer = function _getContainer() {
+      if (this.config.container === false) {
+        return document.body;
+      }
+
+      if (Util.isElement(this.config.container)) {
+        return $(this.config.container);
+      }
+
+      return $(document).find(this.config.container);
+    };
+
+    _proto._getAttachment = function _getAttachment(placement) {
+      return AttachmentMap[placement.toUpperCase()];
+    };
+
+    _proto._setListeners = function _setListeners() {
+      var _this4 = this;
+
+      var triggers = this.config.trigger.split(' ');
+      triggers.forEach(function (trigger) {
+        if (trigger === 'click') {
+          $(_this4.element).on(_this4.constructor.Event.CLICK, _this4.config.selector, function (event) {
+            return _this4.toggle(event);
+          });
+        } else if (trigger !== Trigger.MANUAL) {
+          var eventIn = trigger === Trigger.HOVER ? _this4.constructor.Event.MOUSEENTER : _this4.constructor.Event.FOCUSIN;
+          var eventOut = trigger === Trigger.HOVER ? _this4.constructor.Event.MOUSELEAVE : _this4.constructor.Event.FOCUSOUT;
+          $(_this4.element).on(eventIn, _this4.config.selector, function (event) {
+            return _this4._enter(event);
+          }).on(eventOut, _this4.config.selector, function (event) {
+            return _this4._leave(event);
+          });
+        }
+      });
+      $(this.element).closest('.modal').on('hide.bs.modal', function () {
+        if (_this4.element) {
+          _this4.hide();
+        }
+      });
+
+      if (this.config.selector) {
+        this.config = _objectSpread({}, this.config, {
+          trigger: 'manual',
+          selector: ''
+        });
+      } else {
+        this._fixTitle();
+      }
+    };
+
+    _proto._fixTitle = function _fixTitle() {
+      var titleType = typeof this.element.getAttribute('data-original-title');
+
+      if (this.element.getAttribute('title') || titleType !== 'string') {
+        this.element.setAttribute('data-original-title', this.element.getAttribute('title') || '');
+        this.element.setAttribute('title', '');
+      }
+    };
+
+    _proto._enter = function _enter(event, context) {
+      var dataKey = this.constructor.DATA_KEY;
+      context = context || $(event.currentTarget).data(dataKey);
+
+      if (!context) {
+        context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+        $(event.currentTarget).data(dataKey, context);
+      }
+
+      if (event) {
+        context._activeTrigger[event.type === 'focusin' ? Trigger.FOCUS : Trigger.HOVER] = true;
+      }
+
+      if ($(context.getTipElement()).hasClass(ClassName.SHOW) || context._hoverState === HoverState.SHOW) {
+        context._hoverState = HoverState.SHOW;
+        return;
+      }
+
+      clearTimeout(context._timeout);
+      context._hoverState = HoverState.SHOW;
+
+      if (!context.config.delay || !context.config.delay.show) {
+        context.show();
+        return;
+      }
+
+      context._timeout = setTimeout(function () {
+        if (context._hoverState === HoverState.SHOW) {
+          context.show();
+        }
+      }, context.config.delay.show);
+    };
+
+    _proto._leave = function _leave(event, context) {
+      var dataKey = this.constructor.DATA_KEY;
+      context = context || $(event.currentTarget).data(dataKey);
+
+      if (!context) {
+        context = new this.constructor(event.currentTarget, this._getDelegateConfig());
+        $(event.currentTarget).data(dataKey, context);
+      }
+
+      if (event) {
+        context._activeTrigger[event.type === 'focusout' ? Trigger.FOCUS : Trigger.HOVER] = false;
+      }
+
+      if (context._isWithActiveTrigger()) {
+        return;
+      }
+
+      clearTimeout(context._timeout);
+      context._hoverState = HoverState.OUT;
+
+      if (!context.config.delay || !context.config.delay.hide) {
+        context.hide();
+        return;
+      }
+
+      context._timeout = setTimeout(function () {
+        if (context._hoverState === HoverState.OUT) {
+          context.hide();
+        }
+      }, context.config.delay.hide);
+    };
+
+    _proto._isWithActiveTrigger = function _isWithActiveTrigger() {
+      for (var trigger in this._activeTrigger) {
+        if (this._activeTrigger[trigger]) {
+          return true;
+        }
+      }
+
+      return false;
+    };
+
+    _proto._getConfig = function _getConfig(config) {
+      var dataAttributes = $(this.element).data();
+      Object.keys(dataAttributes).forEach(function (dataAttr) {
+        if (DISALLOWED_ATTRIBUTES.indexOf(dataAttr) !== -1) {
+          delete dataAttributes[dataAttr];
+        }
+      });
+      config = _objectSpread({}, this.constructor.Default, dataAttributes, typeof config === 'object' && config ? config : {});
+
+      if (typeof config.delay === 'number') {
+        config.delay = {
+          show: config.delay,
+          hide: config.delay
+        };
+      }
+
+      if (typeof config.title === 'number') {
+        config.title = config.title.toString();
+      }
+
+      if (typeof config.content === 'number') {
+        config.content = config.content.toString();
+      }
+
+      Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+
+      if (config.sanitize) {
+        config.template = sanitizeHtml(config.template, config.whiteList, config.sanitizeFn);
+      }
+
+      return config;
+    };
+
+    _proto._getDelegateConfig = function _getDelegateConfig() {
+      var config = {};
+
+      if (this.config) {
+        for (var key in this.config) {
+          if (this.constructor.Default[key] !== this.config[key]) {
+            config[key] = this.config[key];
+          }
+        }
+      }
+
+      return config;
+    };
+
+    _proto._cleanTipClass = function _cleanTipClass() {
+      var $tip = $(this.getTipElement());
+      var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
+
+      if (tabClass !== null && tabClass.length) {
+        $tip.removeClass(tabClass.join(''));
+      }
+    };
+
+    _proto._handlePopperPlacementChange = function _handlePopperPlacementChange(popperData) {
+      var popperInstance = popperData.instance;
+      this.tip = popperInstance.popper;
+
+      this._cleanTipClass();
+
+      this.addAttachmentClass(this._getAttachment(popperData.placement));
+    };
+
+    _proto._fixTransition = function _fixTransition() {
+      var tip = this.getTipElement();
+      var initConfigAnimation = this.config.animation;
+
+      if (tip.getAttribute('x-placement') !== null) {
+        return;
+      }
+
+      $(tip).removeClass(ClassName.FADE);
+      this.config.animation = false;
+      this.hide();
+      this.show();
+      this.config.animation = initConfigAnimation;
+    } // Static
+    ;
+
+    Tooltip._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' && config;
+
+        if (!data && /dispose|hide/.test(config)) {
+          return;
+        }
+
+        if (!data) {
+          data = new Tooltip(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Tooltip, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }, {
+      key: "NAME",
+      get: function get() {
+        return NAME;
+      }
+    }, {
+      key: "DATA_KEY",
+      get: function get() {
+        return DATA_KEY;
+      }
+    }, {
+      key: "Event",
+      get: function get() {
+        return Event;
+      }
+    }, {
+      key: "EVENT_KEY",
+      get: function get() {
+        return EVENT_KEY;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }]);
+
+    return Tooltip;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+
+  $.fn[NAME] = Tooltip._jQueryInterface;
+  $.fn[NAME].Constructor = Tooltip;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Tooltip._jQueryInterface;
+  };
+
+  return Tooltip;
+
+}));
+/*!
+  * Bootstrap popover.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./tooltip.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './tooltip.js'], factory) :
+  (global = global || self, global.Popover = factory(global.jQuery, global.Tooltip));
+}(this, function ($, Tooltip) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Tooltip = Tooltip && Tooltip.hasOwnProperty('default') ? Tooltip['default'] : Tooltip;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  function _inheritsLoose(subClass, superClass) {
+    subClass.prototype = Object.create(superClass.prototype);
+    subClass.prototype.constructor = subClass;
+    subClass.__proto__ = superClass;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'popover';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.popover';
+  var EVENT_KEY = "." + DATA_KEY;
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var CLASS_PREFIX = 'bs-popover';
+  var BSCLS_PREFIX_REGEX = new RegExp("(^|\\s)" + CLASS_PREFIX + "\\S+", 'g');
+
+  var Default = _objectSpread({}, Tooltip.Default, {
+    placement: 'right',
+    trigger: 'click',
+    content: '',
+    template: '<div class="popover" role="tooltip">' + '<div class="arrow"></div>' + '<h3 class="popover-header"></h3>' + '<div class="popover-body"></div></div>'
+  });
+
+  var DefaultType = _objectSpread({}, Tooltip.DefaultType, {
+    content: '(string|element|function)'
+  });
+
+  var ClassName = {
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    TITLE: '.popover-header',
+    CONTENT: '.popover-body'
+  };
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    INSERTED: "inserted" + EVENT_KEY,
+    CLICK: "click" + EVENT_KEY,
+    FOCUSIN: "focusin" + EVENT_KEY,
+    FOCUSOUT: "focusout" + EVENT_KEY,
+    MOUSEENTER: "mouseenter" + EVENT_KEY,
+    MOUSELEAVE: "mouseleave" + EVENT_KEY
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Popover =
+  /*#__PURE__*/
+  function (_Tooltip) {
+    _inheritsLoose(Popover, _Tooltip);
+
+    function Popover() {
+      return _Tooltip.apply(this, arguments) || this;
+    }
+
+    var _proto = Popover.prototype;
+
+    // Overrides
+    _proto.isWithContent = function isWithContent() {
+      return this.getTitle() || this._getContent();
+    };
+
+    _proto.addAttachmentClass = function addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(CLASS_PREFIX + "-" + attachment);
+    };
+
+    _proto.getTipElement = function getTipElement() {
+      this.tip = this.tip || $(this.config.template)[0];
+      return this.tip;
+    };
+
+    _proto.setContent = function setContent() {
+      var $tip = $(this.getTipElement()); // We use append for html objects to maintain js events
+
+      this.setElementContent($tip.find(Selector.TITLE), this.getTitle());
+
+      var content = this._getContent();
+
+      if (typeof content === 'function') {
+        content = content.call(this.element);
+      }
+
+      this.setElementContent($tip.find(Selector.CONTENT), content);
+      $tip.removeClass(ClassName.FADE + " " + ClassName.SHOW);
+    } // Private
+    ;
+
+    _proto._getContent = function _getContent() {
+      return this.element.getAttribute('data-content') || this.config.content;
+    };
+
+    _proto._cleanTipClass = function _cleanTipClass() {
+      var $tip = $(this.getTipElement());
+      var tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX);
+
+      if (tabClass !== null && tabClass.length > 0) {
+        $tip.removeClass(tabClass.join(''));
+      }
+    } // Static
+    ;
+
+    Popover._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' ? config : null;
+
+        if (!data && /dispose|hide/.test(config)) {
+          return;
+        }
+
+        if (!data) {
+          data = new Popover(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Popover, null, [{
+      key: "VERSION",
+      // Getters
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }, {
+      key: "NAME",
+      get: function get() {
+        return NAME;
+      }
+    }, {
+      key: "DATA_KEY",
+      get: function get() {
+        return DATA_KEY;
+      }
+    }, {
+      key: "Event",
+      get: function get() {
+        return Event;
+      }
+    }, {
+      key: "EVENT_KEY",
+      get: function get() {
+        return EVENT_KEY;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }]);
+
+    return Popover;
+  }(Tooltip);
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+
+  $.fn[NAME] = Popover._jQueryInterface;
+  $.fn[NAME].Constructor = Popover;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Popover._jQueryInterface;
+  };
+
+  return Popover;
+
+}));
+/*!
+  * Bootstrap scrollspy.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.ScrollSpy = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'scrollspy';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.scrollspy';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Default = {
+    offset: 10,
+    method: 'auto',
+    target: ''
+  };
+  var DefaultType = {
+    offset: 'number',
+    method: 'string',
+    target: '(string|element)'
+  };
+  var Event = {
+    ACTIVATE: "activate" + EVENT_KEY,
+    SCROLL: "scroll" + EVENT_KEY,
+    LOAD_DATA_API: "load" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    DROPDOWN_ITEM: 'dropdown-item',
+    DROPDOWN_MENU: 'dropdown-menu',
+    ACTIVE: 'active'
+  };
+  var Selector = {
+    DATA_SPY: '[data-spy="scroll"]',
+    ACTIVE: '.active',
+    NAV_LIST_GROUP: '.nav, .list-group',
+    NAV_LINKS: '.nav-link',
+    NAV_ITEMS: '.nav-item',
+    LIST_ITEMS: '.list-group-item',
+    DROPDOWN: '.dropdown',
+    DROPDOWN_ITEMS: '.dropdown-item',
+    DROPDOWN_TOGGLE: '.dropdown-toggle'
+  };
+  var OffsetMethod = {
+    OFFSET: 'offset',
+    POSITION: 'position'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var ScrollSpy =
+  /*#__PURE__*/
+  function () {
+    function ScrollSpy(element, config) {
+      var _this = this;
+
+      this._element = element;
+      this._scrollElement = element.tagName === 'BODY' ? window : element;
+      this._config = this._getConfig(config);
+      this._selector = this._config.target + " " + Selector.NAV_LINKS + "," + (this._config.target + " " + Selector.LIST_ITEMS + ",") + (this._config.target + " " + Selector.DROPDOWN_ITEMS);
+      this._offsets = [];
+      this._targets = [];
+      this._activeTarget = null;
+      this._scrollHeight = 0;
+      $(this._scrollElement).on(Event.SCROLL, function (event) {
+        return _this._process(event);
+      });
+      this.refresh();
+
+      this._process();
+    } // Getters
+
+
+    var _proto = ScrollSpy.prototype;
+
+    // Public
+    _proto.refresh = function refresh() {
+      var _this2 = this;
+
+      var autoMethod = this._scrollElement === this._scrollElement.window ? OffsetMethod.OFFSET : OffsetMethod.POSITION;
+      var offsetMethod = this._config.method === 'auto' ? autoMethod : this._config.method;
+      var offsetBase = offsetMethod === OffsetMethod.POSITION ? this._getScrollTop() : 0;
+      this._offsets = [];
+      this._targets = [];
+      this._scrollHeight = this._getScrollHeight();
+      var targets = [].slice.call(document.querySelectorAll(this._selector));
+      targets.map(function (element) {
+        var target;
+        var targetSelector = Util.getSelectorFromElement(element);
+
+        if (targetSelector) {
+          target = document.querySelector(targetSelector);
+        }
+
+        if (target) {
+          var targetBCR = target.getBoundingClientRect();
+
+          if (targetBCR.width || targetBCR.height) {
+            // TODO (fat): remove sketch reliance on jQuery position/offset
+            return [$(target)[offsetMethod]().top + offsetBase, targetSelector];
+          }
+        }
+
+        return null;
+      }).filter(function (item) {
+        return item;
+      }).sort(function (a, b) {
+        return a[0] - b[0];
+      }).forEach(function (item) {
+        _this2._offsets.push(item[0]);
+
+        _this2._targets.push(item[1]);
+      });
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      $(this._scrollElement).off(EVENT_KEY);
+      this._element = null;
+      this._scrollElement = null;
+      this._config = null;
+      this._selector = null;
+      this._offsets = null;
+      this._targets = null;
+      this._activeTarget = null;
+      this._scrollHeight = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, typeof config === 'object' && config ? config : {});
+
+      if (typeof config.target !== 'string') {
+        var id = $(config.target).attr('id');
+
+        if (!id) {
+          id = Util.getUID(NAME);
+          $(config.target).attr('id', id);
+        }
+
+        config.target = "#" + id;
+      }
+
+      Util.typeCheckConfig(NAME, config, DefaultType);
+      return config;
+    };
+
+    _proto._getScrollTop = function _getScrollTop() {
+      return this._scrollElement === window ? this._scrollElement.pageYOffset : this._scrollElement.scrollTop;
+    };
+
+    _proto._getScrollHeight = function _getScrollHeight() {
+      return this._scrollElement.scrollHeight || Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
+    };
+
+    _proto._getOffsetHeight = function _getOffsetHeight() {
+      return this._scrollElement === window ? window.innerHeight : this._scrollElement.getBoundingClientRect().height;
+    };
+
+    _proto._process = function _process() {
+      var scrollTop = this._getScrollTop() + this._config.offset;
+
+      var scrollHeight = this._getScrollHeight();
+
+      var maxScroll = this._config.offset + scrollHeight - this._getOffsetHeight();
+
+      if (this._scrollHeight !== scrollHeight) {
+        this.refresh();
+      }
+
+      if (scrollTop >= maxScroll) {
+        var target = this._targets[this._targets.length - 1];
+
+        if (this._activeTarget !== target) {
+          this._activate(target);
+        }
+
+        return;
+      }
+
+      if (this._activeTarget && scrollTop < this._offsets[0] && this._offsets[0] > 0) {
+        this._activeTarget = null;
+
+        this._clear();
+
+        return;
+      }
+
+      var offsetLength = this._offsets.length;
+
+      for (var i = offsetLength; i--;) {
+        var isActiveTarget = this._activeTarget !== this._targets[i] && scrollTop >= this._offsets[i] && (typeof this._offsets[i + 1] === 'undefined' || scrollTop < this._offsets[i + 1]);
+
+        if (isActiveTarget) {
+          this._activate(this._targets[i]);
+        }
+      }
+    };
+
+    _proto._activate = function _activate(target) {
+      this._activeTarget = target;
+
+      this._clear();
+
+      var queries = this._selector.split(',').map(function (selector) {
+        return selector + "[data-target=\"" + target + "\"]," + selector + "[href=\"" + target + "\"]";
+      });
+
+      var $link = $([].slice.call(document.querySelectorAll(queries.join(','))));
+
+      if ($link.hasClass(ClassName.DROPDOWN_ITEM)) {
+        $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE);
+        $link.addClass(ClassName.ACTIVE);
+      } else {
+        // Set triggered link as active
+        $link.addClass(ClassName.ACTIVE); // Set triggered links parents as active
+        // With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor
+
+        $link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_LINKS + ", " + Selector.LIST_ITEMS).addClass(ClassName.ACTIVE); // Handle special case when .nav-link is inside .nav-item
+
+        $link.parents(Selector.NAV_LIST_GROUP).prev(Selector.NAV_ITEMS).children(Selector.NAV_LINKS).addClass(ClassName.ACTIVE);
+      }
+
+      $(this._scrollElement).trigger(Event.ACTIVATE, {
+        relatedTarget: target
+      });
+    };
+
+    _proto._clear = function _clear() {
+      [].slice.call(document.querySelectorAll(this._selector)).filter(function (node) {
+        return node.classList.contains(ClassName.ACTIVE);
+      }).forEach(function (node) {
+        return node.classList.remove(ClassName.ACTIVE);
+      });
+    } // Static
+    ;
+
+    ScrollSpy._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var data = $(this).data(DATA_KEY);
+
+        var _config = typeof config === 'object' && config;
+
+        if (!data) {
+          data = new ScrollSpy(this, _config);
+          $(this).data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(ScrollSpy, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return ScrollSpy;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(window).on(Event.LOAD_DATA_API, function () {
+    var scrollSpys = [].slice.call(document.querySelectorAll(Selector.DATA_SPY));
+    var scrollSpysLength = scrollSpys.length;
+
+    for (var i = scrollSpysLength; i--;) {
+      var $spy = $(scrollSpys[i]);
+
+      ScrollSpy._jQueryInterface.call($spy, $spy.data());
+    }
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = ScrollSpy._jQueryInterface;
+  $.fn[NAME].Constructor = ScrollSpy;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return ScrollSpy._jQueryInterface;
+  };
+
+  return ScrollSpy;
+
+}));
+/*!
+  * Bootstrap tab.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Tab = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'tab';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.tab';
+  var EVENT_KEY = "." + DATA_KEY;
+  var DATA_API_KEY = '.data-api';
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Event = {
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY,
+    CLICK_DATA_API: "click" + EVENT_KEY + DATA_API_KEY
+  };
+  var ClassName = {
+    DROPDOWN_MENU: 'dropdown-menu',
+    ACTIVE: 'active',
+    DISABLED: 'disabled',
+    FADE: 'fade',
+    SHOW: 'show'
+  };
+  var Selector = {
+    DROPDOWN: '.dropdown',
+    NAV_LIST_GROUP: '.nav, .list-group',
+    ACTIVE: '.active',
+    ACTIVE_UL: '> li > .active',
+    DATA_TOGGLE: '[data-toggle="tab"], [data-toggle="pill"], [data-toggle="list"]',
+    DROPDOWN_TOGGLE: '.dropdown-toggle',
+    DROPDOWN_ACTIVE_CHILD: '> .dropdown-menu .active'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Tab =
+  /*#__PURE__*/
+  function () {
+    function Tab(element) {
+      this._element = element;
+    } // Getters
+
+
+    var _proto = Tab.prototype;
+
+    // Public
+    _proto.show = function show() {
+      var _this = this;
+
+      if (this._element.parentNode && this._element.parentNode.nodeType === Node.ELEMENT_NODE && $(this._element).hasClass(ClassName.ACTIVE) || $(this._element).hasClass(ClassName.DISABLED)) {
+        return;
+      }
+
+      var target;
+      var previous;
+      var listElement = $(this._element).closest(Selector.NAV_LIST_GROUP)[0];
+      var selector = Util.getSelectorFromElement(this._element);
+
+      if (listElement) {
+        var itemSelector = listElement.nodeName === 'UL' || listElement.nodeName === 'OL' ? Selector.ACTIVE_UL : Selector.ACTIVE;
+        previous = $.makeArray($(listElement).find(itemSelector));
+        previous = previous[previous.length - 1];
+      }
+
+      var hideEvent = $.Event(Event.HIDE, {
+        relatedTarget: this._element
+      });
+      var showEvent = $.Event(Event.SHOW, {
+        relatedTarget: previous
+      });
+
+      if (previous) {
+        $(previous).trigger(hideEvent);
+      }
+
+      $(this._element).trigger(showEvent);
+
+      if (showEvent.isDefaultPrevented() || hideEvent.isDefaultPrevented()) {
+        return;
+      }
+
+      if (selector) {
+        target = document.querySelector(selector);
+      }
+
+      this._activate(this._element, listElement);
+
+      var complete = function complete() {
+        var hiddenEvent = $.Event(Event.HIDDEN, {
+          relatedTarget: _this._element
+        });
+        var shownEvent = $.Event(Event.SHOWN, {
+          relatedTarget: previous
+        });
+        $(previous).trigger(hiddenEvent);
+        $(_this._element).trigger(shownEvent);
+      };
+
+      if (target) {
+        this._activate(target, target.parentNode, complete);
+      } else {
+        complete();
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+    } // Private
+    ;
+
+    _proto._activate = function _activate(element, container, callback) {
+      var _this2 = this;
+
+      var activeElements = container && (container.nodeName === 'UL' || container.nodeName === 'OL') ? $(container).find(Selector.ACTIVE_UL) : $(container).children(Selector.ACTIVE);
+      var active = activeElements[0];
+      var isTransitioning = callback && active && $(active).hasClass(ClassName.FADE);
+
+      var complete = function complete() {
+        return _this2._transitionComplete(element, active, callback);
+      };
+
+      if (active && isTransitioning) {
+        var transitionDuration = Util.getTransitionDurationFromElement(active);
+        $(active).removeClass(ClassName.SHOW).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+    };
+
+    _proto._transitionComplete = function _transitionComplete(element, active, callback) {
+      if (active) {
+        $(active).removeClass(ClassName.ACTIVE);
+        var dropdownChild = $(active.parentNode).find(Selector.DROPDOWN_ACTIVE_CHILD)[0];
+
+        if (dropdownChild) {
+          $(dropdownChild).removeClass(ClassName.ACTIVE);
+        }
+
+        if (active.getAttribute('role') === 'tab') {
+          active.setAttribute('aria-selected', false);
+        }
+      }
+
+      $(element).addClass(ClassName.ACTIVE);
+
+      if (element.getAttribute('role') === 'tab') {
+        element.setAttribute('aria-selected', true);
+      }
+
+      Util.reflow(element);
+
+      if (element.classList.contains(ClassName.FADE)) {
+        element.classList.add(ClassName.SHOW);
+      }
+
+      if (element.parentNode && $(element.parentNode).hasClass(ClassName.DROPDOWN_MENU)) {
+        var dropdownElement = $(element).closest(Selector.DROPDOWN)[0];
+
+        if (dropdownElement) {
+          var dropdownToggleList = [].slice.call(dropdownElement.querySelectorAll(Selector.DROPDOWN_TOGGLE));
+          $(dropdownToggleList).addClass(ClassName.ACTIVE);
+        }
+
+        element.setAttribute('aria-expanded', true);
+      }
+
+      if (callback) {
+        callback();
+      }
+    } // Static
+    ;
+
+    Tab._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $this = $(this);
+        var data = $this.data(DATA_KEY);
+
+        if (!data) {
+          data = new Tab(this);
+          $this.data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config]();
+        }
+      });
+    };
+
+    _createClass(Tab, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }]);
+
+    return Tab;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * Data Api implementation
+   * ------------------------------------------------------------------------
+   */
+
+
+  $(document).on(Event.CLICK_DATA_API, Selector.DATA_TOGGLE, function (event) {
+    event.preventDefault();
+
+    Tab._jQueryInterface.call($(this), 'show');
+  });
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+  $.fn[NAME] = Tab._jQueryInterface;
+  $.fn[NAME].Constructor = Tab;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Tab._jQueryInterface;
+  };
+
+  return Tab;
+
+}));
+/*!
+  * Bootstrap toast.js v4.3.1 (https://getbootstrap.com/)
+  * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors)
+  * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+  */
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery'), require('./util.js')) :
+  typeof define === 'function' && define.amd ? define(['jquery', './util.js'], factory) :
+  (global = global || self, global.Toast = factory(global.jQuery, global.Util));
+}(this, function ($, Util) { 'use strict';
+
+  $ = $ && $.hasOwnProperty('default') ? $['default'] : $;
+  Util = Util && Util.hasOwnProperty('default') ? Util['default'] : Util;
+
+  function _defineProperties(target, props) {
+    for (var i = 0; i < props.length; i++) {
+      var descriptor = props[i];
+      descriptor.enumerable = descriptor.enumerable || false;
+      descriptor.configurable = true;
+      if ("value" in descriptor) descriptor.writable = true;
+      Object.defineProperty(target, descriptor.key, descriptor);
+    }
+  }
+
+  function _createClass(Constructor, protoProps, staticProps) {
+    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
+    if (staticProps) _defineProperties(Constructor, staticProps);
+    return Constructor;
+  }
+
+  function _defineProperty(obj, key, value) {
+    if (key in obj) {
+      Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+      });
+    } else {
+      obj[key] = value;
+    }
+
+    return obj;
+  }
+
+  function _objectSpread(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i] != null ? arguments[i] : {};
+      var ownKeys = Object.keys(source);
+
+      if (typeof Object.getOwnPropertySymbols === 'function') {
+        ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) {
+          return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+      }
+
+      ownKeys.forEach(function (key) {
+        _defineProperty(target, key, source[key]);
+      });
+    }
+
+    return target;
+  }
+
+  /**
+   * ------------------------------------------------------------------------
+   * Constants
+   * ------------------------------------------------------------------------
+   */
+
+  var NAME = 'toast';
+  var VERSION = '4.3.1';
+  var DATA_KEY = 'bs.toast';
+  var EVENT_KEY = "." + DATA_KEY;
+  var JQUERY_NO_CONFLICT = $.fn[NAME];
+  var Event = {
+    CLICK_DISMISS: "click.dismiss" + EVENT_KEY,
+    HIDE: "hide" + EVENT_KEY,
+    HIDDEN: "hidden" + EVENT_KEY,
+    SHOW: "show" + EVENT_KEY,
+    SHOWN: "shown" + EVENT_KEY
+  };
+  var ClassName = {
+    FADE: 'fade',
+    HIDE: 'hide',
+    SHOW: 'show',
+    SHOWING: 'showing'
+  };
+  var DefaultType = {
+    animation: 'boolean',
+    autohide: 'boolean',
+    delay: 'number'
+  };
+  var Default = {
+    animation: true,
+    autohide: true,
+    delay: 500
+  };
+  var Selector = {
+    DATA_DISMISS: '[data-dismiss="toast"]'
+    /**
+     * ------------------------------------------------------------------------
+     * Class Definition
+     * ------------------------------------------------------------------------
+     */
+
+  };
+
+  var Toast =
+  /*#__PURE__*/
+  function () {
+    function Toast(element, config) {
+      this._element = element;
+      this._config = this._getConfig(config);
+      this._timeout = null;
+
+      this._setListeners();
+    } // Getters
+
+
+    var _proto = Toast.prototype;
+
+    // Public
+    _proto.show = function show() {
+      var _this = this;
+
+      $(this._element).trigger(Event.SHOW);
+
+      if (this._config.animation) {
+        this._element.classList.add(ClassName.FADE);
+      }
+
+      var complete = function complete() {
+        _this._element.classList.remove(ClassName.SHOWING);
+
+        _this._element.classList.add(ClassName.SHOW);
+
+        $(_this._element).trigger(Event.SHOWN);
+
+        if (_this._config.autohide) {
+          _this.hide();
+        }
+      };
+
+      this._element.classList.remove(ClassName.HIDE);
+
+      this._element.classList.add(ClassName.SHOWING);
+
+      if (this._config.animation) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+        $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+    };
+
+    _proto.hide = function hide(withoutTimeout) {
+      var _this2 = this;
+
+      if (!this._element.classList.contains(ClassName.SHOW)) {
+        return;
+      }
+
+      $(this._element).trigger(Event.HIDE);
+
+      if (withoutTimeout) {
+        this._close();
+      } else {
+        this._timeout = setTimeout(function () {
+          _this2._close();
+        }, this._config.delay);
+      }
+    };
+
+    _proto.dispose = function dispose() {
+      clearTimeout(this._timeout);
+      this._timeout = null;
+
+      if (this._element.classList.contains(ClassName.SHOW)) {
+        this._element.classList.remove(ClassName.SHOW);
+      }
+
+      $(this._element).off(Event.CLICK_DISMISS);
+      $.removeData(this._element, DATA_KEY);
+      this._element = null;
+      this._config = null;
+    } // Private
+    ;
+
+    _proto._getConfig = function _getConfig(config) {
+      config = _objectSpread({}, Default, $(this._element).data(), typeof config === 'object' && config ? config : {});
+      Util.typeCheckConfig(NAME, config, this.constructor.DefaultType);
+      return config;
+    };
+
+    _proto._setListeners = function _setListeners() {
+      var _this3 = this;
+
+      $(this._element).on(Event.CLICK_DISMISS, Selector.DATA_DISMISS, function () {
+        return _this3.hide(true);
+      });
+    };
+
+    _proto._close = function _close() {
+      var _this4 = this;
+
+      var complete = function complete() {
+        _this4._element.classList.add(ClassName.HIDE);
+
+        $(_this4._element).trigger(Event.HIDDEN);
+      };
+
+      this._element.classList.remove(ClassName.SHOW);
+
+      if (this._config.animation) {
+        var transitionDuration = Util.getTransitionDurationFromElement(this._element);
+        $(this._element).one(Util.TRANSITION_END, complete).emulateTransitionEnd(transitionDuration);
+      } else {
+        complete();
+      }
+    } // Static
+    ;
+
+    Toast._jQueryInterface = function _jQueryInterface(config) {
+      return this.each(function () {
+        var $element = $(this);
+        var data = $element.data(DATA_KEY);
+
+        var _config = typeof config === 'object' && config;
+
+        if (!data) {
+          data = new Toast(this, _config);
+          $element.data(DATA_KEY, data);
+        }
+
+        if (typeof config === 'string') {
+          if (typeof data[config] === 'undefined') {
+            throw new TypeError("No method named \"" + config + "\"");
+          }
+
+          data[config](this);
+        }
+      });
+    };
+
+    _createClass(Toast, null, [{
+      key: "VERSION",
+      get: function get() {
+        return VERSION;
+      }
+    }, {
+      key: "DefaultType",
+      get: function get() {
+        return DefaultType;
+      }
+    }, {
+      key: "Default",
+      get: function get() {
+        return Default;
+      }
+    }]);
+
+    return Toast;
+  }();
+  /**
+   * ------------------------------------------------------------------------
+   * jQuery
+   * ------------------------------------------------------------------------
+   */
+
+
+  $.fn[NAME] = Toast._jQueryInterface;
+  $.fn[NAME].Constructor = Toast;
+
+  $.fn[NAME].noConflict = function () {
+    $.fn[NAME] = JQUERY_NO_CONFLICT;
+    return Toast._jQueryInterface;
+  };
+
+  return Toast;
+
+}));
+
+
+
+
+
+
+
+
+
+
+
+
+/*! jQuery Validation Plugin - v1.19.1 - 6/15/2019
+ * https://jqueryvalidation.org/
+ * Copyright (c) 2019 Jörn Zaefferer; Licensed MIT */
+
+!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof module&&module.exports?module.exports=a(require("jquery")):a(jQuery)}(function(a){a.extend(a.fn,{validate:function(b){if(!this.length)return void(b&&b.debug&&window.console&&console.warn("Nothing selected, can't validate, returning nothing."));var c=a.data(this[0],"validator");return c?c:(this.attr("novalidate","novalidate"),c=new a.validator(b,this[0]),a.data(this[0],"validator",c),c.settings.onsubmit&&(this.on("click.validate",":submit",function(b){c.submitButton=b.currentTarget,a(this).hasClass("cancel")&&(c.cancelSubmit=!0),void 0!==a(this).attr("formnovalidate")&&(c.cancelSubmit=!0)}),this.on("submit.validate",function(b){function d(){var d,e;return c.submitButton&&(c.settings.submitHandler||c.formSubmitted)&&(d=a("<input type='hidden'/>").attr("name",c.submitButton.name).val(a(c.submitButton).val()).appendTo(c.currentForm)),!(c.settings.submitHandler&&!c.settings.debug)||(e=c.settings.submitHandler.call(c,c.currentForm,b),d&&d.remove(),void 0!==e&&e)}return c.settings.debug&&b.preventDefault(),c.cancelSubmit?(c.cancelSubmit=!1,d()):c.form()?c.pendingRequest?(c.formSubmitted=!0,!1):d():(c.focusInvalid(),!1)})),c)},valid:function(){var b,c,d;return a(this[0]).is("form")?b=this.validate().form():(d=[],b=!0,c=a(this[0].form).validate(),this.each(function(){b=c.element(this)&&b,b||(d=d.concat(c.errorList))}),c.errorList=d),b},rules:function(b,c){var d,e,f,g,h,i,j=this[0],k="undefined"!=typeof this.attr("contenteditable")&&"false"!==this.attr("contenteditable");if(null!=j&&(!j.form&&k&&(j.form=this.closest("form")[0],j.name=this.attr("name")),null!=j.form)){if(b)switch(d=a.data(j.form,"validator").settings,e=d.rules,f=a.validator.staticRules(j),b){case"add":a.extend(f,a.validator.normalizeRule(c)),delete f.messages,e[j.name]=f,c.messages&&(d.messages[j.name]=a.extend(d.messages[j.name],c.messages));break;case"remove":return c?(i={},a.each(c.split(/\s/),function(a,b){i[b]=f[b],delete f[b]}),i):(delete e[j.name],f)}return g=a.validator.normalizeRules(a.extend({},a.validator.classRules(j),a.validator.attributeRules(j),a.validator.dataRules(j),a.validator.staticRules(j)),j),g.required&&(h=g.required,delete g.required,g=a.extend({required:h},g)),g.remote&&(h=g.remote,delete g.remote,g=a.extend(g,{remote:h})),g}}}),a.extend(a.expr.pseudos||a.expr[":"],{blank:function(b){return!a.trim(""+a(b).val())},filled:function(b){var c=a(b).val();return null!==c&&!!a.trim(""+c)},unchecked:function(b){return!a(b).prop("checked")}}),a.validator=function(b,c){this.settings=a.extend(!0,{},a.validator.defaults,b),this.currentForm=c,this.init()},a.validator.format=function(b,c){return 1===arguments.length?function(){var c=a.makeArray(arguments);return c.unshift(b),a.validator.format.apply(this,c)}:void 0===c?b:(arguments.length>2&&c.constructor!==Array&&(c=a.makeArray(arguments).slice(1)),c.constructor!==Array&&(c=[c]),a.each(c,function(a,c){b=b.replace(new RegExp("\\{"+a+"\\}","g"),function(){return c})}),b)},a.extend(a.validator,{defaults:{messages:{},groups:{},rules:{},errorClass:"error",pendingClass:"pending",validClass:"valid",errorElement:"label",focusCleanup:!1,focusInvalid:!0,errorContainer:a([]),errorLabelContainer:a([]),onsubmit:!0,ignore:":hidden",ignoreTitle:!1,onfocusin:function(a){this.lastActive=a,this.settings.focusCleanup&&(this.settings.unhighlight&&this.settings.unhighlight.call(this,a,this.settings.errorClass,this.settings.validClass),this.hideThese(this.errorsFor(a)))},onfocusout:function(a){this.checkable(a)||!(a.name in this.submitted)&&this.optional(a)||this.element(a)},onkeyup:function(b,c){var d=[16,17,18,20,35,36,37,38,39,40,45,144,225];9===c.which&&""===this.elementValue(b)||a.inArray(c.keyCode,d)!==-1||(b.name in this.submitted||b.name in this.invalid)&&this.element(b)},onclick:function(a){a.name in this.submitted?this.element(a):a.parentNode.name in this.submitted&&this.element(a.parentNode)},highlight:function(b,c,d){"radio"===b.type?this.findByName(b.name).addClass(c).removeClass(d):a(b).addClass(c).removeClass(d)},unhighlight:function(b,c,d){"radio"===b.type?this.findByName(b.name).removeClass(c).addClass(d):a(b).removeClass(c).addClass(d)}},setDefaults:function(b){a.extend(a.validator.defaults,b)},messages:{required:"This field is required.",remote:"Please fix this field.",email:"Please enter a valid email address.",url:"Please enter a valid URL.",date:"Please enter a valid date.",dateISO:"Please enter a valid date (ISO).",number:"Please enter a valid number.",digits:"Please enter only digits.",equalTo:"Please enter the same value again.",maxlength:a.validator.format("Please enter no more than {0} characters."),minlength:a.validator.format("Please enter at least {0} characters."),rangelength:a.validator.format("Please enter a value between {0} and {1} characters long."),range:a.validator.format("Please enter a value between {0} and {1}."),max:a.validator.format("Please enter a value less than or equal to {0}."),min:a.validator.format("Please enter a value greater than or equal to {0}."),step:a.validator.format("Please enter a multiple of {0}.")},autoCreateRanges:!1,prototype:{init:function(){function b(b){var c="undefined"!=typeof a(this).attr("contenteditable")&&"false"!==a(this).attr("contenteditable");if(!this.form&&c&&(this.form=a(this).closest("form")[0],this.name=a(this).attr("name")),d===this.form){var e=a.data(this.form,"validator"),f="on"+b.type.replace(/^validate/,""),g=e.settings;g[f]&&!a(this).is(g.ignore)&&g[f].call(e,this,b)}}this.labelContainer=a(this.settings.errorLabelContainer),this.errorContext=this.labelContainer.length&&this.labelContainer||a(this.currentForm),this.containers=a(this.settings.errorContainer).add(this.settings.errorLabelContainer),this.submitted={},this.valueCache={},this.pendingRequest=0,this.pending={},this.invalid={},this.reset();var c,d=this.currentForm,e=this.groups={};a.each(this.settings.groups,function(b,c){"string"==typeof c&&(c=c.split(/\s/)),a.each(c,function(a,c){e[c]=b})}),c=this.settings.rules,a.each(c,function(b,d){c[b]=a.validator.normalizeRule(d)}),a(this.currentForm).on("focusin.validate focusout.validate keyup.validate",":text, [type='password'], [type='file'], select, textarea, [type='number'], [type='search'], [type='tel'], [type='url'], [type='email'], [type='datetime'], [type='date'], [type='month'], [type='week'], [type='time'], [type='datetime-local'], [type='range'], [type='color'], [type='radio'], [type='checkbox'], [contenteditable], [type='button']",b).on("click.validate","select, option, [type='radio'], [type='checkbox']",b),this.settings.invalidHandler&&a(this.currentForm).on("invalid-form.validate",this.settings.invalidHandler)},form:function(){return this.checkForm(),a.extend(this.submitted,this.errorMap),this.invalid=a.extend({},this.errorMap),this.valid()||a(this.currentForm).triggerHandler("invalid-form",[this]),this.showErrors(),this.valid()},checkForm:function(){this.prepareForm();for(var a=0,b=this.currentElements=this.elements();b[a];a++)this.check(b[a]);return this.valid()},element:function(b){var c,d,e=this.clean(b),f=this.validationTargetFor(e),g=this,h=!0;return void 0===f?delete this.invalid[e.name]:(this.prepareElement(f),this.currentElements=a(f),d=this.groups[f.name],d&&a.each(this.groups,function(a,b){b===d&&a!==f.name&&(e=g.validationTargetFor(g.clean(g.findByName(a))),e&&e.name in g.invalid&&(g.currentElements.push(e),h=g.check(e)&&h))}),c=this.check(f)!==!1,h=h&&c,c?this.invalid[f.name]=!1:this.invalid[f.name]=!0,this.numberOfInvalids()||(this.toHide=this.toHide.add(this.containers)),this.showErrors(),a(b).attr("aria-invalid",!c)),h},showErrors:function(b){if(b){var c=this;a.extend(this.errorMap,b),this.errorList=a.map(this.errorMap,function(a,b){return{message:a,element:c.findByName(b)[0]}}),this.successList=a.grep(this.successList,function(a){return!(a.name in b)})}this.settings.showErrors?this.settings.showErrors.call(this,this.errorMap,this.errorList):this.defaultShowErrors()},resetForm:function(){a.fn.resetForm&&a(this.currentForm).resetForm(),this.invalid={},this.submitted={},this.prepareForm(),this.hideErrors();var b=this.elements().removeData("previousValue").removeAttr("aria-invalid");this.resetElements(b)},resetElements:function(a){var b;if(this.settings.unhighlight)for(b=0;a[b];b++)this.settings.unhighlight.call(this,a[b],this.settings.errorClass,""),this.findByName(a[b].name).removeClass(this.settings.validClass);else a.removeClass(this.settings.errorClass).removeClass(this.settings.validClass)},numberOfInvalids:function(){return this.objectLength(this.invalid)},objectLength:function(a){var b,c=0;for(b in a)void 0!==a[b]&&null!==a[b]&&a[b]!==!1&&c++;return c},hideErrors:function(){this.hideThese(this.toHide)},hideThese:function(a){a.not(this.containers).text(""),this.addWrapper(a).hide()},valid:function(){return 0===this.size()},size:function(){return this.errorList.length},focusInvalid:function(){if(this.settings.focusInvalid)try{a(this.findLastActive()||this.errorList.length&&this.errorList[0].element||[]).filter(":visible").trigger("focus").trigger("focusin")}catch(b){}},findLastActive:function(){var b=this.lastActive;return b&&1===a.grep(this.errorList,function(a){return a.element.name===b.name}).length&&b},elements:function(){var b=this,c={};return a(this.currentForm).find("input, select, textarea, [contenteditable]").not(":submit, :reset, :image, :disabled").not(this.settings.ignore).filter(function(){var d=this.name||a(this).attr("name"),e="undefined"!=typeof a(this).attr("contenteditable")&&"false"!==a(this).attr("contenteditable");return!d&&b.settings.debug&&window.console&&console.error("%o has no name assigned",this),e&&(this.form=a(this).closest("form")[0],this.name=d),this.form===b.currentForm&&(!(d in c||!b.objectLength(a(this).rules()))&&(c[d]=!0,!0))})},clean:function(b){return a(b)[0]},errors:function(){var b=this.settings.errorClass.split(" ").join(".");return a(this.settings.errorElement+"."+b,this.errorContext)},resetInternals:function(){this.successList=[],this.errorList=[],this.errorMap={},this.toShow=a([]),this.toHide=a([])},reset:function(){this.resetInternals(),this.currentElements=a([])},prepareForm:function(){this.reset(),this.toHide=this.errors().add(this.containers)},prepareElement:function(a){this.reset(),this.toHide=this.errorsFor(a)},elementValue:function(b){var c,d,e=a(b),f=b.type,g="undefined"!=typeof e.attr("contenteditable")&&"false"!==e.attr("contenteditable");return"radio"===f||"checkbox"===f?this.findByName(b.name).filter(":checked").val():"number"===f&&"undefined"!=typeof b.validity?b.validity.badInput?"NaN":e.val():(c=g?e.text():e.val(),"file"===f?"C:\\fakepath\\"===c.substr(0,12)?c.substr(12):(d=c.lastIndexOf("/"),d>=0?c.substr(d+1):(d=c.lastIndexOf("\\"),d>=0?c.substr(d+1):c)):"string"==typeof c?c.replace(/\r/g,""):c)},check:function(b){b=this.validationTargetFor(this.clean(b));var c,d,e,f,g=a(b).rules(),h=a.map(g,function(a,b){return b}).length,i=!1,j=this.elementValue(b);"function"==typeof g.normalizer?f=g.normalizer:"function"==typeof this.settings.normalizer&&(f=this.settings.normalizer),f&&(j=f.call(b,j),delete g.normalizer);for(d in g){e={method:d,parameters:g[d]};try{if(c=a.validator.methods[d].call(this,j,b,e.parameters),"dependency-mismatch"===c&&1===h){i=!0;continue}if(i=!1,"pending"===c)return void(this.toHide=this.toHide.not(this.errorsFor(b)));if(!c)return this.formatAndAdd(b,e),!1}catch(k){throw this.settings.debug&&window.console&&console.log("Exception occurred when checking element "+b.id+", check the '"+e.method+"' method.",k),k instanceof TypeError&&(k.message+=".  Exception occurred when checking element "+b.id+", check the '"+e.method+"' method."),k}}if(!i)return this.objectLength(g)&&this.successList.push(b),!0},customDataMessage:function(b,c){return a(b).data("msg"+c.charAt(0).toUpperCase()+c.substring(1).toLowerCase())||a(b).data("msg")},customMessage:function(a,b){var c=this.settings.messages[a];return c&&(c.constructor===String?c:c[b])},findDefined:function(){for(var a=0;a<arguments.length;a++)if(void 0!==arguments[a])return arguments[a]},defaultMessage:function(b,c){"string"==typeof c&&(c={method:c});var d=this.findDefined(this.customMessage(b.name,c.method),this.customDataMessage(b,c.method),!this.settings.ignoreTitle&&b.title||void 0,a.validator.messages[c.method],"<strong>Warning: No message defined for "+b.name+"</strong>"),e=/\$?\{(\d+)\}/g;return"function"==typeof d?d=d.call(this,c.parameters,b):e.test(d)&&(d=a.validator.format(d.replace(e,"{$1}"),c.parameters)),d},formatAndAdd:function(a,b){var c=this.defaultMessage(a,b);this.errorList.push({message:c,element:a,method:b.method}),this.errorMap[a.name]=c,this.submitted[a.name]=c},addWrapper:function(a){return this.settings.wrapper&&(a=a.add(a.parent(this.settings.wrapper))),a},defaultShowErrors:function(){var a,b,c;for(a=0;this.errorList[a];a++)c=this.errorList[a],this.settings.highlight&&this.settings.highlight.call(this,c.element,this.settings.errorClass,this.settings.validClass),this.showLabel(c.element,c.message);if(this.errorList.length&&(this.toShow=this.toShow.add(this.containers)),this.settings.success)for(a=0;this.successList[a];a++)this.showLabel(this.successList[a]);if(this.settings.unhighlight)for(a=0,b=this.validElements();b[a];a++)this.settings.unhighlight.call(this,b[a],this.settings.errorClass,this.settings.validClass);this.toHide=this.toHide.not(this.toShow),this.hideErrors(),this.addWrapper(this.toShow).show()},validElements:function(){return this.currentElements.not(this.invalidElements())},invalidElements:function(){return a(this.errorList).map(function(){return this.element})},showLabel:function(b,c){var d,e,f,g,h=this.errorsFor(b),i=this.idOrName(b),j=a(b).attr("aria-describedby");h.length?(h.removeClass(this.settings.validClass).addClass(this.settings.errorClass),h.html(c)):(h=a("<"+this.settings.errorElement+">").attr("id",i+"-error").addClass(this.settings.errorClass).html(c||""),d=h,this.settings.wrapper&&(d=h.hide().show().wrap("<"+this.settings.wrapper+"/>").parent()),this.labelContainer.length?this.labelContainer.append(d):this.settings.errorPlacement?this.settings.errorPlacement.call(this,d,a(b)):d.insertAfter(b),h.is("label")?h.attr("for",i):0===h.parents("label[for='"+this.escapeCssMeta(i)+"']").length&&(f=h.attr("id"),j?j.match(new RegExp("\\b"+this.escapeCssMeta(f)+"\\b"))||(j+=" "+f):j=f,a(b).attr("aria-describedby",j),e=this.groups[b.name],e&&(g=this,a.each(g.groups,function(b,c){c===e&&a("[name='"+g.escapeCssMeta(b)+"']",g.currentForm).attr("aria-describedby",h.attr("id"))})))),!c&&this.settings.success&&(h.text(""),"string"==typeof this.settings.success?h.addClass(this.settings.success):this.settings.success(h,b)),this.toShow=this.toShow.add(h)},errorsFor:function(b){var c=this.escapeCssMeta(this.idOrName(b)),d=a(b).attr("aria-describedby"),e="label[for='"+c+"'], label[for='"+c+"'] *";return d&&(e=e+", #"+this.escapeCssMeta(d).replace(/\s+/g,", #")),this.errors().filter(e)},escapeCssMeta:function(a){return a.replace(/([\\!"#$%&'()*+,.\/:;<=>?@\[\]^`{|}~])/g,"\\$1")},idOrName:function(a){return this.groups[a.name]||(this.checkable(a)?a.name:a.id||a.name)},validationTargetFor:function(b){return this.checkable(b)&&(b=this.findByName(b.name)),a(b).not(this.settings.ignore)[0]},checkable:function(a){return/radio|checkbox/i.test(a.type)},findByName:function(b){return a(this.currentForm).find("[name='"+this.escapeCssMeta(b)+"']")},getLength:function(b,c){switch(c.nodeName.toLowerCase()){case"select":return a("option:selected",c).length;case"input":if(this.checkable(c))return this.findByName(c.name).filter(":checked").length}return b.length},depend:function(a,b){return!this.dependTypes[typeof a]||this.dependTypes[typeof a](a,b)},dependTypes:{"boolean":function(a){return a},string:function(b,c){return!!a(b,c.form).length},"function":function(a,b){return a(b)}},optional:function(b){var c=this.elementValue(b);return!a.validator.methods.required.call(this,c,b)&&"dependency-mismatch"},startRequest:function(b){this.pending[b.name]||(this.pendingRequest++,a(b).addClass(this.settings.pendingClass),this.pending[b.name]=!0)},stopRequest:function(b,c){this.pendingRequest--,this.pendingRequest<0&&(this.pendingRequest=0),delete this.pending[b.name],a(b).removeClass(this.settings.pendingClass),c&&0===this.pendingRequest&&this.formSubmitted&&this.form()?(a(this.currentForm).submit(),this.submitButton&&a("input:hidden[name='"+this.submitButton.name+"']",this.currentForm).remove(),this.formSubmitted=!1):!c&&0===this.pendingRequest&&this.formSubmitted&&(a(this.currentForm).triggerHandler("invalid-form",[this]),this.formSubmitted=!1)},previousValue:function(b,c){return c="string"==typeof c&&c||"remote",a.data(b,"previousValue")||a.data(b,"previousValue",{old:null,valid:!0,message:this.defaultMessage(b,{method:c})})},destroy:function(){this.resetForm(),a(this.currentForm).off(".validate").removeData("validator").find(".validate-equalTo-blur").off(".validate-equalTo").removeClass("validate-equalTo-blur").find(".validate-lessThan-blur").off(".validate-lessThan").removeClass("validate-lessThan-blur").find(".validate-lessThanEqual-blur").off(".validate-lessThanEqual").removeClass("validate-lessThanEqual-blur").find(".validate-greaterThanEqual-blur").off(".validate-greaterThanEqual").removeClass("validate-greaterThanEqual-blur").find(".validate-greaterThan-blur").off(".validate-greaterThan").removeClass("validate-greaterThan-blur")}},classRuleSettings:{required:{required:!0},email:{email:!0},url:{url:!0},date:{date:!0},dateISO:{dateISO:!0},number:{number:!0},digits:{digits:!0},creditcard:{creditcard:!0}},addClassRules:function(b,c){b.constructor===String?this.classRuleSettings[b]=c:a.extend(this.classRuleSettings,b)},classRules:function(b){var c={},d=a(b).attr("class");return d&&a.each(d.split(" "),function(){this in a.validator.classRuleSettings&&a.extend(c,a.validator.classRuleSettings[this])}),c},normalizeAttributeRule:function(a,b,c,d){/min|max|step/.test(c)&&(null===b||/number|range|text/.test(b))&&(d=Number(d),isNaN(d)&&(d=void 0)),d||0===d?a[c]=d:b===c&&"range"!==b&&(a[c]=!0)},attributeRules:function(b){var c,d,e={},f=a(b),g=b.getAttribute("type");for(c in a.validator.methods)"required"===c?(d=b.getAttribute(c),""===d&&(d=!0),d=!!d):d=f.attr(c),this.normalizeAttributeRule(e,g,c,d);return e.maxlength&&/-1|2147483647|524288/.test(e.maxlength)&&delete e.maxlength,e},dataRules:function(b){var c,d,e={},f=a(b),g=b.getAttribute("type");for(c in a.validator.methods)d=f.data("rule"+c.charAt(0).toUpperCase()+c.substring(1).toLowerCase()),""===d&&(d=!0),this.normalizeAttributeRule(e,g,c,d);return e},staticRules:function(b){var c={},d=a.data(b.form,"validator");return d.settings.rules&&(c=a.validator.normalizeRule(d.settings.rules[b.name])||{}),c},normalizeRules:function(b,c){return a.each(b,function(d,e){if(e===!1)return void delete b[d];if(e.param||e.depends){var f=!0;switch(typeof e.depends){case"string":f=!!a(e.depends,c.form).length;break;case"function":f=e.depends.call(c,c)}f?b[d]=void 0===e.param||e.param:(a.data(c.form,"validator").resetElements(a(c)),delete b[d])}}),a.each(b,function(d,e){b[d]=a.isFunction(e)&&"normalizer"!==d?e(c):e}),a.each(["minlength","maxlength"],function(){b[this]&&(b[this]=Number(b[this]))}),a.each(["rangelength","range"],function(){var c;b[this]&&(a.isArray(b[this])?b[this]=[Number(b[this][0]),Number(b[this][1])]:"string"==typeof b[this]&&(c=b[this].replace(/[\[\]]/g,"").split(/[\s,]+/),b[this]=[Number(c[0]),Number(c[1])]))}),a.validator.autoCreateRanges&&(null!=b.min&&null!=b.max&&(b.range=[b.min,b.max],delete b.min,delete b.max),null!=b.minlength&&null!=b.maxlength&&(b.rangelength=[b.minlength,b.maxlength],delete b.minlength,delete b.maxlength)),b},normalizeRule:function(b){if("string"==typeof b){var c={};a.each(b.split(/\s/),function(){c[this]=!0}),b=c}return b},addMethod:function(b,c,d){a.validator.methods[b]=c,a.validator.messages[b]=void 0!==d?d:a.validator.messages[b],c.length<3&&a.validator.addClassRules(b,a.validator.normalizeRule(b))},methods:{required:function(b,c,d){if(!this.depend(d,c))return"dependency-mismatch";if("select"===c.nodeName.toLowerCase()){var e=a(c).val();return e&&e.length>0}return this.checkable(c)?this.getLength(b,c)>0:void 0!==b&&null!==b&&b.length>0},email:function(a,b){return this.optional(b)||/^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/.test(a)},url:function(a,b){return this.optional(b)||/^(?:(?:(?:https?|ftp):)?\/\/)(?:\S+(?::\S*)?@)?(?:(?!(?:10|127)(?:\.\d{1,3}){3})(?!(?:169\.254|192\.168)(?:\.\d{1,3}){2})(?!172\.(?:1[6-9]|2\d|3[0-1])(?:\.\d{1,3}){2})(?:[1-9]\d?|1\d\d|2[01]\d|22[0-3])(?:\.(?:1?\d{1,2}|2[0-4]\d|25[0-5])){2}(?:\.(?:[1-9]\d?|1\d\d|2[0-4]\d|25[0-4]))|(?:(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)(?:\.(?:[a-z\u00a1-\uffff0-9]-*)*[a-z\u00a1-\uffff0-9]+)*(?:\.(?:[a-z\u00a1-\uffff]{2,})).?)(?::\d{2,5})?(?:[\/?#]\S*)?$/i.test(a)},date:function(){var a=!1;return function(b,c){return a||(a=!0,this.settings.debug&&window.console&&console.warn("The `date` method is deprecated and will be removed in version '2.0.0'.\nPlease don't use it, since it relies on the Date constructor, which\nbehaves very differently across browsers and locales. Use `dateISO`\ninstead or one of the locale specific methods in `localizations/`\nand `additional-methods.js`.")),this.optional(c)||!/Invalid|NaN/.test(new Date(b).toString())}}(),dateISO:function(a,b){return this.optional(b)||/^\d{4}[\/\-](0?[1-9]|1[012])[\/\-](0?[1-9]|[12][0-9]|3[01])$/.test(a)},number:function(a,b){return this.optional(b)||/^(?:-?\d+|-?\d{1,3}(?:,\d{3})+)?(?:\.\d+)?$/.test(a)},digits:function(a,b){return this.optional(b)||/^\d+$/.test(a)},minlength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e>=d},maxlength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e<=d},rangelength:function(b,c,d){var e=a.isArray(b)?b.length:this.getLength(b,c);return this.optional(c)||e>=d[0]&&e<=d[1]},min:function(a,b,c){return this.optional(b)||a>=c},max:function(a,b,c){return this.optional(b)||a<=c},range:function(a,b,c){return this.optional(b)||a>=c[0]&&a<=c[1]},step:function(b,c,d){var e,f=a(c).attr("type"),g="Step attribute on input type "+f+" is not supported.",h=["text","number","range"],i=new RegExp("\\b"+f+"\\b"),j=f&&!i.test(h.join()),k=function(a){var b=(""+a).match(/(?:\.(\d+))?$/);return b&&b[1]?b[1].length:0},l=function(a){return Math.round(a*Math.pow(10,e))},m=!0;if(j)throw new Error(g);return e=k(d),(k(b)>e||l(b)%l(d)!==0)&&(m=!1),this.optional(c)||m},equalTo:function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-equalTo-blur").length&&e.addClass("validate-equalTo-blur").on("blur.validate-equalTo",function(){a(c).valid()}),b===e.val()},remote:function(b,c,d,e){if(this.optional(c))return"dependency-mismatch";e="string"==typeof e&&e||"remote";var f,g,h,i=this.previousValue(c,e);return this.settings.messages[c.name]||(this.settings.messages[c.name]={}),i.originalMessage=i.originalMessage||this.settings.messages[c.name][e],this.settings.messages[c.name][e]=i.message,d="string"==typeof d&&{url:d}||d,h=a.param(a.extend({data:b},d.data)),i.old===h?i.valid:(i.old=h,f=this,this.startRequest(c),g={},g[c.name]=b,a.ajax(a.extend(!0,{mode:"abort",port:"validate"+c.name,dataType:"json",data:g,context:f.currentForm,success:function(a){var d,g,h,j=a===!0||"true"===a;f.settings.messages[c.name][e]=i.originalMessage,j?(h=f.formSubmitted,f.resetInternals(),f.toHide=f.errorsFor(c),f.formSubmitted=h,f.successList.push(c),f.invalid[c.name]=!1,f.showErrors()):(d={},g=a||f.defaultMessage(c,{method:e,parameters:b}),d[c.name]=i.message=g,f.invalid[c.name]=!0,f.showErrors(d)),i.valid=j,f.stopRequest(c,j)}},d)),"pending")}}});var b,c={};return a.ajaxPrefilter?a.ajaxPrefilter(function(a,b,d){var e=a.port;"abort"===a.mode&&(c[e]&&c[e].abort(),c[e]=d)}):(b=a.ajax,a.ajax=function(d){var e=("mode"in d?d:a.ajaxSettings).mode,f=("port"in d?d:a.ajaxSettings).port;return"abort"===e?(c[f]&&c[f].abort(),c[f]=b.apply(this,arguments),c[f]):b.apply(this,arguments)}),a});
+/*! jQuery Validation Plugin - v1.19.1 - 6/15/2019
+ * https://jqueryvalidation.org/
+ * Copyright (c) 2019 Jörn Zaefferer; Licensed MIT */
+
+!function(a){"function"==typeof define&&define.amd?define(["jquery","./jquery.validate.min"],a):"object"==typeof module&&module.exports?module.exports=a(require("jquery")):a(jQuery)}(function(a){return function(){function b(a){return a.replace(/<.[^<>]*?>/g," ").replace(/&nbsp;|&#160;/gi," ").replace(/[.(),;:!?%#$'\"_+=\/\-“”’]*/g,"")}a.validator.addMethod("maxWords",function(a,c,d){return this.optional(c)||b(a).match(/\b\w+\b/g).length<=d},a.validator.format("Please enter {0} words or less.")),a.validator.addMethod("minWords",function(a,c,d){return this.optional(c)||b(a).match(/\b\w+\b/g).length>=d},a.validator.format("Please enter at least {0} words.")),a.validator.addMethod("rangeWords",function(a,c,d){var e=b(a),f=/\b\w+\b/g;return this.optional(c)||e.match(f).length>=d[0]&&e.match(f).length<=d[1]},a.validator.format("Please enter between {0} and {1} words."))}(),a.validator.addMethod("abaRoutingNumber",function(a){var b=0,c=a.split(""),d=c.length;if(9!==d)return!1;for(var e=0;e<d;e+=3)b+=3*parseInt(c[e],10)+7*parseInt(c[e+1],10)+parseInt(c[e+2],10);return 0!==b&&b%10===0},"Please enter a valid routing number."),a.validator.addMethod("accept",function(b,c,d){var e,f,g,h="string"==typeof d?d.replace(/\s/g,""):"image/*",i=this.optional(c);if(i)return i;if("file"===a(c).attr("type")&&(h=h.replace(/[\-\[\]\/\{\}\(\)\+\?\.\\\^\$\|]/g,"\\$&").replace(/,/g,"|").replace(/\/\*/g,"/.*"),c.files&&c.files.length))for(g=new RegExp(".?("+h+")$","i"),e=0;e<c.files.length;e++)if(f=c.files[e],!f.type.match(g))return!1;return!0},a.validator.format("Please enter a value with a valid mimetype.")),a.validator.addMethod("alphanumeric",function(a,b){return this.optional(b)||/^\w+$/i.test(a)},"Letters, numbers, and underscores only please"),a.validator.addMethod("bankaccountNL",function(a,b){if(this.optional(b))return!0;if(!/^[0-9]{9}|([0-9]{2} ){3}[0-9]{3}$/.test(a))return!1;var c,d,e,f=a.replace(/ /g,""),g=0,h=f.length;for(c=0;c<h;c++)d=h-c,e=f.substring(c,c+1),g+=d*e;return g%11===0},"Please specify a valid bank account number"),a.validator.addMethod("bankorgiroaccountNL",function(b,c){return this.optional(c)||a.validator.methods.bankaccountNL.call(this,b,c)||a.validator.methods.giroaccountNL.call(this,b,c)},"Please specify a valid bank or giro account number"),a.validator.addMethod("bic",function(a,b){return this.optional(b)||/^([A-Z]{6}[A-Z2-9][A-NP-Z1-9])(X{3}|[A-WY-Z0-9][A-Z0-9]{2})?$/.test(a.toUpperCase())},"Please specify a valid BIC code"),a.validator.addMethod("cifES",function(a,b){"use strict";function c(a){return a%2===0}if(this.optional(b))return!0;var d,e,f,g,h=new RegExp(/^([ABCDEFGHJKLMNPQRSUVW])(\d{7})([0-9A-J])$/gi),i=a.substring(0,1),j=a.substring(1,8),k=a.substring(8,9),l=0,m=0,n=0;if(9!==a.length||!h.test(a))return!1;for(d=0;d<j.length;d++)e=parseInt(j[d],10),c(d)?(e*=2,n+=e<10?e:e-9):m+=e;return l=m+n,f=(10-l.toString().substr(-1)).toString(),f=parseInt(f,10)>9?"0":f,g="JABCDEFGHI".substr(f,1).toString(),i.match(/[ABEH]/)?k===f:i.match(/[KPQS]/)?k===g:k===f||k===g},"Please specify a valid CIF number."),a.validator.addMethod("cnhBR",function(a){if(a=a.replace(/([~!@#$%^&*()_+=`{}\[\]\-|\\:;'<>,.\/? ])+/g,""),11!==a.length)return!1;var b,c,d,e,f,g,h=0,i=0;if(b=a.charAt(0),new Array(12).join(b)===a)return!1;for(e=0,f=9,g=0;e<9;++e,--f)h+=+(a.charAt(e)*f);for(c=h%11,c>=10&&(c=0,i=2),h=0,e=0,f=1,g=0;e<9;++e,++f)h+=+(a.charAt(e)*f);return d=h%11,d>=10?d=0:d-=i,String(c).concat(d)===a.substr(-2)},"Please specify a valid CNH number"),a.validator.addMethod("cnpjBR",function(a,b){"use strict";if(this.optional(b))return!0;if(a=a.replace(/[^\d]+/g,""),14!==a.length)return!1;if("00000000000000"===a||"11111111111111"===a||"22222222222222"===a||"33333333333333"===a||"44444444444444"===a||"55555555555555"===a||"66666666666666"===a||"77777777777777"===a||"88888888888888"===a||"99999999999999"===a)return!1;for(var c=a.length-2,d=a.substring(0,c),e=a.substring(c),f=0,g=c-7,h=c;h>=1;h--)f+=d.charAt(c-h)*g--,g<2&&(g=9);var i=f%11<2?0:11-f%11;if(i!==parseInt(e.charAt(0),10))return!1;c+=1,d=a.substring(0,c),f=0,g=c-7;for(var j=c;j>=1;j--)f+=d.charAt(c-j)*g--,g<2&&(g=9);return i=f%11<2?0:11-f%11,i===parseInt(e.charAt(1),10)},"Please specify a CNPJ value number"),a.validator.addMethod("cpfBR",function(a,b){"use strict";if(this.optional(b))return!0;if(a=a.replace(/([~!@#$%^&*()_+=`{}\[\]\-|\\:;'<>,.\/? ])+/g,""),11!==a.length)return!1;var c,d,e,f,g=0;if(c=parseInt(a.substring(9,10),10),d=parseInt(a.substring(10,11),10),e=function(a,b){var c=10*a%11;return 10!==c&&11!==c||(c=0),c===b},""===a||"00000000000"===a||"11111111111"===a||"22222222222"===a||"33333333333"===a||"44444444444"===a||"55555555555"===a||"66666666666"===a||"77777777777"===a||"88888888888"===a||"99999999999"===a)return!1;for(f=1;f<=9;f++)g+=parseInt(a.substring(f-1,f),10)*(11-f);if(e(g,c)){for(g=0,f=1;f<=10;f++)g+=parseInt(a.substring(f-1,f),10)*(12-f);return e(g,d)}return!1},"Please specify a valid CPF number"),a.validator.addMethod("creditcard",function(a,b){if(this.optional(b))return"dependency-mismatch";if(/[^0-9 \-]+/.test(a))return!1;var c,d,e=0,f=0,g=!1;if(a=a.replace(/\D/g,""),a.length<13||a.length>19)return!1;for(c=a.length-1;c>=0;c--)d=a.charAt(c),f=parseInt(d,10),g&&(f*=2)>9&&(f-=9),e+=f,g=!g;return e%10===0},"Please enter a valid credit card number."),a.validator.addMethod("creditcardtypes",function(a,b,c){if(/[^0-9\-]+/.test(a))return!1;a=a.replace(/\D/g,"");var d=0;return c.mastercard&&(d|=1),c.visa&&(d|=2),c.amex&&(d|=4),c.dinersclub&&(d|=8),c.enroute&&(d|=16),c.discover&&(d|=32),c.jcb&&(d|=64),c.unknown&&(d|=128),c.all&&(d=255),1&d&&(/^(5[12345])/.test(a)||/^(2[234567])/.test(a))?16===a.length:2&d&&/^(4)/.test(a)?16===a.length:4&d&&/^(3[47])/.test(a)?15===a.length:8&d&&/^(3(0[012345]|[68]))/.test(a)?14===a.length:16&d&&/^(2(014|149))/.test(a)?15===a.length:32&d&&/^(6011)/.test(a)?16===a.length:64&d&&/^(3)/.test(a)?16===a.length:64&d&&/^(2131|1800)/.test(a)?15===a.length:!!(128&d)},"Please enter a valid credit card number."),a.validator.addMethod("currency",function(a,b,c){var d,e="string"==typeof c,f=e?c:c[0],g=!!e||c[1];return f=f.replace(/,/g,""),f=g?f+"]":f+"]?",d="^["+f+"([1-9]{1}[0-9]{0,2}(\\,[0-9]{3})*(\\.[0-9]{0,2})?|[1-9]{1}[0-9]{0,}(\\.[0-9]{0,2})?|0(\\.[0-9]{0,2})?|(\\.[0-9]{1,2})?)$",d=new RegExp(d),this.optional(b)||d.test(a)},"Please specify a valid currency"),a.validator.addMethod("dateFA",function(a,b){return this.optional(b)||/^[1-4]\d{3}\/((0?[1-6]\/((3[0-1])|([1-2][0-9])|(0?[1-9])))|((1[0-2]|(0?[7-9]))\/(30|([1-2][0-9])|(0?[1-9]))))$/.test(a)},a.validator.messages.date),a.validator.addMethod("dateITA",function(a,b){var c,d,e,f,g,h=!1,i=/^\d{1,2}\/\d{1,2}\/\d{4}$/;return i.test(a)?(c=a.split("/"),d=parseInt(c[0],10),e=parseInt(c[1],10),f=parseInt(c[2],10),g=new Date(Date.UTC(f,e-1,d,12,0,0,0)),h=g.getUTCFullYear()===f&&g.getUTCMonth()===e-1&&g.getUTCDate()===d):h=!1,this.optional(b)||h},a.validator.messages.date),a.validator.addMethod("dateNL",function(a,b){return this.optional(b)||/^(0?[1-9]|[12]\d|3[01])[\.\/\-](0?[1-9]|1[012])[\.\/\-]([12]\d)?(\d\d)$/.test(a)},a.validator.messages.date),a.validator.addMethod("extension",function(a,b,c){return c="string"==typeof c?c.replace(/,/g,"|"):"png|jpe?g|gif",this.optional(b)||a.match(new RegExp("\\.("+c+")$","i"))},a.validator.format("Please enter a value with a valid extension.")),a.validator.addMethod("giroaccountNL",function(a,b){return this.optional(b)||/^[0-9]{1,7}$/.test(a)},"Please specify a valid giro account number"),a.validator.addMethod("greaterThan",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-greaterThan-blur").length&&e.addClass("validate-greaterThan-blur").on("blur.validate-greaterThan",function(){a(c).valid()}),b>e.val()},"Please enter a greater value."),a.validator.addMethod("greaterThanEqual",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-greaterThanEqual-blur").length&&e.addClass("validate-greaterThanEqual-blur").on("blur.validate-greaterThanEqual",function(){a(c).valid()}),b>=e.val()},"Please enter a greater value."),a.validator.addMethod("iban",function(a,b){if(this.optional(b))return!0;var c,d,e,f,g,h,i,j,k,l=a.replace(/ /g,"").toUpperCase(),m="",n=!0,o="",p="",q=5;if(l.length<q)return!1;if(c=l.substring(0,2),h={AL:"\\d{8}[\\dA-Z]{16}",AD:"\\d{8}[\\dA-Z]{12}",AT:"\\d{16}",AZ:"[\\dA-Z]{4}\\d{20}",BE:"\\d{12}",BH:"[A-Z]{4}[\\dA-Z]{14}",BA:"\\d{16}",BR:"\\d{23}[A-Z][\\dA-Z]",BG:"[A-Z]{4}\\d{6}[\\dA-Z]{8}",CR:"\\d{17}",HR:"\\d{17}",CY:"\\d{8}[\\dA-Z]{16}",CZ:"\\d{20}",DK:"\\d{14}",DO:"[A-Z]{4}\\d{20}",EE:"\\d{16}",FO:"\\d{14}",FI:"\\d{14}",FR:"\\d{10}[\\dA-Z]{11}\\d{2}",GE:"[\\dA-Z]{2}\\d{16}",DE:"\\d{18}",GI:"[A-Z]{4}[\\dA-Z]{15}",GR:"\\d{7}[\\dA-Z]{16}",GL:"\\d{14}",GT:"[\\dA-Z]{4}[\\dA-Z]{20}",HU:"\\d{24}",IS:"\\d{22}",IE:"[\\dA-Z]{4}\\d{14}",IL:"\\d{19}",IT:"[A-Z]\\d{10}[\\dA-Z]{12}",KZ:"\\d{3}[\\dA-Z]{13}",KW:"[A-Z]{4}[\\dA-Z]{22}",LV:"[A-Z]{4}[\\dA-Z]{13}",LB:"\\d{4}[\\dA-Z]{20}",LI:"\\d{5}[\\dA-Z]{12}",LT:"\\d{16}",LU:"\\d{3}[\\dA-Z]{13}",MK:"\\d{3}[\\dA-Z]{10}\\d{2}",MT:"[A-Z]{4}\\d{5}[\\dA-Z]{18}",MR:"\\d{23}",MU:"[A-Z]{4}\\d{19}[A-Z]{3}",MC:"\\d{10}[\\dA-Z]{11}\\d{2}",MD:"[\\dA-Z]{2}\\d{18}",ME:"\\d{18}",NL:"[A-Z]{4}\\d{10}",NO:"\\d{11}",PK:"[\\dA-Z]{4}\\d{16}",PS:"[\\dA-Z]{4}\\d{21}",PL:"\\d{24}",PT:"\\d{21}",RO:"[A-Z]{4}[\\dA-Z]{16}",SM:"[A-Z]\\d{10}[\\dA-Z]{12}",SA:"\\d{2}[\\dA-Z]{18}",RS:"\\d{18}",SK:"\\d{20}",SI:"\\d{15}",ES:"\\d{20}",SE:"\\d{20}",CH:"\\d{5}[\\dA-Z]{12}",TN:"\\d{20}",TR:"\\d{5}[\\dA-Z]{17}",AE:"\\d{3}\\d{16}",GB:"[A-Z]{4}\\d{14}",VG:"[\\dA-Z]{4}\\d{16}"},g=h[c],"undefined"!=typeof g&&(i=new RegExp("^[A-Z]{2}\\d{2}"+g+"$",""),!i.test(l)))return!1;for(d=l.substring(4,l.length)+l.substring(0,4),j=0;j<d.length;j++)e=d.charAt(j),"0"!==e&&(n=!1),n||(m+="0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ".indexOf(e));for(k=0;k<m.length;k++)f=m.charAt(k),p=""+o+f,o=p%97;return 1===o},"Please specify a valid IBAN"),a.validator.addMethod("integer",function(a,b){return this.optional(b)||/^-?\d+$/.test(a)},"A positive or negative non-decimal number please"),a.validator.addMethod("ipv4",function(a,b){return this.optional(b)||/^(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)\.(25[0-5]|2[0-4]\d|[01]?\d\d?)$/i.test(a)},"Please enter a valid IP v4 address."),a.validator.addMethod("ipv6",function(a,b){return this.optional(b)||/^((([0-9A-Fa-f]{1,4}:){7}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}:[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){5}:([0-9A-Fa-f]{1,4}:)?[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){4}:([0-9A-Fa-f]{1,4}:){0,2}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){3}:([0-9A-Fa-f]{1,4}:){0,3}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){2}:([0-9A-Fa-f]{1,4}:){0,4}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){6}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(([0-9A-Fa-f]{1,4}:){0,5}:((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|(::([0-9A-Fa-f]{1,4}:){0,5}((\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b)\.){3}(\b((25[0-5])|(1\d{2})|(2[0-4]\d)|(\d{1,2}))\b))|([0-9A-Fa-f]{1,4}::([0-9A-Fa-f]{1,4}:){0,5}[0-9A-Fa-f]{1,4})|(::([0-9A-Fa-f]{1,4}:){0,6}[0-9A-Fa-f]{1,4})|(([0-9A-Fa-f]{1,4}:){1,7}:))$/i.test(a)},"Please enter a valid IP v6 address."),a.validator.addMethod("lessThan",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-lessThan-blur").length&&e.addClass("validate-lessThan-blur").on("blur.validate-lessThan",function(){a(c).valid()}),b<e.val()},"Please enter a lesser value."),a.validator.addMethod("lessThanEqual",function(b,c,d){var e=a(d);return this.settings.onfocusout&&e.not(".validate-lessThanEqual-blur").length&&e.addClass("validate-lessThanEqual-blur").on("blur.validate-lessThanEqual",function(){a(c).valid()}),b<=e.val()},"Please enter a lesser value."),a.validator.addMethod("lettersonly",function(a,b){return this.optional(b)||/^[a-z]+$/i.test(a)},"Letters only please"),a.validator.addMethod("letterswithbasicpunc",function(a,b){return this.optional(b)||/^[a-z\-.,()'"\s]+$/i.test(a)},"Letters or punctuation only please"),a.validator.addMethod("maxfiles",function(b,c,d){return!!this.optional(c)||!("file"===a(c).attr("type")&&c.files&&c.files.length>d)},a.validator.format("Please select no more than {0} files.")),a.validator.addMethod("maxsize",function(b,c,d){if(this.optional(c))return!0;if("file"===a(c).attr("type")&&c.files&&c.files.length)for(var e=0;e<c.files.length;e++)if(c.files[e].size>d)return!1;return!0},a.validator.format("File size must not exceed {0} bytes each.")),a.validator.addMethod("maxsizetotal",function(b,c,d){if(this.optional(c))return!0;if("file"===a(c).attr("type")&&c.files&&c.files.length)for(var e=0,f=0;f<c.files.length;f++)if(e+=c.files[f].size,e>d)return!1;return!0},a.validator.format("Total size of all files must not exceed {0} bytes.")),a.validator.addMethod("mobileNL",function(a,b){return this.optional(b)||/^((\+|00(\s|\s?\-\s?)?)31(\s|\s?\-\s?)?(\(0\)[\-\s]?)?|0)6((\s|\s?\-\s?)?[0-9]){8}$/.test(a)},"Please specify a valid mobile number"),a.validator.addMethod("mobileRU",function(a,b){var c=a.replace(/\(|\)|\s+|-/g,"");return this.optional(b)||c.length>9&&/^((\+7|7|8)+([0-9]){10})$/.test(c)},"Please specify a valid mobile number"),a.validator.addMethod("mobileUK",function(a,b){return a=a.replace(/\(|\)|\s+|-/g,""),this.optional(b)||a.length>9&&a.match(/^(?:(?:(?:00\s?|\+)44\s?|0)7(?:[1345789]\d{2}|624)\s?\d{3}\s?\d{3})$/)},"Please specify a valid mobile number"),a.validator.addMethod("netmask",function(a,b){return this.optional(b)||/^(254|252|248|240|224|192|128)\.0\.0\.0|255\.(254|252|248|240|224|192|128|0)\.0\.0|255\.255\.(254|252|248|240|224|192|128|0)\.0|255\.255\.255\.(254|252|248|240|224|192|128|0)/i.test(a)},"Please enter a valid netmask."),a.validator.addMethod("nieES",function(a,b){"use strict";if(this.optional(b))return!0;var c,d=new RegExp(/^[MXYZ]{1}[0-9]{7,8}[TRWAGMYFPDXBNJZSQVHLCKET]{1}$/gi),e="TRWAGMYFPDXBNJZSQVHLCKET",f=a.substr(a.length-1).toUpperCase();return a=a.toString().toUpperCase(),!(a.length>10||a.length<9||!d.test(a))&&(a=a.replace(/^[X]/,"0").replace(/^[Y]/,"1").replace(/^[Z]/,"2"),c=9===a.length?a.substr(0,8):a.substr(0,9),e.charAt(parseInt(c,10)%23)===f)},"Please specify a valid NIE number."),a.validator.addMethod("nifES",function(a,b){"use strict";return!!this.optional(b)||(a=a.toUpperCase(),!!a.match("((^[A-Z]{1}[0-9]{7}[A-Z0-9]{1}$|^[T]{1}[A-Z0-9]{8}$)|^[0-9]{8}[A-Z]{1}$)")&&(/^[0-9]{8}[A-Z]{1}$/.test(a)?"TRWAGMYFPDXBNJZSQVHLCKE".charAt(a.substring(8,0)%23)===a.charAt(8):!!/^[KLM]{1}/.test(a)&&a[8]==="TRWAGMYFPDXBNJZSQVHLCKE".charAt(a.substring(8,1)%23)))},"Please specify a valid NIF number."),a.validator.addMethod("nipPL",function(a){"use strict";if(a=a.replace(/[^0-9]/g,""),10!==a.length)return!1;for(var b=[6,5,7,2,3,4,5,6,7],c=0,d=0;d<9;d++)c+=b[d]*a[d];var e=c%11,f=10===e?0:e;return f===parseInt(a[9],10)},"Please specify a valid NIP number."),a.validator.addMethod("nisBR",function(a){var b,c,d,e,f,g=0;if(a=a.replace(/([~!@#$%^&*()_+=`{}\[\]\-|\\:;'<>,.\/? ])+/g,""),11!==a.length)return!1;for(c=parseInt(a.substring(10,11),10),b=parseInt(a.substring(0,10),10),e=2;e<12;e++)f=e,10===e&&(f=2),11===e&&(f=3),g+=b%10*f,b=parseInt(b/10,10);return d=g%11,d=d>1?11-d:0,c===d},"Please specify a valid NIS/PIS number"),a.validator.addMethod("notEqualTo",function(b,c,d){return this.optional(c)||!a.validator.methods.equalTo.call(this,b,c,d)},"Please enter a different value, values must not be the same."),a.validator.addMethod("nowhitespace",function(a,b){return this.optional(b)||/^\S+$/i.test(a)},"No white space please"),a.validator.addMethod("pattern",function(a,b,c){return!!this.optional(b)||("string"==typeof c&&(c=new RegExp("^(?:"+c+")$")),c.test(a))},"Invalid format."),a.validator.addMethod("phoneNL",function(a,b){return this.optional(b)||/^((\+|00(\s|\s?\-\s?)?)31(\s|\s?\-\s?)?(\(0\)[\-\s]?)?|0)[1-9]((\s|\s?\-\s?)?[0-9]){8}$/.test(a)},"Please specify a valid phone number."),a.validator.addMethod("phonePL",function(a,b){a=a.replace(/\s+/g,"");var c=/^(?:(?:(?:\+|00)?48)|(?:\(\+?48\)))?(?:1[2-8]|2[2-69]|3[2-49]|4[1-68]|5[0-9]|6[0-35-9]|[7-8][1-9]|9[145])\d{7}$/;return this.optional(b)||c.test(a)},"Please specify a valid phone number"),a.validator.addMethod("phonesUK",function(a,b){return a=a.replace(/\(|\)|\s+|-/g,""),this.optional(b)||a.length>9&&a.match(/^(?:(?:(?:00\s?|\+)44\s?|0)(?:1\d{8,9}|[23]\d{9}|7(?:[1345789]\d{8}|624\d{6})))$/)},"Please specify a valid uk phone number"),a.validator.addMethod("phoneUK",function(a,b){return a=a.replace(/\(|\)|\s+|-/g,""),this.optional(b)||a.length>9&&a.match(/^(?:(?:(?:00\s?|\+)44\s?)|(?:\(?0))(?:\d{2}\)?\s?\d{4}\s?\d{4}|\d{3}\)?\s?\d{3}\s?\d{3,4}|\d{4}\)?\s?(?:\d{5}|\d{3}\s?\d{3})|\d{5}\)?\s?\d{4,5})$/)},"Please specify a valid phone number"),a.validator.addMethod("phoneUS",function(a,b){return a=a.replace(/\s+/g,""),this.optional(b)||a.length>9&&a.match(/^(\+?1-?)?(\([2-9]([02-9]\d|1[02-9])\)|[2-9]([02-9]\d|1[02-9]))-?[2-9]\d{2}-?\d{4}$/)},"Please specify a valid phone number"),a.validator.addMethod("postalcodeBR",function(a,b){return this.optional(b)||/^\d{2}.\d{3}-\d{3}?$|^\d{5}-?\d{3}?$/.test(a)},"Informe um CEP válido."),a.validator.addMethod("postalCodeCA",function(a,b){return this.optional(b)||/^[ABCEGHJKLMNPRSTVXY]\d[ABCEGHJKLMNPRSTVWXYZ] *\d[ABCEGHJKLMNPRSTVWXYZ]\d$/i.test(a)},"Please specify a valid postal code"),a.validator.addMethod("postalcodeIT",function(a,b){return this.optional(b)||/^\d{5}$/.test(a)},"Please specify a valid postal code"),a.validator.addMethod("postalcodeNL",function(a,b){return this.optional(b)||/^[1-9][0-9]{3}\s?[a-zA-Z]{2}$/.test(a)},"Please specify a valid postal code"),a.validator.addMethod("postcodeUK",function(a,b){return this.optional(b)||/^((([A-PR-UWYZ][0-9])|([A-PR-UWYZ][0-9][0-9])|([A-PR-UWYZ][A-HK-Y][0-9])|([A-PR-UWYZ][A-HK-Y][0-9][0-9])|([A-PR-UWYZ][0-9][A-HJKSTUW])|([A-PR-UWYZ][A-HK-Y][0-9][ABEHMNPRVWXY]))\s?([0-9][ABD-HJLNP-UW-Z]{2})|(GIR)\s?(0AA))$/i.test(a)},"Please specify a valid UK postcode"),a.validator.addMethod("require_from_group",function(b,c,d){var e=a(d[1],c.form),f=e.eq(0),g=f.data("valid_req_grp")?f.data("valid_req_grp"):a.extend({},this),h=e.filter(function(){return g.elementValue(this)}).length>=d[0];return f.data("valid_req_grp",g),a(c).data("being_validated")||(e.data("being_validated",!0),e.each(function(){g.element(this)}),e.data("being_validated",!1)),h},a.validator.format("Please fill at least {0} of these fields.")),a.validator.addMethod("skip_or_fill_minimum",function(b,c,d){var e=a(d[1],c.form),f=e.eq(0),g=f.data("valid_skip")?f.data("valid_skip"):a.extend({},this),h=e.filter(function(){return g.elementValue(this)}).length,i=0===h||h>=d[0];return f.data("valid_skip",g),a(c).data("being_validated")||(e.data("being_validated",!0),e.each(function(){g.element(this)}),e.data("being_validated",!1)),i},a.validator.format("Please either skip these fields or fill at least {0} of them.")),a.validator.addMethod("stateUS",function(a,b,c){var d,e="undefined"==typeof c,f=!e&&"undefined"!=typeof c.caseSensitive&&c.caseSensitive,g=!e&&"undefined"!=typeof c.includeTerritories&&c.includeTerritories,h=!e&&"undefined"!=typeof c.includeMilitary&&c.includeMilitary;return d=g||h?g&&h?"^(A[AEKLPRSZ]|C[AOT]|D[CE]|FL|G[AU]|HI|I[ADLN]|K[SY]|LA|M[ADEINOPST]|N[CDEHJMVY]|O[HKR]|P[AR]|RI|S[CD]|T[NX]|UT|V[AIT]|W[AIVY])$":g?"^(A[KLRSZ]|C[AOT]|D[CE]|FL|G[AU]|HI|I[ADLN]|K[SY]|LA|M[ADEINOPST]|N[CDEHJMVY]|O[HKR]|P[AR]|RI|S[CD]|T[NX]|UT|V[AIT]|W[AIVY])$":"^(A[AEKLPRZ]|C[AOT]|D[CE]|FL|GA|HI|I[ADLN]|K[SY]|LA|M[ADEINOST]|N[CDEHJMVY]|O[HKR]|PA|RI|S[CD]|T[NX]|UT|V[AT]|W[AIVY])$":"^(A[KLRZ]|C[AOT]|D[CE]|FL|GA|HI|I[ADLN]|K[SY]|LA|M[ADEINOST]|N[CDEHJMVY]|O[HKR]|PA|RI|S[CD]|T[NX]|UT|V[AT]|W[AIVY])$",d=f?new RegExp(d):new RegExp(d,"i"),this.optional(b)||d.test(a)},"Please specify a valid state"),a.validator.addMethod("strippedminlength",function(b,c,d){return a(b).text().length>=d},a.validator.format("Please enter at least {0} characters")),a.validator.addMethod("time",function(a,b){return this.optional(b)||/^([01]\d|2[0-3]|[0-9])(:[0-5]\d){1,2}$/.test(a)},"Please enter a valid time, between 00:00 and 23:59"),a.validator.addMethod("time12h",function(a,b){return this.optional(b)||/^((0?[1-9]|1[012])(:[0-5]\d){1,2}(\ ?[AP]M))$/i.test(a)},"Please enter a valid time in 12-hour am/pm format"),a.validator.addMethod("url2",function(a,b){return this.optional(b)||/^(https?|ftp):\/\/(((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:)*@)?(((\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5])\.(\d|[1-9]\d|1\d\d|2[0-4]\d|25[0-5]))|((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)*(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?)(:\d*)?)(\/((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)+(\/(([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)*)*)?)?(\?((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|[\uE000-\uF8FF]|\/|\?)*)?(#((([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(%[\da-f]{2})|[!\$&'\(\)\*\+,;=]|:|@)|\/|\?)*)?$/i.test(a)},a.validator.messages.url),a.validator.addMethod("vinUS",function(a){if(17!==a.length)return!1;var b,c,d,e,f,g,h=["A","B","C","D","E","F","G","H","J","K","L","M","N","P","R","S","T","U","V","W","X","Y","Z"],i=[1,2,3,4,5,6,7,8,1,2,3,4,5,7,9,2,3,4,5,6,7,8,9],j=[8,7,6,5,4,3,2,10,0,9,8,7,6,5,4,3,2],k=0;for(b=0;b<17;b++){if(e=j[b],d=a.slice(b,b+1),8===b&&(g=d),isNaN(d)){for(c=0;c<h.length;c++)if(d.toUpperCase()===h[c]){d=i[c],d*=e,isNaN(g)&&8===c&&(g=h[c]);break}}else d*=e;k+=d}return f=k%11,10===f&&(f="X"),f===g},"The specified vehicle identification number (VIN) is invalid."),a.validator.addMethod("zipcodeUS",function(a,b){return this.optional(b)||/^\d{5}(-\d{4})?$/.test(a)},"The specified US ZIP Code is invalid"),a.validator.addMethod("ziprange",function(a,b){return this.optional(b)||/^90[2-5]\d\{2\}-\d{4}$/.test(a)},"Your ZIP-code must be in the range 902xx-xxxx to 905xx-xxxx"),a});
+/* 
+* Project: Bootstrap Notify = v3.1.3
+* Description: Turns standard Bootstrap alerts into "Growl-like" notifications.
+* Author: Mouse0270 aka Robert McIntosh
+* License: MIT License
+* Website: https://github.com/mouse0270/bootstrap-growl
+*/
+
+(function (factory) {
+	if (typeof define === 'function' && define.amd) {
+		// AMD. Register as an anonymous module.
+		define(['jquery'], factory);
+	} else if (typeof exports === 'object') {
+		// Node/CommonJS
+		factory(require('jquery'));
+	} else {
+		// Browser globals
+		factory(jQuery);
+	}
+}(function ($) {
+	// Create the defaults once
+	var defaults = {
+			element: 'body',
+			position: null,
+			type: "info",
+			allow_dismiss: true,
+			newest_on_top: false,
+			showProgressbar: false,
+			placement: {
+				from: "top",
+				align: "right"
+			},
+			offset: 20,
+			spacing: 10,
+			z_index: 1031,
+			delay: 1000,
+			timer: 1000,
+			url_target: '_blank',
+			mouse_over: null,
+			animate: {
+				enter: 'animated fadeInDown',
+				exit: 'animated fadeOutUp'
+			},
+			onShow: null,
+			onShown: null,
+			onClose: null,
+			onClosed: null,
+			icon_type: 'class',
+			template: '<div data-notify="container" class="col-xs-4 col-sm-2 alert alert-{0}" role="alert"><button type="button" aria-hidden="true" class="close" data-notify="dismiss">&times;</button><span data-notify="icon"></span> <span data-notify="title">{1}</span> <span data-notify="message">{2}</span><div class="progress" data-notify="progressbar"><div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div></div><a href="{3}" target="{4}" data-notify="url"></a></div>'
+		};
+
+	String.format = function() {
+		var str = arguments[0];
+		for (var i = 1; i < arguments.length; i++) {
+			str = str.replace(RegExp("\\{" + (i - 1) + "\\}", "gm"), arguments[i]);
+		}
+		return str;
+	};
+
+	function Notify ( element, content, options ) {
+		// Setup Content of Notify
+		var content = {
+			content: {
+				message: typeof content == 'object' ? content.message : content,
+				title: content.title ? content.title : '',
+				icon: content.icon ? content.icon : '',
+				url: content.url ? content.url : '#',
+				target: content.target ? content.target : '-'
+			}
+		};
+
+		options = $.extend(true, {}, content, options);
+		this.settings = $.extend(true, {}, defaults, options);
+		this._defaults = defaults;
+		if (this.settings.content.target == "-") {
+			this.settings.content.target = this.settings.url_target;
+		}
+		this.animations = {
+			start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart',
+			end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend'
+		}
+
+		if (typeof this.settings.offset == 'number') {
+		    this.settings.offset = {
+		    	x: this.settings.offset,
+		    	y: this.settings.offset
+		    };
+		}
+
+		this.init();
+	};
+
+	$.extend(Notify.prototype, {
+		init: function () {
+			var self = this;
+
+			this.buildNotify();
+			if (this.settings.content.icon) {
+				this.setIcon();
+			}
+			if (this.settings.content.url != "#") {
+				this.styleURL();
+			}
+			this.placement();
+			this.bind();
+
+			this.notify = {
+				$ele: this.$ele,
+				update: function(command, update) {
+					var commands = {};
+					if (typeof command == "string") {					
+						commands[command] = update;
+					}else{
+						commands = command;
+					}
+					for (var command in commands) {
+						switch (command) {
+							case "type":
+								this.$ele.removeClass('alert-' + self.settings.type);
+								this.$ele.find('[data-notify="progressbar"] > .progress-bar').removeClass('progress-bar-' + self.settings.type);
+								self.settings.type = commands[command];
+								this.$ele.addClass('alert-' + commands[command]).find('[data-notify="progressbar"] > .progress-bar').addClass('progress-bar-' + commands[command]);
+								break;
+							case "icon":
+								var $icon = this.$ele.find('[data-notify="icon"]');
+								if (self.settings.icon_type.toLowerCase() == 'class') {
+									$icon.removeClass(self.settings.content.icon).addClass(commands[command]);
+								}else{
+									if (!$icon.is('img')) {
+										$icon.find('img');
+									}
+									$icon.attr('src', commands[command]);
+								}
+								break;
+							case "progress":
+								var newDelay = self.settings.delay - (self.settings.delay * (commands[command] / 100));
+								this.$ele.data('notify-delay', newDelay);
+								this.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', commands[command]).css('width', commands[command] + '%');
+								break;
+							case "url":
+								this.$ele.find('[data-notify="url"]').attr('href', commands[command]);
+								break;
+							case "target":
+								this.$ele.find('[data-notify="url"]').attr('target', commands[command]);
+								break;
+							default:
+								this.$ele.find('[data-notify="' + command +'"]').html(commands[command]);
+						};
+					}
+					var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y);
+					self.reposition(posX);
+				},
+				close: function() {
+					self.close();
+				}
+			};
+		},
+		buildNotify: function () {
+			var content = this.settings.content;
+			this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target));
+			this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align);		
+			if (!this.settings.allow_dismiss) {
+				this.$ele.find('[data-notify="dismiss"]').css('display', 'none');
+			}
+			if ((this.settings.delay <= 0 && !this.settings.showProgressbar) || !this.settings.showProgressbar) {
+				this.$ele.find('[data-notify="progressbar"]').remove();
+			}
+		},
+		setIcon: function() {
+			if (this.settings.icon_type.toLowerCase() == 'class') {
+				this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon);
+			}else{
+				if (this.$ele.find('[data-notify="icon"]').is('img')) {
+					this.$ele.find('[data-notify="icon"]').attr('src', this.settings.content.icon);
+				}else{
+					this.$ele.find('[data-notify="icon"]').append('<img src="'+this.settings.content.icon+'" alt="Notify Icon" />');
+				}	
+			}
+		},
+		styleURL: function() {
+			this.$ele.find('[data-notify="url"]').css({
+				backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)',
+				height: '100%',
+				left: '0px',
+				position: 'absolute',
+				top: '0px',
+				width: '100%',
+				zIndex: this.settings.z_index + 1
+			});
+			this.$ele.find('[data-notify="dismiss"]').css({
+				position: 'absolute',
+				right: '10px',
+				top: '5px',
+				zIndex: this.settings.z_index + 2
+			});
+		},
+		placement: function() {
+			var self = this,
+				offsetAmt = this.settings.offset.y,
+				css = {
+					display: 'inline-block',
+					margin: '0px auto',
+					position: this.settings.position ?  this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'),
+					transition: 'all .5s ease-in-out',
+					zIndex: this.settings.z_index
+				},
+				hasAnimation = false,
+				settings = this.settings;
+
+			$('[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])').each(function() {
+				return offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) +  parseInt($(this).outerHeight()) +  parseInt(settings.spacing));
+			});
+			if (this.settings.newest_on_top == true) {
+				offsetAmt = this.settings.offset.y;
+			}
+			css[this.settings.placement.from] = offsetAmt+'px';
+
+			switch (this.settings.placement.align) {
+				case "left":
+				case "right":
+					css[this.settings.placement.align] = this.settings.offset.x+'px';
+					break;
+				case "center":
+					css.left = 0;
+					css.right = 0;
+					break;
+			}
+			this.$ele.css(css).addClass(this.settings.animate.enter);
+			$.each(Array('webkit', 'moz', 'o', 'ms', ''), function(index, prefix) {
+				self.$ele[0].style[prefix+'AnimationIterationCount'] = 1;
+			});
+
+			$(this.settings.element).append(this.$ele);
+
+			if (this.settings.newest_on_top == true) {
+				offsetAmt = (parseInt(offsetAmt)+parseInt(this.settings.spacing)) + this.$ele.outerHeight();
+				this.reposition(offsetAmt);
+			}
+			
+			if ($.isFunction(self.settings.onShow)) {
+				self.settings.onShow.call(this.$ele);
+			}
+
+			this.$ele.one(this.animations.start, function(event) {
+				hasAnimation = true;
+			}).one(this.animations.end, function(event) {
+				if ($.isFunction(self.settings.onShown)) {
+					self.settings.onShown.call(this);
+				}
+			});
+
+			setTimeout(function() {
+				if (!hasAnimation) {
+					if ($.isFunction(self.settings.onShown)) {
+						self.settings.onShown.call(this);
+					}
+				}
+			}, 600);
+		},
+		bind: function() {
+			var self = this;
+
+			this.$ele.find('[data-notify="dismiss"]').on('click', function() {		
+				self.close();
+			})
+
+			this.$ele.mouseover(function(e) {
+				$(this).data('data-hover', "true");
+			}).mouseout(function(e) {
+				$(this).data('data-hover', "false");
+			});
+			this.$ele.data('data-hover', "false");
+
+			if (this.settings.delay > 0) {
+				self.$ele.data('notify-delay', self.settings.delay);
+				var timer = setInterval(function() {
+					var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer;
+					if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over == "pause") || self.settings.mouse_over != "pause") {
+						var percent = ((self.settings.delay - delay) / self.settings.delay) * 100;
+						self.$ele.data('notify-delay', delay);
+						self.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', percent).css('width', percent + '%');
+					}
+					if (delay <= -(self.settings.timer)) {
+						clearInterval(timer);
+						self.close();
+					}
+				}, self.settings.timer);
+			}
+		},
+		close: function() {
+			var self = this,
+				$successors = null,
+				posX = parseInt(this.$ele.css(this.settings.placement.from)),
+				hasAnimation = false;
+
+			this.$ele.data('closing', 'true').addClass(this.settings.animate.exit);
+			self.reposition(posX);			
+			
+			if ($.isFunction(self.settings.onClose)) {
+				self.settings.onClose.call(this.$ele);
+			}
+
+			this.$ele.one(this.animations.start, function(event) {
+				hasAnimation = true;
+			}).one(this.animations.end, function(event) {
+				$(this).remove();
+				if ($.isFunction(self.settings.onClosed)) {
+					self.settings.onClosed.call(this);
+				}
+			});
+
+			setTimeout(function() {
+				if (!hasAnimation) {
+					self.$ele.remove();
+					if (self.settings.onClosed) {
+						self.settings.onClosed(self.$ele);
+					}
+				}
+			}, 600);
+		},
+		reposition: function(posX) {
+			var self = this,
+				notifies = '[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])',
+				$elements = this.$ele.nextAll(notifies);
+			if (this.settings.newest_on_top == true) {
+				$elements = this.$ele.prevAll(notifies);
+			}
+			$elements.each(function() {
+				$(this).css(self.settings.placement.from, posX);
+				posX = (parseInt(posX)+parseInt(self.settings.spacing)) + $(this).outerHeight();
+			});
+		}
+	});
+
+	$.notify = function ( content, options ) {
+		var plugin = new Notify( this, content, options );
+		return plugin.notify;
+	};
+	$.notifyDefaults = function( options ) {
+		defaults = $.extend(true, {}, defaults, options);
+		return defaults;
+	};
+	$.notifyClose = function( command ) {
+		if (typeof command === "undefined" || command == "all") {
+			$('[data-notify]').find('[data-notify="dismiss"]').trigger('click');
+		}else{
+			$('[data-notify-position="'+command+'"]').find('[data-notify="dismiss"]').trigger('click');
+		}
+	};
+
+}));
+/*! jquery.cookie v1.4.1 | MIT */
+
+!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):"object"==typeof exports?a(require("jquery")):a(jQuery)}(function(a){function b(a){return h.raw?a:encodeURIComponent(a)}function c(a){return h.raw?a:decodeURIComponent(a)}function d(a){return b(h.json?JSON.stringify(a):String(a))}function e(a){0===a.indexOf('"')&&(a=a.slice(1,-1).replace(/\\"/g,'"').replace(/\\\\/g,"\\"));try{return a=decodeURIComponent(a.replace(g," ")),h.json?JSON.parse(a):a}catch(b){}}function f(b,c){var d=h.raw?b:e(b);return a.isFunction(c)?c(d):d}var g=/\+/g,h=a.cookie=function(e,g,i){if(void 0!==g&&!a.isFunction(g)){if(i=a.extend({},h.defaults,i),"number"==typeof i.expires){var j=i.expires,k=i.expires=new Date;k.setTime(+k+864e5*j)}return document.cookie=[b(e),"=",d(g),i.expires?"; expires="+i.expires.toUTCString():"",i.path?"; path="+i.path:"",i.domain?"; domain="+i.domain:"",i.secure?"; secure":""].join("")}for(var l=e?void 0:{},m=document.cookie?document.cookie.split("; "):[],n=0,o=m.length;o>n;n++){var p=m[n].split("="),q=c(p.shift()),r=p.join("=");if(e&&e===q){l=f(r,g);break}e||void 0===(r=f(r))||(l[q]=r)}return l};h.defaults={},a.removeCookie=function(b,c){return void 0===a.cookie(b)?!1:(a.cookie(b,"",a.extend({},c,{expires:-1})),!a.cookie(b))}});
+/*!
+ * Select2 4.0.8
+ * https://select2.github.io
+ *
+ * Released under the MIT license
+ * https://github.com/select2/select2/blob/master/LICENSE.md
+ */
+
+;(function (factory) {
+  if (typeof define === 'function' && define.amd) {
+    // AMD. Register as an anonymous module.
+    define(['jquery'], factory);
+  } else if (typeof module === 'object' && module.exports) {
+    // Node/CommonJS
+    module.exports = function (root, jQuery) {
+      if (jQuery === undefined) {
+        // require('jQuery') returns a factory that requires window to
+        // build a jQuery instance, we normalize how we use modules
+        // that require this pattern but the window provided is a noop
+        // if it's defined (how jquery works)
+        if (typeof window !== 'undefined') {
+          jQuery = require('jquery');
+        }
+        else {
+          jQuery = require('jquery')(root);
+        }
+      }
+      factory(jQuery);
+      return jQuery;
+    };
+  } else {
+    // Browser globals
+    factory(jQuery);
+  }
+} (function (jQuery) {
+  // This is needed so we can catch the AMD loader configuration and use it
+  // The inner file should be wrapped (by `banner.start.js`) in a function that
+  // returns the AMD loader references.
+  var S2 =(function () {
+  // Restore the Select2 AMD loader so it can be used
+  // Needed mostly in the language files, where the loader is not inserted
+  if (jQuery && jQuery.fn && jQuery.fn.select2 && jQuery.fn.select2.amd) {
+    var S2 = jQuery.fn.select2.amd;
+  }
+var S2;(function () { if (!S2 || !S2.requirejs) {
+if (!S2) { S2 = {}; } else { require = S2; }
+/**
+ * @license almond 0.3.3 Copyright jQuery Foundation and other contributors.
+ * Released under MIT license, http://github.com/requirejs/almond/LICENSE
+ */
+//Going sloppy to avoid 'use strict' string cost, but strict practices should
+//be followed.
+/*global setTimeout: false */
+
+var requirejs, require, define;
+(function (undef) {
+    var main, req, makeMap, handlers,
+        defined = {},
+        waiting = {},
+        config = {},
+        defining = {},
+        hasOwn = Object.prototype.hasOwnProperty,
+        aps = [].slice,
+        jsSuffixRegExp = /\.js$/;
+
+    function hasProp(obj, prop) {
+        return hasOwn.call(obj, prop);
+    }
+
+    /**
+     * Given a relative module name, like ./something, normalize it to
+     * a real name that can be mapped to a path.
+     * @param {String} name the relative name
+     * @param {String} baseName a real name that the name arg is relative
+     * to.
+     * @returns {String} normalized name
+     */
+    function normalize(name, baseName) {
+        var nameParts, nameSegment, mapValue, foundMap, lastIndex,
+            foundI, foundStarMap, starI, i, j, part, normalizedBaseParts,
+            baseParts = baseName && baseName.split("/"),
+            map = config.map,
+            starMap = (map && map['*']) || {};
+
+        //Adjust any relative paths.
+        if (name) {
+            name = name.split('/');
+            lastIndex = name.length - 1;
+
+            // If wanting node ID compatibility, strip .js from end
+            // of IDs. Have to do this here, and not in nameToUrl
+            // because node allows either .js or non .js to map
+            // to same file.
+            if (config.nodeIdCompat && jsSuffixRegExp.test(name[lastIndex])) {
+                name[lastIndex] = name[lastIndex].replace(jsSuffixRegExp, '');
+            }
+
+            // Starts with a '.' so need the baseName
+            if (name[0].charAt(0) === '.' && baseParts) {
+                //Convert baseName to array, and lop off the last part,
+                //so that . matches that 'directory' and not name of the baseName's
+                //module. For instance, baseName of 'one/two/three', maps to
+                //'one/two/three.js', but we want the directory, 'one/two' for
+                //this normalization.
+                normalizedBaseParts = baseParts.slice(0, baseParts.length - 1);
+                name = normalizedBaseParts.concat(name);
+            }
+
+            //start trimDots
+            for (i = 0; i < name.length; i++) {
+                part = name[i];
+                if (part === '.') {
+                    name.splice(i, 1);
+                    i -= 1;
+                } else if (part === '..') {
+                    // If at the start, or previous value is still ..,
+                    // keep them so that when converted to a path it may
+                    // still work when converted to a path, even though
+                    // as an ID it is less than ideal. In larger point
+                    // releases, may be better to just kick out an error.
+                    if (i === 0 || (i === 1 && name[2] === '..') || name[i - 1] === '..') {
+                        continue;
+                    } else if (i > 0) {
+                        name.splice(i - 1, 2);
+                        i -= 2;
+                    }
+                }
+            }
+            //end trimDots
+
+            name = name.join('/');
+        }
+
+        //Apply map config if available.
+        if ((baseParts || starMap) && map) {
+            nameParts = name.split('/');
+
+            for (i = nameParts.length; i > 0; i -= 1) {
+                nameSegment = nameParts.slice(0, i).join("/");
+
+                if (baseParts) {
+                    //Find the longest baseName segment match in the config.
+                    //So, do joins on the biggest to smallest lengths of baseParts.
+                    for (j = baseParts.length; j > 0; j -= 1) {
+                        mapValue = map[baseParts.slice(0, j).join('/')];
+
+                        //baseName segment has  config, find if it has one for
+                        //this name.
+                        if (mapValue) {
+                            mapValue = mapValue[nameSegment];
+                            if (mapValue) {
+                                //Match, update name to the new value.
+                                foundMap = mapValue;
+                                foundI = i;
+                                break;
+                            }
+                        }
+                    }
+                }
+
+                if (foundMap) {
+                    break;
+                }
+
+                //Check for a star map match, but just hold on to it,
+                //if there is a shorter segment match later in a matching
+                //config, then favor over this star map.
+                if (!foundStarMap && starMap && starMap[nameSegment]) {
+                    foundStarMap = starMap[nameSegment];
+                    starI = i;
+                }
+            }
+
+            if (!foundMap && foundStarMap) {
+                foundMap = foundStarMap;
+                foundI = starI;
+            }
+
+            if (foundMap) {
+                nameParts.splice(0, foundI, foundMap);
+                name = nameParts.join('/');
+            }
+        }
+
+        return name;
+    }
+
+    function makeRequire(relName, forceSync) {
+        return function () {
+            //A version of a require function that passes a moduleName
+            //value for items that may need to
+            //look up paths relative to the moduleName
+            var args = aps.call(arguments, 0);
+
+            //If first arg is not require('string'), and there is only
+            //one arg, it is the array form without a callback. Insert
+            //a null so that the following concat is correct.
+            if (typeof args[0] !== 'string' && args.length === 1) {
+                args.push(null);
+            }
+            return req.apply(undef, args.concat([relName, forceSync]));
+        };
+    }
+
+    function makeNormalize(relName) {
+        return function (name) {
+            return normalize(name, relName);
+        };
+    }
+
+    function makeLoad(depName) {
+        return function (value) {
+            defined[depName] = value;
+        };
+    }
+
+    function callDep(name) {
+        if (hasProp(waiting, name)) {
+            var args = waiting[name];
+            delete waiting[name];
+            defining[name] = true;
+            main.apply(undef, args);
+        }
+
+        if (!hasProp(defined, name) && !hasProp(defining, name)) {
+            throw new Error('No ' + name);
+        }
+        return defined[name];
+    }
+
+    //Turns a plugin!resource to [plugin, resource]
+    //with the plugin being undefined if the name
+    //did not have a plugin prefix.
+    function splitPrefix(name) {
+        var prefix,
+            index = name ? name.indexOf('!') : -1;
+        if (index > -1) {
+            prefix = name.substring(0, index);
+            name = name.substring(index + 1, name.length);
+        }
+        return [prefix, name];
+    }
+
+    //Creates a parts array for a relName where first part is plugin ID,
+    //second part is resource ID. Assumes relName has already been normalized.
+    function makeRelParts(relName) {
+        return relName ? splitPrefix(relName) : [];
+    }
+
+    /**
+     * Makes a name map, normalizing the name, and using a plugin
+     * for normalization if necessary. Grabs a ref to plugin
+     * too, as an optimization.
+     */
+    makeMap = function (name, relParts) {
+        var plugin,
+            parts = splitPrefix(name),
+            prefix = parts[0],
+            relResourceName = relParts[1];
+
+        name = parts[1];
+
+        if (prefix) {
+            prefix = normalize(prefix, relResourceName);
+            plugin = callDep(prefix);
+        }
+
+        //Normalize according
+        if (prefix) {
+            if (plugin && plugin.normalize) {
+                name = plugin.normalize(name, makeNormalize(relResourceName));
+            } else {
+                name = normalize(name, relResourceName);
+            }
+        } else {
+            name = normalize(name, relResourceName);
+            parts = splitPrefix(name);
+            prefix = parts[0];
+            name = parts[1];
+            if (prefix) {
+                plugin = callDep(prefix);
+            }
+        }
+
+        //Using ridiculous property names for space reasons
+        return {
+            f: prefix ? prefix + '!' + name : name, //fullName
+            n: name,
+            pr: prefix,
+            p: plugin
+        };
+    };
+
+    function makeConfig(name) {
+        return function () {
+            return (config && config.config && config.config[name]) || {};
+        };
+    }
+
+    handlers = {
+        require: function (name) {
+            return makeRequire(name);
+        },
+        exports: function (name) {
+            var e = defined[name];
+            if (typeof e !== 'undefined') {
+                return e;
+            } else {
+                return (defined[name] = {});
+            }
+        },
+        module: function (name) {
+            return {
+                id: name,
+                uri: '',
+                exports: defined[name],
+                config: makeConfig(name)
+            };
+        }
+    };
+
+    main = function (name, deps, callback, relName) {
+        var cjsModule, depName, ret, map, i, relParts,
+            args = [],
+            callbackType = typeof callback,
+            usingExports;
+
+        //Use name if no relName
+        relName = relName || name;
+        relParts = makeRelParts(relName);
+
+        //Call the callback to define the module, if necessary.
+        if (callbackType === 'undefined' || callbackType === 'function') {
+            //Pull out the defined dependencies and pass the ordered
+            //values to the callback.
+            //Default to [require, exports, module] if no deps
+            deps = !deps.length && callback.length ? ['require', 'exports', 'module'] : deps;
+            for (i = 0; i < deps.length; i += 1) {
+                map = makeMap(deps[i], relParts);
+                depName = map.f;
+
+                //Fast path CommonJS standard dependencies.
+                if (depName === "require") {
+                    args[i] = handlers.require(name);
+                } else if (depName === "exports") {
+                    //CommonJS module spec 1.1
+                    args[i] = handlers.exports(name);
+                    usingExports = true;
+                } else if (depName === "module") {
+                    //CommonJS module spec 1.1
+                    cjsModule = args[i] = handlers.module(name);
+                } else if (hasProp(defined, depName) ||
+                           hasProp(waiting, depName) ||
+                           hasProp(defining, depName)) {
+                    args[i] = callDep(depName);
+                } else if (map.p) {
+                    map.p.load(map.n, makeRequire(relName, true), makeLoad(depName), {});
+                    args[i] = defined[depName];
+                } else {
+                    throw new Error(name + ' missing ' + depName);
+                }
+            }
+
+            ret = callback ? callback.apply(defined[name], args) : undefined;
+
+            if (name) {
+                //If setting exports via "module" is in play,
+                //favor that over return value and exports. After that,
+                //favor a non-undefined return value over exports use.
+                if (cjsModule && cjsModule.exports !== undef &&
+                        cjsModule.exports !== defined[name]) {
+                    defined[name] = cjsModule.exports;
+                } else if (ret !== undef || !usingExports) {
+                    //Use the return value from the function.
+                    defined[name] = ret;
+                }
+            }
+        } else if (name) {
+            //May just be an object definition for the module. Only
+            //worry about defining if have a module name.
+            defined[name] = callback;
+        }
+    };
+
+    requirejs = require = req = function (deps, callback, relName, forceSync, alt) {
+        if (typeof deps === "string") {
+            if (handlers[deps]) {
+                //callback in this case is really relName
+                return handlers[deps](callback);
+            }
+            //Just return the module wanted. In this scenario, the
+            //deps arg is the module name, and second arg (if passed)
+            //is just the relName.
+            //Normalize module name, if it contains . or ..
+            return callDep(makeMap(deps, makeRelParts(callback)).f);
+        } else if (!deps.splice) {
+            //deps is a config object, not an array.
+            config = deps;
+            if (config.deps) {
+                req(config.deps, config.callback);
+            }
+            if (!callback) {
+                return;
+            }
+
+            if (callback.splice) {
+                //callback is an array, which means it is a dependency list.
+                //Adjust args if there are dependencies
+                deps = callback;
+                callback = relName;
+                relName = null;
+            } else {
+                deps = undef;
+            }
+        }
+
+        //Support require(['a'])
+        callback = callback || function () {};
+
+        //If relName is a function, it is an errback handler,
+        //so remove it.
+        if (typeof relName === 'function') {
+            relName = forceSync;
+            forceSync = alt;
+        }
+
+        //Simulate async callback;
+        if (forceSync) {
+            main(undef, deps, callback, relName);
+        } else {
+            //Using a non-zero value because of concern for what old browsers
+            //do, and latest browsers "upgrade" to 4 if lower value is used:
+            //http://www.whatwg.org/specs/web-apps/current-work/multipage/timers.html#dom-windowtimers-settimeout:
+            //If want a value immediately, use require('id') instead -- something
+            //that works in almond on the global level, but not guaranteed and
+            //unlikely to work in other AMD implementations.
+            setTimeout(function () {
+                main(undef, deps, callback, relName);
+            }, 4);
+        }
+
+        return req;
+    };
+
+    /**
+     * Just drops the config on the floor, but returns req in case
+     * the config return value is used.
+     */
+    req.config = function (cfg) {
+        return req(cfg);
+    };
+
+    /**
+     * Expose module registry for debugging and tooling
+     */
+    requirejs._defined = defined;
+
+    define = function (name, deps, callback) {
+        if (typeof name !== 'string') {
+            throw new Error('See almond README: incorrect module build, no module name');
+        }
+
+        //This module may not have dependencies
+        if (!deps.splice) {
+            //deps is not an array, so probably means
+            //an object literal or factory function for
+            //the value. Adjust args.
+            callback = deps;
+            deps = [];
+        }
+
+        if (!hasProp(defined, name) && !hasProp(waiting, name)) {
+            waiting[name] = [name, deps, callback];
+        }
+    };
+
+    define.amd = {
+        jQuery: true
+    };
+}());
+
+S2.requirejs = requirejs;S2.require = require;S2.define = define;
+}
+}());
+S2.define("almond", function(){});
+
+/* global jQuery:false, $:false */
+S2.define('jquery',[],function () {
+  var _$ = jQuery || $;
+
+  if (_$ == null && console && console.error) {
+    console.error(
+      'Select2: An instance of jQuery or a jQuery-compatible library was not ' +
+      'found. Make sure that you are including jQuery before Select2 on your ' +
+      'web page.'
+    );
+  }
+
+  return _$;
+});
+
+S2.define('select2/utils',[
+  'jquery'
+], function ($) {
+  var Utils = {};
+
+  Utils.Extend = function (ChildClass, SuperClass) {
+    var __hasProp = {}.hasOwnProperty;
+
+    function BaseConstructor () {
+      this.constructor = ChildClass;
+    }
+
+    for (var key in SuperClass) {
+      if (__hasProp.call(SuperClass, key)) {
+        ChildClass[key] = SuperClass[key];
+      }
+    }
+
+    BaseConstructor.prototype = SuperClass.prototype;
+    ChildClass.prototype = new BaseConstructor();
+    ChildClass.__super__ = SuperClass.prototype;
+
+    return ChildClass;
+  };
+
+  function getMethods (theClass) {
+    var proto = theClass.prototype;
+
+    var methods = [];
+
+    for (var methodName in proto) {
+      var m = proto[methodName];
+
+      if (typeof m !== 'function') {
+        continue;
+      }
+
+      if (methodName === 'constructor') {
+        continue;
+      }
+
+      methods.push(methodName);
+    }
+
+    return methods;
+  }
+
+  Utils.Decorate = function (SuperClass, DecoratorClass) {
+    var decoratedMethods = getMethods(DecoratorClass);
+    var superMethods = getMethods(SuperClass);
+
+    function DecoratedClass () {
+      var unshift = Array.prototype.unshift;
+
+      var argCount = DecoratorClass.prototype.constructor.length;
+
+      var calledConstructor = SuperClass.prototype.constructor;
+
+      if (argCount > 0) {
+        unshift.call(arguments, SuperClass.prototype.constructor);
+
+        calledConstructor = DecoratorClass.prototype.constructor;
+      }
+
+      calledConstructor.apply(this, arguments);
+    }
+
+    DecoratorClass.displayName = SuperClass.displayName;
+
+    function ctr () {
+      this.constructor = DecoratedClass;
+    }
+
+    DecoratedClass.prototype = new ctr();
+
+    for (var m = 0; m < superMethods.length; m++) {
+      var superMethod = superMethods[m];
+
+      DecoratedClass.prototype[superMethod] =
+        SuperClass.prototype[superMethod];
+    }
+
+    var calledMethod = function (methodName) {
+      // Stub out the original method if it's not decorating an actual method
+      var originalMethod = function () {};
+
+      if (methodName in DecoratedClass.prototype) {
+        originalMethod = DecoratedClass.prototype[methodName];
+      }
+
+      var decoratedMethod = DecoratorClass.prototype[methodName];
+
+      return function () {
+        var unshift = Array.prototype.unshift;
+
+        unshift.call(arguments, originalMethod);
+
+        return decoratedMethod.apply(this, arguments);
+      };
+    };
+
+    for (var d = 0; d < decoratedMethods.length; d++) {
+      var decoratedMethod = decoratedMethods[d];
+
+      DecoratedClass.prototype[decoratedMethod] = calledMethod(decoratedMethod);
+    }
+
+    return DecoratedClass;
+  };
+
+  var Observable = function () {
+    this.listeners = {};
+  };
+
+  Observable.prototype.on = function (event, callback) {
+    this.listeners = this.listeners || {};
+
+    if (event in this.listeners) {
+      this.listeners[event].push(callback);
+    } else {
+      this.listeners[event] = [callback];
+    }
+  };
+
+  Observable.prototype.trigger = function (event) {
+    var slice = Array.prototype.slice;
+    var params = slice.call(arguments, 1);
+
+    this.listeners = this.listeners || {};
+
+    // Params should always come in as an array
+    if (params == null) {
+      params = [];
+    }
+
+    // If there are no arguments to the event, use a temporary object
+    if (params.length === 0) {
+      params.push({});
+    }
+
+    // Set the `_type` of the first object to the event
+    params[0]._type = event;
+
+    if (event in this.listeners) {
+      this.invoke(this.listeners[event], slice.call(arguments, 1));
+    }
+
+    if ('*' in this.listeners) {
+      this.invoke(this.listeners['*'], arguments);
+    }
+  };
+
+  Observable.prototype.invoke = function (listeners, params) {
+    for (var i = 0, len = listeners.length; i < len; i++) {
+      listeners[i].apply(this, params);
+    }
+  };
+
+  Utils.Observable = Observable;
+
+  Utils.generateChars = function (length) {
+    var chars = '';
+
+    for (var i = 0; i < length; i++) {
+      var randomChar = Math.floor(Math.random() * 36);
+      chars += randomChar.toString(36);
+    }
+
+    return chars;
+  };
+
+  Utils.bind = function (func, context) {
+    return function () {
+      func.apply(context, arguments);
+    };
+  };
+
+  Utils._convertData = function (data) {
+    for (var originalKey in data) {
+      var keys = originalKey.split('-');
+
+      var dataLevel = data;
+
+      if (keys.length === 1) {
+        continue;
+      }
+
+      for (var k = 0; k < keys.length; k++) {
+        var key = keys[k];
+
+        // Lowercase the first letter
+        // By default, dash-separated becomes camelCase
+        key = key.substring(0, 1).toLowerCase() + key.substring(1);
+
+        if (!(key in dataLevel)) {
+          dataLevel[key] = {};
+        }
+
+        if (k == keys.length - 1) {
+          dataLevel[key] = data[originalKey];
+        }
+
+        dataLevel = dataLevel[key];
+      }
+
+      delete data[originalKey];
+    }
+
+    return data;
+  };
+
+  Utils.hasScroll = function (index, el) {
+    // Adapted from the function created by @ShadowScripter
+    // and adapted by @BillBarry on the Stack Exchange Code Review website.
+    // The original code can be found at
+    // http://codereview.stackexchange.com/q/13338
+    // and was designed to be used with the Sizzle selector engine.
+
+    var $el = $(el);
+    var overflowX = el.style.overflowX;
+    var overflowY = el.style.overflowY;
+
+    //Check both x and y declarations
+    if (overflowX === overflowY &&
+        (overflowY === 'hidden' || overflowY === 'visible')) {
+      return false;
+    }
+
+    if (overflowX === 'scroll' || overflowY === 'scroll') {
+      return true;
+    }
+
+    return ($el.innerHeight() < el.scrollHeight ||
+      $el.innerWidth() < el.scrollWidth);
+  };
+
+  Utils.escapeMarkup = function (markup) {
+    var replaceMap = {
+      '\\': '&#92;',
+      '&': '&amp;',
+      '<': '&lt;',
+      '>': '&gt;',
+      '"': '&quot;',
+      '\'': '&#39;',
+      '/': '&#47;'
+    };
+
+    // Do not try to escape the markup if it's not a string
+    if (typeof markup !== 'string') {
+      return markup;
+    }
+
+    return String(markup).replace(/[&<>"'\/\\]/g, function (match) {
+      return replaceMap[match];
+    });
+  };
+
+  // Append an array of jQuery nodes to a given element.
+  Utils.appendMany = function ($element, $nodes) {
+    // jQuery 1.7.x does not support $.fn.append() with an array
+    // Fall back to a jQuery object collection using $.fn.add()
+    if ($.fn.jquery.substr(0, 3) === '1.7') {
+      var $jqNodes = $();
+
+      $.map($nodes, function (node) {
+        $jqNodes = $jqNodes.add(node);
+      });
+
+      $nodes = $jqNodes;
+    }
+
+    $element.append($nodes);
+  };
+
+  // Cache objects in Utils.__cache instead of $.data (see #4346)
+  Utils.__cache = {};
+
+  var id = 0;
+  Utils.GetUniqueElementId = function (element) {
+    // Get a unique element Id. If element has no id,
+    // creates a new unique number, stores it in the id
+    // attribute and returns the new id.
+    // If an id already exists, it simply returns it.
+
+    var select2Id = element.getAttribute('data-select2-id');
+    if (select2Id == null) {
+      // If element has id, use it.
+      if (element.id) {
+        select2Id = element.id;
+        element.setAttribute('data-select2-id', select2Id);
+      } else {
+        element.setAttribute('data-select2-id', ++id);
+        select2Id = id.toString();
+      }
+    }
+    return select2Id;
+  };
+
+  Utils.StoreData = function (element, name, value) {
+    // Stores an item in the cache for a specified element.
+    // name is the cache key.
+    var id = Utils.GetUniqueElementId(element);
+    if (!Utils.__cache[id]) {
+      Utils.__cache[id] = {};
+    }
+
+    Utils.__cache[id][name] = value;
+  };
+
+  Utils.GetData = function (element, name) {
+    // Retrieves a value from the cache by its key (name)
+    // name is optional. If no name specified, return
+    // all cache items for the specified element.
+    // and for a specified element.
+    var id = Utils.GetUniqueElementId(element);
+    if (name) {
+      if (Utils.__cache[id]) {
+        if (Utils.__cache[id][name] != null) {
+          return Utils.__cache[id][name];
+        }
+        return $(element).data(name); // Fallback to HTML5 data attribs.
+      }
+      return $(element).data(name); // Fallback to HTML5 data attribs.
+    } else {
+      return Utils.__cache[id];
+    }
+  };
+
+  Utils.RemoveData = function (element) {
+    // Removes all cached items for a specified element.
+    var id = Utils.GetUniqueElementId(element);
+    if (Utils.__cache[id] != null) {
+      delete Utils.__cache[id];
+    }
+  };
+
+  return Utils;
+});
+
+S2.define('select2/results',[
+  'jquery',
+  './utils'
+], function ($, Utils) {
+  function Results ($element, options, dataAdapter) {
+    this.$element = $element;
+    this.data = dataAdapter;
+    this.options = options;
+
+    Results.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(Results, Utils.Observable);
+
+  Results.prototype.render = function () {
+    var $results = $(
+      '<ul class="select2-results__options" role="tree"></ul>'
+    );
+
+    if (this.options.get('multiple')) {
+      $results.attr('aria-multiselectable', 'true');
+    }
+
+    this.$results = $results;
+
+    return $results;
+  };
+
+  Results.prototype.clear = function () {
+    this.$results.empty();
+  };
+
+  Results.prototype.displayMessage = function (params) {
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    this.clear();
+    this.hideLoading();
+
+    var $message = $(
+      '<li role="treeitem" aria-live="assertive"' +
+      ' class="select2-results__option"></li>'
+    );
+
+    var message = this.options.get('translations').get(params.message);
+
+    $message.append(
+      escapeMarkup(
+        message(params.args)
+      )
+    );
+
+    $message[0].className += ' select2-results__message';
+
+    this.$results.append($message);
+  };
+
+  Results.prototype.hideMessages = function () {
+    this.$results.find('.select2-results__message').remove();
+  };
+
+  Results.prototype.append = function (data) {
+    this.hideLoading();
+
+    var $options = [];
+
+    if (data.results == null || data.results.length === 0) {
+      if (this.$results.children().length === 0) {
+        this.trigger('results:message', {
+          message: 'noResults'
+        });
+      }
+
+      return;
+    }
+
+    data.results = this.sort(data.results);
+
+    for (var d = 0; d < data.results.length; d++) {
+      var item = data.results[d];
+
+      var $option = this.option(item);
+
+      $options.push($option);
+    }
+
+    this.$results.append($options);
+  };
+
+  Results.prototype.position = function ($results, $dropdown) {
+    var $resultsContainer = $dropdown.find('.select2-results');
+    $resultsContainer.append($results);
+  };
+
+  Results.prototype.sort = function (data) {
+    var sorter = this.options.get('sorter');
+
+    return sorter(data);
+  };
+
+  Results.prototype.highlightFirstItem = function () {
+    var $options = this.$results
+      .find('.select2-results__option[aria-selected]');
+
+    var $selected = $options.filter('[aria-selected=true]');
+
+    // Check if there are any selected options
+    if ($selected.length > 0) {
+      // If there are selected options, highlight the first
+      $selected.first().trigger('mouseenter');
+    } else {
+      // If there are no selected options, highlight the first option
+      // in the dropdown
+      $options.first().trigger('mouseenter');
+    }
+
+    this.ensureHighlightVisible();
+  };
+
+  Results.prototype.setClasses = function () {
+    var self = this;
+
+    this.data.current(function (selected) {
+      var selectedIds = $.map(selected, function (s) {
+        return s.id.toString();
+      });
+
+      var $options = self.$results
+        .find('.select2-results__option[aria-selected]');
+
+      $options.each(function () {
+        var $option = $(this);
+
+        var item = Utils.GetData(this, 'data');
+
+        // id needs to be converted to a string when comparing
+        var id = '' + item.id;
+
+        if ((item.element != null && item.element.selected) ||
+            (item.element == null && $.inArray(id, selectedIds) > -1)) {
+          $option.attr('aria-selected', 'true');
+        } else {
+          $option.attr('aria-selected', 'false');
+        }
+      });
+
+    });
+  };
+
+  Results.prototype.showLoading = function (params) {
+    this.hideLoading();
+
+    var loadingMore = this.options.get('translations').get('searching');
+
+    var loading = {
+      disabled: true,
+      loading: true,
+      text: loadingMore(params)
+    };
+    var $loading = this.option(loading);
+    $loading.className += ' loading-results';
+
+    this.$results.prepend($loading);
+  };
+
+  Results.prototype.hideLoading = function () {
+    this.$results.find('.loading-results').remove();
+  };
+
+  Results.prototype.option = function (data) {
+    var option = document.createElement('li');
+    option.className = 'select2-results__option';
+
+    var attrs = {
+      'role': 'treeitem',
+      'aria-selected': 'false'
+    };
+
+    var matches = window.Element.prototype.matches ||
+      window.Element.prototype.msMatchesSelector ||
+      window.Element.prototype.webkitMatchesSelector;
+
+    if ((data.element != null && matches.call(data.element, ':disabled')) ||
+        (data.element == null && data.disabled)) {
+      delete attrs['aria-selected'];
+      attrs['aria-disabled'] = 'true';
+    }
+
+    if (data.id == null) {
+      delete attrs['aria-selected'];
+    }
+
+    if (data._resultId != null) {
+      option.id = data._resultId;
+    }
+
+    if (data.title) {
+      option.title = data.title;
+    }
+
+    if (data.children) {
+      attrs.role = 'group';
+      attrs['aria-label'] = data.text;
+      delete attrs['aria-selected'];
+    }
+
+    for (var attr in attrs) {
+      var val = attrs[attr];
+
+      option.setAttribute(attr, val);
+    }
+
+    if (data.children) {
+      var $option = $(option);
+
+      var label = document.createElement('strong');
+      label.className = 'select2-results__group';
+
+      var $label = $(label);
+      this.template(data, label);
+
+      var $children = [];
+
+      for (var c = 0; c < data.children.length; c++) {
+        var child = data.children[c];
+
+        var $child = this.option(child);
+
+        $children.push($child);
+      }
+
+      var $childrenContainer = $('<ul></ul>', {
+        'class': 'select2-results__options select2-results__options--nested'
+      });
+
+      $childrenContainer.append($children);
+
+      $option.append(label);
+      $option.append($childrenContainer);
+    } else {
+      this.template(data, option);
+    }
+
+    Utils.StoreData(option, 'data', data);
+
+    return option;
+  };
+
+  Results.prototype.bind = function (container, $container) {
+    var self = this;
+
+    var id = container.id + '-results';
+
+    this.$results.attr('id', id);
+
+    container.on('results:all', function (params) {
+      self.clear();
+      self.append(params.data);
+
+      if (container.isOpen()) {
+        self.setClasses();
+        self.highlightFirstItem();
+      }
+    });
+
+    container.on('results:append', function (params) {
+      self.append(params.data);
+
+      if (container.isOpen()) {
+        self.setClasses();
+      }
+    });
+
+    container.on('query', function (params) {
+      self.hideMessages();
+      self.showLoading(params);
+    });
+
+    container.on('select', function () {
+      if (!container.isOpen()) {
+        return;
+      }
+
+      self.setClasses();
+
+      if (self.options.get('scrollAfterSelect')) {
+        self.highlightFirstItem();
+      }
+    });
+
+    container.on('unselect', function () {
+      if (!container.isOpen()) {
+        return;
+      }
+
+      self.setClasses();
+
+      if (self.options.get('scrollAfterSelect')) {
+        self.highlightFirstItem();
+      }
+    });
+
+    container.on('open', function () {
+      // When the dropdown is open, aria-expended="true"
+      self.$results.attr('aria-expanded', 'true');
+      self.$results.attr('aria-hidden', 'false');
+
+      self.setClasses();
+      self.ensureHighlightVisible();
+    });
+
+    container.on('close', function () {
+      // When the dropdown is closed, aria-expended="false"
+      self.$results.attr('aria-expanded', 'false');
+      self.$results.attr('aria-hidden', 'true');
+      self.$results.removeAttr('aria-activedescendant');
+    });
+
+    container.on('results:toggle', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      if ($highlighted.length === 0) {
+        return;
+      }
+
+      $highlighted.trigger('mouseup');
+    });
+
+    container.on('results:select', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      if ($highlighted.length === 0) {
+        return;
+      }
+
+      var data = Utils.GetData($highlighted[0], 'data');
+
+      if ($highlighted.attr('aria-selected') == 'true') {
+        self.trigger('close', {});
+      } else {
+        self.trigger('select', {
+          data: data
+        });
+      }
+    });
+
+    container.on('results:previous', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      var $options = self.$results.find('[aria-selected]');
+
+      var currentIndex = $options.index($highlighted);
+
+      // If we are already at the top, don't move further
+      // If no options, currentIndex will be -1
+      if (currentIndex <= 0) {
+        return;
+      }
+
+      var nextIndex = currentIndex - 1;
+
+      // If none are highlighted, highlight the first
+      if ($highlighted.length === 0) {
+        nextIndex = 0;
+      }
+
+      var $next = $options.eq(nextIndex);
+
+      $next.trigger('mouseenter');
+
+      var currentOffset = self.$results.offset().top;
+      var nextTop = $next.offset().top;
+      var nextOffset = self.$results.scrollTop() + (nextTop - currentOffset);
+
+      if (nextIndex === 0) {
+        self.$results.scrollTop(0);
+      } else if (nextTop - currentOffset < 0) {
+        self.$results.scrollTop(nextOffset);
+      }
+    });
+
+    container.on('results:next', function () {
+      var $highlighted = self.getHighlightedResults();
+
+      var $options = self.$results.find('[aria-selected]');
+
+      var currentIndex = $options.index($highlighted);
+
+      var nextIndex = currentIndex + 1;
+
+      // If we are at the last option, stay there
+      if (nextIndex >= $options.length) {
+        return;
+      }
+
+      var $next = $options.eq(nextIndex);
+
+      $next.trigger('mouseenter');
+
+      var currentOffset = self.$results.offset().top +
+        self.$results.outerHeight(false);
+      var nextBottom = $next.offset().top + $next.outerHeight(false);
+      var nextOffset = self.$results.scrollTop() + nextBottom - currentOffset;
+
+      if (nextIndex === 0) {
+        self.$results.scrollTop(0);
+      } else if (nextBottom > currentOffset) {
+        self.$results.scrollTop(nextOffset);
+      }
+    });
+
+    container.on('results:focus', function (params) {
+      params.element.addClass('select2-results__option--highlighted');
+    });
+
+    container.on('results:message', function (params) {
+      self.displayMessage(params);
+    });
+
+    if ($.fn.mousewheel) {
+      this.$results.on('mousewheel', function (e) {
+        var top = self.$results.scrollTop();
+
+        var bottom = self.$results.get(0).scrollHeight - top + e.deltaY;
+
+        var isAtTop = e.deltaY > 0 && top - e.deltaY <= 0;
+        var isAtBottom = e.deltaY < 0 && bottom <= self.$results.height();
+
+        if (isAtTop) {
+          self.$results.scrollTop(0);
+
+          e.preventDefault();
+          e.stopPropagation();
+        } else if (isAtBottom) {
+          self.$results.scrollTop(
+            self.$results.get(0).scrollHeight - self.$results.height()
+          );
+
+          e.preventDefault();
+          e.stopPropagation();
+        }
+      });
+    }
+
+    this.$results.on('mouseup', '.select2-results__option[aria-selected]',
+      function (evt) {
+      var $this = $(this);
+
+      var data = Utils.GetData(this, 'data');
+
+      if ($this.attr('aria-selected') === 'true') {
+        if (self.options.get('multiple')) {
+          self.trigger('unselect', {
+            originalEvent: evt,
+            data: data
+          });
+        } else {
+          self.trigger('close', {});
+        }
+
+        return;
+      }
+
+      self.trigger('select', {
+        originalEvent: evt,
+        data: data
+      });
+    });
+
+    this.$results.on('mouseenter', '.select2-results__option[aria-selected]',
+      function (evt) {
+      var data = Utils.GetData(this, 'data');
+
+      self.getHighlightedResults()
+          .removeClass('select2-results__option--highlighted');
+
+      self.trigger('results:focus', {
+        data: data,
+        element: $(this)
+      });
+    });
+  };
+
+  Results.prototype.getHighlightedResults = function () {
+    var $highlighted = this.$results
+    .find('.select2-results__option--highlighted');
+
+    return $highlighted;
+  };
+
+  Results.prototype.destroy = function () {
+    this.$results.remove();
+  };
+
+  Results.prototype.ensureHighlightVisible = function () {
+    var $highlighted = this.getHighlightedResults();
+
+    if ($highlighted.length === 0) {
+      return;
+    }
+
+    var $options = this.$results.find('[aria-selected]');
+
+    var currentIndex = $options.index($highlighted);
+
+    var currentOffset = this.$results.offset().top;
+    var nextTop = $highlighted.offset().top;
+    var nextOffset = this.$results.scrollTop() + (nextTop - currentOffset);
+
+    var offsetDelta = nextTop - currentOffset;
+    nextOffset -= $highlighted.outerHeight(false) * 2;
+
+    if (currentIndex <= 2) {
+      this.$results.scrollTop(0);
+    } else if (offsetDelta > this.$results.outerHeight() || offsetDelta < 0) {
+      this.$results.scrollTop(nextOffset);
+    }
+  };
+
+  Results.prototype.template = function (result, container) {
+    var template = this.options.get('templateResult');
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    var content = template(result, container);
+
+    if (content == null) {
+      container.style.display = 'none';
+    } else if (typeof content === 'string') {
+      container.innerHTML = escapeMarkup(content);
+    } else {
+      $(container).append(content);
+    }
+  };
+
+  return Results;
+});
+
+S2.define('select2/keys',[
+
+], function () {
+  var KEYS = {
+    BACKSPACE: 8,
+    TAB: 9,
+    ENTER: 13,
+    SHIFT: 16,
+    CTRL: 17,
+    ALT: 18,
+    ESC: 27,
+    SPACE: 32,
+    PAGE_UP: 33,
+    PAGE_DOWN: 34,
+    END: 35,
+    HOME: 36,
+    LEFT: 37,
+    UP: 38,
+    RIGHT: 39,
+    DOWN: 40,
+    DELETE: 46
+  };
+
+  return KEYS;
+});
+
+S2.define('select2/selection/base',[
+  'jquery',
+  '../utils',
+  '../keys'
+], function ($, Utils, KEYS) {
+  function BaseSelection ($element, options) {
+    this.$element = $element;
+    this.options = options;
+
+    BaseSelection.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(BaseSelection, Utils.Observable);
+
+  BaseSelection.prototype.render = function () {
+    var $selection = $(
+      '<span class="select2-selection" role="combobox" ' +
+      ' aria-haspopup="true" aria-expanded="false">' +
+      '</span>'
+    );
+
+    this._tabindex = 0;
+
+    if (Utils.GetData(this.$element[0], 'old-tabindex') != null) {
+      this._tabindex = Utils.GetData(this.$element[0], 'old-tabindex');
+    } else if (this.$element.attr('tabindex') != null) {
+      this._tabindex = this.$element.attr('tabindex');
+    }
+
+    $selection.attr('title', this.$element.attr('title'));
+    $selection.attr('tabindex', this._tabindex);
+
+    this.$selection = $selection;
+
+    return $selection;
+  };
+
+  BaseSelection.prototype.bind = function (container, $container) {
+    var self = this;
+
+    var id = container.id + '-container';
+    var resultsId = container.id + '-results';
+
+    this.container = container;
+
+    this.$selection.on('focus', function (evt) {
+      self.trigger('focus', evt);
+    });
+
+    this.$selection.on('blur', function (evt) {
+      self._handleBlur(evt);
+    });
+
+    this.$selection.on('keydown', function (evt) {
+      self.trigger('keypress', evt);
+
+      if (evt.which === KEYS.SPACE) {
+        evt.preventDefault();
+      }
+    });
+
+    container.on('results:focus', function (params) {
+      self.$selection.attr('aria-activedescendant', params.data._resultId);
+    });
+
+    container.on('selection:update', function (params) {
+      self.update(params.data);
+    });
+
+    container.on('open', function () {
+      // When the dropdown is open, aria-expanded="true"
+      self.$selection.attr('aria-expanded', 'true');
+      self.$selection.attr('aria-owns', resultsId);
+
+      self._attachCloseHandler(container);
+    });
+
+    container.on('close', function () {
+      // When the dropdown is closed, aria-expanded="false"
+      self.$selection.attr('aria-expanded', 'false');
+      self.$selection.removeAttr('aria-activedescendant');
+      self.$selection.removeAttr('aria-owns');
+
+      self.$selection.trigger('focus');
+
+      self._detachCloseHandler(container);
+    });
+
+    container.on('enable', function () {
+      self.$selection.attr('tabindex', self._tabindex);
+    });
+
+    container.on('disable', function () {
+      self.$selection.attr('tabindex', '-1');
+    });
+  };
+
+  BaseSelection.prototype._handleBlur = function (evt) {
+    var self = this;
+
+    // This needs to be delayed as the active element is the body when the tab
+    // key is pressed, possibly along with others.
+    window.setTimeout(function () {
+      // Don't trigger `blur` if the focus is still in the selection
+      if (
+        (document.activeElement == self.$selection[0]) ||
+        ($.contains(self.$selection[0], document.activeElement))
+      ) {
+        return;
+      }
+
+      self.trigger('blur', evt);
+    }, 1);
+  };
+
+  BaseSelection.prototype._attachCloseHandler = function (container) {
+    var self = this;
+
+    $(document.body).on('mousedown.select2.' + container.id, function (e) {
+      var $target = $(e.target);
+
+      var $select = $target.closest('.select2');
+
+      var $all = $('.select2.select2-container--open');
+
+      $all.each(function () {
+        var $this = $(this);
+
+        if (this == $select[0]) {
+          return;
+        }
+
+        var $element = Utils.GetData(this, 'element');
+
+        $element.select2('close');
+      });
+    });
+  };
+
+  BaseSelection.prototype._detachCloseHandler = function (container) {
+    $(document.body).off('mousedown.select2.' + container.id);
+  };
+
+  BaseSelection.prototype.position = function ($selection, $container) {
+    var $selectionContainer = $container.find('.selection');
+    $selectionContainer.append($selection);
+  };
+
+  BaseSelection.prototype.destroy = function () {
+    this._detachCloseHandler(this.container);
+  };
+
+  BaseSelection.prototype.update = function (data) {
+    throw new Error('The `update` method must be defined in child classes.');
+  };
+
+  return BaseSelection;
+});
+
+S2.define('select2/selection/single',[
+  'jquery',
+  './base',
+  '../utils',
+  '../keys'
+], function ($, BaseSelection, Utils, KEYS) {
+  function SingleSelection () {
+    SingleSelection.__super__.constructor.apply(this, arguments);
+  }
+
+  Utils.Extend(SingleSelection, BaseSelection);
+
+  SingleSelection.prototype.render = function () {
+    var $selection = SingleSelection.__super__.render.call(this);
+
+    $selection.addClass('select2-selection--single');
+
+    $selection.html(
+      '<span class="select2-selection__rendered"></span>' +
+      '<span class="select2-selection__arrow" role="presentation">' +
+        '<b role="presentation"></b>' +
+      '</span>'
+    );
+
+    return $selection;
+  };
+
+  SingleSelection.prototype.bind = function (container, $container) {
+    var self = this;
+
+    SingleSelection.__super__.bind.apply(this, arguments);
+
+    var id = container.id + '-container';
+
+    this.$selection.find('.select2-selection__rendered')
+      .attr('id', id)
+      .attr('role', 'textbox')
+      .attr('aria-readonly', 'true');
+    this.$selection.attr('aria-labelledby', id);
+
+    this.$selection.on('mousedown', function (evt) {
+      // Only respond to left clicks
+      if (evt.which !== 1) {
+        return;
+      }
+
+      self.trigger('toggle', {
+        originalEvent: evt
+      });
+    });
+
+    this.$selection.on('focus', function (evt) {
+      // User focuses on the container
+    });
+
+    this.$selection.on('blur', function (evt) {
+      // User exits the container
+    });
+
+    container.on('focus', function (evt) {
+      if (!container.isOpen()) {
+        self.$selection.trigger('focus');
+      }
+    });
+  };
+
+  SingleSelection.prototype.clear = function () {
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+    $rendered.empty();
+    $rendered.removeAttr('title'); // clear tooltip on empty
+  };
+
+  SingleSelection.prototype.display = function (data, container) {
+    var template = this.options.get('templateSelection');
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    return escapeMarkup(template(data, container));
+  };
+
+  SingleSelection.prototype.selectionContainer = function () {
+    return $('<span></span>');
+  };
+
+  SingleSelection.prototype.update = function (data) {
+    if (data.length === 0) {
+      this.clear();
+      return;
+    }
+
+    var selection = data[0];
+
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+    var formatted = this.display(selection, $rendered);
+
+    $rendered.empty().append(formatted);
+    $rendered.attr('title', selection.title || selection.text);
+  };
+
+  return SingleSelection;
+});
+
+S2.define('select2/selection/multiple',[
+  'jquery',
+  './base',
+  '../utils'
+], function ($, BaseSelection, Utils) {
+  function MultipleSelection ($element, options) {
+    MultipleSelection.__super__.constructor.apply(this, arguments);
+  }
+
+  Utils.Extend(MultipleSelection, BaseSelection);
+
+  MultipleSelection.prototype.render = function () {
+    var $selection = MultipleSelection.__super__.render.call(this);
+
+    $selection.addClass('select2-selection--multiple');
+
+    $selection.html(
+      '<ul class="select2-selection__rendered"></ul>'
+    );
+
+    return $selection;
+  };
+
+  MultipleSelection.prototype.bind = function (container, $container) {
+    var self = this;
+
+    MultipleSelection.__super__.bind.apply(this, arguments);
+
+    this.$selection.on('click', function (evt) {
+      self.trigger('toggle', {
+        originalEvent: evt
+      });
+    });
+
+    this.$selection.on(
+      'click',
+      '.select2-selection__choice__remove',
+      function (evt) {
+        // Ignore the event if it is disabled
+        if (self.options.get('disabled')) {
+          return;
+        }
+
+        var $remove = $(this);
+        var $selection = $remove.parent();
+
+        var data = Utils.GetData($selection[0], 'data');
+
+        self.trigger('unselect', {
+          originalEvent: evt,
+          data: data
+        });
+      }
+    );
+  };
+
+  MultipleSelection.prototype.clear = function () {
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+    $rendered.empty();
+    $rendered.removeAttr('title');
+  };
+
+  MultipleSelection.prototype.display = function (data, container) {
+    var template = this.options.get('templateSelection');
+    var escapeMarkup = this.options.get('escapeMarkup');
+
+    return escapeMarkup(template(data, container));
+  };
+
+  MultipleSelection.prototype.selectionContainer = function () {
+    var $container = $(
+      '<li class="select2-selection__choice">' +
+        '<span class="select2-selection__choice__remove" role="presentation">' +
+          '&times;' +
+        '</span>' +
+      '</li>'
+    );
+
+    return $container;
+  };
+
+  MultipleSelection.prototype.update = function (data) {
+    this.clear();
+
+    if (data.length === 0) {
+      return;
+    }
+
+    var $selections = [];
+
+    for (var d = 0; d < data.length; d++) {
+      var selection = data[d];
+
+      var $selection = this.selectionContainer();
+      var formatted = this.display(selection, $selection);
+
+      $selection.append(formatted);
+      $selection.attr('title', selection.title || selection.text);
+
+      Utils.StoreData($selection[0], 'data', selection);
+
+      $selections.push($selection);
+    }
+
+    var $rendered = this.$selection.find('.select2-selection__rendered');
+
+    Utils.appendMany($rendered, $selections);
+  };
+
+  return MultipleSelection;
+});
+
+S2.define('select2/selection/placeholder',[
+  '../utils'
+], function (Utils) {
+  function Placeholder (decorated, $element, options) {
+    this.placeholder = this.normalizePlaceholder(options.get('placeholder'));
+
+    decorated.call(this, $element, options);
+  }
+
+  Placeholder.prototype.normalizePlaceholder = function (_, placeholder) {
+    if (typeof placeholder === 'string') {
+      placeholder = {
+        id: '',
+        text: placeholder
+      };
+    }
+
+    return placeholder;
+  };
+
+  Placeholder.prototype.createPlaceholder = function (decorated, placeholder) {
+    var $placeholder = this.selectionContainer();
+
+    $placeholder.html(this.display(placeholder));
+    $placeholder.addClass('select2-selection__placeholder')
+                .removeClass('select2-selection__choice');
+
+    return $placeholder;
+  };
+
+  Placeholder.prototype.update = function (decorated, data) {
+    var singlePlaceholder = (
+      data.length == 1 && data[0].id != this.placeholder.id
+    );
+    var multipleSelections = data.length > 1;
+
+    if (multipleSelections || singlePlaceholder) {
+      return decorated.call(this, data);
+    }
+
+    this.clear();
+
+    var $placeholder = this.createPlaceholder(this.placeholder);
+
+    this.$selection.find('.select2-selection__rendered').append($placeholder);
+  };
+
+  return Placeholder;
+});
+
+S2.define('select2/selection/allowClear',[
+  'jquery',
+  '../keys',
+  '../utils'
+], function ($, KEYS, Utils) {
+  function AllowClear () { }
+
+  AllowClear.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    if (this.placeholder == null) {
+      if (this.options.get('debug') && window.console && console.error) {
+        console.error(
+          'Select2: The `allowClear` option should be used in combination ' +
+          'with the `placeholder` option.'
+        );
+      }
+    }
+
+    this.$selection.on('mousedown', '.select2-selection__clear',
+      function (evt) {
+        self._handleClear(evt);
+    });
+
+    container.on('keypress', function (evt) {
+      self._handleKeyboardClear(evt, container);
+    });
+  };
+
+  AllowClear.prototype._handleClear = function (_, evt) {
+    // Ignore the event if it is disabled
+    if (this.options.get('disabled')) {
+      return;
+    }
+
+    var $clear = this.$selection.find('.select2-selection__clear');
+
+    // Ignore the event if nothing has been selected
+    if ($clear.length === 0) {
+      return;
+    }
+
+    evt.stopPropagation();
+
+    var data = Utils.GetData($clear[0], 'data');
+
+    var previousVal = this.$element.val();
+    this.$element.val(this.placeholder.id);
+
+    var unselectData = {
+      data: data
+    };
+    this.trigger('clear', unselectData);
+    if (unselectData.prevented) {
+      this.$element.val(previousVal);
+      return;
+    }
+
+    for (var d = 0; d < data.length; d++) {
+      unselectData = {
+        data: data[d]
+      };
+
+      // Trigger the `unselect` event, so people can prevent it from being
+      // cleared.
+      this.trigger('unselect', unselectData);
+
+      // If the event was prevented, don't clear it out.
+      if (unselectData.prevented) {
+        this.$element.val(previousVal);
+        return;
+      }
+    }
+
+    this.$element.trigger('change');
+
+    this.trigger('toggle', {});
+  };
+
+  AllowClear.prototype._handleKeyboardClear = function (_, evt, container) {
+    if (container.isOpen()) {
+      return;
+    }
+
+    if (evt.which == KEYS.DELETE || evt.which == KEYS.BACKSPACE) {
+      this._handleClear(evt);
+    }
+  };
+
+  AllowClear.prototype.update = function (decorated, data) {
+    decorated.call(this, data);
+
+    if (this.$selection.find('.select2-selection__placeholder').length > 0 ||
+        data.length === 0) {
+      return;
+    }
+
+    var removeAll = this.options.get('translations').get('removeAllItems');   
+
+    var $remove = $(
+      '<span class="select2-selection__clear" title="' + removeAll() +'">' +
+        '&times;' +
+      '</span>'
+    );
+    Utils.StoreData($remove[0], 'data', data);
+
+    this.$selection.find('.select2-selection__rendered').prepend($remove);
+  };
+
+  return AllowClear;
+});
+
+S2.define('select2/selection/search',[
+  'jquery',
+  '../utils',
+  '../keys'
+], function ($, Utils, KEYS) {
+  function Search (decorated, $element, options) {
+    decorated.call(this, $element, options);
+  }
+
+  Search.prototype.render = function (decorated) {
+    var $search = $(
+      '<li class="select2-search select2-search--inline">' +
+        '<input class="select2-search__field" type="search" tabindex="-1"' +
+        ' autocomplete="off" autocorrect="off" autocapitalize="none"' +
+        ' spellcheck="false" role="textbox" aria-autocomplete="list" />' +
+      '</li>'
+    );
+
+    this.$searchContainer = $search;
+    this.$search = $search.find('input');
+
+    var $rendered = decorated.call(this);
+
+    this._transferTabIndex();
+
+    return $rendered;
+  };
+
+  Search.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('open', function () {
+      self.$search.trigger('focus');
+    });
+
+    container.on('close', function () {
+      self.$search.val('');
+      self.$search.removeAttr('aria-activedescendant');
+      self.$search.trigger('focus');
+    });
+
+    container.on('enable', function () {
+      self.$search.prop('disabled', false);
+
+      self._transferTabIndex();
+    });
+
+    container.on('disable', function () {
+      self.$search.prop('disabled', true);
+    });
+
+    container.on('focus', function (evt) {
+      self.$search.trigger('focus');
+    });
+
+    container.on('results:focus', function (params) {
+      self.$search.attr('aria-activedescendant', params.id);
+    });
+
+    this.$selection.on('focusin', '.select2-search--inline', function (evt) {
+      self.trigger('focus', evt);
+    });
+
+    this.$selection.on('focusout', '.select2-search--inline', function (evt) {
+      self._handleBlur(evt);
+    });
+
+    this.$selection.on('keydown', '.select2-search--inline', function (evt) {
+      evt.stopPropagation();
+
+      self.trigger('keypress', evt);
+
+      self._keyUpPrevented = evt.isDefaultPrevented();
+
+      var key = evt.which;
+
+      if (key === KEYS.BACKSPACE && self.$search.val() === '') {
+        var $previousChoice = self.$searchContainer
+          .prev('.select2-selection__choice');
+
+        if ($previousChoice.length > 0) {
+          var item = Utils.GetData($previousChoice[0], 'data');
+
+          self.searchRemoveChoice(item);
+
+          evt.preventDefault();
+        }
+      }
+    });
+
+    // Try to detect the IE version should the `documentMode` property that
+    // is stored on the document. This is only implemented in IE and is
+    // slightly cleaner than doing a user agent check.
+    // This property is not available in Edge, but Edge also doesn't have
+    // this bug.
+    var msie = document.documentMode;
+    var disableInputEvents = msie && msie <= 11;
+
+    // Workaround for browsers which do not support the `input` event
+    // This will prevent double-triggering of events for browsers which support
+    // both the `keyup` and `input` events.
+    this.$selection.on(
+      'input.searchcheck',
+      '.select2-search--inline',
+      function (evt) {
+        // IE will trigger the `input` event when a placeholder is used on a
+        // search box. To get around this issue, we are forced to ignore all
+        // `input` events in IE and keep using `keyup`.
+        if (disableInputEvents) {
+          self.$selection.off('input.search input.searchcheck');
+          return;
+        }
+
+        // Unbind the duplicated `keyup` event
+        self.$selection.off('keyup.search');
+      }
+    );
+
+    this.$selection.on(
+      'keyup.search input.search',
+      '.select2-search--inline',
+      function (evt) {
+        // IE will trigger the `input` event when a placeholder is used on a
+        // search box. To get around this issue, we are forced to ignore all
+        // `input` events in IE and keep using `keyup`.
+        if (disableInputEvents && evt.type === 'input') {
+          self.$selection.off('input.search input.searchcheck');
+          return;
+        }
+
+        var key = evt.which;
+
+        // We can freely ignore events from modifier keys
+        if (key == KEYS.SHIFT || key == KEYS.CTRL || key == KEYS.ALT) {
+          return;
+        }
+
+        // Tabbing will be handled during the `keydown` phase
+        if (key == KEYS.TAB) {
+          return;
+        }
+
+        self.handleSearch(evt);
+      }
+    );
+  };
+
+  /**
+   * This method will transfer the tabindex attribute from the rendered
+   * selection to the search box. This allows for the search box to be used as
+   * the primary focus instead of the selection container.
+   *
+   * @private
+   */
+  Search.prototype._transferTabIndex = function (decorated) {
+    this.$search.attr('tabindex', this.$selection.attr('tabindex'));
+    this.$selection.attr('tabindex', '-1');
+  };
+
+  Search.prototype.createPlaceholder = function (decorated, placeholder) {
+    this.$search.attr('placeholder', placeholder.text);
+  };
+
+  Search.prototype.update = function (decorated, data) {
+    var searchHadFocus = this.$search[0] == document.activeElement;
+
+    this.$search.attr('placeholder', '');
+
+    decorated.call(this, data);
+
+    this.$selection.find('.select2-selection__rendered')
+                   .append(this.$searchContainer);
+
+    this.resizeSearch();
+    if (searchHadFocus) {
+      this.$search.trigger('focus');
+    }
+  };
+
+  Search.prototype.handleSearch = function () {
+    this.resizeSearch();
+
+    if (!this._keyUpPrevented) {
+      var input = this.$search.val();
+
+      this.trigger('query', {
+        term: input
+      });
+    }
+
+    this._keyUpPrevented = false;
+  };
+
+  Search.prototype.searchRemoveChoice = function (decorated, item) {
+    this.trigger('unselect', {
+      data: item
+    });
+
+    this.$search.val(item.text);
+    this.handleSearch();
+  };
+
+  Search.prototype.resizeSearch = function () {
+    this.$search.css('width', '25px');
+
+    var width = '';
+
+    if (this.$search.attr('placeholder') !== '') {
+      width = this.$selection.find('.select2-selection__rendered').innerWidth();
+    } else {
+      var minimumWidth = this.$search.val().length + 1;
+
+      width = (minimumWidth * 0.75) + 'em';
+    }
+
+    this.$search.css('width', width);
+  };
+
+  return Search;
+});
+
+S2.define('select2/selection/eventRelay',[
+  'jquery'
+], function ($) {
+  function EventRelay () { }
+
+  EventRelay.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+    var relayEvents = [
+      'open', 'opening',
+      'close', 'closing',
+      'select', 'selecting',
+      'unselect', 'unselecting',
+      'clear', 'clearing'
+    ];
+
+    var preventableEvents = [
+      'opening', 'closing', 'selecting', 'unselecting', 'clearing'
+    ];
+
+    decorated.call(this, container, $container);
+
+    container.on('*', function (name, params) {
+      // Ignore events that should not be relayed
+      if ($.inArray(name, relayEvents) === -1) {
+        return;
+      }
+
+      // The parameters should always be an object
+      params = params || {};
+
+      // Generate the jQuery event for the Select2 event
+      var evt = $.Event('select2:' + name, {
+        params: params
+      });
+
+      self.$element.trigger(evt);
+
+      // Only handle preventable events if it was one
+      if ($.inArray(name, preventableEvents) === -1) {
+        return;
+      }
+
+      params.prevented = evt.isDefaultPrevented();
+    });
+  };
+
+  return EventRelay;
+});
+
+S2.define('select2/translation',[
+  'jquery',
+  'require'
+], function ($, require) {
+  function Translation (dict) {
+    this.dict = dict || {};
+  }
+
+  Translation.prototype.all = function () {
+    return this.dict;
+  };
+
+  Translation.prototype.get = function (key) {
+    return this.dict[key];
+  };
+
+  Translation.prototype.extend = function (translation) {
+    this.dict = $.extend({}, translation.all(), this.dict);
+  };
+
+  // Static functions
+
+  Translation._cache = {};
+
+  Translation.loadPath = function (path) {
+    if (!(path in Translation._cache)) {
+      var translations = require(path);
+
+      Translation._cache[path] = translations;
+    }
+
+    return new Translation(Translation._cache[path]);
+  };
+
+  return Translation;
+});
+
+S2.define('select2/diacritics',[
+
+], function () {
+  var diacritics = {
+    '\u24B6': 'A',
+    '\uFF21': 'A',
+    '\u00C0': 'A',
+    '\u00C1': 'A',
+    '\u00C2': 'A',
+    '\u1EA6': 'A',
+    '\u1EA4': 'A',
+    '\u1EAA': 'A',
+    '\u1EA8': 'A',
+    '\u00C3': 'A',
+    '\u0100': 'A',
+    '\u0102': 'A',
+    '\u1EB0': 'A',
+    '\u1EAE': 'A',
+    '\u1EB4': 'A',
+    '\u1EB2': 'A',
+    '\u0226': 'A',
+    '\u01E0': 'A',
+    '\u00C4': 'A',
+    '\u01DE': 'A',
+    '\u1EA2': 'A',
+    '\u00C5': 'A',
+    '\u01FA': 'A',
+    '\u01CD': 'A',
+    '\u0200': 'A',
+    '\u0202': 'A',
+    '\u1EA0': 'A',
+    '\u1EAC': 'A',
+    '\u1EB6': 'A',
+    '\u1E00': 'A',
+    '\u0104': 'A',
+    '\u023A': 'A',
+    '\u2C6F': 'A',
+    '\uA732': 'AA',
+    '\u00C6': 'AE',
+    '\u01FC': 'AE',
+    '\u01E2': 'AE',
+    '\uA734': 'AO',
+    '\uA736': 'AU',
+    '\uA738': 'AV',
+    '\uA73A': 'AV',
+    '\uA73C': 'AY',
+    '\u24B7': 'B',
+    '\uFF22': 'B',
+    '\u1E02': 'B',
+    '\u1E04': 'B',
+    '\u1E06': 'B',
+    '\u0243': 'B',
+    '\u0182': 'B',
+    '\u0181': 'B',
+    '\u24B8': 'C',
+    '\uFF23': 'C',
+    '\u0106': 'C',
+    '\u0108': 'C',
+    '\u010A': 'C',
+    '\u010C': 'C',
+    '\u00C7': 'C',
+    '\u1E08': 'C',
+    '\u0187': 'C',
+    '\u023B': 'C',
+    '\uA73E': 'C',
+    '\u24B9': 'D',
+    '\uFF24': 'D',
+    '\u1E0A': 'D',
+    '\u010E': 'D',
+    '\u1E0C': 'D',
+    '\u1E10': 'D',
+    '\u1E12': 'D',
+    '\u1E0E': 'D',
+    '\u0110': 'D',
+    '\u018B': 'D',
+    '\u018A': 'D',
+    '\u0189': 'D',
+    '\uA779': 'D',
+    '\u01F1': 'DZ',
+    '\u01C4': 'DZ',
+    '\u01F2': 'Dz',
+    '\u01C5': 'Dz',
+    '\u24BA': 'E',
+    '\uFF25': 'E',
+    '\u00C8': 'E',
+    '\u00C9': 'E',
+    '\u00CA': 'E',
+    '\u1EC0': 'E',
+    '\u1EBE': 'E',
+    '\u1EC4': 'E',
+    '\u1EC2': 'E',
+    '\u1EBC': 'E',
+    '\u0112': 'E',
+    '\u1E14': 'E',
+    '\u1E16': 'E',
+    '\u0114': 'E',
+    '\u0116': 'E',
+    '\u00CB': 'E',
+    '\u1EBA': 'E',
+    '\u011A': 'E',
+    '\u0204': 'E',
+    '\u0206': 'E',
+    '\u1EB8': 'E',
+    '\u1EC6': 'E',
+    '\u0228': 'E',
+    '\u1E1C': 'E',
+    '\u0118': 'E',
+    '\u1E18': 'E',
+    '\u1E1A': 'E',
+    '\u0190': 'E',
+    '\u018E': 'E',
+    '\u24BB': 'F',
+    '\uFF26': 'F',
+    '\u1E1E': 'F',
+    '\u0191': 'F',
+    '\uA77B': 'F',
+    '\u24BC': 'G',
+    '\uFF27': 'G',
+    '\u01F4': 'G',
+    '\u011C': 'G',
+    '\u1E20': 'G',
+    '\u011E': 'G',
+    '\u0120': 'G',
+    '\u01E6': 'G',
+    '\u0122': 'G',
+    '\u01E4': 'G',
+    '\u0193': 'G',
+    '\uA7A0': 'G',
+    '\uA77D': 'G',
+    '\uA77E': 'G',
+    '\u24BD': 'H',
+    '\uFF28': 'H',
+    '\u0124': 'H',
+    '\u1E22': 'H',
+    '\u1E26': 'H',
+    '\u021E': 'H',
+    '\u1E24': 'H',
+    '\u1E28': 'H',
+    '\u1E2A': 'H',
+    '\u0126': 'H',
+    '\u2C67': 'H',
+    '\u2C75': 'H',
+    '\uA78D': 'H',
+    '\u24BE': 'I',
+    '\uFF29': 'I',
+    '\u00CC': 'I',
+    '\u00CD': 'I',
+    '\u00CE': 'I',
+    '\u0128': 'I',
+    '\u012A': 'I',
+    '\u012C': 'I',
+    '\u0130': 'I',
+    '\u00CF': 'I',
+    '\u1E2E': 'I',
+    '\u1EC8': 'I',
+    '\u01CF': 'I',
+    '\u0208': 'I',
+    '\u020A': 'I',
+    '\u1ECA': 'I',
+    '\u012E': 'I',
+    '\u1E2C': 'I',
+    '\u0197': 'I',
+    '\u24BF': 'J',
+    '\uFF2A': 'J',
+    '\u0134': 'J',
+    '\u0248': 'J',
+    '\u24C0': 'K',
+    '\uFF2B': 'K',
+    '\u1E30': 'K',
+    '\u01E8': 'K',
+    '\u1E32': 'K',
+    '\u0136': 'K',
+    '\u1E34': 'K',
+    '\u0198': 'K',
+    '\u2C69': 'K',
+    '\uA740': 'K',
+    '\uA742': 'K',
+    '\uA744': 'K',
+    '\uA7A2': 'K',
+    '\u24C1': 'L',
+    '\uFF2C': 'L',
+    '\u013F': 'L',
+    '\u0139': 'L',
+    '\u013D': 'L',
+    '\u1E36': 'L',
+    '\u1E38': 'L',
+    '\u013B': 'L',
+    '\u1E3C': 'L',
+    '\u1E3A': 'L',
+    '\u0141': 'L',
+    '\u023D': 'L',
+    '\u2C62': 'L',
+    '\u2C60': 'L',
+    '\uA748': 'L',
+    '\uA746': 'L',
+    '\uA780': 'L',
+    '\u01C7': 'LJ',
+    '\u01C8': 'Lj',
+    '\u24C2': 'M',
+    '\uFF2D': 'M',
+    '\u1E3E': 'M',
+    '\u1E40': 'M',
+    '\u1E42': 'M',
+    '\u2C6E': 'M',
+    '\u019C': 'M',
+    '\u24C3': 'N',
+    '\uFF2E': 'N',
+    '\u01F8': 'N',
+    '\u0143': 'N',
+    '\u00D1': 'N',
+    '\u1E44': 'N',
+    '\u0147': 'N',
+    '\u1E46': 'N',
+    '\u0145': 'N',
+    '\u1E4A': 'N',
+    '\u1E48': 'N',
+    '\u0220': 'N',
+    '\u019D': 'N',
+    '\uA790': 'N',
+    '\uA7A4': 'N',
+    '\u01CA': 'NJ',
+    '\u01CB': 'Nj',
+    '\u24C4': 'O',
+    '\uFF2F': 'O',
+    '\u00D2': 'O',
+    '\u00D3': 'O',
+    '\u00D4': 'O',
+    '\u1ED2': 'O',
+    '\u1ED0': 'O',
+    '\u1ED6': 'O',
+    '\u1ED4': 'O',
+    '\u00D5': 'O',
+    '\u1E4C': 'O',
+    '\u022C': 'O',
+    '\u1E4E': 'O',
+    '\u014C': 'O',
+    '\u1E50': 'O',
+    '\u1E52': 'O',
+    '\u014E': 'O',
+    '\u022E': 'O',
+    '\u0230': 'O',
+    '\u00D6': 'O',
+    '\u022A': 'O',
+    '\u1ECE': 'O',
+    '\u0150': 'O',
+    '\u01D1': 'O',
+    '\u020C': 'O',
+    '\u020E': 'O',
+    '\u01A0': 'O',
+    '\u1EDC': 'O',
+    '\u1EDA': 'O',
+    '\u1EE0': 'O',
+    '\u1EDE': 'O',
+    '\u1EE2': 'O',
+    '\u1ECC': 'O',
+    '\u1ED8': 'O',
+    '\u01EA': 'O',
+    '\u01EC': 'O',
+    '\u00D8': 'O',
+    '\u01FE': 'O',
+    '\u0186': 'O',
+    '\u019F': 'O',
+    '\uA74A': 'O',
+    '\uA74C': 'O',
+    '\u0152': 'OE',
+    '\u01A2': 'OI',
+    '\uA74E': 'OO',
+    '\u0222': 'OU',
+    '\u24C5': 'P',
+    '\uFF30': 'P',
+    '\u1E54': 'P',
+    '\u1E56': 'P',
+    '\u01A4': 'P',
+    '\u2C63': 'P',
+    '\uA750': 'P',
+    '\uA752': 'P',
+    '\uA754': 'P',
+    '\u24C6': 'Q',
+    '\uFF31': 'Q',
+    '\uA756': 'Q',
+    '\uA758': 'Q',
+    '\u024A': 'Q',
+    '\u24C7': 'R',
+    '\uFF32': 'R',
+    '\u0154': 'R',
+    '\u1E58': 'R',
+    '\u0158': 'R',
+    '\u0210': 'R',
+    '\u0212': 'R',
+    '\u1E5A': 'R',
+    '\u1E5C': 'R',
+    '\u0156': 'R',
+    '\u1E5E': 'R',
+    '\u024C': 'R',
+    '\u2C64': 'R',
+    '\uA75A': 'R',
+    '\uA7A6': 'R',
+    '\uA782': 'R',
+    '\u24C8': 'S',
+    '\uFF33': 'S',
+    '\u1E9E': 'S',
+    '\u015A': 'S',
+    '\u1E64': 'S',
+    '\u015C': 'S',
+    '\u1E60': 'S',
+    '\u0160': 'S',
+    '\u1E66': 'S',
+    '\u1E62': 'S',
+    '\u1E68': 'S',
+    '\u0218': 'S',
+    '\u015E': 'S',
+    '\u2C7E': 'S',
+    '\uA7A8': 'S',
+    '\uA784': 'S',
+    '\u24C9': 'T',
+    '\uFF34': 'T',
+    '\u1E6A': 'T',
+    '\u0164': 'T',
+    '\u1E6C': 'T',
+    '\u021A': 'T',
+    '\u0162': 'T',
+    '\u1E70': 'T',
+    '\u1E6E': 'T',
+    '\u0166': 'T',
+    '\u01AC': 'T',
+    '\u01AE': 'T',
+    '\u023E': 'T',
+    '\uA786': 'T',
+    '\uA728': 'TZ',
+    '\u24CA': 'U',
+    '\uFF35': 'U',
+    '\u00D9': 'U',
+    '\u00DA': 'U',
+    '\u00DB': 'U',
+    '\u0168': 'U',
+    '\u1E78': 'U',
+    '\u016A': 'U',
+    '\u1E7A': 'U',
+    '\u016C': 'U',
+    '\u00DC': 'U',
+    '\u01DB': 'U',
+    '\u01D7': 'U',
+    '\u01D5': 'U',
+    '\u01D9': 'U',
+    '\u1EE6': 'U',
+    '\u016E': 'U',
+    '\u0170': 'U',
+    '\u01D3': 'U',
+    '\u0214': 'U',
+    '\u0216': 'U',
+    '\u01AF': 'U',
+    '\u1EEA': 'U',
+    '\u1EE8': 'U',
+    '\u1EEE': 'U',
+    '\u1EEC': 'U',
+    '\u1EF0': 'U',
+    '\u1EE4': 'U',
+    '\u1E72': 'U',
+    '\u0172': 'U',
+    '\u1E76': 'U',
+    '\u1E74': 'U',
+    '\u0244': 'U',
+    '\u24CB': 'V',
+    '\uFF36': 'V',
+    '\u1E7C': 'V',
+    '\u1E7E': 'V',
+    '\u01B2': 'V',
+    '\uA75E': 'V',
+    '\u0245': 'V',
+    '\uA760': 'VY',
+    '\u24CC': 'W',
+    '\uFF37': 'W',
+    '\u1E80': 'W',
+    '\u1E82': 'W',
+    '\u0174': 'W',
+    '\u1E86': 'W',
+    '\u1E84': 'W',
+    '\u1E88': 'W',
+    '\u2C72': 'W',
+    '\u24CD': 'X',
+    '\uFF38': 'X',
+    '\u1E8A': 'X',
+    '\u1E8C': 'X',
+    '\u24CE': 'Y',
+    '\uFF39': 'Y',
+    '\u1EF2': 'Y',
+    '\u00DD': 'Y',
+    '\u0176': 'Y',
+    '\u1EF8': 'Y',
+    '\u0232': 'Y',
+    '\u1E8E': 'Y',
+    '\u0178': 'Y',
+    '\u1EF6': 'Y',
+    '\u1EF4': 'Y',
+    '\u01B3': 'Y',
+    '\u024E': 'Y',
+    '\u1EFE': 'Y',
+    '\u24CF': 'Z',
+    '\uFF3A': 'Z',
+    '\u0179': 'Z',
+    '\u1E90': 'Z',
+    '\u017B': 'Z',
+    '\u017D': 'Z',
+    '\u1E92': 'Z',
+    '\u1E94': 'Z',
+    '\u01B5': 'Z',
+    '\u0224': 'Z',
+    '\u2C7F': 'Z',
+    '\u2C6B': 'Z',
+    '\uA762': 'Z',
+    '\u24D0': 'a',
+    '\uFF41': 'a',
+    '\u1E9A': 'a',
+    '\u00E0': 'a',
+    '\u00E1': 'a',
+    '\u00E2': 'a',
+    '\u1EA7': 'a',
+    '\u1EA5': 'a',
+    '\u1EAB': 'a',
+    '\u1EA9': 'a',
+    '\u00E3': 'a',
+    '\u0101': 'a',
+    '\u0103': 'a',
+    '\u1EB1': 'a',
+    '\u1EAF': 'a',
+    '\u1EB5': 'a',
+    '\u1EB3': 'a',
+    '\u0227': 'a',
+    '\u01E1': 'a',
+    '\u00E4': 'a',
+    '\u01DF': 'a',
+    '\u1EA3': 'a',
+    '\u00E5': 'a',
+    '\u01FB': 'a',
+    '\u01CE': 'a',
+    '\u0201': 'a',
+    '\u0203': 'a',
+    '\u1EA1': 'a',
+    '\u1EAD': 'a',
+    '\u1EB7': 'a',
+    '\u1E01': 'a',
+    '\u0105': 'a',
+    '\u2C65': 'a',
+    '\u0250': 'a',
+    '\uA733': 'aa',
+    '\u00E6': 'ae',
+    '\u01FD': 'ae',
+    '\u01E3': 'ae',
+    '\uA735': 'ao',
+    '\uA737': 'au',
+    '\uA739': 'av',
+    '\uA73B': 'av',
+    '\uA73D': 'ay',
+    '\u24D1': 'b',
+    '\uFF42': 'b',
+    '\u1E03': 'b',
+    '\u1E05': 'b',
+    '\u1E07': 'b',
+    '\u0180': 'b',
+    '\u0183': 'b',
+    '\u0253': 'b',
+    '\u24D2': 'c',
+    '\uFF43': 'c',
+    '\u0107': 'c',
+    '\u0109': 'c',
+    '\u010B': 'c',
+    '\u010D': 'c',
+    '\u00E7': 'c',
+    '\u1E09': 'c',
+    '\u0188': 'c',
+    '\u023C': 'c',
+    '\uA73F': 'c',
+    '\u2184': 'c',
+    '\u24D3': 'd',
+    '\uFF44': 'd',
+    '\u1E0B': 'd',
+    '\u010F': 'd',
+    '\u1E0D': 'd',
+    '\u1E11': 'd',
+    '\u1E13': 'd',
+    '\u1E0F': 'd',
+    '\u0111': 'd',
+    '\u018C': 'd',
+    '\u0256': 'd',
+    '\u0257': 'd',
+    '\uA77A': 'd',
+    '\u01F3': 'dz',
+    '\u01C6': 'dz',
+    '\u24D4': 'e',
+    '\uFF45': 'e',
+    '\u00E8': 'e',
+    '\u00E9': 'e',
+    '\u00EA': 'e',
+    '\u1EC1': 'e',
+    '\u1EBF': 'e',
+    '\u1EC5': 'e',
+    '\u1EC3': 'e',
+    '\u1EBD': 'e',
+    '\u0113': 'e',
+    '\u1E15': 'e',
+    '\u1E17': 'e',
+    '\u0115': 'e',
+    '\u0117': 'e',
+    '\u00EB': 'e',
+    '\u1EBB': 'e',
+    '\u011B': 'e',
+    '\u0205': 'e',
+    '\u0207': 'e',
+    '\u1EB9': 'e',
+    '\u1EC7': 'e',
+    '\u0229': 'e',
+    '\u1E1D': 'e',
+    '\u0119': 'e',
+    '\u1E19': 'e',
+    '\u1E1B': 'e',
+    '\u0247': 'e',
+    '\u025B': 'e',
+    '\u01DD': 'e',
+    '\u24D5': 'f',
+    '\uFF46': 'f',
+    '\u1E1F': 'f',
+    '\u0192': 'f',
+    '\uA77C': 'f',
+    '\u24D6': 'g',
+    '\uFF47': 'g',
+    '\u01F5': 'g',
+    '\u011D': 'g',
+    '\u1E21': 'g',
+    '\u011F': 'g',
+    '\u0121': 'g',
+    '\u01E7': 'g',
+    '\u0123': 'g',
+    '\u01E5': 'g',
+    '\u0260': 'g',
+    '\uA7A1': 'g',
+    '\u1D79': 'g',
+    '\uA77F': 'g',
+    '\u24D7': 'h',
+    '\uFF48': 'h',
+    '\u0125': 'h',
+    '\u1E23': 'h',
+    '\u1E27': 'h',
+    '\u021F': 'h',
+    '\u1E25': 'h',
+    '\u1E29': 'h',
+    '\u1E2B': 'h',
+    '\u1E96': 'h',
+    '\u0127': 'h',
+    '\u2C68': 'h',
+    '\u2C76': 'h',
+    '\u0265': 'h',
+    '\u0195': 'hv',
+    '\u24D8': 'i',
+    '\uFF49': 'i',
+    '\u00EC': 'i',
+    '\u00ED': 'i',
+    '\u00EE': 'i',
+    '\u0129': 'i',
+    '\u012B': 'i',
+    '\u012D': 'i',
+    '\u00EF': 'i',
+    '\u1E2F': 'i',
+    '\u1EC9': 'i',
+    '\u01D0': 'i',
+    '\u0209': 'i',
+    '\u020B': 'i',
+    '\u1ECB': 'i',
+    '\u012F': 'i',
+    '\u1E2D': 'i',
+    '\u0268': 'i',
+    '\u0131': 'i',
+    '\u24D9': 'j',
+    '\uFF4A': 'j',
+    '\u0135': 'j',
+    '\u01F0': 'j',
+    '\u0249': 'j',
+    '\u24DA': 'k',
+    '\uFF4B': 'k',
+    '\u1E31': 'k',
+    '\u01E9': 'k',
+    '\u1E33': 'k',
+    '\u0137': 'k',
+    '\u1E35': 'k',
+    '\u0199': 'k',
+    '\u2C6A': 'k',
+    '\uA741': 'k',
+    '\uA743': 'k',
+    '\uA745': 'k',
+    '\uA7A3': 'k',
+    '\u24DB': 'l',
+    '\uFF4C': 'l',
+    '\u0140': 'l',
+    '\u013A': 'l',
+    '\u013E': 'l',
+    '\u1E37': 'l',
+    '\u1E39': 'l',
+    '\u013C': 'l',
+    '\u1E3D': 'l',
+    '\u1E3B': 'l',
+    '\u017F': 'l',
+    '\u0142': 'l',
+    '\u019A': 'l',
+    '\u026B': 'l',
+    '\u2C61': 'l',
+    '\uA749': 'l',
+    '\uA781': 'l',
+    '\uA747': 'l',
+    '\u01C9': 'lj',
+    '\u24DC': 'm',
+    '\uFF4D': 'm',
+    '\u1E3F': 'm',
+    '\u1E41': 'm',
+    '\u1E43': 'm',
+    '\u0271': 'm',
+    '\u026F': 'm',
+    '\u24DD': 'n',
+    '\uFF4E': 'n',
+    '\u01F9': 'n',
+    '\u0144': 'n',
+    '\u00F1': 'n',
+    '\u1E45': 'n',
+    '\u0148': 'n',
+    '\u1E47': 'n',
+    '\u0146': 'n',
+    '\u1E4B': 'n',
+    '\u1E49': 'n',
+    '\u019E': 'n',
+    '\u0272': 'n',
+    '\u0149': 'n',
+    '\uA791': 'n',
+    '\uA7A5': 'n',
+    '\u01CC': 'nj',
+    '\u24DE': 'o',
+    '\uFF4F': 'o',
+    '\u00F2': 'o',
+    '\u00F3': 'o',
+    '\u00F4': 'o',
+    '\u1ED3': 'o',
+    '\u1ED1': 'o',
+    '\u1ED7': 'o',
+    '\u1ED5': 'o',
+    '\u00F5': 'o',
+    '\u1E4D': 'o',
+    '\u022D': 'o',
+    '\u1E4F': 'o',
+    '\u014D': 'o',
+    '\u1E51': 'o',
+    '\u1E53': 'o',
+    '\u014F': 'o',
+    '\u022F': 'o',
+    '\u0231': 'o',
+    '\u00F6': 'o',
+    '\u022B': 'o',
+    '\u1ECF': 'o',
+    '\u0151': 'o',
+    '\u01D2': 'o',
+    '\u020D': 'o',
+    '\u020F': 'o',
+    '\u01A1': 'o',
+    '\u1EDD': 'o',
+    '\u1EDB': 'o',
+    '\u1EE1': 'o',
+    '\u1EDF': 'o',
+    '\u1EE3': 'o',
+    '\u1ECD': 'o',
+    '\u1ED9': 'o',
+    '\u01EB': 'o',
+    '\u01ED': 'o',
+    '\u00F8': 'o',
+    '\u01FF': 'o',
+    '\u0254': 'o',
+    '\uA74B': 'o',
+    '\uA74D': 'o',
+    '\u0275': 'o',
+    '\u0153': 'oe',
+    '\u01A3': 'oi',
+    '\u0223': 'ou',
+    '\uA74F': 'oo',
+    '\u24DF': 'p',
+    '\uFF50': 'p',
+    '\u1E55': 'p',
+    '\u1E57': 'p',
+    '\u01A5': 'p',
+    '\u1D7D': 'p',
+    '\uA751': 'p',
+    '\uA753': 'p',
+    '\uA755': 'p',
+    '\u24E0': 'q',
+    '\uFF51': 'q',
+    '\u024B': 'q',
+    '\uA757': 'q',
+    '\uA759': 'q',
+    '\u24E1': 'r',
+    '\uFF52': 'r',
+    '\u0155': 'r',
+    '\u1E59': 'r',
+    '\u0159': 'r',
+    '\u0211': 'r',
+    '\u0213': 'r',
+    '\u1E5B': 'r',
+    '\u1E5D': 'r',
+    '\u0157': 'r',
+    '\u1E5F': 'r',
+    '\u024D': 'r',
+    '\u027D': 'r',
+    '\uA75B': 'r',
+    '\uA7A7': 'r',
+    '\uA783': 'r',
+    '\u24E2': 's',
+    '\uFF53': 's',
+    '\u00DF': 's',
+    '\u015B': 's',
+    '\u1E65': 's',
+    '\u015D': 's',
+    '\u1E61': 's',
+    '\u0161': 's',
+    '\u1E67': 's',
+    '\u1E63': 's',
+    '\u1E69': 's',
+    '\u0219': 's',
+    '\u015F': 's',
+    '\u023F': 's',
+    '\uA7A9': 's',
+    '\uA785': 's',
+    '\u1E9B': 's',
+    '\u24E3': 't',
+    '\uFF54': 't',
+    '\u1E6B': 't',
+    '\u1E97': 't',
+    '\u0165': 't',
+    '\u1E6D': 't',
+    '\u021B': 't',
+    '\u0163': 't',
+    '\u1E71': 't',
+    '\u1E6F': 't',
+    '\u0167': 't',
+    '\u01AD': 't',
+    '\u0288': 't',
+    '\u2C66': 't',
+    '\uA787': 't',
+    '\uA729': 'tz',
+    '\u24E4': 'u',
+    '\uFF55': 'u',
+    '\u00F9': 'u',
+    '\u00FA': 'u',
+    '\u00FB': 'u',
+    '\u0169': 'u',
+    '\u1E79': 'u',
+    '\u016B': 'u',
+    '\u1E7B': 'u',
+    '\u016D': 'u',
+    '\u00FC': 'u',
+    '\u01DC': 'u',
+    '\u01D8': 'u',
+    '\u01D6': 'u',
+    '\u01DA': 'u',
+    '\u1EE7': 'u',
+    '\u016F': 'u',
+    '\u0171': 'u',
+    '\u01D4': 'u',
+    '\u0215': 'u',
+    '\u0217': 'u',
+    '\u01B0': 'u',
+    '\u1EEB': 'u',
+    '\u1EE9': 'u',
+    '\u1EEF': 'u',
+    '\u1EED': 'u',
+    '\u1EF1': 'u',
+    '\u1EE5': 'u',
+    '\u1E73': 'u',
+    '\u0173': 'u',
+    '\u1E77': 'u',
+    '\u1E75': 'u',
+    '\u0289': 'u',
+    '\u24E5': 'v',
+    '\uFF56': 'v',
+    '\u1E7D': 'v',
+    '\u1E7F': 'v',
+    '\u028B': 'v',
+    '\uA75F': 'v',
+    '\u028C': 'v',
+    '\uA761': 'vy',
+    '\u24E6': 'w',
+    '\uFF57': 'w',
+    '\u1E81': 'w',
+    '\u1E83': 'w',
+    '\u0175': 'w',
+    '\u1E87': 'w',
+    '\u1E85': 'w',
+    '\u1E98': 'w',
+    '\u1E89': 'w',
+    '\u2C73': 'w',
+    '\u24E7': 'x',
+    '\uFF58': 'x',
+    '\u1E8B': 'x',
+    '\u1E8D': 'x',
+    '\u24E8': 'y',
+    '\uFF59': 'y',
+    '\u1EF3': 'y',
+    '\u00FD': 'y',
+    '\u0177': 'y',
+    '\u1EF9': 'y',
+    '\u0233': 'y',
+    '\u1E8F': 'y',
+    '\u00FF': 'y',
+    '\u1EF7': 'y',
+    '\u1E99': 'y',
+    '\u1EF5': 'y',
+    '\u01B4': 'y',
+    '\u024F': 'y',
+    '\u1EFF': 'y',
+    '\u24E9': 'z',
+    '\uFF5A': 'z',
+    '\u017A': 'z',
+    '\u1E91': 'z',
+    '\u017C': 'z',
+    '\u017E': 'z',
+    '\u1E93': 'z',
+    '\u1E95': 'z',
+    '\u01B6': 'z',
+    '\u0225': 'z',
+    '\u0240': 'z',
+    '\u2C6C': 'z',
+    '\uA763': 'z',
+    '\u0386': '\u0391',
+    '\u0388': '\u0395',
+    '\u0389': '\u0397',
+    '\u038A': '\u0399',
+    '\u03AA': '\u0399',
+    '\u038C': '\u039F',
+    '\u038E': '\u03A5',
+    '\u03AB': '\u03A5',
+    '\u038F': '\u03A9',
+    '\u03AC': '\u03B1',
+    '\u03AD': '\u03B5',
+    '\u03AE': '\u03B7',
+    '\u03AF': '\u03B9',
+    '\u03CA': '\u03B9',
+    '\u0390': '\u03B9',
+    '\u03CC': '\u03BF',
+    '\u03CD': '\u03C5',
+    '\u03CB': '\u03C5',
+    '\u03B0': '\u03C5',
+    '\u03CE': '\u03C9',
+    '\u03C2': '\u03C3',
+    '\u2019': '\''
+  };
+
+  return diacritics;
+});
+
+S2.define('select2/data/base',[
+  '../utils'
+], function (Utils) {
+  function BaseAdapter ($element, options) {
+    BaseAdapter.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(BaseAdapter, Utils.Observable);
+
+  BaseAdapter.prototype.current = function (callback) {
+    throw new Error('The `current` method must be defined in child classes.');
+  };
+
+  BaseAdapter.prototype.query = function (params, callback) {
+    throw new Error('The `query` method must be defined in child classes.');
+  };
+
+  BaseAdapter.prototype.bind = function (container, $container) {
+    // Can be implemented in subclasses
+  };
+
+  BaseAdapter.prototype.destroy = function () {
+    // Can be implemented in subclasses
+  };
+
+  BaseAdapter.prototype.generateResultId = function (container, data) {
+    var id = container.id + '-result-';
+
+    id += Utils.generateChars(4);
+
+    if (data.id != null) {
+      id += '-' + data.id.toString();
+    } else {
+      id += '-' + Utils.generateChars(4);
+    }
+    return id;
+  };
+
+  return BaseAdapter;
+});
+
+S2.define('select2/data/select',[
+  './base',
+  '../utils',
+  'jquery'
+], function (BaseAdapter, Utils, $) {
+  function SelectAdapter ($element, options) {
+    this.$element = $element;
+    this.options = options;
+
+    SelectAdapter.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(SelectAdapter, BaseAdapter);
+
+  SelectAdapter.prototype.current = function (callback) {
+    var data = [];
+    var self = this;
+
+    this.$element.find(':selected').each(function () {
+      var $option = $(this);
+
+      var option = self.item($option);
+
+      data.push(option);
+    });
+
+    callback(data);
+  };
+
+  SelectAdapter.prototype.select = function (data) {
+    var self = this;
+
+    data.selected = true;
+
+    // If data.element is a DOM node, use it instead
+    if ($(data.element).is('option')) {
+      data.element.selected = true;
+
+      this.$element.trigger('change');
+
+      return;
+    }
+
+    if (this.$element.prop('multiple')) {
+      this.current(function (currentData) {
+        var val = [];
+
+        data = [data];
+        data.push.apply(data, currentData);
+
+        for (var d = 0; d < data.length; d++) {
+          var id = data[d].id;
+
+          if ($.inArray(id, val) === -1) {
+            val.push(id);
+          }
+        }
+
+        self.$element.val(val);
+        self.$element.trigger('change');
+      });
+    } else {
+      var val = data.id;
+
+      this.$element.val(val);
+      this.$element.trigger('change');
+    }
+  };
+
+  SelectAdapter.prototype.unselect = function (data) {
+    var self = this;
+
+    if (!this.$element.prop('multiple')) {
+      return;
+    }
+
+    data.selected = false;
+
+    if ($(data.element).is('option')) {
+      data.element.selected = false;
+
+      this.$element.trigger('change');
+
+      return;
+    }
+
+    this.current(function (currentData) {
+      var val = [];
+
+      for (var d = 0; d < currentData.length; d++) {
+        var id = currentData[d].id;
+
+        if (id !== data.id && $.inArray(id, val) === -1) {
+          val.push(id);
+        }
+      }
+
+      self.$element.val(val);
+
+      self.$element.trigger('change');
+    });
+  };
+
+  SelectAdapter.prototype.bind = function (container, $container) {
+    var self = this;
+
+    this.container = container;
+
+    container.on('select', function (params) {
+      self.select(params.data);
+    });
+
+    container.on('unselect', function (params) {
+      self.unselect(params.data);
+    });
+  };
+
+  SelectAdapter.prototype.destroy = function () {
+    // Remove anything added to child elements
+    this.$element.find('*').each(function () {
+      // Remove any custom data set by Select2
+      Utils.RemoveData(this);
+    });
+  };
+
+  SelectAdapter.prototype.query = function (params, callback) {
+    var data = [];
+    var self = this;
+
+    var $options = this.$element.children();
+
+    $options.each(function () {
+      var $option = $(this);
+
+      if (!$option.is('option') && !$option.is('optgroup')) {
+        return;
+      }
+
+      var option = self.item($option);
+
+      var matches = self.matches(params, option);
+
+      if (matches !== null) {
+        data.push(matches);
+      }
+    });
+
+    callback({
+      results: data
+    });
+  };
+
+  SelectAdapter.prototype.addOptions = function ($options) {
+    Utils.appendMany(this.$element, $options);
+  };
+
+  SelectAdapter.prototype.option = function (data) {
+    var option;
+
+    if (data.children) {
+      option = document.createElement('optgroup');
+      option.label = data.text;
+    } else {
+      option = document.createElement('option');
+
+      if (option.textContent !== undefined) {
+        option.textContent = data.text;
+      } else {
+        option.innerText = data.text;
+      }
+    }
+
+    if (data.id !== undefined) {
+      option.value = data.id;
+    }
+
+    if (data.disabled) {
+      option.disabled = true;
+    }
+
+    if (data.selected) {
+      option.selected = true;
+    }
+
+    if (data.title) {
+      option.title = data.title;
+    }
+
+    var $option = $(option);
+
+    var normalizedData = this._normalizeItem(data);
+    normalizedData.element = option;
+
+    // Override the option's data with the combined data
+    Utils.StoreData(option, 'data', normalizedData);
+
+    return $option;
+  };
+
+  SelectAdapter.prototype.item = function ($option) {
+    var data = {};
+
+    data = Utils.GetData($option[0], 'data');
+
+    if (data != null) {
+      return data;
+    }
+
+    if ($option.is('option')) {
+      data = {
+        id: $option.val(),
+        text: $option.text(),
+        disabled: $option.prop('disabled'),
+        selected: $option.prop('selected'),
+        title: $option.prop('title')
+      };
+    } else if ($option.is('optgroup')) {
+      data = {
+        text: $option.prop('label'),
+        children: [],
+        title: $option.prop('title')
+      };
+
+      var $children = $option.children('option');
+      var children = [];
+
+      for (var c = 0; c < $children.length; c++) {
+        var $child = $($children[c]);
+
+        var child = this.item($child);
+
+        children.push(child);
+      }
+
+      data.children = children;
+    }
+
+    data = this._normalizeItem(data);
+    data.element = $option[0];
+
+    Utils.StoreData($option[0], 'data', data);
+
+    return data;
+  };
+
+  SelectAdapter.prototype._normalizeItem = function (item) {
+    if (item !== Object(item)) {
+      item = {
+        id: item,
+        text: item
+      };
+    }
+
+    item = $.extend({}, {
+      text: ''
+    }, item);
+
+    var defaults = {
+      selected: false,
+      disabled: false
+    };
+
+    if (item.id != null) {
+      item.id = item.id.toString();
+    }
+
+    if (item.text != null) {
+      item.text = item.text.toString();
+    }
+
+    if (item._resultId == null && item.id && this.container != null) {
+      item._resultId = this.generateResultId(this.container, item);
+    }
+
+    return $.extend({}, defaults, item);
+  };
+
+  SelectAdapter.prototype.matches = function (params, data) {
+    var matcher = this.options.get('matcher');
+
+    return matcher(params, data);
+  };
+
+  return SelectAdapter;
+});
+
+S2.define('select2/data/array',[
+  './select',
+  '../utils',
+  'jquery'
+], function (SelectAdapter, Utils, $) {
+  function ArrayAdapter ($element, options) {
+    var data = options.get('data') || [];
+
+    ArrayAdapter.__super__.constructor.call(this, $element, options);
+
+    this.addOptions(this.convertToOptions(data));
+  }
+
+  Utils.Extend(ArrayAdapter, SelectAdapter);
+
+  ArrayAdapter.prototype.select = function (data) {
+    var $option = this.$element.find('option').filter(function (i, elm) {
+      return elm.value == data.id.toString();
+    });
+
+    if ($option.length === 0) {
+      $option = this.option(data);
+
+      this.addOptions($option);
+    }
+
+    ArrayAdapter.__super__.select.call(this, data);
+  };
+
+  ArrayAdapter.prototype.convertToOptions = function (data) {
+    var self = this;
+
+    var $existing = this.$element.find('option');
+    var existingIds = $existing.map(function () {
+      return self.item($(this)).id;
+    }).get();
+
+    var $options = [];
+
+    // Filter out all items except for the one passed in the argument
+    function onlyItem (item) {
+      return function () {
+        return $(this).val() == item.id;
+      };
+    }
+
+    for (var d = 0; d < data.length; d++) {
+      var item = this._normalizeItem(data[d]);
+
+      // Skip items which were pre-loaded, only merge the data
+      if ($.inArray(item.id, existingIds) >= 0) {
+        var $existingOption = $existing.filter(onlyItem(item));
+
+        var existingData = this.item($existingOption);
+        var newData = $.extend(true, {}, item, existingData);
+
+        var $newOption = this.option(newData);
+
+        $existingOption.replaceWith($newOption);
+
+        continue;
+      }
+
+      var $option = this.option(item);
+
+      if (item.children) {
+        var $children = this.convertToOptions(item.children);
+
+        Utils.appendMany($option, $children);
+      }
+
+      $options.push($option);
+    }
+
+    return $options;
+  };
+
+  return ArrayAdapter;
+});
+
+S2.define('select2/data/ajax',[
+  './array',
+  '../utils',
+  'jquery'
+], function (ArrayAdapter, Utils, $) {
+  function AjaxAdapter ($element, options) {
+    this.ajaxOptions = this._applyDefaults(options.get('ajax'));
+
+    if (this.ajaxOptions.processResults != null) {
+      this.processResults = this.ajaxOptions.processResults;
+    }
+
+    AjaxAdapter.__super__.constructor.call(this, $element, options);
+  }
+
+  Utils.Extend(AjaxAdapter, ArrayAdapter);
+
+  AjaxAdapter.prototype._applyDefaults = function (options) {
+    var defaults = {
+      data: function (params) {
+        return $.extend({}, params, {
+          q: params.term
+        });
+      },
+      transport: function (params, success, failure) {
+        var $request = $.ajax(params);
+
+        $request.then(success);
+        $request.fail(failure);
+
+        return $request;
+      }
+    };
+
+    return $.extend({}, defaults, options, true);
+  };
+
+  AjaxAdapter.prototype.processResults = function (results) {
+    return results;
+  };
+
+  AjaxAdapter.prototype.query = function (params, callback) {
+    var matches = [];
+    var self = this;
+
+    if (this._request != null) {
+      // JSONP requests cannot always be aborted
+      if ($.isFunction(this._request.abort)) {
+        this._request.abort();
+      }
+
+      this._request = null;
+    }
+
+    var options = $.extend({
+      type: 'GET'
+    }, this.ajaxOptions);
+
+    if (typeof options.url === 'function') {
+      options.url = options.url.call(this.$element, params);
+    }
+
+    if (typeof options.data === 'function') {
+      options.data = options.data.call(this.$element, params);
+    }
+
+    function request () {
+      var $request = options.transport(options, function (data) {
+        var results = self.processResults(data, params);
+
+        if (self.options.get('debug') && window.console && console.error) {
+          // Check to make sure that the response included a `results` key.
+          if (!results || !results.results || !$.isArray(results.results)) {
+            console.error(
+              'Select2: The AJAX results did not return an array in the ' +
+              '`results` key of the response.'
+            );
+          }
+        }
+
+        callback(results);
+      }, function () {
+        // Attempt to detect if a request was aborted
+        // Only works if the transport exposes a status property
+        if ('status' in $request &&
+            ($request.status === 0 || $request.status === '0')) {
+          return;
+        }
+
+        self.trigger('results:message', {
+          message: 'errorLoading'
+        });
+      });
+
+      self._request = $request;
+    }
+
+    if (this.ajaxOptions.delay && params.term != null) {
+      if (this._queryTimeout) {
+        window.clearTimeout(this._queryTimeout);
+      }
+
+      this._queryTimeout = window.setTimeout(request, this.ajaxOptions.delay);
+    } else {
+      request();
+    }
+  };
+
+  return AjaxAdapter;
+});
+
+S2.define('select2/data/tags',[
+  'jquery'
+], function ($) {
+  function Tags (decorated, $element, options) {
+    var tags = options.get('tags');
+
+    var createTag = options.get('createTag');
+
+    if (createTag !== undefined) {
+      this.createTag = createTag;
+    }
+
+    var insertTag = options.get('insertTag');
+
+    if (insertTag !== undefined) {
+        this.insertTag = insertTag;
+    }
+
+    decorated.call(this, $element, options);
+
+    if ($.isArray(tags)) {
+      for (var t = 0; t < tags.length; t++) {
+        var tag = tags[t];
+        var item = this._normalizeItem(tag);
+
+        var $option = this.option(item);
+
+        this.$element.append($option);
+      }
+    }
+  }
+
+  Tags.prototype.query = function (decorated, params, callback) {
+    var self = this;
+
+    this._removeOldTags();
+
+    if (params.term == null || params.page != null) {
+      decorated.call(this, params, callback);
+      return;
+    }
+
+    function wrapper (obj, child) {
+      var data = obj.results;
+
+      for (var i = 0; i < data.length; i++) {
+        var option = data[i];
+
+        var checkChildren = (
+          option.children != null &&
+          !wrapper({
+            results: option.children
+          }, true)
+        );
+
+        var optionText = (option.text || '').toUpperCase();
+        var paramsTerm = (params.term || '').toUpperCase();
+
+        var checkText = optionText === paramsTerm;
+
+        if (checkText || checkChildren) {
+          if (child) {
+            return false;
+          }
+
+          obj.data = data;
+          callback(obj);
+
+          return;
+        }
+      }
+
+      if (child) {
+        return true;
+      }
+
+      var tag = self.createTag(params);
+
+      if (tag != null) {
+        var $option = self.option(tag);
+        $option.attr('data-select2-tag', true);
+
+        self.addOptions([$option]);
+
+        self.insertTag(data, tag);
+      }
+
+      obj.results = data;
+
+      callback(obj);
+    }
+
+    decorated.call(this, params, wrapper);
+  };
+
+  Tags.prototype.createTag = function (decorated, params) {
+    var term = $.trim(params.term);
+
+    if (term === '') {
+      return null;
+    }
+
+    return {
+      id: term,
+      text: term
+    };
+  };
+
+  Tags.prototype.insertTag = function (_, data, tag) {
+    data.unshift(tag);
+  };
+
+  Tags.prototype._removeOldTags = function (_) {
+    var tag = this._lastTag;
+
+    var $options = this.$element.find('option[data-select2-tag]');
+
+    $options.each(function () {
+      if (this.selected) {
+        return;
+      }
+
+      $(this).remove();
+    });
+  };
+
+  return Tags;
+});
+
+S2.define('select2/data/tokenizer',[
+  'jquery'
+], function ($) {
+  function Tokenizer (decorated, $element, options) {
+    var tokenizer = options.get('tokenizer');
+
+    if (tokenizer !== undefined) {
+      this.tokenizer = tokenizer;
+    }
+
+    decorated.call(this, $element, options);
+  }
+
+  Tokenizer.prototype.bind = function (decorated, container, $container) {
+    decorated.call(this, container, $container);
+
+    this.$search =  container.dropdown.$search || container.selection.$search ||
+      $container.find('.select2-search__field');
+  };
+
+  Tokenizer.prototype.query = function (decorated, params, callback) {
+    var self = this;
+
+    function createAndSelect (data) {
+      // Normalize the data object so we can use it for checks
+      var item = self._normalizeItem(data);
+
+      // Check if the data object already exists as a tag
+      // Select it if it doesn't
+      var $existingOptions = self.$element.find('option').filter(function () {
+        return $(this).val() === item.id;
+      });
+
+      // If an existing option wasn't found for it, create the option
+      if (!$existingOptions.length) {
+        var $option = self.option(item);
+        $option.attr('data-select2-tag', true);
+
+        self._removeOldTags();
+        self.addOptions([$option]);
+      }
+
+      // Select the item, now that we know there is an option for it
+      select(item);
+    }
+
+    function select (data) {
+      self.trigger('select', {
+        data: data
+      });
+    }
+
+    params.term = params.term || '';
+
+    var tokenData = this.tokenizer(params, this.options, createAndSelect);
+
+    if (tokenData.term !== params.term) {
+      // Replace the search term if we have the search box
+      if (this.$search.length) {
+        this.$search.val(tokenData.term);
+        this.$search.trigger('focus');
+      }
+
+      params.term = tokenData.term;
+    }
+
+    decorated.call(this, params, callback);
+  };
+
+  Tokenizer.prototype.tokenizer = function (_, params, options, callback) {
+    var separators = options.get('tokenSeparators') || [];
+    var term = params.term;
+    var i = 0;
+
+    var createTag = this.createTag || function (params) {
+      return {
+        id: params.term,
+        text: params.term
+      };
+    };
+
+    while (i < term.length) {
+      var termChar = term[i];
+
+      if ($.inArray(termChar, separators) === -1) {
+        i++;
+
+        continue;
+      }
+
+      var part = term.substr(0, i);
+      var partParams = $.extend({}, params, {
+        term: part
+      });
+
+      var data = createTag(partParams);
+
+      if (data == null) {
+        i++;
+        continue;
+      }
+
+      callback(data);
+
+      // Reset the term to not include the tokenized portion
+      term = term.substr(i + 1) || '';
+      i = 0;
+    }
+
+    return {
+      term: term
+    };
+  };
+
+  return Tokenizer;
+});
+
+S2.define('select2/data/minimumInputLength',[
+
+], function () {
+  function MinimumInputLength (decorated, $e, options) {
+    this.minimumInputLength = options.get('minimumInputLength');
+
+    decorated.call(this, $e, options);
+  }
+
+  MinimumInputLength.prototype.query = function (decorated, params, callback) {
+    params.term = params.term || '';
+
+    if (params.term.length < this.minimumInputLength) {
+      this.trigger('results:message', {
+        message: 'inputTooShort',
+        args: {
+          minimum: this.minimumInputLength,
+          input: params.term,
+          params: params
+        }
+      });
+
+      return;
+    }
+
+    decorated.call(this, params, callback);
+  };
+
+  return MinimumInputLength;
+});
+
+S2.define('select2/data/maximumInputLength',[
+
+], function () {
+  function MaximumInputLength (decorated, $e, options) {
+    this.maximumInputLength = options.get('maximumInputLength');
+
+    decorated.call(this, $e, options);
+  }
+
+  MaximumInputLength.prototype.query = function (decorated, params, callback) {
+    params.term = params.term || '';
+
+    if (this.maximumInputLength > 0 &&
+        params.term.length > this.maximumInputLength) {
+      this.trigger('results:message', {
+        message: 'inputTooLong',
+        args: {
+          maximum: this.maximumInputLength,
+          input: params.term,
+          params: params
+        }
+      });
+
+      return;
+    }
+
+    decorated.call(this, params, callback);
+  };
+
+  return MaximumInputLength;
+});
+
+S2.define('select2/data/maximumSelectionLength',[
+
+], function (){
+  function MaximumSelectionLength (decorated, $e, options) {
+    this.maximumSelectionLength = options.get('maximumSelectionLength');
+
+    decorated.call(this, $e, options);
+  }
+
+  MaximumSelectionLength.prototype.query =
+    function (decorated, params, callback) {
+      var self = this;
+
+      this.current(function (currentData) {
+        var count = currentData != null ? currentData.length : 0;
+        if (self.maximumSelectionLength > 0 &&
+          count >= self.maximumSelectionLength) {
+          self.trigger('results:message', {
+            message: 'maximumSelected',
+            args: {
+              maximum: self.maximumSelectionLength
+            }
+          });
+          return;
+        }
+        decorated.call(self, params, callback);
+      });
+  };
+
+  return MaximumSelectionLength;
+});
+
+S2.define('select2/dropdown',[
+  'jquery',
+  './utils'
+], function ($, Utils) {
+  function Dropdown ($element, options) {
+    this.$element = $element;
+    this.options = options;
+
+    Dropdown.__super__.constructor.call(this);
+  }
+
+  Utils.Extend(Dropdown, Utils.Observable);
+
+  Dropdown.prototype.render = function () {
+    var $dropdown = $(
+      '<span class="select2-dropdown">' +
+        '<span class="select2-results"></span>' +
+      '</span>'
+    );
+
+    $dropdown.attr('dir', this.options.get('dir'));
+
+    this.$dropdown = $dropdown;
+
+    return $dropdown;
+  };
+
+  Dropdown.prototype.bind = function () {
+    // Should be implemented in subclasses
+  };
+
+  Dropdown.prototype.position = function ($dropdown, $container) {
+    // Should be implemented in subclasses
+  };
+
+  Dropdown.prototype.destroy = function () {
+    // Remove the dropdown from the DOM
+    this.$dropdown.remove();
+  };
+
+  return Dropdown;
+});
+
+S2.define('select2/dropdown/search',[
+  'jquery',
+  '../utils'
+], function ($, Utils) {
+  function Search () { }
+
+  Search.prototype.render = function (decorated) {
+    var $rendered = decorated.call(this);
+
+    var $search = $(
+      '<span class="select2-search select2-search--dropdown">' +
+        '<input class="select2-search__field" type="search" tabindex="-1"' +
+        ' autocomplete="off" autocorrect="off" autocapitalize="none"' +
+        ' spellcheck="false" role="textbox" />' +
+      '</span>'
+    );
+
+    this.$searchContainer = $search;
+    this.$search = $search.find('input');
+
+    $rendered.prepend($search);
+
+    return $rendered;
+  };
+
+  Search.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    this.$search.on('keydown', function (evt) {
+      self.trigger('keypress', evt);
+
+      self._keyUpPrevented = evt.isDefaultPrevented();
+    });
+
+    // Workaround for browsers which do not support the `input` event
+    // This will prevent double-triggering of events for browsers which support
+    // both the `keyup` and `input` events.
+    this.$search.on('input', function (evt) {
+      // Unbind the duplicated `keyup` event
+      $(this).off('keyup');
+    });
+
+    this.$search.on('keyup input', function (evt) {
+      self.handleSearch(evt);
+    });
+
+    container.on('open', function () {
+      self.$search.attr('tabindex', 0);
+
+      self.$search.trigger('focus');
+
+      window.setTimeout(function () {
+        self.$search.trigger('focus');
+      }, 0);
+    });
+
+    container.on('close', function () {
+      self.$search.attr('tabindex', -1);
+
+      self.$search.val('');
+      self.$search.trigger('blur');
+    });
+
+    container.on('focus', function () {
+      if (!container.isOpen()) {
+        self.$search.trigger('focus');
+      }
+    });
+
+    container.on('results:all', function (params) {
+      if (params.query.term == null || params.query.term === '') {
+        var showSearch = self.showSearch(params);
+
+        if (showSearch) {
+          self.$searchContainer.removeClass('select2-search--hide');
+        } else {
+          self.$searchContainer.addClass('select2-search--hide');
+        }
+      }
+    });
+  };
+
+  Search.prototype.handleSearch = function (evt) {
+    if (!this._keyUpPrevented) {
+      var input = this.$search.val();
+
+      this.trigger('query', {
+        term: input
+      });
+    }
+
+    this._keyUpPrevented = false;
+  };
+
+  Search.prototype.showSearch = function (_, params) {
+    return true;
+  };
+
+  return Search;
+});
+
+S2.define('select2/dropdown/hidePlaceholder',[
+
+], function () {
+  function HidePlaceholder (decorated, $element, options, dataAdapter) {
+    this.placeholder = this.normalizePlaceholder(options.get('placeholder'));
+
+    decorated.call(this, $element, options, dataAdapter);
+  }
+
+  HidePlaceholder.prototype.append = function (decorated, data) {
+    data.results = this.removePlaceholder(data.results);
+
+    decorated.call(this, data);
+  };
+
+  HidePlaceholder.prototype.normalizePlaceholder = function (_, placeholder) {
+    if (typeof placeholder === 'string') {
+      placeholder = {
+        id: '',
+        text: placeholder
+      };
+    }
+
+    return placeholder;
+  };
+
+  HidePlaceholder.prototype.removePlaceholder = function (_, data) {
+    var modifiedData = data.slice(0);
+
+    for (var d = data.length - 1; d >= 0; d--) {
+      var item = data[d];
+
+      if (this.placeholder.id === item.id) {
+        modifiedData.splice(d, 1);
+      }
+    }
+
+    return modifiedData;
+  };
+
+  return HidePlaceholder;
+});
+
+S2.define('select2/dropdown/infiniteScroll',[
+  'jquery'
+], function ($) {
+  function InfiniteScroll (decorated, $element, options, dataAdapter) {
+    this.lastParams = {};
+
+    decorated.call(this, $element, options, dataAdapter);
+
+    this.$loadingMore = this.createLoadingMore();
+    this.loading = false;
+  }
+
+  InfiniteScroll.prototype.append = function (decorated, data) {
+    this.$loadingMore.remove();
+    this.loading = false;
+
+    decorated.call(this, data);
+
+    if (this.showLoadingMore(data)) {
+      this.$results.append(this.$loadingMore);
+      this.loadMoreIfNeeded();
+    }
+  };
+
+  InfiniteScroll.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('query', function (params) {
+      self.lastParams = params;
+      self.loading = true;
+    });
+
+    container.on('query:append', function (params) {
+      self.lastParams = params;
+      self.loading = true;
+    });
+
+    this.$results.on('scroll', this.loadMoreIfNeeded.bind(this));
+  };
+
+  InfiniteScroll.prototype.loadMoreIfNeeded = function () {
+    var isLoadMoreVisible = $.contains(
+      document.documentElement,
+      this.$loadingMore[0]
+    );
+
+    if (this.loading || !isLoadMoreVisible) {
+      return;
+    }
+
+    var currentOffset = this.$results.offset().top +
+      this.$results.outerHeight(false);
+    var loadingMoreOffset = this.$loadingMore.offset().top +
+      this.$loadingMore.outerHeight(false);
+
+    if (currentOffset + 50 >= loadingMoreOffset) {
+      this.loadMore();
+    }
+  };
+
+  InfiniteScroll.prototype.loadMore = function () {
+    this.loading = true;
+
+    var params = $.extend({}, {page: 1}, this.lastParams);
+
+    params.page++;
+
+    this.trigger('query:append', params);
+  };
+
+  InfiniteScroll.prototype.showLoadingMore = function (_, data) {
+    return data.pagination && data.pagination.more;
+  };
+
+  InfiniteScroll.prototype.createLoadingMore = function () {
+    var $option = $(
+      '<li ' +
+      'class="select2-results__option select2-results__option--load-more"' +
+      'role="treeitem" aria-disabled="true"></li>'
+    );
+
+    var message = this.options.get('translations').get('loadingMore');
+
+    $option.html(message(this.lastParams));
+
+    return $option;
+  };
+
+  return InfiniteScroll;
+});
+
+S2.define('select2/dropdown/attachBody',[
+  'jquery',
+  '../utils'
+], function ($, Utils) {
+  function AttachBody (decorated, $element, options) {
+    this.$dropdownParent = options.get('dropdownParent') || $(document.body);
+
+    decorated.call(this, $element, options);
+  }
+
+  AttachBody.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    var setupResultsEvents = false;
+
+    decorated.call(this, container, $container);
+
+    container.on('open', function () {
+      self._showDropdown();
+      self._attachPositioningHandler(container);
+
+      if (!setupResultsEvents) {
+        setupResultsEvents = true;
+
+        container.on('results:all', function () {
+          self._positionDropdown();
+          self._resizeDropdown();
+        });
+
+        container.on('results:append', function () {
+          self._positionDropdown();
+          self._resizeDropdown();
+        });
+      }
+    });
+
+    container.on('close', function () {
+      self._hideDropdown();
+      self._detachPositioningHandler(container);
+    });
+
+    this.$dropdownContainer.on('mousedown', function (evt) {
+      evt.stopPropagation();
+    });
+  };
+
+  AttachBody.prototype.destroy = function (decorated) {
+    decorated.call(this);
+
+    this.$dropdownContainer.remove();
+  };
+
+  AttachBody.prototype.position = function (decorated, $dropdown, $container) {
+    // Clone all of the container classes
+    $dropdown.attr('class', $container.attr('class'));
+
+    $dropdown.removeClass('select2');
+    $dropdown.addClass('select2-container--open');
+
+    $dropdown.css({
+      position: 'absolute',
+      top: -999999
+    });
+
+    this.$container = $container;
+  };
+
+  AttachBody.prototype.render = function (decorated) {
+    var $container = $('<span></span>');
+
+    var $dropdown = decorated.call(this);
+    $container.append($dropdown);
+
+    this.$dropdownContainer = $container;
+
+    return $container;
+  };
+
+  AttachBody.prototype._hideDropdown = function (decorated) {
+    this.$dropdownContainer.detach();
+  };
+
+  AttachBody.prototype._attachPositioningHandler =
+      function (decorated, container) {
+    var self = this;
+
+    var scrollEvent = 'scroll.select2.' + container.id;
+    var resizeEvent = 'resize.select2.' + container.id;
+    var orientationEvent = 'orientationchange.select2.' + container.id;
+
+    var $watchers = this.$container.parents().filter(Utils.hasScroll);
+    $watchers.each(function () {
+      Utils.StoreData(this, 'select2-scroll-position', {
+        x: $(this).scrollLeft(),
+        y: $(this).scrollTop()
+      });
+    });
+
+    $watchers.on(scrollEvent, function (ev) {
+      var position = Utils.GetData(this, 'select2-scroll-position');
+      $(this).scrollTop(position.y);
+    });
+
+    $(window).on(scrollEvent + ' ' + resizeEvent + ' ' + orientationEvent,
+      function (e) {
+      self._positionDropdown();
+      self._resizeDropdown();
+    });
+  };
+
+  AttachBody.prototype._detachPositioningHandler =
+      function (decorated, container) {
+    var scrollEvent = 'scroll.select2.' + container.id;
+    var resizeEvent = 'resize.select2.' + container.id;
+    var orientationEvent = 'orientationchange.select2.' + container.id;
+
+    var $watchers = this.$container.parents().filter(Utils.hasScroll);
+    $watchers.off(scrollEvent);
+
+    $(window).off(scrollEvent + ' ' + resizeEvent + ' ' + orientationEvent);
+  };
+
+  AttachBody.prototype._positionDropdown = function () {
+    var $window = $(window);
+
+    var isCurrentlyAbove = this.$dropdown.hasClass('select2-dropdown--above');
+    var isCurrentlyBelow = this.$dropdown.hasClass('select2-dropdown--below');
+
+    var newDirection = null;
+
+    var offset = this.$container.offset();
+
+    offset.bottom = offset.top + this.$container.outerHeight(false);
+
+    var container = {
+      height: this.$container.outerHeight(false)
+    };
+
+    container.top = offset.top;
+    container.bottom = offset.top + container.height;
+
+    var dropdown = {
+      height: this.$dropdown.outerHeight(false)
+    };
+
+    var viewport = {
+      top: $window.scrollTop(),
+      bottom: $window.scrollTop() + $window.height()
+    };
+
+    var enoughRoomAbove = viewport.top < (offset.top - dropdown.height);
+    var enoughRoomBelow = viewport.bottom > (offset.bottom + dropdown.height);
+
+    var css = {
+      left: offset.left,
+      top: container.bottom
+    };
+
+    // Determine what the parent element is to use for calculating the offset
+    var $offsetParent = this.$dropdownParent;
+
+    // For statically positioned elements, we need to get the element
+    // that is determining the offset
+    if ($offsetParent.css('position') === 'static') {
+      $offsetParent = $offsetParent.offsetParent();
+    }
+
+    var parentOffset = $offsetParent.offset();
+
+    css.top -= parentOffset.top;
+    css.left -= parentOffset.left;
+
+    if (!isCurrentlyAbove && !isCurrentlyBelow) {
+      newDirection = 'below';
+    }
+
+    if (!enoughRoomBelow && enoughRoomAbove && !isCurrentlyAbove) {
+      newDirection = 'above';
+    } else if (!enoughRoomAbove && enoughRoomBelow && isCurrentlyAbove) {
+      newDirection = 'below';
+    }
+
+    if (newDirection == 'above' ||
+      (isCurrentlyAbove && newDirection !== 'below')) {
+      css.top = container.top - parentOffset.top - dropdown.height;
+    }
+
+    if (newDirection != null) {
+      this.$dropdown
+        .removeClass('select2-dropdown--below select2-dropdown--above')
+        .addClass('select2-dropdown--' + newDirection);
+      this.$container
+        .removeClass('select2-container--below select2-container--above')
+        .addClass('select2-container--' + newDirection);
+    }
+
+    this.$dropdownContainer.css(css);
+  };
+
+  AttachBody.prototype._resizeDropdown = function () {
+    var css = {
+      width: this.$container.outerWidth(false) + 'px'
+    };
+
+    if (this.options.get('dropdownAutoWidth')) {
+      css.minWidth = css.width;
+      css.position = 'relative';
+      css.width = 'auto';
+    }
+
+    this.$dropdown.css(css);
+  };
+
+  AttachBody.prototype._showDropdown = function (decorated) {
+    this.$dropdownContainer.appendTo(this.$dropdownParent);
+
+    this._positionDropdown();
+    this._resizeDropdown();
+  };
+
+  return AttachBody;
+});
+
+S2.define('select2/dropdown/minimumResultsForSearch',[
+
+], function () {
+  function countResults (data) {
+    var count = 0;
+
+    for (var d = 0; d < data.length; d++) {
+      var item = data[d];
+
+      if (item.children) {
+        count += countResults(item.children);
+      } else {
+        count++;
+      }
+    }
+
+    return count;
+  }
+
+  function MinimumResultsForSearch (decorated, $element, options, dataAdapter) {
+    this.minimumResultsForSearch = options.get('minimumResultsForSearch');
+
+    if (this.minimumResultsForSearch < 0) {
+      this.minimumResultsForSearch = Infinity;
+    }
+
+    decorated.call(this, $element, options, dataAdapter);
+  }
+
+  MinimumResultsForSearch.prototype.showSearch = function (decorated, params) {
+    if (countResults(params.data.results) < this.minimumResultsForSearch) {
+      return false;
+    }
+
+    return decorated.call(this, params);
+  };
+
+  return MinimumResultsForSearch;
+});
+
+S2.define('select2/dropdown/selectOnClose',[
+  '../utils'
+], function (Utils) {
+  function SelectOnClose () { }
+
+  SelectOnClose.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('close', function (params) {
+      self._handleSelectOnClose(params);
+    });
+  };
+
+  SelectOnClose.prototype._handleSelectOnClose = function (_, params) {
+    if (params && params.originalSelect2Event != null) {
+      var event = params.originalSelect2Event;
+
+      // Don't select an item if the close event was triggered from a select or
+      // unselect event
+      if (event._type === 'select' || event._type === 'unselect') {
+        return;
+      }
+    }
+
+    var $highlightedResults = this.getHighlightedResults();
+
+    // Only select highlighted results
+    if ($highlightedResults.length < 1) {
+      return;
+    }
+
+    var data = Utils.GetData($highlightedResults[0], 'data');
+
+    // Don't re-select already selected resulte
+    if (
+      (data.element != null && data.element.selected) ||
+      (data.element == null && data.selected)
+    ) {
+      return;
+    }
+
+    this.trigger('select', {
+        data: data
+    });
+  };
+
+  return SelectOnClose;
+});
+
+S2.define('select2/dropdown/closeOnSelect',[
+
+], function () {
+  function CloseOnSelect () { }
+
+  CloseOnSelect.prototype.bind = function (decorated, container, $container) {
+    var self = this;
+
+    decorated.call(this, container, $container);
+
+    container.on('select', function (evt) {
+      self._selectTriggered(evt);
+    });
+
+    container.on('unselect', function (evt) {
+      self._selectTriggered(evt);
+    });
+  };
+
+  CloseOnSelect.prototype._selectTriggered = function (_, evt) {
+    var originalEvent = evt.originalEvent;
+
+    // Don't close if the control key is being held
+    if (originalEvent && (originalEvent.ctrlKey || originalEvent.metaKey)) {
+      return;
+    }
+
+    this.trigger('close', {
+      originalEvent: originalEvent,
+      originalSelect2Event: evt
+    });
+  };
+
+  return CloseOnSelect;
+});
+
+S2.define('select2/i18n/en',[],function () {
+  // English
+  return {
+    errorLoading: function () {
+      return 'The results could not be loaded.';
+    },
+    inputTooLong: function (args) {
+      var overChars = args.input.length - args.maximum;
+
+      var message = 'Please delete ' + overChars + ' character';
+
+      if (overChars != 1) {
+        message += 's';
+      }
+
+      return message;
+    },
+    inputTooShort: function (args) {
+      var remainingChars = args.minimum - args.input.length;
+
+      var message = 'Please enter ' + remainingChars + ' or more characters';
+
+      return message;
+    },
+    loadingMore: function () {
+      return 'Loading more results…';
+    },
+    maximumSelected: function (args) {
+      var message = 'You can only select ' + args.maximum + ' item';
+
+      if (args.maximum != 1) {
+        message += 's';
+      }
+
+      return message;
+    },
+    noResults: function () {
+      return 'No results found';
+    },
+    searching: function () {
+      return 'Searching…';
+    },
+    removeAllItems: function () {
+      return 'Remove all items';
+    }
+  };
+});
+
+S2.define('select2/defaults',[
+  'jquery',
+  'require',
+
+  './results',
+
+  './selection/single',
+  './selection/multiple',
+  './selection/placeholder',
+  './selection/allowClear',
+  './selection/search',
+  './selection/eventRelay',
+
+  './utils',
+  './translation',
+  './diacritics',
+
+  './data/select',
+  './data/array',
+  './data/ajax',
+  './data/tags',
+  './data/tokenizer',
+  './data/minimumInputLength',
+  './data/maximumInputLength',
+  './data/maximumSelectionLength',
+
+  './dropdown',
+  './dropdown/search',
+  './dropdown/hidePlaceholder',
+  './dropdown/infiniteScroll',
+  './dropdown/attachBody',
+  './dropdown/minimumResultsForSearch',
+  './dropdown/selectOnClose',
+  './dropdown/closeOnSelect',
+
+  './i18n/en'
+], function ($, require,
+
+             ResultsList,
+
+             SingleSelection, MultipleSelection, Placeholder, AllowClear,
+             SelectionSearch, EventRelay,
+
+             Utils, Translation, DIACRITICS,
+
+             SelectData, ArrayData, AjaxData, Tags, Tokenizer,
+             MinimumInputLength, MaximumInputLength, MaximumSelectionLength,
+
+             Dropdown, DropdownSearch, HidePlaceholder, InfiniteScroll,
+             AttachBody, MinimumResultsForSearch, SelectOnClose, CloseOnSelect,
+
+             EnglishTranslation) {
+  function Defaults () {
+    this.reset();
+  }
+
+  Defaults.prototype.apply = function (options) {
+    options = $.extend(true, {}, this.defaults, options);
+
+    if (options.dataAdapter == null) {
+      if (options.ajax != null) {
+        options.dataAdapter = AjaxData;
+      } else if (options.data != null) {
+        options.dataAdapter = ArrayData;
+      } else {
+        options.dataAdapter = SelectData;
+      }
+
+      if (options.minimumInputLength > 0) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          MinimumInputLength
+        );
+      }
+
+      if (options.maximumInputLength > 0) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          MaximumInputLength
+        );
+      }
+
+      if (options.maximumSelectionLength > 0) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          MaximumSelectionLength
+        );
+      }
+
+      if (options.tags) {
+        options.dataAdapter = Utils.Decorate(options.dataAdapter, Tags);
+      }
+
+      if (options.tokenSeparators != null || options.tokenizer != null) {
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          Tokenizer
+        );
+      }
+
+      if (options.query != null) {
+        var Query = require(options.amdBase + 'compat/query');
+
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          Query
+        );
+      }
+
+      if (options.initSelection != null) {
+        var InitSelection = require(options.amdBase + 'compat/initSelection');
+
+        options.dataAdapter = Utils.Decorate(
+          options.dataAdapter,
+          InitSelection
+        );
+      }
+    }
+
+    if (options.resultsAdapter == null) {
+      options.resultsAdapter = ResultsList;
+
+      if (options.ajax != null) {
+        options.resultsAdapter = Utils.Decorate(
+          options.resultsAdapter,
+          InfiniteScroll
+        );
+      }
+
+      if (options.placeholder != null) {
+        options.resultsAdapter = Utils.Decorate(
+          options.resultsAdapter,
+          HidePlaceholder
+        );
+      }
+
+      if (options.selectOnClose) {
+        options.resultsAdapter = Utils.Decorate(
+          options.resultsAdapter,
+          SelectOnClose
+        );
+      }
+    }
+
+    if (options.dropdownAdapter == null) {
+      if (options.multiple) {
+        options.dropdownAdapter = Dropdown;
+      } else {
+        var SearchableDropdown = Utils.Decorate(Dropdown, DropdownSearch);
+
+        options.dropdownAdapter = SearchableDropdown;
+      }
+
+      if (options.minimumResultsForSearch !== 0) {
+        options.dropdownAdapter = Utils.Decorate(
+          options.dropdownAdapter,
+          MinimumResultsForSearch
+        );
+      }
+
+      if (options.closeOnSelect) {
+        options.dropdownAdapter = Utils.Decorate(
+          options.dropdownAdapter,
+          CloseOnSelect
+        );
+      }
+
+      if (
+        options.dropdownCssClass != null ||
+        options.dropdownCss != null ||
+        options.adaptDropdownCssClass != null
+      ) {
+        var DropdownCSS = require(options.amdBase + 'compat/dropdownCss');
+
+        options.dropdownAdapter = Utils.Decorate(
+          options.dropdownAdapter,
+          DropdownCSS
+        );
+      }
+
+      options.dropdownAdapter = Utils.Decorate(
+        options.dropdownAdapter,
+        AttachBody
+      );
+    }
+
+    if (options.selectionAdapter == null) {
+      if (options.multiple) {
+        options.selectionAdapter = MultipleSelection;
+      } else {
+        options.selectionAdapter = SingleSelection;
+      }
+
+      // Add the placeholder mixin if a placeholder was specified
+      if (options.placeholder != null) {
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          Placeholder
+        );
+      }
+
+      if (options.allowClear) {
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          AllowClear
+        );
+      }
+
+      if (options.multiple) {
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          SelectionSearch
+        );
+      }
+
+      if (
+        options.containerCssClass != null ||
+        options.containerCss != null ||
+        options.adaptContainerCssClass != null
+      ) {
+        var ContainerCSS = require(options.amdBase + 'compat/containerCss');
+
+        options.selectionAdapter = Utils.Decorate(
+          options.selectionAdapter,
+          ContainerCSS
+        );
+      }
+
+      options.selectionAdapter = Utils.Decorate(
+        options.selectionAdapter,
+        EventRelay
+      );
+    }
+
+    if (typeof options.language === 'string') {
+      // Check if the language is specified with a region
+      if (options.language.indexOf('-') > 0) {
+        // Extract the region information if it is included
+        var languageParts = options.language.split('-');
+        var baseLanguage = languageParts[0];
+
+        options.language = [options.language, baseLanguage];
+      } else {
+        options.language = [options.language];
+      }
+    }
+
+    if ($.isArray(options.language)) {
+      var languages = new Translation();
+      options.language.push('en');
+
+      var languageNames = options.language;
+
+      for (var l = 0; l < languageNames.length; l++) {
+        var name = languageNames[l];
+        var language = {};
+
+        try {
+          // Try to load it with the original name
+          language = Translation.loadPath(name);
+        } catch (e) {
+          try {
+            // If we couldn't load it, check if it wasn't the full path
+            name = this.defaults.amdLanguageBase + name;
+            language = Translation.loadPath(name);
+          } catch (ex) {
+            // The translation could not be loaded at all. Sometimes this is
+            // because of a configuration problem, other times this can be
+            // because of how Select2 helps load all possible translation files.
+            if (options.debug && window.console && console.warn) {
+              console.warn(
+                'Select2: The language file for "' + name + '" could not be ' +
+                'automatically loaded. A fallback will be used instead.'
+              );
+            }
+
+            continue;
+          }
+        }
+
+        languages.extend(language);
+      }
+
+      options.translations = languages;
+    } else {
+      var baseTranslation = Translation.loadPath(
+        this.defaults.amdLanguageBase + 'en'
+      );
+      var customTranslation = new Translation(options.language);
+
+      customTranslation.extend(baseTranslation);
+
+      options.translations = customTranslation;
+    }
+
+    return options;
+  };
+
+  Defaults.prototype.reset = function () {
+    function stripDiacritics (text) {
+      // Used 'uni range + named function' from http://jsperf.com/diacritics/18
+      function match(a) {
+        return DIACRITICS[a] || a;
+      }
+
+      return text.replace(/[^\u0000-\u007E]/g, match);
+    }
+
+    function matcher (params, data) {
+      // Always return the object if there is nothing to compare
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+
+      // Do a recursive check for options with children
+      if (data.children && data.children.length > 0) {
+        // Clone the data object if there are children
+        // This is required as we modify the object to remove any non-matches
+        var match = $.extend(true, {}, data);
+
+        // Check each child of the option
+        for (var c = data.children.length - 1; c >= 0; c--) {
+          var child = data.children[c];
+
+          var matches = matcher(params, child);
+
+          // If there wasn't a match, remove the object in the array
+          if (matches == null) {
+            match.children.splice(c, 1);
+          }
+        }
+
+        // If any children matched, return the new object
+        if (match.children.length > 0) {
+          return match;
+        }
+
+        // If there were no matching children, check just the plain object
+        return matcher(params, match);
+      }
+
+      var original = stripDiacritics(data.text).toUpperCase();
+      var term = stripDiacritics(params.term).toUpperCase();
+
+      // Check if the text contains the term
+      if (original.indexOf(term) > -1) {
+        return data;
+      }
+
+      // If it doesn't contain the term, don't return anything
+      return null;
+    }
+
+    this.defaults = {
+      amdBase: './',
+      amdLanguageBase: './i18n/',
+      closeOnSelect: true,
+      debug: false,
+      dropdownAutoWidth: false,
+      escapeMarkup: Utils.escapeMarkup,
+      language: EnglishTranslation,
+      matcher: matcher,
+      minimumInputLength: 0,
+      maximumInputLength: 0,
+      maximumSelectionLength: 0,
+      minimumResultsForSearch: 0,
+      selectOnClose: false,
+      scrollAfterSelect: false,
+      sorter: function (data) {
+        return data;
+      },
+      templateResult: function (result) {
+        return result.text;
+      },
+      templateSelection: function (selection) {
+        return selection.text;
+      },
+      theme: 'default',
+      width: 'resolve'
+    };
+  };
+
+  Defaults.prototype.set = function (key, value) {
+    var camelKey = $.camelCase(key);
+
+    var data = {};
+    data[camelKey] = value;
+
+    var convertedData = Utils._convertData(data);
+
+    $.extend(true, this.defaults, convertedData);
+  };
+
+  var defaults = new Defaults();
+
+  return defaults;
+});
+
+S2.define('select2/options',[
+  'require',
+  'jquery',
+  './defaults',
+  './utils'
+], function (require, $, Defaults, Utils) {
+  function Options (options, $element) {
+    this.options = options;
+
+    if ($element != null) {
+      this.fromElement($element);
+    }
+
+    this.options = Defaults.apply(this.options);
+
+    if ($element && $element.is('input')) {
+      var InputCompat = require(this.get('amdBase') + 'compat/inputData');
+
+      this.options.dataAdapter = Utils.Decorate(
+        this.options.dataAdapter,
+        InputCompat
+      );
+    }
+  }
+
+  Options.prototype.fromElement = function ($e) {
+    var excludedData = ['select2'];
+
+    if (this.options.multiple == null) {
+      this.options.multiple = $e.prop('multiple');
+    }
+
+    if (this.options.disabled == null) {
+      this.options.disabled = $e.prop('disabled');
+    }
+
+    if (this.options.language == null) {
+      if ($e.prop('lang')) {
+        this.options.language = $e.prop('lang').toLowerCase();
+      } else if ($e.closest('[lang]').prop('lang')) {
+        this.options.language = $e.closest('[lang]').prop('lang');
+      }
+    }
+
+    if (this.options.dir == null) {
+      if ($e.prop('dir')) {
+        this.options.dir = $e.prop('dir');
+      } else if ($e.closest('[dir]').prop('dir')) {
+        this.options.dir = $e.closest('[dir]').prop('dir');
+      } else {
+        this.options.dir = 'ltr';
+      }
+    }
+
+    $e.prop('disabled', this.options.disabled);
+    $e.prop('multiple', this.options.multiple);
+
+    if (Utils.GetData($e[0], 'select2Tags')) {
+      if (this.options.debug && window.console && console.warn) {
+        console.warn(
+          'Select2: The `data-select2-tags` attribute has been changed to ' +
+          'use the `data-data` and `data-tags="true"` attributes and will be ' +
+          'removed in future versions of Select2.'
+        );
+      }
+
+      Utils.StoreData($e[0], 'data', Utils.GetData($e[0], 'select2Tags'));
+      Utils.StoreData($e[0], 'tags', true);
+    }
+
+    if (Utils.GetData($e[0], 'ajaxUrl')) {
+      if (this.options.debug && window.console && console.warn) {
+        console.warn(
+          'Select2: The `data-ajax-url` attribute has been changed to ' +
+          '`data-ajax--url` and support for the old attribute will be removed' +
+          ' in future versions of Select2.'
+        );
+      }
+
+      $e.attr('ajax--url', Utils.GetData($e[0], 'ajaxUrl'));
+      Utils.StoreData($e[0], 'ajax-Url', Utils.GetData($e[0], 'ajaxUrl'));
+    }
+
+    var dataset = {};
+
+    function upperCaseLetter(_, letter) {
+      return letter.toUpperCase();
+    }
+
+    // Pre-load all of the attributes which are prefixed with `data-`
+    for (var attr = 0; attr < $e[0].attributes.length; attr++) {
+      var attributeName = $e[0].attributes[attr].name;
+      var prefix = 'data-';
+
+      if (attributeName.substr(0, prefix.length) == prefix) {
+        // Get the contents of the attribute after `data-`
+        var dataName = attributeName.substring(prefix.length);
+
+        // Get the data contents from the consistent source
+        // This is more than likely the jQuery data helper
+        var dataValue = Utils.GetData($e[0], dataName);
+
+        // camelCase the attribute name to match the spec
+        var camelDataName = dataName.replace(/-([a-z])/g, upperCaseLetter);
+
+        // Store the data attribute contents into the dataset since
+        dataset[camelDataName] = dataValue;
+      }
+    }
+
+    // Prefer the element's `dataset` attribute if it exists
+    // jQuery 1.x does not correctly handle data attributes with multiple dashes
+    if ($.fn.jquery && $.fn.jquery.substr(0, 2) == '1.' && $e[0].dataset) {
+      dataset = $.extend(true, {}, $e[0].dataset, dataset);
+    }
+
+    // Prefer our internal data cache if it exists
+    var data = $.extend(true, {}, Utils.GetData($e[0]), dataset);
+
+    data = Utils._convertData(data);
+
+    for (var key in data) {
+      if ($.inArray(key, excludedData) > -1) {
+        continue;
+      }
+
+      if ($.isPlainObject(this.options[key])) {
+        $.extend(this.options[key], data[key]);
+      } else {
+        this.options[key] = data[key];
+      }
+    }
+
+    return this;
+  };
+
+  Options.prototype.get = function (key) {
+    return this.options[key];
+  };
+
+  Options.prototype.set = function (key, val) {
+    this.options[key] = val;
+  };
+
+  return Options;
+});
+
+S2.define('select2/core',[
+  'jquery',
+  './options',
+  './utils',
+  './keys'
+], function ($, Options, Utils, KEYS) {
+  var Select2 = function ($element, options) {
+    if (Utils.GetData($element[0], 'select2') != null) {
+      Utils.GetData($element[0], 'select2').destroy();
+    }
+
+    this.$element = $element;
+
+    this.id = this._generateId($element);
+
+    options = options || {};
+
+    this.options = new Options(options, $element);
+
+    Select2.__super__.constructor.call(this);
+
+    // Set up the tabindex
+
+    var tabindex = $element.attr('tabindex') || 0;
+    Utils.StoreData($element[0], 'old-tabindex', tabindex);
+    $element.attr('tabindex', '-1');
+
+    // Set up containers and adapters
+
+    var DataAdapter = this.options.get('dataAdapter');
+    this.dataAdapter = new DataAdapter($element, this.options);
+
+    var $container = this.render();
+
+    this._placeContainer($container);
+
+    var SelectionAdapter = this.options.get('selectionAdapter');
+    this.selection = new SelectionAdapter($element, this.options);
+    this.$selection = this.selection.render();
+
+    this.selection.position(this.$selection, $container);
+
+    var DropdownAdapter = this.options.get('dropdownAdapter');
+    this.dropdown = new DropdownAdapter($element, this.options);
+    this.$dropdown = this.dropdown.render();
+
+    this.dropdown.position(this.$dropdown, $container);
+
+    var ResultsAdapter = this.options.get('resultsAdapter');
+    this.results = new ResultsAdapter($element, this.options, this.dataAdapter);
+    this.$results = this.results.render();
+
+    this.results.position(this.$results, this.$dropdown);
+
+    // Bind events
+
+    var self = this;
+
+    // Bind the container to all of the adapters
+    this._bindAdapters();
+
+    // Register any DOM event handlers
+    this._registerDomEvents();
+
+    // Register any internal event handlers
+    this._registerDataEvents();
+    this._registerSelectionEvents();
+    this._registerDropdownEvents();
+    this._registerResultsEvents();
+    this._registerEvents();
+
+    // Set the initial state
+    this.dataAdapter.current(function (initialData) {
+      self.trigger('selection:update', {
+        data: initialData
+      });
+    });
+
+    // Hide the original select
+    $element.addClass('select2-hidden-accessible');
+    $element.attr('aria-hidden', 'true');
+
+    // Synchronize any monitored attributes
+    this._syncAttributes();
+
+    Utils.StoreData($element[0], 'select2', this);
+
+    // Ensure backwards compatibility with $element.data('select2').
+    $element.data('select2', this);
+  };
+
+  Utils.Extend(Select2, Utils.Observable);
+
+  Select2.prototype._generateId = function ($element) {
+    var id = '';
+
+    if ($element.attr('id') != null) {
+      id = $element.attr('id');
+    } else if ($element.attr('name') != null) {
+      id = $element.attr('name') + '-' + Utils.generateChars(2);
+    } else {
+      id = Utils.generateChars(4);
+    }
+
+    id = id.replace(/(:|\.|\[|\]|,)/g, '');
+    id = 'select2-' + id;
+
+    return id;
+  };
+
+  Select2.prototype._placeContainer = function ($container) {
+    $container.insertAfter(this.$element);
+
+    var width = this._resolveWidth(this.$element, this.options.get('width'));
+
+    if (width != null) {
+      $container.css('width', width);
+    }
+  };
+
+  Select2.prototype._resolveWidth = function ($element, method) {
+    var WIDTH = /^width:(([-+]?([0-9]*\.)?[0-9]+)(px|em|ex|%|in|cm|mm|pt|pc))/i;
+
+    if (method == 'resolve') {
+      var styleWidth = this._resolveWidth($element, 'style');
+
+      if (styleWidth != null) {
+        return styleWidth;
+      }
+
+      return this._resolveWidth($element, 'element');
+    }
+
+    if (method == 'element') {
+      var elementWidth = $element.outerWidth(false);
+
+      if (elementWidth <= 0) {
+        return 'auto';
+      }
+
+      return elementWidth + 'px';
+    }
+
+    if (method == 'style') {
+      var style = $element.attr('style');
+
+      if (typeof(style) !== 'string') {
+        return null;
+      }
+
+      var attrs = style.split(';');
+
+      for (var i = 0, l = attrs.length; i < l; i = i + 1) {
+        var attr = attrs[i].replace(/\s/g, '');
+        var matches = attr.match(WIDTH);
+
+        if (matches !== null && matches.length >= 1) {
+          return matches[1];
+        }
+      }
+
+      return null;
+    }
+
+    if (method == 'computedstyle') {
+      var computedStyle = window.getComputedStyle($element[0]);
+
+      return computedStyle.width;
+    }
+
+    return method;
+  };
+
+  Select2.prototype._bindAdapters = function () {
+    this.dataAdapter.bind(this, this.$container);
+    this.selection.bind(this, this.$container);
+
+    this.dropdown.bind(this, this.$container);
+    this.results.bind(this, this.$container);
+  };
+
+  Select2.prototype._registerDomEvents = function () {
+    var self = this;
+
+    this.$element.on('change.select2', function () {
+      self.dataAdapter.current(function (data) {
+        self.trigger('selection:update', {
+          data: data
+        });
+      });
+    });
+
+    this.$element.on('focus.select2', function (evt) {
+      self.trigger('focus', evt);
+    });
+
+    this._syncA = Utils.bind(this._syncAttributes, this);
+    this._syncS = Utils.bind(this._syncSubtree, this);
+
+    if (this.$element[0].attachEvent) {
+      this.$element[0].attachEvent('onpropertychange', this._syncA);
+    }
+
+    var observer = window.MutationObserver ||
+      window.WebKitMutationObserver ||
+      window.MozMutationObserver
+    ;
+
+    if (observer != null) {
+      this._observer = new observer(function (mutations) {
+        $.each(mutations, self._syncA);
+        $.each(mutations, self._syncS);
+      });
+      this._observer.observe(this.$element[0], {
+        attributes: true,
+        childList: true,
+        subtree: false
+      });
+    } else if (this.$element[0].addEventListener) {
+      this.$element[0].addEventListener(
+        'DOMAttrModified',
+        self._syncA,
+        false
+      );
+      this.$element[0].addEventListener(
+        'DOMNodeInserted',
+        self._syncS,
+        false
+      );
+      this.$element[0].addEventListener(
+        'DOMNodeRemoved',
+        self._syncS,
+        false
+      );
+    }
+  };
+
+  Select2.prototype._registerDataEvents = function () {
+    var self = this;
+
+    this.dataAdapter.on('*', function (name, params) {
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerSelectionEvents = function () {
+    var self = this;
+    var nonRelayEvents = ['toggle', 'focus'];
+
+    this.selection.on('toggle', function () {
+      self.toggleDropdown();
+    });
+
+    this.selection.on('focus', function (params) {
+      self.focus(params);
+    });
+
+    this.selection.on('*', function (name, params) {
+      if ($.inArray(name, nonRelayEvents) !== -1) {
+        return;
+      }
+
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerDropdownEvents = function () {
+    var self = this;
+
+    this.dropdown.on('*', function (name, params) {
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerResultsEvents = function () {
+    var self = this;
+
+    this.results.on('*', function (name, params) {
+      self.trigger(name, params);
+    });
+  };
+
+  Select2.prototype._registerEvents = function () {
+    var self = this;
+
+    this.on('open', function () {
+      self.$container.addClass('select2-container--open');
+    });
+
+    this.on('close', function () {
+      self.$container.removeClass('select2-container--open');
+    });
+
+    this.on('enable', function () {
+      self.$container.removeClass('select2-container--disabled');
+    });
+
+    this.on('disable', function () {
+      self.$container.addClass('select2-container--disabled');
+    });
+
+    this.on('blur', function () {
+      self.$container.removeClass('select2-container--focus');
+    });
+
+    this.on('query', function (params) {
+      if (!self.isOpen()) {
+        self.trigger('open', {});
+      }
+
+      this.dataAdapter.query(params, function (data) {
+        self.trigger('results:all', {
+          data: data,
+          query: params
+        });
+      });
+    });
+
+    this.on('query:append', function (params) {
+      this.dataAdapter.query(params, function (data) {
+        self.trigger('results:append', {
+          data: data,
+          query: params
+        });
+      });
+    });
+
+    this.on('keypress', function (evt) {
+      var key = evt.which;
+
+      if (self.isOpen()) {
+        if (key === KEYS.ESC || key === KEYS.TAB ||
+            (key === KEYS.UP && evt.altKey)) {
+          self.close();
+
+          evt.preventDefault();
+        } else if (key === KEYS.ENTER) {
+          self.trigger('results:select', {});
+
+          evt.preventDefault();
+        } else if ((key === KEYS.SPACE && evt.ctrlKey)) {
+          self.trigger('results:toggle', {});
+
+          evt.preventDefault();
+        } else if (key === KEYS.UP) {
+          self.trigger('results:previous', {});
+
+          evt.preventDefault();
+        } else if (key === KEYS.DOWN) {
+          self.trigger('results:next', {});
+
+          evt.preventDefault();
+        }
+      } else {
+        if (key === KEYS.ENTER || key === KEYS.SPACE ||
+            (key === KEYS.DOWN && evt.altKey)) {
+          self.open();
+
+          evt.preventDefault();
+        }
+      }
+    });
+  };
+
+  Select2.prototype._syncAttributes = function () {
+    this.options.set('disabled', this.$element.prop('disabled'));
+
+    if (this.options.get('disabled')) {
+      if (this.isOpen()) {
+        this.close();
+      }
+
+      this.trigger('disable', {});
+    } else {
+      this.trigger('enable', {});
+    }
+  };
+
+  Select2.prototype._syncSubtree = function (evt, mutations) {
+    var changed = false;
+    var self = this;
+
+    // Ignore any mutation events raised for elements that aren't options or
+    // optgroups. This handles the case when the select element is destroyed
+    if (
+      evt && evt.target && (
+        evt.target.nodeName !== 'OPTION' && evt.target.nodeName !== 'OPTGROUP'
+      )
+    ) {
+      return;
+    }
+
+    if (!mutations) {
+      // If mutation events aren't supported, then we can only assume that the
+      // change affected the selections
+      changed = true;
+    } else if (mutations.addedNodes && mutations.addedNodes.length > 0) {
+      for (var n = 0; n < mutations.addedNodes.length; n++) {
+        var node = mutations.addedNodes[n];
+
+        if (node.selected) {
+          changed = true;
+        }
+      }
+    } else if (mutations.removedNodes && mutations.removedNodes.length > 0) {
+      changed = true;
+    }
+
+    // Only re-pull the data if we think there is a change
+    if (changed) {
+      this.dataAdapter.current(function (currentData) {
+        self.trigger('selection:update', {
+          data: currentData
+        });
+      });
+    }
+  };
+
+  /**
+   * Override the trigger method to automatically trigger pre-events when
+   * there are events that can be prevented.
+   */
+  Select2.prototype.trigger = function (name, args) {
+    var actualTrigger = Select2.__super__.trigger;
+    var preTriggerMap = {
+      'open': 'opening',
+      'close': 'closing',
+      'select': 'selecting',
+      'unselect': 'unselecting',
+      'clear': 'clearing'
+    };
+
+    if (args === undefined) {
+      args = {};
+    }
+
+    if (name in preTriggerMap) {
+      var preTriggerName = preTriggerMap[name];
+      var preTriggerArgs = {
+        prevented: false,
+        name: name,
+        args: args
+      };
+
+      actualTrigger.call(this, preTriggerName, preTriggerArgs);
+
+      if (preTriggerArgs.prevented) {
+        args.prevented = true;
+
+        return;
+      }
+    }
+
+    actualTrigger.call(this, name, args);
+  };
+
+  Select2.prototype.toggleDropdown = function () {
+    if (this.options.get('disabled')) {
+      return;
+    }
+
+    if (this.isOpen()) {
+      this.close();
+    } else {
+      this.open();
+    }
+  };
+
+  Select2.prototype.open = function () {
+    if (this.isOpen()) {
+      return;
+    }
+
+    this.trigger('query', {});
+  };
+
+  Select2.prototype.close = function () {
+    if (!this.isOpen()) {
+      return;
+    }
+
+    this.trigger('close', {});
+  };
+
+  Select2.prototype.isOpen = function () {
+    return this.$container.hasClass('select2-container--open');
+  };
+
+  Select2.prototype.hasFocus = function () {
+    return this.$container.hasClass('select2-container--focus');
+  };
+
+  Select2.prototype.focus = function (data) {
+    // No need to re-trigger focus events if we are already focused
+    if (this.hasFocus()) {
+      return;
+    }
+
+    this.$container.addClass('select2-container--focus');
+    this.trigger('focus', {});
+  };
+
+  Select2.prototype.enable = function (args) {
+    if (this.options.get('debug') && window.console && console.warn) {
+      console.warn(
+        'Select2: The `select2("enable")` method has been deprecated and will' +
+        ' be removed in later Select2 versions. Use $element.prop("disabled")' +
+        ' instead.'
+      );
+    }
+
+    if (args == null || args.length === 0) {
+      args = [true];
+    }
+
+    var disabled = !args[0];
+
+    this.$element.prop('disabled', disabled);
+  };
+
+  Select2.prototype.data = function () {
+    if (this.options.get('debug') &&
+        arguments.length > 0 && window.console && console.warn) {
+      console.warn(
+        'Select2: Data can no longer be set using `select2("data")`. You ' +
+        'should consider setting the value instead using `$element.val()`.'
+      );
+    }
+
+    var data = [];
+
+    this.dataAdapter.current(function (currentData) {
+      data = currentData;
+    });
+
+    return data;
+  };
+
+  Select2.prototype.val = function (args) {
+    if (this.options.get('debug') && window.console && console.warn) {
+      console.warn(
+        'Select2: The `select2("val")` method has been deprecated and will be' +
+        ' removed in later Select2 versions. Use $element.val() instead.'
+      );
+    }
+
+    if (args == null || args.length === 0) {
+      return this.$element.val();
+    }
+
+    var newVal = args[0];
+
+    if ($.isArray(newVal)) {
+      newVal = $.map(newVal, function (obj) {
+        return obj.toString();
+      });
+    }
+
+    this.$element.val(newVal).trigger('change');
+  };
+
+  Select2.prototype.destroy = function () {
+    this.$container.remove();
+
+    if (this.$element[0].detachEvent) {
+      this.$element[0].detachEvent('onpropertychange', this._syncA);
+    }
+
+    if (this._observer != null) {
+      this._observer.disconnect();
+      this._observer = null;
+    } else if (this.$element[0].removeEventListener) {
+      this.$element[0]
+        .removeEventListener('DOMAttrModified', this._syncA, false);
+      this.$element[0]
+        .removeEventListener('DOMNodeInserted', this._syncS, false);
+      this.$element[0]
+        .removeEventListener('DOMNodeRemoved', this._syncS, false);
+    }
+
+    this._syncA = null;
+    this._syncS = null;
+
+    this.$element.off('.select2');
+    this.$element.attr('tabindex',
+    Utils.GetData(this.$element[0], 'old-tabindex'));
+
+    this.$element.removeClass('select2-hidden-accessible');
+    this.$element.attr('aria-hidden', 'false');
+    Utils.RemoveData(this.$element[0]);
+    this.$element.removeData('select2');
+
+    this.dataAdapter.destroy();
+    this.selection.destroy();
+    this.dropdown.destroy();
+    this.results.destroy();
+
+    this.dataAdapter = null;
+    this.selection = null;
+    this.dropdown = null;
+    this.results = null;
+  };
+
+  Select2.prototype.render = function () {
+    var $container = $(
+      '<span class="select2 select2-container">' +
+        '<span class="selection"></span>' +
+        '<span class="dropdown-wrapper" aria-hidden="true"></span>' +
+      '</span>'
+    );
+
+    $container.attr('dir', this.options.get('dir'));
+
+    this.$container = $container;
+
+    this.$container.addClass('select2-container--' + this.options.get('theme'));
+
+    Utils.StoreData($container[0], 'element', this.$element);
+
+    return $container;
+  };
+
+  return Select2;
+});
+
+S2.define('jquery-mousewheel',[
+  'jquery'
+], function ($) {
+  // Used to shim jQuery.mousewheel for non-full builds.
+  return $;
+});
+
+S2.define('jquery.select2',[
+  'jquery',
+  'jquery-mousewheel',
+
+  './select2/core',
+  './select2/defaults',
+  './select2/utils'
+], function ($, _, Select2, Defaults, Utils) {
+  if ($.fn.select2 == null) {
+    // All methods that should return the element
+    var thisMethods = ['open', 'close', 'destroy'];
+
+    $.fn.select2 = function (options) {
+      options = options || {};
+
+      if (typeof options === 'object') {
+        this.each(function () {
+          var instanceOptions = $.extend(true, {}, options);
+
+          var instance = new Select2($(this), instanceOptions);
+        });
+
+        return this;
+      } else if (typeof options === 'string') {
+        var ret;
+        var args = Array.prototype.slice.call(arguments, 1);
+
+        this.each(function () {
+          var instance = Utils.GetData(this, 'select2');
+
+          if (instance == null && window.console && console.error) {
+            console.error(
+              'The select2(\'' + options + '\') method was called on an ' +
+              'element that is not using Select2.'
+            );
+          }
+
+          ret = instance[options].apply(instance, args);
+        });
+
+        // Check if we should be returning `this`
+        if ($.inArray(options, thisMethods) > -1) {
+          return this;
+        }
+
+        return ret;
+      } else {
+        throw new Error('Invalid arguments for Select2: ' + options);
+      }
+    };
+  }
+
+  if ($.fn.select2.defaults == null) {
+    $.fn.select2.defaults = Defaults;
+  }
+
+  return Select2;
+});
+
+  // Return the AMD loader configuration so it can be used outside of this file
+  return {
+    define: S2.define,
+    require: S2.require
+  };
+}());
+
+  // Autoload the jQuery bindings
+  // We know that all of the modules exist above this, so we're safe
+  var select2 = S2.require('jquery.select2');
+
+  // Hold the AMD module references on the jQuery function that was just loaded
+  // This allows Select2 to use the internal loader outside of this file, such
+  // as in the language files.
+  jQuery.fn.select2.amd = S2;
+
+  // Return the Select2 instance for anyone who is importing it.
+  return select2;
+}));
+//! moment.js
+//! version : 2.10.6
+//! authors : Tim Wood, Iskren Chernev, Moment.js contributors
+//! license : MIT
+//! momentjs.com
+!function(a,b){"object"==typeof exports&&"undefined"!=typeof module?module.exports=b():"function"==typeof define&&define.amd?define(b):a.moment=b()}(this,function(){"use strict";function a(){return Hc.apply(null,arguments)}function b(a){Hc=a}function c(a){return"[object Array]"===Object.prototype.toString.call(a)}function d(a){return a instanceof Date||"[object Date]"===Object.prototype.toString.call(a)}function e(a,b){var c,d=[];for(c=0;c<a.length;++c)d.push(b(a[c],c));return d}function f(a,b){return Object.prototype.hasOwnProperty.call(a,b)}function g(a,b){for(var c in b)f(b,c)&&(a[c]=b[c]);return f(b,"toString")&&(a.toString=b.toString),f(b,"valueOf")&&(a.valueOf=b.valueOf),a}function h(a,b,c,d){return Ca(a,b,c,d,!0).utc()}function i(){return{empty:!1,unusedTokens:[],unusedInput:[],overflow:-2,charsLeftOver:0,nullInput:!1,invalidMonth:null,invalidFormat:!1,userInvalidated:!1,iso:!1}}function j(a){return null==a._pf&&(a._pf=i()),a._pf}function k(a){if(null==a._isValid){var b=j(a);a._isValid=!(isNaN(a._d.getTime())||!(b.overflow<0)||b.empty||b.invalidMonth||b.invalidWeekday||b.nullInput||b.invalidFormat||b.userInvalidated),a._strict&&(a._isValid=a._isValid&&0===b.charsLeftOver&&0===b.unusedTokens.length&&void 0===b.bigHour)}return a._isValid}function l(a){var b=h(NaN);return null!=a?g(j(b),a):j(b).userInvalidated=!0,b}function m(a,b){var c,d,e;if("undefined"!=typeof b._isAMomentObject&&(a._isAMomentObject=b._isAMomentObject),"undefined"!=typeof b._i&&(a._i=b._i),"undefined"!=typeof b._f&&(a._f=b._f),"undefined"!=typeof b._l&&(a._l=b._l),"undefined"!=typeof b._strict&&(a._strict=b._strict),"undefined"!=typeof b._tzm&&(a._tzm=b._tzm),"undefined"!=typeof b._isUTC&&(a._isUTC=b._isUTC),"undefined"!=typeof b._offset&&(a._offset=b._offset),"undefined"!=typeof b._pf&&(a._pf=j(b)),"undefined"!=typeof b._locale&&(a._locale=b._locale),Jc.length>0)for(c in Jc)d=Jc[c],e=b[d],"undefined"!=typeof e&&(a[d]=e);return a}function n(b){m(this,b),this._d=new Date(null!=b._d?b._d.getTime():NaN),Kc===!1&&(Kc=!0,a.updateOffset(this),Kc=!1)}function o(a){return a instanceof n||null!=a&&null!=a._isAMomentObject}function p(a){return 0>a?Math.ceil(a):Math.floor(a)}function q(a){var b=+a,c=0;return 0!==b&&isFinite(b)&&(c=p(b)),c}function r(a,b,c){var d,e=Math.min(a.length,b.length),f=Math.abs(a.length-b.length),g=0;for(d=0;e>d;d++)(c&&a[d]!==b[d]||!c&&q(a[d])!==q(b[d]))&&g++;return g+f}function s(){}function t(a){return a?a.toLowerCase().replace("_","-"):a}function u(a){for(var b,c,d,e,f=0;f<a.length;){for(e=t(a[f]).split("-"),b=e.length,c=t(a[f+1]),c=c?c.split("-"):null;b>0;){if(d=v(e.slice(0,b).join("-")))return d;if(c&&c.length>=b&&r(e,c,!0)>=b-1)break;b--}f++}return null}function v(a){var b=null;if(!Lc[a]&&"undefined"!=typeof module&&module&&module.exports)try{b=Ic._abbr,require("./locale/"+a),w(b)}catch(c){}return Lc[a]}function w(a,b){var c;return a&&(c="undefined"==typeof b?y(a):x(a,b),c&&(Ic=c)),Ic._abbr}function x(a,b){return null!==b?(b.abbr=a,Lc[a]=Lc[a]||new s,Lc[a].set(b),w(a),Lc[a]):(delete Lc[a],null)}function y(a){var b;if(a&&a._locale&&a._locale._abbr&&(a=a._locale._abbr),!a)return Ic;if(!c(a)){if(b=v(a))return b;a=[a]}return u(a)}function z(a,b){var c=a.toLowerCase();Mc[c]=Mc[c+"s"]=Mc[b]=a}function A(a){return"string"==typeof a?Mc[a]||Mc[a.toLowerCase()]:void 0}function B(a){var b,c,d={};for(c in a)f(a,c)&&(b=A(c),b&&(d[b]=a[c]));return d}function C(b,c){return function(d){return null!=d?(E(this,b,d),a.updateOffset(this,c),this):D(this,b)}}function D(a,b){return a._d["get"+(a._isUTC?"UTC":"")+b]()}function E(a,b,c){return a._d["set"+(a._isUTC?"UTC":"")+b](c)}function F(a,b){var c;if("object"==typeof a)for(c in a)this.set(c,a[c]);else if(a=A(a),"function"==typeof this[a])return this[a](b);return this}function G(a,b,c){var d=""+Math.abs(a),e=b-d.length,f=a>=0;return(f?c?"+":"":"-")+Math.pow(10,Math.max(0,e)).toString().substr(1)+d}function H(a,b,c,d){var e=d;"string"==typeof d&&(e=function(){return this[d]()}),a&&(Qc[a]=e),b&&(Qc[b[0]]=function(){return G(e.apply(this,arguments),b[1],b[2])}),c&&(Qc[c]=function(){return this.localeData().ordinal(e.apply(this,arguments),a)})}function I(a){return a.match(/\[[\s\S]/)?a.replace(/^\[|\]$/g,""):a.replace(/\\/g,"")}function J(a){var b,c,d=a.match(Nc);for(b=0,c=d.length;c>b;b++)Qc[d[b]]?d[b]=Qc[d[b]]:d[b]=I(d[b]);return function(e){var f="";for(b=0;c>b;b++)f+=d[b]instanceof Function?d[b].call(e,a):d[b];return f}}function K(a,b){return a.isValid()?(b=L(b,a.localeData()),Pc[b]=Pc[b]||J(b),Pc[b](a)):a.localeData().invalidDate()}function L(a,b){function c(a){return b.longDateFormat(a)||a}var d=5;for(Oc.lastIndex=0;d>=0&&Oc.test(a);)a=a.replace(Oc,c),Oc.lastIndex=0,d-=1;return a}function M(a){return"function"==typeof a&&"[object Function]"===Object.prototype.toString.call(a)}function N(a,b,c){dd[a]=M(b)?b:function(a){return a&&c?c:b}}function O(a,b){return f(dd,a)?dd[a](b._strict,b._locale):new RegExp(P(a))}function P(a){return a.replace("\\","").replace(/\\(\[)|\\(\])|\[([^\]\[]*)\]|\\(.)/g,function(a,b,c,d,e){return b||c||d||e}).replace(/[-\/\\^$*+?.()|[\]{}]/g,"\\$&")}function Q(a,b){var c,d=b;for("string"==typeof a&&(a=[a]),"number"==typeof b&&(d=function(a,c){c[b]=q(a)}),c=0;c<a.length;c++)ed[a[c]]=d}function R(a,b){Q(a,function(a,c,d,e){d._w=d._w||{},b(a,d._w,d,e)})}function S(a,b,c){null!=b&&f(ed,a)&&ed[a](b,c._a,c,a)}function T(a,b){return new Date(Date.UTC(a,b+1,0)).getUTCDate()}function U(a){return this._months[a.month()]}function V(a){return this._monthsShort[a.month()]}function W(a,b,c){var d,e,f;for(this._monthsParse||(this._monthsParse=[],this._longMonthsParse=[],this._shortMonthsParse=[]),d=0;12>d;d++){if(e=h([2e3,d]),c&&!this._longMonthsParse[d]&&(this._longMonthsParse[d]=new RegExp("^"+this.months(e,"").replace(".","")+"$","i"),this._shortMonthsParse[d]=new RegExp("^"+this.monthsShort(e,"").replace(".","")+"$","i")),c||this._monthsParse[d]||(f="^"+this.months(e,"")+"|^"+this.monthsShort(e,""),this._monthsParse[d]=new RegExp(f.replace(".",""),"i")),c&&"MMMM"===b&&this._longMonthsParse[d].test(a))return d;if(c&&"MMM"===b&&this._shortMonthsParse[d].test(a))return d;if(!c&&this._monthsParse[d].test(a))return d}}function X(a,b){var c;return"string"==typeof b&&(b=a.localeData().monthsParse(b),"number"!=typeof b)?a:(c=Math.min(a.date(),T(a.year(),b)),a._d["set"+(a._isUTC?"UTC":"")+"Month"](b,c),a)}function Y(b){return null!=b?(X(this,b),a.updateOffset(this,!0),this):D(this,"Month")}function Z(){return T(this.year(),this.month())}function $(a){var b,c=a._a;return c&&-2===j(a).overflow&&(b=c[gd]<0||c[gd]>11?gd:c[hd]<1||c[hd]>T(c[fd],c[gd])?hd:c[id]<0||c[id]>24||24===c[id]&&(0!==c[jd]||0!==c[kd]||0!==c[ld])?id:c[jd]<0||c[jd]>59?jd:c[kd]<0||c[kd]>59?kd:c[ld]<0||c[ld]>999?ld:-1,j(a)._overflowDayOfYear&&(fd>b||b>hd)&&(b=hd),j(a).overflow=b),a}function _(b){a.suppressDeprecationWarnings===!1&&"undefined"!=typeof console&&console.warn&&console.warn("Deprecation warning: "+b)}function aa(a,b){var c=!0;return g(function(){return c&&(_(a+"\n"+(new Error).stack),c=!1),b.apply(this,arguments)},b)}function ba(a,b){od[a]||(_(b),od[a]=!0)}function ca(a){var b,c,d=a._i,e=pd.exec(d);if(e){for(j(a).iso=!0,b=0,c=qd.length;c>b;b++)if(qd[b][1].exec(d)){a._f=qd[b][0];break}for(b=0,c=rd.length;c>b;b++)if(rd[b][1].exec(d)){a._f+=(e[6]||" ")+rd[b][0];break}d.match(ad)&&(a._f+="Z"),va(a)}else a._isValid=!1}function da(b){var c=sd.exec(b._i);return null!==c?void(b._d=new Date(+c[1])):(ca(b),void(b._isValid===!1&&(delete b._isValid,a.createFromInputFallback(b))))}function ea(a,b,c,d,e,f,g){var h=new Date(a,b,c,d,e,f,g);return 1970>a&&h.setFullYear(a),h}function fa(a){var b=new Date(Date.UTC.apply(null,arguments));return 1970>a&&b.setUTCFullYear(a),b}function ga(a){return ha(a)?366:365}function ha(a){return a%4===0&&a%100!==0||a%400===0}function ia(){return ha(this.year())}function ja(a,b,c){var d,e=c-b,f=c-a.day();return f>e&&(f-=7),e-7>f&&(f+=7),d=Da(a).add(f,"d"),{week:Math.ceil(d.dayOfYear()/7),year:d.year()}}function ka(a){return ja(a,this._week.dow,this._week.doy).week}function la(){return this._week.dow}function ma(){return this._week.doy}function na(a){var b=this.localeData().week(this);return null==a?b:this.add(7*(a-b),"d")}function oa(a){var b=ja(this,1,4).week;return null==a?b:this.add(7*(a-b),"d")}function pa(a,b,c,d,e){var f,g=6+e-d,h=fa(a,0,1+g),i=h.getUTCDay();return e>i&&(i+=7),c=null!=c?1*c:e,f=1+g+7*(b-1)-i+c,{year:f>0?a:a-1,dayOfYear:f>0?f:ga(a-1)+f}}function qa(a){var b=Math.round((this.clone().startOf("day")-this.clone().startOf("year"))/864e5)+1;return null==a?b:this.add(a-b,"d")}function ra(a,b,c){return null!=a?a:null!=b?b:c}function sa(a){var b=new Date;return a._useUTC?[b.getUTCFullYear(),b.getUTCMonth(),b.getUTCDate()]:[b.getFullYear(),b.getMonth(),b.getDate()]}function ta(a){var b,c,d,e,f=[];if(!a._d){for(d=sa(a),a._w&&null==a._a[hd]&&null==a._a[gd]&&ua(a),a._dayOfYear&&(e=ra(a._a[fd],d[fd]),a._dayOfYear>ga(e)&&(j(a)._overflowDayOfYear=!0),c=fa(e,0,a._dayOfYear),a._a[gd]=c.getUTCMonth(),a._a[hd]=c.getUTCDate()),b=0;3>b&&null==a._a[b];++b)a._a[b]=f[b]=d[b];for(;7>b;b++)a._a[b]=f[b]=null==a._a[b]?2===b?1:0:a._a[b];24===a._a[id]&&0===a._a[jd]&&0===a._a[kd]&&0===a._a[ld]&&(a._nextDay=!0,a._a[id]=0),a._d=(a._useUTC?fa:ea).apply(null,f),null!=a._tzm&&a._d.setUTCMinutes(a._d.getUTCMinutes()-a._tzm),a._nextDay&&(a._a[id]=24)}}function ua(a){var b,c,d,e,f,g,h;b=a._w,null!=b.GG||null!=b.W||null!=b.E?(f=1,g=4,c=ra(b.GG,a._a[fd],ja(Da(),1,4).year),d=ra(b.W,1),e=ra(b.E,1)):(f=a._locale._week.dow,g=a._locale._week.doy,c=ra(b.gg,a._a[fd],ja(Da(),f,g).year),d=ra(b.w,1),null!=b.d?(e=b.d,f>e&&++d):e=null!=b.e?b.e+f:f),h=pa(c,d,e,g,f),a._a[fd]=h.year,a._dayOfYear=h.dayOfYear}function va(b){if(b._f===a.ISO_8601)return void ca(b);b._a=[],j(b).empty=!0;var c,d,e,f,g,h=""+b._i,i=h.length,k=0;for(e=L(b._f,b._locale).match(Nc)||[],c=0;c<e.length;c++)f=e[c],d=(h.match(O(f,b))||[])[0],d&&(g=h.substr(0,h.indexOf(d)),g.length>0&&j(b).unusedInput.push(g),h=h.slice(h.indexOf(d)+d.length),k+=d.length),Qc[f]?(d?j(b).empty=!1:j(b).unusedTokens.push(f),S(f,d,b)):b._strict&&!d&&j(b).unusedTokens.push(f);j(b).charsLeftOver=i-k,h.length>0&&j(b).unusedInput.push(h),j(b).bigHour===!0&&b._a[id]<=12&&b._a[id]>0&&(j(b).bigHour=void 0),b._a[id]=wa(b._locale,b._a[id],b._meridiem),ta(b),$(b)}function wa(a,b,c){var d;return null==c?b:null!=a.meridiemHour?a.meridiemHour(b,c):null!=a.isPM?(d=a.isPM(c),d&&12>b&&(b+=12),d||12!==b||(b=0),b):b}function xa(a){var b,c,d,e,f;if(0===a._f.length)return j(a).invalidFormat=!0,void(a._d=new Date(NaN));for(e=0;e<a._f.length;e++)f=0,b=m({},a),null!=a._useUTC&&(b._useUTC=a._useUTC),b._f=a._f[e],va(b),k(b)&&(f+=j(b).charsLeftOver,f+=10*j(b).unusedTokens.length,j(b).score=f,(null==d||d>f)&&(d=f,c=b));g(a,c||b)}function ya(a){if(!a._d){var b=B(a._i);a._a=[b.year,b.month,b.day||b.date,b.hour,b.minute,b.second,b.millisecond],ta(a)}}function za(a){var b=new n($(Aa(a)));return b._nextDay&&(b.add(1,"d"),b._nextDay=void 0),b}function Aa(a){var b=a._i,e=a._f;return a._locale=a._locale||y(a._l),null===b||void 0===e&&""===b?l({nullInput:!0}):("string"==typeof b&&(a._i=b=a._locale.preparse(b)),o(b)?new n($(b)):(c(e)?xa(a):e?va(a):d(b)?a._d=b:Ba(a),a))}function Ba(b){var f=b._i;void 0===f?b._d=new Date:d(f)?b._d=new Date(+f):"string"==typeof f?da(b):c(f)?(b._a=e(f.slice(0),function(a){return parseInt(a,10)}),ta(b)):"object"==typeof f?ya(b):"number"==typeof f?b._d=new Date(f):a.createFromInputFallback(b)}function Ca(a,b,c,d,e){var f={};return"boolean"==typeof c&&(d=c,c=void 0),f._isAMomentObject=!0,f._useUTC=f._isUTC=e,f._l=c,f._i=a,f._f=b,f._strict=d,za(f)}function Da(a,b,c,d){return Ca(a,b,c,d,!1)}function Ea(a,b){var d,e;if(1===b.length&&c(b[0])&&(b=b[0]),!b.length)return Da();for(d=b[0],e=1;e<b.length;++e)(!b[e].isValid()||b[e][a](d))&&(d=b[e]);return d}function Fa(){var a=[].slice.call(arguments,0);return Ea("isBefore",a)}function Ga(){var a=[].slice.call(arguments,0);return Ea("isAfter",a)}function Ha(a){var b=B(a),c=b.year||0,d=b.quarter||0,e=b.month||0,f=b.week||0,g=b.day||0,h=b.hour||0,i=b.minute||0,j=b.second||0,k=b.millisecond||0;this._milliseconds=+k+1e3*j+6e4*i+36e5*h,this._days=+g+7*f,this._months=+e+3*d+12*c,this._data={},this._locale=y(),this._bubble()}function Ia(a){return a instanceof Ha}function Ja(a,b){H(a,0,0,function(){var a=this.utcOffset(),c="+";return 0>a&&(a=-a,c="-"),c+G(~~(a/60),2)+b+G(~~a%60,2)})}function Ka(a){var b=(a||"").match(ad)||[],c=b[b.length-1]||[],d=(c+"").match(xd)||["-",0,0],e=+(60*d[1])+q(d[2]);return"+"===d[0]?e:-e}function La(b,c){var e,f;return c._isUTC?(e=c.clone(),f=(o(b)||d(b)?+b:+Da(b))-+e,e._d.setTime(+e._d+f),a.updateOffset(e,!1),e):Da(b).local()}function Ma(a){return 15*-Math.round(a._d.getTimezoneOffset()/15)}function Na(b,c){var d,e=this._offset||0;return null!=b?("string"==typeof b&&(b=Ka(b)),Math.abs(b)<16&&(b=60*b),!this._isUTC&&c&&(d=Ma(this)),this._offset=b,this._isUTC=!0,null!=d&&this.add(d,"m"),e!==b&&(!c||this._changeInProgress?bb(this,Ya(b-e,"m"),1,!1):this._changeInProgress||(this._changeInProgress=!0,a.updateOffset(this,!0),this._changeInProgress=null)),this):this._isUTC?e:Ma(this)}function Oa(a,b){return null!=a?("string"!=typeof a&&(a=-a),this.utcOffset(a,b),this):-this.utcOffset()}function Pa(a){return this.utcOffset(0,a)}function Qa(a){return this._isUTC&&(this.utcOffset(0,a),this._isUTC=!1,a&&this.subtract(Ma(this),"m")),this}function Ra(){return this._tzm?this.utcOffset(this._tzm):"string"==typeof this._i&&this.utcOffset(Ka(this._i)),this}function Sa(a){return a=a?Da(a).utcOffset():0,(this.utcOffset()-a)%60===0}function Ta(){return this.utcOffset()>this.clone().month(0).utcOffset()||this.utcOffset()>this.clone().month(5).utcOffset()}function Ua(){if("undefined"!=typeof this._isDSTShifted)return this._isDSTShifted;var a={};if(m(a,this),a=Aa(a),a._a){var b=a._isUTC?h(a._a):Da(a._a);this._isDSTShifted=this.isValid()&&r(a._a,b.toArray())>0}else this._isDSTShifted=!1;return this._isDSTShifted}function Va(){return!this._isUTC}function Wa(){return this._isUTC}function Xa(){return this._isUTC&&0===this._offset}function Ya(a,b){var c,d,e,g=a,h=null;return Ia(a)?g={ms:a._milliseconds,d:a._days,M:a._months}:"number"==typeof a?(g={},b?g[b]=a:g.milliseconds=a):(h=yd.exec(a))?(c="-"===h[1]?-1:1,g={y:0,d:q(h[hd])*c,h:q(h[id])*c,m:q(h[jd])*c,s:q(h[kd])*c,ms:q(h[ld])*c}):(h=zd.exec(a))?(c="-"===h[1]?-1:1,g={y:Za(h[2],c),M:Za(h[3],c),d:Za(h[4],c),h:Za(h[5],c),m:Za(h[6],c),s:Za(h[7],c),w:Za(h[8],c)}):null==g?g={}:"object"==typeof g&&("from"in g||"to"in g)&&(e=_a(Da(g.from),Da(g.to)),g={},g.ms=e.milliseconds,g.M=e.months),d=new Ha(g),Ia(a)&&f(a,"_locale")&&(d._locale=a._locale),d}function Za(a,b){var c=a&&parseFloat(a.replace(",","."));return(isNaN(c)?0:c)*b}function $a(a,b){var c={milliseconds:0,months:0};return c.months=b.month()-a.month()+12*(b.year()-a.year()),a.clone().add(c.months,"M").isAfter(b)&&--c.months,c.milliseconds=+b-+a.clone().add(c.months,"M"),c}function _a(a,b){var c;return b=La(b,a),a.isBefore(b)?c=$a(a,b):(c=$a(b,a),c.milliseconds=-c.milliseconds,c.months=-c.months),c}function ab(a,b){return function(c,d){var e,f;return null===d||isNaN(+d)||(ba(b,"moment()."+b+"(period, number) is deprecated. Please use moment()."+b+"(number, period)."),f=c,c=d,d=f),c="string"==typeof c?+c:c,e=Ya(c,d),bb(this,e,a),this}}function bb(b,c,d,e){var f=c._milliseconds,g=c._days,h=c._months;e=null==e?!0:e,f&&b._d.setTime(+b._d+f*d),g&&E(b,"Date",D(b,"Date")+g*d),h&&X(b,D(b,"Month")+h*d),e&&a.updateOffset(b,g||h)}function cb(a,b){var c=a||Da(),d=La(c,this).startOf("day"),e=this.diff(d,"days",!0),f=-6>e?"sameElse":-1>e?"lastWeek":0>e?"lastDay":1>e?"sameDay":2>e?"nextDay":7>e?"nextWeek":"sameElse";return this.format(b&&b[f]||this.localeData().calendar(f,this,Da(c)))}function db(){return new n(this)}function eb(a,b){var c;return b=A("undefined"!=typeof b?b:"millisecond"),"millisecond"===b?(a=o(a)?a:Da(a),+this>+a):(c=o(a)?+a:+Da(a),c<+this.clone().startOf(b))}function fb(a,b){var c;return b=A("undefined"!=typeof b?b:"millisecond"),"millisecond"===b?(a=o(a)?a:Da(a),+a>+this):(c=o(a)?+a:+Da(a),+this.clone().endOf(b)<c)}function gb(a,b,c){return this.isAfter(a,c)&&this.isBefore(b,c)}function hb(a,b){var c;return b=A(b||"millisecond"),"millisecond"===b?(a=o(a)?a:Da(a),+this===+a):(c=+Da(a),+this.clone().startOf(b)<=c&&c<=+this.clone().endOf(b))}function ib(a,b,c){var d,e,f=La(a,this),g=6e4*(f.utcOffset()-this.utcOffset());return b=A(b),"year"===b||"month"===b||"quarter"===b?(e=jb(this,f),"quarter"===b?e/=3:"year"===b&&(e/=12)):(d=this-f,e="second"===b?d/1e3:"minute"===b?d/6e4:"hour"===b?d/36e5:"day"===b?(d-g)/864e5:"week"===b?(d-g)/6048e5:d),c?e:p(e)}function jb(a,b){var c,d,e=12*(b.year()-a.year())+(b.month()-a.month()),f=a.clone().add(e,"months");return 0>b-f?(c=a.clone().add(e-1,"months"),d=(b-f)/(f-c)):(c=a.clone().add(e+1,"months"),d=(b-f)/(c-f)),-(e+d)}function kb(){return this.clone().locale("en").format("ddd MMM DD YYYY HH:mm:ss [GMT]ZZ")}function lb(){var a=this.clone().utc();return 0<a.year()&&a.year()<=9999?"function"==typeof Date.prototype.toISOString?this.toDate().toISOString():K(a,"YYYY-MM-DD[T]HH:mm:ss.SSS[Z]"):K(a,"YYYYYY-MM-DD[T]HH:mm:ss.SSS[Z]")}function mb(b){var c=K(this,b||a.defaultFormat);return this.localeData().postformat(c)}function nb(a,b){return this.isValid()?Ya({to:this,from:a}).locale(this.locale()).humanize(!b):this.localeData().invalidDate()}function ob(a){return this.from(Da(),a)}function pb(a,b){return this.isValid()?Ya({from:this,to:a}).locale(this.locale()).humanize(!b):this.localeData().invalidDate()}function qb(a){return this.to(Da(),a)}function rb(a){var b;return void 0===a?this._locale._abbr:(b=y(a),null!=b&&(this._locale=b),this)}function sb(){return this._locale}function tb(a){switch(a=A(a)){case"year":this.month(0);case"quarter":case"month":this.date(1);case"week":case"isoWeek":case"day":this.hours(0);case"hour":this.minutes(0);case"minute":this.seconds(0);case"second":this.milliseconds(0)}return"week"===a&&this.weekday(0),"isoWeek"===a&&this.isoWeekday(1),"quarter"===a&&this.month(3*Math.floor(this.month()/3)),this}function ub(a){return a=A(a),void 0===a||"millisecond"===a?this:this.startOf(a).add(1,"isoWeek"===a?"week":a).subtract(1,"ms")}function vb(){return+this._d-6e4*(this._offset||0)}function wb(){return Math.floor(+this/1e3)}function xb(){return this._offset?new Date(+this):this._d}function yb(){var a=this;return[a.year(),a.month(),a.date(),a.hour(),a.minute(),a.second(),a.millisecond()]}function zb(){var a=this;return{years:a.year(),months:a.month(),date:a.date(),hours:a.hours(),minutes:a.minutes(),seconds:a.seconds(),milliseconds:a.milliseconds()}}function Ab(){return k(this)}function Bb(){return g({},j(this))}function Cb(){return j(this).overflow}function Db(a,b){H(0,[a,a.length],0,b)}function Eb(a,b,c){return ja(Da([a,11,31+b-c]),b,c).week}function Fb(a){var b=ja(this,this.localeData()._week.dow,this.localeData()._week.doy).year;return null==a?b:this.add(a-b,"y")}function Gb(a){var b=ja(this,1,4).year;return null==a?b:this.add(a-b,"y")}function Hb(){return Eb(this.year(),1,4)}function Ib(){var a=this.localeData()._week;return Eb(this.year(),a.dow,a.doy)}function Jb(a){return null==a?Math.ceil((this.month()+1)/3):this.month(3*(a-1)+this.month()%3)}function Kb(a,b){return"string"!=typeof a?a:isNaN(a)?(a=b.weekdaysParse(a),"number"==typeof a?a:null):parseInt(a,10)}function Lb(a){return this._weekdays[a.day()]}function Mb(a){return this._weekdaysShort[a.day()]}function Nb(a){return this._weekdaysMin[a.day()]}function Ob(a){var b,c,d;for(this._weekdaysParse=this._weekdaysParse||[],b=0;7>b;b++)if(this._weekdaysParse[b]||(c=Da([2e3,1]).day(b),d="^"+this.weekdays(c,"")+"|^"+this.weekdaysShort(c,"")+"|^"+this.weekdaysMin(c,""),this._weekdaysParse[b]=new RegExp(d.replace(".",""),"i")),this._weekdaysParse[b].test(a))return b}function Pb(a){var b=this._isUTC?this._d.getUTCDay():this._d.getDay();return null!=a?(a=Kb(a,this.localeData()),this.add(a-b,"d")):b}function Qb(a){var b=(this.day()+7-this.localeData()._week.dow)%7;return null==a?b:this.add(a-b,"d")}function Rb(a){return null==a?this.day()||7:this.day(this.day()%7?a:a-7)}function Sb(a,b){H(a,0,0,function(){return this.localeData().meridiem(this.hours(),this.minutes(),b)})}function Tb(a,b){return b._meridiemParse}function Ub(a){return"p"===(a+"").toLowerCase().charAt(0)}function Vb(a,b,c){return a>11?c?"pm":"PM":c?"am":"AM"}function Wb(a,b){b[ld]=q(1e3*("0."+a))}function Xb(){return this._isUTC?"UTC":""}function Yb(){return this._isUTC?"Coordinated Universal Time":""}function Zb(a){return Da(1e3*a)}function $b(){return Da.apply(null,arguments).parseZone()}function _b(a,b,c){var d=this._calendar[a];return"function"==typeof d?d.call(b,c):d}function ac(a){var b=this._longDateFormat[a],c=this._longDateFormat[a.toUpperCase()];return b||!c?b:(this._longDateFormat[a]=c.replace(/MMMM|MM|DD|dddd/g,function(a){return a.slice(1)}),this._longDateFormat[a])}function bc(){return this._invalidDate}function cc(a){return this._ordinal.replace("%d",a)}function dc(a){return a}function ec(a,b,c,d){var e=this._relativeTime[c];return"function"==typeof e?e(a,b,c,d):e.replace(/%d/i,a)}function fc(a,b){var c=this._relativeTime[a>0?"future":"past"];return"function"==typeof c?c(b):c.replace(/%s/i,b)}function gc(a){var b,c;for(c in a)b=a[c],"function"==typeof b?this[c]=b:this["_"+c]=b;this._ordinalParseLenient=new RegExp(this._ordinalParse.source+"|"+/\d{1,2}/.source)}function hc(a,b,c,d){var e=y(),f=h().set(d,b);return e[c](f,a)}function ic(a,b,c,d,e){if("number"==typeof a&&(b=a,a=void 0),a=a||"",null!=b)return hc(a,b,c,e);var f,g=[];for(f=0;d>f;f++)g[f]=hc(a,f,c,e);return g}function jc(a,b){return ic(a,b,"months",12,"month")}function kc(a,b){return ic(a,b,"monthsShort",12,"month")}function lc(a,b){return ic(a,b,"weekdays",7,"day")}function mc(a,b){return ic(a,b,"weekdaysShort",7,"day")}function nc(a,b){return ic(a,b,"weekdaysMin",7,"day")}function oc(){var a=this._data;return this._milliseconds=Wd(this._milliseconds),this._days=Wd(this._days),this._months=Wd(this._months),a.milliseconds=Wd(a.milliseconds),a.seconds=Wd(a.seconds),a.minutes=Wd(a.minutes),a.hours=Wd(a.hours),a.months=Wd(a.months),a.years=Wd(a.years),this}function pc(a,b,c,d){var e=Ya(b,c);return a._milliseconds+=d*e._milliseconds,a._days+=d*e._days,a._months+=d*e._months,a._bubble()}function qc(a,b){return pc(this,a,b,1)}function rc(a,b){return pc(this,a,b,-1)}function sc(a){return 0>a?Math.floor(a):Math.ceil(a)}function tc(){var a,b,c,d,e,f=this._milliseconds,g=this._days,h=this._months,i=this._data;return f>=0&&g>=0&&h>=0||0>=f&&0>=g&&0>=h||(f+=864e5*sc(vc(h)+g),g=0,h=0),i.milliseconds=f%1e3,a=p(f/1e3),i.seconds=a%60,b=p(a/60),i.minutes=b%60,c=p(b/60),i.hours=c%24,g+=p(c/24),e=p(uc(g)),h+=e,g-=sc(vc(e)),d=p(h/12),h%=12,i.days=g,i.months=h,i.years=d,this}function uc(a){return 4800*a/146097}function vc(a){return 146097*a/4800}function wc(a){var b,c,d=this._milliseconds;if(a=A(a),"month"===a||"year"===a)return b=this._days+d/864e5,c=this._months+uc(b),"month"===a?c:c/12;switch(b=this._days+Math.round(vc(this._months)),a){case"week":return b/7+d/6048e5;case"day":return b+d/864e5;case"hour":return 24*b+d/36e5;case"minute":return 1440*b+d/6e4;case"second":return 86400*b+d/1e3;case"millisecond":return Math.floor(864e5*b)+d;default:throw new Error("Unknown unit "+a)}}function xc(){return this._milliseconds+864e5*this._days+this._months%12*2592e6+31536e6*q(this._months/12)}function yc(a){return function(){return this.as(a)}}function zc(a){return a=A(a),this[a+"s"]()}function Ac(a){return function(){return this._data[a]}}function Bc(){return p(this.days()/7)}function Cc(a,b,c,d,e){return e.relativeTime(b||1,!!c,a,d)}function Dc(a,b,c){var d=Ya(a).abs(),e=ke(d.as("s")),f=ke(d.as("m")),g=ke(d.as("h")),h=ke(d.as("d")),i=ke(d.as("M")),j=ke(d.as("y")),k=e<le.s&&["s",e]||1===f&&["m"]||f<le.m&&["mm",f]||1===g&&["h"]||g<le.h&&["hh",g]||1===h&&["d"]||h<le.d&&["dd",h]||1===i&&["M"]||i<le.M&&["MM",i]||1===j&&["y"]||["yy",j];return k[2]=b,k[3]=+a>0,k[4]=c,Cc.apply(null,k)}function Ec(a,b){return void 0===le[a]?!1:void 0===b?le[a]:(le[a]=b,!0)}function Fc(a){var b=this.localeData(),c=Dc(this,!a,b);return a&&(c=b.pastFuture(+this,c)),b.postformat(c)}function Gc(){var a,b,c,d=me(this._milliseconds)/1e3,e=me(this._days),f=me(this._months);a=p(d/60),b=p(a/60),d%=60,a%=60,c=p(f/12),f%=12;var g=c,h=f,i=e,j=b,k=a,l=d,m=this.asSeconds();return m?(0>m?"-":"")+"P"+(g?g+"Y":"")+(h?h+"M":"")+(i?i+"D":"")+(j||k||l?"T":"")+(j?j+"H":"")+(k?k+"M":"")+(l?l+"S":""):"P0D"}var Hc,Ic,Jc=a.momentProperties=[],Kc=!1,Lc={},Mc={},Nc=/(\[[^\[]*\])|(\\)?(Mo|MM?M?M?|Do|DDDo|DD?D?D?|ddd?d?|do?|w[o|w]?|W[o|W]?|Q|YYYYYY|YYYYY|YYYY|YY|gg(ggg?)?|GG(GGG?)?|e|E|a|A|hh?|HH?|mm?|ss?|S{1,9}|x|X|zz?|ZZ?|.)/g,Oc=/(\[[^\[]*\])|(\\)?(LTS|LT|LL?L?L?|l{1,4})/g,Pc={},Qc={},Rc=/\d/,Sc=/\d\d/,Tc=/\d{3}/,Uc=/\d{4}/,Vc=/[+-]?\d{6}/,Wc=/\d\d?/,Xc=/\d{1,3}/,Yc=/\d{1,4}/,Zc=/[+-]?\d{1,6}/,$c=/\d+/,_c=/[+-]?\d+/,ad=/Z|[+-]\d\d:?\d\d/gi,bd=/[+-]?\d+(\.\d{1,3})?/,cd=/[0-9]*['a-z\u00A0-\u05FF\u0700-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]+|[\u0600-\u06FF\/]+(\s*?[\u0600-\u06FF]+){1,2}/i,dd={},ed={},fd=0,gd=1,hd=2,id=3,jd=4,kd=5,ld=6;H("M",["MM",2],"Mo",function(){return this.month()+1}),H("MMM",0,0,function(a){return this.localeData().monthsShort(this,a)}),H("MMMM",0,0,function(a){return this.localeData().months(this,a)}),z("month","M"),N("M",Wc),N("MM",Wc,Sc),N("MMM",cd),N("MMMM",cd),Q(["M","MM"],function(a,b){b[gd]=q(a)-1}),Q(["MMM","MMMM"],function(a,b,c,d){var e=c._locale.monthsParse(a,d,c._strict);null!=e?b[gd]=e:j(c).invalidMonth=a});var md="January_February_March_April_May_June_July_August_September_October_November_December".split("_"),nd="Jan_Feb_Mar_Apr_May_Jun_Jul_Aug_Sep_Oct_Nov_Dec".split("_"),od={};a.suppressDeprecationWarnings=!1;var pd=/^\s*(?:[+-]\d{6}|\d{4})-(?:(\d\d-\d\d)|(W\d\d$)|(W\d\d-\d)|(\d\d\d))((T| )(\d\d(:\d\d(:\d\d(\.\d+)?)?)?)?([\+\-]\d\d(?::?\d\d)?|\s*Z)?)?$/,qd=[["YYYYYY-MM-DD",/[+-]\d{6}-\d{2}-\d{2}/],["YYYY-MM-DD",/\d{4}-\d{2}-\d{2}/],["GGGG-[W]WW-E",/\d{4}-W\d{2}-\d/],["GGGG-[W]WW",/\d{4}-W\d{2}/],["YYYY-DDD",/\d{4}-\d{3}/]],rd=[["HH:mm:ss.SSSS",/(T| )\d\d:\d\d:\d\d\.\d+/],["HH:mm:ss",/(T| )\d\d:\d\d:\d\d/],["HH:mm",/(T| )\d\d:\d\d/],["HH",/(T| )\d\d/]],sd=/^\/?Date\((\-?\d+)/i;a.createFromInputFallback=aa("moment construction falls back to js Date. This is discouraged and will be removed in upcoming major release. Please refer to https://github.com/moment/moment/issues/1407 for more info.",function(a){a._d=new Date(a._i+(a._useUTC?" UTC":""))}),H(0,["YY",2],0,function(){return this.year()%100}),H(0,["YYYY",4],0,"year"),H(0,["YYYYY",5],0,"year"),H(0,["YYYYYY",6,!0],0,"year"),z("year","y"),N("Y",_c),N("YY",Wc,Sc),N("YYYY",Yc,Uc),N("YYYYY",Zc,Vc),N("YYYYYY",Zc,Vc),Q(["YYYYY","YYYYYY"],fd),Q("YYYY",function(b,c){c[fd]=2===b.length?a.parseTwoDigitYear(b):q(b)}),Q("YY",function(b,c){c[fd]=a.parseTwoDigitYear(b)}),a.parseTwoDigitYear=function(a){return q(a)+(q(a)>68?1900:2e3)};var td=C("FullYear",!1);H("w",["ww",2],"wo","week"),H("W",["WW",2],"Wo","isoWeek"),z("week","w"),z("isoWeek","W"),N("w",Wc),N("ww",Wc,Sc),N("W",Wc),N("WW",Wc,Sc),R(["w","ww","W","WW"],function(a,b,c,d){b[d.substr(0,1)]=q(a)});var ud={dow:0,doy:6};H("DDD",["DDDD",3],"DDDo","dayOfYear"),z("dayOfYear","DDD"),N("DDD",Xc),N("DDDD",Tc),Q(["DDD","DDDD"],function(a,b,c){c._dayOfYear=q(a)}),a.ISO_8601=function(){};var vd=aa("moment().min is deprecated, use moment.min instead. https://github.com/moment/moment/issues/1548",function(){var a=Da.apply(null,arguments);return this>a?this:a}),wd=aa("moment().max is deprecated, use moment.max instead. https://github.com/moment/moment/issues/1548",function(){var a=Da.apply(null,arguments);return a>this?this:a});Ja("Z",":"),Ja("ZZ",""),N("Z",ad),N("ZZ",ad),Q(["Z","ZZ"],function(a,b,c){c._useUTC=!0,c._tzm=Ka(a)});var xd=/([\+\-]|\d\d)/gi;a.updateOffset=function(){};var yd=/(\-)?(?:(\d*)\.)?(\d+)\:(\d+)(?:\:(\d+)\.?(\d{3})?)?/,zd=/^(-)?P(?:(?:([0-9,.]*)Y)?(?:([0-9,.]*)M)?(?:([0-9,.]*)D)?(?:T(?:([0-9,.]*)H)?(?:([0-9,.]*)M)?(?:([0-9,.]*)S)?)?|([0-9,.]*)W)$/;Ya.fn=Ha.prototype;var Ad=ab(1,"add"),Bd=ab(-1,"subtract");a.defaultFormat="YYYY-MM-DDTHH:mm:ssZ";var Cd=aa("moment().lang() is deprecated. Instead, use moment().localeData() to get the language configuration. Use moment().locale() to change languages.",function(a){return void 0===a?this.localeData():this.locale(a)});H(0,["gg",2],0,function(){return this.weekYear()%100}),H(0,["GG",2],0,function(){return this.isoWeekYear()%100}),Db("gggg","weekYear"),Db("ggggg","weekYear"),Db("GGGG","isoWeekYear"),Db("GGGGG","isoWeekYear"),z("weekYear","gg"),z("isoWeekYear","GG"),N("G",_c),N("g",_c),N("GG",Wc,Sc),N("gg",Wc,Sc),N("GGGG",Yc,Uc),N("gggg",Yc,Uc),N("GGGGG",Zc,Vc),N("ggggg",Zc,Vc),R(["gggg","ggggg","GGGG","GGGGG"],function(a,b,c,d){b[d.substr(0,2)]=q(a)}),R(["gg","GG"],function(b,c,d,e){c[e]=a.parseTwoDigitYear(b)}),H("Q",0,0,"quarter"),z("quarter","Q"),N("Q",Rc),Q("Q",function(a,b){b[gd]=3*(q(a)-1)}),H("D",["DD",2],"Do","date"),z("date","D"),N("D",Wc),N("DD",Wc,Sc),N("Do",function(a,b){return a?b._ordinalParse:b._ordinalParseLenient}),Q(["D","DD"],hd),Q("Do",function(a,b){b[hd]=q(a.match(Wc)[0],10)});var Dd=C("Date",!0);H("d",0,"do","day"),H("dd",0,0,function(a){return this.localeData().weekdaysMin(this,a)}),H("ddd",0,0,function(a){return this.localeData().weekdaysShort(this,a)}),H("dddd",0,0,function(a){return this.localeData().weekdays(this,a)}),H("e",0,0,"weekday"),H("E",0,0,"isoWeekday"),z("day","d"),z("weekday","e"),z("isoWeekday","E"),N("d",Wc),N("e",Wc),N("E",Wc),N("dd",cd),N("ddd",cd),N("dddd",cd),R(["dd","ddd","dddd"],function(a,b,c){var d=c._locale.weekdaysParse(a);null!=d?b.d=d:j(c).invalidWeekday=a}),R(["d","e","E"],function(a,b,c,d){b[d]=q(a)});var Ed="Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),Fd="Sun_Mon_Tue_Wed_Thu_Fri_Sat".split("_"),Gd="Su_Mo_Tu_We_Th_Fr_Sa".split("_");H("H",["HH",2],0,"hour"),H("h",["hh",2],0,function(){return this.hours()%12||12}),Sb("a",!0),Sb("A",!1),z("hour","h"),N("a",Tb),N("A",Tb),N("H",Wc),N("h",Wc),N("HH",Wc,Sc),N("hh",Wc,Sc),Q(["H","HH"],id),Q(["a","A"],function(a,b,c){c._isPm=c._locale.isPM(a),c._meridiem=a}),Q(["h","hh"],function(a,b,c){b[id]=q(a),j(c).bigHour=!0});var Hd=/[ap]\.?m?\.?/i,Id=C("Hours",!0);H("m",["mm",2],0,"minute"),z("minute","m"),N("m",Wc),N("mm",Wc,Sc),Q(["m","mm"],jd);var Jd=C("Minutes",!1);H("s",["ss",2],0,"second"),z("second","s"),N("s",Wc),N("ss",Wc,Sc),Q(["s","ss"],kd);var Kd=C("Seconds",!1);H("S",0,0,function(){return~~(this.millisecond()/100)}),H(0,["SS",2],0,function(){return~~(this.millisecond()/10)}),H(0,["SSS",3],0,"millisecond"),H(0,["SSSS",4],0,function(){return 10*this.millisecond()}),H(0,["SSSSS",5],0,function(){return 100*this.millisecond()}),H(0,["SSSSSS",6],0,function(){return 1e3*this.millisecond()}),H(0,["SSSSSSS",7],0,function(){return 1e4*this.millisecond()}),H(0,["SSSSSSSS",8],0,function(){return 1e5*this.millisecond()}),H(0,["SSSSSSSSS",9],0,function(){return 1e6*this.millisecond()}),z("millisecond","ms"),N("S",Xc,Rc),N("SS",Xc,Sc),N("SSS",Xc,Tc);var Ld;for(Ld="SSSS";Ld.length<=9;Ld+="S")N(Ld,$c);for(Ld="S";Ld.length<=9;Ld+="S")Q(Ld,Wb);var Md=C("Milliseconds",!1);H("z",0,0,"zoneAbbr"),H("zz",0,0,"zoneName");var Nd=n.prototype;Nd.add=Ad,Nd.calendar=cb,Nd.clone=db,Nd.diff=ib,Nd.endOf=ub,Nd.format=mb,Nd.from=nb,Nd.fromNow=ob,Nd.to=pb,Nd.toNow=qb,Nd.get=F,Nd.invalidAt=Cb,Nd.isAfter=eb,Nd.isBefore=fb,Nd.isBetween=gb,Nd.isSame=hb,Nd.isValid=Ab,Nd.lang=Cd,Nd.locale=rb,Nd.localeData=sb,Nd.max=wd,Nd.min=vd,Nd.parsingFlags=Bb,Nd.set=F,Nd.startOf=tb,Nd.subtract=Bd,Nd.toArray=yb,Nd.toObject=zb,Nd.toDate=xb,Nd.toISOString=lb,Nd.toJSON=lb,Nd.toString=kb,Nd.unix=wb,Nd.valueOf=vb,Nd.year=td,Nd.isLeapYear=ia,Nd.weekYear=Fb,Nd.isoWeekYear=Gb,Nd.quarter=Nd.quarters=Jb,Nd.month=Y,Nd.daysInMonth=Z,Nd.week=Nd.weeks=na,Nd.isoWeek=Nd.isoWeeks=oa,Nd.weeksInYear=Ib,Nd.isoWeeksInYear=Hb,Nd.date=Dd,Nd.day=Nd.days=Pb,Nd.weekday=Qb,Nd.isoWeekday=Rb,Nd.dayOfYear=qa,Nd.hour=Nd.hours=Id,Nd.minute=Nd.minutes=Jd,Nd.second=Nd.seconds=Kd,
+  Nd.millisecond=Nd.milliseconds=Md,Nd.utcOffset=Na,Nd.utc=Pa,Nd.local=Qa,Nd.parseZone=Ra,Nd.hasAlignedHourOffset=Sa,Nd.isDST=Ta,Nd.isDSTShifted=Ua,Nd.isLocal=Va,Nd.isUtcOffset=Wa,Nd.isUtc=Xa,Nd.isUTC=Xa,Nd.zoneAbbr=Xb,Nd.zoneName=Yb,Nd.dates=aa("dates accessor is deprecated. Use date instead.",Dd),Nd.months=aa("months accessor is deprecated. Use month instead",Y),Nd.years=aa("years accessor is deprecated. Use year instead",td),Nd.zone=aa("moment().zone is deprecated, use moment().utcOffset instead. https://github.com/moment/moment/issues/1779",Oa);var Od=Nd,Pd={sameDay:"[Today at] LT",nextDay:"[Tomorrow at] LT",nextWeek:"dddd [at] LT",lastDay:"[Yesterday at] LT",lastWeek:"[Last] dddd [at] LT",sameElse:"L"},Qd={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},Rd="Invalid date",Sd="%d",Td=/\d{1,2}/,Ud={future:"in %s",past:"%s ago",s:"a few seconds",m:"a minute",mm:"%d minutes",h:"an hour",hh:"%d hours",d:"a day",dd:"%d days",M:"a month",MM:"%d months",y:"a year",yy:"%d years"},Vd=s.prototype;Vd._calendar=Pd,Vd.calendar=_b,Vd._longDateFormat=Qd,Vd.longDateFormat=ac,Vd._invalidDate=Rd,Vd.invalidDate=bc,Vd._ordinal=Sd,Vd.ordinal=cc,Vd._ordinalParse=Td,Vd.preparse=dc,Vd.postformat=dc,Vd._relativeTime=Ud,Vd.relativeTime=ec,Vd.pastFuture=fc,Vd.set=gc,Vd.months=U,Vd._months=md,Vd.monthsShort=V,Vd._monthsShort=nd,Vd.monthsParse=W,Vd.week=ka,Vd._week=ud,Vd.firstDayOfYear=ma,Vd.firstDayOfWeek=la,Vd.weekdays=Lb,Vd._weekdays=Ed,Vd.weekdaysMin=Nb,Vd._weekdaysMin=Gd,Vd.weekdaysShort=Mb,Vd._weekdaysShort=Fd,Vd.weekdaysParse=Ob,Vd.isPM=Ub,Vd._meridiemParse=Hd,Vd.meridiem=Vb,w("en",{ordinalParse:/\d{1,2}(th|st|nd|rd)/,ordinal:function(a){var b=a%10,c=1===q(a%100/10)?"th":1===b?"st":2===b?"nd":3===b?"rd":"th";return a+c}}),a.lang=aa("moment.lang is deprecated. Use moment.locale instead.",w),a.langData=aa("moment.langData is deprecated. Use moment.localeData instead.",y);var Wd=Math.abs,Xd=yc("ms"),Yd=yc("s"),Zd=yc("m"),$d=yc("h"),_d=yc("d"),ae=yc("w"),be=yc("M"),ce=yc("y"),de=Ac("milliseconds"),ee=Ac("seconds"),fe=Ac("minutes"),ge=Ac("hours"),he=Ac("days"),ie=Ac("months"),je=Ac("years"),ke=Math.round,le={s:45,m:45,h:22,d:26,M:11},me=Math.abs,ne=Ha.prototype;ne.abs=oc,ne.add=qc,ne.subtract=rc,ne.as=wc,ne.asMilliseconds=Xd,ne.asSeconds=Yd,ne.asMinutes=Zd,ne.asHours=$d,ne.asDays=_d,ne.asWeeks=ae,ne.asMonths=be,ne.asYears=ce,ne.valueOf=xc,ne._bubble=tc,ne.get=zc,ne.milliseconds=de,ne.seconds=ee,ne.minutes=fe,ne.hours=ge,ne.days=he,ne.weeks=Bc,ne.months=ie,ne.years=je,ne.humanize=Fc,ne.toISOString=Gc,ne.toString=Gc,ne.toJSON=Gc,ne.locale=rb,ne.localeData=sb,ne.toIsoString=aa("toIsoString() is deprecated. Please use toISOString() instead (notice the capitals)",Gc),ne.lang=Cd,H("X",0,0,"unix"),H("x",0,0,"valueOf"),N("x",_c),N("X",bd),Q("X",function(a,b,c){c._d=new Date(1e3*parseFloat(a,10))}),Q("x",function(a,b,c){c._d=new Date(q(a))}),a.version="2.10.6",b(Da),a.fn=Od,a.min=Fa,a.max=Ga,a.utc=h,a.unix=Zb,a.months=jc,a.isDate=d,a.locale=w,a.invalid=l,a.duration=Ya,a.isMoment=o,a.weekdays=lc,a.parseZone=$b,a.localeData=y,a.isDuration=Ia,a.monthsShort=kc,a.weekdaysMin=nc,a.defineLocale=x,a.weekdaysShort=mc,a.normalizeUnits=A,a.relativeTimeThreshold=Ec;var oe=a;return oe});
+/*!
+ * jQuery cxSelect
+ * @name jquery.cxselect.js
+ * @version 1.4.1
+ * @date 2016-11-02
+ * @author ciaoca
+ * @email ciaoca@gmail.com
+ * @site https://github.com/ciaoca/cxSelect
+ * @license Released under the MIT license
+ */
+
+(function(factory) {
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else {
+    factory(window.jQuery || window.Zepto || window.$);
+  };
+}(function($) {
+  var cxSelect = function() {
+    var self = this;
+    var dom, settings, callback;
+
+    // 分配参数
+    for (var i = 0, l = arguments.length; i < l; i++) {
+      if (cxSelect.isJquery(arguments[i]) || cxSelect.isZepto(arguments[i])) {
+        dom = arguments[i];
+      } else if (cxSelect.isElement(arguments[i])) {
+        dom = $(arguments[i]);
+      } else if (typeof arguments[i] === 'function') {
+        callback = arguments[i];
+      } else if (typeof arguments[i] === 'object') {
+        settings = arguments[i];
+      };
+    };
+
+    var api = new cxSelect.init(dom, settings);
+
+    if (typeof callback === 'function') {
+      callback(api);
+    };
+
+    return api;
+  };
+
+  cxSelect.isElement = function(o){
+    if (o && (typeof HTMLElement === 'function' || typeof HTMLElement === 'object') && o instanceof HTMLElement) {
+      return true;
+    } else {
+      return (o && o.nodeType && o.nodeType === 1) ? true : false;
+    };
+  };
+
+  cxSelect.isJquery = function(o){
+    return (o && o.length && (typeof jQuery === 'function' || typeof jQuery === 'object') && o instanceof jQuery) ? true : false;
+  };
+
+  cxSelect.isZepto = function(o){
+    return (o && o.length && (typeof Zepto === 'function' || typeof Zepto === 'object') && Zepto.zepto.isZ(o)) ? true : false;
+  };
+
+  cxSelect.getIndex = function(n, required) {
+    return required ? n : n - 1;
+  };
+
+  cxSelect.getData = function(data, space) {
+    if (typeof space === 'string' && space.length) {
+      space = space.split('.');
+      for (var i = 0, l = space.length; i < l; i++) {
+        data = data[space[i]];
+      };
+    };
+    return data;
+  };
+
+  cxSelect.init = function(dom, settings) {
+    var self = this;
+
+    if (!cxSelect.isJquery(dom) && !cxSelect.isZepto(dom)) {return};
+
+    var theSelect = {
+      dom: {
+        box: dom
+      }
+    };
+
+    self.attach = cxSelect.attach.bind(theSelect);
+    self.detach = cxSelect.detach.bind(theSelect);
+    self.setOptions = cxSelect.setOptions.bind(theSelect);
+    self.clear = cxSelect.clear.bind(theSelect);
+
+    theSelect.changeEvent = function() {
+      cxSelect.selectChange.call(theSelect, this.className);
+    };
+
+    theSelect.settings = $.extend({}, $.cxSelect.defaults, settings, {
+      url: theSelect.dom.box.data('url'),
+      emptyStyle: theSelect.dom.box.data('emptyStyle'),
+      required: theSelect.dom.box.data('required'),
+      firstTitle: theSelect.dom.box.data('firstTitle'),
+      firstValue: theSelect.dom.box.data('firstValue'),
+      jsonSpace: theSelect.dom.box.data('jsonSpace'),
+      jsonName: theSelect.dom.box.data('jsonName'),
+      jsonValue: theSelect.dom.box.data('jsonValue'),
+      jsonSub: theSelect.dom.box.data('jsonSub')
+    });
+
+    var _dataSelects = theSelect.dom.box.data('selects');
+
+    if (typeof _dataSelects === 'string' && _dataSelects.length) {
+      theSelect.settings.selects = _dataSelects.split(',');
+    };
+
+    self.setOptions();
+    self.attach();
+
+    // 使用独立接口获取数据
+    if (!theSelect.settings.url && !theSelect.settings.data) {
+      cxSelect.start.apply(theSelect);
+
+    // 设置自定义数据
+    } else if ($.isArray(theSelect.settings.data)) {
+      cxSelect.start.call(theSelect, theSelect.settings.data);
+
+    // 设置 URL，通过 Ajax 获取数据
+    } else if (typeof theSelect.settings.url === 'string' && theSelect.settings.url.length) {
+      $.getJSON(theSelect.settings.url, function(json) {
+        cxSelect.start.call(theSelect, json);
+      });
+    };
+  };
+
+  // 设置参数
+  cxSelect.setOptions = function(opts) {
+    var self = this;
+
+    if (opts) {
+      $.extend(self.settings, opts);
+    };
+
+    // 初次或重设选择器组
+    if (!$.isArray(self.selectArray) || !self.selectArray.length || (opts && opts.selects)) {
+      self.selectArray = [];
+
+      if ($.isArray(self.settings.selects) && self.settings.selects.length) {
+        var _tempSelect;
+
+        for (var i = 0, l = self.settings.selects.length; i < l; i++) {
+          _tempSelect = self.dom.box.find('select.' + self.settings.selects[i]);
+
+          if (!_tempSelect || !_tempSelect.length) {break};
+
+          self.selectArray.push(_tempSelect);
+        };
+      };
+    };
+
+    if (opts) {
+      if (!$.isArray(opts.data) && typeof opts.url === 'string' && opts.url.length) {
+        $.getJSON(self.settings.url, function(json) {
+          cxSelect.start.call(self, json);
+        });
+
+      } else {
+        cxSelect.start.call(self, opts.data);
+      };
+    };
+  };
+
+  // 绑定
+  cxSelect.attach = function() {
+    var self = this;
+
+    if (!self.attachStatus) {
+      self.dom.box.on('change', 'select', self.changeEvent);
+    };
+
+    if (typeof self.attachStatus === 'boolean') {
+      cxSelect.start.call(self);
+    };
+
+    self.attachStatus = true;
+  };
+
+  // 移除绑定
+  cxSelect.detach = function() {
+    var self = this;
+    self.dom.box.off('change', 'select', self.changeEvent);
+    self.attachStatus = false;
+  };
+
+  // 清空选项
+  cxSelect.clear = function(index) {
+    var self = this;
+    var _style = {
+      display: '',
+      visibility: ''
+    };
+
+    index = isNaN(index) ? 0 : index;
+
+    // 清空后面的 select
+    for (var i = index, l = self.selectArray.length; i < l; i++) {
+      self.selectArray[i].empty().prop('disabled', true);
+
+      if (self.settings.emptyStyle === 'none') {
+        _style.display = 'none';
+      } else if (self.settings.emptyStyle === 'hidden') {
+        _style.visibility = 'hidden';
+      };
+
+      self.selectArray[i].css(_style);
+    };
+  };
+
+  cxSelect.start = function(data) {
+    var self = this;
+
+    if ($.isArray(data)) {
+      self.settings.data = cxSelect.getData(data, self.settings.jsonSpace);
+    };
+
+    if (!self.selectArray.length) {return};
+
+    // 保存默认值
+    for (var i = 0, l = self.selectArray.length; i < l; i++) {
+      if (typeof self.selectArray[i].attr('data-value') !== 'string' && self.selectArray[i][0].options.length) {
+        self.selectArray[i].attr('data-value', self.selectArray[i].val());
+      };
+    };
+
+    if (self.settings.data || (typeof self.selectArray[0].data('url') === 'string' && self.selectArray[0].data('url').length)) {
+      cxSelect.getOptionData.call(self, 0);
+    } else {
+      self.selectArray[0].prop('disabled', false).css({
+        'display': '',
+        'visibility': ''
+      });
+    };
+  };
+
+  // 获取选项数据
+  cxSelect.getOptionData = function(index) {
+    var self = this;
+
+    if (typeof index !== 'number' || isNaN(index) || index < 0 || index >= self.selectArray.length) {return};
+
+    var _indexPrev = index - 1;
+    var _select = self.selectArray[index];
+    var _selectData;
+    var _valueIndex;
+    var _dataUrl = _select.data('url');
+    var _jsonSpace = typeof _select.data('jsonSpace') === 'undefined' ? self.settings.jsonSpace : _select.data('jsonSpace');
+    var _query = {};
+    var _queryName;
+    var _selectName;
+    var _selectValue;
+
+    cxSelect.clear.call(self, index);
+
+    // 使用独立接口
+    if (typeof _dataUrl === 'string' && _dataUrl.length) {
+      if (index > 0) {
+        for (var i = 0, j = 1; i < index; i++, j++) {
+          _queryName = self.selectArray[j].data('queryName');
+          _selectName = self.selectArray[i].attr('name');
+          _selectValue = self.selectArray[i].val();
+
+          if (typeof _queryName === 'string' && _queryName.length) {
+            _query[_queryName] = _selectValue;
+          } else if (typeof _selectName === 'string' && _selectName.length) {
+            _query[_selectName] = _selectValue;
+          };
+        };
+      };
+
+      $.getJSON(_dataUrl, _query, function(json) {
+        _selectData = cxSelect.getData(json, _jsonSpace);
+
+        cxSelect.buildOption.call(self, index, _selectData);
+      });
+
+    // 使用整合数据
+    } else if (self.settings.data && typeof self.settings.data === 'object') {
+      _selectData = self.settings.data;
+
+      for (var i = 0; i < index; i++) {
+        _valueIndex = cxSelect.getIndex(self.selectArray[i][0].selectedIndex, typeof self.selectArray[i].data('required') === 'boolean' ? self.selectArray[i].data('required') : self.settings.required);
+
+        if (typeof _selectData[_valueIndex] === 'object' && $.isArray(_selectData[_valueIndex][self.settings.jsonSub]) && _selectData[_valueIndex][self.settings.jsonSub].length) {
+          _selectData = _selectData[_valueIndex][self.settings.jsonSub];
+        } else {
+          _selectData = null;
+          break;
+        };
+      };
+
+      cxSelect.buildOption.call(self, index, _selectData);
+    };
+  };
+
+  // 构建选项列表
+  cxSelect.buildOption = function(index, data) {
+    var self = this;
+
+    var _select = self.selectArray[index];
+    var _required = typeof _select.data('required') === 'boolean' ? _select.data('required') : self.settings.required;
+    var _firstTitle = typeof _select.data('firstTitle') === 'undefined' ? self.settings.firstTitle : _select.data('firstTitle');
+    var _firstValue = typeof _select.data('firstValue') === 'undefined' ? self.settings.firstValue : _select.data('firstValue');
+    var _jsonName = typeof _select.data('jsonName') === 'undefined' ? self.settings.jsonName : _select.data('jsonName');
+    var _jsonValue = typeof _select.data('jsonValue') === 'undefined' ? self.settings.jsonValue : _select.data('jsonValue');
+
+    if (!$.isArray(data)) {return};
+
+    var _html = !_required ? '<option value="' + String(_firstValue) + '">' + String(_firstTitle) + '</option>' : '';
+
+    // 区分标题、值的数据
+    if (typeof _jsonName === 'string' && _jsonName.length) {
+      // 无值字段时使用标题作为值
+      if (typeof _jsonValue !== 'string' || !_jsonValue.length) {
+        _jsonValue = _jsonName;
+      };
+
+      for (var i = 0, l = data.length; i < l; i++) {
+        _html += '<option value="' + String(data[i][_jsonValue]) + '">' + String(data[i][_jsonName]) + '</option>';
+      };
+
+    // 数组即为值的数据
+    } else {
+      for (var i = 0, l = data.length; i < l; i++) {
+        _html += '<option value="' + String(data[i]) + '">' + String(data[i]) + '</option>';
+      };
+    };
+
+    _select.html(_html).prop('disabled', false).css({
+      'display': '',
+      'visibility': ''
+    });
+
+    // 初次加载设置默认值
+    if (typeof _select.attr('data-value') === 'string') {
+      _select.val(String(_select.attr('data-value'))).removeAttr('data-value');
+
+      if (_select[0].selectedIndex < 0) {
+        _select[0].options[0].selected = true;
+      };
+    };
+
+    if (_required || _select[0].selectedIndex > 0) {
+      _select.trigger('change');
+    };
+
+  };
+
+  // 改变选择时的处理
+  cxSelect.selectChange = function(name) {
+    var self = this;
+
+    if (typeof name !== 'string' || !name.length) {return};
+
+    var index;
+
+    name = name.replace(/\s+/g, ',');
+    name = ',' + name + ',';
+
+    // 获取当前 select 位置
+    for (var i = 0, l = self.selectArray.length; i < l; i++) {
+      if (name.indexOf(',' + self.settings.selects[i] + ',') > -1) {
+        index = i;
+        break;
+      };
+    };
+
+    if (typeof index === 'number' && index > -1) {
+      index += 1;
+      cxSelect.getOptionData.call(self, index);
+    };
+  };
+
+  $.cxSelect = function() {
+    return cxSelect.apply(this, arguments);
+  };
+
+  // 默认值
+  $.cxSelect.defaults = {
+    selects: [],            // 下拉选框组
+    url: null,              // 列表数据文件路径（URL）或数组数据
+    data: null,             // 自定义数据
+    emptyStyle: null,       // 无数据状态显示方式
+    required: false,        // 是否为必选
+    firstTitle: '请选择',    // 第一个选项的标题
+    firstValue: '',         // 第一个选项的值
+    jsonSpace: '',          // 数据命名空间
+    jsonName: 'n',          // 数据标题字段名称
+    jsonValue: '',          // 数据值字段名称
+    jsonSub: 's'            // 子集数据字段名称
+  };
+
+  $.fn.cxSelect = function(settings, callback) {
+    this.each(function(i) {
+      $.cxSelect(this, settings, callback);
+    });
+    return this;
+  };
+}));
+/*!
+ * Datepicker for Bootstrap v1.9.0 (https://github.com/uxsolutions/bootstrap-datepicker)
+ *
+ * Licensed under the Apache License v2.0 (http://www.apache.org/licenses/LICENSE-2.0)
+ */
+
+
+(function(factory){
+  if (typeof define === 'function' && define.amd) {
+    define(['jquery'], factory);
+  } else if (typeof exports === 'object') {
+    factory(require('jquery'));
+  } else {
+    factory(jQuery);
+  }
+}(function($, undefined){
+  function UTCDate(){
+    return new Date(Date.UTC.apply(Date, arguments));
+  }
+  function UTCToday(){
+    var today = new Date();
+    return UTCDate(today.getFullYear(), today.getMonth(), today.getDate());
+  }
+  function isUTCEquals(date1, date2) {
+    return (
+      date1.getUTCFullYear() === date2.getUTCFullYear() &&
+      date1.getUTCMonth() === date2.getUTCMonth() &&
+      date1.getUTCDate() === date2.getUTCDate()
+    );
+  }
+  function alias(method, deprecationMsg){
+    return function(){
+      if (deprecationMsg !== undefined) {
+        $.fn.datepicker.deprecated(deprecationMsg);
+      }
+
+      return this[method].apply(this, arguments);
+    };
+  }
+  function isValidDate(d) {
+    return d && !isNaN(d.getTime());
+  }
+
+  var DateArray = (function(){
+    var extras = {
+      get: function(i){
+        return this.slice(i)[0];
+      },
+      contains: function(d){
+        // Array.indexOf is not cross-browser;
+        // $.inArray doesn't work with Dates
+        var val = d && d.valueOf();
+        for (var i=0, l=this.length; i < l; i++)
+          // Use date arithmetic to allow dates with different times to match
+          if (0 <= this[i].valueOf() - val && this[i].valueOf() - val < 1000*60*60*24)
+            return i;
+        return -1;
+      },
+      remove: function(i){
+        this.splice(i,1);
+      },
+      replace: function(new_array){
+        if (!new_array)
+          return;
+        if (!$.isArray(new_array))
+          new_array = [new_array];
+        this.clear();
+        this.push.apply(this, new_array);
+      },
+      clear: function(){
+        this.length = 0;
+      },
+      copy: function(){
+        var a = new DateArray();
+        a.replace(this);
+        return a;
+      }
+    };
+
+    return function(){
+      var a = [];
+      a.push.apply(a, arguments);
+      $.extend(a, extras);
+      return a;
+    };
+  })();
+
+
+  // Picker object
+
+  var Datepicker = function(element, options){
+    $.data(element, 'datepicker', this);
+
+    this._events = [];
+    this._secondaryEvents = [];
+
+    this._process_options(options);
+
+    this.dates = new DateArray();
+    this.viewDate = this.o.defaultViewDate;
+    this.focusDate = null;
+
+    this.element = $(element);
+    this.isInput = this.element.is('input');
+    this.inputField = this.isInput ? this.element : this.element.find('input');
+    this.component = this.element.hasClass('date') ? this.element.find('.add-on, .input-group-addon, .input-group-append, .input-group-prepend, .btn') : false;
+    if (this.component && this.component.length === 0)
+      this.component = false;
+    this.isInline = !this.component && this.element.is('div');
+
+    this.picker = $(DPGlobal.template);
+
+    // Checking templates and inserting
+    if (this._check_template(this.o.templates.leftArrow)) {
+      this.picker.find('.prev').html(this.o.templates.leftArrow);
+    }
+
+    if (this._check_template(this.o.templates.rightArrow)) {
+      this.picker.find('.next').html(this.o.templates.rightArrow);
+    }
+
+    this._buildEvents();
+    this._attachEvents();
+
+    if (this.isInline){
+      this.picker.addClass('datepicker-inline').appendTo(this.element);
+    }
+    else {
+      this.picker.addClass('datepicker-dropdown dropdown-menu');
+    }
+
+    if (this.o.rtl){
+      this.picker.addClass('datepicker-rtl');
+    }
+
+    if (this.o.calendarWeeks) {
+      this.picker.find('.datepicker-days .datepicker-switch, thead .datepicker-title, tfoot .today, tfoot .clear')
+        .attr('colspan', function(i, val){
+          return Number(val) + 1;
+        });
+    }
+
+    this._process_options({
+      startDate: this._o.startDate,
+      endDate: this._o.endDate,
+      daysOfWeekDisabled: this.o.daysOfWeekDisabled,
+      daysOfWeekHighlighted: this.o.daysOfWeekHighlighted,
+      datesDisabled: this.o.datesDisabled
+    });
+
+    this._allow_update = false;
+    this.setViewMode(this.o.startView);
+    this._allow_update = true;
+
+    this.fillDow();
+    this.fillMonths();
+
+    this.update();
+
+    if (this.isInline){
+      this.show();
+    }
+  };
+
+  Datepicker.prototype = {
+    constructor: Datepicker,
+
+    _resolveViewName: function(view){
+      $.each(DPGlobal.viewModes, function(i, viewMode){
+        if (view === i || $.inArray(view, viewMode.names) !== -1){
+          view = i;
+          return false;
+        }
+      });
+
+      return view;
+    },
+
+    _resolveDaysOfWeek: function(daysOfWeek){
+      if (!$.isArray(daysOfWeek))
+        daysOfWeek = daysOfWeek.split(/[,\s]*/);
+      return $.map(daysOfWeek, Number);
+    },
+
+    _check_template: function(tmp){
+      try {
+        // If empty
+        if (tmp === undefined || tmp === "") {
+          return false;
+        }
+        // If no html, everything ok
+        if ((tmp.match(/[<>]/g) || []).length <= 0) {
+          return true;
+        }
+        // Checking if html is fine
+        var jDom = $(tmp);
+        return jDom.length > 0;
+      }
+      catch (ex) {
+        return false;
+      }
+    },
+
+    _process_options: function(opts){
+      // Store raw options for reference
+      this._o = $.extend({}, this._o, opts);
+      // Processed options
+      var o = this.o = $.extend({}, this._o);
+
+      // Check if "de-DE" style date is available, if not language should
+      // fallback to 2 letter code eg "de"
+      var lang = o.language;
+      if (!dates[lang]){
+        lang = lang.split('-')[0];
+        if (!dates[lang])
+          lang = defaults.language;
+      }
+      o.language = lang;
+
+      // Retrieve view index from any aliases
+      o.startView = this._resolveViewName(o.startView);
+      o.minViewMode = this._resolveViewName(o.minViewMode);
+      o.maxViewMode = this._resolveViewName(o.maxViewMode);
+
+      // Check view is between min and max
+      o.startView = Math.max(this.o.minViewMode, Math.min(this.o.maxViewMode, o.startView));
+
+      // true, false, or Number > 0
+      if (o.multidate !== true){
+        o.multidate = Number(o.multidate) || false;
+        if (o.multidate !== false)
+          o.multidate = Math.max(0, o.multidate);
+      }
+      o.multidateSeparator = String(o.multidateSeparator);
+
+      o.weekStart %= 7;
+      o.weekEnd = (o.weekStart + 6) % 7;
+
+      var format = DPGlobal.parseFormat(o.format);
+      if (o.startDate !== -Infinity){
+        if (!!o.startDate){
+          if (o.startDate instanceof Date)
+            o.startDate = this._local_to_utc(this._zero_time(o.startDate));
+          else
+            o.startDate = DPGlobal.parseDate(o.startDate, format, o.language, o.assumeNearbyYear);
+        }
+        else {
+          o.startDate = -Infinity;
+        }
+      }
+      if (o.endDate !== Infinity){
+        if (!!o.endDate){
+          if (o.endDate instanceof Date)
+            o.endDate = this._local_to_utc(this._zero_time(o.endDate));
+          else
+            o.endDate = DPGlobal.parseDate(o.endDate, format, o.language, o.assumeNearbyYear);
+        }
+        else {
+          o.endDate = Infinity;
+        }
+      }
+
+      o.daysOfWeekDisabled = this._resolveDaysOfWeek(o.daysOfWeekDisabled||[]);
+      o.daysOfWeekHighlighted = this._resolveDaysOfWeek(o.daysOfWeekHighlighted||[]);
+
+      o.datesDisabled = o.datesDisabled||[];
+      if (!$.isArray(o.datesDisabled)) {
+        o.datesDisabled = o.datesDisabled.split(',');
+      }
+      o.datesDisabled = $.map(o.datesDisabled, function(d){
+        return DPGlobal.parseDate(d, format, o.language, o.assumeNearbyYear);
+      });
+
+      var plc = String(o.orientation).toLowerCase().split(/\s+/g),
+        _plc = o.orientation.toLowerCase();
+      plc = $.grep(plc, function(word){
+        return /^auto|left|right|top|bottom$/.test(word);
+      });
+      o.orientation = {x: 'auto', y: 'auto'};
+      if (!_plc || _plc === 'auto')
+        ; // no action
+      else if (plc.length === 1){
+        switch (plc[0]){
+          case 'top':
+          case 'bottom':
+            o.orientation.y = plc[0];
+            break;
+          case 'left':
+          case 'right':
+            o.orientation.x = plc[0];
+            break;
+        }
+      }
+      else {
+        _plc = $.grep(plc, function(word){
+          return /^left|right$/.test(word);
+        });
+        o.orientation.x = _plc[0] || 'auto';
+
+        _plc = $.grep(plc, function(word){
+          return /^top|bottom$/.test(word);
+        });
+        o.orientation.y = _plc[0] || 'auto';
+      }
+      if (o.defaultViewDate instanceof Date || typeof o.defaultViewDate === 'string') {
+        o.defaultViewDate = DPGlobal.parseDate(o.defaultViewDate, format, o.language, o.assumeNearbyYear);
+      } else if (o.defaultViewDate) {
+        var year = o.defaultViewDate.year || new Date().getFullYear();
+        var month = o.defaultViewDate.month || 0;
+        var day = o.defaultViewDate.day || 1;
+        o.defaultViewDate = UTCDate(year, month, day);
+      } else {
+        o.defaultViewDate = UTCToday();
+      }
+    },
+    _applyEvents: function(evs){
+      for (var i=0, el, ch, ev; i < evs.length; i++){
+        el = evs[i][0];
+        if (evs[i].length === 2){
+          ch = undefined;
+          ev = evs[i][1];
+        } else if (evs[i].length === 3){
+          ch = evs[i][1];
+          ev = evs[i][2];
+        }
+        el.on(ev, ch);
+      }
+    },
+    _unapplyEvents: function(evs){
+      for (var i=0, el, ev, ch; i < evs.length; i++){
+        el = evs[i][0];
+        if (evs[i].length === 2){
+          ch = undefined;
+          ev = evs[i][1];
+        } else if (evs[i].length === 3){
+          ch = evs[i][1];
+          ev = evs[i][2];
+        }
+        el.off(ev, ch);
+      }
+    },
+    _buildEvents: function(){
+      var events = {
+        keyup: $.proxy(function(e){
+          if ($.inArray(e.keyCode, [27, 37, 39, 38, 40, 32, 13, 9]) === -1)
+            this.update();
+        }, this),
+        keydown: $.proxy(this.keydown, this),
+        paste: $.proxy(this.paste, this)
+      };
+
+      if (this.o.showOnFocus === true) {
+        events.focus = $.proxy(this.show, this);
+      }
+
+      if (this.isInput) { // single input
+        this._events = [
+          [this.element, events]
+        ];
+      }
+      // component: input + button
+      else if (this.component && this.inputField.length) {
+        this._events = [
+          // For components that are not readonly, allow keyboard nav
+          [this.inputField, events],
+          [this.component, {
+            click: $.proxy(this.show, this)
+          }]
+        ];
+      }
+      else {
+        this._events = [
+          [this.element, {
+            click: $.proxy(this.show, this),
+            keydown: $.proxy(this.keydown, this)
+          }]
+        ];
+      }
+      this._events.push(
+        // Component: listen for blur on element descendants
+        [this.element, '*', {
+          blur: $.proxy(function(e){
+            this._focused_from = e.target;
+          }, this)
+        }],
+        // Input: listen for blur on element
+        [this.element, {
+          blur: $.proxy(function(e){
+            this._focused_from = e.target;
+          }, this)
+        }]
+      );
+
+      if (this.o.immediateUpdates) {
+        // Trigger input updates immediately on changed year/month
+        this._events.push([this.element, {
+          'changeYear changeMonth': $.proxy(function(e){
+            this.update(e.date);
+          }, this)
+        }]);
+      }
+
+      this._secondaryEvents = [
+        [this.picker, {
+          click: $.proxy(this.click, this)
+        }],
+        [this.picker, '.prev, .next', {
+          click: $.proxy(this.navArrowsClick, this)
+        }],
+        [this.picker, '.day:not(.disabled)', {
+          click: $.proxy(this.dayCellClick, this)
+        }],
+        [$(window), {
+          resize: $.proxy(this.place, this)
+        }],
+        [$(document), {
+          'mousedown touchstart': $.proxy(function(e){
+            // Clicked outside the datepicker, hide it
+            if (!(
+              this.element.is(e.target) ||
+              this.element.find(e.target).length ||
+              this.picker.is(e.target) ||
+              this.picker.find(e.target).length ||
+              this.isInline
+            )){
+              this.hide();
+            }
+          }, this)
+        }]
+      ];
+    },
+    _attachEvents: function(){
+      this._detachEvents();
+      this._applyEvents(this._events);
+    },
+    _detachEvents: function(){
+      this._unapplyEvents(this._events);
+    },
+    _attachSecondaryEvents: function(){
+      this._detachSecondaryEvents();
+      this._applyEvents(this._secondaryEvents);
+    },
+    _detachSecondaryEvents: function(){
+      this._unapplyEvents(this._secondaryEvents);
+    },
+    _trigger: function(event, altdate){
+      var date = altdate || this.dates.get(-1),
+        local_date = this._utc_to_local(date);
+
+      this.element.trigger({
+        type: event,
+        date: local_date,
+        viewMode: this.viewMode,
+        dates: $.map(this.dates, this._utc_to_local),
+        format: $.proxy(function(ix, format){
+          if (arguments.length === 0){
+            ix = this.dates.length - 1;
+            format = this.o.format;
+          } else if (typeof ix === 'string'){
+            format = ix;
+            ix = this.dates.length - 1;
+          }
+          format = format || this.o.format;
+          var date = this.dates.get(ix);
+          return DPGlobal.formatDate(date, format, this.o.language);
+        }, this)
+      });
+    },
+
+    show: function(){
+      if (this.inputField.is(':disabled') || (this.inputField.prop('readonly') && this.o.enableOnReadonly === false))
+        return;
+      if (!this.isInline)
+        this.picker.appendTo(this.o.container);
+      this.place();
+      this.picker.show();
+      this._attachSecondaryEvents();
+      this._trigger('show');
+      if ((window.navigator.msMaxTouchPoints || 'ontouchstart' in document) && this.o.disableTouchKeyboard) {
+        $(this.element).blur();
+      }
+      return this;
+    },
+
+    hide: function(){
+      if (this.isInline || !this.picker.is(':visible'))
+        return this;
+      this.focusDate = null;
+      this.picker.hide().detach();
+      this._detachSecondaryEvents();
+      this.setViewMode(this.o.startView);
+
+      if (this.o.forceParse && this.inputField.val())
+        this.setValue();
+      this._trigger('hide');
+      return this;
+    },
+
+    destroy: function(){
+      this.hide();
+      this._detachEvents();
+      this._detachSecondaryEvents();
+      this.picker.remove();
+      delete this.element.data().datepicker;
+      if (!this.isInput){
+        delete this.element.data().date;
+      }
+      return this;
+    },
+
+    paste: function(e){
+      var dateString;
+      if (e.originalEvent.clipboardData && e.originalEvent.clipboardData.types
+        && $.inArray('text/plain', e.originalEvent.clipboardData.types) !== -1) {
+        dateString = e.originalEvent.clipboardData.getData('text/plain');
+      } else if (window.clipboardData) {
+        dateString = window.clipboardData.getData('Text');
+      } else {
+        return;
+      }
+      this.setDate(dateString);
+      this.update();
+      e.preventDefault();
+    },
+
+    _utc_to_local: function(utc){
+      if (!utc) {
+        return utc;
+      }
+
+      var local = new Date(utc.getTime() + (utc.getTimezoneOffset() * 60000));
+
+      if (local.getTimezoneOffset() !== utc.getTimezoneOffset()) {
+        local = new Date(utc.getTime() + (local.getTimezoneOffset() * 60000));
+      }
+
+      return local;
+    },
+    _local_to_utc: function(local){
+      return local && new Date(local.getTime() - (local.getTimezoneOffset()*60000));
+    },
+    _zero_time: function(local){
+      return local && new Date(local.getFullYear(), local.getMonth(), local.getDate());
+    },
+    _zero_utc_time: function(utc){
+      return utc && UTCDate(utc.getUTCFullYear(), utc.getUTCMonth(), utc.getUTCDate());
+    },
+
+    getDates: function(){
+      return $.map(this.dates, this._utc_to_local);
+    },
+
+    getUTCDates: function(){
+      return $.map(this.dates, function(d){
+        return new Date(d);
+      });
+    },
+
+    getDate: function(){
+      return this._utc_to_local(this.getUTCDate());
+    },
+
+    getUTCDate: function(){
+      var selected_date = this.dates.get(-1);
+      if (selected_date !== undefined) {
+        return new Date(selected_date);
+      } else {
+        return null;
+      }
+    },
+
+    clearDates: function(){
+      this.inputField.val('');
+      this.update();
+      this._trigger('changeDate');
+
+      if (this.o.autoclose) {
+        this.hide();
+      }
+    },
+
+    setDates: function(){
+      var args = $.isArray(arguments[0]) ? arguments[0] : arguments;
+      this.update.apply(this, args);
+      this._trigger('changeDate');
+      this.setValue();
+      return this;
+    },
+
+    setUTCDates: function(){
+      var args = $.isArray(arguments[0]) ? arguments[0] : arguments;
+      this.setDates.apply(this, $.map(args, this._utc_to_local));
+      return this;
+    },
+
+    setDate: alias('setDates'),
+    setUTCDate: alias('setUTCDates'),
+    remove: alias('destroy', 'Method `remove` is deprecated and will be removed in version 2.0. Use `destroy` instead'),
+
+    setValue: function(){
+      var formatted = this.getFormattedDate();
+      this.inputField.val(formatted);
+      return this;
+    },
+
+    getFormattedDate: function(format){
+      if (format === undefined)
+        format = this.o.format;
+
+      var lang = this.o.language;
+      return $.map(this.dates, function(d){
+        return DPGlobal.formatDate(d, format, lang);
+      }).join(this.o.multidateSeparator);
+    },
+
+    getStartDate: function(){
+      return this.o.startDate;
+    },
+
+    setStartDate: function(startDate){
+      this._process_options({startDate: startDate});
+      this.update();
+      this.updateNavArrows();
+      return this;
+    },
+
+    getEndDate: function(){
+      return this.o.endDate;
+    },
+
+    setEndDate: function(endDate){
+      this._process_options({endDate: endDate});
+      this.update();
+      this.updateNavArrows();
+      return this;
+    },
+
+    setDaysOfWeekDisabled: function(daysOfWeekDisabled){
+      this._process_options({daysOfWeekDisabled: daysOfWeekDisabled});
+      this.update();
+      return this;
+    },
+
+    setDaysOfWeekHighlighted: function(daysOfWeekHighlighted){
+      this._process_options({daysOfWeekHighlighted: daysOfWeekHighlighted});
+      this.update();
+      return this;
+    },
+
+    setDatesDisabled: function(datesDisabled){
+      this._process_options({datesDisabled: datesDisabled});
+      this.update();
+      return this;
+    },
+
+    place: function(){
+      if (this.isInline)
+        return this;
+      var calendarWidth = this.picker.outerWidth(),
+        calendarHeight = this.picker.outerHeight(),
+        visualPadding = 10,
+        container = $(this.o.container),
+        windowWidth = container.width(),
+        scrollTop = this.o.container === 'body' ? $(document).scrollTop() : container.scrollTop(),
+        appendOffset = container.offset();
+
+      var parentsZindex = [0];
+      this.element.parents().each(function(){
+        var itemZIndex = $(this).css('z-index');
+        if (itemZIndex !== 'auto' && Number(itemZIndex) !== 0) parentsZindex.push(Number(itemZIndex));
+      });
+      var zIndex = Math.max.apply(Math, parentsZindex) + this.o.zIndexOffset;
+      var offset = this.component ? this.component.parent().offset() : this.element.offset();
+      var height = this.component ? this.component.outerHeight(true) : this.element.outerHeight(false);
+      var width = this.component ? this.component.outerWidth(true) : this.element.outerWidth(false);
+      var left = offset.left - appendOffset.left;
+      var top = offset.top - appendOffset.top;
+
+      if (this.o.container !== 'body') {
+        top += scrollTop;
+      }
+
+      this.picker.removeClass(
+        'datepicker-orient-top datepicker-orient-bottom '+
+        'datepicker-orient-right datepicker-orient-left'
+      );
+
+      if (this.o.orientation.x !== 'auto'){
+        this.picker.addClass('datepicker-orient-' + this.o.orientation.x);
+        if (this.o.orientation.x === 'right')
+          left -= calendarWidth - width;
+      }
+      // auto x orientation is best-placement: if it crosses a window
+      // edge, fudge it sideways
+      else {
+        if (offset.left < 0) {
+          // component is outside the window on the left side. Move it into visible range
+          this.picker.addClass('datepicker-orient-left');
+          left -= offset.left - visualPadding;
+        } else if (left + calendarWidth > windowWidth) {
+          // the calendar passes the widow right edge. Align it to component right side
+          this.picker.addClass('datepicker-orient-right');
+          left += width - calendarWidth;
+        } else {
+          if (this.o.rtl) {
+            // Default to right
+            this.picker.addClass('datepicker-orient-right');
+          } else {
+            // Default to left
+            this.picker.addClass('datepicker-orient-left');
+          }
+        }
+      }
+
+      // auto y orientation is best-situation: top or bottom, no fudging,
+      // decision based on which shows more of the calendar
+      var yorient = this.o.orientation.y,
+        top_overflow;
+      if (yorient === 'auto'){
+        top_overflow = -scrollTop + top - calendarHeight;
+        yorient = top_overflow < 0 ? 'bottom' : 'top';
+      }
+
+      this.picker.addClass('datepicker-orient-' + yorient);
+      if (yorient === 'top')
+        top -= calendarHeight + parseInt(this.picker.css('padding-top'));
+      else
+        top += height;
+
+      if (this.o.rtl) {
+        var right = windowWidth - (left + width);
+        this.picker.css({
+          top: top,
+          right: right,
+          zIndex: zIndex
+        });
+      } else {
+        this.picker.css({
+          top: top,
+          left: left,
+          zIndex: zIndex
+        });
+      }
+      return this;
+    },
+
+    _allow_update: true,
+    update: function(){
+      if (!this._allow_update)
+        return this;
+
+      var oldDates = this.dates.copy(),
+        dates = [],
+        fromArgs = false;
+      if (arguments.length){
+        $.each(arguments, $.proxy(function(i, date){
+          if (date instanceof Date)
+            date = this._local_to_utc(date);
+          dates.push(date);
+        }, this));
+        fromArgs = true;
+      } else {
+        dates = this.isInput
+          ? this.element.val()
+          : this.element.data('date') || this.inputField.val();
+        if (dates && this.o.multidate)
+          dates = dates.split(this.o.multidateSeparator);
+        else
+          dates = [dates];
+        delete this.element.data().date;
+      }
+
+      dates = $.map(dates, $.proxy(function(date){
+        return DPGlobal.parseDate(date, this.o.format, this.o.language, this.o.assumeNearbyYear);
+      }, this));
+      dates = $.grep(dates, $.proxy(function(date){
+        return (
+          !this.dateWithinRange(date) ||
+          !date
+        );
+      }, this), true);
+      this.dates.replace(dates);
+
+      if (this.o.updateViewDate) {
+        if (this.dates.length)
+          this.viewDate = new Date(this.dates.get(-1));
+        else if (this.viewDate < this.o.startDate)
+          this.viewDate = new Date(this.o.startDate);
+        else if (this.viewDate > this.o.endDate)
+          this.viewDate = new Date(this.o.endDate);
+        else
+          this.viewDate = this.o.defaultViewDate;
+      }
+
+      if (fromArgs){
+        // setting date by clicking
+        this.setValue();
+        this.element.change();
+      }
+      else if (this.dates.length){
+        // setting date by typing
+        if (String(oldDates) !== String(this.dates) && fromArgs) {
+          this._trigger('changeDate');
+          this.element.change();
+        }
+      }
+      if (!this.dates.length && oldDates.length) {
+        this._trigger('clearDate');
+        this.element.change();
+      }
+
+      this.fill();
+      return this;
+    },
+
+    fillDow: function(){
+      if (this.o.showWeekDays) {
+        var dowCnt = this.o.weekStart,
+          html = '<tr>';
+        if (this.o.calendarWeeks){
+          html += '<th class="cw">&#160;</th>';
+        }
+        while (dowCnt < this.o.weekStart + 7){
+          html += '<th class="dow';
+          if ($.inArray(dowCnt, this.o.daysOfWeekDisabled) !== -1)
+            html += ' disabled';
+          html += '">'+dates[this.o.language].daysMin[(dowCnt++)%7]+'</th>';
+        }
+        html += '</tr>';
+        this.picker.find('.datepicker-days thead').append(html);
+      }
+    },
+
+    fillMonths: function(){
+      var localDate = this._utc_to_local(this.viewDate);
+      var html = '';
+      var focused;
+      for (var i = 0; i < 12; i++){
+        focused = localDate && localDate.getMonth() === i ? ' focused' : '';
+        html += '<span class="month' + focused + '">' + dates[this.o.language].monthsShort[i] + '</span>';
+      }
+      this.picker.find('.datepicker-months td').html(html);
+    },
+
+    setRange: function(range){
+      if (!range || !range.length)
+        delete this.range;
+      else
+        this.range = $.map(range, function(d){
+          return d.valueOf();
+        });
+      this.fill();
+    },
+
+    getClassNames: function(date){
+      var cls = [],
+        year = this.viewDate.getUTCFullYear(),
+        month = this.viewDate.getUTCMonth(),
+        today = UTCToday();
+      if (date.getUTCFullYear() < year || (date.getUTCFullYear() === year && date.getUTCMonth() < month)){
+        cls.push('old');
+      } else if (date.getUTCFullYear() > year || (date.getUTCFullYear() === year && date.getUTCMonth() > month)){
+        cls.push('new');
+      }
+      if (this.focusDate && date.valueOf() === this.focusDate.valueOf())
+        cls.push('focused');
+      // Compare internal UTC date with UTC today, not local today
+      if (this.o.todayHighlight && isUTCEquals(date, today)) {
+        cls.push('today');
+      }
+      if (this.dates.contains(date) !== -1)
+        cls.push('active');
+      if (!this.dateWithinRange(date)){
+        cls.push('disabled');
+      }
+      if (this.dateIsDisabled(date)){
+        cls.push('disabled', 'disabled-date');
+      }
+      if ($.inArray(date.getUTCDay(), this.o.daysOfWeekHighlighted) !== -1){
+        cls.push('highlighted');
+      }
+
+      if (this.range){
+        if (date > this.range[0] && date < this.range[this.range.length-1]){
+          cls.push('range');
+        }
+        if ($.inArray(date.valueOf(), this.range) !== -1){
+          cls.push('selected');
+        }
+        if (date.valueOf() === this.range[0]){
+          cls.push('range-start');
+        }
+        if (date.valueOf() === this.range[this.range.length-1]){
+          cls.push('range-end');
+        }
+      }
+      return cls;
+    },
+
+    _fill_yearsView: function(selector, cssClass, factor, year, startYear, endYear, beforeFn){
+      var html = '';
+      var step = factor / 10;
+      var view = this.picker.find(selector);
+      var startVal = Math.floor(year / factor) * factor;
+      var endVal = startVal + step * 9;
+      var focusedVal = Math.floor(this.viewDate.getFullYear() / step) * step;
+      var selected = $.map(this.dates, function(d){
+        return Math.floor(d.getUTCFullYear() / step) * step;
+      });
+
+      var classes, tooltip, before;
+      for (var currVal = startVal - step; currVal <= endVal + step; currVal += step) {
+        classes = [cssClass];
+        tooltip = null;
+
+        if (currVal === startVal - step) {
+          classes.push('old');
+        } else if (currVal === endVal + step) {
+          classes.push('new');
+        }
+        if ($.inArray(currVal, selected) !== -1) {
+          classes.push('active');
+        }
+        if (currVal < startYear || currVal > endYear) {
+          classes.push('disabled');
+        }
+        if (currVal === focusedVal) {
+          classes.push('focused');
+        }
+
+        if (beforeFn !== $.noop) {
+          before = beforeFn(new Date(currVal, 0, 1));
+          if (before === undefined) {
+            before = {};
+          } else if (typeof before === 'boolean') {
+            before = {enabled: before};
+          } else if (typeof before === 'string') {
+            before = {classes: before};
+          }
+          if (before.enabled === false) {
+            classes.push('disabled');
+          }
+          if (before.classes) {
+            classes = classes.concat(before.classes.split(/\s+/));
+          }
+          if (before.tooltip) {
+            tooltip = before.tooltip;
+          }
+        }
+
+        html += '<span class="' + classes.join(' ') + '"' + (tooltip ? ' title="' + tooltip + '"' : '') + '>' + currVal + '</span>';
+      }
+
+      view.find('.datepicker-switch').text(startVal + '-' + endVal);
+      view.find('td').html(html);
+    },
+
+    fill: function(){
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        startYear = this.o.startDate !== -Infinity ? this.o.startDate.getUTCFullYear() : -Infinity,
+        startMonth = this.o.startDate !== -Infinity ? this.o.startDate.getUTCMonth() : -Infinity,
+        endYear = this.o.endDate !== Infinity ? this.o.endDate.getUTCFullYear() : Infinity,
+        endMonth = this.o.endDate !== Infinity ? this.o.endDate.getUTCMonth() : Infinity,
+        todaytxt = dates[this.o.language].today || dates['en'].today || '',
+        cleartxt = dates[this.o.language].clear || dates['en'].clear || '',
+        titleFormat = dates[this.o.language].titleFormat || dates['en'].titleFormat,
+        todayDate = UTCToday(),
+        titleBtnVisible = (this.o.todayBtn === true || this.o.todayBtn === 'linked') && todayDate >= this.o.startDate && todayDate <= this.o.endDate && !this.weekOfDateIsDisabled(todayDate),
+        tooltip,
+        before;
+      if (isNaN(year) || isNaN(month))
+        return;
+      this.picker.find('.datepicker-days .datepicker-switch')
+        .text(DPGlobal.formatDate(d, titleFormat, this.o.language));
+      this.picker.find('tfoot .today')
+        .text(todaytxt)
+        .css('display', titleBtnVisible ? 'table-cell' : 'none');
+      this.picker.find('tfoot .clear')
+        .text(cleartxt)
+        .css('display', this.o.clearBtn === true ? 'table-cell' : 'none');
+      this.picker.find('thead .datepicker-title')
+        .text(this.o.title)
+        .css('display', typeof this.o.title === 'string' && this.o.title !== '' ? 'table-cell' : 'none');
+      this.updateNavArrows();
+      this.fillMonths();
+      var prevMonth = UTCDate(year, month, 0),
+        day = prevMonth.getUTCDate();
+      prevMonth.setUTCDate(day - (prevMonth.getUTCDay() - this.o.weekStart + 7)%7);
+      var nextMonth = new Date(prevMonth);
+      if (prevMonth.getUTCFullYear() < 100){
+        nextMonth.setUTCFullYear(prevMonth.getUTCFullYear());
+      }
+      nextMonth.setUTCDate(nextMonth.getUTCDate() + 42);
+      nextMonth = nextMonth.valueOf();
+      var html = [];
+      var weekDay, clsName;
+      while (prevMonth.valueOf() < nextMonth){
+        weekDay = prevMonth.getUTCDay();
+        if (weekDay === this.o.weekStart){
+          html.push('<tr>');
+          if (this.o.calendarWeeks){
+            // ISO 8601: First week contains first thursday.
+            // ISO also states week starts on Monday, but we can be more abstract here.
+            var
+              // Start of current week: based on weekstart/current date
+              ws = new Date(+prevMonth + (this.o.weekStart - weekDay - 7) % 7 * 864e5),
+              // Thursday of this week
+              th = new Date(Number(ws) + (7 + 4 - ws.getUTCDay()) % 7 * 864e5),
+              // First Thursday of year, year from thursday
+              yth = new Date(Number(yth = UTCDate(th.getUTCFullYear(), 0, 1)) + (7 + 4 - yth.getUTCDay()) % 7 * 864e5),
+              // Calendar week: ms between thursdays, div ms per day, div 7 days
+              calWeek = (th - yth) / 864e5 / 7 + 1;
+            html.push('<td class="cw">'+ calWeek +'</td>');
+          }
+        }
+        clsName = this.getClassNames(prevMonth);
+        clsName.push('day');
+
+        var content = prevMonth.getUTCDate();
+
+        if (this.o.beforeShowDay !== $.noop){
+          before = this.o.beforeShowDay(this._utc_to_local(prevMonth));
+          if (before === undefined)
+            before = {};
+          else if (typeof before === 'boolean')
+            before = {enabled: before};
+          else if (typeof before === 'string')
+            before = {classes: before};
+          if (before.enabled === false)
+            clsName.push('disabled');
+          if (before.classes)
+            clsName = clsName.concat(before.classes.split(/\s+/));
+          if (before.tooltip)
+            tooltip = before.tooltip;
+          if (before.content)
+            content = before.content;
+        }
+
+        //Check if uniqueSort exists (supported by jquery >=1.12 and >=2.2)
+        //Fallback to unique function for older jquery versions
+        if ($.isFunction($.uniqueSort)) {
+          clsName = $.uniqueSort(clsName);
+        } else {
+          clsName = $.unique(clsName);
+        }
+
+        html.push('<td class="'+clsName.join(' ')+'"' + (tooltip ? ' title="'+tooltip+'"' : '') + ' data-date="' + prevMonth.getTime().toString() + '">' + content + '</td>');
+        tooltip = null;
+        if (weekDay === this.o.weekEnd){
+          html.push('</tr>');
+        }
+        prevMonth.setUTCDate(prevMonth.getUTCDate() + 1);
+      }
+      this.picker.find('.datepicker-days tbody').html(html.join(''));
+
+      var monthsTitle = dates[this.o.language].monthsTitle || dates['en'].monthsTitle || 'Months';
+      var months = this.picker.find('.datepicker-months')
+        .find('.datepicker-switch')
+        .text(this.o.maxViewMode < 2 ? monthsTitle : year)
+        .end()
+        .find('tbody span').removeClass('active');
+
+      $.each(this.dates, function(i, d){
+        if (d.getUTCFullYear() === year)
+          months.eq(d.getUTCMonth()).addClass('active');
+      });
+
+      if (year < startYear || year > endYear){
+        months.addClass('disabled');
+      }
+      if (year === startYear){
+        months.slice(0, startMonth).addClass('disabled');
+      }
+      if (year === endYear){
+        months.slice(endMonth+1).addClass('disabled');
+      }
+
+      if (this.o.beforeShowMonth !== $.noop){
+        var that = this;
+        $.each(months, function(i, month){
+          var moDate = new Date(year, i, 1);
+          var before = that.o.beforeShowMonth(moDate);
+          if (before === undefined)
+            before = {};
+          else if (typeof before === 'boolean')
+            before = {enabled: before};
+          else if (typeof before === 'string')
+            before = {classes: before};
+          if (before.enabled === false && !$(month).hasClass('disabled'))
+            $(month).addClass('disabled');
+          if (before.classes)
+            $(month).addClass(before.classes);
+          if (before.tooltip)
+            $(month).prop('title', before.tooltip);
+        });
+      }
+
+      // Generating decade/years picker
+      this._fill_yearsView(
+        '.datepicker-years',
+        'year',
+        10,
+        year,
+        startYear,
+        endYear,
+        this.o.beforeShowYear
+      );
+
+      // Generating century/decades picker
+      this._fill_yearsView(
+        '.datepicker-decades',
+        'decade',
+        100,
+        year,
+        startYear,
+        endYear,
+        this.o.beforeShowDecade
+      );
+
+      // Generating millennium/centuries picker
+      this._fill_yearsView(
+        '.datepicker-centuries',
+        'century',
+        1000,
+        year,
+        startYear,
+        endYear,
+        this.o.beforeShowCentury
+      );
+    },
+
+    updateNavArrows: function(){
+      if (!this._allow_update)
+        return;
+
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        startYear = this.o.startDate !== -Infinity ? this.o.startDate.getUTCFullYear() : -Infinity,
+        startMonth = this.o.startDate !== -Infinity ? this.o.startDate.getUTCMonth() : -Infinity,
+        endYear = this.o.endDate !== Infinity ? this.o.endDate.getUTCFullYear() : Infinity,
+        endMonth = this.o.endDate !== Infinity ? this.o.endDate.getUTCMonth() : Infinity,
+        prevIsDisabled,
+        nextIsDisabled,
+        factor = 1;
+      switch (this.viewMode){
+        case 4:
+          factor *= 10;
+        /* falls through */
+        case 3:
+          factor *= 10;
+        /* falls through */
+        case 2:
+          factor *= 10;
+        /* falls through */
+        case 1:
+          prevIsDisabled = Math.floor(year / factor) * factor <= startYear;
+          nextIsDisabled = Math.floor(year / factor) * factor + factor > endYear;
+          break;
+        case 0:
+          prevIsDisabled = year <= startYear && month <= startMonth;
+          nextIsDisabled = year >= endYear && month >= endMonth;
+          break;
+      }
+
+      this.picker.find('.prev').toggleClass('disabled', prevIsDisabled);
+      this.picker.find('.next').toggleClass('disabled', nextIsDisabled);
+    },
+
+    click: function(e){
+      e.preventDefault();
+      e.stopPropagation();
+
+      var target, dir, day, year, month;
+      target = $(e.target);
+
+      // Clicked on the switch
+      if (target.hasClass('datepicker-switch') && this.viewMode !== this.o.maxViewMode){
+        this.setViewMode(this.viewMode + 1);
+      }
+
+      // Clicked on today button
+      if (target.hasClass('today') && !target.hasClass('day')){
+        this.setViewMode(0);
+        this._setDate(UTCToday(), this.o.todayBtn === 'linked' ? null : 'view');
+      }
+
+      // Clicked on clear button
+      if (target.hasClass('clear')){
+        this.clearDates();
+      }
+
+      if (!target.hasClass('disabled')){
+        // Clicked on a month, year, decade, century
+        if (target.hasClass('month')
+          || target.hasClass('year')
+          || target.hasClass('decade')
+          || target.hasClass('century')) {
+          this.viewDate.setUTCDate(1);
+
+          day = 1;
+          if (this.viewMode === 1){
+            month = target.parent().find('span').index(target);
+            year = this.viewDate.getUTCFullYear();
+            this.viewDate.setUTCMonth(month);
+          } else {
+            month = 0;
+            year = Number(target.text());
+            this.viewDate.setUTCFullYear(year);
+          }
+
+          this._trigger(DPGlobal.viewModes[this.viewMode - 1].e, this.viewDate);
+
+          if (this.viewMode === this.o.minViewMode){
+            this._setDate(UTCDate(year, month, day));
+          } else {
+            this.setViewMode(this.viewMode - 1);
+            this.fill();
+          }
+        }
+      }
+
+      if (this.picker.is(':visible') && this._focused_from){
+        this._focused_from.focus();
+      }
+      delete this._focused_from;
+    },
+
+    dayCellClick: function(e){
+      var $target = $(e.currentTarget);
+      var timestamp = $target.data('date');
+      var date = new Date(timestamp);
+
+      if (this.o.updateViewDate) {
+        if (date.getUTCFullYear() !== this.viewDate.getUTCFullYear()) {
+          this._trigger('changeYear', this.viewDate);
+        }
+
+        if (date.getUTCMonth() !== this.viewDate.getUTCMonth()) {
+          this._trigger('changeMonth', this.viewDate);
+        }
+      }
+      this._setDate(date);
+    },
+
+    // Clicked on prev or next
+    navArrowsClick: function(e){
+      var $target = $(e.currentTarget);
+      var dir = $target.hasClass('prev') ? -1 : 1;
+      if (this.viewMode !== 0){
+        dir *= DPGlobal.viewModes[this.viewMode].navStep * 12;
+      }
+      this.viewDate = this.moveMonth(this.viewDate, dir);
+      this._trigger(DPGlobal.viewModes[this.viewMode].e, this.viewDate);
+      this.fill();
+    },
+
+    _toggle_multidate: function(date){
+      var ix = this.dates.contains(date);
+      if (!date){
+        this.dates.clear();
+      }
+
+      if (ix !== -1){
+        if (this.o.multidate === true || this.o.multidate > 1 || this.o.toggleActive){
+          this.dates.remove(ix);
+        }
+      } else if (this.o.multidate === false) {
+        this.dates.clear();
+        this.dates.push(date);
+      }
+      else {
+        this.dates.push(date);
+      }
+
+      if (typeof this.o.multidate === 'number')
+        while (this.dates.length > this.o.multidate)
+          this.dates.remove(0);
+    },
+
+    _setDate: function(date, which){
+      if (!which || which === 'date')
+        this._toggle_multidate(date && new Date(date));
+      if ((!which && this.o.updateViewDate) || which === 'view')
+        this.viewDate = date && new Date(date);
+
+      this.fill();
+      this.setValue();
+      if (!which || which !== 'view') {
+        this._trigger('changeDate');
+      }
+      this.inputField.trigger('change');
+      if (this.o.autoclose && (!which || which === 'date')){
+        this.hide();
+      }
+    },
+
+    moveDay: function(date, dir){
+      var newDate = new Date(date);
+      newDate.setUTCDate(date.getUTCDate() + dir);
+
+      return newDate;
+    },
+
+    moveWeek: function(date, dir){
+      return this.moveDay(date, dir * 7);
+    },
+
+    moveMonth: function(date, dir){
+      if (!isValidDate(date))
+        return this.o.defaultViewDate;
+      if (!dir)
+        return date;
+      var new_date = new Date(date.valueOf()),
+        day = new_date.getUTCDate(),
+        month = new_date.getUTCMonth(),
+        mag = Math.abs(dir),
+        new_month, test;
+      dir = dir > 0 ? 1 : -1;
+      if (mag === 1){
+        test = dir === -1
+          // If going back one month, make sure month is not current month
+          // (eg, Mar 31 -> Feb 31 == Feb 28, not Mar 02)
+          ? function(){
+            return new_date.getUTCMonth() === month;
+          }
+          // If going forward one month, make sure month is as expected
+          // (eg, Jan 31 -> Feb 31 == Feb 28, not Mar 02)
+          : function(){
+            return new_date.getUTCMonth() !== new_month;
+          };
+        new_month = month + dir;
+        new_date.setUTCMonth(new_month);
+        // Dec -> Jan (12) or Jan -> Dec (-1) -- limit expected date to 0-11
+        new_month = (new_month + 12) % 12;
+      }
+      else {
+        // For magnitudes >1, move one month at a time...
+        for (var i=0; i < mag; i++)
+          // ...which might decrease the day (eg, Jan 31 to Feb 28, etc)...
+          new_date = this.moveMonth(new_date, dir);
+        // ...then reset the day, keeping it in the new month
+        new_month = new_date.getUTCMonth();
+        new_date.setUTCDate(day);
+        test = function(){
+          return new_month !== new_date.getUTCMonth();
+        };
+      }
+      // Common date-resetting loop -- if date is beyond end of month, make it
+      // end of month
+      while (test()){
+        new_date.setUTCDate(--day);
+        new_date.setUTCMonth(new_month);
+      }
+      return new_date;
+    },
+
+    moveYear: function(date, dir){
+      return this.moveMonth(date, dir*12);
+    },
+
+    moveAvailableDate: function(date, dir, fn){
+      do {
+        date = this[fn](date, dir);
+
+        if (!this.dateWithinRange(date))
+          return false;
+
+        fn = 'moveDay';
+      }
+      while (this.dateIsDisabled(date));
+
+      return date;
+    },
+
+    weekOfDateIsDisabled: function(date){
+      return $.inArray(date.getUTCDay(), this.o.daysOfWeekDisabled) !== -1;
+    },
+
+    dateIsDisabled: function(date){
+      return (
+        this.weekOfDateIsDisabled(date) ||
+        $.grep(this.o.datesDisabled, function(d){
+          return isUTCEquals(date, d);
+        }).length > 0
+      );
+    },
+
+    dateWithinRange: function(date){
+      return date >= this.o.startDate && date <= this.o.endDate;
+    },
+
+    keydown: function(e){
+      if (!this.picker.is(':visible')){
+        if (e.keyCode === 40 || e.keyCode === 27) { // allow down to re-show picker
+          this.show();
+          e.stopPropagation();
+        }
+        return;
+      }
+      var dateChanged = false,
+        dir, newViewDate,
+        focusDate = this.focusDate || this.viewDate;
+      switch (e.keyCode){
+        case 27: // escape
+          if (this.focusDate){
+            this.focusDate = null;
+            this.viewDate = this.dates.get(-1) || this.viewDate;
+            this.fill();
+          }
+          else
+            this.hide();
+          e.preventDefault();
+          e.stopPropagation();
+          break;
+        case 37: // left
+        case 38: // up
+        case 39: // right
+        case 40: // down
+          if (!this.o.keyboardNavigation || this.o.daysOfWeekDisabled.length === 7)
+            break;
+          dir = e.keyCode === 37 || e.keyCode === 38 ? -1 : 1;
+          if (this.viewMode === 0) {
+            if (e.ctrlKey){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveYear');
+
+              if (newViewDate)
+                this._trigger('changeYear', this.viewDate);
+            } else if (e.shiftKey){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveMonth');
+
+              if (newViewDate)
+                this._trigger('changeMonth', this.viewDate);
+            } else if (e.keyCode === 37 || e.keyCode === 39){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveDay');
+            } else if (!this.weekOfDateIsDisabled(focusDate)){
+              newViewDate = this.moveAvailableDate(focusDate, dir, 'moveWeek');
+            }
+          } else if (this.viewMode === 1) {
+            if (e.keyCode === 38 || e.keyCode === 40) {
+              dir = dir * 4;
+            }
+            newViewDate = this.moveAvailableDate(focusDate, dir, 'moveMonth');
+          } else if (this.viewMode === 2) {
+            if (e.keyCode === 38 || e.keyCode === 40) {
+              dir = dir * 4;
+            }
+            newViewDate = this.moveAvailableDate(focusDate, dir, 'moveYear');
+          }
+          if (newViewDate){
+            this.focusDate = this.viewDate = newViewDate;
+            this.setValue();
+            this.fill();
+            e.preventDefault();
+          }
+          break;
+        case 13: // enter
+          if (!this.o.forceParse)
+            break;
+          focusDate = this.focusDate || this.dates.get(-1) || this.viewDate;
+          if (this.o.keyboardNavigation) {
+            this._toggle_multidate(focusDate);
+            dateChanged = true;
+          }
+          this.focusDate = null;
+          this.viewDate = this.dates.get(-1) || this.viewDate;
+          this.setValue();
+          this.fill();
+          if (this.picker.is(':visible')){
+            e.preventDefault();
+            e.stopPropagation();
+            if (this.o.autoclose)
+              this.hide();
+          }
+          break;
+        case 9: // tab
+          this.focusDate = null;
+          this.viewDate = this.dates.get(-1) || this.viewDate;
+          this.fill();
+          this.hide();
+          break;
+      }
+      if (dateChanged){
+        if (this.dates.length)
+          this._trigger('changeDate');
+        else
+          this._trigger('clearDate');
+        this.inputField.trigger('change');
+      }
+    },
+
+    setViewMode: function(viewMode){
+      this.viewMode = viewMode;
+      this.picker
+        .children('div')
+        .hide()
+        .filter('.datepicker-' + DPGlobal.viewModes[this.viewMode].clsName)
+        .show();
+      this.updateNavArrows();
+      this._trigger('changeViewMode', new Date(this.viewDate));
+    }
+  };
+
+  var DateRangePicker = function(element, options){
+    $.data(element, 'datepicker', this);
+    this.element = $(element);
+    this.inputs = $.map(options.inputs, function(i){
+      return i.jquery ? i[0] : i;
+    });
+    delete options.inputs;
+
+    this.keepEmptyValues = options.keepEmptyValues;
+    delete options.keepEmptyValues;
+
+    datepickerPlugin.call($(this.inputs), options)
+      .on('changeDate', $.proxy(this.dateUpdated, this));
+
+    this.pickers = $.map(this.inputs, function(i){
+      return $.data(i, 'datepicker');
+    });
+    this.updateDates();
+  };
+  DateRangePicker.prototype = {
+    updateDates: function(){
+      this.dates = $.map(this.pickers, function(i){
+        return i.getUTCDate();
+      });
+      this.updateRanges();
+    },
+    updateRanges: function(){
+      var range = $.map(this.dates, function(d){
+        return d.valueOf();
+      });
+      $.each(this.pickers, function(i, p){
+        p.setRange(range);
+      });
+    },
+    clearDates: function(){
+      $.each(this.pickers, function(i, p){
+        p.clearDates();
+      });
+    },
+    dateUpdated: function(e){
+      // `this.updating` is a workaround for preventing infinite recursion
+      // between `changeDate` triggering and `setUTCDate` calling.  Until
+      // there is a better mechanism.
+      if (this.updating)
+        return;
+      this.updating = true;
+
+      var dp = $.data(e.target, 'datepicker');
+
+      if (dp === undefined) {
+        return;
+      }
+
+      var new_date = dp.getUTCDate(),
+        keep_empty_values = this.keepEmptyValues,
+        i = $.inArray(e.target, this.inputs),
+        j = i - 1,
+        k = i + 1,
+        l = this.inputs.length;
+      if (i === -1)
+        return;
+
+      $.each(this.pickers, function(i, p){
+        if (!p.getUTCDate() && (p === dp || !keep_empty_values))
+          p.setUTCDate(new_date);
+      });
+
+      if (new_date < this.dates[j]){
+        // Date being moved earlier/left
+        while (j >= 0 && new_date < this.dates[j]){
+          this.pickers[j--].setUTCDate(new_date);
+        }
+      } else if (new_date > this.dates[k]){
+        // Date being moved later/right
+        while (k < l && new_date > this.dates[k]){
+          this.pickers[k++].setUTCDate(new_date);
+        }
+      }
+      this.updateDates();
+
+      delete this.updating;
+    },
+    destroy: function(){
+      $.map(this.pickers, function(p){ p.destroy(); });
+      $(this.inputs).off('changeDate', this.dateUpdated);
+      delete this.element.data().datepicker;
+    },
+    remove: alias('destroy', 'Method `remove` is deprecated and will be removed in version 2.0. Use `destroy` instead')
+  };
+
+  function opts_from_el(el, prefix){
+    // Derive options from element data-attrs
+    var data = $(el).data(),
+      out = {}, inkey,
+      replace = new RegExp('^' + prefix.toLowerCase() + '([A-Z])');
+    prefix = new RegExp('^' + prefix.toLowerCase());
+    function re_lower(_,a){
+      return a.toLowerCase();
+    }
+    for (var key in data)
+      if (prefix.test(key)){
+        inkey = key.replace(replace, re_lower);
+        out[inkey] = data[key];
+      }
+    return out;
+  }
+
+  function opts_from_locale(lang){
+    // Derive options from locale plugins
+    var out = {};
+    // Check if "de-DE" style date is available, if not language should
+    // fallback to 2 letter code eg "de"
+    if (!dates[lang]){
+      lang = lang.split('-')[0];
+      if (!dates[lang])
+        return;
+    }
+    var d = dates[lang];
+    $.each(locale_opts, function(i,k){
+      if (k in d)
+        out[k] = d[k];
+    });
+    return out;
+  }
+
+  var old = $.fn.datepicker;
+  var datepickerPlugin = function(option){
+    var args = Array.apply(null, arguments);
+    args.shift();
+    var internal_return;
+    this.each(function(){
+      var $this = $(this),
+        data = $this.data('datepicker'),
+        options = typeof option === 'object' && option;
+      if (!data){
+        var elopts = opts_from_el(this, 'date'),
+          // Preliminary otions
+          xopts = $.extend({}, defaults, elopts, options),
+          locopts = opts_from_locale(xopts.language),
+          // Options priority: js args, data-attrs, locales, defaults
+          opts = $.extend({}, defaults, locopts, elopts, options);
+        if ($this.hasClass('input-daterange') || opts.inputs){
+          $.extend(opts, {
+            inputs: opts.inputs || $this.find('input').toArray()
+          });
+          data = new DateRangePicker(this, opts);
+        }
+        else {
+          data = new Datepicker(this, opts);
+        }
+        $this.data('datepicker', data);
+      }
+      if (typeof option === 'string' && typeof data[option] === 'function'){
+        internal_return = data[option].apply(data, args);
+      }
+    });
+
+    if (
+      internal_return === undefined ||
+      internal_return instanceof Datepicker ||
+      internal_return instanceof DateRangePicker
+    )
+      return this;
+
+    if (this.length > 1)
+      throw new Error('Using only allowed for the collection of a single element (' + option + ' function)');
+    else
+      return internal_return;
+  };
+  $.fn.datepicker = datepickerPlugin;
+
+  var defaults = $.fn.datepicker.defaults = {
+    assumeNearbyYear: false,
+    autoclose: false,
+    beforeShowDay: $.noop,
+    beforeShowMonth: $.noop,
+    beforeShowYear: $.noop,
+    beforeShowDecade: $.noop,
+    beforeShowCentury: $.noop,
+    calendarWeeks: false,
+    clearBtn: false,
+    toggleActive: false,
+    daysOfWeekDisabled: [],
+    daysOfWeekHighlighted: [],
+    datesDisabled: [],
+    endDate: Infinity,
+    forceParse: true,
+    format: 'mm/dd/yyyy',
+    keepEmptyValues: false,
+    keyboardNavigation: true,
+    language: 'en',
+    minViewMode: 0,
+    maxViewMode: 4,
+    multidate: false,
+    multidateSeparator: ',',
+    orientation: "auto",
+    rtl: false,
+    startDate: -Infinity,
+    startView: 0,
+    todayBtn: false,
+    todayHighlight: false,
+    updateViewDate: true,
+    weekStart: 0,
+    disableTouchKeyboard: false,
+    enableOnReadonly: true,
+    showOnFocus: true,
+    zIndexOffset: 10,
+    container: 'body',
+    immediateUpdates: false,
+    title: '',
+    templates: {
+      leftArrow: '&#x00AB;',
+      rightArrow: '&#x00BB;'
+    },
+    showWeekDays: true
+  };
+  var locale_opts = $.fn.datepicker.locale_opts = [
+    'format',
+    'rtl',
+    'weekStart'
+  ];
+  $.fn.datepicker.Constructor = Datepicker;
+  var dates = $.fn.datepicker.dates = {
+    en: {
+      days: ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
+      daysShort: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
+      daysMin: ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
+      months: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
+      monthsShort: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"],
+      today: "Today",
+      clear: "Clear",
+      titleFormat: "MM yyyy"
+    }
+  };
+
+  var DPGlobal = {
+    viewModes: [
+      {
+        names: ['days', 'month'],
+        clsName: 'days',
+        e: 'changeMonth'
+      },
+      {
+        names: ['months', 'year'],
+        clsName: 'months',
+        e: 'changeYear',
+        navStep: 1
+      },
+      {
+        names: ['years', 'decade'],
+        clsName: 'years',
+        e: 'changeDecade',
+        navStep: 10
+      },
+      {
+        names: ['decades', 'century'],
+        clsName: 'decades',
+        e: 'changeCentury',
+        navStep: 100
+      },
+      {
+        names: ['centuries', 'millennium'],
+        clsName: 'centuries',
+        e: 'changeMillennium',
+        navStep: 1000
+      }
+    ],
+    validParts: /dd?|DD?|mm?|MM?|yy(?:yy)?/g,
+    nonpunctuation: /[^ -\/:-@\u5e74\u6708\u65e5\[-`{-~\t\n\r]+/g,
+    parseFormat: function(format){
+      if (typeof format.toValue === 'function' && typeof format.toDisplay === 'function')
+        return format;
+      // IE treats \0 as a string end in inputs (truncating the value),
+      // so it's a bad format delimiter, anyway
+      var separators = format.replace(this.validParts, '\0').split('\0'),
+        parts = format.match(this.validParts);
+      if (!separators || !separators.length || !parts || parts.length === 0){
+        throw new Error("Invalid date format.");
+      }
+      return {separators: separators, parts: parts};
+    },
+    parseDate: function(date, format, language, assumeNearby){
+      if (!date)
+        return undefined;
+      if (date instanceof Date)
+        return date;
+      if (typeof format === 'string')
+        format = DPGlobal.parseFormat(format);
+      if (format.toValue)
+        return format.toValue(date, format, language);
+      var fn_map = {
+          d: 'moveDay',
+          m: 'moveMonth',
+          w: 'moveWeek',
+          y: 'moveYear'
+        },
+        dateAliases = {
+          yesterday: '-1d',
+          today: '+0d',
+          tomorrow: '+1d'
+        },
+        parts, part, dir, i, fn;
+      if (date in dateAliases){
+        date = dateAliases[date];
+      }
+      if (/^[\-+]\d+[dmwy]([\s,]+[\-+]\d+[dmwy])*$/i.test(date)){
+        parts = date.match(/([\-+]\d+)([dmwy])/gi);
+        date = new Date();
+        for (i=0; i < parts.length; i++){
+          part = parts[i].match(/([\-+]\d+)([dmwy])/i);
+          dir = Number(part[1]);
+          fn = fn_map[part[2].toLowerCase()];
+          date = Datepicker.prototype[fn](date, dir);
+        }
+        return Datepicker.prototype._zero_utc_time(date);
+      }
+
+      parts = date && date.match(this.nonpunctuation) || [];
+
+      function applyNearbyYear(year, threshold){
+        if (threshold === true)
+          threshold = 10;
+
+        // if year is 2 digits or less, than the user most likely is trying to get a recent century
+        if (year < 100){
+          year += 2000;
+          // if the new year is more than threshold years in advance, use last century
+          if (year > ((new Date()).getFullYear()+threshold)){
+            year -= 100;
+          }
+        }
+
+        return year;
+      }
+
+      var parsed = {},
+        setters_order = ['yyyy', 'yy', 'M', 'MM', 'm', 'mm', 'd', 'dd'],
+        setters_map = {
+          yyyy: function(d,v){
+            return d.setUTCFullYear(assumeNearby ? applyNearbyYear(v, assumeNearby) : v);
+          },
+          m: function(d,v){
+            if (isNaN(d))
+              return d;
+            v -= 1;
+            while (v < 0) v += 12;
+            v %= 12;
+            d.setUTCMonth(v);
+            while (d.getUTCMonth() !== v)
+              d.setUTCDate(d.getUTCDate()-1);
+            return d;
+          },
+          d: function(d,v){
+            return d.setUTCDate(v);
+          }
+        },
+        val, filtered;
+      setters_map['yy'] = setters_map['yyyy'];
+      setters_map['M'] = setters_map['MM'] = setters_map['mm'] = setters_map['m'];
+      setters_map['dd'] = setters_map['d'];
+      date = UTCToday();
+      var fparts = format.parts.slice();
+      // Remove noop parts
+      if (parts.length !== fparts.length){
+        fparts = $(fparts).filter(function(i,p){
+          return $.inArray(p, setters_order) !== -1;
+        }).toArray();
+      }
+      // Process remainder
+      function match_part(){
+        var m = this.slice(0, parts[i].length),
+          p = parts[i].slice(0, m.length);
+        return m.toLowerCase() === p.toLowerCase();
+      }
+      if (parts.length === fparts.length){
+        var cnt;
+        for (i=0, cnt = fparts.length; i < cnt; i++){
+          val = parseInt(parts[i], 10);
+          part = fparts[i];
+          if (isNaN(val)){
+            switch (part){
+              case 'MM':
+                filtered = $(dates[language].months).filter(match_part);
+                val = $.inArray(filtered[0], dates[language].months) + 1;
+                break;
+              case 'M':
+                filtered = $(dates[language].monthsShort).filter(match_part);
+                val = $.inArray(filtered[0], dates[language].monthsShort) + 1;
+                break;
+            }
+          }
+          parsed[part] = val;
+        }
+        var _date, s;
+        for (i=0; i < setters_order.length; i++){
+          s = setters_order[i];
+          if (s in parsed && !isNaN(parsed[s])){
+            _date = new Date(date);
+            setters_map[s](_date, parsed[s]);
+            if (!isNaN(_date))
+              date = _date;
+          }
+        }
+      }
+      return date;
+    },
+    formatDate: function(date, format, language){
+      if (!date)
+        return '';
+      if (typeof format === 'string')
+        format = DPGlobal.parseFormat(format);
+      if (format.toDisplay)
+        return format.toDisplay(date, format, language);
+      var val = {
+        d: date.getUTCDate(),
+        D: dates[language].daysShort[date.getUTCDay()],
+        DD: dates[language].days[date.getUTCDay()],
+        m: date.getUTCMonth() + 1,
+        M: dates[language].monthsShort[date.getUTCMonth()],
+        MM: dates[language].months[date.getUTCMonth()],
+        yy: date.getUTCFullYear().toString().substring(2),
+        yyyy: date.getUTCFullYear()
+      };
+      val.dd = (val.d < 10 ? '0' : '') + val.d;
+      val.mm = (val.m < 10 ? '0' : '') + val.m;
+      date = [];
+      var seps = $.extend([], format.separators);
+      for (var i=0, cnt = format.parts.length; i <= cnt; i++){
+        if (seps.length)
+          date.push(seps.shift());
+        date.push(val[format.parts[i]]);
+      }
+      return date.join('');
+    },
+    headTemplate: '<thead>'+
+      '<tr>'+
+      '<th colspan="7" class="datepicker-title"></th>'+
+      '</tr>'+
+      '<tr>'+
+      '<th class="prev">'+defaults.templates.leftArrow+'</th>'+
+      '<th colspan="5" class="datepicker-switch"></th>'+
+      '<th class="next">'+defaults.templates.rightArrow+'</th>'+
+      '</tr>'+
+      '</thead>',
+    contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>',
+    footTemplate: '<tfoot>'+
+      '<tr>'+
+      '<th colspan="7" class="today"></th>'+
+      '</tr>'+
+      '<tr>'+
+      '<th colspan="7" class="clear"></th>'+
+      '</tr>'+
+      '</tfoot>'
+  };
+  DPGlobal.template = '<div class="datepicker">'+
+    '<div class="datepicker-days">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    '<tbody></tbody>'+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-months">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-years">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-decades">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '<div class="datepicker-centuries">'+
+    '<table class="table-condensed">'+
+    DPGlobal.headTemplate+
+    DPGlobal.contTemplate+
+    DPGlobal.footTemplate+
+    '</table>'+
+    '</div>'+
+    '</div>';
+
+  $.fn.datepicker.DPGlobal = DPGlobal;
+
+
+  /* DATEPICKER NO CONFLICT
+  * =================== */
+
+  $.fn.datepicker.noConflict = function(){
+    $.fn.datepicker = old;
+    return this;
+  };
+
+  /* DATEPICKER VERSION
+   * =================== */
+  $.fn.datepicker.version = '1.9.0';
+
+  $.fn.datepicker.deprecated = function(msg){
+    var console = window.console;
+    if (console && console.warn) {
+      console.warn('DEPRECATED: ' + msg);
+    }
+  };
+
+
+  /* DATEPICKER DATA-API
+  * ================== */
+
+  $(document).on(
+    'focus.datepicker.data-api click.datepicker.data-api',
+    '[data-provide="datepicker"]',
+    function(e){
+      var $this = $(this);
+      if ($this.data('datepicker'))
+        return;
+      e.preventDefault();
+      // component click requires us to explicitly show it
+      datepickerPlugin.call($this, 'show');
+    }
+  );
+  $(function(){
+    datepickerPlugin.call($('[data-provide="datepicker-inline"]'));
+  });
+
+}));
+/* =========================================================
+ * bootstrap-datetimepicker.js
+ * =========================================================
+ * Copyright 2012 Stefan Petre
+ *
+ * Improvements by Andrew Rowls
+ * Improvements by Sébastien Malot
+ * Improvements by Yun Lai
+ * Improvements by Kenneth Henderick
+ * Improvements by CuGBabyBeaR
+ * Improvements by Christian Vaas <auspex@auspex.eu>
+ *
+ * Project URL : http://www.malot.fr/bootstrap-datetimepicker
+ *
+ * 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.
+ * ========================================================= */
+
+
+(function(factory){
+    if (typeof define === 'function' && define.amd)
+      define(['jquery'], factory);
+    else if (typeof exports === 'object')
+      factory(require('jquery'));
+    else
+      factory(jQuery);
+
+}(function($, undefined){
+
+  // Add ECMA262-5 Array methods if not supported natively (IE8)
+  if (!('indexOf' in Array.prototype)) {
+    Array.prototype.indexOf = function (find, i) {
+      if (i === undefined) i = 0;
+      if (i < 0) i += this.length;
+      if (i < 0) i = 0;
+      for (var n = this.length; i < n; i++) {
+        if (i in this && this[i] === find) {
+          return i;
+        }
+      }
+      return -1;
+    }
+  }
+
+  // Add timezone abbreviation support for ie6+, Chrome, Firefox
+  function timeZoneAbbreviation() {
+    var abbreviation, date, formattedStr, i, len, matchedStrings, ref, str;
+    date = (new Date()).toString();
+    formattedStr = ((ref = date.split('(')[1]) != null ? ref.slice(0, -1) : 0) || date.split(' ');
+    if (formattedStr instanceof Array) {
+      matchedStrings = [];
+      for (var i = 0, len = formattedStr.length; i < len; i++) {
+        str = formattedStr[i];
+        if ((abbreviation = (ref = str.match(/\b[A-Z]+\b/)) !== null) ? ref[0] : 0) {
+          matchedStrings.push(abbreviation);
+        }
+      }
+      formattedStr = matchedStrings.pop();
+    }
+    return formattedStr;
+  }
+
+  function UTCDate() {
+    return new Date(Date.UTC.apply(Date, arguments));
+  }
+
+  // Picker object
+  var Datetimepicker = function (element, options) {
+    var that = this;
+
+    this.element = $(element);
+
+    // add container for single page application
+    // when page switch the datetimepicker div will be removed also.
+    this.container = options.container || 'body';
+
+    this.language = options.language || this.element.data('date-language') || 'en';
+    this.language = this.language in dates ? this.language : this.language.split('-')[0]; // fr-CA fallback to fr
+    this.language = this.language in dates ? this.language : 'en';
+    this.isRTL = dates[this.language].rtl || false;
+    this.formatType = options.formatType || this.element.data('format-type') || 'standard';
+    this.format = DPGlobal.parseFormat(options.format || this.element.data('date-format') || dates[this.language].format || DPGlobal.getDefaultFormat(this.formatType, 'input'), this.formatType);
+    this.isInline = false;
+    this.isVisible = false;
+    this.isInput = this.element.is('input');
+    this.fontAwesome = options.fontAwesome || this.element.data('font-awesome') || false;
+
+    this.bootcssVer = options.bootcssVer || (this.isInput ? (this.element.is('.form-control') ? 3 : 2) : ( this.bootcssVer = this.element.is('.input-group') ? 3 : 2 ));
+
+    this.component = this.element.is('.date') ? ( this.bootcssVer === 3 ? this.element.find('.input-group-addon .glyphicon-th, .input-group-addon .glyphicon-time, .input-group-addon .glyphicon-remove, .input-group-addon .glyphicon-calendar, .input-group-addon .fa-calendar, .input-group-addon .fa-clock-o').parent() : this.element.find('.add-on .icon-th, .add-on .icon-time, .add-on .icon-calendar, .add-on .fa-calendar, .add-on .fa-clock-o').parent()) : false;
+    this.componentReset = this.element.is('.date') ? ( this.bootcssVer === 3 ? this.element.find('.input-group-addon .glyphicon-remove, .input-group-addon .fa-times').parent():this.element.find('.add-on .icon-remove, .add-on .fa-times').parent()) : false;
+    this.hasInput = this.component && this.element.find('input').length;
+    if (this.component && this.component.length === 0) {
+      this.component = false;
+    }
+    this.linkField = options.linkField || this.element.data('link-field') || false;
+    this.linkFormat = DPGlobal.parseFormat(options.linkFormat || this.element.data('link-format') || DPGlobal.getDefaultFormat(this.formatType, 'link'), this.formatType);
+    this.minuteStep = options.minuteStep || this.element.data('minute-step') || 5;
+    this.pickerPosition = options.pickerPosition || this.element.data('picker-position') || 'bottom-right';
+    this.showMeridian = options.showMeridian || this.element.data('show-meridian') || false;
+    this.initialDate = options.initialDate || new Date();
+    this.zIndex = options.zIndex || this.element.data('z-index') || undefined;
+    this.title = typeof options.title === 'undefined' ? false : options.title;
+    this.timezone = options.timezone || timeZoneAbbreviation();
+
+    this.icons = {
+      leftArrow: this.fontAwesome ? 'fa-arrow-left' : (this.bootcssVer === 3 ? 'glyphicon-arrow-left' : 'icon-arrow-left'),
+      rightArrow: this.fontAwesome ? 'fa-arrow-right' : (this.bootcssVer === 3 ? 'glyphicon-arrow-right' : 'icon-arrow-right')
+    }
+    this.icontype = this.fontAwesome ? 'fa' : 'glyphicon';
+
+    this._attachEvents();
+
+    this.clickedOutside = function (e) {
+        // Clicked outside the datetimepicker, hide it
+        if ($(e.target).closest('.datetimepicker').length === 0) {
+            that.hide();
+        }
+    }
+
+    this.formatViewType = 'datetime';
+    if ('formatViewType' in options) {
+      this.formatViewType = options.formatViewType;
+    } else if ('formatViewType' in this.element.data()) {
+      this.formatViewType = this.element.data('formatViewType');
+    }
+
+    this.minView = 0;
+    if ('minView' in options) {
+      this.minView = options.minView;
+    } else if ('minView' in this.element.data()) {
+      this.minView = this.element.data('min-view');
+    }
+    this.minView = DPGlobal.convertViewMode(this.minView);
+
+    this.maxView = DPGlobal.modes.length - 1;
+    if ('maxView' in options) {
+      this.maxView = options.maxView;
+    } else if ('maxView' in this.element.data()) {
+      this.maxView = this.element.data('max-view');
+    }
+    this.maxView = DPGlobal.convertViewMode(this.maxView);
+
+    this.wheelViewModeNavigation = false;
+    if ('wheelViewModeNavigation' in options) {
+      this.wheelViewModeNavigation = options.wheelViewModeNavigation;
+    } else if ('wheelViewModeNavigation' in this.element.data()) {
+      this.wheelViewModeNavigation = this.element.data('view-mode-wheel-navigation');
+    }
+
+    this.wheelViewModeNavigationInverseDirection = false;
+
+    if ('wheelViewModeNavigationInverseDirection' in options) {
+      this.wheelViewModeNavigationInverseDirection = options.wheelViewModeNavigationInverseDirection;
+    } else if ('wheelViewModeNavigationInverseDirection' in this.element.data()) {
+      this.wheelViewModeNavigationInverseDirection = this.element.data('view-mode-wheel-navigation-inverse-dir');
+    }
+
+    this.wheelViewModeNavigationDelay = 100;
+    if ('wheelViewModeNavigationDelay' in options) {
+      this.wheelViewModeNavigationDelay = options.wheelViewModeNavigationDelay;
+    } else if ('wheelViewModeNavigationDelay' in this.element.data()) {
+      this.wheelViewModeNavigationDelay = this.element.data('view-mode-wheel-navigation-delay');
+    }
+
+    this.startViewMode = 2;
+    if ('startView' in options) {
+      this.startViewMode = options.startView;
+    } else if ('startView' in this.element.data()) {
+      this.startViewMode = this.element.data('start-view');
+    }
+    this.startViewMode = DPGlobal.convertViewMode(this.startViewMode);
+    this.viewMode = this.startViewMode;
+
+    this.viewSelect = this.minView;
+    if ('viewSelect' in options) {
+      this.viewSelect = options.viewSelect;
+    } else if ('viewSelect' in this.element.data()) {
+      this.viewSelect = this.element.data('view-select');
+    }
+    this.viewSelect = DPGlobal.convertViewMode(this.viewSelect);
+
+    this.forceParse = true;
+    if ('forceParse' in options) {
+      this.forceParse = options.forceParse;
+    } else if ('dateForceParse' in this.element.data()) {
+      this.forceParse = this.element.data('date-force-parse');
+    }
+    var template = this.bootcssVer === 3 ? DPGlobal.templateV3 : DPGlobal.template;
+    while (template.indexOf('{iconType}') !== -1) {
+      template = template.replace('{iconType}', this.icontype);
+    }
+    while (template.indexOf('{leftArrow}') !== -1) {
+      template = template.replace('{leftArrow}', this.icons.leftArrow);
+    }
+    while (template.indexOf('{rightArrow}') !== -1) {
+      template = template.replace('{rightArrow}', this.icons.rightArrow);
+    }
+    this.picker = $(template)
+      .appendTo(this.isInline ? this.element : this.container) // 'body')
+      .on({
+        click:     $.proxy(this.click, this),
+        mousedown: $.proxy(this.mousedown, this)
+      });
+
+    if (this.wheelViewModeNavigation) {
+      if ($.fn.mousewheel) {
+        this.picker.on({mousewheel: $.proxy(this.mousewheel, this)});
+      } else {
+        console.log('Mouse Wheel event is not supported. Please include the jQuery Mouse Wheel plugin before enabling this option');
+      }
+    }
+
+    if (this.isInline) {
+      this.picker.addClass('datetimepicker-inline');
+    } else {
+      this.picker.addClass('datetimepicker-dropdown-' + this.pickerPosition + ' dropdown-menu');
+    }
+    if (this.isRTL) {
+      this.picker.addClass('datetimepicker-rtl');
+      var selector = this.bootcssVer === 3 ? '.prev span, .next span' : '.prev i, .next i';
+      this.picker.find(selector).toggleClass(this.icons.leftArrow + ' ' + this.icons.rightArrow);
+    }
+
+    $(document).on('mousedown touchend', this.clickedOutside);
+
+    this.autoclose = false;
+    if ('autoclose' in options) {
+      this.autoclose = options.autoclose;
+    } else if ('dateAutoclose' in this.element.data()) {
+      this.autoclose = this.element.data('date-autoclose');
+    }
+
+    this.keyboardNavigation = true;
+    if ('keyboardNavigation' in options) {
+      this.keyboardNavigation = options.keyboardNavigation;
+    } else if ('dateKeyboardNavigation' in this.element.data()) {
+      this.keyboardNavigation = this.element.data('date-keyboard-navigation');
+    }
+
+    this.todayBtn = (options.todayBtn || this.element.data('date-today-btn') || false);
+    this.clearBtn = (options.clearBtn || this.element.data('date-clear-btn') || false);
+    this.todayHighlight = (options.todayHighlight || this.element.data('date-today-highlight') || false);
+
+    this.weekStart = 0;
+    if (typeof options.weekStart !== 'undefined') {
+      this.weekStart = options.weekStart;
+    } else if (typeof this.element.data('date-weekstart') !== 'undefined') {
+      this.weekStart = this.element.data('date-weekstart');
+    } else if (typeof dates[this.language].weekStart !== 'undefined') {
+      this.weekStart = dates[this.language].weekStart;
+    }
+    this.weekStart = this.weekStart % 7;
+    this.weekEnd = ((this.weekStart + 6) % 7);
+    this.onRenderDay = function (date) {
+      var render = (options.onRenderDay || function () { return []; })(date);
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      var res = ['day'];
+      return res.concat((render ? render : []));
+    };
+    this.onRenderHour = function (date) {
+      var render = (options.onRenderHour || function () { return []; })(date);
+      var res = ['hour'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      return res.concat((render ? render : []));
+    };
+    this.onRenderMinute = function (date) {
+      var render = (options.onRenderMinute || function () { return []; })(date);
+      var res = ['minute'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      if (date < this.startDate || date > this.endDate) {
+        res.push('disabled');
+      } else if (Math.floor(this.date.getUTCMinutes() / this.minuteStep) === Math.floor(date.getUTCMinutes() / this.minuteStep)) {
+        res.push('active');
+      }
+      return res.concat((render ? render : []));
+    };
+    this.onRenderYear = function (date) {
+      var render = (options.onRenderYear || function () { return []; })(date);
+      var res = ['year'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      if (this.date.getUTCFullYear() === date.getUTCFullYear()) {
+        res.push('active');
+      }
+      var currentYear = date.getUTCFullYear();
+      var endYear = this.endDate.getUTCFullYear();
+      if (date < this.startDate || currentYear > endYear) {
+        res.push('disabled');
+      }
+      return res.concat((render ? render : []));
+    }
+    this.onRenderMonth = function (date) {
+      var render = (options.onRenderMonth || function () { return []; })(date);
+      var res = ['month'];
+      if (typeof render === 'string') {
+        render = [render];
+      }
+      return res.concat((render ? render : []));
+    }
+    this.startDate = new Date(-8639968443048000);
+    this.endDate = new Date(8639968443048000);
+    this.datesDisabled = [];
+    this.daysOfWeekDisabled = [];
+    this.setStartDate(options.startDate || this.element.data('date-startdate'));
+    this.setEndDate(options.endDate || this.element.data('date-enddate'));
+    this.setDatesDisabled(options.datesDisabled || this.element.data('date-dates-disabled'));
+    this.setDaysOfWeekDisabled(options.daysOfWeekDisabled || this.element.data('date-days-of-week-disabled'));
+    this.setMinutesDisabled(options.minutesDisabled || this.element.data('date-minute-disabled'));
+    this.setHoursDisabled(options.hoursDisabled || this.element.data('date-hour-disabled'));
+    this.fillDow();
+    this.fillMonths();
+    this.update();
+    this.showMode();
+
+    if (this.isInline) {
+      this.show();
+    }
+  };
+
+  Datetimepicker.prototype = {
+    constructor: Datetimepicker,
+
+    _events:       [],
+    _attachEvents: function () {
+      this._detachEvents();
+      if (this.isInput) { // single input
+        this._events = [
+          [this.element, {
+            focus:   $.proxy(this.show, this),
+            keyup:   $.proxy(this.update, this),
+            keydown: $.proxy(this.keydown, this)
+          }]
+        ];
+      }
+      else if (this.component && this.hasInput) { // component: input + button
+        this._events = [
+          // For components that are not readonly, allow keyboard nav
+          [this.element.find('input'), {
+            focus:   $.proxy(this.show, this),
+            keyup:   $.proxy(this.update, this),
+            keydown: $.proxy(this.keydown, this)
+          }],
+          [this.component, {
+            click: $.proxy(this.show, this)
+          }]
+        ];
+        if (this.componentReset) {
+          this._events.push([
+            this.componentReset,
+            {click: $.proxy(this.reset, this)}
+          ]);
+        }
+      }
+      else if (this.element.is('div')) {  // inline datetimepicker
+        this.isInline = true;
+      }
+      else {
+        this._events = [
+          [this.element, {
+            click: $.proxy(this.show, this)
+          }]
+        ];
+      }
+      for (var i = 0, el, ev; i < this._events.length; i++) {
+        el = this._events[i][0];
+        ev = this._events[i][1];
+        el.on(ev);
+      }
+    },
+
+    _detachEvents: function () {
+      for (var i = 0, el, ev; i < this._events.length; i++) {
+        el = this._events[i][0];
+        ev = this._events[i][1];
+        el.off(ev);
+      }
+      this._events = [];
+    },
+
+    show: function (e) {
+      this.picker.show();
+      this.height = this.component ? this.component.outerHeight() : this.element.outerHeight();
+      if (this.forceParse) {
+        this.update();
+      }
+      this.place();
+      $(window).on('resize', $.proxy(this.place, this));
+      if (e) {
+        e.stopPropagation();
+        e.preventDefault();
+      }
+      this.isVisible = true;
+      this.element.trigger({
+        type: 'show',
+        date: this.date
+      });
+    },
+
+    hide: function () {
+      if (!this.isVisible) return;
+      if (this.isInline) return;
+      this.picker.hide();
+      $(window).off('resize', this.place);
+      this.viewMode = this.startViewMode;
+      this.showMode();
+      if (!this.isInput) {
+        $(document).off('mousedown', this.hide);
+      }
+
+      if (
+        this.forceParse &&
+          (
+            this.isInput && this.element.val() ||
+              this.hasInput && this.element.find('input').val()
+            )
+        )
+        this.setValue();
+      this.isVisible = false;
+      this.element.trigger({
+        type: 'hide',
+        date: this.date
+      });
+    },
+
+    remove: function () {
+      this._detachEvents();
+      $(document).off('mousedown', this.clickedOutside);
+      this.picker.remove();
+      delete this.picker;
+      delete this.element.data().datetimepicker;
+    },
+
+    getDate: function () {
+      var d = this.getUTCDate();
+      if (d === null) {
+        return null;
+      }
+      return new Date(d.getTime() + (d.getTimezoneOffset() * 60000));
+    },
+
+    getUTCDate: function () {
+      return this.date;
+    },
+
+    getInitialDate: function () {
+      return this.initialDate
+    },
+
+    setInitialDate: function (initialDate) {
+      this.initialDate = initialDate;
+    },
+
+    setDate: function (d) {
+      this.setUTCDate(new Date(d.getTime() - (d.getTimezoneOffset() * 60000)));
+    },
+
+    setUTCDate: function (d) {
+      if (d >= this.startDate && d <= this.endDate) {
+        this.date = d;
+        this.setValue();
+        this.viewDate = this.date;
+        this.fill();
+      } else {
+        this.element.trigger({
+          type:      'outOfRange',
+          date:      d,
+          startDate: this.startDate,
+          endDate:   this.endDate
+        });
+      }
+    },
+
+    setFormat: function (format) {
+      this.format = DPGlobal.parseFormat(format, this.formatType);
+      var element;
+      if (this.isInput) {
+        element = this.element;
+      } else if (this.component) {
+        element = this.element.find('input');
+      }
+      if (element && element.val()) {
+        this.setValue();
+      }
+    },
+
+    setValue: function () {
+      var formatted = this.getFormattedDate();
+      if (!this.isInput) {
+        if (this.component) {
+          this.element.find('input').val(formatted);
+        }
+        this.element.data('date', formatted);
+      } else {
+        this.element.val(formatted);
+      }
+      if (this.linkField) {
+        $('#' + this.linkField).val(this.getFormattedDate(this.linkFormat));
+      }
+    },
+
+    getFormattedDate: function (format) {
+      format = format || this.format;
+      return DPGlobal.formatDate(this.date, format, this.language, this.formatType, this.timezone);
+    },
+
+    setStartDate: function (startDate) {
+      this.startDate = startDate || this.startDate;
+      if (this.startDate.valueOf() !== 8639968443048000) {
+        this.startDate = DPGlobal.parseDate(this.startDate, this.format, this.language, this.formatType, this.timezone);
+      }
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setEndDate: function (endDate) {
+      this.endDate = endDate || this.endDate;
+      if (this.endDate.valueOf() !== 8639968443048000) {
+        this.endDate = DPGlobal.parseDate(this.endDate, this.format, this.language, this.formatType, this.timezone);
+      }
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setDatesDisabled: function (datesDisabled) {
+      this.datesDisabled = datesDisabled || [];
+      if (!$.isArray(this.datesDisabled)) {
+        this.datesDisabled = this.datesDisabled.split(/,\s*/);
+      }
+      var mThis = this;
+      this.datesDisabled = $.map(this.datesDisabled, function (d) {
+        return DPGlobal.parseDate(d, mThis.format, mThis.language, mThis.formatType, mThis.timezone).toDateString();
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setTitle: function (selector, value) {
+      return this.picker.find(selector)
+        .find('th:eq(1)')
+        .text(this.title === false ? value : this.title);
+    },
+
+    setDaysOfWeekDisabled: function (daysOfWeekDisabled) {
+      this.daysOfWeekDisabled = daysOfWeekDisabled || [];
+      if (!$.isArray(this.daysOfWeekDisabled)) {
+        this.daysOfWeekDisabled = this.daysOfWeekDisabled.split(/,\s*/);
+      }
+      this.daysOfWeekDisabled = $.map(this.daysOfWeekDisabled, function (d) {
+        return parseInt(d, 10);
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setMinutesDisabled: function (minutesDisabled) {
+      this.minutesDisabled = minutesDisabled || [];
+      if (!$.isArray(this.minutesDisabled)) {
+        this.minutesDisabled = this.minutesDisabled.split(/,\s*/);
+      }
+      this.minutesDisabled = $.map(this.minutesDisabled, function (d) {
+        return parseInt(d, 10);
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    setHoursDisabled: function (hoursDisabled) {
+      this.hoursDisabled = hoursDisabled || [];
+      if (!$.isArray(this.hoursDisabled)) {
+        this.hoursDisabled = this.hoursDisabled.split(/,\s*/);
+      }
+      this.hoursDisabled = $.map(this.hoursDisabled, function (d) {
+        return parseInt(d, 10);
+      });
+      this.update();
+      this.updateNavArrows();
+    },
+
+    place: function () {
+      if (this.isInline) return;
+
+      if (!this.zIndex) {
+        var index_highest = 0;
+        $('div').each(function () {
+          var index_current = parseInt($(this).css('zIndex'), 10);
+          if (index_current > index_highest) {
+            index_highest = index_current;
+          }
+        });
+        this.zIndex = index_highest + 10;
+      }
+
+      var offset, top, left, containerOffset;
+      if (this.container instanceof $) {
+        containerOffset = this.container.offset();
+      } else {
+        containerOffset = $(this.container).offset();
+      }
+
+      if (this.component) {
+        offset = this.component.offset();
+        left = offset.left;
+        if (this.pickerPosition === 'bottom-left' || this.pickerPosition === 'top-left') {
+          left += this.component.outerWidth() - this.picker.outerWidth();
+        }
+      } else {
+        offset = this.element.offset();
+        left = offset.left;
+        if (this.pickerPosition === 'bottom-left' || this.pickerPosition === 'top-left') {
+          left += this.element.outerWidth() - this.picker.outerWidth();
+        }
+      }
+
+      var bodyWidth = document.body.clientWidth || window.innerWidth;
+      if (left + 220 > bodyWidth) {
+        left = bodyWidth - 220;
+      }
+
+      if (this.pickerPosition === 'top-left' || this.pickerPosition === 'top-right') {
+        top = offset.top - this.picker.outerHeight();
+      } else {
+        top = offset.top + this.height;
+      }
+
+      top = top - containerOffset.top;
+      left = left - containerOffset.left;
+
+      this.picker.css({
+        top:    top,
+        left:   left,
+        zIndex: this.zIndex
+      });
+    },
+
+    hour_minute: "^([0-9]|0[0-9]|1[0-9]|2[0-3]):[0-5][0-9]",
+
+    update: function () {
+      var date, fromArgs = false;
+      if (arguments && arguments.length && (typeof arguments[0] === 'string' || arguments[0] instanceof Date)) {
+        date = arguments[0];
+        fromArgs = true;
+      } else {
+        date = (this.isInput ? this.element.val() : this.element.find('input').val()) || this.element.data('date') || this.initialDate;
+        if (typeof date === 'string') {
+          date = date.replace(/^\s+|\s+$/g,'');
+        }
+      }
+
+      if (!date) {
+        date = new Date();
+        fromArgs = false;
+      }
+
+      if (typeof date === "string") {
+        if (new RegExp(this.hour_minute).test(date) || new RegExp(this.hour_minute + ":[0-5][0-9]").test(date)) {
+          date = this.getDate()
+        }
+      }
+
+      this.date = DPGlobal.parseDate(date, this.format, this.language, this.formatType, this.timezone);
+
+      if (fromArgs) this.setValue();
+
+      if (this.date < this.startDate) {
+        this.viewDate = new Date(this.startDate);
+      } else if (this.date > this.endDate) {
+        this.viewDate = new Date(this.endDate);
+      } else {
+        this.viewDate = new Date(this.date);
+      }
+      this.fill();
+    },
+
+    fillDow: function () {
+      var dowCnt = this.weekStart,
+        html = '<tr>';
+      while (dowCnt < this.weekStart + 7) {
+        html += '<th class="dow">' + dates[this.language].daysMin[(dowCnt++) % 7] + '</th>';
+      }
+      html += '</tr>';
+      this.picker.find('.datetimepicker-days thead').append(html);
+    },
+
+    fillMonths: function () {
+      var html = '';
+      var d = new Date(this.viewDate);
+      for (var i = 0; i < 12; i++) {
+        d.setUTCMonth(i);
+        var classes = this.onRenderMonth(d);
+        html += '<span class="' + classes.join(' ') + '">' + dates[this.language].monthsShort[i] + '</span>';
+      }
+      this.picker.find('.datetimepicker-months td').html(html);
+    },
+
+    fill: function () {
+      if (!this.date || !this.viewDate) {
+        return;
+      }
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        dayMonth = d.getUTCDate(),
+        hours = d.getUTCHours(),
+        startYear = this.startDate.getUTCFullYear(),
+        startMonth = this.startDate.getUTCMonth(),
+        endYear = this.endDate.getUTCFullYear(),
+        endMonth = this.endDate.getUTCMonth() + 1,
+        currentDate = (new UTCDate(this.date.getUTCFullYear(), this.date.getUTCMonth(), this.date.getUTCDate())).valueOf(),
+        today = new Date();
+      this.setTitle('.datetimepicker-days', dates[this.language].months[month] + ' ' + year)
+      if (this.formatViewType === 'time') {
+        var formatted = this.getFormattedDate();
+        this.setTitle('.datetimepicker-hours', formatted);
+        this.setTitle('.datetimepicker-minutes', formatted);
+      } else {
+        this.setTitle('.datetimepicker-hours', dayMonth + ' ' + dates[this.language].months[month] + ' ' + year);
+        this.setTitle('.datetimepicker-minutes', dayMonth + ' ' + dates[this.language].months[month] + ' ' + year);
+      }
+      this.picker.find('tfoot th.today')
+        .text(dates[this.language].today || dates['en'].today)
+        .toggle(this.todayBtn !== false);
+      this.picker.find('tfoot th.clear')
+        .text(dates[this.language].clear || dates['en'].clear)
+        .toggle(this.clearBtn !== false);
+      this.updateNavArrows();
+      this.fillMonths();
+      var prevMonth = UTCDate(year, month - 1, 28, 0, 0, 0, 0),
+        day = DPGlobal.getDaysInMonth(prevMonth.getUTCFullYear(), prevMonth.getUTCMonth());
+      prevMonth.setUTCDate(day);
+      prevMonth.setUTCDate(day - (prevMonth.getUTCDay() - this.weekStart + 7) % 7);
+      var nextMonth = new Date(prevMonth);
+      nextMonth.setUTCDate(nextMonth.getUTCDate() + 42);
+      nextMonth = nextMonth.valueOf();
+      var html = [];
+      var classes;
+      while (prevMonth.valueOf() < nextMonth) {
+        if (prevMonth.getUTCDay() === this.weekStart) {
+          html.push('<tr>');
+        }
+        classes = this.onRenderDay(prevMonth);
+        if (prevMonth.getUTCFullYear() < year || (prevMonth.getUTCFullYear() === year && prevMonth.getUTCMonth() < month)) {
+          classes.push('old');
+        } else if (prevMonth.getUTCFullYear() > year || (prevMonth.getUTCFullYear() === year && prevMonth.getUTCMonth() > month)) {
+          classes.push('new');
+        }
+        // Compare internal UTC date with local today, not UTC today
+        if (this.todayHighlight &&
+          prevMonth.getUTCFullYear() === today.getFullYear() &&
+          prevMonth.getUTCMonth() === today.getMonth() &&
+          prevMonth.getUTCDate() === today.getDate()) {
+          classes.push('today');
+        }
+        if (prevMonth.valueOf() === currentDate) {
+          classes.push('active');
+        }
+        if ((prevMonth.valueOf() + 86400000) <= this.startDate || prevMonth.valueOf() > this.endDate ||
+          $.inArray(prevMonth.getUTCDay(), this.daysOfWeekDisabled) !== -1 ||
+          $.inArray(prevMonth.toDateString(), this.datesDisabled) !== -1) {
+          classes.push('disabled');
+        }
+        html.push('<td class="' + classes.join(' ') + '">' + prevMonth.getUTCDate() + '</td>');
+        if (prevMonth.getUTCDay() === this.weekEnd) {
+          html.push('</tr>');
+        }
+        prevMonth.setUTCDate(prevMonth.getUTCDate() + 1);
+      }
+      this.picker.find('.datetimepicker-days tbody').empty().append(html.join(''));
+
+      html = [];
+      var txt = '', meridian = '', meridianOld = '';
+      var hoursDisabled = this.hoursDisabled || [];
+      d = new Date(this.viewDate)
+      for (var i = 0; i < 24; i++) {
+        d.setUTCHours(i);
+        classes = this.onRenderHour(d);
+        if (hoursDisabled.indexOf(i) !== -1) {
+          classes.push('disabled');
+        }
+        var actual = UTCDate(year, month, dayMonth, i);
+        // We want the previous hour for the startDate
+        if ((actual.valueOf() + 3600000) <= this.startDate || actual.valueOf() > this.endDate) {
+          classes.push('disabled');
+        } else if (hours === i) {
+          classes.push('active');
+        }
+        if (this.showMeridian && dates[this.language].meridiem.length === 2) {
+          meridian = (i < 12 ? dates[this.language].meridiem[0] : dates[this.language].meridiem[1]);
+          if (meridian !== meridianOld) {
+            if (meridianOld !== '') {
+              html.push('</fieldset>');
+            }
+            html.push('<fieldset class="hour"><legend>' + meridian.toUpperCase() + '</legend>');
+          }
+          meridianOld = meridian;
+          txt = (i % 12 ? i % 12 : 12);
+          if (i < 12) {
+            classes.push('hour_am');
+          } else {
+            classes.push('hour_pm');
+          }
+          html.push('<span class="' + classes.join(' ') + '">' + txt + '</span>');
+          if (i === 23) {
+            html.push('</fieldset>');
+          }
+        } else {
+          txt = i + ':00';
+          html.push('<span class="' + classes.join(' ') + '">' + txt + '</span>');
+        }
+      }
+      this.picker.find('.datetimepicker-hours td').html(html.join(''));
+
+      html = [];
+      txt = '';
+      meridian = '';
+      meridianOld = '';
+      var minutesDisabled = this.minutesDisabled || [];
+      d = new Date(this.viewDate);
+      for (var i = 0; i < 60; i += this.minuteStep) {
+        if (minutesDisabled.indexOf(i) !== -1) continue;
+        d.setUTCMinutes(i);
+        d.setUTCSeconds(0);
+        classes = this.onRenderMinute(d);
+        if (this.showMeridian && dates[this.language].meridiem.length === 2) {
+          meridian = (hours < 12 ? dates[this.language].meridiem[0] : dates[this.language].meridiem[1]);
+          if (meridian !== meridianOld) {
+            if (meridianOld !== '') {
+              html.push('</fieldset>');
+            }
+            html.push('<fieldset class="minute"><legend>' + meridian.toUpperCase() + '</legend>');
+          }
+          meridianOld = meridian;
+          txt = (hours % 12 ? hours % 12 : 12);
+          html.push('<span class="' + classes.join(' ') + '">' + txt + ':' + (i < 10 ? '0' + i : i) + '</span>');
+          if (i === 59) {
+            html.push('</fieldset>');
+          }
+        } else {
+          txt = i + ':00';
+          html.push('<span class="' + classes.join(' ') + '">' + hours + ':' + (i < 10 ? '0' + i : i) + '</span>');
+        }
+      }
+      this.picker.find('.datetimepicker-minutes td').html(html.join(''));
+
+      var currentYear = this.date.getUTCFullYear();
+      var months = this.setTitle('.datetimepicker-months', year)
+        .end()
+        .find('.month').removeClass('active');
+      if (currentYear === year) {
+        // getUTCMonths() returns 0 based, and we need to select the next one
+        // To cater bootstrap 2 we don't need to select the next one
+        months.eq(this.date.getUTCMonth()).addClass('active');
+      }
+      if (year < startYear || year > endYear) {
+        months.addClass('disabled');
+      }
+      if (year === startYear) {
+        months.slice(0, startMonth).addClass('disabled');
+      }
+      if (year === endYear) {
+        months.slice(endMonth).addClass('disabled');
+      }
+
+      html = '';
+      year = parseInt(year / 10, 10) * 10;
+      var yearCont = this.setTitle('.datetimepicker-years', year + '-' + (year + 9))
+        .end()
+        .find('td');
+      year -= 1;
+      d = new Date(this.viewDate);
+      for (var i = -1; i < 11; i++) {
+        d.setUTCFullYear(year);
+        classes = this.onRenderYear(d);
+        if (i === -1 || i === 10) {
+          classes.push(old);
+        }
+        html += '<span class="' + classes.join(' ') + '">' + year + '</span>';
+        year += 1;
+      }
+      yearCont.html(html);
+      this.place();
+    },
+
+    updateNavArrows: function () {
+      var d = new Date(this.viewDate),
+        year = d.getUTCFullYear(),
+        month = d.getUTCMonth(),
+        day = d.getUTCDate(),
+        hour = d.getUTCHours();
+      switch (this.viewMode) {
+        case 0:
+          if (year <= this.startDate.getUTCFullYear()
+            && month <= this.startDate.getUTCMonth()
+            && day <= this.startDate.getUTCDate()
+            && hour <= this.startDate.getUTCHours()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()
+            && month >= this.endDate.getUTCMonth()
+            && day >= this.endDate.getUTCDate()
+            && hour >= this.endDate.getUTCHours()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+        case 1:
+          if (year <= this.startDate.getUTCFullYear()
+            && month <= this.startDate.getUTCMonth()
+            && day <= this.startDate.getUTCDate()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()
+            && month >= this.endDate.getUTCMonth()
+            && day >= this.endDate.getUTCDate()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+        case 2:
+          if (year <= this.startDate.getUTCFullYear()
+            && month <= this.startDate.getUTCMonth()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()
+            && month >= this.endDate.getUTCMonth()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+        case 3:
+        case 4:
+          if (year <= this.startDate.getUTCFullYear()) {
+            this.picker.find('.prev').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.prev').css({visibility: 'visible'});
+          }
+          if (year >= this.endDate.getUTCFullYear()) {
+            this.picker.find('.next').css({visibility: 'hidden'});
+          } else {
+            this.picker.find('.next').css({visibility: 'visible'});
+          }
+          break;
+      }
+    },
+
+    mousewheel: function (e) {
+
+      e.preventDefault();
+      e.stopPropagation();
+
+      if (this.wheelPause) {
+        return;
+      }
+
+      this.wheelPause = true;
+
+      var originalEvent = e.originalEvent;
+
+      var delta = originalEvent.wheelDelta;
+
+      var mode = delta > 0 ? 1 : (delta === 0) ? 0 : -1;
+
+      if (this.wheelViewModeNavigationInverseDirection) {
+        mode = -mode;
+      }
+
+      this.showMode(mode);
+
+      setTimeout($.proxy(function () {
+
+        this.wheelPause = false
+
+      }, this), this.wheelViewModeNavigationDelay);
+
+    },
+
+    click: function (e) {
+      e.stopPropagation();
+      e.preventDefault();
+      var target = $(e.target).closest('span, td, th, legend');
+      if (target.is('.' + this.icontype)) {
+        target = $(target).parent().closest('span, td, th, legend');
+      }
+      if (target.length === 1) {
+        if (target.is('.disabled')) {
+          this.element.trigger({
+            type:      'outOfRange',
+            date:      this.viewDate,
+            startDate: this.startDate,
+            endDate:   this.endDate
+          });
+          return;
+        }
+        switch (target[0].nodeName.toLowerCase()) {
+          case 'th':
+            switch (target[0].className) {
+              case 'switch':
+                this.showMode(1);
+                break;
+              case 'prev':
+              case 'next':
+                var dir = DPGlobal.modes[this.viewMode].navStep * (target[0].className === 'prev' ? -1 : 1);
+                switch (this.viewMode) {
+                  case 0:
+                    this.viewDate = this.moveHour(this.viewDate, dir);
+                    break;
+                  case 1:
+                    this.viewDate = this.moveDate(this.viewDate, dir);
+                    break;
+                  case 2:
+                    this.viewDate = this.moveMonth(this.viewDate, dir);
+                    break;
+                  case 3:
+                  case 4:
+                    this.viewDate = this.moveYear(this.viewDate, dir);
+                    break;
+                }
+                this.fill();
+                this.element.trigger({
+                  type:      target[0].className + ':' + this.convertViewModeText(this.viewMode),
+                  date:      this.viewDate,
+                  startDate: this.startDate,
+                  endDate:   this.endDate
+                });
+                break;
+              case 'clear':
+                this.reset();
+                if (this.autoclose) {
+                  this.hide();
+                }
+                break;
+              case 'today':
+                var date = new Date();
+                date = UTCDate(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), 0);
+
+                // Respect startDate and endDate.
+                if (date < this.startDate) date = this.startDate;
+                else if (date > this.endDate) date = this.endDate;
+
+                this.viewMode = this.startViewMode;
+                this.showMode(0);
+                this._setDate(date);
+                this.fill();
+                if (this.autoclose) {
+                  this.hide();
+                }
+                break;
+            }
+            break;
+          case 'span':
+            if (!target.is('.disabled')) {
+              var year = this.viewDate.getUTCFullYear(),
+                month = this.viewDate.getUTCMonth(),
+                day = this.viewDate.getUTCDate(),
+                hours = this.viewDate.getUTCHours(),
+                minutes = this.viewDate.getUTCMinutes(),
+                seconds = this.viewDate.getUTCSeconds();
+
+              if (target.is('.month')) {
+                this.viewDate.setUTCDate(1);
+                month = target.parent().find('span').index(target);
+                day = this.viewDate.getUTCDate();
+                this.viewDate.setUTCMonth(month);
+                this.element.trigger({
+                  type: 'changeMonth',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 3) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              } else if (target.is('.year')) {
+                this.viewDate.setUTCDate(1);
+                year = parseInt(target.text(), 10) || 0;
+                this.viewDate.setUTCFullYear(year);
+                this.element.trigger({
+                  type: 'changeYear',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 4) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              } else if (target.is('.hour')) {
+                hours = parseInt(target.text(), 10) || 0;
+                if (target.hasClass('hour_am') || target.hasClass('hour_pm')) {
+                  if (hours === 12 && target.hasClass('hour_am')) {
+                    hours = 0;
+                  } else if (hours !== 12 && target.hasClass('hour_pm')) {
+                    hours += 12;
+                  }
+                }
+                this.viewDate.setUTCHours(hours);
+                this.element.trigger({
+                  type: 'changeHour',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 1) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              } else if (target.is('.minute')) {
+                minutes = parseInt(target.text().substr(target.text().indexOf(':') + 1), 10) || 0;
+                this.viewDate.setUTCMinutes(minutes);
+                this.element.trigger({
+                  type: 'changeMinute',
+                  date: this.viewDate
+                });
+                if (this.viewSelect >= 0) {
+                  this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+                }
+              }
+              if (this.viewMode !== 0) {
+                var oldViewMode = this.viewMode;
+                this.showMode(-1);
+                this.fill();
+                if (oldViewMode === this.viewMode && this.autoclose) {
+                  this.hide();
+                }
+              } else {
+                this.fill();
+                if (this.autoclose) {
+                  this.hide();
+                }
+              }
+            }
+            break;
+          case 'td':
+            if (target.is('.day') && !target.is('.disabled')) {
+              var day = parseInt(target.text(), 10) || 1;
+              var year = this.viewDate.getUTCFullYear(),
+                month = this.viewDate.getUTCMonth(),
+                hours = this.viewDate.getUTCHours(),
+                minutes = this.viewDate.getUTCMinutes(),
+                seconds = this.viewDate.getUTCSeconds();
+              if (target.is('.old')) {
+                if (month === 0) {
+                  month = 11;
+                  year -= 1;
+                } else {
+                  month -= 1;
+                }
+              } else if (target.is('.new')) {
+                if (month === 11) {
+                  month = 0;
+                  year += 1;
+                } else {
+                  month += 1;
+                }
+              }
+              this.viewDate.setUTCFullYear(year);
+              this.viewDate.setUTCMonth(month, day);
+              this.element.trigger({
+                type: 'changeDay',
+                date: this.viewDate
+              });
+              if (this.viewSelect >= 2) {
+                this._setDate(UTCDate(year, month, day, hours, minutes, seconds, 0));
+              }
+            }
+            var oldViewMode = this.viewMode;
+            this.showMode(-1);
+            this.fill();
+            if (oldViewMode === this.viewMode && this.autoclose) {
+              this.hide();
+            }
+            break;
+        }
+      }
+    },
+
+    _setDate: function (date, which) {
+      if (!which || which === 'date')
+        this.date = date;
+      if (!which || which === 'view')
+        this.viewDate = date;
+      this.fill();
+      this.setValue();
+      var element;
+      if (this.isInput) {
+        element = this.element;
+      } else if (this.component) {
+        element = this.element.find('input');
+      }
+      if (element) {
+        element.change();
+      }
+      this.element.trigger({
+        type: 'changeDate',
+        date: this.getDate()
+      });
+      if(date === null)
+        this.date = this.viewDate;
+    },
+
+    moveMinute: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf());
+      //dir = dir > 0 ? 1 : -1;
+      new_date.setUTCMinutes(new_date.getUTCMinutes() + (dir * this.minuteStep));
+      return new_date;
+    },
+
+    moveHour: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf());
+      //dir = dir > 0 ? 1 : -1;
+      new_date.setUTCHours(new_date.getUTCHours() + dir);
+      return new_date;
+    },
+
+    moveDate: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf());
+      //dir = dir > 0 ? 1 : -1;
+      new_date.setUTCDate(new_date.getUTCDate() + dir);
+      return new_date;
+    },
+
+    moveMonth: function (date, dir) {
+      if (!dir) return date;
+      var new_date = new Date(date.valueOf()),
+        day = new_date.getUTCDate(),
+        month = new_date.getUTCMonth(),
+        mag = Math.abs(dir),
+        new_month, test;
+      dir = dir > 0 ? 1 : -1;
+      if (mag === 1) {
+        test = dir === -1
+          // If going back one month, make sure month is not current month
+          // (eg, Mar 31 -> Feb 31 === Feb 28, not Mar 02)
+          ? function () {
+          return new_date.getUTCMonth() === month;
+        }
+          // If going forward one month, make sure month is as expected
+          // (eg, Jan 31 -> Feb 31 === Feb 28, not Mar 02)
+          : function () {
+          return new_date.getUTCMonth() !== new_month;
+        };
+        new_month = month + dir;
+        new_date.setUTCMonth(new_month);
+        // Dec -> Jan (12) or Jan -> Dec (-1) -- limit expected date to 0-11
+        if (new_month < 0 || new_month > 11)
+          new_month = (new_month + 12) % 12;
+      } else {
+        // For magnitudes >1, move one month at a time...
+        for (var i = 0; i < mag; i++)
+          // ...which might decrease the day (eg, Jan 31 to Feb 28, etc)...
+          new_date = this.moveMonth(new_date, dir);
+        // ...then reset the day, keeping it in the new month
+        new_month = new_date.getUTCMonth();
+        new_date.setUTCDate(day);
+        test = function () {
+          return new_month !== new_date.getUTCMonth();
+        };
+      }
+      // Common date-resetting loop -- if date is beyond end of month, make it
+      // end of month
+      while (test()) {
+        new_date.setUTCDate(--day);
+        new_date.setUTCMonth(new_month);
+      }
+      return new_date;
+    },
+
+    moveYear: function (date, dir) {
+      return this.moveMonth(date, dir * 12);
+    },
+
+    dateWithinRange: function (date) {
+      return date >= this.startDate && date <= this.endDate;
+    },
+
+    keydown: function (e) {
+      if (this.picker.is(':not(:visible)')) {
+        if (e.keyCode === 27) // allow escape to hide and re-show picker
+          this.show();
+        return;
+      }
+      var dateChanged = false,
+        dir, newDate, newViewDate;
+      switch (e.keyCode) {
+        case 27: // escape
+          this.hide();
+          e.preventDefault();
+          break;
+        case 37: // left
+        case 39: // right
+          if (!this.keyboardNavigation) break;
+          dir = e.keyCode === 37 ? -1 : 1;
+          var viewMode = this.viewMode;
+          if (e.ctrlKey) {
+            viewMode += 2;
+          } else if (e.shiftKey) {
+            viewMode += 1;
+          }
+          if (viewMode === 4) {
+            newDate = this.moveYear(this.date, dir);
+            newViewDate = this.moveYear(this.viewDate, dir);
+          } else if (viewMode === 3) {
+            newDate = this.moveMonth(this.date, dir);
+            newViewDate = this.moveMonth(this.viewDate, dir);
+          } else if (viewMode === 2) {
+            newDate = this.moveDate(this.date, dir);
+            newViewDate = this.moveDate(this.viewDate, dir);
+          } else if (viewMode === 1) {
+            newDate = this.moveHour(this.date, dir);
+            newViewDate = this.moveHour(this.viewDate, dir);
+          } else if (viewMode === 0) {
+            newDate = this.moveMinute(this.date, dir);
+            newViewDate = this.moveMinute(this.viewDate, dir);
+          }
+          if (this.dateWithinRange(newDate)) {
+            this.date = newDate;
+            this.viewDate = newViewDate;
+            this.setValue();
+            this.update();
+            e.preventDefault();
+            dateChanged = true;
+          }
+          break;
+        case 38: // up
+        case 40: // down
+          if (!this.keyboardNavigation) break;
+          dir = e.keyCode === 38 ? -1 : 1;
+          viewMode = this.viewMode;
+          if (e.ctrlKey) {
+            viewMode += 2;
+          } else if (e.shiftKey) {
+            viewMode += 1;
+          }
+          if (viewMode === 4) {
+            newDate = this.moveYear(this.date, dir);
+            newViewDate = this.moveYear(this.viewDate, dir);
+          } else if (viewMode === 3) {
+            newDate = this.moveMonth(this.date, dir);
+            newViewDate = this.moveMonth(this.viewDate, dir);
+          } else if (viewMode === 2) {
+            newDate = this.moveDate(this.date, dir * 7);
+            newViewDate = this.moveDate(this.viewDate, dir * 7);
+          } else if (viewMode === 1) {
+            if (this.showMeridian) {
+              newDate = this.moveHour(this.date, dir * 6);
+              newViewDate = this.moveHour(this.viewDate, dir * 6);
+            } else {
+              newDate = this.moveHour(this.date, dir * 4);
+              newViewDate = this.moveHour(this.viewDate, dir * 4);
+            }
+          } else if (viewMode === 0) {
+            newDate = this.moveMinute(this.date, dir * 4);
+            newViewDate = this.moveMinute(this.viewDate, dir * 4);
+          }
+          if (this.dateWithinRange(newDate)) {
+            this.date = newDate;
+            this.viewDate = newViewDate;
+            this.setValue();
+            this.update();
+            e.preventDefault();
+            dateChanged = true;
+          }
+          break;
+        case 13: // enter
+          if (this.viewMode !== 0) {
+            var oldViewMode = this.viewMode;
+            this.showMode(-1);
+            this.fill();
+            if (oldViewMode === this.viewMode && this.autoclose) {
+              this.hide();
+            }
+          } else {
+            this.fill();
+            if (this.autoclose) {
+              this.hide();
+            }
+          }
+          e.preventDefault();
+          break;
+        case 9: // tab
+          this.hide();
+          break;
+      }
+      if (dateChanged) {
+        var element;
+        if (this.isInput) {
+          element = this.element;
+        } else if (this.component) {
+          element = this.element.find('input');
+        }
+        if (element) {
+          element.change();
+        }
+        this.element.trigger({
+          type: 'changeDate',
+          date: this.getDate()
+        });
+      }
+    },
+
+    showMode: function (dir) {
+      if (dir) {
+        var newViewMode = Math.max(0, Math.min(DPGlobal.modes.length - 1, this.viewMode + dir));
+        if (newViewMode >= this.minView && newViewMode <= this.maxView) {
+          this.element.trigger({
+            type:        'changeMode',
+            date:        this.viewDate,
+            oldViewMode: this.viewMode,
+            newViewMode: newViewMode
+          });
+
+          this.viewMode = newViewMode;
+        }
+      }
+      /*
+       vitalets: fixing bug of very special conditions:
+       jquery 1.7.1 + webkit + show inline datetimepicker in bootstrap popover.
+       Method show() does not set display css correctly and datetimepicker is not shown.
+       Changed to .css('display', 'block') solve the problem.
+       See https://github.com/vitalets/x-editable/issues/37
+
+       In jquery 1.7.2+ everything works fine.
+       */
+      //this.picker.find('>div').hide().filter('.datetimepicker-'+DPGlobal.modes[this.viewMode].clsName).show();
+      this.picker.find('>div').hide().filter('.datetimepicker-' + DPGlobal.modes[this.viewMode].clsName).css('display', 'block');
+      this.updateNavArrows();
+    },
+
+    reset: function () {
+      this._setDate(null, 'date');
+    },
+
+    convertViewModeText:  function (viewMode) {
+      switch (viewMode) {
+        case 4:
+          return 'decade';
+        case 3:
+          return 'year';
+        case 2:
+          return 'month';
+        case 1:
+          return 'day';
+        case 0:
+          return 'hour';
+      }
+    }
+  };
+
+  var old = $.fn.datetimepicker;
+  $.fn.datetimepicker = function (option) {
+    var args = Array.apply(null, arguments);
+    args.shift();
+    var internal_return;
+    this.each(function () {
+      var $this = $(this),
+        data = $this.data('datetimepicker'),
+        options = typeof option === 'object' && option;
+      if (!data) {
+        $this.data('datetimepicker', (data = new Datetimepicker(this, $.extend({}, $.fn.datetimepicker.defaults, options))));
+      }
+      if (typeof option === 'string' && typeof data[option] === 'function') {
+        internal_return = data[option].apply(data, args);
+        if (internal_return !== undefined) {
+          return false;
+        }
+      }
+    });
+    if (internal_return !== undefined)
+      return internal_return;
+    else
+      return this;
+  };
+
+  $.fn.datetimepicker.defaults = {
+  };
+  $.fn.datetimepicker.Constructor = Datetimepicker;
+  var dates = $.fn.datetimepicker.dates = {
+    en: {
+      days:        ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
+      daysShort:   ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+      daysMin:     ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su'],
+      months:      ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
+      monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+      meridiem:    ['am', 'pm'],
+      suffix:      ['st', 'nd', 'rd', 'th'],
+      today:       'Today',
+      clear:       'Clear'
+    }
+  };
+
+  var DPGlobal = {
+    modes:            [
+      {
+        clsName: 'minutes',
+        navFnc:  'Hours',
+        navStep: 1
+      },
+      {
+        clsName: 'hours',
+        navFnc:  'Date',
+        navStep: 1
+      },
+      {
+        clsName: 'days',
+        navFnc:  'Month',
+        navStep: 1
+      },
+      {
+        clsName: 'months',
+        navFnc:  'FullYear',
+        navStep: 1
+      },
+      {
+        clsName: 'years',
+        navFnc:  'FullYear',
+        navStep: 10
+      }
+    ],
+    isLeapYear:       function (year) {
+      return (((year % 4 === 0) && (year % 100 !== 0)) || (year % 400 === 0))
+    },
+    getDaysInMonth:   function (year, month) {
+      return [31, (DPGlobal.isLeapYear(year) ? 29 : 28), 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month]
+    },
+    getDefaultFormat: function (type, field) {
+      if (type === 'standard') {
+        if (field === 'input')
+          return 'yyyy-mm-dd hh:ii';
+        else
+          return 'yyyy-mm-dd hh:ii:ss';
+      } else if (type === 'php') {
+        if (field === 'input')
+          return 'Y-m-d H:i';
+        else
+          return 'Y-m-d H:i:s';
+      } else {
+        throw new Error('Invalid format type.');
+      }
+    },
+    validParts: function (type) {
+      if (type === 'standard') {
+        return /t|hh?|HH?|p|P|z|Z|ii?|ss?|dd?|DD?|mm?|MM?|yy(?:yy)?/g;
+      } else if (type === 'php') {
+        return /[dDjlNwzFmMnStyYaABgGhHis]/g;
+      } else {
+        throw new Error('Invalid format type.');
+      }
+    },
+    nonpunctuation: /[^ -\/:-@\[-`{-~\t\n\rTZ]+/g,
+    parseFormat: function (format, type) {
+      // IE treats \0 as a string end in inputs (truncating the value),
+      // so it's a bad format delimiter, anyway
+      var separators = format.replace(this.validParts(type), '\0').split('\0'),
+        parts = format.match(this.validParts(type));
+      if (!separators || !separators.length || !parts || parts.length === 0) {
+        throw new Error('Invalid date format.');
+      }
+      return {separators: separators, parts: parts};
+    },
+    parseDate: function (date, format, language, type, timezone) {
+      if (date instanceof Date) {
+        var dateUTC = new Date(date.valueOf() - date.getTimezoneOffset() * 60000);
+        dateUTC.setMilliseconds(0);
+        return dateUTC;
+      }
+      if (/^\d{4}\-\d{1,2}\-\d{1,2}$/.test(date)) {
+        format = this.parseFormat('yyyy-mm-dd', type);
+      }
+      if (/^\d{4}\-\d{1,2}\-\d{1,2}[T ]\d{1,2}\:\d{1,2}$/.test(date)) {
+        format = this.parseFormat('yyyy-mm-dd hh:ii', type);
+      }
+      if (/^\d{4}\-\d{1,2}\-\d{1,2}[T ]\d{1,2}\:\d{1,2}\:\d{1,2}[Z]{0,1}$/.test(date)) {
+        format = this.parseFormat('yyyy-mm-dd hh:ii:ss', type);
+      }
+      if (/^[-+]\d+[dmwy]([\s,]+[-+]\d+[dmwy])*$/.test(date)) {
+        var part_re = /([-+]\d+)([dmwy])/,
+          parts = date.match(/([-+]\d+)([dmwy])/g),
+          part, dir;
+        date = new Date();
+        for (var i = 0; i < parts.length; i++) {
+          part = part_re.exec(parts[i]);
+          dir = parseInt(part[1]);
+          switch (part[2]) {
+            case 'd':
+              date.setUTCDate(date.getUTCDate() + dir);
+              break;
+            case 'm':
+              date = Datetimepicker.prototype.moveMonth.call(Datetimepicker.prototype, date, dir);
+              break;
+            case 'w':
+              date.setUTCDate(date.getUTCDate() + dir * 7);
+              break;
+            case 'y':
+              date = Datetimepicker.prototype.moveYear.call(Datetimepicker.prototype, date, dir);
+              break;
+          }
+        }
+        return UTCDate(date.getUTCFullYear(), date.getUTCMonth(), date.getUTCDate(), date.getUTCHours(), date.getUTCMinutes(), date.getUTCSeconds(), 0);
+      }
+      var parts = date && date.toString().match(this.nonpunctuation) || [],
+        date = new Date(0, 0, 0, 0, 0, 0, 0),
+        parsed = {},
+        setters_order = ['hh', 'h', 'ii', 'i', 'ss', 's', 'yyyy', 'yy', 'M', 'MM', 'm', 'mm', 'D', 'DD', 'd', 'dd', 'H', 'HH', 'p', 'P', 'z', 'Z'],
+        setters_map = {
+          hh:   function (d, v) {
+            return d.setUTCHours(v);
+          },
+          h:    function (d, v) {
+            return d.setUTCHours(v);
+          },
+          HH:   function (d, v) {
+            return d.setUTCHours(v === 12 ? 0 : v);
+          },
+          H:    function (d, v) {
+            return d.setUTCHours(v === 12 ? 0 : v);
+          },
+          ii:   function (d, v) {
+            return d.setUTCMinutes(v);
+          },
+          i:    function (d, v) {
+            return d.setUTCMinutes(v);
+          },
+          ss:   function (d, v) {
+            return d.setUTCSeconds(v);
+          },
+          s:    function (d, v) {
+            return d.setUTCSeconds(v);
+          },
+          yyyy: function (d, v) {
+            return d.setUTCFullYear(v);
+          },
+          yy:   function (d, v) {
+            return d.setUTCFullYear(2000 + v);
+          },
+          m:    function (d, v) {
+            v -= 1;
+            while (v < 0) v += 12;
+            v %= 12;
+            d.setUTCMonth(v);
+            while (d.getUTCMonth() !== v)
+              if (isNaN(d.getUTCMonth()))
+                return d;
+              else
+                d.setUTCDate(d.getUTCDate() - 1);
+            return d;
+          },
+          d:    function (d, v) {
+            return d.setUTCDate(v);
+          },
+          p:    function (d, v) {
+            return d.setUTCHours(v === 1 ? d.getUTCHours() + 12 : d.getUTCHours());
+          },
+          z:    function () {
+            return timezone
+          }
+        },
+        val, filtered, part;
+      setters_map['M'] = setters_map['MM'] = setters_map['mm'] = setters_map['m'];
+      setters_map['dd'] = setters_map['d'];
+      setters_map['P'] = setters_map['p'];
+      setters_map['Z'] = setters_map['z'];
+      date = UTCDate(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds());
+      if (parts.length === format.parts.length) {
+        for (var i = 0, cnt = format.parts.length; i < cnt; i++) {
+          val = parseInt(parts[i], 10);
+          part = format.parts[i];
+          if (isNaN(val)) {
+            switch (part) {
+              case 'MM':
+                filtered = $(dates[language].months).filter(function () {
+                  var m = this.slice(0, parts[i].length),
+                    p = parts[i].slice(0, m.length);
+                  return m === p;
+                });
+                val = $.inArray(filtered[0], dates[language].months) + 1;
+                break;
+              case 'M':
+                filtered = $(dates[language].monthsShort).filter(function () {
+                  var m = this.slice(0, parts[i].length),
+                    p = parts[i].slice(0, m.length);
+                  return m.toLowerCase() === p.toLowerCase();
+                });
+                val = $.inArray(filtered[0], dates[language].monthsShort) + 1;
+                break;
+              case 'p':
+              case 'P':
+                val = $.inArray(parts[i].toLowerCase(), dates[language].meridiem);
+                break;
+              case 'z':
+              case 'Z':
+                timezone;
+                break;
+
+            }
+          }
+          parsed[part] = val;
+        }
+        for (var i = 0, s; i < setters_order.length; i++) {
+          s = setters_order[i];
+          if (s in parsed && !isNaN(parsed[s]))
+            setters_map[s](date, parsed[s])
+        }
+      }
+      return date;
+    },
+    formatDate:       function (date, format, language, type, timezone) {
+      if (date === null) {
+        return '';
+      }
+      var val;
+      if (type === 'standard') {
+        val = {
+          t:    date.getTime(),
+          // year
+          yy:   date.getUTCFullYear().toString().substring(2),
+          yyyy: date.getUTCFullYear(),
+          // month
+          m:    date.getUTCMonth() + 1,
+          M:    dates[language].monthsShort[date.getUTCMonth()],
+          MM:   dates[language].months[date.getUTCMonth()],
+          // day
+          d:    date.getUTCDate(),
+          D:    dates[language].daysShort[date.getUTCDay()],
+          DD:   dates[language].days[date.getUTCDay()],
+          p:    (dates[language].meridiem.length === 2 ? dates[language].meridiem[date.getUTCHours() < 12 ? 0 : 1] : ''),
+          // hour
+          h:    date.getUTCHours(),
+          // minute
+          i:    date.getUTCMinutes(),
+          // second
+          s:    date.getUTCSeconds(),
+          // timezone
+          z:    timezone
+        };
+
+        if (dates[language].meridiem.length === 2) {
+          val.H = (val.h % 12 === 0 ? 12 : val.h % 12);
+        }
+        else {
+          val.H = val.h;
+        }
+        val.HH = (val.H < 10 ? '0' : '') + val.H;
+        val.P = val.p.toUpperCase();
+        val.Z = val.z;
+        val.hh = (val.h < 10 ? '0' : '') + val.h;
+        val.ii = (val.i < 10 ? '0' : '') + val.i;
+        val.ss = (val.s < 10 ? '0' : '') + val.s;
+        val.dd = (val.d < 10 ? '0' : '') + val.d;
+        val.mm = (val.m < 10 ? '0' : '') + val.m;
+      } else if (type === 'php') {
+        // php format
+        val = {
+          // year
+          y: date.getUTCFullYear().toString().substring(2),
+          Y: date.getUTCFullYear(),
+          // month
+          F: dates[language].months[date.getUTCMonth()],
+          M: dates[language].monthsShort[date.getUTCMonth()],
+          n: date.getUTCMonth() + 1,
+          t: DPGlobal.getDaysInMonth(date.getUTCFullYear(), date.getUTCMonth()),
+          // day
+          j: date.getUTCDate(),
+          l: dates[language].days[date.getUTCDay()],
+          D: dates[language].daysShort[date.getUTCDay()],
+          w: date.getUTCDay(), // 0 -> 6
+          N: (date.getUTCDay() === 0 ? 7 : date.getUTCDay()),       // 1 -> 7
+          S: (date.getUTCDate() % 10 <= dates[language].suffix.length ? dates[language].suffix[date.getUTCDate() % 10 - 1] : ''),
+          // hour
+          a: (dates[language].meridiem.length === 2 ? dates[language].meridiem[date.getUTCHours() < 12 ? 0 : 1] : ''),
+          g: (date.getUTCHours() % 12 === 0 ? 12 : date.getUTCHours() % 12),
+          G: date.getUTCHours(),
+          // minute
+          i: date.getUTCMinutes(),
+          // second
+          s: date.getUTCSeconds()
+        };
+        val.m = (val.n < 10 ? '0' : '') + val.n;
+        val.d = (val.j < 10 ? '0' : '') + val.j;
+        val.A = val.a.toString().toUpperCase();
+        val.h = (val.g < 10 ? '0' : '') + val.g;
+        val.H = (val.G < 10 ? '0' : '') + val.G;
+        val.i = (val.i < 10 ? '0' : '') + val.i;
+        val.s = (val.s < 10 ? '0' : '') + val.s;
+      } else {
+        throw new Error('Invalid format type.');
+      }
+      var date = [],
+        seps = $.extend([], format.separators);
+      for (var i = 0, cnt = format.parts.length; i < cnt; i++) {
+        if (seps.length) {
+          date.push(seps.shift());
+        }
+        date.push(val[format.parts[i]]);
+      }
+      if (seps.length) {
+        date.push(seps.shift());
+      }
+      return date.join('');
+    },
+    convertViewMode:  function (viewMode) {
+      switch (viewMode) {
+        case 4:
+        case 'decade':
+          viewMode = 4;
+          break;
+        case 3:
+        case 'year':
+          viewMode = 3;
+          break;
+        case 2:
+        case 'month':
+          viewMode = 2;
+          break;
+        case 1:
+        case 'day':
+          viewMode = 1;
+          break;
+        case 0:
+        case 'hour':
+          viewMode = 0;
+          break;
+      }
+
+      return viewMode;
+    },
+    headTemplate: '<thead>' +
+                '<tr>' +
+                '<th class="prev"><i class="{iconType} {leftArrow}"/></th>' +
+                '<th colspan="5" class="switch"></th>' +
+                '<th class="next"><i class="{iconType} {rightArrow}"/></th>' +
+                '</tr>' +
+      '</thead>',
+    headTemplateV3: '<thead>' +
+                '<tr>' +
+                '<th class="prev"><span class="{iconType} {leftArrow}"></span> </th>' +
+                '<th colspan="5" class="switch"></th>' +
+                '<th class="next"><span class="{iconType} {rightArrow}"></span> </th>' +
+                '</tr>' +
+      '</thead>',
+    contTemplate: '<tbody><tr><td colspan="7"></td></tr></tbody>',
+    footTemplate: '<tfoot>' + 
+                    '<tr><th colspan="7" class="today"></th></tr>' +
+                    '<tr><th colspan="7" class="clear"></th></tr>' +
+                  '</tfoot>'
+  };
+  DPGlobal.template = '<div class="datetimepicker">' +
+    '<div class="datetimepicker-minutes">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-hours">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-days">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplate +
+    '<tbody></tbody>' +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-months">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-years">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplate +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '</div>';
+  DPGlobal.templateV3 = '<div class="datetimepicker">' +
+    '<div class="datetimepicker-minutes">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-hours">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-days">' +
+    '<table class=" table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    '<tbody></tbody>' +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-months">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '<div class="datetimepicker-years">' +
+    '<table class="table-condensed">' +
+    DPGlobal.headTemplateV3 +
+    DPGlobal.contTemplate +
+    DPGlobal.footTemplate +
+    '</table>' +
+    '</div>' +
+    '</div>';
+  $.fn.datetimepicker.DPGlobal = DPGlobal;
+
+  /* DATETIMEPICKER NO CONFLICT
+   * =================== */
+
+  $.fn.datetimepicker.noConflict = function () {
+    $.fn.datetimepicker = old;
+    return this;
+  };
+
+  /* DATETIMEPICKER DATA-API
+   * ================== */
+
+  $(document).on(
+    'focus.datetimepicker.data-api click.datetimepicker.data-api',
+    '[data-provide="datetimepicker"]',
+    function (e) {
+      var $this = $(this);
+      if ($this.data('datetimepicker')) return;
+      e.preventDefault();
+      // component click requires us to explicitly show it
+      $this.datetimepicker('show');
+    }
+  );
+  $(function () {
+    $('[data-provide="datetimepicker-inline"]').datetimepicker();
+  });
+
+}));
+/*
+ * Copyright 2018-2018 the original author or authors.
+ *
+ * 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.
+ *
+ * WebSite: http://bootstrap-viewer.leftso.com
+ */
+
+$.fn.bootstrapViewer = function (options) {
+    $(this).on('click', function () {
+        var opts = $.extend({}, $.fn.bootstrapViewer.defaults, options);
+        var viewer = $('<div class="modal fade bs-example-modal-lg text-center" id="bootstrapViewer" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" >\n' +
+            '          <div class="modal-dialog modal-lg" style="display: inline-block; width: auto;">\n' +
+            '            <div class="modal-content">\n' +
+            '             <img' +
+            '\t\t\t class="carousel-inner img-responsive img-rounded img-viewer" draggable="false"\n' +
+            '\t\t\t onclick="/*$(\'#bootstrapViewer\').modal(\'hide\');setTimeout(function(){$(\'#bootstrapViewer\').remove();},200);*/"\n' +
+            '\t\t\t onmouseover="this.style.cursor=\'move\';" \n' +
+            '\t\t\t onmouseout="this.style.cursor=\'default\'"  \n' +
+            '\t\t\t />\n' +
+            '            </div>\n' +
+            '          </div>\n' +
+            '        </div>');
+        $('body').append(viewer);
+        if ($(this).attr(opts.src)) {
+            $("#bootstrapViewer").find(".img-viewer").attr("src", $(this).attr(opts.src));
+            $("#bootstrapViewer").modal();
+        } else {
+            throw "图片不存在"
+        }
+        $('#bootstrapViewer').on('hidden.bs.modal', function(){
+          $('#bootstrapViewer').remove();
+        });
+
+        var $moveDiv = $('#bootstrapViewer .modal-dialog');
+        var isMove = false;
+        var div_x = $moveDiv.offset().left;
+        var div_y = $moveDiv.offset().top;
+
+        var mousedownFunc = function (e) {
+          if (isMove) {
+            var left = e.pageX - div_x;
+            var top = e.pageY - div_y;
+            if(left < 0){ left = 0}
+            if(top < 0){ top = 0}
+            $moveDiv.css({"left": left, "top":top});
+          }
+        }
+
+        $moveDiv.mousedown(function (e) {
+          $moveDiv.css({ left: $moveDiv[0].offsetLeft, top: $moveDiv[0].offsetTop, marginTop: 0, position: 'absolute' });
+
+          isMove = true;
+          div_x = e.pageX - $moveDiv.offset().left;
+          div_y = e.pageY - $moveDiv.offset().top;
+          $(document).mousemove(mousedownFunc);
+        }).mouseup(function () {
+          isMove = false;
+          $(document).unbind('mousemove', mousedownFunc);
+        });
+    })
+
+    $(this).on('mouseover', function () {
+        $(this).css('cursor', 'zoom-in');
+    })
+}
+$.fn.bootstrapViewer.defaults = {
+    src: 'src'
+}
+;
+/* Author：mingyuhisoft@163.com
+ * Github:https://github.com/imingyu/jquery.mloading
+ * Npm:npm install jquery.mloading.js
+ * Date：2016-7-4
+ */
+
+
+;(function (root, factory) {
+  'use strict';
+
+  if (typeof module === 'object' && typeof module.exports === 'object') {
+    factory(require('jquery'),root);
+  } if(typeof define ==="function"){
+    if(define.cmd){
+      define(function(require, exports, module){
+        var $ = require("jquery");
+        factory($,root);
+      });
+    }else{
+      define(["jquery"],function($){
+        factory($,root);
+      });
+    }
+  }else {
+    factory(root.jQuery,root);
+  }
+} (typeof window !=="undefined" ? window : this, function ($, root, undefined) {
+  'use strict';
+  if(!$){
+    $ = root.jQuery || null;
+  }
+  if(!$){
+    throw new TypeError("必须引入jquery库方可正常使用！");
+  }
+
+  var arraySlice = Array.prototype.slice,
+    comparison=function (obj1,obj2) {
+      var result=true;
+      for(var pro in obj1){
+        if(obj1[pro] !== obj2[obj1]){
+          result=true;
+          break;
+        }
+      }
+      return result;
+    }
+
+  function MLoading(dom,options) {
+    options=options||{};
+    this.dom=dom;
+    this.options=$.extend(true,{},MLoading.defaultOptions,options);
+    this.curtain=null;
+    this.render().show();
+  }
+  MLoading.prototype={
+    constructor:MLoading,
+    initElement:function () {
+      var dom=this.dom,
+        ops=this.options;
+      var curtainElement=dom.children(".mloading"),
+        bodyElement = curtainElement.children('.mloading-body'),
+        barElement = bodyElement.children('.mloading-bar'),
+        iconElement = barElement.children('.mloading-icon'),
+        textElement = barElement.find(".mloading-text");
+      if (curtainElement.length == 0) {
+        curtainElement = $('<div class="mloading"></div>');
+        dom.append(curtainElement);
+      }
+      if (bodyElement.length == 0) {
+        bodyElement = $('<div class="mloading-body"></div>');
+        curtainElement.append(bodyElement);
+      }
+      if (barElement.length == 0) {
+        barElement = $('<div class="mloading-bar"></div>');
+        bodyElement.append(barElement);
+      }
+      if (iconElement.length == 0) {
+        var _iconElement=document.createElement(ops.iconTag);
+        iconElement = $(_iconElement);
+        iconElement.addClass("mloading-icon");
+        barElement.append(iconElement);
+      }
+      if (textElement.length == 0) {
+        textElement = $('<span class="mloading-text"></span>');
+        barElement.append(textElement);
+      }
+
+      this.curtainElement=curtainElement;
+      this.bodyElement = bodyElement;
+      this.barElement = barElement;
+      this.iconElement = iconElement;
+      this.textElement = textElement;
+      return this;
+    },
+    render:function () {
+      var dom=this.dom,
+        ops=this.options;
+      this.initElement();
+      if(dom.is("html") || dom.is("body")){
+        this.curtainElement.addClass("mloading-full");
+      }else{
+        this.curtainElement.removeClass("mloading-full");
+
+        if(!dom.hasClass("mloading-container")){
+          dom.addClass("mloading-container");
+        }
+      }
+      if(ops.mask){
+        this.curtainElement.addClass("mloading-mask");
+      }else{
+        this.curtainElement.removeClass("mloading-mask");
+      }
+      if(ops.content!="" && typeof ops.content!="undefined"){
+        if(ops.html){
+          this.bodyElement.html(ops.content);
+        }else{
+          this.bodyElement.text(ops.content);
+        }
+      }else{
+        this.iconElement.attr("src",ops.icon);
+        if(ops.html){
+          this.textElement.html(ops.text);
+        }else{
+          this.textElement.text(ops.text);
+        }
+      }
+
+      return this;
+    },
+    setOptions:function (options) {
+      options=options||{};
+      var oldOptions = this.options;
+      this.options = $.extend(true,{},this.options,options);
+      if(!comparison(oldOptions,this.options)) this.render();
+    },
+    show:function () {
+      var dom=this.dom,
+        ops=this.options,
+        barElement=this.barElement;
+      this.curtainElement.addClass("active");
+      barElement.css({
+        "marginTop":"-"+barElement.outerHeight()/2+"px",
+        "marginLeft":"-"+barElement.outerWidth()/2+"px"
+      });
+
+      return this;
+    },
+    hide:function () {
+      var dom=this.dom,
+        ops=this.options;
+      this.curtainElement.removeClass("active");
+      if(!dom.is("html") && !dom.is("body")){
+        dom.removeClass("mloading-container");
+      }
+      return this;
+    },
+    destroy:function () {
+      var dom=this.dom,
+        ops=this.options;
+      this.curtainElement.remove();
+      if(!dom.is("html") && !dom.is("body")){
+        dom.removeClass("mloading-container");
+      }
+      dom.removeData(MLoading.dataKey);
+      return this;
+    }
+  };
+  MLoading.dataKey="MLoading";
+  MLoading.defaultOptions = {
+    text:"加载中...",
+    iconTag:"img",
+    icon:"data:image/gif;base64,R0lGODlhDwAPAKUAAEQ+PKSmpHx6fNTW1FxaXOzu7ExOTIyOjGRmZMTCxPz6/ERGROTi5Pz29JyanGxubMzKzIyKjGReXPT29FxWVGxmZExGROzq7ERCRLy6vISChNze3FxeXPTy9FROTJSSlMTGxPz+/OTm5JyenNTOzGxqbExKTAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQJBgAhACwAAAAADwAPAAAGd8CQcEgsChuTZMNIDFgsC1Nn9GEwDwDAoqMBWEDFiweA2YoiZevwA9BkDAUhW0MkADYhiEJYwJj2QhYGTBwAE0MUGGp5IR1+RBEAEUMVDg4AAkQMJhgfFyEIWRgDRSALABKgWQ+HRQwaCCEVC7R0TEITHbmtt0xBACH5BAkGACYALAAAAAAPAA8AhUQ+PKSmpHRydNTW1FxWVOzu7MTCxIyKjExKTOTi5LSytHx+fPz6/ERGROTe3GxqbNTS1JyWlFRSVKympNze3FxeXPT29MzKzFROTOzq7ISGhERCRHx6fNza3FxaXPTy9MTGxJSSlExOTOTm5LS2tISChPz+/ExGRJyenKyqrAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAZ6QJNQeIkUhsjkp+EhMZLITKgBAGigQgiiCtiAKJdkBgNYgDYLhmDjQIbKwgfF9C4hPYC5KSMsbBBIJyJYFQAWQwQbI0J8Jh8nDUgHAAcmDA+LKAAcSAkIEhYTAAEoGxsdSSAKIyJcGyRYJiQbVRwDsVkPXrhDDCQBSUEAIfkECQYAEAAsAAAAAA8ADwCFRD48pKKkdHZ01NLUXFpc7OrsTE5MlJKU9Pb03N7cREZExMbEhIKEbGpsXFZUVFZU/P78tLa0fH583NrcZGJk9PL0VE5MnJ6c/Pb05ObkTEZEREJErKqsfHp81NbUXF5c7O7slJaU5OLkzMrMjIaEdG5sVFJU/Pr8TEpMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABndAiHA4DICISCIllBQWQgSNY6NJJAcoAMCw0XaQBQtAYj0ANgcE0SwZlgSe04hI2FiFAyEFRdQYmh8AakIOJhgQHhVCFQoaRAsVGSQWihAXAF9EHFkNEBUXGxsTSBxaGx9dGxFJGKgKAAoSEydNIwoFg01DF7oQQQAh+QQJBgAYACwAAAAADwAPAIVEPjykoqR0cnTU0tRUUlSMiozs6uxMSkx8fnzc3txcXlyUlpT09vRcWlxMRkS0trR8enzc2txcVlSUkpRUTkyMhoTk5uScnpz8/vxEQkR8dnTU1tRUVlSMjoz08vRMTkyEgoTk4uRkYmSclpT8+vy8urwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGc0CMcEgsGo9Gw6LhkHRCmICFODgAAJ8M4FDJTIUGCgCRwIQKV+9wMiaWtIAvRqOACiMKwucjJzFIJEN+gEQiHAQcJUMeBROCBFcLRBcAEESQAB0GGB4XGRkbghwCnxkiWhkPRRMMCSAfABkIoUhCDLW4Q0EAIfkECQYAGQAsAAAAAA8ADwCFRD48pKKkdHJ01NLU7OrsXFZUjIqMvLq8TEpM3N7c9Pb0lJaUxMbErK6sfH58bGpsVFJUTEZE3Nrc9PL0XF5clJKUxMLEVE5M5Obk/P78nJ6ctLa0hIaEREJE1NbU7O7sXFpcjI6MvL68TE5M5OLk/Pr8nJqczM7MtLK0hIKEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABnPAjHBILBqPRsICFCmESMcBAgAYdQAIi9HzSCUyJEOnAx0GBqUSsQJwYFAZyTiFGZZEgHGlJKACQBIZEwJXVR8iYwANE0MTAVMNGSISHAAhRSUYC2pCJFMhH4IaEAdGDGMdFFcdG0cJKSNYDoFIQgqctblBADs=",
+    html:false,
+    content:"",//设置content后，text和icon设置将无效
+    mask:true//是否显示遮罩（半透明背景）
+  };
+
+  $.fn.mLoading=function (options) {
+    var ops={},
+      funName="",
+      funArgs=[];
+    if(typeof options==="object"){
+      ops = options;
+    }else if(typeof options ==="string"){
+      funName=options;
+      funArgs = arraySlice.call(arguments).splice(0,1);
+    }
+    return this.each(function (i,element) {
+      var dom = $(element),
+        plsInc=dom.data(MLoading.dataKey);
+      if(!plsInc){
+        plsInc=new MLoading(dom,ops);
+      }
+
+      if(funName){
+        var fun = plsInc[funName];
+        if(typeof fun==="function"){
+          fun.apply(plsInc,funArgs);
+        }
+      }
+    });
+  }
+}));
+/*!
+ * jquery-confirm v3.3.4 (http://craftpip.github.io/jquery-confirm/)
+ * Author: Boniface Pereira
+ * Website: www.craftpip.com
+ * Contact: hey@craftpip.com
+ *
+ * Copyright 2013-2019 jquery-confirm
+ * Licensed under MIT (https://github.com/craftpip/jquery-confirm/blob/master/LICENSE)
+ */
+
+(function(factory){if(typeof define==="function"&&define.amd){define(["jquery"],factory);}else{if(typeof module==="object"&&module.exports){module.exports=function(root,jQuery){if(jQuery===undefined){if(typeof window!=="undefined"){jQuery=require("jquery");}else{jQuery=require("jquery")(root);}}factory(jQuery);return jQuery;};}else{factory(jQuery);}}}(function($){var w=window;$.fn.confirm=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false};}$(this).each(function(){var $this=$(this);if($this.attr("jc-attached")){console.warn("jConfirm has already been attached to this element ",$this[0]);return;}$this.on("click",function(e){e.preventDefault();var jcOption=$.extend({},options);if($this.attr("data-title")){jcOption.title=$this.attr("data-title");}if($this.attr("data-content")){jcOption.content=$this.attr("data-content");}if(typeof jcOption.buttons==="undefined"){jcOption.buttons={};}jcOption["$target"]=$this;if($this.attr("href")&&Object.keys(jcOption.buttons).length===0){var buttons=$.extend(true,{},w.jconfirm.pluginDefaults.defaultButtons,(w.jconfirm.defaults||{}).defaultButtons||{});var firstBtn=Object.keys(buttons)[0];jcOption.buttons=buttons;jcOption.buttons[firstBtn].action=function(){location.href=$this.attr("href");};}jcOption.closeIcon=false;var instance=$.confirm(jcOption);});$this.attr("jc-attached",true);});return $(this);};$.confirm=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false};}var putDefaultButtons=!(options.buttons===false);if(typeof options.buttons!=="object"){options.buttons={};}if(Object.keys(options.buttons).length===0&&putDefaultButtons){var buttons=$.extend(true,{},w.jconfirm.pluginDefaults.defaultButtons,(w.jconfirm.defaults||{}).defaultButtons||{});options.buttons=buttons;}return w.jconfirm(options);};$.alert=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false};}var putDefaultButtons=!(options.buttons===false);if(typeof options.buttons!=="object"){options.buttons={};}if(Object.keys(options.buttons).length===0&&putDefaultButtons){var buttons=$.extend(true,{},w.jconfirm.pluginDefaults.defaultButtons,(w.jconfirm.defaults||{}).defaultButtons||{});var firstBtn=Object.keys(buttons)[0];options.buttons[firstBtn]=buttons[firstBtn];}return w.jconfirm(options);};$.dialog=function(options,option2){if(typeof options==="undefined"){options={};}if(typeof options==="string"){options={content:options,title:(option2)?option2:false,closeIcon:function(){}};}options.buttons={};if(typeof options.closeIcon==="undefined"){options.closeIcon=function(){};}options.confirmKeys=[13];return w.jconfirm(options);};w.jconfirm=function(options){if(typeof options==="undefined"){options={};}var pluginOptions=$.extend(true,{},w.jconfirm.pluginDefaults);if(w.jconfirm.defaults){pluginOptions=$.extend(true,pluginOptions,w.jconfirm.defaults);}pluginOptions=$.extend(true,{},pluginOptions,options);var instance=new w.Jconfirm(pluginOptions);w.jconfirm.instances.push(instance);return instance;};w.Jconfirm=function(options){$.extend(this,options);this._init();};w.Jconfirm.prototype={_init:function(){var that=this;if(!w.jconfirm.instances.length){w.jconfirm.lastFocused=$("body").find(":focus");}this._id=Math.round(Math.random()*99999);this.contentParsed=$(document.createElement("div"));if(!this.lazyOpen){setTimeout(function(){that.open();},0);}},_buildHTML:function(){var that=this;this._parseAnimation(this.animation,"o");this._parseAnimation(this.closeAnimation,"c");this._parseBgDismissAnimation(this.backgroundDismissAnimation);this._parseColumnClass(this.columnClass);this._parseTheme(this.theme);this._parseType(this.type);var template=$(this.template);template.find(".jconfirm-box").addClass(this.animationParsed).addClass(this.backgroundDismissAnimationParsed).addClass(this.typeParsed);if(this.typeAnimated){template.find(".jconfirm-box").addClass("jconfirm-type-animated");}if(this.useBootstrap){template.find(".jc-bs3-row").addClass(this.bootstrapClasses.row);template.find(".jc-bs3-row").addClass("justify-content-md-center justify-content-sm-center justify-content-xs-center justify-content-lg-center");template.find(".jconfirm-box-container").addClass(this.columnClassParsed);if(this.containerFluid){template.find(".jc-bs3-container").addClass(this.bootstrapClasses.containerFluid);}else{template.find(".jc-bs3-container").addClass(this.bootstrapClasses.container);}}else{template.find(".jconfirm-box").css("width",this.boxWidth);}if(this.titleClass){template.find(".jconfirm-title-c").addClass(this.titleClass);}template.addClass(this.themeParsed);var ariaLabel="jconfirm-box"+this._id;template.find(".jconfirm-box").attr("aria-labelledby",ariaLabel).attr("tabindex",-1);template.find(".jconfirm-content").attr("id",ariaLabel);if(this.bgOpacity!==null){template.find(".jconfirm-bg").css("opacity",this.bgOpacity);}if(this.rtl){template.addClass("jconfirm-rtl");}this.$el=template.appendTo(this.container);this.$jconfirmBoxContainer=this.$el.find(".jconfirm-box-container");this.$jconfirmBox=this.$body=this.$el.find(".jconfirm-box");this.$jconfirmBg=this.$el.find(".jconfirm-bg");this.$title=this.$el.find(".jconfirm-title");this.$titleContainer=this.$el.find(".jconfirm-title-c");this.$content=this.$el.find("div.jconfirm-content");this.$contentPane=this.$el.find(".jconfirm-content-pane");this.$icon=this.$el.find(".jconfirm-icon-c");this.$closeIcon=this.$el.find(".jconfirm-closeIcon");this.$holder=this.$el.find(".jconfirm-holder");this.$btnc=this.$el.find(".jconfirm-buttons");this.$scrollPane=this.$el.find(".jconfirm-scrollpane");that.setStartingPoint();this._contentReady=$.Deferred();this._modalReady=$.Deferred();this.$holder.css({"padding-top":this.offsetTop,"padding-bottom":this.offsetBottom,});this.setTitle();this.setIcon();this._setButtons();this._parseContent();this.initDraggable();if(this.isAjax){this.showLoading(false);}$.when(this._contentReady,this._modalReady).then(function(){if(that.isAjaxLoading){setTimeout(function(){that.isAjaxLoading=false;that.setContent();that.setTitle();that.setIcon();setTimeout(function(){that.hideLoading(false);that._updateContentMaxHeight();},100);if(typeof that.onContentReady==="function"){that.onContentReady();}},50);}else{that._updateContentMaxHeight();that.setTitle();that.setIcon();if(typeof that.onContentReady==="function"){that.onContentReady();}}if(that.autoClose){that._startCountDown();}}).then(function(){that._watchContent();});if(this.animation==="none"){this.animationSpeed=1;this.animationBounce=1;}this.$body.css(this._getCSS(this.animationSpeed,this.animationBounce));this.$contentPane.css(this._getCSS(this.animationSpeed,1));this.$jconfirmBg.css(this._getCSS(this.animationSpeed,1));this.$jconfirmBoxContainer.css(this._getCSS(this.animationSpeed,1));},_typePrefix:"jconfirm-type-",typeParsed:"",_parseType:function(type){this.typeParsed=this._typePrefix+type;},setType:function(type){var oldClass=this.typeParsed;this._parseType(type);this.$jconfirmBox.removeClass(oldClass).addClass(this.typeParsed);},themeParsed:"",_themePrefix:"jconfirm-",setTheme:function(theme){var previous=this.theme;this.theme=theme||this.theme;this._parseTheme(this.theme);if(previous){this.$el.removeClass(previous);}this.$el.addClass(this.themeParsed);this.theme=theme;},_parseTheme:function(theme){var that=this;theme=theme.split(",");$.each(theme,function(k,a){if(a.indexOf(that._themePrefix)===-1){theme[k]=that._themePrefix+$.trim(a);}});this.themeParsed=theme.join(" ").toLowerCase();},backgroundDismissAnimationParsed:"",_bgDismissPrefix:"jconfirm-hilight-",_parseBgDismissAnimation:function(bgDismissAnimation){var animation=bgDismissAnimation.split(",");var that=this;$.each(animation,function(k,a){if(a.indexOf(that._bgDismissPrefix)===-1){animation[k]=that._bgDismissPrefix+$.trim(a);}});this.backgroundDismissAnimationParsed=animation.join(" ").toLowerCase();},animationParsed:"",closeAnimationParsed:"",_animationPrefix:"jconfirm-animation-",setAnimation:function(animation){this.animation=animation||this.animation;this._parseAnimation(this.animation,"o");},_parseAnimation:function(animation,which){which=which||"o";var animations=animation.split(",");var that=this;$.each(animations,function(k,a){if(a.indexOf(that._animationPrefix)===-1){animations[k]=that._animationPrefix+$.trim(a);}});var a_string=animations.join(" ").toLowerCase();if(which==="o"){this.animationParsed=a_string;}else{this.closeAnimationParsed=a_string;}return a_string;},setCloseAnimation:function(closeAnimation){this.closeAnimation=closeAnimation||this.closeAnimation;this._parseAnimation(this.closeAnimation,"c");},setAnimationSpeed:function(speed){this.animationSpeed=speed||this.animationSpeed;},columnClassParsed:"",setColumnClass:function(colClass){if(!this.useBootstrap){console.warn("cannot set columnClass, useBootstrap is set to false");return;}this.columnClass=colClass||this.columnClass;this._parseColumnClass(this.columnClass);this.$jconfirmBoxContainer.addClass(this.columnClassParsed);},_updateContentMaxHeight:function(){var height=$(window).height()-(this.$jconfirmBox.outerHeight()-this.$contentPane.outerHeight())-(this.offsetTop+this.offsetBottom);this.$contentPane.css({"max-height":height+"px"});},setBoxWidth:function(width){if(this.useBootstrap){console.warn("cannot set boxWidth, useBootstrap is set to true");return;}this.boxWidth=width;this.$jconfirmBox.css("width",width);},_parseColumnClass:function(colClass){colClass=colClass.toLowerCase();var p;switch(colClass){case"xl":case"xlarge":p="col-md-12";break;case"l":case"large":p="col-md-8 col-md-offset-2";break;case"m":case"medium":p="col-md-6 col-md-offset-3";break;case"s":case"small":p="col-md-4 col-md-offset-4";break;case"xs":case"xsmall":p="col-md-2 col-md-offset-5";break;default:p=colClass;}this.columnClassParsed=p;},initDraggable:function(){var that=this;var $t=this.$titleContainer;this.resetDrag();if(this.draggable){$t.on("mousedown",function(e){$t.addClass("jconfirm-hand");that.mouseX=e.clientX;that.mouseY=e.clientY;that.isDrag=true;});$(window).on("mousemove."+this._id,function(e){if(that.isDrag){that.movingX=e.clientX-that.mouseX+that.initialX;that.movingY=e.clientY-that.mouseY+that.initialY;that.setDrag();}});$(window).on("mouseup."+this._id,function(){$t.removeClass("jconfirm-hand");if(that.isDrag){that.isDrag=false;that.initialX=that.movingX;that.initialY=that.movingY;}});}},resetDrag:function(){this.isDrag=false;this.initialX=0;this.initialY=0;this.movingX=0;this.movingY=0;this.mouseX=0;this.mouseY=0;this.$jconfirmBoxContainer.css("transform","translate("+0+"px, "+0+"px)");},setDrag:function(){if(!this.draggable){return;}this.alignMiddle=false;var boxWidth=this.$jconfirmBox.outerWidth();var boxHeight=this.$jconfirmBox.outerHeight();var windowWidth=$(window).width();var windowHeight=$(window).height();var that=this;var dragUpdate=1;if(that.movingX%dragUpdate===0||that.movingY%dragUpdate===0){if(that.dragWindowBorder){var leftDistance=(windowWidth/2)-boxWidth/2;var topDistance=(windowHeight/2)-boxHeight/2;topDistance-=that.dragWindowGap;leftDistance-=that.dragWindowGap;if(leftDistance+that.movingX<0){that.movingX=-leftDistance;}else{if(leftDistance-that.movingX<0){that.movingX=leftDistance;}}if(topDistance+that.movingY<0){that.movingY=-topDistance;}else{if(topDistance-that.movingY<0){that.movingY=topDistance;}}}that.$jconfirmBoxContainer.css("transform","translate("+that.movingX+"px, "+that.movingY+"px)");}},_scrollTop:function(){if(typeof pageYOffset!=="undefined"){return pageYOffset;}else{var B=document.body;var D=document.documentElement;D=(D.clientHeight)?D:B;return D.scrollTop;}},_watchContent:function(){var that=this;if(this._timer){clearInterval(this._timer);}var prevContentHeight=0;this._timer=setInterval(function(){if(that.smoothContent){var contentHeight=that.$content.outerHeight()||0;if(contentHeight!==prevContentHeight){prevContentHeight=contentHeight;}var wh=$(window).height();var total=that.offsetTop+that.offsetBottom+that.$jconfirmBox.height()-that.$contentPane.height()+that.$content.height();if(total<wh){that.$contentPane.addClass("no-scroll");}else{that.$contentPane.removeClass("no-scroll");}}},this.watchInterval);},_overflowClass:"jconfirm-overflow",_hilightAnimating:false,highlight:function(){this.hiLightModal();},hiLightModal:function(){var that=this;if(this._hilightAnimating){return;}that.$body.addClass("hilight");var duration=parseFloat(that.$body.css("animation-duration"))||2;this._hilightAnimating=true;setTimeout(function(){that._hilightAnimating=false;that.$body.removeClass("hilight");},duration*1000);},_bindEvents:function(){var that=this;this.boxClicked=false;this.$scrollPane.click(function(e){if(!that.boxClicked){var buttonName=false;var shouldClose=false;var str;if(typeof that.backgroundDismiss==="function"){str=that.backgroundDismiss();}else{str=that.backgroundDismiss;}if(typeof str==="string"&&typeof that.buttons[str]!=="undefined"){buttonName=str;shouldClose=false;}else{if(typeof str==="undefined"||!!(str)===true){shouldClose=true;}else{shouldClose=false;}}if(buttonName){var btnResponse=that.buttons[buttonName].action.apply(that);shouldClose=(typeof btnResponse==="undefined")||!!(btnResponse);}if(shouldClose){that.close();}else{that.hiLightModal();}}that.boxClicked=false;});this.$jconfirmBox.click(function(e){that.boxClicked=true;});var isKeyDown=false;$(window).on("jcKeyDown."+that._id,function(e){if(!isKeyDown){isKeyDown=true;}});$(window).on("keyup."+that._id,function(e){if(isKeyDown){that.reactOnKey(e);isKeyDown=false;}});$(window).on("resize."+this._id,function(){that._updateContentMaxHeight();setTimeout(function(){that.resetDrag();},100);});},_cubic_bezier:"0.36, 0.55, 0.19",_getCSS:function(speed,bounce){return{"-webkit-transition-duration":speed/1000+"s","transition-duration":speed/1000+"s","-webkit-transition-timing-function":"cubic-bezier("+this._cubic_bezier+", "+bounce+")","transition-timing-function":"cubic-bezier("+this._cubic_bezier+", "+bounce+")"};},_setButtons:function(){var that=this;var total_buttons=0;if(typeof this.buttons!=="object"){this.buttons={};}$.each(this.buttons,function(key,button){total_buttons+=1;if(typeof button==="function"){that.buttons[key]=button={action:button};}that.buttons[key].text=button.text||key;that.buttons[key].btnClass=button.btnClass||"btn-default";that.buttons[key].action=button.action||function(){};that.buttons[key].keys=button.keys||[];that.buttons[key].isHidden=button.isHidden||false;that.buttons[key].isDisabled=button.isDisabled||false;$.each(that.buttons[key].keys,function(i,a){that.buttons[key].keys[i]=a.toLowerCase();});var button_element=$('<button type="button" class="btn"></button>').html(that.buttons[key].text).addClass(that.buttons[key].btnClass).prop("disabled",that.buttons[key].isDisabled).css("display",that.buttons[key].isHidden?"none":"").click(function(e){e.preventDefault();var res=that.buttons[key].action.apply(that,[that.buttons[key]]);that.onAction.apply(that,[key,that.buttons[key]]);that._stopCountDown();if(typeof res==="undefined"||res){that.close();}});that.buttons[key].el=button_element;that.buttons[key].setText=function(text){button_element.html(text);};that.buttons[key].addClass=function(className){button_element.addClass(className);};that.buttons[key].removeClass=function(className){button_element.removeClass(className);};that.buttons[key].disable=function(){that.buttons[key].isDisabled=true;button_element.prop("disabled",true);};that.buttons[key].enable=function(){that.buttons[key].isDisabled=false;button_element.prop("disabled",false);};that.buttons[key].show=function(){that.buttons[key].isHidden=false;button_element.css("display","");};that.buttons[key].hide=function(){that.buttons[key].isHidden=true;button_element.css("display","none");};that["$_"+key]=that["$$"+key]=button_element;that.$btnc.append(button_element);});if(total_buttons===0){this.$btnc.hide();}if(this.closeIcon===null&&total_buttons===0){this.closeIcon=true;}if(this.closeIcon){if(this.closeIconClass){var closeHtml='<i class="'+this.closeIconClass+'"></i>';this.$closeIcon.html(closeHtml);}this.$closeIcon.click(function(e){e.preventDefault();var buttonName=false;var shouldClose=false;var str;if(typeof that.closeIcon==="function"){str=that.closeIcon();}else{str=that.closeIcon;}if(typeof str==="string"&&typeof that.buttons[str]!=="undefined"){buttonName=str;shouldClose=false;}else{if(typeof str==="undefined"||!!(str)===true){shouldClose=true;}else{shouldClose=false;}}if(buttonName){var btnResponse=that.buttons[buttonName].action.apply(that);shouldClose=(typeof btnResponse==="undefined")||!!(btnResponse);}if(shouldClose){that.close();}});this.$closeIcon.show();}else{this.$closeIcon.hide();}},setTitle:function(string,force){force=force||false;if(typeof string!=="undefined"){if(typeof string==="string"){this.title=string;}else{if(typeof string==="function"){if(typeof string.promise==="function"){console.error("Promise was returned from title function, this is not supported.");}var response=string();if(typeof response==="string"){this.title=response;}else{this.title=false;}}else{this.title=false;}}}if(this.isAjaxLoading&&!force){return;}this.$title.html(this.title||"");this.updateTitleContainer();},setIcon:function(iconClass,force){force=force||false;if(typeof iconClass!=="undefined"){if(typeof iconClass==="string"){this.icon=iconClass;}else{if(typeof iconClass==="function"){var response=iconClass();if(typeof response==="string"){this.icon=response;}else{this.icon=false;}}else{this.icon=false;}}}if(this.isAjaxLoading&&!force){return;}this.$icon.html(this.icon?'<i class="'+this.icon+'"></i>':"");this.updateTitleContainer();},updateTitleContainer:function(){if(!this.title&&!this.icon){this.$titleContainer.hide();}else{this.$titleContainer.show();}},setContentPrepend:function(content,force){if(!content){return;}this.contentParsed.prepend(content);},setContentAppend:function(content){if(!content){return;}this.contentParsed.append(content);},setContent:function(content,force){force=!!force;var that=this;if(content){this.contentParsed.html("").append(content);}if(this.isAjaxLoading&&!force){return;}this.$content.html("");this.$content.append(this.contentParsed);setTimeout(function(){that.$body.find("input[autofocus]:visible:first").focus();},100);},loadingSpinner:false,showLoading:function(disableButtons){this.loadingSpinner=true;this.$jconfirmBox.addClass("loading");if(disableButtons){this.$btnc.find("button").prop("disabled",true);}},hideLoading:function(enableButtons){this.loadingSpinner=false;this.$jconfirmBox.removeClass("loading");if(enableButtons){this.$btnc.find("button").prop("disabled",false);}},ajaxResponse:false,contentParsed:"",isAjax:false,isAjaxLoading:false,_parseContent:function(){var that=this;var e="&nbsp;";if(typeof this.content==="function"){var res=this.content.apply(this);if(typeof res==="string"){this.content=res;}else{if(typeof res==="object"&&typeof res.always==="function"){this.isAjax=true;this.isAjaxLoading=true;res.always(function(data,status,xhr){that.ajaxResponse={data:data,status:status,xhr:xhr};that._contentReady.resolve(data,status,xhr);if(typeof that.contentLoaded==="function"){that.contentLoaded(data,status,xhr);}});this.content=e;}else{this.content=e;}}}if(typeof this.content==="string"&&this.content.substr(0,4).toLowerCase()==="url:"){this.isAjax=true;this.isAjaxLoading=true;var u=this.content.substring(4,this.content.length);$.get(u).done(function(html){that.contentParsed.html(html);}).always(function(data,status,xhr){that.ajaxResponse={data:data,status:status,xhr:xhr};that._contentReady.resolve(data,status,xhr);if(typeof that.contentLoaded==="function"){that.contentLoaded(data,status,xhr);}});}if(!this.content){this.content=e;}if(!this.isAjax){this.contentParsed.html(this.content);this.setContent();that._contentReady.resolve();}},_stopCountDown:function(){clearInterval(this.autoCloseInterval);if(this.$cd){this.$cd.remove();}},_startCountDown:function(){var that=this;var opt=this.autoClose.split("|");if(opt.length!==2){console.error("Invalid option for autoClose. example 'close|10000'");return false;}var button_key=opt[0];var time=parseInt(opt[1]);if(typeof this.buttons[button_key]==="undefined"){console.error("Invalid button key '"+button_key+"' for autoClose");return false;}var seconds=Math.ceil(time/1000);this.$cd=$('<span class="countdown"> ('+seconds+")</span>").appendTo(this["$_"+button_key]);this.autoCloseInterval=setInterval(function(){that.$cd.html(" ("+(seconds-=1)+") ");if(seconds<=0){that["$$"+button_key].trigger("click");that._stopCountDown();}},1000);},_getKey:function(key){switch(key){case 192:return"tilde";case 13:return"enter";case 16:return"shift";case 9:return"tab";case 20:return"capslock";case 17:return"ctrl";case 91:return"win";case 18:return"alt";case 27:return"esc";case 32:return"space";}var initial=String.fromCharCode(key);if(/^[A-z0-9]+$/.test(initial)){return initial.toLowerCase();}else{return false;}},reactOnKey:function(e){var that=this;var a=$(".jconfirm");if(a.eq(a.length-1)[0]!==this.$el[0]){return false;}var key=e.which;if(this.$content.find(":input").is(":focus")&&/13|32/.test(key)){return false;}var keyChar=this._getKey(key);if(keyChar==="esc"&&this.escapeKey){if(this.escapeKey===true){this.$scrollPane.trigger("click");}else{if(typeof this.escapeKey==="string"||typeof this.escapeKey==="function"){var buttonKey;if(typeof this.escapeKey==="function"){buttonKey=this.escapeKey();}else{buttonKey=this.escapeKey;}if(buttonKey){if(typeof this.buttons[buttonKey]==="undefined"){console.warn("Invalid escapeKey, no buttons found with key "+buttonKey);}else{this["$_"+buttonKey].trigger("click");}}}}}$.each(this.buttons,function(key,button){if(button.keys.indexOf(keyChar)!==-1){that["$_"+key].trigger("click");}});},setDialogCenter:function(){console.info("setDialogCenter is deprecated, dialogs are centered with CSS3 tables");},_unwatchContent:function(){clearInterval(this._timer);},close:function(onClosePayload){var that=this;if(typeof this.onClose==="function"){this.onClose(onClosePayload);}this._unwatchContent();$(window).unbind("resize."+this._id);$(window).unbind("keyup."+this._id);$(window).unbind("jcKeyDown."+this._id);if(this.draggable){$(window).unbind("mousemove."+this._id);$(window).unbind("mouseup."+this._id);this.$titleContainer.unbind("mousedown");}that.$el.removeClass(that.loadedClass);$("body").removeClass("jconfirm-no-scroll-"+that._id);that.$jconfirmBoxContainer.removeClass("jconfirm-no-transition");setTimeout(function(){that.$body.addClass(that.closeAnimationParsed);that.$jconfirmBg.addClass("jconfirm-bg-h");var closeTimer=(that.closeAnimation==="none")?1:that.animationSpeed;setTimeout(function(){that.$el.remove();var l=w.jconfirm.instances;var i=w.jconfirm.instances.length-1;for(i;i>=0;i--){if(w.jconfirm.instances[i]._id===that._id){w.jconfirm.instances.splice(i,1);}}if(!w.jconfirm.instances.length){if(that.scrollToPreviousElement&&w.jconfirm.lastFocused&&w.jconfirm.lastFocused.length&&$.contains(document,w.jconfirm.lastFocused[0])){var $lf=w.jconfirm.lastFocused;if(that.scrollToPreviousElementAnimate){var st=$(window).scrollTop();var ot=w.jconfirm.lastFocused.offset().top;var wh=$(window).height();if(!(ot>st&&ot<(st+wh))){var scrollTo=(ot-Math.round((wh/3)));$("html, body").animate({scrollTop:scrollTo},that.animationSpeed,"swing",function(){$lf.focus();});}else{$lf.focus();}}else{$lf.focus();}w.jconfirm.lastFocused=false;}}if(typeof that.onDestroy==="function"){that.onDestroy();}},closeTimer*0.4);},50);return true;},open:function(){if(this.isOpen()){return false;}this._buildHTML();this._bindEvents();this._open();return true;},setStartingPoint:function(){var el=false;if(this.animateFromElement!==true&&this.animateFromElement){el=this.animateFromElement;w.jconfirm.lastClicked=false;}else{if(w.jconfirm.lastClicked&&this.animateFromElement===true){el=w.jconfirm.lastClicked;w.jconfirm.lastClicked=false;}else{return false;}}if(!el){return false;}var offset=el.offset();var iTop=el.outerHeight()/2;var iLeft=el.outerWidth()/2;iTop-=this.$jconfirmBox.outerHeight()/2;iLeft-=this.$jconfirmBox.outerWidth()/2;var sourceTop=offset.top+iTop;sourceTop=sourceTop-this._scrollTop();var sourceLeft=offset.left+iLeft;var wh=$(window).height()/2;var ww=$(window).width()/2;var targetH=wh-this.$jconfirmBox.outerHeight()/2;var targetW=ww-this.$jconfirmBox.outerWidth()/2;sourceTop-=targetH;sourceLeft-=targetW;if(Math.abs(sourceTop)>wh||Math.abs(sourceLeft)>ww){return false;}this.$jconfirmBoxContainer.css("transform","translate("+sourceLeft+"px, "+sourceTop+"px)");},_open:function(){var that=this;if(typeof that.onOpenBefore==="function"){that.onOpenBefore();}this.$body.removeClass(this.animationParsed);this.$jconfirmBg.removeClass("jconfirm-bg-h");this.$body.focus();that.$jconfirmBoxContainer.css("transform","translate("+0+"px, "+0+"px)");setTimeout(function(){that.$body.css(that._getCSS(that.animationSpeed,1));that.$body.css({"transition-property":that.$body.css("transition-property")+", margin"});that.$jconfirmBoxContainer.addClass("jconfirm-no-transition");that._modalReady.resolve();if(typeof that.onOpen==="function"){that.onOpen();}that.$el.addClass(that.loadedClass);},this.animationSpeed);},loadedClass:"jconfirm-open",isClosed:function(){return !this.$el||this.$el.parent().length===0;},isOpen:function(){return !this.isClosed();},toggle:function(){if(!this.isOpen()){this.open();}else{this.close();}}};w.jconfirm.instances=[];w.jconfirm.lastFocused=false;w.jconfirm.pluginDefaults={template:'<div class="jconfirm"><div class="jconfirm-bg jconfirm-bg-h"></div><div class="jconfirm-scrollpane"><div class="jconfirm-row"><div class="jconfirm-cell"><div class="jconfirm-holder"><div class="jc-bs3-container"><div class="jc-bs3-row"><div class="jconfirm-box-container jconfirm-animated"><div class="jconfirm-box" role="dialog" aria-labelledby="labelled" tabindex="-1"><div class="jconfirm-closeIcon">&times;</div><div class="jconfirm-title-c"><span class="jconfirm-icon-c"></span><span class="jconfirm-title"></span></div><div class="jconfirm-content-pane"><div class="jconfirm-content"></div></div><div class="jconfirm-buttons"></div><div class="jconfirm-clear"></div></div></div></div></div></div></div></div></div></div>',title:"Hello",titleClass:"",type:"default",typeAnimated:true,draggable:true,dragWindowGap:15,dragWindowBorder:true,animateFromElement:true,alignMiddle:true,smoothContent:true,content:"Are you sure to continue?",buttons:{},defaultButtons:{ok:{action:function(){}},close:{action:function(){}}},contentLoaded:function(){},icon:"",lazyOpen:false,bgOpacity:null,theme:"light",animation:"scale",closeAnimation:"scale",animationSpeed:400,animationBounce:1,escapeKey:true,rtl:false,container:"body",containerFluid:false,backgroundDismiss:false,backgroundDismissAnimation:"shake",autoClose:false,closeIcon:null,closeIconClass:false,watchInterval:100,columnClass:"col-md-4 col-md-offset-4 col-sm-6 col-sm-offset-3 col-xs-10 col-xs-offset-1",boxWidth:"50%",scrollToPreviousElement:true,scrollToPreviousElementAnimate:true,useBootstrap:true,offsetTop:40,offsetBottom:40,bootstrapClasses:{container:"container",containerFluid:"container-fluid",row:"row"},onContentReady:function(){},onOpenBefore:function(){},onOpen:function(){},onClose:function(){},onDestroy:function(){},onAction:function(){}};var keyDown=false;$(window).on("keydown",function(e){if(!keyDown){var $target=$(e.target);var pass=false;if($target.closest(".jconfirm-box").length){pass=true;}if(pass){$(window).trigger("jcKeyDown");}keyDown=true;}});$(window).on("keyup",function(){keyDown=false;});w.jconfirm.lastClicked=false;$(document).on("mousedown","button, a, [jc-source]",function(){w.jconfirm.lastClicked=$(this);});}));
+function createMDEditor(element, opts){
+  var defaults = {
+    height: 600,
+    path: '/editormd/lib/',
+    syncScrolling: "single",
+    tex: true,
+    tocm: true,
+    emoji: true,
+    taskList: true,
+    codeFold: true,
+    searchReplace: true,
+    htmlDecode: "style,script,iframe",
+    sequenceDiagram: true,
+    autoFocus: false,
+    toolbarIcons: function () {
+      // Or return editormd.toolbarModes[name]; // full, simple, mini
+      // Using "||" set icons align right.
+      return ["bold", "italic", "|", "list-ul", "list-ol", "|", "code", "code-block", "|", "image", "table", '|', "watch", "clear"]
+    },
+    //这个配置在simple.html中并没有，但是为了能够提交表单，使用这个配置可以让构造出来的HTML代码直接在第二个隐藏的textarea域中，方便post提交表单。
+    saveHTMLToTextarea: true,
+    dialogMaskOpacity: 0.6,
+    imageUpload: true,
+    imageFormats: ["jpg", "jpeg", "gif", "png", "bmp", "webp", "JPG", "JPEG", "GIF", "PNG", "BMP", "WEBP"],
+    imageUploadURL: '/api/attachments.json'
+  }
+  var options = $.extend({}, defaults, opts);
+
+  return editormd(element, options);
+}
+
+function ajaxErrorNotifyHandler(res) {
+  var message = '';
+  if(res.status !== 500){
+    message = res.responseJSON.message;
+  } else {
+    message = '系统错误';
+  }
+  return $.notify({message: message}, {type: 'danger'});
+}
+
+function resetFileInputFunc(file){
+  file.after(file.clone().val(""));
+  file.remove();
+}
+
+function customConfirm(opts){
+  var okCallback = opts.ok;
+  var cancelCallback = opts.cancel;
+
+  var defaultOpts = {
+    title: '提示',
+    buttons: {
+      ok: {
+        text: '确认',
+        btnClass: 'btn btn-primary',
+        action: okCallback
+      },
+      cancel: {
+        text: '取消',
+        btnClass: 'btn btn-secondary',
+        action: cancelCallback
+      },
+    }
+  }
+  return $.confirm($.extend({}, defaultOpts, opts))
+}
+
+function customLoading(opts) {
+  var loading;
+  var defaultOpts = {
+    content: opts.ajax,
+    contentLoaded: function(){
+      setTimeout(function(){
+        loading.close()
+      }, 200);
+    }
+  }
+  loading = $.confirm($.extend({}, defaultOpts, opts));
+  return loading;
+}
+
+function show_success_flash(message){
+  $.notify({
+		message: message || '操作成功'
+  },{
+    type: 'success'
+  });
+}
+
+function showSuccessFlash(message){
+  $.notify({
+		message: message || '操作成功'
+  },{
+    type: 'success'
+  });
+}
+
+function showErrorNotify(message){
+  $.notify({
+    message: message || '操作失败'
+  },{
+    type: 'danger'
+  });
+}
+;
+(function (global, factory) {
+	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+	typeof define === 'function' && define.amd ? define(['exports'], factory) :
+	(factory((global.echarts = {})));
+}(this, (function (exports) { 'use strict';
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// (1) The code `if (__DEV__) ...` can be removed by build tool.
+// (2) If intend to use `__DEV__`, this module should be imported. Use a global
+// variable `__DEV__` may cause that miss the declaration (see #6535), or the
+// declaration is behind of the using position (for example in `Model.extent`,
+// And tools like rollup can not analysis the dependency if not import).
+
+var dev;
+
+// In browser
+if (typeof window !== 'undefined') {
+    dev = window.__DEV__;
+}
+// In node
+else if (typeof global !== 'undefined') {
+    dev = global.__DEV__;
+}
+
+if (typeof dev === 'undefined') {
+    dev = true;
+}
+
+var __DEV__ = dev;
+
+/**
+ * zrender: 生成唯一id
+ *
+ * @author errorrik (errorrik@gmail.com)
+ */
+
+var idStart = 0x0907;
+
+var guid = function () {
+    return idStart++;
+};
+
+/**
+ * echarts设备环境识别
+ *
+ * @desc echarts基于Canvas，纯Javascript图表库，提供直观，生动，可交互，可个性化定制的数据统计图表。
+ * @author firede[firede@firede.us]
+ * @desc thanks zepto.
+ */
+
+var env = {};
+
+if (typeof wx === 'object' && typeof wx.getSystemInfoSync === 'function') {
+    // In Weixin Application
+    env = {
+        browser: {},
+        os: {},
+        node: false,
+        wxa: true, // Weixin Application
+        canvasSupported: true,
+        svgSupported: false,
+        touchEventsSupported: true
+    };
+}
+else if (typeof document === 'undefined' && typeof self !== 'undefined') {
+    // In worker
+    env = {
+        browser: {},
+        os: {},
+        node: false,
+        worker: true,
+        canvasSupported: true
+    };
+}
+else if (typeof navigator === 'undefined') {
+    // In node
+    env = {
+        browser: {},
+        os: {},
+        node: true,
+        worker: false,
+        // Assume canvas is supported
+        canvasSupported: true,
+        svgSupported: true
+    };
+}
+else {
+    env = detect(navigator.userAgent);
+}
+
+var env$1 = env;
+
+// Zepto.js
+// (c) 2010-2013 Thomas Fuchs
+// Zepto.js may be freely distributed under the MIT license.
+
+function detect(ua) {
+    var os = {};
+    var browser = {};
+    // var webkit = ua.match(/Web[kK]it[\/]{0,1}([\d.]+)/);
+    // var android = ua.match(/(Android);?[\s\/]+([\d.]+)?/);
+    // var ipad = ua.match(/(iPad).*OS\s([\d_]+)/);
+    // var ipod = ua.match(/(iPod)(.*OS\s([\d_]+))?/);
+    // var iphone = !ipad && ua.match(/(iPhone\sOS)\s([\d_]+)/);
+    // var webos = ua.match(/(webOS|hpwOS)[\s\/]([\d.]+)/);
+    // var touchpad = webos && ua.match(/TouchPad/);
+    // var kindle = ua.match(/Kindle\/([\d.]+)/);
+    // var silk = ua.match(/Silk\/([\d._]+)/);
+    // var blackberry = ua.match(/(BlackBerry).*Version\/([\d.]+)/);
+    // var bb10 = ua.match(/(BB10).*Version\/([\d.]+)/);
+    // var rimtabletos = ua.match(/(RIM\sTablet\sOS)\s([\d.]+)/);
+    // var playbook = ua.match(/PlayBook/);
+    // var chrome = ua.match(/Chrome\/([\d.]+)/) || ua.match(/CriOS\/([\d.]+)/);
+    var firefox = ua.match(/Firefox\/([\d.]+)/);
+    // var safari = webkit && ua.match(/Mobile\//) && !chrome;
+    // var webview = ua.match(/(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/) && !chrome;
+    var ie = ua.match(/MSIE\s([\d.]+)/)
+        // IE 11 Trident/7.0; rv:11.0
+        || ua.match(/Trident\/.+?rv:(([\d.]+))/);
+    var edge = ua.match(/Edge\/([\d.]+)/); // IE 12 and 12+
+
+    var weChat = (/micromessenger/i).test(ua);
+
+    // Todo: clean this up with a better OS/browser seperation:
+    // - discern (more) between multiple browsers on android
+    // - decide if kindle fire in silk mode is android or not
+    // - Firefox on Android doesn't specify the Android version
+    // - possibly devide in os, device and browser hashes
+
+    // if (browser.webkit = !!webkit) browser.version = webkit[1];
+
+    // if (android) os.android = true, os.version = android[2];
+    // if (iphone && !ipod) os.ios = os.iphone = true, os.version = iphone[2].replace(/_/g, '.');
+    // if (ipad) os.ios = os.ipad = true, os.version = ipad[2].replace(/_/g, '.');
+    // if (ipod) os.ios = os.ipod = true, os.version = ipod[3] ? ipod[3].replace(/_/g, '.') : null;
+    // if (webos) os.webos = true, os.version = webos[2];
+    // if (touchpad) os.touchpad = true;
+    // if (blackberry) os.blackberry = true, os.version = blackberry[2];
+    // if (bb10) os.bb10 = true, os.version = bb10[2];
+    // if (rimtabletos) os.rimtabletos = true, os.version = rimtabletos[2];
+    // if (playbook) browser.playbook = true;
+    // if (kindle) os.kindle = true, os.version = kindle[1];
+    // if (silk) browser.silk = true, browser.version = silk[1];
+    // if (!silk && os.android && ua.match(/Kindle Fire/)) browser.silk = true;
+    // if (chrome) browser.chrome = true, browser.version = chrome[1];
+    if (firefox) {
+        browser.firefox = true;
+        browser.version = firefox[1];
+    }
+    // if (safari && (ua.match(/Safari/) || !!os.ios)) browser.safari = true;
+    // if (webview) browser.webview = true;
+
+    if (ie) {
+        browser.ie = true;
+        browser.version = ie[1];
+    }
+
+    if (edge) {
+        browser.edge = true;
+        browser.version = edge[1];
+    }
+
+    // It is difficult to detect WeChat in Win Phone precisely, because ua can
+    // not be set on win phone. So we do not consider Win Phone.
+    if (weChat) {
+        browser.weChat = true;
+    }
+
+    // os.tablet = !!(ipad || playbook || (android && !ua.match(/Mobile/)) ||
+    //     (firefox && ua.match(/Tablet/)) || (ie && !ua.match(/Phone/) && ua.match(/Touch/)));
+    // os.phone  = !!(!os.tablet && !os.ipod && (android || iphone || webos ||
+    //     (chrome && ua.match(/Android/)) || (chrome && ua.match(/CriOS\/([\d.]+)/)) ||
+    //     (firefox && ua.match(/Mobile/)) || (ie && ua.match(/Touch/))));
+
+    return {
+        browser: browser,
+        os: os,
+        node: false,
+        // 原生canvas支持，改极端点了
+        // canvasSupported : !(browser.ie && parseFloat(browser.version) < 9)
+        canvasSupported: !!document.createElement('canvas').getContext,
+        svgSupported: typeof SVGRect !== 'undefined',
+        // works on most browsers
+        // IE10/11 does not support touch event, and MS Edge supports them but not by
+        // default, so we dont check navigator.maxTouchPoints for them here.
+        touchEventsSupported: 'ontouchstart' in window && !browser.ie && !browser.edge,
+        // <http://caniuse.com/#search=pointer%20event>.
+        pointerEventsSupported: 'onpointerdown' in window
+            // Firefox supports pointer but not by default, only MS browsers are reliable on pointer
+            // events currently. So we dont use that on other browsers unless tested sufficiently.
+            // Although IE 10 supports pointer event, it use old style and is different from the
+            // standard. So we exclude that. (IE 10 is hardly used on touch device)
+            && (browser.edge || (browser.ie && browser.version >= 11))
+        // passiveSupported: detectPassiveSupport()
+    };
+}
+
+// See https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md#feature-detection
+// function detectPassiveSupport() {
+//     // Test via a getter in the options object to see if the passive property is accessed
+//     var supportsPassive = false;
+//     try {
+//         var opts = Object.defineProperty({}, 'passive', {
+//             get: function() {
+//                 supportsPassive = true;
+//             }
+//         });
+//         window.addEventListener('testPassive', function() {}, opts);
+//     } catch (e) {
+//     }
+//     return supportsPassive;
+// }
+
+/**
+ * @module zrender/core/util
+ */
+
+// 用于处理merge时无法遍历Date等对象的问题
+var BUILTIN_OBJECT = {
+    '[object Function]': 1,
+    '[object RegExp]': 1,
+    '[object Date]': 1,
+    '[object Error]': 1,
+    '[object CanvasGradient]': 1,
+    '[object CanvasPattern]': 1,
+    // For node-canvas
+    '[object Image]': 1,
+    '[object Canvas]': 1
+};
+
+var TYPED_ARRAY = {
+    '[object Int8Array]': 1,
+    '[object Uint8Array]': 1,
+    '[object Uint8ClampedArray]': 1,
+    '[object Int16Array]': 1,
+    '[object Uint16Array]': 1,
+    '[object Int32Array]': 1,
+    '[object Uint32Array]': 1,
+    '[object Float32Array]': 1,
+    '[object Float64Array]': 1
+};
+
+var objToString = Object.prototype.toString;
+
+var arrayProto = Array.prototype;
+var nativeForEach = arrayProto.forEach;
+var nativeFilter = arrayProto.filter;
+var nativeSlice = arrayProto.slice;
+var nativeMap = arrayProto.map;
+var nativeReduce = arrayProto.reduce;
+
+// Avoid assign to an exported variable, for transforming to cjs.
+var methods = {};
+
+function $override(name, fn) {
+    // Clear ctx instance for different environment
+    if (name === 'createCanvas') {
+        _ctx = null;
+    }
+
+    methods[name] = fn;
+}
+
+/**
+ * Those data types can be cloned:
+ *     Plain object, Array, TypedArray, number, string, null, undefined.
+ * Those data types will be assgined using the orginal data:
+ *     BUILTIN_OBJECT
+ * Instance of user defined class will be cloned to a plain object, without
+ * properties in prototype.
+ * Other data types is not supported (not sure what will happen).
+ *
+ * Caution: do not support clone Date, for performance consideration.
+ * (There might be a large number of date in `series.data`).
+ * So date should not be modified in and out of echarts.
+ *
+ * @param {*} source
+ * @return {*} new
+ */
+function clone(source) {
+    if (source == null || typeof source != 'object') {
+        return source;
+    }
+
+    var result = source;
+    var typeStr = objToString.call(source);
+
+    if (typeStr === '[object Array]') {
+        if (!isPrimitive(source)) {
+            result = [];
+            for (var i = 0, len = source.length; i < len; i++) {
+                result[i] = clone(source[i]);
+            }
+        }
+    }
+    else if (TYPED_ARRAY[typeStr]) {
+        if (!isPrimitive(source)) {
+            var Ctor = source.constructor;
+            if (source.constructor.from) {
+                result = Ctor.from(source);
+            }
+            else {
+                result = new Ctor(source.length);
+                for (var i = 0, len = source.length; i < len; i++) {
+                    result[i] = clone(source[i]);
+                }
+            }
+        }
+    }
+    else if (!BUILTIN_OBJECT[typeStr] && !isPrimitive(source) && !isDom(source)) {
+        result = {};
+        for (var key in source) {
+            if (source.hasOwnProperty(key)) {
+                result[key] = clone(source[key]);
+            }
+        }
+    }
+
+    return result;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} target
+ * @param {*} source
+ * @param {boolean} [overwrite=false]
+ */
+function merge(target, source, overwrite) {
+    // We should escapse that source is string
+    // and enter for ... in ...
+    if (!isObject$1(source) || !isObject$1(target)) {
+        return overwrite ? clone(source) : target;
+    }
+
+    for (var key in source) {
+        if (source.hasOwnProperty(key)) {
+            var targetProp = target[key];
+            var sourceProp = source[key];
+
+            if (isObject$1(sourceProp)
+                && isObject$1(targetProp)
+                && !isArray(sourceProp)
+                && !isArray(targetProp)
+                && !isDom(sourceProp)
+                && !isDom(targetProp)
+                && !isBuiltInObject(sourceProp)
+                && !isBuiltInObject(targetProp)
+                && !isPrimitive(sourceProp)
+                && !isPrimitive(targetProp)
+            ) {
+                // 如果需要递归覆盖，就递归调用merge
+                merge(targetProp, sourceProp, overwrite);
+            }
+            else if (overwrite || !(key in target)) {
+                // 否则只处理overwrite为true，或者在目标对象中没有此属性的情况
+                // NOTE，在 target[key] 不存在的时候也是直接覆盖
+                target[key] = clone(source[key], true);
+            }
+        }
+    }
+
+    return target;
+}
+
+/**
+ * @param {Array} targetAndSources The first item is target, and the rests are source.
+ * @param {boolean} [overwrite=false]
+ * @return {*} target
+ */
+function mergeAll(targetAndSources, overwrite) {
+    var result = targetAndSources[0];
+    for (var i = 1, len = targetAndSources.length; i < len; i++) {
+        result = merge(result, targetAndSources[i], overwrite);
+    }
+    return result;
+}
+
+/**
+ * @param {*} target
+ * @param {*} source
+ * @memberOf module:zrender/core/util
+ */
+function extend(target, source) {
+    for (var key in source) {
+        if (source.hasOwnProperty(key)) {
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+
+/**
+ * @param {*} target
+ * @param {*} source
+ * @param {boolean} [overlay=false]
+ * @memberOf module:zrender/core/util
+ */
+function defaults(target, source, overlay) {
+    for (var key in source) {
+        if (source.hasOwnProperty(key)
+            && (overlay ? source[key] != null : target[key] == null)
+        ) {
+            target[key] = source[key];
+        }
+    }
+    return target;
+}
+
+var createCanvas = function () {
+    return methods.createCanvas();
+};
+
+methods.createCanvas = function () {
+    return document.createElement('canvas');
+};
+
+// FIXME
+var _ctx;
+
+function getContext() {
+    if (!_ctx) {
+        // Use util.createCanvas instead of createCanvas
+        // because createCanvas may be overwritten in different environment
+        _ctx = createCanvas().getContext('2d');
+    }
+    return _ctx;
+}
+
+/**
+ * 查询数组中元素的index
+ * @memberOf module:zrender/core/util
+ */
+function indexOf(array, value) {
+    if (array) {
+        if (array.indexOf) {
+            return array.indexOf(value);
+        }
+        for (var i = 0, len = array.length; i < len; i++) {
+            if (array[i] === value) {
+                return i;
+            }
+        }
+    }
+    return -1;
+}
+
+/**
+ * 构造类继承关系
+ *
+ * @memberOf module:zrender/core/util
+ * @param {Function} clazz 源类
+ * @param {Function} baseClazz 基类
+ */
+function inherits(clazz, baseClazz) {
+    var clazzPrototype = clazz.prototype;
+    function F() {}
+    F.prototype = baseClazz.prototype;
+    clazz.prototype = new F();
+
+    for (var prop in clazzPrototype) {
+        clazz.prototype[prop] = clazzPrototype[prop];
+    }
+    clazz.prototype.constructor = clazz;
+    clazz.superClass = baseClazz;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Object|Function} target
+ * @param {Object|Function} sorce
+ * @param {boolean} overlay
+ */
+function mixin(target, source, overlay) {
+    target = 'prototype' in target ? target.prototype : target;
+    source = 'prototype' in source ? source.prototype : source;
+
+    defaults(target, source, overlay);
+}
+
+/**
+ * Consider typed array.
+ * @param {Array|TypedArray} data
+ */
+function isArrayLike(data) {
+    if (! data) {
+        return;
+    }
+    if (typeof data == 'string') {
+        return false;
+    }
+    return typeof data.length == 'number';
+}
+
+/**
+ * 数组或对象遍历
+ * @memberOf module:zrender/core/util
+ * @param {Object|Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ */
+function each$1(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.forEach && obj.forEach === nativeForEach) {
+        obj.forEach(cb, context);
+    }
+    else if (obj.length === +obj.length) {
+        for (var i = 0, len = obj.length; i < len; i++) {
+            cb.call(context, obj[i], i, obj);
+        }
+    }
+    else {
+        for (var key in obj) {
+            if (obj.hasOwnProperty(key)) {
+                cb.call(context, obj[key], key, obj);
+            }
+        }
+    }
+}
+
+/**
+ * 数组映射
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ * @return {Array}
+ */
+function map(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.map && obj.map === nativeMap) {
+        return obj.map(cb, context);
+    }
+    else {
+        var result = [];
+        for (var i = 0, len = obj.length; i < len; i++) {
+            result.push(cb.call(context, obj[i], i, obj));
+        }
+        return result;
+    }
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {Object} [memo]
+ * @param {*} [context]
+ * @return {Array}
+ */
+function reduce(obj, cb, memo, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.reduce && obj.reduce === nativeReduce) {
+        return obj.reduce(cb, memo, context);
+    }
+    else {
+        for (var i = 0, len = obj.length; i < len; i++) {
+            memo = cb.call(context, memo, obj[i], i, obj);
+        }
+        return memo;
+    }
+}
+
+/**
+ * 数组过滤
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ * @return {Array}
+ */
+function filter(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    if (obj.filter && obj.filter === nativeFilter) {
+        return obj.filter(cb, context);
+    }
+    else {
+        var result = [];
+        for (var i = 0, len = obj.length; i < len; i++) {
+            if (cb.call(context, obj[i], i, obj)) {
+                result.push(obj[i]);
+            }
+        }
+        return result;
+    }
+}
+
+/**
+ * 数组项查找
+ * @memberOf module:zrender/core/util
+ * @param {Array} obj
+ * @param {Function} cb
+ * @param {*} [context]
+ * @return {*}
+ */
+function find(obj, cb, context) {
+    if (!(obj && cb)) {
+        return;
+    }
+    for (var i = 0, len = obj.length; i < len; i++) {
+        if (cb.call(context, obj[i], i, obj)) {
+            return obj[i];
+        }
+    }
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Function} func
+ * @param {*} context
+ * @return {Function}
+ */
+function bind(func, context) {
+    var args = nativeSlice.call(arguments, 2);
+    return function () {
+        return func.apply(context, args.concat(nativeSlice.call(arguments)));
+    };
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Function} func
+ * @return {Function}
+ */
+function curry(func) {
+    var args = nativeSlice.call(arguments, 1);
+    return function () {
+        return func.apply(this, args.concat(nativeSlice.call(arguments)));
+    };
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isArray(value) {
+    return objToString.call(value) === '[object Array]';
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isFunction$1(value) {
+    return typeof value === 'function';
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isString(value) {
+    return objToString.call(value) === '[object String]';
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isObject$1(value) {
+    // Avoid a V8 JIT bug in Chrome 19-20.
+    // See https://code.google.com/p/v8/issues/detail?id=2291 for more details.
+    var type = typeof value;
+    return type === 'function' || (!!value && type == 'object');
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isBuiltInObject(value) {
+    return !!BUILTIN_OBJECT[objToString.call(value)];
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isTypedArray(value) {
+    return !!TYPED_ARRAY[objToString.call(value)];
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {*} value
+ * @return {boolean}
+ */
+function isDom(value) {
+    return typeof value === 'object'
+        && typeof value.nodeType === 'number'
+        && typeof value.ownerDocument === 'object';
+}
+
+/**
+ * Whether is exactly NaN. Notice isNaN('a') returns true.
+ * @param {*} value
+ * @return {boolean}
+ */
+function eqNaN(value) {
+    return value !== value;
+}
+
+/**
+ * If value1 is not null, then return value1, otherwise judget rest of values.
+ * Low performance.
+ * @memberOf module:zrender/core/util
+ * @return {*} Final value
+ */
+function retrieve(values) {
+    for (var i = 0, len = arguments.length; i < len; i++) {
+        if (arguments[i] != null) {
+            return arguments[i];
+        }
+    }
+}
+
+function retrieve2(value0, value1) {
+    return value0 != null
+        ? value0
+        : value1;
+}
+
+function retrieve3(value0, value1, value2) {
+    return value0 != null
+        ? value0
+        : value1 != null
+        ? value1
+        : value2;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {Array} arr
+ * @param {number} startIndex
+ * @param {number} endIndex
+ * @return {Array}
+ */
+function slice() {
+    return Function.call.apply(nativeSlice, arguments);
+}
+
+/**
+ * Normalize css liked array configuration
+ * e.g.
+ *  3 => [3, 3, 3, 3]
+ *  [4, 2] => [4, 2, 4, 2]
+ *  [4, 3, 2] => [4, 3, 2, 3]
+ * @param {number|Array.<number>} val
+ * @return {Array.<number>}
+ */
+function normalizeCssArray(val) {
+    if (typeof (val) === 'number') {
+        return [val, val, val, val];
+    }
+    var len = val.length;
+    if (len === 2) {
+        // vertical | horizontal
+        return [val[0], val[1], val[0], val[1]];
+    }
+    else if (len === 3) {
+        // top | horizontal | bottom
+        return [val[0], val[1], val[2], val[1]];
+    }
+    return val;
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {boolean} condition
+ * @param {string} message
+ */
+function assert$1(condition, message) {
+    if (!condition) {
+        throw new Error(message);
+    }
+}
+
+/**
+ * @memberOf module:zrender/core/util
+ * @param {string} str string to be trimed
+ * @return {string} trimed string
+ */
+function trim(str) {
+    if (str == null) {
+        return null;
+    }
+    else if (typeof str.trim === 'function') {
+        return str.trim();
+    }
+    else {
+        return str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, '');
+    }
+}
+
+var primitiveKey = '__ec_primitive__';
+/**
+ * Set an object as primitive to be ignored traversing children in clone or merge
+ */
+function setAsPrimitive(obj) {
+    obj[primitiveKey] = true;
+}
+
+function isPrimitive(obj) {
+    return obj[primitiveKey];
+}
+
+/**
+ * @constructor
+ * @param {Object} obj Only apply `ownProperty`.
+ */
+function HashMap(obj) {
+    var isArr = isArray(obj);
+    var thisMap = this;
+
+    (obj instanceof HashMap)
+        ? obj.each(visit)
+        : (obj && each$1(obj, visit));
+
+    function visit(value, key) {
+        isArr ? thisMap.set(value, key) : thisMap.set(key, value);
+    }
+}
+
+// Add prefix to avoid conflict with Object.prototype.
+
+HashMap.prototype = {
+    constructor: HashMap,
+    // Do not provide `has` method to avoid defining what is `has`.
+    // (We usually treat `null` and `undefined` as the same, different
+    // from ES6 Map).
+    get: function (key) {
+        return this.hasOwnProperty(key) ? this[key] : null;
+    },
+    set: function (key, value) {
+        // Comparing with invocation chaining, `return value` is more commonly
+        // used in this case: `var someVal = map.set('a', genVal());`
+        return (this[key] = value);
+    },
+    // Although util.each can be performed on this hashMap directly, user
+    // should not use the exposed keys, who are prefixed.
+    each: function (cb, context) {
+        context !== void 0 && (cb = bind(cb, context));
+        for (var key in this) {
+            this.hasOwnProperty(key) && cb(this[key], key);
+        }
+    },
+    // Do not use this method if performance sensitive.
+    removeKey: function (key) {
+        delete this[key];
+    }
+};
+
+function createHashMap(obj) {
+    return new HashMap(obj);
+}
+
+function concatArray(a, b) {
+    var newArray = new a.constructor(a.length + b.length);
+    for (var i = 0; i < a.length; i++) {
+        newArray[i] = a[i];
+    }
+    var offset = a.length;
+    for (i = 0; i < b.length; i++) {
+        newArray[i + offset] = b[i];
+    }
+    return newArray;
+}
+
+
+function noop() {}
+
+
+var zrUtil = (Object.freeze || Object)({
+	$override: $override,
+	clone: clone,
+	merge: merge,
+	mergeAll: mergeAll,
+	extend: extend,
+	defaults: defaults,
+	createCanvas: createCanvas,
+	getContext: getContext,
+	indexOf: indexOf,
+	inherits: inherits,
+	mixin: mixin,
+	isArrayLike: isArrayLike,
+	each: each$1,
+	map: map,
+	reduce: reduce,
+	filter: filter,
+	find: find,
+	bind: bind,
+	curry: curry,
+	isArray: isArray,
+	isFunction: isFunction$1,
+	isString: isString,
+	isObject: isObject$1,
+	isBuiltInObject: isBuiltInObject,
+	isTypedArray: isTypedArray,
+	isDom: isDom,
+	eqNaN: eqNaN,
+	retrieve: retrieve,
+	retrieve2: retrieve2,
+	retrieve3: retrieve3,
+	slice: slice,
+	normalizeCssArray: normalizeCssArray,
+	assert: assert$1,
+	trim: trim,
+	setAsPrimitive: setAsPrimitive,
+	isPrimitive: isPrimitive,
+	createHashMap: createHashMap,
+	concatArray: concatArray,
+	noop: noop
+});
+
+var ArrayCtor = typeof Float32Array === 'undefined'
+    ? Array
+    : Float32Array;
+
+/**
+ * 创建一个向量
+ * @param {number} [x=0]
+ * @param {number} [y=0]
+ * @return {Vector2}
+ */
+function create(x, y) {
+    var out = new ArrayCtor(2);
+    if (x == null) {
+        x = 0;
+    }
+    if (y == null) {
+        y = 0;
+    }
+    out[0] = x;
+    out[1] = y;
+    return out;
+}
+
+/**
+ * 复制向量数据
+ * @param {Vector2} out
+ * @param {Vector2} v
+ * @return {Vector2}
+ */
+function copy(out, v) {
+    out[0] = v[0];
+    out[1] = v[1];
+    return out;
+}
+
+/**
+ * 克隆一个向量
+ * @param {Vector2} v
+ * @return {Vector2}
+ */
+function clone$1(v) {
+    var out = new ArrayCtor(2);
+    out[0] = v[0];
+    out[1] = v[1];
+    return out;
+}
+
+/**
+ * 设置向量的两个项
+ * @param {Vector2} out
+ * @param {number} a
+ * @param {number} b
+ * @return {Vector2} 结果
+ */
+function set(out, a, b) {
+    out[0] = a;
+    out[1] = b;
+    return out;
+}
+
+/**
+ * 向量相加
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function add(out, v1, v2) {
+    out[0] = v1[0] + v2[0];
+    out[1] = v1[1] + v2[1];
+    return out;
+}
+
+/**
+ * 向量缩放后相加
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @param {number} a
+ */
+function scaleAndAdd(out, v1, v2, a) {
+    out[0] = v1[0] + v2[0] * a;
+    out[1] = v1[1] + v2[1] * a;
+    return out;
+}
+
+/**
+ * 向量相减
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function sub(out, v1, v2) {
+    out[0] = v1[0] - v2[0];
+    out[1] = v1[1] - v2[1];
+    return out;
+}
+
+/**
+ * 向量长度
+ * @param {Vector2} v
+ * @return {number}
+ */
+function len(v) {
+    return Math.sqrt(lenSquare(v));
+}
+var length = len; // jshint ignore:line
+
+/**
+ * 向量长度平方
+ * @param {Vector2} v
+ * @return {number}
+ */
+function lenSquare(v) {
+    return v[0] * v[0] + v[1] * v[1];
+}
+var lengthSquare = lenSquare;
+
+/**
+ * 向量乘法
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function mul(out, v1, v2) {
+    out[0] = v1[0] * v2[0];
+    out[1] = v1[1] * v2[1];
+    return out;
+}
+
+/**
+ * 向量除法
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ */
+function div(out, v1, v2) {
+    out[0] = v1[0] / v2[0];
+    out[1] = v1[1] / v2[1];
+    return out;
+}
+
+/**
+ * 向量点乘
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @return {number}
+ */
+function dot(v1, v2) {
+    return v1[0] * v2[0] + v1[1] * v2[1];
+}
+
+/**
+ * 向量缩放
+ * @param {Vector2} out
+ * @param {Vector2} v
+ * @param {number} s
+ */
+function scale(out, v, s) {
+    out[0] = v[0] * s;
+    out[1] = v[1] * s;
+    return out;
+}
+
+/**
+ * 向量归一化
+ * @param {Vector2} out
+ * @param {Vector2} v
+ */
+function normalize(out, v) {
+    var d = len(v);
+    if (d === 0) {
+        out[0] = 0;
+        out[1] = 0;
+    }
+    else {
+        out[0] = v[0] / d;
+        out[1] = v[1] / d;
+    }
+    return out;
+}
+
+/**
+ * 计算向量间距离
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @return {number}
+ */
+function distance(v1, v2) {
+    return Math.sqrt(
+        (v1[0] - v2[0]) * (v1[0] - v2[0])
+        + (v1[1] - v2[1]) * (v1[1] - v2[1])
+    );
+}
+var dist = distance;
+
+/**
+ * 向量距离平方
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @return {number}
+ */
+function distanceSquare(v1, v2) {
+    return (v1[0] - v2[0]) * (v1[0] - v2[0])
+        + (v1[1] - v2[1]) * (v1[1] - v2[1]);
+}
+var distSquare = distanceSquare;
+
+/**
+ * 求负向量
+ * @param {Vector2} out
+ * @param {Vector2} v
+ */
+function negate(out, v) {
+    out[0] = -v[0];
+    out[1] = -v[1];
+    return out;
+}
+
+/**
+ * 插值两个点
+ * @param {Vector2} out
+ * @param {Vector2} v1
+ * @param {Vector2} v2
+ * @param {number} t
+ */
+function lerp(out, v1, v2, t) {
+    out[0] = v1[0] + t * (v2[0] - v1[0]);
+    out[1] = v1[1] + t * (v2[1] - v1[1]);
+    return out;
+}
+
+/**
+ * 矩阵左乘向量
+ * @param {Vector2} out
+ * @param {Vector2} v
+ * @param {Vector2} m
+ */
+function applyTransform(out, v, m) {
+    var x = v[0];
+    var y = v[1];
+    out[0] = m[0] * x + m[2] * y + m[4];
+    out[1] = m[1] * x + m[3] * y + m[5];
+    return out;
+}
+
+/**
+ * 求两个向量最小值
+ * @param  {Vector2} out
+ * @param  {Vector2} v1
+ * @param  {Vector2} v2
+ */
+function min(out, v1, v2) {
+    out[0] = Math.min(v1[0], v2[0]);
+    out[1] = Math.min(v1[1], v2[1]);
+    return out;
+}
+
+/**
+ * 求两个向量最大值
+ * @param  {Vector2} out
+ * @param  {Vector2} v1
+ * @param  {Vector2} v2
+ */
+function max(out, v1, v2) {
+    out[0] = Math.max(v1[0], v2[0]);
+    out[1] = Math.max(v1[1], v2[1]);
+    return out;
+}
+
+
+var vector = (Object.freeze || Object)({
+	create: create,
+	copy: copy,
+	clone: clone$1,
+	set: set,
+	add: add,
+	scaleAndAdd: scaleAndAdd,
+	sub: sub,
+	len: len,
+	length: length,
+	lenSquare: lenSquare,
+	lengthSquare: lengthSquare,
+	mul: mul,
+	div: div,
+	dot: dot,
+	scale: scale,
+	normalize: normalize,
+	distance: distance,
+	dist: dist,
+	distanceSquare: distanceSquare,
+	distSquare: distSquare,
+	negate: negate,
+	lerp: lerp,
+	applyTransform: applyTransform,
+	min: min,
+	max: max
+});
+
+// TODO Draggable for group
+// FIXME Draggable on element which has parent rotation or scale
+function Draggable() {
+
+    this.on('mousedown', this._dragStart, this);
+    this.on('mousemove', this._drag, this);
+    this.on('mouseup', this._dragEnd, this);
+    this.on('globalout', this._dragEnd, this);
+    // this._dropTarget = null;
+    // this._draggingTarget = null;
+
+    // this._x = 0;
+    // this._y = 0;
+}
+
+Draggable.prototype = {
+
+    constructor: Draggable,
+
+    _dragStart: function (e) {
+        var draggingTarget = e.target;
+        if (draggingTarget && draggingTarget.draggable) {
+            this._draggingTarget = draggingTarget;
+            draggingTarget.dragging = true;
+            this._x = e.offsetX;
+            this._y = e.offsetY;
+
+            this.dispatchToElement(param(draggingTarget, e), 'dragstart', e.event);
+        }
+    },
+
+    _drag: function (e) {
+        var draggingTarget = this._draggingTarget;
+        if (draggingTarget) {
+
+            var x = e.offsetX;
+            var y = e.offsetY;
+
+            var dx = x - this._x;
+            var dy = y - this._y;
+            this._x = x;
+            this._y = y;
+
+            draggingTarget.drift(dx, dy, e);
+            this.dispatchToElement(param(draggingTarget, e), 'drag', e.event);
+
+            var dropTarget = this.findHover(x, y, draggingTarget).target;
+            var lastDropTarget = this._dropTarget;
+            this._dropTarget = dropTarget;
+
+            if (draggingTarget !== dropTarget) {
+                if (lastDropTarget && dropTarget !== lastDropTarget) {
+                    this.dispatchToElement(param(lastDropTarget, e), 'dragleave', e.event);
+                }
+                if (dropTarget && dropTarget !== lastDropTarget) {
+                    this.dispatchToElement(param(dropTarget, e), 'dragenter', e.event);
+                }
+            }
+        }
+    },
+
+    _dragEnd: function (e) {
+        var draggingTarget = this._draggingTarget;
+
+        if (draggingTarget) {
+            draggingTarget.dragging = false;
+        }
+
+        this.dispatchToElement(param(draggingTarget, e), 'dragend', e.event);
+
+        if (this._dropTarget) {
+            this.dispatchToElement(param(this._dropTarget, e), 'drop', e.event);
+        }
+
+        this._draggingTarget = null;
+        this._dropTarget = null;
+    }
+
+};
+
+function param(target, e) {
+    return {target: target, topTarget: e && e.topTarget};
+}
+
+/**
+ * 事件扩展
+ * @module zrender/mixin/Eventful
+ * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ *         pissang (https://www.github.com/pissang)
+ */
+
+var arrySlice = Array.prototype.slice;
+
+/**
+ * 事件分发器
+ * @alias module:zrender/mixin/Eventful
+ * @constructor
+ */
+var Eventful = function () {
+    this._$handlers = {};
+};
+
+Eventful.prototype = {
+
+    constructor: Eventful,
+
+    /**
+     * 单次触发绑定，trigger后销毁
+     *
+     * @param {string} event 事件名
+     * @param {Function} handler 响应函数
+     * @param {Object} context
+     */
+    one: function (event, handler, context) {
+        var _h = this._$handlers;
+
+        if (!handler || !event) {
+            return this;
+        }
+
+        if (!_h[event]) {
+            _h[event] = [];
+        }
+
+        for (var i = 0; i < _h[event].length; i++) {
+            if (_h[event][i].h === handler) {
+                return this;
+            }
+        }
+
+        _h[event].push({
+            h: handler,
+            one: true,
+            ctx: context || this
+        });
+
+        return this;
+    },
+
+    /**
+     * 绑定事件
+     * @param {string} event 事件名
+     * @param {Function} handler 事件处理函数
+     * @param {Object} [context]
+     */
+    on: function (event, handler, context) {
+        var _h = this._$handlers;
+
+        if (!handler || !event) {
+            return this;
+        }
+
+        if (!_h[event]) {
+            _h[event] = [];
+        }
+
+        for (var i = 0; i < _h[event].length; i++) {
+            if (_h[event][i].h === handler) {
+                return this;
+            }
+        }
+
+        _h[event].push({
+            h: handler,
+            one: false,
+            ctx: context || this
+        });
+
+        return this;
+    },
+
+    /**
+     * 是否绑定了事件
+     * @param  {string}  event
+     * @return {boolean}
+     */
+    isSilent: function (event) {
+        var _h = this._$handlers;
+        return _h[event] && _h[event].length;
+    },
+
+    /**
+     * 解绑事件
+     * @param {string} event 事件名
+     * @param {Function} [handler] 事件处理函数
+     */
+    off: function (event, handler) {
+        var _h = this._$handlers;
+
+        if (!event) {
+            this._$handlers = {};
+            return this;
+        }
+
+        if (handler) {
+            if (_h[event]) {
+                var newList = [];
+                for (var i = 0, l = _h[event].length; i < l; i++) {
+                    if (_h[event][i]['h'] != handler) {
+                        newList.push(_h[event][i]);
+                    }
+                }
+                _h[event] = newList;
+            }
+
+            if (_h[event] && _h[event].length === 0) {
+                delete _h[event];
+            }
+        }
+        else {
+            delete _h[event];
+        }
+
+        return this;
+    },
+
+    /**
+     * 事件分发
+     *
+     * @param {string} type 事件类型
+     */
+    trigger: function (type) {
+        if (this._$handlers[type]) {
+            var args = arguments;
+            var argLen = args.length;
+
+            if (argLen > 3) {
+                args = arrySlice.call(args, 1);
+            }
+
+            var _h = this._$handlers[type];
+            var len = _h.length;
+            for (var i = 0; i < len;) {
+                // Optimize advise from backbone
+                switch (argLen) {
+                    case 1:
+                        _h[i]['h'].call(_h[i]['ctx']);
+                        break;
+                    case 2:
+                        _h[i]['h'].call(_h[i]['ctx'], args[1]);
+                        break;
+                    case 3:
+                        _h[i]['h'].call(_h[i]['ctx'], args[1], args[2]);
+                        break;
+                    default:
+                        // have more than 2 given arguments
+                        _h[i]['h'].apply(_h[i]['ctx'], args);
+                        break;
+                }
+
+                if (_h[i]['one']) {
+                    _h.splice(i, 1);
+                    len--;
+                }
+                else {
+                    i++;
+                }
+            }
+        }
+
+        return this;
+    },
+
+    /**
+     * 带有context的事件分发, 最后一个参数是事件回调的context
+     * @param {string} type 事件类型
+     */
+    triggerWithContext: function (type) {
+        if (this._$handlers[type]) {
+            var args = arguments;
+            var argLen = args.length;
+
+            if (argLen > 4) {
+                args = arrySlice.call(args, 1, args.length - 1);
+            }
+            var ctx = args[args.length - 1];
+
+            var _h = this._$handlers[type];
+            var len = _h.length;
+            for (var i = 0; i < len;) {
+                // Optimize advise from backbone
+                switch (argLen) {
+                    case 1:
+                        _h[i]['h'].call(ctx);
+                        break;
+                    case 2:
+                        _h[i]['h'].call(ctx, args[1]);
+                        break;
+                    case 3:
+                        _h[i]['h'].call(ctx, args[1], args[2]);
+                        break;
+                    default:
+                        // have more than 2 given arguments
+                        _h[i]['h'].apply(ctx, args);
+                        break;
+                }
+
+                if (_h[i]['one']) {
+                    _h.splice(i, 1);
+                    len--;
+                }
+                else {
+                    i++;
+                }
+            }
+        }
+
+        return this;
+    }
+};
+
+var SILENT = 'silent';
+
+function makeEventPacket(eveType, targetInfo, event) {
+    return {
+        type: eveType,
+        event: event,
+        // target can only be an element that is not silent.
+        target: targetInfo.target,
+        // topTarget can be a silent element.
+        topTarget: targetInfo.topTarget,
+        cancelBubble: false,
+        offsetX: event.zrX,
+        offsetY: event.zrY,
+        gestureEvent: event.gestureEvent,
+        pinchX: event.pinchX,
+        pinchY: event.pinchY,
+        pinchScale: event.pinchScale,
+        wheelDelta: event.zrDelta,
+        zrByTouch: event.zrByTouch,
+        which: event.which
+    };
+}
+
+function EmptyProxy () {}
+EmptyProxy.prototype.dispose = function () {};
+
+var handlerNames = [
+    'click', 'dblclick', 'mousewheel', 'mouseout',
+    'mouseup', 'mousedown', 'mousemove', 'contextmenu'
+];
+/**
+ * @alias module:zrender/Handler
+ * @constructor
+ * @extends module:zrender/mixin/Eventful
+ * @param {module:zrender/Storage} storage Storage instance.
+ * @param {module:zrender/Painter} painter Painter instance.
+ * @param {module:zrender/dom/HandlerProxy} proxy HandlerProxy instance.
+ * @param {HTMLElement} painterRoot painter.root (not painter.getViewportRoot()).
+ */
+var Handler = function(storage, painter, proxy, painterRoot) {
+    Eventful.call(this);
+
+    this.storage = storage;
+
+    this.painter = painter;
+
+    this.painterRoot = painterRoot;
+
+    proxy = proxy || new EmptyProxy();
+
+    /**
+     * Proxy of event. can be Dom, WebGLSurface, etc.
+     */
+    this.proxy = null;
+
+    /**
+     * {target, topTarget, x, y}
+     * @private
+     * @type {Object}
+     */
+    this._hovered = {};
+
+    /**
+     * @private
+     * @type {Date}
+     */
+    this._lastTouchMoment;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this._lastX;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this._lastY;
+
+
+    Draggable.call(this);
+
+    this.setHandlerProxy(proxy);
+};
+
+Handler.prototype = {
+
+    constructor: Handler,
+
+    setHandlerProxy: function (proxy) {
+        if (this.proxy) {
+            this.proxy.dispose();
+        }
+
+        if (proxy) {
+            each$1(handlerNames, function (name) {
+                proxy.on && proxy.on(name, this[name], this);
+            }, this);
+            // Attach handler
+            proxy.handler = this;
+        }
+        this.proxy = proxy;
+    },
+
+    mousemove: function (event) {
+        var x = event.zrX;
+        var y = event.zrY;
+
+        var lastHovered = this._hovered;
+        var lastHoveredTarget = lastHovered.target;
+
+        // If lastHoveredTarget is removed from zr (detected by '__zr') by some API call
+        // (like 'setOption' or 'dispatchAction') in event handlers, we should find
+        // lastHovered again here. Otherwise 'mouseout' can not be triggered normally.
+        // See #6198.
+        if (lastHoveredTarget && !lastHoveredTarget.__zr) {
+            lastHovered = this.findHover(lastHovered.x, lastHovered.y);
+            lastHoveredTarget = lastHovered.target;
+        }
+
+        var hovered = this._hovered = this.findHover(x, y);
+        var hoveredTarget = hovered.target;
+
+        var proxy = this.proxy;
+        proxy.setCursor && proxy.setCursor(hoveredTarget ? hoveredTarget.cursor : 'default');
+
+        // Mouse out on previous hovered element
+        if (lastHoveredTarget && hoveredTarget !== lastHoveredTarget) {
+            this.dispatchToElement(lastHovered, 'mouseout', event);
+        }
+
+        // Mouse moving on one element
+        this.dispatchToElement(hovered, 'mousemove', event);
+
+        // Mouse over on a new element
+        if (hoveredTarget && hoveredTarget !== lastHoveredTarget) {
+            this.dispatchToElement(hovered, 'mouseover', event);
+        }
+    },
+
+    mouseout: function (event) {
+        this.dispatchToElement(this._hovered, 'mouseout', event);
+
+        // There might be some doms created by upper layer application
+        // at the same level of painter.getViewportRoot() (e.g., tooltip
+        // dom created by echarts), where 'globalout' event should not
+        // be triggered when mouse enters these doms. (But 'mouseout'
+        // should be triggered at the original hovered element as usual).
+        var element = event.toElement || event.relatedTarget;
+        var innerDom;
+        do {
+            element = element && element.parentNode;
+        }
+        while (element && element.nodeType != 9 && !(
+            innerDom = element === this.painterRoot
+        ));
+
+        !innerDom && this.trigger('globalout', {event: event});
+    },
+
+    /**
+     * Resize
+     */
+    resize: function (event) {
+        this._hovered = {};
+    },
+
+    /**
+     * Dispatch event
+     * @param {string} eventName
+     * @param {event=} eventArgs
+     */
+    dispatch: function (eventName, eventArgs) {
+        var handler = this[eventName];
+        handler && handler.call(this, eventArgs);
+    },
+
+    /**
+     * Dispose
+     */
+    dispose: function () {
+
+        this.proxy.dispose();
+
+        this.storage =
+        this.proxy =
+        this.painter = null;
+    },
+
+    /**
+     * 设置默认的cursor style
+     * @param {string} [cursorStyle='default'] 例如 crosshair
+     */
+    setCursorStyle: function (cursorStyle) {
+        var proxy = this.proxy;
+        proxy.setCursor && proxy.setCursor(cursorStyle);
+    },
+
+    /**
+     * 事件分发代理
+     *
+     * @private
+     * @param {Object} targetInfo {target, topTarget} 目标图形元素
+     * @param {string} eventName 事件名称
+     * @param {Object} event 事件对象
+     */
+    dispatchToElement: function (targetInfo, eventName, event) {
+        targetInfo = targetInfo || {};
+        var el = targetInfo.target;
+        if (el && el.silent) {
+            return;
+        }
+        var eventHandler = 'on' + eventName;
+        var eventPacket = makeEventPacket(eventName, targetInfo, event);
+
+        while (el) {
+            el[eventHandler]
+                && (eventPacket.cancelBubble = el[eventHandler].call(el, eventPacket));
+
+            el.trigger(eventName, eventPacket);
+
+            el = el.parent;
+
+            if (eventPacket.cancelBubble) {
+                break;
+            }
+        }
+
+        if (!eventPacket.cancelBubble) {
+            // 冒泡到顶级 zrender 对象
+            this.trigger(eventName, eventPacket);
+            // 分发事件到用户自定义层
+            // 用户有可能在全局 click 事件中 dispose，所以需要判断下 painter 是否存在
+            this.painter && this.painter.eachOtherLayer(function (layer) {
+                if (typeof(layer[eventHandler]) == 'function') {
+                    layer[eventHandler].call(layer, eventPacket);
+                }
+                if (layer.trigger) {
+                    layer.trigger(eventName, eventPacket);
+                }
+            });
+        }
+    },
+
+    /**
+     * @private
+     * @param {number} x
+     * @param {number} y
+     * @param {module:zrender/graphic/Displayable} exclude
+     * @return {model:zrender/Element}
+     * @method
+     */
+    findHover: function(x, y, exclude) {
+        var list = this.storage.getDisplayList();
+        var out = {x: x, y: y};
+
+        for (var i = list.length - 1; i >= 0 ; i--) {
+            var hoverCheckResult;
+            if (list[i] !== exclude
+                // getDisplayList may include ignored item in VML mode
+                && !list[i].ignore
+                && (hoverCheckResult = isHover(list[i], x, y))
+            ) {
+                !out.topTarget && (out.topTarget = list[i]);
+                if (hoverCheckResult !== SILENT) {
+                    out.target = list[i];
+                    break;
+                }
+            }
+        }
+
+        return out;
+    }
+};
+
+// Common handlers
+each$1(['click', 'mousedown', 'mouseup', 'mousewheel', 'dblclick', 'contextmenu'], function (name) {
+    Handler.prototype[name] = function (event) {
+        // Find hover again to avoid click event is dispatched manually. Or click is triggered without mouseover
+        var hovered = this.findHover(event.zrX, event.zrY);
+        var hoveredTarget = hovered.target;
+
+        if (name === 'mousedown') {
+            this._downEl = hoveredTarget;
+            this._downPoint = [event.zrX, event.zrY];
+            // In case click triggered before mouseup
+            this._upEl = hoveredTarget;
+        }
+        else if (name === 'mouseup') {
+            this._upEl = hoveredTarget;
+        }
+        else if (name === 'click') {
+            if (this._downEl !== this._upEl
+                // Original click event is triggered on the whole canvas element,
+                // including the case that `mousedown` - `mousemove` - `mouseup`,
+                // which should be filtered, otherwise it will bring trouble to
+                // pan and zoom.
+                || !this._downPoint
+                // Arbitrary value
+                || dist(this._downPoint, [event.zrX, event.zrY]) > 4
+            ) {
+                return;
+            }
+            this._downPoint = null;
+        }
+
+        this.dispatchToElement(hovered, name, event);
+    };
+});
+
+function isHover(displayable, x, y) {
+    if (displayable[displayable.rectHover ? 'rectContain' : 'contain'](x, y)) {
+        var el = displayable;
+        var isSilent;
+        while (el) {
+            // If clipped by ancestor.
+            // FIXME: If clipPath has neither stroke nor fill,
+            // el.clipPath.contain(x, y) will always return false.
+            if (el.clipPath && !el.clipPath.contain(x, y))  {
+                return false;
+            }
+            if (el.silent) {
+                isSilent = true;
+            }
+            el = el.parent;
+        }
+        return isSilent ? SILENT : true;
+    }
+
+    return false;
+}
+
+mixin(Handler, Eventful);
+mixin(Handler, Draggable);
+
+/**
+ * 3x2矩阵操作类
+ * @exports zrender/tool/matrix
+ */
+
+var ArrayCtor$1 = typeof Float32Array === 'undefined'
+    ? Array
+   : Float32Array;
+
+/**
+ * Create a identity matrix.
+ * @return {Float32Array|Array.<number>}
+ */
+function create$1() {
+    var out = new ArrayCtor$1(6);
+    identity(out);
+
+    return out;
+}
+
+/**
+ * 设置矩阵为单位矩阵
+ * @param {Float32Array|Array.<number>} out
+ */
+function identity(out) {
+    out[0] = 1;
+    out[1] = 0;
+    out[2] = 0;
+    out[3] = 1;
+    out[4] = 0;
+    out[5] = 0;
+    return out;
+}
+
+/**
+ * 复制矩阵
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} m
+ */
+function copy$1(out, m) {
+    out[0] = m[0];
+    out[1] = m[1];
+    out[2] = m[2];
+    out[3] = m[3];
+    out[4] = m[4];
+    out[5] = m[5];
+    return out;
+}
+
+/**
+ * 矩阵相乘
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} m1
+ * @param {Float32Array|Array.<number>} m2
+ */
+function mul$1(out, m1, m2) {
+    // Consider matrix.mul(m, m2, m);
+    // where out is the same as m2.
+    // So use temp variable to escape error.
+    var out0 = m1[0] * m2[0] + m1[2] * m2[1];
+    var out1 = m1[1] * m2[0] + m1[3] * m2[1];
+    var out2 = m1[0] * m2[2] + m1[2] * m2[3];
+    var out3 = m1[1] * m2[2] + m1[3] * m2[3];
+    var out4 = m1[0] * m2[4] + m1[2] * m2[5] + m1[4];
+    var out5 = m1[1] * m2[4] + m1[3] * m2[5] + m1[5];
+    out[0] = out0;
+    out[1] = out1;
+    out[2] = out2;
+    out[3] = out3;
+    out[4] = out4;
+    out[5] = out5;
+    return out;
+}
+
+/**
+ * 平移变换
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ * @param {Float32Array|Array.<number>} v
+ */
+function translate(out, a, v) {
+    out[0] = a[0];
+    out[1] = a[1];
+    out[2] = a[2];
+    out[3] = a[3];
+    out[4] = a[4] + v[0];
+    out[5] = a[5] + v[1];
+    return out;
+}
+
+/**
+ * 旋转变换
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ * @param {number} rad
+ */
+function rotate(out, a, rad) {
+    var aa = a[0];
+    var ac = a[2];
+    var atx = a[4];
+    var ab = a[1];
+    var ad = a[3];
+    var aty = a[5];
+    var st = Math.sin(rad);
+    var ct = Math.cos(rad);
+
+    out[0] = aa * ct + ab * st;
+    out[1] = -aa * st + ab * ct;
+    out[2] = ac * ct + ad * st;
+    out[3] = -ac * st + ct * ad;
+    out[4] = ct * atx + st * aty;
+    out[5] = ct * aty - st * atx;
+    return out;
+}
+
+/**
+ * 缩放变换
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ * @param {Float32Array|Array.<number>} v
+ */
+function scale$1(out, a, v) {
+    var vx = v[0];
+    var vy = v[1];
+    out[0] = a[0] * vx;
+    out[1] = a[1] * vy;
+    out[2] = a[2] * vx;
+    out[3] = a[3] * vy;
+    out[4] = a[4] * vx;
+    out[5] = a[5] * vy;
+    return out;
+}
+
+/**
+ * 求逆矩阵
+ * @param {Float32Array|Array.<number>} out
+ * @param {Float32Array|Array.<number>} a
+ */
+function invert(out, a) {
+
+    var aa = a[0];
+    var ac = a[2];
+    var atx = a[4];
+    var ab = a[1];
+    var ad = a[3];
+    var aty = a[5];
+
+    var det = aa * ad - ab * ac;
+    if (!det) {
+        return null;
+    }
+    det = 1.0 / det;
+
+    out[0] = ad * det;
+    out[1] = -ab * det;
+    out[2] = -ac * det;
+    out[3] = aa * det;
+    out[4] = (ac * aty - ad * atx) * det;
+    out[5] = (ab * atx - aa * aty) * det;
+    return out;
+}
+
+/**
+ * Clone a new matrix.
+ * @param {Float32Array|Array.<number>} a
+ */
+function clone$2(a) {
+    var b = create$1();
+    copy$1(b, a);
+    return b;
+}
+
+var matrix = (Object.freeze || Object)({
+	create: create$1,
+	identity: identity,
+	copy: copy$1,
+	mul: mul$1,
+	translate: translate,
+	rotate: rotate,
+	scale: scale$1,
+	invert: invert,
+	clone: clone$2
+});
+
+/**
+ * 提供变换扩展
+ * @module zrender/mixin/Transformable
+ * @author pissang (https://www.github.com/pissang)
+ */
+
+var mIdentity = identity;
+
+var EPSILON = 5e-5;
+
+function isNotAroundZero(val) {
+    return val > EPSILON || val < -EPSILON;
+}
+
+/**
+ * @alias module:zrender/mixin/Transformable
+ * @constructor
+ */
+var Transformable = function (opts) {
+    opts = opts || {};
+    // If there are no given position, rotation, scale
+    if (!opts.position) {
+        /**
+         * 平移
+         * @type {Array.<number>}
+         * @default [0, 0]
+         */
+        this.position = [0, 0];
+    }
+    if (opts.rotation == null) {
+        /**
+         * 旋转
+         * @type {Array.<number>}
+         * @default 0
+         */
+        this.rotation = 0;
+    }
+    if (!opts.scale) {
+        /**
+         * 缩放
+         * @type {Array.<number>}
+         * @default [1, 1]
+         */
+        this.scale = [1, 1];
+    }
+    /**
+     * 旋转和缩放的原点
+     * @type {Array.<number>}
+     * @default null
+     */
+    this.origin = this.origin || null;
+};
+
+var transformableProto = Transformable.prototype;
+transformableProto.transform = null;
+
+/**
+ * 判断是否需要有坐标变换
+ * 如果有坐标变换, 则从position, rotation, scale以及父节点的transform计算出自身的transform矩阵
+ */
+transformableProto.needLocalTransform = function () {
+    return isNotAroundZero(this.rotation)
+        || isNotAroundZero(this.position[0])
+        || isNotAroundZero(this.position[1])
+        || isNotAroundZero(this.scale[0] - 1)
+        || isNotAroundZero(this.scale[1] - 1);
+};
+
+transformableProto.updateTransform = function () {
+    var parent = this.parent;
+    var parentHasTransform = parent && parent.transform;
+    var needLocalTransform = this.needLocalTransform();
+
+    var m = this.transform;
+    if (!(needLocalTransform || parentHasTransform)) {
+        m && mIdentity(m);
+        return;
+    }
+
+    m = m || create$1();
+
+    if (needLocalTransform) {
+        this.getLocalTransform(m);
+    }
+    else {
+        mIdentity(m);
+    }
+
+    // 应用父节点变换
+    if (parentHasTransform) {
+        if (needLocalTransform) {
+            mul$1(m, parent.transform, m);
+        }
+        else {
+            copy$1(m, parent.transform);
+        }
+    }
+    // 保存这个变换矩阵
+    this.transform = m;
+
+    this.invTransform = this.invTransform || create$1();
+    invert(this.invTransform, m);
+};
+
+transformableProto.getLocalTransform = function (m) {
+    return Transformable.getLocalTransform(this, m);
+};
+
+/**
+ * 将自己的transform应用到context上
+ * @param {CanvasRenderingContext2D} ctx
+ */
+transformableProto.setTransform = function (ctx) {
+    var m = this.transform;
+    var dpr = ctx.dpr || 1;
+    if (m) {
+        ctx.setTransform(dpr * m[0], dpr * m[1], dpr * m[2], dpr * m[3], dpr * m[4], dpr * m[5]);
+    }
+    else {
+        ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
+    }
+};
+
+transformableProto.restoreTransform = function (ctx) {
+    var dpr = ctx.dpr || 1;
+    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);
+};
+
+var tmpTransform = [];
+
+/**
+ * 分解`transform`矩阵到`position`, `rotation`, `scale`
+ */
+transformableProto.decomposeTransform = function () {
+    if (!this.transform) {
+        return;
+    }
+    var parent = this.parent;
+    var m = this.transform;
+    if (parent && parent.transform) {
+        // Get local transform and decompose them to position, scale, rotation
+        mul$1(tmpTransform, parent.invTransform, m);
+        m = tmpTransform;
+    }
+    var sx = m[0] * m[0] + m[1] * m[1];
+    var sy = m[2] * m[2] + m[3] * m[3];
+    var position = this.position;
+    var scale$$1 = this.scale;
+    if (isNotAroundZero(sx - 1)) {
+        sx = Math.sqrt(sx);
+    }
+    if (isNotAroundZero(sy - 1)) {
+        sy = Math.sqrt(sy);
+    }
+    if (m[0] < 0) {
+        sx = -sx;
+    }
+    if (m[3] < 0) {
+        sy = -sy;
+    }
+    position[0] = m[4];
+    position[1] = m[5];
+    scale$$1[0] = sx;
+    scale$$1[1] = sy;
+    this.rotation = Math.atan2(-m[1] / sy, m[0] / sx);
+};
+
+/**
+ * Get global scale
+ * @return {Array.<number>}
+ */
+transformableProto.getGlobalScale = function () {
+    var m = this.transform;
+    if (!m) {
+        return [1, 1];
+    }
+    var sx = Math.sqrt(m[0] * m[0] + m[1] * m[1]);
+    var sy = Math.sqrt(m[2] * m[2] + m[3] * m[3]);
+    if (m[0] < 0) {
+        sx = -sx;
+    }
+    if (m[3] < 0) {
+        sy = -sy;
+    }
+    return [sx, sy];
+};
+/**
+ * 变换坐标位置到 shape 的局部坐标空间
+ * @method
+ * @param {number} x
+ * @param {number} y
+ * @return {Array.<number>}
+ */
+transformableProto.transformCoordToLocal = function (x, y) {
+    var v2 = [x, y];
+    var invTransform = this.invTransform;
+    if (invTransform) {
+        applyTransform(v2, v2, invTransform);
+    }
+    return v2;
+};
+
+/**
+ * 变换局部坐标位置到全局坐标空间
+ * @method
+ * @param {number} x
+ * @param {number} y
+ * @return {Array.<number>}
+ */
+transformableProto.transformCoordToGlobal = function (x, y) {
+    var v2 = [x, y];
+    var transform = this.transform;
+    if (transform) {
+        applyTransform(v2, v2, transform);
+    }
+    return v2;
+};
+
+/**
+ * @static
+ * @param {Object} target
+ * @param {Array.<number>} target.origin
+ * @param {number} target.rotation
+ * @param {Array.<number>} target.position
+ * @param {Array.<number>} [m]
+ */
+Transformable.getLocalTransform = function (target, m) {
+    m = m || [];
+    mIdentity(m);
+
+    var origin = target.origin;
+    var scale$$1 = target.scale || [1, 1];
+    var rotation = target.rotation || 0;
+    var position = target.position || [0, 0];
+
+    if (origin) {
+        // Translate to origin
+        m[4] -= origin[0];
+        m[5] -= origin[1];
+    }
+    scale$1(m, m, scale$$1);
+    if (rotation) {
+        rotate(m, m, rotation);
+    }
+    if (origin) {
+        // Translate back from origin
+        m[4] += origin[0];
+        m[5] += origin[1];
+    }
+
+    m[4] += position[0];
+    m[5] += position[1];
+
+    return m;
+};
+
+/**
+ * 缓动代码来自 https://github.com/sole/tween.js/blob/master/src/Tween.js
+ * @see http://sole.github.io/tween.js/examples/03_graphs.html
+ * @exports zrender/animation/easing
+ */
+var easing = {
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    linear: function (k) {
+        return k;
+    },
+
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quadraticIn: function (k) {
+        return k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quadraticOut: function (k) {
+        return k * (2 - k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quadraticInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k;
+        }
+        return -0.5 * (--k * (k - 2) - 1);
+    },
+
+    // 三次方的缓动（t^3）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    cubicIn: function (k) {
+        return k * k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    cubicOut: function (k) {
+        return --k * k * k + 1;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    cubicInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k * k;
+        }
+        return 0.5 * ((k -= 2) * k * k + 2);
+    },
+
+    // 四次方的缓动（t^4）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quarticIn: function (k) {
+        return k * k * k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quarticOut: function (k) {
+        return 1 - (--k * k * k * k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quarticInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k * k * k;
+        }
+        return -0.5 * ((k -= 2) * k * k * k - 2);
+    },
+
+    // 五次方的缓动（t^5）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quinticIn: function (k) {
+        return k * k * k * k * k;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quinticOut: function (k) {
+        return --k * k * k * k * k + 1;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    quinticInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return 0.5 * k * k * k * k * k;
+        }
+        return 0.5 * ((k -= 2) * k * k * k * k + 2);
+    },
+
+    // 正弦曲线的缓动（sin(t)）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    sinusoidalIn: function (k) {
+        return 1 - Math.cos(k * Math.PI / 2);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    sinusoidalOut: function (k) {
+        return Math.sin(k * Math.PI / 2);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    sinusoidalInOut: function (k) {
+        return 0.5 * (1 - Math.cos(Math.PI * k));
+    },
+
+    // 指数曲线的缓动（2^t）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    exponentialIn: function (k) {
+        return k === 0 ? 0 : Math.pow(1024, k - 1);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    exponentialOut: function (k) {
+        return k === 1 ? 1 : 1 - Math.pow(2, -10 * k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    exponentialInOut: function (k) {
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if ((k *= 2) < 1) {
+            return 0.5 * Math.pow(1024, k - 1);
+        }
+        return 0.5 * (-Math.pow(2, -10 * (k - 1)) + 2);
+    },
+
+    // 圆形曲线的缓动（sqrt(1-t^2)）
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    circularIn: function (k) {
+        return 1 - Math.sqrt(1 - k * k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    circularOut: function (k) {
+        return Math.sqrt(1 - (--k * k));
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    circularInOut: function (k) {
+        if ((k *= 2) < 1) {
+            return -0.5 * (Math.sqrt(1 - k * k) - 1);
+        }
+        return 0.5 * (Math.sqrt(1 - (k -= 2) * k) + 1);
+    },
+
+    // 创建类似于弹簧在停止前来回振荡的动画
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    elasticIn: function (k) {
+        var s;
+        var a = 0.1;
+        var p = 0.4;
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if (!a || a < 1) {
+            a = 1; s = p / 4;
+        }
+        else {
+            s = p * Math.asin(1 / a) / (2 * Math.PI);
+        }
+        return -(a * Math.pow(2, 10 * (k -= 1)) *
+                    Math.sin((k - s) * (2 * Math.PI) / p));
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    elasticOut: function (k) {
+        var s;
+        var a = 0.1;
+        var p = 0.4;
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if (!a || a < 1) {
+            a = 1; s = p / 4;
+        }
+        else {
+            s = p * Math.asin(1 / a) / (2 * Math.PI);
+        }
+        return (a * Math.pow(2, -10 * k) *
+                Math.sin((k - s) * (2 * Math.PI) / p) + 1);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    elasticInOut: function (k) {
+        var s;
+        var a = 0.1;
+        var p = 0.4;
+        if (k === 0) {
+            return 0;
+        }
+        if (k === 1) {
+            return 1;
+        }
+        if (!a || a < 1) {
+            a = 1; s = p / 4;
+        }
+        else {
+            s = p * Math.asin(1 / a) / (2 * Math.PI);
+        }
+        if ((k *= 2) < 1) {
+            return -0.5 * (a * Math.pow(2, 10 * (k -= 1))
+                * Math.sin((k - s) * (2 * Math.PI) / p));
+        }
+        return a * Math.pow(2, -10 * (k -= 1))
+                * Math.sin((k - s) * (2 * Math.PI) / p) * 0.5 + 1;
+
+    },
+
+    // 在某一动画开始沿指示的路径进行动画处理前稍稍收回该动画的移动
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    backIn: function (k) {
+        var s = 1.70158;
+        return k * k * ((s + 1) * k - s);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    backOut: function (k) {
+        var s = 1.70158;
+        return --k * k * ((s + 1) * k + s) + 1;
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    backInOut: function (k) {
+        var s = 1.70158 * 1.525;
+        if ((k *= 2) < 1) {
+            return 0.5 * (k * k * ((s + 1) * k - s));
+        }
+        return 0.5 * ((k -= 2) * k * ((s + 1) * k + s) + 2);
+    },
+
+    // 创建弹跳效果
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    bounceIn: function (k) {
+        return 1 - easing.bounceOut(1 - k);
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    bounceOut: function (k) {
+        if (k < (1 / 2.75)) {
+            return 7.5625 * k * k;
+        }
+        else if (k < (2 / 2.75)) {
+            return 7.5625 * (k -= (1.5 / 2.75)) * k + 0.75;
+        }
+        else if (k < (2.5 / 2.75)) {
+            return 7.5625 * (k -= (2.25 / 2.75)) * k + 0.9375;
+        }
+        else {
+            return 7.5625 * (k -= (2.625 / 2.75)) * k + 0.984375;
+        }
+    },
+    /**
+    * @param {number} k
+    * @return {number}
+    */
+    bounceInOut: function (k) {
+        if (k < 0.5) {
+            return easing.bounceIn(k * 2) * 0.5;
+        }
+        return easing.bounceOut(k * 2 - 1) * 0.5 + 0.5;
+    }
+};
+
+/**
+ * 动画主控制器
+ * @config target 动画对象，可以是数组，如果是数组的话会批量分发onframe等事件
+ * @config life(1000) 动画时长
+ * @config delay(0) 动画延迟时间
+ * @config loop(true)
+ * @config gap(0) 循环的间隔时间
+ * @config onframe
+ * @config easing(optional)
+ * @config ondestroy(optional)
+ * @config onrestart(optional)
+ *
+ * TODO pause
+ */
+
+function Clip(options) {
+
+    this._target = options.target;
+
+    // 生命周期
+    this._life = options.life || 1000;
+    // 延时
+    this._delay = options.delay || 0;
+    // 开始时间
+    // this._startTime = new Date().getTime() + this._delay;// 单位毫秒
+    this._initialized = false;
+
+    // 是否循环
+    this.loop = options.loop == null ? false : options.loop;
+
+    this.gap = options.gap || 0;
+
+    this.easing = options.easing || 'Linear';
+
+    this.onframe = options.onframe;
+    this.ondestroy = options.ondestroy;
+    this.onrestart = options.onrestart;
+
+    this._pausedTime = 0;
+    this._paused = false;
+}
+
+Clip.prototype = {
+
+    constructor: Clip,
+
+    step: function (globalTime, deltaTime) {
+        // Set startTime on first step, or _startTime may has milleseconds different between clips
+        // PENDING
+        if (!this._initialized) {
+            this._startTime = globalTime + this._delay;
+            this._initialized = true;
+        }
+
+        if (this._paused) {
+            this._pausedTime += deltaTime;
+            return;
+        }
+
+        var percent = (globalTime - this._startTime - this._pausedTime) / this._life;
+
+        // 还没开始
+        if (percent < 0) {
+            return;
+        }
+
+        percent = Math.min(percent, 1);
+
+        var easing$$1 = this.easing;
+        var easingFunc = typeof easing$$1 == 'string' ? easing[easing$$1] : easing$$1;
+        var schedule = typeof easingFunc === 'function'
+            ? easingFunc(percent)
+            : percent;
+
+        this.fire('frame', schedule);
+
+        // 结束
+        if (percent == 1) {
+            if (this.loop) {
+                this.restart (globalTime);
+                // 重新开始周期
+                // 抛出而不是直接调用事件直到 stage.update 后再统一调用这些事件
+                return 'restart';
+            }
+
+            // 动画完成将这个控制器标识为待删除
+            // 在Animation.update中进行批量删除
+            this._needsRemove = true;
+            return 'destroy';
+        }
+
+        return null;
+    },
+
+    restart: function (globalTime) {
+        var remainder = (globalTime - this._startTime - this._pausedTime) % this._life;
+        this._startTime = globalTime - remainder + this.gap;
+        this._pausedTime = 0;
+
+        this._needsRemove = false;
+    },
+
+    fire: function (eventType, arg) {
+        eventType = 'on' + eventType;
+        if (this[eventType]) {
+            this[eventType](this._target, arg);
+        }
+    },
+
+    pause: function () {
+        this._paused = true;
+    },
+
+    resume: function () {
+        this._paused = false;
+    }
+};
+
+// Simple LRU cache use doubly linked list
+// @module zrender/core/LRU
+
+/**
+ * Simple double linked list. Compared with array, it has O(1) remove operation.
+ * @constructor
+ */
+var LinkedList = function () {
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.head = null;
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.tail = null;
+
+    this._len = 0;
+};
+
+var linkedListProto = LinkedList.prototype;
+/**
+ * Insert a new value at the tail
+ * @param  {} val
+ * @return {module:zrender/core/LRU~Entry}
+ */
+linkedListProto.insert = function (val) {
+    var entry = new Entry(val);
+    this.insertEntry(entry);
+    return entry;
+};
+
+/**
+ * Insert an entry at the tail
+ * @param  {module:zrender/core/LRU~Entry} entry
+ */
+linkedListProto.insertEntry = function (entry) {
+    if (!this.head) {
+        this.head = this.tail = entry;
+    }
+    else {
+        this.tail.next = entry;
+        entry.prev = this.tail;
+        entry.next = null;
+        this.tail = entry;
+    }
+    this._len++;
+};
+
+/**
+ * Remove entry.
+ * @param  {module:zrender/core/LRU~Entry} entry
+ */
+linkedListProto.remove = function (entry) {
+    var prev = entry.prev;
+    var next = entry.next;
+    if (prev) {
+        prev.next = next;
+    }
+    else {
+        // Is head
+        this.head = next;
+    }
+    if (next) {
+        next.prev = prev;
+    }
+    else {
+        // Is tail
+        this.tail = prev;
+    }
+    entry.next = entry.prev = null;
+    this._len--;
+};
+
+/**
+ * @return {number}
+ */
+linkedListProto.len = function () {
+    return this._len;
+};
+
+/**
+ * Clear list
+ */
+linkedListProto.clear = function () {
+    this.head = this.tail = null;
+    this._len = 0;
+};
+
+/**
+ * @constructor
+ * @param {} val
+ */
+var Entry = function (val) {
+    /**
+     * @type {}
+     */
+    this.value = val;
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.next;
+
+    /**
+     * @type {module:zrender/core/LRU~Entry}
+     */
+    this.prev;
+};
+
+/**
+ * LRU Cache
+ * @constructor
+ * @alias module:zrender/core/LRU
+ */
+var LRU = function (maxSize) {
+
+    this._list = new LinkedList();
+
+    this._map = {};
+
+    this._maxSize = maxSize || 10;
+
+    this._lastRemovedEntry = null;
+};
+
+var LRUProto = LRU.prototype;
+
+/**
+ * @param  {string} key
+ * @param  {} value
+ * @return {} Removed value
+ */
+LRUProto.put = function (key, value) {
+    var list = this._list;
+    var map = this._map;
+    var removed = null;
+    if (map[key] == null) {
+        var len = list.len();
+        // Reuse last removed entry
+        var entry = this._lastRemovedEntry;
+
+        if (len >= this._maxSize && len > 0) {
+            // Remove the least recently used
+            var leastUsedEntry = list.head;
+            list.remove(leastUsedEntry);
+            delete map[leastUsedEntry.key];
+
+            removed = leastUsedEntry.value;
+            this._lastRemovedEntry = leastUsedEntry;
+        }
+
+        if (entry) {
+            entry.value = value;
+        }
+        else {
+            entry = new Entry(value);
+        }
+        entry.key = key;
+        list.insertEntry(entry);
+        map[key] = entry;
+    }
+
+    return removed;
+};
+
+/**
+ * @param  {string} key
+ * @return {}
+ */
+LRUProto.get = function (key) {
+    var entry = this._map[key];
+    var list = this._list;
+    if (entry != null) {
+        // Put the latest used entry in the tail
+        if (entry !== list.tail) {
+            list.remove(entry);
+            list.insertEntry(entry);
+        }
+
+        return entry.value;
+    }
+};
+
+/**
+ * Clear the cache
+ */
+LRUProto.clear = function () {
+    this._list.clear();
+    this._map = {};
+};
+
+var kCSSColorTable = {
+    'transparent': [0,0,0,0], 'aliceblue': [240,248,255,1],
+    'antiquewhite': [250,235,215,1], 'aqua': [0,255,255,1],
+    'aquamarine': [127,255,212,1], 'azure': [240,255,255,1],
+    'beige': [245,245,220,1], 'bisque': [255,228,196,1],
+    'black': [0,0,0,1], 'blanchedalmond': [255,235,205,1],
+    'blue': [0,0,255,1], 'blueviolet': [138,43,226,1],
+    'brown': [165,42,42,1], 'burlywood': [222,184,135,1],
+    'cadetblue': [95,158,160,1], 'chartreuse': [127,255,0,1],
+    'chocolate': [210,105,30,1], 'coral': [255,127,80,1],
+    'cornflowerblue': [100,149,237,1], 'cornsilk': [255,248,220,1],
+    'crimson': [220,20,60,1], 'cyan': [0,255,255,1],
+    'darkblue': [0,0,139,1], 'darkcyan': [0,139,139,1],
+    'darkgoldenrod': [184,134,11,1], 'darkgray': [169,169,169,1],
+    'darkgreen': [0,100,0,1], 'darkgrey': [169,169,169,1],
+    'darkkhaki': [189,183,107,1], 'darkmagenta': [139,0,139,1],
+    'darkolivegreen': [85,107,47,1], 'darkorange': [255,140,0,1],
+    'darkorchid': [153,50,204,1], 'darkred': [139,0,0,1],
+    'darksalmon': [233,150,122,1], 'darkseagreen': [143,188,143,1],
+    'darkslateblue': [72,61,139,1], 'darkslategray': [47,79,79,1],
+    'darkslategrey': [47,79,79,1], 'darkturquoise': [0,206,209,1],
+    'darkviolet': [148,0,211,1], 'deeppink': [255,20,147,1],
+    'deepskyblue': [0,191,255,1], 'dimgray': [105,105,105,1],
+    'dimgrey': [105,105,105,1], 'dodgerblue': [30,144,255,1],
+    'firebrick': [178,34,34,1], 'floralwhite': [255,250,240,1],
+    'forestgreen': [34,139,34,1], 'fuchsia': [255,0,255,1],
+    'gainsboro': [220,220,220,1], 'ghostwhite': [248,248,255,1],
+    'gold': [255,215,0,1], 'goldenrod': [218,165,32,1],
+    'gray': [128,128,128,1], 'green': [0,128,0,1],
+    'greenyellow': [173,255,47,1], 'grey': [128,128,128,1],
+    'honeydew': [240,255,240,1], 'hotpink': [255,105,180,1],
+    'indianred': [205,92,92,1], 'indigo': [75,0,130,1],
+    'ivory': [255,255,240,1], 'khaki': [240,230,140,1],
+    'lavender': [230,230,250,1], 'lavenderblush': [255,240,245,1],
+    'lawngreen': [124,252,0,1], 'lemonchiffon': [255,250,205,1],
+    'lightblue': [173,216,230,1], 'lightcoral': [240,128,128,1],
+    'lightcyan': [224,255,255,1], 'lightgoldenrodyellow': [250,250,210,1],
+    'lightgray': [211,211,211,1], 'lightgreen': [144,238,144,1],
+    'lightgrey': [211,211,211,1], 'lightpink': [255,182,193,1],
+    'lightsalmon': [255,160,122,1], 'lightseagreen': [32,178,170,1],
+    'lightskyblue': [135,206,250,1], 'lightslategray': [119,136,153,1],
+    'lightslategrey': [119,136,153,1], 'lightsteelblue': [176,196,222,1],
+    'lightyellow': [255,255,224,1], 'lime': [0,255,0,1],
+    'limegreen': [50,205,50,1], 'linen': [250,240,230,1],
+    'magenta': [255,0,255,1], 'maroon': [128,0,0,1],
+    'mediumaquamarine': [102,205,170,1], 'mediumblue': [0,0,205,1],
+    'mediumorchid': [186,85,211,1], 'mediumpurple': [147,112,219,1],
+    'mediumseagreen': [60,179,113,1], 'mediumslateblue': [123,104,238,1],
+    'mediumspringgreen': [0,250,154,1], 'mediumturquoise': [72,209,204,1],
+    'mediumvioletred': [199,21,133,1], 'midnightblue': [25,25,112,1],
+    'mintcream': [245,255,250,1], 'mistyrose': [255,228,225,1],
+    'moccasin': [255,228,181,1], 'navajowhite': [255,222,173,1],
+    'navy': [0,0,128,1], 'oldlace': [253,245,230,1],
+    'olive': [128,128,0,1], 'olivedrab': [107,142,35,1],
+    'orange': [255,165,0,1], 'orangered': [255,69,0,1],
+    'orchid': [218,112,214,1], 'palegoldenrod': [238,232,170,1],
+    'palegreen': [152,251,152,1], 'paleturquoise': [175,238,238,1],
+    'palevioletred': [219,112,147,1], 'papayawhip': [255,239,213,1],
+    'peachpuff': [255,218,185,1], 'peru': [205,133,63,1],
+    'pink': [255,192,203,1], 'plum': [221,160,221,1],
+    'powderblue': [176,224,230,1], 'purple': [128,0,128,1],
+    'red': [255,0,0,1], 'rosybrown': [188,143,143,1],
+    'royalblue': [65,105,225,1], 'saddlebrown': [139,69,19,1],
+    'salmon': [250,128,114,1], 'sandybrown': [244,164,96,1],
+    'seagreen': [46,139,87,1], 'seashell': [255,245,238,1],
+    'sienna': [160,82,45,1], 'silver': [192,192,192,1],
+    'skyblue': [135,206,235,1], 'slateblue': [106,90,205,1],
+    'slategray': [112,128,144,1], 'slategrey': [112,128,144,1],
+    'snow': [255,250,250,1], 'springgreen': [0,255,127,1],
+    'steelblue': [70,130,180,1], 'tan': [210,180,140,1],
+    'teal': [0,128,128,1], 'thistle': [216,191,216,1],
+    'tomato': [255,99,71,1], 'turquoise': [64,224,208,1],
+    'violet': [238,130,238,1], 'wheat': [245,222,179,1],
+    'white': [255,255,255,1], 'whitesmoke': [245,245,245,1],
+    'yellow': [255,255,0,1], 'yellowgreen': [154,205,50,1]
+};
+
+function clampCssByte(i) {  // Clamp to integer 0 .. 255.
+    i = Math.round(i);  // Seems to be what Chrome does (vs truncation).
+    return i < 0 ? 0 : i > 255 ? 255 : i;
+}
+
+function clampCssAngle(i) {  // Clamp to integer 0 .. 360.
+    i = Math.round(i);  // Seems to be what Chrome does (vs truncation).
+    return i < 0 ? 0 : i > 360 ? 360 : i;
+}
+
+function clampCssFloat(f) {  // Clamp to float 0.0 .. 1.0.
+    return f < 0 ? 0 : f > 1 ? 1 : f;
+}
+
+function parseCssInt(str) {  // int or percentage.
+    if (str.length && str.charAt(str.length - 1) === '%') {
+        return clampCssByte(parseFloat(str) / 100 * 255);
+    }
+    return clampCssByte(parseInt(str, 10));
+}
+
+function parseCssFloat(str) {  // float or percentage.
+    if (str.length && str.charAt(str.length - 1) === '%') {
+        return clampCssFloat(parseFloat(str) / 100);
+    }
+    return clampCssFloat(parseFloat(str));
+}
+
+function cssHueToRgb(m1, m2, h) {
+    if (h < 0) {
+        h += 1;
+    }
+    else if (h > 1) {
+        h -= 1;
+    }
+
+    if (h * 6 < 1) {
+        return m1 + (m2 - m1) * h * 6;
+    }
+    if (h * 2 < 1) {
+        return m2;
+    }
+    if (h * 3 < 2) {
+        return m1 + (m2 - m1) * (2/3 - h) * 6;
+    }
+    return m1;
+}
+
+function lerpNumber(a, b, p) {
+    return a + (b - a) * p;
+}
+
+function setRgba(out, r, g, b, a) {
+    out[0] = r; out[1] = g; out[2] = b; out[3] = a;
+    return out;
+}
+function copyRgba(out, a) {
+    out[0] = a[0]; out[1] = a[1]; out[2] = a[2]; out[3] = a[3];
+    return out;
+}
+
+var colorCache = new LRU(20);
+var lastRemovedArr = null;
+
+function putToCache(colorStr, rgbaArr) {
+    // Reuse removed array
+    if (lastRemovedArr) {
+        copyRgba(lastRemovedArr, rgbaArr);
+    }
+    lastRemovedArr = colorCache.put(colorStr, lastRemovedArr || (rgbaArr.slice()));
+}
+
+/**
+ * @param {string} colorStr
+ * @param {Array.<number>} out
+ * @return {Array.<number>}
+ * @memberOf module:zrender/util/color
+ */
+function parse(colorStr, rgbaArr) {
+    if (!colorStr) {
+        return;
+    }
+    rgbaArr = rgbaArr || [];
+
+    var cached = colorCache.get(colorStr);
+    if (cached) {
+        return copyRgba(rgbaArr, cached);
+    }
+
+    // colorStr may be not string
+    colorStr = colorStr + '';
+    // Remove all whitespace, not compliant, but should just be more accepting.
+    var str = colorStr.replace(/ /g, '').toLowerCase();
+
+    // Color keywords (and transparent) lookup.
+    if (str in kCSSColorTable) {
+        copyRgba(rgbaArr, kCSSColorTable[str]);
+        putToCache(colorStr, rgbaArr);
+        return rgbaArr;
+    }
+
+    // #abc and #abc123 syntax.
+    if (str.charAt(0) === '#') {
+        if (str.length === 4) {
+            var iv = parseInt(str.substr(1), 16);  // TODO(deanm): Stricter parsing.
+            if (!(iv >= 0 && iv <= 0xfff)) {
+                setRgba(rgbaArr, 0, 0, 0, 1);
+                return;  // Covers NaN.
+            }
+            setRgba(rgbaArr,
+                ((iv & 0xf00) >> 4) | ((iv & 0xf00) >> 8),
+                (iv & 0xf0) | ((iv & 0xf0) >> 4),
+                (iv & 0xf) | ((iv & 0xf) << 4),
+                1
+            );
+            putToCache(colorStr, rgbaArr);
+            return rgbaArr;
+        }
+        else if (str.length === 7) {
+            var iv = parseInt(str.substr(1), 16);  // TODO(deanm): Stricter parsing.
+            if (!(iv >= 0 && iv <= 0xffffff)) {
+                setRgba(rgbaArr, 0, 0, 0, 1);
+                return;  // Covers NaN.
+            }
+            setRgba(rgbaArr,
+                (iv & 0xff0000) >> 16,
+                (iv & 0xff00) >> 8,
+                iv & 0xff,
+                1
+            );
+            putToCache(colorStr, rgbaArr);
+            return rgbaArr;
+        }
+
+        return;
+    }
+    var op = str.indexOf('('), ep = str.indexOf(')');
+    if (op !== -1 && ep + 1 === str.length) {
+        var fname = str.substr(0, op);
+        var params = str.substr(op + 1, ep - (op + 1)).split(',');
+        var alpha = 1;  // To allow case fallthrough.
+        switch (fname) {
+            case 'rgba':
+                if (params.length !== 4) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                alpha = parseCssFloat(params.pop()); // jshint ignore:line
+            // Fall through.
+            case 'rgb':
+                if (params.length !== 3) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                setRgba(rgbaArr,
+                    parseCssInt(params[0]),
+                    parseCssInt(params[1]),
+                    parseCssInt(params[2]),
+                    alpha
+                );
+                putToCache(colorStr, rgbaArr);
+                return rgbaArr;
+            case 'hsla':
+                if (params.length !== 4) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                params[3] = parseCssFloat(params[3]);
+                hsla2rgba(params, rgbaArr);
+                putToCache(colorStr, rgbaArr);
+                return rgbaArr;
+            case 'hsl':
+                if (params.length !== 3) {
+                    setRgba(rgbaArr, 0, 0, 0, 1);
+                    return;
+                }
+                hsla2rgba(params, rgbaArr);
+                putToCache(colorStr, rgbaArr);
+                return rgbaArr;
+            default:
+                return;
+        }
+    }
+
+    setRgba(rgbaArr, 0, 0, 0, 1);
+    return;
+}
+
+/**
+ * @param {Array.<number>} hsla
+ * @param {Array.<number>} rgba
+ * @return {Array.<number>} rgba
+ */
+function hsla2rgba(hsla, rgba) {
+    var h = (((parseFloat(hsla[0]) % 360) + 360) % 360) / 360;  // 0 .. 1
+    // NOTE(deanm): According to the CSS spec s/l should only be
+    // percentages, but we don't bother and let float or percentage.
+    var s = parseCssFloat(hsla[1]);
+    var l = parseCssFloat(hsla[2]);
+    var m2 = l <= 0.5 ? l * (s + 1) : l + s - l * s;
+    var m1 = l * 2 - m2;
+
+    rgba = rgba || [];
+    setRgba(rgba,
+        clampCssByte(cssHueToRgb(m1, m2, h + 1 / 3) * 255),
+        clampCssByte(cssHueToRgb(m1, m2, h) * 255),
+        clampCssByte(cssHueToRgb(m1, m2, h - 1 / 3) * 255),
+        1
+    );
+
+    if (hsla.length === 4) {
+        rgba[3] = hsla[3];
+    }
+
+    return rgba;
+}
+
+/**
+ * @param {Array.<number>} rgba
+ * @return {Array.<number>} hsla
+ */
+function rgba2hsla(rgba) {
+    if (!rgba) {
+        return;
+    }
+
+    // RGB from 0 to 255
+    var R = rgba[0] / 255;
+    var G = rgba[1] / 255;
+    var B = rgba[2] / 255;
+
+    var vMin = Math.min(R, G, B); // Min. value of RGB
+    var vMax = Math.max(R, G, B); // Max. value of RGB
+    var delta = vMax - vMin; // Delta RGB value
+
+    var L = (vMax + vMin) / 2;
+    var H;
+    var S;
+    // HSL results from 0 to 1
+    if (delta === 0) {
+        H = 0;
+        S = 0;
+    }
+    else {
+        if (L < 0.5) {
+            S = delta / (vMax + vMin);
+        }
+        else {
+            S = delta / (2 - vMax - vMin);
+        }
+
+        var deltaR = (((vMax - R) / 6) + (delta / 2)) / delta;
+        var deltaG = (((vMax - G) / 6) + (delta / 2)) / delta;
+        var deltaB = (((vMax - B) / 6) + (delta / 2)) / delta;
+
+        if (R === vMax) {
+            H = deltaB - deltaG;
+        }
+        else if (G === vMax) {
+            H = (1 / 3) + deltaR - deltaB;
+        }
+        else if (B === vMax) {
+            H = (2 / 3) + deltaG - deltaR;
+        }
+
+        if (H < 0) {
+            H += 1;
+        }
+
+        if (H > 1) {
+            H -= 1;
+        }
+    }
+
+    var hsla = [H * 360, S, L];
+
+    if (rgba[3] != null) {
+        hsla.push(rgba[3]);
+    }
+
+    return hsla;
+}
+
+/**
+ * @param {string} color
+ * @param {number} level
+ * @return {string}
+ * @memberOf module:zrender/util/color
+ */
+function lift(color, level) {
+    var colorArr = parse(color);
+    if (colorArr) {
+        for (var i = 0; i < 3; i++) {
+            if (level < 0) {
+                colorArr[i] = colorArr[i] * (1 - level) | 0;
+            }
+            else {
+                colorArr[i] = ((255 - colorArr[i]) * level + colorArr[i]) | 0;
+            }
+            if (colorArr[i] > 255) {
+                colorArr[i] = 255;
+            }
+            else if (color[i] < 0) {
+                colorArr[i] = 0;
+            }
+        }
+        return stringify(colorArr, colorArr.length === 4 ? 'rgba' : 'rgb');
+    }
+}
+
+/**
+ * @param {string} color
+ * @return {string}
+ * @memberOf module:zrender/util/color
+ */
+function toHex(color) {
+    var colorArr = parse(color);
+    if (colorArr) {
+        return ((1 << 24) + (colorArr[0] << 16) + (colorArr[1] << 8) + (+colorArr[2])).toString(16).slice(1);
+    }
+}
+
+/**
+ * Map value to color. Faster than lerp methods because color is represented by rgba array.
+ * @param {number} normalizedValue A float between 0 and 1.
+ * @param {Array.<Array.<number>>} colors List of rgba color array
+ * @param {Array.<number>} [out] Mapped gba color array
+ * @return {Array.<number>} will be null/undefined if input illegal.
+ */
+function fastLerp(normalizedValue, colors, out) {
+    if (!(colors && colors.length)
+        || !(normalizedValue >= 0 && normalizedValue <= 1)
+    ) {
+        return;
+    }
+
+    out = out || [];
+
+    var value = normalizedValue * (colors.length - 1);
+    var leftIndex = Math.floor(value);
+    var rightIndex = Math.ceil(value);
+    var leftColor = colors[leftIndex];
+    var rightColor = colors[rightIndex];
+    var dv = value - leftIndex;
+    out[0] = clampCssByte(lerpNumber(leftColor[0], rightColor[0], dv));
+    out[1] = clampCssByte(lerpNumber(leftColor[1], rightColor[1], dv));
+    out[2] = clampCssByte(lerpNumber(leftColor[2], rightColor[2], dv));
+    out[3] = clampCssFloat(lerpNumber(leftColor[3], rightColor[3], dv));
+
+    return out;
+}
+
+/**
+ * @deprecated
+ */
+var fastMapToColor = fastLerp;
+
+/**
+ * @param {number} normalizedValue A float between 0 and 1.
+ * @param {Array.<string>} colors Color list.
+ * @param {boolean=} fullOutput Default false.
+ * @return {(string|Object)} Result color. If fullOutput,
+ *                           return {color: ..., leftIndex: ..., rightIndex: ..., value: ...},
+ * @memberOf module:zrender/util/color
+ */
+function lerp$1(normalizedValue, colors, fullOutput) {
+    if (!(colors && colors.length)
+        || !(normalizedValue >= 0 && normalizedValue <= 1)
+    ) {
+        return;
+    }
+
+    var value = normalizedValue * (colors.length - 1);
+    var leftIndex = Math.floor(value);
+    var rightIndex = Math.ceil(value);
+    var leftColor = parse(colors[leftIndex]);
+    var rightColor = parse(colors[rightIndex]);
+    var dv = value - leftIndex;
+
+    var color = stringify(
+        [
+            clampCssByte(lerpNumber(leftColor[0], rightColor[0], dv)),
+            clampCssByte(lerpNumber(leftColor[1], rightColor[1], dv)),
+            clampCssByte(lerpNumber(leftColor[2], rightColor[2], dv)),
+            clampCssFloat(lerpNumber(leftColor[3], rightColor[3], dv))
+        ],
+        'rgba'
+    );
+
+    return fullOutput
+        ? {
+            color: color,
+            leftIndex: leftIndex,
+            rightIndex: rightIndex,
+            value: value
+        }
+        : color;
+}
+
+/**
+ * @deprecated
+ */
+var mapToColor = lerp$1;
+
+/**
+ * @param {string} color
+ * @param {number=} h 0 ~ 360, ignore when null.
+ * @param {number=} s 0 ~ 1, ignore when null.
+ * @param {number=} l 0 ~ 1, ignore when null.
+ * @return {string} Color string in rgba format.
+ * @memberOf module:zrender/util/color
+ */
+function modifyHSL(color, h, s, l) {
+    color = parse(color);
+
+    if (color) {
+        color = rgba2hsla(color);
+        h != null && (color[0] = clampCssAngle(h));
+        s != null && (color[1] = parseCssFloat(s));
+        l != null && (color[2] = parseCssFloat(l));
+
+        return stringify(hsla2rgba(color), 'rgba');
+    }
+}
+
+/**
+ * @param {string} color
+ * @param {number=} alpha 0 ~ 1
+ * @return {string} Color string in rgba format.
+ * @memberOf module:zrender/util/color
+ */
+function modifyAlpha(color, alpha) {
+    color = parse(color);
+
+    if (color && alpha != null) {
+        color[3] = clampCssFloat(alpha);
+        return stringify(color, 'rgba');
+    }
+}
+
+/**
+ * @param {Array.<number>} arrColor like [12,33,44,0.4]
+ * @param {string} type 'rgba', 'hsva', ...
+ * @return {string} Result color. (If input illegal, return undefined).
+ */
+function stringify(arrColor, type) {
+    if (!arrColor || !arrColor.length) {
+        return;
+    }
+    var colorStr = arrColor[0] + ',' + arrColor[1] + ',' + arrColor[2];
+    if (type === 'rgba' || type === 'hsva' || type === 'hsla') {
+        colorStr += ',' + arrColor[3];
+    }
+    return type + '(' + colorStr + ')';
+}
+
+
+var color = (Object.freeze || Object)({
+	parse: parse,
+	lift: lift,
+	toHex: toHex,
+	fastLerp: fastLerp,
+	fastMapToColor: fastMapToColor,
+	lerp: lerp$1,
+	mapToColor: mapToColor,
+	modifyHSL: modifyHSL,
+	modifyAlpha: modifyAlpha,
+	stringify: stringify
+});
+
+/**
+ * @module echarts/animation/Animator
+ */
+
+var arraySlice = Array.prototype.slice;
+
+function defaultGetter(target, key) {
+    return target[key];
+}
+
+function defaultSetter(target, key, value) {
+    target[key] = value;
+}
+
+/**
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} percent
+ * @return {number}
+ */
+function interpolateNumber(p0, p1, percent) {
+    return (p1 - p0) * percent + p0;
+}
+
+/**
+ * @param  {string} p0
+ * @param  {string} p1
+ * @param  {number} percent
+ * @return {string}
+ */
+function interpolateString(p0, p1, percent) {
+    return percent > 0.5 ? p1 : p0;
+}
+
+/**
+ * @param  {Array} p0
+ * @param  {Array} p1
+ * @param  {number} percent
+ * @param  {Array} out
+ * @param  {number} arrDim
+ */
+function interpolateArray(p0, p1, percent, out, arrDim) {
+    var len = p0.length;
+    if (arrDim == 1) {
+        for (var i = 0; i < len; i++) {
+            out[i] = interpolateNumber(p0[i], p1[i], percent);
+        }
+    }
+    else {
+        var len2 = len && p0[0].length;
+        for (var i = 0; i < len; i++) {
+            for (var j = 0; j < len2; j++) {
+                out[i][j] = interpolateNumber(
+                    p0[i][j], p1[i][j], percent
+                );
+            }
+        }
+    }
+}
+
+// arr0 is source array, arr1 is target array.
+// Do some preprocess to avoid error happened when interpolating from arr0 to arr1
+function fillArr(arr0, arr1, arrDim) {
+    var arr0Len = arr0.length;
+    var arr1Len = arr1.length;
+    if (arr0Len !== arr1Len) {
+        // FIXME Not work for TypedArray
+        var isPreviousLarger = arr0Len > arr1Len;
+        if (isPreviousLarger) {
+            // Cut the previous
+            arr0.length = arr1Len;
+        }
+        else {
+            // Fill the previous
+            for (var i = arr0Len; i < arr1Len; i++) {
+                arr0.push(
+                    arrDim === 1 ? arr1[i] : arraySlice.call(arr1[i])
+                );
+            }
+        }
+    }
+    // Handling NaN value
+    var len2 = arr0[0] && arr0[0].length;
+    for (var i = 0; i < arr0.length; i++) {
+        if (arrDim === 1) {
+            if (isNaN(arr0[i])) {
+                arr0[i] = arr1[i];
+            }
+        }
+        else {
+            for (var j = 0; j < len2; j++) {
+                if (isNaN(arr0[i][j])) {
+                    arr0[i][j] = arr1[i][j];
+                }
+            }
+        }
+    }
+}
+
+/**
+ * @param  {Array} arr0
+ * @param  {Array} arr1
+ * @param  {number} arrDim
+ * @return {boolean}
+ */
+function isArraySame(arr0, arr1, arrDim) {
+    if (arr0 === arr1) {
+        return true;
+    }
+    var len = arr0.length;
+    if (len !== arr1.length) {
+        return false;
+    }
+    if (arrDim === 1) {
+        for (var i = 0; i < len; i++) {
+            if (arr0[i] !== arr1[i]) {
+                return false;
+            }
+        }
+    }
+    else {
+        var len2 = arr0[0].length;
+        for (var i = 0; i < len; i++) {
+            for (var j = 0; j < len2; j++) {
+                if (arr0[i][j] !== arr1[i][j]) {
+                    return false;
+                }
+            }
+        }
+    }
+    return true;
+}
+
+/**
+ * Catmull Rom interpolate array
+ * @param  {Array} p0
+ * @param  {Array} p1
+ * @param  {Array} p2
+ * @param  {Array} p3
+ * @param  {number} t
+ * @param  {number} t2
+ * @param  {number} t3
+ * @param  {Array} out
+ * @param  {number} arrDim
+ */
+function catmullRomInterpolateArray(
+    p0, p1, p2, p3, t, t2, t3, out, arrDim
+) {
+    var len = p0.length;
+    if (arrDim == 1) {
+        for (var i = 0; i < len; i++) {
+            out[i] = catmullRomInterpolate(
+                p0[i], p1[i], p2[i], p3[i], t, t2, t3
+            );
+        }
+    }
+    else {
+        var len2 = p0[0].length;
+        for (var i = 0; i < len; i++) {
+            for (var j = 0; j < len2; j++) {
+                out[i][j] = catmullRomInterpolate(
+                    p0[i][j], p1[i][j], p2[i][j], p3[i][j],
+                    t, t2, t3
+                );
+            }
+        }
+    }
+}
+
+/**
+ * Catmull Rom interpolate number
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @param  {number} t2
+ * @param  {number} t3
+ * @return {number}
+ */
+function catmullRomInterpolate(p0, p1, p2, p3, t, t2, t3) {
+    var v0 = (p2 - p0) * 0.5;
+    var v1 = (p3 - p1) * 0.5;
+    return (2 * (p1 - p2) + v0 + v1) * t3
+            + (-3 * (p1 - p2) - 2 * v0 - v1) * t2
+            + v0 * t + p1;
+}
+
+function cloneValue(value) {
+    if (isArrayLike(value)) {
+        var len = value.length;
+        if (isArrayLike(value[0])) {
+            var ret = [];
+            for (var i = 0; i < len; i++) {
+                ret.push(arraySlice.call(value[i]));
+            }
+            return ret;
+        }
+
+        return arraySlice.call(value);
+    }
+
+    return value;
+}
+
+function rgba2String(rgba) {
+    rgba[0] = Math.floor(rgba[0]);
+    rgba[1] = Math.floor(rgba[1]);
+    rgba[2] = Math.floor(rgba[2]);
+
+    return 'rgba(' + rgba.join(',') + ')';
+}
+
+function getArrayDim(keyframes) {
+    var lastValue = keyframes[keyframes.length - 1].value;
+    return isArrayLike(lastValue && lastValue[0]) ? 2 : 1;
+}
+
+function createTrackClip(animator, easing, oneTrackDone, keyframes, propName, forceAnimate) {
+    var getter = animator._getter;
+    var setter = animator._setter;
+    var useSpline = easing === 'spline';
+
+    var trackLen = keyframes.length;
+    if (!trackLen) {
+        return;
+    }
+    // Guess data type
+    var firstVal = keyframes[0].value;
+    var isValueArray = isArrayLike(firstVal);
+    var isValueColor = false;
+    var isValueString = false;
+
+    // For vertices morphing
+    var arrDim = isValueArray ? getArrayDim(keyframes) : 0;
+
+    var trackMaxTime;
+    // Sort keyframe as ascending
+    keyframes.sort(function(a, b) {
+        return a.time - b.time;
+    });
+
+    trackMaxTime = keyframes[trackLen - 1].time;
+    // Percents of each keyframe
+    var kfPercents = [];
+    // Value of each keyframe
+    var kfValues = [];
+    var prevValue = keyframes[0].value;
+    var isAllValueEqual = true;
+    for (var i = 0; i < trackLen; i++) {
+        kfPercents.push(keyframes[i].time / trackMaxTime);
+        // Assume value is a color when it is a string
+        var value = keyframes[i].value;
+
+        // Check if value is equal, deep check if value is array
+        if (!((isValueArray && isArraySame(value, prevValue, arrDim))
+            || (!isValueArray && value === prevValue))) {
+            isAllValueEqual = false;
+        }
+        prevValue = value;
+
+        // Try converting a string to a color array
+        if (typeof value == 'string') {
+            var colorArray = parse(value);
+            if (colorArray) {
+                value = colorArray;
+                isValueColor = true;
+            }
+            else {
+                isValueString = true;
+            }
+        }
+        kfValues.push(value);
+    }
+    if (!forceAnimate && isAllValueEqual) {
+        return;
+    }
+
+    var lastValue = kfValues[trackLen - 1];
+    // Polyfill array and NaN value
+    for (var i = 0; i < trackLen - 1; i++) {
+        if (isValueArray) {
+            fillArr(kfValues[i], lastValue, arrDim);
+        }
+        else {
+            if (isNaN(kfValues[i]) && !isNaN(lastValue) && !isValueString && !isValueColor) {
+                kfValues[i] = lastValue;
+            }
+        }
+    }
+    isValueArray && fillArr(getter(animator._target, propName), lastValue, arrDim);
+
+    // Cache the key of last frame to speed up when
+    // animation playback is sequency
+    var lastFrame = 0;
+    var lastFramePercent = 0;
+    var start;
+    var w;
+    var p0;
+    var p1;
+    var p2;
+    var p3;
+
+    if (isValueColor) {
+        var rgba = [0, 0, 0, 0];
+    }
+
+    var onframe = function (target, percent) {
+        // Find the range keyframes
+        // kf1-----kf2---------current--------kf3
+        // find kf2 and kf3 and do interpolation
+        var frame;
+        // In the easing function like elasticOut, percent may less than 0
+        if (percent < 0) {
+            frame = 0;
+        }
+        else if (percent < lastFramePercent) {
+            // Start from next key
+            // PENDING start from lastFrame ?
+            start = Math.min(lastFrame + 1, trackLen - 1);
+            for (frame = start; frame >= 0; frame--) {
+                if (kfPercents[frame] <= percent) {
+                    break;
+                }
+            }
+            // PENDING really need to do this ?
+            frame = Math.min(frame, trackLen - 2);
+        }
+        else {
+            for (frame = lastFrame; frame < trackLen; frame++) {
+                if (kfPercents[frame] > percent) {
+                    break;
+                }
+            }
+            frame = Math.min(frame - 1, trackLen - 2);
+        }
+        lastFrame = frame;
+        lastFramePercent = percent;
+
+        var range = (kfPercents[frame + 1] - kfPercents[frame]);
+        if (range === 0) {
+            return;
+        }
+        else {
+            w = (percent - kfPercents[frame]) / range;
+        }
+        if (useSpline) {
+            p1 = kfValues[frame];
+            p0 = kfValues[frame === 0 ? frame : frame - 1];
+            p2 = kfValues[frame > trackLen - 2 ? trackLen - 1 : frame + 1];
+            p3 = kfValues[frame > trackLen - 3 ? trackLen - 1 : frame + 2];
+            if (isValueArray) {
+                catmullRomInterpolateArray(
+                    p0, p1, p2, p3, w, w * w, w * w * w,
+                    getter(target, propName),
+                    arrDim
+                );
+            }
+            else {
+                var value;
+                if (isValueColor) {
+                    value = catmullRomInterpolateArray(
+                        p0, p1, p2, p3, w, w * w, w * w * w,
+                        rgba, 1
+                    );
+                    value = rgba2String(rgba);
+                }
+                else if (isValueString) {
+                    // String is step(0.5)
+                    return interpolateString(p1, p2, w);
+                }
+                else {
+                    value = catmullRomInterpolate(
+                        p0, p1, p2, p3, w, w * w, w * w * w
+                    );
+                }
+                setter(
+                    target,
+                    propName,
+                    value
+                );
+            }
+        }
+        else {
+            if (isValueArray) {
+                interpolateArray(
+                    kfValues[frame], kfValues[frame + 1], w,
+                    getter(target, propName),
+                    arrDim
+                );
+            }
+            else {
+                var value;
+                if (isValueColor) {
+                    interpolateArray(
+                        kfValues[frame], kfValues[frame + 1], w,
+                        rgba, 1
+                    );
+                    value = rgba2String(rgba);
+                }
+                else if (isValueString) {
+                    // String is step(0.5)
+                    return interpolateString(kfValues[frame], kfValues[frame + 1], w);
+                }
+                else {
+                    value = interpolateNumber(kfValues[frame], kfValues[frame + 1], w);
+                }
+                setter(
+                    target,
+                    propName,
+                    value
+                );
+            }
+        }
+    };
+
+    var clip = new Clip({
+        target: animator._target,
+        life: trackMaxTime,
+        loop: animator._loop,
+        delay: animator._delay,
+        onframe: onframe,
+        ondestroy: oneTrackDone
+    });
+
+    if (easing && easing !== 'spline') {
+        clip.easing = easing;
+    }
+
+    return clip;
+}
+
+/**
+ * @alias module:zrender/animation/Animator
+ * @constructor
+ * @param {Object} target
+ * @param {boolean} loop
+ * @param {Function} getter
+ * @param {Function} setter
+ */
+var Animator = function(target, loop, getter, setter) {
+    this._tracks = {};
+    this._target = target;
+
+    this._loop = loop || false;
+
+    this._getter = getter || defaultGetter;
+    this._setter = setter || defaultSetter;
+
+    this._clipCount = 0;
+
+    this._delay = 0;
+
+    this._doneList = [];
+
+    this._onframeList = [];
+
+    this._clipList = [];
+};
+
+Animator.prototype = {
+    /**
+     * 设置动画关键帧
+     * @param  {number} time 关键帧时间，单位是ms
+     * @param  {Object} props 关键帧的属性值，key-value表示
+     * @return {module:zrender/animation/Animator}
+     */
+    when: function(time /* ms */, props) {
+        var tracks = this._tracks;
+        for (var propName in props) {
+            if (!props.hasOwnProperty(propName)) {
+                continue;
+            }
+
+            if (!tracks[propName]) {
+                tracks[propName] = [];
+                // Invalid value
+                var value = this._getter(this._target, propName);
+                if (value == null) {
+                    // zrLog('Invalid property ' + propName);
+                    continue;
+                }
+                // If time is 0
+                //  Then props is given initialize value
+                // Else
+                //  Initialize value from current prop value
+                if (time !== 0) {
+                    tracks[propName].push({
+                        time: 0,
+                        value: cloneValue(value)
+                    });
+                }
+            }
+            tracks[propName].push({
+                time: time,
+                value: props[propName]
+            });
+        }
+        return this;
+    },
+    /**
+     * 添加动画每一帧的回调函数
+     * @param  {Function} callback
+     * @return {module:zrender/animation/Animator}
+     */
+    during: function (callback) {
+        this._onframeList.push(callback);
+        return this;
+    },
+
+    pause: function () {
+        for (var i = 0; i < this._clipList.length; i++) {
+            this._clipList[i].pause();
+        }
+        this._paused = true;
+    },
+
+    resume: function () {
+        for (var i = 0; i < this._clipList.length; i++) {
+            this._clipList[i].resume();
+        }
+        this._paused = false;
+    },
+
+    isPaused: function () {
+        return !!this._paused;
+    },
+
+    _doneCallback: function () {
+        // Clear all tracks
+        this._tracks = {};
+        // Clear all clips
+        this._clipList.length = 0;
+
+        var doneList = this._doneList;
+        var len = doneList.length;
+        for (var i = 0; i < len; i++) {
+            doneList[i].call(this);
+        }
+    },
+    /**
+     * 开始执行动画
+     * @param  {string|Function} [easing]
+     *         动画缓动函数，详见{@link module:zrender/animation/easing}
+     * @param  {boolean} forceAnimate
+     * @return {module:zrender/animation/Animator}
+     */
+    start: function (easing, forceAnimate) {
+
+        var self = this;
+        var clipCount = 0;
+
+        var oneTrackDone = function() {
+            clipCount--;
+            if (!clipCount) {
+                self._doneCallback();
+            }
+        };
+
+        var lastClip;
+        for (var propName in this._tracks) {
+            if (!this._tracks.hasOwnProperty(propName)) {
+                continue;
+            }
+            var clip = createTrackClip(
+                this, easing, oneTrackDone,
+                this._tracks[propName], propName, forceAnimate
+            );
+            if (clip) {
+                this._clipList.push(clip);
+                clipCount++;
+
+                // If start after added to animation
+                if (this.animation) {
+                    this.animation.addClip(clip);
+                }
+
+                lastClip = clip;
+            }
+        }
+
+        // Add during callback on the last clip
+        if (lastClip) {
+            var oldOnFrame = lastClip.onframe;
+            lastClip.onframe = function (target, percent) {
+                oldOnFrame(target, percent);
+
+                for (var i = 0; i < self._onframeList.length; i++) {
+                    self._onframeList[i](target, percent);
+                }
+            };
+        }
+
+        // This optimization will help the case that in the upper application
+        // the view may be refreshed frequently, where animation will be
+        // called repeatly but nothing changed.
+        if (!clipCount) {
+            this._doneCallback();
+        }
+        return this;
+    },
+    /**
+     * 停止动画
+     * @param {boolean} forwardToLast If move to last frame before stop
+     */
+    stop: function (forwardToLast) {
+        var clipList = this._clipList;
+        var animation = this.animation;
+        for (var i = 0; i < clipList.length; i++) {
+            var clip = clipList[i];
+            if (forwardToLast) {
+                // Move to last frame before stop
+                clip.onframe(this._target, 1);
+            }
+            animation && animation.removeClip(clip);
+        }
+        clipList.length = 0;
+    },
+    /**
+     * 设置动画延迟开始的时间
+     * @param  {number} time 单位ms
+     * @return {module:zrender/animation/Animator}
+     */
+    delay: function (time) {
+        this._delay = time;
+        return this;
+    },
+    /**
+     * 添加动画结束的回调
+     * @param  {Function} cb
+     * @return {module:zrender/animation/Animator}
+     */
+    done: function(cb) {
+        if (cb) {
+            this._doneList.push(cb);
+        }
+        return this;
+    },
+
+    /**
+     * @return {Array.<module:zrender/animation/Clip>}
+     */
+    getClips: function () {
+        return this._clipList;
+    }
+};
+
+var dpr = 1;
+
+// If in browser environment
+if (typeof window !== 'undefined') {
+    dpr = Math.max(window.devicePixelRatio || 1, 1);
+}
+
+/**
+ * config默认配置项
+ * @exports zrender/config
+ * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ */
+
+/**
+ * debug日志选项：catchBrushException为true下有效
+ * 0 : 不生成debug数据，发布用
+ * 1 : 异常抛出，调试用
+ * 2 : 控制台输出，调试用
+ */
+var debugMode = 0;
+
+// retina 屏幕优化
+var devicePixelRatio = dpr;
+
+var log = function () {
+};
+
+if (debugMode === 1) {
+    log = function () {
+        for (var k in arguments) {
+            throw new Error(arguments[k]);
+        }
+    };
+}
+else if (debugMode > 1) {
+    log = function () {
+        for (var k in arguments) {
+            console.log(arguments[k]);
+        }
+    };
+}
+
+var zrLog = log;
+
+/**
+ * @alias modue:zrender/mixin/Animatable
+ * @constructor
+ */
+var Animatable = function () {
+
+    /**
+     * @type {Array.<module:zrender/animation/Animator>}
+     * @readOnly
+     */
+    this.animators = [];
+};
+
+Animatable.prototype = {
+
+    constructor: Animatable,
+
+    /**
+     * 动画
+     *
+     * @param {string} path The path to fetch value from object, like 'a.b.c'.
+     * @param {boolean} [loop] Whether to loop animation.
+     * @return {module:zrender/animation/Animator}
+     * @example:
+     *     el.animate('style', false)
+     *         .when(1000, {x: 10} )
+     *         .done(function(){ // Animation done })
+     *         .start()
+     */
+    animate: function (path, loop) {
+        var target;
+        var animatingShape = false;
+        var el = this;
+        var zr = this.__zr;
+        if (path) {
+            var pathSplitted = path.split('.');
+            var prop = el;
+            // If animating shape
+            animatingShape = pathSplitted[0] === 'shape';
+            for (var i = 0, l = pathSplitted.length; i < l; i++) {
+                if (!prop) {
+                    continue;
+                }
+                prop = prop[pathSplitted[i]];
+            }
+            if (prop) {
+                target = prop;
+            }
+        }
+        else {
+            target = el;
+        }
+
+        if (!target) {
+            zrLog(
+                'Property "'
+                + path
+                + '" is not existed in element '
+                + el.id
+            );
+            return;
+        }
+
+        var animators = el.animators;
+
+        var animator = new Animator(target, loop);
+
+        animator.during(function (target) {
+            el.dirty(animatingShape);
+        })
+        .done(function () {
+            // FIXME Animator will not be removed if use `Animator#stop` to stop animation
+            animators.splice(indexOf(animators, animator), 1);
+        });
+
+        animators.push(animator);
+
+        // If animate after added to the zrender
+        if (zr) {
+            zr.animation.addAnimator(animator);
+        }
+
+        return animator;
+    },
+
+    /**
+     * 停止动画
+     * @param {boolean} forwardToLast If move to last frame before stop
+     */
+    stopAnimation: function (forwardToLast) {
+        var animators = this.animators;
+        var len = animators.length;
+        for (var i = 0; i < len; i++) {
+            animators[i].stop(forwardToLast);
+        }
+        animators.length = 0;
+
+        return this;
+    },
+
+    /**
+     * Caution: this method will stop previous animation.
+     * So do not use this method to one element twice before
+     * animation starts, unless you know what you are doing.
+     * @param {Object} target
+     * @param {number} [time=500] Time in ms
+     * @param {string} [easing='linear']
+     * @param {number} [delay=0]
+     * @param {Function} [callback]
+     * @param {Function} [forceAnimate] Prevent stop animation and callback
+     *        immediently when target values are the same as current values.
+     *
+     * @example
+     *  // Animate position
+     *  el.animateTo({
+     *      position: [10, 10]
+     *  }, function () { // done })
+     *
+     *  // Animate shape, style and position in 100ms, delayed 100ms, with cubicOut easing
+     *  el.animateTo({
+     *      shape: {
+     *          width: 500
+     *      },
+     *      style: {
+     *          fill: 'red'
+     *      }
+     *      position: [10, 10]
+     *  }, 100, 100, 'cubicOut', function () { // done })
+     */
+        // TODO Return animation key
+    animateTo: function (target, time, delay, easing, callback, forceAnimate) {
+        // animateTo(target, time, easing, callback);
+        if (isString(delay)) {
+            callback = easing;
+            easing = delay;
+            delay = 0;
+        }
+        // animateTo(target, time, delay, callback);
+        else if (isFunction$1(easing)) {
+            callback = easing;
+            easing = 'linear';
+            delay = 0;
+        }
+        // animateTo(target, time, callback);
+        else if (isFunction$1(delay)) {
+            callback = delay;
+            delay = 0;
+        }
+        // animateTo(target, callback)
+        else if (isFunction$1(time)) {
+            callback = time;
+            time = 500;
+        }
+        // animateTo(target)
+        else if (!time) {
+            time = 500;
+        }
+        // Stop all previous animations
+        this.stopAnimation();
+        this._animateToShallow('', this, target, time, delay);
+
+        // Animators may be removed immediately after start
+        // if there is nothing to animate
+        var animators = this.animators.slice();
+        var count = animators.length;
+        function done() {
+            count--;
+            if (!count) {
+                callback && callback();
+            }
+        }
+
+        // No animators. This should be checked before animators[i].start(),
+        // because 'done' may be executed immediately if no need to animate.
+        if (!count) {
+            callback && callback();
+        }
+        // Start after all animators created
+        // Incase any animator is done immediately when all animation properties are not changed
+        for (var i = 0; i < animators.length; i++) {
+            animators[i]
+                .done(done)
+                .start(easing, forceAnimate);
+        }
+    },
+
+    /**
+     * @private
+     * @param {string} path=''
+     * @param {Object} source=this
+     * @param {Object} target
+     * @param {number} [time=500]
+     * @param {number} [delay=0]
+     *
+     * @example
+     *  // Animate position
+     *  el._animateToShallow({
+     *      position: [10, 10]
+     *  })
+     *
+     *  // Animate shape, style and position in 100ms, delayed 100ms
+     *  el._animateToShallow({
+     *      shape: {
+     *          width: 500
+     *      },
+     *      style: {
+     *          fill: 'red'
+     *      }
+     *      position: [10, 10]
+     *  }, 100, 100)
+     */
+    _animateToShallow: function (path, source, target, time, delay) {
+        var objShallow = {};
+        var propertyCount = 0;
+        for (var name in target) {
+            if (!target.hasOwnProperty(name)) {
+                continue;
+            }
+
+            if (source[name] != null) {
+                if (isObject$1(target[name]) && !isArrayLike(target[name])) {
+                    this._animateToShallow(
+                        path ? path + '.' + name : name,
+                        source[name],
+                        target[name],
+                        time,
+                        delay
+                    );
+                }
+                else {
+                    objShallow[name] = target[name];
+                    propertyCount++;
+                }
+            }
+            else if (target[name] != null) {
+                // Attr directly if not has property
+                // FIXME, if some property not needed for element ?
+                if (!path) {
+                    this.attr(name, target[name]);
+                }
+                else {  // Shape or style
+                    var props = {};
+                    props[path] = {};
+                    props[path][name] = target[name];
+                    this.attr(props);
+                }
+            }
+        }
+
+        if (propertyCount > 0) {
+            this.animate(path, false)
+                .when(time == null ? 500 : time, objShallow)
+                .delay(delay || 0);
+        }
+
+        return this;
+    }
+};
+
+/**
+ * @alias module:zrender/Element
+ * @constructor
+ * @extends {module:zrender/mixin/Animatable}
+ * @extends {module:zrender/mixin/Transformable}
+ * @extends {module:zrender/mixin/Eventful}
+ */
+var Element = function (opts) { // jshint ignore:line
+
+    Transformable.call(this, opts);
+    Eventful.call(this, opts);
+    Animatable.call(this, opts);
+
+    /**
+     * 画布元素ID
+     * @type {string}
+     */
+    this.id = opts.id || guid();
+};
+
+Element.prototype = {
+
+    /**
+     * 元素类型
+     * Element type
+     * @type {string}
+     */
+    type: 'element',
+
+    /**
+     * 元素名字
+     * Element name
+     * @type {string}
+     */
+    name: '',
+
+    /**
+     * ZRender 实例对象，会在 element 添加到 zrender 实例中后自动赋值
+     * ZRender instance will be assigned when element is associated with zrender
+     * @name module:/zrender/Element#__zr
+     * @type {module:zrender/ZRender}
+     */
+    __zr: null,
+
+    /**
+     * 图形是否忽略，为true时忽略图形的绘制以及事件触发
+     * If ignore drawing and events of the element object
+     * @name module:/zrender/Element#ignore
+     * @type {boolean}
+     * @default false
+     */
+    ignore: false,
+
+    /**
+     * 用于裁剪的路径(shape)，所有 Group 内的路径在绘制时都会被这个路径裁剪
+     * 该路径会继承被裁减对象的变换
+     * @type {module:zrender/graphic/Path}
+     * @see http://www.w3.org/TR/2dcontext/#clipping-region
+     * @readOnly
+     */
+    clipPath: null,
+
+    /**
+     * 是否是 Group
+     * @type {boolean}
+     */
+    isGroup: false,
+
+    /**
+     * Drift element
+     * @param  {number} dx dx on the global space
+     * @param  {number} dy dy on the global space
+     */
+    drift: function (dx, dy) {
+        switch (this.draggable) {
+            case 'horizontal':
+                dy = 0;
+                break;
+            case 'vertical':
+                dx = 0;
+                break;
+        }
+
+        var m = this.transform;
+        if (!m) {
+            m = this.transform = [1, 0, 0, 1, 0, 0];
+        }
+        m[4] += dx;
+        m[5] += dy;
+
+        this.decomposeTransform();
+        this.dirty(false);
+    },
+
+    /**
+     * Hook before update
+     */
+    beforeUpdate: function () {},
+    /**
+     * Hook after update
+     */
+    afterUpdate: function () {},
+    /**
+     * Update each frame
+     */
+    update: function () {
+        this.updateTransform();
+    },
+
+    /**
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    traverse: function (cb, context) {},
+
+    /**
+     * @protected
+     */
+    attrKV: function (key, value) {
+        if (key === 'position' || key === 'scale' || key === 'origin') {
+            // Copy the array
+            if (value) {
+                var target = this[key];
+                if (!target) {
+                    target = this[key] = [];
+                }
+                target[0] = value[0];
+                target[1] = value[1];
+            }
+        }
+        else {
+            this[key] = value;
+        }
+    },
+
+    /**
+     * Hide the element
+     */
+    hide: function () {
+        this.ignore = true;
+        this.__zr && this.__zr.refresh();
+    },
+
+    /**
+     * Show the element
+     */
+    show: function () {
+        this.ignore = false;
+        this.__zr && this.__zr.refresh();
+    },
+
+    /**
+     * @param {string|Object} key
+     * @param {*} value
+     */
+    attr: function (key, value) {
+        if (typeof key === 'string') {
+            this.attrKV(key, value);
+        }
+        else if (isObject$1(key)) {
+            for (var name in key) {
+                if (key.hasOwnProperty(name)) {
+                    this.attrKV(name, key[name]);
+                }
+            }
+        }
+
+        this.dirty(false);
+
+        return this;
+    },
+
+    /**
+     * @param {module:zrender/graphic/Path} clipPath
+     */
+    setClipPath: function (clipPath) {
+        var zr = this.__zr;
+        if (zr) {
+            clipPath.addSelfToZr(zr);
+        }
+
+        // Remove previous clip path
+        if (this.clipPath && this.clipPath !== clipPath) {
+            this.removeClipPath();
+        }
+
+        this.clipPath = clipPath;
+        clipPath.__zr = zr;
+        clipPath.__clipTarget = this;
+
+        this.dirty(false);
+    },
+
+    /**
+     */
+    removeClipPath: function () {
+        var clipPath = this.clipPath;
+        if (clipPath) {
+            if (clipPath.__zr) {
+                clipPath.removeSelfFromZr(clipPath.__zr);
+            }
+
+            clipPath.__zr = null;
+            clipPath.__clipTarget = null;
+            this.clipPath = null;
+
+            this.dirty(false);
+        }
+    },
+
+    /**
+     * Add self from zrender instance.
+     * Not recursively because it will be invoked when element added to storage.
+     * @param {module:zrender/ZRender} zr
+     */
+    addSelfToZr: function (zr) {
+        this.__zr = zr;
+        // 添加动画
+        var animators = this.animators;
+        if (animators) {
+            for (var i = 0; i < animators.length; i++) {
+                zr.animation.addAnimator(animators[i]);
+            }
+        }
+
+        if (this.clipPath) {
+            this.clipPath.addSelfToZr(zr);
+        }
+    },
+
+    /**
+     * Remove self from zrender instance.
+     * Not recursively because it will be invoked when element added to storage.
+     * @param {module:zrender/ZRender} zr
+     */
+    removeSelfFromZr: function (zr) {
+        this.__zr = null;
+        // 移除动画
+        var animators = this.animators;
+        if (animators) {
+            for (var i = 0; i < animators.length; i++) {
+                zr.animation.removeAnimator(animators[i]);
+            }
+        }
+
+        if (this.clipPath) {
+            this.clipPath.removeSelfFromZr(zr);
+        }
+    }
+};
+
+mixin(Element, Animatable);
+mixin(Element, Transformable);
+mixin(Element, Eventful);
+
+/**
+ * @module echarts/core/BoundingRect
+ */
+
+var v2ApplyTransform = applyTransform;
+var mathMin = Math.min;
+var mathMax = Math.max;
+
+/**
+ * @alias module:echarts/core/BoundingRect
+ */
+function BoundingRect(x, y, width, height) {
+
+    if (width < 0) {
+        x = x + width;
+        width = -width;
+    }
+    if (height < 0) {
+        y = y + height;
+        height = -height;
+    }
+
+    /**
+     * @type {number}
+     */
+    this.x = x;
+    /**
+     * @type {number}
+     */
+    this.y = y;
+    /**
+     * @type {number}
+     */
+    this.width = width;
+    /**
+     * @type {number}
+     */
+    this.height = height;
+}
+
+BoundingRect.prototype = {
+
+    constructor: BoundingRect,
+
+    /**
+     * @param {module:echarts/core/BoundingRect} other
+     */
+    union: function (other) {
+        var x = mathMin(other.x, this.x);
+        var y = mathMin(other.y, this.y);
+
+        this.width = mathMax(
+                other.x + other.width,
+                this.x + this.width
+            ) - x;
+        this.height = mathMax(
+                other.y + other.height,
+                this.y + this.height
+            ) - y;
+        this.x = x;
+        this.y = y;
+    },
+
+    /**
+     * @param {Array.<number>} m
+     * @methods
+     */
+    applyTransform: (function () {
+        var lt = [];
+        var rb = [];
+        var lb = [];
+        var rt = [];
+        return function (m) {
+            // In case usage like this
+            // el.getBoundingRect().applyTransform(el.transform)
+            // And element has no transform
+            if (!m) {
+                return;
+            }
+            lt[0] = lb[0] = this.x;
+            lt[1] = rt[1] = this.y;
+            rb[0] = rt[0] = this.x + this.width;
+            rb[1] = lb[1] = this.y + this.height;
+
+            v2ApplyTransform(lt, lt, m);
+            v2ApplyTransform(rb, rb, m);
+            v2ApplyTransform(lb, lb, m);
+            v2ApplyTransform(rt, rt, m);
+
+            this.x = mathMin(lt[0], rb[0], lb[0], rt[0]);
+            this.y = mathMin(lt[1], rb[1], lb[1], rt[1]);
+            var maxX = mathMax(lt[0], rb[0], lb[0], rt[0]);
+            var maxY = mathMax(lt[1], rb[1], lb[1], rt[1]);
+            this.width = maxX - this.x;
+            this.height = maxY - this.y;
+        };
+    })(),
+
+    /**
+     * Calculate matrix of transforming from self to target rect
+     * @param  {module:zrender/core/BoundingRect} b
+     * @return {Array.<number>}
+     */
+    calculateTransform: function (b) {
+        var a = this;
+        var sx = b.width / a.width;
+        var sy = b.height / a.height;
+
+        var m = create$1();
+
+        // 矩阵右乘
+        translate(m, m, [-a.x, -a.y]);
+        scale$1(m, m, [sx, sy]);
+        translate(m, m, [b.x, b.y]);
+
+        return m;
+    },
+
+    /**
+     * @param {(module:echarts/core/BoundingRect|Object)} b
+     * @return {boolean}
+     */
+    intersect: function (b) {
+        if (!b) {
+            return false;
+        }
+
+        if (!(b instanceof BoundingRect)) {
+            // Normalize negative width/height.
+            b = BoundingRect.create(b);
+        }
+
+        var a = this;
+        var ax0 = a.x;
+        var ax1 = a.x + a.width;
+        var ay0 = a.y;
+        var ay1 = a.y + a.height;
+
+        var bx0 = b.x;
+        var bx1 = b.x + b.width;
+        var by0 = b.y;
+        var by1 = b.y + b.height;
+
+        return ! (ax1 < bx0 || bx1 < ax0 || ay1 < by0 || by1 < ay0);
+    },
+
+    contain: function (x, y) {
+        var rect = this;
+        return x >= rect.x
+            && x <= (rect.x + rect.width)
+            && y >= rect.y
+            && y <= (rect.y + rect.height);
+    },
+
+    /**
+     * @return {module:echarts/core/BoundingRect}
+     */
+    clone: function () {
+        return new BoundingRect(this.x, this.y, this.width, this.height);
+    },
+
+    /**
+     * Copy from another rect
+     */
+    copy: function (other) {
+        this.x = other.x;
+        this.y = other.y;
+        this.width = other.width;
+        this.height = other.height;
+    },
+
+    plain: function () {
+        return {
+            x: this.x,
+            y: this.y,
+            width: this.width,
+            height: this.height
+        };
+    }
+};
+
+/**
+ * @param {Object|module:zrender/core/BoundingRect} rect
+ * @param {number} rect.x
+ * @param {number} rect.y
+ * @param {number} rect.width
+ * @param {number} rect.height
+ * @return {module:zrender/core/BoundingRect}
+ */
+BoundingRect.create = function (rect) {
+    return new BoundingRect(rect.x, rect.y, rect.width, rect.height);
+};
+
+/**
+ * Group是一个容器，可以插入子节点，Group的变换也会被应用到子节点上
+ * @module zrender/graphic/Group
+ * @example
+ *     var Group = require('zrender/container/Group');
+ *     var Circle = require('zrender/graphic/shape/Circle');
+ *     var g = new Group();
+ *     g.position[0] = 100;
+ *     g.position[1] = 100;
+ *     g.add(new Circle({
+ *         style: {
+ *             x: 100,
+ *             y: 100,
+ *             r: 20,
+ *         }
+ *     }));
+ *     zr.add(g);
+ */
+
+/**
+ * @alias module:zrender/graphic/Group
+ * @constructor
+ * @extends module:zrender/mixin/Transformable
+ * @extends module:zrender/mixin/Eventful
+ */
+var Group = function (opts) {
+
+    opts = opts || {};
+
+    Element.call(this, opts);
+
+    for (var key in opts) {
+        if (opts.hasOwnProperty(key)) {
+            this[key] = opts[key];
+        }
+    }
+
+    this._children = [];
+
+    this.__storage = null;
+
+    this.__dirty = true;
+};
+
+Group.prototype = {
+
+    constructor: Group,
+
+    isGroup: true,
+
+    /**
+     * @type {string}
+     */
+    type: 'group',
+
+    /**
+     * 所有子孙元素是否响应鼠标事件
+     * @name module:/zrender/container/Group#silent
+     * @type {boolean}
+     * @default false
+     */
+    silent: false,
+
+    /**
+     * @return {Array.<module:zrender/Element>}
+     */
+    children: function () {
+        return this._children.slice();
+    },
+
+    /**
+     * 获取指定 index 的儿子节点
+     * @param  {number} idx
+     * @return {module:zrender/Element}
+     */
+    childAt: function (idx) {
+        return this._children[idx];
+    },
+
+    /**
+     * 获取指定名字的儿子节点
+     * @param  {string} name
+     * @return {module:zrender/Element}
+     */
+    childOfName: function (name) {
+        var children = this._children;
+        for (var i = 0; i < children.length; i++) {
+            if (children[i].name === name) {
+                return children[i];
+            }
+            }
+    },
+
+    /**
+     * @return {number}
+     */
+    childCount: function () {
+        return this._children.length;
+    },
+
+    /**
+     * 添加子节点到最后
+     * @param {module:zrender/Element} child
+     */
+    add: function (child) {
+        if (child && child !== this && child.parent !== this) {
+
+            this._children.push(child);
+
+            this._doAdd(child);
+        }
+
+        return this;
+    },
+
+    /**
+     * 添加子节点在 nextSibling 之前
+     * @param {module:zrender/Element} child
+     * @param {module:zrender/Element} nextSibling
+     */
+    addBefore: function (child, nextSibling) {
+        if (child && child !== this && child.parent !== this
+            && nextSibling && nextSibling.parent === this) {
+
+            var children = this._children;
+            var idx = children.indexOf(nextSibling);
+
+            if (idx >= 0) {
+                children.splice(idx, 0, child);
+                this._doAdd(child);
+            }
+        }
+
+        return this;
+    },
+
+    _doAdd: function (child) {
+        if (child.parent) {
+            child.parent.remove(child);
+        }
+
+        child.parent = this;
+
+        var storage = this.__storage;
+        var zr = this.__zr;
+        if (storage && storage !== child.__storage) {
+
+            storage.addToStorage(child);
+
+            if (child instanceof Group) {
+                child.addChildrenToStorage(storage);
+            }
+        }
+
+        zr && zr.refresh();
+    },
+
+    /**
+     * 移除子节点
+     * @param {module:zrender/Element} child
+     */
+    remove: function (child) {
+        var zr = this.__zr;
+        var storage = this.__storage;
+        var children = this._children;
+
+        var idx = indexOf(children, child);
+        if (idx < 0) {
+            return this;
+        }
+        children.splice(idx, 1);
+
+        child.parent = null;
+
+        if (storage) {
+
+            storage.delFromStorage(child);
+
+            if (child instanceof Group) {
+                child.delChildrenFromStorage(storage);
+            }
+        }
+
+        zr && zr.refresh();
+
+        return this;
+    },
+
+    /**
+     * 移除所有子节点
+     */
+    removeAll: function () {
+        var children = this._children;
+        var storage = this.__storage;
+        var child;
+        var i;
+        for (i = 0; i < children.length; i++) {
+            child = children[i];
+            if (storage) {
+                storage.delFromStorage(child);
+                if (child instanceof Group) {
+                    child.delChildrenFromStorage(storage);
+                }
+            }
+            child.parent = null;
+        }
+        children.length = 0;
+
+        return this;
+    },
+
+    /**
+     * 遍历所有子节点
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    eachChild: function (cb, context) {
+        var children = this._children;
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            cb.call(context, child, i);
+        }
+        return this;
+    },
+
+    /**
+     * 深度优先遍历所有子孙节点
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    traverse: function (cb, context) {
+        for (var i = 0; i < this._children.length; i++) {
+            var child = this._children[i];
+            cb.call(context, child);
+
+            if (child.type === 'group') {
+                child.traverse(cb, context);
+            }
+        }
+        return this;
+    },
+
+    addChildrenToStorage: function (storage) {
+        for (var i = 0; i < this._children.length; i++) {
+            var child = this._children[i];
+            storage.addToStorage(child);
+            if (child instanceof Group) {
+                child.addChildrenToStorage(storage);
+            }
+        }
+    },
+
+    delChildrenFromStorage: function (storage) {
+        for (var i = 0; i < this._children.length; i++) {
+            var child = this._children[i];
+            storage.delFromStorage(child);
+            if (child instanceof Group) {
+                child.delChildrenFromStorage(storage);
+            }
+        }
+    },
+
+    dirty: function () {
+        this.__dirty = true;
+        this.__zr && this.__zr.refresh();
+        return this;
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getBoundingRect: function (includeChildren) {
+        // TODO Caching
+        var rect = null;
+        var tmpRect = new BoundingRect(0, 0, 0, 0);
+        var children = includeChildren || this._children;
+        var tmpMat = [];
+
+        for (var i = 0; i < children.length; i++) {
+            var child = children[i];
+            if (child.ignore || child.invisible) {
+                continue;
+            }
+
+            var childRect = child.getBoundingRect();
+            var transform = child.getLocalTransform(tmpMat);
+            // TODO
+            // The boundingRect cacluated by transforming original
+            // rect may be bigger than the actual bundingRect when rotation
+            // is used. (Consider a circle rotated aginst its center, where
+            // the actual boundingRect should be the same as that not be
+            // rotated.) But we can not find better approach to calculate
+            // actual boundingRect yet, considering performance.
+            if (transform) {
+                tmpRect.copy(childRect);
+                tmpRect.applyTransform(transform);
+                rect = rect || tmpRect.clone();
+                rect.union(tmpRect);
+            }
+            else {
+                rect = rect || childRect.clone();
+                rect.union(childRect);
+            }
+        }
+        return rect || tmpRect;
+    }
+};
+
+inherits(Group, Element);
+
+// https://github.com/mziccard/node-timsort
+var DEFAULT_MIN_MERGE = 32;
+
+var DEFAULT_MIN_GALLOPING = 7;
+
+function minRunLength(n) {
+    var r = 0;
+
+    while (n >= DEFAULT_MIN_MERGE) {
+        r |= n & 1;
+        n >>= 1;
+    }
+
+    return n + r;
+}
+
+function makeAscendingRun(array, lo, hi, compare) {
+    var runHi = lo + 1;
+
+    if (runHi === hi) {
+        return 1;
+    }
+
+    if (compare(array[runHi++], array[lo]) < 0) {
+        while (runHi < hi && compare(array[runHi], array[runHi - 1]) < 0) {
+            runHi++;
+        }
+
+        reverseRun(array, lo, runHi);
+    }
+    else {
+        while (runHi < hi && compare(array[runHi], array[runHi - 1]) >= 0) {
+            runHi++;
+        }
+    }
+
+    return runHi - lo;
+}
+
+function reverseRun(array, lo, hi) {
+    hi--;
+
+    while (lo < hi) {
+        var t = array[lo];
+        array[lo++] = array[hi];
+        array[hi--] = t;
+    }
+}
+
+function binaryInsertionSort(array, lo, hi, start, compare) {
+    if (start === lo) {
+        start++;
+    }
+
+    for (; start < hi; start++) {
+        var pivot = array[start];
+
+        var left = lo;
+        var right = start;
+        var mid;
+
+        while (left < right) {
+            mid = left + right >>> 1;
+
+            if (compare(pivot, array[mid]) < 0) {
+                right = mid;
+            }
+            else {
+                left = mid + 1;
+            }
+        }
+
+        var n = start - left;
+
+        switch (n) {
+            case 3:
+                array[left + 3] = array[left + 2];
+
+            case 2:
+                array[left + 2] = array[left + 1];
+
+            case 1:
+                array[left + 1] = array[left];
+                break;
+            default:
+                while (n > 0) {
+                    array[left + n] = array[left + n - 1];
+                    n--;
+                }
+        }
+
+        array[left] = pivot;
+    }
+}
+
+function gallopLeft(value, array, start, length, hint, compare) {
+    var lastOffset = 0;
+    var maxOffset = 0;
+    var offset = 1;
+
+    if (compare(value, array[start + hint]) > 0) {
+        maxOffset = length - hint;
+
+        while (offset < maxOffset && compare(value, array[start + hint + offset]) > 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        lastOffset += hint;
+        offset += hint;
+    }
+    else {
+        maxOffset = hint + 1;
+        while (offset < maxOffset && compare(value, array[start + hint - offset]) <= 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        var tmp = lastOffset;
+        lastOffset = hint - offset;
+        offset = hint - tmp;
+    }
+
+    lastOffset++;
+    while (lastOffset < offset) {
+        var m = lastOffset + (offset - lastOffset >>> 1);
+
+        if (compare(value, array[start + m]) > 0) {
+            lastOffset = m + 1;
+        }
+        else {
+            offset = m;
+        }
+    }
+    return offset;
+}
+
+function gallopRight(value, array, start, length, hint, compare) {
+    var lastOffset = 0;
+    var maxOffset = 0;
+    var offset = 1;
+
+    if (compare(value, array[start + hint]) < 0) {
+        maxOffset = hint + 1;
+
+        while (offset < maxOffset && compare(value, array[start + hint - offset]) < 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        var tmp = lastOffset;
+        lastOffset = hint - offset;
+        offset = hint - tmp;
+    }
+    else {
+        maxOffset = length - hint;
+
+        while (offset < maxOffset && compare(value, array[start + hint + offset]) >= 0) {
+            lastOffset = offset;
+            offset = (offset << 1) + 1;
+
+            if (offset <= 0) {
+                offset = maxOffset;
+            }
+        }
+
+        if (offset > maxOffset) {
+            offset = maxOffset;
+        }
+
+        lastOffset += hint;
+        offset += hint;
+    }
+
+    lastOffset++;
+
+    while (lastOffset < offset) {
+        var m = lastOffset + (offset - lastOffset >>> 1);
+
+        if (compare(value, array[start + m]) < 0) {
+            offset = m;
+        }
+        else {
+            lastOffset = m + 1;
+        }
+    }
+
+    return offset;
+}
+
+function TimSort(array, compare) {
+    var minGallop = DEFAULT_MIN_GALLOPING;
+    var runStart;
+    var runLength;
+    var stackSize = 0;
+
+    var tmp = [];
+
+    runStart = [];
+    runLength = [];
+
+    function pushRun(_runStart, _runLength) {
+        runStart[stackSize] = _runStart;
+        runLength[stackSize] = _runLength;
+        stackSize += 1;
+    }
+
+    function mergeRuns() {
+        while (stackSize > 1) {
+            var n = stackSize - 2;
+
+            if (n >= 1 && runLength[n - 1] <= runLength[n] + runLength[n + 1] || n >= 2 && runLength[n - 2] <= runLength[n] + runLength[n - 1]) {
+                if (runLength[n - 1] < runLength[n + 1]) {
+                    n--;
+                }
+            }
+            else if (runLength[n] > runLength[n + 1]) {
+                break;
+            }
+            mergeAt(n);
+        }
+    }
+
+    function forceMergeRuns() {
+        while (stackSize > 1) {
+            var n = stackSize - 2;
+
+            if (n > 0 && runLength[n - 1] < runLength[n + 1]) {
+                n--;
+            }
+
+            mergeAt(n);
+        }
+    }
+
+    function mergeAt(i) {
+        var start1 = runStart[i];
+        var length1 = runLength[i];
+        var start2 = runStart[i + 1];
+        var length2 = runLength[i + 1];
+
+        runLength[i] = length1 + length2;
+
+        if (i === stackSize - 3) {
+            runStart[i + 1] = runStart[i + 2];
+            runLength[i + 1] = runLength[i + 2];
+        }
+
+        stackSize--;
+
+        var k = gallopRight(array[start2], array, start1, length1, 0, compare);
+        start1 += k;
+        length1 -= k;
+
+        if (length1 === 0) {
+            return;
+        }
+
+        length2 = gallopLeft(array[start1 + length1 - 1], array, start2, length2, length2 - 1, compare);
+
+        if (length2 === 0) {
+            return;
+        }
+
+        if (length1 <= length2) {
+            mergeLow(start1, length1, start2, length2);
+        }
+        else {
+            mergeHigh(start1, length1, start2, length2);
+        }
+    }
+
+    function mergeLow(start1, length1, start2, length2) {
+        var i = 0;
+
+        for (i = 0; i < length1; i++) {
+            tmp[i] = array[start1 + i];
+        }
+
+        var cursor1 = 0;
+        var cursor2 = start2;
+        var dest = start1;
+
+        array[dest++] = array[cursor2++];
+
+        if (--length2 === 0) {
+            for (i = 0; i < length1; i++) {
+                array[dest + i] = tmp[cursor1 + i];
+            }
+            return;
+        }
+
+        if (length1 === 1) {
+            for (i = 0; i < length2; i++) {
+                array[dest + i] = array[cursor2 + i];
+            }
+            array[dest + length2] = tmp[cursor1];
+            return;
+        }
+
+        var _minGallop = minGallop;
+        var count1, count2, exit;
+
+        while (1) {
+            count1 = 0;
+            count2 = 0;
+            exit = false;
+
+            do {
+                if (compare(array[cursor2], tmp[cursor1]) < 0) {
+                    array[dest++] = array[cursor2++];
+                    count2++;
+                    count1 = 0;
+
+                    if (--length2 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+                else {
+                    array[dest++] = tmp[cursor1++];
+                    count1++;
+                    count2 = 0;
+                    if (--length1 === 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+            } while ((count1 | count2) < _minGallop);
+
+            if (exit) {
+                break;
+            }
+
+            do {
+                count1 = gallopRight(array[cursor2], tmp, cursor1, length1, 0, compare);
+
+                if (count1 !== 0) {
+                    for (i = 0; i < count1; i++) {
+                        array[dest + i] = tmp[cursor1 + i];
+                    }
+
+                    dest += count1;
+                    cursor1 += count1;
+                    length1 -= count1;
+                    if (length1 <= 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+
+                array[dest++] = array[cursor2++];
+
+                if (--length2 === 0) {
+                    exit = true;
+                    break;
+                }
+
+                count2 = gallopLeft(tmp[cursor1], array, cursor2, length2, 0, compare);
+
+                if (count2 !== 0) {
+                    for (i = 0; i < count2; i++) {
+                        array[dest + i] = array[cursor2 + i];
+                    }
+
+                    dest += count2;
+                    cursor2 += count2;
+                    length2 -= count2;
+
+                    if (length2 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+                array[dest++] = tmp[cursor1++];
+
+                if (--length1 === 1) {
+                    exit = true;
+                    break;
+                }
+
+                _minGallop--;
+            } while (count1 >= DEFAULT_MIN_GALLOPING || count2 >= DEFAULT_MIN_GALLOPING);
+
+            if (exit) {
+                break;
+            }
+
+            if (_minGallop < 0) {
+                _minGallop = 0;
+            }
+
+            _minGallop += 2;
+        }
+
+        minGallop = _minGallop;
+
+        minGallop < 1 && (minGallop = 1);
+
+        if (length1 === 1) {
+            for (i = 0; i < length2; i++) {
+                array[dest + i] = array[cursor2 + i];
+            }
+            array[dest + length2] = tmp[cursor1];
+        }
+        else if (length1 === 0) {
+            throw new Error();
+            // throw new Error('mergeLow preconditions were not respected');
+        }
+        else {
+            for (i = 0; i < length1; i++) {
+                array[dest + i] = tmp[cursor1 + i];
+            }
+        }
+    }
+
+    function mergeHigh (start1, length1, start2, length2) {
+        var i = 0;
+
+        for (i = 0; i < length2; i++) {
+            tmp[i] = array[start2 + i];
+        }
+
+        var cursor1 = start1 + length1 - 1;
+        var cursor2 = length2 - 1;
+        var dest = start2 + length2 - 1;
+        var customCursor = 0;
+        var customDest = 0;
+
+        array[dest--] = array[cursor1--];
+
+        if (--length1 === 0) {
+            customCursor = dest - (length2 - 1);
+
+            for (i = 0; i < length2; i++) {
+                array[customCursor + i] = tmp[i];
+            }
+
+            return;
+        }
+
+        if (length2 === 1) {
+            dest -= length1;
+            cursor1 -= length1;
+            customDest = dest + 1;
+            customCursor = cursor1 + 1;
+
+            for (i = length1 - 1; i >= 0; i--) {
+                array[customDest + i] = array[customCursor + i];
+            }
+
+            array[dest] = tmp[cursor2];
+            return;
+        }
+
+        var _minGallop = minGallop;
+
+        while (true) {
+            var count1 = 0;
+            var count2 = 0;
+            var exit = false;
+
+            do {
+                if (compare(tmp[cursor2], array[cursor1]) < 0) {
+                    array[dest--] = array[cursor1--];
+                    count1++;
+                    count2 = 0;
+                    if (--length1 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+                else {
+                    array[dest--] = tmp[cursor2--];
+                    count2++;
+                    count1 = 0;
+                    if (--length2 === 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+            } while ((count1 | count2) < _minGallop);
+
+            if (exit) {
+                break;
+            }
+
+            do {
+                count1 = length1 - gallopRight(tmp[cursor2], array, start1, length1, length1 - 1, compare);
+
+                if (count1 !== 0) {
+                    dest -= count1;
+                    cursor1 -= count1;
+                    length1 -= count1;
+                    customDest = dest + 1;
+                    customCursor = cursor1 + 1;
+
+                    for (i = count1 - 1; i >= 0; i--) {
+                        array[customDest + i] = array[customCursor + i];
+                    }
+
+                    if (length1 === 0) {
+                        exit = true;
+                        break;
+                    }
+                }
+
+                array[dest--] = tmp[cursor2--];
+
+                if (--length2 === 1) {
+                    exit = true;
+                    break;
+                }
+
+                count2 = length2 - gallopLeft(array[cursor1], tmp, 0, length2, length2 - 1, compare);
+
+                if (count2 !== 0) {
+                    dest -= count2;
+                    cursor2 -= count2;
+                    length2 -= count2;
+                    customDest = dest + 1;
+                    customCursor = cursor2 + 1;
+
+                    for (i = 0; i < count2; i++) {
+                        array[customDest + i] = tmp[customCursor + i];
+                    }
+
+                    if (length2 <= 1) {
+                        exit = true;
+                        break;
+                    }
+                }
+
+                array[dest--] = array[cursor1--];
+
+                if (--length1 === 0) {
+                    exit = true;
+                    break;
+                }
+
+                _minGallop--;
+            } while (count1 >= DEFAULT_MIN_GALLOPING || count2 >= DEFAULT_MIN_GALLOPING);
+
+            if (exit) {
+                break;
+            }
+
+            if (_minGallop < 0) {
+                _minGallop = 0;
+            }
+
+            _minGallop += 2;
+        }
+
+        minGallop = _minGallop;
+
+        if (minGallop < 1) {
+            minGallop = 1;
+        }
+
+        if (length2 === 1) {
+            dest -= length1;
+            cursor1 -= length1;
+            customDest = dest + 1;
+            customCursor = cursor1 + 1;
+
+            for (i = length1 - 1; i >= 0; i--) {
+                array[customDest + i] = array[customCursor + i];
+            }
+
+            array[dest] = tmp[cursor2];
+        }
+        else if (length2 === 0) {
+            throw new Error();
+            // throw new Error('mergeHigh preconditions were not respected');
+        }
+        else {
+            customCursor = dest - (length2 - 1);
+            for (i = 0; i < length2; i++) {
+                array[customCursor + i] = tmp[i];
+            }
+        }
+    }
+
+    this.mergeRuns = mergeRuns;
+    this.forceMergeRuns = forceMergeRuns;
+    this.pushRun = pushRun;
+}
+
+function sort(array, compare, lo, hi) {
+    if (!lo) {
+        lo = 0;
+    }
+    if (!hi) {
+        hi = array.length;
+    }
+
+    var remaining = hi - lo;
+
+    if (remaining < 2) {
+        return;
+    }
+
+    var runLength = 0;
+
+    if (remaining < DEFAULT_MIN_MERGE) {
+        runLength = makeAscendingRun(array, lo, hi, compare);
+        binaryInsertionSort(array, lo, hi, lo + runLength, compare);
+        return;
+    }
+
+    var ts = new TimSort(array, compare);
+
+    var minRun = minRunLength(remaining);
+
+    do {
+        runLength = makeAscendingRun(array, lo, hi, compare);
+        if (runLength < minRun) {
+            var force = remaining;
+            if (force > minRun) {
+                force = minRun;
+            }
+
+            binaryInsertionSort(array, lo, lo + force, lo + runLength, compare);
+            runLength = force;
+        }
+
+        ts.pushRun(lo, runLength);
+        ts.mergeRuns();
+
+        remaining -= runLength;
+        lo += runLength;
+    } while (remaining !== 0);
+
+    ts.forceMergeRuns();
+}
+
+// Use timsort because in most case elements are partially sorted
+// https://jsfiddle.net/pissang/jr4x7mdm/8/
+function shapeCompareFunc(a, b) {
+    if (a.zlevel === b.zlevel) {
+        if (a.z === b.z) {
+            // if (a.z2 === b.z2) {
+            //     // FIXME Slow has renderidx compare
+            //     // http://stackoverflow.com/questions/20883421/sorting-in-javascript-should-every-compare-function-have-a-return-0-statement
+            //     // https://github.com/v8/v8/blob/47cce544a31ed5577ffe2963f67acb4144ee0232/src/js/array.js#L1012
+            //     return a.__renderidx - b.__renderidx;
+            // }
+            return a.z2 - b.z2;
+        }
+        return a.z - b.z;
+    }
+    return a.zlevel - b.zlevel;
+}
+/**
+ * 内容仓库 (M)
+ * @alias module:zrender/Storage
+ * @constructor
+ */
+var Storage = function () { // jshint ignore:line
+    this._roots = [];
+
+    this._displayList = [];
+
+    this._displayListLen = 0;
+};
+
+Storage.prototype = {
+
+    constructor: Storage,
+
+    /**
+     * @param  {Function} cb
+     *
+     */
+    traverse: function (cb, context) {
+        for (var i = 0; i < this._roots.length; i++) {
+            this._roots[i].traverse(cb, context);
+        }
+    },
+
+    /**
+     * 返回所有图形的绘制队列
+     * @param {boolean} [update=false] 是否在返回前更新该数组
+     * @param {boolean} [includeIgnore=false] 是否包含 ignore 的数组, 在 update 为 true 的时候有效
+     *
+     * 详见{@link module:zrender/graphic/Displayable.prototype.updateDisplayList}
+     * @return {Array.<module:zrender/graphic/Displayable>}
+     */
+    getDisplayList: function (update, includeIgnore) {
+        includeIgnore = includeIgnore || false;
+        if (update) {
+            this.updateDisplayList(includeIgnore);
+        }
+        return this._displayList;
+    },
+
+    /**
+     * 更新图形的绘制队列。
+     * 每次绘制前都会调用，该方法会先深度优先遍历整个树，更新所有Group和Shape的变换并且把所有可见的Shape保存到数组中，
+     * 最后根据绘制的优先级（zlevel > z > 插入顺序）排序得到绘制队列
+     * @param {boolean} [includeIgnore=false] 是否包含 ignore 的数组
+     */
+    updateDisplayList: function (includeIgnore) {
+        this._displayListLen = 0;
+
+        var roots = this._roots;
+        var displayList = this._displayList;
+        for (var i = 0, len = roots.length; i < len; i++) {
+            this._updateAndAddDisplayable(roots[i], null, includeIgnore);
+        }
+
+        displayList.length = this._displayListLen;
+
+        env$1.canvasSupported && sort(displayList, shapeCompareFunc);
+    },
+
+    _updateAndAddDisplayable: function (el, clipPaths, includeIgnore) {
+
+        if (el.ignore && !includeIgnore) {
+            return;
+        }
+
+        el.beforeUpdate();
+
+        if (el.__dirty) {
+
+            el.update();
+
+        }
+
+        el.afterUpdate();
+
+        var userSetClipPath = el.clipPath;
+        if (userSetClipPath) {
+
+            // FIXME 效率影响
+            if (clipPaths) {
+                clipPaths = clipPaths.slice();
+            }
+            else {
+                clipPaths = [];
+            }
+
+            var currentClipPath = userSetClipPath;
+            var parentClipPath = el;
+            // Recursively add clip path
+            while (currentClipPath) {
+                // clipPath 的变换是基于使用这个 clipPath 的元素
+                currentClipPath.parent = parentClipPath;
+                currentClipPath.updateTransform();
+
+                clipPaths.push(currentClipPath);
+
+                parentClipPath = currentClipPath;
+                currentClipPath = currentClipPath.clipPath;
+            }
+        }
+
+        if (el.isGroup) {
+            var children = el._children;
+
+            for (var i = 0; i < children.length; i++) {
+                var child = children[i];
+
+                // Force to mark as dirty if group is dirty
+                // FIXME __dirtyPath ?
+                if (el.__dirty) {
+                    child.__dirty = true;
+                }
+
+                this._updateAndAddDisplayable(child, clipPaths, includeIgnore);
+            }
+
+            // Mark group clean here
+            el.__dirty = false;
+
+        }
+        else {
+            el.__clipPaths = clipPaths;
+
+            this._displayList[this._displayListLen++] = el;
+        }
+    },
+
+    /**
+     * 添加图形(Shape)或者组(Group)到根节点
+     * @param {module:zrender/Element} el
+     */
+    addRoot: function (el) {
+        if (el.__storage === this) {
+            return;
+        }
+
+        if (el instanceof Group) {
+            el.addChildrenToStorage(this);
+        }
+
+        this.addToStorage(el);
+        this._roots.push(el);
+    },
+
+    /**
+     * 删除指定的图形(Shape)或者组(Group)
+     * @param {string|Array.<string>} [el] 如果为空清空整个Storage
+     */
+    delRoot: function (el) {
+        if (el == null) {
+            // 不指定el清空
+            for (var i = 0; i < this._roots.length; i++) {
+                var root = this._roots[i];
+                if (root instanceof Group) {
+                    root.delChildrenFromStorage(this);
+                }
+            }
+
+            this._roots = [];
+            this._displayList = [];
+            this._displayListLen = 0;
+
+            return;
+        }
+
+        if (el instanceof Array) {
+            for (var i = 0, l = el.length; i < l; i++) {
+                this.delRoot(el[i]);
+            }
+            return;
+        }
+
+
+        var idx = indexOf(this._roots, el);
+        if (idx >= 0) {
+            this.delFromStorage(el);
+            this._roots.splice(idx, 1);
+            if (el instanceof Group) {
+                el.delChildrenFromStorage(this);
+            }
+        }
+    },
+
+    addToStorage: function (el) {
+        if (el) {
+            el.__storage = this;
+            el.dirty(false);
+        }
+        return this;
+    },
+
+    delFromStorage: function (el) {
+        if (el) {
+            el.__storage = null;
+        }
+
+        return this;
+    },
+
+    /**
+     * 清空并且释放Storage
+     */
+    dispose: function () {
+        this._renderList =
+        this._roots = null;
+    },
+
+    displayableSortFunc: shapeCompareFunc
+};
+
+var SHADOW_PROPS = {
+    'shadowBlur': 1,
+    'shadowOffsetX': 1,
+    'shadowOffsetY': 1,
+    'textShadowBlur': 1,
+    'textShadowOffsetX': 1,
+    'textShadowOffsetY': 1,
+    'textBoxShadowBlur': 1,
+    'textBoxShadowOffsetX': 1,
+    'textBoxShadowOffsetY': 1
+};
+
+var fixShadow = function (ctx, propName, value) {
+    if (SHADOW_PROPS.hasOwnProperty(propName)) {
+        return value *= ctx.dpr;
+    }
+    return value;
+};
+
+var STYLE_COMMON_PROPS = [
+    ['shadowBlur', 0], ['shadowOffsetX', 0], ['shadowOffsetY', 0], ['shadowColor', '#000'],
+    ['lineCap', 'butt'], ['lineJoin', 'miter'], ['miterLimit', 10]
+];
+
+// var SHADOW_PROPS = STYLE_COMMON_PROPS.slice(0, 4);
+// var LINE_PROPS = STYLE_COMMON_PROPS.slice(4);
+
+var Style = function (opts, host) {
+    this.extendFrom(opts, false);
+    this.host = host;
+};
+
+function createLinearGradient(ctx, obj, rect) {
+    var x = obj.x == null ? 0 : obj.x;
+    var x2 = obj.x2 == null ? 1 : obj.x2;
+    var y = obj.y == null ? 0 : obj.y;
+    var y2 = obj.y2 == null ? 0 : obj.y2;
+
+    if (!obj.global) {
+        x = x * rect.width + rect.x;
+        x2 = x2 * rect.width + rect.x;
+        y = y * rect.height + rect.y;
+        y2 = y2 * rect.height + rect.y;
+    }
+
+    // Fix NaN when rect is Infinity
+    x = isNaN(x) ? 0 : x;
+    x2 = isNaN(x2) ? 1 : x2;
+    y = isNaN(y) ? 0 : y;
+    y2 = isNaN(y2) ? 0 : y2;
+
+    var canvasGradient = ctx.createLinearGradient(x, y, x2, y2);
+
+    return canvasGradient;
+}
+
+function createRadialGradient(ctx, obj, rect) {
+    var width = rect.width;
+    var height = rect.height;
+    var min = Math.min(width, height);
+
+    var x = obj.x == null ? 0.5 : obj.x;
+    var y = obj.y == null ? 0.5 : obj.y;
+    var r = obj.r == null ? 0.5 : obj.r;
+    if (!obj.global) {
+        x = x * width + rect.x;
+        y = y * height + rect.y;
+        r = r * min;
+    }
+
+    var canvasGradient = ctx.createRadialGradient(x, y, 0, x, y, r);
+
+    return canvasGradient;
+}
+
+
+Style.prototype = {
+
+    constructor: Style,
+
+    /**
+     * @type {module:zrender/graphic/Displayable}
+     */
+    host: null,
+
+    /**
+     * @type {string}
+     */
+    fill: '#000',
+
+    /**
+     * @type {string}
+     */
+    stroke: null,
+
+    /**
+     * @type {number}
+     */
+    opacity: 1,
+
+    /**
+     * @type {Array.<number>}
+     */
+    lineDash: null,
+
+    /**
+     * @type {number}
+     */
+    lineDashOffset: 0,
+
+    /**
+     * @type {number}
+     */
+    shadowBlur: 0,
+
+    /**
+     * @type {number}
+     */
+    shadowOffsetX: 0,
+
+    /**
+     * @type {number}
+     */
+    shadowOffsetY: 0,
+
+    /**
+     * @type {number}
+     */
+    lineWidth: 1,
+
+    /**
+     * If stroke ignore scale
+     * @type {Boolean}
+     */
+    strokeNoScale: false,
+
+    // Bounding rect text configuration
+    // Not affected by element transform
+    /**
+     * @type {string}
+     */
+    text: null,
+
+    /**
+     * If `fontSize` or `fontFamily` exists, `font` will be reset by
+     * `fontSize`, `fontStyle`, `fontWeight`, `fontFamily`.
+     * So do not visit it directly in upper application (like echarts),
+     * but use `contain/text#makeFont` instead.
+     * @type {string}
+     */
+    font: null,
+
+    /**
+     * The same as font. Use font please.
+     * @deprecated
+     * @type {string}
+     */
+    textFont: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * @type {string}
+     */
+    fontStyle: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * @type {string}
+     */
+    fontWeight: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * Should be 12 but not '12px'.
+     * @type {number}
+     */
+    fontSize: null,
+
+    /**
+     * It helps merging respectively, rather than parsing an entire font string.
+     * @type {string}
+     */
+    fontFamily: null,
+
+    /**
+     * Reserved for special functinality, like 'hr'.
+     * @type {string}
+     */
+    textTag: null,
+
+    /**
+     * @type {string}
+     */
+    textFill: '#000',
+
+    /**
+     * @type {string}
+     */
+    textStroke: null,
+
+    /**
+     * @type {number}
+     */
+    textWidth: null,
+
+    /**
+     * Only for textBackground.
+     * @type {number}
+     */
+    textHeight: null,
+
+    /**
+     * textStroke may be set as some color as a default
+     * value in upper applicaion, where the default value
+     * of textStrokeWidth should be 0 to make sure that
+     * user can choose to do not use text stroke.
+     * @type {number}
+     */
+    textStrokeWidth: 0,
+
+    /**
+     * @type {number}
+     */
+    textLineHeight: null,
+
+    /**
+     * 'inside', 'left', 'right', 'top', 'bottom'
+     * [x, y]
+     * Based on x, y of rect.
+     * @type {string|Array.<number>}
+     * @default 'inside'
+     */
+    textPosition: 'inside',
+
+    /**
+     * If not specified, use the boundingRect of a `displayable`.
+     * @type {Object}
+     */
+    textRect: null,
+
+    /**
+     * [x, y]
+     * @type {Array.<number>}
+     */
+    textOffset: null,
+
+    /**
+     * @type {string}
+     */
+    textAlign: null,
+
+    /**
+     * @type {string}
+     */
+    textVerticalAlign: null,
+
+    /**
+     * @type {number}
+     */
+    textDistance: 5,
+
+    /**
+     * @type {string}
+     */
+    textShadowColor: 'transparent',
+
+    /**
+     * @type {number}
+     */
+    textShadowBlur: 0,
+
+    /**
+     * @type {number}
+     */
+    textShadowOffsetX: 0,
+
+    /**
+     * @type {number}
+     */
+    textShadowOffsetY: 0,
+
+    /**
+     * @type {string}
+     */
+    textBoxShadowColor: 'transparent',
+
+    /**
+     * @type {number}
+     */
+    textBoxShadowBlur: 0,
+
+    /**
+     * @type {number}
+     */
+    textBoxShadowOffsetX: 0,
+
+    /**
+     * @type {number}
+     */
+    textBoxShadowOffsetY: 0,
+
+    /**
+     * Whether transform text.
+     * Only useful in Path and Image element
+     * @type {boolean}
+     */
+    transformText: false,
+
+    /**
+     * Text rotate around position of Path or Image
+     * Only useful in Path and Image element and transformText is false.
+     */
+    textRotation: 0,
+
+    /**
+     * Text origin of text rotation, like [10, 40].
+     * Based on x, y of rect.
+     * Useful in label rotation of circular symbol.
+     * By default, this origin is textPosition.
+     * Can be 'center'.
+     * @type {string|Array.<number>}
+     */
+    textOrigin: null,
+
+    /**
+     * @type {string}
+     */
+    textBackgroundColor: null,
+
+    /**
+     * @type {string}
+     */
+    textBorderColor: null,
+
+    /**
+     * @type {number}
+     */
+    textBorderWidth: 0,
+
+    /**
+     * @type {number}
+     */
+    textBorderRadius: 0,
+
+    /**
+     * Can be `2` or `[2, 4]` or `[2, 3, 4, 5]`
+     * @type {number|Array.<number>}
+     */
+    textPadding: null,
+
+    /**
+     * Text styles for rich text.
+     * @type {Object}
+     */
+    rich: null,
+
+    /**
+     * {outerWidth, outerHeight, ellipsis, placeholder}
+     * @type {Object}
+     */
+    truncate: null,
+
+    /**
+     * https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
+     * @type {string}
+     */
+    blend: null,
+
+    /**
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    bind: function (ctx, el, prevEl) {
+        var style = this;
+        var prevStyle = prevEl && prevEl.style;
+        var firstDraw = !prevStyle;
+
+        for (var i = 0; i < STYLE_COMMON_PROPS.length; i++) {
+            var prop = STYLE_COMMON_PROPS[i];
+            var styleName = prop[0];
+
+            if (firstDraw || style[styleName] !== prevStyle[styleName]) {
+                // FIXME Invalid property value will cause style leak from previous element.
+                ctx[styleName] =
+                    fixShadow(ctx, styleName, style[styleName] || prop[1]);
+            }
+        }
+
+        if ((firstDraw || style.fill !== prevStyle.fill)) {
+            ctx.fillStyle = style.fill;
+        }
+        if ((firstDraw || style.stroke !== prevStyle.stroke)) {
+            ctx.strokeStyle = style.stroke;
+        }
+        if ((firstDraw || style.opacity !== prevStyle.opacity)) {
+            ctx.globalAlpha = style.opacity == null ? 1 : style.opacity;
+        }
+
+        if ((firstDraw || style.blend !== prevStyle.blend)) {
+            ctx.globalCompositeOperation = style.blend || 'source-over';
+        }
+        if (this.hasStroke()) {
+            var lineWidth = style.lineWidth;
+            ctx.lineWidth = lineWidth / (
+                (this.strokeNoScale && el && el.getLineScale) ? el.getLineScale() : 1
+            );
+        }
+    },
+
+    hasFill: function () {
+        var fill = this.fill;
+        return fill != null && fill !== 'none';
+    },
+
+    hasStroke: function () {
+        var stroke = this.stroke;
+        return stroke != null && stroke !== 'none' && this.lineWidth > 0;
+    },
+
+    /**
+     * Extend from other style
+     * @param {zrender/graphic/Style} otherStyle
+     * @param {boolean} overwrite true: overwrirte any way.
+     *                            false: overwrite only when !target.hasOwnProperty
+     *                            others: overwrite when property is not null/undefined.
+     */
+    extendFrom: function (otherStyle, overwrite) {
+        if (otherStyle) {
+            for (var name in otherStyle) {
+                if (otherStyle.hasOwnProperty(name)
+                    && (overwrite === true
+                        || (
+                            overwrite === false
+                                ? !this.hasOwnProperty(name)
+                                : otherStyle[name] != null
+                        )
+                    )
+                ) {
+                    this[name] = otherStyle[name];
+                }
+            }
+        }
+    },
+
+    /**
+     * Batch setting style with a given object
+     * @param {Object|string} obj
+     * @param {*} [obj]
+     */
+    set: function (obj, value) {
+        if (typeof obj === 'string') {
+            this[obj] = value;
+        }
+        else {
+            this.extendFrom(obj, true);
+        }
+    },
+
+    /**
+     * Clone
+     * @return {zrender/graphic/Style} [description]
+     */
+    clone: function () {
+        var newStyle = new this.constructor();
+        newStyle.extendFrom(this, true);
+        return newStyle;
+    },
+
+    getGradient: function (ctx, obj, rect) {
+        var method = obj.type === 'radial' ? createRadialGradient : createLinearGradient;
+        var canvasGradient = method(ctx, obj, rect);
+        var colorStops = obj.colorStops;
+        for (var i = 0; i < colorStops.length; i++) {
+            canvasGradient.addColorStop(
+                colorStops[i].offset, colorStops[i].color
+            );
+        }
+        return canvasGradient;
+    }
+
+};
+
+var styleProto = Style.prototype;
+for (var i = 0; i < STYLE_COMMON_PROPS.length; i++) {
+    var prop = STYLE_COMMON_PROPS[i];
+    if (!(prop[0] in styleProto)) {
+        styleProto[prop[0]] = prop[1];
+    }
+}
+
+// Provide for others
+Style.getGradient = styleProto.getGradient;
+
+var Pattern = function (image, repeat) {
+    // Should do nothing more in this constructor. Because gradient can be
+    // declard by `color: {image: ...}`, where this constructor will not be called.
+
+    this.image = image;
+    this.repeat = repeat;
+
+    // Can be cloned
+    this.type = 'pattern';
+};
+
+Pattern.prototype.getCanvasPattern = function (ctx) {
+    return ctx.createPattern(this.image, this.repeat || 'repeat');
+};
+
+/**
+ * @module zrender/Layer
+ * @author pissang(https://www.github.com/pissang)
+ */
+
+function returnFalse() {
+    return false;
+}
+
+/**
+ * 创建dom
+ *
+ * @inner
+ * @param {string} id dom id 待用
+ * @param {Painter} painter painter instance
+ * @param {number} number
+ */
+function createDom(id, painter, dpr) {
+    var newDom = createCanvas();
+    var width = painter.getWidth();
+    var height = painter.getHeight();
+
+    var newDomStyle = newDom.style;
+    if (newDomStyle) {  // In node or some other non-browser environment
+        newDomStyle.position = 'absolute';
+        newDomStyle.left = 0;
+        newDomStyle.top = 0;
+        newDomStyle.width = width + 'px';
+        newDomStyle.height = height + 'px';
+
+        newDom.setAttribute('data-zr-dom-id', id);
+    }
+
+    newDom.width = width * dpr;
+    newDom.height = height * dpr;
+
+    return newDom;
+}
+
+/**
+ * @alias module:zrender/Layer
+ * @constructor
+ * @extends module:zrender/mixin/Transformable
+ * @param {string} id
+ * @param {module:zrender/Painter} painter
+ * @param {number} [dpr]
+ */
+var Layer = function(id, painter, dpr) {
+    var dom;
+    dpr = dpr || devicePixelRatio;
+    if (typeof id === 'string') {
+        dom = createDom(id, painter, dpr);
+    }
+    // Not using isDom because in node it will return false
+    else if (isObject$1(id)) {
+        dom = id;
+        id = dom.id;
+    }
+    this.id = id;
+    this.dom = dom;
+
+    var domStyle = dom.style;
+    if (domStyle) { // Not in node
+        dom.onselectstart = returnFalse; // 避免页面选中的尴尬
+        domStyle['-webkit-user-select'] = 'none';
+        domStyle['user-select'] = 'none';
+        domStyle['-webkit-touch-callout'] = 'none';
+        domStyle['-webkit-tap-highlight-color'] = 'rgba(0,0,0,0)';
+        domStyle['padding'] = 0;
+        domStyle['margin'] = 0;
+        domStyle['border-width'] = 0;
+    }
+
+    this.domBack = null;
+    this.ctxBack = null;
+
+    this.painter = painter;
+
+    this.config = null;
+
+    // Configs
+    /**
+     * 每次清空画布的颜色
+     * @type {string}
+     * @default 0
+     */
+    this.clearColor = 0;
+    /**
+     * 是否开启动态模糊
+     * @type {boolean}
+     * @default false
+     */
+    this.motionBlur = false;
+    /**
+     * 在开启动态模糊的时候使用，与上一帧混合的alpha值，值越大尾迹越明显
+     * @type {number}
+     * @default 0.7
+     */
+    this.lastFrameAlpha = 0.7;
+
+    /**
+     * Layer dpr
+     * @type {number}
+     */
+    this.dpr = dpr;
+};
+
+Layer.prototype = {
+
+    constructor: Layer,
+
+    __dirty: true,
+
+    __used: false,
+
+    __drawIndex: 0,
+    __startIndex: 0,
+    __endIndex: 0,
+
+    incremental: false,
+
+    getElementCount: function () {
+        return this.__endIndex - this.__startIndex;
+    },
+
+    initContext: function () {
+        this.ctx = this.dom.getContext('2d');
+        this.ctx.dpr = this.dpr;
+    },
+
+    createBackBuffer: function () {
+        var dpr = this.dpr;
+
+        this.domBack = createDom('back-' + this.id, this.painter, dpr);
+        this.ctxBack = this.domBack.getContext('2d');
+
+        if (dpr != 1) {
+            this.ctxBack.scale(dpr, dpr);
+        }
+    },
+
+    /**
+     * @param  {number} width
+     * @param  {number} height
+     */
+    resize: function (width, height) {
+        var dpr = this.dpr;
+
+        var dom = this.dom;
+        var domStyle = dom.style;
+        var domBack = this.domBack;
+
+        if (domStyle) {
+            domStyle.width = width + 'px';
+            domStyle.height = height + 'px';
+        }
+
+        dom.width = width * dpr;
+        dom.height = height * dpr;
+
+        if (domBack) {
+            domBack.width = width * dpr;
+            domBack.height = height * dpr;
+
+            if (dpr != 1) {
+                this.ctxBack.scale(dpr, dpr);
+            }
+        }
+    },
+
+    /**
+     * 清空该层画布
+     * @param {boolean} [clearAll]=false Clear all with out motion blur
+     * @param {Color} [clearColor]
+     */
+    clear: function (clearAll, clearColor) {
+        var dom = this.dom;
+        var ctx = this.ctx;
+        var width = dom.width;
+        var height = dom.height;
+
+        var clearColor = clearColor || this.clearColor;
+        var haveMotionBLur = this.motionBlur && !clearAll;
+        var lastFrameAlpha = this.lastFrameAlpha;
+
+        var dpr = this.dpr;
+
+        if (haveMotionBLur) {
+            if (!this.domBack) {
+                this.createBackBuffer();
+            }
+
+            this.ctxBack.globalCompositeOperation = 'copy';
+            this.ctxBack.drawImage(
+                dom, 0, 0,
+                width / dpr,
+                height / dpr
+            );
+        }
+
+        ctx.clearRect(0, 0, width, height);
+        if (clearColor && clearColor !== 'transparent') {
+            var clearColorGradientOrPattern;
+            // Gradient
+            if (clearColor.colorStops) {
+                // Cache canvas gradient
+                clearColorGradientOrPattern = clearColor.__canvasGradient || Style.getGradient(ctx, clearColor, {
+                    x: 0,
+                    y: 0,
+                    width: width,
+                    height: height
+                });
+
+                clearColor.__canvasGradient = clearColorGradientOrPattern;
+            }
+            // Pattern
+            else if (clearColor.image) {
+                clearColorGradientOrPattern = Pattern.prototype.getCanvasPattern.call(clearColor, ctx);
+            }
+            ctx.save();
+            ctx.fillStyle = clearColorGradientOrPattern || clearColor;
+            ctx.fillRect(0, 0, width, height);
+            ctx.restore();
+        }
+
+        if (haveMotionBLur) {
+            var domBack = this.domBack;
+            ctx.save();
+            ctx.globalAlpha = lastFrameAlpha;
+            ctx.drawImage(domBack, 0, 0, width, height);
+            ctx.restore();
+        }
+    }
+};
+
+var requestAnimationFrame = (
+    typeof window !== 'undefined'
+    && (
+        (window.requestAnimationFrame && window.requestAnimationFrame.bind(window))
+        // https://github.com/ecomfe/zrender/issues/189#issuecomment-224919809
+        || (window.msRequestAnimationFrame && window.msRequestAnimationFrame.bind(window))
+        || window.mozRequestAnimationFrame
+        || window.webkitRequestAnimationFrame
+    )
+) || function (func) {
+    setTimeout(func, 16);
+};
+
+var globalImageCache = new LRU(50);
+
+/**
+ * @param {string|HTMLImageElement|HTMLCanvasElement|Canvas} newImageOrSrc
+ * @return {HTMLImageElement|HTMLCanvasElement|Canvas} image
+ */
+function findExistImage(newImageOrSrc) {
+    if (typeof newImageOrSrc === 'string') {
+        var cachedImgObj = globalImageCache.get(newImageOrSrc);
+        return cachedImgObj && cachedImgObj.image;
+    }
+    else {
+        return newImageOrSrc;
+    }
+}
+
+/**
+ * Caution: User should cache loaded images, but not just count on LRU.
+ * Consider if required images more than LRU size, will dead loop occur?
+ *
+ * @param {string|HTMLImageElement|HTMLCanvasElement|Canvas} newImageOrSrc
+ * @param {HTMLImageElement|HTMLCanvasElement|Canvas} image Existent image.
+ * @param {module:zrender/Element} [hostEl] For calling `dirty`.
+ * @param {Function} [cb] params: (image, cbPayload)
+ * @param {Object} [cbPayload] Payload on cb calling.
+ * @return {HTMLImageElement|HTMLCanvasElement|Canvas} image
+ */
+function createOrUpdateImage(newImageOrSrc, image, hostEl, cb, cbPayload) {
+    if (!newImageOrSrc) {
+        return image;
+    }
+    else if (typeof newImageOrSrc === 'string') {
+
+        // Image should not be loaded repeatly.
+        if ((image && image.__zrImageSrc === newImageOrSrc) || !hostEl) {
+            return image;
+        }
+
+        // Only when there is no existent image or existent image src
+        // is different, this method is responsible for load.
+        var cachedImgObj = globalImageCache.get(newImageOrSrc);
+
+        var pendingWrap = {hostEl: hostEl, cb: cb, cbPayload: cbPayload};
+
+        if (cachedImgObj) {
+            image = cachedImgObj.image;
+            !isImageReady(image) && cachedImgObj.pending.push(pendingWrap);
+        }
+        else {
+            !image && (image = new Image());
+            image.onload = imageOnLoad;
+
+            globalImageCache.put(
+                newImageOrSrc,
+                image.__cachedImgObj = {
+                    image: image,
+                    pending: [pendingWrap]
+                }
+            );
+
+            image.src = image.__zrImageSrc = newImageOrSrc;
+        }
+
+        return image;
+    }
+    // newImageOrSrc is an HTMLImageElement or HTMLCanvasElement or Canvas
+    else {
+        return newImageOrSrc;
+    }
+}
+
+function imageOnLoad() {
+    var cachedImgObj = this.__cachedImgObj;
+    this.onload = this.__cachedImgObj = null;
+
+    for (var i = 0; i < cachedImgObj.pending.length; i++) {
+        var pendingWrap = cachedImgObj.pending[i];
+        var cb = pendingWrap.cb;
+        cb && cb(this, pendingWrap.cbPayload);
+        pendingWrap.hostEl.dirty();
+    }
+    cachedImgObj.pending.length = 0;
+}
+
+function isImageReady(image) {
+    return image && image.width && image.height;
+}
+
+var textWidthCache = {};
+var textWidthCacheCounter = 0;
+
+var TEXT_CACHE_MAX = 5000;
+var STYLE_REG = /\{([a-zA-Z0-9_]+)\|([^}]*)\}/g;
+
+var DEFAULT_FONT = '12px sans-serif';
+
+// Avoid assign to an exported variable, for transforming to cjs.
+var methods$1 = {};
+
+function $override$1(name, fn) {
+    methods$1[name] = fn;
+}
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @return {number} width
+ */
+function getWidth(text, font) {
+    font = font || DEFAULT_FONT;
+    var key = text + ':' + font;
+    if (textWidthCache[key]) {
+        return textWidthCache[key];
+    }
+
+    var textLines = (text + '').split('\n');
+    var width = 0;
+
+    for (var i = 0, l = textLines.length; i < l; i++) {
+        // textContain.measureText may be overrided in SVG or VML
+        width = Math.max(measureText(textLines[i], font).width, width);
+    }
+
+    if (textWidthCacheCounter > TEXT_CACHE_MAX) {
+        textWidthCacheCounter = 0;
+        textWidthCache = {};
+    }
+    textWidthCacheCounter++;
+    textWidthCache[key] = width;
+
+    return width;
+}
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @param {string} [textAlign='left']
+ * @param {string} [textVerticalAlign='top']
+ * @param {Array.<number>} [textPadding]
+ * @param {Object} [rich]
+ * @param {Object} [truncate]
+ * @return {Object} {x, y, width, height, lineHeight}
+ */
+function getBoundingRect(text, font, textAlign, textVerticalAlign, textPadding, rich, truncate) {
+    return rich
+        ? getRichTextRect(text, font, textAlign, textVerticalAlign, textPadding, rich, truncate)
+        : getPlainTextRect(text, font, textAlign, textVerticalAlign, textPadding, truncate);
+}
+
+function getPlainTextRect(text, font, textAlign, textVerticalAlign, textPadding, truncate) {
+    var contentBlock = parsePlainText(text, font, textPadding, truncate);
+    var outerWidth = getWidth(text, font);
+    if (textPadding) {
+        outerWidth += textPadding[1] + textPadding[3];
+    }
+    var outerHeight = contentBlock.outerHeight;
+
+    var x = adjustTextX(0, outerWidth, textAlign);
+    var y = adjustTextY(0, outerHeight, textVerticalAlign);
+
+    var rect = new BoundingRect(x, y, outerWidth, outerHeight);
+    rect.lineHeight = contentBlock.lineHeight;
+
+    return rect;
+}
+
+function getRichTextRect(text, font, textAlign, textVerticalAlign, textPadding, rich, truncate) {
+    var contentBlock = parseRichText(text, {
+        rich: rich,
+        truncate: truncate,
+        font: font,
+        textAlign: textAlign,
+        textPadding: textPadding
+    });
+    var outerWidth = contentBlock.outerWidth;
+    var outerHeight = contentBlock.outerHeight;
+
+    var x = adjustTextX(0, outerWidth, textAlign);
+    var y = adjustTextY(0, outerHeight, textVerticalAlign);
+
+    return new BoundingRect(x, y, outerWidth, outerHeight);
+}
+
+/**
+ * @public
+ * @param {number} x
+ * @param {number} width
+ * @param {string} [textAlign='left']
+ * @return {number} Adjusted x.
+ */
+function adjustTextX(x, width, textAlign) {
+    // FIXME Right to left language
+    if (textAlign === 'right') {
+        x -= width;
+    }
+    else if (textAlign === 'center') {
+        x -= width / 2;
+    }
+    return x;
+}
+
+/**
+ * @public
+ * @param {number} y
+ * @param {number} height
+ * @param {string} [textVerticalAlign='top']
+ * @return {number} Adjusted y.
+ */
+function adjustTextY(y, height, textVerticalAlign) {
+    if (textVerticalAlign === 'middle') {
+        y -= height / 2;
+    }
+    else if (textVerticalAlign === 'bottom') {
+        y -= height;
+    }
+    return y;
+}
+
+/**
+ * @public
+ * @param {stirng} textPosition
+ * @param {Object} rect {x, y, width, height}
+ * @param {number} distance
+ * @return {Object} {x, y, textAlign, textVerticalAlign}
+ */
+function adjustTextPositionOnRect(textPosition, rect, distance) {
+
+    var x = rect.x;
+    var y = rect.y;
+
+    var height = rect.height;
+    var width = rect.width;
+    var halfHeight = height / 2;
+
+    var textAlign = 'left';
+    var textVerticalAlign = 'top';
+
+    switch (textPosition) {
+        case 'left':
+            x -= distance;
+            y += halfHeight;
+            textAlign = 'right';
+            textVerticalAlign = 'middle';
+            break;
+        case 'right':
+            x += distance + width;
+            y += halfHeight;
+            textVerticalAlign = 'middle';
+            break;
+        case 'top':
+            x += width / 2;
+            y -= distance;
+            textAlign = 'center';
+            textVerticalAlign = 'bottom';
+            break;
+        case 'bottom':
+            x += width / 2;
+            y += height + distance;
+            textAlign = 'center';
+            break;
+        case 'inside':
+            x += width / 2;
+            y += halfHeight;
+            textAlign = 'center';
+            textVerticalAlign = 'middle';
+            break;
+        case 'insideLeft':
+            x += distance;
+            y += halfHeight;
+            textVerticalAlign = 'middle';
+            break;
+        case 'insideRight':
+            x += width - distance;
+            y += halfHeight;
+            textAlign = 'right';
+            textVerticalAlign = 'middle';
+            break;
+        case 'insideTop':
+            x += width / 2;
+            y += distance;
+            textAlign = 'center';
+            break;
+        case 'insideBottom':
+            x += width / 2;
+            y += height - distance;
+            textAlign = 'center';
+            textVerticalAlign = 'bottom';
+            break;
+        case 'insideTopLeft':
+            x += distance;
+            y += distance;
+            break;
+        case 'insideTopRight':
+            x += width - distance;
+            y += distance;
+            textAlign = 'right';
+            break;
+        case 'insideBottomLeft':
+            x += distance;
+            y += height - distance;
+            textVerticalAlign = 'bottom';
+            break;
+        case 'insideBottomRight':
+            x += width - distance;
+            y += height - distance;
+            textAlign = 'right';
+            textVerticalAlign = 'bottom';
+            break;
+    }
+
+    return {
+        x: x,
+        y: y,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+}
+
+/**
+ * Show ellipsis if overflow.
+ *
+ * @public
+ * @param  {string} text
+ * @param  {string} containerWidth
+ * @param  {string} font
+ * @param  {number} [ellipsis='...']
+ * @param  {Object} [options]
+ * @param  {number} [options.maxIterations=3]
+ * @param  {number} [options.minChar=0] If truncate result are less
+ *                  then minChar, ellipsis will not show, which is
+ *                  better for user hint in some cases.
+ * @param  {number} [options.placeholder=''] When all truncated, use the placeholder.
+ * @return {string}
+ */
+function truncateText(text, containerWidth, font, ellipsis, options) {
+    if (!containerWidth) {
+        return '';
+    }
+
+    var textLines = (text + '').split('\n');
+    options = prepareTruncateOptions(containerWidth, font, ellipsis, options);
+
+    // FIXME
+    // It is not appropriate that every line has '...' when truncate multiple lines.
+    for (var i = 0, len = textLines.length; i < len; i++) {
+        textLines[i] = truncateSingleLine(textLines[i], options);
+    }
+
+    return textLines.join('\n');
+}
+
+function prepareTruncateOptions(containerWidth, font, ellipsis, options) {
+    options = extend({}, options);
+
+    options.font = font;
+    var ellipsis = retrieve2(ellipsis, '...');
+    options.maxIterations = retrieve2(options.maxIterations, 2);
+    var minChar = options.minChar = retrieve2(options.minChar, 0);
+    // FIXME
+    // Other languages?
+    options.cnCharWidth = getWidth('国', font);
+    // FIXME
+    // Consider proportional font?
+    var ascCharWidth = options.ascCharWidth = getWidth('a', font);
+    options.placeholder = retrieve2(options.placeholder, '');
+
+    // Example 1: minChar: 3, text: 'asdfzxcv', truncate result: 'asdf', but not: 'a...'.
+    // Example 2: minChar: 3, text: '维度', truncate result: '维', but not: '...'.
+    var contentWidth = containerWidth = Math.max(0, containerWidth - 1); // Reserve some gap.
+    for (var i = 0; i < minChar && contentWidth >= ascCharWidth; i++) {
+        contentWidth -= ascCharWidth;
+    }
+
+    var ellipsisWidth = getWidth(ellipsis);
+    if (ellipsisWidth > contentWidth) {
+        ellipsis = '';
+        ellipsisWidth = 0;
+    }
+
+    contentWidth = containerWidth - ellipsisWidth;
+
+    options.ellipsis = ellipsis;
+    options.ellipsisWidth = ellipsisWidth;
+    options.contentWidth = contentWidth;
+    options.containerWidth = containerWidth;
+
+    return options;
+}
+
+function truncateSingleLine(textLine, options) {
+    var containerWidth = options.containerWidth;
+    var font = options.font;
+    var contentWidth = options.contentWidth;
+
+    if (!containerWidth) {
+        return '';
+    }
+
+    var lineWidth = getWidth(textLine, font);
+
+    if (lineWidth <= containerWidth) {
+        return textLine;
+    }
+
+    for (var j = 0;; j++) {
+        if (lineWidth <= contentWidth || j >= options.maxIterations) {
+            textLine += options.ellipsis;
+            break;
+        }
+
+        var subLength = j === 0
+            ? estimateLength(textLine, contentWidth, options.ascCharWidth, options.cnCharWidth)
+            : lineWidth > 0
+            ? Math.floor(textLine.length * contentWidth / lineWidth)
+            : 0;
+
+        textLine = textLine.substr(0, subLength);
+        lineWidth = getWidth(textLine, font);
+    }
+
+    if (textLine === '') {
+        textLine = options.placeholder;
+    }
+
+    return textLine;
+}
+
+function estimateLength(text, contentWidth, ascCharWidth, cnCharWidth) {
+    var width = 0;
+    var i = 0;
+    for (var len = text.length; i < len && width < contentWidth; i++) {
+        var charCode = text.charCodeAt(i);
+        width += (0 <= charCode && charCode <= 127) ? ascCharWidth : cnCharWidth;
+    }
+    return i;
+}
+
+/**
+ * @public
+ * @param {string} font
+ * @return {number} line height
+ */
+function getLineHeight(font) {
+    // FIXME A rough approach.
+    return getWidth('国', font);
+}
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @return {Object} width
+ */
+function measureText(text, font) {
+    return methods$1.measureText(text, font);
+}
+
+// Avoid assign to an exported variable, for transforming to cjs.
+methods$1.measureText = function (text, font) {
+    var ctx = getContext();
+    ctx.font = font || DEFAULT_FONT;
+    return ctx.measureText(text);
+};
+
+/**
+ * @public
+ * @param {string} text
+ * @param {string} font
+ * @param {Object} [truncate]
+ * @return {Object} block: {lineHeight, lines, height, outerHeight}
+ *  Notice: for performance, do not calculate outerWidth util needed.
+ */
+function parsePlainText(text, font, padding, truncate) {
+    text != null && (text += '');
+
+    var lineHeight = getLineHeight(font);
+    var lines = text ? text.split('\n') : [];
+    var height = lines.length * lineHeight;
+    var outerHeight = height;
+
+    if (padding) {
+        outerHeight += padding[0] + padding[2];
+    }
+
+    if (text && truncate) {
+        var truncOuterHeight = truncate.outerHeight;
+        var truncOuterWidth = truncate.outerWidth;
+        if (truncOuterHeight != null && outerHeight > truncOuterHeight) {
+            text = '';
+            lines = [];
+        }
+        else if (truncOuterWidth != null) {
+            var options = prepareTruncateOptions(
+                truncOuterWidth - (padding ? padding[1] + padding[3] : 0),
+                font,
+                truncate.ellipsis,
+                {minChar: truncate.minChar, placeholder: truncate.placeholder}
+            );
+
+            // FIXME
+            // It is not appropriate that every line has '...' when truncate multiple lines.
+            for (var i = 0, len = lines.length; i < len; i++) {
+                lines[i] = truncateSingleLine(lines[i], options);
+            }
+        }
+    }
+
+    return {
+        lines: lines,
+        height: height,
+        outerHeight: outerHeight,
+        lineHeight: lineHeight
+    };
+}
+
+/**
+ * For example: 'some text {a|some text}other text{b|some text}xxx{c|}xxx'
+ * Also consider 'bbbb{a|xxx\nzzz}xxxx\naaaa'.
+ *
+ * @public
+ * @param {string} text
+ * @param {Object} style
+ * @return {Object} block
+ * {
+ *      width,
+ *      height,
+ *      lines: [{
+ *          lineHeight,
+ *          width,
+ *          tokens: [[{
+ *              styleName,
+ *              text,
+ *              width,      // include textPadding
+ *              height,     // include textPadding
+ *              textWidth, // pure text width
+ *              textHeight, // pure text height
+ *              lineHeihgt,
+ *              font,
+ *              textAlign,
+ *              textVerticalAlign
+ *          }], [...], ...]
+ *      }, ...]
+ * }
+ * If styleName is undefined, it is plain text.
+ */
+function parseRichText(text, style) {
+    var contentBlock = {lines: [], width: 0, height: 0};
+
+    text != null && (text += '');
+    if (!text) {
+        return contentBlock;
+    }
+
+    var lastIndex = STYLE_REG.lastIndex = 0;
+    var result;
+    while ((result = STYLE_REG.exec(text)) != null) {
+        var matchedIndex = result.index;
+        if (matchedIndex > lastIndex) {
+            pushTokens(contentBlock, text.substring(lastIndex, matchedIndex));
+        }
+        pushTokens(contentBlock, result[2], result[1]);
+        lastIndex = STYLE_REG.lastIndex;
+    }
+
+    if (lastIndex < text.length) {
+        pushTokens(contentBlock, text.substring(lastIndex, text.length));
+    }
+
+    var lines = contentBlock.lines;
+    var contentHeight = 0;
+    var contentWidth = 0;
+    // For `textWidth: 100%`
+    var pendingList = [];
+
+    var stlPadding = style.textPadding;
+
+    var truncate = style.truncate;
+    var truncateWidth = truncate && truncate.outerWidth;
+    var truncateHeight = truncate && truncate.outerHeight;
+    if (stlPadding) {
+        truncateWidth != null && (truncateWidth -= stlPadding[1] + stlPadding[3]);
+        truncateHeight != null && (truncateHeight -= stlPadding[0] + stlPadding[2]);
+    }
+
+    // Calculate layout info of tokens.
+    for (var i = 0; i < lines.length; i++) {
+        var line = lines[i];
+        var lineHeight = 0;
+        var lineWidth = 0;
+
+        for (var j = 0; j < line.tokens.length; j++) {
+            var token = line.tokens[j];
+            var tokenStyle = token.styleName && style.rich[token.styleName] || {};
+            // textPadding should not inherit from style.
+            var textPadding = token.textPadding = tokenStyle.textPadding;
+
+            // textFont has been asigned to font by `normalizeStyle`.
+            var font = token.font = tokenStyle.font || style.font;
+
+            // textHeight can be used when textVerticalAlign is specified in token.
+            var tokenHeight = token.textHeight = retrieve2(
+                // textHeight should not be inherited, consider it can be specified
+                // as box height of the block.
+                tokenStyle.textHeight, getLineHeight(font)
+            );
+            textPadding && (tokenHeight += textPadding[0] + textPadding[2]);
+            token.height = tokenHeight;
+            token.lineHeight = retrieve3(
+                tokenStyle.textLineHeight, style.textLineHeight, tokenHeight
+            );
+
+            token.textAlign = tokenStyle && tokenStyle.textAlign || style.textAlign;
+            token.textVerticalAlign = tokenStyle && tokenStyle.textVerticalAlign || 'middle';
+
+            if (truncateHeight != null && contentHeight + token.lineHeight > truncateHeight) {
+                return {lines: [], width: 0, height: 0};
+            }
+
+            token.textWidth = getWidth(token.text, font);
+            var tokenWidth = tokenStyle.textWidth;
+            var tokenWidthNotSpecified = tokenWidth == null || tokenWidth === 'auto';
+
+            // Percent width, can be `100%`, can be used in drawing separate
+            // line when box width is needed to be auto.
+            if (typeof tokenWidth === 'string' && tokenWidth.charAt(tokenWidth.length - 1) === '%') {
+                token.percentWidth = tokenWidth;
+                pendingList.push(token);
+                tokenWidth = 0;
+                // Do not truncate in this case, because there is no user case
+                // and it is too complicated.
+            }
+            else {
+                if (tokenWidthNotSpecified) {
+                    tokenWidth = token.textWidth;
+
+                    // FIXME: If image is not loaded and textWidth is not specified, calling
+                    // `getBoundingRect()` will not get correct result.
+                    var textBackgroundColor = tokenStyle.textBackgroundColor;
+                    var bgImg = textBackgroundColor && textBackgroundColor.image;
+
+                    // Use cases:
+                    // (1) If image is not loaded, it will be loaded at render phase and call
+                    // `dirty()` and `textBackgroundColor.image` will be replaced with the loaded
+                    // image, and then the right size will be calculated here at the next tick.
+                    // See `graphic/helper/text.js`.
+                    // (2) If image loaded, and `textBackgroundColor.image` is image src string,
+                    // use `imageHelper.findExistImage` to find cached image.
+                    // `imageHelper.findExistImage` will always be called here before
+                    // `imageHelper.createOrUpdateImage` in `graphic/helper/text.js#renderRichText`
+                    // which ensures that image will not be rendered before correct size calcualted.
+                    if (bgImg) {
+                        bgImg = findExistImage(bgImg);
+                        if (isImageReady(bgImg)) {
+                            tokenWidth = Math.max(tokenWidth, bgImg.width * tokenHeight / bgImg.height);
+                        }
+                    }
+                }
+
+                var paddingW = textPadding ? textPadding[1] + textPadding[3] : 0;
+                tokenWidth += paddingW;
+
+                var remianTruncWidth = truncateWidth != null ? truncateWidth - lineWidth : null;
+
+                if (remianTruncWidth != null && remianTruncWidth < tokenWidth) {
+                    if (!tokenWidthNotSpecified || remianTruncWidth < paddingW) {
+                        token.text = '';
+                        token.textWidth = tokenWidth = 0;
+                    }
+                    else {
+                        token.text = truncateText(
+                            token.text, remianTruncWidth - paddingW, font, truncate.ellipsis,
+                            {minChar: truncate.minChar}
+                        );
+                        token.textWidth = getWidth(token.text, font);
+                        tokenWidth = token.textWidth + paddingW;
+                    }
+                }
+            }
+
+            lineWidth += (token.width = tokenWidth);
+            tokenStyle && (lineHeight = Math.max(lineHeight, token.lineHeight));
+        }
+
+        line.width = lineWidth;
+        line.lineHeight = lineHeight;
+        contentHeight += lineHeight;
+        contentWidth = Math.max(contentWidth, lineWidth);
+    }
+
+    contentBlock.outerWidth = contentBlock.width = retrieve2(style.textWidth, contentWidth);
+    contentBlock.outerHeight = contentBlock.height = retrieve2(style.textHeight, contentHeight);
+
+    if (stlPadding) {
+        contentBlock.outerWidth += stlPadding[1] + stlPadding[3];
+        contentBlock.outerHeight += stlPadding[0] + stlPadding[2];
+    }
+
+    for (var i = 0; i < pendingList.length; i++) {
+        var token = pendingList[i];
+        var percentWidth = token.percentWidth;
+        // Should not base on outerWidth, because token can not be placed out of padding.
+        token.width = parseInt(percentWidth, 10) / 100 * contentWidth;
+    }
+
+    return contentBlock;
+}
+
+function pushTokens(block, str, styleName) {
+    var isEmptyStr = str === '';
+    var strs = str.split('\n');
+    var lines = block.lines;
+
+    for (var i = 0; i < strs.length; i++) {
+        var text = strs[i];
+        var token = {
+            styleName: styleName,
+            text: text,
+            isLineHolder: !text && !isEmptyStr
+        };
+
+        // The first token should be appended to the last line.
+        if (!i) {
+            var tokens = (lines[lines.length - 1] || (lines[0] = {tokens: []})).tokens;
+
+            // Consider cases:
+            // (1) ''.split('\n') => ['', '\n', ''], the '' at the first item
+            // (which is a placeholder) should be replaced by new token.
+            // (2) A image backage, where token likes {a|}.
+            // (3) A redundant '' will affect textAlign in line.
+            // (4) tokens with the same tplName should not be merged, because
+            // they should be displayed in different box (with border and padding).
+            var tokensLen = tokens.length;
+            (tokensLen === 1 && tokens[0].isLineHolder)
+                ? (tokens[0] = token)
+                // Consider text is '', only insert when it is the "lineHolder" or
+                // "emptyStr". Otherwise a redundant '' will affect textAlign in line.
+                : ((text || !tokensLen || isEmptyStr) && tokens.push(token));
+        }
+        // Other tokens always start a new line.
+        else {
+            // If there is '', insert it as a placeholder.
+            lines.push({tokens: [token]});
+        }
+    }
+}
+
+function makeFont(style) {
+    // FIXME in node-canvas fontWeight is before fontStyle
+    // Use `fontSize` `fontFamily` to check whether font properties are defined.
+    var font = (style.fontSize || style.fontFamily) && [
+        style.fontStyle,
+        style.fontWeight,
+        (style.fontSize || 12) + 'px',
+        // If font properties are defined, `fontFamily` should not be ignored.
+        style.fontFamily || 'sans-serif'
+    ].join(' ');
+    return font && trim(font) || style.textFont || style.font;
+}
+
+function buildPath(ctx, shape) {
+    var x = shape.x;
+    var y = shape.y;
+    var width = shape.width;
+    var height = shape.height;
+    var r = shape.r;
+    var r1;
+    var r2;
+    var r3;
+    var r4;
+
+    // Convert width and height to positive for better borderRadius
+    if (width < 0) {
+        x = x + width;
+        width = -width;
+    }
+    if (height < 0) {
+        y = y + height;
+        height = -height;
+    }
+
+    if (typeof r === 'number') {
+        r1 = r2 = r3 = r4 = r;
+    }
+    else if (r instanceof Array) {
+        if (r.length === 1) {
+            r1 = r2 = r3 = r4 = r[0];
+        }
+        else if (r.length === 2) {
+            r1 = r3 = r[0];
+            r2 = r4 = r[1];
+        }
+        else if (r.length === 3) {
+            r1 = r[0];
+            r2 = r4 = r[1];
+            r3 = r[2];
+        }
+        else {
+            r1 = r[0];
+            r2 = r[1];
+            r3 = r[2];
+            r4 = r[3];
+        }
+    }
+    else {
+        r1 = r2 = r3 = r4 = 0;
+    }
+
+    var total;
+    if (r1 + r2 > width) {
+        total = r1 + r2;
+        r1 *= width / total;
+        r2 *= width / total;
+    }
+    if (r3 + r4 > width) {
+        total = r3 + r4;
+        r3 *= width / total;
+        r4 *= width / total;
+    }
+    if (r2 + r3 > height) {
+        total = r2 + r3;
+        r2 *= height / total;
+        r3 *= height / total;
+    }
+    if (r1 + r4 > height) {
+        total = r1 + r4;
+        r1 *= height / total;
+        r4 *= height / total;
+    }
+    ctx.moveTo(x + r1, y);
+    ctx.lineTo(x + width - r2, y);
+    r2 !== 0 && ctx.arc(x + width - r2, y + r2, r2, -Math.PI / 2, 0);
+    ctx.lineTo(x + width, y + height - r3);
+    r3 !== 0 && ctx.arc(x + width - r3, y + height - r3, r3, 0, Math.PI / 2);
+    ctx.lineTo(x + r4, y + height);
+    r4 !== 0 && ctx.arc(x + r4, y + height - r4, r4, Math.PI / 2, Math.PI);
+    ctx.lineTo(x, y + r1);
+    r1 !== 0 && ctx.arc(x + r1, y + r1, r1, Math.PI, Math.PI * 1.5);
+}
+
+// TODO: Have not support 'start', 'end' yet.
+var VALID_TEXT_ALIGN = {left: 1, right: 1, center: 1};
+var VALID_TEXT_VERTICAL_ALIGN = {top: 1, bottom: 1, middle: 1};
+
+/**
+ * @param {module:zrender/graphic/Style} style
+ * @return {module:zrender/graphic/Style} The input style.
+ */
+function normalizeTextStyle(style) {
+    normalizeStyle(style);
+    each$1(style.rich, normalizeStyle);
+    return style;
+}
+
+function normalizeStyle(style) {
+    if (style) {
+
+        style.font = makeFont(style);
+
+        var textAlign = style.textAlign;
+        textAlign === 'middle' && (textAlign = 'center');
+        style.textAlign = (
+            textAlign == null || VALID_TEXT_ALIGN[textAlign]
+        ) ? textAlign : 'left';
+
+        // Compatible with textBaseline.
+        var textVerticalAlign = style.textVerticalAlign || style.textBaseline;
+        textVerticalAlign === 'center' && (textVerticalAlign = 'middle');
+        style.textVerticalAlign = (
+            textVerticalAlign == null || VALID_TEXT_VERTICAL_ALIGN[textVerticalAlign]
+        ) ? textVerticalAlign : 'top';
+
+        var textPadding = style.textPadding;
+        if (textPadding) {
+            style.textPadding = normalizeCssArray(style.textPadding);
+        }
+    }
+}
+
+/**
+ * @param {CanvasRenderingContext2D} ctx
+ * @param {string} text
+ * @param {module:zrender/graphic/Style} style
+ * @param {Object|boolean} [rect] {x, y, width, height}
+ *                  If set false, rect text is not used.
+ */
+function renderText(hostEl, ctx, text, style, rect) {
+    style.rich
+        ? renderRichText(hostEl, ctx, text, style, rect)
+        : renderPlainText(hostEl, ctx, text, style, rect);
+}
+
+function renderPlainText(hostEl, ctx, text, style, rect) {
+    var font = setCtx(ctx, 'font', style.font || DEFAULT_FONT);
+
+    var textPadding = style.textPadding;
+
+    var contentBlock = hostEl.__textCotentBlock;
+    if (!contentBlock || hostEl.__dirty) {
+        contentBlock = hostEl.__textCotentBlock = parsePlainText(
+            text, font, textPadding, style.truncate
+        );
+    }
+
+    var outerHeight = contentBlock.outerHeight;
+
+    var textLines = contentBlock.lines;
+    var lineHeight = contentBlock.lineHeight;
+
+    var boxPos = getBoxPosition(outerHeight, style, rect);
+    var baseX = boxPos.baseX;
+    var baseY = boxPos.baseY;
+    var textAlign = boxPos.textAlign;
+    var textVerticalAlign = boxPos.textVerticalAlign;
+
+    // Origin of textRotation should be the base point of text drawing.
+    applyTextRotation(ctx, style, rect, baseX, baseY);
+
+    var boxY = adjustTextY(baseY, outerHeight, textVerticalAlign);
+    var textX = baseX;
+    var textY = boxY;
+
+    var needDrawBg = needDrawBackground(style);
+    if (needDrawBg || textPadding) {
+        // Consider performance, do not call getTextWidth util necessary.
+        var textWidth = getWidth(text, font);
+        var outerWidth = textWidth;
+        textPadding && (outerWidth += textPadding[1] + textPadding[3]);
+        var boxX = adjustTextX(baseX, outerWidth, textAlign);
+
+        needDrawBg && drawBackground(hostEl, ctx, style, boxX, boxY, outerWidth, outerHeight);
+
+        if (textPadding) {
+            textX = getTextXForPadding(baseX, textAlign, textPadding);
+            textY += textPadding[0];
+        }
+    }
+
+    setCtx(ctx, 'textAlign', textAlign || 'left');
+    // Force baseline to be "middle". Otherwise, if using "top", the
+    // text will offset downward a little bit in font "Microsoft YaHei".
+    setCtx(ctx, 'textBaseline', 'middle');
+
+    // Always set shadowBlur and shadowOffset to avoid leak from displayable.
+    setCtx(ctx, 'shadowBlur', style.textShadowBlur || 0);
+    setCtx(ctx, 'shadowColor', style.textShadowColor || 'transparent');
+    setCtx(ctx, 'shadowOffsetX', style.textShadowOffsetX || 0);
+    setCtx(ctx, 'shadowOffsetY', style.textShadowOffsetY || 0);
+
+    // `textBaseline` is set as 'middle'.
+    textY += lineHeight / 2;
+
+    var textStrokeWidth = style.textStrokeWidth;
+    var textStroke = getStroke(style.textStroke, textStrokeWidth);
+    var textFill = getFill(style.textFill);
+
+    if (textStroke) {
+        setCtx(ctx, 'lineWidth', textStrokeWidth);
+        setCtx(ctx, 'strokeStyle', textStroke);
+    }
+    if (textFill) {
+        setCtx(ctx, 'fillStyle', textFill);
+    }
+
+    for (var i = 0; i < textLines.length; i++) {
+        // Fill after stroke so the outline will not cover the main part.
+        textStroke && ctx.strokeText(textLines[i], textX, textY);
+        textFill && ctx.fillText(textLines[i], textX, textY);
+        textY += lineHeight;
+    }
+}
+
+function renderRichText(hostEl, ctx, text, style, rect) {
+    var contentBlock = hostEl.__textCotentBlock;
+
+    if (!contentBlock || hostEl.__dirty) {
+        contentBlock = hostEl.__textCotentBlock = parseRichText(text, style);
+    }
+
+    drawRichText(hostEl, ctx, contentBlock, style, rect);
+}
+
+function drawRichText(hostEl, ctx, contentBlock, style, rect) {
+    var contentWidth = contentBlock.width;
+    var outerWidth = contentBlock.outerWidth;
+    var outerHeight = contentBlock.outerHeight;
+    var textPadding = style.textPadding;
+
+    var boxPos = getBoxPosition(outerHeight, style, rect);
+    var baseX = boxPos.baseX;
+    var baseY = boxPos.baseY;
+    var textAlign = boxPos.textAlign;
+    var textVerticalAlign = boxPos.textVerticalAlign;
+
+    // Origin of textRotation should be the base point of text drawing.
+    applyTextRotation(ctx, style, rect, baseX, baseY);
+
+    var boxX = adjustTextX(baseX, outerWidth, textAlign);
+    var boxY = adjustTextY(baseY, outerHeight, textVerticalAlign);
+    var xLeft = boxX;
+    var lineTop = boxY;
+    if (textPadding) {
+        xLeft += textPadding[3];
+        lineTop += textPadding[0];
+    }
+    var xRight = xLeft + contentWidth;
+
+    needDrawBackground(style) && drawBackground(
+        hostEl, ctx, style, boxX, boxY, outerWidth, outerHeight
+    );
+
+    for (var i = 0; i < contentBlock.lines.length; i++) {
+        var line = contentBlock.lines[i];
+        var tokens = line.tokens;
+        var tokenCount = tokens.length;
+        var lineHeight = line.lineHeight;
+        var usedWidth = line.width;
+
+        var leftIndex = 0;
+        var lineXLeft = xLeft;
+        var lineXRight = xRight;
+        var rightIndex = tokenCount - 1;
+        var token;
+
+        while (
+            leftIndex < tokenCount
+            && (token = tokens[leftIndex], !token.textAlign || token.textAlign === 'left')
+        ) {
+            placeToken(hostEl, ctx, token, style, lineHeight, lineTop, lineXLeft, 'left');
+            usedWidth -= token.width;
+            lineXLeft += token.width;
+            leftIndex++;
+        }
+
+        while (
+            rightIndex >= 0
+            && (token = tokens[rightIndex], token.textAlign === 'right')
+        ) {
+            placeToken(hostEl, ctx, token, style, lineHeight, lineTop, lineXRight, 'right');
+            usedWidth -= token.width;
+            lineXRight -= token.width;
+            rightIndex--;
+        }
+
+        // The other tokens are placed as textAlign 'center' if there is enough space.
+        lineXLeft += (contentWidth - (lineXLeft - xLeft) - (xRight - lineXRight) - usedWidth) / 2;
+        while (leftIndex <= rightIndex) {
+            token = tokens[leftIndex];
+            // Consider width specified by user, use 'center' rather than 'left'.
+            placeToken(hostEl, ctx, token, style, lineHeight, lineTop, lineXLeft + token.width / 2, 'center');
+            lineXLeft += token.width;
+            leftIndex++;
+        }
+
+        lineTop += lineHeight;
+    }
+}
+
+function applyTextRotation(ctx, style, rect, x, y) {
+    // textRotation only apply in RectText.
+    if (rect && style.textRotation) {
+        var origin = style.textOrigin;
+        if (origin === 'center') {
+            x = rect.width / 2 + rect.x;
+            y = rect.height / 2 + rect.y;
+        }
+        else if (origin) {
+            x = origin[0] + rect.x;
+            y = origin[1] + rect.y;
+        }
+
+        ctx.translate(x, y);
+        // Positive: anticlockwise
+        ctx.rotate(-style.textRotation);
+        ctx.translate(-x, -y);
+    }
+}
+
+function placeToken(hostEl, ctx, token, style, lineHeight, lineTop, x, textAlign) {
+    var tokenStyle = style.rich[token.styleName] || {};
+
+    // 'ctx.textBaseline' is always set as 'middle', for sake of
+    // the bias of "Microsoft YaHei".
+    var textVerticalAlign = token.textVerticalAlign;
+    var y = lineTop + lineHeight / 2;
+    if (textVerticalAlign === 'top') {
+        y = lineTop + token.height / 2;
+    }
+    else if (textVerticalAlign === 'bottom') {
+        y = lineTop + lineHeight - token.height / 2;
+    }
+
+    !token.isLineHolder && needDrawBackground(tokenStyle) && drawBackground(
+        hostEl,
+        ctx,
+        tokenStyle,
+        textAlign === 'right'
+            ? x - token.width
+            : textAlign === 'center'
+            ? x - token.width / 2
+            : x,
+        y - token.height / 2,
+        token.width,
+        token.height
+    );
+
+    var textPadding = token.textPadding;
+    if (textPadding) {
+        x = getTextXForPadding(x, textAlign, textPadding);
+        y -= token.height / 2 - textPadding[2] - token.textHeight / 2;
+    }
+
+    setCtx(ctx, 'shadowBlur', retrieve3(tokenStyle.textShadowBlur, style.textShadowBlur, 0));
+    setCtx(ctx, 'shadowColor', tokenStyle.textShadowColor || style.textShadowColor || 'transparent');
+    setCtx(ctx, 'shadowOffsetX', retrieve3(tokenStyle.textShadowOffsetX, style.textShadowOffsetX, 0));
+    setCtx(ctx, 'shadowOffsetY', retrieve3(tokenStyle.textShadowOffsetY, style.textShadowOffsetY, 0));
+
+    setCtx(ctx, 'textAlign', textAlign);
+    // Force baseline to be "middle". Otherwise, if using "top", the
+    // text will offset downward a little bit in font "Microsoft YaHei".
+    setCtx(ctx, 'textBaseline', 'middle');
+
+    setCtx(ctx, 'font', token.font || DEFAULT_FONT);
+
+    var textStroke = getStroke(tokenStyle.textStroke || style.textStroke, textStrokeWidth);
+    var textFill = getFill(tokenStyle.textFill || style.textFill);
+    var textStrokeWidth = retrieve2(tokenStyle.textStrokeWidth, style.textStrokeWidth);
+
+    // Fill after stroke so the outline will not cover the main part.
+    if (textStroke) {
+        setCtx(ctx, 'lineWidth', textStrokeWidth);
+        setCtx(ctx, 'strokeStyle', textStroke);
+        ctx.strokeText(token.text, x, y);
+    }
+    if (textFill) {
+        setCtx(ctx, 'fillStyle', textFill);
+        ctx.fillText(token.text, x, y);
+    }
+}
+
+function needDrawBackground(style) {
+    return style.textBackgroundColor
+        || (style.textBorderWidth && style.textBorderColor);
+}
+
+// style: {textBackgroundColor, textBorderWidth, textBorderColor, textBorderRadius}
+// shape: {x, y, width, height}
+function drawBackground(hostEl, ctx, style, x, y, width, height) {
+    var textBackgroundColor = style.textBackgroundColor;
+    var textBorderWidth = style.textBorderWidth;
+    var textBorderColor = style.textBorderColor;
+    var isPlainBg = isString(textBackgroundColor);
+
+    setCtx(ctx, 'shadowBlur', style.textBoxShadowBlur || 0);
+    setCtx(ctx, 'shadowColor', style.textBoxShadowColor || 'transparent');
+    setCtx(ctx, 'shadowOffsetX', style.textBoxShadowOffsetX || 0);
+    setCtx(ctx, 'shadowOffsetY', style.textBoxShadowOffsetY || 0);
+
+    if (isPlainBg || (textBorderWidth && textBorderColor)) {
+        ctx.beginPath();
+        var textBorderRadius = style.textBorderRadius;
+        if (!textBorderRadius) {
+            ctx.rect(x, y, width, height);
+        }
+        else {
+            buildPath(ctx, {
+                x: x, y: y, width: width, height: height, r: textBorderRadius
+            });
+        }
+        ctx.closePath();
+    }
+
+    if (isPlainBg) {
+        setCtx(ctx, 'fillStyle', textBackgroundColor);
+        ctx.fill();
+    }
+    else if (isObject$1(textBackgroundColor)) {
+        var image = textBackgroundColor.image;
+
+        image = createOrUpdateImage(
+            image, null, hostEl, onBgImageLoaded, textBackgroundColor
+        );
+        if (image && isImageReady(image)) {
+            ctx.drawImage(image, x, y, width, height);
+        }
+    }
+
+    if (textBorderWidth && textBorderColor) {
+        setCtx(ctx, 'lineWidth', textBorderWidth);
+        setCtx(ctx, 'strokeStyle', textBorderColor);
+        ctx.stroke();
+    }
+}
+
+function onBgImageLoaded(image, textBackgroundColor) {
+    // Replace image, so that `contain/text.js#parseRichText`
+    // will get correct result in next tick.
+    textBackgroundColor.image = image;
+}
+
+function getBoxPosition(blockHeiht, style, rect) {
+    var baseX = style.x || 0;
+    var baseY = style.y || 0;
+    var textAlign = style.textAlign;
+    var textVerticalAlign = style.textVerticalAlign;
+
+    // Text position represented by coord
+    if (rect) {
+        var textPosition = style.textPosition;
+        if (textPosition instanceof Array) {
+            // Percent
+            baseX = rect.x + parsePercent(textPosition[0], rect.width);
+            baseY = rect.y + parsePercent(textPosition[1], rect.height);
+        }
+        else {
+            var res = adjustTextPositionOnRect(
+                textPosition, rect, style.textDistance
+            );
+            baseX = res.x;
+            baseY = res.y;
+            // Default align and baseline when has textPosition
+            textAlign = textAlign || res.textAlign;
+            textVerticalAlign = textVerticalAlign || res.textVerticalAlign;
+        }
+
+        // textOffset is only support in RectText, otherwise
+        // we have to adjust boundingRect for textOffset.
+        var textOffset = style.textOffset;
+        if (textOffset) {
+            baseX += textOffset[0];
+            baseY += textOffset[1];
+        }
+    }
+
+    return {
+        baseX: baseX,
+        baseY: baseY,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+}
+
+function setCtx(ctx, prop, value) {
+    ctx[prop] = fixShadow(ctx, prop, value);
+    return ctx[prop];
+}
+
+/**
+ * @param {string} [stroke] If specified, do not check style.textStroke.
+ * @param {string} [lineWidth] If specified, do not check style.textStroke.
+ * @param {number} style
+ */
+function getStroke(stroke, lineWidth) {
+    return (stroke == null || lineWidth <= 0 || stroke === 'transparent' || stroke === 'none')
+        ? null
+        // TODO pattern and gradient?
+        : (stroke.image || stroke.colorStops)
+        ? '#000'
+        : stroke;
+}
+
+function getFill(fill) {
+    return (fill == null || fill === 'none')
+        ? null
+        // TODO pattern and gradient?
+        : (fill.image || fill.colorStops)
+        ? '#000'
+        : fill;
+}
+
+function parsePercent(value, maxValue) {
+    if (typeof value === 'string') {
+        if (value.lastIndexOf('%') >= 0) {
+            return parseFloat(value) / 100 * maxValue;
+        }
+        return parseFloat(value);
+    }
+    return value;
+}
+
+function getTextXForPadding(x, textAlign, textPadding) {
+    return textAlign === 'right'
+        ? (x - textPadding[1])
+        : textAlign === 'center'
+        ? (x + textPadding[3] / 2 - textPadding[1] / 2)
+        : (x + textPadding[3]);
+}
+
+/**
+ * @param {string} text
+ * @param {module:zrender/Style} style
+ * @return {boolean}
+ */
+function needDrawText(text, style) {
+    return text != null
+        && (text
+            || style.textBackgroundColor
+            || (style.textBorderWidth && style.textBorderColor)
+            || style.textPadding
+        );
+}
+
+/**
+ * Mixin for drawing text in a element bounding rect
+ * @module zrender/mixin/RectText
+ */
+
+var tmpRect$1 = new BoundingRect();
+
+var RectText = function () {};
+
+RectText.prototype = {
+
+    constructor: RectText,
+
+    /**
+     * Draw text in a rect with specified position.
+     * @param  {CanvasRenderingContext2D} ctx
+     * @param  {Object} rect Displayable rect
+     */
+    drawRectText: function (ctx, rect) {
+        var style = this.style;
+
+        rect = style.textRect || rect;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        var text = style.text;
+
+        // Convert to string
+        text != null && (text += '');
+
+        if (!needDrawText(text, style)) {
+            return;
+        }
+
+        // FIXME
+        ctx.save();
+
+        // Transform rect to view space
+        var transform = this.transform;
+        if (!style.transformText) {
+            if (transform) {
+                tmpRect$1.copy(rect);
+                tmpRect$1.applyTransform(transform);
+                rect = tmpRect$1;
+            }
+        }
+        else {
+            this.setTransform(ctx);
+        }
+
+        // transformText and textRotation can not be used at the same time.
+        renderText(this, ctx, text, style, rect);
+
+        ctx.restore();
+    }
+};
+
+/**
+ * 可绘制的图形基类
+ * Base class of all displayable graphic objects
+ * @module zrender/graphic/Displayable
+ */
+
+
+/**
+ * @alias module:zrender/graphic/Displayable
+ * @extends module:zrender/Element
+ * @extends module:zrender/graphic/mixin/RectText
+ */
+function Displayable(opts) {
+
+    opts = opts || {};
+
+    Element.call(this, opts);
+
+    // Extend properties
+    for (var name in opts) {
+        if (
+            opts.hasOwnProperty(name) &&
+            name !== 'style'
+        ) {
+            this[name] = opts[name];
+        }
+    }
+
+    /**
+     * @type {module:zrender/graphic/Style}
+     */
+    this.style = new Style(opts.style, this);
+
+    this._rect = null;
+    // Shapes for cascade clipping.
+    this.__clipPaths = [];
+
+    // FIXME Stateful must be mixined after style is setted
+    // Stateful.call(this, opts);
+}
+
+Displayable.prototype = {
+
+    constructor: Displayable,
+
+    type: 'displayable',
+
+    /**
+     * Displayable 是否为脏，Painter 中会根据该标记判断是否需要是否需要重新绘制
+     * Dirty flag. From which painter will determine if this displayable object needs brush
+     * @name module:zrender/graphic/Displayable#__dirty
+     * @type {boolean}
+     */
+    __dirty: true,
+
+    /**
+     * 图形是否可见，为true时不绘制图形，但是仍能触发鼠标事件
+     * If ignore drawing of the displayable object. Mouse event will still be triggered
+     * @name module:/zrender/graphic/Displayable#invisible
+     * @type {boolean}
+     * @default false
+     */
+    invisible: false,
+
+    /**
+     * @name module:/zrender/graphic/Displayable#z
+     * @type {number}
+     * @default 0
+     */
+    z: 0,
+
+    /**
+     * @name module:/zrender/graphic/Displayable#z
+     * @type {number}
+     * @default 0
+     */
+    z2: 0,
+
+    /**
+     * z层level，决定绘画在哪层canvas中
+     * @name module:/zrender/graphic/Displayable#zlevel
+     * @type {number}
+     * @default 0
+     */
+    zlevel: 0,
+
+    /**
+     * 是否可拖拽
+     * @name module:/zrender/graphic/Displayable#draggable
+     * @type {boolean}
+     * @default false
+     */
+    draggable: false,
+
+    /**
+     * 是否正在拖拽
+     * @name module:/zrender/graphic/Displayable#draggable
+     * @type {boolean}
+     * @default false
+     */
+    dragging: false,
+
+    /**
+     * 是否相应鼠标事件
+     * @name module:/zrender/graphic/Displayable#silent
+     * @type {boolean}
+     * @default false
+     */
+    silent: false,
+
+    /**
+     * If enable culling
+     * @type {boolean}
+     * @default false
+     */
+    culling: false,
+
+    /**
+     * Mouse cursor when hovered
+     * @name module:/zrender/graphic/Displayable#cursor
+     * @type {string}
+     */
+    cursor: 'pointer',
+
+    /**
+     * If hover area is bounding rect
+     * @name module:/zrender/graphic/Displayable#rectHover
+     * @type {string}
+     */
+    rectHover: false,
+
+    /**
+     * Render the element progressively when the value >= 0,
+     * usefull for large data.
+     * @type {boolean}
+     */
+    progressive: false,
+
+    /**
+     * @type {boolean}
+     */
+    incremental: false,
+    // inplace is used with incremental
+    inplace: false,
+
+    beforeBrush: function (ctx) {},
+
+    afterBrush: function (ctx) {},
+
+    /**
+     * 图形绘制方法
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    // Interface
+    brush: function (ctx, prevEl) {},
+
+    /**
+     * 获取最小包围盒
+     * @return {module:zrender/core/BoundingRect}
+     */
+    // Interface
+    getBoundingRect: function () {},
+
+    /**
+     * 判断坐标 x, y 是否在图形上
+     * If displayable element contain coord x, y
+     * @param  {number} x
+     * @param  {number} y
+     * @return {boolean}
+     */
+    contain: function (x, y) {
+        return this.rectContain(x, y);
+    },
+
+    /**
+     * @param  {Function} cb
+     * @param  {}   context
+     */
+    traverse: function (cb, context) {
+        cb.call(context, this);
+    },
+
+    /**
+     * 判断坐标 x, y 是否在图形的包围盒上
+     * If bounding rect of element contain coord x, y
+     * @param  {number} x
+     * @param  {number} y
+     * @return {boolean}
+     */
+    rectContain: function (x, y) {
+        var coord = this.transformCoordToLocal(x, y);
+        var rect = this.getBoundingRect();
+        return rect.contain(coord[0], coord[1]);
+    },
+
+    /**
+     * 标记图形元素为脏，并且在下一帧重绘
+     * Mark displayable element dirty and refresh next frame
+     */
+    dirty: function () {
+        this.__dirty = true;
+
+        this._rect = null;
+
+        this.__zr && this.__zr.refresh();
+    },
+
+    /**
+     * 图形是否会触发事件
+     * If displayable object binded any event
+     * @return {boolean}
+     */
+    // TODO, 通过 bind 绑定的事件
+    // isSilent: function () {
+    //     return !(
+    //         this.hoverable || this.draggable
+    //         || this.onmousemove || this.onmouseover || this.onmouseout
+    //         || this.onmousedown || this.onmouseup || this.onclick
+    //         || this.ondragenter || this.ondragover || this.ondragleave
+    //         || this.ondrop
+    //     );
+    // },
+    /**
+     * Alias for animate('style')
+     * @param {boolean} loop
+     */
+    animateStyle: function (loop) {
+        return this.animate('style', loop);
+    },
+
+    attrKV: function (key, value) {
+        if (key !== 'style') {
+            Element.prototype.attrKV.call(this, key, value);
+        }
+        else {
+            this.style.set(value);
+        }
+    },
+
+    /**
+     * @param {Object|string} key
+     * @param {*} value
+     */
+    setStyle: function (key, value) {
+        this.style.set(key, value);
+        this.dirty(false);
+        return this;
+    },
+
+    /**
+     * Use given style object
+     * @param  {Object} obj
+     */
+    useStyle: function (obj) {
+        this.style = new Style(obj, this);
+        this.dirty(false);
+        return this;
+    }
+};
+
+inherits(Displayable, Element);
+
+mixin(Displayable, RectText);
+
+/**
+ * @alias zrender/graphic/Image
+ * @extends module:zrender/graphic/Displayable
+ * @constructor
+ * @param {Object} opts
+ */
+function ZImage(opts) {
+    Displayable.call(this, opts);
+}
+
+ZImage.prototype = {
+
+    constructor: ZImage,
+
+    type: 'image',
+
+    brush: function (ctx, prevEl) {
+        var style = this.style;
+        var src = style.image;
+
+        // Must bind each time
+        style.bind(ctx, this, prevEl);
+
+        var image = this._image = createOrUpdateImage(
+            src,
+            this._image,
+            this,
+            this.onload
+        );
+
+        if (!image || !isImageReady(image)) {
+            return;
+        }
+
+        // 图片已经加载完成
+        // if (image.nodeName.toUpperCase() == 'IMG') {
+        //     if (!image.complete) {
+        //         return;
+        //     }
+        // }
+        // Else is canvas
+
+        var x = style.x || 0;
+        var y = style.y || 0;
+        var width = style.width;
+        var height = style.height;
+        var aspect = image.width / image.height;
+        if (width == null && height != null) {
+            // Keep image/height ratio
+            width = height * aspect;
+        }
+        else if (height == null && width != null) {
+            height = width / aspect;
+        }
+        else if (width == null && height == null) {
+            width = image.width;
+            height = image.height;
+        }
+
+        // 设置transform
+        this.setTransform(ctx);
+
+        if (style.sWidth && style.sHeight) {
+            var sx = style.sx || 0;
+            var sy = style.sy || 0;
+            ctx.drawImage(
+                image,
+                sx, sy, style.sWidth, style.sHeight,
+                x, y, width, height
+            );
+        }
+        else if (style.sx && style.sy) {
+            var sx = style.sx;
+            var sy = style.sy;
+            var sWidth = width - sx;
+            var sHeight = height - sy;
+            ctx.drawImage(
+                image,
+                sx, sy, sWidth, sHeight,
+                x, y, width, height
+            );
+        }
+        else {
+            ctx.drawImage(image, x, y, width, height);
+        }
+
+        // Draw rect text
+        if (style.text != null) {
+            // Only restore transform when needs draw text.
+            this.restoreTransform(ctx);    
+            this.drawRectText(ctx, this.getBoundingRect());
+        }
+    },
+
+    getBoundingRect: function () {
+        var style = this.style;
+        if (! this._rect) {
+            this._rect = new BoundingRect(
+                style.x || 0, style.y || 0, style.width || 0, style.height || 0
+            );
+        }
+        return this._rect;
+    }
+};
+
+inherits(ZImage, Displayable);
+
+var HOVER_LAYER_ZLEVEL = 1e5;
+var CANVAS_ZLEVEL = 314159;
+
+var EL_AFTER_INCREMENTAL_INC = 0.01;
+var INCREMENTAL_INC = 0.001;
+
+function parseInt10(val) {
+    return parseInt(val, 10);
+}
+
+function isLayerValid(layer) {
+    if (!layer) {
+        return false;
+    }
+
+    if (layer.__builtin__) {
+        return true;
+    }
+
+    if (typeof(layer.resize) !== 'function'
+        || typeof(layer.refresh) !== 'function'
+    ) {
+        return false;
+    }
+
+    return true;
+}
+
+var tmpRect = new BoundingRect(0, 0, 0, 0);
+var viewRect = new BoundingRect(0, 0, 0, 0);
+function isDisplayableCulled(el, width, height) {
+    tmpRect.copy(el.getBoundingRect());
+    if (el.transform) {
+        tmpRect.applyTransform(el.transform);
+    }
+    viewRect.width = width;
+    viewRect.height = height;
+    return !tmpRect.intersect(viewRect);
+}
+
+function isClipPathChanged(clipPaths, prevClipPaths) {
+    if (clipPaths == prevClipPaths) { // Can both be null or undefined
+        return false;
+    }
+
+    if (!clipPaths || !prevClipPaths || (clipPaths.length !== prevClipPaths.length)) {
+        return true;
+    }
+    for (var i = 0; i < clipPaths.length; i++) {
+        if (clipPaths[i] !== prevClipPaths[i]) {
+            return true;
+        }
+    }
+}
+
+function doClip(clipPaths, ctx) {
+    for (var i = 0; i < clipPaths.length; i++) {
+        var clipPath = clipPaths[i];
+
+        clipPath.setTransform(ctx);
+        ctx.beginPath();
+        clipPath.buildPath(ctx, clipPath.shape);
+        ctx.clip();
+        // Transform back
+        clipPath.restoreTransform(ctx);
+    }
+}
+
+function createRoot(width, height) {
+    var domRoot = document.createElement('div');
+
+    // domRoot.onselectstart = returnFalse; // 避免页面选中的尴尬
+    domRoot.style.cssText = [
+        'position:relative',
+        'overflow:hidden',
+        'width:' + width + 'px',
+        'height:' + height + 'px',
+        'padding:0',
+        'margin:0',
+        'border-width:0'
+    ].join(';') + ';';
+
+    return domRoot;
+}
+
+
+/**
+ * @alias module:zrender/Painter
+ * @constructor
+ * @param {HTMLElement} root 绘图容器
+ * @param {module:zrender/Storage} storage
+ * @param {Object} opts
+ */
+var Painter = function (root, storage, opts) {
+
+    this.type = 'canvas';
+
+    // In node environment using node-canvas
+    var singleCanvas = !root.nodeName // In node ?
+        || root.nodeName.toUpperCase() === 'CANVAS';
+
+    this._opts = opts = extend({}, opts || {});
+
+    /**
+     * @type {number}
+     */
+    this.dpr = opts.devicePixelRatio || devicePixelRatio;
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this._singleCanvas = singleCanvas;
+    /**
+     * 绘图容器
+     * @type {HTMLElement}
+     */
+    this.root = root;
+
+    var rootStyle = root.style;
+
+    if (rootStyle) {
+        rootStyle['-webkit-tap-highlight-color'] = 'transparent';
+        rootStyle['-webkit-user-select'] =
+        rootStyle['user-select'] =
+        rootStyle['-webkit-touch-callout'] = 'none';
+
+        root.innerHTML = '';
+    }
+
+    /**
+     * @type {module:zrender/Storage}
+     */
+    this.storage = storage;
+
+    /**
+     * @type {Array.<number>}
+     * @private
+     */
+    var zlevelList = this._zlevelList = [];
+
+    /**
+     * @type {Object.<string, module:zrender/Layer>}
+     * @private
+     */
+    var layers = this._layers = {};
+
+    /**
+     * @type {Object.<string, Object>}
+     * @private
+     */
+    this._layerConfig = {};
+
+    /**
+     * zrender will do compositing when root is a canvas and have multiple zlevels.
+     */
+    this._needsManuallyCompositing = false;
+
+    if (!singleCanvas) {
+        this._width = this._getSize(0);
+        this._height = this._getSize(1);
+
+        var domRoot = this._domRoot = createRoot(
+            this._width, this._height
+        );
+        root.appendChild(domRoot);
+    }
+    else {
+        var width = root.width;
+        var height = root.height;
+
+        if (opts.width != null) {
+            width = opts.width;
+        }
+        if (opts.height != null) {
+            height = opts.height;
+        }
+        this.dpr = opts.devicePixelRatio || 1;
+
+        // Use canvas width and height directly
+        root.width = width * this.dpr;
+        root.height = height * this.dpr;
+
+        this._width = width;
+        this._height = height;
+
+        // Create layer if only one given canvas
+        // Device can be specified to create a high dpi image.
+        var mainLayer = new Layer(root, this, this.dpr);
+        mainLayer.__builtin__ = true;
+        mainLayer.initContext();
+        // FIXME Use canvas width and height
+        // mainLayer.resize(width, height);
+        layers[CANVAS_ZLEVEL] = mainLayer;
+        mainLayer.zlevel = CANVAS_ZLEVEL;
+        // Not use common zlevel.
+        zlevelList.push(CANVAS_ZLEVEL);
+
+        this._domRoot = root;
+    }
+
+    /**
+     * @type {module:zrender/Layer}
+     * @private
+     */
+    this._hoverlayer = null;
+
+    this._hoverElements = [];
+};
+
+Painter.prototype = {
+
+    constructor: Painter,
+
+    getType: function () {
+        return 'canvas';
+    },
+
+    /**
+     * If painter use a single canvas
+     * @return {boolean}
+     */
+    isSingleCanvas: function () {
+        return this._singleCanvas;
+    },
+    /**
+     * @return {HTMLDivElement}
+     */
+    getViewportRoot: function () {
+        return this._domRoot;
+    },
+
+    getViewportRootOffset: function () {
+        var viewportRoot = this.getViewportRoot();
+        if (viewportRoot) {
+            return {
+                offsetLeft: viewportRoot.offsetLeft || 0,
+                offsetTop: viewportRoot.offsetTop || 0
+            };
+        }
+    },
+
+    /**
+     * 刷新
+     * @param {boolean} [paintAll=false] 强制绘制所有displayable
+     */
+    refresh: function (paintAll) {
+
+        var list = this.storage.getDisplayList(true);
+
+        var zlevelList = this._zlevelList;
+
+        this._redrawId = Math.random();
+
+        this._paintList(list, paintAll, this._redrawId);
+
+        // Paint custum layers
+        for (var i = 0; i < zlevelList.length; i++) {
+            var z = zlevelList[i];
+            var layer = this._layers[z];
+            if (!layer.__builtin__ && layer.refresh) {
+                var clearColor = i === 0 ? this._backgroundColor : null;
+                layer.refresh(clearColor);
+            }
+        }
+
+        this.refreshHover();
+
+        return this;
+    },
+
+    addHover: function (el, hoverStyle) {
+        if (el.__hoverMir) {
+            return;
+        }
+        var elMirror = new el.constructor({
+            style: el.style,
+            shape: el.shape
+        });
+        elMirror.__from = el;
+        el.__hoverMir = elMirror;
+        elMirror.setStyle(hoverStyle);
+        this._hoverElements.push(elMirror);
+    },
+
+    removeHover: function (el) {
+        var elMirror = el.__hoverMir;
+        var hoverElements = this._hoverElements;
+        var idx = indexOf(hoverElements, elMirror);
+        if (idx >= 0) {
+            hoverElements.splice(idx, 1);
+        }
+        el.__hoverMir = null;
+    },
+
+    clearHover: function (el) {
+        var hoverElements = this._hoverElements;
+        for (var i = 0; i < hoverElements.length; i++) {
+            var from = hoverElements[i].__from;
+            if (from) {
+                from.__hoverMir = null;
+            }
+        }
+        hoverElements.length = 0;
+    },
+
+    refreshHover: function () {
+        var hoverElements = this._hoverElements;
+        var len = hoverElements.length;
+        var hoverLayer = this._hoverlayer;
+        hoverLayer && hoverLayer.clear();
+
+        if (!len) {
+            return;
+        }
+        sort(hoverElements, this.storage.displayableSortFunc);
+
+        // Use a extream large zlevel
+        // FIXME?
+        if (!hoverLayer) {
+            hoverLayer = this._hoverlayer = this.getLayer(HOVER_LAYER_ZLEVEL);
+        }
+
+        var scope = {};
+        hoverLayer.ctx.save();
+        for (var i = 0; i < len;) {
+            var el = hoverElements[i];
+            var originalEl = el.__from;
+            // Original el is removed
+            // PENDING
+            if (!(originalEl && originalEl.__zr)) {
+                hoverElements.splice(i, 1);
+                originalEl.__hoverMir = null;
+                len--;
+                continue;
+            }
+            i++;
+
+            // Use transform
+            // FIXME style and shape ?
+            if (!originalEl.invisible) {
+                el.transform = originalEl.transform;
+                el.invTransform = originalEl.invTransform;
+                el.__clipPaths = originalEl.__clipPaths;
+                // el.
+                this._doPaintEl(el, hoverLayer, true, scope);
+            }
+        }
+        hoverLayer.ctx.restore();
+    },
+
+    getHoverLayer: function () {
+        return this.getLayer(HOVER_LAYER_ZLEVEL);
+    },
+
+    _paintList: function (list, paintAll, redrawId) {
+        if (this._redrawId !== redrawId) {
+            return;
+        }
+
+        paintAll = paintAll || false;
+
+        this._updateLayerStatus(list);
+
+        var finished = this._doPaintList(list, paintAll);
+
+        if (this._needsManuallyCompositing) {
+            this._compositeManually();
+        }
+
+        if (!finished) {
+            var self = this;
+            requestAnimationFrame(function () {
+                self._paintList(list, paintAll, redrawId);
+            });
+        }
+    },
+
+    _compositeManually: function () {
+        var ctx = this.getLayer(CANVAS_ZLEVEL).ctx;
+        var width = this._domRoot.width;
+        var height = this._domRoot.height;
+        ctx.clearRect(0, 0, width, height);
+        // PENDING, If only builtin layer?
+        this.eachBuiltinLayer(function (layer) {
+            if (layer.virtual) {
+                ctx.drawImage(layer.dom, 0, 0, width, height);
+            }
+        });
+    },
+
+    _doPaintList: function (list, paintAll) {
+        var layerList = [];
+        for (var zi = 0; zi < this._zlevelList.length; zi++) {
+            var zlevel = this._zlevelList[zi];
+            var layer = this._layers[zlevel];
+            if (layer.__builtin__
+                && layer !== this._hoverlayer
+                && (layer.__dirty || paintAll)
+            ) {
+                layerList.push(layer);
+            }
+        }
+
+        var finished = true;
+
+        for (var k = 0; k < layerList.length; k++) {
+            var layer = layerList[k];
+            var ctx = layer.ctx;
+            var scope = {};
+            ctx.save();
+
+            var start = paintAll ? layer.__startIndex : layer.__drawIndex;
+
+            var useTimer = !paintAll && layer.incremental && Date.now;
+            var startTime = useTimer && Date.now();
+
+            var clearColor = layer.zlevel === this._zlevelList[0]
+                ? this._backgroundColor : null;
+            // All elements in this layer are cleared.
+            if (layer.__startIndex === layer.__endIndex) {
+                layer.clear(false, clearColor);
+            }
+            else if (start === layer.__startIndex) {
+                var firstEl = list[start];
+                if (!firstEl.incremental || !firstEl.notClear || paintAll) {
+                    layer.clear(false, clearColor);
+                }
+            }
+            if (start === -1) {
+                console.error('For some unknown reason. drawIndex is -1');
+                start = layer.__startIndex;
+            }
+            for (var i = start; i < layer.__endIndex; i++) {
+                var el = list[i];
+                this._doPaintEl(el, layer, paintAll, scope);
+                el.__dirty = false;
+
+                if (useTimer) {
+                    // Date.now can be executed in 13,025,305 ops/second.
+                    var dTime = Date.now() - startTime;
+                    // Give 15 millisecond to draw.
+                    // The rest elements will be drawn in the next frame.
+                    if (dTime > 15) {
+                        break;
+                    }
+                }
+            }
+
+            layer.__drawIndex = i;
+
+            if (layer.__drawIndex < layer.__endIndex) {
+                finished = false;
+            }
+
+            if (scope.prevElClipPaths) {
+                // Needs restore the state. If last drawn element is in the clipping area.
+                ctx.restore();
+            }
+
+            ctx.restore();
+        }
+
+        if (env$1.wxa) {
+            // Flush for weixin application
+            each$1(this._layers, function (layer) {
+                if (layer && layer.ctx && layer.ctx.draw) {
+                    layer.ctx.draw();
+                }
+            });
+        }
+
+        return finished;
+    },
+
+    _doPaintEl: function (el, currentLayer, forcePaint, scope) {
+        var ctx = currentLayer.ctx;
+        var m = el.transform;
+        if (
+            (currentLayer.__dirty || forcePaint)
+            // Ignore invisible element
+            && !el.invisible
+            // Ignore transparent element
+            && el.style.opacity !== 0
+            // Ignore scale 0 element, in some environment like node-canvas
+            // Draw a scale 0 element can cause all following draw wrong
+            // And setTransform with scale 0 will cause set back transform failed.
+            && !(m && !m[0] && !m[3])
+            // Ignore culled element
+            && !(el.culling && isDisplayableCulled(el, this._width, this._height))
+        ) {
+
+            var clipPaths = el.__clipPaths;
+
+            // Optimize when clipping on group with several elements
+            if (!scope.prevElClipPaths
+                || isClipPathChanged(clipPaths, scope.prevElClipPaths)
+            ) {
+                // If has previous clipping state, restore from it
+                if (scope.prevElClipPaths) {
+                    currentLayer.ctx.restore();
+                    scope.prevElClipPaths = null;
+
+                    // Reset prevEl since context has been restored
+                    scope.prevEl = null;
+                }
+                // New clipping state
+                if (clipPaths) {
+                    ctx.save();
+                    doClip(clipPaths, ctx);
+                    scope.prevElClipPaths = clipPaths;
+                }
+            }
+            el.beforeBrush && el.beforeBrush(ctx);
+
+            el.brush(ctx, scope.prevEl || null);
+            scope.prevEl = el;
+
+            el.afterBrush && el.afterBrush(ctx);
+        }
+    },
+
+    /**
+     * 获取 zlevel 所在层，如果不存在则会创建一个新的层
+     * @param {number} zlevel
+     * @param {boolean} virtual Virtual layer will not be inserted into dom.
+     * @return {module:zrender/Layer}
+     */
+    getLayer: function (zlevel, virtual) {
+        if (this._singleCanvas && !this._needsManuallyCompositing) {
+            zlevel = CANVAS_ZLEVEL;
+        }
+        var layer = this._layers[zlevel];
+        if (!layer) {
+            // Create a new layer
+            layer = new Layer('zr_' + zlevel, this, this.dpr);
+            layer.zlevel = zlevel;
+            layer.__builtin__ = true;
+
+            if (this._layerConfig[zlevel]) {
+                merge(layer, this._layerConfig[zlevel], true);
+            }
+
+            if (virtual) {
+                layer.virtual = virtual;
+            }
+
+            this.insertLayer(zlevel, layer);
+
+            // Context is created after dom inserted to document
+            // Or excanvas will get 0px clientWidth and clientHeight
+            layer.initContext();
+        }
+
+        return layer;
+    },
+
+    insertLayer: function (zlevel, layer) {
+
+        var layersMap = this._layers;
+        var zlevelList = this._zlevelList;
+        var len = zlevelList.length;
+        var prevLayer = null;
+        var i = -1;
+        var domRoot = this._domRoot;
+
+        if (layersMap[zlevel]) {
+            zrLog('ZLevel ' + zlevel + ' has been used already');
+            return;
+        }
+        // Check if is a valid layer
+        if (!isLayerValid(layer)) {
+            zrLog('Layer of zlevel ' + zlevel + ' is not valid');
+            return;
+        }
+
+        if (len > 0 && zlevel > zlevelList[0]) {
+            for (i = 0; i < len - 1; i++) {
+                if (
+                    zlevelList[i] < zlevel
+                    && zlevelList[i + 1] > zlevel
+                ) {
+                    break;
+                }
+            }
+            prevLayer = layersMap[zlevelList[i]];
+        }
+        zlevelList.splice(i + 1, 0, zlevel);
+
+        layersMap[zlevel] = layer;
+
+        // Vitual layer will not directly show on the screen.
+        // (It can be a WebGL layer and assigned to a ZImage element)
+        // But it still under management of zrender.
+        if (!layer.virtual) {
+            if (prevLayer) {
+                var prevDom = prevLayer.dom;
+                if (prevDom.nextSibling) {
+                    domRoot.insertBefore(
+                        layer.dom,
+                        prevDom.nextSibling
+                    );
+                }
+                else {
+                    domRoot.appendChild(layer.dom);
+                }
+            }
+            else {
+                if (domRoot.firstChild) {
+                    domRoot.insertBefore(layer.dom, domRoot.firstChild);
+                }
+                else {
+                    domRoot.appendChild(layer.dom);
+                }
+            }
+        }
+    },
+
+    // Iterate each layer
+    eachLayer: function (cb, context) {
+        var zlevelList = this._zlevelList;
+        var z;
+        var i;
+        for (i = 0; i < zlevelList.length; i++) {
+            z = zlevelList[i];
+            cb.call(context, this._layers[z], z);
+        }
+    },
+
+    // Iterate each buildin layer
+    eachBuiltinLayer: function (cb, context) {
+        var zlevelList = this._zlevelList;
+        var layer;
+        var z;
+        var i;
+        for (i = 0; i < zlevelList.length; i++) {
+            z = zlevelList[i];
+            layer = this._layers[z];
+            if (layer.__builtin__) {
+                cb.call(context, layer, z);
+            }
+        }
+    },
+
+    // Iterate each other layer except buildin layer
+    eachOtherLayer: function (cb, context) {
+        var zlevelList = this._zlevelList;
+        var layer;
+        var z;
+        var i;
+        for (i = 0; i < zlevelList.length; i++) {
+            z = zlevelList[i];
+            layer = this._layers[z];
+            if (!layer.__builtin__) {
+                cb.call(context, layer, z);
+            }
+        }
+    },
+
+    /**
+     * 获取所有已创建的层
+     * @param {Array.<module:zrender/Layer>} [prevLayer]
+     */
+    getLayers: function () {
+        return this._layers;
+    },
+
+    _updateLayerStatus: function (list) {
+
+        this.eachBuiltinLayer(function (layer, z) {
+            layer.__dirty = layer.__used = false;
+        });
+
+        function updatePrevLayer(idx) {
+            if (prevLayer) {
+                if (prevLayer.__endIndex !== idx) {
+                    prevLayer.__dirty = true;
+                }
+                prevLayer.__endIndex = idx;
+            }
+        }
+
+        if (this._singleCanvas) {
+            for (var i = 1; i < list.length; i++) {
+                var el = list[i];
+                if (el.zlevel !== list[i - 1].zlevel || el.incremental) {
+                    this._needsManuallyCompositing = true;
+                    break;
+                }
+            }
+        }
+
+        var prevLayer = null;
+        var incrementalLayerCount = 0;
+        for (var i = 0; i < list.length; i++) {
+            var el = list[i];
+            var zlevel = el.zlevel;
+            var layer;
+            // PENDING If change one incremental element style ?
+            // TODO Where there are non-incremental elements between incremental elements.
+            if (el.incremental) {
+                layer = this.getLayer(zlevel + INCREMENTAL_INC, this._needsManuallyCompositing);
+                layer.incremental = true;
+                incrementalLayerCount = 1;
+            }
+            else {
+                layer = this.getLayer(zlevel + (incrementalLayerCount > 0 ? EL_AFTER_INCREMENTAL_INC : 0), this._needsManuallyCompositing);
+            }
+
+            if (!layer.__builtin__) {
+                zrLog('ZLevel ' + zlevel + ' has been used by unkown layer ' + layer.id);
+            }
+
+            if (layer !== prevLayer) {
+                layer.__used = true;
+                if (layer.__startIndex !== i) {
+                    layer.__dirty = true;
+                }
+                layer.__startIndex = i;
+                if (!layer.incremental) {
+                    layer.__drawIndex = i;
+                }
+                else {
+                    // Mark layer draw index needs to update.
+                    layer.__drawIndex = -1;
+                }
+                updatePrevLayer(i);
+                prevLayer = layer;
+            }
+            if (el.__dirty) {
+                layer.__dirty = true;
+                if (layer.incremental && layer.__drawIndex < 0) {
+                    // Start draw from the first dirty element.
+                    layer.__drawIndex = i;
+                }
+            }
+        }
+
+        updatePrevLayer(i);
+
+        this.eachBuiltinLayer(function (layer, z) {
+            // Used in last frame but not in this frame. Needs clear
+            if (!layer.__used && layer.getElementCount() > 0) {
+                layer.__dirty = true;
+                layer.__startIndex = layer.__endIndex = layer.__drawIndex = 0;
+            }
+            // For incremental layer. In case start index changed and no elements are dirty.
+            if (layer.__dirty && layer.__drawIndex < 0) {
+                layer.__drawIndex = layer.__startIndex;
+            }
+        });
+    },
+
+    /**
+     * 清除hover层外所有内容
+     */
+    clear: function () {
+        this.eachBuiltinLayer(this._clearLayer);
+        return this;
+    },
+
+    _clearLayer: function (layer) {
+        layer.clear();
+    },
+
+    setBackgroundColor: function (backgroundColor) {
+        this._backgroundColor = backgroundColor;
+    },
+
+    /**
+     * 修改指定zlevel的绘制参数
+     *
+     * @param {string} zlevel
+     * @param {Object} config 配置对象
+     * @param {string} [config.clearColor=0] 每次清空画布的颜色
+     * @param {string} [config.motionBlur=false] 是否开启动态模糊
+     * @param {number} [config.lastFrameAlpha=0.7]
+     *                 在开启动态模糊的时候使用，与上一帧混合的alpha值，值越大尾迹越明显
+     */
+    configLayer: function (zlevel, config) {
+        if (config) {
+            var layerConfig = this._layerConfig;
+            if (!layerConfig[zlevel]) {
+                layerConfig[zlevel] = config;
+            }
+            else {
+                merge(layerConfig[zlevel], config, true);
+            }
+
+            for (var i = 0; i < this._zlevelList.length; i++) {
+                var _zlevel = this._zlevelList[i];
+                if (_zlevel === zlevel || _zlevel === zlevel + EL_AFTER_INCREMENTAL_INC) {
+                    var layer = this._layers[_zlevel];
+                    merge(layer, layerConfig[zlevel], true);
+                }
+            }
+        }
+    },
+
+    /**
+     * 删除指定层
+     * @param {number} zlevel 层所在的zlevel
+     */
+    delLayer: function (zlevel) {
+        var layers = this._layers;
+        var zlevelList = this._zlevelList;
+        var layer = layers[zlevel];
+        if (!layer) {
+            return;
+        }
+        layer.dom.parentNode.removeChild(layer.dom);
+        delete layers[zlevel];
+
+        zlevelList.splice(indexOf(zlevelList, zlevel), 1);
+    },
+
+    /**
+     * 区域大小变化后重绘
+     */
+    resize: function (width, height) {
+        if (!this._domRoot.style) { // Maybe in node or worker
+            if (width == null || height == null) {
+                return;
+            }
+            this._width = width;
+            this._height = height;
+
+            this.getLayer(CANVAS_ZLEVEL).resize(width, height);
+        }
+        else {
+            var domRoot = this._domRoot;
+            // FIXME Why ?
+            domRoot.style.display = 'none';
+
+            // Save input w/h
+            var opts = this._opts;
+            width != null && (opts.width = width);
+            height != null && (opts.height = height);
+
+            width = this._getSize(0);
+            height = this._getSize(1);
+
+            domRoot.style.display = '';
+
+            // 优化没有实际改变的resize
+            if (this._width != width || height != this._height) {
+                domRoot.style.width = width + 'px';
+                domRoot.style.height = height + 'px';
+
+                for (var id in this._layers) {
+                    if (this._layers.hasOwnProperty(id)) {
+                        this._layers[id].resize(width, height);
+                    }
+                }
+                each$1(this._progressiveLayers, function (layer) {
+                    layer.resize(width, height);
+                });
+
+                this.refresh(true);
+            }
+
+            this._width = width;
+            this._height = height;
+
+        }
+        return this;
+    },
+
+    /**
+     * 清除单独的一个层
+     * @param {number} zlevel
+     */
+    clearLayer: function (zlevel) {
+        var layer = this._layers[zlevel];
+        if (layer) {
+            layer.clear();
+        }
+    },
+
+    /**
+     * 释放
+     */
+    dispose: function () {
+        this.root.innerHTML = '';
+
+        this.root =
+        this.storage =
+
+        this._domRoot =
+        this._layers = null;
+    },
+
+    /**
+     * Get canvas which has all thing rendered
+     * @param {Object} opts
+     * @param {string} [opts.backgroundColor]
+     * @param {number} [opts.pixelRatio]
+     */
+    getRenderedCanvas: function (opts) {
+        opts = opts || {};
+        if (this._singleCanvas && !this._compositeManually) {
+            return this._layers[CANVAS_ZLEVEL].dom;
+        }
+
+        var imageLayer = new Layer('image', this, opts.pixelRatio || this.dpr);
+        imageLayer.initContext();
+        imageLayer.clear(false, opts.backgroundColor || this._backgroundColor);
+
+        if (opts.pixelRatio <= this.dpr) {
+            this.refresh();
+
+            var width = imageLayer.dom.width;
+            var height = imageLayer.dom.height;
+            var ctx = imageLayer.ctx;
+            this.eachLayer(function (layer) {
+                if (layer.__builtin__) {
+                    ctx.drawImage(layer.dom, 0, 0, width, height);
+                }
+                else if (layer.renderToCanvas) {
+                    imageLayer.ctx.save();
+                    layer.renderToCanvas(imageLayer.ctx);
+                    imageLayer.ctx.restore();
+                }
+            });
+        }
+        else {
+            // PENDING, echarts-gl and incremental rendering.
+            var scope = {};
+            var displayList = this.storage.getDisplayList(true);
+            for (var i = 0; i < displayList.length; i++) {
+                var el = displayList[i];
+                this._doPaintEl(el, imageLayer, true, scope);
+            }
+        }
+
+        return imageLayer.dom;
+    },
+    /**
+     * 获取绘图区域宽度
+     */
+    getWidth: function () {
+        return this._width;
+    },
+
+    /**
+     * 获取绘图区域高度
+     */
+    getHeight: function () {
+        return this._height;
+    },
+
+    _getSize: function (whIdx) {
+        var opts = this._opts;
+        var wh = ['width', 'height'][whIdx];
+        var cwh = ['clientWidth', 'clientHeight'][whIdx];
+        var plt = ['paddingLeft', 'paddingTop'][whIdx];
+        var prb = ['paddingRight', 'paddingBottom'][whIdx];
+
+        if (opts[wh] != null && opts[wh] !== 'auto') {
+            return parseFloat(opts[wh]);
+        }
+
+        var root = this.root;
+        // IE8 does not support getComputedStyle, but it use VML.
+        var stl = document.defaultView.getComputedStyle(root);
+
+        return (
+            (root[cwh] || parseInt10(stl[wh]) || parseInt10(root.style[wh]))
+            - (parseInt10(stl[plt]) || 0)
+            - (parseInt10(stl[prb]) || 0)
+        ) | 0;
+    },
+
+    pathToImage: function (path, dpr) {
+        dpr = dpr || this.dpr;
+
+        var canvas = document.createElement('canvas');
+        var ctx = canvas.getContext('2d');
+        var rect = path.getBoundingRect();
+        var style = path.style;
+        var shadowBlurSize = style.shadowBlur * dpr;
+        var shadowOffsetX = style.shadowOffsetX * dpr;
+        var shadowOffsetY = style.shadowOffsetY * dpr;
+        var lineWidth = style.hasStroke() ? style.lineWidth : 0;
+
+        var leftMargin = Math.max(lineWidth / 2, -shadowOffsetX + shadowBlurSize);
+        var rightMargin = Math.max(lineWidth / 2, shadowOffsetX + shadowBlurSize);
+        var topMargin = Math.max(lineWidth / 2, -shadowOffsetY + shadowBlurSize);
+        var bottomMargin = Math.max(lineWidth / 2, shadowOffsetY + shadowBlurSize);
+        var width = rect.width + leftMargin + rightMargin;
+        var height = rect.height + topMargin + bottomMargin;
+
+        canvas.width = width * dpr;
+        canvas.height = height * dpr;
+
+        ctx.scale(dpr, dpr);
+        ctx.clearRect(0, 0, width, height);
+        ctx.dpr = dpr;
+
+        var pathTransform = {
+            position: path.position,
+            rotation: path.rotation,
+            scale: path.scale
+        };
+        path.position = [leftMargin - rect.x, topMargin - rect.y];
+        path.rotation = 0;
+        path.scale = [1, 1];
+        path.updateTransform();
+        if (path) {
+            path.brush(ctx);
+        }
+
+        var ImageShape = ZImage;
+        var imgShape = new ImageShape({
+            style: {
+                x: 0,
+                y: 0,
+                image: canvas
+            }
+        });
+
+        if (pathTransform.position != null) {
+            imgShape.position = path.position = pathTransform.position;
+        }
+
+        if (pathTransform.rotation != null) {
+            imgShape.rotation = path.rotation = pathTransform.rotation;
+        }
+
+        if (pathTransform.scale != null) {
+            imgShape.scale = path.scale = pathTransform.scale;
+        }
+
+        return imgShape;
+    }
+};
+
+/**
+ * 事件辅助类
+ * @module zrender/core/event
+ * @author Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ */
+
+var isDomLevel2 = (typeof window !== 'undefined') && !!window.addEventListener;
+
+var MOUSE_EVENT_REG = /^(?:mouse|pointer|contextmenu|drag|drop)|click/;
+
+function getBoundingClientRect(el) {
+    // BlackBerry 5, iOS 3 (original iPhone) don't have getBoundingRect
+    return el.getBoundingClientRect ? el.getBoundingClientRect() : {left: 0, top: 0};
+}
+
+// `calculate` is optional, default false
+function clientToLocal(el, e, out, calculate) {
+    out = out || {};
+
+    // According to the W3C Working Draft, offsetX and offsetY should be relative
+    // to the padding edge of the target element. The only browser using this convention
+    // is IE. Webkit uses the border edge, Opera uses the content edge, and FireFox does
+    // not support the properties.
+    // (see http://www.jacklmoore.com/notes/mouse-position/)
+    // In zr painter.dom, padding edge equals to border edge.
+
+    // FIXME
+    // When mousemove event triggered on ec tooltip, target is not zr painter.dom, and
+    // offsetX/Y is relative to e.target, where the calculation of zrX/Y via offsetX/Y
+    // is too complex. So css-transfrom dont support in this case temporarily.
+    if (calculate || !env$1.canvasSupported) {
+        defaultGetZrXY(el, e, out);
+    }
+    // Caution: In FireFox, layerX/layerY Mouse position relative to the closest positioned
+    // ancestor element, so we should make sure el is positioned (e.g., not position:static).
+    // BTW1, Webkit don't return the same results as FF in non-simple cases (like add
+    // zoom-factor, overflow / opacity layers, transforms ...)
+    // BTW2, (ev.offsetY || ev.pageY - $(ev.target).offset().top) is not correct in preserve-3d.
+    // <https://bugs.jquery.com/ticket/8523#comment:14>
+    // BTW3, In ff, offsetX/offsetY is always 0.
+    else if (env$1.browser.firefox && e.layerX != null && e.layerX !== e.offsetX) {
+        out.zrX = e.layerX;
+        out.zrY = e.layerY;
+    }
+    // For IE6+, chrome, safari, opera. (When will ff support offsetX?)
+    else if (e.offsetX != null) {
+        out.zrX = e.offsetX;
+        out.zrY = e.offsetY;
+    }
+    // For some other device, e.g., IOS safari.
+    else {
+        defaultGetZrXY(el, e, out);
+    }
+
+    return out;
+}
+
+function defaultGetZrXY(el, e, out) {
+    // This well-known method below does not support css transform.
+    var box = getBoundingClientRect(el);
+    out.zrX = e.clientX - box.left;
+    out.zrY = e.clientY - box.top;
+}
+
+/**
+ * 如果存在第三方嵌入的一些dom触发的事件，或touch事件，需要转换一下事件坐标.
+ * `calculate` is optional, default false.
+ */
+function normalizeEvent(el, e, calculate) {
+
+    e = e || window.event;
+
+    if (e.zrX != null) {
+        return e;
+    }
+
+    var eventType = e.type;
+    var isTouch = eventType && eventType.indexOf('touch') >= 0;
+
+    if (!isTouch) {
+        clientToLocal(el, e, e, calculate);
+        e.zrDelta = (e.wheelDelta) ? e.wheelDelta / 120 : -(e.detail || 0) / 3;
+    }
+    else {
+        var touch = eventType != 'touchend'
+            ? e.targetTouches[0]
+            : e.changedTouches[0];
+        touch && clientToLocal(el, touch, e, calculate);
+    }
+
+    // Add which for click: 1 === left; 2 === middle; 3 === right; otherwise: 0;
+    // See jQuery: https://github.com/jquery/jquery/blob/master/src/event.js
+    // If e.which has been defined, if may be readonly,
+    // see: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which
+    var button = e.button;
+    if (e.which == null && button !== undefined && MOUSE_EVENT_REG.test(e.type)) {
+        e.which = (button & 1 ? 1 : (button & 2 ? 3 : (button & 4 ? 2 : 0)));
+    }
+
+    return e;
+}
+
+/**
+ * @param {HTMLElement} el
+ * @param {string} name
+ * @param {Function} handler
+ */
+function addEventListener(el, name, handler) {
+    if (isDomLevel2) {
+        // Reproduct the console warning:
+        // [Violation] Added non-passive event listener to a scroll-blocking <some> event.
+        // Consider marking event handler as 'passive' to make the page more responsive.
+        // Just set console log level: verbose in chrome dev tool.
+        // then the warning log will be printed when addEventListener called.
+        // See https://github.com/WICG/EventListenerOptions/blob/gh-pages/explainer.md
+        // We have not yet found a neat way to using passive. Because in zrender the dom event
+        // listener delegate all of the upper events of element. Some of those events need
+        // to prevent default. For example, the feature `preventDefaultMouseMove` of echarts.
+        // Before passive can be adopted, these issues should be considered:
+        // (1) Whether and how a zrender user specifies an event listener passive. And by default,
+        // passive or not.
+        // (2) How to tread that some zrender event listener is passive, and some is not. If
+        // we use other way but not preventDefault of mousewheel and touchmove, browser
+        // compatibility should be handled.
+
+        // var opts = (env.passiveSupported && name === 'mousewheel')
+        //     ? {passive: true}
+        //     // By default, the third param of el.addEventListener is `capture: false`.
+        //     : void 0;
+        // el.addEventListener(name, handler /* , opts */);
+        el.addEventListener(name, handler);
+    }
+    else {
+        el.attachEvent('on' + name, handler);
+    }
+}
+
+function removeEventListener(el, name, handler) {
+    if (isDomLevel2) {
+        el.removeEventListener(name, handler);
+    }
+    else {
+        el.detachEvent('on' + name, handler);
+    }
+}
+
+/**
+ * preventDefault and stopPropagation.
+ * Notice: do not do that in zrender. Upper application
+ * do that if necessary.
+ *
+ * @memberOf module:zrender/core/event
+ * @method
+ * @param {Event} e : event对象
+ */
+var stop = isDomLevel2
+    ? function (e) {
+        e.preventDefault();
+        e.stopPropagation();
+        e.cancelBubble = true;
+    }
+    : function (e) {
+        e.returnValue = false;
+        e.cancelBubble = true;
+    };
+
+function notLeftMouse(e) {
+    // If e.which is undefined, considered as left mouse event.
+    return e.which > 1;
+}
+
+/**
+ * 动画主类, 调度和管理所有动画控制器
+ *
+ * @module zrender/animation/Animation
+ * @author pissang(https://github.com/pissang)
+ */
+// TODO Additive animation
+// http://iosoteric.com/additive-animations-animatewithduration-in-ios-8/
+// https://developer.apple.com/videos/wwdc2014/#236
+
+/**
+ * @typedef {Object} IZRenderStage
+ * @property {Function} update
+ */
+
+/**
+ * @alias module:zrender/animation/Animation
+ * @constructor
+ * @param {Object} [options]
+ * @param {Function} [options.onframe]
+ * @param {IZRenderStage} [options.stage]
+ * @example
+ *     var animation = new Animation();
+ *     var obj = {
+ *         x: 100,
+ *         y: 100
+ *     };
+ *     animation.animate(node.position)
+ *         .when(1000, {
+ *             x: 500,
+ *             y: 500
+ *         })
+ *         .when(2000, {
+ *             x: 100,
+ *             y: 100
+ *         })
+ *         .start('spline');
+ */
+var Animation = function (options) {
+
+    options = options || {};
+
+    this.stage = options.stage || {};
+
+    this.onframe = options.onframe || function() {};
+
+    // private properties
+    this._clips = [];
+
+    this._running = false;
+
+    this._time;
+
+    this._pausedTime;
+
+    this._pauseStart;
+
+    this._paused = false;
+
+    Eventful.call(this);
+};
+
+Animation.prototype = {
+
+    constructor: Animation,
+    /**
+     * 添加 clip
+     * @param {module:zrender/animation/Clip} clip
+     */
+    addClip: function (clip) {
+        this._clips.push(clip);
+    },
+    /**
+     * 添加 animator
+     * @param {module:zrender/animation/Animator} animator
+     */
+    addAnimator: function (animator) {
+        animator.animation = this;
+        var clips = animator.getClips();
+        for (var i = 0; i < clips.length; i++) {
+            this.addClip(clips[i]);
+        }
+    },
+    /**
+     * 删除动画片段
+     * @param {module:zrender/animation/Clip} clip
+     */
+    removeClip: function(clip) {
+        var idx = indexOf(this._clips, clip);
+        if (idx >= 0) {
+            this._clips.splice(idx, 1);
+        }
+    },
+
+    /**
+     * 删除动画片段
+     * @param {module:zrender/animation/Animator} animator
+     */
+    removeAnimator: function (animator) {
+        var clips = animator.getClips();
+        for (var i = 0; i < clips.length; i++) {
+            this.removeClip(clips[i]);
+        }
+        animator.animation = null;
+    },
+
+    _update: function() {
+        var time = new Date().getTime() - this._pausedTime;
+        var delta = time - this._time;
+        var clips = this._clips;
+        var len = clips.length;
+
+        var deferredEvents = [];
+        var deferredClips = [];
+        for (var i = 0; i < len; i++) {
+            var clip = clips[i];
+            var e = clip.step(time, delta);
+            // Throw out the events need to be called after
+            // stage.update, like destroy
+            if (e) {
+                deferredEvents.push(e);
+                deferredClips.push(clip);
+            }
+        }
+
+        // Remove the finished clip
+        for (var i = 0; i < len;) {
+            if (clips[i]._needsRemove) {
+                clips[i] = clips[len - 1];
+                clips.pop();
+                len--;
+            }
+            else {
+                i++;
+            }
+        }
+
+        len = deferredEvents.length;
+        for (var i = 0; i < len; i++) {
+            deferredClips[i].fire(deferredEvents[i]);
+        }
+
+        this._time = time;
+
+        this.onframe(delta);
+
+        // 'frame' should be triggered before stage, because upper application
+        // depends on the sequence (e.g., echarts-stream and finish
+        // event judge)
+        this.trigger('frame', delta);
+
+        if (this.stage.update) {
+            this.stage.update();
+        }
+    },
+
+    _startLoop: function () {
+        var self = this;
+
+        this._running = true;
+
+        function step() {
+            if (self._running) {
+
+                requestAnimationFrame(step);
+
+                !self._paused && self._update();
+            }
+        }
+
+        requestAnimationFrame(step);
+    },
+
+    /**
+     * Start animation.
+     */
+    start: function () {
+
+        this._time = new Date().getTime();
+        this._pausedTime = 0;
+
+        this._startLoop();
+    },
+
+    /**
+     * Stop animation.
+     */
+    stop: function () {
+        this._running = false;
+    },
+
+    /**
+     * Pause animation.
+     */
+    pause: function () {
+        if (!this._paused) {
+            this._pauseStart = new Date().getTime();
+            this._paused = true;
+        }
+    },
+
+    /**
+     * Resume animation.
+     */
+    resume: function () {
+        if (this._paused) {
+            this._pausedTime += (new Date().getTime()) - this._pauseStart;
+            this._paused = false;
+        }
+    },
+
+    /**
+     * Clear animation.
+     */
+    clear: function () {
+        this._clips = [];
+    },
+
+    /**
+     * Whether animation finished.
+     */
+    isFinished: function () {
+        return !this._clips.length;
+    },
+
+    /**
+     * Creat animator for a target, whose props can be animated.
+     *
+     * @param  {Object} target
+     * @param  {Object} options
+     * @param  {boolean} [options.loop=false] Whether loop animation.
+     * @param  {Function} [options.getter=null] Get value from target.
+     * @param  {Function} [options.setter=null] Set value to target.
+     * @return {module:zrender/animation/Animation~Animator}
+     */
+    // TODO Gap
+    animate: function (target, options) {
+        options = options || {};
+
+        var animator = new Animator(
+            target,
+            options.loop,
+            options.getter,
+            options.setter
+        );
+
+        this.addAnimator(animator);
+
+        return animator;
+    }
+};
+
+mixin(Animation, Eventful);
+
+/**
+ * Only implements needed gestures for mobile.
+ */
+
+var GestureMgr = function () {
+
+    /**
+     * @private
+     * @type {Array.<Object>}
+     */
+    this._track = [];
+};
+
+GestureMgr.prototype = {
+
+    constructor: GestureMgr,
+
+    recognize: function (event, target, root) {
+        this._doTrack(event, target, root);
+        return this._recognize(event);
+    },
+
+    clear: function () {
+        this._track.length = 0;
+        return this;
+    },
+
+    _doTrack: function (event, target, root) {
+        var touches = event.touches;
+
+        if (!touches) {
+            return;
+        }
+
+        var trackItem = {
+            points: [],
+            touches: [],
+            target: target,
+            event: event
+        };
+
+        for (var i = 0, len = touches.length; i < len; i++) {
+            var touch = touches[i];
+            var pos = clientToLocal(root, touch, {});
+            trackItem.points.push([pos.zrX, pos.zrY]);
+            trackItem.touches.push(touch);
+        }
+
+        this._track.push(trackItem);
+    },
+
+    _recognize: function (event) {
+        for (var eventName in recognizers) {
+            if (recognizers.hasOwnProperty(eventName)) {
+                var gestureInfo = recognizers[eventName](this._track, event);
+                if (gestureInfo) {
+                    return gestureInfo;
+                }
+            }
+        }
+    }
+};
+
+function dist$1(pointPair) {
+    var dx = pointPair[1][0] - pointPair[0][0];
+    var dy = pointPair[1][1] - pointPair[0][1];
+
+    return Math.sqrt(dx * dx + dy * dy);
+}
+
+function center(pointPair) {
+    return [
+        (pointPair[0][0] + pointPair[1][0]) / 2,
+        (pointPair[0][1] + pointPair[1][1]) / 2
+    ];
+}
+
+var recognizers = {
+
+    pinch: function (track, event) {
+        var trackLen = track.length;
+
+        if (!trackLen) {
+            return;
+        }
+
+        var pinchEnd = (track[trackLen - 1] || {}).points;
+        var pinchPre = (track[trackLen - 2] || {}).points || pinchEnd;
+
+        if (pinchPre
+            && pinchPre.length > 1
+            && pinchEnd
+            && pinchEnd.length > 1
+        ) {
+            var pinchScale = dist$1(pinchEnd) / dist$1(pinchPre);
+            !isFinite(pinchScale) && (pinchScale = 1);
+
+            event.pinchScale = pinchScale;
+
+            var pinchCenter = center(pinchEnd);
+            event.pinchX = pinchCenter[0];
+            event.pinchY = pinchCenter[1];
+
+            return {
+                type: 'pinch',
+                target: track[0].target,
+                event: event
+            };
+        }
+    }
+
+    // Only pinch currently.
+};
+
+var TOUCH_CLICK_DELAY = 300;
+
+var mouseHandlerNames = [
+    'click', 'dblclick', 'mousewheel', 'mouseout',
+    'mouseup', 'mousedown', 'mousemove', 'contextmenu'
+];
+
+var touchHandlerNames = [
+    'touchstart', 'touchend', 'touchmove'
+];
+
+var pointerEventNames = {
+    pointerdown: 1, pointerup: 1, pointermove: 1, pointerout: 1
+};
+
+var pointerHandlerNames = map(mouseHandlerNames, function (name) {
+    var nm = name.replace('mouse', 'pointer');
+    return pointerEventNames[nm] ? nm : name;
+});
+
+function eventNameFix(name) {
+    return (name === 'mousewheel' && env$1.browser.firefox) ? 'DOMMouseScroll' : name;
+}
+
+function processGesture(proxy, event, stage) {
+    var gestureMgr = proxy._gestureMgr;
+
+    stage === 'start' && gestureMgr.clear();
+
+    var gestureInfo = gestureMgr.recognize(
+        event,
+        proxy.handler.findHover(event.zrX, event.zrY, null).target,
+        proxy.dom
+    );
+
+    stage === 'end' && gestureMgr.clear();
+
+    // Do not do any preventDefault here. Upper application do that if necessary.
+    if (gestureInfo) {
+        var type = gestureInfo.type;
+        event.gestureEvent = type;
+
+        proxy.handler.dispatchToElement({target: gestureInfo.target}, type, gestureInfo.event);
+    }
+}
+
+// function onMSGestureChange(proxy, event) {
+//     if (event.translationX || event.translationY) {
+//         // mousemove is carried by MSGesture to reduce the sensitivity.
+//         proxy.handler.dispatchToElement(event.target, 'mousemove', event);
+//     }
+//     if (event.scale !== 1) {
+//         event.pinchX = event.offsetX;
+//         event.pinchY = event.offsetY;
+//         event.pinchScale = event.scale;
+//         proxy.handler.dispatchToElement(event.target, 'pinch', event);
+//     }
+// }
+
+/**
+ * Prevent mouse event from being dispatched after Touch Events action
+ * @see <https://github.com/deltakosh/handjs/blob/master/src/hand.base.js>
+ * 1. Mobile browsers dispatch mouse events 300ms after touchend.
+ * 2. Chrome for Android dispatch mousedown for long-touch about 650ms
+ * Result: Blocking Mouse Events for 700ms.
+ */
+function setTouchTimer(instance) {
+    instance._touching = true;
+    clearTimeout(instance._touchTimer);
+    instance._touchTimer = setTimeout(function () {
+        instance._touching = false;
+    }, 700);
+}
+
+
+var domHandlers = {
+    /**
+     * Mouse move handler
+     * @inner
+     * @param {Event} event
+     */
+    mousemove: function (event) {
+        event = normalizeEvent(this.dom, event);
+
+        this.trigger('mousemove', event);
+    },
+
+    /**
+     * Mouse out handler
+     * @inner
+     * @param {Event} event
+     */
+    mouseout: function (event) {
+        event = normalizeEvent(this.dom, event);
+
+        var element = event.toElement || event.relatedTarget;
+        if (element != this.dom) {
+            while (element && element.nodeType != 9) {
+                // 忽略包含在root中的dom引起的mouseOut
+                if (element === this.dom) {
+                    return;
+                }
+
+                element = element.parentNode;
+            }
+        }
+
+        this.trigger('mouseout', event);
+    },
+
+    /**
+     * Touch开始响应函数
+     * @inner
+     * @param {Event} event
+     */
+    touchstart: function (event) {
+        // Default mouse behaviour should not be disabled here.
+        // For example, page may needs to be slided.
+        event = normalizeEvent(this.dom, event);
+
+        // Mark touch, which is useful in distinguish touch and
+        // mouse event in upper applicatoin.
+        event.zrByTouch = true;
+
+        this._lastTouchMoment = new Date();
+
+        processGesture(this, event, 'start');
+
+        // In touch device, trigger `mousemove`(`mouseover`) should
+        // be triggered, and must before `mousedown` triggered.
+        domHandlers.mousemove.call(this, event);
+
+        domHandlers.mousedown.call(this, event);
+
+        setTouchTimer(this);
+    },
+
+    /**
+     * Touch移动响应函数
+     * @inner
+     * @param {Event} event
+     */
+    touchmove: function (event) {
+
+        event = normalizeEvent(this.dom, event);
+
+        // Mark touch, which is useful in distinguish touch and
+        // mouse event in upper applicatoin.
+        event.zrByTouch = true;
+
+        processGesture(this, event, 'change');
+
+        // Mouse move should always be triggered no matter whether
+        // there is gestrue event, because mouse move and pinch may
+        // be used at the same time.
+        domHandlers.mousemove.call(this, event);
+
+        setTouchTimer(this);
+    },
+
+    /**
+     * Touch结束响应函数
+     * @inner
+     * @param {Event} event
+     */
+    touchend: function (event) {
+
+        event = normalizeEvent(this.dom, event);
+
+        // Mark touch, which is useful in distinguish touch and
+        // mouse event in upper applicatoin.
+        event.zrByTouch = true;
+
+        processGesture(this, event, 'end');
+
+        domHandlers.mouseup.call(this, event);
+
+        // Do not trigger `mouseout` here, in spite of `mousemove`(`mouseover`) is
+        // triggered in `touchstart`. This seems to be illogical, but by this mechanism,
+        // we can conveniently implement "hover style" in both PC and touch device just
+        // by listening to `mouseover` to add "hover style" and listening to `mouseout`
+        // to remove "hover style" on an element, without any additional code for
+        // compatibility. (`mouseout` will not be triggered in `touchend`, so "hover
+        // style" will remain for user view)
+
+        // click event should always be triggered no matter whether
+        // there is gestrue event. System click can not be prevented.
+        if (+new Date() - this._lastTouchMoment < TOUCH_CLICK_DELAY) {
+            domHandlers.click.call(this, event);
+        }
+
+        setTouchTimer(this);
+    },
+
+    pointerdown: function (event) {
+        domHandlers.mousedown.call(this, event);
+
+        // if (useMSGuesture(this, event)) {
+        //     this._msGesture.addPointer(event.pointerId);
+        // }
+    },
+
+    pointermove: function (event) {
+        // FIXME
+        // pointermove is so sensitive that it always triggered when
+        // tap(click) on touch screen, which affect some judgement in
+        // upper application. So, we dont support mousemove on MS touch
+        // device yet.
+        if (!isPointerFromTouch(event)) {
+            domHandlers.mousemove.call(this, event);
+        }
+    },
+
+    pointerup: function (event) {
+        domHandlers.mouseup.call(this, event);
+    },
+
+    pointerout: function (event) {
+        // pointerout will be triggered when tap on touch screen
+        // (IE11+/Edge on MS Surface) after click event triggered,
+        // which is inconsistent with the mousout behavior we defined
+        // in touchend. So we unify them.
+        // (check domHandlers.touchend for detailed explanation)
+        if (!isPointerFromTouch(event)) {
+            domHandlers.mouseout.call(this, event);
+        }
+    }
+};
+
+function isPointerFromTouch(event) {
+    var pointerType = event.pointerType;
+    return pointerType === 'pen' || pointerType === 'touch';
+}
+
+// function useMSGuesture(handlerProxy, event) {
+//     return isPointerFromTouch(event) && !!handlerProxy._msGesture;
+// }
+
+// Common handlers
+each$1(['click', 'mousedown', 'mouseup', 'mousewheel', 'dblclick', 'contextmenu'], function (name) {
+    domHandlers[name] = function (event) {
+        event = normalizeEvent(this.dom, event);
+        this.trigger(name, event);
+    };
+});
+
+/**
+ * 为控制类实例初始化dom 事件处理函数
+ *
+ * @inner
+ * @param {module:zrender/Handler} instance 控制类实例
+ */
+function initDomHandler(instance) {
+    each$1(touchHandlerNames, function (name) {
+        instance._handlers[name] = bind(domHandlers[name], instance);
+    });
+
+    each$1(pointerHandlerNames, function (name) {
+        instance._handlers[name] = bind(domHandlers[name], instance);
+    });
+
+    each$1(mouseHandlerNames, function (name) {
+        instance._handlers[name] = makeMouseHandler(domHandlers[name], instance);
+    });
+
+    function makeMouseHandler(fn, instance) {
+        return function () {
+            if (instance._touching) {
+                return;
+            }
+            return fn.apply(instance, arguments);
+        };
+    }
+}
+
+
+function HandlerDomProxy(dom) {
+    Eventful.call(this);
+
+    this.dom = dom;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._touching = false;
+
+    /**
+     * @private
+     * @type {number}
+     */
+    this._touchTimer;
+
+    /**
+     * @private
+     * @type {module:zrender/core/GestureMgr}
+     */
+    this._gestureMgr = new GestureMgr();
+
+    this._handlers = {};
+
+    initDomHandler(this);
+
+    if (env$1.pointerEventsSupported) { // Only IE11+/Edge
+        // 1. On devices that both enable touch and mouse (e.g., MS Surface and lenovo X240),
+        // IE11+/Edge do not trigger touch event, but trigger pointer event and mouse event
+        // at the same time.
+        // 2. On MS Surface, it probablely only trigger mousedown but no mouseup when tap on
+        // screen, which do not occurs in pointer event.
+        // So we use pointer event to both detect touch gesture and mouse behavior.
+        mountHandlers(pointerHandlerNames, this);
+
+        // FIXME
+        // Note: MS Gesture require CSS touch-action set. But touch-action is not reliable,
+        // which does not prevent defuault behavior occasionally (which may cause view port
+        // zoomed in but use can not zoom it back). And event.preventDefault() does not work.
+        // So we have to not to use MSGesture and not to support touchmove and pinch on MS
+        // touch screen. And we only support click behavior on MS touch screen now.
+
+        // MS Gesture Event is only supported on IE11+/Edge and on Windows 8+.
+        // We dont support touch on IE on win7.
+        // See <https://msdn.microsoft.com/en-us/library/dn433243(v=vs.85).aspx>
+        // if (typeof MSGesture === 'function') {
+        //     (this._msGesture = new MSGesture()).target = dom; // jshint ignore:line
+        //     dom.addEventListener('MSGestureChange', onMSGestureChange);
+        // }
+    }
+    else {
+        if (env$1.touchEventsSupported) {
+            mountHandlers(touchHandlerNames, this);
+            // Handler of 'mouseout' event is needed in touch mode, which will be mounted below.
+            // addEventListener(root, 'mouseout', this._mouseoutHandler);
+        }
+
+        // 1. Considering some devices that both enable touch and mouse event (like on MS Surface
+        // and lenovo X240, @see #2350), we make mouse event be always listened, otherwise
+        // mouse event can not be handle in those devices.
+        // 2. On MS Surface, Chrome will trigger both touch event and mouse event. How to prevent
+        // mouseevent after touch event triggered, see `setTouchTimer`.
+        mountHandlers(mouseHandlerNames, this);
+    }
+
+    function mountHandlers(handlerNames, instance) {
+        each$1(handlerNames, function (name) {
+            addEventListener(dom, eventNameFix(name), instance._handlers[name]);
+        }, instance);
+    }
+}
+
+var handlerDomProxyProto = HandlerDomProxy.prototype;
+handlerDomProxyProto.dispose = function () {
+    var handlerNames = mouseHandlerNames.concat(touchHandlerNames);
+
+    for (var i = 0; i < handlerNames.length; i++) {
+        var name = handlerNames[i];
+        removeEventListener(this.dom, eventNameFix(name), this._handlers[name]);
+    }
+};
+
+handlerDomProxyProto.setCursor = function (cursorStyle) {
+    this.dom.style && (this.dom.style.cursor = cursorStyle || 'default');
+};
+
+mixin(HandlerDomProxy, Eventful);
+
+/*!
+* ZRender, a high performance 2d drawing library.
+*
+* Copyright (c) 2013, Baidu Inc.
+* All rights reserved.
+*
+* LICENSE
+* https://github.com/ecomfe/zrender/blob/master/LICENSE.txt
+*/
+
+var useVML = !env$1.canvasSupported;
+
+var painterCtors = {
+    canvas: Painter
+};
+
+var instances$1 = {};    // ZRender实例map索引
+
+/**
+ * @type {string}
+ */
+var version$1 = '4.0.4';
+
+/**
+ * Initializing a zrender instance
+ * @param {HTMLElement} dom
+ * @param {Object} opts
+ * @param {string} [opts.renderer='canvas'] 'canvas' or 'svg'
+ * @param {number} [opts.devicePixelRatio]
+ * @param {number|string} [opts.width] Can be 'auto' (the same as null/undefined)
+ * @param {number|string} [opts.height] Can be 'auto' (the same as null/undefined)
+ * @return {module:zrender/ZRender}
+ */
+function init$1(dom, opts) {
+    var zr = new ZRender(guid(), dom, opts);
+    instances$1[zr.id] = zr;
+    return zr;
+}
+
+/**
+ * Dispose zrender instance
+ * @param {module:zrender/ZRender} zr
+ */
+function dispose$1(zr) {
+    if (zr) {
+        zr.dispose();
+    }
+    else {
+        for (var key in instances$1) {
+            if (instances$1.hasOwnProperty(key)) {
+                instances$1[key].dispose();
+            }
+        }
+        instances$1 = {};
+    }
+
+    return this;
+}
+
+/**
+ * Get zrender instance by id
+ * @param {string} id zrender instance id
+ * @return {module:zrender/ZRender}
+ */
+function getInstance(id) {
+    return instances$1[id];
+}
+
+function registerPainter(name, Ctor) {
+    painterCtors[name] = Ctor;
+}
+
+function delInstance(id) {
+    delete instances$1[id];
+}
+
+/**
+ * @module zrender/ZRender
+ */
+/**
+ * @constructor
+ * @alias module:zrender/ZRender
+ * @param {string} id
+ * @param {HTMLElement} dom
+ * @param {Object} opts
+ * @param {string} [opts.renderer='canvas'] 'canvas' or 'svg'
+ * @param {number} [opts.devicePixelRatio]
+ * @param {number} [opts.width] Can be 'auto' (the same as null/undefined)
+ * @param {number} [opts.height] Can be 'auto' (the same as null/undefined)
+ */
+var ZRender = function (id, dom, opts) {
+
+    opts = opts || {};
+
+    /**
+     * @type {HTMLDomElement}
+     */
+    this.dom = dom;
+
+    /**
+     * @type {string}
+     */
+    this.id = id;
+
+    var self = this;
+    var storage = new Storage();
+
+    var rendererType = opts.renderer;
+    // TODO WebGL
+    if (useVML) {
+        if (!painterCtors.vml) {
+            throw new Error('You need to require \'zrender/vml/vml\' to support IE8');
+        }
+        rendererType = 'vml';
+    }
+    else if (!rendererType || !painterCtors[rendererType]) {
+        rendererType = 'canvas';
+    }
+    var painter = new painterCtors[rendererType](dom, storage, opts, id);
+
+    this.storage = storage;
+    this.painter = painter;
+
+    var handerProxy = (!env$1.node && !env$1.worker) ? new HandlerDomProxy(painter.getViewportRoot()) : null;
+    this.handler = new Handler(storage, painter, handerProxy, painter.root);
+
+    /**
+     * @type {module:zrender/animation/Animation}
+     */
+    this.animation = new Animation({
+        stage: {
+            update: bind(this.flush, this)
+        }
+    });
+    this.animation.start();
+
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this._needsRefresh;
+
+    // 修改 storage.delFromStorage, 每次删除元素之前删除动画
+    // FIXME 有点ugly
+    var oldDelFromStorage = storage.delFromStorage;
+    var oldAddToStorage = storage.addToStorage;
+
+    storage.delFromStorage = function (el) {
+        oldDelFromStorage.call(storage, el);
+
+        el && el.removeSelfFromZr(self);
+    };
+
+    storage.addToStorage = function (el) {
+        oldAddToStorage.call(storage, el);
+
+        el.addSelfToZr(self);
+    };
+};
+
+ZRender.prototype = {
+
+    constructor: ZRender,
+    /**
+     * 获取实例唯一标识
+     * @return {string}
+     */
+    getId: function () {
+        return this.id;
+    },
+
+    /**
+     * 添加元素
+     * @param  {module:zrender/Element} el
+     */
+    add: function (el) {
+        this.storage.addRoot(el);
+        this._needsRefresh = true;
+    },
+
+    /**
+     * 删除元素
+     * @param  {module:zrender/Element} el
+     */
+    remove: function (el) {
+        this.storage.delRoot(el);
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Change configuration of layer
+     * @param {string} zLevel
+     * @param {Object} config
+     * @param {string} [config.clearColor=0] Clear color
+     * @param {string} [config.motionBlur=false] If enable motion blur
+     * @param {number} [config.lastFrameAlpha=0.7] Motion blur factor. Larger value cause longer trailer
+    */
+    configLayer: function (zLevel, config) {
+        if (this.painter.configLayer) {
+            this.painter.configLayer(zLevel, config);
+        }
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Set background color
+     * @param {string} backgroundColor
+     */
+    setBackgroundColor: function (backgroundColor) {
+        if (this.painter.setBackgroundColor) {
+            this.painter.setBackgroundColor(backgroundColor);
+        }
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Repaint the canvas immediately
+     */
+    refreshImmediately: function () {
+        // var start = new Date();
+        // Clear needsRefresh ahead to avoid something wrong happens in refresh
+        // Or it will cause zrender refreshes again and again.
+        this._needsRefresh = false;
+        this.painter.refresh();
+        /**
+         * Avoid trigger zr.refresh in Element#beforeUpdate hook
+         */
+        this._needsRefresh = false;
+        // var end = new Date();
+        // var log = document.getElementById('log');
+        // if (log) {
+        //     log.innerHTML = log.innerHTML + '<br>' + (end - start);
+        // }
+    },
+
+    /**
+     * Mark and repaint the canvas in the next frame of browser
+     */
+    refresh: function() {
+        this._needsRefresh = true;
+    },
+
+    /**
+     * Perform all refresh
+     */
+    flush: function () {
+        var triggerRendered;
+
+        if (this._needsRefresh) {
+            triggerRendered = true;
+            this.refreshImmediately();
+        }
+        if (this._needsRefreshHover) {
+            triggerRendered = true;
+            this.refreshHoverImmediately();
+        }
+
+        triggerRendered && this.trigger('rendered');
+    },
+
+    /**
+     * Add element to hover layer
+     * @param  {module:zrender/Element} el
+     * @param {Object} style
+     */
+    addHover: function (el, style) {
+        if (this.painter.addHover) {
+            this.painter.addHover(el, style);
+            this.refreshHover();
+        }
+    },
+
+    /**
+     * Add element from hover layer
+     * @param  {module:zrender/Element} el
+     */
+    removeHover: function (el) {
+        if (this.painter.removeHover) {
+            this.painter.removeHover(el);
+            this.refreshHover();
+        }
+    },
+
+    /**
+     * Clear all hover elements in hover layer
+     * @param  {module:zrender/Element} el
+     */
+    clearHover: function () {
+        if (this.painter.clearHover) {
+            this.painter.clearHover();
+            this.refreshHover();
+        }
+    },
+
+    /**
+     * Refresh hover in next frame
+     */
+    refreshHover: function () {
+        this._needsRefreshHover = true;
+    },
+
+    /**
+     * Refresh hover immediately
+     */
+    refreshHoverImmediately: function () {
+        this._needsRefreshHover = false;
+        this.painter.refreshHover && this.painter.refreshHover();
+    },
+
+    /**
+     * Resize the canvas.
+     * Should be invoked when container size is changed
+     * @param {Object} [opts]
+     * @param {number|string} [opts.width] Can be 'auto' (the same as null/undefined)
+     * @param {number|string} [opts.height] Can be 'auto' (the same as null/undefined)
+     */
+    resize: function(opts) {
+        opts = opts || {};
+        this.painter.resize(opts.width, opts.height);
+        this.handler.resize();
+    },
+
+    /**
+     * Stop and clear all animation immediately
+     */
+    clearAnimation: function () {
+        this.animation.clear();
+    },
+
+    /**
+     * Get container width
+     */
+    getWidth: function() {
+        return this.painter.getWidth();
+    },
+
+    /**
+     * Get container height
+     */
+    getHeight: function() {
+        return this.painter.getHeight();
+    },
+
+    /**
+     * Export the canvas as Base64 URL
+     * @param {string} type
+     * @param {string} [backgroundColor='#fff']
+     * @return {string} Base64 URL
+     */
+    // toDataURL: function(type, backgroundColor) {
+    //     return this.painter.getRenderedCanvas({
+    //         backgroundColor: backgroundColor
+    //     }).toDataURL(type);
+    // },
+
+    /**
+     * Converting a path to image.
+     * It has much better performance of drawing image rather than drawing a vector path.
+     * @param {module:zrender/graphic/Path} e
+     * @param {number} width
+     * @param {number} height
+     */
+    pathToImage: function(e, dpr) {
+        return this.painter.pathToImage(e, dpr);
+    },
+
+    /**
+     * Set default cursor
+     * @param {string} [cursorStyle='default'] 例如 crosshair
+     */
+    setCursorStyle: function (cursorStyle) {
+        this.handler.setCursorStyle(cursorStyle);
+    },
+
+    /**
+     * Find hovered element
+     * @param {number} x
+     * @param {number} y
+     * @return {Object} {target, topTarget}
+     */
+    findHover: function (x, y) {
+        return this.handler.findHover(x, y);
+    },
+
+    /**
+     * Bind event
+     *
+     * @param {string} eventName Event name
+     * @param {Function} eventHandler Handler function
+     * @param {Object} [context] Context object
+     */
+    on: function(eventName, eventHandler, context) {
+        this.handler.on(eventName, eventHandler, context);
+    },
+
+    /**
+     * Unbind event
+     * @param {string} eventName Event name
+     * @param {Function} [eventHandler] Handler function
+     */
+    off: function(eventName, eventHandler) {
+        this.handler.off(eventName, eventHandler);
+    },
+
+    /**
+     * Trigger event manually
+     *
+     * @param {string} eventName Event name
+     * @param {event=} event Event object
+     */
+    trigger: function (eventName, event) {
+        this.handler.trigger(eventName, event);
+    },
+
+
+    /**
+     * Clear all objects and the canvas.
+     */
+    clear: function () {
+        this.storage.delRoot();
+        this.painter.clear();
+    },
+
+    /**
+     * Dispose self.
+     */
+    dispose: function () {
+        this.animation.stop();
+
+        this.clear();
+        this.storage.dispose();
+        this.painter.dispose();
+        this.handler.dispose();
+
+        this.animation =
+        this.storage =
+        this.painter =
+        this.handler = null;
+
+        delInstance(this.id);
+    }
+};
+
+
+
+var zrender = (Object.freeze || Object)({
+	version: version$1,
+	init: init$1,
+	dispose: dispose$1,
+	getInstance: getInstance,
+	registerPainter: registerPainter
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$2 = each$1;
+var isObject$2 = isObject$1;
+var isArray$1 = isArray;
+
+/**
+ * Make the name displayable. But we should
+ * make sure it is not duplicated with user
+ * specified name, so use '\0';
+ */
+var DUMMY_COMPONENT_NAME_PREFIX = 'series\0';
+
+/**
+ * If value is not array, then translate it to array.
+ * @param  {*} value
+ * @return {Array} [value] or value
+ */
+function normalizeToArray(value) {
+    return value instanceof Array
+        ? value
+        : value == null
+        ? []
+        : [value];
+}
+
+/**
+ * Sync default option between normal and emphasis like `position` and `show`
+ * In case some one will write code like
+ *     label: {
+ *          show: false,
+ *          position: 'outside',
+ *          fontSize: 18
+ *     },
+ *     emphasis: {
+ *          label: { show: true }
+ *     }
+ * @param {Object} opt
+ * @param {string} key
+ * @param {Array.<string>} subOpts
+ */
+function defaultEmphasis(opt, key, subOpts) {
+    // Caution: performance sensitive.
+    if (opt) {
+        opt[key] = opt[key] || {};
+        opt.emphasis = opt.emphasis || {};
+        opt.emphasis[key] = opt.emphasis[key] || {};
+
+        // Default emphasis option from normal
+        for (var i = 0, len = subOpts.length; i < len; i++) {
+            var subOptName = subOpts[i];
+            if (!opt.emphasis[key].hasOwnProperty(subOptName)
+                && opt[key].hasOwnProperty(subOptName)
+            ) {
+                opt.emphasis[key][subOptName] = opt[key][subOptName];
+            }
+        }
+    }
+}
+
+var TEXT_STYLE_OPTIONS = [
+    'fontStyle', 'fontWeight', 'fontSize', 'fontFamily',
+    'rich', 'tag', 'color', 'textBorderColor', 'textBorderWidth',
+    'width', 'height', 'lineHeight', 'align', 'verticalAlign', 'baseline',
+    'shadowColor', 'shadowBlur', 'shadowOffsetX', 'shadowOffsetY',
+    'textShadowColor', 'textShadowBlur', 'textShadowOffsetX', 'textShadowOffsetY',
+    'backgroundColor', 'borderColor', 'borderWidth', 'borderRadius', 'padding'
+];
+
+// modelUtil.LABEL_OPTIONS = modelUtil.TEXT_STYLE_OPTIONS.concat([
+//     'position', 'offset', 'rotate', 'origin', 'show', 'distance', 'formatter',
+//     'fontStyle', 'fontWeight', 'fontSize', 'fontFamily',
+//     // FIXME: deprecated, check and remove it.
+//     'textStyle'
+// ]);
+
+/**
+ * The method do not ensure performance.
+ * data could be [12, 2323, {value: 223}, [1221, 23], {value: [2, 23]}]
+ * This helper method retieves value from data.
+ * @param {string|number|Date|Array|Object} dataItem
+ * @return {number|string|Date|Array.<number|string|Date>}
+ */
+function getDataItemValue(dataItem) {
+    return (isObject$2(dataItem) && !isArray$1(dataItem) && !(dataItem instanceof Date))
+        ? dataItem.value : dataItem;
+}
+
+/**
+ * data could be [12, 2323, {value: 223}, [1221, 23], {value: [2, 23]}]
+ * This helper method determine if dataItem has extra option besides value
+ * @param {string|number|Date|Array|Object} dataItem
+ */
+function isDataItemOption(dataItem) {
+    return isObject$2(dataItem)
+        && !(dataItem instanceof Array);
+        // // markLine data can be array
+        // && !(dataItem[0] && isObject(dataItem[0]) && !(dataItem[0] instanceof Array));
+}
+
+/**
+ * Mapping to exists for merge.
+ *
+ * @public
+ * @param {Array.<Object>|Array.<module:echarts/model/Component>} exists
+ * @param {Object|Array.<Object>} newCptOptions
+ * @return {Array.<Object>} Result, like [{exist: ..., option: ...}, {}],
+ *                          index of which is the same as exists.
+ */
+function mappingToExists(exists, newCptOptions) {
+    // Mapping by the order by original option (but not order of
+    // new option) in merge mode. Because we should ensure
+    // some specified index (like xAxisIndex) is consistent with
+    // original option, which is easy to understand, espatially in
+    // media query. And in most case, merge option is used to
+    // update partial option but not be expected to change order.
+    newCptOptions = (newCptOptions || []).slice();
+
+    var result = map(exists || [], function (obj, index) {
+        return {exist: obj};
+    });
+
+    // Mapping by id or name if specified.
+    each$2(newCptOptions, function (cptOption, index) {
+        if (!isObject$2(cptOption)) {
+            return;
+        }
+
+        // id has highest priority.
+        for (var i = 0; i < result.length; i++) {
+            if (!result[i].option // Consider name: two map to one.
+                && cptOption.id != null
+                && result[i].exist.id === cptOption.id + ''
+            ) {
+                result[i].option = cptOption;
+                newCptOptions[index] = null;
+                return;
+            }
+        }
+
+        for (var i = 0; i < result.length; i++) {
+            var exist = result[i].exist;
+            if (!result[i].option // Consider name: two map to one.
+                // Can not match when both ids exist but different.
+                && (exist.id == null || cptOption.id == null)
+                && cptOption.name != null
+                && !isIdInner(cptOption)
+                && !isIdInner(exist)
+                && exist.name === cptOption.name + ''
+            ) {
+                result[i].option = cptOption;
+                newCptOptions[index] = null;
+                return;
+            }
+        }
+    });
+
+    // Otherwise mapping by index.
+    each$2(newCptOptions, function (cptOption, index) {
+        if (!isObject$2(cptOption)) {
+            return;
+        }
+
+        var i = 0;
+        for (; i < result.length; i++) {
+            var exist = result[i].exist;
+            if (!result[i].option
+                // Existing model that already has id should be able to
+                // mapped to (because after mapping performed model may
+                // be assigned with a id, whish should not affect next
+                // mapping), except those has inner id.
+                && !isIdInner(exist)
+                // Caution:
+                // Do not overwrite id. But name can be overwritten,
+                // because axis use name as 'show label text'.
+                // 'exist' always has id and name and we dont
+                // need to check it.
+                && cptOption.id == null
+            ) {
+                result[i].option = cptOption;
+                break;
+            }
+        }
+
+        if (i >= result.length) {
+            result.push({option: cptOption});
+        }
+    });
+
+    return result;
+}
+
+/**
+ * Make id and name for mapping result (result of mappingToExists)
+ * into `keyInfo` field.
+ *
+ * @public
+ * @param {Array.<Object>} Result, like [{exist: ..., option: ...}, {}],
+ *                          which order is the same as exists.
+ * @return {Array.<Object>} The input.
+ */
+function makeIdAndName(mapResult) {
+    // We use this id to hash component models and view instances
+    // in echarts. id can be specified by user, or auto generated.
+
+    // The id generation rule ensures new view instance are able
+    // to mapped to old instance when setOption are called in
+    // no-merge mode. So we generate model id by name and plus
+    // type in view id.
+
+    // name can be duplicated among components, which is convenient
+    // to specify multi components (like series) by one name.
+
+    // Ensure that each id is distinct.
+    var idMap = createHashMap();
+
+    each$2(mapResult, function (item, index) {
+        var existCpt = item.exist;
+        existCpt && idMap.set(existCpt.id, item);
+    });
+
+    each$2(mapResult, function (item, index) {
+        var opt = item.option;
+
+        assert$1(
+            !opt || opt.id == null || !idMap.get(opt.id) || idMap.get(opt.id) === item,
+            'id duplicates: ' + (opt && opt.id)
+        );
+
+        opt && opt.id != null && idMap.set(opt.id, item);
+        !item.keyInfo && (item.keyInfo = {});
+    });
+
+    // Make name and id.
+    each$2(mapResult, function (item, index) {
+        var existCpt = item.exist;
+        var opt = item.option;
+        var keyInfo = item.keyInfo;
+
+        if (!isObject$2(opt)) {
+            return;
+        }
+
+        // name can be overwitten. Consider case: axis.name = '20km'.
+        // But id generated by name will not be changed, which affect
+        // only in that case: setOption with 'not merge mode' and view
+        // instance will be recreated, which can be accepted.
+        keyInfo.name = opt.name != null
+            ? opt.name + ''
+            : existCpt
+            ? existCpt.name
+            // Avoid diffferent series has the same name,
+            // because name may be used like in color pallet.
+            : DUMMY_COMPONENT_NAME_PREFIX + index;
+
+        if (existCpt) {
+            keyInfo.id = existCpt.id;
+        }
+        else if (opt.id != null) {
+            keyInfo.id = opt.id + '';
+        }
+        else {
+            // Consider this situatoin:
+            //  optionA: [{name: 'a'}, {name: 'a'}, {..}]
+            //  optionB [{..}, {name: 'a'}, {name: 'a'}]
+            // Series with the same name between optionA and optionB
+            // should be mapped.
+            var idNum = 0;
+            do {
+                keyInfo.id = '\0' + keyInfo.name + '\0' + idNum++;
+            }
+            while (idMap.get(keyInfo.id));
+        }
+
+        idMap.set(keyInfo.id, item);
+    });
+}
+
+function isNameSpecified(componentModel) {
+    var name = componentModel.name;
+    // Is specified when `indexOf` get -1 or > 0.
+    return !!(name && name.indexOf(DUMMY_COMPONENT_NAME_PREFIX));
+}
+
+/**
+ * @public
+ * @param {Object} cptOption
+ * @return {boolean}
+ */
+function isIdInner(cptOption) {
+    return isObject$2(cptOption)
+        && cptOption.id
+        && (cptOption.id + '').indexOf('\0_ec_\0') === 0;
+}
+
+/**
+ * A helper for removing duplicate items between batchA and batchB,
+ * and in themselves, and categorize by series.
+ *
+ * @param {Array.<Object>} batchA Like: [{seriesId: 2, dataIndex: [32, 4, 5]}, ...]
+ * @param {Array.<Object>} batchB Like: [{seriesId: 2, dataIndex: [32, 4, 5]}, ...]
+ * @return {Array.<Array.<Object>, Array.<Object>>} result: [resultBatchA, resultBatchB]
+ */
+function compressBatches(batchA, batchB) {
+    var mapA = {};
+    var mapB = {};
+
+    makeMap(batchA || [], mapA);
+    makeMap(batchB || [], mapB, mapA);
+
+    return [mapToArray(mapA), mapToArray(mapB)];
+
+    function makeMap(sourceBatch, map$$1, otherMap) {
+        for (var i = 0, len = sourceBatch.length; i < len; i++) {
+            var seriesId = sourceBatch[i].seriesId;
+            var dataIndices = normalizeToArray(sourceBatch[i].dataIndex);
+            var otherDataIndices = otherMap && otherMap[seriesId];
+
+            for (var j = 0, lenj = dataIndices.length; j < lenj; j++) {
+                var dataIndex = dataIndices[j];
+
+                if (otherDataIndices && otherDataIndices[dataIndex]) {
+                    otherDataIndices[dataIndex] = null;
+                }
+                else {
+                    (map$$1[seriesId] || (map$$1[seriesId] = {}))[dataIndex] = 1;
+                }
+            }
+        }
+    }
+
+    function mapToArray(map$$1, isData) {
+        var result = [];
+        for (var i in map$$1) {
+            if (map$$1.hasOwnProperty(i) && map$$1[i] != null) {
+                if (isData) {
+                    result.push(+i);
+                }
+                else {
+                    var dataIndices = mapToArray(map$$1[i], true);
+                    dataIndices.length && result.push({seriesId: i, dataIndex: dataIndices});
+                }
+            }
+        }
+        return result;
+    }
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {Object} payload Contains dataIndex (means rawIndex) / dataIndexInside / name
+ *                         each of which can be Array or primary type.
+ * @return {number|Array.<number>} dataIndex If not found, return undefined/null.
+ */
+function queryDataIndex(data, payload) {
+    if (payload.dataIndexInside != null) {
+        return payload.dataIndexInside;
+    }
+    else if (payload.dataIndex != null) {
+        return isArray(payload.dataIndex)
+            ? map(payload.dataIndex, function (value) {
+                return data.indexOfRawIndex(value);
+            })
+            : data.indexOfRawIndex(payload.dataIndex);
+    }
+    else if (payload.name != null) {
+        return isArray(payload.name)
+            ? map(payload.name, function (value) {
+                return data.indexOfName(value);
+            })
+            : data.indexOfName(payload.name);
+    }
+}
+
+/**
+ * Enable property storage to any host object.
+ * Notice: Serialization is not supported.
+ *
+ * For example:
+ * var inner = zrUitl.makeInner();
+ *
+ * function some1(hostObj) {
+ *      inner(hostObj).someProperty = 1212;
+ *      ...
+ * }
+ * function some2() {
+ *      var fields = inner(this);
+ *      fields.someProperty1 = 1212;
+ *      fields.someProperty2 = 'xx';
+ *      ...
+ * }
+ *
+ * @return {Function}
+ */
+function makeInner() {
+    // Consider different scope by es module import.
+    var key = '__\0ec_inner_' + innerUniqueIndex++ + '_' + Math.random().toFixed(5);
+    return function (hostObj) {
+        return hostObj[key] || (hostObj[key] = {});
+    };
+}
+var innerUniqueIndex = 0;
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex, seriesId, seriesName,
+ *            geoIndex, geoId, geoName,
+ *            bmapIndex, bmapId, bmapName,
+ *            xAxisIndex, xAxisId, xAxisName,
+ *            yAxisIndex, yAxisId, yAxisName,
+ *            gridIndex, gridId, gridName,
+ *            ... (can be extended)
+ *        }
+ *        Each properties can be number|string|Array.<number>|Array.<string>
+ *        For example, a finder could be
+ *        {
+ *            seriesIndex: 3,
+ *            geoId: ['aa', 'cc'],
+ *            gridName: ['xx', 'rr']
+ *        }
+ *        xxxIndex can be set as 'all' (means all xxx) or 'none' (means not specify)
+ *        If nothing or null/undefined specified, return nothing.
+ * @param {Object} [opt]
+ * @param {string} [opt.defaultMainType]
+ * @param {Array.<string>} [opt.includeMainTypes]
+ * @return {Object} result like:
+ *        {
+ *            seriesModels: [seriesModel1, seriesModel2],
+ *            seriesModel: seriesModel1, // The first model
+ *            geoModels: [geoModel1, geoModel2],
+ *            geoModel: geoModel1, // The first model
+ *            ...
+ *        }
+ */
+function parseFinder(ecModel, finder, opt) {
+    if (isString(finder)) {
+        var obj = {};
+        obj[finder + 'Index'] = 0;
+        finder = obj;
+    }
+
+    var defaultMainType = opt && opt.defaultMainType;
+    if (defaultMainType
+        && !has(finder, defaultMainType + 'Index')
+        && !has(finder, defaultMainType + 'Id')
+        && !has(finder, defaultMainType + 'Name')
+    ) {
+        finder[defaultMainType + 'Index'] = 0;
+    }
+
+    var result = {};
+
+    each$2(finder, function (value, key) {
+        var value = finder[key];
+
+        // Exclude 'dataIndex' and other illgal keys.
+        if (key === 'dataIndex' || key === 'dataIndexInside') {
+            result[key] = value;
+            return;
+        }
+
+        var parsedKey = key.match(/^(\w+)(Index|Id|Name)$/) || [];
+        var mainType = parsedKey[1];
+        var queryType = (parsedKey[2] || '').toLowerCase();
+
+        if (!mainType
+            || !queryType
+            || value == null
+            || (queryType === 'index' && value === 'none')
+            || (opt && opt.includeMainTypes && indexOf(opt.includeMainTypes, mainType) < 0)
+        ) {
+            return;
+        }
+
+        var queryParam = {mainType: mainType};
+        if (queryType !== 'index' || value !== 'all') {
+            queryParam[queryType] = value;
+        }
+
+        var models = ecModel.queryComponents(queryParam);
+        result[mainType + 'Models'] = models;
+        result[mainType + 'Model'] = models[0];
+    });
+
+    return result;
+}
+
+function has(obj, prop) {
+    return obj && obj.hasOwnProperty(prop);
+}
+
+function setAttribute(dom, key, value) {
+    dom.setAttribute
+        ? dom.setAttribute(key, value)
+        : (dom[key] = value);
+}
+
+function getAttribute(dom, key) {
+    return dom.getAttribute
+        ? dom.getAttribute(key)
+        : dom[key];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TYPE_DELIMITER = '.';
+var IS_CONTAINER = '___EC__COMPONENT__CONTAINER___';
+
+/**
+ * Notice, parseClassType('') should returns {main: '', sub: ''}
+ * @public
+ */
+function parseClassType$1(componentType) {
+    var ret = {main: '', sub: ''};
+    if (componentType) {
+        componentType = componentType.split(TYPE_DELIMITER);
+        ret.main = componentType[0] || '';
+        ret.sub = componentType[1] || '';
+    }
+    return ret;
+}
+
+/**
+ * @public
+ */
+function checkClassType(componentType) {
+    assert$1(
+        /^[a-zA-Z0-9_]+([.][a-zA-Z0-9_]+)?$/.test(componentType),
+        'componentType "' + componentType + '" illegal'
+    );
+}
+
+/**
+ * @public
+ */
+function enableClassExtend(RootClass, mandatoryMethods) {
+
+    RootClass.$constructor = RootClass;
+    RootClass.extend = function (proto) {
+
+        if (__DEV__) {
+            each$1(mandatoryMethods, function (method) {
+                if (!proto[method]) {
+                    console.warn(
+                        'Method `' + method + '` should be implemented'
+                        + (proto.type ? ' in ' + proto.type : '') + '.'
+                    );
+                }
+            });
+        }
+
+        var superClass = this;
+        var ExtendedClass = function () {
+            if (!proto.$constructor) {
+                superClass.apply(this, arguments);
+            }
+            else {
+                proto.$constructor.apply(this, arguments);
+            }
+        };
+
+        extend(ExtendedClass.prototype, proto);
+
+        ExtendedClass.extend = this.extend;
+        ExtendedClass.superCall = superCall;
+        ExtendedClass.superApply = superApply;
+        inherits(ExtendedClass, this);
+        ExtendedClass.superClass = superClass;
+
+        return ExtendedClass;
+    };
+}
+
+var classBase = 0;
+
+/**
+ * Can not use instanceof, consider different scope by
+ * cross domain or es module import in ec extensions.
+ * Mount a method "isInstance()" to Clz.
+ */
+function enableClassCheck(Clz) {
+    var classAttr = ['__\0is_clz', classBase++, Math.random().toFixed(3)].join('_');
+    Clz.prototype[classAttr] = true;
+
+    if (__DEV__) {
+        assert$1(!Clz.isInstance, 'The method "is" can not be defined.');
+    }
+
+    Clz.isInstance = function (obj) {
+        return !!(obj && obj[classAttr]);
+    };
+}
+
+// superCall should have class info, which can not be fetch from 'this'.
+// Consider this case:
+// class A has method f,
+// class B inherits class A, overrides method f, f call superApply('f'),
+// class C inherits class B, do not overrides method f,
+// then when method of class C is called, dead loop occured.
+function superCall(context, methodName) {
+    var args = slice(arguments, 2);
+    return this.superClass.prototype[methodName].apply(context, args);
+}
+
+function superApply(context, methodName, args) {
+    return this.superClass.prototype[methodName].apply(context, args);
+}
+
+/**
+ * @param {Object} entity
+ * @param {Object} options
+ * @param {boolean} [options.registerWhenExtend]
+ * @public
+ */
+function enableClassManagement(entity, options) {
+    options = options || {};
+
+    /**
+     * Component model classes
+     * key: componentType,
+     * value:
+     *     componentClass, when componentType is 'xxx'
+     *     or Object.<subKey, componentClass>, when componentType is 'xxx.yy'
+     * @type {Object}
+     */
+    var storage = {};
+
+    entity.registerClass = function (Clazz, componentType) {
+        if (componentType) {
+            checkClassType(componentType);
+            componentType = parseClassType$1(componentType);
+
+            if (!componentType.sub) {
+                if (__DEV__) {
+                    if (storage[componentType.main]) {
+                        console.warn(componentType.main + ' exists.');
+                    }
+                }
+                storage[componentType.main] = Clazz;
+            }
+            else if (componentType.sub !== IS_CONTAINER) {
+                var container = makeContainer(componentType);
+                container[componentType.sub] = Clazz;
+            }
+        }
+        return Clazz;
+    };
+
+    entity.getClass = function (componentMainType, subType, throwWhenNotFound) {
+        var Clazz = storage[componentMainType];
+
+        if (Clazz && Clazz[IS_CONTAINER]) {
+            Clazz = subType ? Clazz[subType] : null;
+        }
+
+        if (throwWhenNotFound && !Clazz) {
+            throw new Error(
+                !subType
+                    ? componentMainType + '.' + 'type should be specified.'
+                    : 'Component ' + componentMainType + '.' + (subType || '') + ' not exists. Load it first.'
+            );
+        }
+
+        return Clazz;
+    };
+
+    entity.getClassesByMainType = function (componentType) {
+        componentType = parseClassType$1(componentType);
+
+        var result = [];
+        var obj = storage[componentType.main];
+
+        if (obj && obj[IS_CONTAINER]) {
+            each$1(obj, function (o, type) {
+                type !== IS_CONTAINER && result.push(o);
+            });
+        }
+        else {
+            result.push(obj);
+        }
+
+        return result;
+    };
+
+    entity.hasClass = function (componentType) {
+        // Just consider componentType.main.
+        componentType = parseClassType$1(componentType);
+        return !!storage[componentType.main];
+    };
+
+    /**
+     * @return {Array.<string>} Like ['aa', 'bb'], but can not be ['aa.xx']
+     */
+    entity.getAllClassMainTypes = function () {
+        var types = [];
+        each$1(storage, function (obj, type) {
+            types.push(type);
+        });
+        return types;
+    };
+
+    /**
+     * If a main type is container and has sub types
+     * @param  {string}  mainType
+     * @return {boolean}
+     */
+    entity.hasSubTypes = function (componentType) {
+        componentType = parseClassType$1(componentType);
+        var obj = storage[componentType.main];
+        return obj && obj[IS_CONTAINER];
+    };
+
+    entity.parseClassType = parseClassType$1;
+
+    function makeContainer(componentType) {
+        var container = storage[componentType.main];
+        if (!container || !container[IS_CONTAINER]) {
+            container = storage[componentType.main] = {};
+            container[IS_CONTAINER] = true;
+        }
+        return container;
+    }
+
+    if (options.registerWhenExtend) {
+        var originalExtend = entity.extend;
+        if (originalExtend) {
+            entity.extend = function (proto) {
+                var ExtendedClass = originalExtend.call(this, proto);
+                return entity.registerClass(ExtendedClass, proto.type);
+            };
+        }
+    }
+
+    return entity;
+}
+
+/**
+ * @param {string|Array.<string>} properties
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Parse shadow style
+// TODO Only shallow path support
+var makeStyleMapper = function (properties) {
+    // Normalize
+    for (var i = 0; i < properties.length; i++) {
+        if (!properties[i][1]) {
+            properties[i][1] = properties[i][0];
+        }
+    }
+    return function (model, excludes, includes) {
+        var style = {};
+        for (var i = 0; i < properties.length; i++) {
+            var propName = properties[i][1];
+            if ((excludes && indexOf(excludes, propName) >= 0)
+                || (includes && indexOf(includes, propName) < 0)
+            ) {
+                continue;
+            }
+            var val = model.getShallow(propName);
+            if (val != null) {
+                style[properties[i][0]] = val;
+            }
+        }
+        return style;
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getLineStyle = makeStyleMapper(
+    [
+        ['lineWidth', 'width'],
+        ['stroke', 'color'],
+        ['opacity'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['shadowColor']
+    ]
+);
+
+var lineStyleMixin = {
+    getLineStyle: function (excludes) {
+        var style = getLineStyle(this, excludes);
+        var lineDash = this.getLineDash(style.lineWidth);
+        lineDash && (style.lineDash = lineDash);
+        return style;
+    },
+
+    getLineDash: function (lineWidth) {
+        if (lineWidth == null) {
+            lineWidth = 1;
+        }
+        var lineType = this.get('type');
+        var dotSize = Math.max(lineWidth, 2);
+        var dashSize = lineWidth * 4;
+        return (lineType === 'solid' || lineType == null) ? null
+            : (lineType === 'dashed' ? [dashSize, dashSize] : [dotSize, dotSize]);
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getAreaStyle = makeStyleMapper(
+    [
+        ['fill', 'color'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['opacity'],
+        ['shadowColor']
+    ]
+);
+
+var areaStyleMixin = {
+    getAreaStyle: function (excludes, includes) {
+        return getAreaStyle(this, excludes, includes);
+    }
+};
+
+/**
+ * 曲线辅助模块
+ * @module zrender/core/curve
+ * @author pissang(https://www.github.com/pissang)
+ */
+
+var mathPow = Math.pow;
+var mathSqrt$2 = Math.sqrt;
+
+var EPSILON$1 = 1e-8;
+var EPSILON_NUMERIC = 1e-4;
+
+var THREE_SQRT = mathSqrt$2(3);
+var ONE_THIRD = 1 / 3;
+
+// 临时变量
+var _v0 = create();
+var _v1 = create();
+var _v2 = create();
+
+function isAroundZero(val) {
+    return val > -EPSILON$1 && val < EPSILON$1;
+}
+function isNotAroundZero$1(val) {
+    return val > EPSILON$1 || val < -EPSILON$1;
+}
+/**
+ * 计算三次贝塞尔值
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @return {number}
+ */
+function cubicAt(p0, p1, p2, p3, t) {
+    var onet = 1 - t;
+    return onet * onet * (onet * p0 + 3 * t * p1)
+            + t * t * (t * p3 + 3 * onet * p2);
+}
+
+/**
+ * 计算三次贝塞尔导数值
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @return {number}
+ */
+function cubicDerivativeAt(p0, p1, p2, p3, t) {
+    var onet = 1 - t;
+    return 3 * (
+        ((p1 - p0) * onet + 2 * (p2 - p1) * t) * onet
+        + (p3 - p2) * t * t
+    );
+}
+
+/**
+ * 计算三次贝塞尔方程根，使用盛金公式
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} val
+ * @param  {Array.<number>} roots
+ * @return {number} 有效根数目
+ */
+function cubicRootAt(p0, p1, p2, p3, val, roots) {
+    // Evaluate roots of cubic functions
+    var a = p3 + 3 * (p1 - p2) - p0;
+    var b = 3 * (p2 - p1 * 2 + p0);
+    var c = 3 * (p1  - p0);
+    var d = p0 - val;
+
+    var A = b * b - 3 * a * c;
+    var B = b * c - 9 * a * d;
+    var C = c * c - 3 * b * d;
+
+    var n = 0;
+
+    if (isAroundZero(A) && isAroundZero(B)) {
+        if (isAroundZero(b)) {
+            roots[0] = 0;
+        }
+        else {
+            var t1 = -c / b;  //t1, t2, t3, b is not zero
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+    }
+    else {
+        var disc = B * B - 4 * A * C;
+
+        if (isAroundZero(disc)) {
+            var K = B / A;
+            var t1 = -b / a + K;  // t1, a is not zero
+            var t2 = -K / 2;  // t2, t3
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                roots[n++] = t2;
+            }
+        }
+        else if (disc > 0) {
+            var discSqrt = mathSqrt$2(disc);
+            var Y1 = A * b + 1.5 * a * (-B + discSqrt);
+            var Y2 = A * b + 1.5 * a * (-B - discSqrt);
+            if (Y1 < 0) {
+                Y1 = -mathPow(-Y1, ONE_THIRD);
+            }
+            else {
+                Y1 = mathPow(Y1, ONE_THIRD);
+            }
+            if (Y2 < 0) {
+                Y2 = -mathPow(-Y2, ONE_THIRD);
+            }
+            else {
+                Y2 = mathPow(Y2, ONE_THIRD);
+            }
+            var t1 = (-b - (Y1 + Y2)) / (3 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+        else {
+            var T = (2 * A * b - 3 * a * B) / (2 * mathSqrt$2(A * A * A));
+            var theta = Math.acos(T) / 3;
+            var ASqrt = mathSqrt$2(A);
+            var tmp = Math.cos(theta);
+
+            var t1 = (-b - 2 * ASqrt * tmp) / (3 * a);
+            var t2 = (-b + ASqrt * (tmp + THREE_SQRT * Math.sin(theta))) / (3 * a);
+            var t3 = (-b + ASqrt * (tmp - THREE_SQRT * Math.sin(theta))) / (3 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                roots[n++] = t2;
+            }
+            if (t3 >= 0 && t3 <= 1) {
+                roots[n++] = t3;
+            }
+        }
+    }
+    return n;
+}
+
+/**
+ * 计算三次贝塞尔方程极限值的位置
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {Array.<number>} extrema
+ * @return {number} 有效数目
+ */
+function cubicExtrema(p0, p1, p2, p3, extrema) {
+    var b = 6 * p2 - 12 * p1 + 6 * p0;
+    var a = 9 * p1 + 3 * p3 - 3 * p0 - 9 * p2;
+    var c = 3 * p1 - 3 * p0;
+
+    var n = 0;
+    if (isAroundZero(a)) {
+        if (isNotAroundZero$1(b)) {
+            var t1 = -c / b;
+            if (t1 >= 0 && t1 <=1) {
+                extrema[n++] = t1;
+            }
+        }
+    }
+    else {
+        var disc = b * b - 4 * a * c;
+        if (isAroundZero(disc)) {
+            extrema[0] = -b / (2 * a);
+        }
+        else if (disc > 0) {
+            var discSqrt = mathSqrt$2(disc);
+            var t1 = (-b + discSqrt) / (2 * a);
+            var t2 = (-b - discSqrt) / (2 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                extrema[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                extrema[n++] = t2;
+            }
+        }
+    }
+    return n;
+}
+
+/**
+ * 细分三次贝塞尔曲线
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} p3
+ * @param  {number} t
+ * @param  {Array.<number>} out
+ */
+function cubicSubdivide(p0, p1, p2, p3, t, out) {
+    var p01 = (p1 - p0) * t + p0;
+    var p12 = (p2 - p1) * t + p1;
+    var p23 = (p3 - p2) * t + p2;
+
+    var p012 = (p12 - p01) * t + p01;
+    var p123 = (p23 - p12) * t + p12;
+
+    var p0123 = (p123 - p012) * t + p012;
+    // Seg0
+    out[0] = p0;
+    out[1] = p01;
+    out[2] = p012;
+    out[3] = p0123;
+    // Seg1
+    out[4] = p0123;
+    out[5] = p123;
+    out[6] = p23;
+    out[7] = p3;
+}
+
+/**
+ * 投射点到三次贝塞尔曲线上，返回投射距离。
+ * 投射点有可能会有一个或者多个，这里只返回其中距离最短的一个。
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {number} x3
+ * @param {number} y3
+ * @param {number} x
+ * @param {number} y
+ * @param {Array.<number>} [out] 投射点
+ * @return {number}
+ */
+function cubicProjectPoint(
+    x0, y0, x1, y1, x2, y2, x3, y3,
+    x, y, out
+) {
+    // http://pomax.github.io/bezierinfo/#projections
+    var t;
+    var interval = 0.005;
+    var d = Infinity;
+    var prev;
+    var next;
+    var d1;
+    var d2;
+
+    _v0[0] = x;
+    _v0[1] = y;
+
+    // 先粗略估计一下可能的最小距离的 t 值
+    // PENDING
+    for (var _t = 0; _t < 1; _t += 0.05) {
+        _v1[0] = cubicAt(x0, x1, x2, x3, _t);
+        _v1[1] = cubicAt(y0, y1, y2, y3, _t);
+        d1 = distSquare(_v0, _v1);
+        if (d1 < d) {
+            t = _t;
+            d = d1;
+        }
+    }
+    d = Infinity;
+
+    // At most 32 iteration
+    for (var i = 0; i < 32; i++) {
+        if (interval < EPSILON_NUMERIC) {
+            break;
+        }
+        prev = t - interval;
+        next = t + interval;
+        // t - interval
+        _v1[0] = cubicAt(x0, x1, x2, x3, prev);
+        _v1[1] = cubicAt(y0, y1, y2, y3, prev);
+
+        d1 = distSquare(_v1, _v0);
+
+        if (prev >= 0 && d1 < d) {
+            t = prev;
+            d = d1;
+        }
+        else {
+            // t + interval
+            _v2[0] = cubicAt(x0, x1, x2, x3, next);
+            _v2[1] = cubicAt(y0, y1, y2, y3, next);
+            d2 = distSquare(_v2, _v0);
+
+            if (next <= 1 && d2 < d) {
+                t = next;
+                d = d2;
+            }
+            else {
+                interval *= 0.5;
+            }
+        }
+    }
+    // t
+    if (out) {
+        out[0] = cubicAt(x0, x1, x2, x3, t);
+        out[1] = cubicAt(y0, y1, y2, y3, t);
+    }
+    // console.log(interval, i);
+    return mathSqrt$2(d);
+}
+
+/**
+ * 计算二次方贝塞尔值
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @return {number}
+ */
+function quadraticAt(p0, p1, p2, t) {
+    var onet = 1 - t;
+    return onet * (onet * p0 + 2 * t * p1) + t * t * p2;
+}
+
+/**
+ * 计算二次方贝塞尔导数值
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @return {number}
+ */
+function quadraticDerivativeAt(p0, p1, p2, t) {
+    return 2 * ((1 - t) * (p1 - p0) + t * (p2 - p1));
+}
+
+/**
+ * 计算二次方贝塞尔方程根
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @param  {Array.<number>} roots
+ * @return {number} 有效根数目
+ */
+function quadraticRootAt(p0, p1, p2, val, roots) {
+    var a = p0 - 2 * p1 + p2;
+    var b = 2 * (p1 - p0);
+    var c = p0 - val;
+
+    var n = 0;
+    if (isAroundZero(a)) {
+        if (isNotAroundZero$1(b)) {
+            var t1 = -c / b;
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+    }
+    else {
+        var disc = b * b - 4 * a * c;
+        if (isAroundZero(disc)) {
+            var t1 = -b / (2 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+        }
+        else if (disc > 0) {
+            var discSqrt = mathSqrt$2(disc);
+            var t1 = (-b + discSqrt) / (2 * a);
+            var t2 = (-b - discSqrt) / (2 * a);
+            if (t1 >= 0 && t1 <= 1) {
+                roots[n++] = t1;
+            }
+            if (t2 >= 0 && t2 <= 1) {
+                roots[n++] = t2;
+            }
+        }
+    }
+    return n;
+}
+
+/**
+ * 计算二次贝塞尔方程极限值
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @return {number}
+ */
+function quadraticExtremum(p0, p1, p2) {
+    var divider = p0 + p2 - 2 * p1;
+    if (divider === 0) {
+        // p1 is center of p0 and p2
+        return 0.5;
+    }
+    else {
+        return (p0 - p1) / divider;
+    }
+}
+
+/**
+ * 细分二次贝塞尔曲线
+ * @memberOf module:zrender/core/curve
+ * @param  {number} p0
+ * @param  {number} p1
+ * @param  {number} p2
+ * @param  {number} t
+ * @param  {Array.<number>} out
+ */
+function quadraticSubdivide(p0, p1, p2, t, out) {
+    var p01 = (p1 - p0) * t + p0;
+    var p12 = (p2 - p1) * t + p1;
+    var p012 = (p12 - p01) * t + p01;
+
+    // Seg0
+    out[0] = p0;
+    out[1] = p01;
+    out[2] = p012;
+
+    // Seg1
+    out[3] = p012;
+    out[4] = p12;
+    out[5] = p2;
+}
+
+/**
+ * 投射点到二次贝塞尔曲线上，返回投射距离。
+ * 投射点有可能会有一个或者多个，这里只返回其中距离最短的一个。
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {number} x
+ * @param {number} y
+ * @param {Array.<number>} out 投射点
+ * @return {number}
+ */
+function quadraticProjectPoint(
+    x0, y0, x1, y1, x2, y2,
+    x, y, out
+) {
+    // http://pomax.github.io/bezierinfo/#projections
+    var t;
+    var interval = 0.005;
+    var d = Infinity;
+
+    _v0[0] = x;
+    _v0[1] = y;
+
+    // 先粗略估计一下可能的最小距离的 t 值
+    // PENDING
+    for (var _t = 0; _t < 1; _t += 0.05) {
+        _v1[0] = quadraticAt(x0, x1, x2, _t);
+        _v1[1] = quadraticAt(y0, y1, y2, _t);
+        var d1 = distSquare(_v0, _v1);
+        if (d1 < d) {
+            t = _t;
+            d = d1;
+        }
+    }
+    d = Infinity;
+
+    // At most 32 iteration
+    for (var i = 0; i < 32; i++) {
+        if (interval < EPSILON_NUMERIC) {
+            break;
+        }
+        var prev = t - interval;
+        var next = t + interval;
+        // t - interval
+        _v1[0] = quadraticAt(x0, x1, x2, prev);
+        _v1[1] = quadraticAt(y0, y1, y2, prev);
+
+        var d1 = distSquare(_v1, _v0);
+
+        if (prev >= 0 && d1 < d) {
+            t = prev;
+            d = d1;
+        }
+        else {
+            // t + interval
+            _v2[0] = quadraticAt(x0, x1, x2, next);
+            _v2[1] = quadraticAt(y0, y1, y2, next);
+            var d2 = distSquare(_v2, _v0);
+            if (next <= 1 && d2 < d) {
+                t = next;
+                d = d2;
+            }
+            else {
+                interval *= 0.5;
+            }
+        }
+    }
+    // t
+    if (out) {
+        out[0] = quadraticAt(x0, x1, x2, t);
+        out[1] = quadraticAt(y0, y1, y2, t);
+    }
+    // console.log(interval, i);
+    return mathSqrt$2(d);
+}
+
+/**
+ * @author Yi Shen(https://github.com/pissang)
+ */
+
+var mathMin$3 = Math.min;
+var mathMax$3 = Math.max;
+var mathSin$2 = Math.sin;
+var mathCos$2 = Math.cos;
+var PI2 = Math.PI * 2;
+
+var start = create();
+var end = create();
+var extremity = create();
+
+/**
+ * 从顶点数组中计算出最小包围盒，写入`min`和`max`中
+ * @module zrender/core/bbox
+ * @param {Array<Object>} points 顶点数组
+ * @param {number} min
+ * @param {number} max
+ */
+function fromPoints(points, min$$1, max$$1) {
+    if (points.length === 0) {
+        return;
+    }
+    var p = points[0];
+    var left = p[0];
+    var right = p[0];
+    var top = p[1];
+    var bottom = p[1];
+    var i;
+
+    for (i = 1; i < points.length; i++) {
+        p = points[i];
+        left = mathMin$3(left, p[0]);
+        right = mathMax$3(right, p[0]);
+        top = mathMin$3(top, p[1]);
+        bottom = mathMax$3(bottom, p[1]);
+    }
+
+    min$$1[0] = left;
+    min$$1[1] = top;
+    max$$1[0] = right;
+    max$$1[1] = bottom;
+}
+
+/**
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromLine(x0, y0, x1, y1, min$$1, max$$1) {
+    min$$1[0] = mathMin$3(x0, x1);
+    min$$1[1] = mathMin$3(y0, y1);
+    max$$1[0] = mathMax$3(x0, x1);
+    max$$1[1] = mathMax$3(y0, y1);
+}
+
+var xDim = [];
+var yDim = [];
+/**
+ * 从三阶贝塞尔曲线(p0, p1, p2, p3)中计算出最小包围盒，写入`min`和`max`中
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {number} x3
+ * @param {number} y3
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromCubic(
+    x0, y0, x1, y1, x2, y2, x3, y3, min$$1, max$$1
+) {
+    var cubicExtrema$$1 = cubicExtrema;
+    var cubicAt$$1 = cubicAt;
+    var i;
+    var n = cubicExtrema$$1(x0, x1, x2, x3, xDim);
+    min$$1[0] = Infinity;
+    min$$1[1] = Infinity;
+    max$$1[0] = -Infinity;
+    max$$1[1] = -Infinity;
+
+    for (i = 0; i < n; i++) {
+        var x = cubicAt$$1(x0, x1, x2, x3, xDim[i]);
+        min$$1[0] = mathMin$3(x, min$$1[0]);
+        max$$1[0] = mathMax$3(x, max$$1[0]);
+    }
+    n = cubicExtrema$$1(y0, y1, y2, y3, yDim);
+    for (i = 0; i < n; i++) {
+        var y = cubicAt$$1(y0, y1, y2, y3, yDim[i]);
+        min$$1[1] = mathMin$3(y, min$$1[1]);
+        max$$1[1] = mathMax$3(y, max$$1[1]);
+    }
+
+    min$$1[0] = mathMin$3(x0, min$$1[0]);
+    max$$1[0] = mathMax$3(x0, max$$1[0]);
+    min$$1[0] = mathMin$3(x3, min$$1[0]);
+    max$$1[0] = mathMax$3(x3, max$$1[0]);
+
+    min$$1[1] = mathMin$3(y0, min$$1[1]);
+    max$$1[1] = mathMax$3(y0, max$$1[1]);
+    min$$1[1] = mathMin$3(y3, min$$1[1]);
+    max$$1[1] = mathMax$3(y3, max$$1[1]);
+}
+
+/**
+ * 从二阶贝塞尔曲线(p0, p1, p2)中计算出最小包围盒，写入`min`和`max`中
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x0
+ * @param {number} y0
+ * @param {number} x1
+ * @param {number} y1
+ * @param {number} x2
+ * @param {number} y2
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromQuadratic(x0, y0, x1, y1, x2, y2, min$$1, max$$1) {
+    var quadraticExtremum$$1 = quadraticExtremum;
+    var quadraticAt$$1 = quadraticAt;
+    // Find extremities, where derivative in x dim or y dim is zero
+    var tx =
+        mathMax$3(
+            mathMin$3(quadraticExtremum$$1(x0, x1, x2), 1), 0
+        );
+    var ty =
+        mathMax$3(
+            mathMin$3(quadraticExtremum$$1(y0, y1, y2), 1), 0
+        );
+
+    var x = quadraticAt$$1(x0, x1, x2, tx);
+    var y = quadraticAt$$1(y0, y1, y2, ty);
+
+    min$$1[0] = mathMin$3(x0, x2, x);
+    min$$1[1] = mathMin$3(y0, y2, y);
+    max$$1[0] = mathMax$3(x0, x2, x);
+    max$$1[1] = mathMax$3(y0, y2, y);
+}
+
+/**
+ * 从圆弧中计算出最小包围盒，写入`min`和`max`中
+ * @method
+ * @memberOf module:zrender/core/bbox
+ * @param {number} x
+ * @param {number} y
+ * @param {number} rx
+ * @param {number} ry
+ * @param {number} startAngle
+ * @param {number} endAngle
+ * @param {number} anticlockwise
+ * @param {Array.<number>} min
+ * @param {Array.<number>} max
+ */
+function fromArc(
+    x, y, rx, ry, startAngle, endAngle, anticlockwise, min$$1, max$$1
+) {
+    var vec2Min = min;
+    var vec2Max = max;
+
+    var diff = Math.abs(startAngle - endAngle);
+
+
+    if (diff % PI2 < 1e-4 && diff > 1e-4) {
+        // Is a circle
+        min$$1[0] = x - rx;
+        min$$1[1] = y - ry;
+        max$$1[0] = x + rx;
+        max$$1[1] = y + ry;
+        return;
+    }
+
+    start[0] = mathCos$2(startAngle) * rx + x;
+    start[1] = mathSin$2(startAngle) * ry + y;
+
+    end[0] = mathCos$2(endAngle) * rx + x;
+    end[1] = mathSin$2(endAngle) * ry + y;
+
+    vec2Min(min$$1, start, end);
+    vec2Max(max$$1, start, end);
+
+    // Thresh to [0, Math.PI * 2]
+    startAngle = startAngle % (PI2);
+    if (startAngle < 0) {
+        startAngle = startAngle + PI2;
+    }
+    endAngle = endAngle % (PI2);
+    if (endAngle < 0) {
+        endAngle = endAngle + PI2;
+    }
+
+    if (startAngle > endAngle && !anticlockwise) {
+        endAngle += PI2;
+    }
+    else if (startAngle < endAngle && anticlockwise) {
+        startAngle += PI2;
+    }
+    if (anticlockwise) {
+        var tmp = endAngle;
+        endAngle = startAngle;
+        startAngle = tmp;
+    }
+
+    // var number = 0;
+    // var step = (anticlockwise ? -Math.PI : Math.PI) / 2;
+    for (var angle = 0; angle < endAngle; angle += Math.PI / 2) {
+        if (angle > startAngle) {
+            extremity[0] = mathCos$2(angle) * rx + x;
+            extremity[1] = mathSin$2(angle) * ry + y;
+
+            vec2Min(min$$1, extremity, min$$1);
+            vec2Max(max$$1, extremity, max$$1);
+        }
+    }
+}
+
+/**
+ * Path 代理，可以在`buildPath`中用于替代`ctx`, 会保存每个path操作的命令到pathCommands属性中
+ * 可以用于 isInsidePath 判断以及获取boundingRect
+ *
+ * @module zrender/core/PathProxy
+ * @author Yi Shen (http://www.github.com/pissang)
+ */
+
+// TODO getTotalLength, getPointAtLength
+
+var CMD = {
+    M: 1,
+    L: 2,
+    C: 3,
+    Q: 4,
+    A: 5,
+    Z: 6,
+    // Rect
+    R: 7
+};
+
+// var CMD_MEM_SIZE = {
+//     M: 3,
+//     L: 3,
+//     C: 7,
+//     Q: 5,
+//     A: 9,
+//     R: 5,
+//     Z: 1
+// };
+
+var min$1 = [];
+var max$1 = [];
+var min2 = [];
+var max2 = [];
+var mathMin$2 = Math.min;
+var mathMax$2 = Math.max;
+var mathCos$1 = Math.cos;
+var mathSin$1 = Math.sin;
+var mathSqrt$1 = Math.sqrt;
+var mathAbs = Math.abs;
+
+var hasTypedArray = typeof Float32Array != 'undefined';
+
+/**
+ * @alias module:zrender/core/PathProxy
+ * @constructor
+ */
+var PathProxy = function (notSaveData) {
+
+    this._saveData = !(notSaveData || false);
+
+    if (this._saveData) {
+        /**
+         * Path data. Stored as flat array
+         * @type {Array.<Object>}
+         */
+        this.data = [];
+    }
+
+    this._ctx = null;
+};
+
+/**
+ * 快速计算Path包围盒（并不是最小包围盒）
+ * @return {Object}
+ */
+PathProxy.prototype = {
+
+    constructor: PathProxy,
+
+    _xi: 0,
+    _yi: 0,
+
+    _x0: 0,
+    _y0: 0,
+    // Unit x, Unit y. Provide for avoiding drawing that too short line segment
+    _ux: 0,
+    _uy: 0,
+
+    _len: 0,
+
+    _lineDash: null,
+
+    _dashOffset: 0,
+
+    _dashIdx: 0,
+
+    _dashSum: 0,
+
+    /**
+     * @readOnly
+     */
+    setScale: function (sx, sy) {
+        this._ux = mathAbs(1 / devicePixelRatio / sx) || 0;
+        this._uy = mathAbs(1 / devicePixelRatio / sy) || 0;
+    },
+
+    getContext: function () {
+        return this._ctx;
+    },
+
+    /**
+     * @param  {CanvasRenderingContext2D} ctx
+     * @return {module:zrender/core/PathProxy}
+     */
+    beginPath: function (ctx) {
+
+        this._ctx = ctx;
+
+        ctx && ctx.beginPath();
+
+        ctx && (this.dpr = ctx.dpr);
+
+        // Reset
+        if (this._saveData) {
+            this._len = 0;
+        }
+
+        if (this._lineDash) {
+            this._lineDash = null;
+
+            this._dashOffset = 0;
+        }
+
+        return this;
+    },
+
+    /**
+     * @param  {number} x
+     * @param  {number} y
+     * @return {module:zrender/core/PathProxy}
+     */
+    moveTo: function (x, y) {
+        this.addData(CMD.M, x, y);
+        this._ctx && this._ctx.moveTo(x, y);
+
+        // x0, y0, xi, yi 是记录在 _dashedXXXXTo 方法中使用
+        // xi, yi 记录当前点, x0, y0 在 closePath 的时候回到起始点。
+        // 有可能在 beginPath 之后直接调用 lineTo，这时候 x0, y0 需要
+        // 在 lineTo 方法中记录，这里先不考虑这种情况，dashed line 也只在 IE10- 中不支持
+        this._x0 = x;
+        this._y0 = y;
+
+        this._xi = x;
+        this._yi = y;
+
+        return this;
+    },
+
+    /**
+     * @param  {number} x
+     * @param  {number} y
+     * @return {module:zrender/core/PathProxy}
+     */
+    lineTo: function (x, y) {
+        var exceedUnit = mathAbs(x - this._xi) > this._ux
+            || mathAbs(y - this._yi) > this._uy
+            // Force draw the first segment
+            || this._len < 5;
+
+        this.addData(CMD.L, x, y);
+
+        if (this._ctx && exceedUnit) {
+            this._needsDash() ? this._dashedLineTo(x, y)
+                : this._ctx.lineTo(x, y);
+        }
+        if (exceedUnit) {
+            this._xi = x;
+            this._yi = y;
+        }
+
+        return this;
+    },
+
+    /**
+     * @param  {number} x1
+     * @param  {number} y1
+     * @param  {number} x2
+     * @param  {number} y2
+     * @param  {number} x3
+     * @param  {number} y3
+     * @return {module:zrender/core/PathProxy}
+     */
+    bezierCurveTo: function (x1, y1, x2, y2, x3, y3) {
+        this.addData(CMD.C, x1, y1, x2, y2, x3, y3);
+        if (this._ctx) {
+            this._needsDash() ? this._dashedBezierTo(x1, y1, x2, y2, x3, y3)
+                : this._ctx.bezierCurveTo(x1, y1, x2, y2, x3, y3);
+        }
+        this._xi = x3;
+        this._yi = y3;
+        return this;
+    },
+
+    /**
+     * @param  {number} x1
+     * @param  {number} y1
+     * @param  {number} x2
+     * @param  {number} y2
+     * @return {module:zrender/core/PathProxy}
+     */
+    quadraticCurveTo: function (x1, y1, x2, y2) {
+        this.addData(CMD.Q, x1, y1, x2, y2);
+        if (this._ctx) {
+            this._needsDash() ? this._dashedQuadraticTo(x1, y1, x2, y2)
+                : this._ctx.quadraticCurveTo(x1, y1, x2, y2);
+        }
+        this._xi = x2;
+        this._yi = y2;
+        return this;
+    },
+
+    /**
+     * @param  {number} cx
+     * @param  {number} cy
+     * @param  {number} r
+     * @param  {number} startAngle
+     * @param  {number} endAngle
+     * @param  {boolean} anticlockwise
+     * @return {module:zrender/core/PathProxy}
+     */
+    arc: function (cx, cy, r, startAngle, endAngle, anticlockwise) {
+        this.addData(
+            CMD.A, cx, cy, r, r, startAngle, endAngle - startAngle, 0, anticlockwise ? 0 : 1
+        );
+        this._ctx && this._ctx.arc(cx, cy, r, startAngle, endAngle, anticlockwise);
+
+        this._xi = mathCos$1(endAngle) * r + cx;
+        this._yi = mathSin$1(endAngle) * r + cx;
+        return this;
+    },
+
+    // TODO
+    arcTo: function (x1, y1, x2, y2, radius) {
+        if (this._ctx) {
+            this._ctx.arcTo(x1, y1, x2, y2, radius);
+        }
+        return this;
+    },
+
+    // TODO
+    rect: function (x, y, w, h) {
+        this._ctx && this._ctx.rect(x, y, w, h);
+        this.addData(CMD.R, x, y, w, h);
+        return this;
+    },
+
+    /**
+     * @return {module:zrender/core/PathProxy}
+     */
+    closePath: function () {
+        this.addData(CMD.Z);
+
+        var ctx = this._ctx;
+        var x0 = this._x0;
+        var y0 = this._y0;
+        if (ctx) {
+            this._needsDash() && this._dashedLineTo(x0, y0);
+            ctx.closePath();
+        }
+
+        this._xi = x0;
+        this._yi = y0;
+        return this;
+    },
+
+    /**
+     * Context 从外部传入，因为有可能是 rebuildPath 完之后再 fill。
+     * stroke 同样
+     * @param {CanvasRenderingContext2D} ctx
+     * @return {module:zrender/core/PathProxy}
+     */
+    fill: function (ctx) {
+        ctx && ctx.fill();
+        this.toStatic();
+    },
+
+    /**
+     * @param {CanvasRenderingContext2D} ctx
+     * @return {module:zrender/core/PathProxy}
+     */
+    stroke: function (ctx) {
+        ctx && ctx.stroke();
+        this.toStatic();
+    },
+
+    /**
+     * 必须在其它绘制命令前调用
+     * Must be invoked before all other path drawing methods
+     * @return {module:zrender/core/PathProxy}
+     */
+    setLineDash: function (lineDash) {
+        if (lineDash instanceof Array) {
+            this._lineDash = lineDash;
+
+            this._dashIdx = 0;
+
+            var lineDashSum = 0;
+            for (var i = 0; i < lineDash.length; i++) {
+                lineDashSum += lineDash[i];
+            }
+            this._dashSum = lineDashSum;
+        }
+        return this;
+    },
+
+    /**
+     * 必须在其它绘制命令前调用
+     * Must be invoked before all other path drawing methods
+     * @return {module:zrender/core/PathProxy}
+     */
+    setLineDashOffset: function (offset) {
+        this._dashOffset = offset;
+        return this;
+    },
+
+    /**
+     *
+     * @return {boolean}
+     */
+    len: function () {
+        return this._len;
+    },
+
+    /**
+     * 直接设置 Path 数据
+     */
+    setData: function (data) {
+
+        var len$$1 = data.length;
+
+        if (! (this.data && this.data.length == len$$1) && hasTypedArray) {
+            this.data = new Float32Array(len$$1);
+        }
+
+        for (var i = 0; i < len$$1; i++) {
+            this.data[i] = data[i];
+        }
+
+        this._len = len$$1;
+    },
+
+    /**
+     * 添加子路径
+     * @param {module:zrender/core/PathProxy|Array.<module:zrender/core/PathProxy>} path
+     */
+    appendPath: function (path) {
+        if (!(path instanceof Array)) {
+            path = [path];
+        }
+        var len$$1 = path.length;
+        var appendSize = 0;
+        var offset = this._len;
+        for (var i = 0; i < len$$1; i++) {
+            appendSize += path[i].len();
+        }
+        if (hasTypedArray && (this.data instanceof Float32Array)) {
+            this.data = new Float32Array(offset + appendSize);
+        }
+        for (var i = 0; i < len$$1; i++) {
+            var appendPathData = path[i].data;
+            for (var k = 0; k < appendPathData.length; k++) {
+                this.data[offset++] = appendPathData[k];
+            }
+        }
+        this._len = offset;
+    },
+
+    /**
+     * 填充 Path 数据。
+     * 尽量复用而不申明新的数组。大部分图形重绘的指令数据长度都是不变的。
+     */
+    addData: function (cmd) {
+        if (!this._saveData) {
+            return;
+        }
+
+        var data = this.data;
+        if (this._len + arguments.length > data.length) {
+            // 因为之前的数组已经转换成静态的 Float32Array
+            // 所以不够用时需要扩展一个新的动态数组
+            this._expandData();
+            data = this.data;
+        }
+        for (var i = 0; i < arguments.length; i++) {
+            data[this._len++] = arguments[i];
+        }
+
+        this._prevCmd = cmd;
+    },
+
+    _expandData: function () {
+        // Only if data is Float32Array
+        if (!(this.data instanceof Array)) {
+            var newData = [];
+            for (var i = 0; i < this._len; i++) {
+                newData[i] = this.data[i];
+            }
+            this.data = newData;
+        }
+    },
+
+    /**
+     * If needs js implemented dashed line
+     * @return {boolean}
+     * @private
+     */
+    _needsDash: function () {
+        return this._lineDash;
+    },
+
+    _dashedLineTo: function (x1, y1) {
+        var dashSum = this._dashSum;
+        var offset = this._dashOffset;
+        var lineDash = this._lineDash;
+        var ctx = this._ctx;
+
+        var x0 = this._xi;
+        var y0 = this._yi;
+        var dx = x1 - x0;
+        var dy = y1 - y0;
+        var dist$$1 = mathSqrt$1(dx * dx + dy * dy);
+        var x = x0;
+        var y = y0;
+        var dash;
+        var nDash = lineDash.length;
+        var idx;
+        dx /= dist$$1;
+        dy /= dist$$1;
+
+        if (offset < 0) {
+            // Convert to positive offset
+            offset = dashSum + offset;
+        }
+        offset %= dashSum;
+        x -= offset * dx;
+        y -= offset * dy;
+
+        while ((dx > 0 && x <= x1) || (dx < 0 && x >= x1)
+        || (dx == 0 && ((dy > 0 && y <= y1) || (dy < 0 && y >= y1)))) {
+            idx = this._dashIdx;
+            dash = lineDash[idx];
+            x += dx * dash;
+            y += dy * dash;
+            this._dashIdx = (idx + 1) % nDash;
+            // Skip positive offset
+            if ((dx > 0 && x < x0) || (dx < 0 && x > x0) || (dy > 0 && y < y0) || (dy < 0 && y > y0)) {
+                continue;
+            }
+            ctx[idx % 2 ? 'moveTo' : 'lineTo'](
+                dx >= 0 ? mathMin$2(x, x1) : mathMax$2(x, x1),
+                dy >= 0 ? mathMin$2(y, y1) : mathMax$2(y, y1)
+            );
+        }
+        // Offset for next lineTo
+        dx = x - x1;
+        dy = y - y1;
+        this._dashOffset = -mathSqrt$1(dx * dx + dy * dy);
+    },
+
+    // Not accurate dashed line to
+    _dashedBezierTo: function (x1, y1, x2, y2, x3, y3) {
+        var dashSum = this._dashSum;
+        var offset = this._dashOffset;
+        var lineDash = this._lineDash;
+        var ctx = this._ctx;
+
+        var x0 = this._xi;
+        var y0 = this._yi;
+        var t;
+        var dx;
+        var dy;
+        var cubicAt$$1 = cubicAt;
+        var bezierLen = 0;
+        var idx = this._dashIdx;
+        var nDash = lineDash.length;
+
+        var x;
+        var y;
+
+        var tmpLen = 0;
+
+        if (offset < 0) {
+            // Convert to positive offset
+            offset = dashSum + offset;
+        }
+        offset %= dashSum;
+        // Bezier approx length
+        for (t = 0; t < 1; t += 0.1) {
+            dx = cubicAt$$1(x0, x1, x2, x3, t + 0.1)
+                - cubicAt$$1(x0, x1, x2, x3, t);
+            dy = cubicAt$$1(y0, y1, y2, y3, t + 0.1)
+                - cubicAt$$1(y0, y1, y2, y3, t);
+            bezierLen += mathSqrt$1(dx * dx + dy * dy);
+        }
+
+        // Find idx after add offset
+        for (; idx < nDash; idx++) {
+            tmpLen += lineDash[idx];
+            if (tmpLen > offset) {
+                break;
+            }
+        }
+        t = (tmpLen - offset) / bezierLen;
+
+        while (t <= 1) {
+
+            x = cubicAt$$1(x0, x1, x2, x3, t);
+            y = cubicAt$$1(y0, y1, y2, y3, t);
+
+            // Use line to approximate dashed bezier
+            // Bad result if dash is long
+            idx % 2 ? ctx.moveTo(x, y)
+                : ctx.lineTo(x, y);
+
+            t += lineDash[idx] / bezierLen;
+
+            idx = (idx + 1) % nDash;
+        }
+
+        // Finish the last segment and calculate the new offset
+        (idx % 2 !== 0) && ctx.lineTo(x3, y3);
+        dx = x3 - x;
+        dy = y3 - y;
+        this._dashOffset = -mathSqrt$1(dx * dx + dy * dy);
+    },
+
+    _dashedQuadraticTo: function (x1, y1, x2, y2) {
+        // Convert quadratic to cubic using degree elevation
+        var x3 = x2;
+        var y3 = y2;
+        x2 = (x2 + 2 * x1) / 3;
+        y2 = (y2 + 2 * y1) / 3;
+        x1 = (this._xi + 2 * x1) / 3;
+        y1 = (this._yi + 2 * y1) / 3;
+
+        this._dashedBezierTo(x1, y1, x2, y2, x3, y3);
+    },
+
+    /**
+     * 转成静态的 Float32Array 减少堆内存占用
+     * Convert dynamic array to static Float32Array
+     */
+    toStatic: function () {
+        var data = this.data;
+        if (data instanceof Array) {
+            data.length = this._len;
+            if (hasTypedArray) {
+                this.data = new Float32Array(data);
+            }
+        }
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getBoundingRect: function () {
+        min$1[0] = min$1[1] = min2[0] = min2[1] = Number.MAX_VALUE;
+        max$1[0] = max$1[1] = max2[0] = max2[1] = -Number.MAX_VALUE;
+
+        var data = this.data;
+        var xi = 0;
+        var yi = 0;
+        var x0 = 0;
+        var y0 = 0;
+
+        for (var i = 0; i < data.length;) {
+            var cmd = data[i++];
+
+            if (i == 1) {
+                // 如果第一个命令是 L, C, Q
+                // 则 previous point 同绘制命令的第一个 point
+                //
+                // 第一个命令为 Arc 的情况下会在后面特殊处理
+                xi = data[i];
+                yi = data[i + 1];
+
+                x0 = xi;
+                y0 = yi;
+            }
+
+            switch (cmd) {
+                case CMD.M:
+                    // moveTo 命令重新创建一个新的 subpath, 并且更新新的起点
+                    // 在 closePath 的时候使用
+                    x0 = data[i++];
+                    y0 = data[i++];
+                    xi = x0;
+                    yi = y0;
+                    min2[0] = x0;
+                    min2[1] = y0;
+                    max2[0] = x0;
+                    max2[1] = y0;
+                    break;
+                case CMD.L:
+                    fromLine(xi, yi, data[i], data[i + 1], min2, max2);
+                    xi = data[i++];
+                    yi = data[i++];
+                    break;
+                case CMD.C:
+                    fromCubic(
+                        xi, yi, data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1],
+                        min2, max2
+                    );
+                    xi = data[i++];
+                    yi = data[i++];
+                    break;
+                case CMD.Q:
+                    fromQuadratic(
+                        xi, yi, data[i++], data[i++], data[i], data[i + 1],
+                        min2, max2
+                    );
+                    xi = data[i++];
+                    yi = data[i++];
+                    break;
+                case CMD.A:
+                    // TODO Arc 判断的开销比较大
+                    var cx = data[i++];
+                    var cy = data[i++];
+                    var rx = data[i++];
+                    var ry = data[i++];
+                    var startAngle = data[i++];
+                    var endAngle = data[i++] + startAngle;
+                    // TODO Arc 旋转
+                    var psi = data[i++];
+                    var anticlockwise = 1 - data[i++];
+
+                    if (i == 1) {
+                        // 直接使用 arc 命令
+                        // 第一个命令起点还未定义
+                        x0 = mathCos$1(startAngle) * rx + cx;
+                        y0 = mathSin$1(startAngle) * ry + cy;
+                    }
+
+                    fromArc(
+                        cx, cy, rx, ry, startAngle, endAngle,
+                        anticlockwise, min2, max2
+                    );
+
+                    xi = mathCos$1(endAngle) * rx + cx;
+                    yi = mathSin$1(endAngle) * ry + cy;
+                    break;
+                case CMD.R:
+                    x0 = xi = data[i++];
+                    y0 = yi = data[i++];
+                    var width = data[i++];
+                    var height = data[i++];
+                    // Use fromLine
+                    fromLine(x0, y0, x0 + width, y0 + height, min2, max2);
+                    break;
+                case CMD.Z:
+                    xi = x0;
+                    yi = y0;
+                    break;
+            }
+
+            // Union
+            min(min$1, min$1, min2);
+            max(max$1, max$1, max2);
+        }
+
+        // No data
+        if (i === 0) {
+            min$1[0] = min$1[1] = max$1[0] = max$1[1] = 0;
+        }
+
+        return new BoundingRect(
+            min$1[0], min$1[1], max$1[0] - min$1[0], max$1[1] - min$1[1]
+        );
+    },
+
+    /**
+     * Rebuild path from current data
+     * Rebuild path will not consider javascript implemented line dash.
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    rebuildPath: function (ctx) {
+        var d = this.data;
+        var x0, y0;
+        var xi, yi;
+        var x, y;
+        var ux = this._ux;
+        var uy = this._uy;
+        var len$$1 = this._len;
+        for (var i = 0; i < len$$1;) {
+            var cmd = d[i++];
+
+            if (i == 1) {
+                // 如果第一个命令是 L, C, Q
+                // 则 previous point 同绘制命令的第一个 point
+                //
+                // 第一个命令为 Arc 的情况下会在后面特殊处理
+                xi = d[i];
+                yi = d[i + 1];
+
+                x0 = xi;
+                y0 = yi;
+            }
+            switch (cmd) {
+                case CMD.M:
+                    x0 = xi = d[i++];
+                    y0 = yi = d[i++];
+                    ctx.moveTo(xi, yi);
+                    break;
+                case CMD.L:
+                    x = d[i++];
+                    y = d[i++];
+                    // Not draw too small seg between
+                    if (mathAbs(x - xi) > ux || mathAbs(y - yi) > uy || i === len$$1 - 1) {
+                        ctx.lineTo(x, y);
+                        xi = x;
+                        yi = y;
+                    }
+                    break;
+                case CMD.C:
+                    ctx.bezierCurveTo(
+                        d[i++], d[i++], d[i++], d[i++], d[i++], d[i++]
+                    );
+                    xi = d[i - 2];
+                    yi = d[i - 1];
+                    break;
+                case CMD.Q:
+                    ctx.quadraticCurveTo(d[i++], d[i++], d[i++], d[i++]);
+                    xi = d[i - 2];
+                    yi = d[i - 1];
+                    break;
+                case CMD.A:
+                    var cx = d[i++];
+                    var cy = d[i++];
+                    var rx = d[i++];
+                    var ry = d[i++];
+                    var theta = d[i++];
+                    var dTheta = d[i++];
+                    var psi = d[i++];
+                    var fs = d[i++];
+                    var r = (rx > ry) ? rx : ry;
+                    var scaleX = (rx > ry) ? 1 : rx / ry;
+                    var scaleY = (rx > ry) ? ry / rx : 1;
+                    var isEllipse = Math.abs(rx - ry) > 1e-3;
+                    var endAngle = theta + dTheta;
+                    if (isEllipse) {
+                        ctx.translate(cx, cy);
+                        ctx.rotate(psi);
+                        ctx.scale(scaleX, scaleY);
+                        ctx.arc(0, 0, r, theta, endAngle, 1 - fs);
+                        ctx.scale(1 / scaleX, 1 / scaleY);
+                        ctx.rotate(-psi);
+                        ctx.translate(-cx, -cy);
+                    }
+                    else {
+                        ctx.arc(cx, cy, r, theta, endAngle, 1 - fs);
+                    }
+
+                    if (i == 1) {
+                        // 直接使用 arc 命令
+                        // 第一个命令起点还未定义
+                        x0 = mathCos$1(theta) * rx + cx;
+                        y0 = mathSin$1(theta) * ry + cy;
+                    }
+                    xi = mathCos$1(endAngle) * rx + cx;
+                    yi = mathSin$1(endAngle) * ry + cy;
+                    break;
+                case CMD.R:
+                    x0 = xi = d[i];
+                    y0 = yi = d[i + 1];
+                    ctx.rect(d[i++], d[i++], d[i++], d[i++]);
+                    break;
+                case CMD.Z:
+                    ctx.closePath();
+                    xi = x0;
+                    yi = y0;
+            }
+        }
+    }
+};
+
+PathProxy.CMD = CMD;
+
+/**
+ * 线段包含判断
+ * @param  {number}  x0
+ * @param  {number}  y0
+ * @param  {number}  x1
+ * @param  {number}  y1
+ * @param  {number}  lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {boolean}
+ */
+function containStroke$1(x0, y0, x1, y1, lineWidth, x, y) {
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+    var _a = 0;
+    var _b = x0;
+    // Quick reject
+    if (
+        (y > y0 + _l && y > y1 + _l)
+        || (y < y0 - _l && y < y1 - _l)
+        || (x > x0 + _l && x > x1 + _l)
+        || (x < x0 - _l && x < x1 - _l)
+    ) {
+        return false;
+    }
+
+    if (x0 !== x1) {
+        _a = (y0 - y1) / (x0 - x1);
+        _b = (x0 * y1 - x1 * y0) / (x0 - x1) ;
+    }
+    else {
+        return Math.abs(x - x0) <= _l / 2;
+    }
+    var tmp = _a * x - y + _b;
+    var _s = tmp * tmp / (_a * _a + 1);
+    return _s <= _l / 2 * _l / 2;
+}
+
+/**
+ * 三次贝塞尔曲线描边包含判断
+ * @param  {number}  x0
+ * @param  {number}  y0
+ * @param  {number}  x1
+ * @param  {number}  y1
+ * @param  {number}  x2
+ * @param  {number}  y2
+ * @param  {number}  x3
+ * @param  {number}  y3
+ * @param  {number}  lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {boolean}
+ */
+function containStroke$2(x0, y0, x1, y1, x2, y2, x3, y3, lineWidth, x, y) {
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+    // Quick reject
+    if (
+        (y > y0 + _l && y > y1 + _l && y > y2 + _l && y > y3 + _l)
+        || (y < y0 - _l && y < y1 - _l && y < y2 - _l && y < y3 - _l)
+        || (x > x0 + _l && x > x1 + _l && x > x2 + _l && x > x3 + _l)
+        || (x < x0 - _l && x < x1 - _l && x < x2 - _l && x < x3 - _l)
+    ) {
+        return false;
+    }
+    var d = cubicProjectPoint(
+        x0, y0, x1, y1, x2, y2, x3, y3,
+        x, y, null
+    );
+    return d <= _l / 2;
+}
+
+/**
+ * 二次贝塞尔曲线描边包含判断
+ * @param  {number}  x0
+ * @param  {number}  y0
+ * @param  {number}  x1
+ * @param  {number}  y1
+ * @param  {number}  x2
+ * @param  {number}  y2
+ * @param  {number}  lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {boolean}
+ */
+function containStroke$3(x0, y0, x1, y1, x2, y2, lineWidth, x, y) {
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+    // Quick reject
+    if (
+        (y > y0 + _l && y > y1 + _l && y > y2 + _l)
+        || (y < y0 - _l && y < y1 - _l && y < y2 - _l)
+        || (x > x0 + _l && x > x1 + _l && x > x2 + _l)
+        || (x < x0 - _l && x < x1 - _l && x < x2 - _l)
+    ) {
+        return false;
+    }
+    var d = quadraticProjectPoint(
+        x0, y0, x1, y1, x2, y2,
+        x, y, null
+    );
+    return d <= _l / 2;
+}
+
+var PI2$3 = Math.PI * 2;
+
+function normalizeRadian(angle) {
+    angle %= PI2$3;
+    if (angle < 0) {
+        angle += PI2$3;
+    }
+    return angle;
+}
+
+var PI2$2 = Math.PI * 2;
+
+/**
+ * 圆弧描边包含判断
+ * @param  {number}  cx
+ * @param  {number}  cy
+ * @param  {number}  r
+ * @param  {number}  startAngle
+ * @param  {number}  endAngle
+ * @param  {boolean}  anticlockwise
+ * @param  {number} lineWidth
+ * @param  {number}  x
+ * @param  {number}  y
+ * @return {Boolean}
+ */
+function containStroke$4(
+    cx, cy, r, startAngle, endAngle, anticlockwise,
+    lineWidth, x, y
+) {
+
+    if (lineWidth === 0) {
+        return false;
+    }
+    var _l = lineWidth;
+
+    x -= cx;
+    y -= cy;
+    var d = Math.sqrt(x * x + y * y);
+
+    if ((d - _l > r) || (d + _l < r)) {
+        return false;
+    }
+    if (Math.abs(startAngle - endAngle) % PI2$2 < 1e-4) {
+        // Is a circle
+        return true;
+    }
+    if (anticlockwise) {
+        var tmp = startAngle;
+        startAngle = normalizeRadian(endAngle);
+        endAngle = normalizeRadian(tmp);
+    } else {
+        startAngle = normalizeRadian(startAngle);
+        endAngle = normalizeRadian(endAngle);
+    }
+    if (startAngle > endAngle) {
+        endAngle += PI2$2;
+    }
+
+    var angle = Math.atan2(y, x);
+    if (angle < 0) {
+        angle += PI2$2;
+    }
+    return (angle >= startAngle && angle <= endAngle)
+        || (angle + PI2$2 >= startAngle && angle + PI2$2 <= endAngle);
+}
+
+function windingLine(x0, y0, x1, y1, x, y) {
+    if ((y > y0 && y > y1) || (y < y0 && y < y1)) {
+        return 0;
+    }
+    // Ignore horizontal line
+    if (y1 === y0) {
+        return 0;
+    }
+    var dir = y1 < y0 ? 1 : -1;
+    var t = (y - y0) / (y1 - y0);
+
+    // Avoid winding error when intersection point is the connect point of two line of polygon
+    if (t === 1 || t === 0) {
+        dir = y1 < y0 ? 0.5 : -0.5;
+    }
+
+    var x_ = t * (x1 - x0) + x0;
+
+    // If (x, y) on the line, considered as "contain".
+    return x_ === x ? Infinity : x_ > x ? dir : 0;
+}
+
+var CMD$1 = PathProxy.CMD;
+var PI2$1 = Math.PI * 2;
+
+var EPSILON$2 = 1e-4;
+
+function isAroundEqual(a, b) {
+    return Math.abs(a - b) < EPSILON$2;
+}
+
+// 临时数组
+var roots = [-1, -1, -1];
+var extrema = [-1, -1];
+
+function swapExtrema() {
+    var tmp = extrema[0];
+    extrema[0] = extrema[1];
+    extrema[1] = tmp;
+}
+
+function windingCubic(x0, y0, x1, y1, x2, y2, x3, y3, x, y) {
+    // Quick reject
+    if (
+        (y > y0 && y > y1 && y > y2 && y > y3)
+        || (y < y0 && y < y1 && y < y2 && y < y3)
+    ) {
+        return 0;
+    }
+    var nRoots = cubicRootAt(y0, y1, y2, y3, y, roots);
+    if (nRoots === 0) {
+        return 0;
+    }
+    else {
+        var w = 0;
+        var nExtrema = -1;
+        var y0_, y1_;
+        for (var i = 0; i < nRoots; i++) {
+            var t = roots[i];
+
+            // Avoid winding error when intersection point is the connect point of two line of polygon
+            var unit = (t === 0 || t === 1) ? 0.5 : 1;
+
+            var x_ = cubicAt(x0, x1, x2, x3, t);
+            if (x_ < x) { // Quick reject
+                continue;
+            }
+            if (nExtrema < 0) {
+                nExtrema = cubicExtrema(y0, y1, y2, y3, extrema);
+                if (extrema[1] < extrema[0] && nExtrema > 1) {
+                    swapExtrema();
+                }
+                y0_ = cubicAt(y0, y1, y2, y3, extrema[0]);
+                if (nExtrema > 1) {
+                    y1_ = cubicAt(y0, y1, y2, y3, extrema[1]);
+                }
+            }
+            if (nExtrema == 2) {
+                // 分成三段单调函数
+                if (t < extrema[0]) {
+                    w += y0_ < y0 ? unit : -unit;
+                }
+                else if (t < extrema[1]) {
+                    w += y1_ < y0_ ? unit : -unit;
+                }
+                else {
+                    w += y3 < y1_ ? unit : -unit;
+                }
+            }
+            else {
+                // 分成两段单调函数
+                if (t < extrema[0]) {
+                    w += y0_ < y0 ? unit : -unit;
+                }
+                else {
+                    w += y3 < y0_ ? unit : -unit;
+                }
+            }
+        }
+        return w;
+    }
+}
+
+function windingQuadratic(x0, y0, x1, y1, x2, y2, x, y) {
+    // Quick reject
+    if (
+        (y > y0 && y > y1 && y > y2)
+        || (y < y0 && y < y1 && y < y2)
+    ) {
+        return 0;
+    }
+    var nRoots = quadraticRootAt(y0, y1, y2, y, roots);
+    if (nRoots === 0) {
+        return 0;
+    }
+    else {
+        var t = quadraticExtremum(y0, y1, y2);
+        if (t >= 0 && t <= 1) {
+            var w = 0;
+            var y_ = quadraticAt(y0, y1, y2, t);
+            for (var i = 0; i < nRoots; i++) {
+                // Remove one endpoint.
+                var unit = (roots[i] === 0 || roots[i] === 1) ? 0.5 : 1;
+
+                var x_ = quadraticAt(x0, x1, x2, roots[i]);
+                if (x_ < x) {   // Quick reject
+                    continue;
+                }
+                if (roots[i] < t) {
+                    w += y_ < y0 ? unit : -unit;
+                }
+                else {
+                    w += y2 < y_ ? unit : -unit;
+                }
+            }
+            return w;
+        }
+        else {
+            // Remove one endpoint.
+            var unit = (roots[0] === 0 || roots[0] === 1) ? 0.5 : 1;
+
+            var x_ = quadraticAt(x0, x1, x2, roots[0]);
+            if (x_ < x) {   // Quick reject
+                return 0;
+            }
+            return y2 < y0 ? unit : -unit;
+        }
+    }
+}
+
+// TODO
+// Arc 旋转
+function windingArc(
+    cx, cy, r, startAngle, endAngle, anticlockwise, x, y
+) {
+    y -= cy;
+    if (y > r || y < -r) {
+        return 0;
+    }
+    var tmp = Math.sqrt(r * r - y * y);
+    roots[0] = -tmp;
+    roots[1] = tmp;
+
+    var diff = Math.abs(startAngle - endAngle);
+    if (diff < 1e-4) {
+        return 0;
+    }
+    if (diff % PI2$1 < 1e-4) {
+        // Is a circle
+        startAngle = 0;
+        endAngle = PI2$1;
+        var dir = anticlockwise ? 1 : -1;
+        if (x >= roots[0] + cx && x <= roots[1] + cx) {
+            return dir;
+        } else {
+            return 0;
+        }
+    }
+
+    if (anticlockwise) {
+        var tmp = startAngle;
+        startAngle = normalizeRadian(endAngle);
+        endAngle = normalizeRadian(tmp);
+    }
+    else {
+        startAngle = normalizeRadian(startAngle);
+        endAngle = normalizeRadian(endAngle);
+    }
+    if (startAngle > endAngle) {
+        endAngle += PI2$1;
+    }
+
+    var w = 0;
+    for (var i = 0; i < 2; i++) {
+        var x_ = roots[i];
+        if (x_ + cx > x) {
+            var angle = Math.atan2(y, x_);
+            var dir = anticlockwise ? 1 : -1;
+            if (angle < 0) {
+                angle = PI2$1 + angle;
+            }
+            if (
+                (angle >= startAngle && angle <= endAngle)
+                || (angle + PI2$1 >= startAngle && angle + PI2$1 <= endAngle)
+            ) {
+                if (angle > Math.PI / 2 && angle < Math.PI * 1.5) {
+                    dir = -dir;
+                }
+                w += dir;
+            }
+        }
+    }
+    return w;
+}
+
+function containPath(data, lineWidth, isStroke, x, y) {
+    var w = 0;
+    var xi = 0;
+    var yi = 0;
+    var x0 = 0;
+    var y0 = 0;
+
+    for (var i = 0; i < data.length;) {
+        var cmd = data[i++];
+        // Begin a new subpath
+        if (cmd === CMD$1.M && i > 1) {
+            // Close previous subpath
+            if (!isStroke) {
+                w += windingLine(xi, yi, x0, y0, x, y);
+            }
+            // 如果被任何一个 subpath 包含
+            // if (w !== 0) {
+            //     return true;
+            // }
+        }
+
+        if (i == 1) {
+            // 如果第一个命令是 L, C, Q
+            // 则 previous point 同绘制命令的第一个 point
+            //
+            // 第一个命令为 Arc 的情况下会在后面特殊处理
+            xi = data[i];
+            yi = data[i + 1];
+
+            x0 = xi;
+            y0 = yi;
+        }
+
+        switch (cmd) {
+            case CMD$1.M:
+                // moveTo 命令重新创建一个新的 subpath, 并且更新新的起点
+                // 在 closePath 的时候使用
+                x0 = data[i++];
+                y0 = data[i++];
+                xi = x0;
+                yi = y0;
+                break;
+            case CMD$1.L:
+                if (isStroke) {
+                    if (containStroke$1(xi, yi, data[i], data[i + 1], lineWidth, x, y)) {
+                        return true;
+                    }
+                }
+                else {
+                    // NOTE 在第一个命令为 L, C, Q 的时候会计算出 NaN
+                    w += windingLine(xi, yi, data[i], data[i + 1], x, y) || 0;
+                }
+                xi = data[i++];
+                yi = data[i++];
+                break;
+            case CMD$1.C:
+                if (isStroke) {
+                    if (containStroke$2(xi, yi,
+                        data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1],
+                        lineWidth, x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    w += windingCubic(
+                        xi, yi,
+                        data[i++], data[i++], data[i++], data[i++], data[i], data[i + 1],
+                        x, y
+                    ) || 0;
+                }
+                xi = data[i++];
+                yi = data[i++];
+                break;
+            case CMD$1.Q:
+                if (isStroke) {
+                    if (containStroke$3(xi, yi,
+                        data[i++], data[i++], data[i], data[i + 1],
+                        lineWidth, x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    w += windingQuadratic(
+                        xi, yi,
+                        data[i++], data[i++], data[i], data[i + 1],
+                        x, y
+                    ) || 0;
+                }
+                xi = data[i++];
+                yi = data[i++];
+                break;
+            case CMD$1.A:
+                // TODO Arc 判断的开销比较大
+                var cx = data[i++];
+                var cy = data[i++];
+                var rx = data[i++];
+                var ry = data[i++];
+                var theta = data[i++];
+                var dTheta = data[i++];
+                // TODO Arc 旋转
+                var psi = data[i++];
+                var anticlockwise = 1 - data[i++];
+                var x1 = Math.cos(theta) * rx + cx;
+                var y1 = Math.sin(theta) * ry + cy;
+                // 不是直接使用 arc 命令
+                if (i > 1) {
+                    w += windingLine(xi, yi, x1, y1, x, y);
+                }
+                else {
+                    // 第一个命令起点还未定义
+                    x0 = x1;
+                    y0 = y1;
+                }
+                // zr 使用scale来模拟椭圆, 这里也对x做一定的缩放
+                var _x = (x - cx) * ry / rx + cx;
+                if (isStroke) {
+                    if (containStroke$4(
+                        cx, cy, ry, theta, theta + dTheta, anticlockwise,
+                        lineWidth, _x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    w += windingArc(
+                        cx, cy, ry, theta, theta + dTheta, anticlockwise,
+                        _x, y
+                    );
+                }
+                xi = Math.cos(theta + dTheta) * rx + cx;
+                yi = Math.sin(theta + dTheta) * ry + cy;
+                break;
+            case CMD$1.R:
+                x0 = xi = data[i++];
+                y0 = yi = data[i++];
+                var width = data[i++];
+                var height = data[i++];
+                var x1 = x0 + width;
+                var y1 = y0 + height;
+                if (isStroke) {
+                    if (containStroke$1(x0, y0, x1, y0, lineWidth, x, y)
+                        || containStroke$1(x1, y0, x1, y1, lineWidth, x, y)
+                        || containStroke$1(x1, y1, x0, y1, lineWidth, x, y)
+                        || containStroke$1(x0, y1, x0, y0, lineWidth, x, y)
+                    ) {
+                        return true;
+                    }
+                }
+                else {
+                    // FIXME Clockwise ?
+                    w += windingLine(x1, y0, x1, y1, x, y);
+                    w += windingLine(x0, y1, x0, y0, x, y);
+                }
+                break;
+            case CMD$1.Z:
+                if (isStroke) {
+                    if (containStroke$1(
+                        xi, yi, x0, y0, lineWidth, x, y
+                    )) {
+                        return true;
+                    }
+                }
+                else {
+                    // Close a subpath
+                    w += windingLine(xi, yi, x0, y0, x, y);
+                    // 如果被任何一个 subpath 包含
+                    // FIXME subpaths may overlap
+                    // if (w !== 0) {
+                    //     return true;
+                    // }
+                }
+                xi = x0;
+                yi = y0;
+                break;
+        }
+    }
+    if (!isStroke && !isAroundEqual(yi, y0)) {
+        w += windingLine(xi, yi, x0, y0, x, y) || 0;
+    }
+    return w !== 0;
+}
+
+function contain(pathData, x, y) {
+    return containPath(pathData, 0, false, x, y);
+}
+
+function containStroke(pathData, lineWidth, x, y) {
+    return containPath(pathData, lineWidth, true, x, y);
+}
+
+var getCanvasPattern = Pattern.prototype.getCanvasPattern;
+
+var abs = Math.abs;
+
+var pathProxyForDraw = new PathProxy(true);
+/**
+ * @alias module:zrender/graphic/Path
+ * @extends module:zrender/graphic/Displayable
+ * @constructor
+ * @param {Object} opts
+ */
+function Path(opts) {
+    Displayable.call(this, opts);
+
+    /**
+     * @type {module:zrender/core/PathProxy}
+     * @readOnly
+     */
+    this.path = null;
+}
+
+Path.prototype = {
+
+    constructor: Path,
+
+    type: 'path',
+
+    __dirtyPath: true,
+
+    strokeContainThreshold: 5,
+
+    brush: function (ctx, prevEl) {
+        var style = this.style;
+        var path = this.path || pathProxyForDraw;
+        var hasStroke = style.hasStroke();
+        var hasFill = style.hasFill();
+        var fill = style.fill;
+        var stroke = style.stroke;
+        var hasFillGradient = hasFill && !!(fill.colorStops);
+        var hasStrokeGradient = hasStroke && !!(stroke.colorStops);
+        var hasFillPattern = hasFill && !!(fill.image);
+        var hasStrokePattern = hasStroke && !!(stroke.image);
+
+        style.bind(ctx, this, prevEl);
+        this.setTransform(ctx);
+
+        if (this.__dirty) {
+            var rect;
+            // Update gradient because bounding rect may changed
+            if (hasFillGradient) {
+                rect = rect || this.getBoundingRect();
+                this._fillGradient = style.getGradient(ctx, fill, rect);
+            }
+            if (hasStrokeGradient) {
+                rect = rect || this.getBoundingRect();
+                this._strokeGradient = style.getGradient(ctx, stroke, rect);
+            }
+        }
+        // Use the gradient or pattern
+        if (hasFillGradient) {
+            // PENDING If may have affect the state
+            ctx.fillStyle = this._fillGradient;
+        }
+        else if (hasFillPattern) {
+            ctx.fillStyle = getCanvasPattern.call(fill, ctx);
+        }
+        if (hasStrokeGradient) {
+            ctx.strokeStyle = this._strokeGradient;
+        }
+        else if (hasStrokePattern) {
+            ctx.strokeStyle = getCanvasPattern.call(stroke, ctx);
+        }
+
+        var lineDash = style.lineDash;
+        var lineDashOffset = style.lineDashOffset;
+
+        var ctxLineDash = !!ctx.setLineDash;
+
+        // Update path sx, sy
+        var scale = this.getGlobalScale();
+        path.setScale(scale[0], scale[1]);
+
+        // Proxy context
+        // Rebuild path in following 2 cases
+        // 1. Path is dirty
+        // 2. Path needs javascript implemented lineDash stroking.
+        //    In this case, lineDash information will not be saved in PathProxy
+        if (this.__dirtyPath
+            || (lineDash && !ctxLineDash && hasStroke)
+        ) {
+            path.beginPath(ctx);
+
+            // Setting line dash before build path
+            if (lineDash && !ctxLineDash) {
+                path.setLineDash(lineDash);
+                path.setLineDashOffset(lineDashOffset);
+            }
+
+            this.buildPath(path, this.shape, false);
+
+            // Clear path dirty flag
+            if (this.path) {
+                this.__dirtyPath = false;
+            }
+        }
+        else {
+            // Replay path building
+            ctx.beginPath();
+            this.path.rebuildPath(ctx);
+        }
+
+        hasFill && path.fill(ctx);
+
+        if (lineDash && ctxLineDash) {
+            ctx.setLineDash(lineDash);
+            ctx.lineDashOffset = lineDashOffset;
+        }
+
+        hasStroke && path.stroke(ctx);
+
+        if (lineDash && ctxLineDash) {
+            // PENDING
+            // Remove lineDash
+            ctx.setLineDash([]);
+        }
+
+        // Draw rect text
+        if (style.text != null) {
+            // Only restore transform when needs draw text.
+            this.restoreTransform(ctx);    
+            this.drawRectText(ctx, this.getBoundingRect());
+        }
+    },
+
+    // When bundling path, some shape may decide if use moveTo to begin a new subpath or closePath
+    // Like in circle
+    buildPath: function (ctx, shapeCfg, inBundle) {},
+
+    createPathProxy: function () {
+        this.path = new PathProxy();
+    },
+
+    getBoundingRect: function () {
+        var rect = this._rect;
+        var style = this.style;
+        var needsUpdateRect = !rect;
+        if (needsUpdateRect) {
+            var path = this.path;
+            if (!path) {
+                // Create path on demand.
+                path = this.path = new PathProxy();
+            }
+            if (this.__dirtyPath) {
+                path.beginPath();
+                this.buildPath(path, this.shape, false);
+            }
+            rect = path.getBoundingRect();
+        }
+        this._rect = rect;
+
+        if (style.hasStroke()) {
+            // Needs update rect with stroke lineWidth when
+            // 1. Element changes scale or lineWidth
+            // 2. Shape is changed
+            var rectWithStroke = this._rectWithStroke || (this._rectWithStroke = rect.clone());
+            if (this.__dirty || needsUpdateRect) {
+                rectWithStroke.copy(rect);
+                // FIXME Must after updateTransform
+                var w = style.lineWidth;
+                // PENDING, Min line width is needed when line is horizontal or vertical
+                var lineScale = style.strokeNoScale ? this.getLineScale() : 1;
+
+                // Only add extra hover lineWidth when there are no fill
+                if (!style.hasFill()) {
+                    w = Math.max(w, this.strokeContainThreshold || 4);
+                }
+                // Consider line width
+                // Line scale can't be 0;
+                if (lineScale > 1e-10) {
+                    rectWithStroke.width += w / lineScale;
+                    rectWithStroke.height += w / lineScale;
+                    rectWithStroke.x -= w / lineScale / 2;
+                    rectWithStroke.y -= w / lineScale / 2;
+                }
+            }
+
+            // Return rect with stroke
+            return rectWithStroke;
+        }
+
+        return rect;
+    },
+
+    contain: function (x, y) {
+        var localPos = this.transformCoordToLocal(x, y);
+        var rect = this.getBoundingRect();
+        var style = this.style;
+        x = localPos[0];
+        y = localPos[1];
+
+        if (rect.contain(x, y)) {
+            var pathData = this.path.data;
+            if (style.hasStroke()) {
+                var lineWidth = style.lineWidth;
+                var lineScale = style.strokeNoScale ? this.getLineScale() : 1;
+                // Line scale can't be 0;
+                if (lineScale > 1e-10) {
+                    // Only add extra hover lineWidth when there are no fill
+                    if (!style.hasFill()) {
+                        lineWidth = Math.max(lineWidth, this.strokeContainThreshold);
+                    }
+                    if (containStroke(
+                        pathData, lineWidth / lineScale, x, y
+                    )) {
+                        return true;
+                    }
+                }
+            }
+            if (style.hasFill()) {
+                return contain(pathData, x, y);
+            }
+        }
+        return false;
+    },
+
+    /**
+     * @param  {boolean} dirtyPath
+     */
+    dirty: function (dirtyPath) {
+        if (dirtyPath == null) {
+            dirtyPath = true;
+        }
+        // Only mark dirty, not mark clean
+        if (dirtyPath) {
+            this.__dirtyPath = dirtyPath;
+            this._rect = null;
+        }
+
+        this.__dirty = true;
+
+        this.__zr && this.__zr.refresh();
+
+        // Used as a clipping path
+        if (this.__clipTarget) {
+            this.__clipTarget.dirty();
+        }
+    },
+
+    /**
+     * Alias for animate('shape')
+     * @param {boolean} loop
+     */
+    animateShape: function (loop) {
+        return this.animate('shape', loop);
+    },
+
+    // Overwrite attrKV
+    attrKV: function (key, value) {
+        // FIXME
+        if (key === 'shape') {
+            this.setShape(value);
+            this.__dirtyPath = true;
+            this._rect = null;
+        }
+        else {
+            Displayable.prototype.attrKV.call(this, key, value);
+        }
+    },
+
+    /**
+     * @param {Object|string} key
+     * @param {*} value
+     */
+    setShape: function (key, value) {
+        var shape = this.shape;
+        // Path from string may not have shape
+        if (shape) {
+            if (isObject$1(key)) {
+                for (var name in key) {
+                    if (key.hasOwnProperty(name)) {
+                        shape[name] = key[name];
+                    }
+                }
+            }
+            else {
+                shape[key] = value;
+            }
+            this.dirty(true);
+        }
+        return this;
+    },
+
+    getLineScale: function () {
+        var m = this.transform;
+        // Get the line scale.
+        // Determinant of `m` means how much the area is enlarged by the
+        // transformation. So its square root can be used as a scale factor
+        // for width.
+        return m && abs(m[0] - 1) > 1e-10 && abs(m[3] - 1) > 1e-10
+            ? Math.sqrt(abs(m[0] * m[3] - m[2] * m[1]))
+            : 1;
+    }
+};
+
+/**
+ * 扩展一个 Path element, 比如星形，圆等。
+ * Extend a path element
+ * @param {Object} props
+ * @param {string} props.type Path type
+ * @param {Function} props.init Initialize
+ * @param {Function} props.buildPath Overwrite buildPath method
+ * @param {Object} [props.style] Extended default style config
+ * @param {Object} [props.shape] Extended default shape config
+ */
+Path.extend = function (defaults$$1) {
+    var Sub = function (opts) {
+        Path.call(this, opts);
+
+        if (defaults$$1.style) {
+            // Extend default style
+            this.style.extendFrom(defaults$$1.style, false);
+        }
+
+        // Extend default shape
+        var defaultShape = defaults$$1.shape;
+        if (defaultShape) {
+            this.shape = this.shape || {};
+            var thisShape = this.shape;
+            for (var name in defaultShape) {
+                if (
+                    ! thisShape.hasOwnProperty(name)
+                    && defaultShape.hasOwnProperty(name)
+                ) {
+                    thisShape[name] = defaultShape[name];
+                }
+            }
+        }
+
+        defaults$$1.init && defaults$$1.init.call(this, opts);
+    };
+
+    inherits(Sub, Path);
+
+    // FIXME 不能 extend position, rotation 等引用对象
+    for (var name in defaults$$1) {
+        // Extending prototype values and methods
+        if (name !== 'style' && name !== 'shape') {
+            Sub.prototype[name] = defaults$$1[name];
+        }
+    }
+
+    return Sub;
+};
+
+inherits(Path, Displayable);
+
+var CMD$2 = PathProxy.CMD;
+
+var points = [[], [], []];
+var mathSqrt$3 = Math.sqrt;
+var mathAtan2 = Math.atan2;
+
+var transformPath = function (path, m) {
+    var data = path.data;
+    var cmd;
+    var nPoint;
+    var i;
+    var j;
+    var k;
+    var p;
+
+    var M = CMD$2.M;
+    var C = CMD$2.C;
+    var L = CMD$2.L;
+    var R = CMD$2.R;
+    var A = CMD$2.A;
+    var Q = CMD$2.Q;
+
+    for (i = 0, j = 0; i < data.length;) {
+        cmd = data[i++];
+        j = i;
+        nPoint = 0;
+
+        switch (cmd) {
+            case M:
+                nPoint = 1;
+                break;
+            case L:
+                nPoint = 1;
+                break;
+            case C:
+                nPoint = 3;
+                break;
+            case Q:
+                nPoint = 2;
+                break;
+            case A:
+                var x = m[4];
+                var y = m[5];
+                var sx = mathSqrt$3(m[0] * m[0] + m[1] * m[1]);
+                var sy = mathSqrt$3(m[2] * m[2] + m[3] * m[3]);
+                var angle = mathAtan2(-m[1] / sy, m[0] / sx);
+                // cx
+                data[i] *= sx;
+                data[i++] += x;
+                // cy
+                data[i] *= sy;
+                data[i++] += y;
+                // Scale rx and ry
+                // FIXME Assume psi is 0 here
+                data[i++] *= sx;
+                data[i++] *= sy;
+
+                // Start angle
+                data[i++] += angle;
+                // end angle
+                data[i++] += angle;
+                // FIXME psi
+                i += 2;
+                j = i;
+                break;
+            case R:
+                // x0, y0
+                p[0] = data[i++];
+                p[1] = data[i++];
+                applyTransform(p, p, m);
+                data[j++] = p[0];
+                data[j++] = p[1];
+                // x1, y1
+                p[0] += data[i++];
+                p[1] += data[i++];
+                applyTransform(p, p, m);
+                data[j++] = p[0];
+                data[j++] = p[1];
+        }
+
+        for (k = 0; k < nPoint; k++) {
+            var p = points[k];
+            p[0] = data[i++];
+            p[1] = data[i++];
+
+            applyTransform(p, p, m);
+            // Write back
+            data[j++] = p[0];
+            data[j++] = p[1];
+        }
+    }
+};
+
+// command chars
+var cc = [
+    'm', 'M', 'l', 'L', 'v', 'V', 'h', 'H', 'z', 'Z',
+    'c', 'C', 'q', 'Q', 't', 'T', 's', 'S', 'a', 'A'
+];
+
+var mathSqrt = Math.sqrt;
+var mathSin = Math.sin;
+var mathCos = Math.cos;
+var PI = Math.PI;
+
+var vMag = function(v) {
+    return Math.sqrt(v[0] * v[0] + v[1] * v[1]);
+};
+var vRatio = function(u, v) {
+    return (u[0] * v[0] + u[1] * v[1]) / (vMag(u) * vMag(v));
+};
+var vAngle = function(u, v) {
+    return (u[0] * v[1] < u[1] * v[0] ? -1 : 1)
+            * Math.acos(vRatio(u, v));
+};
+
+function processArc(x1, y1, x2, y2, fa, fs, rx, ry, psiDeg, cmd, path) {
+    var psi = psiDeg * (PI / 180.0);
+    var xp = mathCos(psi) * (x1 - x2) / 2.0
+                + mathSin(psi) * (y1 - y2) / 2.0;
+    var yp = -1 * mathSin(psi) * (x1 - x2) / 2.0
+                + mathCos(psi) * (y1 - y2) / 2.0;
+
+    var lambda = (xp * xp) / (rx * rx) + (yp * yp) / (ry * ry);
+
+    if (lambda > 1) {
+        rx *= mathSqrt(lambda);
+        ry *= mathSqrt(lambda);
+    }
+
+    var f = (fa === fs ? -1 : 1)
+        * mathSqrt((((rx * rx) * (ry * ry))
+                - ((rx * rx) * (yp * yp))
+                - ((ry * ry) * (xp * xp))) / ((rx * rx) * (yp * yp)
+                + (ry * ry) * (xp * xp))
+            ) || 0;
+
+    var cxp = f * rx * yp / ry;
+    var cyp = f * -ry * xp / rx;
+
+    var cx = (x1 + x2) / 2.0
+                + mathCos(psi) * cxp
+                - mathSin(psi) * cyp;
+    var cy = (y1 + y2) / 2.0
+            + mathSin(psi) * cxp
+            + mathCos(psi) * cyp;
+
+    var theta = vAngle([ 1, 0 ], [ (xp - cxp) / rx, (yp - cyp) / ry ]);
+    var u = [ (xp - cxp) / rx, (yp - cyp) / ry ];
+    var v = [ (-1 * xp - cxp) / rx, (-1 * yp - cyp) / ry ];
+    var dTheta = vAngle(u, v);
+
+    if (vRatio(u, v) <= -1) {
+        dTheta = PI;
+    }
+    if (vRatio(u, v) >= 1) {
+        dTheta = 0;
+    }
+    if (fs === 0 && dTheta > 0) {
+        dTheta = dTheta - 2 * PI;
+    }
+    if (fs === 1 && dTheta < 0) {
+        dTheta = dTheta + 2 * PI;
+    }
+
+    path.addData(cmd, cx, cy, rx, ry, theta, dTheta, psi, fs);
+}
+
+function createPathProxyFromString(data) {
+    if (!data) {
+        return [];
+    }
+
+    // command string
+    var cs = data.replace(/-/g, ' -')
+        .replace(/  /g, ' ')
+        .replace(/ /g, ',')
+        .replace(/,,/g, ',');
+
+    var n;
+    // create pipes so that we can split the data
+    for (n = 0; n < cc.length; n++) {
+        cs = cs.replace(new RegExp(cc[n], 'g'), '|' + cc[n]);
+    }
+
+    // create array
+    var arr = cs.split('|');
+    // init context point
+    var cpx = 0;
+    var cpy = 0;
+
+    var path = new PathProxy();
+    var CMD = PathProxy.CMD;
+
+    var prevCmd;
+    for (n = 1; n < arr.length; n++) {
+        var str = arr[n];
+        var c = str.charAt(0);
+        var off = 0;
+        var p = str.slice(1).replace(/e,-/g, 'e-').split(',');
+        var cmd;
+
+        if (p.length > 0 && p[0] === '') {
+            p.shift();
+        }
+
+        for (var i = 0; i < p.length; i++) {
+            p[i] = parseFloat(p[i]);
+        }
+        while (off < p.length && !isNaN(p[off])) {
+            if (isNaN(p[0])) {
+                break;
+            }
+            var ctlPtx;
+            var ctlPty;
+
+            var rx;
+            var ry;
+            var psi;
+            var fa;
+            var fs;
+
+            var x1 = cpx;
+            var y1 = cpy;
+
+            // convert l, H, h, V, and v to L
+            switch (c) {
+                case 'l':
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'L':
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'm':
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.M;
+                    path.addData(cmd, cpx, cpy);
+                    c = 'l';
+                    break;
+                case 'M':
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.M;
+                    path.addData(cmd, cpx, cpy);
+                    c = 'L';
+                    break;
+                case 'h':
+                    cpx += p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'H':
+                    cpx = p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'v':
+                    cpy += p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'V':
+                    cpy = p[off++];
+                    cmd = CMD.L;
+                    path.addData(cmd, cpx, cpy);
+                    break;
+                case 'C':
+                    cmd = CMD.C;
+                    path.addData(
+                        cmd, p[off++], p[off++], p[off++], p[off++], p[off++], p[off++]
+                    );
+                    cpx = p[off - 2];
+                    cpy = p[off - 1];
+                    break;
+                case 'c':
+                    cmd = CMD.C;
+                    path.addData(
+                        cmd,
+                        p[off++] + cpx, p[off++] + cpy,
+                        p[off++] + cpx, p[off++] + cpy,
+                        p[off++] + cpx, p[off++] + cpy
+                    );
+                    cpx += p[off - 2];
+                    cpy += p[off - 1];
+                    break;
+                case 'S':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.C) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cmd = CMD.C;
+                    x1 = p[off++];
+                    y1 = p[off++];
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    path.addData(cmd, ctlPtx, ctlPty, x1, y1, cpx, cpy);
+                    break;
+                case 's':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.C) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cmd = CMD.C;
+                    x1 = cpx + p[off++];
+                    y1 = cpy + p[off++];
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    path.addData(cmd, ctlPtx, ctlPty, x1, y1, cpx, cpy);
+                    break;
+                case 'Q':
+                    x1 = p[off++];
+                    y1 = p[off++];
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, x1, y1, cpx, cpy);
+                    break;
+                case 'q':
+                    x1 = p[off++] + cpx;
+                    y1 = p[off++] + cpy;
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, x1, y1, cpx, cpy);
+                    break;
+                case 'T':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.Q) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, ctlPtx, ctlPty, cpx, cpy);
+                    break;
+                case 't':
+                    ctlPtx = cpx;
+                    ctlPty = cpy;
+                    var len = path.len();
+                    var pathData = path.data;
+                    if (prevCmd === CMD.Q) {
+                        ctlPtx += cpx - pathData[len - 4];
+                        ctlPty += cpy - pathData[len - 3];
+                    }
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.Q;
+                    path.addData(cmd, ctlPtx, ctlPty, cpx, cpy);
+                    break;
+                case 'A':
+                    rx = p[off++];
+                    ry = p[off++];
+                    psi = p[off++];
+                    fa = p[off++];
+                    fs = p[off++];
+
+                    x1 = cpx, y1 = cpy;
+                    cpx = p[off++];
+                    cpy = p[off++];
+                    cmd = CMD.A;
+                    processArc(
+                        x1, y1, cpx, cpy, fa, fs, rx, ry, psi, cmd, path
+                    );
+                    break;
+                case 'a':
+                    rx = p[off++];
+                    ry = p[off++];
+                    psi = p[off++];
+                    fa = p[off++];
+                    fs = p[off++];
+
+                    x1 = cpx, y1 = cpy;
+                    cpx += p[off++];
+                    cpy += p[off++];
+                    cmd = CMD.A;
+                    processArc(
+                        x1, y1, cpx, cpy, fa, fs, rx, ry, psi, cmd, path
+                    );
+                    break;
+            }
+        }
+
+        if (c === 'z' || c === 'Z') {
+            cmd = CMD.Z;
+            path.addData(cmd);
+        }
+
+        prevCmd = cmd;
+    }
+
+    path.toStatic();
+
+    return path;
+}
+
+// TODO Optimize double memory cost problem
+function createPathOptions(str, opts) {
+    var pathProxy = createPathProxyFromString(str);
+    opts = opts || {};
+    opts.buildPath = function (path) {
+        if (path.setData) {
+            path.setData(pathProxy.data);
+            // Svg and vml renderer don't have context
+            var ctx = path.getContext();
+            if (ctx) {
+                path.rebuildPath(ctx);
+            }
+        }
+        else {
+            var ctx = path;
+            pathProxy.rebuildPath(ctx);
+        }
+    };
+
+    opts.applyTransform = function (m) {
+        transformPath(pathProxy, m);
+        this.dirty(true);
+    };
+
+    return opts;
+}
+
+/**
+ * Create a Path object from path string data
+ * http://www.w3.org/TR/SVG/paths.html#PathData
+ * @param  {Object} opts Other options
+ */
+function createFromString(str, opts) {
+    return new Path(createPathOptions(str, opts));
+}
+
+/**
+ * Create a Path class from path string data
+ * @param  {string} str
+ * @param  {Object} opts Other options
+ */
+function extendFromString(str, opts) {
+    return Path.extend(createPathOptions(str, opts));
+}
+
+/**
+ * Merge multiple paths
+ */
+// TODO Apply transform
+// TODO stroke dash
+// TODO Optimize double memory cost problem
+function mergePath$1(pathEls, opts) {
+    var pathList = [];
+    var len = pathEls.length;
+    for (var i = 0; i < len; i++) {
+        var pathEl = pathEls[i];
+        if (!pathEl.path) {
+            pathEl.createPathProxy();
+        }
+        if (pathEl.__dirtyPath) {
+            pathEl.buildPath(pathEl.path, pathEl.shape, true);
+        }
+        pathList.push(pathEl.path);
+    }
+
+    var pathBundle = new Path(opts);
+    // Need path proxy.
+    pathBundle.createPathProxy();
+    pathBundle.buildPath = function (path) {
+        path.appendPath(pathList);
+        // Svg and vml renderer don't have context
+        var ctx = path.getContext();
+        if (ctx) {
+            path.rebuildPath(ctx);
+        }
+    };
+
+    return pathBundle;
+}
+
+/**
+ * @alias zrender/graphic/Text
+ * @extends module:zrender/graphic/Displayable
+ * @constructor
+ * @param {Object} opts
+ */
+var Text = function (opts) { // jshint ignore:line
+    Displayable.call(this, opts);
+};
+
+Text.prototype = {
+
+    constructor: Text,
+
+    type: 'text',
+
+    brush: function (ctx, prevEl) {
+        var style = this.style;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        // Use props with prefix 'text'.
+        style.fill = style.stroke = style.shadowBlur = style.shadowColor =
+            style.shadowOffsetX = style.shadowOffsetY = null;
+
+        var text = style.text;
+        // Convert to string
+        text != null && (text += '');
+
+        // Always bind style
+        style.bind(ctx, this, prevEl);
+
+        if (!needDrawText(text, style)) {
+            return;
+        }
+
+        this.setTransform(ctx);
+
+        renderText(this, ctx, text, style);
+
+        this.restoreTransform(ctx);
+    },
+
+    getBoundingRect: function () {
+        var style = this.style;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        if (!this._rect) {
+            var text = style.text;
+            text != null ? (text += '') : (text = '');
+
+            var rect = getBoundingRect(
+                style.text + '',
+                style.font,
+                style.textAlign,
+                style.textVerticalAlign,
+                style.textPadding,
+                style.rich
+            );
+
+            rect.x += style.x || 0;
+            rect.y += style.y || 0;
+
+            if (getStroke(style.textStroke, style.textStrokeWidth)) {
+                var w = style.textStrokeWidth;
+                rect.x -= w / 2;
+                rect.y -= w / 2;
+                rect.width += w;
+                rect.height += w;
+            }
+
+            this._rect = rect;
+        }
+
+        return this._rect;
+    }
+};
+
+inherits(Text, Displayable);
+
+/**
+ * 圆形
+ * @module zrender/shape/Circle
+ */
+
+var Circle = Path.extend({
+
+    type: 'circle',
+
+    shape: {
+        cx: 0,
+        cy: 0,
+        r: 0
+    },
+
+
+    buildPath : function (ctx, shape, inBundle) {
+        // Better stroking in ShapeBundle
+        // Always do it may have performence issue ( fill may be 2x more cost)
+        if (inBundle) {
+            ctx.moveTo(shape.cx + shape.r, shape.cy);
+        }
+        // else {
+        //     if (ctx.allocate && !ctx.data.length) {
+        //         ctx.allocate(ctx.CMD_MEM_SIZE.A);
+        //     }
+        // }
+        // Better stroking in ShapeBundle
+        // ctx.moveTo(shape.cx + shape.r, shape.cy);
+        ctx.arc(shape.cx, shape.cy, shape.r, 0, Math.PI * 2, true);
+    }
+});
+
+// Fix weird bug in some version of IE11 (like 11.0.9600.178**),
+// where exception "unexpected call to method or property access"
+// might be thrown when calling ctx.fill or ctx.stroke after a path
+// whose area size is zero is drawn and ctx.clip() is called and
+// shadowBlur is set. See #4572, #3112, #5777.
+// (e.g.,
+//  ctx.moveTo(10, 10);
+//  ctx.lineTo(20, 10);
+//  ctx.closePath();
+//  ctx.clip();
+//  ctx.shadowBlur = 10;
+//  ...
+//  ctx.fill();
+// )
+
+var shadowTemp = [
+    ['shadowBlur', 0],
+    ['shadowColor', '#000'],
+    ['shadowOffsetX', 0],
+    ['shadowOffsetY', 0]
+];
+
+var fixClipWithShadow = function (orignalBrush) {
+
+    // version string can be: '11.0'
+    return (env$1.browser.ie && env$1.browser.version >= 11)
+
+        ? function () {
+            var clipPaths = this.__clipPaths;
+            var style = this.style;
+            var modified;
+
+            if (clipPaths) {
+                for (var i = 0; i < clipPaths.length; i++) {
+                    var clipPath = clipPaths[i];
+                    var shape = clipPath && clipPath.shape;
+                    var type = clipPath && clipPath.type;
+
+                    if (shape && (
+                        (type === 'sector' && shape.startAngle === shape.endAngle)
+                        || (type === 'rect' && (!shape.width || !shape.height))
+                    )) {
+                        for (var j = 0; j < shadowTemp.length; j++) {
+                            // It is save to put shadowTemp static, because shadowTemp
+                            // will be all modified each item brush called.
+                            shadowTemp[j][2] = style[shadowTemp[j][0]];
+                            style[shadowTemp[j][0]] = shadowTemp[j][1];
+                        }
+                        modified = true;
+                        break;
+                    }
+                }
+            }
+
+            orignalBrush.apply(this, arguments);
+
+            if (modified) {
+                for (var j = 0; j < shadowTemp.length; j++) {
+                    style[shadowTemp[j][0]] = shadowTemp[j][2];
+                }
+            }
+        }
+
+        : orignalBrush;
+};
+
+/**
+ * 扇形
+ * @module zrender/graphic/shape/Sector
+ */
+
+var Sector = Path.extend({
+
+    type: 'sector',
+
+    shape: {
+
+        cx: 0,
+
+        cy: 0,
+
+        r0: 0,
+
+        r: 0,
+
+        startAngle: 0,
+
+        endAngle: Math.PI * 2,
+
+        clockwise: true
+    },
+
+    brush: fixClipWithShadow(Path.prototype.brush),
+
+    buildPath: function (ctx, shape) {
+
+        var x = shape.cx;
+        var y = shape.cy;
+        var r0 = Math.max(shape.r0 || 0, 0);
+        var r = Math.max(shape.r, 0);
+        var startAngle = shape.startAngle;
+        var endAngle = shape.endAngle;
+        var clockwise = shape.clockwise;
+
+        var unitX = Math.cos(startAngle);
+        var unitY = Math.sin(startAngle);
+
+        ctx.moveTo(unitX * r0 + x, unitY * r0 + y);
+
+        ctx.lineTo(unitX * r + x, unitY * r + y);
+
+        ctx.arc(x, y, r, startAngle, endAngle, !clockwise);
+
+        ctx.lineTo(
+            Math.cos(endAngle) * r0 + x,
+            Math.sin(endAngle) * r0 + y
+        );
+
+        if (r0 !== 0) {
+            ctx.arc(x, y, r0, endAngle, startAngle, clockwise);
+        }
+
+        ctx.closePath();
+    }
+});
+
+/**
+ * 圆环
+ * @module zrender/graphic/shape/Ring
+ */
+
+var Ring = Path.extend({
+
+    type: 'ring',
+
+    shape: {
+        cx: 0,
+        cy: 0,
+        r: 0,
+        r0: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var x = shape.cx;
+        var y = shape.cy;
+        var PI2 = Math.PI * 2;
+        ctx.moveTo(x + shape.r, y);
+        ctx.arc(x, y, shape.r, 0, PI2, false);
+        ctx.moveTo(x + shape.r0, y);
+        ctx.arc(x, y, shape.r0, 0, PI2, true);
+    }
+});
+
+/**
+ * Catmull-Rom spline 插值折线
+ * @module zrender/shape/util/smoothSpline
+ * @author pissang (https://www.github.com/pissang)
+ *         Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ *         errorrik (errorrik@gmail.com)
+ */
+
+/**
+ * @inner
+ */
+function interpolate(p0, p1, p2, p3, t, t2, t3) {
+    var v0 = (p2 - p0) * 0.5;
+    var v1 = (p3 - p1) * 0.5;
+    return (2 * (p1 - p2) + v0 + v1) * t3
+            + (-3 * (p1 - p2) - 2 * v0 - v1) * t2
+            + v0 * t + p1;
+}
+
+/**
+ * @alias module:zrender/shape/util/smoothSpline
+ * @param {Array} points 线段顶点数组
+ * @param {boolean} isLoop
+ * @return {Array}
+ */
+var smoothSpline = function (points, isLoop) {
+    var len$$1 = points.length;
+    var ret = [];
+
+    var distance$$1 = 0;
+    for (var i = 1; i < len$$1; i++) {
+        distance$$1 += distance(points[i - 1], points[i]);
+    }
+
+    var segs = distance$$1 / 2;
+    segs = segs < len$$1 ? len$$1 : segs;
+    for (var i = 0; i < segs; i++) {
+        var pos = i / (segs - 1) * (isLoop ? len$$1 : len$$1 - 1);
+        var idx = Math.floor(pos);
+
+        var w = pos - idx;
+
+        var p0;
+        var p1 = points[idx % len$$1];
+        var p2;
+        var p3;
+        if (!isLoop) {
+            p0 = points[idx === 0 ? idx : idx - 1];
+            p2 = points[idx > len$$1 - 2 ? len$$1 - 1 : idx + 1];
+            p3 = points[idx > len$$1 - 3 ? len$$1 - 1 : idx + 2];
+        }
+        else {
+            p0 = points[(idx - 1 + len$$1) % len$$1];
+            p2 = points[(idx + 1) % len$$1];
+            p3 = points[(idx + 2) % len$$1];
+        }
+
+        var w2 = w * w;
+        var w3 = w * w2;
+
+        ret.push([
+            interpolate(p0[0], p1[0], p2[0], p3[0], w, w2, w3),
+            interpolate(p0[1], p1[1], p2[1], p3[1], w, w2, w3)
+        ]);
+    }
+    return ret;
+};
+
+/**
+ * 贝塞尔平滑曲线
+ * @module zrender/shape/util/smoothBezier
+ * @author pissang (https://www.github.com/pissang)
+ *         Kener (@Kener-林峰, kener.linfeng@gmail.com)
+ *         errorrik (errorrik@gmail.com)
+ */
+
+/**
+ * 贝塞尔平滑曲线
+ * @alias module:zrender/shape/util/smoothBezier
+ * @param {Array} points 线段顶点数组
+ * @param {number} smooth 平滑等级, 0-1
+ * @param {boolean} isLoop
+ * @param {Array} constraint 将计算出来的控制点约束在一个包围盒内
+ *                           比如 [[0, 0], [100, 100]], 这个包围盒会与
+ *                           整个折线的包围盒做一个并集用来约束控制点。
+ * @param {Array} 计算出来的控制点数组
+ */
+var smoothBezier = function (points, smooth, isLoop, constraint) {
+    var cps = [];
+
+    var v = [];
+    var v1 = [];
+    var v2 = [];
+    var prevPoint;
+    var nextPoint;
+
+    var min$$1, max$$1;
+    if (constraint) {
+        min$$1 = [Infinity, Infinity];
+        max$$1 = [-Infinity, -Infinity];
+        for (var i = 0, len$$1 = points.length; i < len$$1; i++) {
+            min(min$$1, min$$1, points[i]);
+            max(max$$1, max$$1, points[i]);
+        }
+        // 与指定的包围盒做并集
+        min(min$$1, min$$1, constraint[0]);
+        max(max$$1, max$$1, constraint[1]);
+    }
+
+    for (var i = 0, len$$1 = points.length; i < len$$1; i++) {
+        var point = points[i];
+
+        if (isLoop) {
+            prevPoint = points[i ? i - 1 : len$$1 - 1];
+            nextPoint = points[(i + 1) % len$$1];
+        }
+        else {
+            if (i === 0 || i === len$$1 - 1) {
+                cps.push(clone$1(points[i]));
+                continue;
+            }
+            else {
+                prevPoint = points[i - 1];
+                nextPoint = points[i + 1];
+            }
+        }
+
+        sub(v, nextPoint, prevPoint);
+
+        // use degree to scale the handle length
+        scale(v, v, smooth);
+
+        var d0 = distance(point, prevPoint);
+        var d1 = distance(point, nextPoint);
+        var sum = d0 + d1;
+        if (sum !== 0) {
+            d0 /= sum;
+            d1 /= sum;
+        }
+
+        scale(v1, v, -d0);
+        scale(v2, v, d1);
+        var cp0 = add([], point, v1);
+        var cp1 = add([], point, v2);
+        if (constraint) {
+            max(cp0, cp0, min$$1);
+            min(cp0, cp0, max$$1);
+            max(cp1, cp1, min$$1);
+            min(cp1, cp1, max$$1);
+        }
+        cps.push(cp0);
+        cps.push(cp1);
+    }
+
+    if (isLoop) {
+        cps.push(cps.shift());
+    }
+
+    return cps;
+};
+
+function buildPath$1(ctx, shape, closePath) {
+    var points = shape.points;
+    var smooth = shape.smooth;
+    if (points && points.length >= 2) {
+        if (smooth && smooth !== 'spline') {
+            var controlPoints = smoothBezier(
+                points, smooth, closePath, shape.smoothConstraint
+            );
+
+            ctx.moveTo(points[0][0], points[0][1]);
+            var len = points.length;
+            for (var i = 0; i < (closePath ? len : len - 1); i++) {
+                var cp1 = controlPoints[i * 2];
+                var cp2 = controlPoints[i * 2 + 1];
+                var p = points[(i + 1) % len];
+                ctx.bezierCurveTo(
+                    cp1[0], cp1[1], cp2[0], cp2[1], p[0], p[1]
+                );
+            }
+        }
+        else {
+            if (smooth === 'spline') {
+                points = smoothSpline(points, closePath);
+            }
+
+            ctx.moveTo(points[0][0], points[0][1]);
+            for (var i = 1, l = points.length; i < l; i++) {
+                ctx.lineTo(points[i][0], points[i][1]);
+            }
+        }
+
+        closePath && ctx.closePath();
+    }
+}
+
+/**
+ * 多边形
+ * @module zrender/shape/Polygon
+ */
+
+var Polygon = Path.extend({
+
+    type: 'polygon',
+
+    shape: {
+        points: null,
+
+        smooth: false,
+
+        smoothConstraint: null
+    },
+
+    buildPath: function (ctx, shape) {
+        buildPath$1(ctx, shape, true);
+    }
+});
+
+/**
+ * @module zrender/graphic/shape/Polyline
+ */
+
+var Polyline = Path.extend({
+
+    type: 'polyline',
+
+    shape: {
+        points: null,
+
+        smooth: false,
+
+        smoothConstraint: null
+    },
+
+    style: {
+        stroke: '#000',
+
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+        buildPath$1(ctx, shape, false);
+    }
+});
+
+/**
+ * 矩形
+ * @module zrender/graphic/shape/Rect
+ */
+
+var Rect = Path.extend({
+
+    type: 'rect',
+
+    shape: {
+        // 左上、右上、右下、左下角的半径依次为r1、r2、r3、r4
+        // r缩写为1         相当于 [1, 1, 1, 1]
+        // r缩写为[1]       相当于 [1, 1, 1, 1]
+        // r缩写为[1, 2]    相当于 [1, 2, 1, 2]
+        // r缩写为[1, 2, 3] 相当于 [1, 2, 3, 2]
+        r: 0,
+
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var x = shape.x;
+        var y = shape.y;
+        var width = shape.width;
+        var height = shape.height;
+        if (!shape.r) {
+            ctx.rect(x, y, width, height);
+        }
+        else {
+            buildPath(ctx, shape);
+        }
+        ctx.closePath();
+        return;
+    }
+});
+
+/**
+ * 直线
+ * @module zrender/graphic/shape/Line
+ */
+
+var Line = Path.extend({
+
+    type: 'line',
+
+    shape: {
+        // Start point
+        x1: 0,
+        y1: 0,
+        // End point
+        x2: 0,
+        y2: 0,
+
+        percent: 1
+    },
+
+    style: {
+        stroke: '#000',
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+        var x1 = shape.x1;
+        var y1 = shape.y1;
+        var x2 = shape.x2;
+        var y2 = shape.y2;
+        var percent = shape.percent;
+
+        if (percent === 0) {
+            return;
+        }
+
+        ctx.moveTo(x1, y1);
+
+        if (percent < 1) {
+            x2 = x1 * (1 - percent) + x2 * percent;
+            y2 = y1 * (1 - percent) + y2 * percent;
+        }
+        ctx.lineTo(x2, y2);
+    },
+
+    /**
+     * Get point at percent
+     * @param  {number} percent
+     * @return {Array.<number>}
+     */
+    pointAt: function (p) {
+        var shape = this.shape;
+        return [
+            shape.x1 * (1 - p) + shape.x2 * p,
+            shape.y1 * (1 - p) + shape.y2 * p
+        ];
+    }
+});
+
+/**
+ * 贝塞尔曲线
+ * @module zrender/shape/BezierCurve
+ */
+
+var out = [];
+
+function someVectorAt(shape, t, isTangent) {
+    var cpx2 = shape.cpx2;
+    var cpy2 = shape.cpy2;
+    if (cpx2 === null || cpy2 === null) {
+        return [
+            (isTangent ? cubicDerivativeAt : cubicAt)(shape.x1, shape.cpx1, shape.cpx2, shape.x2, t),
+            (isTangent ? cubicDerivativeAt : cubicAt)(shape.y1, shape.cpy1, shape.cpy2, shape.y2, t)
+        ];
+    }
+    else {
+        return [
+            (isTangent ? quadraticDerivativeAt : quadraticAt)(shape.x1, shape.cpx1, shape.x2, t),
+            (isTangent ? quadraticDerivativeAt : quadraticAt)(shape.y1, shape.cpy1, shape.y2, t)
+        ];
+    }
+}
+
+var BezierCurve = Path.extend({
+
+    type: 'bezier-curve',
+
+    shape: {
+        x1: 0,
+        y1: 0,
+        x2: 0,
+        y2: 0,
+        cpx1: 0,
+        cpy1: 0,
+        // cpx2: 0,
+        // cpy2: 0
+
+        // Curve show percent, for animating
+        percent: 1
+    },
+
+    style: {
+        stroke: '#000',
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+        var x1 = shape.x1;
+        var y1 = shape.y1;
+        var x2 = shape.x2;
+        var y2 = shape.y2;
+        var cpx1 = shape.cpx1;
+        var cpy1 = shape.cpy1;
+        var cpx2 = shape.cpx2;
+        var cpy2 = shape.cpy2;
+        var percent = shape.percent;
+        if (percent === 0) {
+            return;
+        }
+
+        ctx.moveTo(x1, y1);
+
+        if (cpx2 == null || cpy2 == null) {
+            if (percent < 1) {
+                quadraticSubdivide(
+                    x1, cpx1, x2, percent, out
+                );
+                cpx1 = out[1];
+                x2 = out[2];
+                quadraticSubdivide(
+                    y1, cpy1, y2, percent, out
+                );
+                cpy1 = out[1];
+                y2 = out[2];
+            }
+
+            ctx.quadraticCurveTo(
+                cpx1, cpy1,
+                x2, y2
+            );
+        }
+        else {
+            if (percent < 1) {
+                cubicSubdivide(
+                    x1, cpx1, cpx2, x2, percent, out
+                );
+                cpx1 = out[1];
+                cpx2 = out[2];
+                x2 = out[3];
+                cubicSubdivide(
+                    y1, cpy1, cpy2, y2, percent, out
+                );
+                cpy1 = out[1];
+                cpy2 = out[2];
+                y2 = out[3];
+            }
+            ctx.bezierCurveTo(
+                cpx1, cpy1,
+                cpx2, cpy2,
+                x2, y2
+            );
+        }
+    },
+
+    /**
+     * Get point at percent
+     * @param  {number} t
+     * @return {Array.<number>}
+     */
+    pointAt: function (t) {
+        return someVectorAt(this.shape, t, false);
+    },
+
+    /**
+     * Get tangent at percent
+     * @param  {number} t
+     * @return {Array.<number>}
+     */
+    tangentAt: function (t) {
+        var p = someVectorAt(this.shape, t, true);
+        return normalize(p, p);
+    }
+});
+
+/**
+ * 圆弧
+ * @module zrender/graphic/shape/Arc
+ */
+
+var Arc = Path.extend({
+
+    type: 'arc',
+
+    shape: {
+
+        cx: 0,
+
+        cy: 0,
+
+        r: 0,
+
+        startAngle: 0,
+
+        endAngle: Math.PI * 2,
+
+        clockwise: true
+    },
+
+    style: {
+
+        stroke: '#000',
+
+        fill: null
+    },
+
+    buildPath: function (ctx, shape) {
+
+        var x = shape.cx;
+        var y = shape.cy;
+        var r = Math.max(shape.r, 0);
+        var startAngle = shape.startAngle;
+        var endAngle = shape.endAngle;
+        var clockwise = shape.clockwise;
+
+        var unitX = Math.cos(startAngle);
+        var unitY = Math.sin(startAngle);
+
+        ctx.moveTo(unitX * r + x, unitY * r + y);
+        ctx.arc(x, y, r, startAngle, endAngle, !clockwise);
+    }
+});
+
+// CompoundPath to improve performance
+
+var CompoundPath = Path.extend({
+
+    type: 'compound',
+
+    shape: {
+
+        paths: null
+    },
+
+    _updatePathDirty: function () {
+        var dirtyPath = this.__dirtyPath;
+        var paths = this.shape.paths;
+        for (var i = 0; i < paths.length; i++) {
+            // Mark as dirty if any subpath is dirty
+            dirtyPath = dirtyPath || paths[i].__dirtyPath;
+        }
+        this.__dirtyPath = dirtyPath;
+        this.__dirty = this.__dirty || dirtyPath;
+    },
+
+    beforeBrush: function () {
+        this._updatePathDirty();
+        var paths = this.shape.paths || [];
+        var scale = this.getGlobalScale();
+        // Update path scale
+        for (var i = 0; i < paths.length; i++) {
+            if (!paths[i].path) {
+                paths[i].createPathProxy();
+            }
+            paths[i].path.setScale(scale[0], scale[1]);
+        }
+    },
+
+    buildPath: function (ctx, shape) {
+        var paths = shape.paths || [];
+        for (var i = 0; i < paths.length; i++) {
+            paths[i].buildPath(ctx, paths[i].shape, true);
+        }
+    },
+
+    afterBrush: function () {
+        var paths = this.shape.paths || [];
+        for (var i = 0; i < paths.length; i++) {
+            paths[i].__dirtyPath = false;
+        }
+    },
+
+    getBoundingRect: function () {
+        this._updatePathDirty();
+        return Path.prototype.getBoundingRect.call(this);
+    }
+});
+
+/**
+ * @param {Array.<Object>} colorStops
+ */
+var Gradient = function (colorStops) {
+
+    this.colorStops = colorStops || [];
+
+};
+
+Gradient.prototype = {
+
+    constructor: Gradient,
+
+    addColorStop: function (offset, color) {
+        this.colorStops.push({
+
+            offset: offset,
+
+            color: color
+        });
+    }
+
+};
+
+/**
+ * x, y, x2, y2 are all percent from 0 to 1
+ * @param {number} [x=0]
+ * @param {number} [y=0]
+ * @param {number} [x2=1]
+ * @param {number} [y2=0]
+ * @param {Array.<Object>} colorStops
+ * @param {boolean} [globalCoord=false]
+ */
+var LinearGradient = function (x, y, x2, y2, colorStops, globalCoord) {
+    // Should do nothing more in this constructor. Because gradient can be
+    // declard by `color: {type: 'linear', colorStops: ...}`, where
+    // this constructor will not be called.
+
+    this.x = x == null ? 0 : x;
+
+    this.y = y == null ? 0 : y;
+
+    this.x2 = x2 == null ? 1 : x2;
+
+    this.y2 = y2 == null ? 0 : y2;
+
+    // Can be cloned
+    this.type = 'linear';
+
+    // If use global coord
+    this.global = globalCoord || false;
+
+    Gradient.call(this, colorStops);
+};
+
+LinearGradient.prototype = {
+
+    constructor: LinearGradient
+};
+
+inherits(LinearGradient, Gradient);
+
+/**
+ * x, y, r are all percent from 0 to 1
+ * @param {number} [x=0.5]
+ * @param {number} [y=0.5]
+ * @param {number} [r=0.5]
+ * @param {Array.<Object>} [colorStops]
+ * @param {boolean} [globalCoord=false]
+ */
+var RadialGradient = function (x, y, r, colorStops, globalCoord) {
+    // Should do nothing more in this constructor. Because gradient can be
+    // declard by `color: {type: 'radial', colorStops: ...}`, where
+    // this constructor will not be called.
+
+    this.x = x == null ? 0.5 : x;
+
+    this.y = y == null ? 0.5 : y;
+
+    this.r = r == null ? 0.5 : r;
+
+    // Can be cloned
+    this.type = 'radial';
+
+    // If use global coord
+    this.global = globalCoord || false;
+
+    Gradient.call(this, colorStops);
+};
+
+RadialGradient.prototype = {
+
+    constructor: RadialGradient
+};
+
+inherits(RadialGradient, Gradient);
+
+/**
+ * Displayable for incremental rendering. It will be rendered in a separate layer
+ * IncrementalDisplay have too main methods. `clearDisplayables` and `addDisplayables`
+ * addDisplayables will render the added displayables incremetally.
+ *
+ * It use a not clearFlag to tell the painter don't clear the layer if it's the first element.
+ */
+// TODO Style override ?
+function IncrementalDisplayble(opts) {
+
+    Displayable.call(this, opts);
+
+    this._displayables = [];
+
+    this._temporaryDisplayables = [];
+
+    this._cursor = 0;
+
+    this.notClear = true;
+}
+
+IncrementalDisplayble.prototype.incremental = true;
+
+IncrementalDisplayble.prototype.clearDisplaybles = function () {
+    this._displayables = [];
+    this._temporaryDisplayables = [];
+    this._cursor = 0;
+    this.dirty();
+
+    this.notClear = false;
+};
+
+IncrementalDisplayble.prototype.addDisplayable = function (displayable, notPersistent) {
+    if (notPersistent) {
+        this._temporaryDisplayables.push(displayable);
+    }
+    else {
+        this._displayables.push(displayable);
+    }
+    this.dirty();
+};
+
+IncrementalDisplayble.prototype.addDisplayables = function (displayables, notPersistent) {
+    notPersistent = notPersistent || false;
+    for (var i = 0; i < displayables.length; i++) {
+        this.addDisplayable(displayables[i], notPersistent);
+    }
+};
+
+IncrementalDisplayble.prototype.eachPendingDisplayable = function  (cb) {
+    for (var i = this._cursor; i < this._displayables.length; i++) {
+        cb && cb(this._displayables[i]);
+    }
+    for (var i = 0; i < this._temporaryDisplayables.length; i++) {
+        cb && cb(this._temporaryDisplayables[i]);
+    }
+};
+
+IncrementalDisplayble.prototype.update = function () {
+    this.updateTransform();
+    for (var i = this._cursor; i < this._displayables.length; i++) {
+        var displayable = this._displayables[i];
+        // PENDING
+        displayable.parent = this;
+        displayable.update();
+        displayable.parent = null;
+    }
+    for (var i = 0; i < this._temporaryDisplayables.length; i++) {
+        var displayable = this._temporaryDisplayables[i];
+        // PENDING
+        displayable.parent = this;
+        displayable.update();
+        displayable.parent = null;
+    }
+};
+
+IncrementalDisplayble.prototype.brush = function (ctx, prevEl) {
+    // Render persistant displayables.
+    for (var i = this._cursor; i < this._displayables.length; i++) {
+        var displayable = this._displayables[i];
+        displayable.beforeBrush && displayable.beforeBrush(ctx);
+        displayable.brush(ctx, i === this._cursor ? null : this._displayables[i - 1]);
+        displayable.afterBrush && displayable.afterBrush(ctx);
+    }
+    this._cursor = i;
+    // Render temporary displayables.
+    for (var i = 0; i < this._temporaryDisplayables.length; i++) {
+        var displayable = this._temporaryDisplayables[i];
+        displayable.beforeBrush && displayable.beforeBrush(ctx);
+        displayable.brush(ctx, i === 0 ? null : this._temporaryDisplayables[i - 1]);
+        displayable.afterBrush && displayable.afterBrush(ctx);
+    }
+
+    this._temporaryDisplayables = [];
+
+    this.notClear = true;
+};
+
+var m = [];
+IncrementalDisplayble.prototype.getBoundingRect = function () {
+    if (!this._rect) {
+        var rect = new BoundingRect(Infinity, Infinity, -Infinity, -Infinity);
+        for (var i = 0; i < this._displayables.length; i++) {
+            var displayable = this._displayables[i];
+            var childRect = displayable.getBoundingRect().clone();
+            if (displayable.needLocalTransform()) {
+                childRect.applyTransform(displayable.getLocalTransform(m));
+            }
+            rect.union(childRect);
+        }
+        this._rect = rect;
+    }
+    return this._rect;
+};
+
+IncrementalDisplayble.prototype.contain = function (x, y) {
+    var localPos = this.transformCoordToLocal(x, y);
+    var rect = this.getBoundingRect();
+
+    if (rect.contain(localPos[0], localPos[1])) {
+        for (var i = 0; i < this._displayables.length; i++) {
+            var displayable = this._displayables[i];
+            if (displayable.contain(x, y)) {
+                return true;
+            }
+        }
+    }
+    return false;
+};
+
+inherits(IncrementalDisplayble, Displayable);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var round = Math.round;
+var mathMax$1 = Math.max;
+var mathMin$1 = Math.min;
+
+var EMPTY_OBJ = {};
+
+/**
+ * Extend shape with parameters
+ */
+function extendShape(opts) {
+    return Path.extend(opts);
+}
+
+/**
+ * Extend path
+ */
+function extendPath(pathData, opts) {
+    return extendFromString(pathData, opts);
+}
+
+/**
+ * Create a path element from path data string
+ * @param {string} pathData
+ * @param {Object} opts
+ * @param {module:zrender/core/BoundingRect} rect
+ * @param {string} [layout=cover] 'center' or 'cover'
+ */
+function makePath(pathData, opts, rect, layout) {
+    var path = createFromString(pathData, opts);
+    var boundingRect = path.getBoundingRect();
+    if (rect) {
+        if (layout === 'center') {
+            rect = centerGraphic(rect, boundingRect);
+        }
+
+        resizePath(path, rect);
+    }
+    return path;
+}
+
+/**
+ * Create a image element from image url
+ * @param {string} imageUrl image url
+ * @param {Object} opts options
+ * @param {module:zrender/core/BoundingRect} rect constrain rect
+ * @param {string} [layout=cover] 'center' or 'cover'
+ */
+function makeImage(imageUrl, rect, layout) {
+    var path = new ZImage({
+        style: {
+            image: imageUrl,
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        onload: function (img) {
+            if (layout === 'center') {
+                var boundingRect = {
+                    width: img.width,
+                    height: img.height
+                };
+                path.setStyle(centerGraphic(rect, boundingRect));
+            }
+        }
+    });
+    return path;
+}
+
+/**
+ * Get position of centered element in bounding box.
+ *
+ * @param  {Object} rect         element local bounding box
+ * @param  {Object} boundingRect constraint bounding box
+ * @return {Object} element position containing x, y, width, and height
+ */
+function centerGraphic(rect, boundingRect) {
+    // Set rect to center, keep width / height ratio.
+    var aspect = boundingRect.width / boundingRect.height;
+    var width = rect.height * aspect;
+    var height;
+    if (width <= rect.width) {
+        height = rect.height;
+    }
+    else {
+        width = rect.width;
+        height = width / aspect;
+    }
+    var cx = rect.x + rect.width / 2;
+    var cy = rect.y + rect.height / 2;
+
+    return {
+        x: cx - width / 2,
+        y: cy - height / 2,
+        width: width,
+        height: height
+    };
+}
+
+var mergePath = mergePath$1;
+
+/**
+ * Resize a path to fit the rect
+ * @param {module:zrender/graphic/Path} path
+ * @param {Object} rect
+ */
+function resizePath(path, rect) {
+    if (!path.applyTransform) {
+        return;
+    }
+
+    var pathRect = path.getBoundingRect();
+
+    var m = pathRect.calculateTransform(rect);
+
+    path.applyTransform(m);
+}
+
+/**
+ * Sub pixel optimize line for canvas
+ *
+ * @param {Object} param
+ * @param {Object} [param.shape]
+ * @param {number} [param.shape.x1]
+ * @param {number} [param.shape.y1]
+ * @param {number} [param.shape.x2]
+ * @param {number} [param.shape.y2]
+ * @param {Object} [param.style]
+ * @param {number} [param.style.lineWidth]
+ * @return {Object} Modified param
+ */
+function subPixelOptimizeLine(param) {
+    var shape = param.shape;
+    var lineWidth = param.style.lineWidth;
+
+    if (round(shape.x1 * 2) === round(shape.x2 * 2)) {
+        shape.x1 = shape.x2 = subPixelOptimize(shape.x1, lineWidth, true);
+    }
+    if (round(shape.y1 * 2) === round(shape.y2 * 2)) {
+        shape.y1 = shape.y2 = subPixelOptimize(shape.y1, lineWidth, true);
+    }
+    return param;
+}
+
+/**
+ * Sub pixel optimize rect for canvas
+ *
+ * @param {Object} param
+ * @param {Object} [param.shape]
+ * @param {number} [param.shape.x]
+ * @param {number} [param.shape.y]
+ * @param {number} [param.shape.width]
+ * @param {number} [param.shape.height]
+ * @param {Object} [param.style]
+ * @param {number} [param.style.lineWidth]
+ * @return {Object} Modified param
+ */
+function subPixelOptimizeRect(param) {
+    var shape = param.shape;
+    var lineWidth = param.style.lineWidth;
+    var originX = shape.x;
+    var originY = shape.y;
+    var originWidth = shape.width;
+    var originHeight = shape.height;
+    shape.x = subPixelOptimize(shape.x, lineWidth, true);
+    shape.y = subPixelOptimize(shape.y, lineWidth, true);
+    shape.width = Math.max(
+        subPixelOptimize(originX + originWidth, lineWidth, false) - shape.x,
+        originWidth === 0 ? 0 : 1
+    );
+    shape.height = Math.max(
+        subPixelOptimize(originY + originHeight, lineWidth, false) - shape.y,
+        originHeight === 0 ? 0 : 1
+    );
+    return param;
+}
+
+/**
+ * Sub pixel optimize for canvas
+ *
+ * @param {number} position Coordinate, such as x, y
+ * @param {number} lineWidth Should be nonnegative integer.
+ * @param {boolean=} positiveOrNegative Default false (negative).
+ * @return {number} Optimized position.
+ */
+function subPixelOptimize(position, lineWidth, positiveOrNegative) {
+    // Assure that (position + lineWidth / 2) is near integer edge,
+    // otherwise line will be fuzzy in canvas.
+    var doubledPosition = round(position * 2);
+    return (doubledPosition + round(lineWidth)) % 2 === 0
+        ? doubledPosition / 2
+        : (doubledPosition + (positiveOrNegative ? 1 : -1)) / 2;
+}
+
+function hasFillOrStroke(fillOrStroke) {
+    return fillOrStroke != null && fillOrStroke != 'none';
+}
+
+function liftColor(color) {
+    return typeof color === 'string' ? lift(color, -0.1) : color;
+}
+
+/**
+ * @private
+ */
+function cacheElementStl(el) {
+    if (el.__hoverStlDirty) {
+        var stroke = el.style.stroke;
+        var fill = el.style.fill;
+
+        // Create hoverStyle on mouseover
+        var hoverStyle = el.__hoverStl;
+        hoverStyle.fill = hoverStyle.fill
+            || (hasFillOrStroke(fill) ? liftColor(fill) : null);
+        hoverStyle.stroke = hoverStyle.stroke
+            || (hasFillOrStroke(stroke) ? liftColor(stroke) : null);
+
+        var normalStyle = {};
+        for (var name in hoverStyle) {
+            // See comment in `doSingleEnterHover`.
+            if (hoverStyle[name] != null) {
+                normalStyle[name] = el.style[name];
+            }
+        }
+
+        el.__normalStl = normalStyle;
+
+        el.__hoverStlDirty = false;
+    }
+}
+
+/**
+ * @private
+ */
+function doSingleEnterHover(el) {
+    if (el.__isHover) {
+        return;
+    }
+
+    cacheElementStl(el);
+
+    if (el.useHoverLayer) {
+        el.__zr && el.__zr.addHover(el, el.__hoverStl);
+    }
+    else {
+        var style = el.style;
+        var insideRollbackOpt = style.insideRollbackOpt;
+
+        // Consider case: only `position: 'top'` is set on emphasis, then text
+        // color should be returned to `autoColor`, rather than remain '#fff'.
+        // So we should rollback then apply again after style merging.
+        insideRollbackOpt && rollbackInsideStyle(style);
+
+        // styles can be:
+        // {
+        //    label: {
+        //        show: false,
+        //        position: 'outside',
+        //        fontSize: 18
+        //    },
+        //    emphasis: {
+        //        label: {
+        //            show: true
+        //        }
+        //    }
+        // },
+        // where properties of `emphasis` may not appear in `normal`. We previously use
+        // module:echarts/util/model#defaultEmphasis to merge `normal` to `emphasis`.
+        // But consider rich text and setOption in merge mode, it is impossible to cover
+        // all properties in merge. So we use merge mode when setting style here, where
+        // only properties that is not `null/undefined` can be set. The disadventage:
+        // null/undefined can not be used to remove style any more in `emphasis`.
+        style.extendFrom(el.__hoverStl);
+
+        // Do not save `insideRollback`.
+        if (insideRollbackOpt) {
+            applyInsideStyle(style, style.insideOriginalTextPosition, insideRollbackOpt);
+
+            // textFill may be rollbacked to null.
+            if (style.textFill == null) {
+                style.textFill = insideRollbackOpt.autoColor;
+            }
+        }
+
+        el.dirty(false);
+        el.z2 += 1;
+    }
+
+    el.__isHover = true;
+}
+
+/**
+ * @inner
+ */
+function doSingleLeaveHover(el) {
+    if (!el.__isHover) {
+        return;
+    }
+
+    var normalStl = el.__normalStl;
+    if (el.useHoverLayer) {
+        el.__zr && el.__zr.removeHover(el);
+    }
+    else {
+        // Consider null/undefined value, should use
+        // `setStyle` but not `extendFrom(stl, true)`.
+        normalStl && el.setStyle(normalStl);
+        el.z2 -= 1;
+    }
+
+    el.__isHover = false;
+}
+
+/**
+ * @inner
+ */
+function doEnterHover(el) {
+    el.type === 'group'
+        ? el.traverse(function (child) {
+            if (child.type !== 'group') {
+                doSingleEnterHover(child);
+            }
+        })
+        : doSingleEnterHover(el);
+}
+
+function doLeaveHover(el) {
+    el.type === 'group'
+        ? el.traverse(function (child) {
+            if (child.type !== 'group') {
+                doSingleLeaveHover(child);
+            }
+        })
+        : doSingleLeaveHover(el);
+}
+
+/**
+ * @inner
+ */
+function setElementHoverStl(el, hoverStl) {
+    // If element has sepcified hoverStyle, then use it instead of given hoverStyle
+    // Often used when item group has a label element and it's hoverStyle is different
+    el.__hoverStl = el.hoverStyle || hoverStl || {};
+    el.__hoverStlDirty = true;
+
+    if (el.__isHover) {
+        cacheElementStl(el);
+    }
+}
+
+/**
+ * @inner
+ */
+function onElementMouseOver(e) {
+    if (this.__hoverSilentOnTouch && e.zrByTouch) {
+        return;
+    }
+
+    // Only if element is not in emphasis status
+    !this.__isEmphasis && doEnterHover(this);
+}
+
+/**
+ * @inner
+ */
+function onElementMouseOut(e) {
+    if (this.__hoverSilentOnTouch && e.zrByTouch) {
+        return;
+    }
+
+    // Only if element is not in emphasis status
+    !this.__isEmphasis && doLeaveHover(this);
+}
+
+/**
+ * @inner
+ */
+function enterEmphasis() {
+    this.__isEmphasis = true;
+    doEnterHover(this);
+}
+
+/**
+ * @inner
+ */
+function leaveEmphasis() {
+    this.__isEmphasis = false;
+    doLeaveHover(this);
+}
+
+/**
+ * Set hover style of element.
+ * This method can be called repeatly without side-effects.
+ * @param {module:zrender/Element} el
+ * @param {Object} [hoverStyle]
+ * @param {Object} [opt]
+ * @param {boolean} [opt.hoverSilentOnTouch=false]
+ *        In touch device, mouseover event will be trigger on touchstart event
+ *        (see module:zrender/dom/HandlerProxy). By this mechanism, we can
+ *        conviniently use hoverStyle when tap on touch screen without additional
+ *        code for compatibility.
+ *        But if the chart/component has select feature, which usually also use
+ *        hoverStyle, there might be conflict between 'select-highlight' and
+ *        'hover-highlight' especially when roam is enabled (see geo for example).
+ *        In this case, hoverSilentOnTouch should be used to disable hover-highlight
+ *        on touch device.
+ */
+function setHoverStyle(el, hoverStyle, opt) {
+    el.__hoverSilentOnTouch = opt && opt.hoverSilentOnTouch;
+
+    el.type === 'group'
+        ? el.traverse(function (child) {
+            if (child.type !== 'group') {
+                setElementHoverStl(child, hoverStyle);
+            }
+        })
+        : setElementHoverStl(el, hoverStyle);
+
+    // Duplicated function will be auto-ignored, see Eventful.js.
+    el.on('mouseover', onElementMouseOver)
+        .on('mouseout', onElementMouseOut);
+
+    // Emphasis, normal can be triggered manually
+    el.on('emphasis', enterEmphasis)
+        .on('normal', leaveEmphasis);
+}
+
+/**
+ * @param {Object|module:zrender/graphic/Style} normalStyle
+ * @param {Object} emphasisStyle
+ * @param {module:echarts/model/Model} normalModel
+ * @param {module:echarts/model/Model} emphasisModel
+ * @param {Object} opt Check `opt` of `setTextStyleCommon` to find other props.
+ * @param {string|Function} [opt.defaultText]
+ * @param {module:echarts/model/Model} [opt.labelFetcher] Fetch text by
+ *      `opt.labelFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ * @param {module:echarts/model/Model} [opt.labelDataIndex] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ * @param {module:echarts/model/Model} [opt.labelDimIndex] Fetch text by
+ *      `opt.textFetcher.getFormattedLabel(opt.labelDataIndex, 'normal'/'emphasis', null, opt.labelDimIndex)`
+ * @param {Object} [normalSpecified]
+ * @param {Object} [emphasisSpecified]
+ */
+function setLabelStyle(
+    normalStyle, emphasisStyle,
+    normalModel, emphasisModel,
+    opt,
+    normalSpecified, emphasisSpecified
+) {
+    opt = opt || EMPTY_OBJ;
+    var labelFetcher = opt.labelFetcher;
+    var labelDataIndex = opt.labelDataIndex;
+    var labelDimIndex = opt.labelDimIndex;
+
+    // This scenario, `label.normal.show = true; label.emphasis.show = false`,
+    // is not supported util someone requests.
+
+    var showNormal = normalModel.getShallow('show');
+    var showEmphasis = emphasisModel.getShallow('show');
+
+    // Consider performance, only fetch label when necessary.
+    // If `normal.show` is `false` and `emphasis.show` is `true` and `emphasis.formatter` is not set,
+    // label should be displayed, where text is fetched by `normal.formatter` or `opt.defaultText`.
+    var baseText;
+    if (showNormal || showEmphasis) {
+        if (labelFetcher) {
+            baseText = labelFetcher.getFormattedLabel(labelDataIndex, 'normal', null, labelDimIndex);
+        }
+        if (baseText == null) {
+            baseText = isFunction$1(opt.defaultText) ? opt.defaultText(labelDataIndex, opt) : opt.defaultText;
+        }
+    }
+    var normalStyleText = showNormal ? baseText : null;
+    var emphasisStyleText = showEmphasis
+        ? retrieve2(
+            labelFetcher
+                ? labelFetcher.getFormattedLabel(labelDataIndex, 'emphasis', null, labelDimIndex)
+                : null,
+            baseText
+        )
+        : null;
+
+    // Optimize: If style.text is null, text will not be drawn.
+    if (normalStyleText != null || emphasisStyleText != null) {
+        // Always set `textStyle` even if `normalStyle.text` is null, because default
+        // values have to be set on `normalStyle`.
+        // If we set default values on `emphasisStyle`, consider case:
+        // Firstly, `setOption(... label: {normal: {text: null}, emphasis: {show: true}} ...);`
+        // Secondly, `setOption(... label: {noraml: {show: true, text: 'abc', color: 'red'} ...);`
+        // Then the 'red' will not work on emphasis.
+        setTextStyle(normalStyle, normalModel, normalSpecified, opt);
+        setTextStyle(emphasisStyle, emphasisModel, emphasisSpecified, opt, true);
+    }
+
+    normalStyle.text = normalStyleText;
+    emphasisStyle.text = emphasisStyleText;
+}
+
+/**
+ * Set basic textStyle properties.
+ * @param {Object|module:zrender/graphic/Style} textStyle
+ * @param {module:echarts/model/Model} model
+ * @param {Object} [specifiedTextStyle] Can be overrided by settings in model.
+ * @param {Object} [opt] See `opt` of `setTextStyleCommon`.
+ * @param {boolean} [isEmphasis]
+ */
+function setTextStyle(
+    textStyle, textStyleModel, specifiedTextStyle, opt, isEmphasis
+) {
+    setTextStyleCommon(textStyle, textStyleModel, opt, isEmphasis);
+    specifiedTextStyle && extend(textStyle, specifiedTextStyle);
+    textStyle.host && textStyle.host.dirty && textStyle.host.dirty(false);
+
+    return textStyle;
+}
+
+/**
+ * Set text option in the style.
+ * @deprecated
+ * @param {Object} textStyle
+ * @param {module:echarts/model/Model} labelModel
+ * @param {string|boolean} defaultColor Default text color.
+ *        If set as false, it will be processed as a emphasis style.
+ */
+function setText(textStyle, labelModel, defaultColor) {
+    var opt = {isRectText: true};
+    var isEmphasis;
+
+    if (defaultColor === false) {
+        isEmphasis = true;
+    }
+    else {
+        // Support setting color as 'auto' to get visual color.
+        opt.autoColor = defaultColor;
+    }
+    setTextStyleCommon(textStyle, labelModel, opt, isEmphasis);
+    textStyle.host && textStyle.host.dirty && textStyle.host.dirty(false);
+}
+
+/**
+ * {
+ *      disableBox: boolean, Whether diable drawing box of block (outer most).
+ *      isRectText: boolean,
+ *      autoColor: string, specify a color when color is 'auto',
+ *              for textFill, textStroke, textBackgroundColor, and textBorderColor.
+ *              If autoColor specified, it is used as default textFill.
+ *      useInsideStyle:
+ *              `true`: Use inside style (textFill, textStroke, textStrokeWidth)
+ *                  if `textFill` is not specified.
+ *              `false`: Do not use inside style.
+ *              `null/undefined`: use inside style if `isRectText` is true and
+ *                  `textFill` is not specified and textPosition contains `'inside'`.
+ *      forceRich: boolean
+ * }
+ */
+function setTextStyleCommon(textStyle, textStyleModel, opt, isEmphasis) {
+    // Consider there will be abnormal when merge hover style to normal style if given default value.
+    opt = opt || EMPTY_OBJ;
+
+    if (opt.isRectText) {
+        var textPosition = textStyleModel.getShallow('position')
+            || (isEmphasis ? null : 'inside');
+        // 'outside' is not a valid zr textPostion value, but used
+        // in bar series, and magric type should be considered.
+        textPosition === 'outside' && (textPosition = 'top');
+        textStyle.textPosition = textPosition;
+        textStyle.textOffset = textStyleModel.getShallow('offset');
+        var labelRotate = textStyleModel.getShallow('rotate');
+        labelRotate != null && (labelRotate *= Math.PI / 180);
+        textStyle.textRotation = labelRotate;
+        textStyle.textDistance = retrieve2(
+            textStyleModel.getShallow('distance'), isEmphasis ? null : 5
+        );
+    }
+
+    var ecModel = textStyleModel.ecModel;
+    var globalTextStyle = ecModel && ecModel.option.textStyle;
+
+    // Consider case:
+    // {
+    //     data: [{
+    //         value: 12,
+    //         label: {
+    //             rich: {
+    //                 // no 'a' here but using parent 'a'.
+    //             }
+    //         }
+    //     }],
+    //     rich: {
+    //         a: { ... }
+    //     }
+    // }
+    var richItemNames = getRichItemNames(textStyleModel);
+    var richResult;
+    if (richItemNames) {
+        richResult = {};
+        for (var name in richItemNames) {
+            if (richItemNames.hasOwnProperty(name)) {
+                // Cascade is supported in rich.
+                var richTextStyle = textStyleModel.getModel(['rich', name]);
+                // In rich, never `disableBox`.
+                setTokenTextStyle(richResult[name] = {}, richTextStyle, globalTextStyle, opt, isEmphasis);
+            }
+        }
+    }
+    textStyle.rich = richResult;
+
+    setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, isEmphasis, true);
+
+    if (opt.forceRich && !opt.textStyle) {
+        opt.textStyle = {};
+    }
+
+    return textStyle;
+}
+
+// Consider case:
+// {
+//     data: [{
+//         value: 12,
+//         label: {
+//             rich: {
+//                 // no 'a' here but using parent 'a'.
+//             }
+//         }
+//     }],
+//     rich: {
+//         a: { ... }
+//     }
+// }
+function getRichItemNames(textStyleModel) {
+    // Use object to remove duplicated names.
+    var richItemNameMap;
+    while (textStyleModel && textStyleModel !== textStyleModel.ecModel) {
+        var rich = (textStyleModel.option || EMPTY_OBJ).rich;
+        if (rich) {
+            richItemNameMap = richItemNameMap || {};
+            for (var name in rich) {
+                if (rich.hasOwnProperty(name)) {
+                    richItemNameMap[name] = 1;
+                }
+            }
+        }
+        textStyleModel = textStyleModel.parentModel;
+    }
+    return richItemNameMap;
+}
+
+function setTokenTextStyle(textStyle, textStyleModel, globalTextStyle, opt, isEmphasis, isBlock) {
+    // In merge mode, default value should not be given.
+    globalTextStyle = !isEmphasis && globalTextStyle || EMPTY_OBJ;
+
+    textStyle.textFill = getAutoColor(textStyleModel.getShallow('color'), opt)
+        || globalTextStyle.color;
+    textStyle.textStroke = getAutoColor(textStyleModel.getShallow('textBorderColor'), opt)
+        || globalTextStyle.textBorderColor;
+    textStyle.textStrokeWidth = retrieve2(
+        textStyleModel.getShallow('textBorderWidth'),
+        globalTextStyle.textBorderWidth
+    );
+
+    if (!isEmphasis) {
+        if (isBlock) {
+            // Always set `insideRollback`, for clearing previous.
+            var originalTextPosition = textStyle.textPosition;
+            textStyle.insideRollback = applyInsideStyle(textStyle, originalTextPosition, opt);
+            // Save original textPosition, because style.textPosition will be repalced by
+            // real location (like [10, 30]) in zrender.
+            textStyle.insideOriginalTextPosition = originalTextPosition;
+            textStyle.insideRollbackOpt = opt;
+        }
+
+        // Set default finally.
+        if (textStyle.textFill == null) {
+            textStyle.textFill = opt.autoColor;
+        }
+    }
+
+    // Do not use `getFont` here, because merge should be supported, where
+    // part of these properties may be changed in emphasis style, and the
+    // others should remain their original value got from normal style.
+    textStyle.fontStyle = textStyleModel.getShallow('fontStyle') || globalTextStyle.fontStyle;
+    textStyle.fontWeight = textStyleModel.getShallow('fontWeight') || globalTextStyle.fontWeight;
+    textStyle.fontSize = textStyleModel.getShallow('fontSize') || globalTextStyle.fontSize;
+    textStyle.fontFamily = textStyleModel.getShallow('fontFamily') || globalTextStyle.fontFamily;
+
+    textStyle.textAlign = textStyleModel.getShallow('align');
+    textStyle.textVerticalAlign = textStyleModel.getShallow('verticalAlign')
+        || textStyleModel.getShallow('baseline');
+
+    textStyle.textLineHeight = textStyleModel.getShallow('lineHeight');
+    textStyle.textWidth = textStyleModel.getShallow('width');
+    textStyle.textHeight = textStyleModel.getShallow('height');
+    textStyle.textTag = textStyleModel.getShallow('tag');
+
+    if (!isBlock || !opt.disableBox) {
+        textStyle.textBackgroundColor = getAutoColor(textStyleModel.getShallow('backgroundColor'), opt);
+        textStyle.textPadding = textStyleModel.getShallow('padding');
+        textStyle.textBorderColor = getAutoColor(textStyleModel.getShallow('borderColor'), opt);
+        textStyle.textBorderWidth = textStyleModel.getShallow('borderWidth');
+        textStyle.textBorderRadius = textStyleModel.getShallow('borderRadius');
+
+        textStyle.textBoxShadowColor = textStyleModel.getShallow('shadowColor');
+        textStyle.textBoxShadowBlur = textStyleModel.getShallow('shadowBlur');
+        textStyle.textBoxShadowOffsetX = textStyleModel.getShallow('shadowOffsetX');
+        textStyle.textBoxShadowOffsetY = textStyleModel.getShallow('shadowOffsetY');
+    }
+
+    textStyle.textShadowColor = textStyleModel.getShallow('textShadowColor')
+        || globalTextStyle.textShadowColor;
+    textStyle.textShadowBlur = textStyleModel.getShallow('textShadowBlur')
+        || globalTextStyle.textShadowBlur;
+    textStyle.textShadowOffsetX = textStyleModel.getShallow('textShadowOffsetX')
+        || globalTextStyle.textShadowOffsetX;
+    textStyle.textShadowOffsetY = textStyleModel.getShallow('textShadowOffsetY')
+        || globalTextStyle.textShadowOffsetY;
+}
+
+function getAutoColor(color, opt) {
+    return color !== 'auto' ? color : (opt && opt.autoColor) ? opt.autoColor : null;
+}
+
+function applyInsideStyle(textStyle, textPosition, opt) {
+    var useInsideStyle = opt.useInsideStyle;
+    var insideRollback;
+
+    if (textStyle.textFill == null
+        && useInsideStyle !== false
+        && (useInsideStyle === true
+            || (opt.isRectText
+                && textPosition
+                // textPosition can be [10, 30]
+                && typeof textPosition === 'string'
+                && textPosition.indexOf('inside') >= 0
+            )
+        )
+    ) {
+        insideRollback = {
+            textFill: null,
+            textStroke: textStyle.textStroke,
+            textStrokeWidth: textStyle.textStrokeWidth
+        };
+        textStyle.textFill = '#fff';
+        // Consider text with #fff overflow its container.
+        if (textStyle.textStroke == null) {
+            textStyle.textStroke = opt.autoColor;
+            textStyle.textStrokeWidth == null && (textStyle.textStrokeWidth = 2);
+        }
+    }
+
+    return insideRollback;
+}
+
+function rollbackInsideStyle(style) {
+    var insideRollback = style.insideRollback;
+    if (insideRollback) {
+        style.textFill = insideRollback.textFill;
+        style.textStroke = insideRollback.textStroke;
+        style.textStrokeWidth = insideRollback.textStrokeWidth;
+    }
+}
+
+function getFont(opt, ecModel) {
+    // ecModel or default text style model.
+    var gTextStyleModel = ecModel || ecModel.getModel('textStyle');
+    return trim([
+        // FIXME in node-canvas fontWeight is before fontStyle
+        opt.fontStyle || gTextStyleModel && gTextStyleModel.getShallow('fontStyle') || '',
+        opt.fontWeight || gTextStyleModel && gTextStyleModel.getShallow('fontWeight') || '',
+        (opt.fontSize || gTextStyleModel && gTextStyleModel.getShallow('fontSize') || 12) + 'px',
+        opt.fontFamily || gTextStyleModel && gTextStyleModel.getShallow('fontFamily') || 'sans-serif'
+    ].join(' '));
+}
+
+function animateOrSetProps(isUpdate, el, props, animatableModel, dataIndex, cb) {
+    if (typeof dataIndex === 'function') {
+        cb = dataIndex;
+        dataIndex = null;
+    }
+    // Do not check 'animation' property directly here. Consider this case:
+    // animation model is an `itemModel`, whose does not have `isAnimationEnabled`
+    // but its parent model (`seriesModel`) does.
+    var animationEnabled = animatableModel && animatableModel.isAnimationEnabled();
+
+    if (animationEnabled) {
+        var postfix = isUpdate ? 'Update' : '';
+        var duration = animatableModel.getShallow('animationDuration' + postfix);
+        var animationEasing = animatableModel.getShallow('animationEasing' + postfix);
+        var animationDelay = animatableModel.getShallow('animationDelay' + postfix);
+        if (typeof animationDelay === 'function') {
+            animationDelay = animationDelay(
+                dataIndex,
+                animatableModel.getAnimationDelayParams
+                    ? animatableModel.getAnimationDelayParams(el, dataIndex)
+                    : null
+            );
+        }
+        if (typeof duration === 'function') {
+            duration = duration(dataIndex);
+        }
+
+        duration > 0
+            ? el.animateTo(props, duration, animationDelay || 0, animationEasing, cb, !!cb)
+            : (el.stopAnimation(), el.attr(props), cb && cb());
+    }
+    else {
+        el.stopAnimation();
+        el.attr(props);
+        cb && cb();
+    }
+}
+
+/**
+ * Update graphic element properties with or without animation according to the
+ * configuration in series.
+ *
+ * Caution: this method will stop previous animation.
+ * So if do not use this method to one element twice before
+ * animation starts, unless you know what you are doing.
+ *
+ * @param {module:zrender/Element} el
+ * @param {Object} props
+ * @param {module:echarts/model/Model} [animatableModel]
+ * @param {number} [dataIndex]
+ * @param {Function} [cb]
+ * @example
+ *     graphic.updateProps(el, {
+ *         position: [100, 100]
+ *     }, seriesModel, dataIndex, function () { console.log('Animation done!'); });
+ *     // Or
+ *     graphic.updateProps(el, {
+ *         position: [100, 100]
+ *     }, seriesModel, function () { console.log('Animation done!'); });
+ */
+function updateProps(el, props, animatableModel, dataIndex, cb) {
+    animateOrSetProps(true, el, props, animatableModel, dataIndex, cb);
+}
+
+/**
+ * Init graphic element properties with or without animation according to the
+ * configuration in series.
+ *
+ * Caution: this method will stop previous animation.
+ * So if do not use this method to one element twice before
+ * animation starts, unless you know what you are doing.
+ *
+ * @param {module:zrender/Element} el
+ * @param {Object} props
+ * @param {module:echarts/model/Model} [animatableModel]
+ * @param {number} [dataIndex]
+ * @param {Function} cb
+ */
+function initProps(el, props, animatableModel, dataIndex, cb) {
+    animateOrSetProps(false, el, props, animatableModel, dataIndex, cb);
+}
+
+/**
+ * Get transform matrix of target (param target),
+ * in coordinate of its ancestor (param ancestor)
+ *
+ * @param {module:zrender/mixin/Transformable} target
+ * @param {module:zrender/mixin/Transformable} [ancestor]
+ */
+function getTransform(target, ancestor) {
+    var mat = identity([]);
+
+    while (target && target !== ancestor) {
+        mul$1(mat, target.getLocalTransform(), mat);
+        target = target.parent;
+    }
+
+    return mat;
+}
+
+/**
+ * Apply transform to an vertex.
+ * @param {Array.<number>} target [x, y]
+ * @param {Array.<number>|TypedArray.<number>|Object} transform Can be:
+ *      + Transform matrix: like [1, 0, 0, 1, 0, 0]
+ *      + {position, rotation, scale}, the same as `zrender/Transformable`.
+ * @param {boolean=} invert Whether use invert matrix.
+ * @return {Array.<number>} [x, y]
+ */
+function applyTransform$1(target, transform, invert$$1) {
+    if (transform && !isArrayLike(transform)) {
+        transform = Transformable.getLocalTransform(transform);
+    }
+
+    if (invert$$1) {
+        transform = invert([], transform);
+    }
+    return applyTransform([], target, transform);
+}
+
+/**
+ * @param {string} direction 'left' 'right' 'top' 'bottom'
+ * @param {Array.<number>} transform Transform matrix: like [1, 0, 0, 1, 0, 0]
+ * @param {boolean=} invert Whether use invert matrix.
+ * @return {string} Transformed direction. 'left' 'right' 'top' 'bottom'
+ */
+function transformDirection(direction, transform, invert$$1) {
+
+    // Pick a base, ensure that transform result will not be (0, 0).
+    var hBase = (transform[4] === 0 || transform[5] === 0 || transform[0] === 0)
+        ? 1 : Math.abs(2 * transform[4] / transform[0]);
+    var vBase = (transform[4] === 0 || transform[5] === 0 || transform[2] === 0)
+        ? 1 : Math.abs(2 * transform[4] / transform[2]);
+
+    var vertex = [
+        direction === 'left' ? -hBase : direction === 'right' ? hBase : 0,
+        direction === 'top' ? -vBase : direction === 'bottom' ? vBase : 0
+    ];
+
+    vertex = applyTransform$1(vertex, transform, invert$$1);
+
+    return Math.abs(vertex[0]) > Math.abs(vertex[1])
+        ? (vertex[0] > 0 ? 'right' : 'left')
+        : (vertex[1] > 0 ? 'bottom' : 'top');
+}
+
+/**
+ * Apply group transition animation from g1 to g2.
+ * If no animatableModel, no animation.
+ */
+function groupTransition(g1, g2, animatableModel, cb) {
+    if (!g1 || !g2) {
+        return;
+    }
+
+    function getElMap(g) {
+        var elMap = {};
+        g.traverse(function (el) {
+            if (!el.isGroup && el.anid) {
+                elMap[el.anid] = el;
+            }
+        });
+        return elMap;
+    }
+    function getAnimatableProps(el) {
+        var obj = {
+            position: clone$1(el.position),
+            rotation: el.rotation
+        };
+        if (el.shape) {
+            obj.shape = extend({}, el.shape);
+        }
+        return obj;
+    }
+    var elMap1 = getElMap(g1);
+
+    g2.traverse(function (el) {
+        if (!el.isGroup && el.anid) {
+            var oldEl = elMap1[el.anid];
+            if (oldEl) {
+                var newProp = getAnimatableProps(el);
+                el.attr(getAnimatableProps(oldEl));
+                updateProps(el, newProp, animatableModel, el.dataIndex);
+            }
+            // else {
+            //     if (el.previousProps) {
+            //         graphic.updateProps
+            //     }
+            // }
+        }
+    });
+}
+
+/**
+ * @param {Array.<Array.<number>>} points Like: [[23, 44], [53, 66], ...]
+ * @param {Object} rect {x, y, width, height}
+ * @return {Array.<Array.<number>>} A new clipped points.
+ */
+function clipPointsByRect(points, rect) {
+    return map(points, function (point) {
+        var x = point[0];
+        x = mathMax$1(x, rect.x);
+        x = mathMin$1(x, rect.x + rect.width);
+        var y = point[1];
+        y = mathMax$1(y, rect.y);
+        y = mathMin$1(y, rect.y + rect.height);
+        return [x, y];
+    });
+}
+
+/**
+ * @param {Object} targetRect {x, y, width, height}
+ * @param {Object} rect {x, y, width, height}
+ * @return {Object} A new clipped rect. If rect size are negative, return undefined.
+ */
+function clipRectByRect(targetRect, rect) {
+    var x = mathMax$1(targetRect.x, rect.x);
+    var x2 = mathMin$1(targetRect.x + targetRect.width, rect.x + rect.width);
+    var y = mathMax$1(targetRect.y, rect.y);
+    var y2 = mathMin$1(targetRect.y + targetRect.height, rect.y + rect.height);
+
+    if (x2 >= x && y2 >= y) {
+        return {
+            x: x,
+            y: y,
+            width: x2 - x,
+            height: y2 - y
+        };
+    }
+}
+
+/**
+ * @param {string} iconStr Support 'image://' or 'path://' or direct svg path.
+ * @param {Object} [opt] Properties of `module:zrender/Element`, except `style`.
+ * @param {Object} [rect] {x, y, width, height}
+ * @return {module:zrender/Element} Icon path or image element.
+ */
+function createIcon(iconStr, opt, rect) {
+    opt = extend({rectHover: true}, opt);
+    var style = opt.style = {strokeNoScale: true};
+    rect = rect || {x: -1, y: -1, width: 2, height: 2};
+
+    if (iconStr) {
+        return iconStr.indexOf('image://') === 0
+            ? (
+                style.image = iconStr.slice(8),
+                defaults(style, rect),
+                new ZImage(opt)
+            )
+            : (
+                makePath(
+                    iconStr.replace('path://', ''),
+                    opt,
+                    rect,
+                    'center'
+                )
+            );
+    }
+}
+
+
+
+
+var graphic = (Object.freeze || Object)({
+	extendShape: extendShape,
+	extendPath: extendPath,
+	makePath: makePath,
+	makeImage: makeImage,
+	mergePath: mergePath,
+	resizePath: resizePath,
+	subPixelOptimizeLine: subPixelOptimizeLine,
+	subPixelOptimizeRect: subPixelOptimizeRect,
+	subPixelOptimize: subPixelOptimize,
+	setHoverStyle: setHoverStyle,
+	setLabelStyle: setLabelStyle,
+	setTextStyle: setTextStyle,
+	setText: setText,
+	getFont: getFont,
+	updateProps: updateProps,
+	initProps: initProps,
+	getTransform: getTransform,
+	applyTransform: applyTransform$1,
+	transformDirection: transformDirection,
+	groupTransition: groupTransition,
+	clipPointsByRect: clipPointsByRect,
+	clipRectByRect: clipRectByRect,
+	createIcon: createIcon,
+	Group: Group,
+	Image: ZImage,
+	Text: Text,
+	Circle: Circle,
+	Sector: Sector,
+	Ring: Ring,
+	Polygon: Polygon,
+	Polyline: Polyline,
+	Rect: Rect,
+	Line: Line,
+	BezierCurve: BezierCurve,
+	Arc: Arc,
+	IncrementalDisplayable: IncrementalDisplayble,
+	CompoundPath: CompoundPath,
+	LinearGradient: LinearGradient,
+	RadialGradient: RadialGradient,
+	BoundingRect: BoundingRect
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PATH_COLOR = ['textStyle', 'color'];
+
+var textStyleMixin = {
+    /**
+     * Get color property or get color from option.textStyle.color
+     * @param {boolean} [isEmphasis]
+     * @return {string}
+     */
+    getTextColor: function (isEmphasis) {
+        var ecModel = this.ecModel;
+        return this.getShallow('color')
+            || (
+                (!isEmphasis && ecModel) ? ecModel.get(PATH_COLOR) : null
+            );
+    },
+
+    /**
+     * Create font string from fontStyle, fontWeight, fontSize, fontFamily
+     * @return {string}
+     */
+    getFont: function () {
+        return getFont({
+            fontStyle: this.getShallow('fontStyle'),
+            fontWeight: this.getShallow('fontWeight'),
+            fontSize: this.getShallow('fontSize'),
+            fontFamily: this.getShallow('fontFamily')
+        }, this.ecModel);
+    },
+
+    getTextRect: function (text) {
+        return getBoundingRect(
+            text,
+            this.getFont(),
+            this.getShallow('align'),
+            this.getShallow('verticalAlign') || this.getShallow('baseline'),
+            this.getShallow('padding'),
+            this.getShallow('rich'),
+            this.getShallow('truncateText')
+        );
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getItemStyle = makeStyleMapper(
+    [
+        ['fill', 'color'],
+        ['stroke', 'borderColor'],
+        ['lineWidth', 'borderWidth'],
+        ['opacity'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['shadowColor'],
+        ['textPosition'],
+        ['textAlign']
+    ]
+);
+
+var itemStyleMixin = {
+    getItemStyle: function (excludes, includes) {
+        var style = getItemStyle(this, excludes, includes);
+        var lineDash = this.getBorderLineDash();
+        lineDash && (style.lineDash = lineDash);
+        return style;
+    },
+
+    getBorderLineDash: function () {
+        var lineType = this.get('borderType');
+        return (lineType === 'solid' || lineType == null) ? null
+            : (lineType === 'dashed' ? [5, 5] : [1, 1]);
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/model/Model
+ */
+
+var mixin$1 = mixin;
+var inner = makeInner();
+
+/**
+ * @alias module:echarts/model/Model
+ * @constructor
+ * @param {Object} option
+ * @param {module:echarts/model/Model} [parentModel]
+ * @param {module:echarts/model/Global} [ecModel]
+ */
+function Model(option, parentModel, ecModel) {
+    /**
+     * @type {module:echarts/model/Model}
+     * @readOnly
+     */
+    this.parentModel = parentModel;
+
+    /**
+     * @type {module:echarts/model/Global}
+     * @readOnly
+     */
+    this.ecModel = ecModel;
+
+    /**
+     * @type {Object}
+     * @protected
+     */
+    this.option = option;
+
+    // Simple optimization
+    // if (this.init) {
+    //     if (arguments.length <= 4) {
+    //         this.init(option, parentModel, ecModel, extraOpt);
+    //     }
+    //     else {
+    //         this.init.apply(this, arguments);
+    //     }
+    // }
+}
+
+Model.prototype = {
+
+    constructor: Model,
+
+    /**
+     * Model 的初始化函数
+     * @param {Object} option
+     */
+    init: null,
+
+    /**
+     * 从新的 Option merge
+     */
+    mergeOption: function (option) {
+        merge(this.option, option, true);
+    },
+
+    /**
+     * @param {string|Array.<string>} path
+     * @param {boolean} [ignoreParent=false]
+     * @return {*}
+     */
+    get: function (path, ignoreParent) {
+        if (path == null) {
+            return this.option;
+        }
+
+        return doGet(
+            this.option,
+            this.parsePath(path),
+            !ignoreParent && getParent(this, path)
+        );
+    },
+
+    /**
+     * @param {string} key
+     * @param {boolean} [ignoreParent=false]
+     * @return {*}
+     */
+    getShallow: function (key, ignoreParent) {
+        var option = this.option;
+
+        var val = option == null ? option : option[key];
+        var parentModel = !ignoreParent && getParent(this, key);
+        if (val == null && parentModel) {
+            val = parentModel.getShallow(key);
+        }
+        return val;
+    },
+
+    /**
+     * @param {string|Array.<string>} [path]
+     * @param {module:echarts/model/Model} [parentModel]
+     * @return {module:echarts/model/Model}
+     */
+    getModel: function (path, parentModel) {
+        var obj = path == null
+            ? this.option
+            : doGet(this.option, path = this.parsePath(path));
+
+        var thisParentModel;
+        parentModel = parentModel || (
+            (thisParentModel = getParent(this, path))
+                && thisParentModel.getModel(path)
+        );
+
+        return new Model(obj, parentModel, this.ecModel);
+    },
+
+    /**
+     * If model has option
+     */
+    isEmpty: function () {
+        return this.option == null;
+    },
+
+    restoreData: function () {},
+
+    // Pending
+    clone: function () {
+        var Ctor = this.constructor;
+        return new Ctor(clone(this.option));
+    },
+
+    setReadOnly: function (properties) {
+        // clazzUtil.setReadOnly(this, properties);
+    },
+
+    // If path is null/undefined, return null/undefined.
+    parsePath: function(path) {
+        if (typeof path === 'string') {
+            path = path.split('.');
+        }
+        return path;
+    },
+
+    /**
+     * @param {Function} getParentMethod
+     *        param {Array.<string>|string} path
+     *        return {module:echarts/model/Model}
+     */
+    customizeGetParent: function (getParentMethod) {
+        inner(this).getParent = getParentMethod;
+    },
+
+    isAnimationEnabled: function () {
+        if (!env$1.node) {
+            if (this.option.animation != null) {
+                return !!this.option.animation;
+            }
+            else if (this.parentModel) {
+                return this.parentModel.isAnimationEnabled();
+            }
+        }
+    }
+
+};
+
+function doGet(obj, pathArr, parentModel) {
+    for (var i = 0; i < pathArr.length; i++) {
+        // Ignore empty
+        if (!pathArr[i]) {
+            continue;
+        }
+        // obj could be number/string/... (like 0)
+        obj = (obj && typeof obj === 'object') ? obj[pathArr[i]] : null;
+        if (obj == null) {
+            break;
+        }
+    }
+    if (obj == null && parentModel) {
+        obj = parentModel.get(pathArr);
+    }
+    return obj;
+}
+
+// `path` can be null/undefined
+function getParent(model, path) {
+    var getParentMethod = inner(model).getParent;
+    return getParentMethod ? getParentMethod.call(model, path) : model.parentModel;
+}
+
+// Enable Model.extend.
+enableClassExtend(Model);
+enableClassCheck(Model);
+
+mixin$1(Model, lineStyleMixin);
+mixin$1(Model, areaStyleMixin);
+mixin$1(Model, textStyleMixin);
+mixin$1(Model, itemStyleMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var base = 0;
+
+/**
+ * @public
+ * @param {string} type
+ * @return {string}
+ */
+function getUID(type) {
+    // Considering the case of crossing js context,
+    // use Math.random to make id as unique as possible.
+    return [(type || ''), base++, Math.random().toFixed(5)].join('_');
+}
+
+/**
+ * @inner
+ */
+function enableSubTypeDefaulter(entity) {
+
+    var subTypeDefaulters = {};
+
+    entity.registerSubTypeDefaulter = function (componentType, defaulter) {
+        componentType = parseClassType$1(componentType);
+        subTypeDefaulters[componentType.main] = defaulter;
+    };
+
+    entity.determineSubType = function (componentType, option) {
+        var type = option.type;
+        if (!type) {
+            var componentTypeMain = parseClassType$1(componentType).main;
+            if (entity.hasSubTypes(componentType) && subTypeDefaulters[componentTypeMain]) {
+                type = subTypeDefaulters[componentTypeMain](option);
+            }
+        }
+        return type;
+    };
+
+    return entity;
+}
+
+/**
+ * Topological travel on Activity Network (Activity On Vertices).
+ * Dependencies is defined in Model.prototype.dependencies, like ['xAxis', 'yAxis'].
+ *
+ * If 'xAxis' or 'yAxis' is absent in componentTypeList, just ignore it in topology.
+ *
+ * If there is circle dependencey, Error will be thrown.
+ *
+ */
+function enableTopologicalTravel(entity, dependencyGetter) {
+
+    /**
+     * @public
+     * @param {Array.<string>} targetNameList Target Component type list.
+     *                                           Can be ['aa', 'bb', 'aa.xx']
+     * @param {Array.<string>} fullNameList By which we can build dependency graph.
+     * @param {Function} callback Params: componentType, dependencies.
+     * @param {Object} context Scope of callback.
+     */
+    entity.topologicalTravel = function (targetNameList, fullNameList, callback, context) {
+        if (!targetNameList.length) {
+            return;
+        }
+
+        var result = makeDepndencyGraph(fullNameList);
+        var graph = result.graph;
+        var stack = result.noEntryList;
+
+        var targetNameSet = {};
+        each$1(targetNameList, function (name) {
+            targetNameSet[name] = true;
+        });
+
+        while (stack.length) {
+            var currComponentType = stack.pop();
+            var currVertex = graph[currComponentType];
+            var isInTargetNameSet = !!targetNameSet[currComponentType];
+            if (isInTargetNameSet) {
+                callback.call(context, currComponentType, currVertex.originalDeps.slice());
+                delete targetNameSet[currComponentType];
+            }
+            each$1(
+                currVertex.successor,
+                isInTargetNameSet ? removeEdgeAndAdd : removeEdge
+            );
+        }
+
+        each$1(targetNameSet, function () {
+            throw new Error('Circle dependency may exists');
+        });
+
+        function removeEdge(succComponentType) {
+            graph[succComponentType].entryCount--;
+            if (graph[succComponentType].entryCount === 0) {
+                stack.push(succComponentType);
+            }
+        }
+
+        // Consider this case: legend depends on series, and we call
+        // chart.setOption({series: [...]}), where only series is in option.
+        // If we do not have 'removeEdgeAndAdd', legendModel.mergeOption will
+        // not be called, but only sereis.mergeOption is called. Thus legend
+        // have no chance to update its local record about series (like which
+        // name of series is available in legend).
+        function removeEdgeAndAdd(succComponentType) {
+            targetNameSet[succComponentType] = true;
+            removeEdge(succComponentType);
+        }
+    };
+
+    /**
+     * DepndencyGraph: {Object}
+     * key: conponentType,
+     * value: {
+     *     successor: [conponentTypes...],
+     *     originalDeps: [conponentTypes...],
+     *     entryCount: {number}
+     * }
+     */
+    function makeDepndencyGraph(fullNameList) {
+        var graph = {};
+        var noEntryList = [];
+
+        each$1(fullNameList, function (name) {
+
+            var thisItem = createDependencyGraphItem(graph, name);
+            var originalDeps = thisItem.originalDeps = dependencyGetter(name);
+
+            var availableDeps = getAvailableDependencies(originalDeps, fullNameList);
+            thisItem.entryCount = availableDeps.length;
+            if (thisItem.entryCount === 0) {
+                noEntryList.push(name);
+            }
+
+            each$1(availableDeps, function (dependentName) {
+                if (indexOf(thisItem.predecessor, dependentName) < 0) {
+                    thisItem.predecessor.push(dependentName);
+                }
+                var thatItem = createDependencyGraphItem(graph, dependentName);
+                if (indexOf(thatItem.successor, dependentName) < 0) {
+                    thatItem.successor.push(name);
+                }
+            });
+        });
+
+        return {graph: graph, noEntryList: noEntryList};
+    }
+
+    function createDependencyGraphItem(graph, name) {
+        if (!graph[name]) {
+            graph[name] = {predecessor: [], successor: []};
+        }
+        return graph[name];
+    }
+
+    function getAvailableDependencies(originalDeps, fullNameList) {
+        var availableDeps = [];
+        each$1(originalDeps, function (dep) {
+            indexOf(fullNameList, dep) >= 0 && availableDeps.push(dep);
+        });
+        return availableDeps;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var RADIAN_EPSILON = 1e-4;
+
+function _trim(str) {
+    return str.replace(/^\s+/, '').replace(/\s+$/, '');
+}
+
+/**
+ * Linear mapping a value from domain to range
+ * @memberOf module:echarts/util/number
+ * @param  {(number|Array.<number>)} val
+ * @param  {Array.<number>} domain Domain extent domain[0] can be bigger than domain[1]
+ * @param  {Array.<number>} range  Range extent range[0] can be bigger than range[1]
+ * @param  {boolean} clamp
+ * @return {(number|Array.<number>}
+ */
+function linearMap(val, domain, range, clamp) {
+    var subDomain = domain[1] - domain[0];
+    var subRange = range[1] - range[0];
+
+    if (subDomain === 0) {
+        return subRange === 0
+            ? range[0]
+            : (range[0] + range[1]) / 2;
+    }
+
+    // Avoid accuracy problem in edge, such as
+    // 146.39 - 62.83 === 83.55999999999999.
+    // See echarts/test/ut/spec/util/number.js#linearMap#accuracyError
+    // It is a little verbose for efficiency considering this method
+    // is a hotspot.
+    if (clamp) {
+        if (subDomain > 0) {
+            if (val <= domain[0]) {
+                return range[0];
+            }
+            else if (val >= domain[1]) {
+                return range[1];
+            }
+        }
+        else {
+            if (val >= domain[0]) {
+                return range[0];
+            }
+            else if (val <= domain[1]) {
+                return range[1];
+            }
+        }
+    }
+    else {
+        if (val === domain[0]) {
+            return range[0];
+        }
+        if (val === domain[1]) {
+            return range[1];
+        }
+    }
+
+    return (val - domain[0]) / subDomain * subRange + range[0];
+}
+
+/**
+ * Convert a percent string to absolute number.
+ * Returns NaN if percent is not a valid string or number
+ * @memberOf module:echarts/util/number
+ * @param {string|number} percent
+ * @param {number} all
+ * @return {number}
+ */
+function parsePercent$1(percent, all) {
+    switch (percent) {
+        case 'center':
+        case 'middle':
+            percent = '50%';
+            break;
+        case 'left':
+        case 'top':
+            percent = '0%';
+            break;
+        case 'right':
+        case 'bottom':
+            percent = '100%';
+            break;
+    }
+    if (typeof percent === 'string') {
+        if (_trim(percent).match(/%$/)) {
+            return parseFloat(percent) / 100 * all;
+        }
+
+        return parseFloat(percent);
+    }
+
+    return percent == null ? NaN : +percent;
+}
+
+/**
+ * (1) Fix rounding error of float numbers.
+ * (2) Support return string to avoid scientific notation like '3.5e-7'.
+ *
+ * @param {number} x
+ * @param {number} [precision]
+ * @param {boolean} [returnStr]
+ * @return {number|string}
+ */
+function round$1(x, precision, returnStr) {
+    if (precision == null) {
+        precision = 10;
+    }
+    // Avoid range error
+    precision = Math.min(Math.max(0, precision), 20);
+    x = (+x).toFixed(precision);
+    return returnStr ? x : +x;
+}
+
+function asc(arr) {
+    arr.sort(function (a, b) {
+        return a - b;
+    });
+    return arr;
+}
+
+/**
+ * Get precision
+ * @param {number} val
+ */
+function getPrecision(val) {
+    val = +val;
+    if (isNaN(val)) {
+        return 0;
+    }
+    // It is much faster than methods converting number to string as follows
+    //      var tmp = val.toString();
+    //      return tmp.length - 1 - tmp.indexOf('.');
+    // especially when precision is low
+    var e = 1;
+    var count = 0;
+    while (Math.round(val * e) / e !== val) {
+        e *= 10;
+        count++;
+    }
+    return count;
+}
+
+/**
+ * @param {string|number} val
+ * @return {number}
+ */
+function getPrecisionSafe(val) {
+    var str = val.toString();
+
+    // Consider scientific notation: '3.4e-12' '3.4e+12'
+    var eIndex = str.indexOf('e');
+    if (eIndex > 0) {
+        var precision = +str.slice(eIndex + 1);
+        return precision < 0 ? -precision : 0;
+    }
+    else {
+        var dotIndex = str.indexOf('.');
+        return dotIndex < 0 ? 0 : str.length - 1 - dotIndex;
+    }
+}
+
+/**
+ * Minimal dicernible data precisioin according to a single pixel.
+ *
+ * @param {Array.<number>} dataExtent
+ * @param {Array.<number>} pixelExtent
+ * @return {number} precision
+ */
+function getPixelPrecision(dataExtent, pixelExtent) {
+    var log = Math.log;
+    var LN10 = Math.LN10;
+    var dataQuantity = Math.floor(log(dataExtent[1] - dataExtent[0]) / LN10);
+    var sizeQuantity = Math.round(log(Math.abs(pixelExtent[1] - pixelExtent[0])) / LN10);
+    // toFixed() digits argument must be between 0 and 20.
+    var precision = Math.min(Math.max(-dataQuantity + sizeQuantity, 0), 20);
+    return !isFinite(precision) ? 20 : precision;
+}
+
+/**
+ * Get a data of given precision, assuring the sum of percentages
+ * in valueList is 1.
+ * The largest remainer method is used.
+ * https://en.wikipedia.org/wiki/Largest_remainder_method
+ *
+ * @param {Array.<number>} valueList a list of all data
+ * @param {number} idx index of the data to be processed in valueList
+ * @param {number} precision integer number showing digits of precision
+ * @return {number} percent ranging from 0 to 100
+ */
+function getPercentWithPrecision(valueList, idx, precision) {
+    if (!valueList[idx]) {
+        return 0;
+    }
+
+    var sum = reduce(valueList, function (acc, val) {
+        return acc + (isNaN(val) ? 0 : val);
+    }, 0);
+    if (sum === 0) {
+        return 0;
+    }
+
+    var digits = Math.pow(10, precision);
+    var votesPerQuota = map(valueList, function (val) {
+        return (isNaN(val) ? 0 : val) / sum * digits * 100;
+    });
+    var targetSeats = digits * 100;
+
+    var seats = map(votesPerQuota, function (votes) {
+        // Assign automatic seats.
+        return Math.floor(votes);
+    });
+    var currentSum = reduce(seats, function (acc, val) {
+        return acc + val;
+    }, 0);
+
+    var remainder = map(votesPerQuota, function (votes, idx) {
+        return votes - seats[idx];
+    });
+
+    // Has remainding votes.
+    while (currentSum < targetSeats) {
+        // Find next largest remainder.
+        var max = Number.NEGATIVE_INFINITY;
+        var maxId = null;
+        for (var i = 0, len = remainder.length; i < len; ++i) {
+            if (remainder[i] > max) {
+                max = remainder[i];
+                maxId = i;
+            }
+        }
+
+        // Add a vote to max remainder.
+        ++seats[maxId];
+        remainder[maxId] = 0;
+        ++currentSum;
+    }
+
+    return seats[idx] / digits;
+}
+
+// Number.MAX_SAFE_INTEGER, ie do not support.
+var MAX_SAFE_INTEGER = 9007199254740991;
+
+/**
+ * To 0 - 2 * PI, considering negative radian.
+ * @param {number} radian
+ * @return {number}
+ */
+function remRadian(radian) {
+    var pi2 = Math.PI * 2;
+    return (radian % pi2 + pi2) % pi2;
+}
+
+/**
+ * @param {type} radian
+ * @return {boolean}
+ */
+function isRadianAroundZero(val) {
+    return val > -RADIAN_EPSILON && val < RADIAN_EPSILON;
+}
+
+var TIME_REG = /^(?:(\d{4})(?:[-\/](\d{1,2})(?:[-\/](\d{1,2})(?:[T ](\d{1,2})(?::(\d\d)(?::(\d\d)(?:[.,](\d+))?)?)?(Z|[\+\-]\d\d:?\d\d)?)?)?)?)?$/; // jshint ignore:line
+
+/**
+ * @param {string|Date|number} value These values can be accepted:
+ *   + An instance of Date, represent a time in its own time zone.
+ *   + Or string in a subset of ISO 8601, only including:
+ *     + only year, month, date: '2012-03', '2012-03-01', '2012-03-01 05', '2012-03-01 05:06',
+ *     + separated with T or space: '2012-03-01T12:22:33.123', '2012-03-01 12:22:33.123',
+ *     + time zone: '2012-03-01T12:22:33Z', '2012-03-01T12:22:33+8000', '2012-03-01T12:22:33-05:00',
+ *     all of which will be treated as local time if time zone is not specified
+ *     (see <https://momentjs.com/>).
+ *   + Or other string format, including (all of which will be treated as loacal time):
+ *     '2012', '2012-3-1', '2012/3/1', '2012/03/01',
+ *     '2009/6/12 2:00', '2009/6/12 2:05:08', '2009/6/12 2:05:08.123'
+ *   + a timestamp, which represent a time in UTC.
+ * @return {Date} date
+ */
+function parseDate(value) {
+    if (value instanceof Date) {
+        return value;
+    }
+    else if (typeof value === 'string') {
+        // Different browsers parse date in different way, so we parse it manually.
+        // Some other issues:
+        // new Date('1970-01-01') is UTC,
+        // new Date('1970/01/01') and new Date('1970-1-01') is local.
+        // See issue #3623
+        var match = TIME_REG.exec(value);
+
+        if (!match) {
+            // return Invalid Date.
+            return new Date(NaN);
+        }
+
+        // Use local time when no timezone offset specifed.
+        if (!match[8]) {
+            // match[n] can only be string or undefined.
+            // But take care of '12' + 1 => '121'.
+            return new Date(
+                +match[1],
+                +(match[2] || 1) - 1,
+                +match[3] || 1,
+                +match[4] || 0,
+                +(match[5] || 0),
+                +match[6] || 0,
+                +match[7] || 0
+            );
+        }
+        // Timezoneoffset of Javascript Date has considered DST (Daylight Saving Time,
+        // https://tc39.github.io/ecma262/#sec-daylight-saving-time-adjustment).
+        // For example, system timezone is set as "Time Zone: America/Toronto",
+        // then these code will get different result:
+        // `new Date(1478411999999).getTimezoneOffset();  // get 240`
+        // `new Date(1478412000000).getTimezoneOffset();  // get 300`
+        // So we should not use `new Date`, but use `Date.UTC`.
+        else {
+            var hour = +match[4] || 0;
+            if (match[8].toUpperCase() !== 'Z') {
+                hour -= match[8].slice(0, 3);
+            }
+            return new Date(Date.UTC(
+                +match[1],
+                +(match[2] || 1) - 1,
+                +match[3] || 1,
+                hour,
+                +(match[5] || 0),
+                +match[6] || 0,
+                +match[7] || 0
+            ));
+        }
+    }
+    else if (value == null) {
+        return new Date(NaN);
+    }
+
+    return new Date(Math.round(value));
+}
+
+/**
+ * Quantity of a number. e.g. 0.1, 1, 10, 100
+ *
+ * @param  {number} val
+ * @return {number}
+ */
+function quantity(val) {
+    return Math.pow(10, quantityExponent(val));
+}
+
+function quantityExponent(val) {
+    return Math.floor(Math.log(val) / Math.LN10);
+}
+
+/**
+ * find a “nice” number approximately equal to x. Round the number if round = true,
+ * take ceiling if round = false. The primary observation is that the “nicest”
+ * numbers in decimal are 1, 2, and 5, and all power-of-ten multiples of these numbers.
+ *
+ * See "Nice Numbers for Graph Labels" of Graphic Gems.
+ *
+ * @param  {number} val Non-negative value.
+ * @param  {boolean} round
+ * @return {number}
+ */
+function nice(val, round) {
+    var exponent = quantityExponent(val);
+    var exp10 = Math.pow(10, exponent);
+    var f = val / exp10; // 1 <= f < 10
+    var nf;
+    if (round) {
+        if (f < 1.5) { nf = 1; }
+        else if (f < 2.5) { nf = 2; }
+        else if (f < 4) { nf = 3; }
+        else if (f < 7) { nf = 5; }
+        else { nf = 10; }
+    }
+    else {
+        if (f < 1) { nf = 1; }
+        else if (f < 2) { nf = 2; }
+        else if (f < 3) { nf = 3; }
+        else if (f < 5) { nf = 5; }
+        else { nf = 10; }
+    }
+    val = nf * exp10;
+
+    // Fix 3 * 0.1 === 0.30000000000000004 issue (see IEEE 754).
+    // 20 is the uppper bound of toFixed.
+    return exponent >= -20 ? +val.toFixed(exponent < 0 ? -exponent : 0) : val;
+}
+
+/**
+ * Order intervals asc, and split them when overlap.
+ * expect(numberUtil.reformIntervals([
+ *     {interval: [18, 62], close: [1, 1]},
+ *     {interval: [-Infinity, -70], close: [0, 0]},
+ *     {interval: [-70, -26], close: [1, 1]},
+ *     {interval: [-26, 18], close: [1, 1]},
+ *     {interval: [62, 150], close: [1, 1]},
+ *     {interval: [106, 150], close: [1, 1]},
+ *     {interval: [150, Infinity], close: [0, 0]}
+ * ])).toEqual([
+ *     {interval: [-Infinity, -70], close: [0, 0]},
+ *     {interval: [-70, -26], close: [1, 1]},
+ *     {interval: [-26, 18], close: [0, 1]},
+ *     {interval: [18, 62], close: [0, 1]},
+ *     {interval: [62, 150], close: [0, 1]},
+ *     {interval: [150, Infinity], close: [0, 0]}
+ * ]);
+ * @param {Array.<Object>} list, where `close` mean open or close
+ *        of the interval, and Infinity can be used.
+ * @return {Array.<Object>} The origin list, which has been reformed.
+ */
+function reformIntervals(list) {
+    list.sort(function (a, b) {
+        return littleThan(a, b, 0) ? -1 : 1;
+    });
+
+    var curr = -Infinity;
+    var currClose = 1;
+    for (var i = 0; i < list.length;) {
+        var interval = list[i].interval;
+        var close = list[i].close;
+
+        for (var lg = 0; lg < 2; lg++) {
+            if (interval[lg] <= curr) {
+                interval[lg] = curr;
+                close[lg] = !lg ? 1 - currClose : 1;
+            }
+            curr = interval[lg];
+            currClose = close[lg];
+        }
+
+        if (interval[0] === interval[1] && close[0] * close[1] !== 1) {
+            list.splice(i, 1);
+        }
+        else {
+            i++;
+        }
+    }
+
+    return list;
+
+    function littleThan(a, b, lg) {
+        return a.interval[lg] < b.interval[lg]
+            || (
+                a.interval[lg] === b.interval[lg]
+                && (
+                    (a.close[lg] - b.close[lg] === (!lg ? 1 : -1))
+                    || (!lg && littleThan(a, b, 1))
+                )
+            );
+    }
+}
+
+/**
+ * parseFloat NaNs numeric-cast false positives (null|true|false|"")
+ * ...but misinterprets leading-number strings, particularly hex literals ("0x...")
+ * subtraction forces infinities to NaN
+ *
+ * @param {*} v
+ * @return {boolean}
+ */
+function isNumeric(v) {
+    return v - parseFloat(v) >= 0;
+}
+
+
+var number = (Object.freeze || Object)({
+	linearMap: linearMap,
+	parsePercent: parsePercent$1,
+	round: round$1,
+	asc: asc,
+	getPrecision: getPrecision,
+	getPrecisionSafe: getPrecisionSafe,
+	getPixelPrecision: getPixelPrecision,
+	getPercentWithPrecision: getPercentWithPrecision,
+	MAX_SAFE_INTEGER: MAX_SAFE_INTEGER,
+	remRadian: remRadian,
+	isRadianAroundZero: isRadianAroundZero,
+	parseDate: parseDate,
+	quantity: quantity,
+	nice: nice,
+	reformIntervals: reformIntervals,
+	isNumeric: isNumeric
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * 每三位默认加,格式化
+ * @param {string|number} x
+ * @return {string}
+ */
+function addCommas(x) {
+    if (isNaN(x)) {
+        return '-';
+    }
+    x = (x + '').split('.');
+    return x[0].replace(/(\d{1,3})(?=(?:\d{3})+(?!\d))/g,'$1,')
+            + (x.length > 1 ? ('.' + x[1]) : '');
+}
+
+/**
+ * @param {string} str
+ * @param {boolean} [upperCaseFirst=false]
+ * @return {string} str
+ */
+function toCamelCase(str, upperCaseFirst) {
+    str = (str || '').toLowerCase().replace(/-(.)/g, function(match, group1) {
+        return group1.toUpperCase();
+    });
+
+    if (upperCaseFirst && str) {
+        str = str.charAt(0).toUpperCase() + str.slice(1);
+    }
+
+    return str;
+}
+
+var normalizeCssArray$1 = normalizeCssArray;
+
+
+var replaceReg = /([&<>"'])/g;
+var replaceMap = {
+    '&': '&amp;',
+    '<': '&lt;',
+    '>': '&gt;',
+    '"': '&quot;',
+    '\'': '&#39;'
+};
+
+function encodeHTML(source) {
+    return source == null
+        ? ''
+        : (source + '').replace(replaceReg, function (str, c) {
+            return replaceMap[c];
+        });
+}
+
+var TPL_VAR_ALIAS = ['a', 'b', 'c', 'd', 'e', 'f', 'g'];
+
+var wrapVar = function (varName, seriesIdx) {
+    return '{' + varName + (seriesIdx == null ? '' : seriesIdx) + '}';
+};
+
+/**
+ * Template formatter
+ * @param {string} tpl
+ * @param {Array.<Object>|Object} paramsList
+ * @param {boolean} [encode=false]
+ * @return {string}
+ */
+function formatTpl(tpl, paramsList, encode) {
+    if (!isArray(paramsList)) {
+        paramsList = [paramsList];
+    }
+    var seriesLen = paramsList.length;
+    if (!seriesLen) {
+        return '';
+    }
+
+    var $vars = paramsList[0].$vars || [];
+    for (var i = 0; i < $vars.length; i++) {
+        var alias = TPL_VAR_ALIAS[i];
+        tpl = tpl.replace(wrapVar(alias), wrapVar(alias, 0));
+    }
+    for (var seriesIdx = 0; seriesIdx < seriesLen; seriesIdx++) {
+        for (var k = 0; k < $vars.length; k++) {
+            var val = paramsList[seriesIdx][$vars[k]];
+            tpl = tpl.replace(
+                wrapVar(TPL_VAR_ALIAS[k], seriesIdx),
+                encode ? encodeHTML(val) : val
+            );
+        }
+    }
+
+    return tpl;
+}
+
+/**
+ * simple Template formatter
+ *
+ * @param {string} tpl
+ * @param {Object} param
+ * @param {boolean} [encode=false]
+ * @return {string}
+ */
+function formatTplSimple(tpl, param, encode) {
+    each$1(param, function (value, key) {
+        tpl = tpl.replace(
+            '{' + key + '}',
+            encode ? encodeHTML(value) : value
+        );
+    });
+    return tpl;
+}
+
+/**
+ * @param {Object|string} [opt] If string, means color.
+ * @param {string} [opt.color]
+ * @param {string} [opt.extraCssText]
+ * @param {string} [opt.type='item'] 'item' or 'subItem'
+ * @return {string}
+ */
+function getTooltipMarker(opt, extraCssText) {
+    opt = isString(opt) ? {color: opt, extraCssText: extraCssText} : (opt || {});
+    var color = opt.color;
+    var type = opt.type;
+    var extraCssText = opt.extraCssText;
+
+    if (!color) {
+        return '';
+    }
+
+    return type === 'subItem'
+        ? '<span style="display:inline-block;vertical-align:middle;margin-right:8px;margin-left:3px;'
+            + 'border-radius:4px;width:4px;height:4px;background-color:'
+            + encodeHTML(color) + ';' + (extraCssText || '') + '"></span>'
+        : '<span style="display:inline-block;margin-right:5px;'
+            + 'border-radius:10px;width:10px;height:10px;background-color:'
+            + encodeHTML(color) + ';' + (extraCssText || '') + '"></span>';
+}
+
+function pad(str, len) {
+    str += '';
+    return '0000'.substr(0, len - str.length) + str;
+}
+
+
+/**
+ * ISO Date format
+ * @param {string} tpl
+ * @param {number} value
+ * @param {boolean} [isUTC=false] Default in local time.
+ *           see `module:echarts/scale/Time`
+ *           and `module:echarts/util/number#parseDate`.
+ * @inner
+ */
+function formatTime(tpl, value, isUTC) {
+    if (tpl === 'week'
+        || tpl === 'month'
+        || tpl === 'quarter'
+        || tpl === 'half-year'
+        || tpl === 'year'
+    ) {
+        tpl = 'MM-dd\nyyyy';
+    }
+
+    var date = parseDate(value);
+    var utc = isUTC ? 'UTC' : '';
+    var y = date['get' + utc + 'FullYear']();
+    var M = date['get' + utc + 'Month']() + 1;
+    var d = date['get' + utc + 'Date']();
+    var h = date['get' + utc + 'Hours']();
+    var m = date['get' + utc + 'Minutes']();
+    var s = date['get' + utc + 'Seconds']();
+    var S = date['get' + utc + 'Milliseconds']();
+
+    tpl = tpl.replace('MM', pad(M, 2))
+        .replace('M', M)
+        .replace('yyyy', y)
+        .replace('yy', y % 100)
+        .replace('dd', pad(d, 2))
+        .replace('d', d)
+        .replace('hh', pad(h, 2))
+        .replace('h', h)
+        .replace('mm', pad(m, 2))
+        .replace('m', m)
+        .replace('ss', pad(s, 2))
+        .replace('s', s)
+        .replace('SSS', pad(S, 3));
+
+    return tpl;
+}
+
+/**
+ * Capital first
+ * @param {string} str
+ * @return {string}
+ */
+function capitalFirst(str) {
+    return str ? str.charAt(0).toUpperCase() + str.substr(1) : str;
+}
+
+var truncateText$1 = truncateText;
+
+var getTextRect = getBoundingRect;
+
+
+var format = (Object.freeze || Object)({
+	addCommas: addCommas,
+	toCamelCase: toCamelCase,
+	normalizeCssArray: normalizeCssArray$1,
+	encodeHTML: encodeHTML,
+	formatTpl: formatTpl,
+	formatTplSimple: formatTplSimple,
+	getTooltipMarker: getTooltipMarker,
+	formatTime: formatTime,
+	capitalFirst: capitalFirst,
+	truncateText: truncateText$1,
+	getTextRect: getTextRect
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Layout helpers for each component positioning
+
+var each$3 = each$1;
+
+/**
+ * @public
+ */
+var LOCATION_PARAMS = [
+    'left', 'right', 'top', 'bottom', 'width', 'height'
+];
+
+/**
+ * @public
+ */
+var HV_NAMES = [
+    ['width', 'left', 'right'],
+    ['height', 'top', 'bottom']
+];
+
+function boxLayout(orient, group, gap, maxWidth, maxHeight) {
+    var x = 0;
+    var y = 0;
+
+    if (maxWidth == null) {
+        maxWidth = Infinity;
+    }
+    if (maxHeight == null) {
+        maxHeight = Infinity;
+    }
+    var currentLineMaxSize = 0;
+
+    group.eachChild(function (child, idx) {
+        var position = child.position;
+        var rect = child.getBoundingRect();
+        var nextChild = group.childAt(idx + 1);
+        var nextChildRect = nextChild && nextChild.getBoundingRect();
+        var nextX;
+        var nextY;
+
+        if (orient === 'horizontal') {
+            var moveX = rect.width + (nextChildRect ? (-nextChildRect.x + rect.x) : 0);
+            nextX = x + moveX;
+            // Wrap when width exceeds maxWidth or meet a `newline` group
+            // FIXME compare before adding gap?
+            if (nextX > maxWidth || child.newline) {
+                x = 0;
+                nextX = moveX;
+                y += currentLineMaxSize + gap;
+                currentLineMaxSize = rect.height;
+            }
+            else {
+                // FIXME: consider rect.y is not `0`?
+                currentLineMaxSize = Math.max(currentLineMaxSize, rect.height);
+            }
+        }
+        else {
+            var moveY = rect.height + (nextChildRect ? (-nextChildRect.y + rect.y) : 0);
+            nextY = y + moveY;
+            // Wrap when width exceeds maxHeight or meet a `newline` group
+            if (nextY > maxHeight || child.newline) {
+                x += currentLineMaxSize + gap;
+                y = 0;
+                nextY = moveY;
+                currentLineMaxSize = rect.width;
+            }
+            else {
+                currentLineMaxSize = Math.max(currentLineMaxSize, rect.width);
+            }
+        }
+
+        if (child.newline) {
+            return;
+        }
+
+        position[0] = x;
+        position[1] = y;
+
+        orient === 'horizontal'
+            ? (x = nextX + gap)
+            : (y = nextY + gap);
+    });
+}
+
+/**
+ * VBox or HBox layouting
+ * @param {string} orient
+ * @param {module:zrender/container/Group} group
+ * @param {number} gap
+ * @param {number} [width=Infinity]
+ * @param {number} [height=Infinity]
+ */
+var box = boxLayout;
+
+/**
+ * VBox layouting
+ * @param {module:zrender/container/Group} group
+ * @param {number} gap
+ * @param {number} [width=Infinity]
+ * @param {number} [height=Infinity]
+ */
+var vbox = curry(boxLayout, 'vertical');
+
+/**
+ * HBox layouting
+ * @param {module:zrender/container/Group} group
+ * @param {number} gap
+ * @param {number} [width=Infinity]
+ * @param {number} [height=Infinity]
+ */
+var hbox = curry(boxLayout, 'horizontal');
+
+/**
+ * If x or x2 is not specified or 'center' 'left' 'right',
+ * the width would be as long as possible.
+ * If y or y2 is not specified or 'middle' 'top' 'bottom',
+ * the height would be as long as possible.
+ *
+ * @param {Object} positionInfo
+ * @param {number|string} [positionInfo.x]
+ * @param {number|string} [positionInfo.y]
+ * @param {number|string} [positionInfo.x2]
+ * @param {number|string} [positionInfo.y2]
+ * @param {Object} containerRect {width, height}
+ * @param {string|number} margin
+ * @return {Object} {width, height}
+ */
+function getAvailableSize(positionInfo, containerRect, margin) {
+    var containerWidth = containerRect.width;
+    var containerHeight = containerRect.height;
+
+    var x = parsePercent$1(positionInfo.x, containerWidth);
+    var y = parsePercent$1(positionInfo.y, containerHeight);
+    var x2 = parsePercent$1(positionInfo.x2, containerWidth);
+    var y2 = parsePercent$1(positionInfo.y2, containerHeight);
+
+    (isNaN(x) || isNaN(parseFloat(positionInfo.x))) && (x = 0);
+    (isNaN(x2) || isNaN(parseFloat(positionInfo.x2))) && (x2 = containerWidth);
+    (isNaN(y) || isNaN(parseFloat(positionInfo.y))) && (y = 0);
+    (isNaN(y2) || isNaN(parseFloat(positionInfo.y2))) && (y2 = containerHeight);
+
+    margin = normalizeCssArray$1(margin || 0);
+
+    return {
+        width: Math.max(x2 - x - margin[1] - margin[3], 0),
+        height: Math.max(y2 - y - margin[0] - margin[2], 0)
+    };
+}
+
+/**
+ * Parse position info.
+ *
+ * @param {Object} positionInfo
+ * @param {number|string} [positionInfo.left]
+ * @param {number|string} [positionInfo.top]
+ * @param {number|string} [positionInfo.right]
+ * @param {number|string} [positionInfo.bottom]
+ * @param {number|string} [positionInfo.width]
+ * @param {number|string} [positionInfo.height]
+ * @param {number|string} [positionInfo.aspect] Aspect is width / height
+ * @param {Object} containerRect
+ * @param {string|number} [margin]
+ *
+ * @return {module:zrender/core/BoundingRect}
+ */
+function getLayoutRect(
+    positionInfo, containerRect, margin
+) {
+    margin = normalizeCssArray$1(margin || 0);
+
+    var containerWidth = containerRect.width;
+    var containerHeight = containerRect.height;
+
+    var left = parsePercent$1(positionInfo.left, containerWidth);
+    var top = parsePercent$1(positionInfo.top, containerHeight);
+    var right = parsePercent$1(positionInfo.right, containerWidth);
+    var bottom = parsePercent$1(positionInfo.bottom, containerHeight);
+    var width = parsePercent$1(positionInfo.width, containerWidth);
+    var height = parsePercent$1(positionInfo.height, containerHeight);
+
+    var verticalMargin = margin[2] + margin[0];
+    var horizontalMargin = margin[1] + margin[3];
+    var aspect = positionInfo.aspect;
+
+    // If width is not specified, calculate width from left and right
+    if (isNaN(width)) {
+        width = containerWidth - right - horizontalMargin - left;
+    }
+    if (isNaN(height)) {
+        height = containerHeight - bottom - verticalMargin - top;
+    }
+
+    if (aspect != null) {
+        // If width and height are not given
+        // 1. Graph should not exceeds the container
+        // 2. Aspect must be keeped
+        // 3. Graph should take the space as more as possible
+        // FIXME
+        // Margin is not considered, because there is no case that both
+        // using margin and aspect so far.
+        if (isNaN(width) && isNaN(height)) {
+            if (aspect > containerWidth / containerHeight) {
+                width = containerWidth * 0.8;
+            }
+            else {
+                height = containerHeight * 0.8;
+            }
+        }
+
+        // Calculate width or height with given aspect
+        if (isNaN(width)) {
+            width = aspect * height;
+        }
+        if (isNaN(height)) {
+            height = width / aspect;
+        }
+    }
+
+    // If left is not specified, calculate left from right and width
+    if (isNaN(left)) {
+        left = containerWidth - right - width - horizontalMargin;
+    }
+    if (isNaN(top)) {
+        top = containerHeight - bottom - height - verticalMargin;
+    }
+
+    // Align left and top
+    switch (positionInfo.left || positionInfo.right) {
+        case 'center':
+            left = containerWidth / 2 - width / 2 - margin[3];
+            break;
+        case 'right':
+            left = containerWidth - width - horizontalMargin;
+            break;
+    }
+    switch (positionInfo.top || positionInfo.bottom) {
+        case 'middle':
+        case 'center':
+            top = containerHeight / 2 - height / 2 - margin[0];
+            break;
+        case 'bottom':
+            top = containerHeight - height - verticalMargin;
+            break;
+    }
+    // If something is wrong and left, top, width, height are calculated as NaN
+    left = left || 0;
+    top = top || 0;
+    if (isNaN(width)) {
+        // Width may be NaN if only one value is given except width
+        width = containerWidth - horizontalMargin - left - (right || 0);
+    }
+    if (isNaN(height)) {
+        // Height may be NaN if only one value is given except height
+        height = containerHeight - verticalMargin - top - (bottom || 0);
+    }
+
+    var rect = new BoundingRect(left + margin[3], top + margin[0], width, height);
+    rect.margin = margin;
+    return rect;
+}
+
+
+/**
+ * Position a zr element in viewport
+ *  Group position is specified by either
+ *  {left, top}, {right, bottom}
+ *  If all properties exists, right and bottom will be igonred.
+ *
+ * Logic:
+ *     1. Scale (against origin point in parent coord)
+ *     2. Rotate (against origin point in parent coord)
+ *     3. Traslate (with el.position by this method)
+ * So this method only fixes the last step 'Traslate', which does not affect
+ * scaling and rotating.
+ *
+ * If be called repeatly with the same input el, the same result will be gotten.
+ *
+ * @param {module:zrender/Element} el Should have `getBoundingRect` method.
+ * @param {Object} positionInfo
+ * @param {number|string} [positionInfo.left]
+ * @param {number|string} [positionInfo.top]
+ * @param {number|string} [positionInfo.right]
+ * @param {number|string} [positionInfo.bottom]
+ * @param {number|string} [positionInfo.width] Only for opt.boundingModel: 'raw'
+ * @param {number|string} [positionInfo.height] Only for opt.boundingModel: 'raw'
+ * @param {Object} containerRect
+ * @param {string|number} margin
+ * @param {Object} [opt]
+ * @param {Array.<number>} [opt.hv=[1,1]] Only horizontal or only vertical.
+ * @param {Array.<number>} [opt.boundingMode='all']
+ *        Specify how to calculate boundingRect when locating.
+ *        'all': Position the boundingRect that is transformed and uioned
+ *               both itself and its descendants.
+ *               This mode simplies confine the elements in the bounding
+ *               of their container (e.g., using 'right: 0').
+ *        'raw': Position the boundingRect that is not transformed and only itself.
+ *               This mode is useful when you want a element can overflow its
+ *               container. (Consider a rotated circle needs to be located in a corner.)
+ *               In this mode positionInfo.width/height can only be number.
+ */
+function positionElement(el, positionInfo, containerRect, margin, opt) {
+    var h = !opt || !opt.hv || opt.hv[0];
+    var v = !opt || !opt.hv || opt.hv[1];
+    var boundingMode = opt && opt.boundingMode || 'all';
+
+    if (!h && !v) {
+        return;
+    }
+
+    var rect;
+    if (boundingMode === 'raw') {
+        rect = el.type === 'group'
+            ? new BoundingRect(0, 0, +positionInfo.width || 0, +positionInfo.height || 0)
+            : el.getBoundingRect();
+    }
+    else {
+        rect = el.getBoundingRect();
+        if (el.needLocalTransform()) {
+            var transform = el.getLocalTransform();
+            // Notice: raw rect may be inner object of el,
+            // which should not be modified.
+            rect = rect.clone();
+            rect.applyTransform(transform);
+        }
+    }
+
+    // The real width and height can not be specified but calculated by the given el.
+    positionInfo = getLayoutRect(
+        defaults(
+            {width: rect.width, height: rect.height},
+            positionInfo
+        ),
+        containerRect,
+        margin
+    );
+
+    // Because 'tranlate' is the last step in transform
+    // (see zrender/core/Transformable#getLocalTransform),
+    // we can just only modify el.position to get final result.
+    var elPos = el.position;
+    var dx = h ? positionInfo.x - rect.x : 0;
+    var dy = v ? positionInfo.y - rect.y : 0;
+
+    el.attr('position', boundingMode === 'raw' ? [dx, dy] : [elPos[0] + dx, elPos[1] + dy]);
+}
+
+/**
+ * @param {Object} option Contains some of the properties in HV_NAMES.
+ * @param {number} hvIdx 0: horizontal; 1: vertical.
+ */
+function sizeCalculable(option, hvIdx) {
+    return option[HV_NAMES[hvIdx][0]] != null
+        || (option[HV_NAMES[hvIdx][1]] != null && option[HV_NAMES[hvIdx][2]] != null);
+}
+
+/**
+ * Consider Case:
+ * When defulat option has {left: 0, width: 100}, and we set {right: 0}
+ * through setOption or media query, using normal zrUtil.merge will cause
+ * {right: 0} does not take effect.
+ *
+ * @example
+ * ComponentModel.extend({
+ *     init: function () {
+ *         ...
+ *         var inputPositionParams = layout.getLayoutParams(option);
+ *         this.mergeOption(inputPositionParams);
+ *     },
+ *     mergeOption: function (newOption) {
+ *         newOption && zrUtil.merge(thisOption, newOption, true);
+ *         layout.mergeLayoutParam(thisOption, newOption);
+ *     }
+ * });
+ *
+ * @param {Object} targetOption
+ * @param {Object} newOption
+ * @param {Object|string} [opt]
+ * @param {boolean|Array.<boolean>} [opt.ignoreSize=false] Used for the components
+ *  that width (or height) should not be calculated by left and right (or top and bottom).
+ */
+function mergeLayoutParam(targetOption, newOption, opt) {
+    !isObject$1(opt) && (opt = {});
+
+    var ignoreSize = opt.ignoreSize;
+    !isArray(ignoreSize) && (ignoreSize = [ignoreSize, ignoreSize]);
+
+    var hResult = merge$$1(HV_NAMES[0], 0);
+    var vResult = merge$$1(HV_NAMES[1], 1);
+
+    copy(HV_NAMES[0], targetOption, hResult);
+    copy(HV_NAMES[1], targetOption, vResult);
+
+    function merge$$1(names, hvIdx) {
+        var newParams = {};
+        var newValueCount = 0;
+        var merged = {};
+        var mergedValueCount = 0;
+        var enoughParamNumber = 2;
+
+        each$3(names, function (name) {
+            merged[name] = targetOption[name];
+        });
+        each$3(names, function (name) {
+            // Consider case: newOption.width is null, which is
+            // set by user for removing width setting.
+            hasProp(newOption, name) && (newParams[name] = merged[name] = newOption[name]);
+            hasValue(newParams, name) && newValueCount++;
+            hasValue(merged, name) && mergedValueCount++;
+        });
+
+        if (ignoreSize[hvIdx]) {
+            // Only one of left/right is premitted to exist.
+            if (hasValue(newOption, names[1])) {
+                merged[names[2]] = null;
+            }
+            else if (hasValue(newOption, names[2])) {
+                merged[names[1]] = null;
+            }
+            return merged;
+        }
+
+        // Case: newOption: {width: ..., right: ...},
+        // or targetOption: {right: ...} and newOption: {width: ...},
+        // There is no conflict when merged only has params count
+        // little than enoughParamNumber.
+        if (mergedValueCount === enoughParamNumber || !newValueCount) {
+            return merged;
+        }
+        // Case: newOption: {width: ..., right: ...},
+        // Than we can make sure user only want those two, and ignore
+        // all origin params in targetOption.
+        else if (newValueCount >= enoughParamNumber) {
+            return newParams;
+        }
+        else {
+            // Chose another param from targetOption by priority.
+            for (var i = 0; i < names.length; i++) {
+                var name = names[i];
+                if (!hasProp(newParams, name) && hasProp(targetOption, name)) {
+                    newParams[name] = targetOption[name];
+                    break;
+                }
+            }
+            return newParams;
+        }
+    }
+
+    function hasProp(obj, name) {
+        return obj.hasOwnProperty(name);
+    }
+
+    function hasValue(obj, name) {
+        return obj[name] != null && obj[name] !== 'auto';
+    }
+
+    function copy(names, target, source) {
+        each$3(names, function (name) {
+            target[name] = source[name];
+        });
+    }
+}
+
+/**
+ * Retrieve 'left', 'right', 'top', 'bottom', 'width', 'height' from object.
+ * @param {Object} source
+ * @return {Object} Result contains those props.
+ */
+function getLayoutParams(source) {
+    return copyLayoutParams({}, source);
+}
+
+/**
+ * Retrieve 'left', 'right', 'top', 'bottom', 'width', 'height' from object.
+ * @param {Object} source
+ * @return {Object} Result contains those props.
+ */
+function copyLayoutParams(target, source) {
+    source && target && each$3(LOCATION_PARAMS, function (name) {
+        source.hasOwnProperty(name) && (target[name] = source[name]);
+    });
+    return target;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var boxLayoutMixin = {
+    getBoxLayoutParams: function () {
+        return {
+            left: this.get('left'),
+            top: this.get('top'),
+            right: this.get('right'),
+            bottom: this.get('bottom'),
+            width: this.get('width'),
+            height: this.get('height')
+        };
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Component model
+ *
+ * @module echarts/model/Component
+ */
+
+var inner$1 = makeInner();
+
+/**
+ * @alias module:echarts/model/Component
+ * @constructor
+ * @param {Object} option
+ * @param {module:echarts/model/Model} parentModel
+ * @param {module:echarts/model/Model} ecModel
+ */
+var ComponentModel = Model.extend({
+
+    type: 'component',
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    id: '',
+
+    /**
+     * Because simplified concept is probably better, series.name (or component.name)
+     * has been having too many resposibilities:
+     * (1) Generating id (which requires name in option should not be modified).
+     * (2) As an index to mapping series when merging option or calling API (a name
+     * can refer to more then one components, which is convinient is some case).
+     * (3) Display.
+     * @readOnly
+     */
+    name: '',
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    mainType: '',
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    subType: '',
+
+    /**
+     * @readOnly
+     * @type {number}
+     */
+    componentIndex: 0,
+
+    /**
+     * @type {Object}
+     * @protected
+     */
+    defaultOption: null,
+
+    /**
+     * @type {module:echarts/model/Global}
+     * @readOnly
+     */
+    ecModel: null,
+
+    /**
+     * key: componentType
+     * value:  Component model list, can not be null.
+     * @type {Object.<string, Array.<module:echarts/model/Model>>}
+     * @readOnly
+     */
+    dependentModels: [],
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    uid: null,
+
+    /**
+     * Support merge layout params.
+     * Only support 'box' now (left/right/top/bottom/width/height).
+     * @type {string|Object} Object can be {ignoreSize: true}
+     * @readOnly
+     */
+    layoutMode: null,
+
+    $constructor: function (option, parentModel, ecModel, extraOpt) {
+        Model.call(this, option, parentModel, ecModel, extraOpt);
+
+        this.uid = getUID('ec_cpt_model');
+    },
+
+    init: function (option, parentModel, ecModel, extraOpt) {
+        this.mergeDefaultAndTheme(option, ecModel);
+    },
+
+    mergeDefaultAndTheme: function (option, ecModel) {
+        var layoutMode = this.layoutMode;
+        var inputPositionParams = layoutMode
+            ? getLayoutParams(option) : {};
+
+        var themeModel = ecModel.getTheme();
+        merge(option, themeModel.get(this.mainType));
+        merge(option, this.getDefaultOption());
+
+        if (layoutMode) {
+            mergeLayoutParam(option, inputPositionParams, layoutMode);
+        }
+    },
+
+    mergeOption: function (option, extraOpt) {
+        merge(this.option, option, true);
+
+        var layoutMode = this.layoutMode;
+        if (layoutMode) {
+            mergeLayoutParam(this.option, option, layoutMode);
+        }
+    },
+
+    // Hooker after init or mergeOption
+    optionUpdated: function (newCptOption, isInit) {},
+
+    getDefaultOption: function () {
+        var fields = inner$1(this);
+        if (!fields.defaultOption) {
+            var optList = [];
+            var Class = this.constructor;
+            while (Class) {
+                var opt = Class.prototype.defaultOption;
+                opt && optList.push(opt);
+                Class = Class.superClass;
+            }
+
+            var defaultOption = {};
+            for (var i = optList.length - 1; i >= 0; i--) {
+                defaultOption = merge(defaultOption, optList[i], true);
+            }
+            fields.defaultOption = defaultOption;
+        }
+        return fields.defaultOption;
+    },
+
+    getReferringComponents: function (mainType) {
+        return this.ecModel.queryComponents({
+            mainType: mainType,
+            index: this.get(mainType + 'Index', true),
+            id: this.get(mainType + 'Id', true)
+        });
+    }
+
+});
+
+// Reset ComponentModel.extend, add preConstruct.
+// clazzUtil.enableClassExtend(
+//     ComponentModel,
+//     function (option, parentModel, ecModel, extraOpt) {
+//         // Set dependentModels, componentIndex, name, id, mainType, subType.
+//         zrUtil.extend(this, extraOpt);
+
+//         this.uid = componentUtil.getUID('componentModel');
+
+//         // this.setReadOnly([
+//         //     'type', 'id', 'uid', 'name', 'mainType', 'subType',
+//         //     'dependentModels', 'componentIndex'
+//         // ]);
+//     }
+// );
+
+// Add capability of registerClass, getClass, hasClass, registerSubTypeDefaulter and so on.
+enableClassManagement(
+    ComponentModel, {registerWhenExtend: true}
+);
+enableSubTypeDefaulter(ComponentModel);
+
+// Add capability of ComponentModel.topologicalTravel.
+enableTopologicalTravel(ComponentModel, getDependencies);
+
+function getDependencies(componentType) {
+    var deps = [];
+    each$1(ComponentModel.getClassesByMainType(componentType), function (Clazz) {
+        deps = deps.concat(Clazz.prototype.dependencies || []);
+    });
+
+    // Ensure main type.
+    deps = map(deps, function (type) {
+        return parseClassType$1(type).main;
+    });
+
+    // Hack dataset for convenience.
+    if (componentType !== 'dataset' && indexOf(deps, 'dataset') <= 0) {
+        deps.unshift('dataset');
+    }
+
+    return deps;
+}
+
+mixin(ComponentModel, boxLayoutMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var platform = '';
+// Navigator not exists in node
+if (typeof navigator !== 'undefined') {
+    platform = navigator.platform || '';
+}
+
+var globalDefault = {
+    // backgroundColor: 'rgba(0,0,0,0)',
+
+    // https://dribbble.com/shots/1065960-Infographic-Pie-chart-visualization
+    // color: ['#5793f3', '#d14a61', '#fd9c35', '#675bba', '#fec42c', '#dd4444', '#d4df5a', '#cd4870'],
+    // Light colors:
+    // color: ['#bcd3bb', '#e88f70', '#edc1a5', '#9dc5c8', '#e1e8c8', '#7b7c68', '#e5b5b5', '#f0b489', '#928ea8', '#bda29a'],
+    // color: ['#cc5664', '#9bd6ec', '#ea946e', '#8acaaa', '#f1ec64', '#ee8686', '#a48dc1', '#5da6bc', '#b9dcae'],
+    // Dark colors:
+    color: ['#c23531','#2f4554', '#61a0a8', '#d48265', '#91c7ae','#749f83',  '#ca8622', '#bda29a','#6e7074', '#546570', '#c4ccd3'],
+
+    gradientColor: ['#f6efa6', '#d88273', '#bf444c'],
+
+    // If xAxis and yAxis declared, grid is created by default.
+    // grid: {},
+
+    textStyle: {
+        // color: '#000',
+        // decoration: 'none',
+        // PENDING
+        fontFamily: platform.match(/^Win/) ? 'Microsoft YaHei' : 'sans-serif',
+        // fontFamily: 'Arial, Verdana, sans-serif',
+        fontSize: 12,
+        fontStyle: 'normal',
+        fontWeight: 'normal'
+    },
+
+    // http://blogs.adobe.com/webplatform/2014/02/24/using-blend-modes-in-html-canvas/
+    // https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation
+    // Default is source-over
+    blendMode: null,
+
+    animation: 'auto',
+    animationDuration: 1000,
+    animationDurationUpdate: 300,
+    animationEasing: 'exponentialOut',
+    animationEasingUpdate: 'cubicOut',
+
+    animationThreshold: 2000,
+    // Configuration for progressive/incremental rendering
+    progressiveThreshold: 3000,
+    progressive: 400,
+
+    // Threshold of if use single hover layer to optimize.
+    // It is recommended that `hoverLayerThreshold` is equivalent to or less than
+    // `progressiveThreshold`, otherwise hover will cause restart of progressive,
+    // which is unexpected.
+    // see example <echarts/test/heatmap-large.html>.
+    hoverLayerThreshold: 3000,
+
+    // See: module:echarts/scale/Time
+    useUTC: false
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$2 = makeInner();
+
+function getNearestColorPalette(colors, requestColorNum) {
+    var paletteNum = colors.length;
+    // TODO colors must be in order
+    for (var i = 0; i < paletteNum; i++) {
+        if (colors[i].length > requestColorNum) {
+            return colors[i];
+        }
+    }
+    return colors[paletteNum - 1];
+}
+
+var colorPaletteMixin = {
+    clearColorPalette: function () {
+        inner$2(this).colorIdx = 0;
+        inner$2(this).colorNameMap = {};
+    },
+
+    /**
+     * @param {string} name MUST NOT be null/undefined. Otherwise call this function
+     *                 twise with the same parameters will get different result.
+     * @param {Object} [scope=this]
+     * @param {Object} [requestColorNum]
+     * @return {string} color string.
+     */
+    getColorFromPalette: function (name, scope, requestColorNum) {
+        scope = scope || this;
+        var scopeFields = inner$2(scope);
+        var colorIdx = scopeFields.colorIdx || 0;
+        var colorNameMap = scopeFields.colorNameMap = scopeFields.colorNameMap || {};
+        // Use `hasOwnProperty` to avoid conflict with Object.prototype.
+        if (colorNameMap.hasOwnProperty(name)) {
+            return colorNameMap[name];
+        }
+        var defaultColorPalette = normalizeToArray(this.get('color', true));
+        var layeredColorPalette = this.get('colorLayer', true);
+        var colorPalette = ((requestColorNum == null || !layeredColorPalette)
+            ? defaultColorPalette : getNearestColorPalette(layeredColorPalette, requestColorNum));
+
+        // In case can't find in layered color palette.
+        colorPalette = colorPalette || defaultColorPalette;
+
+        if (!colorPalette || !colorPalette.length) {
+            return;
+        }
+
+        var color = colorPalette[colorIdx];
+        if (name) {
+            colorNameMap[name] = color;
+        }
+        scopeFields.colorIdx = (colorIdx + 1) % colorPalette.length;
+
+        return color;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Helper for model references.
+ * There are many manners to refer axis/coordSys.
+ */
+
+// TODO
+// merge relevant logic to this file?
+// check: "modelHelper" of tooltip and "BrushTargetManager".
+
+/**
+ * @return {Object} For example:
+ * {
+ *     coordSysName: 'cartesian2d',
+ *     coordSysDims: ['x', 'y', ...],
+ *     axisMap: HashMap({
+ *         x: xAxisModel,
+ *         y: yAxisModel
+ *     }),
+ *     categoryAxisMap: HashMap({
+ *         x: xAxisModel,
+ *         y: undefined
+ *     }),
+ *     // It also indicate that whether there is category axis.
+ *     firstCategoryDimIndex: 1,
+ *     // To replace user specified encode.
+ * }
+ */
+function getCoordSysDefineBySeries(seriesModel) {
+    var coordSysName = seriesModel.get('coordinateSystem');
+    var result = {
+        coordSysName: coordSysName,
+        coordSysDims: [],
+        axisMap: createHashMap(),
+        categoryAxisMap: createHashMap()
+    };
+    var fetch = fetchers[coordSysName];
+    if (fetch) {
+        fetch(seriesModel, result, result.axisMap, result.categoryAxisMap);
+        return result;
+    }
+}
+
+var fetchers = {
+
+    cartesian2d: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var xAxisModel = seriesModel.getReferringComponents('xAxis')[0];
+        var yAxisModel = seriesModel.getReferringComponents('yAxis')[0];
+
+        if (__DEV__) {
+            if (!xAxisModel) {
+                throw new Error('xAxis "' + retrieve(
+                    seriesModel.get('xAxisIndex'),
+                    seriesModel.get('xAxisId'),
+                    0
+                ) + '" not found');
+            }
+            if (!yAxisModel) {
+                throw new Error('yAxis "' + retrieve(
+                    seriesModel.get('xAxisIndex'),
+                    seriesModel.get('yAxisId'),
+                    0
+                ) + '" not found');
+            }
+        }
+
+        result.coordSysDims = ['x', 'y'];
+        axisMap.set('x', xAxisModel);
+        axisMap.set('y', yAxisModel);
+
+        if (isCategory(xAxisModel)) {
+            categoryAxisMap.set('x', xAxisModel);
+            result.firstCategoryDimIndex = 0;
+        }
+        if (isCategory(yAxisModel)) {
+            categoryAxisMap.set('y', yAxisModel);
+            result.firstCategoryDimIndex = 1;
+        }
+    },
+
+    singleAxis: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var singleAxisModel = seriesModel.getReferringComponents('singleAxis')[0];
+
+        if (__DEV__) {
+            if (!singleAxisModel) {
+                throw new Error('singleAxis should be specified.');
+            }
+        }
+
+        result.coordSysDims = ['single'];
+        axisMap.set('single', singleAxisModel);
+
+        if (isCategory(singleAxisModel)) {
+            categoryAxisMap.set('single', singleAxisModel);
+            result.firstCategoryDimIndex = 0;
+        }
+    },
+
+    polar: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var polarModel = seriesModel.getReferringComponents('polar')[0];
+        var radiusAxisModel = polarModel.findAxisModel('radiusAxis');
+        var angleAxisModel = polarModel.findAxisModel('angleAxis');
+
+        if (__DEV__) {
+            if (!angleAxisModel) {
+                throw new Error('angleAxis option not found');
+            }
+            if (!radiusAxisModel) {
+                throw new Error('radiusAxis option not found');
+            }
+        }
+
+        result.coordSysDims = ['radius', 'angle'];
+        axisMap.set('radius', radiusAxisModel);
+        axisMap.set('angle', angleAxisModel);
+
+        if (isCategory(radiusAxisModel)) {
+            categoryAxisMap.set('radius', radiusAxisModel);
+            result.firstCategoryDimIndex = 0;
+        }
+        if (isCategory(angleAxisModel)) {
+            categoryAxisMap.set('angle', angleAxisModel);
+            result.firstCategoryDimIndex = 1;
+        }
+    },
+
+    geo: function (seriesModel, result, axisMap, categoryAxisMap) {
+        result.coordSysDims = ['lng', 'lat'];
+    },
+
+    parallel: function (seriesModel, result, axisMap, categoryAxisMap) {
+        var ecModel = seriesModel.ecModel;
+        var parallelModel = ecModel.getComponent(
+            'parallel', seriesModel.get('parallelIndex')
+        );
+        var coordSysDims = result.coordSysDims = parallelModel.dimensions.slice();
+
+        each$1(parallelModel.parallelAxisIndex, function (axisIndex, index) {
+            var axisModel = ecModel.getComponent('parallelAxis', axisIndex);
+            var axisDim = coordSysDims[index];
+            axisMap.set(axisDim, axisModel);
+
+            if (isCategory(axisModel) && result.firstCategoryDimIndex == null) {
+                categoryAxisMap.set(axisDim, axisModel);
+                result.firstCategoryDimIndex = index;
+            }
+        });
+    }
+};
+
+function isCategory(axisModel) {
+    return axisModel.get('type') === 'category';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Avoid typo.
+var SOURCE_FORMAT_ORIGINAL = 'original';
+var SOURCE_FORMAT_ARRAY_ROWS = 'arrayRows';
+var SOURCE_FORMAT_OBJECT_ROWS = 'objectRows';
+var SOURCE_FORMAT_KEYED_COLUMNS = 'keyedColumns';
+var SOURCE_FORMAT_UNKNOWN = 'unknown';
+// ??? CHANGE A NAME
+var SOURCE_FORMAT_TYPED_ARRAY = 'typedArray';
+
+var SERIES_LAYOUT_BY_COLUMN = 'column';
+var SERIES_LAYOUT_BY_ROW = 'row';
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * [sourceFormat]
+ *
+ * + "original":
+ * This format is only used in series.data, where
+ * itemStyle can be specified in data item.
+ *
+ * + "arrayRows":
+ * [
+ *     ['product', 'score', 'amount'],
+ *     ['Matcha Latte', 89.3, 95.8],
+ *     ['Milk Tea', 92.1, 89.4],
+ *     ['Cheese Cocoa', 94.4, 91.2],
+ *     ['Walnut Brownie', 85.4, 76.9]
+ * ]
+ *
+ * + "objectRows":
+ * [
+ *     {product: 'Matcha Latte', score: 89.3, amount: 95.8},
+ *     {product: 'Milk Tea', score: 92.1, amount: 89.4},
+ *     {product: 'Cheese Cocoa', score: 94.4, amount: 91.2},
+ *     {product: 'Walnut Brownie', score: 85.4, amount: 76.9}
+ * ]
+ *
+ * + "keyedColumns":
+ * {
+ *     'product': ['Matcha Latte', 'Milk Tea', 'Cheese Cocoa', 'Walnut Brownie'],
+ *     'count': [823, 235, 1042, 988],
+ *     'score': [95.8, 81.4, 91.2, 76.9]
+ * }
+ *
+ * + "typedArray"
+ *
+ * + "unknown"
+ */
+
+/**
+ * @constructor
+ * @param {Object} fields
+ * @param {string} fields.sourceFormat
+ * @param {Array|Object} fields.fromDataset
+ * @param {Array|Object} [fields.data]
+ * @param {string} [seriesLayoutBy='column']
+ * @param {Array.<Object|string>} [dimensionsDefine]
+ * @param {Objet|HashMap} [encodeDefine]
+ * @param {number} [startIndex=0]
+ * @param {number} [dimensionsDetectCount]
+ */
+function Source(fields) {
+
+    /**
+     * @type {boolean}
+     */
+    this.fromDataset = fields.fromDataset;
+
+    /**
+     * Not null/undefined.
+     * @type {Array|Object}
+     */
+    this.data = fields.data || (
+        fields.sourceFormat === SOURCE_FORMAT_KEYED_COLUMNS ? {} : []
+    );
+
+    /**
+     * See also "detectSourceFormat".
+     * Not null/undefined.
+     * @type {string}
+     */
+    this.sourceFormat = fields.sourceFormat || SOURCE_FORMAT_UNKNOWN;
+
+    /**
+     * 'row' or 'column'
+     * Not null/undefined.
+     * @type {string} seriesLayoutBy
+     */
+    this.seriesLayoutBy = fields.seriesLayoutBy || SERIES_LAYOUT_BY_COLUMN;
+
+    /**
+     * dimensions definition in option.
+     * can be null/undefined.
+     * @type {Array.<Object|string>}
+     */
+    this.dimensionsDefine = fields.dimensionsDefine;
+
+    /**
+     * encode definition in option.
+     * can be null/undefined.
+     * @type {Objet|HashMap}
+     */
+    this.encodeDefine = fields.encodeDefine && createHashMap(fields.encodeDefine);
+
+    /**
+     * Not null/undefined, uint.
+     * @type {number}
+     */
+    this.startIndex = fields.startIndex || 0;
+
+    /**
+     * Can be null/undefined (when unknown), uint.
+     * @type {number}
+     */
+    this.dimensionsDetectCount = fields.dimensionsDetectCount;
+}
+
+/**
+ * Wrap original series data for some compatibility cases.
+ */
+Source.seriesDataToSource = function (data) {
+    return new Source({
+        data: data,
+        sourceFormat: isTypedArray(data)
+            ? SOURCE_FORMAT_TYPED_ARRAY
+            : SOURCE_FORMAT_ORIGINAL,
+        fromDataset: false
+    });
+};
+
+enableClassCheck(Source);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$3 = makeInner();
+
+/**
+ * @see {module:echarts/data/Source}
+ * @param {module:echarts/component/dataset/DatasetModel} datasetModel
+ * @return {string} sourceFormat
+ */
+function detectSourceFormat(datasetModel) {
+    var data = datasetModel.option.source;
+    var sourceFormat = SOURCE_FORMAT_UNKNOWN;
+
+    if (isTypedArray(data)) {
+        sourceFormat = SOURCE_FORMAT_TYPED_ARRAY;
+    }
+    else if (isArray(data)) {
+        // FIXME Whether tolerate null in top level array?
+        for (var i = 0, len = data.length; i < len; i++) {
+            var item = data[i];
+
+            if (item == null) {
+                continue;
+            }
+            else if (isArray(item)) {
+                sourceFormat = SOURCE_FORMAT_ARRAY_ROWS;
+                break;
+            }
+            else if (isObject$1(item)) {
+                sourceFormat = SOURCE_FORMAT_OBJECT_ROWS;
+                break;
+            }
+        }
+    }
+    else if (isObject$1(data)) {
+        for (var key in data) {
+            if (data.hasOwnProperty(key) && isArrayLike(data[key])) {
+                sourceFormat = SOURCE_FORMAT_KEYED_COLUMNS;
+                break;
+            }
+        }
+    }
+    else if (data != null) {
+        throw new Error('Invalid data');
+    }
+
+    inner$3(datasetModel).sourceFormat = sourceFormat;
+}
+
+/**
+ * [Scenarios]:
+ * (1) Provide source data directly:
+ *     series: {
+ *         encode: {...},
+ *         dimensions: [...]
+ *         seriesLayoutBy: 'row',
+ *         data: [[...]]
+ *     }
+ * (2) Refer to datasetModel.
+ *     series: [{
+ *         encode: {...}
+ *         // Ignore datasetIndex means `datasetIndex: 0`
+ *         // and the dimensions defination in dataset is used
+ *     }, {
+ *         encode: {...},
+ *         seriesLayoutBy: 'column',
+ *         datasetIndex: 1
+ *     }]
+ *
+ * Get data from series itself or datset.
+ * @return {module:echarts/data/Source} source
+ */
+function getSource(seriesModel) {
+    return inner$3(seriesModel).source;
+}
+
+/**
+ * MUST be called before mergeOption of all series.
+ * @param {module:echarts/model/Global} ecModel
+ */
+function resetSourceDefaulter(ecModel) {
+    // `datasetMap` is used to make default encode.
+    inner$3(ecModel).datasetMap = createHashMap();
+}
+
+/**
+ * [Caution]:
+ * MUST be called after series option merged and
+ * before "series.getInitailData()" called.
+ *
+ * [The rule of making default encode]:
+ * Category axis (if exists) alway map to the first dimension.
+ * Each other axis occupies a subsequent dimension.
+ *
+ * [Why make default encode]:
+ * Simplify the typing of encode in option, avoiding the case like that:
+ * series: [{encode: {x: 0, y: 1}}, {encode: {x: 0, y: 2}}, {encode: {x: 0, y: 3}}],
+ * where the "y" have to be manually typed as "1, 2, 3, ...".
+ *
+ * @param {module:echarts/model/Series} seriesModel
+ */
+function prepareSource(seriesModel) {
+    var seriesOption = seriesModel.option;
+
+    var data = seriesOption.data;
+    var sourceFormat = isTypedArray(data)
+        ? SOURCE_FORMAT_TYPED_ARRAY : SOURCE_FORMAT_ORIGINAL;
+    var fromDataset = false;
+
+    var seriesLayoutBy = seriesOption.seriesLayoutBy;
+    var sourceHeader = seriesOption.sourceHeader;
+    var dimensionsDefine = seriesOption.dimensions;
+
+    var datasetModel = getDatasetModel(seriesModel);
+    if (datasetModel) {
+        var datasetOption = datasetModel.option;
+
+        data = datasetOption.source;
+        sourceFormat = inner$3(datasetModel).sourceFormat;
+        fromDataset = true;
+
+        // These settings from series has higher priority.
+        seriesLayoutBy = seriesLayoutBy || datasetOption.seriesLayoutBy;
+        sourceHeader == null && (sourceHeader = datasetOption.sourceHeader);
+        dimensionsDefine = dimensionsDefine || datasetOption.dimensions;
+    }
+
+    var completeResult = completeBySourceData(
+        data, sourceFormat, seriesLayoutBy, sourceHeader, dimensionsDefine
+    );
+
+    // Note: dataset option does not have `encode`.
+    var encodeDefine = seriesOption.encode;
+    if (!encodeDefine && datasetModel) {
+        encodeDefine = makeDefaultEncode(
+            seriesModel, datasetModel, data, sourceFormat, seriesLayoutBy, completeResult
+        );
+    }
+
+    inner$3(seriesModel).source = new Source({
+        data: data,
+        fromDataset: fromDataset,
+        seriesLayoutBy: seriesLayoutBy,
+        sourceFormat: sourceFormat,
+        dimensionsDefine: completeResult.dimensionsDefine,
+        startIndex: completeResult.startIndex,
+        dimensionsDetectCount: completeResult.dimensionsDetectCount,
+        encodeDefine: encodeDefine
+    });
+}
+
+// return {startIndex, dimensionsDefine, dimensionsCount}
+function completeBySourceData(data, sourceFormat, seriesLayoutBy, sourceHeader, dimensionsDefine) {
+    if (!data) {
+        return {dimensionsDefine: normalizeDimensionsDefine(dimensionsDefine)};
+    }
+
+    var dimensionsDetectCount;
+    var startIndex;
+    var findPotentialName;
+
+    if (sourceFormat === SOURCE_FORMAT_ARRAY_ROWS) {
+        // Rule: Most of the first line are string: it is header.
+        // Caution: consider a line with 5 string and 1 number,
+        // it still can not be sure it is a head, because the
+        // 5 string may be 5 values of category columns.
+        if (sourceHeader === 'auto' || sourceHeader == null) {
+            arrayRowsTravelFirst(function (val) {
+                // '-' is regarded as null/undefined.
+                if (val != null && val !== '-') {
+                    if (isString(val)) {
+                        startIndex == null && (startIndex = 1);
+                    }
+                    else {
+                        startIndex = 0;
+                    }
+                }
+            // 10 is an experience number, avoid long loop.
+            }, seriesLayoutBy, data, 10);
+        }
+        else {
+            startIndex = sourceHeader ? 1 : 0;
+        }
+
+        if (!dimensionsDefine && startIndex === 1) {
+            dimensionsDefine = [];
+            arrayRowsTravelFirst(function (val, index) {
+                dimensionsDefine[index] = val != null ? val : '';
+            }, seriesLayoutBy, data);
+        }
+
+        dimensionsDetectCount = dimensionsDefine
+            ? dimensionsDefine.length
+            : seriesLayoutBy === SERIES_LAYOUT_BY_ROW
+            ? data.length
+            : data[0]
+            ? data[0].length
+            : null;
+    }
+    else if (sourceFormat === SOURCE_FORMAT_OBJECT_ROWS) {
+        if (!dimensionsDefine) {
+            dimensionsDefine = objectRowsCollectDimensions(data);
+            findPotentialName = true;
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_KEYED_COLUMNS) {
+        if (!dimensionsDefine) {
+            dimensionsDefine = [];
+            findPotentialName = true;
+            each$1(data, function (colArr, key) {
+                dimensionsDefine.push(key);
+            });
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_ORIGINAL) {
+        var value0 = getDataItemValue(data[0]);
+        dimensionsDetectCount = isArray(value0) && value0.length || 1;
+    }
+    else if (sourceFormat === SOURCE_FORMAT_TYPED_ARRAY) {
+        if (__DEV__) {
+            assert$1(!!dimensionsDefine, 'dimensions must be given if data is TypedArray.');
+        }
+    }
+
+    var potentialNameDimIndex;
+    if (findPotentialName) {
+        each$1(dimensionsDefine, function (dim, idx) {
+            if ((isObject$1(dim) ? dim.name : dim) === 'name') {
+                potentialNameDimIndex = idx;
+            }
+        });
+    }
+
+    return {
+        startIndex: startIndex,
+        dimensionsDefine: normalizeDimensionsDefine(dimensionsDefine),
+        dimensionsDetectCount: dimensionsDetectCount,
+        potentialNameDimIndex: potentialNameDimIndex
+        // TODO: potentialIdDimIdx
+    };
+}
+
+// Consider dimensions defined like ['A', 'price', 'B', 'price', 'C', 'price'],
+// which is reasonable. But dimension name is duplicated.
+// Returns undefined or an array contains only object without null/undefiend or string.
+function normalizeDimensionsDefine(dimensionsDefine) {
+    if (!dimensionsDefine) {
+        // The meaning of null/undefined is different from empty array.
+        return;
+    }
+    var nameMap = createHashMap();
+    return map(dimensionsDefine, function (item, index) {
+        item = extend({}, isObject$1(item) ? item : {name: item});
+
+        // User can set null in dimensions.
+        // We dont auto specify name, othewise a given name may
+        // cause it be refered unexpectedly.
+        if (item.name == null) {
+            return item;
+        }
+
+        // Also consider number form like 2012.
+        item.name += '';
+        // User may also specify displayName.
+        // displayName will always exists except user not
+        // specified or dim name is not specified or detected.
+        // (A auto generated dim name will not be used as
+        // displayName).
+        if (item.displayName == null) {
+            item.displayName = item.name;
+        }
+
+        var exist = nameMap.get(item.name);
+        if (!exist) {
+            nameMap.set(item.name, {count: 1});
+        }
+        else {
+            item.name += '-' + exist.count++;
+        }
+
+        return item;
+    });
+}
+
+function arrayRowsTravelFirst(cb, seriesLayoutBy, data, maxLoop) {
+    maxLoop == null && (maxLoop = Infinity);
+    if (seriesLayoutBy === SERIES_LAYOUT_BY_ROW) {
+        for (var i = 0; i < data.length && i < maxLoop; i++) {
+            cb(data[i] ? data[i][0] : null, i);
+        }
+    }
+    else {
+        var value0 = data[0] || [];
+        for (var i = 0; i < value0.length && i < maxLoop; i++) {
+            cb(value0[i], i);
+        }
+    }
+}
+
+function objectRowsCollectDimensions(data) {
+    var firstIndex = 0;
+    var obj;
+    while (firstIndex < data.length && !(obj = data[firstIndex++])) {} // jshint ignore: line
+    if (obj) {
+        var dimensions = [];
+        each$1(obj, function (value, key) {
+            dimensions.push(key);
+        });
+        return dimensions;
+    }
+}
+
+// ??? TODO merge to completedimensions, where also has
+// default encode making logic. And the default rule
+// should depends on series? consider 'map'.
+function makeDefaultEncode(
+    seriesModel, datasetModel, data, sourceFormat, seriesLayoutBy, completeResult
+) {
+    var coordSysDefine = getCoordSysDefineBySeries(seriesModel);
+    var encode = {};
+    // var encodeTooltip = [];
+    // var encodeLabel = [];
+    var encodeItemName = [];
+    var encodeSeriesName = [];
+    var seriesType = seriesModel.subType;
+
+    // ??? TODO refactor: provide by series itself.
+    // Consider the case: 'map' series is based on geo coordSys,
+    // 'graph', 'heatmap' can be based on cartesian. But can not
+    // give default rule simply here.
+    var nSeriesMap = createHashMap(['pie', 'map', 'funnel']);
+    var cSeriesMap = createHashMap([
+        'line', 'bar', 'pictorialBar', 'scatter', 'effectScatter', 'candlestick', 'boxplot'
+    ]);
+
+    // Usually in this case series will use the first data
+    // dimension as the "value" dimension, or other default
+    // processes respectively.
+    if (coordSysDefine && cSeriesMap.get(seriesType) != null) {
+        var ecModel = seriesModel.ecModel;
+        var datasetMap = inner$3(ecModel).datasetMap;
+        var key = datasetModel.uid + '_' + seriesLayoutBy;
+        var datasetRecord = datasetMap.get(key)
+            || datasetMap.set(key, {categoryWayDim: 1, valueWayDim: 0});
+
+        // TODO
+        // Auto detect first time axis and do arrangement.
+        each$1(coordSysDefine.coordSysDims, function (coordDim) {
+            // In value way.
+            if (coordSysDefine.firstCategoryDimIndex == null) {
+                var dataDim = datasetRecord.valueWayDim++;
+                encode[coordDim] = dataDim;
+
+                // ??? TODO give a better default series name rule?
+                // especially when encode x y specified.
+                // consider: when mutiple series share one dimension
+                // category axis, series name should better use
+                // the other dimsion name. On the other hand, use
+                // both dimensions name.
+
+                encodeSeriesName.push(dataDim);
+                // encodeTooltip.push(dataDim);
+                // encodeLabel.push(dataDim);
+            }
+            // In category way, category axis.
+            else if (coordSysDefine.categoryAxisMap.get(coordDim)) {
+                encode[coordDim] = 0;
+                encodeItemName.push(0);
+            }
+            // In category way, non-category axis.
+            else {
+                var dataDim = datasetRecord.categoryWayDim++;
+                encode[coordDim] = dataDim;
+                // encodeTooltip.push(dataDim);
+                // encodeLabel.push(dataDim);
+                encodeSeriesName.push(dataDim);
+            }
+        });
+    }
+    // Do not make a complex rule! Hard to code maintain and not necessary.
+    // ??? TODO refactor: provide by series itself.
+    // [{name: ..., value: ...}, ...] like:
+    else if (nSeriesMap.get(seriesType) != null) {
+        // Find the first not ordinal. (5 is an experience value)
+        var firstNotOrdinal;
+        for (var i = 0; i < 5 && firstNotOrdinal == null; i++) {
+            if (!doGuessOrdinal(
+                data, sourceFormat, seriesLayoutBy,
+                completeResult.dimensionsDefine, completeResult.startIndex, i
+            )) {
+                firstNotOrdinal = i;
+            }
+        }
+        if (firstNotOrdinal != null) {
+            encode.value = firstNotOrdinal;
+            var nameDimIndex = completeResult.potentialNameDimIndex
+                || Math.max(firstNotOrdinal - 1, 0);
+            // By default, label use itemName in charts.
+            // So we dont set encodeLabel here.
+            encodeSeriesName.push(nameDimIndex);
+            encodeItemName.push(nameDimIndex);
+            // encodeTooltip.push(firstNotOrdinal);
+        }
+    }
+
+    // encodeTooltip.length && (encode.tooltip = encodeTooltip);
+    // encodeLabel.length && (encode.label = encodeLabel);
+    encodeItemName.length && (encode.itemName = encodeItemName);
+    encodeSeriesName.length && (encode.seriesName = encodeSeriesName);
+
+    return encode;
+}
+
+/**
+ * If return null/undefined, indicate that should not use datasetModel.
+ */
+function getDatasetModel(seriesModel) {
+    var option = seriesModel.option;
+    // Caution: consider the scenario:
+    // A dataset is declared and a series is not expected to use the dataset,
+    // and at the beginning `setOption({series: { noData })` (just prepare other
+    // option but no data), then `setOption({series: {data: [...]}); In this case,
+    // the user should set an empty array to avoid that dataset is used by default.
+    var thisData = option.data;
+    if (!thisData) {
+        return seriesModel.ecModel.getComponent('dataset', option.datasetIndex || 0);
+    }
+}
+
+/**
+ * The rule should not be complex, otherwise user might not
+ * be able to known where the data is wrong.
+ * The code is ugly, but how to make it neat?
+ *
+ * @param {module:echars/data/Source} source
+ * @param {number} dimIndex
+ * @return {boolean} Whether ordinal.
+ */
+function guessOrdinal(source, dimIndex) {
+    return doGuessOrdinal(
+        source.data,
+        source.sourceFormat,
+        source.seriesLayoutBy,
+        source.dimensionsDefine,
+        source.startIndex,
+        dimIndex
+    );
+}
+
+// dimIndex may be overflow source data.
+function doGuessOrdinal(
+    data, sourceFormat, seriesLayoutBy, dimensionsDefine, startIndex, dimIndex
+) {
+    var result;
+    // Experience value.
+    var maxLoop = 5;
+
+    if (isTypedArray(data)) {
+        return false;
+    }
+
+    // When sourceType is 'objectRows' or 'keyedColumns', dimensionsDefine
+    // always exists in source.
+    var dimName;
+    if (dimensionsDefine) {
+        dimName = dimensionsDefine[dimIndex];
+        dimName = isObject$1(dimName) ? dimName.name : dimName;
+    }
+
+    if (sourceFormat === SOURCE_FORMAT_ARRAY_ROWS) {
+        if (seriesLayoutBy === SERIES_LAYOUT_BY_ROW) {
+            var sample = data[dimIndex];
+            for (var i = 0; i < (sample || []).length && i < maxLoop; i++) {
+                if ((result = detectValue(sample[startIndex + i])) != null) {
+                    return result;
+                }
+            }
+        }
+        else {
+            for (var i = 0; i < data.length && i < maxLoop; i++) {
+                var row = data[startIndex + i];
+                if (row && (result = detectValue(row[dimIndex])) != null) {
+                    return result;
+                }
+            }
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_OBJECT_ROWS) {
+        if (!dimName) {
+            return;
+        }
+        for (var i = 0; i < data.length && i < maxLoop; i++) {
+            var item = data[i];
+            if (item && (result = detectValue(item[dimName])) != null) {
+                return result;
+            }
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_KEYED_COLUMNS) {
+        if (!dimName) {
+            return;
+        }
+        var sample = data[dimName];
+        if (!sample || isTypedArray(sample)) {
+            return false;
+        }
+        for (var i = 0; i < sample.length && i < maxLoop; i++) {
+            if ((result = detectValue(sample[i])) != null) {
+                return result;
+            }
+        }
+    }
+    else if (sourceFormat === SOURCE_FORMAT_ORIGINAL) {
+        for (var i = 0; i < data.length && i < maxLoop; i++) {
+            var item = data[i];
+            var val = getDataItemValue(item);
+            if (!isArray(val)) {
+                return false;
+            }
+            if ((result = detectValue(val[dimIndex])) != null) {
+                return result;
+            }
+        }
+    }
+
+    function detectValue(val) {
+        // Consider usage convenience, '1', '2' will be treated as "number".
+        // `isFinit('')` get `true`.
+        if (val != null && isFinite(val) && val !== '') {
+            return false;
+        }
+        else if (isString(val) && val !== '-') {
+            return true;
+        }
+    }
+
+    return false;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * ECharts global model
+ *
+ * @module {echarts/model/Global}
+ */
+
+
+/**
+ * Caution: If the mechanism should be changed some day, these cases
+ * should be considered:
+ *
+ * (1) In `merge option` mode, if using the same option to call `setOption`
+ * many times, the result should be the same (try our best to ensure that).
+ * (2) In `merge option` mode, if a component has no id/name specified, it
+ * will be merged by index, and the result sequence of the components is
+ * consistent to the original sequence.
+ * (3) `reset` feature (in toolbox). Find detailed info in comments about
+ * `mergeOption` in module:echarts/model/OptionManager.
+ */
+
+var OPTION_INNER_KEY = '\0_ec_inner';
+
+/**
+ * @alias module:echarts/model/Global
+ *
+ * @param {Object} option
+ * @param {module:echarts/model/Model} parentModel
+ * @param {Object} theme
+ */
+var GlobalModel = Model.extend({
+
+    init: function (option, parentModel, theme, optionManager) {
+        theme = theme || {};
+
+        this.option = null; // Mark as not initialized.
+
+        /**
+         * @type {module:echarts/model/Model}
+         * @private
+         */
+        this._theme = new Model(theme);
+
+        /**
+         * @type {module:echarts/model/OptionManager}
+         */
+        this._optionManager = optionManager;
+    },
+
+    setOption: function (option, optionPreprocessorFuncs) {
+        assert$1(
+            !(OPTION_INNER_KEY in option),
+            'please use chart.getOption()'
+        );
+
+        this._optionManager.setOption(option, optionPreprocessorFuncs);
+
+        this.resetOption(null);
+    },
+
+    /**
+     * @param {string} type null/undefined: reset all.
+     *                      'recreate': force recreate all.
+     *                      'timeline': only reset timeline option
+     *                      'media': only reset media query option
+     * @return {boolean} Whether option changed.
+     */
+    resetOption: function (type) {
+        var optionChanged = false;
+        var optionManager = this._optionManager;
+
+        if (!type || type === 'recreate') {
+            var baseOption = optionManager.mountOption(type === 'recreate');
+
+            if (!this.option || type === 'recreate') {
+                initBase.call(this, baseOption);
+            }
+            else {
+                this.restoreData();
+                this.mergeOption(baseOption);
+            }
+            optionChanged = true;
+        }
+
+        if (type === 'timeline' || type === 'media') {
+            this.restoreData();
+        }
+
+        if (!type || type === 'recreate' || type === 'timeline') {
+            var timelineOption = optionManager.getTimelineOption(this);
+            timelineOption && (this.mergeOption(timelineOption), optionChanged = true);
+        }
+
+        if (!type || type === 'recreate' || type === 'media') {
+            var mediaOptions = optionManager.getMediaOption(this, this._api);
+            if (mediaOptions.length) {
+                each$1(mediaOptions, function (mediaOption) {
+                    this.mergeOption(mediaOption, optionChanged = true);
+                }, this);
+            }
+        }
+
+        return optionChanged;
+    },
+
+    /**
+     * @protected
+     */
+    mergeOption: function (newOption) {
+        var option = this.option;
+        var componentsMap = this._componentsMap;
+        var newCptTypes = [];
+
+        resetSourceDefaulter(this);
+
+        // If no component class, merge directly.
+        // For example: color, animaiton options, etc.
+        each$1(newOption, function (componentOption, mainType) {
+            if (componentOption == null) {
+                return;
+            }
+
+            if (!ComponentModel.hasClass(mainType)) {
+                // globalSettingTask.dirty();
+                option[mainType] = option[mainType] == null
+                    ? clone(componentOption)
+                    : merge(option[mainType], componentOption, true);
+            }
+            else if (mainType) {
+                newCptTypes.push(mainType);
+            }
+        });
+
+        ComponentModel.topologicalTravel(
+            newCptTypes, ComponentModel.getAllClassMainTypes(), visitComponent, this
+        );
+
+        function visitComponent(mainType, dependencies) {
+
+            var newCptOptionList = normalizeToArray(newOption[mainType]);
+
+            var mapResult = mappingToExists(
+                componentsMap.get(mainType), newCptOptionList
+            );
+
+            makeIdAndName(mapResult);
+
+            // Set mainType and complete subType.
+            each$1(mapResult, function (item, index) {
+                var opt = item.option;
+                if (isObject$1(opt)) {
+                    item.keyInfo.mainType = mainType;
+                    item.keyInfo.subType = determineSubType(mainType, opt, item.exist);
+                }
+            });
+
+            var dependentModels = getComponentsByTypes(
+                componentsMap, dependencies
+            );
+
+            option[mainType] = [];
+            componentsMap.set(mainType, []);
+
+            each$1(mapResult, function (resultItem, index) {
+                var componentModel = resultItem.exist;
+                var newCptOption = resultItem.option;
+
+                assert$1(
+                    isObject$1(newCptOption) || componentModel,
+                    'Empty component definition'
+                );
+
+                // Consider where is no new option and should be merged using {},
+                // see removeEdgeAndAdd in topologicalTravel and
+                // ComponentModel.getAllClassMainTypes.
+                if (!newCptOption) {
+                    componentModel.mergeOption({}, this);
+                    componentModel.optionUpdated({}, false);
+                }
+                else {
+                    var ComponentModelClass = ComponentModel.getClass(
+                        mainType, resultItem.keyInfo.subType, true
+                    );
+
+                    if (componentModel && componentModel instanceof ComponentModelClass) {
+                        componentModel.name = resultItem.keyInfo.name;
+                        // componentModel.settingTask && componentModel.settingTask.dirty();
+                        componentModel.mergeOption(newCptOption, this);
+                        componentModel.optionUpdated(newCptOption, false);
+                    }
+                    else {
+                        // PENDING Global as parent ?
+                        var extraOpt = extend(
+                            {
+                                dependentModels: dependentModels,
+                                componentIndex: index
+                            },
+                            resultItem.keyInfo
+                        );
+                        componentModel = new ComponentModelClass(
+                            newCptOption, this, this, extraOpt
+                        );
+                        extend(componentModel, extraOpt);
+                        componentModel.init(newCptOption, this, this, extraOpt);
+
+                        // Call optionUpdated after init.
+                        // newCptOption has been used as componentModel.option
+                        // and may be merged with theme and default, so pass null
+                        // to avoid confusion.
+                        componentModel.optionUpdated(null, true);
+                    }
+                }
+
+                componentsMap.get(mainType)[index] = componentModel;
+                option[mainType][index] = componentModel.option;
+            }, this);
+
+            // Backup series for filtering.
+            if (mainType === 'series') {
+                createSeriesIndices(this, componentsMap.get('series'));
+            }
+        }
+
+        this._seriesIndicesMap = createHashMap(
+            this._seriesIndices = this._seriesIndices || []
+        );
+    },
+
+    /**
+     * Get option for output (cloned option and inner info removed)
+     * @public
+     * @return {Object}
+     */
+    getOption: function () {
+        var option = clone(this.option);
+
+        each$1(option, function (opts, mainType) {
+            if (ComponentModel.hasClass(mainType)) {
+                var opts = normalizeToArray(opts);
+                for (var i = opts.length - 1; i >= 0; i--) {
+                    // Remove options with inner id.
+                    if (isIdInner(opts[i])) {
+                        opts.splice(i, 1);
+                    }
+                }
+                option[mainType] = opts;
+            }
+        });
+
+        delete option[OPTION_INNER_KEY];
+
+        return option;
+    },
+
+    /**
+     * @return {module:echarts/model/Model}
+     */
+    getTheme: function () {
+        return this._theme;
+    },
+
+    /**
+     * @param {string} mainType
+     * @param {number} [idx=0]
+     * @return {module:echarts/model/Component}
+     */
+    getComponent: function (mainType, idx) {
+        var list = this._componentsMap.get(mainType);
+        if (list) {
+            return list[idx || 0];
+        }
+    },
+
+    /**
+     * If none of index and id and name used, return all components with mainType.
+     * @param {Object} condition
+     * @param {string} condition.mainType
+     * @param {string} [condition.subType] If ignore, only query by mainType
+     * @param {number|Array.<number>} [condition.index] Either input index or id or name.
+     * @param {string|Array.<string>} [condition.id] Either input index or id or name.
+     * @param {string|Array.<string>} [condition.name] Either input index or id or name.
+     * @return {Array.<module:echarts/model/Component>}
+     */
+    queryComponents: function (condition) {
+        var mainType = condition.mainType;
+        if (!mainType) {
+            return [];
+        }
+
+        var index = condition.index;
+        var id = condition.id;
+        var name = condition.name;
+
+        var cpts = this._componentsMap.get(mainType);
+
+        if (!cpts || !cpts.length) {
+            return [];
+        }
+
+        var result;
+
+        if (index != null) {
+            if (!isArray(index)) {
+                index = [index];
+            }
+            result = filter(map(index, function (idx) {
+                return cpts[idx];
+            }), function (val) {
+                return !!val;
+            });
+        }
+        else if (id != null) {
+            var isIdArray = isArray(id);
+            result = filter(cpts, function (cpt) {
+                return (isIdArray && indexOf(id, cpt.id) >= 0)
+                    || (!isIdArray && cpt.id === id);
+            });
+        }
+        else if (name != null) {
+            var isNameArray = isArray(name);
+            result = filter(cpts, function (cpt) {
+                return (isNameArray && indexOf(name, cpt.name) >= 0)
+                    || (!isNameArray && cpt.name === name);
+            });
+        }
+        else {
+            // Return all components with mainType
+            result = cpts.slice();
+        }
+
+        return filterBySubType(result, condition);
+    },
+
+    /**
+     * The interface is different from queryComponents,
+     * which is convenient for inner usage.
+     *
+     * @usage
+     * var result = findComponents(
+     *     {mainType: 'dataZoom', query: {dataZoomId: 'abc'}}
+     * );
+     * var result = findComponents(
+     *     {mainType: 'series', subType: 'pie', query: {seriesName: 'uio'}}
+     * );
+     * var result = findComponents(
+     *     {mainType: 'series'},
+     *     function (model, index) {...}
+     * );
+     * // result like [component0, componnet1, ...]
+     *
+     * @param {Object} condition
+     * @param {string} condition.mainType Mandatory.
+     * @param {string} [condition.subType] Optional.
+     * @param {Object} [condition.query] like {xxxIndex, xxxId, xxxName},
+     *        where xxx is mainType.
+     *        If query attribute is null/undefined or has no index/id/name,
+     *        do not filtering by query conditions, which is convenient for
+     *        no-payload situations or when target of action is global.
+     * @param {Function} [condition.filter] parameter: component, return boolean.
+     * @return {Array.<module:echarts/model/Component>}
+     */
+    findComponents: function (condition) {
+        var query = condition.query;
+        var mainType = condition.mainType;
+
+        var queryCond = getQueryCond(query);
+        var result = queryCond
+            ? this.queryComponents(queryCond)
+            : this._componentsMap.get(mainType);
+
+        return doFilter(filterBySubType(result, condition));
+
+        function getQueryCond(q) {
+            var indexAttr = mainType + 'Index';
+            var idAttr = mainType + 'Id';
+            var nameAttr = mainType + 'Name';
+            return q && (
+                    q[indexAttr] != null
+                    || q[idAttr] != null
+                    || q[nameAttr] != null
+                )
+                ? {
+                    mainType: mainType,
+                    // subType will be filtered finally.
+                    index: q[indexAttr],
+                    id: q[idAttr],
+                    name: q[nameAttr]
+                }
+                : null;
+        }
+
+        function doFilter(res) {
+            return condition.filter
+                    ? filter(res, condition.filter)
+                    : res;
+        }
+    },
+
+    /**
+     * @usage
+     * eachComponent('legend', function (legendModel, index) {
+     *     ...
+     * });
+     * eachComponent(function (componentType, model, index) {
+     *     // componentType does not include subType
+     *     // (componentType is 'xxx' but not 'xxx.aa')
+     * });
+     * eachComponent(
+     *     {mainType: 'dataZoom', query: {dataZoomId: 'abc'}},
+     *     function (model, index) {...}
+     * );
+     * eachComponent(
+     *     {mainType: 'series', subType: 'pie', query: {seriesName: 'uio'}},
+     *     function (model, index) {...}
+     * );
+     *
+     * @param {string|Object=} mainType When mainType is object, the definition
+     *                                  is the same as the method 'findComponents'.
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachComponent: function (mainType, cb, context) {
+        var componentsMap = this._componentsMap;
+
+        if (typeof mainType === 'function') {
+            context = cb;
+            cb = mainType;
+            componentsMap.each(function (components, componentType) {
+                each$1(components, function (component, index) {
+                    cb.call(context, componentType, component, index);
+                });
+            });
+        }
+        else if (isString(mainType)) {
+            each$1(componentsMap.get(mainType), cb, context);
+        }
+        else if (isObject$1(mainType)) {
+            var queryResult = this.findComponents(mainType);
+            each$1(queryResult, cb, context);
+        }
+    },
+
+    /**
+     * @param {string} name
+     * @return {Array.<module:echarts/model/Series>}
+     */
+    getSeriesByName: function (name) {
+        var series = this._componentsMap.get('series');
+        return filter(series, function (oneSeries) {
+            return oneSeries.name === name;
+        });
+    },
+
+    /**
+     * @param {number} seriesIndex
+     * @return {module:echarts/model/Series}
+     */
+    getSeriesByIndex: function (seriesIndex) {
+        return this._componentsMap.get('series')[seriesIndex];
+    },
+
+    /**
+     * Get series list before filtered by type.
+     * FIXME: rename to getRawSeriesByType?
+     *
+     * @param {string} subType
+     * @return {Array.<module:echarts/model/Series>}
+     */
+    getSeriesByType: function (subType) {
+        var series = this._componentsMap.get('series');
+        return filter(series, function (oneSeries) {
+            return oneSeries.subType === subType;
+        });
+    },
+
+    /**
+     * @return {Array.<module:echarts/model/Series>}
+     */
+    getSeries: function () {
+        return this._componentsMap.get('series').slice();
+    },
+
+    /**
+     * @return {number}
+     */
+    getSeriesCount: function () {
+        return this._componentsMap.get('series').length;
+    },
+
+    /**
+     * After filtering, series may be different
+     * frome raw series.
+     *
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachSeries: function (cb, context) {
+        assertSeriesInitialized(this);
+        each$1(this._seriesIndices, function (rawSeriesIndex) {
+            var series = this._componentsMap.get('series')[rawSeriesIndex];
+            cb.call(context, series, rawSeriesIndex);
+        }, this);
+    },
+
+    /**
+     * Iterate raw series before filtered.
+     *
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachRawSeries: function (cb, context) {
+        each$1(this._componentsMap.get('series'), cb, context);
+    },
+
+    /**
+     * After filtering, series may be different.
+     * frome raw series.
+     *
+     * @parma {string} subType
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachSeriesByType: function (subType, cb, context) {
+        assertSeriesInitialized(this);
+        each$1(this._seriesIndices, function (rawSeriesIndex) {
+            var series = this._componentsMap.get('series')[rawSeriesIndex];
+            if (series.subType === subType) {
+                cb.call(context, series, rawSeriesIndex);
+            }
+        }, this);
+    },
+
+    /**
+     * Iterate raw series before filtered of given type.
+     *
+     * @parma {string} subType
+     * @param {Function} cb
+     * @param {*} context
+     */
+    eachRawSeriesByType: function (subType, cb, context) {
+        return each$1(this.getSeriesByType(subType), cb, context);
+    },
+
+    /**
+     * @param {module:echarts/model/Series} seriesModel
+     */
+    isSeriesFiltered: function (seriesModel) {
+        assertSeriesInitialized(this);
+        return this._seriesIndicesMap.get(seriesModel.componentIndex) == null;
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getCurrentSeriesIndices: function () {
+        return (this._seriesIndices || []).slice();
+    },
+
+    /**
+     * @param {Function} cb
+     * @param {*} context
+     */
+    filterSeries: function (cb, context) {
+        assertSeriesInitialized(this);
+        var filteredSeries = filter(
+            this._componentsMap.get('series'), cb, context
+        );
+        createSeriesIndices(this, filteredSeries);
+    },
+
+    restoreData: function (payload) {
+        var componentsMap = this._componentsMap;
+
+        createSeriesIndices(this, componentsMap.get('series'));
+
+        var componentTypes = [];
+        componentsMap.each(function (components, componentType) {
+            componentTypes.push(componentType);
+        });
+
+        ComponentModel.topologicalTravel(
+            componentTypes,
+            ComponentModel.getAllClassMainTypes(),
+            function (componentType, dependencies) {
+                each$1(componentsMap.get(componentType), function (component) {
+                    (componentType !== 'series' || !isNotTargetSeries(component, payload))
+                        && component.restoreData();
+                });
+            }
+        );
+    }
+
+});
+
+function isNotTargetSeries(seriesModel, payload) {
+    if (payload) {
+        var index = payload.seiresIndex;
+        var id = payload.seriesId;
+        var name = payload.seriesName;
+        return (index != null && seriesModel.componentIndex !== index)
+            || (id != null && seriesModel.id !== id)
+            || (name != null && seriesModel.name !== name);
+    }
+}
+
+/**
+ * @inner
+ */
+function mergeTheme(option, theme) {
+    // PENDING
+    // NOT use `colorLayer` in theme if option has `color`
+    var notMergeColorLayer = option.color && !option.colorLayer;
+
+    each$1(theme, function (themeItem, name) {
+        if (name === 'colorLayer' && notMergeColorLayer) {
+            return;
+        }
+        // 如果有 component model 则把具体的 merge 逻辑交给该 model 处理
+        if (!ComponentModel.hasClass(name)) {
+            if (typeof themeItem === 'object') {
+                option[name] = !option[name]
+                    ? clone(themeItem)
+                    : merge(option[name], themeItem, false);
+            }
+            else {
+                if (option[name] == null) {
+                    option[name] = themeItem;
+                }
+            }
+        }
+    });
+}
+
+function initBase(baseOption) {
+    baseOption = baseOption;
+
+    // Using OPTION_INNER_KEY to mark that this option can not be used outside,
+    // i.e. `chart.setOption(chart.getModel().option);` is forbiden.
+    this.option = {};
+    this.option[OPTION_INNER_KEY] = 1;
+
+    /**
+     * Init with series: [], in case of calling findSeries method
+     * before series initialized.
+     * @type {Object.<string, Array.<module:echarts/model/Model>>}
+     * @private
+     */
+    this._componentsMap = createHashMap({series: []});
+
+    /**
+     * Mapping between filtered series list and raw series list.
+     * key: filtered series indices, value: raw series indices.
+     * @type {Array.<nubmer>}
+     * @private
+     */
+    this._seriesIndices;
+
+    this._seriesIndicesMap;
+
+    mergeTheme(baseOption, this._theme.option);
+
+    // TODO Needs clone when merging to the unexisted property
+    merge(baseOption, globalDefault, false);
+
+    this.mergeOption(baseOption);
+}
+
+/**
+ * @inner
+ * @param {Array.<string>|string} types model types
+ * @return {Object} key: {string} type, value: {Array.<Object>} models
+ */
+function getComponentsByTypes(componentsMap, types) {
+    if (!isArray(types)) {
+        types = types ? [types] : [];
+    }
+
+    var ret = {};
+    each$1(types, function (type) {
+        ret[type] = (componentsMap.get(type) || []).slice();
+    });
+
+    return ret;
+}
+
+/**
+ * @inner
+ */
+function determineSubType(mainType, newCptOption, existComponent) {
+    var subType = newCptOption.type
+        ? newCptOption.type
+        : existComponent
+        ? existComponent.subType
+        // Use determineSubType only when there is no existComponent.
+        : ComponentModel.determineSubType(mainType, newCptOption);
+
+    // tooltip, markline, markpoint may always has no subType
+    return subType;
+}
+
+/**
+ * @inner
+ */
+function createSeriesIndices(ecModel, seriesModels) {
+    ecModel._seriesIndicesMap = createHashMap(
+        ecModel._seriesIndices = map(seriesModels, function (series) {
+            return series.componentIndex;
+        }) || []
+    );
+}
+
+/**
+ * @inner
+ */
+function filterBySubType(components, condition) {
+    // Using hasOwnProperty for restrict. Consider
+    // subType is undefined in user payload.
+    return condition.hasOwnProperty('subType')
+        ? filter(components, function (cpt) {
+            return cpt.subType === condition.subType;
+        })
+        : components;
+}
+
+/**
+ * @inner
+ */
+function assertSeriesInitialized(ecModel) {
+    // Components that use _seriesIndices should depends on series component,
+    // which make sure that their initialization is after series.
+    if (__DEV__) {
+        if (!ecModel._seriesIndices) {
+            throw new Error('Option should contains series.');
+        }
+    }
+}
+
+mixin(GlobalModel, colorPaletteMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var echartsAPIList = [
+    'getDom', 'getZr', 'getWidth', 'getHeight', 'getDevicePixelRatio', 'dispatchAction', 'isDisposed',
+    'on', 'off', 'getDataURL', 'getConnectedDataURL', 'getModel', 'getOption',
+    'getViewOfComponentModel', 'getViewOfSeriesModel'
+];
+// And `getCoordinateSystems` and `getComponentByElement` will be injected in echarts.js
+
+function ExtensionAPI(chartInstance) {
+    each$1(echartsAPIList, function (name) {
+        this[name] = bind(chartInstance[name], chartInstance);
+    }, this);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var coordinateSystemCreators = {};
+
+function CoordinateSystemManager() {
+
+    this._coordinateSystems = [];
+}
+
+CoordinateSystemManager.prototype = {
+
+    constructor: CoordinateSystemManager,
+
+    create: function (ecModel, api) {
+        var coordinateSystems = [];
+        each$1(coordinateSystemCreators, function (creater, type) {
+            var list = creater.create(ecModel, api);
+            coordinateSystems = coordinateSystems.concat(list || []);
+        });
+
+        this._coordinateSystems = coordinateSystems;
+    },
+
+    update: function (ecModel, api) {
+        each$1(this._coordinateSystems, function (coordSys) {
+            coordSys.update && coordSys.update(ecModel, api);
+        });
+    },
+
+    getCoordinateSystems: function () {
+        return this._coordinateSystems.slice();
+    }
+};
+
+CoordinateSystemManager.register = function (type, coordinateSystemCreator) {
+    coordinateSystemCreators[type] = coordinateSystemCreator;
+};
+
+CoordinateSystemManager.get = function (type) {
+    return coordinateSystemCreators[type];
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * ECharts option manager
+ *
+ * @module {echarts/model/OptionManager}
+ */
+
+
+var each$4 = each$1;
+var clone$3 = clone;
+var map$1 = map;
+var merge$1 = merge;
+
+var QUERY_REG = /^(min|max)?(.+)$/;
+
+/**
+ * TERM EXPLANATIONS:
+ *
+ * [option]:
+ *
+ *     An object that contains definitions of components. For example:
+ *     var option = {
+ *         title: {...},
+ *         legend: {...},
+ *         visualMap: {...},
+ *         series: [
+ *             {data: [...]},
+ *             {data: [...]},
+ *             ...
+ *         ]
+ *     };
+ *
+ * [rawOption]:
+ *
+ *     An object input to echarts.setOption. 'rawOption' may be an
+ *     'option', or may be an object contains multi-options. For example:
+ *     var option = {
+ *         baseOption: {
+ *             title: {...},
+ *             legend: {...},
+ *             series: [
+ *                 {data: [...]},
+ *                 {data: [...]},
+ *                 ...
+ *             ]
+ *         },
+ *         timeline: {...},
+ *         options: [
+ *             {title: {...}, series: {data: [...]}},
+ *             {title: {...}, series: {data: [...]}},
+ *             ...
+ *         ],
+ *         media: [
+ *             {
+ *                 query: {maxWidth: 320},
+ *                 option: {series: {x: 20}, visualMap: {show: false}}
+ *             },
+ *             {
+ *                 query: {minWidth: 320, maxWidth: 720},
+ *                 option: {series: {x: 500}, visualMap: {show: true}}
+ *             },
+ *             {
+ *                 option: {series: {x: 1200}, visualMap: {show: true}}
+ *             }
+ *         ]
+ *     };
+ *
+ * @alias module:echarts/model/OptionManager
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function OptionManager(api) {
+
+    /**
+     * @private
+     * @type {module:echarts/ExtensionAPI}
+     */
+    this._api = api;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._timelineOptions = [];
+
+    /**
+     * @private
+     * @type {Array.<Object>}
+     */
+    this._mediaList = [];
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._mediaDefault;
+
+    /**
+     * -1, means default.
+     * empty means no media.
+     * @private
+     * @type {Array.<number>}
+     */
+    this._currentMediaIndices = [];
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._optionBackup;
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._newBaseOption;
+}
+
+// timeline.notMerge is not supported in ec3. Firstly there is rearly
+// case that notMerge is needed. Secondly supporting 'notMerge' requires
+// rawOption cloned and backuped when timeline changed, which does no
+// good to performance. What's more, that both timeline and setOption
+// method supply 'notMerge' brings complex and some problems.
+// Consider this case:
+// (step1) chart.setOption({timeline: {notMerge: false}, ...}, false);
+// (step2) chart.setOption({timeline: {notMerge: true}, ...}, false);
+
+OptionManager.prototype = {
+
+    constructor: OptionManager,
+
+    /**
+     * @public
+     * @param {Object} rawOption Raw option.
+     * @param {module:echarts/model/Global} ecModel
+     * @param {Array.<Function>} optionPreprocessorFuncs
+     * @return {Object} Init option
+     */
+    setOption: function (rawOption, optionPreprocessorFuncs) {
+        if (rawOption) {
+            // That set dat primitive is dangerous if user reuse the data when setOption again.
+            each$1(normalizeToArray(rawOption.series), function (series) {
+                series && series.data && isTypedArray(series.data) && setAsPrimitive(series.data);
+            });
+        }
+
+        // Caution: some series modify option data, if do not clone,
+        // it should ensure that the repeat modify correctly
+        // (create a new object when modify itself).
+        rawOption = clone$3(rawOption, true);
+
+        // FIXME
+        // 如果 timeline options 或者 media 中设置了某个属性，而baseOption中没有设置，则进行警告。
+
+        var oldOptionBackup = this._optionBackup;
+        var newParsedOption = parseRawOption.call(
+            this, rawOption, optionPreprocessorFuncs, !oldOptionBackup
+        );
+        this._newBaseOption = newParsedOption.baseOption;
+
+        // For setOption at second time (using merge mode);
+        if (oldOptionBackup) {
+            // Only baseOption can be merged.
+            mergeOption(oldOptionBackup.baseOption, newParsedOption.baseOption);
+
+            // For simplicity, timeline options and media options do not support merge,
+            // that is, if you `setOption` twice and both has timeline options, the latter
+            // timeline opitons will not be merged to the formers, but just substitude them.
+            if (newParsedOption.timelineOptions.length) {
+                oldOptionBackup.timelineOptions = newParsedOption.timelineOptions;
+            }
+            if (newParsedOption.mediaList.length) {
+                oldOptionBackup.mediaList = newParsedOption.mediaList;
+            }
+            if (newParsedOption.mediaDefault) {
+                oldOptionBackup.mediaDefault = newParsedOption.mediaDefault;
+            }
+        }
+        else {
+            this._optionBackup = newParsedOption;
+        }
+    },
+
+    /**
+     * @param {boolean} isRecreate
+     * @return {Object}
+     */
+    mountOption: function (isRecreate) {
+        var optionBackup = this._optionBackup;
+
+        // TODO
+        // 如果没有reset功能则不clone。
+
+        this._timelineOptions = map$1(optionBackup.timelineOptions, clone$3);
+        this._mediaList = map$1(optionBackup.mediaList, clone$3);
+        this._mediaDefault = clone$3(optionBackup.mediaDefault);
+        this._currentMediaIndices = [];
+
+        return clone$3(isRecreate
+            // this._optionBackup.baseOption, which is created at the first `setOption`
+            // called, and is merged into every new option by inner method `mergeOption`
+            // each time `setOption` called, can be only used in `isRecreate`, because
+            // its reliability is under suspicion. In other cases option merge is
+            // performed by `model.mergeOption`.
+            ? optionBackup.baseOption : this._newBaseOption
+        );
+    },
+
+    /**
+     * @param {module:echarts/model/Global} ecModel
+     * @return {Object}
+     */
+    getTimelineOption: function (ecModel) {
+        var option;
+        var timelineOptions = this._timelineOptions;
+
+        if (timelineOptions.length) {
+            // getTimelineOption can only be called after ecModel inited,
+            // so we can get currentIndex from timelineModel.
+            var timelineModel = ecModel.getComponent('timeline');
+            if (timelineModel) {
+                option = clone$3(
+                    timelineOptions[timelineModel.getCurrentIndex()],
+                    true
+                );
+            }
+        }
+
+        return option;
+    },
+
+    /**
+     * @param {module:echarts/model/Global} ecModel
+     * @return {Array.<Object>}
+     */
+    getMediaOption: function (ecModel) {
+        var ecWidth = this._api.getWidth();
+        var ecHeight = this._api.getHeight();
+        var mediaList = this._mediaList;
+        var mediaDefault = this._mediaDefault;
+        var indices = [];
+        var result = [];
+
+        // No media defined.
+        if (!mediaList.length && !mediaDefault) {
+            return result;
+        }
+
+        // Multi media may be applied, the latter defined media has higher priority.
+        for (var i = 0, len = mediaList.length; i < len; i++) {
+            if (applyMediaQuery(mediaList[i].query, ecWidth, ecHeight)) {
+                indices.push(i);
+            }
+        }
+
+        // FIXME
+        // 是否mediaDefault应该强制用户设置，否则可能修改不能回归。
+        if (!indices.length && mediaDefault) {
+            indices = [-1];
+        }
+
+        if (indices.length && !indicesEquals(indices, this._currentMediaIndices)) {
+            result = map$1(indices, function (index) {
+                return clone$3(
+                    index === -1 ? mediaDefault.option : mediaList[index].option
+                );
+            });
+        }
+        // Otherwise return nothing.
+
+        this._currentMediaIndices = indices;
+
+        return result;
+    }
+};
+
+function parseRawOption(rawOption, optionPreprocessorFuncs, isNew) {
+    var timelineOptions = [];
+    var mediaList = [];
+    var mediaDefault;
+    var baseOption;
+
+    // Compatible with ec2.
+    var timelineOpt = rawOption.timeline;
+
+    if (rawOption.baseOption) {
+        baseOption = rawOption.baseOption;
+    }
+
+    // For timeline
+    if (timelineOpt || rawOption.options) {
+        baseOption = baseOption || {};
+        timelineOptions = (rawOption.options || []).slice();
+    }
+
+    // For media query
+    if (rawOption.media) {
+        baseOption = baseOption || {};
+        var media = rawOption.media;
+        each$4(media, function (singleMedia) {
+            if (singleMedia && singleMedia.option) {
+                if (singleMedia.query) {
+                    mediaList.push(singleMedia);
+                }
+                else if (!mediaDefault) {
+                    // Use the first media default.
+                    mediaDefault = singleMedia;
+                }
+            }
+        });
+    }
+
+    // For normal option
+    if (!baseOption) {
+        baseOption = rawOption;
+    }
+
+    // Set timelineOpt to baseOption in ec3,
+    // which is convenient for merge option.
+    if (!baseOption.timeline) {
+        baseOption.timeline = timelineOpt;
+    }
+
+    // Preprocess.
+    each$4([baseOption].concat(timelineOptions)
+        .concat(map(mediaList, function (media) {
+            return media.option;
+        })),
+        function (option) {
+            each$4(optionPreprocessorFuncs, function (preProcess) {
+                preProcess(option, isNew);
+            });
+        }
+    );
+
+    return {
+        baseOption: baseOption,
+        timelineOptions: timelineOptions,
+        mediaDefault: mediaDefault,
+        mediaList: mediaList
+    };
+}
+
+/**
+ * @see <http://www.w3.org/TR/css3-mediaqueries/#media1>
+ * Support: width, height, aspectRatio
+ * Can use max or min as prefix.
+ */
+function applyMediaQuery(query, ecWidth, ecHeight) {
+    var realMap = {
+        width: ecWidth,
+        height: ecHeight,
+        aspectratio: ecWidth / ecHeight // lowser case for convenientce.
+    };
+
+    var applicatable = true;
+
+    each$1(query, function (value, attr) {
+        var matched = attr.match(QUERY_REG);
+
+        if (!matched || !matched[1] || !matched[2]) {
+            return;
+        }
+
+        var operator = matched[1];
+        var realAttr = matched[2].toLowerCase();
+
+        if (!compare(realMap[realAttr], value, operator)) {
+            applicatable = false;
+        }
+    });
+
+    return applicatable;
+}
+
+function compare(real, expect, operator) {
+    if (operator === 'min') {
+        return real >= expect;
+    }
+    else if (operator === 'max') {
+        return real <= expect;
+    }
+    else { // Equals
+        return real === expect;
+    }
+}
+
+function indicesEquals(indices1, indices2) {
+    // indices is always order by asc and has only finite number.
+    return indices1.join(',') === indices2.join(',');
+}
+
+/**
+ * Consider case:
+ * `chart.setOption(opt1);`
+ * Then user do some interaction like dataZoom, dataView changing.
+ * `chart.setOption(opt2);`
+ * Then user press 'reset button' in toolbox.
+ *
+ * After doing that all of the interaction effects should be reset, the
+ * chart should be the same as the result of invoke
+ * `chart.setOption(opt1); chart.setOption(opt2);`.
+ *
+ * Although it is not able ensure that
+ * `chart.setOption(opt1); chart.setOption(opt2);` is equivalents to
+ * `chart.setOption(merge(opt1, opt2));` exactly,
+ * this might be the only simple way to implement that feature.
+ *
+ * MEMO: We've considered some other approaches:
+ * 1. Each model handle its self restoration but not uniform treatment.
+ *     (Too complex in logic and error-prone)
+ * 2. Use a shadow ecModel. (Performace expensive)
+ */
+function mergeOption(oldOption, newOption) {
+    newOption = newOption || {};
+
+    each$4(newOption, function (newCptOpt, mainType) {
+        if (newCptOpt == null) {
+            return;
+        }
+
+        var oldCptOpt = oldOption[mainType];
+
+        if (!ComponentModel.hasClass(mainType)) {
+            oldOption[mainType] = merge$1(oldCptOpt, newCptOpt, true);
+        }
+        else {
+            newCptOpt = normalizeToArray(newCptOpt);
+            oldCptOpt = normalizeToArray(oldCptOpt);
+
+            var mapResult = mappingToExists(oldCptOpt, newCptOpt);
+
+            oldOption[mainType] = map$1(mapResult, function (item) {
+                return (item.option && item.exist)
+                    ? merge$1(item.exist, item.option, true)
+                    : (item.exist || item.option);
+            });
+        }
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$5 = each$1;
+var isObject$3 = isObject$1;
+
+var POSSIBLE_STYLES = [
+    'areaStyle', 'lineStyle', 'nodeStyle', 'linkStyle',
+    'chordStyle', 'label', 'labelLine'
+];
+
+function compatEC2ItemStyle(opt) {
+    var itemStyleOpt = opt && opt.itemStyle;
+    if (!itemStyleOpt) {
+        return;
+    }
+    for (var i = 0, len = POSSIBLE_STYLES.length; i < len; i++) {
+        var styleName = POSSIBLE_STYLES[i];
+        var normalItemStyleOpt = itemStyleOpt.normal;
+        var emphasisItemStyleOpt = itemStyleOpt.emphasis;
+        if (normalItemStyleOpt && normalItemStyleOpt[styleName]) {
+            opt[styleName] = opt[styleName] || {};
+            if (!opt[styleName].normal) {
+                opt[styleName].normal = normalItemStyleOpt[styleName];
+            }
+            else {
+                merge(opt[styleName].normal, normalItemStyleOpt[styleName]);
+            }
+            normalItemStyleOpt[styleName] = null;
+        }
+        if (emphasisItemStyleOpt && emphasisItemStyleOpt[styleName]) {
+            opt[styleName] = opt[styleName] || {};
+            if (!opt[styleName].emphasis) {
+                opt[styleName].emphasis = emphasisItemStyleOpt[styleName];
+            }
+            else {
+                merge(opt[styleName].emphasis, emphasisItemStyleOpt[styleName]);
+            }
+            emphasisItemStyleOpt[styleName] = null;
+        }
+    }
+}
+
+function convertNormalEmphasis(opt, optType, useExtend) {
+    if (opt && opt[optType] && (opt[optType].normal || opt[optType].emphasis)) {
+        var normalOpt = opt[optType].normal;
+        var emphasisOpt = opt[optType].emphasis;
+
+        if (normalOpt) {
+            // Timeline controlStyle has other properties besides normal and emphasis
+            if (useExtend) {
+                opt[optType].normal = opt[optType].emphasis = null;
+                defaults(opt[optType], normalOpt);
+            }
+            else {
+                opt[optType] = normalOpt;
+            }
+        }
+        if (emphasisOpt) {
+            opt.emphasis = opt.emphasis || {};
+            opt.emphasis[optType] = emphasisOpt;
+        }
+    }
+}
+function removeEC3NormalStatus(opt) {
+    convertNormalEmphasis(opt, 'itemStyle');
+    convertNormalEmphasis(opt, 'lineStyle');
+    convertNormalEmphasis(opt, 'areaStyle');
+    convertNormalEmphasis(opt, 'label');
+    convertNormalEmphasis(opt, 'labelLine');
+    // treemap
+    convertNormalEmphasis(opt, 'upperLabel');
+    // graph
+    convertNormalEmphasis(opt, 'edgeLabel');
+}
+
+function compatTextStyle(opt, propName) {
+    // Check whether is not object (string\null\undefined ...)
+    var labelOptSingle = isObject$3(opt) && opt[propName];
+    var textStyle = isObject$3(labelOptSingle) && labelOptSingle.textStyle;
+    if (textStyle) {
+        for (var i = 0, len = TEXT_STYLE_OPTIONS.length; i < len; i++) {
+            var propName = TEXT_STYLE_OPTIONS[i];
+            if (textStyle.hasOwnProperty(propName)) {
+                labelOptSingle[propName] = textStyle[propName];
+            }
+        }
+    }
+}
+
+function compatEC3CommonStyles(opt) {
+    if (opt) {
+        removeEC3NormalStatus(opt);
+        compatTextStyle(opt, 'label');
+        opt.emphasis && compatTextStyle(opt.emphasis, 'label');
+    }
+}
+
+function processSeries(seriesOpt) {
+    if (!isObject$3(seriesOpt)) {
+        return;
+    }
+
+    compatEC2ItemStyle(seriesOpt);
+    removeEC3NormalStatus(seriesOpt);
+
+    compatTextStyle(seriesOpt, 'label');
+    // treemap
+    compatTextStyle(seriesOpt, 'upperLabel');
+    // graph
+    compatTextStyle(seriesOpt, 'edgeLabel');
+    if (seriesOpt.emphasis) {
+        compatTextStyle(seriesOpt.emphasis, 'label');
+        // treemap
+        compatTextStyle(seriesOpt.emphasis, 'upperLabel');
+        // graph
+        compatTextStyle(seriesOpt.emphasis, 'edgeLabel');
+    }
+
+    var markPoint = seriesOpt.markPoint;
+    if (markPoint) {
+        compatEC2ItemStyle(markPoint);
+        compatEC3CommonStyles(markPoint);
+    }
+
+    var markLine = seriesOpt.markLine;
+    if (markLine) {
+        compatEC2ItemStyle(markLine);
+        compatEC3CommonStyles(markLine);
+    }
+
+    var markArea = seriesOpt.markArea;
+    if (markArea) {
+        compatEC3CommonStyles(markArea);
+    }
+
+    var data = seriesOpt.data;
+
+    // Break with ec3: if `setOption` again, there may be no `type` in option,
+    // then the backward compat based on option type will not be performed.
+
+    if (seriesOpt.type === 'graph') {
+        data = data || seriesOpt.nodes;
+        var edgeData = seriesOpt.links || seriesOpt.edges;
+        if (edgeData && !isTypedArray(edgeData)) {
+            for (var i = 0; i < edgeData.length; i++) {
+                compatEC3CommonStyles(edgeData[i]);
+            }
+        }
+        each$1(seriesOpt.categories, function (opt) {
+            removeEC3NormalStatus(opt);
+        });
+    }
+
+    if (data && !isTypedArray(data)) {
+        for (var i = 0; i < data.length; i++) {
+            compatEC3CommonStyles(data[i]);
+        }
+    }
+
+    // mark point data
+    var markPoint = seriesOpt.markPoint;
+    if (markPoint && markPoint.data) {
+        var mpData = markPoint.data;
+        for (var i = 0; i < mpData.length; i++) {
+            compatEC3CommonStyles(mpData[i]);
+        }
+    }
+    // mark line data
+    var markLine = seriesOpt.markLine;
+    if (markLine && markLine.data) {
+        var mlData = markLine.data;
+        for (var i = 0; i < mlData.length; i++) {
+            if (isArray(mlData[i])) {
+                compatEC3CommonStyles(mlData[i][0]);
+                compatEC3CommonStyles(mlData[i][1]);
+            }
+            else {
+                compatEC3CommonStyles(mlData[i]);
+            }
+        }
+    }
+
+    // Series
+    if (seriesOpt.type === 'gauge') {
+        compatTextStyle(seriesOpt, 'axisLabel');
+        compatTextStyle(seriesOpt, 'title');
+        compatTextStyle(seriesOpt, 'detail');
+    }
+    else if (seriesOpt.type === 'treemap') {
+        convertNormalEmphasis(seriesOpt.breadcrumb, 'itemStyle');
+        each$1(seriesOpt.levels, function (opt) {
+            removeEC3NormalStatus(opt);
+        });
+    }
+    else if (seriesOpt.type === 'tree') {
+        removeEC3NormalStatus(seriesOpt.leaves);
+    }
+    // sunburst starts from ec4, so it does not need to compat levels.
+}
+
+function toArr(o) {
+    return isArray(o) ? o : o ? [o] : [];
+}
+
+function toObj(o) {
+    return (isArray(o) ? o[0] : o) || {};
+}
+
+var compatStyle = function (option, isTheme) {
+    each$5(toArr(option.series), function (seriesOpt) {
+        isObject$3(seriesOpt) && processSeries(seriesOpt);
+    });
+
+    var axes = ['xAxis', 'yAxis', 'radiusAxis', 'angleAxis', 'singleAxis', 'parallelAxis', 'radar'];
+    isTheme && axes.push('valueAxis', 'categoryAxis', 'logAxis', 'timeAxis');
+
+    each$5(
+        axes,
+        function (axisName) {
+            each$5(toArr(option[axisName]), function (axisOpt) {
+                if (axisOpt) {
+                    compatTextStyle(axisOpt, 'axisLabel');
+                    compatTextStyle(axisOpt.axisPointer, 'label');
+                }
+            });
+        }
+    );
+
+    each$5(toArr(option.parallel), function (parallelOpt) {
+        var parallelAxisDefault = parallelOpt && parallelOpt.parallelAxisDefault;
+        compatTextStyle(parallelAxisDefault, 'axisLabel');
+        compatTextStyle(parallelAxisDefault && parallelAxisDefault.axisPointer, 'label');
+    });
+
+    each$5(toArr(option.calendar), function (calendarOpt) {
+        convertNormalEmphasis(calendarOpt, 'itemStyle');
+        compatTextStyle(calendarOpt, 'dayLabel');
+        compatTextStyle(calendarOpt, 'monthLabel');
+        compatTextStyle(calendarOpt, 'yearLabel');
+    });
+
+    // radar.name.textStyle
+    each$5(toArr(option.radar), function (radarOpt) {
+        compatTextStyle(radarOpt, 'name');
+    });
+
+    each$5(toArr(option.geo), function (geoOpt) {
+        if (isObject$3(geoOpt)) {
+            compatEC3CommonStyles(geoOpt);
+            each$5(toArr(geoOpt.regions), function (regionObj) {
+                compatEC3CommonStyles(regionObj);
+            });
+        }
+    });
+
+    each$5(toArr(option.timeline), function (timelineOpt) {
+        compatEC3CommonStyles(timelineOpt);
+        convertNormalEmphasis(timelineOpt, 'label');
+        convertNormalEmphasis(timelineOpt, 'itemStyle');
+        convertNormalEmphasis(timelineOpt, 'controlStyle', true);
+
+        var data = timelineOpt.data;
+        isArray(data) && each$1(data, function (item) {
+            if (isObject$1(item)) {
+                convertNormalEmphasis(item, 'label');
+                convertNormalEmphasis(item, 'itemStyle');
+            }
+        });
+    });
+
+    each$5(toArr(option.toolbox), function (toolboxOpt) {
+        convertNormalEmphasis(toolboxOpt, 'iconStyle');
+        each$5(toolboxOpt.feature, function (featureOpt) {
+            convertNormalEmphasis(featureOpt, 'iconStyle');
+        });
+    });
+
+    compatTextStyle(toObj(option.axisPointer), 'label');
+    compatTextStyle(toObj(option.tooltip).axisPointer, 'label');
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Compatitable with 2.0
+
+function get(opt, path) {
+    path = path.split(',');
+    var obj = opt;
+    for (var i = 0; i < path.length; i++) {
+        obj = obj && obj[path[i]];
+        if (obj == null) {
+            break;
+        }
+    }
+    return obj;
+}
+
+function set$1(opt, path, val, overwrite) {
+    path = path.split(',');
+    var obj = opt;
+    var key;
+    for (var i = 0; i < path.length - 1; i++) {
+        key = path[i];
+        if (obj[key] == null) {
+            obj[key] = {};
+        }
+        obj = obj[key];
+    }
+    if (overwrite || obj[path[i]] == null) {
+        obj[path[i]] = val;
+    }
+}
+
+function compatLayoutProperties(option) {
+    each$1(LAYOUT_PROPERTIES, function (prop) {
+        if (prop[0] in option && !(prop[1] in option)) {
+            option[prop[1]] = option[prop[0]];
+        }
+    });
+}
+
+var LAYOUT_PROPERTIES = [
+    ['x', 'left'], ['y', 'top'], ['x2', 'right'], ['y2', 'bottom']
+];
+
+var COMPATITABLE_COMPONENTS = [
+    'grid', 'geo', 'parallel', 'legend', 'toolbox', 'title', 'visualMap', 'dataZoom', 'timeline'
+];
+
+var backwardCompat = function (option, isTheme) {
+    compatStyle(option, isTheme);
+
+    // Make sure series array for model initialization.
+    option.series = normalizeToArray(option.series);
+
+    each$1(option.series, function (seriesOpt) {
+        if (!isObject$1(seriesOpt)) {
+            return;
+        }
+
+        var seriesType = seriesOpt.type;
+
+        if (seriesType === 'pie' || seriesType === 'gauge') {
+            if (seriesOpt.clockWise != null) {
+                seriesOpt.clockwise = seriesOpt.clockWise;
+            }
+        }
+        if (seriesType === 'gauge') {
+            var pointerColor = get(seriesOpt, 'pointer.color');
+            pointerColor != null
+                && set$1(seriesOpt, 'itemStyle.normal.color', pointerColor);
+        }
+
+        compatLayoutProperties(seriesOpt);
+    });
+
+    // dataRange has changed to visualMap
+    if (option.dataRange) {
+        option.visualMap = option.dataRange;
+    }
+
+    each$1(COMPATITABLE_COMPONENTS, function (componentName) {
+        var options = option[componentName];
+        if (options) {
+            if (!isArray(options)) {
+                options = [options];
+            }
+            each$1(options, function (option) {
+                compatLayoutProperties(option);
+            });
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// (1) [Caution]: the logic is correct based on the premises:
+//     data processing stage is blocked in stream.
+//     See <module:echarts/stream/Scheduler#performDataProcessorTasks>
+// (2) Only register once when import repeatly.
+//     Should be executed before after series filtered and before stack calculation.
+var dataStack = function (ecModel) {
+    var stackInfoMap = createHashMap();
+    ecModel.eachSeries(function (seriesModel) {
+        var stack = seriesModel.get('stack');
+        // Compatibal: when `stack` is set as '', do not stack.
+        if (stack) {
+            var stackInfoList = stackInfoMap.get(stack) || stackInfoMap.set(stack, []);
+            var data = seriesModel.getData();
+
+            var stackInfo = {
+                // Used for calculate axis extent automatically.
+                stackResultDimension: data.getCalculationInfo('stackResultDimension'),
+                stackedOverDimension: data.getCalculationInfo('stackedOverDimension'),
+                stackedDimension: data.getCalculationInfo('stackedDimension'),
+                stackedByDimension: data.getCalculationInfo('stackedByDimension'),
+                isStackedByIndex: data.getCalculationInfo('isStackedByIndex'),
+                data: data,
+                seriesModel: seriesModel
+            };
+
+            // If stacked on axis that do not support data stack.
+            if (!stackInfo.stackedDimension
+                || !(stackInfo.isStackedByIndex || stackInfo.stackedByDimension)
+            ) {
+                return;
+            }
+
+            stackInfoList.length && data.setCalculationInfo(
+                'stackedOnSeries', stackInfoList[stackInfoList.length - 1].seriesModel
+            );
+
+            stackInfoList.push(stackInfo);
+        }
+    });
+
+    stackInfoMap.each(calculateStack);
+};
+
+function calculateStack(stackInfoList) {
+    each$1(stackInfoList, function (targetStackInfo, idxInStack) {
+        var resultVal = [];
+        var resultNaN = [NaN, NaN];
+        var dims = [targetStackInfo.stackResultDimension, targetStackInfo.stackedOverDimension];
+        var targetData = targetStackInfo.data;
+        var isStackedByIndex = targetStackInfo.isStackedByIndex;
+
+        // Should not write on raw data, because stack series model list changes
+        // depending on legend selection.
+        var newData = targetData.map(dims, function (v0, v1, dataIndex) {
+            var sum = targetData.get(targetStackInfo.stackedDimension, dataIndex);
+
+            // Consider `connectNulls` of line area, if value is NaN, stackedOver
+            // should also be NaN, to draw a appropriate belt area.
+            if (isNaN(sum)) {
+                return resultNaN;
+            }
+
+            var byValue;
+            var stackedDataRawIndex;
+
+            if (isStackedByIndex) {
+                stackedDataRawIndex = targetData.getRawIndex(dataIndex);
+            }
+            else {
+                byValue = targetData.get(targetStackInfo.stackedByDimension, dataIndex);
+            }
+
+            // If stackOver is NaN, chart view will render point on value start.
+            var stackedOver = NaN;
+
+            for (var j = idxInStack - 1; j >= 0; j--) {
+                var stackInfo = stackInfoList[j];
+
+                // Has been optimized by inverted indices on `stackedByDimension`.
+                if (!isStackedByIndex) {
+                    stackedDataRawIndex = stackInfo.data.rawIndexOf(stackInfo.stackedByDimension, byValue);
+                }
+
+                if (stackedDataRawIndex >= 0) {
+                    var val = stackInfo.data.getByRawIndex(stackInfo.stackResultDimension, stackedDataRawIndex);
+
+                    // Considering positive stack, negative stack and empty data
+                    if ((sum >= 0 && val > 0) // Positive stack
+                        || (sum <= 0 && val < 0) // Negative stack
+                    ) {
+                        sum += val;
+                        stackedOver = val;
+                        break;
+                    }
+                }
+            }
+
+            resultVal[0] = sum;
+            resultVal[1] = stackedOver;
+
+            return resultVal;
+        });
+
+        targetData.hostModel.setData(newData);
+        // Update for consequent calculation
+        targetStackInfo.data = newData;
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO
+// ??? refactor? check the outer usage of data provider.
+// merge with defaultDimValueGetter?
+
+/**
+ * If normal array used, mutable chunk size is supported.
+ * If typed array used, chunk size must be fixed.
+ */
+function DefaultDataProvider(source, dimSize) {
+    if (!Source.isInstance(source)) {
+        source = Source.seriesDataToSource(source);
+    }
+    this._source = source;
+
+    var data = this._data = source.data;
+    var sourceFormat = source.sourceFormat;
+
+    // Typed array. TODO IE10+?
+    if (sourceFormat === SOURCE_FORMAT_TYPED_ARRAY) {
+        if (__DEV__) {
+            if (dimSize == null) {
+                throw new Error('Typed array data must specify dimension size');
+            }
+        }
+        this._offset = 0;
+        this._dimSize = dimSize;
+        this._data = data;
+    }
+
+    var methods = providerMethods[
+        sourceFormat === SOURCE_FORMAT_ARRAY_ROWS
+        ? sourceFormat + '_' + source.seriesLayoutBy
+        : sourceFormat
+    ];
+
+    if (__DEV__) {
+        assert$1(methods, 'Invalide sourceFormat: ' + sourceFormat);
+    }
+
+    extend(this, methods);
+}
+
+var providerProto = DefaultDataProvider.prototype;
+// If data is pure without style configuration
+providerProto.pure = false;
+// If data is persistent and will not be released after use.
+providerProto.persistent = true;
+
+// ???! FIXME legacy data provider do not has method getSource
+providerProto.getSource = function () {
+    return this._source;
+};
+
+var providerMethods = {
+
+    'arrayRows_column': {
+        pure: true,
+        count: function () {
+            return Math.max(0, this._data.length - this._source.startIndex);
+        },
+        getItem: function (idx) {
+            return this._data[idx + this._source.startIndex];
+        },
+        appendData: appendDataSimply
+    },
+
+    'arrayRows_row': {
+        pure: true,
+        count: function () {
+            var row = this._data[0];
+            return row ? Math.max(0, row.length - this._source.startIndex) : 0;
+        },
+        getItem: function (idx) {
+            idx += this._source.startIndex;
+            var item = [];
+            var data = this._data;
+            for (var i = 0; i < data.length; i++) {
+                var row = data[i];
+                item.push(row ? row[idx] : null);
+            }
+            return item;
+        },
+        appendData: function () {
+            throw new Error('Do not support appendData when set seriesLayoutBy: "row".');
+        }
+    },
+
+    'objectRows': {
+        pure: true,
+        count: countSimply,
+        getItem: getItemSimply,
+        appendData: appendDataSimply
+    },
+
+    'keyedColumns': {
+        pure: true,
+        count: function () {
+            var dimName = this._source.dimensionsDefine[0].name;
+            var col = this._data[dimName];
+            return col ? col.length : 0;
+        },
+        getItem: function (idx) {
+            var item = [];
+            var dims = this._source.dimensionsDefine;
+            for (var i = 0; i < dims.length; i++) {
+                var col = this._data[dims[i].name];
+                item.push(col ? col[idx] : null);
+            }
+            return item;
+        },
+        appendData: function (newData) {
+            var data = this._data;
+            each$1(newData, function (newCol, key) {
+                var oldCol = data[key] || (data[key] = []);
+                for (var i = 0; i < (newCol || []).length; i++) {
+                    oldCol.push(newCol[i]);
+                }
+            });
+        }
+    },
+
+    'original': {
+        count: countSimply,
+        getItem: getItemSimply,
+        appendData: appendDataSimply
+    },
+
+    'typedArray': {
+        persistent: false,
+        pure: true,
+        count: function () {
+            return this._data ? (this._data.length / this._dimSize) : 0;
+        },
+        getItem: function (idx, out) {
+            idx = idx - this._offset;
+            out = out || [];
+            var offset = this._dimSize * idx;
+            for (var i = 0; i < this._dimSize; i++) {
+                out[i] = this._data[offset + i];
+            }
+            return out;
+        },
+        appendData: function (newData) {
+            if (__DEV__) {
+                assert$1(
+                    isTypedArray(newData),
+                    'Added data must be TypedArray if data in initialization is TypedArray'
+                );
+            }
+
+            this._data = newData;
+        },
+
+        // Clean self if data is already used.
+        clean: function () {
+            // PENDING
+            this._offset += this.count();
+            this._data = null;
+        }
+    }
+};
+
+function countSimply() {
+    return this._data.length;
+}
+function getItemSimply(idx) {
+    return this._data[idx];
+}
+function appendDataSimply(newData) {
+    for (var i = 0; i < newData.length; i++) {
+        this._data.push(newData[i]);
+    }
+}
+
+
+
+var rawValueGetters = {
+
+    arrayRows: getRawValueSimply,
+
+    objectRows: function (dataItem, dataIndex, dimIndex, dimName) {
+        return dimIndex != null ? dataItem[dimName] : dataItem;
+    },
+
+    keyedColumns: getRawValueSimply,
+
+    original: function (dataItem, dataIndex, dimIndex, dimName) {
+        // FIXME
+        // In some case (markpoint in geo (geo-map.html)), dataItem
+        // is {coord: [...]}
+        var value = getDataItemValue(dataItem);
+        return (dimIndex == null || !(value instanceof Array))
+            ? value
+            : value[dimIndex];
+    },
+
+    typedArray: getRawValueSimply
+};
+
+function getRawValueSimply(dataItem, dataIndex, dimIndex, dimName) {
+    return dimIndex != null ? dataItem[dimIndex] : dataItem;
+}
+
+
+var defaultDimValueGetters = {
+
+    arrayRows: getDimValueSimply,
+
+    objectRows: function (dataItem, dimName, dataIndex, dimIndex) {
+        return converDataValue(dataItem[dimName], this._dimensionInfos[dimName]);
+    },
+
+    keyedColumns: getDimValueSimply,
+
+    original: function (dataItem, dimName, dataIndex, dimIndex) {
+        // Performance sensitive, do not use modelUtil.getDataItemValue.
+        // If dataItem is an plain object with no value field, the var `value`
+        // will be assigned with the object, but it will be tread correctly
+        // in the `convertDataValue`.
+        var value = dataItem && (dataItem.value == null ? dataItem : dataItem.value);
+
+        // If any dataItem is like { value: 10 }
+        if (!this._rawData.pure && isDataItemOption(dataItem)) {
+            this.hasItemOption = true;
+        }
+        return converDataValue(
+            (value instanceof Array)
+                ? value[dimIndex]
+                // If value is a single number or something else not array.
+                : value,
+            this._dimensionInfos[dimName]
+        );
+    },
+
+    typedArray: function (dataItem, dimName, dataIndex, dimIndex) {
+        return dataItem[dimIndex];
+    }
+
+};
+
+function getDimValueSimply(dataItem, dimName, dataIndex, dimIndex) {
+    return converDataValue(dataItem[dimIndex], this._dimensionInfos[dimName]);
+}
+
+/**
+ * This helper method convert value in data.
+ * @param {string|number|Date} value
+ * @param {Object|string} [dimInfo] If string (like 'x'), dimType defaults 'number'.
+ *        If "dimInfo.ordinalParseAndSave", ordinal value can be parsed.
+ */
+function converDataValue(value, dimInfo) {
+    // Performance sensitive.
+    var dimType = dimInfo && dimInfo.type;
+    if (dimType === 'ordinal') {
+        // If given value is a category string
+        var ordinalMeta = dimInfo && dimInfo.ordinalMeta;
+        return ordinalMeta
+            ? ordinalMeta.parseAndCollect(value)
+            : value;
+    }
+
+    if (dimType === 'time'
+        // spead up when using timestamp
+        && typeof value !== 'number'
+        && value != null
+        && value !== '-'
+    ) {
+        value = +parseDate(value);
+    }
+
+    // dimType defaults 'number'.
+    // If dimType is not ordinal and value is null or undefined or NaN or '-',
+    // parse to NaN.
+    return (value == null || value === '')
+        ? NaN
+        // If string (like '-'), using '+' parse to NaN
+        // If object, also parse to NaN
+        : +value;
+}
+
+// ??? FIXME can these logic be more neat: getRawValue, getRawDataItem,
+// Consider persistent.
+// Caution: why use raw value to display on label or tooltip?
+// A reason is to avoid format. For example time value we do not know
+// how to format is expected. More over, if stack is used, calculated
+// value may be 0.91000000001, which have brings trouble to display.
+// TODO: consider how to treat null/undefined/NaN when display?
+/**
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @param {string|number} [dim] dimName or dimIndex
+ * @return {Array.<number>|string|number} can be null/undefined.
+ */
+function retrieveRawValue(data, dataIndex, dim) {
+    if (!data) {
+        return;
+    }
+
+    // Consider data may be not persistent.
+    var dataItem = data.getRawDataItem(dataIndex);
+
+    if (dataItem == null) {
+        return;
+    }
+
+    var sourceFormat = data.getProvider().getSource().sourceFormat;
+    var dimName;
+    var dimIndex;
+
+    var dimInfo = data.getDimensionInfo(dim);
+    if (dimInfo) {
+        dimName = dimInfo.name;
+        dimIndex = dimInfo.index;
+    }
+
+    return rawValueGetters[sourceFormat](dataItem, dataIndex, dimIndex, dimName);
+}
+
+/**
+ * Compatible with some cases (in pie, map) like:
+ * data: [{name: 'xx', value: 5, selected: true}, ...]
+ * where only sourceFormat is 'original' and 'objectRows' supported.
+ *
+ * ??? TODO
+ * Supported detail options in data item when using 'arrayRows'.
+ *
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @param {string} attr like 'selected'
+ */
+function retrieveRawAttr(data, dataIndex, attr) {
+    if (!data) {
+        return;
+    }
+
+    var sourceFormat = data.getProvider().getSource().sourceFormat;
+
+    if (sourceFormat !== SOURCE_FORMAT_ORIGINAL
+        && sourceFormat !== SOURCE_FORMAT_OBJECT_ROWS
+    ) {
+        return;
+    }
+
+    var dataItem = data.getRawDataItem(dataIndex);
+    if (sourceFormat === SOURCE_FORMAT_ORIGINAL && !isObject$1(dataItem)) {
+        dataItem = null;
+    }
+    if (dataItem) {
+        return dataItem[attr];
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DIMENSION_LABEL_REG = /\{@(.+?)\}/g;
+
+// PENDING A little ugly
+var dataFormatMixin = {
+    /**
+     * Get params for formatter
+     * @param {number} dataIndex
+     * @param {string} [dataType]
+     * @return {Object}
+     */
+    getDataParams: function (dataIndex, dataType) {
+        var data = this.getData(dataType);
+        var rawValue = this.getRawValue(dataIndex, dataType);
+        var rawDataIndex = data.getRawIndex(dataIndex);
+        var name = data.getName(dataIndex);
+        var itemOpt = data.getRawDataItem(dataIndex);
+        var color = data.getItemVisual(dataIndex, 'color');
+
+        return {
+            componentType: this.mainType,
+            componentSubType: this.subType,
+            seriesType: this.mainType === 'series' ? this.subType : null,
+            seriesIndex: this.seriesIndex,
+            seriesId: this.id,
+            seriesName: this.name,
+            name: name,
+            dataIndex: rawDataIndex,
+            data: itemOpt,
+            dataType: dataType,
+            value: rawValue,
+            color: color,
+            marker: getTooltipMarker(color),
+
+            // Param name list for mapping `a`, `b`, `c`, `d`, `e`
+            $vars: ['seriesName', 'name', 'value']
+        };
+    },
+
+    /**
+     * Format label
+     * @param {number} dataIndex
+     * @param {string} [status='normal'] 'normal' or 'emphasis'
+     * @param {string} [dataType]
+     * @param {number} [dimIndex]
+     * @param {string} [labelProp='label']
+     * @return {string} If not formatter, return null/undefined
+     */
+    getFormattedLabel: function (dataIndex, status, dataType, dimIndex, labelProp) {
+        status = status || 'normal';
+        var data = this.getData(dataType);
+        var itemModel = data.getItemModel(dataIndex);
+
+        var params = this.getDataParams(dataIndex, dataType);
+        if (dimIndex != null && (params.value instanceof Array)) {
+            params.value = params.value[dimIndex];
+        }
+
+        var formatter = itemModel.get(
+            status === 'normal'
+            ? [labelProp || 'label', 'formatter']
+            : [status, labelProp || 'label', 'formatter']
+        );
+
+        if (typeof formatter === 'function') {
+            params.status = status;
+            return formatter(params);
+        }
+        else if (typeof formatter === 'string') {
+            var str = formatTpl(formatter, params);
+
+            // Support 'aaa{@[3]}bbb{@product}ccc'.
+            // Do not support '}' in dim name util have to.
+            return str.replace(DIMENSION_LABEL_REG, function (origin, dim) {
+                var len = dim.length;
+                if (dim.charAt(0) === '[' && dim.charAt(len - 1) === ']') {
+                    dim = +dim.slice(1, len - 1); // Also: '[]' => 0
+                }
+                return retrieveRawValue(data, dataIndex, dim);
+            });
+        }
+    },
+
+    /**
+     * Get raw value in option
+     * @param {number} idx
+     * @param {string} [dataType]
+     * @return {Array|number|string}
+     */
+    getRawValue: function (idx, dataType) {
+        return retrieveRawValue(this.getData(dataType), idx);
+    },
+
+    /**
+     * Should be implemented.
+     * @param {number} dataIndex
+     * @param {boolean} [multipleSeries=false]
+     * @param {number} [dataType]
+     * @return {string} tooltip string
+     */
+    formatTooltip: function () {
+        // Empty function
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} define
+ * @return See the return of `createTask`.
+ */
+function createTask(define) {
+    return new Task(define);
+}
+
+/**
+ * @constructor
+ * @param {Object} define
+ * @param {Function} define.reset Custom reset
+ * @param {Function} [define.plan] Returns 'reset' indicate reset immediately.
+ * @param {Function} [define.count] count is used to determin data task.
+ * @param {Function} [define.onDirty] count is used to determin data task.
+ */
+function Task(define) {
+    define = define || {};
+
+    this._reset = define.reset;
+    this._plan = define.plan;
+    this._count = define.count;
+    this._onDirty = define.onDirty;
+
+    this._dirty = true;
+
+    // Context must be specified implicitly, to
+    // avoid miss update context when model changed.
+    this.context;
+}
+
+var taskProto = Task.prototype;
+
+/**
+ * @param {Object} performArgs
+ * @param {number} [performArgs.step] Specified step.
+ * @param {number} [performArgs.skip] Skip customer perform call.
+ * @param {number} [performArgs.modBy] Sampling window size.
+ * @param {number} [performArgs.modDataCount] Sampling count.
+ */
+taskProto.perform = function (performArgs) {
+    var upTask = this._upstream;
+    var skip = performArgs && performArgs.skip;
+
+    // TODO some refactor.
+    // Pull data. Must pull data each time, because context.data
+    // may be updated by Series.setData.
+    if (this._dirty && upTask) {
+        var context = this.context;
+        context.data = context.outputData = upTask.context.outputData;
+    }
+
+    if (this.__pipeline) {
+        this.__pipeline.currentTask = this;
+    }
+
+    var planResult;
+    if (this._plan && !skip) {
+        planResult = this._plan(this.context);
+    }
+
+    // Support sharding by mod, which changes the render sequence and makes the rendered graphic
+    // elements uniformed distributed when progress, especially when moving or zooming.
+    var lastModBy = normalizeModBy(this._modBy);
+    var lastModDataCount = this._modDataCount || 0;
+    var modBy = normalizeModBy(performArgs && performArgs.modBy);
+    var modDataCount = performArgs && performArgs.modDataCount || 0;
+    if (lastModBy !== modBy || lastModDataCount !== modDataCount) {
+        planResult = 'reset';
+    }
+
+    function normalizeModBy(val) {
+        !(val >= 1) && (val = 1); // jshint ignore:line
+        return val;
+    }
+
+    var forceFirstProgress;
+    if (this._dirty || planResult === 'reset') {
+        this._dirty = false;
+        forceFirstProgress = reset(this, skip);
+    }
+
+    this._modBy = modBy;
+    this._modDataCount = modDataCount;
+
+    var step = performArgs && performArgs.step;
+
+    if (upTask) {
+
+        if (__DEV__) {
+            assert$1(upTask._outputDueEnd != null);
+        }
+        this._dueEnd = upTask._outputDueEnd;
+    }
+    // DataTask or overallTask
+    else {
+        if (__DEV__) {
+            assert$1(!this._progress || this._count);
+        }
+        this._dueEnd = this._count ? this._count(this.context) : Infinity;
+    }
+
+    // Note: Stubs, that its host overall task let it has progress, has progress.
+    // If no progress, pass index from upstream to downstream each time plan called.
+    if (this._progress) {
+        var start = this._dueIndex;
+        var end = Math.min(
+            step != null ? this._dueIndex + step : Infinity,
+            this._dueEnd
+        );
+
+        if (!skip && (forceFirstProgress || start < end)) {
+            var progress = this._progress;
+            if (isArray(progress)) {
+                for (var i = 0; i < progress.length; i++) {
+                    doProgress(this, progress[i], start, end, modBy, modDataCount);
+                }
+            }
+            else {
+                doProgress(this, progress, start, end, modBy, modDataCount);
+            }
+        }
+
+        this._dueIndex = end;
+        // If no `outputDueEnd`, assume that output data and
+        // input data is the same, so use `dueIndex` as `outputDueEnd`.
+        var outputDueEnd = this._settedOutputEnd != null
+            ? this._settedOutputEnd : end;
+
+        if (__DEV__) {
+            // ??? Can not rollback.
+            assert$1(outputDueEnd >= this._outputDueEnd);
+        }
+
+        this._outputDueEnd = outputDueEnd;
+    }
+    else {
+        // (1) Some overall task has no progress.
+        // (2) Stubs, that its host overall task do not let it has progress, has no progress.
+        // This should always be performed so it can be passed to downstream.
+        this._dueIndex = this._outputDueEnd = this._settedOutputEnd != null
+            ? this._settedOutputEnd : this._dueEnd;
+    }
+
+    return this.unfinished();
+};
+
+var iterator = (function () {
+
+    var end;
+    var current;
+    var modBy;
+    var modDataCount;
+    var winCount;
+
+    var it = {
+        reset: function (s, e, sStep, sCount) {
+            current = s;
+            end = e;
+
+            modBy = sStep;
+            modDataCount = sCount;
+            winCount = Math.ceil(modDataCount / modBy);
+
+            it.next = (modBy > 1 && modDataCount > 0) ? modNext : sequentialNext;
+        }
+    };
+
+    return it;
+
+    function sequentialNext() {
+        return current < end ? current++ : null;
+    }
+
+    function modNext() {
+        var dataIndex = (current % winCount) * modBy + Math.ceil(current / winCount);
+        var result = current >= end
+            ? null
+            : dataIndex < modDataCount
+            ? dataIndex
+            // If modDataCount is smaller than data.count() (consider `appendData` case),
+            // Use normal linear rendering mode.
+            : current;
+        current++;
+        return result;
+    }
+})();
+
+taskProto.dirty = function () {
+    this._dirty = true;
+    this._onDirty && this._onDirty(this.context);
+};
+
+function doProgress(taskIns, progress, start, end, modBy, modDataCount) {
+    iterator.reset(start, end, modBy, modDataCount);
+    taskIns._callingProgress = progress;
+    taskIns._callingProgress({
+        start: start, end: end, count: end - start, next: iterator.next
+    }, taskIns.context);
+}
+
+function reset(taskIns, skip) {
+    taskIns._dueIndex = taskIns._outputDueEnd = taskIns._dueEnd = 0;
+    taskIns._settedOutputEnd = null;
+
+    var progress;
+    var forceFirstProgress;
+
+    if (!skip && taskIns._reset) {
+        progress = taskIns._reset(taskIns.context);
+        if (progress && progress.progress) {
+            forceFirstProgress = progress.forceFirstProgress;
+            progress = progress.progress;
+        }
+        // To simplify no progress checking, array must has item.
+        if (isArray(progress) && !progress.length) {
+            progress = null;
+        }
+    }
+
+    taskIns._progress = progress;
+    taskIns._modBy = taskIns._modDataCount = null;
+
+    var downstream = taskIns._downstream;
+    downstream && downstream.dirty();
+
+    return forceFirstProgress;
+}
+
+/**
+ * @return {boolean}
+ */
+taskProto.unfinished = function () {
+    return this._progress && this._dueIndex < this._dueEnd;
+};
+
+/**
+ * @param {Object} downTask The downstream task.
+ * @return {Object} The downstream task.
+ */
+taskProto.pipe = function (downTask) {
+    if (__DEV__) {
+        assert$1(downTask && !downTask._disposed && downTask !== this);
+    }
+
+    // If already downstream, do not dirty downTask.
+    if (this._downstream !== downTask || this._dirty) {
+        this._downstream = downTask;
+        downTask._upstream = this;
+        downTask.dirty();
+    }
+};
+
+taskProto.dispose = function () {
+    if (this._disposed) {
+        return;
+    }
+
+    this._upstream && (this._upstream._downstream = null);
+    this._downstream && (this._downstream._upstream = null);
+
+    this._dirty = false;
+    this._disposed = true;
+};
+
+taskProto.getUpstream = function () {
+    return this._upstream;
+};
+
+taskProto.getDownstream = function () {
+    return this._downstream;
+};
+
+taskProto.setOutputEnd = function (end) {
+    // This only happend in dataTask, dataZoom, map, currently.
+    // where dataZoom do not set end each time, but only set
+    // when reset. So we should record the setted end, in case
+    // that the stub of dataZoom perform again and earse the
+    // setted end by upstream.
+    this._outputDueEnd = this._settedOutputEnd = end;
+};
+
+
+///////////////////////////////////////////////////////////
+// For stream debug (Should be commented out after used!)
+// Usage: printTask(this, 'begin');
+// Usage: printTask(this, null, {someExtraProp});
+// function printTask(task, prefix, extra) {
+//     window.ecTaskUID == null && (window.ecTaskUID = 0);
+//     task.uidDebug == null && (task.uidDebug = `task_${window.ecTaskUID++}`);
+//     task.agent && task.agent.uidDebug == null && (task.agent.uidDebug = `task_${window.ecTaskUID++}`);
+//     var props = [];
+//     if (task.__pipeline) {
+//         var val = `${task.__idxInPipeline}/${task.__pipeline.tail.__idxInPipeline} ${task.agent ? '(stub)' : ''}`;
+//         props.push({text: 'idx', value: val});
+//     } else {
+//         var stubCount = 0;
+//         task.agentStubMap.each(() => stubCount++);
+//         props.push({text: 'idx', value: `overall (stubs: ${stubCount})`});
+//     }
+//     props.push({text: 'uid', value: task.uidDebug});
+//     if (task.__pipeline) {
+//         props.push({text: 'pid', value: task.__pipeline.id});
+//         task.agent && props.push(
+//             {text: 'stubFor', value: task.agent.uidDebug}
+//         );
+//     }
+//     props.push(
+//         {text: 'dirty', value: task._dirty},
+//         {text: 'dueIndex', value: task._dueIndex},
+//         {text: 'dueEnd', value: task._dueEnd},
+//         {text: 'outputDueEnd', value: task._outputDueEnd}
+//     );
+//     if (extra) {
+//         Object.keys(extra).forEach(key => {
+//             props.push({text: key, value: extra[key]});
+//         });
+//     }
+//     var args = ['color: blue'];
+//     var msg = `%c[${prefix || 'T'}] %c` + props.map(item => (
+//         args.push('color: black', 'color: red'),
+//         `${item.text}: %c${item.value}`
+//     )).join('%c, ');
+//     console.log.apply(console, [msg].concat(args));
+//     // console.log(this);
+// }
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$4 = makeInner();
+
+var SeriesModel = ComponentModel.extend({
+
+    type: 'series.__base__',
+
+    /**
+     * @readOnly
+     */
+    seriesIndex: 0,
+
+    // coodinateSystem will be injected in the echarts/CoordinateSystem
+    coordinateSystem: null,
+
+    /**
+     * @type {Object}
+     * @protected
+     */
+    defaultOption: null,
+
+    /**
+     * Data provided for legend
+     * @type {Function}
+     */
+    // PENDING
+    legendDataProvider: null,
+
+    /**
+     * Access path of color for visual
+     */
+    visualColorAccessPath: 'itemStyle.color',
+
+    /**
+     * Support merge layout params.
+     * Only support 'box' now (left/right/top/bottom/width/height).
+     * @type {string|Object} Object can be {ignoreSize: true}
+     * @readOnly
+     */
+    layoutMode: null,
+
+    init: function (option, parentModel, ecModel, extraOpt) {
+
+        /**
+         * @type {number}
+         * @readOnly
+         */
+        this.seriesIndex = this.componentIndex;
+
+        this.dataTask = createTask({
+            count: dataTaskCount,
+            reset: dataTaskReset
+        });
+        this.dataTask.context = {model: this};
+
+        this.mergeDefaultAndTheme(option, ecModel);
+
+        prepareSource(this);
+
+
+        var data = this.getInitialData(option, ecModel);
+        wrapData(data, this);
+        this.dataTask.context.data = data;
+
+        if (__DEV__) {
+            assert$1(data, 'getInitialData returned invalid data.');
+        }
+
+        /**
+         * @type {module:echarts/data/List|module:echarts/data/Tree|module:echarts/data/Graph}
+         * @private
+         */
+        inner$4(this).dataBeforeProcessed = data;
+
+        // If we reverse the order (make data firstly, and then make
+        // dataBeforeProcessed by cloneShallow), cloneShallow will
+        // cause data.graph.data !== data when using
+        // module:echarts/data/Graph or module:echarts/data/Tree.
+        // See module:echarts/data/helper/linkList
+
+        // Theoretically, it is unreasonable to call `seriesModel.getData()` in the model
+        // init or merge stage, because the data can be restored. So we do not `restoreData`
+        // and `setData` here, which forbids calling `seriesModel.getData()` in this stage.
+        // Call `seriesModel.getRawData()` instead.
+        // this.restoreData();
+
+        autoSeriesName(this);
+    },
+
+    /**
+     * Util for merge default and theme to option
+     * @param  {Object} option
+     * @param  {module:echarts/model/Global} ecModel
+     */
+    mergeDefaultAndTheme: function (option, ecModel) {
+        var layoutMode = this.layoutMode;
+        var inputPositionParams = layoutMode
+            ? getLayoutParams(option) : {};
+
+        // Backward compat: using subType on theme.
+        // But if name duplicate between series subType
+        // (for example: parallel) add component mainType,
+        // add suffix 'Series'.
+        var themeSubType = this.subType;
+        if (ComponentModel.hasClass(themeSubType)) {
+            themeSubType += 'Series';
+        }
+        merge(
+            option,
+            ecModel.getTheme().get(this.subType)
+        );
+        merge(option, this.getDefaultOption());
+
+        // Default label emphasis `show`
+        defaultEmphasis(option, 'label', ['show']);
+
+        this.fillDataTextStyle(option.data);
+
+        if (layoutMode) {
+            mergeLayoutParam(option, inputPositionParams, layoutMode);
+        }
+    },
+
+    mergeOption: function (newSeriesOption, ecModel) {
+        // this.settingTask.dirty();
+
+        newSeriesOption = merge(this.option, newSeriesOption, true);
+        this.fillDataTextStyle(newSeriesOption.data);
+
+        var layoutMode = this.layoutMode;
+        if (layoutMode) {
+            mergeLayoutParam(this.option, newSeriesOption, layoutMode);
+        }
+
+        prepareSource(this);
+
+        var data = this.getInitialData(newSeriesOption, ecModel);
+        wrapData(data, this);
+        this.dataTask.dirty();
+        this.dataTask.context.data = data;
+
+        inner$4(this).dataBeforeProcessed = data;
+
+        autoSeriesName(this);
+    },
+
+    fillDataTextStyle: function (data) {
+        // Default data label emphasis `show`
+        // FIXME Tree structure data ?
+        // FIXME Performance ?
+        if (data && !isTypedArray(data)) {
+            var props = ['show'];
+            for (var i = 0; i < data.length; i++) {
+                if (data[i] && data[i].label) {
+                    defaultEmphasis(data[i], 'label', props);
+                }
+            }
+        }
+    },
+
+    /**
+     * Init a data structure from data related option in series
+     * Must be overwritten
+     */
+    getInitialData: function () {},
+
+    /**
+     * Append data to list
+     * @param {Object} params
+     * @param {Array|TypedArray} params.data
+     */
+    appendData: function (params) {
+        // FIXME ???
+        // (1) If data from dataset, forbidden append.
+        // (2) support append data of dataset.
+        var data = this.getRawData();
+        data.appendData(params.data);
+    },
+
+    /**
+     * Consider some method like `filter`, `map` need make new data,
+     * We should make sure that `seriesModel.getData()` get correct
+     * data in the stream procedure. So we fetch data from upstream
+     * each time `task.perform` called.
+     * @param {string} [dataType]
+     * @return {module:echarts/data/List}
+     */
+    getData: function (dataType) {
+        var task = getCurrentTask(this);
+        if (task) {
+            var data = task.context.data;
+            return dataType == null ? data : data.getLinkedData(dataType);
+        }
+        else {
+            // When series is not alive (that may happen when click toolbox
+            // restore or setOption with not merge mode), series data may
+            // be still need to judge animation or something when graphic
+            // elements want to know whether fade out.
+            return inner$4(this).data;
+        }
+    },
+
+    /**
+     * @param {module:echarts/data/List} data
+     */
+    setData: function (data) {
+        var task = getCurrentTask(this);
+        if (task) {
+            var context = task.context;
+            // Consider case: filter, data sample.
+            if (context.data !== data && task.modifyOutputEnd) {
+                task.setOutputEnd(data.count());
+            }
+            context.outputData = data;
+            // Caution: setData should update context.data,
+            // Because getData may be called multiply in a
+            // single stage and expect to get the data just
+            // set. (For example, AxisProxy, x y both call
+            // getData and setDate sequentially).
+            // So the context.data should be fetched from
+            // upstream each time when a stage starts to be
+            // performed.
+            if (task !== this.dataTask) {
+                context.data = data;
+            }
+        }
+        inner$4(this).data = data;
+    },
+
+    /**
+     * @see {module:echarts/data/helper/sourceHelper#getSource}
+     * @return {module:echarts/data/Source} source
+     */
+    getSource: function () {
+        return getSource(this);
+    },
+
+    /**
+     * Get data before processed
+     * @return {module:echarts/data/List}
+     */
+    getRawData: function () {
+        return inner$4(this).dataBeforeProcessed;
+    },
+
+    /**
+     * Get base axis if has coordinate system and has axis.
+     * By default use coordSys.getBaseAxis();
+     * Can be overrided for some chart.
+     * @return {type} description
+     */
+    getBaseAxis: function () {
+        var coordSys = this.coordinateSystem;
+        return coordSys && coordSys.getBaseAxis && coordSys.getBaseAxis();
+    },
+
+    // FIXME
+    /**
+     * Default tooltip formatter
+     *
+     * @param {number} dataIndex
+     * @param {boolean} [multipleSeries=false]
+     * @param {number} [dataType]
+     */
+    formatTooltip: function (dataIndex, multipleSeries, dataType) {
+
+        function formatArrayValue(value) {
+            // ??? TODO refactor these logic.
+            // check: category-no-encode-has-axis-data in dataset.html
+            var vertially = reduce(value, function (vertially, val, idx) {
+                var dimItem = data.getDimensionInfo(idx);
+                return vertially |= dimItem && dimItem.tooltip !== false && dimItem.displayName != null;
+            }, 0);
+
+            var result = [];
+
+            tooltipDims.length
+                ? each$1(tooltipDims, function (dim) {
+                    setEachItem(retrieveRawValue(data, dataIndex, dim), dim);
+                })
+                // By default, all dims is used on tooltip.
+                : each$1(value, setEachItem);
+
+            function setEachItem(val, dim) {
+                var dimInfo = data.getDimensionInfo(dim);
+                // If `dimInfo.tooltip` is not set, show tooltip.
+                if (!dimInfo || dimInfo.otherDims.tooltip === false) {
+                    return;
+                }
+                var dimType = dimInfo.type;
+                var dimHead = getTooltipMarker({color: color, type: 'subItem'});
+                var valStr = (vertially
+                        ? dimHead + encodeHTML(dimInfo.displayName || '-') + ': '
+                        : ''
+                    )
+                    // FIXME should not format time for raw data?
+                    + encodeHTML(dimType === 'ordinal'
+                        ? val + ''
+                        : dimType === 'time'
+                        ? (multipleSeries ? '' : formatTime('yyyy/MM/dd hh:mm:ss', val))
+                        : addCommas(val)
+                    );
+                valStr && result.push(valStr);
+            }
+
+            return (vertially ? '<br/>' : '') + result.join(vertially ? '<br/>' : ', ');
+        }
+
+        function formatSingleValue(val) {
+            return encodeHTML(addCommas(val));
+        }
+
+        var data = this.getData();
+        var tooltipDims = data.mapDimension('defaultedTooltip', true);
+        var tooltipDimLen = tooltipDims.length;
+        var value = this.getRawValue(dataIndex);
+        var isValueArr = isArray(value);
+
+        var color = data.getItemVisual(dataIndex, 'color');
+        if (isObject$1(color) && color.colorStops) {
+            color = (color.colorStops[0] || {}).color;
+        }
+        color = color || 'transparent';
+
+        // Complicated rule for pretty tooltip.
+        var formattedValue = (tooltipDimLen > 1 || (isValueArr && !tooltipDimLen))
+            ? formatArrayValue(value)
+            : tooltipDimLen
+            ? formatSingleValue(retrieveRawValue(data, dataIndex, tooltipDims[0]))
+            : formatSingleValue(isValueArr ? value[0] : value);
+
+        var colorEl = getTooltipMarker(color);
+
+        var name = data.getName(dataIndex);
+
+        var seriesName = this.name;
+        if (!isNameSpecified(this)) {
+            seriesName = '';
+        }
+        seriesName = seriesName
+            ? encodeHTML(seriesName) + (!multipleSeries ? '<br/>' : ': ')
+            : '';
+
+        return !multipleSeries
+            ? seriesName + colorEl
+                + (name
+                    ? encodeHTML(name) + ': ' + formattedValue
+                    : formattedValue
+                )
+            : colorEl + seriesName + formattedValue;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    isAnimationEnabled: function () {
+        if (env$1.node) {
+            return false;
+        }
+
+        var animationEnabled = this.getShallow('animation');
+        if (animationEnabled) {
+            if (this.getData().count() > this.getShallow('animationThreshold')) {
+                animationEnabled = false;
+            }
+        }
+        return animationEnabled;
+    },
+
+    restoreData: function () {
+        this.dataTask.dirty();
+    },
+
+    getColorFromPalette: function (name, scope, requestColorNum) {
+        var ecModel = this.ecModel;
+        // PENDING
+        var color = colorPaletteMixin.getColorFromPalette.call(this, name, scope, requestColorNum);
+        if (!color) {
+            color = ecModel.getColorFromPalette(name, scope, requestColorNum);
+        }
+        return color;
+    },
+
+    /**
+     * Use `data.mapDimension(coordDim, true)` instead.
+     * @deprecated
+     */
+    coordDimToDataDim: function (coordDim) {
+        return this.getRawData().mapDimension(coordDim, true);
+    },
+
+    /**
+     * Get progressive rendering count each step
+     * @return {number}
+     */
+    getProgressive: function () {
+        return this.get('progressive');
+    },
+
+    /**
+     * Get progressive rendering count each step
+     * @return {number}
+     */
+    getProgressiveThreshold: function () {
+        return this.get('progressiveThreshold');
+    },
+
+    /**
+     * Get data indices for show tooltip content. See tooltip.
+     * @abstract
+     * @param {Array.<string>|string} dim
+     * @param {Array.<number>} value
+     * @param {module:echarts/coord/single/SingleAxis} baseAxis
+     * @return {Object} {dataIndices, nestestValue}.
+     */
+    getAxisTooltipData: null,
+
+    /**
+     * See tooltip.
+     * @abstract
+     * @param {number} dataIndex
+     * @return {Array.<number>} Point of tooltip. null/undefined can be returned.
+     */
+    getTooltipPosition: null,
+
+    /**
+     * @see {module:echarts/stream/Scheduler}
+     */
+    pipeTask: null,
+
+    /**
+     * Convinient for override in extended class.
+     * @protected
+     * @type {Function}
+     */
+    preventIncremental: null,
+
+    /**
+     * @public
+     * @readOnly
+     * @type {Object}
+     */
+    pipelineContext: null
+
+});
+
+
+mixin(SeriesModel, dataFormatMixin);
+mixin(SeriesModel, colorPaletteMixin);
+
+/**
+ * MUST be called after `prepareSource` called
+ * Here we need to make auto series, especially for auto legend. But we
+ * do not modify series.name in option to avoid side effects.
+ */
+function autoSeriesName(seriesModel) {
+    // User specified name has higher priority, otherwise it may cause
+    // series can not be queried unexpectedly.
+    var name = seriesModel.name;
+    if (!isNameSpecified(seriesModel)) {
+        seriesModel.name = getSeriesAutoName(seriesModel) || name;
+    }
+}
+
+function getSeriesAutoName(seriesModel) {
+    var data = seriesModel.getRawData();
+    var dataDims = data.mapDimension('seriesName', true);
+    var nameArr = [];
+    each$1(dataDims, function (dataDim) {
+        var dimInfo = data.getDimensionInfo(dataDim);
+        dimInfo.displayName && nameArr.push(dimInfo.displayName);
+    });
+    return nameArr.join(' ');
+}
+
+function dataTaskCount(context) {
+    return context.model.getRawData().count();
+}
+
+function dataTaskReset(context) {
+    var seriesModel = context.model;
+    seriesModel.setData(seriesModel.getRawData().cloneShallow());
+    return dataTaskProgress;
+}
+
+function dataTaskProgress(param, context) {
+    // Avoid repead cloneShallow when data just created in reset.
+    if (param.end > context.outputData.count()) {
+        context.model.getRawData().cloneShallow(context.outputData);
+    }
+}
+
+// TODO refactor
+function wrapData(data, seriesModel) {
+    each$1(data.CHANGABLE_METHODS, function (methodName) {
+        data.wrapMethod(methodName, curry(onDataSelfChange, seriesModel));
+    });
+}
+
+function onDataSelfChange(seriesModel) {
+    var task = getCurrentTask(seriesModel);
+    if (task) {
+        // Consider case: filter, selectRange
+        task.setOutputEnd(this.count());
+    }
+}
+
+function getCurrentTask(seriesModel) {
+    var scheduler = (seriesModel.ecModel || {}).scheduler;
+    var pipeline = scheduler && scheduler.getPipeline(seriesModel.uid);
+
+    if (pipeline) {
+        // When pipline finished, the currrentTask keep the last
+        // task (renderTask).
+        var task = pipeline.currentTask;
+        if (task) {
+            var agentStubMap = task.agentStubMap;
+            if (agentStubMap) {
+                task = agentStubMap.get(seriesModel.uid);
+            }
+        }
+        return task;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var Component = function () {
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = new Group();
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.uid = getUID('viewComponent');
+};
+
+Component.prototype = {
+
+    constructor: Component,
+
+    init: function (ecModel, api) {},
+
+    render: function (componentModel, ecModel, api, payload) {},
+
+    dispose: function () {}
+
+};
+
+var componentProto = Component.prototype;
+componentProto.updateView
+    = componentProto.updateLayout
+    = componentProto.updateVisual
+    = function (seriesModel, ecModel, api, payload) {
+        // Do nothing;
+    };
+// Enable Component.extend.
+enableClassExtend(Component);
+
+// Enable capability of registerClass, getClass, hasClass, registerSubTypeDefaulter and so on.
+enableClassManagement(Component, {registerWhenExtend: true});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @return {string} If large mode changed, return string 'reset';
+ */
+var createRenderPlanner = function () {
+    var inner = makeInner();
+
+    return function (seriesModel) {
+        var fields = inner(seriesModel);
+        var pipelineContext = seriesModel.pipelineContext;
+
+        var originalLarge = fields.large;
+        var originalProgressive = fields.progressiveRender;
+
+        var large = fields.large = pipelineContext.large;
+        var progressive = fields.progressiveRender = pipelineContext.progressiveRender;
+
+        return !!((originalLarge ^ large) || (originalProgressive ^ progressive)) && 'reset';
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$5 = makeInner();
+var renderPlanner = createRenderPlanner();
+
+function Chart() {
+
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = new Group();
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.uid = getUID('viewChart');
+
+    this.renderTask = createTask({
+        plan: renderTaskPlan,
+        reset: renderTaskReset
+    });
+    this.renderTask.context = {view: this};
+}
+
+Chart.prototype = {
+
+    type: 'chart',
+
+    /**
+     * Init the chart.
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    init: function (ecModel, api) {},
+
+    /**
+     * Render the chart.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    render: function (seriesModel, ecModel, api, payload) {},
+
+    /**
+     * Highlight series or specified data item.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    highlight: function (seriesModel, ecModel, api, payload) {
+        toggleHighlight(seriesModel.getData(), payload, 'emphasis');
+    },
+
+    /**
+     * Downplay series or specified data item.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    downplay: function (seriesModel, ecModel, api, payload) {
+        toggleHighlight(seriesModel.getData(), payload, 'normal');
+    },
+
+    /**
+     * Remove self.
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    remove: function (ecModel, api) {
+        this.group.removeAll();
+    },
+
+    /**
+     * Dispose self.
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    dispose: function () {},
+
+    /**
+     * Rendering preparation in progressive mode.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    incrementalPrepareRender: null,
+
+    /**
+     * Render in progressive mode.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     */
+    incrementalRender: null,
+
+    /**
+     * Update transform directly.
+     * @param  {module:echarts/model/Series} seriesModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @param  {Object} payload
+     * @return {Object} {update: true}
+     */
+    updateTransform: null
+
+    /**
+     * The view contains the given point.
+     * @interface
+     * @param {Array.<number>} point
+     * @return {boolean}
+     */
+    // containPoint: function () {}
+
+};
+
+var chartProto = Chart.prototype;
+chartProto.updateView
+    = chartProto.updateLayout
+    = chartProto.updateVisual
+    = function (seriesModel, ecModel, api, payload) {
+        this.render(seriesModel, ecModel, api, payload);
+    };
+
+/**
+ * Set state of single element
+ * @param  {module:zrender/Element} el
+ * @param  {string} state
+ */
+function elSetState(el, state) {
+    if (el) {
+        el.trigger(state);
+        if (el.type === 'group') {
+            for (var i = 0; i < el.childCount(); i++) {
+                elSetState(el.childAt(i), state);
+            }
+        }
+    }
+}
+/**
+ * @param  {module:echarts/data/List} data
+ * @param  {Object} payload
+ * @param  {string} state 'normal'|'emphasis'
+ */
+function toggleHighlight(data, payload, state) {
+    var dataIndex = queryDataIndex(data, payload);
+
+    if (dataIndex != null) {
+        each$1(normalizeToArray(dataIndex), function (dataIdx) {
+            elSetState(data.getItemGraphicEl(dataIdx), state);
+        });
+    }
+    else {
+        data.eachItemGraphicEl(function (el) {
+            elSetState(el, state);
+        });
+    }
+}
+
+// Enable Chart.extend.
+enableClassExtend(Chart, ['dispose']);
+
+// Add capability of registerClass, getClass, hasClass, registerSubTypeDefaulter and so on.
+enableClassManagement(Chart, {registerWhenExtend: true});
+
+Chart.markUpdateMethod = function (payload, methodName) {
+    inner$5(payload).updateMethod = methodName;
+};
+
+function renderTaskPlan(context) {
+    return renderPlanner(context.model);
+}
+
+function renderTaskReset(context) {
+    var seriesModel = context.model;
+    var ecModel = context.ecModel;
+    var api = context.api;
+    var payload = context.payload;
+    // ???! remove updateView updateVisual
+    var progressiveRender = seriesModel.pipelineContext.progressiveRender;
+    var view = context.view;
+
+    var updateMethod = payload && inner$5(payload).updateMethod;
+    var methodName = progressiveRender
+        ? 'incrementalPrepareRender'
+        : (updateMethod && view[updateMethod])
+        ? updateMethod
+        // `appendData` is also supported when data amount
+        // is less than progressive threshold.
+        : 'render';
+
+    if (methodName !== 'render') {
+        view[methodName](seriesModel, ecModel, api, payload);
+    }
+
+    return progressMethodMap[methodName];
+}
+
+var progressMethodMap = {
+    incrementalPrepareRender: {
+        progress: function (params, context) {
+            context.view.incrementalRender(
+                params, context.model, context.ecModel, context.api, context.payload
+            );
+        }
+    },
+    render: {
+        // Put view.render in `progress` to support appendData. But in this case
+        // view.render should not be called in reset, otherwise it will be called
+        // twise. Use `forceFirstProgress` to make sure that view.render is called
+        // in any cases.
+        forceFirstProgress: true,
+        progress: function (params, context) {
+            context.view.render(
+                context.model, context.ecModel, context.api, context.payload
+            );
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var ORIGIN_METHOD = '\0__throttleOriginMethod';
+var RATE = '\0__throttleRate';
+var THROTTLE_TYPE = '\0__throttleType';
+
+/**
+ * @public
+ * @param {(Function)} fn
+ * @param {number} [delay=0] Unit: ms.
+ * @param {boolean} [debounce=false]
+ *        true: If call interval less than `delay`, only the last call works.
+ *        false: If call interval less than `delay, call works on fixed rate.
+ * @return {(Function)} throttled fn.
+ */
+function throttle(fn, delay, debounce) {
+
+    var currCall;
+    var lastCall = 0;
+    var lastExec = 0;
+    var timer = null;
+    var diff;
+    var scope;
+    var args;
+    var debounceNextCall;
+
+    delay = delay || 0;
+
+    function exec() {
+        lastExec = (new Date()).getTime();
+        timer = null;
+        fn.apply(scope, args || []);
+    }
+
+    var cb = function () {
+        currCall = (new Date()).getTime();
+        scope = this;
+        args = arguments;
+        var thisDelay = debounceNextCall || delay;
+        var thisDebounce = debounceNextCall || debounce;
+        debounceNextCall = null;
+        diff = currCall - (thisDebounce ? lastCall : lastExec) - thisDelay;
+
+        clearTimeout(timer);
+
+        // Here we should make sure that: the `exec` SHOULD NOT be called later
+        // than a new call of `cb`, that is, preserving the command order. Consider
+        // calculating "scale rate" when roaming as an example. When a call of `cb`
+        // happens, either the `exec` is called dierectly, or the call is delayed.
+        // But the delayed call should never be later than next call of `cb`. Under
+        // this assurance, we can simply update view state each time `dispatchAction`
+        // triggered by user roaming, but not need to add extra code to avoid the
+        // state being "rolled-back".
+        if (thisDebounce) {
+            timer = setTimeout(exec, thisDelay);
+        }
+        else {
+            if (diff >= 0) {
+                exec();
+            }
+            else {
+                timer = setTimeout(exec, -diff);
+            }
+        }
+
+        lastCall = currCall;
+    };
+
+    /**
+     * Clear throttle.
+     * @public
+     */
+    cb.clear = function () {
+        if (timer) {
+            clearTimeout(timer);
+            timer = null;
+        }
+    };
+
+    /**
+     * Enable debounce once.
+     */
+    cb.debounceNextCall = function (debounceDelay) {
+        debounceNextCall = debounceDelay;
+    };
+
+    return cb;
+}
+
+/**
+ * Create throttle method or update throttle rate.
+ *
+ * @example
+ * ComponentView.prototype.render = function () {
+ *     ...
+ *     throttle.createOrUpdate(
+ *         this,
+ *         '_dispatchAction',
+ *         this.model.get('throttle'),
+ *         'fixRate'
+ *     );
+ * };
+ * ComponentView.prototype.remove = function () {
+ *     throttle.clear(this, '_dispatchAction');
+ * };
+ * ComponentView.prototype.dispose = function () {
+ *     throttle.clear(this, '_dispatchAction');
+ * };
+ *
+ * @public
+ * @param {Object} obj
+ * @param {string} fnAttr
+ * @param {number} [rate]
+ * @param {string} [throttleType='fixRate'] 'fixRate' or 'debounce'
+ * @return {Function} throttled function.
+ */
+function createOrUpdate(obj, fnAttr, rate, throttleType) {
+    var fn = obj[fnAttr];
+
+    if (!fn) {
+        return;
+    }
+
+    var originFn = fn[ORIGIN_METHOD] || fn;
+    var lastThrottleType = fn[THROTTLE_TYPE];
+    var lastRate = fn[RATE];
+
+    if (lastRate !== rate || lastThrottleType !== throttleType) {
+        if (rate == null || !throttleType) {
+            return (obj[fnAttr] = originFn);
+        }
+
+        fn = obj[fnAttr] = throttle(
+            originFn, rate, throttleType === 'debounce'
+        );
+        fn[ORIGIN_METHOD] = originFn;
+        fn[THROTTLE_TYPE] = throttleType;
+        fn[RATE] = rate;
+    }
+
+    return fn;
+}
+
+/**
+ * Clear throttle. Example see throttle.createOrUpdate.
+ *
+ * @public
+ * @param {Object} obj
+ * @param {string} fnAttr
+ */
+function clear(obj, fnAttr) {
+    var fn = obj[fnAttr];
+    if (fn && fn[ORIGIN_METHOD]) {
+        obj[fnAttr] = fn[ORIGIN_METHOD];
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var seriesColor = {
+    createOnAllSeries: true,
+    performRawSeries: true,
+    reset: function (seriesModel, ecModel) {
+        var data = seriesModel.getData();
+        var colorAccessPath = (seriesModel.visualColorAccessPath || 'itemStyle.color').split('.');
+        var color = seriesModel.get(colorAccessPath) // Set in itemStyle
+            || seriesModel.getColorFromPalette(
+                // TODO series count changed.
+                seriesModel.name, null, ecModel.getSeriesCount()
+            );  // Default color
+
+        // FIXME Set color function or use the platte color
+        data.setVisual('color', color);
+
+        // Only visible series has each data be visual encoded
+        if (!ecModel.isSeriesFiltered(seriesModel)) {
+            if (typeof color === 'function' && !(color instanceof Gradient)) {
+                data.each(function (idx) {
+                    data.setItemVisual(
+                        idx, 'color', color(seriesModel.getDataParams(idx))
+                    );
+                });
+            }
+
+            // itemStyle in each data item
+            var dataEach = function (data, idx) {
+                var itemModel = data.getItemModel(idx);
+                var color = itemModel.get(colorAccessPath, true);
+                if (color != null) {
+                    data.setItemVisual(idx, 'color', color);
+                }
+            };
+
+            return { dataEach: data.hasItemOption ? dataEach : null };
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var lang = {
+    toolbox: {
+        brush: {
+            title: {
+                rect: '矩形选择',
+                polygon: '圈选',
+                lineX: '横向选择',
+                lineY: '纵向选择',
+                keep: '保持选择',
+                clear: '清除选择'
+            }
+        },
+        dataView: {
+            title: '数据视图',
+            lang: ['数据视图', '关闭', '刷新']
+        },
+        dataZoom: {
+            title: {
+                zoom: '区域缩放',
+                back: '区域缩放还原'
+            }
+        },
+        magicType: {
+            title: {
+                line: '切换为折线图',
+                bar: '切换为柱状图',
+                stack: '切换为堆叠',
+                tiled: '切换为平铺'
+            }
+        },
+        restore: {
+            title: '还原'
+        },
+        saveAsImage: {
+            title: '保存为图片',
+            lang: ['右键另存为图片']
+        }
+    },
+    series: {
+        typeNames: {
+            pie: '饼图',
+            bar: '柱状图',
+            line: '折线图',
+            scatter: '散点图',
+            effectScatter: '涟漪散点图',
+            radar: '雷达图',
+            tree: '树图',
+            treemap: '矩形树图',
+            boxplot: '箱型图',
+            candlestick: 'K线图',
+            k: 'K线图',
+            heatmap: '热力图',
+            map: '地图',
+            parallel: '平行坐标图',
+            lines: '线图',
+            graph: '关系图',
+            sankey: '桑基图',
+            funnel: '漏斗图',
+            gauge: '仪表盘图',
+            pictorialBar: '象形柱图',
+            themeRiver: '主题河流图',
+            sunburst: '旭日图'
+        }
+    },
+    aria: {
+        general: {
+            withTitle: '这是一个关于“{title}”的图表。',
+            withoutTitle: '这是一个图表，'
+        },
+        series: {
+            single: {
+                prefix: '',
+                withName: '图表类型是{seriesType}，表示{seriesName}。',
+                withoutName: '图表类型是{seriesType}。'
+            },
+            multiple: {
+                prefix: '它由{seriesCount}个图表系列组成。',
+                withName: '第{seriesId}个系列是一个表示{seriesName}的{seriesType}，',
+                withoutName: '第{seriesId}个系列是一个{seriesType}，',
+                separator: {
+                    middle: '；',
+                    end: '。'
+                }
+            }
+        },
+        data: {
+            allData: '其数据是——',
+            partialData: '其中，前{displayCnt}项是——',
+            withName: '{name}的数据是{value}',
+            withoutName: '{value}',
+            separator: {
+                middle: '，',
+                end: ''
+            }
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var aria = function (dom, ecModel) {
+    var ariaModel = ecModel.getModel('aria');
+    if (!ariaModel.get('show')) {
+        return;
+    }
+    else if (ariaModel.get('description')) {
+        dom.setAttribute('aria-label', ariaModel.get('description'));
+        return;
+    }
+
+    var seriesCnt = 0;
+    ecModel.eachSeries(function (seriesModel, idx) {
+        ++seriesCnt;
+    }, this);
+
+    var maxDataCnt = ariaModel.get('data.maxCount') || 10;
+    var maxSeriesCnt = ariaModel.get('series.maxCount') || 10;
+    var displaySeriesCnt = Math.min(seriesCnt, maxSeriesCnt);
+
+    var ariaLabel;
+    if (seriesCnt < 1) {
+        // No series, no aria label
+        return;
+    }
+    else {
+        var title = getTitle();
+        if (title) {
+            ariaLabel = replace(getConfig('general.withTitle'), {
+                title: title
+            });
+        }
+        else {
+            ariaLabel = getConfig('general.withoutTitle');
+        }
+
+        var seriesLabels = [];
+        var prefix = seriesCnt > 1
+            ? 'series.multiple.prefix'
+            : 'series.single.prefix';
+        ariaLabel += replace(getConfig(prefix), { seriesCount: seriesCnt });
+
+        ecModel.eachSeries(function (seriesModel, idx) {
+            if (idx < displaySeriesCnt) {
+                var seriesLabel;
+
+                var seriesName = seriesModel.get('name');
+                var seriesTpl = 'series.'
+                    + (seriesCnt > 1 ? 'multiple' : 'single') + '.';
+                seriesLabel = getConfig(seriesName
+                    ? seriesTpl + 'withName'
+                    : seriesTpl + 'withoutName');
+
+                seriesLabel = replace(seriesLabel, {
+                    seriesId: seriesModel.seriesIndex,
+                    seriesName: seriesModel.get('name'),
+                    seriesType: getSeriesTypeName(seriesModel.subType)
+                });
+
+                var data = seriesModel.getData();
+                window.data = data;
+                if (data.count() > maxDataCnt) {
+                    // Show part of data
+                    seriesLabel += replace(getConfig('data.partialData'), {
+                        displayCnt: maxDataCnt
+                    });
+                }
+                else {
+                    seriesLabel += getConfig('data.allData');
+                }
+
+                var dataLabels = [];
+                for (var i = 0; i < data.count(); i++) {
+                    if (i < maxDataCnt) {
+                        var name = data.getName(i);
+                        var value = retrieveRawValue(data, i);
+                        dataLabels.push(
+                            replace(
+                                name
+                                    ? getConfig('data.withName')
+                                    : getConfig('data.withoutName'),
+                                {
+                                    name: name,
+                                    value: value
+                                }
+                            )
+                        );
+                    }
+                }
+                seriesLabel += dataLabels
+                    .join(getConfig('data.separator.middle'))
+                    + getConfig('data.separator.end');
+
+                seriesLabels.push(seriesLabel);
+            }
+        });
+
+        ariaLabel += seriesLabels
+            .join(getConfig('series.multiple.separator.middle'))
+            + getConfig('series.multiple.separator.end');
+
+        dom.setAttribute('aria-label', ariaLabel);
+    }
+
+    function replace(str, keyValues) {
+        if (typeof str !== 'string') {
+            return str;
+        }
+
+        var result = str;
+        each$1(keyValues, function (value, key) {
+            result = result.replace(
+                new RegExp('\\{\\s*' + key + '\\s*\\}', 'g'),
+                value
+            );
+        });
+        return result;
+    }
+
+    function getConfig(path) {
+        var userConfig = ariaModel.get(path);
+        if (userConfig == null) {
+            var pathArr = path.split('.');
+            var result = lang.aria;
+            for (var i = 0; i < pathArr.length; ++i) {
+                result = result[pathArr[i]];
+            }
+            return result;
+        }
+        else {
+            return userConfig;
+        }
+    }
+
+    function getTitle() {
+        var title = ecModel.getModel('title').option;
+        if (title && title.length) {
+            title = title[0];
+        }
+        return title && title.text;
+    }
+
+    function getSeriesTypeName(type) {
+        return lang.series.typeNames[type] || '自定义图';
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PI$1 = Math.PI;
+
+/**
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Object} [opts]
+ * @param {string} [opts.text]
+ * @param {string} [opts.color]
+ * @param {string} [opts.textColor]
+ * @return {module:zrender/Element}
+ */
+var loadingDefault = function (api, opts) {
+    opts = opts || {};
+    defaults(opts, {
+        text: 'loading',
+        color: '#c23531',
+        textColor: '#000',
+        maskColor: 'rgba(255, 255, 255, 0.8)',
+        zlevel: 0
+    });
+    var mask = new Rect({
+        style: {
+            fill: opts.maskColor
+        },
+        zlevel: opts.zlevel,
+        z: 10000
+    });
+    var arc = new Arc({
+        shape: {
+            startAngle: -PI$1 / 2,
+            endAngle: -PI$1 / 2 + 0.1,
+            r: 10
+        },
+        style: {
+            stroke: opts.color,
+            lineCap: 'round',
+            lineWidth: 5
+        },
+        zlevel: opts.zlevel,
+        z: 10001
+    });
+    var labelRect = new Rect({
+        style: {
+            fill: 'none',
+            text: opts.text,
+            textPosition: 'right',
+            textDistance: 10,
+            textFill: opts.textColor
+        },
+        zlevel: opts.zlevel,
+        z: 10001
+    });
+
+    arc.animateShape(true)
+        .when(1000, {
+            endAngle: PI$1 * 3 / 2
+        })
+        .start('circularInOut');
+    arc.animateShape(true)
+        .when(1000, {
+            startAngle: PI$1 * 3 / 2
+        })
+        .delay(300)
+        .start('circularInOut');
+
+    var group = new Group();
+    group.add(arc);
+    group.add(labelRect);
+    group.add(mask);
+    // Inject resize
+    group.resize = function () {
+        var cx = api.getWidth() / 2;
+        var cy = api.getHeight() / 2;
+        arc.setShape({
+            cx: cx,
+            cy: cy
+        });
+        var r = arc.shape.r;
+        labelRect.setShape({
+            x: cx - r,
+            y: cy - r,
+            width: r * 2,
+            height: r * 2
+        });
+
+        mask.setShape({
+            x: 0,
+            y: 0,
+            width: api.getWidth(),
+            height: api.getHeight()
+        });
+    };
+    group.resize();
+    return group;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/stream/Scheduler
+ */
+
+/**
+ * @constructor
+ */
+function Scheduler(ecInstance, api, dataProcessorHandlers, visualHandlers) {
+    this.ecInstance = ecInstance;
+    this.api = api;
+    this.unfinished;
+
+    // Fix current processors in case that in some rear cases that
+    // processors might be registered after echarts instance created.
+    // Register processors incrementally for a echarts instance is
+    // not supported by this stream architecture.
+    var dataProcessorHandlers = this._dataProcessorHandlers = dataProcessorHandlers.slice();
+    var visualHandlers = this._visualHandlers = visualHandlers.slice();
+    this._allHandlers = dataProcessorHandlers.concat(visualHandlers);
+
+    /**
+     * @private
+     * @type {
+     *     [handlerUID: string]: {
+     *         seriesTaskMap?: {
+     *             [seriesUID: string]: Task
+     *         },
+     *         overallTask?: Task
+     *     }
+     * }
+     */
+    this._stageTaskMap = createHashMap();
+}
+
+var proto = Scheduler.prototype;
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} payload
+ */
+proto.restoreData = function (ecModel, payload) {
+    // TODO: Only restroe needed series and components, but not all components.
+    // Currently `restoreData` of all of the series and component will be called.
+    // But some independent components like `title`, `legend`, `graphic`, `toolbox`,
+    // `tooltip`, `axisPointer`, etc, do not need series refresh when `setOption`,
+    // and some components like coordinate system, axes, dataZoom, visualMap only
+    // need their target series refresh.
+    // (1) If we are implementing this feature some day, we should consider these cases:
+    // if a data processor depends on a component (e.g., dataZoomProcessor depends
+    // on the settings of `dataZoom`), it should be re-performed if the component
+    // is modified by `setOption`.
+    // (2) If a processor depends on sevral series, speicified by its `getTargetSeries`,
+    // it should be re-performed when the result array of `getTargetSeries` changed.
+    // We use `dependencies` to cover these issues.
+    // (3) How to update target series when coordinate system related components modified.
+
+    // TODO: simply the dirty mechanism? Check whether only the case here can set tasks dirty,
+    // and this case all of the tasks will be set as dirty.
+
+    ecModel.restoreData(payload);
+
+    // Theoretically an overall task not only depends on each of its target series, but also
+    // depends on all of the series.
+    // The overall task is not in pipeline, and `ecModel.restoreData` only set pipeline tasks
+    // dirty. If `getTargetSeries` of an overall task returns nothing, we should also ensure
+    // that the overall task is set as dirty and to be performed, otherwise it probably cause
+    // state chaos. So we have to set dirty of all of the overall tasks manually, otherwise it
+    // probably cause state chaos (consider `dataZoomProcessor`).
+    this._stageTaskMap.each(function (taskRecord) {
+        var overallTask = taskRecord.overallTask;
+        overallTask && overallTask.dirty();
+    });
+};
+
+// If seriesModel provided, incremental threshold is check by series data.
+proto.getPerformArgs = function (task, isBlock) {
+    // For overall task
+    if (!task.__pipeline) {
+        return;
+    }
+
+    var pipeline = this._pipelineMap.get(task.__pipeline.id);
+    var pCtx = pipeline.context;
+    var incremental = !isBlock
+        && pipeline.progressiveEnabled
+        && (!pCtx || pCtx.progressiveRender)
+        && task.__idxInPipeline > pipeline.blockIndex;
+
+    var step = incremental ? pipeline.step : null;
+    var modDataCount = pCtx && pCtx.modDataCount;
+    var modBy = modDataCount != null ? Math.ceil(modDataCount / step): null;
+
+    return {step: step, modBy: modBy, modDataCount: modDataCount};
+};
+
+proto.getPipeline = function (pipelineId) {
+    return this._pipelineMap.get(pipelineId);
+};
+
+/**
+ * Current, progressive rendering starts from visual and layout.
+ * Always detect render mode in the same stage, avoiding that incorrect
+ * detection caused by data filtering.
+ * Caution:
+ * `updateStreamModes` use `seriesModel.getData()`.
+ */
+proto.updateStreamModes = function (seriesModel, view) {
+    var pipeline = this._pipelineMap.get(seriesModel.uid);
+    var data = seriesModel.getData();
+    var dataLen = data.count();
+
+    // `progressiveRender` means that can render progressively in each
+    // animation frame. Note that some types of series do not provide
+    // `view.incrementalPrepareRender` but support `chart.appendData`. We
+    // use the term `incremental` but not `progressive` to describe the
+    // case that `chart.appendData`.
+    var progressiveRender = pipeline.progressiveEnabled
+        && view.incrementalPrepareRender
+        && dataLen >= pipeline.threshold;
+
+    var large = seriesModel.get('large') && dataLen >= seriesModel.get('largeThreshold');
+
+    // TODO: modDataCount should not updated if `appendData`, otherwise cause whole repaint.
+    // see `test/candlestick-large3.html`
+    var modDataCount = seriesModel.get('progressiveChunkMode') === 'mod' ? dataLen : null;
+
+    seriesModel.pipelineContext = pipeline.context = {
+        progressiveRender: progressiveRender,
+        modDataCount: modDataCount,
+        large: large
+    };
+};
+
+proto.restorePipelines = function (ecModel) {
+    var scheduler = this;
+    var pipelineMap = scheduler._pipelineMap = createHashMap();
+
+    ecModel.eachSeries(function (seriesModel) {
+        var progressive = seriesModel.getProgressive();
+        var pipelineId = seriesModel.uid;
+
+        pipelineMap.set(pipelineId, {
+            id: pipelineId,
+            head: null,
+            tail: null,
+            threshold: seriesModel.getProgressiveThreshold(),
+            progressiveEnabled: progressive
+                && !(seriesModel.preventIncremental && seriesModel.preventIncremental()),
+            blockIndex: -1,
+            step: Math.round(progressive || 700),
+            count: 0
+        });
+
+        pipe(scheduler, seriesModel, seriesModel.dataTask);
+    });
+};
+
+proto.prepareStageTasks = function () {
+    var stageTaskMap = this._stageTaskMap;
+    var ecModel = this.ecInstance.getModel();
+    var api = this.api;
+
+    each$1(this._allHandlers, function (handler) {
+        var record = stageTaskMap.get(handler.uid) || stageTaskMap.set(handler.uid, []);
+
+        handler.reset && createSeriesStageTask(this, handler, record, ecModel, api);
+        handler.overallReset && createOverallStageTask(this, handler, record, ecModel, api);
+    }, this);
+};
+
+proto.prepareView = function (view, model, ecModel, api) {
+    var renderTask = view.renderTask;
+    var context = renderTask.context;
+
+    context.model = model;
+    context.ecModel = ecModel;
+    context.api = api;
+
+    renderTask.__block = !view.incrementalPrepareRender;
+
+    pipe(this, model, renderTask);
+};
+
+
+proto.performDataProcessorTasks = function (ecModel, payload) {
+    // If we do not use `block` here, it should be considered when to update modes.
+    performStageTasks(this, this._dataProcessorHandlers, ecModel, payload, {block: true});
+};
+
+// opt
+// opt.visualType: 'visual' or 'layout'
+// opt.setDirty
+proto.performVisualTasks = function (ecModel, payload, opt) {
+    performStageTasks(this, this._visualHandlers, ecModel, payload, opt);
+};
+
+function performStageTasks(scheduler, stageHandlers, ecModel, payload, opt) {
+    opt = opt || {};
+    var unfinished;
+
+    each$1(stageHandlers, function (stageHandler, idx) {
+        if (opt.visualType && opt.visualType !== stageHandler.visualType) {
+            return;
+        }
+
+        var stageHandlerRecord = scheduler._stageTaskMap.get(stageHandler.uid);
+        var seriesTaskMap = stageHandlerRecord.seriesTaskMap;
+        var overallTask = stageHandlerRecord.overallTask;
+
+        if (overallTask) {
+            var overallNeedDirty;
+            var agentStubMap = overallTask.agentStubMap;
+            agentStubMap.each(function (stub) {
+                if (needSetDirty(opt, stub)) {
+                    stub.dirty();
+                    overallNeedDirty = true;
+                }
+            });
+            overallNeedDirty && overallTask.dirty();
+            updatePayload(overallTask, payload);
+            var performArgs = scheduler.getPerformArgs(overallTask, opt.block);
+            // Execute stubs firstly, which may set the overall task dirty,
+            // then execute the overall task. And stub will call seriesModel.setData,
+            // which ensures that in the overallTask seriesModel.getData() will not
+            // return incorrect data.
+            agentStubMap.each(function (stub) {
+                stub.perform(performArgs);
+            });
+            unfinished |= overallTask.perform(performArgs);
+        }
+        else if (seriesTaskMap) {
+            seriesTaskMap.each(function (task, pipelineId) {
+                if (needSetDirty(opt, task)) {
+                    task.dirty();
+                }
+                var performArgs = scheduler.getPerformArgs(task, opt.block);
+                performArgs.skip = !stageHandler.performRawSeries
+                    && ecModel.isSeriesFiltered(task.context.model);
+                updatePayload(task, payload);
+                unfinished |= task.perform(performArgs);
+            });
+        }
+    });
+
+    function needSetDirty(opt, task) {
+        return opt.setDirty && (!opt.dirtyMap || opt.dirtyMap.get(task.__pipeline.id));
+    }
+
+    scheduler.unfinished |= unfinished;
+}
+
+proto.performSeriesTasks = function (ecModel) {
+    var unfinished;
+
+    ecModel.eachSeries(function (seriesModel) {
+        // Progress to the end for dataInit and dataRestore.
+        unfinished |= seriesModel.dataTask.perform();
+    });
+
+    this.unfinished |= unfinished;
+};
+
+proto.plan = function () {
+    // Travel pipelines, check block.
+    this._pipelineMap.each(function (pipeline) {
+        var task = pipeline.tail;
+        do {
+            if (task.__block) {
+                pipeline.blockIndex = task.__idxInPipeline;
+                break;
+            }
+            task = task.getUpstream();
+        }
+        while (task);
+    });
+};
+
+var updatePayload = proto.updatePayload = function (task, payload) {
+    payload !== 'remain' && (task.context.payload = payload);
+};
+
+function createSeriesStageTask(scheduler, stageHandler, stageHandlerRecord, ecModel, api) {
+    var seriesTaskMap = stageHandlerRecord.seriesTaskMap
+        || (stageHandlerRecord.seriesTaskMap = createHashMap());
+    var seriesType = stageHandler.seriesType;
+    var getTargetSeries = stageHandler.getTargetSeries;
+
+    // If a stageHandler should cover all series, `createOnAllSeries` should be declared mandatorily,
+    // to avoid some typo or abuse. Otherwise if an extension do not specify a `seriesType`,
+    // it works but it may cause other irrelevant charts blocked.
+    if (stageHandler.createOnAllSeries) {
+        ecModel.eachRawSeries(create);
+    }
+    else if (seriesType) {
+        ecModel.eachRawSeriesByType(seriesType, create);
+    }
+    else if (getTargetSeries) {
+        getTargetSeries(ecModel, api).each(create);
+    }
+
+    function create(seriesModel) {
+        var pipelineId = seriesModel.uid;
+
+        // Init tasks for each seriesModel only once.
+        // Reuse original task instance.
+        var task = seriesTaskMap.get(pipelineId)
+            || seriesTaskMap.set(pipelineId, createTask({
+                plan: seriesTaskPlan,
+                reset: seriesTaskReset,
+                count: seriesTaskCount
+            }));
+        task.context = {
+            model: seriesModel,
+            ecModel: ecModel,
+            api: api,
+            useClearVisual: stageHandler.isVisual && !stageHandler.isLayout,
+            plan: stageHandler.plan,
+            reset: stageHandler.reset,
+            scheduler: scheduler
+        };
+        pipe(scheduler, seriesModel, task);
+    }
+
+    // Clear unused series tasks.
+    var pipelineMap = scheduler._pipelineMap;
+    seriesTaskMap.each(function (task, pipelineId) {
+        if (!pipelineMap.get(pipelineId)) {
+            task.dispose();
+            seriesTaskMap.removeKey(pipelineId);
+        }
+    });
+}
+
+function createOverallStageTask(scheduler, stageHandler, stageHandlerRecord, ecModel, api) {
+    var overallTask = stageHandlerRecord.overallTask = stageHandlerRecord.overallTask
+        // For overall task, the function only be called on reset stage.
+        || createTask({reset: overallTaskReset});
+
+    overallTask.context = {
+        ecModel: ecModel,
+        api: api,
+        overallReset: stageHandler.overallReset,
+        scheduler: scheduler
+    };
+
+    // Reuse orignal stubs.
+    var agentStubMap = overallTask.agentStubMap = overallTask.agentStubMap || createHashMap();
+
+    var seriesType = stageHandler.seriesType;
+    var getTargetSeries = stageHandler.getTargetSeries;
+    var overallProgress = true;
+    var modifyOutputEnd = stageHandler.modifyOutputEnd;
+
+    // An overall task with seriesType detected or has `getTargetSeries`, we add
+    // stub in each pipelines, it will set the overall task dirty when the pipeline
+    // progress. Moreover, to avoid call the overall task each frame (too frequent),
+    // we set the pipeline block.
+    if (seriesType) {
+        ecModel.eachRawSeriesByType(seriesType, createStub);
+    }
+    else if (getTargetSeries) {
+        getTargetSeries(ecModel, api).each(createStub);
+    }
+    // Otherwise, (usually it is legancy case), the overall task will only be
+    // executed when upstream dirty. Otherwise the progressive rendering of all
+    // pipelines will be disabled unexpectedly. But it still needs stubs to receive
+    // dirty info from upsteam.
+    else {
+        overallProgress = false;
+        each$1(ecModel.getSeries(), createStub);
+    }
+
+    function createStub(seriesModel) {
+        var pipelineId = seriesModel.uid;
+        var stub = agentStubMap.get(pipelineId);
+        if (!stub) {
+            stub = agentStubMap.set(pipelineId, createTask(
+                {reset: stubReset, onDirty: stubOnDirty}
+            ));
+            // When the result of `getTargetSeries` changed, the overallTask
+            // should be set as dirty and re-performed.
+            overallTask.dirty();
+        }
+        stub.context = {
+            model: seriesModel,
+            overallProgress: overallProgress,
+            modifyOutputEnd: modifyOutputEnd
+        };
+        stub.agent = overallTask;
+        stub.__block = overallProgress;
+
+        pipe(scheduler, seriesModel, stub);
+    }
+
+    // Clear unused stubs.
+    var pipelineMap = scheduler._pipelineMap;
+    agentStubMap.each(function (stub, pipelineId) {
+        if (!pipelineMap.get(pipelineId)) {
+            stub.dispose();
+            // When the result of `getTargetSeries` changed, the overallTask
+            // should be set as dirty and re-performed.
+            overallTask.dirty();
+            agentStubMap.removeKey(pipelineId);
+        }
+    });
+}
+
+function overallTaskReset(context) {
+    context.overallReset(
+        context.ecModel, context.api, context.payload
+    );
+}
+
+function stubReset(context, upstreamContext) {
+    return context.overallProgress && stubProgress;
+}
+
+function stubProgress() {
+    this.agent.dirty();
+    this.getDownstream().dirty();
+}
+
+function stubOnDirty() {
+    this.agent && this.agent.dirty();
+}
+
+function seriesTaskPlan(context) {
+    return context.plan && context.plan(
+        context.model, context.ecModel, context.api, context.payload
+    );
+}
+
+function seriesTaskReset(context) {
+    if (context.useClearVisual) {
+        context.data.clearAllVisual();
+    }
+    var resetDefines = context.resetDefines = normalizeToArray(context.reset(
+        context.model, context.ecModel, context.api, context.payload
+    ));
+    return resetDefines.length > 1
+        ? map(resetDefines, function (v, idx) {
+            return makeSeriesTaskProgress(idx);
+        })
+        : singleSeriesTaskProgress;
+}
+
+var singleSeriesTaskProgress = makeSeriesTaskProgress(0);
+
+function makeSeriesTaskProgress(resetDefineIdx) {
+    return function (params, context) {
+        var data = context.data;
+        var resetDefine = context.resetDefines[resetDefineIdx];
+
+        if (resetDefine && resetDefine.dataEach) {
+            for (var i = params.start; i < params.end; i++) {
+                resetDefine.dataEach(data, i);
+            }
+        }
+        else if (resetDefine && resetDefine.progress) {
+            resetDefine.progress(params, data);
+        }
+    };
+}
+
+function seriesTaskCount(context) {
+    return context.data.count();
+}
+
+function pipe(scheduler, seriesModel, task) {
+    var pipelineId = seriesModel.uid;
+    var pipeline = scheduler._pipelineMap.get(pipelineId);
+    !pipeline.head && (pipeline.head = task);
+    pipeline.tail && pipeline.tail.pipe(task);
+    pipeline.tail = task;
+    task.__idxInPipeline = pipeline.count++;
+    task.__pipeline = pipeline;
+}
+
+Scheduler.wrapStageHandler = function (stageHandler, visualType) {
+    if (isFunction$1(stageHandler)) {
+        stageHandler = {
+            overallReset: stageHandler,
+            seriesType: detectSeriseType(stageHandler)
+        };
+    }
+
+    stageHandler.uid = getUID('stageHandler');
+    visualType && (stageHandler.visualType = visualType);
+
+    return stageHandler;
+};
+
+
+
+/**
+ * Only some legacy stage handlers (usually in echarts extensions) are pure function.
+ * To ensure that they can work normally, they should work in block mode, that is,
+ * they should not be started util the previous tasks finished. So they cause the
+ * progressive rendering disabled. We try to detect the series type, to narrow down
+ * the block range to only the series type they concern, but not all series.
+ */
+function detectSeriseType(legacyFunc) {
+    seriesType = null;
+    try {
+        // Assume there is no async when calling `eachSeriesByType`.
+        legacyFunc(ecModelMock, apiMock);
+    }
+    catch (e) {
+    }
+    return seriesType;
+}
+
+var ecModelMock = {};
+var apiMock = {};
+var seriesType;
+
+mockMethods(ecModelMock, GlobalModel);
+mockMethods(apiMock, ExtensionAPI);
+ecModelMock.eachSeriesByType = ecModelMock.eachRawSeriesByType = function (type) {
+    seriesType = type;
+};
+ecModelMock.eachComponent = function (cond) {
+    if (cond.mainType === 'series' && cond.subType) {
+        seriesType = cond.subType;
+    }
+};
+
+function mockMethods(target, Clz) {
+    for (var name in Clz.prototype) {
+        // Do not use hasOwnProperty
+        target[name] = noop;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var colorAll = ['#37A2DA', '#32C5E9', '#67E0E3', '#9FE6B8', '#FFDB5C','#ff9f7f', '#fb7293', '#E062AE', '#E690D1', '#e7bcf3', '#9d96f5', '#8378EA', '#96BFFF'];
+
+var lightTheme = {
+
+    color: colorAll,
+
+    colorLayer: [
+        ['#37A2DA', '#ffd85c', '#fd7b5f'],
+        ['#37A2DA', '#67E0E3', '#FFDB5C', '#ff9f7f', '#E062AE', '#9d96f5'],
+        ['#37A2DA', '#32C5E9', '#9FE6B8', '#FFDB5C', '#ff9f7f', '#fb7293', '#e7bcf3', '#8378EA', '#96BFFF'],
+        colorAll
+    ]
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var contrastColor = '#eee';
+var axisCommon = function () {
+    return {
+        axisLine: {
+            lineStyle: {
+                color: contrastColor
+            }
+        },
+        axisTick: {
+            lineStyle: {
+                color: contrastColor
+            }
+        },
+        axisLabel: {
+            textStyle: {
+                color: contrastColor
+            }
+        },
+        splitLine: {
+            lineStyle: {
+                type: 'dashed',
+                color: '#aaa'
+            }
+        },
+        splitArea: {
+            areaStyle: {
+                color: contrastColor
+            }
+        }
+    };
+};
+
+var colorPalette = ['#dd6b66','#759aa0','#e69d87','#8dc1a9','#ea7e53','#eedd78','#73a373','#73b9bc','#7289ab', '#91ca8c','#f49f42'];
+var theme = {
+    color: colorPalette,
+    backgroundColor: '#333',
+    tooltip: {
+        axisPointer: {
+            lineStyle: {
+                color: contrastColor
+            },
+            crossStyle: {
+                color: contrastColor
+            }
+        }
+    },
+    legend: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    textStyle: {
+        color: contrastColor
+    },
+    title: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    toolbox: {
+        iconStyle: {
+            normal: {
+                borderColor: contrastColor
+            }
+        }
+    },
+    dataZoom: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    visualMap: {
+        textStyle: {
+            color: contrastColor
+        }
+    },
+    timeline: {
+        lineStyle: {
+            color: contrastColor
+        },
+        itemStyle: {
+            normal: {
+                color: colorPalette[1]
+            }
+        },
+        label: {
+            normal: {
+                textStyle: {
+                    color: contrastColor
+                }
+            }
+        },
+        controlStyle: {
+            normal: {
+                color: contrastColor,
+                borderColor: contrastColor
+            }
+        }
+    },
+    timeAxis: axisCommon(),
+    logAxis: axisCommon(),
+    valueAxis: axisCommon(),
+    categoryAxis: axisCommon(),
+
+    line: {
+        symbol: 'circle'
+    },
+    graph: {
+        color: colorPalette
+    },
+    gauge: {
+        title: {
+            textStyle: {
+                color: contrastColor
+            }
+        }
+    },
+    candlestick: {
+        itemStyle: {
+            normal: {
+                color: '#FD1050',
+                color0: '#0CF49B',
+                borderColor: '#FD1050',
+                borderColor0: '#0CF49B'
+            }
+        }
+    }
+};
+theme.categoryAxis.splitLine.show = false;
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * This module is imported by echarts directly.
+ *
+ * Notice:
+ * Always keep this file exists for backward compatibility.
+ * Because before 4.1.0, dataset is an optional component,
+ * some users may import this module manually.
+ */
+
+ComponentModel.extend({
+
+    type: 'dataset',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+
+        // 'row', 'column'
+        seriesLayoutBy: SERIES_LAYOUT_BY_COLUMN,
+
+        // null/'auto': auto detect header, see "module:echarts/data/helper/sourceHelper"
+        sourceHeader: null,
+
+        dimensions: null,
+
+        source: null
+    },
+
+    optionUpdated: function () {
+        detectSourceFormat(this);
+    }
+
+});
+
+Component.extend({
+
+    type: 'dataset'
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+var assert = assert$1;
+var each = each$1;
+var isFunction = isFunction$1;
+var isObject = isObject$1;
+var parseClassType = ComponentModel.parseClassType;
+
+var version = '4.1.0';
+
+var dependencies = {
+    zrender: '4.0.4'
+};
+
+var TEST_FRAME_REMAIN_TIME = 1;
+
+var PRIORITY_PROCESSOR_FILTER = 1000;
+var PRIORITY_PROCESSOR_STATISTIC = 5000;
+
+var PRIORITY_VISUAL_LAYOUT = 1000;
+var PRIORITY_VISUAL_GLOBAL = 2000;
+var PRIORITY_VISUAL_CHART = 3000;
+var PRIORITY_VISUAL_COMPONENT = 4000;
+// FIXME
+// necessary?
+var PRIORITY_VISUAL_BRUSH = 5000;
+
+var PRIORITY = {
+    PROCESSOR: {
+        FILTER: PRIORITY_PROCESSOR_FILTER,
+        STATISTIC: PRIORITY_PROCESSOR_STATISTIC
+    },
+    VISUAL: {
+        LAYOUT: PRIORITY_VISUAL_LAYOUT,
+        GLOBAL: PRIORITY_VISUAL_GLOBAL,
+        CHART: PRIORITY_VISUAL_CHART,
+        COMPONENT: PRIORITY_VISUAL_COMPONENT,
+        BRUSH: PRIORITY_VISUAL_BRUSH
+    }
+};
+
+// Main process have three entries: `setOption`, `dispatchAction` and `resize`,
+// where they must not be invoked nestedly, except the only case: invoke
+// dispatchAction with updateMethod "none" in main process.
+// This flag is used to carry out this rule.
+// All events will be triggered out side main process (i.e. when !this[IN_MAIN_PROCESS]).
+var IN_MAIN_PROCESS = '__flagInMainProcess';
+var OPTION_UPDATED = '__optionUpdated';
+var ACTION_REG = /^[a-zA-Z0-9_]+$/;
+
+
+function createRegisterEventWithLowercaseName(method) {
+    return function (eventName, handler, context) {
+        // Event name is all lowercase
+        eventName = eventName && eventName.toLowerCase();
+        Eventful.prototype[method].call(this, eventName, handler, context);
+    };
+}
+
+/**
+ * @module echarts~MessageCenter
+ */
+function MessageCenter() {
+    Eventful.call(this);
+}
+MessageCenter.prototype.on = createRegisterEventWithLowercaseName('on');
+MessageCenter.prototype.off = createRegisterEventWithLowercaseName('off');
+MessageCenter.prototype.one = createRegisterEventWithLowercaseName('one');
+mixin(MessageCenter, Eventful);
+
+/**
+ * @module echarts~ECharts
+ */
+function ECharts(dom, theme$$1, opts) {
+    opts = opts || {};
+
+    // Get theme by name
+    if (typeof theme$$1 === 'string') {
+        theme$$1 = themeStorage[theme$$1];
+    }
+
+    /**
+     * @type {string}
+     */
+    this.id;
+
+    /**
+     * Group id
+     * @type {string}
+     */
+    this.group;
+
+    /**
+     * @type {HTMLElement}
+     * @private
+     */
+    this._dom = dom;
+
+    var defaultRenderer = 'canvas';
+    if (__DEV__) {
+        defaultRenderer = (
+            typeof window === 'undefined' ? global : window
+        ).__ECHARTS__DEFAULT__RENDERER__ || defaultRenderer;
+    }
+
+    /**
+     * @type {module:zrender/ZRender}
+     * @private
+     */
+    var zr = this._zr = init$1(dom, {
+        renderer: opts.renderer || defaultRenderer,
+        devicePixelRatio: opts.devicePixelRatio,
+        width: opts.width,
+        height: opts.height
+    });
+
+    /**
+     * Expect 60 pfs.
+     * @type {Function}
+     * @private
+     */
+    this._throttledZrFlush = throttle(bind(zr.flush, zr), 17);
+
+    var theme$$1 = clone(theme$$1);
+    theme$$1 && backwardCompat(theme$$1, true);
+    /**
+     * @type {Object}
+     * @private
+     */
+    this._theme = theme$$1;
+
+    /**
+     * @type {Array.<module:echarts/view/Chart>}
+     * @private
+     */
+    this._chartsViews = [];
+
+    /**
+     * @type {Object.<string, module:echarts/view/Chart>}
+     * @private
+     */
+    this._chartsMap = {};
+
+    /**
+     * @type {Array.<module:echarts/view/Component>}
+     * @private
+     */
+    this._componentsViews = [];
+
+    /**
+     * @type {Object.<string, module:echarts/view/Component>}
+     * @private
+     */
+    this._componentsMap = {};
+
+    /**
+     * @type {module:echarts/CoordinateSystem}
+     * @private
+     */
+    this._coordSysMgr = new CoordinateSystemManager();
+
+    /**
+     * @type {module:echarts/ExtensionAPI}
+     * @private
+     */
+    var api = this._api = createExtensionAPI(this);
+
+    // Sort on demand
+    function prioritySortFunc(a, b) {
+        return a.__prio - b.__prio;
+    }
+    sort(visualFuncs, prioritySortFunc);
+    sort(dataProcessorFuncs, prioritySortFunc);
+
+    /**
+     * @type {module:echarts/stream/Scheduler}
+     */
+    this._scheduler = new Scheduler(this, api, dataProcessorFuncs, visualFuncs);
+
+    Eventful.call(this);
+
+    /**
+     * @type {module:echarts~MessageCenter}
+     * @private
+     */
+    this._messageCenter = new MessageCenter();
+
+    // Init mouse events
+    this._initEvents();
+
+    // In case some people write `window.onresize = chart.resize`
+    this.resize = bind(this.resize, this);
+
+    // Can't dispatch action during rendering procedure
+    this._pendingActions = [];
+
+    zr.animation.on('frame', this._onframe, this);
+
+    bindRenderedEvent(zr, this);
+
+    // ECharts instance can be used as value.
+    setAsPrimitive(this);
+}
+
+var echartsProto = ECharts.prototype;
+
+echartsProto._onframe = function () {
+    if (this._disposed) {
+        return;
+    }
+
+    var scheduler = this._scheduler;
+
+    // Lazy update
+    if (this[OPTION_UPDATED]) {
+        var silent = this[OPTION_UPDATED].silent;
+
+        this[IN_MAIN_PROCESS] = true;
+
+        prepare(this);
+        updateMethods.update.call(this);
+
+        this[IN_MAIN_PROCESS] = false;
+
+        this[OPTION_UPDATED] = false;
+
+        flushPendingActions.call(this, silent);
+
+        triggerUpdatedEvent.call(this, silent);
+    }
+    // Avoid do both lazy update and progress in one frame.
+    else if (scheduler.unfinished) {
+        // Stream progress.
+        var remainTime = TEST_FRAME_REMAIN_TIME;
+        var ecModel = this._model;
+        var api = this._api;
+        scheduler.unfinished = false;
+        do {
+            var startTime = +new Date();
+
+            scheduler.performSeriesTasks(ecModel);
+
+            // Currently dataProcessorFuncs do not check threshold.
+            scheduler.performDataProcessorTasks(ecModel);
+
+            updateStreamModes(this, ecModel);
+
+            // Do not update coordinate system here. Because that coord system update in
+            // each frame is not a good user experience. So we follow the rule that
+            // the extent of the coordinate system is determin in the first frame (the
+            // frame is executed immedietely after task reset.
+            // this._coordSysMgr.update(ecModel, api);
+
+            // console.log('--- ec frame visual ---', remainTime);
+            scheduler.performVisualTasks(ecModel);
+
+            renderSeries(this, this._model, api, 'remain');
+
+            remainTime -= (+new Date() - startTime);
+        }
+        while (remainTime > 0 && scheduler.unfinished);
+
+        // Call flush explicitly for trigger finished event.
+        if (!scheduler.unfinished) {
+            this._zr.flush();
+        }
+        // Else, zr flushing be ensue within the same frame,
+        // because zr flushing is after onframe event.
+    }
+};
+
+/**
+ * @return {HTMLElement}
+ */
+echartsProto.getDom = function () {
+    return this._dom;
+};
+
+/**
+ * @return {module:zrender~ZRender}
+ */
+echartsProto.getZr = function () {
+    return this._zr;
+};
+
+/**
+ * Usage:
+ * chart.setOption(option, notMerge, lazyUpdate);
+ * chart.setOption(option, {
+ *     notMerge: ...,
+ *     lazyUpdate: ...,
+ *     silent: ...
+ * });
+ *
+ * @param {Object} option
+ * @param {Object|boolean} [opts] opts or notMerge.
+ * @param {boolean} [opts.notMerge=false]
+ * @param {boolean} [opts.lazyUpdate=false] Useful when setOption frequently.
+ */
+echartsProto.setOption = function (option, notMerge, lazyUpdate) {
+    if (__DEV__) {
+        assert(!this[IN_MAIN_PROCESS], '`setOption` should not be called during main process.');
+    }
+
+    var silent;
+    if (isObject(notMerge)) {
+        lazyUpdate = notMerge.lazyUpdate;
+        silent = notMerge.silent;
+        notMerge = notMerge.notMerge;
+    }
+
+    this[IN_MAIN_PROCESS] = true;
+
+    if (!this._model || notMerge) {
+        var optionManager = new OptionManager(this._api);
+        var theme$$1 = this._theme;
+        var ecModel = this._model = new GlobalModel(null, null, theme$$1, optionManager);
+        ecModel.scheduler = this._scheduler;
+        ecModel.init(null, null, theme$$1, optionManager);
+    }
+
+    this._model.setOption(option, optionPreprocessorFuncs);
+
+    if (lazyUpdate) {
+        this[OPTION_UPDATED] = {silent: silent};
+        this[IN_MAIN_PROCESS] = false;
+    }
+    else {
+        prepare(this);
+
+        updateMethods.update.call(this);
+
+        // Ensure zr refresh sychronously, and then pixel in canvas can be
+        // fetched after `setOption`.
+        this._zr.flush();
+
+        this[OPTION_UPDATED] = false;
+        this[IN_MAIN_PROCESS] = false;
+
+        flushPendingActions.call(this, silent);
+        triggerUpdatedEvent.call(this, silent);
+    }
+};
+
+/**
+ * @DEPRECATED
+ */
+echartsProto.setTheme = function () {
+    console.log('ECharts#setTheme() is DEPRECATED in ECharts 3.0');
+};
+
+/**
+ * @return {module:echarts/model/Global}
+ */
+echartsProto.getModel = function () {
+    return this._model;
+};
+
+/**
+ * @return {Object}
+ */
+echartsProto.getOption = function () {
+    return this._model && this._model.getOption();
+};
+
+/**
+ * @return {number}
+ */
+echartsProto.getWidth = function () {
+    return this._zr.getWidth();
+};
+
+/**
+ * @return {number}
+ */
+echartsProto.getHeight = function () {
+    return this._zr.getHeight();
+};
+
+/**
+ * @return {number}
+ */
+echartsProto.getDevicePixelRatio = function () {
+    return this._zr.painter.dpr || window.devicePixelRatio || 1;
+};
+
+/**
+ * Get canvas which has all thing rendered
+ * @param {Object} opts
+ * @param {string} [opts.backgroundColor]
+ * @return {string}
+ */
+echartsProto.getRenderedCanvas = function (opts) {
+    if (!env$1.canvasSupported) {
+        return;
+    }
+    opts = opts || {};
+    opts.pixelRatio = opts.pixelRatio || 1;
+    opts.backgroundColor = opts.backgroundColor
+        || this._model.get('backgroundColor');
+    var zr = this._zr;
+    // var list = zr.storage.getDisplayList();
+    // Stop animations
+    // Never works before in init animation, so remove it.
+    // zrUtil.each(list, function (el) {
+    //     el.stopAnimation(true);
+    // });
+    return zr.painter.getRenderedCanvas(opts);
+};
+
+/**
+ * Get svg data url
+ * @return {string}
+ */
+echartsProto.getSvgDataUrl = function () {
+    if (!env$1.svgSupported) {
+        return;
+    }
+
+    var zr = this._zr;
+    var list = zr.storage.getDisplayList();
+    // Stop animations
+    each$1(list, function (el) {
+        el.stopAnimation(true);
+    });
+
+    return zr.painter.pathToDataUrl();
+};
+
+/**
+ * @return {string}
+ * @param {Object} opts
+ * @param {string} [opts.type='png']
+ * @param {string} [opts.pixelRatio=1]
+ * @param {string} [opts.backgroundColor]
+ * @param {string} [opts.excludeComponents]
+ */
+echartsProto.getDataURL = function (opts) {
+    opts = opts || {};
+    var excludeComponents = opts.excludeComponents;
+    var ecModel = this._model;
+    var excludesComponentViews = [];
+    var self = this;
+
+    each(excludeComponents, function (componentType) {
+        ecModel.eachComponent({
+            mainType: componentType
+        }, function (component) {
+            var view = self._componentsMap[component.__viewId];
+            if (!view.group.ignore) {
+                excludesComponentViews.push(view);
+                view.group.ignore = true;
+            }
+        });
+    });
+
+    var url = this._zr.painter.getType() === 'svg'
+        ? this.getSvgDataUrl()
+        : this.getRenderedCanvas(opts).toDataURL(
+            'image/' + (opts && opts.type || 'png')
+        );
+
+    each(excludesComponentViews, function (view) {
+        view.group.ignore = false;
+    });
+
+    return url;
+};
+
+
+/**
+ * @return {string}
+ * @param {Object} opts
+ * @param {string} [opts.type='png']
+ * @param {string} [opts.pixelRatio=1]
+ * @param {string} [opts.backgroundColor]
+ */
+echartsProto.getConnectedDataURL = function (opts) {
+    if (!env$1.canvasSupported) {
+        return;
+    }
+    var groupId = this.group;
+    var mathMin = Math.min;
+    var mathMax = Math.max;
+    var MAX_NUMBER = Infinity;
+    if (connectedGroups[groupId]) {
+        var left = MAX_NUMBER;
+        var top = MAX_NUMBER;
+        var right = -MAX_NUMBER;
+        var bottom = -MAX_NUMBER;
+        var canvasList = [];
+        var dpr = (opts && opts.pixelRatio) || 1;
+
+        each$1(instances, function (chart, id) {
+            if (chart.group === groupId) {
+                var canvas = chart.getRenderedCanvas(
+                    clone(opts)
+                );
+                var boundingRect = chart.getDom().getBoundingClientRect();
+                left = mathMin(boundingRect.left, left);
+                top = mathMin(boundingRect.top, top);
+                right = mathMax(boundingRect.right, right);
+                bottom = mathMax(boundingRect.bottom, bottom);
+                canvasList.push({
+                    dom: canvas,
+                    left: boundingRect.left,
+                    top: boundingRect.top
+                });
+            }
+        });
+
+        left *= dpr;
+        top *= dpr;
+        right *= dpr;
+        bottom *= dpr;
+        var width = right - left;
+        var height = bottom - top;
+        var targetCanvas = createCanvas();
+        targetCanvas.width = width;
+        targetCanvas.height = height;
+        var zr = init$1(targetCanvas);
+
+        each(canvasList, function (item) {
+            var img = new ZImage({
+                style: {
+                    x: item.left * dpr - left,
+                    y: item.top * dpr - top,
+                    image: item.dom
+                }
+            });
+            zr.add(img);
+        });
+        zr.refreshImmediately();
+
+        return targetCanvas.toDataURL('image/' + (opts && opts.type || 'png'));
+    }
+    else {
+        return this.getDataURL(opts);
+    }
+};
+
+/**
+ * Convert from logical coordinate system to pixel coordinate system.
+ * See CoordinateSystem#convertToPixel.
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            geoIndex / geoId, geoName,
+ *            bmapIndex / bmapId / bmapName,
+ *            xAxisIndex / xAxisId / xAxisName,
+ *            yAxisIndex / yAxisId / yAxisName,
+ *            gridIndex / gridId / gridName,
+ *            ... (can be extended)
+ *        }
+ * @param {Array|number} value
+ * @return {Array|number} result
+ */
+echartsProto.convertToPixel = curry(doConvertPixel, 'convertToPixel');
+
+/**
+ * Convert from pixel coordinate system to logical coordinate system.
+ * See CoordinateSystem#convertFromPixel.
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            geoIndex / geoId / geoName,
+ *            bmapIndex / bmapId / bmapName,
+ *            xAxisIndex / xAxisId / xAxisName,
+ *            yAxisIndex / yAxisId / yAxisName
+ *            gridIndex / gridId / gridName,
+ *            ... (can be extended)
+ *        }
+ * @param {Array|number} value
+ * @return {Array|number} result
+ */
+echartsProto.convertFromPixel = curry(doConvertPixel, 'convertFromPixel');
+
+function doConvertPixel(methodName, finder, value) {
+    var ecModel = this._model;
+    var coordSysList = this._coordSysMgr.getCoordinateSystems();
+    var result;
+
+    finder = parseFinder(ecModel, finder);
+
+    for (var i = 0; i < coordSysList.length; i++) {
+        var coordSys = coordSysList[i];
+        if (coordSys[methodName]
+            && (result = coordSys[methodName](ecModel, finder, value)) != null
+        ) {
+            return result;
+        }
+    }
+
+    if (__DEV__) {
+        console.warn(
+            'No coordinate system that supports ' + methodName + ' found by the given finder.'
+        );
+    }
+}
+
+/**
+ * Is the specified coordinate systems or components contain the given pixel point.
+ * @param {string|Object} finder
+ *        If string, e.g., 'geo', means {geoIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            geoIndex / geoId / geoName,
+ *            bmapIndex / bmapId / bmapName,
+ *            xAxisIndex / xAxisId / xAxisName,
+ *            yAxisIndex / yAxisId / yAxisName,
+ *            gridIndex / gridId / gridName,
+ *            ... (can be extended)
+ *        }
+ * @param {Array|number} value
+ * @return {boolean} result
+ */
+echartsProto.containPixel = function (finder, value) {
+    var ecModel = this._model;
+    var result;
+
+    finder = parseFinder(ecModel, finder);
+
+    each$1(finder, function (models, key) {
+        key.indexOf('Models') >= 0 && each$1(models, function (model) {
+            var coordSys = model.coordinateSystem;
+            if (coordSys && coordSys.containPoint) {
+                result |= !!coordSys.containPoint(value);
+            }
+            else if (key === 'seriesModels') {
+                var view = this._chartsMap[model.__viewId];
+                if (view && view.containPoint) {
+                    result |= view.containPoint(value, model);
+                }
+                else {
+                    if (__DEV__) {
+                        console.warn(key + ': ' + (view
+                            ? 'The found component do not support containPoint.'
+                            : 'No view mapping to the found component.'
+                        ));
+                    }
+                }
+            }
+            else {
+                if (__DEV__) {
+                    console.warn(key + ': containPoint is not supported');
+                }
+            }
+        }, this);
+    }, this);
+
+    return !!result;
+};
+
+/**
+ * Get visual from series or data.
+ * @param {string|Object} finder
+ *        If string, e.g., 'series', means {seriesIndex: 0}.
+ *        If Object, could contain some of these properties below:
+ *        {
+ *            seriesIndex / seriesId / seriesName,
+ *            dataIndex / dataIndexInside
+ *        }
+ *        If dataIndex is not specified, series visual will be fetched,
+ *        but not data item visual.
+ *        If all of seriesIndex, seriesId, seriesName are not specified,
+ *        visual will be fetched from first series.
+ * @param {string} visualType 'color', 'symbol', 'symbolSize'
+ */
+echartsProto.getVisual = function (finder, visualType) {
+    var ecModel = this._model;
+
+    finder = parseFinder(ecModel, finder, {defaultMainType: 'series'});
+
+    var seriesModel = finder.seriesModel;
+
+    if (__DEV__) {
+        if (!seriesModel) {
+            console.warn('There is no specified seires model');
+        }
+    }
+
+    var data = seriesModel.getData();
+
+    var dataIndexInside = finder.hasOwnProperty('dataIndexInside')
+        ? finder.dataIndexInside
+        : finder.hasOwnProperty('dataIndex')
+        ? data.indexOfRawIndex(finder.dataIndex)
+        : null;
+
+    return dataIndexInside != null
+        ? data.getItemVisual(dataIndexInside, visualType)
+        : data.getVisual(visualType);
+};
+
+/**
+ * Get view of corresponding component model
+ * @param  {module:echarts/model/Component} componentModel
+ * @return {module:echarts/view/Component}
+ */
+echartsProto.getViewOfComponentModel = function (componentModel) {
+    return this._componentsMap[componentModel.__viewId];
+};
+
+/**
+ * Get view of corresponding series model
+ * @param  {module:echarts/model/Series} seriesModel
+ * @return {module:echarts/view/Chart}
+ */
+echartsProto.getViewOfSeriesModel = function (seriesModel) {
+    return this._chartsMap[seriesModel.__viewId];
+};
+
+var updateMethods = {
+
+    prepareAndUpdate: function (payload) {
+        prepare(this);
+        updateMethods.update.call(this, payload);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    update: function (payload) {
+        // console.profile && console.profile('update');
+
+        var ecModel = this._model;
+        var api = this._api;
+        var zr = this._zr;
+        var coordSysMgr = this._coordSysMgr;
+        var scheduler = this._scheduler;
+
+        // update before setOption
+        if (!ecModel) {
+            return;
+        }
+
+        scheduler.restoreData(ecModel, payload);
+
+        scheduler.performSeriesTasks(ecModel);
+
+        // TODO
+        // Save total ecModel here for undo/redo (after restoring data and before processing data).
+        // Undo (restoration of total ecModel) can be carried out in 'action' or outside API call.
+
+        // Create new coordinate system each update
+        // In LineView may save the old coordinate system and use it to get the orignal point
+        coordSysMgr.create(ecModel, api);
+
+        scheduler.performDataProcessorTasks(ecModel, payload);
+
+        // Current stream render is not supported in data process. So we can update
+        // stream modes after data processing, where the filtered data is used to
+        // deteming whether use progressive rendering.
+        updateStreamModes(this, ecModel);
+
+        // We update stream modes before coordinate system updated, then the modes info
+        // can be fetched when coord sys updating (consider the barGrid extent fix). But
+        // the drawback is the full coord info can not be fetched. Fortunately this full
+        // coord is not requied in stream mode updater currently.
+        coordSysMgr.update(ecModel, api);
+
+        clearColorPalette(ecModel);
+        scheduler.performVisualTasks(ecModel, payload);
+
+        render(this, ecModel, api, payload);
+
+        // Set background
+        var backgroundColor = ecModel.get('backgroundColor') || 'transparent';
+
+        // In IE8
+        if (!env$1.canvasSupported) {
+            var colorArr = parse(backgroundColor);
+            backgroundColor = stringify(colorArr, 'rgb');
+            if (colorArr[3] === 0) {
+                backgroundColor = 'transparent';
+            }
+        }
+        else {
+            zr.setBackgroundColor(backgroundColor);
+        }
+
+        performPostUpdateFuncs(ecModel, api);
+
+        // console.profile && console.profileEnd('update');
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateTransform: function (payload) {
+        var ecModel = this._model;
+        var ecIns = this;
+        var api = this._api;
+
+        // update before setOption
+        if (!ecModel) {
+            return;
+        }
+
+        // ChartView.markUpdateMethod(payload, 'updateTransform');
+
+        var componentDirtyList = [];
+        ecModel.eachComponent(function (componentType, componentModel) {
+            var componentView = ecIns.getViewOfComponentModel(componentModel);
+            if (componentView && componentView.__alive) {
+                if (componentView.updateTransform) {
+                    var result = componentView.updateTransform(componentModel, ecModel, api, payload);
+                    result && result.update && componentDirtyList.push(componentView);
+                }
+                else {
+                    componentDirtyList.push(componentView);
+                }
+            }
+        });
+
+        var seriesDirtyMap = createHashMap();
+        ecModel.eachSeries(function (seriesModel) {
+            var chartView = ecIns._chartsMap[seriesModel.__viewId];
+            if (chartView.updateTransform) {
+                var result = chartView.updateTransform(seriesModel, ecModel, api, payload);
+                result && result.update && seriesDirtyMap.set(seriesModel.uid, 1);
+            }
+            else {
+                seriesDirtyMap.set(seriesModel.uid, 1);
+            }
+        });
+
+        clearColorPalette(ecModel);
+        // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        // this._scheduler.performVisualTasks(ecModel, payload, 'layout', true);
+        this._scheduler.performVisualTasks(
+            ecModel, payload, {setDirty: true, dirtyMap: seriesDirtyMap}
+        );
+
+        // Currently, not call render of components. Geo render cost a lot.
+        // renderComponents(ecIns, ecModel, api, payload, componentDirtyList);
+        renderSeries(ecIns, ecModel, api, payload, seriesDirtyMap);
+
+        performPostUpdateFuncs(ecModel, this._api);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateView: function (payload) {
+        var ecModel = this._model;
+
+        // update before setOption
+        if (!ecModel) {
+            return;
+        }
+
+        Chart.markUpdateMethod(payload, 'updateView');
+
+        clearColorPalette(ecModel);
+
+        // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        this._scheduler.performVisualTasks(ecModel, payload, {setDirty: true});
+
+        render(this, this._model, this._api, payload);
+
+        performPostUpdateFuncs(ecModel, this._api);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateVisual: function (payload) {
+        updateMethods.update.call(this, payload);
+
+        // var ecModel = this._model;
+
+        // // update before setOption
+        // if (!ecModel) {
+        //     return;
+        // }
+
+        // ChartView.markUpdateMethod(payload, 'updateVisual');
+
+        // clearColorPalette(ecModel);
+
+        // // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        // this._scheduler.performVisualTasks(ecModel, payload, {visualType: 'visual', setDirty: true});
+
+        // render(this, this._model, this._api, payload);
+
+        // performPostUpdateFuncs(ecModel, this._api);
+    },
+
+    /**
+     * @param {Object} payload
+     * @private
+     */
+    updateLayout: function (payload) {
+        updateMethods.update.call(this, payload);
+
+        // var ecModel = this._model;
+
+        // // update before setOption
+        // if (!ecModel) {
+        //     return;
+        // }
+
+        // ChartView.markUpdateMethod(payload, 'updateLayout');
+
+        // // Keep pipe to the exist pipeline because it depends on the render task of the full pipeline.
+        // // this._scheduler.performVisualTasks(ecModel, payload, 'layout', true);
+        // this._scheduler.performVisualTasks(ecModel, payload, {setDirty: true});
+
+        // render(this, this._model, this._api, payload);
+
+        // performPostUpdateFuncs(ecModel, this._api);
+    }
+};
+
+function prepare(ecIns) {
+    var ecModel = ecIns._model;
+    var scheduler = ecIns._scheduler;
+
+    scheduler.restorePipelines(ecModel);
+
+    scheduler.prepareStageTasks();
+
+    prepareView(ecIns, 'component', ecModel, scheduler);
+
+    prepareView(ecIns, 'chart', ecModel, scheduler);
+
+    scheduler.plan();
+}
+
+/**
+ * @private
+ */
+function updateDirectly(ecIns, method, payload, mainType, subType) {
+    var ecModel = ecIns._model;
+
+    // broadcast
+    if (!mainType) {
+        // FIXME
+        // Chart will not be update directly here, except set dirty.
+        // But there is no such scenario now.
+        each(ecIns._componentsViews.concat(ecIns._chartsViews), callView);
+        return;
+    }
+
+    var query = {};
+    query[mainType + 'Id'] = payload[mainType + 'Id'];
+    query[mainType + 'Index'] = payload[mainType + 'Index'];
+    query[mainType + 'Name'] = payload[mainType + 'Name'];
+
+    var condition = {mainType: mainType, query: query};
+    subType && (condition.subType = subType); // subType may be '' by parseClassType;
+
+    var excludeSeriesId = payload.excludeSeriesId;
+    if (excludeSeriesId != null) {
+        excludeSeriesId = createHashMap(normalizeToArray(excludeSeriesId));
+    }
+
+    // If dispatchAction before setOption, do nothing.
+    ecModel && ecModel.eachComponent(condition, function (model) {
+        if (!excludeSeriesId || excludeSeriesId.get(model.id) == null) {
+            callView(ecIns[
+                mainType === 'series' ? '_chartsMap' : '_componentsMap'
+            ][model.__viewId]);
+        }
+    }, ecIns);
+
+    function callView(view) {
+        view && view.__alive && view[method] && view[method](
+            view.__model, ecModel, ecIns._api, payload
+        );
+    }
+}
+
+/**
+ * Resize the chart
+ * @param {Object} opts
+ * @param {number} [opts.width] Can be 'auto' (the same as null/undefined)
+ * @param {number} [opts.height] Can be 'auto' (the same as null/undefined)
+ * @param {boolean} [opts.silent=false]
+ */
+echartsProto.resize = function (opts) {
+    if (__DEV__) {
+        assert(!this[IN_MAIN_PROCESS], '`resize` should not be called during main process.');
+    }
+
+    this._zr.resize(opts);
+
+    var ecModel = this._model;
+
+    // Resize loading effect
+    this._loadingFX && this._loadingFX.resize();
+
+    if (!ecModel) {
+        return;
+    }
+
+    var optionChanged = ecModel.resetOption('media');
+
+    var silent = opts && opts.silent;
+
+    this[IN_MAIN_PROCESS] = true;
+
+    optionChanged && prepare(this);
+    updateMethods.update.call(this);
+
+    this[IN_MAIN_PROCESS] = false;
+
+    flushPendingActions.call(this, silent);
+
+    triggerUpdatedEvent.call(this, silent);
+};
+
+function updateStreamModes(ecIns, ecModel) {
+    var chartsMap = ecIns._chartsMap;
+    var scheduler = ecIns._scheduler;
+    ecModel.eachSeries(function (seriesModel) {
+        scheduler.updateStreamModes(seriesModel, chartsMap[seriesModel.__viewId]);
+    });
+}
+
+/**
+ * Show loading effect
+ * @param  {string} [name='default']
+ * @param  {Object} [cfg]
+ */
+echartsProto.showLoading = function (name, cfg) {
+    if (isObject(name)) {
+        cfg = name;
+        name = '';
+    }
+    name = name || 'default';
+
+    this.hideLoading();
+    if (!loadingEffects[name]) {
+        if (__DEV__) {
+            console.warn('Loading effects ' + name + ' not exists.');
+        }
+        return;
+    }
+    var el = loadingEffects[name](this._api, cfg);
+    var zr = this._zr;
+    this._loadingFX = el;
+
+    zr.add(el);
+};
+
+/**
+ * Hide loading effect
+ */
+echartsProto.hideLoading = function () {
+    this._loadingFX && this._zr.remove(this._loadingFX);
+    this._loadingFX = null;
+};
+
+/**
+ * @param {Object} eventObj
+ * @return {Object}
+ */
+echartsProto.makeActionFromEvent = function (eventObj) {
+    var payload = extend({}, eventObj);
+    payload.type = eventActionMap[eventObj.type];
+    return payload;
+};
+
+/**
+ * @pubilc
+ * @param {Object} payload
+ * @param {string} [payload.type] Action type
+ * @param {Object|boolean} [opt] If pass boolean, means opt.silent
+ * @param {boolean} [opt.silent=false] Whether trigger events.
+ * @param {boolean} [opt.flush=undefined]
+ *                  true: Flush immediately, and then pixel in canvas can be fetched
+ *                      immediately. Caution: it might affect performance.
+ *                  false: Not not flush.
+ *                  undefined: Auto decide whether perform flush.
+ */
+echartsProto.dispatchAction = function (payload, opt) {
+    if (!isObject(opt)) {
+        opt = {silent: !!opt};
+    }
+
+    if (!actions[payload.type]) {
+        return;
+    }
+
+    // Avoid dispatch action before setOption. Especially in `connect`.
+    if (!this._model) {
+        return;
+    }
+
+    // May dispatchAction in rendering procedure
+    if (this[IN_MAIN_PROCESS]) {
+        this._pendingActions.push(payload);
+        return;
+    }
+
+    doDispatchAction.call(this, payload, opt.silent);
+
+    if (opt.flush) {
+        this._zr.flush(true);
+    }
+    else if (opt.flush !== false && env$1.browser.weChat) {
+        // In WeChat embeded browser, `requestAnimationFrame` and `setInterval`
+        // hang when sliding page (on touch event), which cause that zr does not
+        // refresh util user interaction finished, which is not expected.
+        // But `dispatchAction` may be called too frequently when pan on touch
+        // screen, which impacts performance if do not throttle them.
+        this._throttledZrFlush();
+    }
+
+    flushPendingActions.call(this, opt.silent);
+
+    triggerUpdatedEvent.call(this, opt.silent);
+};
+
+function doDispatchAction(payload, silent) {
+    var payloadType = payload.type;
+    var escapeConnect = payload.escapeConnect;
+    var actionWrap = actions[payloadType];
+    var actionInfo = actionWrap.actionInfo;
+
+    var cptType = (actionInfo.update || 'update').split(':');
+    var updateMethod = cptType.pop();
+    cptType = cptType[0] != null && parseClassType(cptType[0]);
+
+    this[IN_MAIN_PROCESS] = true;
+
+    var payloads = [payload];
+    var batched = false;
+    // Batch action
+    if (payload.batch) {
+        batched = true;
+        payloads = map(payload.batch, function (item) {
+            item = defaults(extend({}, item), payload);
+            item.batch = null;
+            return item;
+        });
+    }
+
+    var eventObjBatch = [];
+    var eventObj;
+    var isHighDown = payloadType === 'highlight' || payloadType === 'downplay';
+
+    each(payloads, function (batchItem) {
+        // Action can specify the event by return it.
+        eventObj = actionWrap.action(batchItem, this._model, this._api);
+        // Emit event outside
+        eventObj = eventObj || extend({}, batchItem);
+        // Convert type to eventType
+        eventObj.type = actionInfo.event || eventObj.type;
+        eventObjBatch.push(eventObj);
+
+        // light update does not perform data process, layout and visual.
+        if (isHighDown) {
+            // method, payload, mainType, subType
+            updateDirectly(this, updateMethod, batchItem, 'series');
+        }
+        else if (cptType) {
+            updateDirectly(this, updateMethod, batchItem, cptType.main, cptType.sub);
+        }
+    }, this);
+
+    if (updateMethod !== 'none' && !isHighDown && !cptType) {
+        // Still dirty
+        if (this[OPTION_UPDATED]) {
+            // FIXME Pass payload ?
+            prepare(this);
+            updateMethods.update.call(this, payload);
+            this[OPTION_UPDATED] = false;
+        }
+        else {
+            updateMethods[updateMethod].call(this, payload);
+        }
+    }
+
+    // Follow the rule of action batch
+    if (batched) {
+        eventObj = {
+            type: actionInfo.event || payloadType,
+            escapeConnect: escapeConnect,
+            batch: eventObjBatch
+        };
+    }
+    else {
+        eventObj = eventObjBatch[0];
+    }
+
+    this[IN_MAIN_PROCESS] = false;
+
+    !silent && this._messageCenter.trigger(eventObj.type, eventObj);
+}
+
+function flushPendingActions(silent) {
+    var pendingActions = this._pendingActions;
+    while (pendingActions.length) {
+        var payload = pendingActions.shift();
+        doDispatchAction.call(this, payload, silent);
+    }
+}
+
+function triggerUpdatedEvent(silent) {
+    !silent && this.trigger('updated');
+}
+
+/**
+ * Event `rendered` is triggered when zr
+ * rendered. It is useful for realtime
+ * snapshot (reflect animation).
+ *
+ * Event `finished` is triggered when:
+ * (1) zrender rendering finished.
+ * (2) initial animation finished.
+ * (3) progressive rendering finished.
+ * (4) no pending action.
+ * (5) no delayed setOption needs to be processed.
+ */
+function bindRenderedEvent(zr, ecIns) {
+    zr.on('rendered', function () {
+
+        ecIns.trigger('rendered');
+
+        // The `finished` event should not be triggered repeatly,
+        // so it should only be triggered when rendering indeed happend
+        // in zrender. (Consider the case that dipatchAction is keep
+        // triggering when mouse move).
+        if (
+            // Although zr is dirty if initial animation is not finished
+            // and this checking is called on frame, we also check
+            // animation finished for robustness.
+            zr.animation.isFinished()
+            && !ecIns[OPTION_UPDATED]
+            && !ecIns._scheduler.unfinished
+            && !ecIns._pendingActions.length
+        ) {
+            ecIns.trigger('finished');
+        }
+    });
+}
+
+/**
+ * @param {Object} params
+ * @param {number} params.seriesIndex
+ * @param {Array|TypedArray} params.data
+ */
+echartsProto.appendData = function (params) {
+    var seriesIndex = params.seriesIndex;
+    var ecModel = this.getModel();
+    var seriesModel = ecModel.getSeriesByIndex(seriesIndex);
+
+    if (__DEV__) {
+        assert(params.data && seriesModel);
+    }
+
+    seriesModel.appendData(params);
+
+    // Note: `appendData` does not support that update extent of coordinate
+    // system, util some scenario require that. In the expected usage of
+    // `appendData`, the initial extent of coordinate system should better
+    // be fixed by axis `min`/`max` setting or initial data, otherwise if
+    // the extent changed while `appendData`, the location of the painted
+    // graphic elements have to be changed, which make the usage of
+    // `appendData` meaningless.
+
+    this._scheduler.unfinished = true;
+};
+
+/**
+ * Register event
+ * @method
+ */
+echartsProto.on = createRegisterEventWithLowercaseName('on');
+echartsProto.off = createRegisterEventWithLowercaseName('off');
+echartsProto.one = createRegisterEventWithLowercaseName('one');
+
+/**
+ * Prepare view instances of charts and components
+ * @param  {module:echarts/model/Global} ecModel
+ * @private
+ */
+function prepareView(ecIns, type, ecModel, scheduler) {
+    var isComponent = type === 'component';
+    var viewList = isComponent ? ecIns._componentsViews : ecIns._chartsViews;
+    var viewMap = isComponent ? ecIns._componentsMap : ecIns._chartsMap;
+    var zr = ecIns._zr;
+    var api = ecIns._api;
+
+    for (var i = 0; i < viewList.length; i++) {
+        viewList[i].__alive = false;
+    }
+
+    isComponent
+        ? ecModel.eachComponent(function (componentType, model) {
+            componentType !== 'series' && doPrepare(model);
+        })
+        : ecModel.eachSeries(doPrepare);
+
+    function doPrepare(model) {
+        // Consider: id same and type changed.
+        var viewId = '_ec_' + model.id + '_' + model.type;
+        var view = viewMap[viewId];
+        if (!view) {
+            var classType = parseClassType(model.type);
+            var Clazz = isComponent
+                ? Component.getClass(classType.main, classType.sub)
+                : Chart.getClass(classType.sub);
+
+            if (__DEV__) {
+                assert(Clazz, classType.sub + ' does not exist.');
+            }
+
+            view = new Clazz();
+            view.init(ecModel, api);
+            viewMap[viewId] = view;
+            viewList.push(view);
+            zr.add(view.group);
+        }
+
+        model.__viewId = view.__id = viewId;
+        view.__alive = true;
+        view.__model = model;
+        view.group.__ecComponentInfo = {
+            mainType: model.mainType,
+            index: model.componentIndex
+        };
+        !isComponent && scheduler.prepareView(view, model, ecModel, api);
+    }
+
+    for (var i = 0; i < viewList.length;) {
+        var view = viewList[i];
+        if (!view.__alive) {
+            !isComponent && view.renderTask.dispose();
+            zr.remove(view.group);
+            view.dispose(ecModel, api);
+            viewList.splice(i, 1);
+            delete viewMap[view.__id];
+            view.__id = view.group.__ecComponentInfo = null;
+        }
+        else {
+            i++;
+        }
+    }
+}
+
+// /**
+//  * Encode visual infomation from data after data processing
+//  *
+//  * @param {module:echarts/model/Global} ecModel
+//  * @param {object} layout
+//  * @param {boolean} [layoutFilter] `true`: only layout,
+//  *                                 `false`: only not layout,
+//  *                                 `null`/`undefined`: all.
+//  * @param {string} taskBaseTag
+//  * @private
+//  */
+// function startVisualEncoding(ecIns, ecModel, api, payload, layoutFilter) {
+//     each(visualFuncs, function (visual, index) {
+//         var isLayout = visual.isLayout;
+//         if (layoutFilter == null
+//             || (layoutFilter === false && !isLayout)
+//             || (layoutFilter === true && isLayout)
+//         ) {
+//             visual.func(ecModel, api, payload);
+//         }
+//     });
+// }
+
+function clearColorPalette(ecModel) {
+    ecModel.clearColorPalette();
+    ecModel.eachSeries(function (seriesModel) {
+        seriesModel.clearColorPalette();
+    });
+}
+
+function render(ecIns, ecModel, api, payload) {
+
+    renderComponents(ecIns, ecModel, api, payload);
+
+    each(ecIns._chartsViews, function (chart) {
+        chart.__alive = false;
+    });
+
+    renderSeries(ecIns, ecModel, api, payload);
+
+    // Remove groups of unrendered charts
+    each(ecIns._chartsViews, function (chart) {
+        if (!chart.__alive) {
+            chart.remove(ecModel, api);
+        }
+    });
+}
+
+function renderComponents(ecIns, ecModel, api, payload, dirtyList) {
+    each(dirtyList || ecIns._componentsViews, function (componentView) {
+        var componentModel = componentView.__model;
+        componentView.render(componentModel, ecModel, api, payload);
+
+        updateZ(componentModel, componentView);
+    });
+}
+
+/**
+ * Render each chart and component
+ * @private
+ */
+function renderSeries(ecIns, ecModel, api, payload, dirtyMap) {
+    // Render all charts
+    var scheduler = ecIns._scheduler;
+    var unfinished;
+    ecModel.eachSeries(function (seriesModel) {
+        var chartView = ecIns._chartsMap[seriesModel.__viewId];
+        chartView.__alive = true;
+
+        var renderTask = chartView.renderTask;
+        scheduler.updatePayload(renderTask, payload);
+
+        if (dirtyMap && dirtyMap.get(seriesModel.uid)) {
+            renderTask.dirty();
+        }
+
+        unfinished |= renderTask.perform(scheduler.getPerformArgs(renderTask));
+
+        chartView.group.silent = !!seriesModel.get('silent');
+
+        updateZ(seriesModel, chartView);
+
+        updateBlend(seriesModel, chartView);
+    });
+    scheduler.unfinished |= unfinished;
+
+    // If use hover layer
+    updateHoverLayerStatus(ecIns._zr, ecModel);
+
+    // Add aria
+    aria(ecIns._zr.dom, ecModel);
+}
+
+function performPostUpdateFuncs(ecModel, api) {
+    each(postUpdateFuncs, function (func) {
+        func(ecModel, api);
+    });
+}
+
+
+var MOUSE_EVENT_NAMES = [
+    'click', 'dblclick', 'mouseover', 'mouseout', 'mousemove',
+    'mousedown', 'mouseup', 'globalout', 'contextmenu'
+];
+
+/**
+ * @private
+ */
+echartsProto._initEvents = function () {
+    each(MOUSE_EVENT_NAMES, function (eveName) {
+        this._zr.on(eveName, function (e) {
+            var ecModel = this.getModel();
+            var el = e.target;
+            var params;
+
+            // no e.target when 'globalout'.
+            if (eveName === 'globalout') {
+                params = {};
+            }
+            else if (el && el.dataIndex != null) {
+                var dataModel = el.dataModel || ecModel.getSeriesByIndex(el.seriesIndex);
+                params = dataModel && dataModel.getDataParams(el.dataIndex, el.dataType) || {};
+            }
+            // If element has custom eventData of components
+            else if (el && el.eventData) {
+                params = extend({}, el.eventData);
+            }
+
+            if (params) {
+                params.event = e;
+                params.type = eveName;
+                this.trigger(eveName, params);
+            }
+
+        }, this);
+    }, this);
+
+    each(eventActionMap, function (actionType, eventType) {
+        this._messageCenter.on(eventType, function (event) {
+            this.trigger(eventType, event);
+        }, this);
+    }, this);
+};
+
+/**
+ * @return {boolean}
+ */
+echartsProto.isDisposed = function () {
+    return this._disposed;
+};
+
+/**
+ * Clear
+ */
+echartsProto.clear = function () {
+    this.setOption({ series: [] }, true);
+};
+
+/**
+ * Dispose instance
+ */
+echartsProto.dispose = function () {
+    if (this._disposed) {
+        if (__DEV__) {
+            console.warn('Instance ' + this.id + ' has been disposed');
+        }
+        return;
+    }
+    this._disposed = true;
+
+    setAttribute(this.getDom(), DOM_ATTRIBUTE_KEY, '');
+
+    var api = this._api;
+    var ecModel = this._model;
+
+    each(this._componentsViews, function (component) {
+        component.dispose(ecModel, api);
+    });
+    each(this._chartsViews, function (chart) {
+        chart.dispose(ecModel, api);
+    });
+
+    // Dispose after all views disposed
+    this._zr.dispose();
+
+    delete instances[this.id];
+};
+
+mixin(ECharts, Eventful);
+
+function updateHoverLayerStatus(zr, ecModel) {
+    var storage = zr.storage;
+    var elCount = 0;
+    storage.traverse(function (el) {
+        if (!el.isGroup) {
+            elCount++;
+        }
+    });
+    if (elCount > ecModel.get('hoverLayerThreshold') && !env$1.node) {
+        storage.traverse(function (el) {
+            if (!el.isGroup) {
+                // Don't switch back.
+                el.useHoverLayer = true;
+            }
+        });
+    }
+}
+
+/**
+ * Update chart progressive and blend.
+ * @param {module:echarts/model/Series|module:echarts/model/Component} model
+ * @param {module:echarts/view/Component|module:echarts/view/Chart} view
+ */
+function updateBlend(seriesModel, chartView) {
+    var blendMode = seriesModel.get('blendMode') || null;
+    if (__DEV__) {
+        if (!env$1.canvasSupported && blendMode && blendMode !== 'source-over') {
+            console.warn('Only canvas support blendMode');
+        }
+    }
+    chartView.group.traverse(function (el) {
+        // FIXME marker and other components
+        if (!el.isGroup) {
+            // Only set if blendMode is changed. In case element is incremental and don't wan't to rerender.
+            if (el.style.blend !== blendMode) {
+                el.setStyle('blend', blendMode);
+            }
+        }
+        if (el.eachPendingDisplayable) {
+            el.eachPendingDisplayable(function (displayable) {
+                displayable.setStyle('blend', blendMode);
+            });
+        }
+    });
+}
+
+/**
+ * @param {module:echarts/model/Series|module:echarts/model/Component} model
+ * @param {module:echarts/view/Component|module:echarts/view/Chart} view
+ */
+function updateZ(model, view) {
+    var z = model.get('z');
+    var zlevel = model.get('zlevel');
+    // Set z and zlevel
+    view.group.traverse(function (el) {
+        if (el.type !== 'group') {
+            z != null && (el.z = z);
+            zlevel != null && (el.zlevel = zlevel);
+        }
+    });
+}
+
+function createExtensionAPI(ecInstance) {
+    var coordSysMgr = ecInstance._coordSysMgr;
+    return extend(new ExtensionAPI(ecInstance), {
+        // Inject methods
+        getCoordinateSystems: bind(
+            coordSysMgr.getCoordinateSystems, coordSysMgr
+        ),
+        getComponentByElement: function (el) {
+            while (el) {
+                var modelInfo = el.__ecComponentInfo;
+                if (modelInfo != null) {
+                    return ecInstance._model.getComponent(modelInfo.mainType, modelInfo.index);
+                }
+                el = el.parent;
+            }
+        }
+    });
+}
+
+/**
+ * @type {Object} key: actionType.
+ * @inner
+ */
+var actions = {};
+
+/**
+ * Map eventType to actionType
+ * @type {Object}
+ */
+var eventActionMap = {};
+
+/**
+ * Data processor functions of each stage
+ * @type {Array.<Object.<string, Function>>}
+ * @inner
+ */
+var dataProcessorFuncs = [];
+
+/**
+ * @type {Array.<Function>}
+ * @inner
+ */
+var optionPreprocessorFuncs = [];
+
+/**
+ * @type {Array.<Function>}
+ * @inner
+ */
+var postUpdateFuncs = [];
+
+/**
+ * Visual encoding functions of each stage
+ * @type {Array.<Object.<string, Function>>}
+ */
+var visualFuncs = [];
+
+/**
+ * Theme storage
+ * @type {Object.<key, Object>}
+ */
+var themeStorage = {};
+/**
+ * Loading effects
+ */
+var loadingEffects = {};
+
+var instances = {};
+var connectedGroups = {};
+
+var idBase = new Date() - 0;
+var groupIdBase = new Date() - 0;
+var DOM_ATTRIBUTE_KEY = '_echarts_instance_';
+
+var mapDataStores = {};
+
+function enableConnect(chart) {
+    var STATUS_PENDING = 0;
+    var STATUS_UPDATING = 1;
+    var STATUS_UPDATED = 2;
+    var STATUS_KEY = '__connectUpdateStatus';
+
+    function updateConnectedChartsStatus(charts, status) {
+        for (var i = 0; i < charts.length; i++) {
+            var otherChart = charts[i];
+            otherChart[STATUS_KEY] = status;
+        }
+    }
+
+    each(eventActionMap, function (actionType, eventType) {
+        chart._messageCenter.on(eventType, function (event) {
+            if (connectedGroups[chart.group] && chart[STATUS_KEY] !== STATUS_PENDING) {
+                if (event && event.escapeConnect) {
+                    return;
+                }
+
+                var action = chart.makeActionFromEvent(event);
+                var otherCharts = [];
+
+                each(instances, function (otherChart) {
+                    if (otherChart !== chart && otherChart.group === chart.group) {
+                        otherCharts.push(otherChart);
+                    }
+                });
+
+                updateConnectedChartsStatus(otherCharts, STATUS_PENDING);
+                each(otherCharts, function (otherChart) {
+                    if (otherChart[STATUS_KEY] !== STATUS_UPDATING) {
+                        otherChart.dispatchAction(action);
+                    }
+                });
+                updateConnectedChartsStatus(otherCharts, STATUS_UPDATED);
+            }
+        });
+    });
+}
+
+/**
+ * @param {HTMLElement} dom
+ * @param {Object} [theme]
+ * @param {Object} opts
+ * @param {number} [opts.devicePixelRatio] Use window.devicePixelRatio by default
+ * @param {string} [opts.renderer] Currently only 'canvas' is supported.
+ * @param {number} [opts.width] Use clientWidth of the input `dom` by default.
+ *                              Can be 'auto' (the same as null/undefined)
+ * @param {number} [opts.height] Use clientHeight of the input `dom` by default.
+ *                               Can be 'auto' (the same as null/undefined)
+ */
+function init(dom, theme$$1, opts) {
+    if (__DEV__) {
+        // Check version
+        if ((version$1.replace('.', '') - 0) < (dependencies.zrender.replace('.', '') - 0)) {
+            throw new Error(
+                'zrender/src ' + version$1
+                + ' is too old for ECharts ' + version
+                + '. Current version need ZRender '
+                + dependencies.zrender + '+'
+            );
+        }
+
+        if (!dom) {
+            throw new Error('Initialize failed: invalid dom.');
+        }
+    }
+
+    var existInstance = getInstanceByDom(dom);
+    if (existInstance) {
+        if (__DEV__) {
+            console.warn('There is a chart instance already initialized on the dom.');
+        }
+        return existInstance;
+    }
+
+    if (__DEV__) {
+        if (isDom(dom)
+            && dom.nodeName.toUpperCase() !== 'CANVAS'
+            && (
+                (!dom.clientWidth && (!opts || opts.width == null))
+                || (!dom.clientHeight && (!opts || opts.height == null))
+            )
+        ) {
+            console.warn('Can\'t get dom width or height');
+        }
+    }
+
+    var chart = new ECharts(dom, theme$$1, opts);
+    chart.id = 'ec_' + idBase++;
+    instances[chart.id] = chart;
+
+    setAttribute(dom, DOM_ATTRIBUTE_KEY, chart.id);
+
+    enableConnect(chart);
+
+    return chart;
+}
+
+/**
+ * @return {string|Array.<module:echarts~ECharts>} groupId
+ */
+function connect(groupId) {
+    // Is array of charts
+    if (isArray(groupId)) {
+        var charts = groupId;
+        groupId = null;
+        // If any chart has group
+        each(charts, function (chart) {
+            if (chart.group != null) {
+                groupId = chart.group;
+            }
+        });
+        groupId = groupId || ('g_' + groupIdBase++);
+        each(charts, function (chart) {
+            chart.group = groupId;
+        });
+    }
+    connectedGroups[groupId] = true;
+    return groupId;
+}
+
+/**
+ * @DEPRECATED
+ * @return {string} groupId
+ */
+function disConnect(groupId) {
+    connectedGroups[groupId] = false;
+}
+
+/**
+ * @return {string} groupId
+ */
+var disconnect = disConnect;
+
+/**
+ * Dispose a chart instance
+ * @param  {module:echarts~ECharts|HTMLDomElement|string} chart
+ */
+function dispose(chart) {
+    if (typeof chart === 'string') {
+        chart = instances[chart];
+    }
+    else if (!(chart instanceof ECharts)){
+        // Try to treat as dom
+        chart = getInstanceByDom(chart);
+    }
+    if ((chart instanceof ECharts) && !chart.isDisposed()) {
+        chart.dispose();
+    }
+}
+
+/**
+ * @param  {HTMLElement} dom
+ * @return {echarts~ECharts}
+ */
+function getInstanceByDom(dom) {
+    return instances[getAttribute(dom, DOM_ATTRIBUTE_KEY)];
+}
+
+/**
+ * @param {string} key
+ * @return {echarts~ECharts}
+ */
+function getInstanceById(key) {
+    return instances[key];
+}
+
+/**
+ * Register theme
+ */
+function registerTheme(name, theme$$1) {
+    themeStorage[name] = theme$$1;
+}
+
+/**
+ * Register option preprocessor
+ * @param {Function} preprocessorFunc
+ */
+function registerPreprocessor(preprocessorFunc) {
+    optionPreprocessorFuncs.push(preprocessorFunc);
+}
+
+/**
+ * @param {number} [priority=1000]
+ * @param {Object|Function} processor
+ */
+function registerProcessor(priority, processor) {
+    normalizeRegister(dataProcessorFuncs, priority, processor, PRIORITY_PROCESSOR_FILTER);
+}
+
+/**
+ * Register postUpdater
+ * @param {Function} postUpdateFunc
+ */
+function registerPostUpdate(postUpdateFunc) {
+    postUpdateFuncs.push(postUpdateFunc);
+}
+
+/**
+ * Usage:
+ * registerAction('someAction', 'someEvent', function () { ... });
+ * registerAction('someAction', function () { ... });
+ * registerAction(
+ *     {type: 'someAction', event: 'someEvent', update: 'updateView'},
+ *     function () { ... }
+ * );
+ *
+ * @param {(string|Object)} actionInfo
+ * @param {string} actionInfo.type
+ * @param {string} [actionInfo.event]
+ * @param {string} [actionInfo.update]
+ * @param {string} [eventName]
+ * @param {Function} action
+ */
+function registerAction(actionInfo, eventName, action) {
+    if (typeof eventName === 'function') {
+        action = eventName;
+        eventName = '';
+    }
+    var actionType = isObject(actionInfo)
+        ? actionInfo.type
+        : ([actionInfo, actionInfo = {
+            event: eventName
+        }][0]);
+
+    // Event name is all lowercase
+    actionInfo.event = (actionInfo.event || actionType).toLowerCase();
+    eventName = actionInfo.event;
+
+    // Validate action type and event name.
+    assert(ACTION_REG.test(actionType) && ACTION_REG.test(eventName));
+
+    if (!actions[actionType]) {
+        actions[actionType] = {action: action, actionInfo: actionInfo};
+    }
+    eventActionMap[eventName] = actionType;
+}
+
+/**
+ * @param {string} type
+ * @param {*} CoordinateSystem
+ */
+function registerCoordinateSystem(type, CoordinateSystem$$1) {
+    CoordinateSystemManager.register(type, CoordinateSystem$$1);
+}
+
+/**
+ * Get dimensions of specified coordinate system.
+ * @param {string} type
+ * @return {Array.<string|Object>}
+ */
+function getCoordinateSystemDimensions(type) {
+    var coordSysCreator = CoordinateSystemManager.get(type);
+    if (coordSysCreator) {
+        return coordSysCreator.getDimensionsInfo
+                ? coordSysCreator.getDimensionsInfo()
+                : coordSysCreator.dimensions.slice();
+    }
+}
+
+/**
+ * Layout is a special stage of visual encoding
+ * Most visual encoding like color are common for different chart
+ * But each chart has it's own layout algorithm
+ *
+ * @param {number} [priority=1000]
+ * @param {Function} layoutTask
+ */
+function registerLayout(priority, layoutTask) {
+    normalizeRegister(visualFuncs, priority, layoutTask, PRIORITY_VISUAL_LAYOUT, 'layout');
+}
+
+/**
+ * @param {number} [priority=3000]
+ * @param {module:echarts/stream/Task} visualTask
+ */
+function registerVisual(priority, visualTask) {
+    normalizeRegister(visualFuncs, priority, visualTask, PRIORITY_VISUAL_CHART, 'visual');
+}
+
+/**
+ * @param {Object|Function} fn: {seriesType, createOnAllSeries, performRawSeries, reset}
+ */
+function normalizeRegister(targetList, priority, fn, defaultPriority, visualType) {
+    if (isFunction(priority) || isObject(priority)) {
+        fn = priority;
+        priority = defaultPriority;
+    }
+
+    if (__DEV__) {
+        if (isNaN(priority) || priority == null) {
+            throw new Error('Illegal priority');
+        }
+        // Check duplicate
+        each(targetList, function (wrap) {
+            assert(wrap.__raw !== fn);
+        });
+    }
+
+    var stageHandler = Scheduler.wrapStageHandler(fn, visualType);
+
+    stageHandler.__prio = priority;
+    stageHandler.__raw = fn;
+    targetList.push(stageHandler);
+
+    return stageHandler;
+}
+
+/**
+ * @param {string} name
+ */
+function registerLoading(name, loadingFx) {
+    loadingEffects[name] = loadingFx;
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendComponentModel(opts/*, superClass*/) {
+    // var Clazz = ComponentModel;
+    // if (superClass) {
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ComponentModel.getClass(classType.main, classType.sub, true);
+    // }
+    return ComponentModel.extend(opts);
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendComponentView(opts/*, superClass*/) {
+    // var Clazz = ComponentView;
+    // if (superClass) {
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ComponentView.getClass(classType.main, classType.sub, true);
+    // }
+    return Component.extend(opts);
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendSeriesModel(opts/*, superClass*/) {
+    // var Clazz = SeriesModel;
+    // if (superClass) {
+    //     superClass = 'series.' + superClass.replace('series.', '');
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ComponentModel.getClass(classType.main, classType.sub, true);
+    // }
+    return SeriesModel.extend(opts);
+}
+
+/**
+ * @param {Object} opts
+ * @param {string} [superClass]
+ */
+function extendChartView(opts/*, superClass*/) {
+    // var Clazz = ChartView;
+    // if (superClass) {
+    //     superClass = superClass.replace('series.', '');
+    //     var classType = parseClassType(superClass);
+    //     Clazz = ChartView.getClass(classType.main, true);
+    // }
+    return Chart.extend(opts);
+}
+
+/**
+ * ZRender need a canvas context to do measureText.
+ * But in node environment canvas may be created by node-canvas.
+ * So we need to specify how to create a canvas instead of using document.createElement('canvas')
+ *
+ * Be careful of using it in the browser.
+ *
+ * @param {Function} creator
+ * @example
+ *     var Canvas = require('canvas');
+ *     var echarts = require('echarts');
+ *     echarts.setCanvasCreator(function () {
+ *         // Small size is enough.
+ *         return new Canvas(32, 32);
+ *     });
+ */
+function setCanvasCreator(creator) {
+    $override('createCanvas', creator);
+}
+
+/**
+ * @param {string} mapName
+ * @param {Object|string} geoJson
+ * @param {Object} [specialAreas]
+ *
+ * @example
+ *     $.get('USA.json', function (geoJson) {
+ *         echarts.registerMap('USA', geoJson);
+ *         // Or
+ *         echarts.registerMap('USA', {
+ *             geoJson: geoJson,
+ *             specialAreas: {}
+ *         })
+ *     });
+ */
+function registerMap(mapName, geoJson, specialAreas) {
+    if (geoJson.geoJson && !geoJson.features) {
+        specialAreas = geoJson.specialAreas;
+        geoJson = geoJson.geoJson;
+    }
+    if (typeof geoJson === 'string') {
+        geoJson = (typeof JSON !== 'undefined' && JSON.parse)
+            ? JSON.parse(geoJson) : (new Function('return (' + geoJson + ');'))();
+    }
+    mapDataStores[mapName] = {
+        geoJson: geoJson,
+        specialAreas: specialAreas
+    };
+}
+
+/**
+ * @param {string} mapName
+ * @return {Object}
+ */
+function getMap(mapName) {
+    return mapDataStores[mapName];
+}
+
+registerVisual(PRIORITY_VISUAL_GLOBAL, seriesColor);
+registerPreprocessor(backwardCompat);
+registerProcessor(PRIORITY_PROCESSOR_STATISTIC, dataStack);
+registerLoading('default', loadingDefault);
+
+// Default actions
+
+registerAction({
+    type: 'highlight',
+    event: 'highlight',
+    update: 'highlight'
+}, noop);
+
+registerAction({
+    type: 'downplay',
+    event: 'downplay',
+    update: 'downplay'
+}, noop);
+
+// Default theme
+registerTheme('light', lightTheme);
+registerTheme('dark', theme);
+
+// For backward compatibility, where the namespace `dataTool` will
+// be mounted on `echarts` is the extension `dataTool` is imported.
+var dataTool = {};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function defaultKeyGetter(item) {
+    return item;
+}
+
+/**
+ * @param {Array} oldArr
+ * @param {Array} newArr
+ * @param {Function} oldKeyGetter
+ * @param {Function} newKeyGetter
+ * @param {Object} [context] Can be visited by this.context in callback.
+ */
+function DataDiffer(oldArr, newArr, oldKeyGetter, newKeyGetter, context) {
+    this._old = oldArr;
+    this._new = newArr;
+
+    this._oldKeyGetter = oldKeyGetter || defaultKeyGetter;
+    this._newKeyGetter = newKeyGetter || defaultKeyGetter;
+
+    this.context = context;
+}
+
+DataDiffer.prototype = {
+
+    constructor: DataDiffer,
+
+    /**
+     * Callback function when add a data
+     */
+    add: function (func) {
+        this._add = func;
+        return this;
+    },
+
+    /**
+     * Callback function when update a data
+     */
+    update: function (func) {
+        this._update = func;
+        return this;
+    },
+
+    /**
+     * Callback function when remove a data
+     */
+    remove: function (func) {
+        this._remove = func;
+        return this;
+    },
+
+    execute: function () {
+        var oldArr = this._old;
+        var newArr = this._new;
+
+        var oldDataIndexMap = {};
+        var newDataIndexMap = {};
+        var oldDataKeyArr = [];
+        var newDataKeyArr = [];
+        var i;
+
+        initIndexMap(oldArr, oldDataIndexMap, oldDataKeyArr, '_oldKeyGetter', this);
+        initIndexMap(newArr, newDataIndexMap, newDataKeyArr, '_newKeyGetter', this);
+
+        // Travel by inverted order to make sure order consistency
+        // when duplicate keys exists (consider newDataIndex.pop() below).
+        // For performance consideration, these code below do not look neat.
+        for (i = 0; i < oldArr.length; i++) {
+            var key = oldDataKeyArr[i];
+            var idx = newDataIndexMap[key];
+
+            // idx can never be empty array here. see 'set null' logic below.
+            if (idx != null) {
+                // Consider there is duplicate key (for example, use dataItem.name as key).
+                // We should make sure every item in newArr and oldArr can be visited.
+                var len = idx.length;
+                if (len) {
+                    len === 1 && (newDataIndexMap[key] = null);
+                    idx = idx.unshift();
+                }
+                else {
+                    newDataIndexMap[key] = null;
+                }
+                this._update && this._update(idx, i);
+            }
+            else {
+                this._remove && this._remove(i);
+            }
+        }
+
+        for (var i = 0; i < newDataKeyArr.length; i++) {
+            var key = newDataKeyArr[i];
+            if (newDataIndexMap.hasOwnProperty(key)) {
+                var idx = newDataIndexMap[key];
+                if (idx == null) {
+                    continue;
+                }
+                // idx can never be empty array here. see 'set null' logic above.
+                if (!idx.length) {
+                    this._add && this._add(idx);
+                }
+                else {
+                    for (var j = 0, len = idx.length; j < len; j++) {
+                        this._add && this._add(idx[j]);
+                    }
+                }
+            }
+        }
+    }
+};
+
+function initIndexMap(arr, map, keyArr, keyGetterName, dataDiffer) {
+    for (var i = 0; i < arr.length; i++) {
+        // Add prefix to avoid conflict with Object.prototype.
+        var key = '_ec_' + dataDiffer[keyGetterName](arr[i], i);
+        var existence = map[key];
+        if (existence == null) {
+            keyArr.push(key);
+            map[key] = i;
+        }
+        else {
+            if (!existence.length) {
+                map[key] = existence = [existence];
+            }
+            existence.push(i);
+        }
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var OTHER_DIMENSIONS = createHashMap([
+    'tooltip', 'label', 'itemName', 'itemId', 'seriesName'
+]);
+
+function summarizeDimensions(data) {
+    var summary = {};
+    var encode = summary.encode = {};
+    var notExtraCoordDimMap = createHashMap();
+    var defaultedLabel = [];
+    var defaultedTooltip = [];
+
+    each$1(data.dimensions, function (dimName) {
+        var dimItem = data.getDimensionInfo(dimName);
+
+        var coordDim = dimItem.coordDim;
+        if (coordDim) {
+            if (__DEV__) {
+                assert$1(OTHER_DIMENSIONS.get(coordDim) == null);
+            }
+            var coordDimArr = encode[coordDim];
+            if (!encode.hasOwnProperty(coordDim)) {
+                coordDimArr = encode[coordDim] = [];
+            }
+            coordDimArr[dimItem.coordDimIndex] = dimName;
+
+            if (!dimItem.isExtraCoord) {
+                notExtraCoordDimMap.set(coordDim, 1);
+
+                // Use the last coord dim (and label friendly) as default label,
+                // because when dataset is used, it is hard to guess which dimension
+                // can be value dimension. If both show x, y on label is not look good,
+                // and conventionally y axis is focused more.
+                if (mayLabelDimType(dimItem.type)) {
+                    defaultedLabel[0] = dimName;
+                }
+            }
+            if (dimItem.defaultTooltip) {
+                defaultedTooltip.push(dimName);
+            }
+        }
+
+        OTHER_DIMENSIONS.each(function (v, otherDim) {
+            var otherDimArr = encode[otherDim];
+            if (!encode.hasOwnProperty(otherDim)) {
+                otherDimArr = encode[otherDim] = [];
+            }
+
+            var dimIndex = dimItem.otherDims[otherDim];
+            if (dimIndex != null && dimIndex !== false) {
+                otherDimArr[dimIndex] = dimItem.name;
+            }
+        });
+    });
+
+    var dataDimsOnCoord = [];
+    var encodeFirstDimNotExtra = {};
+
+    notExtraCoordDimMap.each(function (v, coordDim) {
+        var dimArr = encode[coordDim];
+        // ??? FIXME extra coord should not be set in dataDimsOnCoord.
+        // But should fix the case that radar axes: simplify the logic
+        // of `completeDimension`, remove `extraPrefix`.
+        encodeFirstDimNotExtra[coordDim] = dimArr[0];
+        // Not necessary to remove duplicate, because a data
+        // dim canot on more than one coordDim.
+        dataDimsOnCoord = dataDimsOnCoord.concat(dimArr);
+    });
+
+    summary.dataDimsOnCoord = dataDimsOnCoord;
+    summary.encodeFirstDimNotExtra = encodeFirstDimNotExtra;
+
+    var encodeLabel = encode.label;
+    // FIXME `encode.label` is not recommanded, because formatter can not be set
+    // in this way. Use label.formatter instead. May be remove this approach someday.
+    if (encodeLabel && encodeLabel.length) {
+        defaultedLabel = encodeLabel.slice();
+    }
+
+    var encodeTooltip = encode.tooltip;
+    if (encodeTooltip && encodeTooltip.length) {
+        defaultedTooltip = encodeTooltip.slice();
+    }
+    else if (!defaultedTooltip.length) {
+        defaultedTooltip = defaultedLabel.slice();
+    }
+
+    encode.defaultedLabel = defaultedLabel;
+    encode.defaultedTooltip = defaultedTooltip;
+
+    return summary;
+}
+
+function getDimensionTypeByAxis(axisType) {
+    return axisType === 'category'
+        ? 'ordinal'
+        : axisType === 'time'
+        ? 'time'
+        : 'float';
+}
+
+function mayLabelDimType(dimType) {
+    // In most cases, ordinal and time do not suitable for label.
+    // Ordinal info can be displayed on axis. Time is too long.
+    return !(dimType === 'ordinal' || dimType === 'time');
+}
+
+// function findTheLastDimMayLabel(data) {
+//     // Get last value dim
+//     var dimensions = data.dimensions.slice();
+//     var valueType;
+//     var valueDim;
+//     while (dimensions.length && (
+//         valueDim = dimensions.pop(),
+//         valueType = data.getDimensionInfo(valueDim).type,
+//         valueType === 'ordinal' || valueType === 'time'
+//     )) {} // jshint ignore:line
+//     return valueDim;
+// }
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * List for data storage
+ * @module echarts/data/List
+ */
+
+var isObject$4 = isObject$1;
+
+var UNDEFINED = 'undefined';
+
+// Use prefix to avoid index to be the same as otherIdList[idx],
+// which will cause weird udpate animation.
+var ID_PREFIX = 'e\0\0';
+
+var dataCtors = {
+    'float': typeof Float64Array === UNDEFINED
+        ? Array : Float64Array,
+    'int': typeof Int32Array === UNDEFINED
+        ? Array : Int32Array,
+    // Ordinal data type can be string or int
+    'ordinal': Array,
+    'number': Array,
+    'time': Array
+};
+
+// Caution: MUST not use `new CtorUint32Array(arr, 0, len)`, because the Ctor of array is
+// different from the Ctor of typed array.
+var CtorUint32Array = typeof Uint32Array === UNDEFINED ? Array : Uint32Array;
+var CtorUint16Array = typeof Uint16Array === UNDEFINED ? Array : Uint16Array;
+
+function getIndicesCtor(list) {
+    // The possible max value in this._indicies is always this._rawCount despite of filtering.
+    return list._rawCount > 65535 ? CtorUint32Array : CtorUint16Array;
+}
+
+function cloneChunk(originalChunk) {
+    var Ctor = originalChunk.constructor;
+    // Only shallow clone is enough when Array.
+    return Ctor === Array ? originalChunk.slice() : new Ctor(originalChunk);
+}
+
+var TRANSFERABLE_PROPERTIES = [
+    'hasItemOption', '_nameList', '_idList', '_invertedIndicesMap',
+    '_rawData', '_chunkSize', '_chunkCount', '_dimValueGetter',
+    '_count', '_rawCount', '_nameDimIdx', '_idDimIdx'
+];
+var CLONE_PROPERTIES = [
+    '_extent', '_approximateExtent', '_rawExtent'
+];
+
+function transferProperties(target, source) {
+    each$1(TRANSFERABLE_PROPERTIES.concat(source.__wrappedMethods || []), function (propName) {
+        if (source.hasOwnProperty(propName)) {
+            target[propName] = source[propName];
+        }
+    });
+
+    target.__wrappedMethods = source.__wrappedMethods;
+
+    each$1(CLONE_PROPERTIES, function (propName) {
+        target[propName] = clone(source[propName]);
+    });
+
+    target._calculationInfo = extend(source._calculationInfo);
+}
+
+
+
+
+
+/**
+ * @constructor
+ * @alias module:echarts/data/List
+ *
+ * @param {Array.<string|Object>} dimensions
+ *      For example, ['someDimName', {name: 'someDimName', type: 'someDimType'}, ...].
+ *      Dimensions should be concrete names like x, y, z, lng, lat, angle, radius
+ *      Spetial fields: {
+ *          ordinalMeta: <module:echarts/data/OrdinalMeta>
+ *          createInvertedIndices: <boolean>
+ *      }
+ * @param {module:echarts/model/Model} hostModel
+ */
+var List = function (dimensions, hostModel) {
+
+    dimensions = dimensions || ['x', 'y'];
+
+    var dimensionInfos = {};
+    var dimensionNames = [];
+    var invertedIndicesMap = {};
+
+    for (var i = 0; i < dimensions.length; i++) {
+        // Use the original dimensions[i], where other flag props may exists.
+        var dimensionInfo = dimensions[i];
+
+        if (isString(dimensionInfo)) {
+            dimensionInfo = {name: dimensionInfo};
+        }
+
+        var dimensionName = dimensionInfo.name;
+        dimensionInfo.type = dimensionInfo.type || 'float';
+        if (!dimensionInfo.coordDim) {
+            dimensionInfo.coordDim = dimensionName;
+            dimensionInfo.coordDimIndex = 0;
+        }
+
+        dimensionInfo.otherDims = dimensionInfo.otherDims || {};
+        dimensionNames.push(dimensionName);
+        dimensionInfos[dimensionName] = dimensionInfo;
+
+        dimensionInfo.index = i;
+
+        if (dimensionInfo.createInvertedIndices) {
+            invertedIndicesMap[dimensionName] = [];
+        }
+    }
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    this.dimensions = dimensionNames;
+
+    /**
+     * Infomation of each data dimension, like data type.
+     * @type {Object}
+     */
+    this._dimensionInfos = dimensionInfos;
+
+    /**
+     * @type {module:echarts/model/Model}
+     */
+    this.hostModel = hostModel;
+
+    /**
+     * @type {module:echarts/model/Model}
+     */
+    this.dataType;
+
+    /**
+     * Indices stores the indices of data subset after filtered.
+     * This data subset will be used in chart.
+     * @type {Array.<number>}
+     * @readOnly
+     */
+    this._indices = null;
+
+    this._count = 0;
+    this._rawCount = 0;
+
+    /**
+     * Data storage
+     * @type {Object.<key, Array.<TypedArray|Array>>}
+     * @private
+     */
+    this._storage = {};
+
+    /**
+     * @type {Array.<string>}
+     */
+    this._nameList = [];
+    /**
+     * @type {Array.<string>}
+     */
+    this._idList = [];
+
+    /**
+     * Models of data option is stored sparse for optimizing memory cost
+     * @type {Array.<module:echarts/model/Model>}
+     * @private
+     */
+    this._optionModels = [];
+
+    /**
+     * Global visual properties after visual coding
+     * @type {Object}
+     * @private
+     */
+    this._visual = {};
+
+    /**
+     * Globel layout properties.
+     * @type {Object}
+     * @private
+     */
+    this._layout = {};
+
+    /**
+     * Item visual properties after visual coding
+     * @type {Array.<Object>}
+     * @private
+     */
+    this._itemVisuals = [];
+
+    /**
+     * Key: visual type, Value: boolean
+     * @type {Object}
+     * @readOnly
+     */
+    this.hasItemVisual = {};
+
+    /**
+     * Item layout properties after layout
+     * @type {Array.<Object>}
+     * @private
+     */
+    this._itemLayouts = [];
+
+    /**
+     * Graphic elemnents
+     * @type {Array.<module:zrender/Element>}
+     * @private
+     */
+    this._graphicEls = [];
+
+    /**
+     * Max size of each chunk.
+     * @type {number}
+     * @private
+     */
+    this._chunkSize = 1e5;
+
+    /**
+     * @type {number}
+     * @private
+     */
+    this._chunkCount = 0;
+
+    /**
+     * @type {Array.<Array|Object>}
+     * @private
+     */
+    this._rawData;
+
+    /**
+     * Raw extent will not be cloned, but only transfered.
+     * It will not be calculated util needed.
+     * key: dim,
+     * value: {end: number, extent: Array.<number>}
+     * @type {Object}
+     * @private
+     */
+    this._rawExtent = {};
+
+    /**
+     * @type {Object}
+     * @private
+     */
+    this._extent = {};
+
+    /**
+     * key: dim
+     * value: extent
+     * @type {Object}
+     * @private
+     */
+    this._approximateExtent = {};
+
+    /**
+     * Cache summary info for fast visit. See "dimensionHelper".
+     * @type {Object}
+     * @private
+     */
+    this._dimensionsSummary = summarizeDimensions(this);
+
+    /**
+     * @type {Object.<Array|TypedArray>}
+     * @private
+     */
+    this._invertedIndicesMap = invertedIndicesMap;
+
+    /**
+     * @type {Object}
+     * @private
+     */
+    this._calculationInfo = {};
+};
+
+var listProto = List.prototype;
+
+listProto.type = 'list';
+
+/**
+ * If each data item has it's own option
+ * @type {boolean}
+ */
+listProto.hasItemOption = true;
+
+/**
+ * Get dimension name
+ * @param {string|number} dim
+ *        Dimension can be concrete names like x, y, z, lng, lat, angle, radius
+ *        Or a ordinal number. For example getDimensionInfo(0) will return 'x' or 'lng' or 'radius'
+ * @return {string} Concrete dim name.
+ */
+listProto.getDimension = function (dim) {
+    if (!isNaN(dim)) {
+        dim = this.dimensions[dim] || dim;
+    }
+    return dim;
+};
+
+/**
+ * Get type and calculation info of particular dimension
+ * @param {string|number} dim
+ *        Dimension can be concrete names like x, y, z, lng, lat, angle, radius
+ *        Or a ordinal number. For example getDimensionInfo(0) will return 'x' or 'lng' or 'radius'
+ */
+listProto.getDimensionInfo = function (dim) {
+    // Do not clone, because there may be categories in dimInfo.
+    return this._dimensionInfos[this.getDimension(dim)];
+};
+
+/**
+ * @return {Array.<string>} concrete dimension name list on coord.
+ */
+listProto.getDimensionsOnCoord = function () {
+    return this._dimensionsSummary.dataDimsOnCoord.slice();
+};
+
+/**
+ * @param {string} coordDim
+ * @param {number} [idx] A coordDim may map to more than one data dim.
+ *        If idx is `true`, return a array of all mapped dims.
+ *        If idx is not specified, return the first dim not extra.
+ * @return {string|Array.<string>} concrete data dim.
+ *        If idx is number, and not found, return null/undefined.
+ *        If idx is `true`, and not found, return empty array (always return array).
+ */
+listProto.mapDimension = function (coordDim, idx) {
+    var dimensionsSummary = this._dimensionsSummary;
+
+    if (idx == null) {
+        return dimensionsSummary.encodeFirstDimNotExtra[coordDim];
+    }
+
+    var dims = dimensionsSummary.encode[coordDim];
+    return idx === true
+        // always return array if idx is `true`
+        ? (dims || []).slice()
+        : (dims && dims[idx]);
+};
+
+/**
+ * Initialize from data
+ * @param {Array.<Object|number|Array>} data source or data or data provider.
+ * @param {Array.<string>} [nameLIst] The name of a datum is used on data diff and
+ *        defualt label/tooltip.
+ *        A name can be specified in encode.itemName,
+ *        or dataItem.name (only for series option data),
+ *        or provided in nameList from outside.
+ * @param {Function} [dimValueGetter] (dataItem, dimName, dataIndex, dimIndex) => number
+ */
+listProto.initData = function (data, nameList, dimValueGetter) {
+
+    var notProvider = Source.isInstance(data) || isArrayLike(data);
+    if (notProvider) {
+        data = new DefaultDataProvider(data, this.dimensions.length);
+    }
+
+    if (__DEV__) {
+        if (!notProvider && (typeof data.getItem != 'function' || typeof data.count != 'function')) {
+            throw new Error('Inavlid data provider.');
+        }
+    }
+
+    this._rawData = data;
+
+    // Clear
+    this._storage = {};
+    this._indices = null;
+
+    this._nameList = nameList || [];
+
+    this._idList = [];
+
+    this._nameRepeatCount = {};
+
+    if (!dimValueGetter) {
+        this.hasItemOption = false;
+    }
+
+    /**
+     * @readOnly
+     */
+    this.defaultDimValueGetter = defaultDimValueGetters[
+        this._rawData.getSource().sourceFormat
+    ];
+
+    // Default dim value getter
+    this._dimValueGetter = dimValueGetter = dimValueGetter
+        || this.defaultDimValueGetter;
+
+    // Reset raw extent.
+    this._rawExtent = {};
+
+    this._initDataFromProvider(0, data.count());
+
+    // If data has no item option.
+    if (data.pure) {
+        this.hasItemOption = false;
+    }
+};
+
+listProto.getProvider = function () {
+    return this._rawData;
+};
+
+listProto.appendData = function (data) {
+    if (__DEV__) {
+        assert$1(!this._indices, 'appendData can only be called on raw data.');
+    }
+
+    var rawData = this._rawData;
+    var start = this.count();
+    rawData.appendData(data);
+    var end = rawData.count();
+    if (!rawData.persistent) {
+        end += start;
+    }
+    this._initDataFromProvider(start, end);
+};
+
+listProto._initDataFromProvider = function (start, end) {
+    // Optimize.
+    if (start >= end) {
+        return;
+    }
+
+    var chunkSize = this._chunkSize;
+    var rawData = this._rawData;
+    var storage = this._storage;
+    var dimensions = this.dimensions;
+    var dimLen = dimensions.length;
+    var dimensionInfoMap = this._dimensionInfos;
+    var nameList = this._nameList;
+    var idList = this._idList;
+    var rawExtent = this._rawExtent;
+    var nameRepeatCount = this._nameRepeatCount = {};
+    var nameDimIdx;
+
+    var chunkCount = this._chunkCount;
+    var lastChunkIndex = chunkCount - 1;
+    for (var i = 0; i < dimLen; i++) {
+        var dim = dimensions[i];
+        if (!rawExtent[dim]) {
+            rawExtent[dim] = getInitialExtent();
+        }
+
+        var dimInfo = dimensionInfoMap[dim];
+        if (dimInfo.otherDims.itemName === 0) {
+            nameDimIdx = this._nameDimIdx = i;
+        }
+        if (dimInfo.otherDims.itemId === 0) {
+            this._idDimIdx = i;
+        }
+        var DataCtor = dataCtors[dimInfo.type];
+
+        if (!storage[dim]) {
+            storage[dim] = [];
+        }
+        var resizeChunkArray = storage[dim][lastChunkIndex];
+        if (resizeChunkArray && resizeChunkArray.length < chunkSize) {
+            var newStore = new DataCtor(Math.min(end - lastChunkIndex * chunkSize, chunkSize));
+            // The cost of the copy is probably inconsiderable
+            // within the initial chunkSize.
+            for (var j = 0; j < resizeChunkArray.length; j++) {
+                newStore[j] = resizeChunkArray[j];
+            }
+            storage[dim][lastChunkIndex] = newStore;
+        }
+
+        // Create new chunks.
+        for (var k = chunkCount * chunkSize; k < end; k += chunkSize) {
+            storage[dim].push(new DataCtor(Math.min(end - k, chunkSize)));
+        }
+        this._chunkCount = storage[dim].length;
+    }
+
+    var dataItem = new Array(dimLen);
+    for (var idx = start; idx < end; idx++) {
+        // NOTICE: Try not to write things into dataItem
+        dataItem = rawData.getItem(idx, dataItem);
+        // Each data item is value
+        // [1, 2]
+        // 2
+        // Bar chart, line chart which uses category axis
+        // only gives the 'y' value. 'x' value is the indices of category
+        // Use a tempValue to normalize the value to be a (x, y) value
+        var chunkIndex = Math.floor(idx / chunkSize);
+        var chunkOffset = idx % chunkSize;
+
+        // Store the data by dimensions
+        for (var k = 0; k < dimLen; k++) {
+            var dim = dimensions[k];
+            var dimStorage = storage[dim][chunkIndex];
+            // PENDING NULL is empty or zero
+            var val = this._dimValueGetter(dataItem, dim, idx, k);
+            dimStorage[chunkOffset] = val;
+
+            var dimRawExtent = rawExtent[dim];
+            if (val < dimRawExtent[0]) {
+                dimRawExtent[0] = val;
+            }
+            if (val > dimRawExtent[1]) {
+                dimRawExtent[1] = val;
+            }
+        }
+
+        // ??? FIXME not check by pure but sourceFormat?
+        // TODO refactor these logic.
+        if (!rawData.pure) {
+            var name = nameList[idx];
+
+            if (dataItem && name == null) {
+                // If dataItem is {name: ...}, it has highest priority.
+                // That is appropriate for many common cases.
+                if (dataItem.name != null) {
+                    // There is no other place to persistent dataItem.name,
+                    // so save it to nameList.
+                    nameList[idx] = name = dataItem.name;
+                }
+                else if (nameDimIdx != null) {
+                    var nameDim = dimensions[nameDimIdx];
+                    var nameDimChunk = storage[nameDim][chunkIndex];
+                    if (nameDimChunk) {
+                        name = nameDimChunk[chunkOffset];
+                        var ordinalMeta = dimensionInfoMap[nameDim].ordinalMeta;
+                        if (ordinalMeta && ordinalMeta.categories.length) {
+                            name = ordinalMeta.categories[name];
+                        }
+                    }
+                }
+            }
+
+            // Try using the id in option
+            // id or name is used on dynamical data, mapping old and new items.
+            var id = dataItem == null ? null : dataItem.id;
+
+            if (id == null && name != null) {
+                // Use name as id and add counter to avoid same name
+                nameRepeatCount[name] = nameRepeatCount[name] || 0;
+                id = name;
+                if (nameRepeatCount[name] > 0) {
+                    id += '__ec__' + nameRepeatCount[name];
+                }
+                nameRepeatCount[name]++;
+            }
+            id != null && (idList[idx] = id);
+        }
+    }
+
+    if (!rawData.persistent && rawData.clean) {
+        // Clean unused data if data source is typed array.
+        rawData.clean();
+    }
+
+    this._rawCount = this._count = end;
+
+    // Reset data extent
+    this._extent = {};
+
+    prepareInvertedIndex(this);
+};
+
+function prepareInvertedIndex(list) {
+    var invertedIndicesMap = list._invertedIndicesMap;
+    each$1(invertedIndicesMap, function (invertedIndices, dim) {
+        var dimInfo = list._dimensionInfos[dim];
+
+        // Currently, only dimensions that has ordinalMeta can create inverted indices.
+        var ordinalMeta = dimInfo.ordinalMeta;
+        if (ordinalMeta) {
+            invertedIndices = invertedIndicesMap[dim] = new CtorUint32Array(
+                ordinalMeta.categories.length
+            );
+            // The default value of TypedArray is 0. To avoid miss
+            // mapping to 0, we should set it as NaN.
+            for (var i = 0; i < invertedIndices.length; i++) {
+                invertedIndices[i] = NaN;
+            }
+            for (var i = 0; i < list._count; i++) {
+                // Only support the case that all values are distinct.
+                invertedIndices[list.get(dim, i)] = i;
+            }
+        }
+    });
+}
+
+function getRawValueFromStore(list, dimIndex, rawIndex) {
+    var val;
+    if (dimIndex != null) {
+        var chunkSize = list._chunkSize;
+        var chunkIndex = Math.floor(rawIndex / chunkSize);
+        var chunkOffset = rawIndex % chunkSize;
+        var dim = list.dimensions[dimIndex];
+        var chunk = list._storage[dim][chunkIndex];
+        if (chunk) {
+            val = chunk[chunkOffset];
+            var ordinalMeta = list._dimensionInfos[dim].ordinalMeta;
+            if (ordinalMeta && ordinalMeta.categories.length) {
+                val = ordinalMeta.categories[val];
+            }
+        }
+    }
+    return val;
+}
+
+/**
+ * @return {number}
+ */
+listProto.count = function () {
+    return this._count;
+};
+
+listProto.getIndices = function () {
+    var newIndices;
+
+    var indices = this._indices;
+    if (indices) {
+        var Ctor = indices.constructor;
+        var thisCount = this._count;
+        // `new Array(a, b, c)` is different from `new Uint32Array(a, b, c)`.
+        if (Ctor === Array) {
+            newIndices = new Ctor(thisCount);
+            for (var i = 0; i < thisCount; i++) {
+                newIndices[i] = indices[i];
+            }
+        }
+        else {
+            newIndices = new Ctor(indices.buffer, 0, thisCount);
+        }
+    }
+    else {
+        var Ctor = getIndicesCtor(this);
+        var newIndices = new Ctor(this.count());
+        for (var i = 0; i < newIndices.length; i++) {
+            newIndices[i] = i;
+        }
+    }
+
+    return newIndices;
+};
+
+/**
+ * Get value. Return NaN if idx is out of range.
+ * @param {string} dim Dim must be concrete name.
+ * @param {number} idx
+ * @param {boolean} stack
+ * @return {number}
+ */
+listProto.get = function (dim, idx /*, stack */) {
+    if (!(idx >= 0 && idx < this._count)) {
+        return NaN;
+    }
+    var storage = this._storage;
+    if (!storage[dim]) {
+        // TODO Warn ?
+        return NaN;
+    }
+
+    idx = this.getRawIndex(idx);
+
+    var chunkIndex = Math.floor(idx / this._chunkSize);
+    var chunkOffset = idx % this._chunkSize;
+
+    var chunkStore = storage[dim][chunkIndex];
+    var value = chunkStore[chunkOffset];
+    // FIXME ordinal data type is not stackable
+    // if (stack) {
+    //     var dimensionInfo = this._dimensionInfos[dim];
+    //     if (dimensionInfo && dimensionInfo.stackable) {
+    //         var stackedOn = this.stackedOn;
+    //         while (stackedOn) {
+    //             // Get no stacked data of stacked on
+    //             var stackedValue = stackedOn.get(dim, idx);
+    //             // Considering positive stack, negative stack and empty data
+    //             if ((value >= 0 && stackedValue > 0)  // Positive stack
+    //                 || (value <= 0 && stackedValue < 0) // Negative stack
+    //             ) {
+    //                 value += stackedValue;
+    //             }
+    //             stackedOn = stackedOn.stackedOn;
+    //         }
+    //     }
+    // }
+
+    return value;
+};
+
+/**
+ * @param {string} dim concrete dim
+ * @param {number} rawIndex
+ * @return {number|string}
+ */
+listProto.getByRawIndex = function (dim, rawIdx) {
+    if (!(rawIdx >= 0 && rawIdx < this._rawCount)) {
+        return NaN;
+    }
+    var dimStore = this._storage[dim];
+    if (!dimStore) {
+        // TODO Warn ?
+        return NaN;
+    }
+
+    var chunkIndex = Math.floor(rawIdx / this._chunkSize);
+    var chunkOffset = rawIdx % this._chunkSize;
+    var chunkStore = dimStore[chunkIndex];
+    return chunkStore[chunkOffset];
+};
+
+/**
+ * FIXME Use `get` on chrome maybe slow(in filterSelf and selectRange).
+ * Hack a much simpler _getFast
+ * @private
+ */
+listProto._getFast = function (dim, rawIdx) {
+    var chunkIndex = Math.floor(rawIdx / this._chunkSize);
+    var chunkOffset = rawIdx % this._chunkSize;
+    var chunkStore = this._storage[dim][chunkIndex];
+    return chunkStore[chunkOffset];
+};
+
+/**
+ * Get value for multi dimensions.
+ * @param {Array.<string>} [dimensions] If ignored, using all dimensions.
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.getValues = function (dimensions, idx /*, stack */) {
+    var values = [];
+
+    if (!isArray(dimensions)) {
+        // stack = idx;
+        idx = dimensions;
+        dimensions = this.dimensions;
+    }
+
+    for (var i = 0, len = dimensions.length; i < len; i++) {
+        values.push(this.get(dimensions[i], idx /*, stack */));
+    }
+
+    return values;
+};
+
+/**
+ * If value is NaN. Inlcuding '-'
+ * Only check the coord dimensions.
+ * @param {string} dim
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.hasValue = function (idx) {
+    var dataDimsOnCoord = this._dimensionsSummary.dataDimsOnCoord;
+    var dimensionInfos = this._dimensionInfos;
+    for (var i = 0, len = dataDimsOnCoord.length; i < len; i++) {
+        if (
+            // Ordinal type can be string or number
+            dimensionInfos[dataDimsOnCoord[i]].type !== 'ordinal'
+            // FIXME check ordinal when using index?
+            && isNaN(this.get(dataDimsOnCoord[i], idx))
+        ) {
+            return false;
+        }
+    }
+    return true;
+};
+
+/**
+ * Get extent of data in one dimension
+ * @param {string} dim
+ * @param {boolean} stack
+ */
+listProto.getDataExtent = function (dim /*, stack */) {
+    // Make sure use concrete dim as cache name.
+    dim = this.getDimension(dim);
+    var dimData = this._storage[dim];
+    var initialExtent = getInitialExtent();
+
+    // stack = !!((stack || false) && this.getCalculationInfo(dim));
+
+    if (!dimData) {
+        return initialExtent;
+    }
+
+    // Make more strict checkings to ensure hitting cache.
+    var currEnd = this.count();
+    // var cacheName = [dim, !!stack].join('_');
+    // var cacheName = dim;
+
+    // Consider the most cases when using data zoom, `getDataExtent`
+    // happened before filtering. We cache raw extent, which is not
+    // necessary to be cleared and recalculated when restore data.
+    var useRaw = !this._indices; // && !stack;
+    var dimExtent;
+
+    if (useRaw) {
+        return this._rawExtent[dim].slice();
+    }
+    dimExtent = this._extent[dim];
+    if (dimExtent) {
+        return dimExtent.slice();
+    }
+    dimExtent = initialExtent;
+
+    var min = dimExtent[0];
+    var max = dimExtent[1];
+
+    for (var i = 0; i < currEnd; i++) {
+        // var value = stack ? this.get(dim, i, true) : this._getFast(dim, this.getRawIndex(i));
+        var value = this._getFast(dim, this.getRawIndex(i));
+        value < min && (min = value);
+        value > max && (max = value);
+    }
+
+    dimExtent = [min, max];
+
+    this._extent[dim] = dimExtent;
+
+    return dimExtent;
+};
+
+/**
+ * Optimize for the scenario that data is filtered by a given extent.
+ * Consider that if data amount is more than hundreds of thousand,
+ * extent calculation will cost more than 10ms and the cache will
+ * be erased because of the filtering.
+ */
+listProto.getApproximateExtent = function (dim /*, stack */) {
+    dim = this.getDimension(dim);
+    return this._approximateExtent[dim] || this.getDataExtent(dim /*, stack */);
+};
+
+listProto.setApproximateExtent = function (extent, dim /*, stack */) {
+    dim = this.getDimension(dim);
+    this._approximateExtent[dim] = extent.slice();
+};
+
+/**
+ * @param {string} key
+ * @return {*}
+ */
+listProto.getCalculationInfo = function (key) {
+    return this._calculationInfo[key];
+};
+
+/**
+ * @param {string|Object} key or k-v object
+ * @param {*} [value]
+ */
+listProto.setCalculationInfo = function (key, value) {
+    isObject$4(key)
+        ? extend(this._calculationInfo, key)
+        : (this._calculationInfo[key] = value);
+};
+
+/**
+ * Get sum of data in one dimension
+ * @param {string} dim
+ */
+listProto.getSum = function (dim /*, stack */) {
+    var dimData = this._storage[dim];
+    var sum = 0;
+    if (dimData) {
+        for (var i = 0, len = this.count(); i < len; i++) {
+            var value = this.get(dim, i /*, stack */);
+            if (!isNaN(value)) {
+                sum += value;
+            }
+        }
+    }
+    return sum;
+};
+
+/**
+ * Get median of data in one dimension
+ * @param {string} dim
+ */
+listProto.getMedian = function (dim /*, stack */) {
+    var dimDataArray = [];
+    // map all data of one dimension
+    this.each(dim, function (val, idx) {
+        if (!isNaN(val)) {
+            dimDataArray.push(val);
+        }
+    });
+
+    // TODO
+    // Use quick select?
+
+    // immutability & sort
+    var sortedDimDataArray = [].concat(dimDataArray).sort(function(a, b) {
+        return a - b;
+    });
+    var len = this.count();
+    // calculate median
+    return len === 0 ? 0 :
+        len % 2 === 1 ? sortedDimDataArray[(len - 1) / 2] :
+            (sortedDimDataArray[len / 2] + sortedDimDataArray[len / 2 - 1]) / 2;
+};
+
+// /**
+//  * Retreive the index with given value
+//  * @param {string} dim Concrete dimension.
+//  * @param {number} value
+//  * @return {number}
+//  */
+// Currently incorrect: should return dataIndex but not rawIndex.
+// Do not fix it until this method is to be used somewhere.
+// FIXME Precision of float value
+// listProto.indexOf = function (dim, value) {
+//     var storage = this._storage;
+//     var dimData = storage[dim];
+//     var chunkSize = this._chunkSize;
+//     if (dimData) {
+//         for (var i = 0, len = this.count(); i < len; i++) {
+//             var chunkIndex = Math.floor(i / chunkSize);
+//             var chunkOffset = i % chunkSize;
+//             if (dimData[chunkIndex][chunkOffset] === value) {
+//                 return i;
+//             }
+//         }
+//     }
+//     return -1;
+// };
+
+/**
+ * Only support the dimension which inverted index created.
+ * Do not support other cases until required.
+ * @param {string} concrete dim
+ * @param {number|string} value
+ * @return {number} rawIndex
+ */
+listProto.rawIndexOf = function (dim, value) {
+    var invertedIndices = dim && this._invertedIndicesMap[dim];
+    if (__DEV__) {
+        if (!invertedIndices) {
+            throw new Error('Do not supported yet');
+        }
+    }
+    var rawIndex = invertedIndices[value];
+    if (rawIndex == null || isNaN(rawIndex)) {
+        return -1;
+    }
+    return rawIndex;
+};
+
+/**
+ * Retreive the index with given name
+ * @param {number} idx
+ * @param {number} name
+ * @return {number}
+ */
+listProto.indexOfName = function (name) {
+    for (var i = 0, len = this.count(); i < len; i++) {
+        if (this.getName(i) === name) {
+            return i;
+        }
+    }
+
+    return -1;
+};
+
+/**
+ * Retreive the index with given raw data index
+ * @param {number} idx
+ * @param {number} name
+ * @return {number}
+ */
+listProto.indexOfRawIndex = function (rawIndex) {
+    if (!this._indices) {
+        return rawIndex;
+    }
+
+    if (rawIndex >= this._rawCount || rawIndex < 0) {
+        return -1;
+    }
+
+    // Indices are ascending
+    var indices = this._indices;
+
+    // If rawIndex === dataIndex
+    var rawDataIndex = indices[rawIndex];
+    if (rawDataIndex != null && rawDataIndex < this._count && rawDataIndex === rawIndex) {
+        return rawIndex;
+    }
+
+    var left = 0;
+    var right = this._count - 1;
+    while (left <= right) {
+        var mid = (left + right) / 2 | 0;
+        if (indices[mid] < rawIndex) {
+            left = mid + 1;
+        }
+        else if (indices[mid] > rawIndex) {
+            right = mid - 1;
+        }
+        else {
+            return mid;
+        }
+    }
+    return -1;
+};
+
+/**
+ * Retreive the index of nearest value
+ * @param {string} dim
+ * @param {number} value
+ * @param {number} [maxDistance=Infinity]
+ * @return {Array.<number>} Considere multiple points has the same value.
+ */
+listProto.indicesOfNearest = function (dim, value, maxDistance) {
+    var storage = this._storage;
+    var dimData = storage[dim];
+    var nearestIndices = [];
+
+    if (!dimData) {
+        return nearestIndices;
+    }
+
+    if (maxDistance == null) {
+        maxDistance = Infinity;
+    }
+
+    var minDist = Number.MAX_VALUE;
+    var minDiff = -1;
+    for (var i = 0, len = this.count(); i < len; i++) {
+        var diff = value - this.get(dim, i /*, stack */);
+        var dist = Math.abs(diff);
+        if (diff <= maxDistance && dist <= minDist) {
+            // For the case of two data are same on xAxis, which has sequence data.
+            // Show the nearest index
+            // https://github.com/ecomfe/echarts/issues/2869
+            if (dist < minDist || (diff >= 0 && minDiff < 0)) {
+                minDist = dist;
+                minDiff = diff;
+                nearestIndices.length = 0;
+            }
+            nearestIndices.push(i);
+        }
+    }
+    return nearestIndices;
+};
+
+/**
+ * Get raw data index
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.getRawIndex = getRawIndexWithoutIndices;
+
+function getRawIndexWithoutIndices(idx) {
+    return idx;
+}
+
+function getRawIndexWithIndices(idx) {
+    if (idx < this._count && idx >= 0) {
+        return this._indices[idx];
+    }
+    return -1;
+}
+
+/**
+ * Get raw data item
+ * @param {number} idx
+ * @return {number}
+ */
+listProto.getRawDataItem = function (idx) {
+    if (!this._rawData.persistent) {
+        var val = [];
+        for (var i = 0; i < this.dimensions.length; i++) {
+            var dim = this.dimensions[i];
+            val.push(this.get(dim, idx));
+        }
+        return val;
+    }
+    else {
+        return this._rawData.getItem(this.getRawIndex(idx));
+    }
+};
+
+/**
+ * @param {number} idx
+ * @param {boolean} [notDefaultIdx=false]
+ * @return {string}
+ */
+listProto.getName = function (idx) {
+    var rawIndex = this.getRawIndex(idx);
+    return this._nameList[rawIndex]
+        || getRawValueFromStore(this, this._nameDimIdx, rawIndex)
+        || '';
+};
+
+/**
+ * @param {number} idx
+ * @param {boolean} [notDefaultIdx=false]
+ * @return {string}
+ */
+listProto.getId = function (idx) {
+    return getId(this, this.getRawIndex(idx));
+};
+
+function getId(list, rawIndex) {
+    var id = list._idList[rawIndex];
+    if (id == null) {
+        id = getRawValueFromStore(list, list._idDimIdx, rawIndex);
+    }
+    if (id == null) {
+        // FIXME Check the usage in graph, should not use prefix.
+        id = ID_PREFIX + rawIndex;
+    }
+    return id;
+}
+
+function normalizeDimensions(dimensions) {
+    if (!isArray(dimensions)) {
+        dimensions = [dimensions];
+    }
+    return dimensions;
+}
+
+function validateDimensions(list, dims) {
+    for (var i = 0; i < dims.length; i++) {
+        // stroage may be empty when no data, so use
+        // dimensionInfos to check.
+        if (!list._dimensionInfos[dims[i]]) {
+            console.error('Unkown dimension ' + dims[i]);
+        }
+    }
+}
+
+/**
+ * Data iteration
+ * @param {string|Array.<string>}
+ * @param {Function} cb
+ * @param {*} [context=this]
+ *
+ * @example
+ *  list.each('x', function (x, idx) {});
+ *  list.each(['x', 'y'], function (x, y, idx) {});
+ *  list.each(function (idx) {})
+ */
+listProto.each = function (dims, cb, context, contextCompat) {
+    'use strict';
+
+    if (!this._count) {
+        return;
+    }
+
+    if (typeof dims === 'function') {
+        contextCompat = context;
+        context = cb;
+        cb = dims;
+        dims = [];
+    }
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    dims = map(normalizeDimensions(dims), this.getDimension, this);
+
+    if (__DEV__) {
+        validateDimensions(this, dims);
+    }
+
+    var dimSize = dims.length;
+
+    for (var i = 0; i < this.count(); i++) {
+        // Simple optimization
+        switch (dimSize) {
+            case 0:
+                cb.call(context, i);
+                break;
+            case 1:
+                cb.call(context, this.get(dims[0], i), i);
+                break;
+            case 2:
+                cb.call(context, this.get(dims[0], i), this.get(dims[1], i), i);
+                break;
+            default:
+                var k = 0;
+                var value = [];
+                for (; k < dimSize; k++) {
+                    value[k] = this.get(dims[k], i);
+                }
+                // Index
+                value[k] = i;
+                cb.apply(context, value);
+        }
+    }
+};
+
+/**
+ * Data filter
+ * @param {string|Array.<string>}
+ * @param {Function} cb
+ * @param {*} [context=this]
+ */
+listProto.filterSelf = function (dimensions, cb, context, contextCompat) {
+    'use strict';
+
+    if (!this._count) {
+        return;
+    }
+
+    if (typeof dimensions === 'function') {
+        contextCompat = context;
+        context = cb;
+        cb = dimensions;
+        dimensions = [];
+    }
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    dimensions = map(
+        normalizeDimensions(dimensions), this.getDimension, this
+    );
+
+    if (__DEV__) {
+        validateDimensions(this, dimensions);
+    }
+
+
+    var count = this.count();
+    var Ctor = getIndicesCtor(this);
+    var newIndices = new Ctor(count);
+    var value = [];
+    var dimSize = dimensions.length;
+
+    var offset = 0;
+    var dim0 = dimensions[0];
+
+    for (var i = 0; i < count; i++) {
+        var keep;
+        var rawIdx = this.getRawIndex(i);
+        // Simple optimization
+        if (dimSize === 0) {
+            keep = cb.call(context, i);
+        }
+        else if (dimSize === 1) {
+            var val = this._getFast(dim0, rawIdx);
+            keep = cb.call(context, val, i);
+        }
+        else {
+            for (var k = 0; k < dimSize; k++) {
+                value[k] = this._getFast(dim0, rawIdx);
+            }
+            value[k] = i;
+            keep = cb.apply(context, value);
+        }
+        if (keep) {
+            newIndices[offset++] = rawIdx;
+        }
+    }
+
+    // Set indices after filtered.
+    if (offset < count) {
+        this._indices = newIndices;
+    }
+    this._count = offset;
+    // Reset data extent
+    this._extent = {};
+
+    this.getRawIndex = this._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    return this;
+};
+
+/**
+ * Select data in range. (For optimization of filter)
+ * (Manually inline code, support 5 million data filtering in data zoom.)
+ */
+listProto.selectRange = function (range) {
+    'use strict';
+
+    if (!this._count) {
+        return;
+    }
+
+    var dimensions = [];
+    for (var dim in range) {
+        if (range.hasOwnProperty(dim)) {
+            dimensions.push(dim);
+        }
+    }
+
+    if (__DEV__) {
+        validateDimensions(this, dimensions);
+    }
+
+    var dimSize = dimensions.length;
+    if (!dimSize) {
+        return;
+    }
+
+    var originalCount = this.count();
+    var Ctor = getIndicesCtor(this);
+    var newIndices = new Ctor(originalCount);
+
+    var offset = 0;
+    var dim0 = dimensions[0];
+
+    var min = range[dim0][0];
+    var max = range[dim0][1];
+
+    var quickFinished = false;
+    if (!this._indices) {
+        // Extreme optimization for common case. About 2x faster in chrome.
+        var idx = 0;
+        if (dimSize === 1) {
+            var dimStorage = this._storage[dimensions[0]];
+            for (var k = 0; k < this._chunkCount; k++) {
+                var chunkStorage = dimStorage[k];
+                var len = Math.min(this._count - k * this._chunkSize, this._chunkSize);
+                for (var i = 0; i < len; i++) {
+                    var val = chunkStorage[i];
+                    // NaN will not be filtered. Consider the case, in line chart, empty
+                    // value indicates the line should be broken. But for the case like
+                    // scatter plot, a data item with empty value will not be rendered,
+                    // but the axis extent may be effected if some other dim of the data
+                    // item has value. Fortunately it is not a significant negative effect.
+                    if (
+                        (val >= min && val <= max) || isNaN(val)
+                    ) {
+                        newIndices[offset++] = idx;
+                    }
+                    idx++;
+                }
+            }
+            quickFinished = true;
+        }
+        else if (dimSize === 2) {
+            var dimStorage = this._storage[dim0];
+            var dimStorage2 = this._storage[dimensions[1]];
+            var min2 = range[dimensions[1]][0];
+            var max2 = range[dimensions[1]][1];
+            for (var k = 0; k < this._chunkCount; k++) {
+                var chunkStorage = dimStorage[k];
+                var chunkStorage2= dimStorage2[k];
+                var len = Math.min(this._count - k * this._chunkSize, this._chunkSize);
+                for (var i = 0; i < len; i++) {
+                    var val = chunkStorage[i];
+                    var val2 = chunkStorage2[i];
+                    // Do not filter NaN, see comment above.
+                    if ((
+                            (val >= min && val <= max) || isNaN(val)
+                        )
+                        && (
+                            (val2 >= min2 && val2 <= max2) || isNaN(val2)
+                        )
+                    ) {
+                        newIndices[offset++] = idx;
+                    }
+                    idx++;
+                }
+            }
+            quickFinished = true;
+        }
+    }
+    if (!quickFinished) {
+        if (dimSize === 1) {
+            for (var i = 0; i < originalCount; i++) {
+                var rawIndex = this.getRawIndex(i);
+                var val = this._getFast(dim0, rawIndex);
+                // Do not filter NaN, see comment above.
+                if (
+                    (val >= min && val <= max) || isNaN(val)
+                ) {
+                    newIndices[offset++] = rawIndex;
+                }
+            }
+        }
+        else {
+            for (var i = 0; i < originalCount; i++) {
+                var keep = true;
+                var rawIndex = this.getRawIndex(i);
+                for (var k = 0; k < dimSize; k++) {
+                    var dimk = dimensions[k];
+                    var val = this._getFast(dim, rawIndex);
+                    // Do not filter NaN, see comment above.
+                    if (val < range[dimk][0] || val > range[dimk][1]) {
+                        keep = false;
+                    }
+                }
+                if (keep) {
+                    newIndices[offset++] = this.getRawIndex(i);
+                }
+            }
+        }
+    }
+
+    // Set indices after filtered.
+    if (offset < originalCount) {
+        this._indices = newIndices;
+    }
+    this._count = offset;
+    // Reset data extent
+    this._extent = {};
+
+    this.getRawIndex = this._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    return this;
+};
+
+/**
+ * Data mapping to a plain array
+ * @param {string|Array.<string>} [dimensions]
+ * @param {Function} cb
+ * @param {*} [context=this]
+ * @return {Array}
+ */
+listProto.mapArray = function (dimensions, cb, context, contextCompat) {
+    'use strict';
+
+    if (typeof dimensions === 'function') {
+        contextCompat = context;
+        context = cb;
+        cb = dimensions;
+        dimensions = [];
+    }
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    var result = [];
+    this.each(dimensions, function () {
+        result.push(cb && cb.apply(this, arguments));
+    }, context);
+    return result;
+};
+
+// Data in excludeDimensions is copied, otherwise transfered.
+function cloneListForMapAndSample(original, excludeDimensions) {
+    var allDimensions = original.dimensions;
+    var list = new List(
+        map(allDimensions, original.getDimensionInfo, original),
+        original.hostModel
+    );
+    // FIXME If needs stackedOn, value may already been stacked
+    transferProperties(list, original);
+
+    var storage = list._storage = {};
+    var originalStorage = original._storage;
+
+    // Init storage
+    for (var i = 0; i < allDimensions.length; i++) {
+        var dim = allDimensions[i];
+        if (originalStorage[dim]) {
+            // Notice that we do not reset invertedIndicesMap here, becuase
+            // there is no scenario of mapping or sampling ordinal dimension.
+            if (indexOf(excludeDimensions, dim) >= 0) {
+                storage[dim] = cloneDimStore(originalStorage[dim]);
+                list._rawExtent[dim] = getInitialExtent();
+                list._extent[dim] = null;
+            }
+            else {
+                // Direct reference for other dimensions
+                storage[dim] = originalStorage[dim];
+            }
+        }
+    }
+    return list;
+}
+
+function cloneDimStore(originalDimStore) {
+    var newDimStore = new Array(originalDimStore.length);
+    for (var j = 0; j < originalDimStore.length; j++) {
+        newDimStore[j] = cloneChunk(originalDimStore[j]);
+    }
+    return newDimStore;
+}
+
+function getInitialExtent() {
+    return [Infinity, -Infinity];
+}
+
+/**
+ * Data mapping to a new List with given dimensions
+ * @param {string|Array.<string>} dimensions
+ * @param {Function} cb
+ * @param {*} [context=this]
+ * @return {Array}
+ */
+listProto.map = function (dimensions, cb, context, contextCompat) {
+    'use strict';
+
+    // contextCompat just for compat echarts3
+    context = context || contextCompat || this;
+
+    dimensions = map(
+        normalizeDimensions(dimensions), this.getDimension, this
+    );
+
+    if (__DEV__) {
+        validateDimensions(this, dimensions);
+    }
+
+    var list = cloneListForMapAndSample(this, dimensions);
+
+    // Following properties are all immutable.
+    // So we can reference to the same value
+    list._indices = this._indices;
+    list.getRawIndex = list._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    var storage = list._storage;
+
+    var tmpRetValue = [];
+    var chunkSize = this._chunkSize;
+    var dimSize = dimensions.length;
+    var dataCount = this.count();
+    var values = [];
+    var rawExtent = list._rawExtent;
+
+    for (var dataIndex = 0; dataIndex < dataCount; dataIndex++) {
+        for (var dimIndex = 0; dimIndex < dimSize; dimIndex++) {
+            values[dimIndex] = this.get(dimensions[dimIndex], dataIndex /*, stack */);
+        }
+        values[dimSize] = dataIndex;
+
+        var retValue = cb && cb.apply(context, values);
+        if (retValue != null) {
+            // a number or string (in oridinal dimension)?
+            if (typeof retValue !== 'object') {
+                tmpRetValue[0] = retValue;
+                retValue = tmpRetValue;
+            }
+
+            var rawIndex = this.getRawIndex(dataIndex);
+            var chunkIndex = Math.floor(rawIndex / chunkSize);
+            var chunkOffset = rawIndex % chunkSize;
+
+            for (var i = 0; i < retValue.length; i++) {
+                var dim = dimensions[i];
+                var val = retValue[i];
+                var rawExtentOnDim = rawExtent[dim];
+
+                var dimStore = storage[dim];
+                if (dimStore) {
+                    dimStore[chunkIndex][chunkOffset] = val;
+                }
+
+                if (val < rawExtentOnDim[0]) {
+                    rawExtentOnDim[0] = val;
+                }
+                if (val > rawExtentOnDim[1]) {
+                    rawExtentOnDim[1] = val;
+                }
+            }
+        }
+    }
+
+    return list;
+};
+
+/**
+ * Large data down sampling on given dimension
+ * @param {string} dimension
+ * @param {number} rate
+ * @param {Function} sampleValue
+ * @param {Function} sampleIndex Sample index for name and id
+ */
+listProto.downSample = function (dimension, rate, sampleValue, sampleIndex) {
+    var list = cloneListForMapAndSample(this, [dimension]);
+    var targetStorage = list._storage;
+
+    var frameValues = [];
+    var frameSize = Math.floor(1 / rate);
+
+    var dimStore = targetStorage[dimension];
+    var len = this.count();
+    var chunkSize = this._chunkSize;
+    var rawExtentOnDim = list._rawExtent[dimension];
+
+    var newIndices = new (getIndicesCtor(this))(len);
+
+    var offset = 0;
+    for (var i = 0; i < len; i += frameSize) {
+        // Last frame
+        if (frameSize > len - i) {
+            frameSize = len - i;
+            frameValues.length = frameSize;
+        }
+        for (var k = 0; k < frameSize; k++) {
+            var dataIdx = this.getRawIndex(i + k);
+            var originalChunkIndex = Math.floor(dataIdx / chunkSize);
+            var originalChunkOffset = dataIdx % chunkSize;
+            frameValues[k] = dimStore[originalChunkIndex][originalChunkOffset];
+        }
+        var value = sampleValue(frameValues);
+        var sampleFrameIdx = this.getRawIndex(
+            Math.min(i + sampleIndex(frameValues, value) || 0, len - 1)
+        );
+        var sampleChunkIndex = Math.floor(sampleFrameIdx / chunkSize);
+        var sampleChunkOffset = sampleFrameIdx % chunkSize;
+        // Only write value on the filtered data
+        dimStore[sampleChunkIndex][sampleChunkOffset] = value;
+
+        if (value < rawExtentOnDim[0]) {
+            rawExtentOnDim[0] = value;
+        }
+        if (value > rawExtentOnDim[1]) {
+            rawExtentOnDim[1] = value;
+        }
+
+        newIndices[offset++] = sampleFrameIdx;
+    }
+
+    list._count = offset;
+    list._indices = newIndices;
+
+    list.getRawIndex = getRawIndexWithIndices;
+
+    return list;
+};
+
+/**
+ * Get model of one data item.
+ *
+ * @param {number} idx
+ */
+// FIXME Model proxy ?
+listProto.getItemModel = function (idx) {
+    var hostModel = this.hostModel;
+    return new Model(this.getRawDataItem(idx), hostModel, hostModel && hostModel.ecModel);
+};
+
+/**
+ * Create a data differ
+ * @param {module:echarts/data/List} otherList
+ * @return {module:echarts/data/DataDiffer}
+ */
+listProto.diff = function (otherList) {
+    var thisList = this;
+
+    return new DataDiffer(
+        otherList ? otherList.getIndices() : [],
+        this.getIndices(),
+        function (idx) {
+            return getId(otherList, idx);
+        },
+        function (idx) {
+            return getId(thisList, idx);
+        }
+    );
+};
+/**
+ * Get visual property.
+ * @param {string} key
+ */
+listProto.getVisual = function (key) {
+    var visual = this._visual;
+    return visual && visual[key];
+};
+
+/**
+ * Set visual property
+ * @param {string|Object} key
+ * @param {*} [value]
+ *
+ * @example
+ *  setVisual('color', color);
+ *  setVisual({
+ *      'color': color
+ *  });
+ */
+listProto.setVisual = function (key, val) {
+    if (isObject$4(key)) {
+        for (var name in key) {
+            if (key.hasOwnProperty(name)) {
+                this.setVisual(name, key[name]);
+            }
+        }
+        return;
+    }
+    this._visual = this._visual || {};
+    this._visual[key] = val;
+};
+
+/**
+ * Set layout property.
+ * @param {string|Object} key
+ * @param {*} [val]
+ */
+listProto.setLayout = function (key, val) {
+    if (isObject$4(key)) {
+        for (var name in key) {
+            if (key.hasOwnProperty(name)) {
+                this.setLayout(name, key[name]);
+            }
+        }
+        return;
+    }
+    this._layout[key] = val;
+};
+
+/**
+ * Get layout property.
+ * @param  {string} key.
+ * @return {*}
+ */
+listProto.getLayout = function (key) {
+    return this._layout[key];
+};
+
+/**
+ * Get layout of single data item
+ * @param {number} idx
+ */
+listProto.getItemLayout = function (idx) {
+    return this._itemLayouts[idx];
+};
+
+/**
+ * Set layout of single data item
+ * @param {number} idx
+ * @param {Object} layout
+ * @param {boolean=} [merge=false]
+ */
+listProto.setItemLayout = function (idx, layout, merge$$1) {
+    this._itemLayouts[idx] = merge$$1
+        ? extend(this._itemLayouts[idx] || {}, layout)
+        : layout;
+};
+
+/**
+ * Clear all layout of single data item
+ */
+listProto.clearItemLayouts = function () {
+    this._itemLayouts.length = 0;
+};
+
+/**
+ * Get visual property of single data item
+ * @param {number} idx
+ * @param {string} key
+ * @param {boolean} [ignoreParent=false]
+ */
+listProto.getItemVisual = function (idx, key, ignoreParent) {
+    var itemVisual = this._itemVisuals[idx];
+    var val = itemVisual && itemVisual[key];
+    if (val == null && !ignoreParent) {
+        // Use global visual property
+        return this.getVisual(key);
+    }
+    return val;
+};
+
+/**
+ * Set visual property of single data item
+ *
+ * @param {number} idx
+ * @param {string|Object} key
+ * @param {*} [value]
+ *
+ * @example
+ *  setItemVisual(0, 'color', color);
+ *  setItemVisual(0, {
+ *      'color': color
+ *  });
+ */
+listProto.setItemVisual = function (idx, key, value) {
+    var itemVisual = this._itemVisuals[idx] || {};
+    var hasItemVisual = this.hasItemVisual;
+    this._itemVisuals[idx] = itemVisual;
+
+    if (isObject$4(key)) {
+        for (var name in key) {
+            if (key.hasOwnProperty(name)) {
+                itemVisual[name] = key[name];
+                hasItemVisual[name] = true;
+            }
+        }
+        return;
+    }
+    itemVisual[key] = value;
+    hasItemVisual[key] = true;
+};
+
+/**
+ * Clear itemVisuals and list visual.
+ */
+listProto.clearAllVisual = function () {
+    this._visual = {};
+    this._itemVisuals = [];
+    this.hasItemVisual = {};
+};
+
+var setItemDataAndSeriesIndex = function (child) {
+    child.seriesIndex = this.seriesIndex;
+    child.dataIndex = this.dataIndex;
+    child.dataType = this.dataType;
+};
+/**
+ * Set graphic element relative to data. It can be set as null
+ * @param {number} idx
+ * @param {module:zrender/Element} [el]
+ */
+listProto.setItemGraphicEl = function (idx, el) {
+    var hostModel = this.hostModel;
+
+    if (el) {
+        // Add data index and series index for indexing the data by element
+        // Useful in tooltip
+        el.dataIndex = idx;
+        el.dataType = this.dataType;
+        el.seriesIndex = hostModel && hostModel.seriesIndex;
+        if (el.type === 'group') {
+            el.traverse(setItemDataAndSeriesIndex, el);
+        }
+    }
+
+    this._graphicEls[idx] = el;
+};
+
+/**
+ * @param {number} idx
+ * @return {module:zrender/Element}
+ */
+listProto.getItemGraphicEl = function (idx) {
+    return this._graphicEls[idx];
+};
+
+/**
+ * @param {Function} cb
+ * @param {*} context
+ */
+listProto.eachItemGraphicEl = function (cb, context) {
+    each$1(this._graphicEls, function (el, idx) {
+        if (el) {
+            cb && cb.call(context, el, idx);
+        }
+    });
+};
+
+/**
+ * Shallow clone a new list except visual and layout properties, and graph elements.
+ * New list only change the indices.
+ */
+listProto.cloneShallow = function (list) {
+    if (!list) {
+        var dimensionInfoList = map(this.dimensions, this.getDimensionInfo, this);
+        list = new List(dimensionInfoList, this.hostModel);
+    }
+
+    // FIXME
+    list._storage = this._storage;
+
+    transferProperties(list, this);
+
+    // Clone will not change the data extent and indices
+    if (this._indices) {
+        var Ctor = this._indices.constructor;
+        list._indices = new Ctor(this._indices);
+    }
+    else {
+        list._indices = null;
+    }
+    list.getRawIndex = list._indices ? getRawIndexWithIndices : getRawIndexWithoutIndices;
+
+    return list;
+};
+
+/**
+ * Wrap some method to add more feature
+ * @param {string} methodName
+ * @param {Function} injectFunction
+ */
+listProto.wrapMethod = function (methodName, injectFunction) {
+    var originalMethod = this[methodName];
+    if (typeof originalMethod !== 'function') {
+        return;
+    }
+    this.__wrappedMethods = this.__wrappedMethods || [];
+    this.__wrappedMethods.push(methodName);
+    this[methodName] = function () {
+        var res = originalMethod.apply(this, arguments);
+        return injectFunction.apply(this, [res].concat(slice(arguments)));
+    };
+};
+
+// Methods that create a new list based on this list should be listed here.
+// Notice that those method should `RETURN` the new list.
+listProto.TRANSFERABLE_METHODS = ['cloneShallow', 'downSample', 'map'];
+// Methods that change indices of this list should be listed here.
+listProto.CHANGABLE_METHODS = ['filterSelf', 'selectRange'];
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @deprecated
+ * Use `echarts/data/helper/createDimensions` instead.
+ */
+
+/**
+ * @see {module:echarts/test/ut/spec/data/completeDimensions}
+ *
+ * Complete the dimensions array, by user defined `dimension` and `encode`,
+ * and guessing from the data structure.
+ * If no 'value' dimension specified, the first no-named dimension will be
+ * named as 'value'.
+ *
+ * @param {Array.<string>} sysDims Necessary dimensions, like ['x', 'y'], which
+ *      provides not only dim template, but also default order.
+ *      properties: 'name', 'type', 'displayName'.
+ *      `name` of each item provides default coord name.
+ *      [{dimsDef: [string|Object, ...]}, ...] dimsDef of sysDim item provides default dim name, and
+ *                                    provide dims count that the sysDim required.
+ *      [{ordinalMeta}] can be specified.
+ * @param {module:echarts/data/Source|Array|Object} source or data (for compatibal with pervious)
+ * @param {Object} [opt]
+ * @param {Array.<Object|string>} [opt.dimsDef] option.series.dimensions User defined dimensions
+ *      For example: ['asdf', {name, type}, ...].
+ * @param {Object|HashMap} [opt.encodeDef] option.series.encode {x: 2, y: [3, 1], tooltip: [1, 2], label: 3}
+ * @param {string} [opt.generateCoord] Generate coord dim with the given name.
+ *                 If not specified, extra dim names will be:
+ *                 'value', 'value0', 'value1', ...
+ * @param {number} [opt.generateCoordCount] By default, the generated dim name is `generateCoord`.
+ *                 If `generateCoordCount` specified, the generated dim names will be:
+ *                 `generateCoord` + 0, `generateCoord` + 1, ...
+ *                 can be Infinity, indicate that use all of the remain columns.
+ * @param {number} [opt.dimCount] If not specified, guess by the first data item.
+ * @param {number} [opt.encodeDefaulter] If not specified, auto find the next available data dim.
+ * @return {Array.<Object>} [{
+ *      name: string mandatory,
+ *      displayName: string, the origin name in dimsDef, see source helper.
+ *                 If displayName given, the tooltip will displayed vertically.
+ *      coordDim: string mandatory,
+ *      coordDimIndex: number mandatory,
+ *      type: string optional,
+ *      otherDims: { never null/undefined
+ *          tooltip: number optional,
+ *          label: number optional,
+ *          itemName: number optional,
+ *          seriesName: number optional,
+ *      },
+ *      isExtraCoord: boolean true if coord is generated
+ *          (not specified in encode and not series specified)
+ *      other props ...
+ * }]
+ */
+function completeDimensions(sysDims, source, opt) {
+    if (!Source.isInstance(source)) {
+        source = Source.seriesDataToSource(source);
+    }
+
+    opt = opt || {};
+    sysDims = (sysDims || []).slice();
+    var dimsDef = (opt.dimsDef || []).slice();
+    var encodeDef = createHashMap(opt.encodeDef);
+    var dataDimNameMap = createHashMap();
+    var coordDimNameMap = createHashMap();
+    // var valueCandidate;
+    var result = [];
+
+    var dimCount = getDimCount(source, sysDims, dimsDef, opt.dimCount);
+
+    // Apply user defined dims (`name` and `type`) and init result.
+    for (var i = 0; i < dimCount; i++) {
+        var dimDefItem = dimsDef[i] = extend(
+            {}, isObject$1(dimsDef[i]) ? dimsDef[i] : {name: dimsDef[i]}
+        );
+        var userDimName = dimDefItem.name;
+        var resultItem = result[i] = {otherDims: {}};
+        // Name will be applied later for avoiding duplication.
+        if (userDimName != null && dataDimNameMap.get(userDimName) == null) {
+            // Only if `series.dimensions` is defined in option
+            // displayName, will be set, and dimension will be diplayed vertically in
+            // tooltip by default.
+            resultItem.name = resultItem.displayName = userDimName;
+            dataDimNameMap.set(userDimName, i);
+        }
+        dimDefItem.type != null && (resultItem.type = dimDefItem.type);
+        dimDefItem.displayName != null && (resultItem.displayName = dimDefItem.displayName);
+    }
+
+    // Set `coordDim` and `coordDimIndex` by `encodeDef` and normalize `encodeDef`.
+    encodeDef.each(function (dataDims, coordDim) {
+        dataDims = normalizeToArray(dataDims).slice();
+        var validDataDims = encodeDef.set(coordDim, []);
+        each$1(dataDims, function (resultDimIdx, idx) {
+            // The input resultDimIdx can be dim name or index.
+            isString(resultDimIdx) && (resultDimIdx = dataDimNameMap.get(resultDimIdx));
+            if (resultDimIdx != null && resultDimIdx < dimCount) {
+                validDataDims[idx] = resultDimIdx;
+                applyDim(result[resultDimIdx], coordDim, idx);
+            }
+        });
+    });
+
+    // Apply templetes and default order from `sysDims`.
+    var availDimIdx = 0;
+    each$1(sysDims, function (sysDimItem, sysDimIndex) {
+        var coordDim;
+        var sysDimItem;
+        var sysDimItemDimsDef;
+        var sysDimItemOtherDims;
+        if (isString(sysDimItem)) {
+            coordDim = sysDimItem;
+            sysDimItem = {};
+        }
+        else {
+            coordDim = sysDimItem.name;
+            var ordinalMeta = sysDimItem.ordinalMeta;
+            sysDimItem.ordinalMeta = null;
+            sysDimItem = clone(sysDimItem);
+            sysDimItem.ordinalMeta = ordinalMeta;
+            // `coordDimIndex` should not be set directly.
+            sysDimItemDimsDef = sysDimItem.dimsDef;
+            sysDimItemOtherDims = sysDimItem.otherDims;
+            sysDimItem.name = sysDimItem.coordDim = sysDimItem.coordDimIndex
+                = sysDimItem.dimsDef = sysDimItem.otherDims = null;
+        }
+
+        var dataDims = normalizeToArray(encodeDef.get(coordDim));
+        // dimensions provides default dim sequences.
+        if (!dataDims.length) {
+            for (var i = 0; i < (sysDimItemDimsDef && sysDimItemDimsDef.length || 1); i++) {
+                while (availDimIdx < result.length && result[availDimIdx].coordDim != null) {
+                    availDimIdx++;
+                }
+                availDimIdx < result.length && dataDims.push(availDimIdx++);
+            }
+        }
+
+        // Apply templates.
+        each$1(dataDims, function (resultDimIdx, coordDimIndex) {
+            var resultItem = result[resultDimIdx];
+            applyDim(defaults(resultItem, sysDimItem), coordDim, coordDimIndex);
+            if (resultItem.name == null && sysDimItemDimsDef) {
+                var sysDimItemDimsDefItem = sysDimItemDimsDef[coordDimIndex];
+                !isObject$1(sysDimItemDimsDefItem) && (sysDimItemDimsDefItem = {name: sysDimItemDimsDefItem});
+                resultItem.name = resultItem.displayName = sysDimItemDimsDefItem.name;
+                resultItem.defaultTooltip = sysDimItemDimsDefItem.defaultTooltip;
+            }
+            // FIXME refactor, currently only used in case: {otherDims: {tooltip: false}}
+            sysDimItemOtherDims && defaults(resultItem.otherDims, sysDimItemOtherDims);
+        });
+    });
+
+    function applyDim(resultItem, coordDim, coordDimIndex) {
+        if (OTHER_DIMENSIONS.get(coordDim) != null) {
+            resultItem.otherDims[coordDim] = coordDimIndex;
+        }
+        else {
+            resultItem.coordDim = coordDim;
+            resultItem.coordDimIndex = coordDimIndex;
+            coordDimNameMap.set(coordDim, true);
+        }
+    }
+
+    // Make sure the first extra dim is 'value'.
+    var generateCoord = opt.generateCoord;
+    var generateCoordCount = opt.generateCoordCount;
+    var fromZero = generateCoordCount != null;
+    generateCoordCount = generateCoord ? (generateCoordCount || 1) : 0;
+    var extra = generateCoord || 'value';
+
+    // Set dim `name` and other `coordDim` and other props.
+    for (var resultDimIdx = 0; resultDimIdx < dimCount; resultDimIdx++) {
+        var resultItem = result[resultDimIdx] = result[resultDimIdx] || {};
+        var coordDim = resultItem.coordDim;
+
+        if (coordDim == null) {
+            resultItem.coordDim = genName(
+                extra, coordDimNameMap, fromZero
+            );
+            resultItem.coordDimIndex = 0;
+            if (!generateCoord || generateCoordCount <= 0) {
+                resultItem.isExtraCoord = true;
+            }
+            generateCoordCount--;
+        }
+
+        resultItem.name == null && (resultItem.name = genName(
+            resultItem.coordDim,
+            dataDimNameMap
+        ));
+
+        if (resultItem.type == null && guessOrdinal(source, resultDimIdx, resultItem.name)) {
+            resultItem.type = 'ordinal';
+        }
+    }
+
+    return result;
+}
+
+// ??? TODO
+// Originally detect dimCount by data[0]. Should we
+// optimize it to only by sysDims and dimensions and encode.
+// So only necessary dims will be initialized.
+// But
+// (1) custom series should be considered. where other dims
+// may be visited.
+// (2) sometimes user need to calcualte bubble size or use visualMap
+// on other dimensions besides coordSys needed.
+// So, dims that is not used by system, should be shared in storage?
+function getDimCount(source, sysDims, dimsDef, optDimCount) {
+    // Note that the result dimCount should not small than columns count
+    // of data, otherwise `dataDimNameMap` checking will be incorrect.
+    var dimCount = Math.max(
+        source.dimensionsDetectCount || 1,
+        sysDims.length,
+        dimsDef.length,
+        optDimCount || 0
+    );
+    each$1(sysDims, function (sysDimItem) {
+        var sysDimItemDimsDef = sysDimItem.dimsDef;
+        sysDimItemDimsDef && (dimCount = Math.max(dimCount, sysDimItemDimsDef.length));
+    });
+    return dimCount;
+}
+
+function genName(name, map$$1, fromZero) {
+    if (fromZero || map$$1.get(name) != null) {
+        var i = 0;
+        while (map$$1.get(name + i) != null) {
+            i++;
+        }
+        name += i;
+    }
+    map$$1.set(name, true);
+    return name;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Substitute `completeDimensions`.
+ * `completeDimensions` is to be deprecated.
+ */
+/**
+ * @param {module:echarts/data/Source|module:echarts/data/List} source or data.
+ * @param {Object|Array} [opt]
+ * @param {Array.<string|Object>} [opt.coordDimensions=[]]
+ * @param {number} [opt.dimensionsCount]
+ * @param {string} [opt.generateCoord]
+ * @param {string} [opt.generateCoordCount]
+ * @param {Array.<string|Object>} [opt.dimensionsDefine=source.dimensionsDefine] Overwrite source define.
+ * @param {Object|HashMap} [opt.encodeDefine=source.encodeDefine] Overwrite source define.
+ * @return {Array.<Object>} dimensionsInfo
+ */
+var createDimensions = function (source, opt) {
+    opt = opt || {};
+    return completeDimensions(opt.coordDimensions || [], source, {
+        dimsDef: opt.dimensionsDefine || source.dimensionsDefine,
+        encodeDef: opt.encodeDefine || source.encodeDefine,
+        dimCount: opt.dimensionsCount,
+        generateCoord: opt.generateCoord,
+        generateCoordCount: opt.generateCoordCount
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Note that it is too complicated to support 3d stack by value
+ * (have to create two-dimension inverted index), so in 3d case
+ * we just support that stacked by index.
+ *
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {Array.<string|Object>} dimensionInfoList The same as the input of <module:echarts/data/List>.
+ *        The input dimensionInfoList will be modified.
+ * @param {Object} [opt]
+ * @param {boolean} [opt.stackedCoordDimension=''] Specify a coord dimension if needed.
+ * @param {boolean} [opt.byIndex=false]
+ * @return {Object} calculationInfo
+ * {
+ *     stackedDimension: string
+ *     stackedByDimension: string
+ *     isStackedByIndex: boolean
+ *     stackedOverDimension: string
+ *     stackResultDimension: string
+ * }
+ */
+function enableDataStack(seriesModel, dimensionInfoList, opt) {
+    opt = opt || {};
+    var byIndex = opt.byIndex;
+    var stackedCoordDimension = opt.stackedCoordDimension;
+
+    // Compatibal: when `stack` is set as '', do not stack.
+    var mayStack = !!(seriesModel && seriesModel.get('stack'));
+    var stackedByDimInfo;
+    var stackedDimInfo;
+    var stackResultDimension;
+    var stackedOverDimension;
+
+    each$1(dimensionInfoList, function (dimensionInfo, index) {
+        if (isString(dimensionInfo)) {
+            dimensionInfoList[index] = dimensionInfo = {name: dimensionInfo};
+        }
+
+        if (mayStack && !dimensionInfo.isExtraCoord) {
+            // Find the first ordinal dimension as the stackedByDimInfo.
+            if (!byIndex && !stackedByDimInfo && dimensionInfo.ordinalMeta) {
+                stackedByDimInfo = dimensionInfo;
+            }
+            // Find the first stackable dimension as the stackedDimInfo.
+            if (!stackedDimInfo
+                && dimensionInfo.type !== 'ordinal'
+                && dimensionInfo.type !== 'time'
+                && (!stackedCoordDimension || stackedCoordDimension === dimensionInfo.coordDim)
+            ) {
+                stackedDimInfo = dimensionInfo;
+            }
+        }
+    });
+
+    if (stackedDimInfo && !byIndex && !stackedByDimInfo) {
+        // Compatible with previous design, value axis (time axis) only stack by index.
+        // It may make sense if the user provides elaborately constructed data.
+        byIndex = true;
+    }
+
+    // Add stack dimension, they can be both calculated by coordinate system in `unionExtent`.
+    // That put stack logic in List is for using conveniently in echarts extensions, but it
+    // might not be a good way.
+    if (stackedDimInfo) {
+        // Use a weird name that not duplicated with other names.
+        stackResultDimension = '__\0ecstackresult';
+        stackedOverDimension = '__\0ecstackedover';
+
+        // Create inverted index to fast query index by value.
+        if (stackedByDimInfo) {
+            stackedByDimInfo.createInvertedIndices = true;
+        }
+
+        var stackedDimCoordDim = stackedDimInfo.coordDim;
+        var stackedDimType = stackedDimInfo.type;
+        var stackedDimCoordIndex = 0;
+
+        each$1(dimensionInfoList, function (dimensionInfo) {
+            if (dimensionInfo.coordDim === stackedDimCoordDim) {
+                stackedDimCoordIndex++;
+            }
+        });
+
+        dimensionInfoList.push({
+            name: stackResultDimension,
+            coordDim: stackedDimCoordDim,
+            coordDimIndex: stackedDimCoordIndex,
+            type: stackedDimType,
+            isExtraCoord: true,
+            isCalculationCoord: true
+        });
+
+        stackedDimCoordIndex++;
+
+        dimensionInfoList.push({
+            name: stackedOverDimension,
+            // This dimension contains stack base (generally, 0), so do not set it as
+            // `stackedDimCoordDim` to avoid extent calculation, consider log scale.
+            coordDim: stackedOverDimension,
+            coordDimIndex: stackedDimCoordIndex,
+            type: stackedDimType,
+            isExtraCoord: true,
+            isCalculationCoord: true
+        });
+    }
+
+    return {
+        stackedDimension: stackedDimInfo && stackedDimInfo.name,
+        stackedByDimension: stackedByDimInfo && stackedByDimInfo.name,
+        isStackedByIndex: byIndex,
+        stackedOverDimension: stackedOverDimension,
+        stackResultDimension: stackResultDimension
+    };
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {string} stackedDim
+ */
+function isDimensionStacked(data, stackedDim /*, stackedByDim*/) {
+    // Each single series only maps to one pair of axis. So we do not need to
+    // check stackByDim, whatever stacked by a dimension or stacked by index.
+    return !!stackedDim && stackedDim === data.getCalculationInfo('stackedDimension');
+        // && (
+        //     stackedByDim != null
+        //         ? stackedByDim === data.getCalculationInfo('stackedByDimension')
+        //         : data.getCalculationInfo('isStackedByIndex')
+        // );
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {string} targetDim
+ * @param {string} [stackedByDim] If not input this parameter, check whether
+ *                                stacked by index.
+ * @return {string} dimension
+ */
+function getStackedDimension(data, targetDim) {
+    return isDimensionStacked(data, targetDim)
+        ? data.getCalculationInfo('stackResultDimension')
+        : targetDim;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/data/Source|Array} source Or raw data.
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {Object} [opt]
+ * @param {string} [opt.generateCoord]
+ */
+function createListFromArray(source, seriesModel, opt) {
+    opt = opt || {};
+
+    if (!Source.isInstance(source)) {
+        source = Source.seriesDataToSource(source);
+    }
+
+    var coordSysName = seriesModel.get('coordinateSystem');
+    var registeredCoordSys = CoordinateSystemManager.get(coordSysName);
+
+    var coordSysDefine = getCoordSysDefineBySeries(seriesModel);
+
+    var coordSysDimDefs;
+
+    if (coordSysDefine) {
+        coordSysDimDefs = map(coordSysDefine.coordSysDims, function (dim) {
+            var dimInfo = {name: dim};
+            var axisModel = coordSysDefine.axisMap.get(dim);
+            if (axisModel) {
+                var axisType = axisModel.get('type');
+                dimInfo.type = getDimensionTypeByAxis(axisType);
+                // dimInfo.stackable = isStackable(axisType);
+            }
+            return dimInfo;
+        });
+    }
+
+    if (!coordSysDimDefs) {
+        // Get dimensions from registered coordinate system
+        coordSysDimDefs = (registeredCoordSys && (
+            registeredCoordSys.getDimensionsInfo
+                ? registeredCoordSys.getDimensionsInfo()
+                : registeredCoordSys.dimensions.slice()
+        )) || ['x', 'y'];
+    }
+
+    var dimInfoList = createDimensions(source, {
+        coordDimensions: coordSysDimDefs,
+        generateCoord: opt.generateCoord
+    });
+
+    var firstCategoryDimIndex;
+    var hasNameEncode;
+    coordSysDefine && each$1(dimInfoList, function (dimInfo, dimIndex) {
+        var coordDim = dimInfo.coordDim;
+        var categoryAxisModel = coordSysDefine.categoryAxisMap.get(coordDim);
+        if (categoryAxisModel) {
+            if (firstCategoryDimIndex == null) {
+                firstCategoryDimIndex = dimIndex;
+            }
+            dimInfo.ordinalMeta = categoryAxisModel.getOrdinalMeta();
+        }
+        if (dimInfo.otherDims.itemName != null) {
+            hasNameEncode = true;
+        }
+    });
+    if (!hasNameEncode && firstCategoryDimIndex != null) {
+        dimInfoList[firstCategoryDimIndex].otherDims.itemName = 0;
+    }
+
+    var stackCalculationInfo = enableDataStack(seriesModel, dimInfoList);
+
+    var list = new List(dimInfoList, seriesModel);
+
+    list.setCalculationInfo(stackCalculationInfo);
+
+    var dimValueGetter = (firstCategoryDimIndex != null && isNeedCompleteOrdinalData(source))
+        ? function (itemOpt, dimName, dataIndex, dimIndex) {
+            // Use dataIndex as ordinal value in categoryAxis
+            return dimIndex === firstCategoryDimIndex
+                ? dataIndex
+                : this.defaultDimValueGetter(itemOpt, dimName, dataIndex, dimIndex);
+        }
+        : null;
+
+    list.hasItemOption = false;
+    list.initData(source, null, dimValueGetter);
+
+    return list;
+}
+
+function isNeedCompleteOrdinalData(source) {
+    if (source.sourceFormat === SOURCE_FORMAT_ORIGINAL) {
+        var sampleItem = firstDataNotNull(source.data || []);
+        return sampleItem != null
+            && !isArray(getDataItemValue(sampleItem));
+    }
+}
+
+function firstDataNotNull(data) {
+    var i = 0;
+    while (i < data.length && data[i] == null) {
+        i++;
+    }
+    return data[i];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * // Scale class management
+ * @module echarts/scale/Scale
+ */
+
+/**
+ * @param {Object} [setting]
+ */
+function Scale(setting) {
+    this._setting = setting || {};
+
+    /**
+     * Extent
+     * @type {Array.<number>}
+     * @protected
+     */
+    this._extent = [Infinity, -Infinity];
+
+    /**
+     * Step is calculated in adjustExtent
+     * @type {Array.<number>}
+     * @protected
+     */
+    this._interval = 0;
+
+    this.init && this.init.apply(this, arguments);
+}
+
+/**
+ * Parse input val to valid inner number.
+ * @param {*} val
+ * @return {number}
+ */
+Scale.prototype.parse = function (val) {
+    // Notice: This would be a trap here, If the implementation
+    // of this method depends on extent, and this method is used
+    // before extent set (like in dataZoom), it would be wrong.
+    // Nevertheless, parse does not depend on extent generally.
+    return val;
+};
+
+Scale.prototype.getSetting = function (name) {
+    return this._setting[name];
+};
+
+Scale.prototype.contain = function (val) {
+    var extent = this._extent;
+    return val >= extent[0] && val <= extent[1];
+};
+
+/**
+ * Normalize value to linear [0, 1], return 0.5 if extent span is 0
+ * @param {number} val
+ * @return {number}
+ */
+Scale.prototype.normalize = function (val) {
+    var extent = this._extent;
+    if (extent[1] === extent[0]) {
+        return 0.5;
+    }
+    return (val - extent[0]) / (extent[1] - extent[0]);
+};
+
+/**
+ * Scale normalized value
+ * @param {number} val
+ * @return {number}
+ */
+Scale.prototype.scale = function (val) {
+    var extent = this._extent;
+    return val * (extent[1] - extent[0]) + extent[0];
+};
+
+/**
+ * Set extent from data
+ * @param {Array.<number>} other
+ */
+Scale.prototype.unionExtent = function (other) {
+    var extent = this._extent;
+    other[0] < extent[0] && (extent[0] = other[0]);
+    other[1] > extent[1] && (extent[1] = other[1]);
+    // not setExtent because in log axis it may transformed to power
+    // this.setExtent(extent[0], extent[1]);
+};
+
+/**
+ * Set extent from data
+ * @param {module:echarts/data/List} data
+ * @param {string} dim
+ */
+Scale.prototype.unionExtentFromData = function (data, dim) {
+    this.unionExtent(data.getApproximateExtent(dim));
+};
+
+/**
+ * Get extent
+ * @return {Array.<number>}
+ */
+Scale.prototype.getExtent = function () {
+    return this._extent.slice();
+};
+
+/**
+ * Set extent
+ * @param {number} start
+ * @param {number} end
+ */
+Scale.prototype.setExtent = function (start, end) {
+    var thisExtent = this._extent;
+    if (!isNaN(start)) {
+        thisExtent[0] = start;
+    }
+    if (!isNaN(end)) {
+        thisExtent[1] = end;
+    }
+};
+
+/**
+ * When axis extent depends on data and no data exists,
+ * axis ticks should not be drawn, which is named 'blank'.
+ */
+Scale.prototype.isBlank = function () {
+    return this._isBlank;
+},
+
+/**
+ * When axis extent depends on data and no data exists,
+ * axis ticks should not be drawn, which is named 'blank'.
+ */
+Scale.prototype.setBlank = function (isBlank) {
+    this._isBlank = isBlank;
+};
+
+/**
+ * @abstract
+ * @param {*} tick
+ * @return {string} label of the tick.
+ */
+Scale.prototype.getLabel = null;
+
+
+enableClassExtend(Scale);
+enableClassManagement(Scale, {
+    registerWhenExtend: true
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @constructor
+ * @param {Object} [opt]
+ * @param {Object} [opt.categories=[]]
+ * @param {Object} [opt.needCollect=false]
+ * @param {Object} [opt.deduplication=false]
+ */
+function OrdinalMeta(opt) {
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    this.categories = opt.categories || [];
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._needCollect = opt.needCollect;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._deduplication = opt.deduplication;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._map;
+}
+
+/**
+ * @param {module:echarts/model/Model} axisModel
+ * @return {module:echarts/data/OrdinalMeta}
+ */
+OrdinalMeta.createByAxisModel = function (axisModel) {
+    var option = axisModel.option;
+    var data = option.data;
+    var categories = data && map(data, getName);
+
+    return new OrdinalMeta({
+        categories: categories,
+        needCollect: !categories,
+        // deduplication is default in axis.
+        deduplication: option.dedplication !== false
+    });
+};
+
+var proto$1 = OrdinalMeta.prototype;
+
+/**
+ * @param {string} category
+ * @return {number} ordinal
+ */
+proto$1.getOrdinal = function (category) {
+    return getOrCreateMap(this).get(category);
+};
+
+/**
+ * @param {*} category
+ * @return {number} The ordinal. If not found, return NaN.
+ */
+proto$1.parseAndCollect = function (category) {
+    var index;
+    var needCollect = this._needCollect;
+
+    // The value of category dim can be the index of the given category set.
+    // This feature is only supported when !needCollect, because we should
+    // consider a common case: a value is 2017, which is a number but is
+    // expected to be tread as a category. This case usually happen in dataset,
+    // where it happent to be no need of the index feature.
+    if (typeof category !== 'string' && !needCollect) {
+        return category;
+    }
+
+    // Optimize for the scenario:
+    // category is ['2012-01-01', '2012-01-02', ...], where the input
+    // data has been ensured not duplicate and is large data.
+    // Notice, if a dataset dimension provide categroies, usually echarts
+    // should remove duplication except user tell echarts dont do that
+    // (set axis.deduplication = false), because echarts do not know whether
+    // the values in the category dimension has duplication (consider the
+    // parallel-aqi example)
+    if (needCollect && !this._deduplication) {
+        index = this.categories.length;
+        this.categories[index] = category;
+        return index;
+    }
+
+    var map$$1 = getOrCreateMap(this);
+    index = map$$1.get(category);
+
+    if (index == null) {
+        if (needCollect) {
+            index = this.categories.length;
+            this.categories[index] = category;
+            map$$1.set(category, index);
+        }
+        else {
+            index = NaN;
+        }
+    }
+
+    return index;
+};
+
+// Consider big data, do not create map until needed.
+function getOrCreateMap(ordinalMeta) {
+    return ordinalMeta._map || (
+        ordinalMeta._map = createHashMap(ordinalMeta.categories)
+    );
+}
+
+function getName(obj) {
+    if (isObject$1(obj) && obj.value != null) {
+        return obj.value;
+    }
+    else {
+        return obj + '';
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Linear continuous scale
+ * @module echarts/coord/scale/Ordinal
+ *
+ * http://en.wikipedia.org/wiki/Level_of_measurement
+ */
+
+// FIXME only one data
+
+var scaleProto = Scale.prototype;
+
+var OrdinalScale = Scale.extend({
+
+    type: 'ordinal',
+
+    /**
+     * @param {module:echarts/data/OrdianlMeta|Array.<string>} ordinalMeta
+     */
+    init: function (ordinalMeta, extent) {
+        // Caution: Should not use instanceof, consider ec-extensions using
+        // import approach to get OrdinalMeta class.
+        if (!ordinalMeta || isArray(ordinalMeta)) {
+            ordinalMeta = new OrdinalMeta({categories: ordinalMeta});
+        }
+        this._ordinalMeta = ordinalMeta;
+        this._extent = extent || [0, ordinalMeta.categories.length - 1];
+    },
+
+    parse: function (val) {
+        return typeof val === 'string'
+            ? this._ordinalMeta.getOrdinal(val)
+            // val might be float.
+            : Math.round(val);
+    },
+
+    contain: function (rank) {
+        rank = this.parse(rank);
+        return scaleProto.contain.call(this, rank)
+            && this._ordinalMeta.categories[rank] != null;
+    },
+
+    /**
+     * Normalize given rank or name to linear [0, 1]
+     * @param {number|string} [val]
+     * @return {number}
+     */
+    normalize: function (val) {
+        return scaleProto.normalize.call(this, this.parse(val));
+    },
+
+    scale: function (val) {
+        return Math.round(scaleProto.scale.call(this, val));
+    },
+
+    /**
+     * @return {Array}
+     */
+    getTicks: function () {
+        var ticks = [];
+        var extent = this._extent;
+        var rank = extent[0];
+
+        while (rank <= extent[1]) {
+            ticks.push(rank);
+            rank++;
+        }
+
+        return ticks;
+    },
+
+    /**
+     * Get item on rank n
+     * @param {number} n
+     * @return {string}
+     */
+    getLabel: function (n) {
+        if (!this.isBlank()) {
+            // Note that if no data, ordinalMeta.categories is an empty array.
+            return this._ordinalMeta.categories[n];
+        }
+    },
+
+    /**
+     * @return {number}
+     */
+    count: function () {
+        return this._extent[1] - this._extent[0] + 1;
+    },
+
+    /**
+     * @override
+     */
+    unionExtentFromData: function (data, dim) {
+        this.unionExtent(data.getApproximateExtent(dim));
+    },
+
+    getOrdinalMeta: function () {
+        return this._ordinalMeta;
+    },
+
+    niceTicks: noop,
+    niceExtent: noop
+});
+
+/**
+ * @return {module:echarts/scale/Time}
+ */
+OrdinalScale.create = function () {
+    return new OrdinalScale();
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * For testable.
+ */
+
+var roundNumber$1 = round$1;
+
+/**
+ * @param {Array.<number>} extent Both extent[0] and extent[1] should be valid number.
+ *                                Should be extent[0] < extent[1].
+ * @param {number} splitNumber splitNumber should be >= 1.
+ * @param {number} [minInterval]
+ * @param {number} [maxInterval]
+ * @return {Object} {interval, intervalPrecision, niceTickExtent}
+ */
+function intervalScaleNiceTicks(extent, splitNumber, minInterval, maxInterval) {
+    var result = {};
+    var span = extent[1] - extent[0];
+
+    var interval = result.interval = nice(span / splitNumber, true);
+    if (minInterval != null && interval < minInterval) {
+        interval = result.interval = minInterval;
+    }
+    if (maxInterval != null && interval > maxInterval) {
+        interval = result.interval = maxInterval;
+    }
+    // Tow more digital for tick.
+    var precision = result.intervalPrecision = getIntervalPrecision(interval);
+    // Niced extent inside original extent
+    var niceTickExtent = result.niceTickExtent = [
+        roundNumber$1(Math.ceil(extent[0] / interval) * interval, precision),
+        roundNumber$1(Math.floor(extent[1] / interval) * interval, precision)
+    ];
+
+    fixExtent(niceTickExtent, extent);
+
+    return result;
+}
+
+/**
+ * @param {number} interval
+ * @return {number} interval precision
+ */
+function getIntervalPrecision(interval) {
+    // Tow more digital for tick.
+    return getPrecisionSafe(interval) + 2;
+}
+
+function clamp(niceTickExtent, idx, extent) {
+    niceTickExtent[idx] = Math.max(Math.min(niceTickExtent[idx], extent[1]), extent[0]);
+}
+
+// In some cases (e.g., splitNumber is 1), niceTickExtent may be out of extent.
+function fixExtent(niceTickExtent, extent) {
+    !isFinite(niceTickExtent[0]) && (niceTickExtent[0] = extent[0]);
+    !isFinite(niceTickExtent[1]) && (niceTickExtent[1] = extent[1]);
+    clamp(niceTickExtent, 0, extent);
+    clamp(niceTickExtent, 1, extent);
+    if (niceTickExtent[0] > niceTickExtent[1]) {
+        niceTickExtent[0] = niceTickExtent[1];
+    }
+}
+
+function intervalScaleGetTicks(interval, extent, niceTickExtent, intervalPrecision) {
+    var ticks = [];
+
+    // If interval is 0, return [];
+    if (!interval) {
+        return ticks;
+    }
+
+    // Consider this case: using dataZoom toolbox, zoom and zoom.
+    var safeLimit = 10000;
+
+    if (extent[0] < niceTickExtent[0]) {
+        ticks.push(extent[0]);
+    }
+    var tick = niceTickExtent[0];
+
+    while (tick <= niceTickExtent[1]) {
+        ticks.push(tick);
+        // Avoid rounding error
+        tick = roundNumber$1(tick + interval, intervalPrecision);
+        if (tick === ticks[ticks.length - 1]) {
+            // Consider out of safe float point, e.g.,
+            // -3711126.9907707 + 2e-10 === -3711126.9907707
+            break;
+        }
+        if (ticks.length > safeLimit) {
+            return [];
+        }
+    }
+    // Consider this case: the last item of ticks is smaller
+    // than niceTickExtent[1] and niceTickExtent[1] === extent[1].
+    if (extent[1] > (ticks.length ? ticks[ticks.length - 1] : niceTickExtent[1])) {
+        ticks.push(extent[1]);
+    }
+
+    return ticks;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Interval scale
+ * @module echarts/scale/Interval
+ */
+
+
+var roundNumber = round$1;
+
+/**
+ * @alias module:echarts/coord/scale/Interval
+ * @constructor
+ */
+var IntervalScale = Scale.extend({
+
+    type: 'interval',
+
+    _interval: 0,
+
+    _intervalPrecision: 2,
+
+    setExtent: function (start, end) {
+        var thisExtent = this._extent;
+        //start,end may be a Number like '25',so...
+        if (!isNaN(start)) {
+            thisExtent[0] = parseFloat(start);
+        }
+        if (!isNaN(end)) {
+            thisExtent[1] = parseFloat(end);
+        }
+    },
+
+    unionExtent: function (other) {
+        var extent = this._extent;
+        other[0] < extent[0] && (extent[0] = other[0]);
+        other[1] > extent[1] && (extent[1] = other[1]);
+
+        // unionExtent may called by it's sub classes
+        IntervalScale.prototype.setExtent.call(this, extent[0], extent[1]);
+    },
+    /**
+     * Get interval
+     */
+    getInterval: function () {
+        return this._interval;
+    },
+
+    /**
+     * Set interval
+     */
+    setInterval: function (interval) {
+        this._interval = interval;
+        // Dropped auto calculated niceExtent and use user setted extent
+        // We assume user wan't to set both interval, min, max to get a better result
+        this._niceExtent = this._extent.slice();
+
+        this._intervalPrecision = getIntervalPrecision(interval);
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getTicks: function () {
+        return intervalScaleGetTicks(
+            this._interval, this._extent, this._niceExtent, this._intervalPrecision
+        );
+    },
+
+    /**
+     * @param {number} data
+     * @param {Object} [opt]
+     * @param {number|string} [opt.precision] If 'auto', use nice presision.
+     * @param {boolean} [opt.pad] returns 1.50 but not 1.5 if precision is 2.
+     * @return {string}
+     */
+    getLabel: function (data, opt) {
+        if (data == null) {
+            return '';
+        }
+
+        var precision = opt && opt.precision;
+
+        if (precision == null) {
+            precision = getPrecisionSafe(data) || 0;
+        }
+        else if (precision === 'auto') {
+            // Should be more precise then tick.
+            precision = this._intervalPrecision;
+        }
+
+        // (1) If `precision` is set, 12.005 should be display as '12.00500'.
+        // (2) Use roundNumber (toFixed) to avoid scientific notation like '3.5e-7'.
+        data = roundNumber(data, precision, true);
+
+        return addCommas(data);
+    },
+
+    /**
+     * Update interval and extent of intervals for nice ticks
+     *
+     * @param {number} [splitNumber = 5] Desired number of ticks
+     * @param {number} [minInterval]
+     * @param {number} [maxInterval]
+     */
+    niceTicks: function (splitNumber, minInterval, maxInterval) {
+        splitNumber = splitNumber || 5;
+        var extent = this._extent;
+        var span = extent[1] - extent[0];
+        if (!isFinite(span)) {
+            return;
+        }
+        // User may set axis min 0 and data are all negative
+        // FIXME If it needs to reverse ?
+        if (span < 0) {
+            span = -span;
+            extent.reverse();
+        }
+
+        var result = intervalScaleNiceTicks(
+            extent, splitNumber, minInterval, maxInterval
+        );
+
+        this._intervalPrecision = result.intervalPrecision;
+        this._interval = result.interval;
+        this._niceExtent = result.niceTickExtent;
+    },
+
+    /**
+     * Nice extent.
+     * @param {Object} opt
+     * @param {number} [opt.splitNumber = 5] Given approx tick number
+     * @param {boolean} [opt.fixMin=false]
+     * @param {boolean} [opt.fixMax=false]
+     * @param {boolean} [opt.minInterval]
+     * @param {boolean} [opt.maxInterval]
+     */
+    niceExtent: function (opt) {
+        var extent = this._extent;
+        // If extent start and end are same, expand them
+        if (extent[0] === extent[1]) {
+            if (extent[0] !== 0) {
+                // Expand extent
+                var expandSize = extent[0];
+                // In the fowllowing case
+                //      Axis has been fixed max 100
+                //      Plus data are all 100 and axis extent are [100, 100].
+                // Extend to the both side will cause expanded max is larger than fixed max.
+                // So only expand to the smaller side.
+                if (!opt.fixMax) {
+                    extent[1] += expandSize / 2;
+                    extent[0] -= expandSize / 2;
+                }
+                else {
+                    extent[0] -= expandSize / 2;
+                }
+            }
+            else {
+                extent[1] = 1;
+            }
+        }
+        var span = extent[1] - extent[0];
+        // If there are no data and extent are [Infinity, -Infinity]
+        if (!isFinite(span)) {
+            extent[0] = 0;
+            extent[1] = 1;
+        }
+
+        this.niceTicks(opt.splitNumber, opt.minInterval, opt.maxInterval);
+
+        // var extent = this._extent;
+        var interval = this._interval;
+
+        if (!opt.fixMin) {
+            extent[0] = roundNumber(Math.floor(extent[0] / interval) * interval);
+        }
+        if (!opt.fixMax) {
+            extent[1] = roundNumber(Math.ceil(extent[1] / interval) * interval);
+        }
+    }
+});
+
+/**
+ * @return {module:echarts/scale/Time}
+ */
+IntervalScale.create = function () {
+    return new IntervalScale();
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var STACK_PREFIX = '__ec_stack_';
+var LARGE_BAR_MIN_WIDTH = 0.5;
+
+var LargeArr = typeof Float32Array !== 'undefined' ? Float32Array : Array;
+
+function getSeriesStackId(seriesModel) {
+    return seriesModel.get('stack') || STACK_PREFIX + seriesModel.seriesIndex;
+}
+
+function getAxisKey(axis) {
+    return axis.dim + axis.index;
+}
+
+/**
+ * @param {Object} opt
+ * @param {module:echarts/coord/Axis} opt.axis Only support category axis currently.
+ * @param {number} opt.count Positive interger.
+ * @param {number} [opt.barWidth]
+ * @param {number} [opt.barMaxWidth]
+ * @param {number} [opt.barGap]
+ * @param {number} [opt.barCategoryGap]
+ * @return {Object} {width, offset, offsetCenter} If axis.type is not 'category', return undefined.
+ */
+function getLayoutOnAxis(opt) {
+    var params = [];
+    var baseAxis = opt.axis;
+    var axisKey = 'axis0';
+
+    if (baseAxis.type !== 'category') {
+        return;
+    }
+    var bandWidth = baseAxis.getBandWidth();
+
+    for (var i = 0; i < opt.count || 0; i++) {
+        params.push(defaults({
+            bandWidth: bandWidth,
+            axisKey: axisKey,
+            stackId: STACK_PREFIX + i
+        }, opt));
+    }
+    var widthAndOffsets = doCalBarWidthAndOffset(params);
+
+    var result = [];
+    for (var i = 0; i < opt.count; i++) {
+        var item = widthAndOffsets[axisKey][STACK_PREFIX + i];
+        item.offsetCenter = item.offset + item.width / 2;
+        result.push(item);
+    }
+
+    return result;
+}
+
+function prepareLayoutBarSeries(seriesType, ecModel) {
+    var seriesModels = [];
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        // Check series coordinate, do layout for cartesian2d only
+        if (isOnCartesian(seriesModel) && !isInLargeMode(seriesModel)) {
+            seriesModels.push(seriesModel);
+        }
+    });
+    return seriesModels;
+}
+
+function makeColumnLayout(barSeries) {
+    var seriesInfoList = [];
+    each$1(barSeries, function (seriesModel) {
+        var data = seriesModel.getData();
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+        var axisExtent = baseAxis.getExtent();
+        var bandWidth = baseAxis.type === 'category'
+            ? baseAxis.getBandWidth()
+            : (Math.abs(axisExtent[1] - axisExtent[0]) / data.count());
+
+        var barWidth = parsePercent$1(
+            seriesModel.get('barWidth'), bandWidth
+        );
+        var barMaxWidth = parsePercent$1(
+            seriesModel.get('barMaxWidth'), bandWidth
+        );
+        var barGap = seriesModel.get('barGap');
+        var barCategoryGap = seriesModel.get('barCategoryGap');
+
+        seriesInfoList.push({
+            bandWidth: bandWidth,
+            barWidth: barWidth,
+            barMaxWidth: barMaxWidth,
+            barGap: barGap,
+            barCategoryGap: barCategoryGap,
+            axisKey: getAxisKey(baseAxis),
+            stackId: getSeriesStackId(seriesModel)
+        });
+    });
+
+    return doCalBarWidthAndOffset(seriesInfoList);
+}
+
+function doCalBarWidthAndOffset(seriesInfoList) {
+    // Columns info on each category axis. Key is cartesian name
+    var columnsMap = {};
+
+    each$1(seriesInfoList, function (seriesInfo, idx) {
+        var axisKey = seriesInfo.axisKey;
+        var bandWidth = seriesInfo.bandWidth;
+        var columnsOnAxis = columnsMap[axisKey] || {
+            bandWidth: bandWidth,
+            remainedWidth: bandWidth,
+            autoWidthCount: 0,
+            categoryGap: '20%',
+            gap: '30%',
+            stacks: {}
+        };
+        var stacks = columnsOnAxis.stacks;
+        columnsMap[axisKey] = columnsOnAxis;
+
+        var stackId = seriesInfo.stackId;
+
+        if (!stacks[stackId]) {
+            columnsOnAxis.autoWidthCount++;
+        }
+        stacks[stackId] = stacks[stackId] || {
+            width: 0,
+            maxWidth: 0
+        };
+
+        // Caution: In a single coordinate system, these barGrid attributes
+        // will be shared by series. Consider that they have default values,
+        // only the attributes set on the last series will work.
+        // Do not change this fact unless there will be a break change.
+
+        // TODO
+        var barWidth = seriesInfo.barWidth;
+        if (barWidth && !stacks[stackId].width) {
+            // See #6312, do not restrict width.
+            stacks[stackId].width = barWidth;
+            barWidth = Math.min(columnsOnAxis.remainedWidth, barWidth);
+            columnsOnAxis.remainedWidth -= barWidth;
+        }
+
+        var barMaxWidth = seriesInfo.barMaxWidth;
+        barMaxWidth && (stacks[stackId].maxWidth = barMaxWidth);
+        var barGap = seriesInfo.barGap;
+        (barGap != null) && (columnsOnAxis.gap = barGap);
+        var barCategoryGap = seriesInfo.barCategoryGap;
+        (barCategoryGap != null) && (columnsOnAxis.categoryGap = barCategoryGap);
+    });
+
+    var result = {};
+
+    each$1(columnsMap, function (columnsOnAxis, coordSysName) {
+
+        result[coordSysName] = {};
+
+        var stacks = columnsOnAxis.stacks;
+        var bandWidth = columnsOnAxis.bandWidth;
+        var categoryGap = parsePercent$1(columnsOnAxis.categoryGap, bandWidth);
+        var barGapPercent = parsePercent$1(columnsOnAxis.gap, 1);
+
+        var remainedWidth = columnsOnAxis.remainedWidth;
+        var autoWidthCount = columnsOnAxis.autoWidthCount;
+        var autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        // Find if any auto calculated bar exceeded maxBarWidth
+        each$1(stacks, function (column, stack) {
+            var maxWidth = column.maxWidth;
+            if (maxWidth && maxWidth < autoWidth) {
+                maxWidth = Math.min(maxWidth, remainedWidth);
+                if (column.width) {
+                    maxWidth = Math.min(maxWidth, column.width);
+                }
+                remainedWidth -= maxWidth;
+                column.width = maxWidth;
+                autoWidthCount--;
+            }
+        });
+
+        // Recalculate width again
+        autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        var widthSum = 0;
+        var lastColumn;
+        each$1(stacks, function (column, idx) {
+            if (!column.width) {
+                column.width = autoWidth;
+            }
+            lastColumn = column;
+            widthSum += column.width * (1 + barGapPercent);
+        });
+        if (lastColumn) {
+            widthSum -= lastColumn.width * barGapPercent;
+        }
+
+        var offset = -widthSum / 2;
+        each$1(stacks, function (column, stackId) {
+            result[coordSysName][stackId] = result[coordSysName][stackId] || {
+                offset: offset,
+                width: column.width
+            };
+
+            offset += column.width * (1 + barGapPercent);
+        });
+    });
+
+    return result;
+}
+
+/**
+ * @param {Object} barWidthAndOffset The result of makeColumnLayout
+ * @param {module:echarts/coord/Axis} axis
+ * @param {module:echarts/model/Series} [seriesModel] If not provided, return all.
+ * @return {Object} {stackId: {offset, width}} or {offset, width} if seriesModel provided.
+ */
+function retrieveColumnLayout(barWidthAndOffset, axis, seriesModel) {
+    if (barWidthAndOffset && axis) {
+        var result = barWidthAndOffset[getAxisKey(axis)];
+        if (result != null && seriesModel != null) {
+            result = result[getSeriesStackId(seriesModel)];
+        }
+        return result;
+    }
+}
+
+/**
+ * @param {string} seriesType
+ * @param {module:echarts/model/Global} ecModel
+ */
+function layout(seriesType, ecModel) {
+
+    var seriesModels = prepareLayoutBarSeries(seriesType, ecModel);
+    var barWidthAndOffset = makeColumnLayout(seriesModels);
+
+    var lastStackCoords = {};
+    each$1(seriesModels, function (seriesModel) {
+
+        var data = seriesModel.getData();
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+
+        var stackId = getSeriesStackId(seriesModel);
+        var columnLayoutInfo = barWidthAndOffset[getAxisKey(baseAxis)][stackId];
+        var columnOffset = columnLayoutInfo.offset;
+        var columnWidth = columnLayoutInfo.width;
+        var valueAxis = cartesian.getOtherAxis(baseAxis);
+
+        var barMinHeight = seriesModel.get('barMinHeight') || 0;
+
+        lastStackCoords[stackId] = lastStackCoords[stackId] || [];
+        data.setLayout({
+            offset: columnOffset,
+            size: columnWidth
+        });
+
+        var valueDim = data.mapDimension(valueAxis.dim);
+        var baseDim = data.mapDimension(baseAxis.dim);
+        var stacked = isDimensionStacked(data, valueDim /*, baseDim*/);
+        var isValueAxisH = valueAxis.isHorizontal();
+
+        var valueAxisStart = getValueAxisStart(baseAxis, valueAxis, stacked);
+
+        for (var idx = 0, len = data.count(); idx < len; idx++) {
+            var value = data.get(valueDim, idx);
+            var baseValue = data.get(baseDim, idx);
+
+            if (isNaN(value)) {
+                continue;
+            }
+
+            var sign = value >= 0 ? 'p' : 'n';
+            var baseCoord = valueAxisStart;
+
+            // Because of the barMinHeight, we can not use the value in
+            // stackResultDimension directly.
+            if (stacked) {
+                // Only ordinal axis can be stacked.
+                if (!lastStackCoords[stackId][baseValue]) {
+                    lastStackCoords[stackId][baseValue] = {
+                        p: valueAxisStart, // Positive stack
+                        n: valueAxisStart  // Negative stack
+                    };
+                }
+                // Should also consider #4243
+                baseCoord = lastStackCoords[stackId][baseValue][sign];
+            }
+
+            var x;
+            var y;
+            var width;
+            var height;
+
+            if (isValueAxisH) {
+                var coord = cartesian.dataToPoint([value, baseValue]);
+                x = baseCoord;
+                y = coord[1] + columnOffset;
+                width = coord[0] - valueAxisStart;
+                height = columnWidth;
+
+                if (Math.abs(width) < barMinHeight) {
+                    width = (width < 0 ? -1 : 1) * barMinHeight;
+                }
+                stacked && (lastStackCoords[stackId][baseValue][sign] += width);
+            }
+            else {
+                var coord = cartesian.dataToPoint([baseValue, value]);
+                x = coord[0] + columnOffset;
+                y = baseCoord;
+                width = columnWidth;
+                height = coord[1] - valueAxisStart;
+
+                if (Math.abs(height) < barMinHeight) {
+                    // Include zero to has a positive bar
+                    height = (height <= 0 ? -1 : 1) * barMinHeight;
+                }
+                stacked && (lastStackCoords[stackId][baseValue][sign] += height);
+            }
+
+            data.setItemLayout(idx, {
+                x: x,
+                y: y,
+                width: width,
+                height: height
+            });
+        }
+
+    }, this);
+}
+
+// TODO: Do not support stack in large mode yet.
+var largeLayout = {
+
+    seriesType: 'bar',
+
+    plan: createRenderPlanner(),
+
+    reset: function (seriesModel) {
+        if (!isOnCartesian(seriesModel) || !isInLargeMode(seriesModel)) {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+        var valueAxis = cartesian.getOtherAxis(baseAxis);
+        var valueDim = data.mapDimension(valueAxis.dim);
+        var baseDim = data.mapDimension(baseAxis.dim);
+        var valueAxisHorizontal = valueAxis.isHorizontal();
+        var valueDimIdx = valueAxisHorizontal ? 0 : 1;
+
+        var barWidth = retrieveColumnLayout(
+            makeColumnLayout([seriesModel]), baseAxis, seriesModel
+        ).width;
+        if (!(barWidth > LARGE_BAR_MIN_WIDTH)) { // jshint ignore:line
+            barWidth = LARGE_BAR_MIN_WIDTH;
+        }
+
+        return {progress: progress};
+
+        function progress(params, data) {
+            var largePoints = new LargeArr(params.count * 2);
+            var dataIndex;
+            var coord = [];
+            var valuePair = [];
+            var offset = 0;
+
+            while ((dataIndex = params.next()) != null) {
+                valuePair[valueDimIdx] = data.get(valueDim, dataIndex);
+                valuePair[1 - valueDimIdx] = data.get(baseDim, dataIndex);
+
+                coord = cartesian.dataToPoint(valuePair, null, coord);
+                largePoints[offset++] = coord[0];
+                largePoints[offset++] = coord[1];
+            }
+
+            data.setLayout({
+                largePoints: largePoints,
+                barWidth: barWidth,
+                valueAxisStart: getValueAxisStart(baseAxis, valueAxis, false),
+                valueAxisHorizontal: valueAxisHorizontal
+            });
+        }
+    }
+};
+
+function isOnCartesian(seriesModel) {
+    return seriesModel.coordinateSystem && seriesModel.coordinateSystem.type === 'cartesian2d';
+}
+
+function isInLargeMode(seriesModel) {
+    return seriesModel.pipelineContext && seriesModel.pipelineContext.large;
+}
+
+function getValueAxisStart(baseAxis, valueAxis, stacked) {
+    return (
+        indexOf(baseAxis.getAxesOnZeroOf(), valueAxis) >= 0
+        || stacked
+    )
+    ? valueAxis.toGlobalCoord(valueAxis.dataToCoord(0))
+    : valueAxis.getGlobalExtent()[0];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The `scaleLevels` references to d3.js. The use of the source
+* code of this file is also subject to the terms and consitions
+* of its license (BSD-3Clause, see <echarts/src/licenses/LICENSE-d3>).
+*/
+
+// [About UTC and local time zone]:
+// In most cases, `number.parseDate` will treat input data string as local time
+// (except time zone is specified in time string). And `format.formateTime` returns
+// local time by default. option.useUTC is false by default. This design have
+// concidered these common case:
+// (1) Time that is persistent in server is in UTC, but it is needed to be diplayed
+// in local time by default.
+// (2) By default, the input data string (e.g., '2011-01-02') should be displayed
+// as its original time, without any time difference.
+
+var intervalScaleProto = IntervalScale.prototype;
+
+var mathCeil = Math.ceil;
+var mathFloor = Math.floor;
+var ONE_SECOND = 1000;
+var ONE_MINUTE = ONE_SECOND * 60;
+var ONE_HOUR = ONE_MINUTE * 60;
+var ONE_DAY = ONE_HOUR * 24;
+
+// FIXME 公用？
+var bisect = function (a, x, lo, hi) {
+    while (lo < hi) {
+        var mid = lo + hi >>> 1;
+        if (a[mid][1] < x) {
+            lo = mid + 1;
+        }
+        else {
+            hi  = mid;
+        }
+    }
+    return lo;
+};
+
+/**
+ * @alias module:echarts/coord/scale/Time
+ * @constructor
+ */
+var TimeScale = IntervalScale.extend({
+    type: 'time',
+
+    /**
+     * @override
+     */
+    getLabel: function (val) {
+        var stepLvl = this._stepLvl;
+
+        var date = new Date(val);
+
+        return formatTime(stepLvl[0], date, this.getSetting('useUTC'));
+    },
+
+    /**
+     * @override
+     */
+    niceExtent: function (opt) {
+        var extent = this._extent;
+        // If extent start and end are same, expand them
+        if (extent[0] === extent[1]) {
+            // Expand extent
+            extent[0] -= ONE_DAY;
+            extent[1] += ONE_DAY;
+        }
+        // If there are no data and extent are [Infinity, -Infinity]
+        if (extent[1] === -Infinity && extent[0] === Infinity) {
+            var d = new Date();
+            extent[1] = +new Date(d.getFullYear(), d.getMonth(), d.getDate());
+            extent[0] = extent[1] - ONE_DAY;
+        }
+
+        this.niceTicks(opt.splitNumber, opt.minInterval, opt.maxInterval);
+
+        // var extent = this._extent;
+        var interval = this._interval;
+
+        if (!opt.fixMin) {
+            extent[0] = round$1(mathFloor(extent[0] / interval) * interval);
+        }
+        if (!opt.fixMax) {
+            extent[1] = round$1(mathCeil(extent[1] / interval) * interval);
+        }
+    },
+
+    /**
+     * @override
+     */
+    niceTicks: function (approxTickNum, minInterval, maxInterval) {
+        approxTickNum = approxTickNum || 10;
+
+        var extent = this._extent;
+        var span = extent[1] - extent[0];
+        var approxInterval = span / approxTickNum;
+
+        if (minInterval != null && approxInterval < minInterval) {
+            approxInterval = minInterval;
+        }
+        if (maxInterval != null && approxInterval > maxInterval) {
+            approxInterval = maxInterval;
+        }
+
+        var scaleLevelsLen = scaleLevels.length;
+        var idx = bisect(scaleLevels, approxInterval, 0, scaleLevelsLen);
+
+        var level = scaleLevels[Math.min(idx, scaleLevelsLen - 1)];
+        var interval = level[1];
+        // Same with interval scale if span is much larger than 1 year
+        if (level[0] === 'year') {
+            var yearSpan = span / interval;
+
+            // From "Nice Numbers for Graph Labels" of Graphic Gems
+            // var niceYearSpan = numberUtil.nice(yearSpan, false);
+            var yearStep = nice(yearSpan / approxTickNum, true);
+
+            interval *= yearStep;
+        }
+
+        var timezoneOffset = this.getSetting('useUTC')
+            ? 0 : (new Date(+extent[0] || +extent[1])).getTimezoneOffset() * 60 * 1000;
+        var niceExtent = [
+            Math.round(mathCeil((extent[0] - timezoneOffset) / interval) * interval + timezoneOffset),
+            Math.round(mathFloor((extent[1] - timezoneOffset) / interval) * interval + timezoneOffset)
+        ];
+
+        fixExtent(niceExtent, extent);
+
+        this._stepLvl = level;
+        // Interval will be used in getTicks
+        this._interval = interval;
+        this._niceExtent = niceExtent;
+    },
+
+    parse: function (val) {
+        // val might be float.
+        return +parseDate(val);
+    }
+});
+
+each$1(['contain', 'normalize'], function (methodName) {
+    TimeScale.prototype[methodName] = function (val) {
+        return intervalScaleProto[methodName].call(this, this.parse(val));
+    };
+});
+
+// Steps from d3, see the license statement at the top of this file.
+var scaleLevels = [
+    // Format              interval
+    ['hh:mm:ss', ONE_SECOND],          // 1s
+    ['hh:mm:ss', ONE_SECOND * 5],      // 5s
+    ['hh:mm:ss', ONE_SECOND * 10],     // 10s
+    ['hh:mm:ss', ONE_SECOND * 15],     // 15s
+    ['hh:mm:ss', ONE_SECOND * 30],     // 30s
+    ['hh:mm\nMM-dd', ONE_MINUTE],      // 1m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 5],  // 5m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 10], // 10m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 15], // 15m
+    ['hh:mm\nMM-dd', ONE_MINUTE * 30], // 30m
+    ['hh:mm\nMM-dd', ONE_HOUR],        // 1h
+    ['hh:mm\nMM-dd', ONE_HOUR * 2],    // 2h
+    ['hh:mm\nMM-dd', ONE_HOUR * 6],    // 6h
+    ['hh:mm\nMM-dd', ONE_HOUR * 12],   // 12h
+    ['MM-dd\nyyyy', ONE_DAY],          // 1d
+    ['MM-dd\nyyyy', ONE_DAY * 2],      // 2d
+    ['MM-dd\nyyyy', ONE_DAY * 3],      // 3d
+    ['MM-dd\nyyyy', ONE_DAY * 4],      // 4d
+    ['MM-dd\nyyyy', ONE_DAY * 5],      // 5d
+    ['MM-dd\nyyyy', ONE_DAY * 6],      // 6d
+    ['week', ONE_DAY * 7],             // 7d
+    ['MM-dd\nyyyy', ONE_DAY * 10],     // 10d
+    ['week', ONE_DAY * 14],            // 2w
+    ['week', ONE_DAY * 21],            // 3w
+    ['month', ONE_DAY * 31],           // 1M
+    ['week', ONE_DAY * 42],            // 6w
+    ['month', ONE_DAY * 62],           // 2M
+    ['week', ONE_DAY * 42],            // 10w
+    ['quarter', ONE_DAY * 380 / 4],    // 3M
+    ['month', ONE_DAY * 31 * 4],       // 4M
+    ['month', ONE_DAY * 31 * 5],       // 5M
+    ['half-year', ONE_DAY * 380 / 2],  // 6M
+    ['month', ONE_DAY * 31 * 8],       // 8M
+    ['month', ONE_DAY * 31 * 10],      // 10M
+    ['year', ONE_DAY * 380]            // 1Y
+];
+
+/**
+ * @param {module:echarts/model/Model}
+ * @return {module:echarts/scale/Time}
+ */
+TimeScale.create = function (model) {
+    return new TimeScale({useUTC: model.ecModel.get('useUTC')});
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Log scale
+ * @module echarts/scale/Log
+ */
+
+// Use some method of IntervalScale
+var scaleProto$1 = Scale.prototype;
+var intervalScaleProto$1 = IntervalScale.prototype;
+
+var getPrecisionSafe$1 = getPrecisionSafe;
+var roundingErrorFix = round$1;
+
+var mathFloor$1 = Math.floor;
+var mathCeil$1 = Math.ceil;
+var mathPow$1 = Math.pow;
+
+var mathLog = Math.log;
+
+var LogScale = Scale.extend({
+
+    type: 'log',
+
+    base: 10,
+
+    $constructor: function () {
+        Scale.apply(this, arguments);
+        this._originalScale = new IntervalScale();
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getTicks: function () {
+        var originalScale = this._originalScale;
+        var extent = this._extent;
+        var originalExtent = originalScale.getExtent();
+
+        return map(intervalScaleProto$1.getTicks.call(this), function (val) {
+            var powVal = round$1(mathPow$1(this.base, val));
+
+            // Fix #4158
+            powVal = (val === extent[0] && originalScale.__fixMin)
+                ? fixRoundingError(powVal, originalExtent[0])
+                : powVal;
+            powVal = (val === extent[1] && originalScale.__fixMax)
+                ? fixRoundingError(powVal, originalExtent[1])
+                : powVal;
+
+            return powVal;
+        }, this);
+    },
+
+    /**
+     * @param {number} val
+     * @return {string}
+     */
+    getLabel: intervalScaleProto$1.getLabel,
+
+    /**
+     * @param  {number} val
+     * @return {number}
+     */
+    scale: function (val) {
+        val = scaleProto$1.scale.call(this, val);
+        return mathPow$1(this.base, val);
+    },
+
+    /**
+     * @param {number} start
+     * @param {number} end
+     */
+    setExtent: function (start, end) {
+        var base = this.base;
+        start = mathLog(start) / mathLog(base);
+        end = mathLog(end) / mathLog(base);
+        intervalScaleProto$1.setExtent.call(this, start, end);
+    },
+
+    /**
+     * @return {number} end
+     */
+    getExtent: function () {
+        var base = this.base;
+        var extent = scaleProto$1.getExtent.call(this);
+        extent[0] = mathPow$1(base, extent[0]);
+        extent[1] = mathPow$1(base, extent[1]);
+
+        // Fix #4158
+        var originalScale = this._originalScale;
+        var originalExtent = originalScale.getExtent();
+        originalScale.__fixMin && (extent[0] = fixRoundingError(extent[0], originalExtent[0]));
+        originalScale.__fixMax && (extent[1] = fixRoundingError(extent[1], originalExtent[1]));
+
+        return extent;
+    },
+
+    /**
+     * @param  {Array.<number>} extent
+     */
+    unionExtent: function (extent) {
+        this._originalScale.unionExtent(extent);
+
+        var base = this.base;
+        extent[0] = mathLog(extent[0]) / mathLog(base);
+        extent[1] = mathLog(extent[1]) / mathLog(base);
+        scaleProto$1.unionExtent.call(this, extent);
+    },
+
+    /**
+     * @override
+     */
+    unionExtentFromData: function (data, dim) {
+        // TODO
+        // filter value that <= 0
+        this.unionExtent(data.getApproximateExtent(dim));
+    },
+
+    /**
+     * Update interval and extent of intervals for nice ticks
+     * @param  {number} [approxTickNum = 10] Given approx tick number
+     */
+    niceTicks: function (approxTickNum) {
+        approxTickNum = approxTickNum || 10;
+        var extent = this._extent;
+        var span = extent[1] - extent[0];
+        if (span === Infinity || span <= 0) {
+            return;
+        }
+
+        var interval = quantity(span);
+        var err = approxTickNum / span * interval;
+
+        // Filter ticks to get closer to the desired count.
+        if (err <= 0.5) {
+            interval *= 10;
+        }
+
+        // Interval should be integer
+        while (!isNaN(interval) && Math.abs(interval) < 1 && Math.abs(interval) > 0) {
+            interval *= 10;
+        }
+
+        var niceExtent = [
+            round$1(mathCeil$1(extent[0] / interval) * interval),
+            round$1(mathFloor$1(extent[1] / interval) * interval)
+        ];
+
+        this._interval = interval;
+        this._niceExtent = niceExtent;
+    },
+
+    /**
+     * Nice extent.
+     * @override
+     */
+    niceExtent: function (opt) {
+        intervalScaleProto$1.niceExtent.call(this, opt);
+
+        var originalScale = this._originalScale;
+        originalScale.__fixMin = opt.fixMin;
+        originalScale.__fixMax = opt.fixMax;
+    }
+
+});
+
+each$1(['contain', 'normalize'], function (methodName) {
+    LogScale.prototype[methodName] = function (val) {
+        val = mathLog(val) / mathLog(this.base);
+        return scaleProto$1[methodName].call(this, val);
+    };
+});
+
+LogScale.create = function () {
+    return new LogScale();
+};
+
+function fixRoundingError(val, originalVal) {
+    return roundingErrorFix(val, getPrecisionSafe$1(originalVal));
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Get axis scale extent before niced.
+ * Item of returned array can only be number (including Infinity and NaN).
+ */
+function getScaleExtent(scale, model) {
+    var scaleType = scale.type;
+
+    var min = model.getMin();
+    var max = model.getMax();
+    var fixMin = min != null;
+    var fixMax = max != null;
+    var originalExtent = scale.getExtent();
+
+    var axisDataLen;
+    var boundaryGap;
+    var span;
+    if (scaleType === 'ordinal') {
+        axisDataLen = model.getCategories().length;
+    }
+    else {
+        boundaryGap = model.get('boundaryGap');
+        if (!isArray(boundaryGap)) {
+            boundaryGap = [boundaryGap || 0, boundaryGap || 0];
+        }
+        if (typeof boundaryGap[0] === 'boolean') {
+            if (__DEV__) {
+                console.warn('Boolean type for boundaryGap is only '
+                    + 'allowed for ordinal axis. Please use string in '
+                    + 'percentage instead, e.g., "20%". Currently, '
+                    + 'boundaryGap is set to be 0.');
+            }
+            boundaryGap = [0, 0];
+        }
+        boundaryGap[0] = parsePercent$1(boundaryGap[0], 1);
+        boundaryGap[1] = parsePercent$1(boundaryGap[1], 1);
+        span = (originalExtent[1] - originalExtent[0])
+            || Math.abs(originalExtent[0]);
+    }
+
+    // Notice: When min/max is not set (that is, when there are null/undefined,
+    // which is the most common case), these cases should be ensured:
+    // (1) For 'ordinal', show all axis.data.
+    // (2) For others:
+    //      + `boundaryGap` is applied (if min/max set, boundaryGap is
+    //      disabled).
+    //      + If `needCrossZero`, min/max should be zero, otherwise, min/max should
+    //      be the result that originalExtent enlarged by boundaryGap.
+    // (3) If no data, it should be ensured that `scale.setBlank` is set.
+
+    // FIXME
+    // (1) When min/max is 'dataMin' or 'dataMax', should boundaryGap be able to used?
+    // (2) When `needCrossZero` and all data is positive/negative, should it be ensured
+    // that the results processed by boundaryGap are positive/negative?
+
+    if (min == null) {
+        min = scaleType === 'ordinal'
+            ? (axisDataLen ? 0 : NaN)
+            : originalExtent[0] - boundaryGap[0] * span;
+    }
+    if (max == null) {
+        max = scaleType === 'ordinal'
+            ? (axisDataLen ? axisDataLen - 1 : NaN)
+            : originalExtent[1] + boundaryGap[1] * span;
+    }
+
+    if (min === 'dataMin') {
+        min = originalExtent[0];
+    }
+    else if (typeof min === 'function') {
+        min = min({
+            min: originalExtent[0],
+            max: originalExtent[1]
+        });
+    }
+
+    if (max === 'dataMax') {
+        max = originalExtent[1];
+    }
+    else if (typeof max === 'function') {
+        max = max({
+            min: originalExtent[0],
+            max: originalExtent[1]
+        });
+    }
+
+    (min == null || !isFinite(min)) && (min = NaN);
+    (max == null || !isFinite(max)) && (max = NaN);
+
+    scale.setBlank(
+        eqNaN(min)
+        || eqNaN(max)
+        || (scaleType === 'ordinal' && !scale.getOrdinalMeta().categories.length)
+    );
+
+    // Evaluate if axis needs cross zero
+    if (model.getNeedCrossZero()) {
+        // Axis is over zero and min is not set
+        if (min > 0 && max > 0 && !fixMin) {
+            min = 0;
+        }
+        // Axis is under zero and max is not set
+        if (min < 0 && max < 0 && !fixMax) {
+            max = 0;
+        }
+    }
+
+    // If bars are placed on a base axis of type time or interval account for axis boundary overflow and current axis
+    // is base axis
+    // FIXME
+    // (1) Consider support value axis, where below zero and axis `onZero` should be handled properly.
+    // (2) Refactor the logic with `barGrid`. Is it not need to `makeBarWidthAndOffsetInfo` twice with different extent?
+    //     Should not depend on series type `bar`?
+    // (3) Fix that might overlap when using dataZoom.
+    // (4) Consider other chart types using `barGrid`?
+    // See #6728, #4862, `test/bar-overflow-time-plot.html`
+    var ecModel = model.ecModel;
+    if (ecModel && (scaleType === 'time' /*|| scaleType === 'interval' */)) {
+        var barSeriesModels = prepareLayoutBarSeries('bar', ecModel);
+        var isBaseAxisAndHasBarSeries;
+
+        each$1(barSeriesModels, function (seriesModel) {
+            isBaseAxisAndHasBarSeries |= seriesModel.getBaseAxis() === model.axis;
+        });
+
+        if (isBaseAxisAndHasBarSeries) {
+            // Calculate placement of bars on axis
+            var barWidthAndOffset = makeColumnLayout(barSeriesModels);
+
+            // Adjust axis min and max to account for overflow
+            var adjustedScale = adjustScaleForOverflow(min, max, model, barWidthAndOffset);
+            min = adjustedScale.min;
+            max = adjustedScale.max;
+        }
+    }
+
+    return [min, max];
+}
+
+function adjustScaleForOverflow(min, max, model, barWidthAndOffset) {
+
+    // Get Axis Length
+    var axisExtent = model.axis.getExtent();
+    var axisLength = axisExtent[1] - axisExtent[0];
+
+    // Get bars on current base axis and calculate min and max overflow
+    var barsOnCurrentAxis = retrieveColumnLayout(barWidthAndOffset, model.axis);
+    if (barsOnCurrentAxis === undefined) {
+        return {min: min, max: max};
+    }
+
+    var minOverflow = Infinity;
+    each$1(barsOnCurrentAxis, function (item) {
+        minOverflow = Math.min(item.offset, minOverflow);
+    });
+    var maxOverflow = -Infinity;
+    each$1(barsOnCurrentAxis, function (item) {
+        maxOverflow = Math.max(item.offset + item.width, maxOverflow);
+    });
+    minOverflow = Math.abs(minOverflow);
+    maxOverflow = Math.abs(maxOverflow);
+    var totalOverFlow = minOverflow + maxOverflow;
+
+    // Calulate required buffer based on old range and overflow
+    var oldRange = max - min;
+    var oldRangePercentOfNew = (1 - (minOverflow + maxOverflow) / axisLength);
+    var overflowBuffer = ((oldRange / oldRangePercentOfNew) - oldRange);
+
+    max += overflowBuffer * (maxOverflow / totalOverFlow);
+    min -= overflowBuffer * (minOverflow / totalOverFlow);
+
+    return {min: min, max: max};
+}
+
+function niceScaleExtent(scale, model) {
+    var extent = getScaleExtent(scale, model);
+    var fixMin = model.getMin() != null;
+    var fixMax = model.getMax() != null;
+    var splitNumber = model.get('splitNumber');
+
+    if (scale.type === 'log') {
+        scale.base = model.get('logBase');
+    }
+
+    var scaleType = scale.type;
+    scale.setExtent(extent[0], extent[1]);
+    scale.niceExtent({
+        splitNumber: splitNumber,
+        fixMin: fixMin,
+        fixMax: fixMax,
+        minInterval: (scaleType === 'interval' || scaleType === 'time')
+            ? model.get('minInterval') : null,
+        maxInterval: (scaleType === 'interval' || scaleType === 'time')
+            ? model.get('maxInterval') : null
+    });
+
+    // If some one specified the min, max. And the default calculated interval
+    // is not good enough. He can specify the interval. It is often appeared
+    // in angle axis with angle 0 - 360. Interval calculated in interval scale is hard
+    // to be 60.
+    // FIXME
+    var interval = model.get('interval');
+    if (interval != null) {
+        scale.setInterval && scale.setInterval(interval);
+    }
+}
+
+/**
+ * @param {module:echarts/model/Model} model
+ * @param {string} [axisType] Default retrieve from model.type
+ * @return {module:echarts/scale/*}
+ */
+function createScaleByModel(model, axisType) {
+    axisType = axisType || model.get('type');
+    if (axisType) {
+        switch (axisType) {
+            // Buildin scale
+            case 'category':
+                return new OrdinalScale(
+                    model.getOrdinalMeta
+                        ? model.getOrdinalMeta()
+                        : model.getCategories(),
+                    [Infinity, -Infinity]
+                );
+            case 'value':
+                return new IntervalScale();
+            // Extended scale, like time and log
+            default:
+                return (Scale.getClass(axisType) || IntervalScale).create(model);
+        }
+    }
+}
+
+/**
+ * Check if the axis corss 0
+ */
+function ifAxisCrossZero(axis) {
+    var dataExtent = axis.scale.getExtent();
+    var min = dataExtent[0];
+    var max = dataExtent[1];
+    return !((min > 0 && max > 0) || (min < 0 && max < 0));
+}
+
+/**
+ * @param {module:echarts/coord/Axis} axis
+ * @return {Function} Label formatter function.
+ *         param: {number} tickValue,
+ *         param: {number} idx, the index in all ticks.
+ *                         If category axis, this param is not requied.
+ *         return: {string} label string.
+ */
+function makeLabelFormatter(axis) {
+    var labelFormatter = axis.getLabelModel().get('formatter');
+    var categoryTickStart = axis.type === 'category' ? axis.scale.getExtent()[0] : null;
+
+    if (typeof labelFormatter === 'string') {
+        labelFormatter = (function (tpl) {
+            return function (val) {
+                return tpl.replace('{value}', val != null ? val : '');
+            };
+        })(labelFormatter);
+        // Consider empty array
+        return labelFormatter;
+    }
+    else if (typeof labelFormatter === 'function') {
+        return function (tickValue, idx) {
+            // The original intention of `idx` is "the index of the tick in all ticks".
+            // But the previous implementation of category axis do not consider the
+            // `axisLabel.interval`, which cause that, for example, the `interval` is
+            // `1`, then the ticks "name5", "name7", "name9" are displayed, where the
+            // corresponding `idx` are `0`, `2`, `4`, but not `0`, `1`, `2`. So we keep
+            // the definition here for back compatibility.
+            if (categoryTickStart != null) {
+                idx = tickValue - categoryTickStart;
+            }
+            return labelFormatter(getAxisRawValue(axis, tickValue), idx);
+        };
+    }
+    else {
+        return function (tick) {
+            return axis.scale.getLabel(tick);
+        };
+    }
+}
+
+function getAxisRawValue(axis, value) {
+    // In category axis with data zoom, tick is not the original
+    // index of axis.data. So tick should not be exposed to user
+    // in category axis.
+    return axis.type === 'category' ? axis.scale.getLabel(value) : value;
+}
+
+/**
+ * @param {module:echarts/coord/Axis} axis
+ * @return {module:zrender/core/BoundingRect} Be null/undefined if no labels.
+ */
+function estimateLabelUnionRect(axis) {
+    var axisModel = axis.model;
+    var scale = axis.scale;
+
+    if (!axisModel.get('axisLabel.show') || scale.isBlank()) {
+        return;
+    }
+
+    var isCategory = axis.type === 'category';
+
+    var realNumberScaleTicks;
+    var tickCount;
+    var categoryScaleExtent = scale.getExtent();
+
+    // Optimize for large category data, avoid call `getTicks()`.
+    if (isCategory) {
+        tickCount = scale.count();
+    }
+    else {
+        realNumberScaleTicks = scale.getTicks();
+        tickCount = realNumberScaleTicks.length;
+    }
+
+    var axisLabelModel = axis.getLabelModel();
+    var labelFormatter = makeLabelFormatter(axis);
+
+    var rect;
+    var step = 1;
+    // Simple optimization for large amount of labels
+    if (tickCount > 40) {
+        step = Math.ceil(tickCount / 40);
+    }
+    for (var i = 0; i < tickCount; i += step) {
+        var tickValue = realNumberScaleTicks ? realNumberScaleTicks[i] : categoryScaleExtent[0] + i;
+        var label = labelFormatter(tickValue);
+        var unrotatedSingleRect = axisLabelModel.getTextRect(label);
+        var singleRect = rotateTextRect(unrotatedSingleRect, axisLabelModel.get('rotate') || 0);
+
+        rect ? rect.union(singleRect) : (rect = singleRect);
+    }
+
+    return rect;
+}
+
+function rotateTextRect(textRect, rotate) {
+    var rotateRadians = rotate * Math.PI / 180;
+    var boundingBox = textRect.plain();
+    var beforeWidth = boundingBox.width;
+    var beforeHeight = boundingBox.height;
+    var afterWidth = beforeWidth * Math.cos(rotateRadians) + beforeHeight * Math.sin(rotateRadians);
+    var afterHeight = beforeWidth * Math.sin(rotateRadians) + beforeHeight * Math.cos(rotateRadians);
+    var rotatedRect = new BoundingRect(boundingBox.x, boundingBox.y, afterWidth, afterHeight);
+
+    return rotatedRect;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisModelCommonMixin = {
+
+    /**
+     * @param {boolean} origin
+     * @return {number|string} min value or 'dataMin' or null/undefined (means auto) or NaN
+     */
+    getMin: function (origin) {
+        var option = this.option;
+        var min = (!origin && option.rangeStart != null)
+            ? option.rangeStart : option.min;
+
+        if (this.axis
+            && min != null
+            && min !== 'dataMin'
+            && typeof min !== 'function'
+            && !eqNaN(min)
+        ) {
+            min = this.axis.scale.parse(min);
+        }
+        return min;
+    },
+
+    /**
+     * @param {boolean} origin
+     * @return {number|string} max value or 'dataMax' or null/undefined (means auto) or NaN
+     */
+    getMax: function (origin) {
+        var option = this.option;
+        var max = (!origin && option.rangeEnd != null)
+            ? option.rangeEnd : option.max;
+
+        if (this.axis
+            && max != null
+            && max !== 'dataMax'
+            && typeof max !== 'function'
+            && !eqNaN(max)
+        ) {
+            max = this.axis.scale.parse(max);
+        }
+        return max;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    getNeedCrossZero: function () {
+        var option = this.option;
+        return (option.rangeStart != null || option.rangeEnd != null)
+            ? false : !option.scale;
+    },
+
+    /**
+     * Should be implemented by each axis model if necessary.
+     * @return {module:echarts/model/Component} coordinate system model
+     */
+    getCoordSysModel: noop,
+
+    /**
+     * @param {number} rangeStart Can only be finite number or null/undefined or NaN.
+     * @param {number} rangeEnd Can only be finite number or null/undefined or NaN.
+     */
+    setRange: function (rangeStart, rangeEnd) {
+        this.option.rangeStart = rangeStart;
+        this.option.rangeEnd = rangeEnd;
+    },
+
+    /**
+     * Reset range
+     */
+    resetRange: function () {
+        // rangeStart and rangeEnd is readonly.
+        this.option.rangeStart = this.option.rangeEnd = null;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Symbol factory
+
+/**
+ * Triangle shape
+ * @inner
+ */
+var Triangle = extendShape({
+    type: 'triangle',
+    shape: {
+        cx: 0,
+        cy: 0,
+        width: 0,
+        height: 0
+    },
+    buildPath: function (path, shape) {
+        var cx = shape.cx;
+        var cy = shape.cy;
+        var width = shape.width / 2;
+        var height = shape.height / 2;
+        path.moveTo(cx, cy - height);
+        path.lineTo(cx + width, cy + height);
+        path.lineTo(cx - width, cy + height);
+        path.closePath();
+    }
+});
+
+/**
+ * Diamond shape
+ * @inner
+ */
+var Diamond = extendShape({
+    type: 'diamond',
+    shape: {
+        cx: 0,
+        cy: 0,
+        width: 0,
+        height: 0
+    },
+    buildPath: function (path, shape) {
+        var cx = shape.cx;
+        var cy = shape.cy;
+        var width = shape.width / 2;
+        var height = shape.height / 2;
+        path.moveTo(cx, cy - height);
+        path.lineTo(cx + width, cy);
+        path.lineTo(cx, cy + height);
+        path.lineTo(cx - width, cy);
+        path.closePath();
+    }
+});
+
+/**
+ * Pin shape
+ * @inner
+ */
+var Pin = extendShape({
+    type: 'pin',
+    shape: {
+        // x, y on the cusp
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    buildPath: function (path, shape) {
+        var x = shape.x;
+        var y = shape.y;
+        var w = shape.width / 5 * 3;
+        // Height must be larger than width
+        var h = Math.max(w, shape.height);
+        var r = w / 2;
+
+        // Dist on y with tangent point and circle center
+        var dy = r * r / (h - r);
+        var cy = y - h + r + dy;
+        var angle = Math.asin(dy / r);
+        // Dist on x with tangent point and circle center
+        var dx = Math.cos(angle) * r;
+
+        var tanX = Math.sin(angle);
+        var tanY = Math.cos(angle);
+
+        var cpLen = r * 0.6;
+        var cpLen2 = r * 0.7;
+
+        path.moveTo(x - dx, cy + dy);
+
+        path.arc(
+            x, cy, r,
+            Math.PI - angle,
+            Math.PI * 2 + angle
+        );
+        path.bezierCurveTo(
+            x + dx - tanX * cpLen, cy + dy + tanY * cpLen,
+            x, y - cpLen2,
+            x, y
+        );
+        path.bezierCurveTo(
+            x, y - cpLen2,
+            x - dx + tanX * cpLen, cy + dy + tanY * cpLen,
+            x - dx, cy + dy
+        );
+        path.closePath();
+    }
+});
+
+/**
+ * Arrow shape
+ * @inner
+ */
+var Arrow = extendShape({
+
+    type: 'arrow',
+
+    shape: {
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var height = shape.height;
+        var width = shape.width;
+        var x = shape.x;
+        var y = shape.y;
+        var dx = width / 3 * 2;
+        ctx.moveTo(x, y);
+        ctx.lineTo(x + dx, y + height);
+        ctx.lineTo(x, y + height / 4 * 3);
+        ctx.lineTo(x - dx, y + height);
+        ctx.lineTo(x, y);
+        ctx.closePath();
+    }
+});
+
+/**
+ * Map of path contructors
+ * @type {Object.<string, module:zrender/graphic/Path>}
+ */
+var symbolCtors = {
+
+    line: Line,
+
+    rect: Rect,
+
+    roundRect: Rect,
+
+    square: Rect,
+
+    circle: Circle,
+
+    diamond: Diamond,
+
+    pin: Pin,
+
+    arrow: Arrow,
+
+    triangle: Triangle
+};
+
+var symbolShapeMakers = {
+
+    line: function (x, y, w, h, shape) {
+        // FIXME
+        shape.x1 = x;
+        shape.y1 = y + h / 2;
+        shape.x2 = x + w;
+        shape.y2 = y + h / 2;
+    },
+
+    rect: function (x, y, w, h, shape) {
+        shape.x = x;
+        shape.y = y;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    roundRect: function (x, y, w, h, shape) {
+        shape.x = x;
+        shape.y = y;
+        shape.width = w;
+        shape.height = h;
+        shape.r = Math.min(w, h) / 4;
+    },
+
+    square: function (x, y, w, h, shape) {
+        var size = Math.min(w, h);
+        shape.x = x;
+        shape.y = y;
+        shape.width = size;
+        shape.height = size;
+    },
+
+    circle: function (x, y, w, h, shape) {
+        // Put circle in the center of square
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.r = Math.min(w, h) / 2;
+    },
+
+    diamond: function (x, y, w, h, shape) {
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    pin: function (x, y, w, h, shape) {
+        shape.x = x + w / 2;
+        shape.y = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    arrow: function (x, y, w, h, shape) {
+        shape.x = x + w / 2;
+        shape.y = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    },
+
+    triangle: function (x, y, w, h, shape) {
+        shape.cx = x + w / 2;
+        shape.cy = y + h / 2;
+        shape.width = w;
+        shape.height = h;
+    }
+};
+
+var symbolBuildProxies = {};
+each$1(symbolCtors, function (Ctor, name) {
+    symbolBuildProxies[name] = new Ctor();
+});
+
+var SymbolClz = extendShape({
+
+    type: 'symbol',
+
+    shape: {
+        symbolType: '',
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    },
+
+    beforeBrush: function () {
+        var style = this.style;
+        var shape = this.shape;
+        // FIXME
+        if (shape.symbolType === 'pin' && style.textPosition === 'inside') {
+            style.textPosition = ['50%', '40%'];
+            style.textAlign = 'center';
+            style.textVerticalAlign = 'middle';
+        }
+    },
+
+    buildPath: function (ctx, shape, inBundle) {
+        var symbolType = shape.symbolType;
+        var proxySymbol = symbolBuildProxies[symbolType];
+        if (shape.symbolType !== 'none') {
+            if (!proxySymbol) {
+                // Default rect
+                symbolType = 'rect';
+                proxySymbol = symbolBuildProxies[symbolType];
+            }
+            symbolShapeMakers[symbolType](
+                shape.x, shape.y, shape.width, shape.height, proxySymbol.shape
+            );
+            proxySymbol.buildPath(ctx, proxySymbol.shape, inBundle);
+        }
+    }
+});
+
+// Provide setColor helper method to avoid determine if set the fill or stroke outside
+function symbolPathSetColor(color, innerColor) {
+    if (this.type !== 'image') {
+        var symbolStyle = this.style;
+        var symbolShape = this.shape;
+        if (symbolShape && symbolShape.symbolType === 'line') {
+            symbolStyle.stroke = color;
+        }
+        else if (this.__isEmptyBrush) {
+            symbolStyle.stroke = color;
+            symbolStyle.fill = innerColor || '#fff';
+        }
+        else {
+            // FIXME 判断图形默认是填充还是描边，使用 onlyStroke ?
+            symbolStyle.fill && (symbolStyle.fill = color);
+            symbolStyle.stroke && (symbolStyle.stroke = color);
+        }
+        this.dirty(false);
+    }
+}
+
+/**
+ * Create a symbol element with given symbol configuration: shape, x, y, width, height, color
+ * @param {string} symbolType
+ * @param {number} x
+ * @param {number} y
+ * @param {number} w
+ * @param {number} h
+ * @param {string} color
+ * @param {boolean} [keepAspect=false] whether to keep the ratio of w/h,
+ *                            for path and image only.
+ */
+function createSymbol(symbolType, x, y, w, h, color, keepAspect) {
+    // TODO Support image object, DynamicImage.
+
+    var isEmpty = symbolType.indexOf('empty') === 0;
+    if (isEmpty) {
+        symbolType = symbolType.substr(5, 1).toLowerCase() + symbolType.substr(6);
+    }
+    var symbolPath;
+
+    if (symbolType.indexOf('image://') === 0) {
+        symbolPath = makeImage(
+            symbolType.slice(8),
+            new BoundingRect(x, y, w, h),
+            keepAspect ? 'center' : 'cover'
+        );
+    }
+    else if (symbolType.indexOf('path://') === 0) {
+        symbolPath = makePath(
+            symbolType.slice(7),
+            {},
+            new BoundingRect(x, y, w, h),
+            keepAspect ? 'center' : 'cover'
+        );
+    }
+    else {
+        symbolPath = new SymbolClz({
+            shape: {
+                symbolType: symbolType,
+                x: x,
+                y: y,
+                width: w,
+                height: h
+            }
+        });
+    }
+
+    symbolPath.__isEmptyBrush = isEmpty;
+
+    symbolPath.setColor = symbolPathSetColor;
+
+    symbolPath.setColor(color);
+
+    return symbolPath;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// import createGraphFromNodeEdge from './chart/helper/createGraphFromNodeEdge';
+/**
+ * Create a muti dimension List structure from seriesModel.
+ * @param  {module:echarts/model/Model} seriesModel
+ * @return {module:echarts/data/List} list
+ */
+function createList(seriesModel) {
+    return createListFromArray(seriesModel.getSource(), seriesModel);
+}
+
+var dataStack$1 = {
+    isDimensionStacked: isDimensionStacked,
+    enableDataStack: enableDataStack,
+    getStackedDimension: getStackedDimension
+};
+
+/**
+ * Create scale
+ * @param {Array.<number>} dataExtent
+ * @param {Object|module:echarts/Model} option
+ */
+function createScale(dataExtent, option) {
+    var axisModel = option;
+    if (!Model.isInstance(option)) {
+        axisModel = new Model(option);
+        mixin(axisModel, axisModelCommonMixin);
+    }
+
+    var scale = createScaleByModel(axisModel);
+    scale.setExtent(dataExtent[0], dataExtent[1]);
+
+    niceScaleExtent(scale, axisModel);
+    return scale;
+}
+
+/**
+ * Mixin common methods to axis model,
+ *
+ * Inlcude methods
+ * `getFormattedLabels() => Array.<string>`
+ * `getCategories() => Array.<string>`
+ * `getMin(origin: boolean) => number`
+ * `getMax(origin: boolean) => number`
+ * `getNeedCrossZero() => boolean`
+ * `setRange(start: number, end: number)`
+ * `resetRange()`
+ */
+function mixinAxisModelCommonMethods(Model$$1) {
+    mixin(Model$$1, axisModelCommonMixin);
+}
+
+var helper = (Object.freeze || Object)({
+	createList: createList,
+	getLayoutRect: getLayoutRect,
+	dataStack: dataStack$1,
+	createScale: createScale,
+	mixinAxisModelCommonMethods: mixinAxisModelCommonMethods,
+	completeDimensions: completeDimensions,
+	createDimensions: createDimensions,
+	createSymbol: createSymbol
+});
+
+var EPSILON$3 = 1e-8;
+
+function isAroundEqual$1(a, b) {
+    return Math.abs(a - b) < EPSILON$3;
+}
+
+function contain$1(points, x, y) {
+    var w = 0;
+    var p = points[0];
+
+    if (!p) {
+        return false;
+    }
+
+    for (var i = 1; i < points.length; i++) {
+        var p2 = points[i];
+        w += windingLine(p[0], p[1], p2[0], p2[1], x, y);
+        p = p2;
+    }
+
+    // Close polygon
+    var p0 = points[0];
+    if (!isAroundEqual$1(p[0], p0[0]) || !isAroundEqual$1(p[1], p0[1])) {
+        w += windingLine(p[0], p[1], p0[0], p0[1], x, y);
+    }
+
+    return w !== 0;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/coord/geo/Region
+ */
+
+/**
+ * @param {string} name
+ * @param {Array} geometries
+ * @param {Array.<number>} cp
+ */
+function Region(name, geometries, cp) {
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.name = name;
+
+    /**
+     * @type {Array.<Array>}
+     * @readOnly
+     */
+    this.geometries = geometries;
+
+    if (!cp) {
+        var rect = this.getBoundingRect();
+        cp = [
+            rect.x + rect.width / 2,
+            rect.y + rect.height / 2
+        ];
+    }
+    else {
+        cp = [cp[0], cp[1]];
+    }
+    /**
+     * @type {Array.<number>}
+     */
+    this.center = cp;
+}
+
+Region.prototype = {
+
+    constructor: Region,
+
+    properties: null,
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getBoundingRect: function () {
+        var rect = this._rect;
+        if (rect) {
+            return rect;
+        }
+
+        var MAX_NUMBER = Number.MAX_VALUE;
+        var min$$1 = [MAX_NUMBER, MAX_NUMBER];
+        var max$$1 = [-MAX_NUMBER, -MAX_NUMBER];
+        var min2 = [];
+        var max2 = [];
+        var geometries = this.geometries;
+        for (var i = 0; i < geometries.length; i++) {
+            // Only support polygon
+            if (geometries[i].type !== 'polygon') {
+                continue;
+            }
+            // Doesn't consider hole
+            var exterior = geometries[i].exterior;
+            fromPoints(exterior, min2, max2);
+            min(min$$1, min$$1, min2);
+            max(max$$1, max$$1, max2);
+        }
+        // No data
+        if (i === 0) {
+            min$$1[0] = min$$1[1] = max$$1[0] = max$$1[1] = 0;
+        }
+
+        return (this._rect = new BoundingRect(
+            min$$1[0], min$$1[1], max$$1[0] - min$$1[0], max$$1[1] - min$$1[1]
+        ));
+    },
+
+    /**
+     * @param {<Array.<number>} coord
+     * @return {boolean}
+     */
+    contain: function (coord) {
+        var rect = this.getBoundingRect();
+        var geometries = this.geometries;
+        if (!rect.contain(coord[0], coord[1])) {
+            return false;
+        }
+        loopGeo: for (var i = 0, len$$1 = geometries.length; i < len$$1; i++) {
+            // Only support polygon.
+            if (geometries[i].type !== 'polygon') {
+                continue;
+            }
+            var exterior = geometries[i].exterior;
+            var interiors = geometries[i].interiors;
+            if (contain$1(exterior, coord[0], coord[1])) {
+                // Not in the region if point is in the hole.
+                for (var k = 0; k < (interiors ? interiors.length : 0); k++) {
+                    if (contain$1(interiors[k])) {
+                        continue loopGeo;
+                    }
+                }
+                return true;
+            }
+        }
+        return false;
+    },
+
+    transformTo: function (x, y, width, height) {
+        var rect = this.getBoundingRect();
+        var aspect = rect.width / rect.height;
+        if (!width) {
+            width = aspect * height;
+        }
+        else if (!height) {
+            height = width / aspect ;
+        }
+        var target = new BoundingRect(x, y, width, height);
+        var transform = rect.calculateTransform(target);
+        var geometries = this.geometries;
+        for (var i = 0; i < geometries.length; i++) {
+            // Only support polygon.
+            if (geometries[i].type !== 'polygon') {
+                continue;
+            }
+            var exterior = geometries[i].exterior;
+            var interiors = geometries[i].interiors;
+            for (var p = 0; p < exterior.length; p++) {
+                applyTransform(exterior[p], exterior[p], transform);
+            }
+            for (var h = 0; h < (interiors ? interiors.length : 0); h++) {
+                for (var p = 0; p < interiors[h].length; p++) {
+                    applyTransform(interiors[h][p], interiors[h][p], transform);
+                }
+            }
+        }
+        rect = this._rect;
+        rect.copy(target);
+        // Update center
+        this.center = [
+            rect.x + rect.width / 2,
+            rect.y + rect.height / 2
+        ];
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Parse and decode geo json
+ * @module echarts/coord/geo/parseGeoJson
+ */
+
+function decode(json) {
+    if (!json.UTF8Encoding) {
+        return json;
+    }
+    var encodeScale = json.UTF8Scale;
+    if (encodeScale == null) {
+        encodeScale = 1024;
+    }
+
+    var features = json.features;
+
+    for (var f = 0; f < features.length; f++) {
+        var feature = features[f];
+        var geometry = feature.geometry;
+        var coordinates = geometry.coordinates;
+        var encodeOffsets = geometry.encodeOffsets;
+
+        for (var c = 0; c < coordinates.length; c++) {
+            var coordinate = coordinates[c];
+
+            if (geometry.type === 'Polygon') {
+                coordinates[c] = decodePolygon(
+                    coordinate,
+                    encodeOffsets[c],
+                    encodeScale
+                );
+            }
+            else if (geometry.type === 'MultiPolygon') {
+                for (var c2 = 0; c2 < coordinate.length; c2++) {
+                    var polygon = coordinate[c2];
+                    coordinate[c2] = decodePolygon(
+                        polygon,
+                        encodeOffsets[c][c2],
+                        encodeScale
+                    );
+                }
+            }
+        }
+    }
+    // Has been decoded
+    json.UTF8Encoding = false;
+    return json;
+}
+
+function decodePolygon(coordinate, encodeOffsets, encodeScale) {
+    var result = [];
+    var prevX = encodeOffsets[0];
+    var prevY = encodeOffsets[1];
+
+    for (var i = 0; i < coordinate.length; i += 2) {
+        var x = coordinate.charCodeAt(i) - 64;
+        var y = coordinate.charCodeAt(i + 1) - 64;
+        // ZigZag decoding
+        x = (x >> 1) ^ (-(x & 1));
+        y = (y >> 1) ^ (-(y & 1));
+        // Delta deocding
+        x += prevX;
+        y += prevY;
+
+        prevX = x;
+        prevY = y;
+        // Dequantize
+        result.push([x / encodeScale, y / encodeScale]);
+    }
+
+    return result;
+}
+
+/**
+ * @alias module:echarts/coord/geo/parseGeoJson
+ * @param {Object} geoJson
+ * @return {module:zrender/container/Group}
+ */
+var parseGeoJson$1 = function (geoJson) {
+
+    decode(geoJson);
+
+    return map(filter(geoJson.features, function (featureObj) {
+        // Output of mapshaper may have geometry null
+        return featureObj.geometry
+            && featureObj.properties
+            && featureObj.geometry.coordinates.length > 0;
+    }), function (featureObj) {
+        var properties = featureObj.properties;
+        var geo = featureObj.geometry;
+
+        var coordinates = geo.coordinates;
+
+        var geometries = [];
+        if (geo.type === 'Polygon') {
+            geometries.push({
+                type: 'polygon',
+                // According to the GeoJSON specification.
+                // First must be exterior, and the rest are all interior(holes).
+                exterior: coordinates[0],
+                interiors: coordinates.slice(1)
+            });
+        }
+        if (geo.type === 'MultiPolygon') {
+            each$1(coordinates, function (item) {
+                if (item[0]) {
+                    geometries.push({
+                        type: 'polygon',
+                        exterior: item[0],
+                        interiors: item.slice(1)
+                    });
+                }
+            });
+        }
+
+        var region = new Region(
+            properties.name,
+            geometries,
+            properties.cp
+        );
+        region.properties = properties;
+        return region;
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$6 = makeInner();
+
+/**
+ * @param {module:echats/coord/Axis} axis
+ * @return {Object} {
+ *     labels: [{
+ *         formattedLabel: string,
+ *         rawLabel: string,
+ *         tickValue: number
+ *     }, ...],
+ *     labelCategoryInterval: number
+ * }
+ */
+function createAxisLabels(axis) {
+    // Only ordinal scale support tick interval
+    return axis.type === 'category'
+        ? makeCategoryLabels(axis)
+        : makeRealNumberLabels(axis);
+}
+
+/**
+ * @param {module:echats/coord/Axis} axis
+ * @param {module:echarts/model/Model} tickModel For example, can be axisTick, splitLine, splitArea.
+ * @return {Object} {
+ *     ticks: Array.<number>
+ *     tickCategoryInterval: number
+ * }
+ */
+function createAxisTicks(axis, tickModel) {
+    // Only ordinal scale support tick interval
+    return axis.type === 'category'
+        ? makeCategoryTicks(axis, tickModel)
+        : {ticks: axis.scale.getTicks()};
+}
+
+function makeCategoryLabels(axis) {
+    var labelModel = axis.getLabelModel();
+    var result = makeCategoryLabelsActually(axis, labelModel);
+
+    return (!labelModel.get('show') || axis.scale.isBlank())
+        ? {labels: [], labelCategoryInterval: result.labelCategoryInterval}
+        : result;
+}
+
+function makeCategoryLabelsActually(axis, labelModel) {
+    var labelsCache = getListCache(axis, 'labels');
+    var optionLabelInterval = getOptionCategoryInterval(labelModel);
+    var result = listCacheGet(labelsCache, optionLabelInterval);
+
+    if (result) {
+        return result;
+    }
+
+    var labels;
+    var numericLabelInterval;
+
+    if (isFunction$1(optionLabelInterval)) {
+        labels = makeLabelsByCustomizedCategoryInterval(axis, optionLabelInterval);
+    }
+    else {
+        numericLabelInterval = optionLabelInterval === 'auto'
+            ? makeAutoCategoryInterval(axis) : optionLabelInterval;
+        labels = makeLabelsByNumericCategoryInterval(axis, numericLabelInterval);
+    }
+
+    // Cache to avoid calling interval function repeatly.
+    return listCacheSet(labelsCache, optionLabelInterval, {
+        labels: labels, labelCategoryInterval: numericLabelInterval
+    });
+}
+
+function makeCategoryTicks(axis, tickModel) {
+    var ticksCache = getListCache(axis, 'ticks');
+    var optionTickInterval = getOptionCategoryInterval(tickModel);
+    var result = listCacheGet(ticksCache, optionTickInterval);
+
+    if (result) {
+        return result;
+    }
+
+    var ticks;
+    var tickCategoryInterval;
+
+    // Optimize for the case that large category data and no label displayed,
+    // we should not return all ticks.
+    if (!tickModel.get('show') || axis.scale.isBlank()) {
+        ticks = [];
+    }
+
+    if (isFunction$1(optionTickInterval)) {
+        ticks = makeLabelsByCustomizedCategoryInterval(axis, optionTickInterval, true);
+    }
+    // Always use label interval by default despite label show. Consider this
+    // scenario, Use multiple grid with the xAxis sync, and only one xAxis shows
+    // labels. `splitLine` and `axisTick` should be consistent in this case.
+    else if (optionTickInterval === 'auto') {
+        var labelsResult = makeCategoryLabelsActually(axis, axis.getLabelModel());
+        tickCategoryInterval = labelsResult.labelCategoryInterval;
+        ticks = map(labelsResult.labels, function (labelItem) {
+            return labelItem.tickValue;
+        });
+    }
+    else {
+        tickCategoryInterval = optionTickInterval;
+        ticks = makeLabelsByNumericCategoryInterval(axis, tickCategoryInterval, true);
+    }
+
+    // Cache to avoid calling interval function repeatly.
+    return listCacheSet(ticksCache, optionTickInterval, {
+        ticks: ticks, tickCategoryInterval: tickCategoryInterval
+    });
+}
+
+function makeRealNumberLabels(axis) {
+    var ticks = axis.scale.getTicks();
+    var labelFormatter = makeLabelFormatter(axis);
+    return {
+        labels: map(ticks, function (tickValue, idx) {
+            return {
+                formattedLabel: labelFormatter(tickValue, idx),
+                rawLabel: axis.scale.getLabel(tickValue),
+                tickValue: tickValue
+            };
+        })
+    };
+}
+
+// Large category data calculation is performence sensitive, and ticks and label
+// probably be fetched by multiple times. So we cache the result.
+// axis is created each time during a ec process, so we do not need to clear cache.
+function getListCache(axis, prop) {
+    // Because key can be funciton, and cache size always be small, we use array cache.
+    return inner$6(axis)[prop] || (inner$6(axis)[prop] = []);
+}
+
+function listCacheGet(cache, key) {
+    for (var i = 0; i < cache.length; i++) {
+        if (cache[i].key === key) {
+            return cache[i].value;
+        }
+    }
+}
+
+function listCacheSet(cache, key, value) {
+    cache.push({key: key, value: value});
+    return value;
+}
+
+function makeAutoCategoryInterval(axis) {
+    var result = inner$6(axis).autoInterval;
+    return result != null
+        ? result
+        : (inner$6(axis).autoInterval = axis.calculateCategoryInterval());
+}
+
+/**
+ * Calculate interval for category axis ticks and labels.
+ * To get precise result, at least one of `getRotate` and `isHorizontal`
+ * should be implemented in axis.
+ */
+function calculateCategoryInterval(axis) {
+    var params = fetchAutoCategoryIntervalCalculationParams(axis);
+    var labelFormatter = makeLabelFormatter(axis);
+    var rotation = (params.axisRotate - params.labelRotate) / 180 * Math.PI;
+
+    var ordinalScale = axis.scale;
+    var ordinalExtent = ordinalScale.getExtent();
+    // Providing this method is for optimization:
+    // avoid generating a long array by `getTicks`
+    // in large category data case.
+    var tickCount = ordinalScale.count();
+
+    if (ordinalExtent[1] - ordinalExtent[0] < 1) {
+        return 0;
+    }
+
+    var step = 1;
+    // Simple optimization. Empirical value: tick count should less than 40.
+    if (tickCount > 40) {
+        step = Math.max(1, Math.floor(tickCount / 40));
+    }
+    var tickValue = ordinalExtent[0];
+    var unitSpan = axis.dataToCoord(tickValue + 1) - axis.dataToCoord(tickValue);
+    var unitW = Math.abs(unitSpan * Math.cos(rotation));
+    var unitH = Math.abs(unitSpan * Math.sin(rotation));
+
+    var maxW = 0;
+    var maxH = 0;
+
+    // Caution: Performance sensitive for large category data.
+    // Consider dataZoom, we should make appropriate step to avoid O(n) loop.
+    for (; tickValue <= ordinalExtent[1]; tickValue += step) {
+        var width = 0;
+        var height = 0;
+
+        // Polar is also calculated in assumptive linear layout here.
+        // Not precise, do not consider align and vertical align
+        // and each distance from axis line yet.
+        var rect = getBoundingRect(
+            labelFormatter(tickValue), params.font, 'center', 'top'
+        );
+        // Magic number
+        width = rect.width * 1.3;
+        height = rect.height * 1.3;
+
+        // Min size, void long loop.
+        maxW = Math.max(maxW, width, 7);
+        maxH = Math.max(maxH, height, 7);
+    }
+
+    var dw = maxW / unitW;
+    var dh = maxH / unitH;
+    // 0/0 is NaN, 1/0 is Infinity.
+    isNaN(dw) && (dw = Infinity);
+    isNaN(dh) && (dh = Infinity);
+    var interval = Math.max(0, Math.floor(Math.min(dw, dh)));
+
+    var cache = inner$6(axis.model);
+    var lastAutoInterval = cache.lastAutoInterval;
+    var lastTickCount = cache.lastTickCount;
+
+    // Use cache to keep interval stable while moving zoom window,
+    // otherwise the calculated interval might jitter when the zoom
+    // window size is close to the interval-changing size.
+    if (lastAutoInterval != null
+        && lastTickCount != null
+        && Math.abs(lastAutoInterval - interval) <= 1
+        && Math.abs(lastTickCount - tickCount) <= 1
+        // Always choose the bigger one, otherwise the critical
+        // point is not the same when zooming in or zooming out.
+        && lastAutoInterval > interval
+    ) {
+        interval = lastAutoInterval;
+    }
+    // Only update cache if cache not used, otherwise the
+    // changing of interval is too insensitive.
+    else {
+        cache.lastTickCount = tickCount;
+        cache.lastAutoInterval = interval;
+    }
+
+    return interval;
+}
+
+function fetchAutoCategoryIntervalCalculationParams(axis) {
+    var labelModel = axis.getLabelModel();
+    return {
+        axisRotate: axis.getRotate
+            ? axis.getRotate()
+            : (axis.isHorizontal && !axis.isHorizontal())
+            ? 90
+            : 0,
+        labelRotate: labelModel.get('rotate') || 0,
+        font: labelModel.getFont()
+    };
+}
+
+function makeLabelsByNumericCategoryInterval(axis, categoryInterval, onlyTick) {
+    var labelFormatter = makeLabelFormatter(axis);
+    var ordinalScale = axis.scale;
+    var ordinalExtent = ordinalScale.getExtent();
+    var labelModel = axis.getLabelModel();
+    var result = [];
+
+    // TODO: axisType: ordinalTime, pick the tick from each month/day/year/...
+
+    var step = Math.max((categoryInterval || 0) + 1, 1);
+    var startTick = ordinalExtent[0];
+    var tickCount = ordinalScale.count();
+
+    // Calculate start tick based on zero if possible to keep label consistent
+    // while zooming and moving while interval > 0. Otherwise the selection
+    // of displayable ticks and symbols probably keep changing.
+    // 3 is empirical value.
+    if (startTick !== 0 && step > 1 && tickCount / step > 2) {
+        startTick = Math.round(Math.ceil(startTick / step) * step);
+    }
+
+    // (1) Only add min max label here but leave overlap checking
+    // to render stage, which also ensure the returned list
+    // suitable for splitLine and splitArea rendering.
+    // (2) Scales except category always contain min max label so
+    // do not need to perform this process.
+    var showMinMax = {
+        min: labelModel.get('showMinLabel'),
+        max: labelModel.get('showMaxLabel')
+    };
+
+    if (showMinMax.min && startTick !== ordinalExtent[0]) {
+        addItem(ordinalExtent[0]);
+    }
+
+    // Optimize: avoid generating large array by `ordinalScale.getTicks()`.
+    var tickValue = startTick;
+    for (; tickValue <= ordinalExtent[1]; tickValue += step) {
+        addItem(tickValue);
+    }
+
+    if (showMinMax.max && tickValue !== ordinalExtent[1]) {
+        addItem(ordinalExtent[1]);
+    }
+
+    function addItem(tVal) {
+        result.push(onlyTick
+            ? tVal
+            : {
+                formattedLabel: labelFormatter(tVal),
+                rawLabel: ordinalScale.getLabel(tVal),
+                tickValue: tVal
+            }
+        );
+    }
+
+    return result;
+}
+
+// When interval is function, the result `false` means ignore the tick.
+// It is time consuming for large category data.
+function makeLabelsByCustomizedCategoryInterval(axis, categoryInterval, onlyTick) {
+    var ordinalScale = axis.scale;
+    var labelFormatter = makeLabelFormatter(axis);
+    var result = [];
+
+    each$1(ordinalScale.getTicks(), function (tickValue) {
+        var rawLabel = ordinalScale.getLabel(tickValue);
+        if (categoryInterval(tickValue, rawLabel)) {
+            result.push(onlyTick
+                ? tickValue
+                : {
+                    formattedLabel: labelFormatter(tickValue),
+                    rawLabel: rawLabel,
+                    tickValue: tickValue
+                }
+            );
+        }
+    });
+
+    return result;
+}
+
+// Can be null|'auto'|number|function
+function getOptionCategoryInterval(model) {
+    var interval = model.get('interval');
+    return interval == null ? 'auto' : interval;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var NORMALIZED_EXTENT = [0, 1];
+
+/**
+ * Base class of Axis.
+ * @constructor
+ */
+var Axis = function (dim, scale, extent) {
+
+    /**
+     * Axis dimension. Such as 'x', 'y', 'z', 'angle', 'radius'.
+     * @type {string}
+     */
+    this.dim = dim;
+
+    /**
+     * Axis scale
+     * @type {module:echarts/coord/scale/*}
+     */
+    this.scale = scale;
+
+    /**
+     * @type {Array.<number>}
+     * @private
+     */
+    this._extent = extent || [0, 0];
+
+    /**
+     * @type {boolean}
+     */
+    this.inverse = false;
+
+    /**
+     * Usually true when axis has a ordinal scale
+     * @type {boolean}
+     */
+    this.onBand = false;
+};
+
+Axis.prototype = {
+
+    constructor: Axis,
+
+    /**
+     * If axis extent contain given coord
+     * @param {number} coord
+     * @return {boolean}
+     */
+    contain: function (coord) {
+        var extent = this._extent;
+        var min = Math.min(extent[0], extent[1]);
+        var max = Math.max(extent[0], extent[1]);
+        return coord >= min && coord <= max;
+    },
+
+    /**
+     * If axis extent contain given data
+     * @param {number} data
+     * @return {boolean}
+     */
+    containData: function (data) {
+        return this.contain(this.dataToCoord(data));
+    },
+
+    /**
+     * Get coord extent.
+     * @return {Array.<number>}
+     */
+    getExtent: function () {
+        return this._extent.slice();
+    },
+
+    /**
+     * Get precision used for formatting
+     * @param {Array.<number>} [dataExtent]
+     * @return {number}
+     */
+    getPixelPrecision: function (dataExtent) {
+        return getPixelPrecision(
+            dataExtent || this.scale.getExtent(),
+            this._extent
+        );
+    },
+
+    /**
+     * Set coord extent
+     * @param {number} start
+     * @param {number} end
+     */
+    setExtent: function (start, end) {
+        var extent = this._extent;
+        extent[0] = start;
+        extent[1] = end;
+    },
+
+    /**
+     * Convert data to coord. Data is the rank if it has an ordinal scale
+     * @param {number} data
+     * @param  {boolean} clamp
+     * @return {number}
+     */
+    dataToCoord: function (data, clamp) {
+        var extent = this._extent;
+        var scale = this.scale;
+        data = scale.normalize(data);
+
+        if (this.onBand && scale.type === 'ordinal') {
+            extent = extent.slice();
+            fixExtentWithBands(extent, scale.count());
+        }
+
+        return linearMap(data, NORMALIZED_EXTENT, extent, clamp);
+    },
+
+    /**
+     * Convert coord to data. Data is the rank if it has an ordinal scale
+     * @param {number} coord
+     * @param  {boolean} clamp
+     * @return {number}
+     */
+    coordToData: function (coord, clamp) {
+        var extent = this._extent;
+        var scale = this.scale;
+
+        if (this.onBand && scale.type === 'ordinal') {
+            extent = extent.slice();
+            fixExtentWithBands(extent, scale.count());
+        }
+
+        var t = linearMap(coord, extent, NORMALIZED_EXTENT, clamp);
+
+        return this.scale.scale(t);
+    },
+
+    /**
+     * Convert pixel point to data in axis
+     * @param {Array.<number>} point
+     * @param  {boolean} clamp
+     * @return {number} data
+     */
+    pointToData: function (point, clamp) {
+        // Should be implemented in derived class if necessary.
+    },
+
+    /**
+     * Different from `zrUtil.map(axis.getTicks(), axis.dataToCoord, axis)`,
+     * `axis.getTicksCoords` considers `onBand`, which is used by
+     * `boundaryGap:true` of category axis and splitLine and splitArea.
+     * @param {Object} [opt]
+     * @param {number} [opt.tickModel=axis.model.getModel('axisTick')]
+     * @param {boolean} [opt.clamp] If `true`, the first and the last
+     *        tick must be at the axis end points. Otherwise, clip ticks
+     *        that outside the axis extent.
+     * @return {Array.<Object>} [{
+     *     coord: ...,
+     *     tickValue: ...
+     * }, ...]
+     */
+    getTicksCoords: function (opt) {
+        opt = opt || {};
+
+        var tickModel = opt.tickModel || this.getTickModel();
+
+        var result = createAxisTicks(this, tickModel);
+        var ticks = result.ticks;
+
+        var ticksCoords = map(ticks, function (tickValue) {
+            return {
+                coord: this.dataToCoord(tickValue),
+                tickValue: tickValue
+            };
+        }, this);
+
+        var alignWithLabel = tickModel.get('alignWithLabel');
+        fixOnBandTicksCoords(
+            this, ticksCoords, result.tickCategoryInterval, alignWithLabel, opt.clamp
+        );
+
+        return ticksCoords;
+    },
+
+    /**
+     * @return {Array.<Object>} [{
+     *     formattedLabel: string,
+     *     rawLabel: axis.scale.getLabel(tickValue)
+     *     tickValue: number
+     * }, ...]
+     */
+    getViewLabels: function () {
+        return createAxisLabels(this).labels;
+    },
+
+    /**
+     * @return {module:echarts/coord/model/Model}
+     */
+    getLabelModel: function () {
+        return this.model.getModel('axisLabel');
+    },
+
+    /**
+     * Notice here we only get the default tick model. For splitLine
+     * or splitArea, we should pass the splitLineModel or splitAreaModel
+     * manually when calling `getTicksCoords`.
+     * In GL, this method may be overrided to:
+     * `axisModel.getModel('axisTick', grid3DModel.getModel('axisTick'));`
+     * @return {module:echarts/coord/model/Model}
+     */
+    getTickModel: function () {
+        return this.model.getModel('axisTick');
+    },
+
+    /**
+     * Get width of band
+     * @return {number}
+     */
+    getBandWidth: function () {
+        var axisExtent = this._extent;
+        var dataExtent = this.scale.getExtent();
+
+        var len = dataExtent[1] - dataExtent[0] + (this.onBand ? 1 : 0);
+        // Fix #2728, avoid NaN when only one data.
+        len === 0 && (len = 1);
+
+        var size = Math.abs(axisExtent[1] - axisExtent[0]);
+
+        return Math.abs(size) / len;
+    },
+
+    /**
+     * @abstract
+     * @return {boolean} Is horizontal
+     */
+    isHorizontal: null,
+
+    /**
+     * @abstract
+     * @return {number} Get axis rotate, by degree.
+     */
+    getRotate: null,
+
+    /**
+     * Only be called in category axis.
+     * Can be overrided, consider other axes like in 3D.
+     * @return {number} Auto interval for cateogry axis tick and label
+     */
+    calculateCategoryInterval: function () {
+        return calculateCategoryInterval(this);
+    }
+
+};
+
+function fixExtentWithBands(extent, nTick) {
+    var size = extent[1] - extent[0];
+    var len = nTick;
+    var margin = size / len / 2;
+    extent[0] += margin;
+    extent[1] -= margin;
+}
+
+// If axis has labels [1, 2, 3, 4]. Bands on the axis are
+// |---1---|---2---|---3---|---4---|.
+// So the displayed ticks and splitLine/splitArea should between
+// each data item, otherwise cause misleading (e.g., split tow bars
+// of a single data item when there are two bar series).
+// Also consider if tickCategoryInterval > 0 and onBand, ticks and
+// splitLine/spliteArea should layout appropriately corresponding
+// to displayed labels. (So we should not use `getBandWidth` in this
+// case).
+function fixOnBandTicksCoords(axis, ticksCoords, tickCategoryInterval, alignWithLabel, clamp) {
+    var ticksLen = ticksCoords.length;
+
+    if (!axis.onBand || alignWithLabel || !ticksLen) {
+        return;
+    }
+
+    var axisExtent = axis.getExtent();
+    var last;
+    if (ticksLen === 1) {
+        ticksCoords[0].coord = axisExtent[0];
+        last = ticksCoords[1] = {coord: axisExtent[0]};
+    }
+    else {
+        var shift = (ticksCoords[1].coord - ticksCoords[0].coord);
+        each$1(ticksCoords, function (ticksItem) {
+            ticksItem.coord -= shift / 2;
+            var tickCategoryInterval = tickCategoryInterval || 0;
+            // Avoid split a single data item when odd interval.
+            if (tickCategoryInterval % 2 > 0) {
+                ticksItem.coord -= shift / ((tickCategoryInterval + 1) * 2);
+            }
+        });
+        last = {coord: ticksCoords[ticksLen - 1].coord + shift};
+        ticksCoords.push(last);
+    }
+
+    var inverse = axisExtent[0] > axisExtent[1];
+
+    if (littleThan(ticksCoords[0].coord, axisExtent[0])) {
+        clamp ? (ticksCoords[0].coord = axisExtent[0]) : ticksCoords.shift();
+    }
+    if (clamp && littleThan(axisExtent[0], ticksCoords[0].coord)) {
+        ticksCoords.unshift({coord: axisExtent[0]});
+    }
+    if (littleThan(axisExtent[1], last.coord)) {
+        clamp ? (last.coord = axisExtent[1]) : ticksCoords.pop();
+    }
+    if (clamp && littleThan(last.coord, axisExtent[1])) {
+        ticksCoords.push({coord: axisExtent[1]});
+    }
+
+    function littleThan(a, b) {
+        return inverse ? a > b : a < b;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Do not mount those modules on 'src/echarts' for better tree shaking.
+ */
+
+var parseGeoJson = parseGeoJson$1;
+
+var ecUtil = {};
+each$1([
+        'map', 'each', 'filter', 'indexOf', 'inherits', 'reduce', 'filter',
+        'bind', 'curry', 'isArray', 'isString', 'isObject', 'isFunction',
+        'extend', 'defaults', 'clone', 'merge'
+    ],
+    function (name) {
+        ecUtil[name] = zrUtil[name];
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.line',
+
+    dependencies: ['grid', 'polar'],
+
+    getInitialData: function (option, ecModel) {
+        if (__DEV__) {
+            var coordSys = option.coordinateSystem;
+            if (coordSys !== 'polar' && coordSys !== 'cartesian2d') {
+                throw new Error('Line not support coordinateSystem besides cartesian and polar');
+            }
+        }
+        return createListFromArray(this.getSource(), this);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // stack: null
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // polarIndex: 0,
+
+        // If clip the overflow value
+        clipOverflow: true,
+        // cursor: null,
+
+        label: {
+            position: 'top'
+        },
+        // itemStyle: {
+        // },
+
+        lineStyle: {
+            width: 2,
+            type: 'solid'
+        },
+        // areaStyle: {
+            // origin of areaStyle. Valid values:
+            // `'auto'/null/undefined`: from axisLine to data
+            // `'start'`: from min to data
+            // `'end'`: from data to max
+            // origin: 'auto'
+        // },
+        // false, 'start', 'end', 'middle'
+        step: false,
+
+        // Disabled if step is true
+        smooth: false,
+        smoothMonotone: null,
+        symbol: 'emptyCircle',
+        symbolSize: 4,
+        symbolRotate: null,
+
+        showSymbol: true,
+        // `false`: follow the label interval strategy.
+        // `true`: show all symbols.
+        // `'auto'`: If possible, show all symbols, otherwise
+        //           follow the label interval strategy.
+        showAllSymbol: 'auto',
+
+        // Whether to connect break point.
+        connectNulls: false,
+
+        // Sampling for large data. Can be: 'average', 'max', 'min', 'sum'.
+        sampling: 'none',
+
+        animationEasing: 'linear',
+
+        // Disable progressive
+        progressive: 0,
+        hoverLayerThreshold: Infinity
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @return {string} label string. Not null/undefined
+ */
+function getDefaultLabel(data, dataIndex) {
+    var labelDims = data.mapDimension('defaultedLabel', true);
+    var len = labelDims.length;
+
+    // Simple optimization (in lots of cases, label dims length is 1)
+    if (len === 1) {
+        return retrieveRawValue(data, dataIndex, labelDims[0]);
+    }
+    else if (len) {
+        var vals = [];
+        for (var i = 0; i < labelDims.length; i++) {
+            var val = retrieveRawValue(data, dataIndex, labelDims[i]);
+            vals.push(val);
+        }
+        return vals.join(' ');
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/Symbol
+ */
+
+/**
+ * @constructor
+ * @alias {module:echarts/chart/helper/Symbol}
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @extends {module:zrender/graphic/Group}
+ */
+function SymbolClz$1(data, idx, seriesScope) {
+    Group.call(this);
+    this.updateData(data, idx, seriesScope);
+}
+
+var symbolProto = SymbolClz$1.prototype;
+
+/**
+ * @public
+ * @static
+ * @param {module:echarts/data/List} data
+ * @param {number} dataIndex
+ * @return {Array.<number>} [width, height]
+ */
+var getSymbolSize = SymbolClz$1.getSymbolSize = function (data, idx) {
+    var symbolSize = data.getItemVisual(idx, 'symbolSize');
+    return symbolSize instanceof Array
+        ? symbolSize.slice()
+        : [+symbolSize, +symbolSize];
+};
+
+function getScale(symbolSize) {
+    return [symbolSize[0] / 2, symbolSize[1] / 2];
+}
+
+function driftSymbol(dx, dy) {
+    this.parent.drift(dx, dy);
+}
+
+symbolProto._createSymbol = function (
+    symbolType,
+    data,
+    idx,
+    symbolSize,
+    keepAspect
+) {
+    // Remove paths created before
+    this.removeAll();
+
+    var color = data.getItemVisual(idx, 'color');
+
+    // var symbolPath = createSymbol(
+    //     symbolType, -0.5, -0.5, 1, 1, color
+    // );
+    // If width/height are set too small (e.g., set to 1) on ios10
+    // and macOS Sierra, a circle stroke become a rect, no matter what
+    // the scale is set. So we set width/height as 2. See #4150.
+    var symbolPath = createSymbol(
+        symbolType, -1, -1, 2, 2, color, keepAspect
+    );
+
+    symbolPath.attr({
+        z2: 100,
+        culling: true,
+        scale: getScale(symbolSize)
+    });
+    // Rewrite drift method
+    symbolPath.drift = driftSymbol;
+
+    this._symbolType = symbolType;
+
+    this.add(symbolPath);
+};
+
+/**
+ * Stop animation
+ * @param {boolean} toLastFrame
+ */
+symbolProto.stopSymbolAnimation = function (toLastFrame) {
+    this.childAt(0).stopAnimation(toLastFrame);
+};
+
+/**
+ * FIXME:
+ * Caution: This method breaks the encapsulation of this module,
+ * but it indeed brings convenience. So do not use the method
+ * unless you detailedly know all the implements of `Symbol`,
+ * especially animation.
+ *
+ * Get symbol path element.
+ */
+symbolProto.getSymbolPath = function () {
+    return this.childAt(0);
+};
+
+/**
+ * Get scale(aka, current symbol size).
+ * Including the change caused by animation
+ */
+symbolProto.getScale = function () {
+    return this.childAt(0).scale;
+};
+
+/**
+ * Highlight symbol
+ */
+symbolProto.highlight = function () {
+    this.childAt(0).trigger('emphasis');
+};
+
+/**
+ * Downplay symbol
+ */
+symbolProto.downplay = function () {
+    this.childAt(0).trigger('normal');
+};
+
+/**
+ * @param {number} zlevel
+ * @param {number} z
+ */
+symbolProto.setZ = function (zlevel, z) {
+    var symbolPath = this.childAt(0);
+    symbolPath.zlevel = zlevel;
+    symbolPath.z = z;
+};
+
+symbolProto.setDraggable = function (draggable) {
+    var symbolPath = this.childAt(0);
+    symbolPath.draggable = draggable;
+    symbolPath.cursor = draggable ? 'move' : 'pointer';
+};
+
+/**
+ * Update symbol properties
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @param {Object} [seriesScope]
+ * @param {Object} [seriesScope.itemStyle]
+ * @param {Object} [seriesScope.hoverItemStyle]
+ * @param {Object} [seriesScope.symbolRotate]
+ * @param {Object} [seriesScope.symbolOffset]
+ * @param {module:echarts/model/Model} [seriesScope.labelModel]
+ * @param {module:echarts/model/Model} [seriesScope.hoverLabelModel]
+ * @param {boolean} [seriesScope.hoverAnimation]
+ * @param {Object} [seriesScope.cursorStyle]
+ * @param {module:echarts/model/Model} [seriesScope.itemModel]
+ * @param {string} [seriesScope.symbolInnerColor]
+ * @param {Object} [seriesScope.fadeIn=false]
+ */
+symbolProto.updateData = function (data, idx, seriesScope) {
+    this.silent = false;
+
+    var symbolType = data.getItemVisual(idx, 'symbol') || 'circle';
+    var seriesModel = data.hostModel;
+    var symbolSize = getSymbolSize(data, idx);
+    var isInit = symbolType !== this._symbolType;
+
+    if (isInit) {
+        var keepAspect = data.getItemVisual(idx, 'symbolKeepAspect');
+        this._createSymbol(symbolType, data, idx, symbolSize, keepAspect);
+    }
+    else {
+        var symbolPath = this.childAt(0);
+        symbolPath.silent = false;
+        updateProps(symbolPath, {
+            scale: getScale(symbolSize)
+        }, seriesModel, idx);
+    }
+
+    this._updateCommon(data, idx, symbolSize, seriesScope);
+
+    if (isInit) {
+        var symbolPath = this.childAt(0);
+        var fadeIn = seriesScope && seriesScope.fadeIn;
+
+        var target = {scale: symbolPath.scale.slice()};
+        fadeIn && (target.style = {opacity: symbolPath.style.opacity});
+
+        symbolPath.scale = [0, 0];
+        fadeIn && (symbolPath.style.opacity = 0);
+
+        initProps(symbolPath, target, seriesModel, idx);
+    }
+
+    this._seriesModel = seriesModel;
+};
+
+// Update common properties
+var normalStyleAccessPath = ['itemStyle'];
+var emphasisStyleAccessPath = ['emphasis', 'itemStyle'];
+var normalLabelAccessPath = ['label'];
+var emphasisLabelAccessPath = ['emphasis', 'label'];
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @param {Array.<number>} symbolSize
+ * @param {Object} [seriesScope]
+ */
+symbolProto._updateCommon = function (data, idx, symbolSize, seriesScope) {
+    var symbolPath = this.childAt(0);
+    var seriesModel = data.hostModel;
+    var color = data.getItemVisual(idx, 'color');
+
+    // Reset style
+    if (symbolPath.type !== 'image') {
+        symbolPath.useStyle({
+            strokeNoScale: true
+        });
+    }
+
+    var itemStyle = seriesScope && seriesScope.itemStyle;
+    var hoverItemStyle = seriesScope && seriesScope.hoverItemStyle;
+    var symbolRotate = seriesScope && seriesScope.symbolRotate;
+    var symbolOffset = seriesScope && seriesScope.symbolOffset;
+    var labelModel = seriesScope && seriesScope.labelModel;
+    var hoverLabelModel = seriesScope && seriesScope.hoverLabelModel;
+    var hoverAnimation = seriesScope && seriesScope.hoverAnimation;
+    var cursorStyle = seriesScope && seriesScope.cursorStyle;
+
+    if (!seriesScope || data.hasItemOption) {
+        var itemModel = (seriesScope && seriesScope.itemModel)
+            ? seriesScope.itemModel : data.getItemModel(idx);
+
+        // Color must be excluded.
+        // Because symbol provide setColor individually to set fill and stroke
+        itemStyle = itemModel.getModel(normalStyleAccessPath).getItemStyle(['color']);
+        hoverItemStyle = itemModel.getModel(emphasisStyleAccessPath).getItemStyle();
+
+        symbolRotate = itemModel.getShallow('symbolRotate');
+        symbolOffset = itemModel.getShallow('symbolOffset');
+
+        labelModel = itemModel.getModel(normalLabelAccessPath);
+        hoverLabelModel = itemModel.getModel(emphasisLabelAccessPath);
+        hoverAnimation = itemModel.getShallow('hoverAnimation');
+        cursorStyle = itemModel.getShallow('cursor');
+    }
+    else {
+        hoverItemStyle = extend({}, hoverItemStyle);
+    }
+
+    var elStyle = symbolPath.style;
+
+    symbolPath.attr('rotation', (symbolRotate || 0) * Math.PI / 180 || 0);
+
+    if (symbolOffset) {
+        symbolPath.attr('position', [
+            parsePercent$1(symbolOffset[0], symbolSize[0]),
+            parsePercent$1(symbolOffset[1], symbolSize[1])
+        ]);
+    }
+
+    cursorStyle && symbolPath.attr('cursor', cursorStyle);
+
+    // PENDING setColor before setStyle!!!
+    symbolPath.setColor(color, seriesScope && seriesScope.symbolInnerColor);
+
+    symbolPath.setStyle(itemStyle);
+
+    var opacity = data.getItemVisual(idx, 'opacity');
+    if (opacity != null) {
+        elStyle.opacity = opacity;
+    }
+
+    var liftZ = data.getItemVisual(idx, 'liftZ');
+    var z2Origin = symbolPath.__z2Origin;
+    if (liftZ != null) {
+        if (z2Origin == null) {
+            symbolPath.__z2Origin = symbolPath.z2;
+            symbolPath.z2 += liftZ;
+        }
+    }
+    else if (z2Origin != null) {
+        symbolPath.z2 = z2Origin;
+        symbolPath.__z2Origin = null;
+    }
+
+    var useNameLabel = seriesScope && seriesScope.useNameLabel;
+
+    setLabelStyle(
+        elStyle, hoverItemStyle, labelModel, hoverLabelModel,
+        {
+            labelFetcher: seriesModel,
+            labelDataIndex: idx,
+            defaultText: getLabelDefaultText,
+            isRectText: true,
+            autoColor: color
+        }
+    );
+
+    // Do not execute util needed.
+    function getLabelDefaultText(idx, opt) {
+        return useNameLabel ? data.getName(idx) : getDefaultLabel(data, idx);
+    }
+
+    symbolPath.off('mouseover')
+        .off('mouseout')
+        .off('emphasis')
+        .off('normal');
+
+    symbolPath.hoverStyle = hoverItemStyle;
+
+    // FIXME
+    // Do not use symbol.trigger('emphasis'), but use symbol.highlight() instead.
+    setHoverStyle(symbolPath);
+
+    var scale = getScale(symbolSize);
+
+    if (hoverAnimation && seriesModel.isAnimationEnabled()) {
+        var onEmphasis = function() {
+            // Do not support this hover animation util some scenario required.
+            // Animation can only be supported in hover layer when using `el.incremetal`.
+            if (this.incremental) {
+                return;
+            }
+            var ratio = scale[1] / scale[0];
+            this.animateTo({
+                scale: [
+                    Math.max(scale[0] * 1.1, scale[0] + 3),
+                    Math.max(scale[1] * 1.1, scale[1] + 3 * ratio)
+                ]
+            }, 400, 'elasticOut');
+        };
+        var onNormal = function() {
+            if (this.incremental) {
+                return;
+            }
+            this.animateTo({
+                scale: scale
+            }, 400, 'elasticOut');
+        };
+        symbolPath.on('mouseover', onEmphasis)
+            .on('mouseout', onNormal)
+            .on('emphasis', onEmphasis)
+            .on('normal', onNormal);
+    }
+};
+
+/**
+ * @param {Function} cb
+ * @param {Object} [opt]
+ * @param {Object} [opt.keepLabel=true]
+ */
+symbolProto.fadeOut = function (cb, opt) {
+    var symbolPath = this.childAt(0);
+    // Avoid mistaken hover when fading out
+    this.silent = symbolPath.silent = true;
+    // Not show text when animating
+    !(opt && opt.keepLabel) && (symbolPath.style.text = null);
+
+    updateProps(
+        symbolPath,
+        {
+            style: {opacity: 0},
+            scale: [0, 0]
+        },
+        this._seriesModel,
+        this.dataIndex,
+        cb
+    );
+};
+
+inherits(SymbolClz$1, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/SymbolDraw
+ */
+
+/**
+ * @constructor
+ * @alias module:echarts/chart/helper/SymbolDraw
+ * @param {module:zrender/graphic/Group} [symbolCtor]
+ */
+function SymbolDraw(symbolCtor) {
+    this.group = new Group();
+
+    this._symbolCtor = symbolCtor || SymbolClz$1;
+}
+
+var symbolDrawProto = SymbolDraw.prototype;
+
+function symbolNeedsDraw(data, point, idx, opt) {
+    return point && !isNaN(point[0]) && !isNaN(point[1])
+        && !(opt.isIgnore && opt.isIgnore(idx))
+        // We do not set clipShape on group, because it will cut part of
+        // the symbol element shape. We use the same clip shape here as
+        // the line clip.
+        && !(opt.clipShape && !opt.clipShape.contain(point[0], point[1]))
+        && data.getItemVisual(idx, 'symbol') !== 'none';
+}
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ * @param {Object} [opt] Or isIgnore
+ * @param {Function} [opt.isIgnore]
+ * @param {Object} [opt.clipShape]
+ */
+symbolDrawProto.updateData = function (data, opt) {
+    opt = normalizeUpdateOpt(opt);
+
+    var group = this.group;
+    var seriesModel = data.hostModel;
+    var oldData = this._data;
+    var SymbolCtor = this._symbolCtor;
+
+    var seriesScope = makeSeriesScope(data);
+
+    // There is no oldLineData only when first rendering or switching from
+    // stream mode to normal mode, where previous elements should be removed.
+    if (!oldData) {
+        group.removeAll();
+    }
+
+    data.diff(oldData)
+        .add(function (newIdx) {
+            var point = data.getItemLayout(newIdx);
+            if (symbolNeedsDraw(data, point, newIdx, opt)) {
+                var symbolEl = new SymbolCtor(data, newIdx, seriesScope);
+                symbolEl.attr('position', point);
+                data.setItemGraphicEl(newIdx, symbolEl);
+                group.add(symbolEl);
+            }
+        })
+        .update(function (newIdx, oldIdx) {
+            var symbolEl = oldData.getItemGraphicEl(oldIdx);
+            var point = data.getItemLayout(newIdx);
+            if (!symbolNeedsDraw(data, point, newIdx, opt)) {
+                group.remove(symbolEl);
+                return;
+            }
+            if (!symbolEl) {
+                symbolEl = new SymbolCtor(data, newIdx);
+                symbolEl.attr('position', point);
+            }
+            else {
+                symbolEl.updateData(data, newIdx, seriesScope);
+                updateProps(symbolEl, {
+                    position: point
+                }, seriesModel);
+            }
+
+            // Add back
+            group.add(symbolEl);
+
+            data.setItemGraphicEl(newIdx, symbolEl);
+        })
+        .remove(function (oldIdx) {
+            var el = oldData.getItemGraphicEl(oldIdx);
+            el && el.fadeOut(function () {
+                group.remove(el);
+            });
+        })
+        .execute();
+
+    this._data = data;
+};
+
+symbolDrawProto.isPersistent = function () {
+    return true;
+};
+
+symbolDrawProto.updateLayout = function () {
+    var data = this._data;
+    if (data) {
+        // Not use animation
+        data.eachItemGraphicEl(function (el, idx) {
+            var point = data.getItemLayout(idx);
+            el.attr('position', point);
+        });
+    }
+};
+
+symbolDrawProto.incrementalPrepareUpdate = function (data) {
+    this._seriesScope = makeSeriesScope(data);
+    this._data = null;
+    this.group.removeAll();
+};
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ * @param {Object} [opt] Or isIgnore
+ * @param {Function} [opt.isIgnore]
+ * @param {Object} [opt.clipShape]
+ */
+symbolDrawProto.incrementalUpdate = function (taskParams, data, opt) {
+    opt = normalizeUpdateOpt(opt);
+
+    function updateIncrementalAndHover(el) {
+        if (!el.isGroup) {
+            el.incremental = el.useHoverLayer = true;
+        }
+    }
+    for (var idx = taskParams.start; idx < taskParams.end; idx++) {
+        var point = data.getItemLayout(idx);
+        if (symbolNeedsDraw(data, point, idx, opt)) {
+            var el = new this._symbolCtor(data, idx, this._seriesScope);
+            el.traverse(updateIncrementalAndHover);
+            el.attr('position', point);
+            this.group.add(el);
+            data.setItemGraphicEl(idx, el);
+        }
+    }
+};
+
+function normalizeUpdateOpt(opt) {
+    if (opt != null && !isObject$1(opt)) {
+        opt = {isIgnore: opt};
+    }
+    return opt || {};
+}
+
+symbolDrawProto.remove = function (enableAnimation) {
+    var group = this.group;
+    var data = this._data;
+    // Incremental model do not have this._data.
+    if (data && enableAnimation) {
+        data.eachItemGraphicEl(function (el) {
+            el.fadeOut(function () {
+                group.remove(el);
+            });
+        });
+    }
+    else {
+        group.removeAll();
+    }
+};
+
+function makeSeriesScope(data) {
+    var seriesModel = data.hostModel;
+    return {
+        itemStyle: seriesModel.getModel('itemStyle').getItemStyle(['color']),
+        hoverItemStyle: seriesModel.getModel('emphasis.itemStyle').getItemStyle(),
+        symbolRotate: seriesModel.get('symbolRotate'),
+        symbolOffset: seriesModel.get('symbolOffset'),
+        hoverAnimation: seriesModel.get('hoverAnimation'),
+        labelModel: seriesModel.getModel('label'),
+        hoverLabelModel: seriesModel.getModel('emphasis.label'),
+        cursorStyle: seriesModel.get('cursor')
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} coordSys
+ * @param {module:echarts/data/List} data
+ * @param {string} valueOrigin lineSeries.option.areaStyle.origin
+ */
+function prepareDataCoordInfo(coordSys, data, valueOrigin) {
+    var baseAxis = coordSys.getBaseAxis();
+    var valueAxis = coordSys.getOtherAxis(baseAxis);
+    var valueStart = getValueStart(valueAxis, valueOrigin);
+
+    var baseAxisDim = baseAxis.dim;
+    var valueAxisDim = valueAxis.dim;
+    var valueDim = data.mapDimension(valueAxisDim);
+    var baseDim = data.mapDimension(baseAxisDim);
+    var baseDataOffset = valueAxisDim === 'x' || valueAxisDim === 'radius' ? 1 : 0;
+
+    var dims = map(coordSys.dimensions, function (coordDim) {
+        return data.mapDimension(coordDim);
+    });
+
+    var stacked;
+    var stackResultDim = data.getCalculationInfo('stackResultDimension');
+    if (stacked |= isDimensionStacked(data, dims[0] /*, dims[1]*/)) { // jshint ignore:line
+        dims[0] = stackResultDim;
+    }
+    if (stacked |= isDimensionStacked(data, dims[1] /*, dims[0]*/)) { // jshint ignore:line
+        dims[1] = stackResultDim;
+    }
+
+    return {
+        dataDimsForPoint: dims,
+        valueStart: valueStart,
+        valueAxisDim: valueAxisDim,
+        baseAxisDim: baseAxisDim,
+        stacked: !!stacked,
+        valueDim: valueDim,
+        baseDim: baseDim,
+        baseDataOffset: baseDataOffset,
+        stackedOverDimension: data.getCalculationInfo('stackedOverDimension')
+    };
+}
+
+function getValueStart(valueAxis, valueOrigin) {
+    var valueStart = 0;
+    var extent = valueAxis.scale.getExtent();
+
+    if (valueOrigin === 'start') {
+        valueStart = extent[0];
+    }
+    else if (valueOrigin === 'end') {
+        valueStart = extent[1];
+    }
+    // auto
+    else {
+        // Both positive
+        if (extent[0] > 0) {
+            valueStart = extent[0];
+        }
+        // Both negative
+        else if (extent[1] < 0) {
+            valueStart = extent[1];
+        }
+        // If is one positive, and one negative, onZero shall be true
+    }
+
+    return valueStart;
+}
+
+function getStackedOnPoint(dataCoordInfo, coordSys, data, idx) {
+    var value = NaN;
+    if (dataCoordInfo.stacked) {
+        value = data.get(data.getCalculationInfo('stackedOverDimension'), idx);
+    }
+    if (isNaN(value)) {
+        value = dataCoordInfo.valueStart;
+    }
+
+    var baseDataOffset = dataCoordInfo.baseDataOffset;
+    var stackedData = [];
+    stackedData[baseDataOffset] = data.get(dataCoordInfo.baseDim, idx);
+    stackedData[1 - baseDataOffset] = value;
+
+    return coordSys.dataToPoint(stackedData);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// var arrayDiff = require('zrender/src/core/arrayDiff');
+// 'zrender/src/core/arrayDiff' has been used before, but it did
+// not do well in performance when roam with fixed dataZoom window.
+
+// function convertToIntId(newIdList, oldIdList) {
+//     // Generate int id instead of string id.
+//     // Compare string maybe slow in score function of arrDiff
+
+//     // Assume id in idList are all unique
+//     var idIndicesMap = {};
+//     var idx = 0;
+//     for (var i = 0; i < newIdList.length; i++) {
+//         idIndicesMap[newIdList[i]] = idx;
+//         newIdList[i] = idx++;
+//     }
+//     for (var i = 0; i < oldIdList.length; i++) {
+//         var oldId = oldIdList[i];
+//         // Same with newIdList
+//         if (idIndicesMap[oldId]) {
+//             oldIdList[i] = idIndicesMap[oldId];
+//         }
+//         else {
+//             oldIdList[i] = idx++;
+//         }
+//     }
+// }
+
+function diffData(oldData, newData) {
+    var diffResult = [];
+
+    newData.diff(oldData)
+        .add(function (idx) {
+            diffResult.push({cmd: '+', idx: idx});
+        })
+        .update(function (newIdx, oldIdx) {
+            diffResult.push({cmd: '=', idx: oldIdx, idx1: newIdx});
+        })
+        .remove(function (idx) {
+            diffResult.push({cmd: '-', idx: idx});
+        })
+        .execute();
+
+    return diffResult;
+}
+
+var lineAnimationDiff = function (
+    oldData, newData,
+    oldStackedOnPoints, newStackedOnPoints,
+    oldCoordSys, newCoordSys,
+    oldValueOrigin, newValueOrigin
+) {
+    var diff = diffData(oldData, newData);
+
+    // var newIdList = newData.mapArray(newData.getId);
+    // var oldIdList = oldData.mapArray(oldData.getId);
+
+    // convertToIntId(newIdList, oldIdList);
+
+    // // FIXME One data ?
+    // diff = arrayDiff(oldIdList, newIdList);
+
+    var currPoints = [];
+    var nextPoints = [];
+    // Points for stacking base line
+    var currStackedPoints = [];
+    var nextStackedPoints = [];
+
+    var status = [];
+    var sortedIndices = [];
+    var rawIndices = [];
+
+    var newDataOldCoordInfo = prepareDataCoordInfo(oldCoordSys, newData, oldValueOrigin);
+    var oldDataNewCoordInfo = prepareDataCoordInfo(newCoordSys, oldData, newValueOrigin);
+
+    for (var i = 0; i < diff.length; i++) {
+        var diffItem = diff[i];
+        var pointAdded = true;
+
+        // FIXME, animation is not so perfect when dataZoom window moves fast
+        // Which is in case remvoing or add more than one data in the tail or head
+        switch (diffItem.cmd) {
+            case '=':
+                var currentPt = oldData.getItemLayout(diffItem.idx);
+                var nextPt = newData.getItemLayout(diffItem.idx1);
+                // If previous data is NaN, use next point directly
+                if (isNaN(currentPt[0]) || isNaN(currentPt[1])) {
+                    currentPt = nextPt.slice();
+                }
+                currPoints.push(currentPt);
+                nextPoints.push(nextPt);
+
+                currStackedPoints.push(oldStackedOnPoints[diffItem.idx]);
+                nextStackedPoints.push(newStackedOnPoints[diffItem.idx1]);
+
+                rawIndices.push(newData.getRawIndex(diffItem.idx1));
+                break;
+            case '+':
+                var idx = diffItem.idx;
+                currPoints.push(
+                    oldCoordSys.dataToPoint([
+                        newData.get(newDataOldCoordInfo.dataDimsForPoint[0], idx),
+                        newData.get(newDataOldCoordInfo.dataDimsForPoint[1], idx)
+                    ])
+                );
+
+                nextPoints.push(newData.getItemLayout(idx).slice());
+
+                currStackedPoints.push(
+                    getStackedOnPoint(newDataOldCoordInfo, oldCoordSys, newData, idx)
+                );
+                nextStackedPoints.push(newStackedOnPoints[idx]);
+
+                rawIndices.push(newData.getRawIndex(idx));
+                break;
+            case '-':
+                var idx = diffItem.idx;
+                var rawIndex = oldData.getRawIndex(idx);
+                // Data is replaced. In the case of dynamic data queue
+                // FIXME FIXME FIXME
+                if (rawIndex !== idx) {
+                    currPoints.push(oldData.getItemLayout(idx));
+                    nextPoints.push(newCoordSys.dataToPoint([
+                        oldData.get(oldDataNewCoordInfo.dataDimsForPoint[0], idx),
+                        oldData.get(oldDataNewCoordInfo.dataDimsForPoint[1], idx)
+                    ]));
+
+                    currStackedPoints.push(oldStackedOnPoints[idx]);
+                    nextStackedPoints.push(
+                        getStackedOnPoint(oldDataNewCoordInfo, newCoordSys, oldData, idx)
+                    );
+
+                    rawIndices.push(rawIndex);
+                }
+                else {
+                    pointAdded = false;
+                }
+        }
+
+        // Original indices
+        if (pointAdded) {
+            status.push(diffItem);
+            sortedIndices.push(sortedIndices.length);
+        }
+    }
+
+    // Diff result may be crossed if all items are changed
+    // Sort by data index
+    sortedIndices.sort(function (a, b) {
+        return rawIndices[a] - rawIndices[b];
+    });
+
+    var sortedCurrPoints = [];
+    var sortedNextPoints = [];
+
+    var sortedCurrStackedPoints = [];
+    var sortedNextStackedPoints = [];
+
+    var sortedStatus = [];
+    for (var i = 0; i < sortedIndices.length; i++) {
+        var idx = sortedIndices[i];
+        sortedCurrPoints[i] = currPoints[idx];
+        sortedNextPoints[i] = nextPoints[idx];
+
+        sortedCurrStackedPoints[i] = currStackedPoints[idx];
+        sortedNextStackedPoints[i] = nextStackedPoints[idx];
+
+        sortedStatus[i] = status[idx];
+    }
+
+    return {
+        current: sortedCurrPoints,
+        next: sortedNextPoints,
+
+        stackedOnCurrent: sortedCurrStackedPoints,
+        stackedOnNext: sortedNextStackedPoints,
+
+        status: sortedStatus
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Poly path support NaN point
+
+var vec2Min = min;
+var vec2Max = max;
+
+var scaleAndAdd$1 = scaleAndAdd;
+var v2Copy = copy;
+
+// Temporary variable
+var v = [];
+var cp0 = [];
+var cp1 = [];
+
+function isPointNull(p) {
+    return isNaN(p[0]) || isNaN(p[1]);
+}
+
+function drawSegment(
+    ctx, points, start, segLen, allLen,
+    dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
+) {
+    // if (smoothMonotone == null) {
+    //     if (isMono(points, 'x')) {
+    //         return drawMono(ctx, points, start, segLen, allLen,
+    //             dir, smoothMin, smoothMax, smooth, 'x', connectNulls);
+    //     }
+    //     else if (isMono(points, 'y')) {
+    //         return drawMono(ctx, points, start, segLen, allLen,
+    //             dir, smoothMin, smoothMax, smooth, 'y', connectNulls);
+    //     }
+    //     else {
+    //         return drawNonMono.apply(this, arguments);
+    //     }
+    // }
+    // else if (smoothMonotone !== 'none' && isMono(points, smoothMonotone)) {
+    //     return drawMono.apply(this, arguments);
+    // }
+    // else {
+    //     return drawNonMono.apply(this, arguments);
+    // }
+    if (smoothMonotone === 'none' || !smoothMonotone) {
+        return drawNonMono.apply(this, arguments);
+    }
+    else {
+        return drawMono.apply(this, arguments);
+    }
+}
+
+/**
+ * Check if points is in monotone.
+ *
+ * @param {number[][]} points         Array of points which is in [x, y] form
+ * @param {string}     smoothMonotone 'x', 'y', or 'none', stating for which
+ *                                    dimension that is checking.
+ *                                    If is 'none', `drawNonMono` should be
+ *                                    called.
+ *                                    If is undefined, either being monotone
+ *                                    in 'x' or 'y' will call `drawMono`.
+ */
+// function isMono(points, smoothMonotone) {
+//     if (points.length <= 1) {
+//         return true;
+//     }
+
+//     var dim = smoothMonotone === 'x' ? 0 : 1;
+//     var last = points[0][dim];
+//     var lastDiff = 0;
+//     for (var i = 1; i < points.length; ++i) {
+//         var diff = points[i][dim] - last;
+//         if (!isNaN(diff) && !isNaN(lastDiff)
+//             && diff !== 0 && lastDiff !== 0
+//             && ((diff >= 0) !== (lastDiff >= 0))
+//         ) {
+//             return false;
+//         }
+//         if (!isNaN(diff) && diff !== 0) {
+//             lastDiff = diff;
+//             last = points[i][dim];
+//         }
+//     }
+//     return true;
+// }
+
+/**
+ * Draw smoothed line in monotone, in which only vertical or horizontal bezier
+ * control points will be used. This should be used when points are monotone
+ * either in x or y dimension.
+ */
+function drawMono(
+    ctx, points, start, segLen, allLen,
+    dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
+) {
+    var prevIdx = 0;
+    var idx = start;
+    for (var k = 0; k < segLen; k++) {
+        var p = points[idx];
+        if (idx >= allLen || idx < 0) {
+            break;
+        }
+        if (isPointNull(p)) {
+            if (connectNulls) {
+                idx += dir;
+                continue;
+            }
+            break;
+        }
+
+        if (idx === start) {
+            ctx[dir > 0 ? 'moveTo' : 'lineTo'](p[0], p[1]);
+        }
+        else {
+            if (smooth > 0) {
+                var prevP = points[prevIdx];
+                var dim = smoothMonotone === 'y' ? 1 : 0;
+
+                // Length of control point to p, either in x or y, but not both
+                var ctrlLen = (p[dim] - prevP[dim]) * smooth;
+
+                v2Copy(cp0, prevP);
+                cp0[dim] = prevP[dim] + ctrlLen;
+
+                v2Copy(cp1, p);
+                cp1[dim] = p[dim] - ctrlLen;
+
+                ctx.bezierCurveTo(
+                    cp0[0], cp0[1],
+                    cp1[0], cp1[1],
+                    p[0], p[1]
+                );
+            }
+            else {
+                ctx.lineTo(p[0], p[1]);
+            }
+        }
+
+        prevIdx = idx;
+        idx += dir;
+    }
+
+    return k;
+}
+
+/**
+ * Draw smoothed line in non-monotone, in may cause undesired curve in extreme
+ * situations. This should be used when points are non-monotone neither in x or
+ * y dimension.
+ */
+function drawNonMono(
+    ctx, points, start, segLen, allLen,
+    dir, smoothMin, smoothMax, smooth, smoothMonotone, connectNulls
+) {
+    var prevIdx = 0;
+    var idx = start;
+    for (var k = 0; k < segLen; k++) {
+        var p = points[idx];
+        if (idx >= allLen || idx < 0) {
+            break;
+        }
+        if (isPointNull(p)) {
+            if (connectNulls) {
+                idx += dir;
+                continue;
+            }
+            break;
+        }
+
+        if (idx === start) {
+            ctx[dir > 0 ? 'moveTo' : 'lineTo'](p[0], p[1]);
+            v2Copy(cp0, p);
+        }
+        else {
+            if (smooth > 0) {
+                var nextIdx = idx + dir;
+                var nextP = points[nextIdx];
+                if (connectNulls) {
+                    // Find next point not null
+                    while (nextP && isPointNull(points[nextIdx])) {
+                        nextIdx += dir;
+                        nextP = points[nextIdx];
+                    }
+                }
+
+                var ratioNextSeg = 0.5;
+                var prevP = points[prevIdx];
+                var nextP = points[nextIdx];
+                // Last point
+                if (!nextP || isPointNull(nextP)) {
+                    v2Copy(cp1, p);
+                }
+                else {
+                    // If next data is null in not connect case
+                    if (isPointNull(nextP) && !connectNulls) {
+                        nextP = p;
+                    }
+
+                    sub(v, nextP, prevP);
+
+                    var lenPrevSeg;
+                    var lenNextSeg;
+                    if (smoothMonotone === 'x' || smoothMonotone === 'y') {
+                        var dim = smoothMonotone === 'x' ? 0 : 1;
+                        lenPrevSeg = Math.abs(p[dim] - prevP[dim]);
+                        lenNextSeg = Math.abs(p[dim] - nextP[dim]);
+                    }
+                    else {
+                        lenPrevSeg = dist(p, prevP);
+                        lenNextSeg = dist(p, nextP);
+                    }
+
+                    // Use ratio of seg length
+                    ratioNextSeg = lenNextSeg / (lenNextSeg + lenPrevSeg);
+
+                    scaleAndAdd$1(cp1, p, v, -smooth * (1 - ratioNextSeg));
+                }
+                // Smooth constraint
+                vec2Min(cp0, cp0, smoothMax);
+                vec2Max(cp0, cp0, smoothMin);
+                vec2Min(cp1, cp1, smoothMax);
+                vec2Max(cp1, cp1, smoothMin);
+
+                ctx.bezierCurveTo(
+                    cp0[0], cp0[1],
+                    cp1[0], cp1[1],
+                    p[0], p[1]
+                );
+                // cp0 of next segment
+                scaleAndAdd$1(cp0, p, v, smooth * ratioNextSeg);
+            }
+            else {
+                ctx.lineTo(p[0], p[1]);
+            }
+        }
+
+        prevIdx = idx;
+        idx += dir;
+    }
+
+    return k;
+}
+
+function getBoundingBox(points, smoothConstraint) {
+    var ptMin = [Infinity, Infinity];
+    var ptMax = [-Infinity, -Infinity];
+    if (smoothConstraint) {
+        for (var i = 0; i < points.length; i++) {
+            var pt = points[i];
+            if (pt[0] < ptMin[0]) { ptMin[0] = pt[0]; }
+            if (pt[1] < ptMin[1]) { ptMin[1] = pt[1]; }
+            if (pt[0] > ptMax[0]) { ptMax[0] = pt[0]; }
+            if (pt[1] > ptMax[1]) { ptMax[1] = pt[1]; }
+        }
+    }
+    return {
+        min: smoothConstraint ? ptMin : ptMax,
+        max: smoothConstraint ? ptMax : ptMin
+    };
+}
+
+var Polyline$1 = Path.extend({
+
+    type: 'ec-polyline',
+
+    shape: {
+        points: [],
+
+        smooth: 0,
+
+        smoothConstraint: true,
+
+        smoothMonotone: null,
+
+        connectNulls: false
+    },
+
+    style: {
+        fill: null,
+
+        stroke: '#000'
+    },
+
+    brush: fixClipWithShadow(Path.prototype.brush),
+
+    buildPath: function (ctx, shape) {
+        var points = shape.points;
+
+        var i = 0;
+        var len$$1 = points.length;
+
+        var result = getBoundingBox(points, shape.smoothConstraint);
+
+        if (shape.connectNulls) {
+            // Must remove first and last null values avoid draw error in polygon
+            for (; len$$1 > 0; len$$1--) {
+                if (!isPointNull(points[len$$1 - 1])) {
+                    break;
+                }
+            }
+            for (; i < len$$1; i++) {
+                if (!isPointNull(points[i])) {
+                    break;
+                }
+            }
+        }
+        while (i < len$$1) {
+            i += drawSegment(
+                ctx, points, i, len$$1, len$$1,
+                1, result.min, result.max, shape.smooth,
+                shape.smoothMonotone, shape.connectNulls
+            ) + 1;
+        }
+    }
+});
+
+var Polygon$1 = Path.extend({
+
+    type: 'ec-polygon',
+
+    shape: {
+        points: [],
+
+        // Offset between stacked base points and points
+        stackedOnPoints: [],
+
+        smooth: 0,
+
+        stackedOnSmooth: 0,
+
+        smoothConstraint: true,
+
+        smoothMonotone: null,
+
+        connectNulls: false
+    },
+
+    brush: fixClipWithShadow(Path.prototype.brush),
+
+    buildPath: function (ctx, shape) {
+        var points = shape.points;
+        var stackedOnPoints = shape.stackedOnPoints;
+
+        var i = 0;
+        var len$$1 = points.length;
+        var smoothMonotone = shape.smoothMonotone;
+        var bbox = getBoundingBox(points, shape.smoothConstraint);
+        var stackedOnBBox = getBoundingBox(stackedOnPoints, shape.smoothConstraint);
+
+        if (shape.connectNulls) {
+            // Must remove first and last null values avoid draw error in polygon
+            for (; len$$1 > 0; len$$1--) {
+                if (!isPointNull(points[len$$1 - 1])) {
+                    break;
+                }
+            }
+            for (; i < len$$1; i++) {
+                if (!isPointNull(points[i])) {
+                    break;
+                }
+            }
+        }
+        while (i < len$$1) {
+            var k = drawSegment(
+                ctx, points, i, len$$1, len$$1,
+                1, bbox.min, bbox.max, shape.smooth,
+                smoothMonotone, shape.connectNulls
+            );
+            drawSegment(
+                ctx, stackedOnPoints, i + k - 1, k, len$$1,
+                -1, stackedOnBBox.min, stackedOnBBox.max, shape.stackedOnSmooth,
+                smoothMonotone, shape.connectNulls
+            );
+            i += k + 1;
+
+            ctx.closePath();
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME step not support polar
+
+function isPointsSame(points1, points2) {
+    if (points1.length !== points2.length) {
+        return;
+    }
+    for (var i = 0; i < points1.length; i++) {
+        var p1 = points1[i];
+        var p2 = points2[i];
+        if (p1[0] !== p2[0] || p1[1] !== p2[1]) {
+            return;
+        }
+    }
+    return true;
+}
+
+function getSmooth(smooth) {
+    return typeof (smooth) === 'number' ? smooth : (smooth ? 0.5 : 0);
+}
+
+function getAxisExtentWithGap(axis) {
+    var extent = axis.getGlobalExtent();
+    if (axis.onBand) {
+        // Remove extra 1px to avoid line miter in clipped edge
+        var halfBandWidth = axis.getBandWidth() / 2 - 1;
+        var dir = extent[1] > extent[0] ? 1 : -1;
+        extent[0] += dir * halfBandWidth;
+        extent[1] -= dir * halfBandWidth;
+    }
+    return extent;
+}
+
+/**
+ * @param {module:echarts/coord/cartesian/Cartesian2D|module:echarts/coord/polar/Polar} coordSys
+ * @param {module:echarts/data/List} data
+ * @param {Object} dataCoordInfo
+ * @param {Array.<Array.<number>>} points
+ */
+function getStackedOnPoints(coordSys, data, dataCoordInfo) {
+    if (!dataCoordInfo.valueDim) {
+        return [];
+    }
+
+    var points = [];
+    for (var idx = 0, len = data.count(); idx < len; idx++) {
+        points.push(getStackedOnPoint(dataCoordInfo, coordSys, data, idx));
+    }
+
+    return points;
+}
+
+function createGridClipShape(cartesian, hasAnimation, forSymbol, seriesModel) {
+    var xExtent = getAxisExtentWithGap(cartesian.getAxis('x'));
+    var yExtent = getAxisExtentWithGap(cartesian.getAxis('y'));
+    var isHorizontal = cartesian.getBaseAxis().isHorizontal();
+
+    var x = Math.min(xExtent[0], xExtent[1]);
+    var y = Math.min(yExtent[0], yExtent[1]);
+    var width = Math.max(xExtent[0], xExtent[1]) - x;
+    var height = Math.max(yExtent[0], yExtent[1]) - y;
+
+    // Avoid float number rounding error for symbol on the edge of axis extent.
+    // See #7913 and `test/dataZoom-clip.html`.
+    if (forSymbol) {
+        x -= 0.5;
+        width += 0.5;
+        y -= 0.5;
+        height += 0.5;
+    }
+    else {
+        var lineWidth = seriesModel.get('lineStyle.width') || 2;
+        // Expand clip shape to avoid clipping when line value exceeds axis
+        var expandSize = seriesModel.get('clipOverflow') ? lineWidth / 2 : Math.max(width, height);
+        if (isHorizontal) {
+            y -= expandSize;
+            height += expandSize * 2;
+        }
+        else {
+            x -= expandSize;
+            width += expandSize * 2;
+        }
+    }
+
+    var clipPath = new Rect({
+        shape: {
+            x: x,
+            y: y,
+            width: width,
+            height: height
+        }
+    });
+
+    if (hasAnimation) {
+        clipPath.shape[isHorizontal ? 'width' : 'height'] = 0;
+        initProps(clipPath, {
+            shape: {
+                width: width,
+                height: height
+            }
+        }, seriesModel);
+    }
+
+    return clipPath;
+}
+
+function createPolarClipShape(polar, hasAnimation, forSymbol, seriesModel) {
+    var angleAxis = polar.getAngleAxis();
+    var radiusAxis = polar.getRadiusAxis();
+
+    var radiusExtent = radiusAxis.getExtent().slice();
+    radiusExtent[0] > radiusExtent[1] && radiusExtent.reverse();
+    var angleExtent = angleAxis.getExtent();
+
+    var RADIAN = Math.PI / 180;
+
+    // Avoid float number rounding error for symbol on the edge of axis extent.
+    if (forSymbol) {
+        radiusExtent[0] -= 0.5;
+        radiusExtent[1] += 0.5;
+    }
+
+    var clipPath = new Sector({
+        shape: {
+            cx: round$1(polar.cx, 1),
+            cy: round$1(polar.cy, 1),
+            r0: round$1(radiusExtent[0], 1),
+            r: round$1(radiusExtent[1], 1),
+            startAngle: -angleExtent[0] * RADIAN,
+            endAngle: -angleExtent[1] * RADIAN,
+            clockwise: angleAxis.inverse
+        }
+    });
+
+    if (hasAnimation) {
+        clipPath.shape.endAngle = -angleExtent[0] * RADIAN;
+        initProps(clipPath, {
+            shape: {
+                endAngle: -angleExtent[1] * RADIAN
+            }
+        }, seriesModel);
+    }
+
+    return clipPath;
+}
+
+function createClipShape(coordSys, hasAnimation, forSymbol, seriesModel) {
+    return coordSys.type === 'polar'
+        ? createPolarClipShape(coordSys, hasAnimation, forSymbol, seriesModel)
+        : createGridClipShape(coordSys, hasAnimation, forSymbol, seriesModel);
+}
+
+function turnPointsIntoStep(points, coordSys, stepTurnAt) {
+    var baseAxis = coordSys.getBaseAxis();
+    var baseIndex = baseAxis.dim === 'x' || baseAxis.dim === 'radius' ? 0 : 1;
+
+    var stepPoints = [];
+    for (var i = 0; i < points.length - 1; i++) {
+        var nextPt = points[i + 1];
+        var pt = points[i];
+        stepPoints.push(pt);
+
+        var stepPt = [];
+        switch (stepTurnAt) {
+            case 'end':
+                stepPt[baseIndex] = nextPt[baseIndex];
+                stepPt[1 - baseIndex] = pt[1 - baseIndex];
+                // default is start
+                stepPoints.push(stepPt);
+                break;
+            case 'middle':
+                // default is start
+                var middle = (pt[baseIndex] + nextPt[baseIndex]) / 2;
+                var stepPt2 = [];
+                stepPt[baseIndex] = stepPt2[baseIndex] = middle;
+                stepPt[1 - baseIndex] = pt[1 - baseIndex];
+                stepPt2[1 - baseIndex] = nextPt[1 - baseIndex];
+                stepPoints.push(stepPt);
+                stepPoints.push(stepPt2);
+                break;
+            default:
+                stepPt[baseIndex] = pt[baseIndex];
+                stepPt[1 - baseIndex] = nextPt[1 - baseIndex];
+                // default is start
+                stepPoints.push(stepPt);
+        }
+    }
+    // Last points
+    points[i] && stepPoints.push(points[i]);
+    return stepPoints;
+}
+
+function getVisualGradient(data, coordSys) {
+    var visualMetaList = data.getVisual('visualMeta');
+    if (!visualMetaList || !visualMetaList.length || !data.count()) {
+        // When data.count() is 0, gradient range can not be calculated.
+        return;
+    }
+
+    if (coordSys.type !== 'cartesian2d') {
+        if (__DEV__) {
+            console.warn('Visual map on line style is only supported on cartesian2d.');
+        }
+        return;
+    }
+
+    var coordDim;
+    var visualMeta;
+
+    for (var i = visualMetaList.length - 1; i >= 0; i--) {
+        var dimIndex = visualMetaList[i].dimension;
+        var dimName = data.dimensions[dimIndex];
+        var dimInfo = data.getDimensionInfo(dimName);
+        coordDim = dimInfo && dimInfo.coordDim;
+        // Can only be x or y
+        if (coordDim === 'x' || coordDim === 'y') {
+            visualMeta = visualMetaList[i];
+            break;
+        }
+    }
+
+    if (!visualMeta) {
+        if (__DEV__) {
+            console.warn('Visual map on line style only support x or y dimension.');
+        }
+        return;
+    }
+
+    // If the area to be rendered is bigger than area defined by LinearGradient,
+    // the canvas spec prescribes that the color of the first stop and the last
+    // stop should be used. But if two stops are added at offset 0, in effect
+    // browsers use the color of the second stop to render area outside
+    // LinearGradient. So we can only infinitesimally extend area defined in
+    // LinearGradient to render `outerColors`.
+
+    var axis = coordSys.getAxis(coordDim);
+
+    // dataToCoor mapping may not be linear, but must be monotonic.
+    var colorStops = map(visualMeta.stops, function (stop) {
+        return {
+            coord: axis.toGlobalCoord(axis.dataToCoord(stop.value)),
+            color: stop.color
+        };
+    });
+    var stopLen = colorStops.length;
+    var outerColors = visualMeta.outerColors.slice();
+
+    if (stopLen && colorStops[0].coord > colorStops[stopLen - 1].coord) {
+        colorStops.reverse();
+        outerColors.reverse();
+    }
+
+    var tinyExtent = 10; // Arbitrary value: 10px
+    var minCoord = colorStops[0].coord - tinyExtent;
+    var maxCoord = colorStops[stopLen - 1].coord + tinyExtent;
+    var coordSpan = maxCoord - minCoord;
+
+    if (coordSpan < 1e-3) {
+        return 'transparent';
+    }
+
+    each$1(colorStops, function (stop) {
+        stop.offset = (stop.coord - minCoord) / coordSpan;
+    });
+    colorStops.push({
+        offset: stopLen ? colorStops[stopLen - 1].offset : 0.5,
+        color: outerColors[1] || 'transparent'
+    });
+    colorStops.unshift({ // notice colorStops.length have been changed.
+        offset: stopLen ? colorStops[0].offset : 0.5,
+        color: outerColors[0] || 'transparent'
+    });
+
+    // zrUtil.each(colorStops, function (colorStop) {
+    //     // Make sure each offset has rounded px to avoid not sharp edge
+    //     colorStop.offset = (Math.round(colorStop.offset * (end - start) + start) - start) / (end - start);
+    // });
+
+    var gradient = new LinearGradient(0, 0, 0, 0, colorStops, true);
+    gradient[coordDim] = minCoord;
+    gradient[coordDim + '2'] = maxCoord;
+
+    return gradient;
+}
+
+function getIsIgnoreFunc(seriesModel, data, coordSys) {
+    var showAllSymbol = seriesModel.get('showAllSymbol');
+    var isAuto = showAllSymbol === 'auto';
+
+    if (showAllSymbol && !isAuto) {
+        return;
+    }
+
+    var categoryAxis = coordSys.getAxesByScale('ordinal')[0];
+    if (!categoryAxis) {
+        return;
+    }
+
+    // Note that category label interval strategy might bring some weird effect
+    // in some scenario: users may wonder why some of the symbols are not
+    // displayed. So we show all symbols as possible as we can.
+    if (isAuto
+        // Simplify the logic, do not determine label overlap here.
+        && canShowAllSymbolForCategory(categoryAxis, data)
+    ) {
+        return;
+    }
+
+    // Otherwise follow the label interval strategy on category axis.
+    var categoryDataDim = data.mapDimension(categoryAxis.dim);
+    var labelMap = {};
+
+    each$1(categoryAxis.getViewLabels(), function (labelItem) {
+        labelMap[labelItem.tickValue] = 1;
+    });
+
+    return function (dataIndex) {
+        return !labelMap.hasOwnProperty(data.get(categoryDataDim, dataIndex));
+    };
+}
+
+function canShowAllSymbolForCategory(categoryAxis, data) {
+    // In mose cases, line is monotonous on category axis, and the label size
+    // is close with each other. So we check the symbol size and some of the
+    // label size alone with the category axis to estimate whether all symbol
+    // can be shown without overlap.
+    var axisExtent = categoryAxis.getExtent();
+    var availSize = Math.abs(axisExtent[1] - axisExtent[0]) / categoryAxis.scale.count();
+    isNaN(availSize) && (availSize = 0); // 0/0 is NaN.
+
+    // Sampling some points, max 5.
+    var dataLen = data.count();
+    var step = Math.max(1, Math.round(dataLen / 5));
+    for (var dataIndex = 0; dataIndex < dataLen; dataIndex += step) {
+        if (SymbolClz$1.getSymbolSize(
+                data, dataIndex
+            // Only for cartesian, where `isHorizontal` exists.
+            )[categoryAxis.isHorizontal() ? 1 : 0]
+            // Empirical number
+            * 1.5 > availSize
+        ) {
+            return false;
+        }
+    }
+
+    return true;
+}
+
+Chart.extend({
+
+    type: 'line',
+
+    init: function () {
+        var lineGroup = new Group();
+
+        var symbolDraw = new SymbolDraw();
+        this.group.add(symbolDraw.group);
+
+        this._symbolDraw = symbolDraw;
+        this._lineGroup = lineGroup;
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var group = this.group;
+        var data = seriesModel.getData();
+        var lineStyleModel = seriesModel.getModel('lineStyle');
+        var areaStyleModel = seriesModel.getModel('areaStyle');
+
+        var points = data.mapArray(data.getItemLayout);
+
+        var isCoordSysPolar = coordSys.type === 'polar';
+        var prevCoordSys = this._coordSys;
+
+        var symbolDraw = this._symbolDraw;
+        var polyline = this._polyline;
+        var polygon = this._polygon;
+
+        var lineGroup = this._lineGroup;
+
+        var hasAnimation = seriesModel.get('animation');
+
+        var isAreaChart = !areaStyleModel.isEmpty();
+
+        var valueOrigin = areaStyleModel.get('origin');
+        var dataCoordInfo = prepareDataCoordInfo(coordSys, data, valueOrigin);
+
+        var stackedOnPoints = getStackedOnPoints(coordSys, data, dataCoordInfo);
+
+        var showSymbol = seriesModel.get('showSymbol');
+
+        var isIgnoreFunc = showSymbol && !isCoordSysPolar
+            && getIsIgnoreFunc(seriesModel, data, coordSys);
+
+        // Remove temporary symbols
+        var oldData = this._data;
+        oldData && oldData.eachItemGraphicEl(function (el, idx) {
+            if (el.__temp) {
+                group.remove(el);
+                oldData.setItemGraphicEl(idx, null);
+            }
+        });
+
+        // Remove previous created symbols if showSymbol changed to false
+        if (!showSymbol) {
+            symbolDraw.remove();
+        }
+
+        group.add(lineGroup);
+
+        // FIXME step not support polar
+        var step = !isCoordSysPolar && seriesModel.get('step');
+        // Initialization animation or coordinate system changed
+        if (
+            !(polyline && prevCoordSys.type === coordSys.type && step === this._step)
+        ) {
+            showSymbol && symbolDraw.updateData(data, {
+                isIgnore: isIgnoreFunc,
+                clipShape: createClipShape(coordSys, false, true, seriesModel)
+            });
+
+            if (step) {
+                // TODO If stacked series is not step
+                points = turnPointsIntoStep(points, coordSys, step);
+                stackedOnPoints = turnPointsIntoStep(stackedOnPoints, coordSys, step);
+            }
+
+            polyline = this._newPolyline(points, coordSys, hasAnimation);
+            if (isAreaChart) {
+                polygon = this._newPolygon(
+                    points, stackedOnPoints,
+                    coordSys, hasAnimation
+                );
+            }
+            lineGroup.setClipPath(createClipShape(coordSys, true, false, seriesModel));
+        }
+        else {
+            if (isAreaChart && !polygon) {
+                // If areaStyle is added
+                polygon = this._newPolygon(
+                    points, stackedOnPoints,
+                    coordSys, hasAnimation
+                );
+            }
+            else if (polygon && !isAreaChart) {
+                // If areaStyle is removed
+                lineGroup.remove(polygon);
+                polygon = this._polygon = null;
+            }
+
+            // Update clipPath
+            lineGroup.setClipPath(createClipShape(coordSys, false, false, seriesModel));
+
+            // Always update, or it is wrong in the case turning on legend
+            // because points are not changed
+            showSymbol && symbolDraw.updateData(data, {
+                isIgnore: isIgnoreFunc,
+                clipShape: createClipShape(coordSys, false, true, seriesModel)
+            });
+
+            // Stop symbol animation and sync with line points
+            // FIXME performance?
+            data.eachItemGraphicEl(function (el) {
+                el.stopAnimation(true);
+            });
+
+            // In the case data zoom triggerred refreshing frequently
+            // Data may not change if line has a category axis. So it should animate nothing
+            if (!isPointsSame(this._stackedOnPoints, stackedOnPoints)
+                || !isPointsSame(this._points, points)
+            ) {
+                if (hasAnimation) {
+                    this._updateAnimation(
+                        data, stackedOnPoints, coordSys, api, step, valueOrigin
+                    );
+                }
+                else {
+                    // Not do it in update with animation
+                    if (step) {
+                        // TODO If stacked series is not step
+                        points = turnPointsIntoStep(points, coordSys, step);
+                        stackedOnPoints = turnPointsIntoStep(stackedOnPoints, coordSys, step);
+                    }
+
+                    polyline.setShape({
+                        points: points
+                    });
+                    polygon && polygon.setShape({
+                        points: points,
+                        stackedOnPoints: stackedOnPoints
+                    });
+                }
+            }
+        }
+
+        var visualColor = getVisualGradient(data, coordSys) || data.getVisual('color');
+
+        polyline.useStyle(defaults(
+            // Use color in lineStyle first
+            lineStyleModel.getLineStyle(),
+            {
+                fill: 'none',
+                stroke: visualColor,
+                lineJoin: 'bevel'
+            }
+        ));
+
+        var smooth = seriesModel.get('smooth');
+        smooth = getSmooth(seriesModel.get('smooth'));
+        polyline.setShape({
+            smooth: smooth,
+            smoothMonotone: seriesModel.get('smoothMonotone'),
+            connectNulls: seriesModel.get('connectNulls')
+        });
+
+        if (polygon) {
+            var stackedOnSeries = data.getCalculationInfo('stackedOnSeries');
+            var stackedOnSmooth = 0;
+
+            polygon.useStyle(defaults(
+                areaStyleModel.getAreaStyle(),
+                {
+                    fill: visualColor,
+                    opacity: 0.7,
+                    lineJoin: 'bevel'
+                }
+            ));
+
+            if (stackedOnSeries) {
+                stackedOnSmooth = getSmooth(stackedOnSeries.get('smooth'));
+            }
+
+            polygon.setShape({
+                smooth: smooth,
+                stackedOnSmooth: stackedOnSmooth,
+                smoothMonotone: seriesModel.get('smoothMonotone'),
+                connectNulls: seriesModel.get('connectNulls')
+            });
+        }
+
+        this._data = data;
+        // Save the coordinate system for transition animation when data changed
+        this._coordSys = coordSys;
+        this._stackedOnPoints = stackedOnPoints;
+        this._points = points;
+        this._step = step;
+        this._valueOrigin = valueOrigin;
+    },
+
+    dispose: function () {},
+
+    highlight: function (seriesModel, ecModel, api, payload) {
+        var data = seriesModel.getData();
+        var dataIndex = queryDataIndex(data, payload);
+
+        if (!(dataIndex instanceof Array) && dataIndex != null && dataIndex >= 0) {
+            var symbol = data.getItemGraphicEl(dataIndex);
+            if (!symbol) {
+                // Create a temporary symbol if it is not exists
+                var pt = data.getItemLayout(dataIndex);
+                if (!pt) {
+                    // Null data
+                    return;
+                }
+                symbol = new SymbolClz$1(data, dataIndex);
+                symbol.position = pt;
+                symbol.setZ(
+                    seriesModel.get('zlevel'),
+                    seriesModel.get('z')
+                );
+                symbol.ignore = isNaN(pt[0]) || isNaN(pt[1]);
+                symbol.__temp = true;
+                data.setItemGraphicEl(dataIndex, symbol);
+
+                // Stop scale animation
+                symbol.stopSymbolAnimation(true);
+
+                this.group.add(symbol);
+            }
+            symbol.highlight();
+        }
+        else {
+            // Highlight whole series
+            Chart.prototype.highlight.call(
+                this, seriesModel, ecModel, api, payload
+            );
+        }
+    },
+
+    downplay: function (seriesModel, ecModel, api, payload) {
+        var data = seriesModel.getData();
+        var dataIndex = queryDataIndex(data, payload);
+        if (dataIndex != null && dataIndex >= 0) {
+            var symbol = data.getItemGraphicEl(dataIndex);
+            if (symbol) {
+                if (symbol.__temp) {
+                    data.setItemGraphicEl(dataIndex, null);
+                    this.group.remove(symbol);
+                }
+                else {
+                    symbol.downplay();
+                }
+            }
+        }
+        else {
+            // FIXME
+            // can not downplay completely.
+            // Downplay whole series
+            Chart.prototype.downplay.call(
+                this, seriesModel, ecModel, api, payload
+            );
+        }
+    },
+
+    /**
+     * @param {module:zrender/container/Group} group
+     * @param {Array.<Array.<number>>} points
+     * @private
+     */
+    _newPolyline: function (points) {
+        var polyline = this._polyline;
+        // Remove previous created polyline
+        if (polyline) {
+            this._lineGroup.remove(polyline);
+        }
+
+        polyline = new Polyline$1({
+            shape: {
+                points: points
+            },
+            silent: true,
+            z2: 10
+        });
+
+        this._lineGroup.add(polyline);
+
+        this._polyline = polyline;
+
+        return polyline;
+    },
+
+    /**
+     * @param {module:zrender/container/Group} group
+     * @param {Array.<Array.<number>>} stackedOnPoints
+     * @param {Array.<Array.<number>>} points
+     * @private
+     */
+    _newPolygon: function (points, stackedOnPoints) {
+        var polygon = this._polygon;
+        // Remove previous created polygon
+        if (polygon) {
+            this._lineGroup.remove(polygon);
+        }
+
+        polygon = new Polygon$1({
+            shape: {
+                points: points,
+                stackedOnPoints: stackedOnPoints
+            },
+            silent: true
+        });
+
+        this._lineGroup.add(polygon);
+
+        this._polygon = polygon;
+        return polygon;
+    },
+
+    /**
+     * @private
+     */
+    // FIXME Two value axis
+    _updateAnimation: function (data, stackedOnPoints, coordSys, api, step, valueOrigin) {
+        var polyline = this._polyline;
+        var polygon = this._polygon;
+        var seriesModel = data.hostModel;
+
+        var diff = lineAnimationDiff(
+            this._data, data,
+            this._stackedOnPoints, stackedOnPoints,
+            this._coordSys, coordSys,
+            this._valueOrigin, valueOrigin
+        );
+
+        var current = diff.current;
+        var stackedOnCurrent = diff.stackedOnCurrent;
+        var next = diff.next;
+        var stackedOnNext = diff.stackedOnNext;
+        if (step) {
+            // TODO If stacked series is not step
+            current = turnPointsIntoStep(diff.current, coordSys, step);
+            stackedOnCurrent = turnPointsIntoStep(diff.stackedOnCurrent, coordSys, step);
+            next = turnPointsIntoStep(diff.next, coordSys, step);
+            stackedOnNext = turnPointsIntoStep(diff.stackedOnNext, coordSys, step);
+        }
+        // `diff.current` is subset of `current` (which should be ensured by
+        // turnPointsIntoStep), so points in `__points` can be updated when
+        // points in `current` are update during animation.
+        polyline.shape.__points = diff.current;
+        polyline.shape.points = current;
+
+        updateProps(polyline, {
+            shape: {
+                points: next
+            }
+        }, seriesModel);
+
+        if (polygon) {
+            polygon.setShape({
+                points: current,
+                stackedOnPoints: stackedOnCurrent
+            });
+            updateProps(polygon, {
+                shape: {
+                    points: next,
+                    stackedOnPoints: stackedOnNext
+                }
+            }, seriesModel);
+        }
+
+        var updatedDataInfo = [];
+        var diffStatus = diff.status;
+
+        for (var i = 0; i < diffStatus.length; i++) {
+            var cmd = diffStatus[i].cmd;
+            if (cmd === '=') {
+                var el = data.getItemGraphicEl(diffStatus[i].idx1);
+                if (el) {
+                    updatedDataInfo.push({
+                        el: el,
+                        ptIdx: i    // Index of points
+                    });
+                }
+            }
+        }
+
+        if (polyline.animators && polyline.animators.length) {
+            polyline.animators[0].during(function () {
+                for (var i = 0; i < updatedDataInfo.length; i++) {
+                    var el = updatedDataInfo[i].el;
+                    el.attr('position', polyline.shape.__points[updatedDataInfo[i].ptIdx]);
+                }
+            });
+        }
+    },
+
+    remove: function (ecModel) {
+        var group = this.group;
+        var oldData = this._data;
+        this._lineGroup.removeAll();
+        this._symbolDraw.remove(true);
+        // Remove temporary created elements when highlighting
+        oldData && oldData.eachItemGraphicEl(function (el, idx) {
+            if (el.__temp) {
+                group.remove(el);
+                oldData.setItemGraphicEl(idx, null);
+            }
+        });
+
+        this._polyline =
+        this._polygon =
+        this._coordSys =
+        this._points =
+        this._stackedOnPoints =
+        this._data = null;
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var visualSymbol = function (seriesType, defaultSymbolType, legendSymbol) {
+    // Encoding visual for all series include which is filtered for legend drawing
+    return {
+        seriesType: seriesType,
+
+        // For legend.
+        performRawSeries: true,
+
+        reset: function (seriesModel, ecModel, api) {
+            var data = seriesModel.getData();
+
+            var symbolType = seriesModel.get('symbol') || defaultSymbolType;
+            var symbolSize = seriesModel.get('symbolSize');
+            var keepAspect = seriesModel.get('symbolKeepAspect');
+
+            data.setVisual({
+                legendSymbol: legendSymbol || symbolType,
+                symbol: symbolType,
+                symbolSize: symbolSize,
+                symbolKeepAspect: keepAspect
+            });
+
+            // Only visible series has each data be visual encoded
+            if (ecModel.isSeriesFiltered(seriesModel)) {
+                return;
+            }
+
+            var hasCallback = typeof symbolSize === 'function';
+
+            function dataEach(data, idx) {
+                if (typeof symbolSize === 'function') {
+                    var rawValue = seriesModel.getRawValue(idx);
+                    // FIXME
+                    var params = seriesModel.getDataParams(idx);
+                    data.setItemVisual(idx, 'symbolSize', symbolSize(rawValue, params));
+                }
+
+                if (data.hasItemOption) {
+                    var itemModel = data.getItemModel(idx);
+                    var itemSymbolType = itemModel.getShallow('symbol', true);
+                    var itemSymbolSize = itemModel.getShallow('symbolSize',
+                        true);
+                    var itemSymbolKeepAspect =
+                        itemModel.getShallow('symbolKeepAspect',true);
+
+                    // If has item symbol
+                    if (itemSymbolType != null) {
+                        data.setItemVisual(idx, 'symbol', itemSymbolType);
+                    }
+                    if (itemSymbolSize != null) {
+                        // PENDING Transform symbolSize ?
+                        data.setItemVisual(idx, 'symbolSize', itemSymbolSize);
+                    }
+                    if (itemSymbolKeepAspect != null) {
+                        data.setItemVisual(idx, 'symbolKeepAspect',
+                            itemSymbolKeepAspect);
+                    }
+                }
+            }
+
+            return { dataEach: (data.hasItemOption || hasCallback) ? dataEach : null };
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var pointsLayout = function (seriesType) {
+    return {
+        seriesType: seriesType,
+
+        plan: createRenderPlanner(),
+
+        reset: function (seriesModel) {
+            var data = seriesModel.getData();
+            var coordSys = seriesModel.coordinateSystem;
+            var pipelineContext = seriesModel.pipelineContext;
+            var isLargeRender = pipelineContext.large;
+
+            if (!coordSys) {
+                return;
+            }
+
+            var dims = map(coordSys.dimensions, function (dim) {
+                return data.mapDimension(dim);
+            }).slice(0, 2);
+            var dimLen = dims.length;
+
+            var stackResultDim = data.getCalculationInfo('stackResultDimension');
+            if (isDimensionStacked(data, dims[0] /*, dims[1]*/)) {
+                dims[0] = stackResultDim;
+            }
+            if (isDimensionStacked(data, dims[1] /*, dims[0]*/)) {
+                dims[1] = stackResultDim;
+            }
+
+            function progress(params, data) {
+                var segCount = params.end - params.start;
+                var points = isLargeRender && new Float32Array(segCount * dimLen);
+
+                for (var i = params.start, offset = 0, tmpIn = [], tmpOut = []; i < params.end; i++) {
+                    var point;
+
+                    if (dimLen === 1) {
+                        var x = data.get(dims[0], i);
+                        point = !isNaN(x) && coordSys.dataToPoint(x, null, tmpOut);
+                    }
+                    else {
+                        var x = tmpIn[0] = data.get(dims[0], i);
+                        var y = tmpIn[1] = data.get(dims[1], i);
+                        // Also {Array.<number>}, not undefined to avoid if...else... statement
+                        point = !isNaN(x) && !isNaN(y) && coordSys.dataToPoint(tmpIn, null, tmpOut);
+                    }
+
+                    if (isLargeRender) {
+                        points[offset++] = point ? point[0] : NaN;
+                        points[offset++] = point ? point[1] : NaN;
+                    }
+                    else {
+                        data.setItemLayout(i, (point && point.slice()) || [NaN, NaN]);
+                    }
+                }
+
+                isLargeRender && data.setLayout('symbolPoints', points);
+            }
+
+            return dimLen && {progress: progress};
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var samplers = {
+    average: function (frame) {
+        var sum = 0;
+        var count = 0;
+        for (var i = 0; i < frame.length; i++) {
+            if (!isNaN(frame[i])) {
+                sum += frame[i];
+                count++;
+            }
+        }
+        // Return NaN if count is 0
+        return count === 0 ? NaN : sum / count;
+    },
+    sum: function (frame) {
+        var sum = 0;
+        for (var i = 0; i < frame.length; i++) {
+            // Ignore NaN
+            sum += frame[i] || 0;
+        }
+        return sum;
+    },
+    max: function (frame) {
+        var max = -Infinity;
+        for (var i = 0; i < frame.length; i++) {
+            frame[i] > max && (max = frame[i]);
+        }
+        // NaN will cause illegal axis extent.
+        return isFinite(max) ? max : NaN;
+    },
+    min: function (frame) {
+        var min = Infinity;
+        for (var i = 0; i < frame.length; i++) {
+            frame[i] < min && (min = frame[i]);
+        }
+        // NaN will cause illegal axis extent.
+        return isFinite(min) ? min : NaN;
+    },
+    // TODO
+    // Median
+    nearest: function (frame) {
+        return frame[0];
+    }
+};
+
+var indexSampler = function (frame, value) {
+    return Math.round(frame.length / 2);
+};
+
+var dataSample = function (seriesType) {
+    return {
+
+        seriesType: seriesType,
+
+        modifyOutputEnd: true,
+
+        reset: function (seriesModel, ecModel, api) {
+            var data = seriesModel.getData();
+            var sampling = seriesModel.get('sampling');
+            var coordSys = seriesModel.coordinateSystem;
+            // Only cartesian2d support down sampling
+            if (coordSys.type === 'cartesian2d' && sampling) {
+                var baseAxis = coordSys.getBaseAxis();
+                var valueAxis = coordSys.getOtherAxis(baseAxis);
+                var extent = baseAxis.getExtent();
+                // Coordinste system has been resized
+                var size = extent[1] - extent[0];
+                var rate = Math.round(data.count() / size);
+                if (rate > 1) {
+                    var sampler;
+                    if (typeof sampling === 'string') {
+                        sampler = samplers[sampling];
+                    }
+                    else if (typeof sampling === 'function') {
+                        sampler = sampling;
+                    }
+                    if (sampler) {
+                        // Only support sample the first dim mapped from value axis.
+                        seriesModel.setData(data.downSample(
+                            data.mapDimension(valueAxis.dim), 1 / rate, sampler, indexSampler
+                        ));
+                    }
+                }
+            }
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Cartesian coordinate system
+ * @module  echarts/coord/Cartesian
+ *
+ */
+
+function dimAxisMapper(dim) {
+    return this._axes[dim];
+}
+
+/**
+ * @alias module:echarts/coord/Cartesian
+ * @constructor
+ */
+var Cartesian = function (name) {
+    this._axes = {};
+
+    this._dimList = [];
+
+    /**
+     * @type {string}
+     */
+    this.name = name || '';
+};
+
+Cartesian.prototype = {
+
+    constructor: Cartesian,
+
+    type: 'cartesian',
+
+    /**
+     * Get axis
+     * @param  {number|string} dim
+     * @return {module:echarts/coord/Cartesian~Axis}
+     */
+    getAxis: function (dim) {
+        return this._axes[dim];
+    },
+
+    /**
+     * Get axes list
+     * @return {Array.<module:echarts/coord/Cartesian~Axis>}
+     */
+    getAxes: function () {
+        return map(this._dimList, dimAxisMapper, this);
+    },
+
+    /**
+     * Get axes list by given scale type
+     */
+    getAxesByScale: function (scaleType) {
+        scaleType = scaleType.toLowerCase();
+        return filter(
+            this.getAxes(),
+            function (axis) {
+                return axis.scale.type === scaleType;
+            }
+        );
+    },
+
+    /**
+     * Add axis
+     * @param {module:echarts/coord/Cartesian.Axis}
+     */
+    addAxis: function (axis) {
+        var dim = axis.dim;
+
+        this._axes[dim] = axis;
+
+        this._dimList.push(dim);
+    },
+
+    /**
+     * Convert data to coord in nd space
+     * @param {Array.<number>|Object.<string, number>} val
+     * @return {Array.<number>|Object.<string, number>}
+     */
+    dataToCoord: function (val) {
+        return this._dataCoordConvert(val, 'dataToCoord');
+    },
+
+    /**
+     * Convert coord in nd space to data
+     * @param  {Array.<number>|Object.<string, number>} val
+     * @return {Array.<number>|Object.<string, number>}
+     */
+    coordToData: function (val) {
+        return this._dataCoordConvert(val, 'coordToData');
+    },
+
+    _dataCoordConvert: function (input, method) {
+        var dimList = this._dimList;
+
+        var output = input instanceof Array ? [] : {};
+
+        for (var i = 0; i < dimList.length; i++) {
+            var dim = dimList[i];
+            var axis = this._axes[dim];
+
+            output[dim] = axis[method](input[dim]);
+        }
+
+        return output;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function Cartesian2D(name) {
+
+    Cartesian.call(this, name);
+}
+
+Cartesian2D.prototype = {
+
+    constructor: Cartesian2D,
+
+    type: 'cartesian2d',
+
+    /**
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['x', 'y'],
+
+    /**
+     * Base axis will be used on stacking.
+     *
+     * @return {module:echarts/coord/cartesian/Axis2D}
+     */
+    getBaseAxis: function () {
+        return this.getAxesByScale('ordinal')[0]
+            || this.getAxesByScale('time')[0]
+            || this.getAxis('x');
+    },
+
+    /**
+     * If contain point
+     * @param {Array.<number>} point
+     * @return {boolean}
+     */
+    containPoint: function (point) {
+        var axisX = this.getAxis('x');
+        var axisY = this.getAxis('y');
+        return axisX.contain(axisX.toLocalCoord(point[0]))
+            && axisY.contain(axisY.toLocalCoord(point[1]));
+    },
+
+    /**
+     * If contain data
+     * @param {Array.<number>} data
+     * @return {boolean}
+     */
+    containData: function (data) {
+        return this.getAxis('x').containData(data[0])
+            && this.getAxis('y').containData(data[1]);
+    },
+
+    /**
+     * @param {Array.<number>} data
+     * @param {Array.<number>} out
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, reserved, out) {
+        var xAxis = this.getAxis('x');
+        var yAxis = this.getAxis('y');
+        out = out || [];
+        out[0] = xAxis.toGlobalCoord(xAxis.dataToCoord(data[0]));
+        out[1] = yAxis.toGlobalCoord(yAxis.dataToCoord(data[1]));
+        return out;
+    },
+
+    /**
+     * @param {Array.<number>} data
+     * @param {Array.<number>} out
+     * @return {Array.<number>}
+     */
+    clampData: function (data, out) {
+        var xScale = this.getAxis('x').scale;
+        var yScale = this.getAxis('y').scale;
+        var xAxisExtent = xScale.getExtent();
+        var yAxisExtent = yScale.getExtent();
+        var x = xScale.parse(data[0]);
+        var y = yScale.parse(data[1]);
+        out = out || [];
+        out[0] = Math.min(
+            Math.max(Math.min(xAxisExtent[0], xAxisExtent[1]), x),
+            Math.max(xAxisExtent[0], xAxisExtent[1])
+        );
+        out[1] = Math.min(
+            Math.max(Math.min(yAxisExtent[0], yAxisExtent[1]), y),
+            Math.max(yAxisExtent[0], yAxisExtent[1])
+        );
+
+        return out;
+    },
+
+    /**
+     * @param {Array.<number>} point
+     * @param {Array.<number>} out
+     * @return {Array.<number>}
+     */
+    pointToData: function (point, out) {
+        var xAxis = this.getAxis('x');
+        var yAxis = this.getAxis('y');
+        out = out || [];
+        out[0] = xAxis.coordToData(xAxis.toLocalCoord(point[0]));
+        out[1] = yAxis.coordToData(yAxis.toLocalCoord(point[1]));
+        return out;
+    },
+
+    /**
+     * Get other axis
+     * @param {module:echarts/coord/cartesian/Axis2D} axis
+     */
+    getOtherAxis: function (axis) {
+        return this.getAxis(axis.dim === 'x' ? 'y' : 'x');
+    }
+
+};
+
+inherits(Cartesian2D, Cartesian);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Extend axis 2d
+ * @constructor module:echarts/coord/cartesian/Axis2D
+ * @extends {module:echarts/coord/cartesian/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ * @param {string} position
+ */
+var Axis2D = function (dim, scale, coordExtent, axisType, position) {
+    Axis.call(this, dim, scale, coordExtent);
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * Axis position
+     *  - 'top'
+     *  - 'bottom'
+     *  - 'left'
+     *  - 'right'
+     */
+    this.position = position || 'bottom';
+};
+
+Axis2D.prototype = {
+
+    constructor: Axis2D,
+
+    /**
+     * Index of axis, can be used as key
+     */
+    index: 0,
+
+    /**
+     * Implemented in <module:echarts/coord/cartesian/Grid>.
+     * @return {Array.<module:echarts/coord/cartesian/Axis2D>}
+     *         If not on zero of other axis, return null/undefined.
+     *         If no axes, return an empty array.
+     */
+    getAxesOnZeroOf: null,
+
+    /**
+     * Axis model
+     * @param {module:echarts/coord/cartesian/AxisModel}
+     */
+    model: null,
+
+    isHorizontal: function () {
+        var position = this.position;
+        return position === 'top' || position === 'bottom';
+    },
+
+    /**
+     * Each item cooresponds to this.getExtent(), which
+     * means globalExtent[0] may greater than globalExtent[1],
+     * unless `asc` is input.
+     *
+     * @param {boolean} [asc]
+     * @return {Array.<number>}
+     */
+    getGlobalExtent: function (asc) {
+        var ret = this.getExtent();
+        ret[0] = this.toGlobalCoord(ret[0]);
+        ret[1] = this.toGlobalCoord(ret[1]);
+        asc && ret[0] > ret[1] && ret.reverse();
+        return ret;
+    },
+
+    getOtherAxis: function () {
+        this.grid.getOtherAxis();
+    },
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.coordToData(this.toLocalCoord(point[this.dim === 'x' ? 0 : 1]), clamp);
+    },
+
+    /**
+     * Transform global coord to local coord,
+     * i.e. var localCoord = axis.toLocalCoord(80);
+     * designate by module:echarts/coord/cartesian/Grid.
+     * @type {Function}
+     */
+    toLocalCoord: null,
+
+    /**
+     * Transform global coord to local coord,
+     * i.e. var globalCoord = axis.toLocalCoord(40);
+     * designate by module:echarts/coord/cartesian/Grid.
+     * @type {Function}
+     */
+    toGlobalCoord: null
+
+};
+
+inherits(Axis2D, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var defaultOption = {
+    show: true,
+    zlevel: 0,
+    z: 0,
+    // Inverse the axis.
+    inverse: false,
+
+    // Axis name displayed.
+    name: '',
+    // 'start' | 'middle' | 'end'
+    nameLocation: 'end',
+    // By degree. By defualt auto rotate by nameLocation.
+    nameRotate: null,
+    nameTruncate: {
+        maxWidth: null,
+        ellipsis: '...',
+        placeholder: '.'
+    },
+    // Use global text style by default.
+    nameTextStyle: {},
+    // The gap between axisName and axisLine.
+    nameGap: 15,
+
+    // Default `false` to support tooltip.
+    silent: false,
+    // Default `false` to avoid legacy user event listener fail.
+    triggerEvent: false,
+
+    tooltip: {
+        show: false
+    },
+
+    axisPointer: {},
+
+    axisLine: {
+        show: true,
+        onZero: true,
+        onZeroAxisIndex: null,
+        lineStyle: {
+            color: '#333',
+            width: 1,
+            type: 'solid'
+        },
+        // The arrow at both ends the the axis.
+        symbol: ['none', 'none'],
+        symbolSize: [10, 15]
+    },
+    axisTick: {
+        show: true,
+        // Whether axisTick is inside the grid or outside the grid.
+        inside: false,
+        // The length of axisTick.
+        length: 5,
+        lineStyle: {
+            width: 1
+        }
+    },
+    axisLabel: {
+        show: true,
+        // Whether axisLabel is inside the grid or outside the grid.
+        inside: false,
+        rotate: 0,
+        // true | false | null/undefined (auto)
+        showMinLabel: null,
+        // true | false | null/undefined (auto)
+        showMaxLabel: null,
+        margin: 8,
+        // formatter: null,
+        fontSize: 12
+    },
+    splitLine: {
+        show: true,
+        lineStyle: {
+            color: ['#ccc'],
+            width: 1,
+            type: 'solid'
+        }
+    },
+    splitArea: {
+        show: false,
+        areaStyle: {
+            color: ['rgba(250,250,250,0.3)','rgba(200,200,200,0.3)']
+        }
+    }
+};
+
+var axisDefault = {};
+
+axisDefault.categoryAxis = merge({
+    // The gap at both ends of the axis. For categoryAxis, boolean.
+    boundaryGap: true,
+    // Set false to faster category collection.
+    // Only usefull in the case like: category is
+    // ['2012-01-01', '2012-01-02', ...], where the input
+    // data has been ensured not duplicate and is large data.
+    // null means "auto":
+    // if axis.data provided, do not deduplication,
+    // else do deduplication.
+    deduplication: null,
+    // splitArea: {
+        // show: false
+    // },
+    splitLine: {
+        show: false
+    },
+    axisTick: {
+        // If tick is align with label when boundaryGap is true
+        alignWithLabel: false,
+        interval: 'auto'
+    },
+    axisLabel: {
+        interval: 'auto'
+    }
+}, defaultOption);
+
+axisDefault.valueAxis = merge({
+    // The gap at both ends of the axis. For value axis, [GAP, GAP], where
+    // `GAP` can be an absolute pixel number (like `35`), or percent (like `'30%'`)
+    boundaryGap: [0, 0],
+
+    // TODO
+    // min/max: [30, datamin, 60] or [20, datamin] or [datamin, 60]
+
+    // Min value of the axis. can be:
+    // + a number
+    // + 'dataMin': use the min value in data.
+    // + null/undefined: auto decide min value (consider pretty look and boundaryGap).
+    // min: null,
+
+    // Max value of the axis. can be:
+    // + a number
+    // + 'dataMax': use the max value in data.
+    // + null/undefined: auto decide max value (consider pretty look and boundaryGap).
+    // max: null,
+
+    // Readonly prop, specifies start value of the range when using data zoom.
+    // rangeStart: null
+
+    // Readonly prop, specifies end value of the range when using data zoom.
+    // rangeEnd: null
+
+    // Optional value can be:
+    // + `false`: always include value 0.
+    // + `true`: the extent do not consider value 0.
+    // scale: false,
+
+    // AxisTick and axisLabel and splitLine are caculated based on splitNumber.
+    splitNumber: 5
+
+    // Interval specifies the span of the ticks is mandatorily.
+    // interval: null
+
+    // Specify min interval when auto calculate tick interval.
+    // minInterval: null
+
+    // Specify max interval when auto calculate tick interval.
+    // maxInterval: null
+
+}, defaultOption);
+
+axisDefault.timeAxis = defaults({
+    scale: true,
+    min: 'dataMin',
+    max: 'dataMax'
+}, axisDefault.valueAxis);
+
+axisDefault.logAxis = defaults({
+    scale: true,
+    logBase: 10
+}, axisDefault.valueAxis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME axisType is fixed ?
+var AXIS_TYPES = ['value', 'category', 'time', 'log'];
+
+/**
+ * Generate sub axis model class
+ * @param {string} axisName 'x' 'y' 'radius' 'angle' 'parallel'
+ * @param {module:echarts/model/Component} BaseAxisModelClass
+ * @param {Function} axisTypeDefaulter
+ * @param {Object} [extraDefaultOption]
+ */
+var axisModelCreator = function (axisName, BaseAxisModelClass, axisTypeDefaulter, extraDefaultOption) {
+
+    each$1(AXIS_TYPES, function (axisType) {
+
+        BaseAxisModelClass.extend({
+
+            /**
+             * @readOnly
+             */
+            type: axisName + 'Axis.' + axisType,
+
+            mergeDefaultAndTheme: function (option, ecModel) {
+                var layoutMode = this.layoutMode;
+                var inputPositionParams = layoutMode
+                    ? getLayoutParams(option) : {};
+
+                var themeModel = ecModel.getTheme();
+                merge(option, themeModel.get(axisType + 'Axis'));
+                merge(option, this.getDefaultOption());
+
+                option.type = axisTypeDefaulter(axisName, option);
+
+                if (layoutMode) {
+                    mergeLayoutParam(option, inputPositionParams, layoutMode);
+                }
+            },
+
+            /**
+             * @override
+             */
+            optionUpdated: function () {
+                var thisOption = this.option;
+                if (thisOption.type === 'category') {
+                    this.__ordinalMeta = OrdinalMeta.createByAxisModel(this);
+                }
+            },
+
+            /**
+             * Should not be called before all of 'getInitailData' finished.
+             * Because categories are collected during initializing data.
+             */
+            getCategories: function (rawData) {
+                var option = this.option;
+                // FIXME
+                // warning if called before all of 'getInitailData' finished.
+                if (option.type === 'category') {
+                    if (rawData) {
+                        return option.data;
+                    }
+                    return this.__ordinalMeta.categories;
+                }
+            },
+
+            getOrdinalMeta: function () {
+                return this.__ordinalMeta;
+            },
+
+            defaultOption: mergeAll(
+                [
+                    {},
+                    axisDefault[axisType + 'Axis'],
+                    extraDefaultOption
+                ],
+                true
+            )
+        });
+    });
+
+    ComponentModel.registerSubTypeDefaulter(
+        axisName + 'Axis',
+        curry(axisTypeDefaulter, axisName)
+    );
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisModel = ComponentModel.extend({
+
+    type: 'cartesian2dAxis',
+
+    /**
+     * @type {module:echarts/coord/cartesian/Axis2D}
+     */
+    axis: null,
+
+    /**
+     * @override
+     */
+    init: function () {
+        AxisModel.superApply(this, 'init', arguments);
+        this.resetRange();
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function () {
+        AxisModel.superApply(this, 'mergeOption', arguments);
+        this.resetRange();
+    },
+
+    /**
+     * @override
+     */
+    restoreData: function () {
+        AxisModel.superApply(this, 'restoreData', arguments);
+        this.resetRange();
+    },
+
+    /**
+     * @override
+     * @return {module:echarts/model/Component}
+     */
+    getCoordSysModel: function () {
+        return this.ecModel.queryComponents({
+            mainType: 'grid',
+            index: this.option.gridIndex,
+            id: this.option.gridId
+        })[0];
+    }
+
+});
+
+function getAxisType(axisDim, option) {
+    // Default axis with data is category axis
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+merge(AxisModel.prototype, axisModelCommonMixin);
+
+var extraOption = {
+    // gridIndex: 0,
+    // gridId: '',
+
+    // Offset is for multiple axis on the same position
+    offset: 0
+};
+
+axisModelCreator('x', AxisModel, getAxisType, extraOption);
+axisModelCreator('y', AxisModel, getAxisType, extraOption);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Grid 是在有直角坐标系的时候必须要存在的
+// 所以这里也要被 Cartesian2D 依赖
+
+ComponentModel.extend({
+
+    type: 'grid',
+
+    dependencies: ['xAxis', 'yAxis'],
+
+    layoutMode: 'box',
+
+    /**
+     * @type {module:echarts/coord/cartesian/Grid}
+     */
+    coordinateSystem: null,
+
+    defaultOption: {
+        show: false,
+        zlevel: 0,
+        z: 0,
+        left: '10%',
+        top: 60,
+        right: '10%',
+        bottom: 60,
+        // If grid size contain label
+        containLabel: false,
+        // width: {totalWidth} - left - right,
+        // height: {totalHeight} - top - bottom,
+        backgroundColor: 'rgba(0,0,0,0)',
+        borderWidth: 1,
+        borderColor: '#ccc'
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Grid is a region which contains at most 4 cartesian systems
+ *
+ * TODO Default cartesian
+ */
+
+// Depends on GridModel, AxisModel, which performs preprocess.
+/**
+ * Check if the axis is used in the specified grid
+ * @inner
+ */
+function isAxisUsedInTheGrid(axisModel, gridModel, ecModel) {
+    return axisModel.getCoordSysModel() === gridModel;
+}
+
+function Grid(gridModel, ecModel, api) {
+    /**
+     * @type {Object.<string, module:echarts/coord/cartesian/Cartesian2D>}
+     * @private
+     */
+    this._coordsMap = {};
+
+    /**
+     * @type {Array.<module:echarts/coord/cartesian/Cartesian>}
+     * @private
+     */
+    this._coordsList = [];
+
+    /**
+     * @type {Object.<string, module:echarts/coord/cartesian/Axis2D>}
+     * @private
+     */
+    this._axesMap = {};
+
+    /**
+     * @type {Array.<module:echarts/coord/cartesian/Axis2D>}
+     * @private
+     */
+    this._axesList = [];
+
+    this._initCartesian(gridModel, ecModel, api);
+
+    this.model = gridModel;
+}
+
+var gridProto = Grid.prototype;
+
+gridProto.type = 'grid';
+
+gridProto.axisPointerEnabled = true;
+
+gridProto.getRect = function () {
+    return this._rect;
+};
+
+gridProto.update = function (ecModel, api) {
+
+    var axesMap = this._axesMap;
+
+    this._updateScale(ecModel, this.model);
+
+    each$1(axesMap.x, function (xAxis) {
+        niceScaleExtent(xAxis.scale, xAxis.model);
+    });
+    each$1(axesMap.y, function (yAxis) {
+        niceScaleExtent(yAxis.scale, yAxis.model);
+    });
+    each$1(axesMap.x, function (xAxis) {
+        fixAxisOnZero(axesMap, 'y', xAxis);
+    });
+    each$1(axesMap.y, function (yAxis) {
+        fixAxisOnZero(axesMap, 'x', yAxis);
+    });
+
+    // Resize again if containLabel is enabled
+    // FIXME It may cause getting wrong grid size in data processing stage
+    this.resize(this.model, api);
+};
+
+function fixAxisOnZero(axesMap, otherAxisDim, axis) {
+
+    axis.getAxesOnZeroOf = function () {
+        // TODO: onZero of multiple axes.
+        return otherAxis ? [otherAxis] : [];
+    };
+
+    // onZero can not be enabled in these two situations:
+    // 1. When any other axis is a category axis.
+    // 2. When no axis is cross 0 point.
+    var otherAxes = axesMap[otherAxisDim];
+
+    var otherAxis;
+    var axisModel = axis.model;
+    var onZero = axisModel.get('axisLine.onZero');
+    var onZeroAxisIndex = axisModel.get('axisLine.onZeroAxisIndex');
+
+    if (!onZero) {
+        return;
+    }
+
+    // If target axis is specified.
+    if (onZeroAxisIndex != null) {
+        if (canOnZeroToAxis(otherAxes[onZeroAxisIndex])) {
+            otherAxis = otherAxes[onZeroAxisIndex];
+        }
+        return;
+    }
+
+    // Find the first available other axis.
+    for (var idx in otherAxes) {
+        if (otherAxes.hasOwnProperty(idx) && canOnZeroToAxis(otherAxes[idx])) {
+            otherAxis = otherAxes[idx];
+            break;
+        }
+    }
+}
+
+function canOnZeroToAxis(axis) {
+    return axis && axis.type !== 'category' && axis.type !== 'time' && ifAxisCrossZero(axis);
+}
+
+/**
+ * Resize the grid
+ * @param {module:echarts/coord/cartesian/GridModel} gridModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+gridProto.resize = function (gridModel, api, ignoreContainLabel) {
+
+    var gridRect = getLayoutRect(
+        gridModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        });
+
+    this._rect = gridRect;
+
+    var axesList = this._axesList;
+
+    adjustAxes();
+
+    // Minus label size
+    if (!ignoreContainLabel && gridModel.get('containLabel')) {
+        each$1(axesList, function (axis) {
+            if (!axis.model.get('axisLabel.inside')) {
+                var labelUnionRect = estimateLabelUnionRect(axis);
+                if (labelUnionRect) {
+                    var dim = axis.isHorizontal() ? 'height' : 'width';
+                    var margin = axis.model.get('axisLabel.margin');
+                    gridRect[dim] -= labelUnionRect[dim] + margin;
+                    if (axis.position === 'top') {
+                        gridRect.y += labelUnionRect.height + margin;
+                    }
+                    else if (axis.position === 'left')  {
+                        gridRect.x += labelUnionRect.width + margin;
+                    }
+                }
+            }
+        });
+
+        adjustAxes();
+    }
+
+    function adjustAxes() {
+        each$1(axesList, function (axis) {
+            var isHorizontal = axis.isHorizontal();
+            var extent = isHorizontal ? [0, gridRect.width] : [0, gridRect.height];
+            var idx = axis.inverse ? 1 : 0;
+            axis.setExtent(extent[idx], extent[1 - idx]);
+            updateAxisTransform(axis, isHorizontal ? gridRect.x : gridRect.y);
+        });
+    }
+};
+
+/**
+ * @param {string} axisType
+ * @param {number} [axisIndex]
+ */
+gridProto.getAxis = function (axisType, axisIndex) {
+    var axesMapOnDim = this._axesMap[axisType];
+    if (axesMapOnDim != null) {
+        if (axisIndex == null) {
+            // Find first axis
+            for (var name in axesMapOnDim) {
+                if (axesMapOnDim.hasOwnProperty(name)) {
+                    return axesMapOnDim[name];
+                }
+            }
+        }
+        return axesMapOnDim[axisIndex];
+    }
+};
+
+/**
+ * @return {Array.<module:echarts/coord/Axis>}
+ */
+gridProto.getAxes = function () {
+    return this._axesList.slice();
+};
+
+/**
+ * Usage:
+ *      grid.getCartesian(xAxisIndex, yAxisIndex);
+ *      grid.getCartesian(xAxisIndex);
+ *      grid.getCartesian(null, yAxisIndex);
+ *      grid.getCartesian({xAxisIndex: ..., yAxisIndex: ...});
+ *
+ * @param {number|Object} [xAxisIndex]
+ * @param {number} [yAxisIndex]
+ */
+gridProto.getCartesian = function (xAxisIndex, yAxisIndex) {
+    if (xAxisIndex != null && yAxisIndex != null) {
+        var key = 'x' + xAxisIndex + 'y' + yAxisIndex;
+        return this._coordsMap[key];
+    }
+
+    if (isObject$1(xAxisIndex)) {
+        yAxisIndex = xAxisIndex.yAxisIndex;
+        xAxisIndex = xAxisIndex.xAxisIndex;
+    }
+    // When only xAxisIndex or yAxisIndex given, find its first cartesian.
+    for (var i = 0, coordList = this._coordsList; i < coordList.length; i++) {
+        if (coordList[i].getAxis('x').index === xAxisIndex
+            || coordList[i].getAxis('y').index === yAxisIndex
+        ) {
+            return coordList[i];
+        }
+    }
+};
+
+gridProto.getCartesians = function () {
+    return this._coordsList.slice();
+};
+
+/**
+ * @implements
+ * see {module:echarts/CoodinateSystem}
+ */
+gridProto.convertToPixel = function (ecModel, finder, value) {
+    var target = this._findConvertTarget(ecModel, finder);
+
+    return target.cartesian
+        ? target.cartesian.dataToPoint(value)
+        : target.axis
+        ? target.axis.toGlobalCoord(target.axis.dataToCoord(value))
+        : null;
+};
+
+/**
+ * @implements
+ * see {module:echarts/CoodinateSystem}
+ */
+gridProto.convertFromPixel = function (ecModel, finder, value) {
+    var target = this._findConvertTarget(ecModel, finder);
+
+    return target.cartesian
+        ? target.cartesian.pointToData(value)
+        : target.axis
+        ? target.axis.coordToData(target.axis.toLocalCoord(value))
+        : null;
+};
+
+/**
+ * @inner
+ */
+gridProto._findConvertTarget = function (ecModel, finder) {
+    var seriesModel = finder.seriesModel;
+    var xAxisModel = finder.xAxisModel
+        || (seriesModel && seriesModel.getReferringComponents('xAxis')[0]);
+    var yAxisModel = finder.yAxisModel
+        || (seriesModel && seriesModel.getReferringComponents('yAxis')[0]);
+    var gridModel = finder.gridModel;
+    var coordsList = this._coordsList;
+    var cartesian;
+    var axis;
+
+    if (seriesModel) {
+        cartesian = seriesModel.coordinateSystem;
+        indexOf(coordsList, cartesian) < 0 && (cartesian = null);
+    }
+    else if (xAxisModel && yAxisModel) {
+        cartesian = this.getCartesian(xAxisModel.componentIndex, yAxisModel.componentIndex);
+    }
+    else if (xAxisModel) {
+        axis = this.getAxis('x', xAxisModel.componentIndex);
+    }
+    else if (yAxisModel) {
+        axis = this.getAxis('y', yAxisModel.componentIndex);
+    }
+    // Lowest priority.
+    else if (gridModel) {
+        var grid = gridModel.coordinateSystem;
+        if (grid === this) {
+            cartesian = this._coordsList[0];
+        }
+    }
+
+    return {cartesian: cartesian, axis: axis};
+};
+
+/**
+ * @implements
+ * see {module:echarts/CoodinateSystem}
+ */
+gridProto.containPoint = function (point) {
+    var coord = this._coordsList[0];
+    if (coord) {
+        return coord.containPoint(point);
+    }
+};
+
+/**
+ * Initialize cartesian coordinate systems
+ * @private
+ */
+gridProto._initCartesian = function (gridModel, ecModel, api) {
+    var axisPositionUsed = {
+        left: false,
+        right: false,
+        top: false,
+        bottom: false
+    };
+
+    var axesMap = {
+        x: {},
+        y: {}
+    };
+    var axesCount = {
+        x: 0,
+        y: 0
+    };
+
+    /// Create axis
+    ecModel.eachComponent('xAxis', createAxisCreator('x'), this);
+    ecModel.eachComponent('yAxis', createAxisCreator('y'), this);
+
+    if (!axesCount.x || !axesCount.y) {
+        // Roll back when there no either x or y axis
+        this._axesMap = {};
+        this._axesList = [];
+        return;
+    }
+
+    this._axesMap = axesMap;
+
+    /// Create cartesian2d
+    each$1(axesMap.x, function (xAxis, xAxisIndex) {
+        each$1(axesMap.y, function (yAxis, yAxisIndex) {
+            var key = 'x' + xAxisIndex + 'y' + yAxisIndex;
+            var cartesian = new Cartesian2D(key);
+
+            cartesian.grid = this;
+            cartesian.model = gridModel;
+
+            this._coordsMap[key] = cartesian;
+            this._coordsList.push(cartesian);
+
+            cartesian.addAxis(xAxis);
+            cartesian.addAxis(yAxis);
+        }, this);
+    }, this);
+
+    function createAxisCreator(axisType) {
+        return function (axisModel, idx) {
+            if (!isAxisUsedInTheGrid(axisModel, gridModel, ecModel)) {
+                return;
+            }
+
+            var axisPosition = axisModel.get('position');
+            if (axisType === 'x') {
+                // Fix position
+                if (axisPosition !== 'top' && axisPosition !== 'bottom') {
+                    // Default bottom of X
+                    axisPosition = 'bottom';
+                    if (axisPositionUsed[axisPosition]) {
+                        axisPosition = axisPosition === 'top' ? 'bottom' : 'top';
+                    }
+                }
+            }
+            else {
+                // Fix position
+                if (axisPosition !== 'left' && axisPosition !== 'right') {
+                    // Default left of Y
+                    axisPosition = 'left';
+                    if (axisPositionUsed[axisPosition]) {
+                        axisPosition = axisPosition === 'left' ? 'right' : 'left';
+                    }
+                }
+            }
+            axisPositionUsed[axisPosition] = true;
+
+            var axis = new Axis2D(
+                axisType, createScaleByModel(axisModel),
+                [0, 0],
+                axisModel.get('type'),
+                axisPosition
+            );
+
+            var isCategory = axis.type === 'category';
+            axis.onBand = isCategory && axisModel.get('boundaryGap');
+            axis.inverse = axisModel.get('inverse');
+
+            // Inject axis into axisModel
+            axisModel.axis = axis;
+
+            // Inject axisModel into axis
+            axis.model = axisModel;
+
+            // Inject grid info axis
+            axis.grid = this;
+
+            // Index of axis, can be used as key
+            axis.index = idx;
+
+            this._axesList.push(axis);
+
+            axesMap[axisType][idx] = axis;
+            axesCount[axisType]++;
+        };
+    }
+};
+
+/**
+ * Update cartesian properties from series
+ * @param  {module:echarts/model/Option} option
+ * @private
+ */
+gridProto._updateScale = function (ecModel, gridModel) {
+    // Reset scale
+    each$1(this._axesList, function (axis) {
+        axis.scale.setExtent(Infinity, -Infinity);
+    });
+    ecModel.eachSeries(function (seriesModel) {
+        if (isCartesian2D(seriesModel)) {
+            var axesModels = findAxesModels(seriesModel, ecModel);
+            var xAxisModel = axesModels[0];
+            var yAxisModel = axesModels[1];
+
+            if (!isAxisUsedInTheGrid(xAxisModel, gridModel, ecModel)
+                || !isAxisUsedInTheGrid(yAxisModel, gridModel, ecModel)
+            ) {
+                return;
+            }
+
+            var cartesian = this.getCartesian(
+                xAxisModel.componentIndex, yAxisModel.componentIndex
+            );
+            var data = seriesModel.getData();
+            var xAxis = cartesian.getAxis('x');
+            var yAxis = cartesian.getAxis('y');
+
+            if (data.type === 'list') {
+                unionExtent(data, xAxis, seriesModel);
+                unionExtent(data, yAxis, seriesModel);
+            }
+        }
+    }, this);
+
+    function unionExtent(data, axis, seriesModel) {
+        each$1(data.mapDimension(axis.dim, true), function (dim) {
+            axis.scale.unionExtentFromData(
+                // For example, the extent of the orginal dimension
+                // is [0.1, 0.5], the extent of the `stackResultDimension`
+                // is [7, 9], the final extent should not include [0.1, 0.5].
+                data, getStackedDimension(data, dim)
+            );
+        });
+    }
+};
+
+/**
+ * @param {string} [dim] 'x' or 'y' or 'auto' or null/undefined
+ * @return {Object} {baseAxes: [], otherAxes: []}
+ */
+gridProto.getTooltipAxes = function (dim) {
+    var baseAxes = [];
+    var otherAxes = [];
+
+    each$1(this.getCartesians(), function (cartesian) {
+        var baseAxis = (dim != null && dim !== 'auto')
+            ? cartesian.getAxis(dim) : cartesian.getBaseAxis();
+        var otherAxis = cartesian.getOtherAxis(baseAxis);
+        indexOf(baseAxes, baseAxis) < 0 && baseAxes.push(baseAxis);
+        indexOf(otherAxes, otherAxis) < 0 && otherAxes.push(otherAxis);
+    });
+
+    return {baseAxes: baseAxes, otherAxes: otherAxes};
+};
+
+/**
+ * @inner
+ */
+function updateAxisTransform(axis, coordBase) {
+    var axisExtent = axis.getExtent();
+    var axisExtentSum = axisExtent[0] + axisExtent[1];
+
+    // Fast transform
+    axis.toGlobalCoord = axis.dim === 'x'
+        ? function (coord) {
+            return coord + coordBase;
+        }
+        : function (coord) {
+            return axisExtentSum - coord + coordBase;
+        };
+    axis.toLocalCoord = axis.dim === 'x'
+        ? function (coord) {
+            return coord - coordBase;
+        }
+        : function (coord) {
+            return axisExtentSum - coord + coordBase;
+        };
+}
+
+var axesTypes = ['xAxis', 'yAxis'];
+/**
+ * @inner
+ */
+function findAxesModels(seriesModel, ecModel) {
+    return map(axesTypes, function (axisType) {
+        var axisModel = seriesModel.getReferringComponents(axisType)[0];
+
+        if (__DEV__) {
+            if (!axisModel) {
+                throw new Error(axisType + ' "' + retrieve(
+                    seriesModel.get(axisType + 'Index'),
+                    seriesModel.get(axisType + 'Id'),
+                    0
+                ) + '" not found');
+            }
+        }
+        return axisModel;
+    });
+}
+
+/**
+ * @inner
+ */
+function isCartesian2D(seriesModel) {
+    return seriesModel.get('coordinateSystem') === 'cartesian2d';
+}
+
+Grid.create = function (ecModel, api) {
+    var grids = [];
+    ecModel.eachComponent('grid', function (gridModel, idx) {
+        var grid = new Grid(gridModel, ecModel, api);
+        grid.name = 'grid_' + idx;
+        // dataSampling requires axis extent, so resize
+        // should be performed in create stage.
+        grid.resize(gridModel, api, true);
+
+        gridModel.coordinateSystem = grid;
+
+        grids.push(grid);
+    });
+
+    // Inject the coordinateSystems into seriesModel
+    ecModel.eachSeries(function (seriesModel) {
+        if (!isCartesian2D(seriesModel)) {
+            return;
+        }
+
+        var axesModels = findAxesModels(seriesModel, ecModel);
+        var xAxisModel = axesModels[0];
+        var yAxisModel = axesModels[1];
+
+        var gridModel = xAxisModel.getCoordSysModel();
+
+        if (__DEV__) {
+            if (!gridModel) {
+                throw new Error(
+                    'Grid "' + retrieve(
+                        xAxisModel.get('gridIndex'),
+                        xAxisModel.get('gridId'),
+                        0
+                    ) + '" not found'
+                );
+            }
+            if (xAxisModel.getCoordSysModel() !== yAxisModel.getCoordSysModel()) {
+                throw new Error('xAxis and yAxis must use the same grid');
+            }
+        }
+
+        var grid = gridModel.coordinateSystem;
+
+        seriesModel.coordinateSystem = grid.getCartesian(
+            xAxisModel.componentIndex, yAxisModel.componentIndex
+        );
+    });
+
+    return grids;
+};
+
+// For deciding which dimensions to use when creating list data
+Grid.dimensions = Grid.prototype.dimensions = Cartesian2D.prototype.dimensions;
+
+CoordinateSystemManager.register('cartesian2d', Grid);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PI$2 = Math.PI;
+
+function makeAxisEventDataBase(axisModel) {
+    var eventData = {
+        componentType: axisModel.mainType
+    };
+    eventData[axisModel.mainType + 'Index'] = axisModel.componentIndex;
+    return eventData;
+}
+
+/**
+ * A final axis is translated and rotated from a "standard axis".
+ * So opt.position and opt.rotation is required.
+ *
+ * A standard axis is and axis from [0, 0] to [0, axisExtent[1]],
+ * for example: (0, 0) ------------> (0, 50)
+ *
+ * nameDirection or tickDirection or labelDirection is 1 means tick
+ * or label is below the standard axis, whereas is -1 means above
+ * the standard axis. labelOffset means offset between label and axis,
+ * which is useful when 'onZero', where axisLabel is in the grid and
+ * label in outside grid.
+ *
+ * Tips: like always,
+ * positive rotation represents anticlockwise, and negative rotation
+ * represents clockwise.
+ * The direction of position coordinate is the same as the direction
+ * of screen coordinate.
+ *
+ * Do not need to consider axis 'inverse', which is auto processed by
+ * axis extent.
+ *
+ * @param {module:zrender/container/Group} group
+ * @param {Object} axisModel
+ * @param {Object} opt Standard axis parameters.
+ * @param {Array.<number>} opt.position [x, y]
+ * @param {number} opt.rotation by radian
+ * @param {number} [opt.nameDirection=1] 1 or -1 Used when nameLocation is 'middle' or 'center'.
+ * @param {number} [opt.tickDirection=1] 1 or -1
+ * @param {number} [opt.labelDirection=1] 1 or -1
+ * @param {number} [opt.labelOffset=0] Usefull when onZero.
+ * @param {string} [opt.axisLabelShow] default get from axisModel.
+ * @param {string} [opt.axisName] default get from axisModel.
+ * @param {number} [opt.axisNameAvailableWidth]
+ * @param {number} [opt.labelRotate] by degree, default get from axisModel.
+ * @param {number} [opt.strokeContainThreshold] Default label interval when label
+ * @param {number} [opt.nameTruncateMaxWidth]
+ */
+var AxisBuilder = function (axisModel, opt) {
+
+    /**
+     * @readOnly
+     */
+    this.opt = opt;
+
+    /**
+     * @readOnly
+     */
+    this.axisModel = axisModel;
+
+    // Default value
+    defaults(
+        opt,
+        {
+            labelOffset: 0,
+            nameDirection: 1,
+            tickDirection: 1,
+            labelDirection: 1,
+            silent: true
+        }
+    );
+
+    /**
+     * @readOnly
+     */
+    this.group = new Group();
+
+    // FIXME Not use a seperate text group?
+    var dumbGroup = new Group({
+        position: opt.position.slice(),
+        rotation: opt.rotation
+    });
+
+    // this.group.add(dumbGroup);
+    // this._dumbGroup = dumbGroup;
+
+    dumbGroup.updateTransform();
+    this._transform = dumbGroup.transform;
+
+    this._dumbGroup = dumbGroup;
+};
+
+AxisBuilder.prototype = {
+
+    constructor: AxisBuilder,
+
+    hasBuilder: function (name) {
+        return !!builders[name];
+    },
+
+    add: function (name) {
+        builders[name].call(this);
+    },
+
+    getGroup: function () {
+        return this.group;
+    }
+
+};
+
+var builders = {
+
+    /**
+     * @private
+     */
+    axisLine: function () {
+        var opt = this.opt;
+        var axisModel = this.axisModel;
+
+        if (!axisModel.get('axisLine.show')) {
+            return;
+        }
+
+        var extent = this.axisModel.axis.getExtent();
+
+        var matrix = this._transform;
+        var pt1 = [extent[0], 0];
+        var pt2 = [extent[1], 0];
+        if (matrix) {
+            applyTransform(pt1, pt1, matrix);
+            applyTransform(pt2, pt2, matrix);
+        }
+
+        var lineStyle = extend(
+            {
+                lineCap: 'round'
+            },
+            axisModel.getModel('axisLine.lineStyle').getLineStyle()
+        );
+
+        this.group.add(new Line(subPixelOptimizeLine({
+            // Id for animation
+            anid: 'line',
+
+            shape: {
+                x1: pt1[0],
+                y1: pt1[1],
+                x2: pt2[0],
+                y2: pt2[1]
+            },
+            style: lineStyle,
+            strokeContainThreshold: opt.strokeContainThreshold || 5,
+            silent: true,
+            z2: 1
+        })));
+
+        var arrows = axisModel.get('axisLine.symbol');
+        var arrowSize = axisModel.get('axisLine.symbolSize');
+
+        var arrowOffset = axisModel.get('axisLine.symbolOffset') || 0;
+        if (typeof arrowOffset === 'number') {
+            arrowOffset = [arrowOffset, arrowOffset];
+        }
+
+        if (arrows != null) {
+            if (typeof arrows === 'string') {
+                // Use the same arrow for start and end point
+                arrows = [arrows, arrows];
+            }
+            if (typeof arrowSize === 'string'
+                || typeof arrowSize === 'number'
+            ) {
+                // Use the same size for width and height
+                arrowSize = [arrowSize, arrowSize];
+            }
+
+            var symbolWidth = arrowSize[0];
+            var symbolHeight = arrowSize[1];
+
+            each$1([{
+                rotate: opt.rotation + Math.PI / 2,
+                offset: arrowOffset[0],
+                r: 0
+            }, {
+                rotate: opt.rotation - Math.PI / 2,
+                offset: arrowOffset[1],
+                r: Math.sqrt((pt1[0] - pt2[0]) * (pt1[0] - pt2[0])
+                    + (pt1[1] - pt2[1]) * (pt1[1] - pt2[1]))
+            }], function (point, index) {
+                if (arrows[index] !== 'none' && arrows[index] != null) {
+                    var symbol = createSymbol(
+                        arrows[index],
+                        -symbolWidth / 2,
+                        -symbolHeight / 2,
+                        symbolWidth,
+                        symbolHeight,
+                        lineStyle.stroke,
+                        true
+                    );
+
+                    // Calculate arrow position with offset
+                    var r = point.r + point.offset;
+                    var pos = [
+                        pt1[0] + r * Math.cos(opt.rotation),
+                        pt1[1] - r * Math.sin(opt.rotation)
+                    ];
+
+                    symbol.attr({
+                        rotation: point.rotate,
+                        position: pos,
+                        silent: true
+                    });
+                    this.group.add(symbol);
+                }
+            }, this);
+        }
+    },
+
+    /**
+     * @private
+     */
+    axisTickLabel: function () {
+        var axisModel = this.axisModel;
+        var opt = this.opt;
+
+        var tickEls = buildAxisTick(this, axisModel, opt);
+        var labelEls = buildAxisLabel(this, axisModel, opt);
+
+        fixMinMaxLabelShow(axisModel, labelEls, tickEls);
+    },
+
+    /**
+     * @private
+     */
+    axisName: function () {
+        var opt = this.opt;
+        var axisModel = this.axisModel;
+        var name = retrieve(opt.axisName, axisModel.get('name'));
+
+        if (!name) {
+            return;
+        }
+
+        var nameLocation = axisModel.get('nameLocation');
+        var nameDirection = opt.nameDirection;
+        var textStyleModel = axisModel.getModel('nameTextStyle');
+        var gap = axisModel.get('nameGap') || 0;
+
+        var extent = this.axisModel.axis.getExtent();
+        var gapSignal = extent[0] > extent[1] ? -1 : 1;
+        var pos = [
+            nameLocation === 'start'
+                ? extent[0] - gapSignal * gap
+                : nameLocation === 'end'
+                ? extent[1] + gapSignal * gap
+                : (extent[0] + extent[1]) / 2, // 'middle'
+            // Reuse labelOffset.
+            isNameLocationCenter(nameLocation) ? opt.labelOffset + nameDirection * gap : 0
+        ];
+
+        var labelLayout;
+
+        var nameRotation = axisModel.get('nameRotate');
+        if (nameRotation != null) {
+            nameRotation = nameRotation * PI$2 / 180; // To radian.
+        }
+
+        var axisNameAvailableWidth;
+
+        if (isNameLocationCenter(nameLocation)) {
+            labelLayout = innerTextLayout(
+                opt.rotation,
+                nameRotation != null ? nameRotation : opt.rotation, // Adapt to axis.
+                nameDirection
+            );
+        }
+        else {
+            labelLayout = endTextLayout(
+                opt, nameLocation, nameRotation || 0, extent
+            );
+
+            axisNameAvailableWidth = opt.axisNameAvailableWidth;
+            if (axisNameAvailableWidth != null) {
+                axisNameAvailableWidth = Math.abs(
+                    axisNameAvailableWidth / Math.sin(labelLayout.rotation)
+                );
+                !isFinite(axisNameAvailableWidth) && (axisNameAvailableWidth = null);
+            }
+        }
+
+        var textFont = textStyleModel.getFont();
+
+        var truncateOpt = axisModel.get('nameTruncate', true) || {};
+        var ellipsis = truncateOpt.ellipsis;
+        var maxWidth = retrieve(
+            opt.nameTruncateMaxWidth, truncateOpt.maxWidth, axisNameAvailableWidth
+        );
+        // FIXME
+        // truncate rich text? (consider performance)
+        var truncatedText = (ellipsis != null && maxWidth != null)
+            ? truncateText$1(
+                name, maxWidth, textFont, ellipsis,
+                {minChar: 2, placeholder: truncateOpt.placeholder}
+            )
+            : name;
+
+        var tooltipOpt = axisModel.get('tooltip', true);
+
+        var mainType = axisModel.mainType;
+        var formatterParams = {
+            componentType: mainType,
+            name: name,
+            $vars: ['name']
+        };
+        formatterParams[mainType + 'Index'] = axisModel.componentIndex;
+
+        var textEl = new Text({
+            // Id for animation
+            anid: 'name',
+
+            __fullText: name,
+            __truncatedText: truncatedText,
+
+            position: pos,
+            rotation: labelLayout.rotation,
+            silent: isSilent(axisModel),
+            z2: 1,
+            tooltip: (tooltipOpt && tooltipOpt.show)
+                ? extend({
+                    content: name,
+                    formatter: function () {
+                        return name;
+                    },
+                    formatterParams: formatterParams
+                }, tooltipOpt)
+                : null
+        });
+
+        setTextStyle(textEl.style, textStyleModel, {
+            text: truncatedText,
+            textFont: textFont,
+            textFill: textStyleModel.getTextColor()
+                || axisModel.get('axisLine.lineStyle.color'),
+            textAlign: labelLayout.textAlign,
+            textVerticalAlign: labelLayout.textVerticalAlign
+        });
+
+        if (axisModel.get('triggerEvent')) {
+            textEl.eventData = makeAxisEventDataBase(axisModel);
+            textEl.eventData.targetType = 'axisName';
+            textEl.eventData.name = name;
+        }
+
+        // FIXME
+        this._dumbGroup.add(textEl);
+        textEl.updateTransform();
+
+        this.group.add(textEl);
+
+        textEl.decomposeTransform();
+    }
+
+};
+
+/**
+ * @public
+ * @static
+ * @param {Object} opt
+ * @param {number} axisRotation in radian
+ * @param {number} textRotation in radian
+ * @param {number} direction
+ * @return {Object} {
+ *  rotation, // according to axis
+ *  textAlign,
+ *  textVerticalAlign
+ * }
+ */
+var innerTextLayout = AxisBuilder.innerTextLayout = function (axisRotation, textRotation, direction) {
+    var rotationDiff = remRadian(textRotation - axisRotation);
+    var textAlign;
+    var textVerticalAlign;
+
+    if (isRadianAroundZero(rotationDiff)) { // Label is parallel with axis line.
+        textVerticalAlign = direction > 0 ? 'top' : 'bottom';
+        textAlign = 'center';
+    }
+    else if (isRadianAroundZero(rotationDiff - PI$2)) { // Label is inverse parallel with axis line.
+        textVerticalAlign = direction > 0 ? 'bottom' : 'top';
+        textAlign = 'center';
+    }
+    else {
+        textVerticalAlign = 'middle';
+
+        if (rotationDiff > 0 && rotationDiff < PI$2) {
+            textAlign = direction > 0 ? 'right' : 'left';
+        }
+        else {
+            textAlign = direction > 0 ? 'left' : 'right';
+        }
+    }
+
+    return {
+        rotation: rotationDiff,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+};
+
+function endTextLayout(opt, textPosition, textRotate, extent) {
+    var rotationDiff = remRadian(textRotate - opt.rotation);
+    var textAlign;
+    var textVerticalAlign;
+    var inverse = extent[0] > extent[1];
+    var onLeft = (textPosition === 'start' && !inverse)
+        || (textPosition !== 'start' && inverse);
+
+    if (isRadianAroundZero(rotationDiff - PI$2 / 2)) {
+        textVerticalAlign = onLeft ? 'bottom' : 'top';
+        textAlign = 'center';
+    }
+    else if (isRadianAroundZero(rotationDiff - PI$2 * 1.5)) {
+        textVerticalAlign = onLeft ? 'top' : 'bottom';
+        textAlign = 'center';
+    }
+    else {
+        textVerticalAlign = 'middle';
+        if (rotationDiff < PI$2 * 1.5 && rotationDiff > PI$2 / 2) {
+            textAlign = onLeft ? 'left' : 'right';
+        }
+        else {
+            textAlign = onLeft ? 'right' : 'left';
+        }
+    }
+
+    return {
+        rotation: rotationDiff,
+        textAlign: textAlign,
+        textVerticalAlign: textVerticalAlign
+    };
+}
+
+function isSilent(axisModel) {
+    var tooltipOpt = axisModel.get('tooltip');
+    return axisModel.get('silent')
+        // Consider mouse cursor, add these restrictions.
+        || !(
+            axisModel.get('triggerEvent') || (tooltipOpt && tooltipOpt.show)
+        );
+}
+
+function fixMinMaxLabelShow(axisModel, labelEls, tickEls) {
+    // If min or max are user set, we need to check
+    // If the tick on min(max) are overlap on their neighbour tick
+    // If they are overlapped, we need to hide the min(max) tick label
+    var showMinLabel = axisModel.get('axisLabel.showMinLabel');
+    var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');
+
+    // FIXME
+    // Have not consider onBand yet, where tick els is more than label els.
+
+    labelEls = labelEls || [];
+    tickEls = tickEls || [];
+
+    var firstLabel = labelEls[0];
+    var nextLabel = labelEls[1];
+    var lastLabel = labelEls[labelEls.length - 1];
+    var prevLabel = labelEls[labelEls.length - 2];
+
+    var firstTick = tickEls[0];
+    var nextTick = tickEls[1];
+    var lastTick = tickEls[tickEls.length - 1];
+    var prevTick = tickEls[tickEls.length - 2];
+
+    if (showMinLabel === false) {
+        ignoreEl(firstLabel);
+        ignoreEl(firstTick);
+    }
+    else if (isTwoLabelOverlapped(firstLabel, nextLabel)) {
+        if (showMinLabel) {
+            ignoreEl(nextLabel);
+            ignoreEl(nextTick);
+        }
+        else {
+            ignoreEl(firstLabel);
+            ignoreEl(firstTick);
+        }
+    }
+
+    if (showMaxLabel === false) {
+        ignoreEl(lastLabel);
+        ignoreEl(lastTick);
+    }
+    else if (isTwoLabelOverlapped(prevLabel, lastLabel)) {
+        if (showMaxLabel) {
+            ignoreEl(prevLabel);
+            ignoreEl(prevTick);
+        }
+        else {
+            ignoreEl(lastLabel);
+            ignoreEl(lastTick);
+        }
+    }
+}
+
+function ignoreEl(el) {
+    el && (el.ignore = true);
+}
+
+function isTwoLabelOverlapped(current, next, labelLayout) {
+    // current and next has the same rotation.
+    var firstRect = current && current.getBoundingRect().clone();
+    var nextRect = next && next.getBoundingRect().clone();
+
+    if (!firstRect || !nextRect) {
+        return;
+    }
+
+    // When checking intersect of two rotated labels, we use mRotationBack
+    // to avoid that boundingRect is enlarge when using `boundingRect.applyTransform`.
+    var mRotationBack = identity([]);
+    rotate(mRotationBack, mRotationBack, -current.rotation);
+
+    firstRect.applyTransform(mul$1([], mRotationBack, current.getLocalTransform()));
+    nextRect.applyTransform(mul$1([], mRotationBack, next.getLocalTransform()));
+
+    return firstRect.intersect(nextRect);
+}
+
+function isNameLocationCenter(nameLocation) {
+    return nameLocation === 'middle' || nameLocation === 'center';
+}
+
+function buildAxisTick(axisBuilder, axisModel, opt) {
+    var axis = axisModel.axis;
+
+    if (!axisModel.get('axisTick.show') || axis.scale.isBlank()) {
+        return;
+    }
+
+    var tickModel = axisModel.getModel('axisTick');
+
+    var lineStyleModel = tickModel.getModel('lineStyle');
+    var tickLen = tickModel.get('length');
+
+    var ticksCoords = axis.getTicksCoords();
+
+    var pt1 = [];
+    var pt2 = [];
+    var matrix = axisBuilder._transform;
+
+    var tickEls = [];
+
+    for (var i = 0; i < ticksCoords.length; i++) {
+        var tickCoord = ticksCoords[i].coord;
+
+        pt1[0] = tickCoord;
+        pt1[1] = 0;
+        pt2[0] = tickCoord;
+        pt2[1] = opt.tickDirection * tickLen;
+
+        if (matrix) {
+            applyTransform(pt1, pt1, matrix);
+            applyTransform(pt2, pt2, matrix);
+        }
+        // Tick line, Not use group transform to have better line draw
+        var tickEl = new Line(subPixelOptimizeLine({
+            // Id for animation
+            anid: 'tick_' + ticksCoords[i].tickValue,
+
+            shape: {
+                x1: pt1[0],
+                y1: pt1[1],
+                x2: pt2[0],
+                y2: pt2[1]
+            },
+            style: defaults(
+                lineStyleModel.getLineStyle(),
+                {
+                    stroke: axisModel.get('axisLine.lineStyle.color')
+                }
+            ),
+            z2: 2,
+            silent: true
+        }));
+        axisBuilder.group.add(tickEl);
+        tickEls.push(tickEl);
+    }
+
+    return tickEls;
+}
+
+function buildAxisLabel(axisBuilder, axisModel, opt) {
+    var axis = axisModel.axis;
+    var show = retrieve(opt.axisLabelShow, axisModel.get('axisLabel.show'));
+
+    if (!show || axis.scale.isBlank()) {
+        return;
+    }
+
+    var labelModel = axisModel.getModel('axisLabel');
+    var labelMargin = labelModel.get('margin');
+    var labels = axis.getViewLabels();
+
+    // Special label rotate.
+    var labelRotation = (
+        retrieve(opt.labelRotate, labelModel.get('rotate')) || 0
+    ) * PI$2 / 180;
+
+    var labelLayout = innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
+    var rawCategoryData = axisModel.getCategories(true);
+
+    var labelEls = [];
+    var silent = isSilent(axisModel);
+    var triggerEvent = axisModel.get('triggerEvent');
+
+    each$1(labels, function (labelItem, index) {
+        var tickValue = labelItem.tickValue;
+        var formattedLabel = labelItem.formattedLabel;
+        var rawLabel = labelItem.rawLabel;
+
+        var itemLabelModel = labelModel;
+        if (rawCategoryData && rawCategoryData[tickValue] && rawCategoryData[tickValue].textStyle) {
+            itemLabelModel = new Model(
+                rawCategoryData[tickValue].textStyle, labelModel, axisModel.ecModel
+            );
+        }
+
+        var textColor = itemLabelModel.getTextColor()
+            || axisModel.get('axisLine.lineStyle.color');
+
+        var tickCoord = axis.dataToCoord(tickValue);
+        var pos = [
+            tickCoord,
+            opt.labelOffset + opt.labelDirection * labelMargin
+        ];
+
+        var textEl = new Text({
+            // Id for animation
+            anid: 'label_' + tickValue,
+            position: pos,
+            rotation: labelLayout.rotation,
+            silent: silent,
+            z2: 10
+        });
+
+        setTextStyle(textEl.style, itemLabelModel, {
+            text: formattedLabel,
+            textAlign: itemLabelModel.getShallow('align', true)
+                || labelLayout.textAlign,
+            textVerticalAlign: itemLabelModel.getShallow('verticalAlign', true)
+                || itemLabelModel.getShallow('baseline', true)
+                || labelLayout.textVerticalAlign,
+            textFill: typeof textColor === 'function'
+                ? textColor(
+                    // (1) In category axis with data zoom, tick is not the original
+                    // index of axis.data. So tick should not be exposed to user
+                    // in category axis.
+                    // (2) Compatible with previous version, which always use formatted label as
+                    // input. But in interval scale the formatted label is like '223,445', which
+                    // maked user repalce ','. So we modify it to return original val but remain
+                    // it as 'string' to avoid error in replacing.
+                    axis.type === 'category'
+                        ? rawLabel
+                        : axis.type === 'value'
+                        ? tickValue + ''
+                        : tickValue,
+                    index
+                )
+                : textColor
+        });
+
+        // Pack data for mouse event
+        if (triggerEvent) {
+            textEl.eventData = makeAxisEventDataBase(axisModel);
+            textEl.eventData.targetType = 'axisLabel';
+            textEl.eventData.value = rawLabel;
+        }
+
+        // FIXME
+        axisBuilder._dumbGroup.add(textEl);
+        textEl.updateTransform();
+
+        labelEls.push(textEl);
+        axisBuilder.group.add(textEl);
+
+        textEl.decomposeTransform();
+
+    });
+
+    return labelEls;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$6 = each$1;
+var curry$1 = curry;
+
+// Build axisPointerModel, mergin tooltip.axisPointer model for each axis.
+// allAxesInfo should be updated when setOption performed.
+function collect(ecModel, api) {
+    var result = {
+        /**
+         * key: makeKey(axis.model)
+         * value: {
+         *      axis,
+         *      coordSys,
+         *      axisPointerModel,
+         *      triggerTooltip,
+         *      involveSeries,
+         *      snap,
+         *      seriesModels,
+         *      seriesDataCount
+         * }
+         */
+        axesInfo: {},
+        seriesInvolved: false,
+        /**
+         * key: makeKey(coordSys.model)
+         * value: Object: key makeKey(axis.model), value: axisInfo
+         */
+        coordSysAxesInfo: {},
+        coordSysMap: {}
+    };
+
+    collectAxesInfo(result, ecModel, api);
+
+    // Check seriesInvolved for performance, in case too many series in some chart.
+    result.seriesInvolved && collectSeriesInfo(result, ecModel);
+
+    return result;
+}
+
+function collectAxesInfo(result, ecModel, api) {
+    var globalTooltipModel = ecModel.getComponent('tooltip');
+    var globalAxisPointerModel = ecModel.getComponent('axisPointer');
+    // links can only be set on global.
+    var linksOption = globalAxisPointerModel.get('link', true) || [];
+    var linkGroups = [];
+
+    // Collect axes info.
+    each$6(api.getCoordinateSystems(), function (coordSys) {
+        // Some coordinate system do not support axes, like geo.
+        if (!coordSys.axisPointerEnabled) {
+            return;
+        }
+
+        var coordSysKey = makeKey(coordSys.model);
+        var axesInfoInCoordSys = result.coordSysAxesInfo[coordSysKey] = {};
+        result.coordSysMap[coordSysKey] = coordSys;
+
+        // Set tooltip (like 'cross') is a convienent way to show axisPointer
+        // for user. So we enable seting tooltip on coordSys model.
+        var coordSysModel = coordSys.model;
+        var baseTooltipModel = coordSysModel.getModel('tooltip', globalTooltipModel);
+
+        each$6(coordSys.getAxes(), curry$1(saveTooltipAxisInfo, false, null));
+
+        // If axis tooltip used, choose tooltip axis for each coordSys.
+        // Notice this case: coordSys is `grid` but not `cartesian2D` here.
+        if (coordSys.getTooltipAxes
+            && globalTooltipModel
+            // If tooltip.showContent is set as false, tooltip will not
+            // show but axisPointer will show as normal.
+            && baseTooltipModel.get('show')
+        ) {
+            // Compatible with previous logic. But series.tooltip.trigger: 'axis'
+            // or series.data[n].tooltip.trigger: 'axis' are not support any more.
+            var triggerAxis = baseTooltipModel.get('trigger') === 'axis';
+            var cross = baseTooltipModel.get('axisPointer.type') === 'cross';
+            var tooltipAxes = coordSys.getTooltipAxes(baseTooltipModel.get('axisPointer.axis'));
+            if (triggerAxis || cross) {
+                each$6(tooltipAxes.baseAxes, curry$1(
+                    saveTooltipAxisInfo, cross ? 'cross' : true, triggerAxis
+                ));
+            }
+            if (cross) {
+                each$6(tooltipAxes.otherAxes, curry$1(saveTooltipAxisInfo, 'cross', false));
+            }
+        }
+
+        // fromTooltip: true | false | 'cross'
+        // triggerTooltip: true | false | null
+        function saveTooltipAxisInfo(fromTooltip, triggerTooltip, axis) {
+            var axisPointerModel = axis.model.getModel('axisPointer', globalAxisPointerModel);
+
+            var axisPointerShow = axisPointerModel.get('show');
+            if (!axisPointerShow || (
+                axisPointerShow === 'auto'
+                && !fromTooltip
+                && !isHandleTrigger(axisPointerModel)
+            )) {
+                return;
+            }
+
+            if (triggerTooltip == null) {
+                triggerTooltip = axisPointerModel.get('triggerTooltip');
+            }
+
+            axisPointerModel = fromTooltip
+                ? makeAxisPointerModel(
+                    axis, baseTooltipModel, globalAxisPointerModel, ecModel,
+                    fromTooltip, triggerTooltip
+                )
+                : axisPointerModel;
+
+            var snap = axisPointerModel.get('snap');
+            var key = makeKey(axis.model);
+            var involveSeries = triggerTooltip || snap || axis.type === 'category';
+
+            // If result.axesInfo[key] exist, override it (tooltip has higher priority).
+            var axisInfo = result.axesInfo[key] = {
+                key: key,
+                axis: axis,
+                coordSys: coordSys,
+                axisPointerModel: axisPointerModel,
+                triggerTooltip: triggerTooltip,
+                involveSeries: involveSeries,
+                snap: snap,
+                useHandle: isHandleTrigger(axisPointerModel),
+                seriesModels: []
+            };
+            axesInfoInCoordSys[key] = axisInfo;
+            result.seriesInvolved |= involveSeries;
+
+            var groupIndex = getLinkGroupIndex(linksOption, axis);
+            if (groupIndex != null) {
+                var linkGroup = linkGroups[groupIndex] || (linkGroups[groupIndex] = {axesInfo: {}});
+                linkGroup.axesInfo[key] = axisInfo;
+                linkGroup.mapper = linksOption[groupIndex].mapper;
+                axisInfo.linkGroup = linkGroup;
+            }
+        }
+    });
+}
+
+function makeAxisPointerModel(
+    axis, baseTooltipModel, globalAxisPointerModel, ecModel, fromTooltip, triggerTooltip
+) {
+    var tooltipAxisPointerModel = baseTooltipModel.getModel('axisPointer');
+    var volatileOption = {};
+
+    each$6(
+        [
+            'type', 'snap', 'lineStyle', 'shadowStyle', 'label',
+            'animation', 'animationDurationUpdate', 'animationEasingUpdate', 'z'
+        ],
+        function (field) {
+            volatileOption[field] = clone(tooltipAxisPointerModel.get(field));
+        }
+    );
+
+    // category axis do not auto snap, otherwise some tick that do not
+    // has value can not be hovered. value/time/log axis default snap if
+    // triggered from tooltip and trigger tooltip.
+    volatileOption.snap = axis.type !== 'category' && !!triggerTooltip;
+
+    // Compatibel with previous behavior, tooltip axis do not show label by default.
+    // Only these properties can be overrided from tooltip to axisPointer.
+    if (tooltipAxisPointerModel.get('type') === 'cross') {
+        volatileOption.type = 'line';
+    }
+    var labelOption = volatileOption.label || (volatileOption.label = {});
+    // Follow the convention, do not show label when triggered by tooltip by default.
+    labelOption.show == null && (labelOption.show = false);
+
+    if (fromTooltip === 'cross') {
+        // When 'cross', both axes show labels.
+        var tooltipAxisPointerLabelShow = tooltipAxisPointerModel.get('label.show');
+        labelOption.show = tooltipAxisPointerLabelShow != null ? tooltipAxisPointerLabelShow : true;
+        // If triggerTooltip, this is a base axis, which should better not use cross style
+        // (cross style is dashed by default)
+        if (!triggerTooltip) {
+            var crossStyle = volatileOption.lineStyle = tooltipAxisPointerModel.get('crossStyle');
+            crossStyle && defaults(labelOption, crossStyle.textStyle);
+        }
+    }
+
+    return axis.model.getModel(
+        'axisPointer',
+        new Model(volatileOption, globalAxisPointerModel, ecModel)
+    );
+}
+
+function collectSeriesInfo(result, ecModel) {
+    // Prepare data for axis trigger
+    ecModel.eachSeries(function (seriesModel) {
+
+        // Notice this case: this coordSys is `cartesian2D` but not `grid`.
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesTooltipTrigger = seriesModel.get('tooltip.trigger', true);
+        var seriesTooltipShow = seriesModel.get('tooltip.show', true);
+        if (!coordSys
+            || seriesTooltipTrigger === 'none'
+            || seriesTooltipTrigger === false
+            || seriesTooltipTrigger === 'item'
+            || seriesTooltipShow === false
+            || seriesModel.get('axisPointer.show', true) === false
+        ) {
+            return;
+        }
+
+        each$6(result.coordSysAxesInfo[makeKey(coordSys.model)], function (axisInfo) {
+            var axis = axisInfo.axis;
+            if (coordSys.getAxis(axis.dim) === axis) {
+                axisInfo.seriesModels.push(seriesModel);
+                axisInfo.seriesDataCount == null && (axisInfo.seriesDataCount = 0);
+                axisInfo.seriesDataCount += seriesModel.getData().count();
+            }
+        });
+
+    }, this);
+}
+
+/**
+ * For example:
+ * {
+ *     axisPointer: {
+ *         links: [{
+ *             xAxisIndex: [2, 4],
+ *             yAxisIndex: 'all'
+ *         }, {
+ *             xAxisId: ['a5', 'a7'],
+ *             xAxisName: 'xxx'
+ *         }]
+ *     }
+ * }
+ */
+function getLinkGroupIndex(linksOption, axis) {
+    var axisModel = axis.model;
+    var dim = axis.dim;
+    for (var i = 0; i < linksOption.length; i++) {
+        var linkOption = linksOption[i] || {};
+        if (checkPropInLink(linkOption[dim + 'AxisId'], axisModel.id)
+            || checkPropInLink(linkOption[dim + 'AxisIndex'], axisModel.componentIndex)
+            || checkPropInLink(linkOption[dim + 'AxisName'], axisModel.name)
+        ) {
+            return i;
+        }
+    }
+}
+
+function checkPropInLink(linkPropValue, axisPropValue) {
+    return linkPropValue === 'all'
+        || (isArray(linkPropValue) && indexOf(linkPropValue, axisPropValue) >= 0)
+        || linkPropValue === axisPropValue;
+}
+
+function fixValue(axisModel) {
+    var axisInfo = getAxisInfo(axisModel);
+    if (!axisInfo) {
+        return;
+    }
+
+    var axisPointerModel = axisInfo.axisPointerModel;
+    var scale = axisInfo.axis.scale;
+    var option = axisPointerModel.option;
+    var status = axisPointerModel.get('status');
+    var value = axisPointerModel.get('value');
+
+    // Parse init value for category and time axis.
+    if (value != null) {
+        value = scale.parse(value);
+    }
+
+    var useHandle = isHandleTrigger(axisPointerModel);
+    // If `handle` used, `axisPointer` will always be displayed, so value
+    // and status should be initialized.
+    if (status == null) {
+        option.status = useHandle ? 'show' : 'hide';
+    }
+
+    var extent = scale.getExtent().slice();
+    extent[0] > extent[1] && extent.reverse();
+
+    if (// Pick a value on axis when initializing.
+        value == null
+        // If both `handle` and `dataZoom` are used, value may be out of axis extent,
+        // where we should re-pick a value to keep `handle` displaying normally.
+        || value > extent[1]
+    ) {
+        // Make handle displayed on the end of the axis when init, which looks better.
+        value = extent[1];
+    }
+    if (value < extent[0]) {
+        value = extent[0];
+    }
+
+    option.value = value;
+
+    if (useHandle) {
+        option.status = axisInfo.axis.scale.isBlank() ? 'hide' : 'show';
+    }
+}
+
+function getAxisInfo(axisModel) {
+    var coordSysAxesInfo = (axisModel.ecModel.getComponent('axisPointer') || {}).coordSysAxesInfo;
+    return coordSysAxesInfo && coordSysAxesInfo.axesInfo[makeKey(axisModel)];
+}
+
+function getAxisPointerModel(axisModel) {
+    var axisInfo = getAxisInfo(axisModel);
+    return axisInfo && axisInfo.axisPointerModel;
+}
+
+function isHandleTrigger(axisPointerModel) {
+    return !!axisPointerModel.get('handle.show');
+}
+
+/**
+ * @param {module:echarts/model/Model} model
+ * @return {string} unique key
+ */
+function makeKey(model) {
+    return model.type + '||' + model.id;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Base class of AxisView.
+ */
+var AxisView = extendComponentView({
+
+    type: 'axis',
+
+    /**
+     * @private
+     */
+    _axisPointer: null,
+
+    /**
+     * @protected
+     * @type {string}
+     */
+    axisPointerClass: null,
+
+    /**
+     * @override
+     */
+    render: function (axisModel, ecModel, api, payload) {
+        // FIXME
+        // This process should proformed after coordinate systems updated
+        // (axis scale updated), and should be performed each time update.
+        // So put it here temporarily, although it is not appropriate to
+        // put a model-writing procedure in `view`.
+        this.axisPointerClass && fixValue(axisModel);
+
+        AxisView.superApply(this, 'render', arguments);
+
+        updateAxisPointer(this, axisModel, ecModel, api, payload, true);
+    },
+
+    /**
+     * Action handler.
+     * @public
+     * @param {module:echarts/coord/cartesian/AxisModel} axisModel
+     * @param {module:echarts/model/Global} ecModel
+     * @param {module:echarts/ExtensionAPI} api
+     * @param {Object} payload
+     */
+    updateAxisPointer: function (axisModel, ecModel, api, payload, force) {
+        updateAxisPointer(this, axisModel, ecModel, api, payload, false);
+    },
+
+    /**
+     * @override
+     */
+    remove: function (ecModel, api) {
+        var axisPointer = this._axisPointer;
+        axisPointer && axisPointer.remove(api);
+        AxisView.superApply(this, 'remove', arguments);
+    },
+
+    /**
+     * @override
+     */
+    dispose: function (ecModel, api) {
+        disposeAxisPointer(this, api);
+        AxisView.superApply(this, 'dispose', arguments);
+    }
+
+});
+
+function updateAxisPointer(axisView, axisModel, ecModel, api, payload, forceRender) {
+    var Clazz = AxisView.getAxisPointerClass(axisView.axisPointerClass);
+    if (!Clazz) {
+        return;
+    }
+    var axisPointerModel = getAxisPointerModel(axisModel);
+    axisPointerModel
+        ? (axisView._axisPointer || (axisView._axisPointer = new Clazz()))
+            .render(axisModel, axisPointerModel, api, forceRender)
+        : disposeAxisPointer(axisView, api);
+}
+
+function disposeAxisPointer(axisView, ecModel, api) {
+    var axisPointer = axisView._axisPointer;
+    axisPointer && axisPointer.dispose(ecModel, api);
+    axisView._axisPointer = null;
+}
+
+var axisPointerClazz = [];
+
+AxisView.registerAxisPointerClass = function (type, clazz) {
+    if (__DEV__) {
+        if (axisPointerClazz[type]) {
+            throw new Error('axisPointer ' + type + ' exists');
+        }
+    }
+    axisPointerClazz[type] = clazz;
+};
+
+AxisView.getAxisPointerClass = function (type) {
+    return type && axisPointerClazz[type];
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Can only be called after coordinate system creation stage.
+ * (Can be called before coordinate system update stage).
+ *
+ * @param {Object} opt {labelInside}
+ * @return {Object} {
+ *  position, rotation, labelDirection, labelOffset,
+ *  tickDirection, labelRotate, z2
+ * }
+ */
+function layout$1(gridModel, axisModel, opt) {
+    opt = opt || {};
+    var grid = gridModel.coordinateSystem;
+    var axis = axisModel.axis;
+    var layout = {};
+    var otherAxisOnZeroOf = axis.getAxesOnZeroOf()[0];
+
+    var rawAxisPosition = axis.position;
+    var axisPosition = otherAxisOnZeroOf ? 'onZero' : rawAxisPosition;
+    var axisDim = axis.dim;
+
+    var rect = grid.getRect();
+    var rectBound = [rect.x, rect.x + rect.width, rect.y, rect.y + rect.height];
+    var idx = {left: 0, right: 1, top: 0, bottom: 1, onZero: 2};
+    var axisOffset = axisModel.get('offset') || 0;
+
+    var posBound = axisDim === 'x'
+        ? [rectBound[2] - axisOffset, rectBound[3] + axisOffset]
+        : [rectBound[0] - axisOffset, rectBound[1] + axisOffset];
+
+    if (otherAxisOnZeroOf) {
+        var onZeroCoord = otherAxisOnZeroOf.toGlobalCoord(otherAxisOnZeroOf.dataToCoord(0));
+        posBound[idx['onZero']] = Math.max(Math.min(onZeroCoord, posBound[1]), posBound[0]);
+    }
+
+    // Axis position
+    layout.position = [
+        axisDim === 'y' ? posBound[idx[axisPosition]] : rectBound[0],
+        axisDim === 'x' ? posBound[idx[axisPosition]] : rectBound[3]
+    ];
+
+    // Axis rotation
+    layout.rotation = Math.PI / 2 * (axisDim === 'x' ? 0 : 1);
+
+    // Tick and label direction, x y is axisDim
+    var dirMap = {top: -1, bottom: 1, left: -1, right: 1};
+
+    layout.labelDirection = layout.tickDirection = layout.nameDirection = dirMap[rawAxisPosition];
+    layout.labelOffset = otherAxisOnZeroOf ? posBound[idx[rawAxisPosition]] - posBound[idx['onZero']] : 0;
+
+    if (axisModel.get('axisTick.inside')) {
+        layout.tickDirection = -layout.tickDirection;
+    }
+    if (retrieve(opt.labelInside, axisModel.get('axisLabel.inside'))) {
+        layout.labelDirection = -layout.labelDirection;
+    }
+
+    // Special label rotation
+    var labelRotate = axisModel.get('axisLabel.rotate');
+    layout.labelRotate = axisPosition === 'top' ? -labelRotate : labelRotate;
+
+    // Over splitLine and splitArea
+    layout.z2 = 1;
+
+    return layout;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisBuilderAttrs = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+var selfBuilderAttrs = [
+    'splitArea', 'splitLine'
+];
+
+// function getAlignWithLabel(model, axisModel) {
+//     var alignWithLabel = model.get('alignWithLabel');
+//     if (alignWithLabel === 'auto') {
+//         alignWithLabel = axisModel.get('axisTick.alignWithLabel');
+//     }
+//     return alignWithLabel;
+// }
+
+var CartesianAxisView = AxisView.extend({
+
+    type: 'cartesianAxis',
+
+    axisPointerClass: 'CartesianAxisPointer',
+
+    /**
+     * @override
+     */
+    render: function (axisModel, ecModel, api, payload) {
+
+        this.group.removeAll();
+
+        var oldAxisGroup = this._axisGroup;
+        this._axisGroup = new Group();
+
+        this.group.add(this._axisGroup);
+
+        if (!axisModel.get('show')) {
+            return;
+        }
+
+        var gridModel = axisModel.getCoordSysModel();
+
+        var layout = layout$1(gridModel, axisModel);
+
+        var axisBuilder = new AxisBuilder(axisModel, layout);
+
+        each$1(axisBuilderAttrs, axisBuilder.add, axisBuilder);
+
+        this._axisGroup.add(axisBuilder.getGroup());
+
+        each$1(selfBuilderAttrs, function (name) {
+            if (axisModel.get(name + '.show')) {
+                this['_' + name](axisModel, gridModel);
+            }
+        }, this);
+
+        groupTransition(oldAxisGroup, this._axisGroup, axisModel);
+
+        CartesianAxisView.superCall(this, 'render', axisModel, ecModel, api, payload);
+    },
+
+    remove: function () {
+        this._splitAreaColors = null;
+    },
+
+    /**
+     * @param {module:echarts/coord/cartesian/AxisModel} axisModel
+     * @param {module:echarts/coord/cartesian/GridModel} gridModel
+     * @private
+     */
+    _splitLine: function (axisModel, gridModel) {
+        var axis = axisModel.axis;
+
+        if (axis.scale.isBlank()) {
+            return;
+        }
+
+        var splitLineModel = axisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineColors = lineStyleModel.get('color');
+
+        lineColors = isArray(lineColors) ? lineColors : [lineColors];
+
+        var gridRect = gridModel.coordinateSystem.getRect();
+        var isHorizontal = axis.isHorizontal();
+
+        var lineCount = 0;
+
+        var ticksCoords = axis.getTicksCoords({
+            tickModel: splitLineModel
+        });
+
+        var p1 = [];
+        var p2 = [];
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        var lineStyle = lineStyleModel.getLineStyle();
+        for (var i = 0; i < ticksCoords.length; i++) {
+            var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+            if (isHorizontal) {
+                p1[0] = tickCoord;
+                p1[1] = gridRect.y;
+                p2[0] = tickCoord;
+                p2[1] = gridRect.y + gridRect.height;
+            }
+            else {
+                p1[0] = gridRect.x;
+                p1[1] = tickCoord;
+                p2[0] = gridRect.x + gridRect.width;
+                p2[1] = tickCoord;
+            }
+
+            var colorIndex = (lineCount++) % lineColors.length;
+            var tickValue = ticksCoords[i].tickValue;
+            this._axisGroup.add(new Line(subPixelOptimizeLine({
+                anid: tickValue != null ? 'line_' + ticksCoords[i].tickValue : null,
+                shape: {
+                    x1: p1[0],
+                    y1: p1[1],
+                    x2: p2[0],
+                    y2: p2[1]
+                },
+                style: defaults({
+                    stroke: lineColors[colorIndex]
+                }, lineStyle),
+                silent: true
+            })));
+        }
+    },
+
+    /**
+     * @param {module:echarts/coord/cartesian/AxisModel} axisModel
+     * @param {module:echarts/coord/cartesian/GridModel} gridModel
+     * @private
+     */
+    _splitArea: function (axisModel, gridModel) {
+        var axis = axisModel.axis;
+
+        if (axis.scale.isBlank()) {
+            return;
+        }
+
+        var splitAreaModel = axisModel.getModel('splitArea');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+        var areaColors = areaStyleModel.get('color');
+
+        var gridRect = gridModel.coordinateSystem.getRect();
+
+        var ticksCoords = axis.getTicksCoords({
+            tickModel: splitAreaModel,
+            clamp: true
+        });
+
+        if (!ticksCoords.length) {
+            return;
+        }
+
+        // For Making appropriate splitArea animation, the color and anid
+        // should be corresponding to previous one if possible.
+        var areaColorsLen = areaColors.length;
+        var lastSplitAreaColors = this._splitAreaColors;
+        var newSplitAreaColors = createHashMap();
+        var colorIndex = 0;
+        if (lastSplitAreaColors) {
+            for (var i = 0; i < ticksCoords.length; i++) {
+                var cIndex = lastSplitAreaColors.get(ticksCoords[i].tickValue);
+                if (cIndex != null) {
+                    colorIndex = (cIndex + (areaColorsLen - 1) * i) % areaColorsLen;
+                    break;
+                }
+            }
+        }
+
+        var prev = axis.toGlobalCoord(ticksCoords[0].coord);
+
+        var areaStyle = areaStyleModel.getAreaStyle();
+        areaColors = isArray(areaColors) ? areaColors : [areaColors];
+
+        for (var i = 1; i < ticksCoords.length; i++) {
+            var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+
+            var x;
+            var y;
+            var width;
+            var height;
+            if (axis.isHorizontal()) {
+                x = prev;
+                y = gridRect.y;
+                width = tickCoord - x;
+                height = gridRect.height;
+                prev = x + width;
+            }
+            else {
+                x = gridRect.x;
+                y = prev;
+                width = gridRect.width;
+                height = tickCoord - y;
+                prev = y + height;
+            }
+
+            var tickValue = ticksCoords[i - 1].tickValue;
+            tickValue != null && newSplitAreaColors.set(tickValue, colorIndex);
+
+            this._axisGroup.add(new Rect({
+                anid: tickValue != null ? 'area_' + tickValue : null,
+                shape: {
+                    x: x,
+                    y: y,
+                    width: width,
+                    height: height
+                },
+                style: defaults({
+                    fill: areaColors[colorIndex]
+                }, areaStyle),
+                silent: true
+            }));
+
+            colorIndex = (colorIndex + 1) % areaColorsLen;
+        }
+
+        this._splitAreaColors = newSplitAreaColors;
+    }
+});
+
+CartesianAxisView.extend({
+    type: 'xAxis'
+});
+CartesianAxisView.extend({
+    type: 'yAxis'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Grid view
+extendComponentView({
+
+    type: 'grid',
+
+    render: function (gridModel, ecModel) {
+        this.group.removeAll();
+        if (gridModel.get('show')) {
+            this.group.add(new Rect({
+                shape: gridModel.coordinateSystem.getRect(),
+                style: defaults({
+                    fill: gridModel.get('backgroundColor')
+                }, gridModel.getItemStyle()),
+                silent: true,
+                z2: -1
+            }));
+        }
+    }
+
+});
+
+registerPreprocessor(function (option) {
+    // Only create grid when need
+    if (option.xAxis && option.yAxis && !option.grid) {
+        option.grid = {};
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// In case developer forget to include grid component
+registerVisual(visualSymbol('line', 'circle', 'line'));
+registerLayout(pointsLayout('line'));
+
+// Down sample after filter
+registerProcessor(
+    PRIORITY.PROCESSOR.STATISTIC,
+    dataSample('line')
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BaseBarSeries = SeriesModel.extend({
+
+    type: 'series.__base_bar__',
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    },
+
+    getMarkerPosition: function (value) {
+        var coordSys = this.coordinateSystem;
+        if (coordSys) {
+            // PENDING if clamp ?
+            var pt = coordSys.dataToPoint(coordSys.clampData(value));
+            var data = this.getData();
+            var offset = data.getLayout('offset');
+            var size = data.getLayout('size');
+            var offsetIndex = coordSys.getBaseAxis().isHorizontal() ? 0 : 1;
+            pt[offsetIndex] += offset + size / 2;
+            return pt;
+        }
+        return [NaN, NaN];
+    },
+
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+        // stack: null
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // 最小高度改为0
+        barMinHeight: 0,
+        // 最小角度为0，仅对极坐标系下的柱状图有效
+        barMinAngle: 0,
+        // cursor: null,
+
+        large: false,
+        largeThreshold: 400,
+        progressive: 3e3,
+        progressiveChunkMode: 'mod',
+
+        // barMaxWidth: null,
+        // 默认自适应
+        // barWidth: null,
+        // 柱间距离，默认为柱形宽度的30%，可设固定值
+        // barGap: '30%',
+        // 类目间柱形距离，默认为类目间距的20%，可设固定值
+        // barCategoryGap: '20%',
+        // label: {
+        //      show: false
+        // },
+        itemStyle: {},
+        emphasis: {}
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+BaseBarSeries.extend({
+
+    type: 'series.bar',
+
+    dependencies: ['grid', 'polar'],
+
+    brushSelector: 'rect',
+
+    /**
+     * @override
+     */
+    getProgressive: function () {
+        // Do not support progressive in normal mode.
+        return this.get('large')
+            ? this.get('progressive')
+            : false;
+    },
+
+    /**
+     * @override
+     */
+    getProgressiveThreshold: function () {
+        // Do not support progressive in normal mode.
+        var progressiveThreshold = this.get('progressiveThreshold');
+        var largeThreshold = this.get('largeThreshold');
+        if (largeThreshold > progressiveThreshold) {
+            progressiveThreshold = largeThreshold;
+        }
+        return progressiveThreshold;
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function setLabel(
+    normalStyle, hoverStyle, itemModel, color, seriesModel, dataIndex, labelPositionOutside
+) {
+    var labelModel = itemModel.getModel('label');
+    var hoverLabelModel = itemModel.getModel('emphasis.label');
+
+    setLabelStyle(
+        normalStyle, hoverStyle, labelModel, hoverLabelModel,
+        {
+            labelFetcher: seriesModel,
+            labelDataIndex: dataIndex,
+            defaultText: getDefaultLabel(seriesModel.getData(), dataIndex),
+            isRectText: true,
+            autoColor: color
+        }
+    );
+
+    fixPosition(normalStyle);
+    fixPosition(hoverStyle);
+}
+
+function fixPosition(style, labelPositionOutside) {
+    if (style.textPosition === 'outside') {
+        style.textPosition = labelPositionOutside;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var getBarItemStyle = makeStyleMapper(
+    [
+        ['fill', 'color'],
+        ['stroke', 'borderColor'],
+        ['lineWidth', 'borderWidth'],
+        // Compatitable with 2
+        ['stroke', 'barBorderColor'],
+        ['lineWidth', 'barBorderWidth'],
+        ['opacity'],
+        ['shadowBlur'],
+        ['shadowOffsetX'],
+        ['shadowOffsetY'],
+        ['shadowColor']
+    ]
+);
+
+var barItemStyle = {
+    getBarItemStyle: function (excludes) {
+        var style = getBarItemStyle(this, excludes);
+        if (this.getBorderLineDash) {
+            var lineDash = this.getBorderLineDash();
+            lineDash && (style.lineDash = lineDash);
+        }
+        return style;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BAR_BORDER_WIDTH_QUERY = ['itemStyle', 'barBorderWidth'];
+
+// FIXME
+// Just for compatible with ec2.
+extend(Model.prototype, barItemStyle);
+
+extendChartView({
+
+    type: 'bar',
+
+    render: function (seriesModel, ecModel, api) {
+        this._updateDrawMode(seriesModel);
+
+        var coordinateSystemType = seriesModel.get('coordinateSystem');
+
+        if (coordinateSystemType === 'cartesian2d'
+            || coordinateSystemType === 'polar'
+        ) {
+            this._isLargeDraw
+                ? this._renderLarge(seriesModel, ecModel, api)
+                : this._renderNormal(seriesModel, ecModel, api);
+        }
+        else if (__DEV__) {
+            console.warn('Only cartesian2d and polar supported for bar.');
+        }
+
+        return this.group;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this._clear();
+        this._updateDrawMode(seriesModel);
+    },
+
+    incrementalRender: function (params, seriesModel, ecModel, api) {
+        // Do not support progressive in normal mode.
+        this._incrementalRenderLarge(params, seriesModel);
+    },
+
+    _updateDrawMode: function (seriesModel) {
+        var isLargeDraw = seriesModel.pipelineContext.large;
+        if (this._isLargeDraw == null || isLargeDraw ^ this._isLargeDraw) {
+            this._isLargeDraw = isLargeDraw;
+            this._clear();
+        }
+    },
+
+    _renderNormal: function (seriesModel, ecModel, api) {
+        var group = this.group;
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        var coord = seriesModel.coordinateSystem;
+        var baseAxis = coord.getBaseAxis();
+        var isHorizontalOrRadial;
+
+        if (coord.type === 'cartesian2d') {
+            isHorizontalOrRadial = baseAxis.isHorizontal();
+        }
+        else if (coord.type === 'polar') {
+            isHorizontalOrRadial = baseAxis.dim === 'angle';
+        }
+
+        var animationModel = seriesModel.isAnimationEnabled() ? seriesModel : null;
+
+        data.diff(oldData)
+            .add(function (dataIndex) {
+                if (!data.hasValue(dataIndex)) {
+                    return;
+                }
+
+                var itemModel = data.getItemModel(dataIndex);
+                var layout = getLayout[coord.type](data, dataIndex, itemModel);
+                var el = elementCreator[coord.type](
+                    data, dataIndex, itemModel, layout, isHorizontalOrRadial, animationModel
+                );
+                data.setItemGraphicEl(dataIndex, el);
+                group.add(el);
+
+                updateStyle(
+                    el, data, dataIndex, itemModel, layout,
+                    seriesModel, isHorizontalOrRadial, coord.type === 'polar'
+                );
+            })
+            .update(function (newIndex, oldIndex) {
+                var el = oldData.getItemGraphicEl(oldIndex);
+
+                if (!data.hasValue(newIndex)) {
+                    group.remove(el);
+                    return;
+                }
+
+                var itemModel = data.getItemModel(newIndex);
+                var layout = getLayout[coord.type](data, newIndex, itemModel);
+
+                if (el) {
+                    updateProps(el, {shape: layout}, animationModel, newIndex);
+                }
+                else {
+                    el = elementCreator[coord.type](
+                        data, newIndex, itemModel, layout, isHorizontalOrRadial, animationModel, true
+                    );
+                }
+
+                data.setItemGraphicEl(newIndex, el);
+                // Add back
+                group.add(el);
+
+                updateStyle(
+                    el, data, newIndex, itemModel, layout,
+                    seriesModel, isHorizontalOrRadial, coord.type === 'polar'
+                );
+            })
+            .remove(function (dataIndex) {
+                var el = oldData.getItemGraphicEl(dataIndex);
+                if (coord.type === 'cartesian2d') {
+                    el && removeRect(dataIndex, animationModel, el);
+                }
+                else {
+                    el && removeSector(dataIndex, animationModel, el);
+                }
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    _renderLarge: function (seriesModel, ecModel, api) {
+        this._clear();
+        createLarge(seriesModel, this.group);
+    },
+
+    _incrementalRenderLarge: function (params, seriesModel) {
+        createLarge(seriesModel, this.group, true);
+    },
+
+    dispose: noop,
+
+    remove: function (ecModel) {
+        this._clear(ecModel);
+    },
+
+    _clear: function (ecModel) {
+        var group = this.group;
+        var data = this._data;
+        if (ecModel && ecModel.get('animation') && data && !this._isLargeDraw) {
+            data.eachItemGraphicEl(function (el) {
+                if (el.type === 'sector') {
+                    removeSector(el.dataIndex, ecModel, el);
+                }
+                else {
+                    removeRect(el.dataIndex, ecModel, el);
+                }
+            });
+        }
+        else {
+            group.removeAll();
+        }
+        this._data = null;
+    }
+
+});
+
+var elementCreator = {
+
+    cartesian2d: function (
+        data, dataIndex, itemModel, layout, isHorizontal,
+        animationModel, isUpdate
+    ) {
+        var rect = new Rect({shape: extend({}, layout)});
+
+        // Animation
+        if (animationModel) {
+            var rectShape = rect.shape;
+            var animateProperty = isHorizontal ? 'height' : 'width';
+            var animateTarget = {};
+            rectShape[animateProperty] = 0;
+            animateTarget[animateProperty] = layout[animateProperty];
+            graphic[isUpdate ? 'updateProps' : 'initProps'](rect, {
+                shape: animateTarget
+            }, animationModel, dataIndex);
+        }
+
+        return rect;
+    },
+
+    polar: function (
+        data, dataIndex, itemModel, layout, isRadial,
+        animationModel, isUpdate
+    ) {
+        // Keep the same logic with bar in catesion: use end value to control
+        // direction. Notice that if clockwise is true (by default), the sector
+        // will always draw clockwisely, no matter whether endAngle is greater
+        // or less than startAngle.
+        var clockwise = layout.startAngle < layout.endAngle;
+        var sector = new Sector({
+            shape: defaults({clockwise: clockwise}, layout)
+        });
+
+        // Animation
+        if (animationModel) {
+            var sectorShape = sector.shape;
+            var animateProperty = isRadial ? 'r' : 'endAngle';
+            var animateTarget = {};
+            sectorShape[animateProperty] = isRadial ? 0 : layout.startAngle;
+            animateTarget[animateProperty] = layout[animateProperty];
+            graphic[isUpdate ? 'updateProps' : 'initProps'](sector, {
+                shape: animateTarget
+            }, animationModel, dataIndex);
+        }
+
+        return sector;
+    }
+};
+
+function removeRect(dataIndex, animationModel, el) {
+    // Not show text when animating
+    el.style.text = null;
+    updateProps(el, {
+        shape: {
+            width: 0
+        }
+    }, animationModel, dataIndex, function () {
+        el.parent && el.parent.remove(el);
+    });
+}
+
+function removeSector(dataIndex, animationModel, el) {
+    // Not show text when animating
+    el.style.text = null;
+    updateProps(el, {
+        shape: {
+            r: el.shape.r0
+        }
+    }, animationModel, dataIndex, function () {
+        el.parent && el.parent.remove(el);
+    });
+}
+
+var getLayout = {
+    cartesian2d: function (data, dataIndex, itemModel) {
+        var layout = data.getItemLayout(dataIndex);
+        var fixedLineWidth = getLineWidth(itemModel, layout);
+
+        // fix layout with lineWidth
+        var signX = layout.width > 0 ? 1 : -1;
+        var signY = layout.height > 0 ? 1 : -1;
+        return {
+            x: layout.x + signX * fixedLineWidth / 2,
+            y: layout.y + signY * fixedLineWidth / 2,
+            width: layout.width - signX * fixedLineWidth,
+            height: layout.height - signY * fixedLineWidth
+        };
+    },
+
+    polar: function (data, dataIndex, itemModel) {
+        var layout = data.getItemLayout(dataIndex);
+        return {
+            cx: layout.cx,
+            cy: layout.cy,
+            r0: layout.r0,
+            r: layout.r,
+            startAngle: layout.startAngle,
+            endAngle: layout.endAngle
+        };
+    }
+};
+
+function updateStyle(
+    el, data, dataIndex, itemModel, layout, seriesModel, isHorizontal, isPolar
+) {
+    var color = data.getItemVisual(dataIndex, 'color');
+    var opacity = data.getItemVisual(dataIndex, 'opacity');
+    var itemStyleModel = itemModel.getModel('itemStyle');
+    var hoverStyle = itemModel.getModel('emphasis.itemStyle').getBarItemStyle();
+
+    if (!isPolar) {
+        el.setShape('r', itemStyleModel.get('barBorderRadius') || 0);
+    }
+
+    el.useStyle(defaults(
+        {
+            fill: color,
+            opacity: opacity
+        },
+        itemStyleModel.getBarItemStyle()
+    ));
+
+    var cursorStyle = itemModel.getShallow('cursor');
+    cursorStyle && el.attr('cursor', cursorStyle);
+
+    var labelPositionOutside = isHorizontal
+        ? (layout.height > 0 ? 'bottom' : 'top')
+        : (layout.width > 0 ? 'left' : 'right');
+
+    if (!isPolar) {
+        setLabel(
+            el.style, hoverStyle, itemModel, color,
+            seriesModel, dataIndex, labelPositionOutside
+        );
+    }
+
+    setHoverStyle(el, hoverStyle);
+}
+
+// In case width or height are too small.
+function getLineWidth(itemModel, rawLayout) {
+    var lineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY) || 0;
+    return Math.min(lineWidth, Math.abs(rawLayout.width), Math.abs(rawLayout.height));
+}
+
+
+var LargePath = Path.extend({
+
+    type: 'largeBar',
+
+    shape: {points: []},
+
+    buildPath: function (ctx, shape) {
+        // Drawing lines is more efficient than drawing
+        // a whole line or drawing rects.
+        var points = shape.points;
+        var startPoint = this.__startPoint;
+        var valueIdx = this.__valueIdx;
+
+        for (var i = 0; i < points.length; i += 2) {
+            startPoint[this.__valueIdx] = points[i + valueIdx];
+            ctx.moveTo(startPoint[0], startPoint[1]);
+            ctx.lineTo(points[i], points[i + 1]);
+        }
+    }
+});
+
+function createLarge(seriesModel, group, incremental) {
+    // TODO support polar
+    var data = seriesModel.getData();
+    var startPoint = [];
+    var valueIdx = data.getLayout('valueAxisHorizontal') ? 1 : 0;
+    startPoint[1 - valueIdx] = data.getLayout('valueAxisStart');
+
+    var el = new LargePath({
+        shape: {points: data.getLayout('largePoints')},
+        incremental: !!incremental,
+        __startPoint: startPoint,
+        __valueIdx: valueIdx
+    });
+    group.add(el);
+    setLargeStyle(el, seriesModel, data);
+}
+
+function setLargeStyle(el, seriesModel, data) {
+    var borderColor = data.getVisual('borderColor') || data.getVisual('color');
+    var itemStyle = seriesModel.getModel('itemStyle').getItemStyle(['color', 'borderColor']);
+
+    el.useStyle(itemStyle);
+    el.style.fill = null;
+    el.style.stroke = borderColor;
+    el.style.lineWidth = data.getLayout('barWidth');
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// In case developer forget to include grid component
+registerLayout(curry(layout, 'bar'));
+// Should after normal bar layout, otherwise it is blocked by normal bar layout.
+registerLayout(largeLayout);
+
+registerVisual({
+    seriesType: 'bar',
+    reset: function (seriesModel) {
+        // Visual coding for legend
+        seriesModel.getData().setVisual('legendSymbol', 'roundRect');
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+/**
+ * [Usage]:
+ * (1)
+ * createListSimply(seriesModel, ['value']);
+ * (2)
+ * createListSimply(seriesModel, {
+ *     coordDimensions: ['value'],
+ *     dimensionsCount: 5
+ * });
+ *
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {Object|Array.<string|Object>} opt opt or coordDimensions
+ *        The options in opt, see `echarts/data/helper/createDimensions`
+ * @param {Array.<string>} [nameList]
+ * @return {module:echarts/data/List}
+ */
+var createListSimply = function (seriesModel, opt, nameList) {
+    opt = isArray(opt) && {coordDimensions: opt} || extend({}, opt);
+
+    var source = seriesModel.getSource();
+
+    var dimensionsInfo = createDimensions(source, opt);
+
+    var list = new List(dimensionsInfo, seriesModel);
+    list.initData(source, nameList);
+
+    return list;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Data selectable mixin for chart series.
+ * To eanble data select, option of series must have `selectedMode`.
+ * And each data item will use `selected` to toggle itself selected status
+ */
+
+var selectableMixin = {
+
+    /**
+     * @param {Array.<Object>} targetList [{name, value, selected}, ...]
+     *        If targetList is an array, it should like [{name: ..., value: ...}, ...].
+     *        If targetList is a "List", it must have coordDim: 'value' dimension and name.
+     */
+    updateSelectedMap: function (targetList) {
+        this._targetList = isArray(targetList) ? targetList.slice() : [];
+
+        this._selectTargetMap = reduce(targetList || [], function (targetMap, target) {
+            targetMap.set(target.name, target);
+            return targetMap;
+        }, createHashMap());
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    // PENGING If selectedMode is null ?
+    select: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        var selectedMode = this.get('selectedMode');
+        if (selectedMode === 'single') {
+            this._selectTargetMap.each(function (target) {
+                target.selected = false;
+            });
+        }
+        target && (target.selected = true);
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    unSelect: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        // var selectedMode = this.get('selectedMode');
+        // selectedMode !== 'single' && target && (target.selected = false);
+        target && (target.selected = false);
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    toggleSelected: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        if (target != null) {
+            this[target.selected ? 'unSelect' : 'select'](name, id);
+            return target.selected;
+        }
+    },
+
+    /**
+     * Either name or id should be passed as input here.
+     * If both of them are defined, id is used.
+     *
+     * @param {string|undefined} name name of data
+     * @param {number|undefined} id dataIndex of data
+     */
+    isSelected: function (name, id) {
+        var target = id != null
+            ? this._targetList[id]
+            : this._selectTargetMap.get(name);
+        return target && target.selected;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PieSeries = extendSeriesModel({
+
+    type: 'series.pie',
+
+    // Overwrite
+    init: function (option) {
+        PieSeries.superApply(this, 'init', arguments);
+
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+
+        this.updateSelectedMap(this._createSelectableList());
+
+        this._defaultLabelLine(option);
+    },
+
+    // Overwrite
+    mergeOption: function (newOption) {
+        PieSeries.superCall(this, 'mergeOption', newOption);
+
+        this.updateSelectedMap(this._createSelectableList());
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListSimply(this, ['value']);
+    },
+
+    _createSelectableList: function () {
+        var data = this.getRawData();
+        var valueDim = data.mapDimension('value');
+        var targetList = [];
+        for (var i = 0, len = data.count(); i < len; i++) {
+            targetList.push({
+                name: data.getName(i),
+                value: data.get(valueDim, i),
+                selected: retrieveRawAttr(data, i, 'selected')
+            });
+        }
+        return targetList;
+    },
+
+    // Overwrite
+    getDataParams: function (dataIndex) {
+        var data = this.getData();
+        var params = PieSeries.superCall(this, 'getDataParams', dataIndex);
+        // FIXME toFixed?
+
+        var valueList = [];
+        data.each(data.mapDimension('value'), function (value) {
+            valueList.push(value);
+        });
+
+        params.percent = getPercentWithPrecision(
+            valueList,
+            dataIndex,
+            data.hostModel.get('percentPrecision')
+        );
+
+        params.$vars.push('percent');
+        return params;
+    },
+
+    _defaultLabelLine: function (option) {
+        // Extend labelLine emphasis
+        defaultEmphasis(option, 'labelLine', ['show']);
+
+        var labelLineNormalOpt = option.labelLine;
+        var labelLineEmphasisOpt = option.emphasis.labelLine;
+        // Not show label line if `label.normal.show = false`
+        labelLineNormalOpt.show = labelLineNormalOpt.show
+            && option.label.show;
+        labelLineEmphasisOpt.show = labelLineEmphasisOpt.show
+            && option.emphasis.label.show;
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // 默认全局居中
+        center: ['50%', '50%'],
+        radius: [0, '75%'],
+        // 默认顺时针
+        clockwise: true,
+        startAngle: 90,
+        // 最小角度改为0
+        minAngle: 0,
+        // 选中时扇区偏移量
+        selectedOffset: 10,
+        // 高亮扇区偏移量
+        hoverOffset: 10,
+
+        // If use strategy to avoid label overlapping
+        avoidLabelOverlap: true,
+        // 选择模式，默认关闭，可选single，multiple
+        // selectedMode: false,
+        // 南丁格尔玫瑰图模式，'radius'（半径） | 'area'（面积）
+        // roseType: null,
+
+        percentPrecision: 2,
+
+        // If still show when all data zero.
+        stillShowZeroSum: true,
+
+        // cursor: null,
+
+        label: {
+            // If rotate around circle
+            rotate: false,
+            show: true,
+            // 'outer', 'inside', 'center'
+            position: 'outer'
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+            // 默认使用全局文本样式，详见TEXTSTYLE
+            // distance: 当position为inner时有效，为label位置到圆心的距离与圆半径(环状图为内外半径和)的比例系数
+        },
+        // Enabled when label.normal.position is 'outer'
+        labelLine: {
+            show: true,
+            // 引导线两段中的第一段长度
+            length: 15,
+            // 引导线两段中的第二段长度
+            length2: 15,
+            smooth: false,
+            lineStyle: {
+                // color: 各异,
+                width: 1,
+                type: 'solid'
+            }
+        },
+        itemStyle: {
+            borderWidth: 1
+        },
+
+        // Animation type canbe expansion, scale
+        animationType: 'expansion',
+
+        animationEasing: 'cubicOut'
+    }
+});
+
+mixin(PieSeries, selectableMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {boolean} hasAnimation
+ * @inner
+ */
+function updateDataSelected(uid, seriesModel, hasAnimation, api) {
+    var data = seriesModel.getData();
+    var dataIndex = this.dataIndex;
+    var name = data.getName(dataIndex);
+    var selectedOffset = seriesModel.get('selectedOffset');
+
+    api.dispatchAction({
+        type: 'pieToggleSelect',
+        from: uid,
+        name: name,
+        seriesId: seriesModel.id
+    });
+
+    data.each(function (idx) {
+        toggleItemSelected(
+            data.getItemGraphicEl(idx),
+            data.getItemLayout(idx),
+            seriesModel.isSelected(data.getName(idx)),
+            selectedOffset,
+            hasAnimation
+        );
+    });
+}
+
+/**
+ * @param {module:zrender/graphic/Sector} el
+ * @param {Object} layout
+ * @param {boolean} isSelected
+ * @param {number} selectedOffset
+ * @param {boolean} hasAnimation
+ * @inner
+ */
+function toggleItemSelected(el, layout, isSelected, selectedOffset, hasAnimation) {
+    var midAngle = (layout.startAngle + layout.endAngle) / 2;
+
+    var dx = Math.cos(midAngle);
+    var dy = Math.sin(midAngle);
+
+    var offset = isSelected ? selectedOffset : 0;
+    var position = [dx * offset, dy * offset];
+
+    hasAnimation
+        // animateTo will stop revious animation like update transition
+        ? el.animate()
+            .when(200, {
+                position: position
+            })
+            .start('bounceOut')
+        : el.attr('position', position);
+}
+
+/**
+ * Piece of pie including Sector, Label, LabelLine
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ */
+function PiePiece(data, idx) {
+
+    Group.call(this);
+
+    var sector = new Sector({
+        z2: 2
+    });
+    var polyline = new Polyline();
+    var text = new Text();
+    this.add(sector);
+    this.add(polyline);
+    this.add(text);
+
+    this.updateData(data, idx, true);
+
+    // Hover to change label and labelLine
+    function onEmphasis() {
+        polyline.ignore = polyline.hoverIgnore;
+        text.ignore = text.hoverIgnore;
+    }
+    function onNormal() {
+        polyline.ignore = polyline.normalIgnore;
+        text.ignore = text.normalIgnore;
+    }
+    this.on('emphasis', onEmphasis)
+        .on('normal', onNormal)
+        .on('mouseover', onEmphasis)
+        .on('mouseout', onNormal);
+}
+
+var piePieceProto = PiePiece.prototype;
+
+piePieceProto.updateData = function (data, idx, firstCreate) {
+
+    var sector = this.childAt(0);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var sectorShape = extend({}, layout);
+    sectorShape.label = null;
+
+    if (firstCreate) {
+        sector.setShape(sectorShape);
+
+        var animationType = seriesModel.getShallow('animationType');
+        if (animationType === 'scale') {
+            sector.shape.r = layout.r0;
+            initProps(sector, {
+                shape: {
+                    r: layout.r
+                }
+            }, seriesModel, idx);
+        }
+        // Expansion
+        else {
+            sector.shape.endAngle = layout.startAngle;
+            updateProps(sector, {
+                shape: {
+                    endAngle: layout.endAngle
+                }
+            }, seriesModel, idx);
+        }
+
+    }
+    else {
+        updateProps(sector, {
+            shape: sectorShape
+        }, seriesModel, idx);
+    }
+
+    // Update common style
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    sector.useStyle(
+        defaults(
+            {
+                lineJoin: 'bevel',
+                fill: visualColor
+            },
+            itemModel.getModel('itemStyle').getItemStyle()
+        )
+    );
+    sector.hoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+
+    var cursorStyle = itemModel.getShallow('cursor');
+    cursorStyle && sector.attr('cursor', cursorStyle);
+
+    // Toggle selected
+    toggleItemSelected(
+        this,
+        data.getItemLayout(idx),
+        seriesModel.isSelected(null, idx),
+        seriesModel.get('selectedOffset'),
+        seriesModel.get('animation')
+    );
+
+    function onEmphasis() {
+        // Sector may has animation of updating data. Force to move to the last frame
+        // Or it may stopped on the wrong shape
+        sector.stopAnimation(true);
+        sector.animateTo({
+            shape: {
+                r: layout.r + seriesModel.get('hoverOffset')
+            }
+        }, 300, 'elasticOut');
+    }
+    function onNormal() {
+        sector.stopAnimation(true);
+        sector.animateTo({
+            shape: {
+                r: layout.r
+            }
+        }, 300, 'elasticOut');
+    }
+    sector.off('mouseover').off('mouseout').off('emphasis').off('normal');
+    if (itemModel.get('hoverAnimation') && seriesModel.isAnimationEnabled()) {
+        sector
+            .on('mouseover', onEmphasis)
+            .on('mouseout', onNormal)
+            .on('emphasis', onEmphasis)
+            .on('normal', onNormal);
+    }
+
+    this._updateLabel(data, idx);
+
+    setHoverStyle(this);
+};
+
+piePieceProto._updateLabel = function (data, idx) {
+
+    var labelLine = this.childAt(1);
+    var labelText = this.childAt(2);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var labelLayout = layout.label;
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    updateProps(labelLine, {
+        shape: {
+            points: labelLayout.linePoints || [
+                [labelLayout.x, labelLayout.y], [labelLayout.x, labelLayout.y], [labelLayout.x, labelLayout.y]
+            ]
+        }
+    }, seriesModel, idx);
+
+    updateProps(labelText, {
+        style: {
+            x: labelLayout.x,
+            y: labelLayout.y
+        }
+    }, seriesModel, idx);
+    labelText.attr({
+        rotation: labelLayout.rotation,
+        origin: [labelLayout.x, labelLayout.y],
+        z2: 10
+    });
+
+    var labelModel = itemModel.getModel('label');
+    var labelHoverModel = itemModel.getModel('emphasis.label');
+    var labelLineModel = itemModel.getModel('labelLine');
+    var labelLineHoverModel = itemModel.getModel('emphasis.labelLine');
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    setLabelStyle(
+        labelText.style, labelText.hoverStyle = {}, labelModel, labelHoverModel,
+        {
+            labelFetcher: data.hostModel,
+            labelDataIndex: idx,
+            defaultText: data.getName(idx),
+            autoColor: visualColor,
+            useInsideStyle: !!labelLayout.inside
+        },
+        {
+            textAlign: labelLayout.textAlign,
+            textVerticalAlign: labelLayout.verticalAlign,
+            opacity: data.getItemVisual(idx, 'opacity')
+        }
+    );
+
+    labelText.ignore = labelText.normalIgnore = !labelModel.get('show');
+    labelText.hoverIgnore = !labelHoverModel.get('show');
+
+    labelLine.ignore = labelLine.normalIgnore = !labelLineModel.get('show');
+    labelLine.hoverIgnore = !labelLineHoverModel.get('show');
+
+    // Default use item visual color
+    labelLine.setStyle({
+        stroke: visualColor,
+        opacity: data.getItemVisual(idx, 'opacity')
+    });
+    labelLine.setStyle(labelLineModel.getModel('lineStyle').getLineStyle());
+
+    labelLine.hoverStyle = labelLineHoverModel.getModel('lineStyle').getLineStyle();
+
+    var smooth = labelLineModel.get('smooth');
+    if (smooth && smooth === true) {
+        smooth = 0.4;
+    }
+    labelLine.setShape({
+        smooth: smooth
+    });
+};
+
+inherits(PiePiece, Group);
+
+
+// Pie view
+var PieView = Chart.extend({
+
+    type: 'pie',
+
+    init: function () {
+        var sectorGroup = new Group();
+        this._sectorGroup = sectorGroup;
+    },
+
+    render: function (seriesModel, ecModel, api, payload) {
+        if (payload && (payload.from === this.uid)) {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var oldData = this._data;
+        var group = this.group;
+
+        var hasAnimation = ecModel.get('animation');
+        var isFirstRender = !oldData;
+        var animationType = seriesModel.get('animationType');
+
+        var onSectorClick = curry(
+            updateDataSelected, this.uid, seriesModel, hasAnimation, api
+        );
+
+        var selectedMode = seriesModel.get('selectedMode');
+
+        data.diff(oldData)
+            .add(function (idx) {
+                var piePiece = new PiePiece(data, idx);
+                // Default expansion animation
+                if (isFirstRender && animationType !== 'scale') {
+                    piePiece.eachChild(function (child) {
+                        child.stopAnimation(true);
+                    });
+                }
+
+                selectedMode && piePiece.on('click', onSectorClick);
+
+                data.setItemGraphicEl(idx, piePiece);
+
+                group.add(piePiece);
+            })
+            .update(function (newIdx, oldIdx) {
+                var piePiece = oldData.getItemGraphicEl(oldIdx);
+
+                piePiece.updateData(data, newIdx);
+
+                piePiece.off('click');
+                selectedMode && piePiece.on('click', onSectorClick);
+                group.add(piePiece);
+                data.setItemGraphicEl(newIdx, piePiece);
+            })
+            .remove(function (idx) {
+                var piePiece = oldData.getItemGraphicEl(idx);
+                group.remove(piePiece);
+            })
+            .execute();
+
+        if (
+            hasAnimation && isFirstRender && data.count() > 0
+            // Default expansion animation
+            && animationType !== 'scale'
+        ) {
+            var shape = data.getItemLayout(0);
+            var r = Math.max(api.getWidth(), api.getHeight()) / 2;
+
+            var removeClipPath = bind(group.removeClipPath, group);
+            group.setClipPath(this._createClipPath(
+                shape.cx, shape.cy, r, shape.startAngle, shape.clockwise, removeClipPath, seriesModel
+            ));
+        }
+
+        this._data = data;
+    },
+
+    dispose: function () {},
+
+    _createClipPath: function (
+        cx, cy, r, startAngle, clockwise, cb, seriesModel
+    ) {
+        var clipPath = new Sector({
+            shape: {
+                cx: cx,
+                cy: cy,
+                r0: 0,
+                r: r,
+                startAngle: startAngle,
+                endAngle: startAngle,
+                clockwise: clockwise
+            }
+        });
+
+        initProps(clipPath, {
+            shape: {
+                endAngle: startAngle + (clockwise ? 1 : -1) * Math.PI * 2
+            }
+        }, seriesModel, cb);
+
+        return clipPath;
+    },
+
+    /**
+     * @implement
+     */
+    containPoint: function (point, seriesModel) {
+        var data = seriesModel.getData();
+        var itemLayout = data.getItemLayout(0);
+        if (itemLayout) {
+            var dx = point[0] - itemLayout.cx;
+            var dy = point[1] - itemLayout.cy;
+            var radius = Math.sqrt(dx * dx + dy * dy);
+            return radius <= itemLayout.r && radius >= itemLayout.r0;
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var createDataSelectAction = function (seriesType, actionInfos) {
+    each$1(actionInfos, function (actionInfo) {
+        actionInfo.update = 'updateView';
+        /**
+         * @payload
+         * @property {string} seriesName
+         * @property {string} name
+         */
+        registerAction(actionInfo, function (payload, ecModel) {
+            var selected = {};
+            ecModel.eachComponent(
+                {mainType: 'series', subType: seriesType, query: payload},
+                function (seriesModel) {
+                    if (seriesModel[actionInfo.method]) {
+                        seriesModel[actionInfo.method](
+                            payload.name,
+                            payload.dataIndex
+                        );
+                    }
+                    var data = seriesModel.getData();
+                    // Create selected map
+                    data.each(function (idx) {
+                        var name = data.getName(idx);
+                        selected[name] = seriesModel.isSelected(name)
+                            || false;
+                    });
+                }
+            );
+            return {
+                name: payload.name,
+                selected: selected
+            };
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Pick color from palette for each data item.
+// Applicable for charts that require applying color palette
+// in data level (like pie, funnel, chord).
+var dataColor = function (seriesType) {
+    return {
+        getTargetSeries: function (ecModel) {
+            // Pie and funnel may use diferrent scope
+            var paletteScope = {};
+            var seiresModelMap = createHashMap();
+
+            ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+                seriesModel.__paletteScope = paletteScope;
+                seiresModelMap.set(seriesModel.uid, seriesModel);
+            });
+
+            return seiresModelMap;
+        },
+        reset: function (seriesModel, ecModel) {
+            var dataAll = seriesModel.getRawData();
+            var idxMap = {};
+            var data = seriesModel.getData();
+
+            data.each(function (idx) {
+                var rawIdx = data.getRawIndex(idx);
+                idxMap[rawIdx] = idx;
+            });
+
+            dataAll.each(function (rawIdx) {
+                var filteredIdx = idxMap[rawIdx];
+
+                // If series.itemStyle.normal.color is a function. itemVisual may be encoded
+                var singleDataColor = filteredIdx != null
+                    && data.getItemVisual(filteredIdx, 'color', true);
+
+                if (!singleDataColor) {
+                    // FIXME Performance
+                    var itemModel = dataAll.getItemModel(rawIdx);
+
+                    var color = itemModel.get('itemStyle.color')
+                        || seriesModel.getColorFromPalette(
+                            dataAll.getName(rawIdx) || (rawIdx + ''), seriesModel.__paletteScope,
+                            dataAll.count()
+                        );
+                    // Legend may use the visual info in data before processed
+                    dataAll.setItemVisual(rawIdx, 'color', color);
+
+                    // Data is not filtered
+                    if (filteredIdx != null) {
+                        data.setItemVisual(filteredIdx, 'color', color);
+                    }
+                }
+                else {
+                    // Set data all color for legend
+                    dataAll.setItemVisual(rawIdx, 'color', singleDataColor);
+                }
+            });
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME emphasis label position is not same with normal label position
+
+function adjustSingleSide(list, cx, cy, r, dir, viewWidth, viewHeight) {
+    list.sort(function (a, b) {
+        return a.y - b.y;
+    });
+
+    // 压
+    function shiftDown(start, end, delta, dir) {
+        for (var j = start; j < end; j++) {
+            list[j].y += delta;
+            if (j > start
+                && j + 1 < end
+                && list[j + 1].y > list[j].y + list[j].height
+            ) {
+                shiftUp(j, delta / 2);
+                return;
+            }
+        }
+
+        shiftUp(end - 1, delta / 2);
+    }
+
+    // 弹
+    function shiftUp(end, delta) {
+        for (var j = end; j >= 0; j--) {
+            list[j].y -= delta;
+            if (j > 0
+                && list[j].y > list[j - 1].y + list[j - 1].height
+            ) {
+                break;
+            }
+        }
+    }
+
+    function changeX(list, isDownList, cx, cy, r, dir) {
+        var lastDeltaX = dir > 0
+            ? isDownList                // 右侧
+                ? Number.MAX_VALUE      // 下
+                : 0                     // 上
+            : isDownList                // 左侧
+                ? Number.MAX_VALUE      // 下
+                : 0;                    // 上
+
+        for (var i = 0, l = list.length; i < l; i++) {
+            // Not change x for center label
+            if (list[i].position === 'center') {
+                continue;
+            }
+            var deltaY = Math.abs(list[i].y - cy);
+            var length = list[i].len;
+            var length2 = list[i].len2;
+            var deltaX = (deltaY < r + length)
+                ? Math.sqrt(
+                        (r + length + length2) * (r + length + length2)
+                        - deltaY * deltaY
+                    )
+                : Math.abs(list[i].x - cx);
+            if (isDownList && deltaX >= lastDeltaX) {
+                // 右下，左下
+                deltaX = lastDeltaX - 10;
+            }
+            if (!isDownList && deltaX <= lastDeltaX) {
+                // 右上，左上
+                deltaX = lastDeltaX + 10;
+            }
+
+            list[i].x = cx + deltaX * dir;
+            lastDeltaX = deltaX;
+        }
+    }
+
+    var lastY = 0;
+    var delta;
+    var len = list.length;
+    var upList = [];
+    var downList = [];
+    for (var i = 0; i < len; i++) {
+        delta = list[i].y - lastY;
+        if (delta < 0) {
+            shiftDown(i, len, -delta, dir);
+        }
+        lastY = list[i].y + list[i].height;
+    }
+    if (viewHeight - lastY < 0) {
+        shiftUp(len - 1, lastY - viewHeight);
+    }
+    for (var i = 0; i < len; i++) {
+        if (list[i].y >= cy) {
+            downList.push(list[i]);
+        }
+        else {
+            upList.push(list[i]);
+        }
+    }
+    changeX(upList, false, cx, cy, r, dir);
+    changeX(downList, true, cx, cy, r, dir);
+}
+
+function avoidOverlap(labelLayoutList, cx, cy, r, viewWidth, viewHeight) {
+    var leftList = [];
+    var rightList = [];
+    for (var i = 0; i < labelLayoutList.length; i++) {
+        if (labelLayoutList[i].x < cx) {
+            leftList.push(labelLayoutList[i]);
+        }
+        else {
+            rightList.push(labelLayoutList[i]);
+        }
+    }
+
+    adjustSingleSide(rightList, cx, cy, r, 1, viewWidth, viewHeight);
+    adjustSingleSide(leftList, cx, cy, r, -1, viewWidth, viewHeight);
+
+    for (var i = 0; i < labelLayoutList.length; i++) {
+        var linePoints = labelLayoutList[i].linePoints;
+        if (linePoints) {
+            var dist = linePoints[1][0] - linePoints[2][0];
+            if (labelLayoutList[i].x < cx) {
+                linePoints[2][0] = labelLayoutList[i].x + 3;
+            }
+            else {
+                linePoints[2][0] = labelLayoutList[i].x - 3;
+            }
+            linePoints[1][1] = linePoints[2][1] = labelLayoutList[i].y;
+            linePoints[1][0] = linePoints[2][0] + dist;
+        }
+    }
+}
+
+var labelLayout = function (seriesModel, r, viewWidth, viewHeight) {
+    var data = seriesModel.getData();
+    var labelLayoutList = [];
+    var cx;
+    var cy;
+    var hasLabelRotate = false;
+
+    data.each(function (idx) {
+        var layout = data.getItemLayout(idx);
+
+        var itemModel = data.getItemModel(idx);
+        var labelModel = itemModel.getModel('label');
+        // Use position in normal or emphasis
+        var labelPosition = labelModel.get('position') || itemModel.get('emphasis.label.position');
+
+        var labelLineModel = itemModel.getModel('labelLine');
+        var labelLineLen = labelLineModel.get('length');
+        var labelLineLen2 = labelLineModel.get('length2');
+
+        var midAngle = (layout.startAngle + layout.endAngle) / 2;
+        var dx = Math.cos(midAngle);
+        var dy = Math.sin(midAngle);
+
+        var textX;
+        var textY;
+        var linePoints;
+        var textAlign;
+
+        cx = layout.cx;
+        cy = layout.cy;
+
+        var isLabelInside = labelPosition === 'inside' || labelPosition === 'inner';
+        if (labelPosition === 'center') {
+            textX = layout.cx;
+            textY = layout.cy;
+            textAlign = 'center';
+        }
+        else {
+            var x1 = (isLabelInside ? (layout.r + layout.r0) / 2 * dx : layout.r * dx) + cx;
+            var y1 = (isLabelInside ? (layout.r + layout.r0) / 2 * dy : layout.r * dy) + cy;
+
+            textX = x1 + dx * 3;
+            textY = y1 + dy * 3;
+
+            if (!isLabelInside) {
+                // For roseType
+                var x2 = x1 + dx * (labelLineLen + r - layout.r);
+                var y2 = y1 + dy * (labelLineLen + r - layout.r);
+                var x3 = x2 + ((dx < 0 ? -1 : 1) * labelLineLen2);
+                var y3 = y2;
+
+                textX = x3 + (dx < 0 ? -5 : 5);
+                textY = y3;
+                linePoints = [[x1, y1], [x2, y2], [x3, y3]];
+            }
+
+            textAlign = isLabelInside ? 'center' : (dx > 0 ? 'left' : 'right');
+        }
+        var font = labelModel.getFont();
+
+        var labelRotate = labelModel.get('rotate')
+            ? (dx < 0 ? -midAngle + Math.PI : -midAngle) : 0;
+        var text = seriesModel.getFormattedLabel(idx, 'normal')
+                    || data.getName(idx);
+        var textRect = getBoundingRect(
+            text, font, textAlign, 'top'
+        );
+        hasLabelRotate = !!labelRotate;
+        layout.label = {
+            x: textX,
+            y: textY,
+            position: labelPosition,
+            height: textRect.height,
+            len: labelLineLen,
+            len2: labelLineLen2,
+            linePoints: linePoints,
+            textAlign: textAlign,
+            verticalAlign: 'middle',
+            rotation: labelRotate,
+            inside: isLabelInside
+        };
+
+        // Not layout the inside label
+        if (!isLabelInside) {
+            labelLayoutList.push(layout.label);
+        }
+    });
+    if (!hasLabelRotate && seriesModel.get('avoidLabelOverlap')) {
+        avoidOverlap(labelLayoutList, cx, cy, r, viewWidth, viewHeight);
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var PI2$4 = Math.PI * 2;
+var RADIAN = Math.PI / 180;
+
+var pieLayout = function (seriesType, ecModel, api, payload) {
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+
+        var center = seriesModel.get('center');
+        var radius = seriesModel.get('radius');
+
+        if (!isArray(radius)) {
+            radius = [0, radius];
+        }
+        if (!isArray(center)) {
+            center = [center, center];
+        }
+
+        var width = api.getWidth();
+        var height = api.getHeight();
+        var size = Math.min(width, height);
+        var cx = parsePercent$1(center[0], width);
+        var cy = parsePercent$1(center[1], height);
+        var r0 = parsePercent$1(radius[0], size / 2);
+        var r = parsePercent$1(radius[1], size / 2);
+
+        var startAngle = -seriesModel.get('startAngle') * RADIAN;
+
+        var minAngle = seriesModel.get('minAngle') * RADIAN;
+
+        var validDataCount = 0;
+        data.each(valueDim, function (value) {
+            !isNaN(value) && validDataCount++;
+        });
+
+        var sum = data.getSum(valueDim);
+        // Sum may be 0
+        var unitRadian = Math.PI / (sum || validDataCount) * 2;
+
+        var clockwise = seriesModel.get('clockwise');
+
+        var roseType = seriesModel.get('roseType');
+        var stillShowZeroSum = seriesModel.get('stillShowZeroSum');
+
+        // [0...max]
+        var extent = data.getDataExtent(valueDim);
+        extent[0] = 0;
+
+        // In the case some sector angle is smaller than minAngle
+        var restAngle = PI2$4;
+        var valueSumLargerThanMinAngle = 0;
+
+        var currentAngle = startAngle;
+        var dir = clockwise ? 1 : -1;
+
+        data.each(valueDim, function (value, idx) {
+            var angle;
+            if (isNaN(value)) {
+                data.setItemLayout(idx, {
+                    angle: NaN,
+                    startAngle: NaN,
+                    endAngle: NaN,
+                    clockwise: clockwise,
+                    cx: cx,
+                    cy: cy,
+                    r0: r0,
+                    r: roseType
+                        ? NaN
+                        : r
+                });
+                return;
+            }
+
+            // FIXME 兼容 2.0 但是 roseType 是 area 的时候才是这样？
+            if (roseType !== 'area') {
+                angle = (sum === 0 && stillShowZeroSum)
+                    ? unitRadian : (value * unitRadian);
+            }
+            else {
+                angle = PI2$4 / validDataCount;
+            }
+
+            if (angle < minAngle) {
+                angle = minAngle;
+                restAngle -= minAngle;
+            }
+            else {
+                valueSumLargerThanMinAngle += value;
+            }
+
+            var endAngle = currentAngle + dir * angle;
+            data.setItemLayout(idx, {
+                angle: angle,
+                startAngle: currentAngle,
+                endAngle: endAngle,
+                clockwise: clockwise,
+                cx: cx,
+                cy: cy,
+                r0: r0,
+                r: roseType
+                    ? linearMap(value, extent, [r0, r])
+                    : r
+            });
+
+            currentAngle = endAngle;
+        });
+
+        // Some sector is constrained by minAngle
+        // Rest sectors needs recalculate angle
+        if (restAngle < PI2$4 && validDataCount) {
+            // Average the angle if rest angle is not enough after all angles is
+            // Constrained by minAngle
+            if (restAngle <= 1e-3) {
+                var angle = PI2$4 / validDataCount;
+                data.each(valueDim, function (value, idx) {
+                    if (!isNaN(value)) {
+                        var layout = data.getItemLayout(idx);
+                        layout.angle = angle;
+                        layout.startAngle = startAngle + dir * idx * angle;
+                        layout.endAngle = startAngle + dir * (idx + 1) * angle;
+                    }
+                });
+            }
+            else {
+                unitRadian = restAngle / valueSumLargerThanMinAngle;
+                currentAngle = startAngle;
+                data.each(valueDim, function (value, idx) {
+                    if (!isNaN(value)) {
+                        var layout = data.getItemLayout(idx);
+                        var angle = layout.angle === minAngle
+                            ? minAngle : value * unitRadian;
+                        layout.startAngle = currentAngle;
+                        layout.endAngle = currentAngle + dir * angle;
+                        currentAngle += dir * angle;
+                    }
+                });
+            }
+        }
+
+        labelLayout(seriesModel, r, width, height);
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var dataFilter = function (seriesType) {
+    return {
+        seriesType: seriesType,
+        reset: function (seriesModel, ecModel) {
+            var legendModels = ecModel.findComponents({
+                mainType: 'legend'
+            });
+            if (!legendModels || !legendModels.length) {
+                return;
+            }
+            var data = seriesModel.getData();
+            data.filterSelf(function (idx) {
+                var name = data.getName(idx);
+                // If in any legend component the status is not selected.
+                for (var i = 0; i < legendModels.length; i++) {
+                    if (!legendModels[i].isSelected(name)) {
+                        return false;
+                    }
+                }
+                return true;
+            });
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+createDataSelectAction('pie', [{
+    type: 'pieToggleSelect',
+    event: 'pieselectchanged',
+    method: 'toggleSelected'
+}, {
+    type: 'pieSelect',
+    event: 'pieselected',
+    method: 'select'
+}, {
+    type: 'pieUnSelect',
+    event: 'pieunselected',
+    method: 'unSelect'
+}]);
+
+registerVisual(dataColor('pie'));
+registerLayout(curry(pieLayout, 'pie'));
+registerProcessor(dataFilter('pie'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.scatter',
+
+    dependencies: ['grid', 'polar', 'geo', 'singleAxis', 'calendar'],
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    },
+
+    brushSelector: 'point',
+
+    getProgressive: function () {
+        var progressive = this.option.progressive;
+        if (progressive == null) {
+            // PENDING
+            return this.option.large ? 5e3 : this.get('progressive');
+        }
+        return progressive;
+    },
+
+    getProgressiveThreshold: function () {
+        var progressiveThreshold = this.option.progressiveThreshold;
+        if (progressiveThreshold == null) {
+            // PENDING
+            return this.option.large ? 1e4 : this.get('progressiveThreshold');
+        }
+        return progressiveThreshold;
+    },
+
+    defaultOption: {
+        coordinateSystem: 'cartesian2d',
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Polar coordinate system
+        // polarIndex: 0,
+
+        // Geo coordinate system
+        // geoIndex: 0,
+
+        // symbol: null,        // 图形类型
+        symbolSize: 10,          // 图形大小，半宽（半径）参数，当图形为方向或菱形则总宽度为symbolSize * 2
+        // symbolRotate: null,  // 图形旋转控制
+
+        large: false,
+        // Available when large is true
+        largeThreshold: 2000,
+        // cursor: null,
+
+        // label: {
+            // show: false
+            // distance: 5,
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+            // position: 默认自适应，水平布局为'top'，垂直布局为'right'，可选为
+            //           'inside'|'left'|'right'|'top'|'bottom'
+            // 默认使用全局文本样式，详见TEXTSTYLE
+        // },
+        itemStyle: {
+            opacity: 0.8
+            // color: 各异
+        }
+
+        // progressive: null
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Batch by color
+
+var BOOST_SIZE_THRESHOLD = 4;
+
+var LargeSymbolPath = extendShape({
+
+    shape: {
+        points: null
+    },
+
+    symbolProxy: null,
+
+    buildPath: function (path, shape) {
+        var points = shape.points;
+        var size = shape.size;
+
+        var symbolProxy = this.symbolProxy;
+        var symbolProxyShape = symbolProxy.shape;
+        var ctx = path.getContext ? path.getContext() : path;
+        var canBoost = ctx && size[0] < BOOST_SIZE_THRESHOLD;
+
+        // Do draw in afterBrush.
+        if (canBoost) {
+            return;
+        }
+
+        for (var i = 0; i < points.length;) {
+            var x = points[i++];
+            var y = points[i++];
+
+            if (isNaN(x) || isNaN(y)) {
+                continue;
+            }
+
+            symbolProxyShape.x = x - size[0] / 2;
+            symbolProxyShape.y = y - size[1] / 2;
+            symbolProxyShape.width = size[0];
+            symbolProxyShape.height = size[1];
+
+            symbolProxy.buildPath(path, symbolProxyShape, true);
+        }
+    },
+
+    afterBrush: function (ctx) {
+        var shape = this.shape;
+        var points = shape.points;
+        var size = shape.size;
+        var canBoost = size[0] < BOOST_SIZE_THRESHOLD;
+
+        if (!canBoost) {
+            return;
+        }
+
+        this.setTransform(ctx);
+        // PENDING If style or other canvas status changed?
+        for (var i = 0; i < points.length;) {
+            var x = points[i++];
+            var y = points[i++];
+            if (isNaN(x) || isNaN(y)) {
+                continue;
+            }
+            // fillRect is faster than building a rect path and draw.
+            // And it support light globalCompositeOperation.
+            ctx.fillRect(
+                x - size[0] / 2, y - size[1] / 2,
+                size[0], size[1]
+            );
+        }
+
+        this.restoreTransform(ctx);
+    },
+
+    findDataIndex: function (x, y) {
+        // TODO ???
+        // Consider transform
+
+        var shape = this.shape;
+        var points = shape.points;
+        var size = shape.size;
+
+        var w = Math.max(size[0], 4);
+        var h = Math.max(size[1], 4);
+
+        // Not consider transform
+        // Treat each element as a rect
+        // top down traverse
+        for (var idx = points.length / 2 - 1; idx >= 0; idx--) {
+            var i = idx * 2;
+            var x0 = points[i] - w / 2;
+            var y0 = points[i + 1] - h / 2;
+            if (x >= x0 && y >= y0 && x <= x0 + w && y <= y0 + h) {
+                return idx;
+            }
+        }
+
+        return -1;
+    }
+});
+
+function LargeSymbolDraw() {
+    this.group = new Group();
+}
+
+var largeSymbolProto = LargeSymbolDraw.prototype;
+
+largeSymbolProto.isPersistent = function () {
+    return !this._incremental;
+};
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ */
+largeSymbolProto.updateData = function (data) {
+    this.group.removeAll();
+    var symbolEl = new LargeSymbolPath({
+        rectHover: true,
+        cursor: 'default'
+    });
+
+    symbolEl.setShape({
+        points: data.getLayout('symbolPoints')
+    });
+    this._setCommon(symbolEl, data);
+    this.group.add(symbolEl);
+
+    this._incremental = null;
+};
+
+largeSymbolProto.updateLayout = function (data) {
+    if (this._incremental) {
+        return;
+    }
+
+    var points = data.getLayout('symbolPoints');
+    this.group.eachChild(function (child) {
+        if (child.startIndex != null) {
+            var len = (child.endIndex - child.startIndex) * 2;
+            var byteOffset = child.startIndex * 4 * 2;
+            points = new Float32Array(points.buffer, byteOffset, len);
+        }
+        child.setShape('points', points);
+    });
+};
+
+largeSymbolProto.incrementalPrepareUpdate = function (data) {
+    this.group.removeAll();
+
+    this._clearIncremental();
+    // Only use incremental displayables when data amount is larger than 2 million.
+    // PENDING Incremental data?
+    if (data.count() > 2e6) {
+        if (!this._incremental) {
+            this._incremental = new IncrementalDisplayble({
+                silent: true
+            });
+        }
+        this.group.add(this._incremental);
+    }
+    else {
+        this._incremental = null;
+    }
+};
+
+largeSymbolProto.incrementalUpdate = function (taskParams, data) {
+    var symbolEl;
+    if (this._incremental) {
+        symbolEl = new LargeSymbolPath();
+        this._incremental.addDisplayable(symbolEl, true);
+    }
+    else {
+        symbolEl = new LargeSymbolPath({
+            rectHover: true,
+            cursor: 'default',
+            startIndex: taskParams.start,
+            endIndex: taskParams.end
+        });
+        symbolEl.incremental = true;
+        this.group.add(symbolEl);
+    }
+
+    symbolEl.setShape({
+        points: data.getLayout('symbolPoints')
+    });
+    this._setCommon(symbolEl, data, !!this._incremental);
+};
+
+largeSymbolProto._setCommon = function (symbolEl, data, isIncremental) {
+    var hostModel = data.hostModel;
+
+    // TODO
+    // if (data.hasItemVisual.symbolSize) {
+    //     // TODO typed array?
+    //     symbolEl.setShape('sizes', data.mapArray(
+    //         function (idx) {
+    //             var size = data.getItemVisual(idx, 'symbolSize');
+    //             return (size instanceof Array) ? size : [size, size];
+    //         }
+    //     ));
+    // }
+    // else {
+    var size = data.getVisual('symbolSize');
+    symbolEl.setShape('size', (size instanceof Array) ? size : [size, size]);
+    // }
+
+    // Create symbolProxy to build path for each data
+    symbolEl.symbolProxy = createSymbol(
+        data.getVisual('symbol'), 0, 0, 0, 0
+    );
+    // Use symbolProxy setColor method
+    symbolEl.setColor = symbolEl.symbolProxy.setColor;
+
+    var extrudeShadow = symbolEl.shape.size[0] < BOOST_SIZE_THRESHOLD;
+    symbolEl.useStyle(
+        // Draw shadow when doing fillRect is extremely slow.
+        hostModel.getModel('itemStyle').getItemStyle(extrudeShadow ? ['color', 'shadowBlur', 'shadowColor'] : ['color'])
+    );
+
+    var visualColor = data.getVisual('color');
+    if (visualColor) {
+        symbolEl.setColor(visualColor);
+    }
+
+    if (!isIncremental) {
+        // Enable tooltip
+        // PENDING May have performance issue when path is extremely large
+        symbolEl.seriesIndex = hostModel.seriesIndex;
+        symbolEl.on('mousemove', function (e) {
+            symbolEl.dataIndex = null;
+            var dataIndex = symbolEl.findDataIndex(e.offsetX, e.offsetY);
+            if (dataIndex >= 0) {
+                // Provide dataIndex for tooltip
+                symbolEl.dataIndex = dataIndex + (symbolEl.startIndex || 0);
+            }
+        });
+    }
+};
+
+largeSymbolProto.remove = function () {
+    this._clearIncremental();
+    this._incremental = null;
+    this.group.removeAll();
+};
+
+largeSymbolProto._clearIncremental = function () {
+    var incremental = this._incremental;
+    if (incremental) {
+        incremental.clearDisplaybles();
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'scatter',
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var symbolDraw = this._updateSymbolDraw(data, seriesModel);
+        symbolDraw.updateData(data);
+
+        this._finished = true;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var symbolDraw = this._updateSymbolDraw(data, seriesModel);
+
+        symbolDraw.incrementalPrepareUpdate(data);
+
+        this._finished = false;
+    },
+
+    incrementalRender: function (taskParams, seriesModel, ecModel) {
+        this._symbolDraw.incrementalUpdate(taskParams, seriesModel.getData());
+
+        this._finished = taskParams.end === seriesModel.getData().count();
+    },
+
+    updateTransform: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        // Must mark group dirty and make sure the incremental layer will be cleared
+        // PENDING
+        this.group.dirty();
+
+        if (!this._finished || data.count() > 1e4 || !this._symbolDraw.isPersistent()) {
+            return {
+                update: true
+            };
+        }
+        else {
+            var res = pointsLayout().reset(seriesModel);
+            if (res.progress) {
+                res.progress({ start: 0, end: data.count() }, data);
+            }
+
+            this._symbolDraw.updateLayout(data);
+        }
+    },
+
+    _updateSymbolDraw: function (data, seriesModel) {
+        var symbolDraw = this._symbolDraw;
+        var pipelineContext = seriesModel.pipelineContext;
+        var isLargeDraw = pipelineContext.large;
+
+        if (!symbolDraw || isLargeDraw !== this._isLargeDraw) {
+            symbolDraw && symbolDraw.remove();
+            symbolDraw = this._symbolDraw = isLargeDraw
+                ? new LargeSymbolDraw()
+                : new SymbolDraw();
+            this._isLargeDraw = isLargeDraw;
+            this.group.removeAll();
+        }
+
+        this.group.add(symbolDraw.group);
+
+        return symbolDraw;
+    },
+
+    remove: function (ecModel, api) {
+        this._symbolDraw && this._symbolDraw.remove(true);
+        this._symbolDraw = null;
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// import * as zrUtil from 'zrender/src/core/util';
+
+// In case developer forget to include grid component
+registerVisual(visualSymbol('scatter', 'circle'));
+registerLayout(pointsLayout('scatter'));
+
+// echarts.registerProcessor(function (ecModel, api) {
+//     ecModel.eachSeriesByType('scatter', function (seriesModel) {
+//         var data = seriesModel.getData();
+//         var coordSys = seriesModel.coordinateSystem;
+//         if (coordSys.type !== 'geo') {
+//             return;
+//         }
+//         var startPt = coordSys.pointToData([0, 0]);
+//         var endPt = coordSys.pointToData([api.getWidth(), api.getHeight()]);
+
+//         var dims = zrUtil.map(coordSys.dimensions, function (dim) {
+//             return data.mapDimension(dim);
+//         });
+//         var range = {};
+//         range[dims[0]] = [Math.min(startPt[0], endPt[0]), Math.max(startPt[0], endPt[0])];
+//         range[dims[1]] = [Math.min(startPt[1], endPt[1]), Math.max(startPt[1], endPt[1])];
+
+//         data.selectRange(range);
+//     });
+// });
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function IndicatorAxis(dim, scale, radiusExtent) {
+    Axis.call(this, dim, scale, radiusExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = 'value';
+
+    this.angle = 0;
+
+    /**
+     * Indicator name
+     * @type {string}
+     */
+    this.name = '';
+    /**
+     * @type {module:echarts/model/Model}
+     */
+    this.model;
+}
+
+inherits(IndicatorAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO clockwise
+
+function Radar(radarModel, ecModel, api) {
+
+    this._model = radarModel;
+    /**
+     * Radar dimensions
+     * @type {Array.<string>}
+     */
+    this.dimensions = [];
+
+    this._indicatorAxes = map(radarModel.getIndicatorModels(), function (indicatorModel, idx) {
+        var dim = 'indicator_' + idx;
+        var indicatorAxis = new IndicatorAxis(dim, new IntervalScale());
+        indicatorAxis.name = indicatorModel.get('name');
+        // Inject model and axis
+        indicatorAxis.model = indicatorModel;
+        indicatorModel.axis = indicatorAxis;
+        this.dimensions.push(dim);
+        return indicatorAxis;
+    }, this);
+
+    this.resize(radarModel, api);
+
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.cx;
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.cy;
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.r;
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.startAngle;
+}
+
+Radar.prototype.getIndicatorAxes = function () {
+    return this._indicatorAxes;
+};
+
+Radar.prototype.dataToPoint = function (value, indicatorIndex) {
+    var indicatorAxis = this._indicatorAxes[indicatorIndex];
+
+    return this.coordToPoint(indicatorAxis.dataToCoord(value), indicatorIndex);
+};
+
+Radar.prototype.coordToPoint = function (coord, indicatorIndex) {
+    var indicatorAxis = this._indicatorAxes[indicatorIndex];
+    var angle = indicatorAxis.angle;
+    var x = this.cx + coord * Math.cos(angle);
+    var y = this.cy - coord * Math.sin(angle);
+    return [x, y];
+};
+
+Radar.prototype.pointToData = function (pt) {
+    var dx = pt[0] - this.cx;
+    var dy = pt[1] - this.cy;
+    var radius = Math.sqrt(dx * dx + dy * dy);
+    dx /= radius;
+    dy /= radius;
+
+    var radian = Math.atan2(-dy, dx);
+
+    // Find the closest angle
+    // FIXME index can calculated directly
+    var minRadianDiff = Infinity;
+    var closestAxis;
+    var closestAxisIdx = -1;
+    for (var i = 0; i < this._indicatorAxes.length; i++) {
+        var indicatorAxis = this._indicatorAxes[i];
+        var diff = Math.abs(radian - indicatorAxis.angle);
+        if (diff < minRadianDiff) {
+            closestAxis = indicatorAxis;
+            closestAxisIdx = i;
+            minRadianDiff = diff;
+        }
+    }
+
+    return [closestAxisIdx, +(closestAxis && closestAxis.coodToData(radius))];
+};
+
+Radar.prototype.resize = function (radarModel, api) {
+    var center = radarModel.get('center');
+    var viewWidth = api.getWidth();
+    var viewHeight = api.getHeight();
+    var viewSize = Math.min(viewWidth, viewHeight) / 2;
+    this.cx = parsePercent$1(center[0], viewWidth);
+    this.cy = parsePercent$1(center[1], viewHeight);
+
+    this.startAngle = radarModel.get('startAngle') * Math.PI / 180;
+
+    this.r = parsePercent$1(radarModel.get('radius'), viewSize);
+
+    each$1(this._indicatorAxes, function (indicatorAxis, idx) {
+        indicatorAxis.setExtent(0, this.r);
+        var angle = (this.startAngle + idx * Math.PI * 2 / this._indicatorAxes.length);
+        // Normalize to [-PI, PI]
+        angle = Math.atan2(Math.sin(angle), Math.cos(angle));
+        indicatorAxis.angle = angle;
+    }, this);
+};
+
+Radar.prototype.update = function (ecModel, api) {
+    var indicatorAxes = this._indicatorAxes;
+    var radarModel = this._model;
+    each$1(indicatorAxes, function (indicatorAxis) {
+        indicatorAxis.scale.setExtent(Infinity, -Infinity);
+    });
+    ecModel.eachSeriesByType('radar', function (radarSeries, idx) {
+        if (radarSeries.get('coordinateSystem') !== 'radar'
+            || ecModel.getComponent('radar', radarSeries.get('radarIndex')) !== radarModel
+        ) {
+            return;
+        }
+        var data = radarSeries.getData();
+        each$1(indicatorAxes, function (indicatorAxis) {
+            indicatorAxis.scale.unionExtentFromData(data, data.mapDimension(indicatorAxis.dim));
+        });
+    }, this);
+
+    var splitNumber = radarModel.get('splitNumber');
+
+    function increaseInterval(interval) {
+        var exp10 = Math.pow(10, Math.floor(Math.log(interval) / Math.LN10));
+        // Increase interval
+        var f = interval / exp10;
+        if (f === 2) {
+            f = 5;
+        }
+        else { // f is 2 or 5
+            f *= 2;
+        }
+        return f * exp10;
+    }
+    // Force all the axis fixing the maxSplitNumber.
+    each$1(indicatorAxes, function (indicatorAxis, idx) {
+        var rawExtent = getScaleExtent(indicatorAxis.scale, indicatorAxis.model);
+        niceScaleExtent(indicatorAxis.scale, indicatorAxis.model);
+
+        var axisModel = indicatorAxis.model;
+        var scale = indicatorAxis.scale;
+        var fixedMin = axisModel.getMin();
+        var fixedMax = axisModel.getMax();
+        var interval = scale.getInterval();
+
+        if (fixedMin != null && fixedMax != null) {
+            // User set min, max, divide to get new interval
+            scale.setExtent(+fixedMin, +fixedMax);
+            scale.setInterval(
+                (fixedMax - fixedMin) / splitNumber
+            );
+        }
+        else if (fixedMin != null) {
+            var max;
+            // User set min, expand extent on the other side
+            do {
+                max = fixedMin + interval * splitNumber;
+                scale.setExtent(+fixedMin, max);
+                // Interval must been set after extent
+                // FIXME
+                scale.setInterval(interval);
+
+                interval = increaseInterval(interval);
+            } while (max < rawExtent[1] && isFinite(max) && isFinite(rawExtent[1]));
+        }
+        else if (fixedMax != null) {
+            var min;
+            // User set min, expand extent on the other side
+            do {
+                min = fixedMax - interval * splitNumber;
+                scale.setExtent(min, +fixedMax);
+                scale.setInterval(interval);
+                interval = increaseInterval(interval);
+            } while (min > rawExtent[0] && isFinite(min) && isFinite(rawExtent[0]));
+        }
+        else {
+            var nicedSplitNumber = scale.getTicks().length - 1;
+            if (nicedSplitNumber > splitNumber) {
+                interval = increaseInterval(interval);
+            }
+            // PENDING
+            var center = Math.round((rawExtent[0] + rawExtent[1]) / 2 / interval) * interval;
+            var halfSplitNumber = Math.round(splitNumber / 2);
+            scale.setExtent(
+                round$1(center - halfSplitNumber * interval),
+                round$1(center + (splitNumber - halfSplitNumber) * interval)
+            );
+            scale.setInterval(interval);
+        }
+    });
+};
+
+/**
+ * Radar dimensions is based on the data
+ * @type {Array}
+ */
+Radar.dimensions = [];
+
+Radar.create = function (ecModel, api) {
+    var radarList = [];
+    ecModel.eachComponent('radar', function (radarModel) {
+        var radar = new Radar(radarModel, ecModel, api);
+        radarList.push(radar);
+        radarModel.coordinateSystem = radar;
+    });
+    ecModel.eachSeriesByType('radar', function (radarSeries) {
+        if (radarSeries.get('coordinateSystem') === 'radar') {
+            // Inject coordinate system
+            radarSeries.coordinateSystem = radarList[radarSeries.get('radarIndex') || 0];
+        }
+    });
+    return radarList;
+};
+
+CoordinateSystemManager.register('radar', Radar);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var valueAxisDefault = axisDefault.valueAxis;
+
+function defaultsShow(opt, show) {
+    return defaults({
+        show: show
+    }, opt);
+}
+
+var RadarModel = extendComponentModel({
+
+    type: 'radar',
+
+    optionUpdated: function () {
+        var boundaryGap = this.get('boundaryGap');
+        var splitNumber = this.get('splitNumber');
+        var scale = this.get('scale');
+        var axisLine = this.get('axisLine');
+        var axisTick = this.get('axisTick');
+        var axisLabel = this.get('axisLabel');
+        var nameTextStyle = this.get('name');
+        var showName = this.get('name.show');
+        var nameFormatter = this.get('name.formatter');
+        var nameGap = this.get('nameGap');
+        var triggerEvent = this.get('triggerEvent');
+
+        var indicatorModels = map(this.get('indicator') || [], function (indicatorOpt) {
+            // PENDING
+            if (indicatorOpt.max != null && indicatorOpt.max > 0 && !indicatorOpt.min) {
+                indicatorOpt.min = 0;
+            }
+            else if (indicatorOpt.min != null && indicatorOpt.min < 0 && !indicatorOpt.max) {
+                indicatorOpt.max = 0;
+            }
+            var iNameTextStyle = nameTextStyle;
+            if(indicatorOpt.color != null) {
+                iNameTextStyle = defaults({color: indicatorOpt.color}, nameTextStyle);
+            }
+            // Use same configuration
+            indicatorOpt = merge(clone(indicatorOpt), {
+                boundaryGap: boundaryGap,
+                splitNumber: splitNumber,
+                scale: scale,
+                axisLine: axisLine,
+                axisTick: axisTick,
+                axisLabel: axisLabel,
+                // Competitable with 2 and use text
+                name: indicatorOpt.text,
+                nameLocation: 'end',
+                nameGap: nameGap,
+                // min: 0,
+                nameTextStyle: iNameTextStyle,
+                triggerEvent: triggerEvent
+            }, false);
+            if (!showName) {
+                indicatorOpt.name = '';
+            }
+            if (typeof nameFormatter === 'string') {
+                var indName = indicatorOpt.name;
+                indicatorOpt.name = nameFormatter.replace('{value}', indName != null ? indName : '');
+            }
+            else if (typeof nameFormatter === 'function') {
+                indicatorOpt.name = nameFormatter(
+                    indicatorOpt.name, indicatorOpt
+                );
+            }
+            var model = extend(
+                new Model(indicatorOpt, null, this.ecModel),
+                axisModelCommonMixin
+            );
+
+            // For triggerEvent.
+            model.mainType = 'radar';
+            model.componentIndex = this.componentIndex;
+
+            return model;
+        }, this);
+
+        this.getIndicatorModels = function () {
+            return indicatorModels;
+        };
+    },
+
+    defaultOption: {
+
+        zlevel: 0,
+
+        z: 0,
+
+        center: ['50%', '50%'],
+
+        radius: '75%',
+
+        startAngle: 90,
+
+        name: {
+            show: true
+            // formatter: null
+            // textStyle: {}
+        },
+
+        boundaryGap: [0, 0],
+
+        splitNumber: 5,
+
+        nameGap: 15,
+
+        scale: false,
+
+        // Polygon or circle
+        shape: 'polygon',
+
+        axisLine: merge(
+            {
+                lineStyle: {
+                    color: '#bbb'
+                }
+            },
+            valueAxisDefault.axisLine
+        ),
+        axisLabel: defaultsShow(valueAxisDefault.axisLabel, false),
+        axisTick: defaultsShow(valueAxisDefault.axisTick, false),
+        splitLine: defaultsShow(valueAxisDefault.splitLine, true),
+        splitArea: defaultsShow(valueAxisDefault.splitArea, true),
+
+        // {text, min, max}
+        indicator: []
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisBuilderAttrs$1 = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+
+extendComponentView({
+
+    type: 'radar',
+
+    render: function (radarModel, ecModel, api) {
+        var group = this.group;
+        group.removeAll();
+
+        this._buildAxes(radarModel);
+        this._buildSplitLineAndArea(radarModel);
+    },
+
+    _buildAxes: function (radarModel) {
+        var radar = radarModel.coordinateSystem;
+        var indicatorAxes = radar.getIndicatorAxes();
+        var axisBuilders = map(indicatorAxes, function (indicatorAxis) {
+            var axisBuilder = new AxisBuilder(indicatorAxis.model, {
+                position: [radar.cx, radar.cy],
+                rotation: indicatorAxis.angle,
+                labelDirection: -1,
+                tickDirection: -1,
+                nameDirection: 1
+            });
+            return axisBuilder;
+        });
+
+        each$1(axisBuilders, function (axisBuilder) {
+            each$1(axisBuilderAttrs$1, axisBuilder.add, axisBuilder);
+            this.group.add(axisBuilder.getGroup());
+        }, this);
+    },
+
+    _buildSplitLineAndArea: function (radarModel) {
+        var radar = radarModel.coordinateSystem;
+        var indicatorAxes = radar.getIndicatorAxes();
+        if (!indicatorAxes.length) {
+            return;
+        }
+        var shape = radarModel.get('shape');
+        var splitLineModel = radarModel.getModel('splitLine');
+        var splitAreaModel = radarModel.getModel('splitArea');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+
+        var showSplitLine = splitLineModel.get('show');
+        var showSplitArea = splitAreaModel.get('show');
+        var splitLineColors = lineStyleModel.get('color');
+        var splitAreaColors = areaStyleModel.get('color');
+
+        splitLineColors = isArray(splitLineColors) ? splitLineColors : [splitLineColors];
+        splitAreaColors = isArray(splitAreaColors) ? splitAreaColors : [splitAreaColors];
+
+        var splitLines = [];
+        var splitAreas = [];
+
+        function getColorIndex(areaOrLine, areaOrLineColorList, idx) {
+            var colorIndex = idx % areaOrLineColorList.length;
+            areaOrLine[colorIndex] = areaOrLine[colorIndex] || [];
+            return colorIndex;
+        }
+
+        if (shape === 'circle') {
+            var ticksRadius = indicatorAxes[0].getTicksCoords();
+            var cx = radar.cx;
+            var cy = radar.cy;
+            for (var i = 0; i < ticksRadius.length; i++) {
+                if (showSplitLine) {
+                    var colorIndex = getColorIndex(splitLines, splitLineColors, i);
+                    splitLines[colorIndex].push(new Circle({
+                        shape: {
+                            cx: cx,
+                            cy: cy,
+                            r: ticksRadius[i].coord
+                        }
+                    }));
+                }
+                if (showSplitArea && i < ticksRadius.length - 1) {
+                    var colorIndex = getColorIndex(splitAreas, splitAreaColors, i);
+                    splitAreas[colorIndex].push(new Ring({
+                        shape: {
+                            cx: cx,
+                            cy: cy,
+                            r0: ticksRadius[i].coord,
+                            r: ticksRadius[i + 1].coord
+                        }
+                    }));
+                }
+            }
+        }
+        // Polyyon
+        else {
+            var realSplitNumber;
+            var axesTicksPoints = map(indicatorAxes, function (indicatorAxis, idx) {
+                var ticksCoords = indicatorAxis.getTicksCoords();
+                realSplitNumber = realSplitNumber == null
+                    ? ticksCoords.length - 1
+                    : Math.min(ticksCoords.length - 1, realSplitNumber);
+                return map(ticksCoords, function (tickCoord) {
+                    return radar.coordToPoint(tickCoord.coord, idx);
+                });
+            });
+
+            var prevPoints = [];
+            for (var i = 0; i <= realSplitNumber; i++) {
+                var points = [];
+                for (var j = 0; j < indicatorAxes.length; j++) {
+                    points.push(axesTicksPoints[j][i]);
+                }
+                // Close
+                if (points[0]) {
+                    points.push(points[0].slice());
+                }
+                else {
+                    if (__DEV__) {
+                        console.error('Can\'t draw value axis ' + i);
+                    }
+                }
+
+                if (showSplitLine) {
+                    var colorIndex = getColorIndex(splitLines, splitLineColors, i);
+                    splitLines[colorIndex].push(new Polyline({
+                        shape: {
+                            points: points
+                        }
+                    }));
+                }
+                if (showSplitArea && prevPoints) {
+                    var colorIndex = getColorIndex(splitAreas, splitAreaColors, i - 1);
+                    splitAreas[colorIndex].push(new Polygon({
+                        shape: {
+                            points: points.concat(prevPoints)
+                        }
+                    }));
+                }
+                prevPoints = points.slice().reverse();
+            }
+        }
+
+        var lineStyle = lineStyleModel.getLineStyle();
+        var areaStyle = areaStyleModel.getAreaStyle();
+        // Add splitArea before splitLine
+        each$1(splitAreas, function (splitAreas, idx) {
+            this.group.add(mergePath(
+                splitAreas, {
+                    style: defaults({
+                        stroke: 'none',
+                        fill: splitAreaColors[idx % splitAreaColors.length]
+                    }, areaStyle),
+                    silent: true
+                }
+            ));
+        }, this);
+
+        each$1(splitLines, function (splitLines, idx) {
+            this.group.add(mergePath(
+                splitLines, {
+                    style: defaults({
+                        fill: 'none',
+                        stroke: splitLineColors[idx % splitLineColors.length]
+                    }, lineStyle),
+                    silent: true
+                }
+            ));
+        }, this);
+
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var RadarSeries = SeriesModel.extend({
+
+    type: 'series.radar',
+
+    dependencies: ['radar'],
+
+
+    // Overwrite
+    init: function (option) {
+        RadarSeries.superApply(this, 'init', arguments);
+
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListSimply(this, {
+            generateCoord: 'indicator_',
+            generateCoordCount: Infinity
+        });
+    },
+
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var coordSys = this.coordinateSystem;
+        var indicatorAxes = coordSys.getIndicatorAxes();
+        var name = this.getData().getName(dataIndex);
+        return encodeHTML(name === '' ? this.name : name) + '<br/>'
+            + map(indicatorAxes, function (axis, idx) {
+                var val = data.get(data.mapDimension(axis.dim), dataIndex);
+                return encodeHTML(axis.name + ' : ' + val);
+            }).join('<br />');
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        coordinateSystem: 'radar',
+        legendHoverLink: true,
+        radarIndex: 0,
+        lineStyle: {
+            width: 2,
+            type: 'solid'
+        },
+        label: {
+            position: 'top'
+        },
+        // areaStyle: {
+        // },
+        // itemStyle: {}
+        symbol: 'emptyCircle',
+        symbolSize: 4
+        // symbolRotate: null
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function normalizeSymbolSize(symbolSize) {
+    if (!isArray(symbolSize)) {
+        symbolSize = [+symbolSize, +symbolSize];
+    }
+    return symbolSize;
+}
+
+extendChartView({
+
+    type: 'radar',
+
+    render: function (seriesModel, ecModel, api) {
+        var polar = seriesModel.coordinateSystem;
+        var group = this.group;
+
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        function createSymbol$$1(data, idx) {
+            var symbolType = data.getItemVisual(idx, 'symbol') || 'circle';
+            var color = data.getItemVisual(idx, 'color');
+            if (symbolType === 'none') {
+                return;
+            }
+            var symbolSize = normalizeSymbolSize(
+                data.getItemVisual(idx, 'symbolSize')
+            );
+            var symbolPath = createSymbol(
+                symbolType, -1, -1, 2, 2, color
+            );
+            symbolPath.attr({
+                style: {
+                    strokeNoScale: true
+                },
+                z2: 100,
+                scale: [symbolSize[0] / 2, symbolSize[1] / 2]
+            });
+            return symbolPath;
+        }
+
+        function updateSymbols(oldPoints, newPoints, symbolGroup, data, idx, isInit) {
+            // Simply rerender all
+            symbolGroup.removeAll();
+            for (var i = 0; i < newPoints.length - 1; i++) {
+                var symbolPath = createSymbol$$1(data, idx);
+                if (symbolPath) {
+                    symbolPath.__dimIdx = i;
+                    if (oldPoints[i]) {
+                        symbolPath.attr('position', oldPoints[i]);
+                        graphic[isInit ? 'initProps' : 'updateProps'](
+                            symbolPath, {
+                                position: newPoints[i]
+                            }, seriesModel, idx
+                        );
+                    }
+                    else {
+                        symbolPath.attr('position', newPoints[i]);
+                    }
+                    symbolGroup.add(symbolPath);
+                }
+            }
+        }
+
+        function getInitialPoints(points) {
+            return map(points, function (pt) {
+                return [polar.cx, polar.cy];
+            });
+        }
+        data.diff(oldData)
+            .add(function (idx) {
+                var points = data.getItemLayout(idx);
+                if (!points) {
+                    return;
+                }
+                var polygon = new Polygon();
+                var polyline = new Polyline();
+                var target = {
+                    shape: {
+                        points: points
+                    }
+                };
+                polygon.shape.points = getInitialPoints(points);
+                polyline.shape.points = getInitialPoints(points);
+                initProps(polygon, target, seriesModel, idx);
+                initProps(polyline, target, seriesModel, idx);
+
+                var itemGroup = new Group();
+                var symbolGroup = new Group();
+                itemGroup.add(polyline);
+                itemGroup.add(polygon);
+                itemGroup.add(symbolGroup);
+
+                updateSymbols(
+                    polyline.shape.points, points, symbolGroup, data, idx, true
+                );
+
+                data.setItemGraphicEl(idx, itemGroup);
+            })
+            .update(function (newIdx, oldIdx) {
+                var itemGroup = oldData.getItemGraphicEl(oldIdx);
+                var polyline = itemGroup.childAt(0);
+                var polygon = itemGroup.childAt(1);
+                var symbolGroup = itemGroup.childAt(2);
+                var target = {
+                    shape: {
+                        points: data.getItemLayout(newIdx)
+                    }
+                };
+                if (!target.shape.points) {
+                    return;
+                }
+                updateSymbols(
+                    polyline.shape.points, target.shape.points, symbolGroup, data, newIdx, false
+                );
+
+                updateProps(polyline, target, seriesModel);
+                updateProps(polygon, target, seriesModel);
+
+                data.setItemGraphicEl(newIdx, itemGroup);
+            })
+            .remove(function (idx) {
+                group.remove(oldData.getItemGraphicEl(idx));
+            })
+            .execute();
+
+        data.eachItemGraphicEl(function (itemGroup, idx) {
+            var itemModel = data.getItemModel(idx);
+            var polyline = itemGroup.childAt(0);
+            var polygon = itemGroup.childAt(1);
+            var symbolGroup = itemGroup.childAt(2);
+            var color = data.getItemVisual(idx, 'color');
+
+            group.add(itemGroup);
+
+            polyline.useStyle(
+                defaults(
+                    itemModel.getModel('lineStyle').getLineStyle(),
+                    {
+                        fill: 'none',
+                        stroke: color
+                    }
+                )
+            );
+            polyline.hoverStyle = itemModel.getModel('emphasis.lineStyle').getLineStyle();
+
+            var areaStyleModel = itemModel.getModel('areaStyle');
+            var hoverAreaStyleModel = itemModel.getModel('emphasis.areaStyle');
+            var polygonIgnore = areaStyleModel.isEmpty() && areaStyleModel.parentModel.isEmpty();
+            var hoverPolygonIgnore = hoverAreaStyleModel.isEmpty() && hoverAreaStyleModel.parentModel.isEmpty();
+
+            hoverPolygonIgnore = hoverPolygonIgnore && polygonIgnore;
+            polygon.ignore = polygonIgnore;
+
+            polygon.useStyle(
+                defaults(
+                    areaStyleModel.getAreaStyle(),
+                    {
+                        fill: color,
+                        opacity: 0.7
+                    }
+                )
+            );
+            polygon.hoverStyle = hoverAreaStyleModel.getAreaStyle();
+
+            var itemStyle = itemModel.getModel('itemStyle').getItemStyle(['color']);
+            var itemHoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+            var labelModel = itemModel.getModel('label');
+            var labelHoverModel = itemModel.getModel('emphasis.label');
+            symbolGroup.eachChild(function (symbolPath) {
+                symbolPath.setStyle(itemStyle);
+                symbolPath.hoverStyle = clone(itemHoverStyle);
+
+                setLabelStyle(
+                    symbolPath.style, symbolPath.hoverStyle, labelModel, labelHoverModel,
+                    {
+                        labelFetcher: data.hostModel,
+                        labelDataIndex: idx,
+                        labelDimIndex: symbolPath.__dimIdx,
+                        defaultText: data.get(data.dimensions[symbolPath.__dimIdx], idx),
+                        autoColor: color,
+                        isRectText: true
+                    }
+                );
+            });
+
+            function onEmphasis() {
+                polygon.attr('ignore', hoverPolygonIgnore);
+            }
+
+            function onNormal() {
+                polygon.attr('ignore', polygonIgnore);
+            }
+
+            itemGroup.off('mouseover').off('mouseout').off('normal').off('emphasis');
+            itemGroup.on('emphasis', onEmphasis)
+                .on('mouseover', onEmphasis)
+                .on('normal', onNormal)
+                .on('mouseout', onNormal);
+
+            setHoverStyle(itemGroup);
+        });
+
+        this._data = data;
+    },
+
+    remove: function () {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var radarLayout = function (ecModel) {
+    ecModel.eachSeriesByType('radar', function (seriesModel) {
+        var data = seriesModel.getData();
+        var points = [];
+        var coordSys = seriesModel.coordinateSystem;
+        if (!coordSys) {
+            return;
+        }
+
+        function pointsConverter(val, idx) {
+            points[idx] = points[idx] || [];
+            points[idx][i] = coordSys.dataToPoint(val, i);
+        }
+        var axes = coordSys.getIndicatorAxes();
+        for (var i = 0; i < axes.length; i++) {
+            data.each(data.mapDimension(axes[i].dim), pointsConverter);
+        }
+
+        data.each(function (idx) {
+            // Close polygon
+            points[idx][0] && points[idx].push(points[idx][0].slice());
+            data.setItemLayout(idx, points[idx]);
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Backward compat for radar chart in 2
+var backwardCompat$1 = function (option) {
+    var polarOptArr = option.polar;
+    if (polarOptArr) {
+        if (!isArray(polarOptArr)) {
+            polarOptArr = [polarOptArr];
+        }
+        var polarNotRadar = [];
+        each$1(polarOptArr, function (polarOpt, idx) {
+            if (polarOpt.indicator) {
+                if (polarOpt.type && !polarOpt.shape) {
+                    polarOpt.shape = polarOpt.type;
+                }
+                option.radar = option.radar || [];
+                if (!isArray(option.radar)) {
+                    option.radar = [option.radar];
+                }
+                option.radar.push(polarOpt);
+            }
+            else {
+                polarNotRadar.push(polarOpt);
+            }
+        });
+        option.polar = polarNotRadar;
+    }
+    each$1(option.series, function (seriesOpt) {
+        if (seriesOpt && seriesOpt.type === 'radar' && seriesOpt.polarIndex) {
+            seriesOpt.radarIndex = seriesOpt.polarIndex;
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+// Must use radar component
+registerVisual(dataColor('radar'));
+registerVisual(visualSymbol('radar', 'circle'));
+registerLayout(radarLayout);
+registerProcessor(dataFilter('radar'));
+registerPreprocessor(backwardCompat$1);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Simple view coordinate system
+ * Mapping given x, y to transformd view x, y
+ */
+
+var v2ApplyTransform$1 = applyTransform;
+
+// Dummy transform node
+function TransformDummy() {
+    Transformable.call(this);
+}
+mixin(TransformDummy, Transformable);
+
+function View(name) {
+    /**
+     * @type {string}
+     */
+    this.name = name;
+
+    /**
+     * @type {Object}
+     */
+    this.zoomLimit;
+
+    Transformable.call(this);
+
+    this._roamTransformable = new TransformDummy();
+
+    this._rawTransformable = new TransformDummy();
+
+    this._center;
+    this._zoom;
+}
+
+View.prototype = {
+
+    constructor: View,
+
+    type: 'view',
+
+    /**
+     * @param {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['x', 'y'],
+
+    /**
+     * Set bounding rect
+     * @param {number} x
+     * @param {number} y
+     * @param {number} width
+     * @param {number} height
+     */
+
+    // PENDING to getRect
+    setBoundingRect: function (x, y, width, height) {
+        this._rect = new BoundingRect(x, y, width, height);
+        return this._rect;
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    // PENDING to getRect
+    getBoundingRect: function () {
+        return this._rect;
+    },
+
+    /**
+     * @param {number} x
+     * @param {number} y
+     * @param {number} width
+     * @param {number} height
+     */
+    setViewRect: function (x, y, width, height) {
+        this.transformTo(x, y, width, height);
+        this._viewRect = new BoundingRect(x, y, width, height);
+    },
+
+    /**
+     * Transformed to particular position and size
+     * @param {number} x
+     * @param {number} y
+     * @param {number} width
+     * @param {number} height
+     */
+    transformTo: function (x, y, width, height) {
+        var rect = this.getBoundingRect();
+        var rawTransform = this._rawTransformable;
+
+        rawTransform.transform = rect.calculateTransform(
+            new BoundingRect(x, y, width, height)
+        );
+
+        rawTransform.decomposeTransform();
+
+        this._updateTransform();
+    },
+
+    /**
+     * Set center of view
+     * @param {Array.<number>} [centerCoord]
+     */
+    setCenter: function (centerCoord) {
+        if (!centerCoord) {
+            return;
+        }
+        this._center = centerCoord;
+
+        this._updateCenterAndZoom();
+    },
+
+    /**
+     * @param {number} zoom
+     */
+    setZoom: function (zoom) {
+        zoom = zoom || 1;
+
+        var zoomLimit = this.zoomLimit;
+        if (zoomLimit) {
+            if (zoomLimit.max != null) {
+                zoom = Math.min(zoomLimit.max, zoom);
+            }
+            if (zoomLimit.min != null) {
+                zoom = Math.max(zoomLimit.min, zoom);
+            }
+        }
+        this._zoom = zoom;
+
+        this._updateCenterAndZoom();
+    },
+
+    /**
+     * Get default center without roam
+     */
+    getDefaultCenter: function () {
+        // Rect before any transform
+        var rawRect = this.getBoundingRect();
+        var cx = rawRect.x + rawRect.width / 2;
+        var cy = rawRect.y + rawRect.height / 2;
+
+        return [cx, cy];
+    },
+
+    getCenter: function () {
+        return this._center || this.getDefaultCenter();
+    },
+
+    getZoom: function () {
+        return this._zoom || 1;
+    },
+
+    /**
+     * @return {Array.<number}
+     */
+    getRoamTransform: function () {
+        return this._roamTransformable.getLocalTransform();
+    },
+
+    /**
+     * Remove roam
+     */
+
+    _updateCenterAndZoom: function () {
+        // Must update after view transform updated
+        var rawTransformMatrix = this._rawTransformable.getLocalTransform();
+        var roamTransform = this._roamTransformable;
+        var defaultCenter = this.getDefaultCenter();
+        var center = this.getCenter();
+        var zoom = this.getZoom();
+
+        center = applyTransform([], center, rawTransformMatrix);
+        defaultCenter = applyTransform([], defaultCenter, rawTransformMatrix);
+
+        roamTransform.origin = center;
+        roamTransform.position = [
+            defaultCenter[0] - center[0],
+            defaultCenter[1] - center[1]
+        ];
+        roamTransform.scale = [zoom, zoom];
+
+        this._updateTransform();
+    },
+
+    /**
+     * Update transform from roam and mapLocation
+     * @private
+     */
+    _updateTransform: function () {
+        var roamTransformable = this._roamTransformable;
+        var rawTransformable = this._rawTransformable;
+
+        rawTransformable.parent = roamTransformable;
+        roamTransformable.updateTransform();
+        rawTransformable.updateTransform();
+
+        copy$1(this.transform || (this.transform = []), rawTransformable.transform || create$1());
+
+        this._rawTransform = rawTransformable.getLocalTransform();
+
+        this.invTransform = this.invTransform || [];
+        invert(this.invTransform, this.transform);
+
+        this.decomposeTransform();
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getViewRect: function () {
+        return this._viewRect;
+    },
+
+    /**
+     * Get view rect after roam transform
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getViewRectAfterRoam: function () {
+        var rect = this.getBoundingRect().clone();
+        rect.applyTransform(this.transform);
+        return rect;
+    },
+
+    /**
+     * Convert a single (lon, lat) data item to (x, y) point.
+     * @param {Array.<number>} data
+     * @param {boolean} noRoam
+     * @param {Array.<number>} [out]
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, noRoam, out) {
+        var transform = noRoam ? this._rawTransform : this.transform;
+        out = out || [];
+        return transform
+            ? v2ApplyTransform$1(out, data, transform)
+            : copy(out, data);
+    },
+
+    /**
+     * Convert a (x, y) point to (lon, lat) data
+     * @param {Array.<number>} point
+     * @return {Array.<number>}
+     */
+    pointToData: function (point) {
+        var invTransform = this.invTransform;
+        return invTransform
+            ? v2ApplyTransform$1([], point, invTransform)
+            : [point[0], point[1]];
+    },
+
+    /**
+     * @implements
+     * see {module:echarts/CoodinateSystem}
+     */
+    convertToPixel: curry(doConvert$1, 'dataToPoint'),
+
+    /**
+     * @implements
+     * see {module:echarts/CoodinateSystem}
+     */
+    convertFromPixel: curry(doConvert$1, 'pointToData'),
+
+    /**
+     * @implements
+     * see {module:echarts/CoodinateSystem}
+     */
+    containPoint: function (point) {
+        return this.getViewRectAfterRoam().contain(point[0], point[1]);
+    }
+
+    /**
+     * @return {number}
+     */
+    // getScalarScale: function () {
+    //     // Use determinant square root of transform to mutiply scalar
+    //     var m = this.transform;
+    //     var det = Math.sqrt(Math.abs(m[0] * m[3] - m[2] * m[1]));
+    //     return det;
+    // }
+};
+
+mixin(View, Transformable);
+
+function doConvert$1(methodName, ecModel, finder, value) {
+    var seriesModel = finder.seriesModel;
+    var coordSys = seriesModel ? seriesModel.coordinateSystem : null; // e.g., graph.
+    return coordSys === this ? coordSys[methodName](value) : null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Fix for 南海诸岛
+
+var geoCoord = [126, 25];
+
+var points$1 = [
+    [[0,3.5],[7,11.2],[15,11.9],[30,7],[42,0.7],[52,0.7],
+        [56,7.7],[59,0.7],[64,0.7],[64,0],[5,0],[0,3.5]],
+    [[13,16.1],[19,14.7],[16,21.7],[11,23.1],[13,16.1]],
+    [[12,32.2],[14,38.5],[15,38.5],[13,32.2],[12,32.2]],
+    [[16,47.6],[12,53.2],[13,53.2],[18,47.6],[16,47.6]],
+    [[6,64.4],[8,70],[9,70],[8,64.4],[6,64.4]],
+    [[23,82.6],[29,79.8],[30,79.8],[25,82.6],[23,82.6]],
+    [[37,70.7],[43,62.3],[44,62.3],[39,70.7],[37,70.7]],
+    [[48,51.1],[51,45.5],[53,45.5],[50,51.1],[48,51.1]],
+    [[51,35],[51,28.7],[53,28.7],[53,35],[51,35]],
+    [[52,22.4],[55,17.5],[56,17.5],[53,22.4],[52,22.4]],
+    [[58,12.6],[62,7],[63,7],[60,12.6],[58,12.6]],
+    [[0,3.5],[0,93.1],[64,93.1],[64,0],[63,0],[63,92.4],
+        [1,92.4],[1,3.5],[0,3.5]]
+];
+
+for (var i$1 = 0; i$1 < points$1.length; i$1++) {
+    for (var k = 0; k < points$1[i$1].length; k++) {
+        points$1[i$1][k][0] /= 10.5;
+        points$1[i$1][k][1] /= -10.5 / 0.75;
+
+        points$1[i$1][k][0] += geoCoord[0];
+        points$1[i$1][k][1] += geoCoord[1];
+    }
+}
+
+var fixNanhai = function (geo) {
+    if (geo.map === 'china') {
+        geo.regions.push(new Region(
+            '南海诸岛',
+            map(points$1, function (exterior) {
+                return {
+                    type: 'polygon',
+                    exterior: exterior
+                };
+            }), geoCoord
+        ));
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var coordsOffsetMap = {
+    '南海诸岛' : [32, 80],
+    // 全国
+    '广东': [0, -10],
+    '香港': [10, 5],
+    '澳门': [-10, 10],
+    //'北京': [-10, 0],
+    '天津': [5, 5]
+};
+
+var fixTextCoord = function (geo) {
+    each$1(geo.regions, function (region) {
+        var coordFix = coordsOffsetMap[region.name];
+        if (coordFix) {
+            var cp = region.center;
+            cp[0] += coordFix[0] / 10.5;
+            cp[1] += -coordFix[1] / (10.5 / 0.75);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var geoCoordMap = {
+    'Russia': [100, 60],
+    'United States': [-99, 38],
+    'United States of America': [-99, 38]
+};
+
+var fixGeoCoord = function (geo) {
+    each$1(geo.regions, function (region) {
+        var geoCoord = geoCoordMap[region.name];
+        if (geoCoord) {
+            var cp = region.center;
+            cp[0] = geoCoord[0];
+            cp[1] = geoCoord[1];
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Fix for 钓鱼岛
+
+// var Region = require('../Region');
+// var zrUtil = require('zrender/src/core/util');
+
+// var geoCoord = [126, 25];
+
+var points$2 = [
+    [
+        [123.45165252685547, 25.73527164402261],
+        [123.49731445312499, 25.73527164402261],
+        [123.49731445312499, 25.750734064600884],
+        [123.45165252685547, 25.750734064600884],
+        [123.45165252685547, 25.73527164402261]
+    ]
+];
+
+var fixDiaoyuIsland = function (geo) {
+    if (geo.map === 'china') {
+        for (var i = 0, len = geo.regions.length; i < len; ++i) {
+            if (geo.regions[i].name === '台湾') {
+                geo.regions[i].geometries.push({
+                    type: 'polygon',
+                    exterior: points$2[0]
+                });
+            }
+        }
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Geo fix functions
+var geoFixFuncs = [
+    fixNanhai,
+    fixTextCoord,
+    fixGeoCoord,
+    fixDiaoyuIsland
+];
+
+/**
+ * [Geo description]
+ * @param {string} name Geo name
+ * @param {string} map Map type
+ * @param {Object} geoJson
+ * @param {Object} [specialAreas]
+ *        Specify the positioned areas by left, top, width, height
+ * @param {Object.<string, string>} [nameMap]
+ *        Specify name alias
+ */
+function Geo(name, map$$1, geoJson, specialAreas, nameMap) {
+
+    View.call(this, name);
+
+    /**
+     * Map type
+     * @type {string}
+     */
+    this.map = map$$1;
+
+    this._nameCoordMap = createHashMap();
+
+    this.loadGeoJson(geoJson, specialAreas, nameMap);
+}
+
+Geo.prototype = {
+
+    constructor: Geo,
+
+    type: 'geo',
+
+    /**
+     * @param {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['lng', 'lat'],
+
+    /**
+     * If contain given lng,lat coord
+     * @param {Array.<number>}
+     * @readOnly
+     */
+    containCoord: function (coord) {
+        var regions = this.regions;
+        for (var i = 0; i < regions.length; i++) {
+            if (regions[i].contain(coord)) {
+                return true;
+            }
+        }
+        return false;
+    },
+    /**
+     * @param {Object} geoJson
+     * @param {Object} [specialAreas]
+     *        Specify the positioned areas by left, top, width, height
+     * @param {Object.<string, string>} [nameMap]
+     *        Specify name alias
+     */
+    loadGeoJson: function (geoJson, specialAreas, nameMap) {
+        // https://jsperf.com/try-catch-performance-overhead
+        try {
+            this.regions = geoJson ? parseGeoJson$1(geoJson) : [];
+        }
+        catch (e) {
+            throw 'Invalid geoJson format\n' + e.message;
+        }
+        specialAreas = specialAreas || {};
+        nameMap = nameMap || {};
+        var regions = this.regions;
+        var regionsMap = createHashMap();
+        for (var i = 0; i < regions.length; i++) {
+            var regionName = regions[i].name;
+            // Try use the alias in nameMap
+            regionName = nameMap.hasOwnProperty(regionName) ? nameMap[regionName] : regionName;
+            regions[i].name = regionName;
+
+            regionsMap.set(regionName, regions[i]);
+            // Add geoJson
+            this.addGeoCoord(regionName, regions[i].center);
+
+            // Some area like Alaska in USA map needs to be tansformed
+            // to look better
+            var specialArea = specialAreas[regionName];
+            if (specialArea) {
+                regions[i].transformTo(
+                    specialArea.left, specialArea.top, specialArea.width, specialArea.height
+                );
+            }
+        }
+
+        this._regionsMap = regionsMap;
+
+        this._rect = null;
+
+        each$1(geoFixFuncs, function (fixFunc) {
+            fixFunc(this);
+        }, this);
+    },
+
+    // Overwrite
+    transformTo: function (x, y, width, height) {
+        var rect = this.getBoundingRect();
+
+        rect = rect.clone();
+        // Longitute is inverted
+        rect.y = -rect.y - rect.height;
+
+        var rawTransformable = this._rawTransformable;
+
+        rawTransformable.transform = rect.calculateTransform(
+            new BoundingRect(x, y, width, height)
+        );
+
+        rawTransformable.decomposeTransform();
+
+        var scale = rawTransformable.scale;
+        scale[1] = -scale[1];
+
+        rawTransformable.updateTransform();
+
+        this._updateTransform();
+    },
+
+    /**
+     * @param {string} name
+     * @return {module:echarts/coord/geo/Region}
+     */
+    getRegion: function (name) {
+        return this._regionsMap.get(name);
+    },
+
+    getRegionByCoord: function (coord) {
+        var regions = this.regions;
+        for (var i = 0; i < regions.length; i++) {
+            if (regions[i].contain(coord)) {
+                return regions[i];
+            }
+        }
+    },
+
+    /**
+     * Add geoCoord for indexing by name
+     * @param {string} name
+     * @param {Array.<number>} geoCoord
+     */
+    addGeoCoord: function (name, geoCoord) {
+        this._nameCoordMap.set(name, geoCoord);
+    },
+
+    /**
+     * Get geoCoord by name
+     * @param {string} name
+     * @return {Array.<number>}
+     */
+    getGeoCoord: function (name) {
+        return this._nameCoordMap.get(name);
+    },
+
+    // Overwrite
+    getBoundingRect: function () {
+        if (this._rect) {
+            return this._rect;
+        }
+        var rect;
+
+        var regions = this.regions;
+        for (var i = 0; i < regions.length; i++) {
+            var regionRect = regions[i].getBoundingRect();
+            rect = rect || regionRect.clone();
+            rect.union(regionRect);
+        }
+        // FIXME Always return new ?
+        return (this._rect = rect || new BoundingRect(0, 0, 0, 0));
+    },
+
+    /**
+     * @param {string|Array.<number>} data
+     * @param {boolean} noRoam
+     * @param {Array.<number>} [out]
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, noRoam, out) {
+        if (typeof data === 'string') {
+            // Map area name to geoCoord
+            data = this.getGeoCoord(data);
+        }
+        if (data) {
+            return View.prototype.dataToPoint.call(this, data, noRoam, out);
+        }
+    },
+
+    /**
+     * @inheritDoc
+     */
+    convertToPixel: curry(doConvert, 'dataToPoint'),
+
+    /**
+     * @inheritDoc
+     */
+    convertFromPixel: curry(doConvert, 'pointToData')
+
+};
+
+mixin(Geo, View);
+
+function doConvert(methodName, ecModel, finder, value) {
+    var geoModel = finder.geoModel;
+    var seriesModel = finder.seriesModel;
+
+    var coordSys = geoModel
+        ? geoModel.coordinateSystem
+        : seriesModel
+        ? (
+            seriesModel.coordinateSystem // For map.
+            || (seriesModel.getReferringComponents('geo')[0] || {}).coordinateSystem
+        )
+        : null;
+
+    return coordSys === this ? coordSys[methodName](value) : null;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Resize method bound to the geo
+ * @param {module:echarts/coord/geo/GeoModel|module:echarts/chart/map/MapModel} geoModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function resizeGeo(geoModel, api) {
+
+    var boundingCoords = geoModel.get('boundingCoords');
+    if (boundingCoords != null) {
+        var leftTop = boundingCoords[0];
+        var rightBottom = boundingCoords[1];
+        if (isNaN(leftTop[0]) || isNaN(leftTop[1]) || isNaN(rightBottom[0]) || isNaN(rightBottom[1])) {
+            if (__DEV__) {
+                console.error('Invalid boundingCoords');
+            }
+        }
+        else {
+            this.setBoundingRect(leftTop[0], leftTop[1], rightBottom[0] - leftTop[0], rightBottom[1] - leftTop[1]);
+        }
+    }
+
+    var rect = this.getBoundingRect();
+
+    var boxLayoutOption;
+
+    var center = geoModel.get('layoutCenter');
+    var size = geoModel.get('layoutSize');
+
+    var viewWidth = api.getWidth();
+    var viewHeight = api.getHeight();
+
+    var aspectScale = geoModel.get('aspectScale') || 0.75;
+    var aspect = rect.width / rect.height * aspectScale;
+
+    var useCenterAndSize = false;
+
+    if (center && size) {
+        center = [
+            parsePercent$1(center[0], viewWidth),
+            parsePercent$1(center[1], viewHeight)
+        ];
+        size = parsePercent$1(size, Math.min(viewWidth, viewHeight));
+
+        if (!isNaN(center[0]) && !isNaN(center[1]) && !isNaN(size)) {
+            useCenterAndSize = true;
+        }
+        else {
+            if (__DEV__) {
+                console.warn('Given layoutCenter or layoutSize data are invalid. Use left/top/width/height instead.');
+            }
+        }
+    }
+
+    var viewRect;
+    if (useCenterAndSize) {
+        var viewRect = {};
+        if (aspect > 1) {
+            // Width is same with size
+            viewRect.width = size;
+            viewRect.height = size / aspect;
+        }
+        else {
+            viewRect.height = size;
+            viewRect.width = size * aspect;
+        }
+        viewRect.y = center[1] - viewRect.height / 2;
+        viewRect.x = center[0] - viewRect.width / 2;
+    }
+    else {
+        // Use left/top/width/height
+        boxLayoutOption = geoModel.getBoxLayoutParams();
+
+        // 0.75 rate
+        boxLayoutOption.aspect = aspect;
+
+        viewRect = getLayoutRect(boxLayoutOption, {
+            width: viewWidth,
+            height: viewHeight
+        });
+    }
+
+    this.setViewRect(viewRect.x, viewRect.y, viewRect.width, viewRect.height);
+
+    this.setCenter(geoModel.get('center'));
+    this.setZoom(geoModel.get('zoom'));
+}
+
+/**
+ * @param {module:echarts/coord/Geo} geo
+ * @param {module:echarts/model/Model} model
+ * @inner
+ */
+function setGeoCoords(geo, model) {
+    each$1(model.get('geoCoord'), function (geoCoord, name) {
+        geo.addGeoCoord(name, geoCoord);
+    });
+}
+
+if (__DEV__) {
+    var mapNotExistsError = function (name) {
+        console.error('Map ' + name + ' not exists. You can download map file on http://echarts.baidu.com/download-map.html');
+    };
+}
+
+var geoCreator = {
+
+    // For deciding which dimensions to use when creating list data
+    dimensions: Geo.prototype.dimensions,
+
+    create: function (ecModel, api) {
+        var geoList = [];
+
+        // FIXME Create each time may be slow
+        ecModel.eachComponent('geo', function (geoModel, idx) {
+            var name = geoModel.get('map');
+            var mapData = getMap(name);
+            if (__DEV__) {
+                if (!mapData) {
+                    mapNotExistsError(name);
+                }
+            }
+            var geo = new Geo(
+                name + idx, name,
+                mapData && mapData.geoJson, mapData && mapData.specialAreas,
+                geoModel.get('nameMap')
+            );
+            geo.zoomLimit = geoModel.get('scaleLimit');
+            geoList.push(geo);
+
+            setGeoCoords(geo, geoModel);
+
+            geoModel.coordinateSystem = geo;
+            geo.model = geoModel;
+
+            // Inject resize method
+            geo.resize = resizeGeo;
+
+            geo.resize(geoModel, api);
+        });
+
+        ecModel.eachSeries(function (seriesModel) {
+            var coordSys = seriesModel.get('coordinateSystem');
+            if (coordSys === 'geo') {
+                var geoIndex = seriesModel.get('geoIndex') || 0;
+                seriesModel.coordinateSystem = geoList[geoIndex];
+            }
+        });
+
+        // If has map series
+        var mapModelGroupBySeries = {};
+
+        ecModel.eachSeriesByType('map', function (seriesModel) {
+            if (!seriesModel.getHostGeoModel()) {
+                var mapType = seriesModel.getMapType();
+                mapModelGroupBySeries[mapType] = mapModelGroupBySeries[mapType] || [];
+                mapModelGroupBySeries[mapType].push(seriesModel);
+            }
+        });
+
+        each$1(mapModelGroupBySeries, function (mapSeries, mapType) {
+            var mapData = getMap(mapType);
+            if (__DEV__) {
+                if (!mapData) {
+                    mapNotExistsError(mapSeries[0].get('map'));
+                }
+            }
+
+            var nameMapList = map(mapSeries, function (singleMapSeries) {
+                return singleMapSeries.get('nameMap');
+            });
+            var geo = new Geo(
+                mapType, mapType,
+                mapData && mapData.geoJson, mapData && mapData.specialAreas,
+                mergeAll(nameMapList)
+            );
+            geo.zoomLimit = retrieve.apply(null, map(mapSeries, function (singleMapSeries) {
+                return singleMapSeries.get('scaleLimit');
+            }));
+            geoList.push(geo);
+
+            // Inject resize method
+            geo.resize = resizeGeo;
+
+            geo.resize(mapSeries[0], api);
+
+            each$1(mapSeries, function (singleMapSeries) {
+                singleMapSeries.coordinateSystem = geo;
+
+                setGeoCoords(geo, singleMapSeries);
+            });
+        });
+
+        return geoList;
+    },
+
+    /**
+     * Fill given regions array
+     * @param  {Array.<Object>} originRegionArr
+     * @param  {string} mapName
+     * @param  {Object} [nameMap]
+     * @return {Array}
+     */
+    getFilledRegions: function (originRegionArr, mapName, nameMap) {
+        // Not use the original
+        var regionsArr = (originRegionArr || []).slice();
+        nameMap = nameMap || {};
+
+        var map$$1 = getMap(mapName);
+        var geoJson = map$$1 && map$$1.geoJson;
+        if (!geoJson) {
+            if (__DEV__) {
+                mapNotExistsError(mapName);
+            }
+            return originRegionArr;
+        }
+
+        var dataNameMap = createHashMap();
+        var features = geoJson.features;
+        for (var i = 0; i < regionsArr.length; i++) {
+            dataNameMap.set(regionsArr[i].name, regionsArr[i]);
+        }
+
+        for (var i = 0; i < features.length; i++) {
+            var name = features[i].properties.name;
+            if (!dataNameMap.get(name)) {
+                if (nameMap.hasOwnProperty(name)) {
+                    name = nameMap[name];
+                }
+                regionsArr.push({
+                    name: name
+                });
+            }
+        }
+        return regionsArr;
+    }
+};
+
+registerCoordinateSystem('geo', geoCreator);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var MapSeries = SeriesModel.extend({
+
+    type: 'series.map',
+
+    dependencies: ['geo'],
+
+    layoutMode: 'box',
+
+    /**
+     * Only first map series of same mapType will drawMap
+     * @type {boolean}
+     */
+    needsDrawMap: false,
+
+    /**
+     * Group of all map series with same mapType
+     * @type {boolean}
+     */
+    seriesGroup: [],
+
+    init: function (option) {
+
+        // this._fillOption(option, this.getMapType());
+        // this.option = option;
+
+        MapSeries.superApply(this, 'init', arguments);
+
+        this.updateSelectedMap(this._createSelectableList());
+    },
+
+    getInitialData: function (option) {
+        return createListSimply(this, ['value']);
+    },
+
+    mergeOption: function (newOption) {
+        // this._fillOption(newOption, this.getMapType());
+
+        MapSeries.superApply(this, 'mergeOption', arguments);
+
+        this.updateSelectedMap(this._createSelectableList());
+    },
+
+    _createSelectableList: function () {
+        var data = this.getRawData();
+        var valueDim = data.mapDimension('value');
+        var targetList = [];
+        for (var i = 0, len = data.count(); i < len; i++) {
+            targetList.push({
+                name: data.getName(i),
+                value: data.get(valueDim, i),
+                selected: retrieveRawAttr(data, i, 'selected')
+            });
+        }
+
+        targetList = geoCreator.getFilledRegions(targetList, this.getMapType(), this.option.nameMap);
+
+        return targetList;
+    },
+
+    /**
+     * If no host geo model, return null, which means using a
+     * inner exclusive geo model.
+     */
+    getHostGeoModel: function () {
+        var geoIndex = this.option.geoIndex;
+        return geoIndex != null
+            ? this.dependentModels.geo[geoIndex]
+            : null;
+    },
+
+    getMapType: function () {
+        return (this.getHostGeoModel() || this).option.map;
+    },
+
+    _fillOption: function (option, mapName) {
+        // Shallow clone
+        // option = zrUtil.extend({}, option);
+
+        // option.data = geoCreator.getFilledRegions(option.data, mapName, option.nameMap);
+
+        // return option;
+    },
+
+    getRawValue: function (dataIndex) {
+        // Use value stored in data instead because it is calculated from multiple series
+        // FIXME Provide all value of multiple series ?
+        var data = this.getData();
+        return data.get(data.mapDimension('value'), dataIndex);
+    },
+
+    /**
+     * Get model of region
+     * @param  {string} name
+     * @return {module:echarts/model/Model}
+     */
+    getRegionModel: function (regionName) {
+        var data = this.getData();
+        return data.getItemModel(data.indexOfName(regionName));
+    },
+
+    /**
+     * Map tooltip formatter
+     *
+     * @param {number} dataIndex
+     */
+    formatTooltip: function (dataIndex) {
+        // FIXME orignalData and data is a bit confusing
+        var data = this.getData();
+        var formattedValue = addCommas(this.getRawValue(dataIndex));
+        var name = data.getName(dataIndex);
+
+        var seriesGroup = this.seriesGroup;
+        var seriesNames = [];
+        for (var i = 0; i < seriesGroup.length; i++) {
+            var otherIndex = seriesGroup[i].originalData.indexOfName(name);
+            var valueDim = data.mapDimension('value');
+            if (!isNaN(seriesGroup[i].originalData.get(valueDim, otherIndex))) {
+                seriesNames.push(
+                    encodeHTML(seriesGroup[i].name)
+                );
+            }
+        }
+
+        return seriesNames.join(', ') + '<br />'
+            + encodeHTML(name + ' : ' + formattedValue);
+    },
+
+    /**
+     * @implement
+     */
+    getTooltipPosition: function (dataIndex) {
+        if (dataIndex != null) {
+            var name = this.getData().getName(dataIndex);
+            var geo = this.coordinateSystem;
+            var region = geo.getRegion(name);
+
+            return region && geo.dataToPoint(region.center);
+        }
+    },
+
+    setZoom: function (zoom) {
+        this.option.zoom = zoom;
+    },
+
+    setCenter: function (center) {
+        this.option.center = center;
+    },
+
+    defaultOption: {
+        // 一级层叠
+        zlevel: 0,
+        // 二级层叠
+        z: 2,
+
+        coordinateSystem: 'geo',
+
+        // map should be explicitly specified since ec3.
+        map: '',
+
+        // If `geoIndex` is not specified, a exclusive geo will be
+        // created. Otherwise use the specified geo component, and
+        // `map` and `mapType` are ignored.
+        // geoIndex: 0,
+
+        // 'center' | 'left' | 'right' | 'x%' | {number}
+        left: 'center',
+        // 'center' | 'top' | 'bottom' | 'x%' | {number}
+        top: 'center',
+        // right
+        // bottom
+        // width:
+        // height
+
+        // Aspect is width / height. Inited to be geoJson bbox aspect
+        // This parameter is used for scale this aspect
+        aspectScale: 0.75,
+
+        ///// Layout with center and size
+        // If you wan't to put map in a fixed size box with right aspect ratio
+        // This two properties may more conveninet
+        // layoutCenter: [50%, 50%]
+        // layoutSize: 100
+
+
+        // 数值合并方式，默认加和，可选为：
+        // 'sum' | 'average' | 'max' | 'min'
+        // mapValueCalculation: 'sum',
+        // 地图数值计算结果小数精度
+        // mapValuePrecision: 0,
+
+
+        // 显示图例颜色标识（系列标识的小圆点），图例开启时有效
+        showLegendSymbol: true,
+        // 选择模式，默认关闭，可选single，multiple
+        // selectedMode: false,
+        dataRangeHoverLink: true,
+        // 是否开启缩放及漫游模式
+        // roam: false,
+
+        // Define left-top, right-bottom coords to control view
+        // For example, [ [180, 90], [-180, -90] ],
+        // higher priority than center and zoom
+        boundingCoords: null,
+
+        // Default on center of map
+        center: null,
+
+        zoom: 1,
+
+        scaleLimit: null,
+
+        label: {
+            show: false,
+            color: '#000'
+        },
+        // scaleLimit: null,
+        itemStyle: {
+            borderWidth: 0.5,
+            borderColor: '#444',
+            areaColor: '#eee'
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                color: 'rgb(100,0,0)'
+            },
+            itemStyle: {
+                areaColor: 'rgba(255,215,0,0.8)'
+            }
+        }
+    }
+
+});
+
+mixin(MapSeries, selectableMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ATTR = '\0_ec_interaction_mutex';
+
+function take(zr, resourceKey, userKey) {
+    var store = getStore(zr);
+    store[resourceKey] = userKey;
+}
+
+function release(zr, resourceKey, userKey) {
+    var store = getStore(zr);
+    var uKey = store[resourceKey];
+
+    if (uKey === userKey) {
+        store[resourceKey] = null;
+    }
+}
+
+function isTaken(zr, resourceKey) {
+    return !!getStore(zr)[resourceKey];
+}
+
+function getStore(zr) {
+    return zr[ATTR] || (zr[ATTR] = {});
+}
+
+/**
+ * payload: {
+ *     type: 'takeGlobalCursor',
+ *     key: 'dataZoomSelect', or 'brush', or ...,
+ *         If no userKey, release global cursor.
+ * }
+ */
+registerAction(
+    {type: 'takeGlobalCursor', event: 'globalCursorTaken', update: 'update'},
+    function () {}
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @alias module:echarts/component/helper/RoamController
+ * @constructor
+ * @mixin {module:zrender/mixin/Eventful}
+ *
+ * @param {module:zrender/zrender~ZRender} zr
+ */
+function RoamController(zr) {
+
+    /**
+     * @type {Function}
+     */
+    this.pointerChecker;
+
+    /**
+     * @type {module:zrender}
+     */
+    this._zr = zr;
+
+    /**
+     * @type {Object}
+     */
+    this._opt = {};
+
+    // Avoid two roamController bind the same handler
+    var bind$$1 = bind;
+    var mousedownHandler = bind$$1(mousedown, this);
+    var mousemoveHandler = bind$$1(mousemove, this);
+    var mouseupHandler = bind$$1(mouseup, this);
+    var mousewheelHandler = bind$$1(mousewheel, this);
+    var pinchHandler = bind$$1(pinch, this);
+
+    Eventful.call(this);
+
+    /**
+     * @param {Function} pointerChecker
+     *                   input: x, y
+     *                   output: boolean
+     */
+    this.setPointerChecker = function (pointerChecker) {
+        this.pointerChecker = pointerChecker;
+    };
+
+    /**
+     * Notice: only enable needed types. For example, if 'zoom'
+     * is not needed, 'zoom' should not be enabled, otherwise
+     * default mousewheel behaviour (scroll page) will be disabled.
+     *
+     * @param  {boolean|string} [controlType=true] Specify the control type,
+     *                          which can be null/undefined or true/false
+     *                          or 'pan/move' or 'zoom'/'scale'
+     * @param {Object} [opt]
+     * @param {Object} [opt.zoomOnMouseWheel=true]
+     * @param {Object} [opt.moveOnMouseMove=true]
+     * @param {Object} [opt.preventDefaultMouseMove=true] When pan.
+     */
+    this.enable = function (controlType, opt) {
+
+        // Disable previous first
+        this.disable();
+
+        this._opt = defaults(clone(opt) || {}, {
+            zoomOnMouseWheel: true,
+            moveOnMouseMove: true,
+            preventDefaultMouseMove: true
+        });
+
+        if (controlType == null) {
+            controlType = true;
+        }
+
+        if (controlType === true || (controlType === 'move' || controlType === 'pan')) {
+            zr.on('mousedown', mousedownHandler);
+            zr.on('mousemove', mousemoveHandler);
+            zr.on('mouseup', mouseupHandler);
+        }
+        if (controlType === true || (controlType === 'scale' || controlType === 'zoom')) {
+            zr.on('mousewheel', mousewheelHandler);
+            zr.on('pinch', pinchHandler);
+        }
+    };
+
+    this.disable = function () {
+        zr.off('mousedown', mousedownHandler);
+        zr.off('mousemove', mousemoveHandler);
+        zr.off('mouseup', mouseupHandler);
+        zr.off('mousewheel', mousewheelHandler);
+        zr.off('pinch', pinchHandler);
+    };
+
+    this.dispose = this.disable;
+
+    this.isDragging = function () {
+        return this._dragging;
+    };
+
+    this.isPinching = function () {
+        return this._pinching;
+    };
+}
+
+mixin(RoamController, Eventful);
+
+
+function mousedown(e) {
+    if (notLeftMouse(e)
+        || (e.target && e.target.draggable)
+    ) {
+        return;
+    }
+
+    var x = e.offsetX;
+    var y = e.offsetY;
+
+    // Only check on mosedown, but not mousemove.
+    // Mouse can be out of target when mouse moving.
+    if (this.pointerChecker && this.pointerChecker(e, x, y)) {
+        this._x = x;
+        this._y = y;
+        this._dragging = true;
+    }
+}
+
+function mousemove(e) {
+    if (notLeftMouse(e)
+        || !checkKeyBinding(this, 'moveOnMouseMove', e)
+        || !this._dragging
+        || e.gestureEvent === 'pinch'
+        || isTaken(this._zr, 'globalPan')
+    ) {
+        return;
+    }
+
+    var x = e.offsetX;
+    var y = e.offsetY;
+
+    var oldX = this._x;
+    var oldY = this._y;
+
+    var dx = x - oldX;
+    var dy = y - oldY;
+
+    this._x = x;
+    this._y = y;
+
+    this._opt.preventDefaultMouseMove && stop(e.event);
+
+    this.trigger('pan', dx, dy, oldX, oldY, x, y);
+}
+
+function mouseup(e) {
+    if (!notLeftMouse(e)) {
+        this._dragging = false;
+    }
+}
+
+function mousewheel(e) {
+    // wheelDelta maybe -0 in chrome mac.
+    if (!checkKeyBinding(this, 'zoomOnMouseWheel', e) || e.wheelDelta === 0) {
+        return;
+    }
+
+    // Convenience:
+    // Mac and VM Windows on Mac: scroll up: zoom out.
+    // Windows: scroll up: zoom in.
+    var zoomDelta = e.wheelDelta > 0 ? 1.1 : 1 / 1.1;
+    zoom.call(this, e, zoomDelta, e.offsetX, e.offsetY);
+}
+
+function pinch(e) {
+    if (isTaken(this._zr, 'globalPan')) {
+        return;
+    }
+    var zoomDelta = e.pinchScale > 1 ? 1.1 : 1 / 1.1;
+    zoom.call(this, e, zoomDelta, e.pinchX, e.pinchY);
+}
+
+function zoom(e, zoomDelta, zoomX, zoomY) {
+    if (this.pointerChecker && this.pointerChecker(e, zoomX, zoomY)) {
+        // When mouse is out of roamController rect,
+        // default befavoius should not be be disabled, otherwise
+        // page sliding is disabled, contrary to expectation.
+        stop(e.event);
+
+        this.trigger('zoom', zoomDelta, zoomX, zoomY);
+    }
+}
+
+function checkKeyBinding(roamController, prop, e) {
+    var setting = roamController._opt[prop];
+    return setting
+        && (!isString(setting) || e.event[setting + 'Key']);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+/**
+ * For geo and graph.
+ *
+ * @param {Object} controllerHost
+ * @param {module:zrender/Element} controllerHost.target
+ */
+function updateViewOnPan(controllerHost, dx, dy) {
+    var target = controllerHost.target;
+    var pos = target.position;
+    pos[0] += dx;
+    pos[1] += dy;
+    target.dirty();
+}
+
+/**
+ * For geo and graph.
+ *
+ * @param {Object} controllerHost
+ * @param {module:zrender/Element} controllerHost.target
+ * @param {number} controllerHost.zoom
+ * @param {number} controllerHost.zoomLimit like: {min: 1, max: 2}
+ */
+function updateViewOnZoom(controllerHost, zoomDelta, zoomX, zoomY) {
+    var target = controllerHost.target;
+    var zoomLimit = controllerHost.zoomLimit;
+    var pos = target.position;
+    var scale = target.scale;
+
+    var newZoom = controllerHost.zoom = controllerHost.zoom || 1;
+    newZoom *= zoomDelta;
+    if (zoomLimit) {
+        var zoomMin = zoomLimit.min || 0;
+        var zoomMax = zoomLimit.max || Infinity;
+        newZoom = Math.max(
+            Math.min(zoomMax, newZoom),
+            zoomMin
+        );
+    }
+    var zoomScale = newZoom / controllerHost.zoom;
+    controllerHost.zoom = newZoom;
+    // Keep the mouse center when scaling
+    pos[0] -= (zoomX - pos[0]) * (zoomScale - 1);
+    pos[1] -= (zoomY - pos[1]) * (zoomScale - 1);
+    scale[0] *= zoomScale;
+    scale[1] *= zoomScale;
+
+    target.dirty();
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var IRRELEVANT_EXCLUDES = {'axisPointer': 1, 'tooltip': 1, 'brush': 1};
+
+/**
+ * Avoid that: mouse click on a elements that is over geo or graph,
+ * but roam is triggered.
+ */
+function onIrrelevantElement(e, api, targetCoordSysModel) {
+    var model = api.getComponentByElement(e.topTarget);
+    // If model is axisModel, it works only if it is injected with coordinateSystem.
+    var coordSys = model && model.coordinateSystem;
+    return model
+        && model !== targetCoordSysModel
+        && !IRRELEVANT_EXCLUDES[model.mainType]
+        && (coordSys && coordSys.model !== targetCoordSysModel);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getFixedItemStyle(model, scale) {
+    var itemStyle = model.getItemStyle();
+    var areaColor = model.get('areaColor');
+
+    // If user want the color not to be changed when hover,
+    // they should both set areaColor and color to be null.
+    if (areaColor != null) {
+        itemStyle.fill = areaColor;
+    }
+
+    return itemStyle;
+}
+
+function updateMapSelectHandler(mapDraw, mapOrGeoModel, group, api, fromView) {
+    group.off('click');
+    group.off('mousedown');
+
+    if (mapOrGeoModel.get('selectedMode')) {
+
+        group.on('mousedown', function () {
+            mapDraw._mouseDownFlag = true;
+        });
+
+        group.on('click', function (e) {
+            if (!mapDraw._mouseDownFlag) {
+                return;
+            }
+            mapDraw._mouseDownFlag = false;
+
+            var el = e.target;
+            while (!el.__regions) {
+                el = el.parent;
+            }
+            if (!el) {
+                return;
+            }
+
+            var action = {
+                type: (mapOrGeoModel.mainType === 'geo' ? 'geo' : 'map') + 'ToggleSelect',
+                batch: map(el.__regions, function (region) {
+                    return {
+                        name: region.name,
+                        from: fromView.uid
+                    };
+                })
+            };
+            action[mapOrGeoModel.mainType + 'Id'] = mapOrGeoModel.id;
+
+            api.dispatchAction(action);
+
+            updateMapSelected(mapOrGeoModel, group);
+        });
+    }
+}
+
+function updateMapSelected(mapOrGeoModel, group) {
+    // FIXME
+    group.eachChild(function (otherRegionEl) {
+        each$1(otherRegionEl.__regions, function (region) {
+            otherRegionEl.trigger(mapOrGeoModel.isSelected(region.name) ? 'emphasis' : 'normal');
+        });
+    });
+}
+
+/**
+ * @alias module:echarts/component/helper/MapDraw
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {boolean} updateGroup
+ */
+function MapDraw(api, updateGroup) {
+
+    var group = new Group();
+
+    /**
+     * @type {module:echarts/component/helper/RoamController}
+     * @private
+     */
+    this._controller = new RoamController(api.getZr());
+
+    /**
+     * @type {Object} {target, zoom, zoomLimit}
+     * @private
+     */
+    this._controllerHost = {target: updateGroup ? group : null};
+
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = group;
+
+    /**
+     * @type {boolean}
+     * @private
+     */
+    this._updateGroup = updateGroup;
+
+    /**
+     * This flag is used to make sure that only one among
+     * `pan`, `zoom`, `click` can occurs, otherwise 'selected'
+     * action may be triggered when `pan`, which is unexpected.
+     * @type {booelan}
+     */
+    this._mouseDownFlag;
+}
+
+MapDraw.prototype = {
+
+    constructor: MapDraw,
+
+    draw: function (mapOrGeoModel, ecModel, api, fromView, payload) {
+
+        var isGeo = mapOrGeoModel.mainType === 'geo';
+
+        // Map series has data. GEO model that controlled by map series
+        // will be assigned with map data. Other GEO model has no data.
+        var data = mapOrGeoModel.getData && mapOrGeoModel.getData();
+        isGeo && ecModel.eachComponent({mainType: 'series', subType: 'map'}, function (mapSeries) {
+            if (!data && mapSeries.getHostGeoModel() === mapOrGeoModel) {
+                data = mapSeries.getData();
+            }
+        });
+
+        var geo = mapOrGeoModel.coordinateSystem;
+
+        var group = this.group;
+
+        var scale = geo.scale;
+        var groupNewProp = {
+            position: geo.position,
+            scale: scale
+        };
+
+        // No animation when first draw or in action
+        if (!group.childAt(0) || payload) {
+            group.attr(groupNewProp);
+        }
+        else {
+            updateProps(group, groupNewProp, mapOrGeoModel);
+        }
+
+        group.removeAll();
+
+        var itemStyleAccessPath = ['itemStyle'];
+        var hoverItemStyleAccessPath = ['emphasis', 'itemStyle'];
+        var labelAccessPath = ['label'];
+        var hoverLabelAccessPath = ['emphasis', 'label'];
+        var nameMap = createHashMap();
+
+        each$1(geo.regions, function (region) {
+
+            // Consider in GeoJson properties.name may be duplicated, for example,
+            // there is multiple region named "United Kindom" or "France" (so many
+            // colonies). And it is not appropriate to merge them in geo, which
+            // will make them share the same label and bring trouble in label
+            // location calculation.
+            var regionGroup = nameMap.get(region.name)
+                || nameMap.set(region.name, new Group());
+
+            var compoundPath = new CompoundPath({
+                shape: {
+                    paths: []
+                }
+            });
+            regionGroup.add(compoundPath);
+
+            var regionModel = mapOrGeoModel.getRegionModel(region.name) || mapOrGeoModel;
+
+            var itemStyleModel = regionModel.getModel(itemStyleAccessPath);
+            var hoverItemStyleModel = regionModel.getModel(hoverItemStyleAccessPath);
+            var itemStyle = getFixedItemStyle(itemStyleModel, scale);
+            var hoverItemStyle = getFixedItemStyle(hoverItemStyleModel, scale);
+
+            var labelModel = regionModel.getModel(labelAccessPath);
+            var hoverLabelModel = regionModel.getModel(hoverLabelAccessPath);
+
+            var dataIdx;
+            // Use the itemStyle in data if has data
+            if (data) {
+                dataIdx = data.indexOfName(region.name);
+                // Only visual color of each item will be used. It can be encoded by dataRange
+                // But visual color of series is used in symbol drawing
+                //
+                // Visual color for each series is for the symbol draw
+                var visualColor = data.getItemVisual(dataIdx, 'color', true);
+                if (visualColor) {
+                    itemStyle.fill = visualColor;
+                }
+            }
+
+            each$1(region.geometries, function (geometry) {
+                if (geometry.type !== 'polygon') {
+                    return;
+                }
+                compoundPath.shape.paths.push(new Polygon({
+                    shape: {
+                        points: geometry.exterior
+                    }
+                }));
+
+                for (var i = 0; i < (geometry.interiors ? geometry.interiors.length : 0); i++) {
+                    compoundPath.shape.paths.push(new Polygon({
+                        shape: {
+                            points: geometry.interiors[i]
+                        }
+                    }));
+                }
+            });
+
+            compoundPath.setStyle(itemStyle);
+            compoundPath.style.strokeNoScale = true;
+            compoundPath.culling = true;
+            // Label
+            var showLabel = labelModel.get('show');
+            var hoverShowLabel = hoverLabelModel.get('show');
+
+            var isDataNaN = data && isNaN(data.get(data.mapDimension('value'), dataIdx));
+            var itemLayout = data && data.getItemLayout(dataIdx);
+            // In the following cases label will be drawn
+            // 1. In map series and data value is NaN
+            // 2. In geo component
+            // 4. Region has no series legendSymbol, which will be add a showLabel flag in mapSymbolLayout
+            if (
+                (isGeo || isDataNaN && (showLabel || hoverShowLabel))
+                || (itemLayout && itemLayout.showLabel)
+                ) {
+                var query = !isGeo ? dataIdx : region.name;
+                var labelFetcher;
+
+                // Consider dataIdx not found.
+                if (!data || dataIdx >= 0) {
+                    labelFetcher = mapOrGeoModel;
+                }
+
+                var textEl = new Text({
+                    position: region.center.slice(),
+                    scale: [1 / scale[0], 1 / scale[1]],
+                    z2: 10,
+                    silent: true
+                });
+
+                setLabelStyle(
+                    textEl.style, textEl.hoverStyle = {}, labelModel, hoverLabelModel,
+                    {
+                        labelFetcher: labelFetcher,
+                        labelDataIndex: query,
+                        defaultText: region.name,
+                        useInsideStyle: false
+                    },
+                    {
+                        textAlign: 'center',
+                        textVerticalAlign: 'middle'
+                    }
+                );
+
+                regionGroup.add(textEl);
+            }
+
+            // setItemGraphicEl, setHoverStyle after all polygons and labels
+            // are added to the rigionGroup
+            if (data) {
+                data.setItemGraphicEl(dataIdx, regionGroup);
+            }
+            else {
+                var regionModel = mapOrGeoModel.getRegionModel(region.name);
+                // Package custom mouse event for geo component
+                compoundPath.eventData = {
+                    componentType: 'geo',
+                    geoIndex: mapOrGeoModel.componentIndex,
+                    name: region.name,
+                    region: (regionModel && regionModel.option) || {}
+                };
+            }
+
+            var groupRegions = regionGroup.__regions || (regionGroup.__regions = []);
+            groupRegions.push(region);
+
+            setHoverStyle(
+                regionGroup,
+                hoverItemStyle,
+                {hoverSilentOnTouch: !!mapOrGeoModel.get('selectedMode')}
+            );
+
+            group.add(regionGroup);
+        });
+
+        this._updateController(mapOrGeoModel, ecModel, api);
+
+        updateMapSelectHandler(this, mapOrGeoModel, group, api, fromView);
+
+        updateMapSelected(mapOrGeoModel, group);
+    },
+
+    remove: function () {
+        this.group.removeAll();
+        this._controller.dispose();
+        this._controllerHost = {};
+    },
+
+    _updateController: function (mapOrGeoModel, ecModel, api) {
+        var geo = mapOrGeoModel.coordinateSystem;
+        var controller = this._controller;
+        var controllerHost = this._controllerHost;
+
+        controllerHost.zoomLimit = mapOrGeoModel.get('scaleLimit');
+        controllerHost.zoom = geo.getZoom();
+
+        // roamType is will be set default true if it is null
+        controller.enable(mapOrGeoModel.get('roam') || false);
+        var mainType = mapOrGeoModel.mainType;
+
+        function makeActionBase() {
+            var action = {
+                type: 'geoRoam',
+                componentType: mainType
+            };
+            action[mainType + 'Id'] = mapOrGeoModel.id;
+            return action;
+        }
+
+        controller.off('pan').on('pan', function (dx, dy) {
+            this._mouseDownFlag = false;
+
+            updateViewOnPan(controllerHost, dx, dy);
+
+            api.dispatchAction(extend(makeActionBase(), {
+                dx: dx,
+                dy: dy
+            }));
+        }, this);
+
+        controller.off('zoom').on('zoom', function (zoom, mouseX, mouseY) {
+            this._mouseDownFlag = false;
+
+            updateViewOnZoom(controllerHost, zoom, mouseX, mouseY);
+
+            api.dispatchAction(extend(makeActionBase(), {
+                zoom: zoom,
+                originX: mouseX,
+                originY: mouseY
+            }));
+
+            if (this._updateGroup) {
+                var group = this.group;
+                var scale = group.scale;
+                group.traverse(function (el) {
+                    if (el.type === 'text') {
+                        el.attr('scale', [1 / scale[0], 1 / scale[1]]);
+                    }
+                });
+            }
+        }, this);
+
+        controller.setPointerChecker(function (e, x, y) {
+            return geo.getViewRectAfterRoam().contain(x, y)
+                && !onIrrelevantElement(e, api, mapOrGeoModel);
+        });
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'map',
+
+    render: function (mapModel, ecModel, api, payload) {
+        // Not render if it is an toggleSelect action from self
+        if (payload && payload.type === 'mapToggleSelect'
+            && payload.from === this.uid
+        ) {
+            return;
+        }
+
+        var group = this.group;
+        group.removeAll();
+
+        if (mapModel.getHostGeoModel()) {
+            return;
+        }
+
+        // Not update map if it is an roam action from self
+        if (!(payload && payload.type === 'geoRoam'
+                && payload.componentType === 'series'
+                && payload.seriesId === mapModel.id
+            )
+        ) {
+            if (mapModel.needsDrawMap) {
+                var mapDraw = this._mapDraw || new MapDraw(api, true);
+                group.add(mapDraw.group);
+
+                mapDraw.draw(mapModel, ecModel, api, this, payload);
+
+                this._mapDraw = mapDraw;
+            }
+            else {
+                // Remove drawed map
+                this._mapDraw && this._mapDraw.remove();
+                this._mapDraw = null;
+            }
+        }
+        else {
+            var mapDraw = this._mapDraw;
+            mapDraw && group.add(mapDraw.group);
+        }
+
+        mapModel.get('showLegendSymbol') && ecModel.getComponent('legend')
+            && this._renderSymbols(mapModel, ecModel, api);
+    },
+
+    remove: function () {
+        this._mapDraw && this._mapDraw.remove();
+        this._mapDraw = null;
+        this.group.removeAll();
+    },
+
+    dispose: function () {
+        this._mapDraw && this._mapDraw.remove();
+        this._mapDraw = null;
+    },
+
+    _renderSymbols: function (mapModel, ecModel, api) {
+        var originalData = mapModel.originalData;
+        var group = this.group;
+
+        originalData.each(originalData.mapDimension('value'), function (value, idx) {
+            if (isNaN(value)) {
+                return;
+            }
+
+            var layout = originalData.getItemLayout(idx);
+
+            if (!layout || !layout.point) {
+                // Not exists in map
+                return;
+            }
+
+            var point = layout.point;
+            var offset = layout.offset;
+
+            var circle = new Circle({
+                style: {
+                    // Because the special of map draw.
+                    // Which needs statistic of multiple series and draw on one map.
+                    // And each series also need a symbol with legend color
+                    //
+                    // Layout and visual are put one the different data
+                    fill: mapModel.getData().getVisual('color')
+                },
+                shape: {
+                    cx: point[0] + offset * 9,
+                    cy: point[1],
+                    r: 3
+                },
+                silent: true,
+                // Do not overlap the first series, on which labels are displayed.
+                z2: !offset ? 10 : 8
+            });
+
+            // First data on the same region
+            if (!offset) {
+                var fullData = mapModel.mainSeries.getData();
+                var name = originalData.getName(idx);
+
+                var fullIndex = fullData.indexOfName(name);
+
+                var itemModel = originalData.getItemModel(idx);
+                var labelModel = itemModel.getModel('label');
+                var hoverLabelModel = itemModel.getModel('emphasis.label');
+
+                var polygonGroups = fullData.getItemGraphicEl(fullIndex);
+
+                var normalText = retrieve2(
+                    mapModel.getFormattedLabel(idx, 'normal'),
+                    name
+                );
+                var emphasisText = retrieve2(
+                    mapModel.getFormattedLabel(idx, 'emphasis'),
+                    normalText
+                );
+
+                var onEmphasis = function () {
+                    var hoverStyle = setTextStyle({}, hoverLabelModel, {
+                        text: hoverLabelModel.get('show') ? emphasisText : null
+                    }, {isRectText: true, useInsideStyle: false}, true);
+                    circle.style.extendFrom(hoverStyle);
+                    // Make label upper than others if overlaps.
+                    circle.__mapOriginalZ2 = circle.z2;
+                    circle.z2 += 1;
+                };
+
+                var onNormal = function () {
+                    setTextStyle(circle.style, labelModel, {
+                        text: labelModel.get('show') ? normalText : null,
+                        textPosition: labelModel.getShallow('position') || 'bottom'
+                    }, {isRectText: true, useInsideStyle: false});
+
+                    if (circle.__mapOriginalZ2 != null) {
+                        circle.z2 = circle.__mapOriginalZ2;
+                        circle.__mapOriginalZ2 = null;
+                    }
+                };
+
+                polygonGroups.on('mouseover', onEmphasis)
+                    .on('mouseout', onNormal)
+                    .on('emphasis', onEmphasis)
+                    .on('normal', onNormal);
+
+                onNormal();
+            }
+
+            group.add(circle);
+        });
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/coord/View} view
+ * @param {Object} payload
+ * @param {Object} [zoomLimit]
+ */
+function updateCenterAndZoom(
+    view, payload, zoomLimit
+) {
+    var previousZoom = view.getZoom();
+    var center = view.getCenter();
+    var zoom = payload.zoom;
+
+    var point = view.dataToPoint(center);
+
+    if (payload.dx != null && payload.dy != null) {
+        point[0] -= payload.dx;
+        point[1] -= payload.dy;
+
+        var center = view.pointToData(point);
+        view.setCenter(center);
+    }
+    if (zoom != null) {
+        if (zoomLimit) {
+            var zoomMin = zoomLimit.min || 0;
+            var zoomMax = zoomLimit.max || Infinity;
+            zoom = Math.max(
+                Math.min(previousZoom * zoom, zoomMax),
+                zoomMin
+            ) / previousZoom;
+        }
+
+        // Zoom on given point(originX, originY)
+        view.scale[0] *= zoom;
+        view.scale[1] *= zoom;
+        var position = view.position;
+        var fixX = (payload.originX - position[0]) * (zoom - 1);
+        var fixY = (payload.originY - position[1]) * (zoom - 1);
+
+        position[0] -= fixX;
+        position[1] -= fixY;
+
+        view.updateTransform();
+        // Get the new center
+        var center = view.pointToData(point);
+        view.setCenter(center);
+        view.setZoom(zoom * previousZoom);
+    }
+
+    return {
+        center: view.getCenter(),
+        zoom: view.getZoom()
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @payload
+ * @property {string} [componentType=series]
+ * @property {number} [dx]
+ * @property {number} [dy]
+ * @property {number} [zoom]
+ * @property {number} [originX]
+ * @property {number} [originY]
+ */
+registerAction({
+    type: 'geoRoam',
+    event: 'geoRoam',
+    update: 'updateTransform'
+}, function (payload, ecModel) {
+    var componentType = payload.componentType || 'series';
+
+    ecModel.eachComponent(
+        { mainType: componentType, query: payload },
+        function (componentModel) {
+            var geo = componentModel.coordinateSystem;
+            if (geo.type !== 'geo') {
+                return;
+            }
+
+            var res = updateCenterAndZoom(
+                geo, payload, componentModel.get('scaleLimit')
+            );
+
+            componentModel.setCenter
+                && componentModel.setCenter(res.center);
+
+            componentModel.setZoom
+                && componentModel.setZoom(res.zoom);
+
+            // All map series with same `map` use the same geo coordinate system
+            // So the center and zoom must be in sync. Include the series not selected by legend
+            if (componentType === 'series') {
+                each$1(componentModel.seriesGroup, function (seriesModel) {
+                    seriesModel.setCenter(res.center);
+                    seriesModel.setZoom(res.zoom);
+                });
+            }
+        }
+    );
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var mapSymbolLayout = function (ecModel) {
+
+    var processedMapType = {};
+
+    ecModel.eachSeriesByType('map', function (mapSeries) {
+        var mapType = mapSeries.getMapType();
+        if (mapSeries.getHostGeoModel() || processedMapType[mapType]) {
+            return;
+        }
+
+        var mapSymbolOffsets = {};
+
+        each$1(mapSeries.seriesGroup, function (subMapSeries) {
+            var geo = subMapSeries.coordinateSystem;
+            var data = subMapSeries.originalData;
+            if (subMapSeries.get('showLegendSymbol') && ecModel.getComponent('legend')) {
+                data.each(data.mapDimension('value'), function (value, idx) {
+                    var name = data.getName(idx);
+                    var region = geo.getRegion(name);
+
+                    // If input series.data is [11, 22, '-'/null/undefined, 44],
+                    // it will be filled with NaN: [11, 22, NaN, 44] and NaN will
+                    // not be drawn. So here must validate if value is NaN.
+                    if (!region || isNaN(value)) {
+                        return;
+                    }
+
+                    var offset = mapSymbolOffsets[name] || 0;
+
+                    var point = geo.dataToPoint(region.center);
+
+                    mapSymbolOffsets[name] = offset + 1;
+
+                    data.setItemLayout(idx, {
+                        point: point,
+                        offset: offset
+                    });
+                });
+            }
+        });
+
+        // Show label of those region not has legendSymbol(which is offset 0)
+        var data = mapSeries.getData();
+        data.each(function (idx) {
+            var name = data.getName(idx);
+            var layout = data.getItemLayout(idx) || {};
+            layout.showLabel = !mapSymbolOffsets[name];
+            data.setItemLayout(idx, layout);
+        });
+
+        processedMapType[mapType] = true;
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var mapVisual = function (ecModel) {
+    ecModel.eachSeriesByType('map', function (seriesModel) {
+        var colorList = seriesModel.get('color');
+        var itemStyleModel = seriesModel.getModel('itemStyle');
+
+        var areaColor = itemStyleModel.get('areaColor');
+        var color = itemStyleModel.get('color')
+            || colorList[seriesModel.seriesIndex % colorList.length];
+
+        seriesModel.getData().setVisual({
+            'areaColor': areaColor,
+            'color': color
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME 公用？
+/**
+ * @param {Array.<module:echarts/data/List>} datas
+ * @param {string} statisticType 'average' 'sum'
+ * @inner
+ */
+function dataStatistics(datas, statisticType) {
+    var dataNameMap = {};
+
+    each$1(datas, function (data) {
+        data.each(data.mapDimension('value'), function (value, idx) {
+            // Add prefix to avoid conflict with Object.prototype.
+            var mapKey = 'ec-' + data.getName(idx);
+            dataNameMap[mapKey] = dataNameMap[mapKey] || [];
+            if (!isNaN(value)) {
+                dataNameMap[mapKey].push(value);
+            }
+        });
+    });
+
+    return datas[0].map(datas[0].mapDimension('value'), function (value, idx) {
+        var mapKey = 'ec-' + datas[0].getName(idx);
+        var sum = 0;
+        var min = Infinity;
+        var max = -Infinity;
+        var len = dataNameMap[mapKey].length;
+        for (var i = 0; i < len; i++) {
+            min = Math.min(min, dataNameMap[mapKey][i]);
+            max = Math.max(max, dataNameMap[mapKey][i]);
+            sum += dataNameMap[mapKey][i];
+        }
+        var result;
+        if (statisticType === 'min') {
+            result = min;
+        }
+        else if (statisticType === 'max') {
+            result = max;
+        }
+        else if (statisticType === 'average') {
+            result = sum / len;
+        }
+        else {
+            result = sum;
+        }
+        return len === 0 ? NaN : result;
+    });
+}
+
+var mapDataStatistic = function (ecModel) {
+    var seriesGroups = {};
+    ecModel.eachSeriesByType('map', function (seriesModel) {
+        var hostGeoModel = seriesModel.getHostGeoModel();
+        var key = hostGeoModel ? 'o' + hostGeoModel.id : 'i' + seriesModel.getMapType();
+        (seriesGroups[key] = seriesGroups[key] || []).push(seriesModel);
+    });
+
+    each$1(seriesGroups, function (seriesList, key) {
+        var data = dataStatistics(
+            map(seriesList, function (seriesModel) {
+                return seriesModel.getData();
+            }),
+            seriesList[0].get('mapValueCalculation')
+        );
+
+        for (var i = 0; i < seriesList.length; i++) {
+            seriesList[i].originalData = seriesList[i].getData();
+        }
+
+        // FIXME Put where?
+        for (var i = 0; i < seriesList.length; i++) {
+            seriesList[i].seriesGroup = seriesList;
+            seriesList[i].needsDrawMap = i === 0 && !seriesList[i].getHostGeoModel();
+
+            seriesList[i].setData(data.cloneShallow());
+            seriesList[i].mainSeries = seriesList[0];
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var backwardCompat$2 = function (option) {
+    // Save geoCoord
+    var mapSeries = [];
+    each$1(option.series, function (seriesOpt) {
+        if (seriesOpt && seriesOpt.type === 'map') {
+            mapSeries.push(seriesOpt);
+            seriesOpt.map = seriesOpt.map || seriesOpt.mapType;
+            // Put x, y, width, height, x2, y2 in the top level
+            defaults(seriesOpt, seriesOpt.mapLocation);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(mapSymbolLayout);
+registerVisual(mapVisual);
+registerProcessor(PRIORITY.PROCESSOR.STATISTIC, mapDataStatistic);
+registerPreprocessor(backwardCompat$2);
+
+createDataSelectAction('map', [{
+    type: 'mapToggleSelect',
+    event: 'mapselectchanged',
+    method: 'toggleSelected'
+}, {
+    type: 'mapSelect',
+    event: 'mapselected',
+    method: 'select'
+}, {
+    type: 'mapUnSelect',
+    event: 'mapunselected',
+    method: 'unSelect'
+}]);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Link lists and struct (graph or tree)
+ */
+
+var each$7 = each$1;
+
+var DATAS = '\0__link_datas';
+var MAIN_DATA = '\0__link_mainData';
+
+// Caution:
+// In most case, either list or its shallow clones (see list.cloneShallow)
+// is active in echarts process. So considering heap memory consumption,
+// we do not clone tree or graph, but share them among list and its shallow clones.
+// But in some rare case, we have to keep old list (like do animation in chart). So
+// please take care that both the old list and the new list share the same tree/graph.
+
+/**
+ * @param {Object} opt
+ * @param {module:echarts/data/List} opt.mainData
+ * @param {Object} [opt.struct] For example, instance of Graph or Tree.
+ * @param {string} [opt.structAttr] designation: list[structAttr] = struct;
+ * @param {Object} [opt.datas] {dataType: data},
+ *                 like: {node: nodeList, edge: edgeList}.
+ *                 Should contain mainData.
+ * @param {Object} [opt.datasAttr] {dataType: attr},
+ *                 designation: struct[datasAttr[dataType]] = list;
+ */
+function linkList(opt) {
+    var mainData = opt.mainData;
+    var datas = opt.datas;
+
+    if (!datas) {
+        datas = {main: mainData};
+        opt.datasAttr = {main: 'data'};
+    }
+    opt.datas = opt.mainData = null;
+
+    linkAll(mainData, datas, opt);
+
+    // Porxy data original methods.
+    each$7(datas, function (data) {
+        each$7(mainData.TRANSFERABLE_METHODS, function (methodName) {
+            data.wrapMethod(methodName, curry(transferInjection, opt));
+        });
+
+    });
+
+    // Beyond transfer, additional features should be added to `cloneShallow`.
+    mainData.wrapMethod('cloneShallow', curry(cloneShallowInjection, opt));
+
+    // Only mainData trigger change, because struct.update may trigger
+    // another changable methods, which may bring about dead lock.
+    each$7(mainData.CHANGABLE_METHODS, function (methodName) {
+        mainData.wrapMethod(methodName, curry(changeInjection, opt));
+    });
+
+    // Make sure datas contains mainData.
+    assert$1(datas[mainData.dataType] === mainData);
+}
+
+function transferInjection(opt, res) {
+    if (isMainData(this)) {
+        // Transfer datas to new main data.
+        var datas = extend({}, this[DATAS]);
+        datas[this.dataType] = res;
+        linkAll(res, datas, opt);
+    }
+    else {
+        // Modify the reference in main data to point newData.
+        linkSingle(res, this.dataType, this[MAIN_DATA], opt);
+    }
+    return res;
+}
+
+function changeInjection(opt, res) {
+    opt.struct && opt.struct.update(this);
+    return res;
+}
+
+function cloneShallowInjection(opt, res) {
+    // cloneShallow, which brings about some fragilities, may be inappropriate
+    // to be exposed as an API. So for implementation simplicity we can make
+    // the restriction that cloneShallow of not-mainData should not be invoked
+    // outside, but only be invoked here.
+    each$7(res[DATAS], function (data, dataType) {
+        data !== res && linkSingle(data.cloneShallow(), dataType, res, opt);
+    });
+    return res;
+}
+
+/**
+ * Supplement method to List.
+ *
+ * @public
+ * @param {string} [dataType] If not specified, return mainData.
+ * @return {module:echarts/data/List}
+ */
+function getLinkedData(dataType) {
+    var mainData = this[MAIN_DATA];
+    return (dataType == null || mainData == null)
+        ? mainData
+        : mainData[DATAS][dataType];
+}
+
+function isMainData(data) {
+    return data[MAIN_DATA] === data;
+}
+
+function linkAll(mainData, datas, opt) {
+    mainData[DATAS] = {};
+    each$7(datas, function (data, dataType) {
+        linkSingle(data, dataType, mainData, opt);
+    });
+}
+
+function linkSingle(data, dataType, mainData, opt) {
+    mainData[DATAS][dataType] = data;
+    data[MAIN_DATA] = mainData;
+    data.dataType = dataType;
+
+    if (opt.struct) {
+        data[opt.structAttr] = opt.struct;
+        opt.struct[opt.datasAttr[dataType]] = data;
+    }
+
+    // Supplement method.
+    data.getLinkedData = getLinkedData;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Tree data structure
+ *
+ * @module echarts/data/Tree
+ */
+
+/**
+ * @constructor module:echarts/data/Tree~TreeNode
+ * @param {string} name
+ * @param {module:echarts/data/Tree} hostTree
+ */
+var TreeNode = function (name, hostTree) {
+    /**
+     * @type {string}
+     */
+    this.name = name || '';
+
+    /**
+     * Depth of node
+     *
+     * @type {number}
+     * @readOnly
+     */
+    this.depth = 0;
+
+    /**
+     * Height of the subtree rooted at this node.
+     * @type {number}
+     * @readOnly
+     */
+    this.height = 0;
+
+    /**
+     * @type {module:echarts/data/Tree~TreeNode}
+     * @readOnly
+     */
+    this.parentNode = null;
+
+    /**
+     * Reference to list item.
+     * Do not persistent dataIndex outside,
+     * besause it may be changed by list.
+     * If dataIndex -1,
+     * this node is logical deleted (filtered) in list.
+     *
+     * @type {Object}
+     * @readOnly
+     */
+    this.dataIndex = -1;
+
+    /**
+     * @type {Array.<module:echarts/data/Tree~TreeNode>}
+     * @readOnly
+     */
+    this.children = [];
+
+    /**
+     * @type {Array.<module:echarts/data/Tree~TreeNode>}
+     * @pubilc
+     */
+    this.viewChildren = [];
+
+    /**
+     * @type {moduel:echarts/data/Tree}
+     * @readOnly
+     */
+    this.hostTree = hostTree;
+};
+
+TreeNode.prototype = {
+
+    constructor: TreeNode,
+
+    /**
+     * The node is removed.
+     * @return {boolean} is removed.
+     */
+    isRemoved: function () {
+        return this.dataIndex < 0;
+    },
+
+    /**
+     * Travel this subtree (include this node).
+     * Usage:
+     *    node.eachNode(function () { ... }); // preorder
+     *    node.eachNode('preorder', function () { ... }); // preorder
+     *    node.eachNode('postorder', function () { ... }); // postorder
+     *    node.eachNode(
+     *        {order: 'postorder', attr: 'viewChildren'},
+     *        function () { ... }
+     *    ); // postorder
+     *
+     * @param {(Object|string)} options If string, means order.
+     * @param {string=} options.order 'preorder' or 'postorder'
+     * @param {string=} options.attr 'children' or 'viewChildren'
+     * @param {Function} cb If in preorder and return false,
+     *                      its subtree will not be visited.
+     * @param {Object} [context]
+     */
+    eachNode: function (options, cb, context) {
+        if (typeof options === 'function') {
+            context = cb;
+            cb = options;
+            options = null;
+        }
+
+        options = options || {};
+        if (isString(options)) {
+            options = {order: options};
+        }
+
+        var order = options.order || 'preorder';
+        var children = this[options.attr || 'children'];
+
+        var suppressVisitSub;
+        order === 'preorder' && (suppressVisitSub = cb.call(context, this));
+
+        for (var i = 0; !suppressVisitSub && i < children.length; i++) {
+            children[i].eachNode(options, cb, context);
+        }
+
+        order === 'postorder' && cb.call(context, this);
+    },
+
+    /**
+     * Update depth and height of this subtree.
+     *
+     * @param  {number} depth
+     */
+    updateDepthAndHeight: function (depth) {
+        var height = 0;
+        this.depth = depth;
+        for (var i = 0; i < this.children.length; i++) {
+            var child = this.children[i];
+            child.updateDepthAndHeight(depth + 1);
+            if (child.height > height) {
+                height = child.height;
+            }
+        }
+        this.height = height + 1;
+    },
+
+    /**
+     * @param  {string} id
+     * @return {module:echarts/data/Tree~TreeNode}
+     */
+    getNodeById: function (id) {
+        if (this.getId() === id) {
+            return this;
+        }
+        for (var i = 0, children = this.children, len = children.length; i < len; i++) {
+            var res = children[i].getNodeById(id);
+            if (res) {
+                return res;
+            }
+        }
+    },
+
+    /**
+     * @param {module:echarts/data/Tree~TreeNode} node
+     * @return {boolean}
+     */
+    contains: function (node) {
+        if (node === this) {
+            return true;
+        }
+        for (var i = 0, children = this.children, len = children.length; i < len; i++) {
+            var res = children[i].contains(node);
+            if (res) {
+                return res;
+            }
+        }
+    },
+
+    /**
+     * @param {boolean} includeSelf Default false.
+     * @return {Array.<module:echarts/data/Tree~TreeNode>} order: [root, child, grandchild, ...]
+     */
+    getAncestors: function (includeSelf) {
+        var ancestors = [];
+        var node = includeSelf ? this : this.parentNode;
+        while (node) {
+            ancestors.push(node);
+            node = node.parentNode;
+        }
+        ancestors.reverse();
+        return ancestors;
+    },
+
+    /**
+     * @param {string|Array=} [dimension='value'] Default 'value'. can be 0, 1, 2, 3
+     * @return {number} Value.
+     */
+    getValue: function (dimension) {
+        var data = this.hostTree.data;
+        return data.get(data.getDimension(dimension || 'value'), this.dataIndex);
+    },
+
+    /**
+     * @param {Object} layout
+     * @param {boolean=} [merge=false]
+     */
+    setLayout: function (layout, merge$$1) {
+        this.dataIndex >= 0
+            && this.hostTree.data.setItemLayout(this.dataIndex, layout, merge$$1);
+    },
+
+    /**
+     * @return {Object} layout
+     */
+    getLayout: function () {
+        return this.hostTree.data.getItemLayout(this.dataIndex);
+    },
+
+    /**
+     * @param {string} [path]
+     * @return {module:echarts/model/Model}
+     */
+    getModel: function (path) {
+        if (this.dataIndex < 0) {
+            return;
+        }
+        var hostTree = this.hostTree;
+        var itemModel = hostTree.data.getItemModel(this.dataIndex);
+        var levelModel = this.getLevelModel();
+        var leavesModel;
+        if (!levelModel && (this.children.length === 0 || (this.children.length !== 0 && this.isExpand === false))) {
+            leavesModel = this.getLeavesModel();
+        }
+        return itemModel.getModel(path, (levelModel || leavesModel || hostTree.hostModel).getModel(path));
+    },
+
+    /**
+     * @return {module:echarts/model/Model}
+     */
+    getLevelModel: function () {
+        return (this.hostTree.levelModels || [])[this.depth];
+    },
+
+    /**
+     * @return {module:echarts/model/Model}
+     */
+    getLeavesModel: function () {
+        return this.hostTree.leavesModel;
+    },
+
+    /**
+     * @example
+     *  setItemVisual('color', color);
+     *  setItemVisual({
+     *      'color': color
+     *  });
+     */
+    setVisual: function (key, value) {
+        this.dataIndex >= 0
+            && this.hostTree.data.setItemVisual(this.dataIndex, key, value);
+    },
+
+    /**
+     * Get item visual
+     */
+    getVisual: function (key, ignoreParent) {
+        return this.hostTree.data.getItemVisual(this.dataIndex, key, ignoreParent);
+    },
+
+    /**
+     * @public
+     * @return {number}
+     */
+    getRawIndex: function () {
+        return this.hostTree.data.getRawIndex(this.dataIndex);
+    },
+
+    /**
+     * @public
+     * @return {string}
+     */
+    getId: function () {
+        return this.hostTree.data.getId(this.dataIndex);
+    },
+
+    /**
+     * if this is an ancestor of another node
+     *
+     * @public
+     * @param {TreeNode} node another node
+     * @return {boolean} if is ancestor
+     */
+    isAncestorOf: function (node) {
+        var parent = node.parentNode;
+        while (parent) {
+            if (parent === this) {
+                return true;
+            }
+            parent = parent.parentNode;
+        }
+        return false;
+    },
+
+    /**
+     * if this is an descendant of another node
+     *
+     * @public
+     * @param {TreeNode} node another node
+     * @return {boolean} if is descendant
+     */
+    isDescendantOf: function (node) {
+        return node !== this && node.isAncestorOf(this);
+    }
+};
+
+/**
+ * @constructor
+ * @alias module:echarts/data/Tree
+ * @param {module:echarts/model/Model} hostModel
+ * @param {Array.<Object>} levelOptions
+ * @param {Object} leavesOption
+ */
+function Tree(hostModel, levelOptions, leavesOption) {
+    /**
+     * @type {module:echarts/data/Tree~TreeNode}
+     * @readOnly
+     */
+    this.root;
+
+    /**
+     * @type {module:echarts/data/List}
+     * @readOnly
+     */
+    this.data;
+
+    /**
+     * Index of each item is the same as the raw index of coresponding list item.
+     * @private
+     * @type {Array.<module:echarts/data/Tree~TreeNode}
+     */
+    this._nodes = [];
+
+    /**
+     * @private
+     * @readOnly
+     * @type {module:echarts/model/Model}
+     */
+    this.hostModel = hostModel;
+
+    /**
+     * @private
+     * @readOnly
+     * @type {Array.<module:echarts/model/Model}
+     */
+    this.levelModels = map(levelOptions || [], function (levelDefine) {
+        return new Model(levelDefine, hostModel, hostModel.ecModel);
+    });
+
+    this.leavesModel = new Model(leavesOption || {}, hostModel, hostModel.ecModel);
+}
+
+Tree.prototype = {
+
+    constructor: Tree,
+
+    type: 'tree',
+
+    /**
+     * Travel this subtree (include this node).
+     * Usage:
+     *    node.eachNode(function () { ... }); // preorder
+     *    node.eachNode('preorder', function () { ... }); // preorder
+     *    node.eachNode('postorder', function () { ... }); // postorder
+     *    node.eachNode(
+     *        {order: 'postorder', attr: 'viewChildren'},
+     *        function () { ... }
+     *    ); // postorder
+     *
+     * @param {(Object|string)} options If string, means order.
+     * @param {string=} options.order 'preorder' or 'postorder'
+     * @param {string=} options.attr 'children' or 'viewChildren'
+     * @param {Function} cb
+     * @param {Object}   [context]
+     */
+    eachNode: function(options, cb, context) {
+        this.root.eachNode(options, cb, context);
+    },
+
+    /**
+     * @param {number} dataIndex
+     * @return {module:echarts/data/Tree~TreeNode}
+     */
+    getNodeByDataIndex: function (dataIndex) {
+        var rawIndex = this.data.getRawIndex(dataIndex);
+        return this._nodes[rawIndex];
+    },
+
+    /**
+     * @param {string} name
+     * @return {module:echarts/data/Tree~TreeNode}
+     */
+    getNodeByName: function (name) {
+        return this.root.getNodeByName(name);
+    },
+
+    /**
+     * Update item available by list,
+     * when list has been performed options like 'filterSelf' or 'map'.
+     */
+    update: function () {
+        var data = this.data;
+        var nodes = this._nodes;
+
+        for (var i = 0, len = nodes.length; i < len; i++) {
+            nodes[i].dataIndex = -1;
+        }
+
+        for (var i = 0, len = data.count(); i < len; i++) {
+            nodes[data.getRawIndex(i)].dataIndex = i;
+        }
+    },
+
+    /**
+     * Clear all layouts
+     */
+    clearLayouts: function () {
+        this.data.clearItemLayouts();
+    }
+};
+
+/**
+ * data node format:
+ * {
+ *     name: ...
+ *     value: ...
+ *     children: [
+ *         {
+ *             name: ...
+ *             value: ...
+ *             children: ...
+ *         },
+ *         ...
+ *     ]
+ * }
+ *
+ * @static
+ * @param {Object} dataRoot Root node.
+ * @param {module:echarts/model/Model} hostModel
+ * @param {Object} treeOptions
+ * @param {Array.<Object>} treeOptions.levels
+ * @param {Array.<Object>} treeOptions.leaves
+ * @return module:echarts/data/Tree
+ */
+Tree.createTree = function (dataRoot, hostModel, treeOptions) {
+
+    var tree = new Tree(hostModel, treeOptions.levels, treeOptions.leaves);
+    var listData = [];
+    var dimMax = 1;
+
+    buildHierarchy(dataRoot);
+
+    function buildHierarchy(dataNode, parentNode) {
+        var value = dataNode.value;
+        dimMax = Math.max(dimMax, isArray(value) ? value.length : 1);
+
+        listData.push(dataNode);
+
+        var node = new TreeNode(dataNode.name, tree);
+        parentNode
+            ? addChild(node, parentNode)
+            : (tree.root = node);
+
+        tree._nodes.push(node);
+
+        var children = dataNode.children;
+        if (children) {
+            for (var i = 0; i < children.length; i++) {
+                buildHierarchy(children[i], node);
+            }
+        }
+    }
+
+    tree.root.updateDepthAndHeight(0);
+
+    var dimensionsInfo = createDimensions(listData, {
+        coordDimensions: ['value'],
+        dimensionsCount: dimMax
+    });
+
+    var list = new List(dimensionsInfo, hostModel);
+    list.initData(listData);
+
+    linkList({
+        mainData: list,
+        struct: tree,
+        structAttr: 'tree'
+    });
+
+    tree.update();
+
+    return tree;
+};
+
+/**
+ * It is needed to consider the mess of 'list', 'hostModel' when creating a TreeNote,
+ * so this function is not ready and not necessary to be public.
+ *
+ * @param {(module:echarts/data/Tree~TreeNode|Object)} child
+ */
+function addChild(child, node) {
+    var children = node.children;
+    if (child.parentNode === node) {
+        return;
+    }
+
+    children.push(child);
+    child.parentNode = node;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Create data struct and define tree view's series model
+ */
+
+SeriesModel.extend({
+
+    type: 'series.tree',
+
+    layoutInfo: null,
+
+    // can support the position parameters 'left', 'top','right','bottom', 'width',
+    // 'height' in the setOption() with 'merge' mode normal.
+    layoutMode: 'box',
+
+    /**
+     * Init a tree data structure from data in option series
+     * @param  {Object} option  the object used to config echarts view
+     * @return {module:echarts/data/List} storage initial data
+     */
+    getInitialData: function (option) {
+
+        //create an virtual root
+        var root = {name: option.name, children: option.data};
+
+        var leaves = option.leaves || {};
+
+        var treeOption = {};
+
+        treeOption.leaves = leaves;
+
+        var tree = Tree.createTree(root, this, treeOption);
+
+        var treeDepth = 0;
+
+        tree.eachNode('preorder', function (node) {
+            if (node.depth > treeDepth) {
+                treeDepth = node.depth;
+            }
+        });
+
+        var expandAndCollapse = option.expandAndCollapse;
+        var expandTreeDepth = (expandAndCollapse && option.initialTreeDepth >= 0)
+            ? option.initialTreeDepth : treeDepth;
+
+        tree.root.eachNode('preorder', function (node) {
+            var item = node.hostTree.data.getRawDataItem(node.dataIndex);
+            // add item.collapsed != null, because users can collapse node original in the series.data.
+            node.isExpand = (item && item.collapsed != null)
+                ? !item.collapsed
+                : node.depth <= expandTreeDepth;
+        });
+
+        return tree.data;
+    },
+    
+    /**
+     * Make the configuration 'orient' backward compatibly, with 'horizontal = LR', 'vertical = TB'.
+     * @returns {string} orient
+     */
+    getOrient: function () {
+        var orient = this.get('orient');
+        if (orient === 'horizontal') {
+            orient = 'LR';
+        }
+        else if (orient === 'vertical') {
+            orient = 'TB';
+        }
+        return orient;
+    },
+
+    /**
+     * @override
+     * @param {number} dataIndex
+     */
+    formatTooltip: function (dataIndex) {
+        var tree = this.getData().tree;
+        var realRoot = tree.root.children[0];
+        var node = tree.getNodeByDataIndex(dataIndex);
+        var value = node.getValue();
+        var name = node.name;
+        while (node && (node !== realRoot)) {
+            name = node.parentNode.name + '.' + name;
+            node = node.parentNode;
+        }
+        return encodeHTML(name + (
+            (isNaN(value) || value == null) ? '' : ' : ' + value
+        ));
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        // the position of the whole view
+        left: '12%',
+        top: '12%',
+        right: '12%',
+        bottom: '12%',
+
+        // the layout of the tree, two value can be selected, 'orthogonal' or 'radial'
+        layout: 'orthogonal',
+
+        // The orient of orthoginal layout, can be setted to 'LR', 'TB', 'RL', 'BT'.
+        // and the backward compatibility configuration 'horizontal = LR', 'vertical = TB'.
+        orient: 'LR',
+
+        symbol: 'emptyCircle',
+
+        symbolSize: 7,
+
+        expandAndCollapse: true,
+
+        initialTreeDepth: 2,
+
+        lineStyle: {
+            color: '#ccc',
+            width: 1.5,
+            curveness: 0.5
+        },
+
+        itemStyle: {
+            color: 'lightsteelblue',
+            borderColor: '#c23531',
+            borderWidth: 1.5
+        },
+
+        label: {
+            show: true,
+            color: '#555'
+        },
+
+        leaves: {
+            label: {
+                show: true
+            }
+        },
+
+        animationEasing: 'linear',
+
+        animationDuration: 700,
+
+        animationDurationUpdate: 1000
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The tree layout implementation references to d3.js
+* (https://github.com/d3/d3-hierarchy). The use of the source
+* code of this file is also subject to the terms and consitions
+* of its license (BSD-3Clause, see <echarts/src/licenses/LICENSE-d3>).
+*/
+
+/**
+ * @file The layout algorithm of node-link tree diagrams. Here we using Reingold-Tilford algorithm to drawing
+ *       the tree.
+ * @see https://github.com/d3/d3-hierarchy
+ */
+
+/**
+ * Initialize all computational message for following algorithm
+ * @param  {module:echarts/data/Tree~TreeNode} root   The virtual root of the tree
+ */
+function init$2(root) {
+    root.hierNode = {
+        defaultAncestor: null,
+        ancestor: root,
+        prelim: 0,
+        modifier: 0,
+        change: 0,
+        shift: 0,
+        i: 0,
+        thread: null
+    };
+
+    var nodes = [root];
+    var node;
+    var children;
+
+    while (node = nodes.pop()) { // jshint ignore:line
+        children = node.children;
+        if (node.isExpand && children.length) {
+            var n = children.length;
+            for (var i = n - 1; i >= 0; i--) {
+                var child = children[i];
+                child.hierNode = {
+                    defaultAncestor: null,
+                    ancestor: child,
+                    prelim: 0,
+                    modifier: 0,
+                    change: 0,
+                    shift: 0,
+                    i: i,
+                    thread: null
+                };
+                nodes.push(child);
+            }
+        }
+    }
+}
+
+/**
+ * Computes a preliminary x coordinate for node. Before that, this function is
+ * applied recursively to the children of node, as well as the function
+ * apportion(). After spacing out the children by calling executeShifts(), the
+ * node is placed to the midpoint of its outermost children.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @param {Function} separation
+ */
+function firstWalk(node, separation) {
+    var children = node.isExpand ? node.children : [];
+    var siblings = node.parentNode.children;
+    var subtreeW = node.hierNode.i ? siblings[node.hierNode.i -1] : null;
+    if (children.length) {
+        executeShifts(node);
+        var midPoint = (children[0].hierNode.prelim + children[children.length - 1].hierNode.prelim) / 2;
+        if (subtreeW) {
+            node.hierNode.prelim = subtreeW.hierNode.prelim + separation(node, subtreeW);
+            node.hierNode.modifier = node.hierNode.prelim - midPoint;
+        }
+        else {
+            node.hierNode.prelim = midPoint;
+        }
+    }
+    else if (subtreeW) {
+        node.hierNode.prelim = subtreeW.hierNode.prelim + separation(node, subtreeW);
+    }
+    node.parentNode.hierNode.defaultAncestor = apportion(node, subtreeW, node.parentNode.hierNode.defaultAncestor || siblings[0], separation);
+}
+
+
+/**
+ * Computes all real x-coordinates by summing up the modifiers recursively.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ */
+function secondWalk(node) {
+    var nodeX = node.hierNode.prelim + node.parentNode.hierNode.modifier;
+    node.setLayout({x: nodeX}, true);
+    node.hierNode.modifier += node.parentNode.hierNode.modifier;
+}
+
+
+function separation(cb) {
+    return arguments.length ? cb : defaultSeparation;
+}
+
+/**
+ * Transform the common coordinate to radial coordinate
+ * @param  {number} x
+ * @param  {number} y
+ * @return {Object}
+ */
+function radialCoordinate(x, y) {
+    var radialCoor = {};
+    x -= Math.PI / 2;
+    radialCoor.x = y * Math.cos(x);
+    radialCoor.y = y * Math.sin(x);
+    return radialCoor;
+}
+
+/**
+ * Get the layout position of the whole view
+ * @param {module:echarts/model/Series} seriesModel  the model object of sankey series
+ * @param {module:echarts/ExtensionAPI} api  provide the API list that the developer can call
+ * @return {module:zrender/core/BoundingRect}  size of rect to draw the sankey view
+ */
+function getViewRect(seriesModel, api) {
+    return getLayoutRect(
+        seriesModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        }
+    );
+}
+
+/**
+ * All other shifts, applied to the smaller subtrees between w- and w+, are
+ * performed by this function.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ */
+function executeShifts(node) {
+    var children = node.children;
+    var n = children.length;
+    var shift = 0;
+    var change = 0;
+    while (--n >= 0) {
+        var child = children[n];
+        child.hierNode.prelim += shift;
+        child.hierNode.modifier += shift;
+        change += child.hierNode.change;
+        shift += child.hierNode.shift + change;
+    }
+}
+
+/**
+ * The core of the algorithm. Here, a new subtree is combined with the
+ * previous subtrees. Threads are used to traverse the inside and outside
+ * contours of the left and right subtree up to the highest common level.
+ * Whenever two nodes of the inside contours conflict, we compute the left
+ * one of the greatest uncommon ancestors using the function nextAncestor()
+ * and call moveSubtree() to shift the subtree and prepare the shifts of
+ * smaller subtrees. Finally, we add a new thread (if necessary).
+ * @param  {module:echarts/data/Tree~TreeNode} subtreeV
+ * @param  {module:echarts/data/Tree~TreeNode} subtreeW
+ * @param  {module:echarts/data/Tree~TreeNode} ancestor
+ * @param  {Function} separation
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function apportion(subtreeV, subtreeW, ancestor, separation) {
+
+    if (subtreeW) {
+        var nodeOutRight = subtreeV;
+        var nodeInRight = subtreeV;
+        var nodeOutLeft = nodeInRight.parentNode.children[0];
+        var nodeInLeft = subtreeW;
+
+        var sumOutRight = nodeOutRight.hierNode.modifier;
+        var sumInRight = nodeInRight.hierNode.modifier;
+        var sumOutLeft = nodeOutLeft.hierNode.modifier;
+        var sumInLeft = nodeInLeft.hierNode.modifier;
+
+        while (nodeInLeft = nextRight(nodeInLeft), nodeInRight = nextLeft(nodeInRight), nodeInLeft && nodeInRight) {
+            nodeOutRight = nextRight(nodeOutRight);
+            nodeOutLeft = nextLeft(nodeOutLeft);
+            nodeOutRight.hierNode.ancestor = subtreeV;
+            var shift = nodeInLeft.hierNode.prelim + sumInLeft - nodeInRight.hierNode.prelim
+                    - sumInRight + separation(nodeInLeft, nodeInRight);
+            if (shift > 0) {
+                moveSubtree(nextAncestor(nodeInLeft, subtreeV, ancestor), subtreeV, shift);
+                sumInRight += shift;
+                sumOutRight += shift;
+            }
+            sumInLeft += nodeInLeft.hierNode.modifier;
+            sumInRight += nodeInRight.hierNode.modifier;
+            sumOutRight += nodeOutRight.hierNode.modifier;
+            sumOutLeft += nodeOutLeft.hierNode.modifier;
+        }
+        if (nodeInLeft && !nextRight(nodeOutRight)) {
+            nodeOutRight.hierNode.thread = nodeInLeft;
+            nodeOutRight.hierNode.modifier += sumInLeft - sumOutRight;
+
+        }
+        if (nodeInRight && !nextLeft(nodeOutLeft)) {
+            nodeOutLeft.hierNode.thread = nodeInRight;
+            nodeOutLeft.hierNode.modifier += sumInRight - sumOutLeft;
+            ancestor = subtreeV;
+        }
+    }
+    return ancestor;
+}
+
+/**
+ * This function is used to traverse the right contour of a subtree.
+ * It returns the rightmost child of node or the thread of node. The function
+ * returns null if and only if node is on the highest depth of its subtree.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function nextRight(node) {
+    var children = node.children;
+    return children.length && node.isExpand ? children[children.length - 1] : node.hierNode.thread;
+}
+
+/**
+ * This function is used to traverse the left contour of a subtree (or a subforest).
+ * It returns the leftmost child of node or the thread of node. The function
+ * returns null if and only if node is on the highest depth of its subtree.
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function nextLeft(node) {
+    var children = node.children;
+    return children.length && node.isExpand ? children[0] : node.hierNode.thread;
+}
+
+/**
+ * If nodeInLeft’s ancestor is a sibling of node, returns nodeInLeft’s ancestor.
+ * Otherwise, returns the specified ancestor.
+ * @param  {module:echarts/data/Tree~TreeNode} nodeInLeft
+ * @param  {module:echarts/data/Tree~TreeNode} node
+ * @param  {module:echarts/data/Tree~TreeNode} ancestor
+ * @return {module:echarts/data/Tree~TreeNode}
+ */
+function nextAncestor(nodeInLeft, node, ancestor) {
+    return nodeInLeft.hierNode.ancestor.parentNode === node.parentNode
+        ? nodeInLeft.hierNode.ancestor : ancestor;
+}
+
+/**
+ * Shifts the current subtree rooted at wr. This is done by increasing prelim(w+) and modifier(w+) by shift.
+ * @param  {module:echarts/data/Tree~TreeNode} wl
+ * @param  {module:echarts/data/Tree~TreeNode} wr
+ * @param  {number} shift [description]
+ */
+function moveSubtree(wl, wr,shift) {
+    var change = shift / (wr.hierNode.i - wl.hierNode.i);
+    wr.hierNode.change -= change;
+    wr.hierNode.shift += shift;
+    wr.hierNode.modifier += shift;
+    wr.hierNode.prelim += shift;
+    wl.hierNode.change += change;
+}
+
+function defaultSeparation(node1, node2) {
+    return node1.parentNode === node2.parentNode ? 1 : 2;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  This file used to draw tree view
+ */
+
+extendChartView({
+
+    type: 'tree',
+
+    /**
+     * Init the chart
+     * @override
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    init: function (ecModel, api) {
+
+        /**
+         * @private
+         * @type {module:echarts/data/Tree}
+         */
+        this._oldTree;
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this._mainGroup = new Group();
+
+        this.group.add(this._mainGroup);
+    },
+
+    render: function (seriesModel, ecModel, api, payload) {
+
+        var data = seriesModel.getData();
+
+        var layoutInfo = seriesModel.layoutInfo;
+
+        var group = this._mainGroup;
+
+        var layout = seriesModel.get('layout');
+
+        if (layout === 'radial') {
+            group.attr('position', [layoutInfo.x + layoutInfo.width / 2, layoutInfo.y + layoutInfo.height / 2]);
+        }
+        else {
+            group.attr('position', [layoutInfo.x, layoutInfo.y]);
+        }
+
+        var oldData = this._data;
+
+        var seriesScope = {
+            expandAndCollapse: seriesModel.get('expandAndCollapse'),
+            layout: layout,
+            orient: seriesModel.getOrient(),
+            curvature: seriesModel.get('lineStyle.curveness'),
+            symbolRotate: seriesModel.get('symbolRotate'),
+            symbolOffset: seriesModel.get('symbolOffset'),
+            hoverAnimation: seriesModel.get('hoverAnimation'),
+            useNameLabel: true,
+            fadeIn: true
+        };
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                if (symbolNeedsDraw$1(data, newIdx)) {
+                    // create node and edge
+                    updateNode(data, newIdx, null, group, seriesModel, seriesScope);
+                }
+            })
+            .update(function (newIdx, oldIdx) {
+                var symbolEl = oldData.getItemGraphicEl(oldIdx);
+                if (!symbolNeedsDraw$1(data, newIdx)) {
+                    symbolEl && removeNode(oldData, oldIdx, symbolEl, group, seriesModel, seriesScope);
+                    return;
+                }
+                // update  node and edge
+                updateNode(data, newIdx, symbolEl, group, seriesModel, seriesScope);
+            })
+            .remove(function (oldIdx) {
+                var symbolEl = oldData.getItemGraphicEl(oldIdx);
+                // When remove a collapsed node of subtree, since the collapsed
+                // node haven't been initialized with a symbol element,
+                // you can't found it's symbol element through index.
+                // so if we want to remove the symbol element we should insure
+                // that the symbol element is not null.
+                if (symbolEl) {
+                    removeNode(oldData, oldIdx, symbolEl, group, seriesModel, seriesScope);
+                }
+            })
+            .execute();
+
+        if (seriesScope.expandAndCollapse === true) {
+            data.eachItemGraphicEl(function (el, dataIndex) {
+                el.off('click').on('click', function () {
+                    api.dispatchAction({
+                        type: 'treeExpandAndCollapse',
+                        seriesId: seriesModel.id,
+                        dataIndex: dataIndex
+                    });
+                });
+            });
+        }
+
+        this._data = data;
+    },
+
+    dispose: function () {},
+
+    remove: function () {
+        this._mainGroup.removeAll();
+        this._data = null;
+    }
+
+});
+
+function symbolNeedsDraw$1(data, dataIndex) {
+    var layout = data.getItemLayout(dataIndex);
+
+    return layout
+        && !isNaN(layout.x) && !isNaN(layout.y)
+        && data.getItemVisual(dataIndex, 'symbol') !== 'none';
+}
+
+function getTreeNodeStyle(node, itemModel, seriesScope) {
+    seriesScope.itemModel = itemModel;
+    seriesScope.itemStyle = itemModel.getModel('itemStyle').getItemStyle();
+    seriesScope.hoverItemStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+    seriesScope.lineStyle = itemModel.getModel('lineStyle').getLineStyle();
+    seriesScope.labelModel = itemModel.getModel('label');
+    seriesScope.hoverLabelModel = itemModel.getModel('emphasis.label');
+
+    if (node.isExpand === false && node.children.length !== 0) {
+        seriesScope.symbolInnerColor = seriesScope.itemStyle.fill;
+    }
+    else {
+        seriesScope.symbolInnerColor = '#fff';
+    }
+
+    return seriesScope;
+}
+
+function updateNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope) {
+    var isInit = !symbolEl;
+    var node = data.tree.getNodeByDataIndex(dataIndex);
+    var itemModel = node.getModel();
+    var seriesScope = getTreeNodeStyle(node, itemModel, seriesScope);
+    var virtualRoot = data.tree.root;
+
+    var source = node.parentNode === virtualRoot ? node : node.parentNode || node;
+    var sourceSymbolEl = data.getItemGraphicEl(source.dataIndex);
+    var sourceLayout = source.getLayout();
+    var sourceOldLayout = sourceSymbolEl
+        ? {
+            x: sourceSymbolEl.position[0],
+            y: sourceSymbolEl.position[1],
+            rawX: sourceSymbolEl.__radialOldRawX,
+            rawY: sourceSymbolEl.__radialOldRawY
+        }
+        : sourceLayout;
+    var targetLayout = node.getLayout();
+
+    if (isInit) {
+        symbolEl = new SymbolClz$1(data, dataIndex, seriesScope);
+        symbolEl.attr('position', [sourceOldLayout.x, sourceOldLayout.y]);
+    }
+    else {
+        symbolEl.updateData(data, dataIndex, seriesScope);
+    }
+
+    symbolEl.__radialOldRawX = symbolEl.__radialRawX;
+    symbolEl.__radialOldRawY = symbolEl.__radialRawY;
+    symbolEl.__radialRawX = targetLayout.rawX;
+    symbolEl.__radialRawY = targetLayout.rawY;
+
+    group.add(symbolEl);
+    data.setItemGraphicEl(dataIndex, symbolEl);
+    updateProps(symbolEl, {
+        position: [targetLayout.x, targetLayout.y]
+    }, seriesModel);
+
+    var symbolPath = symbolEl.getSymbolPath();
+
+    if (seriesScope.layout === 'radial') {
+        var realRoot = virtualRoot.children[0];
+        var rootLayout = realRoot.getLayout();
+        var length = realRoot.children.length;
+        var rad;
+        var isLeft;
+
+        if (targetLayout.x === rootLayout.x && node.isExpand === true) {
+            var center = {};
+            center.x = (realRoot.children[0].getLayout().x + realRoot.children[length - 1].getLayout().x) / 2;
+            center.y = (realRoot.children[0].getLayout().y + realRoot.children[length - 1].getLayout().y) / 2;
+            rad = Math.atan2(center.y - rootLayout.y, center.x - rootLayout.x);
+            if (rad < 0) {
+                rad = Math.PI * 2 + rad;
+            }
+            isLeft = center.x < rootLayout.x;
+            if (isLeft) {
+                rad = rad - Math.PI;
+            }
+        }
+        else {
+            rad = Math.atan2(targetLayout.y - rootLayout.y, targetLayout.x - rootLayout.x);
+            if (rad < 0) {
+                rad = Math.PI * 2 + rad;
+            }
+            if (node.children.length === 0 || (node.children.length !== 0 && node.isExpand === false)) {
+                isLeft = targetLayout.x < rootLayout.x;
+                if (isLeft) {
+                    rad = rad - Math.PI;
+                }
+            }
+            else {
+                isLeft = targetLayout.x > rootLayout.x;
+                if (!isLeft) {
+                    rad = rad - Math.PI;
+                }
+            }
+        }
+
+        var textPosition = isLeft ? 'left' : 'right';
+        symbolPath.setStyle({
+            textPosition: textPosition,
+            textRotation: -rad,
+            textOrigin: 'center',
+            verticalAlign: 'middle'
+        });
+    }
+
+    if (node.parentNode && node.parentNode !== virtualRoot) {
+        var edge = symbolEl.__edge;
+        if (!edge) {
+            edge = symbolEl.__edge = new BezierCurve({
+                shape: getEdgeShape(seriesScope, sourceOldLayout, sourceOldLayout),
+                style: defaults({opacity: 0}, seriesScope.lineStyle)
+            });
+        }
+
+        updateProps(edge, {
+            shape: getEdgeShape(seriesScope, sourceLayout, targetLayout),
+            style: {opacity: 1}
+        }, seriesModel);
+
+        group.add(edge);
+    }
+}
+
+function removeNode(data, dataIndex, symbolEl, group, seriesModel, seriesScope) {
+    var node = data.tree.getNodeByDataIndex(dataIndex);
+    var virtualRoot = data.tree.root;
+    var itemModel = node.getModel();
+    var seriesScope = getTreeNodeStyle(node, itemModel, seriesScope);
+
+    var source = node.parentNode === virtualRoot ? node : node.parentNode || node;
+    var sourceLayout;
+    while (sourceLayout = source.getLayout(), sourceLayout == null) {
+        source = source.parentNode === virtualRoot ? source : source.parentNode || source;
+    }
+
+    updateProps(symbolEl, {
+        position: [sourceLayout.x + 1, sourceLayout.y + 1]
+    }, seriesModel, function () {
+        group.remove(symbolEl);
+        data.setItemGraphicEl(dataIndex, null);
+    });
+
+    symbolEl.fadeOut(null, {keepLabel: true});
+
+    var edge = symbolEl.__edge;
+    if (edge) {
+        updateProps(edge, {
+            shape: getEdgeShape(seriesScope, sourceLayout, sourceLayout),
+            style: {
+                opacity: 0
+            }
+        }, seriesModel, function () {
+            group.remove(edge);
+        });
+    }
+}
+
+function getEdgeShape(seriesScope, sourceLayout, targetLayout) {
+    var cpx1;
+    var cpy1;
+    var cpx2;
+    var cpy2;
+    var orient = seriesScope.orient;
+
+    if (seriesScope.layout === 'radial') {
+        var x1 = sourceLayout.rawX;
+        var y1 = sourceLayout.rawY;
+        var x2 = targetLayout.rawX;
+        var y2 = targetLayout.rawY;
+
+        var radialCoor1 = radialCoordinate(x1, y1);
+        var radialCoor2 = radialCoordinate(x1, y1 + (y2 - y1) * seriesScope.curvature);
+        var radialCoor3 = radialCoordinate(x2, y2 + (y1 - y2) * seriesScope.curvature);
+        var radialCoor4 = radialCoordinate(x2, y2);
+
+        return {
+            x1: radialCoor1.x,
+            y1: radialCoor1.y,
+            x2: radialCoor4.x,
+            y2: radialCoor4.y,
+            cpx1: radialCoor2.x,
+            cpy1: radialCoor2.y,
+            cpx2: radialCoor3.x,
+            cpy2: radialCoor3.y
+        };
+    }
+    else {
+        var x1 = sourceLayout.x;
+        var y1 = sourceLayout.y;
+        var x2 = targetLayout.x;
+        var y2 = targetLayout.y;
+
+        if (orient === 'LR' || orient === 'RL') {
+            cpx1 = x1 + (x2 - x1) * seriesScope.curvature;
+            cpy1 = y1;
+            cpx2 = x2 + (x1 - x2) * seriesScope.curvature;
+            cpy2 = y2;
+        }
+        if (orient === 'TB' || orient === 'BT') {
+            cpx1 = x1;
+            cpy1 = y1 + (y2 - y1) * seriesScope.curvature;
+            cpx2 = x2;
+            cpy2 = y2 + (y1 - y2) * seriesScope.curvature;
+        }
+        return {
+            x1: x1,
+            y1: y1,
+            x2: x2,
+            y2: y2,
+            cpx1: cpx1,
+            cpy1: cpy1,
+            cpx2: cpx2,
+            cpy2: cpy2
+        };
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction({
+    type: 'treeExpandAndCollapse',
+    event: 'treeExpandAndCollapse',
+    update: 'update'
+}, function (payload, ecModel) {
+    ecModel.eachComponent({mainType: 'series', subType: 'tree', query: payload}, function (seriesModel) {
+        var dataIndex = payload.dataIndex;
+        var tree = seriesModel.getData().tree;
+        var node = tree.getNodeByDataIndex(dataIndex);
+        node.isExpand = !node.isExpand;
+
+    });
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+/**
+ * Traverse the tree from bottom to top and do something
+ * @param  {module:echarts/data/Tree~TreeNode} root  The real root of the tree
+ * @param  {Function} callback
+ */
+function eachAfter (root, callback, separation) {
+    var nodes = [root];
+    var next = [];
+    var node;
+
+    while (node = nodes.pop()) { // jshint ignore:line
+        next.push(node);
+        if (node.isExpand) {
+            var children = node.children;
+            if (children.length) {
+                for (var i = 0; i < children.length; i++) {
+                    nodes.push(children[i]);
+                }
+            }
+        }
+    }
+
+    while (node = next.pop()) { // jshint ignore:line
+        callback(node, separation);
+    }
+}
+
+/**
+ * Traverse the tree from top to bottom and do something
+ * @param  {module:echarts/data/Tree~TreeNode} root  The real root of the tree
+ * @param  {Function} callback
+ */
+function eachBefore (root, callback) {
+    var nodes = [root];
+    var node;
+    while (node = nodes.pop()) { // jshint ignore:line
+        callback(node);
+        if (node.isExpand) {
+            var children = node.children;
+            if (children.length) {
+                for (var i = children.length - 1; i >= 0; i--) {
+                    nodes.push(children[i]);
+                }
+            }
+        }
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var treeLayout = function (ecModel, api) {
+    ecModel.eachSeriesByType('tree', function (seriesModel) {
+        commonLayout(seriesModel, api);
+    });
+};
+
+function commonLayout(seriesModel, api) {
+    var layoutInfo = getViewRect(seriesModel, api);
+    seriesModel.layoutInfo = layoutInfo;
+    var layout = seriesModel.get('layout');
+    var width = 0;
+    var height = 0;
+    var separation$$1 = null;
+    
+    if (layout === 'radial') {
+        width = 2 * Math.PI;
+        height = Math.min(layoutInfo.height, layoutInfo.width) / 2;
+        separation$$1 = separation(function (node1, node2) {
+            return (node1.parentNode === node2.parentNode ? 1 : 2) / node1.depth;
+        });
+    }
+    else {
+        width = layoutInfo.width;
+        height = layoutInfo.height;
+        separation$$1 = separation();
+    }
+
+    var virtualRoot = seriesModel.getData().tree.root;
+    var realRoot = virtualRoot.children[0];
+
+    if (realRoot) {
+        init$2(virtualRoot);
+        eachAfter(realRoot, firstWalk, separation$$1);
+        virtualRoot.hierNode.modifier = - realRoot.hierNode.prelim;
+        eachBefore(realRoot, secondWalk);
+
+        var left = realRoot;
+        var right = realRoot;
+        var bottom = realRoot;
+        eachBefore(realRoot, function (node) {
+            var x = node.getLayout().x;
+            if (x < left.getLayout().x) {
+                left = node;
+            }
+            if (x > right.getLayout().x) {
+                right = node;
+            }
+            if (node.depth > bottom.depth) {
+                bottom = node;
+            }
+        });
+
+        var delta = left === right ? 1 : separation$$1(left, right) / 2;
+        var tx = delta - left.getLayout().x;
+        var kx = 0;
+        var ky = 0;
+        var coorX = 0;
+        var coorY = 0;
+        if (layout === 'radial') {
+            kx = width / (right.getLayout().x + delta + tx);
+            // here we use (node.depth - 1), bucause the real root's depth is 1
+            ky = height / ((bottom.depth - 1) || 1);
+            eachBefore(realRoot, function (node) {
+                coorX = (node.getLayout().x + tx) * kx;
+                coorY = (node.depth - 1) * ky;
+                var finalCoor = radialCoordinate(coorX, coorY);
+                node.setLayout({x: finalCoor.x, y: finalCoor.y, rawX: coorX, rawY: coorY}, true);
+            });
+        }
+        else {
+            var orient = seriesModel.getOrient(); 
+            if (orient === 'RL' || orient === 'LR') {
+                ky = height / (right.getLayout().x + delta + tx);
+                kx = width / ((bottom.depth - 1) || 1);
+                eachBefore(realRoot, function (node) {
+                    coorY = (node.getLayout().x + tx) * ky;
+                    coorX = orient === 'LR'
+                        ? (node.depth - 1) * kx
+                        : width - (node.depth - 1) * kx;
+                    node.setLayout({x: coorX, y: coorY}, true);
+                });
+            }
+            else if (orient === 'TB' || orient === 'BT') {
+                kx = width / (right.getLayout().x + delta + tx);
+                ky = height / ((bottom.depth - 1) || 1);
+                eachBefore(realRoot, function (node) {
+                    coorX = (node.getLayout().x + tx) * kx;
+                    coorY = orient === 'TB'
+                        ? (node.depth - 1) * ky
+                        : height - (node.depth - 1) * ky;
+                    node.setLayout({x: coorX, y: coorY}, true);
+                });
+            }
+        }
+    } 
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(visualSymbol('tree', 'circle'));
+registerLayout(treeLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function retrieveTargetInfo(payload, validPayloadTypes, seriesModel) {
+    if (payload && indexOf(validPayloadTypes, payload.type) >= 0) {
+        var root = seriesModel.getData().tree.root;
+        var targetNode = payload.targetNode;
+        if (targetNode && root.contains(targetNode)) {
+            return {node: targetNode};
+        }
+
+        var targetNodeId = payload.targetNodeId;
+        if (targetNodeId != null && (targetNode = root.getNodeById(targetNodeId))) {
+            return {node: targetNode};
+        }
+    }
+}
+
+// Not includes the given node at the last item.
+function getPathToRoot(node) {
+    var path = [];
+    while (node) {
+        node = node.parentNode;
+        node && path.push(node);
+    }
+    return path.reverse();
+}
+
+function aboveViewRoot(viewRoot, node) {
+    var viewPath = getPathToRoot(viewRoot);
+    return indexOf(viewPath, node) >= 0;
+}
+
+// From root to the input node (the input node will be included).
+function wrapTreePathInfo(node, seriesModel) {
+    var treePathInfo = [];
+
+    while (node) {
+        var nodeDataIndex = node.dataIndex;
+        treePathInfo.push({
+            name: node.name,
+            dataIndex: nodeDataIndex,
+            value: seriesModel.getRawValue(nodeDataIndex)
+        });
+        node = node.parentNode;
+    }
+
+    treePathInfo.reverse();
+
+    return treePathInfo;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.treemap',
+
+    layoutMode: 'box',
+
+    dependencies: ['grid', 'polar'],
+
+    /**
+     * @type {module:echarts/data/Tree~Node}
+     */
+    _viewRoot: null,
+
+    defaultOption: {
+        // Disable progressive rendering
+        progressive: 0,
+        hoverLayerThreshold: Infinity,
+        // center: ['50%', '50%'],          // not supported in ec3.
+        // size: ['80%', '80%'],            // deprecated, compatible with ec2.
+        left: 'center',
+        top: 'middle',
+        right: null,
+        bottom: null,
+        width: '80%',
+        height: '80%',
+        sort: true,                         // Can be null or false or true
+                                            // (order by desc default, asc not supported yet (strange effect))
+        clipWindow: 'origin',               // Size of clipped window when zooming. 'origin' or 'fullscreen'
+        squareRatio: 0.5 * (1 + Math.sqrt(5)), // golden ratio
+        leafDepth: null,                    // Nodes on depth from root are regarded as leaves.
+                                            // Count from zero (zero represents only view root).
+        drillDownIcon: '▶',                 // Use html character temporarily because it is complicated
+                                            // to align specialized icon. ▷▶❒❐▼✚
+
+        zoomToNodeRatio: 0.32 * 0.32,       // Be effective when using zoomToNode. Specify the proportion of the
+                                            // target node area in the view area.
+        roam: true,                         // true, false, 'scale' or 'zoom', 'move'.
+        nodeClick: 'zoomToNode',            // Leaf node click behaviour: 'zoomToNode', 'link', false.
+                                            // If leafDepth is set and clicking a node which has children but
+                                            // be on left depth, the behaviour would be changing root. Otherwise
+                                            // use behavious defined above.
+        animation: true,
+        animationDurationUpdate: 900,
+        animationEasing: 'quinticInOut',
+        breadcrumb: {
+            show: true,
+            height: 22,
+            left: 'center',
+            top: 'bottom',
+            // right
+            // bottom
+            emptyItemWidth: 25,             // Width of empty node.
+            itemStyle: {
+                color: 'rgba(0,0,0,0.7)', //'#5793f3',
+                borderColor: 'rgba(255,255,255,0.7)',
+                borderWidth: 1,
+                shadowColor: 'rgba(150,150,150,1)',
+                shadowBlur: 3,
+                shadowOffsetX: 0,
+                shadowOffsetY: 0,
+                textStyle: {
+                    color: '#fff'
+                }
+            },
+            emphasis: {
+                textStyle: {}
+            }
+        },
+        label: {
+            show: true,
+            // Do not use textDistance, for ellipsis rect just the same as treemap node rect.
+            distance: 0,
+            padding: 5,
+            position: 'inside', // Can be [5, '5%'] or position stirng like 'insideTopLeft', ...
+            // formatter: null,
+            color: '#fff',
+            ellipsis: true
+            // align
+            // verticalAlign
+        },
+        upperLabel: {                   // Label when node is parent.
+            show: false,
+            position: [0, '50%'],
+            height: 20,
+            // formatter: null,
+            color: '#fff',
+            ellipsis: true,
+            // align: null,
+            verticalAlign: 'middle'
+        },
+        itemStyle: {
+            color: null,            // Can be 'none' if not necessary.
+            colorAlpha: null,       // Can be 'none' if not necessary.
+            colorSaturation: null,  // Can be 'none' if not necessary.
+            borderWidth: 0,
+            gapWidth: 0,
+            borderColor: '#fff',
+            borderColorSaturation: null // If specified, borderColor will be ineffective, and the
+                                        // border color is evaluated by color of current node and
+                                        // borderColorSaturation.
+        },
+        emphasis: {
+            upperLabel: {
+                show: true,
+                position: [0, '50%'],
+                color: '#fff',
+                ellipsis: true,
+                verticalAlign: 'middle'
+            }
+        },
+
+        visualDimension: 0,                 // Can be 0, 1, 2, 3.
+        visualMin: null,
+        visualMax: null,
+
+        color: [],                  // + treemapSeries.color should not be modified. Please only modified
+                                    // level[n].color (if necessary).
+                                    // + Specify color list of each level. level[0].color would be global
+                                    // color list if not specified. (see method `setDefault`).
+                                    // + But set as a empty array to forbid fetch color from global palette
+                                    // when using nodeModel.get('color'), otherwise nodes on deep level
+                                    // will always has color palette set and are not able to inherit color
+                                    // from parent node.
+                                    // + TreemapSeries.color can not be set as 'none', otherwise effect
+                                    // legend color fetching (see seriesColor.js).
+        colorAlpha: null,           // Array. Specify color alpha range of each level, like [0.2, 0.8]
+        colorSaturation: null,      // Array. Specify color saturation of each level, like [0.2, 0.5]
+        colorMappingBy: 'index',    // 'value' or 'index' or 'id'.
+        visibleMin: 10,             // If area less than this threshold (unit: pixel^2), node will not
+                                    // be rendered. Only works when sort is 'asc' or 'desc'.
+        childrenVisibleMin: null,   // If area of a node less than this threshold (unit: pixel^2),
+                                    // grandchildren will not show.
+                                    // Why grandchildren? If not grandchildren but children,
+                                    // some siblings show children and some not,
+                                    // the appearance may be mess and not consistent,
+        levels: []                  // Each item: {
+                                    //     visibleMin, itemStyle, visualDimension, label
+                                    // }
+        // data: {
+        //      value: [],
+        //      children: [],
+        //      link: 'http://xxx.xxx.xxx',
+        //      target: 'blank' or 'self'
+        // }
+    },
+
+    /**
+     * @override
+     */
+    getInitialData: function (option, ecModel) {
+        // Create a virtual root.
+        var root = {name: option.name, children: option.data};
+
+        completeTreeValue(root);
+
+        var levels = option.levels || [];
+
+        levels = option.levels = setDefault(levels, ecModel);
+
+        var treeOption = {};
+
+        treeOption.levels = levels;
+
+        // Make sure always a new tree is created when setOption,
+        // in TreemapView, we check whether oldTree === newTree
+        // to choose mappings approach among old shapes and new shapes.
+        return Tree.createTree(root, this, treeOption).data;
+    },
+
+    optionUpdated: function () {
+        this.resetViewRoot();
+    },
+
+    /**
+     * @override
+     * @param {number} dataIndex
+     * @param {boolean} [mutipleSeries=false]
+     */
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var value = this.getRawValue(dataIndex);
+        var formattedValue = isArray(value)
+            ? addCommas(value[0]) : addCommas(value);
+        var name = data.getName(dataIndex);
+
+        return encodeHTML(name + ': ' + formattedValue);
+    },
+
+    /**
+     * Add tree path to tooltip param
+     *
+     * @override
+     * @param {number} dataIndex
+     * @return {Object}
+     */
+    getDataParams: function (dataIndex) {
+        var params = SeriesModel.prototype.getDataParams.apply(this, arguments);
+
+        var node = this.getData().tree.getNodeByDataIndex(dataIndex);
+        params.treePathInfo = wrapTreePathInfo(node, this);
+
+        return params;
+    },
+
+    /**
+     * @public
+     * @param {Object} layoutInfo {
+     *                                x: containerGroup x
+     *                                y: containerGroup y
+     *                                width: containerGroup width
+     *                                height: containerGroup height
+     *                            }
+     */
+    setLayoutInfo: function (layoutInfo) {
+        /**
+         * @readOnly
+         * @type {Object}
+         */
+        this.layoutInfo = this.layoutInfo || {};
+        extend(this.layoutInfo, layoutInfo);
+    },
+
+    /**
+     * @param  {string} id
+     * @return {number} index
+     */
+    mapIdToIndex: function (id) {
+        // A feature is implemented:
+        // index is monotone increasing with the sequence of
+        // input id at the first time.
+        // This feature can make sure that each data item and its
+        // mapped color have the same index between data list and
+        // color list at the beginning, which is useful for user
+        // to adjust data-color mapping.
+
+        /**
+         * @private
+         * @type {Object}
+         */
+        var idIndexMap = this._idIndexMap;
+
+        if (!idIndexMap) {
+            idIndexMap = this._idIndexMap = createHashMap();
+            /**
+             * @private
+             * @type {number}
+             */
+            this._idIndexMapCount = 0;
+        }
+
+        var index = idIndexMap.get(id);
+        if (index == null) {
+            idIndexMap.set(id, index = this._idIndexMapCount++);
+        }
+
+        return index;
+    },
+
+    getViewRoot: function () {
+        return this._viewRoot;
+    },
+
+    /**
+     * @param {module:echarts/data/Tree~Node} [viewRoot]
+     */
+    resetViewRoot: function (viewRoot) {
+        viewRoot
+            ? (this._viewRoot = viewRoot)
+            : (viewRoot = this._viewRoot);
+
+        var root = this.getRawData().tree.root;
+
+        if (!viewRoot
+            || (viewRoot !== root && !root.contains(viewRoot))
+        ) {
+            this._viewRoot = root;
+        }
+    }
+});
+
+/**
+ * @param {Object} dataNode
+ */
+function completeTreeValue(dataNode) {
+    // Postorder travel tree.
+    // If value of none-leaf node is not set,
+    // calculate it by suming up the value of all children.
+    var sum = 0;
+
+    each$1(dataNode.children, function (child) {
+
+        completeTreeValue(child);
+
+        var childValue = child.value;
+        isArray(childValue) && (childValue = childValue[0]);
+
+        sum += childValue;
+    });
+
+    var thisValue = dataNode.value;
+    if (isArray(thisValue)) {
+        thisValue = thisValue[0];
+    }
+
+    if (thisValue == null || isNaN(thisValue)) {
+        thisValue = sum;
+    }
+    // Value should not less than 0.
+    if (thisValue < 0) {
+        thisValue = 0;
+    }
+
+    isArray(dataNode.value)
+        ? (dataNode.value[0] = thisValue)
+        : (dataNode.value = thisValue);
+}
+
+/**
+ * set default to level configuration
+ */
+function setDefault(levels, ecModel) {
+    var globalColorList = ecModel.get('color');
+
+    if (!globalColorList) {
+        return;
+    }
+
+    levels = levels || [];
+    var hasColorDefine;
+    each$1(levels, function (levelDefine) {
+        var model = new Model(levelDefine);
+        var modelColor = model.get('color');
+
+        if (model.get('itemStyle.color')
+            || (modelColor && modelColor !== 'none')
+        ) {
+            hasColorDefine = true;
+        }
+    });
+
+    if (!hasColorDefine) {
+        var level0 = levels[0] || (levels[0] = {});
+        level0.color = globalColorList.slice();
+    }
+
+    return levels;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TEXT_PADDING = 8;
+var ITEM_GAP = 8;
+var ARRAY_LENGTH = 5;
+
+function Breadcrumb(containerGroup) {
+    /**
+     * @private
+     * @type {module:zrender/container/Group}
+     */
+    this.group = new Group();
+
+    containerGroup.add(this.group);
+}
+
+Breadcrumb.prototype = {
+
+    constructor: Breadcrumb,
+
+    render: function (seriesModel, api, targetNode, onSelect) {
+        var model = seriesModel.getModel('breadcrumb');
+        var thisGroup = this.group;
+
+        thisGroup.removeAll();
+
+        if (!model.get('show') || !targetNode) {
+            return;
+        }
+
+        var normalStyleModel = model.getModel('itemStyle');
+        // var emphasisStyleModel = model.getModel('emphasis.itemStyle');
+        var textStyleModel = normalStyleModel.getModel('textStyle');
+
+        var layoutParam = {
+            pos: {
+                left: model.get('left'),
+                right: model.get('right'),
+                top: model.get('top'),
+                bottom: model.get('bottom')
+            },
+            box: {
+                width: api.getWidth(),
+                height: api.getHeight()
+            },
+            emptyItemWidth: model.get('emptyItemWidth'),
+            totalWidth: 0,
+            renderList: []
+        };
+
+        this._prepare(targetNode, layoutParam, textStyleModel);
+        this._renderContent(seriesModel, layoutParam, normalStyleModel, textStyleModel, onSelect);
+
+        positionElement(thisGroup, layoutParam.pos, layoutParam.box);
+    },
+
+    /**
+     * Prepare render list and total width
+     * @private
+     */
+    _prepare: function (targetNode, layoutParam, textStyleModel) {
+        for (var node = targetNode; node; node = node.parentNode) {
+            var text = node.getModel().get('name');
+            var textRect = textStyleModel.getTextRect(text);
+            var itemWidth = Math.max(
+                textRect.width + TEXT_PADDING * 2,
+                layoutParam.emptyItemWidth
+            );
+            layoutParam.totalWidth += itemWidth + ITEM_GAP;
+            layoutParam.renderList.push({node: node, text: text, width: itemWidth});
+        }
+    },
+
+    /**
+     * @private
+     */
+    _renderContent: function (
+        seriesModel, layoutParam, normalStyleModel, textStyleModel, onSelect
+    ) {
+        // Start rendering.
+        var lastX = 0;
+        var emptyItemWidth = layoutParam.emptyItemWidth;
+        var height = seriesModel.get('breadcrumb.height');
+        var availableSize = getAvailableSize(layoutParam.pos, layoutParam.box);
+        var totalWidth = layoutParam.totalWidth;
+        var renderList = layoutParam.renderList;
+
+        for (var i = renderList.length - 1; i >= 0; i--) {
+            var item = renderList[i];
+            var itemNode = item.node;
+            var itemWidth = item.width;
+            var text = item.text;
+
+            // Hdie text and shorten width if necessary.
+            if (totalWidth > availableSize.width) {
+                totalWidth -= itemWidth - emptyItemWidth;
+                itemWidth = emptyItemWidth;
+                text = null;
+            }
+
+            var el = new Polygon({
+                shape: {
+                    points: makeItemPoints(
+                        lastX, 0, itemWidth, height,
+                        i === renderList.length - 1, i === 0
+                    )
+                },
+                style: defaults(
+                    normalStyleModel.getItemStyle(),
+                    {
+                        lineJoin: 'bevel',
+                        text: text,
+                        textFill: textStyleModel.getTextColor(),
+                        textFont: textStyleModel.getFont()
+                    }
+                ),
+                z: 10,
+                onclick: curry(onSelect, itemNode)
+            });
+            this.group.add(el);
+
+            packEventData(el, seriesModel, itemNode);
+
+            lastX += itemWidth + ITEM_GAP;
+        }
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this.group.removeAll();
+    }
+};
+
+function makeItemPoints(x, y, itemWidth, itemHeight, head, tail) {
+    var points = [
+        [head ? x : x - ARRAY_LENGTH, y],
+        [x + itemWidth, y],
+        [x + itemWidth, y + itemHeight],
+        [head ? x : x - ARRAY_LENGTH, y + itemHeight]
+    ];
+    !tail && points.splice(2, 0, [x + itemWidth + ARRAY_LENGTH, y + itemHeight / 2]);
+    !head && points.push([x, y + itemHeight / 2]);
+    return points;
+}
+
+// Package custom mouse event.
+function packEventData(el, seriesModel, itemNode) {
+    el.eventData = {
+        componentType: 'series',
+        componentSubType: 'treemap',
+        seriesIndex: seriesModel.componentIndex,
+        seriesName: seriesModel.name,
+        seriesType: 'treemap',
+        selfType: 'breadcrumb', // Distinguish with click event on treemap node.
+        nodeData: {
+            dataIndex: itemNode && itemNode.dataIndex,
+            name: itemNode && itemNode.name
+        },
+        treePathInfo: itemNode && wrapTreePathInfo(itemNode, seriesModel)
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {number} [time=500] Time in ms
+ * @param {string} [easing='linear']
+ * @param {number} [delay=0]
+ * @param {Function} [callback]
+ *
+ * @example
+ *  // Animate position
+ *  animation
+ *      .createWrap()
+ *      .add(el1, {position: [10, 10]})
+ *      .add(el2, {shape: {width: 500}, style: {fill: 'red'}}, 400)
+ *      .done(function () { // done })
+ *      .start('cubicOut');
+ */
+function createWrap() {
+
+    var storage = [];
+    var elExistsMap = {};
+    var doneCallback;
+
+    return {
+
+        /**
+         * Caution: a el can only be added once, otherwise 'done'
+         * might not be called. This method checks this (by el.id),
+         * suppresses adding and returns false when existing el found.
+         *
+         * @param {modele:zrender/Element} el
+         * @param {Object} target
+         * @param {number} [time=500]
+         * @param {number} [delay=0]
+         * @param {string} [easing='linear']
+         * @return {boolean} Whether adding succeeded.
+         *
+         * @example
+         *     add(el, target, time, delay, easing);
+         *     add(el, target, time, easing);
+         *     add(el, target, time);
+         *     add(el, target);
+         */
+        add: function (el, target, time, delay, easing) {
+            if (isString(delay)) {
+                easing = delay;
+                delay = 0;
+            }
+
+            if (elExistsMap[el.id]) {
+                return false;
+            }
+            elExistsMap[el.id] = 1;
+
+            storage.push(
+                {el: el, target: target, time: time, delay: delay, easing: easing}
+            );
+
+            return true;
+        },
+
+        /**
+         * Only execute when animation finished. Will not execute when any
+         * of 'stop' or 'stopAnimation' called.
+         *
+         * @param {Function} callback
+         */
+        done: function (callback) {
+            doneCallback = callback;
+            return this;
+        },
+
+        /**
+         * Will stop exist animation firstly.
+         */
+        start: function () {
+            var count = storage.length;
+
+            for (var i = 0, len = storage.length; i < len; i++) {
+                var item = storage[i];
+                item.el.animateTo(item.target, item.time, item.delay, item.easing, done);
+            }
+
+            return this;
+
+            function done() {
+                count--;
+                if (!count) {
+                    storage.length = 0;
+                    elExistsMap = {};
+                    doneCallback && doneCallback();
+                }
+            }
+        }
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$1 = bind;
+var Group$2 = Group;
+var Rect$1 = Rect;
+var each$8 = each$1;
+
+var DRAG_THRESHOLD = 3;
+var PATH_LABEL_NOAMAL = ['label'];
+var PATH_LABEL_EMPHASIS = ['emphasis', 'label'];
+var PATH_UPPERLABEL_NORMAL = ['upperLabel'];
+var PATH_UPPERLABEL_EMPHASIS = ['emphasis', 'upperLabel'];
+var Z_BASE = 10; // Should bigger than every z.
+var Z_BG = 1;
+var Z_CONTENT = 2;
+
+var getItemStyleEmphasis = makeStyleMapper([
+    ['fill', 'color'],
+    // `borderColor` and `borderWidth` has been occupied,
+    // so use `stroke` to indicate the stroke of the rect.
+    ['stroke', 'strokeColor'],
+    ['lineWidth', 'strokeWidth'],
+    ['shadowBlur'],
+    ['shadowOffsetX'],
+    ['shadowOffsetY'],
+    ['shadowColor']
+]);
+var getItemStyleNormal = function (model) {
+    // Normal style props should include emphasis style props.
+    var itemStyle = getItemStyleEmphasis(model);
+    // Clear styles set by emphasis.
+    itemStyle.stroke = itemStyle.fill = itemStyle.lineWidth = null;
+    return itemStyle;
+};
+
+extendChartView({
+
+    type: 'treemap',
+
+    /**
+     * @override
+     */
+    init: function (o, api) {
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this._containerGroup;
+
+        /**
+         * @private
+         * @type {Object.<string, Array.<module:zrender/container/Group>>}
+         */
+        this._storage = createStorage();
+
+        /**
+         * @private
+         * @type {module:echarts/data/Tree}
+         */
+        this._oldTree;
+
+        /**
+         * @private
+         * @type {module:echarts/chart/treemap/Breadcrumb}
+         */
+        this._breadcrumb;
+
+        /**
+         * @private
+         * @type {module:echarts/component/helper/RoamController}
+         */
+        this._controller;
+
+        /**
+         * 'ready', 'animating'
+         * @private
+         */
+        this._state = 'ready';
+    },
+
+    /**
+     * @override
+     */
+    render: function (seriesModel, ecModel, api, payload) {
+
+        var models = ecModel.findComponents({
+            mainType: 'series', subType: 'treemap', query: payload
+        });
+        if (indexOf(models, seriesModel) < 0) {
+            return;
+        }
+
+        this.seriesModel = seriesModel;
+        this.api = api;
+        this.ecModel = ecModel;
+
+        var types = ['treemapZoomToNode', 'treemapRootToNode'];
+        var targetInfo = retrieveTargetInfo(payload, types, seriesModel);
+        var payloadType = payload && payload.type;
+        var layoutInfo = seriesModel.layoutInfo;
+        var isInit = !this._oldTree;
+        var thisStorage = this._storage;
+
+        // Mark new root when action is treemapRootToNode.
+        var reRoot = (payloadType === 'treemapRootToNode' && targetInfo && thisStorage)
+            ? {
+                rootNodeGroup: thisStorage.nodeGroup[targetInfo.node.getRawIndex()],
+                direction: payload.direction
+            }
+            : null;
+
+        var containerGroup = this._giveContainerGroup(layoutInfo);
+
+        var renderResult = this._doRender(containerGroup, seriesModel, reRoot);
+        (
+            !isInit && (
+                !payloadType
+                || payloadType === 'treemapZoomToNode'
+                || payloadType === 'treemapRootToNode'
+            )
+        )
+            ? this._doAnimation(containerGroup, renderResult, seriesModel, reRoot)
+            : renderResult.renderFinally();
+
+        this._resetController(api);
+
+        this._renderBreadcrumb(seriesModel, api, targetInfo);
+    },
+
+    /**
+     * @private
+     */
+    _giveContainerGroup: function (layoutInfo) {
+        var containerGroup = this._containerGroup;
+        if (!containerGroup) {
+            // FIXME
+            // 加一层containerGroup是为了clip，但是现在clip功能并没有实现。
+            containerGroup = this._containerGroup = new Group$2();
+            this._initEvents(containerGroup);
+            this.group.add(containerGroup);
+        }
+        containerGroup.attr('position', [layoutInfo.x, layoutInfo.y]);
+
+        return containerGroup;
+    },
+
+    /**
+     * @private
+     */
+    _doRender: function (containerGroup, seriesModel, reRoot) {
+        var thisTree = seriesModel.getData().tree;
+        var oldTree = this._oldTree;
+
+        // Clear last shape records.
+        var lastsForAnimation = createStorage();
+        var thisStorage = createStorage();
+        var oldStorage = this._storage;
+        var willInvisibleEls = [];
+        var doRenderNode = curry(
+            renderNode, seriesModel,
+            thisStorage, oldStorage, reRoot,
+            lastsForAnimation, willInvisibleEls
+        );
+
+        // Notice: when thisTree and oldTree are the same tree (see list.cloneShallow),
+        // the oldTree is actually losted, so we can not find all of the old graphic
+        // elements from tree. So we use this stragegy: make element storage, move
+        // from old storage to new storage, clear old storage.
+
+        dualTravel(
+            thisTree.root ? [thisTree.root] : [],
+            (oldTree && oldTree.root) ? [oldTree.root] : [],
+            containerGroup,
+            thisTree === oldTree || !oldTree,
+            0
+        );
+
+        // Process all removing.
+        var willDeleteEls = clearStorage(oldStorage);
+
+        this._oldTree = thisTree;
+        this._storage = thisStorage;
+
+        return {
+            lastsForAnimation: lastsForAnimation,
+            willDeleteEls: willDeleteEls,
+            renderFinally: renderFinally
+        };
+
+        function dualTravel(thisViewChildren, oldViewChildren, parentGroup, sameTree, depth) {
+            // When 'render' is triggered by action,
+            // 'this' and 'old' may be the same tree,
+            // we use rawIndex in that case.
+            if (sameTree) {
+                oldViewChildren = thisViewChildren;
+                each$8(thisViewChildren, function (child, index) {
+                    !child.isRemoved() && processNode(index, index);
+                });
+            }
+            // Diff hierarchically (diff only in each subtree, but not whole).
+            // because, consistency of view is important.
+            else {
+                (new DataDiffer(oldViewChildren, thisViewChildren, getKey, getKey))
+                    .add(processNode)
+                    .update(processNode)
+                    .remove(curry(processNode, null))
+                    .execute();
+            }
+
+            function getKey(node) {
+                // Identify by name or raw index.
+                return node.getId();
+            }
+
+            function processNode(newIndex, oldIndex) {
+                var thisNode = newIndex != null ? thisViewChildren[newIndex] : null;
+                var oldNode = oldIndex != null ? oldViewChildren[oldIndex] : null;
+
+                var group = doRenderNode(thisNode, oldNode, parentGroup, depth);
+
+                group && dualTravel(
+                    thisNode && thisNode.viewChildren || [],
+                    oldNode && oldNode.viewChildren || [],
+                    group,
+                    sameTree,
+                    depth + 1
+                );
+            }
+        }
+
+        function clearStorage(storage) {
+            var willDeleteEls = createStorage();
+            storage && each$8(storage, function (store, storageName) {
+                var delEls = willDeleteEls[storageName];
+                each$8(store, function (el) {
+                    el && (delEls.push(el), el.__tmWillDelete = 1);
+                });
+            });
+            return willDeleteEls;
+        }
+
+        function renderFinally() {
+            each$8(willDeleteEls, function (els) {
+                each$8(els, function (el) {
+                    el.parent && el.parent.remove(el);
+                });
+            });
+            each$8(willInvisibleEls, function (el) {
+                el.invisible = true;
+                // Setting invisible is for optimizing, so no need to set dirty,
+                // just mark as invisible.
+                el.dirty();
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _doAnimation: function (containerGroup, renderResult, seriesModel, reRoot) {
+        if (!seriesModel.get('animation')) {
+            return;
+        }
+
+        var duration = seriesModel.get('animationDurationUpdate');
+        var easing = seriesModel.get('animationEasing');
+        var animationWrap = createWrap();
+
+        // Make delete animations.
+        each$8(renderResult.willDeleteEls, function (store, storageName) {
+            each$8(store, function (el, rawIndex) {
+                if (el.invisible) {
+                    return;
+                }
+
+                var parent = el.parent; // Always has parent, and parent is nodeGroup.
+                var target;
+
+                if (reRoot && reRoot.direction === 'drillDown') {
+                    target = parent === reRoot.rootNodeGroup
+                        // This is the content element of view root.
+                        // Only `content` will enter this branch, because
+                        // `background` and `nodeGroup` will not be deleted.
+                        ? {
+                            shape: {
+                                x: 0,
+                                y: 0,
+                                width: parent.__tmNodeWidth,
+                                height: parent.__tmNodeHeight
+                            },
+                            style: {
+                                opacity: 0
+                            }
+                        }
+                        // Others.
+                        : {style: {opacity: 0}};
+                }
+                else {
+                    var targetX = 0;
+                    var targetY = 0;
+
+                    if (!parent.__tmWillDelete) {
+                        // Let node animate to right-bottom corner, cooperating with fadeout,
+                        // which is appropriate for user understanding.
+                        // Divided by 2 for reRoot rolling up effect.
+                        targetX = parent.__tmNodeWidth / 2;
+                        targetY = parent.__tmNodeHeight / 2;
+                    }
+
+                    target = storageName === 'nodeGroup'
+                        ? {position: [targetX, targetY], style: {opacity: 0}}
+                        : {
+                            shape: {x: targetX, y: targetY, width: 0, height: 0},
+                            style: {opacity: 0}
+                        };
+                }
+
+                target && animationWrap.add(el, target, duration, easing);
+            });
+        });
+
+        // Make other animations
+        each$8(this._storage, function (store, storageName) {
+            each$8(store, function (el, rawIndex) {
+                var last = renderResult.lastsForAnimation[storageName][rawIndex];
+                var target = {};
+
+                if (!last) {
+                    return;
+                }
+
+                if (storageName === 'nodeGroup') {
+                    if (last.old) {
+                        target.position = el.position.slice();
+                        el.attr('position', last.old);
+                    }
+                }
+                else {
+                    if (last.old) {
+                        target.shape = extend({}, el.shape);
+                        el.setShape(last.old);
+                    }
+
+                    if (last.fadein) {
+                        el.setStyle('opacity', 0);
+                        target.style = {opacity: 1};
+                    }
+                    // When animation is stopped for succedent animation starting,
+                    // el.style.opacity might not be 1
+                    else if (el.style.opacity !== 1) {
+                        target.style = {opacity: 1};
+                    }
+                }
+
+                animationWrap.add(el, target, duration, easing);
+            });
+        }, this);
+
+        this._state = 'animating';
+
+        animationWrap
+            .done(bind$1(function () {
+                this._state = 'ready';
+                renderResult.renderFinally();
+            }, this))
+            .start();
+    },
+
+    /**
+     * @private
+     */
+    _resetController: function (api) {
+        var controller = this._controller;
+
+        // Init controller.
+        if (!controller) {
+            controller = this._controller = new RoamController(api.getZr());
+            controller.enable(this.seriesModel.get('roam'));
+            controller.on('pan', bind$1(this._onPan, this));
+            controller.on('zoom', bind$1(this._onZoom, this));
+        }
+
+        var rect = new BoundingRect(0, 0, api.getWidth(), api.getHeight());
+        controller.setPointerChecker(function (e, x, y) {
+            return rect.contain(x, y);
+        });
+    },
+
+    /**
+     * @private
+     */
+    _clearController: function () {
+        var controller = this._controller;
+        if (controller) {
+            controller.dispose();
+            controller = null;
+        }
+    },
+
+    /**
+     * @private
+     */
+    _onPan: function (dx, dy) {
+        if (this._state !== 'animating'
+            && (Math.abs(dx) > DRAG_THRESHOLD || Math.abs(dy) > DRAG_THRESHOLD)
+        ) {
+            // These param must not be cached.
+            var root = this.seriesModel.getData().tree.root;
+
+            if (!root) {
+                return;
+            }
+
+            var rootLayout = root.getLayout();
+
+            if (!rootLayout) {
+                return;
+            }
+
+            this.api.dispatchAction({
+                type: 'treemapMove',
+                from: this.uid,
+                seriesId: this.seriesModel.id,
+                rootRect: {
+                    x: rootLayout.x + dx, y: rootLayout.y + dy,
+                    width: rootLayout.width, height: rootLayout.height
+                }
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _onZoom: function (scale, mouseX, mouseY) {
+        if (this._state !== 'animating') {
+            // These param must not be cached.
+            var root = this.seriesModel.getData().tree.root;
+
+            if (!root) {
+                return;
+            }
+
+            var rootLayout = root.getLayout();
+
+            if (!rootLayout) {
+                return;
+            }
+
+            var rect = new BoundingRect(
+                rootLayout.x, rootLayout.y, rootLayout.width, rootLayout.height
+            );
+            var layoutInfo = this.seriesModel.layoutInfo;
+
+            // Transform mouse coord from global to containerGroup.
+            mouseX -= layoutInfo.x;
+            mouseY -= layoutInfo.y;
+
+            // Scale root bounding rect.
+            var m = create$1();
+            translate(m, m, [-mouseX, -mouseY]);
+            scale$1(m, m, [scale, scale]);
+            translate(m, m, [mouseX, mouseY]);
+
+            rect.applyTransform(m);
+
+            this.api.dispatchAction({
+                type: 'treemapRender',
+                from: this.uid,
+                seriesId: this.seriesModel.id,
+                rootRect: {
+                    x: rect.x, y: rect.y,
+                    width: rect.width, height: rect.height
+                }
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _initEvents: function (containerGroup) {
+        containerGroup.on('click', function (e) {
+            if (this._state !== 'ready') {
+                return;
+            }
+
+            var nodeClick = this.seriesModel.get('nodeClick', true);
+
+            if (!nodeClick) {
+                return;
+            }
+
+            var targetInfo = this.findTarget(e.offsetX, e.offsetY);
+
+            if (!targetInfo) {
+                return;
+            }
+
+            var node = targetInfo.node;
+            if (node.getLayout().isLeafRoot) {
+                this._rootToNode(targetInfo);
+            }
+            else {
+                if (nodeClick === 'zoomToNode') {
+                    this._zoomToNode(targetInfo);
+                }
+                else if (nodeClick === 'link') {
+                    var itemModel = node.hostTree.data.getItemModel(node.dataIndex);
+                    var link = itemModel.get('link', true);
+                    var linkTarget = itemModel.get('target', true) || 'blank';
+                    link && window.open(link, linkTarget);
+                }
+            }
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _renderBreadcrumb: function (seriesModel, api, targetInfo) {
+        if (!targetInfo) {
+            targetInfo = seriesModel.get('leafDepth', true) != null
+                ? {node: seriesModel.getViewRoot()}
+                // FIXME
+                // better way?
+                // Find breadcrumb tail on center of containerGroup.
+                : this.findTarget(api.getWidth() / 2, api.getHeight() / 2);
+
+            if (!targetInfo) {
+                targetInfo = {node: seriesModel.getData().tree.root};
+            }
+        }
+
+        (this._breadcrumb || (this._breadcrumb = new Breadcrumb(this.group)))
+            .render(seriesModel, api, targetInfo.node, bind$1(onSelect, this));
+
+        function onSelect(node) {
+            if (this._state !== 'animating') {
+                aboveViewRoot(seriesModel.getViewRoot(), node)
+                    ? this._rootToNode({node: node})
+                    : this._zoomToNode({node: node});
+            }
+        }
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._clearController();
+        this._containerGroup && this._containerGroup.removeAll();
+        this._storage = createStorage();
+        this._state = 'ready';
+        this._breadcrumb && this._breadcrumb.remove();
+    },
+
+    dispose: function () {
+        this._clearController();
+    },
+
+    /**
+     * @private
+     */
+    _zoomToNode: function (targetInfo) {
+        this.api.dispatchAction({
+            type: 'treemapZoomToNode',
+            from: this.uid,
+            seriesId: this.seriesModel.id,
+            targetNode: targetInfo.node
+        });
+    },
+
+    /**
+     * @private
+     */
+    _rootToNode: function (targetInfo) {
+        this.api.dispatchAction({
+            type: 'treemapRootToNode',
+            from: this.uid,
+            seriesId: this.seriesModel.id,
+            targetNode: targetInfo.node
+        });
+    },
+
+    /**
+     * @public
+     * @param {number} x Global coord x.
+     * @param {number} y Global coord y.
+     * @return {Object} info If not found, return undefined;
+     * @return {number} info.node Target node.
+     * @return {number} info.offsetX x refer to target node.
+     * @return {number} info.offsetY y refer to target node.
+     */
+    findTarget: function (x, y) {
+        var targetInfo;
+        var viewRoot = this.seriesModel.getViewRoot();
+
+        viewRoot.eachNode({attr: 'viewChildren', order: 'preorder'}, function (node) {
+            var bgEl = this._storage.background[node.getRawIndex()];
+            // If invisible, there might be no element.
+            if (bgEl) {
+                var point = bgEl.transformCoordToLocal(x, y);
+                var shape = bgEl.shape;
+
+                // For performance consideration, dont use 'getBoundingRect'.
+                if (shape.x <= point[0]
+                    && point[0] <= shape.x + shape.width
+                    && shape.y <= point[1]
+                    && point[1] <= shape.y + shape.height
+                ) {
+                    targetInfo = {node: node, offsetX: point[0], offsetY: point[1]};
+                }
+                else {
+                    return false; // Suppress visit subtree.
+                }
+            }
+        }, this);
+
+        return targetInfo;
+    }
+
+});
+
+/**
+ * @inner
+ */
+function createStorage() {
+    return {nodeGroup: [], background: [], content: []};
+}
+
+/**
+ * @inner
+ * @return Return undefined means do not travel further.
+ */
+function renderNode(
+    seriesModel, thisStorage, oldStorage, reRoot,
+    lastsForAnimation, willInvisibleEls,
+    thisNode, oldNode, parentGroup, depth
+) {
+    // Whether under viewRoot.
+    if (!thisNode) {
+        // Deleting nodes will be performed finally. This method just find
+        // element from old storage, or create new element, set them to new
+        // storage, and set styles.
+        return;
+    }
+
+    // -------------------------------------------------------------------
+    // Start of closure variables available in "Procedures in renderNode".
+
+    var thisLayout = thisNode.getLayout();
+
+    if (!thisLayout || !thisLayout.isInView) {
+        return;
+    }
+
+    var thisWidth = thisLayout.width;
+    var thisHeight = thisLayout.height;
+    var borderWidth = thisLayout.borderWidth;
+    var thisInvisible = thisLayout.invisible;
+
+    var thisRawIndex = thisNode.getRawIndex();
+    var oldRawIndex = oldNode && oldNode.getRawIndex();
+
+    var thisViewChildren = thisNode.viewChildren;
+    var upperHeight = thisLayout.upperHeight;
+    var isParent = thisViewChildren && thisViewChildren.length;
+    var itemStyleNormalModel = thisNode.getModel('itemStyle');
+    var itemStyleEmphasisModel = thisNode.getModel('emphasis.itemStyle');
+
+    // End of closure ariables available in "Procedures in renderNode".
+    // -----------------------------------------------------------------
+
+    // Node group
+    var group = giveGraphic('nodeGroup', Group$2);
+
+    if (!group) {
+        return;
+    }
+
+    parentGroup.add(group);
+    // x,y are not set when el is above view root.
+    group.attr('position', [thisLayout.x || 0, thisLayout.y || 0]);
+    group.__tmNodeWidth = thisWidth;
+    group.__tmNodeHeight = thisHeight;
+
+    if (thisLayout.isAboveViewRoot) {
+        return group;
+    }
+
+    // Background
+    var bg = giveGraphic('background', Rect$1, depth, Z_BG);
+    bg && renderBackground(group, bg, isParent && thisLayout.upperHeight);
+
+    // No children, render content.
+    if (!isParent) {
+        var content = giveGraphic('content', Rect$1, depth, Z_CONTENT);
+        content && renderContent(group, content);
+    }
+
+    return group;
+
+    // ----------------------------
+    // | Procedures in renderNode |
+    // ----------------------------
+
+    function renderBackground(group, bg, useUpperLabel) {
+        // For tooltip.
+        bg.dataIndex = thisNode.dataIndex;
+        bg.seriesIndex = seriesModel.seriesIndex;
+
+        bg.setShape({x: 0, y: 0, width: thisWidth, height: thisHeight});
+        var visualBorderColor = thisNode.getVisual('borderColor', true);
+        var emphasisBorderColor = itemStyleEmphasisModel.get('borderColor');
+
+        updateStyle(bg, function () {
+            var normalStyle = getItemStyleNormal(itemStyleNormalModel);
+            normalStyle.fill = visualBorderColor;
+            var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
+            emphasisStyle.fill = emphasisBorderColor;
+
+            if (useUpperLabel) {
+                var upperLabelWidth = thisWidth - 2 * borderWidth;
+
+                prepareText(
+                    normalStyle, emphasisStyle, visualBorderColor, upperLabelWidth, upperHeight,
+                    {x: borderWidth, y: 0, width: upperLabelWidth, height: upperHeight}
+                );
+            }
+            // For old bg.
+            else {
+                normalStyle.text = emphasisStyle.text = null;
+            }
+
+            bg.setStyle(normalStyle);
+            setHoverStyle(bg, emphasisStyle);
+        });
+
+        group.add(bg);
+    }
+
+    function renderContent(group, content) {
+        // For tooltip.
+        content.dataIndex = thisNode.dataIndex;
+        content.seriesIndex = seriesModel.seriesIndex;
+
+        var contentWidth = Math.max(thisWidth - 2 * borderWidth, 0);
+        var contentHeight = Math.max(thisHeight - 2 * borderWidth, 0);
+
+        content.culling = true;
+        content.setShape({
+            x: borderWidth,
+            y: borderWidth,
+            width: contentWidth,
+            height: contentHeight
+        });
+
+        var visualColor = thisNode.getVisual('color', true);
+        updateStyle(content, function () {
+            var normalStyle = getItemStyleNormal(itemStyleNormalModel);
+            normalStyle.fill = visualColor;
+            var emphasisStyle = getItemStyleEmphasis(itemStyleEmphasisModel);
+
+            prepareText(normalStyle, emphasisStyle, visualColor, contentWidth, contentHeight);
+
+            content.setStyle(normalStyle);
+            setHoverStyle(content, emphasisStyle);
+        });
+
+        group.add(content);
+    }
+
+    function updateStyle(element, cb) {
+        if (!thisInvisible) {
+            // If invisible, do not set visual, otherwise the element will
+            // change immediately before animation. We think it is OK to
+            // remain its origin color when moving out of the view window.
+            cb();
+
+            if (!element.__tmWillVisible) {
+                element.invisible = false;
+            }
+        }
+        else {
+            // Delay invisible setting utill animation finished,
+            // avoid element vanish suddenly before animation.
+            !element.invisible && willInvisibleEls.push(element);
+        }
+    }
+
+    function prepareText(normalStyle, emphasisStyle, visualColor, width, height, upperLabelRect) {
+        var nodeModel = thisNode.getModel();
+        var text = retrieve(
+            seriesModel.getFormattedLabel(
+                thisNode.dataIndex, 'normal', null, null, upperLabelRect ? 'upperLabel' : 'label'
+            ),
+            nodeModel.get('name')
+        );
+        if (!upperLabelRect && thisLayout.isLeafRoot) {
+            var iconChar = seriesModel.get('drillDownIcon', true);
+            text = iconChar ? iconChar + ' ' + text : text;
+        }
+
+        var normalLabelModel = nodeModel.getModel(
+            upperLabelRect ? PATH_UPPERLABEL_NORMAL : PATH_LABEL_NOAMAL
+        );
+        var emphasisLabelModel = nodeModel.getModel(
+            upperLabelRect ? PATH_UPPERLABEL_EMPHASIS : PATH_LABEL_EMPHASIS
+        );
+
+        var isShow = normalLabelModel.getShallow('show');
+
+        setLabelStyle(
+            normalStyle, emphasisStyle, normalLabelModel, emphasisLabelModel,
+            {
+                defaultText: isShow ? text : null,
+                autoColor: visualColor,
+                isRectText: true
+            }
+        );
+
+        upperLabelRect && (normalStyle.textRect = clone(upperLabelRect));
+
+        normalStyle.truncate = (isShow && normalLabelModel.get('ellipsis'))
+            ? {
+                outerWidth: width,
+                outerHeight: height,
+                minChar: 2
+            }
+            : null;
+    }
+
+    function giveGraphic(storageName, Ctor, depth, z) {
+        var element = oldRawIndex != null && oldStorage[storageName][oldRawIndex];
+        var lasts = lastsForAnimation[storageName];
+
+        if (element) {
+            // Remove from oldStorage
+            oldStorage[storageName][oldRawIndex] = null;
+            prepareAnimationWhenHasOld(lasts, element, storageName);
+        }
+        // If invisible and no old element, do not create new element (for optimizing).
+        else if (!thisInvisible) {
+            element = new Ctor({z: calculateZ(depth, z)});
+            element.__tmDepth = depth;
+            element.__tmStorageName = storageName;
+            prepareAnimationWhenNoOld(lasts, element, storageName);
+        }
+
+        // Set to thisStorage
+        return (thisStorage[storageName][thisRawIndex] = element);
+    }
+
+    function prepareAnimationWhenHasOld(lasts, element, storageName) {
+        var lastCfg = lasts[thisRawIndex] = {};
+        lastCfg.old = storageName === 'nodeGroup'
+            ? element.position.slice()
+            : extend({}, element.shape);
+    }
+
+    // If a element is new, we need to find the animation start point carefully,
+    // otherwise it will looks strange when 'zoomToNode'.
+    function prepareAnimationWhenNoOld(lasts, element, storageName) {
+        var lastCfg = lasts[thisRawIndex] = {};
+        var parentNode = thisNode.parentNode;
+
+        if (parentNode && (!reRoot || reRoot.direction === 'drillDown')) {
+            var parentOldX = 0;
+            var parentOldY = 0;
+
+            // New nodes appear from right-bottom corner in 'zoomToNode' animation.
+            // For convenience, get old bounding rect from background.
+            var parentOldBg = lastsForAnimation.background[parentNode.getRawIndex()];
+            if (!reRoot && parentOldBg && parentOldBg.old) {
+                parentOldX = parentOldBg.old.width;
+                parentOldY = parentOldBg.old.height;
+            }
+
+            // When no parent old shape found, its parent is new too,
+            // so we can just use {x:0, y:0}.
+            lastCfg.old = storageName === 'nodeGroup'
+                ? [0, parentOldY]
+                : {x: parentOldX, y: parentOldY, width: 0, height: 0};
+        }
+
+        // Fade in, user can be aware that these nodes are new.
+        lastCfg.fadein = storageName !== 'nodeGroup';
+    }
+}
+
+// We can not set all backgroud with the same z, Because the behaviour of
+// drill down and roll up differ background creation sequence from tree
+// hierarchy sequence, which cause that lowser background element overlap
+// upper ones. So we calculate z based on depth.
+// Moreover, we try to shrink down z interval to [0, 1] to avoid that
+// treemap with large z overlaps other components.
+function calculateZ(depth, zInLevel) {
+    var zb = depth * Z_BASE + zInLevel;
+    return (zb - 1) / zb;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Treemap action
+ */
+
+var noop$1 = function () {};
+
+var actionTypes = [
+    'treemapZoomToNode',
+    'treemapRender',
+    'treemapMove'
+];
+
+for (var i$2 = 0; i$2 < actionTypes.length; i$2++) {
+    registerAction({type: actionTypes[i$2], update: 'updateView'}, noop$1);
+}
+
+registerAction(
+    {type: 'treemapRootToNode', update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'treemap', query: payload},
+            handleRootToNode
+        );
+
+        function handleRootToNode(model, index) {
+            var types = ['treemapZoomToNode', 'treemapRootToNode'];
+            var targetInfo = retrieveTargetInfo(payload, types, model);
+
+            if (targetInfo) {
+                var originViewRoot = model.getViewRoot();
+                if (originViewRoot) {
+                    payload.direction = aboveViewRoot(originViewRoot, targetInfo.node)
+                        ? 'rollUp' : 'drillDown';
+                }
+                model.resetViewRoot(targetInfo.node);
+            }
+        }
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$9 = each$1;
+var isObject$5 = isObject$1;
+
+var CATEGORY_DEFAULT_VISUAL_INDEX = -1;
+
+/**
+ * @param {Object} option
+ * @param {string} [option.type] See visualHandlers.
+ * @param {string} [option.mappingMethod] 'linear' or 'piecewise' or 'category' or 'fixed'
+ * @param {Array.<number>=} [option.dataExtent] [minExtent, maxExtent],
+ *                                              required when mappingMethod is 'linear'
+ * @param {Array.<Object>=} [option.pieceList] [
+ *                                             {value: someValue},
+ *                                             {interval: [min1, max1], visual: {...}},
+ *                                             {interval: [min2, max2]}
+ *                                             ],
+ *                                            required when mappingMethod is 'piecewise'.
+ *                                            Visual for only each piece can be specified.
+ * @param {Array.<string|Object>=} [option.categories] ['cate1', 'cate2']
+ *                                            required when mappingMethod is 'category'.
+ *                                            If no option.categories, categories is set
+ *                                            as [0, 1, 2, ...].
+ * @param {boolean} [option.loop=false] Whether loop mapping when mappingMethod is 'category'.
+ * @param {(Array|Object|*)} [option.visual]  Visual data.
+ *                                            when mappingMethod is 'category',
+ *                                            visual data can be array or object
+ *                                            (like: {cate1: '#222', none: '#fff'})
+ *                                            or primary types (which represents
+ *                                            defualt category visual), otherwise visual
+ *                                            can be array or primary (which will be
+ *                                            normalized to array).
+ *
+ */
+var VisualMapping = function (option) {
+    var mappingMethod = option.mappingMethod;
+    var visualType = option.type;
+
+    /**
+     * @readOnly
+     * @type {Object}
+     */
+    var thisOption = this.option = clone(option);
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    this.type = visualType;
+
+    /**
+     * @readOnly
+     * @type {string}
+     */
+    this.mappingMethod = mappingMethod;
+
+    /**
+     * @private
+     * @type {Function}
+     */
+    this._normalizeData = normalizers[mappingMethod];
+
+    var visualHandler = visualHandlers[visualType];
+
+    /**
+     * @public
+     * @type {Function}
+     */
+    this.applyVisual = visualHandler.applyVisual;
+
+    /**
+     * @public
+     * @type {Function}
+     */
+    this.getColorMapper = visualHandler.getColorMapper;
+
+    /**
+     * @private
+     * @type {Function}
+     */
+    this._doMap = visualHandler._doMap[mappingMethod];
+
+    if (mappingMethod === 'piecewise') {
+        normalizeVisualRange(thisOption);
+        preprocessForPiecewise(thisOption);
+    }
+    else if (mappingMethod === 'category') {
+        thisOption.categories
+            ? preprocessForSpecifiedCategory(thisOption)
+            // categories is ordinal when thisOption.categories not specified,
+            // which need no more preprocess except normalize visual.
+            : normalizeVisualRange(thisOption, true);
+    }
+    else { // mappingMethod === 'linear' or 'fixed'
+        assert$1(mappingMethod !== 'linear' || thisOption.dataExtent);
+        normalizeVisualRange(thisOption);
+    }
+};
+
+VisualMapping.prototype = {
+
+    constructor: VisualMapping,
+
+    mapValueToVisual: function (value) {
+        var normalized = this._normalizeData(value);
+        return this._doMap(normalized, value);
+    },
+
+    getNormalizer: function () {
+        return bind(this._normalizeData, this);
+    }
+};
+
+var visualHandlers = VisualMapping.visualHandlers = {
+
+    color: {
+
+        applyVisual: makeApplyVisual('color'),
+
+        /**
+         * Create a mapper function
+         * @return {Function}
+         */
+        getColorMapper: function () {
+            var thisOption = this.option;
+
+            return bind(
+                thisOption.mappingMethod === 'category'
+                    ? function (value, isNormalized) {
+                        !isNormalized && (value = this._normalizeData(value));
+                        return doMapCategory.call(this, value);
+                    }
+                    : function (value, isNormalized, out) {
+                        // If output rgb array
+                        // which will be much faster and useful in pixel manipulation
+                        var returnRGBArray = !!out;
+                        !isNormalized && (value = this._normalizeData(value));
+                        out = fastLerp(value, thisOption.parsedVisual, out);
+                        return returnRGBArray ? out : stringify(out, 'rgba');
+                    },
+                this
+            );
+        },
+
+        _doMap: {
+            linear: function (normalized) {
+                return stringify(
+                    fastLerp(normalized, this.option.parsedVisual),
+                    'rgba'
+                );
+            },
+            category: doMapCategory,
+            piecewise: function (normalized, value) {
+                var result = getSpecifiedVisual.call(this, value);
+                if (result == null) {
+                    result = stringify(
+                        fastLerp(normalized, this.option.parsedVisual),
+                        'rgba'
+                    );
+                }
+                return result;
+            },
+            fixed: doMapFixed
+        }
+    },
+
+    colorHue: makePartialColorVisualHandler(function (color, value) {
+        return modifyHSL(color, value);
+    }),
+
+    colorSaturation: makePartialColorVisualHandler(function (color, value) {
+        return modifyHSL(color, null, value);
+    }),
+
+    colorLightness: makePartialColorVisualHandler(function (color, value) {
+        return modifyHSL(color, null, null, value);
+    }),
+
+    colorAlpha: makePartialColorVisualHandler(function (color, value) {
+        return modifyAlpha(color, value);
+    }),
+
+    opacity: {
+        applyVisual: makeApplyVisual('opacity'),
+        _doMap: makeDoMap([0, 1])
+    },
+
+    liftZ: {
+        applyVisual: makeApplyVisual('liftZ'),
+        _doMap: {
+            linear: doMapFixed,
+            category: doMapFixed,
+            piecewise: doMapFixed,
+            fixed: doMapFixed
+        }
+    },
+
+    symbol: {
+        applyVisual: function (value, getter, setter) {
+            var symbolCfg = this.mapValueToVisual(value);
+            if (isString(symbolCfg)) {
+                setter('symbol', symbolCfg);
+            }
+            else if (isObject$5(symbolCfg)) {
+                for (var name in symbolCfg) {
+                    if (symbolCfg.hasOwnProperty(name)) {
+                        setter(name, symbolCfg[name]);
+                    }
+                }
+            }
+        },
+        _doMap: {
+            linear: doMapToArray,
+            category: doMapCategory,
+            piecewise: function (normalized, value) {
+                var result = getSpecifiedVisual.call(this, value);
+                if (result == null) {
+                    result = doMapToArray.call(this, normalized);
+                }
+                return result;
+            },
+            fixed: doMapFixed
+        }
+    },
+
+    symbolSize: {
+        applyVisual: makeApplyVisual('symbolSize'),
+        _doMap: makeDoMap([0, 1])
+    }
+};
+
+
+function preprocessForPiecewise(thisOption) {
+    var pieceList = thisOption.pieceList;
+    thisOption.hasSpecialVisual = false;
+
+    each$1(pieceList, function (piece, index) {
+        piece.originIndex = index;
+        // piece.visual is "result visual value" but not
+        // a visual range, so it does not need to be normalized.
+        if (piece.visual != null) {
+            thisOption.hasSpecialVisual = true;
+        }
+    });
+}
+
+function preprocessForSpecifiedCategory(thisOption) {
+    // Hash categories.
+    var categories = thisOption.categories;
+    var visual = thisOption.visual;
+
+    var categoryMap = thisOption.categoryMap = {};
+    each$9(categories, function (cate, index) {
+        categoryMap[cate] = index;
+    });
+
+    // Process visual map input.
+    if (!isArray(visual)) {
+        var visualArr = [];
+
+        if (isObject$1(visual)) {
+            each$9(visual, function (v, cate) {
+                var index = categoryMap[cate];
+                visualArr[index != null ? index : CATEGORY_DEFAULT_VISUAL_INDEX] = v;
+            });
+        }
+        else { // Is primary type, represents default visual.
+            visualArr[CATEGORY_DEFAULT_VISUAL_INDEX] = visual;
+        }
+
+        visual = setVisualToOption(thisOption, visualArr);
+    }
+
+    // Remove categories that has no visual,
+    // then we can mapping them to CATEGORY_DEFAULT_VISUAL_INDEX.
+    for (var i = categories.length - 1; i >= 0; i--) {
+        if (visual[i] == null) {
+            delete categoryMap[categories[i]];
+            categories.pop();
+        }
+    }
+}
+
+function normalizeVisualRange(thisOption, isCategory) {
+    var visual = thisOption.visual;
+    var visualArr = [];
+
+    if (isObject$1(visual)) {
+        each$9(visual, function (v) {
+            visualArr.push(v);
+        });
+    }
+    else if (visual != null) {
+        visualArr.push(visual);
+    }
+
+    var doNotNeedPair = {color: 1, symbol: 1};
+
+    if (!isCategory
+        && visualArr.length === 1
+        && !doNotNeedPair.hasOwnProperty(thisOption.type)
+    ) {
+        // Do not care visualArr.length === 0, which is illegal.
+        visualArr[1] = visualArr[0];
+    }
+
+    setVisualToOption(thisOption, visualArr);
+}
+
+function makePartialColorVisualHandler(applyValue) {
+    return {
+        applyVisual: function (value, getter, setter) {
+            value = this.mapValueToVisual(value);
+            // Must not be array value
+            setter('color', applyValue(getter('color'), value));
+        },
+        _doMap: makeDoMap([0, 1])
+    };
+}
+
+function doMapToArray(normalized) {
+    var visual = this.option.visual;
+    return visual[
+        Math.round(linearMap(normalized, [0, 1], [0, visual.length - 1], true))
+    ] || {};
+}
+
+function makeApplyVisual(visualType) {
+    return function (value, getter, setter) {
+        setter(visualType, this.mapValueToVisual(value));
+    };
+}
+
+function doMapCategory(normalized) {
+    var visual = this.option.visual;
+    return visual[
+        (this.option.loop && normalized !== CATEGORY_DEFAULT_VISUAL_INDEX)
+            ? normalized % visual.length
+            : normalized
+    ];
+}
+
+function doMapFixed() {
+    return this.option.visual[0];
+}
+
+function makeDoMap(sourceExtent) {
+    return {
+        linear: function (normalized) {
+            return linearMap(normalized, sourceExtent, this.option.visual, true);
+        },
+        category: doMapCategory,
+        piecewise: function (normalized, value) {
+            var result = getSpecifiedVisual.call(this, value);
+            if (result == null) {
+                result = linearMap(normalized, sourceExtent, this.option.visual, true);
+            }
+            return result;
+        },
+        fixed: doMapFixed
+    };
+}
+
+function getSpecifiedVisual(value) {
+    var thisOption = this.option;
+    var pieceList = thisOption.pieceList;
+    if (thisOption.hasSpecialVisual) {
+        var pieceIndex = VisualMapping.findPieceIndex(value, pieceList);
+        var piece = pieceList[pieceIndex];
+        if (piece && piece.visual) {
+            return piece.visual[this.type];
+        }
+    }
+}
+
+function setVisualToOption(thisOption, visualArr) {
+    thisOption.visual = visualArr;
+    if (thisOption.type === 'color') {
+        thisOption.parsedVisual = map(visualArr, function (item) {
+            return parse(item);
+        });
+    }
+    return visualArr;
+}
+
+
+/**
+ * Normalizers by mapping methods.
+ */
+var normalizers = {
+
+    linear: function (value) {
+        return linearMap(value, this.option.dataExtent, [0, 1], true);
+    },
+
+    piecewise: function (value) {
+        var pieceList = this.option.pieceList;
+        var pieceIndex = VisualMapping.findPieceIndex(value, pieceList, true);
+        if (pieceIndex != null) {
+            return linearMap(pieceIndex, [0, pieceList.length - 1], [0, 1], true);
+        }
+    },
+
+    category: function (value) {
+        var index = this.option.categories
+            ? this.option.categoryMap[value]
+            : value; // ordinal
+        return index == null ? CATEGORY_DEFAULT_VISUAL_INDEX : index;
+    },
+
+    fixed: noop
+};
+
+
+
+/**
+ * List available visual types.
+ *
+ * @public
+ * @return {Array.<string>}
+ */
+VisualMapping.listVisualTypes = function () {
+    var visualTypes = [];
+    each$1(visualHandlers, function (handler, key) {
+        visualTypes.push(key);
+    });
+    return visualTypes;
+};
+
+/**
+ * @public
+ */
+VisualMapping.addVisualHandler = function (name, handler) {
+    visualHandlers[name] = handler;
+};
+
+/**
+ * @public
+ */
+VisualMapping.isValidType = function (visualType) {
+    return visualHandlers.hasOwnProperty(visualType);
+};
+
+/**
+ * Convinent method.
+ * Visual can be Object or Array or primary type.
+ *
+ * @public
+ */
+VisualMapping.eachVisual = function (visual, callback, context) {
+    if (isObject$1(visual)) {
+        each$1(visual, callback, context);
+    }
+    else {
+        callback.call(context, visual);
+    }
+};
+
+VisualMapping.mapVisual = function (visual, callback, context) {
+    var isPrimary;
+    var newVisual = isArray(visual)
+        ? []
+        : isObject$1(visual)
+        ? {}
+        : (isPrimary = true, null);
+
+    VisualMapping.eachVisual(visual, function (v, key) {
+        var newVal = callback.call(context, v, key);
+        isPrimary ? (newVisual = newVal) : (newVisual[key] = newVal);
+    });
+    return newVisual;
+};
+
+/**
+ * @public
+ * @param {Object} obj
+ * @return {Object} new object containers visual values.
+ *                 If no visuals, return null.
+ */
+VisualMapping.retrieveVisuals = function (obj) {
+    var ret = {};
+    var hasVisual;
+
+    obj && each$9(visualHandlers, function (h, visualType) {
+        if (obj.hasOwnProperty(visualType)) {
+            ret[visualType] = obj[visualType];
+            hasVisual = true;
+        }
+    });
+
+    return hasVisual ? ret : null;
+};
+
+/**
+ * Give order to visual types, considering colorSaturation, colorAlpha depends on color.
+ *
+ * @public
+ * @param {(Object|Array)} visualTypes If Object, like: {color: ..., colorSaturation: ...}
+ *                                     IF Array, like: ['color', 'symbol', 'colorSaturation']
+ * @return {Array.<string>} Sorted visual types.
+ */
+VisualMapping.prepareVisualTypes = function (visualTypes) {
+    if (isObject$5(visualTypes)) {
+        var types = [];
+        each$9(visualTypes, function (item, type) {
+            types.push(type);
+        });
+        visualTypes = types;
+    }
+    else if (isArray(visualTypes)) {
+        visualTypes = visualTypes.slice();
+    }
+    else {
+        return [];
+    }
+
+    visualTypes.sort(function (type1, type2) {
+        // color should be front of colorSaturation, colorAlpha, ...
+        // symbol and symbolSize do not matter.
+        return (type2 === 'color' && type1 !== 'color' && type1.indexOf('color') === 0)
+            ? 1 : -1;
+    });
+
+    return visualTypes;
+};
+
+/**
+ * 'color', 'colorSaturation', 'colorAlpha', ... are depends on 'color'.
+ * Other visuals are only depends on themself.
+ *
+ * @public
+ * @param {string} visualType1
+ * @param {string} visualType2
+ * @return {boolean}
+ */
+VisualMapping.dependsOn = function (visualType1, visualType2) {
+    return visualType2 === 'color'
+        ? !!(visualType1 && visualType1.indexOf(visualType2) === 0)
+        : visualType1 === visualType2;
+};
+
+/**
+ * @param {number} value
+ * @param {Array.<Object>} pieceList [{value: ..., interval: [min, max]}, ...]
+ *                         Always from small to big.
+ * @param {boolean} [findClosestWhenOutside=false]
+ * @return {number} index
+ */
+VisualMapping.findPieceIndex = function (value, pieceList, findClosestWhenOutside) {
+    var possibleI;
+    var abs = Infinity;
+
+    // value has the higher priority.
+    for (var i = 0, len = pieceList.length; i < len; i++) {
+        var pieceValue = pieceList[i].value;
+        if (pieceValue != null) {
+            if (pieceValue === value
+                // FIXME
+                // It is supposed to compare value according to value type of dimension,
+                // but currently value type can exactly be string or number.
+                // Compromise for numeric-like string (like '12'), especially
+                // in the case that visualMap.categories is ['22', '33'].
+                || (typeof pieceValue === 'string' && pieceValue === value + '')
+            ) {
+                return i;
+            }
+            findClosestWhenOutside && updatePossible(pieceValue, i);
+        }
+    }
+
+    for (var i = 0, len = pieceList.length; i < len; i++) {
+        var piece = pieceList[i];
+        var interval = piece.interval;
+        var close = piece.close;
+
+        if (interval) {
+            if (interval[0] === -Infinity) {
+                if (littleThan(close[1], value, interval[1])) {
+                    return i;
+                }
+            }
+            else if (interval[1] === Infinity) {
+                if (littleThan(close[0], interval[0], value)) {
+                    return i;
+                }
+            }
+            else if (
+                littleThan(close[0], interval[0], value)
+                && littleThan(close[1], value, interval[1])
+            ) {
+                return i;
+            }
+            findClosestWhenOutside && updatePossible(interval[0], i);
+            findClosestWhenOutside && updatePossible(interval[1], i);
+        }
+    }
+
+    if (findClosestWhenOutside) {
+        return value === Infinity
+            ? pieceList.length - 1
+            : value === -Infinity
+            ? 0
+            : possibleI;
+    }
+
+    function updatePossible(val, index) {
+        var newAbs = Math.abs(val - value);
+        if (newAbs < abs) {
+            abs = newAbs;
+            possibleI = index;
+        }
+    }
+
+};
+
+function littleThan(close, a, b) {
+    return close ? a <= b : a < b;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var isArray$2 = isArray;
+
+var ITEM_STYLE_NORMAL = 'itemStyle';
+
+var treemapVisual = {
+    seriesType: 'treemap',
+    reset: function (seriesModel, ecModel, api, payload) {
+        var tree = seriesModel.getData().tree;
+        var root = tree.root;
+        var seriesItemStyleModel = seriesModel.getModel(ITEM_STYLE_NORMAL);
+
+        if (root.isRemoved()) {
+            return;
+        }
+
+        var levelItemStyles = map(tree.levelModels, function (levelModel) {
+            return levelModel ? levelModel.get(ITEM_STYLE_NORMAL) : null;
+        });
+
+        travelTree(
+            root, // Visual should calculate from tree root but not view root.
+            {},
+            levelItemStyles,
+            seriesItemStyleModel,
+            seriesModel.getViewRoot().getAncestors(),
+            seriesModel
+        );
+    }
+};
+
+function travelTree(
+    node, designatedVisual, levelItemStyles, seriesItemStyleModel,
+    viewRootAncestors, seriesModel
+) {
+    var nodeModel = node.getModel();
+    var nodeLayout = node.getLayout();
+
+    // Optimize
+    if (!nodeLayout || nodeLayout.invisible || !nodeLayout.isInView) {
+        return;
+    }
+
+    var nodeItemStyleModel = node.getModel(ITEM_STYLE_NORMAL);
+    var levelItemStyle = levelItemStyles[node.depth];
+    var visuals = buildVisuals(
+        nodeItemStyleModel, designatedVisual, levelItemStyle, seriesItemStyleModel
+    );
+
+    // calculate border color
+    var borderColor = nodeItemStyleModel.get('borderColor');
+    var borderColorSaturation = nodeItemStyleModel.get('borderColorSaturation');
+    var thisNodeColor;
+    if (borderColorSaturation != null) {
+        // For performance, do not always execute 'calculateColor'.
+        thisNodeColor = calculateColor(visuals, node);
+        borderColor = calculateBorderColor(borderColorSaturation, thisNodeColor);
+    }
+    node.setVisual('borderColor', borderColor);
+
+    var viewChildren = node.viewChildren;
+    if (!viewChildren || !viewChildren.length) {
+        thisNodeColor = calculateColor(visuals, node);
+        // Apply visual to this node.
+        node.setVisual('color', thisNodeColor);
+    }
+    else {
+        var mapping = buildVisualMapping(
+            node, nodeModel, nodeLayout, nodeItemStyleModel, visuals, viewChildren
+        );
+
+        // Designate visual to children.
+        each$1(viewChildren, function (child, index) {
+            // If higher than viewRoot, only ancestors of viewRoot is needed to visit.
+            if (child.depth >= viewRootAncestors.length
+                || child === viewRootAncestors[child.depth]
+            ) {
+                var childVisual = mapVisual$1(
+                    nodeModel, visuals, child, index, mapping, seriesModel
+                );
+                travelTree(
+                    child, childVisual, levelItemStyles, seriesItemStyleModel,
+                    viewRootAncestors, seriesModel
+                );
+            }
+        });
+    }
+}
+
+function buildVisuals(
+    nodeItemStyleModel, designatedVisual, levelItemStyle, seriesItemStyleModel
+) {
+    var visuals = extend({}, designatedVisual);
+
+    each$1(['color', 'colorAlpha', 'colorSaturation'], function (visualName) {
+        // Priority: thisNode > thisLevel > parentNodeDesignated > seriesModel
+        var val = nodeItemStyleModel.get(visualName, true); // Ignore parent
+        val == null && levelItemStyle && (val = levelItemStyle[visualName]);
+        val == null && (val = designatedVisual[visualName]);
+        val == null && (val = seriesItemStyleModel.get(visualName));
+
+        val != null && (visuals[visualName] = val);
+    });
+
+    return visuals;
+}
+
+function calculateColor(visuals) {
+    var color = getValueVisualDefine(visuals, 'color');
+
+    if (color) {
+        var colorAlpha = getValueVisualDefine(visuals, 'colorAlpha');
+        var colorSaturation = getValueVisualDefine(visuals, 'colorSaturation');
+        if (colorSaturation) {
+            color = modifyHSL(color, null, null, colorSaturation);
+        }
+        if (colorAlpha) {
+            color = modifyAlpha(color, colorAlpha);
+        }
+
+        return color;
+    }
+}
+
+function calculateBorderColor(borderColorSaturation, thisNodeColor) {
+    return thisNodeColor != null
+            ? modifyHSL(thisNodeColor, null, null, borderColorSaturation)
+            : null;
+}
+
+function getValueVisualDefine(visuals, name) {
+    var value = visuals[name];
+    if (value != null && value !== 'none') {
+        return value;
+    }
+}
+
+function buildVisualMapping(
+    node, nodeModel, nodeLayout, nodeItemStyleModel, visuals, viewChildren
+) {
+    if (!viewChildren || !viewChildren.length) {
+        return;
+    }
+
+    var rangeVisual = getRangeVisual(nodeModel, 'color')
+        || (
+            visuals.color != null
+            && visuals.color !== 'none'
+            && (
+                getRangeVisual(nodeModel, 'colorAlpha')
+                || getRangeVisual(nodeModel, 'colorSaturation')
+            )
+        );
+
+    if (!rangeVisual) {
+        return;
+    }
+
+    var visualMin = nodeModel.get('visualMin');
+    var visualMax = nodeModel.get('visualMax');
+    var dataExtent = nodeLayout.dataExtent.slice();
+    visualMin != null && visualMin < dataExtent[0] && (dataExtent[0] = visualMin);
+    visualMax != null && visualMax > dataExtent[1] && (dataExtent[1] = visualMax);
+
+    var colorMappingBy = nodeModel.get('colorMappingBy');
+    var opt = {
+        type: rangeVisual.name,
+        dataExtent: dataExtent,
+        visual: rangeVisual.range
+    };
+    if (opt.type === 'color'
+        && (colorMappingBy === 'index' || colorMappingBy === 'id')
+    ) {
+        opt.mappingMethod = 'category';
+        opt.loop = true;
+        // categories is ordinal, so do not set opt.categories.
+    }
+    else {
+        opt.mappingMethod = 'linear';
+    }
+
+    var mapping = new VisualMapping(opt);
+    mapping.__drColorMappingBy = colorMappingBy;
+
+    return mapping;
+}
+
+// Notice: If we dont have the attribute 'colorRange', but only use
+// attribute 'color' to represent both concepts of 'colorRange' and 'color',
+// (It means 'colorRange' when 'color' is Array, means 'color' when not array),
+// this problem will be encountered:
+// If a level-1 node dont have children, and its siblings has children,
+// and colorRange is set on level-1, then the node can not be colored.
+// So we separate 'colorRange' and 'color' to different attributes.
+function getRangeVisual(nodeModel, name) {
+    // 'colorRange', 'colorARange', 'colorSRange'.
+    // If not exsits on this node, fetch from levels and series.
+    var range = nodeModel.get(name);
+    return (isArray$2(range) && range.length) ? {name: name, range: range} : null;
+}
+
+function mapVisual$1(nodeModel, visuals, child, index, mapping, seriesModel) {
+    var childVisuals = extend({}, visuals);
+
+    if (mapping) {
+        var mappingType = mapping.type;
+        var colorMappingBy = mappingType === 'color' && mapping.__drColorMappingBy;
+        var value =
+            colorMappingBy === 'index'
+            ? index
+            : colorMappingBy === 'id'
+            ? seriesModel.mapIdToIndex(child.getId())
+            : child.getValue(nodeModel.get('visualDimension'));
+
+        childVisuals[mappingType] = mapping.mapValueToVisual(value);
+    }
+
+    return childVisuals;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The treemap layout implementation references to the treemap
+* layout of d3.js (d3/src/layout/treemap.js in v3). The use of
+* the source code of this file is also subject to the terms
+* and consitions of its license (BSD-3Clause, see
+* <echarts/src/licenses/LICENSE-d3>).
+*/
+
+var mathMax$4 = Math.max;
+var mathMin$4 = Math.min;
+var retrieveValue = retrieve;
+var each$10 = each$1;
+
+var PATH_BORDER_WIDTH = ['itemStyle', 'borderWidth'];
+var PATH_GAP_WIDTH = ['itemStyle', 'gapWidth'];
+var PATH_UPPER_LABEL_SHOW = ['upperLabel', 'show'];
+var PATH_UPPER_LABEL_HEIGHT = ['upperLabel', 'height'];
+
+/**
+ * @public
+ */
+var treemapLayout = {
+    seriesType: 'treemap',
+    reset: function (seriesModel, ecModel, api, payload) {
+        // Layout result in each node:
+        // {x, y, width, height, area, borderWidth}
+        var ecWidth = api.getWidth();
+        var ecHeight = api.getHeight();
+        var seriesOption = seriesModel.option;
+
+        var layoutInfo = getLayoutRect(
+            seriesModel.getBoxLayoutParams(),
+            {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }
+        );
+
+        var size = seriesOption.size || []; // Compatible with ec2.
+        var containerWidth = parsePercent$1(
+            retrieveValue(layoutInfo.width, size[0]),
+            ecWidth
+        );
+        var containerHeight = parsePercent$1(
+            retrieveValue(layoutInfo.height, size[1]),
+            ecHeight
+        );
+
+        // Fetch payload info.
+        var payloadType = payload && payload.type;
+        var types = ['treemapZoomToNode', 'treemapRootToNode'];
+        var targetInfo = retrieveTargetInfo(payload, types, seriesModel);
+        var rootRect = (payloadType === 'treemapRender' || payloadType === 'treemapMove')
+            ? payload.rootRect : null;
+        var viewRoot = seriesModel.getViewRoot();
+        var viewAbovePath = getPathToRoot(viewRoot);
+
+        if (payloadType !== 'treemapMove') {
+            var rootSize = payloadType === 'treemapZoomToNode'
+                ? estimateRootSize(
+                    seriesModel, targetInfo, viewRoot, containerWidth, containerHeight
+                )
+                : rootRect
+                ? [rootRect.width, rootRect.height]
+                : [containerWidth, containerHeight];
+
+            var sort = seriesOption.sort;
+            if (sort && sort !== 'asc' && sort !== 'desc') {
+                sort = 'desc';
+            }
+            var options = {
+                squareRatio: seriesOption.squareRatio,
+                sort: sort,
+                leafDepth: seriesOption.leafDepth
+            };
+
+            // layout should be cleared because using updateView but not update.
+            viewRoot.hostTree.clearLayouts();
+
+            // TODO
+            // optimize: if out of view clip, do not layout.
+            // But take care that if do not render node out of view clip,
+            // how to calculate start po
+
+            var viewRootLayout = {
+                x: 0, y: 0,
+                width: rootSize[0], height: rootSize[1],
+                area: rootSize[0] * rootSize[1]
+            };
+            viewRoot.setLayout(viewRootLayout);
+
+            squarify(viewRoot, options, false, 0);
+            // Supplement layout.
+            var viewRootLayout = viewRoot.getLayout();
+            each$10(viewAbovePath, function (node, index) {
+                var childValue = (viewAbovePath[index + 1] || viewRoot).getValue();
+                node.setLayout(extend(
+                    {dataExtent: [childValue, childValue], borderWidth: 0, upperHeight: 0},
+                    viewRootLayout
+                ));
+            });
+        }
+
+        var treeRoot = seriesModel.getData().tree.root;
+
+        treeRoot.setLayout(
+            calculateRootPosition(layoutInfo, rootRect, targetInfo),
+            true
+        );
+
+        seriesModel.setLayoutInfo(layoutInfo);
+
+        // FIXME
+        // 现在没有clip功能，暂时取ec高宽。
+        prunning(
+            treeRoot,
+            // Transform to base element coordinate system.
+            new BoundingRect(-layoutInfo.x, -layoutInfo.y, ecWidth, ecHeight),
+            viewAbovePath,
+            viewRoot,
+            0
+        );
+    }
+};
+
+/**
+ * Layout treemap with squarify algorithm.
+ * @see https://graphics.ethz.ch/teaching/scivis_common/Literature/squarifiedTreeMaps.pdf
+ * The implementation references to the treemap layout of d3.js.
+ * See the license statement at the head of this file.
+ *
+ * @protected
+ * @param {module:echarts/data/Tree~TreeNode} node
+ * @param {Object} options
+ * @param {string} options.sort 'asc' or 'desc'
+ * @param {number} options.squareRatio
+ * @param {boolean} hideChildren
+ * @param {number} depth
+ */
+function squarify(node, options, hideChildren, depth) {
+    var width;
+    var height;
+
+    if (node.isRemoved()) {
+        return;
+    }
+
+    var thisLayout = node.getLayout();
+    width = thisLayout.width;
+    height = thisLayout.height;
+
+    // Considering border and gap
+    var nodeModel = node.getModel();
+    var borderWidth = nodeModel.get(PATH_BORDER_WIDTH);
+    var halfGapWidth = nodeModel.get(PATH_GAP_WIDTH) / 2;
+    var upperLabelHeight = getUpperLabelHeight(nodeModel);
+    var upperHeight = Math.max(borderWidth, upperLabelHeight);
+    var layoutOffset = borderWidth - halfGapWidth;
+    var layoutOffsetUpper = upperHeight - halfGapWidth;
+    var nodeModel = node.getModel();
+
+    node.setLayout({
+        borderWidth: borderWidth,
+        upperHeight: upperHeight,
+        upperLabelHeight: upperLabelHeight
+    }, true);
+
+    width = mathMax$4(width - 2 * layoutOffset, 0);
+    height = mathMax$4(height - layoutOffset - layoutOffsetUpper, 0);
+
+    var totalArea = width * height;
+    var viewChildren = initChildren(
+        node, nodeModel, totalArea, options, hideChildren, depth
+    );
+
+    if (!viewChildren.length) {
+        return;
+    }
+
+    var rect = {x: layoutOffset, y: layoutOffsetUpper, width: width, height: height};
+    var rowFixedLength = mathMin$4(width, height);
+    var best = Infinity; // the best row score so far
+    var row = [];
+    row.area = 0;
+
+    for (var i = 0, len = viewChildren.length; i < len;) {
+        var child = viewChildren[i];
+
+        row.push(child);
+        row.area += child.getLayout().area;
+        var score = worst(row, rowFixedLength, options.squareRatio);
+
+        // continue with this orientation
+        if (score <= best) {
+            i++;
+            best = score;
+        }
+        // abort, and try a different orientation
+        else {
+            row.area -= row.pop().getLayout().area;
+            position(row, rowFixedLength, rect, halfGapWidth, false);
+            rowFixedLength = mathMin$4(rect.width, rect.height);
+            row.length = row.area = 0;
+            best = Infinity;
+        }
+    }
+
+    if (row.length) {
+        position(row, rowFixedLength, rect, halfGapWidth, true);
+    }
+
+    if (!hideChildren) {
+        var childrenVisibleMin = nodeModel.get('childrenVisibleMin');
+        if (childrenVisibleMin != null && totalArea < childrenVisibleMin) {
+            hideChildren = true;
+        }
+    }
+
+    for (var i = 0, len = viewChildren.length; i < len; i++) {
+        squarify(viewChildren[i], options, hideChildren, depth + 1);
+    }
+}
+
+/**
+ * Set area to each child, and calculate data extent for visual coding.
+ */
+function initChildren(node, nodeModel, totalArea, options, hideChildren, depth) {
+    var viewChildren = node.children || [];
+    var orderBy = options.sort;
+    orderBy !== 'asc' && orderBy !== 'desc' && (orderBy = null);
+
+    var overLeafDepth = options.leafDepth != null && options.leafDepth <= depth;
+
+    // leafDepth has higher priority.
+    if (hideChildren && !overLeafDepth) {
+        return (node.viewChildren = []);
+    }
+
+    // Sort children, order by desc.
+    viewChildren = filter(viewChildren, function (child) {
+        return !child.isRemoved();
+    });
+
+    sort$1(viewChildren, orderBy);
+
+    var info = statistic(nodeModel, viewChildren, orderBy);
+
+    if (info.sum === 0) {
+        return (node.viewChildren = []);
+    }
+
+    info.sum = filterByThreshold(nodeModel, totalArea, info.sum, orderBy, viewChildren);
+
+    if (info.sum === 0) {
+        return (node.viewChildren = []);
+    }
+
+    // Set area to each child.
+    for (var i = 0, len = viewChildren.length; i < len; i++) {
+        var area = viewChildren[i].getValue() / info.sum * totalArea;
+        // Do not use setLayout({...}, true), because it is needed to clear last layout.
+        viewChildren[i].setLayout({area: area});
+    }
+
+    if (overLeafDepth) {
+        viewChildren.length && node.setLayout({isLeafRoot: true}, true);
+        viewChildren.length = 0;
+    }
+
+    node.viewChildren = viewChildren;
+    node.setLayout({dataExtent: info.dataExtent}, true);
+
+    return viewChildren;
+}
+
+/**
+ * Consider 'visibleMin'. Modify viewChildren and get new sum.
+ */
+function filterByThreshold(nodeModel, totalArea, sum, orderBy, orderedChildren) {
+
+    // visibleMin is not supported yet when no option.sort.
+    if (!orderBy) {
+        return sum;
+    }
+
+    var visibleMin = nodeModel.get('visibleMin');
+    var len = orderedChildren.length;
+    var deletePoint = len;
+
+    // Always travel from little value to big value.
+    for (var i = len - 1; i >= 0; i--) {
+        var value = orderedChildren[
+            orderBy === 'asc' ? len - i - 1 : i
+        ].getValue();
+
+        if (value / sum * totalArea < visibleMin) {
+            deletePoint = i;
+            sum -= value;
+        }
+    }
+
+    orderBy === 'asc'
+        ? orderedChildren.splice(0, len - deletePoint)
+        : orderedChildren.splice(deletePoint, len - deletePoint);
+
+    return sum;
+}
+
+/**
+ * Sort
+ */
+function sort$1(viewChildren, orderBy) {
+    if (orderBy) {
+        viewChildren.sort(function (a, b) {
+            var diff = orderBy === 'asc'
+                ?  a.getValue() - b.getValue() : b.getValue() - a.getValue();
+            return diff === 0
+                ? (orderBy === 'asc'
+                    ? a.dataIndex - b.dataIndex : b.dataIndex - a.dataIndex
+                )
+                : diff;
+        });
+    }
+    return viewChildren;
+}
+
+/**
+ * Statistic
+ */
+function statistic(nodeModel, children, orderBy) {
+    // Calculate sum.
+    var sum = 0;
+    for (var i = 0, len = children.length; i < len; i++) {
+        sum += children[i].getValue();
+    }
+
+    // Statistic data extent for latter visual coding.
+    // Notice: data extent should be calculate based on raw children
+    // but not filtered view children, otherwise visual mapping will not
+    // be stable when zoom (where children is filtered by visibleMin).
+
+    var dimension = nodeModel.get('visualDimension');
+    var dataExtent;
+
+    // The same as area dimension.
+    if (!children || !children.length) {
+        dataExtent = [NaN, NaN];
+    }
+    else if (dimension === 'value' && orderBy) {
+        dataExtent = [
+            children[children.length - 1].getValue(),
+            children[0].getValue()
+        ];
+        orderBy === 'asc' && dataExtent.reverse();
+    }
+    // Other dimension.
+    else {
+        var dataExtent = [Infinity, -Infinity];
+        each$10(children, function (child) {
+            var value = child.getValue(dimension);
+            value < dataExtent[0] && (dataExtent[0] = value);
+            value > dataExtent[1] && (dataExtent[1] = value);
+        });
+    }
+
+    return {sum: sum, dataExtent: dataExtent};
+}
+
+/**
+ * Computes the score for the specified row,
+ * as the worst aspect ratio.
+ */
+function worst(row, rowFixedLength, ratio) {
+    var areaMax = 0;
+    var areaMin = Infinity;
+
+    for (var i = 0, area, len = row.length; i < len; i++) {
+        area = row[i].getLayout().area;
+        if (area) {
+            area < areaMin && (areaMin = area);
+            area > areaMax && (areaMax = area);
+        }
+    }
+
+    var squareArea = row.area * row.area;
+    var f = rowFixedLength * rowFixedLength * ratio;
+
+    return squareArea
+        ? mathMax$4(
+            (f * areaMax) / squareArea,
+            squareArea / (f * areaMin)
+        )
+        : Infinity;
+}
+
+/**
+ * Positions the specified row of nodes. Modifies `rect`.
+ */
+function position(row, rowFixedLength, rect, halfGapWidth, flush) {
+    // When rowFixedLength === rect.width,
+    // it is horizontal subdivision,
+    // rowFixedLength is the width of the subdivision,
+    // rowOtherLength is the height of the subdivision,
+    // and nodes will be positioned from left to right.
+
+    // wh[idx0WhenH] means: when horizontal,
+    //      wh[idx0WhenH] => wh[0] => 'width'.
+    //      xy[idx1WhenH] => xy[1] => 'y'.
+    var idx0WhenH = rowFixedLength === rect.width ? 0 : 1;
+    var idx1WhenH = 1 - idx0WhenH;
+    var xy = ['x', 'y'];
+    var wh = ['width', 'height'];
+
+    var last = rect[xy[idx0WhenH]];
+    var rowOtherLength = rowFixedLength
+        ? row.area / rowFixedLength : 0;
+
+    if (flush || rowOtherLength > rect[wh[idx1WhenH]]) {
+        rowOtherLength = rect[wh[idx1WhenH]]; // over+underflow
+    }
+    for (var i = 0, rowLen = row.length; i < rowLen; i++) {
+        var node = row[i];
+        var nodeLayout = {};
+        var step = rowOtherLength
+            ? node.getLayout().area / rowOtherLength : 0;
+
+        var wh1 = nodeLayout[wh[idx1WhenH]] = mathMax$4(rowOtherLength - 2 * halfGapWidth, 0);
+
+        // We use Math.max/min to avoid negative width/height when considering gap width.
+        var remain = rect[xy[idx0WhenH]] + rect[wh[idx0WhenH]] - last;
+        var modWH = (i === rowLen - 1 || remain < step) ? remain : step;
+        var wh0 = nodeLayout[wh[idx0WhenH]] = mathMax$4(modWH - 2 * halfGapWidth, 0);
+
+        nodeLayout[xy[idx1WhenH]] = rect[xy[idx1WhenH]] + mathMin$4(halfGapWidth, wh1 / 2);
+        nodeLayout[xy[idx0WhenH]] = last + mathMin$4(halfGapWidth, wh0 / 2);
+
+        last += modWH;
+        node.setLayout(nodeLayout, true);
+    }
+
+    rect[xy[idx1WhenH]] += rowOtherLength;
+    rect[wh[idx1WhenH]] -= rowOtherLength;
+}
+
+// Return [containerWidth, containerHeight] as defualt.
+function estimateRootSize(seriesModel, targetInfo, viewRoot, containerWidth, containerHeight) {
+    // If targetInfo.node exists, we zoom to the node,
+    // so estimate whold width and heigth by target node.
+    var currNode = (targetInfo || {}).node;
+    var defaultSize = [containerWidth, containerHeight];
+
+    if (!currNode || currNode === viewRoot) {
+        return defaultSize;
+    }
+
+    var parent;
+    var viewArea = containerWidth * containerHeight;
+    var area = viewArea * seriesModel.option.zoomToNodeRatio;
+
+    while (parent = currNode.parentNode) { // jshint ignore:line
+        var sum = 0;
+        var siblings = parent.children;
+
+        for (var i = 0, len = siblings.length; i < len; i++) {
+            sum += siblings[i].getValue();
+        }
+        var currNodeValue = currNode.getValue();
+        if (currNodeValue === 0) {
+            return defaultSize;
+        }
+        area *= sum / currNodeValue;
+
+        // Considering border, suppose aspect ratio is 1.
+        var parentModel = parent.getModel();
+        var borderWidth = parentModel.get(PATH_BORDER_WIDTH);
+        var upperHeight = Math.max(borderWidth, getUpperLabelHeight(parentModel, borderWidth));
+        area += 4 * borderWidth * borderWidth
+            + (3 * borderWidth + upperHeight) * Math.pow(area, 0.5);
+
+        area > MAX_SAFE_INTEGER && (area = MAX_SAFE_INTEGER);
+
+        currNode = parent;
+    }
+
+    area < viewArea && (area = viewArea);
+    var scale = Math.pow(area / viewArea, 0.5);
+
+    return [containerWidth * scale, containerHeight * scale];
+}
+
+// Root postion base on coord of containerGroup
+function calculateRootPosition(layoutInfo, rootRect, targetInfo) {
+    if (rootRect) {
+        return {x: rootRect.x, y: rootRect.y};
+    }
+
+    var defaultPosition = {x: 0, y: 0};
+    if (!targetInfo) {
+        return defaultPosition;
+    }
+
+    // If targetInfo is fetched by 'retrieveTargetInfo',
+    // old tree and new tree are the same tree,
+    // so the node still exists and we can visit it.
+
+    var targetNode = targetInfo.node;
+    var layout = targetNode.getLayout();
+
+    if (!layout) {
+        return defaultPosition;
+    }
+
+    // Transform coord from local to container.
+    var targetCenter = [layout.width / 2, layout.height / 2];
+    var node = targetNode;
+    while (node) {
+        var nodeLayout = node.getLayout();
+        targetCenter[0] += nodeLayout.x;
+        targetCenter[1] += nodeLayout.y;
+        node = node.parentNode;
+    }
+
+    return {
+        x: layoutInfo.width / 2 - targetCenter[0],
+        y: layoutInfo.height / 2 - targetCenter[1]
+    };
+}
+
+// Mark nodes visible for prunning when visual coding and rendering.
+// Prunning depends on layout and root position, so we have to do it after layout.
+function prunning(node, clipRect, viewAbovePath, viewRoot, depth) {
+    var nodeLayout = node.getLayout();
+    var nodeInViewAbovePath = viewAbovePath[depth];
+    var isAboveViewRoot = nodeInViewAbovePath && nodeInViewAbovePath === node;
+
+    if (
+        (nodeInViewAbovePath && !isAboveViewRoot)
+        || (depth === viewAbovePath.length && node !== viewRoot)
+    ) {
+        return;
+    }
+
+    node.setLayout({
+        // isInView means: viewRoot sub tree + viewAbovePath
+        isInView: true,
+        // invisible only means: outside view clip so that the node can not
+        // see but still layout for animation preparation but not render.
+        invisible: !isAboveViewRoot && !clipRect.intersect(nodeLayout),
+        isAboveViewRoot: isAboveViewRoot
+    }, true);
+
+    // Transform to child coordinate.
+    var childClipRect = new BoundingRect(
+        clipRect.x - nodeLayout.x,
+        clipRect.y - nodeLayout.y,
+        clipRect.width,
+        clipRect.height
+    );
+
+    each$10(node.viewChildren || [], function (child) {
+        prunning(child, childClipRect, viewAbovePath, viewRoot, depth + 1);
+    });
+}
+
+function getUpperLabelHeight(model) {
+    return model.get(PATH_UPPER_LABEL_SHOW) ? model.get(PATH_UPPER_LABEL_HEIGHT) : 0;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(treemapVisual);
+registerLayout(treemapLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Graph data structure
+ *
+ * @module echarts/data/Graph
+ * @author Yi Shen(https://www.github.com/pissang)
+ */
+
+// id may be function name of Object, add a prefix to avoid this problem.
+function generateNodeKey (id) {
+    return '_EC_' + id;
+}
+/**
+ * @alias module:echarts/data/Graph
+ * @constructor
+ * @param {boolean} directed
+ */
+var Graph = function(directed) {
+    /**
+     * 是否是有向图
+     * @type {boolean}
+     * @private
+     */
+    this._directed = directed || false;
+
+    /**
+     * @type {Array.<module:echarts/data/Graph.Node>}
+     * @readOnly
+     */
+    this.nodes = [];
+
+    /**
+     * @type {Array.<module:echarts/data/Graph.Edge>}
+     * @readOnly
+     */
+    this.edges = [];
+
+    /**
+     * @type {Object.<string, module:echarts/data/Graph.Node>}
+     * @private
+     */
+    this._nodesMap = {};
+    /**
+     * @type {Object.<string, module:echarts/data/Graph.Edge>}
+     * @private
+     */
+    this._edgesMap = {};
+
+    /**
+     * @type {module:echarts/data/List}
+     * @readOnly
+     */
+    this.data;
+
+    /**
+     * @type {module:echarts/data/List}
+     * @readOnly
+     */
+    this.edgeData;
+};
+
+var graphProto = Graph.prototype;
+/**
+ * @type {string}
+ */
+graphProto.type = 'graph';
+
+/**
+ * If is directed graph
+ * @return {boolean}
+ */
+graphProto.isDirected = function () {
+    return this._directed;
+};
+
+/**
+ * Add a new node
+ * @param {string} id
+ * @param {number} [dataIndex]
+ */
+graphProto.addNode = function (id, dataIndex) {
+    id = id || ('' + dataIndex);
+
+    var nodesMap = this._nodesMap;
+
+    if (nodesMap[generateNodeKey(id)]) {
+        if (__DEV__) {
+            console.error('Graph nodes have duplicate name or id');
+        }
+        return;
+    }
+
+    var node = new Node(id, dataIndex);
+    node.hostGraph = this;
+
+    this.nodes.push(node);
+
+    nodesMap[generateNodeKey(id)] = node;
+    return node;
+};
+
+/**
+ * Get node by data index
+ * @param  {number} dataIndex
+ * @return {module:echarts/data/Graph~Node}
+ */
+graphProto.getNodeByIndex = function (dataIndex) {
+    var rawIdx = this.data.getRawIndex(dataIndex);
+    return this.nodes[rawIdx];
+};
+/**
+ * Get node by id
+ * @param  {string} id
+ * @return {module:echarts/data/Graph.Node}
+ */
+graphProto.getNodeById = function (id) {
+    return this._nodesMap[generateNodeKey(id)];
+};
+
+/**
+ * Add a new edge
+ * @param {number|string|module:echarts/data/Graph.Node} n1
+ * @param {number|string|module:echarts/data/Graph.Node} n2
+ * @param {number} [dataIndex=-1]
+ * @return {module:echarts/data/Graph.Edge}
+ */
+graphProto.addEdge = function (n1, n2, dataIndex) {
+    var nodesMap = this._nodesMap;
+    var edgesMap = this._edgesMap;
+
+    // PNEDING
+    if (typeof n1 === 'number') {
+        n1 = this.nodes[n1];
+    }
+    if (typeof n2 === 'number') {
+        n2 = this.nodes[n2];
+    }
+
+    if (!Node.isInstance(n1)) {
+        n1 = nodesMap[generateNodeKey(n1)];
+    }
+    if (!Node.isInstance(n2)) {
+        n2 = nodesMap[generateNodeKey(n2)];
+    }
+    if (!n1 || !n2) {
+        return;
+    }
+
+    var key = n1.id + '-' + n2.id;
+    // PENDING
+    if (edgesMap[key]) {
+        return;
+    }
+
+    var edge = new Edge(n1, n2, dataIndex);
+    edge.hostGraph = this;
+
+    if (this._directed) {
+        n1.outEdges.push(edge);
+        n2.inEdges.push(edge);
+    }
+    n1.edges.push(edge);
+    if (n1 !== n2) {
+        n2.edges.push(edge);
+    }
+
+    this.edges.push(edge);
+    edgesMap[key] = edge;
+
+    return edge;
+};
+
+/**
+ * Get edge by data index
+ * @param  {number} dataIndex
+ * @return {module:echarts/data/Graph~Node}
+ */
+graphProto.getEdgeByIndex = function (dataIndex) {
+    var rawIdx = this.edgeData.getRawIndex(dataIndex);
+    return this.edges[rawIdx];
+};
+/**
+ * Get edge by two linked nodes
+ * @param  {module:echarts/data/Graph.Node|string} n1
+ * @param  {module:echarts/data/Graph.Node|string} n2
+ * @return {module:echarts/data/Graph.Edge}
+ */
+graphProto.getEdge = function (n1, n2) {
+    if (Node.isInstance(n1)) {
+        n1 = n1.id;
+    }
+    if (Node.isInstance(n2)) {
+        n2 = n2.id;
+    }
+
+    var edgesMap = this._edgesMap;
+
+    if (this._directed) {
+        return edgesMap[n1 + '-' + n2];
+    } else {
+        return edgesMap[n1 + '-' + n2]
+            || edgesMap[n2 + '-' + n1];
+    }
+};
+
+/**
+ * Iterate all nodes
+ * @param  {Function} cb
+ * @param  {*} [context]
+ */
+graphProto.eachNode = function (cb, context) {
+    var nodes = this.nodes;
+    var len = nodes.length;
+    for (var i = 0; i < len; i++) {
+        if (nodes[i].dataIndex >= 0) {
+            cb.call(context, nodes[i], i);
+        }
+    }
+};
+
+/**
+ * Iterate all edges
+ * @param  {Function} cb
+ * @param  {*} [context]
+ */
+graphProto.eachEdge = function (cb, context) {
+    var edges = this.edges;
+    var len = edges.length;
+    for (var i = 0; i < len; i++) {
+        if (edges[i].dataIndex >= 0
+            && edges[i].node1.dataIndex >= 0
+            && edges[i].node2.dataIndex >= 0
+        ) {
+            cb.call(context, edges[i], i);
+        }
+    }
+};
+
+/**
+ * Breadth first traverse
+ * @param {Function} cb
+ * @param {module:echarts/data/Graph.Node} startNode
+ * @param {string} [direction='none'] 'none'|'in'|'out'
+ * @param {*} [context]
+ */
+graphProto.breadthFirstTraverse = function (
+    cb, startNode, direction, context
+) {
+    if (!Node.isInstance(startNode)) {
+        startNode = this._nodesMap[generateNodeKey(startNode)];
+    }
+    if (!startNode) {
+        return;
+    }
+
+    var edgeType = direction === 'out'
+        ? 'outEdges' : (direction === 'in' ? 'inEdges' : 'edges');
+
+    for (var i = 0; i < this.nodes.length; i++) {
+        this.nodes[i].__visited = false;
+    }
+
+    if (cb.call(context, startNode, null)) {
+        return;
+    }
+
+    var queue = [startNode];
+    while (queue.length) {
+        var currentNode = queue.shift();
+        var edges = currentNode[edgeType];
+
+        for (var i = 0; i < edges.length; i++) {
+            var e = edges[i];
+            var otherNode = e.node1 === currentNode
+                ? e.node2 : e.node1;
+            if (!otherNode.__visited) {
+                if (cb.call(context, otherNode, currentNode)) {
+                    // Stop traversing
+                    return;
+                }
+                queue.push(otherNode);
+                otherNode.__visited = true;
+            }
+        }
+    }
+};
+
+// TODO
+// graphProto.depthFirstTraverse = function (
+//     cb, startNode, direction, context
+// ) {
+
+// };
+
+// Filter update
+graphProto.update = function () {
+    var data = this.data;
+    var edgeData = this.edgeData;
+    var nodes = this.nodes;
+    var edges = this.edges;
+
+    for (var i = 0, len = nodes.length; i < len; i++) {
+        nodes[i].dataIndex = -1;
+    }
+    for (var i = 0, len = data.count(); i < len; i++) {
+        nodes[data.getRawIndex(i)].dataIndex = i;
+    }
+
+    edgeData.filterSelf(function (idx) {
+        var edge = edges[edgeData.getRawIndex(idx)];
+        return edge.node1.dataIndex >= 0 && edge.node2.dataIndex >= 0;
+    });
+
+    // Update edge
+    for (var i = 0, len = edges.length; i < len; i++) {
+        edges[i].dataIndex = -1;
+    }
+    for (var i = 0, len = edgeData.count(); i < len; i++) {
+        edges[edgeData.getRawIndex(i)].dataIndex = i;
+    }
+};
+
+/**
+ * @return {module:echarts/data/Graph}
+ */
+graphProto.clone = function () {
+    var graph = new Graph(this._directed);
+    var nodes = this.nodes;
+    var edges = this.edges;
+    for (var i = 0; i < nodes.length; i++) {
+        graph.addNode(nodes[i].id, nodes[i].dataIndex);
+    }
+    for (var i = 0; i < edges.length; i++) {
+        var e = edges[i];
+        graph.addEdge(e.node1.id, e.node2.id, e.dataIndex);
+    }
+    return graph;
+};
+
+
+/**
+ * @alias module:echarts/data/Graph.Node
+ */
+function Node(id, dataIndex) {
+    /**
+    * @type {string}
+    */
+    this.id = id == null ? '' : id;
+
+    /**
+    * @type {Array.<module:echarts/data/Graph.Edge>}
+    */
+    this.inEdges = [];
+    /**
+    * @type {Array.<module:echarts/data/Graph.Edge>}
+    */
+    this.outEdges = [];
+    /**
+    * @type {Array.<module:echarts/data/Graph.Edge>}
+    */
+    this.edges = [];
+    /**
+     * @type {module:echarts/data/Graph}
+     */
+    this.hostGraph;
+
+    /**
+     * @type {number}
+     */
+    this.dataIndex = dataIndex == null ? -1 : dataIndex;
+}
+
+Node.prototype = {
+
+    constructor: Node,
+
+    /**
+     * @return {number}
+     */
+    degree: function () {
+        return this.edges.length;
+    },
+
+    /**
+     * @return {number}
+     */
+    inDegree: function () {
+        return this.inEdges.length;
+    },
+
+    /**
+    * @return {number}
+    */
+    outDegree: function () {
+        return this.outEdges.length;
+    },
+
+    /**
+     * @param {string} [path]
+     * @return {module:echarts/model/Model}
+     */
+    getModel: function (path) {
+        if (this.dataIndex < 0) {
+            return;
+        }
+        var graph = this.hostGraph;
+        var itemModel = graph.data.getItemModel(this.dataIndex);
+
+        return itemModel.getModel(path);
+    }
+};
+
+/**
+ * 图边
+ * @alias module:echarts/data/Graph.Edge
+ * @param {module:echarts/data/Graph.Node} n1
+ * @param {module:echarts/data/Graph.Node} n2
+ * @param {number} [dataIndex=-1]
+ */
+function Edge(n1, n2, dataIndex) {
+
+    /**
+     * 节点1，如果是有向图则为源节点
+     * @type {module:echarts/data/Graph.Node}
+     */
+    this.node1 = n1;
+
+    /**
+     * 节点2，如果是有向图则为目标节点
+     * @type {module:echarts/data/Graph.Node}
+     */
+    this.node2 = n2;
+
+    this.dataIndex = dataIndex == null ? -1 : dataIndex;
+}
+
+/**
+ * @param {string} [path]
+ * @return {module:echarts/model/Model}
+ */
+Edge.prototype.getModel = function (path) {
+    if (this.dataIndex < 0) {
+        return;
+    }
+    var graph = this.hostGraph;
+    var itemModel = graph.edgeData.getItemModel(this.dataIndex);
+
+    return itemModel.getModel(path);
+};
+
+var createGraphDataProxyMixin = function (hostName, dataName) {
+    return {
+        /**
+         * @param {string=} [dimension='value'] Default 'value'. can be 'a', 'b', 'c', 'd', 'e'.
+         * @return {number}
+         */
+        getValue: function (dimension) {
+            var data = this[hostName][dataName];
+            return data.get(data.getDimension(dimension || 'value'), this.dataIndex);
+        },
+
+        /**
+         * @param {Object|string} key
+         * @param {*} [value]
+         */
+        setVisual: function (key, value) {
+            this.dataIndex >= 0
+                && this[hostName][dataName].setItemVisual(this.dataIndex, key, value);
+        },
+
+        /**
+         * @param {string} key
+         * @return {boolean}
+         */
+        getVisual: function (key, ignoreParent) {
+            return this[hostName][dataName].getItemVisual(this.dataIndex, key, ignoreParent);
+        },
+
+        /**
+         * @param {Object} layout
+         * @return {boolean} [merge=false]
+         */
+        setLayout: function (layout, merge$$1) {
+            this.dataIndex >= 0
+                && this[hostName][dataName].setItemLayout(this.dataIndex, layout, merge$$1);
+        },
+
+        /**
+         * @return {Object}
+         */
+        getLayout: function () {
+            return this[hostName][dataName].getItemLayout(this.dataIndex);
+        },
+
+        /**
+         * @return {module:zrender/Element}
+         */
+        getGraphicEl: function () {
+            return this[hostName][dataName].getItemGraphicEl(this.dataIndex);
+        },
+
+        /**
+         * @return {number}
+         */
+        getRawIndex: function () {
+            return this[hostName][dataName].getRawIndex(this.dataIndex);
+        }
+    };
+};
+
+mixin(Node, createGraphDataProxyMixin('hostGraph', 'data'));
+mixin(Edge, createGraphDataProxyMixin('hostGraph', 'edgeData'));
+
+Graph.Node = Node;
+Graph.Edge = Edge;
+
+enableClassCheck(Node);
+enableClassCheck(Edge);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var createGraphFromNodeEdge = function (nodes, edges, seriesModel, directed, beforeLink) {
+    // ??? TODO
+    // support dataset?
+    var graph = new Graph(directed);
+    for (var i = 0; i < nodes.length; i++) {
+        graph.addNode(retrieve(
+            // Id, name, dataIndex
+            nodes[i].id, nodes[i].name, i
+        ), i);
+    }
+
+    var linkNameList = [];
+    var validEdges = [];
+    var linkCount = 0;
+    for (var i = 0; i < edges.length; i++) {
+        var link = edges[i];
+        var source = link.source;
+        var target = link.target;
+        // addEdge may fail when source or target not exists
+        if (graph.addEdge(source, target, linkCount)) {
+            validEdges.push(link);
+            linkNameList.push(retrieve(link.id, source + ' > ' + target));
+            linkCount++;
+        }
+    }
+
+    var coordSys = seriesModel.get('coordinateSystem');
+    var nodeData;
+    if (coordSys === 'cartesian2d' || coordSys === 'polar') {
+        nodeData = createListFromArray(nodes, seriesModel);
+    }
+    else {
+        var coordSysCtor = CoordinateSystemManager.get(coordSys);
+        var coordDimensions = (coordSysCtor && coordSysCtor.type !== 'view')
+            ? (coordSysCtor.dimensions || []) : [];
+        // FIXME: Some geo do not need `value` dimenson, whereas `calendar` needs
+        // `value` dimension, but graph need `value` dimension. It's better to
+        // uniform this behavior.
+        if (indexOf(coordDimensions, 'value') < 0) {
+            coordDimensions.concat(['value']);
+        }
+
+        var dimensionNames = createDimensions(nodes, {
+            coordDimensions: coordDimensions
+        });
+        nodeData = new List(dimensionNames, seriesModel);
+        nodeData.initData(nodes);
+    }
+
+    var edgeData = new List(['value'], seriesModel);
+    edgeData.initData(validEdges, linkNameList);
+
+    beforeLink && beforeLink(nodeData, edgeData);
+
+    linkList({
+        mainData: nodeData,
+        struct: graph,
+        structAttr: 'graph',
+        datas: {node: nodeData, edge: edgeData},
+        datasAttr: {node: 'data', edge: 'edgeData'}
+    });
+
+    // Update dataIndex of nodes and edges because invalid edge may be removed
+    graph.update();
+
+    return graph;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var GraphSeries = extendSeriesModel({
+
+    type: 'series.graph',
+
+    init: function (option) {
+        GraphSeries.superApply(this, 'init', arguments);
+
+        // Provide data for legend select
+        this.legendDataProvider = function () {
+            return this._categoriesData;
+        };
+
+        this.fillDataTextStyle(option.edges || option.links);
+
+        this._updateCategoriesData();
+    },
+
+    mergeOption: function (option) {
+        GraphSeries.superApply(this, 'mergeOption', arguments);
+
+        this.fillDataTextStyle(option.edges || option.links);
+
+        this._updateCategoriesData();
+    },
+
+    mergeDefaultAndTheme: function (option) {
+        GraphSeries.superApply(this, 'mergeDefaultAndTheme', arguments);
+        defaultEmphasis(option, ['edgeLabel'], ['show']);
+    },
+
+    getInitialData: function (option, ecModel) {
+        var edges = option.edges || option.links || [];
+        var nodes = option.data || option.nodes || [];
+        var self = this;
+
+        if (nodes && edges) {
+            return createGraphFromNodeEdge(nodes, edges, this, true, beforeLink).data;
+        }
+
+        function beforeLink(nodeData, edgeData) {
+            // Overwrite nodeData.getItemModel to
+            nodeData.wrapMethod('getItemModel', function (model) {
+                var categoriesModels = self._categoriesModels;
+                var categoryIdx = model.getShallow('category');
+                var categoryModel = categoriesModels[categoryIdx];
+                if (categoryModel) {
+                    categoryModel.parentModel = model.parentModel;
+                    model.parentModel = categoryModel;
+                }
+                return model;
+            });
+
+            var edgeLabelModel = self.getModel('edgeLabel');
+            // For option `edgeLabel` can be found by label.xxx.xxx on item mode.
+            var fakeSeriesModel = new Model(
+                {label: edgeLabelModel.option},
+                edgeLabelModel.parentModel,
+                ecModel
+            );
+            var emphasisEdgeLabelModel = self.getModel('emphasis.edgeLabel');
+            var emphasisFakeSeriesModel = new Model(
+                {emphasis: {label: emphasisEdgeLabelModel.option}},
+                emphasisEdgeLabelModel.parentModel,
+                ecModel
+            );
+
+            edgeData.wrapMethod('getItemModel', function (model) {
+                model.customizeGetParent(edgeGetParent);
+                return model;
+            });
+
+            function edgeGetParent(path) {
+                path = this.parsePath(path);
+                return (path && path[0] === 'label')
+                    ? fakeSeriesModel
+                    : (path && path[0] === 'emphasis' && path[1] === 'label')
+                    ? emphasisFakeSeriesModel
+                    : this.parentModel;
+            }
+        }
+    },
+
+    /**
+     * @return {module:echarts/data/Graph}
+     */
+    getGraph: function () {
+        return this.getData().graph;
+    },
+
+    /**
+     * @return {module:echarts/data/List}
+     */
+    getEdgeData: function () {
+        return this.getGraph().edgeData;
+    },
+
+    /**
+     * @return {module:echarts/data/List}
+     */
+    getCategoriesData: function () {
+        return this._categoriesData;
+    },
+
+    /**
+     * @override
+     */
+    formatTooltip: function (dataIndex, multipleSeries, dataType) {
+        if (dataType === 'edge') {
+            var nodeData = this.getData();
+            var params = this.getDataParams(dataIndex, dataType);
+            var edge = nodeData.graph.getEdgeByIndex(dataIndex);
+            var sourceName = nodeData.getName(edge.node1.dataIndex);
+            var targetName = nodeData.getName(edge.node2.dataIndex);
+
+            var html = [];
+            sourceName != null && html.push(sourceName);
+            targetName != null && html.push(targetName);
+            html = encodeHTML(html.join(' > '));
+
+            if (params.value) {
+                html += ' : ' + encodeHTML(params.value);
+            }
+            return html;
+        }
+        else { // dataType === 'node' or empty
+            return GraphSeries.superApply(this, 'formatTooltip', arguments);
+        }
+    },
+
+    _updateCategoriesData: function () {
+        var categories = map(this.option.categories || [], function (category) {
+            // Data must has value
+            return category.value != null ? category : extend({
+                value: 0
+            }, category);
+        });
+        var categoriesData = new List(['value'], this);
+        categoriesData.initData(categories);
+
+        this._categoriesData = categoriesData;
+
+        this._categoriesModels = categoriesData.mapArray(function (idx) {
+            return categoriesData.getItemModel(idx, true);
+        });
+    },
+
+    setZoom: function (zoom) {
+        this.option.zoom = zoom;
+    },
+
+    setCenter: function (center) {
+        this.option.center = center;
+    },
+
+    isAnimationEnabled: function () {
+        return GraphSeries.superCall(this, 'isAnimationEnabled')
+            // Not enable animation when do force layout
+            && !(this.get('layout') === 'force' && this.get('force.layoutAnimation'));
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        coordinateSystem: 'view',
+
+        // Default option for all coordinate systems
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+        // polarIndex: 0,
+        // geoIndex: 0,
+
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+
+        layout: null,
+
+        focusNodeAdjacency: false,
+
+        // Configuration of circular layout
+        circular: {
+            rotateLabel: false
+        },
+        // Configuration of force directed layout
+        force: {
+            initLayout: null,
+            // Node repulsion. Can be an array to represent range.
+            repulsion: [0, 50],
+            gravity: 0.1,
+
+            // Edge length. Can be an array to represent range.
+            edgeLength: 30,
+
+            layoutAnimation: true
+        },
+
+        left: 'center',
+        top: 'center',
+        // right: null,
+        // bottom: null,
+        // width: '80%',
+        // height: '80%',
+
+        symbol: 'circle',
+        symbolSize: 10,
+
+        edgeSymbol: ['none', 'none'],
+        edgeSymbolSize: 10,
+        edgeLabel: {
+            position: 'middle'
+        },
+
+        draggable: false,
+
+        roam: false,
+
+        // Default on center of graph
+        center: null,
+
+        zoom: 1,
+        // Symbol size scale ratio in roam
+        nodeScaleRatio: 0.6,
+        // cursor: null,
+
+        // categories: [],
+
+        // data: []
+        // Or
+        // nodes: []
+        //
+        // links: []
+        // Or
+        // edges: []
+
+        label: {
+            show: false,
+            formatter: '{b}'
+        },
+
+        itemStyle: {},
+
+        lineStyle: {
+            color: '#aaa',
+            width: 1,
+            curveness: 0,
+            opacity: 0.5
+        },
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Line path for bezier and straight line draw
+ */
+
+var straightLineProto = Line.prototype;
+var bezierCurveProto = BezierCurve.prototype;
+
+function isLine(shape) {
+    return isNaN(+shape.cpx1) || isNaN(+shape.cpy1);
+}
+
+var LinePath = extendShape({
+
+    type: 'ec-line',
+
+    style: {
+        stroke: '#000',
+        fill: null
+    },
+
+    shape: {
+        x1: 0,
+        y1: 0,
+        x2: 0,
+        y2: 0,
+        percent: 1,
+        cpx1: null,
+        cpy1: null
+    },
+
+    buildPath: function (ctx, shape) {
+        (isLine(shape) ? straightLineProto : bezierCurveProto).buildPath(ctx, shape);
+    },
+
+    pointAt: function (t) {
+        return isLine(this.shape)
+            ? straightLineProto.pointAt.call(this, t)
+            : bezierCurveProto.pointAt.call(this, t);
+    },
+
+    tangentAt: function (t) {
+        var shape = this.shape;
+        var p = isLine(shape)
+            ? [shape.x2 - shape.x1, shape.y2 - shape.y1]
+            : bezierCurveProto.tangentAt.call(this, t);
+        return normalize(p, p);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/Line
+ */
+
+var SYMBOL_CATEGORIES = ['fromSymbol', 'toSymbol'];
+
+function makeSymbolTypeKey(symbolCategory) {
+    return '_' + symbolCategory + 'Type';
+}
+/**
+ * @inner
+ */
+function createSymbol$1(name, lineData, idx) {
+    var color = lineData.getItemVisual(idx, 'color');
+    var symbolType = lineData.getItemVisual(idx, name);
+    var symbolSize = lineData.getItemVisual(idx, name + 'Size');
+
+    if (!symbolType || symbolType === 'none') {
+        return;
+    }
+
+    if (!isArray(symbolSize)) {
+        symbolSize = [symbolSize, symbolSize];
+    }
+    var symbolPath = createSymbol(
+        symbolType, -symbolSize[0] / 2, -symbolSize[1] / 2,
+        symbolSize[0], symbolSize[1], color
+    );
+
+    symbolPath.name = name;
+
+    return symbolPath;
+}
+
+function createLine(points) {
+    var line = new LinePath({
+        name: 'line'
+    });
+    setLinePoints(line.shape, points);
+    return line;
+}
+
+function setLinePoints(targetShape, points) {
+    var p1 = points[0];
+    var p2 = points[1];
+    var cp1 = points[2];
+    targetShape.x1 = p1[0];
+    targetShape.y1 = p1[1];
+    targetShape.x2 = p2[0];
+    targetShape.y2 = p2[1];
+    targetShape.percent = 1;
+
+    if (cp1) {
+        targetShape.cpx1 = cp1[0];
+        targetShape.cpy1 = cp1[1];
+    }
+    else {
+        targetShape.cpx1 = NaN;
+        targetShape.cpy1 = NaN;
+    }
+}
+
+function updateSymbolAndLabelBeforeLineUpdate () {
+    var lineGroup = this;
+    var symbolFrom = lineGroup.childOfName('fromSymbol');
+    var symbolTo = lineGroup.childOfName('toSymbol');
+    var label = lineGroup.childOfName('label');
+    // Quick reject
+    if (!symbolFrom && !symbolTo && label.ignore) {
+        return;
+    }
+
+    var invScale = 1;
+    var parentNode = this.parent;
+    while (parentNode) {
+        if (parentNode.scale) {
+            invScale /= parentNode.scale[0];
+        }
+        parentNode = parentNode.parent;
+    }
+
+    var line = lineGroup.childOfName('line');
+    // If line not changed
+    // FIXME Parent scale changed
+    if (!this.__dirty && !line.__dirty) {
+        return;
+    }
+
+    var percent = line.shape.percent;
+    var fromPos = line.pointAt(0);
+    var toPos = line.pointAt(percent);
+
+    var d = sub([], toPos, fromPos);
+    normalize(d, d);
+
+    if (symbolFrom) {
+        symbolFrom.attr('position', fromPos);
+        var tangent = line.tangentAt(0);
+        symbolFrom.attr('rotation', Math.PI / 2 - Math.atan2(
+            tangent[1], tangent[0]
+        ));
+        symbolFrom.attr('scale', [invScale * percent, invScale * percent]);
+    }
+    if (symbolTo) {
+        symbolTo.attr('position', toPos);
+        var tangent = line.tangentAt(1);
+        symbolTo.attr('rotation', -Math.PI / 2 - Math.atan2(
+            tangent[1], tangent[0]
+        ));
+        symbolTo.attr('scale', [invScale * percent, invScale * percent]);
+    }
+
+    if (!label.ignore) {
+        label.attr('position', toPos);
+
+        var textPosition;
+        var textAlign;
+        var textVerticalAlign;
+
+        var distance$$1 = 5 * invScale;
+        // End
+        if (label.__position === 'end') {
+            textPosition = [d[0] * distance$$1 + toPos[0], d[1] * distance$$1 + toPos[1]];
+            textAlign = d[0] > 0.8 ? 'left' : (d[0] < -0.8 ? 'right' : 'center');
+            textVerticalAlign = d[1] > 0.8 ? 'top' : (d[1] < -0.8 ? 'bottom' : 'middle');
+        }
+        // Middle
+        else if (label.__position === 'middle') {
+            var halfPercent = percent / 2;
+            var tangent = line.tangentAt(halfPercent);
+            var n = [tangent[1], -tangent[0]];
+            var cp = line.pointAt(halfPercent);
+            if (n[1] > 0) {
+                n[0] = -n[0];
+                n[1] = -n[1];
+            }
+            textPosition = [cp[0] + n[0] * distance$$1, cp[1] + n[1] * distance$$1];
+            textAlign = 'center';
+            textVerticalAlign = 'bottom';
+            var rotation = -Math.atan2(tangent[1], tangent[0]);
+            if (toPos[0] < fromPos[0]) {
+                rotation = Math.PI + rotation;
+            }
+            label.attr('rotation', rotation);
+        }
+        // Start
+        else {
+            textPosition = [-d[0] * distance$$1 + fromPos[0], -d[1] * distance$$1 + fromPos[1]];
+            textAlign = d[0] > 0.8 ? 'right' : (d[0] < -0.8 ? 'left' : 'center');
+            textVerticalAlign = d[1] > 0.8 ? 'bottom' : (d[1] < -0.8 ? 'top' : 'middle');
+        }
+        label.attr({
+            style: {
+                // Use the user specified text align and baseline first
+                textVerticalAlign: label.__verticalAlign || textVerticalAlign,
+                textAlign: label.__textAlign || textAlign
+            },
+            position: textPosition,
+            scale: [invScale, invScale]
+        });
+    }
+}
+
+/**
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ * @alias {module:echarts/chart/helper/Line}
+ */
+function Line$1(lineData, idx, seriesScope) {
+    Group.call(this);
+
+    this._createLine(lineData, idx, seriesScope);
+}
+
+var lineProto = Line$1.prototype;
+
+// Update symbol position and rotation
+lineProto.beforeUpdate = updateSymbolAndLabelBeforeLineUpdate;
+
+lineProto._createLine = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+    var linePoints = lineData.getItemLayout(idx);
+
+    var line = createLine(linePoints);
+    line.shape.percent = 0;
+    initProps(line, {
+        shape: {
+            percent: 1
+        }
+    }, seriesModel, idx);
+
+    this.add(line);
+
+    var label = new Text({
+        name: 'label'
+    });
+    this.add(label);
+
+    each$1(SYMBOL_CATEGORIES, function (symbolCategory) {
+        var symbol = createSymbol$1(symbolCategory, lineData, idx);
+        // symbols must added after line to make sure
+        // it will be updated after line#update.
+        // Or symbol position and rotation update in line#beforeUpdate will be one frame slow
+        this.add(symbol);
+        this[makeSymbolTypeKey(symbolCategory)] = lineData.getItemVisual(idx, symbolCategory);
+    }, this);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+lineProto.updateData = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+
+    var line = this.childOfName('line');
+    var linePoints = lineData.getItemLayout(idx);
+    var target = {
+        shape: {}
+    };
+    setLinePoints(target.shape, linePoints);
+    updateProps(line, target, seriesModel, idx);
+
+    each$1(SYMBOL_CATEGORIES, function (symbolCategory) {
+        var symbolType = lineData.getItemVisual(idx, symbolCategory);
+        var key = makeSymbolTypeKey(symbolCategory);
+        // Symbol changed
+        if (this[key] !== symbolType) {
+            this.remove(this.childOfName(symbolCategory));
+            var symbol = createSymbol$1(symbolCategory, lineData, idx);
+            this.add(symbol);
+        }
+        this[key] = symbolType;
+    }, this);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+lineProto._updateCommonStl = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+
+    var line = this.childOfName('line');
+
+    var lineStyle = seriesScope && seriesScope.lineStyle;
+    var hoverLineStyle = seriesScope && seriesScope.hoverLineStyle;
+    var labelModel = seriesScope && seriesScope.labelModel;
+    var hoverLabelModel = seriesScope && seriesScope.hoverLabelModel;
+
+    // Optimization for large dataset
+    if (!seriesScope || lineData.hasItemOption) {
+        var itemModel = lineData.getItemModel(idx);
+
+        lineStyle = itemModel.getModel('lineStyle').getLineStyle();
+        hoverLineStyle = itemModel.getModel('emphasis.lineStyle').getLineStyle();
+
+        labelModel = itemModel.getModel('label');
+        hoverLabelModel = itemModel.getModel('emphasis.label');
+    }
+
+    var visualColor = lineData.getItemVisual(idx, 'color');
+    var visualOpacity = retrieve3(
+        lineData.getItemVisual(idx, 'opacity'),
+        lineStyle.opacity,
+        1
+    );
+
+    line.useStyle(defaults(
+        {
+            strokeNoScale: true,
+            fill: 'none',
+            stroke: visualColor,
+            opacity: visualOpacity
+        },
+        lineStyle
+    ));
+    line.hoverStyle = hoverLineStyle;
+
+    // Update symbol
+    each$1(SYMBOL_CATEGORIES, function (symbolCategory) {
+        var symbol = this.childOfName(symbolCategory);
+        if (symbol) {
+            symbol.setColor(visualColor);
+            symbol.setStyle({
+                opacity: visualOpacity
+            });
+        }
+    }, this);
+
+    var showLabel = labelModel.getShallow('show');
+    var hoverShowLabel = hoverLabelModel.getShallow('show');
+
+    var label = this.childOfName('label');
+    var defaultLabelColor;
+    var baseText;
+
+    // FIXME: the logic below probably should be merged to `graphic.setLabelStyle`.
+    if (showLabel || hoverShowLabel) {
+        defaultLabelColor = visualColor || '#000';
+
+        baseText = seriesModel.getFormattedLabel(idx, 'normal', lineData.dataType);
+        if (baseText == null) {
+            var rawVal = seriesModel.getRawValue(idx);
+            baseText = rawVal == null
+                ? lineData.getName(idx)
+                : isFinite(rawVal)
+                ? round$1(rawVal)
+                : rawVal;
+        }
+    }
+    var normalText = showLabel ? baseText : null;
+    var emphasisText = hoverShowLabel
+        ? retrieve2(
+            seriesModel.getFormattedLabel(idx, 'emphasis', lineData.dataType),
+            baseText
+        )
+        : null;
+
+    var labelStyle = label.style;
+
+    // Always set `textStyle` even if `normalStyle.text` is null, because default
+    // values have to be set on `normalStyle`.
+    if (normalText != null || emphasisText != null) {
+        setTextStyle(label.style, labelModel, {
+            text: normalText
+        }, {
+            autoColor: defaultLabelColor
+        });
+
+        label.__textAlign = labelStyle.textAlign;
+        label.__verticalAlign = labelStyle.textVerticalAlign;
+        // 'start', 'middle', 'end'
+        label.__position = labelModel.get('position') || 'middle';
+    }
+
+    if (emphasisText != null) {
+        // Only these properties supported in this emphasis style here.
+        label.hoverStyle = {
+            text: emphasisText,
+            textFill: hoverLabelModel.getTextColor(true),
+            // For merging hover style to normal style, do not use
+            // `hoverLabelModel.getFont()` here.
+            fontStyle: hoverLabelModel.getShallow('fontStyle'),
+            fontWeight: hoverLabelModel.getShallow('fontWeight'),
+            fontSize: hoverLabelModel.getShallow('fontSize'),
+            fontFamily: hoverLabelModel.getShallow('fontFamily')
+        };
+    }
+    else {
+        label.hoverStyle = {
+            text: null
+        };
+    }
+
+    label.ignore = !showLabel && !hoverShowLabel;
+
+    setHoverStyle(this);
+};
+
+lineProto.highlight = function () {
+    this.trigger('emphasis');
+};
+
+lineProto.downplay = function () {
+    this.trigger('normal');
+};
+
+lineProto.updateLayout = function (lineData, idx) {
+    this.setLinePoints(lineData.getItemLayout(idx));
+};
+
+lineProto.setLinePoints = function (points) {
+    var linePath = this.childOfName('line');
+    setLinePoints(linePath.shape, points);
+    linePath.dirty();
+};
+
+inherits(Line$1, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/LineDraw
+ */
+
+// import IncrementalDisplayable from 'zrender/src/graphic/IncrementalDisplayable';
+
+/**
+ * @alias module:echarts/component/marker/LineDraw
+ * @constructor
+ */
+function LineDraw(ctor) {
+    this._ctor = ctor || Line$1;
+
+    this.group = new Group();
+}
+
+var lineDrawProto = LineDraw.prototype;
+
+lineDrawProto.isPersistent = function () {
+    return true;
+};
+
+/**
+ * @param {module:echarts/data/List} lineData
+ */
+lineDrawProto.updateData = function (lineData) {
+    var lineDraw = this;
+    var group = lineDraw.group;
+
+    var oldLineData = lineDraw._lineData;
+    lineDraw._lineData = lineData;
+
+    // There is no oldLineData only when first rendering or switching from
+    // stream mode to normal mode, where previous elements should be removed.
+    if (!oldLineData) {
+        group.removeAll();
+    }
+
+    var seriesScope = makeSeriesScope$1(lineData);
+
+    lineData.diff(oldLineData)
+        .add(function (idx) {
+            doAdd(lineDraw, lineData, idx, seriesScope);
+        })
+        .update(function (newIdx, oldIdx) {
+            doUpdate(lineDraw, oldLineData, lineData, oldIdx, newIdx, seriesScope);
+        })
+        .remove(function (idx) {
+            group.remove(oldLineData.getItemGraphicEl(idx));
+        })
+        .execute();
+};
+
+function doAdd(lineDraw, lineData, idx, seriesScope) {
+    var itemLayout = lineData.getItemLayout(idx);
+
+    if (!lineNeedsDraw(itemLayout)) {
+        return;
+    }
+
+    var el = new lineDraw._ctor(lineData, idx, seriesScope);
+    lineData.setItemGraphicEl(idx, el);
+    lineDraw.group.add(el);
+}
+
+function doUpdate(lineDraw, oldLineData, newLineData, oldIdx, newIdx, seriesScope) {
+    var itemEl = oldLineData.getItemGraphicEl(oldIdx);
+
+    if (!lineNeedsDraw(newLineData.getItemLayout(newIdx))) {
+        lineDraw.group.remove(itemEl);
+        return;
+    }
+
+    if (!itemEl) {
+        itemEl = new lineDraw._ctor(newLineData, newIdx, seriesScope);
+    }
+    else {
+        itemEl.updateData(newLineData, newIdx, seriesScope);
+    }
+
+    newLineData.setItemGraphicEl(newIdx, itemEl);
+
+    lineDraw.group.add(itemEl);
+}
+
+lineDrawProto.updateLayout = function () {
+    var lineData = this._lineData;
+
+    // Do not support update layout in incremental mode.
+    if (!lineData) {
+        return;
+    }
+
+    lineData.eachItemGraphicEl(function (el, idx) {
+        el.updateLayout(lineData, idx);
+    }, this);
+};
+
+lineDrawProto.incrementalPrepareUpdate = function (lineData) {
+    this._seriesScope = makeSeriesScope$1(lineData);
+    this._lineData = null;
+    this.group.removeAll();
+};
+
+lineDrawProto.incrementalUpdate = function (taskParams, lineData) {
+    function updateIncrementalAndHover(el) {
+        if (!el.isGroup) {
+            el.incremental = el.useHoverLayer = true;
+        }
+    }
+
+    for (var idx = taskParams.start; idx < taskParams.end; idx++) {
+        var itemLayout = lineData.getItemLayout(idx);
+
+        if (lineNeedsDraw(itemLayout)) {
+            var el = new this._ctor(lineData, idx, this._seriesScope);
+            el.traverse(updateIncrementalAndHover);
+
+            this.group.add(el);
+            lineData.setItemGraphicEl(idx, el);
+        }
+    }
+};
+
+function makeSeriesScope$1(lineData) {
+    var hostModel = lineData.hostModel;
+    return {
+        lineStyle: hostModel.getModel('lineStyle').getLineStyle(),
+        hoverLineStyle: hostModel.getModel('emphasis.lineStyle').getLineStyle(),
+        labelModel: hostModel.getModel('label'),
+        hoverLabelModel: hostModel.getModel('emphasis.label')
+    };
+}
+
+lineDrawProto.remove = function () {
+    this._clearIncremental();
+    this._incremental = null;
+    this.group.removeAll();
+};
+
+lineDrawProto._clearIncremental = function () {
+    var incremental = this._incremental;
+    if (incremental) {
+        incremental.clearDisplaybles();
+    }
+};
+
+function isPointNaN(pt) {
+    return isNaN(pt[0]) || isNaN(pt[1]);
+}
+
+function lineNeedsDraw(pts) {
+    return !isPointNaN(pts[0]) && !isPointNaN(pts[1]);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var v1 = [];
+var v2 = [];
+var v3 = [];
+var quadraticAt$1 = quadraticAt;
+var v2DistSquare = distSquare;
+var mathAbs$1 = Math.abs;
+function intersectCurveCircle(curvePoints, center, radius) {
+    var p0 = curvePoints[0];
+    var p1 = curvePoints[1];
+    var p2 = curvePoints[2];
+
+    var d = Infinity;
+    var t;
+    var radiusSquare = radius * radius;
+    var interval = 0.1;
+
+    for (var _t = 0.1; _t <= 0.9; _t += 0.1) {
+        v1[0] = quadraticAt$1(p0[0], p1[0], p2[0], _t);
+        v1[1] = quadraticAt$1(p0[1], p1[1], p2[1], _t);
+        var diff = mathAbs$1(v2DistSquare(v1, center) - radiusSquare);
+        if (diff < d) {
+            d = diff;
+            t = _t;
+        }
+    }
+
+    // Assume the segment is monotone，Find root through Bisection method
+    // At most 32 iteration
+    for (var i = 0; i < 32; i++) {
+        // var prev = t - interval;
+        var next = t + interval;
+        // v1[0] = quadraticAt(p0[0], p1[0], p2[0], prev);
+        // v1[1] = quadraticAt(p0[1], p1[1], p2[1], prev);
+        v2[0] = quadraticAt$1(p0[0], p1[0], p2[0], t);
+        v2[1] = quadraticAt$1(p0[1], p1[1], p2[1], t);
+        v3[0] = quadraticAt$1(p0[0], p1[0], p2[0], next);
+        v3[1] = quadraticAt$1(p0[1], p1[1], p2[1], next);
+
+        var diff = v2DistSquare(v2, center) - radiusSquare;
+        if (mathAbs$1(diff) < 1e-2) {
+            break;
+        }
+
+        // var prevDiff = v2DistSquare(v1, center) - radiusSquare;
+        var nextDiff = v2DistSquare(v3, center) - radiusSquare;
+
+        interval /= 2;
+        if (diff < 0) {
+            if (nextDiff >= 0) {
+                t = t + interval;
+            }
+            else {
+                t = t - interval;
+            }
+        }
+        else {
+            if (nextDiff >= 0) {
+                t = t - interval;
+            }
+            else {
+                t = t + interval;
+            }
+        }
+    }
+
+    return t;
+}
+
+// Adjust edge to avoid
+var adjustEdge = function (graph, scale$$1) {
+    var tmp0 = [];
+    var quadraticSubdivide$$1 = quadraticSubdivide;
+    var pts = [[], [], []];
+    var pts2 = [[], []];
+    var v = [];
+    scale$$1 /= 2;
+
+    function getSymbolSize(node) {
+        var symbolSize = node.getVisual('symbolSize');
+        if (symbolSize instanceof Array) {
+            symbolSize = (symbolSize[0] + symbolSize[1]) / 2;
+        }
+        return symbolSize;
+    }
+    graph.eachEdge(function (edge, idx) {
+        var linePoints = edge.getLayout();
+        var fromSymbol = edge.getVisual('fromSymbol');
+        var toSymbol = edge.getVisual('toSymbol');
+
+        if (!linePoints.__original) {
+            linePoints.__original = [
+                clone$1(linePoints[0]),
+                clone$1(linePoints[1])
+            ];
+            if (linePoints[2]) {
+                linePoints.__original.push(clone$1(linePoints[2]));
+            }
+        }
+        var originalPoints = linePoints.__original;
+        // Quadratic curve
+        if (linePoints[2] != null) {
+            copy(pts[0], originalPoints[0]);
+            copy(pts[1], originalPoints[2]);
+            copy(pts[2], originalPoints[1]);
+            if (fromSymbol && fromSymbol != 'none') {
+                var symbolSize = getSymbolSize(edge.node1);
+
+                var t = intersectCurveCircle(pts, originalPoints[0], symbolSize * scale$$1);
+                // Subdivide and get the second
+                quadraticSubdivide$$1(pts[0][0], pts[1][0], pts[2][0], t, tmp0);
+                pts[0][0] = tmp0[3];
+                pts[1][0] = tmp0[4];
+                quadraticSubdivide$$1(pts[0][1], pts[1][1], pts[2][1], t, tmp0);
+                pts[0][1] = tmp0[3];
+                pts[1][1] = tmp0[4];
+            }
+            if (toSymbol && toSymbol != 'none') {
+                var symbolSize = getSymbolSize(edge.node2);
+
+                var t = intersectCurveCircle(pts, originalPoints[1], symbolSize * scale$$1);
+                // Subdivide and get the first
+                quadraticSubdivide$$1(pts[0][0], pts[1][0], pts[2][0], t, tmp0);
+                pts[1][0] = tmp0[1];
+                pts[2][0] = tmp0[2];
+                quadraticSubdivide$$1(pts[0][1], pts[1][1], pts[2][1], t, tmp0);
+                pts[1][1] = tmp0[1];
+                pts[2][1] = tmp0[2];
+            }
+            // Copy back to layout
+            copy(linePoints[0], pts[0]);
+            copy(linePoints[1], pts[2]);
+            copy(linePoints[2], pts[1]);
+        }
+        // Line
+        else {
+            copy(pts2[0], originalPoints[0]);
+            copy(pts2[1], originalPoints[1]);
+
+            sub(v, pts2[1], pts2[0]);
+            normalize(v, v);
+            if (fromSymbol && fromSymbol != 'none') {
+
+                var symbolSize = getSymbolSize(edge.node1);
+
+                scaleAndAdd(pts2[0], pts2[0], v, symbolSize * scale$$1);
+            }
+            if (toSymbol && toSymbol != 'none') {
+                var symbolSize = getSymbolSize(edge.node2);
+
+                scaleAndAdd(pts2[1], pts2[1], v, -symbolSize * scale$$1);
+            }
+            copy(linePoints[0], pts2[0]);
+            copy(linePoints[1], pts2[1]);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var nodeOpacityPath = ['itemStyle', 'opacity'];
+var lineOpacityPath = ['lineStyle', 'opacity'];
+
+function getItemOpacity(item, opacityPath) {
+    return item.getVisual('opacity') || item.getModel().get(opacityPath);
+}
+
+function fadeOutItem(item, opacityPath, opacityRatio) {
+    var el = item.getGraphicEl();
+
+    var opacity = getItemOpacity(item, opacityPath);
+    if (opacityRatio != null) {
+        opacity == null && (opacity = 1);
+        opacity *= opacityRatio;
+    }
+
+    el.downplay && el.downplay();
+    el.traverse(function (child) {
+        if (child.type !== 'group') {
+            child.setStyle('opacity', opacity);
+        }
+    });
+}
+
+function fadeInItem(item, opacityPath) {
+    var opacity = getItemOpacity(item, opacityPath);
+    var el = item.getGraphicEl();
+
+    el.highlight && el.highlight();
+    el.traverse(function (child) {
+        if (child.type !== 'group') {
+            child.setStyle('opacity', opacity);
+        }
+    });
+}
+
+extendChartView({
+
+    type: 'graph',
+
+    init: function (ecModel, api) {
+        var symbolDraw = new SymbolDraw();
+        var lineDraw = new LineDraw();
+        var group = this.group;
+
+        this._controller = new RoamController(api.getZr());
+        this._controllerHost = {target: group};
+
+        group.add(symbolDraw.group);
+        group.add(lineDraw.group);
+
+        this._symbolDraw = symbolDraw;
+        this._lineDraw = lineDraw;
+
+        this._firstRender = true;
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+
+        this._model = seriesModel;
+        this._nodeScaleRatio = seriesModel.get('nodeScaleRatio');
+
+        var symbolDraw = this._symbolDraw;
+        var lineDraw = this._lineDraw;
+
+        var group = this.group;
+
+        if (coordSys.type === 'view') {
+            var groupNewProp = {
+                position: coordSys.position,
+                scale: coordSys.scale
+            };
+            if (this._firstRender) {
+                group.attr(groupNewProp);
+            }
+            else {
+                updateProps(group, groupNewProp, seriesModel);
+            }
+        }
+        // Fix edge contact point with node
+        adjustEdge(seriesModel.getGraph(), this._getNodeGlobalScale(seriesModel));
+
+        var data = seriesModel.getData();
+        symbolDraw.updateData(data);
+
+        var edgeData = seriesModel.getEdgeData();
+        lineDraw.updateData(edgeData);
+
+        this._updateNodeAndLinkScale();
+
+        this._updateController(seriesModel, ecModel, api);
+
+        clearTimeout(this._layoutTimeout);
+        var forceLayout = seriesModel.forceLayout;
+        var layoutAnimation = seriesModel.get('force.layoutAnimation');
+        if (forceLayout) {
+            this._startForceLayoutIteration(forceLayout, layoutAnimation);
+        }
+
+        data.eachItemGraphicEl(function (el, idx) {
+            var itemModel = data.getItemModel(idx);
+            // Update draggable
+            el.off('drag').off('dragend');
+            var draggable = data.getItemModel(idx).get('draggable');
+            if (draggable) {
+                el.on('drag', function () {
+                    if (forceLayout) {
+                        forceLayout.warmUp();
+                        !this._layouting
+                            && this._startForceLayoutIteration(forceLayout, layoutAnimation);
+                        forceLayout.setFixed(idx);
+                        // Write position back to layout
+                        data.setItemLayout(idx, el.position);
+                    }
+                }, this).on('dragend', function () {
+                    if (forceLayout) {
+                        forceLayout.setUnfixed(idx);
+                    }
+                }, this);
+            }
+            el.setDraggable(draggable && forceLayout);
+
+            el.off('mouseover', el.__focusNodeAdjacency);
+            el.off('mouseout', el.__unfocusNodeAdjacency);
+
+            if (itemModel.get('focusNodeAdjacency')) {
+                el.on('mouseover', el.__focusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'focusNodeAdjacency',
+                        seriesId: seriesModel.id,
+                        dataIndex: el.dataIndex
+                    });
+                });
+                el.on('mouseout', el.__unfocusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'unfocusNodeAdjacency',
+                        seriesId: seriesModel.id
+                    });
+                });
+
+            }
+
+        }, this);
+
+        data.graph.eachEdge(function (edge) {
+            var el = edge.getGraphicEl();
+
+            el.off('mouseover', el.__focusNodeAdjacency);
+            el.off('mouseout', el.__unfocusNodeAdjacency);
+
+            if (edge.getModel().get('focusNodeAdjacency')) {
+                el.on('mouseover', el.__focusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'focusNodeAdjacency',
+                        seriesId: seriesModel.id,
+                        edgeDataIndex: edge.dataIndex
+                    });
+                });
+                el.on('mouseout', el.__unfocusNodeAdjacency = function () {
+                    api.dispatchAction({
+                        type: 'unfocusNodeAdjacency',
+                        seriesId: seriesModel.id
+                    });
+                });
+            }
+        });
+
+        var circularRotateLabel = seriesModel.get('layout') === 'circular'
+            && seriesModel.get('circular.rotateLabel');
+        var cx = data.getLayout('cx');
+        var cy = data.getLayout('cy');
+        data.eachItemGraphicEl(function (el, idx) {
+            var symbolPath = el.getSymbolPath();
+            if (circularRotateLabel) {
+                var pos = data.getItemLayout(idx);
+                var rad = Math.atan2(pos[1] - cy, pos[0] - cx);
+                if (rad < 0) {
+                    rad = Math.PI * 2 + rad;
+                }
+                var isLeft = pos[0] < cx;
+                if (isLeft) {
+                    rad = rad - Math.PI;
+                }
+                var textPosition = isLeft ? 'left' : 'right';
+                symbolPath.setStyle({
+                    textRotation: -rad,
+                    textPosition: textPosition,
+                    textOrigin: 'center'
+                });
+                symbolPath.hoverStyle && (symbolPath.hoverStyle.textPosition = textPosition);
+            }
+            else {
+                symbolPath.setStyle({
+                    textRotation: 0
+                });
+            }
+        });
+
+        this._firstRender = false;
+    },
+
+    dispose: function () {
+        this._controller && this._controller.dispose();
+        this._controllerHost = {};
+    },
+
+    focusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
+        var data = this._model.getData();
+        var graph = data.graph;
+        var dataIndex = payload.dataIndex;
+        var edgeDataIndex = payload.edgeDataIndex;
+
+        var node = graph.getNodeByIndex(dataIndex);
+        var edge = graph.getEdgeByIndex(edgeDataIndex);
+
+        if (!node && !edge) {
+            return;
+        }
+
+        graph.eachNode(function (node) {
+            fadeOutItem(node, nodeOpacityPath, 0.1);
+        });
+        graph.eachEdge(function (edge) {
+            fadeOutItem(edge, lineOpacityPath, 0.1);
+        });
+
+        if (node) {
+            fadeInItem(node, nodeOpacityPath);
+            each$1(node.edges, function (adjacentEdge) {
+                if (adjacentEdge.dataIndex < 0) {
+                    return;
+                }
+                fadeInItem(adjacentEdge, lineOpacityPath);
+                fadeInItem(adjacentEdge.node1, nodeOpacityPath);
+                fadeInItem(adjacentEdge.node2, nodeOpacityPath);
+            });
+        }
+        if (edge) {
+            fadeInItem(edge, lineOpacityPath);
+            fadeInItem(edge.node1, nodeOpacityPath);
+            fadeInItem(edge.node2, nodeOpacityPath);
+        }
+    },
+
+    unfocusNodeAdjacency: function (seriesModel, ecModel, api, payload) {
+        var graph = this._model.getData().graph;
+
+        graph.eachNode(function (node) {
+            fadeOutItem(node, nodeOpacityPath);
+        });
+        graph.eachEdge(function (edge) {
+            fadeOutItem(edge, lineOpacityPath);
+        });
+    },
+
+    _startForceLayoutIteration: function (forceLayout, layoutAnimation) {
+        var self = this;
+        (function step() {
+            forceLayout.step(function (stopped) {
+                self.updateLayout(self._model);
+                (self._layouting = !stopped) && (
+                    layoutAnimation
+                        ? (self._layoutTimeout = setTimeout(step, 16))
+                        : step()
+                );
+            });
+        })();
+    },
+
+    _updateController: function (seriesModel, ecModel, api) {
+        var controller = this._controller;
+        var controllerHost = this._controllerHost;
+        var group = this.group;
+
+        controller.setPointerChecker(function (e, x, y) {
+            var rect = group.getBoundingRect();
+            rect.applyTransform(group.transform);
+            return rect.contain(x, y)
+                && !onIrrelevantElement(e, api, seriesModel);
+        });
+
+        if (seriesModel.coordinateSystem.type !== 'view') {
+            controller.disable();
+            return;
+        }
+        controller.enable(seriesModel.get('roam'));
+        controllerHost.zoomLimit = seriesModel.get('scaleLimit');
+        controllerHost.zoom = seriesModel.coordinateSystem.getZoom();
+
+        controller
+            .off('pan')
+            .off('zoom')
+            .on('pan', function (dx, dy) {
+                updateViewOnPan(controllerHost, dx, dy);
+                api.dispatchAction({
+                    seriesId: seriesModel.id,
+                    type: 'graphRoam',
+                    dx: dx,
+                    dy: dy
+                });
+            })
+            .on('zoom', function (zoom, mouseX, mouseY) {
+                updateViewOnZoom(controllerHost, zoom, mouseX, mouseY);
+                api.dispatchAction({
+                    seriesId: seriesModel.id,
+                    type: 'graphRoam',
+                    zoom:  zoom,
+                    originX: mouseX,
+                    originY: mouseY
+                });
+                this._updateNodeAndLinkScale();
+                adjustEdge(seriesModel.getGraph(), this._getNodeGlobalScale(seriesModel));
+                this._lineDraw.updateLayout();
+            }, this);
+    },
+
+    _updateNodeAndLinkScale: function () {
+        var seriesModel = this._model;
+        var data = seriesModel.getData();
+
+        var nodeScale = this._getNodeGlobalScale(seriesModel);
+        var invScale = [nodeScale, nodeScale];
+
+        data.eachItemGraphicEl(function (el, idx) {
+            el.attr('scale', invScale);
+        });
+    },
+
+    _getNodeGlobalScale: function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys.type !== 'view') {
+            return 1;
+        }
+
+        var nodeScaleRatio = this._nodeScaleRatio;
+
+        var groupScale = coordSys.scale;
+        var groupZoom = (groupScale && groupScale[0]) || 1;
+        // Scale node when zoom changes
+        var roamZoom = coordSys.getZoom();
+        var nodeScale = (roamZoom - 1) * nodeScaleRatio + 1;
+
+        return nodeScale / groupZoom;
+    },
+
+    updateLayout: function (seriesModel) {
+        adjustEdge(seriesModel.getGraph(), this._getNodeGlobalScale(seriesModel));
+
+        this._symbolDraw.updateLayout();
+        this._lineDraw.updateLayout();
+    },
+
+    remove: function (ecModel, api) {
+        this._symbolDraw && this._symbolDraw.remove();
+        this._lineDraw && this._lineDraw.remove();
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var actionInfo = {
+    type: 'graphRoam',
+    event: 'graphRoam',
+    update: 'none'
+};
+
+/**
+ * @payload
+ * @property {string} name Series name
+ * @property {number} [dx]
+ * @property {number} [dy]
+ * @property {number} [zoom]
+ * @property {number} [originX]
+ * @property {number} [originY]
+ */
+registerAction(actionInfo, function (payload, ecModel) {
+    ecModel.eachComponent({mainType: 'series', query: payload}, function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+
+        var res = updateCenterAndZoom(coordSys, payload);
+
+        seriesModel.setCenter
+            && seriesModel.setCenter(res.center);
+
+        seriesModel.setZoom
+            && seriesModel.setZoom(res.zoom);
+    });
+});
+
+
+/**
+ * @payload
+ * @property {number} [seriesIndex]
+ * @property {string} [seriesId]
+ * @property {string} [seriesName]
+ * @property {number} [dataIndex]
+ */
+registerAction({
+    type: 'focusNodeAdjacency',
+    event: 'focusNodeAdjacency',
+    update: 'series.graph:focusNodeAdjacency'
+}, function () {});
+
+/**
+ * @payload
+ * @property {number} [seriesIndex]
+ * @property {string} [seriesId]
+ * @property {string} [seriesName]
+ */
+registerAction({
+    type: 'unfocusNodeAdjacency',
+    event: 'unfocusNodeAdjacency',
+    update: 'series.graph:unfocusNodeAdjacency'
+}, function () {});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var categoryFilter = function (ecModel) {
+    var legendModels = ecModel.findComponents({
+        mainType: 'legend'
+    });
+    if (!legendModels || !legendModels.length) {
+        return;
+    }
+    ecModel.eachSeriesByType('graph', function (graphSeries) {
+        var categoriesData = graphSeries.getCategoriesData();
+        var graph = graphSeries.getGraph();
+        var data = graph.data;
+
+        var categoryNames = categoriesData.mapArray(categoriesData.getName);
+
+        data.filterSelf(function (idx) {
+            var model = data.getItemModel(idx);
+            var category = model.getShallow('category');
+            if (category != null) {
+                if (typeof category === 'number') {
+                    category = categoryNames[category];
+                }
+                // If in any legend component the status is not selected.
+                for (var i = 0; i < legendModels.length; i++) {
+                    if (!legendModels[i].isSelected(category)) {
+                        return false;
+                    }
+                }
+            }
+            return true;
+        });
+    }, this);
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var categoryVisual = function (ecModel) {
+
+    var paletteScope = {};
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var categoriesData = seriesModel.getCategoriesData();
+        var data = seriesModel.getData();
+
+        var categoryNameIdxMap = {};
+
+        categoriesData.each(function (idx) {
+            var name = categoriesData.getName(idx);
+            // Add prefix to avoid conflict with Object.prototype.
+            categoryNameIdxMap['ec-' + name] = idx;
+
+            var itemModel = categoriesData.getItemModel(idx);
+            var color = itemModel.get('itemStyle.color')
+                || seriesModel.getColorFromPalette(name, paletteScope);
+            categoriesData.setItemVisual(idx, 'color', color);
+        });
+
+        // Assign category color to visual
+        if (categoriesData.count()) {
+            data.each(function (idx) {
+                var model = data.getItemModel(idx);
+                var category = model.getShallow('category');
+                if (category != null) {
+                    if (typeof category === 'string') {
+                        category = categoryNameIdxMap['ec-' + category];
+                    }
+                    if (!data.getItemVisual(idx, 'color', true)) {
+                        data.setItemVisual(
+                            idx, 'color',
+                            categoriesData.getItemVisual(category, 'color')
+                        );
+                    }
+                }
+            });
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function normalize$1(a) {
+    if (!(a instanceof Array)) {
+        a = [a, a];
+    }
+    return a;
+}
+
+var edgeVisual = function (ecModel) {
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var graph = seriesModel.getGraph();
+        var edgeData = seriesModel.getEdgeData();
+        var symbolType = normalize$1(seriesModel.get('edgeSymbol'));
+        var symbolSize = normalize$1(seriesModel.get('edgeSymbolSize'));
+
+        var colorQuery = 'lineStyle.color'.split('.');
+        var opacityQuery = 'lineStyle.opacity'.split('.');
+
+        edgeData.setVisual('fromSymbol', symbolType && symbolType[0]);
+        edgeData.setVisual('toSymbol', symbolType && symbolType[1]);
+        edgeData.setVisual('fromSymbolSize', symbolSize && symbolSize[0]);
+        edgeData.setVisual('toSymbolSize', symbolSize && symbolSize[1]);
+        edgeData.setVisual('color', seriesModel.get(colorQuery));
+        edgeData.setVisual('opacity', seriesModel.get(opacityQuery));
+
+        edgeData.each(function (idx) {
+            var itemModel = edgeData.getItemModel(idx);
+            var edge = graph.getEdgeByIndex(idx);
+            var symbolType = normalize$1(itemModel.getShallow('symbol', true));
+            var symbolSize = normalize$1(itemModel.getShallow('symbolSize', true));
+            // Edge visual must after node visual
+            var color = itemModel.get(colorQuery);
+            var opacity = itemModel.get(opacityQuery);
+            switch (color) {
+                case 'source':
+                    color = edge.node1.getVisual('color');
+                    break;
+                case 'target':
+                    color = edge.node2.getVisual('color');
+                    break;
+            }
+
+            symbolType[0] && edge.setVisual('fromSymbol', symbolType[0]);
+            symbolType[1] && edge.setVisual('toSymbol', symbolType[1]);
+            symbolSize[0] && edge.setVisual('fromSymbolSize', symbolSize[0]);
+            symbolSize[1] && edge.setVisual('toSymbolSize', symbolSize[1]);
+
+            edge.setVisual('color', color);
+            edge.setVisual('opacity', opacity);
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function simpleLayout$1(seriesModel) {
+    var coordSys = seriesModel.coordinateSystem;
+    if (coordSys && coordSys.type !== 'view') {
+        return;
+    }
+    var graph = seriesModel.getGraph();
+
+    graph.eachNode(function (node) {
+        var model = node.getModel();
+        node.setLayout([+model.get('x'), +model.get('y')]);
+    });
+
+    simpleLayoutEdge(graph);
+}
+
+function simpleLayoutEdge(graph) {
+    graph.eachEdge(function (edge) {
+        var curveness = edge.getModel().get('lineStyle.curveness') || 0;
+        var p1 = clone$1(edge.node1.getLayout());
+        var p2 = clone$1(edge.node2.getLayout());
+        var points = [p1, p2];
+        if (+curveness) {
+            points.push([
+                (p1[0] + p2[0]) / 2 - (p1[1] - p2[1]) * curveness,
+                (p1[1] + p2[1]) / 2 - (p2[0] - p1[0]) * curveness
+            ]);
+        }
+        edge.setLayout(points);
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var simpleLayout = function (ecModel, api) {
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var layout = seriesModel.get('layout');
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys && coordSys.type !== 'view') {
+            var data = seriesModel.getData();
+
+            var dimensions = [];
+            each$1(coordSys.dimensions, function (coordDim) {
+                dimensions = dimensions.concat(data.mapDimension(coordDim, true));
+            });
+
+            for (var dataIndex = 0; dataIndex < data.count(); dataIndex++) {
+                var value = [];
+                var hasValue = false;
+                for (var i = 0; i < dimensions.length; i++) {
+                    var val = data.get(dimensions[i], dataIndex);
+                    if (!isNaN(val)) {
+                        hasValue = true;
+                    }
+                    value.push(val);
+                }
+                if (hasValue) {
+                    data.setItemLayout(dataIndex, coordSys.dataToPoint(value));
+                }
+                else {
+                    // Also {Array.<number>}, not undefined to avoid if...else... statement
+                    data.setItemLayout(dataIndex, [NaN, NaN]);
+                }
+            }
+
+            simpleLayoutEdge(data.graph);
+        }
+        else if (!layout || layout === 'none') {
+            simpleLayout$1(seriesModel);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function circularLayout$1(seriesModel) {
+    var coordSys = seriesModel.coordinateSystem;
+    if (coordSys && coordSys.type !== 'view') {
+        return;
+    }
+
+    var rect = coordSys.getBoundingRect();
+
+    var nodeData = seriesModel.getData();
+    var graph = nodeData.graph;
+
+    var angle = 0;
+    var sum = nodeData.getSum('value');
+    var unitAngle = Math.PI * 2 / (sum || nodeData.count());
+
+    var cx = rect.width / 2 + rect.x;
+    var cy = rect.height / 2 + rect.y;
+
+    var r = Math.min(rect.width, rect.height) / 2;
+
+    graph.eachNode(function (node) {
+        var value = node.getValue('value');
+
+        angle += unitAngle * (sum ? value : 1) / 2;
+
+        node.setLayout([
+            r * Math.cos(angle) + cx,
+            r * Math.sin(angle) + cy
+        ]);
+
+        angle += unitAngle * (sum ? value : 1) / 2;
+    });
+
+    nodeData.setLayout({
+        cx: cx,
+        cy: cy
+    });
+
+    graph.eachEdge(function (edge) {
+        var curveness = edge.getModel().get('lineStyle.curveness') || 0;
+        var p1 = clone$1(edge.node1.getLayout());
+        var p2 = clone$1(edge.node2.getLayout());
+        var cp1;
+        var x12 = (p1[0] + p2[0]) / 2;
+        var y12 = (p1[1] + p2[1]) / 2;
+        if (+curveness) {
+            curveness *= 3;
+            cp1 = [
+                cx * curveness + x12 * (1 - curveness),
+                cy * curveness + y12 * (1 - curveness)
+            ];
+        }
+        edge.setLayout([p1, p2, cp1]);
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var circularLayout = function (ecModel) {
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        if (seriesModel.get('layout') === 'circular') {
+            circularLayout$1(seriesModel);
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The layout implementation references to d3.js. The use of
+* the source code of this file is also subject to the terms
+* and consitions of its license (BSD-3Clause, see
+* <echarts/src/licenses/LICENSE-d3>).
+*/
+
+var scaleAndAdd$2 = scaleAndAdd;
+
+// function adjacentNode(n, e) {
+//     return e.n1 === n ? e.n2 : e.n1;
+// }
+
+function forceLayout$1(nodes, edges, opts) {
+    var rect = opts.rect;
+    var width = rect.width;
+    var height = rect.height;
+    var center = [rect.x + width / 2, rect.y + height / 2];
+    // var scale = opts.scale || 1;
+    var gravity = opts.gravity == null ? 0.1 : opts.gravity;
+
+    // for (var i = 0; i < edges.length; i++) {
+    //     var e = edges[i];
+    //     var n1 = e.n1;
+    //     var n2 = e.n2;
+    //     n1.edges = n1.edges || [];
+    //     n2.edges = n2.edges || [];
+    //     n1.edges.push(e);
+    //     n2.edges.push(e);
+    // }
+    // Init position
+    for (var i = 0; i < nodes.length; i++) {
+        var n = nodes[i];
+        if (!n.p) {
+            // Use the position from first adjecent node with defined position
+            // Or use a random position
+            // From d3
+            // if (n.edges) {
+            //     var j = -1;
+            //     while (++j < n.edges.length) {
+            //         var e = n.edges[j];
+            //         var other = adjacentNode(n, e);
+            //         if (other.p) {
+            //             n.p = vec2.clone(other.p);
+            //             break;
+            //         }
+            //     }
+            // }
+            // if (!n.p) {
+                n.p = create(
+                    width * (Math.random() - 0.5) + center[0],
+                    height * (Math.random() - 0.5) + center[1]
+                );
+            // }
+        }
+        n.pp = clone$1(n.p);
+        n.edges = null;
+    }
+
+    // Formula in 'Graph Drawing by Force-directed Placement'
+    // var k = scale * Math.sqrt(width * height / nodes.length);
+    // var k2 = k * k;
+
+    var friction = 0.6;
+
+    return {
+        warmUp: function () {
+            friction = 0.5;
+        },
+
+        setFixed: function (idx) {
+            nodes[idx].fixed = true;
+        },
+
+        setUnfixed: function (idx) {
+            nodes[idx].fixed = false;
+        },
+
+        step: function (cb) {
+            var v12 = [];
+            var nLen = nodes.length;
+            for (var i = 0; i < edges.length; i++) {
+                var e = edges[i];
+                var n1 = e.n1;
+                var n2 = e.n2;
+
+                sub(v12, n2.p, n1.p);
+                var d = len(v12) - e.d;
+                var w = n2.w / (n1.w + n2.w);
+
+                if (isNaN(w)) {
+                    w = 0;
+                }
+
+                normalize(v12, v12);
+
+                !n1.fixed && scaleAndAdd$2(n1.p, n1.p, v12, w * d * friction);
+                !n2.fixed && scaleAndAdd$2(n2.p, n2.p, v12, -(1 - w) * d * friction);
+            }
+            // Gravity
+            for (var i = 0; i < nLen; i++) {
+                var n = nodes[i];
+                if (!n.fixed) {
+                    sub(v12, center, n.p);
+                    // var d = vec2.len(v12);
+                    // vec2.scale(v12, v12, 1 / d);
+                    // var gravityFactor = gravity;
+                    scaleAndAdd$2(n.p, n.p, v12, gravity * friction);
+                }
+            }
+
+            // Repulsive
+            // PENDING
+            for (var i = 0; i < nLen; i++) {
+                var n1 = nodes[i];
+                for (var j = i + 1; j < nLen; j++) {
+                    var n2 = nodes[j];
+                    sub(v12, n2.p, n1.p);
+                    var d = len(v12);
+                    if (d === 0) {
+                        // Random repulse
+                        set(v12, Math.random() - 0.5, Math.random() - 0.5);
+                        d = 1;
+                    }
+                    var repFact = (n1.rep + n2.rep) / d / d;
+                    !n1.fixed && scaleAndAdd$2(n1.pp, n1.pp, v12, repFact);
+                    !n2.fixed && scaleAndAdd$2(n2.pp, n2.pp, v12, -repFact);
+                }
+            }
+            var v = [];
+            for (var i = 0; i < nLen; i++) {
+                var n = nodes[i];
+                if (!n.fixed) {
+                    sub(v, n.p, n.pp);
+                    scaleAndAdd$2(n.p, n.p, v, friction);
+                    copy(n.pp, n.p);
+                }
+            }
+
+            friction = friction * 0.992;
+
+            cb && cb(nodes, edges, friction < 0.01);
+        }
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var forceLayout = function (ecModel) {
+    ecModel.eachSeriesByType('graph', function (graphSeries) {
+        var coordSys = graphSeries.coordinateSystem;
+        if (coordSys && coordSys.type !== 'view') {
+            return;
+        }
+        if (graphSeries.get('layout') === 'force') {
+            var preservedPoints = graphSeries.preservedPoints || {};
+            var graph = graphSeries.getGraph();
+            var nodeData = graph.data;
+            var edgeData = graph.edgeData;
+            var forceModel = graphSeries.getModel('force');
+            var initLayout = forceModel.get('initLayout');
+            if (graphSeries.preservedPoints) {
+                nodeData.each(function (idx) {
+                    var id = nodeData.getId(idx);
+                    nodeData.setItemLayout(idx, preservedPoints[id] || [NaN, NaN]);
+                });
+            }
+            else if (!initLayout || initLayout === 'none') {
+                simpleLayout$1(graphSeries);
+            }
+            else if (initLayout === 'circular') {
+                circularLayout$1(graphSeries);
+            }
+
+            var nodeDataExtent = nodeData.getDataExtent('value');
+            var edgeDataExtent = edgeData.getDataExtent('value');
+            // var edgeDataExtent = edgeData.getDataExtent('value');
+            var repulsion = forceModel.get('repulsion');
+            var edgeLength = forceModel.get('edgeLength');
+            if (!isArray(repulsion)) {
+                repulsion = [repulsion, repulsion];
+            }
+            if (!isArray(edgeLength)) {
+                edgeLength = [edgeLength, edgeLength];
+            }
+            // Larger value has smaller length
+            edgeLength = [edgeLength[1], edgeLength[0]];
+
+            var nodes = nodeData.mapArray('value', function (value, idx) {
+                var point = nodeData.getItemLayout(idx);
+                var rep = linearMap(value, nodeDataExtent, repulsion);
+                if (isNaN(rep)) {
+                    rep = (repulsion[0] + repulsion[1]) / 2;
+                }
+                return {
+                    w: rep,
+                    rep: rep,
+                    fixed: nodeData.getItemModel(idx).get('fixed'),
+                    p: (!point || isNaN(point[0]) || isNaN(point[1])) ? null : point
+                };
+            });
+            var edges = edgeData.mapArray('value', function (value, idx) {
+                var edge = graph.getEdgeByIndex(idx);
+                var d = linearMap(value, edgeDataExtent, edgeLength);
+                if (isNaN(d)) {
+                    d = (edgeLength[0] + edgeLength[1]) / 2;
+                }
+                return {
+                    n1: nodes[edge.node1.dataIndex],
+                    n2: nodes[edge.node2.dataIndex],
+                    d: d,
+                    curveness: edge.getModel().get('lineStyle.curveness') || 0
+                };
+            });
+
+            var coordSys = graphSeries.coordinateSystem;
+            var rect = coordSys.getBoundingRect();
+            var forceInstance = forceLayout$1(nodes, edges, {
+                rect: rect,
+                gravity: forceModel.get('gravity')
+            });
+            var oldStep = forceInstance.step;
+            forceInstance.step = function (cb) {
+                for (var i = 0, l = nodes.length; i < l; i++) {
+                    if (nodes[i].fixed) {
+                        // Write back to layout instance
+                        copy(nodes[i].p, graph.getNodeByIndex(i).getLayout());
+                    }
+                }
+                oldStep(function (nodes, edges, stopped) {
+                    for (var i = 0, l = nodes.length; i < l; i++) {
+                        if (!nodes[i].fixed) {
+                            graph.getNodeByIndex(i).setLayout(nodes[i].p);
+                        }
+                        preservedPoints[nodeData.getId(i)] = nodes[i].p;
+                    }
+                    for (var i = 0, l = edges.length; i < l; i++) {
+                        var e = edges[i];
+                        var edge = graph.getEdgeByIndex(i);
+                        var p1 = e.n1.p;
+                        var p2 = e.n2.p;
+                        var points = edge.getLayout();
+                        points = points ? points.slice() : [];
+                        points[0] = points[0] || [];
+                        points[1] = points[1] || [];
+                        copy(points[0], p1);
+                        copy(points[1], p2);
+                        if (+e.curveness) {
+                            points[2] = [
+                                (p1[0] + p2[0]) / 2 - (p1[1] - p2[1]) * e.curveness,
+                                (p1[1] + p2[1]) / 2 - (p2[0] - p1[0]) * e.curveness
+                            ];
+                        }
+                        edge.setLayout(points);
+                    }
+                    // Update layout
+
+                    cb && cb(stopped);
+                });
+            };
+            graphSeries.forceLayout = forceInstance;
+            graphSeries.preservedPoints = preservedPoints;
+
+            // Step to get the layout
+            forceInstance.step();
+        }
+        else {
+            // Remove prev injected forceLayout instance
+            graphSeries.forceLayout = null;
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME Where to create the simple view coordinate system
+function getViewRect$1(seriesModel, api, aspect) {
+    var option = seriesModel.getBoxLayoutParams();
+    option.aspect = aspect;
+    return getLayoutRect(option, {
+        width: api.getWidth(),
+        height: api.getHeight()
+    });
+}
+
+var createView = function (ecModel, api) {
+    var viewList = [];
+    ecModel.eachSeriesByType('graph', function (seriesModel) {
+        var coordSysType = seriesModel.get('coordinateSystem');
+        if (!coordSysType || coordSysType === 'view') {
+
+            var data = seriesModel.getData();
+            var positions = data.mapArray(function (idx) {
+                var itemModel = data.getItemModel(idx);
+                return [+itemModel.get('x'), +itemModel.get('y')];
+            });
+
+            var min = [];
+            var max = [];
+
+            fromPoints(positions, min, max);
+
+            // If width or height is 0
+            if (max[0] - min[0] === 0) {
+                max[0] += 1;
+                min[0] -= 1;
+            }
+            if (max[1] - min[1] === 0) {
+                max[1] += 1;
+                min[1] -= 1;
+            }
+            var aspect = (max[0] - min[0]) / (max[1] - min[1]);
+            // FIXME If get view rect after data processed?
+            var viewRect = getViewRect$1(seriesModel, api, aspect);
+            // Position may be NaN, use view rect instead
+            if (isNaN(aspect)) {
+                min = [viewRect.x, viewRect.y];
+                max = [viewRect.x + viewRect.width, viewRect.y + viewRect.height];
+            }
+
+            var bbWidth = max[0] - min[0];
+            var bbHeight = max[1] - min[1];
+
+            var viewWidth = viewRect.width;
+            var viewHeight = viewRect.height;
+
+            var viewCoordSys = seriesModel.coordinateSystem = new View();
+            viewCoordSys.zoomLimit = seriesModel.get('scaleLimit');
+
+            viewCoordSys.setBoundingRect(
+                min[0], min[1], bbWidth, bbHeight
+            );
+            viewCoordSys.setViewRect(
+                viewRect.x, viewRect.y, viewWidth, viewHeight
+            );
+
+            // Update roam info
+            viewCoordSys.setCenter(seriesModel.get('center'));
+            viewCoordSys.setZoom(seriesModel.get('zoom'));
+
+            viewList.push(viewCoordSys);
+        }
+    });
+
+    return viewList;
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerProcessor(categoryFilter);
+
+registerVisual(visualSymbol('graph', 'circle', null));
+registerVisual(categoryVisual);
+registerVisual(edgeVisual);
+
+registerLayout(simpleLayout);
+registerLayout(circularLayout);
+registerLayout(forceLayout);
+
+// Graph view coordinate system
+registerCoordinateSystem('graphView', {
+    create: createView
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var GaugeSeries = SeriesModel.extend({
+
+    type: 'series.gauge',
+
+    getInitialData: function (option, ecModel) {
+        var dataOpt = option.data || [];
+        if (!isArray(dataOpt)) {
+            dataOpt = [dataOpt];
+        }
+        option.data = dataOpt;
+        return createListSimply(this, ['value']);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        // 默认全局居中
+        center: ['50%', '50%'],
+        legendHoverLink: true,
+        radius: '75%',
+        startAngle: 225,
+        endAngle: -45,
+        clockwise: true,
+        // 最小值
+        min: 0,
+        // 最大值
+        max: 100,
+        // 分割段数，默认为10
+        splitNumber: 10,
+        // 坐标轴线
+        axisLine: {
+            // 默认显示，属性show控制显示与否
+            show: true,
+            lineStyle: {       // 属性lineStyle控制线条样式
+                color: [[0.2, '#91c7ae'], [0.8, '#63869e'], [1, '#c23531']],
+                width: 30
+            }
+        },
+        // 分隔线
+        splitLine: {
+            // 默认显示，属性show控制显示与否
+            show: true,
+            // 属性length控制线长
+            length: 30,
+            // 属性lineStyle（详见lineStyle）控制线条样式
+            lineStyle: {
+                color: '#eee',
+                width: 2,
+                type: 'solid'
+            }
+        },
+        // 坐标轴小标记
+        axisTick: {
+            // 属性show控制显示与否，默认不显示
+            show: true,
+            // 每份split细分多少段
+            splitNumber: 5,
+            // 属性length控制线长
+            length: 8,
+            // 属性lineStyle控制线条样式
+            lineStyle: {
+                color: '#eee',
+                width: 1,
+                type: 'solid'
+            }
+        },
+        axisLabel: {
+            show: true,
+            distance: 5,
+            // formatter: null,
+            color: 'auto'
+        },
+        pointer: {
+            show: true,
+            length: '80%',
+            width: 8
+        },
+        itemStyle: {
+            color: 'auto'
+        },
+        title: {
+            show: true,
+            // x, y，单位px
+            offsetCenter: [0, '-40%'],
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            color: '#333',
+            fontSize: 15
+        },
+        detail: {
+            show: true,
+            backgroundColor: 'rgba(0,0,0,0)',
+            borderWidth: 0,
+            borderColor: '#ccc',
+            width: 100,
+            height: null, // self-adaption
+            padding: [5, 10],
+            // x, y，单位px
+            offsetCenter: [0, '40%'],
+            // formatter: null,
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            color: 'auto',
+            fontSize: 30
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PointerPath = Path.extend({
+
+    type: 'echartsGaugePointer',
+
+    shape: {
+        angle: 0,
+
+        width: 10,
+
+        r: 10,
+
+        x: 0,
+
+        y: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var mathCos = Math.cos;
+        var mathSin = Math.sin;
+
+        var r = shape.r;
+        var width = shape.width;
+        var angle = shape.angle;
+        var x = shape.x - mathCos(angle) * width * (width >= r / 3 ? 1 : 2);
+        var y = shape.y - mathSin(angle) * width * (width >= r / 3 ? 1 : 2);
+
+        angle = shape.angle - Math.PI / 2;
+        ctx.moveTo(x, y);
+        ctx.lineTo(
+            shape.x + mathCos(angle) * width,
+            shape.y + mathSin(angle) * width
+        );
+        ctx.lineTo(
+            shape.x + mathCos(shape.angle) * r,
+            shape.y + mathSin(shape.angle) * r
+        );
+        ctx.lineTo(
+            shape.x - mathCos(angle) * width,
+            shape.y - mathSin(angle) * width
+        );
+        ctx.lineTo(x, y);
+        return;
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function parsePosition(seriesModel, api) {
+    var center = seriesModel.get('center');
+    var width = api.getWidth();
+    var height = api.getHeight();
+    var size = Math.min(width, height);
+    var cx = parsePercent$1(center[0], api.getWidth());
+    var cy = parsePercent$1(center[1], api.getHeight());
+    var r = parsePercent$1(seriesModel.get('radius'), size / 2);
+
+    return {
+        cx: cx,
+        cy: cy,
+        r: r
+    };
+}
+
+function formatLabel(label, labelFormatter) {
+    if (labelFormatter) {
+        if (typeof labelFormatter === 'string') {
+            label = labelFormatter.replace('{value}', label != null ? label : '');
+        }
+        else if (typeof labelFormatter === 'function') {
+            label = labelFormatter(label);
+        }
+    }
+
+    return label;
+}
+
+var PI2$5 = Math.PI * 2;
+
+var GaugeView = Chart.extend({
+
+    type: 'gauge',
+
+    render: function (seriesModel, ecModel, api) {
+
+        this.group.removeAll();
+
+        var colorList = seriesModel.get('axisLine.lineStyle.color');
+        var posInfo = parsePosition(seriesModel, api);
+
+        this._renderMain(
+            seriesModel, ecModel, api, colorList, posInfo
+        );
+    },
+
+    dispose: function () {},
+
+    _renderMain: function (seriesModel, ecModel, api, colorList, posInfo) {
+        var group = this.group;
+
+        var axisLineModel = seriesModel.getModel('axisLine');
+        var lineStyleModel = axisLineModel.getModel('lineStyle');
+
+        var clockwise = seriesModel.get('clockwise');
+        var startAngle = -seriesModel.get('startAngle') / 180 * Math.PI;
+        var endAngle = -seriesModel.get('endAngle') / 180 * Math.PI;
+
+        var angleRangeSpan = (endAngle - startAngle) % PI2$5;
+
+        var prevEndAngle = startAngle;
+        var axisLineWidth = lineStyleModel.get('width');
+
+        for (var i = 0; i < colorList.length; i++) {
+            // Clamp
+            var percent = Math.min(Math.max(colorList[i][0], 0), 1);
+            var endAngle = startAngle + angleRangeSpan * percent;
+            var sector = new Sector({
+                shape: {
+                    startAngle: prevEndAngle,
+                    endAngle: endAngle,
+                    cx: posInfo.cx,
+                    cy: posInfo.cy,
+                    clockwise: clockwise,
+                    r0: posInfo.r - axisLineWidth,
+                    r: posInfo.r
+                },
+                silent: true
+            });
+
+            sector.setStyle({
+                fill: colorList[i][1]
+            });
+
+            sector.setStyle(lineStyleModel.getLineStyle(
+                // Because we use sector to simulate arc
+                // so the properties for stroking are useless
+                ['color', 'borderWidth', 'borderColor']
+            ));
+
+            group.add(sector);
+
+            prevEndAngle = endAngle;
+        }
+
+        var getColor = function (percent) {
+            // Less than 0
+            if (percent <= 0) {
+                return colorList[0][1];
+            }
+            for (var i = 0; i < colorList.length; i++) {
+                if (colorList[i][0] >= percent
+                    && (i === 0 ? 0 : colorList[i - 1][0]) < percent
+                ) {
+                    return colorList[i][1];
+                }
+            }
+            // More than 1
+            return colorList[i - 1][1];
+        };
+
+        if (!clockwise) {
+            var tmp = startAngle;
+            startAngle = endAngle;
+            endAngle = tmp;
+        }
+
+        this._renderTicks(
+            seriesModel, ecModel, api, getColor, posInfo,
+            startAngle, endAngle, clockwise
+        );
+
+        this._renderPointer(
+            seriesModel, ecModel, api, getColor, posInfo,
+            startAngle, endAngle, clockwise
+        );
+
+        this._renderTitle(
+            seriesModel, ecModel, api, getColor, posInfo
+        );
+        this._renderDetail(
+            seriesModel, ecModel, api, getColor, posInfo
+        );
+    },
+
+    _renderTicks: function (
+        seriesModel, ecModel, api, getColor, posInfo,
+        startAngle, endAngle, clockwise
+    ) {
+        var group = this.group;
+        var cx = posInfo.cx;
+        var cy = posInfo.cy;
+        var r = posInfo.r;
+
+        var minVal = +seriesModel.get('min');
+        var maxVal = +seriesModel.get('max');
+
+        var splitLineModel = seriesModel.getModel('splitLine');
+        var tickModel = seriesModel.getModel('axisTick');
+        var labelModel = seriesModel.getModel('axisLabel');
+
+        var splitNumber = seriesModel.get('splitNumber');
+        var subSplitNumber = tickModel.get('splitNumber');
+
+        var splitLineLen = parsePercent$1(
+            splitLineModel.get('length'), r
+        );
+        var tickLen = parsePercent$1(
+            tickModel.get('length'), r
+        );
+
+        var angle = startAngle;
+        var step = (endAngle - startAngle) / splitNumber;
+        var subStep = step / subSplitNumber;
+
+        var splitLineStyle = splitLineModel.getModel('lineStyle').getLineStyle();
+        var tickLineStyle = tickModel.getModel('lineStyle').getLineStyle();
+
+        for (var i = 0; i <= splitNumber; i++) {
+            var unitX = Math.cos(angle);
+            var unitY = Math.sin(angle);
+            // Split line
+            if (splitLineModel.get('show')) {
+                var splitLine = new Line({
+                    shape: {
+                        x1: unitX * r + cx,
+                        y1: unitY * r + cy,
+                        x2: unitX * (r - splitLineLen) + cx,
+                        y2: unitY * (r - splitLineLen) + cy
+                    },
+                    style: splitLineStyle,
+                    silent: true
+                });
+                if (splitLineStyle.stroke === 'auto') {
+                    splitLine.setStyle({
+                        stroke: getColor(i / splitNumber)
+                    });
+                }
+
+                group.add(splitLine);
+            }
+
+            // Label
+            if (labelModel.get('show')) {
+                var label = formatLabel(
+                    round$1(i / splitNumber * (maxVal - minVal) + minVal),
+                    labelModel.get('formatter')
+                );
+                var distance = labelModel.get('distance');
+                var autoColor = getColor(i / splitNumber);
+
+                group.add(new Text({
+                    style: setTextStyle({}, labelModel, {
+                        text: label,
+                        x: unitX * (r - splitLineLen - distance) + cx,
+                        y: unitY * (r - splitLineLen - distance) + cy,
+                        textVerticalAlign: unitY < -0.4 ? 'top' : (unitY > 0.4 ? 'bottom' : 'middle'),
+                        textAlign: unitX < -0.4 ? 'left' : (unitX > 0.4 ? 'right' : 'center')
+                    }, {autoColor: autoColor}),
+                    silent: true
+                }));
+            }
+
+            // Axis tick
+            if (tickModel.get('show') && i !== splitNumber) {
+                for (var j = 0; j <= subSplitNumber; j++) {
+                    var unitX = Math.cos(angle);
+                    var unitY = Math.sin(angle);
+                    var tickLine = new Line({
+                        shape: {
+                            x1: unitX * r + cx,
+                            y1: unitY * r + cy,
+                            x2: unitX * (r - tickLen) + cx,
+                            y2: unitY * (r - tickLen) + cy
+                        },
+                        silent: true,
+                        style: tickLineStyle
+                    });
+
+                    if (tickLineStyle.stroke === 'auto') {
+                        tickLine.setStyle({
+                            stroke: getColor((i + j / subSplitNumber) / splitNumber)
+                        });
+                    }
+
+                    group.add(tickLine);
+                    angle += subStep;
+                }
+                angle -= subStep;
+            }
+            else {
+                angle += step;
+            }
+        }
+    },
+
+    _renderPointer: function (
+        seriesModel, ecModel, api, getColor, posInfo,
+        startAngle, endAngle, clockwise
+    ) {
+
+        var group = this.group;
+        var oldData = this._data;
+
+        if (!seriesModel.get('pointer.show')) {
+            // Remove old element
+            oldData && oldData.eachItemGraphicEl(function (el) {
+                group.remove(el);
+            });
+            return;
+        }
+
+        var valueExtent = [+seriesModel.get('min'), +seriesModel.get('max')];
+        var angleExtent = [startAngle, endAngle];
+
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+
+        data.diff(oldData)
+            .add(function (idx) {
+                var pointer = new PointerPath({
+                    shape: {
+                        angle: startAngle
+                    }
+                });
+
+                initProps(pointer, {
+                    shape: {
+                        angle: linearMap(data.get(valueDim, idx), valueExtent, angleExtent, true)
+                    }
+                }, seriesModel);
+
+                group.add(pointer);
+                data.setItemGraphicEl(idx, pointer);
+            })
+            .update(function (newIdx, oldIdx) {
+                var pointer = oldData.getItemGraphicEl(oldIdx);
+
+                updateProps(pointer, {
+                    shape: {
+                        angle: linearMap(data.get(valueDim, newIdx), valueExtent, angleExtent, true)
+                    }
+                }, seriesModel);
+
+                group.add(pointer);
+                data.setItemGraphicEl(newIdx, pointer);
+            })
+            .remove(function (idx) {
+                var pointer = oldData.getItemGraphicEl(idx);
+                group.remove(pointer);
+            })
+            .execute();
+
+        data.eachItemGraphicEl(function (pointer, idx) {
+            var itemModel = data.getItemModel(idx);
+            var pointerModel = itemModel.getModel('pointer');
+
+            pointer.setShape({
+                x: posInfo.cx,
+                y: posInfo.cy,
+                width: parsePercent$1(
+                    pointerModel.get('width'), posInfo.r
+                ),
+                r: parsePercent$1(pointerModel.get('length'), posInfo.r)
+            });
+
+            pointer.useStyle(itemModel.getModel('itemStyle').getItemStyle());
+
+            if (pointer.style.fill === 'auto') {
+                pointer.setStyle('fill', getColor(
+                    linearMap(data.get(valueDim, idx), valueExtent, [0, 1], true)
+                ));
+            }
+
+            setHoverStyle(
+                pointer, itemModel.getModel('emphasis.itemStyle').getItemStyle()
+            );
+        });
+
+        this._data = data;
+    },
+
+    _renderTitle: function (
+        seriesModel, ecModel, api, getColor, posInfo
+    ) {
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+        var titleModel = seriesModel.getModel('title');
+        if (titleModel.get('show')) {
+            var offsetCenter = titleModel.get('offsetCenter');
+            var x = posInfo.cx + parsePercent$1(offsetCenter[0], posInfo.r);
+            var y = posInfo.cy + parsePercent$1(offsetCenter[1], posInfo.r);
+
+            var minVal = +seriesModel.get('min');
+            var maxVal = +seriesModel.get('max');
+            var value = seriesModel.getData().get(valueDim, 0);
+            var autoColor = getColor(
+                linearMap(value, [minVal, maxVal], [0, 1], true)
+            );
+
+            this.group.add(new Text({
+                silent: true,
+                style: setTextStyle({}, titleModel, {
+                    x: x,
+                    y: y,
+                    // FIXME First data name ?
+                    text: data.getName(0),
+                    textAlign: 'center',
+                    textVerticalAlign: 'middle'
+                }, {autoColor: autoColor, forceRich: true})
+            }));
+        }
+    },
+
+    _renderDetail: function (
+        seriesModel, ecModel, api, getColor, posInfo
+    ) {
+        var detailModel = seriesModel.getModel('detail');
+        var minVal = +seriesModel.get('min');
+        var maxVal = +seriesModel.get('max');
+        if (detailModel.get('show')) {
+            var offsetCenter = detailModel.get('offsetCenter');
+            var x = posInfo.cx + parsePercent$1(offsetCenter[0], posInfo.r);
+            var y = posInfo.cy + parsePercent$1(offsetCenter[1], posInfo.r);
+            var width = parsePercent$1(detailModel.get('width'), posInfo.r);
+            var height = parsePercent$1(detailModel.get('height'), posInfo.r);
+            var data = seriesModel.getData();
+            var value = data.get(data.mapDimension('value'), 0);
+            var autoColor = getColor(
+                linearMap(value, [minVal, maxVal], [0, 1], true)
+            );
+
+            this.group.add(new Text({
+                silent: true,
+                style: setTextStyle({}, detailModel, {
+                    x: x,
+                    y: y,
+                    text: formatLabel(
+                        // FIXME First data name ?
+                        value, detailModel.get('formatter')
+                    ),
+                    textWidth: isNaN(width) ? null : width,
+                    textHeight: isNaN(height) ? null : height,
+                    textAlign: 'center',
+                    textVerticalAlign: 'middle'
+                }, {autoColor: autoColor, forceRich: true})
+            }));
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var FunnelSeries = extendSeriesModel({
+
+    type: 'series.funnel',
+
+    init: function (option) {
+        FunnelSeries.superApply(this, 'init', arguments);
+
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+        // Extend labelLine emphasis
+        this._defaultLabelLine(option);
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListSimply(this, ['value']);
+    },
+
+    _defaultLabelLine: function (option) {
+        // Extend labelLine emphasis
+        defaultEmphasis(option, 'labelLine', ['show']);
+
+        var labelLineNormalOpt = option.labelLine;
+        var labelLineEmphasisOpt = option.emphasis.labelLine;
+        // Not show label line if `label.normal.show = false`
+        labelLineNormalOpt.show = labelLineNormalOpt.show
+            && option.label.show;
+        labelLineEmphasisOpt.show = labelLineEmphasisOpt.show
+            && option.emphasis.label.show;
+    },
+
+    // Overwrite
+    getDataParams: function (dataIndex) {
+        var data = this.getData();
+        var params = FunnelSeries.superCall(this, 'getDataParams', dataIndex);
+        var valueDim = data.mapDimension('value');
+        var sum = data.getSum(valueDim);
+        // Percent is 0 if sum is 0
+        params.percent = !sum ? 0 : +(data.get(valueDim, dataIndex) / sum * 100).toFixed(2);
+
+        params.$vars.push('percent');
+        return params;
+    },
+
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+        legendHoverLink: true,
+        left: 80,
+        top: 60,
+        right: 80,
+        bottom: 60,
+        // width: {totalWidth} - left - right,
+        // height: {totalHeight} - top - bottom,
+
+        // 默认取数据最小最大值
+        // min: 0,
+        // max: 100,
+        minSize: '0%',
+        maxSize: '100%',
+        sort: 'descending', // 'ascending', 'descending'
+        gap: 0,
+        funnelAlign: 'center',
+        label: {
+            show: true,
+            position: 'outer'
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+        },
+        labelLine: {
+            show: true,
+            length: 20,
+            lineStyle: {
+                // color: 各异,
+                width: 1,
+                type: 'solid'
+            }
+        },
+        itemStyle: {
+            // color: 各异,
+            borderColor: '#fff',
+            borderWidth: 1
+        },
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Piece of pie including Sector, Label, LabelLine
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ */
+function FunnelPiece(data, idx) {
+
+    Group.call(this);
+
+    var polygon = new Polygon();
+    var labelLine = new Polyline();
+    var text = new Text();
+    this.add(polygon);
+    this.add(labelLine);
+    this.add(text);
+
+    this.updateData(data, idx, true);
+
+    // Hover to change label and labelLine
+    function onEmphasis() {
+        labelLine.ignore = labelLine.hoverIgnore;
+        text.ignore = text.hoverIgnore;
+    }
+    function onNormal() {
+        labelLine.ignore = labelLine.normalIgnore;
+        text.ignore = text.normalIgnore;
+    }
+    this.on('emphasis', onEmphasis)
+        .on('normal', onNormal)
+        .on('mouseover', onEmphasis)
+        .on('mouseout', onNormal);
+}
+
+var funnelPieceProto = FunnelPiece.prototype;
+
+var opacityAccessPath = ['itemStyle', 'opacity'];
+funnelPieceProto.updateData = function (data, idx, firstCreate) {
+
+    var polygon = this.childAt(0);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var opacity = data.getItemModel(idx).get(opacityAccessPath);
+    opacity = opacity == null ? 1 : opacity;
+
+    // Reset style
+    polygon.useStyle({});
+
+    if (firstCreate) {
+        polygon.setShape({
+            points: layout.points
+        });
+        polygon.setStyle({ opacity : 0 });
+        initProps(polygon, {
+            style: {
+                opacity: opacity
+            }
+        }, seriesModel, idx);
+    }
+    else {
+        updateProps(polygon, {
+            style: {
+                opacity: opacity
+            },
+            shape: {
+                points: layout.points
+            }
+        }, seriesModel, idx);
+    }
+
+    // Update common style
+    var itemStyleModel = itemModel.getModel('itemStyle');
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    polygon.setStyle(
+        defaults(
+            {
+                lineJoin: 'round',
+                fill: visualColor
+            },
+            itemStyleModel.getItemStyle(['opacity'])
+        )
+    );
+    polygon.hoverStyle = itemStyleModel.getModel('emphasis').getItemStyle();
+
+    this._updateLabel(data, idx);
+
+    setHoverStyle(this);
+};
+
+funnelPieceProto._updateLabel = function (data, idx) {
+
+    var labelLine = this.childAt(1);
+    var labelText = this.childAt(2);
+
+    var seriesModel = data.hostModel;
+    var itemModel = data.getItemModel(idx);
+    var layout = data.getItemLayout(idx);
+    var labelLayout = layout.label;
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    updateProps(labelLine, {
+        shape: {
+            points: labelLayout.linePoints || labelLayout.linePoints
+        }
+    }, seriesModel, idx);
+
+    updateProps(labelText, {
+        style: {
+            x: labelLayout.x,
+            y: labelLayout.y
+        }
+    }, seriesModel, idx);
+    labelText.attr({
+        rotation: labelLayout.rotation,
+        origin: [labelLayout.x, labelLayout.y],
+        z2: 10
+    });
+
+    var labelModel = itemModel.getModel('label');
+    var labelHoverModel = itemModel.getModel('emphasis.label');
+    var labelLineModel = itemModel.getModel('labelLine');
+    var labelLineHoverModel = itemModel.getModel('emphasis.labelLine');
+    var visualColor = data.getItemVisual(idx, 'color');
+
+    setLabelStyle(
+        labelText.style, labelText.hoverStyle = {}, labelModel, labelHoverModel,
+        {
+            labelFetcher: data.hostModel,
+            labelDataIndex: idx,
+            defaultText: data.getName(idx),
+            autoColor: visualColor,
+            useInsideStyle: !!labelLayout.inside
+        },
+        {
+            textAlign: labelLayout.textAlign,
+            textVerticalAlign: labelLayout.verticalAlign
+        }
+    );
+
+    labelText.ignore = labelText.normalIgnore = !labelModel.get('show');
+    labelText.hoverIgnore = !labelHoverModel.get('show');
+
+    labelLine.ignore = labelLine.normalIgnore = !labelLineModel.get('show');
+    labelLine.hoverIgnore = !labelLineHoverModel.get('show');
+
+    // Default use item visual color
+    labelLine.setStyle({
+        stroke: visualColor
+    });
+    labelLine.setStyle(labelLineModel.getModel('lineStyle').getLineStyle());
+
+    labelLine.hoverStyle = labelLineHoverModel.getModel('lineStyle').getLineStyle();
+};
+
+inherits(FunnelPiece, Group);
+
+
+var FunnelView = Chart.extend({
+
+    type: 'funnel',
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        var group = this.group;
+
+        data.diff(oldData)
+            .add(function (idx) {
+                var funnelPiece = new FunnelPiece(data, idx);
+
+                data.setItemGraphicEl(idx, funnelPiece);
+
+                group.add(funnelPiece);
+            })
+            .update(function (newIdx, oldIdx) {
+                var piePiece = oldData.getItemGraphicEl(oldIdx);
+
+                piePiece.updateData(data, newIdx);
+
+                group.add(piePiece);
+                data.setItemGraphicEl(newIdx, piePiece);
+            })
+            .remove(function (idx) {
+                var piePiece = oldData.getItemGraphicEl(idx);
+                group.remove(piePiece);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    remove: function () {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getViewRect$2(seriesModel, api) {
+    return getLayoutRect(
+        seriesModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        }
+    );
+}
+
+function getSortedIndices(data, sort) {
+    var valueDim = data.mapDimension('value');
+    var valueArr = data.mapArray(valueDim, function (val) {
+        return val;
+    });
+    var indices = [];
+    var isAscending = sort === 'ascending';
+    for (var i = 0, len = data.count(); i < len; i++) {
+        indices[i] = i;
+    }
+
+    // Add custom sortable function & none sortable opetion by "options.sort"
+    if (typeof sort === 'function') {
+        indices.sort(sort);
+    } else if (sort !== 'none') {
+        indices.sort(function (a, b) {
+            return isAscending ? valueArr[a] - valueArr[b] : valueArr[b] - valueArr[a];
+        });
+    }
+    return indices;
+}
+
+function labelLayout$1(data) {
+    data.each(function (idx) {
+        var itemModel = data.getItemModel(idx);
+        var labelModel = itemModel.getModel('label');
+        var labelPosition = labelModel.get('position');
+
+        var labelLineModel = itemModel.getModel('labelLine');
+
+        var layout = data.getItemLayout(idx);
+        var points = layout.points;
+
+        var isLabelInside = labelPosition === 'inner'
+            || labelPosition === 'inside' || labelPosition === 'center';
+
+        var textAlign;
+        var textX;
+        var textY;
+        var linePoints;
+
+        if (isLabelInside) {
+            textX = (points[0][0] + points[1][0] + points[2][0] + points[3][0]) / 4;
+            textY = (points[0][1] + points[1][1] + points[2][1] + points[3][1]) / 4;
+            textAlign = 'center';
+            linePoints = [
+                [textX, textY], [textX, textY]
+            ];
+        }
+        else {
+            var x1;
+            var y1;
+            var x2;
+            var labelLineLen = labelLineModel.get('length');
+            if (labelPosition === 'left') {
+                // Left side
+                x1 = (points[3][0] + points[0][0]) / 2;
+                y1 = (points[3][1] + points[0][1]) / 2;
+                x2 = x1 - labelLineLen;
+                textX = x2 - 5;
+                textAlign = 'right';
+            }
+            else {
+                // Right side
+                x1 = (points[1][0] + points[2][0]) / 2;
+                y1 = (points[1][1] + points[2][1]) / 2;
+                x2 = x1 + labelLineLen;
+                textX = x2 + 5;
+                textAlign = 'left';
+            }
+            var y2 = y1;
+
+            linePoints = [[x1, y1], [x2, y2]];
+            textY = y2;
+        }
+
+        layout.label = {
+            linePoints: linePoints,
+            x: textX,
+            y: textY,
+            verticalAlign: 'middle',
+            textAlign: textAlign,
+            inside: isLabelInside
+        };
+    });
+}
+
+var funnelLayout = function (ecModel, api, payload) {
+    ecModel.eachSeriesByType('funnel', function (seriesModel) {
+        var data = seriesModel.getData();
+        var valueDim = data.mapDimension('value');
+        var sort = seriesModel.get('sort');
+        var viewRect = getViewRect$2(seriesModel, api);
+        var indices = getSortedIndices(data, sort);
+
+        var sizeExtent = [
+            parsePercent$1(seriesModel.get('minSize'), viewRect.width),
+            parsePercent$1(seriesModel.get('maxSize'), viewRect.width)
+        ];
+        var dataExtent = data.getDataExtent(valueDim);
+        var min = seriesModel.get('min');
+        var max = seriesModel.get('max');
+        if (min == null) {
+            min = Math.min(dataExtent[0], 0);
+        }
+        if (max == null) {
+            max = dataExtent[1];
+        }
+
+        var funnelAlign = seriesModel.get('funnelAlign');
+        var gap = seriesModel.get('gap');
+        var itemHeight = (viewRect.height - gap * (data.count() - 1)) / data.count();
+
+        var y = viewRect.y;
+
+        var getLinePoints = function (idx, offY) {
+            // End point index is data.count() and we assign it 0
+            var val = data.get(valueDim, idx) || 0;
+            var itemWidth = linearMap(val, [min, max], sizeExtent, true);
+            var x0;
+            switch (funnelAlign) {
+                case 'left':
+                    x0 = viewRect.x;
+                    break;
+                case 'center':
+                    x0 = viewRect.x + (viewRect.width - itemWidth) / 2;
+                    break;
+                case 'right':
+                    x0 = viewRect.x + viewRect.width - itemWidth;
+                    break;
+            }
+            return [
+                [x0, offY],
+                [x0 + itemWidth, offY]
+            ];
+        };
+
+        if (sort === 'ascending') {
+            // From bottom to top
+            itemHeight = -itemHeight;
+            gap = -gap;
+            y += viewRect.height;
+            indices = indices.reverse();
+        }
+
+        for (var i = 0; i < indices.length; i++) {
+            var idx = indices[i];
+            var nextIdx = indices[i + 1];
+
+            var itemModel = data.getItemModel(idx);
+            var height = itemModel.get('itemStyle.height');
+            if (height == null) {
+                height = itemHeight;
+            }
+            else {
+                height = parsePercent$1(height, viewRect.height);
+                if (sort === 'ascending') {
+                    height = -height;
+                }
+            }
+
+            var start = getLinePoints(idx, y);
+            var end = getLinePoints(nextIdx, y + height);
+
+            y += height + gap;
+
+            data.setItemLayout(idx, {
+                points: start.concat(end.slice().reverse())
+            });
+        }
+
+        labelLayout$1(data);
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(dataColor('funnel'));
+registerLayout(funnelLayout);
+registerProcessor(dataFilter('funnel'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var parallelPreprocessor = function (option) {
+    createParallelIfNeeded(option);
+    mergeAxisOptionFromParallel(option);
+};
+
+/**
+ * Create a parallel coordinate if not exists.
+ * @inner
+ */
+function createParallelIfNeeded(option) {
+    if (option.parallel) {
+        return;
+    }
+
+    var hasParallelSeries = false;
+
+    each$1(option.series, function (seriesOpt) {
+        if (seriesOpt && seriesOpt.type === 'parallel') {
+            hasParallelSeries = true;
+        }
+    });
+
+    if (hasParallelSeries) {
+        option.parallel = [{}];
+    }
+}
+
+/**
+ * Merge aixs definition from parallel option (if exists) to axis option.
+ * @inner
+ */
+function mergeAxisOptionFromParallel(option) {
+    var axes = normalizeToArray(option.parallelAxis);
+
+    each$1(axes, function (axisOption) {
+        if (!isObject$1(axisOption)) {
+            return;
+        }
+
+        var parallelIndex = axisOption.parallelIndex || 0;
+        var parallelOption = normalizeToArray(option.parallel)[parallelIndex];
+
+        if (parallelOption && parallelOption.parallelAxisDefault) {
+            merge(axisOption, parallelOption.parallelAxisDefault, false);
+        }
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @constructor module:echarts/coord/parallel/ParallelAxis
+ * @extends {module:echarts/coord/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ */
+var ParallelAxis = function (dim, scale, coordExtent, axisType, axisIndex) {
+
+    Axis.call(this, dim, scale, coordExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * @type {number}
+     * @readOnly
+     */
+    this.axisIndex = axisIndex;
+};
+
+ParallelAxis.prototype = {
+
+    constructor: ParallelAxis,
+
+    /**
+     * Axis model
+     * @param {module:echarts/coord/parallel/AxisModel}
+     */
+    model: null,
+
+    /**
+     * @override
+     */
+    isHorizontal: function () {
+        return this.coordinateSystem.getModel().get('layout') !== 'horizontal';
+    }
+
+};
+
+inherits(ParallelAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Calculate slider move result.
+ * Usage:
+ * (1) If both handle0 and handle1 are needed to be moved, set minSpan the same as
+ * maxSpan and the same as `Math.abs(handleEnd[1] - handleEnds[0])`.
+ * (2) If handle0 is forbidden to cross handle1, set minSpan as `0`.
+ *
+ * @param {number} delta Move length.
+ * @param {Array.<number>} handleEnds handleEnds[0] can be bigger then handleEnds[1].
+ *              handleEnds will be modified in this method.
+ * @param {Array.<number>} extent handleEnds is restricted by extent.
+ *              extent[0] should less or equals than extent[1].
+ * @param {number|string} handleIndex Can be 'all', means that both move the two handleEnds,
+ *              where the input minSpan and maxSpan will not work.
+ * @param {number} [minSpan] The range of dataZoom can not be smaller than that.
+ *              If not set, handle0 and cross handle1. If set as a non-negative
+ *              number (including `0`), handles will push each other when reaching
+ *              the minSpan.
+ * @param {number} [maxSpan] The range of dataZoom can not be larger than that.
+ * @return {Array.<number>} The input handleEnds.
+ */
+var sliderMove = function (delta, handleEnds, extent, handleIndex, minSpan, maxSpan) {
+    // Normalize firstly.
+    handleEnds[0] = restrict$1(handleEnds[0], extent);
+    handleEnds[1] = restrict$1(handleEnds[1], extent);
+
+    delta = delta || 0;
+
+    var extentSpan = extent[1] - extent[0];
+
+    // Notice maxSpan and minSpan can be null/undefined.
+    if (minSpan != null) {
+        minSpan = restrict$1(minSpan, [0, extentSpan]);
+    }
+    if (maxSpan != null) {
+        maxSpan = Math.max(maxSpan, minSpan != null ? minSpan : 0);
+    }
+    if (handleIndex === 'all') {
+        minSpan = maxSpan = Math.abs(handleEnds[1] - handleEnds[0]);
+        handleIndex = 0;
+    }
+
+    var originalDistSign = getSpanSign(handleEnds, handleIndex);
+
+    handleEnds[handleIndex] += delta;
+
+    // Restrict in extent.
+    var extentMinSpan = minSpan || 0;
+    var realExtent = extent.slice();
+    originalDistSign.sign < 0 ? (realExtent[0] += extentMinSpan) : (realExtent[1] -= extentMinSpan);
+    handleEnds[handleIndex] = restrict$1(handleEnds[handleIndex], realExtent);
+
+    // Expand span.
+    var currDistSign = getSpanSign(handleEnds, handleIndex);
+    if (minSpan != null && (
+        currDistSign.sign !== originalDistSign.sign || currDistSign.span < minSpan
+    )) {
+        // If minSpan exists, 'cross' is forbinden.
+        handleEnds[1 - handleIndex] = handleEnds[handleIndex] + originalDistSign.sign * minSpan;
+    }
+
+    // Shrink span.
+    var currDistSign = getSpanSign(handleEnds, handleIndex);
+    if (maxSpan != null && currDistSign.span > maxSpan) {
+        handleEnds[1 - handleIndex] = handleEnds[handleIndex] + currDistSign.sign * maxSpan;
+    }
+
+    return handleEnds;
+};
+
+function getSpanSign(handleEnds, handleIndex) {
+    var dist = handleEnds[handleIndex] - handleEnds[1 - handleIndex];
+    // If `handleEnds[0] === handleEnds[1]`, always believe that handleEnd[0]
+    // is at left of handleEnds[1] for non-cross case.
+    return {span: Math.abs(dist), sign: dist > 0 ? -1 : dist < 0 ? 1 : handleIndex ? -1 : 1};
+}
+
+function restrict$1(value, extend) {
+    return Math.min(extend[1], Math.max(extend[0], value));
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Parallel Coordinates
+ * <https://en.wikipedia.org/wiki/Parallel_coordinates>
+ */
+
+var each$11 = each$1;
+var mathMin$5 = Math.min;
+var mathMax$5 = Math.max;
+var mathFloor$2 = Math.floor;
+var mathCeil$2 = Math.ceil;
+var round$2 = round$1;
+
+var PI$3 = Math.PI;
+
+function Parallel(parallelModel, ecModel, api) {
+
+    /**
+     * key: dimension
+     * @type {Object.<string, module:echarts/coord/parallel/Axis>}
+     * @private
+     */
+    this._axesMap = createHashMap();
+
+    /**
+     * key: dimension
+     * value: {position: [], rotation, }
+     * @type {Object.<string, Object>}
+     * @private
+     */
+    this._axesLayout = {};
+
+    /**
+     * Always follow axis order.
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    this.dimensions = parallelModel.dimensions;
+
+    /**
+     * @type {module:zrender/core/BoundingRect}
+     */
+    this._rect;
+
+    /**
+     * @type {module:echarts/coord/parallel/ParallelModel}
+     */
+    this._model = parallelModel;
+
+    this._init(parallelModel, ecModel, api);
+}
+
+Parallel.prototype = {
+
+    type: 'parallel',
+
+    constructor: Parallel,
+
+    /**
+     * Initialize cartesian coordinate systems
+     * @private
+     */
+    _init: function (parallelModel, ecModel, api) {
+
+        var dimensions = parallelModel.dimensions;
+        var parallelAxisIndex = parallelModel.parallelAxisIndex;
+
+        each$11(dimensions, function (dim, idx) {
+
+            var axisIndex = parallelAxisIndex[idx];
+            var axisModel = ecModel.getComponent('parallelAxis', axisIndex);
+
+            var axis = this._axesMap.set(dim, new ParallelAxis(
+                dim,
+                createScaleByModel(axisModel),
+                [0, 0],
+                axisModel.get('type'),
+                axisIndex
+            ));
+
+            var isCategory = axis.type === 'category';
+            axis.onBand = isCategory && axisModel.get('boundaryGap');
+            axis.inverse = axisModel.get('inverse');
+
+            // Injection
+            axisModel.axis = axis;
+            axis.model = axisModel;
+            axis.coordinateSystem = axisModel.coordinateSystem = this;
+
+        }, this);
+    },
+
+    /**
+     * Update axis scale after data processed
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    update: function (ecModel, api) {
+        this._updateAxesFromSeries(this._model, ecModel);
+    },
+
+    /**
+     * @override
+     */
+    containPoint: function (point) {
+        var layoutInfo = this._makeLayoutInfo();
+        var axisBase = layoutInfo.axisBase;
+        var layoutBase = layoutInfo.layoutBase;
+        var pixelDimIndex = layoutInfo.pixelDimIndex;
+        var pAxis = point[1 - pixelDimIndex];
+        var pLayout = point[pixelDimIndex];
+
+        return pAxis >= axisBase
+            && pAxis <= axisBase + layoutInfo.axisLength
+            && pLayout >= layoutBase
+            && pLayout <= layoutBase + layoutInfo.layoutLength;
+    },
+
+    getModel: function () {
+        return this._model;
+    },
+
+    /**
+     * Update properties from series
+     * @private
+     */
+    _updateAxesFromSeries: function (parallelModel, ecModel) {
+        ecModel.eachSeries(function (seriesModel) {
+
+            if (!parallelModel.contains(seriesModel, ecModel)) {
+                return;
+            }
+
+            var data = seriesModel.getData();
+
+            each$11(this.dimensions, function (dim) {
+                var axis = this._axesMap.get(dim);
+                axis.scale.unionExtentFromData(data, data.mapDimension(dim));
+                niceScaleExtent(axis.scale, axis.model);
+            }, this);
+        }, this);
+    },
+
+    /**
+     * Resize the parallel coordinate system.
+     * @param {module:echarts/coord/parallel/ParallelModel} parallelModel
+     * @param {module:echarts/ExtensionAPI} api
+     */
+    resize: function (parallelModel, api) {
+        this._rect = getLayoutRect(
+            parallelModel.getBoxLayoutParams(),
+            {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }
+        );
+
+        this._layoutAxes();
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getRect: function () {
+        return this._rect;
+    },
+
+    /**
+     * @private
+     */
+    _makeLayoutInfo: function () {
+        var parallelModel = this._model;
+        var rect = this._rect;
+        var xy = ['x', 'y'];
+        var wh = ['width', 'height'];
+        var layout = parallelModel.get('layout');
+        var pixelDimIndex = layout === 'horizontal' ? 0 : 1;
+        var layoutLength = rect[wh[pixelDimIndex]];
+        var layoutExtent = [0, layoutLength];
+        var axisCount = this.dimensions.length;
+
+        var axisExpandWidth = restrict(parallelModel.get('axisExpandWidth'), layoutExtent);
+        var axisExpandCount = restrict(parallelModel.get('axisExpandCount') || 0, [0, axisCount]);
+        var axisExpandable = parallelModel.get('axisExpandable')
+            && axisCount > 3
+            && axisCount > axisExpandCount
+            && axisExpandCount > 1
+            && axisExpandWidth > 0
+            && layoutLength > 0;
+
+        // `axisExpandWindow` is According to the coordinates of [0, axisExpandLength],
+        // for sake of consider the case that axisCollapseWidth is 0 (when screen is narrow),
+        // where collapsed axes should be overlapped.
+        var axisExpandWindow = parallelModel.get('axisExpandWindow');
+        var winSize;
+        if (!axisExpandWindow) {
+            winSize = restrict(axisExpandWidth * (axisExpandCount - 1), layoutExtent);
+            var axisExpandCenter = parallelModel.get('axisExpandCenter') || mathFloor$2(axisCount / 2);
+            axisExpandWindow = [axisExpandWidth * axisExpandCenter - winSize / 2];
+            axisExpandWindow[1] = axisExpandWindow[0] + winSize;
+        }
+        else {
+                winSize = restrict(axisExpandWindow[1] - axisExpandWindow[0], layoutExtent);
+                axisExpandWindow[1] = axisExpandWindow[0] + winSize;
+        }
+
+        var axisCollapseWidth = (layoutLength - winSize) / (axisCount - axisExpandCount);
+        // Avoid axisCollapseWidth is too small.
+        axisCollapseWidth < 3 && (axisCollapseWidth = 0);
+
+        // Find the first and last indices > ewin[0] and < ewin[1].
+        var winInnerIndices = [
+            mathFloor$2(round$2(axisExpandWindow[0] / axisExpandWidth, 1)) + 1,
+            mathCeil$2(round$2(axisExpandWindow[1] / axisExpandWidth, 1)) - 1
+        ];
+
+        // Pos in ec coordinates.
+        var axisExpandWindow0Pos = axisCollapseWidth / axisExpandWidth * axisExpandWindow[0];
+
+        return {
+            layout: layout,
+            pixelDimIndex: pixelDimIndex,
+            layoutBase: rect[xy[pixelDimIndex]],
+            layoutLength: layoutLength,
+            axisBase: rect[xy[1 - pixelDimIndex]],
+            axisLength: rect[wh[1 - pixelDimIndex]],
+            axisExpandable: axisExpandable,
+            axisExpandWidth: axisExpandWidth,
+            axisCollapseWidth: axisCollapseWidth,
+            axisExpandWindow: axisExpandWindow,
+            axisCount: axisCount,
+            winInnerIndices: winInnerIndices,
+            axisExpandWindow0Pos: axisExpandWindow0Pos
+        };
+    },
+
+    /**
+     * @private
+     */
+    _layoutAxes: function () {
+        var rect = this._rect;
+        var axes = this._axesMap;
+        var dimensions = this.dimensions;
+        var layoutInfo = this._makeLayoutInfo();
+        var layout = layoutInfo.layout;
+
+        axes.each(function (axis) {
+            var axisExtent = [0, layoutInfo.axisLength];
+            var idx = axis.inverse ? 1 : 0;
+            axis.setExtent(axisExtent[idx], axisExtent[1 - idx]);
+        });
+
+        each$11(dimensions, function (dim, idx) {
+            var posInfo = (layoutInfo.axisExpandable
+                ? layoutAxisWithExpand : layoutAxisWithoutExpand
+            )(idx, layoutInfo);
+
+            var positionTable = {
+                horizontal: {
+                    x: posInfo.position,
+                    y: layoutInfo.axisLength
+                },
+                vertical: {
+                    x: 0,
+                    y: posInfo.position
+                }
+            };
+            var rotationTable = {
+                horizontal: PI$3 / 2,
+                vertical: 0
+            };
+
+            var position = [
+                positionTable[layout].x + rect.x,
+                positionTable[layout].y + rect.y
+            ];
+
+            var rotation = rotationTable[layout];
+            var transform = create$1();
+            rotate(transform, transform, rotation);
+            translate(transform, transform, position);
+
+            // TODO
+            // tick等排布信息。
+
+            // TODO
+            // 根据axis order 更新 dimensions顺序。
+
+            this._axesLayout[dim] = {
+                position: position,
+                rotation: rotation,
+                transform: transform,
+                axisNameAvailableWidth: posInfo.axisNameAvailableWidth,
+                axisLabelShow: posInfo.axisLabelShow,
+                nameTruncateMaxWidth: posInfo.nameTruncateMaxWidth,
+                tickDirection: 1,
+                labelDirection: 1
+            };
+        }, this);
+    },
+
+    /**
+     * Get axis by dim.
+     * @param {string} dim
+     * @return {module:echarts/coord/parallel/ParallelAxis} [description]
+     */
+    getAxis: function (dim) {
+        return this._axesMap.get(dim);
+    },
+
+    /**
+     * Convert a dim value of a single item of series data to Point.
+     * @param {*} value
+     * @param {string} dim
+     * @return {Array}
+     */
+    dataToPoint: function (value, dim) {
+        return this.axisCoordToPoint(
+            this._axesMap.get(dim).dataToCoord(value),
+            dim
+        );
+    },
+
+    /**
+     * Travel data for one time, get activeState of each data item.
+     * @param {module:echarts/data/List} data
+     * @param {Functio} cb param: {string} activeState 'active' or 'inactive' or 'normal'
+     *                            {number} dataIndex
+     * @param {number} [start=0] the start dataIndex that travel from.
+     * @param {number} [end=data.count()] the next dataIndex of the last dataIndex will be travel.
+     */
+    eachActiveState: function (data, callback, start, end) {
+        start == null && (start = 0);
+        end == null && (end = data.count());
+
+        var axesMap = this._axesMap;
+        var dimensions = this.dimensions;
+        var dataDimensions = [];
+        var axisModels = [];
+
+        each$1(dimensions, function (axisDim) {
+            dataDimensions.push(data.mapDimension(axisDim));
+            axisModels.push(axesMap.get(axisDim).model);
+        });
+
+        var hasActiveSet = this.hasAxisBrushed();
+
+        for (var dataIndex = start; dataIndex < end; dataIndex++) {
+            var activeState;
+
+            if (!hasActiveSet) {
+                activeState = 'normal';
+            }
+            else {
+                activeState = 'active';
+                var values = data.getValues(dataDimensions, dataIndex);
+                for (var j = 0, lenj = dimensions.length; j < lenj; j++) {
+                    var state = axisModels[j].getActiveState(values[j]);
+
+                    if (state === 'inactive') {
+                        activeState = 'inactive';
+                        break;
+                    }
+                }
+            }
+
+            callback(activeState, dataIndex);
+        }
+    },
+
+    /**
+     * Whether has any activeSet.
+     * @return {boolean}
+     */
+    hasAxisBrushed: function () {
+        var dimensions = this.dimensions;
+        var axesMap = this._axesMap;
+        var hasActiveSet = false;
+
+        for (var j = 0, lenj = dimensions.length; j < lenj; j++) {
+            if (axesMap.get(dimensions[j]).model.getActiveState() !== 'normal') {
+                hasActiveSet = true;
+            }
+        }
+
+        return hasActiveSet;
+    },
+
+    /**
+     * Convert coords of each axis to Point.
+     *  Return point. For example: [10, 20]
+     * @param {Array.<number>} coords
+     * @param {string} dim
+     * @return {Array.<number>}
+     */
+    axisCoordToPoint: function (coord, dim) {
+        var axisLayout = this._axesLayout[dim];
+        return applyTransform$1([coord, 0], axisLayout.transform);
+    },
+
+    /**
+     * Get axis layout.
+     */
+    getAxisLayout: function (dim) {
+        return clone(this._axesLayout[dim]);
+    },
+
+    /**
+     * @param {Array.<number>} point
+     * @return {Object} {axisExpandWindow, delta, behavior: 'jump' | 'slide' | 'none'}.
+     */
+    getSlidedAxisExpandWindow: function (point) {
+        var layoutInfo = this._makeLayoutInfo();
+        var pixelDimIndex = layoutInfo.pixelDimIndex;
+        var axisExpandWindow = layoutInfo.axisExpandWindow.slice();
+        var winSize = axisExpandWindow[1] - axisExpandWindow[0];
+        var extent = [0, layoutInfo.axisExpandWidth * (layoutInfo.axisCount - 1)];
+
+        // Out of the area of coordinate system.
+        if (!this.containPoint(point)) {
+            return {behavior: 'none', axisExpandWindow: axisExpandWindow};
+        }
+
+        // Conver the point from global to expand coordinates.
+        var pointCoord = point[pixelDimIndex] - layoutInfo.layoutBase - layoutInfo.axisExpandWindow0Pos;
+
+        // For dragging operation convenience, the window should not be
+        // slided when mouse is the center area of the window.
+        var delta;
+        var behavior = 'slide';
+        var axisCollapseWidth = layoutInfo.axisCollapseWidth;
+        var triggerArea = this._model.get('axisExpandSlideTriggerArea');
+        // But consider touch device, jump is necessary.
+        var useJump = triggerArea[0] != null;
+
+        if (axisCollapseWidth) {
+            if (useJump && axisCollapseWidth && pointCoord < winSize * triggerArea[0]) {
+                behavior = 'jump';
+                delta = pointCoord - winSize * triggerArea[2];
+            }
+            else if (useJump && axisCollapseWidth && pointCoord > winSize * (1 - triggerArea[0])) {
+                behavior = 'jump';
+                delta = pointCoord - winSize * (1 - triggerArea[2]);
+            }
+            else {
+                (delta = pointCoord - winSize * triggerArea[1]) >= 0
+                    && (delta = pointCoord - winSize * (1 - triggerArea[1])) <= 0
+                    && (delta = 0);
+            }
+            delta *= layoutInfo.axisExpandWidth / axisCollapseWidth;
+            delta
+                ? sliderMove(delta, axisExpandWindow, extent, 'all')
+                // Avoid nonsense triger on mousemove.
+                : (behavior = 'none');
+        }
+        // When screen is too narrow, make it visible and slidable, although it is hard to interact.
+        else {
+            var winSize = axisExpandWindow[1] - axisExpandWindow[0];
+            var pos = extent[1] * pointCoord / winSize;
+            axisExpandWindow = [mathMax$5(0, pos - winSize / 2)];
+            axisExpandWindow[1] = mathMin$5(extent[1], axisExpandWindow[0] + winSize);
+            axisExpandWindow[0] = axisExpandWindow[1] - winSize;
+        }
+
+        return {
+            axisExpandWindow: axisExpandWindow,
+            behavior: behavior
+        };
+    }
+};
+
+function restrict(len, extent) {
+    return mathMin$5(mathMax$5(len, extent[0]), extent[1]);
+}
+
+function layoutAxisWithoutExpand(axisIndex, layoutInfo) {
+    var step = layoutInfo.layoutLength / (layoutInfo.axisCount - 1);
+    return {
+        position: step * axisIndex,
+        axisNameAvailableWidth: step,
+        axisLabelShow: true
+    };
+}
+
+function layoutAxisWithExpand(axisIndex, layoutInfo) {
+    var layoutLength = layoutInfo.layoutLength;
+    var axisExpandWidth = layoutInfo.axisExpandWidth;
+    var axisCount = layoutInfo.axisCount;
+    var axisCollapseWidth = layoutInfo.axisCollapseWidth;
+    var winInnerIndices = layoutInfo.winInnerIndices;
+
+    var position;
+    var axisNameAvailableWidth = axisCollapseWidth;
+    var axisLabelShow = false;
+    var nameTruncateMaxWidth;
+
+    if (axisIndex < winInnerIndices[0]) {
+        position = axisIndex * axisCollapseWidth;
+        nameTruncateMaxWidth = axisCollapseWidth;
+    }
+    else if (axisIndex <= winInnerIndices[1]) {
+        position = layoutInfo.axisExpandWindow0Pos
+            + axisIndex * axisExpandWidth - layoutInfo.axisExpandWindow[0];
+        axisNameAvailableWidth = axisExpandWidth;
+        axisLabelShow = true;
+    }
+    else {
+        position = layoutLength - (axisCount - 1 - axisIndex) * axisCollapseWidth;
+        nameTruncateMaxWidth = axisCollapseWidth;
+    }
+
+    return {
+        position: position,
+        axisNameAvailableWidth: axisNameAvailableWidth,
+        axisLabelShow: axisLabelShow,
+        nameTruncateMaxWidth: nameTruncateMaxWidth
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Parallel coordinate system creater.
+ */
+
+function create$2(ecModel, api) {
+    var coordSysList = [];
+
+    ecModel.eachComponent('parallel', function (parallelModel, idx) {
+        var coordSys = new Parallel(parallelModel, ecModel, api);
+
+        coordSys.name = 'parallel_' + idx;
+        coordSys.resize(parallelModel, api);
+
+        parallelModel.coordinateSystem = coordSys;
+        coordSys.model = parallelModel;
+
+        coordSysList.push(coordSys);
+    });
+
+    // Inject the coordinateSystems into seriesModel
+    ecModel.eachSeries(function (seriesModel) {
+        if (seriesModel.get('coordinateSystem') === 'parallel') {
+            var parallelModel = ecModel.queryComponents({
+                mainType: 'parallel',
+                index: seriesModel.get('parallelIndex'),
+                id: seriesModel.get('parallelId')
+            })[0];
+            seriesModel.coordinateSystem = parallelModel.coordinateSystem;
+        }
+    });
+
+    return coordSysList;
+}
+
+CoordinateSystemManager.register('parallel', {create: create$2});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisModel$2 = ComponentModel.extend({
+
+    type: 'baseParallelAxis',
+
+    /**
+     * @type {module:echarts/coord/parallel/Axis}
+     */
+    axis: null,
+
+    /**
+     * @type {Array.<Array.<number>}
+     * @readOnly
+     */
+    activeIntervals: [],
+
+    /**
+     * @return {Object}
+     */
+    getAreaSelectStyle: function () {
+        return makeStyleMapper(
+            [
+                ['fill', 'color'],
+                ['lineWidth', 'borderWidth'],
+                ['stroke', 'borderColor'],
+                ['width', 'width'],
+                ['opacity', 'opacity']
+            ]
+        )(this.getModel('areaSelectStyle'));
+    },
+
+    /**
+     * The code of this feature is put on AxisModel but not ParallelAxis,
+     * because axisModel can be alive after echarts updating but instance of
+     * ParallelAxis having been disposed. this._activeInterval should be kept
+     * when action dispatched (i.e. legend click).
+     *
+     * @param {Array.<Array<number>>} intervals interval.length === 0
+     *                                          means set all active.
+     * @public
+     */
+    setActiveIntervals: function (intervals) {
+        var activeIntervals = this.activeIntervals = clone(intervals);
+
+        // Normalize
+        if (activeIntervals) {
+            for (var i = activeIntervals.length - 1; i >= 0; i--) {
+                asc(activeIntervals[i]);
+            }
+        }
+    },
+
+    /**
+     * @param {number|string} [value] When attempting to detect 'no activeIntervals set',
+     *                         value can not be input.
+     * @return {string} 'normal': no activeIntervals set,
+     *                  'active',
+     *                  'inactive'.
+     * @public
+     */
+    getActiveState: function (value) {
+        var activeIntervals = this.activeIntervals;
+
+        if (!activeIntervals.length) {
+            return 'normal';
+        }
+
+        if (value == null || isNaN(value)) {
+            return 'inactive';
+        }
+
+        // Simple optimization
+        if (activeIntervals.length === 1) {
+            var interval = activeIntervals[0];
+            if (interval[0] <= value && value <= interval[1]) {
+                return 'active';
+            }
+        }
+        else {
+            for (var i = 0, len = activeIntervals.length; i < len; i++) {
+                if (activeIntervals[i][0] <= value && value <= activeIntervals[i][1]) {
+                    return 'active';
+                }
+            }
+        }
+
+        return 'inactive';
+    }
+
+});
+
+var defaultOption$1 = {
+
+    type: 'value',
+
+    /**
+     * @type {Array.<number>}
+     */
+    dim: null, // 0, 1, 2, ...
+
+    // parallelIndex: null,
+
+    areaSelectStyle: {
+        width: 20,
+        borderWidth: 1,
+        borderColor: 'rgba(160,197,232)',
+        color: 'rgba(160,197,232)',
+        opacity: 0.3
+    },
+
+    realtime: true, // Whether realtime update view when select.
+
+    z: 10
+};
+
+merge(AxisModel$2.prototype, axisModelCommonMixin);
+
+function getAxisType$1(axisName, option) {
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+axisModelCreator('parallel', AxisModel$2, getAxisType$1, defaultOption$1);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.extend({
+
+    type: 'parallel',
+
+    dependencies: ['parallelAxis'],
+
+    /**
+     * @type {module:echarts/coord/parallel/Parallel}
+     */
+    coordinateSystem: null,
+
+    /**
+     * Each item like: 'dim0', 'dim1', 'dim2', ...
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: null,
+
+    /**
+     * Coresponding to dimensions.
+     * @type {Array.<number>}
+     * @readOnly
+     */
+    parallelAxisIndex: null,
+
+    layoutMode: 'box',
+
+    defaultOption: {
+        zlevel: 0,
+        z: 0,
+        left: 80,
+        top: 60,
+        right: 80,
+        bottom: 60,
+        // width: {totalWidth} - left - right,
+        // height: {totalHeight} - top - bottom,
+
+        layout: 'horizontal',      // 'horizontal' or 'vertical'
+
+        // FIXME
+        // naming?
+        axisExpandable: false,
+        axisExpandCenter: null,
+        axisExpandCount: 0,
+        axisExpandWidth: 50,      // FIXME '10%' ?
+        axisExpandRate: 17,
+        axisExpandDebounce: 50,
+        // [out, in, jumpTarget]. In percentage. If use [null, 0.05], null means full.
+        // Do not doc to user until necessary.
+        axisExpandSlideTriggerArea: [-0.15, 0.05, 0.4],
+        axisExpandTriggerOn: 'click', // 'mousemove' or 'click'
+
+        parallelAxisDefault: null
+    },
+
+    /**
+     * @override
+     */
+    init: function () {
+        ComponentModel.prototype.init.apply(this, arguments);
+
+        this.mergeOption({});
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (newOption) {
+        var thisOption = this.option;
+
+        newOption && merge(thisOption, newOption, true);
+
+        this._initDimensions();
+    },
+
+    /**
+     * Whether series or axis is in this coordinate system.
+     * @param {module:echarts/model/Series|module:echarts/coord/parallel/AxisModel} model
+     * @param {module:echarts/model/Global} ecModel
+     */
+    contains: function (model, ecModel) {
+        var parallelIndex = model.get('parallelIndex');
+        return parallelIndex != null
+            && ecModel.getComponent('parallel', parallelIndex) === this;
+    },
+
+    setAxisExpand: function (opt) {
+        each$1(
+            ['axisExpandable', 'axisExpandCenter', 'axisExpandCount', 'axisExpandWidth', 'axisExpandWindow'],
+            function (name) {
+                if (opt.hasOwnProperty(name)) {
+                    this.option[name] = opt[name];
+                }
+            },
+            this
+        );
+    },
+
+    /**
+     * @private
+     */
+    _initDimensions: function () {
+        var dimensions = this.dimensions = [];
+        var parallelAxisIndex = this.parallelAxisIndex = [];
+
+        var axisModels = filter(this.dependentModels.parallelAxis, function (axisModel) {
+            // Can not use this.contains here, because
+            // initialization has not been completed yet.
+            return (axisModel.get('parallelIndex') || 0) === this.componentIndex;
+        }, this);
+
+        each$1(axisModels, function (axisModel) {
+            dimensions.push('dim' + axisModel.get('dim'));
+            parallelAxisIndex.push(axisModel.componentIndex);
+        });
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @payload
+ * @property {string} parallelAxisId
+ * @property {Array.<Array.<number>>} intervals
+ */
+var actionInfo$1 = {
+    type: 'axisAreaSelect',
+    event: 'axisAreaSelected'
+    // update: 'updateVisual'
+};
+
+registerAction(actionInfo$1, function (payload, ecModel) {
+    ecModel.eachComponent(
+        {mainType: 'parallelAxis', query: payload},
+        function (parallelAxisModel) {
+            parallelAxisModel.axis.model.setActiveIntervals(payload.intervals);
+        }
+    );
+});
+
+/**
+ * @payload
+ */
+registerAction('parallelAxisExpand', function (payload, ecModel) {
+    ecModel.eachComponent(
+        {mainType: 'parallel', query: payload},
+        function (parallelModel) {
+            parallelModel.setAxisExpand(payload);
+        }
+    );
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var curry$2 = curry;
+var each$12 = each$1;
+var map$2 = map;
+var mathMin$6 = Math.min;
+var mathMax$6 = Math.max;
+var mathPow$2 = Math.pow;
+
+var COVER_Z = 10000;
+var UNSELECT_THRESHOLD = 6;
+var MIN_RESIZE_LINE_WIDTH = 6;
+var MUTEX_RESOURCE_KEY = 'globalPan';
+
+var DIRECTION_MAP = {
+    w: [0, 0],
+    e: [0, 1],
+    n: [1, 0],
+    s: [1, 1]
+};
+var CURSOR_MAP = {
+    w: 'ew',
+    e: 'ew',
+    n: 'ns',
+    s: 'ns',
+    ne: 'nesw',
+    sw: 'nesw',
+    nw: 'nwse',
+    se: 'nwse'
+};
+var DEFAULT_BRUSH_OPT = {
+    brushStyle: {
+        lineWidth: 2,
+        stroke: 'rgba(0,0,0,0.3)',
+        fill: 'rgba(0,0,0,0.1)'
+    },
+    transformable: true,
+    brushMode: 'single',
+    removeOnClick: false
+};
+
+var baseUID = 0;
+
+/**
+ * @alias module:echarts/component/helper/BrushController
+ * @constructor
+ * @mixin {module:zrender/mixin/Eventful}
+ * @event module:echarts/component/helper/BrushController#brush
+ *        params:
+ *            areas: Array.<Array>, coord relates to container group,
+ *                                    If no container specified, to global.
+ *            opt {
+ *                isEnd: boolean,
+ *                removeOnClick: boolean
+ *            }
+ *
+ * @param {module:zrender/zrender~ZRender} zr
+ */
+function BrushController(zr) {
+
+    if (__DEV__) {
+        assert$1(zr);
+    }
+
+    Eventful.call(this);
+
+    /**
+     * @type {module:zrender/zrender~ZRender}
+     * @private
+     */
+    this._zr = zr;
+
+    /**
+     * @type {module:zrender/container/Group}
+     * @readOnly
+     */
+    this.group = new Group();
+
+    /**
+     * Only for drawing (after enabledBrush).
+     *     'line', 'rect', 'polygon' or false
+     *     If passing false/null/undefined, disable brush.
+     *     If passing 'auto', determined by panel.defaultBrushType
+     * @private
+     * @type {string}
+     */
+    this._brushType;
+
+    /**
+     * Only for drawing (after enabledBrush).
+     *
+     * @private
+     * @type {Object}
+     */
+    this._brushOption;
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._panels;
+
+    /**
+     * @private
+     * @type {Array.<nubmer>}
+     */
+    this._track = [];
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._dragging;
+
+    /**
+     * @private
+     * @type {Array}
+     */
+    this._covers = [];
+
+    /**
+     * @private
+     * @type {moudule:zrender/container/Group}
+     */
+    this._creatingCover;
+
+    /**
+     * `true` means global panel
+     * @private
+     * @type {module:zrender/container/Group|boolean}
+     */
+    this._creatingPanel;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._enableGlobalPan;
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    if (__DEV__) {
+        this._mounted;
+    }
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._uid = 'brushController_' + baseUID++;
+
+    /**
+     * @private
+     * @type {Object}
+     */
+    this._handlers = {};
+    each$12(mouseHandlers, function (handler, eventName) {
+        this._handlers[eventName] = bind(handler, this);
+    }, this);
+}
+
+BrushController.prototype = {
+
+    constructor: BrushController,
+
+    /**
+     * If set to null/undefined/false, select disabled.
+     * @param {Object} brushOption
+     * @param {string|boolean} brushOption.brushType 'line', 'rect', 'polygon' or false
+     *                          If passing false/null/undefined, disable brush.
+     *                          If passing 'auto', determined by panel.defaultBrushType.
+     *                              ('auto' can not be used in global panel)
+     * @param {number} [brushOption.brushMode='single'] 'single' or 'multiple'
+     * @param {boolean} [brushOption.transformable=true]
+     * @param {boolean} [brushOption.removeOnClick=false]
+     * @param {Object} [brushOption.brushStyle]
+     * @param {number} [brushOption.brushStyle.width]
+     * @param {number} [brushOption.brushStyle.lineWidth]
+     * @param {string} [brushOption.brushStyle.stroke]
+     * @param {string} [brushOption.brushStyle.fill]
+     * @param {number} [brushOption.z]
+     */
+    enableBrush: function (brushOption) {
+        if (__DEV__) {
+            assert$1(this._mounted);
+        }
+
+        this._brushType && doDisableBrush(this);
+        brushOption.brushType && doEnableBrush(this, brushOption);
+
+        return this;
+    },
+
+    /**
+     * @param {Array.<Object>} panelOpts If not pass, it is global brush.
+     *        Each items: {
+     *            panelId, // mandatory.
+     *            clipPath, // mandatory. function.
+     *            isTargetByCursor, // mandatory. function.
+     *            defaultBrushType, // optional, only used when brushType is 'auto'.
+     *            getLinearBrushOtherExtent, // optional. function.
+     *        }
+     */
+    setPanels: function (panelOpts) {
+        if (panelOpts && panelOpts.length) {
+            var panels = this._panels = {};
+            each$1(panelOpts, function (panelOpts) {
+                panels[panelOpts.panelId] = clone(panelOpts);
+            });
+        }
+        else {
+            this._panels = null;
+        }
+        return this;
+    },
+
+    /**
+     * @param {Object} [opt]
+     * @return {boolean} [opt.enableGlobalPan=false]
+     */
+    mount: function (opt) {
+        opt = opt || {};
+
+        if (__DEV__) {
+            this._mounted = true; // should be at first.
+        }
+
+        this._enableGlobalPan = opt.enableGlobalPan;
+
+        var thisGroup = this.group;
+        this._zr.add(thisGroup);
+
+        thisGroup.attr({
+            position: opt.position || [0, 0],
+            rotation: opt.rotation || 0,
+            scale: opt.scale || [1, 1]
+        });
+        this._transform = thisGroup.getLocalTransform();
+
+        return this;
+    },
+
+    eachCover: function (cb, context) {
+        each$12(this._covers, cb, context);
+    },
+
+    /**
+     * Update covers.
+     * @param {Array.<Object>} brushOptionList Like:
+     *        [
+     *            {id: 'xx', brushType: 'line', range: [23, 44], brushStyle, transformable},
+     *            {id: 'yy', brushType: 'rect', range: [[23, 44], [23, 54]]},
+     *            ...
+     *        ]
+     *        `brushType` is required in each cover info. (can not be 'auto')
+     *        `id` is not mandatory.
+     *        `brushStyle`, `transformable` is not mandatory, use DEFAULT_BRUSH_OPT by default.
+     *        If brushOptionList is null/undefined, all covers removed.
+     */
+    updateCovers: function (brushOptionList) {
+        if (__DEV__) {
+            assert$1(this._mounted);
+        }
+
+        brushOptionList = map(brushOptionList, function (brushOption) {
+            return merge(clone(DEFAULT_BRUSH_OPT), brushOption, true);
+        });
+
+        var tmpIdPrefix = '\0-brush-index-';
+        var oldCovers = this._covers;
+        var newCovers = this._covers = [];
+        var controller = this;
+        var creatingCover = this._creatingCover;
+
+        (new DataDiffer(oldCovers, brushOptionList, oldGetKey, getKey))
+            .add(addOrUpdate)
+            .update(addOrUpdate)
+            .remove(remove)
+            .execute();
+
+        return this;
+
+        function getKey(brushOption, index) {
+            return (brushOption.id != null ? brushOption.id : tmpIdPrefix + index)
+                + '-' + brushOption.brushType;
+        }
+
+        function oldGetKey(cover, index) {
+            return getKey(cover.__brushOption, index);
+        }
+
+        function addOrUpdate(newIndex, oldIndex) {
+            var newBrushOption = brushOptionList[newIndex];
+            // Consider setOption in event listener of brushSelect,
+            // where updating cover when creating should be forbiden.
+            if (oldIndex != null && oldCovers[oldIndex] === creatingCover) {
+                newCovers[newIndex] = oldCovers[oldIndex];
+            }
+            else {
+                var cover = newCovers[newIndex] = oldIndex != null
+                    ? (
+                        oldCovers[oldIndex].__brushOption = newBrushOption,
+                        oldCovers[oldIndex]
+                    )
+                    : endCreating(controller, createCover(controller, newBrushOption));
+                updateCoverAfterCreation(controller, cover);
+            }
+        }
+
+        function remove(oldIndex) {
+            if (oldCovers[oldIndex] !== creatingCover) {
+                controller.group.remove(oldCovers[oldIndex]);
+            }
+        }
+    },
+
+    unmount: function () {
+        if (__DEV__) {
+            if (!this._mounted) {
+                return;
+            }
+        }
+
+        this.enableBrush(false);
+
+        // container may 'removeAll' outside.
+        clearCovers(this);
+        this._zr.remove(this.group);
+
+        if (__DEV__) {
+            this._mounted = false; // should be at last.
+        }
+
+        return this;
+    },
+
+    dispose: function () {
+        this.unmount();
+        this.off();
+    }
+};
+
+mixin(BrushController, Eventful);
+
+function doEnableBrush(controller, brushOption) {
+    var zr = controller._zr;
+
+    // Consider roam, which takes globalPan too.
+    if (!controller._enableGlobalPan) {
+        take(zr, MUTEX_RESOURCE_KEY, controller._uid);
+    }
+
+    each$12(controller._handlers, function (handler, eventName) {
+        zr.on(eventName, handler);
+    });
+
+    controller._brushType = brushOption.brushType;
+    controller._brushOption = merge(clone(DEFAULT_BRUSH_OPT), brushOption, true);
+}
+
+function doDisableBrush(controller) {
+    var zr = controller._zr;
+
+    release(zr, MUTEX_RESOURCE_KEY, controller._uid);
+
+    each$12(controller._handlers, function (handler, eventName) {
+        zr.off(eventName, handler);
+    });
+
+    controller._brushType = controller._brushOption = null;
+}
+
+function createCover(controller, brushOption) {
+    var cover = coverRenderers[brushOption.brushType].createCover(controller, brushOption);
+    cover.__brushOption = brushOption;
+    updateZ$1(cover, brushOption);
+    controller.group.add(cover);
+    return cover;
+}
+
+function endCreating(controller, creatingCover) {
+    var coverRenderer = getCoverRenderer(creatingCover);
+    if (coverRenderer.endCreating) {
+        coverRenderer.endCreating(controller, creatingCover);
+        updateZ$1(creatingCover, creatingCover.__brushOption);
+    }
+    return creatingCover;
+}
+
+function updateCoverShape(controller, cover) {
+    var brushOption = cover.__brushOption;
+    getCoverRenderer(cover).updateCoverShape(
+        controller, cover, brushOption.range, brushOption
+    );
+}
+
+function updateZ$1(cover, brushOption) {
+    var z = brushOption.z;
+    z == null && (z = COVER_Z);
+    cover.traverse(function (el) {
+        el.z = z;
+        el.z2 = z; // Consider in given container.
+    });
+}
+
+function updateCoverAfterCreation(controller, cover) {
+    getCoverRenderer(cover).updateCommon(controller, cover);
+    updateCoverShape(controller, cover);
+}
+
+function getCoverRenderer(cover) {
+    return coverRenderers[cover.__brushOption.brushType];
+}
+
+// return target panel or `true` (means global panel)
+function getPanelByPoint(controller, e, localCursorPoint) {
+    var panels = controller._panels;
+    if (!panels) {
+        return true; // Global panel
+    }
+    var panel;
+    var transform = controller._transform;
+    each$12(panels, function (pn) {
+        pn.isTargetByCursor(e, localCursorPoint, transform) && (panel = pn);
+    });
+    return panel;
+}
+
+// Return a panel or true
+function getPanelByCover(controller, cover) {
+    var panels = controller._panels;
+    if (!panels) {
+        return true; // Global panel
+    }
+    var panelId = cover.__brushOption.panelId;
+    // User may give cover without coord sys info,
+    // which is then treated as global panel.
+    return panelId != null ? panels[panelId] : true;
+}
+
+function clearCovers(controller) {
+    var covers = controller._covers;
+    var originalLength = covers.length;
+    each$12(covers, function (cover) {
+        controller.group.remove(cover);
+    }, controller);
+    covers.length = 0;
+
+    return !!originalLength;
+}
+
+function trigger(controller, opt) {
+    var areas = map$2(controller._covers, function (cover) {
+        var brushOption = cover.__brushOption;
+        var range = clone(brushOption.range);
+        return {
+            brushType: brushOption.brushType,
+            panelId: brushOption.panelId,
+            range: range
+        };
+    });
+
+    controller.trigger('brush', areas, {
+        isEnd: !!opt.isEnd,
+        removeOnClick: !!opt.removeOnClick
+    });
+}
+
+function shouldShowCover(controller) {
+    var track = controller._track;
+
+    if (!track.length) {
+        return false;
+    }
+
+    var p2 = track[track.length - 1];
+    var p1 = track[0];
+    var dx = p2[0] - p1[0];
+    var dy = p2[1] - p1[1];
+    var dist = mathPow$2(dx * dx + dy * dy, 0.5);
+
+    return dist > UNSELECT_THRESHOLD;
+}
+
+function getTrackEnds(track) {
+    var tail = track.length - 1;
+    tail < 0 && (tail = 0);
+    return [track[0], track[tail]];
+}
+
+function createBaseRectCover(doDrift, controller, brushOption, edgeNames) {
+    var cover = new Group();
+
+    cover.add(new Rect({
+        name: 'main',
+        style: makeStyle(brushOption),
+        silent: true,
+        draggable: true,
+        cursor: 'move',
+        drift: curry$2(doDrift, controller, cover, 'nswe'),
+        ondragend: curry$2(trigger, controller, {isEnd: true})
+    }));
+
+    each$12(
+        edgeNames,
+        function (name) {
+            cover.add(new Rect({
+                name: name,
+                style: {opacity: 0},
+                draggable: true,
+                silent: true,
+                invisible: true,
+                drift: curry$2(doDrift, controller, cover, name),
+                ondragend: curry$2(trigger, controller, {isEnd: true})
+            }));
+        }
+    );
+
+    return cover;
+}
+
+function updateBaseRect(controller, cover, localRange, brushOption) {
+    var lineWidth = brushOption.brushStyle.lineWidth || 0;
+    var handleSize = mathMax$6(lineWidth, MIN_RESIZE_LINE_WIDTH);
+    var x = localRange[0][0];
+    var y = localRange[1][0];
+    var xa = x - lineWidth / 2;
+    var ya = y - lineWidth / 2;
+    var x2 = localRange[0][1];
+    var y2 = localRange[1][1];
+    var x2a = x2 - handleSize + lineWidth / 2;
+    var y2a = y2 - handleSize + lineWidth / 2;
+    var width = x2 - x;
+    var height = y2 - y;
+    var widtha = width + lineWidth;
+    var heighta = height + lineWidth;
+
+    updateRectShape(controller, cover, 'main', x, y, width, height);
+
+    if (brushOption.transformable) {
+        updateRectShape(controller, cover, 'w', xa, ya, handleSize, heighta);
+        updateRectShape(controller, cover, 'e', x2a, ya, handleSize, heighta);
+        updateRectShape(controller, cover, 'n', xa, ya, widtha, handleSize);
+        updateRectShape(controller, cover, 's', xa, y2a, widtha, handleSize);
+
+        updateRectShape(controller, cover, 'nw', xa, ya, handleSize, handleSize);
+        updateRectShape(controller, cover, 'ne', x2a, ya, handleSize, handleSize);
+        updateRectShape(controller, cover, 'sw', xa, y2a, handleSize, handleSize);
+        updateRectShape(controller, cover, 'se', x2a, y2a, handleSize, handleSize);
+    }
+}
+
+function updateCommon(controller, cover) {
+    var brushOption = cover.__brushOption;
+    var transformable = brushOption.transformable;
+
+    var mainEl = cover.childAt(0);
+    mainEl.useStyle(makeStyle(brushOption));
+    mainEl.attr({
+        silent: !transformable,
+        cursor: transformable ? 'move' : 'default'
+    });
+
+    each$12(
+        ['w', 'e', 'n', 's', 'se', 'sw', 'ne', 'nw'],
+        function (name) {
+            var el = cover.childOfName(name);
+            var globalDir = getGlobalDirection(controller, name);
+
+            el && el.attr({
+                silent: !transformable,
+                invisible: !transformable,
+                cursor: transformable ? CURSOR_MAP[globalDir] + '-resize' : null
+            });
+        }
+    );
+}
+
+function updateRectShape(controller, cover, name, x, y, w, h) {
+    var el = cover.childOfName(name);
+    el && el.setShape(pointsToRect(
+        clipByPanel(controller, cover, [[x, y], [x + w, y + h]])
+    ));
+}
+
+function makeStyle(brushOption) {
+    return defaults({strokeNoScale: true}, brushOption.brushStyle);
+}
+
+function formatRectRange(x, y, x2, y2) {
+    var min = [mathMin$6(x, x2), mathMin$6(y, y2)];
+    var max = [mathMax$6(x, x2), mathMax$6(y, y2)];
+
+    return [
+        [min[0], max[0]], // x range
+        [min[1], max[1]] // y range
+    ];
+}
+
+function getTransform$1(controller) {
+    return getTransform(controller.group);
+}
+
+function getGlobalDirection(controller, localDirection) {
+    if (localDirection.length > 1) {
+        localDirection = localDirection.split('');
+        var globalDir = [
+            getGlobalDirection(controller, localDirection[0]),
+            getGlobalDirection(controller, localDirection[1])
+        ];
+        (globalDir[0] === 'e' || globalDir[0] === 'w') && globalDir.reverse();
+        return globalDir.join('');
+    }
+    else {
+        var map$$1 = {w: 'left', e: 'right', n: 'top', s: 'bottom'};
+        var inverseMap = {left: 'w', right: 'e', top: 'n', bottom: 's'};
+        var globalDir = transformDirection(
+            map$$1[localDirection], getTransform$1(controller)
+        );
+        return inverseMap[globalDir];
+    }
+}
+
+function driftRect(toRectRange, fromRectRange, controller, cover, name, dx, dy, e) {
+    var brushOption = cover.__brushOption;
+    var rectRange = toRectRange(brushOption.range);
+    var localDelta = toLocalDelta(controller, dx, dy);
+
+    each$12(name.split(''), function (namePart) {
+        var ind = DIRECTION_MAP[namePart];
+        rectRange[ind[0]][ind[1]] += localDelta[ind[0]];
+    });
+
+    brushOption.range = fromRectRange(formatRectRange(
+        rectRange[0][0], rectRange[1][0], rectRange[0][1], rectRange[1][1]
+    ));
+
+    updateCoverAfterCreation(controller, cover);
+    trigger(controller, {isEnd: false});
+}
+
+function driftPolygon(controller, cover, dx, dy, e) {
+    var range = cover.__brushOption.range;
+    var localDelta = toLocalDelta(controller, dx, dy);
+
+    each$12(range, function (point) {
+        point[0] += localDelta[0];
+        point[1] += localDelta[1];
+    });
+
+    updateCoverAfterCreation(controller, cover);
+    trigger(controller, {isEnd: false});
+}
+
+function toLocalDelta(controller, dx, dy) {
+    var thisGroup = controller.group;
+    var localD = thisGroup.transformCoordToLocal(dx, dy);
+    var localZero = thisGroup.transformCoordToLocal(0, 0);
+
+    return [localD[0] - localZero[0], localD[1] - localZero[1]];
+}
+
+function clipByPanel(controller, cover, data) {
+    var panel = getPanelByCover(controller, cover);
+
+    return (panel && panel !== true)
+        ? panel.clipPath(data, controller._transform)
+        : clone(data);
+}
+
+function pointsToRect(points) {
+    var xmin = mathMin$6(points[0][0], points[1][0]);
+    var ymin = mathMin$6(points[0][1], points[1][1]);
+    var xmax = mathMax$6(points[0][0], points[1][0]);
+    var ymax = mathMax$6(points[0][1], points[1][1]);
+
+    return {
+        x: xmin,
+        y: ymin,
+        width: xmax - xmin,
+        height: ymax - ymin
+    };
+}
+
+function resetCursor(controller, e, localCursorPoint) {
+    // Check active
+    if (!controller._brushType) {
+        return;
+    }
+
+    var zr = controller._zr;
+    var covers = controller._covers;
+    var currPanel = getPanelByPoint(controller, e, localCursorPoint);
+
+    // Check whether in covers.
+    if (!controller._dragging) {
+        for (var i = 0; i < covers.length; i++) {
+            var brushOption = covers[i].__brushOption;
+            if (currPanel
+                && (currPanel === true || brushOption.panelId === currPanel.panelId)
+                && coverRenderers[brushOption.brushType].contain(
+                    covers[i], localCursorPoint[0], localCursorPoint[1]
+                )
+            ) {
+                // Use cursor style set on cover.
+                return;
+            }
+        }
+    }
+
+    currPanel && zr.setCursorStyle('crosshair');
+}
+
+function preventDefault(e) {
+    var rawE = e.event;
+    rawE.preventDefault && rawE.preventDefault();
+}
+
+function mainShapeContain(cover, x, y) {
+    return cover.childOfName('main').contain(x, y);
+}
+
+function updateCoverByMouse(controller, e, localCursorPoint, isEnd) {
+    var creatingCover = controller._creatingCover;
+    var panel = controller._creatingPanel;
+    var thisBrushOption = controller._brushOption;
+    var eventParams;
+
+    controller._track.push(localCursorPoint.slice());
+
+    if (shouldShowCover(controller) || creatingCover) {
+
+        if (panel && !creatingCover) {
+            thisBrushOption.brushMode === 'single' && clearCovers(controller);
+            var brushOption = clone(thisBrushOption);
+            brushOption.brushType = determineBrushType(brushOption.brushType, panel);
+            brushOption.panelId = panel === true ? null : panel.panelId;
+            creatingCover = controller._creatingCover = createCover(controller, brushOption);
+            controller._covers.push(creatingCover);
+        }
+
+        if (creatingCover) {
+            var coverRenderer = coverRenderers[determineBrushType(controller._brushType, panel)];
+            var coverBrushOption = creatingCover.__brushOption;
+
+            coverBrushOption.range = coverRenderer.getCreatingRange(
+                clipByPanel(controller, creatingCover, controller._track)
+            );
+
+            if (isEnd) {
+                endCreating(controller, creatingCover);
+                coverRenderer.updateCommon(controller, creatingCover);
+            }
+
+            updateCoverShape(controller, creatingCover);
+
+            eventParams = {isEnd: isEnd};
+        }
+    }
+    else if (
+        isEnd
+        && thisBrushOption.brushMode === 'single'
+        && thisBrushOption.removeOnClick
+    ) {
+        // Help user to remove covers easily, only by a tiny drag, in 'single' mode.
+        // But a single click do not clear covers, because user may have casual
+        // clicks (for example, click on other component and do not expect covers
+        // disappear).
+        // Only some cover removed, trigger action, but not every click trigger action.
+        if (getPanelByPoint(controller, e, localCursorPoint) && clearCovers(controller)) {
+            eventParams = {isEnd: isEnd, removeOnClick: true};
+        }
+    }
+
+    return eventParams;
+}
+
+function determineBrushType(brushType, panel) {
+    if (brushType === 'auto') {
+        if (__DEV__) {
+            assert$1(
+                panel && panel.defaultBrushType,
+                'MUST have defaultBrushType when brushType is "atuo"'
+            );
+        }
+        return panel.defaultBrushType;
+    }
+    return brushType;
+}
+
+var mouseHandlers = {
+
+    mousedown: function (e) {
+        if (this._dragging) {
+            // In case some browser do not support globalOut,
+            // and release mose out side the browser.
+            handleDragEnd.call(this, e);
+        }
+        else if (!e.target || !e.target.draggable) {
+
+            preventDefault(e);
+
+            var localCursorPoint = this.group.transformCoordToLocal(e.offsetX, e.offsetY);
+
+            this._creatingCover = null;
+            var panel = this._creatingPanel = getPanelByPoint(this, e, localCursorPoint);
+
+            if (panel) {
+                this._dragging = true;
+                this._track = [localCursorPoint.slice()];
+            }
+        }
+    },
+
+    mousemove: function (e) {
+        var localCursorPoint = this.group.transformCoordToLocal(e.offsetX, e.offsetY);
+
+        resetCursor(this, e, localCursorPoint);
+
+        if (this._dragging) {
+
+            preventDefault(e);
+
+            var eventParams = updateCoverByMouse(this, e, localCursorPoint, false);
+
+            eventParams && trigger(this, eventParams);
+        }
+    },
+
+    mouseup: handleDragEnd //,
+
+    // FIXME
+    // in tooltip, globalout should not be triggered.
+    // globalout: handleDragEnd
+};
+
+function handleDragEnd(e) {
+    if (this._dragging) {
+
+        preventDefault(e);
+
+        var localCursorPoint = this.group.transformCoordToLocal(e.offsetX, e.offsetY);
+        var eventParams = updateCoverByMouse(this, e, localCursorPoint, true);
+
+        this._dragging = false;
+        this._track = [];
+        this._creatingCover = null;
+
+        // trigger event shoule be at final, after procedure will be nested.
+        eventParams && trigger(this, eventParams);
+    }
+}
+
+/**
+ * key: brushType
+ * @type {Object}
+ */
+var coverRenderers = {
+
+    lineX: getLineRenderer(0),
+
+    lineY: getLineRenderer(1),
+
+    rect: {
+        createCover: function (controller, brushOption) {
+            return createBaseRectCover(
+                curry$2(
+                    driftRect,
+                    function (range) {
+                        return range;
+                    },
+                    function (range) {
+                        return range;
+                    }
+                ),
+                controller,
+                brushOption,
+                ['w', 'e', 'n', 's', 'se', 'sw', 'ne', 'nw']
+            );
+        },
+        getCreatingRange: function (localTrack) {
+            var ends = getTrackEnds(localTrack);
+            return formatRectRange(ends[1][0], ends[1][1], ends[0][0], ends[0][1]);
+        },
+        updateCoverShape: function (controller, cover, localRange, brushOption) {
+            updateBaseRect(controller, cover, localRange, brushOption);
+        },
+        updateCommon: updateCommon,
+        contain: mainShapeContain
+    },
+
+    polygon: {
+        createCover: function (controller, brushOption) {
+            var cover = new Group();
+
+            // Do not use graphic.Polygon because graphic.Polyline do not close the
+            // border of the shape when drawing, which is a better experience for user.
+            cover.add(new Polyline({
+                name: 'main',
+                style: makeStyle(brushOption),
+                silent: true
+            }));
+
+            return cover;
+        },
+        getCreatingRange: function (localTrack) {
+            return localTrack;
+        },
+        endCreating: function (controller, cover) {
+            cover.remove(cover.childAt(0));
+            // Use graphic.Polygon close the shape.
+            cover.add(new Polygon({
+                name: 'main',
+                draggable: true,
+                drift: curry$2(driftPolygon, controller, cover),
+                ondragend: curry$2(trigger, controller, {isEnd: true})
+            }));
+        },
+        updateCoverShape: function (controller, cover, localRange, brushOption) {
+            cover.childAt(0).setShape({
+                points: clipByPanel(controller, cover, localRange)
+            });
+        },
+        updateCommon: updateCommon,
+        contain: mainShapeContain
+    }
+};
+
+function getLineRenderer(xyIndex) {
+    return {
+        createCover: function (controller, brushOption) {
+            return createBaseRectCover(
+                curry$2(
+                    driftRect,
+                    function (range) {
+                        var rectRange = [range, [0, 100]];
+                        xyIndex && rectRange.reverse();
+                        return rectRange;
+                    },
+                    function (rectRange) {
+                        return rectRange[xyIndex];
+                    }
+                ),
+                controller,
+                brushOption,
+                [['w', 'e'], ['n', 's']][xyIndex]
+            );
+        },
+        getCreatingRange: function (localTrack) {
+            var ends = getTrackEnds(localTrack);
+            var min = mathMin$6(ends[0][xyIndex], ends[1][xyIndex]);
+            var max = mathMax$6(ends[0][xyIndex], ends[1][xyIndex]);
+
+            return [min, max];
+        },
+        updateCoverShape: function (controller, cover, localRange, brushOption) {
+            var otherExtent;
+            // If brushWidth not specified, fit the panel.
+            var panel = getPanelByCover(controller, cover);
+            if (panel !== true && panel.getLinearBrushOtherExtent) {
+                otherExtent = panel.getLinearBrushOtherExtent(
+                    xyIndex, controller._transform
+                );
+            }
+            else {
+                var zr = controller._zr;
+                otherExtent = [0, [zr.getWidth(), zr.getHeight()][1 - xyIndex]];
+            }
+            var rectRange = [localRange, otherExtent];
+            xyIndex && rectRange.reverse();
+
+            updateBaseRect(controller, cover, rectRange, brushOption);
+        },
+        updateCommon: updateCommon,
+        contain: mainShapeContain
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function makeRectPanelClipPath(rect) {
+    rect = normalizeRect(rect);
+    return function (localPoints, transform) {
+        return clipPointsByRect(localPoints, rect);
+    };
+}
+
+function makeLinearBrushOtherExtent(rect, specifiedXYIndex) {
+    rect = normalizeRect(rect);
+    return function (xyIndex) {
+        var idx = specifiedXYIndex != null ? specifiedXYIndex : xyIndex;
+        var brushWidth = idx ? rect.width : rect.height;
+        var base = idx ? rect.x : rect.y;
+        return [base, base + (brushWidth || 0)];
+    };
+}
+
+function makeRectIsTargetByCursor(rect, api, targetModel) {
+    rect = normalizeRect(rect);
+    return function (e, localCursorPoint, transform) {
+        return rect.contain(localCursorPoint[0], localCursorPoint[1])
+            && !onIrrelevantElement(e, api, targetModel);
+    };
+}
+
+// Consider width/height is negative.
+function normalizeRect(rect) {
+    return BoundingRect.create(rect);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var elementList = ['axisLine', 'axisTickLabel', 'axisName'];
+
+var AxisView$2 = extendComponentView({
+
+    type: 'parallelAxis',
+
+    /**
+     * @override
+     */
+    init: function (ecModel, api) {
+        AxisView$2.superApply(this, 'init', arguments);
+
+        /**
+         * @type {module:echarts/component/helper/BrushController}
+         */
+        (this._brushController = new BrushController(api.getZr()))
+            .on('brush', bind(this._onBrush, this));
+    },
+
+    /**
+     * @override
+     */
+    render: function (axisModel, ecModel, api, payload) {
+        if (fromAxisAreaSelect(axisModel, ecModel, payload)) {
+            return;
+        }
+
+        this.axisModel = axisModel;
+        this.api = api;
+
+        this.group.removeAll();
+
+        var oldAxisGroup = this._axisGroup;
+        this._axisGroup = new Group();
+        this.group.add(this._axisGroup);
+
+        if (!axisModel.get('show')) {
+            return;
+        }
+
+        var coordSysModel = getCoordSysModel(axisModel, ecModel);
+        var coordSys = coordSysModel.coordinateSystem;
+
+        var areaSelectStyle = axisModel.getAreaSelectStyle();
+        var areaWidth = areaSelectStyle.width;
+
+        var dim = axisModel.axis.dim;
+        var axisLayout = coordSys.getAxisLayout(dim);
+
+        var builderOpt = extend(
+            {strokeContainThreshold: areaWidth},
+            axisLayout
+        );
+
+        var axisBuilder = new AxisBuilder(axisModel, builderOpt);
+
+        each$1(elementList, axisBuilder.add, axisBuilder);
+
+        this._axisGroup.add(axisBuilder.getGroup());
+
+        this._refreshBrushController(
+            builderOpt, areaSelectStyle, axisModel, coordSysModel, areaWidth, api
+        );
+
+        var animationModel = (payload && payload.animation === false) ? null : axisModel;
+        groupTransition(oldAxisGroup, this._axisGroup, animationModel);
+    },
+
+    // /**
+    //  * @override
+    //  */
+    // updateVisual: function (axisModel, ecModel, api, payload) {
+    //     this._brushController && this._brushController
+    //         .updateCovers(getCoverInfoList(axisModel));
+    // },
+
+    _refreshBrushController: function (
+        builderOpt, areaSelectStyle, axisModel, coordSysModel, areaWidth, api
+    ) {
+        // After filtering, axis may change, select area needs to be update.
+        var extent = axisModel.axis.getExtent();
+        var extentLen = extent[1] - extent[0];
+        var extra = Math.min(30, Math.abs(extentLen) * 0.1); // Arbitrary value.
+
+        // width/height might be negative, which will be
+        // normalized in BoundingRect.
+        var rect = BoundingRect.create({
+            x: extent[0],
+            y: -areaWidth / 2,
+            width: extentLen,
+            height: areaWidth
+        });
+        rect.x -= extra;
+        rect.width += 2 * extra;
+
+        this._brushController
+            .mount({
+                enableGlobalPan: true,
+                rotation: builderOpt.rotation,
+                position: builderOpt.position
+            })
+            .setPanels([{
+                panelId: 'pl',
+                clipPath: makeRectPanelClipPath(rect),
+                isTargetByCursor: makeRectIsTargetByCursor(rect, api, coordSysModel),
+                getLinearBrushOtherExtent: makeLinearBrushOtherExtent(rect, 0)
+            }])
+            .enableBrush({
+                brushType: 'lineX',
+                brushStyle: areaSelectStyle,
+                removeOnClick: true
+            })
+            .updateCovers(getCoverInfoList(axisModel));
+    },
+
+    _onBrush: function (coverInfoList, opt) {
+        // Do not cache these object, because the mey be changed.
+        var axisModel = this.axisModel;
+        var axis = axisModel.axis;
+        var intervals = map(coverInfoList, function (coverInfo) {
+            return [
+                axis.coordToData(coverInfo.range[0], true),
+                axis.coordToData(coverInfo.range[1], true)
+            ];
+        });
+
+        // If realtime is true, action is not dispatched on drag end, because
+        // the drag end emits the same params with the last drag move event,
+        // and may have some delay when using touch pad.
+        if (!axisModel.option.realtime === opt.isEnd || opt.removeOnClick) { // jshint ignore:line
+            this.api.dispatchAction({
+                type: 'axisAreaSelect',
+                parallelAxisId: axisModel.id,
+                intervals: intervals
+            });
+        }
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._brushController.dispose();
+    }
+});
+
+function fromAxisAreaSelect(axisModel, ecModel, payload) {
+    return payload
+        && payload.type === 'axisAreaSelect'
+        && ecModel.findComponents(
+            {mainType: 'parallelAxis', query: payload}
+        )[0] === axisModel;
+}
+
+function getCoverInfoList(axisModel) {
+    var axis = axisModel.axis;
+    return map(axisModel.activeIntervals, function (interval) {
+        return {
+            brushType: 'lineX',
+            panelId: 'pl',
+            range: [
+                axis.dataToCoord(interval[0], true),
+                axis.dataToCoord(interval[1], true)
+            ]
+        };
+    });
+}
+
+function getCoordSysModel(axisModel, ecModel) {
+    return ecModel.getComponent(
+        'parallel', axisModel.get('parallelIndex')
+    );
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CLICK_THRESHOLD = 5; // > 4
+
+// Parallel view
+extendComponentView({
+    type: 'parallel',
+
+    render: function (parallelModel, ecModel, api) {
+        this._model = parallelModel;
+        this._api = api;
+
+        if (!this._handlers) {
+            this._handlers = {};
+            each$1(handlers, function (handler, eventName) {
+                api.getZr().on(eventName, this._handlers[eventName] = bind(handler, this));
+            }, this);
+        }
+
+        createOrUpdate(
+            this,
+            '_throttledDispatchExpand',
+            parallelModel.get('axisExpandRate'),
+            'fixRate'
+        );
+    },
+
+    dispose: function (ecModel, api) {
+        each$1(this._handlers, function (handler, eventName) {
+            api.getZr().off(eventName, handler);
+        });
+        this._handlers = null;
+    },
+
+    /**
+     * @param {Object} [opt] If null, cancle the last action triggering for debounce.
+     */
+    _throttledDispatchExpand: function (opt) {
+        this._dispatchExpand(opt);
+    },
+
+    _dispatchExpand: function (opt) {
+        opt && this._api.dispatchAction(
+            extend({type: 'parallelAxisExpand'}, opt)
+        );
+    }
+
+});
+
+var handlers = {
+
+    mousedown: function (e) {
+        if (checkTrigger(this, 'click')) {
+            this._mouseDownPoint = [e.offsetX, e.offsetY];
+        }
+    },
+
+    mouseup: function (e) {
+        var mouseDownPoint = this._mouseDownPoint;
+
+        if (checkTrigger(this, 'click') && mouseDownPoint) {
+            var point = [e.offsetX, e.offsetY];
+            var dist = Math.pow(mouseDownPoint[0] - point[0], 2)
+                + Math.pow(mouseDownPoint[1] - point[1], 2);
+
+            if (dist > CLICK_THRESHOLD) {
+                return;
+            }
+
+            var result = this._model.coordinateSystem.getSlidedAxisExpandWindow(
+                [e.offsetX, e.offsetY]
+            );
+
+            result.behavior !== 'none' && this._dispatchExpand({
+                axisExpandWindow: result.axisExpandWindow
+            });
+        }
+
+        this._mouseDownPoint = null;
+    },
+
+    mousemove: function (e) {
+        // Should do nothing when brushing.
+        if (this._mouseDownPoint || !checkTrigger(this, 'mousemove')) {
+            return;
+        }
+        var model = this._model;
+        var result = model.coordinateSystem.getSlidedAxisExpandWindow(
+            [e.offsetX, e.offsetY]
+        );
+
+        var behavior = result.behavior;
+        behavior === 'jump' && this._throttledDispatchExpand.debounceNextCall(model.get('axisExpandDebounce'));
+        this._throttledDispatchExpand(
+            behavior === 'none'
+                ? null // Cancle the last trigger, in case that mouse slide out of the area quickly.
+                : {
+                    axisExpandWindow: result.axisExpandWindow,
+                    // Jumping uses animation, and sliding suppresses animation.
+                    animation: behavior === 'jump'  ? null : false
+                }
+        );
+    }
+};
+
+function checkTrigger(view, triggerOn) {
+    var model = view._model;
+    return model.get('axisExpandable') && model.get('axisExpandTriggerOn') === triggerOn;
+}
+
+registerPreprocessor(parallelPreprocessor);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.parallel',
+
+    dependencies: ['parallel'],
+
+    visualColorAccessPath: 'lineStyle.color',
+
+    getInitialData: function (option, ecModel) {
+        var source = this.getSource();
+
+        setEncodeAndDimensions(source, this);
+
+        return createListFromArray(source, this);
+    },
+
+    /**
+     * User can get data raw indices on 'axisAreaSelected' event received.
+     *
+     * @public
+     * @param {string} activeState 'active' or 'inactive' or 'normal'
+     * @return {Array.<number>} Raw indices
+     */
+    getRawIndicesByActiveState: function (activeState) {
+        var coordSys = this.coordinateSystem;
+        var data = this.getData();
+        var indices = [];
+
+        coordSys.eachActiveState(data, function (theActiveState, dataIndex) {
+            if (activeState === theActiveState) {
+                indices.push(data.getRawIndex(dataIndex));
+            }
+        });
+
+        return indices;
+    },
+
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+
+        coordinateSystem: 'parallel',
+        parallelIndex: 0,
+
+        label: {
+            show: false
+        },
+
+        inactiveOpacity: 0.05,
+        activeOpacity: 1,
+
+        lineStyle: {
+            width: 1,
+            opacity: 0.45,
+            type: 'solid'
+        },
+        emphasis: {
+            label: {
+                show: false
+            }
+        },
+
+        progressive: 500,
+        smooth: false, // true | false | number
+
+        animationEasing: 'linear'
+    }
+});
+
+function setEncodeAndDimensions(source, seriesModel) {
+    // The mapping of parallelAxis dimension to data dimension can
+    // be specified in parallelAxis.option.dim. For example, if
+    // parallelAxis.option.dim is 'dim3', it mapping to the third
+    // dimension of data. But `data.encode` has higher priority.
+    // Moreover, parallelModel.dimension should not be regarded as data
+    // dimensions. Consider dimensions = ['dim4', 'dim2', 'dim6'];
+
+    if (source.encodeDefine) {
+        return;
+    }
+
+    var parallelModel = seriesModel.ecModel.getComponent(
+        'parallel', seriesModel.get('parallelIndex')
+    );
+    if (!parallelModel) {
+        return;
+    }
+
+    var encodeDefine = source.encodeDefine = createHashMap();
+    each$1(parallelModel.dimensions, function (axisDim) {
+        var dataDimIndex = convertDimNameToNumber(axisDim);
+        encodeDefine.set(axisDim, dataDimIndex);
+    });
+}
+
+function convertDimNameToNumber(dimName) {
+    return +dimName.replace('dim', '');
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DEFAULT_SMOOTH = 0.3;
+
+var ParallelView = Chart.extend({
+
+    type: 'parallel',
+
+    init: function () {
+
+        /**
+         * @type {module:zrender/container/Group}
+         * @private
+         */
+        this._dataGroup = new Group();
+
+        this.group.add(this._dataGroup);
+
+        /**
+         * @type {module:echarts/data/List}
+         */
+        this._data;
+
+        /**
+         * @type {boolean}
+         */
+        this._initialized;
+    },
+
+    /**
+     * @override
+     */
+    render: function (seriesModel, ecModel, api, payload) {
+        var dataGroup = this._dataGroup;
+        var data = seriesModel.getData();
+        var oldData = this._data;
+        var coordSys = seriesModel.coordinateSystem;
+        var dimensions = coordSys.dimensions;
+        var seriesScope = makeSeriesScope$2(seriesModel);
+
+        data.diff(oldData)
+            .add(add)
+            .update(update)
+            .remove(remove)
+            .execute();
+
+        function add(newDataIndex) {
+            var line = addEl(data, dataGroup, newDataIndex, dimensions, coordSys);
+            updateElCommon(line, data, newDataIndex, seriesScope);
+        }
+
+        function update(newDataIndex, oldDataIndex) {
+            var line = oldData.getItemGraphicEl(oldDataIndex);
+            var points = createLinePoints(data, newDataIndex, dimensions, coordSys);
+            data.setItemGraphicEl(newDataIndex, line);
+            var animationModel = (payload && payload.animation === false) ? null : seriesModel;
+            updateProps(line, {shape: {points: points}}, animationModel, newDataIndex);
+
+            updateElCommon(line, data, newDataIndex, seriesScope);
+        }
+
+        function remove(oldDataIndex) {
+            var line = oldData.getItemGraphicEl(oldDataIndex);
+            dataGroup.remove(line);
+        }
+
+        // First create
+        if (!this._initialized) {
+            this._initialized = true;
+            var clipPath = createGridClipShape$1(
+                coordSys, seriesModel, function () {
+                    // Callback will be invoked immediately if there is no animation
+                    setTimeout(function () {
+                        dataGroup.removeClipPath();
+                    });
+                }
+            );
+            dataGroup.setClipPath(clipPath);
+        }
+
+        this._data = data;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this._initialized = true;
+        this._data = null;
+        this._dataGroup.removeAll();
+    },
+
+    incrementalRender: function (taskParams, seriesModel, ecModel) {
+        var data = seriesModel.getData();
+        var coordSys = seriesModel.coordinateSystem;
+        var dimensions = coordSys.dimensions;
+        var seriesScope = makeSeriesScope$2(seriesModel);
+
+        for (var dataIndex = taskParams.start; dataIndex < taskParams.end; dataIndex++) {
+            var line = addEl(data, this._dataGroup, dataIndex, dimensions, coordSys);
+            line.incremental = true;
+            updateElCommon(line, data, dataIndex, seriesScope);
+        }
+    },
+
+    dispose: function () {},
+
+    // _renderForProgressive: function (seriesModel) {
+    //     var dataGroup = this._dataGroup;
+    //     var data = seriesModel.getData();
+    //     var oldData = this._data;
+    //     var coordSys = seriesModel.coordinateSystem;
+    //     var dimensions = coordSys.dimensions;
+    //     var option = seriesModel.option;
+    //     var progressive = option.progressive;
+    //     var smooth = option.smooth ? SMOOTH : null;
+
+    //     // In progressive animation is disabled, so use simple data diff,
+    //     // which effects performance less.
+    //     // (Typically performance for data with length 7000+ like:
+    //     // simpleDiff: 60ms, addEl: 184ms,
+    //     // in RMBP 2.4GHz intel i7, OSX 10.9 chrome 50.0.2661.102 (64-bit))
+    //     if (simpleDiff(oldData, data, dimensions)) {
+    //         dataGroup.removeAll();
+    //         data.each(function (dataIndex) {
+    //             addEl(data, dataGroup, dataIndex, dimensions, coordSys);
+    //         });
+    //     }
+
+    //     updateElCommon(data, progressive, smooth);
+
+    //     // Consider switch between progressive and not.
+    //     data.__plProgressive = true;
+    //     this._data = data;
+    // },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._dataGroup && this._dataGroup.removeAll();
+        this._data = null;
+    }
+});
+
+function createGridClipShape$1(coordSys, seriesModel, cb) {
+    var parallelModel = coordSys.model;
+    var rect = coordSys.getRect();
+    var rectEl = new Rect({
+        shape: {
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        }
+    });
+
+    var dim = parallelModel.get('layout') === 'horizontal' ? 'width' : 'height';
+    rectEl.setShape(dim, 0);
+    initProps(rectEl, {
+        shape: {
+            width: rect.width,
+            height: rect.height
+        }
+    }, seriesModel, cb);
+    return rectEl;
+}
+
+function createLinePoints(data, dataIndex, dimensions, coordSys) {
+    var points = [];
+    for (var i = 0; i < dimensions.length; i++) {
+        var dimName = dimensions[i];
+        var value = data.get(data.mapDimension(dimName), dataIndex);
+        if (!isEmptyValue(value, coordSys.getAxis(dimName).type)) {
+            points.push(coordSys.dataToPoint(value, dimName));
+        }
+    }
+    return points;
+}
+
+function addEl(data, dataGroup, dataIndex, dimensions, coordSys) {
+    var points = createLinePoints(data, dataIndex, dimensions, coordSys);
+    var line = new Polyline({
+        shape: {points: points},
+        silent: true,
+        z2: 10
+    });
+    dataGroup.add(line);
+    data.setItemGraphicEl(dataIndex, line);
+    return line;
+}
+
+function makeSeriesScope$2(seriesModel) {
+    var smooth = seriesModel.get('smooth', true);
+    smooth === true && (smooth = DEFAULT_SMOOTH);
+    return {
+        lineStyle: seriesModel.getModel('lineStyle').getLineStyle(),
+        smooth: smooth != null ? smooth : DEFAULT_SMOOTH
+    };
+}
+
+function updateElCommon(el, data, dataIndex, seriesScope) {
+    var lineStyle = seriesScope.lineStyle;
+
+    if (data.hasItemOption) {
+        var lineStyleModel = data.getItemModel(dataIndex).getModel('lineStyle');
+        lineStyle = lineStyleModel.getLineStyle();
+    }
+
+    el.useStyle(lineStyle);
+
+    var elStyle = el.style;
+    elStyle.fill = null;
+    // lineStyle.color have been set to itemVisual in module:echarts/visual/seriesColor.
+    elStyle.stroke = data.getItemVisual(dataIndex, 'color');
+    // lineStyle.opacity have been set to itemVisual in parallelVisual.
+    elStyle.opacity = data.getItemVisual(dataIndex, 'opacity');
+
+    seriesScope.smooth && (el.shape.smooth = seriesScope.smooth);
+}
+
+// function simpleDiff(oldData, newData, dimensions) {
+//     var oldLen;
+//     if (!oldData
+//         || !oldData.__plProgressive
+//         || (oldLen = oldData.count()) !== newData.count()
+//     ) {
+//         return true;
+//     }
+
+//     var dimLen = dimensions.length;
+//     for (var i = 0; i < oldLen; i++) {
+//         for (var j = 0; j < dimLen; j++) {
+//             if (oldData.get(dimensions[j], i) !== newData.get(dimensions[j], i)) {
+//                 return true;
+//             }
+//         }
+//     }
+
+//     return false;
+// }
+
+// FIXME
+// 公用方法?
+function isEmptyValue(val, axisType) {
+    return axisType === 'category'
+        ? val == null
+        : (val == null || isNaN(val)); // axisType === 'value'
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var opacityAccessPath$1 = ['lineStyle', 'normal', 'opacity'];
+
+var parallelVisual = {
+
+    seriesType: 'parallel',
+
+    reset: function (seriesModel, ecModel, api) {
+
+        var itemStyleModel = seriesModel.getModel('itemStyle');
+        var lineStyleModel = seriesModel.getModel('lineStyle');
+        var globalColors = ecModel.get('color');
+
+        var color = lineStyleModel.get('color')
+            || itemStyleModel.get('color')
+            || globalColors[seriesModel.seriesIndex % globalColors.length];
+        var inactiveOpacity = seriesModel.get('inactiveOpacity');
+        var activeOpacity = seriesModel.get('activeOpacity');
+        var lineStyle = seriesModel.getModel('lineStyle').getLineStyle();
+
+        var coordSys = seriesModel.coordinateSystem;
+        var data = seriesModel.getData();
+
+        var opacityMap = {
+            normal: lineStyle.opacity,
+            active: activeOpacity,
+            inactive: inactiveOpacity
+        };
+
+        data.setVisual('color', color);
+
+        function progress(params, data) {
+            coordSys.eachActiveState(data, function (activeState, dataIndex) {
+                var opacity = opacityMap[activeState];
+                if (activeState === 'normal' && data.hasItemOption) {
+                    var itemOpacity = data.getItemModel(dataIndex).get(opacityAccessPath$1, true);
+                    itemOpacity != null && (opacity = itemOpacity);
+                }
+                data.setItemVisual(dataIndex, 'opacity', opacity);
+            }, params.start, params.end);
+        }
+
+        return {progress: progress};
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(parallelVisual);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Get initial data and define sankey view's series model
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var SankeySeries = SeriesModel.extend({
+
+    type: 'series.sankey',
+
+    layoutInfo: null,
+
+    /**
+     * Init a graph data structure from data in option series
+     *
+     * @param  {Object} option  the object used to config echarts view
+     * @return {module:echarts/data/List} storage initial data
+     */
+    getInitialData: function (option) {
+        var links = option.edges || option.links;
+        var nodes = option.data || option.nodes;
+        if (nodes && links) {
+            var graph = createGraphFromNodeEdge(nodes, links, this, true);
+            return graph.data;
+        }
+    },
+
+    setNodePosition: function (dataIndex, localPosition) {
+        var dataItem = this.option.data[dataIndex];
+        dataItem.localX = localPosition[0];
+        dataItem.localY = localPosition[1];
+    },
+
+    /**
+     * Return the graphic data structure
+     *
+     * @return {module:echarts/data/Graph} graphic data structure
+     */
+    getGraph: function () {
+        return this.getData().graph;
+    },
+
+    /**
+     * Get edge data of graphic data structure
+     *
+     * @return {module:echarts/data/List} data structure of list
+     */
+    getEdgeData: function () {
+        return this.getGraph().edgeData;
+    },
+
+    /**
+     * @override
+     */
+    formatTooltip: function (dataIndex, multipleSeries, dataType) {
+        // dataType === 'node' or empty do not show tooltip by default
+        if (dataType === 'edge') {
+            var params = this.getDataParams(dataIndex, dataType);
+            var rawDataOpt = params.data;
+            var html = rawDataOpt.source + ' -- ' + rawDataOpt.target;
+            if (params.value) {
+                html += ' : ' + params.value;
+            }
+            return encodeHTML(html);
+        }
+
+        return SankeySeries.superCall(this, 'formatTooltip', dataIndex, multipleSeries);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        coordinateSystem: 'view',
+
+        layout: null,
+
+        // the position of the whole view
+        left: '5%',
+        top: '5%',
+        right: '20%',
+        bottom: '5%',
+
+        // the dx of the node
+        nodeWidth: 20,
+
+        // the vertical distance between two nodes
+        nodeGap: 8,
+
+        // control if the node can move or not
+        draggable: true,
+
+        // the number of iterations to change the position of the node
+        layoutIterations: 32,
+
+        label: {
+            show: true,
+            position: 'right',
+            color: '#000',
+            fontSize: 12
+        },
+
+        itemStyle: {
+            borderWidth: 1,
+            borderColor: '#333'
+        },
+
+        lineStyle: {
+            color: '#314656',
+            opacity: 0.2,
+            curveness: 0.5
+        },
+
+        emphasis: {
+            label: {
+                show: true
+            },
+            lineStyle: {
+                opacity: 0.6
+            }
+        },
+
+        animationEasing: 'linear',
+
+        animationDuration: 1000
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  The file used to draw sankey view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+var SankeyShape = extendShape({
+    shape: {
+        x1: 0, y1: 0,
+        x2: 0, y2: 0,
+        cpx1: 0, cpy1: 0,
+        cpx2: 0, cpy2: 0,
+
+        extent: 0
+    },
+
+    buildPath: function (ctx, shape) {
+        var halfExtent = shape.extent / 2;
+        ctx.moveTo(shape.x1, shape.y1 - halfExtent);
+        ctx.bezierCurveTo(
+            shape.cpx1, shape.cpy1 - halfExtent,
+            shape.cpx2, shape.cpy2 - halfExtent,
+            shape.x2, shape.y2 - halfExtent
+        );
+        ctx.lineTo(shape.x2, shape.y2 + halfExtent);
+        ctx.bezierCurveTo(
+            shape.cpx2, shape.cpy2 + halfExtent,
+            shape.cpx1, shape.cpy1 + halfExtent,
+            shape.x1, shape.y1 + halfExtent
+        );
+        ctx.closePath();
+    }
+});
+
+extendChartView({
+
+    type: 'sankey',
+
+    /**
+     * @private
+     * @type {module:echarts/chart/sankey/SankeySeries}
+     */
+    _model: null,
+
+    render: function (seriesModel, ecModel, api) {
+        var graph = seriesModel.getGraph();
+        var group = this.group;
+        var layoutInfo = seriesModel.layoutInfo;
+        // view width
+        var width = layoutInfo.width;
+        // view height
+        var height = layoutInfo.height;
+        
+        var nodeData = seriesModel.getData();
+        var edgeData = seriesModel.getData('edge');
+
+        this._model = seriesModel;
+
+        group.removeAll();
+
+        group.attr('position', [layoutInfo.x, layoutInfo.y]);
+
+        // generate a bezire Curve for each edge
+        graph.eachEdge(function (edge) {
+            var curve = new SankeyShape();
+            curve.dataIndex = edge.dataIndex;
+            curve.seriesIndex = seriesModel.seriesIndex;
+            curve.dataType = 'edge';
+            var lineStyleModel = edge.getModel('lineStyle');
+            var curvature = lineStyleModel.get('curveness');
+            var n1Layout = edge.node1.getLayout();
+            var node1Model =edge.node1.getModel();
+            var dragX1 = node1Model.get('localX');
+            var dragY1 = node1Model.get('localY');
+            var n2Layout = edge.node2.getLayout();
+            var node2Model = edge.node2.getModel();
+            var dragX2 = node2Model.get('localX');
+            var dragY2 = node2Model.get('localY');
+            var edgeLayout = edge.getLayout();
+
+            curve.shape.extent = Math.max(1, edgeLayout.dy);
+
+            var x1 = (dragX1 != null ? dragX1 * width : n1Layout.x) + n1Layout.dx;
+            var y1 = (dragY1 != null ? dragY1 * height : n1Layout.y) + edgeLayout.sy + edgeLayout.dy / 2;
+            var x2 = dragX2 != null ? dragX2 * width : n2Layout.x;
+            var y2 = (dragY2 != null ? dragY2 * height : n2Layout.y) + edgeLayout.ty + edgeLayout.dy / 2;
+            var cpx1 = x1 * (1 - curvature) + x2 * curvature;
+            var cpy1 = y1;
+            var cpx2 = x1 * curvature + x2 * (1 - curvature);
+            var cpy2 = y2;
+
+            curve.setShape({
+                x1: x1,
+                y1: y1,
+                x2: x2,
+                y2: y2,
+                cpx1: cpx1,
+                cpy1: cpy1,
+                cpx2: cpx2,
+                cpy2: cpy2
+            });
+
+            curve.setStyle(lineStyleModel.getItemStyle());
+            // Special color, use source node color or target node color
+            switch (curve.style.fill) {
+                case 'source':
+                    curve.style.fill = edge.node1.getVisual('color');
+                    break;
+                case 'target':
+                    curve.style.fill = edge.node2.getVisual('color');
+                    break;
+            }
+
+            setHoverStyle(curve, edge.getModel('emphasis.lineStyle').getItemStyle());
+
+            group.add(curve);
+
+            edgeData.setItemGraphicEl(edge.dataIndex, curve);
+        });
+
+        // generate a rect for each node
+        graph.eachNode(function (node) {
+            var layout = node.getLayout();
+            var itemModel = node.getModel();
+            var dragX = itemModel.get('localX');
+            var dragY = itemModel.get('localY');
+            var labelModel = itemModel.getModel('label');
+            var labelHoverModel = itemModel.getModel('emphasis.label');
+
+            var rect = new Rect({
+                shape: {
+                    x: dragX != null ? dragX * width : layout.x,
+                    y: dragY != null ? dragY * height : layout.y,
+                    width: layout.dx,
+                    height: layout.dy
+                },
+                style: itemModel.getModel('itemStyle').getItemStyle()
+            });
+
+            var hoverStyle = node.getModel('emphasis.itemStyle').getItemStyle();
+
+            setLabelStyle(
+                rect.style, hoverStyle, labelModel, labelHoverModel,
+                {
+                    labelFetcher: seriesModel,
+                    labelDataIndex: node.dataIndex,
+                    defaultText: node.id,
+                    isRectText: true
+                }
+            );
+
+            rect.setStyle('fill', node.getVisual('color'));
+
+            setHoverStyle(rect, hoverStyle);
+
+            group.add(rect);
+
+            nodeData.setItemGraphicEl(node.dataIndex, rect);
+
+            rect.dataType = 'node';
+        });
+
+        var draggable = seriesModel.get('draggable');
+        if (draggable) {
+            nodeData.eachItemGraphicEl(function (el, dataIndex) {
+                el.drift = function (dx, dy) {
+                    this.shape.x += dx;
+                    this.shape.y += dy;
+                    this.dirty();
+                    api.dispatchAction({
+                        type: 'dragNode',
+                        seriesId: seriesModel.id,
+                        dataIndex: nodeData.getRawIndex(dataIndex),
+                        localX: this.shape.x / width,
+                        localY: this.shape.y / height
+                    });
+                };
+        
+                el.draggable = true;
+                el.cursor = 'move';
+            });
+        }
+        
+        if (!this._data && seriesModel.get('animation')) {
+            group.setClipPath(createGridClipShape$2(group.getBoundingRect(), seriesModel, function () {
+                group.removeClipPath();
+            }));
+        }
+
+        this._data = seriesModel.getData();
+    },
+
+    dispose: function () {}
+});
+
+// add animation to the view
+function createGridClipShape$2(rect, seriesModel, cb) {
+    var rectEl = new Rect({
+        shape: {
+            x: rect.x - 10,
+            y: rect.y - 10,
+            width: 0,
+            height: rect.height + 20
+        }
+    });
+    initProps(rectEl, {
+        shape: {
+            width: rect.width + 20,
+            height: rect.height + 20
+        }
+    }, seriesModel, cb);
+
+    return rectEl;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction({
+    type: 'dragNode',
+    event: 'dragNode',
+    // here can only use 'update' now, other value is not support in echarts.
+    update: 'update'
+}, function (payload, ecModel) {
+    ecModel.eachComponent({mainType: 'series', subType: 'sankey', query: payload}, function (seriesModel) {
+        seriesModel.setNodePosition(payload.dataIndex, [payload.localX, payload.localY]);
+    });
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* The implementation references to d3.js. The use of the source
+* code of this file is also subject to the terms and consitions
+* of its license (BSD-3Clause, see <echarts/src/licenses/LICENSE-d3>).
+*/
+
+
+/**
+ * nest helper used to group by the array.
+ * can specified the keys and sort the keys.
+ */
+function nest() {
+
+    var keysFunction = [];
+    var sortKeysFunction = [];
+
+    /**
+     * map an Array into the mapObject.
+     * @param {Array} array
+     * @param {number} depth
+     */
+    function map$$1(array, depth) {
+        if (depth >= keysFunction.length) {
+            return array;
+        }
+        var i = -1;
+        var n = array.length;
+        var keyFunction = keysFunction[depth++];
+        var mapObject = {};
+        var valuesByKey = {};
+
+        while (++i < n) {
+            var keyValue = keyFunction(array[i]);
+            var values = valuesByKey[keyValue];
+
+            if (values) {
+                values.push(array[i]);
+            }
+            else {
+                valuesByKey[keyValue] = [array[i]];
+            }
+        }
+
+        each$1(valuesByKey, function (value, key) {
+            mapObject[key] = map$$1(value, depth);
+        });
+
+        return mapObject;
+    }
+
+    /**
+     * transform the Map Object to multidimensional Array
+     * @param {Object} map
+     * @param {number} depth
+     */
+    function entriesMap(mapObject, depth) {
+        if (depth >= keysFunction.length) {
+            return mapObject;
+        }
+        var array = [];
+        var sortKeyFunction = sortKeysFunction[depth++];
+
+        each$1(mapObject, function (value, key) {
+            array.push({
+                key: key, values: entriesMap(value, depth)
+            });
+        });
+
+        if (sortKeyFunction) {
+            return array.sort(function (a, b) {
+                return sortKeyFunction(a.key, b.key);
+            });
+        }
+        else {
+            return array;
+        }
+    }
+
+    return {
+        /**
+         * specified the key to groupby the arrays.
+         * users can specified one more keys.
+         * @param {Function} d
+         */
+        key: function (d) {
+            keysFunction.push(d);
+            return this;
+        },
+
+        /**
+         * specified the comparator to sort the keys
+         * @param {Function} order
+         */
+        sortKeys: function (order) {
+            sortKeysFunction[keysFunction.length - 1] = order;
+            return this;
+        },
+
+        /**
+         * the array to be grouped by.
+         * @param {Array} array
+         */
+        entries: function (array) {
+            return entriesMap(map$$1(array, 0), 0);
+        }
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file The layout algorithm of sankey view
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var sankeyLayout = function (ecModel, api, payload) {
+
+    ecModel.eachSeriesByType('sankey', function (seriesModel) {
+
+        var nodeWidth = seriesModel.get('nodeWidth');
+        var nodeGap = seriesModel.get('nodeGap');
+
+        var layoutInfo = getViewRect$3(seriesModel, api);
+
+        seriesModel.layoutInfo = layoutInfo;
+
+        var width = layoutInfo.width;
+        var height = layoutInfo.height;
+
+        var graph = seriesModel.getGraph();
+
+        var nodes = graph.nodes;
+        var edges = graph.edges;
+
+        computeNodeValues(nodes);
+
+        var filteredNodes = filter(nodes, function (node) {
+            return node.getLayout().value === 0;
+        });
+
+        var iterations = filteredNodes.length !== 0
+            ? 0 : seriesModel.get('layoutIterations');
+
+        layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations);
+    });
+};
+
+/**
+ * Get the layout position of the whole view
+ *
+ * @param {module:echarts/model/Series} seriesModel  the model object of sankey series
+ * @param {module:echarts/ExtensionAPI} api  provide the API list that the developer can call
+ * @return {module:zrender/core/BoundingRect}  size of rect to draw the sankey view
+ */
+function getViewRect$3(seriesModel, api) {
+    return getLayoutRect(
+        seriesModel.getBoxLayoutParams(), {
+            width: api.getWidth(),
+            height: api.getHeight()
+        }
+    );
+}
+
+function layoutSankey(nodes, edges, nodeWidth, nodeGap, width, height, iterations) {
+    computeNodeBreadths(nodes, edges, nodeWidth, width);
+    computeNodeDepths(nodes, edges, height, nodeGap, iterations);
+    computeEdgeDepths(nodes);
+}
+
+/**
+ * Compute the value of each node by summing the associated edge's value
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ */
+function computeNodeValues(nodes) {
+    each$1(nodes, function (node) {
+        var value1 = sum(node.outEdges, getEdgeValue);
+        var value2 = sum(node.inEdges, getEdgeValue);
+        var value = Math.max(value1, value2);
+        node.setLayout({value: value}, true);
+    });
+}
+
+/**
+ * Compute the x-position for each node.
+ * 
+ * Here we use Kahn algorithm to detect cycle when we traverse
+ * the node to computer the initial x position.
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param  {number} nodeWidth  the dx of the node
+ * @param  {number} width  the whole width of the area to draw the view
+ */
+function computeNodeBreadths(nodes, edges, nodeWidth, width) {
+    // Used to mark whether the edge is deleted. if it is deleted,
+    // the value is 0, otherwise it is 1.
+    var remainEdges = [];
+    // Storage each node's indegree.
+    var indegreeArr = [];
+    //Used to storage the node with indegree is equal to 0.
+    var zeroIndegrees = [];
+    var nextNode = [];
+    var x = 0;
+    var kx = 0;
+
+    for (var i = 0; i < edges.length; i++) {
+        remainEdges[i] = 1;
+    }
+
+    for (var i = 0; i < nodes.length; i++) {
+        indegreeArr[i] = nodes[i].inEdges.length;
+        if (indegreeArr[i] === 0) {
+            zeroIndegrees.push(nodes[i]);
+        }
+    }
+    
+    while (zeroIndegrees.length) {
+        each$1(zeroIndegrees, function (node) {
+            node.setLayout({x: x}, true);
+            node.setLayout({dx: nodeWidth}, true);
+            each$1(node.outEdges, function (edge) {
+                var indexEdge = edges.indexOf(edge);
+                remainEdges[indexEdge] = 0;
+                var targetNode = edge.node2;
+                var nodeIndex = nodes.indexOf(targetNode);
+                if (--indegreeArr[nodeIndex] === 0) {
+                    nextNode.push(targetNode);
+                }
+            });
+        });
+       
+        ++x;
+        zeroIndegrees = nextNode;
+        nextNode = [];
+    }
+    
+    for (var i = 0; i < remainEdges.length; i++) {
+        if (__DEV__) {
+            if (remainEdges[i] === 1) {
+                throw new Error('Sankey is a DAG, the original data has cycle!');
+            }
+        } 
+    }
+
+    moveSinksRight(nodes, x);
+    kx = (width - nodeWidth) / (x - 1);
+
+    scaleNodeBreadths(nodes, kx);
+}
+
+/**
+ * All the node without outEgdes are assigned maximum x-position and
+ *     be aligned in the last column.
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {number} x  value (x-1) use to assign to node without outEdges
+ *     as x-position
+ */
+function moveSinksRight(nodes, x) {
+    each$1(nodes, function (node) {
+        if (!node.outEdges.length) {
+            node.setLayout({x: x - 1}, true);
+        }
+    });
+}
+
+/**
+ * Scale node x-position to the width
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {number} kx   multiple used to scale nodes
+ */
+function scaleNodeBreadths(nodes, kx) {
+    each$1(nodes, function (node) {
+        var nodeX = node.getLayout().x * kx;
+        node.setLayout({x: nodeX}, true);
+    });
+}
+
+/**
+ * Using Gauss-Seidel iterations method to compute the node depth(y-position)
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {module:echarts/data/Graph~Edge} edges  edge of sankey view
+ * @param {number} height  the whole height of the area to draw the view
+ * @param {number} nodeGap  the vertical distance between two nodes
+ *     in the same column.
+ * @param {number} iterations  the number of iterations for the algorithm
+ */
+function computeNodeDepths(nodes, edges, height, nodeGap, iterations) {
+    var nodesByBreadth = nest()
+        .key(function (d) {
+            return d.getLayout().x;
+        })
+        .sortKeys(ascending)
+        .entries(nodes)
+        .map(function (d) {
+            return d.values;
+        });
+
+    initializeNodeDepth(nodes, nodesByBreadth, edges, height, nodeGap);
+    resolveCollisions(nodesByBreadth, nodeGap, height);
+
+    for (var alpha = 1; iterations > 0; iterations--) {
+        // 0.99 is a experience parameter, ensure that each iterations of
+        // changes as small as possible.
+        alpha *= 0.99;
+        relaxRightToLeft(nodesByBreadth, alpha);
+        resolveCollisions(nodesByBreadth, nodeGap, height);
+        relaxLeftToRight(nodesByBreadth, alpha);
+        resolveCollisions(nodesByBreadth, nodeGap, height);
+    }
+}
+
+/**
+ * Compute the original y-position for each node
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the nodes x-position.
+ * @param {module:echarts/data/Graph~Edge} edges  edge of sankey view
+ * @param {number} height  the whole height of the area to draw the view
+ * @param {number} nodeGap  the vertical distance between two nodes
+ */
+function initializeNodeDepth(nodes, nodesByBreadth, edges, height, nodeGap) {
+    var kyArray = [];
+    each$1(nodesByBreadth, function (nodes) {
+        var n = nodes.length;
+        var sum = 0;
+        each$1(nodes, function (node) {
+            sum += node.getLayout().value;
+        });
+        var ky = (height - (n - 1) * nodeGap) / sum;
+        kyArray.push(ky);
+    });
+
+    kyArray.sort(function (a, b) {
+        return a - b;
+    });
+    var ky0 = kyArray[0];
+
+    each$1(nodesByBreadth, function (nodes) {
+        each$1(nodes, function (node, i) {
+            node.setLayout({y: i}, true);
+            var nodeDy = node.getLayout().value * ky0;
+            node.setLayout({dy: nodeDy}, true);
+        });
+    });
+
+    each$1(edges, function (edge) {
+        var edgeDy = +edge.getValue() * ky0;
+        edge.setLayout({dy: edgeDy}, true);
+    });
+}
+
+/**
+ * Resolve the collision of initialized depth (y-position)
+ *
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the nodes x-position.
+ * @param {number} nodeGap  the vertical distance between two nodes
+ * @param {number} height  the whole height of the area to draw the view
+ */
+function resolveCollisions(nodesByBreadth, nodeGap, height) {
+    each$1(nodesByBreadth, function (nodes) {
+        var node;
+        var dy;
+        var y0 = 0;
+        var n = nodes.length;
+        var i;
+
+        nodes.sort(ascendingDepth);
+
+        for (i = 0; i < n; i++) {
+            node = nodes[i];
+            dy = y0 - node.getLayout().y;
+            if (dy > 0) {
+                var nodeY = node.getLayout().y + dy;
+                node.setLayout({y: nodeY}, true);
+            }
+            y0 = node.getLayout().y + node.getLayout().dy + nodeGap;
+        }
+
+        // If the bottommost node goes outside the bounds, push it back up
+        dy = y0 - nodeGap - height;
+        if (dy > 0) {
+            var nodeY = node.getLayout().y - dy;
+            node.setLayout({y: nodeY}, true);
+            y0 = node.getLayout().y;
+            for (i = n - 2; i >= 0; --i) {
+                node = nodes[i];
+                dy = node.getLayout().y + node.getLayout().dy + nodeGap - y0;
+                if (dy > 0) {
+                    nodeY = node.getLayout().y - dy;
+                    node.setLayout({y: nodeY}, true);
+                }
+                y0 = node.getLayout().y;
+            }
+        }
+    });
+}
+
+/**
+ * Change the y-position of the nodes, except most the right side nodes
+ *
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the node x-position.
+ * @param {number} alpha  parameter used to adjust the nodes y-position
+ */
+function relaxRightToLeft(nodesByBreadth, alpha) {
+    each$1(nodesByBreadth.slice().reverse(), function (nodes) {
+        each$1(nodes, function (node) {
+            if (node.outEdges.length) {
+                var y = sum(node.outEdges, weightedTarget) / sum(node.outEdges, getEdgeValue);
+                var nodeY = node.getLayout().y + (y - center$1(node)) * alpha;
+                node.setLayout({y: nodeY}, true);
+            }
+        });
+    });
+}
+
+function weightedTarget(edge) {
+    return center$1(edge.node2) * edge.getValue();
+}
+
+/**
+ * Change the y-position of the nodes, except most the left side nodes
+ *
+ * @param {Array.<Array.<module:echarts/data/Graph~Node>>} nodesByBreadth
+ *     group by the array of all sankey nodes based on the node x-position.
+ * @param {number} alpha  parameter used to adjust the nodes y-position
+ */
+function relaxLeftToRight(nodesByBreadth, alpha) {
+    each$1(nodesByBreadth, function (nodes) {
+        each$1(nodes, function (node) {
+            if (node.inEdges.length) {
+                var y = sum(node.inEdges, weightedSource) / sum(node.inEdges, getEdgeValue);
+                var nodeY = node.getLayout().y + (y - center$1(node)) * alpha;
+                node.setLayout({y: nodeY}, true);
+            }
+        });
+    });
+}
+
+function weightedSource(edge) {
+    return center$1(edge.node1) * edge.getValue();
+}
+
+/**
+ * Compute the depth(y-position) of each edge
+ *
+ * @param {module:echarts/data/Graph~Node} nodes  node of sankey view
+ */
+function computeEdgeDepths(nodes) {
+    each$1(nodes, function (node) {
+        node.outEdges.sort(ascendingTargetDepth);
+        node.inEdges.sort(ascendingSourceDepth);
+    });
+    each$1(nodes, function (node) {
+        var sy = 0;
+        var ty = 0;
+        each$1(node.outEdges, function (edge) {
+            edge.setLayout({sy: sy}, true);
+            sy += edge.getLayout().dy;
+        });
+        each$1(node.inEdges, function (edge) {
+            edge.setLayout({ty: ty}, true);
+            ty += edge.getLayout().dy;
+        });
+    });
+}
+
+function ascendingTargetDepth(a, b) {
+    return a.node2.getLayout().y - b.node2.getLayout().y;
+}
+
+function ascendingSourceDepth(a, b) {
+    return a.node1.getLayout().y - b.node1.getLayout().y;
+}
+
+function sum(array, f) {
+    var sum = 0;
+    var len = array.length;
+    var i = -1;
+    while (++i < len) {
+        var value = +f.call(array, array[i], i);
+        if (!isNaN(value)) {
+            sum += value;
+        }
+    }
+    return sum;
+}
+
+function center$1(node) {
+    return node.getLayout().y + node.getLayout().dy / 2;
+}
+
+function ascendingDepth(a, b) {
+    return a.getLayout().y - b.getLayout().y;
+}
+
+function ascending(a, b) {
+    return a - b;
+}
+
+function getEdgeValue(edge) {
+    return edge.getValue();
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual encoding for sankey view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+var sankeyVisual = function (ecModel, payload) {
+    ecModel.eachSeriesByType('sankey', function (seriesModel) {
+        var graph = seriesModel.getGraph();
+        var nodes = graph.nodes;
+        if (nodes.length) {
+            var minValue = Infinity;
+            var maxValue = -Infinity;
+            each$1(nodes, function (node) {
+                var nodeValue = node.getLayout().value;
+                if (nodeValue < minValue) {
+                    minValue = nodeValue;
+                }
+                if (nodeValue > maxValue) {
+                    maxValue = nodeValue;
+                }
+            });
+            
+            each$1(nodes, function (node) {
+                var mapping = new VisualMapping({
+                    type: 'color',
+                    mappingMethod: 'linear',
+                    dataExtent: [minValue, maxValue],
+                    visual: seriesModel.get('color')
+                });
+    
+                var mapValueToColor = mapping.mapValueToVisual(node.getLayout().value);
+                node.setVisual('color', mapValueToColor);
+                // If set itemStyle.normal.color
+                var itemModel = node.getModel();
+                var customColor = itemModel.get('itemStyle.color');
+                if (customColor != null) {
+                    node.setVisual('color', customColor);
+                }
+            });
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(sankeyLayout);
+registerVisual(sankeyVisual);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var seriesModelMixin = {
+
+    /**
+     * @private
+     * @type {string}
+     */
+    _baseAxisDim: null,
+
+    /**
+     * @override
+     */
+    getInitialData: function (option, ecModel) {
+        // When both types of xAxis and yAxis are 'value', layout is
+        // needed to be specified by user. Otherwise, layout can be
+        // judged by which axis is category.
+
+        var ordinalMeta;
+
+        var xAxisModel = ecModel.getComponent('xAxis', this.get('xAxisIndex'));
+        var yAxisModel = ecModel.getComponent('yAxis', this.get('yAxisIndex'));
+        var xAxisType = xAxisModel.get('type');
+        var yAxisType = yAxisModel.get('type');
+        var addOrdinal;
+
+        // FIXME
+        // 考虑时间轴
+
+        if (xAxisType === 'category') {
+            option.layout = 'horizontal';
+            ordinalMeta = xAxisModel.getOrdinalMeta();
+            addOrdinal = true;
+        }
+        else if (yAxisType  === 'category') {
+            option.layout = 'vertical';
+            ordinalMeta = yAxisModel.getOrdinalMeta();
+            addOrdinal = true;
+        }
+        else {
+            option.layout = option.layout || 'horizontal';
+        }
+
+        var coordDims = ['x', 'y'];
+        var baseAxisDimIndex = option.layout === 'horizontal' ? 0 : 1;
+        var baseAxisDim = this._baseAxisDim = coordDims[baseAxisDimIndex];
+        var otherAxisDim = coordDims[1 - baseAxisDimIndex];
+        var axisModels = [xAxisModel, yAxisModel];
+        var baseAxisType = axisModels[baseAxisDimIndex].get('type');
+        var otherAxisType = axisModels[1 - baseAxisDimIndex].get('type');
+        var data = option.data;
+
+        // ??? FIXME make a stage to perform data transfrom.
+        // MUST create a new data, consider setOption({}) again.
+        if (data && addOrdinal) {
+            var newOptionData = [];
+            each$1(data, function (item, index) {
+                var newItem;
+                if (item.value && isArray(item.value)) {
+                    newItem = item.value.slice();
+                    item.value.unshift(index);
+                }
+                else if (isArray(item)) {
+                    newItem = item.slice();
+                    item.unshift(index);
+                }
+                else {
+                    newItem = item;
+                }
+                newOptionData.push(newItem);
+            });
+            option.data = newOptionData;
+        }
+
+        var defaultValueDimensions = this.defaultValueDimensions;
+
+        return createListSimply(
+            this,
+            {
+                coordDimensions: [{
+                    name: baseAxisDim,
+                    type: getDimensionTypeByAxis(baseAxisType),
+                    ordinalMeta: ordinalMeta,
+                    otherDims: {
+                        tooltip: false,
+                        itemName: 0
+                    },
+                    dimsDef: ['base']
+                }, {
+                    name: otherAxisDim,
+                    type: getDimensionTypeByAxis(otherAxisType),
+                    dimsDef: defaultValueDimensions.slice()
+                }],
+                dimensionsCount: defaultValueDimensions.length + 1
+            }
+        );
+    },
+
+    /**
+     * If horizontal, base axis is x, otherwise y.
+     * @override
+     */
+    getBaseAxis: function () {
+        var dim = this._baseAxisDim;
+        return this.ecModel.getComponent(dim + 'Axis', this.get(dim + 'AxisIndex')).axis;
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BoxplotSeries = SeriesModel.extend({
+
+    type: 'series.boxplot',
+
+    dependencies: ['xAxis', 'yAxis', 'grid'],
+
+    // TODO
+    // box width represents group size, so dimension should have 'size'.
+
+    /**
+     * @see <https://en.wikipedia.org/wiki/Box_plot>
+     * The meanings of 'min' and 'max' depend on user,
+     * and echarts do not need to know it.
+     * @readOnly
+     */
+    defaultValueDimensions: [
+        {name: 'min', defaultTooltip: true},
+        {name: 'Q1', defaultTooltip: true},
+        {name: 'median', defaultTooltip: true},
+        {name: 'Q3', defaultTooltip: true},
+        {name: 'max', defaultTooltip: true}
+    ],
+
+    /**
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: null,
+
+    /**
+     * @override
+     */
+    defaultOption: {
+        zlevel: 0,                  // 一级层叠
+        z: 2,                       // 二级层叠
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        layout: null,               // 'horizontal' or 'vertical'
+        boxWidth: [7, 50],       // [min, max] can be percent of band width.
+
+        itemStyle: {
+            color: '#fff',
+            borderWidth: 1
+        },
+
+        emphasis: {
+            itemStyle: {
+                borderWidth: 2,
+                shadowBlur: 5,
+                shadowOffsetX: 2,
+                shadowOffsetY: 2,
+                shadowColor: 'rgba(0,0,0,0.4)'
+            }
+        },
+
+        animationEasing: 'elasticOut',
+        animationDuration: 800
+    }
+});
+
+mixin(BoxplotSeries, seriesModelMixin, true);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Update common properties
+var NORMAL_ITEM_STYLE_PATH = ['itemStyle'];
+var EMPHASIS_ITEM_STYLE_PATH = ['emphasis', 'itemStyle'];
+
+var BoxplotView = Chart.extend({
+
+    type: 'boxplot',
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var group = this.group;
+        var oldData = this._data;
+
+        // There is no old data only when first rendering or switching from
+        // stream mode to normal mode, where previous elements should be removed.
+        if (!this._data) {
+            group.removeAll();
+        }
+
+        var constDim = seriesModel.get('layout') === 'horizontal' ? 1 : 0;
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                if (data.hasValue(newIdx)) {
+                    var itemLayout = data.getItemLayout(newIdx);
+                    var symbolEl = createNormalBox(itemLayout, data, newIdx, constDim, true);
+                    data.setItemGraphicEl(newIdx, symbolEl);
+                    group.add(symbolEl);
+                }
+            })
+            .update(function (newIdx, oldIdx) {
+                var symbolEl = oldData.getItemGraphicEl(oldIdx);
+
+                // Empty data
+                if (!data.hasValue(newIdx)) {
+                    group.remove(symbolEl);
+                    return;
+                }
+
+                var itemLayout = data.getItemLayout(newIdx);
+                if (!symbolEl) {
+                    symbolEl = createNormalBox(itemLayout, data, newIdx, constDim);
+                }
+                else {
+                    updateNormalBoxData(itemLayout, symbolEl, data, newIdx);
+                }
+
+                group.add(symbolEl);
+
+                data.setItemGraphicEl(newIdx, symbolEl);
+            })
+            .remove(function (oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                el && group.remove(el);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    remove: function (ecModel) {
+        var group = this.group;
+        var data = this._data;
+        this._data = null;
+        data && data.eachItemGraphicEl(function (el) {
+            el && group.remove(el);
+        });
+    },
+
+    dispose: noop
+
+});
+
+
+var BoxPath = Path.extend({
+
+    type: 'boxplotBoxPath',
+
+    shape: {},
+
+    buildPath: function (ctx, shape) {
+        var ends = shape.points;
+
+        var i = 0;
+        ctx.moveTo(ends[i][0], ends[i][1]);
+        i++;
+        for (; i < 4; i++) {
+            ctx.lineTo(ends[i][0], ends[i][1]);
+        }
+        ctx.closePath();
+
+        for (; i < ends.length; i++) {
+            ctx.moveTo(ends[i][0], ends[i][1]);
+            i++;
+            ctx.lineTo(ends[i][0], ends[i][1]);
+        }
+    }
+});
+
+
+function createNormalBox(itemLayout, data, dataIndex, constDim, isInit) {
+    var ends = itemLayout.ends;
+
+    var el = new BoxPath({
+        shape: {
+            points: isInit
+                ? transInit(ends, constDim, itemLayout)
+                : ends
+        }
+    });
+
+    updateNormalBoxData(itemLayout, el, data, dataIndex, isInit);
+
+    return el;
+}
+
+function updateNormalBoxData(itemLayout, el, data, dataIndex, isInit) {
+    var seriesModel = data.hostModel;
+    var updateMethod = graphic[isInit ? 'initProps' : 'updateProps'];
+
+    updateMethod(
+        el,
+        {shape: {points: itemLayout.ends}},
+        seriesModel,
+        dataIndex
+    );
+
+    var itemModel = data.getItemModel(dataIndex);
+    var normalItemStyleModel = itemModel.getModel(NORMAL_ITEM_STYLE_PATH);
+    var borderColor = data.getItemVisual(dataIndex, 'color');
+
+    // Exclude borderColor.
+    var itemStyle = normalItemStyleModel.getItemStyle(['borderColor']);
+    itemStyle.stroke = borderColor;
+    itemStyle.strokeNoScale = true;
+    el.useStyle(itemStyle);
+
+    el.z2 = 100;
+
+    var hoverStyle = itemModel.getModel(EMPHASIS_ITEM_STYLE_PATH).getItemStyle();
+    setHoverStyle(el, hoverStyle);
+}
+
+function transInit(points, dim, itemLayout) {
+    return map(points, function (point) {
+        point = point.slice();
+        point[dim] = itemLayout.initBaseline;
+        return point;
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var borderColorQuery = ['itemStyle', 'borderColor'];
+
+var boxplotVisual = function (ecModel, api) {
+
+    var globalColors = ecModel.get('color');
+
+    ecModel.eachRawSeriesByType('boxplot', function (seriesModel) {
+
+        var defaulColor = globalColors[seriesModel.seriesIndex % globalColors.length];
+        var data = seriesModel.getData();
+
+        data.setVisual({
+            legendSymbol: 'roundRect',
+            // Use name 'color' but not 'borderColor' for legend usage and
+            // visual coding from other component like dataRange.
+            color: seriesModel.get(borderColorQuery) || defaulColor
+        });
+
+        // Only visible series has each data be visual encoded
+        if (!ecModel.isSeriesFiltered(seriesModel)) {
+            data.each(function (idx) {
+                var itemModel = data.getItemModel(idx);
+                data.setItemVisual(
+                    idx,
+                    {color: itemModel.get(borderColorQuery, true)}
+                );
+            });
+        }
+    });
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$13 = each$1;
+
+var boxplotLayout = function (ecModel) {
+
+    var groupResult = groupSeriesByAxis(ecModel);
+
+    each$13(groupResult, function (groupItem) {
+        var seriesModels = groupItem.seriesModels;
+
+        if (!seriesModels.length) {
+            return;
+        }
+
+        calculateBase(groupItem);
+
+        each$13(seriesModels, function (seriesModel, idx) {
+            layoutSingleSeries(
+                seriesModel,
+                groupItem.boxOffsetList[idx],
+                groupItem.boxWidthList[idx]
+            );
+        });
+    });
+};
+
+/**
+ * Group series by axis.
+ */
+function groupSeriesByAxis(ecModel) {
+    var result = [];
+    var axisList = [];
+
+    ecModel.eachSeriesByType('boxplot', function (seriesModel) {
+        var baseAxis = seriesModel.getBaseAxis();
+        var idx = indexOf(axisList, baseAxis);
+
+        if (idx < 0) {
+            idx = axisList.length;
+            axisList[idx] = baseAxis;
+            result[idx] = {axis: baseAxis, seriesModels: []};
+        }
+
+        result[idx].seriesModels.push(seriesModel);
+    });
+
+    return result;
+}
+
+/**
+ * Calculate offset and box width for each series.
+ */
+function calculateBase(groupItem) {
+    var extent;
+    var baseAxis = groupItem.axis;
+    var seriesModels = groupItem.seriesModels;
+    var seriesCount = seriesModels.length;
+
+    var boxWidthList = groupItem.boxWidthList = [];
+    var boxOffsetList = groupItem.boxOffsetList = [];
+    var boundList = [];
+
+    var bandWidth;
+    if (baseAxis.type === 'category') {
+        bandWidth = baseAxis.getBandWidth();
+    }
+    else {
+        var maxDataCount = 0;
+        each$13(seriesModels, function (seriesModel) {
+            maxDataCount = Math.max(maxDataCount, seriesModel.getData().count());
+        });
+        extent = baseAxis.getExtent(),
+        Math.abs(extent[1] - extent[0]) / maxDataCount;
+    }
+
+    each$13(seriesModels, function (seriesModel) {
+        var boxWidthBound = seriesModel.get('boxWidth');
+        if (!isArray(boxWidthBound)) {
+            boxWidthBound = [boxWidthBound, boxWidthBound];
+        }
+        boundList.push([
+            parsePercent$1(boxWidthBound[0], bandWidth) || 0,
+            parsePercent$1(boxWidthBound[1], bandWidth) || 0
+        ]);
+    });
+
+    var availableWidth = bandWidth * 0.8 - 2;
+    var boxGap = availableWidth / seriesCount * 0.3;
+    var boxWidth = (availableWidth - boxGap * (seriesCount - 1)) / seriesCount;
+    var base = boxWidth / 2 - availableWidth / 2;
+
+    each$13(seriesModels, function (seriesModel, idx) {
+        boxOffsetList.push(base);
+        base += boxGap + boxWidth;
+
+        boxWidthList.push(
+            Math.min(Math.max(boxWidth, boundList[idx][0]), boundList[idx][1])
+        );
+    });
+}
+
+/**
+ * Calculate points location for each series.
+ */
+function layoutSingleSeries(seriesModel, offset, boxWidth) {
+    var coordSys = seriesModel.coordinateSystem;
+    var data = seriesModel.getData();
+    var halfWidth = boxWidth / 2;
+    var cDimIdx = seriesModel.get('layout') === 'horizontal' ? 0 : 1;
+    var vDimIdx = 1 - cDimIdx;
+    var coordDims = ['x', 'y'];
+    var cDim = data.mapDimension(coordDims[cDimIdx]);
+    var vDims = data.mapDimension(coordDims[vDimIdx], true);
+
+    if (cDim == null || vDims.length < 5) {
+        return;
+    }
+
+    for (var dataIndex = 0; dataIndex < data.count(); dataIndex++) {
+        var axisDimVal = data.get(cDim, dataIndex);
+
+        var median = getPoint(axisDimVal, vDims[2], dataIndex);
+        var end1 = getPoint(axisDimVal, vDims[0], dataIndex);
+        var end2 = getPoint(axisDimVal, vDims[1], dataIndex);
+        var end4 = getPoint(axisDimVal, vDims[3], dataIndex);
+        var end5 = getPoint(axisDimVal, vDims[4], dataIndex);
+
+        var ends = [];
+        addBodyEnd(ends, end2, 0);
+        addBodyEnd(ends, end4, 1);
+
+        ends.push(end1, end2, end5, end4);
+        layEndLine(ends, end1);
+        layEndLine(ends, end5);
+        layEndLine(ends, median);
+
+        data.setItemLayout(dataIndex, {
+            initBaseline: median[vDimIdx],
+            ends: ends
+        });
+    }
+
+    function getPoint(axisDimVal, dimIdx, dataIndex) {
+        var val = data.get(dimIdx, dataIndex);
+        var p = [];
+        p[cDimIdx] = axisDimVal;
+        p[vDimIdx] = val;
+        var point;
+        if (isNaN(axisDimVal) || isNaN(val)) {
+            point = [NaN, NaN];
+        }
+        else {
+            point = coordSys.dataToPoint(p);
+            point[cDimIdx] += offset;
+        }
+        return point;
+    }
+
+    function addBodyEnd(ends, point, start) {
+        var point1 = point.slice();
+        var point2 = point.slice();
+        point1[cDimIdx] += halfWidth;
+        point2[cDimIdx] -= halfWidth;
+        start
+            ? ends.push(point1, point2)
+            : ends.push(point2, point1);
+    }
+
+    function layEndLine(ends, endCenter) {
+        var from = endCenter.slice();
+        var to = endCenter.slice();
+        from[cDimIdx] -= halfWidth;
+        to[cDimIdx] += halfWidth;
+        ends.push(from, to);
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(boxplotVisual);
+registerLayout(boxplotLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CandlestickSeries = SeriesModel.extend({
+
+    type: 'series.candlestick',
+
+    dependencies: ['xAxis', 'yAxis', 'grid'],
+
+    /**
+     * @readOnly
+     */
+    defaultValueDimensions: [
+        {name: 'open', defaultTooltip: true},
+        {name: 'close', defaultTooltip: true},
+        {name: 'lowest', defaultTooltip: true},
+        {name: 'highest', defaultTooltip: true}
+    ],
+
+    /**
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    dimensions: null,
+
+    /**
+     * @override
+     */
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        coordinateSystem: 'cartesian2d',
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        layout: null, // 'horizontal' or 'vertical'
+
+        itemStyle: {
+            color: '#c23531', // 阳线 positive
+            color0: '#314656', // 阴线 negative     '#c23531', '#314656'
+            borderWidth: 1,
+            // FIXME
+            // ec2中使用的是lineStyle.color 和 lineStyle.color0
+            borderColor: '#c23531',
+            borderColor0: '#314656'
+        },
+
+        emphasis: {
+            itemStyle: {
+                borderWidth: 2
+            }
+        },
+
+        barMaxWidth: null,
+        barMinWidth: null,
+        barWidth: null,
+
+        large: true,
+        largeThreshold: 600,
+
+        progressive: 3e3,
+        progressiveThreshold: 1e4,
+        progressiveChunkMode: 'mod',
+
+        animationUpdate: false,
+        animationEasing: 'linear',
+        animationDuration: 300
+    },
+
+    /**
+     * Get dimension for shadow in dataZoom
+     * @return {string} dimension name
+     */
+    getShadowDim: function () {
+        return 'open';
+    },
+
+    brushSelector: function (dataIndex, data, selectors) {
+        var itemLayout = data.getItemLayout(dataIndex);
+        return itemLayout && selectors.rect(itemLayout.brushRect);
+    }
+
+});
+
+mixin(CandlestickSeries, seriesModelMixin, true);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var NORMAL_ITEM_STYLE_PATH$1 = ['itemStyle'];
+var EMPHASIS_ITEM_STYLE_PATH$1 = ['emphasis', 'itemStyle'];
+var SKIP_PROPS = ['color', 'color0', 'borderColor', 'borderColor0'];
+
+
+var CandlestickView = Chart.extend({
+
+    type: 'candlestick',
+
+    render: function (seriesModel, ecModel, api) {
+        this._updateDrawMode(seriesModel);
+
+        this._isLargeDraw
+            ? this._renderLarge(seriesModel)
+            : this._renderNormal(seriesModel);
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this._clear();
+        this._updateDrawMode(seriesModel);
+    },
+
+    incrementalRender: function (params, seriesModel, ecModel, api) {
+        this._isLargeDraw
+             ? this._incrementalRenderLarge(params, seriesModel)
+             : this._incrementalRenderNormal(params, seriesModel);
+    },
+
+    _updateDrawMode: function (seriesModel) {
+        var isLargeDraw = seriesModel.pipelineContext.large;
+        if (this._isLargeDraw == null || isLargeDraw ^ this._isLargeDraw) {
+            this._isLargeDraw = isLargeDraw;
+            this._clear();
+        }
+    },
+
+    _renderNormal: function (seriesModel) {
+        var data = seriesModel.getData();
+        var oldData = this._data;
+        var group = this.group;
+        var isSimpleBox = data.getLayout('isSimpleBox');
+
+        // There is no old data only when first rendering or switching from
+        // stream mode to normal mode, where previous elements should be removed.
+        if (!this._data) {
+            group.removeAll();
+        }
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                if (data.hasValue(newIdx)) {
+                    var el;
+
+                    var itemLayout = data.getItemLayout(newIdx);
+                    el = createNormalBox$1(itemLayout, newIdx, true);
+                    initProps(el, {shape: {points: itemLayout.ends}}, seriesModel, newIdx);
+
+                    setBoxCommon(el, data, newIdx, isSimpleBox);
+
+                    group.add(el);
+                    data.setItemGraphicEl(newIdx, el);
+                }
+            })
+            .update(function (newIdx, oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+
+                // Empty data
+                if (!data.hasValue(newIdx)) {
+                    group.remove(el);
+                    return;
+                }
+
+                var itemLayout = data.getItemLayout(newIdx);
+                if (!el) {
+                    el = createNormalBox$1(itemLayout, newIdx);
+                }
+                else {
+                    updateProps(el, {shape: {points: itemLayout.ends}}, seriesModel, newIdx);
+                }
+
+                setBoxCommon(el, data, newIdx, isSimpleBox);
+
+                group.add(el);
+                data.setItemGraphicEl(newIdx, el);
+            })
+            .remove(function (oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                el && group.remove(el);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    _renderLarge: function (seriesModel) {
+        this._clear();
+        createLarge$1(seriesModel, this.group);
+    },
+
+    _incrementalRenderNormal: function (params, seriesModel) {
+        var data = seriesModel.getData();
+        var isSimpleBox = data.getLayout('isSimpleBox');
+
+        var dataIndex;
+        while ((dataIndex = params.next()) != null) {
+            var el;
+
+            var itemLayout = data.getItemLayout(dataIndex);
+            el = createNormalBox$1(itemLayout, dataIndex);
+            setBoxCommon(el, data, dataIndex, isSimpleBox);
+
+            el.incremental = true;
+            this.group.add(el);
+        }
+    },
+
+    _incrementalRenderLarge: function (params, seriesModel) {
+        createLarge$1(seriesModel, this.group, true);
+    },
+
+    remove: function (ecModel) {
+        this._clear();
+    },
+
+    _clear: function () {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    dispose: noop
+
+});
+
+
+var NormalBoxPath = Path.extend({
+
+    type: 'normalCandlestickBox',
+
+    shape: {},
+
+    buildPath: function (ctx, shape) {
+        var ends = shape.points;
+
+        if (this.__simpleBox) {
+            ctx.moveTo(ends[4][0], ends[4][1]);
+            ctx.lineTo(ends[6][0], ends[6][1]);
+        }
+        else {
+            ctx.moveTo(ends[0][0], ends[0][1]);
+            ctx.lineTo(ends[1][0], ends[1][1]);
+            ctx.lineTo(ends[2][0], ends[2][1]);
+            ctx.lineTo(ends[3][0], ends[3][1]);
+            ctx.closePath();
+
+            ctx.moveTo(ends[4][0], ends[4][1]);
+            ctx.lineTo(ends[5][0], ends[5][1]);
+            ctx.moveTo(ends[6][0], ends[6][1]);
+            ctx.lineTo(ends[7][0], ends[7][1]);
+        }
+    }
+});
+
+function createNormalBox$1(itemLayout, dataIndex, isInit) {
+    var ends = itemLayout.ends;
+    return new NormalBoxPath({
+        shape: {
+            points: isInit
+                ? transInit$1(ends, itemLayout)
+                : ends
+        },
+        z2: 100
+    });
+}
+
+function setBoxCommon(el, data, dataIndex, isSimpleBox) {
+    var itemModel = data.getItemModel(dataIndex);
+    var normalItemStyleModel = itemModel.getModel(NORMAL_ITEM_STYLE_PATH$1);
+    var color = data.getItemVisual(dataIndex, 'color');
+    var borderColor = data.getItemVisual(dataIndex, 'borderColor') || color;
+
+    // Color must be excluded.
+    // Because symbol provide setColor individually to set fill and stroke
+    var itemStyle = normalItemStyleModel.getItemStyle(SKIP_PROPS);
+
+    el.useStyle(itemStyle);
+    el.style.strokeNoScale = true;
+    el.style.fill = color;
+    el.style.stroke = borderColor;
+
+    el.__simpleBox = isSimpleBox;
+
+    var hoverStyle = itemModel.getModel(EMPHASIS_ITEM_STYLE_PATH$1).getItemStyle();
+    setHoverStyle(el, hoverStyle);
+}
+
+function transInit$1(points, itemLayout) {
+    return map(points, function (point) {
+        point = point.slice();
+        point[1] = itemLayout.initBaseline;
+        return point;
+    });
+}
+
+
+
+var LargeBoxPath = Path.extend({
+
+    type: 'largeCandlestickBox',
+
+    shape: {},
+
+    buildPath: function (ctx, shape) {
+        // Drawing lines is more efficient than drawing
+        // a whole line or drawing rects.
+        var points = shape.points;
+        for (var i = 0; i < points.length;) {
+            if (this.__sign === points[i++]) {
+                var x = points[i++];
+                ctx.moveTo(x, points[i++]);
+                ctx.lineTo(x, points[i++]);
+            }
+            else {
+                i += 3;
+            }
+        }
+    }
+});
+
+function createLarge$1(seriesModel, group, incremental) {
+    var data = seriesModel.getData();
+    var largePoints = data.getLayout('largePoints');
+
+    var elP = new LargeBoxPath({
+        shape: {points: largePoints},
+        __sign: 1
+    });
+    group.add(elP);
+    var elN = new LargeBoxPath({
+        shape: {points: largePoints},
+        __sign: -1
+    });
+    group.add(elN);
+
+    setLargeStyle$1(1, elP, seriesModel, data);
+    setLargeStyle$1(-1, elN, seriesModel, data);
+
+    if (incremental) {
+        elP.incremental = true;
+        elN.incremental = true;
+    }
+}
+
+function setLargeStyle$1(sign, el, seriesModel, data) {
+    var suffix = sign > 0 ? 'P' : 'N';
+    var borderColor = data.getVisual('borderColor' + suffix)
+        || data.getVisual('color' + suffix);
+
+    // Color must be excluded.
+    // Because symbol provide setColor individually to set fill and stroke
+    var itemStyle = seriesModel.getModel(NORMAL_ITEM_STYLE_PATH$1).getItemStyle(SKIP_PROPS);
+
+    el.useStyle(itemStyle);
+    el.style.fill = null;
+    el.style.stroke = borderColor;
+    // No different
+    // el.style.lineWidth = .5;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var preprocessor = function (option) {
+    if (!option || !isArray(option.series)) {
+        return;
+    }
+
+    // Translate 'k' to 'candlestick'.
+    each$1(option.series, function (seriesItem) {
+        if (isObject$1(seriesItem) && seriesItem.type === 'k') {
+            seriesItem.type = 'candlestick';
+        }
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var positiveBorderColorQuery = ['itemStyle', 'borderColor'];
+var negativeBorderColorQuery = ['itemStyle', 'borderColor0'];
+var positiveColorQuery = ['itemStyle', 'color'];
+var negativeColorQuery = ['itemStyle', 'color0'];
+
+var candlestickVisual = {
+
+    seriesType: 'candlestick',
+
+    plan: createRenderPlanner(),
+
+    // For legend.
+    performRawSeries: true,
+
+    reset: function (seriesModel, ecModel) {
+
+        var data = seriesModel.getData();
+        var isLargeRender = seriesModel.pipelineContext.large;
+
+        data.setVisual({
+            legendSymbol: 'roundRect',
+            colorP: getColor(1, seriesModel),
+            colorN: getColor(-1, seriesModel),
+            borderColorP: getBorderColor(1, seriesModel),
+            borderColorN: getBorderColor(-1, seriesModel)
+        });
+
+        // Only visible series has each data be visual encoded
+        if (ecModel.isSeriesFiltered(seriesModel)) {
+            return;
+        }
+
+        return !isLargeRender && {progress: progress};
+
+
+        function progress(params, data) {
+            var dataIndex;
+            while ((dataIndex = params.next()) != null) {
+                var itemModel = data.getItemModel(dataIndex);
+                var sign = data.getItemLayout(dataIndex).sign;
+
+                data.setItemVisual(
+                    dataIndex,
+                    {
+                        color: getColor(sign, itemModel),
+                        borderColor: getBorderColor(sign, itemModel)
+                    }
+                );
+            }
+        }
+
+        function getColor(sign, model) {
+            return model.get(
+                sign > 0 ? positiveColorQuery : negativeColorQuery
+            );
+        }
+
+        function getBorderColor(sign, model) {
+            return model.get(
+                sign > 0 ? positiveBorderColorQuery : negativeBorderColorQuery
+            );
+        }
+
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var LargeArr$1 = typeof Float32Array !== 'undefined' ? Float32Array : Array;
+
+var candlestickLayout = {
+
+    seriesType: 'candlestick',
+
+    plan: createRenderPlanner(),
+
+    reset: function (seriesModel) {
+
+        var coordSys = seriesModel.coordinateSystem;
+        var data = seriesModel.getData();
+        var candleWidth = calculateCandleWidth(seriesModel, data);
+        var cDimIdx = 0;
+        var vDimIdx = 1;
+        var coordDims = ['x', 'y'];
+        var cDim = data.mapDimension(coordDims[cDimIdx]);
+        var vDims = data.mapDimension(coordDims[vDimIdx], true);
+        var openDim = vDims[0];
+        var closeDim = vDims[1];
+        var lowestDim = vDims[2];
+        var highestDim = vDims[3];
+
+        data.setLayout({
+            candleWidth: candleWidth,
+            // The value is experimented visually.
+            isSimpleBox: candleWidth <= 1.3
+        });
+
+        if (cDim == null || vDims.length < 4) {
+            return;
+        }
+
+        return {
+            progress: seriesModel.pipelineContext.large
+                ? largeProgress : normalProgress
+        };
+
+        function normalProgress(params, data) {
+            var dataIndex;
+            while ((dataIndex = params.next()) != null) {
+
+                var axisDimVal = data.get(cDim, dataIndex);
+                var openVal = data.get(openDim, dataIndex);
+                var closeVal = data.get(closeDim, dataIndex);
+                var lowestVal = data.get(lowestDim, dataIndex);
+                var highestVal = data.get(highestDim, dataIndex);
+
+                var ocLow = Math.min(openVal, closeVal);
+                var ocHigh = Math.max(openVal, closeVal);
+
+                var ocLowPoint = getPoint(ocLow, axisDimVal);
+                var ocHighPoint = getPoint(ocHigh, axisDimVal);
+                var lowestPoint = getPoint(lowestVal, axisDimVal);
+                var highestPoint = getPoint(highestVal, axisDimVal);
+
+                var ends = [];
+                addBodyEnd(ends, ocHighPoint, 0);
+                addBodyEnd(ends, ocLowPoint, 1);
+
+                ends.push(
+                    subPixelOptimizePoint(highestPoint),
+                    subPixelOptimizePoint(ocHighPoint),
+                    subPixelOptimizePoint(lowestPoint),
+                    subPixelOptimizePoint(ocLowPoint)
+                );
+
+                data.setItemLayout(dataIndex, {
+                    sign: getSign(data, dataIndex, openVal, closeVal, closeDim),
+                    initBaseline: openVal > closeVal
+                        ? ocHighPoint[vDimIdx] : ocLowPoint[vDimIdx], // open point.
+                    ends: ends,
+                    brushRect: makeBrushRect(lowestVal, highestVal, axisDimVal)
+                });
+            }
+
+            function getPoint(val, axisDimVal) {
+                var p = [];
+                p[cDimIdx] = axisDimVal;
+                p[vDimIdx] = val;
+                return (isNaN(axisDimVal) || isNaN(val))
+                    ? [NaN, NaN]
+                    : coordSys.dataToPoint(p);
+            }
+
+            function addBodyEnd(ends, point, start) {
+                var point1 = point.slice();
+                var point2 = point.slice();
+
+                point1[cDimIdx] = subPixelOptimize(
+                    point1[cDimIdx] + candleWidth / 2, 1, false
+                );
+                point2[cDimIdx] = subPixelOptimize(
+                    point2[cDimIdx] - candleWidth / 2, 1, true
+                );
+
+                start
+                    ? ends.push(point1, point2)
+                    : ends.push(point2, point1);
+            }
+
+            function makeBrushRect(lowestVal, highestVal, axisDimVal) {
+                var pmin = getPoint(lowestVal, axisDimVal);
+                var pmax = getPoint(highestVal, axisDimVal);
+
+                pmin[cDimIdx] -= candleWidth / 2;
+                pmax[cDimIdx] -= candleWidth / 2;
+
+                return {
+                    x: pmin[0],
+                    y: pmin[1],
+                    width: vDimIdx ? candleWidth : pmax[0] - pmin[0],
+                    height: vDimIdx ? pmax[1] - pmin[1] : candleWidth
+                };
+            }
+
+            function subPixelOptimizePoint(point) {
+                point[cDimIdx] = subPixelOptimize(point[cDimIdx], 1);
+                return point;
+            }
+        }
+
+        function largeProgress(params, data) {
+            // Structure: [sign, x, yhigh, ylow, sign, x, yhigh, ylow, ...]
+            var points = new LargeArr$1(params.count * 5);
+            var offset = 0;
+            var point;
+            var tmpIn = [];
+            var tmpOut = [];
+            var dataIndex;
+
+            while ((dataIndex = params.next()) != null) {
+                var axisDimVal = data.get(cDim, dataIndex);
+                var openVal = data.get(openDim, dataIndex);
+                var closeVal = data.get(closeDim, dataIndex);
+                var lowestVal = data.get(lowestDim, dataIndex);
+                var highestVal = data.get(highestDim, dataIndex);
+
+                if (isNaN(axisDimVal) || isNaN(lowestVal) || isNaN(highestVal)) {
+                    points[offset++] = NaN;
+                    offset += 4;
+                    continue;
+                }
+
+                points[offset++] = getSign(data, dataIndex, openVal, closeVal, closeDim);
+
+                tmpIn[cDimIdx] = axisDimVal;
+
+                tmpIn[vDimIdx] = lowestVal;
+                point = coordSys.dataToPoint(tmpIn, null, tmpOut);
+                points[offset++] = point ? point[0] : NaN;
+                points[offset++] = point ? point[1] : NaN;
+                tmpIn[vDimIdx] = highestVal;
+                point = coordSys.dataToPoint(tmpIn, null, tmpOut);
+                points[offset++] = point ? point[1] : NaN;
+            }
+
+            data.setLayout('largePoints', points);
+        }
+    }
+};
+
+function getSign(data, dataIndex, openVal, closeVal, closeDim) {
+    var sign;
+    if (openVal > closeVal) {
+        sign = -1;
+    }
+    else if (openVal < closeVal) {
+        sign = 1;
+    }
+    else {
+        sign = dataIndex > 0
+            // If close === open, compare with close of last record
+            ? (data.get(closeDim, dataIndex - 1) <= closeVal ? 1 : -1)
+            // No record of previous, set to be positive
+            : 1;
+    }
+
+    return sign;
+}
+
+function calculateCandleWidth(seriesModel, data) {
+    var baseAxis = seriesModel.getBaseAxis();
+    var extent;
+
+    var bandWidth = baseAxis.type === 'category'
+        ? baseAxis.getBandWidth()
+        : (
+            extent = baseAxis.getExtent(),
+            Math.abs(extent[1] - extent[0]) / data.count()
+        );
+
+    var barMaxWidth = parsePercent$1(
+        retrieve2(seriesModel.get('barMaxWidth'), bandWidth),
+        bandWidth
+    );
+    var barMinWidth = parsePercent$1(
+        retrieve2(seriesModel.get('barMinWidth'), 1),
+        bandWidth
+    );
+    var barWidth = seriesModel.get('barWidth');
+
+    return barWidth != null
+        ? parsePercent$1(barWidth, bandWidth)
+        // Put max outer to ensure bar visible in spite of overlap.
+        : Math.max(Math.min(bandWidth / 2, barMaxWidth), barMinWidth);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerPreprocessor(preprocessor);
+registerVisual(candlestickVisual);
+registerLayout(candlestickLayout);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.effectScatter',
+
+    dependencies: ['grid', 'polar'],
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    },
+
+    brushSelector: 'point',
+
+    defaultOption: {
+        coordinateSystem: 'cartesian2d',
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        effectType: 'ripple',
+
+        progressive: 0,
+
+        // When to show the effect, option: 'render'|'emphasis'
+        showEffectOn: 'render',
+
+        // Ripple effect config
+        rippleEffect: {
+            period: 4,
+            // Scale of ripple
+            scale: 2.5,
+            // Brush type can be fill or stroke
+            brushType: 'fill'
+        },
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Polar coordinate system
+        // polarIndex: 0,
+
+        // Geo coordinate system
+        // geoIndex: 0,
+
+        // symbol: null,        // 图形类型
+        symbolSize: 10          // 图形大小，半宽（半径）参数，当图形为方向或菱形则总宽度为symbolSize * 2
+        // symbolRotate: null,  // 图形旋转控制
+
+        // large: false,
+        // Available when large is true
+        // largeThreshold: 2000,
+
+        // itemStyle: {
+        //     opacity: 1
+        // }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Symbol with ripple effect
+ * @module echarts/chart/helper/EffectSymbol
+ */
+
+var EFFECT_RIPPLE_NUMBER = 3;
+
+function normalizeSymbolSize$1(symbolSize) {
+    if (!isArray(symbolSize)) {
+        symbolSize = [+symbolSize, +symbolSize];
+    }
+    return symbolSize;
+}
+
+function updateRipplePath(rippleGroup, effectCfg) {
+    rippleGroup.eachChild(function (ripplePath) {
+        ripplePath.attr({
+            z: effectCfg.z,
+            zlevel: effectCfg.zlevel,
+            style: {
+                stroke: effectCfg.brushType === 'stroke' ? effectCfg.color : null,
+                fill: effectCfg.brushType === 'fill' ? effectCfg.color : null
+            }
+        });
+    });
+}
+/**
+ * @constructor
+ * @param {module:echarts/data/List} data
+ * @param {number} idx
+ * @extends {module:zrender/graphic/Group}
+ */
+function EffectSymbol(data, idx) {
+    Group.call(this);
+
+    var symbol = new SymbolClz$1(data, idx);
+    var rippleGroup = new Group();
+    this.add(symbol);
+    this.add(rippleGroup);
+
+    rippleGroup.beforeUpdate = function () {
+        this.attr(symbol.getScale());
+    };
+    this.updateData(data, idx);
+}
+
+var effectSymbolProto = EffectSymbol.prototype;
+
+effectSymbolProto.stopEffectAnimation = function () {
+    this.childAt(1).removeAll();
+};
+
+effectSymbolProto.startEffectAnimation = function (effectCfg) {
+    var symbolType = effectCfg.symbolType;
+    var color = effectCfg.color;
+    var rippleGroup = this.childAt(1);
+
+    for (var i = 0; i < EFFECT_RIPPLE_NUMBER; i++) {
+        // var ripplePath = createSymbol(
+        //     symbolType, -0.5, -0.5, 1, 1, color
+        // );
+        // If width/height are set too small (e.g., set to 1) on ios10
+        // and macOS Sierra, a circle stroke become a rect, no matter what
+        // the scale is set. So we set width/height as 2. See #4136.
+        var ripplePath = createSymbol(
+            symbolType, -1, -1, 2, 2, color
+        );
+        ripplePath.attr({
+            style: {
+                strokeNoScale: true
+            },
+            z2: 99,
+            silent: true,
+            scale: [0.5, 0.5]
+        });
+
+        var delay = -i / EFFECT_RIPPLE_NUMBER * effectCfg.period + effectCfg.effectOffset;
+        // TODO Configurable effectCfg.period
+        ripplePath.animate('', true)
+            .when(effectCfg.period, {
+                scale: [effectCfg.rippleScale / 2, effectCfg.rippleScale / 2]
+            })
+            .delay(delay)
+            .start();
+        ripplePath.animateStyle(true)
+            .when(effectCfg.period, {
+                opacity: 0
+            })
+            .delay(delay)
+            .start();
+
+        rippleGroup.add(ripplePath);
+    }
+
+    updateRipplePath(rippleGroup, effectCfg);
+};
+
+/**
+ * Update effect symbol
+ */
+effectSymbolProto.updateEffectAnimation = function (effectCfg) {
+    var oldEffectCfg = this._effectCfg;
+    var rippleGroup = this.childAt(1);
+
+    // Must reinitialize effect if following configuration changed
+    var DIFFICULT_PROPS = ['symbolType', 'period', 'rippleScale'];
+    for (var i = 0; i < DIFFICULT_PROPS.length; i++) {
+        var propName = DIFFICULT_PROPS[i];
+        if (oldEffectCfg[propName] !== effectCfg[propName]) {
+            this.stopEffectAnimation();
+            this.startEffectAnimation(effectCfg);
+            return;
+        }
+    }
+
+    updateRipplePath(rippleGroup, effectCfg);
+};
+
+/**
+ * Highlight symbol
+ */
+effectSymbolProto.highlight = function () {
+    this.trigger('emphasis');
+};
+
+/**
+ * Downplay symbol
+ */
+effectSymbolProto.downplay = function () {
+    this.trigger('normal');
+};
+
+/**
+ * Update symbol properties
+ * @param  {module:echarts/data/List} data
+ * @param  {number} idx
+ */
+effectSymbolProto.updateData = function (data, idx) {
+    var seriesModel = data.hostModel;
+
+    this.childAt(0).updateData(data, idx);
+
+    var rippleGroup = this.childAt(1);
+    var itemModel = data.getItemModel(idx);
+    var symbolType = data.getItemVisual(idx, 'symbol');
+    var symbolSize = normalizeSymbolSize$1(data.getItemVisual(idx, 'symbolSize'));
+    var color = data.getItemVisual(idx, 'color');
+
+    rippleGroup.attr('scale', symbolSize);
+
+    rippleGroup.traverse(function (ripplePath) {
+        ripplePath.attr({
+            fill: color
+        });
+    });
+
+    var symbolOffset = itemModel.getShallow('symbolOffset');
+    if (symbolOffset) {
+        var pos = rippleGroup.position;
+        pos[0] = parsePercent$1(symbolOffset[0], symbolSize[0]);
+        pos[1] = parsePercent$1(symbolOffset[1], symbolSize[1]);
+    }
+    rippleGroup.rotation = (itemModel.getShallow('symbolRotate') || 0) * Math.PI / 180 || 0;
+
+    var effectCfg = {};
+
+    effectCfg.showEffectOn = seriesModel.get('showEffectOn');
+    effectCfg.rippleScale = itemModel.get('rippleEffect.scale');
+    effectCfg.brushType = itemModel.get('rippleEffect.brushType');
+    effectCfg.period = itemModel.get('rippleEffect.period') * 1000;
+    effectCfg.effectOffset = idx / data.count();
+    effectCfg.z = itemModel.getShallow('z') || 0;
+    effectCfg.zlevel = itemModel.getShallow('zlevel') || 0;
+    effectCfg.symbolType = symbolType;
+    effectCfg.color = color;
+
+    this.off('mouseover').off('mouseout').off('emphasis').off('normal');
+
+    if (effectCfg.showEffectOn === 'render') {
+        this._effectCfg
+            ? this.updateEffectAnimation(effectCfg)
+            : this.startEffectAnimation(effectCfg);
+
+        this._effectCfg = effectCfg;
+    }
+    else {
+        // Not keep old effect config
+        this._effectCfg = null;
+
+        this.stopEffectAnimation();
+        var symbol = this.childAt(0);
+        var onEmphasis = function () {
+            symbol.highlight();
+            if (effectCfg.showEffectOn !== 'render') {
+                this.startEffectAnimation(effectCfg);
+            }
+        };
+        var onNormal = function () {
+            symbol.downplay();
+            if (effectCfg.showEffectOn !== 'render') {
+                this.stopEffectAnimation();
+            }
+        };
+        this.on('mouseover', onEmphasis, this)
+            .on('mouseout', onNormal, this)
+            .on('emphasis', onEmphasis, this)
+            .on('normal', onNormal, this);
+    }
+
+    this._effectCfg = effectCfg;
+};
+
+effectSymbolProto.fadeOut = function (cb) {
+    this.off('mouseover').off('mouseout').off('emphasis').off('normal');
+    cb && cb();
+};
+
+inherits(EffectSymbol, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'effectScatter',
+
+    init: function () {
+        this._symbolDraw = new SymbolDraw(EffectSymbol);
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var effectSymbolDraw = this._symbolDraw;
+        effectSymbolDraw.updateData(data);
+        this.group.add(effectSymbolDraw.group);
+    },
+
+    updateTransform: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        this.group.dirty();
+
+        var res = pointsLayout().reset(seriesModel);
+        if (res.progress) {
+            res.progress({ start: 0, end: data.count() }, data);
+        }
+
+        this._symbolDraw.updateLayout(data);
+    },
+
+    _updateGroupTransform: function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys && coordSys.getRoamTransform) {
+            this.group.transform = clone$2(coordSys.getRoamTransform());
+            this.group.decomposeTransform();
+        }
+    },
+
+    remove: function (ecModel, api) {
+        this._symbolDraw && this._symbolDraw.remove(api);
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(visualSymbol('effectScatter', 'circle'));
+registerLayout(pointsLayout('effectScatter'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var Uint32Arr = typeof Uint32Array === 'undefined' ? Array : Uint32Array;
+var Float64Arr = typeof Float64Array === 'undefined' ? Array : Float64Array;
+
+function compatEc2(seriesOpt) {
+    var data = seriesOpt.data;
+    if (data && data[0] && data[0][0] && data[0][0].coord) {
+        if (__DEV__) {
+            console.warn('Lines data configuration has been changed to'
+                + ' { coords:[[1,2],[2,3]] }');
+        }
+        seriesOpt.data = map(data, function (itemOpt) {
+            var coords = [
+                itemOpt[0].coord, itemOpt[1].coord
+            ];
+            var target = {
+                coords: coords
+            };
+            if (itemOpt[0].name) {
+                target.fromName = itemOpt[0].name;
+            }
+            if (itemOpt[1].name) {
+                target.toName = itemOpt[1].name;
+            }
+            return mergeAll([target, itemOpt[0], itemOpt[1]]);
+        });
+    }
+}
+
+var LinesSeries = SeriesModel.extend({
+
+    type: 'series.lines',
+
+    dependencies: ['grid', 'polar'],
+
+    visualColorAccessPath: 'lineStyle.color',
+
+    init: function (option) {
+        // The input data may be null/undefined.
+        option.data = option.data || [];
+
+        // Not using preprocessor because mergeOption may not have series.type
+        compatEc2(option);
+
+        var result = this._processFlatCoordsArray(option.data);
+        this._flatCoords = result.flatCoords;
+        this._flatCoordsOffset = result.flatCoordsOffset;
+        if (result.flatCoords) {
+            option.data = new Float32Array(result.count);
+        }
+
+        LinesSeries.superApply(this, 'init', arguments);
+    },
+
+    mergeOption: function (option) {
+        // The input data may be null/undefined.
+        option.data = option.data || [];
+
+        compatEc2(option);
+
+        if (option.data) {
+            // Only update when have option data to merge.
+            var result = this._processFlatCoordsArray(option.data);
+            this._flatCoords = result.flatCoords;
+            this._flatCoordsOffset = result.flatCoordsOffset;
+            if (result.flatCoords) {
+                option.data = new Float32Array(result.count);
+            }
+        }
+
+        LinesSeries.superApply(this, 'mergeOption', arguments);
+    },
+
+    appendData: function (params) {
+        var result = this._processFlatCoordsArray(params.data);
+        if (result.flatCoords) {
+            if (!this._flatCoords) {
+                this._flatCoords = result.flatCoords;
+                this._flatCoordsOffset = result.flatCoordsOffset;
+            }
+            else {
+                this._flatCoords = concatArray(this._flatCoords, result.flatCoords);
+                this._flatCoordsOffset = concatArray(this._flatCoordsOffset, result.flatCoordsOffset);
+            }
+            params.data = new Float32Array(result.count);
+        }
+
+        this.getRawData().appendData(params.data);
+    },
+
+    _getCoordsFromItemModel: function (idx) {
+        var itemModel = this.getData().getItemModel(idx);
+        var coords = (itemModel.option instanceof Array)
+            ? itemModel.option : itemModel.getShallow('coords');
+
+        if (__DEV__) {
+            if (!(coords instanceof Array && coords.length > 0 && coords[0] instanceof Array)) {
+                throw new Error('Invalid coords ' + JSON.stringify(coords) + '. Lines must have 2d coords array in data item.');
+            }
+        }
+        return coords;
+    },
+
+    getLineCoordsCount: function (idx) {
+        if (this._flatCoordsOffset) {
+            return this._flatCoordsOffset[idx * 2 + 1];
+        }
+        else {
+            return this._getCoordsFromItemModel(idx).length;
+        }
+    },
+
+    getLineCoords: function (idx, out) {
+        if (this._flatCoordsOffset) {
+            var offset = this._flatCoordsOffset[idx * 2];
+            var len = this._flatCoordsOffset[idx * 2 + 1];
+            for (var i = 0; i < len; i++) {
+                out[i] = out[i] || [];
+                out[i][0] = this._flatCoords[offset + i * 2];
+                out[i][1] = this._flatCoords[offset + i * 2 + 1];
+            }
+            return len;
+        }
+        else {
+            var coords = this._getCoordsFromItemModel(idx);
+            for (var i = 0; i < coords.length; i++) {
+                out[i] = out[i] || [];
+                out[i][0] = coords[i][0];
+                out[i][1] = coords[i][1];
+            }
+            return coords.length;
+        }
+    },
+
+    _processFlatCoordsArray: function (data) {
+        var startOffset = 0;
+        if (this._flatCoords) {
+            startOffset = this._flatCoords.length;
+        }
+        // Stored as a typed array. In format
+        // Points Count(2) | x | y | x | y | Points Count(3) | x |  y | x | y | x | y |
+        if (typeof data[0] === 'number') {
+            var len = data.length;
+            // Store offset and len of each segment
+            var coordsOffsetAndLenStorage = new Uint32Arr(len);
+            var coordsStorage = new Float64Arr(len);
+            var coordsCursor = 0;
+            var offsetCursor = 0;
+            var dataCount = 0;
+            for (var i = 0; i < len;) {
+                dataCount++;
+                var count = data[i++];
+                // Offset
+                coordsOffsetAndLenStorage[offsetCursor++] = coordsCursor + startOffset;
+                // Len
+                coordsOffsetAndLenStorage[offsetCursor++] = count;
+                for (var k = 0; k < count; k++) {
+                    var x = data[i++];
+                    var y = data[i++];
+                    coordsStorage[coordsCursor++] = x;
+                    coordsStorage[coordsCursor++] = y;
+
+                    if (i > len) {
+                        if (__DEV__) {
+                            throw new Error('Invalid data format.');
+                        }
+                    }
+                }
+            }
+
+            return {
+                flatCoordsOffset: new Uint32Array(coordsOffsetAndLenStorage.buffer, 0, offsetCursor),
+                flatCoords: coordsStorage,
+                count: dataCount
+            };
+        }
+
+        return {
+            flatCoordsOffset: null,
+            flatCoords: null,
+            count: data.length
+        };
+    },
+
+    getInitialData: function (option, ecModel) {
+        if (__DEV__) {
+            var CoordSys = CoordinateSystemManager.get(option.coordinateSystem);
+            if (!CoordSys) {
+                throw new Error('Unkown coordinate system ' + option.coordinateSystem);
+            }
+        }
+
+        var lineData = new List(['value'], this);
+        lineData.hasItemOption = false;
+
+        lineData.initData(option.data, [], function (dataItem, dimName, dataIndex, dimIndex) {
+            // dataItem is simply coords
+            if (dataItem instanceof Array) {
+                return NaN;
+            }
+            else {
+                lineData.hasItemOption = true;
+                var value = dataItem.value;
+                if (value != null) {
+                    return value instanceof Array ? value[dimIndex] : value;
+                }
+            }
+        });
+
+        return lineData;
+    },
+
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var itemModel = data.getItemModel(dataIndex);
+        var name = itemModel.get('name');
+        if (name) {
+            return name;
+        }
+        var fromName = itemModel.get('fromName');
+        var toName = itemModel.get('toName');
+        var html = [];
+        fromName != null && html.push(fromName);
+        toName != null && html.push(toName);
+
+        return encodeHTML(html.join(' > '));
+    },
+
+    preventIncremental: function () {
+        return !!this.get('effect.show');
+    },
+
+    getProgressive: function () {
+        var progressive = this.option.progressive;
+        if (progressive == null) {
+            return this.option.large ? 1e4 : this.get('progressive');
+        }
+        return progressive;
+    },
+
+    getProgressiveThreshold: function () {
+        var progressiveThreshold = this.option.progressiveThreshold;
+        if (progressiveThreshold == null) {
+            return this.option.large ? 2e4 : this.get('progressiveThreshold');
+        }
+        return progressiveThreshold;
+    },
+
+    defaultOption: {
+        coordinateSystem: 'geo',
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true,
+
+        hoverAnimation: true,
+        // Cartesian coordinate system
+        xAxisIndex: 0,
+        yAxisIndex: 0,
+
+        symbol: ['none', 'none'],
+        symbolSize: [10, 10],
+        // Geo coordinate system
+        geoIndex: 0,
+
+        effect: {
+            show: false,
+            period: 4,
+            // Animation delay. support callback
+            // delay: 0,
+            // If move with constant speed px/sec
+            // period will be ignored if this property is > 0,
+            constantSpeed: 0,
+            symbol: 'circle',
+            symbolSize: 3,
+            loop: true,
+            // Length of trail, 0 - 1
+            trailLength: 0.2
+            // Same with lineStyle.color
+            // color
+        },
+
+        large: false,
+        // Available when large is true
+        largeThreshold: 2000,
+
+        // If lines are polyline
+        // polyline not support curveness, label, animation
+        polyline: false,
+
+        label: {
+            show: false,
+            position: 'end'
+            // distance: 5,
+            // formatter: 标签文本格式器，同Tooltip.formatter，不支持异步回调
+        },
+
+        lineStyle: {
+            opacity: 0.5
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Provide effect for line
+ * @module echarts/chart/helper/EffectLine
+ */
+
+/**
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ * @alias {module:echarts/chart/helper/Line}
+ */
+function EffectLine(lineData, idx, seriesScope) {
+    Group.call(this);
+
+    this.add(this.createLine(lineData, idx, seriesScope));
+
+    this._updateEffectSymbol(lineData, idx);
+}
+
+var effectLineProto = EffectLine.prototype;
+
+effectLineProto.createLine = function (lineData, idx, seriesScope) {
+    return new Line$1(lineData, idx, seriesScope);
+};
+
+effectLineProto._updateEffectSymbol = function (lineData, idx) {
+    var itemModel = lineData.getItemModel(idx);
+    var effectModel = itemModel.getModel('effect');
+    var size = effectModel.get('symbolSize');
+    var symbolType = effectModel.get('symbol');
+    if (!isArray(size)) {
+        size = [size, size];
+    }
+    var color = effectModel.get('color') || lineData.getItemVisual(idx, 'color');
+    var symbol = this.childAt(1);
+
+    if (this._symbolType !== symbolType) {
+        // Remove previous
+        this.remove(symbol);
+
+        symbol = createSymbol(
+            symbolType, -0.5, -0.5, 1, 1, color
+        );
+        symbol.z2 = 100;
+        symbol.culling = true;
+
+        this.add(symbol);
+    }
+
+    // Symbol may be removed if loop is false
+    if (!symbol) {
+        return;
+    }
+
+    // Shadow color is same with color in default
+    symbol.setStyle('shadowColor', color);
+    symbol.setStyle(effectModel.getItemStyle(['color']));
+
+    symbol.attr('scale', size);
+
+    symbol.setColor(color);
+    symbol.attr('scale', size);
+
+    this._symbolType = symbolType;
+
+    this._updateEffectAnimation(lineData, effectModel, idx);
+};
+
+effectLineProto._updateEffectAnimation = function (lineData, effectModel, idx) {
+
+    var symbol = this.childAt(1);
+    if (!symbol) {
+        return;
+    }
+
+    var self = this;
+
+    var points = lineData.getItemLayout(idx);
+
+    var period = effectModel.get('period') * 1000;
+    var loop = effectModel.get('loop');
+    var constantSpeed = effectModel.get('constantSpeed');
+    var delayExpr = retrieve(effectModel.get('delay'), function (idx) {
+        return idx / lineData.count() * period / 3;
+    });
+    var isDelayFunc = typeof delayExpr === 'function';
+
+    // Ignore when updating
+    symbol.ignore = true;
+
+    this.updateAnimationPoints(symbol, points);
+
+    if (constantSpeed > 0) {
+        period = this.getLineLength(symbol) / constantSpeed * 1000;
+    }
+
+    if (period !== this._period || loop !== this._loop) {
+
+        symbol.stopAnimation();
+
+        var delay = delayExpr;
+        if (isDelayFunc) {
+            delay = delayExpr(idx);
+        }
+        if (symbol.__t > 0) {
+            delay = -period * symbol.__t;
+        }
+        symbol.__t = 0;
+        var animator = symbol.animate('', loop)
+            .when(period, {
+                __t: 1
+            })
+            .delay(delay)
+            .during(function () {
+                self.updateSymbolPosition(symbol);
+            });
+        if (!loop) {
+            animator.done(function () {
+                self.remove(symbol);
+            });
+        }
+        animator.start();
+    }
+
+    this._period = period;
+    this._loop = loop;
+};
+
+effectLineProto.getLineLength = function (symbol) {
+    // Not so accurate
+    return (dist(symbol.__p1, symbol.__cp1)
+        + dist(symbol.__cp1, symbol.__p2));
+};
+
+effectLineProto.updateAnimationPoints = function (symbol, points) {
+    symbol.__p1 = points[0];
+    symbol.__p2 = points[1];
+    symbol.__cp1 = points[2] || [
+        (points[0][0] + points[1][0]) / 2,
+        (points[0][1] + points[1][1]) / 2
+    ];
+};
+
+effectLineProto.updateData = function (lineData, idx, seriesScope) {
+    this.childAt(0).updateData(lineData, idx, seriesScope);
+    this._updateEffectSymbol(lineData, idx);
+};
+
+effectLineProto.updateSymbolPosition = function (symbol) {
+    var p1 = symbol.__p1;
+    var p2 = symbol.__p2;
+    var cp1 = symbol.__cp1;
+    var t = symbol.__t;
+    var pos = symbol.position;
+    var quadraticAt$$1 = quadraticAt;
+    var quadraticDerivativeAt$$1 = quadraticDerivativeAt;
+    pos[0] = quadraticAt$$1(p1[0], cp1[0], p2[0], t);
+    pos[1] = quadraticAt$$1(p1[1], cp1[1], p2[1], t);
+
+    // Tangent
+    var tx = quadraticDerivativeAt$$1(p1[0], cp1[0], p2[0], t);
+    var ty = quadraticDerivativeAt$$1(p1[1], cp1[1], p2[1], t);
+
+    symbol.rotation = -Math.atan2(ty, tx) - Math.PI / 2;
+
+    symbol.ignore = false;
+};
+
+
+effectLineProto.updateLayout = function (lineData, idx) {
+    this.childAt(0).updateLayout(lineData, idx);
+
+    var effectModel = lineData.getItemModel(idx).getModel('effect');
+    this._updateEffectAnimation(lineData, effectModel, idx);
+};
+
+inherits(EffectLine, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/chart/helper/Line
+ */
+
+/**
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ * @alias {module:echarts/chart/helper/Polyline}
+ */
+function Polyline$2(lineData, idx, seriesScope) {
+    Group.call(this);
+
+    this._createPolyline(lineData, idx, seriesScope);
+}
+
+var polylineProto = Polyline$2.prototype;
+
+polylineProto._createPolyline = function (lineData, idx, seriesScope) {
+    // var seriesModel = lineData.hostModel;
+    var points = lineData.getItemLayout(idx);
+
+    var line = new Polyline({
+        shape: {
+            points: points
+        }
+    });
+
+    this.add(line);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+polylineProto.updateData = function (lineData, idx, seriesScope) {
+    var seriesModel = lineData.hostModel;
+
+    var line = this.childAt(0);
+    var target = {
+        shape: {
+            points: lineData.getItemLayout(idx)
+        }
+    };
+    updateProps(line, target, seriesModel, idx);
+
+    this._updateCommonStl(lineData, idx, seriesScope);
+};
+
+polylineProto._updateCommonStl = function (lineData, idx, seriesScope) {
+    var line = this.childAt(0);
+    var itemModel = lineData.getItemModel(idx);
+
+    var visualColor = lineData.getItemVisual(idx, 'color');
+
+    var lineStyle = seriesScope && seriesScope.lineStyle;
+    var hoverLineStyle = seriesScope && seriesScope.hoverLineStyle;
+
+    if (!seriesScope || lineData.hasItemOption) {
+        lineStyle = itemModel.getModel('lineStyle').getLineStyle();
+        hoverLineStyle = itemModel.getModel('emphasis.lineStyle').getLineStyle();
+    }
+    line.useStyle(defaults(
+        {
+            strokeNoScale: true,
+            fill: 'none',
+            stroke: visualColor
+        },
+        lineStyle
+    ));
+    line.hoverStyle = hoverLineStyle;
+
+    setHoverStyle(this);
+};
+
+polylineProto.updateLayout = function (lineData, idx) {
+    var polyline = this.childAt(0);
+    polyline.setShape('points', lineData.getItemLayout(idx));
+};
+
+inherits(Polyline$2, Group);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Provide effect for line
+ * @module echarts/chart/helper/EffectLine
+ */
+
+/**
+ * @constructor
+ * @extends {module:echarts/chart/helper/EffectLine}
+ * @alias {module:echarts/chart/helper/Polyline}
+ */
+function EffectPolyline(lineData, idx, seriesScope) {
+    EffectLine.call(this, lineData, idx, seriesScope);
+    this._lastFrame = 0;
+    this._lastFramePercent = 0;
+}
+
+var effectPolylineProto = EffectPolyline.prototype;
+
+// Overwrite
+effectPolylineProto.createLine = function (lineData, idx, seriesScope) {
+    return new Polyline$2(lineData, idx, seriesScope);
+};
+
+// Overwrite
+effectPolylineProto.updateAnimationPoints = function (symbol, points) {
+    this._points = points;
+    var accLenArr = [0];
+    var len$$1 = 0;
+    for (var i = 1; i < points.length; i++) {
+        var p1 = points[i - 1];
+        var p2 = points[i];
+        len$$1 += dist(p1, p2);
+        accLenArr.push(len$$1);
+    }
+    if (len$$1 === 0) {
+        return;
+    }
+
+    for (var i = 0; i < accLenArr.length; i++) {
+        accLenArr[i] /= len$$1;
+    }
+    this._offsets = accLenArr;
+    this._length = len$$1;
+};
+
+// Overwrite
+effectPolylineProto.getLineLength = function (symbol) {
+    return this._length;
+};
+
+// Overwrite
+effectPolylineProto.updateSymbolPosition = function (symbol) {
+    var t = symbol.__t;
+    var points = this._points;
+    var offsets = this._offsets;
+    var len$$1 = points.length;
+
+    if (!offsets) {
+        // Has length 0
+        return;
+    }
+
+    var lastFrame = this._lastFrame;
+    var frame;
+
+    if (t < this._lastFramePercent) {
+        // Start from the next frame
+        // PENDING start from lastFrame ?
+        var start = Math.min(lastFrame + 1, len$$1 - 1);
+        for (frame = start; frame >= 0; frame--) {
+            if (offsets[frame] <= t) {
+                break;
+            }
+        }
+        // PENDING really need to do this ?
+        frame = Math.min(frame, len$$1 - 2);
+    }
+    else {
+        for (var frame = lastFrame; frame < len$$1; frame++) {
+            if (offsets[frame] > t) {
+                break;
+            }
+        }
+        frame = Math.min(frame - 1, len$$1 - 2);
+    }
+
+    lerp(
+        symbol.position, points[frame], points[frame + 1],
+        (t - offsets[frame]) / (offsets[frame + 1] - offsets[frame])
+    );
+
+    var tx = points[frame + 1][0] - points[frame][0];
+    var ty = points[frame + 1][1] - points[frame][1];
+    symbol.rotation = -Math.atan2(ty, tx) - Math.PI / 2;
+
+    this._lastFrame = frame;
+    this._lastFramePercent = t;
+
+    symbol.ignore = false;
+};
+
+inherits(EffectPolyline, EffectLine);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Batch by color
+
+var LargeLineShape = extendShape({
+
+    shape: {
+        polyline: false,
+        curveness: 0,
+        segs: []
+    },
+
+    buildPath: function (path, shape) {
+        var segs = shape.segs;
+        var curveness = shape.curveness;
+
+        if (shape.polyline) {
+            for (var i = 0; i < segs.length;) {
+                var count = segs[i++];
+                if (count > 0) {
+                    path.moveTo(segs[i++], segs[i++]);
+                    for (var k = 1; k < count; k++) {
+                        path.lineTo(segs[i++], segs[i++]);
+                    }
+                }
+            }
+        }
+        else {
+            for (var i = 0; i < segs.length;) {
+                var x0 = segs[i++];
+                var y0 = segs[i++];
+                var x1 = segs[i++];
+                var y1 = segs[i++];
+                path.moveTo(x0, y0);
+                if (curveness > 0) {
+                    var x2 = (x0 + x1) / 2 - (y0 - y1) * curveness;
+                    var y2 = (y0 + y1) / 2 - (x1 - x0) * curveness;
+                    path.quadraticCurveTo(x2, y2, x1, y1);
+                }
+                else {
+                    path.lineTo(x1, y1);
+                }
+            }
+        }
+    },
+
+    findDataIndex: function (x, y) {
+
+        var shape = this.shape;
+        var segs = shape.segs;
+        var curveness = shape.curveness;
+
+        if (shape.polyline) {
+            var dataIndex = 0;
+            for (var i = 0; i < segs.length;) {
+                var count = segs[i++];
+                if (count > 0) {
+                    var x0 = segs[i++];
+                    var y0 = segs[i++];
+                    for (var k = 1; k < count; k++) {
+                        var x1 = segs[i++];
+                        var y1 = segs[i++];
+                        if (containStroke$1(x0, y0, x1, y1)) {
+                            return dataIndex;
+                        }
+                    }
+                }
+
+                dataIndex++;
+            }
+        }
+        else {
+            var dataIndex = 0;
+            for (var i = 0; i < segs.length;) {
+                var x0 = segs[i++];
+                var y0 = segs[i++];
+                var x1 = segs[i++];
+                var y1 = segs[i++];
+                if (curveness > 0) {
+                    var x2 = (x0 + x1) / 2 - (y0 - y1) * curveness;
+                    var y2 = (y0 + y1) / 2 - (x1 - x0) * curveness;
+
+                    if (containStroke$3(x0, y0, x2, y2, x1, y1)) {
+                        return dataIndex;
+                    }
+                }
+                else {
+                    if (containStroke$1(x0, y0, x1, y1)) {
+                        return dataIndex;
+                    }
+                }
+
+                dataIndex++;
+            }
+        }
+
+        return -1;
+    }
+});
+
+function LargeLineDraw() {
+    this.group = new Group();
+}
+
+var largeLineProto = LargeLineDraw.prototype;
+
+largeLineProto.isPersistent = function () {
+    return !this._incremental;
+};
+
+/**
+ * Update symbols draw by new data
+ * @param {module:echarts/data/List} data
+ */
+largeLineProto.updateData = function (data) {
+    this.group.removeAll();
+
+    var lineEl = new LargeLineShape({
+        rectHover: true,
+        cursor: 'default'
+    });
+    lineEl.setShape({
+        segs: data.getLayout('linesPoints')
+    });
+
+    this._setCommon(lineEl, data);
+
+    // Add back
+    this.group.add(lineEl);
+
+    this._incremental = null;
+};
+
+/**
+ * @override
+ */
+largeLineProto.incrementalPrepareUpdate = function (data) {
+    this.group.removeAll();
+
+    this._clearIncremental();
+
+    if (data.count() > 5e5) {
+        if (!this._incremental) {
+            this._incremental = new IncrementalDisplayble({
+                silent: true
+            });
+        }
+        this.group.add(this._incremental);
+    }
+    else {
+        this._incremental = null;
+    }
+};
+
+/**
+ * @override
+ */
+largeLineProto.incrementalUpdate = function (taskParams, data) {
+    var lineEl = new LargeLineShape();
+    lineEl.setShape({
+        segs: data.getLayout('linesPoints')
+    });
+
+    this._setCommon(lineEl, data, !!this._incremental);
+
+    if (!this._incremental) {
+        lineEl.rectHover = true;
+        lineEl.cursor = 'default';
+        lineEl.__startIndex = taskParams.start;
+        this.group.add(lineEl);
+    }
+    else {
+        this._incremental.addDisplayable(lineEl, true);
+    }
+};
+
+/**
+ * @override
+ */
+largeLineProto.remove = function () {
+    this._clearIncremental();
+    this._incremental = null;
+    this.group.removeAll();
+};
+
+largeLineProto._setCommon = function (lineEl, data, isIncremental) {
+    var hostModel = data.hostModel;
+
+    lineEl.setShape({
+        polyline: hostModel.get('polyline'),
+        curveness: hostModel.get('lineStyle.curveness')
+    });
+
+    lineEl.useStyle(
+        hostModel.getModel('lineStyle').getLineStyle()
+    );
+    lineEl.style.strokeNoScale = true;
+
+    var visualColor = data.getVisual('color');
+    if (visualColor) {
+        lineEl.setStyle('stroke', visualColor);
+    }
+    lineEl.setStyle('fill');
+
+    if (!isIncremental) {
+        // Enable tooltip
+        // PENDING May have performance issue when path is extremely large
+        lineEl.seriesIndex = hostModel.seriesIndex;
+        lineEl.on('mousemove', function (e) {
+            lineEl.dataIndex = null;
+            var dataIndex = lineEl.findDataIndex(e.offsetX, e.offsetY);
+            if (dataIndex > 0) {
+                // Provide dataIndex for tooltip
+                lineEl.dataIndex = dataIndex + lineEl.__startIndex;
+            }
+        });
+    }
+};
+
+largeLineProto._clearIncremental = function () {
+    var incremental = this._incremental;
+    if (incremental) {
+        incremental.clearDisplaybles();
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var linesLayout = {
+    seriesType: 'lines',
+
+    plan: createRenderPlanner(),
+
+    reset: function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+        var isPolyline = seriesModel.get('polyline');
+        var isLarge = seriesModel.pipelineContext.large;
+
+        function progress(params, lineData) {
+            var lineCoords = [];
+            if (isLarge) {
+                var points;
+                var segCount = params.end - params.start;
+                if (isPolyline) {
+                    var totalCoordsCount = 0;
+                    for (var i = params.start; i < params.end; i++) {
+                        totalCoordsCount += seriesModel.getLineCoordsCount(i);
+                    }
+                    points = new Float32Array(segCount + totalCoordsCount * 2);
+                }
+                else {
+                    points = new Float32Array(segCount * 4);
+                }
+
+                var offset = 0;
+                var pt = [];
+                for (var i = params.start; i < params.end; i++) {
+                    var len = seriesModel.getLineCoords(i, lineCoords);
+                    if (isPolyline) {
+                        points[offset++] = len;
+                    }
+                    for (var k = 0; k < len; k++) {
+                        pt = coordSys.dataToPoint(lineCoords[k], false, pt);
+                        points[offset++] = pt[0];
+                        points[offset++] = pt[1];
+                    }
+                }
+
+                lineData.setLayout('linesPoints', points);
+            }
+            else {
+                for (var i = params.start; i < params.end; i++) {
+                    var itemModel = lineData.getItemModel(i);
+                    var len = seriesModel.getLineCoords(i, lineCoords);
+
+                    var pts = [];
+                    if (isPolyline) {
+                        for (var j = 0; j < len; j++) {
+                            pts.push(coordSys.dataToPoint(lineCoords[j]));
+                        }
+                    }
+                    else {
+                        pts[0] = coordSys.dataToPoint(lineCoords[0]);
+                        pts[1] = coordSys.dataToPoint(lineCoords[1]);
+
+                        var curveness = itemModel.get('lineStyle.curveness');
+                        if (+curveness) {
+                            pts[2] = [
+                                (pts[0][0] + pts[1][0]) / 2 - (pts[0][1] - pts[1][1]) * curveness,
+                                (pts[0][1] + pts[1][1]) / 2 - (pts[1][0] - pts[0][0]) * curveness
+                            ];
+                        }
+                    }
+                    lineData.setItemLayout(i, pts);
+                }
+            }
+        }
+
+        return { progress: progress };
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendChartView({
+
+    type: 'lines',
+
+    init: function () {},
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var lineDraw = this._updateLineDraw(data, seriesModel);
+
+        var zlevel = seriesModel.get('zlevel');
+        var trailLength = seriesModel.get('effect.trailLength');
+
+        var zr = api.getZr();
+        // Avoid the drag cause ghost shadow
+        // FIXME Better way ?
+        // SVG doesn't support
+        var isSvg = zr.painter.getType() === 'svg';
+        if (!isSvg) {
+            zr.painter.getLayer(zlevel).clear(true);
+        }
+        // Config layer with motion blur
+        if (this._lastZlevel != null && !isSvg) {
+            zr.configLayer(this._lastZlevel, {
+                motionBlur: false
+            });
+        }
+        if (this._showEffect(seriesModel) && trailLength) {
+            if (__DEV__) {
+                var notInIndividual = false;
+                ecModel.eachSeries(function (otherSeriesModel) {
+                    if (otherSeriesModel !== seriesModel && otherSeriesModel.get('zlevel') === zlevel) {
+                        notInIndividual = true;
+                    }
+                });
+                notInIndividual && console.warn('Lines with trail effect should have an individual zlevel');
+            }
+
+            if (!isSvg) {
+                zr.configLayer(zlevel, {
+                    motionBlur: true,
+                    lastFrameAlpha: Math.max(Math.min(trailLength / 10 + 0.9, 1), 0)
+                });
+            }
+        }
+
+        lineDraw.updateData(data);
+
+        this._lastZlevel = zlevel;
+
+        this._finished = true;
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var lineDraw = this._updateLineDraw(data, seriesModel);
+
+        lineDraw.incrementalPrepareUpdate(data);
+
+        this._clearLayer(api);
+
+        this._finished = false;
+    },
+
+    incrementalRender: function (taskParams, seriesModel, ecModel) {
+        this._lineDraw.incrementalUpdate(taskParams, seriesModel.getData());
+
+        this._finished = taskParams.end === seriesModel.getData().count();
+    },
+
+    updateTransform: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+        var pipelineContext = seriesModel.pipelineContext;
+
+        if (!this._finished || pipelineContext.large || pipelineContext.progressiveRender) {
+            // TODO Don't have to do update in large mode. Only do it when there are millions of data.
+            return {
+                update: true
+            };
+        }
+        else {
+            // TODO Use same logic with ScatterView.
+            // Manually update layout
+            var res = linesLayout.reset(seriesModel);
+            if (res.progress) {
+                res.progress({ start: 0, end: data.count() }, data);
+            }
+            this._lineDraw.updateLayout();
+            this._clearLayer(api);
+        }
+    },
+
+    _updateLineDraw: function (data, seriesModel) {
+        var lineDraw = this._lineDraw;
+        var hasEffect = this._showEffect(seriesModel);
+        var isPolyline = !!seriesModel.get('polyline');
+        var pipelineContext = seriesModel.pipelineContext;
+        var isLargeDraw = pipelineContext.large;
+
+        if (__DEV__) {
+            if (hasEffect && isLargeDraw) {
+                console.warn('Large lines not support effect');
+            }
+        }
+        if (!lineDraw
+            || hasEffect !== this._hasEffet
+            || isPolyline !== this._isPolyline
+            || isLargeDraw !== this._isLargeDraw
+        ) {
+            if (lineDraw) {
+                lineDraw.remove();
+            }
+            lineDraw = this._lineDraw = isLargeDraw
+                ? new LargeLineDraw()
+                : new LineDraw(
+                    isPolyline
+                        ? (hasEffect ? EffectPolyline : Polyline$2)
+                        : (hasEffect ? EffectLine : Line$1)
+                );
+            this._hasEffet = hasEffect;
+            this._isPolyline = isPolyline;
+            this._isLargeDraw = isLargeDraw;
+            this.group.removeAll();
+        }
+
+        this.group.add(lineDraw.group);
+
+        return lineDraw;
+    },
+
+    _showEffect: function (seriesModel) {
+        return !!seriesModel.get('effect.show');
+    },
+
+    _clearLayer: function (api) {
+        // Not use motion when dragging or zooming
+        var zr = api.getZr();
+        var isSvg = zr.painter.getType() === 'svg';
+        if (!isSvg && this._lastZlevel != null) {
+            zr.painter.getLayer(this._lastZlevel).clear(true);
+        }
+    },
+
+    remove: function (ecModel, api) {
+        this._lineDraw && this._lineDraw.remove();
+        this._lineDraw = null;
+        // Clear motion when lineDraw is removed
+        this._clearLayer(api);
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+function normalize$2(a) {
+    if (!(a instanceof Array)) {
+        a = [a, a];
+    }
+    return a;
+}
+
+var opacityQuery = 'lineStyle.opacity'.split('.');
+
+var linesVisual = {
+    seriesType: 'lines',
+    reset: function (seriesModel, ecModel, api) {
+        var symbolType = normalize$2(seriesModel.get('symbol'));
+        var symbolSize = normalize$2(seriesModel.get('symbolSize'));
+        var data = seriesModel.getData();
+
+        data.setVisual('fromSymbol', symbolType && symbolType[0]);
+        data.setVisual('toSymbol', symbolType && symbolType[1]);
+        data.setVisual('fromSymbolSize', symbolSize && symbolSize[0]);
+        data.setVisual('toSymbolSize', symbolSize && symbolSize[1]);
+        data.setVisual('opacity', seriesModel.get(opacityQuery));
+
+        function dataEach(data, idx) {
+            var itemModel = data.getItemModel(idx);
+            var symbolType = normalize$2(itemModel.getShallow('symbol', true));
+            var symbolSize = normalize$2(itemModel.getShallow('symbolSize', true));
+            var opacity = itemModel.get(opacityQuery);
+
+            symbolType[0] && data.setItemVisual(idx, 'fromSymbol', symbolType[0]);
+            symbolType[1] && data.setItemVisual(idx, 'toSymbol', symbolType[1]);
+            symbolSize[0] && data.setItemVisual(idx, 'fromSymbolSize', symbolSize[0]);
+            symbolSize[1] && data.setItemVisual(idx, 'toSymbolSize', symbolSize[1]);
+
+            data.setItemVisual(idx, 'opacity', opacity);
+        }
+
+        return {dataEach: data.hasItemOption ? dataEach : null};
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(linesLayout);
+registerVisual(linesVisual);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+    type: 'series.heatmap',
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this, {
+            generateCoord: 'value'
+        });
+    },
+
+    preventIncremental: function () {
+        var coordSysCreator = CoordinateSystemManager.get(this.get('coordinateSystem'));
+        if (coordSysCreator && coordSysCreator.dimensions) {
+            return coordSysCreator.dimensions[0] === 'lng' && coordSysCreator.dimensions[1] === 'lat';
+        }
+    },
+
+    defaultOption: {
+
+        // Cartesian2D or geo
+        coordinateSystem: 'cartesian2d',
+
+        zlevel: 0,
+
+        z: 2,
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Geo coordinate system
+        geoIndex: 0,
+
+        blurSize: 30,
+
+        pointSize: 20,
+
+        maxOpacity: 1,
+
+        minOpacity: 0
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file defines echarts Heatmap Chart
+ * @author Ovilia (me@zhangwenli.com)
+ * Inspired by https://github.com/mourner/simpleheat
+ *
+ * @module
+ */
+
+var GRADIENT_LEVELS = 256;
+
+/**
+ * Heatmap Chart
+ *
+ * @class
+ */
+function Heatmap() {
+    var canvas = createCanvas();
+    this.canvas = canvas;
+
+    this.blurSize = 30;
+    this.pointSize = 20;
+
+    this.maxOpacity = 1;
+    this.minOpacity = 0;
+
+    this._gradientPixels = {};
+}
+
+Heatmap.prototype = {
+    /**
+     * Renders Heatmap and returns the rendered canvas
+     * @param {Array} data array of data, each has x, y, value
+     * @param {number} width canvas width
+     * @param {number} height canvas height
+     */
+    update: function(data, width, height, normalize, colorFunc, isInRange) {
+        var brush = this._getBrush();
+        var gradientInRange = this._getGradient(data, colorFunc, 'inRange');
+        var gradientOutOfRange = this._getGradient(data, colorFunc, 'outOfRange');
+        var r = this.pointSize + this.blurSize;
+
+        var canvas = this.canvas;
+        var ctx = canvas.getContext('2d');
+        var len = data.length;
+        canvas.width = width;
+        canvas.height = height;
+        for (var i = 0; i < len; ++i) {
+            var p = data[i];
+            var x = p[0];
+            var y = p[1];
+            var value = p[2];
+
+            // calculate alpha using value
+            var alpha = normalize(value);
+
+            // draw with the circle brush with alpha
+            ctx.globalAlpha = alpha;
+            ctx.drawImage(brush, x - r, y - r);
+        }
+
+        if (!canvas.width || !canvas.height) {
+            // Avoid "Uncaught DOMException: Failed to execute 'getImageData' on
+            // 'CanvasRenderingContext2D': The source height is 0."
+            return canvas;
+        }
+
+        // colorize the canvas using alpha value and set with gradient
+        var imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
+
+        var pixels = imageData.data;
+        var offset = 0;
+        var pixelLen = pixels.length;
+        var minOpacity = this.minOpacity;
+        var maxOpacity = this.maxOpacity;
+        var diffOpacity = maxOpacity - minOpacity;
+
+        while(offset < pixelLen) {
+            var alpha = pixels[offset + 3] / 256;
+            var gradientOffset = Math.floor(alpha * (GRADIENT_LEVELS - 1)) * 4;
+            // Simple optimize to ignore the empty data
+            if (alpha > 0) {
+                var gradient = isInRange(alpha) ? gradientInRange : gradientOutOfRange;
+                // Any alpha > 0 will be mapped to [minOpacity, maxOpacity]
+                alpha > 0 && (alpha = alpha * diffOpacity + minOpacity);
+                pixels[offset++] = gradient[gradientOffset];
+                pixels[offset++] = gradient[gradientOffset + 1];
+                pixels[offset++] = gradient[gradientOffset + 2];
+                pixels[offset++] = gradient[gradientOffset + 3] * alpha * 256;
+            }
+            else {
+                offset += 4;
+            }
+        }
+        ctx.putImageData(imageData, 0, 0);
+
+        return canvas;
+    },
+
+    /**
+     * get canvas of a black circle brush used for canvas to draw later
+     * @private
+     * @returns {Object} circle brush canvas
+     */
+    _getBrush: function() {
+        var brushCanvas = this._brushCanvas || (this._brushCanvas = createCanvas());
+        // set brush size
+        var r = this.pointSize + this.blurSize;
+        var d = r * 2;
+        brushCanvas.width = d;
+        brushCanvas.height = d;
+
+        var ctx = brushCanvas.getContext('2d');
+        ctx.clearRect(0, 0, d, d);
+
+        // in order to render shadow without the distinct circle,
+        // draw the distinct circle in an invisible place,
+        // and use shadowOffset to draw shadow in the center of the canvas
+        ctx.shadowOffsetX = d;
+        ctx.shadowBlur = this.blurSize;
+        // draw the shadow in black, and use alpha and shadow blur to generate
+        // color in color map
+        ctx.shadowColor = '#000';
+
+        // draw circle in the left to the canvas
+        ctx.beginPath();
+        ctx.arc(-r, r, this.pointSize, 0, Math.PI * 2, true);
+        ctx.closePath();
+        ctx.fill();
+        return brushCanvas;
+    },
+
+    /**
+     * get gradient color map
+     * @private
+     */
+    _getGradient: function (data, colorFunc, state) {
+        var gradientPixels = this._gradientPixels;
+        var pixelsSingleState = gradientPixels[state] || (gradientPixels[state] = new Uint8ClampedArray(256 * 4));
+        var color = [0, 0, 0, 0];
+        var off = 0;
+        for (var i = 0; i < 256; i++) {
+            colorFunc[state](i / 255, true, color);
+            pixelsSingleState[off++] = color[0];
+            pixelsSingleState[off++] = color[1];
+            pixelsSingleState[off++] = color[2];
+            pixelsSingleState[off++] = color[3];
+        }
+        return pixelsSingleState;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getIsInPiecewiseRange(dataExtent, pieceList, selected) {
+    var dataSpan = dataExtent[1] - dataExtent[0];
+    pieceList = map(pieceList, function (piece) {
+        return {
+            interval: [
+                (piece.interval[0] - dataExtent[0]) / dataSpan,
+                (piece.interval[1] - dataExtent[0]) / dataSpan
+            ]
+        };
+    });
+    var len = pieceList.length;
+    var lastIndex = 0;
+
+    return function (val) {
+        // Try to find in the location of the last found
+        for (var i = lastIndex; i < len; i++) {
+            var interval = pieceList[i].interval;
+            if (interval[0] <= val && val <= interval[1]) {
+                lastIndex = i;
+                break;
+            }
+        }
+        if (i === len) { // Not found, back interation
+            for (var i = lastIndex - 1; i >= 0; i--) {
+                var interval = pieceList[i].interval;
+                if (interval[0] <= val && val <= interval[1]) {
+                    lastIndex = i;
+                    break;
+                }
+            }
+        }
+        return i >= 0 && i < len && selected[i];
+    };
+}
+
+function getIsInContinuousRange(dataExtent, range) {
+    var dataSpan = dataExtent[1] - dataExtent[0];
+    range = [
+        (range[0] - dataExtent[0]) / dataSpan,
+        (range[1] - dataExtent[0]) / dataSpan
+    ];
+    return function (val) {
+        return val >= range[0] && val <= range[1];
+    };
+}
+
+function isGeoCoordSys(coordSys) {
+    var dimensions = coordSys.dimensions;
+    // Not use coorSys.type === 'geo' because coordSys maybe extended
+    return dimensions[0] === 'lng' && dimensions[1] === 'lat';
+}
+
+extendChartView({
+
+    type: 'heatmap',
+
+    render: function (seriesModel, ecModel, api) {
+        var visualMapOfThisSeries;
+        ecModel.eachComponent('visualMap', function (visualMap) {
+            visualMap.eachTargetSeries(function (targetSeries) {
+                if (targetSeries === seriesModel) {
+                    visualMapOfThisSeries = visualMap;
+                }
+            });
+        });
+
+        if (__DEV__) {
+            if (!visualMapOfThisSeries) {
+                throw new Error('Heatmap must use with visualMap');
+            }
+        }
+
+        this.group.removeAll();
+
+        this._incrementalDisplayable = null;
+
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys.type === 'cartesian2d' || coordSys.type === 'calendar') {
+            this._renderOnCartesianAndCalendar(seriesModel, api, 0, seriesModel.getData().count());
+        }
+        else if (isGeoCoordSys(coordSys)) {
+            this._renderOnGeo(
+                coordSys, seriesModel, visualMapOfThisSeries, api
+            );
+        }
+    },
+
+    incrementalPrepareRender: function (seriesModel, ecModel, api) {
+        this.group.removeAll();
+    },
+
+    incrementalRender: function (params, seriesModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys) {
+            this._renderOnCartesianAndCalendar(seriesModel, api, params.start, params.end, true);
+        }
+    },
+
+    _renderOnCartesianAndCalendar: function (seriesModel, api, start, end, incremental) {
+
+        var coordSys = seriesModel.coordinateSystem;
+        var width;
+        var height;
+
+        if (coordSys.type === 'cartesian2d') {
+            var xAxis = coordSys.getAxis('x');
+            var yAxis = coordSys.getAxis('y');
+
+            if (__DEV__) {
+                if (!(xAxis.type === 'category' && yAxis.type === 'category')) {
+                    throw new Error('Heatmap on cartesian must have two category axes');
+                }
+                if (!(xAxis.onBand && yAxis.onBand)) {
+                    throw new Error('Heatmap on cartesian must have two axes with boundaryGap true');
+                }
+            }
+
+            width = xAxis.getBandWidth();
+            height = yAxis.getBandWidth();
+        }
+
+        var group = this.group;
+        var data = seriesModel.getData();
+
+        var itemStyleQuery = 'itemStyle';
+        var hoverItemStyleQuery = 'emphasis.itemStyle';
+        var labelQuery = 'label';
+        var hoverLabelQuery = 'emphasis.label';
+        var style = seriesModel.getModel(itemStyleQuery).getItemStyle(['color']);
+        var hoverStl = seriesModel.getModel(hoverItemStyleQuery).getItemStyle();
+        var labelModel = seriesModel.getModel(labelQuery);
+        var hoverLabelModel = seriesModel.getModel(hoverLabelQuery);
+        var coordSysType = coordSys.type;
+
+
+        var dataDims = coordSysType === 'cartesian2d'
+            ? [
+                data.mapDimension('x'),
+                data.mapDimension('y'),
+                data.mapDimension('value')
+            ]
+            : [
+                data.mapDimension('time'),
+                data.mapDimension('value')
+            ];
+
+        for (var idx = start; idx < end; idx++) {
+            var rect;
+
+            if (coordSysType === 'cartesian2d') {
+                // Ignore empty data
+                if (isNaN(data.get(dataDims[2], idx))) {
+                    continue;
+                }
+
+                var point = coordSys.dataToPoint([
+                    data.get(dataDims[0], idx),
+                    data.get(dataDims[1], idx)
+                ]);
+
+                rect = new Rect({
+                    shape: {
+                        x: point[0] - width / 2,
+                        y: point[1] - height / 2,
+                        width: width,
+                        height: height
+                    },
+                    style: {
+                        fill: data.getItemVisual(idx, 'color'),
+                        opacity: data.getItemVisual(idx, 'opacity')
+                    }
+                });
+            }
+            else {
+                // Ignore empty data
+                if (isNaN(data.get(dataDims[1], idx))) {
+                    continue;
+                }
+
+                rect = new Rect({
+                    z2: 1,
+                    shape: coordSys.dataToRect([data.get(dataDims[0], idx)]).contentShape,
+                    style: {
+                        fill: data.getItemVisual(idx, 'color'),
+                        opacity: data.getItemVisual(idx, 'opacity')
+                    }
+                });
+            }
+
+            var itemModel = data.getItemModel(idx);
+
+            // Optimization for large datset
+            if (data.hasItemOption) {
+                style = itemModel.getModel(itemStyleQuery).getItemStyle(['color']);
+                hoverStl = itemModel.getModel(hoverItemStyleQuery).getItemStyle();
+                labelModel = itemModel.getModel(labelQuery);
+                hoverLabelModel = itemModel.getModel(hoverLabelQuery);
+            }
+
+            var rawValue = seriesModel.getRawValue(idx);
+            var defaultText = '-';
+            if (rawValue && rawValue[2] != null) {
+                defaultText = rawValue[2];
+            }
+
+            setLabelStyle(
+                style, hoverStl, labelModel, hoverLabelModel,
+                {
+                    labelFetcher: seriesModel,
+                    labelDataIndex: idx,
+                    defaultText: defaultText,
+                    isRectText: true
+                }
+            );
+
+            rect.setStyle(style);
+            setHoverStyle(rect, data.hasItemOption ? hoverStl : extend({}, hoverStl));
+
+            rect.incremental = incremental;
+            // PENDING
+            if (incremental) {
+                // Rect must use hover layer if it's incremental.
+                rect.useHoverLayer = true;
+            }
+
+            group.add(rect);
+            data.setItemGraphicEl(idx, rect);
+        }
+    },
+
+    _renderOnGeo: function (geo, seriesModel, visualMapModel, api) {
+        var inRangeVisuals = visualMapModel.targetVisuals.inRange;
+        var outOfRangeVisuals = visualMapModel.targetVisuals.outOfRange;
+        // if (!visualMapping) {
+        //     throw new Error('Data range must have color visuals');
+        // }
+
+        var data = seriesModel.getData();
+        var hmLayer = this._hmLayer || (this._hmLayer || new Heatmap());
+        hmLayer.blurSize = seriesModel.get('blurSize');
+        hmLayer.pointSize = seriesModel.get('pointSize');
+        hmLayer.minOpacity = seriesModel.get('minOpacity');
+        hmLayer.maxOpacity = seriesModel.get('maxOpacity');
+
+        var rect = geo.getViewRect().clone();
+        var roamTransform = geo.getRoamTransform();
+        rect.applyTransform(roamTransform);
+
+        // Clamp on viewport
+        var x = Math.max(rect.x, 0);
+        var y = Math.max(rect.y, 0);
+        var x2 = Math.min(rect.width + rect.x, api.getWidth());
+        var y2 = Math.min(rect.height + rect.y, api.getHeight());
+        var width = x2 - x;
+        var height = y2 - y;
+
+        var dims = [
+            data.mapDimension('lng'),
+            data.mapDimension('lat'),
+            data.mapDimension('value')
+        ];
+
+        var points = data.mapArray(dims, function (lng, lat, value) {
+            var pt = geo.dataToPoint([lng, lat]);
+            pt[0] -= x;
+            pt[1] -= y;
+            pt.push(value);
+            return pt;
+        });
+
+        var dataExtent = visualMapModel.getExtent();
+        var isInRange = visualMapModel.type === 'visualMap.continuous'
+            ? getIsInContinuousRange(dataExtent, visualMapModel.option.range)
+            : getIsInPiecewiseRange(
+                dataExtent, visualMapModel.getPieceList(), visualMapModel.option.selected
+            );
+
+        hmLayer.update(
+            points, width, height,
+            inRangeVisuals.color.getNormalizer(),
+            {
+                inRange: inRangeVisuals.color.getColorMapper(),
+                outOfRange: outOfRangeVisuals.color.getColorMapper()
+            },
+            isInRange
+        );
+        var img = new ZImage({
+            style: {
+                width: width,
+                height: height,
+                x: x,
+                y: y,
+                image: hmLayer.canvas
+            },
+            silent: true
+        });
+        this.group.add(img);
+    },
+
+    dispose: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PictorialBarSeries = BaseBarSeries.extend({
+
+    type: 'series.pictorialBar',
+
+    dependencies: ['grid'],
+
+    defaultOption: {
+        symbol: 'circle',     // Customized bar shape
+        symbolSize: null,     // Can be ['100%', '100%'], null means auto.
+        symbolRotate: null,
+
+        symbolPosition: null, // 'start' or 'end' or 'center', null means auto.
+        symbolOffset: null,
+        symbolMargin: null,   // start margin and end margin. Can be a number or a percent string.
+                                // Auto margin by defualt.
+        symbolRepeat: false,  // false/null/undefined, means no repeat.
+                                // Can be true, means auto calculate repeat times and cut by data.
+                                // Can be a number, specifies repeat times, and do not cut by data.
+                                // Can be 'fixed', means auto calculate repeat times but do not cut by data.
+        symbolRepeatDirection: 'end', // 'end' means from 'start' to 'end'.
+
+        symbolClip: false,
+        symbolBoundingData: null, // Can be 60 or -40 or [-40, 60]
+        symbolPatternSize: 400, // 400 * 400 px
+
+        barGap: '-100%',      // In most case, overlap is needed.
+
+        // z can be set in data item, which is z2 actually.
+
+        // Disable progressive
+        progressive: 0,
+        hoverAnimation: false // Open only when needed.
+    },
+
+    getInitialData: function (option) {
+        // Disable stack.
+        option.stack = null;
+        return PictorialBarSeries.superApply(this, 'getInitialData', arguments);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var BAR_BORDER_WIDTH_QUERY$1 = ['itemStyle', 'borderWidth'];
+
+// index: +isHorizontal
+var LAYOUT_ATTRS = [
+    {xy: 'x', wh: 'width', index: 0, posDesc: ['left', 'right']},
+    {xy: 'y', wh: 'height', index: 1, posDesc: ['top', 'bottom']}
+];
+
+var pathForLineWidth = new Circle();
+
+var BarView$1 = extendChartView({
+
+    type: 'pictorialBar',
+
+    render: function (seriesModel, ecModel, api) {
+        var group = this.group;
+        var data = seriesModel.getData();
+        var oldData = this._data;
+
+        var cartesian = seriesModel.coordinateSystem;
+        var baseAxis = cartesian.getBaseAxis();
+        var isHorizontal = !!baseAxis.isHorizontal();
+        var coordSysRect = cartesian.grid.getRect();
+
+        var opt = {
+            ecSize: {width: api.getWidth(), height: api.getHeight()},
+            seriesModel: seriesModel,
+            coordSys: cartesian,
+            coordSysExtent: [
+                [coordSysRect.x, coordSysRect.x + coordSysRect.width],
+                [coordSysRect.y, coordSysRect.y + coordSysRect.height]
+            ],
+            isHorizontal: isHorizontal,
+            valueDim: LAYOUT_ATTRS[+isHorizontal],
+            categoryDim: LAYOUT_ATTRS[1 - isHorizontal]
+        };
+
+        data.diff(oldData)
+            .add(function (dataIndex) {
+                if (!data.hasValue(dataIndex)) {
+                    return;
+                }
+
+                var itemModel = getItemModel(data, dataIndex);
+                var symbolMeta = getSymbolMeta(data, dataIndex, itemModel, opt);
+
+                var bar = createBar(data, opt, symbolMeta);
+
+                data.setItemGraphicEl(dataIndex, bar);
+                group.add(bar);
+
+                updateCommon$1(bar, opt, symbolMeta);
+            })
+            .update(function (newIndex, oldIndex) {
+                var bar = oldData.getItemGraphicEl(oldIndex);
+
+                if (!data.hasValue(newIndex)) {
+                    group.remove(bar);
+                    return;
+                }
+
+                var itemModel = getItemModel(data, newIndex);
+                var symbolMeta = getSymbolMeta(data, newIndex, itemModel, opt);
+
+                var pictorialShapeStr = getShapeStr(data, symbolMeta);
+                if (bar && pictorialShapeStr !== bar.__pictorialShapeStr) {
+                    group.remove(bar);
+                    data.setItemGraphicEl(newIndex, null);
+                    bar = null;
+                }
+
+                if (bar) {
+                    updateBar(bar, opt, symbolMeta);
+                }
+                else {
+                    bar = createBar(data, opt, symbolMeta, true);
+                }
+
+                data.setItemGraphicEl(newIndex, bar);
+                bar.__pictorialSymbolMeta = symbolMeta;
+                // Add back
+                group.add(bar);
+
+                updateCommon$1(bar, opt, symbolMeta);
+            })
+            .remove(function (dataIndex) {
+                var bar = oldData.getItemGraphicEl(dataIndex);
+                bar && removeBar(oldData, dataIndex, bar.__pictorialSymbolMeta.animationModel, bar);
+            })
+            .execute();
+
+        this._data = data;
+
+        return this.group;
+    },
+
+    dispose: noop,
+
+    remove: function (ecModel, api) {
+        var group = this.group;
+        var data = this._data;
+        if (ecModel.get('animation')) {
+            if (data) {
+                data.eachItemGraphicEl(function (bar) {
+                    removeBar(data, bar.dataIndex, ecModel, bar);
+                });
+            }
+        }
+        else {
+            group.removeAll();
+        }
+    }
+});
+
+
+// Set or calculate default value about symbol, and calculate layout info.
+function getSymbolMeta(data, dataIndex, itemModel, opt) {
+    var layout = data.getItemLayout(dataIndex);
+    var symbolRepeat = itemModel.get('symbolRepeat');
+    var symbolClip = itemModel.get('symbolClip');
+    var symbolPosition = itemModel.get('symbolPosition') || 'start';
+    var symbolRotate = itemModel.get('symbolRotate');
+    var rotation = (symbolRotate || 0) * Math.PI / 180 || 0;
+    var symbolPatternSize = itemModel.get('symbolPatternSize') || 2;
+    var isAnimationEnabled = itemModel.isAnimationEnabled();
+
+    var symbolMeta = {
+        dataIndex: dataIndex,
+        layout: layout,
+        itemModel: itemModel,
+        symbolType: data.getItemVisual(dataIndex, 'symbol') || 'circle',
+        color: data.getItemVisual(dataIndex, 'color'),
+        symbolClip: symbolClip,
+        symbolRepeat: symbolRepeat,
+        symbolRepeatDirection: itemModel.get('symbolRepeatDirection'),
+        symbolPatternSize: symbolPatternSize,
+        rotation: rotation,
+        animationModel: isAnimationEnabled ? itemModel : null,
+        hoverAnimation: isAnimationEnabled && itemModel.get('hoverAnimation'),
+        z2: itemModel.getShallow('z', true) || 0
+    };
+
+    prepareBarLength(itemModel, symbolRepeat, layout, opt, symbolMeta);
+
+    prepareSymbolSize(
+        data, dataIndex, layout, symbolRepeat, symbolClip, symbolMeta.boundingLength,
+        symbolMeta.pxSign, symbolPatternSize, opt, symbolMeta
+    );
+
+    prepareLineWidth(itemModel, symbolMeta.symbolScale, rotation, opt, symbolMeta);
+
+    var symbolSize = symbolMeta.symbolSize;
+    var symbolOffset = itemModel.get('symbolOffset');
+    if (isArray(symbolOffset)) {
+        symbolOffset = [
+            parsePercent$1(symbolOffset[0], symbolSize[0]),
+            parsePercent$1(symbolOffset[1], symbolSize[1])
+        ];
+    }
+
+    prepareLayoutInfo(
+        itemModel, symbolSize, layout, symbolRepeat, symbolClip, symbolOffset,
+        symbolPosition, symbolMeta.valueLineWidth, symbolMeta.boundingLength, symbolMeta.repeatCutLength,
+        opt, symbolMeta
+    );
+
+    return symbolMeta;
+}
+
+// bar length can be negative.
+function prepareBarLength(itemModel, symbolRepeat, layout, opt, output) {
+    var valueDim = opt.valueDim;
+    var symbolBoundingData = itemModel.get('symbolBoundingData');
+    var valueAxis = opt.coordSys.getOtherAxis(opt.coordSys.getBaseAxis());
+    var zeroPx = valueAxis.toGlobalCoord(valueAxis.dataToCoord(0));
+    var pxSignIdx = 1 - +(layout[valueDim.wh] <= 0);
+    var boundingLength;
+
+    if (isArray(symbolBoundingData)) {
+        var symbolBoundingExtent = [
+            convertToCoordOnAxis(valueAxis, symbolBoundingData[0]) - zeroPx,
+            convertToCoordOnAxis(valueAxis, symbolBoundingData[1]) - zeroPx
+        ];
+        symbolBoundingExtent[1] < symbolBoundingExtent[0] && (symbolBoundingExtent.reverse());
+        boundingLength = symbolBoundingExtent[pxSignIdx];
+    }
+    else if (symbolBoundingData != null) {
+        boundingLength = convertToCoordOnAxis(valueAxis, symbolBoundingData) - zeroPx;
+    }
+    else if (symbolRepeat) {
+        boundingLength = opt.coordSysExtent[valueDim.index][pxSignIdx] - zeroPx;
+    }
+    else {
+        boundingLength = layout[valueDim.wh];
+    }
+
+    output.boundingLength = boundingLength;
+
+    if (symbolRepeat) {
+        output.repeatCutLength = layout[valueDim.wh];
+    }
+
+    output.pxSign = boundingLength > 0 ? 1 : boundingLength < 0 ? -1 : 0;
+}
+
+function convertToCoordOnAxis(axis, value) {
+    return axis.toGlobalCoord(axis.dataToCoord(axis.scale.parse(value)));
+}
+
+// Support ['100%', '100%']
+function prepareSymbolSize(
+    data, dataIndex, layout, symbolRepeat, symbolClip, boundingLength,
+    pxSign, symbolPatternSize, opt, output
+) {
+    var valueDim = opt.valueDim;
+    var categoryDim = opt.categoryDim;
+    var categorySize = Math.abs(layout[categoryDim.wh]);
+
+    var symbolSize = data.getItemVisual(dataIndex, 'symbolSize');
+    if (isArray(symbolSize)) {
+        symbolSize = symbolSize.slice();
+    }
+    else {
+        if (symbolSize == null) {
+            symbolSize = '100%';
+        }
+        symbolSize = [symbolSize, symbolSize];
+    }
+
+    // Note: percentage symbolSize (like '100%') do not consider lineWidth, because it is
+    // to complicated to calculate real percent value if considering scaled lineWidth.
+    // So the actual size will bigger than layout size if lineWidth is bigger than zero,
+    // which can be tolerated in pictorial chart.
+
+    symbolSize[categoryDim.index] = parsePercent$1(
+        symbolSize[categoryDim.index],
+        categorySize
+    );
+    symbolSize[valueDim.index] = parsePercent$1(
+        symbolSize[valueDim.index],
+        symbolRepeat ? categorySize : Math.abs(boundingLength)
+    );
+
+    output.symbolSize = symbolSize;
+
+    // If x or y is less than zero, show reversed shape.
+    var symbolScale = output.symbolScale = [
+        symbolSize[0] / symbolPatternSize,
+        symbolSize[1] / symbolPatternSize
+    ];
+    // Follow convention, 'right' and 'top' is the normal scale.
+    symbolScale[valueDim.index] *= (opt.isHorizontal ? -1 : 1) * pxSign;
+}
+
+function prepareLineWidth(itemModel, symbolScale, rotation, opt, output) {
+    // In symbols are drawn with scale, so do not need to care about the case that width
+    // or height are too small. But symbol use strokeNoScale, where acture lineWidth should
+    // be calculated.
+    var valueLineWidth = itemModel.get(BAR_BORDER_WIDTH_QUERY$1) || 0;
+
+    if (valueLineWidth) {
+        pathForLineWidth.attr({
+            scale: symbolScale.slice(),
+            rotation: rotation
+        });
+        pathForLineWidth.updateTransform();
+        valueLineWidth /= pathForLineWidth.getLineScale();
+        valueLineWidth *= symbolScale[opt.valueDim.index];
+    }
+
+    output.valueLineWidth = valueLineWidth;
+}
+
+function prepareLayoutInfo(
+    itemModel, symbolSize, layout, symbolRepeat, symbolClip, symbolOffset,
+    symbolPosition, valueLineWidth, boundingLength, repeatCutLength, opt, output
+) {
+    var categoryDim = opt.categoryDim;
+    var valueDim = opt.valueDim;
+    var pxSign = output.pxSign;
+
+    var unitLength = Math.max(symbolSize[valueDim.index] + valueLineWidth, 0);
+    var pathLen = unitLength;
+
+    // Note: rotation will not effect the layout of symbols, because user may
+    // want symbols to rotate on its center, which should not be translated
+    // when rotating.
+
+    if (symbolRepeat) {
+        var absBoundingLength = Math.abs(boundingLength);
+
+        var symbolMargin = retrieve(itemModel.get('symbolMargin'), '15%') + '';
+        var hasEndGap = false;
+        if (symbolMargin.lastIndexOf('!') === symbolMargin.length - 1) {
+            hasEndGap = true;
+            symbolMargin = symbolMargin.slice(0, symbolMargin.length - 1);
+        }
+        symbolMargin = parsePercent$1(symbolMargin, symbolSize[valueDim.index]);
+
+        var uLenWithMargin = Math.max(unitLength + symbolMargin * 2, 0);
+
+        // When symbol margin is less than 0, margin at both ends will be subtracted
+        // to ensure that all of the symbols will not be overflow the given area.
+        var endFix = hasEndGap ? 0 : symbolMargin * 2;
+
+        // Both final repeatTimes and final symbolMargin area calculated based on
+        // boundingLength.
+        var repeatSpecified = isNumeric(symbolRepeat);
+        var repeatTimes = repeatSpecified
+            ? symbolRepeat
+            : toIntTimes((absBoundingLength + endFix) / uLenWithMargin);
+
+        // Adjust calculate margin, to ensure each symbol is displayed
+        // entirely in the given layout area.
+        var mDiff = absBoundingLength - repeatTimes * unitLength;
+        symbolMargin = mDiff / 2 / (hasEndGap ? repeatTimes : repeatTimes - 1);
+        uLenWithMargin = unitLength + symbolMargin * 2;
+        endFix = hasEndGap ? 0 : symbolMargin * 2;
+
+        // Update repeatTimes when not all symbol will be shown.
+        if (!repeatSpecified && symbolRepeat !== 'fixed') {
+            repeatTimes = repeatCutLength
+                ? toIntTimes((Math.abs(repeatCutLength) + endFix) / uLenWithMargin)
+                : 0;
+        }
+
+        pathLen = repeatTimes * uLenWithMargin - endFix;
+        output.repeatTimes = repeatTimes;
+        output.symbolMargin = symbolMargin;
+    }
+
+    var sizeFix = pxSign * (pathLen / 2);
+    var pathPosition = output.pathPosition = [];
+    pathPosition[categoryDim.index] = layout[categoryDim.wh] / 2;
+    pathPosition[valueDim.index] = symbolPosition === 'start'
+        ? sizeFix
+        : symbolPosition === 'end'
+        ? boundingLength - sizeFix
+        : boundingLength / 2; // 'center'
+    if (symbolOffset) {
+        pathPosition[0] += symbolOffset[0];
+        pathPosition[1] += symbolOffset[1];
+    }
+
+    var bundlePosition = output.bundlePosition = [];
+    bundlePosition[categoryDim.index] = layout[categoryDim.xy];
+    bundlePosition[valueDim.index] = layout[valueDim.xy];
+
+    var barRectShape = output.barRectShape = extend({}, layout);
+    barRectShape[valueDim.wh] = pxSign * Math.max(
+        Math.abs(layout[valueDim.wh]), Math.abs(pathPosition[valueDim.index] + sizeFix)
+    );
+    barRectShape[categoryDim.wh] = layout[categoryDim.wh];
+
+    var clipShape = output.clipShape = {};
+    // Consider that symbol may be overflow layout rect.
+    clipShape[categoryDim.xy] = -layout[categoryDim.xy];
+    clipShape[categoryDim.wh] = opt.ecSize[categoryDim.wh];
+    clipShape[valueDim.xy] = 0;
+    clipShape[valueDim.wh] = layout[valueDim.wh];
+}
+
+function createPath(symbolMeta) {
+    var symbolPatternSize = symbolMeta.symbolPatternSize;
+    var path = createSymbol(
+        // Consider texture img, make a big size.
+        symbolMeta.symbolType,
+        -symbolPatternSize / 2,
+        -symbolPatternSize / 2,
+        symbolPatternSize,
+        symbolPatternSize,
+        symbolMeta.color
+    );
+    path.attr({
+        culling: true
+    });
+    path.type !== 'image' && path.setStyle({
+        strokeNoScale: true
+    });
+
+    return path;
+}
+
+function createOrUpdateRepeatSymbols(bar, opt, symbolMeta, isUpdate) {
+    var bundle = bar.__pictorialBundle;
+    var symbolSize = symbolMeta.symbolSize;
+    var valueLineWidth = symbolMeta.valueLineWidth;
+    var pathPosition = symbolMeta.pathPosition;
+    var valueDim = opt.valueDim;
+    var repeatTimes = symbolMeta.repeatTimes || 0;
+
+    var index = 0;
+    var unit = symbolSize[opt.valueDim.index] + valueLineWidth + symbolMeta.symbolMargin * 2;
+
+    eachPath(bar, function (path) {
+        path.__pictorialAnimationIndex = index;
+        path.__pictorialRepeatTimes = repeatTimes;
+        if (index < repeatTimes) {
+            updateAttr(path, null, makeTarget(index), symbolMeta, isUpdate);
+        }
+        else {
+            updateAttr(path, null, {scale: [0, 0]}, symbolMeta, isUpdate, function () {
+                bundle.remove(path);
+            });
+        }
+
+        updateHoverAnimation(path, symbolMeta);
+
+        index++;
+    });
+
+    for (; index < repeatTimes; index++) {
+        var path = createPath(symbolMeta);
+        path.__pictorialAnimationIndex = index;
+        path.__pictorialRepeatTimes = repeatTimes;
+        bundle.add(path);
+
+        var target = makeTarget(index);
+
+        updateAttr(
+            path,
+            {
+                position: target.position,
+                scale: [0, 0]
+            },
+            {
+                scale: target.scale,
+                rotation: target.rotation
+            },
+            symbolMeta,
+            isUpdate
+        );
+
+        // FIXME
+        // If all emphasis/normal through action.
+        path
+            .on('mouseover', onMouseOver)
+            .on('mouseout', onMouseOut);
+
+        updateHoverAnimation(path, symbolMeta);
+    }
+
+    function makeTarget(index) {
+        var position = pathPosition.slice();
+        // (start && pxSign > 0) || (end && pxSign < 0): i = repeatTimes - index
+        // Otherwise: i = index;
+        var pxSign = symbolMeta.pxSign;
+        var i = index;
+        if (symbolMeta.symbolRepeatDirection === 'start' ? pxSign > 0 : pxSign < 0) {
+            i = repeatTimes - 1 - index;
+        }
+        position[valueDim.index] = unit * (i - repeatTimes / 2 + 0.5) + pathPosition[valueDim.index];
+
+        return {
+            position: position,
+            scale: symbolMeta.symbolScale.slice(),
+            rotation: symbolMeta.rotation
+        };
+    }
+
+    function onMouseOver() {
+        eachPath(bar, function (path) {
+            path.trigger('emphasis');
+        });
+    }
+
+    function onMouseOut() {
+        eachPath(bar, function (path) {
+            path.trigger('normal');
+        });
+    }
+}
+
+function createOrUpdateSingleSymbol(bar, opt, symbolMeta, isUpdate) {
+    var bundle = bar.__pictorialBundle;
+    var mainPath = bar.__pictorialMainPath;
+
+    if (!mainPath) {
+        mainPath = bar.__pictorialMainPath = createPath(symbolMeta);
+        bundle.add(mainPath);
+
+        updateAttr(
+            mainPath,
+            {
+                position: symbolMeta.pathPosition.slice(),
+                scale: [0, 0],
+                rotation: symbolMeta.rotation
+            },
+            {
+                scale: symbolMeta.symbolScale.slice()
+            },
+            symbolMeta,
+            isUpdate
+        );
+
+        mainPath
+            .on('mouseover', onMouseOver)
+            .on('mouseout', onMouseOut);
+    }
+    else {
+        updateAttr(
+            mainPath,
+            null,
+            {
+                position: symbolMeta.pathPosition.slice(),
+                scale: symbolMeta.symbolScale.slice(),
+                rotation: symbolMeta.rotation
+            },
+            symbolMeta,
+            isUpdate
+        );
+    }
+
+    updateHoverAnimation(mainPath, symbolMeta);
+
+    function onMouseOver() {
+        this.trigger('emphasis');
+    }
+
+    function onMouseOut() {
+        this.trigger('normal');
+    }
+}
+
+// bar rect is used for label.
+function createOrUpdateBarRect(bar, symbolMeta, isUpdate) {
+    var rectShape = extend({}, symbolMeta.barRectShape);
+
+    var barRect = bar.__pictorialBarRect;
+    if (!barRect) {
+        barRect = bar.__pictorialBarRect = new Rect({
+            z2: 2,
+            shape: rectShape,
+            silent: true,
+            style: {
+                stroke: 'transparent',
+                fill: 'transparent',
+                lineWidth: 0
+            }
+        });
+
+        bar.add(barRect);
+    }
+    else {
+        updateAttr(barRect, null, {shape: rectShape}, symbolMeta, isUpdate);
+    }
+}
+
+function createOrUpdateClip(bar, opt, symbolMeta, isUpdate) {
+    // If not clip, symbol will be remove and rebuilt.
+    if (symbolMeta.symbolClip) {
+        var clipPath = bar.__pictorialClipPath;
+        var clipShape = extend({}, symbolMeta.clipShape);
+        var valueDim = opt.valueDim;
+        var animationModel = symbolMeta.animationModel;
+        var dataIndex = symbolMeta.dataIndex;
+
+        if (clipPath) {
+            updateProps(
+                clipPath, {shape: clipShape}, animationModel, dataIndex
+            );
+        }
+        else {
+            clipShape[valueDim.wh] = 0;
+            clipPath = new Rect({shape: clipShape});
+            bar.__pictorialBundle.setClipPath(clipPath);
+            bar.__pictorialClipPath = clipPath;
+
+            var target = {};
+            target[valueDim.wh] = symbolMeta.clipShape[valueDim.wh];
+
+            graphic[isUpdate ? 'updateProps' : 'initProps'](
+                clipPath, {shape: target}, animationModel, dataIndex
+            );
+        }
+    }
+}
+
+function getItemModel(data, dataIndex) {
+    var itemModel = data.getItemModel(dataIndex);
+    itemModel.getAnimationDelayParams = getAnimationDelayParams;
+    itemModel.isAnimationEnabled = isAnimationEnabled;
+    return itemModel;
+}
+
+function getAnimationDelayParams(path) {
+    // The order is the same as the z-order, see `symbolRepeatDiretion`.
+    return {
+        index: path.__pictorialAnimationIndex,
+        count: path.__pictorialRepeatTimes
+    };
+}
+
+function isAnimationEnabled() {
+    // `animation` prop can be set on itemModel in pictorial bar chart.
+    return this.parentModel.isAnimationEnabled() && !!this.getShallow('animation');
+}
+
+function updateHoverAnimation(path, symbolMeta) {
+    path.off('emphasis').off('normal');
+
+    var scale = symbolMeta.symbolScale.slice();
+
+    symbolMeta.hoverAnimation && path
+        .on('emphasis', function() {
+            this.animateTo({
+                scale: [scale[0] * 1.1, scale[1] * 1.1]
+            }, 400, 'elasticOut');
+        })
+        .on('normal', function() {
+            this.animateTo({
+                scale: scale.slice()
+            }, 400, 'elasticOut');
+        });
+}
+
+function createBar(data, opt, symbolMeta, isUpdate) {
+    // bar is the main element for each data.
+    var bar = new Group();
+    // bundle is used for location and clip.
+    var bundle = new Group();
+    bar.add(bundle);
+    bar.__pictorialBundle = bundle;
+    bundle.attr('position', symbolMeta.bundlePosition.slice());
+
+    if (symbolMeta.symbolRepeat) {
+        createOrUpdateRepeatSymbols(bar, opt, symbolMeta);
+    }
+    else {
+        createOrUpdateSingleSymbol(bar, opt, symbolMeta);
+    }
+
+    createOrUpdateBarRect(bar, symbolMeta, isUpdate);
+
+    createOrUpdateClip(bar, opt, symbolMeta, isUpdate);
+
+    bar.__pictorialShapeStr = getShapeStr(data, symbolMeta);
+    bar.__pictorialSymbolMeta = symbolMeta;
+
+    return bar;
+}
+
+function updateBar(bar, opt, symbolMeta) {
+    var animationModel = symbolMeta.animationModel;
+    var dataIndex = symbolMeta.dataIndex;
+    var bundle = bar.__pictorialBundle;
+
+    updateProps(
+        bundle, {position: symbolMeta.bundlePosition.slice()}, animationModel, dataIndex
+    );
+
+    if (symbolMeta.symbolRepeat) {
+        createOrUpdateRepeatSymbols(bar, opt, symbolMeta, true);
+    }
+    else {
+        createOrUpdateSingleSymbol(bar, opt, symbolMeta, true);
+    }
+
+    createOrUpdateBarRect(bar, symbolMeta, true);
+
+    createOrUpdateClip(bar, opt, symbolMeta, true);
+}
+
+function removeBar(data, dataIndex, animationModel, bar) {
+    // Not show text when animating
+    var labelRect = bar.__pictorialBarRect;
+    labelRect && (labelRect.style.text = null);
+
+    var pathes = [];
+    eachPath(bar, function (path) {
+        pathes.push(path);
+    });
+    bar.__pictorialMainPath && pathes.push(bar.__pictorialMainPath);
+
+    // I do not find proper remove animation for clip yet.
+    bar.__pictorialClipPath && (animationModel = null);
+
+    each$1(pathes, function (path) {
+        updateProps(
+            path, {scale: [0, 0]}, animationModel, dataIndex,
+            function () {
+                bar.parent && bar.parent.remove(bar);
+            }
+        );
+    });
+
+    data.setItemGraphicEl(dataIndex, null);
+}
+
+function getShapeStr(data, symbolMeta) {
+    return [
+        data.getItemVisual(symbolMeta.dataIndex, 'symbol') || 'none',
+        !!symbolMeta.symbolRepeat,
+        !!symbolMeta.symbolClip
+    ].join(':');
+}
+
+function eachPath(bar, cb, context) {
+    // Do not use Group#eachChild, because it do not support remove.
+    each$1(bar.__pictorialBundle.children(), function (el) {
+        el !== bar.__pictorialBarRect && cb.call(context, el);
+    });
+}
+
+function updateAttr(el, immediateAttrs, animationAttrs, symbolMeta, isUpdate, cb) {
+    immediateAttrs && el.attr(immediateAttrs);
+    // when symbolCip used, only clip path has init animation, otherwise it would be weird effect.
+    if (symbolMeta.symbolClip && !isUpdate) {
+        animationAttrs && el.attr(animationAttrs);
+    }
+    else {
+        animationAttrs && graphic[isUpdate ? 'updateProps' : 'initProps'](
+            el, animationAttrs, symbolMeta.animationModel, symbolMeta.dataIndex, cb
+        );
+    }
+}
+
+function updateCommon$1(bar, opt, symbolMeta) {
+    var color = symbolMeta.color;
+    var dataIndex = symbolMeta.dataIndex;
+    var itemModel = symbolMeta.itemModel;
+    // Color must be excluded.
+    // Because symbol provide setColor individually to set fill and stroke
+    var normalStyle = itemModel.getModel('itemStyle').getItemStyle(['color']);
+    var hoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+    var cursorStyle = itemModel.getShallow('cursor');
+
+    eachPath(bar, function (path) {
+        // PENDING setColor should be before setStyle!!!
+        path.setColor(color);
+        path.setStyle(defaults(
+            {
+                fill: color,
+                opacity: symbolMeta.opacity
+            },
+            normalStyle
+        ));
+        setHoverStyle(path, hoverStyle);
+
+        cursorStyle && (path.cursor = cursorStyle);
+        path.z2 = symbolMeta.z2;
+    });
+
+    var barRectHoverStyle = {};
+    var barPositionOutside = opt.valueDim.posDesc[+(symbolMeta.boundingLength > 0)];
+    var barRect = bar.__pictorialBarRect;
+
+    setLabel(
+        barRect.style, barRectHoverStyle, itemModel,
+        color, opt.seriesModel, dataIndex, barPositionOutside
+    );
+
+    setHoverStyle(barRect, barRectHoverStyle);
+}
+
+function toIntTimes(times) {
+    var roundedTimes = Math.round(times);
+    // Escapse accurate error
+    return Math.abs(times - roundedTimes) < 1e-4
+        ? roundedTimes
+        : Math.ceil(times);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// In case developer forget to include grid component
+registerLayout(curry(
+    layout, 'pictorialBar'
+));
+registerVisual(visualSymbol('pictorialBar', 'roundRect'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @constructor  module:echarts/coord/single/SingleAxis
+ * @extends {module:echarts/coord/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ * @param {string} position
+ */
+var SingleAxis = function (dim, scale, coordExtent, axisType, position) {
+
+    Axis.call(this, dim, scale, coordExtent);
+
+    /**
+     * Axis type
+     * - 'category'
+     * - 'value'
+     * - 'time'
+     * - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * Axis position
+     *  - 'top'
+     *  - 'bottom'
+     *  - 'left'
+     *  - 'right'
+     *  @type {string}
+     */
+    this.position = position || 'bottom';
+
+    /**
+     * Axis orient
+     *  - 'horizontal'
+     *  - 'vertical'
+     * @type {[type]}
+     */
+    this.orient = null;
+
+};
+
+SingleAxis.prototype = {
+
+    constructor: SingleAxis,
+
+    /**
+     * Axis model
+     * @type {module:echarts/coord/single/AxisModel}
+     */
+    model: null,
+
+    /**
+     * Judge the orient of the axis.
+     * @return {boolean}
+     */
+    isHorizontal: function () {
+        var position = this.position;
+        return position === 'top' || position === 'bottom';
+
+    },
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.coordinateSystem.pointToData(point, clamp)[0];
+    },
+
+    /**
+     * Convert the local coord(processed by dataToCoord())
+     * to global coord(concrete pixel coord).
+     * designated by module:echarts/coord/single/Single.
+     * @type {Function}
+     */
+    toGlobalCoord: null,
+
+    /**
+     * Convert the global coord to local coord.
+     * designated by module:echarts/coord/single/Single.
+     * @type {Function}
+     */
+    toLocalCoord: null
+
+};
+
+inherits(SingleAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Single coordinates system.
+ */
+
+/**
+ * Create a single coordinates system.
+ *
+ * @param {module:echarts/coord/single/AxisModel} axisModel
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function Single(axisModel, ecModel, api) {
+
+    /**
+     * @type {string}
+     * @readOnly
+     */
+    this.dimension = 'single';
+
+    /**
+     * Add it just for draw tooltip.
+     *
+     * @type {Array.<string>}
+     * @readOnly
+     */
+    this.dimensions = ['single'];
+
+    /**
+     * @private
+     * @type {module:echarts/coord/single/SingleAxis}.
+     */
+    this._axis = null;
+
+    /**
+     * @private
+     * @type {module:zrender/core/BoundingRect}
+     */
+    this._rect;
+
+    this._init(axisModel, ecModel, api);
+
+    /**
+     * @type {module:echarts/coord/single/AxisModel}
+     */
+    this.model = axisModel;
+}
+
+Single.prototype = {
+
+    type: 'singleAxis',
+
+    axisPointerEnabled: true,
+
+    constructor: Single,
+
+    /**
+     * Initialize single coordinate system.
+     *
+     * @param  {module:echarts/coord/single/AxisModel} axisModel
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     * @private
+     */
+    _init: function (axisModel, ecModel, api) {
+
+        var dim = this.dimension;
+
+        var axis = new SingleAxis(
+            dim,
+            createScaleByModel(axisModel),
+            [0, 0],
+            axisModel.get('type'),
+            axisModel.get('position')
+        );
+
+        var isCategory = axis.type === 'category';
+        axis.onBand = isCategory && axisModel.get('boundaryGap');
+        axis.inverse = axisModel.get('inverse');
+        axis.orient = axisModel.get('orient');
+
+        axisModel.axis = axis;
+        axis.model = axisModel;
+        axis.coordinateSystem = this;
+        this._axis = axis;
+    },
+
+    /**
+     * Update axis scale after data processed
+     * @param  {module:echarts/model/Global} ecModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    update: function (ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            if (seriesModel.coordinateSystem === this) {
+                var data = seriesModel.getData();
+                each$1(data.mapDimension(this.dimension, true), function (dim) {
+                    this._axis.scale.unionExtentFromData(data, dim);
+                }, this);
+                niceScaleExtent(this._axis.scale, this._axis.model);
+            }
+        }, this);
+    },
+
+    /**
+     * Resize the single coordinate system.
+     *
+     * @param  {module:echarts/coord/single/AxisModel} axisModel
+     * @param  {module:echarts/ExtensionAPI} api
+     */
+    resize: function (axisModel, api) {
+        this._rect = getLayoutRect(
+            {
+                left: axisModel.get('left'),
+                top: axisModel.get('top'),
+                right: axisModel.get('right'),
+                bottom: axisModel.get('bottom'),
+                width: axisModel.get('width'),
+                height: axisModel.get('height')
+            },
+            {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }
+        );
+
+        this._adjustAxis();
+    },
+
+    /**
+     * @return {module:zrender/core/BoundingRect}
+     */
+    getRect: function () {
+        return this._rect;
+    },
+
+    /**
+     * @private
+     */
+    _adjustAxis: function () {
+
+        var rect = this._rect;
+        var axis = this._axis;
+
+        var isHorizontal = axis.isHorizontal();
+        var extent = isHorizontal ? [0, rect.width] : [0, rect.height];
+        var idx =  axis.reverse ? 1 : 0;
+
+        axis.setExtent(extent[idx], extent[1 - idx]);
+
+        this._updateAxisTransform(axis, isHorizontal ? rect.x : rect.y);
+
+    },
+
+    /**
+     * @param  {module:echarts/coord/single/SingleAxis} axis
+     * @param  {number} coordBase
+     */
+    _updateAxisTransform: function (axis, coordBase) {
+
+        var axisExtent = axis.getExtent();
+        var extentSum = axisExtent[0] + axisExtent[1];
+        var isHorizontal = axis.isHorizontal();
+
+        axis.toGlobalCoord = isHorizontal
+            ? function (coord) {
+                return coord + coordBase;
+            }
+            : function (coord) {
+                return extentSum - coord + coordBase;
+            };
+
+        axis.toLocalCoord = isHorizontal
+            ? function (coord) {
+                return coord - coordBase;
+            }
+            : function (coord) {
+                return extentSum - coord + coordBase;
+            };
+    },
+
+    /**
+     * Get axis.
+     *
+     * @return {module:echarts/coord/single/SingleAxis}
+     */
+    getAxis: function () {
+        return this._axis;
+    },
+
+    /**
+     * Get axis, add it just for draw tooltip.
+     *
+     * @return {[type]} [description]
+     */
+    getBaseAxis: function () {
+        return this._axis;
+    },
+
+    /**
+     * @return {Array.<module:echarts/coord/Axis>}
+     */
+    getAxes: function () {
+        return [this._axis];
+    },
+
+    /**
+     * @return {Object} {baseAxes: [], otherAxes: []}
+     */
+    getTooltipAxes: function () {
+        return {baseAxes: [this.getAxis()]};
+    },
+
+    /**
+     * If contain point.
+     *
+     * @param  {Array.<number>} point
+     * @return {boolean}
+     */
+    containPoint: function (point) {
+        var rect = this.getRect();
+        var axis = this.getAxis();
+        var orient = axis.orient;
+        if (orient === 'horizontal') {
+            return axis.contain(axis.toLocalCoord(point[0]))
+            && (point[1] >= rect.y && point[1] <= (rect.y + rect.height));
+        }
+        else {
+            return axis.contain(axis.toLocalCoord(point[1]))
+            && (point[0] >= rect.y && point[0] <= (rect.y + rect.height));
+        }
+    },
+
+    /**
+     * @param {Array.<number>} point
+     * @return {Array.<number>}
+     */
+    pointToData: function (point) {
+        var axis = this.getAxis();
+        return [axis.coordToData(axis.toLocalCoord(
+            point[axis.orient === 'horizontal' ? 0 : 1]
+        ))];
+    },
+
+    /**
+     * Convert the series data to concrete point.
+     *
+     * @param  {number|Array.<number>} val
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (val) {
+        var axis = this.getAxis();
+        var rect = this.getRect();
+        var pt = [];
+        var idx = axis.orient === 'horizontal' ? 0 : 1;
+
+        if (val instanceof Array) {
+            val = val[0];
+        }
+
+        pt[idx] = axis.toGlobalCoord(axis.dataToCoord(+val));
+        pt[1 - idx] = idx === 0 ? (rect.y + rect.height / 2) : (rect.x + rect.width / 2);
+        return pt;
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Single coordinate system creator.
+ */
+
+/**
+ * Create single coordinate system and inject it into seriesModel.
+ *
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ * @return {Array.<module:echarts/coord/single/Single>}
+ */
+function create$3(ecModel, api) {
+    var singles = [];
+
+    ecModel.eachComponent('singleAxis', function(axisModel, idx) {
+
+        var single = new Single(axisModel, ecModel, api);
+        single.name = 'single_' + idx;
+        single.resize(axisModel, api);
+        axisModel.coordinateSystem = single;
+        singles.push(single);
+
+    });
+
+    ecModel.eachSeries(function (seriesModel) {
+        if (seriesModel.get('coordinateSystem') === 'singleAxis') {
+            var singleAxisModel = ecModel.queryComponents({
+                mainType: 'singleAxis',
+                index: seriesModel.get('singleAxisIndex'),
+                id: seriesModel.get('singleAxisId')
+            })[0];
+            seriesModel.coordinateSystem = singleAxisModel && singleAxisModel.coordinateSystem;
+        }
+    });
+
+    return singles;
+}
+
+CoordinateSystemManager.register('single', {
+    create: create$3,
+    dimensions: Single.prototype.dimensions
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} opt {labelInside}
+ * @return {Object} {
+ *  position, rotation, labelDirection, labelOffset,
+ *  tickDirection, labelRotate, z2
+ * }
+ */
+function layout$2(axisModel, opt) {
+    opt = opt || {};
+    var single = axisModel.coordinateSystem;
+    var axis = axisModel.axis;
+    var layout = {};
+
+    var axisPosition = axis.position;
+    var orient = axis.orient;
+
+    var rect = single.getRect();
+    var rectBound = [rect.x, rect.x + rect.width, rect.y, rect.y + rect.height];
+
+    var positionMap = {
+        horizontal: {top: rectBound[2], bottom: rectBound[3]},
+        vertical: {left: rectBound[0], right: rectBound[1]}
+    };
+
+    layout.position = [
+        orient === 'vertical'
+            ? positionMap.vertical[axisPosition]
+            : rectBound[0],
+        orient === 'horizontal'
+            ? positionMap.horizontal[axisPosition]
+            : rectBound[3]
+    ];
+
+    var r = {horizontal: 0, vertical: 1};
+    layout.rotation = Math.PI / 2 * r[orient];
+
+    var directionMap = {top: -1, bottom: 1, right: 1, left: -1};
+
+    layout.labelDirection = layout.tickDirection
+        = layout.nameDirection
+        = directionMap[axisPosition];
+
+    if (axisModel.get('axisTick.inside')) {
+        layout.tickDirection = -layout.tickDirection;
+    }
+
+    if (retrieve(opt.labelInside, axisModel.get('axisLabel.inside'))) {
+        layout.labelDirection = -layout.labelDirection;
+    }
+
+    var labelRotation = opt.rotate;
+    labelRotation == null && (labelRotation = axisModel.get('axisLabel.rotate'));
+    layout.labelRotation = axisPosition === 'top' ? -labelRotation : labelRotation;
+
+    layout.z2 = 1;
+
+    return layout;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var axisBuilderAttrs$2 = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+
+var selfBuilderAttr = 'splitLine';
+
+var SingleAxisView = AxisView.extend({
+
+    type: 'singleAxis',
+
+    axisPointerClass: 'SingleAxisPointer',
+
+    render: function (axisModel, ecModel, api, payload) {
+
+        var group = this.group;
+
+        group.removeAll();
+
+        var layout =  layout$2(axisModel);
+
+        var axisBuilder = new AxisBuilder(axisModel, layout);
+
+        each$1(axisBuilderAttrs$2, axisBuilder.add, axisBuilder);
+
+        group.add(axisBuilder.getGroup());
+
+        if (axisModel.get(selfBuilderAttr + '.show')) {
+            this['_' + selfBuilderAttr](axisModel);
+        }
+
+        SingleAxisView.superCall(this, 'render', axisModel, ecModel, api, payload);
+    },
+
+    _splitLine: function(axisModel) {
+        var axis = axisModel.axis;
+
+        if (axis.scale.isBlank()) {
+            return;
+        }
+
+        var splitLineModel = axisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineWidth = lineStyleModel.get('width');
+        var lineColors = lineStyleModel.get('color');
+
+        lineColors = lineColors instanceof Array ? lineColors : [lineColors];
+
+        var gridRect = axisModel.coordinateSystem.getRect();
+        var isHorizontal = axis.isHorizontal();
+
+        var splitLines = [];
+        var lineCount = 0;
+
+        var ticksCoords = axis.getTicksCoords({
+            tickModel: splitLineModel
+        });
+
+        var p1 = [];
+        var p2 = [];
+
+        for (var i = 0; i < ticksCoords.length; ++i) {
+            var tickCoord = axis.toGlobalCoord(ticksCoords[i].coord);
+            if (isHorizontal) {
+                p1[0] = tickCoord;
+                p1[1] = gridRect.y;
+                p2[0] = tickCoord;
+                p2[1] = gridRect.y + gridRect.height;
+            }
+            else {
+                p1[0] = gridRect.x;
+                p1[1] = tickCoord;
+                p2[0] = gridRect.x + gridRect.width;
+                p2[1] = tickCoord;
+            }
+            var colorIndex = (lineCount++) % lineColors.length;
+            splitLines[colorIndex] = splitLines[colorIndex] || [];
+            splitLines[colorIndex].push(new Line(
+                subPixelOptimizeLine({
+                    shape: {
+                        x1: p1[0],
+                        y1: p1[1],
+                        x2: p2[0],
+                        y2: p2[1]
+                    },
+                    style: {
+                        lineWidth: lineWidth
+                    },
+                    silent: true
+                })));
+        }
+
+        for (var i = 0; i < splitLines.length; ++i) {
+            this.group.add(mergePath(splitLines[i], {
+                style: {
+                    stroke: lineColors[i % lineColors.length],
+                    lineDash: lineStyleModel.getLineDash(lineWidth),
+                    lineWidth: lineWidth
+                },
+                silent: true
+            }));
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisModel$4 = ComponentModel.extend({
+
+    type: 'singleAxis',
+
+    layoutMode: 'box',
+
+    /**
+     * @type {module:echarts/coord/single/SingleAxis}
+     */
+    axis: null,
+
+    /**
+     * @type {module:echarts/coord/single/Single}
+     */
+    coordinateSystem: null,
+
+    /**
+     * @override
+     */
+    getCoordSysModel: function () {
+        return this;
+    }
+
+});
+
+var defaultOption$2 = {
+
+    left: '5%',
+    top: '5%',
+    right: '5%',
+    bottom: '5%',
+
+    type: 'value',
+
+    position: 'bottom',
+
+    orient: 'horizontal',
+
+    axisLine: {
+        show: true,
+        lineStyle: {
+            width: 2,
+            type: 'solid'
+        }
+    },
+
+    // Single coordinate system and single axis is the,
+    // which is used as the parent tooltip model.
+    // same model, so we set default tooltip show as true.
+    tooltip: {
+        show: true
+    },
+
+    axisTick: {
+        show: true,
+        length: 6,
+        lineStyle: {
+            width: 2
+        }
+    },
+
+    axisLabel: {
+        show: true,
+        interval: 'auto'
+    },
+
+    splitLine: {
+        show: true,
+        lineStyle: {
+            type: 'dashed',
+            opacity: 0.2
+        }
+    }
+};
+
+function getAxisType$2(axisName, option) {
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+merge(AxisModel$4.prototype, axisModelCommonMixin);
+
+axisModelCreator('single', AxisModel$4, getAxisType$2, defaultOption$2);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {Object} finder contains {seriesIndex, dataIndex, dataIndexInside}
+ * @param {module:echarts/model/Global} ecModel
+ * @return {Object} {point: [x, y], el: ...} point Will not be null.
+ */
+var findPointFromSeries = function (finder, ecModel) {
+    var point = [];
+    var seriesIndex = finder.seriesIndex;
+    var seriesModel;
+    if (seriesIndex == null || !(
+        seriesModel = ecModel.getSeriesByIndex(seriesIndex)
+    )) {
+        return {point: []};
+    }
+
+    var data = seriesModel.getData();
+    var dataIndex = queryDataIndex(data, finder);
+    if (dataIndex == null || dataIndex < 0 || isArray(dataIndex)) {
+        return {point: []};
+    }
+
+    var el = data.getItemGraphicEl(dataIndex);
+    var coordSys = seriesModel.coordinateSystem;
+
+    if (seriesModel.getTooltipPosition) {
+        point = seriesModel.getTooltipPosition(dataIndex) || [];
+    }
+    else if (coordSys && coordSys.dataToPoint) {
+        point = coordSys.dataToPoint(
+            data.getValues(
+                map(coordSys.dimensions, function (dim) {
+                    return data.mapDimension(dim);
+                }), dataIndex, true
+            )
+        ) || [];
+    }
+    else if (el) {
+        // Use graphic bounding rect
+        var rect = el.getBoundingRect().clone();
+        rect.applyTransform(el.transform);
+        point = [
+            rect.x + rect.width / 2,
+            rect.y + rect.height / 2
+        ];
+    }
+
+    return {point: point, el: el};
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$14 = each$1;
+var curry$3 = curry;
+var inner$7 = makeInner();
+
+/**
+ * Basic logic: check all axis, if they do not demand show/highlight,
+ * then hide/downplay them.
+ *
+ * @param {Object} coordSysAxesInfo
+ * @param {Object} payload
+ * @param {string} [payload.currTrigger] 'click' | 'mousemove' | 'leave'
+ * @param {Array.<number>} [payload.x] x and y, which are mandatory, specify a point to
+ *              trigger axisPointer and tooltip.
+ * @param {Array.<number>} [payload.y] x and y, which are mandatory, specify a point to
+ *              trigger axisPointer and tooltip.
+ * @param {Object} [payload.seriesIndex] finder, optional, restrict target axes.
+ * @param {Object} [payload.dataIndex] finder, restrict target axes.
+ * @param {Object} [payload.axesInfo] finder, restrict target axes.
+ *        [{
+ *          axisDim: 'x'|'y'|'angle'|...,
+ *          axisIndex: ...,
+ *          value: ...
+ *        }, ...]
+ * @param {Function} [payload.dispatchAction]
+ * @param {Object} [payload.tooltipOption]
+ * @param {Object|Array.<number>|Function} [payload.position] Tooltip position,
+ *        which can be specified in dispatchAction
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ * @return {Object} content of event obj for echarts.connect.
+ */
+var axisTrigger = function (payload, ecModel, api) {
+    var currTrigger = payload.currTrigger;
+    var point = [payload.x, payload.y];
+    var finder = payload;
+    var dispatchAction = payload.dispatchAction || bind(api.dispatchAction, api);
+    var coordSysAxesInfo = ecModel.getComponent('axisPointer').coordSysAxesInfo;
+
+    // Pending
+    // See #6121. But we are not able to reproduce it yet.
+    if (!coordSysAxesInfo) {
+        return;
+    }
+
+    if (illegalPoint(point)) {
+        // Used in the default behavior of `connection`: use the sample seriesIndex
+        // and dataIndex. And also used in the tooltipView trigger.
+        point = findPointFromSeries({
+            seriesIndex: finder.seriesIndex,
+            // Do not use dataIndexInside from other ec instance.
+            // FIXME: auto detect it?
+            dataIndex: finder.dataIndex
+        }, ecModel).point;
+    }
+    var isIllegalPoint = illegalPoint(point);
+
+    // Axis and value can be specified when calling dispatchAction({type: 'updateAxisPointer'}).
+    // Notice: In this case, it is difficult to get the `point` (which is necessary to show
+    // tooltip, so if point is not given, we just use the point found by sample seriesIndex
+    // and dataIndex.
+    var inputAxesInfo = finder.axesInfo;
+
+    var axesInfo = coordSysAxesInfo.axesInfo;
+    var shouldHide = currTrigger === 'leave' || illegalPoint(point);
+    var outputFinder = {};
+
+    var showValueMap = {};
+    var dataByCoordSys = {list: [], map: {}};
+    var updaters = {
+        showPointer: curry$3(showPointer, showValueMap),
+        showTooltip: curry$3(showTooltip, dataByCoordSys)
+    };
+
+    // Process for triggered axes.
+    each$14(coordSysAxesInfo.coordSysMap, function (coordSys, coordSysKey) {
+        // If a point given, it must be contained by the coordinate system.
+        var coordSysContainsPoint = isIllegalPoint || coordSys.containPoint(point);
+
+        each$14(coordSysAxesInfo.coordSysAxesInfo[coordSysKey], function (axisInfo, key) {
+            var axis = axisInfo.axis;
+            var inputAxisInfo = findInputAxisInfo(inputAxesInfo, axisInfo);
+            // If no inputAxesInfo, no axis is restricted.
+            if (!shouldHide && coordSysContainsPoint && (!inputAxesInfo || inputAxisInfo)) {
+                var val = inputAxisInfo && inputAxisInfo.value;
+                if (val == null && !isIllegalPoint) {
+                    val = axis.pointToData(point);
+                }
+                val != null && processOnAxis(axisInfo, val, updaters, false, outputFinder);
+            }
+        });
+    });
+
+    // Process for linked axes.
+    var linkTriggers = {};
+    each$14(axesInfo, function (tarAxisInfo, tarKey) {
+        var linkGroup = tarAxisInfo.linkGroup;
+
+        // If axis has been triggered in the previous stage, it should not be triggered by link.
+        if (linkGroup && !showValueMap[tarKey]) {
+            each$14(linkGroup.axesInfo, function (srcAxisInfo, srcKey) {
+                var srcValItem = showValueMap[srcKey];
+                // If srcValItem exist, source axis is triggered, so link to target axis.
+                if (srcAxisInfo !== tarAxisInfo && srcValItem) {
+                    var val = srcValItem.value;
+                    linkGroup.mapper && (val = tarAxisInfo.axis.scale.parse(linkGroup.mapper(
+                        val, makeMapperParam(srcAxisInfo), makeMapperParam(tarAxisInfo)
+                    )));
+                    linkTriggers[tarAxisInfo.key] = val;
+                }
+            });
+        }
+    });
+    each$14(linkTriggers, function (val, tarKey) {
+        processOnAxis(axesInfo[tarKey], val, updaters, true, outputFinder);
+    });
+
+    updateModelActually(showValueMap, axesInfo, outputFinder);
+    dispatchTooltipActually(dataByCoordSys, point, payload, dispatchAction);
+    dispatchHighDownActually(axesInfo, dispatchAction, api);
+
+    return outputFinder;
+};
+
+function processOnAxis(axisInfo, newValue, updaters, dontSnap, outputFinder) {
+    var axis = axisInfo.axis;
+
+    if (axis.scale.isBlank() || !axis.containData(newValue)) {
+        return;
+    }
+
+    if (!axisInfo.involveSeries) {
+        updaters.showPointer(axisInfo, newValue);
+        return;
+    }
+
+    // Heavy calculation. So put it after axis.containData checking.
+    var payloadInfo = buildPayloadsBySeries(newValue, axisInfo);
+    var payloadBatch = payloadInfo.payloadBatch;
+    var snapToValue = payloadInfo.snapToValue;
+
+    // Fill content of event obj for echarts.connect.
+    // By defualt use the first involved series data as a sample to connect.
+    if (payloadBatch[0] && outputFinder.seriesIndex == null) {
+        extend(outputFinder, payloadBatch[0]);
+    }
+
+    // If no linkSource input, this process is for collecting link
+    // target, where snap should not be accepted.
+    if (!dontSnap && axisInfo.snap) {
+        if (axis.containData(snapToValue) && snapToValue != null) {
+            newValue = snapToValue;
+        }
+    }
+
+    updaters.showPointer(axisInfo, newValue, payloadBatch, outputFinder);
+    // Tooltip should always be snapToValue, otherwise there will be
+    // incorrect "axis value ~ series value" mapping displayed in tooltip.
+    updaters.showTooltip(axisInfo, payloadInfo, snapToValue);
+}
+
+function buildPayloadsBySeries(value, axisInfo) {
+    var axis = axisInfo.axis;
+    var dim = axis.dim;
+    var snapToValue = value;
+    var payloadBatch = [];
+    var minDist = Number.MAX_VALUE;
+    var minDiff = -1;
+
+    each$14(axisInfo.seriesModels, function (series, idx) {
+        var dataDim = series.getData().mapDimension(dim, true);
+        var seriesNestestValue;
+        var dataIndices;
+
+        if (series.getAxisTooltipData) {
+            var result = series.getAxisTooltipData(dataDim, value, axis);
+            dataIndices = result.dataIndices;
+            seriesNestestValue = result.nestestValue;
+        }
+        else {
+            dataIndices = series.getData().indicesOfNearest(
+                dataDim[0],
+                value,
+                // Add a threshold to avoid find the wrong dataIndex
+                // when data length is not same.
+                // false,
+                axis.type === 'category' ? 0.5 : null
+            );
+            if (!dataIndices.length) {
+                return;
+            }
+            seriesNestestValue = series.getData().get(dataDim[0], dataIndices[0]);
+        }
+
+        if (seriesNestestValue == null || !isFinite(seriesNestestValue)) {
+            return;
+        }
+
+        var diff = value - seriesNestestValue;
+        var dist = Math.abs(diff);
+        // Consider category case
+        if (dist <= minDist) {
+            if (dist < minDist || (diff >= 0 && minDiff < 0)) {
+                minDist = dist;
+                minDiff = diff;
+                snapToValue = seriesNestestValue;
+                payloadBatch.length = 0;
+            }
+            each$14(dataIndices, function (dataIndex) {
+                payloadBatch.push({
+                    seriesIndex: series.seriesIndex,
+                    dataIndexInside: dataIndex,
+                    dataIndex: series.getData().getRawIndex(dataIndex)
+                });
+            });
+        }
+    });
+
+    return {
+        payloadBatch: payloadBatch,
+        snapToValue: snapToValue
+    };
+}
+
+function showPointer(showValueMap, axisInfo, value, payloadBatch) {
+    showValueMap[axisInfo.key] = {value: value, payloadBatch: payloadBatch};
+}
+
+function showTooltip(dataByCoordSys, axisInfo, payloadInfo, value) {
+    var payloadBatch = payloadInfo.payloadBatch;
+    var axis = axisInfo.axis;
+    var axisModel = axis.model;
+    var axisPointerModel = axisInfo.axisPointerModel;
+
+    // If no data, do not create anything in dataByCoordSys,
+    // whose length will be used to judge whether dispatch action.
+    if (!axisInfo.triggerTooltip || !payloadBatch.length) {
+        return;
+    }
+
+    var coordSysModel = axisInfo.coordSys.model;
+    var coordSysKey = makeKey(coordSysModel);
+    var coordSysItem = dataByCoordSys.map[coordSysKey];
+    if (!coordSysItem) {
+        coordSysItem = dataByCoordSys.map[coordSysKey] = {
+            coordSysId: coordSysModel.id,
+            coordSysIndex: coordSysModel.componentIndex,
+            coordSysType: coordSysModel.type,
+            coordSysMainType: coordSysModel.mainType,
+            dataByAxis: []
+        };
+        dataByCoordSys.list.push(coordSysItem);
+    }
+
+    coordSysItem.dataByAxis.push({
+        axisDim: axis.dim,
+        axisIndex: axisModel.componentIndex,
+        axisType: axisModel.type,
+        axisId: axisModel.id,
+        value: value,
+        // Caustion: viewHelper.getValueLabel is actually on "view stage", which
+        // depends that all models have been updated. So it should not be performed
+        // here. Considering axisPointerModel used here is volatile, which is hard
+        // to be retrieve in TooltipView, we prepare parameters here.
+        valueLabelOpt: {
+            precision: axisPointerModel.get('label.precision'),
+            formatter: axisPointerModel.get('label.formatter')
+        },
+        seriesDataIndices: payloadBatch.slice()
+    });
+}
+
+function updateModelActually(showValueMap, axesInfo, outputFinder) {
+    var outputAxesInfo = outputFinder.axesInfo = [];
+    // Basic logic: If no 'show' required, 'hide' this axisPointer.
+    each$14(axesInfo, function (axisInfo, key) {
+        var option = axisInfo.axisPointerModel.option;
+        var valItem = showValueMap[key];
+
+        if (valItem) {
+            !axisInfo.useHandle && (option.status = 'show');
+            option.value = valItem.value;
+            // For label formatter param and highlight.
+            option.seriesDataIndices = (valItem.payloadBatch || []).slice();
+        }
+        // When always show (e.g., handle used), remain
+        // original value and status.
+        else {
+            // If hide, value still need to be set, consider
+            // click legend to toggle axis blank.
+            !axisInfo.useHandle && (option.status = 'hide');
+        }
+
+        // If status is 'hide', should be no info in payload.
+        option.status === 'show' && outputAxesInfo.push({
+            axisDim: axisInfo.axis.dim,
+            axisIndex: axisInfo.axis.model.componentIndex,
+            value: option.value
+        });
+    });
+}
+
+function dispatchTooltipActually(dataByCoordSys, point, payload, dispatchAction) {
+    // Basic logic: If no showTip required, hideTip will be dispatched.
+    if (illegalPoint(point) || !dataByCoordSys.list.length) {
+        dispatchAction({type: 'hideTip'});
+        return;
+    }
+
+    // In most case only one axis (or event one series is used). It is
+    // convinient to fetch payload.seriesIndex and payload.dataIndex
+    // dirtectly. So put the first seriesIndex and dataIndex of the first
+    // axis on the payload.
+    var sampleItem = ((dataByCoordSys.list[0].dataByAxis[0] || {}).seriesDataIndices || [])[0] || {};
+
+    dispatchAction({
+        type: 'showTip',
+        escapeConnect: true,
+        x: point[0],
+        y: point[1],
+        tooltipOption: payload.tooltipOption,
+        position: payload.position,
+        dataIndexInside: sampleItem.dataIndexInside,
+        dataIndex: sampleItem.dataIndex,
+        seriesIndex: sampleItem.seriesIndex,
+        dataByCoordSys: dataByCoordSys.list
+    });
+}
+
+function dispatchHighDownActually(axesInfo, dispatchAction, api) {
+    // FIXME
+    // highlight status modification shoule be a stage of main process?
+    // (Consider confilct (e.g., legend and axisPointer) and setOption)
+
+    var zr = api.getZr();
+    var highDownKey = 'axisPointerLastHighlights';
+    var lastHighlights = inner$7(zr)[highDownKey] || {};
+    var newHighlights = inner$7(zr)[highDownKey] = {};
+
+    // Update highlight/downplay status according to axisPointer model.
+    // Build hash map and remove duplicate incidentally.
+    each$14(axesInfo, function (axisInfo, key) {
+        var option = axisInfo.axisPointerModel.option;
+        option.status === 'show' && each$14(option.seriesDataIndices, function (batchItem) {
+            var key = batchItem.seriesIndex + ' | ' + batchItem.dataIndex;
+            newHighlights[key] = batchItem;
+        });
+    });
+
+    // Diff.
+    var toHighlight = [];
+    var toDownplay = [];
+    each$1(lastHighlights, function (batchItem, key) {
+        !newHighlights[key] && toDownplay.push(batchItem);
+    });
+    each$1(newHighlights, function (batchItem, key) {
+        !lastHighlights[key] && toHighlight.push(batchItem);
+    });
+
+    toDownplay.length && api.dispatchAction({
+        type: 'downplay', escapeConnect: true, batch: toDownplay
+    });
+    toHighlight.length && api.dispatchAction({
+        type: 'highlight', escapeConnect: true, batch: toHighlight
+    });
+}
+
+function findInputAxisInfo(inputAxesInfo, axisInfo) {
+    for (var i = 0; i < (inputAxesInfo || []).length; i++) {
+        var inputAxisInfo = inputAxesInfo[i];
+        if (axisInfo.axis.dim === inputAxisInfo.axisDim
+            && axisInfo.axis.model.componentIndex === inputAxisInfo.axisIndex
+        ) {
+            return inputAxisInfo;
+        }
+    }
+}
+
+function makeMapperParam(axisInfo) {
+    var axisModel = axisInfo.axis.model;
+    var item = {};
+    var dim = item.axisDim = axisInfo.axis.dim;
+    item.axisIndex = item[dim + 'AxisIndex'] = axisModel.componentIndex;
+    item.axisName = item[dim + 'AxisName'] = axisModel.name;
+    item.axisId = item[dim + 'AxisId'] = axisModel.id;
+    return item;
+}
+
+function illegalPoint(point) {
+    return !point || point[0] == null || isNaN(point[0]) || point[1] == null || isNaN(point[1]);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisPointerModel = extendComponentModel({
+
+    type: 'axisPointer',
+
+    coordSysAxesInfo: null,
+
+    defaultOption: {
+        // 'auto' means that show when triggered by tooltip or handle.
+        show: 'auto',
+        // 'click' | 'mousemove' | 'none'
+        triggerOn: null, // set default in AxisPonterView.js
+
+        zlevel: 0,
+        z: 50,
+
+        type: 'line',
+        // axispointer triggered by tootip determine snap automatically,
+        // see `modelHelper`.
+        snap: false,
+        triggerTooltip: true,
+
+        value: null,
+        status: null, // Init value depends on whether handle is used.
+
+        // [group0, group1, ...]
+        // Each group can be: {
+        //      mapper: function () {},
+        //      singleTooltip: 'multiple',  // 'multiple' or 'single'
+        //      xAxisId: ...,
+        //      yAxisName: ...,
+        //      angleAxisIndex: ...
+        // }
+        // mapper: can be ignored.
+        //      input: {axisInfo, value}
+        //      output: {axisInfo, value}
+        link: [],
+
+        // Do not set 'auto' here, otherwise global animation: false
+        // will not effect at this axispointer.
+        animation: null,
+        animationDurationUpdate: 200,
+
+        lineStyle: {
+            color: '#aaa',
+            width: 1,
+            type: 'solid'
+        },
+
+        shadowStyle: {
+            color: 'rgba(150,150,150,0.3)'
+        },
+
+        label: {
+            show: true,
+            formatter: null, // string | Function
+            precision: 'auto', // Or a number like 0, 1, 2 ...
+            margin: 3,
+            color: '#fff',
+            padding: [5, 7, 5, 7],
+            backgroundColor: 'auto', // default: axis line color
+            borderColor: null,
+            borderWidth: 0,
+            shadowBlur: 3,
+            shadowColor: '#aaa'
+            // Considering applicability, common style should
+            // better not have shadowOffset.
+            // shadowOffsetX: 0,
+            // shadowOffsetY: 2
+        },
+
+        handle: {
+            show: false,
+            icon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4h1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7v-1.2h6.6z M13.3,22H6.7v-1.2h6.6z M13.3,19.6H6.7v-1.2h6.6z', // jshint ignore:line
+            size: 45,
+            // handle margin is from symbol center to axis, which is stable when circular move.
+            margin: 50,
+            // color: '#1b8bbd'
+            // color: '#2f4554'
+            color: '#333',
+            shadowBlur: 3,
+            shadowColor: '#aaa',
+            shadowOffsetX: 0,
+            shadowOffsetY: 2,
+
+            // For mobile performance
+            throttle: 40
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$8 = makeInner();
+var each$15 = each$1;
+
+/**
+ * @param {string} key
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Function} handler
+ *      param: {string} currTrigger
+ *      param: {Array.<number>} point
+ */
+function register(key, api, handler) {
+    if (env$1.node) {
+        return;
+    }
+
+    var zr = api.getZr();
+    inner$8(zr).records || (inner$8(zr).records = {});
+
+    initGlobalListeners(zr, api);
+
+    var record = inner$8(zr).records[key] || (inner$8(zr).records[key] = {});
+    record.handler = handler;
+}
+
+function initGlobalListeners(zr, api) {
+    if (inner$8(zr).initialized) {
+        return;
+    }
+
+    inner$8(zr).initialized = true;
+
+    useHandler('click', curry(doEnter, 'click'));
+    useHandler('mousemove', curry(doEnter, 'mousemove'));
+    // useHandler('mouseout', onLeave);
+    useHandler('globalout', onLeave);
+
+    function useHandler(eventType, cb) {
+        zr.on(eventType, function (e) {
+            var dis = makeDispatchAction(api);
+
+            each$15(inner$8(zr).records, function (record) {
+                record && cb(record, e, dis.dispatchAction);
+            });
+
+            dispatchTooltipFinally(dis.pendings, api);
+        });
+    }
+}
+
+function dispatchTooltipFinally(pendings, api) {
+    var showLen = pendings.showTip.length;
+    var hideLen = pendings.hideTip.length;
+
+    var actuallyPayload;
+    if (showLen) {
+        actuallyPayload = pendings.showTip[showLen - 1];
+    }
+    else if (hideLen) {
+        actuallyPayload = pendings.hideTip[hideLen - 1];
+    }
+    if (actuallyPayload) {
+        actuallyPayload.dispatchAction = null;
+        api.dispatchAction(actuallyPayload);
+    }
+}
+
+function onLeave(record, e, dispatchAction) {
+    record.handler('leave', null, dispatchAction);
+}
+
+function doEnter(currTrigger, record, e, dispatchAction) {
+    record.handler(currTrigger, e, dispatchAction);
+}
+
+function makeDispatchAction(api) {
+    var pendings = {
+        showTip: [],
+        hideTip: []
+    };
+    // FIXME
+    // better approach?
+    // 'showTip' and 'hideTip' can be triggered by axisPointer and tooltip,
+    // which may be conflict, (axisPointer call showTip but tooltip call hideTip);
+    // So we have to add "final stage" to merge those dispatched actions.
+    var dispatchAction = function (payload) {
+        var pendingList = pendings[payload.type];
+        if (pendingList) {
+            pendingList.push(payload);
+        }
+        else {
+            payload.dispatchAction = dispatchAction;
+            api.dispatchAction(payload);
+        }
+    };
+
+    return {
+        dispatchAction: dispatchAction,
+        pendings: pendings
+    };
+}
+
+/**
+ * @param {string} key
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function unregister(key, api) {
+    if (env$1.node) {
+        return;
+    }
+    var zr = api.getZr();
+    var record = (inner$8(zr).records || {})[key];
+    if (record) {
+        inner$8(zr).records[key] = null;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AxisPointerView = extendComponentView({
+
+    type: 'axisPointer',
+
+    render: function (globalAxisPointerModel, ecModel, api) {
+        var globalTooltipModel = ecModel.getComponent('tooltip');
+        var triggerOn = globalAxisPointerModel.get('triggerOn')
+            || (globalTooltipModel && globalTooltipModel.get('triggerOn') || 'mousemove|click');
+
+        // Register global listener in AxisPointerView to enable
+        // AxisPointerView to be independent to Tooltip.
+        register(
+            'axisPointer',
+            api,
+            function (currTrigger, e, dispatchAction) {
+                // If 'none', it is not controlled by mouse totally.
+                if (triggerOn !== 'none'
+                    && (currTrigger === 'leave' || triggerOn.indexOf(currTrigger) >= 0)
+                ) {
+                    dispatchAction({
+                        type: 'updateAxisPointer',
+                        currTrigger: currTrigger,
+                        x: e && e.offsetX,
+                        y: e && e.offsetY
+                    });
+                }
+            }
+        );
+    },
+
+    /**
+     * @override
+     */
+    remove: function (ecModel, api) {
+        unregister(api.getZr(), 'axisPointer');
+        AxisPointerView.superApply(this._model, 'remove', arguments);
+    },
+
+    /**
+     * @override
+     */
+    dispose: function (ecModel, api) {
+        unregister('axisPointer', api);
+        AxisPointerView.superApply(this._model, 'dispose', arguments);
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var inner$9 = makeInner();
+var clone$4 = clone;
+var bind$2 = bind;
+
+/**
+ * Base axis pointer class in 2D.
+ * Implemenents {module:echarts/component/axis/IAxisPointer}.
+ */
+function BaseAxisPointer () {
+}
+
+BaseAxisPointer.prototype = {
+
+    /**
+     * @private
+     */
+    _group: null,
+
+    /**
+     * @private
+     */
+    _lastGraphicKey: null,
+
+    /**
+     * @private
+     */
+    _handle: null,
+
+    /**
+     * @private
+     */
+    _dragging: false,
+
+    /**
+     * @private
+     */
+    _lastValue: null,
+
+    /**
+     * @private
+     */
+    _lastStatus: null,
+
+    /**
+     * @private
+     */
+    _payloadInfo: null,
+
+    /**
+     * In px, arbitrary value. Do not set too small,
+     * no animation is ok for most cases.
+     * @protected
+     */
+    animationThreshold: 15,
+
+    /**
+     * @implement
+     */
+    render: function (axisModel, axisPointerModel, api, forceRender) {
+        var value = axisPointerModel.get('value');
+        var status = axisPointerModel.get('status');
+
+        // Bind them to `this`, not in closure, otherwise they will not
+        // be replaced when user calling setOption in not merge mode.
+        this._axisModel = axisModel;
+        this._axisPointerModel = axisPointerModel;
+        this._api = api;
+
+        // Optimize: `render` will be called repeatly during mouse move.
+        // So it is power consuming if performing `render` each time,
+        // especially on mobile device.
+        if (!forceRender
+            && this._lastValue === value
+            && this._lastStatus === status
+        ) {
+            return;
+        }
+        this._lastValue = value;
+        this._lastStatus = status;
+
+        var group = this._group;
+        var handle = this._handle;
+
+        if (!status || status === 'hide') {
+            // Do not clear here, for animation better.
+            group && group.hide();
+            handle && handle.hide();
+            return;
+        }
+        group && group.show();
+        handle && handle.show();
+
+        // Otherwise status is 'show'
+        var elOption = {};
+        this.makeElOption(elOption, value, axisModel, axisPointerModel, api);
+
+        // Enable change axis pointer type.
+        var graphicKey = elOption.graphicKey;
+        if (graphicKey !== this._lastGraphicKey) {
+            this.clear(api);
+        }
+        this._lastGraphicKey = graphicKey;
+
+        var moveAnimation = this._moveAnimation =
+            this.determineAnimation(axisModel, axisPointerModel);
+
+        if (!group) {
+            group = this._group = new Group();
+            this.createPointerEl(group, elOption, axisModel, axisPointerModel);
+            this.createLabelEl(group, elOption, axisModel, axisPointerModel);
+            api.getZr().add(group);
+        }
+        else {
+            var doUpdateProps = curry(updateProps$1, axisPointerModel, moveAnimation);
+            this.updatePointerEl(group, elOption, doUpdateProps, axisPointerModel);
+            this.updateLabelEl(group, elOption, doUpdateProps, axisPointerModel);
+        }
+
+        updateMandatoryProps(group, axisPointerModel, true);
+
+        this._renderHandle(value);
+    },
+
+    /**
+     * @implement
+     */
+    remove: function (api) {
+        this.clear(api);
+    },
+
+    /**
+     * @implement
+     */
+    dispose: function (api) {
+        this.clear(api);
+    },
+
+    /**
+     * @protected
+     */
+    determineAnimation: function (axisModel, axisPointerModel) {
+        var animation = axisPointerModel.get('animation');
+        var axis = axisModel.axis;
+        var isCategoryAxis = axis.type === 'category';
+        var useSnap = axisPointerModel.get('snap');
+
+        // Value axis without snap always do not snap.
+        if (!useSnap && !isCategoryAxis) {
+            return false;
+        }
+
+        if (animation === 'auto' || animation == null) {
+            var animationThreshold = this.animationThreshold;
+            if (isCategoryAxis && axis.getBandWidth() > animationThreshold) {
+                return true;
+            }
+
+            // It is important to auto animation when snap used. Consider if there is
+            // a dataZoom, animation will be disabled when too many points exist, while
+            // it will be enabled for better visual effect when little points exist.
+            if (useSnap) {
+                var seriesDataCount = getAxisInfo(axisModel).seriesDataCount;
+                var axisExtent = axis.getExtent();
+                // Approximate band width
+                return Math.abs(axisExtent[0] - axisExtent[1]) / seriesDataCount > animationThreshold;
+            }
+
+            return false;
+        }
+
+        return animation === true;
+    },
+
+    /**
+     * add {pointer, label, graphicKey} to elOption
+     * @protected
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        // Shoule be implemenented by sub-class.
+    },
+
+    /**
+     * @protected
+     */
+    createPointerEl: function (group, elOption, axisModel, axisPointerModel) {
+        var pointerOption = elOption.pointer;
+        if (pointerOption) {
+            var pointerEl = inner$9(group).pointerEl = new graphic[pointerOption.type](
+                clone$4(elOption.pointer)
+            );
+            group.add(pointerEl);
+        }
+    },
+
+    /**
+     * @protected
+     */
+    createLabelEl: function (group, elOption, axisModel, axisPointerModel) {
+        if (elOption.label) {
+            var labelEl = inner$9(group).labelEl = new Rect(
+                clone$4(elOption.label)
+            );
+
+            group.add(labelEl);
+            updateLabelShowHide(labelEl, axisPointerModel);
+        }
+    },
+
+    /**
+     * @protected
+     */
+    updatePointerEl: function (group, elOption, updateProps$$1) {
+        var pointerEl = inner$9(group).pointerEl;
+        if (pointerEl) {
+            pointerEl.setStyle(elOption.pointer.style);
+            updateProps$$1(pointerEl, {shape: elOption.pointer.shape});
+        }
+    },
+
+    /**
+     * @protected
+     */
+    updateLabelEl: function (group, elOption, updateProps$$1, axisPointerModel) {
+        var labelEl = inner$9(group).labelEl;
+        if (labelEl) {
+            labelEl.setStyle(elOption.label.style);
+            updateProps$$1(labelEl, {
+                // Consider text length change in vertical axis, animation should
+                // be used on shape, otherwise the effect will be weird.
+                shape: elOption.label.shape,
+                position: elOption.label.position
+            });
+
+            updateLabelShowHide(labelEl, axisPointerModel);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _renderHandle: function (value) {
+        if (this._dragging || !this.updateHandleTransform) {
+            return;
+        }
+
+        var axisPointerModel = this._axisPointerModel;
+        var zr = this._api.getZr();
+        var handle = this._handle;
+        var handleModel = axisPointerModel.getModel('handle');
+
+        var status = axisPointerModel.get('status');
+        if (!handleModel.get('show') || !status || status === 'hide') {
+            handle && zr.remove(handle);
+            this._handle = null;
+            return;
+        }
+
+        var isInit;
+        if (!this._handle) {
+            isInit = true;
+            handle = this._handle = createIcon(
+                handleModel.get('icon'),
+                {
+                    cursor: 'move',
+                    draggable: true,
+                    onmousemove: function (e) {
+                        // Fot mobile devicem, prevent screen slider on the button.
+                        stop(e.event);
+                    },
+                    onmousedown: bind$2(this._onHandleDragMove, this, 0, 0),
+                    drift: bind$2(this._onHandleDragMove, this),
+                    ondragend: bind$2(this._onHandleDragEnd, this)
+                }
+            );
+            zr.add(handle);
+        }
+
+        updateMandatoryProps(handle, axisPointerModel, false);
+
+        // update style
+        var includeStyles = [
+            'color', 'borderColor', 'borderWidth', 'opacity',
+            'shadowColor', 'shadowBlur', 'shadowOffsetX', 'shadowOffsetY'
+        ];
+        handle.setStyle(handleModel.getItemStyle(null, includeStyles));
+
+        // update position
+        var handleSize = handleModel.get('size');
+        if (!isArray(handleSize)) {
+            handleSize = [handleSize, handleSize];
+        }
+        handle.attr('scale', [handleSize[0] / 2, handleSize[1] / 2]);
+
+        createOrUpdate(
+            this,
+            '_doDispatchAxisPointer',
+            handleModel.get('throttle') || 0,
+            'fixRate'
+        );
+
+        this._moveHandleToValue(value, isInit);
+    },
+
+    /**
+     * @private
+     */
+    _moveHandleToValue: function (value, isInit) {
+        updateProps$1(
+            this._axisPointerModel,
+            !isInit && this._moveAnimation,
+            this._handle,
+            getHandleTransProps(this.getHandleTransform(
+                value, this._axisModel, this._axisPointerModel
+            ))
+        );
+    },
+
+    /**
+     * @private
+     */
+    _onHandleDragMove: function (dx, dy) {
+        var handle = this._handle;
+        if (!handle) {
+            return;
+        }
+
+        this._dragging = true;
+
+        // Persistent for throttle.
+        var trans = this.updateHandleTransform(
+            getHandleTransProps(handle),
+            [dx, dy],
+            this._axisModel,
+            this._axisPointerModel
+        );
+        this._payloadInfo = trans;
+
+        handle.stopAnimation();
+        handle.attr(getHandleTransProps(trans));
+        inner$9(handle).lastProp = null;
+
+        this._doDispatchAxisPointer();
+    },
+
+    /**
+     * Throttled method.
+     * @private
+     */
+    _doDispatchAxisPointer: function () {
+        var handle = this._handle;
+        if (!handle) {
+            return;
+        }
+
+        var payloadInfo = this._payloadInfo;
+        var axisModel = this._axisModel;
+        this._api.dispatchAction({
+            type: 'updateAxisPointer',
+            x: payloadInfo.cursorPoint[0],
+            y: payloadInfo.cursorPoint[1],
+            tooltipOption: payloadInfo.tooltipOption,
+            axesInfo: [{
+                axisDim: axisModel.axis.dim,
+                axisIndex: axisModel.componentIndex
+            }]
+        });
+    },
+
+    /**
+     * @private
+     */
+    _onHandleDragEnd: function (moveAnimation) {
+        this._dragging = false;
+        var handle = this._handle;
+        if (!handle) {
+            return;
+        }
+
+        var value = this._axisPointerModel.get('value');
+        // Consider snap or categroy axis, handle may be not consistent with
+        // axisPointer. So move handle to align the exact value position when
+        // drag ended.
+        this._moveHandleToValue(value);
+
+        // For the effect: tooltip will be shown when finger holding on handle
+        // button, and will be hidden after finger left handle button.
+        this._api.dispatchAction({
+            type: 'hideTip'
+        });
+    },
+
+    /**
+     * Should be implemenented by sub-class if support `handle`.
+     * @protected
+     * @param {number} value
+     * @param {module:echarts/model/Model} axisModel
+     * @param {module:echarts/model/Model} axisPointerModel
+     * @return {Object} {position: [x, y], rotation: 0}
+     */
+    getHandleTransform: null,
+
+    /**
+     * * Should be implemenented by sub-class if support `handle`.
+     * @protected
+     * @param {Object} transform {position, rotation}
+     * @param {Array.<number>} delta [dx, dy]
+     * @param {module:echarts/model/Model} axisModel
+     * @param {module:echarts/model/Model} axisPointerModel
+     * @return {Object} {position: [x, y], rotation: 0, cursorPoint: [x, y]}
+     */
+    updateHandleTransform: null,
+
+    /**
+     * @private
+     */
+    clear: function (api) {
+        this._lastValue = null;
+        this._lastStatus = null;
+
+        var zr = api.getZr();
+        var group = this._group;
+        var handle = this._handle;
+        if (zr && group) {
+            this._lastGraphicKey = null;
+            group && zr.remove(group);
+            handle && zr.remove(handle);
+            this._group = null;
+            this._handle = null;
+            this._payloadInfo = null;
+        }
+    },
+
+    /**
+     * @protected
+     */
+    doClear: function () {
+        // Implemented by sub-class if necessary.
+    },
+
+    /**
+     * @protected
+     * @param {Array.<number>} xy
+     * @param {Array.<number>} wh
+     * @param {number} [xDimIndex=0] or 1
+     */
+    buildLabel: function (xy, wh, xDimIndex) {
+        xDimIndex = xDimIndex || 0;
+        return {
+            x: xy[xDimIndex],
+            y: xy[1 - xDimIndex],
+            width: wh[xDimIndex],
+            height: wh[1 - xDimIndex]
+        };
+    }
+};
+
+BaseAxisPointer.prototype.constructor = BaseAxisPointer;
+
+
+function updateProps$1(animationModel, moveAnimation, el, props) {
+    // Animation optimize.
+    if (!propsEqual(inner$9(el).lastProp, props)) {
+        inner$9(el).lastProp = props;
+        moveAnimation
+            ? updateProps(el, props, animationModel)
+            : (el.stopAnimation(), el.attr(props));
+    }
+}
+
+function propsEqual(lastProps, newProps) {
+    if (isObject$1(lastProps) && isObject$1(newProps)) {
+        var equals = true;
+        each$1(newProps, function (item, key) {
+            equals = equals && propsEqual(lastProps[key], item);
+        });
+        return !!equals;
+    }
+    else {
+        return lastProps === newProps;
+    }
+}
+
+function updateLabelShowHide(labelEl, axisPointerModel) {
+    labelEl[axisPointerModel.get('label.show') ? 'show' : 'hide']();
+}
+
+function getHandleTransProps(trans) {
+    return {
+        position: trans.position.slice(),
+        rotation: trans.rotation || 0
+    };
+}
+
+function updateMandatoryProps(group, axisPointerModel, silent) {
+    var z = axisPointerModel.get('z');
+    var zlevel = axisPointerModel.get('zlevel');
+
+    group && group.traverse(function (el) {
+        if (el.type !== 'group') {
+            z != null && (el.z = z);
+            zlevel != null && (el.zlevel = zlevel);
+            el.silent = silent;
+        }
+    });
+}
+
+enableClassExtend(BaseAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/model/Model} axisPointerModel
+ */
+function buildElStyle(axisPointerModel) {
+    var axisPointerType = axisPointerModel.get('type');
+    var styleModel = axisPointerModel.getModel(axisPointerType + 'Style');
+    var style;
+    if (axisPointerType === 'line') {
+        style = styleModel.getLineStyle();
+        style.fill = null;
+    }
+    else if (axisPointerType === 'shadow') {
+        style = styleModel.getAreaStyle();
+        style.stroke = null;
+    }
+    return style;
+}
+
+/**
+ * @param {Function} labelPos {align, verticalAlign, position}
+ */
+function buildLabelElOption(
+    elOption, axisModel, axisPointerModel, api, labelPos
+) {
+    var value = axisPointerModel.get('value');
+    var text = getValueLabel(
+        value, axisModel.axis, axisModel.ecModel,
+        axisPointerModel.get('seriesDataIndices'),
+        {
+            precision: axisPointerModel.get('label.precision'),
+            formatter: axisPointerModel.get('label.formatter')
+        }
+    );
+    var labelModel = axisPointerModel.getModel('label');
+    var paddings = normalizeCssArray$1(labelModel.get('padding') || 0);
+
+    var font = labelModel.getFont();
+    var textRect = getBoundingRect(text, font);
+
+    var position = labelPos.position;
+    var width = textRect.width + paddings[1] + paddings[3];
+    var height = textRect.height + paddings[0] + paddings[2];
+
+    // Adjust by align.
+    var align = labelPos.align;
+    align === 'right' && (position[0] -= width);
+    align === 'center' && (position[0] -= width / 2);
+    var verticalAlign = labelPos.verticalAlign;
+    verticalAlign === 'bottom' && (position[1] -= height);
+    verticalAlign === 'middle' && (position[1] -= height / 2);
+
+    // Not overflow ec container
+    confineInContainer(position, width, height, api);
+
+    var bgColor = labelModel.get('backgroundColor');
+    if (!bgColor || bgColor === 'auto') {
+        bgColor = axisModel.get('axisLine.lineStyle.color');
+    }
+
+    elOption.label = {
+        shape: {x: 0, y: 0, width: width, height: height, r: labelModel.get('borderRadius')},
+        position: position.slice(),
+        // TODO: rich
+        style: {
+            text: text,
+            textFont: font,
+            textFill: labelModel.getTextColor(),
+            textPosition: 'inside',
+            fill: bgColor,
+            stroke: labelModel.get('borderColor') || 'transparent',
+            lineWidth: labelModel.get('borderWidth') || 0,
+            shadowBlur: labelModel.get('shadowBlur'),
+            shadowColor: labelModel.get('shadowColor'),
+            shadowOffsetX: labelModel.get('shadowOffsetX'),
+            shadowOffsetY: labelModel.get('shadowOffsetY')
+        },
+        // Lable should be over axisPointer.
+        z2: 10
+    };
+}
+
+// Do not overflow ec container
+function confineInContainer(position, width, height, api) {
+    var viewWidth = api.getWidth();
+    var viewHeight = api.getHeight();
+    position[0] = Math.min(position[0] + width, viewWidth) - width;
+    position[1] = Math.min(position[1] + height, viewHeight) - height;
+    position[0] = Math.max(position[0], 0);
+    position[1] = Math.max(position[1], 0);
+}
+
+/**
+ * @param {number} value
+ * @param {module:echarts/coord/Axis} axis
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} opt
+ * @param {Array.<Object>} seriesDataIndices
+ * @param {number|string} opt.precision 'auto' or a number
+ * @param {string|Function} opt.formatter label formatter
+ */
+function getValueLabel(value, axis, ecModel, seriesDataIndices, opt) {
+    value = axis.scale.parse(value);
+    var text = axis.scale.getLabel(
+        // If `precision` is set, width can be fixed (like '12.00500'), which
+        // helps to debounce when when moving label.
+        value, {precision: opt.precision}
+    );
+    var formatter = opt.formatter;
+
+    if (formatter) {
+        var params = {
+            value: getAxisRawValue(axis, value),
+            seriesData: []
+        };
+        each$1(seriesDataIndices, function (idxItem) {
+            var series = ecModel.getSeriesByIndex(idxItem.seriesIndex);
+            var dataIndex = idxItem.dataIndexInside;
+            var dataParams = series && series.getDataParams(dataIndex);
+            dataParams && params.seriesData.push(dataParams);
+        });
+
+        if (isString(formatter)) {
+            text = formatter.replace('{value}', text);
+        }
+        else if (isFunction$1(formatter)) {
+            text = formatter(params);
+        }
+    }
+
+    return text;
+}
+
+/**
+ * @param {module:echarts/coord/Axis} axis
+ * @param {number} value
+ * @param {Object} layoutInfo {
+ *  rotation, position, labelOffset, labelDirection, labelMargin
+ * }
+ */
+function getTransformedPosition (axis, value, layoutInfo) {
+    var transform = create$1();
+    rotate(transform, transform, layoutInfo.rotation);
+    translate(transform, transform, layoutInfo.position);
+
+    return applyTransform$1([
+        axis.dataToCoord(value),
+        (layoutInfo.labelOffset || 0)
+            + (layoutInfo.labelDirection || 1) * (layoutInfo.labelMargin || 0)
+    ], transform);
+}
+
+function buildCartesianSingleLabelElOption(
+    value, elOption, layoutInfo, axisModel, axisPointerModel, api
+) {
+    var textLayout = AxisBuilder.innerTextLayout(
+        layoutInfo.rotation, 0, layoutInfo.labelDirection
+    );
+    layoutInfo.labelMargin = axisPointerModel.get('label.margin');
+    buildLabelElOption(elOption, axisModel, axisPointerModel, api, {
+        position: getTransformedPosition(axisModel.axis, value, layoutInfo),
+        align: textLayout.textAlign,
+        verticalAlign: textLayout.textVerticalAlign
+    });
+}
+
+/**
+ * @param {Array.<number>} p1
+ * @param {Array.<number>} p2
+ * @param {number} [xDimIndex=0] or 1
+ */
+function makeLineShape(p1, p2, xDimIndex) {
+    xDimIndex = xDimIndex || 0;
+    return {
+        x1: p1[xDimIndex],
+        y1: p1[1 - xDimIndex],
+        x2: p2[xDimIndex],
+        y2: p2[1 - xDimIndex]
+    };
+}
+
+/**
+ * @param {Array.<number>} xy
+ * @param {Array.<number>} wh
+ * @param {number} [xDimIndex=0] or 1
+ */
+function makeRectShape(xy, wh, xDimIndex) {
+    xDimIndex = xDimIndex || 0;
+    return {
+        x: xy[xDimIndex],
+        y: xy[1 - xDimIndex],
+        width: wh[xDimIndex],
+        height: wh[1 - xDimIndex]
+    };
+}
+
+function makeSectorShape(cx, cy, r0, r, startAngle, endAngle) {
+    return {
+        cx: cx,
+        cy: cy,
+        r0: r0,
+        r: r,
+        startAngle: startAngle,
+        endAngle: endAngle,
+        clockwise: true
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CartesianAxisPointer = BaseAxisPointer.extend({
+
+    /**
+     * @override
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        var axis = axisModel.axis;
+        var grid = axis.grid;
+        var axisPointerType = axisPointerModel.get('type');
+        var otherExtent = getCartesian(grid, axis).getOtherAxis(axis).getGlobalExtent();
+        var pixelValue = axis.toGlobalCoord(axis.dataToCoord(value, true));
+
+        if (axisPointerType && axisPointerType !== 'none') {
+            var elStyle = buildElStyle(axisPointerModel);
+            var pointerOption = pointerShapeBuilder[axisPointerType](
+                axis, pixelValue, otherExtent, elStyle
+            );
+            pointerOption.style = elStyle;
+            elOption.graphicKey = pointerOption.type;
+            elOption.pointer = pointerOption;
+        }
+
+        var layoutInfo = layout$1(grid.model, axisModel);
+        buildCartesianSingleLabelElOption(
+            value, elOption, layoutInfo, axisModel, axisPointerModel, api
+        );
+    },
+
+    /**
+     * @override
+     */
+    getHandleTransform: function (value, axisModel, axisPointerModel) {
+        var layoutInfo = layout$1(axisModel.axis.grid.model, axisModel, {
+            labelInside: false
+        });
+        layoutInfo.labelMargin = axisPointerModel.get('handle.margin');
+        return {
+            position: getTransformedPosition(axisModel.axis, value, layoutInfo),
+            rotation: layoutInfo.rotation + (layoutInfo.labelDirection < 0 ? Math.PI : 0)
+        };
+    },
+
+    /**
+     * @override
+     */
+    updateHandleTransform: function (transform, delta, axisModel, axisPointerModel) {
+        var axis = axisModel.axis;
+        var grid = axis.grid;
+        var axisExtent = axis.getGlobalExtent(true);
+        var otherExtent = getCartesian(grid, axis).getOtherAxis(axis).getGlobalExtent();
+        var dimIndex = axis.dim === 'x' ? 0 : 1;
+
+        var currPosition = transform.position;
+        currPosition[dimIndex] += delta[dimIndex];
+        currPosition[dimIndex] = Math.min(axisExtent[1], currPosition[dimIndex]);
+        currPosition[dimIndex] = Math.max(axisExtent[0], currPosition[dimIndex]);
+
+        var cursorOtherValue = (otherExtent[1] + otherExtent[0]) / 2;
+        var cursorPoint = [cursorOtherValue, cursorOtherValue];
+        cursorPoint[dimIndex] = currPosition[dimIndex];
+
+        // Make tooltip do not overlap axisPointer and in the middle of the grid.
+        var tooltipOptions = [{verticalAlign: 'middle'}, {align: 'center'}];
+
+        return {
+            position: currPosition,
+            rotation: transform.rotation,
+            cursorPoint: cursorPoint,
+            tooltipOption: tooltipOptions[dimIndex]
+        };
+    }
+
+});
+
+function getCartesian(grid, axis) {
+    var opt = {};
+    opt[axis.dim + 'AxisIndex'] = axis.index;
+    return grid.getCartesian(opt);
+}
+
+var pointerShapeBuilder = {
+
+    line: function (axis, pixelValue, otherExtent, elStyle) {
+        var targetShape = makeLineShape(
+            [pixelValue, otherExtent[0]],
+            [pixelValue, otherExtent[1]],
+            getAxisDimIndex(axis)
+        );
+        subPixelOptimizeLine({
+            shape: targetShape,
+            style: elStyle
+        });
+        return {
+            type: 'Line',
+            shape: targetShape
+        };
+    },
+
+    shadow: function (axis, pixelValue, otherExtent, elStyle) {
+        var bandWidth = Math.max(1, axis.getBandWidth());
+        var span = otherExtent[1] - otherExtent[0];
+        return {
+            type: 'Rect',
+            shape: makeRectShape(
+                [pixelValue - bandWidth / 2, otherExtent[0]],
+                [bandWidth, span],
+                getAxisDimIndex(axis)
+            )
+        };
+    }
+};
+
+function getAxisDimIndex(axis) {
+    return axis.dim === 'x' ? 0 : 1;
+}
+
+AxisView.registerAxisPointerClass('CartesianAxisPointer', CartesianAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// CartesianAxisPointer is not supposed to be required here. But consider
+// echarts.simple.js and online build tooltip, which only require gridSimple,
+// CartesianAxisPointer should be able to required somewhere.
+registerPreprocessor(function (option) {
+    // Always has a global axisPointerModel for default setting.
+    if (option) {
+        (!option.axisPointer || option.axisPointer.length === 0)
+            && (option.axisPointer = {});
+
+        var link = option.axisPointer.link;
+        // Normalize to array to avoid object mergin. But if link
+        // is not set, remain null/undefined, otherwise it will
+        // override existent link setting.
+        if (link && !isArray(link)) {
+            option.axisPointer.link = [link];
+        }
+    }
+});
+
+// This process should proformed after coordinate systems created
+// and series data processed. So put it on statistic processing stage.
+registerProcessor(PRIORITY.PROCESSOR.STATISTIC, function (ecModel, api) {
+    // Build axisPointerModel, mergin tooltip.axisPointer model for each axis.
+    // allAxesInfo should be updated when setOption performed.
+    ecModel.getComponent('axisPointer').coordSysAxesInfo
+        = collect(ecModel, api);
+});
+
+// Broadcast to all views.
+registerAction({
+    type: 'updateAxisPointer',
+    event: 'updateAxisPointer',
+    update: ':updateAxisPointer'
+}, axisTrigger);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var XY = ['x', 'y'];
+var WH = ['width', 'height'];
+
+var SingleAxisPointer = BaseAxisPointer.extend({
+
+    /**
+     * @override
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        var axis = axisModel.axis;
+        var coordSys = axis.coordinateSystem;
+        var otherExtent = getGlobalExtent(coordSys, 1 - getPointDimIndex(axis));
+        var pixelValue = coordSys.dataToPoint(value)[0];
+
+        var axisPointerType = axisPointerModel.get('type');
+        if (axisPointerType && axisPointerType !== 'none') {
+            var elStyle = buildElStyle(axisPointerModel);
+            var pointerOption = pointerShapeBuilder$1[axisPointerType](
+                axis, pixelValue, otherExtent, elStyle
+            );
+            pointerOption.style = elStyle;
+
+            elOption.graphicKey = pointerOption.type;
+            elOption.pointer = pointerOption;
+        }
+
+        var layoutInfo = layout$2(axisModel);
+        buildCartesianSingleLabelElOption(
+            value, elOption, layoutInfo, axisModel, axisPointerModel, api
+        );
+    },
+
+    /**
+     * @override
+     */
+    getHandleTransform: function (value, axisModel, axisPointerModel) {
+        var layoutInfo = layout$2(axisModel, {labelInside: false});
+        layoutInfo.labelMargin = axisPointerModel.get('handle.margin');
+        return {
+            position: getTransformedPosition(axisModel.axis, value, layoutInfo),
+            rotation: layoutInfo.rotation + (layoutInfo.labelDirection < 0 ? Math.PI : 0)
+        };
+    },
+
+    /**
+     * @override
+     */
+    updateHandleTransform: function (transform, delta, axisModel, axisPointerModel) {
+        var axis = axisModel.axis;
+        var coordSys = axis.coordinateSystem;
+        var dimIndex = getPointDimIndex(axis);
+        var axisExtent = getGlobalExtent(coordSys, dimIndex);
+        var currPosition = transform.position;
+        currPosition[dimIndex] += delta[dimIndex];
+        currPosition[dimIndex] = Math.min(axisExtent[1], currPosition[dimIndex]);
+        currPosition[dimIndex] = Math.max(axisExtent[0], currPosition[dimIndex]);
+        var otherExtent = getGlobalExtent(coordSys, 1 - dimIndex);
+        var cursorOtherValue = (otherExtent[1] + otherExtent[0]) / 2;
+        var cursorPoint = [cursorOtherValue, cursorOtherValue];
+        cursorPoint[dimIndex] = currPosition[dimIndex];
+
+        return {
+            position: currPosition,
+            rotation: transform.rotation,
+            cursorPoint: cursorPoint,
+            tooltipOption: {
+                verticalAlign: 'middle'
+            }
+        };
+    }
+});
+
+var pointerShapeBuilder$1 = {
+
+    line: function (axis, pixelValue, otherExtent, elStyle) {
+        var targetShape = makeLineShape(
+            [pixelValue, otherExtent[0]],
+            [pixelValue, otherExtent[1]],
+            getPointDimIndex(axis)
+        );
+        subPixelOptimizeLine({
+            shape: targetShape,
+            style: elStyle
+        });
+        return {
+            type: 'Line',
+            shape: targetShape
+        };
+    },
+
+    shadow: function (axis, pixelValue, otherExtent, elStyle) {
+        var bandWidth = axis.getBandWidth();
+        var span = otherExtent[1] - otherExtent[0];
+        return {
+            type: 'Rect',
+            shape: makeRectShape(
+                [pixelValue - bandWidth / 2, otherExtent[0]],
+                [bandWidth, span],
+                getPointDimIndex(axis)
+            )
+        };
+    }
+};
+
+function getPointDimIndex(axis) {
+    return axis.isHorizontal() ? 0 : 1;
+}
+
+function getGlobalExtent(coordSys, dimIndex) {
+    var rect = coordSys.getRect();
+    return [rect[XY[dimIndex]], rect[XY[dimIndex]] + rect[WH[dimIndex]]];
+}
+
+AxisView.registerAxisPointerClass('SingleAxisPointer', SingleAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+    type: 'single'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  Define the themeRiver view's series model
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var DATA_NAME_INDEX = 2;
+
+var ThemeRiverSeries = SeriesModel.extend({
+
+    type: 'series.themeRiver',
+
+    dependencies: ['singleAxis'],
+
+    /**
+     * @readOnly
+     * @type {module:zrender/core/util#HashMap}
+     */
+    nameMap: null,
+
+    /**
+     * @override
+     */
+    init: function (option) {
+        ThemeRiverSeries.superApply(this, 'init', arguments);
+
+        // Put this function here is for the sake of consistency of code style.
+        // Enable legend selection for each data item
+        // Use a function instead of direct access because data reference may changed
+        this.legendDataProvider = function () {
+            return this.getRawData();
+        };
+    },
+
+    /**
+     * If there is no value of a certain point in the time for some event,set it value to 0.
+     *
+     * @param {Array} data  initial data in the option
+     * @return {Array}
+     */
+    fixData: function (data) {
+        var rawDataLength = data.length;
+
+        // grouped data by name
+        var dataByName = nest()
+            .key(function (dataItem) {
+                return dataItem[2];
+            })
+            .entries(data);
+
+        // data group in each layer
+        var layData = map(dataByName, function (d) {
+            return {
+                name: d.key,
+                dataList: d.values
+            };
+        });
+
+        var layerNum = layData.length;
+        var largestLayer = -1;
+        var index = -1;
+        for (var i = 0; i < layerNum; ++i) {
+            var len = layData[i].dataList.length;
+            if (len > largestLayer) {
+                largestLayer = len;
+                index = i;
+            }
+        }
+
+        for (var k = 0; k < layerNum; ++k) {
+            if (k === index) {
+                continue;
+            }
+            var name = layData[k].name;
+            for (var j = 0; j < largestLayer; ++j) {
+                var timeValue = layData[index].dataList[j][0];
+                var length = layData[k].dataList.length;
+                var keyIndex = -1;
+                for (var l = 0; l < length; ++l) {
+                    var value = layData[k].dataList[l][0];
+                    if (value === timeValue) {
+                        keyIndex = l;
+                        break;
+                    }
+                }
+                if (keyIndex === -1) {
+                    data[rawDataLength] = [];
+                    data[rawDataLength][0] = timeValue;
+                    data[rawDataLength][1] = 0;
+                    data[rawDataLength][2] = name;
+                    rawDataLength++;
+
+                }
+            }
+        }
+        return data;
+    },
+
+    /**
+     * @override
+     * @param  {Object} option  the initial option that user gived
+     * @param  {module:echarts/model/Model} ecModel  the model object for themeRiver option
+     * @return {module:echarts/data/List}
+     */
+    getInitialData: function (option, ecModel) {
+
+        var singleAxisModel = ecModel.queryComponents({
+            mainType: 'singleAxis',
+            index: this.get('singleAxisIndex'),
+            id: this.get('singleAxisId')
+        })[0];
+
+        var axisType = singleAxisModel.get('type');
+
+        // filter the data item with the value of label is undefined
+        var filterData = filter(option.data, function (dataItem) {
+            return dataItem[2] !== undefined;
+        });
+
+        // ??? TODO design a stage to transfer data for themeRiver and lines?
+        var data = this.fixData(filterData || []);
+        var nameList = [];
+        var nameMap = this.nameMap = createHashMap();
+        var count = 0;
+
+        for (var i = 0; i < data.length; ++i) {
+            nameList.push(data[i][DATA_NAME_INDEX]);
+            if (!nameMap.get(data[i][DATA_NAME_INDEX])) {
+                nameMap.set(data[i][DATA_NAME_INDEX], count);
+                count++;
+            }
+        }
+
+        var dimensionsInfo = createDimensions(data, {
+            coordDimensions: ['single'],
+            dimensionsDefine: [
+                {
+                    name: 'time',
+                    type: getDimensionTypeByAxis(axisType)
+                },
+                {
+                    name: 'value',
+                    type: 'float'
+                },
+                {
+                    name: 'name',
+                    type: 'ordinal'
+                }
+            ],
+            encodeDefine: {
+                single: 0,
+                value: 1,
+                itemName: 2
+            }
+        });
+
+        var list = new List(dimensionsInfo, this);
+        list.initData(data);
+
+        return list;
+    },
+
+    /**
+     * The raw data is divided into multiple layers and each layer
+     *     has same name.
+     *
+     * @return {Array.<Array.<number>>}
+     */
+    getLayerSeries: function () {
+        var data = this.getData();
+        var lenCount = data.count();
+        var indexArr = [];
+
+        for (var i = 0; i < lenCount; ++i) {
+            indexArr[i] = i;
+        }
+        // data group by name
+        var dataByName = nest()
+            .key(function (index) {
+                return data.get('name', index);
+            })
+            .entries(indexArr);
+
+        var layerSeries = map(dataByName, function (d) {
+            return {
+                name: d.key,
+                indices: d.values
+            };
+        });
+
+        var timeDim = data.mapDimension('single');
+
+        for (var j = 0; j < layerSeries.length; ++j) {
+            layerSeries[j].indices.sort(comparer);
+        }
+
+        function comparer(index1, index2) {
+            return data.get(timeDim, index1) - data.get(timeDim, index2);
+        }
+
+        return layerSeries;
+    },
+
+    /**
+     * Get data indices for show tooltip content
+     *
+     * @param {Array.<string>|string} dim  single coordinate dimension
+     * @param {number} value axis value
+     * @param {module:echarts/coord/single/SingleAxis} baseAxis  single Axis used
+     *     the themeRiver.
+     * @return {Object} {dataIndices, nestestValue}
+     */
+    getAxisTooltipData: function (dim, value, baseAxis) {
+        if (!isArray(dim)) {
+            dim = dim ? [dim] : [];
+        }
+
+        var data = this.getData();
+        var layerSeries = this.getLayerSeries();
+        var indices = [];
+        var layerNum = layerSeries.length;
+        var nestestValue;
+
+        for (var i = 0; i < layerNum; ++i) {
+            var minDist = Number.MAX_VALUE;
+            var nearestIdx = -1;
+            var pointNum = layerSeries[i].indices.length;
+            for (var j = 0; j < pointNum; ++j) {
+                var theValue = data.get(dim[0], layerSeries[i].indices[j]);
+                var dist = Math.abs(theValue - value);
+                if (dist <= minDist) {
+                    nestestValue = theValue;
+                    minDist = dist;
+                    nearestIdx = layerSeries[i].indices[j];
+                }
+            }
+            indices.push(nearestIdx);
+        }
+
+        return {dataIndices: indices, nestestValue: nestestValue};
+    },
+
+    /**
+     * @override
+     * @param {number} dataIndex  index of data
+     */
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var htmlName = data.getName(dataIndex);
+        var htmlValue = data.get(data.mapDimension('value'), dataIndex);
+        if (isNaN(htmlValue) || htmlValue == null) {
+            htmlValue = '-';
+        }
+        return encodeHTML(htmlName + ' : ' + htmlValue);
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        coordinateSystem: 'singleAxis',
+
+        // gap in axis's orthogonal orientation
+        boundaryGap: ['10%', '10%'],
+
+        // legendHoverLink: true,
+
+        singleAxisIndex: 0,
+
+        animationEasing: 'linear',
+
+        label: {
+            margin: 4,
+            show: true,
+            position: 'left',
+            color: '#000',
+            fontSize: 11
+        },
+
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  The file used to draw themeRiver view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+extendChartView({
+
+    type: 'themeRiver',
+
+    init: function () {
+        this._layers = [];
+    },
+
+    render: function (seriesModel, ecModel, api) {
+        var data = seriesModel.getData();
+
+        var group = this.group;
+
+        var layerSeries = seriesModel.getLayerSeries();
+
+        var layoutInfo = data.getLayout('layoutInfo');
+        var rect = layoutInfo.rect;
+        var boundaryGap = layoutInfo.boundaryGap;
+
+        group.attr('position', [0, rect.y + boundaryGap[0]]);
+
+        function keyGetter(item) {
+            return item.name;
+        }
+        var dataDiffer = new DataDiffer(
+            this._layersSeries || [], layerSeries,
+            keyGetter, keyGetter
+        );
+
+        var newLayersGroups = {};
+
+        dataDiffer
+            .add(bind(process, this, 'add'))
+            .update(bind(process, this, 'update'))
+            .remove(bind(process, this, 'remove'))
+            .execute();
+
+        function process(status, idx, oldIdx) {
+            var oldLayersGroups = this._layers;
+            if (status === 'remove') {
+                group.remove(oldLayersGroups[idx]);
+                return;
+            }
+            var points0 = [];
+            var points1 = [];
+            var color;
+            var indices = layerSeries[idx].indices;
+            for (var j = 0; j < indices.length; j++) {
+                var layout = data.getItemLayout(indices[j]);
+                var x = layout.x;
+                var y0 = layout.y0;
+                var y = layout.y;
+
+                points0.push([x, y0]);
+                points1.push([x, y0 + y]);
+
+                color = data.getItemVisual(indices[j], 'color');
+            }
+
+            var polygon;
+            var text;
+            var textLayout = data.getItemLayout(indices[0]);
+            var itemModel = data.getItemModel(indices[j - 1]);
+            var labelModel = itemModel.getModel('label');
+            var margin = labelModel.get('margin');
+            if (status === 'add') {
+                var layerGroup = newLayersGroups[idx] = new Group();
+                polygon = new Polygon$1({
+                    shape: {
+                        points: points0,
+                        stackedOnPoints: points1,
+                        smooth: 0.4,
+                        stackedOnSmooth: 0.4,
+                        smoothConstraint: false
+                    },
+                    z2: 0
+                });
+                text = new Text({
+                    style: {
+                        x: textLayout.x - margin,
+                        y: textLayout.y0 + textLayout.y / 2
+                    }
+                });
+                layerGroup.add(polygon);
+                layerGroup.add(text);
+                group.add(layerGroup);
+
+                polygon.setClipPath(createGridClipShape$3(polygon.getBoundingRect(), seriesModel, function () {
+                    polygon.removeClipPath();
+                }));
+            }
+            else {
+                var layerGroup = oldLayersGroups[oldIdx];
+                polygon = layerGroup.childAt(0);
+                text = layerGroup.childAt(1);
+                group.add(layerGroup);
+
+                newLayersGroups[idx] = layerGroup;
+
+                updateProps(polygon, {
+                    shape: {
+                        points: points0,
+                        stackedOnPoints: points1
+                    }
+                }, seriesModel);
+
+                updateProps(text, {
+                    style: {
+                        x: textLayout.x - margin,
+                        y: textLayout.y0 + textLayout.y / 2
+                    }
+                }, seriesModel);
+            }
+
+            var hoverItemStyleModel = itemModel.getModel('emphasis.itemStyle');
+            var itemStyleModel = itemModel.getModel('itemStyle');
+
+            setTextStyle(text.style, labelModel, {
+                text: labelModel.get('show')
+                    ? seriesModel.getFormattedLabel(indices[j - 1], 'normal')
+                        || data.getName(indices[j - 1])
+                    : null,
+                textVerticalAlign: 'middle'
+            });
+
+            polygon.setStyle(extend({
+                fill: color
+            }, itemStyleModel.getItemStyle(['color'])));
+
+            setHoverStyle(polygon, hoverItemStyleModel.getItemStyle());
+        }
+
+        this._layersSeries = layerSeries;
+        this._layers = newLayersGroups;
+    },
+
+    dispose: function () {}
+});
+
+// add animation to the view
+function createGridClipShape$3(rect, seriesModel, cb) {
+    var rectEl = new Rect({
+        shape: {
+            x: rect.x - 10,
+            y: rect.y - 10,
+            width: 0,
+            height: rect.height + 20
+        }
+    });
+    initProps(rectEl, {
+        shape: {
+            width: rect.width + 20,
+            height: rect.height + 20
+        }
+    }, seriesModel, cb);
+
+    return rectEl;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file  Using layout algorithm transform the raw data to layout information.
+ * @author Deqing Li(annong035@gmail.com)
+ */
+
+var themeRiverLayout = function (ecModel, api) {
+
+    ecModel.eachSeriesByType('themeRiver', function (seriesModel) {
+
+        var data = seriesModel.getData();
+
+        var single = seriesModel.coordinateSystem;
+
+        var layoutInfo = {};
+
+        // use the axis boundingRect for view
+        var rect = single.getRect();
+
+        layoutInfo.rect = rect;
+
+        var boundaryGap = seriesModel.get('boundaryGap');
+
+        var axis = single.getAxis();
+
+        layoutInfo.boundaryGap = boundaryGap;
+
+        if (axis.orient === 'horizontal') {
+            boundaryGap[0] = parsePercent$1(boundaryGap[0], rect.height);
+            boundaryGap[1] = parsePercent$1(boundaryGap[1], rect.height);
+            var height = rect.height - boundaryGap[0] - boundaryGap[1];
+            themeRiverLayout$1(data, seriesModel, height);
+        }
+        else {
+            boundaryGap[0] = parsePercent$1(boundaryGap[0], rect.width);
+            boundaryGap[1] = parsePercent$1(boundaryGap[1], rect.width);
+            var width = rect.width - boundaryGap[0] - boundaryGap[1];
+            themeRiverLayout$1(data, seriesModel, width);
+        }
+
+        data.setLayout('layoutInfo', layoutInfo);
+    });
+};
+
+/**
+ * The layout information about themeriver
+ *
+ * @param {module:echarts/data/List} data  data in the series
+ * @param {module:echarts/model/Series} seriesModel  the model object of themeRiver series
+ * @param {number} height  value used to compute every series height
+ */
+function themeRiverLayout$1(data, seriesModel, height) {
+    if (!data.count()) {
+        return;
+    }
+    var coordSys = seriesModel.coordinateSystem;
+    // the data in each layer are organized into a series.
+    var layerSeries = seriesModel.getLayerSeries();
+
+    // the points in each layer.
+    var timeDim = data.mapDimension('single');
+    var valueDim = data.mapDimension('value');
+    var layerPoints = map(layerSeries, function (singleLayer) {
+        return map(singleLayer.indices, function (idx) {
+            var pt = coordSys.dataToPoint(data.get(timeDim, idx));
+            pt[1] = data.get(valueDim, idx);
+            return pt;
+        });
+    });
+
+    var base = computeBaseline(layerPoints);
+    var baseLine = base.y0;
+    var ky = height / base.max;
+
+    // set layout information for each item.
+    var n = layerSeries.length;
+    var m = layerSeries[0].indices.length;
+    var baseY0;
+    for (var j = 0; j < m; ++j) {
+        baseY0 = baseLine[j] * ky;
+        data.setItemLayout(layerSeries[0].indices[j], {
+            layerIndex: 0,
+            x: layerPoints[0][j][0],
+            y0: baseY0,
+            y: layerPoints[0][j][1] * ky
+        });
+        for (var i = 1; i < n; ++i) {
+            baseY0 += layerPoints[i - 1][j][1] * ky;
+            data.setItemLayout(layerSeries[i].indices[j], {
+                layerIndex: i,
+                x: layerPoints[i][j][0],
+                y0: baseY0,
+                y: layerPoints[i][j][1] * ky
+            });
+        }
+    }
+}
+
+/**
+ * Compute the baseLine of the rawdata
+ * Inspired by Lee Byron's paper Stacked Graphs - Geometry & Aesthetics
+ *
+ * @param  {Array.<Array>} data  the points in each layer
+ * @return {Object}
+ */
+function computeBaseline(data) {
+    var layerNum = data.length;
+    var pointNum = data[0].length;
+    var sums = [];
+    var y0 = [];
+    var max = 0;
+    var temp;
+    var base = {};
+
+    for (var i = 0; i < pointNum; ++i) {
+        for (var j = 0, temp = 0; j < layerNum; ++j) {
+            temp += data[j][i][1];
+        }
+        if (temp > max) {
+            max = temp;
+        }
+        sums.push(temp);
+    }
+
+    for (var k = 0; k < pointNum; ++k) {
+        y0[k] = (max - sums[k]) / 2;
+    }
+    max = 0;
+
+    for (var l = 0; l < pointNum; ++l) {
+        var sum = sums[l] + y0[l];
+        if (sum > max) {
+            max = sum;
+        }
+    }
+    base.y0 = y0;
+    base.max = max;
+
+    return base;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual encoding for themeRiver view
+ * @author  Deqing Li(annong035@gmail.com)
+ */
+
+var themeRiverVisual = function (ecModel) {
+    ecModel.eachSeriesByType('themeRiver', function (seriesModel) {
+        var data = seriesModel.getData();
+        var rawData = seriesModel.getRawData();
+        var colorList = seriesModel.get('color');
+        var idxMap = createHashMap();
+
+        data.each(function (idx) {
+            idxMap.set(data.getRawIndex(idx), idx);
+        });
+
+        rawData.each(function (rawIndex) {
+            var name = rawData.getName(rawIndex);
+            var color = colorList[(seriesModel.nameMap.get(name) - 1) % colorList.length];
+
+            rawData.setItemVisual(rawIndex, 'color', color);
+
+            var idx = idxMap.get(rawIndex);
+
+            if (idx != null) {
+                data.setItemVisual(idx, 'color', color);
+            }
+        });
+    });
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerLayout(themeRiverLayout);
+registerVisual(themeRiverVisual);
+registerProcessor(dataFilter('themeRiver'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+SeriesModel.extend({
+
+    type: 'series.sunburst',
+
+    /**
+     * @type {module:echarts/data/Tree~Node}
+     */
+    _viewRoot: null,
+
+    getInitialData: function (option, ecModel) {
+        // Create a virtual root.
+        var root = { name: option.name, children: option.data };
+
+        completeTreeValue$1(root);
+
+        var levels = option.levels || [];
+
+        // levels = option.levels = setDefault(levels, ecModel);
+
+        var treeOption = {};
+
+        treeOption.levels = levels;
+
+        // Make sure always a new tree is created when setOption,
+        // in TreemapView, we check whether oldTree === newTree
+        // to choose mappings approach among old shapes and new shapes.
+        return Tree.createTree(root, this, treeOption).data;
+    },
+
+    optionUpdated: function () {
+        this.resetViewRoot();
+    },
+
+    /*
+     * @override
+     */
+    getDataParams: function (dataIndex) {
+        var params = SeriesModel.prototype.getDataParams.apply(this, arguments);
+
+        var node = this.getData().tree.getNodeByDataIndex(dataIndex);
+        params.treePathInfo = wrapTreePathInfo(node, this);
+
+        return params;
+    },
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+
+        // 默认全局居中
+        center: ['50%', '50%'],
+        radius: [0, '75%'],
+        // 默认顺时针
+        clockwise: true,
+        startAngle: 90,
+        // 最小角度改为0
+        minAngle: 0,
+
+        percentPrecision: 2,
+
+        // If still show when all data zero.
+        stillShowZeroSum: true,
+
+        // Policy of highlighting pieces when hover on one
+        // Valid values: 'none' (for not downplay others), 'descendant',
+        // 'ancestor', 'self'
+        highlightPolicy: 'descendant',
+
+        // 'rootToNode', 'link', or false
+        nodeClick: 'rootToNode',
+
+        renderLabelForZeroData: false,
+
+        label: {
+            // could be: 'radial', 'tangential', or 'none'
+            rotate: 'radial',
+            show: true,
+            opacity: 1,
+            // 'left' is for inner side of inside, and 'right' is for outter
+            // side for inside
+            align: 'center',
+            position: 'inside',
+            distance: 5,
+            silent: true,
+            emphasis: {}
+        },
+        itemStyle: {
+            borderWidth: 1,
+            borderColor: 'white',
+            opacity: 1,
+            emphasis: {},
+            highlight: {
+                opacity: 1
+            },
+            downplay: {
+                opacity: 0.9
+            }
+        },
+
+        // Animation type canbe expansion, scale
+        animationType: 'expansion',
+        animationDuration: 1000,
+        animationDurationUpdate: 500,
+        animationEasing: 'cubicOut',
+
+        data: [],
+
+        levels: [],
+
+        /**
+         * Sort order.
+         *
+         * Valid values: 'desc', 'asc', null, or callback function.
+         * 'desc' and 'asc' for descend and ascendant order;
+         * null for not sorting;
+         * example of callback function:
+         * function(nodeA, nodeB) {
+         *     return nodeA.getValue() - nodeB.getValue();
+         * }
+         */
+        sort: 'desc'
+    },
+
+    getViewRoot: function () {
+        return this._viewRoot;
+    },
+
+    /**
+     * @param {module:echarts/data/Tree~Node} [viewRoot]
+     */
+    resetViewRoot: function (viewRoot) {
+        viewRoot
+            ? (this._viewRoot = viewRoot)
+            : (viewRoot = this._viewRoot);
+
+        var root = this.getRawData().tree.root;
+
+        if (!viewRoot
+            || (viewRoot !== root && !root.contains(viewRoot))
+        ) {
+            this._viewRoot = root;
+        }
+    }
+});
+
+
+
+/**
+ * @param {Object} dataNode
+ */
+function completeTreeValue$1(dataNode) {
+    // Postorder travel tree.
+    // If value of none-leaf node is not set,
+    // calculate it by suming up the value of all children.
+    var sum = 0;
+
+    each$1(dataNode.children, function (child) {
+
+        completeTreeValue$1(child);
+
+        var childValue = child.value;
+        isArray(childValue) && (childValue = childValue[0]);
+
+        sum += childValue;
+    });
+
+    var thisValue = dataNode.value;
+    if (isArray(thisValue)) {
+        thisValue = thisValue[0];
+    }
+
+    if (thisValue == null || isNaN(thisValue)) {
+        thisValue = sum;
+    }
+    // Value should not less than 0.
+    if (thisValue < 0) {
+        thisValue = 0;
+    }
+
+    isArray(dataNode.value)
+        ? (dataNode.value[0] = thisValue)
+        : (dataNode.value = thisValue);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var NodeHighlightPolicy = {
+    NONE: 'none', // not downplay others
+    DESCENDANT: 'descendant',
+    ANCESTOR: 'ancestor',
+    SELF: 'self'
+};
+
+var DEFAULT_SECTOR_Z = 2;
+var DEFAULT_TEXT_Z = 4;
+
+/**
+ * Sunburstce of Sunburst including Sector, Label, LabelLine
+ * @constructor
+ * @extends {module:zrender/graphic/Group}
+ */
+function SunburstPiece(node, seriesModel, ecModel) {
+
+    Group.call(this);
+
+    var sector = new Sector({
+        z2: DEFAULT_SECTOR_Z
+    });
+    sector.seriesIndex = seriesModel.seriesIndex;
+
+    var text = new Text({
+        z2: DEFAULT_TEXT_Z,
+        silent: node.getModel('label').get('silent')
+    });
+    this.add(sector);
+    this.add(text);
+
+    this.updateData(true, node, 'normal', seriesModel, ecModel);
+
+    // Hover to change label and labelLine
+    function onEmphasis() {
+        text.ignore = text.hoverIgnore;
+    }
+    function onNormal() {
+        text.ignore = text.normalIgnore;
+    }
+    this.on('emphasis', onEmphasis)
+        .on('normal', onNormal)
+        .on('mouseover', onEmphasis)
+        .on('mouseout', onNormal);
+}
+
+var SunburstPieceProto = SunburstPiece.prototype;
+
+SunburstPieceProto.updateData = function (
+    firstCreate,
+    node,
+    state,
+    seriesModel,
+    ecModel
+) {
+    this.node = node;
+    node.piece = this;
+
+    seriesModel = seriesModel || this._seriesModel;
+    ecModel = ecModel || this._ecModel;
+
+    var sector = this.childAt(0);
+    sector.dataIndex = node.dataIndex;
+
+    var itemModel = node.getModel();
+    var layout = node.getLayout();
+    if (!layout) {
+        console.log(node.getLayout());
+    }
+    var sectorShape = extend({}, layout);
+    sectorShape.label = null;
+
+    var visualColor = getNodeColor(node, seriesModel, ecModel);
+
+    var normalStyle = itemModel.getModel('itemStyle').getItemStyle();
+    var style;
+    if (state === 'normal') {
+        style = normalStyle;
+    }
+    else {
+        var stateStyle = itemModel.getModel(state + '.itemStyle')
+            .getItemStyle();
+        style = merge(stateStyle, normalStyle);
+    }
+    style = defaults(
+        {
+            lineJoin: 'bevel',
+            fill: style.fill || visualColor
+        },
+        style
+    );
+
+    if (firstCreate) {
+        sector.setShape(sectorShape);
+        sector.shape.r = layout.r0;
+        updateProps(
+            sector,
+            {
+                shape: {
+                    r: layout.r
+                }
+            },
+            seriesModel,
+            node.dataIndex
+        );
+        sector.useStyle(style);
+    }
+    else if (typeof style.fill === 'object' && style.fill.type
+        || typeof sector.style.fill === 'object' && sector.style.fill.type
+    ) {
+        // Disable animation for gradient since no interpolation method
+        // is supported for gradient
+        updateProps(sector, {
+            shape: sectorShape
+        }, seriesModel);
+        sector.useStyle(style);
+    }
+    else {
+        updateProps(sector, {
+            shape: sectorShape,
+            style: style
+        }, seriesModel);
+    }
+
+    this._updateLabel(seriesModel, visualColor, state);
+
+    var cursorStyle = itemModel.getShallow('cursor');
+    cursorStyle && sector.attr('cursor', cursorStyle);
+
+    if (firstCreate) {
+        var highlightPolicy = seriesModel.getShallow('highlightPolicy');
+        this._initEvents(sector, node, seriesModel, highlightPolicy);
+    }
+
+    this._seriesModel = seriesModel || this._seriesModel;
+    this._ecModel = ecModel || this._ecModel;
+};
+
+SunburstPieceProto.onEmphasis = function (highlightPolicy) {
+    var that = this;
+    this.node.hostTree.root.eachNode(function (n) {
+        if (n.piece) {
+            if (that.node === n) {
+                n.piece.updateData(false, n, 'emphasis');
+            }
+            else if (isNodeHighlighted(n, that.node, highlightPolicy)) {
+                n.piece.childAt(0).trigger('highlight');
+            }
+            else if (highlightPolicy !== NodeHighlightPolicy.NONE) {
+                n.piece.childAt(0).trigger('downplay');
+            }
+        }
+    });
+};
+
+SunburstPieceProto.onNormal = function () {
+    this.node.hostTree.root.eachNode(function (n) {
+        if (n.piece) {
+            n.piece.updateData(false, n, 'normal');
+        }
+    });
+};
+
+SunburstPieceProto.onHighlight = function () {
+    this.updateData(false, this.node, 'highlight');
+};
+
+SunburstPieceProto.onDownplay = function () {
+    this.updateData(false, this.node, 'downplay');
+};
+
+SunburstPieceProto._updateLabel = function (seriesModel, visualColor, state) {
+    var itemModel = this.node.getModel();
+    var normalModel = itemModel.getModel('label');
+    var labelModel = state === 'normal' || state === 'emphasis'
+        ? normalModel
+        : itemModel.getModel(state + '.label');
+    var labelHoverModel = itemModel.getModel('emphasis.label');
+
+    var text = retrieve(
+        seriesModel.getFormattedLabel(
+            this.node.dataIndex, 'normal', null, null, 'label'
+        ),
+        this.node.name
+    );
+    if (getLabelAttr('show') === false) {
+        text = '';
+    }
+
+    var layout = this.node.getLayout();
+    var labelMinAngle = labelModel.get('minAngle');
+    if (labelMinAngle == null) {
+        labelMinAngle = normalModel.get('minAngle');
+    }
+    labelMinAngle = labelMinAngle / 180 * Math.PI;
+    var angle = layout.endAngle - layout.startAngle;
+    if (labelMinAngle != null && Math.abs(angle) < labelMinAngle) {
+        // Not displaying text when angle is too small
+        text = '';
+    }
+
+    var label = this.childAt(1);
+
+    setLabelStyle(
+        label.style, label.hoverStyle || {}, normalModel, labelHoverModel,
+        {
+            defaultText: labelModel.getShallow('show') ? text : null,
+            autoColor: visualColor,
+            useInsideStyle: true
+        }
+    );
+
+    var midAngle = (layout.startAngle + layout.endAngle) / 2;
+    var dx = Math.cos(midAngle);
+    var dy = Math.sin(midAngle);
+
+    var r;
+    var labelPosition = getLabelAttr('position');
+    var labelPadding = getLabelAttr('distance') || 0;
+    var textAlign = getLabelAttr('align');
+    if (labelPosition === 'outside') {
+        r = layout.r + labelPadding;
+        textAlign = midAngle > Math.PI / 2 ? 'right' : 'left';
+    }
+    else {
+        if (!textAlign || textAlign === 'center') {
+            r = (layout.r + layout.r0) / 2;
+            textAlign = 'center';
+        }
+        else if (textAlign === 'left') {
+            r = layout.r0 + labelPadding;
+            if (midAngle > Math.PI / 2) {
+                textAlign = 'right';
+            }
+        }
+        else if (textAlign === 'right') {
+            r = layout.r - labelPadding;
+            if (midAngle > Math.PI / 2) {
+                textAlign = 'left';
+            }
+        }
+    }
+
+    label.attr('style', {
+        text: text,
+        textAlign: textAlign,
+        textVerticalAlign: getLabelAttr('verticalAlign') || 'middle',
+        opacity: getLabelAttr('opacity')
+    });
+
+    var textX = r * dx + layout.cx;
+    var textY = r * dy + layout.cy;
+    label.attr('position', [textX, textY]);
+
+    var rotateType = getLabelAttr('rotate');
+    var rotate = 0;
+    if (rotateType === 'radial') {
+        rotate = -midAngle;
+        if (rotate < -Math.PI / 2) {
+            rotate += Math.PI;
+        }
+    }
+    else if (rotateType === 'tangential') {
+        rotate = Math.PI / 2 - midAngle;
+        if (rotate > Math.PI / 2) {
+            rotate -= Math.PI;
+        }
+        else if (rotate < -Math.PI / 2) {
+            rotate += Math.PI;
+        }
+    } else if (typeof rotateType === 'number') {
+        rotate = rotateType * Math.PI / 180;
+    }
+    label.attr('rotation', rotate);
+
+    function getLabelAttr(name) {
+        var stateAttr = labelModel.get(name);
+        if (stateAttr == null) {
+            return normalModel.get(name);
+        }
+        else {
+            return stateAttr;
+        }
+    }
+};
+
+SunburstPieceProto._initEvents = function (
+    sector,
+    node,
+    seriesModel,
+    highlightPolicy
+) {
+    sector.off('mouseover').off('mouseout').off('emphasis').off('normal');
+
+    var that = this;
+    var onEmphasis = function () {
+        that.onEmphasis(highlightPolicy);
+    };
+    var onNormal = function () {
+        that.onNormal();
+    };
+    var onDownplay = function () {
+        that.onDownplay();
+    };
+    var onHighlight = function () {
+        that.onHighlight();
+    };
+
+    if (seriesModel.isAnimationEnabled()) {
+        sector
+            .on('mouseover', onEmphasis)
+            .on('mouseout', onNormal)
+            .on('emphasis', onEmphasis)
+            .on('normal', onNormal)
+            .on('downplay', onDownplay)
+            .on('highlight', onHighlight);
+    }
+};
+
+inherits(SunburstPiece, Group);
+
+/**
+ * Get node color
+ *
+ * @param {TreeNode} node the node to get color
+ * @param {module:echarts/model/Series} seriesModel series
+ * @param {module:echarts/model/Global} ecModel echarts defaults
+ */
+function getNodeColor(node, seriesModel, ecModel) {
+    // Color from visualMap
+    var visualColor = node.getVisual('color');
+    var visualMetaList = node.getVisual('visualMeta');
+    if (!visualMetaList || visualMetaList.length === 0) {
+        // Use first-generation color if has no visualMap
+        visualColor = null;
+    }
+
+    // Self color or level color
+    var color = node.getModel('itemStyle').get('color');
+    if (color) {
+        return color;
+    }
+    else if (visualColor) {
+        // Color mapping
+        return visualColor;
+    }
+    else if (node.depth === 0) {
+        // Virtual root node
+        return ecModel.option.color[0];
+    }
+    else {
+        // First-generation color
+        var length = ecModel.option.color.length;
+        color = ecModel.option.color[getRootId(node) % length];
+    }
+    return color;
+}
+
+/**
+ * Get index of root in sorted order
+ *
+ * @param {TreeNode} node current node
+ * @return {number} index in root
+ */
+function getRootId(node) {
+    var ancestor = node;
+    while (ancestor.depth > 1) {
+        ancestor = ancestor.parentNode;
+    }
+
+    var virtualRoot = node.getAncestors()[0];
+    return indexOf(virtualRoot.children, ancestor);
+}
+
+function isNodeHighlighted(node, activeNode, policy) {
+    if (policy === NodeHighlightPolicy.NONE) {
+        return false;
+    }
+    else if (policy === NodeHighlightPolicy.SELF) {
+        return node === activeNode;
+    }
+    else if (policy === NodeHighlightPolicy.ANCESTOR) {
+        return node === activeNode || node.isAncestorOf(activeNode);
+    }
+    else {
+        return node === activeNode || node.isDescendantOf(activeNode);
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ROOT_TO_NODE_ACTION = 'sunburstRootToNode';
+
+var SunburstView = Chart.extend({
+
+    type: 'sunburst',
+
+    init: function () {
+    },
+
+    render: function (seriesModel, ecModel, api, payload) {
+        var that = this;
+
+        this.seriesModel = seriesModel;
+        this.api = api;
+        this.ecModel = ecModel;
+
+        var data = seriesModel.getData();
+        var virtualRoot = data.tree.root;
+
+        var newRoot = seriesModel.getViewRoot();
+
+        var group = this.group;
+
+        var renderLabelForZeroData = seriesModel.get('renderLabelForZeroData');
+
+        var newChildren = [];
+        newRoot.eachNode(function (node) {
+            newChildren.push(node);
+        });
+        var oldChildren = this._oldChildren || [];
+
+        dualTravel(newChildren, oldChildren);
+
+        renderRollUp(virtualRoot, newRoot);
+
+        if (payload && payload.highlight && payload.highlight.piece) {
+            var highlightPolicy = seriesModel.getShallow('highlightPolicy');
+            payload.highlight.piece.onEmphasis(highlightPolicy);
+        }
+        else if (payload && payload.unhighlight) {
+            var piece = this.virtualPiece;
+            if (!piece && virtualRoot.children.length) {
+                piece = virtualRoot.children[0].piece;
+            }
+            if (piece) {
+                piece.onNormal();
+            }
+        }
+
+        this._initEvents();
+
+        this._oldChildren = newChildren;
+
+        function dualTravel(newChildren, oldChildren) {
+            if (newChildren.length === 0 && oldChildren.length === 0) {
+                return;
+            }
+
+            new DataDiffer(oldChildren, newChildren, getKey, getKey)
+                .add(processNode)
+                .update(processNode)
+                .remove(curry(processNode, null))
+                .execute();
+
+            function getKey(node) {
+                return node.getId();
+            }
+
+            function processNode(newId, oldId) {
+                var newNode = newId == null ? null : newChildren[newId];
+                var oldNode = oldId == null ? null : oldChildren[oldId];
+
+                doRenderNode(newNode, oldNode);
+            }
+        }
+
+        function doRenderNode(newNode, oldNode) {
+            if (!renderLabelForZeroData && newNode && !newNode.getValue()) {
+                // Not render data with value 0
+                newNode = null;
+            }
+
+            if (newNode !== virtualRoot && oldNode !== virtualRoot) {
+                if (oldNode && oldNode.piece) {
+                    if (newNode) {
+                        // Update
+                        oldNode.piece.updateData(
+                            false, newNode, 'normal', seriesModel, ecModel);
+
+                        // For tooltip
+                        data.setItemGraphicEl(newNode.dataIndex, oldNode.piece);
+                    }
+                    else {
+                        // Remove
+                        removeNode(oldNode);
+                    }
+                }
+                else if (newNode) {
+                    // Add
+                    var piece = new SunburstPiece(
+                        newNode,
+                        seriesModel,
+                        ecModel
+                    );
+                    group.add(piece);
+
+                    // For tooltip
+                    data.setItemGraphicEl(newNode.dataIndex, piece);
+                }
+            }
+        }
+
+        function removeNode(node) {
+            if (!node) {
+                return;
+            }
+
+            if (node.piece) {
+                group.remove(node.piece);
+                node.piece = null;
+            }
+        }
+
+        function renderRollUp(virtualRoot, viewRoot) {
+            if (viewRoot.depth > 0) {
+                // Render
+                if (that.virtualPiece) {
+                    // Update
+                    that.virtualPiece.updateData(
+                        false, virtualRoot, 'normal', seriesModel, ecModel);
+                }
+                else {
+                    // Add
+                    that.virtualPiece = new SunburstPiece(
+                        virtualRoot,
+                        seriesModel,
+                        ecModel
+                    );
+                    group.add(that.virtualPiece);
+                }
+
+                if (viewRoot.piece._onclickEvent) {
+                    viewRoot.piece.off('click', viewRoot.piece._onclickEvent);
+                }
+                var event = function (e) {
+                    that._rootToNode(viewRoot.parentNode);
+                };
+                viewRoot.piece._onclickEvent = event;
+                that.virtualPiece.on('click', event);
+            }
+            else if (that.virtualPiece) {
+                // Remove
+                group.remove(that.virtualPiece);
+                that.virtualPiece = null;
+            }
+        }
+    },
+
+    dispose: function () {
+    },
+
+    /**
+     * @private
+     */
+    _initEvents: function () {
+        var that = this;
+
+        var event = function (e) {
+            var targetFound = false;
+            var viewRoot = that.seriesModel.getViewRoot();
+            viewRoot.eachNode(function (node) {
+                if (!targetFound
+                    && node.piece && node.piece.childAt(0) === e.target
+                ) {
+                    var nodeClick = node.getModel().get('nodeClick');
+                    if (nodeClick === 'rootToNode') {
+                        that._rootToNode(node);
+                    }
+                    else if (nodeClick === 'link') {
+                        var itemModel = node.getModel();
+                        var link = itemModel.get('link');
+                        if (link) {
+                            var linkTarget = itemModel.get('target', true)
+                                || '_blank';
+                            window.open(link, linkTarget);
+                        }
+                    }
+                    targetFound = true;
+                }
+            });
+        };
+
+        if (this.group._onclickEvent) {
+            this.group.off('click', this.group._onclickEvent);
+        }
+        this.group.on('click', event);
+        this.group._onclickEvent = event;
+    },
+
+    /**
+     * @private
+     */
+    _rootToNode: function (node) {
+        if (node !== this.seriesModel.getViewRoot()) {
+            this.api.dispatchAction({
+                type: ROOT_TO_NODE_ACTION,
+                from: this.uid,
+                seriesId: this.seriesModel.id,
+                targetNode: node
+            });
+        }
+    },
+
+    /**
+     * @implement
+     */
+    containPoint: function (point, seriesModel) {
+        var treeRoot = seriesModel.getData();
+        var itemLayout = treeRoot.getItemLayout(0);
+        if (itemLayout) {
+            var dx = point[0] - itemLayout.cx;
+            var dy = point[1] - itemLayout.cy;
+            var radius = Math.sqrt(dx * dx + dy * dy);
+            return radius <= itemLayout.r && radius >= itemLayout.r0;
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Sunburst action
+ */
+
+var ROOT_TO_NODE_ACTION$1 = 'sunburstRootToNode';
+
+registerAction(
+    {type: ROOT_TO_NODE_ACTION$1, update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'sunburst', query: payload},
+            handleRootToNode
+        );
+
+        function handleRootToNode(model, index) {
+            var targetInfo = retrieveTargetInfo(payload, [ROOT_TO_NODE_ACTION$1], model);
+
+            if (targetInfo) {
+                var originViewRoot = model.getViewRoot();
+                if (originViewRoot) {
+                    payload.direction = aboveViewRoot(originViewRoot, targetInfo.node)
+                        ? 'rollUp' : 'drillDown';
+                }
+                model.resetViewRoot(targetInfo.node);
+            }
+        }
+    }
+);
+
+
+var HIGHLIGHT_ACTION = 'sunburstHighlight';
+
+registerAction(
+    {type: HIGHLIGHT_ACTION, update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'sunburst', query: payload},
+            handleHighlight
+        );
+
+        function handleHighlight(model, index) {
+            var targetInfo = retrieveTargetInfo(payload, [HIGHLIGHT_ACTION], model);
+
+            if (targetInfo) {
+                payload.highlight = targetInfo.node;
+            }
+        }
+    }
+);
+
+
+var UNHIGHLIGHT_ACTION = 'sunburstUnhighlight';
+
+registerAction(
+    {type: UNHIGHLIGHT_ACTION, update: 'updateView'},
+    function (payload, ecModel) {
+
+        ecModel.eachComponent(
+            {mainType: 'series', subType: 'sunburst', query: payload},
+            handleUnhighlight
+        );
+
+        function handleUnhighlight(model, index) {
+            payload.unhighlight = true;
+        }
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var RADIAN$1 = Math.PI / 180;
+
+var sunburstLayout = function (seriesType, ecModel, api, payload) {
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        var center = seriesModel.get('center');
+        var radius = seriesModel.get('radius');
+
+        if (!isArray(radius)) {
+            radius = [0, radius];
+        }
+        if (!isArray(center)) {
+            center = [center, center];
+        }
+
+        var width = api.getWidth();
+        var height = api.getHeight();
+        var size = Math.min(width, height);
+        var cx = parsePercent$1(center[0], width);
+        var cy = parsePercent$1(center[1], height);
+        var r0 = parsePercent$1(radius[0], size / 2);
+        var r = parsePercent$1(radius[1], size / 2);
+
+        var startAngle = -seriesModel.get('startAngle') * RADIAN$1;
+        var minAngle = seriesModel.get('minAngle') * RADIAN$1;
+
+        var virtualRoot = seriesModel.getData().tree.root;
+        var treeRoot = seriesModel.getViewRoot();
+        var rootDepth = treeRoot.depth;
+
+        var sort = seriesModel.get('sort');
+        if (sort != null) {
+            initChildren$1(treeRoot, sort);
+        }
+
+        var validDataCount = 0;
+        each$1(treeRoot.children, function (child) {
+            !isNaN(child.getValue()) && validDataCount++;
+        });
+
+        var sum = treeRoot.getValue();
+        // Sum may be 0
+        var unitRadian = Math.PI / (sum || validDataCount) * 2;
+
+        var renderRollupNode = treeRoot.depth > 0;
+        var levels = treeRoot.height - (renderRollupNode ? -1 : 1);
+        var rPerLevel = (r - r0) / (levels || 1);
+
+        var clockwise = seriesModel.get('clockwise');
+
+        var stillShowZeroSum = seriesModel.get('stillShowZeroSum');
+
+        // In the case some sector angle is smaller than minAngle
+        var dir = clockwise ? 1 : -1;
+
+        /**
+         * Render a tree
+         * @return increased angle
+         */
+        var renderNode = function (node, startAngle) {
+            if (!node) {
+                return;
+            }
+
+            var endAngle = startAngle;
+
+            // Render self
+            if (node !== virtualRoot) {
+                // Tree node is virtual, so it doesn't need to be drawn
+                var value = node.getValue();
+
+                var angle = (sum === 0 && stillShowZeroSum)
+                    ? unitRadian : (value * unitRadian);
+                if (angle < minAngle) {
+                    angle = minAngle;
+                    
+                }
+                else {
+                    
+                }
+
+                endAngle = startAngle + dir * angle;
+
+                var depth = node.depth - rootDepth
+                    - (renderRollupNode ? -1 : 1);
+                var rStart = r0 + rPerLevel * depth;
+                var rEnd = r0 + rPerLevel * (depth + 1);
+
+                var itemModel = node.getModel();
+                if (itemModel.get('r0') != null) {
+                    rStart = parsePercent$1(itemModel.get('r0'), size / 2);
+                }
+                if (itemModel.get('r') != null) {
+                    rEnd = parsePercent$1(itemModel.get('r'), size / 2);
+                }
+
+                node.setLayout({
+                    angle: angle,
+                    startAngle: startAngle,
+                    endAngle: endAngle,
+                    clockwise: clockwise,
+                    cx: cx,
+                    cy: cy,
+                    r0: rStart,
+                    r: rEnd
+                });
+            }
+
+            // Render children
+            if (node.children && node.children.length) {
+                // currentAngle = startAngle;
+                var siblingAngle = 0;
+                each$1(node.children, function (node) {
+                    siblingAngle += renderNode(node, startAngle + siblingAngle);
+                });
+            }
+
+            return endAngle - startAngle;
+        };
+
+        // Virtual root node for roll up
+        if (renderRollupNode) {
+            var rStart = r0;
+            var rEnd = r0 + rPerLevel;
+
+            var angle = Math.PI * 2;
+            virtualRoot.setLayout({
+                angle: angle,
+                startAngle: startAngle,
+                endAngle: startAngle + angle,
+                clockwise: clockwise,
+                cx: cx,
+                cy: cy,
+                r0: rStart,
+                r: rEnd
+            });
+        }
+
+        renderNode(treeRoot, startAngle);
+    });
+};
+
+/**
+ * Init node children by order and update visual
+ *
+ * @param {TreeNode} node  root node
+ * @param {boolean}  isAsc if is in ascendant order
+ */
+function initChildren$1(node, isAsc) {
+    var children = node.children || [];
+
+    node.children = sort$2(children, isAsc);
+
+    // Init children recursively
+    if (children.length) {
+        each$1(node.children, function (child) {
+            initChildren$1(child, isAsc);
+        });
+    }
+}
+
+/**
+ * Sort children nodes
+ *
+ * @param {TreeNode[]}               children children of node to be sorted
+ * @param {string | function | null} sort sort method
+ *                                   See SunburstSeries.js for details.
+ */
+function sort$2(children, sortOrder) {
+    if (typeof sortOrder === 'function') {
+        return children.sort(sortOrder);
+    }
+    else {
+        var isAsc = sortOrder === 'asc';
+        return children.sort(function (a, b) {
+            var diff = (a.getValue() - b.getValue()) * (isAsc ? 1 : -1);
+            return diff === 0
+                ? (a.dataIndex - b.dataIndex) * (isAsc ? -1 : 1)
+                : diff;
+        });
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerVisual(curry(dataColor, 'sunburst'));
+registerLayout(curry(sunburstLayout, 'sunburst'));
+registerProcessor(curry(dataFilter, 'sunburst'));
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize(dataSize, dataItem) {
+    // dataItem is necessary in log axis.
+    dataItem = dataItem || [0, 0];
+    return map(['x', 'y'], function (dim, dimIdx) {
+        var axis = this.getAxis(dim);
+        var val = dataItem[dimIdx];
+        var halfSize = dataSize[dimIdx] / 2;
+        return axis.type === 'category'
+            ? axis.getBandWidth()
+            : Math.abs(axis.dataToCoord(val - halfSize) - axis.dataToCoord(val + halfSize));
+    }, this);
+}
+
+var prepareCartesian2d = function (coordSys) {
+    var rect = coordSys.grid.getRect();
+    return {
+        coordSys: {
+            // The name exposed to user is always 'cartesian2d' but not 'grid'.
+            type: 'cartesian2d',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        api: {
+            coord: function (data) {
+                // do not provide "out" param
+                return coordSys.dataToPoint(data);
+            },
+            size: bind(dataToCoordSize, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize$1(dataSize, dataItem) {
+    dataItem = dataItem || [0, 0];
+    return map([0, 1], function (dimIdx) {
+        var val = dataItem[dimIdx];
+        var halfSize = dataSize[dimIdx] / 2;
+        var p1 = [];
+        var p2 = [];
+        p1[dimIdx] = val - halfSize;
+        p2[dimIdx] = val + halfSize;
+        p1[1 - dimIdx] = p2[1 - dimIdx] = dataItem[1 - dimIdx];
+        return Math.abs(this.dataToPoint(p1)[dimIdx] - this.dataToPoint(p2)[dimIdx]);
+    }, this);
+}
+
+var prepareGeo = function (coordSys) {
+    var rect = coordSys.getBoundingRect();
+    return {
+        coordSys: {
+            type: 'geo',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        api: {
+            coord: function (data) {
+                // do not provide "out" and noRoam param,
+                // Compatible with this usage:
+                // echarts.util.map(item.points, api.coord)
+                return coordSys.dataToPoint(data);
+            },
+            size: bind(dataToCoordSize$1, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize$2(dataSize, dataItem) {
+    // dataItem is necessary in log axis.
+    var axis = this.getAxis();
+    var val = dataItem instanceof Array ? dataItem[0] : dataItem;
+    var halfSize = (dataSize instanceof Array ? dataSize[0] : dataSize) / 2;
+    return axis.type === 'category'
+        ? axis.getBandWidth()
+        : Math.abs(axis.dataToCoord(val - halfSize) - axis.dataToCoord(val + halfSize));
+}
+
+var prepareSingleAxis = function (coordSys) {
+    var rect = coordSys.getRect();
+
+    return {
+        coordSys: {
+            type: 'singleAxis',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height
+        },
+        api: {
+            coord: function (val) {
+                // do not provide "out" param
+                return coordSys.dataToPoint(val);
+            },
+            size: bind(dataToCoordSize$2, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function dataToCoordSize$3(dataSize, dataItem) {
+    // dataItem is necessary in log axis.
+    return map(['Radius', 'Angle'], function (dim, dimIdx) {
+        var axis = this['get' + dim + 'Axis']();
+        var val = dataItem[dimIdx];
+        var halfSize = dataSize[dimIdx] / 2;
+        var method = 'dataTo' + dim;
+
+        var result = axis.type === 'category'
+            ? axis.getBandWidth()
+            : Math.abs(axis[method](val - halfSize) - axis[method](val + halfSize));
+
+        if (dim === 'Angle') {
+            result = result * Math.PI / 180;
+        }
+
+        return result;
+
+    }, this);
+}
+
+var preparePolar = function (coordSys) {
+    var radiusAxis = coordSys.getRadiusAxis();
+    var angleAxis = coordSys.getAngleAxis();
+    var radius = radiusAxis.getExtent();
+    radius[0] > radius[1] && radius.reverse();
+
+    return {
+        coordSys: {
+            type: 'polar',
+            cx: coordSys.cx,
+            cy: coordSys.cy,
+            r: radius[1],
+            r0: radius[0]
+        },
+        api: {
+            coord: bind(function (data) {
+                var radius = radiusAxis.dataToRadius(data[0]);
+                var angle = angleAxis.dataToAngle(data[1]);
+                var coord = coordSys.coordToPoint([radius, angle]);
+                coord.push(radius, angle * Math.PI / 180);
+                return coord;
+            }),
+            size: bind(dataToCoordSize$3, coordSys)
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var prepareCalendar = function (coordSys) {
+    var rect = coordSys.getRect();
+    var rangeInfo = coordSys.getRangeInfo();
+
+    return {
+        coordSys: {
+            type: 'calendar',
+            x: rect.x,
+            y: rect.y,
+            width: rect.width,
+            height: rect.height,
+            cellWidth: coordSys.getCellWidth(),
+            cellHeight: coordSys.getCellHeight(),
+            rangeInfo: {
+                start: rangeInfo.start,
+                end: rangeInfo.end,
+                weeks: rangeInfo.weeks,
+                dayCount: rangeInfo.allDay
+            }
+        },
+        api: {
+            coord: function (data, clamp) {
+                return coordSys.dataToPoint(data, clamp);
+            }
+        }
+    };
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ITEM_STYLE_NORMAL_PATH = ['itemStyle'];
+var ITEM_STYLE_EMPHASIS_PATH = ['emphasis', 'itemStyle'];
+var LABEL_NORMAL = ['label'];
+var LABEL_EMPHASIS = ['emphasis', 'label'];
+// Use prefix to avoid index to be the same as el.name,
+// which will cause weird udpate animation.
+var GROUP_DIFF_PREFIX = 'e\0\0';
+
+/**
+ * To reduce total package size of each coordinate systems, the modules `prepareCustom`
+ * of each coordinate systems are not required by each coordinate systems directly, but
+ * required by the module `custom`.
+ *
+ * prepareInfoForCustomSeries {Function}: optional
+ *     @return {Object} {coordSys: {...}, api: {
+ *         coord: function (data, clamp) {}, // return point in global.
+ *         size: function (dataSize, dataItem) {} // return size of each axis in coordSys.
+ *     }}
+ */
+var prepareCustoms = {
+    cartesian2d: prepareCartesian2d,
+    geo: prepareGeo,
+    singleAxis: prepareSingleAxis,
+    polar: preparePolar,
+    calendar: prepareCalendar
+};
+
+// ------
+// Model
+// ------
+
+extendSeriesModel({
+
+    type: 'series.custom',
+
+    dependencies: ['grid', 'polar', 'geo', 'singleAxis', 'calendar'],
+
+    defaultOption: {
+        coordinateSystem: 'cartesian2d', // Can be set as 'none'
+        zlevel: 0,
+        z: 2,
+        legendHoverLink: true
+
+        // Cartesian coordinate system
+        // xAxisIndex: 0,
+        // yAxisIndex: 0,
+
+        // Polar coordinate system
+        // polarIndex: 0,
+
+        // Geo coordinate system
+        // geoIndex: 0,
+
+        // label: {}
+        // itemStyle: {}
+    },
+
+    getInitialData: function (option, ecModel) {
+        return createListFromArray(this.getSource(), this);
+    }
+});
+
+// -----
+// View
+// -----
+
+extendChartView({
+
+    type: 'custom',
+
+    /**
+     * @private
+     * @type {module:echarts/data/List}
+     */
+    _data: null,
+
+    /**
+     * @override
+     */
+    render: function (customSeries, ecModel, api) {
+        var oldData = this._data;
+        var data = customSeries.getData();
+        var group = this.group;
+        var renderItem = makeRenderItem(customSeries, data, ecModel, api);
+
+        this.group.removeAll();
+
+        data.diff(oldData)
+            .add(function (newIdx) {
+                createOrUpdate$1(
+                    null, newIdx, renderItem(newIdx), customSeries, group, data
+                );
+            })
+            .update(function (newIdx, oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                createOrUpdate$1(
+                    el, newIdx, renderItem(newIdx), customSeries, group, data
+                );
+            })
+            .remove(function (oldIdx) {
+                var el = oldData.getItemGraphicEl(oldIdx);
+                el && group.remove(el);
+            })
+            .execute();
+
+        this._data = data;
+    },
+
+    incrementalPrepareRender: function (customSeries, ecModel, api) {
+        this.group.removeAll();
+        this._data = null;
+    },
+
+    incrementalRender: function (params, customSeries, ecModel, api) {
+        var data = customSeries.getData();
+        var renderItem = makeRenderItem(customSeries, data, ecModel, api);
+        function setIncrementalAndHoverLayer(el) {
+            if (!el.isGroup) {
+                el.incremental = true;
+                el.useHoverLayer = true;
+            }
+        }
+        for (var idx = params.start; idx < params.end; idx++) {
+            var el = createOrUpdate$1(null, idx, renderItem(idx), customSeries, this.group, data);
+            el.traverse(setIncrementalAndHoverLayer);
+        }
+    },
+
+    /**
+     * @override
+     */
+    dispose: noop
+});
+
+
+function createEl(elOption) {
+    var graphicType = elOption.type;
+    var el;
+
+    if (graphicType === 'path') {
+        var shape = elOption.shape;
+        el = makePath(
+            shape.pathData,
+            null,
+            {
+                x: shape.x || 0,
+                y: shape.y || 0,
+                width: shape.width || 0,
+                height: shape.height || 0
+            },
+            'center'
+        );
+        el.__customPathData = elOption.pathData;
+    }
+    else if (graphicType === 'image') {
+        el = new ZImage({
+        });
+        el.__customImagePath = elOption.style.image;
+    }
+    else if (graphicType === 'text') {
+        el = new Text({
+        });
+        el.__customText = elOption.style.text;
+    }
+    else {
+        var Clz = graphic[graphicType.charAt(0).toUpperCase() + graphicType.slice(1)];
+
+        if (__DEV__) {
+            assert$1(Clz, 'graphic type "' + graphicType + '" can not be found.');
+        }
+
+        el = new Clz();
+    }
+
+    el.__customGraphicType = graphicType;
+    el.name = elOption.name;
+
+    return el;
+}
+
+function updateEl(el, dataIndex, elOption, animatableModel, data, isInit) {
+    var targetProps = {};
+    var elOptionStyle = elOption.style || {};
+
+    elOption.shape && (targetProps.shape = clone(elOption.shape));
+    elOption.position && (targetProps.position = elOption.position.slice());
+    elOption.scale && (targetProps.scale = elOption.scale.slice());
+    elOption.origin && (targetProps.origin = elOption.origin.slice());
+    elOption.rotation && (targetProps.rotation = elOption.rotation);
+
+    if (el.type === 'image' && elOption.style) {
+        var targetStyle = targetProps.style = {};
+        each$1(['x', 'y', 'width', 'height'], function (prop) {
+            prepareStyleTransition(prop, targetStyle, elOptionStyle, el.style, isInit);
+        });
+    }
+
+    if (el.type === 'text' && elOption.style) {
+        var targetStyle = targetProps.style = {};
+        each$1(['x', 'y'], function (prop) {
+            prepareStyleTransition(prop, targetStyle, elOptionStyle, el.style, isInit);
+        });
+        // Compatible with previous: both support
+        // textFill and fill, textStroke and stroke in 'text' element.
+        !elOptionStyle.hasOwnProperty('textFill') && elOptionStyle.fill && (
+            elOptionStyle.textFill = elOptionStyle.fill
+        );
+        !elOptionStyle.hasOwnProperty('textStroke') && elOptionStyle.stroke && (
+            elOptionStyle.textStroke = elOptionStyle.stroke
+        );
+    }
+
+    if (el.type !== 'group') {
+        el.useStyle(elOptionStyle);
+
+        // Init animation.
+        if (isInit) {
+            el.style.opacity = 0;
+            var targetOpacity = elOptionStyle.opacity;
+            targetOpacity == null && (targetOpacity = 1);
+            initProps(el, {style: {opacity: targetOpacity}}, animatableModel, dataIndex);
+        }
+    }
+
+    if (isInit) {
+        el.attr(targetProps);
+    }
+    else {
+        updateProps(el, targetProps, animatableModel, dataIndex);
+    }
+
+    // z2 must not be null/undefined, otherwise sort error may occur.
+    el.attr({z2: elOption.z2 || 0, silent: elOption.silent});
+
+    elOption.styleEmphasis !== false && setHoverStyle(el, elOption.styleEmphasis);
+}
+
+function prepareStyleTransition(prop, targetStyle, elOptionStyle, oldElStyle, isInit) {
+    if (elOptionStyle[prop] != null && !isInit) {
+        targetStyle[prop] = elOptionStyle[prop];
+        elOptionStyle[prop] = oldElStyle[prop];
+    }
+}
+
+function makeRenderItem(customSeries, data, ecModel, api) {
+    var renderItem = customSeries.get('renderItem');
+    var coordSys = customSeries.coordinateSystem;
+    var prepareResult = {};
+
+    if (coordSys) {
+        if (__DEV__) {
+            assert$1(renderItem, 'series.render is required.');
+            assert$1(
+                coordSys.prepareCustoms || prepareCustoms[coordSys.type],
+                'This coordSys does not support custom series.'
+            );
+        }
+
+        prepareResult = coordSys.prepareCustoms
+            ? coordSys.prepareCustoms()
+            : prepareCustoms[coordSys.type](coordSys);
+    }
+
+    var userAPI = defaults({
+        getWidth: api.getWidth,
+        getHeight: api.getHeight,
+        getZr: api.getZr,
+        getDevicePixelRatio: api.getDevicePixelRatio,
+        value: value,
+        style: style,
+        styleEmphasis: styleEmphasis,
+        visual: visual,
+        barLayout: barLayout,
+        currentSeriesIndices: currentSeriesIndices,
+        font: font
+    }, prepareResult.api || {});
+
+    var userParams = {
+        context: {},
+        seriesId: customSeries.id,
+        seriesName: customSeries.name,
+        seriesIndex: customSeries.seriesIndex,
+        coordSys: prepareResult.coordSys,
+        dataInsideLength: data.count(),
+        encode: wrapEncodeDef(customSeries.getData())
+    };
+
+    // Do not support call `api` asynchronously without dataIndexInside input.
+    var currDataIndexInside;
+    var currDirty = true;
+    var currItemModel;
+    var currLabelNormalModel;
+    var currLabelEmphasisModel;
+    var currVisualColor;
+
+    return function (dataIndexInside) {
+        currDataIndexInside = dataIndexInside;
+        currDirty = true;
+        return renderItem && renderItem(
+            defaults({
+                dataIndexInside: dataIndexInside,
+                dataIndex: data.getRawIndex(dataIndexInside)
+            }, userParams),
+            userAPI
+        ) || {};
+    };
+
+    // Do not update cache until api called.
+    function updateCache(dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        if (currDirty) {
+            currItemModel = data.getItemModel(dataIndexInside);
+            currLabelNormalModel = currItemModel.getModel(LABEL_NORMAL);
+            currLabelEmphasisModel = currItemModel.getModel(LABEL_EMPHASIS);
+            currVisualColor = data.getItemVisual(dataIndexInside, 'color');
+
+            currDirty = false;
+        }
+    }
+
+    /**
+     * @public
+     * @param {number|string} dim
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     * @return {number|string} value
+     */
+    function value(dim, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        return data.get(data.getDimension(dim || 0), dataIndexInside);
+    }
+
+    /**
+     * By default, `visual` is applied to style (to support visualMap).
+     * `visual.color` is applied at `fill`. If user want apply visual.color on `stroke`,
+     * it can be implemented as:
+     * `api.style({stroke: api.visual('color'), fill: null})`;
+     * @public
+     * @param {Object} [extra]
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     */
+    function style(extra, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        updateCache(dataIndexInside);
+
+        var itemStyle = currItemModel.getModel(ITEM_STYLE_NORMAL_PATH).getItemStyle();
+
+        currVisualColor != null && (itemStyle.fill = currVisualColor);
+        var opacity = data.getItemVisual(dataIndexInside, 'opacity');
+        opacity != null && (itemStyle.opacity = opacity);
+
+        setTextStyle(itemStyle, currLabelNormalModel, null, {
+            autoColor: currVisualColor,
+            isRectText: true
+        });
+
+        itemStyle.text = currLabelNormalModel.getShallow('show')
+            ? retrieve2(
+                customSeries.getFormattedLabel(dataIndexInside, 'normal'),
+                getDefaultLabel(data, dataIndexInside)
+            )
+            : null;
+
+        extra && extend(itemStyle, extra);
+        return itemStyle;
+    }
+
+    /**
+     * @public
+     * @param {Object} [extra]
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     */
+    function styleEmphasis(extra, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        updateCache(dataIndexInside);
+
+        var itemStyle = currItemModel.getModel(ITEM_STYLE_EMPHASIS_PATH).getItemStyle();
+
+        setTextStyle(itemStyle, currLabelEmphasisModel, null, {
+            isRectText: true
+        }, true);
+
+        itemStyle.text = currLabelEmphasisModel.getShallow('show')
+            ? retrieve3(
+                customSeries.getFormattedLabel(dataIndexInside, 'emphasis'),
+                customSeries.getFormattedLabel(dataIndexInside, 'normal'),
+                getDefaultLabel(data, dataIndexInside)
+            )
+            : null;
+
+        extra && extend(itemStyle, extra);
+        return itemStyle;
+    }
+
+    /**
+     * @public
+     * @param {string} visualType
+     * @param {number} [dataIndexInside=currDataIndexInside]
+     */
+    function visual(visualType, dataIndexInside) {
+        dataIndexInside == null && (dataIndexInside = currDataIndexInside);
+        return data.getItemVisual(dataIndexInside, visualType);
+    }
+
+    /**
+     * @public
+     * @param {number} opt.count Positive interger.
+     * @param {number} [opt.barWidth]
+     * @param {number} [opt.barMaxWidth]
+     * @param {number} [opt.barGap]
+     * @param {number} [opt.barCategoryGap]
+     * @return {Object} {width, offset, offsetCenter} is not support, return undefined.
+     */
+    function barLayout(opt) {
+        if (coordSys.getBaseAxis) {
+            var baseAxis = coordSys.getBaseAxis();
+            return getLayoutOnAxis(defaults({axis: baseAxis}, opt), api);
+        }
+    }
+
+    /**
+     * @public
+     * @return {Array.<number>}
+     */
+    function currentSeriesIndices() {
+        return ecModel.getCurrentSeriesIndices();
+    }
+
+    /**
+     * @public
+     * @param {Object} opt
+     * @param {string} [opt.fontStyle]
+     * @param {number} [opt.fontWeight]
+     * @param {number} [opt.fontSize]
+     * @param {string} [opt.fontFamily]
+     * @return {string} font string
+     */
+    function font(opt) {
+        return getFont(opt, ecModel);
+    }
+}
+
+function wrapEncodeDef(data) {
+    var encodeDef = {};
+    each$1(data.dimensions, function (dimName, dataDimIndex) {
+        var dimInfo = data.getDimensionInfo(dimName);
+        if (!dimInfo.isExtraCoord) {
+            var coordDim = dimInfo.coordDim;
+            var dataDims = encodeDef[coordDim] = encodeDef[coordDim] || [];
+            dataDims[dimInfo.coordDimIndex] = dataDimIndex;
+        }
+    });
+    return encodeDef;
+}
+
+function createOrUpdate$1(el, dataIndex, elOption, animatableModel, group, data) {
+    el = doCreateOrUpdate(el, dataIndex, elOption, animatableModel, group, data);
+    el && data.setItemGraphicEl(dataIndex, el);
+
+    return el;
+}
+
+function doCreateOrUpdate(el, dataIndex, elOption, animatableModel, group, data) {
+    var elOptionType = elOption.type;
+    if (el
+        && elOptionType !== el.__customGraphicType
+        && (elOptionType !== 'path' || elOption.pathData !== el.__customPathData)
+        && (elOptionType !== 'image' || elOption.style.image !== el.__customImagePath)
+        && (elOptionType !== 'text' || elOption.style.text !== el.__customText)
+    ) {
+        group.remove(el);
+        el = null;
+    }
+
+    // `elOption.type` is undefined when `renderItem` returns nothing.
+    if (elOptionType == null) {
+        return;
+    }
+
+    var isInit = !el;
+    !el && (el = createEl(elOption));
+    updateEl(el, dataIndex, elOption, animatableModel, data, isInit);
+
+    if (elOptionType === 'group') {
+        var oldChildren = el.children() || [];
+        var newChildren = elOption.children || [];
+
+        if (elOption.diffChildrenByName) {
+            // lower performance.
+            diffGroupChildren({
+                oldChildren: oldChildren,
+                newChildren: newChildren,
+                dataIndex: dataIndex,
+                animatableModel: animatableModel,
+                group: el,
+                data: data
+            });
+        }
+        else {
+            // better performance.
+            var index = 0;
+            for (; index < newChildren.length; index++) {
+                doCreateOrUpdate(
+                    el.childAt(index),
+                    dataIndex,
+                    newChildren[index],
+                    animatableModel,
+                    el,
+                    data
+                );
+            }
+            for (; index < oldChildren.length; index++) {
+                oldChildren[index] && el.remove(oldChildren[index]);
+            }
+        }
+    }
+
+    group.add(el);
+
+    return el;
+}
+
+function diffGroupChildren(context) {
+    (new DataDiffer(
+        context.oldChildren,
+        context.newChildren,
+        getKey,
+        getKey,
+        context
+    ))
+        .add(processAddUpdate)
+        .update(processAddUpdate)
+        .remove(processRemove)
+        .execute();
+}
+
+function getKey(item, idx) {
+    var name = item && item.name;
+    return name != null ? name : GROUP_DIFF_PREFIX + idx;
+}
+
+function processAddUpdate(newIndex, oldIndex) {
+    var context = this.context;
+    var childOption = newIndex != null ? context.newChildren[newIndex] : null;
+    var child = oldIndex != null ? context.oldChildren[oldIndex] : null;
+
+    doCreateOrUpdate(
+        child,
+        context.dataIndex,
+        childOption,
+        context.animatableModel,
+        context.group,
+        context.data
+    );
+}
+
+function processRemove(oldIndex) {
+    var context = this.context;
+    var child = context.oldChildren[oldIndex];
+    child && context.group.remove(child);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// -------------
+// Preprocessor
+// -------------
+
+registerPreprocessor(function (option) {
+    var graphicOption = option.graphic;
+
+    // Convert
+    // {graphic: [{left: 10, type: 'circle'}, ...]}
+    // or
+    // {graphic: {left: 10, type: 'circle'}}
+    // to
+    // {graphic: [{elements: [{left: 10, type: 'circle'}, ...]}]}
+    if (isArray(graphicOption)) {
+        if (!graphicOption[0] || !graphicOption[0].elements) {
+            option.graphic = [{elements: graphicOption}];
+        }
+        else {
+            // Only one graphic instance can be instantiated. (We dont
+            // want that too many views are created in echarts._viewMap)
+            option.graphic = [option.graphic[0]];
+        }
+    }
+    else if (graphicOption && !graphicOption.elements) {
+        option.graphic = [{elements: [graphicOption]}];
+    }
+});
+
+// ------
+// Model
+// ------
+
+var GraphicModel = extendComponentModel({
+
+    type: 'graphic',
+
+    defaultOption: {
+
+        // Extra properties for each elements:
+        //
+        // left/right/top/bottom: (like 12, '22%', 'center', default undefined)
+        //      If left/rigth is set, shape.x/shape.cx/position will not be used.
+        //      If top/bottom is set, shape.y/shape.cy/position will not be used.
+        //      This mechanism is useful when you want to position a group/element
+        //      against the right side or the center of this container.
+        //
+        // width/height: (can only be pixel value, default 0)
+        //      Only be used to specify contianer(group) size, if needed. And
+        //      can not be percentage value (like '33%'). See the reason in the
+        //      layout algorithm below.
+        //
+        // bounding: (enum: 'all' (default) | 'raw')
+        //      Specify how to calculate boundingRect when locating.
+        //      'all': Get uioned and transformed boundingRect
+        //          from both itself and its descendants.
+        //          This mode simplies confining a group of elements in the bounding
+        //          of their ancester container (e.g., using 'right: 0').
+        //      'raw': Only use the boundingRect of itself and before transformed.
+        //          This mode is similar to css behavior, which is useful when you
+        //          want an element to be able to overflow its container. (Consider
+        //          a rotated circle needs to be located in a corner.)
+
+        // Note: elements is always behind its ancestors in this elements array.
+        elements: [],
+        parentId: null
+    },
+
+    /**
+     * Save el options for the sake of the performance (only update modified graphics).
+     * The order is the same as those in option. (ancesters -> descendants)
+     *
+     * @private
+     * @type {Array.<Object>}
+     */
+    _elOptionsToUpdate: null,
+
+    /**
+     * @override
+     */
+    mergeOption: function (option) {
+        // Prevent default merge to elements
+        var elements = this.option.elements;
+        this.option.elements = null;
+
+        GraphicModel.superApply(this, 'mergeOption', arguments);
+
+        this.option.elements = elements;
+    },
+
+    /**
+     * @override
+     */
+    optionUpdated: function (newOption, isInit) {
+        var thisOption = this.option;
+        var newList = (isInit ? thisOption : newOption).elements;
+        var existList = thisOption.elements = isInit ? [] : thisOption.elements;
+
+        var flattenedList = [];
+        this._flatten(newList, flattenedList);
+
+        var mappingResult = mappingToExists(existList, flattenedList);
+        makeIdAndName(mappingResult);
+
+        // Clear elOptionsToUpdate
+        var elOptionsToUpdate = this._elOptionsToUpdate = [];
+
+        each$1(mappingResult, function (resultItem, index) {
+            var newElOption = resultItem.option;
+
+            if (__DEV__) {
+                assert$1(
+                    isObject$1(newElOption) || resultItem.exist,
+                    'Empty graphic option definition'
+                );
+            }
+
+            if (!newElOption) {
+                return;
+            }
+
+            elOptionsToUpdate.push(newElOption);
+
+            setKeyInfoToNewElOption(resultItem, newElOption);
+
+            mergeNewElOptionToExist(existList, index, newElOption);
+
+            setLayoutInfoToExist(existList[index], newElOption);
+
+        }, this);
+
+        // Clean
+        for (var i = existList.length - 1; i >= 0; i--) {
+            if (existList[i] == null) {
+                existList.splice(i, 1);
+            }
+            else {
+                // $action should be volatile, otherwise option gotten from
+                // `getOption` will contain unexpected $action.
+                delete existList[i].$action;
+            }
+        }
+    },
+
+    /**
+     * Convert
+     * [{
+     *  type: 'group',
+     *  id: 'xx',
+     *  children: [{type: 'circle'}, {type: 'polygon'}]
+     * }]
+     * to
+     * [
+     *  {type: 'group', id: 'xx'},
+     *  {type: 'circle', parentId: 'xx'},
+     *  {type: 'polygon', parentId: 'xx'}
+     * ]
+     *
+     * @private
+     * @param {Array.<Object>} optionList option list
+     * @param {Array.<Object>} result result of flatten
+     * @param {Object} parentOption parent option
+     */
+    _flatten: function (optionList, result, parentOption) {
+        each$1(optionList, function (option) {
+            if (!option) {
+                return;
+            }
+
+            if (parentOption) {
+                option.parentOption = parentOption;
+            }
+
+            result.push(option);
+
+            var children = option.children;
+            if (option.type === 'group' && children) {
+                this._flatten(children, result, option);
+            }
+            // Deleting for JSON output, and for not affecting group creation.
+            delete option.children;
+        }, this);
+    },
+
+    // FIXME
+    // Pass to view using payload? setOption has a payload?
+    useElOptionsToUpdate: function () {
+        var els = this._elOptionsToUpdate;
+        // Clear to avoid render duplicately when zooming.
+        this._elOptionsToUpdate = null;
+        return els;
+    }
+});
+
+// -----
+// View
+// -----
+
+extendComponentView({
+
+    type: 'graphic',
+
+    /**
+     * @override
+     */
+    init: function (ecModel, api) {
+
+        /**
+         * @private
+         * @type {module:zrender/core/util.HashMap}
+         */
+        this._elMap = createHashMap();
+
+        /**
+         * @private
+         * @type {module:echarts/graphic/GraphicModel}
+         */
+        this._lastGraphicModel;
+    },
+
+    /**
+     * @override
+     */
+    render: function (graphicModel, ecModel, api) {
+
+        // Having leveraged between use cases and algorithm complexity, a very
+        // simple layout mechanism is used:
+        // The size(width/height) can be determined by itself or its parent (not
+        // implemented yet), but can not by its children. (Top-down travel)
+        // The location(x/y) can be determined by the bounding rect of itself
+        // (can including its descendants or not) and the size of its parent.
+        // (Bottom-up travel)
+
+        // When `chart.clear()` or `chart.setOption({...}, true)` with the same id,
+        // view will be reused.
+        if (graphicModel !== this._lastGraphicModel) {
+            this._clear();
+        }
+        this._lastGraphicModel = graphicModel;
+
+        this._updateElements(graphicModel, api);
+        this._relocate(graphicModel, api);
+    },
+
+    /**
+     * Update graphic elements.
+     *
+     * @private
+     * @param {Object} graphicModel graphic model
+     * @param {module:echarts/ExtensionAPI} api extension API
+     */
+    _updateElements: function (graphicModel, api) {
+        var elOptionsToUpdate = graphicModel.useElOptionsToUpdate();
+
+        if (!elOptionsToUpdate) {
+            return;
+        }
+
+        var elMap = this._elMap;
+        var rootGroup = this.group;
+
+        // Top-down tranverse to assign graphic settings to each elements.
+        each$1(elOptionsToUpdate, function (elOption) {
+            var $action = elOption.$action;
+            var id = elOption.id;
+            var existEl = elMap.get(id);
+            var parentId = elOption.parentId;
+            var targetElParent = parentId != null ? elMap.get(parentId) : rootGroup;
+
+            if (elOption.type === 'text') {
+                var elOptionStyle = elOption.style;
+
+                // In top/bottom mode, textVerticalAlign should not be used, which cause
+                // inaccurately locating.
+                if (elOption.hv && elOption.hv[1]) {
+                    elOptionStyle.textVerticalAlign = elOptionStyle.textBaseline = null;
+                }
+
+                // Compatible with previous setting: both support fill and textFill,
+                // stroke and textStroke.
+                !elOptionStyle.hasOwnProperty('textFill') && elOptionStyle.fill && (
+                    elOptionStyle.textFill = elOptionStyle.fill
+                );
+                !elOptionStyle.hasOwnProperty('textStroke') && elOptionStyle.stroke && (
+                    elOptionStyle.textStroke = elOptionStyle.stroke
+                );
+            }
+
+            // Remove unnecessary props to avoid potential problems.
+            var elOptionCleaned = getCleanedElOption(elOption);
+
+            // For simple, do not support parent change, otherwise reorder is needed.
+            if (__DEV__) {
+                existEl && assert$1(
+                    targetElParent === existEl.parent,
+                    'Changing parent is not supported.'
+                );
+            }
+
+            if (!$action || $action === 'merge') {
+                existEl
+                    ? existEl.attr(elOptionCleaned)
+                    : createEl$1(id, targetElParent, elOptionCleaned, elMap);
+            }
+            else if ($action === 'replace') {
+                removeEl(existEl, elMap);
+                createEl$1(id, targetElParent, elOptionCleaned, elMap);
+            }
+            else if ($action === 'remove') {
+                removeEl(existEl, elMap);
+            }
+
+            var el = elMap.get(id);
+            if (el) {
+                el.__ecGraphicWidth = elOption.width;
+                el.__ecGraphicHeight = elOption.height;
+            }
+        });
+    },
+
+    /**
+     * Locate graphic elements.
+     *
+     * @private
+     * @param {Object} graphicModel graphic model
+     * @param {module:echarts/ExtensionAPI} api extension API
+     */
+    _relocate: function (graphicModel, api) {
+        var elOptions = graphicModel.option.elements;
+        var rootGroup = this.group;
+        var elMap = this._elMap;
+
+        // Bottom-up tranvese all elements (consider ec resize) to locate elements.
+        for (var i = elOptions.length - 1; i >= 0; i--) {
+            var elOption = elOptions[i];
+            var el = elMap.get(elOption.id);
+
+            if (!el) {
+                continue;
+            }
+
+            var parentEl = el.parent;
+            var containerInfo = parentEl === rootGroup
+                ? {
+                    width: api.getWidth(),
+                    height: api.getHeight()
+                }
+                : { // Like 'position:absolut' in css, default 0.
+                    width: parentEl.__ecGraphicWidth || 0,
+                    height: parentEl.__ecGraphicHeight || 0
+                };
+
+            positionElement(
+                el, elOption, containerInfo, null,
+                {hv: elOption.hv, boundingMode: elOption.bounding}
+            );
+        }
+    },
+
+    /**
+     * Clear all elements.
+     *
+     * @private
+     */
+    _clear: function () {
+        var elMap = this._elMap;
+        elMap.each(function (el) {
+            removeEl(el, elMap);
+        });
+        this._elMap = createHashMap();
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._clear();
+    }
+});
+
+function createEl$1(id, targetElParent, elOption, elMap) {
+    var graphicType = elOption.type;
+
+    if (__DEV__) {
+        assert$1(graphicType, 'graphic type MUST be set');
+    }
+
+    var Clz = graphic[graphicType.charAt(0).toUpperCase() + graphicType.slice(1)];
+
+    if (__DEV__) {
+        assert$1(Clz, 'graphic type can not be found');
+    }
+
+    var el = new Clz(elOption);
+    targetElParent.add(el);
+    elMap.set(id, el);
+    el.__ecGraphicId = id;
+}
+
+function removeEl(existEl, elMap) {
+    var existElParent = existEl && existEl.parent;
+    if (existElParent) {
+        existEl.type === 'group' && existEl.traverse(function (el) {
+            removeEl(el, elMap);
+        });
+        elMap.removeKey(existEl.__ecGraphicId);
+        existElParent.remove(existEl);
+    }
+}
+
+// Remove unnecessary props to avoid potential problems.
+function getCleanedElOption(elOption) {
+    elOption = extend({}, elOption);
+    each$1(
+        ['id', 'parentId', '$action', 'hv', 'bounding'].concat(LOCATION_PARAMS),
+        function (name) {
+            delete elOption[name];
+        }
+    );
+    return elOption;
+}
+
+function isSetLoc(obj, props) {
+    var isSet;
+    each$1(props, function (prop) {
+        obj[prop] != null && obj[prop] !== 'auto' && (isSet = true);
+    });
+    return isSet;
+}
+
+function setKeyInfoToNewElOption(resultItem, newElOption) {
+    var existElOption = resultItem.exist;
+
+    // Set id and type after id assigned.
+    newElOption.id = resultItem.keyInfo.id;
+    !newElOption.type && existElOption && (newElOption.type = existElOption.type);
+
+    // Set parent id if not specified
+    if (newElOption.parentId == null) {
+        var newElParentOption = newElOption.parentOption;
+        if (newElParentOption) {
+            newElOption.parentId = newElParentOption.id;
+        }
+        else if (existElOption) {
+            newElOption.parentId = existElOption.parentId;
+        }
+    }
+
+    // Clear
+    newElOption.parentOption = null;
+}
+
+function mergeNewElOptionToExist(existList, index, newElOption) {
+    // Update existing options, for `getOption` feature.
+    var newElOptCopy = extend({}, newElOption);
+    var existElOption = existList[index];
+
+    var $action = newElOption.$action || 'merge';
+    if ($action === 'merge') {
+        if (existElOption) {
+
+            if (__DEV__) {
+                var newType = newElOption.type;
+                assert$1(
+                    !newType || existElOption.type === newType,
+                    'Please set $action: "replace" to change `type`'
+                );
+            }
+
+            // We can ensure that newElOptCopy and existElOption are not
+            // the same object, so `merge` will not change newElOptCopy.
+            merge(existElOption, newElOptCopy, true);
+            // Rigid body, use ignoreSize.
+            mergeLayoutParam(existElOption, newElOptCopy, {ignoreSize: true});
+            // Will be used in render.
+            copyLayoutParams(newElOption, existElOption);
+        }
+        else {
+            existList[index] = newElOptCopy;
+        }
+    }
+    else if ($action === 'replace') {
+        existList[index] = newElOptCopy;
+    }
+    else if ($action === 'remove') {
+        // null will be cleaned later.
+        existElOption && (existList[index] = null);
+    }
+}
+
+function setLayoutInfoToExist(existItem, newElOption) {
+    if (!existItem) {
+        return;
+    }
+    existItem.hv = newElOption.hv = [
+        // Rigid body, dont care `width`.
+        isSetLoc(newElOption, ['left', 'right']),
+        // Rigid body, dont care `height`.
+        isSetLoc(newElOption, ['top', 'bottom'])
+    ];
+    // Give default group size. Otherwise layout error may occur.
+    if (existItem.type === 'group') {
+        existItem.width == null && (existItem.width = newElOption.width = 0);
+        existItem.height == null && (existItem.height = newElOption.height = 0);
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var LegendModel = extendComponentModel({
+
+    type: 'legend.plain',
+
+    dependencies: ['series'],
+
+    layoutMode: {
+        type: 'box',
+        // legend.width/height are maxWidth/maxHeight actually,
+        // whereas realy width/height is calculated by its content.
+        // (Setting {left: 10, right: 10} does not make sense).
+        // So consider the case:
+        // `setOption({legend: {left: 10});`
+        // then `setOption({legend: {right: 10});`
+        // The previous `left` should be cleared by setting `ignoreSize`.
+        ignoreSize: true
+    },
+
+    init: function (option, parentModel, ecModel) {
+        this.mergeDefaultAndTheme(option, ecModel);
+
+        option.selected = option.selected || {};
+    },
+
+    mergeOption: function (option) {
+        LegendModel.superCall(this, 'mergeOption', option);
+    },
+
+    optionUpdated: function () {
+        this._updateData(this.ecModel);
+
+        var legendData = this._data;
+
+        // If selectedMode is single, try to select one
+        if (legendData[0] && this.get('selectedMode') === 'single') {
+            var hasSelected = false;
+            // If has any selected in option.selected
+            for (var i = 0; i < legendData.length; i++) {
+                var name = legendData[i].get('name');
+                if (this.isSelected(name)) {
+                    // Force to unselect others
+                    this.select(name);
+                    hasSelected = true;
+                    break;
+                }
+            }
+            // Try select the first if selectedMode is single
+            !hasSelected && this.select(legendData[0].get('name'));
+        }
+    },
+
+    _updateData: function (ecModel) {
+        var potentialData = [];
+        var availableNames = [];
+
+        ecModel.eachRawSeries(function (seriesModel) {
+            var seriesName = seriesModel.name;
+            availableNames.push(seriesName);
+            var isPotential;
+
+            if (seriesModel.legendDataProvider) {
+                var data = seriesModel.legendDataProvider();
+                var names = data.mapArray(data.getName);
+
+                if (!ecModel.isSeriesFiltered(seriesModel)) {
+                    availableNames = availableNames.concat(names);
+                }
+
+                if (names.length) {
+                    potentialData = potentialData.concat(names);
+                }
+                else {
+                    isPotential = true;
+                }
+            }
+            else {
+                isPotential = true;
+            }
+
+            if (isPotential && isNameSpecified(seriesModel)) {
+                potentialData.push(seriesModel.name);
+            }
+        });
+
+        /**
+         * @type {Array.<string>}
+         * @private
+         */
+        this._availableNames = availableNames;
+
+        // If legend.data not specified in option, use availableNames as data,
+        // which is convinient for user preparing option.
+        var rawData = this.get('data') || potentialData;
+
+        var legendData = map(rawData, function (dataItem) {
+            // Can be string or number
+            if (typeof dataItem === 'string' || typeof dataItem === 'number') {
+                dataItem = {
+                    name: dataItem
+                };
+            }
+            return new Model(dataItem, this, this.ecModel);
+        }, this);
+
+        /**
+         * @type {Array.<module:echarts/model/Model>}
+         * @private
+         */
+        this._data = legendData;
+    },
+
+    /**
+     * @return {Array.<module:echarts/model/Model>}
+     */
+    getData: function () {
+        return this._data;
+    },
+
+    /**
+     * @param {string} name
+     */
+    select: function (name) {
+        var selected = this.option.selected;
+        var selectedMode = this.get('selectedMode');
+        if (selectedMode === 'single') {
+            var data = this._data;
+            each$1(data, function (dataItem) {
+                selected[dataItem.get('name')] = false;
+            });
+        }
+        selected[name] = true;
+    },
+
+    /**
+     * @param {string} name
+     */
+    unSelect: function (name) {
+        if (this.get('selectedMode') !== 'single') {
+            this.option.selected[name] = false;
+        }
+    },
+
+    /**
+     * @param {string} name
+     */
+    toggleSelected: function (name) {
+        var selected = this.option.selected;
+        // Default is true
+        if (!selected.hasOwnProperty(name)) {
+            selected[name] = true;
+        }
+        this[selected[name] ? 'unSelect' : 'select'](name);
+    },
+
+    /**
+     * @param {string} name
+     */
+    isSelected: function (name) {
+        var selected = this.option.selected;
+        return !(selected.hasOwnProperty(name) && !selected[name])
+            && indexOf(this._availableNames, name) >= 0;
+    },
+
+    defaultOption: {
+        // 一级层叠
+        zlevel: 0,
+        // 二级层叠
+        z: 4,
+        show: true,
+
+        // 布局方式，默认为水平布局，可选为：
+        // 'horizontal' | 'vertical'
+        orient: 'horizontal',
+
+        left: 'center',
+        // right: 'center',
+
+        top: 0,
+        // bottom: null,
+
+        // 水平对齐
+        // 'auto' | 'left' | 'right'
+        // 默认为 'auto', 根据 x 的位置判断是左对齐还是右对齐
+        align: 'auto',
+
+        backgroundColor: 'rgba(0,0,0,0)',
+        // 图例边框颜色
+        borderColor: '#ccc',
+        borderRadius: 0,
+        // 图例边框线宽，单位px，默认为0（无边框）
+        borderWidth: 0,
+        // 图例内边距，单位px，默认各方向内边距为5，
+        // 接受数组分别设定上右下左边距，同css
+        padding: 5,
+        // 各个item之间的间隔，单位px，默认为10，
+        // 横向布局时为水平间隔，纵向布局时为纵向间隔
+        itemGap: 10,
+        // 图例图形宽度
+        itemWidth: 25,
+        // 图例图形高度
+        itemHeight: 14,
+
+        // 图例关闭时候的颜色
+        inactiveColor: '#ccc',
+
+        textStyle: {
+            // 图例文字颜色
+            color: '#333'
+        },
+        // formatter: '',
+        // 选择模式，默认开启图例开关
+        selectedMode: true,
+        // 配置默认选中状态，可配合LEGEND.SELECTED事件做动态数据载入
+        // selected: null,
+        // 图例内容（详见legend.data，数组中每一项代表一个item
+        // data: [],
+
+        // Tooltip 相关配置
+        tooltip: {
+            show: false
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function legendSelectActionHandler(methodName, payload, ecModel) {
+    var selectedMap = {};
+    var isToggleSelect = methodName === 'toggleSelected';
+    var isSelected;
+    // Update all legend components
+    ecModel.eachComponent('legend', function (legendModel) {
+        if (isToggleSelect && isSelected != null) {
+            // Force other legend has same selected status
+            // Or the first is toggled to true and other are toggled to false
+            // In the case one legend has some item unSelected in option. And if other legend
+            // doesn't has the item, they will assume it is selected.
+            legendModel[isSelected ? 'select' : 'unSelect'](payload.name);
+        }
+        else {
+            legendModel[methodName](payload.name);
+            isSelected = legendModel.isSelected(payload.name);
+        }
+        var legendData = legendModel.getData();
+        each$1(legendData, function (model) {
+            var name = model.get('name');
+            // Wrap element
+            if (name === '\n' || name === '') {
+                return;
+            }
+            var isItemSelected = legendModel.isSelected(name);
+            if (selectedMap.hasOwnProperty(name)) {
+                // Unselected if any legend is unselected
+                selectedMap[name] = selectedMap[name] && isItemSelected;
+            }
+            else {
+                selectedMap[name] = isItemSelected;
+            }
+        });
+    });
+    // Return the event explicitly
+    return {
+        name: payload.name,
+        selected: selectedMap
+    };
+}
+/**
+ * @event legendToggleSelect
+ * @type {Object}
+ * @property {string} type 'legendToggleSelect'
+ * @property {string} [from]
+ * @property {string} name Series name or data item name
+ */
+registerAction(
+    'legendToggleSelect', 'legendselectchanged',
+    curry(legendSelectActionHandler, 'toggleSelected')
+);
+
+/**
+ * @event legendSelect
+ * @type {Object}
+ * @property {string} type 'legendSelect'
+ * @property {string} name Series name or data item name
+ */
+registerAction(
+    'legendSelect', 'legendselected',
+    curry(legendSelectActionHandler, 'select')
+);
+
+/**
+ * @event legendUnSelect
+ * @type {Object}
+ * @property {string} type 'legendUnSelect'
+ * @property {string} name Series name or data item name
+ */
+registerAction(
+    'legendUnSelect', 'legendunselected',
+    curry(legendSelectActionHandler, 'unSelect')
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Layout list like component.
+ * It will box layout each items in group of component and then position the whole group in the viewport
+ * @param {module:zrender/group/Group} group
+ * @param {module:echarts/model/Component} componentModel
+ * @param {module:echarts/ExtensionAPI}
+ */
+function layout$3(group, componentModel, api) {
+    var boxLayoutParams = componentModel.getBoxLayoutParams();
+    var padding = componentModel.get('padding');
+    var viewportSize = {width: api.getWidth(), height: api.getHeight()};
+
+    var rect = getLayoutRect(
+        boxLayoutParams,
+        viewportSize,
+        padding
+    );
+
+    box(
+        componentModel.get('orient'),
+        group,
+        componentModel.get('itemGap'),
+        rect.width,
+        rect.height
+    );
+
+    positionElement(
+        group,
+        boxLayoutParams,
+        viewportSize,
+        padding
+    );
+}
+
+function makeBackground(rect, componentModel) {
+    var padding = normalizeCssArray$1(
+        componentModel.get('padding')
+    );
+    var style = componentModel.getItemStyle(['color', 'opacity']);
+    style.fill = componentModel.get('backgroundColor');
+    var rect = new Rect({
+        shape: {
+            x: rect.x - padding[3],
+            y: rect.y - padding[0],
+            width: rect.width + padding[1] + padding[3],
+            height: rect.height + padding[0] + padding[2],
+            r: componentModel.get('borderRadius')
+        },
+        style: style,
+        silent: true,
+        z2: -1
+    });
+    // FIXME
+    // `subPixelOptimizeRect` may bring some gap between edge of viewpart
+    // and background rect when setting like `left: 0`, `top: 0`.
+    // graphic.subPixelOptimizeRect(rect);
+
+    return rect;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var curry$4 = curry;
+var each$16 = each$1;
+var Group$3 = Group;
+
+var LegendView = extendComponentView({
+
+    type: 'legend.plain',
+
+    newlineDisabled: false,
+
+    /**
+     * @override
+     */
+    init: function () {
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this.group.add(this._contentGroup = new Group$3());
+
+        /**
+         * @private
+         * @type {module:zrender/Element}
+         */
+        this._backgroundEl;
+    },
+
+    /**
+     * @protected
+     */
+    getContentGroup: function () {
+        return this._contentGroup;
+    },
+
+    /**
+     * @override
+     */
+    render: function (legendModel, ecModel, api) {
+
+        this.resetInner();
+
+        if (!legendModel.get('show', true)) {
+            return;
+        }
+
+        var itemAlign = legendModel.get('align');
+        if (!itemAlign || itemAlign === 'auto') {
+            itemAlign = (
+                legendModel.get('left') === 'right'
+                && legendModel.get('orient') === 'vertical'
+            ) ? 'right' : 'left';
+        }
+
+        this.renderInner(itemAlign, legendModel, ecModel, api);
+
+        // Perform layout.
+        var positionInfo = legendModel.getBoxLayoutParams();
+        var viewportSize = {width: api.getWidth(), height: api.getHeight()};
+        var padding = legendModel.get('padding');
+
+        var maxSize = getLayoutRect(positionInfo, viewportSize, padding);
+        var mainRect = this.layoutInner(legendModel, itemAlign, maxSize);
+
+        // Place mainGroup, based on the calculated `mainRect`.
+        var layoutRect = getLayoutRect(
+            defaults({width: mainRect.width, height: mainRect.height}, positionInfo),
+            viewportSize,
+            padding
+        );
+        this.group.attr('position', [layoutRect.x - mainRect.x, layoutRect.y - mainRect.y]);
+
+        // Render background after group is layout.
+        this.group.add(
+            this._backgroundEl = makeBackground(mainRect, legendModel)
+        );
+    },
+
+    /**
+     * @protected
+     */
+    resetInner: function () {
+        this.getContentGroup().removeAll();
+        this._backgroundEl && this.group.remove(this._backgroundEl);
+    },
+
+    /**
+     * @protected
+     */
+    renderInner: function (itemAlign, legendModel, ecModel, api) {
+        var contentGroup = this.getContentGroup();
+        var legendDrawnMap = createHashMap();
+        var selectMode = legendModel.get('selectedMode');
+
+        var excludeSeriesId = [];
+        ecModel.eachRawSeries(function (seriesModel) {
+            !seriesModel.get('legendHoverLink') && excludeSeriesId.push(seriesModel.id);
+        });
+
+        each$16(legendModel.getData(), function (itemModel, dataIndex) {
+            var name = itemModel.get('name');
+
+            // Use empty string or \n as a newline string
+            if (!this.newlineDisabled && (name === '' || name === '\n')) {
+                contentGroup.add(new Group$3({
+                    newline: true
+                }));
+                return;
+            }
+
+            // Representitive series.
+            var seriesModel = ecModel.getSeriesByName(name)[0];
+
+            if (legendDrawnMap.get(name)) {
+                // Have been drawed
+                return;
+            }
+
+            // Series legend
+            if (seriesModel) {
+                var data = seriesModel.getData();
+                var color = data.getVisual('color');
+
+                // If color is a callback function
+                if (typeof color === 'function') {
+                    // Use the first data
+                    color = color(seriesModel.getDataParams(0));
+                }
+
+                // Using rect symbol defaultly
+                var legendSymbolType = data.getVisual('legendSymbol') || 'roundRect';
+                var symbolType = data.getVisual('symbol');
+
+                var itemGroup = this._createItem(
+                    name, dataIndex, itemModel, legendModel,
+                    legendSymbolType, symbolType,
+                    itemAlign, color,
+                    selectMode
+                );
+
+                itemGroup.on('click', curry$4(dispatchSelectAction, name, api))
+                    .on('mouseover', curry$4(dispatchHighlightAction, seriesModel, null, api, excludeSeriesId))
+                    .on('mouseout', curry$4(dispatchDownplayAction, seriesModel, null, api, excludeSeriesId));
+
+                legendDrawnMap.set(name, true);
+            }
+            else {
+                // Data legend of pie, funnel
+                ecModel.eachRawSeries(function (seriesModel) {
+                    // In case multiple series has same data name
+                    if (legendDrawnMap.get(name)) {
+                        return;
+                    }
+
+                    if (seriesModel.legendDataProvider) {
+                        var data = seriesModel.legendDataProvider();
+                        var idx = data.indexOfName(name);
+                        if (idx < 0) {
+                            return;
+                        }
+
+                        var color = data.getItemVisual(idx, 'color');
+
+                        var legendSymbolType = 'roundRect';
+
+                        var itemGroup = this._createItem(
+                            name, dataIndex, itemModel, legendModel,
+                            legendSymbolType, null,
+                            itemAlign, color,
+                            selectMode
+                        );
+
+                        // FIXME: consider different series has items with the same name.
+                        itemGroup.on('click', curry$4(dispatchSelectAction, name, api))
+                            // FIXME Should not specify the series name
+                            .on('mouseover', curry$4(dispatchHighlightAction, seriesModel, name, api, excludeSeriesId))
+                            .on('mouseout', curry$4(dispatchDownplayAction, seriesModel, name, api, excludeSeriesId));
+
+                        legendDrawnMap.set(name, true);
+                    }
+
+                }, this);
+            }
+
+            if (__DEV__) {
+                if (!legendDrawnMap.get(name)) {
+                    console.warn(name + ' series not exists. Legend data should be same with series name or data name.');
+                }
+            }
+        }, this);
+    },
+
+    _createItem: function (
+        name, dataIndex, itemModel, legendModel,
+        legendSymbolType, symbolType,
+        itemAlign, color, selectMode
+    ) {
+        var itemWidth = legendModel.get('itemWidth');
+        var itemHeight = legendModel.get('itemHeight');
+        var inactiveColor = legendModel.get('inactiveColor');
+        var symbolKeepAspect = legendModel.get('symbolKeepAspect');
+
+        var isSelected = legendModel.isSelected(name);
+        var itemGroup = new Group$3();
+
+        var textStyleModel = itemModel.getModel('textStyle');
+
+        var itemIcon = itemModel.get('icon');
+
+        var tooltipModel = itemModel.getModel('tooltip');
+        var legendGlobalTooltipModel = tooltipModel.parentModel;
+
+        // Use user given icon first
+        legendSymbolType = itemIcon || legendSymbolType;
+        itemGroup.add(createSymbol(
+            legendSymbolType,
+            0,
+            0,
+            itemWidth,
+            itemHeight,
+            isSelected ? color : inactiveColor,
+            // symbolKeepAspect default true for legend
+            symbolKeepAspect == null ? true : symbolKeepAspect
+        ));
+
+        // Compose symbols
+        // PENDING
+        if (!itemIcon && symbolType
+            // At least show one symbol, can't be all none
+            && ((symbolType !== legendSymbolType) || symbolType == 'none')
+        ) {
+            var size = itemHeight * 0.8;
+            if (symbolType === 'none') {
+                symbolType = 'circle';
+            }
+            // Put symbol in the center
+            itemGroup.add(createSymbol(
+                symbolType,
+                (itemWidth - size) / 2,
+                (itemHeight - size) / 2,
+                size,
+                size,
+                isSelected ? color : inactiveColor,
+                // symbolKeepAspect default true for legend
+                symbolKeepAspect == null ? true : symbolKeepAspect
+            ));
+        }
+
+        var textX = itemAlign === 'left' ? itemWidth + 5 : -5;
+        var textAlign = itemAlign;
+
+        var formatter = legendModel.get('formatter');
+        var content = name;
+        if (typeof formatter === 'string' && formatter) {
+            content = formatter.replace('{name}', name != null ? name : '');
+        }
+        else if (typeof formatter === 'function') {
+            content = formatter(name);
+        }
+
+        itemGroup.add(new Text({
+            style: setTextStyle({}, textStyleModel, {
+                text: content,
+                x: textX,
+                y: itemHeight / 2,
+                textFill: isSelected ? textStyleModel.getTextColor() : inactiveColor,
+                textAlign: textAlign,
+                textVerticalAlign: 'middle'
+            })
+        }));
+
+        // Add a invisible rect to increase the area of mouse hover
+        var hitRect = new Rect({
+            shape: itemGroup.getBoundingRect(),
+            invisible: true,
+            tooltip: tooltipModel.get('show') ? extend({
+                content: name,
+                // Defaul formatter
+                formatter: legendGlobalTooltipModel.get('formatter', true) || function () {
+                    return name;
+                },
+                formatterParams: {
+                    componentType: 'legend',
+                    legendIndex: legendModel.componentIndex,
+                    name: name,
+                    $vars: ['name']
+                }
+            }, tooltipModel.option) : null
+        });
+        itemGroup.add(hitRect);
+
+        itemGroup.eachChild(function (child) {
+            child.silent = true;
+        });
+
+        hitRect.silent = !selectMode;
+
+        this.getContentGroup().add(itemGroup);
+
+        setHoverStyle(itemGroup);
+
+        itemGroup.__legendDataIndex = dataIndex;
+
+        return itemGroup;
+    },
+
+    /**
+     * @protected
+     */
+    layoutInner: function (legendModel, itemAlign, maxSize) {
+        var contentGroup = this.getContentGroup();
+
+        // Place items in contentGroup.
+        box(
+            legendModel.get('orient'),
+            contentGroup,
+            legendModel.get('itemGap'),
+            maxSize.width,
+            maxSize.height
+        );
+
+        var contentRect = contentGroup.getBoundingRect();
+        contentGroup.attr('position', [-contentRect.x, -contentRect.y]);
+
+        return this.group.getBoundingRect();
+    }
+
+});
+
+function dispatchSelectAction(name, api) {
+    api.dispatchAction({
+        type: 'legendToggleSelect',
+        name: name
+    });
+}
+
+function dispatchHighlightAction(seriesModel, dataName, api, excludeSeriesId) {
+    // If element hover will move to a hoverLayer.
+    var el = api.getZr().storage.getDisplayList()[0];
+    if (!(el && el.useHoverLayer)) {
+        api.dispatchAction({
+            type: 'highlight',
+            seriesName: seriesModel.name,
+            name: dataName,
+            excludeSeriesId: excludeSeriesId
+        });
+    }
+}
+
+function dispatchDownplayAction(seriesModel, dataName, api, excludeSeriesId) {
+    // If element hover will move to a hoverLayer.
+    var el = api.getZr().storage.getDisplayList()[0];
+    if (!(el && el.useHoverLayer)) {
+        api.dispatchAction({
+            type: 'downplay',
+            seriesName: seriesModel.name,
+            name: dataName,
+            excludeSeriesId: excludeSeriesId
+        });
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var legendFilter = function (ecModel) {
+
+    var legendModels = ecModel.findComponents({
+        mainType: 'legend'
+    });
+    if (legendModels && legendModels.length) {
+        ecModel.filterSeries(function (series) {
+            // If in any legend component the status is not selected.
+            // Because in legend series is assumed selected when it is not in the legend data.
+            for (var i = 0; i < legendModels.length; i++) {
+                if (!legendModels[i].isSelected(series.name)) {
+                    return false;
+                }
+            }
+            return true;
+        });
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+// Do not contain scrollable legend, for sake of file size.
+
+// Series Filter
+registerProcessor(legendFilter);
+
+ComponentModel.registerSubTypeDefaulter('legend', function () {
+    // Default 'plain' when no type specified.
+    return 'plain';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ScrollableLegendModel = LegendModel.extend({
+
+    type: 'legend.scroll',
+
+    /**
+     * @param {number} scrollDataIndex
+     */
+    setScrollDataIndex: function (scrollDataIndex) {
+        this.option.scrollDataIndex = scrollDataIndex;
+    },
+
+    defaultOption: {
+        scrollDataIndex: 0,
+        pageButtonItemGap: 5,
+        pageButtonGap: null,
+        pageButtonPosition: 'end', // 'start' or 'end'
+        pageFormatter: '{current}/{total}', // If null/undefined, do not show page.
+        pageIcons: {
+            horizontal: ['M0,0L12,-10L12,10z', 'M0,0L-12,-10L-12,10z'],
+            vertical: ['M0,0L20,0L10,-20z', 'M0,0L20,0L10,20z']
+        },
+        pageIconColor: '#2f4554',
+        pageIconInactiveColor: '#aaa',
+        pageIconSize: 15, // Can be [10, 3], which represents [width, height]
+        pageTextStyle: {
+            color: '#333'
+        },
+
+        animationDurationUpdate: 800
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel, extraOpt) {
+        var inputPositionParams = getLayoutParams(option);
+
+        ScrollableLegendModel.superCall(this, 'init', option, parentModel, ecModel, extraOpt);
+
+        mergeAndNormalizeLayoutParams(this, option, inputPositionParams);
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (option, extraOpt) {
+        ScrollableLegendModel.superCall(this, 'mergeOption', option, extraOpt);
+
+        mergeAndNormalizeLayoutParams(this, this.option, option);
+    },
+
+    getOrient: function () {
+        return this.get('orient') === 'vertical'
+            ? {index: 1, name: 'vertical'}
+            : {index: 0, name: 'horizontal'};
+    }
+
+});
+
+// Do not `ignoreSize` to enable setting {left: 10, right: 10}.
+function mergeAndNormalizeLayoutParams(legendModel, target, raw) {
+    var orient = legendModel.getOrient();
+    var ignoreSize = [1, 1];
+    ignoreSize[orient.index] = 0;
+    mergeLayoutParam(target, raw, {
+        type: 'box', ignoreSize: ignoreSize
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Separate legend and scrollable legend to reduce package size.
+ */
+
+var Group$4 = Group;
+
+var WH$1 = ['width', 'height'];
+var XY$1 = ['x', 'y'];
+
+var ScrollableLegendView = LegendView.extend({
+
+    type: 'legend.scroll',
+
+    newlineDisabled: true,
+
+    init: function () {
+
+        ScrollableLegendView.superCall(this, 'init');
+
+        /**
+         * @private
+         * @type {number} For `scroll`.
+         */
+        this._currentIndex = 0;
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this.group.add(this._containerGroup = new Group$4());
+        this._containerGroup.add(this.getContentGroup());
+
+        /**
+         * @private
+         * @type {module:zrender/container/Group}
+         */
+        this.group.add(this._controllerGroup = new Group$4());
+
+        /**
+         *
+         * @private
+         */
+        this._showController;
+    },
+
+    /**
+     * @override
+     */
+    resetInner: function () {
+        ScrollableLegendView.superCall(this, 'resetInner');
+
+        this._controllerGroup.removeAll();
+        this._containerGroup.removeClipPath();
+        this._containerGroup.__rectSize = null;
+    },
+
+    /**
+     * @override
+     */
+    renderInner: function (itemAlign, legendModel, ecModel, api) {
+        var me = this;
+
+        // Render content items.
+        ScrollableLegendView.superCall(this, 'renderInner', itemAlign, legendModel, ecModel, api);
+
+        var controllerGroup = this._controllerGroup;
+
+        var pageIconSize = legendModel.get('pageIconSize', true);
+        if (!isArray(pageIconSize)) {
+            pageIconSize = [pageIconSize, pageIconSize];
+        }
+
+        createPageButton('pagePrev', 0);
+
+        var pageTextStyleModel = legendModel.getModel('pageTextStyle');
+        controllerGroup.add(new Text({
+            name: 'pageText',
+            style: {
+                textFill: pageTextStyleModel.getTextColor(),
+                font: pageTextStyleModel.getFont(),
+                textVerticalAlign: 'middle',
+                textAlign: 'center'
+            },
+            silent: true
+        }));
+
+        createPageButton('pageNext', 1);
+
+        function createPageButton(name, iconIdx) {
+            var pageDataIndexName = name + 'DataIndex';
+            var icon = createIcon(
+                legendModel.get('pageIcons', true)[legendModel.getOrient().name][iconIdx],
+                {
+                    // Buttons will be created in each render, so we do not need
+                    // to worry about avoiding using legendModel kept in scope.
+                    onclick: bind(
+                        me._pageGo, me, pageDataIndexName, legendModel, api
+                    )
+                },
+                {
+                    x: -pageIconSize[0] / 2,
+                    y: -pageIconSize[1] / 2,
+                    width: pageIconSize[0],
+                    height: pageIconSize[1]
+                }
+            );
+            icon.name = name;
+            controllerGroup.add(icon);
+        }
+    },
+
+    /**
+     * @override
+     */
+    layoutInner: function (legendModel, itemAlign, maxSize) {
+        var contentGroup = this.getContentGroup();
+        var containerGroup = this._containerGroup;
+        var controllerGroup = this._controllerGroup;
+
+        var orientIdx = legendModel.getOrient().index;
+        var wh = WH$1[orientIdx];
+        var hw = WH$1[1 - orientIdx];
+        var yx = XY$1[1 - orientIdx];
+
+        // Place items in contentGroup.
+        box(
+            legendModel.get('orient'),
+            contentGroup,
+            legendModel.get('itemGap'),
+            !orientIdx ? null : maxSize.width,
+            orientIdx ? null : maxSize.height
+        );
+
+        box(
+            // Buttons in controller are layout always horizontally.
+            'horizontal',
+            controllerGroup,
+            legendModel.get('pageButtonItemGap', true)
+        );
+
+        var contentRect = contentGroup.getBoundingRect();
+        var controllerRect = controllerGroup.getBoundingRect();
+        var showController = this._showController = contentRect[wh] > maxSize[wh];
+
+        var contentPos = [-contentRect.x, -contentRect.y];
+        // Remain contentPos when scroll animation perfroming.
+        contentPos[orientIdx] = contentGroup.position[orientIdx];
+
+        // Layout container group based on 0.
+        var containerPos = [0, 0];
+        var controllerPos = [-controllerRect.x, -controllerRect.y];
+        var pageButtonGap = retrieve2(
+            legendModel.get('pageButtonGap', true), legendModel.get('itemGap', true)
+        );
+
+        // Place containerGroup and controllerGroup and contentGroup.
+        if (showController) {
+            var pageButtonPosition = legendModel.get('pageButtonPosition', true);
+            // controller is on the right / bottom.
+            if (pageButtonPosition === 'end') {
+                controllerPos[orientIdx] += maxSize[wh] - controllerRect[wh];
+            }
+            // controller is on the left / top.
+            else {
+                containerPos[orientIdx] += controllerRect[wh] + pageButtonGap;
+            }
+        }
+
+        // Always align controller to content as 'middle'.
+        controllerPos[1 - orientIdx] += contentRect[hw] / 2 - controllerRect[hw] / 2;
+
+        contentGroup.attr('position', contentPos);
+        containerGroup.attr('position', containerPos);
+        controllerGroup.attr('position', controllerPos);
+
+        // Calculate `mainRect` and set `clipPath`.
+        // mainRect should not be calculated by `this.group.getBoundingRect()`
+        // for sake of the overflow.
+        var mainRect = this.group.getBoundingRect();
+        var mainRect = {x: 0, y: 0};
+        // Consider content may be overflow (should be clipped).
+        mainRect[wh] = showController ? maxSize[wh] : contentRect[wh];
+        mainRect[hw] = Math.max(contentRect[hw], controllerRect[hw]);
+        // `containerRect[yx] + containerPos[1 - orientIdx]` is 0.
+        mainRect[yx] = Math.min(0, controllerRect[yx] + controllerPos[1 - orientIdx]);
+
+        containerGroup.__rectSize = maxSize[wh];
+        if (showController) {
+            var clipShape = {x: 0, y: 0};
+            clipShape[wh] = Math.max(maxSize[wh] - controllerRect[wh] - pageButtonGap, 0);
+            clipShape[hw] = mainRect[hw];
+            containerGroup.setClipPath(new Rect({shape: clipShape}));
+            // Consider content may be larger than container, container rect
+            // can not be obtained from `containerGroup.getBoundingRect()`.
+            containerGroup.__rectSize = clipShape[wh];
+        }
+        else {
+            // Do not remove or ignore controller. Keep them set as place holders.
+            controllerGroup.eachChild(function (child) {
+                child.attr({invisible: true, silent: true});
+            });
+        }
+
+        // Content translate animation.
+        var pageInfo = this._getPageInfo(legendModel);
+        pageInfo.pageIndex != null && updateProps(
+            contentGroup,
+            {position: pageInfo.contentPosition},
+            // When switch from "show controller" to "not show controller", view should be
+            // updated immediately without animation, otherwise causes weird efffect.
+            showController ? legendModel : false
+        );
+
+        this._updatePageInfoView(legendModel, pageInfo);
+
+        return mainRect;
+    },
+
+    _pageGo: function (to, legendModel, api) {
+        var scrollDataIndex = this._getPageInfo(legendModel)[to];
+
+        scrollDataIndex != null && api.dispatchAction({
+            type: 'legendScroll',
+            scrollDataIndex: scrollDataIndex,
+            legendId: legendModel.id
+        });
+    },
+
+    _updatePageInfoView: function (legendModel, pageInfo) {
+        var controllerGroup = this._controllerGroup;
+
+        each$1(['pagePrev', 'pageNext'], function (name) {
+            var canJump = pageInfo[name + 'DataIndex'] != null;
+            var icon = controllerGroup.childOfName(name);
+            if (icon) {
+                icon.setStyle(
+                    'fill',
+                    canJump
+                        ? legendModel.get('pageIconColor', true)
+                        : legendModel.get('pageIconInactiveColor', true)
+                );
+                icon.cursor = canJump ? 'pointer' : 'default';
+            }
+        });
+
+        var pageText = controllerGroup.childOfName('pageText');
+        var pageFormatter = legendModel.get('pageFormatter');
+        var pageIndex = pageInfo.pageIndex;
+        var current = pageIndex != null ? pageIndex + 1 : 0;
+        var total = pageInfo.pageCount;
+
+        pageText && pageFormatter && pageText.setStyle(
+            'text',
+            isString(pageFormatter)
+                ? pageFormatter.replace('{current}', current).replace('{total}', total)
+                : pageFormatter({current: current, total: total})
+        );
+    },
+
+    /**
+     * @param {module:echarts/model/Model} legendModel
+     * @return {Object} {
+     *  contentPosition: Array.<number>, null when data item not found.
+     *  pageIndex: number, null when data item not found.
+     *  pageCount: number, always be a number, can be 0.
+     *  pagePrevDataIndex: number, null when no next page.
+     *  pageNextDataIndex: number, null when no previous page.
+     * }
+     */
+    _getPageInfo: function (legendModel) {
+        // Align left or top by the current dataIndex.
+        var currDataIndex = legendModel.get('scrollDataIndex', true);
+        var contentGroup = this.getContentGroup();
+        var contentRect = contentGroup.getBoundingRect();
+        var containerRectSize = this._containerGroup.__rectSize;
+
+        var orientIdx = legendModel.getOrient().index;
+        var wh = WH$1[orientIdx];
+        var hw = WH$1[1 - orientIdx];
+        var xy = XY$1[orientIdx];
+        var contentPos = contentGroup.position.slice();
+
+        var pageIndex;
+        var pagePrevDataIndex;
+        var pageNextDataIndex;
+
+        var targetItemGroup;
+        if (this._showController) {
+            contentGroup.eachChild(function (child) {
+                if (child.__legendDataIndex === currDataIndex) {
+                    targetItemGroup = child;
+                }
+            });
+        }
+        else {
+            targetItemGroup = contentGroup.childAt(0);
+        }
+
+        var pageCount = containerRectSize ? Math.ceil(contentRect[wh] / containerRectSize) : 0;
+
+        if (targetItemGroup) {
+            var itemRect = targetItemGroup.getBoundingRect();
+            var itemLoc = targetItemGroup.position[orientIdx] + itemRect[xy];
+            contentPos[orientIdx] = -itemLoc - contentRect[xy];
+            pageIndex = Math.floor(
+                pageCount * (itemLoc + itemRect[xy] + containerRectSize / 2) / contentRect[wh]
+            );
+            pageIndex = (contentRect[wh] && pageCount)
+                ? Math.max(0, Math.min(pageCount - 1, pageIndex))
+                : -1;
+
+            var winRect = {x: 0, y: 0};
+            winRect[wh] = containerRectSize;
+            winRect[hw] = contentRect[hw];
+            winRect[xy] = -contentPos[orientIdx] - contentRect[xy];
+
+            var startIdx;
+            var children = contentGroup.children();
+
+            contentGroup.eachChild(function (child, index) {
+                var itemRect = getItemRect(child);
+
+                if (itemRect.intersect(winRect)) {
+                    startIdx == null && (startIdx = index);
+                    // It is user-friendly that the last item shown in the
+                    // current window is shown at the begining of next window.
+                    pageNextDataIndex = child.__legendDataIndex;
+                }
+
+                // If the last item is shown entirely, no next page.
+                if (index === children.length - 1
+                    && itemRect[xy] + itemRect[wh] <= winRect[xy] + winRect[wh]
+                ) {
+                    pageNextDataIndex = null;
+                }
+            });
+
+            // Always align based on the left/top most item, so the left/top most
+            // item in the previous window is needed to be found here.
+            if (startIdx != null) {
+                var startItem = children[startIdx];
+                var startRect = getItemRect(startItem);
+                winRect[xy] = startRect[xy] + startRect[wh] - winRect[wh];
+
+                // If the first item is shown entirely, no previous page.
+                if (startIdx <= 0 && startRect[xy] >= winRect[xy]) {
+                    pagePrevDataIndex = null;
+                }
+                else {
+                    while (startIdx > 0 && getItemRect(children[startIdx - 1]).intersect(winRect)) {
+                        startIdx--;
+                    }
+                    pagePrevDataIndex = children[startIdx].__legendDataIndex;
+                }
+            }
+        }
+
+        return {
+            contentPosition: contentPos,
+            pageIndex: pageIndex,
+            pageCount: pageCount,
+            pagePrevDataIndex: pagePrevDataIndex,
+            pageNextDataIndex: pageNextDataIndex
+        };
+
+        function getItemRect(el) {
+            var itemRect = el.getBoundingRect().clone();
+            itemRect[xy] += el.position[orientIdx];
+            return itemRect;
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @event legendScroll
+ * @type {Object}
+ * @property {string} type 'legendScroll'
+ * @property {string} scrollDataIndex
+ */
+registerAction(
+    'legendScroll', 'legendscroll',
+    function (payload, ecModel) {
+        var scrollDataIndex = payload.scrollDataIndex;
+
+        scrollDataIndex != null && ecModel.eachComponent(
+            {mainType: 'legend', subType: 'scroll', query: payload},
+            function (legendModel) {
+                legendModel.setScrollDataIndex(scrollDataIndex);
+            }
+        );
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Legend component entry file8
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentModel({
+
+    type: 'tooltip',
+
+    dependencies: ['axisPointer'],
+
+    defaultOption: {
+        zlevel: 0,
+
+        z: 8,
+
+        show: true,
+
+        // tooltip主体内容
+        showContent: true,
+
+        // 'trigger' only works on coordinate system.
+        // 'item' | 'axis' | 'none'
+        trigger: 'item',
+
+        // 'click' | 'mousemove' | 'none'
+        triggerOn: 'mousemove|click',
+
+        alwaysShowContent: false,
+
+        displayMode: 'single', // 'single' | 'multipleByCoordSys'
+
+        // 位置 {Array} | {Function}
+        // position: null
+        // Consider triggered from axisPointer handle, verticalAlign should be 'middle'
+        // align: null,
+        // verticalAlign: null,
+
+        // 是否约束 content 在 viewRect 中。默认 false 是为了兼容以前版本。
+        confine: false,
+
+        // 内容格式器：{string}（Template） ¦ {Function}
+        // formatter: null
+
+        showDelay: 0,
+
+        // 隐藏延迟，单位ms
+        hideDelay: 100,
+
+        // 动画变换时间，单位s
+        transitionDuration: 0.4,
+
+        enterable: false,
+
+        // 提示背景颜色，默认为透明度为0.7的黑色
+        backgroundColor: 'rgba(50,50,50,0.7)',
+
+        // 提示边框颜色
+        borderColor: '#333',
+
+        // 提示边框圆角，单位px，默认为4
+        borderRadius: 4,
+
+        // 提示边框线宽，单位px，默认为0（无边框）
+        borderWidth: 0,
+
+        // 提示内边距，单位px，默认各方向内边距为5，
+        // 接受数组分别设定上右下左边距，同css
+        padding: 5,
+
+        // Extra css text
+        extraCssText: '',
+
+        // 坐标轴指示器，坐标轴触发有效
+        axisPointer: {
+            // 默认为直线
+            // 可选为：'line' | 'shadow' | 'cross'
+            type: 'line',
+
+            // type 为 line 的时候有效，指定 tooltip line 所在的轴，可选
+            // 可选 'x' | 'y' | 'angle' | 'radius' | 'auto'
+            // 默认 'auto'，会选择类型为 category 的轴，对于双数值轴，笛卡尔坐标系会默认选择 x 轴
+            // 极坐标系会默认选择 angle 轴
+            axis: 'auto',
+
+            animation: 'auto',
+            animationDurationUpdate: 200,
+            animationEasingUpdate: 'exponentialOut',
+
+            crossStyle: {
+                color: '#999',
+                width: 1,
+                type: 'dashed',
+
+                // TODO formatter
+                textStyle: {}
+            }
+
+            // lineStyle and shadowStyle should not be specified here,
+            // otherwise it will always override those styles on option.axisPointer.
+        },
+        textStyle: {
+            color: '#fff',
+            fontSize: 14
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$18 = each$1;
+var toCamelCase$1 = toCamelCase;
+
+var vendors = ['', '-webkit-', '-moz-', '-o-'];
+
+var gCssText = 'position:absolute;display:block;border-style:solid;white-space:nowrap;z-index:9999999;';
+
+/**
+ * @param {number} duration
+ * @return {string}
+ * @inner
+ */
+function assembleTransition(duration) {
+    var transitionCurve = 'cubic-bezier(0.23, 1, 0.32, 1)';
+    var transitionText = 'left ' + duration + 's ' + transitionCurve + ','
+                        + 'top ' + duration + 's ' + transitionCurve;
+    return map(vendors, function (vendorPrefix) {
+        return vendorPrefix + 'transition:' + transitionText;
+    }).join(';');
+}
+
+/**
+ * @param {Object} textStyle
+ * @return {string}
+ * @inner
+ */
+function assembleFont(textStyleModel) {
+    var cssText = [];
+
+    var fontSize = textStyleModel.get('fontSize');
+    var color = textStyleModel.getTextColor();
+
+    color && cssText.push('color:' + color);
+
+    cssText.push('font:' + textStyleModel.getFont());
+
+    fontSize &&
+        cssText.push('line-height:' + Math.round(fontSize * 3 / 2) + 'px');
+
+    each$18(['decoration', 'align'], function (name) {
+        var val = textStyleModel.get(name);
+        val && cssText.push('text-' + name + ':' + val);
+    });
+
+    return cssText.join(';');
+}
+
+/**
+ * @param {Object} tooltipModel
+ * @return {string}
+ * @inner
+ */
+function assembleCssText(tooltipModel) {
+
+    var cssText = [];
+
+    var transitionDuration = tooltipModel.get('transitionDuration');
+    var backgroundColor = tooltipModel.get('backgroundColor');
+    var textStyleModel = tooltipModel.getModel('textStyle');
+    var padding = tooltipModel.get('padding');
+
+    // Animation transition. Do not animate when transitionDuration is 0.
+    transitionDuration &&
+        cssText.push(assembleTransition(transitionDuration));
+
+    if (backgroundColor) {
+        if (env$1.canvasSupported) {
+            cssText.push('background-Color:' + backgroundColor);
+        }
+        else {
+            // for ie
+            cssText.push(
+                'background-Color:#' + toHex(backgroundColor)
+            );
+            cssText.push('filter:alpha(opacity=70)');
+        }
+    }
+
+    // Border style
+    each$18(['width', 'color', 'radius'], function (name) {
+        var borderName = 'border-' + name;
+        var camelCase = toCamelCase$1(borderName);
+        var val = tooltipModel.get(camelCase);
+        val != null &&
+            cssText.push(borderName + ':' + val + (name === 'color' ? '' : 'px'));
+    });
+
+    // Text style
+    cssText.push(assembleFont(textStyleModel));
+
+    // Padding
+    if (padding != null) {
+        cssText.push('padding:' + normalizeCssArray$1(padding).join('px ') + 'px');
+    }
+
+    return cssText.join(';') + ';';
+}
+
+/**
+ * @alias module:echarts/component/tooltip/TooltipContent
+ * @constructor
+ */
+function TooltipContent(container, api) {
+    if (env$1.wxa) {
+        return null;
+    }
+
+    var el = document.createElement('div');
+    var zr = this._zr = api.getZr();
+
+    this.el = el;
+
+    this._x = api.getWidth() / 2;
+    this._y = api.getHeight() / 2;
+
+    container.appendChild(el);
+
+    this._container = container;
+
+    this._show = false;
+
+    /**
+     * @private
+     */
+    this._hideTimeout;
+
+    var self = this;
+    el.onmouseenter = function () {
+        // clear the timeout in hideLater and keep showing tooltip
+        if (self._enterable) {
+            clearTimeout(self._hideTimeout);
+            self._show = true;
+        }
+        self._inContent = true;
+    };
+    el.onmousemove = function (e) {
+        e = e || window.event;
+        if (!self._enterable) {
+            // Try trigger zrender event to avoid mouse
+            // in and out shape too frequently
+            var handler = zr.handler;
+            normalizeEvent(container, e, true);
+            handler.dispatch('mousemove', e);
+        }
+    };
+    el.onmouseleave = function () {
+        if (self._enterable) {
+            if (self._show) {
+                self.hideLater(self._hideDelay);
+            }
+        }
+        self._inContent = false;
+    };
+}
+
+TooltipContent.prototype = {
+
+    constructor: TooltipContent,
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    _enterable: true,
+
+    /**
+     * Update when tooltip is rendered
+     */
+    update: function () {
+        // FIXME
+        // Move this logic to ec main?
+        var container = this._container;
+        var stl = container.currentStyle
+            || document.defaultView.getComputedStyle(container);
+        var domStyle = container.style;
+        if (domStyle.position !== 'absolute' && stl.position !== 'absolute') {
+            domStyle.position = 'relative';
+        }
+        // Hide the tooltip
+        // PENDING
+        // this.hide();
+    },
+
+    show: function (tooltipModel) {
+        clearTimeout(this._hideTimeout);
+        var el = this.el;
+
+        el.style.cssText = gCssText + assembleCssText(tooltipModel)
+            // http://stackoverflow.com/questions/21125587/css3-transition-not-working-in-chrome-anymore
+            + ';left:' + this._x + 'px;top:' + this._y + 'px;'
+            + (tooltipModel.get('extraCssText') || '');
+
+        el.style.display = el.innerHTML ?  'block' : 'none';
+
+        this._show = true;
+    },
+
+    setContent: function (content) {
+        this.el.innerHTML = content == null ? '' : content;
+    },
+
+    setEnterable: function (enterable) {
+        this._enterable = enterable;
+    },
+
+    getSize: function () {
+        var el = this.el;
+        return [el.clientWidth, el.clientHeight];
+    },
+
+    moveTo: function (x, y) {
+        // xy should be based on canvas root. But tooltipContent is
+        // the sibling of canvas root. So padding of ec container
+        // should be considered here.
+        var zr = this._zr;
+        var viewportRootOffset;
+        if (zr && zr.painter && (viewportRootOffset = zr.painter.getViewportRootOffset())) {
+            x += viewportRootOffset.offsetLeft;
+            y += viewportRootOffset.offsetTop;
+        }
+
+        var style = this.el.style;
+        style.left = x + 'px';
+        style.top = y + 'px';
+
+        this._x = x;
+        this._y = y;
+    },
+
+    hide: function () {
+        this.el.style.display = 'none';
+        this._show = false;
+    },
+
+    hideLater: function (time) {
+        if (this._show && !(this._inContent && this._enterable)) {
+            if (time) {
+                this._hideDelay = time;
+                // Set show false to avoid invoke hideLater mutiple times
+                this._show = false;
+                this._hideTimeout = setTimeout(bind(this.hide, this), time);
+            }
+            else {
+                this.hide();
+            }
+        }
+    },
+
+    isShow: function () {
+        return this._show;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$3 = bind;
+var each$17 = each$1;
+var parsePercent$2 = parsePercent$1;
+
+var proxyRect = new Rect({
+    shape: {x: -1, y: -1, width: 2, height: 2}
+});
+
+extendComponentView({
+
+    type: 'tooltip',
+
+    init: function (ecModel, api) {
+        if (env$1.node) {
+            return;
+        }
+        var tooltipContent = new TooltipContent(api.getDom(), api);
+        this._tooltipContent = tooltipContent;
+    },
+
+    render: function (tooltipModel, ecModel, api) {
+        if (env$1.node || env$1.wxa) {
+            return;
+        }
+
+        // Reset
+        this.group.removeAll();
+
+        /**
+         * @private
+         * @type {module:echarts/component/tooltip/TooltipModel}
+         */
+        this._tooltipModel = tooltipModel;
+
+        /**
+         * @private
+         * @type {module:echarts/model/Global}
+         */
+        this._ecModel = ecModel;
+
+        /**
+         * @private
+         * @type {module:echarts/ExtensionAPI}
+         */
+        this._api = api;
+
+        /**
+         * Should be cleaned when render.
+         * @private
+         * @type {Array.<Array.<Object>>}
+         */
+        this._lastDataByCoordSys = null;
+
+        /**
+         * @private
+         * @type {boolean}
+         */
+        this._alwaysShowContent = tooltipModel.get('alwaysShowContent');
+
+        var tooltipContent = this._tooltipContent;
+        tooltipContent.update();
+        tooltipContent.setEnterable(tooltipModel.get('enterable'));
+
+        this._initGlobalListener();
+
+        this._keepShow();
+    },
+
+    _initGlobalListener: function () {
+        var tooltipModel = this._tooltipModel;
+        var triggerOn = tooltipModel.get('triggerOn');
+
+        register(
+            'itemTooltip',
+            this._api,
+            bind$3(function (currTrigger, e, dispatchAction) {
+                // If 'none', it is not controlled by mouse totally.
+                if (triggerOn !== 'none') {
+                    if (triggerOn.indexOf(currTrigger) >= 0) {
+                        this._tryShow(e, dispatchAction);
+                    }
+                    else if (currTrigger === 'leave') {
+                        this._hide(dispatchAction);
+                    }
+                }
+            }, this)
+        );
+    },
+
+    _keepShow: function () {
+        var tooltipModel = this._tooltipModel;
+        var ecModel = this._ecModel;
+        var api = this._api;
+
+        // Try to keep the tooltip show when refreshing
+        if (this._lastX != null
+            && this._lastY != null
+            // When user is willing to control tooltip totally using API,
+            // self.manuallyShowTip({x, y}) might cause tooltip hide,
+            // which is not expected.
+            && tooltipModel.get('triggerOn') !== 'none'
+        ) {
+            var self = this;
+            clearTimeout(this._refreshUpdateTimeout);
+            this._refreshUpdateTimeout = setTimeout(function () {
+                // Show tip next tick after other charts are rendered
+                // In case highlight action has wrong result
+                // FIXME
+                self.manuallyShowTip(tooltipModel, ecModel, api, {
+                    x: self._lastX,
+                    y: self._lastY
+                });
+            });
+        }
+    },
+
+    /**
+     * Show tip manually by
+     * dispatchAction({
+     *     type: 'showTip',
+     *     x: 10,
+     *     y: 10
+     * });
+     * Or
+     * dispatchAction({
+     *      type: 'showTip',
+     *      seriesIndex: 0,
+     *      dataIndex or dataIndexInside or name
+     * });
+     *
+     *  TODO Batch
+     */
+    manuallyShowTip: function (tooltipModel, ecModel, api, payload) {
+        if (payload.from === this.uid || env$1.node) {
+            return;
+        }
+
+        var dispatchAction = makeDispatchAction$1(payload, api);
+
+        // Reset ticket
+        this._ticket = '';
+
+        // When triggered from axisPointer.
+        var dataByCoordSys = payload.dataByCoordSys;
+
+        if (payload.tooltip && payload.x != null && payload.y != null) {
+            var el = proxyRect;
+            el.position = [payload.x, payload.y];
+            el.update();
+            el.tooltip = payload.tooltip;
+            // Manually show tooltip while view is not using zrender elements.
+            this._tryShow({
+                offsetX: payload.x,
+                offsetY: payload.y,
+                target: el
+            }, dispatchAction);
+        }
+        else if (dataByCoordSys) {
+            this._tryShow({
+                offsetX: payload.x,
+                offsetY: payload.y,
+                position: payload.position,
+                event: {},
+                dataByCoordSys: payload.dataByCoordSys,
+                tooltipOption: payload.tooltipOption
+            }, dispatchAction);
+        }
+        else if (payload.seriesIndex != null) {
+
+            if (this._manuallyAxisShowTip(tooltipModel, ecModel, api, payload)) {
+                return;
+            }
+
+            var pointInfo = findPointFromSeries(payload, ecModel);
+            var cx = pointInfo.point[0];
+            var cy = pointInfo.point[1];
+            if (cx != null && cy != null) {
+                this._tryShow({
+                    offsetX: cx,
+                    offsetY: cy,
+                    position: payload.position,
+                    target: pointInfo.el,
+                    event: {}
+                }, dispatchAction);
+            }
+        }
+        else if (payload.x != null && payload.y != null) {
+            // FIXME
+            // should wrap dispatchAction like `axisPointer/globalListener` ?
+            api.dispatchAction({
+                type: 'updateAxisPointer',
+                x: payload.x,
+                y: payload.y
+            });
+
+            this._tryShow({
+                offsetX: payload.x,
+                offsetY: payload.y,
+                position: payload.position,
+                target: api.getZr().findHover(payload.x, payload.y).target,
+                event: {}
+            }, dispatchAction);
+        }
+    },
+
+    manuallyHideTip: function (tooltipModel, ecModel, api, payload) {
+        var tooltipContent = this._tooltipContent;
+
+        if (!this._alwaysShowContent && this._tooltipModel) {
+            tooltipContent.hideLater(this._tooltipModel.get('hideDelay'));
+        }
+
+        this._lastX = this._lastY = null;
+
+        if (payload.from !== this.uid) {
+            this._hide(makeDispatchAction$1(payload, api));
+        }
+    },
+
+    // Be compatible with previous design, that is, when tooltip.type is 'axis' and
+    // dispatchAction 'showTip' with seriesIndex and dataIndex will trigger axis pointer
+    // and tooltip.
+    _manuallyAxisShowTip: function (tooltipModel, ecModel, api, payload) {
+        var seriesIndex = payload.seriesIndex;
+        var dataIndex = payload.dataIndex;
+        var coordSysAxesInfo = ecModel.getComponent('axisPointer').coordSysAxesInfo;
+
+        if (seriesIndex == null || dataIndex == null || coordSysAxesInfo == null) {
+            return;
+        }
+
+        var seriesModel = ecModel.getSeriesByIndex(seriesIndex);
+        if (!seriesModel) {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var tooltipModel = buildTooltipModel([
+            data.getItemModel(dataIndex),
+            seriesModel,
+            (seriesModel.coordinateSystem || {}).model,
+            tooltipModel
+        ]);
+
+        if (tooltipModel.get('trigger') !== 'axis') {
+            return;
+        }
+
+        api.dispatchAction({
+            type: 'updateAxisPointer',
+            seriesIndex: seriesIndex,
+            dataIndex: dataIndex,
+            position: payload.position
+        });
+
+        return true;
+    },
+
+    _tryShow: function (e, dispatchAction) {
+        var el = e.target;
+        var tooltipModel = this._tooltipModel;
+
+        if (!tooltipModel) {
+            return;
+        }
+
+        // Save mouse x, mouse y. So we can try to keep showing the tip if chart is refreshed
+        this._lastX = e.offsetX;
+        this._lastY = e.offsetY;
+
+        var dataByCoordSys = e.dataByCoordSys;
+        if (dataByCoordSys && dataByCoordSys.length) {
+            this._showAxisTooltip(dataByCoordSys, e);
+        }
+        // Always show item tooltip if mouse is on the element with dataIndex
+        else if (el && el.dataIndex != null) {
+            this._lastDataByCoordSys = null;
+            this._showSeriesItemTooltip(e, el, dispatchAction);
+        }
+        // Tooltip provided directly. Like legend.
+        else if (el && el.tooltip) {
+            this._lastDataByCoordSys = null;
+            this._showComponentItemTooltip(e, el, dispatchAction);
+        }
+        else {
+            this._lastDataByCoordSys = null;
+            this._hide(dispatchAction);
+        }
+    },
+
+    _showOrMove: function (tooltipModel, cb) {
+        // showDelay is used in this case: tooltip.enterable is set
+        // as true. User intent to move mouse into tooltip and click
+        // something. `showDelay` makes it easyer to enter the content
+        // but tooltip do not move immediately.
+        var delay = tooltipModel.get('showDelay');
+        cb = bind(cb, this);
+        clearTimeout(this._showTimout);
+        delay > 0
+            ? (this._showTimout = setTimeout(cb, delay))
+            : cb();
+    },
+
+    _showAxisTooltip: function (dataByCoordSys, e) {
+        var ecModel = this._ecModel;
+        var globalTooltipModel = this._tooltipModel;
+        var point = [e.offsetX, e.offsetY];
+        var singleDefaultHTML = [];
+        var singleParamsList = [];
+        var singleTooltipModel = buildTooltipModel([
+            e.tooltipOption,
+            globalTooltipModel
+        ]);
+
+        each$17(dataByCoordSys, function (itemCoordSys) {
+            // var coordParamList = [];
+            // var coordDefaultHTML = [];
+            // var coordTooltipModel = buildTooltipModel([
+            //     e.tooltipOption,
+            //     itemCoordSys.tooltipOption,
+            //     ecModel.getComponent(itemCoordSys.coordSysMainType, itemCoordSys.coordSysIndex),
+            //     globalTooltipModel
+            // ]);
+            // var displayMode = coordTooltipModel.get('displayMode');
+            // var paramsList = displayMode === 'single' ? singleParamsList : [];
+
+            each$17(itemCoordSys.dataByAxis, function (item) {
+                var axisModel = ecModel.getComponent(item.axisDim + 'Axis', item.axisIndex);
+                var axisValue = item.value;
+                var seriesDefaultHTML = [];
+
+                if (!axisModel || axisValue == null) {
+                    return;
+                }
+
+                var valueLabel = getValueLabel(
+                    axisValue, axisModel.axis, ecModel,
+                    item.seriesDataIndices,
+                    item.valueLabelOpt
+                );
+
+                each$1(item.seriesDataIndices, function (idxItem) {
+                    var series = ecModel.getSeriesByIndex(idxItem.seriesIndex);
+                    var dataIndex = idxItem.dataIndexInside;
+                    var dataParams = series && series.getDataParams(dataIndex);
+                    dataParams.axisDim = item.axisDim;
+                    dataParams.axisIndex = item.axisIndex;
+                    dataParams.axisType = item.axisType;
+                    dataParams.axisId = item.axisId;
+                    dataParams.axisValue = getAxisRawValue(axisModel.axis, axisValue);
+                    dataParams.axisValueLabel = valueLabel;
+
+                    if (dataParams) {
+                        singleParamsList.push(dataParams);
+                        seriesDefaultHTML.push(series.formatTooltip(dataIndex, true));
+                    }
+                });
+
+                // Default tooltip content
+                // FIXME
+                // (1) shold be the first data which has name?
+                // (2) themeRiver, firstDataIndex is array, and first line is unnecessary.
+                var firstLine = valueLabel;
+                singleDefaultHTML.push(
+                    (firstLine ? encodeHTML(firstLine) + '<br />' : '')
+                    + seriesDefaultHTML.join('<br />')
+                );
+            });
+        }, this);
+
+        // In most case, the second axis is shown upper than the first one.
+        singleDefaultHTML.reverse();
+        singleDefaultHTML = singleDefaultHTML.join('<br /><br />');
+
+        var positionExpr = e.position;
+        this._showOrMove(singleTooltipModel, function () {
+            if (this._updateContentNotChangedOnAxis(dataByCoordSys)) {
+                this._updatePosition(
+                    singleTooltipModel,
+                    positionExpr,
+                    point[0], point[1],
+                    this._tooltipContent,
+                    singleParamsList
+                );
+            }
+            else {
+                this._showTooltipContent(
+                    singleTooltipModel, singleDefaultHTML, singleParamsList, Math.random(),
+                    point[0], point[1], positionExpr
+                );
+            }
+        });
+
+        // Do not trigger events here, because this branch only be entered
+        // from dispatchAction.
+    },
+
+    _showSeriesItemTooltip: function (e, el, dispatchAction) {
+        var ecModel = this._ecModel;
+        // Use dataModel in element if possible
+        // Used when mouseover on a element like markPoint or edge
+        // In which case, the data is not main data in series.
+        var seriesIndex = el.seriesIndex;
+        var seriesModel = ecModel.getSeriesByIndex(seriesIndex);
+
+        // For example, graph link.
+        var dataModel = el.dataModel || seriesModel;
+        var dataIndex = el.dataIndex;
+        var dataType = el.dataType;
+        var data = dataModel.getData();
+
+        var tooltipModel = buildTooltipModel([
+            data.getItemModel(dataIndex),
+            dataModel,
+            seriesModel && (seriesModel.coordinateSystem || {}).model,
+            this._tooltipModel
+        ]);
+
+        var tooltipTrigger = tooltipModel.get('trigger');
+        if (tooltipTrigger != null && tooltipTrigger !== 'item') {
+            return;
+        }
+
+        var params = dataModel.getDataParams(dataIndex, dataType);
+        var defaultHtml = dataModel.formatTooltip(dataIndex, false, dataType);
+        var asyncTicket = 'item_' + dataModel.name + '_' + dataIndex;
+
+        this._showOrMove(tooltipModel, function () {
+            this._showTooltipContent(
+                tooltipModel, defaultHtml, params, asyncTicket,
+                e.offsetX, e.offsetY, e.position, e.target
+            );
+        });
+
+        // FIXME
+        // duplicated showtip if manuallyShowTip is called from dispatchAction.
+        dispatchAction({
+            type: 'showTip',
+            dataIndexInside: dataIndex,
+            dataIndex: data.getRawIndex(dataIndex),
+            seriesIndex: seriesIndex,
+            from: this.uid
+        });
+    },
+
+    _showComponentItemTooltip: function (e, el, dispatchAction) {
+        var tooltipOpt = el.tooltip;
+        if (typeof tooltipOpt === 'string') {
+            var content = tooltipOpt;
+            tooltipOpt = {
+                content: content,
+                // Fixed formatter
+                formatter: content
+            };
+        }
+        var subTooltipModel = new Model(tooltipOpt, this._tooltipModel, this._ecModel);
+        var defaultHtml = subTooltipModel.get('content');
+        var asyncTicket = Math.random();
+
+        // Do not check whether `trigger` is 'none' here, because `trigger`
+        // only works on cooridinate system. In fact, we have not found case
+        // that requires setting `trigger` nothing on component yet.
+
+        this._showOrMove(subTooltipModel, function () {
+            this._showTooltipContent(
+                subTooltipModel, defaultHtml, subTooltipModel.get('formatterParams') || {},
+                asyncTicket, e.offsetX, e.offsetY, e.position, el
+            );
+        });
+
+        // If not dispatch showTip, tip may be hide triggered by axis.
+        dispatchAction({
+            type: 'showTip',
+            from: this.uid
+        });
+    },
+
+    _showTooltipContent: function (
+        tooltipModel, defaultHtml, params, asyncTicket, x, y, positionExpr, el
+    ) {
+        // Reset ticket
+        this._ticket = '';
+
+        if (!tooltipModel.get('showContent') || !tooltipModel.get('show')) {
+            return;
+        }
+
+        var tooltipContent = this._tooltipContent;
+
+        var formatter = tooltipModel.get('formatter');
+        positionExpr = positionExpr || tooltipModel.get('position');
+        var html = defaultHtml;
+
+        if (formatter && typeof formatter === 'string') {
+            html = formatTpl(formatter, params, true);
+        }
+        else if (typeof formatter === 'function') {
+            var callback = bind$3(function (cbTicket, html) {
+                if (cbTicket === this._ticket) {
+                    tooltipContent.setContent(html);
+                    this._updatePosition(
+                        tooltipModel, positionExpr, x, y, tooltipContent, params, el
+                    );
+                }
+            }, this);
+            this._ticket = asyncTicket;
+            html = formatter(params, asyncTicket, callback);
+        }
+
+        tooltipContent.setContent(html);
+        tooltipContent.show(tooltipModel);
+
+        this._updatePosition(
+            tooltipModel, positionExpr, x, y, tooltipContent, params, el
+        );
+    },
+
+    /**
+     * @param  {string|Function|Array.<number>|Object} positionExpr
+     * @param  {number} x Mouse x
+     * @param  {number} y Mouse y
+     * @param  {boolean} confine Whether confine tooltip content in view rect.
+     * @param  {Object|<Array.<Object>} params
+     * @param  {module:zrender/Element} el target element
+     * @param  {module:echarts/ExtensionAPI} api
+     * @return {Array.<number>}
+     */
+    _updatePosition: function (tooltipModel, positionExpr, x, y, content, params, el) {
+        var viewWidth = this._api.getWidth();
+        var viewHeight = this._api.getHeight();
+        positionExpr = positionExpr || tooltipModel.get('position');
+
+        var contentSize = content.getSize();
+        var align = tooltipModel.get('align');
+        var vAlign = tooltipModel.get('verticalAlign');
+        var rect = el && el.getBoundingRect().clone();
+        el && rect.applyTransform(el.transform);
+
+        if (typeof positionExpr === 'function') {
+            // Callback of position can be an array or a string specify the position
+            positionExpr = positionExpr([x, y], params, content.el, rect, {
+                viewSize: [viewWidth, viewHeight],
+                contentSize: contentSize.slice()
+            });
+        }
+
+        if (isArray(positionExpr)) {
+            x = parsePercent$2(positionExpr[0], viewWidth);
+            y = parsePercent$2(positionExpr[1], viewHeight);
+        }
+        else if (isObject$1(positionExpr)) {
+            positionExpr.width = contentSize[0];
+            positionExpr.height = contentSize[1];
+            var layoutRect = getLayoutRect(
+                positionExpr, {width: viewWidth, height: viewHeight}
+            );
+            x = layoutRect.x;
+            y = layoutRect.y;
+            align = null;
+            // When positionExpr is left/top/right/bottom,
+            // align and verticalAlign will not work.
+            vAlign = null;
+        }
+        // Specify tooltip position by string 'top' 'bottom' 'left' 'right' around graphic element
+        else if (typeof positionExpr === 'string' && el) {
+            var pos = calcTooltipPosition(
+                positionExpr, rect, contentSize
+            );
+            x = pos[0];
+            y = pos[1];
+        }
+        else {
+            var pos = refixTooltipPosition(
+                x, y, content.el, viewWidth, viewHeight, align ? null : 20, vAlign ? null : 20
+            );
+            x = pos[0];
+            y = pos[1];
+        }
+
+        align && (x -= isCenterAlign(align) ? contentSize[0] / 2 : align === 'right' ? contentSize[0] : 0);
+        vAlign && (y -= isCenterAlign(vAlign) ? contentSize[1] / 2 : vAlign === 'bottom' ? contentSize[1] : 0);
+
+        if (tooltipModel.get('confine')) {
+            var pos = confineTooltipPosition(
+                x, y, content.el, viewWidth, viewHeight
+            );
+            x = pos[0];
+            y = pos[1];
+        }
+
+        content.moveTo(x, y);
+    },
+
+    // FIXME
+    // Should we remove this but leave this to user?
+    _updateContentNotChangedOnAxis: function (dataByCoordSys) {
+        var lastCoordSys = this._lastDataByCoordSys;
+        var contentNotChanged = !!lastCoordSys
+            && lastCoordSys.length === dataByCoordSys.length;
+
+        contentNotChanged && each$17(lastCoordSys, function (lastItemCoordSys, indexCoordSys) {
+            var lastDataByAxis = lastItemCoordSys.dataByAxis || {};
+            var thisItemCoordSys = dataByCoordSys[indexCoordSys] || {};
+            var thisDataByAxis = thisItemCoordSys.dataByAxis || [];
+            contentNotChanged &= lastDataByAxis.length === thisDataByAxis.length;
+
+            contentNotChanged && each$17(lastDataByAxis, function (lastItem, indexAxis) {
+                var thisItem = thisDataByAxis[indexAxis] || {};
+                var lastIndices = lastItem.seriesDataIndices || [];
+                var newIndices = thisItem.seriesDataIndices || [];
+
+                contentNotChanged &=
+                    lastItem.value === thisItem.value
+                    && lastItem.axisType === thisItem.axisType
+                    && lastItem.axisId === thisItem.axisId
+                    && lastIndices.length === newIndices.length;
+
+                contentNotChanged && each$17(lastIndices, function (lastIdxItem, j) {
+                    var newIdxItem = newIndices[j];
+                    contentNotChanged &=
+                        lastIdxItem.seriesIndex === newIdxItem.seriesIndex
+                        && lastIdxItem.dataIndex === newIdxItem.dataIndex;
+                });
+            });
+        });
+
+        this._lastDataByCoordSys = dataByCoordSys;
+
+        return !!contentNotChanged;
+    },
+
+    _hide: function (dispatchAction) {
+        // Do not directly hideLater here, because this behavior may be prevented
+        // in dispatchAction when showTip is dispatched.
+
+        // FIXME
+        // duplicated hideTip if manuallyHideTip is called from dispatchAction.
+        this._lastDataByCoordSys = null;
+        dispatchAction({
+            type: 'hideTip',
+            from: this.uid
+        });
+    },
+
+    dispose: function (ecModel, api) {
+        if (env$1.node || env$1.wxa) {
+            return;
+        }
+        this._tooltipContent.hide();
+        unregister('itemTooltip', api);
+    }
+});
+
+
+/**
+ * @param {Array.<Object|module:echarts/model/Model>} modelCascade
+ * From top to bottom. (the last one should be globalTooltipModel);
+ */
+function buildTooltipModel(modelCascade) {
+    var resultModel = modelCascade.pop();
+    while (modelCascade.length) {
+        var tooltipOpt = modelCascade.pop();
+        if (tooltipOpt) {
+            if (Model.isInstance(tooltipOpt)) {
+                tooltipOpt = tooltipOpt.get('tooltip', true);
+            }
+            // In each data item tooltip can be simply write:
+            // {
+            //  value: 10,
+            //  tooltip: 'Something you need to know'
+            // }
+            if (typeof tooltipOpt === 'string') {
+                tooltipOpt = {formatter: tooltipOpt};
+            }
+            resultModel = new Model(tooltipOpt, resultModel, resultModel.ecModel);
+        }
+    }
+    return resultModel;
+}
+
+function makeDispatchAction$1(payload, api) {
+    return payload.dispatchAction || bind(api.dispatchAction, api);
+}
+
+function refixTooltipPosition(x, y, el, viewWidth, viewHeight, gapH, gapV) {
+    var size = getOuterSize(el);
+    var width = size.width;
+    var height = size.height;
+
+    if (gapH != null) {
+        if (x + width + gapH > viewWidth) {
+            x -= width + gapH;
+        }
+        else {
+            x += gapH;
+        }
+    }
+    if (gapV != null) {
+        if (y + height + gapV > viewHeight) {
+            y -= height + gapV;
+        }
+        else {
+            y += gapV;
+        }
+    }
+    return [x, y];
+}
+
+function confineTooltipPosition(x, y, el, viewWidth, viewHeight) {
+    var size = getOuterSize(el);
+    var width = size.width;
+    var height = size.height;
+
+    x = Math.min(x + width, viewWidth) - width;
+    y = Math.min(y + height, viewHeight) - height;
+    x = Math.max(x, 0);
+    y = Math.max(y, 0);
+
+    return [x, y];
+}
+
+function getOuterSize(el) {
+    var width = el.clientWidth;
+    var height = el.clientHeight;
+
+    // Consider browser compatibility.
+    // IE8 does not support getComputedStyle.
+    if (document.defaultView && document.defaultView.getComputedStyle) {
+        var stl = document.defaultView.getComputedStyle(el);
+        if (stl) {
+            width += parseInt(stl.paddingLeft, 10) + parseInt(stl.paddingRight, 10)
+                + parseInt(stl.borderLeftWidth, 10) + parseInt(stl.borderRightWidth, 10);
+            height += parseInt(stl.paddingTop, 10) + parseInt(stl.paddingBottom, 10)
+                + parseInt(stl.borderTopWidth, 10) + parseInt(stl.borderBottomWidth, 10);
+        }
+    }
+
+    return {width: width, height: height};
+}
+
+function calcTooltipPosition(position, rect, contentSize) {
+    var domWidth = contentSize[0];
+    var domHeight = contentSize[1];
+    var gap = 5;
+    var x = 0;
+    var y = 0;
+    var rectWidth = rect.width;
+    var rectHeight = rect.height;
+    switch (position) {
+        case 'inside':
+            x = rect.x + rectWidth / 2 - domWidth / 2;
+            y = rect.y + rectHeight / 2 - domHeight / 2;
+            break;
+        case 'top':
+            x = rect.x + rectWidth / 2 - domWidth / 2;
+            y = rect.y - domHeight - gap;
+            break;
+        case 'bottom':
+            x = rect.x + rectWidth / 2 - domWidth / 2;
+            y = rect.y + rectHeight + gap;
+            break;
+        case 'left':
+            x = rect.x - domWidth - gap;
+            y = rect.y + rectHeight / 2 - domHeight / 2;
+            break;
+        case 'right':
+            x = rect.x + rectWidth + gap;
+            y = rect.y + rectHeight / 2 - domHeight / 2;
+    }
+    return [x, y];
+}
+
+function isCenterAlign(align) {
+    return align === 'center' || align === 'middle';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// FIXME Better way to pack data in graphic element
+
+/**
+ * @action
+ * @property {string} type
+ * @property {number} seriesIndex
+ * @property {number} dataIndex
+ * @property {number} [x]
+ * @property {number} [y]
+ */
+registerAction(
+    {
+        type: 'showTip',
+        event: 'showTip',
+        update: 'tooltip:manuallyShowTip'
+    },
+    // noop
+    function () {}
+);
+
+registerAction(
+    {
+        type: 'hideTip',
+        event: 'hideTip',
+        update: 'tooltip:manuallyHideTip'
+    },
+    // noop
+    function () {}
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function getSeriesStackId$1(seriesModel) {
+    return seriesModel.get('stack')
+        || '__ec_stack_' + seriesModel.seriesIndex;
+}
+
+function getAxisKey$1(axis) {
+    return axis.dim;
+}
+
+/**
+ * @param {string} seriesType
+ * @param {module:echarts/model/Global} ecModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function barLayoutPolar(seriesType, ecModel, api) {
+
+    var width = api.getWidth();
+    var height = api.getHeight();
+
+    var lastStackCoords = {};
+
+    var barWidthAndOffset = calRadialBar(
+        filter(
+            ecModel.getSeriesByType(seriesType),
+            function (seriesModel) {
+                return !ecModel.isSeriesFiltered(seriesModel)
+                    && seriesModel.coordinateSystem
+                    && seriesModel.coordinateSystem.type === 'polar';
+            }
+        )
+    );
+
+    ecModel.eachSeriesByType(seriesType, function (seriesModel) {
+        // Check series coordinate, do layout for polar only
+        if (seriesModel.coordinateSystem.type !== 'polar') {
+            return;
+        }
+
+        var data = seriesModel.getData();
+        var polar = seriesModel.coordinateSystem;
+        var baseAxis = polar.getBaseAxis();
+
+        var stackId = getSeriesStackId$1(seriesModel);
+        var columnLayoutInfo
+            = barWidthAndOffset[getAxisKey$1(baseAxis)][stackId];
+        var columnOffset = columnLayoutInfo.offset;
+        var columnWidth = columnLayoutInfo.width;
+        var valueAxis = polar.getOtherAxis(baseAxis);
+
+        var center = seriesModel.get('center') || ['50%', '50%'];
+        var cx = parsePercent$1(center[0], width);
+        var cy = parsePercent$1(center[1], height);
+
+        var barMinHeight = seriesModel.get('barMinHeight') || 0;
+        var barMinAngle = seriesModel.get('barMinAngle') || 0;
+
+        lastStackCoords[stackId] = lastStackCoords[stackId] || [];
+
+        var valueDim = data.mapDimension(valueAxis.dim);
+        var baseDim = data.mapDimension(baseAxis.dim);
+        var stacked = isDimensionStacked(data, valueDim /*, baseDim*/);
+
+        var valueAxisStart = valueAxis.getExtent()[0];
+
+        for (var idx = 0, len = data.count(); idx < len; idx++) {
+            var value = data.get(valueDim, idx);
+            var baseValue = data.get(baseDim, idx);
+
+            if (isNaN(value)) {
+                continue;
+            }
+
+            var sign = value >= 0 ? 'p' : 'n';
+            var baseCoord = valueAxisStart;
+
+            // Because of the barMinHeight, we can not use the value in
+            // stackResultDimension directly.
+            // Only ordinal axis can be stacked.
+            if (stacked) {
+                if (!lastStackCoords[stackId][baseValue]) {
+                    lastStackCoords[stackId][baseValue] = {
+                        p: valueAxisStart, // Positive stack
+                        n: valueAxisStart  // Negative stack
+                    };
+                }
+                // Should also consider #4243
+                baseCoord = lastStackCoords[stackId][baseValue][sign];
+            }
+
+            var r0;
+            var r;
+            var startAngle;
+            var endAngle;
+
+            // radial sector
+            if (valueAxis.dim === 'radius') {
+                var radiusSpan = valueAxis.dataToRadius(value) - valueAxisStart;
+                var angle = baseAxis.dataToAngle(baseValue);
+
+                if (Math.abs(radiusSpan) < barMinHeight) {
+                    radiusSpan = (radiusSpan < 0 ? -1 : 1) * barMinHeight;
+                }
+
+                r0 = baseCoord;
+                r = baseCoord + radiusSpan;
+                startAngle = angle - columnOffset;
+                endAngle = startAngle - columnWidth;
+
+                stacked && (lastStackCoords[stackId][baseValue][sign] = r);
+            }
+            // tangential sector
+            else {
+                // angleAxis must be clamped.
+                var angleSpan = valueAxis.dataToAngle(value, true) - valueAxisStart;
+                var radius = baseAxis.dataToRadius(baseValue);
+
+                if (Math.abs(angleSpan) < barMinAngle) {
+                    angleSpan = (angleSpan < 0 ? -1 : 1) * barMinAngle;
+                }
+
+                r0 = radius + columnOffset;
+                r = r0 + columnWidth;
+                startAngle = baseCoord;
+                endAngle = baseCoord + angleSpan;
+
+                // if the previous stack is at the end of the ring,
+                // add a round to differentiate it from origin
+                // var extent = angleAxis.getExtent();
+                // var stackCoord = angle;
+                // if (stackCoord === extent[0] && value > 0) {
+                //     stackCoord = extent[1];
+                // }
+                // else if (stackCoord === extent[1] && value < 0) {
+                //     stackCoord = extent[0];
+                // }
+                stacked && (lastStackCoords[stackId][baseValue][sign] = endAngle);
+            }
+
+            data.setItemLayout(idx, {
+                cx: cx,
+                cy: cy,
+                r0: r0,
+                r: r,
+                // Consider that positive angle is anti-clockwise,
+                // while positive radian of sector is clockwise
+                startAngle: -startAngle * Math.PI / 180,
+                endAngle: -endAngle * Math.PI / 180
+            });
+
+        }
+
+    }, this);
+
+}
+
+/**
+ * Calculate bar width and offset for radial bar charts
+ */
+function calRadialBar(barSeries, api) {
+    // Columns info on each category axis. Key is polar name
+    var columnsMap = {};
+
+    each$1(barSeries, function (seriesModel, idx) {
+        var data = seriesModel.getData();
+        var polar = seriesModel.coordinateSystem;
+
+        var baseAxis = polar.getBaseAxis();
+
+        var axisExtent = baseAxis.getExtent();
+        var bandWidth = baseAxis.type === 'category'
+            ? baseAxis.getBandWidth()
+            : (Math.abs(axisExtent[1] - axisExtent[0]) / data.count());
+
+        var columnsOnAxis = columnsMap[getAxisKey$1(baseAxis)] || {
+            bandWidth: bandWidth,
+            remainedWidth: bandWidth,
+            autoWidthCount: 0,
+            categoryGap: '20%',
+            gap: '30%',
+            stacks: {}
+        };
+        var stacks = columnsOnAxis.stacks;
+        columnsMap[getAxisKey$1(baseAxis)] = columnsOnAxis;
+
+        var stackId = getSeriesStackId$1(seriesModel);
+
+        if (!stacks[stackId]) {
+            columnsOnAxis.autoWidthCount++;
+        }
+        stacks[stackId] = stacks[stackId] || {
+            width: 0,
+            maxWidth: 0
+        };
+
+        var barWidth = parsePercent$1(
+            seriesModel.get('barWidth'),
+            bandWidth
+        );
+        var barMaxWidth = parsePercent$1(
+            seriesModel.get('barMaxWidth'),
+            bandWidth
+        );
+        var barGap = seriesModel.get('barGap');
+        var barCategoryGap = seriesModel.get('barCategoryGap');
+
+        if (barWidth && !stacks[stackId].width) {
+            barWidth = Math.min(columnsOnAxis.remainedWidth, barWidth);
+            stacks[stackId].width = barWidth;
+            columnsOnAxis.remainedWidth -= barWidth;
+        }
+
+        barMaxWidth && (stacks[stackId].maxWidth = barMaxWidth);
+        (barGap != null) && (columnsOnAxis.gap = barGap);
+        (barCategoryGap != null) && (columnsOnAxis.categoryGap = barCategoryGap);
+    });
+
+
+    var result = {};
+
+    each$1(columnsMap, function (columnsOnAxis, coordSysName) {
+
+        result[coordSysName] = {};
+
+        var stacks = columnsOnAxis.stacks;
+        var bandWidth = columnsOnAxis.bandWidth;
+        var categoryGap = parsePercent$1(columnsOnAxis.categoryGap, bandWidth);
+        var barGapPercent = parsePercent$1(columnsOnAxis.gap, 1);
+
+        var remainedWidth = columnsOnAxis.remainedWidth;
+        var autoWidthCount = columnsOnAxis.autoWidthCount;
+        var autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        // Find if any auto calculated bar exceeded maxBarWidth
+        each$1(stacks, function (column, stack) {
+            var maxWidth = column.maxWidth;
+            if (maxWidth && maxWidth < autoWidth) {
+                maxWidth = Math.min(maxWidth, remainedWidth);
+                if (column.width) {
+                    maxWidth = Math.min(maxWidth, column.width);
+                }
+                remainedWidth -= maxWidth;
+                column.width = maxWidth;
+                autoWidthCount--;
+            }
+        });
+
+        // Recalculate width again
+        autoWidth = (remainedWidth - categoryGap)
+            / (autoWidthCount + (autoWidthCount - 1) * barGapPercent);
+        autoWidth = Math.max(autoWidth, 0);
+
+        var widthSum = 0;
+        var lastColumn;
+        each$1(stacks, function (column, idx) {
+            if (!column.width) {
+                column.width = autoWidth;
+            }
+            lastColumn = column;
+            widthSum += column.width * (1 + barGapPercent);
+        });
+        if (lastColumn) {
+            widthSum -= lastColumn.width * barGapPercent;
+        }
+
+        var offset = -widthSum / 2;
+        each$1(stacks, function (column, stackId) {
+            result[coordSysName][stackId] = result[coordSysName][stackId] || {
+                offset: offset,
+                width: column.width
+            };
+
+            offset += column.width * (1 + barGapPercent);
+        });
+    });
+
+    return result;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function RadiusAxis(scale, radiusExtent) {
+
+    Axis.call(this, 'radius', scale, radiusExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = 'category';
+}
+
+RadiusAxis.prototype = {
+
+    constructor: RadiusAxis,
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.polar.pointToData(point, clamp)[this.dim === 'radius' ? 0 : 1];
+    },
+
+    dataToRadius: Axis.prototype.dataToCoord,
+
+    radiusToData: Axis.prototype.coordToData
+};
+
+inherits(RadiusAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function AngleAxis(scale, angleExtent) {
+
+    angleExtent = angleExtent || [0, 360];
+
+    Axis.call(this, 'angle', scale, angleExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = 'category';
+}
+
+AngleAxis.prototype = {
+
+    constructor: AngleAxis,
+
+    /**
+     * @override
+     */
+    pointToData: function (point, clamp) {
+        return this.polar.pointToData(point, clamp)[this.dim === 'radius' ? 0 : 1];
+    },
+
+    dataToAngle: Axis.prototype.dataToCoord,
+
+    angleToData: Axis.prototype.coordToData
+};
+
+inherits(AngleAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @module echarts/coord/polar/Polar
+ */
+
+/**
+ * @alias {module:echarts/coord/polar/Polar}
+ * @constructor
+ * @param {string} name
+ */
+var Polar = function (name) {
+
+    /**
+     * @type {string}
+     */
+    this.name = name || '';
+
+    /**
+     * x of polar center
+     * @type {number}
+     */
+    this.cx = 0;
+
+    /**
+     * y of polar center
+     * @type {number}
+     */
+    this.cy = 0;
+
+    /**
+     * @type {module:echarts/coord/polar/RadiusAxis}
+     * @private
+     */
+    this._radiusAxis = new RadiusAxis();
+
+    /**
+     * @type {module:echarts/coord/polar/AngleAxis}
+     * @private
+     */
+    this._angleAxis = new AngleAxis();
+
+    this._radiusAxis.polar = this._angleAxis.polar = this;
+};
+
+Polar.prototype = {
+
+    type: 'polar',
+
+    axisPointerEnabled: true,
+
+    constructor: Polar,
+
+    /**
+     * @param {Array.<string>}
+     * @readOnly
+     */
+    dimensions: ['radius', 'angle'],
+
+    /**
+     * @type {module:echarts/coord/PolarModel}
+     */
+    model: null,
+
+    /**
+     * If contain coord
+     * @param {Array.<number>} point
+     * @return {boolean}
+     */
+    containPoint: function (point) {
+        var coord = this.pointToCoord(point);
+        return this._radiusAxis.contain(coord[0])
+            && this._angleAxis.contain(coord[1]);
+    },
+
+    /**
+     * If contain data
+     * @param {Array.<number>} data
+     * @return {boolean}
+     */
+    containData: function (data) {
+        return this._radiusAxis.containData(data[0])
+            && this._angleAxis.containData(data[1]);
+    },
+
+    /**
+     * @param {string} dim
+     * @return {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+     */
+    getAxis: function (dim) {
+        return this['_' + dim + 'Axis'];
+    },
+
+    /**
+     * @return {Array.<module:echarts/coord/Axis>}
+     */
+    getAxes: function () {
+        return [this._radiusAxis, this._angleAxis];
+    },
+
+    /**
+     * Get axes by type of scale
+     * @param {string} scaleType
+     * @return {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+     */
+    getAxesByScale: function (scaleType) {
+        var axes = [];
+        var angleAxis = this._angleAxis;
+        var radiusAxis = this._radiusAxis;
+        angleAxis.scale.type === scaleType && axes.push(angleAxis);
+        radiusAxis.scale.type === scaleType && axes.push(radiusAxis);
+
+        return axes;
+    },
+
+    /**
+     * @return {module:echarts/coord/polar/AngleAxis}
+     */
+    getAngleAxis: function () {
+        return this._angleAxis;
+    },
+
+    /**
+     * @return {module:echarts/coord/polar/RadiusAxis}
+     */
+    getRadiusAxis: function () {
+        return this._radiusAxis;
+    },
+
+    /**
+     * @param {module:echarts/coord/polar/Axis}
+     * @return {module:echarts/coord/polar/Axis}
+     */
+    getOtherAxis: function (axis) {
+        var angleAxis = this._angleAxis;
+        return axis === angleAxis ? this._radiusAxis : angleAxis;
+    },
+
+    /**
+     * Base axis will be used on stacking.
+     *
+     * @return {module:echarts/coord/polar/Axis}
+     */
+    getBaseAxis: function () {
+        return this.getAxesByScale('ordinal')[0]
+            || this.getAxesByScale('time')[0]
+            || this.getAngleAxis();
+    },
+
+    /**
+     * @param {string} [dim] 'radius' or 'angle' or 'auto' or null/undefined
+     * @return {Object} {baseAxes: [], otherAxes: []}
+     */
+    getTooltipAxes: function (dim) {
+        var baseAxis = (dim != null && dim !== 'auto')
+            ? this.getAxis(dim) : this.getBaseAxis();
+        return {
+            baseAxes: [baseAxis],
+            otherAxes: [this.getOtherAxis(baseAxis)]
+        };
+    },
+
+    /**
+     * Convert a single data item to (x, y) point.
+     * Parameter data is an array which the first element is radius and the second is angle
+     * @param {Array.<number>} data
+     * @param {boolean} [clamp=false]
+     * @return {Array.<number>}
+     */
+    dataToPoint: function (data, clamp) {
+        return this.coordToPoint([
+            this._radiusAxis.dataToRadius(data[0], clamp),
+            this._angleAxis.dataToAngle(data[1], clamp)
+        ]);
+    },
+
+    /**
+     * Convert a (x, y) point to data
+     * @param {Array.<number>} point
+     * @param {boolean} [clamp=false]
+     * @return {Array.<number>}
+     */
+    pointToData: function (point, clamp) {
+        var coord = this.pointToCoord(point);
+        return [
+            this._radiusAxis.radiusToData(coord[0], clamp),
+            this._angleAxis.angleToData(coord[1], clamp)
+        ];
+    },
+
+    /**
+     * Convert a (x, y) point to (radius, angle) coord
+     * @param {Array.<number>} point
+     * @return {Array.<number>}
+     */
+    pointToCoord: function (point) {
+        var dx = point[0] - this.cx;
+        var dy = point[1] - this.cy;
+        var angleAxis = this.getAngleAxis();
+        var extent = angleAxis.getExtent();
+        var minAngle = Math.min(extent[0], extent[1]);
+        var maxAngle = Math.max(extent[0], extent[1]);
+        // Fix fixed extent in polarCreator
+        // FIXME
+        angleAxis.inverse
+            ? (minAngle = maxAngle - 360)
+            : (maxAngle = minAngle + 360);
+
+        var radius = Math.sqrt(dx * dx + dy * dy);
+        dx /= radius;
+        dy /= radius;
+
+        var radian = Math.atan2(-dy, dx) / Math.PI * 180;
+
+        // move to angleExtent
+        var dir = radian < minAngle ? 1 : -1;
+        while (radian < minAngle || radian > maxAngle) {
+            radian += dir * 360;
+        }
+
+        return [radius, radian];
+    },
+
+    /**
+     * Convert a (radius, angle) coord to (x, y) point
+     * @param {Array.<number>} coord
+     * @return {Array.<number>}
+     */
+    coordToPoint: function (coord) {
+        var radius = coord[0];
+        var radian = coord[1] / 180 * Math.PI;
+        var x = Math.cos(radian) * radius + this.cx;
+        // Inverse the y
+        var y = -Math.sin(radian) * radius + this.cy;
+
+        return [x, y];
+    }
+
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PolarAxisModel = ComponentModel.extend({
+
+    type: 'polarAxis',
+
+    /**
+     * @type {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+     */
+    axis: null,
+
+    /**
+     * @override
+     */
+    getCoordSysModel: function () {
+        return this.ecModel.queryComponents({
+            mainType: 'polar',
+            index: this.option.polarIndex,
+            id: this.option.polarId
+        })[0];
+    }
+
+});
+
+merge(PolarAxisModel.prototype, axisModelCommonMixin);
+
+var polarAxisDefaultExtendedOption = {
+    angle: {
+        // polarIndex: 0,
+        // polarId: '',
+
+        startAngle: 90,
+
+        clockwise: true,
+
+        splitNumber: 12,
+
+        axisLabel: {
+            rotate: false
+        }
+    },
+    radius: {
+        // polarIndex: 0,
+        // polarId: '',
+
+        splitNumber: 5
+    }
+};
+
+function getAxisType$3(axisDim, option) {
+    // Default axis with data is category axis
+    return option.type || (option.data ? 'category' : 'value');
+}
+
+axisModelCreator('angle', PolarAxisModel, getAxisType$3, polarAxisDefaultExtendedOption.angle);
+axisModelCreator('radius', PolarAxisModel, getAxisType$3, polarAxisDefaultExtendedOption.radius);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentModel({
+
+    type: 'polar',
+
+    dependencies: ['polarAxis', 'angleAxis'],
+
+    /**
+     * @type {module:echarts/coord/polar/Polar}
+     */
+    coordinateSystem: null,
+
+    /**
+     * @param {string} axisType
+     * @return {module:echarts/coord/polar/AxisModel}
+     */
+    findAxisModel: function (axisType) {
+        var foundAxisModel;
+        var ecModel = this.ecModel;
+
+        ecModel.eachComponent(axisType, function (axisModel) {
+            if (axisModel.getCoordSysModel() === this) {
+                foundAxisModel = axisModel;
+            }
+        }, this);
+        return foundAxisModel;
+    },
+
+    defaultOption: {
+
+        zlevel: 0,
+
+        z: 0,
+
+        center: ['50%', '50%'],
+
+        radius: '80%'
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Axis scale
+
+/**
+ * Resize method bound to the polar
+ * @param {module:echarts/coord/polar/PolarModel} polarModel
+ * @param {module:echarts/ExtensionAPI} api
+ */
+function resizePolar(polar, polarModel, api) {
+    var center = polarModel.get('center');
+    var width = api.getWidth();
+    var height = api.getHeight();
+
+    polar.cx = parsePercent$1(center[0], width);
+    polar.cy = parsePercent$1(center[1], height);
+
+    var radiusAxis = polar.getRadiusAxis();
+    var size = Math.min(width, height) / 2;
+    var radius = parsePercent$1(polarModel.get('radius'), size);
+    radiusAxis.inverse
+        ? radiusAxis.setExtent(radius, 0)
+        : radiusAxis.setExtent(0, radius);
+}
+
+/**
+ * Update polar
+ */
+function updatePolarScale(ecModel, api) {
+    var polar = this;
+    var angleAxis = polar.getAngleAxis();
+    var radiusAxis = polar.getRadiusAxis();
+    // Reset scale
+    angleAxis.scale.setExtent(Infinity, -Infinity);
+    radiusAxis.scale.setExtent(Infinity, -Infinity);
+
+    ecModel.eachSeries(function (seriesModel) {
+        if (seriesModel.coordinateSystem === polar) {
+            var data = seriesModel.getData();
+            each$1(data.mapDimension('radius', true), function (dim) {
+                radiusAxis.scale.unionExtentFromData(
+                    data, getStackedDimension(data, dim)
+                );
+            });
+            each$1(data.mapDimension('angle', true), function (dim) {
+                angleAxis.scale.unionExtentFromData(
+                    data, getStackedDimension(data, dim)
+                );
+            });
+        }
+    });
+
+    niceScaleExtent(angleAxis.scale, angleAxis.model);
+    niceScaleExtent(radiusAxis.scale, radiusAxis.model);
+
+    // Fix extent of category angle axis
+    if (angleAxis.type === 'category' && !angleAxis.onBand) {
+        var extent = angleAxis.getExtent();
+        var diff = 360 / angleAxis.scale.count();
+        angleAxis.inverse ? (extent[1] += diff) : (extent[1] -= diff);
+        angleAxis.setExtent(extent[0], extent[1]);
+    }
+}
+
+/**
+ * Set common axis properties
+ * @param {module:echarts/coord/polar/AngleAxis|module:echarts/coord/polar/RadiusAxis}
+ * @param {module:echarts/coord/polar/AxisModel}
+ * @inner
+ */
+function setAxis(axis, axisModel) {
+    axis.type = axisModel.get('type');
+    axis.scale = createScaleByModel(axisModel);
+    axis.onBand = axisModel.get('boundaryGap') && axis.type === 'category';
+    axis.inverse = axisModel.get('inverse');
+
+    if (axisModel.mainType === 'angleAxis') {
+        axis.inverse ^= axisModel.get('clockwise');
+        var startAngle = axisModel.get('startAngle');
+        axis.setExtent(startAngle, startAngle + (axis.inverse ? -360 : 360));
+    }
+
+    // Inject axis instance
+    axisModel.axis = axis;
+    axis.model = axisModel;
+}
+
+
+var polarCreator = {
+
+    dimensions: Polar.prototype.dimensions,
+
+    create: function (ecModel, api) {
+        var polarList = [];
+        ecModel.eachComponent('polar', function (polarModel, idx) {
+            var polar = new Polar(idx);
+            // Inject resize and update method
+            polar.update = updatePolarScale;
+
+            var radiusAxis = polar.getRadiusAxis();
+            var angleAxis = polar.getAngleAxis();
+
+            var radiusAxisModel = polarModel.findAxisModel('radiusAxis');
+            var angleAxisModel = polarModel.findAxisModel('angleAxis');
+
+            setAxis(radiusAxis, radiusAxisModel);
+            setAxis(angleAxis, angleAxisModel);
+
+            resizePolar(polar, polarModel, api);
+
+            polarList.push(polar);
+
+            polarModel.coordinateSystem = polar;
+            polar.model = polarModel;
+        });
+        // Inject coordinateSystem to series
+        ecModel.eachSeries(function (seriesModel) {
+            if (seriesModel.get('coordinateSystem') === 'polar') {
+                var polarModel = ecModel.queryComponents({
+                    mainType: 'polar',
+                    index: seriesModel.get('polarIndex'),
+                    id: seriesModel.get('polarId')
+                })[0];
+
+                if (__DEV__) {
+                    if (!polarModel) {
+                        throw new Error(
+                            'Polar "' + retrieve(
+                                seriesModel.get('polarIndex'),
+                                seriesModel.get('polarId'),
+                                0
+                            ) + '" not found'
+                        );
+                    }
+                }
+                seriesModel.coordinateSystem = polarModel.coordinateSystem;
+            }
+        });
+
+        return polarList;
+    }
+};
+
+CoordinateSystemManager.register('polar', polarCreator);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var elementList$1 = ['axisLine', 'axisLabel', 'axisTick', 'splitLine', 'splitArea'];
+
+function getAxisLineShape(polar, rExtent, angle) {
+    rExtent[1] > rExtent[0] && (rExtent = rExtent.slice().reverse());
+    var start = polar.coordToPoint([rExtent[0], angle]);
+    var end = polar.coordToPoint([rExtent[1], angle]);
+
+    return {
+        x1: start[0],
+        y1: start[1],
+        x2: end[0],
+        y2: end[1]
+    };
+}
+
+function getRadiusIdx(polar) {
+    var radiusAxis = polar.getRadiusAxis();
+    return radiusAxis.inverse ? 0 : 1;
+}
+
+// Remove the last tick which will overlap the first tick
+function fixAngleOverlap(list) {
+    var firstItem = list[0];
+    var lastItem = list[list.length - 1];
+    if (firstItem
+        && lastItem
+        && Math.abs(Math.abs(firstItem.coord - lastItem.coord) - 360) < 1e-4
+    ) {
+        list.pop();
+    }
+}
+
+AxisView.extend({
+
+    type: 'angleAxis',
+
+    axisPointerClass: 'PolarAxisPointer',
+
+    render: function (angleAxisModel, ecModel) {
+        this.group.removeAll();
+        if (!angleAxisModel.get('show')) {
+            return;
+        }
+
+        var angleAxis = angleAxisModel.axis;
+        var polar = angleAxis.polar;
+        var radiusExtent = polar.getRadiusAxis().getExtent();
+
+        var ticksAngles = angleAxis.getTicksCoords();
+        var labels = map(angleAxis.getViewLabels(), function (labelItem) {
+            var labelItem = clone(labelItem);
+            labelItem.coord = angleAxis.dataToCoord(labelItem.tickValue);
+            return labelItem;
+        });
+
+        fixAngleOverlap(labels);
+        fixAngleOverlap(ticksAngles);
+
+        each$1(elementList$1, function (name) {
+            if (angleAxisModel.get(name +'.show')
+                && (!angleAxis.scale.isBlank() || name === 'axisLine')
+            ) {
+                this['_' + name](angleAxisModel, polar, ticksAngles, radiusExtent, labels);
+            }
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _axisLine: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        var lineStyleModel = angleAxisModel.getModel('axisLine.lineStyle');
+
+        var circle = new Circle({
+            shape: {
+                cx: polar.cx,
+                cy: polar.cy,
+                r: radiusExtent[getRadiusIdx(polar)]
+            },
+            style: lineStyleModel.getLineStyle(),
+            z2: 1,
+            silent: true
+        });
+        circle.style.fill = null;
+
+        this.group.add(circle);
+    },
+
+    /**
+     * @private
+     */
+    _axisTick: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        var tickModel = angleAxisModel.getModel('axisTick');
+
+        var tickLen = (tickModel.get('inside') ? -1 : 1) * tickModel.get('length');
+        var radius = radiusExtent[getRadiusIdx(polar)];
+
+        var lines = map(ticksAngles, function (tickAngleItem) {
+            return new Line({
+                shape: getAxisLineShape(polar, [radius, radius + tickLen], tickAngleItem.coord)
+            });
+        });
+        this.group.add(mergePath(
+            lines, {
+                style: defaults(
+                    tickModel.getModel('lineStyle').getLineStyle(),
+                    {
+                        stroke: angleAxisModel.get('axisLine.lineStyle.color')
+                    }
+                )
+            }
+        ));
+    },
+
+    /**
+     * @private
+     */
+    _axisLabel: function (angleAxisModel, polar, ticksAngles, radiusExtent, labels) {
+        var rawCategoryData = angleAxisModel.getCategories(true);
+
+        var commonLabelModel = angleAxisModel.getModel('axisLabel');
+
+        var labelMargin = commonLabelModel.get('margin');
+
+        // Use length of ticksAngles because it may remove the last tick to avoid overlapping
+        each$1(labels, function (labelItem, idx) {
+            var labelModel = commonLabelModel;
+            var tickValue = labelItem.tickValue;
+
+            var r = radiusExtent[getRadiusIdx(polar)];
+            var p = polar.coordToPoint([r + labelMargin, labelItem.coord]);
+            var cx = polar.cx;
+            var cy = polar.cy;
+
+            var labelTextAlign = Math.abs(p[0] - cx) / r < 0.3
+                ? 'center' : (p[0] > cx ? 'left' : 'right');
+            var labelTextVerticalAlign = Math.abs(p[1] - cy) / r < 0.3
+                ? 'middle' : (p[1] > cy ? 'top' : 'bottom');
+
+            if (rawCategoryData && rawCategoryData[tickValue] && rawCategoryData[tickValue].textStyle) {
+                labelModel = new Model(rawCategoryData[tickValue].textStyle, commonLabelModel, commonLabelModel.ecModel);
+            }
+
+            var textEl = new Text({silent: true});
+            this.group.add(textEl);
+            setTextStyle(textEl.style, labelModel, {
+                x: p[0],
+                y: p[1],
+                textFill: labelModel.getTextColor() || angleAxisModel.get('axisLine.lineStyle.color'),
+                text: labelItem.formattedLabel,
+                textAlign: labelTextAlign,
+                textVerticalAlign: labelTextVerticalAlign
+            });
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _splitLine: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        var splitLineModel = angleAxisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineColors = lineStyleModel.get('color');
+        var lineCount = 0;
+
+        lineColors = lineColors instanceof Array ? lineColors : [lineColors];
+
+        var splitLines = [];
+
+        for (var i = 0; i < ticksAngles.length; i++) {
+            var colorIndex = (lineCount++) % lineColors.length;
+            splitLines[colorIndex] = splitLines[colorIndex] || [];
+            splitLines[colorIndex].push(new Line({
+                shape: getAxisLineShape(polar, radiusExtent, ticksAngles[i].coord)
+            }));
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitLines.length; i++) {
+            this.group.add(mergePath(splitLines[i], {
+                style: defaults({
+                    stroke: lineColors[i % lineColors.length]
+                }, lineStyleModel.getLineStyle()),
+                silent: true,
+                z: angleAxisModel.get('z')
+            }));
+        }
+    },
+
+    /**
+     * @private
+     */
+    _splitArea: function (angleAxisModel, polar, ticksAngles, radiusExtent) {
+        if (!ticksAngles.length) {
+            return;
+        }
+
+        var splitAreaModel = angleAxisModel.getModel('splitArea');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+        var areaColors = areaStyleModel.get('color');
+        var lineCount = 0;
+
+        areaColors = areaColors instanceof Array ? areaColors : [areaColors];
+
+        var splitAreas = [];
+
+        var RADIAN = Math.PI / 180;
+        var prevAngle = -ticksAngles[0].coord * RADIAN;
+        var r0 = Math.min(radiusExtent[0], radiusExtent[1]);
+        var r1 = Math.max(radiusExtent[0], radiusExtent[1]);
+
+        var clockwise = angleAxisModel.get('clockwise');
+
+        for (var i = 1; i < ticksAngles.length; i++) {
+            var colorIndex = (lineCount++) % areaColors.length;
+            splitAreas[colorIndex] = splitAreas[colorIndex] || [];
+            splitAreas[colorIndex].push(new Sector({
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r0: r0,
+                    r: r1,
+                    startAngle: prevAngle,
+                    endAngle: -ticksAngles[i].coord * RADIAN,
+                    clockwise: clockwise
+                },
+                silent: true
+            }));
+            prevAngle = -ticksAngles[i].coord * RADIAN;
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitAreas.length; i++) {
+            this.group.add(mergePath(splitAreas[i], {
+                style: defaults({
+                    fill: areaColors[i % areaColors.length]
+                }, areaStyleModel.getAreaStyle()),
+                silent: true
+            }));
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var axisBuilderAttrs$3 = [
+    'axisLine', 'axisTickLabel', 'axisName'
+];
+var selfBuilderAttrs$1 = [
+    'splitLine', 'splitArea'
+];
+
+AxisView.extend({
+
+    type: 'radiusAxis',
+
+    axisPointerClass: 'PolarAxisPointer',
+
+    render: function (radiusAxisModel, ecModel) {
+        this.group.removeAll();
+        if (!radiusAxisModel.get('show')) {
+            return;
+        }
+        var radiusAxis = radiusAxisModel.axis;
+        var polar = radiusAxis.polar;
+        var angleAxis = polar.getAngleAxis();
+        var ticksCoords = radiusAxis.getTicksCoords();
+        var axisAngle = angleAxis.getExtent()[0];
+        var radiusExtent = radiusAxis.getExtent();
+
+        var layout = layoutAxis(polar, radiusAxisModel, axisAngle);
+        var axisBuilder = new AxisBuilder(radiusAxisModel, layout);
+        each$1(axisBuilderAttrs$3, axisBuilder.add, axisBuilder);
+        this.group.add(axisBuilder.getGroup());
+
+        each$1(selfBuilderAttrs$1, function (name) {
+            if (radiusAxisModel.get(name +'.show') && !radiusAxis.scale.isBlank()) {
+                this['_' + name](radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords);
+            }
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _splitLine: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords) {
+        var splitLineModel = radiusAxisModel.getModel('splitLine');
+        var lineStyleModel = splitLineModel.getModel('lineStyle');
+        var lineColors = lineStyleModel.get('color');
+        var lineCount = 0;
+
+        lineColors = lineColors instanceof Array ? lineColors : [lineColors];
+
+        var splitLines = [];
+
+        for (var i = 0; i < ticksCoords.length; i++) {
+            var colorIndex = (lineCount++) % lineColors.length;
+            splitLines[colorIndex] = splitLines[colorIndex] || [];
+            splitLines[colorIndex].push(new Circle({
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r: ticksCoords[i].coord
+                },
+                silent: true
+            }));
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitLines.length; i++) {
+            this.group.add(mergePath(splitLines[i], {
+                style: defaults({
+                    stroke: lineColors[i % lineColors.length],
+                    fill: null
+                }, lineStyleModel.getLineStyle()),
+                silent: true
+            }));
+        }
+    },
+
+    /**
+     * @private
+     */
+    _splitArea: function (radiusAxisModel, polar, axisAngle, radiusExtent, ticksCoords) {
+        if (!ticksCoords.length) {
+            return;
+        }
+
+        var splitAreaModel = radiusAxisModel.getModel('splitArea');
+        var areaStyleModel = splitAreaModel.getModel('areaStyle');
+        var areaColors = areaStyleModel.get('color');
+        var lineCount = 0;
+
+        areaColors = areaColors instanceof Array ? areaColors : [areaColors];
+
+        var splitAreas = [];
+
+        var prevRadius = ticksCoords[0].coord;
+        for (var i = 1; i < ticksCoords.length; i++) {
+            var colorIndex = (lineCount++) % areaColors.length;
+            splitAreas[colorIndex] = splitAreas[colorIndex] || [];
+            splitAreas[colorIndex].push(new Sector({
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r0: prevRadius,
+                    r: ticksCoords[i].coord,
+                    startAngle: 0,
+                    endAngle: Math.PI * 2
+                },
+                silent: true
+            }));
+            prevRadius = ticksCoords[i].coord;
+        }
+
+        // Simple optimization
+        // Batching the lines if color are the same
+        for (var i = 0; i < splitAreas.length; i++) {
+            this.group.add(mergePath(splitAreas[i], {
+                style: defaults({
+                    fill: areaColors[i % areaColors.length]
+                }, areaStyleModel.getAreaStyle()),
+                silent: true
+            }));
+        }
+    }
+});
+
+/**
+ * @inner
+ */
+function layoutAxis(polar, radiusAxisModel, axisAngle) {
+    return {
+        position: [polar.cx, polar.cy],
+        rotation: axisAngle / 180 * Math.PI,
+        labelDirection: -1,
+        tickDirection: -1,
+        nameDirection: 1,
+        labelRotate: radiusAxisModel.getModel('axisLabel').get('rotate'),
+        // Over splitLine and splitArea
+        z2: 1
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PolarAxisPointer = BaseAxisPointer.extend({
+
+    /**
+     * @override
+     */
+    makeElOption: function (elOption, value, axisModel, axisPointerModel, api) {
+        var axis = axisModel.axis;
+
+        if (axis.dim === 'angle') {
+            this.animationThreshold = Math.PI / 18;
+        }
+
+        var polar = axis.polar;
+        var otherAxis = polar.getOtherAxis(axis);
+        var otherExtent = otherAxis.getExtent();
+
+        var coordValue;
+        coordValue = axis['dataTo' + capitalFirst(axis.dim)](value);
+
+        var axisPointerType = axisPointerModel.get('type');
+        if (axisPointerType && axisPointerType !== 'none') {
+            var elStyle = buildElStyle(axisPointerModel);
+            var pointerOption = pointerShapeBuilder$2[axisPointerType](
+                axis, polar, coordValue, otherExtent, elStyle
+            );
+            pointerOption.style = elStyle;
+            elOption.graphicKey = pointerOption.type;
+            elOption.pointer = pointerOption;
+        }
+
+        var labelMargin = axisPointerModel.get('label.margin');
+        var labelPos = getLabelPosition(value, axisModel, axisPointerModel, polar, labelMargin);
+        buildLabelElOption(elOption, axisModel, axisPointerModel, api, labelPos);
+    }
+
+    // Do not support handle, utill any user requires it.
+
+});
+
+function getLabelPosition(value, axisModel, axisPointerModel, polar, labelMargin) {
+    var axis = axisModel.axis;
+    var coord = axis.dataToCoord(value);
+    var axisAngle = polar.getAngleAxis().getExtent()[0];
+    axisAngle = axisAngle / 180 * Math.PI;
+    var radiusExtent = polar.getRadiusAxis().getExtent();
+    var position;
+    var align;
+    var verticalAlign;
+
+    if (axis.dim === 'radius') {
+        var transform = create$1();
+        rotate(transform, transform, axisAngle);
+        translate(transform, transform, [polar.cx, polar.cy]);
+        position = applyTransform$1([coord, -labelMargin], transform);
+
+        var labelRotation = axisModel.getModel('axisLabel').get('rotate') || 0;
+        var labelLayout = AxisBuilder.innerTextLayout(
+            axisAngle, labelRotation * Math.PI / 180, -1
+        );
+        align = labelLayout.textAlign;
+        verticalAlign = labelLayout.textVerticalAlign;
+    }
+    else { // angle axis
+        var r = radiusExtent[1];
+        position = polar.coordToPoint([r + labelMargin, coord]);
+        var cx = polar.cx;
+        var cy = polar.cy;
+        align = Math.abs(position[0] - cx) / r < 0.3
+            ? 'center' : (position[0] > cx ? 'left' : 'right');
+        verticalAlign = Math.abs(position[1] - cy) / r < 0.3
+            ? 'middle' : (position[1] > cy ? 'top' : 'bottom');
+    }
+
+    return {
+        position: position,
+        align: align,
+        verticalAlign: verticalAlign
+    };
+}
+
+
+var pointerShapeBuilder$2 = {
+
+    line: function (axis, polar, coordValue, otherExtent, elStyle) {
+        return axis.dim === 'angle'
+            ? {
+                type: 'Line',
+                shape: makeLineShape(
+                    polar.coordToPoint([otherExtent[0], coordValue]),
+                    polar.coordToPoint([otherExtent[1], coordValue])
+                )
+            }
+            : {
+                type: 'Circle',
+                shape: {
+                    cx: polar.cx,
+                    cy: polar.cy,
+                    r: coordValue
+                }
+            };
+    },
+
+    shadow: function (axis, polar, coordValue, otherExtent, elStyle) {
+        var bandWidth = Math.max(1, axis.getBandWidth());
+        var radian = Math.PI / 180;
+
+        return axis.dim === 'angle'
+            ? {
+                type: 'Sector',
+                shape: makeSectorShape(
+                    polar.cx, polar.cy,
+                    otherExtent[0], otherExtent[1],
+                    // In ECharts y is negative if angle is positive
+                    (-coordValue - bandWidth / 2) * radian,
+                    (-coordValue + bandWidth / 2) * radian
+                )
+            }
+            : {
+                type: 'Sector',
+                shape: makeSectorShape(
+                    polar.cx, polar.cy,
+                    coordValue - bandWidth / 2,
+                    coordValue + bandWidth / 2,
+                    0, Math.PI * 2
+                )
+            };
+    }
+};
+
+AxisView.registerAxisPointerClass('PolarAxisPointer', PolarAxisPointer);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// For reducing size of echarts.min, barLayoutPolar is required by polar.
+registerLayout(curry(barLayoutPolar, 'bar'));
+
+// Polar view
+extendComponentView({
+    type: 'polar'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var GeoModel = ComponentModel.extend({
+
+    type: 'geo',
+
+    /**
+     * @type {module:echarts/coord/geo/Geo}
+     */
+    coordinateSystem: null,
+
+    layoutMode: 'box',
+
+    init: function (option) {
+        ComponentModel.prototype.init.apply(this, arguments);
+
+        // Default label emphasis `show`
+        defaultEmphasis(option, 'label', ['show']);
+    },
+
+    optionUpdated: function () {
+        var option = this.option;
+        var self = this;
+
+        option.regions = geoCreator.getFilledRegions(option.regions, option.map, option.nameMap);
+
+        this._optionModelMap = reduce(option.regions || [], function (optionModelMap, regionOpt) {
+            if (regionOpt.name) {
+                optionModelMap.set(regionOpt.name, new Model(regionOpt, self));
+            }
+            return optionModelMap;
+        }, createHashMap());
+
+        this.updateSelectedMap(option.regions);
+    },
+
+    defaultOption: {
+
+        zlevel: 0,
+
+        z: 0,
+
+        show: true,
+
+        left: 'center',
+
+        top: 'center',
+
+
+        // width:,
+        // height:,
+        // right
+        // bottom
+
+        // Aspect is width / height. Inited to be geoJson bbox aspect
+        // This parameter is used for scale this aspect
+        aspectScale: 0.75,
+
+        ///// Layout with center and size
+        // If you wan't to put map in a fixed size box with right aspect ratio
+        // This two properties may more conveninet
+        // layoutCenter: [50%, 50%]
+        // layoutSize: 100
+
+
+        silent: false,
+
+        // Map type
+        map: '',
+
+        // Define left-top, right-bottom coords to control view
+        // For example, [ [180, 90], [-180, -90] ]
+        boundingCoords: null,
+
+        // Default on center of map
+        center: null,
+
+        zoom: 1,
+
+        scaleLimit: null,
+
+        // selectedMode: false
+
+        label: {
+            show: false,
+            color: '#000'
+        },
+
+        itemStyle: {
+            // color: 各异,
+            borderWidth: 0.5,
+            borderColor: '#444',
+            color: '#eee'
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                color: 'rgb(100,0,0)'
+            },
+            itemStyle: {
+                color: 'rgba(255,215,0,0.8)'
+            }
+        },
+
+        regions: []
+    },
+
+    /**
+     * Get model of region
+     * @param  {string} name
+     * @return {module:echarts/model/Model}
+     */
+    getRegionModel: function (name) {
+        return this._optionModelMap.get(name) || new Model(null, this, this.ecModel);
+    },
+
+    /**
+     * Format label
+     * @param {string} name Region name
+     * @param {string} [status='normal'] 'normal' or 'emphasis'
+     * @return {string}
+     */
+    getFormattedLabel: function (name, status) {
+        var regionModel = this.getRegionModel(name);
+        var formatter = regionModel.get('label.' + status + '.formatter');
+        var params = {
+            name: name
+        };
+        if (typeof formatter === 'function') {
+            params.status = status;
+            return formatter(params);
+        }
+        else if (typeof formatter === 'string') {
+            return formatter.replace('{a}', name != null ? name : '');
+        }
+    },
+
+    setZoom: function (zoom) {
+        this.option.zoom = zoom;
+    },
+
+    setCenter: function (center) {
+        this.option.center = center;
+    }
+});
+
+mixin(GeoModel, selectableMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+
+    type: 'geo',
+
+    init: function (ecModel, api) {
+        var mapDraw = new MapDraw(api, true);
+        this._mapDraw = mapDraw;
+
+        this.group.add(mapDraw.group);
+    },
+
+    render: function (geoModel, ecModel, api, payload) {
+        // Not render if it is an toggleSelect action from self
+        if (payload && payload.type === 'geoToggleSelect'
+            && payload.from === this.uid
+        ) {
+            return;
+        }
+
+        var mapDraw = this._mapDraw;
+        if (geoModel.get('show')) {
+            mapDraw.draw(geoModel, ecModel, api, this, payload);
+        }
+        else {
+            this._mapDraw.group.removeAll();
+        }
+
+        this.group.silent = geoModel.get('silent');
+    },
+
+    dispose: function () {
+        this._mapDraw && this._mapDraw.remove();
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function makeAction(method, actionInfo) {
+    actionInfo.update = 'updateView';
+    registerAction(actionInfo, function (payload, ecModel) {
+        var selected = {};
+
+        ecModel.eachComponent(
+            { mainType: 'geo', query: payload},
+            function (geoModel) {
+                geoModel[method](payload.name);
+                var geo = geoModel.coordinateSystem;
+                each$1(geo.regions, function (region) {
+                    selected[region.name] = geoModel.isSelected(region.name) || false;
+                });
+            }
+        );
+
+        return {
+            selected: selected,
+            name: payload.name
+        };
+    });
+}
+
+makeAction('toggleSelected', {
+    type: 'geoToggleSelect',
+    event: 'geoselectchanged'
+});
+makeAction('select', {
+    type: 'geoSelect',
+    event: 'geoselected'
+});
+makeAction('unSelect', {
+    type: 'geoUnSelect',
+    event: 'geounselected'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DEFAULT_TOOLBOX_BTNS = ['rect', 'polygon', 'keep', 'clear'];
+
+var preprocessor$1 = function (option, isNew) {
+    var brushComponents = option && option.brush;
+    if (!isArray(brushComponents)) {
+        brushComponents = brushComponents ? [brushComponents] : [];
+    }
+
+    if (!brushComponents.length) {
+        return;
+    }
+
+    var brushComponentSpecifiedBtns = [];
+
+    each$1(brushComponents, function (brushOpt) {
+        var tbs = brushOpt.hasOwnProperty('toolbox')
+            ? brushOpt.toolbox : [];
+
+        if (tbs instanceof Array) {
+            brushComponentSpecifiedBtns = brushComponentSpecifiedBtns.concat(tbs);
+        }
+    });
+
+    var toolbox = option && option.toolbox;
+
+    if (isArray(toolbox)) {
+        toolbox = toolbox[0];
+    }
+    if (!toolbox) {
+        toolbox = {feature: {}};
+        option.toolbox = [toolbox];
+    }
+
+    var toolboxFeature = (toolbox.feature || (toolbox.feature = {}));
+    var toolboxBrush = toolboxFeature.brush || (toolboxFeature.brush = {});
+    var brushTypes = toolboxBrush.type || (toolboxBrush.type = []);
+
+    brushTypes.push.apply(brushTypes, brushComponentSpecifiedBtns);
+
+    removeDuplicate(brushTypes);
+
+    if (isNew && !brushTypes.length) {
+        brushTypes.push.apply(brushTypes, DEFAULT_TOOLBOX_BTNS);
+    }
+};
+
+function removeDuplicate(arr) {
+    var map$$1 = {};
+    each$1(arr, function (val) {
+        map$$1[val] = 1;
+    });
+    arr.length = 0;
+    each$1(map$$1, function (flag, val) {
+        arr.push(val);
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual solution, for consistent option specification.
+ */
+
+var each$19 = each$1;
+
+function hasKeys(obj) {
+    if (obj) {
+        for (var name in obj){
+            if (obj.hasOwnProperty(name)) {
+                return true;
+            }
+        }
+    }
+}
+
+/**
+ * @param {Object} option
+ * @param {Array.<string>} stateList
+ * @param {Function} [supplementVisualOption]
+ * @return {Object} visualMappings <state, <visualType, module:echarts/visual/VisualMapping>>
+ */
+function createVisualMappings(option, stateList, supplementVisualOption) {
+    var visualMappings = {};
+
+    each$19(stateList, function (state) {
+        var mappings = visualMappings[state] = createMappings();
+
+        each$19(option[state], function (visualData, visualType) {
+            if (!VisualMapping.isValidType(visualType)) {
+                return;
+            }
+            var mappingOption = {
+                type: visualType,
+                visual: visualData
+            };
+            supplementVisualOption && supplementVisualOption(mappingOption, state);
+            mappings[visualType] = new VisualMapping(mappingOption);
+
+            // Prepare a alpha for opacity, for some case that opacity
+            // is not supported, such as rendering using gradient color.
+            if (visualType === 'opacity') {
+                mappingOption = clone(mappingOption);
+                mappingOption.type = 'colorAlpha';
+                mappings.__hidden.__alphaForOpacity = new VisualMapping(mappingOption);
+            }
+        });
+    });
+
+    return visualMappings;
+
+    function createMappings() {
+        var Creater = function () {};
+        // Make sure hidden fields will not be visited by
+        // object iteration (with hasOwnProperty checking).
+        Creater.prototype.__hidden = Creater.prototype;
+        var obj = new Creater();
+        return obj;
+    }
+}
+
+/**
+ * @param {Object} thisOption
+ * @param {Object} newOption
+ * @param {Array.<string>} keys
+ */
+function replaceVisualOption(thisOption, newOption, keys) {
+    // Visual attributes merge is not supported, otherwise it
+    // brings overcomplicated merge logic. See #2853. So if
+    // newOption has anyone of these keys, all of these keys
+    // will be reset. Otherwise, all keys remain.
+    var has;
+    each$1(keys, function (key) {
+        if (newOption.hasOwnProperty(key) && hasKeys(newOption[key])) {
+            has = true;
+        }
+    });
+    has && each$1(keys, function (key) {
+        if (newOption.hasOwnProperty(key) && hasKeys(newOption[key])) {
+            thisOption[key] = clone(newOption[key]);
+        }
+        else {
+            delete thisOption[key];
+        }
+    });
+}
+
+/**
+ * @param {Array.<string>} stateList
+ * @param {Object} visualMappings <state, Object.<visualType, module:echarts/visual/VisualMapping>>
+ * @param {module:echarts/data/List} list
+ * @param {Function} getValueState param: valueOrIndex, return: state.
+ * @param {object} [scope] Scope for getValueState
+ * @param {string} [dimension] Concrete dimension, if used.
+ */
+// ???! handle brush?
+function applyVisual(stateList, visualMappings, data, getValueState, scope, dimension) {
+    var visualTypesMap = {};
+    each$1(stateList, function (state) {
+        var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
+        visualTypesMap[state] = visualTypes;
+    });
+
+    var dataIndex;
+
+    function getVisual(key) {
+        return data.getItemVisual(dataIndex, key);
+    }
+
+    function setVisual(key, value) {
+        data.setItemVisual(dataIndex, key, value);
+    }
+
+    if (dimension == null) {
+        data.each(eachItem);
+    }
+    else {
+        data.each([dimension], eachItem);
+    }
+
+    function eachItem(valueOrIndex, index) {
+        dataIndex = dimension == null ? valueOrIndex : index;
+
+        var rawDataItem = data.getRawDataItem(dataIndex);
+        // Consider performance
+        if (rawDataItem && rawDataItem.visualMap === false) {
+            return;
+        }
+
+        var valueState = getValueState.call(scope, valueOrIndex);
+        var mappings = visualMappings[valueState];
+        var visualTypes = visualTypesMap[valueState];
+
+        for (var i = 0, len = visualTypes.length; i < len; i++) {
+            var type = visualTypes[i];
+            mappings[type] && mappings[type].applyVisual(
+                valueOrIndex, getVisual, setVisual
+            );
+        }
+    }
+}
+
+/**
+ * @param {module:echarts/data/List} data
+ * @param {Array.<string>} stateList
+ * @param {Object} visualMappings <state, Object.<visualType, module:echarts/visual/VisualMapping>>
+ * @param {Function} getValueState param: valueOrIndex, return: state.
+ * @param {number} [dim] dimension or dimension index.
+ */
+function incrementalApplyVisual(stateList, visualMappings, getValueState, dim) {
+    var visualTypesMap = {};
+    each$1(stateList, function (state) {
+        var visualTypes = VisualMapping.prepareVisualTypes(visualMappings[state]);
+        visualTypesMap[state] = visualTypes;
+    });
+
+    function progress(params, data) {
+        if (dim != null) {
+            dim = data.getDimension(dim);
+        }
+
+        function getVisual(key) {
+            return data.getItemVisual(dataIndex, key);
+        }
+
+        function setVisual(key, value) {
+            data.setItemVisual(dataIndex, key, value);
+        }
+
+        var dataIndex;
+        while ((dataIndex = params.next()) != null) {
+            var rawDataItem = data.getRawDataItem(dataIndex);
+
+            // Consider performance
+            if (rawDataItem && rawDataItem.visualMap === false) {
+                return;
+            }
+
+            var value = dim != null
+                ? data.get(dim, dataIndex, true)
+                : dataIndex;
+
+            var valueState = getValueState(value);
+            var mappings = visualMappings[valueState];
+            var visualTypes = visualTypesMap[valueState];
+
+            for (var i = 0, len = visualTypes.length; i < len; i++) {
+                var type = visualTypes[i];
+                mappings[type] && mappings[type].applyVisual(value, getVisual, setVisual);
+            }
+        }
+    }
+
+    return {progress: progress};
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Key of the first level is brushType: `line`, `rect`, `polygon`.
+// Key of the second level is chart element type: `point`, `rect`.
+// See moudule:echarts/component/helper/BrushController
+// function param:
+//      {Object} itemLayout fetch from data.getItemLayout(dataIndex)
+//      {Object} selectors {point: selector, rect: selector, ...}
+//      {Object} area {range: [[], [], ..], boudingRect}
+// function return:
+//      {boolean} Whether in the given brush.
+var selector = {
+    lineX: getLineSelectors(0),
+    lineY: getLineSelectors(1),
+    rect: {
+        point: function (itemLayout, selectors, area) {
+            return itemLayout && area.boundingRect.contain(itemLayout[0], itemLayout[1]);
+        },
+        rect: function (itemLayout, selectors, area) {
+            return itemLayout && area.boundingRect.intersect(itemLayout);
+        }
+    },
+    polygon: {
+        point: function (itemLayout, selectors, area) {
+            return itemLayout
+                && area.boundingRect.contain(itemLayout[0], itemLayout[1])
+                && contain$1(area.range, itemLayout[0], itemLayout[1]);
+        },
+        rect: function (itemLayout, selectors, area) {
+            var points = area.range;
+
+            if (!itemLayout || points.length <= 1) {
+                return false;
+            }
+
+            var x = itemLayout.x;
+            var y = itemLayout.y;
+            var width = itemLayout.width;
+            var height = itemLayout.height;
+            var p = points[0];
+
+            if (contain$1(points, x, y)
+                || contain$1(points, x + width, y)
+                || contain$1(points, x, y + height)
+                || contain$1(points, x + width, y + height)
+                || BoundingRect.create(itemLayout).contain(p[0], p[1])
+                || lineIntersectPolygon(x, y, x + width, y, points)
+                || lineIntersectPolygon(x, y, x, y + height, points)
+                || lineIntersectPolygon(x + width, y, x + width, y + height, points)
+                || lineIntersectPolygon(x, y + height, x + width, y + height, points)
+            ) {
+                return true;
+            }
+        }
+    }
+};
+
+function getLineSelectors(xyIndex) {
+    var xy = ['x', 'y'];
+    var wh = ['width', 'height'];
+
+    return {
+        point: function (itemLayout, selectors, area) {
+            if (itemLayout) {
+                var range = area.range;
+                var p = itemLayout[xyIndex];
+                return inLineRange(p, range);
+            }
+        },
+        rect: function (itemLayout, selectors, area) {
+            if (itemLayout) {
+                var range = area.range;
+                var layoutRange = [
+                    itemLayout[xy[xyIndex]],
+                    itemLayout[xy[xyIndex]] + itemLayout[wh[xyIndex]]
+                ];
+                layoutRange[1] < layoutRange[0] && layoutRange.reverse();
+                return inLineRange(layoutRange[0], range)
+                    || inLineRange(layoutRange[1], range)
+                    || inLineRange(range[0], layoutRange)
+                    || inLineRange(range[1], layoutRange);
+            }
+        }
+    };
+}
+
+function inLineRange(p, range) {
+    return range[0] <= p && p <= range[1];
+}
+
+function lineIntersectPolygon(lx, ly, l2x, l2y, points) {
+    for (var i = 0, p2 = points[points.length - 1]; i < points.length; i++) {
+        var p = points[i];
+        if (lineIntersect(lx, ly, l2x, l2y, p[0], p[1], p2[0], p2[1])) {
+            return true;
+        }
+        p2 = p;
+    }
+}
+
+// Code from <http://blog.csdn.net/rickliuxiao/article/details/6259322> with some fix.
+// See <https://en.wikipedia.org/wiki/Line%E2%80%93line_intersection>
+function lineIntersect(a1x, a1y, a2x, a2y, b1x, b1y, b2x, b2y) {
+    var delta = determinant(a2x - a1x, b1x - b2x, a2y - a1y, b1y - b2y);
+    if (nearZero(delta)) { // parallel
+        return false;
+    }
+    var namenda = determinant(b1x - a1x, b1x - b2x, b1y - a1y, b1y - b2y) / delta;
+    if (namenda < 0 || namenda > 1) {
+        return false;
+    }
+    var miu = determinant(a2x - a1x, b1x - a1x, a2y - a1y, b1y - a1y) / delta;
+    if (miu < 0 || miu > 1) {
+        return false;
+    }
+    return true;
+}
+
+function nearZero(val) {
+    return val <= (1e-6) && val >= -(1e-6);
+}
+
+function determinant(v1, v2, v3, v4) {
+    return v1 * v4 - v2 * v3;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$20 = each$1;
+var indexOf$1 = indexOf;
+var curry$5 = curry;
+
+var COORD_CONVERTS = ['dataToPoint', 'pointToData'];
+
+// FIXME
+// how to genarialize to more coordinate systems.
+var INCLUDE_FINDER_MAIN_TYPES = [
+    'grid', 'xAxis', 'yAxis', 'geo', 'graph',
+    'polar', 'radiusAxis', 'angleAxis', 'bmap'
+];
+
+/**
+ * [option in constructor]:
+ * {
+ *     Index/Id/Name of geo, xAxis, yAxis, grid: See util/model#parseFinder.
+ * }
+ *
+ *
+ * [targetInfo]:
+ *
+ * There can be multiple axes in a single targetInfo. Consider the case
+ * of `grid` component, a targetInfo represents a grid which contains one or more
+ * cartesian and one or more axes. And consider the case of parallel system,
+ * which has multiple axes in a coordinate system.
+ * Can be {
+ *     panelId: ...,
+ *     coordSys: <a representitive cartesian in grid (first cartesian by default)>,
+ *     coordSyses: all cartesians.
+ *     gridModel: <grid component>
+ *     xAxes: correspond to coordSyses on index
+ *     yAxes: correspond to coordSyses on index
+ * }
+ * or {
+ *     panelId: ...,
+ *     coordSys: <geo coord sys>
+ *     coordSyses: [<geo coord sys>]
+ *     geoModel: <geo component>
+ * }
+ *
+ *
+ * [panelOpt]:
+ *
+ * Make from targetInfo. Input to BrushController.
+ * {
+ *     panelId: ...,
+ *     rect: ...
+ * }
+ *
+ *
+ * [area]:
+ *
+ * Generated by BrushController or user input.
+ * {
+ *     panelId: Used to locate coordInfo directly. If user inpput, no panelId.
+ *     brushType: determine how to convert to/from coord('rect' or 'polygon' or 'lineX/Y').
+ *     Index/Id/Name of geo, xAxis, yAxis, grid: See util/model#parseFinder.
+ *     range: pixel range.
+ *     coordRange: representitive coord range (the first one of coordRanges).
+ *     coordRanges: <Array> coord ranges, used in multiple cartesian in one grid.
+ * }
+ */
+
+/**
+ * @param {Object} option contains Index/Id/Name of xAxis/yAxis/geo/grid
+ *        Each can be {number|Array.<number>}. like: {xAxisIndex: [3, 4]}
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} [opt]
+ * @param {Array.<string>} [opt.include] include coordinate system types.
+ */
+function BrushTargetManager(option, ecModel, opt) {
+    /**
+     * @private
+     * @type {Array.<Object>}
+     */
+    var targetInfoList = this._targetInfoList = [];
+    var info = {};
+    var foundCpts = parseFinder$1(ecModel, option);
+
+    each$20(targetInfoBuilders, function (builder, type) {
+        if (!opt || !opt.include || indexOf$1(opt.include, type) >= 0) {
+            builder(foundCpts, targetInfoList, info);
+        }
+    });
+}
+
+var proto$2 = BrushTargetManager.prototype;
+
+proto$2.setOutputRanges = function (areas, ecModel) {
+    this.matchOutputRanges(areas, ecModel, function (area, coordRange, coordSys) {
+        (area.coordRanges || (area.coordRanges = [])).push(coordRange);
+        // area.coordRange is the first of area.coordRanges
+        if (!area.coordRange) {
+            area.coordRange = coordRange;
+            // In 'category' axis, coord to pixel is not reversible, so we can not
+            // rebuild range by coordRange accrately, which may bring trouble when
+            // brushing only one item. So we use __rangeOffset to rebuilding range
+            // by coordRange. And this it only used in brush component so it is no
+            // need to be adapted to coordRanges.
+            var result = coordConvert[area.brushType](0, coordSys, coordRange);
+            area.__rangeOffset = {
+                offset: diffProcessor[area.brushType](result.values, area.range, [1, 1]),
+                xyMinMax: result.xyMinMax
+            };
+        }
+    });
+};
+
+proto$2.matchOutputRanges = function (areas, ecModel, cb) {
+    each$20(areas, function (area) {
+        var targetInfo = this.findTargetInfo(area, ecModel);
+
+        if (targetInfo && targetInfo !== true) {
+            each$1(
+                targetInfo.coordSyses,
+                function (coordSys) {
+                    var result = coordConvert[area.brushType](1, coordSys, area.range);
+                    cb(area, result.values, coordSys, ecModel);
+                }
+            );
+        }
+    }, this);
+};
+
+proto$2.setInputRanges = function (areas, ecModel) {
+    each$20(areas, function (area) {
+        var targetInfo = this.findTargetInfo(area, ecModel);
+
+        if (__DEV__) {
+            assert$1(
+                !targetInfo || targetInfo === true || area.coordRange,
+                'coordRange must be specified when coord index specified.'
+            );
+            assert$1(
+                !targetInfo || targetInfo !== true || area.range,
+                'range must be specified in global brush.'
+            );
+        }
+
+        area.range = area.range || [];
+
+        // convert coordRange to global range and set panelId.
+        if (targetInfo && targetInfo !== true) {
+            area.panelId = targetInfo.panelId;
+            // (1) area.range shoule always be calculate from coordRange but does
+            // not keep its original value, for the sake of the dataZoom scenario,
+            // where area.coordRange remains unchanged but area.range may be changed.
+            // (2) Only support converting one coordRange to pixel range in brush
+            // component. So do not consider `coordRanges`.
+            // (3) About __rangeOffset, see comment above.
+            var result = coordConvert[area.brushType](0, targetInfo.coordSys, area.coordRange);
+            var rangeOffset = area.__rangeOffset;
+            area.range = rangeOffset
+                ? diffProcessor[area.brushType](
+                    result.values,
+                    rangeOffset.offset,
+                    getScales(result.xyMinMax, rangeOffset.xyMinMax)
+                )
+                : result.values;
+        }
+    }, this);
+};
+
+proto$2.makePanelOpts = function (api, getDefaultBrushType) {
+    return map(this._targetInfoList, function (targetInfo) {
+        var rect = targetInfo.getPanelRect();
+        return {
+            panelId: targetInfo.panelId,
+            defaultBrushType: getDefaultBrushType && getDefaultBrushType(targetInfo),
+            clipPath: makeRectPanelClipPath(rect),
+            isTargetByCursor: makeRectIsTargetByCursor(
+                rect, api, targetInfo.coordSysModel
+            ),
+            getLinearBrushOtherExtent: makeLinearBrushOtherExtent(rect)
+        };
+    });
+};
+
+proto$2.controlSeries = function (area, seriesModel, ecModel) {
+    // Check whether area is bound in coord, and series do not belong to that coord.
+    // If do not do this check, some brush (like lineX) will controll all axes.
+    var targetInfo = this.findTargetInfo(area, ecModel);
+    return targetInfo === true || (
+        targetInfo && indexOf$1(targetInfo.coordSyses, seriesModel.coordinateSystem) >= 0
+    );
+};
+
+/**
+ * If return Object, a coord found.
+ * If reutrn true, global found.
+ * Otherwise nothing found.
+ *
+ * @param {Object} area
+ * @param {Array} targetInfoList
+ * @return {Object|boolean}
+ */
+proto$2.findTargetInfo = function (area, ecModel) {
+    var targetInfoList = this._targetInfoList;
+    var foundCpts = parseFinder$1(ecModel, area);
+
+    for (var i = 0; i < targetInfoList.length; i++) {
+        var targetInfo = targetInfoList[i];
+        var areaPanelId = area.panelId;
+        if (areaPanelId) {
+            if (targetInfo.panelId === areaPanelId) {
+                return targetInfo;
+            }
+        }
+        else {
+            for (var i = 0; i < targetInfoMatchers.length; i++) {
+                if (targetInfoMatchers[i](foundCpts, targetInfo)) {
+                    return targetInfo;
+                }
+            }
+        }
+    }
+
+    return true;
+};
+
+function formatMinMax(minMax) {
+    minMax[0] > minMax[1] && minMax.reverse();
+    return minMax;
+}
+
+function parseFinder$1(ecModel, option) {
+    return parseFinder(
+        ecModel, option, {includeMainTypes: INCLUDE_FINDER_MAIN_TYPES}
+    );
+}
+
+var targetInfoBuilders = {
+
+    grid: function (foundCpts, targetInfoList) {
+        var xAxisModels = foundCpts.xAxisModels;
+        var yAxisModels = foundCpts.yAxisModels;
+        var gridModels = foundCpts.gridModels;
+        // Remove duplicated.
+        var gridModelMap = createHashMap();
+        var xAxesHas = {};
+        var yAxesHas = {};
+
+        if (!xAxisModels && !yAxisModels && !gridModels) {
+            return;
+        }
+
+        each$20(xAxisModels, function (axisModel) {
+            var gridModel = axisModel.axis.grid.model;
+            gridModelMap.set(gridModel.id, gridModel);
+            xAxesHas[gridModel.id] = true;
+        });
+        each$20(yAxisModels, function (axisModel) {
+            var gridModel = axisModel.axis.grid.model;
+            gridModelMap.set(gridModel.id, gridModel);
+            yAxesHas[gridModel.id] = true;
+        });
+        each$20(gridModels, function (gridModel) {
+            gridModelMap.set(gridModel.id, gridModel);
+            xAxesHas[gridModel.id] = true;
+            yAxesHas[gridModel.id] = true;
+        });
+
+        gridModelMap.each(function (gridModel) {
+            var grid = gridModel.coordinateSystem;
+            var cartesians = [];
+
+            each$20(grid.getCartesians(), function (cartesian, index) {
+                if (indexOf$1(xAxisModels, cartesian.getAxis('x').model) >= 0
+                    || indexOf$1(yAxisModels, cartesian.getAxis('y').model) >= 0
+                ) {
+                    cartesians.push(cartesian);
+                }
+            });
+            targetInfoList.push({
+                panelId: 'grid--' + gridModel.id,
+                gridModel: gridModel,
+                coordSysModel: gridModel,
+                // Use the first one as the representitive coordSys.
+                coordSys: cartesians[0],
+                coordSyses: cartesians,
+                getPanelRect: panelRectBuilder.grid,
+                xAxisDeclared: xAxesHas[gridModel.id],
+                yAxisDeclared: yAxesHas[gridModel.id]
+            });
+        });
+    },
+
+    geo: function (foundCpts, targetInfoList) {
+        each$20(foundCpts.geoModels, function (geoModel) {
+            var coordSys = geoModel.coordinateSystem;
+            targetInfoList.push({
+                panelId: 'geo--' + geoModel.id,
+                geoModel: geoModel,
+                coordSysModel: geoModel,
+                coordSys: coordSys,
+                coordSyses: [coordSys],
+                getPanelRect: panelRectBuilder.geo
+            });
+        });
+    }
+};
+
+var targetInfoMatchers = [
+
+    // grid
+    function (foundCpts, targetInfo) {
+        var xAxisModel = foundCpts.xAxisModel;
+        var yAxisModel = foundCpts.yAxisModel;
+        var gridModel = foundCpts.gridModel;
+
+        !gridModel && xAxisModel && (gridModel = xAxisModel.axis.grid.model);
+        !gridModel && yAxisModel && (gridModel = yAxisModel.axis.grid.model);
+
+        return gridModel && gridModel === targetInfo.gridModel;
+    },
+
+    // geo
+    function (foundCpts, targetInfo) {
+        var geoModel = foundCpts.geoModel;
+        return geoModel && geoModel === targetInfo.geoModel;
+    }
+];
+
+var panelRectBuilder = {
+
+    grid: function () {
+        // grid is not Transformable.
+        return this.coordSys.grid.getRect().clone();
+    },
+
+    geo: function () {
+        var coordSys = this.coordSys;
+        var rect = coordSys.getBoundingRect().clone();
+        // geo roam and zoom transform
+        rect.applyTransform(getTransform(coordSys));
+        return rect;
+    }
+};
+
+var coordConvert = {
+
+    lineX: curry$5(axisConvert, 0),
+
+    lineY: curry$5(axisConvert, 1),
+
+    rect: function (to, coordSys, rangeOrCoordRange) {
+        var xminymin = coordSys[COORD_CONVERTS[to]]([rangeOrCoordRange[0][0], rangeOrCoordRange[1][0]]);
+        var xmaxymax = coordSys[COORD_CONVERTS[to]]([rangeOrCoordRange[0][1], rangeOrCoordRange[1][1]]);
+        var values = [
+            formatMinMax([xminymin[0], xmaxymax[0]]),
+            formatMinMax([xminymin[1], xmaxymax[1]])
+        ];
+        return {values: values, xyMinMax: values};
+    },
+
+    polygon: function (to, coordSys, rangeOrCoordRange) {
+        var xyMinMax = [[Infinity, -Infinity], [Infinity, -Infinity]];
+        var values = map(rangeOrCoordRange, function (item) {
+            var p = coordSys[COORD_CONVERTS[to]](item);
+            xyMinMax[0][0] = Math.min(xyMinMax[0][0], p[0]);
+            xyMinMax[1][0] = Math.min(xyMinMax[1][0], p[1]);
+            xyMinMax[0][1] = Math.max(xyMinMax[0][1], p[0]);
+            xyMinMax[1][1] = Math.max(xyMinMax[1][1], p[1]);
+            return p;
+        });
+        return {values: values, xyMinMax: xyMinMax};
+    }
+};
+
+function axisConvert(axisNameIndex, to, coordSys, rangeOrCoordRange) {
+    if (__DEV__) {
+        assert$1(
+            coordSys.type === 'cartesian2d',
+            'lineX/lineY brush is available only in cartesian2d.'
+        );
+    }
+
+    var axis = coordSys.getAxis(['x', 'y'][axisNameIndex]);
+    var values = formatMinMax(map([0, 1], function (i) {
+        return to
+            ? axis.coordToData(axis.toLocalCoord(rangeOrCoordRange[i]))
+            : axis.toGlobalCoord(axis.dataToCoord(rangeOrCoordRange[i]));
+    }));
+    var xyMinMax = [];
+    xyMinMax[axisNameIndex] = values;
+    xyMinMax[1 - axisNameIndex] = [NaN, NaN];
+
+    return {values: values, xyMinMax: xyMinMax};
+}
+
+var diffProcessor = {
+    lineX: curry$5(axisDiffProcessor, 0),
+
+    lineY: curry$5(axisDiffProcessor, 1),
+
+    rect: function (values, refer, scales) {
+        return [
+            [values[0][0] - scales[0] * refer[0][0], values[0][1] - scales[0] * refer[0][1]],
+            [values[1][0] - scales[1] * refer[1][0], values[1][1] - scales[1] * refer[1][1]]
+        ];
+    },
+
+    polygon: function (values, refer, scales) {
+        return map(values, function (item, idx) {
+            return [item[0] - scales[0] * refer[idx][0], item[1] - scales[1] * refer[idx][1]];
+        });
+    }
+};
+
+function axisDiffProcessor(axisNameIndex, values, refer, scales) {
+    return [
+        values[0] - scales[axisNameIndex] * refer[0],
+        values[1] - scales[axisNameIndex] * refer[1]
+    ];
+}
+
+// We have to process scale caused by dataZoom manually,
+// although it might be not accurate.
+function getScales(xyMinMaxCurr, xyMinMaxOrigin) {
+    var sizeCurr = getSize(xyMinMaxCurr);
+    var sizeOrigin = getSize(xyMinMaxOrigin);
+    var scales = [sizeCurr[0] / sizeOrigin[0], sizeCurr[1] / sizeOrigin[1]];
+    isNaN(scales[0]) && (scales[0] = 1);
+    isNaN(scales[1]) && (scales[1] = 1);
+    return scales;
+}
+
+function getSize(xyMinMax) {
+    return xyMinMax
+        ? [xyMinMax[0][1] - xyMinMax[0][0], xyMinMax[1][1] - xyMinMax[1][0]]
+        : [NaN, NaN];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var STATE_LIST = ['inBrush', 'outOfBrush'];
+var DISPATCH_METHOD = '__ecBrushSelect';
+var DISPATCH_FLAG = '__ecInBrushSelectEvent';
+var PRIORITY_BRUSH = PRIORITY.VISUAL.BRUSH;
+
+/**
+ * Layout for visual, the priority higher than other layout, and before brush visual.
+ */
+registerLayout(PRIORITY_BRUSH, function (ecModel, api, payload) {
+    ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
+
+        payload && payload.type === 'takeGlobalCursor' && brushModel.setBrushOption(
+            payload.key === 'brush' ? payload.brushOption : {brushType: false}
+        );
+
+        var brushTargetManager = brushModel.brushTargetManager = new BrushTargetManager(brushModel.option, ecModel);
+
+        brushTargetManager.setInputRanges(brushModel.areas, ecModel);
+    });
+});
+
+/**
+ * Register the visual encoding if this modules required.
+ */
+registerVisual(PRIORITY_BRUSH, function (ecModel, api, payload) {
+
+    var brushSelected = [];
+    var throttleType;
+    var throttleDelay;
+
+    ecModel.eachComponent({mainType: 'brush'}, function (brushModel, brushIndex) {
+
+        var thisBrushSelected = {
+            brushId: brushModel.id,
+            brushIndex: brushIndex,
+            brushName: brushModel.name,
+            areas: clone(brushModel.areas),
+            selected: []
+        };
+        // Every brush component exists in event params, convenient
+        // for user to find by index.
+        brushSelected.push(thisBrushSelected);
+
+        var brushOption = brushModel.option;
+        var brushLink = brushOption.brushLink;
+        var linkedSeriesMap = [];
+        var selectedDataIndexForLink = [];
+        var rangeInfoBySeries = [];
+        var hasBrushExists = 0;
+
+        if (!brushIndex) { // Only the first throttle setting works.
+            throttleType = brushOption.throttleType;
+            throttleDelay = brushOption.throttleDelay;
+        }
+
+        // Add boundingRect and selectors to range.
+        var areas = map(brushModel.areas, function (area) {
+            return bindSelector(
+                defaults(
+                    {boundingRect: boundingRectBuilders[area.brushType](area)},
+                    area
+                )
+            );
+        });
+
+        var visualMappings = createVisualMappings(
+            brushModel.option, STATE_LIST, function (mappingOption) {
+                mappingOption.mappingMethod = 'fixed';
+            }
+        );
+
+        isArray(brushLink) && each$1(brushLink, function (seriesIndex) {
+            linkedSeriesMap[seriesIndex] = 1;
+        });
+
+        function linkOthers(seriesIndex) {
+            return brushLink === 'all' || linkedSeriesMap[seriesIndex];
+        }
+
+        // If no supported brush or no brush on the series,
+        // all visuals should be in original state.
+        function brushed(rangeInfoList) {
+            return !!rangeInfoList.length;
+        }
+
+        /**
+         * Logic for each series: (If the logic has to be modified one day, do it carefully!)
+         *
+         * ( brushed ┬ && ┬hasBrushExist ┬ && linkOthers  ) => StepA: ┬record, ┬ StepB: ┬visualByRecord.
+         *   !brushed┘    ├hasBrushExist ┤                            └nothing,┘        ├visualByRecord.
+         *                └!hasBrushExist┘                                              └nothing.
+         * ( !brushed  && ┬hasBrushExist ┬ && linkOthers  ) => StepA:  nothing,  StepB: ┬visualByRecord.
+         *                └!hasBrushExist┘                                              └nothing.
+         * ( brushed ┬ &&                     !linkOthers ) => StepA:  nothing,  StepB: ┬visualByCheck.
+         *   !brushed┘                                                                  └nothing.
+         * ( !brushed  &&                     !linkOthers ) => StepA:  nothing,  StepB:  nothing.
+         */
+
+        // Step A
+        ecModel.eachSeries(function (seriesModel, seriesIndex) {
+            var rangeInfoList = rangeInfoBySeries[seriesIndex] = [];
+
+            seriesModel.subType === 'parallel'
+                ? stepAParallel(seriesModel, seriesIndex, rangeInfoList)
+                : stepAOthers(seriesModel, seriesIndex, rangeInfoList);
+        });
+
+        function stepAParallel(seriesModel, seriesIndex) {
+            var coordSys = seriesModel.coordinateSystem;
+            hasBrushExists |= coordSys.hasAxisBrushed();
+
+            linkOthers(seriesIndex) && coordSys.eachActiveState(
+                seriesModel.getData(),
+                function (activeState, dataIndex) {
+                    activeState === 'active' && (selectedDataIndexForLink[dataIndex] = 1);
+                }
+            );
+        }
+
+        function stepAOthers(seriesModel, seriesIndex, rangeInfoList) {
+            var selectorsByBrushType = getSelectorsByBrushType(seriesModel);
+            if (!selectorsByBrushType || brushModelNotControll(brushModel, seriesIndex)) {
+                return;
+            }
+
+            each$1(areas, function (area) {
+                selectorsByBrushType[area.brushType]
+                    && brushModel.brushTargetManager.controlSeries(area, seriesModel, ecModel)
+                    && rangeInfoList.push(area);
+                hasBrushExists |= brushed(rangeInfoList);
+            });
+
+            if (linkOthers(seriesIndex) && brushed(rangeInfoList)) {
+                var data = seriesModel.getData();
+                data.each(function (dataIndex) {
+                    if (checkInRange(selectorsByBrushType, rangeInfoList, data, dataIndex)) {
+                        selectedDataIndexForLink[dataIndex] = 1;
+                    }
+                });
+            }
+        }
+
+        // Step B
+        ecModel.eachSeries(function (seriesModel, seriesIndex) {
+            var seriesBrushSelected = {
+                seriesId: seriesModel.id,
+                seriesIndex: seriesIndex,
+                seriesName: seriesModel.name,
+                dataIndex: []
+            };
+            // Every series exists in event params, convenient
+            // for user to find series by seriesIndex.
+            thisBrushSelected.selected.push(seriesBrushSelected);
+
+            var selectorsByBrushType = getSelectorsByBrushType(seriesModel);
+            var rangeInfoList = rangeInfoBySeries[seriesIndex];
+
+            var data = seriesModel.getData();
+            var getValueState = linkOthers(seriesIndex)
+                ? function (dataIndex) {
+                    return selectedDataIndexForLink[dataIndex]
+                        ? (seriesBrushSelected.dataIndex.push(data.getRawIndex(dataIndex)), 'inBrush')
+                        : 'outOfBrush';
+                }
+                : function (dataIndex) {
+                    return checkInRange(selectorsByBrushType, rangeInfoList, data, dataIndex)
+                        ? (seriesBrushSelected.dataIndex.push(data.getRawIndex(dataIndex)), 'inBrush')
+                        : 'outOfBrush';
+                };
+
+            // If no supported brush or no brush, all visuals are in original state.
+            (linkOthers(seriesIndex) ? hasBrushExists : brushed(rangeInfoList))
+                && applyVisual(
+                    STATE_LIST, visualMappings, data, getValueState
+                );
+        });
+
+    });
+
+    dispatchAction(api, throttleType, throttleDelay, brushSelected, payload);
+});
+
+function dispatchAction(api, throttleType, throttleDelay, brushSelected, payload) {
+    // This event will not be triggered when `setOpion`, otherwise dead lock may
+    // triggered when do `setOption` in event listener, which we do not find
+    // satisfactory way to solve yet. Some considered resolutions:
+    // (a) Diff with prevoius selected data ant only trigger event when changed.
+    // But store previous data and diff precisely (i.e., not only by dataIndex, but
+    // also detect value changes in selected data) might bring complexity or fragility.
+    // (b) Use spectial param like `silent` to suppress event triggering.
+    // But such kind of volatile param may be weird in `setOption`.
+    if (!payload) {
+        return;
+    }
+
+    var zr = api.getZr();
+    if (zr[DISPATCH_FLAG]) {
+        return;
+    }
+
+    if (!zr[DISPATCH_METHOD]) {
+        zr[DISPATCH_METHOD] = doDispatch;
+    }
+
+    var fn = createOrUpdate(zr, DISPATCH_METHOD, throttleDelay, throttleType);
+
+    fn(api, brushSelected);
+}
+
+function doDispatch(api, brushSelected) {
+    if (!api.isDisposed()) {
+        var zr = api.getZr();
+        zr[DISPATCH_FLAG] = true;
+        api.dispatchAction({
+            type: 'brushSelect',
+            batch: brushSelected
+        });
+        zr[DISPATCH_FLAG] = false;
+    }
+}
+
+function checkInRange(selectorsByBrushType, rangeInfoList, data, dataIndex) {
+    for (var i = 0, len = rangeInfoList.length; i < len; i++) {
+        var area = rangeInfoList[i];
+        if (selectorsByBrushType[area.brushType](
+            dataIndex, data, area.selectors, area
+        )) {
+            return true;
+        }
+    }
+}
+
+function getSelectorsByBrushType(seriesModel) {
+    var brushSelector = seriesModel.brushSelector;
+    if (isString(brushSelector)) {
+        var sels = [];
+        each$1(selector, function (selectorsByElementType, brushType) {
+            sels[brushType] = function (dataIndex, data, selectors, area) {
+                var itemLayout = data.getItemLayout(dataIndex);
+                return selectorsByElementType[brushSelector](itemLayout, selectors, area);
+            };
+        });
+        return sels;
+    }
+    else if (isFunction$1(brushSelector)) {
+        var bSelector = {};
+        each$1(selector, function (sel, brushType) {
+            bSelector[brushType] = brushSelector;
+        });
+        return bSelector;
+    }
+    return brushSelector;
+}
+
+function brushModelNotControll(brushModel, seriesIndex) {
+    var seriesIndices = brushModel.option.seriesIndex;
+    return seriesIndices != null
+        && seriesIndices !== 'all'
+        && (
+            isArray(seriesIndices)
+            ? indexOf(seriesIndices, seriesIndex) < 0
+            : seriesIndex !== seriesIndices
+        );
+}
+
+function bindSelector(area) {
+    var selectors = area.selectors = {};
+    each$1(selector[area.brushType], function (selFn, elType) {
+        // Do not use function binding or curry for performance.
+        selectors[elType] = function (itemLayout) {
+            return selFn(itemLayout, selectors, area);
+        };
+    });
+    return area;
+}
+
+var boundingRectBuilders = {
+
+    lineX: noop,
+
+    lineY: noop,
+
+    rect: function (area) {
+        return getBoundingRectFromMinMax(area.range);
+    },
+
+    polygon: function (area) {
+        var minMax;
+        var range = area.range;
+
+        for (var i = 0, len = range.length; i < len; i++) {
+            minMax = minMax || [[Infinity, -Infinity], [Infinity, -Infinity]];
+            var rg = range[i];
+            rg[0] < minMax[0][0] && (minMax[0][0] = rg[0]);
+            rg[0] > minMax[0][1] && (minMax[0][1] = rg[0]);
+            rg[1] < minMax[1][0] && (minMax[1][0] = rg[1]);
+            rg[1] > minMax[1][1] && (minMax[1][1] = rg[1]);
+        }
+
+        return minMax && getBoundingRectFromMinMax(minMax);
+    }
+};
+
+function getBoundingRectFromMinMax(minMax) {
+    return new BoundingRect(
+        minMax[0][0],
+        minMax[1][0],
+        minMax[0][1] - minMax[0][0],
+        minMax[1][1] - minMax[1][0]
+    );
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DEFAULT_OUT_OF_BRUSH_COLOR = ['#ddd'];
+
+var BrushModel = extendComponentModel({
+
+    type: 'brush',
+
+    dependencies: ['geo', 'grid', 'xAxis', 'yAxis', 'parallel', 'series'],
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        // inBrush: null,
+        // outOfBrush: null,
+        toolbox: null,          // Default value see preprocessor.
+        brushLink: null,        // Series indices array, broadcast using dataIndex.
+                                // or 'all', which means all series. 'none' or null means no series.
+        seriesIndex: 'all',     // seriesIndex array, specify series controlled by this brush component.
+        geoIndex: null,         //
+        xAxisIndex: null,
+        yAxisIndex: null,
+
+        brushType: 'rect',      // Default brushType, see BrushController.
+        brushMode: 'single',    // Default brushMode, 'single' or 'multiple'
+        transformable: true,    // Default transformable.
+        brushStyle: {           // Default brushStyle
+            borderWidth: 1,
+            color: 'rgba(120,140,180,0.3)',
+            borderColor: 'rgba(120,140,180,0.8)'
+        },
+
+        throttleType: 'fixRate',// Throttle in brushSelected event. 'fixRate' or 'debounce'.
+                                // If null, no throttle. Valid only in the first brush component
+        throttleDelay: 0,       // Unit: ms, 0 means every event will be triggered.
+
+        // FIXME
+        // 试验效果
+        removeOnClick: true,
+
+        z: 10000
+    },
+
+    /**
+     * @readOnly
+     * @type {Array.<Object>}
+     */
+    areas: [],
+
+    /**
+     * Current activated brush type.
+     * If null, brush is inactived.
+     * see module:echarts/component/helper/BrushController
+     * @readOnly
+     * @type {string}
+     */
+    brushType: null,
+
+    /**
+     * Current brush opt.
+     * see module:echarts/component/helper/BrushController
+     * @readOnly
+     * @type {Object}
+     */
+    brushOption: {},
+
+    /**
+     * @readOnly
+     * @type {Array.<Object>}
+     */
+    coordInfoList: [],
+
+    optionUpdated: function (newOption, isInit) {
+        var thisOption = this.option;
+
+        !isInit && replaceVisualOption(
+            thisOption, newOption, ['inBrush', 'outOfBrush']
+        );
+
+        var inBrush = thisOption.inBrush = thisOption.inBrush || {};
+        // Always give default visual, consider setOption at the second time.
+        thisOption.outOfBrush = thisOption.outOfBrush || {color: DEFAULT_OUT_OF_BRUSH_COLOR};
+
+        if (!inBrush.hasOwnProperty('liftZ')) {
+            // Bigger than the highlight z lift, otherwise it will
+            // be effected by the highlight z when brush.
+            inBrush.liftZ = 5;
+        }
+    },
+
+    /**
+     * If ranges is null/undefined, range state remain.
+     *
+     * @param {Array.<Object>} [ranges]
+     */
+    setAreas: function (areas) {
+        if (__DEV__) {
+            assert$1(isArray(areas));
+            each$1(areas, function (area) {
+                assert$1(area.brushType, 'Illegal areas');
+            });
+        }
+
+        // If ranges is null/undefined, range state remain.
+        // This helps user to dispatchAction({type: 'brush'}) with no areas
+        // set but just want to get the current brush select info from a `brush` event.
+        if (!areas) {
+            return;
+        }
+
+        this.areas = map(areas, function (area) {
+            return generateBrushOption(this.option, area);
+        }, this);
+    },
+
+    /**
+     * see module:echarts/component/helper/BrushController
+     * @param {Object} brushOption
+     */
+    setBrushOption: function (brushOption) {
+        this.brushOption = generateBrushOption(this.option, brushOption);
+        this.brushType = this.brushOption.brushType;
+    }
+
+});
+
+function generateBrushOption(option, brushOption) {
+    return merge(
+        {
+            brushType: option.brushType,
+            brushMode: option.brushMode,
+            transformable: option.transformable,
+            brushStyle: new Model(option.brushStyle).getItemStyle(),
+            removeOnClick: option.removeOnClick,
+            z: option.z
+        },
+        brushOption,
+        true
+    );
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+
+    type: 'brush',
+
+    init: function (ecModel, api) {
+
+        /**
+         * @readOnly
+         * @type {module:echarts/model/Global}
+         */
+        this.ecModel = ecModel;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/ExtensionAPI}
+         */
+        this.api = api;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/component/brush/BrushModel}
+         */
+        this.model;
+
+        /**
+         * @private
+         * @type {module:echarts/component/helper/BrushController}
+         */
+        (this._brushController = new BrushController(api.getZr()))
+            .on('brush', bind(this._onBrush, this))
+            .mount();
+    },
+
+    /**
+     * @override
+     */
+    render: function (brushModel) {
+        this.model = brushModel;
+        return updateController.apply(this, arguments);
+    },
+
+    /**
+     * @override
+     */
+    updateTransform: updateController,
+
+    /**
+     * @override
+     */
+    updateView: updateController,
+
+    // /**
+    //  * @override
+    //  */
+    // updateLayout: updateController,
+
+    // /**
+    //  * @override
+    //  */
+    // updateVisual: updateController,
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._brushController.dispose();
+    },
+
+    /**
+     * @private
+     */
+    _onBrush: function (areas, opt) {
+        var modelId = this.model.id;
+
+        this.model.brushTargetManager.setOutputRanges(areas, this.ecModel);
+
+        // Action is not dispatched on drag end, because the drag end
+        // emits the same params with the last drag move event, and
+        // may have some delay when using touch pad, which makes
+        // animation not smooth (when using debounce).
+        (!opt.isEnd || opt.removeOnClick) && this.api.dispatchAction({
+            type: 'brush',
+            brushId: modelId,
+            areas: clone(areas),
+            $from: modelId
+        });
+    }
+
+});
+
+function updateController(brushModel, ecModel, api, payload) {
+    // Do not update controller when drawing.
+    (!payload || payload.$from !== brushModel.id) && this._brushController
+        .setPanels(brushModel.brushTargetManager.makePanelOpts(api))
+        .enableBrush(brushModel.brushOption)
+        .updateCovers(brushModel.areas.slice());
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * payload: {
+ *      brushIndex: number, or,
+ *      brushId: string, or,
+ *      brushName: string,
+ *      globalRanges: Array
+ * }
+ */
+registerAction(
+        {type: 'brush', event: 'brush' /*, update: 'updateView' */},
+    function (payload, ecModel) {
+        ecModel.eachComponent({mainType: 'brush', query: payload}, function (brushModel) {
+            brushModel.setAreas(payload.areas);
+        });
+    }
+);
+
+/**
+ * payload: {
+ *      brushComponents: [
+ *          {
+ *              brushId,
+ *              brushIndex,
+ *              brushName,
+ *              series: [
+ *                  {
+ *                      seriesId,
+ *                      seriesIndex,
+ *                      seriesName,
+ *                      rawIndices: [21, 34, ...]
+ *                  },
+ *                  ...
+ *              ]
+ *          },
+ *          ...
+ *      ]
+ * }
+ */
+registerAction(
+        {type: 'brushSelect', event: 'brushSelected', update: 'none'},
+    function () {}
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+
+var features = {};
+
+function register$1(name, ctor) {
+    features[name] = ctor;
+}
+
+function get$1(name) {
+    return features[name];
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var brushLang = lang.toolbox.brush;
+
+function Brush(model, ecModel, api) {
+    this.model = model;
+    this.ecModel = ecModel;
+    this.api = api;
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._brushType;
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._brushMode;
+}
+
+Brush.defaultOption = {
+    show: true,
+    type: ['rect', 'polygon', 'lineX', 'lineY', 'keep', 'clear'],
+    icon: {
+        rect: 'M7.3,34.7 M0.4,10V-0.2h9.8 M89.6,10V-0.2h-9.8 M0.4,60v10.2h9.8 M89.6,60v10.2h-9.8 M12.3,22.4V10.5h13.1 M33.6,10.5h7.8 M49.1,10.5h7.8 M77.5,22.4V10.5h-13 M12.3,31.1v8.2 M77.7,31.1v8.2 M12.3,47.6v11.9h13.1 M33.6,59.5h7.6 M49.1,59.5 h7.7 M77.5,47.6v11.9h-13', // jshint ignore:line
+        polygon: 'M55.2,34.9c1.7,0,3.1,1.4,3.1,3.1s-1.4,3.1-3.1,3.1 s-3.1-1.4-3.1-3.1S53.5,34.9,55.2,34.9z M50.4,51c1.7,0,3.1,1.4,3.1,3.1c0,1.7-1.4,3.1-3.1,3.1c-1.7,0-3.1-1.4-3.1-3.1 C47.3,52.4,48.7,51,50.4,51z M55.6,37.1l1.5-7.8 M60.1,13.5l1.6-8.7l-7.8,4 M59,19l-1,5.3 M24,16.1l6.4,4.9l6.4-3.3 M48.5,11.6 l-5.9,3.1 M19.1,12.8L9.7,5.1l1.1,7.7 M13.4,29.8l1,7.3l6.6,1.6 M11.6,18.4l1,6.1 M32.8,41.9 M26.6,40.4 M27.3,40.2l6.1,1.6 M49.9,52.1l-5.6-7.6l-4.9-1.2', // jshint ignore:line
+        lineX: 'M15.2,30 M19.7,15.6V1.9H29 M34.8,1.9H40.4 M55.3,15.6V1.9H45.9 M19.7,44.4V58.1H29 M34.8,58.1H40.4 M55.3,44.4 V58.1H45.9 M12.5,20.3l-9.4,9.6l9.6,9.8 M3.1,29.9h16.5 M62.5,20.3l9.4,9.6L62.3,39.7 M71.9,29.9H55.4', // jshint ignore:line
+        lineY: 'M38.8,7.7 M52.7,12h13.2v9 M65.9,26.6V32 M52.7,46.3h13.2v-9 M24.9,12H11.8v9 M11.8,26.6V32 M24.9,46.3H11.8v-9 M48.2,5.1l-9.3-9l-9.4,9.2 M38.9-3.9V12 M48.2,53.3l-9.3,9l-9.4-9.2 M38.9,62.3V46.4', // jshint ignore:line
+        keep: 'M4,10.5V1h10.3 M20.7,1h6.1 M33,1h6.1 M55.4,10.5V1H45.2 M4,17.3v6.6 M55.6,17.3v6.6 M4,30.5V40h10.3 M20.7,40 h6.1 M33,40h6.1 M55.4,30.5V40H45.2 M21,18.9h62.9v48.6H21V18.9z', // jshint ignore:line
+        clear: 'M22,14.7l30.9,31 M52.9,14.7L22,45.7 M4.7,16.8V4.2h13.1 M26,4.2h7.8 M41.6,4.2h7.8 M70.3,16.8V4.2H57.2 M4.7,25.9v8.6 M70.3,25.9v8.6 M4.7,43.2v12.6h13.1 M26,55.8h7.8 M41.6,55.8h7.8 M70.3,43.2v12.6H57.2' // jshint ignore:line
+    },
+    // `rect`, `polygon`, `lineX`, `lineY`, `keep`, `clear`
+    title: clone(brushLang.title)
+};
+
+var proto$3 = Brush.prototype;
+
+// proto.updateLayout = function (featureModel, ecModel, api) {
+proto$3.render =
+proto$3.updateView = function (featureModel, ecModel, api) {
+    var brushType;
+    var brushMode;
+    var isBrushed;
+
+    ecModel.eachComponent({mainType: 'brush'}, function (brushModel) {
+        brushType = brushModel.brushType;
+        brushMode = brushModel.brushOption.brushMode || 'single';
+        isBrushed |= brushModel.areas.length;
+    });
+    this._brushType = brushType;
+    this._brushMode = brushMode;
+
+    each$1(featureModel.get('type', true), function (type) {
+        featureModel.setIconStatus(
+            type,
+            (
+                type === 'keep'
+                ? brushMode === 'multiple'
+                : type === 'clear'
+                ? isBrushed
+                : type === brushType
+            ) ? 'emphasis' : 'normal'
+        );
+    });
+};
+
+proto$3.getIcons = function () {
+    var model = this.model;
+    var availableIcons = model.get('icon', true);
+    var icons = {};
+    each$1(model.get('type', true), function (type) {
+        if (availableIcons[type]) {
+            icons[type] = availableIcons[type];
+        }
+    });
+    return icons;
+};
+
+proto$3.onclick = function (ecModel, api, type) {
+    var brushType = this._brushType;
+    var brushMode = this._brushMode;
+
+    if (type === 'clear') {
+        // Trigger parallel action firstly
+        api.dispatchAction({
+            type: 'axisAreaSelect',
+            intervals: []
+        });
+
+        api.dispatchAction({
+            type: 'brush',
+            command: 'clear',
+            // Clear all areas of all brush components.
+            areas: []
+        });
+    }
+    else {
+        api.dispatchAction({
+            type: 'takeGlobalCursor',
+            key: 'brush',
+            brushOption: {
+                brushType: type === 'keep'
+                    ? brushType
+                    : (brushType === type ? false : type),
+                brushMode: type === 'keep'
+                    ? (brushMode === 'multiple' ? 'single' : 'multiple')
+                    : brushMode
+            }
+        });
+    }
+};
+
+register$1('brush', Brush);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Brush component entry
+ */
+
+registerPreprocessor(preprocessor$1);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// (24*60*60*1000)
+var PROXIMATE_ONE_DAY = 86400000;
+
+/**
+ * Calendar
+ *
+ * @constructor
+ *
+ * @param {Object} calendarModel calendarModel
+ * @param {Object} ecModel       ecModel
+ * @param {Object} api           api
+ */
+function Calendar(calendarModel, ecModel, api) {
+    this._model = calendarModel;
+}
+
+Calendar.prototype = {
+
+    constructor: Calendar,
+
+    type: 'calendar',
+
+    dimensions: ['time', 'value'],
+
+    // Required in createListFromData
+    getDimensionsInfo: function () {
+        return [{name: 'time', type: 'time'}, 'value'];
+    },
+
+    getRangeInfo: function () {
+        return this._rangeInfo;
+    },
+
+    getModel: function () {
+        return this._model;
+    },
+
+    getRect: function () {
+        return this._rect;
+    },
+
+    getCellWidth: function () {
+        return this._sw;
+    },
+
+    getCellHeight: function () {
+        return this._sh;
+    },
+
+    getOrient: function () {
+        return this._orient;
+    },
+
+    /**
+     * getFirstDayOfWeek
+     *
+     * @example
+     *     0 : start at Sunday
+     *     1 : start at Monday
+     *
+     * @return {number}
+     */
+    getFirstDayOfWeek: function () {
+        return this._firstDayOfWeek;
+    },
+
+    /**
+     * get date info
+     *
+     * @param  {string|number} date date
+     * @return {Object}
+     * {
+     *      y: string, local full year, eg., '1940',
+     *      m: string, local month, from '01' ot '12',
+     *      d: string, local date, from '01' to '31' (if exists),
+     *      day: It is not date.getDay(). It is the location of the cell in a week, from 0 to 6,
+     *      time: timestamp,
+     *      formatedDate: string, yyyy-MM-dd,
+     *      date: original date object.
+     * }
+     */
+    getDateInfo: function (date) {
+
+        date = parseDate(date);
+
+        var y = date.getFullYear();
+
+        var m = date.getMonth() + 1;
+        m = m < 10 ? '0' + m : m;
+
+        var d = date.getDate();
+        d = d < 10 ? '0' + d : d;
+
+        var day = date.getDay();
+
+        day = Math.abs((day + 7 - this.getFirstDayOfWeek()) % 7);
+
+        return {
+            y: y,
+            m: m,
+            d: d,
+            day: day,
+            time: date.getTime(),
+            formatedDate: y + '-' + m + '-' + d,
+            date: date
+        };
+    },
+
+    getNextNDay: function (date, n) {
+        n = n || 0;
+        if (n === 0) {
+            return this.getDateInfo(date);
+        }
+
+        date = new Date(this.getDateInfo(date).time);
+        date.setDate(date.getDate() + n);
+
+        return this.getDateInfo(date);
+    },
+
+    update: function (ecModel, api) {
+
+        this._firstDayOfWeek = +this._model.getModel('dayLabel').get('firstDay');
+        this._orient = this._model.get('orient');
+        this._lineWidth = this._model.getModel('itemStyle').getItemStyle().lineWidth || 0;
+
+
+        this._rangeInfo = this._getRangeInfo(this._initRangeOption());
+        var weeks = this._rangeInfo.weeks || 1;
+        var whNames = ['width', 'height'];
+        var cellSize = this._model.get('cellSize').slice();
+        var layoutParams = this._model.getBoxLayoutParams();
+        var cellNumbers = this._orient === 'horizontal' ? [weeks, 7] : [7, weeks];
+
+        each$1([0, 1], function (idx) {
+            if (cellSizeSpecified(cellSize, idx)) {
+                layoutParams[whNames[idx]] = cellSize[idx] * cellNumbers[idx];
+            }
+        });
+
+        var whGlobal = {
+            width: api.getWidth(),
+            height: api.getHeight()
+        };
+        var calendarRect = this._rect = getLayoutRect(layoutParams, whGlobal);
+
+        each$1([0, 1], function (idx) {
+            if (!cellSizeSpecified(cellSize, idx)) {
+                cellSize[idx] = calendarRect[whNames[idx]] / cellNumbers[idx];
+            }
+        });
+
+        function cellSizeSpecified(cellSize, idx) {
+            return cellSize[idx] != null && cellSize[idx] !== 'auto';
+        }
+
+        this._sw = cellSize[0];
+        this._sh = cellSize[1];
+    },
+
+
+    /**
+     * Convert a time data(time, value) item to (x, y) point.
+     *
+     * @override
+     * @param  {Array|number} data data
+     * @param  {boolean} [clamp=true] out of range
+     * @return {Array} point
+     */
+    dataToPoint: function (data, clamp) {
+        isArray(data) && (data = data[0]);
+        clamp == null && (clamp = true);
+
+        var dayInfo = this.getDateInfo(data);
+        var range = this._rangeInfo;
+        var date = dayInfo.formatedDate;
+
+        // if not in range return [NaN, NaN]
+        if (clamp && !(
+            dayInfo.time >= range.start.time
+            && dayInfo.time < range.end.time + PROXIMATE_ONE_DAY
+        )) {
+            return [NaN, NaN];
+        }
+
+        var week = dayInfo.day;
+        var nthWeek = this._getRangeInfo([range.start.time, date]).nthWeek;
+
+        if (this._orient === 'vertical') {
+            return [
+                this._rect.x + week * this._sw + this._sw / 2,
+                this._rect.y + nthWeek * this._sh + this._sh / 2
+            ];
+
+        }
+
+        return [
+            this._rect.x + nthWeek * this._sw + this._sw / 2,
+            this._rect.y + week * this._sh + this._sh / 2
+        ];
+
+    },
+
+    /**
+     * Convert a (x, y) point to time data
+     *
+     * @override
+     * @param  {string} point point
+     * @return {string}       data
+     */
+    pointToData: function (point) {
+
+        var date = this.pointToDate(point);
+
+        return date && date.time;
+    },
+
+    /**
+     * Convert a time date item to (x, y) four point.
+     *
+     * @param  {Array} data  date[0] is date
+     * @param  {boolean} [clamp=true]  out of range
+     * @return {Object}       point
+     */
+    dataToRect: function (data, clamp) {
+        var point = this.dataToPoint(data, clamp);
+
+        return {
+            contentShape: {
+                x: point[0] - (this._sw - this._lineWidth) / 2,
+                y: point[1] - (this._sh - this._lineWidth) / 2,
+                width: this._sw - this._lineWidth,
+                height: this._sh - this._lineWidth
+            },
+
+            center: point,
+
+            tl: [
+                point[0] - this._sw / 2,
+                point[1] - this._sh / 2
+            ],
+
+            tr: [
+                point[0] + this._sw / 2,
+                point[1] - this._sh / 2
+            ],
+
+            br: [
+                point[0] + this._sw / 2,
+                point[1] + this._sh / 2
+            ],
+
+            bl: [
+                point[0] - this._sw / 2,
+                point[1] + this._sh / 2
+            ]
+
+        };
+    },
+
+    /**
+     * Convert a (x, y) point to time date
+     *
+     * @param  {Array} point point
+     * @return {Object}       date
+     */
+    pointToDate: function (point) {
+        var nthX = Math.floor((point[0] - this._rect.x) / this._sw) + 1;
+        var nthY = Math.floor((point[1] - this._rect.y) / this._sh) + 1;
+        var range = this._rangeInfo.range;
+
+        if (this._orient === 'vertical') {
+            return this._getDateByWeeksAndDay(nthY, nthX - 1, range);
+        }
+
+        return this._getDateByWeeksAndDay(nthX, nthY - 1, range);
+    },
+
+    /**
+     * @inheritDoc
+     */
+    convertToPixel: curry(doConvert$2, 'dataToPoint'),
+
+    /**
+     * @inheritDoc
+     */
+    convertFromPixel: curry(doConvert$2, 'pointToData'),
+
+    /**
+     * initRange
+     *
+     * @private
+     * @return {Array} [start, end]
+     */
+    _initRangeOption: function () {
+        var range = this._model.get('range');
+
+        var rg = range;
+
+        if (isArray(rg) && rg.length === 1) {
+            rg = rg[0];
+        }
+
+        if (/^\d{4}$/.test(rg)) {
+            range = [rg + '-01-01', rg + '-12-31'];
+        }
+
+        if (/^\d{4}[\/|-]\d{1,2}$/.test(rg)) {
+
+            var start = this.getDateInfo(rg);
+            var firstDay = start.date;
+            firstDay.setMonth(firstDay.getMonth() + 1);
+
+            var end = this.getNextNDay(firstDay, -1);
+            range = [start.formatedDate, end.formatedDate];
+        }
+
+        if (/^\d{4}[\/|-]\d{1,2}[\/|-]\d{1,2}$/.test(rg)) {
+            range = [rg, rg];
+        }
+
+        var tmp = this._getRangeInfo(range);
+
+        if (tmp.start.time > tmp.end.time) {
+            range.reverse();
+        }
+
+        return range;
+    },
+
+    /**
+     * range info
+     *
+     * @private
+     * @param  {Array} range range ['2017-01-01', '2017-07-08']
+     *  If range[0] > range[1], they will not be reversed.
+     * @return {Object}       obj
+     */
+    _getRangeInfo: function (range) {
+        range = [
+            this.getDateInfo(range[0]),
+            this.getDateInfo(range[1])
+        ];
+
+        var reversed;
+        if (range[0].time > range[1].time) {
+            reversed = true;
+            range.reverse();
+        }
+
+        var allDay = Math.floor(range[1].time / PROXIMATE_ONE_DAY)
+            - Math.floor(range[0].time / PROXIMATE_ONE_DAY) + 1;
+
+        // Consider case:
+        // Firstly set system timezone as "Time Zone: America/Toronto",
+        // ```
+        // var first = new Date(1478412000000 - 3600 * 1000 * 2.5);
+        // var second = new Date(1478412000000);
+        // var allDays = Math.floor(second / ONE_DAY) - Math.floor(first / ONE_DAY) + 1;
+        // ```
+        // will get wrong result because of DST. So we should fix it.
+        var date = new Date(range[0].time);
+        var startDateNum = date.getDate();
+        var endDateNum = range[1].date.getDate();
+        date.setDate(startDateNum + allDay - 1);
+        // The bias can not over a month, so just compare date.
+        if (date.getDate() !== endDateNum) {
+            var sign = date.getTime() - range[1].time > 0 ? 1 : -1;
+            while (date.getDate() !== endDateNum && (date.getTime() - range[1].time) * sign > 0) {
+                allDay -= sign;
+                date.setDate(startDateNum + allDay - 1);
+            }
+        }
+
+        var weeks = Math.floor((allDay + range[0].day + 6) / 7);
+        var nthWeek = reversed ? -weeks + 1: weeks - 1;
+
+        reversed && range.reverse();
+
+        return {
+            range: [range[0].formatedDate, range[1].formatedDate],
+            start: range[0],
+            end: range[1],
+            allDay: allDay,
+            weeks: weeks,
+            // From 0.
+            nthWeek: nthWeek,
+            fweek: range[0].day,
+            lweek: range[1].day
+        };
+    },
+
+    /**
+     * get date by nthWeeks and week day in range
+     *
+     * @private
+     * @param  {number} nthWeek the week
+     * @param  {number} day   the week day
+     * @param  {Array} range [d1, d2]
+     * @return {Object}
+     */
+    _getDateByWeeksAndDay: function (nthWeek, day, range) {
+        var rangeInfo = this._getRangeInfo(range);
+
+        if (nthWeek > rangeInfo.weeks
+            || (nthWeek === 0 && day < rangeInfo.fweek)
+            || (nthWeek === rangeInfo.weeks && day > rangeInfo.lweek)
+        ) {
+            return false;
+        }
+
+        var nthDay = (nthWeek - 1) * 7 - rangeInfo.fweek + day;
+        var date = new Date(rangeInfo.start.time);
+        date.setDate(rangeInfo.start.d + nthDay);
+
+        return this.getDateInfo(date);
+    }
+};
+
+Calendar.dimensions =  Calendar.prototype.dimensions;
+
+Calendar.getDimensionsInfo =  Calendar.prototype.getDimensionsInfo;
+
+Calendar.create = function (ecModel, api) {
+    var calendarList = [];
+
+    ecModel.eachComponent('calendar', function (calendarModel) {
+        var calendar = new Calendar(calendarModel, ecModel, api);
+        calendarList.push(calendar);
+        calendarModel.coordinateSystem = calendar;
+    });
+
+    ecModel.eachSeries(function (calendarSeries) {
+        if (calendarSeries.get('coordinateSystem') === 'calendar') {
+            // Inject coordinate system
+            calendarSeries.coordinateSystem = calendarList[calendarSeries.get('calendarIndex') || 0];
+        }
+    });
+    return calendarList;
+};
+
+function doConvert$2(methodName, ecModel, finder, value) {
+    var calendarModel = finder.calendarModel;
+    var seriesModel = finder.seriesModel;
+
+    var coordSys = calendarModel
+        ? calendarModel.coordinateSystem
+        : seriesModel
+        ? seriesModel.coordinateSystem
+        : null;
+
+    return coordSys === this ? coordSys[methodName](value) : null;
+}
+
+CoordinateSystemManager.register('calendar', Calendar);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var CalendarModel = ComponentModel.extend({
+
+    type: 'calendar',
+
+    /**
+     * @type {module:echarts/coord/calendar/Calendar}
+     */
+    coordinateSystem: null,
+
+    defaultOption: {
+        zlevel: 0,
+        z: 2,
+        left: 80,
+        top: 60,
+
+        cellSize: 20,
+
+        // horizontal vertical
+        orient: 'horizontal',
+
+        // month separate line style
+        splitLine: {
+            show: true,
+            lineStyle: {
+                color: '#000',
+                width: 1,
+                type: 'solid'
+            }
+        },
+
+        // rect style  temporarily unused emphasis
+        itemStyle: {
+            color: '#fff',
+            borderWidth: 1,
+            borderColor: '#ccc'
+        },
+
+        // week text style
+        dayLabel: {
+            show: true,
+
+            // a week first day
+            firstDay: 0,
+
+            // start end
+            position: 'start',
+            margin: '50%', // 50% of cellSize
+            nameMap: 'en',
+            color: '#000'
+        },
+
+        // month text style
+        monthLabel: {
+            show: true,
+
+            // start end
+            position: 'start',
+            margin: 5,
+
+            // center or left
+            align: 'center',
+
+            // cn en []
+            nameMap: 'en',
+            formatter: null,
+            color: '#000'
+        },
+
+        // year text style
+        yearLabel: {
+            show: true,
+
+            // top bottom left right
+            position: null,
+            margin: 30,
+            formatter: null,
+            color: '#ccc',
+            fontFamily: 'sans-serif',
+            fontWeight: 'bolder',
+            fontSize: 20
+        }
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel, extraOpt) {
+        var inputPositionParams = getLayoutParams(option);
+
+        CalendarModel.superApply(this, 'init', arguments);
+
+        mergeAndNormalizeLayoutParams$1(option, inputPositionParams);
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (option, extraOpt) {
+        CalendarModel.superApply(this, 'mergeOption', arguments);
+
+        mergeAndNormalizeLayoutParams$1(this.option, option);
+    }
+});
+
+function mergeAndNormalizeLayoutParams$1(target, raw) {
+    // Normalize cellSize
+    var cellSize = target.cellSize;
+
+    if (!isArray(cellSize)) {
+        cellSize = target.cellSize = [cellSize, cellSize];
+    }
+    else if (cellSize.length === 1) {
+        cellSize[1] = cellSize[0];
+    }
+
+    var ignoreSize = map([0, 1], function (hvIdx) {
+        // If user have set `width` or both `left` and `right`, cellSize
+        // will be automatically set to 'auto', otherwise the default
+        // setting of cellSize will make `width` setting not work.
+        if (sizeCalculable(raw, hvIdx)) {
+            cellSize[hvIdx] = 'auto';
+        }
+        return cellSize[hvIdx] != null && cellSize[hvIdx] !== 'auto';
+    });
+
+    mergeLayoutParam(target, raw, {
+        type: 'box', ignoreSize: ignoreSize
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var MONTH_TEXT = {
+    EN: [
+        'Jan', 'Feb', 'Mar',
+        'Apr', 'May', 'Jun',
+        'Jul', 'Aug', 'Sep',
+        'Oct', 'Nov', 'Dec'
+    ],
+    CN: [
+        '一月', '二月', '三月',
+        '四月', '五月', '六月',
+        '七月', '八月', '九月',
+        '十月', '十一月', '十二月'
+    ]
+};
+
+var WEEK_TEXT = {
+    EN: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
+    CN: ['日', '一', '二', '三', '四', '五', '六']
+};
+
+extendComponentView({
+
+    type: 'calendar',
+
+    /**
+     * top/left line points
+     *  @private
+     */
+    _tlpoints: null,
+
+    /**
+     * bottom/right line points
+     *  @private
+     */
+    _blpoints: null,
+
+    /**
+     * first day of month
+     *  @private
+     */
+    _firstDayOfMonth: null,
+
+    /**
+     * first day point of month
+     *  @private
+     */
+    _firstDayPoints: null,
+
+    render: function (calendarModel, ecModel, api) {
+
+        var group = this.group;
+
+        group.removeAll();
+
+        var coordSys = calendarModel.coordinateSystem;
+
+        // range info
+        var rangeData = coordSys.getRangeInfo();
+        var orient = coordSys.getOrient();
+
+        this._renderDayRect(calendarModel, rangeData, group);
+
+        // _renderLines must be called prior to following function
+        this._renderLines(calendarModel, rangeData, orient, group);
+
+        this._renderYearText(calendarModel, rangeData, orient, group);
+
+        this._renderMonthText(calendarModel, orient, group);
+
+        this._renderWeekText(calendarModel, rangeData, orient, group);
+    },
+
+    // render day rect
+    _renderDayRect: function (calendarModel, rangeData, group) {
+        var coordSys = calendarModel.coordinateSystem;
+        var itemRectStyleModel = calendarModel.getModel('itemStyle').getItemStyle();
+        var sw = coordSys.getCellWidth();
+        var sh = coordSys.getCellHeight();
+
+        for (var i = rangeData.start.time;
+            i <= rangeData.end.time;
+            i = coordSys.getNextNDay(i, 1).time
+        ) {
+
+            var point = coordSys.dataToRect([i], false).tl;
+
+            // every rect
+            var rect = new Rect({
+                shape: {
+                    x: point[0],
+                    y: point[1],
+                    width: sw,
+                    height: sh
+                },
+                cursor: 'default',
+                style: itemRectStyleModel
+            });
+
+            group.add(rect);
+        }
+
+    },
+
+    // render separate line
+    _renderLines: function (calendarModel, rangeData, orient, group) {
+
+        var self = this;
+
+        var coordSys = calendarModel.coordinateSystem;
+
+        var lineStyleModel = calendarModel.getModel('splitLine.lineStyle').getLineStyle();
+        var show = calendarModel.get('splitLine.show');
+
+        var lineWidth = lineStyleModel.lineWidth;
+
+        this._tlpoints = [];
+        this._blpoints = [];
+        this._firstDayOfMonth = [];
+        this._firstDayPoints = [];
+
+
+        var firstDay = rangeData.start;
+
+        for (var i = 0; firstDay.time <= rangeData.end.time; i++) {
+            addPoints(firstDay.formatedDate);
+
+            if (i === 0) {
+                firstDay = coordSys.getDateInfo(rangeData.start.y + '-' + rangeData.start.m);
+            }
+
+            var date = firstDay.date;
+            date.setMonth(date.getMonth() + 1);
+            firstDay = coordSys.getDateInfo(date);
+        }
+
+        addPoints(coordSys.getNextNDay(rangeData.end.time, 1).formatedDate);
+
+        function addPoints(date) {
+
+            self._firstDayOfMonth.push(coordSys.getDateInfo(date));
+            self._firstDayPoints.push(coordSys.dataToRect([date], false).tl);
+
+            var points = self._getLinePointsOfOneWeek(calendarModel, date, orient);
+
+            self._tlpoints.push(points[0]);
+            self._blpoints.push(points[points.length - 1]);
+
+            show && self._drawSplitline(points, lineStyleModel, group);
+        }
+
+
+        // render top/left line
+        show && this._drawSplitline(self._getEdgesPoints(self._tlpoints, lineWidth, orient), lineStyleModel, group);
+
+        // render bottom/right line
+        show && this._drawSplitline(self._getEdgesPoints(self._blpoints, lineWidth, orient), lineStyleModel, group);
+
+    },
+
+    // get points at both ends
+    _getEdgesPoints: function (points, lineWidth, orient) {
+        var rs = [points[0].slice(), points[points.length - 1].slice()];
+        var idx = orient === 'horizontal' ? 0 : 1;
+
+        // both ends of the line are extend half lineWidth
+        rs[0][idx] = rs[0][idx] - lineWidth / 2;
+        rs[1][idx] = rs[1][idx] + lineWidth / 2;
+
+        return rs;
+    },
+
+    // render split line
+    _drawSplitline: function (points, lineStyleModel, group) {
+
+        var poyline = new Polyline({
+            z2: 20,
+            shape: {
+                points: points
+            },
+            style: lineStyleModel
+        });
+
+        group.add(poyline);
+    },
+
+    // render month line of one week points
+    _getLinePointsOfOneWeek: function (calendarModel, date, orient) {
+
+        var coordSys = calendarModel.coordinateSystem;
+        date = coordSys.getDateInfo(date);
+
+        var points = [];
+
+        for (var i = 0; i < 7; i++) {
+
+            var tmpD = coordSys.getNextNDay(date.time, i);
+            var point = coordSys.dataToRect([tmpD.time], false);
+
+            points[2 * tmpD.day] = point.tl;
+            points[2 * tmpD.day + 1] = point[orient === 'horizontal' ? 'bl' : 'tr'];
+        }
+
+        return points;
+
+    },
+
+    _formatterLabel: function (formatter, params) {
+
+        if (typeof formatter === 'string' && formatter) {
+            return formatTplSimple(formatter, params);
+        }
+
+        if (typeof formatter === 'function') {
+            return formatter(params);
+        }
+
+        return params.nameMap;
+
+    },
+
+    _yearTextPositionControl: function (textEl, point, orient, position, margin) {
+
+        point = point.slice();
+        var aligns = ['center', 'bottom'];
+
+        if (position === 'bottom') {
+            point[1] += margin;
+            aligns = ['center', 'top'];
+        }
+        else if (position === 'left') {
+            point[0] -= margin;
+        }
+        else if (position === 'right') {
+            point[0] += margin;
+            aligns = ['center', 'top'];
+        }
+        else { // top
+            point[1] -= margin;
+        }
+
+        var rotate = 0;
+        if (position === 'left' || position === 'right') {
+            rotate = Math.PI / 2;
+        }
+
+        return {
+            rotation: rotate,
+            position: point,
+            style: {
+                textAlign: aligns[0],
+                textVerticalAlign: aligns[1]
+            }
+        };
+    },
+
+    // render year
+    _renderYearText: function (calendarModel, rangeData, orient, group) {
+        var yearLabel = calendarModel.getModel('yearLabel');
+
+        if (!yearLabel.get('show')) {
+            return;
+        }
+
+        var margin = yearLabel.get('margin');
+        var pos = yearLabel.get('position');
+
+        if (!pos) {
+            pos = orient !== 'horizontal' ? 'top' : 'left';
+        }
+
+        var points = [this._tlpoints[this._tlpoints.length - 1], this._blpoints[0]];
+        var xc = (points[0][0] + points[1][0]) / 2;
+        var yc = (points[0][1] + points[1][1]) / 2;
+
+        var idx = orient === 'horizontal' ? 0 : 1;
+
+        var posPoints = {
+            top: [xc, points[idx][1]],
+            bottom: [xc, points[1 - idx][1]],
+            left: [points[1 - idx][0], yc],
+            right: [points[idx][0], yc]
+        };
+
+        var name = rangeData.start.y;
+
+        if (+rangeData.end.y > +rangeData.start.y) {
+            name = name + '-' + rangeData.end.y;
+        }
+
+        var formatter = yearLabel.get('formatter');
+
+        var params = {
+            start: rangeData.start.y,
+            end: rangeData.end.y,
+            nameMap: name
+        };
+
+        var content = this._formatterLabel(formatter, params);
+
+        var yearText = new Text({z2: 30});
+        setTextStyle(yearText.style, yearLabel, {text: content}),
+        yearText.attr(this._yearTextPositionControl(yearText, posPoints[pos], orient, pos, margin));
+
+        group.add(yearText);
+    },
+
+    _monthTextPositionControl: function (point, isCenter, orient, position, margin) {
+        var align = 'left';
+        var vAlign = 'top';
+        var x = point[0];
+        var y = point[1];
+
+        if (orient === 'horizontal') {
+            y = y + margin;
+
+            if (isCenter) {
+                align = 'center';
+            }
+
+            if (position === 'start') {
+                vAlign = 'bottom';
+            }
+        }
+        else {
+            x = x + margin;
+
+            if (isCenter) {
+                vAlign = 'middle';
+            }
+
+            if (position === 'start') {
+                align = 'right';
+            }
+        }
+
+        return {
+            x: x,
+            y: y,
+            textAlign: align,
+            textVerticalAlign: vAlign
+        };
+    },
+
+    // render month and year text
+    _renderMonthText: function (calendarModel, orient, group) {
+        var monthLabel = calendarModel.getModel('monthLabel');
+
+        if (!monthLabel.get('show')) {
+            return;
+        }
+
+        var nameMap = monthLabel.get('nameMap');
+        var margin = monthLabel.get('margin');
+        var pos = monthLabel.get('position');
+        var align = monthLabel.get('align');
+
+        var termPoints = [this._tlpoints, this._blpoints];
+
+        if (isString(nameMap)) {
+            nameMap = MONTH_TEXT[nameMap.toUpperCase()] || [];
+        }
+
+        var idx = pos === 'start' ? 0 : 1;
+        var axis = orient === 'horizontal' ? 0 : 1;
+        margin = pos === 'start' ? -margin : margin;
+        var isCenter = (align === 'center');
+
+        for (var i = 0; i < termPoints[idx].length - 1; i++) {
+
+            var tmp = termPoints[idx][i].slice();
+            var firstDay = this._firstDayOfMonth[i];
+
+            if (isCenter) {
+                var firstDayPoints = this._firstDayPoints[i];
+                tmp[axis] = (firstDayPoints[axis] + termPoints[0][i + 1][axis]) / 2;
+            }
+
+            var formatter = monthLabel.get('formatter');
+            var name = nameMap[+firstDay.m - 1];
+            var params = {
+                yyyy: firstDay.y,
+                yy: (firstDay.y + '').slice(2),
+                MM: firstDay.m,
+                M: +firstDay.m,
+                nameMap: name
+            };
+
+            var content = this._formatterLabel(formatter, params);
+
+            var monthText = new Text({z2: 30});
+            extend(
+                setTextStyle(monthText.style, monthLabel, {text: content}),
+                this._monthTextPositionControl(tmp, isCenter, orient, pos, margin)
+            );
+
+            group.add(monthText);
+        }
+    },
+
+    _weekTextPositionControl: function (point, orient, position, margin, cellSize) {
+        var align = 'center';
+        var vAlign = 'middle';
+        var x = point[0];
+        var y = point[1];
+        var isStart = position === 'start';
+
+        if (orient === 'horizontal') {
+            x = x + margin + (isStart ? 1 : -1) * cellSize[0] / 2;
+            align = isStart ? 'right' : 'left';
+        }
+        else {
+            y = y + margin + (isStart ? 1 : -1) * cellSize[1] / 2;
+            vAlign = isStart ? 'bottom' : 'top';
+        }
+
+        return {
+            x: x,
+            y: y,
+            textAlign: align,
+            textVerticalAlign: vAlign
+        };
+    },
+
+    // render weeks
+    _renderWeekText: function (calendarModel, rangeData, orient, group) {
+        var dayLabel = calendarModel.getModel('dayLabel');
+
+        if (!dayLabel.get('show')) {
+            return;
+        }
+
+        var coordSys = calendarModel.coordinateSystem;
+        var pos = dayLabel.get('position');
+        var nameMap = dayLabel.get('nameMap');
+        var margin = dayLabel.get('margin');
+        var firstDayOfWeek = coordSys.getFirstDayOfWeek();
+
+        if (isString(nameMap)) {
+            nameMap = WEEK_TEXT[nameMap.toUpperCase()] || [];
+        }
+
+        var start = coordSys.getNextNDay(
+            rangeData.end.time, (7 - rangeData.lweek)
+        ).time;
+
+        var cellSize = [coordSys.getCellWidth(), coordSys.getCellHeight()];
+        margin = parsePercent$1(margin, cellSize[orient === 'horizontal' ? 0 : 1]);
+
+        if (pos === 'start') {
+            start = coordSys.getNextNDay(
+                rangeData.start.time, -(7 + rangeData.fweek)
+            ).time;
+            margin = -margin;
+        }
+
+        for (var i = 0; i < 7; i++) {
+
+            var tmpD = coordSys.getNextNDay(start, i);
+            var point = coordSys.dataToRect([tmpD.time], false).center;
+            var day = i;
+            day = Math.abs((i + firstDayOfWeek) % 7);
+            var weekText = new Text({z2: 30});
+
+            extend(
+                setTextStyle(weekText.style, dayLabel, {text: nameMap[day]}),
+                this._weekTextPositionControl(point, orient, pos, margin, cellSize)
+            );
+            group.add(weekText);
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file calendar.js
+ * @author dxh
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Model
+extendComponentModel({
+
+    type: 'title',
+
+    layoutMode: {type: 'box', ignoreSize: true},
+
+    defaultOption: {
+        // 一级层叠
+        zlevel: 0,
+        // 二级层叠
+        z: 6,
+        show: true,
+
+        text: '',
+        // 超链接跳转
+        // link: null,
+        // 仅支持self | blank
+        target: 'blank',
+        subtext: '',
+
+        // 超链接跳转
+        // sublink: null,
+        // 仅支持self | blank
+        subtarget: 'blank',
+
+        // 'center' ¦ 'left' ¦ 'right'
+        // ¦ {number}（x坐标，单位px）
+        left: 0,
+        // 'top' ¦ 'bottom' ¦ 'center'
+        // ¦ {number}（y坐标，单位px）
+        top: 0,
+
+        // 水平对齐
+        // 'auto' | 'left' | 'right' | 'center'
+        // 默认根据 left 的位置判断是左对齐还是右对齐
+        // textAlign: null
+        //
+        // 垂直对齐
+        // 'auto' | 'top' | 'bottom' | 'middle'
+        // 默认根据 top 位置判断是上对齐还是下对齐
+        // textBaseline: null
+
+        backgroundColor: 'rgba(0,0,0,0)',
+
+        // 标题边框颜色
+        borderColor: '#ccc',
+
+        // 标题边框线宽，单位px，默认为0（无边框）
+        borderWidth: 0,
+
+        // 标题内边距，单位px，默认各方向内边距为5，
+        // 接受数组分别设定上右下左边距，同css
+        padding: 5,
+
+        // 主副标题纵向间隔，单位px，默认为10，
+        itemGap: 10,
+        textStyle: {
+            fontSize: 18,
+            fontWeight: 'bolder',
+            color: '#333'
+        },
+        subtextStyle: {
+            color: '#aaa'
+        }
+    }
+});
+
+// View
+extendComponentView({
+
+    type: 'title',
+
+    render: function (titleModel, ecModel, api) {
+        this.group.removeAll();
+
+        if (!titleModel.get('show')) {
+            return;
+        }
+
+        var group = this.group;
+
+        var textStyleModel = titleModel.getModel('textStyle');
+        var subtextStyleModel = titleModel.getModel('subtextStyle');
+
+        var textAlign = titleModel.get('textAlign');
+        var textBaseline = titleModel.get('textBaseline');
+
+        var textEl = new Text({
+            style: setTextStyle({}, textStyleModel, {
+                text: titleModel.get('text'),
+                textFill: textStyleModel.getTextColor()
+            }, {disableBox: true}),
+            z2: 10
+        });
+
+        var textRect = textEl.getBoundingRect();
+
+        var subText = titleModel.get('subtext');
+        var subTextEl = new Text({
+            style: setTextStyle({}, subtextStyleModel, {
+                text: subText,
+                textFill: subtextStyleModel.getTextColor(),
+                y: textRect.height + titleModel.get('itemGap'),
+                textVerticalAlign: 'top'
+            }, {disableBox: true}),
+            z2: 10
+        });
+
+        var link = titleModel.get('link');
+        var sublink = titleModel.get('sublink');
+
+        textEl.silent = !link;
+        subTextEl.silent = !sublink;
+
+        if (link) {
+            textEl.on('click', function () {
+                window.open(link, '_' + titleModel.get('target'));
+            });
+        }
+        if (sublink) {
+            subTextEl.on('click', function () {
+                window.open(sublink, '_' + titleModel.get('subtarget'));
+            });
+        }
+
+        group.add(textEl);
+        subText && group.add(subTextEl);
+        // If no subText, but add subTextEl, there will be an empty line.
+
+        var groupRect = group.getBoundingRect();
+        var layoutOption = titleModel.getBoxLayoutParams();
+        layoutOption.width = groupRect.width;
+        layoutOption.height = groupRect.height;
+        var layoutRect = getLayoutRect(
+            layoutOption, {
+                width: api.getWidth(),
+                height: api.getHeight()
+            }, titleModel.get('padding')
+        );
+        // Adjust text align based on position
+        if (!textAlign) {
+            // Align left if title is on the left. center and right is same
+            textAlign = titleModel.get('left') || titleModel.get('right');
+            if (textAlign === 'middle') {
+                textAlign = 'center';
+            }
+            // Adjust layout by text align
+            if (textAlign === 'right') {
+                layoutRect.x += layoutRect.width;
+            }
+            else if (textAlign === 'center') {
+                layoutRect.x += layoutRect.width / 2;
+            }
+        }
+        if (!textBaseline) {
+            textBaseline = titleModel.get('top') || titleModel.get('bottom');
+            if (textBaseline === 'center') {
+                textBaseline = 'middle';
+            }
+            if (textBaseline === 'bottom') {
+                layoutRect.y += layoutRect.height;
+            }
+            else if (textBaseline === 'middle') {
+                layoutRect.y += layoutRect.height / 2;
+            }
+
+            textBaseline = textBaseline || 'top';
+        }
+
+        group.attr('position', [layoutRect.x, layoutRect.y]);
+        var alignStyle = {
+            textAlign: textAlign,
+            textVerticalAlign: textBaseline
+        };
+        textEl.setStyle(alignStyle);
+        subTextEl.setStyle(alignStyle);
+
+        // Render background
+        // Get groupRect again because textAlign has been changed
+        groupRect = group.getBoundingRect();
+        var padding = layoutRect.margin;
+        var style = titleModel.getItemStyle(['color', 'opacity']);
+        style.fill = titleModel.get('backgroundColor');
+        var rect = new Rect({
+            shape: {
+                x: groupRect.x - padding[3],
+                y: groupRect.y - padding[0],
+                width: groupRect.width + padding[1] + padding[3],
+                height: groupRect.height + padding[0] + padding[2],
+                r: titleModel.get('borderRadius')
+            },
+            style: style,
+            silent: true
+        });
+        subPixelOptimizeRect(rect);
+
+        group.add(rect);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.registerSubTypeDefaulter('dataZoom', function () {
+    // Default 'slider' when no type specified.
+    return 'slider';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var AXIS_DIMS = ['x', 'y', 'z', 'radius', 'angle', 'single'];
+// Supported coords.
+var COORDS = ['cartesian2d', 'polar', 'singleAxis'];
+
+/**
+ * @param {string} coordType
+ * @return {boolean}
+ */
+function isCoordSupported(coordType) {
+    return indexOf(COORDS, coordType) >= 0;
+}
+
+/**
+ * Create "each" method to iterate names.
+ *
+ * @pubilc
+ * @param  {Array.<string>} names
+ * @param  {Array.<string>=} attrs
+ * @return {Function}
+ */
+function createNameEach(names, attrs) {
+    names = names.slice();
+    var capitalNames = map(names, capitalFirst);
+    attrs = (attrs || []).slice();
+    var capitalAttrs = map(attrs, capitalFirst);
+
+    return function (callback, context) {
+        each$1(names, function (name, index) {
+            var nameObj = {name: name, capital: capitalNames[index]};
+
+            for (var j = 0; j < attrs.length; j++) {
+                nameObj[attrs[j]] = name + capitalAttrs[j];
+            }
+
+            callback.call(context, nameObj);
+        });
+    };
+}
+
+/**
+ * Iterate each dimension name.
+ *
+ * @public
+ * @param {Function} callback The parameter is like:
+ *                            {
+ *                                name: 'angle',
+ *                                capital: 'Angle',
+ *                                axis: 'angleAxis',
+ *                                axisIndex: 'angleAixs',
+ *                                index: 'angleIndex'
+ *                            }
+ * @param {Object} context
+ */
+var eachAxisDim$1 = createNameEach(AXIS_DIMS, ['axisIndex', 'axis', 'index', 'id']);
+
+/**
+ * If tow dataZoomModels has the same axis controlled, we say that they are 'linked'.
+ * dataZoomModels and 'links' make up one or more graphics.
+ * This function finds the graphic where the source dataZoomModel is in.
+ *
+ * @public
+ * @param {Function} forEachNode Node iterator.
+ * @param {Function} forEachEdgeType edgeType iterator
+ * @param {Function} edgeIdGetter Giving node and edgeType, return an array of edge id.
+ * @return {Function} Input: sourceNode, Output: Like {nodes: [], dims: {}}
+ */
+function createLinkedNodesFinder(forEachNode, forEachEdgeType, edgeIdGetter) {
+
+    return function (sourceNode) {
+        var result = {
+            nodes: [],
+            records: {} // key: edgeType.name, value: Object (key: edge id, value: boolean).
+        };
+
+        forEachEdgeType(function (edgeType) {
+            result.records[edgeType.name] = {};
+        });
+
+        if (!sourceNode) {
+            return result;
+        }
+
+        absorb(sourceNode, result);
+
+        var existsLink;
+        do {
+            existsLink = false;
+            forEachNode(processSingleNode);
+        }
+        while (existsLink);
+
+        function processSingleNode(node) {
+            if (!isNodeAbsorded(node, result) && isLinked(node, result)) {
+                absorb(node, result);
+                existsLink = true;
+            }
+        }
+
+        return result;
+    };
+
+    function isNodeAbsorded(node, result) {
+        return indexOf(result.nodes, node) >= 0;
+    }
+
+    function isLinked(node, result) {
+        var hasLink = false;
+        forEachEdgeType(function (edgeType) {
+            each$1(edgeIdGetter(node, edgeType) || [], function (edgeId) {
+                result.records[edgeType.name][edgeId] && (hasLink = true);
+            });
+        });
+        return hasLink;
+    }
+
+    function absorb(node, result) {
+        result.nodes.push(node);
+        forEachEdgeType(function (edgeType) {
+            each$1(edgeIdGetter(node, edgeType) || [], function (edgeId) {
+                result.records[edgeType.name][edgeId] = true;
+            });
+        });
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$22 = each$1;
+var asc$1 = asc;
+
+/**
+ * Operate single axis.
+ * One axis can only operated by one axis operator.
+ * Different dataZoomModels may be defined to operate the same axis.
+ * (i.e. 'inside' data zoom and 'slider' data zoom components)
+ * So dataZoomModels share one axisProxy in that case.
+ *
+ * @class
+ */
+var AxisProxy = function (dimName, axisIndex, dataZoomModel, ecModel) {
+
+    /**
+     * @private
+     * @type {string}
+     */
+    this._dimName = dimName;
+
+    /**
+     * @private
+     */
+    this._axisIndex = axisIndex;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._valueWindow;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._percentWindow;
+
+    /**
+     * @private
+     * @type {Array.<number>}
+     */
+    this._dataExtent;
+
+    /**
+     * {minSpan, maxSpan, minValueSpan, maxValueSpan}
+     * @private
+     * @type {Object}
+     */
+    this._minMaxSpan;
+
+    /**
+     * @readOnly
+     * @type {module: echarts/model/Global}
+     */
+    this.ecModel = ecModel;
+
+    /**
+     * @private
+     * @type {module: echarts/component/dataZoom/DataZoomModel}
+     */
+    this._dataZoomModel = dataZoomModel;
+
+    // /**
+    //  * @readOnly
+    //  * @private
+    //  */
+    // this.hasSeriesStacked;
+};
+
+AxisProxy.prototype = {
+
+    constructor: AxisProxy,
+
+    /**
+     * Whether the axisProxy is hosted by dataZoomModel.
+     *
+     * @public
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     * @return {boolean}
+     */
+    hostedBy: function (dataZoomModel) {
+        return this._dataZoomModel === dataZoomModel;
+    },
+
+    /**
+     * @return {Array.<number>} Value can only be NaN or finite value.
+     */
+    getDataValueWindow: function () {
+        return this._valueWindow.slice();
+    },
+
+    /**
+     * @return {Array.<number>}
+     */
+    getDataPercentWindow: function () {
+        return this._percentWindow.slice();
+    },
+
+    /**
+     * @public
+     * @param {number} axisIndex
+     * @return {Array} seriesModels
+     */
+    getTargetSeriesModels: function () {
+        var seriesModels = [];
+        var ecModel = this.ecModel;
+
+        ecModel.eachSeries(function (seriesModel) {
+            if (isCoordSupported(seriesModel.get('coordinateSystem'))) {
+                var dimName = this._dimName;
+                var axisModel = ecModel.queryComponents({
+                    mainType: dimName + 'Axis',
+                    index: seriesModel.get(dimName + 'AxisIndex'),
+                    id: seriesModel.get(dimName + 'AxisId')
+                })[0];
+                if (this._axisIndex === (axisModel && axisModel.componentIndex)) {
+                    seriesModels.push(seriesModel);
+                }
+            }
+        }, this);
+
+        return seriesModels;
+    },
+
+    getAxisModel: function () {
+        return this.ecModel.getComponent(this._dimName + 'Axis', this._axisIndex);
+    },
+
+    getOtherAxisModel: function () {
+        var axisDim = this._dimName;
+        var ecModel = this.ecModel;
+        var axisModel = this.getAxisModel();
+        var isCartesian = axisDim === 'x' || axisDim === 'y';
+        var otherAxisDim;
+        var coordSysIndexName;
+        if (isCartesian) {
+            coordSysIndexName = 'gridIndex';
+            otherAxisDim = axisDim === 'x' ? 'y' : 'x';
+        }
+        else {
+            coordSysIndexName = 'polarIndex';
+            otherAxisDim = axisDim === 'angle' ? 'radius' : 'angle';
+        }
+        var foundOtherAxisModel;
+        ecModel.eachComponent(otherAxisDim + 'Axis', function (otherAxisModel) {
+            if ((otherAxisModel.get(coordSysIndexName) || 0)
+                === (axisModel.get(coordSysIndexName) || 0)
+            ) {
+                foundOtherAxisModel = otherAxisModel;
+            }
+        });
+        return foundOtherAxisModel;
+    },
+
+    getMinMaxSpan: function () {
+        return clone(this._minMaxSpan);
+    },
+
+    /**
+     * Only calculate by given range and this._dataExtent, do not change anything.
+     *
+     * @param {Object} opt
+     * @param {number} [opt.start]
+     * @param {number} [opt.end]
+     * @param {number} [opt.startValue]
+     * @param {number} [opt.endValue]
+     */
+    calculateDataWindow: function (opt) {
+        var dataExtent = this._dataExtent;
+        var axisModel = this.getAxisModel();
+        var scale = axisModel.axis.scale;
+        var rangePropMode = this._dataZoomModel.getRangePropMode();
+        var percentExtent = [0, 100];
+        var percentWindow = [
+            opt.start,
+            opt.end
+        ];
+        var valueWindow = [];
+
+        each$22(['startValue', 'endValue'], function (prop) {
+            valueWindow.push(opt[prop] != null ? scale.parse(opt[prop]) : null);
+        });
+
+        // Normalize bound.
+        each$22([0, 1], function (idx) {
+            var boundValue = valueWindow[idx];
+            var boundPercent = percentWindow[idx];
+
+            // Notice: dataZoom is based either on `percentProp` ('start', 'end') or
+            // on `valueProp` ('startValue', 'endValue'). The former one is suitable
+            // for cases that a dataZoom component controls multiple axes with different
+            // unit or extent, and the latter one is suitable for accurate zoom by pixel
+            // (e.g., in dataZoomSelect). `valueProp` can be calculated from `percentProp`,
+            // but it is awkward that `percentProp` can not be obtained from `valueProp`
+            // accurately (because all of values that are overflow the `dataExtent` will
+            // be calculated to percent '100%'). So we have to use
+            // `dataZoom.getRangePropMode()` to mark which prop is used.
+            // `rangePropMode` is updated only when setOption or dispatchAction, otherwise
+            // it remains its original value.
+
+            if (rangePropMode[idx] === 'percent') {
+                if (boundPercent == null) {
+                    boundPercent = percentExtent[idx];
+                }
+                // Use scale.parse to math round for category or time axis.
+                boundValue = scale.parse(linearMap(
+                    boundPercent, percentExtent, dataExtent, true
+                ));
+            }
+            else {
+                // Calculating `percent` from `value` may be not accurate, because
+                // This calculation can not be inversed, because all of values that
+                // are overflow the `dataExtent` will be calculated to percent '100%'
+                boundPercent = linearMap(
+                    boundValue, dataExtent, percentExtent, true
+                );
+            }
+
+            // valueWindow[idx] = round(boundValue);
+            // percentWindow[idx] = round(boundPercent);
+            valueWindow[idx] = boundValue;
+            percentWindow[idx] = boundPercent;
+        });
+
+        return {
+            valueWindow: asc$1(valueWindow),
+            percentWindow: asc$1(percentWindow)
+        };
+    },
+
+    /**
+     * Notice: reset should not be called before series.restoreData() called,
+     * so it is recommanded to be called in "process stage" but not "model init
+     * stage".
+     *
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     */
+    reset: function (dataZoomModel) {
+        if (dataZoomModel !== this._dataZoomModel) {
+            return;
+        }
+
+        var targetSeries = this.getTargetSeriesModels();
+        // Culculate data window and data extent, and record them.
+        this._dataExtent = calculateDataExtent(this, this._dimName, targetSeries);
+
+        // this.hasSeriesStacked = false;
+        // each(targetSeries, function (series) {
+            // var data = series.getData();
+            // var dataDim = data.mapDimension(this._dimName);
+            // var stackedDimension = data.getCalculationInfo('stackedDimension');
+            // if (stackedDimension && stackedDimension === dataDim) {
+                // this.hasSeriesStacked = true;
+            // }
+        // }, this);
+
+        var dataWindow = this.calculateDataWindow(dataZoomModel.option);
+
+        this._valueWindow = dataWindow.valueWindow;
+        this._percentWindow = dataWindow.percentWindow;
+
+        setMinMaxSpan(this);
+
+        // Update axis setting then.
+        setAxisModel(this);
+    },
+
+    /**
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     */
+    restore: function (dataZoomModel) {
+        if (dataZoomModel !== this._dataZoomModel) {
+            return;
+        }
+
+        this._valueWindow = this._percentWindow = null;
+        setAxisModel(this, true);
+    },
+
+    /**
+     * @param {module: echarts/component/dataZoom/DataZoomModel} dataZoomModel
+     */
+    filterData: function (dataZoomModel, api) {
+        if (dataZoomModel !== this._dataZoomModel) {
+            return;
+        }
+
+        var axisDim = this._dimName;
+        var seriesModels = this.getTargetSeriesModels();
+        var filterMode = dataZoomModel.get('filterMode');
+        var valueWindow = this._valueWindow;
+
+        if (filterMode === 'none') {
+            return;
+        }
+
+        // FIXME
+        // Toolbox may has dataZoom injected. And if there are stacked bar chart
+        // with NaN data, NaN will be filtered and stack will be wrong.
+        // So we need to force the mode to be set empty.
+        // In fect, it is not a big deal that do not support filterMode-'filter'
+        // when using toolbox#dataZoom, utill tooltip#dataZoom support "single axis
+        // selection" some day, which might need "adapt to data extent on the
+        // otherAxis", which is disabled by filterMode-'empty'.
+        // But currently, stack has been fixed to based on value but not index,
+        // so this is not an issue any more.
+        // var otherAxisModel = this.getOtherAxisModel();
+        // if (dataZoomModel.get('$fromToolbox')
+        //     && otherAxisModel
+        //     && otherAxisModel.hasSeriesStacked
+        // ) {
+        //     filterMode = 'empty';
+        // }
+
+        // TODO
+        // filterMode 'weakFilter' and 'empty' is not optimized for huge data yet.
+
+        // Process series data
+        each$22(seriesModels, function (seriesModel) {
+            var seriesData = seriesModel.getData();
+            var dataDims = seriesData.mapDimension(axisDim, true);
+
+            if (filterMode === 'weakFilter') {
+                seriesData.filterSelf(function (dataIndex) {
+                    var leftOut;
+                    var rightOut;
+                    var hasValue;
+                    for (var i = 0; i < dataDims.length; i++) {
+                        var value = seriesData.get(dataDims[i], dataIndex);
+                        var thisHasValue = !isNaN(value);
+                        var thisLeftOut = value < valueWindow[0];
+                        var thisRightOut = value > valueWindow[1];
+                        if (thisHasValue && !thisLeftOut && !thisRightOut) {
+                            return true;
+                        }
+                        thisHasValue && (hasValue = true);
+                        thisLeftOut && (leftOut = true);
+                        thisRightOut && (rightOut = true);
+                    }
+                    // If both left out and right out, do not filter.
+                    return hasValue && leftOut && rightOut;
+                });
+            }
+            else {
+                each$22(dataDims, function (dim) {
+                    if (filterMode === 'empty') {
+                        seriesModel.setData(
+                            seriesData.map(dim, function (value) {
+                                return !isInWindow(value) ? NaN : value;
+                            })
+                        );
+                    }
+                    else {
+                        var range = {};
+                        range[dim] = valueWindow;
+
+                        // console.time('select');
+                        seriesData.selectRange(range);
+                        // console.timeEnd('select');
+                    }
+                });
+            }
+
+            each$22(dataDims, function (dim) {
+                seriesData.setApproximateExtent(valueWindow, dim);
+            });
+        });
+
+        function isInWindow(value) {
+            return value >= valueWindow[0] && value <= valueWindow[1];
+        }
+    }
+};
+
+function calculateDataExtent(axisProxy, axisDim, seriesModels) {
+    var dataExtent = [Infinity, -Infinity];
+
+    each$22(seriesModels, function (seriesModel) {
+        var seriesData = seriesModel.getData();
+        if (seriesData) {
+            each$22(seriesData.mapDimension(axisDim, true), function (dim) {
+                var seriesExtent = seriesData.getApproximateExtent(dim);
+                seriesExtent[0] < dataExtent[0] && (dataExtent[0] = seriesExtent[0]);
+                seriesExtent[1] > dataExtent[1] && (dataExtent[1] = seriesExtent[1]);
+            });
+        }
+    });
+
+    if (dataExtent[1] < dataExtent[0]) {
+        dataExtent = [NaN, NaN];
+    }
+
+    // It is important to get "consistent" extent when more then one axes is
+    // controlled by a `dataZoom`, otherwise those axes will not be synchronized
+    // when zooming. But it is difficult to know what is "consistent", considering
+    // axes have different type or even different meanings (For example, two
+    // time axes are used to compare data of the same date in different years).
+    // So basically dataZoom just obtains extent by series.data (in category axis
+    // extent can be obtained from axis.data).
+    // Nevertheless, user can set min/max/scale on axes to make extent of axes
+    // consistent.
+    fixExtentByAxis(axisProxy, dataExtent);
+
+    return dataExtent;
+}
+
+function fixExtentByAxis(axisProxy, dataExtent) {
+    var axisModel = axisProxy.getAxisModel();
+    var min = axisModel.getMin(true);
+
+    // For category axis, if min/max/scale are not set, extent is determined
+    // by axis.data by default.
+    var isCategoryAxis = axisModel.get('type') === 'category';
+    var axisDataLen = isCategoryAxis && axisModel.getCategories().length;
+
+    if (min != null && min !== 'dataMin' && typeof min !== 'function') {
+        dataExtent[0] = min;
+    }
+    else if (isCategoryAxis) {
+        dataExtent[0] = axisDataLen > 0 ? 0 : NaN;
+    }
+
+    var max = axisModel.getMax(true);
+    if (max != null && max !== 'dataMax' && typeof max !== 'function') {
+        dataExtent[1] = max;
+    }
+    else if (isCategoryAxis) {
+        dataExtent[1] = axisDataLen > 0 ? axisDataLen - 1 : NaN;
+    }
+
+    if (!axisModel.get('scale', true)) {
+        dataExtent[0] > 0 && (dataExtent[0] = 0);
+        dataExtent[1] < 0 && (dataExtent[1] = 0);
+    }
+
+    // For value axis, if min/max/scale are not set, we just use the extent obtained
+    // by series data, which may be a little different from the extent calculated by
+    // `axisHelper.getScaleExtent`. But the different just affects the experience a
+    // little when zooming. So it will not be fixed until some users require it strongly.
+
+    return dataExtent;
+}
+
+function setAxisModel(axisProxy, isRestore) {
+    var axisModel = axisProxy.getAxisModel();
+
+    var percentWindow = axisProxy._percentWindow;
+    var valueWindow = axisProxy._valueWindow;
+
+    if (!percentWindow) {
+        return;
+    }
+
+    // [0, 500]: arbitrary value, guess axis extent.
+    var precision = getPixelPrecision(valueWindow, [0, 500]);
+    precision = Math.min(precision, 20);
+    // isRestore or isFull
+    var useOrigin = isRestore || (percentWindow[0] === 0 && percentWindow[1] === 100);
+
+    axisModel.setRange(
+        useOrigin ? null : +valueWindow[0].toFixed(precision),
+        useOrigin ? null : +valueWindow[1].toFixed(precision)
+    );
+}
+
+function setMinMaxSpan(axisProxy) {
+    var minMaxSpan = axisProxy._minMaxSpan = {};
+    var dataZoomModel = axisProxy._dataZoomModel;
+
+    each$22(['min', 'max'], function (minMax) {
+        minMaxSpan[minMax + 'Span'] = dataZoomModel.get(minMax + 'Span');
+
+        // minValueSpan and maxValueSpan has higher priority than minSpan and maxSpan
+        var valueSpan = dataZoomModel.get(minMax + 'ValueSpan');
+
+        if (valueSpan != null) {
+            minMaxSpan[minMax + 'ValueSpan'] = valueSpan;
+            valueSpan = axisProxy.getAxisModel().axis.scale.parse(valueSpan);
+
+            if (valueSpan != null) {
+                var dataExtent = axisProxy._dataExtent;
+                minMaxSpan[minMax + 'Span'] = linearMap(
+                    dataExtent[0] + valueSpan, dataExtent, [0, 100], true
+                );
+            }
+        }
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$21 = each$1;
+var eachAxisDim = eachAxisDim$1;
+
+var DataZoomModel = extendComponentModel({
+
+    type: 'dataZoom',
+
+    dependencies: [
+        'xAxis', 'yAxis', 'zAxis', 'radiusAxis', 'angleAxis', 'singleAxis', 'series'
+    ],
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        zlevel: 0,
+        z: 4,                   // Higher than normal component (z: 2).
+        orient: null,           // Default auto by axisIndex. Possible value: 'horizontal', 'vertical'.
+        xAxisIndex: null,       // Default the first horizontal category axis.
+        yAxisIndex: null,       // Default the first vertical category axis.
+
+        filterMode: 'filter',   // Possible values: 'filter' or 'empty' or 'weakFilter'.
+                                // 'filter': data items which are out of window will be removed. This option is
+                                //          applicable when filtering outliers. For each data item, it will be
+                                //          filtered if one of the relevant dimensions is out of the window.
+                                // 'weakFilter': data items which are out of window will be removed. This option
+                                //          is applicable when filtering outliers. For each data item, it will be
+                                //          filtered only if all  of the relevant dimensions are out of the same
+                                //          side of the window.
+                                // 'empty': data items which are out of window will be set to empty.
+                                //          This option is applicable when user should not neglect
+                                //          that there are some data items out of window.
+                                // 'none': Do not filter.
+                                // Taking line chart as an example, line will be broken in
+                                // the filtered points when filterModel is set to 'empty', but
+                                // be connected when set to 'filter'.
+
+        throttle: null,         // Dispatch action by the fixed rate, avoid frequency.
+                                // default 100. Do not throttle when use null/undefined.
+                                // If animation === true and animationDurationUpdate > 0,
+                                // default value is 100, otherwise 20.
+        start: 0,               // Start percent. 0 ~ 100
+        end: 100,               // End percent. 0 ~ 100
+        startValue: null,       // Start value. If startValue specified, start is ignored.
+        endValue: null,         // End value. If endValue specified, end is ignored.
+        minSpan: null,          // 0 ~ 100
+        maxSpan: null,          // 0 ~ 100
+        minValueSpan: null,     // The range of dataZoom can not be smaller than that.
+        maxValueSpan: null,     // The range of dataZoom can not be larger than that.
+        rangeMode: null         // Array, can be 'value' or 'percent'.
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel) {
+
+        /**
+         * key like x_0, y_1
+         * @private
+         * @type {Object}
+         */
+        this._dataIntervalByAxis = {};
+
+        /**
+         * @private
+         */
+        this._dataInfo = {};
+
+        /**
+         * key like x_0, y_1
+         * @private
+         */
+        this._axisProxies = {};
+
+        /**
+         * @readOnly
+         */
+        this.textStyleModel;
+
+        /**
+         * @private
+         */
+        this._autoThrottle = true;
+
+        /**
+         * 'percent' or 'value'
+         * @private
+         */
+        this._rangePropMode = ['percent', 'percent'];
+
+        var rawOption = retrieveRaw(option);
+
+        this.mergeDefaultAndTheme(option, ecModel);
+
+        this.doInit(rawOption);
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (newOption) {
+        var rawOption = retrieveRaw(newOption);
+
+        //FIX #2591
+        merge(this.option, newOption, true);
+
+        this.doInit(rawOption);
+    },
+
+    /**
+     * @protected
+     */
+    doInit: function (rawOption) {
+        var thisOption = this.option;
+
+        // Disable realtime view update if canvas is not supported.
+        if (!env$1.canvasSupported) {
+            thisOption.realtime = false;
+        }
+
+        this._setDefaultThrottle(rawOption);
+
+        updateRangeUse(this, rawOption);
+
+        each$21([['start', 'startValue'], ['end', 'endValue']], function (names, index) {
+            // start/end has higher priority over startValue/endValue if they
+            // both set, but we should make chart.setOption({endValue: 1000})
+            // effective, rather than chart.setOption({endValue: 1000, end: null}).
+            if (this._rangePropMode[index] === 'value') {
+                thisOption[names[0]] = null;
+            }
+            // Otherwise do nothing and use the merge result.
+        }, this);
+
+        this.textStyleModel = this.getModel('textStyle');
+
+        this._resetTarget();
+
+        this._giveAxisProxies();
+    },
+
+    /**
+     * @private
+     */
+    _giveAxisProxies: function () {
+        var axisProxies = this._axisProxies;
+
+        this.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel, ecModel) {
+            var axisModel = this.dependentModels[dimNames.axis][axisIndex];
+
+            // If exists, share axisProxy with other dataZoomModels.
+            var axisProxy = axisModel.__dzAxisProxy || (
+                // Use the first dataZoomModel as the main model of axisProxy.
+                axisModel.__dzAxisProxy = new AxisProxy(
+                    dimNames.name, axisIndex, this, ecModel
+                )
+            );
+            // FIXME
+            // dispose __dzAxisProxy
+
+            axisProxies[dimNames.name + '_' + axisIndex] = axisProxy;
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _resetTarget: function () {
+        var thisOption = this.option;
+
+        var autoMode = this._judgeAutoMode();
+
+        eachAxisDim(function (dimNames) {
+            var axisIndexName = dimNames.axisIndex;
+            thisOption[axisIndexName] = normalizeToArray(
+                thisOption[axisIndexName]
+            );
+        }, this);
+
+        if (autoMode === 'axisIndex') {
+            this._autoSetAxisIndex();
+        }
+        else if (autoMode === 'orient') {
+            this._autoSetOrient();
+        }
+    },
+
+    /**
+     * @private
+     */
+    _judgeAutoMode: function () {
+        // Auto set only works for setOption at the first time.
+        // The following is user's reponsibility. So using merged
+        // option is OK.
+        var thisOption = this.option;
+
+        var hasIndexSpecified = false;
+        eachAxisDim(function (dimNames) {
+            // When user set axisIndex as a empty array, we think that user specify axisIndex
+            // but do not want use auto mode. Because empty array may be encountered when
+            // some error occured.
+            if (thisOption[dimNames.axisIndex] != null) {
+                hasIndexSpecified = true;
+            }
+        }, this);
+
+        var orient = thisOption.orient;
+
+        if (orient == null && hasIndexSpecified) {
+            return 'orient';
+        }
+        else if (!hasIndexSpecified) {
+            if (orient == null) {
+                thisOption.orient = 'horizontal';
+            }
+            return 'axisIndex';
+        }
+    },
+
+    /**
+     * @private
+     */
+    _autoSetAxisIndex: function () {
+        var autoAxisIndex = true;
+        var orient = this.get('orient', true);
+        var thisOption = this.option;
+        var dependentModels = this.dependentModels;
+
+        if (autoAxisIndex) {
+            // Find axis that parallel to dataZoom as default.
+            var dimName = orient === 'vertical' ? 'y' : 'x';
+
+            if (dependentModels[dimName + 'Axis'].length) {
+                thisOption[dimName + 'AxisIndex'] = [0];
+                autoAxisIndex = false;
+            }
+            else {
+                each$21(dependentModels.singleAxis, function (singleAxisModel) {
+                    if (autoAxisIndex && singleAxisModel.get('orient', true) === orient) {
+                        thisOption.singleAxisIndex = [singleAxisModel.componentIndex];
+                        autoAxisIndex = false;
+                    }
+                });
+            }
+        }
+
+        if (autoAxisIndex) {
+            // Find the first category axis as default. (consider polar)
+            eachAxisDim(function (dimNames) {
+                if (!autoAxisIndex) {
+                    return;
+                }
+                var axisIndices = [];
+                var axisModels = this.dependentModels[dimNames.axis];
+                if (axisModels.length && !axisIndices.length) {
+                    for (var i = 0, len = axisModels.length; i < len; i++) {
+                        if (axisModels[i].get('type') === 'category') {
+                            axisIndices.push(i);
+                        }
+                    }
+                }
+                thisOption[dimNames.axisIndex] = axisIndices;
+                if (axisIndices.length) {
+                    autoAxisIndex = false;
+                }
+            }, this);
+        }
+
+        if (autoAxisIndex) {
+            // FIXME
+            // 这里是兼容ec2的写法（没指定xAxisIndex和yAxisIndex时把scatter和双数值轴折柱纳入dataZoom控制），
+            // 但是实际是否需要Grid.js#getScaleByOption来判断（考虑time，log等axis type）？
+
+            // If both dataZoom.xAxisIndex and dataZoom.yAxisIndex is not specified,
+            // dataZoom component auto adopts series that reference to
+            // both xAxis and yAxis which type is 'value'.
+            this.ecModel.eachSeries(function (seriesModel) {
+                if (this._isSeriesHasAllAxesTypeOf(seriesModel, 'value')) {
+                    eachAxisDim(function (dimNames) {
+                        var axisIndices = thisOption[dimNames.axisIndex];
+
+                        var axisIndex = seriesModel.get(dimNames.axisIndex);
+                        var axisId = seriesModel.get(dimNames.axisId);
+
+                        var axisModel = seriesModel.ecModel.queryComponents({
+                            mainType: dimNames.axis,
+                            index: axisIndex,
+                            id: axisId
+                        })[0];
+
+                        if (__DEV__) {
+                            if (!axisModel) {
+                                throw new Error(
+                                    dimNames.axis + ' "' + retrieve(
+                                        axisIndex,
+                                        axisId,
+                                        0
+                                    ) + '" not found'
+                                );
+                            }
+                        }
+                        axisIndex = axisModel.componentIndex;
+
+                        if (indexOf(axisIndices, axisIndex) < 0) {
+                            axisIndices.push(axisIndex);
+                        }
+                    });
+                }
+            }, this);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _autoSetOrient: function () {
+        var dim;
+
+        // Find the first axis
+        this.eachTargetAxis(function (dimNames) {
+            !dim && (dim = dimNames.name);
+        }, this);
+
+        this.option.orient = dim === 'y' ? 'vertical' : 'horizontal';
+    },
+
+    /**
+     * @private
+     */
+    _isSeriesHasAllAxesTypeOf: function (seriesModel, axisType) {
+        // FIXME
+        // 需要series的xAxisIndex和yAxisIndex都首先自动设置上。
+        // 例如series.type === scatter时。
+
+        var is = true;
+        eachAxisDim(function (dimNames) {
+            var seriesAxisIndex = seriesModel.get(dimNames.axisIndex);
+            var axisModel = this.dependentModels[dimNames.axis][seriesAxisIndex];
+
+            if (!axisModel || axisModel.get('type') !== axisType) {
+                is = false;
+            }
+        }, this);
+        return is;
+    },
+
+    /**
+     * @private
+     */
+    _setDefaultThrottle: function (rawOption) {
+        // When first time user set throttle, auto throttle ends.
+        if (rawOption.hasOwnProperty('throttle')) {
+            this._autoThrottle = false;
+        }
+        if (this._autoThrottle) {
+            var globalOption = this.ecModel.option;
+            this.option.throttle =
+                (globalOption.animation && globalOption.animationDurationUpdate > 0)
+                ? 100 : 20;
+        }
+    },
+
+    /**
+     * @public
+     */
+    getFirstTargetAxisModel: function () {
+        var firstAxisModel;
+        eachAxisDim(function (dimNames) {
+            if (firstAxisModel == null) {
+                var indices = this.get(dimNames.axisIndex);
+                if (indices.length) {
+                    firstAxisModel = this.dependentModels[dimNames.axis][indices[0]];
+                }
+            }
+        }, this);
+
+        return firstAxisModel;
+    },
+
+    /**
+     * @public
+     * @param {Function} callback param: axisModel, dimNames, axisIndex, dataZoomModel, ecModel
+     */
+    eachTargetAxis: function (callback, context) {
+        var ecModel = this.ecModel;
+        eachAxisDim(function (dimNames) {
+            each$21(
+                this.get(dimNames.axisIndex),
+                function (axisIndex) {
+                    callback.call(context, dimNames, axisIndex, this, ecModel);
+                },
+                this
+            );
+        }, this);
+    },
+
+    /**
+     * @param {string} dimName
+     * @param {number} axisIndex
+     * @return {module:echarts/component/dataZoom/AxisProxy} If not found, return null/undefined.
+     */
+    getAxisProxy: function (dimName, axisIndex) {
+        return this._axisProxies[dimName + '_' + axisIndex];
+    },
+
+    /**
+     * @param {string} dimName
+     * @param {number} axisIndex
+     * @return {module:echarts/model/Model} If not found, return null/undefined.
+     */
+    getAxisModel: function (dimName, axisIndex) {
+        var axisProxy = this.getAxisProxy(dimName, axisIndex);
+        return axisProxy && axisProxy.getAxisModel();
+    },
+
+    /**
+     * If not specified, set to undefined.
+     *
+     * @public
+     * @param {Object} opt
+     * @param {number} [opt.start]
+     * @param {number} [opt.end]
+     * @param {number} [opt.startValue]
+     * @param {number} [opt.endValue]
+     * @param {boolean} [ignoreUpdateRangeUsg=false]
+     */
+    setRawRange: function (opt, ignoreUpdateRangeUsg) {
+        var option = this.option;
+        each$21([['start', 'startValue'], ['end', 'endValue']], function (names) {
+            // If only one of 'start' and 'startValue' is not null/undefined, the other
+            // should be cleared, which enable clear the option.
+            // If both of them are not set, keep option with the original value, which
+            // enable use only set start but not set end when calling `dispatchAction`.
+            // The same as 'end' and 'endValue'.
+            if (opt[names[0]] != null || opt[names[1]] != null) {
+                option[names[0]] = opt[names[0]];
+                option[names[1]] = opt[names[1]];
+            }
+        }, this);
+
+        !ignoreUpdateRangeUsg && updateRangeUse(this, opt);
+    },
+
+    /**
+     * @public
+     * @return {Array.<number>} [startPercent, endPercent]
+     */
+    getPercentRange: function () {
+        var axisProxy = this.findRepresentativeAxisProxy();
+        if (axisProxy) {
+            return axisProxy.getDataPercentWindow();
+        }
+    },
+
+    /**
+     * @public
+     * For example, chart.getModel().getComponent('dataZoom').getValueRange('y', 0);
+     *
+     * @param {string} [axisDimName]
+     * @param {number} [axisIndex]
+     * @return {Array.<number>} [startValue, endValue] value can only be '-' or finite number.
+     */
+    getValueRange: function (axisDimName, axisIndex) {
+        if (axisDimName == null && axisIndex == null) {
+            var axisProxy = this.findRepresentativeAxisProxy();
+            if (axisProxy) {
+                return axisProxy.getDataValueWindow();
+            }
+        }
+        else {
+            return this.getAxisProxy(axisDimName, axisIndex).getDataValueWindow();
+        }
+    },
+
+    /**
+     * @public
+     * @param {module:echarts/model/Model} [axisModel] If axisModel given, find axisProxy
+     *      corresponding to the axisModel
+     * @return {module:echarts/component/dataZoom/AxisProxy}
+     */
+    findRepresentativeAxisProxy: function (axisModel) {
+        if (axisModel) {
+            return axisModel.__dzAxisProxy;
+        }
+
+        // Find the first hosted axisProxy
+        var axisProxies = this._axisProxies;
+        for (var key in axisProxies) {
+            if (axisProxies.hasOwnProperty(key) && axisProxies[key].hostedBy(this)) {
+                return axisProxies[key];
+            }
+        }
+
+        // If no hosted axis find not hosted axisProxy.
+        // Consider this case: dataZoomModel1 and dataZoomModel2 control the same axis,
+        // and the option.start or option.end settings are different. The percentRange
+        // should follow axisProxy.
+        // (We encounter this problem in toolbox data zoom.)
+        for (var key in axisProxies) {
+            if (axisProxies.hasOwnProperty(key) && !axisProxies[key].hostedBy(this)) {
+                return axisProxies[key];
+            }
+        }
+    },
+
+    /**
+     * @return {Array.<string>}
+     */
+    getRangePropMode: function () {
+        return this._rangePropMode.slice();
+    }
+
+});
+
+function retrieveRaw(option) {
+    var ret = {};
+    each$21(
+        ['start', 'end', 'startValue', 'endValue', 'throttle'],
+        function (name) {
+            option.hasOwnProperty(name) && (ret[name] = option[name]);
+        }
+    );
+    return ret;
+}
+
+function updateRangeUse(dataZoomModel, rawOption) {
+    var rangePropMode = dataZoomModel._rangePropMode;
+    var rangeModeInOption = dataZoomModel.get('rangeMode');
+
+    each$21([['start', 'startValue'], ['end', 'endValue']], function (names, index) {
+        var percentSpecified = rawOption[names[0]] != null;
+        var valueSpecified = rawOption[names[1]] != null;
+        if (percentSpecified && !valueSpecified) {
+            rangePropMode[index] = 'percent';
+        }
+        else if (!percentSpecified && valueSpecified) {
+            rangePropMode[index] = 'value';
+        }
+        else if (rangeModeInOption) {
+            rangePropMode[index] = rangeModeInOption[index];
+        }
+        else if (percentSpecified) { // percentSpecified && valueSpecified
+            rangePropMode[index] = 'percent';
+        }
+        // else remain its original setting.
+    });
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var DataZoomView = Component.extend({
+
+    type: 'dataZoom',
+
+    render: function (dataZoomModel, ecModel, api, payload) {
+        this.dataZoomModel = dataZoomModel;
+        this.ecModel = ecModel;
+        this.api = api;
+    },
+
+    /**
+     * Find the first target coordinate system.
+     *
+     * @protected
+     * @return {Object} {
+     *                   grid: [
+     *                       {model: coord0, axisModels: [axis1, axis3], coordIndex: 1},
+     *                       {model: coord1, axisModels: [axis0, axis2], coordIndex: 0},
+     *                       ...
+     *                   ],  // cartesians must not be null/undefined.
+     *                   polar: [
+     *                       {model: coord0, axisModels: [axis4], coordIndex: 0},
+     *                       ...
+     *                   ],  // polars must not be null/undefined.
+     *                   singleAxis: [
+     *                       {model: coord0, axisModels: [], coordIndex: 0}
+     *                   ]
+     */
+    getTargetCoordInfo: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var ecModel = this.ecModel;
+        var coordSysLists = {};
+
+        dataZoomModel.eachTargetAxis(function (dimNames, axisIndex) {
+            var axisModel = ecModel.getComponent(dimNames.axis, axisIndex);
+            if (axisModel) {
+                var coordModel = axisModel.getCoordSysModel();
+                coordModel && save(
+                    coordModel,
+                    axisModel,
+                    coordSysLists[coordModel.mainType] || (coordSysLists[coordModel.mainType] = []),
+                    coordModel.componentIndex
+                );
+            }
+        }, this);
+
+        function save(coordModel, axisModel, store, coordIndex) {
+            var item;
+            for (var i = 0; i < store.length; i++) {
+                if (store[i].model === coordModel) {
+                    item = store[i];
+                    break;
+                }
+            }
+            if (!item) {
+                store.push(item = {
+                    model: coordModel, axisModels: [], coordIndex: coordIndex
+                });
+            }
+            item.axisModels.push(axisModel);
+        }
+
+        return coordSysLists;
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var SliderZoomModel = DataZoomModel.extend({
+
+    type: 'dataZoom.slider',
+
+    layoutMode: 'box',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        show: true,
+
+        // ph => placeholder. Using placehoder here because
+        // deault value can only be drived in view stage.
+        right: 'ph',  // Default align to grid rect.
+        top: 'ph',    // Default align to grid rect.
+        width: 'ph',  // Default align to grid rect.
+        height: 'ph', // Default align to grid rect.
+        left: null,   // Default align to grid rect.
+        bottom: null, // Default align to grid rect.
+
+        backgroundColor: 'rgba(47,69,84,0)',    // Background of slider zoom component.
+        // dataBackgroundColor: '#ddd',         // Background coor of data shadow and border of box,
+                                                // highest priority, remain for compatibility of
+                                                // previous version, but not recommended any more.
+        dataBackground: {
+            lineStyle: {
+                color: '#2f4554',
+                width: 0.5,
+                opacity: 0.3
+            },
+            areaStyle: {
+                color: 'rgba(47,69,84,0.3)',
+                opacity: 0.3
+            }
+        },
+        borderColor: '#ddd',                    // border color of the box. For compatibility,
+                                                // if dataBackgroundColor is set, borderColor
+                                                // is ignored.
+
+        fillerColor: 'rgba(167,183,204,0.4)',     // Color of selected area.
+        // handleColor: 'rgba(89,170,216,0.95)',     // Color of handle.
+        // handleIcon: 'path://M4.9,17.8c0-1.4,4.5-10.5,5.5-12.4c0-0.1,0.6-1.1,0.9-1.1c0.4,0,0.9,1,0.9,1.1c1.1,2.2,5.4,11,5.4,12.4v17.8c0,1.5-0.6,2.1-1.3,2.1H6.1c-0.7,0-1.3-0.6-1.3-2.1V17.8z',
+        handleIcon: 'M8.2,13.6V3.9H6.3v9.7H3.1v14.9h3.3v9.7h1.8v-9.7h3.3V13.6H8.2z M9.7,24.4H4.8v-1.4h4.9V24.4z M9.7,19.1H4.8v-1.4h4.9V19.1z',
+        // Percent of the slider height
+        handleSize: '100%',
+
+        handleStyle: {
+            color: '#a7b7cc'
+        },
+
+        labelPrecision: null,
+        labelFormatter: null,
+        showDetail: true,
+        showDataShadow: 'auto',                 // Default auto decision.
+        realtime: true,
+        zoomLock: false,                        // Whether disable zoom.
+        textStyle: {
+            color: '#333'
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var Rect$2 = Rect;
+var linearMap$1 = linearMap;
+var asc$2 = asc;
+var bind$4 = bind;
+var each$23 = each$1;
+
+// Constants
+var DEFAULT_LOCATION_EDGE_GAP = 7;
+var DEFAULT_FRAME_BORDER_WIDTH = 1;
+var DEFAULT_FILLER_SIZE = 30;
+var HORIZONTAL = 'horizontal';
+var VERTICAL = 'vertical';
+var LABEL_GAP = 5;
+var SHOW_DATA_SHADOW_SERIES_TYPE = ['line', 'bar', 'candlestick', 'scatter'];
+
+var SliderZoomView = DataZoomView.extend({
+
+    type: 'dataZoom.slider',
+
+    init: function (ecModel, api) {
+
+        /**
+         * @private
+         * @type {Object}
+         */
+        this._displayables = {};
+
+        /**
+         * @private
+         * @type {string}
+         */
+        this._orient;
+
+        /**
+         * [0, 100]
+         * @private
+         */
+        this._range;
+
+        /**
+         * [coord of the first handle, coord of the second handle]
+         * @private
+         */
+        this._handleEnds;
+
+        /**
+         * [length, thick]
+         * @private
+         * @type {Array.<number>}
+         */
+        this._size;
+
+        /**
+         * @private
+         * @type {number}
+         */
+        this._handleWidth;
+
+        /**
+         * @private
+         * @type {number}
+         */
+        this._handleHeight;
+
+        /**
+         * @private
+         */
+        this._location;
+
+        /**
+         * @private
+         */
+        this._dragging;
+
+        /**
+         * @private
+         */
+        this._dataShadowInfo;
+
+        this.api = api;
+    },
+
+    /**
+     * @override
+     */
+    render: function (dataZoomModel, ecModel, api, payload) {
+        SliderZoomView.superApply(this, 'render', arguments);
+
+        createOrUpdate(
+            this,
+            '_dispatchZoomAction',
+            this.dataZoomModel.get('throttle'),
+            'fixRate'
+        );
+
+        this._orient = dataZoomModel.get('orient');
+
+        if (this.dataZoomModel.get('show') === false) {
+            this.group.removeAll();
+            return;
+        }
+
+        // Notice: this._resetInterval() should not be executed when payload.type
+        // is 'dataZoom', origin this._range should be maintained, otherwise 'pan'
+        // or 'zoom' info will be missed because of 'throttle' of this.dispatchAction,
+        if (!payload || payload.type !== 'dataZoom' || payload.from !== this.uid) {
+            this._buildView();
+        }
+
+        this._updateView();
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        SliderZoomView.superApply(this, 'remove', arguments);
+        clear(this, '_dispatchZoomAction');
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        SliderZoomView.superApply(this, 'dispose', arguments);
+        clear(this, '_dispatchZoomAction');
+    },
+
+    _buildView: function () {
+        var thisGroup = this.group;
+
+        thisGroup.removeAll();
+
+        this._resetLocation();
+        this._resetInterval();
+
+        var barGroup = this._displayables.barGroup = new Group();
+
+        this._renderBackground();
+
+        this._renderHandle();
+
+        this._renderDataShadow();
+
+        thisGroup.add(barGroup);
+
+        this._positionGroup();
+    },
+
+    /**
+     * @private
+     */
+    _resetLocation: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var api = this.api;
+
+        // If some of x/y/width/height are not specified,
+        // auto-adapt according to target grid.
+        var coordRect = this._findCoordRect();
+        var ecSize = {width: api.getWidth(), height: api.getHeight()};
+        // Default align by coordinate system rect.
+        var positionInfo = this._orient === HORIZONTAL
+            ? {
+                // Why using 'right', because right should be used in vertical,
+                // and it is better to be consistent for dealing with position param merge.
+                right: ecSize.width - coordRect.x - coordRect.width,
+                top: (ecSize.height - DEFAULT_FILLER_SIZE - DEFAULT_LOCATION_EDGE_GAP),
+                width: coordRect.width,
+                height: DEFAULT_FILLER_SIZE
+            }
+            : { // vertical
+                right: DEFAULT_LOCATION_EDGE_GAP,
+                top: coordRect.y,
+                width: DEFAULT_FILLER_SIZE,
+                height: coordRect.height
+            };
+
+        // Do not write back to option and replace value 'ph', because
+        // the 'ph' value should be recalculated when resize.
+        var layoutParams = getLayoutParams(dataZoomModel.option);
+
+        // Replace the placeholder value.
+        each$1(['right', 'top', 'width', 'height'], function (name) {
+            if (layoutParams[name] === 'ph') {
+                layoutParams[name] = positionInfo[name];
+            }
+        });
+
+        var layoutRect = getLayoutRect(
+            layoutParams,
+            ecSize,
+            dataZoomModel.padding
+        );
+
+        this._location = {x: layoutRect.x, y: layoutRect.y};
+        this._size = [layoutRect.width, layoutRect.height];
+        this._orient === VERTICAL && this._size.reverse();
+    },
+
+    /**
+     * @private
+     */
+    _positionGroup: function () {
+        var thisGroup = this.group;
+        var location = this._location;
+        var orient = this._orient;
+
+        // Just use the first axis to determine mapping.
+        var targetAxisModel = this.dataZoomModel.getFirstTargetAxisModel();
+        var inverse = targetAxisModel && targetAxisModel.get('inverse');
+
+        var barGroup = this._displayables.barGroup;
+        var otherAxisInverse = (this._dataShadowInfo || {}).otherAxisInverse;
+
+        // Transform barGroup.
+        barGroup.attr(
+            (orient === HORIZONTAL && !inverse)
+            ? {scale: otherAxisInverse ? [1, 1] : [1, -1]}
+            : (orient === HORIZONTAL && inverse)
+            ? {scale: otherAxisInverse ? [-1, 1] : [-1, -1]}
+            : (orient === VERTICAL && !inverse)
+            ? {scale: otherAxisInverse ? [1, -1] : [1, 1], rotation: Math.PI / 2}
+            // Dont use Math.PI, considering shadow direction.
+            : {scale: otherAxisInverse ? [-1, -1] : [-1, 1], rotation: Math.PI / 2}
+        );
+
+        // Position barGroup
+        var rect = thisGroup.getBoundingRect([barGroup]);
+        thisGroup.attr('position', [location.x - rect.x, location.y - rect.y]);
+    },
+
+    /**
+     * @private
+     */
+    _getViewExtent: function () {
+        return [0, this._size[0]];
+    },
+
+    _renderBackground: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var size = this._size;
+        var barGroup = this._displayables.barGroup;
+
+        barGroup.add(new Rect$2({
+            silent: true,
+            shape: {
+                x: 0, y: 0, width: size[0], height: size[1]
+            },
+            style: {
+                fill: dataZoomModel.get('backgroundColor')
+            },
+            z2: -40
+        }));
+
+        // Click panel, over shadow, below handles.
+        barGroup.add(new Rect$2({
+            shape: {
+                x: 0, y: 0, width: size[0], height: size[1]
+            },
+            style: {
+                fill: 'transparent'
+            },
+            z2: 0,
+            onclick: bind(this._onClickPanelClick, this)
+        }));
+    },
+
+    _renderDataShadow: function () {
+        var info = this._dataShadowInfo = this._prepareDataShadowInfo();
+
+        if (!info) {
+            return;
+        }
+
+        var size = this._size;
+        var seriesModel = info.series;
+        var data = seriesModel.getRawData();
+
+        var otherDim = seriesModel.getShadowDim
+            ? seriesModel.getShadowDim() // @see candlestick
+            : info.otherDim;
+
+        if (otherDim == null) {
+            return;
+        }
+
+        var otherDataExtent = data.getDataExtent(otherDim);
+        // Nice extent.
+        var otherOffset = (otherDataExtent[1] - otherDataExtent[0]) * 0.3;
+        otherDataExtent = [
+            otherDataExtent[0] - otherOffset,
+            otherDataExtent[1] + otherOffset
+        ];
+        var otherShadowExtent = [0, size[1]];
+
+        var thisShadowExtent = [0, size[0]];
+
+        var areaPoints = [[size[0], 0], [0, 0]];
+        var linePoints = [];
+        var step = thisShadowExtent[1] / (data.count() - 1);
+        var thisCoord = 0;
+
+        // Optimize for large data shadow
+        var stride = Math.round(data.count() / size[0]);
+        var lastIsEmpty;
+        data.each([otherDim], function (value, index) {
+            if (stride > 0 && (index % stride)) {
+                thisCoord += step;
+                return;
+            }
+
+            // FIXME
+            // Should consider axis.min/axis.max when drawing dataShadow.
+
+            // FIXME
+            // 应该使用统一的空判断？还是在list里进行空判断？
+            var isEmpty = value == null || isNaN(value) || value === '';
+            // See #4235.
+            var otherCoord = isEmpty
+                ? 0 : linearMap$1(value, otherDataExtent, otherShadowExtent, true);
+
+            // Attempt to draw data shadow precisely when there are empty value.
+            if (isEmpty && !lastIsEmpty && index) {
+                areaPoints.push([areaPoints[areaPoints.length - 1][0], 0]);
+                linePoints.push([linePoints[linePoints.length - 1][0], 0]);
+            }
+            else if (!isEmpty && lastIsEmpty) {
+                areaPoints.push([thisCoord, 0]);
+                linePoints.push([thisCoord, 0]);
+            }
+
+            areaPoints.push([thisCoord, otherCoord]);
+            linePoints.push([thisCoord, otherCoord]);
+
+            thisCoord += step;
+            lastIsEmpty = isEmpty;
+        });
+
+        var dataZoomModel = this.dataZoomModel;
+        // var dataBackgroundModel = dataZoomModel.getModel('dataBackground');
+        this._displayables.barGroup.add(new Polygon({
+            shape: {points: areaPoints},
+            style: defaults(
+                {fill: dataZoomModel.get('dataBackgroundColor')},
+                dataZoomModel.getModel('dataBackground.areaStyle').getAreaStyle()
+            ),
+            silent: true,
+            z2: -20
+        }));
+        this._displayables.barGroup.add(new Polyline({
+            shape: {points: linePoints},
+            style: dataZoomModel.getModel('dataBackground.lineStyle').getLineStyle(),
+            silent: true,
+            z2: -19
+        }));
+    },
+
+    _prepareDataShadowInfo: function () {
+        var dataZoomModel = this.dataZoomModel;
+        var showDataShadow = dataZoomModel.get('showDataShadow');
+
+        if (showDataShadow === false) {
+            return;
+        }
+
+        // Find a representative series.
+        var result;
+        var ecModel = this.ecModel;
+
+        dataZoomModel.eachTargetAxis(function (dimNames, axisIndex) {
+            var seriesModels = dataZoomModel
+                .getAxisProxy(dimNames.name, axisIndex)
+                .getTargetSeriesModels();
+
+            each$1(seriesModels, function (seriesModel) {
+                if (result) {
+                    return;
+                }
+
+                if (showDataShadow !== true && indexOf(
+                        SHOW_DATA_SHADOW_SERIES_TYPE, seriesModel.get('type')
+                    ) < 0
+                ) {
+                    return;
+                }
+
+                var thisAxis = ecModel.getComponent(dimNames.axis, axisIndex).axis;
+                var otherDim = getOtherDim(dimNames.name);
+                var otherAxisInverse;
+                var coordSys = seriesModel.coordinateSystem;
+
+                if (otherDim != null && coordSys.getOtherAxis) {
+                    otherAxisInverse = coordSys.getOtherAxis(thisAxis).inverse;
+                }
+
+                otherDim = seriesModel.getData().mapDimension(otherDim);
+
+                result = {
+                    thisAxis: thisAxis,
+                    series: seriesModel,
+                    thisDim: dimNames.name,
+                    otherDim: otherDim,
+                    otherAxisInverse: otherAxisInverse
+                };
+
+            }, this);
+
+        }, this);
+
+        return result;
+    },
+
+    _renderHandle: function () {
+        var displaybles = this._displayables;
+        var handles = displaybles.handles = [];
+        var handleLabels = displaybles.handleLabels = [];
+        var barGroup = this._displayables.barGroup;
+        var size = this._size;
+        var dataZoomModel = this.dataZoomModel;
+
+        barGroup.add(displaybles.filler = new Rect$2({
+            draggable: true,
+            cursor: getCursor(this._orient),
+            drift: bind$4(this._onDragMove, this, 'all'),
+            onmousemove: function (e) {
+                // Fot mobile devicem, prevent screen slider on the button.
+                stop(e.event);
+            },
+            ondragstart: bind$4(this._showDataInfo, this, true),
+            ondragend: bind$4(this._onDragEnd, this),
+            onmouseover: bind$4(this._showDataInfo, this, true),
+            onmouseout: bind$4(this._showDataInfo, this, false),
+            style: {
+                fill: dataZoomModel.get('fillerColor'),
+                textPosition : 'inside'
+            }
+        }));
+
+        // Frame border.
+        barGroup.add(new Rect$2(subPixelOptimizeRect({
+            silent: true,
+            shape: {
+                x: 0,
+                y: 0,
+                width: size[0],
+                height: size[1]
+            },
+            style: {
+                stroke: dataZoomModel.get('dataBackgroundColor')
+                    || dataZoomModel.get('borderColor'),
+                lineWidth: DEFAULT_FRAME_BORDER_WIDTH,
+                fill: 'rgba(0,0,0,0)'
+            }
+        })));
+
+        each$23([0, 1], function (handleIndex) {
+            var path = createIcon(
+                dataZoomModel.get('handleIcon'),
+                {
+                    cursor: getCursor(this._orient),
+                    draggable: true,
+                    drift: bind$4(this._onDragMove, this, handleIndex),
+                    onmousemove: function (e) {
+                        // Fot mobile devicem, prevent screen slider on the button.
+                        stop(e.event);
+                    },
+                    ondragend: bind$4(this._onDragEnd, this),
+                    onmouseover: bind$4(this._showDataInfo, this, true),
+                    onmouseout: bind$4(this._showDataInfo, this, false)
+                },
+                {x: -1, y: 0, width: 2, height: 2}
+            );
+
+            var bRect = path.getBoundingRect();
+            this._handleHeight = parsePercent$1(dataZoomModel.get('handleSize'), this._size[1]);
+            this._handleWidth = bRect.width / bRect.height * this._handleHeight;
+
+            path.setStyle(dataZoomModel.getModel('handleStyle').getItemStyle());
+            var handleColor = dataZoomModel.get('handleColor');
+            // Compatitable with previous version
+            if (handleColor != null) {
+                path.style.fill = handleColor;
+            }
+
+            barGroup.add(handles[handleIndex] = path);
+
+            var textStyleModel = dataZoomModel.textStyleModel;
+
+            this.group.add(
+                handleLabels[handleIndex] = new Text({
+                silent: true,
+                invisible: true,
+                style: {
+                    x: 0, y: 0, text: '',
+                    textVerticalAlign: 'middle',
+                    textAlign: 'center',
+                    textFill: textStyleModel.getTextColor(),
+                    textFont: textStyleModel.getFont()
+                },
+                z2: 10
+            }));
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _resetInterval: function () {
+        var range = this._range = this.dataZoomModel.getPercentRange();
+        var viewExtent = this._getViewExtent();
+
+        this._handleEnds = [
+            linearMap$1(range[0], [0, 100], viewExtent, true),
+            linearMap$1(range[1], [0, 100], viewExtent, true)
+        ];
+    },
+
+    /**
+     * @private
+     * @param {(number|string)} handleIndex 0 or 1 or 'all'
+     * @param {number} delta
+     * @return {boolean} changed
+     */
+    _updateInterval: function (handleIndex, delta) {
+        var dataZoomModel = this.dataZoomModel;
+        var handleEnds = this._handleEnds;
+        var viewExtend = this._getViewExtent();
+        var minMaxSpan = dataZoomModel.findRepresentativeAxisProxy().getMinMaxSpan();
+        var percentExtent = [0, 100];
+
+        sliderMove(
+            delta,
+            handleEnds,
+            viewExtend,
+            dataZoomModel.get('zoomLock') ? 'all' : handleIndex,
+            minMaxSpan.minSpan != null
+                ? linearMap$1(minMaxSpan.minSpan, percentExtent, viewExtend, true) : null,
+            minMaxSpan.maxSpan != null
+                ? linearMap$1(minMaxSpan.maxSpan, percentExtent, viewExtend, true) : null
+        );
+
+        var lastRange = this._range;
+        var range = this._range = asc$2([
+            linearMap$1(handleEnds[0], viewExtend, percentExtent, true),
+            linearMap$1(handleEnds[1], viewExtend, percentExtent, true)
+        ]);
+
+        return !lastRange || lastRange[0] !== range[0] || lastRange[1] !== range[1];
+    },
+
+    /**
+     * @private
+     */
+    _updateView: function (nonRealtime) {
+        var displaybles = this._displayables;
+        var handleEnds = this._handleEnds;
+        var handleInterval = asc$2(handleEnds.slice());
+        var size = this._size;
+
+        each$23([0, 1], function (handleIndex) {
+            // Handles
+            var handle = displaybles.handles[handleIndex];
+            var handleHeight = this._handleHeight;
+            handle.attr({
+                scale: [handleHeight / 2, handleHeight / 2],
+                position: [handleEnds[handleIndex], size[1] / 2 - handleHeight / 2]
+            });
+        }, this);
+
+        // Filler
+        displaybles.filler.setShape({
+            x: handleInterval[0],
+            y: 0,
+            width: handleInterval[1] - handleInterval[0],
+            height: size[1]
+        });
+
+        this._updateDataInfo(nonRealtime);
+    },
+
+    /**
+     * @private
+     */
+    _updateDataInfo: function (nonRealtime) {
+        var dataZoomModel = this.dataZoomModel;
+        var displaybles = this._displayables;
+        var handleLabels = displaybles.handleLabels;
+        var orient = this._orient;
+        var labelTexts = ['', ''];
+
+        // FIXME
+        // date型，支持formatter，autoformatter（ec2 date.getAutoFormatter）
+        if (dataZoomModel.get('showDetail')) {
+            var axisProxy = dataZoomModel.findRepresentativeAxisProxy();
+
+            if (axisProxy) {
+                var axis = axisProxy.getAxisModel().axis;
+                var range = this._range;
+
+                var dataInterval = nonRealtime
+                    // See #4434, data and axis are not processed and reset yet in non-realtime mode.
+                    ? axisProxy.calculateDataWindow({
+                        start: range[0], end: range[1]
+                    }).valueWindow
+                    : axisProxy.getDataValueWindow();
+
+                labelTexts = [
+                    this._formatLabel(dataInterval[0], axis),
+                    this._formatLabel(dataInterval[1], axis)
+                ];
+            }
+        }
+
+        var orderedHandleEnds = asc$2(this._handleEnds.slice());
+
+        setLabel.call(this, 0);
+        setLabel.call(this, 1);
+
+        function setLabel(handleIndex) {
+            // Label
+            // Text should not transform by barGroup.
+            // Ignore handlers transform
+            var barTransform = getTransform(
+                displaybles.handles[handleIndex].parent, this.group
+            );
+            var direction = transformDirection(
+                handleIndex === 0 ? 'right' : 'left', barTransform
+            );
+            var offset = this._handleWidth / 2 + LABEL_GAP;
+            var textPoint = applyTransform$1(
+                [
+                    orderedHandleEnds[handleIndex] + (handleIndex === 0 ? -offset : offset),
+                    this._size[1] / 2
+                ],
+                barTransform
+            );
+            handleLabels[handleIndex].setStyle({
+                x: textPoint[0],
+                y: textPoint[1],
+                textVerticalAlign: orient === HORIZONTAL ? 'middle' : direction,
+                textAlign: orient === HORIZONTAL ? direction : 'center',
+                text: labelTexts[handleIndex]
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _formatLabel: function (value, axis) {
+        var dataZoomModel = this.dataZoomModel;
+        var labelFormatter = dataZoomModel.get('labelFormatter');
+
+        var labelPrecision = dataZoomModel.get('labelPrecision');
+        if (labelPrecision == null || labelPrecision === 'auto') {
+            labelPrecision = axis.getPixelPrecision();
+        }
+
+        var valueStr = (value == null || isNaN(value))
+            ? ''
+            // FIXME Glue code
+            : (axis.type === 'category' || axis.type === 'time')
+                ? axis.scale.getLabel(Math.round(value))
+                // param of toFixed should less then 20.
+                : value.toFixed(Math.min(labelPrecision, 20));
+
+        return isFunction$1(labelFormatter)
+            ? labelFormatter(value, valueStr)
+            : isString(labelFormatter)
+            ? labelFormatter.replace('{value}', valueStr)
+            : valueStr;
+    },
+
+    /**
+     * @private
+     * @param {boolean} showOrHide true: show, false: hide
+     */
+    _showDataInfo: function (showOrHide) {
+        // Always show when drgging.
+        showOrHide = this._dragging || showOrHide;
+
+        var handleLabels = this._displayables.handleLabels;
+        handleLabels[0].attr('invisible', !showOrHide);
+        handleLabels[1].attr('invisible', !showOrHide);
+    },
+
+    _onDragMove: function (handleIndex, dx, dy) {
+        this._dragging = true;
+
+        // Transform dx, dy to bar coordination.
+        var barTransform = this._displayables.barGroup.getLocalTransform();
+        var vertex = applyTransform$1([dx, dy], barTransform, true);
+
+        var changed = this._updateInterval(handleIndex, vertex[0]);
+
+        var realtime = this.dataZoomModel.get('realtime');
+
+        this._updateView(!realtime);
+
+        // Avoid dispatch dataZoom repeatly but range not changed,
+        // which cause bad visual effect when progressive enabled.
+        changed && realtime && this._dispatchZoomAction();
+    },
+
+    _onDragEnd: function () {
+        this._dragging = false;
+        this._showDataInfo(false);
+
+        // While in realtime mode and stream mode, dispatch action when
+        // drag end will cause the whole view rerender, which is unnecessary.
+        var realtime = this.dataZoomModel.get('realtime');
+        !realtime && this._dispatchZoomAction();
+    },
+
+    _onClickPanelClick: function (e) {
+        var size = this._size;
+        var localPoint = this._displayables.barGroup.transformCoordToLocal(e.offsetX, e.offsetY);
+
+        if (localPoint[0] < 0 || localPoint[0] > size[0]
+            || localPoint[1] < 0 || localPoint[1] > size[1]
+        ) {
+            return;
+        }
+
+        var handleEnds = this._handleEnds;
+        var center = (handleEnds[0] + handleEnds[1]) / 2;
+
+        var changed = this._updateInterval('all', localPoint[0] - center);
+        this._updateView();
+        changed && this._dispatchZoomAction();
+    },
+
+    /**
+     * This action will be throttled.
+     * @private
+     */
+    _dispatchZoomAction: function () {
+        var range = this._range;
+
+        this.api.dispatchAction({
+            type: 'dataZoom',
+            from: this.uid,
+            dataZoomId: this.dataZoomModel.id,
+            start: range[0],
+            end: range[1]
+        });
+    },
+
+    /**
+     * @private
+     */
+    _findCoordRect: function () {
+        // Find the grid coresponding to the first axis referred by dataZoom.
+        var rect;
+        each$23(this.getTargetCoordInfo(), function (coordInfoList) {
+            if (!rect && coordInfoList.length) {
+                var coordSys = coordInfoList[0].model.coordinateSystem;
+                rect = coordSys.getRect && coordSys.getRect();
+            }
+        });
+        if (!rect) {
+            var width = this.api.getWidth();
+            var height = this.api.getHeight();
+            rect = {
+                x: width * 0.2,
+                y: height * 0.2,
+                width: width * 0.6,
+                height: height * 0.6
+            };
+        }
+
+        return rect;
+    }
+
+});
+
+function getOtherDim(thisDim) {
+    // FIXME
+    // 这个逻辑和getOtherAxis里一致，但是写在这里是否不好
+    var map$$1 = {x: 'y', y: 'x', radius: 'angle', angle: 'radius'};
+    return map$$1[thisDim];
+}
+
+function getCursor(orient) {
+    return orient === 'vertical' ? 'ns-resize' : 'ew-resize';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+DataZoomModel.extend({
+
+    type: 'dataZoom.inside',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        disabled: false,   // Whether disable this inside zoom.
+        zoomLock: false,   // Whether disable zoom but only pan.
+        zoomOnMouseWheel: true, // Can be: true / false / 'shift' / 'ctrl' / 'alt'.
+        moveOnMouseMove: true,   // Can be: true / false / 'shift' / 'ctrl' / 'alt'.
+        preventDefaultMouseMove: true
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Only create one roam controller for each coordinate system.
+// one roam controller might be refered by two inside data zoom
+// components (for example, one for x and one for y). When user
+// pan or zoom, only dispatch one action for those data zoom
+// components.
+
+var curry$6 = curry;
+
+var ATTR$1 = '\0_ec_dataZoom_roams';
+
+
+/**
+ * @public
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Object} dataZoomInfo
+ * @param {string} dataZoomInfo.coordId
+ * @param {Function} dataZoomInfo.containsPoint
+ * @param {Array.<string>} dataZoomInfo.allCoordIds
+ * @param {string} dataZoomInfo.dataZoomId
+ * @param {number} dataZoomInfo.throttleRate
+ * @param {Function} dataZoomInfo.panGetRange
+ * @param {Function} dataZoomInfo.zoomGetRange
+ * @param {boolean} [dataZoomInfo.zoomLock]
+ * @param {boolean} [dataZoomInfo.disabled]
+ */
+function register$2(api, dataZoomInfo) {
+    var store = giveStore(api);
+    var theDataZoomId = dataZoomInfo.dataZoomId;
+    var theCoordId = dataZoomInfo.coordId;
+
+    // Do clean when a dataZoom changes its target coordnate system.
+    // Avoid memory leak, dispose all not-used-registered.
+    each$1(store, function (record, coordId) {
+        var dataZoomInfos = record.dataZoomInfos;
+        if (dataZoomInfos[theDataZoomId]
+            && indexOf(dataZoomInfo.allCoordIds, theCoordId) < 0
+        ) {
+            delete dataZoomInfos[theDataZoomId];
+            record.count--;
+        }
+    });
+
+    cleanStore(store);
+
+    var record = store[theCoordId];
+    // Create if needed.
+    if (!record) {
+        record = store[theCoordId] = {
+            coordId: theCoordId,
+            dataZoomInfos: {},
+            count: 0
+        };
+        record.controller = createController(api, record);
+        record.dispatchAction = curry(dispatchAction$1, api);
+    }
+
+    // Update reference of dataZoom.
+    !(record.dataZoomInfos[theDataZoomId]) && record.count++;
+    record.dataZoomInfos[theDataZoomId] = dataZoomInfo;
+
+    var controllerParams = mergeControllerParams(record.dataZoomInfos);
+    record.controller.enable(controllerParams.controlType, controllerParams.opt);
+
+    // Consider resize, area should be always updated.
+    record.controller.setPointerChecker(dataZoomInfo.containsPoint);
+
+    // Update throttle.
+    createOrUpdate(
+        record,
+        'dispatchAction',
+        dataZoomInfo.throttleRate,
+        'fixRate'
+    );
+}
+
+/**
+ * @public
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {string} dataZoomId
+ */
+function unregister$1(api, dataZoomId) {
+    var store = giveStore(api);
+
+    each$1(store, function (record) {
+        record.controller.dispose();
+        var dataZoomInfos = record.dataZoomInfos;
+        if (dataZoomInfos[dataZoomId]) {
+            delete dataZoomInfos[dataZoomId];
+            record.count--;
+        }
+    });
+
+    cleanStore(store);
+}
+
+/**
+ * @public
+ */
+function generateCoordId(coordModel) {
+    return coordModel.type + '\0_' + coordModel.id;
+}
+
+/**
+ * Key: coordId, value: {dataZoomInfos: [], count, controller}
+ * @type {Array.<Object>}
+ */
+function giveStore(api) {
+    // Mount store on zrender instance, so that we do not
+    // need to worry about dispose.
+    var zr = api.getZr();
+    return zr[ATTR$1] || (zr[ATTR$1] = {});
+}
+
+function createController(api, newRecord) {
+    var controller = new RoamController(api.getZr());
+    controller.on('pan', curry$6(onPan, newRecord));
+    controller.on('zoom', curry$6(onZoom, newRecord));
+
+    return controller;
+}
+
+function cleanStore(store) {
+    each$1(store, function (record, coordId) {
+        if (!record.count) {
+            record.controller.dispose();
+            delete store[coordId];
+        }
+    });
+}
+
+function onPan(record, dx, dy, oldX, oldY, newX, newY) {
+    wrapAndDispatch(record, function (info) {
+        return info.panGetRange(record.controller, dx, dy, oldX, oldY, newX, newY);
+    });
+}
+
+function onZoom(record, scale, mouseX, mouseY) {
+    wrapAndDispatch(record, function (info) {
+        return info.zoomGetRange(record.controller, scale, mouseX, mouseY);
+    });
+}
+
+function wrapAndDispatch(record, getRange) {
+    var batch = [];
+
+    each$1(record.dataZoomInfos, function (info) {
+        var range = getRange(info);
+        !info.disabled && range && batch.push({
+            dataZoomId: info.dataZoomId,
+            start: range[0],
+            end: range[1]
+        });
+    });
+
+    batch.length && record.dispatchAction(batch);
+}
+
+/**
+ * This action will be throttled.
+ */
+function dispatchAction$1(api, batch) {
+    api.dispatchAction({
+        type: 'dataZoom',
+        batch: batch
+    });
+}
+
+/**
+ * Merge roamController settings when multiple dataZooms share one roamController.
+ */
+function mergeControllerParams(dataZoomInfos) {
+    var controlType;
+    var opt = {};
+    // DO NOT use reserved word (true, false, undefined) as key literally. Even if encapsulated
+    // as string, it is probably revert to reserved word by compress tool. See #7411.
+    var prefix = 'type_';
+    var typePriority = {
+        'type_true': 2,
+        'type_move': 1,
+        'type_false': 0,
+        'type_undefined': -1
+    };
+    each$1(dataZoomInfos, function (dataZoomInfo) {
+        var oneType = dataZoomInfo.disabled ? false : dataZoomInfo.zoomLock ? 'move' : true;
+        if (typePriority[prefix + oneType] > typePriority[prefix + controlType]) {
+            controlType = oneType;
+        }
+        // Do not support that different 'shift'/'ctrl'/'alt' setting used in one coord sys.
+        extend(opt, dataZoomInfo.roamControllerOpt);
+    });
+
+    return {
+        controlType: controlType,
+        opt: opt
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$5 = bind;
+
+var InsideZoomView = DataZoomView.extend({
+
+    type: 'dataZoom.inside',
+
+    /**
+     * @override
+     */
+    init: function (ecModel, api) {
+        /**
+         * 'throttle' is used in this.dispatchAction, so we save range
+         * to avoid missing some 'pan' info.
+         * @private
+         * @type {Array.<number>}
+         */
+        this._range;
+    },
+
+    /**
+     * @override
+     */
+    render: function (dataZoomModel, ecModel, api, payload) {
+        InsideZoomView.superApply(this, 'render', arguments);
+
+        // Hance the `throttle` util ensures to preserve command order,
+        // here simply updating range all the time will not cause missing
+        // any of the the roam change.
+        this._range = dataZoomModel.getPercentRange();
+
+        // Reset controllers.
+        each$1(this.getTargetCoordInfo(), function (coordInfoList, coordSysName) {
+
+            var allCoordIds = map(coordInfoList, function (coordInfo) {
+                return generateCoordId(coordInfo.model);
+            });
+
+            each$1(coordInfoList, function (coordInfo) {
+                var coordModel = coordInfo.model;
+                var dataZoomOption = dataZoomModel.option;
+
+                register$2(
+                    api,
+                    {
+                        coordId: generateCoordId(coordModel),
+                        allCoordIds: allCoordIds,
+                        containsPoint: function (e, x, y) {
+                            return coordModel.coordinateSystem.containPoint([x, y]);
+                        },
+                        dataZoomId: dataZoomModel.id,
+                        throttleRate: dataZoomModel.get('throttle', true),
+                        panGetRange: bind$5(this._onPan, this, coordInfo, coordSysName),
+                        zoomGetRange: bind$5(this._onZoom, this, coordInfo, coordSysName),
+                        zoomLock: dataZoomOption.zoomLock,
+                        disabled: dataZoomOption.disabled,
+                        roamControllerOpt: {
+                            zoomOnMouseWheel: dataZoomOption.zoomOnMouseWheel,
+                            moveOnMouseMove: dataZoomOption.moveOnMouseMove,
+                            preventDefaultMouseMove: dataZoomOption.preventDefaultMouseMove
+                        }
+                    }
+                );
+            }, this);
+
+        }, this);
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        unregister$1(this.api, this.dataZoomModel.id);
+        InsideZoomView.superApply(this, 'dispose', arguments);
+        this._range = null;
+    },
+
+    /**
+     * @private
+     */
+    _onPan: function (coordInfo, coordSysName, controller, dx, dy, oldX, oldY, newX, newY) {
+        var lastRange = this._range;
+        var range = lastRange.slice();
+
+        // Calculate transform by the first axis.
+        var axisModel = coordInfo.axisModels[0];
+        if (!axisModel) {
+            return;
+        }
+
+        var directionInfo = getDirectionInfo[coordSysName](
+            [oldX, oldY], [newX, newY], axisModel, controller, coordInfo
+        );
+
+        var percentDelta = directionInfo.signal
+            * (range[1] - range[0])
+            * directionInfo.pixel / directionInfo.pixelLength;
+
+        sliderMove(percentDelta, range, [0, 100], 'all');
+
+        this._range = range;
+
+        if (lastRange[0] !== range[0] || lastRange[1] !== range[1]) {
+            return range;
+        }
+    },
+
+    /**
+     * @private
+     */
+    _onZoom: function (coordInfo, coordSysName, controller, scale, mouseX, mouseY) {
+        var lastRange = this._range;
+        var range = lastRange.slice();
+
+        // Calculate transform by the first axis.
+        var axisModel = coordInfo.axisModels[0];
+        if (!axisModel) {
+            return;
+        }
+
+        var directionInfo = getDirectionInfo[coordSysName](
+            null, [mouseX, mouseY], axisModel, controller, coordInfo
+        );
+        var percentPoint = (
+            directionInfo.signal > 0
+                ? (directionInfo.pixelStart + directionInfo.pixelLength - directionInfo.pixel)
+                : (directionInfo.pixel - directionInfo.pixelStart)
+            ) / directionInfo.pixelLength * (range[1] - range[0]) + range[0];
+
+        scale = Math.max(1 / scale, 0);
+        range[0] = (range[0] - percentPoint) * scale + percentPoint;
+        range[1] = (range[1] - percentPoint) * scale + percentPoint;
+
+        // Restrict range.
+        var minMaxSpan = this.dataZoomModel.findRepresentativeAxisProxy().getMinMaxSpan();
+
+        sliderMove(0, range, [0, 100], 0, minMaxSpan.minSpan, minMaxSpan.maxSpan);
+
+        this._range = range;
+
+        if (lastRange[0] !== range[0] || lastRange[1] !== range[1]) {
+            return range;
+        }
+    }
+
+});
+
+var getDirectionInfo = {
+
+    grid: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
+        var axis = axisModel.axis;
+        var ret = {};
+        var rect = coordInfo.model.coordinateSystem.getRect();
+        oldPoint = oldPoint || [0, 0];
+
+        if (axis.dim === 'x') {
+            ret.pixel = newPoint[0] - oldPoint[0];
+            ret.pixelLength = rect.width;
+            ret.pixelStart = rect.x;
+            ret.signal = axis.inverse ? 1 : -1;
+        }
+        else { // axis.dim === 'y'
+            ret.pixel = newPoint[1] - oldPoint[1];
+            ret.pixelLength = rect.height;
+            ret.pixelStart = rect.y;
+            ret.signal = axis.inverse ? -1 : 1;
+        }
+
+        return ret;
+    },
+
+    polar: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
+        var axis = axisModel.axis;
+        var ret = {};
+        var polar = coordInfo.model.coordinateSystem;
+        var radiusExtent = polar.getRadiusAxis().getExtent();
+        var angleExtent = polar.getAngleAxis().getExtent();
+
+        oldPoint = oldPoint ? polar.pointToCoord(oldPoint) : [0, 0];
+        newPoint = polar.pointToCoord(newPoint);
+
+        if (axisModel.mainType === 'radiusAxis') {
+            ret.pixel = newPoint[0] - oldPoint[0];
+            // ret.pixelLength = Math.abs(radiusExtent[1] - radiusExtent[0]);
+            // ret.pixelStart = Math.min(radiusExtent[0], radiusExtent[1]);
+            ret.pixelLength = radiusExtent[1] - radiusExtent[0];
+            ret.pixelStart = radiusExtent[0];
+            ret.signal = axis.inverse ? 1 : -1;
+        }
+        else { // 'angleAxis'
+            ret.pixel = newPoint[1] - oldPoint[1];
+            // ret.pixelLength = Math.abs(angleExtent[1] - angleExtent[0]);
+            // ret.pixelStart = Math.min(angleExtent[0], angleExtent[1]);
+            ret.pixelLength = angleExtent[1] - angleExtent[0];
+            ret.pixelStart = angleExtent[0];
+            ret.signal = axis.inverse ? -1 : 1;
+        }
+
+        return ret;
+    },
+
+    singleAxis: function (oldPoint, newPoint, axisModel, controller, coordInfo) {
+        var axis = axisModel.axis;
+        var rect = coordInfo.model.coordinateSystem.getRect();
+        var ret = {};
+
+        oldPoint = oldPoint || [0, 0];
+
+        if (axis.orient === 'horizontal') {
+            ret.pixel = newPoint[0] - oldPoint[0];
+            ret.pixelLength = rect.width;
+            ret.pixelStart = rect.x;
+            ret.signal = axis.inverse ? 1 : -1;
+        }
+        else { // 'vertical'
+            ret.pixel = newPoint[1] - oldPoint[1];
+            ret.pixelLength = rect.height;
+            ret.pixelStart = rect.y;
+            ret.signal = axis.inverse ? -1 : 1;
+        }
+
+        return ret;
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerProcessor({
+
+    // `dataZoomProcessor` will only be performed in needed series. Consider if
+    // there is a line series and a pie series, it is better not to update the
+    // line series if only pie series is needed to be updated.
+    getTargetSeries: function (ecModel) {
+        var seriesModelMap = createHashMap();
+
+        ecModel.eachComponent('dataZoom', function (dataZoomModel) {
+            dataZoomModel.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel) {
+                var axisProxy = dataZoomModel.getAxisProxy(dimNames.name, axisIndex);
+                each$1(axisProxy.getTargetSeriesModels(), function (seriesModel) {
+                    seriesModelMap.set(seriesModel.uid, seriesModel);
+                });
+            });
+        });
+
+        return seriesModelMap;
+    },
+
+    modifyOutputEnd: true,
+
+    // Consider appendData, where filter should be performed. Because data process is
+    // in block mode currently, it is not need to worry about that the overallProgress
+    // execute every frame.
+    overallReset: function (ecModel, api) {
+
+        ecModel.eachComponent('dataZoom', function (dataZoomModel) {
+            // We calculate window and reset axis here but not in model
+            // init stage and not after action dispatch handler, because
+            // reset should be called after seriesData.restoreData.
+            dataZoomModel.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel) {
+                dataZoomModel.getAxisProxy(dimNames.name, axisIndex).reset(dataZoomModel, api);
+            });
+
+            // Caution: data zoom filtering is order sensitive when using
+            // percent range and no min/max/scale set on axis.
+            // For example, we have dataZoom definition:
+            // [
+            //      {xAxisIndex: 0, start: 30, end: 70},
+            //      {yAxisIndex: 0, start: 20, end: 80}
+            // ]
+            // In this case, [20, 80] of y-dataZoom should be based on data
+            // that have filtered by x-dataZoom using range of [30, 70],
+            // but should not be based on full raw data. Thus sliding
+            // x-dataZoom will change both ranges of xAxis and yAxis,
+            // while sliding y-dataZoom will only change the range of yAxis.
+            // So we should filter x-axis after reset x-axis immediately,
+            // and then reset y-axis and filter y-axis.
+            dataZoomModel.eachTargetAxis(function (dimNames, axisIndex, dataZoomModel) {
+                dataZoomModel.getAxisProxy(dimNames.name, axisIndex).filterData(dataZoomModel, api);
+            });
+        });
+
+        ecModel.eachComponent('dataZoom', function (dataZoomModel) {
+            // Fullfill all of the range props so that user
+            // is able to get them from chart.getOption().
+            var axisProxy = dataZoomModel.findRepresentativeAxisProxy();
+            var percentRange = axisProxy.getDataPercentWindow();
+            var valueRange = axisProxy.getDataValueWindow();
+
+            dataZoomModel.setRawRange({
+                start: percentRange[0],
+                end: percentRange[1],
+                startValue: valueRange[0],
+                endValue: valueRange[1]
+            }, true);
+        });
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction('dataZoom', function (payload, ecModel) {
+
+    var linkedNodesFinder = createLinkedNodesFinder(
+        bind(ecModel.eachComponent, ecModel, 'dataZoom'),
+        eachAxisDim$1,
+        function (model, dimNames) {
+            return model.get(dimNames.axisIndex);
+        }
+    );
+
+    var effectedModels = [];
+
+    ecModel.eachComponent(
+        {mainType: 'dataZoom', query: payload},
+        function (model, index) {
+            effectedModels.push.apply(
+                effectedModels, linkedNodesFinder(model).nodes
+            );
+        }
+    );
+
+    each$1(effectedModels, function (dataZoomModel, index) {
+        dataZoomModel.setRawRange({
+            start: payload.start,
+            end: payload.end,
+            startValue: payload.startValue,
+            endValue: payload.endValue
+        });
+    });
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$24 = each$1;
+
+var preprocessor$2 = function (option) {
+    var visualMap = option && option.visualMap;
+
+    if (!isArray(visualMap)) {
+        visualMap = visualMap ? [visualMap] : [];
+    }
+
+    each$24(visualMap, function (opt) {
+        if (!opt) {
+            return;
+        }
+
+        // rename splitList to pieces
+        if (has$1(opt, 'splitList') && !has$1(opt, 'pieces')) {
+            opt.pieces = opt.splitList;
+            delete opt.splitList;
+        }
+
+        var pieces = opt.pieces;
+        if (pieces && isArray(pieces)) {
+            each$24(pieces, function (piece) {
+                if (isObject$1(piece)) {
+                    if (has$1(piece, 'start') && !has$1(piece, 'min')) {
+                        piece.min = piece.start;
+                    }
+                    if (has$1(piece, 'end') && !has$1(piece, 'max')) {
+                        piece.max = piece.end;
+                    }
+                }
+            });
+        }
+    });
+};
+
+function has$1(obj, name) {
+    return obj && obj.hasOwnProperty && obj.hasOwnProperty(name);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.registerSubTypeDefaulter('visualMap', function (option) {
+    // Compatible with ec2, when splitNumber === 0, continuous visualMap will be used.
+    return (
+            !option.categories
+            && (
+                !(
+                    option.pieces
+                        ? option.pieces.length > 0
+                        : option.splitNumber > 0
+                )
+                || option.calculable
+            )
+        )
+        ? 'continuous' : 'piecewise';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var VISUAL_PRIORITY = PRIORITY.VISUAL.COMPONENT;
+
+registerVisual(VISUAL_PRIORITY, {
+    createOnAllSeries: true,
+    reset: function (seriesModel, ecModel) {
+        var resetDefines = [];
+        ecModel.eachComponent('visualMap', function (visualMapModel) {
+            var pipelineContext = seriesModel.pipelineContext;
+            if (!visualMapModel.isTargetSeries(seriesModel)
+                || (pipelineContext && pipelineContext.large)
+            ) {
+                return;
+            }
+
+            resetDefines.push(incrementalApplyVisual(
+                visualMapModel.stateList,
+                visualMapModel.targetVisuals,
+                bind(visualMapModel.getValueState, visualMapModel),
+                visualMapModel.getDataDimension(seriesModel.getData())
+            ));
+        });
+
+        return resetDefines;
+    }
+});
+
+// Only support color.
+registerVisual(VISUAL_PRIORITY, {
+    createOnAllSeries: true,
+    reset: function (seriesModel, ecModel) {
+        var data = seriesModel.getData();
+        var visualMetaList = [];
+
+        ecModel.eachComponent('visualMap', function (visualMapModel) {
+            if (visualMapModel.isTargetSeries(seriesModel)) {
+                var visualMeta = visualMapModel.getVisualMeta(
+                    bind(getColorVisual, null, seriesModel, visualMapModel)
+                ) || {stops: [], outerColors: []};
+
+                var concreteDim = visualMapModel.getDataDimension(data);
+                var dimInfo = data.getDimensionInfo(concreteDim);
+                if (dimInfo != null) {
+                    // visualMeta.dimension should be dimension index, but not concrete dimension.
+                    visualMeta.dimension = dimInfo.index;
+                    visualMetaList.push(visualMeta);
+                }
+            }
+        });
+
+        // console.log(JSON.stringify(visualMetaList.map(a => a.stops)));
+        seriesModel.getData().setVisual('visualMeta', visualMetaList);
+    }
+});
+
+// FIXME
+// performance and export for heatmap?
+// value can be Infinity or -Infinity
+function getColorVisual(seriesModel, visualMapModel, value, valueState) {
+    var mappings = visualMapModel.targetVisuals[valueState];
+    var visualTypes = VisualMapping.prepareVisualTypes(mappings);
+    var resultVisual = {
+        color: seriesModel.getData().getVisual('color') // default color.
+    };
+
+    for (var i = 0, len = visualTypes.length; i < len; i++) {
+        var type = visualTypes[i];
+        var mapping = mappings[
+            type === 'opacity' ? '__alphaForOpacity' : type
+        ];
+        mapping && mapping.applyVisual(value, getVisual, setVisual);
+    }
+
+    return resultVisual.color;
+
+    function getVisual(key) {
+        return resultVisual[key];
+    }
+
+    function setVisual(key, value) {
+        resultVisual[key] = value;
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @file Visual mapping.
+ */
+
+var visualDefault = {
+
+    /**
+     * @public
+     */
+    get: function (visualType, key, isCategory) {
+        var value = clone(
+            (defaultOption$3[visualType] || {})[key]
+        );
+
+        return isCategory
+            ? (isArray(value) ? value[value.length - 1] : value)
+            : value;
+    }
+
+};
+
+var defaultOption$3 = {
+
+    color: {
+        active: ['#006edd', '#e0ffff'],
+        inactive: ['rgba(0,0,0,0)']
+    },
+
+    colorHue: {
+        active: [0, 360],
+        inactive: [0, 0]
+    },
+
+    colorSaturation: {
+        active: [0.3, 1],
+        inactive: [0, 0]
+    },
+
+    colorLightness: {
+        active: [0.9, 0.5],
+        inactive: [0, 0]
+    },
+
+    colorAlpha: {
+        active: [0.3, 1],
+        inactive: [0, 0]
+    },
+
+    opacity: {
+        active: [0.3, 1],
+        inactive: [0, 0]
+    },
+
+    symbol: {
+        active: ['circle', 'roundRect', 'diamond'],
+        inactive: ['none']
+    },
+
+    symbolSize: {
+        active: [10, 50],
+        inactive: [0, 0]
+    }
+};
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var mapVisual$2 = VisualMapping.mapVisual;
+var eachVisual = VisualMapping.eachVisual;
+var isArray$3 = isArray;
+var each$25 = each$1;
+var asc$3 = asc;
+var linearMap$2 = linearMap;
+var noop$2 = noop;
+
+var VisualMapModel = extendComponentModel({
+
+    type: 'visualMap',
+
+    dependencies: ['series'],
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    stateList: ['inRange', 'outOfRange'],
+
+    /**
+     * @readOnly
+     * @type {Array.<string>}
+     */
+    replacableOptionKeys: [
+        'inRange', 'outOfRange', 'target', 'controller', 'color'
+    ],
+
+    /**
+     * [lowerBound, upperBound]
+     *
+     * @readOnly
+     * @type {Array.<number>}
+     */
+    dataBound: [-Infinity, Infinity],
+
+    /**
+     * @readOnly
+     * @type {string|Object}
+     */
+    layoutMode: {type: 'box', ignoreSize: true},
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        show: true,
+
+        zlevel: 0,
+        z: 4,
+
+        seriesIndex: 'all',     // 'all' or null/undefined: all series.
+                                // A number or an array of number: the specified series.
+
+                                // set min: 0, max: 200, only for campatible with ec2.
+                                // In fact min max should not have default value.
+        min: 0,                 // min value, must specified if pieces is not specified.
+        max: 200,               // max value, must specified if pieces is not specified.
+
+        dimension: null,
+        inRange: null,          // 'color', 'colorHue', 'colorSaturation', 'colorLightness', 'colorAlpha',
+                                // 'symbol', 'symbolSize'
+        outOfRange: null,       // 'color', 'colorHue', 'colorSaturation',
+                                // 'colorLightness', 'colorAlpha',
+                                // 'symbol', 'symbolSize'
+
+        left: 0,                // 'center' ¦ 'left' ¦ 'right' ¦ {number} (px)
+        right: null,            // The same as left.
+        top: null,              // 'top' ¦ 'bottom' ¦ 'center' ¦ {number} (px)
+        bottom: 0,              // The same as top.
+
+        itemWidth: null,
+        itemHeight: null,
+        inverse: false,
+        orient: 'vertical',        // 'horizontal' ¦ 'vertical'
+
+        backgroundColor: 'rgba(0,0,0,0)',
+        borderColor: '#ccc',       // 值域边框颜色
+        contentColor: '#5793f3',
+        inactiveColor: '#aaa',
+        borderWidth: 0,            // 值域边框线宽，单位px，默认为0（无边框）
+        padding: 5,                // 值域内边距，单位px，默认各方向内边距为5，
+                                    // 接受数组分别设定上右下左边距，同css
+        textGap: 10,               //
+        precision: 0,              // 小数精度，默认为0，无小数点
+        color: null,               //颜色（deprecated，兼容ec2，顺序同pieces，不同于inRange/outOfRange）
+
+        formatter: null,
+        text: null,                // 文本，如['高', '低']，兼容ec2，text[0]对应高值，text[1]对应低值
+        textStyle: {
+            color: '#333'          // 值域文字颜色
+        }
+    },
+
+    /**
+     * @protected
+     */
+    init: function (option, parentModel, ecModel) {
+
+        /**
+         * @private
+         * @type {Array.<number>}
+         */
+        this._dataExtent;
+
+        /**
+         * @readOnly
+         */
+        this.targetVisuals = {};
+
+        /**
+         * @readOnly
+         */
+        this.controllerVisuals = {};
+
+        /**
+         * @readOnly
+         */
+        this.textStyleModel;
+
+        /**
+         * [width, height]
+         * @readOnly
+         * @type {Array.<number>}
+         */
+        this.itemSize;
+
+        this.mergeDefaultAndTheme(option, ecModel);
+    },
+
+    /**
+     * @protected
+     */
+    optionUpdated: function (newOption, isInit) {
+        var thisOption = this.option;
+
+        // FIXME
+        // necessary?
+        // Disable realtime view update if canvas is not supported.
+        if (!env$1.canvasSupported) {
+            thisOption.realtime = false;
+        }
+
+        !isInit && replaceVisualOption(
+            thisOption, newOption, this.replacableOptionKeys
+        );
+
+        this.textStyleModel = this.getModel('textStyle');
+
+        this.resetItemSize();
+
+        this.completeVisualOption();
+    },
+
+    /**
+     * @protected
+     */
+    resetVisual: function (supplementVisualOption) {
+        var stateList = this.stateList;
+        supplementVisualOption = bind(supplementVisualOption, this);
+
+        this.controllerVisuals = createVisualMappings(
+            this.option.controller, stateList, supplementVisualOption
+        );
+        this.targetVisuals = createVisualMappings(
+            this.option.target, stateList, supplementVisualOption
+        );
+    },
+
+    /**
+     * @protected
+     * @return {Array.<number>} An array of series indices.
+     */
+    getTargetSeriesIndices: function () {
+        var optionSeriesIndex = this.option.seriesIndex;
+        var seriesIndices = [];
+
+        if (optionSeriesIndex == null || optionSeriesIndex === 'all') {
+            this.ecModel.eachSeries(function (seriesModel, index) {
+                seriesIndices.push(index);
+            });
+        }
+        else {
+            seriesIndices = normalizeToArray(optionSeriesIndex);
+        }
+
+        return seriesIndices;
+    },
+
+    /**
+     * @public
+     */
+    eachTargetSeries: function (callback, context) {
+        each$1(this.getTargetSeriesIndices(), function (seriesIndex) {
+            callback.call(context, this.ecModel.getSeriesByIndex(seriesIndex));
+        }, this);
+    },
+
+    /**
+     * @pubilc
+     */
+    isTargetSeries: function (seriesModel) {
+        var is = false;
+        this.eachTargetSeries(function (model) {
+            model === seriesModel && (is = true);
+        });
+        return is;
+    },
+
+    /**
+     * @example
+     * this.formatValueText(someVal); // format single numeric value to text.
+     * this.formatValueText(someVal, true); // format single category value to text.
+     * this.formatValueText([min, max]); // format numeric min-max to text.
+     * this.formatValueText([this.dataBound[0], max]); // using data lower bound.
+     * this.formatValueText([min, this.dataBound[1]]); // using data upper bound.
+     *
+     * @param {number|Array.<number>} value Real value, or this.dataBound[0 or 1].
+     * @param {boolean} [isCategory=false] Only available when value is number.
+     * @param {Array.<string>} edgeSymbols Open-close symbol when value is interval.
+     * @return {string}
+     * @protected
+     */
+    formatValueText: function(value, isCategory, edgeSymbols) {
+        var option = this.option;
+        var precision = option.precision;
+        var dataBound = this.dataBound;
+        var formatter = option.formatter;
+        var isMinMax;
+        var textValue;
+        edgeSymbols = edgeSymbols || ['<', '>'];
+
+        if (isArray(value)) {
+            value = value.slice();
+            isMinMax = true;
+        }
+
+        textValue = isCategory
+            ? value
+            : (isMinMax
+                ? [toFixed(value[0]), toFixed(value[1])]
+                : toFixed(value)
+            );
+
+        if (isString(formatter)) {
+            return formatter
+                .replace('{value}', isMinMax ? textValue[0] : textValue)
+                .replace('{value2}', isMinMax ? textValue[1] : textValue);
+        }
+        else if (isFunction$1(formatter)) {
+            return isMinMax
+                ? formatter(value[0], value[1])
+                : formatter(value);
+        }
+
+        if (isMinMax) {
+            if (value[0] === dataBound[0]) {
+                return edgeSymbols[0] + ' ' + textValue[1];
+            }
+            else if (value[1] === dataBound[1]) {
+                return edgeSymbols[1] + ' ' + textValue[0];
+            }
+            else {
+                return textValue[0] + ' - ' + textValue[1];
+            }
+        }
+        else { // Format single value (includes category case).
+            return textValue;
+        }
+
+        function toFixed(val) {
+            return val === dataBound[0]
+                ? 'min'
+                : val === dataBound[1]
+                ? 'max'
+                : (+val).toFixed(Math.min(precision, 20));
+        }
+    },
+
+    /**
+     * @protected
+     */
+    resetExtent: function () {
+        var thisOption = this.option;
+
+        // Can not calculate data extent by data here.
+        // Because series and data may be modified in processing stage.
+        // So we do not support the feature "auto min/max".
+
+        var extent = asc$3([thisOption.min, thisOption.max]);
+
+        this._dataExtent = extent;
+    },
+
+    /**
+     * @public
+     * @param {module:echarts/data/List} list
+     * @return {string} Concrete dimention. If return null/undefined,
+     *                  no dimension used.
+     */
+    getDataDimension: function (list) {
+        var optDim = this.option.dimension;
+        var listDimensions = list.dimensions;
+        if (optDim == null && !listDimensions.length) {
+            return;
+        }
+
+        if (optDim != null) {
+            return list.getDimension(optDim);
+        }
+
+        var dimNames = list.dimensions;
+        for (var i = dimNames.length - 1; i >= 0; i--) {
+            var dimName = dimNames[i];
+            var dimInfo = list.getDimensionInfo(dimName);
+            if (!dimInfo.isCalculationCoord) {
+                return dimName;
+            }
+        }
+    },
+
+    /**
+     * @public
+     * @override
+     */
+    getExtent: function () {
+        return this._dataExtent.slice();
+    },
+
+    /**
+     * @protected
+     */
+    completeVisualOption: function () {
+        var ecModel = this.ecModel;
+        var thisOption = this.option;
+        var base = {inRange: thisOption.inRange, outOfRange: thisOption.outOfRange};
+
+        var target = thisOption.target || (thisOption.target = {});
+        var controller = thisOption.controller || (thisOption.controller = {});
+
+        merge(target, base); // Do not override
+        merge(controller, base); // Do not override
+
+        var isCategory = this.isCategory();
+
+        completeSingle.call(this, target);
+        completeSingle.call(this, controller);
+        completeInactive.call(this, target, 'inRange', 'outOfRange');
+        // completeInactive.call(this, target, 'outOfRange', 'inRange');
+        completeController.call(this, controller);
+
+        function completeSingle(base) {
+            // Compatible with ec2 dataRange.color.
+            // The mapping order of dataRange.color is: [high value, ..., low value]
+            // whereas inRange.color and outOfRange.color is [low value, ..., high value]
+            // Notice: ec2 has no inverse.
+            if (isArray$3(thisOption.color)
+                // If there has been inRange: {symbol: ...}, adding color is a mistake.
+                // So adding color only when no inRange defined.
+                && !base.inRange
+            ) {
+                base.inRange = {color: thisOption.color.slice().reverse()};
+            }
+
+            // Compatible with previous logic, always give a defautl color, otherwise
+            // simple config with no inRange and outOfRange will not work.
+            // Originally we use visualMap.color as the default color, but setOption at
+            // the second time the default color will be erased. So we change to use
+            // constant DEFAULT_COLOR.
+            // If user do not want the defualt color, set inRange: {color: null}.
+            base.inRange = base.inRange || {color: ecModel.get('gradientColor')};
+
+            // If using shortcut like: {inRange: 'symbol'}, complete default value.
+            each$25(this.stateList, function (state) {
+                var visualType = base[state];
+
+                if (isString(visualType)) {
+                    var defa = visualDefault.get(visualType, 'active', isCategory);
+                    if (defa) {
+                        base[state] = {};
+                        base[state][visualType] = defa;
+                    }
+                    else {
+                        // Mark as not specified.
+                        delete base[state];
+                    }
+                }
+            }, this);
+        }
+
+        function completeInactive(base, stateExist, stateAbsent) {
+            var optExist = base[stateExist];
+            var optAbsent = base[stateAbsent];
+
+            if (optExist && !optAbsent) {
+                optAbsent = base[stateAbsent] = {};
+                each$25(optExist, function (visualData, visualType) {
+                    if (!VisualMapping.isValidType(visualType)) {
+                        return;
+                    }
+
+                    var defa = visualDefault.get(visualType, 'inactive', isCategory);
+
+                    if (defa != null) {
+                        optAbsent[visualType] = defa;
+
+                        // Compatibable with ec2:
+                        // Only inactive color to rgba(0,0,0,0) can not
+                        // make label transparent, so use opacity also.
+                        if (visualType === 'color'
+                            && !optAbsent.hasOwnProperty('opacity')
+                            && !optAbsent.hasOwnProperty('colorAlpha')
+                        ) {
+                            optAbsent.opacity = [0, 0];
+                        }
+                    }
+                });
+            }
+        }
+
+        function completeController(controller) {
+            var symbolExists = (controller.inRange || {}).symbol
+                || (controller.outOfRange || {}).symbol;
+            var symbolSizeExists = (controller.inRange || {}).symbolSize
+                || (controller.outOfRange || {}).symbolSize;
+            var inactiveColor = this.get('inactiveColor');
+
+            each$25(this.stateList, function (state) {
+
+                var itemSize = this.itemSize;
+                var visuals = controller[state];
+
+                // Set inactive color for controller if no other color
+                // attr (like colorAlpha) specified.
+                if (!visuals) {
+                    visuals = controller[state] = {
+                        color: isCategory ? inactiveColor : [inactiveColor]
+                    };
+                }
+
+                // Consistent symbol and symbolSize if not specified.
+                if (visuals.symbol == null) {
+                    visuals.symbol = symbolExists
+                        && clone(symbolExists)
+                        || (isCategory ? 'roundRect' : ['roundRect']);
+                }
+                if (visuals.symbolSize == null) {
+                    visuals.symbolSize = symbolSizeExists
+                        && clone(symbolSizeExists)
+                        || (isCategory ? itemSize[0] : [itemSize[0], itemSize[0]]);
+                }
+
+                // Filter square and none.
+                visuals.symbol = mapVisual$2(visuals.symbol, function (symbol) {
+                    return (symbol === 'none' || symbol === 'square') ? 'roundRect' : symbol;
+                });
+
+                // Normalize symbolSize
+                var symbolSize = visuals.symbolSize;
+
+                if (symbolSize != null) {
+                    var max = -Infinity;
+                    // symbolSize can be object when categories defined.
+                    eachVisual(symbolSize, function (value) {
+                        value > max && (max = value);
+                    });
+                    visuals.symbolSize = mapVisual$2(symbolSize, function (value) {
+                        return linearMap$2(value, [0, max], [0, itemSize[0]], true);
+                    });
+                }
+
+            }, this);
+        }
+    },
+
+    /**
+     * @protected
+     */
+    resetItemSize: function () {
+        this.itemSize = [
+            parseFloat(this.get('itemWidth')),
+            parseFloat(this.get('itemHeight'))
+        ];
+    },
+
+    /**
+     * @public
+     */
+    isCategory: function () {
+        return !!this.option.categories;
+    },
+
+    /**
+     * @public
+     * @abstract
+     */
+    setSelected: noop$2,
+
+    /**
+     * @public
+     * @abstract
+     * @param {*|module:echarts/data/List} valueOrData
+     * @param {number} dataIndex
+     * @return {string} state See this.stateList
+     */
+    getValueState: noop$2,
+
+    /**
+     * FIXME
+     * Do not publish to thirt-part-dev temporarily
+     * util the interface is stable. (Should it return
+     * a function but not visual meta?)
+     *
+     * @pubilc
+     * @abstract
+     * @param {Function} getColorVisual
+     *        params: value, valueState
+     *        return: color
+     * @return {Object} visualMeta
+     *        should includes {stops, outerColors}
+     *        outerColor means [colorBeyondMinValue, colorBeyondMaxValue]
+     */
+    getVisualMeta: noop$2
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Constant
+var DEFAULT_BAR_BOUND = [20, 140];
+
+var ContinuousModel = VisualMapModel.extend({
+
+    type: 'visualMap.continuous',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        align: 'auto',          // 'auto', 'left', 'right', 'top', 'bottom'
+        calculable: false,      // This prop effect default component type determine,
+                                // See echarts/component/visualMap/typeDefaulter.
+        range: null,            // selected range. In default case `range` is [min, max]
+                                // and can auto change along with modification of min max,
+                                // util use specifid a range.
+        realtime: true,         // Whether realtime update.
+        itemHeight: null,       // The length of the range control edge.
+        itemWidth: null,        // The length of the other side.
+        hoverLink: true,        // Enable hover highlight.
+        hoverLinkDataSize: null,// The size of hovered data.
+        hoverLinkOnHandle: null // Whether trigger hoverLink when hover handle.
+                                // If not specified, follow the value of `realtime`.
+    },
+
+    /**
+     * @override
+     */
+    optionUpdated: function (newOption, isInit) {
+        ContinuousModel.superApply(this, 'optionUpdated', arguments);
+
+        this.resetExtent();
+
+        this.resetVisual(function (mappingOption) {
+            mappingOption.mappingMethod = 'linear';
+            mappingOption.dataExtent = this.getExtent();
+        });
+
+        this._resetRange();
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    resetItemSize: function () {
+        ContinuousModel.superApply(this, 'resetItemSize', arguments);
+
+        var itemSize = this.itemSize;
+
+        this._orient === 'horizontal' && itemSize.reverse();
+
+        (itemSize[0] == null || isNaN(itemSize[0])) && (itemSize[0] = DEFAULT_BAR_BOUND[0]);
+        (itemSize[1] == null || isNaN(itemSize[1])) && (itemSize[1] = DEFAULT_BAR_BOUND[1]);
+    },
+
+    /**
+     * @private
+     */
+    _resetRange: function () {
+        var dataExtent = this.getExtent();
+        var range = this.option.range;
+
+        if (!range || range.auto) {
+            // `range` should always be array (so we dont use other
+            // value like 'auto') for user-friend. (consider getOption).
+            dataExtent.auto = 1;
+            this.option.range = dataExtent;
+        }
+        else if (isArray(range)) {
+            if (range[0] > range[1]) {
+                range.reverse();
+            }
+            range[0] = Math.max(range[0], dataExtent[0]);
+            range[1] = Math.min(range[1], dataExtent[1]);
+        }
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    completeVisualOption: function () {
+        VisualMapModel.prototype.completeVisualOption.apply(this, arguments);
+
+        each$1(this.stateList, function (state) {
+            var symbolSize = this.option.controller[state].symbolSize;
+            if (symbolSize && symbolSize[0] !== symbolSize[1]) {
+                symbolSize[0] = 0; // For good looking.
+            }
+        }, this);
+    },
+
+    /**
+     * @override
+     */
+    setSelected: function (selected) {
+        this.option.range = selected.slice();
+        this._resetRange();
+    },
+
+    /**
+     * @public
+     */
+    getSelected: function () {
+        var dataExtent = this.getExtent();
+
+        var dataInterval = asc(
+            (this.get('range') || []).slice()
+        );
+
+        // Clamp
+        dataInterval[0] > dataExtent[1] && (dataInterval[0] = dataExtent[1]);
+        dataInterval[1] > dataExtent[1] && (dataInterval[1] = dataExtent[1]);
+        dataInterval[0] < dataExtent[0] && (dataInterval[0] = dataExtent[0]);
+        dataInterval[1] < dataExtent[0] && (dataInterval[1] = dataExtent[0]);
+
+        return dataInterval;
+    },
+
+    /**
+     * @override
+     */
+    getValueState: function (value) {
+        var range = this.option.range;
+        var dataExtent = this.getExtent();
+
+        // When range[0] === dataExtent[0], any value larger than dataExtent[0] maps to 'inRange'.
+        // range[1] is processed likewise.
+        return (
+            (range[0] <= dataExtent[0] || range[0] <= value)
+            && (range[1] >= dataExtent[1] || value <= range[1])
+        ) ? 'inRange' : 'outOfRange';
+    },
+
+    /**
+     * @params {Array.<number>} range target value: range[0] <= value && value <= range[1]
+     * @return {Array.<Object>} [{seriesId, dataIndices: <Array.<number>>}, ...]
+     */
+    findTargetDataIndices: function (range) {
+        var result = [];
+
+        this.eachTargetSeries(function (seriesModel) {
+            var dataIndices = [];
+            var data = seriesModel.getData();
+
+            data.each(this.getDataDimension(data), function (value, dataIndex) {
+                range[0] <= value && value <= range[1] && dataIndices.push(dataIndex);
+            }, this);
+
+            result.push({seriesId: seriesModel.id, dataIndex: dataIndices});
+        }, this);
+
+        return result;
+    },
+
+    /**
+     * @implement
+     */
+    getVisualMeta: function (getColorVisual) {
+        var oVals = getColorStopValues(this, 'outOfRange', this.getExtent());
+        var iVals = getColorStopValues(this, 'inRange', this.option.range.slice());
+        var stops = [];
+
+        function setStop(value, valueState) {
+            stops.push({
+                value: value,
+                color: getColorVisual(value, valueState)
+            });
+        }
+
+        // Format to: outOfRange -- inRange -- outOfRange.
+        var iIdx = 0;
+        var oIdx = 0;
+        var iLen = iVals.length;
+        var oLen = oVals.length;
+
+        for (; oIdx < oLen && (!iVals.length || oVals[oIdx] <= iVals[0]); oIdx++) {
+            // If oVal[oIdx] === iVals[iIdx], oVal[oIdx] should be ignored.
+            if (oVals[oIdx] < iVals[iIdx]) {
+                setStop(oVals[oIdx], 'outOfRange');
+            }
+        }
+        for (var first = 1; iIdx < iLen; iIdx++, first = 0) {
+            // If range is full, value beyond min, max will be clamped.
+            // make a singularity
+            first && stops.length && setStop(iVals[iIdx], 'outOfRange');
+            setStop(iVals[iIdx], 'inRange');
+        }
+        for (var first = 1; oIdx < oLen; oIdx++) {
+            if (!iVals.length || iVals[iVals.length - 1] < oVals[oIdx]) {
+                // make a singularity
+                if (first) {
+                    stops.length && setStop(stops[stops.length - 1].value, 'outOfRange');
+                    first = 0;
+                }
+                setStop(oVals[oIdx], 'outOfRange');
+            }
+        }
+
+        var stopsLen = stops.length;
+
+        return {
+            stops: stops,
+            outerColors: [
+                stopsLen ? stops[0].color : 'transparent',
+                stopsLen ? stops[stopsLen - 1].color : 'transparent'
+            ]
+        };
+    }
+
+});
+
+function getColorStopValues(visualMapModel, valueState, dataExtent) {
+    if (dataExtent[0] === dataExtent[1]) {
+        return dataExtent.slice();
+    }
+
+    // When using colorHue mapping, it is not linear color any more.
+    // Moreover, canvas gradient seems not to be accurate linear.
+    // FIXME
+    // Should be arbitrary value 100? or based on pixel size?
+    var count = 200;
+    var step = (dataExtent[1] - dataExtent[0]) / count;
+
+    var value = dataExtent[0];
+    var stopValues = [];
+    for (var i = 0; i <= count && value < dataExtent[1]; i++) {
+        stopValues.push(value);
+        value += step;
+    }
+    stopValues.push(dataExtent[1]);
+
+    return stopValues;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var VisualMapView = extendComponentView({
+
+    type: 'visualMap',
+
+    /**
+     * @readOnly
+     * @type {Object}
+     */
+    autoPositionValues: {left: 1, right: 1, top: 1, bottom: 1},
+
+    init: function (ecModel, api) {
+        /**
+         * @readOnly
+         * @type {module:echarts/model/Global}
+         */
+        this.ecModel = ecModel;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/ExtensionAPI}
+         */
+        this.api = api;
+
+        /**
+         * @readOnly
+         * @type {module:echarts/component/visualMap/visualMapModel}
+         */
+        this.visualMapModel;
+    },
+
+    /**
+     * @protected
+     */
+    render: function (visualMapModel, ecModel, api, payload) {
+        this.visualMapModel = visualMapModel;
+
+        if (visualMapModel.get('show') === false) {
+            this.group.removeAll();
+            return;
+        }
+
+        this.doRender.apply(this, arguments);
+    },
+
+    /**
+     * @protected
+     */
+    renderBackground: function (group) {
+        var visualMapModel = this.visualMapModel;
+        var padding = normalizeCssArray$1(visualMapModel.get('padding') || 0);
+        var rect = group.getBoundingRect();
+
+        group.add(new Rect({
+            z2: -1, // Lay background rect on the lowest layer.
+            silent: true,
+            shape: {
+                x: rect.x - padding[3],
+                y: rect.y - padding[0],
+                width: rect.width + padding[3] + padding[1],
+                height: rect.height + padding[0] + padding[2]
+            },
+            style: {
+                fill: visualMapModel.get('backgroundColor'),
+                stroke: visualMapModel.get('borderColor'),
+                lineWidth: visualMapModel.get('borderWidth')
+            }
+        }));
+    },
+
+    /**
+     * @protected
+     * @param {number} targetValue can be Infinity or -Infinity
+     * @param {string=} visualCluster Only can be 'color' 'opacity' 'symbol' 'symbolSize'
+     * @param {Object} [opts]
+     * @param {string=} [opts.forceState] Specify state, instead of using getValueState method.
+     * @param {string=} [opts.convertOpacityToAlpha=false] For color gradient in controller widget.
+     * @return {*} Visual value.
+     */
+    getControllerVisual: function (targetValue, visualCluster, opts) {
+        opts = opts || {};
+
+        var forceState = opts.forceState;
+        var visualMapModel = this.visualMapModel;
+        var visualObj = {};
+
+        // Default values.
+        if (visualCluster === 'symbol') {
+            visualObj.symbol = visualMapModel.get('itemSymbol');
+        }
+        if (visualCluster === 'color') {
+            var defaultColor = visualMapModel.get('contentColor');
+            visualObj.color = defaultColor;
+        }
+
+        function getter(key) {
+            return visualObj[key];
+        }
+
+        function setter(key, value) {
+            visualObj[key] = value;
+        }
+
+        var mappings = visualMapModel.controllerVisuals[
+            forceState || visualMapModel.getValueState(targetValue)
+        ];
+        var visualTypes = VisualMapping.prepareVisualTypes(mappings);
+
+        each$1(visualTypes, function (type) {
+            var visualMapping = mappings[type];
+            if (opts.convertOpacityToAlpha && type === 'opacity') {
+                type = 'colorAlpha';
+                visualMapping = mappings.__alphaForOpacity;
+            }
+            if (VisualMapping.dependsOn(type, visualCluster)) {
+                visualMapping && visualMapping.applyVisual(
+                    targetValue, getter, setter
+                );
+            }
+        });
+
+        return visualObj[visualCluster];
+    },
+
+    /**
+     * @protected
+     */
+    positionGroup: function (group) {
+        var model = this.visualMapModel;
+        var api = this.api;
+
+        positionElement(
+            group,
+            model.getBoxLayoutParams(),
+            {width: api.getWidth(), height: api.getHeight()}
+        );
+    },
+
+    /**
+     * @protected
+     * @abstract
+     */
+    doRender: noop
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * @param {module:echarts/component/visualMap/VisualMapModel} visualMapModel\
+ * @param {module:echarts/ExtensionAPI} api
+ * @param {Array.<number>} itemSize always [short, long]
+ * @return {string} 'left' or 'right' or 'top' or 'bottom'
+ */
+function getItemAlign(visualMapModel, api, itemSize) {
+    var modelOption = visualMapModel.option;
+    var itemAlign = modelOption.align;
+
+    if (itemAlign != null && itemAlign !== 'auto') {
+        return itemAlign;
+    }
+
+    // Auto decision align.
+    var ecSize = {width: api.getWidth(), height: api.getHeight()};
+    var realIndex = modelOption.orient === 'horizontal' ? 1 : 0;
+
+    var paramsSet = [
+        ['left', 'right', 'width'],
+        ['top', 'bottom', 'height']
+    ];
+    var reals = paramsSet[realIndex];
+    var fakeValue = [0, null, 10];
+
+    var layoutInput = {};
+    for (var i = 0; i < 3; i++) {
+        layoutInput[paramsSet[1 - realIndex][i]] = fakeValue[i];
+        layoutInput[reals[i]] = i === 2 ? itemSize[0] : modelOption[reals[i]];
+    }
+
+    var rParam = [['x', 'width', 3], ['y', 'height', 0]][realIndex];
+    var rect = getLayoutRect(layoutInput, ecSize, modelOption.padding);
+
+    return reals[
+        (rect.margin[rParam[2]] || 0) + rect[rParam[0]] + rect[rParam[1]] * 0.5
+            < ecSize[rParam[1]] * 0.5 ? 0 : 1
+    ];
+}
+
+/**
+ * Prepare dataIndex for outside usage, where dataIndex means rawIndex, and
+ * dataIndexInside means filtered index.
+ */
+function convertDataIndex(batch) {
+    each$1(batch || [], function (batchItem) {
+        if (batch.dataIndex != null) {
+            batch.dataIndexInside = batch.dataIndex;
+            batch.dataIndex = null;
+        }
+    });
+    return batch;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var linearMap$3 = linearMap;
+var each$26 = each$1;
+var mathMin$7 = Math.min;
+var mathMax$7 = Math.max;
+
+// Arbitrary value
+var HOVER_LINK_SIZE = 12;
+var HOVER_LINK_OUT = 6;
+
+// Notice:
+// Any "interval" should be by the order of [low, high].
+// "handle0" (handleIndex === 0) maps to
+// low data value: this._dataInterval[0] and has low coord.
+// "handle1" (handleIndex === 1) maps to
+// high data value: this._dataInterval[1] and has high coord.
+// The logic of transform is implemented in this._createBarGroup.
+
+var ContinuousView = VisualMapView.extend({
+
+    type: 'visualMap.continuous',
+
+    /**
+     * @override
+     */
+    init: function () {
+
+        ContinuousView.superApply(this, 'init', arguments);
+
+        /**
+         * @private
+         */
+        this._shapes = {};
+
+        /**
+         * @private
+         */
+        this._dataInterval = [];
+
+        /**
+         * @private
+         */
+        this._handleEnds = [];
+
+        /**
+         * @private
+         */
+        this._orient;
+
+        /**
+         * @private
+         */
+        this._useHandle;
+
+        /**
+         * @private
+         */
+        this._hoverLinkDataIndices = [];
+
+        /**
+         * @private
+         */
+        this._dragging;
+
+        /**
+         * @private
+         */
+        this._hovering;
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    doRender: function (visualMapModel, ecModel, api, payload) {
+        if (!payload || payload.type !== 'selectDataRange' || payload.from !== this.uid) {
+            this._buildView();
+        }
+    },
+
+    /**
+     * @private
+     */
+    _buildView: function () {
+        this.group.removeAll();
+
+        var visualMapModel = this.visualMapModel;
+        var thisGroup = this.group;
+
+        this._orient = visualMapModel.get('orient');
+        this._useHandle = visualMapModel.get('calculable');
+
+        this._resetInterval();
+
+        this._renderBar(thisGroup);
+
+        var dataRangeText = visualMapModel.get('text');
+        this._renderEndsText(thisGroup, dataRangeText, 0);
+        this._renderEndsText(thisGroup, dataRangeText, 1);
+
+        // Do this for background size calculation.
+        this._updateView(true);
+
+        // After updating view, inner shapes is built completely,
+        // and then background can be rendered.
+        this.renderBackground(thisGroup);
+
+        // Real update view
+        this._updateView();
+
+        this._enableHoverLinkToSeries();
+        this._enableHoverLinkFromSeries();
+
+        this.positionGroup(thisGroup);
+    },
+
+    /**
+     * @private
+     */
+    _renderEndsText: function (group, dataRangeText, endsIndex) {
+        if (!dataRangeText) {
+            return;
+        }
+
+        // Compatible with ec2, text[0] map to high value, text[1] map low value.
+        var text = dataRangeText[1 - endsIndex];
+        text = text != null ? text + '' : '';
+
+        var visualMapModel = this.visualMapModel;
+        var textGap = visualMapModel.get('textGap');
+        var itemSize = visualMapModel.itemSize;
+
+        var barGroup = this._shapes.barGroup;
+        var position = this._applyTransform(
+            [
+                itemSize[0] / 2,
+                endsIndex === 0 ? -textGap : itemSize[1] + textGap
+            ],
+            barGroup
+        );
+        var align = this._applyTransform(
+            endsIndex === 0 ? 'bottom' : 'top',
+            barGroup
+        );
+        var orient = this._orient;
+        var textStyleModel = this.visualMapModel.textStyleModel;
+
+        this.group.add(new Text({
+            style: {
+                x: position[0],
+                y: position[1],
+                textVerticalAlign: orient === 'horizontal' ? 'middle' : align,
+                textAlign: orient === 'horizontal' ? align : 'center',
+                text: text,
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        }));
+    },
+
+    /**
+     * @private
+     */
+    _renderBar: function (targetGroup) {
+        var visualMapModel = this.visualMapModel;
+        var shapes = this._shapes;
+        var itemSize = visualMapModel.itemSize;
+        var orient = this._orient;
+        var useHandle = this._useHandle;
+        var itemAlign = getItemAlign(visualMapModel, this.api, itemSize);
+        var barGroup = shapes.barGroup = this._createBarGroup(itemAlign);
+
+        // Bar
+        barGroup.add(shapes.outOfRange = createPolygon());
+        barGroup.add(shapes.inRange = createPolygon(
+            null,
+            useHandle ? getCursor$1(this._orient) : null,
+            bind(this._dragHandle, this, 'all', false),
+            bind(this._dragHandle, this, 'all', true)
+        ));
+
+        var textRect = visualMapModel.textStyleModel.getTextRect('国');
+        var textSize = mathMax$7(textRect.width, textRect.height);
+
+        // Handle
+        if (useHandle) {
+            shapes.handleThumbs = [];
+            shapes.handleLabels = [];
+            shapes.handleLabelPoints = [];
+
+            this._createHandle(barGroup, 0, itemSize, textSize, orient, itemAlign);
+            this._createHandle(barGroup, 1, itemSize, textSize, orient, itemAlign);
+        }
+
+        this._createIndicator(barGroup, itemSize, textSize, orient);
+
+        targetGroup.add(barGroup);
+    },
+
+    /**
+     * @private
+     */
+    _createHandle: function (barGroup, handleIndex, itemSize, textSize, orient) {
+        var onDrift = bind(this._dragHandle, this, handleIndex, false);
+        var onDragEnd = bind(this._dragHandle, this, handleIndex, true);
+        var handleThumb = createPolygon(
+            createHandlePoints(handleIndex, textSize),
+            getCursor$1(this._orient),
+            onDrift,
+            onDragEnd
+        );
+        handleThumb.position[0] = itemSize[0];
+        barGroup.add(handleThumb);
+
+        // Text is always horizontal layout but should not be effected by
+        // transform (orient/inverse). So label is built separately but not
+        // use zrender/graphic/helper/RectText, and is located based on view
+        // group (according to handleLabelPoint) but not barGroup.
+        var textStyleModel = this.visualMapModel.textStyleModel;
+        var handleLabel = new Text({
+            draggable: true,
+            drift: onDrift,
+            onmousemove: function (e) {
+                // Fot mobile devicem, prevent screen slider on the button.
+                stop(e.event);
+            },
+            ondragend: onDragEnd,
+            style: {
+                x: 0, y: 0, text: '',
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        });
+        this.group.add(handleLabel);
+
+        var handleLabelPoint = [
+            orient === 'horizontal'
+                ? textSize / 2
+                : textSize * 1.5,
+            orient === 'horizontal'
+                ? (handleIndex === 0 ? -(textSize * 1.5) : (textSize * 1.5))
+                : (handleIndex === 0 ? -textSize / 2 : textSize / 2)
+        ];
+
+        var shapes = this._shapes;
+        shapes.handleThumbs[handleIndex] = handleThumb;
+        shapes.handleLabelPoints[handleIndex] = handleLabelPoint;
+        shapes.handleLabels[handleIndex] = handleLabel;
+    },
+
+    /**
+     * @private
+     */
+    _createIndicator: function (barGroup, itemSize, textSize, orient) {
+        var indicator = createPolygon([[0, 0]], 'move');
+        indicator.position[0] = itemSize[0];
+        indicator.attr({invisible: true, silent: true});
+        barGroup.add(indicator);
+
+        var textStyleModel = this.visualMapModel.textStyleModel;
+        var indicatorLabel = new Text({
+            silent: true,
+            invisible: true,
+            style: {
+                x: 0, y: 0, text: '',
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        });
+        this.group.add(indicatorLabel);
+
+        var indicatorLabelPoint = [
+            orient === 'horizontal' ? textSize / 2 : HOVER_LINK_OUT + 3,
+            0
+        ];
+
+        var shapes = this._shapes;
+        shapes.indicator = indicator;
+        shapes.indicatorLabel = indicatorLabel;
+        shapes.indicatorLabelPoint = indicatorLabelPoint;
+    },
+
+    /**
+     * @private
+     */
+    _dragHandle: function (handleIndex, isEnd, dx, dy) {
+        if (!this._useHandle) {
+            return;
+        }
+
+        this._dragging = !isEnd;
+
+        if (!isEnd) {
+            // Transform dx, dy to bar coordination.
+            var vertex = this._applyTransform([dx, dy], this._shapes.barGroup, true);
+            this._updateInterval(handleIndex, vertex[1]);
+
+            // Considering realtime, update view should be executed
+            // before dispatch action.
+            this._updateView();
+        }
+
+        // dragEnd do not dispatch action when realtime.
+        if (isEnd === !this.visualMapModel.get('realtime')) { // jshint ignore:line
+            this.api.dispatchAction({
+                type: 'selectDataRange',
+                from: this.uid,
+                visualMapId: this.visualMapModel.id,
+                selected: this._dataInterval.slice()
+            });
+        }
+
+        if (isEnd) {
+            !this._hovering && this._clearHoverLinkToSeries();
+        }
+        else if (useHoverLinkOnHandle(this.visualMapModel)) {
+            this._doHoverLinkToSeries(this._handleEnds[handleIndex], false);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _resetInterval: function () {
+        var visualMapModel = this.visualMapModel;
+
+        var dataInterval = this._dataInterval = visualMapModel.getSelected();
+        var dataExtent = visualMapModel.getExtent();
+        var sizeExtent = [0, visualMapModel.itemSize[1]];
+
+        this._handleEnds = [
+            linearMap$3(dataInterval[0], dataExtent, sizeExtent, true),
+            linearMap$3(dataInterval[1], dataExtent, sizeExtent, true)
+        ];
+    },
+
+    /**
+     * @private
+     * @param {(number|string)} handleIndex 0 or 1 or 'all'
+     * @param {number} dx
+     * @param {number} dy
+     */
+    _updateInterval: function (handleIndex, delta) {
+        delta = delta || 0;
+        var visualMapModel = this.visualMapModel;
+        var handleEnds = this._handleEnds;
+        var sizeExtent = [0, visualMapModel.itemSize[1]];
+
+        sliderMove(
+            delta,
+            handleEnds,
+            sizeExtent,
+            handleIndex,
+            // cross is forbiden
+            0
+        );
+
+        var dataExtent = visualMapModel.getExtent();
+        // Update data interval.
+        this._dataInterval = [
+            linearMap$3(handleEnds[0], sizeExtent, dataExtent, true),
+            linearMap$3(handleEnds[1], sizeExtent, dataExtent, true)
+        ];
+    },
+
+    /**
+     * @private
+     */
+    _updateView: function (forSketch) {
+        var visualMapModel = this.visualMapModel;
+        var dataExtent = visualMapModel.getExtent();
+        var shapes = this._shapes;
+
+        var outOfRangeHandleEnds = [0, visualMapModel.itemSize[1]];
+        var inRangeHandleEnds = forSketch ? outOfRangeHandleEnds : this._handleEnds;
+
+        var visualInRange = this._createBarVisual(
+            this._dataInterval, dataExtent, inRangeHandleEnds, 'inRange'
+        );
+        var visualOutOfRange = this._createBarVisual(
+            dataExtent, dataExtent, outOfRangeHandleEnds, 'outOfRange'
+        );
+
+        shapes.inRange
+            .setStyle({
+                fill: visualInRange.barColor,
+                opacity: visualInRange.opacity
+            })
+            .setShape('points', visualInRange.barPoints);
+        shapes.outOfRange
+            .setStyle({
+                fill: visualOutOfRange.barColor,
+                opacity: visualOutOfRange.opacity
+            })
+            .setShape('points', visualOutOfRange.barPoints);
+
+        this._updateHandle(inRangeHandleEnds, visualInRange);
+    },
+
+    /**
+     * @private
+     */
+    _createBarVisual: function (dataInterval, dataExtent, handleEnds, forceState) {
+        var opts = {
+            forceState: forceState,
+            convertOpacityToAlpha: true
+        };
+        var colorStops = this._makeColorGradient(dataInterval, opts);
+
+        var symbolSizes = [
+            this.getControllerVisual(dataInterval[0], 'symbolSize', opts),
+            this.getControllerVisual(dataInterval[1], 'symbolSize', opts)
+        ];
+        var barPoints = this._createBarPoints(handleEnds, symbolSizes);
+
+        return {
+            barColor: new LinearGradient(0, 0, 0, 1, colorStops),
+            barPoints: barPoints,
+            handlesColor: [
+                colorStops[0].color,
+                colorStops[colorStops.length - 1].color
+            ]
+        };
+    },
+
+    /**
+     * @private
+     */
+    _makeColorGradient: function (dataInterval, opts) {
+        // Considering colorHue, which is not linear, so we have to sample
+        // to calculate gradient color stops, but not only caculate head
+        // and tail.
+        var sampleNumber = 100; // Arbitrary value.
+        var colorStops = [];
+        var step = (dataInterval[1] - dataInterval[0]) / sampleNumber;
+
+        colorStops.push({
+            color: this.getControllerVisual(dataInterval[0], 'color', opts),
+            offset: 0
+        });
+
+        for (var i = 1; i < sampleNumber; i++) {
+            var currValue = dataInterval[0] + step * i;
+            if (currValue > dataInterval[1]) {
+                break;
+            }
+            colorStops.push({
+                color: this.getControllerVisual(currValue, 'color', opts),
+                offset: i / sampleNumber
+            });
+        }
+
+        colorStops.push({
+            color: this.getControllerVisual(dataInterval[1], 'color', opts),
+            offset: 1
+        });
+
+        return colorStops;
+    },
+
+    /**
+     * @private
+     */
+    _createBarPoints: function (handleEnds, symbolSizes) {
+        var itemSize = this.visualMapModel.itemSize;
+
+        return [
+            [itemSize[0] - symbolSizes[0], handleEnds[0]],
+            [itemSize[0], handleEnds[0]],
+            [itemSize[0], handleEnds[1]],
+            [itemSize[0] - symbolSizes[1], handleEnds[1]]
+        ];
+    },
+
+    /**
+     * @private
+     */
+    _createBarGroup: function (itemAlign) {
+        var orient = this._orient;
+        var inverse = this.visualMapModel.get('inverse');
+
+        return new Group(
+            (orient === 'horizontal' && !inverse)
+            ? {scale: itemAlign === 'bottom' ? [1, 1] : [-1, 1], rotation: Math.PI / 2}
+            : (orient === 'horizontal' && inverse)
+            ? {scale: itemAlign === 'bottom' ? [-1, 1] : [1, 1], rotation: -Math.PI / 2}
+            : (orient === 'vertical' && !inverse)
+            ? {scale: itemAlign === 'left' ? [1, -1] : [-1, -1]}
+            : {scale: itemAlign === 'left' ? [1, 1] : [-1, 1]}
+        );
+    },
+
+    /**
+     * @private
+     */
+    _updateHandle: function (handleEnds, visualInRange) {
+        if (!this._useHandle) {
+            return;
+        }
+
+        var shapes = this._shapes;
+        var visualMapModel = this.visualMapModel;
+        var handleThumbs = shapes.handleThumbs;
+        var handleLabels = shapes.handleLabels;
+
+        each$26([0, 1], function (handleIndex) {
+            var handleThumb = handleThumbs[handleIndex];
+            handleThumb.setStyle('fill', visualInRange.handlesColor[handleIndex]);
+            handleThumb.position[1] = handleEnds[handleIndex];
+
+            // Update handle label position.
+            var textPoint = applyTransform$1(
+                shapes.handleLabelPoints[handleIndex],
+                getTransform(handleThumb, this.group)
+            );
+            handleLabels[handleIndex].setStyle({
+                x: textPoint[0],
+                y: textPoint[1],
+                text: visualMapModel.formatValueText(this._dataInterval[handleIndex]),
+                textVerticalAlign: 'middle',
+                textAlign: this._applyTransform(
+                    this._orient === 'horizontal'
+                        ? (handleIndex === 0 ? 'bottom' : 'top')
+                        : 'left',
+                    shapes.barGroup
+                )
+            });
+        }, this);
+    },
+
+    /**
+     * @private
+     * @param {number} cursorValue
+     * @param {number} textValue
+     * @param {string} [rangeSymbol]
+     * @param {number} [halfHoverLinkSize]
+     */
+    _showIndicator: function (cursorValue, textValue, rangeSymbol, halfHoverLinkSize) {
+        var visualMapModel = this.visualMapModel;
+        var dataExtent = visualMapModel.getExtent();
+        var itemSize = visualMapModel.itemSize;
+        var sizeExtent = [0, itemSize[1]];
+        var pos = linearMap$3(cursorValue, dataExtent, sizeExtent, true);
+
+        var shapes = this._shapes;
+        var indicator = shapes.indicator;
+        if (!indicator) {
+            return;
+        }
+
+        indicator.position[1] = pos;
+        indicator.attr('invisible', false);
+        indicator.setShape('points', createIndicatorPoints(
+            !!rangeSymbol, halfHoverLinkSize, pos, itemSize[1]
+        ));
+
+        var opts = {convertOpacityToAlpha: true};
+        var color = this.getControllerVisual(cursorValue, 'color', opts);
+        indicator.setStyle('fill', color);
+
+        // Update handle label position.
+        var textPoint = applyTransform$1(
+            shapes.indicatorLabelPoint,
+            getTransform(indicator, this.group)
+        );
+
+        var indicatorLabel = shapes.indicatorLabel;
+        indicatorLabel.attr('invisible', false);
+        var align = this._applyTransform('left', shapes.barGroup);
+        var orient = this._orient;
+        indicatorLabel.setStyle({
+            text: (rangeSymbol ? rangeSymbol : '') + visualMapModel.formatValueText(textValue),
+            textVerticalAlign: orient === 'horizontal' ? align : 'middle',
+            textAlign: orient === 'horizontal' ? 'center' : align,
+            x: textPoint[0],
+            y: textPoint[1]
+        });
+    },
+
+    /**
+     * @private
+     */
+    _enableHoverLinkToSeries: function () {
+        var self = this;
+        this._shapes.barGroup
+
+            .on('mousemove', function (e) {
+                self._hovering = true;
+
+                if (!self._dragging) {
+                    var itemSize = self.visualMapModel.itemSize;
+                    var pos = self._applyTransform(
+                        [e.offsetX, e.offsetY], self._shapes.barGroup, true, true
+                    );
+                    // For hover link show when hover handle, which might be
+                    // below or upper than sizeExtent.
+                    pos[1] = mathMin$7(mathMax$7(0, pos[1]), itemSize[1]);
+                    self._doHoverLinkToSeries(
+                        pos[1],
+                        0 <= pos[0] && pos[0] <= itemSize[0]
+                    );
+                }
+            })
+
+            .on('mouseout', function () {
+                // When mouse is out of handle, hoverLink still need
+                // to be displayed when realtime is set as false.
+                self._hovering = false;
+                !self._dragging && self._clearHoverLinkToSeries();
+            });
+    },
+
+    /**
+     * @private
+     */
+    _enableHoverLinkFromSeries: function () {
+        var zr = this.api.getZr();
+
+        if (this.visualMapModel.option.hoverLink) {
+            zr.on('mouseover', this._hoverLinkFromSeriesMouseOver, this);
+            zr.on('mouseout', this._hideIndicator, this);
+        }
+        else {
+            this._clearHoverLinkFromSeries();
+        }
+    },
+
+    /**
+     * @private
+     */
+    _doHoverLinkToSeries: function (cursorPos, hoverOnBar) {
+        var visualMapModel = this.visualMapModel;
+        var itemSize = visualMapModel.itemSize;
+
+        if (!visualMapModel.option.hoverLink) {
+            return;
+        }
+
+        var sizeExtent = [0, itemSize[1]];
+        var dataExtent = visualMapModel.getExtent();
+
+        // For hover link show when hover handle, which might be below or upper than sizeExtent.
+        cursorPos = mathMin$7(mathMax$7(sizeExtent[0], cursorPos), sizeExtent[1]);
+
+        var halfHoverLinkSize = getHalfHoverLinkSize(visualMapModel, dataExtent, sizeExtent);
+        var hoverRange = [cursorPos - halfHoverLinkSize, cursorPos + halfHoverLinkSize];
+        var cursorValue = linearMap$3(cursorPos, sizeExtent, dataExtent, true);
+        var valueRange = [
+            linearMap$3(hoverRange[0], sizeExtent, dataExtent, true),
+            linearMap$3(hoverRange[1], sizeExtent, dataExtent, true)
+        ];
+        // Consider data range is out of visualMap range, see test/visualMap-continuous.html,
+        // where china and india has very large population.
+        hoverRange[0] < sizeExtent[0] && (valueRange[0] = -Infinity);
+        hoverRange[1] > sizeExtent[1] && (valueRange[1] = Infinity);
+
+        // Do not show indicator when mouse is over handle,
+        // otherwise labels overlap, especially when dragging.
+        if (hoverOnBar) {
+            if (valueRange[0] === -Infinity) {
+                this._showIndicator(cursorValue, valueRange[1], '< ', halfHoverLinkSize);
+            }
+            else if (valueRange[1] === Infinity) {
+                this._showIndicator(cursorValue, valueRange[0], '> ', halfHoverLinkSize);
+            }
+            else {
+                this._showIndicator(cursorValue, cursorValue, '≈ ', halfHoverLinkSize);
+            }
+        }
+
+        // When realtime is set as false, handles, which are in barGroup,
+        // also trigger hoverLink, which help user to realize where they
+        // focus on when dragging. (see test/heatmap-large.html)
+        // When realtime is set as true, highlight will not show when hover
+        // handle, because the label on handle, which displays a exact value
+        // but not range, might mislead users.
+        var oldBatch = this._hoverLinkDataIndices;
+        var newBatch = [];
+        if (hoverOnBar || useHoverLinkOnHandle(visualMapModel)) {
+            newBatch = this._hoverLinkDataIndices = visualMapModel.findTargetDataIndices(valueRange);
+        }
+
+        var resultBatches = compressBatches(oldBatch, newBatch);
+
+        this._dispatchHighDown('downplay', convertDataIndex(resultBatches[0]));
+        this._dispatchHighDown('highlight', convertDataIndex(resultBatches[1]));
+    },
+
+    /**
+     * @private
+     */
+    _hoverLinkFromSeriesMouseOver: function (e) {
+        var el = e.target;
+        var visualMapModel = this.visualMapModel;
+
+        if (!el || el.dataIndex == null) {
+            return;
+        }
+
+        var dataModel = this.ecModel.getSeriesByIndex(el.seriesIndex);
+
+        if (!visualMapModel.isTargetSeries(dataModel)) {
+            return;
+        }
+
+        var data = dataModel.getData(el.dataType);
+        var value = data.get(visualMapModel.getDataDimension(data), el.dataIndex, true);
+
+        if (!isNaN(value)) {
+            this._showIndicator(value, value);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _hideIndicator: function () {
+        var shapes = this._shapes;
+        shapes.indicator && shapes.indicator.attr('invisible', true);
+        shapes.indicatorLabel && shapes.indicatorLabel.attr('invisible', true);
+    },
+
+    /**
+     * @private
+     */
+    _clearHoverLinkToSeries: function () {
+        this._hideIndicator();
+
+        var indices = this._hoverLinkDataIndices;
+        this._dispatchHighDown('downplay', convertDataIndex(indices));
+
+        indices.length = 0;
+    },
+
+    /**
+     * @private
+     */
+    _clearHoverLinkFromSeries: function () {
+        this._hideIndicator();
+
+        var zr = this.api.getZr();
+        zr.off('mouseover', this._hoverLinkFromSeriesMouseOver);
+        zr.off('mouseout', this._hideIndicator);
+    },
+
+    /**
+     * @private
+     */
+    _applyTransform: function (vertex, element, inverse, global) {
+        var transform = getTransform(element, global ? null : this.group);
+
+        return graphic[
+            isArray(vertex) ? 'applyTransform' : 'transformDirection'
+        ](vertex, transform, inverse);
+    },
+
+    /**
+     * @private
+     */
+    _dispatchHighDown: function (type, batch) {
+        batch && batch.length && this.api.dispatchAction({
+            type: type,
+            batch: batch
+        });
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._clearHoverLinkFromSeries();
+        this._clearHoverLinkToSeries();
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._clearHoverLinkFromSeries();
+        this._clearHoverLinkToSeries();
+    }
+
+});
+
+function createPolygon(points, cursor, onDrift, onDragEnd) {
+    return new Polygon({
+        shape: {points: points},
+        draggable: !!onDrift,
+        cursor: cursor,
+        drift: onDrift,
+        onmousemove: function (e) {
+            // Fot mobile devicem, prevent screen slider on the button.
+            stop(e.event);
+        },
+        ondragend: onDragEnd
+    });
+}
+
+function createHandlePoints(handleIndex, textSize) {
+    return handleIndex === 0
+        ? [[0, 0], [textSize, 0], [textSize, -textSize]]
+        : [[0, 0], [textSize, 0], [textSize, textSize]];
+}
+
+function createIndicatorPoints(isRange, halfHoverLinkSize, pos, extentMax) {
+    return isRange
+        ? [ // indicate range
+            [0, -mathMin$7(halfHoverLinkSize, mathMax$7(pos, 0))],
+            [HOVER_LINK_OUT, 0],
+            [0, mathMin$7(halfHoverLinkSize, mathMax$7(extentMax - pos, 0))]
+        ]
+        : [ // indicate single value
+            [0, 0], [5, -5], [5, 5]
+        ];
+}
+
+function getHalfHoverLinkSize(visualMapModel, dataExtent, sizeExtent) {
+    var halfHoverLinkSize = HOVER_LINK_SIZE / 2;
+    var hoverLinkDataSize = visualMapModel.get('hoverLinkDataSize');
+    if (hoverLinkDataSize) {
+        halfHoverLinkSize = linearMap$3(hoverLinkDataSize, dataExtent, sizeExtent, true) / 2;
+    }
+    return halfHoverLinkSize;
+}
+
+function useHoverLinkOnHandle(visualMapModel) {
+    var hoverLinkOnHandle = visualMapModel.get('hoverLinkOnHandle');
+    return !!(hoverLinkOnHandle == null ? visualMapModel.get('realtime') : hoverLinkOnHandle);
+}
+
+function getCursor$1(orient) {
+    return orient === 'vertical' ? 'ns-resize' : 'ew-resize';
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var actionInfo$2 = {
+    type: 'selectDataRange',
+    event: 'dataRangeSelected',
+    // FIXME use updateView appears wrong
+    update: 'update'
+};
+
+registerAction(actionInfo$2, function (payload, ecModel) {
+
+    ecModel.eachComponent({mainType: 'visualMap', query: payload}, function (model) {
+        model.setSelected(payload.selected);
+    });
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+registerPreprocessor(preprocessor$2);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PiecewiseModel = VisualMapModel.extend({
+
+    type: 'visualMap.piecewise',
+
+    /**
+     * Order Rule:
+     *
+     * option.categories / option.pieces / option.text / option.selected:
+     *     If !option.inverse,
+     *     Order when vertical: ['top', ..., 'bottom'].
+     *     Order when horizontal: ['left', ..., 'right'].
+     *     If option.inverse, the meaning of
+     *     the order should be reversed.
+     *
+     * this._pieceList:
+     *     The order is always [low, ..., high].
+     *
+     * Mapping from location to low-high:
+     *     If !option.inverse
+     *     When vertical, top is high.
+     *     When horizontal, right is high.
+     *     If option.inverse, reverse.
+     */
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+        selected: null,             // Object. If not specified, means selected.
+                                    // When pieces and splitNumber: {'0': true, '5': true}
+                                    // When categories: {'cate1': false, 'cate3': true}
+                                    // When selected === false, means all unselected.
+
+        minOpen: false,             // Whether include values that smaller than `min`.
+        maxOpen: false,             // Whether include values that bigger than `max`.
+
+        align: 'auto',              // 'auto', 'left', 'right'
+        itemWidth: 20,              // When put the controller vertically, it is the length of
+                                    // horizontal side of each item. Otherwise, vertical side.
+        itemHeight: 14,             // When put the controller vertically, it is the length of
+                                    // vertical side of each item. Otherwise, horizontal side.
+        itemSymbol: 'roundRect',
+        pieceList: null,            // Each item is Object, with some of those attrs:
+                                    // {min, max, lt, gt, lte, gte, value,
+                                    // color, colorSaturation, colorAlpha, opacity,
+                                    // symbol, symbolSize}, which customize the range or visual
+                                    // coding of the certain piece. Besides, see "Order Rule".
+        categories: null,           // category names, like: ['some1', 'some2', 'some3'].
+                                    // Attr min/max are ignored when categories set. See "Order Rule"
+        splitNumber: 5,             // If set to 5, auto split five pieces equally.
+                                    // If set to 0 and component type not set, component type will be
+                                    // determined as "continuous". (It is less reasonable but for ec2
+                                    // compatibility, see echarts/component/visualMap/typeDefaulter)
+        selectedMode: 'multiple',   // Can be 'multiple' or 'single'.
+        itemGap: 10,                // The gap between two items, in px.
+        hoverLink: true,            // Enable hover highlight.
+
+        showLabel: null             // By default, when text is used, label will hide (the logic
+                                    // is remained for compatibility reason)
+    },
+
+    /**
+     * @override
+     */
+    optionUpdated: function (newOption, isInit) {
+        PiecewiseModel.superApply(this, 'optionUpdated', arguments);
+
+        /**
+         * The order is always [low, ..., high].
+         * [{text: string, interval: Array.<number>}, ...]
+         * @private
+         * @type {Array.<Object>}
+         */
+        this._pieceList = [];
+
+        this.resetExtent();
+
+        /**
+         * 'pieces', 'categories', 'splitNumber'
+         * @type {string}
+         */
+        var mode = this._mode = this._determineMode();
+
+        resetMethods[this._mode].call(this);
+
+        this._resetSelected(newOption, isInit);
+
+        var categories = this.option.categories;
+
+        this.resetVisual(function (mappingOption, state) {
+            if (mode === 'categories') {
+                mappingOption.mappingMethod = 'category';
+                mappingOption.categories = clone(categories);
+            }
+            else {
+                mappingOption.dataExtent = this.getExtent();
+                mappingOption.mappingMethod = 'piecewise';
+                mappingOption.pieceList = map(this._pieceList, function (piece) {
+                    var piece = clone(piece);
+                    if (state !== 'inRange') {
+                        // FIXME
+                        // outOfRange do not support special visual in pieces.
+                        piece.visual = null;
+                    }
+                    return piece;
+                });
+            }
+        });
+    },
+
+    /**
+     * @protected
+     * @override
+     */
+    completeVisualOption: function () {
+        // Consider this case:
+        // visualMap: {
+        //      pieces: [{symbol: 'circle', lt: 0}, {symbol: 'rect', gte: 0}]
+        // }
+        // where no inRange/outOfRange set but only pieces. So we should make
+        // default inRange/outOfRange for this case, otherwise visuals that only
+        // appear in `pieces` will not be taken into account in visual encoding.
+
+        var option = this.option;
+        var visualTypesInPieces = {};
+        var visualTypes = VisualMapping.listVisualTypes();
+        var isCategory = this.isCategory();
+
+        each$1(option.pieces, function (piece) {
+            each$1(visualTypes, function (visualType) {
+                if (piece.hasOwnProperty(visualType)) {
+                    visualTypesInPieces[visualType] = 1;
+                }
+            });
+        });
+
+        each$1(visualTypesInPieces, function (v, visualType) {
+            var exists = 0;
+            each$1(this.stateList, function (state) {
+                exists |= has(option, state, visualType)
+                    || has(option.target, state, visualType);
+            }, this);
+
+            !exists && each$1(this.stateList, function (state) {
+                (option[state] || (option[state] = {}))[visualType] = visualDefault.get(
+                    visualType, state === 'inRange' ? 'active' : 'inactive', isCategory
+                );
+            });
+        }, this);
+
+        function has(obj, state, visualType) {
+            return obj && obj[state] && (
+                isObject$1(obj[state])
+                    ? obj[state].hasOwnProperty(visualType)
+                    : obj[state] === visualType // e.g., inRange: 'symbol'
+            );
+        }
+
+        VisualMapModel.prototype.completeVisualOption.apply(this, arguments);
+    },
+
+    _resetSelected: function (newOption, isInit) {
+        var thisOption = this.option;
+        var pieceList = this._pieceList;
+
+        // Selected do not merge but all override.
+        var selected = (isInit ? thisOption : newOption).selected || {};
+        thisOption.selected = selected;
+
+        // Consider 'not specified' means true.
+        each$1(pieceList, function (piece, index) {
+            var key = this.getSelectedMapKey(piece);
+            if (!selected.hasOwnProperty(key)) {
+                selected[key] = true;
+            }
+        }, this);
+
+        if (thisOption.selectedMode === 'single') {
+            // Ensure there is only one selected.
+            var hasSel = false;
+
+            each$1(pieceList, function (piece, index) {
+                var key = this.getSelectedMapKey(piece);
+                if (selected[key]) {
+                    hasSel
+                        ? (selected[key] = false)
+                        : (hasSel = true);
+                }
+            }, this);
+        }
+        // thisOption.selectedMode === 'multiple', default: all selected.
+    },
+
+    /**
+     * @public
+     */
+    getSelectedMapKey: function (piece) {
+        return this._mode === 'categories'
+            ? piece.value + '' : piece.index + '';
+    },
+
+    /**
+     * @public
+     */
+    getPieceList: function () {
+        return this._pieceList;
+    },
+
+    /**
+     * @private
+     * @return {string}
+     */
+    _determineMode: function () {
+        var option = this.option;
+
+        return option.pieces && option.pieces.length > 0
+            ? 'pieces'
+            : this.option.categories
+            ? 'categories'
+            : 'splitNumber';
+    },
+
+    /**
+     * @public
+     * @override
+     */
+    setSelected: function (selected) {
+        this.option.selected = clone(selected);
+    },
+
+    /**
+     * @public
+     * @override
+     */
+    getValueState: function (value) {
+        var index = VisualMapping.findPieceIndex(value, this._pieceList);
+
+        return index != null
+            ? (this.option.selected[this.getSelectedMapKey(this._pieceList[index])]
+                ? 'inRange' : 'outOfRange'
+            )
+            : 'outOfRange';
+    },
+
+    /**
+     * @public
+     * @params {number} pieceIndex piece index in visualMapModel.getPieceList()
+     * @return {Array.<Object>} [{seriesId, dataIndices: <Array.<number>>}, ...]
+     */
+    findTargetDataIndices: function (pieceIndex) {
+        var result = [];
+
+        this.eachTargetSeries(function (seriesModel) {
+            var dataIndices = [];
+            var data = seriesModel.getData();
+
+            data.each(this.getDataDimension(data), function (value, dataIndex) {
+                // Should always base on model pieceList, because it is order sensitive.
+                var pIdx = VisualMapping.findPieceIndex(value, this._pieceList);
+                pIdx === pieceIndex && dataIndices.push(dataIndex);
+            }, this);
+
+            result.push({seriesId: seriesModel.id, dataIndex: dataIndices});
+        }, this);
+
+        return result;
+    },
+
+    /**
+     * @private
+     * @param {Object} piece piece.value or piece.interval is required.
+     * @return {number} Can be Infinity or -Infinity
+     */
+    getRepresentValue: function (piece) {
+        var representValue;
+        if (this.isCategory()) {
+            representValue = piece.value;
+        }
+        else {
+            if (piece.value != null) {
+                representValue = piece.value;
+            }
+            else {
+                var pieceInterval = piece.interval || [];
+                representValue = (pieceInterval[0] === -Infinity && pieceInterval[1] === Infinity)
+                    ? 0
+                    : (pieceInterval[0] + pieceInterval[1]) / 2;
+            }
+        }
+        return representValue;
+    },
+
+    getVisualMeta: function (getColorVisual) {
+        // Do not support category. (category axis is ordinal, numerical)
+        if (this.isCategory()) {
+            return;
+        }
+
+        var stops = [];
+        var outerColors = [];
+        var visualMapModel = this;
+
+        function setStop(interval, valueState) {
+            var representValue = visualMapModel.getRepresentValue({interval: interval});
+            if (!valueState) {
+                valueState = visualMapModel.getValueState(representValue);
+            }
+            var color = getColorVisual(representValue, valueState);
+            if (interval[0] === -Infinity) {
+                outerColors[0] = color;
+            }
+            else if (interval[1] === Infinity) {
+                outerColors[1] = color;
+            }
+            else {
+                stops.push(
+                    {value: interval[0], color: color},
+                    {value: interval[1], color: color}
+                );
+            }
+        }
+
+        // Suplement
+        var pieceList = this._pieceList.slice();
+        if (!pieceList.length) {
+            pieceList.push({interval: [-Infinity, Infinity]});
+        }
+        else {
+            var edge = pieceList[0].interval[0];
+            edge !== -Infinity && pieceList.unshift({interval: [-Infinity, edge]});
+            edge = pieceList[pieceList.length - 1].interval[1];
+            edge !== Infinity && pieceList.push({interval: [edge, Infinity]});
+        }
+
+        var curr = -Infinity;
+        each$1(pieceList, function (piece) {
+            var interval = piece.interval;
+            if (interval) {
+                // Fulfill gap.
+                interval[0] > curr && setStop([curr, interval[0]], 'outOfRange');
+                setStop(interval.slice());
+                curr = interval[1];
+            }
+        }, this);
+
+        return {stops: stops, outerColors: outerColors};
+    }
+
+});
+
+/**
+ * Key is this._mode
+ * @type {Object}
+ * @this {module:echarts/component/viusalMap/PiecewiseMode}
+ */
+var resetMethods = {
+
+    splitNumber: function () {
+        var thisOption = this.option;
+        var pieceList = this._pieceList;
+        var precision = Math.min(thisOption.precision, 20);
+        var dataExtent = this.getExtent();
+        var splitNumber = thisOption.splitNumber;
+        splitNumber = Math.max(parseInt(splitNumber, 10), 1);
+        thisOption.splitNumber = splitNumber;
+
+        var splitStep = (dataExtent[1] - dataExtent[0]) / splitNumber;
+        // Precision auto-adaption
+        while (+splitStep.toFixed(precision) !== splitStep && precision < 5) {
+            precision++;
+        }
+        thisOption.precision = precision;
+        splitStep = +splitStep.toFixed(precision);
+
+        var index = 0;
+
+        if (thisOption.minOpen) {
+            pieceList.push({
+                index: index++,
+                interval: [-Infinity, dataExtent[0]],
+                close: [0, 0]
+            });
+        }
+
+        for (
+            var curr = dataExtent[0], len = index + splitNumber;
+            index < len;
+            curr += splitStep
+        ) {
+            var max = index === splitNumber - 1 ? dataExtent[1] : (curr + splitStep);
+
+            pieceList.push({
+                index: index++,
+                interval: [curr, max],
+                close: [1, 1]
+            });
+        }
+
+        if (thisOption.maxOpen) {
+            pieceList.push({
+                index: index++,
+                interval: [dataExtent[1], Infinity],
+                close: [0, 0]
+            });
+        }
+
+        reformIntervals(pieceList);
+
+        each$1(pieceList, function (piece) {
+            piece.text = this.formatValueText(piece.interval);
+        }, this);
+    },
+
+    categories: function () {
+        var thisOption = this.option;
+        each$1(thisOption.categories, function (cate) {
+            // FIXME category模式也使用pieceList，但在visualMapping中不是使用pieceList。
+            // 是否改一致。
+            this._pieceList.push({
+                text: this.formatValueText(cate, true),
+                value: cate
+            });
+        }, this);
+
+        // See "Order Rule".
+        normalizeReverse(thisOption, this._pieceList);
+    },
+
+    pieces: function () {
+        var thisOption = this.option;
+        var pieceList = this._pieceList;
+
+        each$1(thisOption.pieces, function (pieceListItem, index) {
+
+            if (!isObject$1(pieceListItem)) {
+                pieceListItem = {value: pieceListItem};
+            }
+
+            var item = {text: '', index: index};
+
+            if (pieceListItem.label != null) {
+                item.text = pieceListItem.label;
+            }
+
+            if (pieceListItem.hasOwnProperty('value')) {
+                var value = item.value = pieceListItem.value;
+                item.interval = [value, value];
+                item.close = [1, 1];
+            }
+            else {
+                // `min` `max` is legacy option.
+                // `lt` `gt` `lte` `gte` is recommanded.
+                var interval = item.interval = [];
+                var close = item.close = [0, 0];
+
+                var closeList = [1, 0, 1];
+                var infinityList = [-Infinity, Infinity];
+
+                var useMinMax = [];
+                for (var lg = 0; lg < 2; lg++) {
+                    var names = [['gte', 'gt', 'min'], ['lte', 'lt', 'max']][lg];
+                    for (var i = 0; i < 3 && interval[lg] == null; i++) {
+                        interval[lg] = pieceListItem[names[i]];
+                        close[lg] = closeList[i];
+                        useMinMax[lg] = i === 2;
+                    }
+                    interval[lg] == null && (interval[lg] = infinityList[lg]);
+                }
+                useMinMax[0] && interval[1] === Infinity && (close[0] = 0);
+                useMinMax[1] && interval[0] === -Infinity && (close[1] = 0);
+
+                if (__DEV__) {
+                    if (interval[0] > interval[1]) {
+                        console.warn(
+                            'Piece ' + index + 'is illegal: ' + interval
+                            + ' lower bound should not greater then uppper bound.'
+                        );
+                    }
+                }
+
+                if (interval[0] === interval[1] && close[0] && close[1]) {
+                    // Consider: [{min: 5, max: 5, visual: {...}}, {min: 0, max: 5}],
+                    // we use value to lift the priority when min === max
+                    item.value = interval[0];
+                }
+            }
+
+            item.visual = VisualMapping.retrieveVisuals(pieceListItem);
+
+            pieceList.push(item);
+
+        }, this);
+
+        // See "Order Rule".
+        normalizeReverse(thisOption, pieceList);
+        // Only pieces
+        reformIntervals(pieceList);
+
+        each$1(pieceList, function (piece) {
+            var close = piece.close;
+            var edgeSymbols = [['<', '≤'][close[1]], ['>', '≥'][close[0]]];
+            piece.text = piece.text || this.formatValueText(
+                piece.value != null ? piece.value : piece.interval,
+                false,
+                edgeSymbols
+            );
+        }, this);
+    }
+};
+
+function normalizeReverse(thisOption, pieceList) {
+    var inverse = thisOption.inverse;
+    if (thisOption.orient === 'vertical' ? !inverse : inverse) {
+            pieceList.reverse();
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var PiecewiseVisualMapView = VisualMapView.extend({
+
+    type: 'visualMap.piecewise',
+
+    /**
+     * @protected
+     * @override
+     */
+    doRender: function () {
+        var thisGroup = this.group;
+
+        thisGroup.removeAll();
+
+        var visualMapModel = this.visualMapModel;
+        var textGap = visualMapModel.get('textGap');
+        var textStyleModel = visualMapModel.textStyleModel;
+        var textFont = textStyleModel.getFont();
+        var textFill = textStyleModel.getTextColor();
+        var itemAlign = this._getItemAlign();
+        var itemSize = visualMapModel.itemSize;
+        var viewData = this._getViewData();
+        var endsText = viewData.endsText;
+        var showLabel = retrieve(visualMapModel.get('showLabel', true), !endsText);
+
+        endsText && this._renderEndsText(
+            thisGroup, endsText[0], itemSize, showLabel, itemAlign
+        );
+
+        each$1(viewData.viewPieceList, renderItem, this);
+
+        endsText && this._renderEndsText(
+            thisGroup, endsText[1], itemSize, showLabel, itemAlign
+        );
+
+        box(
+            visualMapModel.get('orient'), thisGroup, visualMapModel.get('itemGap')
+        );
+
+        this.renderBackground(thisGroup);
+
+        this.positionGroup(thisGroup);
+
+        function renderItem(item) {
+            var piece = item.piece;
+
+            var itemGroup = new Group();
+            itemGroup.onclick = bind(this._onItemClick, this, piece);
+
+            this._enableHoverLink(itemGroup, item.indexInModelPieceList);
+
+            var representValue = visualMapModel.getRepresentValue(piece);
+
+            this._createItemSymbol(
+                itemGroup, representValue, [0, 0, itemSize[0], itemSize[1]]
+            );
+
+            if (showLabel) {
+                var visualState = this.visualMapModel.getValueState(representValue);
+
+                itemGroup.add(new Text({
+                    style: {
+                        x: itemAlign === 'right' ? -textGap : itemSize[0] + textGap,
+                        y: itemSize[1] / 2,
+                        text: piece.text,
+                        textVerticalAlign: 'middle',
+                        textAlign: itemAlign,
+                        textFont: textFont,
+                        textFill: textFill,
+                        opacity: visualState === 'outOfRange' ? 0.5 : 1
+                    }
+                }));
+            }
+
+            thisGroup.add(itemGroup);
+        }
+    },
+
+    /**
+     * @private
+     */
+    _enableHoverLink: function (itemGroup, pieceIndex) {
+        itemGroup
+            .on('mouseover', bind(onHoverLink, this, 'highlight'))
+            .on('mouseout', bind(onHoverLink, this, 'downplay'));
+
+        function onHoverLink(method) {
+            var visualMapModel = this.visualMapModel;
+
+            visualMapModel.option.hoverLink && this.api.dispatchAction({
+                type: method,
+                batch: convertDataIndex(
+                    visualMapModel.findTargetDataIndices(pieceIndex)
+                )
+            });
+        }
+    },
+
+    /**
+     * @private
+     */
+    _getItemAlign: function () {
+        var visualMapModel = this.visualMapModel;
+        var modelOption = visualMapModel.option;
+
+        if (modelOption.orient === 'vertical') {
+            return getItemAlign(
+                visualMapModel, this.api, visualMapModel.itemSize
+            );
+        }
+        else { // horizontal, most case left unless specifying right.
+            var align = modelOption.align;
+            if (!align || align === 'auto') {
+                align = 'left';
+            }
+            return align;
+        }
+    },
+
+    /**
+     * @private
+     */
+    _renderEndsText: function (group, text, itemSize, showLabel, itemAlign) {
+        if (!text) {
+            return;
+        }
+
+        var itemGroup = new Group();
+        var textStyleModel = this.visualMapModel.textStyleModel;
+
+        itemGroup.add(new Text({
+            style: {
+                x: showLabel ? (itemAlign === 'right' ? itemSize[0] : 0) : itemSize[0] / 2,
+                y: itemSize[1] / 2,
+                textVerticalAlign: 'middle',
+                textAlign: showLabel ? itemAlign : 'center',
+                text: text,
+                textFont: textStyleModel.getFont(),
+                textFill: textStyleModel.getTextColor()
+            }
+        }));
+
+        group.add(itemGroup);
+    },
+
+    /**
+     * @private
+     * @return {Object} {peiceList, endsText} The order is the same as screen pixel order.
+     */
+    _getViewData: function () {
+        var visualMapModel = this.visualMapModel;
+
+        var viewPieceList = map(visualMapModel.getPieceList(), function (piece, index) {
+            return {piece: piece, indexInModelPieceList: index};
+        });
+        var endsText = visualMapModel.get('text');
+
+        // Consider orient and inverse.
+        var orient = visualMapModel.get('orient');
+        var inverse = visualMapModel.get('inverse');
+
+        // Order of model pieceList is always [low, ..., high]
+        if (orient === 'horizontal' ? inverse : !inverse) {
+            viewPieceList.reverse();
+        }
+        // Origin order of endsText is [high, low]
+        else if (endsText) {
+            endsText = endsText.slice().reverse();
+        }
+
+        return {viewPieceList: viewPieceList, endsText: endsText};
+    },
+
+    /**
+     * @private
+     */
+    _createItemSymbol: function (group, representValue, shapeParam) {
+        group.add(createSymbol(
+            this.getControllerVisual(representValue, 'symbol'),
+            shapeParam[0], shapeParam[1], shapeParam[2], shapeParam[3],
+            this.getControllerVisual(representValue, 'color')
+        ));
+    },
+
+    /**
+     * @private
+     */
+    _onItemClick: function (piece) {
+        var visualMapModel = this.visualMapModel;
+        var option = visualMapModel.option;
+        var selected = clone(option.selected);
+        var newKey = visualMapModel.getSelectedMapKey(piece);
+
+        if (option.selectedMode === 'single') {
+            selected[newKey] = true;
+            each$1(selected, function (o, key) {
+                selected[key] = key === newKey;
+            });
+        }
+        else {
+            selected[newKey] = !selected[newKey];
+        }
+
+        this.api.dispatchAction({
+            type: 'selectDataRange',
+            from: this.uid,
+            visualMapId: this.visualMapModel.id,
+            selected: selected
+        });
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+registerPreprocessor(preprocessor$2);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * visualMap component entry
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var addCommas$1 = addCommas;
+var encodeHTML$1 = encodeHTML;
+
+function fillLabel(opt) {
+    defaultEmphasis(opt, 'label', ['show']);
+}
+var MarkerModel = extendComponentModel({
+
+    type: 'marker',
+
+    dependencies: ['series', 'grid', 'polar', 'geo'],
+
+    /**
+     * @overrite
+     */
+    init: function (option, parentModel, ecModel, extraOpt) {
+
+        if (__DEV__) {
+            if (this.type === 'marker') {
+                throw new Error('Marker component is abstract component. Use markLine, markPoint, markArea instead.');
+            }
+        }
+        this.mergeDefaultAndTheme(option, ecModel);
+        this.mergeOption(option, ecModel, extraOpt.createdBySelf, true);
+    },
+
+    /**
+     * @return {boolean}
+     */
+    isAnimationEnabled: function () {
+        if (env$1.node) {
+            return false;
+        }
+
+        var hostSeries = this.__hostSeries;
+        return this.getShallow('animation') && hostSeries && hostSeries.isAnimationEnabled();
+    },
+
+    mergeOption: function (newOpt, ecModel, createdBySelf, isInit) {
+        var MarkerModel = this.constructor;
+        var modelPropName = this.mainType + 'Model';
+        if (!createdBySelf) {
+            ecModel.eachSeries(function (seriesModel) {
+
+                var markerOpt = seriesModel.get(this.mainType, true);
+
+                var markerModel = seriesModel[modelPropName];
+                if (!markerOpt || !markerOpt.data) {
+                    seriesModel[modelPropName] = null;
+                    return;
+                }
+                if (!markerModel) {
+                    if (isInit) {
+                        // Default label emphasis `position` and `show`
+                        fillLabel(markerOpt);
+                    }
+                    each$1(markerOpt.data, function (item) {
+                        // FIXME Overwrite fillLabel method ?
+                        if (item instanceof Array) {
+                            fillLabel(item[0]);
+                            fillLabel(item[1]);
+                        }
+                        else {
+                            fillLabel(item);
+                        }
+                    });
+
+                    markerModel = new MarkerModel(
+                        markerOpt, this, ecModel
+                    );
+
+                    extend(markerModel, {
+                        mainType: this.mainType,
+                        // Use the same series index and name
+                        seriesIndex: seriesModel.seriesIndex,
+                        name: seriesModel.name,
+                        createdBySelf: true
+                    });
+
+                    markerModel.__hostSeries = seriesModel;
+                }
+                else {
+                    markerModel.mergeOption(markerOpt, ecModel, true);
+                }
+                seriesModel[modelPropName] = markerModel;
+            }, this);
+        }
+    },
+
+    formatTooltip: function (dataIndex) {
+        var data = this.getData();
+        var value = this.getRawValue(dataIndex);
+        var formattedValue = isArray(value)
+            ? map(value, addCommas$1).join(', ') : addCommas$1(value);
+        var name = data.getName(dataIndex);
+        var html = encodeHTML$1(this.name);
+        if (value != null || name) {
+            html += '<br />';
+        }
+        if (name) {
+            html += encodeHTML$1(name);
+            if (value != null) {
+                html += ' : ';
+            }
+        }
+        if (value != null) {
+            html += encodeHTML$1(formattedValue);
+        }
+        return html;
+    },
+
+    getData: function () {
+        return this._data;
+    },
+
+    setData: function (data) {
+        this._data = data;
+    }
+});
+
+mixin(MarkerModel, dataFormatMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+MarkerModel.extend({
+
+    type: 'markPoint',
+
+    defaultOption: {
+        zlevel: 0,
+        z: 5,
+        symbol: 'pin',
+        symbolSize: 50,
+        //symbolRotate: 0,
+        //symbolOffset: [0, 0]
+        tooltip: {
+            trigger: 'item'
+        },
+        label: {
+            show: true,
+            position: 'inside'
+        },
+        itemStyle: {
+            borderWidth: 2
+        },
+        emphasis: {
+            label: {
+                show: true
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var indexOf$2 = indexOf;
+
+function hasXOrY(item) {
+    return !(isNaN(parseFloat(item.x)) && isNaN(parseFloat(item.y)));
+}
+
+function hasXAndY(item) {
+    return !isNaN(parseFloat(item.x)) && !isNaN(parseFloat(item.y));
+}
+
+// Make it simple, do not visit all stacked value to count precision.
+// function getPrecision(data, valueAxisDim, dataIndex) {
+//     var precision = -1;
+//     var stackedDim = data.mapDimension(valueAxisDim);
+//     do {
+//         precision = Math.max(
+//             numberUtil.getPrecision(data.get(stackedDim, dataIndex)),
+//             precision
+//         );
+//         var stackedOnSeries = data.getCalculationInfo('stackedOnSeries');
+//         if (stackedOnSeries) {
+//             var byValue = data.get(data.getCalculationInfo('stackedByDimension'), dataIndex);
+//             data = stackedOnSeries.getData();
+//             dataIndex = data.indexOf(data.getCalculationInfo('stackedByDimension'), byValue);
+//             stackedDim = data.getCalculationInfo('stackedDimension');
+//         }
+//         else {
+//             data = null;
+//         }
+//     } while (data);
+
+//     return precision;
+// }
+
+function markerTypeCalculatorWithExtent(
+    mlType, data, otherDataDim, targetDataDim, otherCoordIndex, targetCoordIndex
+) {
+    var coordArr = [];
+
+    var stacked = isDimensionStacked(data, targetDataDim /*, otherDataDim*/);
+    var calcDataDim = stacked
+        ? data.getCalculationInfo('stackResultDimension')
+        : targetDataDim;
+
+    var value = numCalculate(data, calcDataDim, mlType);
+
+    var dataIndex = data.indicesOfNearest(calcDataDim, value)[0];
+    coordArr[otherCoordIndex] = data.get(otherDataDim, dataIndex);
+    coordArr[targetCoordIndex] = data.get(targetDataDim, dataIndex);
+
+    // Make it simple, do not visit all stacked value to count precision.
+    var precision = getPrecision(data.get(targetDataDim, dataIndex));
+    precision = Math.min(precision, 20);
+    if (precision >= 0) {
+        coordArr[targetCoordIndex] = +coordArr[targetCoordIndex].toFixed(precision);
+    }
+
+    return coordArr;
+}
+
+var curry$7 = curry;
+// TODO Specified percent
+var markerTypeCalculator = {
+    /**
+     * @method
+     * @param {module:echarts/data/List} data
+     * @param {string} baseAxisDim
+     * @param {string} valueAxisDim
+     */
+    min: curry$7(markerTypeCalculatorWithExtent, 'min'),
+    /**
+     * @method
+     * @param {module:echarts/data/List} data
+     * @param {string} baseAxisDim
+     * @param {string} valueAxisDim
+     */
+    max: curry$7(markerTypeCalculatorWithExtent, 'max'),
+
+    /**
+     * @method
+     * @param {module:echarts/data/List} data
+     * @param {string} baseAxisDim
+     * @param {string} valueAxisDim
+     */
+    average: curry$7(markerTypeCalculatorWithExtent, 'average')
+};
+
+/**
+ * Transform markPoint data item to format used in List by do the following
+ * 1. Calculate statistic like `max`, `min`, `average`
+ * 2. Convert `item.xAxis`, `item.yAxis` to `item.coord` array
+ * @param  {module:echarts/model/Series} seriesModel
+ * @param  {module:echarts/coord/*} [coordSys]
+ * @param  {Object} item
+ * @return {Object}
+ */
+function dataTransform(seriesModel, item) {
+    var data = seriesModel.getData();
+    var coordSys = seriesModel.coordinateSystem;
+
+    // 1. If not specify the position with pixel directly
+    // 2. If `coord` is not a data array. Which uses `xAxis`,
+    // `yAxis` to specify the coord on each dimension
+
+    // parseFloat first because item.x and item.y can be percent string like '20%'
+    if (item && !hasXAndY(item) && !isArray(item.coord) && coordSys) {
+        var dims = coordSys.dimensions;
+        var axisInfo = getAxisInfo$1(item, data, coordSys, seriesModel);
+
+        // Clone the option
+        // Transform the properties xAxis, yAxis, radiusAxis, angleAxis, geoCoord to value
+        item = clone(item);
+
+        if (item.type
+            && markerTypeCalculator[item.type]
+            && axisInfo.baseAxis && axisInfo.valueAxis
+        ) {
+            var otherCoordIndex = indexOf$2(dims, axisInfo.baseAxis.dim);
+            var targetCoordIndex = indexOf$2(dims, axisInfo.valueAxis.dim);
+
+            item.coord = markerTypeCalculator[item.type](
+                data, axisInfo.baseDataDim, axisInfo.valueDataDim,
+                otherCoordIndex, targetCoordIndex
+            );
+            // Force to use the value of calculated value.
+            item.value = item.coord[targetCoordIndex];
+        }
+        else {
+            // FIXME Only has one of xAxis and yAxis.
+            var coord = [
+                item.xAxis != null ? item.xAxis : item.radiusAxis,
+                item.yAxis != null ? item.yAxis : item.angleAxis
+            ];
+            // Each coord support max, min, average
+            for (var i = 0; i < 2; i++) {
+                if (markerTypeCalculator[coord[i]]) {
+                    coord[i] = numCalculate(data, data.mapDimension(dims[i]), coord[i]);
+                }
+            }
+            item.coord = coord;
+        }
+    }
+    return item;
+}
+
+function getAxisInfo$1(item, data, coordSys, seriesModel) {
+    var ret = {};
+
+    if (item.valueIndex != null || item.valueDim != null) {
+        ret.valueDataDim = item.valueIndex != null
+            ? data.getDimension(item.valueIndex) : item.valueDim;
+        ret.valueAxis = coordSys.getAxis(dataDimToCoordDim(seriesModel, ret.valueDataDim));
+        ret.baseAxis = coordSys.getOtherAxis(ret.valueAxis);
+        ret.baseDataDim = data.mapDimension(ret.baseAxis.dim);
+    }
+    else {
+        ret.baseAxis = seriesModel.getBaseAxis();
+        ret.valueAxis = coordSys.getOtherAxis(ret.baseAxis);
+        ret.baseDataDim = data.mapDimension(ret.baseAxis.dim);
+        ret.valueDataDim = data.mapDimension(ret.valueAxis.dim);
+    }
+
+    return ret;
+}
+
+function dataDimToCoordDim(seriesModel, dataDim) {
+    var data = seriesModel.getData();
+    var dimensions = data.dimensions;
+    dataDim = data.getDimension(dataDim);
+    for (var i = 0; i < dimensions.length; i++) {
+        var dimItem = data.getDimensionInfo(dimensions[i]);
+        if (dimItem.name === dataDim) {
+            return dimItem.coordDim;
+        }
+    }
+}
+
+/**
+ * Filter data which is out of coordinateSystem range
+ * [dataFilter description]
+ * @param  {module:echarts/coord/*} [coordSys]
+ * @param  {Object} item
+ * @return {boolean}
+ */
+function dataFilter$1(coordSys, item) {
+    // Alwalys return true if there is no coordSys
+    return (coordSys && coordSys.containData && item.coord && !hasXOrY(item))
+        ? coordSys.containData(item.coord) : true;
+}
+
+function dimValueGetter(item, dimName, dataIndex, dimIndex) {
+    // x, y, radius, angle
+    if (dimIndex < 2) {
+        return item.coord && item.coord[dimIndex];
+    }
+    return item.value;
+}
+
+function numCalculate(data, valueDataDim, type) {
+    if (type === 'average') {
+        var sum = 0;
+        var count = 0;
+        data.each(valueDataDim, function (val, idx) {
+            if (!isNaN(val)) {
+                sum += val;
+                count++;
+            }
+        });
+        return sum / count;
+    }
+    else if (type === 'median') {
+        return data.getMedian(valueDataDim);
+    }
+    else {
+        // max & min
+        return data.getDataExtent(valueDataDim, true)[type === 'max' ? 1 : 0];
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var MarkerView = extendComponentView({
+
+    type: 'marker',
+
+    init: function () {
+        /**
+         * Markline grouped by series
+         * @private
+         * @type {module:zrender/core/util.HashMap}
+         */
+        this.markerGroupMap = createHashMap();
+    },
+
+    render: function (markerModel, ecModel, api) {
+        var markerGroupMap = this.markerGroupMap;
+        markerGroupMap.each(function (item) {
+            item.__keep = false;
+        });
+
+        var markerModelKey = this.type + 'Model';
+        ecModel.eachSeries(function (seriesModel) {
+            var markerModel = seriesModel[markerModelKey];
+            markerModel && this.renderSeries(seriesModel, markerModel, ecModel, api);
+        }, this);
+
+        markerGroupMap.each(function (item) {
+            !item.__keep && this.group.remove(item.group);
+        }, this);
+    },
+
+    renderSeries: function () {}
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+function updateMarkerLayout(mpData, seriesModel, api) {
+    var coordSys = seriesModel.coordinateSystem;
+    mpData.each(function (idx) {
+        var itemModel = mpData.getItemModel(idx);
+        var point;
+        var xPx = parsePercent$1(itemModel.get('x'), api.getWidth());
+        var yPx = parsePercent$1(itemModel.get('y'), api.getHeight());
+        if (!isNaN(xPx) && !isNaN(yPx)) {
+            point = [xPx, yPx];
+        }
+        // Chart like bar may have there own marker positioning logic
+        else if (seriesModel.getMarkerPosition) {
+            // Use the getMarkerPoisition
+            point = seriesModel.getMarkerPosition(
+                mpData.getValues(mpData.dimensions, idx)
+            );
+        }
+        else if (coordSys) {
+            var x = mpData.get(coordSys.dimensions[0], idx);
+            var y = mpData.get(coordSys.dimensions[1], idx);
+            point = coordSys.dataToPoint([x, y]);
+
+        }
+
+        // Use x, y if has any
+        if (!isNaN(xPx)) {
+            point[0] = xPx;
+        }
+        if (!isNaN(yPx)) {
+            point[1] = yPx;
+        }
+
+        mpData.setItemLayout(idx, point);
+    });
+}
+
+MarkerView.extend({
+
+    type: 'markPoint',
+
+    // updateLayout: function (markPointModel, ecModel, api) {
+    //     ecModel.eachSeries(function (seriesModel) {
+    //         var mpModel = seriesModel.markPointModel;
+    //         if (mpModel) {
+    //             updateMarkerLayout(mpModel.getData(), seriesModel, api);
+    //             this.markerGroupMap.get(seriesModel.id).updateLayout(mpModel);
+    //         }
+    //     }, this);
+    // },
+
+    updateTransform: function (markPointModel, ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            var mpModel = seriesModel.markPointModel;
+            if (mpModel) {
+                updateMarkerLayout(mpModel.getData(), seriesModel, api);
+                this.markerGroupMap.get(seriesModel.id).updateLayout(mpModel);
+            }
+        }, this);
+    },
+
+    renderSeries: function (seriesModel, mpModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesId = seriesModel.id;
+        var seriesData = seriesModel.getData();
+
+        var symbolDrawMap = this.markerGroupMap;
+        var symbolDraw = symbolDrawMap.get(seriesId)
+            || symbolDrawMap.set(seriesId, new SymbolDraw());
+
+        var mpData = createList$1(coordSys, seriesModel, mpModel);
+
+        // FIXME
+        mpModel.setData(mpData);
+
+        updateMarkerLayout(mpModel.getData(), seriesModel, api);
+
+        mpData.each(function (idx) {
+            var itemModel = mpData.getItemModel(idx);
+            var symbolSize = itemModel.getShallow('symbolSize');
+            if (typeof symbolSize === 'function') {
+                // FIXME 这里不兼容 ECharts 2.x，2.x 貌似参数是整个数据？
+                symbolSize = symbolSize(
+                    mpModel.getRawValue(idx), mpModel.getDataParams(idx)
+                );
+            }
+            mpData.setItemVisual(idx, {
+                symbolSize: symbolSize,
+                color: itemModel.get('itemStyle.color')
+                    || seriesData.getVisual('color'),
+                symbol: itemModel.getShallow('symbol')
+            });
+        });
+
+        // TODO Text are wrong
+        symbolDraw.updateData(mpData);
+        this.group.add(symbolDraw.group);
+
+        // Set host model for tooltip
+        // FIXME
+        mpData.eachItemGraphicEl(function (el) {
+            el.traverse(function (child) {
+                child.dataModel = mpModel;
+            });
+        });
+
+        symbolDraw.__keep = true;
+
+        symbolDraw.group.silent = mpModel.get('silent') || seriesModel.get('silent');
+    }
+});
+
+/**
+ * @inner
+ * @param {module:echarts/coord/*} [coordSys]
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {module:echarts/model/Model} mpModel
+ */
+function createList$1(coordSys, seriesModel, mpModel) {
+    var coordDimsInfos;
+    if (coordSys) {
+        coordDimsInfos = map(coordSys && coordSys.dimensions, function (coordDim) {
+            var info = seriesModel.getData().getDimensionInfo(
+                seriesModel.getData().mapDimension(coordDim)
+            ) || {};
+            // In map series data don't have lng and lat dimension. Fallback to same with coordSys
+            return defaults({name: coordDim}, info);
+        });
+    }
+    else {
+        coordDimsInfos =[{
+            name: 'value',
+            type: 'float'
+        }];
+    }
+
+    var mpData = new List(coordDimsInfos, mpModel);
+    var dataOpt = map(mpModel.get('data'), curry(
+            dataTransform, seriesModel
+        ));
+    if (coordSys) {
+        dataOpt = filter(
+            dataOpt, curry(dataFilter$1, coordSys)
+        );
+    }
+
+    mpData.initData(dataOpt, null,
+        coordSys ? dimValueGetter : function (item) {
+            return item.value;
+        }
+    );
+
+    return mpData;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// HINT Markpoint can't be used too much
+registerPreprocessor(function (opt) {
+    // Make sure markPoint component is enabled
+    opt.markPoint = opt.markPoint || {};
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+MarkerModel.extend({
+
+    type: 'markLine',
+
+    defaultOption: {
+        zlevel: 0,
+        z: 5,
+
+        symbol: ['circle', 'arrow'],
+        symbolSize: [8, 16],
+
+        //symbolRotate: 0,
+
+        precision: 2,
+        tooltip: {
+            trigger: 'item'
+        },
+        label: {
+            show: true,
+            position: 'end'
+        },
+        lineStyle: {
+            type: 'dashed'
+        },
+        emphasis: {
+            label: {
+                show: true
+            },
+            lineStyle: {
+                width: 3
+            }
+        },
+        animationEasing: 'linear'
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var markLineTransform = function (seriesModel, coordSys, mlModel, item) {
+    var data = seriesModel.getData();
+    // Special type markLine like 'min', 'max', 'average', 'median'
+    var mlType = item.type;
+
+    if (!isArray(item)
+        && (
+            mlType === 'min' || mlType === 'max' || mlType === 'average' || mlType === 'median'
+            // In case
+            // data: [{
+            //   yAxis: 10
+            // }]
+            || (item.xAxis != null || item.yAxis != null)
+        )
+    ) {
+        var valueAxis;
+        var valueDataDim;
+        var value;
+
+        if (item.yAxis != null || item.xAxis != null) {
+            valueDataDim = item.yAxis != null ? 'y' : 'x';
+            valueAxis = coordSys.getAxis(valueDataDim);
+
+            value = retrieve(item.yAxis, item.xAxis);
+        }
+        else {
+            var axisInfo = getAxisInfo$1(item, data, coordSys, seriesModel);
+            valueDataDim = axisInfo.valueDataDim;
+            valueAxis = axisInfo.valueAxis;
+            value = numCalculate(data, valueDataDim, mlType);
+        }
+        var valueIndex = valueDataDim === 'x' ? 0 : 1;
+        var baseIndex = 1 - valueIndex;
+
+        var mlFrom = clone(item);
+        var mlTo = {};
+
+        mlFrom.type = null;
+
+        mlFrom.coord = [];
+        mlTo.coord = [];
+        mlFrom.coord[baseIndex] = -Infinity;
+        mlTo.coord[baseIndex] = Infinity;
+
+        var precision = mlModel.get('precision');
+        if (precision >= 0 && typeof value === 'number') {
+            value = +value.toFixed(Math.min(precision, 20));
+        }
+
+        mlFrom.coord[valueIndex] = mlTo.coord[valueIndex] = value;
+
+        item = [mlFrom, mlTo, { // Extra option for tooltip and label
+            type: mlType,
+            valueIndex: item.valueIndex,
+            // Force to use the value of calculated value.
+            value: value
+        }];
+    }
+
+    item = [
+        dataTransform(seriesModel, item[0]),
+        dataTransform(seriesModel, item[1]),
+        extend({}, item[2])
+    ];
+
+    // Avoid line data type is extended by from(to) data type
+    item[2].type = item[2].type || '';
+
+    // Merge from option and to option into line option
+    merge(item[2], item[0]);
+    merge(item[2], item[1]);
+
+    return item;
+};
+
+function isInifinity(val) {
+    return !isNaN(val) && !isFinite(val);
+}
+
+// If a markLine has one dim
+function ifMarkLineHasOnlyDim(dimIndex, fromCoord, toCoord, coordSys) {
+    var otherDimIndex = 1 - dimIndex;
+    var dimName = coordSys.dimensions[dimIndex];
+    return isInifinity(fromCoord[otherDimIndex]) && isInifinity(toCoord[otherDimIndex])
+        && fromCoord[dimIndex] === toCoord[dimIndex] && coordSys.getAxis(dimName).containData(fromCoord[dimIndex]);
+}
+
+function markLineFilter(coordSys, item) {
+    if (coordSys.type === 'cartesian2d') {
+        var fromCoord = item[0].coord;
+        var toCoord = item[1].coord;
+        // In case
+        // {
+        //  markLine: {
+        //    data: [{ yAxis: 2 }]
+        //  }
+        // }
+        if (
+            fromCoord && toCoord &&
+            (ifMarkLineHasOnlyDim(1, fromCoord, toCoord, coordSys)
+            || ifMarkLineHasOnlyDim(0, fromCoord, toCoord, coordSys))
+        ) {
+            return true;
+        }
+    }
+    return dataFilter$1(coordSys, item[0])
+        && dataFilter$1(coordSys, item[1]);
+}
+
+function updateSingleMarkerEndLayout(
+    data, idx, isFrom, seriesModel, api
+) {
+    var coordSys = seriesModel.coordinateSystem;
+    var itemModel = data.getItemModel(idx);
+
+    var point;
+    var xPx = parsePercent$1(itemModel.get('x'), api.getWidth());
+    var yPx = parsePercent$1(itemModel.get('y'), api.getHeight());
+    if (!isNaN(xPx) && !isNaN(yPx)) {
+        point = [xPx, yPx];
+    }
+    else {
+        // Chart like bar may have there own marker positioning logic
+        if (seriesModel.getMarkerPosition) {
+            // Use the getMarkerPoisition
+            point = seriesModel.getMarkerPosition(
+                data.getValues(data.dimensions, idx)
+            );
+        }
+        else {
+            var dims = coordSys.dimensions;
+            var x = data.get(dims[0], idx);
+            var y = data.get(dims[1], idx);
+            point = coordSys.dataToPoint([x, y]);
+        }
+        // Expand line to the edge of grid if value on one axis is Inifnity
+        // In case
+        //  markLine: {
+        //    data: [{
+        //      yAxis: 2
+        //      // or
+        //      type: 'average'
+        //    }]
+        //  }
+        if (coordSys.type === 'cartesian2d') {
+            var xAxis = coordSys.getAxis('x');
+            var yAxis = coordSys.getAxis('y');
+            var dims = coordSys.dimensions;
+            if (isInifinity(data.get(dims[0], idx))) {
+                point[0] = xAxis.toGlobalCoord(xAxis.getExtent()[isFrom ? 0 : 1]);
+            }
+            else if (isInifinity(data.get(dims[1], idx))) {
+                point[1] = yAxis.toGlobalCoord(yAxis.getExtent()[isFrom ? 0 : 1]);
+            }
+        }
+
+        // Use x, y if has any
+        if (!isNaN(xPx)) {
+            point[0] = xPx;
+        }
+        if (!isNaN(yPx)) {
+            point[1] = yPx;
+        }
+    }
+
+    data.setItemLayout(idx, point);
+}
+
+MarkerView.extend({
+
+    type: 'markLine',
+
+    // updateLayout: function (markLineModel, ecModel, api) {
+    //     ecModel.eachSeries(function (seriesModel) {
+    //         var mlModel = seriesModel.markLineModel;
+    //         if (mlModel) {
+    //             var mlData = mlModel.getData();
+    //             var fromData = mlModel.__from;
+    //             var toData = mlModel.__to;
+    //             // Update visual and layout of from symbol and to symbol
+    //             fromData.each(function (idx) {
+    //                 updateSingleMarkerEndLayout(fromData, idx, true, seriesModel, api);
+    //                 updateSingleMarkerEndLayout(toData, idx, false, seriesModel, api);
+    //             });
+    //             // Update layout of line
+    //             mlData.each(function (idx) {
+    //                 mlData.setItemLayout(idx, [
+    //                     fromData.getItemLayout(idx),
+    //                     toData.getItemLayout(idx)
+    //                 ]);
+    //             });
+
+    //             this.markerGroupMap.get(seriesModel.id).updateLayout();
+
+    //         }
+    //     }, this);
+    // },
+
+    updateTransform: function (markLineModel, ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            var mlModel = seriesModel.markLineModel;
+            if (mlModel) {
+                var mlData = mlModel.getData();
+                var fromData = mlModel.__from;
+                var toData = mlModel.__to;
+                // Update visual and layout of from symbol and to symbol
+                fromData.each(function (idx) {
+                    updateSingleMarkerEndLayout(fromData, idx, true, seriesModel, api);
+                    updateSingleMarkerEndLayout(toData, idx, false, seriesModel, api);
+                });
+                // Update layout of line
+                mlData.each(function (idx) {
+                    mlData.setItemLayout(idx, [
+                        fromData.getItemLayout(idx),
+                        toData.getItemLayout(idx)
+                    ]);
+                });
+
+                this.markerGroupMap.get(seriesModel.id).updateLayout();
+
+            }
+        }, this);
+    },
+
+    renderSeries: function (seriesModel, mlModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesId = seriesModel.id;
+        var seriesData = seriesModel.getData();
+
+        var lineDrawMap = this.markerGroupMap;
+        var lineDraw = lineDrawMap.get(seriesId)
+            || lineDrawMap.set(seriesId, new LineDraw());
+        this.group.add(lineDraw.group);
+
+        var mlData = createList$2(coordSys, seriesModel, mlModel);
+
+        var fromData = mlData.from;
+        var toData = mlData.to;
+        var lineData = mlData.line;
+
+        mlModel.__from = fromData;
+        mlModel.__to = toData;
+        // Line data for tooltip and formatter
+        mlModel.setData(lineData);
+
+        var symbolType = mlModel.get('symbol');
+        var symbolSize = mlModel.get('symbolSize');
+        if (!isArray(symbolType)) {
+            symbolType = [symbolType, symbolType];
+        }
+        if (typeof symbolSize === 'number') {
+            symbolSize = [symbolSize, symbolSize];
+        }
+
+        // Update visual and layout of from symbol and to symbol
+        mlData.from.each(function (idx) {
+            updateDataVisualAndLayout(fromData, idx, true);
+            updateDataVisualAndLayout(toData, idx, false);
+        });
+
+        // Update visual and layout of line
+        lineData.each(function (idx) {
+            var lineColor = lineData.getItemModel(idx).get('lineStyle.color');
+            lineData.setItemVisual(idx, {
+                color: lineColor || fromData.getItemVisual(idx, 'color')
+            });
+            lineData.setItemLayout(idx, [
+                fromData.getItemLayout(idx),
+                toData.getItemLayout(idx)
+            ]);
+
+            lineData.setItemVisual(idx, {
+                'fromSymbolSize': fromData.getItemVisual(idx, 'symbolSize'),
+                'fromSymbol': fromData.getItemVisual(idx, 'symbol'),
+                'toSymbolSize': toData.getItemVisual(idx, 'symbolSize'),
+                'toSymbol': toData.getItemVisual(idx, 'symbol')
+            });
+        });
+
+        lineDraw.updateData(lineData);
+
+        // Set host model for tooltip
+        // FIXME
+        mlData.line.eachItemGraphicEl(function (el, idx) {
+            el.traverse(function (child) {
+                child.dataModel = mlModel;
+            });
+        });
+
+        function updateDataVisualAndLayout(data, idx, isFrom) {
+            var itemModel = data.getItemModel(idx);
+
+            updateSingleMarkerEndLayout(
+                data, idx, isFrom, seriesModel, api
+            );
+
+            data.setItemVisual(idx, {
+                symbolSize: itemModel.get('symbolSize') || symbolSize[isFrom ? 0 : 1],
+                symbol: itemModel.get('symbol', true) || symbolType[isFrom ? 0 : 1],
+                color: itemModel.get('itemStyle.color') || seriesData.getVisual('color')
+            });
+        }
+
+        lineDraw.__keep = true;
+
+        lineDraw.group.silent = mlModel.get('silent') || seriesModel.get('silent');
+    }
+});
+
+/**
+ * @inner
+ * @param {module:echarts/coord/*} coordSys
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {module:echarts/model/Model} mpModel
+ */
+function createList$2(coordSys, seriesModel, mlModel) {
+
+    var coordDimsInfos;
+    if (coordSys) {
+        coordDimsInfos = map(coordSys && coordSys.dimensions, function (coordDim) {
+            var info = seriesModel.getData().getDimensionInfo(
+                seriesModel.getData().mapDimension(coordDim)
+            ) || {};
+            // In map series data don't have lng and lat dimension. Fallback to same with coordSys
+            return defaults({name: coordDim}, info);
+        });
+    }
+    else {
+        coordDimsInfos =[{
+            name: 'value',
+            type: 'float'
+        }];
+    }
+
+    var fromData = new List(coordDimsInfos, mlModel);
+    var toData = new List(coordDimsInfos, mlModel);
+    // No dimensions
+    var lineData = new List([], mlModel);
+
+    var optData = map(mlModel.get('data'), curry(
+        markLineTransform, seriesModel, coordSys, mlModel
+    ));
+    if (coordSys) {
+        optData = filter(
+            optData, curry(markLineFilter, coordSys)
+        );
+    }
+    var dimValueGetter$$1 = coordSys ? dimValueGetter : function (item) {
+        return item.value;
+    };
+    fromData.initData(
+        map(optData, function (item) { return item[0]; }),
+        null, dimValueGetter$$1
+    );
+    toData.initData(
+        map(optData, function (item) { return item[1]; }),
+        null, dimValueGetter$$1
+    );
+    lineData.initData(
+        map(optData, function (item) { return item[2]; })
+    );
+    lineData.hasItemOption = true;
+
+    return {
+        from: fromData,
+        to: toData,
+        line: lineData
+    };
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerPreprocessor(function (opt) {
+    // Make sure markLine component is enabled
+    opt.markLine = opt.markLine || {};
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+MarkerModel.extend({
+
+    type: 'markArea',
+
+    defaultOption: {
+        zlevel: 0,
+        // PENDING
+        z: 1,
+        tooltip: {
+            trigger: 'item'
+        },
+        // markArea should fixed on the coordinate system
+        animation: false,
+        label: {
+            show: true,
+            position: 'top'
+        },
+        itemStyle: {
+            // color and borderColor default to use color from series
+            // color: 'auto'
+            // borderColor: 'auto'
+            borderWidth: 0
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                position: 'top'
+            }
+        }
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// TODO Better on polar
+
+var markAreaTransform = function (seriesModel, coordSys, maModel, item) {
+    var lt = dataTransform(seriesModel, item[0]);
+    var rb = dataTransform(seriesModel, item[1]);
+    var retrieve$$1 = retrieve;
+
+    // FIXME make sure lt is less than rb
+    var ltCoord = lt.coord;
+    var rbCoord = rb.coord;
+    ltCoord[0] = retrieve$$1(ltCoord[0], -Infinity);
+    ltCoord[1] = retrieve$$1(ltCoord[1], -Infinity);
+
+    rbCoord[0] = retrieve$$1(rbCoord[0], Infinity);
+    rbCoord[1] = retrieve$$1(rbCoord[1], Infinity);
+
+    // Merge option into one
+    var result = mergeAll([{}, lt, rb]);
+
+    result.coord = [
+        lt.coord, rb.coord
+    ];
+    result.x0 = lt.x;
+    result.y0 = lt.y;
+    result.x1 = rb.x;
+    result.y1 = rb.y;
+    return result;
+};
+
+function isInifinity$1(val) {
+    return !isNaN(val) && !isFinite(val);
+}
+
+// If a markArea has one dim
+function ifMarkLineHasOnlyDim$1(dimIndex, fromCoord, toCoord, coordSys) {
+    var otherDimIndex = 1 - dimIndex;
+    return isInifinity$1(fromCoord[otherDimIndex]) && isInifinity$1(toCoord[otherDimIndex]);
+}
+
+function markAreaFilter(coordSys, item) {
+    var fromCoord = item.coord[0];
+    var toCoord = item.coord[1];
+    if (coordSys.type === 'cartesian2d') {
+        // In case
+        // {
+        //  markArea: {
+        //    data: [{ yAxis: 2 }]
+        //  }
+        // }
+        if (
+            fromCoord && toCoord &&
+            (ifMarkLineHasOnlyDim$1(1, fromCoord, toCoord, coordSys)
+            || ifMarkLineHasOnlyDim$1(0, fromCoord, toCoord, coordSys))
+        ) {
+            return true;
+        }
+    }
+    return dataFilter$1(coordSys, {
+            coord: fromCoord,
+            x: item.x0,
+            y: item.y0
+        })
+        || dataFilter$1(coordSys, {
+            coord: toCoord,
+            x: item.x1,
+            y: item.y1
+        });
+}
+
+// dims can be ['x0', 'y0'], ['x1', 'y1'], ['x0', 'y1'], ['x1', 'y0']
+function getSingleMarkerEndPoint(data, idx, dims, seriesModel, api) {
+    var coordSys = seriesModel.coordinateSystem;
+    var itemModel = data.getItemModel(idx);
+
+    var point;
+    var xPx = parsePercent$1(itemModel.get(dims[0]), api.getWidth());
+    var yPx = parsePercent$1(itemModel.get(dims[1]), api.getHeight());
+    if (!isNaN(xPx) && !isNaN(yPx)) {
+        point = [xPx, yPx];
+    }
+    else {
+        // Chart like bar may have there own marker positioning logic
+        if (seriesModel.getMarkerPosition) {
+            // Use the getMarkerPoisition
+            point = seriesModel.getMarkerPosition(
+                data.getValues(dims, idx)
+            );
+        }
+        else {
+            var x = data.get(dims[0], idx);
+            var y = data.get(dims[1], idx);
+            var pt = [x, y];
+            coordSys.clampData && coordSys.clampData(pt, pt);
+            point = coordSys.dataToPoint(pt, true);
+        }
+        if (coordSys.type === 'cartesian2d') {
+            var xAxis = coordSys.getAxis('x');
+            var yAxis = coordSys.getAxis('y');
+            var x = data.get(dims[0], idx);
+            var y = data.get(dims[1], idx);
+            if (isInifinity$1(x)) {
+                point[0] = xAxis.toGlobalCoord(xAxis.getExtent()[dims[0] === 'x0' ? 0 : 1]);
+            }
+            else if (isInifinity$1(y)) {
+                point[1] = yAxis.toGlobalCoord(yAxis.getExtent()[dims[1] === 'y0' ? 0 : 1]);
+            }
+        }
+
+        // Use x, y if has any
+        if (!isNaN(xPx)) {
+            point[0] = xPx;
+        }
+        if (!isNaN(yPx)) {
+            point[1] = yPx;
+        }
+    }
+
+    return point;
+}
+
+var dimPermutations = [['x0', 'y0'], ['x1', 'y0'], ['x1', 'y1'], ['x0', 'y1']];
+
+MarkerView.extend({
+
+    type: 'markArea',
+
+    // updateLayout: function (markAreaModel, ecModel, api) {
+    //     ecModel.eachSeries(function (seriesModel) {
+    //         var maModel = seriesModel.markAreaModel;
+    //         if (maModel) {
+    //             var areaData = maModel.getData();
+    //             areaData.each(function (idx) {
+    //                 var points = zrUtil.map(dimPermutations, function (dim) {
+    //                     return getSingleMarkerEndPoint(areaData, idx, dim, seriesModel, api);
+    //                 });
+    //                 // Layout
+    //                 areaData.setItemLayout(idx, points);
+    //                 var el = areaData.getItemGraphicEl(idx);
+    //                 el.setShape('points', points);
+    //             });
+    //         }
+    //     }, this);
+    // },
+
+    updateTransform: function (markAreaModel, ecModel, api) {
+        ecModel.eachSeries(function (seriesModel) {
+            var maModel = seriesModel.markAreaModel;
+            if (maModel) {
+                var areaData = maModel.getData();
+                areaData.each(function (idx) {
+                    var points = map(dimPermutations, function (dim) {
+                        return getSingleMarkerEndPoint(areaData, idx, dim, seriesModel, api);
+                    });
+                    // Layout
+                    areaData.setItemLayout(idx, points);
+                    var el = areaData.getItemGraphicEl(idx);
+                    el.setShape('points', points);
+                });
+            }
+        }, this);
+    },
+
+    renderSeries: function (seriesModel, maModel, ecModel, api) {
+        var coordSys = seriesModel.coordinateSystem;
+        var seriesId = seriesModel.id;
+        var seriesData = seriesModel.getData();
+
+        var areaGroupMap = this.markerGroupMap;
+        var polygonGroup = areaGroupMap.get(seriesId)
+            || areaGroupMap.set(seriesId, {group: new Group()});
+
+        this.group.add(polygonGroup.group);
+        polygonGroup.__keep = true;
+
+        var areaData = createList$3(coordSys, seriesModel, maModel);
+
+        // Line data for tooltip and formatter
+        maModel.setData(areaData);
+
+        // Update visual and layout of line
+        areaData.each(function (idx) {
+            // Layout
+            areaData.setItemLayout(idx, map(dimPermutations, function (dim) {
+                return getSingleMarkerEndPoint(areaData, idx, dim, seriesModel, api);
+            }));
+
+            // Visual
+            areaData.setItemVisual(idx, {
+                color: seriesData.getVisual('color')
+            });
+        });
+
+
+        areaData.diff(polygonGroup.__data)
+            .add(function (idx) {
+                var polygon = new Polygon({
+                    shape: {
+                        points: areaData.getItemLayout(idx)
+                    }
+                });
+                areaData.setItemGraphicEl(idx, polygon);
+                polygonGroup.group.add(polygon);
+            })
+            .update(function (newIdx, oldIdx) {
+                var polygon = polygonGroup.__data.getItemGraphicEl(oldIdx);
+                updateProps(polygon, {
+                    shape: {
+                        points: areaData.getItemLayout(newIdx)
+                    }
+                }, maModel, newIdx);
+                polygonGroup.group.add(polygon);
+                areaData.setItemGraphicEl(newIdx, polygon);
+            })
+            .remove(function (idx) {
+                var polygon = polygonGroup.__data.getItemGraphicEl(idx);
+                polygonGroup.group.remove(polygon);
+            })
+            .execute();
+
+        areaData.eachItemGraphicEl(function (polygon, idx) {
+            var itemModel = areaData.getItemModel(idx);
+            var labelModel = itemModel.getModel('label');
+            var labelHoverModel = itemModel.getModel('emphasis.label');
+            var color = areaData.getItemVisual(idx, 'color');
+            polygon.useStyle(
+                defaults(
+                    itemModel.getModel('itemStyle').getItemStyle(),
+                    {
+                        fill: modifyAlpha(color, 0.4),
+                        stroke: color
+                    }
+                )
+            );
+
+            polygon.hoverStyle = itemModel.getModel('emphasis.itemStyle').getItemStyle();
+
+            setLabelStyle(
+                polygon.style, polygon.hoverStyle, labelModel, labelHoverModel,
+                {
+                    labelFetcher: maModel,
+                    labelDataIndex: idx,
+                    defaultText: areaData.getName(idx) || '',
+                    isRectText: true,
+                    autoColor: color
+                }
+            );
+
+            setHoverStyle(polygon, {});
+
+            polygon.dataModel = maModel;
+        });
+
+        polygonGroup.__data = areaData;
+
+        polygonGroup.group.silent = maModel.get('silent') || seriesModel.get('silent');
+    }
+});
+
+/**
+ * @inner
+ * @param {module:echarts/coord/*} coordSys
+ * @param {module:echarts/model/Series} seriesModel
+ * @param {module:echarts/model/Model} mpModel
+ */
+function createList$3(coordSys, seriesModel, maModel) {
+
+    var coordDimsInfos;
+    var areaData;
+    var dims = ['x0', 'y0', 'x1', 'y1'];
+    if (coordSys) {
+        coordDimsInfos = map(coordSys && coordSys.dimensions, function (coordDim) {
+            var data = seriesModel.getData();
+            var info = data.getDimensionInfo(
+                data.mapDimension(coordDim)
+            ) || {};
+            // In map series data don't have lng and lat dimension. Fallback to same with coordSys
+            return defaults({name: coordDim}, info);
+        });
+        areaData = new List(map(dims, function (dim, idx) {
+            return {
+                name: dim,
+                type: coordDimsInfos[idx % 2].type
+            };
+        }), maModel);
+    }
+    else {
+        coordDimsInfos =[{
+            name: 'value',
+            type: 'float'
+        }];
+        areaData = new List(coordDimsInfos, maModel);
+    }
+
+    var optData = map(maModel.get('data'), curry(
+        markAreaTransform, seriesModel, coordSys, maModel
+    ));
+    if (coordSys) {
+        optData = filter(
+            optData, curry(markAreaFilter, coordSys)
+        );
+    }
+
+    var dimValueGetter$$1 = coordSys ? function (item, dimName, dataIndex, dimIndex) {
+        return item.coord[Math.floor(dimIndex / 2)][dimIndex % 2];
+    } : function (item) {
+        return item.value;
+    };
+    areaData.initData(optData, null, dimValueGetter$$1);
+    areaData.hasItemOption = true;
+    return areaData;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerPreprocessor(function (opt) {
+    // Make sure markArea component is enabled
+    opt.markArea = opt.markArea || {};
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var preprocessor$3 = function (option) {
+    var timelineOpt = option && option.timeline;
+
+    if (!isArray(timelineOpt)) {
+        timelineOpt = timelineOpt ? [timelineOpt] : [];
+    }
+
+    each$1(timelineOpt, function (opt) {
+        if (!opt) {
+            return;
+        }
+
+        compatibleEC2(opt);
+    });
+};
+
+function compatibleEC2(opt) {
+    var type = opt.type;
+
+    var ec2Types = {'number': 'value', 'time': 'time'};
+
+    // Compatible with ec2
+    if (ec2Types[type]) {
+        opt.axisType = ec2Types[type];
+        delete opt.type;
+    }
+
+    transferItem(opt);
+
+    if (has$2(opt, 'controlPosition')) {
+        var controlStyle = opt.controlStyle || (opt.controlStyle = {});
+        if (!has$2(controlStyle, 'position')) {
+            controlStyle.position = opt.controlPosition;
+        }
+        if (controlStyle.position === 'none' && !has$2(controlStyle, 'show')) {
+            controlStyle.show = false;
+            delete controlStyle.position;
+        }
+        delete opt.controlPosition;
+    }
+
+    each$1(opt.data || [], function (dataItem) {
+        if (isObject$1(dataItem) && !isArray(dataItem)) {
+            if (!has$2(dataItem, 'value') && has$2(dataItem, 'name')) {
+                // In ec2, using name as value.
+                dataItem.value = dataItem.name;
+            }
+            transferItem(dataItem);
+        }
+    });
+}
+
+function transferItem(opt) {
+    var itemStyle = opt.itemStyle || (opt.itemStyle = {});
+
+    var itemStyleEmphasis = itemStyle.emphasis || (itemStyle.emphasis = {});
+
+    // Transfer label out
+    var label = opt.label || (opt.label || {});
+    var labelNormal = label.normal || (label.normal = {});
+    var excludeLabelAttr = {normal: 1, emphasis: 1};
+
+    each$1(label, function (value, name) {
+        if (!excludeLabelAttr[name] && !has$2(labelNormal, name)) {
+            labelNormal[name] = value;
+        }
+    });
+
+    if (itemStyleEmphasis.label && !has$2(label, 'emphasis')) {
+        label.emphasis = itemStyleEmphasis.label;
+        delete itemStyleEmphasis.label;
+    }
+}
+
+function has$2(obj, attr) {
+    return obj.hasOwnProperty(attr);
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+ComponentModel.registerSubTypeDefaulter('timeline', function () {
+    // Only slider now.
+    return 'slider';
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+registerAction(
+
+    {type: 'timelineChange', event: 'timelineChanged', update: 'prepareAndUpdate'},
+
+    function (payload, ecModel) {
+
+        var timelineModel = ecModel.getComponent('timeline');
+        if (timelineModel && payload.currentIndex != null) {
+            timelineModel.setCurrentIndex(payload.currentIndex);
+
+            if (!timelineModel.get('loop', true) && timelineModel.isIndexMax()) {
+                timelineModel.setPlayState(false);
+            }
+        }
+
+        // Set normalized currentIndex to payload.
+        ecModel.resetOption('timeline');
+
+        return defaults({
+            currentIndex: timelineModel.option.currentIndex
+        }, payload);
+    }
+);
+
+registerAction(
+
+    {type: 'timelinePlayChange', event: 'timelinePlayChanged', update: 'update'},
+
+    function (payload, ecModel) {
+        var timelineModel = ecModel.getComponent('timeline');
+        if (timelineModel && payload.playState != null) {
+            timelineModel.setPlayState(payload.playState);
+        }
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TimelineModel = ComponentModel.extend({
+
+    type: 'timeline',
+
+    layoutMode: 'box',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+
+        zlevel: 0,                  // 一级层叠
+        z: 4,                       // 二级层叠
+        show: true,
+
+        axisType: 'time',  // 模式是时间类型，支持 value, category
+
+        realtime: true,
+
+        left: '20%',
+        top: null,
+        right: '20%',
+        bottom: 0,
+        width: null,
+        height: 40,
+        padding: 5,
+
+        controlPosition: 'left',           // 'left' 'right' 'top' 'bottom' 'none'
+        autoPlay: false,
+        rewind: false,                     // 反向播放
+        loop: true,
+        playInterval: 2000,                // 播放时间间隔，单位ms
+
+        currentIndex: 0,
+
+        itemStyle: {},
+        label: {
+            color: '#000'
+        },
+
+        data: []
+    },
+
+    /**
+     * @override
+     */
+    init: function (option, parentModel, ecModel) {
+
+        /**
+         * @private
+         * @type {module:echarts/data/List}
+         */
+        this._data;
+
+        /**
+         * @private
+         * @type {Array.<string>}
+         */
+        this._names;
+
+        this.mergeDefaultAndTheme(option, ecModel);
+        this._initData();
+    },
+
+    /**
+     * @override
+     */
+    mergeOption: function (option) {
+        TimelineModel.superApply(this, 'mergeOption', arguments);
+        this._initData();
+    },
+
+    /**
+     * @param {number} [currentIndex]
+     */
+    setCurrentIndex: function (currentIndex) {
+        if (currentIndex == null) {
+            currentIndex = this.option.currentIndex;
+        }
+        var count = this._data.count();
+
+        if (this.option.loop) {
+            currentIndex = (currentIndex % count + count) % count;
+        }
+        else {
+            currentIndex >= count && (currentIndex = count - 1);
+            currentIndex < 0 && (currentIndex = 0);
+        }
+
+        this.option.currentIndex = currentIndex;
+    },
+
+    /**
+     * @return {number} currentIndex
+     */
+    getCurrentIndex: function () {
+        return this.option.currentIndex;
+    },
+
+    /**
+     * @return {boolean}
+     */
+    isIndexMax: function () {
+        return this.getCurrentIndex() >= this._data.count() - 1;
+    },
+
+    /**
+     * @param {boolean} state true: play, false: stop
+     */
+    setPlayState: function (state) {
+        this.option.autoPlay = !!state;
+    },
+
+    /**
+     * @return {boolean} true: play, false: stop
+     */
+    getPlayState: function () {
+        return !!this.option.autoPlay;
+    },
+
+    /**
+     * @private
+     */
+    _initData: function () {
+        var thisOption = this.option;
+        var dataArr = thisOption.data || [];
+        var axisType = thisOption.axisType;
+        var names = this._names = [];
+
+        if (axisType === 'category') {
+            var idxArr = [];
+            each$1(dataArr, function (item, index) {
+                var value = getDataItemValue(item);
+                var newItem;
+
+                if (isObject$1(item)) {
+                    newItem = clone(item);
+                    newItem.value = index;
+                }
+                else {
+                    newItem = index;
+                }
+
+                idxArr.push(newItem);
+
+                if (!isString(value) && (value == null || isNaN(value))) {
+                    value = '';
+                }
+
+                names.push(value + '');
+            });
+            dataArr = idxArr;
+        }
+
+        var dimType = ({category: 'ordinal', time: 'time'})[axisType] || 'number';
+
+        var data = this._data = new List([{name: 'value', type: dimType}], this);
+
+        data.initData(dataArr, names);
+    },
+
+    getData: function () {
+        return this._data;
+    },
+
+    /**
+     * @public
+     * @return {Array.<string>} categoreis
+     */
+    getCategories: function () {
+        if (this.get('axisType') === 'category') {
+            return this._names.slice();
+        }
+    }
+
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var SliderTimelineModel = TimelineModel.extend({
+
+    type: 'timeline.slider',
+
+    /**
+     * @protected
+     */
+    defaultOption: {
+
+        backgroundColor: 'rgba(0,0,0,0)',   // 时间轴背景颜色
+        borderColor: '#ccc',               // 时间轴边框颜色
+        borderWidth: 0,                    // 时间轴边框线宽，单位px，默认为0（无边框）
+
+        orient: 'horizontal',              // 'vertical'
+        inverse: false,
+
+        tooltip: {                          // boolean or Object
+            trigger: 'item'                 // data item may also have tootip attr.
+        },
+
+        symbol: 'emptyCircle',
+        symbolSize: 10,
+
+        lineStyle: {
+            show: true,
+            width: 2,
+            color: '#304654'
+        },
+        label: {                            // 文本标签
+            position: 'auto',           // auto left right top bottom
+                                        // When using number, label position is not
+                                        // restricted by viewRect.
+                                        // positive: right/bottom, negative: left/top
+            show: true,
+            interval: 'auto',
+            rotate: 0,
+            // formatter: null,
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            color: '#304654'
+        },
+        itemStyle: {
+            color: '#304654',
+            borderWidth: 1
+        },
+
+        checkpointStyle: {
+            symbol: 'circle',
+            symbolSize: 13,
+            color: '#c23531',
+            borderWidth: 5,
+            borderColor: 'rgba(194,53,49, 0.5)',
+            animation: true,
+            animationDuration: 300,
+            animationEasing: 'quinticInOut'
+        },
+
+        controlStyle: {
+            show: true,
+            showPlayBtn: true,
+            showPrevBtn: true,
+            showNextBtn: true,
+            itemSize: 22,
+            itemGap: 12,
+            position: 'left',  // 'left' 'right' 'top' 'bottom'
+            playIcon: 'path://M31.6,53C17.5,53,6,41.5,6,27.4S17.5,1.8,31.6,1.8C45.7,1.8,57.2,13.3,57.2,27.4S45.7,53,31.6,53z M31.6,3.3 C18.4,3.3,7.5,14.1,7.5,27.4c0,13.3,10.8,24.1,24.1,24.1C44.9,51.5,55.7,40.7,55.7,27.4C55.7,14.1,44.9,3.3,31.6,3.3z M24.9,21.3 c0-2.2,1.6-3.1,3.5-2l10.5,6.1c1.899,1.1,1.899,2.9,0,4l-10.5,6.1c-1.9,1.1-3.5,0.2-3.5-2V21.3z', // jshint ignore:line
+            stopIcon: 'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z', // jshint ignore:line
+            nextIcon: 'path://M18.6,50.8l22.5-22.5c0.2-0.2,0.3-0.4,0.3-0.7c0-0.3-0.1-0.5-0.3-0.7L18.7,4.4c-0.1-0.1-0.2-0.3-0.2-0.5 c0-0.4,0.3-0.8,0.8-0.8c0.2,0,0.5,0.1,0.6,0.3l23.5,23.5l0,0c0.2,0.2,0.3,0.4,0.3,0.7c0,0.3-0.1,0.5-0.3,0.7l-0.1,0.1L19.7,52 c-0.1,0.1-0.3,0.2-0.5,0.2c-0.4,0-0.8-0.3-0.8-0.8C18.4,51.2,18.5,51,18.6,50.8z', // jshint ignore:line
+            prevIcon: 'path://M43,52.8L20.4,30.3c-0.2-0.2-0.3-0.4-0.3-0.7c0-0.3,0.1-0.5,0.3-0.7L42.9,6.4c0.1-0.1,0.2-0.3,0.2-0.5 c0-0.4-0.3-0.8-0.8-0.8c-0.2,0-0.5,0.1-0.6,0.3L18.3,28.8l0,0c-0.2,0.2-0.3,0.4-0.3,0.7c0,0.3,0.1,0.5,0.3,0.7l0.1,0.1L41.9,54 c0.1,0.1,0.3,0.2,0.5,0.2c0.4,0,0.8-0.3,0.8-0.8C43.2,53.2,43.1,53,43,52.8z', // jshint ignore:line
+
+            color: '#304654',
+            borderColor: '#304654',
+            borderWidth: 1
+        },
+
+        emphasis: {
+            label: {
+                show: true,
+                // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+                color: '#c23531'
+            },
+
+            itemStyle: {
+                color: '#c23531'
+            },
+
+            controlStyle: {
+                color: '#c23531',
+                borderColor: '#c23531',
+                borderWidth: 2
+            }
+        },
+        data: []
+    }
+
+});
+
+mixin(SliderTimelineModel, dataFormatMixin);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var TimelineView = Component.extend({
+    type: 'timeline'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * Extend axis 2d
+ * @constructor module:echarts/coord/cartesian/Axis2D
+ * @extends {module:echarts/coord/cartesian/Axis}
+ * @param {string} dim
+ * @param {*} scale
+ * @param {Array.<number>} coordExtent
+ * @param {string} axisType
+ * @param {string} position
+ */
+var TimelineAxis = function (dim, scale, coordExtent, axisType) {
+
+    Axis.call(this, dim, scale, coordExtent);
+
+    /**
+     * Axis type
+     *  - 'category'
+     *  - 'value'
+     *  - 'time'
+     *  - 'log'
+     * @type {string}
+     */
+    this.type = axisType || 'value';
+
+    /**
+     * Axis model
+     * @param {module:echarts/component/TimelineModel}
+     */
+    this.model = null;
+};
+
+TimelineAxis.prototype = {
+
+    constructor: TimelineAxis,
+
+    /**
+     * @override
+     */
+    getLabelModel: function () {
+        return this.model.getModel('label');
+    },
+
+    /**
+     * @override
+     */
+    isHorizontal: function () {
+        return this.model.get('orient') === 'horizontal';
+    }
+
+};
+
+inherits(TimelineAxis, Axis);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var bind$6 = bind;
+var each$27 = each$1;
+
+var PI$4 = Math.PI;
+
+TimelineView.extend({
+
+    type: 'timeline.slider',
+
+    init: function (ecModel, api) {
+
+        this.api = api;
+
+        /**
+         * @private
+         * @type {module:echarts/component/timeline/TimelineAxis}
+         */
+        this._axis;
+
+        /**
+         * @private
+         * @type {module:zrender/core/BoundingRect}
+         */
+        this._viewRect;
+
+        /**
+         * @type {number}
+         */
+        this._timer;
+
+        /**
+         * @type {module:zrender/Element}
+         */
+        this._currentPointer;
+
+        /**
+         * @type {module:zrender/container/Group}
+         */
+        this._mainGroup;
+
+        /**
+         * @type {module:zrender/container/Group}
+         */
+        this._labelGroup;
+    },
+
+    /**
+     * @override
+     */
+    render: function (timelineModel, ecModel, api, payload) {
+        this.model = timelineModel;
+        this.api = api;
+        this.ecModel = ecModel;
+
+        this.group.removeAll();
+
+        if (timelineModel.get('show', true)) {
+
+            var layoutInfo = this._layout(timelineModel, api);
+            var mainGroup = this._createGroup('mainGroup');
+            var labelGroup = this._createGroup('labelGroup');
+
+            /**
+             * @private
+             * @type {module:echarts/component/timeline/TimelineAxis}
+             */
+            var axis = this._axis = this._createAxis(layoutInfo, timelineModel);
+
+            timelineModel.formatTooltip = function (dataIndex) {
+                return encodeHTML(axis.scale.getLabel(dataIndex));
+            };
+
+            each$27(
+                ['AxisLine', 'AxisTick', 'Control', 'CurrentPointer'],
+                function (name) {
+                    this['_render' + name](layoutInfo, mainGroup, axis, timelineModel);
+                },
+                this
+            );
+
+            this._renderAxisLabel(layoutInfo, labelGroup, axis, timelineModel);
+            this._position(layoutInfo, timelineModel);
+        }
+
+        this._doPlayStop();
+    },
+
+    /**
+     * @override
+     */
+    remove: function () {
+        this._clearTimer();
+        this.group.removeAll();
+    },
+
+    /**
+     * @override
+     */
+    dispose: function () {
+        this._clearTimer();
+    },
+
+    _layout: function (timelineModel, api) {
+        var labelPosOpt = timelineModel.get('label.position');
+        var orient = timelineModel.get('orient');
+        var viewRect = getViewRect$4(timelineModel, api);
+        // Auto label offset.
+        if (labelPosOpt == null || labelPosOpt === 'auto') {
+            labelPosOpt = orient === 'horizontal'
+                ? ((viewRect.y + viewRect.height / 2) < api.getHeight() / 2 ? '-' : '+')
+                : ((viewRect.x + viewRect.width / 2) < api.getWidth() / 2 ? '+' : '-');
+        }
+        else if (isNaN(labelPosOpt)) {
+            labelPosOpt = ({
+                horizontal: {top: '-', bottom: '+'},
+                vertical: {left: '-', right: '+'}
+            })[orient][labelPosOpt];
+        }
+
+        var labelAlignMap = {
+            horizontal: 'center',
+            vertical: (labelPosOpt >= 0 || labelPosOpt === '+') ? 'left' : 'right'
+        };
+
+        var labelBaselineMap = {
+            horizontal: (labelPosOpt >= 0 || labelPosOpt === '+') ? 'top' : 'bottom',
+            vertical: 'middle'
+        };
+        var rotationMap = {
+            horizontal: 0,
+            vertical: PI$4 / 2
+        };
+
+        // Position
+        var mainLength = orient === 'vertical' ? viewRect.height : viewRect.width;
+
+        var controlModel = timelineModel.getModel('controlStyle');
+        var showControl = controlModel.get('show', true);
+        var controlSize = showControl ? controlModel.get('itemSize') : 0;
+        var controlGap = showControl ? controlModel.get('itemGap') : 0;
+        var sizePlusGap = controlSize + controlGap;
+
+        // Special label rotate.
+        var labelRotation = timelineModel.get('label.rotate') || 0;
+        labelRotation = labelRotation * PI$4 / 180; // To radian.
+
+        var playPosition;
+        var prevBtnPosition;
+        var nextBtnPosition;
+        var axisExtent;
+        var controlPosition = controlModel.get('position', true);
+        var showPlayBtn = showControl && controlModel.get('showPlayBtn', true);
+        var showPrevBtn = showControl && controlModel.get('showPrevBtn', true);
+        var showNextBtn = showControl && controlModel.get('showNextBtn', true);
+        var xLeft = 0;
+        var xRight = mainLength;
+
+        // position[0] means left, position[1] means middle.
+        if (controlPosition === 'left' || controlPosition === 'bottom') {
+            showPlayBtn && (playPosition = [0, 0], xLeft += sizePlusGap);
+            showPrevBtn && (prevBtnPosition = [xLeft, 0], xLeft += sizePlusGap);
+            showNextBtn && (nextBtnPosition = [xRight - controlSize, 0], xRight -= sizePlusGap);
+        }
+        else { // 'top' 'right'
+            showPlayBtn && (playPosition = [xRight - controlSize, 0], xRight -= sizePlusGap);
+            showPrevBtn && (prevBtnPosition = [0, 0], xLeft += sizePlusGap);
+            showNextBtn && (nextBtnPosition = [xRight - controlSize, 0], xRight -= sizePlusGap);
+        }
+        axisExtent = [xLeft, xRight];
+
+        if (timelineModel.get('inverse')) {
+            axisExtent.reverse();
+        }
+
+        return {
+            viewRect: viewRect,
+            mainLength: mainLength,
+            orient: orient,
+
+            rotation: rotationMap[orient],
+            labelRotation: labelRotation,
+            labelPosOpt: labelPosOpt,
+            labelAlign: timelineModel.get('label.align') || labelAlignMap[orient],
+            labelBaseline: timelineModel.get('label.verticalAlign')
+                || timelineModel.get('label.baseline')
+                || labelBaselineMap[orient],
+
+            // Based on mainGroup.
+            playPosition: playPosition,
+            prevBtnPosition: prevBtnPosition,
+            nextBtnPosition: nextBtnPosition,
+            axisExtent: axisExtent,
+
+            controlSize: controlSize,
+            controlGap: controlGap
+        };
+    },
+
+    _position: function (layoutInfo, timelineModel) {
+        // Position is be called finally, because bounding rect is needed for
+        // adapt content to fill viewRect (auto adapt offset).
+
+        // Timeline may be not all in the viewRect when 'offset' is specified
+        // as a number, because it is more appropriate that label aligns at
+        // 'offset' but not the other edge defined by viewRect.
+
+        var mainGroup = this._mainGroup;
+        var labelGroup = this._labelGroup;
+
+        var viewRect = layoutInfo.viewRect;
+        if (layoutInfo.orient === 'vertical') {
+            // transform to horizontal, inverse rotate by left-top point.
+            var m = create$1();
+            var rotateOriginX = viewRect.x;
+            var rotateOriginY = viewRect.y + viewRect.height;
+            translate(m, m, [-rotateOriginX, -rotateOriginY]);
+            rotate(m, m, -PI$4 / 2);
+            translate(m, m, [rotateOriginX, rotateOriginY]);
+            viewRect = viewRect.clone();
+            viewRect.applyTransform(m);
+        }
+
+        var viewBound = getBound(viewRect);
+        var mainBound = getBound(mainGroup.getBoundingRect());
+        var labelBound = getBound(labelGroup.getBoundingRect());
+
+        var mainPosition = mainGroup.position;
+        var labelsPosition = labelGroup.position;
+
+        labelsPosition[0] = mainPosition[0] = viewBound[0][0];
+
+        var labelPosOpt = layoutInfo.labelPosOpt;
+
+        if (isNaN(labelPosOpt)) { // '+' or '-'
+            var mainBoundIdx = labelPosOpt === '+' ? 0 : 1;
+            toBound(mainPosition, mainBound, viewBound, 1, mainBoundIdx);
+            toBound(labelsPosition, labelBound, viewBound, 1, 1 - mainBoundIdx);
+        }
+        else {
+            var mainBoundIdx = labelPosOpt >= 0 ? 0 : 1;
+            toBound(mainPosition, mainBound, viewBound, 1, mainBoundIdx);
+            labelsPosition[1] = mainPosition[1] + labelPosOpt;
+        }
+
+        mainGroup.attr('position', mainPosition);
+        labelGroup.attr('position', labelsPosition);
+        mainGroup.rotation = labelGroup.rotation = layoutInfo.rotation;
+
+        setOrigin(mainGroup);
+        setOrigin(labelGroup);
+
+        function setOrigin(targetGroup) {
+            var pos = targetGroup.position;
+            targetGroup.origin = [
+                viewBound[0][0] - pos[0],
+                viewBound[1][0] - pos[1]
+            ];
+        }
+
+        function getBound(rect) {
+            // [[xmin, xmax], [ymin, ymax]]
+            return [
+                [rect.x, rect.x + rect.width],
+                [rect.y, rect.y + rect.height]
+            ];
+        }
+
+        function toBound(fromPos, from, to, dimIdx, boundIdx) {
+            fromPos[dimIdx] += to[dimIdx][boundIdx] - from[dimIdx][boundIdx];
+        }
+    },
+
+    _createAxis: function (layoutInfo, timelineModel) {
+        var data = timelineModel.getData();
+        var axisType = timelineModel.get('axisType');
+
+        var scale = createScaleByModel(timelineModel, axisType);
+
+        // Customize scale. The `tickValue` is `dataIndex`.
+        scale.getTicks = function () {
+            return data.mapArray(['value'], function (value) {
+                return value;
+            });
+        };
+
+        var dataExtent = data.getDataExtent('value');
+        scale.setExtent(dataExtent[0], dataExtent[1]);
+        scale.niceTicks();
+
+        var axis = new TimelineAxis('value', scale, layoutInfo.axisExtent, axisType);
+        axis.model = timelineModel;
+
+        return axis;
+    },
+
+    _createGroup: function (name) {
+        var newGroup = this['_' + name] = new Group();
+        this.group.add(newGroup);
+        return newGroup;
+    },
+
+    _renderAxisLine: function (layoutInfo, group, axis, timelineModel) {
+        var axisExtent = axis.getExtent();
+
+        if (!timelineModel.get('lineStyle.show')) {
+            return;
+        }
+
+        group.add(new Line({
+            shape: {
+                x1: axisExtent[0], y1: 0,
+                x2: axisExtent[1], y2: 0
+            },
+            style: extend(
+                {lineCap: 'round'},
+                timelineModel.getModel('lineStyle').getLineStyle()
+            ),
+            silent: true,
+            z2: 1
+        }));
+    },
+
+    /**
+     * @private
+     */
+    _renderAxisTick: function (layoutInfo, group, axis, timelineModel) {
+        var data = timelineModel.getData();
+        // Show all ticks, despite ignoring strategy.
+        var ticks = axis.scale.getTicks();
+
+        // The value is dataIndex, see the costomized scale.
+        each$27(ticks, function (value) {
+            var tickCoord = axis.dataToCoord(value);
+            var itemModel = data.getItemModel(value);
+            var itemStyleModel = itemModel.getModel('itemStyle');
+            var hoverStyleModel = itemModel.getModel('emphasis.itemStyle');
+            var symbolOpt = {
+                position: [tickCoord, 0],
+                onclick: bind$6(this._changeTimeline, this, value)
+            };
+            var el = giveSymbol(itemModel, itemStyleModel, group, symbolOpt);
+            setHoverStyle(el, hoverStyleModel.getItemStyle());
+
+            if (itemModel.get('tooltip')) {
+                el.dataIndex = value;
+                el.dataModel = timelineModel;
+            }
+            else {
+                el.dataIndex = el.dataModel = null;
+            }
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _renderAxisLabel: function (layoutInfo, group, axis, timelineModel) {
+        var labelModel = axis.getLabelModel();
+
+        if (!labelModel.get('show')) {
+            return;
+        }
+
+        var data = timelineModel.getData();
+        var labels = axis.getViewLabels();
+
+        each$27(labels, function (labelItem) {
+            // The tickValue is dataIndex, see the costomized scale.
+            var dataIndex = labelItem.tickValue;
+
+            var itemModel = data.getItemModel(dataIndex);
+            var normalLabelModel = itemModel.getModel('label');
+            var hoverLabelModel = itemModel.getModel('emphasis.label');
+            var tickCoord = axis.dataToCoord(labelItem.tickValue);
+            var textEl = new Text({
+                position: [tickCoord, 0],
+                rotation: layoutInfo.labelRotation - layoutInfo.rotation,
+                onclick: bind$6(this._changeTimeline, this, dataIndex),
+                silent: false
+            });
+            setTextStyle(textEl.style, normalLabelModel, {
+                text: labelItem.formattedLabel,
+                textAlign: layoutInfo.labelAlign,
+                textVerticalAlign: layoutInfo.labelBaseline
+            });
+
+            group.add(textEl);
+            setHoverStyle(
+                textEl, setTextStyle({}, hoverLabelModel)
+            );
+
+        }, this);
+    },
+
+    /**
+     * @private
+     */
+    _renderControl: function (layoutInfo, group, axis, timelineModel) {
+        var controlSize = layoutInfo.controlSize;
+        var rotation = layoutInfo.rotation;
+
+        var itemStyle = timelineModel.getModel('controlStyle').getItemStyle();
+        var hoverStyle = timelineModel.getModel('emphasis.controlStyle').getItemStyle();
+        var rect = [0, -controlSize / 2, controlSize, controlSize];
+        var playState = timelineModel.getPlayState();
+        var inverse = timelineModel.get('inverse', true);
+
+        makeBtn(
+            layoutInfo.nextBtnPosition,
+            'controlStyle.nextIcon',
+            bind$6(this._changeTimeline, this, inverse ? '-' : '+')
+        );
+        makeBtn(
+            layoutInfo.prevBtnPosition,
+            'controlStyle.prevIcon',
+            bind$6(this._changeTimeline, this, inverse ? '+' : '-')
+        );
+        makeBtn(
+            layoutInfo.playPosition,
+            'controlStyle.' + (playState ? 'stopIcon' : 'playIcon'),
+            bind$6(this._handlePlayClick, this, !playState),
+            true
+        );
+
+        function makeBtn(position, iconPath, onclick, willRotate) {
+            if (!position) {
+                return;
+            }
+            var opt = {
+                position: position,
+                origin: [controlSize / 2, 0],
+                rotation: willRotate ? -rotation : 0,
+                rectHover: true,
+                style: itemStyle,
+                onclick: onclick
+            };
+            var btn = makeIcon(timelineModel, iconPath, rect, opt);
+            group.add(btn);
+            setHoverStyle(btn, hoverStyle);
+        }
+    },
+
+    _renderCurrentPointer: function (layoutInfo, group, axis, timelineModel) {
+        var data = timelineModel.getData();
+        var currentIndex = timelineModel.getCurrentIndex();
+        var pointerModel = data.getItemModel(currentIndex).getModel('checkpointStyle');
+        var me = this;
+
+        var callback = {
+            onCreate: function (pointer) {
+                pointer.draggable = true;
+                pointer.drift = bind$6(me._handlePointerDrag, me);
+                pointer.ondragend = bind$6(me._handlePointerDragend, me);
+                pointerMoveTo(pointer, currentIndex, axis, timelineModel, true);
+            },
+            onUpdate: function (pointer) {
+                pointerMoveTo(pointer, currentIndex, axis, timelineModel);
+            }
+        };
+
+        // Reuse when exists, for animation and drag.
+        this._currentPointer = giveSymbol(
+            pointerModel, pointerModel, this._mainGroup, {}, this._currentPointer, callback
+        );
+    },
+
+    _handlePlayClick: function (nextState) {
+        this._clearTimer();
+        this.api.dispatchAction({
+            type: 'timelinePlayChange',
+            playState: nextState,
+            from: this.uid
+        });
+    },
+
+    _handlePointerDrag: function (dx, dy, e) {
+        this._clearTimer();
+        this._pointerChangeTimeline([e.offsetX, e.offsetY]);
+    },
+
+    _handlePointerDragend: function (e) {
+        this._pointerChangeTimeline([e.offsetX, e.offsetY], true);
+    },
+
+    _pointerChangeTimeline: function (mousePos, trigger) {
+        var toCoord = this._toAxisCoord(mousePos)[0];
+
+        var axis = this._axis;
+        var axisExtent = asc(axis.getExtent().slice());
+
+        toCoord > axisExtent[1] && (toCoord = axisExtent[1]);
+        toCoord < axisExtent[0] && (toCoord = axisExtent[0]);
+
+        this._currentPointer.position[0] = toCoord;
+        this._currentPointer.dirty();
+
+        var targetDataIndex = this._findNearestTick(toCoord);
+        var timelineModel = this.model;
+
+        if (trigger || (
+            targetDataIndex !== timelineModel.getCurrentIndex()
+            && timelineModel.get('realtime')
+        )) {
+            this._changeTimeline(targetDataIndex);
+        }
+    },
+
+    _doPlayStop: function () {
+        this._clearTimer();
+
+        if (this.model.getPlayState()) {
+            this._timer = setTimeout(
+                bind$6(handleFrame, this),
+                this.model.get('playInterval')
+            );
+        }
+
+        function handleFrame() {
+            // Do not cache
+            var timelineModel = this.model;
+            this._changeTimeline(
+                timelineModel.getCurrentIndex()
+                + (timelineModel.get('rewind', true) ? -1 : 1)
+            );
+        }
+    },
+
+    _toAxisCoord: function (vertex) {
+        var trans = this._mainGroup.getLocalTransform();
+        return applyTransform$1(vertex, trans, true);
+    },
+
+    _findNearestTick: function (axisCoord) {
+        var data = this.model.getData();
+        var dist = Infinity;
+        var targetDataIndex;
+        var axis = this._axis;
+
+        data.each(['value'], function (value, dataIndex) {
+            var coord = axis.dataToCoord(value);
+            var d = Math.abs(coord - axisCoord);
+            if (d < dist) {
+                dist = d;
+                targetDataIndex = dataIndex;
+            }
+        });
+
+        return targetDataIndex;
+    },
+
+    _clearTimer: function () {
+        if (this._timer) {
+            clearTimeout(this._timer);
+            this._timer = null;
+        }
+    },
+
+    _changeTimeline: function (nextIndex) {
+        var currentIndex = this.model.getCurrentIndex();
+
+        if (nextIndex === '+') {
+            nextIndex = currentIndex + 1;
+        }
+        else if (nextIndex === '-') {
+            nextIndex = currentIndex - 1;
+        }
+
+        this.api.dispatchAction({
+            type: 'timelineChange',
+            currentIndex: nextIndex,
+            from: this.uid
+        });
+    }
+
+});
+
+function getViewRect$4(model, api) {
+    return getLayoutRect(
+        model.getBoxLayoutParams(),
+        {
+            width: api.getWidth(),
+            height: api.getHeight()
+        },
+        model.get('padding')
+    );
+}
+
+function makeIcon(timelineModel, objPath, rect, opts) {
+    var icon = makePath(
+        timelineModel.get(objPath).replace(/^path:\/\//, ''),
+        clone(opts || {}),
+        new BoundingRect(rect[0], rect[1], rect[2], rect[3]),
+        'center'
+    );
+
+    return icon;
+}
+
+/**
+ * Create symbol or update symbol
+ * opt: basic position and event handlers
+ */
+function giveSymbol(hostModel, itemStyleModel, group, opt, symbol, callback) {
+    var color = itemStyleModel.get('color');
+
+    if (!symbol) {
+        var symbolType = hostModel.get('symbol');
+        symbol = createSymbol(symbolType, -1, -1, 2, 2, color);
+        symbol.setStyle('strokeNoScale', true);
+        group.add(symbol);
+        callback && callback.onCreate(symbol);
+    }
+    else {
+        symbol.setColor(color);
+        group.add(symbol); // Group may be new, also need to add.
+        callback && callback.onUpdate(symbol);
+    }
+
+    // Style
+    var itemStyle = itemStyleModel.getItemStyle(['color', 'symbol', 'symbolSize']);
+    symbol.setStyle(itemStyle);
+
+    // Transform and events.
+    opt = merge({
+        rectHover: true,
+        z2: 100
+    }, opt, true);
+
+    var symbolSize = hostModel.get('symbolSize');
+    symbolSize = symbolSize instanceof Array
+        ? symbolSize.slice()
+        : [+symbolSize, +symbolSize];
+    symbolSize[0] /= 2;
+    symbolSize[1] /= 2;
+    opt.scale = symbolSize;
+
+    var symbolOffset = hostModel.get('symbolOffset');
+    if (symbolOffset) {
+        var pos = opt.position = opt.position || [0, 0];
+        pos[0] += parsePercent$1(symbolOffset[0], symbolSize[0]);
+        pos[1] += parsePercent$1(symbolOffset[1], symbolSize[1]);
+    }
+
+    var symbolRotate = hostModel.get('symbolRotate');
+    opt.rotation = (symbolRotate || 0) * Math.PI / 180 || 0;
+
+    symbol.attr(opt);
+
+    // FIXME
+    // (1) When symbol.style.strokeNoScale is true and updateTransform is not performed,
+    // getBoundingRect will return wrong result.
+    // (This is supposed to be resolved in zrender, but it is a little difficult to
+    // leverage performance and auto updateTransform)
+    // (2) All of ancesters of symbol do not scale, so we can just updateTransform symbol.
+    symbol.updateTransform();
+
+    return symbol;
+}
+
+function pointerMoveTo(pointer, dataIndex, axis, timelineModel, noAnimation) {
+    if (pointer.dragging) {
+        return;
+    }
+
+    var pointerModel = timelineModel.getModel('checkpointStyle');
+    var toCoord = axis.dataToCoord(timelineModel.getData().get(['value'], dataIndex));
+
+    if (noAnimation || !pointerModel.get('animation', true)) {
+        pointer.attr({position: [toCoord, 0]});
+    }
+    else {
+        pointer.stopAnimation(true);
+        pointer.animateTo(
+            {position: [toCoord, 0]},
+            pointerModel.get('animationDuration', true),
+            pointerModel.get('animationEasing', true)
+        );
+    }
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+registerPreprocessor(preprocessor$3);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var ToolboxModel = extendComponentModel({
+
+    type: 'toolbox',
+
+    layoutMode: {
+        type: 'box',
+        ignoreSize: true
+    },
+
+    optionUpdated: function () {
+        ToolboxModel.superApply(this, 'optionUpdated', arguments);
+
+        each$1(this.option.feature, function (featureOpt, featureName) {
+            var Feature = get$1(featureName);
+            Feature && merge(featureOpt, Feature.defaultOption);
+        });
+    },
+
+    defaultOption: {
+
+        show: true,
+
+        z: 6,
+
+        zlevel: 0,
+
+        orient: 'horizontal',
+
+        left: 'right',
+
+        top: 'top',
+
+        // right
+        // bottom
+
+        backgroundColor: 'transparent',
+
+        borderColor: '#ccc',
+
+        borderRadius: 0,
+
+        borderWidth: 0,
+
+        padding: 5,
+
+        itemSize: 15,
+
+        itemGap: 8,
+
+        showTitle: true,
+
+        iconStyle: {
+            borderColor: '#666',
+            color: 'none'
+        },
+        emphasis: {
+            iconStyle: {
+                borderColor: '#3E98C5'
+            }
+        }
+        // textStyle: {},
+
+        // feature
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+extendComponentView({
+
+    type: 'toolbox',
+
+    render: function (toolboxModel, ecModel, api, payload) {
+        var group = this.group;
+        group.removeAll();
+
+        if (!toolboxModel.get('show')) {
+            return;
+        }
+
+        var itemSize = +toolboxModel.get('itemSize');
+        var featureOpts = toolboxModel.get('feature') || {};
+        var features = this._features || (this._features = {});
+
+        var featureNames = [];
+        each$1(featureOpts, function (opt, name) {
+            featureNames.push(name);
+        });
+
+        (new DataDiffer(this._featureNames || [], featureNames))
+            .add(processFeature)
+            .update(processFeature)
+            .remove(curry(processFeature, null))
+            .execute();
+
+        // Keep for diff.
+        this._featureNames = featureNames;
+
+        function processFeature(newIndex, oldIndex) {
+            var featureName = featureNames[newIndex];
+            var oldName = featureNames[oldIndex];
+            var featureOpt = featureOpts[featureName];
+            var featureModel = new Model(featureOpt, toolboxModel, toolboxModel.ecModel);
+            var feature;
+
+            if (featureName && !oldName) { // Create
+                if (isUserFeatureName(featureName)) {
+                    feature = {
+                        model: featureModel,
+                        onclick: featureModel.option.onclick,
+                        featureName: featureName
+                    };
+                }
+                else {
+                    var Feature = get$1(featureName);
+                    if (!Feature) {
+                        return;
+                    }
+                    feature = new Feature(featureModel, ecModel, api);
+                }
+                features[featureName] = feature;
+            }
+            else {
+                feature = features[oldName];
+                // If feature does not exsit.
+                if (!feature) {
+                    return;
+                }
+                feature.model = featureModel;
+                feature.ecModel = ecModel;
+                feature.api = api;
+            }
+
+            if (!featureName && oldName) {
+                feature.dispose && feature.dispose(ecModel, api);
+                return;
+            }
+
+            if (!featureModel.get('show') || feature.unusable) {
+                feature.remove && feature.remove(ecModel, api);
+                return;
+            }
+
+            createIconPaths(featureModel, feature, featureName);
+
+            featureModel.setIconStatus = function (iconName, status) {
+                var option = this.option;
+                var iconPaths = this.iconPaths;
+                option.iconStatus = option.iconStatus || {};
+                option.iconStatus[iconName] = status;
+                // FIXME
+                iconPaths[iconName] && iconPaths[iconName].trigger(status);
+            };
+
+            if (feature.render) {
+                feature.render(featureModel, ecModel, api, payload);
+            }
+        }
+
+        function createIconPaths(featureModel, feature, featureName) {
+            var iconStyleModel = featureModel.getModel('iconStyle');
+            var iconStyleEmphasisModel = featureModel.getModel('emphasis.iconStyle');
+
+            // If one feature has mutiple icon. they are orginaized as
+            // {
+            //     icon: {
+            //         foo: '',
+            //         bar: ''
+            //     },
+            //     title: {
+            //         foo: '',
+            //         bar: ''
+            //     }
+            // }
+            var icons = feature.getIcons ? feature.getIcons() : featureModel.get('icon');
+            var titles = featureModel.get('title') || {};
+            if (typeof icons === 'string') {
+                var icon = icons;
+                var title = titles;
+                icons = {};
+                titles = {};
+                icons[featureName] = icon;
+                titles[featureName] = title;
+            }
+            var iconPaths = featureModel.iconPaths = {};
+            each$1(icons, function (iconStr, iconName) {
+                var path = createIcon(
+                    iconStr,
+                    {},
+                    {
+                        x: -itemSize / 2,
+                        y: -itemSize / 2,
+                        width: itemSize,
+                        height: itemSize
+                    }
+                );
+                path.setStyle(iconStyleModel.getItemStyle());
+                path.hoverStyle = iconStyleEmphasisModel.getItemStyle();
+
+                setHoverStyle(path);
+
+                if (toolboxModel.get('showTitle')) {
+                    path.__title = titles[iconName];
+                    path.on('mouseover', function () {
+                            // Should not reuse above hoverStyle, which might be modified.
+                            var hoverStyle = iconStyleEmphasisModel.getItemStyle();
+                            path.setStyle({
+                                text: titles[iconName],
+                                textPosition: hoverStyle.textPosition || 'bottom',
+                                textFill: hoverStyle.fill || hoverStyle.stroke || '#000',
+                                textAlign: hoverStyle.textAlign || 'center'
+                            });
+                        })
+                        .on('mouseout', function () {
+                            path.setStyle({
+                                textFill: null
+                            });
+                        });
+                }
+                path.trigger(featureModel.get('iconStatus.' + iconName) || 'normal');
+
+                group.add(path);
+                path.on('click', bind(
+                    feature.onclick, feature, ecModel, api, iconName
+                ));
+
+                iconPaths[iconName] = path;
+            });
+        }
+
+        layout$3(group, toolboxModel, api);
+        // Render background after group is layout
+        // FIXME
+        group.add(makeBackground(group.getBoundingRect(), toolboxModel));
+
+        // Adjust icon title positions to avoid them out of screen
+        group.eachChild(function (icon) {
+            var titleText = icon.__title;
+            var hoverStyle = icon.hoverStyle;
+            // May be background element
+            if (hoverStyle && titleText) {
+                var rect = getBoundingRect(
+                    titleText, makeFont(hoverStyle)
+                );
+                var offsetX = icon.position[0] + group.position[0];
+                var offsetY = icon.position[1] + group.position[1] + itemSize;
+
+                var needPutOnTop = false;
+                if (offsetY + rect.height > api.getHeight()) {
+                    hoverStyle.textPosition = 'top';
+                    needPutOnTop = true;
+                }
+                var topOffset = needPutOnTop ? (-5 - rect.height) : (itemSize + 8);
+                if (offsetX + rect.width /  2 > api.getWidth()) {
+                    hoverStyle.textPosition = ['100%', topOffset];
+                    hoverStyle.textAlign = 'right';
+                }
+                else if (offsetX - rect.width / 2 < 0) {
+                    hoverStyle.textPosition = [0, topOffset];
+                    hoverStyle.textAlign = 'left';
+                }
+            }
+        });
+    },
+
+    updateView: function (toolboxModel, ecModel, api, payload) {
+        each$1(this._features, function (feature) {
+            feature.updateView && feature.updateView(feature.model, ecModel, api, payload);
+        });
+    },
+
+    // updateLayout: function (toolboxModel, ecModel, api, payload) {
+    //     zrUtil.each(this._features, function (feature) {
+    //         feature.updateLayout && feature.updateLayout(feature.model, ecModel, api, payload);
+    //     });
+    // },
+
+    remove: function (ecModel, api) {
+        each$1(this._features, function (feature) {
+            feature.remove && feature.remove(ecModel, api);
+        });
+        this.group.removeAll();
+    },
+
+    dispose: function (ecModel, api) {
+        each$1(this._features, function (feature) {
+            feature.dispose && feature.dispose(ecModel, api);
+        });
+    }
+});
+
+function isUserFeatureName(featureName) {
+    return featureName.indexOf('my') === 0;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var saveAsImageLang = lang.toolbox.saveAsImage;
+
+function SaveAsImage(model) {
+    this.model = model;
+}
+
+SaveAsImage.defaultOption = {
+    show: true,
+    icon: 'M4.7,22.9L29.3,45.5L54.7,23.4M4.6,43.6L4.6,58L53.8,58L53.8,43.6M29.2,45.1L29.2,0',
+    title: saveAsImageLang.title,
+    type: 'png',
+    // Default use option.backgroundColor
+    // backgroundColor: '#fff',
+    name: '',
+    excludeComponents: ['toolbox'],
+    pixelRatio: 1,
+    lang: saveAsImageLang.lang.slice()
+};
+
+SaveAsImage.prototype.unusable = !env$1.canvasSupported;
+
+var proto$4 = SaveAsImage.prototype;
+
+proto$4.onclick = function (ecModel, api) {
+    var model = this.model;
+    var title = model.get('name') || ecModel.get('title.0.text') || 'echarts';
+    var $a = document.createElement('a');
+    var type = model.get('type', true) || 'png';
+    $a.download = title + '.' + type;
+    $a.target = '_blank';
+    var url = api.getConnectedDataURL({
+        type: type,
+        backgroundColor: model.get('backgroundColor', true)
+            || ecModel.get('backgroundColor') || '#fff',
+        excludeComponents: model.get('excludeComponents'),
+        pixelRatio: model.get('pixelRatio')
+    });
+    $a.href = url;
+    // Chrome and Firefox
+    if (typeof MouseEvent === 'function' && !env$1.browser.ie && !env$1.browser.edge) {
+        var evt = new MouseEvent('click', {
+            view: window,
+            bubbles: true,
+            cancelable: false
+        });
+        $a.dispatchEvent(evt);
+    }
+    // IE
+    else {
+        if (window.navigator.msSaveOrOpenBlob) {
+            var bstr = atob(url.split(',')[1]);
+            var n = bstr.length;
+            var u8arr = new Uint8Array(n);
+            while(n--) {
+                u8arr[n] = bstr.charCodeAt(n);
+            }
+            var blob = new Blob([u8arr]);
+            window.navigator.msSaveOrOpenBlob(blob, title + '.' + type);
+        }
+        else {
+            var lang$$1 = model.get('lang');
+            var html = '' +
+                '<body style="margin:0;">' +
+                '<img src="' + url + '" style="max-width:100%;" title="' + ((lang$$1 && lang$$1[0]) || '') + '" />' +
+                '</body>';
+            var tab = window.open();
+            tab.document.write(html);
+        }
+    }
+};
+
+register$1(
+    'saveAsImage', SaveAsImage
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var magicTypeLang = lang.toolbox.magicType;
+
+function MagicType(model) {
+    this.model = model;
+}
+
+MagicType.defaultOption = {
+    show: true,
+    type: [],
+    // Icon group
+    icon: {
+        line: 'M4.1,28.9h7.1l9.3-22l7.4,38l9.7-19.7l3,12.8h14.9M4.1,58h51.4',
+        bar: 'M6.7,22.9h10V48h-10V22.9zM24.9,13h10v35h-10V13zM43.2,2h10v46h-10V2zM3.1,58h53.7',
+        stack: 'M8.2,38.4l-8.4,4.1l30.6,15.3L60,42.5l-8.1-4.1l-21.5,11L8.2,38.4z M51.9,30l-8.1,4.2l-13.4,6.9l-13.9-6.9L8.2,30l-8.4,4.2l8.4,4.2l22.2,11l21.5-11l8.1-4.2L51.9,30z M51.9,21.7l-8.1,4.2L35.7,30l-5.3,2.8L24.9,30l-8.4-4.1l-8.3-4.2l-8.4,4.2L8.2,30l8.3,4.2l13.9,6.9l13.4-6.9l8.1-4.2l8.1-4.1L51.9,21.7zM30.4,2.2L-0.2,17.5l8.4,4.1l8.3,4.2l8.4,4.2l5.5,2.7l5.3-2.7l8.1-4.2l8.1-4.2l8.1-4.1L30.4,2.2z', // jshint ignore:line
+        tiled: 'M2.3,2.2h22.8V25H2.3V2.2z M35,2.2h22.8V25H35V2.2zM2.3,35h22.8v22.8H2.3V35z M35,35h22.8v22.8H35V35z'
+    },
+    // `line`, `bar`, `stack`, `tiled`
+    title: clone(magicTypeLang.title),
+    option: {},
+    seriesIndex: {}
+};
+
+var proto$5 = MagicType.prototype;
+
+proto$5.getIcons = function () {
+    var model = this.model;
+    var availableIcons = model.get('icon');
+    var icons = {};
+    each$1(model.get('type'), function (type) {
+        if (availableIcons[type]) {
+            icons[type] = availableIcons[type];
+        }
+    });
+    return icons;
+};
+
+var seriesOptGenreator = {
+    'line': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'bar') {
+            return merge({
+                id: seriesId,
+                type: 'line',
+                // Preserve data related option
+                data: seriesModel.get('data'),
+                stack: seriesModel.get('stack'),
+                markPoint: seriesModel.get('markPoint'),
+                markLine: seriesModel.get('markLine')
+            }, model.get('option.line') || {}, true);
+        }
+    },
+    'bar': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'line') {
+            return merge({
+                id: seriesId,
+                type: 'bar',
+                // Preserve data related option
+                data: seriesModel.get('data'),
+                stack: seriesModel.get('stack'),
+                markPoint: seriesModel.get('markPoint'),
+                markLine: seriesModel.get('markLine')
+            }, model.get('option.bar') || {}, true);
+        }
+    },
+    'stack': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'line' || seriesType === 'bar') {
+            return merge({
+                id: seriesId,
+                stack: '__ec_magicType_stack__'
+            }, model.get('option.stack') || {}, true);
+        }
+    },
+    'tiled': function (seriesType, seriesId, seriesModel, model) {
+        if (seriesType === 'line' || seriesType === 'bar') {
+            return merge({
+                id: seriesId,
+                stack: ''
+            }, model.get('option.tiled') || {}, true);
+        }
+    }
+};
+
+var radioTypes = [
+    ['line', 'bar'],
+    ['stack', 'tiled']
+];
+
+proto$5.onclick = function (ecModel, api, type) {
+    var model = this.model;
+    var seriesIndex = model.get('seriesIndex.' + type);
+    // Not supported magicType
+    if (!seriesOptGenreator[type]) {
+        return;
+    }
+    var newOption = {
+        series: []
+    };
+    var generateNewSeriesTypes = function (seriesModel) {
+        var seriesType = seriesModel.subType;
+        var seriesId = seriesModel.id;
+        var newSeriesOpt = seriesOptGenreator[type](
+            seriesType, seriesId, seriesModel, model
+        );
+        if (newSeriesOpt) {
+            // PENDING If merge original option?
+            defaults(newSeriesOpt, seriesModel.option);
+            newOption.series.push(newSeriesOpt);
+        }
+        // Modify boundaryGap
+        var coordSys = seriesModel.coordinateSystem;
+        if (coordSys && coordSys.type === 'cartesian2d' && (type === 'line' || type === 'bar')) {
+            var categoryAxis = coordSys.getAxesByScale('ordinal')[0];
+            if (categoryAxis) {
+                var axisDim = categoryAxis.dim;
+                var axisType = axisDim + 'Axis';
+                var axisModel = ecModel.queryComponents({
+                    mainType: axisType,
+                    index: seriesModel.get(name + 'Index'),
+                    id: seriesModel.get(name + 'Id')
+                })[0];
+                var axisIndex = axisModel.componentIndex;
+
+                newOption[axisType] = newOption[axisType] || [];
+                for (var i = 0; i <= axisIndex; i++) {
+                    newOption[axisType][axisIndex] = newOption[axisType][axisIndex] || {};
+                }
+                newOption[axisType][axisIndex].boundaryGap = type === 'bar' ? true : false;
+            }
+        }
+    };
+
+    each$1(radioTypes, function (radio) {
+        if (indexOf(radio, type) >= 0) {
+            each$1(radio, function (item) {
+                model.setIconStatus(item, 'normal');
+            });
+        }
+    });
+
+    model.setIconStatus(type, 'emphasis');
+
+    ecModel.eachComponent(
+        {
+            mainType: 'series',
+            query: seriesIndex == null ? null : {
+                seriesIndex: seriesIndex
+            }
+        }, generateNewSeriesTypes
+    );
+    api.dispatchAction({
+        type: 'changeMagicType',
+        currentType: type,
+        newOption: newOption
+    });
+};
+
+registerAction({
+    type: 'changeMagicType',
+    event: 'magicTypeChanged',
+    update: 'prepareAndUpdate'
+}, function (payload, ecModel) {
+    ecModel.mergeOption(payload.newOption);
+});
+
+register$1('magicType', MagicType);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var dataViewLang = lang.toolbox.dataView;
+
+var BLOCK_SPLITER = new Array(60).join('-');
+var ITEM_SPLITER = '\t';
+/**
+ * Group series into two types
+ *  1. on category axis, like line, bar
+ *  2. others, like scatter, pie
+ * @param {module:echarts/model/Global} ecModel
+ * @return {Object}
+ * @inner
+ */
+function groupSeries(ecModel) {
+    var seriesGroupByCategoryAxis = {};
+    var otherSeries = [];
+    var meta = [];
+    ecModel.eachRawSeries(function (seriesModel) {
+        var coordSys = seriesModel.coordinateSystem;
+
+        if (coordSys && (coordSys.type === 'cartesian2d' || coordSys.type === 'polar')) {
+            var baseAxis = coordSys.getBaseAxis();
+            if (baseAxis.type === 'category') {
+                var key = baseAxis.dim + '_' + baseAxis.index;
+                if (!seriesGroupByCategoryAxis[key]) {
+                    seriesGroupByCategoryAxis[key] = {
+                        categoryAxis: baseAxis,
+                        valueAxis: coordSys.getOtherAxis(baseAxis),
+                        series: []
+                    };
+                    meta.push({
+                        axisDim: baseAxis.dim,
+                        axisIndex: baseAxis.index
+                    });
+                }
+                seriesGroupByCategoryAxis[key].series.push(seriesModel);
+            }
+            else {
+                otherSeries.push(seriesModel);
+            }
+        }
+        else {
+            otherSeries.push(seriesModel);
+        }
+    });
+
+    return {
+        seriesGroupByCategoryAxis: seriesGroupByCategoryAxis,
+        other: otherSeries,
+        meta: meta
+    };
+}
+
+/**
+ * Assemble content of series on cateogory axis
+ * @param {Array.<module:echarts/model/Series>} series
+ * @return {string}
+ * @inner
+ */
+function assembleSeriesWithCategoryAxis(series) {
+    var tables = [];
+    each$1(series, function (group, key) {
+        var categoryAxis = group.categoryAxis;
+        var valueAxis = group.valueAxis;
+        var valueAxisDim = valueAxis.dim;
+
+        var headers = [' '].concat(map(group.series, function (series) {
+            return series.name;
+        }));
+        var columns = [categoryAxis.model.getCategories()];
+        each$1(group.series, function (series) {
+            columns.push(series.getRawData().mapArray(valueAxisDim, function (val) {
+                return val;
+            }));
+        });
+        // Assemble table content
+        var lines = [headers.join(ITEM_SPLITER)];
+        for (var i = 0; i < columns[0].length; i++) {
+            var items = [];
+            for (var j = 0; j < columns.length; j++) {
+                items.push(columns[j][i]);
+            }
+            lines.push(items.join(ITEM_SPLITER));
+        }
+        tables.push(lines.join('\n'));
+    });
+    return tables.join('\n\n' +  BLOCK_SPLITER + '\n\n');
+}
+
+/**
+ * Assemble content of other series
+ * @param {Array.<module:echarts/model/Series>} series
+ * @return {string}
+ * @inner
+ */
+function assembleOtherSeries(series) {
+    return map(series, function (series) {
+        var data = series.getRawData();
+        var lines = [series.name];
+        var vals = [];
+        data.each(data.dimensions, function () {
+            var argLen = arguments.length;
+            var dataIndex = arguments[argLen - 1];
+            var name = data.getName(dataIndex);
+            for (var i = 0; i < argLen - 1; i++) {
+                vals[i] = arguments[i];
+            }
+            lines.push((name ? (name + ITEM_SPLITER) : '') + vals.join(ITEM_SPLITER));
+        });
+        return lines.join('\n');
+    }).join('\n\n' + BLOCK_SPLITER + '\n\n');
+}
+
+/**
+ * @param {module:echarts/model/Global}
+ * @return {Object}
+ * @inner
+ */
+function getContentFromModel(ecModel) {
+
+    var result = groupSeries(ecModel);
+
+    return {
+        value: filter([
+                assembleSeriesWithCategoryAxis(result.seriesGroupByCategoryAxis),
+                assembleOtherSeries(result.other)
+            ], function (str) {
+                return str.replace(/[\n\t\s]/g, '');
+            }).join('\n\n' + BLOCK_SPLITER + '\n\n'),
+
+        meta: result.meta
+    };
+}
+
+
+function trim$1(str) {
+    return str.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
+}
+/**
+ * If a block is tsv format
+ */
+function isTSVFormat(block) {
+    // Simple method to find out if a block is tsv format
+    var firstLine = block.slice(0, block.indexOf('\n'));
+    if (firstLine.indexOf(ITEM_SPLITER) >= 0) {
+        return true;
+    }
+}
+
+var itemSplitRegex = new RegExp('[' + ITEM_SPLITER + ']+', 'g');
+/**
+ * @param {string} tsv
+ * @return {Object}
+ */
+function parseTSVContents(tsv) {
+    var tsvLines = tsv.split(/\n+/g);
+    var headers = trim$1(tsvLines.shift()).split(itemSplitRegex);
+
+    var categories = [];
+    var series = map(headers, function (header) {
+        return {
+            name: header,
+            data: []
+        };
+    });
+    for (var i = 0; i < tsvLines.length; i++) {
+        var items = trim$1(tsvLines[i]).split(itemSplitRegex);
+        categories.push(items.shift());
+        for (var j = 0; j < items.length; j++) {
+            series[j] && (series[j].data[i] = items[j]);
+        }
+    }
+    return {
+        series: series,
+        categories: categories
+    };
+}
+
+/**
+ * @param {string} str
+ * @return {Array.<Object>}
+ * @inner
+ */
+function parseListContents(str) {
+    var lines = str.split(/\n+/g);
+    var seriesName = trim$1(lines.shift());
+
+    var data = [];
+    for (var i = 0; i < lines.length; i++) {
+        var items = trim$1(lines[i]).split(itemSplitRegex);
+        var name = '';
+        var value;
+        var hasName = false;
+        if (isNaN(items[0])) { // First item is name
+            hasName = true;
+            name = items[0];
+            items = items.slice(1);
+            data[i] = {
+                name: name,
+                value: []
+            };
+            value = data[i].value;
+        }
+        else {
+            value = data[i] = [];
+        }
+        for (var j = 0; j < items.length; j++) {
+            value.push(+items[j]);
+        }
+        if (value.length === 1) {
+            hasName ? (data[i].value = value[0]) : (data[i] = value[0]);
+        }
+    }
+
+    return {
+        name: seriesName,
+        data: data
+    };
+}
+
+/**
+ * @param {string} str
+ * @param {Array.<Object>} blockMetaList
+ * @return {Object}
+ * @inner
+ */
+function parseContents(str, blockMetaList) {
+    var blocks = str.split(new RegExp('\n*' + BLOCK_SPLITER + '\n*', 'g'));
+    var newOption = {
+        series: []
+    };
+    each$1(blocks, function (block, idx) {
+        if (isTSVFormat(block)) {
+            var result = parseTSVContents(block);
+            var blockMeta = blockMetaList[idx];
+            var axisKey = blockMeta.axisDim + 'Axis';
+
+            if (blockMeta) {
+                newOption[axisKey] = newOption[axisKey] || [];
+                newOption[axisKey][blockMeta.axisIndex] = {
+                    data: result.categories
+                };
+                newOption.series = newOption.series.concat(result.series);
+            }
+        }
+        else {
+            var result = parseListContents(block);
+            newOption.series.push(result);
+        }
+    });
+    return newOption;
+}
+
+/**
+ * @alias {module:echarts/component/toolbox/feature/DataView}
+ * @constructor
+ * @param {module:echarts/model/Model} model
+ */
+function DataView(model) {
+
+    this._dom = null;
+
+    this.model = model;
+}
+
+DataView.defaultOption = {
+    show: true,
+    readOnly: false,
+    optionToContent: null,
+    contentToOption: null,
+
+    icon: 'M17.5,17.3H33 M17.5,17.3H33 M45.4,29.5h-28 M11.5,2v56H51V14.8L38.4,2H11.5z M38.4,2.2v12.7H51 M45.4,41.7h-28',
+    title: clone(dataViewLang.title),
+    lang: clone(dataViewLang.lang),
+    backgroundColor: '#fff',
+    textColor: '#000',
+    textareaColor: '#fff',
+    textareaBorderColor: '#333',
+    buttonColor: '#c23531',
+    buttonTextColor: '#fff'
+};
+
+DataView.prototype.onclick = function (ecModel, api) {
+    var container = api.getDom();
+    var model = this.model;
+    if (this._dom) {
+        container.removeChild(this._dom);
+    }
+    var root = document.createElement('div');
+    root.style.cssText = 'position:absolute;left:5px;top:5px;bottom:5px;right:5px;';
+    root.style.backgroundColor = model.get('backgroundColor') || '#fff';
+
+    // Create elements
+    var header = document.createElement('h4');
+    var lang$$1 = model.get('lang') || [];
+    header.innerHTML = lang$$1[0] || model.get('title');
+    header.style.cssText = 'margin: 10px 20px;';
+    header.style.color = model.get('textColor');
+
+    var viewMain = document.createElement('div');
+    var textarea = document.createElement('textarea');
+    viewMain.style.cssText = 'display:block;width:100%;overflow:auto;';
+
+    var optionToContent = model.get('optionToContent');
+    var contentToOption = model.get('contentToOption');
+    var result = getContentFromModel(ecModel);
+    if (typeof optionToContent === 'function') {
+        var htmlOrDom = optionToContent(api.getOption());
+        if (typeof htmlOrDom === 'string') {
+            viewMain.innerHTML = htmlOrDom;
+        }
+        else if (isDom(htmlOrDom)) {
+            viewMain.appendChild(htmlOrDom);
+        }
+    }
+    else {
+        // Use default textarea
+        viewMain.appendChild(textarea);
+        textarea.readOnly = model.get('readOnly');
+        textarea.style.cssText = 'width:100%;height:100%;font-family:monospace;font-size:14px;line-height:1.6rem;';
+        textarea.style.color = model.get('textColor');
+        textarea.style.borderColor = model.get('textareaBorderColor');
+        textarea.style.backgroundColor = model.get('textareaColor');
+        textarea.value = result.value;
+    }
+
+    var blockMetaList = result.meta;
+
+    var buttonContainer = document.createElement('div');
+    buttonContainer.style.cssText = 'position:absolute;bottom:0;left:0;right:0;';
+
+    var buttonStyle = 'float:right;margin-right:20px;border:none;'
+        + 'cursor:pointer;padding:2px 5px;font-size:12px;border-radius:3px';
+    var closeButton = document.createElement('div');
+    var refreshButton = document.createElement('div');
+
+    buttonStyle += ';background-color:' + model.get('buttonColor');
+    buttonStyle += ';color:' + model.get('buttonTextColor');
+
+    var self = this;
+
+    function close() {
+        container.removeChild(root);
+        self._dom = null;
+    }
+    addEventListener(closeButton, 'click', close);
+
+    addEventListener(refreshButton, 'click', function () {
+        var newOption;
+        try {
+            if (typeof contentToOption === 'function') {
+                newOption = contentToOption(viewMain, api.getOption());
+            }
+            else {
+                newOption = parseContents(textarea.value, blockMetaList);
+            }
+        }
+        catch (e) {
+            close();
+            throw new Error('Data view format error ' + e);
+        }
+        if (newOption) {
+            api.dispatchAction({
+                type: 'changeDataView',
+                newOption: newOption
+            });
+        }
+
+        close();
+    });
+
+    closeButton.innerHTML = lang$$1[1];
+    refreshButton.innerHTML = lang$$1[2];
+    refreshButton.style.cssText = buttonStyle;
+    closeButton.style.cssText = buttonStyle;
+
+    !model.get('readOnly') && buttonContainer.appendChild(refreshButton);
+    buttonContainer.appendChild(closeButton);
+
+    // http://stackoverflow.com/questions/6637341/use-tab-to-indent-in-textarea
+    addEventListener(textarea, 'keydown', function (e) {
+        if ((e.keyCode || e.which) === 9) {
+            // get caret position/selection
+            var val = this.value;
+            var start = this.selectionStart;
+            var end = this.selectionEnd;
+
+            // set textarea value to: text before caret + tab + text after caret
+            this.value = val.substring(0, start) + ITEM_SPLITER + val.substring(end);
+
+            // put caret at right position again
+            this.selectionStart = this.selectionEnd = start + 1;
+
+            // prevent the focus lose
+            stop(e);
+        }
+    });
+
+    root.appendChild(header);
+    root.appendChild(viewMain);
+    root.appendChild(buttonContainer);
+
+    viewMain.style.height = (container.clientHeight - 80) + 'px';
+
+    container.appendChild(root);
+    this._dom = root;
+};
+
+DataView.prototype.remove = function (ecModel, api) {
+    this._dom && api.getDom().removeChild(this._dom);
+};
+
+DataView.prototype.dispose = function (ecModel, api) {
+    this.remove(ecModel, api);
+};
+
+/**
+ * @inner
+ */
+function tryMergeDataOption(newData, originalData) {
+    return map(newData, function (newVal, idx) {
+        var original = originalData && originalData[idx];
+        if (isObject$1(original) && !isArray(original)) {
+            if (isObject$1(newVal) && !isArray(newVal)) {
+                newVal = newVal.value;
+            }
+            // Original data has option
+            return defaults({
+                value: newVal
+            }, original);
+        }
+        else {
+            return newVal;
+        }
+    });
+}
+
+register$1('dataView', DataView);
+
+registerAction({
+    type: 'changeDataView',
+    event: 'dataViewChanged',
+    update: 'prepareAndUpdate'
+}, function (payload, ecModel) {
+    var newSeriesOptList = [];
+    each$1(payload.newOption.series, function (seriesOpt) {
+        var seriesModel = ecModel.getSeriesByName(seriesOpt.name)[0];
+        if (!seriesModel) {
+            // New created series
+            // Geuss the series type
+            newSeriesOptList.push(extend({
+                // Default is scatter
+                type: 'scatter'
+            }, seriesOpt));
+        }
+        else {
+            var originalData = seriesModel.get('data');
+            newSeriesOptList.push({
+                name: seriesOpt.name,
+                data: tryMergeDataOption(seriesOpt.data, originalData)
+            });
+        }
+    });
+
+    ecModel.mergeOption(defaults({
+        series: newSeriesOptList
+    }, payload.newOption));
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var each$29 = each$1;
+
+var ATTR$2 = '\0_ec_hist_store';
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @param {Object} newSnapshot {dataZoomId, batch: [payloadInfo, ...]}
+ */
+function push(ecModel, newSnapshot) {
+    var store = giveStore$1(ecModel);
+
+    // If previous dataZoom can not be found,
+    // complete an range with current range.
+    each$29(newSnapshot, function (batchItem, dataZoomId) {
+        var i = store.length - 1;
+        for (; i >= 0; i--) {
+            var snapshot = store[i];
+            if (snapshot[dataZoomId]) {
+                break;
+            }
+        }
+        if (i < 0) {
+            // No origin range set, create one by current range.
+            var dataZoomModel = ecModel.queryComponents(
+                {mainType: 'dataZoom', subType: 'select', id: dataZoomId}
+            )[0];
+            if (dataZoomModel) {
+                var percentRange = dataZoomModel.getPercentRange();
+                store[0][dataZoomId] = {
+                    dataZoomId: dataZoomId,
+                    start: percentRange[0],
+                    end: percentRange[1]
+                };
+            }
+        }
+    });
+
+    store.push(newSnapshot);
+}
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @return {Object} snapshot
+ */
+function pop(ecModel) {
+    var store = giveStore$1(ecModel);
+    var head = store[store.length - 1];
+    store.length > 1 && store.pop();
+
+    // Find top for all dataZoom.
+    var snapshot = {};
+    each$29(head, function (batchItem, dataZoomId) {
+        for (var i = store.length - 1; i >= 0; i--) {
+            var batchItem = store[i][dataZoomId];
+            if (batchItem) {
+                snapshot[dataZoomId] = batchItem;
+                break;
+            }
+        }
+    });
+
+    return snapshot;
+}
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ */
+function clear$1(ecModel) {
+    ecModel[ATTR$2] = null;
+}
+
+/**
+ * @param {module:echarts/model/Global} ecModel
+ * @return {number} records. always >= 1.
+ */
+function count(ecModel) {
+    return giveStore$1(ecModel).length;
+}
+
+/**
+ * [{key: dataZoomId, value: {dataZoomId, range}}, ...]
+ * History length of each dataZoom may be different.
+ * this._history[0] is used to store origin range.
+ * @type {Array.<Object>}
+ */
+function giveStore$1(ecModel) {
+    var store = ecModel[ATTR$2];
+    if (!store) {
+        store = ecModel[ATTR$2] = [{}];
+    }
+    return store;
+}
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+DataZoomModel.extend({
+    type: 'dataZoom.select'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+DataZoomView.extend({
+    type: 'dataZoom.select'
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+/**
+ * DataZoom component entry
+ */
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Use dataZoomSelect
+var dataZoomLang = lang.toolbox.dataZoom;
+var each$28 = each$1;
+
+// Spectial component id start with \0ec\0, see echarts/model/Global.js~hasInnerId
+var DATA_ZOOM_ID_BASE = '\0_ec_\0toolbox-dataZoom_';
+
+function DataZoom(model, ecModel, api) {
+
+    /**
+     * @private
+     * @type {module:echarts/component/helper/BrushController}
+     */
+    (this._brushController = new BrushController(api.getZr()))
+        .on('brush', bind(this._onBrush, this))
+        .mount();
+
+    /**
+     * @private
+     * @type {boolean}
+     */
+    this._isZoomActive;
+}
+
+DataZoom.defaultOption = {
+    show: true,
+    // Icon group
+    icon: {
+        zoom: 'M0,13.5h26.9 M13.5,26.9V0 M32.1,13.5H58V58H13.5 V32.1',
+        back: 'M22,1.4L9.9,13.5l12.3,12.3 M10.3,13.5H54.9v44.6 H10.3v-26'
+    },
+    // `zoom`, `back`
+    title: clone(dataZoomLang.title)
+};
+
+var proto$6 = DataZoom.prototype;
+
+proto$6.render = function (featureModel, ecModel, api, payload) {
+    this.model = featureModel;
+    this.ecModel = ecModel;
+    this.api = api;
+
+    updateZoomBtnStatus(featureModel, ecModel, this, payload, api);
+    updateBackBtnStatus(featureModel, ecModel);
+};
+
+proto$6.onclick = function (ecModel, api, type) {
+    handlers$1[type].call(this);
+};
+
+proto$6.remove = function (ecModel, api) {
+    this._brushController.unmount();
+};
+
+proto$6.dispose = function (ecModel, api) {
+    this._brushController.dispose();
+};
+
+/**
+ * @private
+ */
+var handlers$1 = {
+
+    zoom: function () {
+        var nextActive = !this._isZoomActive;
+
+        this.api.dispatchAction({
+            type: 'takeGlobalCursor',
+            key: 'dataZoomSelect',
+            dataZoomSelectActive: nextActive
+        });
+    },
+
+    back: function () {
+        this._dispatchZoomAction(pop(this.ecModel));
+    }
+};
+
+/**
+ * @private
+ */
+proto$6._onBrush = function (areas, opt) {
+    if (!opt.isEnd || !areas.length) {
+        return;
+    }
+    var snapshot = {};
+    var ecModel = this.ecModel;
+
+    this._brushController.updateCovers([]); // remove cover
+
+    var brushTargetManager = new BrushTargetManager(
+        retrieveAxisSetting(this.model.option), ecModel, {include: ['grid']}
+    );
+    brushTargetManager.matchOutputRanges(areas, ecModel, function (area, coordRange, coordSys) {
+        if (coordSys.type !== 'cartesian2d') {
+            return;
+        }
+
+        var brushType = area.brushType;
+        if (brushType === 'rect') {
+            setBatch('x', coordSys, coordRange[0]);
+            setBatch('y', coordSys, coordRange[1]);
+        }
+        else {
+            setBatch(({lineX: 'x', lineY: 'y'})[brushType], coordSys, coordRange);
+        }
+    });
+
+    push(ecModel, snapshot);
+
+    this._dispatchZoomAction(snapshot);
+
+    function setBatch(dimName, coordSys, minMax) {
+        var axis = coordSys.getAxis(dimName);
+        var axisModel = axis.model;
+        var dataZoomModel = findDataZoom(dimName, axisModel, ecModel);
+
+        // Restrict range.
+        var minMaxSpan = dataZoomModel.findRepresentativeAxisProxy(axisModel).getMinMaxSpan();
+        if (minMaxSpan.minValueSpan != null || minMaxSpan.maxValueSpan != null) {
+            minMax = sliderMove(
+                0, minMax.slice(), axis.scale.getExtent(), 0,
+                minMaxSpan.minValueSpan, minMaxSpan.maxValueSpan
+            );
+        }
+
+        dataZoomModel && (snapshot[dataZoomModel.id] = {
+            dataZoomId: dataZoomModel.id,
+            startValue: minMax[0],
+            endValue: minMax[1]
+        });
+    }
+
+    function findDataZoom(dimName, axisModel, ecModel) {
+        var found;
+        ecModel.eachComponent({mainType: 'dataZoom', subType: 'select'}, function (dzModel) {
+            var has = dzModel.getAxisModel(dimName, axisModel.componentIndex);
+            has && (found = dzModel);
+        });
+        return found;
+    }
+};
+
+/**
+ * @private
+ */
+proto$6._dispatchZoomAction = function (snapshot) {
+    var batch = [];
+
+    // Convert from hash map to array.
+    each$28(snapshot, function (batchItem, dataZoomId) {
+        batch.push(clone(batchItem));
+    });
+
+    batch.length && this.api.dispatchAction({
+        type: 'dataZoom',
+        from: this.uid,
+        batch: batch
+    });
+};
+
+function retrieveAxisSetting(option) {
+    var setting = {};
+    // Compatible with previous setting: null => all axis, false => no axis.
+    each$1(['xAxisIndex', 'yAxisIndex'], function (name) {
+        setting[name] = option[name];
+        setting[name] == null && (setting[name] = 'all');
+        (setting[name] === false || setting[name] === 'none') && (setting[name] = []);
+    });
+    return setting;
+}
+
+function updateBackBtnStatus(featureModel, ecModel) {
+    featureModel.setIconStatus(
+        'back',
+        count(ecModel) > 1 ? 'emphasis' : 'normal'
+    );
+}
+
+function updateZoomBtnStatus(featureModel, ecModel, view, payload, api) {
+    var zoomActive = view._isZoomActive;
+
+    if (payload && payload.type === 'takeGlobalCursor') {
+        zoomActive = payload.key === 'dataZoomSelect'
+            ? payload.dataZoomSelectActive : false;
+    }
+
+    view._isZoomActive = zoomActive;
+
+    featureModel.setIconStatus('zoom', zoomActive ? 'emphasis' : 'normal');
+
+    var brushTargetManager = new BrushTargetManager(
+        retrieveAxisSetting(featureModel.option), ecModel, {include: ['grid']}
+    );
+
+    view._brushController
+        .setPanels(brushTargetManager.makePanelOpts(api, function (targetInfo) {
+            return (targetInfo.xAxisDeclared && !targetInfo.yAxisDeclared)
+                ? 'lineX'
+                : (!targetInfo.xAxisDeclared && targetInfo.yAxisDeclared)
+                ? 'lineY'
+                : 'rect';
+        }))
+        .enableBrush(
+            zoomActive
+            ? {
+                brushType: 'auto',
+                brushStyle: {
+                    // FIXME user customized?
+                    lineWidth: 0,
+                    fill: 'rgba(0,0,0,0.2)'
+                }
+            }
+            : false
+        );
+}
+
+
+register$1('dataZoom', DataZoom);
+
+
+// Create special dataZoom option for select
+// FIXME consider the case of merge option, where axes options are not exists.
+registerPreprocessor(function (option) {
+    if (!option) {
+        return;
+    }
+
+    var dataZoomOpts = option.dataZoom || (option.dataZoom = []);
+    if (!isArray(dataZoomOpts)) {
+        option.dataZoom = dataZoomOpts = [dataZoomOpts];
+    }
+
+    var toolboxOpt = option.toolbox;
+    if (toolboxOpt) {
+        // Assume there is only one toolbox
+        if (isArray(toolboxOpt)) {
+            toolboxOpt = toolboxOpt[0];
+        }
+
+        if (toolboxOpt && toolboxOpt.feature) {
+            var dataZoomOpt = toolboxOpt.feature.dataZoom;
+            // FIXME: If add dataZoom when setOption in merge mode,
+            // no axis info to be added. See `test/dataZoom-extreme.html`
+            addForAxis('xAxis', dataZoomOpt);
+            addForAxis('yAxis', dataZoomOpt);
+        }
+    }
+
+    function addForAxis(axisName, dataZoomOpt) {
+        if (!dataZoomOpt) {
+            return;
+        }
+
+        // Try not to modify model, because it is not merged yet.
+        var axisIndicesName = axisName + 'Index';
+        var givenAxisIndices = dataZoomOpt[axisIndicesName];
+        if (givenAxisIndices != null
+            && givenAxisIndices != 'all'
+            && !isArray(givenAxisIndices)
+        ) {
+            givenAxisIndices = (givenAxisIndices === false || givenAxisIndices === 'none') ? [] : [givenAxisIndices];
+        }
+
+        forEachComponent(axisName, function (axisOpt, axisIndex) {
+            if (givenAxisIndices != null
+                && givenAxisIndices != 'all'
+                && indexOf(givenAxisIndices, axisIndex) === -1
+            ) {
+                return;
+            }
+            var newOpt = {
+                type: 'select',
+                $fromToolbox: true,
+                // Id for merge mapping.
+                id: DATA_ZOOM_ID_BASE + axisName + axisIndex
+            };
+            // FIXME
+            // Only support one axis now.
+            newOpt[axisIndicesName] = axisIndex;
+            dataZoomOpts.push(newOpt);
+        });
+    }
+
+    function forEachComponent(mainType, cb) {
+        var opts = option[mainType];
+        if (!isArray(opts)) {
+            opts = opts ? [opts] : [];
+        }
+        each$28(opts, cb);
+    }
+});
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var restoreLang = lang.toolbox.restore;
+
+function Restore(model) {
+    this.model = model;
+}
+
+Restore.defaultOption = {
+    show: true,
+    icon: 'M3.8,33.4 M47,18.9h9.8V8.7 M56.3,20.1 C52.1,9,40.5,0.6,26.8,2.1C12.6,3.7,1.6,16.2,2.1,30.6 M13,41.1H3.1v10.2 M3.7,39.9c4.2,11.1,15.8,19.5,29.5,18 c14.2-1.6,25.2-14.1,24.7-28.5',
+    title: restoreLang.title
+};
+
+var proto$7 = Restore.prototype;
+
+proto$7.onclick = function (ecModel, api, type) {
+    clear$1(ecModel);
+
+    api.dispatchAction({
+        type: 'restore',
+        from: this.uid
+    });
+};
+
+register$1('restore', Restore);
+
+registerAction(
+    {type: 'restore', event: 'restore', update: 'prepareAndUpdate'},
+    function (payload, ecModel) {
+        ecModel.resetOption('recreate');
+    }
+);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+var urn = 'urn:schemas-microsoft-com:vml';
+var win = typeof window === 'undefined' ? null : window;
+
+var vmlInited = false;
+
+var doc = win && win.document;
+
+function createNode(tagName) {
+    return doCreateNode(tagName);
+}
+
+// Avoid assign to an exported variable, for transforming to cjs.
+var doCreateNode;
+
+if (doc && !env$1.canvasSupported) {
+    try {
+        !doc.namespaces.zrvml && doc.namespaces.add('zrvml', urn);
+        doCreateNode = function (tagName) {
+            return doc.createElement('<zrvml:' + tagName + ' class="zrvml">');
+        };
+    }
+    catch (e) {
+        doCreateNode = function (tagName) {
+            return doc.createElement('<' + tagName + ' xmlns="' + urn + '" class="zrvml">');
+        };
+    }
+}
+
+// From raphael
+function initVML() {
+    if (vmlInited || !doc) {
+        return;
+    }
+    vmlInited = true;
+
+    var styleSheets = doc.styleSheets;
+    if (styleSheets.length < 31) {
+        doc.createStyleSheet().addRule('.zrvml', 'behavior:url(#default#VML)');
+    }
+    else {
+        // http://msdn.microsoft.com/en-us/library/ms531194%28VS.85%29.aspx
+        styleSheets[0].addRule('.zrvml', 'behavior:url(#default#VML)');
+    }
+}
+
+// http://www.w3.org/TR/NOTE-VML
+// TODO Use proxy like svg instead of overwrite brush methods
+
+var CMD$3 = PathProxy.CMD;
+var round$3 = Math.round;
+var sqrt = Math.sqrt;
+var abs$1 = Math.abs;
+var cos = Math.cos;
+var sin = Math.sin;
+var mathMax$8 = Math.max;
+
+if (!env$1.canvasSupported) {
+
+    var comma = ',';
+    var imageTransformPrefix = 'progid:DXImageTransform.Microsoft';
+
+    var Z = 21600;
+    var Z2 = Z / 2;
+
+    var ZLEVEL_BASE = 100000;
+    var Z_BASE$1 = 1000;
+
+    var initRootElStyle = function (el) {
+        el.style.cssText = 'position:absolute;left:0;top:0;width:1px;height:1px;';
+        el.coordsize = Z + ','  + Z;
+        el.coordorigin = '0,0';
+    };
+
+    var encodeHtmlAttribute = function (s) {
+        return String(s).replace(/&/g, '&amp;').replace(/"/g, '&quot;');
+    };
+
+    var rgb2Str = function (r, g, b) {
+        return 'rgb(' + [r, g, b].join(',') + ')';
+    };
+
+    var append = function (parent, child) {
+        if (child && parent && child.parentNode !== parent) {
+            parent.appendChild(child);
+        }
+    };
+
+    var remove = function (parent, child) {
+        if (child && parent && child.parentNode === parent) {
+            parent.removeChild(child);
+        }
+    };
+
+    var getZIndex = function (zlevel, z, z2) {
+        // z 的取值范围为 [0, 1000]
+        return (parseFloat(zlevel) || 0) * ZLEVEL_BASE + (parseFloat(z) || 0) * Z_BASE$1 + z2;
+    };
+
+    var parsePercent$3 = function (value, maxValue) {
+        if (typeof value === 'string') {
+            if (value.lastIndexOf('%') >= 0) {
+                return parseFloat(value) / 100 * maxValue;
+            }
+            return parseFloat(value);
+        }
+        return value;
+    };
+
+    /***************************************************
+     * PATH
+     **************************************************/
+
+    var setColorAndOpacity = function (el, color, opacity) {
+        var colorArr = parse(color);
+        opacity = +opacity;
+        if (isNaN(opacity)) {
+            opacity = 1;
+        }
+        if (colorArr) {
+            el.color = rgb2Str(colorArr[0], colorArr[1], colorArr[2]);
+            el.opacity = opacity * colorArr[3];
+        }
+    };
+
+    var getColorAndAlpha = function (color) {
+        var colorArr = parse(color);
+        return [
+            rgb2Str(colorArr[0], colorArr[1], colorArr[2]),
+            colorArr[3]
+        ];
+    };
+
+    var updateFillNode = function (el, style, zrEl) {
+        // TODO pattern
+        var fill = style.fill;
+        if (fill != null) {
+            // Modified from excanvas
+            if (fill instanceof Gradient) {
+                var gradientType;
+                var angle = 0;
+                var focus = [0, 0];
+                // additional offset
+                var shift = 0;
+                // scale factor for offset
+                var expansion = 1;
+                var rect = zrEl.getBoundingRect();
+                var rectWidth = rect.width;
+                var rectHeight = rect.height;
+                if (fill.type === 'linear') {
+                    gradientType = 'gradient';
+                    var transform = zrEl.transform;
+                    var p0 = [fill.x * rectWidth, fill.y * rectHeight];
+                    var p1 = [fill.x2 * rectWidth, fill.y2 * rectHeight];
+                    if (transform) {
+                        applyTransform(p0, p0, transform);
+                        applyTransform(p1, p1, transform);
+                    }
+                    var dx = p1[0] - p0[0];
+                    var dy = p1[1] - p0[1];
+                    angle = Math.atan2(dx, dy) * 180 / Math.PI;
+                    // The angle should be a non-negative number.
+                    if (angle < 0) {
+                        angle += 360;
+                    }
+
+                    // Very small angles produce an unexpected result because they are
+                    // converted to a scientific notation string.
+                    if (angle < 1e-6) {
+                        angle = 0;
+                    }
+                }
+                else {
+                    gradientType = 'gradientradial';
+                    var p0 = [fill.x * rectWidth, fill.y * rectHeight];
+                    var transform = zrEl.transform;
+                    var scale$$1 = zrEl.scale;
+                    var width = rectWidth;
+                    var height = rectHeight;
+                    focus = [
+                        // Percent in bounding rect
+                        (p0[0] - rect.x) / width,
+                        (p0[1] - rect.y) / height
+                    ];
+                    if (transform) {
+                        applyTransform(p0, p0, transform);
+                    }
+
+                    width /= scale$$1[0] * Z;
+                    height /= scale$$1[1] * Z;
+                    var dimension = mathMax$8(width, height);
+                    shift = 2 * 0 / dimension;
+                    expansion = 2 * fill.r / dimension - shift;
+                }
+
+                // We need to sort the color stops in ascending order by offset,
+                // otherwise IE won't interpret it correctly.
+                var stops = fill.colorStops.slice();
+                stops.sort(function(cs1, cs2) {
+                    return cs1.offset - cs2.offset;
+                });
+
+                var length$$1 = stops.length;
+                // Color and alpha list of first and last stop
+                var colorAndAlphaList = [];
+                var colors = [];
+                for (var i = 0; i < length$$1; i++) {
+                    var stop = stops[i];
+                    var colorAndAlpha = getColorAndAlpha(stop.color);
+                    colors.push(stop.offset * expansion + shift + ' ' + colorAndAlpha[0]);
+                    if (i === 0 || i === length$$1 - 1) {
+                        colorAndAlphaList.push(colorAndAlpha);
+                    }
+                }
+
+                if (length$$1 >= 2) {
+                    var color1 = colorAndAlphaList[0][0];
+                    var color2 = colorAndAlphaList[1][0];
+                    var opacity1 = colorAndAlphaList[0][1] * style.opacity;
+                    var opacity2 = colorAndAlphaList[1][1] * style.opacity;
+
+                    el.type = gradientType;
+                    el.method = 'none';
+                    el.focus = '100%';
+                    el.angle = angle;
+                    el.color = color1;
+                    el.color2 = color2;
+                    el.colors = colors.join(',');
+                    // When colors attribute is used, the meanings of opacity and o:opacity2
+                    // are reversed.
+                    el.opacity = opacity2;
+                    // FIXME g_o_:opacity ?
+                    el.opacity2 = opacity1;
+                }
+                if (gradientType === 'radial') {
+                    el.focusposition = focus.join(',');
+                }
+            }
+            else {
+                // FIXME Change from Gradient fill to color fill
+                setColorAndOpacity(el, fill, style.opacity);
+            }
+        }
+    };
+
+    var updateStrokeNode = function (el, style) {
+        // if (style.lineJoin != null) {
+        //     el.joinstyle = style.lineJoin;
+        // }
+        // if (style.miterLimit != null) {
+        //     el.miterlimit = style.miterLimit * Z;
+        // }
+        // if (style.lineCap != null) {
+        //     el.endcap = style.lineCap;
+        // }
+        if (style.lineDash != null) {
+            el.dashstyle = style.lineDash.join(' ');
+        }
+        if (style.stroke != null && !(style.stroke instanceof Gradient)) {
+            setColorAndOpacity(el, style.stroke, style.opacity);
+        }
+    };
+
+    var updateFillAndStroke = function (vmlEl, type, style, zrEl) {
+        var isFill = type == 'fill';
+        var el = vmlEl.getElementsByTagName(type)[0];
+        // Stroke must have lineWidth
+        if (style[type] != null && style[type] !== 'none' && (isFill || (!isFill && style.lineWidth))) {
+            vmlEl[isFill ? 'filled' : 'stroked'] = 'true';
+            // FIXME Remove before updating, or set `colors` will throw error
+            if (style[type] instanceof Gradient) {
+                remove(vmlEl, el);
+            }
+            if (!el) {
+                el = createNode(type);
+            }
+
+            isFill ? updateFillNode(el, style, zrEl) : updateStrokeNode(el, style);
+            append(vmlEl, el);
+        }
+        else {
+            vmlEl[isFill ? 'filled' : 'stroked'] = 'false';
+            remove(vmlEl, el);
+        }
+    };
+
+    var points$3 = [[], [], []];
+    var pathDataToString = function (path, m) {
+        var M = CMD$3.M;
+        var C = CMD$3.C;
+        var L = CMD$3.L;
+        var A = CMD$3.A;
+        var Q = CMD$3.Q;
+
+        var str = [];
+        var nPoint;
+        var cmdStr;
+        var cmd;
+        var i;
+        var xi;
+        var yi;
+        var data = path.data;
+        var dataLength = path.len();
+        for (i = 0; i < dataLength;) {
+            cmd = data[i++];
+            cmdStr = '';
+            nPoint = 0;
+            switch (cmd) {
+                case M:
+                    cmdStr = ' m ';
+                    nPoint = 1;
+                    xi = data[i++];
+                    yi = data[i++];
+                    points$3[0][0] = xi;
+                    points$3[0][1] = yi;
+                    break;
+                case L:
+                    cmdStr = ' l ';
+                    nPoint = 1;
+                    xi = data[i++];
+                    yi = data[i++];
+                    points$3[0][0] = xi;
+                    points$3[0][1] = yi;
+                    break;
+                case Q:
+                case C:
+                    cmdStr = ' c ';
+                    nPoint = 3;
+                    var x1 = data[i++];
+                    var y1 = data[i++];
+                    var x2 = data[i++];
+                    var y2 = data[i++];
+                    var x3;
+                    var y3;
+                    if (cmd === Q) {
+                        // Convert quadratic to cubic using degree elevation
+                        x3 = x2;
+                        y3 = y2;
+                        x2 = (x2 + 2 * x1) / 3;
+                        y2 = (y2 + 2 * y1) / 3;
+                        x1 = (xi + 2 * x1) / 3;
+                        y1 = (yi + 2 * y1) / 3;
+                    }
+                    else {
+                        x3 = data[i++];
+                        y3 = data[i++];
+                    }
+                    points$3[0][0] = x1;
+                    points$3[0][1] = y1;
+                    points$3[1][0] = x2;
+                    points$3[1][1] = y2;
+                    points$3[2][0] = x3;
+                    points$3[2][1] = y3;
+
+                    xi = x3;
+                    yi = y3;
+                    break;
+                case A:
+                    var x = 0;
+                    var y = 0;
+                    var sx = 1;
+                    var sy = 1;
+                    var angle = 0;
+                    if (m) {
+                        // Extract SRT from matrix
+                        x = m[4];
+                        y = m[5];
+                        sx = sqrt(m[0] * m[0] + m[1] * m[1]);
+                        sy = sqrt(m[2] * m[2] + m[3] * m[3]);
+                        angle = Math.atan2(-m[1] / sy, m[0] / sx);
+                    }
+
+                    var cx = data[i++];
+                    var cy = data[i++];
+                    var rx = data[i++];
+                    var ry = data[i++];
+                    var startAngle = data[i++] + angle;
+                    var endAngle = data[i++] + startAngle + angle;
+                    // FIXME
+                    // var psi = data[i++];
+                    i++;
+                    var clockwise = data[i++];
+
+                    var x0 = cx + cos(startAngle) * rx;
+                    var y0 = cy + sin(startAngle) * ry;
+
+                    var x1 = cx + cos(endAngle) * rx;
+                    var y1 = cy + sin(endAngle) * ry;
+
+                    var type = clockwise ? ' wa ' : ' at ';
+                    if (Math.abs(x0 - x1) < 1e-4) {
+                        // IE won't render arches drawn counter clockwise if x0 == x1.
+                        if (Math.abs(endAngle - startAngle) > 1e-2) {
+                            // Offset x0 by 1/80 of a pixel. Use something
+                            // that can be represented in binary
+                            if (clockwise) {
+                                x0 += 270 / Z;
+                            }
+                        }
+                        else {
+                            // Avoid case draw full circle
+                            if (Math.abs(y0 - cy) < 1e-4) {
+                                if ((clockwise && x0 < cx) || (!clockwise && x0 > cx)) {
+                                    y1 -= 270 / Z;
+                                }
+                                else {
+                                    y1 += 270 / Z;
+                                }
+                            }
+                            else if ((clockwise && y0 < cy) || (!clockwise && y0 > cy)) {
+                                x1 += 270 / Z;
+                            }
+                            else {
+                                x1 -= 270 / Z;
+                            }
+                        }
+                    }
+                    str.push(
+                        type,
+                        round$3(((cx - rx) * sx + x) * Z - Z2), comma,
+                        round$3(((cy - ry) * sy + y) * Z - Z2), comma,
+                        round$3(((cx + rx) * sx + x) * Z - Z2), comma,
+                        round$3(((cy + ry) * sy + y) * Z - Z2), comma,
+                        round$3((x0 * sx + x) * Z - Z2), comma,
+                        round$3((y0 * sy + y) * Z - Z2), comma,
+                        round$3((x1 * sx + x) * Z - Z2), comma,
+                        round$3((y1 * sy + y) * Z - Z2)
+                    );
+
+                    xi = x1;
+                    yi = y1;
+                    break;
+                case CMD$3.R:
+                    var p0 = points$3[0];
+                    var p1 = points$3[1];
+                    // x0, y0
+                    p0[0] = data[i++];
+                    p0[1] = data[i++];
+                    // x1, y1
+                    p1[0] = p0[0] + data[i++];
+                    p1[1] = p0[1] + data[i++];
+
+                    if (m) {
+                        applyTransform(p0, p0, m);
+                        applyTransform(p1, p1, m);
+                    }
+
+                    p0[0] = round$3(p0[0] * Z - Z2);
+                    p1[0] = round$3(p1[0] * Z - Z2);
+                    p0[1] = round$3(p0[1] * Z - Z2);
+                    p1[1] = round$3(p1[1] * Z - Z2);
+                    str.push(
+                        // x0, y0
+                        ' m ', p0[0], comma, p0[1],
+                        // x1, y0
+                        ' l ', p1[0], comma, p0[1],
+                        // x1, y1
+                        ' l ', p1[0], comma, p1[1],
+                        // x0, y1
+                        ' l ', p0[0], comma, p1[1]
+                    );
+                    break;
+                case CMD$3.Z:
+                    // FIXME Update xi, yi
+                    str.push(' x ');
+            }
+
+            if (nPoint > 0) {
+                str.push(cmdStr);
+                for (var k = 0; k < nPoint; k++) {
+                    var p = points$3[k];
+
+                    m && applyTransform(p, p, m);
+                    // 不 round 会非常慢
+                    str.push(
+                        round$3(p[0] * Z - Z2), comma, round$3(p[1] * Z - Z2),
+                        k < nPoint - 1 ? comma : ''
+                    );
+                }
+            }
+        }
+
+        return str.join('');
+    };
+
+    // Rewrite the original path method
+    Path.prototype.brushVML = function (vmlRoot) {
+        var style = this.style;
+
+        var vmlEl = this._vmlEl;
+        if (!vmlEl) {
+            vmlEl = createNode('shape');
+            initRootElStyle(vmlEl);
+
+            this._vmlEl = vmlEl;
+        }
+
+        updateFillAndStroke(vmlEl, 'fill', style, this);
+        updateFillAndStroke(vmlEl, 'stroke', style, this);
+
+        var m = this.transform;
+        var needTransform = m != null;
+        var strokeEl = vmlEl.getElementsByTagName('stroke')[0];
+        if (strokeEl) {
+            var lineWidth = style.lineWidth;
+            // Get the line scale.
+            // Determinant of this.m_ means how much the area is enlarged by the
+            // transformation. So its square root can be used as a scale factor
+            // for width.
+            if (needTransform && !style.strokeNoScale) {
+                var det = m[0] * m[3] - m[1] * m[2];
+                lineWidth *= sqrt(abs$1(det));
+            }
+            strokeEl.weight = lineWidth + 'px';
+        }
+
+        var path = this.path || (this.path = new PathProxy());
+        if (this.__dirtyPath) {
+            path.beginPath();
+            this.buildPath(path, this.shape);
+            path.toStatic();
+            this.__dirtyPath = false;
+        }
+
+        vmlEl.path = pathDataToString(path, this.transform);
+
+        vmlEl.style.zIndex = getZIndex(this.zlevel, this.z, this.z2);
+
+        // Append to root
+        append(vmlRoot, vmlEl);
+
+        // Text
+        if (style.text != null) {
+            this.drawRectText(vmlRoot, this.getBoundingRect());
+        }
+        else {
+            this.removeRectText(vmlRoot);
+        }
+    };
+
+    Path.prototype.onRemove = function (vmlRoot) {
+        remove(vmlRoot, this._vmlEl);
+        this.removeRectText(vmlRoot);
+    };
+
+    Path.prototype.onAdd = function (vmlRoot) {
+        append(vmlRoot, this._vmlEl);
+        this.appendRectText(vmlRoot);
+    };
+
+    /***************************************************
+     * IMAGE
+     **************************************************/
+    var isImage = function (img) {
+        // FIXME img instanceof Image 如果 img 是一个字符串的时候，IE8 下会报错
+        return (typeof img === 'object') && img.tagName && img.tagName.toUpperCase() === 'IMG';
+        // return img instanceof Image;
+    };
+
+    // Rewrite the original path method
+    ZImage.prototype.brushVML = function (vmlRoot) {
+        var style = this.style;
+        var image = style.image;
+
+        // Image original width, height
+        var ow;
+        var oh;
+
+        if (isImage(image)) {
+            var src = image.src;
+            if (src === this._imageSrc) {
+                ow = this._imageWidth;
+                oh = this._imageHeight;
+            }
+            else {
+                var imageRuntimeStyle = image.runtimeStyle;
+                var oldRuntimeWidth = imageRuntimeStyle.width;
+                var oldRuntimeHeight = imageRuntimeStyle.height;
+                imageRuntimeStyle.width = 'auto';
+                imageRuntimeStyle.height = 'auto';
+
+                // get the original size
+                ow = image.width;
+                oh = image.height;
+
+                // and remove overides
+                imageRuntimeStyle.width = oldRuntimeWidth;
+                imageRuntimeStyle.height = oldRuntimeHeight;
+
+                // Caching image original width, height and src
+                this._imageSrc = src;
+                this._imageWidth = ow;
+                this._imageHeight = oh;
+            }
+            image = src;
+        }
+        else {
+            if (image === this._imageSrc) {
+                ow = this._imageWidth;
+                oh = this._imageHeight;
+            }
+        }
+        if (!image) {
+            return;
+        }
+
+        var x = style.x || 0;
+        var y = style.y || 0;
+
+        var dw = style.width;
+        var dh = style.height;
+
+        var sw = style.sWidth;
+        var sh = style.sHeight;
+        var sx = style.sx || 0;
+        var sy = style.sy || 0;
+
+        var hasCrop = sw && sh;
+
+        var vmlEl = this._vmlEl;
+        if (!vmlEl) {
+            // FIXME 使用 group 在 left, top 都不是 0 的时候就无法显示了。
+            // vmlEl = vmlCore.createNode('group');
+            vmlEl = doc.createElement('div');
+            initRootElStyle(vmlEl);
+
+            this._vmlEl = vmlEl;
+        }
+
+        var vmlElStyle = vmlEl.style;
+        var hasRotation = false;
+        var m;
+        var scaleX = 1;
+        var scaleY = 1;
+        if (this.transform) {
+            m = this.transform;
+            scaleX = sqrt(m[0] * m[0] + m[1] * m[1]);
+            scaleY = sqrt(m[2] * m[2] + m[3] * m[3]);
+
+            hasRotation = m[1] || m[2];
+        }
+        if (hasRotation) {
+            // If filters are necessary (rotation exists), create them
+            // filters are bog-slow, so only create them if abbsolutely necessary
+            // The following check doesn't account for skews (which don't exist
+            // in the canvas spec (yet) anyway.
+            // From excanvas
+            var p0 = [x, y];
+            var p1 = [x + dw, y];
+            var p2 = [x, y + dh];
+            var p3 = [x + dw, y + dh];
+            applyTransform(p0, p0, m);
+            applyTransform(p1, p1, m);
+            applyTransform(p2, p2, m);
+            applyTransform(p3, p3, m);
+
+            var maxX = mathMax$8(p0[0], p1[0], p2[0], p3[0]);
+            var maxY = mathMax$8(p0[1], p1[1], p2[1], p3[1]);
+
+            var transformFilter = [];
+            transformFilter.push('M11=', m[0] / scaleX, comma,
+                        'M12=', m[2] / scaleY, comma,
+                        'M21=', m[1] / scaleX, comma,
+                        'M22=', m[3] / scaleY, comma,
+                        'Dx=', round$3(x * scaleX + m[4]), comma,
+                        'Dy=', round$3(y * scaleY + m[5]));
+
+            vmlElStyle.padding = '0 ' + round$3(maxX) + 'px ' + round$3(maxY) + 'px 0';
+            // FIXME DXImageTransform 在 IE11 的兼容模式下不起作用
+            vmlElStyle.filter = imageTransformPrefix + '.Matrix('
+                + transformFilter.join('') + ', SizingMethod=clip)';
+
+        }
+        else {
+            if (m) {
+                x = x * scaleX + m[4];
+                y = y * scaleY + m[5];
+            }
+            vmlElStyle.filter = '';
+            vmlElStyle.left = round$3(x) + 'px';
+            vmlElStyle.top = round$3(y) + 'px';
+        }
+
+        var imageEl = this._imageEl;
+        var cropEl = this._cropEl;
+
+        if (!imageEl) {
+            imageEl = doc.createElement('div');
+            this._imageEl = imageEl;
+        }
+        var imageELStyle = imageEl.style;
+        if (hasCrop) {
+            // Needs know image original width and height
+            if (! (ow && oh)) {
+                var tmpImage = new Image();
+                var self = this;
+                tmpImage.onload = function () {
+                    tmpImage.onload = null;
+                    ow = tmpImage.width;
+                    oh = tmpImage.height;
+                    // Adjust image width and height to fit the ratio destinationSize / sourceSize
+                    imageELStyle.width = round$3(scaleX * ow * dw / sw) + 'px';
+                    imageELStyle.height = round$3(scaleY * oh * dh / sh) + 'px';
+
+                    // Caching image original width, height and src
+                    self._imageWidth = ow;
+                    self._imageHeight = oh;
+                    self._imageSrc = image;
+                };
+                tmpImage.src = image;
+            }
+            else {
+                imageELStyle.width = round$3(scaleX * ow * dw / sw) + 'px';
+                imageELStyle.height = round$3(scaleY * oh * dh / sh) + 'px';
+            }
+
+            if (! cropEl) {
+                cropEl = doc.createElement('div');
+                cropEl.style.overflow = 'hidden';
+                this._cropEl = cropEl;
+            }
+            var cropElStyle = cropEl.style;
+            cropElStyle.width = round$3((dw + sx * dw / sw) * scaleX);
+            cropElStyle.height = round$3((dh + sy * dh / sh) * scaleY);
+            cropElStyle.filter = imageTransformPrefix + '.Matrix(Dx='
+                    + (-sx * dw / sw * scaleX) + ',Dy=' + (-sy * dh / sh * scaleY) + ')';
+
+            if (! cropEl.parentNode) {
+                vmlEl.appendChild(cropEl);
+            }
+            if (imageEl.parentNode != cropEl) {
+                cropEl.appendChild(imageEl);
+            }
+        }
+        else {
+            imageELStyle.width = round$3(scaleX * dw) + 'px';
+            imageELStyle.height = round$3(scaleY * dh) + 'px';
+
+            vmlEl.appendChild(imageEl);
+
+            if (cropEl && cropEl.parentNode) {
+                vmlEl.removeChild(cropEl);
+                this._cropEl = null;
+            }
+        }
+
+        var filterStr = '';
+        var alpha = style.opacity;
+        if (alpha < 1) {
+            filterStr += '.Alpha(opacity=' + round$3(alpha * 100) + ') ';
+        }
+        filterStr += imageTransformPrefix + '.AlphaImageLoader(src=' + image + ', SizingMethod=scale)';
+
+        imageELStyle.filter = filterStr;
+
+        vmlEl.style.zIndex = getZIndex(this.zlevel, this.z, this.z2);
+
+        // Append to root
+        append(vmlRoot, vmlEl);
+
+        // Text
+        if (style.text != null) {
+            this.drawRectText(vmlRoot, this.getBoundingRect());
+        }
+    };
+
+    ZImage.prototype.onRemove = function (vmlRoot) {
+        remove(vmlRoot, this._vmlEl);
+
+        this._vmlEl = null;
+        this._cropEl = null;
+        this._imageEl = null;
+
+        this.removeRectText(vmlRoot);
+    };
+
+    ZImage.prototype.onAdd = function (vmlRoot) {
+        append(vmlRoot, this._vmlEl);
+        this.appendRectText(vmlRoot);
+    };
+
+
+    /***************************************************
+     * TEXT
+     **************************************************/
+
+    var DEFAULT_STYLE_NORMAL = 'normal';
+
+    var fontStyleCache = {};
+    var fontStyleCacheCount = 0;
+    var MAX_FONT_CACHE_SIZE = 100;
+    var fontEl = document.createElement('div');
+
+    var getFontStyle = function (fontString) {
+        var fontStyle = fontStyleCache[fontString];
+        if (!fontStyle) {
+            // Clear cache
+            if (fontStyleCacheCount > MAX_FONT_CACHE_SIZE) {
+                fontStyleCacheCount = 0;
+                fontStyleCache = {};
+            }
+
+            var style = fontEl.style;
+            var fontFamily;
+            try {
+                style.font = fontString;
+                fontFamily = style.fontFamily.split(',')[0];
+            }
+            catch (e) {
+            }
+
+            fontStyle = {
+                style: style.fontStyle || DEFAULT_STYLE_NORMAL,
+                variant: style.fontVariant || DEFAULT_STYLE_NORMAL,
+                weight: style.fontWeight || DEFAULT_STYLE_NORMAL,
+                size: parseFloat(style.fontSize || 12) | 0,
+                family: fontFamily || 'Microsoft YaHei'
+            };
+
+            fontStyleCache[fontString] = fontStyle;
+            fontStyleCacheCount++;
+        }
+        return fontStyle;
+    };
+
+    var textMeasureEl;
+    // Overwrite measure text method
+    $override$1('measureText', function (text, textFont) {
+        var doc$$1 = doc;
+        if (!textMeasureEl) {
+            textMeasureEl = doc$$1.createElement('div');
+            textMeasureEl.style.cssText = 'position:absolute;top:-20000px;left:0;'
+                + 'padding:0;margin:0;border:none;white-space:pre;';
+            doc.body.appendChild(textMeasureEl);
+        }
+
+        try {
+            textMeasureEl.style.font = textFont;
+        } catch (ex) {
+            // Ignore failures to set to invalid font.
+        }
+        textMeasureEl.innerHTML = '';
+        // Don't use innerHTML or innerText because they allow markup/whitespace.
+        textMeasureEl.appendChild(doc$$1.createTextNode(text));
+        return {
+            width: textMeasureEl.offsetWidth
+        };
+    });
+
+    var tmpRect$2 = new BoundingRect();
+
+    var drawRectText = function (vmlRoot, rect, textRect, fromTextEl) {
+
+        var style = this.style;
+
+        // Optimize, avoid normalize every time.
+        this.__dirty && normalizeTextStyle(style, true);
+
+        var text = style.text;
+        // Convert to string
+        text != null && (text += '');
+        if (!text) {
+            return;
+        }
+
+        // Convert rich text to plain text. Rich text is not supported in
+        // IE8-, but tags in rich text template will be removed.
+        if (style.rich) {
+            var contentBlock = parseRichText(text, style);
+            text = [];
+            for (var i = 0; i < contentBlock.lines.length; i++) {
+                var tokens = contentBlock.lines[i].tokens;
+                var textLine = [];
+                for (var j = 0; j < tokens.length; j++) {
+                    textLine.push(tokens[j].text);
+                }
+                text.push(textLine.join(''));
+            }
+            text = text.join('\n');
+        }
+
+        var x;
+        var y;
+        var align = style.textAlign;
+        var verticalAlign = style.textVerticalAlign;
+
+        var fontStyle = getFontStyle(style.font);
+        // FIXME encodeHtmlAttribute ?
+        var font = fontStyle.style + ' ' + fontStyle.variant + ' ' + fontStyle.weight + ' '
+            + fontStyle.size + 'px "' + fontStyle.family + '"';
+
+        textRect = textRect || getBoundingRect(text, font, align, verticalAlign);
+
+        // Transform rect to view space
+        var m = this.transform;
+        // Ignore transform for text in other element
+        if (m && !fromTextEl) {
+            tmpRect$2.copy(rect);
+            tmpRect$2.applyTransform(m);
+            rect = tmpRect$2;
+        }
+
+        if (!fromTextEl) {
+            var textPosition = style.textPosition;
+            var distance$$1 = style.textDistance;
+            // Text position represented by coord
+            if (textPosition instanceof Array) {
+                x = rect.x + parsePercent$3(textPosition[0], rect.width);
+                y = rect.y + parsePercent$3(textPosition[1], rect.height);
+
+                align = align || 'left';
+            }
+            else {
+                var res = adjustTextPositionOnRect(
+                    textPosition, rect, distance$$1
+                );
+                x = res.x;
+                y = res.y;
+
+                // Default align and baseline when has textPosition
+                align = align || res.textAlign;
+                verticalAlign = verticalAlign || res.textVerticalAlign;
+            }
+        }
+        else {
+            x = rect.x;
+            y = rect.y;
+        }
+
+        x = adjustTextX(x, textRect.width, align);
+        y = adjustTextY(y, textRect.height, verticalAlign);
+
+        // Force baseline 'middle'
+        y += textRect.height / 2;
+
+        // var fontSize = fontStyle.size;
+        // 1.75 is an arbitrary number, as there is no info about the text baseline
+        // switch (baseline) {
+            // case 'hanging':
+            // case 'top':
+            //     y += fontSize / 1.75;
+            //     break;
+        //     case 'middle':
+        //         break;
+        //     default:
+        //     // case null:
+        //     // case 'alphabetic':
+        //     // case 'ideographic':
+        //     // case 'bottom':
+        //         y -= fontSize / 2.25;
+        //         break;
+        // }
+
+        // switch (align) {
+        //     case 'left':
+        //         break;
+        //     case 'center':
+        //         x -= textRect.width / 2;
+        //         break;
+        //     case 'right':
+        //         x -= textRect.width;
+        //         break;
+            // case 'end':
+                // align = elementStyle.direction == 'ltr' ? 'right' : 'left';
+                // break;
+            // case 'start':
+                // align = elementStyle.direction == 'rtl' ? 'right' : 'left';
+                // break;
+            // default:
+            //     align = 'left';
+        // }
+
+        var createNode$$1 = createNode;
+
+        var textVmlEl = this._textVmlEl;
+        var pathEl;
+        var textPathEl;
+        var skewEl;
+        if (!textVmlEl) {
+            textVmlEl = createNode$$1('line');
+            pathEl = createNode$$1('path');
+            textPathEl = createNode$$1('textpath');
+            skewEl = createNode$$1('skew');
+
+            // FIXME Why here is not cammel case
+            // Align 'center' seems wrong
+            textPathEl.style['v-text-align'] = 'left';
+
+            initRootElStyle(textVmlEl);
+
+            pathEl.textpathok = true;
+            textPathEl.on = true;
+
+            textVmlEl.from = '0 0';
+            textVmlEl.to = '1000 0.05';
+
+            append(textVmlEl, skewEl);
+            append(textVmlEl, pathEl);
+            append(textVmlEl, textPathEl);
+
+            this._textVmlEl = textVmlEl;
+        }
+        else {
+            // 这里是在前面 appendChild 保证顺序的前提下
+            skewEl = textVmlEl.firstChild;
+            pathEl = skewEl.nextSibling;
+            textPathEl = pathEl.nextSibling;
+        }
+
+        var coords = [x, y];
+        var textVmlElStyle = textVmlEl.style;
+        // Ignore transform for text in other element
+        if (m && fromTextEl) {
+            applyTransform(coords, coords, m);
+
+            skewEl.on = true;
+
+            skewEl.matrix = m[0].toFixed(3) + comma + m[2].toFixed(3) + comma +
+            m[1].toFixed(3) + comma + m[3].toFixed(3) + ',0,0';
+
+            // Text position
+            skewEl.offset = (round$3(coords[0]) || 0) + ',' + (round$3(coords[1]) || 0);
+            // Left top point as origin
+            skewEl.origin = '0 0';
+
+            textVmlElStyle.left = '0px';
+            textVmlElStyle.top = '0px';
+        }
+        else {
+            skewEl.on = false;
+            textVmlElStyle.left = round$3(x) + 'px';
+            textVmlElStyle.top = round$3(y) + 'px';
+        }
+
+        textPathEl.string = encodeHtmlAttribute(text);
+        // TODO
+        try {
+            textPathEl.style.font = font;
+        }
+        // Error font format
+        catch (e) {}
+
+        updateFillAndStroke(textVmlEl, 'fill', {
+            fill: style.textFill,
+            opacity: style.opacity
+        }, this);
+        updateFillAndStroke(textVmlEl, 'stroke', {
+            stroke: style.textStroke,
+            opacity: style.opacity,
+            lineDash: style.lineDash
+        }, this);
+
+        textVmlEl.style.zIndex = getZIndex(this.zlevel, this.z, this.z2);
+
+        // Attached to root
+        append(vmlRoot, textVmlEl);
+    };
+
+    var removeRectText = function (vmlRoot) {
+        remove(vmlRoot, this._textVmlEl);
+        this._textVmlEl = null;
+    };
+
+    var appendRectText = function (vmlRoot) {
+        append(vmlRoot, this._textVmlEl);
+    };
+
+    var list = [RectText, Displayable, ZImage, Path, Text];
+
+    // In case Displayable has been mixed in RectText
+    for (var i$3 = 0; i$3 < list.length; i$3++) {
+        var proto$8 = list[i$3].prototype;
+        proto$8.drawRectText = drawRectText;
+        proto$8.removeRectText = removeRectText;
+        proto$8.appendRectText = appendRectText;
+    }
+
+    Text.prototype.brushVML = function (vmlRoot) {
+        var style = this.style;
+        if (style.text != null) {
+            this.drawRectText(vmlRoot, {
+                x: style.x || 0, y: style.y || 0,
+                width: 0, height: 0
+            }, this.getBoundingRect(), true);
+        }
+        else {
+            this.removeRectText(vmlRoot);
+        }
+    };
+
+    Text.prototype.onRemove = function (vmlRoot) {
+        this.removeRectText(vmlRoot);
+    };
+
+    Text.prototype.onAdd = function (vmlRoot) {
+        this.appendRectText(vmlRoot);
+    };
+}
+
+/**
+ * VML Painter.
+ *
+ * @module zrender/vml/Painter
+ */
+
+function parseInt10$1(val) {
+    return parseInt(val, 10);
+}
+
+/**
+ * @alias module:zrender/vml/Painter
+ */
+function VMLPainter(root, storage) {
+
+    initVML();
+
+    this.root = root;
+
+    this.storage = storage;
+
+    var vmlViewport = document.createElement('div');
+
+    var vmlRoot = document.createElement('div');
+
+    vmlViewport.style.cssText = 'display:inline-block;overflow:hidden;position:relative;width:300px;height:150px;';
+
+    vmlRoot.style.cssText = 'position:absolute;left:0;top:0;';
+
+    root.appendChild(vmlViewport);
+
+    this._vmlRoot = vmlRoot;
+    this._vmlViewport = vmlViewport;
+
+    this.resize();
+
+    // Modify storage
+    var oldDelFromStorage = storage.delFromStorage;
+    var oldAddToStorage = storage.addToStorage;
+    storage.delFromStorage = function (el) {
+        oldDelFromStorage.call(storage, el);
+
+        if (el) {
+            el.onRemove && el.onRemove(vmlRoot);
+        }
+    };
+
+    storage.addToStorage = function (el) {
+        // Displayable already has a vml node
+        el.onAdd && el.onAdd(vmlRoot);
+
+        oldAddToStorage.call(storage, el);
+    };
+
+    this._firstPaint = true;
+}
+
+VMLPainter.prototype = {
+
+    constructor: VMLPainter,
+
+    getType: function () {
+        return 'vml';
+    },
+
+    /**
+     * @return {HTMLDivElement}
+     */
+    getViewportRoot: function () {
+        return this._vmlViewport;
+    },
+
+    getViewportRootOffset: function () {
+        var viewportRoot = this.getViewportRoot();
+        if (viewportRoot) {
+            return {
+                offsetLeft: viewportRoot.offsetLeft || 0,
+                offsetTop: viewportRoot.offsetTop || 0
+            };
+        }
+    },
+
+    /**
+     * 刷新
+     */
+    refresh: function () {
+
+        var list = this.storage.getDisplayList(true, true);
+
+        this._paintList(list);
+    },
+
+    _paintList: function (list) {
+        var vmlRoot = this._vmlRoot;
+        for (var i = 0; i < list.length; i++) {
+            var el = list[i];
+            if (el.invisible || el.ignore) {
+                if (!el.__alreadyNotVisible) {
+                    el.onRemove(vmlRoot);
+                }
+                // Set as already invisible
+                el.__alreadyNotVisible = true;
+            }
+            else {
+                if (el.__alreadyNotVisible) {
+                    el.onAdd(vmlRoot);
+                }
+                el.__alreadyNotVisible = false;
+                if (el.__dirty) {
+                    el.beforeBrush && el.beforeBrush();
+                    (el.brushVML || el.brush).call(el, vmlRoot);
+                    el.afterBrush && el.afterBrush();
+                }
+            }
+            el.__dirty = false;
+        }
+
+        if (this._firstPaint) {
+            // Detached from document at first time
+            // to avoid page refreshing too many times
+
+            // FIXME 如果每次都先 removeChild 可能会导致一些填充和描边的效果改变
+            this._vmlViewport.appendChild(vmlRoot);
+            this._firstPaint = false;
+        }
+    },
+
+    resize: function (width, height) {
+        var width = width == null ? this._getWidth() : width;
+        var height = height == null ? this._getHeight() : height;
+
+        if (this._width != width || this._height != height) {
+            this._width = width;
+            this._height = height;
+
+            var vmlViewportStyle = this._vmlViewport.style;
+            vmlViewportStyle.width = width + 'px';
+            vmlViewportStyle.height = height + 'px';
+        }
+    },
+
+    dispose: function () {
+        this.root.innerHTML = '';
+
+        this._vmlRoot =
+        this._vmlViewport =
+        this.storage = null;
+    },
+
+    getWidth: function () {
+        return this._width;
+    },
+
+    getHeight: function () {
+        return this._height;
+    },
+
+    clear: function () {
+        if (this._vmlViewport) {
+            this.root.removeChild(this._vmlViewport);
+        }
+    },
+
+    _getWidth: function () {
+        var root = this.root;
+        var stl = root.currentStyle;
+
+        return ((root.clientWidth || parseInt10$1(stl.width))
+                - parseInt10$1(stl.paddingLeft)
+                - parseInt10$1(stl.paddingRight)) | 0;
+    },
+
+    _getHeight: function () {
+        var root = this.root;
+        var stl = root.currentStyle;
+
+        return ((root.clientHeight || parseInt10$1(stl.height))
+                - parseInt10$1(stl.paddingTop)
+                - parseInt10$1(stl.paddingBottom)) | 0;
+    }
+};
+
+// Not supported methods
+function createMethodNotSupport(method) {
+    return function () {
+        zrLog('In IE8.0 VML mode painter not support method "' + method + '"');
+    };
+}
+
+// Unsupported methods
+each$1([
+    'getLayer', 'insertLayer', 'eachLayer', 'eachBuiltinLayer', 'eachOtherLayer', 'getLayers',
+    'modLayer', 'delLayer', 'clearLayer', 'toDataURL', 'pathToImage'
+], function (name) {
+    VMLPainter.prototype[name] = createMethodNotSupport(name);
+});
+
+registerPainter('vml', VMLPainter);
+
+var svgURI = 'http://www.w3.org/2000/svg';
+
+function createElement(name) {
+    return document.createElementNS(svgURI, name);
+}
+
+// TODO
+// 1. shadow
+// 2. Image: sx, sy, sw, sh
+
+var CMD$4 = PathProxy.CMD;
+var arrayJoin = Array.prototype.join;
+
+var NONE = 'none';
+var mathRound = Math.round;
+var mathSin$3 = Math.sin;
+var mathCos$3 = Math.cos;
+var PI$5 = Math.PI;
+var PI2$7 = Math.PI * 2;
+var degree = 180 / PI$5;
+
+var EPSILON$4 = 1e-4;
+
+function round4(val) {
+    return mathRound(val * 1e4) / 1e4;
+}
+
+function isAroundZero$1(val) {
+    return val < EPSILON$4 && val > -EPSILON$4;
+}
+
+function pathHasFill(style, isText) {
+    var fill = isText ? style.textFill : style.fill;
+    return fill != null && fill !== NONE;
+}
+
+function pathHasStroke(style, isText) {
+    var stroke = isText ? style.textStroke : style.stroke;
+    return stroke != null && stroke !== NONE;
+}
+
+function setTransform(svgEl, m) {
+    if (m) {
+        attr(svgEl, 'transform', 'matrix(' + arrayJoin.call(m, ',') + ')');
+    }
+}
+
+function attr(el, key, val) {
+    if (!val || val.type !== 'linear' && val.type !== 'radial') {
+        // Don't set attribute for gradient, since it need new dom nodes
+        if (typeof val === 'string' && val.indexOf('NaN') > -1) {
+            console.log(val);
+        }
+        el.setAttribute(key, val);
+    }
+}
+
+function attrXLink(el, key, val) {
+    el.setAttributeNS('http://www.w3.org/1999/xlink', key, val);
+}
+
+function bindStyle(svgEl, style, isText) {
+    if (pathHasFill(style, isText)) {
+        var fill = isText ? style.textFill : style.fill;
+        fill = fill === 'transparent' ? NONE : fill;
+
+        /**
+         * FIXME:
+         * This is a temporary fix for Chrome's clipping bug
+         * that happens when a clip-path is referring another one.
+         * This fix should be used before Chrome's bug is fixed.
+         * For an element that has clip-path, and fill is none,
+         * set it to be "rgba(0, 0, 0, 0.002)" will hide the element.
+         * Otherwise, it will show black fill color.
+         * 0.002 is used because this won't work for alpha values smaller
+         * than 0.002.
+         *
+         * See
+         * https://bugs.chromium.org/p/chromium/issues/detail?id=659790
+         * for more information.
+         */
+        if (svgEl.getAttribute('clip-path') !== 'none' && fill === NONE) {
+            fill = 'rgba(0, 0, 0, 0.002)';
+        }
+
+        attr(svgEl, 'fill', fill);
+        attr(svgEl, 'fill-opacity', style.opacity);
+    }
+    else {
+        attr(svgEl, 'fill', NONE);
+    }
+
+    if (pathHasStroke(style, isText)) {
+        var stroke = isText ? style.textStroke : style.stroke;
+        stroke = stroke === 'transparent' ? NONE : stroke;
+        attr(svgEl, 'stroke', stroke);
+        var strokeWidth = isText
+            ? style.textStrokeWidth
+            : style.lineWidth;
+        var strokeScale = !isText && style.strokeNoScale
+            ? style.host.getLineScale()
+            : 1;
+        attr(svgEl, 'stroke-width', strokeWidth / strokeScale);
+        // stroke then fill for text; fill then stroke for others
+        attr(svgEl, 'paint-order', isText ? 'stroke' : 'fill');
+        attr(svgEl, 'stroke-opacity', style.opacity);
+        var lineDash = style.lineDash;
+        if (lineDash) {
+            attr(svgEl, 'stroke-dasharray', style.lineDash.join(','));
+            attr(svgEl, 'stroke-dashoffset', mathRound(style.lineDashOffset || 0));
+        }
+        else {
+            attr(svgEl, 'stroke-dasharray', '');
+        }
+
+        // PENDING
+        style.lineCap && attr(svgEl, 'stroke-linecap', style.lineCap);
+        style.lineJoin && attr(svgEl, 'stroke-linejoin', style.lineJoin);
+        style.miterLimit && attr(svgEl, 'stroke-miterlimit', style.miterLimit);
+    }
+    else {
+        attr(svgEl, 'stroke', NONE);
+    }
+}
+
+/***************************************************
+ * PATH
+ **************************************************/
+function pathDataToString$1(path) {
+    var str = [];
+    var data = path.data;
+    var dataLength = path.len();
+    for (var i = 0; i < dataLength;) {
+        var cmd = data[i++];
+        var cmdStr = '';
+        var nData = 0;
+        switch (cmd) {
+            case CMD$4.M:
+                cmdStr = 'M';
+                nData = 2;
+                break;
+            case CMD$4.L:
+                cmdStr = 'L';
+                nData = 2;
+                break;
+            case CMD$4.Q:
+                cmdStr = 'Q';
+                nData = 4;
+                break;
+            case CMD$4.C:
+                cmdStr = 'C';
+                nData = 6;
+                break;
+            case CMD$4.A:
+                var cx = data[i++];
+                var cy = data[i++];
+                var rx = data[i++];
+                var ry = data[i++];
+                var theta = data[i++];
+                var dTheta = data[i++];
+                var psi = data[i++];
+                var clockwise = data[i++];
+
+                var dThetaPositive = Math.abs(dTheta);
+                var isCircle = isAroundZero$1(dThetaPositive - PI2$7)
+                    && !isAroundZero$1(dThetaPositive);
+
+                var large = false;
+                if (dThetaPositive >= PI2$7) {
+                    large = true;
+                }
+                else if (isAroundZero$1(dThetaPositive)) {
+                    large = false;
+                }
+                else {
+                    large = (dTheta > -PI$5 && dTheta < 0 || dTheta > PI$5)
+                        === !!clockwise;
+                }
+
+                var x0 = round4(cx + rx * mathCos$3(theta));
+                var y0 = round4(cy + ry * mathSin$3(theta));
+
+                // It will not draw if start point and end point are exactly the same
+                // We need to shift the end point with a small value
+                // FIXME A better way to draw circle ?
+                if (isCircle) {
+                    if (clockwise) {
+                        dTheta = PI2$7 - 1e-4;
+                    }
+                    else {
+                        dTheta = -PI2$7 + 1e-4;
+                    }
+
+                    large = true;
+
+                    if (i === 9) {
+                        // Move to (x0, y0) only when CMD.A comes at the
+                        // first position of a shape.
+                        // For instance, when drawing a ring, CMD.A comes
+                        // after CMD.M, so it's unnecessary to move to
+                        // (x0, y0).
+                        str.push('M', x0, y0);
+                    }
+                }
+
+                var x = round4(cx + rx * mathCos$3(theta + dTheta));
+                var y = round4(cy + ry * mathSin$3(theta + dTheta));
+
+                // FIXME Ellipse
+                str.push('A', round4(rx), round4(ry),
+                    mathRound(psi * degree), +large, +clockwise, x, y);
+                break;
+            case CMD$4.Z:
+                cmdStr = 'Z';
+                break;
+            case CMD$4.R:
+                var x = round4(data[i++]);
+                var y = round4(data[i++]);
+                var w = round4(data[i++]);
+                var h = round4(data[i++]);
+                str.push(
+                    'M', x, y,
+                    'L', x + w, y,
+                    'L', x + w, y + h,
+                    'L', x, y + h,
+                    'L', x, y
+                );
+                break;
+        }
+        cmdStr && str.push(cmdStr);
+        for (var j = 0; j < nData; j++) {
+            // PENDING With scale
+            str.push(round4(data[i++]));
+        }
+    }
+    return str.join(' ');
+}
+
+var svgPath = {};
+svgPath.brush = function (el) {
+    var style = el.style;
+
+    var svgEl = el.__svgEl;
+    if (!svgEl) {
+        svgEl = createElement('path');
+        el.__svgEl = svgEl;
+    }
+
+    if (!el.path) {
+        el.createPathProxy();
+    }
+    var path = el.path;
+
+    if (el.__dirtyPath) {
+        path.beginPath();
+        el.buildPath(path, el.shape);
+        el.__dirtyPath = false;
+
+        var pathStr = pathDataToString$1(path);
+        if (pathStr.indexOf('NaN') < 0) {
+            // Ignore illegal path, which may happen such in out-of-range
+            // data in Calendar series.
+            attr(svgEl, 'd', pathStr);
+        }
+    }
+
+    bindStyle(svgEl, style);
+    setTransform(svgEl, el.transform);
+
+    if (style.text != null) {
+        svgTextDrawRectText(el, el.getBoundingRect());
+    }
+};
+
+/***************************************************
+ * IMAGE
+ **************************************************/
+var svgImage = {};
+svgImage.brush = function (el) {
+    var style = el.style;
+    var image = style.image;
+
+    if (image instanceof HTMLImageElement) {
+        var src = image.src;
+        image = src;
+    }
+    if (! image) {
+        return;
+    }
+
+    var x = style.x || 0;
+    var y = style.y || 0;
+
+    var dw = style.width;
+    var dh = style.height;
+
+    var svgEl = el.__svgEl;
+    if (! svgEl) {
+        svgEl = createElement('image');
+        el.__svgEl = svgEl;
+    }
+
+    if (image !== el.__imageSrc) {
+        attrXLink(svgEl, 'href', image);
+        // Caching image src
+        el.__imageSrc = image;
+    }
+
+    attr(svgEl, 'width', dw);
+    attr(svgEl, 'height', dh);
+
+    attr(svgEl, 'x', x);
+    attr(svgEl, 'y', y);
+
+    setTransform(svgEl, el.transform);
+
+    if (style.text != null) {
+        svgTextDrawRectText(el, el.getBoundingRect());
+    }
+};
+
+/***************************************************
+ * TEXT
+ **************************************************/
+var svgText = {};
+var tmpRect$3 = new BoundingRect();
+
+var svgTextDrawRectText = function (el, rect, textRect) {
+    var style = el.style;
+
+    el.__dirty && normalizeTextStyle(style, true);
+
+    var text = style.text;
+    // Convert to string
+    if (text == null) {
+        // Draw no text only when text is set to null, but not ''
+        return;
+    }
+    else {
+        text += '';
+    }
+
+    var textSvgEl = el.__textSvgEl;
+    if (! textSvgEl) {
+        textSvgEl = createElement('text');
+        el.__textSvgEl = textSvgEl;
+    }
+
+    var x;
+    var y;
+    var textPosition = style.textPosition;
+    var distance = style.textDistance;
+    var align = style.textAlign || 'left';
+
+    if (typeof style.fontSize === 'number') {
+        style.fontSize += 'px';
+    }
+    var font = style.font
+        || [
+            style.fontStyle || '',
+            style.fontWeight || '',
+            style.fontSize || '',
+            style.fontFamily || ''
+        ].join(' ')
+        || DEFAULT_FONT;
+
+    var verticalAlign = getVerticalAlignForSvg(style.textVerticalAlign);
+
+    textRect = getBoundingRect(text, font, align,
+        verticalAlign);
+
+    var lineHeight = textRect.lineHeight;
+    // Text position represented by coord
+    if (textPosition instanceof Array) {
+        x = rect.x + textPosition[0];
+        y = rect.y + textPosition[1];
+    }
+    else {
+        var newPos = adjustTextPositionOnRect(
+            textPosition, rect, distance
+        );
+        x = newPos.x;
+        y = newPos.y;
+        verticalAlign = getVerticalAlignForSvg(newPos.textVerticalAlign);
+        align = newPos.textAlign;
+    }
+
+    attr(textSvgEl, 'alignment-baseline', verticalAlign);
+
+    if (font) {
+        textSvgEl.style.font = font;
+    }
+
+    var textPadding = style.textPadding;
+
+    // Make baseline top
+    attr(textSvgEl, 'x', x);
+    attr(textSvgEl, 'y', y);
+
+    bindStyle(textSvgEl, style, true);
+    if (el instanceof Text || el.style.transformText) {
+        // Transform text with element
+        setTransform(textSvgEl, el.transform);
+    }
+    else {
+        if (el.transform) {
+            tmpRect$3.copy(rect);
+            tmpRect$3.applyTransform(el.transform);
+            rect = tmpRect$3;
+        }
+        else {
+            var pos = el.transformCoordToGlobal(rect.x, rect.y);
+            rect.x = pos[0];
+            rect.y = pos[1];
+        }
+
+        // Text rotation, but no element transform
+        var origin = style.textOrigin;
+        if (origin === 'center') {
+            x = textRect.width / 2 + x;
+            y = textRect.height / 2 + y;
+        }
+        else if (origin) {
+            x = origin[0] + x;
+            y = origin[1] + y;
+        }
+        var rotate$$1 = -style.textRotation || 0;
+        var transform = create$1();
+        // Apply textRotate to element matrix
+        rotate(transform, el.transform, rotate$$1);
+        setTransform(textSvgEl, transform);
+    }
+
+    var textLines = text.split('\n');
+    var nTextLines = textLines.length;
+    var textAnchor = align;
+    // PENDING
+    if (textAnchor === 'left')  {
+        textAnchor = 'start';
+        textPadding && (x += textPadding[3]);
+    }
+    else if (textAnchor === 'right') {
+        textAnchor = 'end';
+        textPadding && (x -= textPadding[1]);
+    }
+    else if (textAnchor === 'center') {
+        textAnchor = 'middle';
+        textPadding && (x += (textPadding[3] - textPadding[1]) / 2);
+    }
+
+    var dy = 0;
+    if (verticalAlign === 'baseline') {
+        dy = -textRect.height + lineHeight;
+        textPadding && (dy -= textPadding[2]);
+    }
+    else if (verticalAlign === 'middle') {
+        dy = (-textRect.height + lineHeight) / 2;
+        textPadding && (y += (textPadding[0] - textPadding[2]) / 2);
+    }
+    else {
+        textPadding && (dy += textPadding[0]);
+    }
+
+    // Font may affect position of each tspan elements
+    if (el.__text !== text || el.__textFont !== font) {
+        var tspanList = el.__tspanList || [];
+        el.__tspanList = tspanList;
+        for (var i = 0; i < nTextLines; i++) {
+            // Using cached tspan elements
+            var tspan = tspanList[i];
+            if (! tspan) {
+                tspan = tspanList[i] = createElement('tspan');
+                textSvgEl.appendChild(tspan);
+                attr(tspan, 'alignment-baseline', verticalAlign);
+                attr(tspan, 'text-anchor', textAnchor);
+            }
+            else {
+                tspan.innerHTML = '';
+            }
+            attr(tspan, 'x', x);
+            attr(tspan, 'y', y + i * lineHeight + dy);
+            tspan.appendChild(document.createTextNode(textLines[i]));
+        }
+        // Remove unsed tspan elements
+        for (; i < tspanList.length; i++) {
+            textSvgEl.removeChild(tspanList[i]);
+        }
+        tspanList.length = nTextLines;
+
+        el.__text = text;
+        el.__textFont = font;
+    }
+    else if (el.__tspanList.length) {
+        // Update span x and y
+        var len = el.__tspanList.length;
+        for (var i = 0; i < len; ++i) {
+            var tspan = el.__tspanList[i];
+            if (tspan) {
+                attr(tspan, 'x', x);
+                attr(tspan, 'y', y + i * lineHeight + dy);
+            }
+        }
+    }
+};
+
+function getVerticalAlignForSvg(verticalAlign) {
+    if (verticalAlign === 'middle') {
+        return 'middle';
+    }
+    else if (verticalAlign === 'bottom') {
+        return 'baseline';
+    }
+    else {
+        return 'hanging';
+    }
+}
+
+svgText.drawRectText = svgTextDrawRectText;
+
+svgText.brush = function (el) {
+    var style = el.style;
+    if (style.text != null) {
+        // 强制设置 textPosition
+        style.textPosition = [0, 0];
+        svgTextDrawRectText(el, {
+            x: style.x || 0, y: style.y || 0,
+            width: 0, height: 0
+        }, el.getBoundingRect());
+    }
+};
+
+// Myers' Diff Algorithm
+// Modified from https://github.com/kpdecker/jsdiff/blob/master/src/diff/base.js
+
+function Diff() {}
+
+Diff.prototype = {
+    diff: function (oldArr, newArr, equals) {
+        if (!equals) {
+            equals = function (a, b) {
+                return a === b;
+            };
+        }
+        this.equals = equals;
+
+        var self = this;
+
+        oldArr = oldArr.slice();
+        newArr = newArr.slice();
+        // Allow subclasses to massage the input prior to running
+        var newLen = newArr.length;
+        var oldLen = oldArr.length;
+        var editLength = 1;
+        var maxEditLength = newLen + oldLen;
+        var bestPath = [{ newPos: -1, components: [] }];
+
+        // Seed editLength = 0, i.e. the content starts with the same values
+        var oldPos = this.extractCommon(bestPath[0], newArr, oldArr, 0);
+        if (bestPath[0].newPos + 1 >= newLen && oldPos + 1 >= oldLen) {
+            var indices = [];
+            for (var i = 0; i < newArr.length; i++) {
+                indices.push(i);
+            }
+            // Identity per the equality and tokenizer
+            return [{
+                indices: indices, count: newArr.length
+            }];
+        }
+
+        // Main worker method. checks all permutations of a given edit length for acceptance.
+        function execEditLength() {
+            for (var diagonalPath = -1 * editLength; diagonalPath <= editLength; diagonalPath += 2) {
+                var basePath;
+                var addPath = bestPath[diagonalPath - 1];
+                var removePath = bestPath[diagonalPath + 1];
+                var oldPos = (removePath ? removePath.newPos : 0) - diagonalPath;
+                if (addPath) {
+                    // No one else is going to attempt to use this value, clear it
+                    bestPath[diagonalPath - 1] = undefined;
+                }
+
+                var canAdd = addPath && addPath.newPos + 1 < newLen;
+                var canRemove = removePath && 0 <= oldPos && oldPos < oldLen;
+                if (!canAdd && !canRemove) {
+                    // If this path is a terminal then prune
+                    bestPath[diagonalPath] = undefined;
+                    continue;
+                }
+
+                // Select the diagonal that we want to branch from. We select the prior
+                // path whose position in the new string is the farthest from the origin
+                // and does not pass the bounds of the diff graph
+                if (!canAdd || (canRemove && addPath.newPos < removePath.newPos)) {
+                    basePath = clonePath(removePath);
+                    self.pushComponent(basePath.components, undefined, true);
+                }
+                else {
+                    basePath = addPath;   // No need to clone, we've pulled it from the list
+                    basePath.newPos++;
+                    self.pushComponent(basePath.components, true, undefined);
+                }
+
+                oldPos = self.extractCommon(basePath, newArr, oldArr, diagonalPath);
+
+                // If we have hit the end of both strings, then we are done
+                if (basePath.newPos + 1 >= newLen && oldPos + 1 >= oldLen) {
+                    return buildValues(self, basePath.components, newArr, oldArr);
+                }
+                else {
+                    // Otherwise track this path as a potential candidate and continue.
+                    bestPath[diagonalPath] = basePath;
+                }
+            }
+
+            editLength++;
+        }
+
+        while (editLength <= maxEditLength) {
+            var ret = execEditLength();
+            if (ret) {
+                return ret;
+            }
+        }
+    },
+
+    pushComponent: function (components, added, removed) {
+        var last = components[components.length - 1];
+        if (last && last.added === added && last.removed === removed) {
+            // We need to clone here as the component clone operation is just
+            // as shallow array clone
+            components[components.length - 1] = {count: last.count + 1, added: added, removed: removed };
+        }
+        else {
+            components.push({count: 1, added: added, removed: removed });
+        }
+    },
+    extractCommon: function (basePath, newArr, oldArr, diagonalPath) {
+        var newLen = newArr.length;
+        var oldLen = oldArr.length;
+        var newPos = basePath.newPos;
+        var oldPos = newPos - diagonalPath;
+        var commonCount = 0;
+
+        while (newPos + 1 < newLen && oldPos + 1 < oldLen && this.equals(newArr[newPos + 1], oldArr[oldPos + 1])) {
+            newPos++;
+            oldPos++;
+            commonCount++;
+        }
+
+        if (commonCount) {
+            basePath.components.push({count: commonCount});
+        }
+
+        basePath.newPos = newPos;
+        return oldPos;
+    },
+    tokenize: function (value) {
+        return value.slice();
+    },
+    join: function (value) {
+        return value.slice();
+    }
+};
+
+function buildValues(diff, components, newArr, oldArr) {
+    var componentPos = 0;
+    var componentLen = components.length;
+    var newPos = 0;
+    var oldPos = 0;
+
+    for (; componentPos < componentLen; componentPos++) {
+        var component = components[componentPos];
+        if (!component.removed) {
+            var indices = [];
+            for (var i = newPos; i < newPos + component.count; i++) {
+                indices.push(i);
+            }
+            component.indices = indices;
+            newPos += component.count;
+            // Common case
+            if (!component.added) {
+                oldPos += component.count;
+            }
+        }
+        else {
+            var indices = [];
+            for (var i = oldPos; i < oldPos + component.count; i++) {
+                indices.push(i);
+            }
+            component.indices = indices;
+            oldPos += component.count;
+        }
+    }
+
+    return components;
+}
+
+function clonePath(path) {
+    return { newPos: path.newPos, components: path.components.slice(0) };
+}
+
+var arrayDiff = new Diff();
+
+var arrayDiff$1 = function (oldArr, newArr, callback) {
+    return arrayDiff.diff(oldArr, newArr, callback);
+};
+
+/**
+ * @file Manages elements that can be defined in <defs> in SVG,
+ *       e.g., gradients, clip path, etc.
+ * @author Zhang Wenli
+ */
+
+var MARK_UNUSED = '0';
+var MARK_USED = '1';
+
+/**
+ * Manages elements that can be defined in <defs> in SVG,
+ * e.g., gradients, clip path, etc.
+ *
+ * @class
+ * @param {number}          zrId      zrender instance id
+ * @param {SVGElement}      svgRoot   root of SVG document
+ * @param {string|string[]} tagNames  possible tag names
+ * @param {string}          markLabel label name to make if the element
+ *                                    is used
+ */
+function Definable(
+    zrId,
+    svgRoot,
+    tagNames,
+    markLabel,
+    domName
+) {
+    this._zrId = zrId;
+    this._svgRoot = svgRoot;
+    this._tagNames = typeof tagNames === 'string' ? [tagNames] : tagNames;
+    this._markLabel = markLabel;
+    this._domName = domName || '_dom';
+
+    this.nextId = 0;
+}
+
+
+Definable.prototype.createElement = createElement;
+
+
+/**
+ * Get the <defs> tag for svgRoot; optionally creates one if not exists.
+ *
+ * @param {boolean} isForceCreating if need to create when not exists
+ * @return {SVGDefsElement} SVG <defs> element, null if it doesn't
+ * exist and isForceCreating is false
+ */
+Definable.prototype.getDefs = function (isForceCreating) {
+    var svgRoot = this._svgRoot;
+    var defs = this._svgRoot.getElementsByTagName('defs');
+    if (defs.length === 0) {
+        // Not exist
+        if (isForceCreating) {
+            defs = svgRoot.insertBefore(
+                this.createElement('defs'), // Create new tag
+                svgRoot.firstChild // Insert in the front of svg
+            );
+            if (!defs.contains) {
+                // IE doesn't support contains method
+                defs.contains = function (el) {
+                    var children = defs.children;
+                    if (!children) {
+                        return false;
+                    }
+                    for (var i = children.length - 1; i >= 0; --i) {
+                        if (children[i] === el) {
+                            return true;
+                        }
+                    }
+                    return false;
+                };
+            }
+            return defs;
+        }
+        else {
+            return null;
+        }
+    }
+    else {
+        return defs[0];
+    }
+};
+
+
+/**
+ * Update DOM element if necessary.
+ *
+ * @param {Object|string} element style element. e.g., for gradient,
+ *                                it may be '#ccc' or {type: 'linear', ...}
+ * @param {Function|undefined} onUpdate update callback
+ */
+Definable.prototype.update = function (element, onUpdate) {
+    if (!element) {
+        return;
+    }
+
+    var defs = this.getDefs(false);
+    if (element[this._domName] && defs.contains(element[this._domName])) {
+        // Update DOM
+        if (typeof onUpdate === 'function') {
+            onUpdate(element);
+        }
+    }
+    else {
+        // No previous dom, create new
+        var dom = this.add(element);
+        if (dom) {
+            element[this._domName] = dom;
+        }
+    }
+};
+
+
+/**
+ * Add gradient dom to defs
+ *
+ * @param {SVGElement} dom DOM to be added to <defs>
+ */
+Definable.prototype.addDom = function (dom) {
+    var defs = this.getDefs(true);
+    defs.appendChild(dom);
+};
+
+
+/**
+ * Remove DOM of a given element.
+ *
+ * @param {SVGElement} element element to remove dom
+ */
+Definable.prototype.removeDom = function (element) {
+    var defs = this.getDefs(false);
+    if (defs && element[this._domName]) {
+        defs.removeChild(element[this._domName]);
+        element[this._domName] = null;
+    }
+};
+
+
+/**
+ * Get DOMs of this element.
+ *
+ * @return {HTMLDomElement} doms of this defineable elements in <defs>
+ */
+Definable.prototype.getDoms = function () {
+    var defs = this.getDefs(false);
+    if (!defs) {
+        // No dom when defs is not defined
+        return [];
+    }
+
+    var doms = [];
+    each$1(this._tagNames, function (tagName) {
+        var tags = defs.getElementsByTagName(tagName);
+        // Note that tags is HTMLCollection, which is array-like
+        // rather than real array.
+        // So `doms.concat(tags)` add tags as one object.
+        doms = doms.concat([].slice.call(tags));
+    });
+
+    return doms;
+};
+
+
+/**
+ * Mark DOMs to be unused before painting, and clear unused ones at the end
+ * of the painting.
+ */
+Definable.prototype.markAllUnused = function () {
+    var doms = this.getDoms();
+    var that = this;
+    each$1(doms, function (dom) {
+        dom[that._markLabel] = MARK_UNUSED;
+    });
+};
+
+
+/**
+ * Mark a single DOM to be used.
+ *
+ * @param {SVGElement} dom DOM to mark
+ */
+Definable.prototype.markUsed = function (dom) {
+    if (dom) {
+        dom[this._markLabel] = MARK_USED;
+    }
+};
+
+
+/**
+ * Remove unused DOMs defined in <defs>
+ */
+Definable.prototype.removeUnused = function () {
+    var defs = this.getDefs(false);
+    if (!defs) {
+        // Nothing to remove
+        return;
+    }
+
+    var doms = this.getDoms();
+    var that = this;
+    each$1(doms, function (dom) {
+        if (dom[that._markLabel] !== MARK_USED) {
+            // Remove gradient
+            defs.removeChild(dom);
+        }
+    });
+};
+
+
+/**
+ * Get SVG proxy.
+ *
+ * @param {Displayable} displayable displayable element
+ * @return {Path|Image|Text} svg proxy of given element
+ */
+Definable.prototype.getSvgProxy = function (displayable) {
+    if (displayable instanceof Path) {
+        return svgPath;
+    }
+    else if (displayable instanceof ZImage) {
+        return svgImage;
+    }
+    else if (displayable instanceof Text) {
+        return svgText;
+    }
+    else {
+        return svgPath;
+    }
+};
+
+
+/**
+ * Get text SVG element.
+ *
+ * @param {Displayable} displayable displayable element
+ * @return {SVGElement} SVG element of text
+ */
+Definable.prototype.getTextSvgElement = function (displayable) {
+    return displayable.__textSvgEl;
+};
+
+
+/**
+ * Get SVG element.
+ *
+ * @param {Displayable} displayable displayable element
+ * @return {SVGElement} SVG element
+ */
+Definable.prototype.getSvgElement = function (displayable) {
+    return displayable.__svgEl;
+};
+
+/**
+ * @file Manages SVG gradient elements.
+ * @author Zhang Wenli
+ */
+
+/**
+ * Manages SVG gradient elements.
+ *
+ * @class
+ * @extends Definable
+ * @param   {number}     zrId    zrender instance id
+ * @param   {SVGElement} svgRoot root of SVG document
+ */
+function GradientManager(zrId, svgRoot) {
+    Definable.call(
+        this,
+        zrId,
+        svgRoot,
+        ['linearGradient', 'radialGradient'],
+        '__gradient_in_use__'
+    );
+}
+
+
+inherits(GradientManager, Definable);
+
+
+/**
+ * Create new gradient DOM for fill or stroke if not exist,
+ * but will not update gradient if exists.
+ *
+ * @param {SvgElement}  svgElement   SVG element to paint
+ * @param {Displayable} displayable  zrender displayable element
+ */
+GradientManager.prototype.addWithoutUpdate = function (
+    svgElement,
+    displayable
+) {
+    if (displayable && displayable.style) {
+        var that = this;
+        each$1(['fill', 'stroke'], function (fillOrStroke) {
+            if (displayable.style[fillOrStroke]
+                && (displayable.style[fillOrStroke].type === 'linear'
+                || displayable.style[fillOrStroke].type === 'radial')
+            ) {
+                var gradient = displayable.style[fillOrStroke];
+                var defs = that.getDefs(true);
+
+                // Create dom in <defs> if not exists
+                var dom;
+                if (gradient._dom) {
+                    // Gradient exists
+                    dom = gradient._dom;
+                    if (!defs.contains(gradient._dom)) {
+                        // _dom is no longer in defs, recreate
+                        that.addDom(dom);
+                    }
+                }
+                else {
+                    // New dom
+                    dom = that.add(gradient);
+                }
+
+                that.markUsed(displayable);
+
+                var id = dom.getAttribute('id');
+                svgElement.setAttribute(fillOrStroke, 'url(#' + id + ')');
+            }
+        });
+    }
+};
+
+
+/**
+ * Add a new gradient tag in <defs>
+ *
+ * @param   {Gradient} gradient zr gradient instance
+ * @return {SVGLinearGradientElement | SVGRadialGradientElement}
+ *                            created DOM
+ */
+GradientManager.prototype.add = function (gradient) {
+    var dom;
+    if (gradient.type === 'linear') {
+        dom = this.createElement('linearGradient');
+    }
+    else if (gradient.type === 'radial') {
+        dom = this.createElement('radialGradient');
+    }
+    else {
+        zrLog('Illegal gradient type.');
+        return null;
+    }
+
+    // Set dom id with gradient id, since each gradient instance
+    // will have no more than one dom element.
+    // id may exists before for those dirty elements, in which case
+    // id should remain the same, and other attributes should be
+    // updated.
+    gradient.id = gradient.id || this.nextId++;
+    dom.setAttribute('id', 'zr' + this._zrId
+        + '-gradient-' + gradient.id);
+
+    this.updateDom(gradient, dom);
+    this.addDom(dom);
+
+    return dom;
+};
+
+
+/**
+ * Update gradient.
+ *
+ * @param {Gradient} gradient zr gradient instance
+ */
+GradientManager.prototype.update = function (gradient) {
+    var that = this;
+    Definable.prototype.update.call(this, gradient, function () {
+        var type = gradient.type;
+        var tagName = gradient._dom.tagName;
+        if (type === 'linear' && tagName === 'linearGradient'
+            || type === 'radial' && tagName === 'radialGradient'
+        ) {
+            // Gradient type is not changed, update gradient
+            that.updateDom(gradient, gradient._dom);
+        }
+        else {
+            // Remove and re-create if type is changed
+            that.removeDom(gradient);
+            that.add(gradient);
+        }
+    });
+};
+
+
+/**
+ * Update gradient dom
+ *
+ * @param {Gradient} gradient zr gradient instance
+ * @param {SVGLinearGradientElement | SVGRadialGradientElement} dom
+ *                            DOM to update
+ */
+GradientManager.prototype.updateDom = function (gradient, dom) {
+    if (gradient.type === 'linear') {
+        dom.setAttribute('x1', gradient.x);
+        dom.setAttribute('y1', gradient.y);
+        dom.setAttribute('x2', gradient.x2);
+        dom.setAttribute('y2', gradient.y2);
+    }
+    else if (gradient.type === 'radial') {
+        dom.setAttribute('cx', gradient.x);
+        dom.setAttribute('cy', gradient.y);
+        dom.setAttribute('r', gradient.r);
+    }
+    else {
+        zrLog('Illegal gradient type.');
+        return;
+    }
+
+    if (gradient.global) {
+        // x1, x2, y1, y2 in range of 0 to canvas width or height
+        dom.setAttribute('gradientUnits', 'userSpaceOnUse');
+    }
+    else {
+        // x1, x2, y1, y2 in range of 0 to 1
+        dom.setAttribute('gradientUnits', 'objectBoundingBox');
+    }
+
+    // Remove color stops if exists
+    dom.innerHTML = '';
+
+    // Add color stops
+    var colors = gradient.colorStops;
+    for (var i = 0, len = colors.length; i < len; ++i) {
+        var stop = this.createElement('stop');
+        stop.setAttribute('offset', colors[i].offset * 100 + '%');
+        stop.setAttribute('stop-color', colors[i].color);
+        dom.appendChild(stop);
+    }
+
+    // Store dom element in gradient, to avoid creating multiple
+    // dom instances for the same gradient element
+    gradient._dom = dom;
+};
+
+/**
+ * Mark a single gradient to be used
+ *
+ * @param {Displayable} displayable displayable element
+ */
+GradientManager.prototype.markUsed = function (displayable) {
+    if (displayable.style) {
+        var gradient = displayable.style.fill;
+        if (gradient && gradient._dom) {
+            Definable.prototype.markUsed.call(this, gradient._dom);
+        }
+
+        gradient = displayable.style.stroke;
+        if (gradient && gradient._dom) {
+            Definable.prototype.markUsed.call(this, gradient._dom);
+        }
+    }
+};
+
+/**
+ * @file Manages SVG clipPath elements.
+ * @author Zhang Wenli
+ */
+
+/**
+ * Manages SVG clipPath elements.
+ *
+ * @class
+ * @extends Definable
+ * @param   {number}     zrId    zrender instance id
+ * @param   {SVGElement} svgRoot root of SVG document
+ */
+function ClippathManager(zrId, svgRoot) {
+    Definable.call(this, zrId, svgRoot, 'clipPath', '__clippath_in_use__');
+}
+
+
+inherits(ClippathManager, Definable);
+
+
+/**
+ * Update clipPath.
+ *
+ * @param {Displayable} displayable displayable element
+ */
+ClippathManager.prototype.update = function (displayable) {
+    var svgEl = this.getSvgElement(displayable);
+    if (svgEl) {
+        this.updateDom(svgEl, displayable.__clipPaths, false);
+    }
+
+    var textEl = this.getTextSvgElement(displayable);
+    if (textEl) {
+        // Make another clipPath for text, since it's transform
+        // matrix is not the same with svgElement
+        this.updateDom(textEl, displayable.__clipPaths, true);
+    }
+
+    this.markUsed(displayable);
+};
+
+
+/**
+ * Create an SVGElement of displayable and create a <clipPath> of its
+ * clipPath
+ *
+ * @param {Displayable} parentEl  parent element
+ * @param {ClipPath[]}  clipPaths clipPaths of parent element
+ * @param {boolean}     isText    if parent element is Text
+ */
+ClippathManager.prototype.updateDom = function (
+    parentEl,
+    clipPaths,
+    isText
+) {
+    if (clipPaths && clipPaths.length > 0) {
+        // Has clipPath, create <clipPath> with the first clipPath
+        var defs = this.getDefs(true);
+        var clipPath = clipPaths[0];
+        var clipPathEl;
+        var id;
+
+        var dom = isText ? '_textDom' : '_dom';
+
+        if (clipPath[dom]) {
+            // Use a dom that is already in <defs>
+            id = clipPath[dom].getAttribute('id');
+            clipPathEl = clipPath[dom];
+
+            // Use a dom that is already in <defs>
+            if (!defs.contains(clipPathEl)) {
+                // This happens when set old clipPath that has
+                // been previously removed
+                defs.appendChild(clipPathEl);
+            }
+        }
+        else {
+            // New <clipPath>
+            id = 'zr' + this._zrId + '-clip-' + this.nextId;
+            ++this.nextId;
+            clipPathEl = this.createElement('clipPath');
+            clipPathEl.setAttribute('id', id);
+            defs.appendChild(clipPathEl);
+
+            clipPath[dom] = clipPathEl;
+        }
+
+        // Build path and add to <clipPath>
+        var svgProxy = this.getSvgProxy(clipPath);
+        if (clipPath.transform
+            && clipPath.parent.invTransform
+            && !isText
+        ) {
+            /**
+             * If a clipPath has a parent with transform, the transform
+             * of parent should not be considered when setting transform
+             * of clipPath. So we need to transform back from parent's
+             * transform, which is done by multiplying parent's inverse
+             * transform.
+             */
+            // Store old transform
+            var transform = Array.prototype.slice.call(
+                clipPath.transform
+            );
+
+            // Transform back from parent, and brush path
+            mul$1(
+                clipPath.transform,
+                clipPath.parent.invTransform,
+                clipPath.transform
+            );
+            svgProxy.brush(clipPath);
+
+            // Set back transform of clipPath
+            clipPath.transform = transform;
+        }
+        else {
+            svgProxy.brush(clipPath);
+        }
+
+        var pathEl = this.getSvgElement(clipPath);
+
+        clipPathEl.innerHTML = '';
+        /**
+         * Use `cloneNode()` here to appendChild to multiple parents,
+         * which may happend when Text and other shapes are using the same
+         * clipPath. Since Text will create an extra clipPath DOM due to
+         * different transform rules.
+         */
+        clipPathEl.appendChild(pathEl.cloneNode());
+
+        parentEl.setAttribute('clip-path', 'url(#' + id + ')');
+
+        if (clipPaths.length > 1) {
+            // Make the other clipPaths recursively
+            this.updateDom(clipPathEl, clipPaths.slice(1), isText);
+        }
+    }
+    else {
+        // No clipPath
+        if (parentEl) {
+            parentEl.setAttribute('clip-path', 'none');
+        }
+    }
+};
+
+/**
+ * Mark a single clipPath to be used
+ *
+ * @param {Displayable} displayable displayable element
+ */
+ClippathManager.prototype.markUsed = function (displayable) {
+    var that = this;
+    if (displayable.__clipPaths && displayable.__clipPaths.length > 0) {
+        each$1(displayable.__clipPaths, function (clipPath) {
+            if (clipPath._dom) {
+                Definable.prototype.markUsed.call(that, clipPath._dom);
+            }
+            if (clipPath._textDom) {
+                Definable.prototype.markUsed.call(that, clipPath._textDom);
+            }
+        });
+    }
+};
+
+/**
+ * @file Manages SVG shadow elements.
+ * @author Zhang Wenli
+ */
+
+/**
+ * Manages SVG shadow elements.
+ *
+ * @class
+ * @extends Definable
+ * @param   {number}     zrId    zrender instance id
+ * @param   {SVGElement} svgRoot root of SVG document
+ */
+function ShadowManager(zrId, svgRoot) {
+    Definable.call(
+        this,
+        zrId,
+        svgRoot,
+        ['filter'],
+        '__filter_in_use__',
+        '_shadowDom'
+    );
+}
+
+
+inherits(ShadowManager, Definable);
+
+
+/**
+ * Create new shadow DOM for fill or stroke if not exist,
+ * but will not update shadow if exists.
+ *
+ * @param {SvgElement}  svgElement   SVG element to paint
+ * @param {Displayable} displayable  zrender displayable element
+ */
+ShadowManager.prototype.addWithoutUpdate = function (
+    svgElement,
+    displayable
+) {
+    if (displayable && hasShadow(displayable.style)) {
+        var style = displayable.style;
+
+        // Create dom in <defs> if not exists
+        var dom;
+        if (style._shadowDom) {
+            // Gradient exists
+            dom = style._shadowDom;
+
+            var defs = this.getDefs(true);
+            if (!defs.contains(style._shadowDom)) {
+                // _shadowDom is no longer in defs, recreate
+                this.addDom(dom);
+            }
+        }
+        else {
+            // New dom
+            dom = this.add(displayable);
+        }
+
+        this.markUsed(displayable);
+
+        var id = dom.getAttribute('id');
+        svgElement.style.filter = 'url(#' + id + ')';
+    }
+};
+
+
+/**
+ * Add a new shadow tag in <defs>
+ *
+ * @param {Displayable} displayable  zrender displayable element
+ * @return {SVGFilterElement} created DOM
+ */
+ShadowManager.prototype.add = function (displayable) {
+    var dom = this.createElement('filter');
+    var style = displayable.style;
+
+    // Set dom id with shadow id, since each shadow instance
+    // will have no more than one dom element.
+    // id may exists before for those dirty elements, in which case
+    // id should remain the same, and other attributes should be
+    // updated.
+    style._shadowDomId = style._shadowDomId || this.nextId++;
+    dom.setAttribute('id', 'zr' + this._zrId
+        + '-shadow-' + style._shadowDomId);
+
+    this.updateDom(displayable, dom);
+    this.addDom(dom);
+
+    return dom;
+};
+
+
+/**
+ * Update shadow.
+ *
+ * @param {Displayable} displayable  zrender displayable element
+ */
+ShadowManager.prototype.update = function (svgElement, displayable) {
+    var style = displayable.style;
+    if (hasShadow(style)) {
+        var that = this;
+        Definable.prototype.update.call(this, displayable, function (style) {
+            that.updateDom(displayable, style._shadowDom);
+        });
+    }
+    else {
+        // Remove shadow
+        this.remove(svgElement, style);
+    }
+};
+
+
+/**
+ * Remove DOM and clear parent filter
+ */
+ShadowManager.prototype.remove = function (svgElement, style) {
+    if (style._shadowDomId != null) {
+        this.removeDom(style);
+        svgElement.style.filter = '';
+    }
+};
+
+
+/**
+ * Update shadow dom
+ *
+ * @param {Displayable} displayable  zrender displayable element
+ * @param {SVGFilterElement} dom DOM to update
+ */
+ShadowManager.prototype.updateDom = function (displayable, dom) {
+    var domChild = dom.getElementsByTagName('feDropShadow');
+    if (domChild.length === 0) {
+        domChild = this.createElement('feDropShadow');
+    }
+    else {
+        domChild = domChild[0];
+    }
+
+    var style = displayable.style;
+    var scaleX = displayable.scale ? (displayable.scale[0] || 1) : 1;
+    var scaleY = displayable.scale ? (displayable.scale[1] || 1) : 1;
+
+    // TODO: textBoxShadowBlur is not supported yet
+    var offsetX, offsetY, blur, color;
+    if (style.shadowBlur || style.shadowOffsetX || style.shadowOffsetY) {
+        offsetX = style.shadowOffsetX || 0;
+        offsetY = style.shadowOffsetY || 0;
+        blur = style.shadowBlur;
+        color = style.shadowColor;
+    }
+    else if (style.textShadowBlur) {
+        offsetX = style.textShadowOffsetX || 0;
+        offsetY = style.textShadowOffsetY || 0;
+        blur = style.textShadowBlur;
+        color = style.textShadowColor;
+    }
+    else {
+        // Remove shadow
+        this.removeDom(dom, style);
+        return;
+    }
+
+    domChild.setAttribute('dx', offsetX / scaleX);
+    domChild.setAttribute('dy', offsetY / scaleY);
+    domChild.setAttribute('flood-color', color);
+
+    // Divide by two here so that it looks the same as in canvas
+    // See: https://html.spec.whatwg.org/multipage/canvas.html#dom-context-2d-shadowblur
+    var stdDx = blur / 2 / scaleX;
+    var stdDy = blur / 2 / scaleY;
+    var stdDeviation = stdDx + ' ' + stdDy;
+    domChild.setAttribute('stdDeviation', stdDeviation);
+
+    // Fix filter clipping problem
+    dom.setAttribute('x', '-100%');
+    dom.setAttribute('y', '-100%');
+    dom.setAttribute('width', Math.ceil(blur / 2 * 200) + '%');
+    dom.setAttribute('height', Math.ceil(blur / 2 * 200) + '%');
+
+    dom.appendChild(domChild);
+
+    // Store dom element in shadow, to avoid creating multiple
+    // dom instances for the same shadow element
+    style._shadowDom = dom;
+};
+
+/**
+ * Mark a single shadow to be used
+ *
+ * @param {Displayable} displayable displayable element
+ */
+ShadowManager.prototype.markUsed = function (displayable) {
+    var style = displayable.style;
+    if (style && style._shadowDom) {
+        Definable.prototype.markUsed.call(this, style._shadowDom);
+    }
+};
+
+function hasShadow(style) {
+    // TODO: textBoxShadowBlur is not supported yet
+    return style
+        && (style.shadowBlur || style.shadowOffsetX || style.shadowOffsetY
+            || style.textShadowBlur || style.textShadowOffsetX
+            || style.textShadowOffsetY);
+}
+
+/**
+ * SVG Painter
+ * @module zrender/svg/Painter
+ */
+
+function parseInt10$2(val) {
+    return parseInt(val, 10);
+}
+
+function getSvgProxy(el) {
+    if (el instanceof Path) {
+        return svgPath;
+    }
+    else if (el instanceof ZImage) {
+        return svgImage;
+    }
+    else if (el instanceof Text) {
+        return svgText;
+    }
+    else {
+        return svgPath;
+    }
+}
+
+function checkParentAvailable(parent, child) {
+    return child && parent && child.parentNode !== parent;
+}
+
+function insertAfter(parent, child, prevSibling) {
+    if (checkParentAvailable(parent, child) && prevSibling) {
+        var nextSibling = prevSibling.nextSibling;
+        nextSibling ? parent.insertBefore(child, nextSibling)
+            : parent.appendChild(child);
+    }
+}
+
+function prepend(parent, child) {
+    if (checkParentAvailable(parent, child)) {
+        var firstChild = parent.firstChild;
+        firstChild ? parent.insertBefore(child, firstChild)
+            : parent.appendChild(child);
+    }
+}
+
+function remove$1(parent, child) {
+    if (child && parent && child.parentNode === parent) {
+        parent.removeChild(child);
+    }
+}
+
+function getTextSvgElement(displayable) {
+    return displayable.__textSvgEl;
+}
+
+function getSvgElement(displayable) {
+    return displayable.__svgEl;
+}
+
+/**
+ * @alias module:zrender/svg/Painter
+ * @constructor
+ * @param {HTMLElement} root 绘图容器
+ * @param {module:zrender/Storage} storage
+ * @param {Object} opts
+ */
+var SVGPainter = function (root, storage, opts, zrId) {
+
+    this.root = root;
+    this.storage = storage;
+    this._opts = opts = extend({}, opts || {});
+
+    var svgRoot = createElement('svg');
+    svgRoot.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+    svgRoot.setAttribute('version', '1.1');
+    svgRoot.setAttribute('baseProfile', 'full');
+    svgRoot.style.cssText = 'user-select:none;position:absolute;left:0;top:0;';
+
+    this.gradientManager = new GradientManager(zrId, svgRoot);
+    this.clipPathManager = new ClippathManager(zrId, svgRoot);
+    this.shadowManager = new ShadowManager(zrId, svgRoot);
+
+    var viewport = document.createElement('div');
+    viewport.style.cssText = 'overflow:hidden;position:relative';
+
+    this._svgRoot = svgRoot;
+    this._viewport = viewport;
+
+    root.appendChild(viewport);
+    viewport.appendChild(svgRoot);
+
+    this.resize(opts.width, opts.height);
+
+    this._visibleList = [];
+};
+
+SVGPainter.prototype = {
+
+    constructor: SVGPainter,
+
+    getType: function () {
+        return 'svg';
+    },
+
+    getViewportRoot: function () {
+        return this._viewport;
+    },
+
+    getViewportRootOffset: function () {
+        var viewportRoot = this.getViewportRoot();
+        if (viewportRoot) {
+            return {
+                offsetLeft: viewportRoot.offsetLeft || 0,
+                offsetTop: viewportRoot.offsetTop || 0
+            };
+        }
+    },
+
+    refresh: function () {
+
+        var list = this.storage.getDisplayList(true);
+
+        this._paintList(list);
+    },
+
+    setBackgroundColor: function (backgroundColor) {
+        // TODO gradient
+        this._viewport.style.background = backgroundColor;
+    },
+
+    _paintList: function (list) {
+        this.gradientManager.markAllUnused();
+        this.clipPathManager.markAllUnused();
+        this.shadowManager.markAllUnused();
+
+        var svgRoot = this._svgRoot;
+        var visibleList = this._visibleList;
+        var listLen = list.length;
+
+        var newVisibleList = [];
+        var i;
+        for (i = 0; i < listLen; i++) {
+            var displayable = list[i];
+            var svgProxy = getSvgProxy(displayable);
+            var svgElement = getSvgElement(displayable)
+                || getTextSvgElement(displayable);
+            if (!displayable.invisible) {
+                if (displayable.__dirty) {
+                    svgProxy && svgProxy.brush(displayable);
+
+                    // Update clipPath
+                    this.clipPathManager.update(displayable);
+
+                    // Update gradient and shadow
+                    if (displayable.style) {
+                        this.gradientManager
+                            .update(displayable.style.fill);
+                        this.gradientManager
+                            .update(displayable.style.stroke);
+
+                        this.shadowManager
+                            .update(svgElement, displayable);
+                    }
+
+                    displayable.__dirty = false;
+                }
+                newVisibleList.push(displayable);
+            }
+        }
+
+        var diff = arrayDiff$1(visibleList, newVisibleList);
+        var prevSvgElement;
+
+        // First do remove, in case element moved to the head and do remove
+        // after add
+        for (i = 0; i < diff.length; i++) {
+            var item = diff[i];
+            if (item.removed) {
+                for (var k = 0; k < item.count; k++) {
+                    var displayable = visibleList[item.indices[k]];
+                    var svgElement = getSvgElement(displayable);
+                    var textSvgElement = getTextSvgElement(displayable);
+                    remove$1(svgRoot, svgElement);
+                    remove$1(svgRoot, textSvgElement);
+                }
+            }
+        }
+        for (i = 0; i < diff.length; i++) {
+            var item = diff[i];
+            if (item.added) {
+                for (var k = 0; k < item.count; k++) {
+                    var displayable = newVisibleList[item.indices[k]];
+                    var svgElement = getSvgElement(displayable);
+                    var textSvgElement = getTextSvgElement(displayable);
+                    prevSvgElement
+                        ? insertAfter(svgRoot, svgElement, prevSvgElement)
+                        : prepend(svgRoot, svgElement);
+                    if (svgElement) {
+                        insertAfter(svgRoot, textSvgElement, svgElement);
+                    }
+                    else if (prevSvgElement) {
+                        insertAfter(
+                            svgRoot, textSvgElement, prevSvgElement
+                        );
+                    }
+                    else {
+                        prepend(svgRoot, textSvgElement);
+                    }
+                    // Insert text
+                    insertAfter(svgRoot, textSvgElement, svgElement);
+                    prevSvgElement = textSvgElement || svgElement
+                        || prevSvgElement;
+
+                    this.gradientManager
+                        .addWithoutUpdate(svgElement, displayable);
+                    this.shadowManager
+                        .addWithoutUpdate(prevSvgElement, displayable);
+                    this.clipPathManager.markUsed(displayable);
+                }
+            }
+            else if (!item.removed) {
+                for (var k = 0; k < item.count; k++) {
+                    var displayable = newVisibleList[item.indices[k]];
+                    prevSvgElement
+                        = svgElement
+                        = getTextSvgElement(displayable)
+                        || getSvgElement(displayable)
+                        || prevSvgElement;
+
+                    this.gradientManager.markUsed(displayable);
+                    this.gradientManager
+                        .addWithoutUpdate(svgElement, displayable);
+
+                    this.shadowManager.markUsed(displayable);
+                    this.shadowManager
+                        .addWithoutUpdate(svgElement, displayable);
+
+                    this.clipPathManager.markUsed(displayable);
+                }
+            }
+        }
+
+        this.gradientManager.removeUnused();
+        this.clipPathManager.removeUnused();
+        this.shadowManager.removeUnused();
+
+        this._visibleList = newVisibleList;
+    },
+
+    _getDefs: function (isForceCreating) {
+        var svgRoot = this._svgRoot;
+        var defs = this._svgRoot.getElementsByTagName('defs');
+        if (defs.length === 0) {
+            // Not exist
+            if (isForceCreating) {
+                var defs = svgRoot.insertBefore(
+                    createElement('defs'), // Create new tag
+                    svgRoot.firstChild // Insert in the front of svg
+                );
+                if (!defs.contains) {
+                    // IE doesn't support contains method
+                    defs.contains = function (el) {
+                        var children = defs.children;
+                        if (!children) {
+                            return false;
+                        }
+                        for (var i = children.length - 1; i >= 0; --i) {
+                            if (children[i] === el) {
+                                return true;
+                            }
+                        }
+                        return false;
+                    };
+                }
+                return defs;
+            }
+            else {
+                return null;
+            }
+        }
+        else {
+            return defs[0];
+        }
+    },
+
+    resize: function (width, height) {
+        var viewport = this._viewport;
+        // FIXME Why ?
+        viewport.style.display = 'none';
+
+        // Save input w/h
+        var opts = this._opts;
+        width != null && (opts.width = width);
+        height != null && (opts.height = height);
+
+        width = this._getSize(0);
+        height = this._getSize(1);
+
+        viewport.style.display = '';
+
+        if (this._width !== width || this._height !== height) {
+            this._width = width;
+            this._height = height;
+
+            var viewportStyle = viewport.style;
+            viewportStyle.width = width + 'px';
+            viewportStyle.height = height + 'px';
+
+            var svgRoot = this._svgRoot;
+            // Set width by 'svgRoot.width = width' is invalid
+            svgRoot.setAttribute('width', width);
+            svgRoot.setAttribute('height', height);
+        }
+    },
+
+    /**
+     * 获取绘图区域宽度
+     */
+    getWidth: function () {
+        return this._width;
+    },
+
+    /**
+     * 获取绘图区域高度
+     */
+    getHeight: function () {
+        return this._height;
+    },
+
+    _getSize: function (whIdx) {
+        var opts = this._opts;
+        var wh = ['width', 'height'][whIdx];
+        var cwh = ['clientWidth', 'clientHeight'][whIdx];
+        var plt = ['paddingLeft', 'paddingTop'][whIdx];
+        var prb = ['paddingRight', 'paddingBottom'][whIdx];
+
+        if (opts[wh] != null && opts[wh] !== 'auto') {
+            return parseFloat(opts[wh]);
+        }
+
+        var root = this.root;
+        // IE8 does not support getComputedStyle, but it use VML.
+        var stl = document.defaultView.getComputedStyle(root);
+
+        return (
+            (root[cwh] || parseInt10$2(stl[wh]) || parseInt10$2(root.style[wh]))
+            - (parseInt10$2(stl[plt]) || 0)
+            - (parseInt10$2(stl[prb]) || 0)
+        ) | 0;
+    },
+
+    dispose: function () {
+        this.root.innerHTML = '';
+
+        this._svgRoot
+            = this._viewport
+            = this.storage
+            = null;
+    },
+
+    clear: function () {
+        if (this._viewport) {
+            this.root.removeChild(this._viewport);
+        }
+    },
+
+    pathToDataUrl: function () {
+        this.refresh();
+        var html = this._svgRoot.outerHTML;
+        return 'data:image/svg+xml;charset=UTF-8,' + html;
+    }
+};
+
+// Not supported methods
+function createMethodNotSupport$1(method) {
+    return function () {
+        zrLog('In SVG mode painter not support method "' + method + '"');
+    };
+}
+
+// Unsuppoted methods
+each$1([
+    'getLayer', 'insertLayer', 'eachLayer', 'eachBuiltinLayer',
+    'eachOtherLayer', 'getLayers', 'modLayer', 'delLayer', 'clearLayer',
+    'toDataURL', 'pathToImage'
+], function (name) {
+    SVGPainter.prototype[name] = createMethodNotSupport$1(name);
+});
+
+registerPainter('svg', SVGPainter);
+
+/*
+* Licensed to the Apache Software Foundation (ASF) under one
+* or more contributor license agreements.  See the NOTICE file
+* distributed with this work for additional information
+* regarding copyright ownership.  The ASF licenses this file
+* to you 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.
+*/
+
+// Import all charts and components
+
+exports.version = version;
+exports.dependencies = dependencies;
+exports.PRIORITY = PRIORITY;
+exports.init = init;
+exports.connect = connect;
+exports.disConnect = disConnect;
+exports.disconnect = disconnect;
+exports.dispose = dispose;
+exports.getInstanceByDom = getInstanceByDom;
+exports.getInstanceById = getInstanceById;
+exports.registerTheme = registerTheme;
+exports.registerPreprocessor = registerPreprocessor;
+exports.registerProcessor = registerProcessor;
+exports.registerPostUpdate = registerPostUpdate;
+exports.registerAction = registerAction;
+exports.registerCoordinateSystem = registerCoordinateSystem;
+exports.getCoordinateSystemDimensions = getCoordinateSystemDimensions;
+exports.registerLayout = registerLayout;
+exports.registerVisual = registerVisual;
+exports.registerLoading = registerLoading;
+exports.extendComponentModel = extendComponentModel;
+exports.extendComponentView = extendComponentView;
+exports.extendSeriesModel = extendSeriesModel;
+exports.extendChartView = extendChartView;
+exports.setCanvasCreator = setCanvasCreator;
+exports.registerMap = registerMap;
+exports.getMap = getMap;
+exports.dataTool = dataTool;
+exports.zrender = zrender;
+exports.graphic = graphic;
+exports.number = number;
+exports.format = format;
+exports.throttle = throttle;
+exports.helper = helper;
+exports.matrix = matrix;
+exports.vector = vector;
+exports.color = color;
+exports.parseGeoJSON = parseGeoJson$1;
+exports.parseGeoJson = parseGeoJson;
+exports.util = ecUtil;
+exports.List = List;
+exports.Model = Model;
+exports.Axis = Axis;
+exports.env = env$1;
+
+})));
+//# sourceMappingURL=echarts.js.map
+;
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+
+// This is CodeMirror (https://codemirror.net), a code editor
+// implemented in JavaScript on top of the browser's DOM.
+//
+// You can find some technical background for some of the code below
+// at http://marijnhaverbeke.nl/blog/#cm-internals .
+
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+  typeof define === 'function' && define.amd ? define(factory) :
+  (global.CodeMirror = factory());
+}(this, (function () { 'use strict';
+
+  // Kludges for bugs and behavior differences that can't be feature
+  // detected are enabled based on userAgent etc sniffing.
+  var userAgent = navigator.userAgent;
+  var platform = navigator.platform;
+
+  var gecko = /gecko\/\d/i.test(userAgent);
+  var ie_upto10 = /MSIE \d/.test(userAgent);
+  var ie_11up = /Trident\/(?:[7-9]|\d{2,})\..*rv:(\d+)/.exec(userAgent);
+  var edge = /Edge\/(\d+)/.exec(userAgent);
+  var ie = ie_upto10 || ie_11up || edge;
+  var ie_version = ie && (ie_upto10 ? document.documentMode || 6 : +(edge || ie_11up)[1]);
+  var webkit = !edge && /WebKit\//.test(userAgent);
+  var qtwebkit = webkit && /Qt\/\d+\.\d+/.test(userAgent);
+  var chrome = !edge && /Chrome\//.test(userAgent);
+  var presto = /Opera\//.test(userAgent);
+  var safari = /Apple Computer/.test(navigator.vendor);
+  var mac_geMountainLion = /Mac OS X 1\d\D([8-9]|\d\d)\D/.test(userAgent);
+  var phantom = /PhantomJS/.test(userAgent);
+
+  var ios = !edge && /AppleWebKit/.test(userAgent) && /Mobile\/\w+/.test(userAgent);
+  var android = /Android/.test(userAgent);
+  // This is woefully incomplete. Suggestions for alternative methods welcome.
+  var mobile = ios || android || /webOS|BlackBerry|Opera Mini|Opera Mobi|IEMobile/i.test(userAgent);
+  var mac = ios || /Mac/.test(platform);
+  var chromeOS = /\bCrOS\b/.test(userAgent);
+  var windows = /win/i.test(platform);
+
+  var presto_version = presto && userAgent.match(/Version\/(\d*\.\d*)/);
+  if (presto_version) { presto_version = Number(presto_version[1]); }
+  if (presto_version && presto_version >= 15) { presto = false; webkit = true; }
+  // Some browsers use the wrong event properties to signal cmd/ctrl on OS X
+  var flipCtrlCmd = mac && (qtwebkit || presto && (presto_version == null || presto_version < 12.11));
+  var captureRightClick = gecko || (ie && ie_version >= 9);
+
+  function classTest(cls) { return new RegExp("(^|\\s)" + cls + "(?:$|\\s)\\s*") }
+
+  var rmClass = function(node, cls) {
+    var current = node.className;
+    var match = classTest(cls).exec(current);
+    if (match) {
+      var after = current.slice(match.index + match[0].length);
+      node.className = current.slice(0, match.index) + (after ? match[1] + after : "");
+    }
+  };
+
+  function removeChildren(e) {
+    for (var count = e.childNodes.length; count > 0; --count)
+      { e.removeChild(e.firstChild); }
+    return e
+  }
+
+  function removeChildrenAndAdd(parent, e) {
+    return removeChildren(parent).appendChild(e)
+  }
+
+  function elt(tag, content, className, style) {
+    var e = document.createElement(tag);
+    if (className) { e.className = className; }
+    if (style) { e.style.cssText = style; }
+    if (typeof content == "string") { e.appendChild(document.createTextNode(content)); }
+    else if (content) { for (var i = 0; i < content.length; ++i) { e.appendChild(content[i]); } }
+    return e
+  }
+  // wrapper for elt, which removes the elt from the accessibility tree
+  function eltP(tag, content, className, style) {
+    var e = elt(tag, content, className, style);
+    e.setAttribute("role", "presentation");
+    return e
+  }
+
+  var range;
+  if (document.createRange) { range = function(node, start, end, endNode) {
+    var r = document.createRange();
+    r.setEnd(endNode || node, end);
+    r.setStart(node, start);
+    return r
+  }; }
+  else { range = function(node, start, end) {
+    var r = document.body.createTextRange();
+    try { r.moveToElementText(node.parentNode); }
+    catch(e) { return r }
+    r.collapse(true);
+    r.moveEnd("character", end);
+    r.moveStart("character", start);
+    return r
+  }; }
+
+  function contains(parent, child) {
+    if (child.nodeType == 3) // Android browser always returns false when child is a textnode
+      { child = child.parentNode; }
+    if (parent.contains)
+      { return parent.contains(child) }
+    do {
+      if (child.nodeType == 11) { child = child.host; }
+      if (child == parent) { return true }
+    } while (child = child.parentNode)
+  }
+
+  function activeElt() {
+    // IE and Edge may throw an "Unspecified Error" when accessing document.activeElement.
+    // IE < 10 will throw when accessed while the page is loading or in an iframe.
+    // IE > 9 and Edge will throw when accessed in an iframe if document.body is unavailable.
+    var activeElement;
+    try {
+      activeElement = document.activeElement;
+    } catch(e) {
+      activeElement = document.body || null;
+    }
+    while (activeElement && activeElement.shadowRoot && activeElement.shadowRoot.activeElement)
+      { activeElement = activeElement.shadowRoot.activeElement; }
+    return activeElement
+  }
+
+  function addClass(node, cls) {
+    var current = node.className;
+    if (!classTest(cls).test(current)) { node.className += (current ? " " : "") + cls; }
+  }
+  function joinClasses(a, b) {
+    var as = a.split(" ");
+    for (var i = 0; i < as.length; i++)
+      { if (as[i] && !classTest(as[i]).test(b)) { b += " " + as[i]; } }
+    return b
+  }
+
+  var selectInput = function(node) { node.select(); };
+  if (ios) // Mobile Safari apparently has a bug where select() is broken.
+    { selectInput = function(node) { node.selectionStart = 0; node.selectionEnd = node.value.length; }; }
+  else if (ie) // Suppress mysterious IE10 errors
+    { selectInput = function(node) { try { node.select(); } catch(_e) {} }; }
+
+  function bind(f) {
+    var args = Array.prototype.slice.call(arguments, 1);
+    return function(){return f.apply(null, args)}
+  }
+
+  function copyObj(obj, target, overwrite) {
+    if (!target) { target = {}; }
+    for (var prop in obj)
+      { if (obj.hasOwnProperty(prop) && (overwrite !== false || !target.hasOwnProperty(prop)))
+        { target[prop] = obj[prop]; } }
+    return target
+  }
+
+  // Counts the column offset in a string, taking tabs into account.
+  // Used mostly to find indentation.
+  function countColumn(string, end, tabSize, startIndex, startValue) {
+    if (end == null) {
+      end = string.search(/[^\s\u00a0]/);
+      if (end == -1) { end = string.length; }
+    }
+    for (var i = startIndex || 0, n = startValue || 0;;) {
+      var nextTab = string.indexOf("\t", i);
+      if (nextTab < 0 || nextTab >= end)
+        { return n + (end - i) }
+      n += nextTab - i;
+      n += tabSize - (n % tabSize);
+      i = nextTab + 1;
+    }
+  }
+
+  var Delayed = function() {this.id = null;};
+  Delayed.prototype.set = function (ms, f) {
+    clearTimeout(this.id);
+    this.id = setTimeout(f, ms);
+  };
+
+  function indexOf(array, elt) {
+    for (var i = 0; i < array.length; ++i)
+      { if (array[i] == elt) { return i } }
+    return -1
+  }
+
+  // Number of pixels added to scroller and sizer to hide scrollbar
+  var scrollerGap = 30;
+
+  // Returned or thrown by various protocols to signal 'I'm not
+  // handling this'.
+  var Pass = {toString: function(){return "CodeMirror.Pass"}};
+
+  // Reused option objects for setSelection & friends
+  var sel_dontScroll = {scroll: false}, sel_mouse = {origin: "*mouse"}, sel_move = {origin: "+move"};
+
+  // The inverse of countColumn -- find the offset that corresponds to
+  // a particular column.
+  function findColumn(string, goal, tabSize) {
+    for (var pos = 0, col = 0;;) {
+      var nextTab = string.indexOf("\t", pos);
+      if (nextTab == -1) { nextTab = string.length; }
+      var skipped = nextTab - pos;
+      if (nextTab == string.length || col + skipped >= goal)
+        { return pos + Math.min(skipped, goal - col) }
+      col += nextTab - pos;
+      col += tabSize - (col % tabSize);
+      pos = nextTab + 1;
+      if (col >= goal) { return pos }
+    }
+  }
+
+  var spaceStrs = [""];
+  function spaceStr(n) {
+    while (spaceStrs.length <= n)
+      { spaceStrs.push(lst(spaceStrs) + " "); }
+    return spaceStrs[n]
+  }
+
+  function lst(arr) { return arr[arr.length-1] }
+
+  function map(array, f) {
+    var out = [];
+    for (var i = 0; i < array.length; i++) { out[i] = f(array[i], i); }
+    return out
+  }
+
+  function insertSorted(array, value, score) {
+    var pos = 0, priority = score(value);
+    while (pos < array.length && score(array[pos]) <= priority) { pos++; }
+    array.splice(pos, 0, value);
+  }
+
+  function nothing() {}
+
+  function createObj(base, props) {
+    var inst;
+    if (Object.create) {
+      inst = Object.create(base);
+    } else {
+      nothing.prototype = base;
+      inst = new nothing();
+    }
+    if (props) { copyObj(props, inst); }
+    return inst
+  }
+
+  var nonASCIISingleCaseWordChar = /[\u00df\u0587\u0590-\u05f4\u0600-\u06ff\u3040-\u309f\u30a0-\u30ff\u3400-\u4db5\u4e00-\u9fcc\uac00-\ud7af]/;
+  function isWordCharBasic(ch) {
+    return /\w/.test(ch) || ch > "\x80" &&
+      (ch.toUpperCase() != ch.toLowerCase() || nonASCIISingleCaseWordChar.test(ch))
+  }
+  function isWordChar(ch, helper) {
+    if (!helper) { return isWordCharBasic(ch) }
+    if (helper.source.indexOf("\\w") > -1 && isWordCharBasic(ch)) { return true }
+    return helper.test(ch)
+  }
+
+  function isEmpty(obj) {
+    for (var n in obj) { if (obj.hasOwnProperty(n) && obj[n]) { return false } }
+    return true
+  }
+
+  // Extending unicode characters. A series of a non-extending char +
+  // any number of extending chars is treated as a single unit as far
+  // as editing and measuring is concerned. This is not fully correct,
+  // since some scripts/fonts/browsers also treat other configurations
+  // of code points as a group.
+  var extendingChars = /[\u0300-\u036f\u0483-\u0489\u0591-\u05bd\u05bf\u05c1\u05c2\u05c4\u05c5\u05c7\u0610-\u061a\u064b-\u065e\u0670\u06d6-\u06dc\u06de-\u06e4\u06e7\u06e8\u06ea-\u06ed\u0711\u0730-\u074a\u07a6-\u07b0\u07eb-\u07f3\u0816-\u0819\u081b-\u0823\u0825-\u0827\u0829-\u082d\u0900-\u0902\u093c\u0941-\u0948\u094d\u0951-\u0955\u0962\u0963\u0981\u09bc\u09be\u09c1-\u09c4\u09cd\u09d7\u09e2\u09e3\u0a01\u0a02\u0a3c\u0a41\u0a42\u0a47\u0a48\u0a4b-\u0a4d\u0a51\u0a70\u0a71\u0a75\u0a81\u0a82\u0abc\u0ac1-\u0ac5\u0ac7\u0ac8\u0acd\u0ae2\u0ae3\u0b01\u0b3c\u0b3e\u0b3f\u0b41-\u0b44\u0b4d\u0b56\u0b57\u0b62\u0b63\u0b82\u0bbe\u0bc0\u0bcd\u0bd7\u0c3e-\u0c40\u0c46-\u0c48\u0c4a-\u0c4d\u0c55\u0c56\u0c62\u0c63\u0cbc\u0cbf\u0cc2\u0cc6\u0ccc\u0ccd\u0cd5\u0cd6\u0ce2\u0ce3\u0d3e\u0d41-\u0d44\u0d4d\u0d57\u0d62\u0d63\u0dca\u0dcf\u0dd2-\u0dd4\u0dd6\u0ddf\u0e31\u0e34-\u0e3a\u0e47-\u0e4e\u0eb1\u0eb4-\u0eb9\u0ebb\u0ebc\u0ec8-\u0ecd\u0f18\u0f19\u0f35\u0f37\u0f39\u0f71-\u0f7e\u0f80-\u0f84\u0f86\u0f87\u0f90-\u0f97\u0f99-\u0fbc\u0fc6\u102d-\u1030\u1032-\u1037\u1039\u103a\u103d\u103e\u1058\u1059\u105e-\u1060\u1071-\u1074\u1082\u1085\u1086\u108d\u109d\u135f\u1712-\u1714\u1732-\u1734\u1752\u1753\u1772\u1773\u17b7-\u17bd\u17c6\u17c9-\u17d3\u17dd\u180b-\u180d\u18a9\u1920-\u1922\u1927\u1928\u1932\u1939-\u193b\u1a17\u1a18\u1a56\u1a58-\u1a5e\u1a60\u1a62\u1a65-\u1a6c\u1a73-\u1a7c\u1a7f\u1b00-\u1b03\u1b34\u1b36-\u1b3a\u1b3c\u1b42\u1b6b-\u1b73\u1b80\u1b81\u1ba2-\u1ba5\u1ba8\u1ba9\u1c2c-\u1c33\u1c36\u1c37\u1cd0-\u1cd2\u1cd4-\u1ce0\u1ce2-\u1ce8\u1ced\u1dc0-\u1de6\u1dfd-\u1dff\u200c\u200d\u20d0-\u20f0\u2cef-\u2cf1\u2de0-\u2dff\u302a-\u302f\u3099\u309a\ua66f-\ua672\ua67c\ua67d\ua6f0\ua6f1\ua802\ua806\ua80b\ua825\ua826\ua8c4\ua8e0-\ua8f1\ua926-\ua92d\ua947-\ua951\ua980-\ua982\ua9b3\ua9b6-\ua9b9\ua9bc\uaa29-\uaa2e\uaa31\uaa32\uaa35\uaa36\uaa43\uaa4c\uaab0\uaab2-\uaab4\uaab7\uaab8\uaabe\uaabf\uaac1\uabe5\uabe8\uabed\udc00-\udfff\ufb1e\ufe00-\ufe0f\ufe20-\ufe26\uff9e\uff9f]/;
+  function isExtendingChar(ch) { return ch.charCodeAt(0) >= 768 && extendingChars.test(ch) }
+
+  // Returns a number from the range [`0`; `str.length`] unless `pos` is outside that range.
+  function skipExtendingChars(str, pos, dir) {
+    while ((dir < 0 ? pos > 0 : pos < str.length) && isExtendingChar(str.charAt(pos))) { pos += dir; }
+    return pos
+  }
+
+  // Returns the value from the range [`from`; `to`] that satisfies
+  // `pred` and is closest to `from`. Assumes that at least `to`
+  // satisfies `pred`. Supports `from` being greater than `to`.
+  function findFirst(pred, from, to) {
+    // At any point we are certain `to` satisfies `pred`, don't know
+    // whether `from` does.
+    var dir = from > to ? -1 : 1;
+    for (;;) {
+      if (from == to) { return from }
+      var midF = (from + to) / 2, mid = dir < 0 ? Math.ceil(midF) : Math.floor(midF);
+      if (mid == from) { return pred(mid) ? from : to }
+      if (pred(mid)) { to = mid; }
+      else { from = mid + dir; }
+    }
+  }
+
+  // BIDI HELPERS
+
+  function iterateBidiSections(order, from, to, f) {
+    if (!order) { return f(from, to, "ltr", 0) }
+    var found = false;
+    for (var i = 0; i < order.length; ++i) {
+      var part = order[i];
+      if (part.from < to && part.to > from || from == to && part.to == from) {
+        f(Math.max(part.from, from), Math.min(part.to, to), part.level == 1 ? "rtl" : "ltr", i);
+        found = true;
+      }
+    }
+    if (!found) { f(from, to, "ltr"); }
+  }
+
+  var bidiOther = null;
+  function getBidiPartAt(order, ch, sticky) {
+    var found;
+    bidiOther = null;
+    for (var i = 0; i < order.length; ++i) {
+      var cur = order[i];
+      if (cur.from < ch && cur.to > ch) { return i }
+      if (cur.to == ch) {
+        if (cur.from != cur.to && sticky == "before") { found = i; }
+        else { bidiOther = i; }
+      }
+      if (cur.from == ch) {
+        if (cur.from != cur.to && sticky != "before") { found = i; }
+        else { bidiOther = i; }
+      }
+    }
+    return found != null ? found : bidiOther
+  }
+
+  // Bidirectional ordering algorithm
+  // See http://unicode.org/reports/tr9/tr9-13.html for the algorithm
+  // that this (partially) implements.
+
+  // One-char codes used for character types:
+  // L (L):   Left-to-Right
+  // R (R):   Right-to-Left
+  // r (AL):  Right-to-Left Arabic
+  // 1 (EN):  European Number
+  // + (ES):  European Number Separator
+  // % (ET):  European Number Terminator
+  // n (AN):  Arabic Number
+  // , (CS):  Common Number Separator
+  // m (NSM): Non-Spacing Mark
+  // b (BN):  Boundary Neutral
+  // s (B):   Paragraph Separator
+  // t (S):   Segment Separator
+  // w (WS):  Whitespace
+  // N (ON):  Other Neutrals
+
+  // Returns null if characters are ordered as they appear
+  // (left-to-right), or an array of sections ({from, to, level}
+  // objects) in the order in which they occur visually.
+  var bidiOrdering = (function() {
+    // Character types for codepoints 0 to 0xff
+    var lowTypes = "bbbbbbbbbtstwsbbbbbbbbbbbbbbssstwNN%%%NNNNNN,N,N1111111111NNNNNNNLLLLLLLLLLLLLLLLLLLLLLLLLLNNNNNNLLLLLLLLLLLLLLLLLLLLLLLLLLNNNNbbbbbbsbbbbbbbbbbbbbbbbbbbbbbbbbb,N%%%%NNNNLNNNNN%%11NLNNN1LNNNNNLLLLLLLLLLLLLLLLLLLLLLLNLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLN";
+    // Character types for codepoints 0x600 to 0x6f9
+    var arabicTypes = "nnnnnnNNr%%r,rNNmmmmmmmmmmmrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrmmmmmmmmmmmmmmmmmmmmmnnnnnnnnnn%nnrrrmrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrmmmmmmmnNmmmmmmrrmmNmmmmrr1111111111";
+    function charType(code) {
+      if (code <= 0xf7) { return lowTypes.charAt(code) }
+      else if (0x590 <= code && code <= 0x5f4) { return "R" }
+      else if (0x600 <= code && code <= 0x6f9) { return arabicTypes.charAt(code - 0x600) }
+      else if (0x6ee <= code && code <= 0x8ac) { return "r" }
+      else if (0x2000 <= code && code <= 0x200b) { return "w" }
+      else if (code == 0x200c) { return "b" }
+      else { return "L" }
+    }
+
+    var bidiRE = /[\u0590-\u05f4\u0600-\u06ff\u0700-\u08ac]/;
+    var isNeutral = /[stwN]/, isStrong = /[LRr]/, countsAsLeft = /[Lb1n]/, countsAsNum = /[1n]/;
+
+    function BidiSpan(level, from, to) {
+      this.level = level;
+      this.from = from; this.to = to;
+    }
+
+    return function(str, direction) {
+      var outerType = direction == "ltr" ? "L" : "R";
+
+      if (str.length == 0 || direction == "ltr" && !bidiRE.test(str)) { return false }
+      var len = str.length, types = [];
+      for (var i = 0; i < len; ++i)
+        { types.push(charType(str.charCodeAt(i))); }
+
+      // W1. Examine each non-spacing mark (NSM) in the level run, and
+      // change the type of the NSM to the type of the previous
+      // character. If the NSM is at the start of the level run, it will
+      // get the type of sor.
+      for (var i$1 = 0, prev = outerType; i$1 < len; ++i$1) {
+        var type = types[i$1];
+        if (type == "m") { types[i$1] = prev; }
+        else { prev = type; }
+      }
+
+      // W2. Search backwards from each instance of a European number
+      // until the first strong type (R, L, AL, or sor) is found. If an
+      // AL is found, change the type of the European number to Arabic
+      // number.
+      // W3. Change all ALs to R.
+      for (var i$2 = 0, cur = outerType; i$2 < len; ++i$2) {
+        var type$1 = types[i$2];
+        if (type$1 == "1" && cur == "r") { types[i$2] = "n"; }
+        else if (isStrong.test(type$1)) { cur = type$1; if (type$1 == "r") { types[i$2] = "R"; } }
+      }
+
+      // W4. A single European separator between two European numbers
+      // changes to a European number. A single common separator between
+      // two numbers of the same type changes to that type.
+      for (var i$3 = 1, prev$1 = types[0]; i$3 < len - 1; ++i$3) {
+        var type$2 = types[i$3];
+        if (type$2 == "+" && prev$1 == "1" && types[i$3+1] == "1") { types[i$3] = "1"; }
+        else if (type$2 == "," && prev$1 == types[i$3+1] &&
+                 (prev$1 == "1" || prev$1 == "n")) { types[i$3] = prev$1; }
+        prev$1 = type$2;
+      }
+
+      // W5. A sequence of European terminators adjacent to European
+      // numbers changes to all European numbers.
+      // W6. Otherwise, separators and terminators change to Other
+      // Neutral.
+      for (var i$4 = 0; i$4 < len; ++i$4) {
+        var type$3 = types[i$4];
+        if (type$3 == ",") { types[i$4] = "N"; }
+        else if (type$3 == "%") {
+          var end = (void 0);
+          for (end = i$4 + 1; end < len && types[end] == "%"; ++end) {}
+          var replace = (i$4 && types[i$4-1] == "!") || (end < len && types[end] == "1") ? "1" : "N";
+          for (var j = i$4; j < end; ++j) { types[j] = replace; }
+          i$4 = end - 1;
+        }
+      }
+
+      // W7. Search backwards from each instance of a European number
+      // until the first strong type (R, L, or sor) is found. If an L is
+      // found, then change the type of the European number to L.
+      for (var i$5 = 0, cur$1 = outerType; i$5 < len; ++i$5) {
+        var type$4 = types[i$5];
+        if (cur$1 == "L" && type$4 == "1") { types[i$5] = "L"; }
+        else if (isStrong.test(type$4)) { cur$1 = type$4; }
+      }
+
+      // N1. A sequence of neutrals takes the direction of the
+      // surrounding strong text if the text on both sides has the same
+      // direction. European and Arabic numbers act as if they were R in
+      // terms of their influence on neutrals. Start-of-level-run (sor)
+      // and end-of-level-run (eor) are used at level run boundaries.
+      // N2. Any remaining neutrals take the embedding direction.
+      for (var i$6 = 0; i$6 < len; ++i$6) {
+        if (isNeutral.test(types[i$6])) {
+          var end$1 = (void 0);
+          for (end$1 = i$6 + 1; end$1 < len && isNeutral.test(types[end$1]); ++end$1) {}
+          var before = (i$6 ? types[i$6-1] : outerType) == "L";
+          var after = (end$1 < len ? types[end$1] : outerType) == "L";
+          var replace$1 = before == after ? (before ? "L" : "R") : outerType;
+          for (var j$1 = i$6; j$1 < end$1; ++j$1) { types[j$1] = replace$1; }
+          i$6 = end$1 - 1;
+        }
+      }
+
+      // Here we depart from the documented algorithm, in order to avoid
+      // building up an actual levels array. Since there are only three
+      // levels (0, 1, 2) in an implementation that doesn't take
+      // explicit embedding into account, we can build up the order on
+      // the fly, without following the level-based algorithm.
+      var order = [], m;
+      for (var i$7 = 0; i$7 < len;) {
+        if (countsAsLeft.test(types[i$7])) {
+          var start = i$7;
+          for (++i$7; i$7 < len && countsAsLeft.test(types[i$7]); ++i$7) {}
+          order.push(new BidiSpan(0, start, i$7));
+        } else {
+          var pos = i$7, at = order.length;
+          for (++i$7; i$7 < len && types[i$7] != "L"; ++i$7) {}
+          for (var j$2 = pos; j$2 < i$7;) {
+            if (countsAsNum.test(types[j$2])) {
+              if (pos < j$2) { order.splice(at, 0, new BidiSpan(1, pos, j$2)); }
+              var nstart = j$2;
+              for (++j$2; j$2 < i$7 && countsAsNum.test(types[j$2]); ++j$2) {}
+              order.splice(at, 0, new BidiSpan(2, nstart, j$2));
+              pos = j$2;
+            } else { ++j$2; }
+          }
+          if (pos < i$7) { order.splice(at, 0, new BidiSpan(1, pos, i$7)); }
+        }
+      }
+      if (direction == "ltr") {
+        if (order[0].level == 1 && (m = str.match(/^\s+/))) {
+          order[0].from = m[0].length;
+          order.unshift(new BidiSpan(0, 0, m[0].length));
+        }
+        if (lst(order).level == 1 && (m = str.match(/\s+$/))) {
+          lst(order).to -= m[0].length;
+          order.push(new BidiSpan(0, len - m[0].length, len));
+        }
+      }
+
+      return direction == "rtl" ? order.reverse() : order
+    }
+  })();
+
+  // Get the bidi ordering for the given line (and cache it). Returns
+  // false for lines that are fully left-to-right, and an array of
+  // BidiSpan objects otherwise.
+  function getOrder(line, direction) {
+    var order = line.order;
+    if (order == null) { order = line.order = bidiOrdering(line.text, direction); }
+    return order
+  }
+
+  // EVENT HANDLING
+
+  // Lightweight event framework. on/off also work on DOM nodes,
+  // registering native DOM handlers.
+
+  var noHandlers = [];
+
+  var on = function(emitter, type, f) {
+    if (emitter.addEventListener) {
+      emitter.addEventListener(type, f, false);
+    } else if (emitter.attachEvent) {
+      emitter.attachEvent("on" + type, f);
+    } else {
+      var map$$1 = emitter._handlers || (emitter._handlers = {});
+      map$$1[type] = (map$$1[type] || noHandlers).concat(f);
+    }
+  };
+
+  function getHandlers(emitter, type) {
+    return emitter._handlers && emitter._handlers[type] || noHandlers
+  }
+
+  function off(emitter, type, f) {
+    if (emitter.removeEventListener) {
+      emitter.removeEventListener(type, f, false);
+    } else if (emitter.detachEvent) {
+      emitter.detachEvent("on" + type, f);
+    } else {
+      var map$$1 = emitter._handlers, arr = map$$1 && map$$1[type];
+      if (arr) {
+        var index = indexOf(arr, f);
+        if (index > -1)
+          { map$$1[type] = arr.slice(0, index).concat(arr.slice(index + 1)); }
+      }
+    }
+  }
+
+  function signal(emitter, type /*, values...*/) {
+    var handlers = getHandlers(emitter, type);
+    if (!handlers.length) { return }
+    var args = Array.prototype.slice.call(arguments, 2);
+    for (var i = 0; i < handlers.length; ++i) { handlers[i].apply(null, args); }
+  }
+
+  // The DOM events that CodeMirror handles can be overridden by
+  // registering a (non-DOM) handler on the editor for the event name,
+  // and preventDefault-ing the event in that handler.
+  function signalDOMEvent(cm, e, override) {
+    if (typeof e == "string")
+      { e = {type: e, preventDefault: function() { this.defaultPrevented = true; }}; }
+    signal(cm, override || e.type, cm, e);
+    return e_defaultPrevented(e) || e.codemirrorIgnore
+  }
+
+  function signalCursorActivity(cm) {
+    var arr = cm._handlers && cm._handlers.cursorActivity;
+    if (!arr) { return }
+    var set = cm.curOp.cursorActivityHandlers || (cm.curOp.cursorActivityHandlers = []);
+    for (var i = 0; i < arr.length; ++i) { if (indexOf(set, arr[i]) == -1)
+      { set.push(arr[i]); } }
+  }
+
+  function hasHandler(emitter, type) {
+    return getHandlers(emitter, type).length > 0
+  }
+
+  // Add on and off methods to a constructor's prototype, to make
+  // registering events on such objects more convenient.
+  function eventMixin(ctor) {
+    ctor.prototype.on = function(type, f) {on(this, type, f);};
+    ctor.prototype.off = function(type, f) {off(this, type, f);};
+  }
+
+  // Due to the fact that we still support jurassic IE versions, some
+  // compatibility wrappers are needed.
+
+  function e_preventDefault(e) {
+    if (e.preventDefault) { e.preventDefault(); }
+    else { e.returnValue = false; }
+  }
+  function e_stopPropagation(e) {
+    if (e.stopPropagation) { e.stopPropagation(); }
+    else { e.cancelBubble = true; }
+  }
+  function e_defaultPrevented(e) {
+    return e.defaultPrevented != null ? e.defaultPrevented : e.returnValue == false
+  }
+  function e_stop(e) {e_preventDefault(e); e_stopPropagation(e);}
+
+  function e_target(e) {return e.target || e.srcElement}
+  function e_button(e) {
+    var b = e.which;
+    if (b == null) {
+      if (e.button & 1) { b = 1; }
+      else if (e.button & 2) { b = 3; }
+      else if (e.button & 4) { b = 2; }
+    }
+    if (mac && e.ctrlKey && b == 1) { b = 3; }
+    return b
+  }
+
+  // Detect drag-and-drop
+  var dragAndDrop = function() {
+    // There is *some* kind of drag-and-drop support in IE6-8, but I
+    // couldn't get it to work yet.
+    if (ie && ie_version < 9) { return false }
+    var div = elt('div');
+    return "draggable" in div || "dragDrop" in div
+  }();
+
+  var zwspSupported;
+  function zeroWidthElement(measure) {
+    if (zwspSupported == null) {
+      var test = elt("span", "\u200b");
+      removeChildrenAndAdd(measure, elt("span", [test, document.createTextNode("x")]));
+      if (measure.firstChild.offsetHeight != 0)
+        { zwspSupported = test.offsetWidth <= 1 && test.offsetHeight > 2 && !(ie && ie_version < 8); }
+    }
+    var node = zwspSupported ? elt("span", "\u200b") :
+      elt("span", "\u00a0", null, "display: inline-block; width: 1px; margin-right: -1px");
+    node.setAttribute("cm-text", "");
+    return node
+  }
+
+  // Feature-detect IE's crummy client rect reporting for bidi text
+  var badBidiRects;
+  function hasBadBidiRects(measure) {
+    if (badBidiRects != null) { return badBidiRects }
+    var txt = removeChildrenAndAdd(measure, document.createTextNode("A\u062eA"));
+    var r0 = range(txt, 0, 1).getBoundingClientRect();
+    var r1 = range(txt, 1, 2).getBoundingClientRect();
+    removeChildren(measure);
+    if (!r0 || r0.left == r0.right) { return false } // Safari returns null in some cases (#2780)
+    return badBidiRects = (r1.right - r0.right < 3)
+  }
+
+  // See if "".split is the broken IE version, if so, provide an
+  // alternative way to split lines.
+  var splitLinesAuto = "\n\nb".split(/\n/).length != 3 ? function (string) {
+    var pos = 0, result = [], l = string.length;
+    while (pos <= l) {
+      var nl = string.indexOf("\n", pos);
+      if (nl == -1) { nl = string.length; }
+      var line = string.slice(pos, string.charAt(nl - 1) == "\r" ? nl - 1 : nl);
+      var rt = line.indexOf("\r");
+      if (rt != -1) {
+        result.push(line.slice(0, rt));
+        pos += rt + 1;
+      } else {
+        result.push(line);
+        pos = nl + 1;
+      }
+    }
+    return result
+  } : function (string) { return string.split(/\r\n?|\n/); };
+
+  var hasSelection = window.getSelection ? function (te) {
+    try { return te.selectionStart != te.selectionEnd }
+    catch(e) { return false }
+  } : function (te) {
+    var range$$1;
+    try {range$$1 = te.ownerDocument.selection.createRange();}
+    catch(e) {}
+    if (!range$$1 || range$$1.parentElement() != te) { return false }
+    return range$$1.compareEndPoints("StartToEnd", range$$1) != 0
+  };
+
+  var hasCopyEvent = (function () {
+    var e = elt("div");
+    if ("oncopy" in e) { return true }
+    e.setAttribute("oncopy", "return;");
+    return typeof e.oncopy == "function"
+  })();
+
+  var badZoomedRects = null;
+  function hasBadZoomedRects(measure) {
+    if (badZoomedRects != null) { return badZoomedRects }
+    var node = removeChildrenAndAdd(measure, elt("span", "x"));
+    var normal = node.getBoundingClientRect();
+    var fromRange = range(node, 0, 1).getBoundingClientRect();
+    return badZoomedRects = Math.abs(normal.left - fromRange.left) > 1
+  }
+
+  // Known modes, by name and by MIME
+  var modes = {}, mimeModes = {};
+
+  // Extra arguments are stored as the mode's dependencies, which is
+  // used by (legacy) mechanisms like loadmode.js to automatically
+  // load a mode. (Preferred mechanism is the require/define calls.)
+  function defineMode(name, mode) {
+    if (arguments.length > 2)
+      { mode.dependencies = Array.prototype.slice.call(arguments, 2); }
+    modes[name] = mode;
+  }
+
+  function defineMIME(mime, spec) {
+    mimeModes[mime] = spec;
+  }
+
+  // Given a MIME type, a {name, ...options} config object, or a name
+  // string, return a mode config object.
+  function resolveMode(spec) {
+    if (typeof spec == "string" && mimeModes.hasOwnProperty(spec)) {
+      spec = mimeModes[spec];
+    } else if (spec && typeof spec.name == "string" && mimeModes.hasOwnProperty(spec.name)) {
+      var found = mimeModes[spec.name];
+      if (typeof found == "string") { found = {name: found}; }
+      spec = createObj(found, spec);
+      spec.name = found.name;
+    } else if (typeof spec == "string" && /^[\w\-]+\/[\w\-]+\+xml$/.test(spec)) {
+      return resolveMode("application/xml")
+    } else if (typeof spec == "string" && /^[\w\-]+\/[\w\-]+\+json$/.test(spec)) {
+      return resolveMode("application/json")
+    }
+    if (typeof spec == "string") { return {name: spec} }
+    else { return spec || {name: "null"} }
+  }
+
+  // Given a mode spec (anything that resolveMode accepts), find and
+  // initialize an actual mode object.
+  function getMode(options, spec) {
+    spec = resolveMode(spec);
+    var mfactory = modes[spec.name];
+    if (!mfactory) { return getMode(options, "text/plain") }
+    var modeObj = mfactory(options, spec);
+    if (modeExtensions.hasOwnProperty(spec.name)) {
+      var exts = modeExtensions[spec.name];
+      for (var prop in exts) {
+        if (!exts.hasOwnProperty(prop)) { continue }
+        if (modeObj.hasOwnProperty(prop)) { modeObj["_" + prop] = modeObj[prop]; }
+        modeObj[prop] = exts[prop];
+      }
+    }
+    modeObj.name = spec.name;
+    if (spec.helperType) { modeObj.helperType = spec.helperType; }
+    if (spec.modeProps) { for (var prop$1 in spec.modeProps)
+      { modeObj[prop$1] = spec.modeProps[prop$1]; } }
+
+    return modeObj
+  }
+
+  // This can be used to attach properties to mode objects from
+  // outside the actual mode definition.
+  var modeExtensions = {};
+  function extendMode(mode, properties) {
+    var exts = modeExtensions.hasOwnProperty(mode) ? modeExtensions[mode] : (modeExtensions[mode] = {});
+    copyObj(properties, exts);
+  }
+
+  function copyState(mode, state) {
+    if (state === true) { return state }
+    if (mode.copyState) { return mode.copyState(state) }
+    var nstate = {};
+    for (var n in state) {
+      var val = state[n];
+      if (val instanceof Array) { val = val.concat([]); }
+      nstate[n] = val;
+    }
+    return nstate
+  }
+
+  // Given a mode and a state (for that mode), find the inner mode and
+  // state at the position that the state refers to.
+  function innerMode(mode, state) {
+    var info;
+    while (mode.innerMode) {
+      info = mode.innerMode(state);
+      if (!info || info.mode == mode) { break }
+      state = info.state;
+      mode = info.mode;
+    }
+    return info || {mode: mode, state: state}
+  }
+
+  function startState(mode, a1, a2) {
+    return mode.startState ? mode.startState(a1, a2) : true
+  }
+
+  // STRING STREAM
+
+  // Fed to the mode parsers, provides helper functions to make
+  // parsers more succinct.
+
+  var StringStream = function(string, tabSize, lineOracle) {
+    this.pos = this.start = 0;
+    this.string = string;
+    this.tabSize = tabSize || 8;
+    this.lastColumnPos = this.lastColumnValue = 0;
+    this.lineStart = 0;
+    this.lineOracle = lineOracle;
+  };
+
+  StringStream.prototype.eol = function () {return this.pos >= this.string.length};
+  StringStream.prototype.sol = function () {return this.pos == this.lineStart};
+  StringStream.prototype.peek = function () {return this.string.charAt(this.pos) || undefined};
+  StringStream.prototype.next = function () {
+    if (this.pos < this.string.length)
+      { return this.string.charAt(this.pos++) }
+  };
+  StringStream.prototype.eat = function (match) {
+    var ch = this.string.charAt(this.pos);
+    var ok;
+    if (typeof match == "string") { ok = ch == match; }
+    else { ok = ch && (match.test ? match.test(ch) : match(ch)); }
+    if (ok) {++this.pos; return ch}
+  };
+  StringStream.prototype.eatWhile = function (match) {
+    var start = this.pos;
+    while (this.eat(match)){}
+    return this.pos > start
+  };
+  StringStream.prototype.eatSpace = function () {
+      var this$1 = this;
+
+    var start = this.pos;
+    while (/[\s\u00a0]/.test(this.string.charAt(this.pos))) { ++this$1.pos; }
+    return this.pos > start
+  };
+  StringStream.prototype.skipToEnd = function () {this.pos = this.string.length;};
+  StringStream.prototype.skipTo = function (ch) {
+    var found = this.string.indexOf(ch, this.pos);
+    if (found > -1) {this.pos = found; return true}
+  };
+  StringStream.prototype.backUp = function (n) {this.pos -= n;};
+  StringStream.prototype.column = function () {
+    if (this.lastColumnPos < this.start) {
+      this.lastColumnValue = countColumn(this.string, this.start, this.tabSize, this.lastColumnPos, this.lastColumnValue);
+      this.lastColumnPos = this.start;
+    }
+    return this.lastColumnValue - (this.lineStart ? countColumn(this.string, this.lineStart, this.tabSize) : 0)
+  };
+  StringStream.prototype.indentation = function () {
+    return countColumn(this.string, null, this.tabSize) -
+      (this.lineStart ? countColumn(this.string, this.lineStart, this.tabSize) : 0)
+  };
+  StringStream.prototype.match = function (pattern, consume, caseInsensitive) {
+    if (typeof pattern == "string") {
+      var cased = function (str) { return caseInsensitive ? str.toLowerCase() : str; };
+      var substr = this.string.substr(this.pos, pattern.length);
+      if (cased(substr) == cased(pattern)) {
+        if (consume !== false) { this.pos += pattern.length; }
+        return true
+      }
+    } else {
+      var match = this.string.slice(this.pos).match(pattern);
+      if (match && match.index > 0) { return null }
+      if (match && consume !== false) { this.pos += match[0].length; }
+      return match
+    }
+  };
+  StringStream.prototype.current = function (){return this.string.slice(this.start, this.pos)};
+  StringStream.prototype.hideFirstChars = function (n, inner) {
+    this.lineStart += n;
+    try { return inner() }
+    finally { this.lineStart -= n; }
+  };
+  StringStream.prototype.lookAhead = function (n) {
+    var oracle = this.lineOracle;
+    return oracle && oracle.lookAhead(n)
+  };
+  StringStream.prototype.baseToken = function () {
+    var oracle = this.lineOracle;
+    return oracle && oracle.baseToken(this.pos)
+  };
+
+  // Find the line object corresponding to the given line number.
+  function getLine(doc, n) {
+    n -= doc.first;
+    if (n < 0 || n >= doc.size) { throw new Error("There is no line " + (n + doc.first) + " in the document.") }
+    var chunk = doc;
+    while (!chunk.lines) {
+      for (var i = 0;; ++i) {
+        var child = chunk.children[i], sz = child.chunkSize();
+        if (n < sz) { chunk = child; break }
+        n -= sz;
+      }
+    }
+    return chunk.lines[n]
+  }
+
+  // Get the part of a document between two positions, as an array of
+  // strings.
+  function getBetween(doc, start, end) {
+    var out = [], n = start.line;
+    doc.iter(start.line, end.line + 1, function (line) {
+      var text = line.text;
+      if (n == end.line) { text = text.slice(0, end.ch); }
+      if (n == start.line) { text = text.slice(start.ch); }
+      out.push(text);
+      ++n;
+    });
+    return out
+  }
+  // Get the lines between from and to, as array of strings.
+  function getLines(doc, from, to) {
+    var out = [];
+    doc.iter(from, to, function (line) { out.push(line.text); }); // iter aborts when callback returns truthy value
+    return out
+  }
+
+  // Update the height of a line, propagating the height change
+  // upwards to parent nodes.
+  function updateLineHeight(line, height) {
+    var diff = height - line.height;
+    if (diff) { for (var n = line; n; n = n.parent) { n.height += diff; } }
+  }
+
+  // Given a line object, find its line number by walking up through
+  // its parent links.
+  function lineNo(line) {
+    if (line.parent == null) { return null }
+    var cur = line.parent, no = indexOf(cur.lines, line);
+    for (var chunk = cur.parent; chunk; cur = chunk, chunk = chunk.parent) {
+      for (var i = 0;; ++i) {
+        if (chunk.children[i] == cur) { break }
+        no += chunk.children[i].chunkSize();
+      }
+    }
+    return no + cur.first
+  }
+
+  // Find the line at the given vertical position, using the height
+  // information in the document tree.
+  function lineAtHeight(chunk, h) {
+    var n = chunk.first;
+    outer: do {
+      for (var i$1 = 0; i$1 < chunk.children.length; ++i$1) {
+        var child = chunk.children[i$1], ch = child.height;
+        if (h < ch) { chunk = child; continue outer }
+        h -= ch;
+        n += child.chunkSize();
+      }
+      return n
+    } while (!chunk.lines)
+    var i = 0;
+    for (; i < chunk.lines.length; ++i) {
+      var line = chunk.lines[i], lh = line.height;
+      if (h < lh) { break }
+      h -= lh;
+    }
+    return n + i
+  }
+
+  function isLine(doc, l) {return l >= doc.first && l < doc.first + doc.size}
+
+  function lineNumberFor(options, i) {
+    return String(options.lineNumberFormatter(i + options.firstLineNumber))
+  }
+
+  // A Pos instance represents a position within the text.
+  function Pos(line, ch, sticky) {
+    if ( sticky === void 0 ) sticky = null;
+
+    if (!(this instanceof Pos)) { return new Pos(line, ch, sticky) }
+    this.line = line;
+    this.ch = ch;
+    this.sticky = sticky;
+  }
+
+  // Compare two positions, return 0 if they are the same, a negative
+  // number when a is less, and a positive number otherwise.
+  function cmp(a, b) { return a.line - b.line || a.ch - b.ch }
+
+  function equalCursorPos(a, b) { return a.sticky == b.sticky && cmp(a, b) == 0 }
+
+  function copyPos(x) {return Pos(x.line, x.ch)}
+  function maxPos(a, b) { return cmp(a, b) < 0 ? b : a }
+  function minPos(a, b) { return cmp(a, b) < 0 ? a : b }
+
+  // Most of the external API clips given positions to make sure they
+  // actually exist within the document.
+  function clipLine(doc, n) {return Math.max(doc.first, Math.min(n, doc.first + doc.size - 1))}
+  function clipPos(doc, pos) {
+    if (pos.line < doc.first) { return Pos(doc.first, 0) }
+    var last = doc.first + doc.size - 1;
+    if (pos.line > last) { return Pos(last, getLine(doc, last).text.length) }
+    return clipToLen(pos, getLine(doc, pos.line).text.length)
+  }
+  function clipToLen(pos, linelen) {
+    var ch = pos.ch;
+    if (ch == null || ch > linelen) { return Pos(pos.line, linelen) }
+    else if (ch < 0) { return Pos(pos.line, 0) }
+    else { return pos }
+  }
+  function clipPosArray(doc, array) {
+    var out = [];
+    for (var i = 0; i < array.length; i++) { out[i] = clipPos(doc, array[i]); }
+    return out
+  }
+
+  var SavedContext = function(state, lookAhead) {
+    this.state = state;
+    this.lookAhead = lookAhead;
+  };
+
+  var Context = function(doc, state, line, lookAhead) {
+    this.state = state;
+    this.doc = doc;
+    this.line = line;
+    this.maxLookAhead = lookAhead || 0;
+    this.baseTokens = null;
+    this.baseTokenPos = 1;
+  };
+
+  Context.prototype.lookAhead = function (n) {
+    var line = this.doc.getLine(this.line + n);
+    if (line != null && n > this.maxLookAhead) { this.maxLookAhead = n; }
+    return line
+  };
+
+  Context.prototype.baseToken = function (n) {
+      var this$1 = this;
+
+    if (!this.baseTokens) { return null }
+    while (this.baseTokens[this.baseTokenPos] <= n)
+      { this$1.baseTokenPos += 2; }
+    var type = this.baseTokens[this.baseTokenPos + 1];
+    return {type: type && type.replace(/( |^)overlay .*/, ""),
+            size: this.baseTokens[this.baseTokenPos] - n}
+  };
+
+  Context.prototype.nextLine = function () {
+    this.line++;
+    if (this.maxLookAhead > 0) { this.maxLookAhead--; }
+  };
+
+  Context.fromSaved = function (doc, saved, line) {
+    if (saved instanceof SavedContext)
+      { return new Context(doc, copyState(doc.mode, saved.state), line, saved.lookAhead) }
+    else
+      { return new Context(doc, copyState(doc.mode, saved), line) }
+  };
+
+  Context.prototype.save = function (copy) {
+    var state = copy !== false ? copyState(this.doc.mode, this.state) : this.state;
+    return this.maxLookAhead > 0 ? new SavedContext(state, this.maxLookAhead) : state
+  };
+
+
+  // Compute a style array (an array starting with a mode generation
+  // -- for invalidation -- followed by pairs of end positions and
+  // style strings), which is used to highlight the tokens on the
+  // line.
+  function highlightLine(cm, line, context, forceToEnd) {
+    // A styles array always starts with a number identifying the
+    // mode/overlays that it is based on (for easy invalidation).
+    var st = [cm.state.modeGen], lineClasses = {};
+    // Compute the base array of styles
+    runMode(cm, line.text, cm.doc.mode, context, function (end, style) { return st.push(end, style); },
+            lineClasses, forceToEnd);
+    var state = context.state;
+
+    // Run overlays, adjust style array.
+    var loop = function ( o ) {
+      context.baseTokens = st;
+      var overlay = cm.state.overlays[o], i = 1, at = 0;
+      context.state = true;
+      runMode(cm, line.text, overlay.mode, context, function (end, style) {
+        var start = i;
+        // Ensure there's a token end at the current position, and that i points at it
+        while (at < end) {
+          var i_end = st[i];
+          if (i_end > end)
+            { st.splice(i, 1, end, st[i+1], i_end); }
+          i += 2;
+          at = Math.min(end, i_end);
+        }
+        if (!style) { return }
+        if (overlay.opaque) {
+          st.splice(start, i - start, end, "overlay " + style);
+          i = start + 2;
+        } else {
+          for (; start < i; start += 2) {
+            var cur = st[start+1];
+            st[start+1] = (cur ? cur + " " : "") + "overlay " + style;
+          }
+        }
+      }, lineClasses);
+      context.state = state;
+      context.baseTokens = null;
+      context.baseTokenPos = 1;
+    };
+
+    for (var o = 0; o < cm.state.overlays.length; ++o) loop( o );
+
+    return {styles: st, classes: lineClasses.bgClass || lineClasses.textClass ? lineClasses : null}
+  }
+
+  function getLineStyles(cm, line, updateFrontier) {
+    if (!line.styles || line.styles[0] != cm.state.modeGen) {
+      var context = getContextBefore(cm, lineNo(line));
+      var resetState = line.text.length > cm.options.maxHighlightLength && copyState(cm.doc.mode, context.state);
+      var result = highlightLine(cm, line, context);
+      if (resetState) { context.state = resetState; }
+      line.stateAfter = context.save(!resetState);
+      line.styles = result.styles;
+      if (result.classes) { line.styleClasses = result.classes; }
+      else if (line.styleClasses) { line.styleClasses = null; }
+      if (updateFrontier === cm.doc.highlightFrontier)
+        { cm.doc.modeFrontier = Math.max(cm.doc.modeFrontier, ++cm.doc.highlightFrontier); }
+    }
+    return line.styles
+  }
+
+  function getContextBefore(cm, n, precise) {
+    var doc = cm.doc, display = cm.display;
+    if (!doc.mode.startState) { return new Context(doc, true, n) }
+    var start = findStartLine(cm, n, precise);
+    var saved = start > doc.first && getLine(doc, start - 1).stateAfter;
+    var context = saved ? Context.fromSaved(doc, saved, start) : new Context(doc, startState(doc.mode), start);
+
+    doc.iter(start, n, function (line) {
+      processLine(cm, line.text, context);
+      var pos = context.line;
+      line.stateAfter = pos == n - 1 || pos % 5 == 0 || pos >= display.viewFrom && pos < display.viewTo ? context.save() : null;
+      context.nextLine();
+    });
+    if (precise) { doc.modeFrontier = context.line; }
+    return context
+  }
+
+  // Lightweight form of highlight -- proceed over this line and
+  // update state, but don't save a style array. Used for lines that
+  // aren't currently visible.
+  function processLine(cm, text, context, startAt) {
+    var mode = cm.doc.mode;
+    var stream = new StringStream(text, cm.options.tabSize, context);
+    stream.start = stream.pos = startAt || 0;
+    if (text == "") { callBlankLine(mode, context.state); }
+    while (!stream.eol()) {
+      readToken(mode, stream, context.state);
+      stream.start = stream.pos;
+    }
+  }
+
+  function callBlankLine(mode, state) {
+    if (mode.blankLine) { return mode.blankLine(state) }
+    if (!mode.innerMode) { return }
+    var inner = innerMode(mode, state);
+    if (inner.mode.blankLine) { return inner.mode.blankLine(inner.state) }
+  }
+
+  function readToken(mode, stream, state, inner) {
+    for (var i = 0; i < 10; i++) {
+      if (inner) { inner[0] = innerMode(mode, state).mode; }
+      var style = mode.token(stream, state);
+      if (stream.pos > stream.start) { return style }
+    }
+    throw new Error("Mode " + mode.name + " failed to advance stream.")
+  }
+
+  var Token = function(stream, type, state) {
+    this.start = stream.start; this.end = stream.pos;
+    this.string = stream.current();
+    this.type = type || null;
+    this.state = state;
+  };
+
+  // Utility for getTokenAt and getLineTokens
+  function takeToken(cm, pos, precise, asArray) {
+    var doc = cm.doc, mode = doc.mode, style;
+    pos = clipPos(doc, pos);
+    var line = getLine(doc, pos.line), context = getContextBefore(cm, pos.line, precise);
+    var stream = new StringStream(line.text, cm.options.tabSize, context), tokens;
+    if (asArray) { tokens = []; }
+    while ((asArray || stream.pos < pos.ch) && !stream.eol()) {
+      stream.start = stream.pos;
+      style = readToken(mode, stream, context.state);
+      if (asArray) { tokens.push(new Token(stream, style, copyState(doc.mode, context.state))); }
+    }
+    return asArray ? tokens : new Token(stream, style, context.state)
+  }
+
+  function extractLineClasses(type, output) {
+    if (type) { for (;;) {
+      var lineClass = type.match(/(?:^|\s+)line-(background-)?(\S+)/);
+      if (!lineClass) { break }
+      type = type.slice(0, lineClass.index) + type.slice(lineClass.index + lineClass[0].length);
+      var prop = lineClass[1] ? "bgClass" : "textClass";
+      if (output[prop] == null)
+        { output[prop] = lineClass[2]; }
+      else if (!(new RegExp("(?:^|\s)" + lineClass[2] + "(?:$|\s)")).test(output[prop]))
+        { output[prop] += " " + lineClass[2]; }
+    } }
+    return type
+  }
+
+  // Run the given mode's parser over a line, calling f for each token.
+  function runMode(cm, text, mode, context, f, lineClasses, forceToEnd) {
+    var flattenSpans = mode.flattenSpans;
+    if (flattenSpans == null) { flattenSpans = cm.options.flattenSpans; }
+    var curStart = 0, curStyle = null;
+    var stream = new StringStream(text, cm.options.tabSize, context), style;
+    var inner = cm.options.addModeClass && [null];
+    if (text == "") { extractLineClasses(callBlankLine(mode, context.state), lineClasses); }
+    while (!stream.eol()) {
+      if (stream.pos > cm.options.maxHighlightLength) {
+        flattenSpans = false;
+        if (forceToEnd) { processLine(cm, text, context, stream.pos); }
+        stream.pos = text.length;
+        style = null;
+      } else {
+        style = extractLineClasses(readToken(mode, stream, context.state, inner), lineClasses);
+      }
+      if (inner) {
+        var mName = inner[0].name;
+        if (mName) { style = "m-" + (style ? mName + " " + style : mName); }
+      }
+      if (!flattenSpans || curStyle != style) {
+        while (curStart < stream.start) {
+          curStart = Math.min(stream.start, curStart + 5000);
+          f(curStart, curStyle);
+        }
+        curStyle = style;
+      }
+      stream.start = stream.pos;
+    }
+    while (curStart < stream.pos) {
+      // Webkit seems to refuse to render text nodes longer than 57444
+      // characters, and returns inaccurate measurements in nodes
+      // starting around 5000 chars.
+      var pos = Math.min(stream.pos, curStart + 5000);
+      f(pos, curStyle);
+      curStart = pos;
+    }
+  }
+
+  // Finds the line to start with when starting a parse. Tries to
+  // find a line with a stateAfter, so that it can start with a
+  // valid state. If that fails, it returns the line with the
+  // smallest indentation, which tends to need the least context to
+  // parse correctly.
+  function findStartLine(cm, n, precise) {
+    var minindent, minline, doc = cm.doc;
+    var lim = precise ? -1 : n - (cm.doc.mode.innerMode ? 1000 : 100);
+    for (var search = n; search > lim; --search) {
+      if (search <= doc.first) { return doc.first }
+      var line = getLine(doc, search - 1), after = line.stateAfter;
+      if (after && (!precise || search + (after instanceof SavedContext ? after.lookAhead : 0) <= doc.modeFrontier))
+        { return search }
+      var indented = countColumn(line.text, null, cm.options.tabSize);
+      if (minline == null || minindent > indented) {
+        minline = search - 1;
+        minindent = indented;
+      }
+    }
+    return minline
+  }
+
+  function retreatFrontier(doc, n) {
+    doc.modeFrontier = Math.min(doc.modeFrontier, n);
+    if (doc.highlightFrontier < n - 10) { return }
+    var start = doc.first;
+    for (var line = n - 1; line > start; line--) {
+      var saved = getLine(doc, line).stateAfter;
+      // change is on 3
+      // state on line 1 looked ahead 2 -- so saw 3
+      // test 1 + 2 < 3 should cover this
+      if (saved && (!(saved instanceof SavedContext) || line + saved.lookAhead < n)) {
+        start = line + 1;
+        break
+      }
+    }
+    doc.highlightFrontier = Math.min(doc.highlightFrontier, start);
+  }
+
+  // Optimize some code when these features are not used.
+  var sawReadOnlySpans = false, sawCollapsedSpans = false;
+
+  function seeReadOnlySpans() {
+    sawReadOnlySpans = true;
+  }
+
+  function seeCollapsedSpans() {
+    sawCollapsedSpans = true;
+  }
+
+  // TEXTMARKER SPANS
+
+  function MarkedSpan(marker, from, to) {
+    this.marker = marker;
+    this.from = from; this.to = to;
+  }
+
+  // Search an array of spans for a span matching the given marker.
+  function getMarkedSpanFor(spans, marker) {
+    if (spans) { for (var i = 0; i < spans.length; ++i) {
+      var span = spans[i];
+      if (span.marker == marker) { return span }
+    } }
+  }
+  // Remove a span from an array, returning undefined if no spans are
+  // left (we don't store arrays for lines without spans).
+  function removeMarkedSpan(spans, span) {
+    var r;
+    for (var i = 0; i < spans.length; ++i)
+      { if (spans[i] != span) { (r || (r = [])).push(spans[i]); } }
+    return r
+  }
+  // Add a span to a line.
+  function addMarkedSpan(line, span) {
+    line.markedSpans = line.markedSpans ? line.markedSpans.concat([span]) : [span];
+    span.marker.attachLine(line);
+  }
+
+  // Used for the algorithm that adjusts markers for a change in the
+  // document. These functions cut an array of spans at a given
+  // character position, returning an array of remaining chunks (or
+  // undefined if nothing remains).
+  function markedSpansBefore(old, startCh, isInsert) {
+    var nw;
+    if (old) { for (var i = 0; i < old.length; ++i) {
+      var span = old[i], marker = span.marker;
+      var startsBefore = span.from == null || (marker.inclusiveLeft ? span.from <= startCh : span.from < startCh);
+      if (startsBefore || span.from == startCh && marker.type == "bookmark" && (!isInsert || !span.marker.insertLeft)) {
+        var endsAfter = span.to == null || (marker.inclusiveRight ? span.to >= startCh : span.to > startCh)
+        ;(nw || (nw = [])).push(new MarkedSpan(marker, span.from, endsAfter ? null : span.to));
+      }
+    } }
+    return nw
+  }
+  function markedSpansAfter(old, endCh, isInsert) {
+    var nw;
+    if (old) { for (var i = 0; i < old.length; ++i) {
+      var span = old[i], marker = span.marker;
+      var endsAfter = span.to == null || (marker.inclusiveRight ? span.to >= endCh : span.to > endCh);
+      if (endsAfter || span.from == endCh && marker.type == "bookmark" && (!isInsert || span.marker.insertLeft)) {
+        var startsBefore = span.from == null || (marker.inclusiveLeft ? span.from <= endCh : span.from < endCh)
+        ;(nw || (nw = [])).push(new MarkedSpan(marker, startsBefore ? null : span.from - endCh,
+                                              span.to == null ? null : span.to - endCh));
+      }
+    } }
+    return nw
+  }
+
+  // Given a change object, compute the new set of marker spans that
+  // cover the line in which the change took place. Removes spans
+  // entirely within the change, reconnects spans belonging to the
+  // same marker that appear on both sides of the change, and cuts off
+  // spans partially within the change. Returns an array of span
+  // arrays with one element for each line in (after) the change.
+  function stretchSpansOverChange(doc, change) {
+    if (change.full) { return null }
+    var oldFirst = isLine(doc, change.from.line) && getLine(doc, change.from.line).markedSpans;
+    var oldLast = isLine(doc, change.to.line) && getLine(doc, change.to.line).markedSpans;
+    if (!oldFirst && !oldLast) { return null }
+
+    var startCh = change.from.ch, endCh = change.to.ch, isInsert = cmp(change.from, change.to) == 0;
+    // Get the spans that 'stick out' on both sides
+    var first = markedSpansBefore(oldFirst, startCh, isInsert);
+    var last = markedSpansAfter(oldLast, endCh, isInsert);
+
+    // Next, merge those two ends
+    var sameLine = change.text.length == 1, offset = lst(change.text).length + (sameLine ? startCh : 0);
+    if (first) {
+      // Fix up .to properties of first
+      for (var i = 0; i < first.length; ++i) {
+        var span = first[i];
+        if (span.to == null) {
+          var found = getMarkedSpanFor(last, span.marker);
+          if (!found) { span.to = startCh; }
+          else if (sameLine) { span.to = found.to == null ? null : found.to + offset; }
+        }
+      }
+    }
+    if (last) {
+      // Fix up .from in last (or move them into first in case of sameLine)
+      for (var i$1 = 0; i$1 < last.length; ++i$1) {
+        var span$1 = last[i$1];
+        if (span$1.to != null) { span$1.to += offset; }
+        if (span$1.from == null) {
+          var found$1 = getMarkedSpanFor(first, span$1.marker);
+          if (!found$1) {
+            span$1.from = offset;
+            if (sameLine) { (first || (first = [])).push(span$1); }
+          }
+        } else {
+          span$1.from += offset;
+          if (sameLine) { (first || (first = [])).push(span$1); }
+        }
+      }
+    }
+    // Make sure we didn't create any zero-length spans
+    if (first) { first = clearEmptySpans(first); }
+    if (last && last != first) { last = clearEmptySpans(last); }
+
+    var newMarkers = [first];
+    if (!sameLine) {
+      // Fill gap with whole-line-spans
+      var gap = change.text.length - 2, gapMarkers;
+      if (gap > 0 && first)
+        { for (var i$2 = 0; i$2 < first.length; ++i$2)
+          { if (first[i$2].to == null)
+            { (gapMarkers || (gapMarkers = [])).push(new MarkedSpan(first[i$2].marker, null, null)); } } }
+      for (var i$3 = 0; i$3 < gap; ++i$3)
+        { newMarkers.push(gapMarkers); }
+      newMarkers.push(last);
+    }
+    return newMarkers
+  }
+
+  // Remove spans that are empty and don't have a clearWhenEmpty
+  // option of false.
+  function clearEmptySpans(spans) {
+    for (var i = 0; i < spans.length; ++i) {
+      var span = spans[i];
+      if (span.from != null && span.from == span.to && span.marker.clearWhenEmpty !== false)
+        { spans.splice(i--, 1); }
+    }
+    if (!spans.length) { return null }
+    return spans
+  }
+
+  // Used to 'clip' out readOnly ranges when making a change.
+  function removeReadOnlyRanges(doc, from, to) {
+    var markers = null;
+    doc.iter(from.line, to.line + 1, function (line) {
+      if (line.markedSpans) { for (var i = 0; i < line.markedSpans.length; ++i) {
+        var mark = line.markedSpans[i].marker;
+        if (mark.readOnly && (!markers || indexOf(markers, mark) == -1))
+          { (markers || (markers = [])).push(mark); }
+      } }
+    });
+    if (!markers) { return null }
+    var parts = [{from: from, to: to}];
+    for (var i = 0; i < markers.length; ++i) {
+      var mk = markers[i], m = mk.find(0);
+      for (var j = 0; j < parts.length; ++j) {
+        var p = parts[j];
+        if (cmp(p.to, m.from) < 0 || cmp(p.from, m.to) > 0) { continue }
+        var newParts = [j, 1], dfrom = cmp(p.from, m.from), dto = cmp(p.to, m.to);
+        if (dfrom < 0 || !mk.inclusiveLeft && !dfrom)
+          { newParts.push({from: p.from, to: m.from}); }
+        if (dto > 0 || !mk.inclusiveRight && !dto)
+          { newParts.push({from: m.to, to: p.to}); }
+        parts.splice.apply(parts, newParts);
+        j += newParts.length - 3;
+      }
+    }
+    return parts
+  }
+
+  // Connect or disconnect spans from a line.
+  function detachMarkedSpans(line) {
+    var spans = line.markedSpans;
+    if (!spans) { return }
+    for (var i = 0; i < spans.length; ++i)
+      { spans[i].marker.detachLine(line); }
+    line.markedSpans = null;
+  }
+  function attachMarkedSpans(line, spans) {
+    if (!spans) { return }
+    for (var i = 0; i < spans.length; ++i)
+      { spans[i].marker.attachLine(line); }
+    line.markedSpans = spans;
+  }
+
+  // Helpers used when computing which overlapping collapsed span
+  // counts as the larger one.
+  function extraLeft(marker) { return marker.inclusiveLeft ? -1 : 0 }
+  function extraRight(marker) { return marker.inclusiveRight ? 1 : 0 }
+
+  // Returns a number indicating which of two overlapping collapsed
+  // spans is larger (and thus includes the other). Falls back to
+  // comparing ids when the spans cover exactly the same range.
+  function compareCollapsedMarkers(a, b) {
+    var lenDiff = a.lines.length - b.lines.length;
+    if (lenDiff != 0) { return lenDiff }
+    var aPos = a.find(), bPos = b.find();
+    var fromCmp = cmp(aPos.from, bPos.from) || extraLeft(a) - extraLeft(b);
+    if (fromCmp) { return -fromCmp }
+    var toCmp = cmp(aPos.to, bPos.to) || extraRight(a) - extraRight(b);
+    if (toCmp) { return toCmp }
+    return b.id - a.id
+  }
+
+  // Find out whether a line ends or starts in a collapsed span. If
+  // so, return the marker for that span.
+  function collapsedSpanAtSide(line, start) {
+    var sps = sawCollapsedSpans && line.markedSpans, found;
+    if (sps) { for (var sp = (void 0), i = 0; i < sps.length; ++i) {
+      sp = sps[i];
+      if (sp.marker.collapsed && (start ? sp.from : sp.to) == null &&
+          (!found || compareCollapsedMarkers(found, sp.marker) < 0))
+        { found = sp.marker; }
+    } }
+    return found
+  }
+  function collapsedSpanAtStart(line) { return collapsedSpanAtSide(line, true) }
+  function collapsedSpanAtEnd(line) { return collapsedSpanAtSide(line, false) }
+
+  function collapsedSpanAround(line, ch) {
+    var sps = sawCollapsedSpans && line.markedSpans, found;
+    if (sps) { for (var i = 0; i < sps.length; ++i) {
+      var sp = sps[i];
+      if (sp.marker.collapsed && (sp.from == null || sp.from < ch) && (sp.to == null || sp.to > ch) &&
+          (!found || compareCollapsedMarkers(found, sp.marker) < 0)) { found = sp.marker; }
+    } }
+    return found
+  }
+
+  // Test whether there exists a collapsed span that partially
+  // overlaps (covers the start or end, but not both) of a new span.
+  // Such overlap is not allowed.
+  function conflictingCollapsedRange(doc, lineNo$$1, from, to, marker) {
+    var line = getLine(doc, lineNo$$1);
+    var sps = sawCollapsedSpans && line.markedSpans;
+    if (sps) { for (var i = 0; i < sps.length; ++i) {
+      var sp = sps[i];
+      if (!sp.marker.collapsed) { continue }
+      var found = sp.marker.find(0);
+      var fromCmp = cmp(found.from, from) || extraLeft(sp.marker) - extraLeft(marker);
+      var toCmp = cmp(found.to, to) || extraRight(sp.marker) - extraRight(marker);
+      if (fromCmp >= 0 && toCmp <= 0 || fromCmp <= 0 && toCmp >= 0) { continue }
+      if (fromCmp <= 0 && (sp.marker.inclusiveRight && marker.inclusiveLeft ? cmp(found.to, from) >= 0 : cmp(found.to, from) > 0) ||
+          fromCmp >= 0 && (sp.marker.inclusiveRight && marker.inclusiveLeft ? cmp(found.from, to) <= 0 : cmp(found.from, to) < 0))
+        { return true }
+    } }
+  }
+
+  // A visual line is a line as drawn on the screen. Folding, for
+  // example, can cause multiple logical lines to appear on the same
+  // visual line. This finds the start of the visual line that the
+  // given line is part of (usually that is the line itself).
+  function visualLine(line) {
+    var merged;
+    while (merged = collapsedSpanAtStart(line))
+      { line = merged.find(-1, true).line; }
+    return line
+  }
+
+  function visualLineEnd(line) {
+    var merged;
+    while (merged = collapsedSpanAtEnd(line))
+      { line = merged.find(1, true).line; }
+    return line
+  }
+
+  // Returns an array of logical lines that continue the visual line
+  // started by the argument, or undefined if there are no such lines.
+  function visualLineContinued(line) {
+    var merged, lines;
+    while (merged = collapsedSpanAtEnd(line)) {
+      line = merged.find(1, true).line
+      ;(lines || (lines = [])).push(line);
+    }
+    return lines
+  }
+
+  // Get the line number of the start of the visual line that the
+  // given line number is part of.
+  function visualLineNo(doc, lineN) {
+    var line = getLine(doc, lineN), vis = visualLine(line);
+    if (line == vis) { return lineN }
+    return lineNo(vis)
+  }
+
+  // Get the line number of the start of the next visual line after
+  // the given line.
+  function visualLineEndNo(doc, lineN) {
+    if (lineN > doc.lastLine()) { return lineN }
+    var line = getLine(doc, lineN), merged;
+    if (!lineIsHidden(doc, line)) { return lineN }
+    while (merged = collapsedSpanAtEnd(line))
+      { line = merged.find(1, true).line; }
+    return lineNo(line) + 1
+  }
+
+  // Compute whether a line is hidden. Lines count as hidden when they
+  // are part of a visual line that starts with another line, or when
+  // they are entirely covered by collapsed, non-widget span.
+  function lineIsHidden(doc, line) {
+    var sps = sawCollapsedSpans && line.markedSpans;
+    if (sps) { for (var sp = (void 0), i = 0; i < sps.length; ++i) {
+      sp = sps[i];
+      if (!sp.marker.collapsed) { continue }
+      if (sp.from == null) { return true }
+      if (sp.marker.widgetNode) { continue }
+      if (sp.from == 0 && sp.marker.inclusiveLeft && lineIsHiddenInner(doc, line, sp))
+        { return true }
+    } }
+  }
+  function lineIsHiddenInner(doc, line, span) {
+    if (span.to == null) {
+      var end = span.marker.find(1, true);
+      return lineIsHiddenInner(doc, end.line, getMarkedSpanFor(end.line.markedSpans, span.marker))
+    }
+    if (span.marker.inclusiveRight && span.to == line.text.length)
+      { return true }
+    for (var sp = (void 0), i = 0; i < line.markedSpans.length; ++i) {
+      sp = line.markedSpans[i];
+      if (sp.marker.collapsed && !sp.marker.widgetNode && sp.from == span.to &&
+          (sp.to == null || sp.to != span.from) &&
+          (sp.marker.inclusiveLeft || span.marker.inclusiveRight) &&
+          lineIsHiddenInner(doc, line, sp)) { return true }
+    }
+  }
+
+  // Find the height above the given line.
+  function heightAtLine(lineObj) {
+    lineObj = visualLine(lineObj);
+
+    var h = 0, chunk = lineObj.parent;
+    for (var i = 0; i < chunk.lines.length; ++i) {
+      var line = chunk.lines[i];
+      if (line == lineObj) { break }
+      else { h += line.height; }
+    }
+    for (var p = chunk.parent; p; chunk = p, p = chunk.parent) {
+      for (var i$1 = 0; i$1 < p.children.length; ++i$1) {
+        var cur = p.children[i$1];
+        if (cur == chunk) { break }
+        else { h += cur.height; }
+      }
+    }
+    return h
+  }
+
+  // Compute the character length of a line, taking into account
+  // collapsed ranges (see markText) that might hide parts, and join
+  // other lines onto it.
+  function lineLength(line) {
+    if (line.height == 0) { return 0 }
+    var len = line.text.length, merged, cur = line;
+    while (merged = collapsedSpanAtStart(cur)) {
+      var found = merged.find(0, true);
+      cur = found.from.line;
+      len += found.from.ch - found.to.ch;
+    }
+    cur = line;
+    while (merged = collapsedSpanAtEnd(cur)) {
+      var found$1 = merged.find(0, true);
+      len -= cur.text.length - found$1.from.ch;
+      cur = found$1.to.line;
+      len += cur.text.length - found$1.to.ch;
+    }
+    return len
+  }
+
+  // Find the longest line in the document.
+  function findMaxLine(cm) {
+    var d = cm.display, doc = cm.doc;
+    d.maxLine = getLine(doc, doc.first);
+    d.maxLineLength = lineLength(d.maxLine);
+    d.maxLineChanged = true;
+    doc.iter(function (line) {
+      var len = lineLength(line);
+      if (len > d.maxLineLength) {
+        d.maxLineLength = len;
+        d.maxLine = line;
+      }
+    });
+  }
+
+  // LINE DATA STRUCTURE
+
+  // Line objects. These hold state related to a line, including
+  // highlighting info (the styles array).
+  var Line = function(text, markedSpans, estimateHeight) {
+    this.text = text;
+    attachMarkedSpans(this, markedSpans);
+    this.height = estimateHeight ? estimateHeight(this) : 1;
+  };
+
+  Line.prototype.lineNo = function () { return lineNo(this) };
+  eventMixin(Line);
+
+  // Change the content (text, markers) of a line. Automatically
+  // invalidates cached information and tries to re-estimate the
+  // line's height.
+  function updateLine(line, text, markedSpans, estimateHeight) {
+    line.text = text;
+    if (line.stateAfter) { line.stateAfter = null; }
+    if (line.styles) { line.styles = null; }
+    if (line.order != null) { line.order = null; }
+    detachMarkedSpans(line);
+    attachMarkedSpans(line, markedSpans);
+    var estHeight = estimateHeight ? estimateHeight(line) : 1;
+    if (estHeight != line.height) { updateLineHeight(line, estHeight); }
+  }
+
+  // Detach a line from the document tree and its markers.
+  function cleanUpLine(line) {
+    line.parent = null;
+    detachMarkedSpans(line);
+  }
+
+  // Convert a style as returned by a mode (either null, or a string
+  // containing one or more styles) to a CSS style. This is cached,
+  // and also looks for line-wide styles.
+  var styleToClassCache = {}, styleToClassCacheWithMode = {};
+  function interpretTokenStyle(style, options) {
+    if (!style || /^\s*$/.test(style)) { return null }
+    var cache = options.addModeClass ? styleToClassCacheWithMode : styleToClassCache;
+    return cache[style] ||
+      (cache[style] = style.replace(/\S+/g, "cm-$&"))
+  }
+
+  // Render the DOM representation of the text of a line. Also builds
+  // up a 'line map', which points at the DOM nodes that represent
+  // specific stretches of text, and is used by the measuring code.
+  // The returned object contains the DOM node, this map, and
+  // information about line-wide styles that were set by the mode.
+  function buildLineContent(cm, lineView) {
+    // The padding-right forces the element to have a 'border', which
+    // is needed on Webkit to be able to get line-level bounding
+    // rectangles for it (in measureChar).
+    var content = eltP("span", null, null, webkit ? "padding-right: .1px" : null);
+    var builder = {pre: eltP("pre", [content], "CodeMirror-line"), content: content,
+                   col: 0, pos: 0, cm: cm,
+                   trailingSpace: false,
+                   splitSpaces: cm.getOption("lineWrapping")};
+    lineView.measure = {};
+
+    // Iterate over the logical lines that make up this visual line.
+    for (var i = 0; i <= (lineView.rest ? lineView.rest.length : 0); i++) {
+      var line = i ? lineView.rest[i - 1] : lineView.line, order = (void 0);
+      builder.pos = 0;
+      builder.addToken = buildToken;
+      // Optionally wire in some hacks into the token-rendering
+      // algorithm, to deal with browser quirks.
+      if (hasBadBidiRects(cm.display.measure) && (order = getOrder(line, cm.doc.direction)))
+        { builder.addToken = buildTokenBadBidi(builder.addToken, order); }
+      builder.map = [];
+      var allowFrontierUpdate = lineView != cm.display.externalMeasured && lineNo(line);
+      insertLineContent(line, builder, getLineStyles(cm, line, allowFrontierUpdate));
+      if (line.styleClasses) {
+        if (line.styleClasses.bgClass)
+          { builder.bgClass = joinClasses(line.styleClasses.bgClass, builder.bgClass || ""); }
+        if (line.styleClasses.textClass)
+          { builder.textClass = joinClasses(line.styleClasses.textClass, builder.textClass || ""); }
+      }
+
+      // Ensure at least a single node is present, for measuring.
+      if (builder.map.length == 0)
+        { builder.map.push(0, 0, builder.content.appendChild(zeroWidthElement(cm.display.measure))); }
+
+      // Store the map and a cache object for the current logical line
+      if (i == 0) {
+        lineView.measure.map = builder.map;
+        lineView.measure.cache = {};
+      } else {
+  (lineView.measure.maps || (lineView.measure.maps = [])).push(builder.map)
+        ;(lineView.measure.caches || (lineView.measure.caches = [])).push({});
+      }
+    }
+
+    // See issue #2901
+    if (webkit) {
+      var last = builder.content.lastChild;
+      if (/\bcm-tab\b/.test(last.className) || (last.querySelector && last.querySelector(".cm-tab")))
+        { builder.content.className = "cm-tab-wrap-hack"; }
+    }
+
+    signal(cm, "renderLine", cm, lineView.line, builder.pre);
+    if (builder.pre.className)
+      { builder.textClass = joinClasses(builder.pre.className, builder.textClass || ""); }
+
+    return builder
+  }
+
+  function defaultSpecialCharPlaceholder(ch) {
+    var token = elt("span", "\u2022", "cm-invalidchar");
+    token.title = "\\u" + ch.charCodeAt(0).toString(16);
+    token.setAttribute("aria-label", token.title);
+    return token
+  }
+
+  // Build up the DOM representation for a single token, and add it to
+  // the line map. Takes care to render special characters separately.
+  function buildToken(builder, text, style, startStyle, endStyle, css, attributes) {
+    if (!text) { return }
+    var displayText = builder.splitSpaces ? splitSpaces(text, builder.trailingSpace) : text;
+    var special = builder.cm.state.specialChars, mustWrap = false;
+    var content;
+    if (!special.test(text)) {
+      builder.col += text.length;
+      content = document.createTextNode(displayText);
+      builder.map.push(builder.pos, builder.pos + text.length, content);
+      if (ie && ie_version < 9) { mustWrap = true; }
+      builder.pos += text.length;
+    } else {
+      content = document.createDocumentFragment();
+      var pos = 0;
+      while (true) {
+        special.lastIndex = pos;
+        var m = special.exec(text);
+        var skipped = m ? m.index - pos : text.length - pos;
+        if (skipped) {
+          var txt = document.createTextNode(displayText.slice(pos, pos + skipped));
+          if (ie && ie_version < 9) { content.appendChild(elt("span", [txt])); }
+          else { content.appendChild(txt); }
+          builder.map.push(builder.pos, builder.pos + skipped, txt);
+          builder.col += skipped;
+          builder.pos += skipped;
+        }
+        if (!m) { break }
+        pos += skipped + 1;
+        var txt$1 = (void 0);
+        if (m[0] == "\t") {
+          var tabSize = builder.cm.options.tabSize, tabWidth = tabSize - builder.col % tabSize;
+          txt$1 = content.appendChild(elt("span", spaceStr(tabWidth), "cm-tab"));
+          txt$1.setAttribute("role", "presentation");
+          txt$1.setAttribute("cm-text", "\t");
+          builder.col += tabWidth;
+        } else if (m[0] == "\r" || m[0] == "\n") {
+          txt$1 = content.appendChild(elt("span", m[0] == "\r" ? "\u240d" : "\u2424", "cm-invalidchar"));
+          txt$1.setAttribute("cm-text", m[0]);
+          builder.col += 1;
+        } else {
+          txt$1 = builder.cm.options.specialCharPlaceholder(m[0]);
+          txt$1.setAttribute("cm-text", m[0]);
+          if (ie && ie_version < 9) { content.appendChild(elt("span", [txt$1])); }
+          else { content.appendChild(txt$1); }
+          builder.col += 1;
+        }
+        builder.map.push(builder.pos, builder.pos + 1, txt$1);
+        builder.pos++;
+      }
+    }
+    builder.trailingSpace = displayText.charCodeAt(text.length - 1) == 32;
+    if (style || startStyle || endStyle || mustWrap || css) {
+      var fullStyle = style || "";
+      if (startStyle) { fullStyle += startStyle; }
+      if (endStyle) { fullStyle += endStyle; }
+      var token = elt("span", [content], fullStyle, css);
+      if (attributes) {
+        for (var attr in attributes) { if (attributes.hasOwnProperty(attr) && attr != "style" && attr != "class")
+          { token.setAttribute(attr, attributes[attr]); } }
+      }
+      return builder.content.appendChild(token)
+    }
+    builder.content.appendChild(content);
+  }
+
+  // Change some spaces to NBSP to prevent the browser from collapsing
+  // trailing spaces at the end of a line when rendering text (issue #1362).
+  function splitSpaces(text, trailingBefore) {
+    if (text.length > 1 && !/  /.test(text)) { return text }
+    var spaceBefore = trailingBefore, result = "";
+    for (var i = 0; i < text.length; i++) {
+      var ch = text.charAt(i);
+      if (ch == " " && spaceBefore && (i == text.length - 1 || text.charCodeAt(i + 1) == 32))
+        { ch = "\u00a0"; }
+      result += ch;
+      spaceBefore = ch == " ";
+    }
+    return result
+  }
+
+  // Work around nonsense dimensions being reported for stretches of
+  // right-to-left text.
+  function buildTokenBadBidi(inner, order) {
+    return function (builder, text, style, startStyle, endStyle, css, attributes) {
+      style = style ? style + " cm-force-border" : "cm-force-border";
+      var start = builder.pos, end = start + text.length;
+      for (;;) {
+        // Find the part that overlaps with the start of this text
+        var part = (void 0);
+        for (var i = 0; i < order.length; i++) {
+          part = order[i];
+          if (part.to > start && part.from <= start) { break }
+        }
+        if (part.to >= end) { return inner(builder, text, style, startStyle, endStyle, css, attributes) }
+        inner(builder, text.slice(0, part.to - start), style, startStyle, null, css, attributes);
+        startStyle = null;
+        text = text.slice(part.to - start);
+        start = part.to;
+      }
+    }
+  }
+
+  function buildCollapsedSpan(builder, size, marker, ignoreWidget) {
+    var widget = !ignoreWidget && marker.widgetNode;
+    if (widget) { builder.map.push(builder.pos, builder.pos + size, widget); }
+    if (!ignoreWidget && builder.cm.display.input.needsContentAttribute) {
+      if (!widget)
+        { widget = builder.content.appendChild(document.createElement("span")); }
+      widget.setAttribute("cm-marker", marker.id);
+    }
+    if (widget) {
+      builder.cm.display.input.setUneditable(widget);
+      builder.content.appendChild(widget);
+    }
+    builder.pos += size;
+    builder.trailingSpace = false;
+  }
+
+  // Outputs a number of spans to make up a line, taking highlighting
+  // and marked text into account.
+  function insertLineContent(line, builder, styles) {
+    var spans = line.markedSpans, allText = line.text, at = 0;
+    if (!spans) {
+      for (var i$1 = 1; i$1 < styles.length; i$1+=2)
+        { builder.addToken(builder, allText.slice(at, at = styles[i$1]), interpretTokenStyle(styles[i$1+1], builder.cm.options)); }
+      return
+    }
+
+    var len = allText.length, pos = 0, i = 1, text = "", style, css;
+    var nextChange = 0, spanStyle, spanEndStyle, spanStartStyle, collapsed, attributes;
+    for (;;) {
+      if (nextChange == pos) { // Update current marker set
+        spanStyle = spanEndStyle = spanStartStyle = css = "";
+        attributes = null;
+        collapsed = null; nextChange = Infinity;
+        var foundBookmarks = [], endStyles = (void 0);
+        for (var j = 0; j < spans.length; ++j) {
+          var sp = spans[j], m = sp.marker;
+          if (m.type == "bookmark" && sp.from == pos && m.widgetNode) {
+            foundBookmarks.push(m);
+          } else if (sp.from <= pos && (sp.to == null || sp.to > pos || m.collapsed && sp.to == pos && sp.from == pos)) {
+            if (sp.to != null && sp.to != pos && nextChange > sp.to) {
+              nextChange = sp.to;
+              spanEndStyle = "";
+            }
+            if (m.className) { spanStyle += " " + m.className; }
+            if (m.css) { css = (css ? css + ";" : "") + m.css; }
+            if (m.startStyle && sp.from == pos) { spanStartStyle += " " + m.startStyle; }
+            if (m.endStyle && sp.to == nextChange) { (endStyles || (endStyles = [])).push(m.endStyle, sp.to); }
+            // support for the old title property
+            // https://github.com/codemirror/CodeMirror/pull/5673
+            if (m.title) { (attributes || (attributes = {})).title = m.title; }
+            if (m.attributes) {
+              for (var attr in m.attributes)
+                { (attributes || (attributes = {}))[attr] = m.attributes[attr]; }
+            }
+            if (m.collapsed && (!collapsed || compareCollapsedMarkers(collapsed.marker, m) < 0))
+              { collapsed = sp; }
+          } else if (sp.from > pos && nextChange > sp.from) {
+            nextChange = sp.from;
+          }
+        }
+        if (endStyles) { for (var j$1 = 0; j$1 < endStyles.length; j$1 += 2)
+          { if (endStyles[j$1 + 1] == nextChange) { spanEndStyle += " " + endStyles[j$1]; } } }
+
+        if (!collapsed || collapsed.from == pos) { for (var j$2 = 0; j$2 < foundBookmarks.length; ++j$2)
+          { buildCollapsedSpan(builder, 0, foundBookmarks[j$2]); } }
+        if (collapsed && (collapsed.from || 0) == pos) {
+          buildCollapsedSpan(builder, (collapsed.to == null ? len + 1 : collapsed.to) - pos,
+                             collapsed.marker, collapsed.from == null);
+          if (collapsed.to == null) { return }
+          if (collapsed.to == pos) { collapsed = false; }
+        }
+      }
+      if (pos >= len) { break }
+
+      var upto = Math.min(len, nextChange);
+      while (true) {
+        if (text) {
+          var end = pos + text.length;
+          if (!collapsed) {
+            var tokenText = end > upto ? text.slice(0, upto - pos) : text;
+            builder.addToken(builder, tokenText, style ? style + spanStyle : spanStyle,
+                             spanStartStyle, pos + tokenText.length == nextChange ? spanEndStyle : "", css, attributes);
+          }
+          if (end >= upto) {text = text.slice(upto - pos); pos = upto; break}
+          pos = end;
+          spanStartStyle = "";
+        }
+        text = allText.slice(at, at = styles[i++]);
+        style = interpretTokenStyle(styles[i++], builder.cm.options);
+      }
+    }
+  }
+
+
+  // These objects are used to represent the visible (currently drawn)
+  // part of the document. A LineView may correspond to multiple
+  // logical lines, if those are connected by collapsed ranges.
+  function LineView(doc, line, lineN) {
+    // The starting line
+    this.line = line;
+    // Continuing lines, if any
+    this.rest = visualLineContinued(line);
+    // Number of logical lines in this visual line
+    this.size = this.rest ? lineNo(lst(this.rest)) - lineN + 1 : 1;
+    this.node = this.text = null;
+    this.hidden = lineIsHidden(doc, line);
+  }
+
+  // Create a range of LineView objects for the given lines.
+  function buildViewArray(cm, from, to) {
+    var array = [], nextPos;
+    for (var pos = from; pos < to; pos = nextPos) {
+      var view = new LineView(cm.doc, getLine(cm.doc, pos), pos);
+      nextPos = pos + view.size;
+      array.push(view);
+    }
+    return array
+  }
+
+  var operationGroup = null;
+
+  function pushOperation(op) {
+    if (operationGroup) {
+      operationGroup.ops.push(op);
+    } else {
+      op.ownsGroup = operationGroup = {
+        ops: [op],
+        delayedCallbacks: []
+      };
+    }
+  }
+
+  function fireCallbacksForOps(group) {
+    // Calls delayed callbacks and cursorActivity handlers until no
+    // new ones appear
+    var callbacks = group.delayedCallbacks, i = 0;
+    do {
+      for (; i < callbacks.length; i++)
+        { callbacks[i].call(null); }
+      for (var j = 0; j < group.ops.length; j++) {
+        var op = group.ops[j];
+        if (op.cursorActivityHandlers)
+          { while (op.cursorActivityCalled < op.cursorActivityHandlers.length)
+            { op.cursorActivityHandlers[op.cursorActivityCalled++].call(null, op.cm); } }
+      }
+    } while (i < callbacks.length)
+  }
+
+  function finishOperation(op, endCb) {
+    var group = op.ownsGroup;
+    if (!group) { return }
+
+    try { fireCallbacksForOps(group); }
+    finally {
+      operationGroup = null;
+      endCb(group);
+    }
+  }
+
+  var orphanDelayedCallbacks = null;
+
+  // Often, we want to signal events at a point where we are in the
+  // middle of some work, but don't want the handler to start calling
+  // other methods on the editor, which might be in an inconsistent
+  // state or simply not expect any other events to happen.
+  // signalLater looks whether there are any handlers, and schedules
+  // them to be executed when the last operation ends, or, if no
+  // operation is active, when a timeout fires.
+  function signalLater(emitter, type /*, values...*/) {
+    var arr = getHandlers(emitter, type);
+    if (!arr.length) { return }
+    var args = Array.prototype.slice.call(arguments, 2), list;
+    if (operationGroup) {
+      list = operationGroup.delayedCallbacks;
+    } else if (orphanDelayedCallbacks) {
+      list = orphanDelayedCallbacks;
+    } else {
+      list = orphanDelayedCallbacks = [];
+      setTimeout(fireOrphanDelayed, 0);
+    }
+    var loop = function ( i ) {
+      list.push(function () { return arr[i].apply(null, args); });
+    };
+
+    for (var i = 0; i < arr.length; ++i)
+      loop( i );
+  }
+
+  function fireOrphanDelayed() {
+    var delayed = orphanDelayedCallbacks;
+    orphanDelayedCallbacks = null;
+    for (var i = 0; i < delayed.length; ++i) { delayed[i](); }
+  }
+
+  // When an aspect of a line changes, a string is added to
+  // lineView.changes. This updates the relevant part of the line's
+  // DOM structure.
+  function updateLineForChanges(cm, lineView, lineN, dims) {
+    for (var j = 0; j < lineView.changes.length; j++) {
+      var type = lineView.changes[j];
+      if (type == "text") { updateLineText(cm, lineView); }
+      else if (type == "gutter") { updateLineGutter(cm, lineView, lineN, dims); }
+      else if (type == "class") { updateLineClasses(cm, lineView); }
+      else if (type == "widget") { updateLineWidgets(cm, lineView, dims); }
+    }
+    lineView.changes = null;
+  }
+
+  // Lines with gutter elements, widgets or a background class need to
+  // be wrapped, and have the extra elements added to the wrapper div
+  function ensureLineWrapped(lineView) {
+    if (lineView.node == lineView.text) {
+      lineView.node = elt("div", null, null, "position: relative");
+      if (lineView.text.parentNode)
+        { lineView.text.parentNode.replaceChild(lineView.node, lineView.text); }
+      lineView.node.appendChild(lineView.text);
+      if (ie && ie_version < 8) { lineView.node.style.zIndex = 2; }
+    }
+    return lineView.node
+  }
+
+  function updateLineBackground(cm, lineView) {
+    var cls = lineView.bgClass ? lineView.bgClass + " " + (lineView.line.bgClass || "") : lineView.line.bgClass;
+    if (cls) { cls += " CodeMirror-linebackground"; }
+    if (lineView.background) {
+      if (cls) { lineView.background.className = cls; }
+      else { lineView.background.parentNode.removeChild(lineView.background); lineView.background = null; }
+    } else if (cls) {
+      var wrap = ensureLineWrapped(lineView);
+      lineView.background = wrap.insertBefore(elt("div", null, cls), wrap.firstChild);
+      cm.display.input.setUneditable(lineView.background);
+    }
+  }
+
+  // Wrapper around buildLineContent which will reuse the structure
+  // in display.externalMeasured when possible.
+  function getLineContent(cm, lineView) {
+    var ext = cm.display.externalMeasured;
+    if (ext && ext.line == lineView.line) {
+      cm.display.externalMeasured = null;
+      lineView.measure = ext.measure;
+      return ext.built
+    }
+    return buildLineContent(cm, lineView)
+  }
+
+  // Redraw the line's text. Interacts with the background and text
+  // classes because the mode may output tokens that influence these
+  // classes.
+  function updateLineText(cm, lineView) {
+    var cls = lineView.text.className;
+    var built = getLineContent(cm, lineView);
+    if (lineView.text == lineView.node) { lineView.node = built.pre; }
+    lineView.text.parentNode.replaceChild(built.pre, lineView.text);
+    lineView.text = built.pre;
+    if (built.bgClass != lineView.bgClass || built.textClass != lineView.textClass) {
+      lineView.bgClass = built.bgClass;
+      lineView.textClass = built.textClass;
+      updateLineClasses(cm, lineView);
+    } else if (cls) {
+      lineView.text.className = cls;
+    }
+  }
+
+  function updateLineClasses(cm, lineView) {
+    updateLineBackground(cm, lineView);
+    if (lineView.line.wrapClass)
+      { ensureLineWrapped(lineView).className = lineView.line.wrapClass; }
+    else if (lineView.node != lineView.text)
+      { lineView.node.className = ""; }
+    var textClass = lineView.textClass ? lineView.textClass + " " + (lineView.line.textClass || "") : lineView.line.textClass;
+    lineView.text.className = textClass || "";
+  }
+
+  function updateLineGutter(cm, lineView, lineN, dims) {
+    if (lineView.gutter) {
+      lineView.node.removeChild(lineView.gutter);
+      lineView.gutter = null;
+    }
+    if (lineView.gutterBackground) {
+      lineView.node.removeChild(lineView.gutterBackground);
+      lineView.gutterBackground = null;
+    }
+    if (lineView.line.gutterClass) {
+      var wrap = ensureLineWrapped(lineView);
+      lineView.gutterBackground = elt("div", null, "CodeMirror-gutter-background " + lineView.line.gutterClass,
+                                      ("left: " + (cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth) + "px; width: " + (dims.gutterTotalWidth) + "px"));
+      cm.display.input.setUneditable(lineView.gutterBackground);
+      wrap.insertBefore(lineView.gutterBackground, lineView.text);
+    }
+    var markers = lineView.line.gutterMarkers;
+    if (cm.options.lineNumbers || markers) {
+      var wrap$1 = ensureLineWrapped(lineView);
+      var gutterWrap = lineView.gutter = elt("div", null, "CodeMirror-gutter-wrapper", ("left: " + (cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth) + "px"));
+      cm.display.input.setUneditable(gutterWrap);
+      wrap$1.insertBefore(gutterWrap, lineView.text);
+      if (lineView.line.gutterClass)
+        { gutterWrap.className += " " + lineView.line.gutterClass; }
+      if (cm.options.lineNumbers && (!markers || !markers["CodeMirror-linenumbers"]))
+        { lineView.lineNumber = gutterWrap.appendChild(
+          elt("div", lineNumberFor(cm.options, lineN),
+              "CodeMirror-linenumber CodeMirror-gutter-elt",
+              ("left: " + (dims.gutterLeft["CodeMirror-linenumbers"]) + "px; width: " + (cm.display.lineNumInnerWidth) + "px"))); }
+      if (markers) { for (var k = 0; k < cm.display.gutterSpecs.length; ++k) {
+        var id = cm.display.gutterSpecs[k].className, found = markers.hasOwnProperty(id) && markers[id];
+        if (found)
+          { gutterWrap.appendChild(elt("div", [found], "CodeMirror-gutter-elt",
+                                     ("left: " + (dims.gutterLeft[id]) + "px; width: " + (dims.gutterWidth[id]) + "px"))); }
+      } }
+    }
+  }
+
+  function updateLineWidgets(cm, lineView, dims) {
+    if (lineView.alignable) { lineView.alignable = null; }
+    for (var node = lineView.node.firstChild, next = (void 0); node; node = next) {
+      next = node.nextSibling;
+      if (node.className == "CodeMirror-linewidget")
+        { lineView.node.removeChild(node); }
+    }
+    insertLineWidgets(cm, lineView, dims);
+  }
+
+  // Build a line's DOM representation from scratch
+  function buildLineElement(cm, lineView, lineN, dims) {
+    var built = getLineContent(cm, lineView);
+    lineView.text = lineView.node = built.pre;
+    if (built.bgClass) { lineView.bgClass = built.bgClass; }
+    if (built.textClass) { lineView.textClass = built.textClass; }
+
+    updateLineClasses(cm, lineView);
+    updateLineGutter(cm, lineView, lineN, dims);
+    insertLineWidgets(cm, lineView, dims);
+    return lineView.node
+  }
+
+  // A lineView may contain multiple logical lines (when merged by
+  // collapsed spans). The widgets for all of them need to be drawn.
+  function insertLineWidgets(cm, lineView, dims) {
+    insertLineWidgetsFor(cm, lineView.line, lineView, dims, true);
+    if (lineView.rest) { for (var i = 0; i < lineView.rest.length; i++)
+      { insertLineWidgetsFor(cm, lineView.rest[i], lineView, dims, false); } }
+  }
+
+  function insertLineWidgetsFor(cm, line, lineView, dims, allowAbove) {
+    if (!line.widgets) { return }
+    var wrap = ensureLineWrapped(lineView);
+    for (var i = 0, ws = line.widgets; i < ws.length; ++i) {
+      var widget = ws[i], node = elt("div", [widget.node], "CodeMirror-linewidget");
+      if (!widget.handleMouseEvents) { node.setAttribute("cm-ignore-events", "true"); }
+      positionLineWidget(widget, node, lineView, dims);
+      cm.display.input.setUneditable(node);
+      if (allowAbove && widget.above)
+        { wrap.insertBefore(node, lineView.gutter || lineView.text); }
+      else
+        { wrap.appendChild(node); }
+      signalLater(widget, "redraw");
+    }
+  }
+
+  function positionLineWidget(widget, node, lineView, dims) {
+    if (widget.noHScroll) {
+  (lineView.alignable || (lineView.alignable = [])).push(node);
+      var width = dims.wrapperWidth;
+      node.style.left = dims.fixedPos + "px";
+      if (!widget.coverGutter) {
+        width -= dims.gutterTotalWidth;
+        node.style.paddingLeft = dims.gutterTotalWidth + "px";
+      }
+      node.style.width = width + "px";
+    }
+    if (widget.coverGutter) {
+      node.style.zIndex = 5;
+      node.style.position = "relative";
+      if (!widget.noHScroll) { node.style.marginLeft = -dims.gutterTotalWidth + "px"; }
+    }
+  }
+
+  function widgetHeight(widget) {
+    if (widget.height != null) { return widget.height }
+    var cm = widget.doc.cm;
+    if (!cm) { return 0 }
+    if (!contains(document.body, widget.node)) {
+      var parentStyle = "position: relative;";
+      if (widget.coverGutter)
+        { parentStyle += "margin-left: -" + cm.display.gutters.offsetWidth + "px;"; }
+      if (widget.noHScroll)
+        { parentStyle += "width: " + cm.display.wrapper.clientWidth + "px;"; }
+      removeChildrenAndAdd(cm.display.measure, elt("div", [widget.node], null, parentStyle));
+    }
+    return widget.height = widget.node.parentNode.offsetHeight
+  }
+
+  // Return true when the given mouse event happened in a widget
+  function eventInWidget(display, e) {
+    for (var n = e_target(e); n != display.wrapper; n = n.parentNode) {
+      if (!n || (n.nodeType == 1 && n.getAttribute("cm-ignore-events") == "true") ||
+          (n.parentNode == display.sizer && n != display.mover))
+        { return true }
+    }
+  }
+
+  // POSITION MEASUREMENT
+
+  function paddingTop(display) {return display.lineSpace.offsetTop}
+  function paddingVert(display) {return display.mover.offsetHeight - display.lineSpace.offsetHeight}
+  function paddingH(display) {
+    if (display.cachedPaddingH) { return display.cachedPaddingH }
+    var e = removeChildrenAndAdd(display.measure, elt("pre", "x", "CodeMirror-line-like"));
+    var style = window.getComputedStyle ? window.getComputedStyle(e) : e.currentStyle;
+    var data = {left: parseInt(style.paddingLeft), right: parseInt(style.paddingRight)};
+    if (!isNaN(data.left) && !isNaN(data.right)) { display.cachedPaddingH = data; }
+    return data
+  }
+
+  function scrollGap(cm) { return scrollerGap - cm.display.nativeBarWidth }
+  function displayWidth(cm) {
+    return cm.display.scroller.clientWidth - scrollGap(cm) - cm.display.barWidth
+  }
+  function displayHeight(cm) {
+    return cm.display.scroller.clientHeight - scrollGap(cm) - cm.display.barHeight
+  }
+
+  // Ensure the lineView.wrapping.heights array is populated. This is
+  // an array of bottom offsets for the lines that make up a drawn
+  // line. When lineWrapping is on, there might be more than one
+  // height.
+  function ensureLineHeights(cm, lineView, rect) {
+    var wrapping = cm.options.lineWrapping;
+    var curWidth = wrapping && displayWidth(cm);
+    if (!lineView.measure.heights || wrapping && lineView.measure.width != curWidth) {
+      var heights = lineView.measure.heights = [];
+      if (wrapping) {
+        lineView.measure.width = curWidth;
+        var rects = lineView.text.firstChild.getClientRects();
+        for (var i = 0; i < rects.length - 1; i++) {
+          var cur = rects[i], next = rects[i + 1];
+          if (Math.abs(cur.bottom - next.bottom) > 2)
+            { heights.push((cur.bottom + next.top) / 2 - rect.top); }
+        }
+      }
+      heights.push(rect.bottom - rect.top);
+    }
+  }
+
+  // Find a line map (mapping character offsets to text nodes) and a
+  // measurement cache for the given line number. (A line view might
+  // contain multiple lines when collapsed ranges are present.)
+  function mapFromLineView(lineView, line, lineN) {
+    if (lineView.line == line)
+      { return {map: lineView.measure.map, cache: lineView.measure.cache} }
+    for (var i = 0; i < lineView.rest.length; i++)
+      { if (lineView.rest[i] == line)
+        { return {map: lineView.measure.maps[i], cache: lineView.measure.caches[i]} } }
+    for (var i$1 = 0; i$1 < lineView.rest.length; i$1++)
+      { if (lineNo(lineView.rest[i$1]) > lineN)
+        { return {map: lineView.measure.maps[i$1], cache: lineView.measure.caches[i$1], before: true} } }
+  }
+
+  // Render a line into the hidden node display.externalMeasured. Used
+  // when measurement is needed for a line that's not in the viewport.
+  function updateExternalMeasurement(cm, line) {
+    line = visualLine(line);
+    var lineN = lineNo(line);
+    var view = cm.display.externalMeasured = new LineView(cm.doc, line, lineN);
+    view.lineN = lineN;
+    var built = view.built = buildLineContent(cm, view);
+    view.text = built.pre;
+    removeChildrenAndAdd(cm.display.lineMeasure, built.pre);
+    return view
+  }
+
+  // Get a {top, bottom, left, right} box (in line-local coordinates)
+  // for a given character.
+  function measureChar(cm, line, ch, bias) {
+    return measureCharPrepared(cm, prepareMeasureForLine(cm, line), ch, bias)
+  }
+
+  // Find a line view that corresponds to the given line number.
+  function findViewForLine(cm, lineN) {
+    if (lineN >= cm.display.viewFrom && lineN < cm.display.viewTo)
+      { return cm.display.view[findViewIndex(cm, lineN)] }
+    var ext = cm.display.externalMeasured;
+    if (ext && lineN >= ext.lineN && lineN < ext.lineN + ext.size)
+      { return ext }
+  }
+
+  // Measurement can be split in two steps, the set-up work that
+  // applies to the whole line, and the measurement of the actual
+  // character. Functions like coordsChar, that need to do a lot of
+  // measurements in a row, can thus ensure that the set-up work is
+  // only done once.
+  function prepareMeasureForLine(cm, line) {
+    var lineN = lineNo(line);
+    var view = findViewForLine(cm, lineN);
+    if (view && !view.text) {
+      view = null;
+    } else if (view && view.changes) {
+      updateLineForChanges(cm, view, lineN, getDimensions(cm));
+      cm.curOp.forceUpdate = true;
+    }
+    if (!view)
+      { view = updateExternalMeasurement(cm, line); }
+
+    var info = mapFromLineView(view, line, lineN);
+    return {
+      line: line, view: view, rect: null,
+      map: info.map, cache: info.cache, before: info.before,
+      hasHeights: false
+    }
+  }
+
+  // Given a prepared measurement object, measures the position of an
+  // actual character (or fetches it from the cache).
+  function measureCharPrepared(cm, prepared, ch, bias, varHeight) {
+    if (prepared.before) { ch = -1; }
+    var key = ch + (bias || ""), found;
+    if (prepared.cache.hasOwnProperty(key)) {
+      found = prepared.cache[key];
+    } else {
+      if (!prepared.rect)
+        { prepared.rect = prepared.view.text.getBoundingClientRect(); }
+      if (!prepared.hasHeights) {
+        ensureLineHeights(cm, prepared.view, prepared.rect);
+        prepared.hasHeights = true;
+      }
+      found = measureCharInner(cm, prepared, ch, bias);
+      if (!found.bogus) { prepared.cache[key] = found; }
+    }
+    return {left: found.left, right: found.right,
+            top: varHeight ? found.rtop : found.top,
+            bottom: varHeight ? found.rbottom : found.bottom}
+  }
+
+  var nullRect = {left: 0, right: 0, top: 0, bottom: 0};
+
+  function nodeAndOffsetInLineMap(map$$1, ch, bias) {
+    var node, start, end, collapse, mStart, mEnd;
+    // First, search the line map for the text node corresponding to,
+    // or closest to, the target character.
+    for (var i = 0; i < map$$1.length; i += 3) {
+      mStart = map$$1[i];
+      mEnd = map$$1[i + 1];
+      if (ch < mStart) {
+        start = 0; end = 1;
+        collapse = "left";
+      } else if (ch < mEnd) {
+        start = ch - mStart;
+        end = start + 1;
+      } else if (i == map$$1.length - 3 || ch == mEnd && map$$1[i + 3] > ch) {
+        end = mEnd - mStart;
+        start = end - 1;
+        if (ch >= mEnd) { collapse = "right"; }
+      }
+      if (start != null) {
+        node = map$$1[i + 2];
+        if (mStart == mEnd && bias == (node.insertLeft ? "left" : "right"))
+          { collapse = bias; }
+        if (bias == "left" && start == 0)
+          { while (i && map$$1[i - 2] == map$$1[i - 3] && map$$1[i - 1].insertLeft) {
+            node = map$$1[(i -= 3) + 2];
+            collapse = "left";
+          } }
+        if (bias == "right" && start == mEnd - mStart)
+          { while (i < map$$1.length - 3 && map$$1[i + 3] == map$$1[i + 4] && !map$$1[i + 5].insertLeft) {
+            node = map$$1[(i += 3) + 2];
+            collapse = "right";
+          } }
+        break
+      }
+    }
+    return {node: node, start: start, end: end, collapse: collapse, coverStart: mStart, coverEnd: mEnd}
+  }
+
+  function getUsefulRect(rects, bias) {
+    var rect = nullRect;
+    if (bias == "left") { for (var i = 0; i < rects.length; i++) {
+      if ((rect = rects[i]).left != rect.right) { break }
+    } } else { for (var i$1 = rects.length - 1; i$1 >= 0; i$1--) {
+      if ((rect = rects[i$1]).left != rect.right) { break }
+    } }
+    return rect
+  }
+
+  function measureCharInner(cm, prepared, ch, bias) {
+    var place = nodeAndOffsetInLineMap(prepared.map, ch, bias);
+    var node = place.node, start = place.start, end = place.end, collapse = place.collapse;
+
+    var rect;
+    if (node.nodeType == 3) { // If it is a text node, use a range to retrieve the coordinates.
+      for (var i$1 = 0; i$1 < 4; i$1++) { // Retry a maximum of 4 times when nonsense rectangles are returned
+        while (start && isExtendingChar(prepared.line.text.charAt(place.coverStart + start))) { --start; }
+        while (place.coverStart + end < place.coverEnd && isExtendingChar(prepared.line.text.charAt(place.coverStart + end))) { ++end; }
+        if (ie && ie_version < 9 && start == 0 && end == place.coverEnd - place.coverStart)
+          { rect = node.parentNode.getBoundingClientRect(); }
+        else
+          { rect = getUsefulRect(range(node, start, end).getClientRects(), bias); }
+        if (rect.left || rect.right || start == 0) { break }
+        end = start;
+        start = start - 1;
+        collapse = "right";
+      }
+      if (ie && ie_version < 11) { rect = maybeUpdateRectForZooming(cm.display.measure, rect); }
+    } else { // If it is a widget, simply get the box for the whole widget.
+      if (start > 0) { collapse = bias = "right"; }
+      var rects;
+      if (cm.options.lineWrapping && (rects = node.getClientRects()).length > 1)
+        { rect = rects[bias == "right" ? rects.length - 1 : 0]; }
+      else
+        { rect = node.getBoundingClientRect(); }
+    }
+    if (ie && ie_version < 9 && !start && (!rect || !rect.left && !rect.right)) {
+      var rSpan = node.parentNode.getClientRects()[0];
+      if (rSpan)
+        { rect = {left: rSpan.left, right: rSpan.left + charWidth(cm.display), top: rSpan.top, bottom: rSpan.bottom}; }
+      else
+        { rect = nullRect; }
+    }
+
+    var rtop = rect.top - prepared.rect.top, rbot = rect.bottom - prepared.rect.top;
+    var mid = (rtop + rbot) / 2;
+    var heights = prepared.view.measure.heights;
+    var i = 0;
+    for (; i < heights.length - 1; i++)
+      { if (mid < heights[i]) { break } }
+    var top = i ? heights[i - 1] : 0, bot = heights[i];
+    var result = {left: (collapse == "right" ? rect.right : rect.left) - prepared.rect.left,
+                  right: (collapse == "left" ? rect.left : rect.right) - prepared.rect.left,
+                  top: top, bottom: bot};
+    if (!rect.left && !rect.right) { result.bogus = true; }
+    if (!cm.options.singleCursorHeightPerLine) { result.rtop = rtop; result.rbottom = rbot; }
+
+    return result
+  }
+
+  // Work around problem with bounding client rects on ranges being
+  // returned incorrectly when zoomed on IE10 and below.
+  function maybeUpdateRectForZooming(measure, rect) {
+    if (!window.screen || screen.logicalXDPI == null ||
+        screen.logicalXDPI == screen.deviceXDPI || !hasBadZoomedRects(measure))
+      { return rect }
+    var scaleX = screen.logicalXDPI / screen.deviceXDPI;
+    var scaleY = screen.logicalYDPI / screen.deviceYDPI;
+    return {left: rect.left * scaleX, right: rect.right * scaleX,
+            top: rect.top * scaleY, bottom: rect.bottom * scaleY}
+  }
+
+  function clearLineMeasurementCacheFor(lineView) {
+    if (lineView.measure) {
+      lineView.measure.cache = {};
+      lineView.measure.heights = null;
+      if (lineView.rest) { for (var i = 0; i < lineView.rest.length; i++)
+        { lineView.measure.caches[i] = {}; } }
+    }
+  }
+
+  function clearLineMeasurementCache(cm) {
+    cm.display.externalMeasure = null;
+    removeChildren(cm.display.lineMeasure);
+    for (var i = 0; i < cm.display.view.length; i++)
+      { clearLineMeasurementCacheFor(cm.display.view[i]); }
+  }
+
+  function clearCaches(cm) {
+    clearLineMeasurementCache(cm);
+    cm.display.cachedCharWidth = cm.display.cachedTextHeight = cm.display.cachedPaddingH = null;
+    if (!cm.options.lineWrapping) { cm.display.maxLineChanged = true; }
+    cm.display.lineNumChars = null;
+  }
+
+  function pageScrollX() {
+    // Work around https://bugs.chromium.org/p/chromium/issues/detail?id=489206
+    // which causes page_Offset and bounding client rects to use
+    // different reference viewports and invalidate our calculations.
+    if (chrome && android) { return -(document.body.getBoundingClientRect().left - parseInt(getComputedStyle(document.body).marginLeft)) }
+    return window.pageXOffset || (document.documentElement || document.body).scrollLeft
+  }
+  function pageScrollY() {
+    if (chrome && android) { return -(document.body.getBoundingClientRect().top - parseInt(getComputedStyle(document.body).marginTop)) }
+    return window.pageYOffset || (document.documentElement || document.body).scrollTop
+  }
+
+  function widgetTopHeight(lineObj) {
+    var height = 0;
+    if (lineObj.widgets) { for (var i = 0; i < lineObj.widgets.length; ++i) { if (lineObj.widgets[i].above)
+      { height += widgetHeight(lineObj.widgets[i]); } } }
+    return height
+  }
+
+  // Converts a {top, bottom, left, right} box from line-local
+  // coordinates into another coordinate system. Context may be one of
+  // "line", "div" (display.lineDiv), "local"./null (editor), "window",
+  // or "page".
+  function intoCoordSystem(cm, lineObj, rect, context, includeWidgets) {
+    if (!includeWidgets) {
+      var height = widgetTopHeight(lineObj);
+      rect.top += height; rect.bottom += height;
+    }
+    if (context == "line") { return rect }
+    if (!context) { context = "local"; }
+    var yOff = heightAtLine(lineObj);
+    if (context == "local") { yOff += paddingTop(cm.display); }
+    else { yOff -= cm.display.viewOffset; }
+    if (context == "page" || context == "window") {
+      var lOff = cm.display.lineSpace.getBoundingClientRect();
+      yOff += lOff.top + (context == "window" ? 0 : pageScrollY());
+      var xOff = lOff.left + (context == "window" ? 0 : pageScrollX());
+      rect.left += xOff; rect.right += xOff;
+    }
+    rect.top += yOff; rect.bottom += yOff;
+    return rect
+  }
+
+  // Coverts a box from "div" coords to another coordinate system.
+  // Context may be "window", "page", "div", or "local"./null.
+  function fromCoordSystem(cm, coords, context) {
+    if (context == "div") { return coords }
+    var left = coords.left, top = coords.top;
+    // First move into "page" coordinate system
+    if (context == "page") {
+      left -= pageScrollX();
+      top -= pageScrollY();
+    } else if (context == "local" || !context) {
+      var localBox = cm.display.sizer.getBoundingClientRect();
+      left += localBox.left;
+      top += localBox.top;
+    }
+
+    var lineSpaceBox = cm.display.lineSpace.getBoundingClientRect();
+    return {left: left - lineSpaceBox.left, top: top - lineSpaceBox.top}
+  }
+
+  function charCoords(cm, pos, context, lineObj, bias) {
+    if (!lineObj) { lineObj = getLine(cm.doc, pos.line); }
+    return intoCoordSystem(cm, lineObj, measureChar(cm, lineObj, pos.ch, bias), context)
+  }
+
+  // Returns a box for a given cursor position, which may have an
+  // 'other' property containing the position of the secondary cursor
+  // on a bidi boundary.
+  // A cursor Pos(line, char, "before") is on the same visual line as `char - 1`
+  // and after `char - 1` in writing order of `char - 1`
+  // A cursor Pos(line, char, "after") is on the same visual line as `char`
+  // and before `char` in writing order of `char`
+  // Examples (upper-case letters are RTL, lower-case are LTR):
+  //     Pos(0, 1, ...)
+  //     before   after
+  // ab     a|b     a|b
+  // aB     a|B     aB|
+  // Ab     |Ab     A|b
+  // AB     B|A     B|A
+  // Every position after the last character on a line is considered to stick
+  // to the last character on the line.
+  function cursorCoords(cm, pos, context, lineObj, preparedMeasure, varHeight) {
+    lineObj = lineObj || getLine(cm.doc, pos.line);
+    if (!preparedMeasure) { preparedMeasure = prepareMeasureForLine(cm, lineObj); }
+    function get(ch, right) {
+      var m = measureCharPrepared(cm, preparedMeasure, ch, right ? "right" : "left", varHeight);
+      if (right) { m.left = m.right; } else { m.right = m.left; }
+      return intoCoordSystem(cm, lineObj, m, context)
+    }
+    var order = getOrder(lineObj, cm.doc.direction), ch = pos.ch, sticky = pos.sticky;
+    if (ch >= lineObj.text.length) {
+      ch = lineObj.text.length;
+      sticky = "before";
+    } else if (ch <= 0) {
+      ch = 0;
+      sticky = "after";
+    }
+    if (!order) { return get(sticky == "before" ? ch - 1 : ch, sticky == "before") }
+
+    function getBidi(ch, partPos, invert) {
+      var part = order[partPos], right = part.level == 1;
+      return get(invert ? ch - 1 : ch, right != invert)
+    }
+    var partPos = getBidiPartAt(order, ch, sticky);
+    var other = bidiOther;
+    var val = getBidi(ch, partPos, sticky == "before");
+    if (other != null) { val.other = getBidi(ch, other, sticky != "before"); }
+    return val
+  }
+
+  // Used to cheaply estimate the coordinates for a position. Used for
+  // intermediate scroll updates.
+  function estimateCoords(cm, pos) {
+    var left = 0;
+    pos = clipPos(cm.doc, pos);
+    if (!cm.options.lineWrapping) { left = charWidth(cm.display) * pos.ch; }
+    var lineObj = getLine(cm.doc, pos.line);
+    var top = heightAtLine(lineObj) + paddingTop(cm.display);
+    return {left: left, right: left, top: top, bottom: top + lineObj.height}
+  }
+
+  // Positions returned by coordsChar contain some extra information.
+  // xRel is the relative x position of the input coordinates compared
+  // to the found position (so xRel > 0 means the coordinates are to
+  // the right of the character position, for example). When outside
+  // is true, that means the coordinates lie outside the line's
+  // vertical range.
+  function PosWithInfo(line, ch, sticky, outside, xRel) {
+    var pos = Pos(line, ch, sticky);
+    pos.xRel = xRel;
+    if (outside) { pos.outside = outside; }
+    return pos
+  }
+
+  // Compute the character position closest to the given coordinates.
+  // Input must be lineSpace-local ("div" coordinate system).
+  function coordsChar(cm, x, y) {
+    var doc = cm.doc;
+    y += cm.display.viewOffset;
+    if (y < 0) { return PosWithInfo(doc.first, 0, null, -1, -1) }
+    var lineN = lineAtHeight(doc, y), last = doc.first + doc.size - 1;
+    if (lineN > last)
+      { return PosWithInfo(doc.first + doc.size - 1, getLine(doc, last).text.length, null, 1, 1) }
+    if (x < 0) { x = 0; }
+
+    var lineObj = getLine(doc, lineN);
+    for (;;) {
+      var found = coordsCharInner(cm, lineObj, lineN, x, y);
+      var collapsed = collapsedSpanAround(lineObj, found.ch + (found.xRel > 0 || found.outside > 0 ? 1 : 0));
+      if (!collapsed) { return found }
+      var rangeEnd = collapsed.find(1);
+      if (rangeEnd.line == lineN) { return rangeEnd }
+      lineObj = getLine(doc, lineN = rangeEnd.line);
+    }
+  }
+
+  function wrappedLineExtent(cm, lineObj, preparedMeasure, y) {
+    y -= widgetTopHeight(lineObj);
+    var end = lineObj.text.length;
+    var begin = findFirst(function (ch) { return measureCharPrepared(cm, preparedMeasure, ch - 1).bottom <= y; }, end, 0);
+    end = findFirst(function (ch) { return measureCharPrepared(cm, preparedMeasure, ch).top > y; }, begin, end);
+    return {begin: begin, end: end}
+  }
+
+  function wrappedLineExtentChar(cm, lineObj, preparedMeasure, target) {
+    if (!preparedMeasure) { preparedMeasure = prepareMeasureForLine(cm, lineObj); }
+    var targetTop = intoCoordSystem(cm, lineObj, measureCharPrepared(cm, preparedMeasure, target), "line").top;
+    return wrappedLineExtent(cm, lineObj, preparedMeasure, targetTop)
+  }
+
+  // Returns true if the given side of a box is after the given
+  // coordinates, in top-to-bottom, left-to-right order.
+  function boxIsAfter(box, x, y, left) {
+    return box.bottom <= y ? false : box.top > y ? true : (left ? box.left : box.right) > x
+  }
+
+  function coordsCharInner(cm, lineObj, lineNo$$1, x, y) {
+    // Move y into line-local coordinate space
+    y -= heightAtLine(lineObj);
+    var preparedMeasure = prepareMeasureForLine(cm, lineObj);
+    // When directly calling `measureCharPrepared`, we have to adjust
+    // for the widgets at this line.
+    var widgetHeight$$1 = widgetTopHeight(lineObj);
+    var begin = 0, end = lineObj.text.length, ltr = true;
+
+    var order = getOrder(lineObj, cm.doc.direction);
+    // If the line isn't plain left-to-right text, first figure out
+    // which bidi section the coordinates fall into.
+    if (order) {
+      var part = (cm.options.lineWrapping ? coordsBidiPartWrapped : coordsBidiPart)
+                   (cm, lineObj, lineNo$$1, preparedMeasure, order, x, y);
+      ltr = part.level != 1;
+      // The awkward -1 offsets are needed because findFirst (called
+      // on these below) will treat its first bound as inclusive,
+      // second as exclusive, but we want to actually address the
+      // characters in the part's range
+      begin = ltr ? part.from : part.to - 1;
+      end = ltr ? part.to : part.from - 1;
+    }
+
+    // A binary search to find the first character whose bounding box
+    // starts after the coordinates. If we run across any whose box wrap
+    // the coordinates, store that.
+    var chAround = null, boxAround = null;
+    var ch = findFirst(function (ch) {
+      var box = measureCharPrepared(cm, preparedMeasure, ch);
+      box.top += widgetHeight$$1; box.bottom += widgetHeight$$1;
+      if (!boxIsAfter(box, x, y, false)) { return false }
+      if (box.top <= y && box.left <= x) {
+        chAround = ch;
+        boxAround = box;
+      }
+      return true
+    }, begin, end);
+
+    var baseX, sticky, outside = false;
+    // If a box around the coordinates was found, use that
+    if (boxAround) {
+      // Distinguish coordinates nearer to the left or right side of the box
+      var atLeft = x - boxAround.left < boxAround.right - x, atStart = atLeft == ltr;
+      ch = chAround + (atStart ? 0 : 1);
+      sticky = atStart ? "after" : "before";
+      baseX = atLeft ? boxAround.left : boxAround.right;
+    } else {
+      // (Adjust for extended bound, if necessary.)
+      if (!ltr && (ch == end || ch == begin)) { ch++; }
+      // To determine which side to associate with, get the box to the
+      // left of the character and compare it's vertical position to the
+      // coordinates
+      sticky = ch == 0 ? "after" : ch == lineObj.text.length ? "before" :
+        (measureCharPrepared(cm, preparedMeasure, ch - (ltr ? 1 : 0)).bottom + widgetHeight$$1 <= y) == ltr ?
+        "after" : "before";
+      // Now get accurate coordinates for this place, in order to get a
+      // base X position
+      var coords = cursorCoords(cm, Pos(lineNo$$1, ch, sticky), "line", lineObj, preparedMeasure);
+      baseX = coords.left;
+      outside = y < coords.top ? -1 : y >= coords.bottom ? 1 : 0;
+    }
+
+    ch = skipExtendingChars(lineObj.text, ch, 1);
+    return PosWithInfo(lineNo$$1, ch, sticky, outside, x - baseX)
+  }
+
+  function coordsBidiPart(cm, lineObj, lineNo$$1, preparedMeasure, order, x, y) {
+    // Bidi parts are sorted left-to-right, and in a non-line-wrapping
+    // situation, we can take this ordering to correspond to the visual
+    // ordering. This finds the first part whose end is after the given
+    // coordinates.
+    var index = findFirst(function (i) {
+      var part = order[i], ltr = part.level != 1;
+      return boxIsAfter(cursorCoords(cm, Pos(lineNo$$1, ltr ? part.to : part.from, ltr ? "before" : "after"),
+                                     "line", lineObj, preparedMeasure), x, y, true)
+    }, 0, order.length - 1);
+    var part = order[index];
+    // If this isn't the first part, the part's start is also after
+    // the coordinates, and the coordinates aren't on the same line as
+    // that start, move one part back.
+    if (index > 0) {
+      var ltr = part.level != 1;
+      var start = cursorCoords(cm, Pos(lineNo$$1, ltr ? part.from : part.to, ltr ? "after" : "before"),
+                               "line", lineObj, preparedMeasure);
+      if (boxIsAfter(start, x, y, true) && start.top > y)
+        { part = order[index - 1]; }
+    }
+    return part
+  }
+
+  function coordsBidiPartWrapped(cm, lineObj, _lineNo, preparedMeasure, order, x, y) {
+    // In a wrapped line, rtl text on wrapping boundaries can do things
+    // that don't correspond to the ordering in our `order` array at
+    // all, so a binary search doesn't work, and we want to return a
+    // part that only spans one line so that the binary search in
+    // coordsCharInner is safe. As such, we first find the extent of the
+    // wrapped line, and then do a flat search in which we discard any
+    // spans that aren't on the line.
+    var ref = wrappedLineExtent(cm, lineObj, preparedMeasure, y);
+    var begin = ref.begin;
+    var end = ref.end;
+    if (/\s/.test(lineObj.text.charAt(end - 1))) { end--; }
+    var part = null, closestDist = null;
+    for (var i = 0; i < order.length; i++) {
+      var p = order[i];
+      if (p.from >= end || p.to <= begin) { continue }
+      var ltr = p.level != 1;
+      var endX = measureCharPrepared(cm, preparedMeasure, ltr ? Math.min(end, p.to) - 1 : Math.max(begin, p.from)).right;
+      // Weigh against spans ending before this, so that they are only
+      // picked if nothing ends after
+      var dist = endX < x ? x - endX + 1e9 : endX - x;
+      if (!part || closestDist > dist) {
+        part = p;
+        closestDist = dist;
+      }
+    }
+    if (!part) { part = order[order.length - 1]; }
+    // Clip the part to the wrapped line.
+    if (part.from < begin) { part = {from: begin, to: part.to, level: part.level}; }
+    if (part.to > end) { part = {from: part.from, to: end, level: part.level}; }
+    return part
+  }
+
+  var measureText;
+  // Compute the default text height.
+  function textHeight(display) {
+    if (display.cachedTextHeight != null) { return display.cachedTextHeight }
+    if (measureText == null) {
+      measureText = elt("pre", null, "CodeMirror-line-like");
+      // Measure a bunch of lines, for browsers that compute
+      // fractional heights.
+      for (var i = 0; i < 49; ++i) {
+        measureText.appendChild(document.createTextNode("x"));
+        measureText.appendChild(elt("br"));
+      }
+      measureText.appendChild(document.createTextNode("x"));
+    }
+    removeChildrenAndAdd(display.measure, measureText);
+    var height = measureText.offsetHeight / 50;
+    if (height > 3) { display.cachedTextHeight = height; }
+    removeChildren(display.measure);
+    return height || 1
+  }
+
+  // Compute the default character width.
+  function charWidth(display) {
+    if (display.cachedCharWidth != null) { return display.cachedCharWidth }
+    var anchor = elt("span", "xxxxxxxxxx");
+    var pre = elt("pre", [anchor], "CodeMirror-line-like");
+    removeChildrenAndAdd(display.measure, pre);
+    var rect = anchor.getBoundingClientRect(), width = (rect.right - rect.left) / 10;
+    if (width > 2) { display.cachedCharWidth = width; }
+    return width || 10
+  }
+
+  // Do a bulk-read of the DOM positions and sizes needed to draw the
+  // view, so that we don't interleave reading and writing to the DOM.
+  function getDimensions(cm) {
+    var d = cm.display, left = {}, width = {};
+    var gutterLeft = d.gutters.clientLeft;
+    for (var n = d.gutters.firstChild, i = 0; n; n = n.nextSibling, ++i) {
+      var id = cm.display.gutterSpecs[i].className;
+      left[id] = n.offsetLeft + n.clientLeft + gutterLeft;
+      width[id] = n.clientWidth;
+    }
+    return {fixedPos: compensateForHScroll(d),
+            gutterTotalWidth: d.gutters.offsetWidth,
+            gutterLeft: left,
+            gutterWidth: width,
+            wrapperWidth: d.wrapper.clientWidth}
+  }
+
+  // Computes display.scroller.scrollLeft + display.gutters.offsetWidth,
+  // but using getBoundingClientRect to get a sub-pixel-accurate
+  // result.
+  function compensateForHScroll(display) {
+    return display.scroller.getBoundingClientRect().left - display.sizer.getBoundingClientRect().left
+  }
+
+  // Returns a function that estimates the height of a line, to use as
+  // first approximation until the line becomes visible (and is thus
+  // properly measurable).
+  function estimateHeight(cm) {
+    var th = textHeight(cm.display), wrapping = cm.options.lineWrapping;
+    var perLine = wrapping && Math.max(5, cm.display.scroller.clientWidth / charWidth(cm.display) - 3);
+    return function (line) {
+      if (lineIsHidden(cm.doc, line)) { return 0 }
+
+      var widgetsHeight = 0;
+      if (line.widgets) { for (var i = 0; i < line.widgets.length; i++) {
+        if (line.widgets[i].height) { widgetsHeight += line.widgets[i].height; }
+      } }
+
+      if (wrapping)
+        { return widgetsHeight + (Math.ceil(line.text.length / perLine) || 1) * th }
+      else
+        { return widgetsHeight + th }
+    }
+  }
+
+  function estimateLineHeights(cm) {
+    var doc = cm.doc, est = estimateHeight(cm);
+    doc.iter(function (line) {
+      var estHeight = est(line);
+      if (estHeight != line.height) { updateLineHeight(line, estHeight); }
+    });
+  }
+
+  // Given a mouse event, find the corresponding position. If liberal
+  // is false, it checks whether a gutter or scrollbar was clicked,
+  // and returns null if it was. forRect is used by rectangular
+  // selections, and tries to estimate a character position even for
+  // coordinates beyond the right of the text.
+  function posFromMouse(cm, e, liberal, forRect) {
+    var display = cm.display;
+    if (!liberal && e_target(e).getAttribute("cm-not-content") == "true") { return null }
+
+    var x, y, space = display.lineSpace.getBoundingClientRect();
+    // Fails unpredictably on IE[67] when mouse is dragged around quickly.
+    try { x = e.clientX - space.left; y = e.clientY - space.top; }
+    catch (e) { return null }
+    var coords = coordsChar(cm, x, y), line;
+    if (forRect && coords.xRel == 1 && (line = getLine(cm.doc, coords.line).text).length == coords.ch) {
+      var colDiff = countColumn(line, line.length, cm.options.tabSize) - line.length;
+      coords = Pos(coords.line, Math.max(0, Math.round((x - paddingH(cm.display).left) / charWidth(cm.display)) - colDiff));
+    }
+    return coords
+  }
+
+  // Find the view element corresponding to a given line. Return null
+  // when the line isn't visible.
+  function findViewIndex(cm, n) {
+    if (n >= cm.display.viewTo) { return null }
+    n -= cm.display.viewFrom;
+    if (n < 0) { return null }
+    var view = cm.display.view;
+    for (var i = 0; i < view.length; i++) {
+      n -= view[i].size;
+      if (n < 0) { return i }
+    }
+  }
+
+  // Updates the display.view data structure for a given change to the
+  // document. From and to are in pre-change coordinates. Lendiff is
+  // the amount of lines added or subtracted by the change. This is
+  // used for changes that span multiple lines, or change the way
+  // lines are divided into visual lines. regLineChange (below)
+  // registers single-line changes.
+  function regChange(cm, from, to, lendiff) {
+    if (from == null) { from = cm.doc.first; }
+    if (to == null) { to = cm.doc.first + cm.doc.size; }
+    if (!lendiff) { lendiff = 0; }
+
+    var display = cm.display;
+    if (lendiff && to < display.viewTo &&
+        (display.updateLineNumbers == null || display.updateLineNumbers > from))
+      { display.updateLineNumbers = from; }
+
+    cm.curOp.viewChanged = true;
+
+    if (from >= display.viewTo) { // Change after
+      if (sawCollapsedSpans && visualLineNo(cm.doc, from) < display.viewTo)
+        { resetView(cm); }
+    } else if (to <= display.viewFrom) { // Change before
+      if (sawCollapsedSpans && visualLineEndNo(cm.doc, to + lendiff) > display.viewFrom) {
+        resetView(cm);
+      } else {
+        display.viewFrom += lendiff;
+        display.viewTo += lendiff;
+      }
+    } else if (from <= display.viewFrom && to >= display.viewTo) { // Full overlap
+      resetView(cm);
+    } else if (from <= display.viewFrom) { // Top overlap
+      var cut = viewCuttingPoint(cm, to, to + lendiff, 1);
+      if (cut) {
+        display.view = display.view.slice(cut.index);
+        display.viewFrom = cut.lineN;
+        display.viewTo += lendiff;
+      } else {
+        resetView(cm);
+      }
+    } else if (to >= display.viewTo) { // Bottom overlap
+      var cut$1 = viewCuttingPoint(cm, from, from, -1);
+      if (cut$1) {
+        display.view = display.view.slice(0, cut$1.index);
+        display.viewTo = cut$1.lineN;
+      } else {
+        resetView(cm);
+      }
+    } else { // Gap in the middle
+      var cutTop = viewCuttingPoint(cm, from, from, -1);
+      var cutBot = viewCuttingPoint(cm, to, to + lendiff, 1);
+      if (cutTop && cutBot) {
+        display.view = display.view.slice(0, cutTop.index)
+          .concat(buildViewArray(cm, cutTop.lineN, cutBot.lineN))
+          .concat(display.view.slice(cutBot.index));
+        display.viewTo += lendiff;
+      } else {
+        resetView(cm);
+      }
+    }
+
+    var ext = display.externalMeasured;
+    if (ext) {
+      if (to < ext.lineN)
+        { ext.lineN += lendiff; }
+      else if (from < ext.lineN + ext.size)
+        { display.externalMeasured = null; }
+    }
+  }
+
+  // Register a change to a single line. Type must be one of "text",
+  // "gutter", "class", "widget"
+  function regLineChange(cm, line, type) {
+    cm.curOp.viewChanged = true;
+    var display = cm.display, ext = cm.display.externalMeasured;
+    if (ext && line >= ext.lineN && line < ext.lineN + ext.size)
+      { display.externalMeasured = null; }
+
+    if (line < display.viewFrom || line >= display.viewTo) { return }
+    var lineView = display.view[findViewIndex(cm, line)];
+    if (lineView.node == null) { return }
+    var arr = lineView.changes || (lineView.changes = []);
+    if (indexOf(arr, type) == -1) { arr.push(type); }
+  }
+
+  // Clear the view.
+  function resetView(cm) {
+    cm.display.viewFrom = cm.display.viewTo = cm.doc.first;
+    cm.display.view = [];
+    cm.display.viewOffset = 0;
+  }
+
+  function viewCuttingPoint(cm, oldN, newN, dir) {
+    var index = findViewIndex(cm, oldN), diff, view = cm.display.view;
+    if (!sawCollapsedSpans || newN == cm.doc.first + cm.doc.size)
+      { return {index: index, lineN: newN} }
+    var n = cm.display.viewFrom;
+    for (var i = 0; i < index; i++)
+      { n += view[i].size; }
+    if (n != oldN) {
+      if (dir > 0) {
+        if (index == view.length - 1) { return null }
+        diff = (n + view[index].size) - oldN;
+        index++;
+      } else {
+        diff = n - oldN;
+      }
+      oldN += diff; newN += diff;
+    }
+    while (visualLineNo(cm.doc, newN) != newN) {
+      if (index == (dir < 0 ? 0 : view.length - 1)) { return null }
+      newN += dir * view[index - (dir < 0 ? 1 : 0)].size;
+      index += dir;
+    }
+    return {index: index, lineN: newN}
+  }
+
+  // Force the view to cover a given range, adding empty view element
+  // or clipping off existing ones as needed.
+  function adjustView(cm, from, to) {
+    var display = cm.display, view = display.view;
+    if (view.length == 0 || from >= display.viewTo || to <= display.viewFrom) {
+      display.view = buildViewArray(cm, from, to);
+      display.viewFrom = from;
+    } else {
+      if (display.viewFrom > from)
+        { display.view = buildViewArray(cm, from, display.viewFrom).concat(display.view); }
+      else if (display.viewFrom < from)
+        { display.view = display.view.slice(findViewIndex(cm, from)); }
+      display.viewFrom = from;
+      if (display.viewTo < to)
+        { display.view = display.view.concat(buildViewArray(cm, display.viewTo, to)); }
+      else if (display.viewTo > to)
+        { display.view = display.view.slice(0, findViewIndex(cm, to)); }
+    }
+    display.viewTo = to;
+  }
+
+  // Count the number of lines in the view whose DOM representation is
+  // out of date (or nonexistent).
+  function countDirtyView(cm) {
+    var view = cm.display.view, dirty = 0;
+    for (var i = 0; i < view.length; i++) {
+      var lineView = view[i];
+      if (!lineView.hidden && (!lineView.node || lineView.changes)) { ++dirty; }
+    }
+    return dirty
+  }
+
+  function updateSelection(cm) {
+    cm.display.input.showSelection(cm.display.input.prepareSelection());
+  }
+
+  function prepareSelection(cm, primary) {
+    if ( primary === void 0 ) primary = true;
+
+    var doc = cm.doc, result = {};
+    var curFragment = result.cursors = document.createDocumentFragment();
+    var selFragment = result.selection = document.createDocumentFragment();
+
+    for (var i = 0; i < doc.sel.ranges.length; i++) {
+      if (!primary && i == doc.sel.primIndex) { continue }
+      var range$$1 = doc.sel.ranges[i];
+      if (range$$1.from().line >= cm.display.viewTo || range$$1.to().line < cm.display.viewFrom) { continue }
+      var collapsed = range$$1.empty();
+      if (collapsed || cm.options.showCursorWhenSelecting)
+        { drawSelectionCursor(cm, range$$1.head, curFragment); }
+      if (!collapsed)
+        { drawSelectionRange(cm, range$$1, selFragment); }
+    }
+    return result
+  }
+
+  // Draws a cursor for the given range
+  function drawSelectionCursor(cm, head, output) {
+    var pos = cursorCoords(cm, head, "div", null, null, !cm.options.singleCursorHeightPerLine);
+
+    var cursor = output.appendChild(elt("div", "\u00a0", "CodeMirror-cursor"));
+    cursor.style.left = pos.left + "px";
+    cursor.style.top = pos.top + "px";
+    cursor.style.height = Math.max(0, pos.bottom - pos.top) * cm.options.cursorHeight + "px";
+
+    if (pos.other) {
+      // Secondary cursor, shown when on a 'jump' in bi-directional text
+      var otherCursor = output.appendChild(elt("div", "\u00a0", "CodeMirror-cursor CodeMirror-secondarycursor"));
+      otherCursor.style.display = "";
+      otherCursor.style.left = pos.other.left + "px";
+      otherCursor.style.top = pos.other.top + "px";
+      otherCursor.style.height = (pos.other.bottom - pos.other.top) * .85 + "px";
+    }
+  }
+
+  function cmpCoords(a, b) { return a.top - b.top || a.left - b.left }
+
+  // Draws the given range as a highlighted selection
+  function drawSelectionRange(cm, range$$1, output) {
+    var display = cm.display, doc = cm.doc;
+    var fragment = document.createDocumentFragment();
+    var padding = paddingH(cm.display), leftSide = padding.left;
+    var rightSide = Math.max(display.sizerWidth, displayWidth(cm) - display.sizer.offsetLeft) - padding.right;
+    var docLTR = doc.direction == "ltr";
+
+    function add(left, top, width, bottom) {
+      if (top < 0) { top = 0; }
+      top = Math.round(top);
+      bottom = Math.round(bottom);
+      fragment.appendChild(elt("div", null, "CodeMirror-selected", ("position: absolute; left: " + left + "px;\n                             top: " + top + "px; width: " + (width == null ? rightSide - left : width) + "px;\n                             height: " + (bottom - top) + "px")));
+    }
+
+    function drawForLine(line, fromArg, toArg) {
+      var lineObj = getLine(doc, line);
+      var lineLen = lineObj.text.length;
+      var start, end;
+      function coords(ch, bias) {
+        return charCoords(cm, Pos(line, ch), "div", lineObj, bias)
+      }
+
+      function wrapX(pos, dir, side) {
+        var extent = wrappedLineExtentChar(cm, lineObj, null, pos);
+        var prop = (dir == "ltr") == (side == "after") ? "left" : "right";
+        var ch = side == "after" ? extent.begin : extent.end - (/\s/.test(lineObj.text.charAt(extent.end - 1)) ? 2 : 1);
+        return coords(ch, prop)[prop]
+      }
+
+      var order = getOrder(lineObj, doc.direction);
+      iterateBidiSections(order, fromArg || 0, toArg == null ? lineLen : toArg, function (from, to, dir, i) {
+        var ltr = dir == "ltr";
+        var fromPos = coords(from, ltr ? "left" : "right");
+        var toPos = coords(to - 1, ltr ? "right" : "left");
+
+        var openStart = fromArg == null && from == 0, openEnd = toArg == null && to == lineLen;
+        var first = i == 0, last = !order || i == order.length - 1;
+        if (toPos.top - fromPos.top <= 3) { // Single line
+          var openLeft = (docLTR ? openStart : openEnd) && first;
+          var openRight = (docLTR ? openEnd : openStart) && last;
+          var left = openLeft ? leftSide : (ltr ? fromPos : toPos).left;
+          var right = openRight ? rightSide : (ltr ? toPos : fromPos).right;
+          add(left, fromPos.top, right - left, fromPos.bottom);
+        } else { // Multiple lines
+          var topLeft, topRight, botLeft, botRight;
+          if (ltr) {
+            topLeft = docLTR && openStart && first ? leftSide : fromPos.left;
+            topRight = docLTR ? rightSide : wrapX(from, dir, "before");
+            botLeft = docLTR ? leftSide : wrapX(to, dir, "after");
+            botRight = docLTR && openEnd && last ? rightSide : toPos.right;
+          } else {
+            topLeft = !docLTR ? leftSide : wrapX(from, dir, "before");
+            topRight = !docLTR && openStart && first ? rightSide : fromPos.right;
+            botLeft = !docLTR && openEnd && last ? leftSide : toPos.left;
+            botRight = !docLTR ? rightSide : wrapX(to, dir, "after");
+          }
+          add(topLeft, fromPos.top, topRight - topLeft, fromPos.bottom);
+          if (fromPos.bottom < toPos.top) { add(leftSide, fromPos.bottom, null, toPos.top); }
+          add(botLeft, toPos.top, botRight - botLeft, toPos.bottom);
+        }
+
+        if (!start || cmpCoords(fromPos, start) < 0) { start = fromPos; }
+        if (cmpCoords(toPos, start) < 0) { start = toPos; }
+        if (!end || cmpCoords(fromPos, end) < 0) { end = fromPos; }
+        if (cmpCoords(toPos, end) < 0) { end = toPos; }
+      });
+      return {start: start, end: end}
+    }
+
+    var sFrom = range$$1.from(), sTo = range$$1.to();
+    if (sFrom.line == sTo.line) {
+      drawForLine(sFrom.line, sFrom.ch, sTo.ch);
+    } else {
+      var fromLine = getLine(doc, sFrom.line), toLine = getLine(doc, sTo.line);
+      var singleVLine = visualLine(fromLine) == visualLine(toLine);
+      var leftEnd = drawForLine(sFrom.line, sFrom.ch, singleVLine ? fromLine.text.length + 1 : null).end;
+      var rightStart = drawForLine(sTo.line, singleVLine ? 0 : null, sTo.ch).start;
+      if (singleVLine) {
+        if (leftEnd.top < rightStart.top - 2) {
+          add(leftEnd.right, leftEnd.top, null, leftEnd.bottom);
+          add(leftSide, rightStart.top, rightStart.left, rightStart.bottom);
+        } else {
+          add(leftEnd.right, leftEnd.top, rightStart.left - leftEnd.right, leftEnd.bottom);
+        }
+      }
+      if (leftEnd.bottom < rightStart.top)
+        { add(leftSide, leftEnd.bottom, null, rightStart.top); }
+    }
+
+    output.appendChild(fragment);
+  }
+
+  // Cursor-blinking
+  function restartBlink(cm) {
+    if (!cm.state.focused) { return }
+    var display = cm.display;
+    clearInterval(display.blinker);
+    var on = true;
+    display.cursorDiv.style.visibility = "";
+    if (cm.options.cursorBlinkRate > 0)
+      { display.blinker = setInterval(function () { return display.cursorDiv.style.visibility = (on = !on) ? "" : "hidden"; },
+        cm.options.cursorBlinkRate); }
+    else if (cm.options.cursorBlinkRate < 0)
+      { display.cursorDiv.style.visibility = "hidden"; }
+  }
+
+  function ensureFocus(cm) {
+    if (!cm.state.focused) { cm.display.input.focus(); onFocus(cm); }
+  }
+
+  function delayBlurEvent(cm) {
+    cm.state.delayingBlurEvent = true;
+    setTimeout(function () { if (cm.state.delayingBlurEvent) {
+      cm.state.delayingBlurEvent = false;
+      onBlur(cm);
+    } }, 100);
+  }
+
+  function onFocus(cm, e) {
+    if (cm.state.delayingBlurEvent) { cm.state.delayingBlurEvent = false; }
+
+    if (cm.options.readOnly == "nocursor") { return }
+    if (!cm.state.focused) {
+      signal(cm, "focus", cm, e);
+      cm.state.focused = true;
+      addClass(cm.display.wrapper, "CodeMirror-focused");
+      // This test prevents this from firing when a context
+      // menu is closed (since the input reset would kill the
+      // select-all detection hack)
+      if (!cm.curOp && cm.display.selForContextMenu != cm.doc.sel) {
+        cm.display.input.reset();
+        if (webkit) { setTimeout(function () { return cm.display.input.reset(true); }, 20); } // Issue #1730
+      }
+      cm.display.input.receivedFocus();
+    }
+    restartBlink(cm);
+  }
+  function onBlur(cm, e) {
+    if (cm.state.delayingBlurEvent) { return }
+
+    if (cm.state.focused) {
+      signal(cm, "blur", cm, e);
+      cm.state.focused = false;
+      rmClass(cm.display.wrapper, "CodeMirror-focused");
+    }
+    clearInterval(cm.display.blinker);
+    setTimeout(function () { if (!cm.state.focused) { cm.display.shift = false; } }, 150);
+  }
+
+  // Read the actual heights of the rendered lines, and update their
+  // stored heights to match.
+  function updateHeightsInViewport(cm) {
+    var display = cm.display;
+    var prevBottom = display.lineDiv.offsetTop;
+    for (var i = 0; i < display.view.length; i++) {
+      var cur = display.view[i], wrapping = cm.options.lineWrapping;
+      var height = (void 0), width = 0;
+      if (cur.hidden) { continue }
+      if (ie && ie_version < 8) {
+        var bot = cur.node.offsetTop + cur.node.offsetHeight;
+        height = bot - prevBottom;
+        prevBottom = bot;
+      } else {
+        var box = cur.node.getBoundingClientRect();
+        height = box.bottom - box.top;
+        // Check that lines don't extend past the right of the current
+        // editor width
+        if (!wrapping && cur.text.firstChild)
+          { width = cur.text.firstChild.getBoundingClientRect().right - box.left - 1; }
+      }
+      var diff = cur.line.height - height;
+      if (diff > .005 || diff < -.005) {
+        updateLineHeight(cur.line, height);
+        updateWidgetHeight(cur.line);
+        if (cur.rest) { for (var j = 0; j < cur.rest.length; j++)
+          { updateWidgetHeight(cur.rest[j]); } }
+      }
+      if (width > cm.display.sizerWidth) {
+        var chWidth = Math.ceil(width / charWidth(cm.display));
+        if (chWidth > cm.display.maxLineLength) {
+          cm.display.maxLineLength = chWidth;
+          cm.display.maxLine = cur.line;
+          cm.display.maxLineChanged = true;
+        }
+      }
+    }
+  }
+
+  // Read and store the height of line widgets associated with the
+  // given line.
+  function updateWidgetHeight(line) {
+    if (line.widgets) { for (var i = 0; i < line.widgets.length; ++i) {
+      var w = line.widgets[i], parent = w.node.parentNode;
+      if (parent) { w.height = parent.offsetHeight; }
+    } }
+  }
+
+  // Compute the lines that are visible in a given viewport (defaults
+  // the the current scroll position). viewport may contain top,
+  // height, and ensure (see op.scrollToPos) properties.
+  function visibleLines(display, doc, viewport) {
+    var top = viewport && viewport.top != null ? Math.max(0, viewport.top) : display.scroller.scrollTop;
+    top = Math.floor(top - paddingTop(display));
+    var bottom = viewport && viewport.bottom != null ? viewport.bottom : top + display.wrapper.clientHeight;
+
+    var from = lineAtHeight(doc, top), to = lineAtHeight(doc, bottom);
+    // Ensure is a {from: {line, ch}, to: {line, ch}} object, and
+    // forces those lines into the viewport (if possible).
+    if (viewport && viewport.ensure) {
+      var ensureFrom = viewport.ensure.from.line, ensureTo = viewport.ensure.to.line;
+      if (ensureFrom < from) {
+        from = ensureFrom;
+        to = lineAtHeight(doc, heightAtLine(getLine(doc, ensureFrom)) + display.wrapper.clientHeight);
+      } else if (Math.min(ensureTo, doc.lastLine()) >= to) {
+        from = lineAtHeight(doc, heightAtLine(getLine(doc, ensureTo)) - display.wrapper.clientHeight);
+        to = ensureTo;
+      }
+    }
+    return {from: from, to: Math.max(to, from + 1)}
+  }
+
+  // SCROLLING THINGS INTO VIEW
+
+  // If an editor sits on the top or bottom of the window, partially
+  // scrolled out of view, this ensures that the cursor is visible.
+  function maybeScrollWindow(cm, rect) {
+    if (signalDOMEvent(cm, "scrollCursorIntoView")) { return }
+
+    var display = cm.display, box = display.sizer.getBoundingClientRect(), doScroll = null;
+    if (rect.top + box.top < 0) { doScroll = true; }
+    else if (rect.bottom + box.top > (window.innerHeight || document.documentElement.clientHeight)) { doScroll = false; }
+    if (doScroll != null && !phantom) {
+      var scrollNode = elt("div", "\u200b", null, ("position: absolute;\n                         top: " + (rect.top - display.viewOffset - paddingTop(cm.display)) + "px;\n                         height: " + (rect.bottom - rect.top + scrollGap(cm) + display.barHeight) + "px;\n                         left: " + (rect.left) + "px; width: " + (Math.max(2, rect.right - rect.left)) + "px;"));
+      cm.display.lineSpace.appendChild(scrollNode);
+      scrollNode.scrollIntoView(doScroll);
+      cm.display.lineSpace.removeChild(scrollNode);
+    }
+  }
+
+  // Scroll a given position into view (immediately), verifying that
+  // it actually became visible (as line heights are accurately
+  // measured, the position of something may 'drift' during drawing).
+  function scrollPosIntoView(cm, pos, end, margin) {
+    if (margin == null) { margin = 0; }
+    var rect;
+    if (!cm.options.lineWrapping && pos == end) {
+      // Set pos and end to the cursor positions around the character pos sticks to
+      // If pos.sticky == "before", that is around pos.ch - 1, otherwise around pos.ch
+      // If pos == Pos(_, 0, "before"), pos and end are unchanged
+      pos = pos.ch ? Pos(pos.line, pos.sticky == "before" ? pos.ch - 1 : pos.ch, "after") : pos;
+      end = pos.sticky == "before" ? Pos(pos.line, pos.ch + 1, "before") : pos;
+    }
+    for (var limit = 0; limit < 5; limit++) {
+      var changed = false;
+      var coords = cursorCoords(cm, pos);
+      var endCoords = !end || end == pos ? coords : cursorCoords(cm, end);
+      rect = {left: Math.min(coords.left, endCoords.left),
+              top: Math.min(coords.top, endCoords.top) - margin,
+              right: Math.max(coords.left, endCoords.left),
+              bottom: Math.max(coords.bottom, endCoords.bottom) + margin};
+      var scrollPos = calculateScrollPos(cm, rect);
+      var startTop = cm.doc.scrollTop, startLeft = cm.doc.scrollLeft;
+      if (scrollPos.scrollTop != null) {
+        updateScrollTop(cm, scrollPos.scrollTop);
+        if (Math.abs(cm.doc.scrollTop - startTop) > 1) { changed = true; }
+      }
+      if (scrollPos.scrollLeft != null) {
+        setScrollLeft(cm, scrollPos.scrollLeft);
+        if (Math.abs(cm.doc.scrollLeft - startLeft) > 1) { changed = true; }
+      }
+      if (!changed) { break }
+    }
+    return rect
+  }
+
+  // Scroll a given set of coordinates into view (immediately).
+  function scrollIntoView(cm, rect) {
+    var scrollPos = calculateScrollPos(cm, rect);
+    if (scrollPos.scrollTop != null) { updateScrollTop(cm, scrollPos.scrollTop); }
+    if (scrollPos.scrollLeft != null) { setScrollLeft(cm, scrollPos.scrollLeft); }
+  }
+
+  // Calculate a new scroll position needed to scroll the given
+  // rectangle into view. Returns an object with scrollTop and
+  // scrollLeft properties. When these are undefined, the
+  // vertical/horizontal position does not need to be adjusted.
+  function calculateScrollPos(cm, rect) {
+    var display = cm.display, snapMargin = textHeight(cm.display);
+    if (rect.top < 0) { rect.top = 0; }
+    var screentop = cm.curOp && cm.curOp.scrollTop != null ? cm.curOp.scrollTop : display.scroller.scrollTop;
+    var screen = displayHeight(cm), result = {};
+    if (rect.bottom - rect.top > screen) { rect.bottom = rect.top + screen; }
+    var docBottom = cm.doc.height + paddingVert(display);
+    var atTop = rect.top < snapMargin, atBottom = rect.bottom > docBottom - snapMargin;
+    if (rect.top < screentop) {
+      result.scrollTop = atTop ? 0 : rect.top;
+    } else if (rect.bottom > screentop + screen) {
+      var newTop = Math.min(rect.top, (atBottom ? docBottom : rect.bottom) - screen);
+      if (newTop != screentop) { result.scrollTop = newTop; }
+    }
+
+    var screenleft = cm.curOp && cm.curOp.scrollLeft != null ? cm.curOp.scrollLeft : display.scroller.scrollLeft;
+    var screenw = displayWidth(cm) - (cm.options.fixedGutter ? display.gutters.offsetWidth : 0);
+    var tooWide = rect.right - rect.left > screenw;
+    if (tooWide) { rect.right = rect.left + screenw; }
+    if (rect.left < 10)
+      { result.scrollLeft = 0; }
+    else if (rect.left < screenleft)
+      { result.scrollLeft = Math.max(0, rect.left - (tooWide ? 0 : 10)); }
+    else if (rect.right > screenw + screenleft - 3)
+      { result.scrollLeft = rect.right + (tooWide ? 0 : 10) - screenw; }
+    return result
+  }
+
+  // Store a relative adjustment to the scroll position in the current
+  // operation (to be applied when the operation finishes).
+  function addToScrollTop(cm, top) {
+    if (top == null) { return }
+    resolveScrollToPos(cm);
+    cm.curOp.scrollTop = (cm.curOp.scrollTop == null ? cm.doc.scrollTop : cm.curOp.scrollTop) + top;
+  }
+
+  // Make sure that at the end of the operation the current cursor is
+  // shown.
+  function ensureCursorVisible(cm) {
+    resolveScrollToPos(cm);
+    var cur = cm.getCursor();
+    cm.curOp.scrollToPos = {from: cur, to: cur, margin: cm.options.cursorScrollMargin};
+  }
+
+  function scrollToCoords(cm, x, y) {
+    if (x != null || y != null) { resolveScrollToPos(cm); }
+    if (x != null) { cm.curOp.scrollLeft = x; }
+    if (y != null) { cm.curOp.scrollTop = y; }
+  }
+
+  function scrollToRange(cm, range$$1) {
+    resolveScrollToPos(cm);
+    cm.curOp.scrollToPos = range$$1;
+  }
+
+  // When an operation has its scrollToPos property set, and another
+  // scroll action is applied before the end of the operation, this
+  // 'simulates' scrolling that position into view in a cheap way, so
+  // that the effect of intermediate scroll commands is not ignored.
+  function resolveScrollToPos(cm) {
+    var range$$1 = cm.curOp.scrollToPos;
+    if (range$$1) {
+      cm.curOp.scrollToPos = null;
+      var from = estimateCoords(cm, range$$1.from), to = estimateCoords(cm, range$$1.to);
+      scrollToCoordsRange(cm, from, to, range$$1.margin);
+    }
+  }
+
+  function scrollToCoordsRange(cm, from, to, margin) {
+    var sPos = calculateScrollPos(cm, {
+      left: Math.min(from.left, to.left),
+      top: Math.min(from.top, to.top) - margin,
+      right: Math.max(from.right, to.right),
+      bottom: Math.max(from.bottom, to.bottom) + margin
+    });
+    scrollToCoords(cm, sPos.scrollLeft, sPos.scrollTop);
+  }
+
+  // Sync the scrollable area and scrollbars, ensure the viewport
+  // covers the visible area.
+  function updateScrollTop(cm, val) {
+    if (Math.abs(cm.doc.scrollTop - val) < 2) { return }
+    if (!gecko) { updateDisplaySimple(cm, {top: val}); }
+    setScrollTop(cm, val, true);
+    if (gecko) { updateDisplaySimple(cm); }
+    startWorker(cm, 100);
+  }
+
+  function setScrollTop(cm, val, forceScroll) {
+    val = Math.min(cm.display.scroller.scrollHeight - cm.display.scroller.clientHeight, val);
+    if (cm.display.scroller.scrollTop == val && !forceScroll) { return }
+    cm.doc.scrollTop = val;
+    cm.display.scrollbars.setScrollTop(val);
+    if (cm.display.scroller.scrollTop != val) { cm.display.scroller.scrollTop = val; }
+  }
+
+  // Sync scroller and scrollbar, ensure the gutter elements are
+  // aligned.
+  function setScrollLeft(cm, val, isScroller, forceScroll) {
+    val = Math.min(val, cm.display.scroller.scrollWidth - cm.display.scroller.clientWidth);
+    if ((isScroller ? val == cm.doc.scrollLeft : Math.abs(cm.doc.scrollLeft - val) < 2) && !forceScroll) { return }
+    cm.doc.scrollLeft = val;
+    alignHorizontally(cm);
+    if (cm.display.scroller.scrollLeft != val) { cm.display.scroller.scrollLeft = val; }
+    cm.display.scrollbars.setScrollLeft(val);
+  }
+
+  // SCROLLBARS
+
+  // Prepare DOM reads needed to update the scrollbars. Done in one
+  // shot to minimize update/measure roundtrips.
+  function measureForScrollbars(cm) {
+    var d = cm.display, gutterW = d.gutters.offsetWidth;
+    var docH = Math.round(cm.doc.height + paddingVert(cm.display));
+    return {
+      clientHeight: d.scroller.clientHeight,
+      viewHeight: d.wrapper.clientHeight,
+      scrollWidth: d.scroller.scrollWidth, clientWidth: d.scroller.clientWidth,
+      viewWidth: d.wrapper.clientWidth,
+      barLeft: cm.options.fixedGutter ? gutterW : 0,
+      docHeight: docH,
+      scrollHeight: docH + scrollGap(cm) + d.barHeight,
+      nativeBarWidth: d.nativeBarWidth,
+      gutterWidth: gutterW
+    }
+  }
+
+  var NativeScrollbars = function(place, scroll, cm) {
+    this.cm = cm;
+    var vert = this.vert = elt("div", [elt("div", null, null, "min-width: 1px")], "CodeMirror-vscrollbar");
+    var horiz = this.horiz = elt("div", [elt("div", null, null, "height: 100%; min-height: 1px")], "CodeMirror-hscrollbar");
+    vert.tabIndex = horiz.tabIndex = -1;
+    place(vert); place(horiz);
+
+    on(vert, "scroll", function () {
+      if (vert.clientHeight) { scroll(vert.scrollTop, "vertical"); }
+    });
+    on(horiz, "scroll", function () {
+      if (horiz.clientWidth) { scroll(horiz.scrollLeft, "horizontal"); }
+    });
+
+    this.checkedZeroWidth = false;
+    // Need to set a minimum width to see the scrollbar on IE7 (but must not set it on IE8).
+    if (ie && ie_version < 8) { this.horiz.style.minHeight = this.vert.style.minWidth = "18px"; }
+  };
+
+  NativeScrollbars.prototype.update = function (measure) {
+    var needsH = measure.scrollWidth > measure.clientWidth + 1;
+    var needsV = measure.scrollHeight > measure.clientHeight + 1;
+    var sWidth = measure.nativeBarWidth;
+
+    if (needsV) {
+      this.vert.style.display = "block";
+      this.vert.style.bottom = needsH ? sWidth + "px" : "0";
+      var totalHeight = measure.viewHeight - (needsH ? sWidth : 0);
+      // A bug in IE8 can cause this value to be negative, so guard it.
+      this.vert.firstChild.style.height =
+        Math.max(0, measure.scrollHeight - measure.clientHeight + totalHeight) + "px";
+    } else {
+      this.vert.style.display = "";
+      this.vert.firstChild.style.height = "0";
+    }
+
+    if (needsH) {
+      this.horiz.style.display = "block";
+      this.horiz.style.right = needsV ? sWidth + "px" : "0";
+      this.horiz.style.left = measure.barLeft + "px";
+      var totalWidth = measure.viewWidth - measure.barLeft - (needsV ? sWidth : 0);
+      this.horiz.firstChild.style.width =
+        Math.max(0, measure.scrollWidth - measure.clientWidth + totalWidth) + "px";
+    } else {
+      this.horiz.style.display = "";
+      this.horiz.firstChild.style.width = "0";
+    }
+
+    if (!this.checkedZeroWidth && measure.clientHeight > 0) {
+      if (sWidth == 0) { this.zeroWidthHack(); }
+      this.checkedZeroWidth = true;
+    }
+
+    return {right: needsV ? sWidth : 0, bottom: needsH ? sWidth : 0}
+  };
+
+  NativeScrollbars.prototype.setScrollLeft = function (pos) {
+    if (this.horiz.scrollLeft != pos) { this.horiz.scrollLeft = pos; }
+    if (this.disableHoriz) { this.enableZeroWidthBar(this.horiz, this.disableHoriz, "horiz"); }
+  };
+
+  NativeScrollbars.prototype.setScrollTop = function (pos) {
+    if (this.vert.scrollTop != pos) { this.vert.scrollTop = pos; }
+    if (this.disableVert) { this.enableZeroWidthBar(this.vert, this.disableVert, "vert"); }
+  };
+
+  NativeScrollbars.prototype.zeroWidthHack = function () {
+    var w = mac && !mac_geMountainLion ? "12px" : "18px";
+    this.horiz.style.height = this.vert.style.width = w;
+    this.horiz.style.pointerEvents = this.vert.style.pointerEvents = "none";
+    this.disableHoriz = new Delayed;
+    this.disableVert = new Delayed;
+  };
+
+  NativeScrollbars.prototype.enableZeroWidthBar = function (bar, delay, type) {
+    bar.style.pointerEvents = "auto";
+    function maybeDisable() {
+      // To find out whether the scrollbar is still visible, we
+      // check whether the element under the pixel in the bottom
+      // right corner of the scrollbar box is the scrollbar box
+      // itself (when the bar is still visible) or its filler child
+      // (when the bar is hidden). If it is still visible, we keep
+      // it enabled, if it's hidden, we disable pointer events.
+      var box = bar.getBoundingClientRect();
+      var elt$$1 = type == "vert" ? document.elementFromPoint(box.right - 1, (box.top + box.bottom) / 2)
+          : document.elementFromPoint((box.right + box.left) / 2, box.bottom - 1);
+      if (elt$$1 != bar) { bar.style.pointerEvents = "none"; }
+      else { delay.set(1000, maybeDisable); }
+    }
+    delay.set(1000, maybeDisable);
+  };
+
+  NativeScrollbars.prototype.clear = function () {
+    var parent = this.horiz.parentNode;
+    parent.removeChild(this.horiz);
+    parent.removeChild(this.vert);
+  };
+
+  var NullScrollbars = function () {};
+
+  NullScrollbars.prototype.update = function () { return {bottom: 0, right: 0} };
+  NullScrollbars.prototype.setScrollLeft = function () {};
+  NullScrollbars.prototype.setScrollTop = function () {};
+  NullScrollbars.prototype.clear = function () {};
+
+  function updateScrollbars(cm, measure) {
+    if (!measure) { measure = measureForScrollbars(cm); }
+    var startWidth = cm.display.barWidth, startHeight = cm.display.barHeight;
+    updateScrollbarsInner(cm, measure);
+    for (var i = 0; i < 4 && startWidth != cm.display.barWidth || startHeight != cm.display.barHeight; i++) {
+      if (startWidth != cm.display.barWidth && cm.options.lineWrapping)
+        { updateHeightsInViewport(cm); }
+      updateScrollbarsInner(cm, measureForScrollbars(cm));
+      startWidth = cm.display.barWidth; startHeight = cm.display.barHeight;
+    }
+  }
+
+  // Re-synchronize the fake scrollbars with the actual size of the
+  // content.
+  function updateScrollbarsInner(cm, measure) {
+    var d = cm.display;
+    var sizes = d.scrollbars.update(measure);
+
+    d.sizer.style.paddingRight = (d.barWidth = sizes.right) + "px";
+    d.sizer.style.paddingBottom = (d.barHeight = sizes.bottom) + "px";
+    d.heightForcer.style.borderBottom = sizes.bottom + "px solid transparent";
+
+    if (sizes.right && sizes.bottom) {
+      d.scrollbarFiller.style.display = "block";
+      d.scrollbarFiller.style.height = sizes.bottom + "px";
+      d.scrollbarFiller.style.width = sizes.right + "px";
+    } else { d.scrollbarFiller.style.display = ""; }
+    if (sizes.bottom && cm.options.coverGutterNextToScrollbar && cm.options.fixedGutter) {
+      d.gutterFiller.style.display = "block";
+      d.gutterFiller.style.height = sizes.bottom + "px";
+      d.gutterFiller.style.width = measure.gutterWidth + "px";
+    } else { d.gutterFiller.style.display = ""; }
+  }
+
+  var scrollbarModel = {"native": NativeScrollbars, "null": NullScrollbars};
+
+  function initScrollbars(cm) {
+    if (cm.display.scrollbars) {
+      cm.display.scrollbars.clear();
+      if (cm.display.scrollbars.addClass)
+        { rmClass(cm.display.wrapper, cm.display.scrollbars.addClass); }
+    }
+
+    cm.display.scrollbars = new scrollbarModel[cm.options.scrollbarStyle](function (node) {
+      cm.display.wrapper.insertBefore(node, cm.display.scrollbarFiller);
+      // Prevent clicks in the scrollbars from killing focus
+      on(node, "mousedown", function () {
+        if (cm.state.focused) { setTimeout(function () { return cm.display.input.focus(); }, 0); }
+      });
+      node.setAttribute("cm-not-content", "true");
+    }, function (pos, axis) {
+      if (axis == "horizontal") { setScrollLeft(cm, pos); }
+      else { updateScrollTop(cm, pos); }
+    }, cm);
+    if (cm.display.scrollbars.addClass)
+      { addClass(cm.display.wrapper, cm.display.scrollbars.addClass); }
+  }
+
+  // Operations are used to wrap a series of changes to the editor
+  // state in such a way that each change won't have to update the
+  // cursor and display (which would be awkward, slow, and
+  // error-prone). Instead, display updates are batched and then all
+  // combined and executed at once.
+
+  var nextOpId = 0;
+  // Start a new operation.
+  function startOperation(cm) {
+    cm.curOp = {
+      cm: cm,
+      viewChanged: false,      // Flag that indicates that lines might need to be redrawn
+      startHeight: cm.doc.height, // Used to detect need to update scrollbar
+      forceUpdate: false,      // Used to force a redraw
+      updateInput: 0,       // Whether to reset the input textarea
+      typing: false,           // Whether this reset should be careful to leave existing text (for compositing)
+      changeObjs: null,        // Accumulated changes, for firing change events
+      cursorActivityHandlers: null, // Set of handlers to fire cursorActivity on
+      cursorActivityCalled: 0, // Tracks which cursorActivity handlers have been called already
+      selectionChanged: false, // Whether the selection needs to be redrawn
+      updateMaxLine: false,    // Set when the widest line needs to be determined anew
+      scrollLeft: null, scrollTop: null, // Intermediate scroll position, not pushed to DOM yet
+      scrollToPos: null,       // Used to scroll to a specific position
+      focus: false,
+      id: ++nextOpId           // Unique ID
+    };
+    pushOperation(cm.curOp);
+  }
+
+  // Finish an operation, updating the display and signalling delayed events
+  function endOperation(cm) {
+    var op = cm.curOp;
+    if (op) { finishOperation(op, function (group) {
+      for (var i = 0; i < group.ops.length; i++)
+        { group.ops[i].cm.curOp = null; }
+      endOperations(group);
+    }); }
+  }
+
+  // The DOM updates done when an operation finishes are batched so
+  // that the minimum number of relayouts are required.
+  function endOperations(group) {
+    var ops = group.ops;
+    for (var i = 0; i < ops.length; i++) // Read DOM
+      { endOperation_R1(ops[i]); }
+    for (var i$1 = 0; i$1 < ops.length; i$1++) // Write DOM (maybe)
+      { endOperation_W1(ops[i$1]); }
+    for (var i$2 = 0; i$2 < ops.length; i$2++) // Read DOM
+      { endOperation_R2(ops[i$2]); }
+    for (var i$3 = 0; i$3 < ops.length; i$3++) // Write DOM (maybe)
+      { endOperation_W2(ops[i$3]); }
+    for (var i$4 = 0; i$4 < ops.length; i$4++) // Read DOM
+      { endOperation_finish(ops[i$4]); }
+  }
+
+  function endOperation_R1(op) {
+    var cm = op.cm, display = cm.display;
+    maybeClipScrollbars(cm);
+    if (op.updateMaxLine) { findMaxLine(cm); }
+
+    op.mustUpdate = op.viewChanged || op.forceUpdate || op.scrollTop != null ||
+      op.scrollToPos && (op.scrollToPos.from.line < display.viewFrom ||
+                         op.scrollToPos.to.line >= display.viewTo) ||
+      display.maxLineChanged && cm.options.lineWrapping;
+    op.update = op.mustUpdate &&
+      new DisplayUpdate(cm, op.mustUpdate && {top: op.scrollTop, ensure: op.scrollToPos}, op.forceUpdate);
+  }
+
+  function endOperation_W1(op) {
+    op.updatedDisplay = op.mustUpdate && updateDisplayIfNeeded(op.cm, op.update);
+  }
+
+  function endOperation_R2(op) {
+    var cm = op.cm, display = cm.display;
+    if (op.updatedDisplay) { updateHeightsInViewport(cm); }
+
+    op.barMeasure = measureForScrollbars(cm);
+
+    // If the max line changed since it was last measured, measure it,
+    // and ensure the document's width matches it.
+    // updateDisplay_W2 will use these properties to do the actual resizing
+    if (display.maxLineChanged && !cm.options.lineWrapping) {
+      op.adjustWidthTo = measureChar(cm, display.maxLine, display.maxLine.text.length).left + 3;
+      cm.display.sizerWidth = op.adjustWidthTo;
+      op.barMeasure.scrollWidth =
+        Math.max(display.scroller.clientWidth, display.sizer.offsetLeft + op.adjustWidthTo + scrollGap(cm) + cm.display.barWidth);
+      op.maxScrollLeft = Math.max(0, display.sizer.offsetLeft + op.adjustWidthTo - displayWidth(cm));
+    }
+
+    if (op.updatedDisplay || op.selectionChanged)
+      { op.preparedSelection = display.input.prepareSelection(); }
+  }
+
+  function endOperation_W2(op) {
+    var cm = op.cm;
+
+    if (op.adjustWidthTo != null) {
+      cm.display.sizer.style.minWidth = op.adjustWidthTo + "px";
+      if (op.maxScrollLeft < cm.doc.scrollLeft)
+        { setScrollLeft(cm, Math.min(cm.display.scroller.scrollLeft, op.maxScrollLeft), true); }
+      cm.display.maxLineChanged = false;
+    }
+
+    var takeFocus = op.focus && op.focus == activeElt();
+    if (op.preparedSelection)
+      { cm.display.input.showSelection(op.preparedSelection, takeFocus); }
+    if (op.updatedDisplay || op.startHeight != cm.doc.height)
+      { updateScrollbars(cm, op.barMeasure); }
+    if (op.updatedDisplay)
+      { setDocumentHeight(cm, op.barMeasure); }
+
+    if (op.selectionChanged) { restartBlink(cm); }
+
+    if (cm.state.focused && op.updateInput)
+      { cm.display.input.reset(op.typing); }
+    if (takeFocus) { ensureFocus(op.cm); }
+  }
+
+  function endOperation_finish(op) {
+    var cm = op.cm, display = cm.display, doc = cm.doc;
+
+    if (op.updatedDisplay) { postUpdateDisplay(cm, op.update); }
+
+    // Abort mouse wheel delta measurement, when scrolling explicitly
+    if (display.wheelStartX != null && (op.scrollTop != null || op.scrollLeft != null || op.scrollToPos))
+      { display.wheelStartX = display.wheelStartY = null; }
+
+    // Propagate the scroll position to the actual DOM scroller
+    if (op.scrollTop != null) { setScrollTop(cm, op.scrollTop, op.forceScroll); }
+
+    if (op.scrollLeft != null) { setScrollLeft(cm, op.scrollLeft, true, true); }
+    // If we need to scroll a specific position into view, do so.
+    if (op.scrollToPos) {
+      var rect = scrollPosIntoView(cm, clipPos(doc, op.scrollToPos.from),
+                                   clipPos(doc, op.scrollToPos.to), op.scrollToPos.margin);
+      maybeScrollWindow(cm, rect);
+    }
+
+    // Fire events for markers that are hidden/unidden by editing or
+    // undoing
+    var hidden = op.maybeHiddenMarkers, unhidden = op.maybeUnhiddenMarkers;
+    if (hidden) { for (var i = 0; i < hidden.length; ++i)
+      { if (!hidden[i].lines.length) { signal(hidden[i], "hide"); } } }
+    if (unhidden) { for (var i$1 = 0; i$1 < unhidden.length; ++i$1)
+      { if (unhidden[i$1].lines.length) { signal(unhidden[i$1], "unhide"); } } }
+
+    if (display.wrapper.offsetHeight)
+      { doc.scrollTop = cm.display.scroller.scrollTop; }
+
+    // Fire change events, and delayed event handlers
+    if (op.changeObjs)
+      { signal(cm, "changes", cm, op.changeObjs); }
+    if (op.update)
+      { op.update.finish(); }
+  }
+
+  // Run the given function in an operation
+  function runInOp(cm, f) {
+    if (cm.curOp) { return f() }
+    startOperation(cm);
+    try { return f() }
+    finally { endOperation(cm); }
+  }
+  // Wraps a function in an operation. Returns the wrapped function.
+  function operation(cm, f) {
+    return function() {
+      if (cm.curOp) { return f.apply(cm, arguments) }
+      startOperation(cm);
+      try { return f.apply(cm, arguments) }
+      finally { endOperation(cm); }
+    }
+  }
+  // Used to add methods to editor and doc instances, wrapping them in
+  // operations.
+  function methodOp(f) {
+    return function() {
+      if (this.curOp) { return f.apply(this, arguments) }
+      startOperation(this);
+      try { return f.apply(this, arguments) }
+      finally { endOperation(this); }
+    }
+  }
+  function docMethodOp(f) {
+    return function() {
+      var cm = this.cm;
+      if (!cm || cm.curOp) { return f.apply(this, arguments) }
+      startOperation(cm);
+      try { return f.apply(this, arguments) }
+      finally { endOperation(cm); }
+    }
+  }
+
+  // HIGHLIGHT WORKER
+
+  function startWorker(cm, time) {
+    if (cm.doc.highlightFrontier < cm.display.viewTo)
+      { cm.state.highlight.set(time, bind(highlightWorker, cm)); }
+  }
+
+  function highlightWorker(cm) {
+    var doc = cm.doc;
+    if (doc.highlightFrontier >= cm.display.viewTo) { return }
+    var end = +new Date + cm.options.workTime;
+    var context = getContextBefore(cm, doc.highlightFrontier);
+    var changedLines = [];
+
+    doc.iter(context.line, Math.min(doc.first + doc.size, cm.display.viewTo + 500), function (line) {
+      if (context.line >= cm.display.viewFrom) { // Visible
+        var oldStyles = line.styles;
+        var resetState = line.text.length > cm.options.maxHighlightLength ? copyState(doc.mode, context.state) : null;
+        var highlighted = highlightLine(cm, line, context, true);
+        if (resetState) { context.state = resetState; }
+        line.styles = highlighted.styles;
+        var oldCls = line.styleClasses, newCls = highlighted.classes;
+        if (newCls) { line.styleClasses = newCls; }
+        else if (oldCls) { line.styleClasses = null; }
+        var ischange = !oldStyles || oldStyles.length != line.styles.length ||
+          oldCls != newCls && (!oldCls || !newCls || oldCls.bgClass != newCls.bgClass || oldCls.textClass != newCls.textClass);
+        for (var i = 0; !ischange && i < oldStyles.length; ++i) { ischange = oldStyles[i] != line.styles[i]; }
+        if (ischange) { changedLines.push(context.line); }
+        line.stateAfter = context.save();
+        context.nextLine();
+      } else {
+        if (line.text.length <= cm.options.maxHighlightLength)
+          { processLine(cm, line.text, context); }
+        line.stateAfter = context.line % 5 == 0 ? context.save() : null;
+        context.nextLine();
+      }
+      if (+new Date > end) {
+        startWorker(cm, cm.options.workDelay);
+        return true
+      }
+    });
+    doc.highlightFrontier = context.line;
+    doc.modeFrontier = Math.max(doc.modeFrontier, context.line);
+    if (changedLines.length) { runInOp(cm, function () {
+      for (var i = 0; i < changedLines.length; i++)
+        { regLineChange(cm, changedLines[i], "text"); }
+    }); }
+  }
+
+  // DISPLAY DRAWING
+
+  var DisplayUpdate = function(cm, viewport, force) {
+    var display = cm.display;
+
+    this.viewport = viewport;
+    // Store some values that we'll need later (but don't want to force a relayout for)
+    this.visible = visibleLines(display, cm.doc, viewport);
+    this.editorIsHidden = !display.wrapper.offsetWidth;
+    this.wrapperHeight = display.wrapper.clientHeight;
+    this.wrapperWidth = display.wrapper.clientWidth;
+    this.oldDisplayWidth = displayWidth(cm);
+    this.force = force;
+    this.dims = getDimensions(cm);
+    this.events = [];
+  };
+
+  DisplayUpdate.prototype.signal = function (emitter, type) {
+    if (hasHandler(emitter, type))
+      { this.events.push(arguments); }
+  };
+  DisplayUpdate.prototype.finish = function () {
+      var this$1 = this;
+
+    for (var i = 0; i < this.events.length; i++)
+      { signal.apply(null, this$1.events[i]); }
+  };
+
+  function maybeClipScrollbars(cm) {
+    var display = cm.display;
+    if (!display.scrollbarsClipped && display.scroller.offsetWidth) {
+      display.nativeBarWidth = display.scroller.offsetWidth - display.scroller.clientWidth;
+      display.heightForcer.style.height = scrollGap(cm) + "px";
+      display.sizer.style.marginBottom = -display.nativeBarWidth + "px";
+      display.sizer.style.borderRightWidth = scrollGap(cm) + "px";
+      display.scrollbarsClipped = true;
+    }
+  }
+
+  function selectionSnapshot(cm) {
+    if (cm.hasFocus()) { return null }
+    var active = activeElt();
+    if (!active || !contains(cm.display.lineDiv, active)) { return null }
+    var result = {activeElt: active};
+    if (window.getSelection) {
+      var sel = window.getSelection();
+      if (sel.anchorNode && sel.extend && contains(cm.display.lineDiv, sel.anchorNode)) {
+        result.anchorNode = sel.anchorNode;
+        result.anchorOffset = sel.anchorOffset;
+        result.focusNode = sel.focusNode;
+        result.focusOffset = sel.focusOffset;
+      }
+    }
+    return result
+  }
+
+  function restoreSelection(snapshot) {
+    if (!snapshot || !snapshot.activeElt || snapshot.activeElt == activeElt()) { return }
+    snapshot.activeElt.focus();
+    if (snapshot.anchorNode && contains(document.body, snapshot.anchorNode) && contains(document.body, snapshot.focusNode)) {
+      var sel = window.getSelection(), range$$1 = document.createRange();
+      range$$1.setEnd(snapshot.anchorNode, snapshot.anchorOffset);
+      range$$1.collapse(false);
+      sel.removeAllRanges();
+      sel.addRange(range$$1);
+      sel.extend(snapshot.focusNode, snapshot.focusOffset);
+    }
+  }
+
+  // Does the actual updating of the line display. Bails out
+  // (returning false) when there is nothing to be done and forced is
+  // false.
+  function updateDisplayIfNeeded(cm, update) {
+    var display = cm.display, doc = cm.doc;
+
+    if (update.editorIsHidden) {
+      resetView(cm);
+      return false
+    }
+
+    // Bail out if the visible area is already rendered and nothing changed.
+    if (!update.force &&
+        update.visible.from >= display.viewFrom && update.visible.to <= display.viewTo &&
+        (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo) &&
+        display.renderedView == display.view && countDirtyView(cm) == 0)
+      { return false }
+
+    if (maybeUpdateLineNumberWidth(cm)) {
+      resetView(cm);
+      update.dims = getDimensions(cm);
+    }
+
+    // Compute a suitable new viewport (from & to)
+    var end = doc.first + doc.size;
+    var from = Math.max(update.visible.from - cm.options.viewportMargin, doc.first);
+    var to = Math.min(end, update.visible.to + cm.options.viewportMargin);
+    if (display.viewFrom < from && from - display.viewFrom < 20) { from = Math.max(doc.first, display.viewFrom); }
+    if (display.viewTo > to && display.viewTo - to < 20) { to = Math.min(end, display.viewTo); }
+    if (sawCollapsedSpans) {
+      from = visualLineNo(cm.doc, from);
+      to = visualLineEndNo(cm.doc, to);
+    }
+
+    var different = from != display.viewFrom || to != display.viewTo ||
+      display.lastWrapHeight != update.wrapperHeight || display.lastWrapWidth != update.wrapperWidth;
+    adjustView(cm, from, to);
+
+    display.viewOffset = heightAtLine(getLine(cm.doc, display.viewFrom));
+    // Position the mover div to align with the current scroll position
+    cm.display.mover.style.top = display.viewOffset + "px";
+
+    var toUpdate = countDirtyView(cm);
+    if (!different && toUpdate == 0 && !update.force && display.renderedView == display.view &&
+        (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo))
+      { return false }
+
+    // For big changes, we hide the enclosing element during the
+    // update, since that speeds up the operations on most browsers.
+    var selSnapshot = selectionSnapshot(cm);
+    if (toUpdate > 4) { display.lineDiv.style.display = "none"; }
+    patchDisplay(cm, display.updateLineNumbers, update.dims);
+    if (toUpdate > 4) { display.lineDiv.style.display = ""; }
+    display.renderedView = display.view;
+    // There might have been a widget with a focused element that got
+    // hidden or updated, if so re-focus it.
+    restoreSelection(selSnapshot);
+
+    // Prevent selection and cursors from interfering with the scroll
+    // width and height.
+    removeChildren(display.cursorDiv);
+    removeChildren(display.selectionDiv);
+    display.gutters.style.height = display.sizer.style.minHeight = 0;
+
+    if (different) {
+      display.lastWrapHeight = update.wrapperHeight;
+      display.lastWrapWidth = update.wrapperWidth;
+      startWorker(cm, 400);
+    }
+
+    display.updateLineNumbers = null;
+
+    return true
+  }
+
+  function postUpdateDisplay(cm, update) {
+    var viewport = update.viewport;
+
+    for (var first = true;; first = false) {
+      if (!first || !cm.options.lineWrapping || update.oldDisplayWidth == displayWidth(cm)) {
+        // Clip forced viewport to actual scrollable area.
+        if (viewport && viewport.top != null)
+          { viewport = {top: Math.min(cm.doc.height + paddingVert(cm.display) - displayHeight(cm), viewport.top)}; }
+        // Updated line heights might result in the drawn area not
+        // actually covering the viewport. Keep looping until it does.
+        update.visible = visibleLines(cm.display, cm.doc, viewport);
+        if (update.visible.from >= cm.display.viewFrom && update.visible.to <= cm.display.viewTo)
+          { break }
+      }
+      if (!updateDisplayIfNeeded(cm, update)) { break }
+      updateHeightsInViewport(cm);
+      var barMeasure = measureForScrollbars(cm);
+      updateSelection(cm);
+      updateScrollbars(cm, barMeasure);
+      setDocumentHeight(cm, barMeasure);
+      update.force = false;
+    }
+
+    update.signal(cm, "update", cm);
+    if (cm.display.viewFrom != cm.display.reportedViewFrom || cm.display.viewTo != cm.display.reportedViewTo) {
+      update.signal(cm, "viewportChange", cm, cm.display.viewFrom, cm.display.viewTo);
+      cm.display.reportedViewFrom = cm.display.viewFrom; cm.display.reportedViewTo = cm.display.viewTo;
+    }
+  }
+
+  function updateDisplaySimple(cm, viewport) {
+    var update = new DisplayUpdate(cm, viewport);
+    if (updateDisplayIfNeeded(cm, update)) {
+      updateHeightsInViewport(cm);
+      postUpdateDisplay(cm, update);
+      var barMeasure = measureForScrollbars(cm);
+      updateSelection(cm);
+      updateScrollbars(cm, barMeasure);
+      setDocumentHeight(cm, barMeasure);
+      update.finish();
+    }
+  }
+
+  // Sync the actual display DOM structure with display.view, removing
+  // nodes for lines that are no longer in view, and creating the ones
+  // that are not there yet, and updating the ones that are out of
+  // date.
+  function patchDisplay(cm, updateNumbersFrom, dims) {
+    var display = cm.display, lineNumbers = cm.options.lineNumbers;
+    var container = display.lineDiv, cur = container.firstChild;
+
+    function rm(node) {
+      var next = node.nextSibling;
+      // Works around a throw-scroll bug in OS X Webkit
+      if (webkit && mac && cm.display.currentWheelTarget == node)
+        { node.style.display = "none"; }
+      else
+        { node.parentNode.removeChild(node); }
+      return next
+    }
+
+    var view = display.view, lineN = display.viewFrom;
+    // Loop over the elements in the view, syncing cur (the DOM nodes
+    // in display.lineDiv) with the view as we go.
+    for (var i = 0; i < view.length; i++) {
+      var lineView = view[i];
+      if (lineView.hidden) ; else if (!lineView.node || lineView.node.parentNode != container) { // Not drawn yet
+        var node = buildLineElement(cm, lineView, lineN, dims);
+        container.insertBefore(node, cur);
+      } else { // Already drawn
+        while (cur != lineView.node) { cur = rm(cur); }
+        var updateNumber = lineNumbers && updateNumbersFrom != null &&
+          updateNumbersFrom <= lineN && lineView.lineNumber;
+        if (lineView.changes) {
+          if (indexOf(lineView.changes, "gutter") > -1) { updateNumber = false; }
+          updateLineForChanges(cm, lineView, lineN, dims);
+        }
+        if (updateNumber) {
+          removeChildren(lineView.lineNumber);
+          lineView.lineNumber.appendChild(document.createTextNode(lineNumberFor(cm.options, lineN)));
+        }
+        cur = lineView.node.nextSibling;
+      }
+      lineN += lineView.size;
+    }
+    while (cur) { cur = rm(cur); }
+  }
+
+  function updateGutterSpace(display) {
+    var width = display.gutters.offsetWidth;
+    display.sizer.style.marginLeft = width + "px";
+  }
+
+  function setDocumentHeight(cm, measure) {
+    cm.display.sizer.style.minHeight = measure.docHeight + "px";
+    cm.display.heightForcer.style.top = measure.docHeight + "px";
+    cm.display.gutters.style.height = (measure.docHeight + cm.display.barHeight + scrollGap(cm)) + "px";
+  }
+
+  // Re-align line numbers and gutter marks to compensate for
+  // horizontal scrolling.
+  function alignHorizontally(cm) {
+    var display = cm.display, view = display.view;
+    if (!display.alignWidgets && (!display.gutters.firstChild || !cm.options.fixedGutter)) { return }
+    var comp = compensateForHScroll(display) - display.scroller.scrollLeft + cm.doc.scrollLeft;
+    var gutterW = display.gutters.offsetWidth, left = comp + "px";
+    for (var i = 0; i < view.length; i++) { if (!view[i].hidden) {
+      if (cm.options.fixedGutter) {
+        if (view[i].gutter)
+          { view[i].gutter.style.left = left; }
+        if (view[i].gutterBackground)
+          { view[i].gutterBackground.style.left = left; }
+      }
+      var align = view[i].alignable;
+      if (align) { for (var j = 0; j < align.length; j++)
+        { align[j].style.left = left; } }
+    } }
+    if (cm.options.fixedGutter)
+      { display.gutters.style.left = (comp + gutterW) + "px"; }
+  }
+
+  // Used to ensure that the line number gutter is still the right
+  // size for the current document size. Returns true when an update
+  // is needed.
+  function maybeUpdateLineNumberWidth(cm) {
+    if (!cm.options.lineNumbers) { return false }
+    var doc = cm.doc, last = lineNumberFor(cm.options, doc.first + doc.size - 1), display = cm.display;
+    if (last.length != display.lineNumChars) {
+      var test = display.measure.appendChild(elt("div", [elt("div", last)],
+                                                 "CodeMirror-linenumber CodeMirror-gutter-elt"));
+      var innerW = test.firstChild.offsetWidth, padding = test.offsetWidth - innerW;
+      display.lineGutter.style.width = "";
+      display.lineNumInnerWidth = Math.max(innerW, display.lineGutter.offsetWidth - padding) + 1;
+      display.lineNumWidth = display.lineNumInnerWidth + padding;
+      display.lineNumChars = display.lineNumInnerWidth ? last.length : -1;
+      display.lineGutter.style.width = display.lineNumWidth + "px";
+      updateGutterSpace(cm.display);
+      return true
+    }
+    return false
+  }
+
+  function getGutters(gutters, lineNumbers) {
+    var result = [], sawLineNumbers = false;
+    for (var i = 0; i < gutters.length; i++) {
+      var name = gutters[i], style = null;
+      if (typeof name != "string") { style = name.style; name = name.className; }
+      if (name == "CodeMirror-linenumbers") {
+        if (!lineNumbers) { continue }
+        else { sawLineNumbers = true; }
+      }
+      result.push({className: name, style: style});
+    }
+    if (lineNumbers && !sawLineNumbers) { result.push({className: "CodeMirror-linenumbers", style: null}); }
+    return result
+  }
+
+  // Rebuild the gutter elements, ensure the margin to the left of the
+  // code matches their width.
+  function renderGutters(display) {
+    var gutters = display.gutters, specs = display.gutterSpecs;
+    removeChildren(gutters);
+    display.lineGutter = null;
+    for (var i = 0; i < specs.length; ++i) {
+      var ref = specs[i];
+      var className = ref.className;
+      var style = ref.style;
+      var gElt = gutters.appendChild(elt("div", null, "CodeMirror-gutter " + className));
+      if (style) { gElt.style.cssText = style; }
+      if (className == "CodeMirror-linenumbers") {
+        display.lineGutter = gElt;
+        gElt.style.width = (display.lineNumWidth || 1) + "px";
+      }
+    }
+    gutters.style.display = specs.length ? "" : "none";
+    updateGutterSpace(display);
+  }
+
+  function updateGutters(cm) {
+    renderGutters(cm.display);
+    regChange(cm);
+    alignHorizontally(cm);
+  }
+
+  // The display handles the DOM integration, both for input reading
+  // and content drawing. It holds references to DOM nodes and
+  // display-related state.
+
+  function Display(place, doc, input, options) {
+    var d = this;
+    this.input = input;
+
+    // Covers bottom-right square when both scrollbars are present.
+    d.scrollbarFiller = elt("div", null, "CodeMirror-scrollbar-filler");
+    d.scrollbarFiller.setAttribute("cm-not-content", "true");
+    // Covers bottom of gutter when coverGutterNextToScrollbar is on
+    // and h scrollbar is present.
+    d.gutterFiller = elt("div", null, "CodeMirror-gutter-filler");
+    d.gutterFiller.setAttribute("cm-not-content", "true");
+    // Will contain the actual code, positioned to cover the viewport.
+    d.lineDiv = eltP("div", null, "CodeMirror-code");
+    // Elements are added to these to represent selection and cursors.
+    d.selectionDiv = elt("div", null, null, "position: relative; z-index: 1");
+    d.cursorDiv = elt("div", null, "CodeMirror-cursors");
+    // A visibility: hidden element used to find the size of things.
+    d.measure = elt("div", null, "CodeMirror-measure");
+    // When lines outside of the viewport are measured, they are drawn in this.
+    d.lineMeasure = elt("div", null, "CodeMirror-measure");
+    // Wraps everything that needs to exist inside the vertically-padded coordinate system
+    d.lineSpace = eltP("div", [d.measure, d.lineMeasure, d.selectionDiv, d.cursorDiv, d.lineDiv],
+                      null, "position: relative; outline: none");
+    var lines = eltP("div", [d.lineSpace], "CodeMirror-lines");
+    // Moved around its parent to cover visible view.
+    d.mover = elt("div", [lines], null, "position: relative");
+    // Set to the height of the document, allowing scrolling.
+    d.sizer = elt("div", [d.mover], "CodeMirror-sizer");
+    d.sizerWidth = null;
+    // Behavior of elts with overflow: auto and padding is
+    // inconsistent across browsers. This is used to ensure the
+    // scrollable area is big enough.
+    d.heightForcer = elt("div", null, null, "position: absolute; height: " + scrollerGap + "px; width: 1px;");
+    // Will contain the gutters, if any.
+    d.gutters = elt("div", null, "CodeMirror-gutters");
+    d.lineGutter = null;
+    // Actual scrollable element.
+    d.scroller = elt("div", [d.sizer, d.heightForcer, d.gutters], "CodeMirror-scroll");
+    d.scroller.setAttribute("tabIndex", "-1");
+    // The element in which the editor live_links.
+    d.wrapper = elt("div", [d.scrollbarFiller, d.gutterFiller, d.scroller], "CodeMirror");
+
+    // Work around IE7 z-index bug (not perfect, hence IE7 not really being supported)
+    if (ie && ie_version < 8) { d.gutters.style.zIndex = -1; d.scroller.style.paddingRight = 0; }
+    if (!webkit && !(gecko && mobile)) { d.scroller.draggable = true; }
+
+    if (place) {
+      if (place.appendChild) { place.appendChild(d.wrapper); }
+      else { place(d.wrapper); }
+    }
+
+    // Current rendered range (may be bigger than the view window).
+    d.viewFrom = d.viewTo = doc.first;
+    d.reportedViewFrom = d.reportedViewTo = doc.first;
+    // Information about the rendered lines.
+    d.view = [];
+    d.renderedView = null;
+    // Holds info about a single rendered line when it was rendered
+    // for measurement, while not in view.
+    d.externalMeasured = null;
+    // Empty space (in pixels) above the view
+    d.viewOffset = 0;
+    d.lastWrapHeight = d.lastWrapWidth = 0;
+    d.updateLineNumbers = null;
+
+    d.nativeBarWidth = d.barHeight = d.barWidth = 0;
+    d.scrollbarsClipped = false;
+
+    // Used to only resize the line number gutter when necessary (when
+    // the amount of lines crosses a boundary that makes its width change)
+    d.lineNumWidth = d.lineNumInnerWidth = d.lineNumChars = null;
+    // Set to true when a non-horizontal-scrolling line widget is
+    // added. As an optimization, line widget aligning is skipped when
+    // this is false.
+    d.alignWidgets = false;
+
+    d.cachedCharWidth = d.cachedTextHeight = d.cachedPaddingH = null;
+
+    // Tracks the maximum line length so that the horizontal scrollbar
+    // can be kept static when scrolling.
+    d.maxLine = null;
+    d.maxLineLength = 0;
+    d.maxLineChanged = false;
+
+    // Used for measuring wheel scrolling granularity
+    d.wheelDX = d.wheelDY = d.wheelStartX = d.wheelStartY = null;
+
+    // True when shift is held down.
+    d.shift = false;
+
+    // Used to track whether anything happened since the context menu
+    // was opened.
+    d.selForContextMenu = null;
+
+    d.activeTouch = null;
+
+    d.gutterSpecs = getGutters(options.gutters, options.lineNumbers);
+    renderGutters(d);
+
+    input.init(d);
+  }
+
+  // Since the delta values reported on mouse wheel events are
+  // unstandardized between browsers and even browser versions, and
+  // generally horribly unpredictable, this code starts by measuring
+  // the scroll effect that the first few mouse wheel events have,
+  // and, from that, detects the way it can convert deltas to pixel
+  // offsets afterwards.
+  //
+  // The reason we want to know the amount a wheel event will scroll
+  // is that it gives us a chance to update the display before the
+  // actual scrolling happens, reducing flickering.
+
+  var wheelSamples = 0, wheelPixelsPerUnit = null;
+  // Fill in a browser-detected starting value on browsers where we
+  // know one. These don't have to be accurate -- the result of them
+  // being wrong would just be a slight flicker on the first wheel
+  // scroll (if it is large enough).
+  if (ie) { wheelPixelsPerUnit = -.53; }
+  else if (gecko) { wheelPixelsPerUnit = 15; }
+  else if (chrome) { wheelPixelsPerUnit = -.7; }
+  else if (safari) { wheelPixelsPerUnit = -1/3; }
+
+  function wheelEventDelta(e) {
+    var dx = e.wheelDeltaX, dy = e.wheelDeltaY;
+    if (dx == null && e.detail && e.axis == e.HORIZONTAL_AXIS) { dx = e.detail; }
+    if (dy == null && e.detail && e.axis == e.VERTICAL_AXIS) { dy = e.detail; }
+    else if (dy == null) { dy = e.wheelDelta; }
+    return {x: dx, y: dy}
+  }
+  function wheelEventPixels(e) {
+    var delta = wheelEventDelta(e);
+    delta.x *= wheelPixelsPerUnit;
+    delta.y *= wheelPixelsPerUnit;
+    return delta
+  }
+
+  function onScrollWheel(cm, e) {
+    var delta = wheelEventDelta(e), dx = delta.x, dy = delta.y;
+
+    var display = cm.display, scroll = display.scroller;
+    // Quit if there's nothing to scroll here
+    var canScrollX = scroll.scrollWidth > scroll.clientWidth;
+    var canScrollY = scroll.scrollHeight > scroll.clientHeight;
+    if (!(dx && canScrollX || dy && canScrollY)) { return }
+
+    // Webkit browsers on OS X abort momentum scrolls when the target
+    // of the scroll event is removed from the scrollable element.
+    // This hack (see related code in patchDisplay) makes sure the
+    // element is kept around.
+    if (dy && mac && webkit) {
+      outer: for (var cur = e.target, view = display.view; cur != scroll; cur = cur.parentNode) {
+        for (var i = 0; i < view.length; i++) {
+          if (view[i].node == cur) {
+            cm.display.currentWheelTarget = cur;
+            break outer
+          }
+        }
+      }
+    }
+
+    // On some browsers, horizontal scrolling will cause redraws to
+    // happen before the gutter has been realigned, causing it to
+    // wriggle around in a most unseemly way. When we have an
+    // estimated pixels/delta value, we just handle horizontal
+    // scrolling entirely here. It'll be slightly off from native, but
+    // better than glitching out.
+    if (dx && !gecko && !presto && wheelPixelsPerUnit != null) {
+      if (dy && canScrollY)
+        { updateScrollTop(cm, Math.max(0, scroll.scrollTop + dy * wheelPixelsPerUnit)); }
+      setScrollLeft(cm, Math.max(0, scroll.scrollLeft + dx * wheelPixelsPerUnit));
+      // Only prevent default scrolling if vertical scrolling is
+      // actually possible. Otherwise, it causes vertical scroll
+      // jitter on OSX trackpads when deltaX is small and deltaY
+      // is large (issue #3579)
+      if (!dy || (dy && canScrollY))
+        { e_preventDefault(e); }
+      display.wheelStartX = null; // Abort measurement, if in progress
+      return
+    }
+
+    // 'Project' the visible viewport to cover the area that is being
+    // scrolled into view (if we know enough to estimate it).
+    if (dy && wheelPixelsPerUnit != null) {
+      var pixels = dy * wheelPixelsPerUnit;
+      var top = cm.doc.scrollTop, bot = top + display.wrapper.clientHeight;
+      if (pixels < 0) { top = Math.max(0, top + pixels - 50); }
+      else { bot = Math.min(cm.doc.height, bot + pixels + 50); }
+      updateDisplaySimple(cm, {top: top, bottom: bot});
+    }
+
+    if (wheelSamples < 20) {
+      if (display.wheelStartX == null) {
+        display.wheelStartX = scroll.scrollLeft; display.wheelStartY = scroll.scrollTop;
+        display.wheelDX = dx; display.wheelDY = dy;
+        setTimeout(function () {
+          if (display.wheelStartX == null) { return }
+          var movedX = scroll.scrollLeft - display.wheelStartX;
+          var movedY = scroll.scrollTop - display.wheelStartY;
+          var sample = (movedY && display.wheelDY && movedY / display.wheelDY) ||
+            (movedX && display.wheelDX && movedX / display.wheelDX);
+          display.wheelStartX = display.wheelStartY = null;
+          if (!sample) { return }
+          wheelPixelsPerUnit = (wheelPixelsPerUnit * wheelSamples + sample) / (wheelSamples + 1);
+          ++wheelSamples;
+        }, 200);
+      } else {
+        display.wheelDX += dx; display.wheelDY += dy;
+      }
+    }
+  }
+
+  // Selection objects are immutable. A new one is created every time
+  // the selection changes. A selection is one or more non-overlapping
+  // (and non-touching) ranges, sorted, and an integer that indicates
+  // which one is the primary selection (the one that's scrolled into
+  // view, that getCursor returns, etc).
+  var Selection = function(ranges, primIndex) {
+    this.ranges = ranges;
+    this.primIndex = primIndex;
+  };
+
+  Selection.prototype.primary = function () { return this.ranges[this.primIndex] };
+
+  Selection.prototype.equals = function (other) {
+      var this$1 = this;
+
+    if (other == this) { return true }
+    if (other.primIndex != this.primIndex || other.ranges.length != this.ranges.length) { return false }
+    for (var i = 0; i < this.ranges.length; i++) {
+      var here = this$1.ranges[i], there = other.ranges[i];
+      if (!equalCursorPos(here.anchor, there.anchor) || !equalCursorPos(here.head, there.head)) { return false }
+    }
+    return true
+  };
+
+  Selection.prototype.deepCopy = function () {
+      var this$1 = this;
+
+    var out = [];
+    for (var i = 0; i < this.ranges.length; i++)
+      { out[i] = new Range(copyPos(this$1.ranges[i].anchor), copyPos(this$1.ranges[i].head)); }
+    return new Selection(out, this.primIndex)
+  };
+
+  Selection.prototype.somethingSelected = function () {
+      var this$1 = this;
+
+    for (var i = 0; i < this.ranges.length; i++)
+      { if (!this$1.ranges[i].empty()) { return true } }
+    return false
+  };
+
+  Selection.prototype.contains = function (pos, end) {
+      var this$1 = this;
+
+    if (!end) { end = pos; }
+    for (var i = 0; i < this.ranges.length; i++) {
+      var range = this$1.ranges[i];
+      if (cmp(end, range.from()) >= 0 && cmp(pos, range.to()) <= 0)
+        { return i }
+    }
+    return -1
+  };
+
+  var Range = function(anchor, head) {
+    this.anchor = anchor; this.head = head;
+  };
+
+  Range.prototype.from = function () { return minPos(this.anchor, this.head) };
+  Range.prototype.to = function () { return maxPos(this.anchor, this.head) };
+  Range.prototype.empty = function () { return this.head.line == this.anchor.line && this.head.ch == this.anchor.ch };
+
+  // Take an unsorted, potentially overlapping set of ranges, and
+  // build a selection out of it. 'Consumes' ranges array (modifying
+  // it).
+  function normalizeSelection(cm, ranges, primIndex) {
+    var mayTouch = cm && cm.options.selectionsMayTouch;
+    var prim = ranges[primIndex];
+    ranges.sort(function (a, b) { return cmp(a.from(), b.from()); });
+    primIndex = indexOf(ranges, prim);
+    for (var i = 1; i < ranges.length; i++) {
+      var cur = ranges[i], prev = ranges[i - 1];
+      var diff = cmp(prev.to(), cur.from());
+      if (mayTouch && !cur.empty() ? diff > 0 : diff >= 0) {
+        var from = minPos(prev.from(), cur.from()), to = maxPos(prev.to(), cur.to());
+        var inv = prev.empty() ? cur.from() == cur.head : prev.from() == prev.head;
+        if (i <= primIndex) { --primIndex; }
+        ranges.splice(--i, 2, new Range(inv ? to : from, inv ? from : to));
+      }
+    }
+    return new Selection(ranges, primIndex)
+  }
+
+  function simpleSelection(anchor, head) {
+    return new Selection([new Range(anchor, head || anchor)], 0)
+  }
+
+  // Compute the position of the end of a change (its 'to' property
+  // refers to the pre-change end).
+  function changeEnd(change) {
+    if (!change.text) { return change.to }
+    return Pos(change.from.line + change.text.length - 1,
+               lst(change.text).length + (change.text.length == 1 ? change.from.ch : 0))
+  }
+
+  // Adjust a position to refer to the post-change position of the
+  // same text, or the end of the change if the change covers it.
+  function adjustForChange(pos, change) {
+    if (cmp(pos, change.from) < 0) { return pos }
+    if (cmp(pos, change.to) <= 0) { return changeEnd(change) }
+
+    var line = pos.line + change.text.length - (change.to.line - change.from.line) - 1, ch = pos.ch;
+    if (pos.line == change.to.line) { ch += changeEnd(change).ch - change.to.ch; }
+    return Pos(line, ch)
+  }
+
+  function computeSelAfterChange(doc, change) {
+    var out = [];
+    for (var i = 0; i < doc.sel.ranges.length; i++) {
+      var range = doc.sel.ranges[i];
+      out.push(new Range(adjustForChange(range.anchor, change),
+                         adjustForChange(range.head, change)));
+    }
+    return normalizeSelection(doc.cm, out, doc.sel.primIndex)
+  }
+
+  function offsetPos(pos, old, nw) {
+    if (pos.line == old.line)
+      { return Pos(nw.line, pos.ch - old.ch + nw.ch) }
+    else
+      { return Pos(nw.line + (pos.line - old.line), pos.ch) }
+  }
+
+  // Used by replaceSelections to allow moving the selection to the
+  // start or around the replaced test. Hint may be "start" or "around".
+  function computeReplacedSel(doc, changes, hint) {
+    var out = [];
+    var oldPrev = Pos(doc.first, 0), newPrev = oldPrev;
+    for (var i = 0; i < changes.length; i++) {
+      var change = changes[i];
+      var from = offsetPos(change.from, oldPrev, newPrev);
+      var to = offsetPos(changeEnd(change), oldPrev, newPrev);
+      oldPrev = change.to;
+      newPrev = to;
+      if (hint == "around") {
+        var range = doc.sel.ranges[i], inv = cmp(range.head, range.anchor) < 0;
+        out[i] = new Range(inv ? to : from, inv ? from : to);
+      } else {
+        out[i] = new Range(from, from);
+      }
+    }
+    return new Selection(out, doc.sel.primIndex)
+  }
+
+  // Used to get the editor into a consistent state again when options change.
+
+  function loadMode(cm) {
+    cm.doc.mode = getMode(cm.options, cm.doc.modeOption);
+    resetModeState(cm);
+  }
+
+  function resetModeState(cm) {
+    cm.doc.iter(function (line) {
+      if (line.stateAfter) { line.stateAfter = null; }
+      if (line.styles) { line.styles = null; }
+    });
+    cm.doc.modeFrontier = cm.doc.highlightFrontier = cm.doc.first;
+    startWorker(cm, 100);
+    cm.state.modeGen++;
+    if (cm.curOp) { regChange(cm); }
+  }
+
+  // DOCUMENT DATA STRUCTURE
+
+  // By default, updates that start and end at the beginning of a line
+  // are treated specially, in order to make the association of line
+  // widgets and marker elements with the text behave more intuitive.
+  function isWholeLineUpdate(doc, change) {
+    return change.from.ch == 0 && change.to.ch == 0 && lst(change.text) == "" &&
+      (!doc.cm || doc.cm.options.wholeLineUpdateBefore)
+  }
+
+  // Perform a change on the document data structure.
+  function updateDoc(doc, change, markedSpans, estimateHeight$$1) {
+    function spansFor(n) {return markedSpans ? markedSpans[n] : null}
+    function update(line, text, spans) {
+      updateLine(line, text, spans, estimateHeight$$1);
+      signalLater(line, "change", line, change);
+    }
+    function linesFor(start, end) {
+      var result = [];
+      for (var i = start; i < end; ++i)
+        { result.push(new Line(text[i], spansFor(i), estimateHeight$$1)); }
+      return result
+    }
+
+    var from = change.from, to = change.to, text = change.text;
+    var firstLine = getLine(doc, from.line), lastLine = getLine(doc, to.line);
+    var lastText = lst(text), lastSpans = spansFor(text.length - 1), nlines = to.line - from.line;
+
+    // Adjust the line structure
+    if (change.full) {
+      doc.insert(0, linesFor(0, text.length));
+      doc.remove(text.length, doc.size - text.length);
+    } else if (isWholeLineUpdate(doc, change)) {
+      // This is a whole-line replace. Treated specially to make
+      // sure line objects move the way they are supposed to.
+      var added = linesFor(0, text.length - 1);
+      update(lastLine, lastLine.text, lastSpans);
+      if (nlines) { doc.remove(from.line, nlines); }
+      if (added.length) { doc.insert(from.line, added); }
+    } else if (firstLine == lastLine) {
+      if (text.length == 1) {
+        update(firstLine, firstLine.text.slice(0, from.ch) + lastText + firstLine.text.slice(to.ch), lastSpans);
+      } else {
+        var added$1 = linesFor(1, text.length - 1);
+        added$1.push(new Line(lastText + firstLine.text.slice(to.ch), lastSpans, estimateHeight$$1));
+        update(firstLine, firstLine.text.slice(0, from.ch) + text[0], spansFor(0));
+        doc.insert(from.line + 1, added$1);
+      }
+    } else if (text.length == 1) {
+      update(firstLine, firstLine.text.slice(0, from.ch) + text[0] + lastLine.text.slice(to.ch), spansFor(0));
+      doc.remove(from.line + 1, nlines);
+    } else {
+      update(firstLine, firstLine.text.slice(0, from.ch) + text[0], spansFor(0));
+      update(lastLine, lastText + lastLine.text.slice(to.ch), lastSpans);
+      var added$2 = linesFor(1, text.length - 1);
+      if (nlines > 1) { doc.remove(from.line + 1, nlines - 1); }
+      doc.insert(from.line + 1, added$2);
+    }
+
+    signalLater(doc, "change", doc, change);
+  }
+
+  // Call f for all linked documents.
+  function linkedDocs(doc, f, sharedHistOnly) {
+    function propagate(doc, skip, sharedHist) {
+      if (doc.linked) { for (var i = 0; i < doc.linked.length; ++i) {
+        var rel = doc.linked[i];
+        if (rel.doc == skip) { continue }
+        var shared = sharedHist && rel.sharedHist;
+        if (sharedHistOnly && !shared) { continue }
+        f(rel.doc, shared);
+        propagate(rel.doc, doc, shared);
+      } }
+    }
+    propagate(doc, null, true);
+  }
+
+  // Attach a document to an editor.
+  function attachDoc(cm, doc) {
+    if (doc.cm) { throw new Error("This document is already in use.") }
+    cm.doc = doc;
+    doc.cm = cm;
+    estimateLineHeights(cm);
+    loadMode(cm);
+    setDirectionClass(cm);
+    if (!cm.options.lineWrapping) { findMaxLine(cm); }
+    cm.options.mode = doc.modeOption;
+    regChange(cm);
+  }
+
+  function setDirectionClass(cm) {
+  (cm.doc.direction == "rtl" ? addClass : rmClass)(cm.display.lineDiv, "CodeMirror-rtl");
+  }
+
+  function directionChanged(cm) {
+    runInOp(cm, function () {
+      setDirectionClass(cm);
+      regChange(cm);
+    });
+  }
+
+  function History(startGen) {
+    // Arrays of change events and selections. Doing something adds an
+    // event to done and clears undo. Undoing moves events from done
+    // to undone, redoing moves them in the other direction.
+    this.done = []; this.undone = [];
+    this.undoDepth = Infinity;
+    // Used to track when changes can be merged into a single undo
+    // event
+    this.lastModTime = this.lastSelTime = 0;
+    this.lastOp = this.lastSelOp = null;
+    this.lastOrigin = this.lastSelOrigin = null;
+    // Used by the isClean() method
+    this.generation = this.maxGeneration = startGen || 1;
+  }
+
+  // Create a history change event from an updateDoc-style change
+  // object.
+  function historyChangeFromChange(doc, change) {
+    var histChange = {from: copyPos(change.from), to: changeEnd(change), text: getBetween(doc, change.from, change.to)};
+    attachLocalSpans(doc, histChange, change.from.line, change.to.line + 1);
+    linkedDocs(doc, function (doc) { return attachLocalSpans(doc, histChange, change.from.line, change.to.line + 1); }, true);
+    return histChange
+  }
+
+  // Pop all selection events off the end of a history array. Stop at
+  // a change event.
+  function clearSelectionEvents(array) {
+    while (array.length) {
+      var last = lst(array);
+      if (last.ranges) { array.pop(); }
+      else { break }
+    }
+  }
+
+  // Find the top change event in the history. Pop off selection
+  // events that are in the way.
+  function lastChangeEvent(hist, force) {
+    if (force) {
+      clearSelectionEvents(hist.done);
+      return lst(hist.done)
+    } else if (hist.done.length && !lst(hist.done).ranges) {
+      return lst(hist.done)
+    } else if (hist.done.length > 1 && !hist.done[hist.done.length - 2].ranges) {
+      hist.done.pop();
+      return lst(hist.done)
+    }
+  }
+
+  // Register a change in the history. Merges changes that are within
+  // a single operation, or are close together with an origin that
+  // allows merging (starting with "+") into a single event.
+  function addChangeToHistory(doc, change, selAfter, opId) {
+    var hist = doc.history;
+    hist.undone.length = 0;
+    var time = +new Date, cur;
+    var last;
+
+    if ((hist.lastOp == opId ||
+         hist.lastOrigin == change.origin && change.origin &&
+         ((change.origin.charAt(0) == "+" && hist.lastModTime > time - (doc.cm ? doc.cm.options.historyEventDelay : 500)) ||
+          change.origin.charAt(0) == "*")) &&
+        (cur = lastChangeEvent(hist, hist.lastOp == opId))) {
+      // Merge this change into the last event
+      last = lst(cur.changes);
+      if (cmp(change.from, change.to) == 0 && cmp(change.from, last.to) == 0) {
+        // Optimized case for simple insertion -- don't want to add
+        // new changesets for every character typed
+        last.to = changeEnd(change);
+      } else {
+        // Add new sub-event
+        cur.changes.push(historyChangeFromChange(doc, change));
+      }
+    } else {
+      // Can not be merged, start a new event.
+      var before = lst(hist.done);
+      if (!before || !before.ranges)
+        { pushSelectionToHistory(doc.sel, hist.done); }
+      cur = {changes: [historyChangeFromChange(doc, change)],
+             generation: hist.generation};
+      hist.done.push(cur);
+      while (hist.done.length > hist.undoDepth) {
+        hist.done.shift();
+        if (!hist.done[0].ranges) { hist.done.shift(); }
+      }
+    }
+    hist.done.push(selAfter);
+    hist.generation = ++hist.maxGeneration;
+    hist.lastModTime = hist.lastSelTime = time;
+    hist.lastOp = hist.lastSelOp = opId;
+    hist.lastOrigin = hist.lastSelOrigin = change.origin;
+
+    if (!last) { signal(doc, "historyAdded"); }
+  }
+
+  function selectionEventCanBeMerged(doc, origin, prev, sel) {
+    var ch = origin.charAt(0);
+    return ch == "*" ||
+      ch == "+" &&
+      prev.ranges.length == sel.ranges.length &&
+      prev.somethingSelected() == sel.somethingSelected() &&
+      new Date - doc.history.lastSelTime <= (doc.cm ? doc.cm.options.historyEventDelay : 500)
+  }
+
+  // Called whenever the selection changes, sets the new selection as
+  // the pending selection in the history, and pushes the old pending
+  // selection into the 'done' array when it was significantly
+  // different (in number of selected ranges, emptiness, or time).
+  function addSelectionToHistory(doc, sel, opId, options) {
+    var hist = doc.history, origin = options && options.origin;
+
+    // A new event is started when the previous origin does not match
+    // the current, or the origins don't allow matching. Origins
+    // starting with * are always merged, those starting with + are
+    // merged when similar and close together in time.
+    if (opId == hist.lastSelOp ||
+        (origin && hist.lastSelOrigin == origin &&
+         (hist.lastModTime == hist.lastSelTime && hist.lastOrigin == origin ||
+          selectionEventCanBeMerged(doc, origin, lst(hist.done), sel))))
+      { hist.done[hist.done.length - 1] = sel; }
+    else
+      { pushSelectionToHistory(sel, hist.done); }
+
+    hist.lastSelTime = +new Date;
+    hist.lastSelOrigin = origin;
+    hist.lastSelOp = opId;
+    if (options && options.clearRedo !== false)
+      { clearSelectionEvents(hist.undone); }
+  }
+
+  function pushSelectionToHistory(sel, dest) {
+    var top = lst(dest);
+    if (!(top && top.ranges && top.equals(sel)))
+      { dest.push(sel); }
+  }
+
+  // Used to store marked span information in the history.
+  function attachLocalSpans(doc, change, from, to) {
+    var existing = change["spans_" + doc.id], n = 0;
+    doc.iter(Math.max(doc.first, from), Math.min(doc.first + doc.size, to), function (line) {
+      if (line.markedSpans)
+        { (existing || (existing = change["spans_" + doc.id] = {}))[n] = line.markedSpans; }
+      ++n;
+    });
+  }
+
+  // When un/re-doing restores text containing marked spans, those
+  // that have been explicitly cleared should not be restored.
+  function removeClearedSpans(spans) {
+    if (!spans) { return null }
+    var out;
+    for (var i = 0; i < spans.length; ++i) {
+      if (spans[i].marker.explicitlyCleared) { if (!out) { out = spans.slice(0, i); } }
+      else if (out) { out.push(spans[i]); }
+    }
+    return !out ? spans : out.length ? out : null
+  }
+
+  // Retrieve and filter the old marked spans stored in a change event.
+  function getOldSpans(doc, change) {
+    var found = change["spans_" + doc.id];
+    if (!found) { return null }
+    var nw = [];
+    for (var i = 0; i < change.text.length; ++i)
+      { nw.push(removeClearedSpans(found[i])); }
+    return nw
+  }
+
+  // Used for un/re-doing changes from the history. Combines the
+  // result of computing the existing spans with the set of spans that
+  // existed in the history (so that deleting around a span and then
+  // undoing brings back the span).
+  function mergeOldSpans(doc, change) {
+    var old = getOldSpans(doc, change);
+    var stretched = stretchSpansOverChange(doc, change);
+    if (!old) { return stretched }
+    if (!stretched) { return old }
+
+    for (var i = 0; i < old.length; ++i) {
+      var oldCur = old[i], stretchCur = stretched[i];
+      if (oldCur && stretchCur) {
+        spans: for (var j = 0; j < stretchCur.length; ++j) {
+          var span = stretchCur[j];
+          for (var k = 0; k < oldCur.length; ++k)
+            { if (oldCur[k].marker == span.marker) { continue spans } }
+          oldCur.push(span);
+        }
+      } else if (stretchCur) {
+        old[i] = stretchCur;
+      }
+    }
+    return old
+  }
+
+  // Used both to provide a JSON-safe object in .getHistory, and, when
+  // detaching a document, to split the history in two
+  function copyHistoryArray(events, newGroup, instantiateSel) {
+    var copy = [];
+    for (var i = 0; i < events.length; ++i) {
+      var event = events[i];
+      if (event.ranges) {
+        copy.push(instantiateSel ? Selection.prototype.deepCopy.call(event) : event);
+        continue
+      }
+      var changes = event.changes, newChanges = [];
+      copy.push({changes: newChanges});
+      for (var j = 0; j < changes.length; ++j) {
+        var change = changes[j], m = (void 0);
+        newChanges.push({from: change.from, to: change.to, text: change.text});
+        if (newGroup) { for (var prop in change) { if (m = prop.match(/^spans_(\d+)$/)) {
+          if (indexOf(newGroup, Number(m[1])) > -1) {
+            lst(newChanges)[prop] = change[prop];
+            delete change[prop];
+          }
+        } } }
+      }
+    }
+    return copy
+  }
+
+  // The 'scroll' parameter given to many of these indicated whether
+  // the new cursor position should be scrolled into view after
+  // modifying the selection.
+
+  // If shift is held or the extend flag is set, extends a range to
+  // include a given position (and optionally a second position).
+  // Otherwise, simply returns the range between the given positions.
+  // Used for cursor motion and such.
+  function extendRange(range, head, other, extend) {
+    if (extend) {
+      var anchor = range.anchor;
+      if (other) {
+        var posBefore = cmp(head, anchor) < 0;
+        if (posBefore != (cmp(other, anchor) < 0)) {
+          anchor = head;
+          head = other;
+        } else if (posBefore != (cmp(head, other) < 0)) {
+          head = other;
+        }
+      }
+      return new Range(anchor, head)
+    } else {
+      return new Range(other || head, head)
+    }
+  }
+
+  // Extend the primary selection range, discard the rest.
+  function extendSelection(doc, head, other, options, extend) {
+    if (extend == null) { extend = doc.cm && (doc.cm.display.shift || doc.extend); }
+    setSelection(doc, new Selection([extendRange(doc.sel.primary(), head, other, extend)], 0), options);
+  }
+
+  // Extend all selections (pos is an array of selections with length
+  // equal the number of selections)
+  function extendSelections(doc, heads, options) {
+    var out = [];
+    var extend = doc.cm && (doc.cm.display.shift || doc.extend);
+    for (var i = 0; i < doc.sel.ranges.length; i++)
+      { out[i] = extendRange(doc.sel.ranges[i], heads[i], null, extend); }
+    var newSel = normalizeSelection(doc.cm, out, doc.sel.primIndex);
+    setSelection(doc, newSel, options);
+  }
+
+  // Updates a single range in the selection.
+  function replaceOneSelection(doc, i, range, options) {
+    var ranges = doc.sel.ranges.slice(0);
+    ranges[i] = range;
+    setSelection(doc, normalizeSelection(doc.cm, ranges, doc.sel.primIndex), options);
+  }
+
+  // Reset the selection to a single range.
+  function setSimpleSelection(doc, anchor, head, options) {
+    setSelection(doc, simpleSelection(anchor, head), options);
+  }
+
+  // Give beforeSelectionChange handlers a change to influence a
+  // selection update.
+  function filterSelectionChange(doc, sel, options) {
+    var obj = {
+      ranges: sel.ranges,
+      update: function(ranges) {
+        var this$1 = this;
+
+        this.ranges = [];
+        for (var i = 0; i < ranges.length; i++)
+          { this$1.ranges[i] = new Range(clipPos(doc, ranges[i].anchor),
+                                     clipPos(doc, ranges[i].head)); }
+      },
+      origin: options && options.origin
+    };
+    signal(doc, "beforeSelectionChange", doc, obj);
+    if (doc.cm) { signal(doc.cm, "beforeSelectionChange", doc.cm, obj); }
+    if (obj.ranges != sel.ranges) { return normalizeSelection(doc.cm, obj.ranges, obj.ranges.length - 1) }
+    else { return sel }
+  }
+
+  function setSelectionReplaceHistory(doc, sel, options) {
+    var done = doc.history.done, last = lst(done);
+    if (last && last.ranges) {
+      done[done.length - 1] = sel;
+      setSelectionNoUndo(doc, sel, options);
+    } else {
+      setSelection(doc, sel, options);
+    }
+  }
+
+  // Set a new selection.
+  function setSelection(doc, sel, options) {
+    setSelectionNoUndo(doc, sel, options);
+    addSelectionToHistory(doc, doc.sel, doc.cm ? doc.cm.curOp.id : NaN, options);
+  }
+
+  function setSelectionNoUndo(doc, sel, options) {
+    if (hasHandler(doc, "beforeSelectionChange") || doc.cm && hasHandler(doc.cm, "beforeSelectionChange"))
+      { sel = filterSelectionChange(doc, sel, options); }
+
+    var bias = options && options.bias ||
+      (cmp(sel.primary().head, doc.sel.primary().head) < 0 ? -1 : 1);
+    setSelectionInner(doc, skipAtomicInSelection(doc, sel, bias, true));
+
+    if (!(options && options.scroll === false) && doc.cm)
+      { ensureCursorVisible(doc.cm); }
+  }
+
+  function setSelectionInner(doc, sel) {
+    if (sel.equals(doc.sel)) { return }
+
+    doc.sel = sel;
+
+    if (doc.cm) {
+      doc.cm.curOp.updateInput = 1;
+      doc.cm.curOp.selectionChanged = true;
+      signalCursorActivity(doc.cm);
+    }
+    signalLater(doc, "cursorActivity", doc);
+  }
+
+  // Verify that the selection does not partially select any atomic
+  // marked ranges.
+  function reCheckSelection(doc) {
+    setSelectionInner(doc, skipAtomicInSelection(doc, doc.sel, null, false));
+  }
+
+  // Return a selection that does not partially select any atomic
+  // ranges.
+  function skipAtomicInSelection(doc, sel, bias, mayClear) {
+    var out;
+    for (var i = 0; i < sel.ranges.length; i++) {
+      var range = sel.ranges[i];
+      var old = sel.ranges.length == doc.sel.ranges.length && doc.sel.ranges[i];
+      var newAnchor = skipAtomic(doc, range.anchor, old && old.anchor, bias, mayClear);
+      var newHead = skipAtomic(doc, range.head, old && old.head, bias, mayClear);
+      if (out || newAnchor != range.anchor || newHead != range.head) {
+        if (!out) { out = sel.ranges.slice(0, i); }
+        out[i] = new Range(newAnchor, newHead);
+      }
+    }
+    return out ? normalizeSelection(doc.cm, out, sel.primIndex) : sel
+  }
+
+  function skipAtomicInner(doc, pos, oldPos, dir, mayClear) {
+    var line = getLine(doc, pos.line);
+    if (line.markedSpans) { for (var i = 0; i < line.markedSpans.length; ++i) {
+      var sp = line.markedSpans[i], m = sp.marker;
+
+      // Determine if we should prevent the cursor being placed to the left/right of an atomic marker
+      // Historically this was determined using the inclusiveLeft/Right option, but the new way to control it
+      // is with selectLeft/Right
+      var preventCursorLeft = ("selectLeft" in m) ? !m.selectLeft : m.inclusiveLeft;
+      var preventCursorRight = ("selectRight" in m) ? !m.selectRight : m.inclusiveRight;
+
+      if ((sp.from == null || (preventCursorLeft ? sp.from <= pos.ch : sp.from < pos.ch)) &&
+          (sp.to == null || (preventCursorRight ? sp.to >= pos.ch : sp.to > pos.ch))) {
+        if (mayClear) {
+          signal(m, "beforeCursorEnter");
+          if (m.explicitlyCleared) {
+            if (!line.markedSpans) { break }
+            else {--i; continue}
+          }
+        }
+        if (!m.atomic) { continue }
+
+        if (oldPos) {
+          var near = m.find(dir < 0 ? 1 : -1), diff = (void 0);
+          if (dir < 0 ? preventCursorRight : preventCursorLeft)
+            { near = movePos(doc, near, -dir, near && near.line == pos.line ? line : null); }
+          if (near && near.line == pos.line && (diff = cmp(near, oldPos)) && (dir < 0 ? diff < 0 : diff > 0))
+            { return skipAtomicInner(doc, near, pos, dir, mayClear) }
+        }
+
+        var far = m.find(dir < 0 ? -1 : 1);
+        if (dir < 0 ? preventCursorLeft : preventCursorRight)
+          { far = movePos(doc, far, dir, far.line == pos.line ? line : null); }
+        return far ? skipAtomicInner(doc, far, pos, dir, mayClear) : null
+      }
+    } }
+    return pos
+  }
+
+  // Ensure a given position is not inside an atomic range.
+  function skipAtomic(doc, pos, oldPos, bias, mayClear) {
+    var dir = bias || 1;
+    var found = skipAtomicInner(doc, pos, oldPos, dir, mayClear) ||
+        (!mayClear && skipAtomicInner(doc, pos, oldPos, dir, true)) ||
+        skipAtomicInner(doc, pos, oldPos, -dir, mayClear) ||
+        (!mayClear && skipAtomicInner(doc, pos, oldPos, -dir, true));
+    if (!found) {
+      doc.cantEdit = true;
+      return Pos(doc.first, 0)
+    }
+    return found
+  }
+
+  function movePos(doc, pos, dir, line) {
+    if (dir < 0 && pos.ch == 0) {
+      if (pos.line > doc.first) { return clipPos(doc, Pos(pos.line - 1)) }
+      else { return null }
+    } else if (dir > 0 && pos.ch == (line || getLine(doc, pos.line)).text.length) {
+      if (pos.line < doc.first + doc.size - 1) { return Pos(pos.line + 1, 0) }
+      else { return null }
+    } else {
+      return new Pos(pos.line, pos.ch + dir)
+    }
+  }
+
+  function selectAll(cm) {
+    cm.setSelection(Pos(cm.firstLine(), 0), Pos(cm.lastLine()), sel_dontScroll);
+  }
+
+  // UPDATING
+
+  // Allow "beforeChange" event handlers to influence a change
+  function filterChange(doc, change, update) {
+    var obj = {
+      canceled: false,
+      from: change.from,
+      to: change.to,
+      text: change.text,
+      origin: change.origin,
+      cancel: function () { return obj.canceled = true; }
+    };
+    if (update) { obj.update = function (from, to, text, origin) {
+      if (from) { obj.from = clipPos(doc, from); }
+      if (to) { obj.to = clipPos(doc, to); }
+      if (text) { obj.text = text; }
+      if (origin !== undefined) { obj.origin = origin; }
+    }; }
+    signal(doc, "beforeChange", doc, obj);
+    if (doc.cm) { signal(doc.cm, "beforeChange", doc.cm, obj); }
+
+    if (obj.canceled) {
+      if (doc.cm) { doc.cm.curOp.updateInput = 2; }
+      return null
+    }
+    return {from: obj.from, to: obj.to, text: obj.text, origin: obj.origin}
+  }
+
+  // Apply a change to a document, and add it to the document's
+  // history, and propagating it to all linked documents.
+  function makeChange(doc, change, ignoreReadOnly) {
+    if (doc.cm) {
+      if (!doc.cm.curOp) { return operation(doc.cm, makeChange)(doc, change, ignoreReadOnly) }
+      if (doc.cm.state.suppressEdits) { return }
+    }
+
+    if (hasHandler(doc, "beforeChange") || doc.cm && hasHandler(doc.cm, "beforeChange")) {
+      change = filterChange(doc, change, true);
+      if (!change) { return }
+    }
+
+    // Possibly split or suppress the update based on the presence
+    // of read-only spans in its range.
+    var split = sawReadOnlySpans && !ignoreReadOnly && removeReadOnlyRanges(doc, change.from, change.to);
+    if (split) {
+      for (var i = split.length - 1; i >= 0; --i)
+        { makeChangeInner(doc, {from: split[i].from, to: split[i].to, text: i ? [""] : change.text, origin: change.origin}); }
+    } else {
+      makeChangeInner(doc, change);
+    }
+  }
+
+  function makeChangeInner(doc, change) {
+    if (change.text.length == 1 && change.text[0] == "" && cmp(change.from, change.to) == 0) { return }
+    var selAfter = computeSelAfterChange(doc, change);
+    addChangeToHistory(doc, change, selAfter, doc.cm ? doc.cm.curOp.id : NaN);
+
+    makeChangeSingleDoc(doc, change, selAfter, stretchSpansOverChange(doc, change));
+    var rebased = [];
+
+    linkedDocs(doc, function (doc, sharedHist) {
+      if (!sharedHist && indexOf(rebased, doc.history) == -1) {
+        rebaseHist(doc.history, change);
+        rebased.push(doc.history);
+      }
+      makeChangeSingleDoc(doc, change, null, stretchSpansOverChange(doc, change));
+    });
+  }
+
+  // Revert a change stored in a document's history.
+  function makeChangeFromHistory(doc, type, allowSelectionOnly) {
+    var suppress = doc.cm && doc.cm.state.suppressEdits;
+    if (suppress && !allowSelectionOnly) { return }
+
+    var hist = doc.history, event, selAfter = doc.sel;
+    var source = type == "undo" ? hist.done : hist.undone, dest = type == "undo" ? hist.undone : hist.done;
+
+    // Verify that there is a useable event (so that ctrl-z won't
+    // needlessly clear selection events)
+    var i = 0;
+    for (; i < source.length; i++) {
+      event = source[i];
+      if (allowSelectionOnly ? event.ranges && !event.equals(doc.sel) : !event.ranges)
+        { break }
+    }
+    if (i == source.length) { return }
+    hist.lastOrigin = hist.lastSelOrigin = null;
+
+    for (;;) {
+      event = source.pop();
+      if (event.ranges) {
+        pushSelectionToHistory(event, dest);
+        if (allowSelectionOnly && !event.equals(doc.sel)) {
+          setSelection(doc, event, {clearRedo: false});
+          return
+        }
+        selAfter = event;
+      } else if (suppress) {
+        source.push(event);
+        return
+      } else { break }
+    }
+
+    // Build up a reverse change object to add to the opposite history
+    // stack (redo when undoing, and vice versa).
+    var antiChanges = [];
+    pushSelectionToHistory(selAfter, dest);
+    dest.push({changes: antiChanges, generation: hist.generation});
+    hist.generation = event.generation || ++hist.maxGeneration;
+
+    var filter = hasHandler(doc, "beforeChange") || doc.cm && hasHandler(doc.cm, "beforeChange");
+
+    var loop = function ( i ) {
+      var change = event.changes[i];
+      change.origin = type;
+      if (filter && !filterChange(doc, change, false)) {
+        source.length = 0;
+        return {}
+      }
+
+      antiChanges.push(historyChangeFromChange(doc, change));
+
+      var after = i ? computeSelAfterChange(doc, change) : lst(source);
+      makeChangeSingleDoc(doc, change, after, mergeOldSpans(doc, change));
+      if (!i && doc.cm) { doc.cm.scrollIntoView({from: change.from, to: changeEnd(change)}); }
+      var rebased = [];
+
+      // Propagate to the linked documents
+      linkedDocs(doc, function (doc, sharedHist) {
+        if (!sharedHist && indexOf(rebased, doc.history) == -1) {
+          rebaseHist(doc.history, change);
+          rebased.push(doc.history);
+        }
+        makeChangeSingleDoc(doc, change, null, mergeOldSpans(doc, change));
+      });
+    };
+
+    for (var i$1 = event.changes.length - 1; i$1 >= 0; --i$1) {
+      var returned = loop( i$1 );
+
+      if ( returned ) return returned.v;
+    }
+  }
+
+  // Sub-views need their line numbers shifted when text is added
+  // above or below them in the parent document.
+  function shiftDoc(doc, distance) {
+    if (distance == 0) { return }
+    doc.first += distance;
+    doc.sel = new Selection(map(doc.sel.ranges, function (range) { return new Range(
+      Pos(range.anchor.line + distance, range.anchor.ch),
+      Pos(range.head.line + distance, range.head.ch)
+    ); }), doc.sel.primIndex);
+    if (doc.cm) {
+      regChange(doc.cm, doc.first, doc.first - distance, distance);
+      for (var d = doc.cm.display, l = d.viewFrom; l < d.viewTo; l++)
+        { regLineChange(doc.cm, l, "gutter"); }
+    }
+  }
+
+  // More lower-level change function, handling only a single document
+  // (not linked ones).
+  function makeChangeSingleDoc(doc, change, selAfter, spans) {
+    if (doc.cm && !doc.cm.curOp)
+      { return operation(doc.cm, makeChangeSingleDoc)(doc, change, selAfter, spans) }
+
+    if (change.to.line < doc.first) {
+      shiftDoc(doc, change.text.length - 1 - (change.to.line - change.from.line));
+      return
+    }
+    if (change.from.line > doc.lastLine()) { return }
+
+    // Clip the change to the size of this doc
+    if (change.from.line < doc.first) {
+      var shift = change.text.length - 1 - (doc.first - change.from.line);
+      shiftDoc(doc, shift);
+      change = {from: Pos(doc.first, 0), to: Pos(change.to.line + shift, change.to.ch),
+                text: [lst(change.text)], origin: change.origin};
+    }
+    var last = doc.lastLine();
+    if (change.to.line > last) {
+      change = {from: change.from, to: Pos(last, getLine(doc, last).text.length),
+                text: [change.text[0]], origin: change.origin};
+    }
+
+    change.removed = getBetween(doc, change.from, change.to);
+
+    if (!selAfter) { selAfter = computeSelAfterChange(doc, change); }
+    if (doc.cm) { makeChangeSingleDocInEditor(doc.cm, change, spans); }
+    else { updateDoc(doc, change, spans); }
+    setSelectionNoUndo(doc, selAfter, sel_dontScroll);
+
+    if (doc.cantEdit && skipAtomic(doc, Pos(doc.firstLine(), 0)))
+      { doc.cantEdit = false; }
+  }
+
+  // Handle the interaction of a change to a document with the editor
+  // that this document is part of.
+  function makeChangeSingleDocInEditor(cm, change, spans) {
+    var doc = cm.doc, display = cm.display, from = change.from, to = change.to;
+
+    var recomputeMaxLength = false, checkWidthStart = from.line;
+    if (!cm.options.lineWrapping) {
+      checkWidthStart = lineNo(visualLine(getLine(doc, from.line)));
+      doc.iter(checkWidthStart, to.line + 1, function (line) {
+        if (line == display.maxLine) {
+          recomputeMaxLength = true;
+          return true
+        }
+      });
+    }
+
+    if (doc.sel.contains(change.from, change.to) > -1)
+      { signalCursorActivity(cm); }
+
+    updateDoc(doc, change, spans, estimateHeight(cm));
+
+    if (!cm.options.lineWrapping) {
+      doc.iter(checkWidthStart, from.line + change.text.length, function (line) {
+        var len = lineLength(line);
+        if (len > display.maxLineLength) {
+          display.maxLine = line;
+          display.maxLineLength = len;
+          display.maxLineChanged = true;
+          recomputeMaxLength = false;
+        }
+      });
+      if (recomputeMaxLength) { cm.curOp.updateMaxLine = true; }
+    }
+
+    retreatFrontier(doc, from.line);
+    startWorker(cm, 400);
+
+    var lendiff = change.text.length - (to.line - from.line) - 1;
+    // Remember that these lines changed, for updating the display
+    if (change.full)
+      { regChange(cm); }
+    else if (from.line == to.line && change.text.length == 1 && !isWholeLineUpdate(cm.doc, change))
+      { regLineChange(cm, from.line, "text"); }
+    else
+      { regChange(cm, from.line, to.line + 1, lendiff); }
+
+    var changesHandler = hasHandler(cm, "changes"), changeHandler = hasHandler(cm, "change");
+    if (changeHandler || changesHandler) {
+      var obj = {
+        from: from, to: to,
+        text: change.text,
+        removed: change.removed,
+        origin: change.origin
+      };
+      if (changeHandler) { signalLater(cm, "change", cm, obj); }
+      if (changesHandler) { (cm.curOp.changeObjs || (cm.curOp.changeObjs = [])).push(obj); }
+    }
+    cm.display.selForContextMenu = null;
+  }
+
+  function replaceRange(doc, code, from, to, origin) {
+    var assign;
+
+    if (!to) { to = from; }
+    if (cmp(to, from) < 0) { (assign = [to, from], from = assign[0], to = assign[1]); }
+    if (typeof code == "string") { code = doc.splitLines(code); }
+    makeChange(doc, {from: from, to: to, text: code, origin: origin});
+  }
+
+  // Rebasing/resetting history to deal with externally-sourced changes
+
+  function rebaseHistSelSingle(pos, from, to, diff) {
+    if (to < pos.line) {
+      pos.line += diff;
+    } else if (from < pos.line) {
+      pos.line = from;
+      pos.ch = 0;
+    }
+  }
+
+  // Tries to rebase an array of history events given a change in the
+  // document. If the change touches the same lines as the event, the
+  // event, and everything 'behind' it, is discarded. If the change is
+  // before the event, the event's positions are updated. Uses a
+  // copy-on-write scheme for the positions, to avoid having to
+  // reallocate them all on every rebase, but also avoid problems with
+  // shared position objects being unsafely updated.
+  function rebaseHistArray(array, from, to, diff) {
+    for (var i = 0; i < array.length; ++i) {
+      var sub = array[i], ok = true;
+      if (sub.ranges) {
+        if (!sub.copied) { sub = array[i] = sub.deepCopy(); sub.copied = true; }
+        for (var j = 0; j < sub.ranges.length; j++) {
+          rebaseHistSelSingle(sub.ranges[j].anchor, from, to, diff);
+          rebaseHistSelSingle(sub.ranges[j].head, from, to, diff);
+        }
+        continue
+      }
+      for (var j$1 = 0; j$1 < sub.changes.length; ++j$1) {
+        var cur = sub.changes[j$1];
+        if (to < cur.from.line) {
+          cur.from = Pos(cur.from.line + diff, cur.from.ch);
+          cur.to = Pos(cur.to.line + diff, cur.to.ch);
+        } else if (from <= cur.to.line) {
+          ok = false;
+          break
+        }
+      }
+      if (!ok) {
+        array.splice(0, i + 1);
+        i = 0;
+      }
+    }
+  }
+
+  function rebaseHist(hist, change) {
+    var from = change.from.line, to = change.to.line, diff = change.text.length - (to - from) - 1;
+    rebaseHistArray(hist.done, from, to, diff);
+    rebaseHistArray(hist.undone, from, to, diff);
+  }
+
+  // Utility for applying a change to a line by handle or number,
+  // returning the number and optionally registering the line as
+  // changed.
+  function changeLine(doc, handle, changeType, op) {
+    var no = handle, line = handle;
+    if (typeof handle == "number") { line = getLine(doc, clipLine(doc, handle)); }
+    else { no = lineNo(handle); }
+    if (no == null) { return null }
+    if (op(line, no) && doc.cm) { regLineChange(doc.cm, no, changeType); }
+    return line
+  }
+
+  // The document is represented as a BTree consisting of leaves, with
+  // chunk of lines in them, and branches, with up to ten leaves or
+  // other branch nodes below them. The top node is always a branch
+  // node, and is the document object itself (meaning it has
+  // additional methods and properties).
+  //
+  // All nodes have parent links. The tree is used both to go from
+  // line numbers to line objects, and to go from objects to numbers.
+  // It also indexes by height, and is used to convert between height
+  // and line object, and to find the total height of the document.
+  //
+  // See also http://marijnhaverbeke.nl/blog/codemirror-line-tree.html
+
+  function LeafChunk(lines) {
+    var this$1 = this;
+
+    this.lines = lines;
+    this.parent = null;
+    var height = 0;
+    for (var i = 0; i < lines.length; ++i) {
+      lines[i].parent = this$1;
+      height += lines[i].height;
+    }
+    this.height = height;
+  }
+
+  LeafChunk.prototype = {
+    chunkSize: function() { return this.lines.length },
+
+    // Remove the n lines at offset 'at'.
+    removeInner: function(at, n) {
+      var this$1 = this;
+
+      for (var i = at, e = at + n; i < e; ++i) {
+        var line = this$1.lines[i];
+        this$1.height -= line.height;
+        cleanUpLine(line);
+        signalLater(line, "delete");
+      }
+      this.lines.splice(at, n);
+    },
+
+    // Helper used to collapse a small branch into a single leaf.
+    collapse: function(lines) {
+      lines.push.apply(lines, this.lines);
+    },
+
+    // Insert the given array of lines at offset 'at', count them as
+    // having the given height.
+    insertInner: function(at, lines, height) {
+      var this$1 = this;
+
+      this.height += height;
+      this.lines = this.lines.slice(0, at).concat(lines).concat(this.lines.slice(at));
+      for (var i = 0; i < lines.length; ++i) { lines[i].parent = this$1; }
+    },
+
+    // Used to iterate over a part of the tree.
+    iterN: function(at, n, op) {
+      var this$1 = this;
+
+      for (var e = at + n; at < e; ++at)
+        { if (op(this$1.lines[at])) { return true } }
+    }
+  };
+
+  function BranchChunk(children) {
+    var this$1 = this;
+
+    this.children = children;
+    var size = 0, height = 0;
+    for (var i = 0; i < children.length; ++i) {
+      var ch = children[i];
+      size += ch.chunkSize(); height += ch.height;
+      ch.parent = this$1;
+    }
+    this.size = size;
+    this.height = height;
+    this.parent = null;
+  }
+
+  BranchChunk.prototype = {
+    chunkSize: function() { return this.size },
+
+    removeInner: function(at, n) {
+      var this$1 = this;
+
+      this.size -= n;
+      for (var i = 0; i < this.children.length; ++i) {
+        var child = this$1.children[i], sz = child.chunkSize();
+        if (at < sz) {
+          var rm = Math.min(n, sz - at), oldHeight = child.height;
+          child.removeInner(at, rm);
+          this$1.height -= oldHeight - child.height;
+          if (sz == rm) { this$1.children.splice(i--, 1); child.parent = null; }
+          if ((n -= rm) == 0) { break }
+          at = 0;
+        } else { at -= sz; }
+      }
+      // If the result is smaller than 25 lines, ensure that it is a
+      // single leaf node.
+      if (this.size - n < 25 &&
+          (this.children.length > 1 || !(this.children[0] instanceof LeafChunk))) {
+        var lines = [];
+        this.collapse(lines);
+        this.children = [new LeafChunk(lines)];
+        this.children[0].parent = this;
+      }
+    },
+
+    collapse: function(lines) {
+      var this$1 = this;
+
+      for (var i = 0; i < this.children.length; ++i) { this$1.children[i].collapse(lines); }
+    },
+
+    insertInner: function(at, lines, height) {
+      var this$1 = this;
+
+      this.size += lines.length;
+      this.height += height;
+      for (var i = 0; i < this.children.length; ++i) {
+        var child = this$1.children[i], sz = child.chunkSize();
+        if (at <= sz) {
+          child.insertInner(at, lines, height);
+          if (child.lines && child.lines.length > 50) {
+            // To avoid memory thrashing when child.lines is huge (e.g. first view of a large file), it's never spliced.
+            // Instead, small slices are taken. They're taken in order because sequential memory accesses are fastest.
+            var remaining = child.lines.length % 25 + 25;
+            for (var pos = remaining; pos < child.lines.length;) {
+              var leaf = new LeafChunk(child.lines.slice(pos, pos += 25));
+              child.height -= leaf.height;
+              this$1.children.splice(++i, 0, leaf);
+              leaf.parent = this$1;
+            }
+            child.lines = child.lines.slice(0, remaining);
+            this$1.maybeSpill();
+          }
+          break
+        }
+        at -= sz;
+      }
+    },
+
+    // When a node has grown, check whether it should be split.
+    maybeSpill: function() {
+      if (this.children.length <= 10) { return }
+      var me = this;
+      do {
+        var spilled = me.children.splice(me.children.length - 5, 5);
+        var sibling = new BranchChunk(spilled);
+        if (!me.parent) { // Become the parent node
+          var copy = new BranchChunk(me.children);
+          copy.parent = me;
+          me.children = [copy, sibling];
+          me = copy;
+       } else {
+          me.size -= sibling.size;
+          me.height -= sibling.height;
+          var myIndex = indexOf(me.parent.children, me);
+          me.parent.children.splice(myIndex + 1, 0, sibling);
+        }
+        sibling.parent = me.parent;
+      } while (me.children.length > 10)
+      me.parent.maybeSpill();
+    },
+
+    iterN: function(at, n, op) {
+      var this$1 = this;
+
+      for (var i = 0; i < this.children.length; ++i) {
+        var child = this$1.children[i], sz = child.chunkSize();
+        if (at < sz) {
+          var used = Math.min(n, sz - at);
+          if (child.iterN(at, used, op)) { return true }
+          if ((n -= used) == 0) { break }
+          at = 0;
+        } else { at -= sz; }
+      }
+    }
+  };
+
+  // Line widgets are block elements displayed above or below a line.
+
+  var LineWidget = function(doc, node, options) {
+    var this$1 = this;
+
+    if (options) { for (var opt in options) { if (options.hasOwnProperty(opt))
+      { this$1[opt] = options[opt]; } } }
+    this.doc = doc;
+    this.node = node;
+  };
+
+  LineWidget.prototype.clear = function () {
+      var this$1 = this;
+
+    var cm = this.doc.cm, ws = this.line.widgets, line = this.line, no = lineNo(line);
+    if (no == null || !ws) { return }
+    for (var i = 0; i < ws.length; ++i) { if (ws[i] == this$1) { ws.splice(i--, 1); } }
+    if (!ws.length) { line.widgets = null; }
+    var height = widgetHeight(this);
+    updateLineHeight(line, Math.max(0, line.height - height));
+    if (cm) {
+      runInOp(cm, function () {
+        adjustScrollWhenAboveVisible(cm, line, -height);
+        regLineChange(cm, no, "widget");
+      });
+      signalLater(cm, "lineWidgetCleared", cm, this, no);
+    }
+  };
+
+  LineWidget.prototype.changed = function () {
+      var this$1 = this;
+
+    var oldH = this.height, cm = this.doc.cm, line = this.line;
+    this.height = null;
+    var diff = widgetHeight(this) - oldH;
+    if (!diff) { return }
+    if (!lineIsHidden(this.doc, line)) { updateLineHeight(line, line.height + diff); }
+    if (cm) {
+      runInOp(cm, function () {
+        cm.curOp.forceUpdate = true;
+        adjustScrollWhenAboveVisible(cm, line, diff);
+        signalLater(cm, "lineWidgetChanged", cm, this$1, lineNo(line));
+      });
+    }
+  };
+  eventMixin(LineWidget);
+
+  function adjustScrollWhenAboveVisible(cm, line, diff) {
+    if (heightAtLine(line) < ((cm.curOp && cm.curOp.scrollTop) || cm.doc.scrollTop))
+      { addToScrollTop(cm, diff); }
+  }
+
+  function addLineWidget(doc, handle, node, options) {
+    var widget = new LineWidget(doc, node, options);
+    var cm = doc.cm;
+    if (cm && widget.noHScroll) { cm.display.alignWidgets = true; }
+    changeLine(doc, handle, "widget", function (line) {
+      var widgets = line.widgets || (line.widgets = []);
+      if (widget.insertAt == null) { widgets.push(widget); }
+      else { widgets.splice(Math.min(widgets.length - 1, Math.max(0, widget.insertAt)), 0, widget); }
+      widget.line = line;
+      if (cm && !lineIsHidden(doc, line)) {
+        var aboveVisible = heightAtLine(line) < doc.scrollTop;
+        updateLineHeight(line, line.height + widgetHeight(widget));
+        if (aboveVisible) { addToScrollTop(cm, widget.height); }
+        cm.curOp.forceUpdate = true;
+      }
+      return true
+    });
+    if (cm) { signalLater(cm, "lineWidgetAdded", cm, widget, typeof handle == "number" ? handle : lineNo(handle)); }
+    return widget
+  }
+
+  // TEXTMARKERS
+
+  // Created with markText and setBookmark methods. A TextMarker is a
+  // handle that can be used to clear or find a marked position in the
+  // document. Line objects hold arrays (markedSpans) containing
+  // {from, to, marker} object pointing to such marker objects, and
+  // indicating that such a marker is present on that line. Multiple
+  // lines may point to the same marker when it spans across lines.
+  // The spans will have null for their from/to properties when the
+  // marker continues beyond the start/end of the line. Markers have
+  // links back to the lines they currently touch.
+
+  // Collapsed markers have unique ids, in order to be able to order
+  // them, which is needed for uniquely determining an outer marker
+  // when they overlap (they may nest, but not partially overlap).
+  var nextMarkerId = 0;
+
+  var TextMarker = function(doc, type) {
+    this.lines = [];
+    this.type = type;
+    this.doc = doc;
+    this.id = ++nextMarkerId;
+  };
+
+  // Clear the marker.
+  TextMarker.prototype.clear = function () {
+      var this$1 = this;
+
+    if (this.explicitlyCleared) { return }
+    var cm = this.doc.cm, withOp = cm && !cm.curOp;
+    if (withOp) { startOperation(cm); }
+    if (hasHandler(this, "clear")) {
+      var found = this.find();
+      if (found) { signalLater(this, "clear", found.from, found.to); }
+    }
+    var min = null, max = null;
+    for (var i = 0; i < this.lines.length; ++i) {
+      var line = this$1.lines[i];
+      var span = getMarkedSpanFor(line.markedSpans, this$1);
+      if (cm && !this$1.collapsed) { regLineChange(cm, lineNo(line), "text"); }
+      else if (cm) {
+        if (span.to != null) { max = lineNo(line); }
+        if (span.from != null) { min = lineNo(line); }
+      }
+      line.markedSpans = removeMarkedSpan(line.markedSpans, span);
+      if (span.from == null && this$1.collapsed && !lineIsHidden(this$1.doc, line) && cm)
+        { updateLineHeight(line, textHeight(cm.display)); }
+    }
+    if (cm && this.collapsed && !cm.options.lineWrapping) { for (var i$1 = 0; i$1 < this.lines.length; ++i$1) {
+      var visual = visualLine(this$1.lines[i$1]), len = lineLength(visual);
+      if (len > cm.display.maxLineLength) {
+        cm.display.maxLine = visual;
+        cm.display.maxLineLength = len;
+        cm.display.maxLineChanged = true;
+      }
+    } }
+
+    if (min != null && cm && this.collapsed) { regChange(cm, min, max + 1); }
+    this.lines.length = 0;
+    this.explicitlyCleared = true;
+    if (this.atomic && this.doc.cantEdit) {
+      this.doc.cantEdit = false;
+      if (cm) { reCheckSelection(cm.doc); }
+    }
+    if (cm) { signalLater(cm, "markerCleared", cm, this, min, max); }
+    if (withOp) { endOperation(cm); }
+    if (this.parent) { this.parent.clear(); }
+  };
+
+  // Find the position of the marker in the document. Returns a {from,
+  // to} object by default. Side can be passed to get a specific side
+  // -- 0 (both), -1 (left), or 1 (right). When lineObj is true, the
+  // Pos objects returned contain a line object, rather than a line
+  // number (used to prevent looking up the same line twice).
+  TextMarker.prototype.find = function (side, lineObj) {
+      var this$1 = this;
+
+    if (side == null && this.type == "bookmark") { side = 1; }
+    var from, to;
+    for (var i = 0; i < this.lines.length; ++i) {
+      var line = this$1.lines[i];
+      var span = getMarkedSpanFor(line.markedSpans, this$1);
+      if (span.from != null) {
+        from = Pos(lineObj ? line : lineNo(line), span.from);
+        if (side == -1) { return from }
+      }
+      if (span.to != null) {
+        to = Pos(lineObj ? line : lineNo(line), span.to);
+        if (side == 1) { return to }
+      }
+    }
+    return from && {from: from, to: to}
+  };
+
+  // Signals that the marker's widget changed, and surrounding layout
+  // should be recomputed.
+  TextMarker.prototype.changed = function () {
+      var this$1 = this;
+
+    var pos = this.find(-1, true), widget = this, cm = this.doc.cm;
+    if (!pos || !cm) { return }
+    runInOp(cm, function () {
+      var line = pos.line, lineN = lineNo(pos.line);
+      var view = findViewForLine(cm, lineN);
+      if (view) {
+        clearLineMeasurementCacheFor(view);
+        cm.curOp.selectionChanged = cm.curOp.forceUpdate = true;
+      }
+      cm.curOp.updateMaxLine = true;
+      if (!lineIsHidden(widget.doc, line) && widget.height != null) {
+        var oldHeight = widget.height;
+        widget.height = null;
+        var dHeight = widgetHeight(widget) - oldHeight;
+        if (dHeight)
+          { updateLineHeight(line, line.height + dHeight); }
+      }
+      signalLater(cm, "markerChanged", cm, this$1);
+    });
+  };
+
+  TextMarker.prototype.attachLine = function (line) {
+    if (!this.lines.length && this.doc.cm) {
+      var op = this.doc.cm.curOp;
+      if (!op.maybeHiddenMarkers || indexOf(op.maybeHiddenMarkers, this) == -1)
+        { (op.maybeUnhiddenMarkers || (op.maybeUnhiddenMarkers = [])).push(this); }
+    }
+    this.lines.push(line);
+  };
+
+  TextMarker.prototype.detachLine = function (line) {
+    this.lines.splice(indexOf(this.lines, line), 1);
+    if (!this.lines.length && this.doc.cm) {
+      var op = this.doc.cm.curOp
+      ;(op.maybeHiddenMarkers || (op.maybeHiddenMarkers = [])).push(this);
+    }
+  };
+  eventMixin(TextMarker);
+
+  // Create a marker, wire it up to the right lines, and
+  function markText(doc, from, to, options, type) {
+    // Shared markers (across linked documents) are handled separately
+    // (markTextShared will call out to this again, once per
+    // document).
+    if (options && options.shared) { return markTextShared(doc, from, to, options, type) }
+    // Ensure we are in an operation.
+    if (doc.cm && !doc.cm.curOp) { return operation(doc.cm, markText)(doc, from, to, options, type) }
+
+    var marker = new TextMarker(doc, type), diff = cmp(from, to);
+    if (options) { copyObj(options, marker, false); }
+    // Don't connect empty markers unless clearWhenEmpty is false
+    if (diff > 0 || diff == 0 && marker.clearWhenEmpty !== false)
+      { return marker }
+    if (marker.replacedWith) {
+      // Showing up as a widget implies collapsed (widget replaces text)
+      marker.collapsed = true;
+      marker.widgetNode = eltP("span", [marker.replacedWith], "CodeMirror-widget");
+      if (!options.handleMouseEvents) { marker.widgetNode.setAttribute("cm-ignore-events", "true"); }
+      if (options.insertLeft) { marker.widgetNode.insertLeft = true; }
+    }
+    if (marker.collapsed) {
+      if (conflictingCollapsedRange(doc, from.line, from, to, marker) ||
+          from.line != to.line && conflictingCollapsedRange(doc, to.line, from, to, marker))
+        { throw new Error("Inserting collapsed marker partially overlapping an existing one") }
+      seeCollapsedSpans();
+    }
+
+    if (marker.addToHistory)
+      { addChangeToHistory(doc, {from: from, to: to, origin: "markText"}, doc.sel, NaN); }
+
+    var curLine = from.line, cm = doc.cm, updateMaxLine;
+    doc.iter(curLine, to.line + 1, function (line) {
+      if (cm && marker.collapsed && !cm.options.lineWrapping && visualLine(line) == cm.display.maxLine)
+        { updateMaxLine = true; }
+      if (marker.collapsed && curLine != from.line) { updateLineHeight(line, 0); }
+      addMarkedSpan(line, new MarkedSpan(marker,
+                                         curLine == from.line ? from.ch : null,
+                                         curLine == to.line ? to.ch : null));
+      ++curLine;
+    });
+    // lineIsHidden depends on the presence of the spans, so needs a second pass
+    if (marker.collapsed) { doc.iter(from.line, to.line + 1, function (line) {
+      if (lineIsHidden(doc, line)) { updateLineHeight(line, 0); }
+    }); }
+
+    if (marker.clearOnEnter) { on(marker, "beforeCursorEnter", function () { return marker.clear(); }); }
+
+    if (marker.readOnly) {
+      seeReadOnlySpans();
+      if (doc.history.done.length || doc.history.undone.length)
+        { doc.clearHistory(); }
+    }
+    if (marker.collapsed) {
+      marker.id = ++nextMarkerId;
+      marker.atomic = true;
+    }
+    if (cm) {
+      // Sync editor state
+      if (updateMaxLine) { cm.curOp.updateMaxLine = true; }
+      if (marker.collapsed)
+        { regChange(cm, from.line, to.line + 1); }
+      else if (marker.className || marker.startStyle || marker.endStyle || marker.css ||
+               marker.attributes || marker.title)
+        { for (var i = from.line; i <= to.line; i++) { regLineChange(cm, i, "text"); } }
+      if (marker.atomic) { reCheckSelection(cm.doc); }
+      signalLater(cm, "markerAdded", cm, marker);
+    }
+    return marker
+  }
+
+  // SHARED TEXTMARKERS
+
+  // A shared marker spans multiple linked documents. It is
+  // implemented as a meta-marker-object controlling multiple normal
+  // markers.
+  var SharedTextMarker = function(markers, primary) {
+    var this$1 = this;
+
+    this.markers = markers;
+    this.primary = primary;
+    for (var i = 0; i < markers.length; ++i)
+      { markers[i].parent = this$1; }
+  };
+
+  SharedTextMarker.prototype.clear = function () {
+      var this$1 = this;
+
+    if (this.explicitlyCleared) { return }
+    this.explicitlyCleared = true;
+    for (var i = 0; i < this.markers.length; ++i)
+      { this$1.markers[i].clear(); }
+    signalLater(this, "clear");
+  };
+
+  SharedTextMarker.prototype.find = function (side, lineObj) {
+    return this.primary.find(side, lineObj)
+  };
+  eventMixin(SharedTextMarker);
+
+  function markTextShared(doc, from, to, options, type) {
+    options = copyObj(options);
+    options.shared = false;
+    var markers = [markText(doc, from, to, options, type)], primary = markers[0];
+    var widget = options.widgetNode;
+    linkedDocs(doc, function (doc) {
+      if (widget) { options.widgetNode = widget.cloneNode(true); }
+      markers.push(markText(doc, clipPos(doc, from), clipPos(doc, to), options, type));
+      for (var i = 0; i < doc.linked.length; ++i)
+        { if (doc.linked[i].isParent) { return } }
+      primary = lst(markers);
+    });
+    return new SharedTextMarker(markers, primary)
+  }
+
+  function findSharedMarkers(doc) {
+    return doc.findMarks(Pos(doc.first, 0), doc.clipPos(Pos(doc.lastLine())), function (m) { return m.parent; })
+  }
+
+  function copySharedMarkers(doc, markers) {
+    for (var i = 0; i < markers.length; i++) {
+      var marker = markers[i], pos = marker.find();
+      var mFrom = doc.clipPos(pos.from), mTo = doc.clipPos(pos.to);
+      if (cmp(mFrom, mTo)) {
+        var subMark = markText(doc, mFrom, mTo, marker.primary, marker.primary.type);
+        marker.markers.push(subMark);
+        subMark.parent = marker;
+      }
+    }
+  }
+
+  function detachSharedMarkers(markers) {
+    var loop = function ( i ) {
+      var marker = markers[i], linked = [marker.primary.doc];
+      linkedDocs(marker.primary.doc, function (d) { return linked.push(d); });
+      for (var j = 0; j < marker.markers.length; j++) {
+        var subMarker = marker.markers[j];
+        if (indexOf(linked, subMarker.doc) == -1) {
+          subMarker.parent = null;
+          marker.markers.splice(j--, 1);
+        }
+      }
+    };
+
+    for (var i = 0; i < markers.length; i++) loop( i );
+  }
+
+  var nextDocId = 0;
+  var Doc = function(text, mode, firstLine, lineSep, direction) {
+    if (!(this instanceof Doc)) { return new Doc(text, mode, firstLine, lineSep, direction) }
+    if (firstLine == null) { firstLine = 0; }
+
+    BranchChunk.call(this, [new LeafChunk([new Line("", null)])]);
+    this.first = firstLine;
+    this.scrollTop = this.scrollLeft = 0;
+    this.cantEdit = false;
+    this.cleanGeneration = 1;
+    this.modeFrontier = this.highlightFrontier = firstLine;
+    var start = Pos(firstLine, 0);
+    this.sel = simpleSelection(start);
+    this.history = new History(null);
+    this.id = ++nextDocId;
+    this.modeOption = mode;
+    this.lineSep = lineSep;
+    this.direction = (direction == "rtl") ? "rtl" : "ltr";
+    this.extend = false;
+
+    if (typeof text == "string") { text = this.splitLines(text); }
+    updateDoc(this, {from: start, to: start, text: text});
+    setSelection(this, simpleSelection(start), sel_dontScroll);
+  };
+
+  Doc.prototype = createObj(BranchChunk.prototype, {
+    constructor: Doc,
+    // Iterate over the document. Supports two forms -- with only one
+    // argument, it calls that for each line in the document. With
+    // three, it iterates over the range given by the first two (with
+    // the second being non-inclusive).
+    iter: function(from, to, op) {
+      if (op) { this.iterN(from - this.first, to - from, op); }
+      else { this.iterN(this.first, this.first + this.size, from); }
+    },
+
+    // Non-public interface for adding and removing lines.
+    insert: function(at, lines) {
+      var height = 0;
+      for (var i = 0; i < lines.length; ++i) { height += lines[i].height; }
+      this.insertInner(at - this.first, lines, height);
+    },
+    remove: function(at, n) { this.removeInner(at - this.first, n); },
+
+    // From here, the methods are part of the public interface. Most
+    // are also available from CodeMirror (editor) instances.
+
+    getValue: function(lineSep) {
+      var lines = getLines(this, this.first, this.first + this.size);
+      if (lineSep === false) { return lines }
+      return lines.join(lineSep || this.lineSeparator())
+    },
+    setValue: docMethodOp(function(code) {
+      var top = Pos(this.first, 0), last = this.first + this.size - 1;
+      makeChange(this, {from: top, to: Pos(last, getLine(this, last).text.length),
+                        text: this.splitLines(code), origin: "setValue", full: true}, true);
+      if (this.cm) { scrollToCoords(this.cm, 0, 0); }
+      setSelection(this, simpleSelection(top), sel_dontScroll);
+    }),
+    replaceRange: function(code, from, to, origin) {
+      from = clipPos(this, from);
+      to = to ? clipPos(this, to) : from;
+      replaceRange(this, code, from, to, origin);
+    },
+    getRange: function(from, to, lineSep) {
+      var lines = getBetween(this, clipPos(this, from), clipPos(this, to));
+      if (lineSep === false) { return lines }
+      return lines.join(lineSep || this.lineSeparator())
+    },
+
+    getLine: function(line) {var l = this.getLineHandle(line); return l && l.text},
+
+    getLineHandle: function(line) {if (isLine(this, line)) { return getLine(this, line) }},
+    getLineNumber: function(line) {return lineNo(line)},
+
+    getLineHandleVisualStart: function(line) {
+      if (typeof line == "number") { line = getLine(this, line); }
+      return visualLine(line)
+    },
+
+    lineCount: function() {return this.size},
+    firstLine: function() {return this.first},
+    lastLine: function() {return this.first + this.size - 1},
+
+    clipPos: function(pos) {return clipPos(this, pos)},
+
+    getCursor: function(start) {
+      var range$$1 = this.sel.primary(), pos;
+      if (start == null || start == "head") { pos = range$$1.head; }
+      else if (start == "anchor") { pos = range$$1.anchor; }
+      else if (start == "end" || start == "to" || start === false) { pos = range$$1.to(); }
+      else { pos = range$$1.from(); }
+      return pos
+    },
+    listSelections: function() { return this.sel.ranges },
+    somethingSelected: function() {return this.sel.somethingSelected()},
+
+    setCursor: docMethodOp(function(line, ch, options) {
+      setSimpleSelection(this, clipPos(this, typeof line == "number" ? Pos(line, ch || 0) : line), null, options);
+    }),
+    setSelection: docMethodOp(function(anchor, head, options) {
+      setSimpleSelection(this, clipPos(this, anchor), clipPos(this, head || anchor), options);
+    }),
+    extendSelection: docMethodOp(function(head, other, options) {
+      extendSelection(this, clipPos(this, head), other && clipPos(this, other), options);
+    }),
+    extendSelections: docMethodOp(function(heads, options) {
+      extendSelections(this, clipPosArray(this, heads), options);
+    }),
+    extendSelectionsBy: docMethodOp(function(f, options) {
+      var heads = map(this.sel.ranges, f);
+      extendSelections(this, clipPosArray(this, heads), options);
+    }),
+    setSelections: docMethodOp(function(ranges, primary, options) {
+      var this$1 = this;
+
+      if (!ranges.length) { return }
+      var out = [];
+      for (var i = 0; i < ranges.length; i++)
+        { out[i] = new Range(clipPos(this$1, ranges[i].anchor),
+                           clipPos(this$1, ranges[i].head)); }
+      if (primary == null) { primary = Math.min(ranges.length - 1, this.sel.primIndex); }
+      setSelection(this, normalizeSelection(this.cm, out, primary), options);
+    }),
+    addSelection: docMethodOp(function(anchor, head, options) {
+      var ranges = this.sel.ranges.slice(0);
+      ranges.push(new Range(clipPos(this, anchor), clipPos(this, head || anchor)));
+      setSelection(this, normalizeSelection(this.cm, ranges, ranges.length - 1), options);
+    }),
+
+    getSelection: function(lineSep) {
+      var this$1 = this;
+
+      var ranges = this.sel.ranges, lines;
+      for (var i = 0; i < ranges.length; i++) {
+        var sel = getBetween(this$1, ranges[i].from(), ranges[i].to());
+        lines = lines ? lines.concat(sel) : sel;
+      }
+      if (lineSep === false) { return lines }
+      else { return lines.join(lineSep || this.lineSeparator()) }
+    },
+    getSelections: function(lineSep) {
+      var this$1 = this;
+
+      var parts = [], ranges = this.sel.ranges;
+      for (var i = 0; i < ranges.length; i++) {
+        var sel = getBetween(this$1, ranges[i].from(), ranges[i].to());
+        if (lineSep !== false) { sel = sel.join(lineSep || this$1.lineSeparator()); }
+        parts[i] = sel;
+      }
+      return parts
+    },
+    replaceSelection: function(code, collapse, origin) {
+      var dup = [];
+      for (var i = 0; i < this.sel.ranges.length; i++)
+        { dup[i] = code; }
+      this.replaceSelections(dup, collapse, origin || "+input");
+    },
+    replaceSelections: docMethodOp(function(code, collapse, origin) {
+      var this$1 = this;
+
+      var changes = [], sel = this.sel;
+      for (var i = 0; i < sel.ranges.length; i++) {
+        var range$$1 = sel.ranges[i];
+        changes[i] = {from: range$$1.from(), to: range$$1.to(), text: this$1.splitLines(code[i]), origin: origin};
+      }
+      var newSel = collapse && collapse != "end" && computeReplacedSel(this, changes, collapse);
+      for (var i$1 = changes.length - 1; i$1 >= 0; i$1--)
+        { makeChange(this$1, changes[i$1]); }
+      if (newSel) { setSelectionReplaceHistory(this, newSel); }
+      else if (this.cm) { ensureCursorVisible(this.cm); }
+    }),
+    undo: docMethodOp(function() {makeChangeFromHistory(this, "undo");}),
+    redo: docMethodOp(function() {makeChangeFromHistory(this, "redo");}),
+    undoSelection: docMethodOp(function() {makeChangeFromHistory(this, "undo", true);}),
+    redoSelection: docMethodOp(function() {makeChangeFromHistory(this, "redo", true);}),
+
+    setExtending: function(val) {this.extend = val;},
+    getExtending: function() {return this.extend},
+
+    historySize: function() {
+      var hist = this.history, done = 0, undone = 0;
+      for (var i = 0; i < hist.done.length; i++) { if (!hist.done[i].ranges) { ++done; } }
+      for (var i$1 = 0; i$1 < hist.undone.length; i$1++) { if (!hist.undone[i$1].ranges) { ++undone; } }
+      return {undo: done, redo: undone}
+    },
+    clearHistory: function() {this.history = new History(this.history.maxGeneration);},
+
+    markClean: function() {
+      this.cleanGeneration = this.changeGeneration(true);
+    },
+    changeGeneration: function(forceSplit) {
+      if (forceSplit)
+        { this.history.lastOp = this.history.lastSelOp = this.history.lastOrigin = null; }
+      return this.history.generation
+    },
+    isClean: function (gen) {
+      return this.history.generation == (gen || this.cleanGeneration)
+    },
+
+    getHistory: function() {
+      return {done: copyHistoryArray(this.history.done),
+              undone: copyHistoryArray(this.history.undone)}
+    },
+    setHistory: function(histData) {
+      var hist = this.history = new History(this.history.maxGeneration);
+      hist.done = copyHistoryArray(histData.done.slice(0), null, true);
+      hist.undone = copyHistoryArray(histData.undone.slice(0), null, true);
+    },
+
+    setGutterMarker: docMethodOp(function(line, gutterID, value) {
+      return changeLine(this, line, "gutter", function (line) {
+        var markers = line.gutterMarkers || (line.gutterMarkers = {});
+        markers[gutterID] = value;
+        if (!value && isEmpty(markers)) { line.gutterMarkers = null; }
+        return true
+      })
+    }),
+
+    clearGutter: docMethodOp(function(gutterID) {
+      var this$1 = this;
+
+      this.iter(function (line) {
+        if (line.gutterMarkers && line.gutterMarkers[gutterID]) {
+          changeLine(this$1, line, "gutter", function () {
+            line.gutterMarkers[gutterID] = null;
+            if (isEmpty(line.gutterMarkers)) { line.gutterMarkers = null; }
+            return true
+          });
+        }
+      });
+    }),
+
+    lineInfo: function(line) {
+      var n;
+      if (typeof line == "number") {
+        if (!isLine(this, line)) { return null }
+        n = line;
+        line = getLine(this, line);
+        if (!line) { return null }
+      } else {
+        n = lineNo(line);
+        if (n == null) { return null }
+      }
+      return {line: n, handle: line, text: line.text, gutterMarkers: line.gutterMarkers,
+              textClass: line.textClass, bgClass: line.bgClass, wrapClass: line.wrapClass,
+              widgets: line.widgets}
+    },
+
+    addLineClass: docMethodOp(function(handle, where, cls) {
+      return changeLine(this, handle, where == "gutter" ? "gutter" : "class", function (line) {
+        var prop = where == "text" ? "textClass"
+                 : where == "background" ? "bgClass"
+                 : where == "gutter" ? "gutterClass" : "wrapClass";
+        if (!line[prop]) { line[prop] = cls; }
+        else if (classTest(cls).test(line[prop])) { return false }
+        else { line[prop] += " " + cls; }
+        return true
+      })
+    }),
+    removeLineClass: docMethodOp(function(handle, where, cls) {
+      return changeLine(this, handle, where == "gutter" ? "gutter" : "class", function (line) {
+        var prop = where == "text" ? "textClass"
+                 : where == "background" ? "bgClass"
+                 : where == "gutter" ? "gutterClass" : "wrapClass";
+        var cur = line[prop];
+        if (!cur) { return false }
+        else if (cls == null) { line[prop] = null; }
+        else {
+          var found = cur.match(classTest(cls));
+          if (!found) { return false }
+          var end = found.index + found[0].length;
+          line[prop] = cur.slice(0, found.index) + (!found.index || end == cur.length ? "" : " ") + cur.slice(end) || null;
+        }
+        return true
+      })
+    }),
+
+    addLineWidget: docMethodOp(function(handle, node, options) {
+      return addLineWidget(this, handle, node, options)
+    }),
+    removeLineWidget: function(widget) { widget.clear(); },
+
+    markText: function(from, to, options) {
+      return markText(this, clipPos(this, from), clipPos(this, to), options, options && options.type || "range")
+    },
+    setBookmark: function(pos, options) {
+      var realOpts = {replacedWith: options && (options.nodeType == null ? options.widget : options),
+                      insertLeft: options && options.insertLeft,
+                      clearWhenEmpty: false, shared: options && options.shared,
+                      handleMouseEvents: options && options.handleMouseEvents};
+      pos = clipPos(this, pos);
+      return markText(this, pos, pos, realOpts, "bookmark")
+    },
+    findMarksAt: function(pos) {
+      pos = clipPos(this, pos);
+      var markers = [], spans = getLine(this, pos.line).markedSpans;
+      if (spans) { for (var i = 0; i < spans.length; ++i) {
+        var span = spans[i];
+        if ((span.from == null || span.from <= pos.ch) &&
+            (span.to == null || span.to >= pos.ch))
+          { markers.push(span.marker.parent || span.marker); }
+      } }
+      return markers
+    },
+    findMarks: function(from, to, filter) {
+      from = clipPos(this, from); to = clipPos(this, to);
+      var found = [], lineNo$$1 = from.line;
+      this.iter(from.line, to.line + 1, function (line) {
+        var spans = line.markedSpans;
+        if (spans) { for (var i = 0; i < spans.length; i++) {
+          var span = spans[i];
+          if (!(span.to != null && lineNo$$1 == from.line && from.ch >= span.to ||
+                span.from == null && lineNo$$1 != from.line ||
+                span.from != null && lineNo$$1 == to.line && span.from >= to.ch) &&
+              (!filter || filter(span.marker)))
+            { found.push(span.marker.parent || span.marker); }
+        } }
+        ++lineNo$$1;
+      });
+      return found
+    },
+    getAllMarks: function() {
+      var markers = [];
+      this.iter(function (line) {
+        var sps = line.markedSpans;
+        if (sps) { for (var i = 0; i < sps.length; ++i)
+          { if (sps[i].from != null) { markers.push(sps[i].marker); } } }
+      });
+      return markers
+    },
+
+    posFromIndex: function(off) {
+      var ch, lineNo$$1 = this.first, sepSize = this.lineSeparator().length;
+      this.iter(function (line) {
+        var sz = line.text.length + sepSize;
+        if (sz > off) { ch = off; return true }
+        off -= sz;
+        ++lineNo$$1;
+      });
+      return clipPos(this, Pos(lineNo$$1, ch))
+    },
+    indexFromPos: function (coords) {
+      coords = clipPos(this, coords);
+      var index = coords.ch;
+      if (coords.line < this.first || coords.ch < 0) { return 0 }
+      var sepSize = this.lineSeparator().length;
+      this.iter(this.first, coords.line, function (line) { // iter aborts when callback returns a truthy value
+        index += line.text.length + sepSize;
+      });
+      return index
+    },
+
+    copy: function(copyHistory) {
+      var doc = new Doc(getLines(this, this.first, this.first + this.size),
+                        this.modeOption, this.first, this.lineSep, this.direction);
+      doc.scrollTop = this.scrollTop; doc.scrollLeft = this.scrollLeft;
+      doc.sel = this.sel;
+      doc.extend = false;
+      if (copyHistory) {
+        doc.history.undoDepth = this.history.undoDepth;
+        doc.setHistory(this.getHistory());
+      }
+      return doc
+    },
+
+    linkedDoc: function(options) {
+      if (!options) { options = {}; }
+      var from = this.first, to = this.first + this.size;
+      if (options.from != null && options.from > from) { from = options.from; }
+      if (options.to != null && options.to < to) { to = options.to; }
+      var copy = new Doc(getLines(this, from, to), options.mode || this.modeOption, from, this.lineSep, this.direction);
+      if (options.sharedHist) { copy.history = this.history
+      ; }(this.linked || (this.linked = [])).push({doc: copy, sharedHist: options.sharedHist});
+      copy.linked = [{doc: this, isParent: true, sharedHist: options.sharedHist}];
+      copySharedMarkers(copy, findSharedMarkers(this));
+      return copy
+    },
+    unlinkDoc: function(other) {
+      var this$1 = this;
+
+      if (other instanceof CodeMirror) { other = other.doc; }
+      if (this.linked) { for (var i = 0; i < this.linked.length; ++i) {
+        var link = this$1.linked[i];
+        if (link.doc != other) { continue }
+        this$1.linked.splice(i, 1);
+        other.unlinkDoc(this$1);
+        detachSharedMarkers(findSharedMarkers(this$1));
+        break
+      } }
+      // If the histories were shared, split them again
+      if (other.history == this.history) {
+        var splitIds = [other.id];
+        linkedDocs(other, function (doc) { return splitIds.push(doc.id); }, true);
+        other.history = new History(null);
+        other.history.done = copyHistoryArray(this.history.done, splitIds);
+        other.history.undone = copyHistoryArray(this.history.undone, splitIds);
+      }
+    },
+    iterLinkedDocs: function(f) {linkedDocs(this, f);},
+
+    getMode: function() {return this.mode},
+    getEditor: function() {return this.cm},
+
+    splitLines: function(str) {
+      if (this.lineSep) { return str.split(this.lineSep) }
+      return splitLinesAuto(str)
+    },
+    lineSeparator: function() { return this.lineSep || "\n" },
+
+    setDirection: docMethodOp(function (dir) {
+      if (dir != "rtl") { dir = "ltr"; }
+      if (dir == this.direction) { return }
+      this.direction = dir;
+      this.iter(function (line) { return line.order = null; });
+      if (this.cm) { directionChanged(this.cm); }
+    })
+  });
+
+  // Public alias.
+  Doc.prototype.eachLine = Doc.prototype.iter;
+
+  // Kludge to work around strange IE behavior where it'll sometimes
+  // re-fire a series of drag-related events right after the drop (#1551)
+  var lastDrop = 0;
+
+  function onDrop(e) {
+    var cm = this;
+    clearDragCursor(cm);
+    if (signalDOMEvent(cm, e) || eventInWidget(cm.display, e))
+      { return }
+    e_preventDefault(e);
+    if (ie) { lastDrop = +new Date; }
+    var pos = posFromMouse(cm, e, true), files = e.dataTransfer.files;
+    if (!pos || cm.isReadOnly()) { return }
+    // Might be a file drop, in which case we simply extract the text
+    // and insert it.
+    if (files && files.length && window.FileReader && window.File) {
+      var n = files.length, text = Array(n), read = 0;
+      var loadFile = function (file, i) {
+        if (cm.options.allowDropFileTypes &&
+            indexOf(cm.options.allowDropFileTypes, file.type) == -1)
+          { return }
+
+        var reader = new FileReader;
+        reader.onload = operation(cm, function () {
+          var content = reader.result;
+          if (/[\x00-\x08\x0e-\x1f]{2}/.test(content)) { content = ""; }
+          text[i] = content;
+          if (++read == n) {
+            pos = clipPos(cm.doc, pos);
+            var change = {from: pos, to: pos,
+                          text: cm.doc.splitLines(text.join(cm.doc.lineSeparator())),
+                          origin: "paste"};
+            makeChange(cm.doc, change);
+            setSelectionReplaceHistory(cm.doc, simpleSelection(pos, changeEnd(change)));
+          }
+        });
+        reader.readAsText(file);
+      };
+      for (var i = 0; i < n; ++i) { loadFile(files[i], i); }
+    } else { // Normal drop
+      // Don't do a replace if the drop happened inside of the selected text.
+      if (cm.state.draggingText && cm.doc.sel.contains(pos) > -1) {
+        cm.state.draggingText(e);
+        // Ensure the editor is re-focused
+        setTimeout(function () { return cm.display.input.focus(); }, 20);
+        return
+      }
+      try {
+        var text$1 = e.dataTransfer.getData("Text");
+        if (text$1) {
+          var selected;
+          if (cm.state.draggingText && !cm.state.draggingText.copy)
+            { selected = cm.listSelections(); }
+          setSelectionNoUndo(cm.doc, simpleSelection(pos, pos));
+          if (selected) { for (var i$1 = 0; i$1 < selected.length; ++i$1)
+            { replaceRange(cm.doc, "", selected[i$1].anchor, selected[i$1].head, "drag"); } }
+          cm.replaceSelection(text$1, "around", "paste");
+          cm.display.input.focus();
+        }
+      }
+      catch(e){}
+    }
+  }
+
+  function onDragStart(cm, e) {
+    if (ie && (!cm.state.draggingText || +new Date - lastDrop < 100)) { e_stop(e); return }
+    if (signalDOMEvent(cm, e) || eventInWidget(cm.display, e)) { return }
+
+    e.dataTransfer.setData("Text", cm.getSelection());
+    e.dataTransfer.effectAllowed = "copyMove";
+
+    // Use dummy image instead of default browsers image.
+    // Recent Safari (~6.0.2) have a tendency to segfault when this happens, so we don't do it there.
+    if (e.dataTransfer.setDragImage && !safari) {
+      var img = elt("img", null, null, "position: fixed; left: 0; top: 0;");
+      img.src = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";
+      if (presto) {
+        img.width = img.height = 1;
+        cm.display.wrapper.appendChild(img);
+        // Force a relayout, or Opera won't use our image for some obscure reason
+        img._top = img.offsetTop;
+      }
+      e.dataTransfer.setDragImage(img, 0, 0);
+      if (presto) { img.parentNode.removeChild(img); }
+    }
+  }
+
+  function onDragOver(cm, e) {
+    var pos = posFromMouse(cm, e);
+    if (!pos) { return }
+    var frag = document.createDocumentFragment();
+    drawSelectionCursor(cm, pos, frag);
+    if (!cm.display.dragCursor) {
+      cm.display.dragCursor = elt("div", null, "CodeMirror-cursors CodeMirror-dragcursors");
+      cm.display.lineSpace.insertBefore(cm.display.dragCursor, cm.display.cursorDiv);
+    }
+    removeChildrenAndAdd(cm.display.dragCursor, frag);
+  }
+
+  function clearDragCursor(cm) {
+    if (cm.display.dragCursor) {
+      cm.display.lineSpace.removeChild(cm.display.dragCursor);
+      cm.display.dragCursor = null;
+    }
+  }
+
+  // These must be handled carefully, because naively registering a
+  // handler for each editor will cause the editors to never be
+  // garbage collected.
+
+  function forEachCodeMirror(f) {
+    if (!document.getElementsByClassName) { return }
+    var byClass = document.getElementsByClassName("CodeMirror"), editors = [];
+    for (var i = 0; i < byClass.length; i++) {
+      var cm = byClass[i].CodeMirror;
+      if (cm) { editors.push(cm); }
+    }
+    if (editors.length) { editors[0].operation(function () {
+      for (var i = 0; i < editors.length; i++) { f(editors[i]); }
+    }); }
+  }
+
+  var globalsRegistered = false;
+  function ensureGlobalHandlers() {
+    if (globalsRegistered) { return }
+    registerGlobalHandlers();
+    globalsRegistered = true;
+  }
+  function registerGlobalHandlers() {
+    // When the window resizes, we need to refresh active editors.
+    var resizeTimer;
+    on(window, "resize", function () {
+      if (resizeTimer == null) { resizeTimer = setTimeout(function () {
+        resizeTimer = null;
+        forEachCodeMirror(onResize);
+      }, 100); }
+    });
+    // When the window loses focus, we want to show the editor as blurred
+    on(window, "blur", function () { return forEachCodeMirror(onBlur); });
+  }
+  // Called when the window resizes
+  function onResize(cm) {
+    var d = cm.display;
+    // Might be a text scaling operation, clear size caches.
+    d.cachedCharWidth = d.cachedTextHeight = d.cachedPaddingH = null;
+    d.scrollbarsClipped = false;
+    cm.setSize();
+  }
+
+  var keyNames = {
+    3: "Pause", 8: "Backspace", 9: "Tab", 13: "Enter", 16: "Shift", 17: "Ctrl", 18: "Alt",
+    19: "Pause", 20: "CapsLock", 27: "Esc", 32: "Space", 33: "PageUp", 34: "PageDown", 35: "End",
+    36: "Home", 37: "Left", 38: "Up", 39: "Right", 40: "Down", 44: "PrintScrn", 45: "Insert",
+    46: "Delete", 59: ";", 61: "=", 91: "Mod", 92: "Mod", 93: "Mod",
+    106: "*", 107: "=", 109: "-", 110: ".", 111: "/", 145: "ScrollLock",
+    173: "-", 186: ";", 187: "=", 188: ",", 189: "-", 190: ".", 191: "/", 192: "`", 219: "[", 220: "\\",
+    221: "]", 222: "'", 63232: "Up", 63233: "Down", 63234: "Left", 63235: "Right", 63272: "Delete",
+    63273: "Home", 63275: "End", 63276: "PageUp", 63277: "PageDown", 63302: "Insert"
+  };
+
+  // Number keys
+  for (var i = 0; i < 10; i++) { keyNames[i + 48] = keyNames[i + 96] = String(i); }
+  // Alphabetic keys
+  for (var i$1 = 65; i$1 <= 90; i$1++) { keyNames[i$1] = String.fromCharCode(i$1); }
+  // Function keys
+  for (var i$2 = 1; i$2 <= 12; i$2++) { keyNames[i$2 + 111] = keyNames[i$2 + 63235] = "F" + i$2; }
+
+  var keyMap = {};
+
+  keyMap.basic = {
+    "Left": "goCharLeft", "Right": "goCharRight", "Up": "goLineUp", "Down": "goLineDown",
+    "End": "goLineEnd", "Home": "goLineStartSmart", "PageUp": "goPageUp", "PageDown": "goPageDown",
+    "Delete": "delCharAfter", "Backspace": "delCharBefore", "Shift-Backspace": "delCharBefore",
+    "Tab": "defaultTab", "Shift-Tab": "indentAuto",
+    "Enter": "newlineAndIndent", "Insert": "toggleOverwrite",
+    "Esc": "singleSelection"
+  };
+  // Note that the save and find-related commands aren't defined by
+  // default. User code or addons can define them. Unknown commands
+  // are simply ignored.
+  keyMap.pcDefault = {
+    "Ctrl-A": "selectAll", "Ctrl-D": "deleteLine", "Ctrl-Z": "undo", "Shift-Ctrl-Z": "redo", "Ctrl-Y": "redo",
+    "Ctrl-Home": "goDocStart", "Ctrl-End": "goDocEnd", "Ctrl-Up": "goLineUp", "Ctrl-Down": "goLineDown",
+    "Ctrl-Left": "goGroupLeft", "Ctrl-Right": "goGroupRight", "Alt-Left": "goLineStart", "Alt-Right": "goLineEnd",
+    "Ctrl-Backspace": "delGroupBefore", "Ctrl-Delete": "delGroupAfter", "Ctrl-S": "save", "Ctrl-F": "find",
+    "Ctrl-G": "findNext", "Shift-Ctrl-G": "findPrev", "Shift-Ctrl-F": "replace", "Shift-Ctrl-R": "replaceAll",
+    "Ctrl-[": "indentLess", "Ctrl-]": "indentMore",
+    "Ctrl-U": "undoSelection", "Shift-Ctrl-U": "redoSelection", "Alt-U": "redoSelection",
+    "fallthrough": "basic"
+  };
+  // Very basic readline/emacs-style bindings, which are standard on Mac.
+  keyMap.emacsy = {
+    "Ctrl-F": "goCharRight", "Ctrl-B": "goCharLeft", "Ctrl-P": "goLineUp", "Ctrl-N": "goLineDown",
+    "Alt-F": "goWordRight", "Alt-B": "goWordLeft", "Ctrl-A": "goLineStart", "Ctrl-E": "goLineEnd",
+    "Ctrl-V": "goPageDown", "Shift-Ctrl-V": "goPageUp", "Ctrl-D": "delCharAfter", "Ctrl-H": "delCharBefore",
+    "Alt-D": "delWordAfter", "Alt-Backspace": "delWordBefore", "Ctrl-K": "killLine", "Ctrl-T": "transposeChars",
+    "Ctrl-O": "openLine"
+  };
+  keyMap.macDefault = {
+    "Cmd-A": "selectAll", "Cmd-D": "deleteLine", "Cmd-Z": "undo", "Shift-Cmd-Z": "redo", "Cmd-Y": "redo",
+    "Cmd-Home": "goDocStart", "Cmd-Up": "goDocStart", "Cmd-End": "goDocEnd", "Cmd-Down": "goDocEnd", "Alt-Left": "goGroupLeft",
+    "Alt-Right": "goGroupRight", "Cmd-Left": "goLineLeft", "Cmd-Right": "goLineRight", "Alt-Backspace": "delGroupBefore",
+    "Ctrl-Alt-Backspace": "delGroupAfter", "Alt-Delete": "delGroupAfter", "Cmd-S": "save", "Cmd-F": "find",
+    "Cmd-G": "findNext", "Shift-Cmd-G": "findPrev", "Cmd-Alt-F": "replace", "Shift-Cmd-Alt-F": "replaceAll",
+    "Cmd-[": "indentLess", "Cmd-]": "indentMore", "Cmd-Backspace": "delWrappedLineLeft", "Cmd-Delete": "delWrappedLineRight",
+    "Cmd-U": "undoSelection", "Shift-Cmd-U": "redoSelection", "Ctrl-Up": "goDocStart", "Ctrl-Down": "goDocEnd",
+    "fallthrough": ["basic", "emacsy"]
+  };
+  keyMap["default"] = mac ? keyMap.macDefault : keyMap.pcDefault;
+
+  // KEYMAP DISPATCH
+
+  function normalizeKeyName(name) {
+    var parts = name.split(/-(?!$)/);
+    name = parts[parts.length - 1];
+    var alt, ctrl, shift, cmd;
+    for (var i = 0; i < parts.length - 1; i++) {
+      var mod = parts[i];
+      if (/^(cmd|meta|m)$/i.test(mod)) { cmd = true; }
+      else if (/^a(lt)?$/i.test(mod)) { alt = true; }
+      else if (/^(c|ctrl|control)$/i.test(mod)) { ctrl = true; }
+      else if (/^s(hift)?$/i.test(mod)) { shift = true; }
+      else { throw new Error("Unrecognized modifier name: " + mod) }
+    }
+    if (alt) { name = "Alt-" + name; }
+    if (ctrl) { name = "Ctrl-" + name; }
+    if (cmd) { name = "Cmd-" + name; }
+    if (shift) { name = "Shift-" + name; }
+    return name
+  }
+
+  // This is a kludge to keep keymaps mostly working as raw objects
+  // (backwards compatibility) while at the same time support features
+  // like normalization and multi-stroke key bindings. It compiles a
+  // new normalized keymap, and then updates the old object to reflect
+  // this.
+  function normalizeKeyMap(keymap) {
+    var copy = {};
+    for (var keyname in keymap) { if (keymap.hasOwnProperty(keyname)) {
+      var value = keymap[keyname];
+      if (/^(name|fallthrough|(de|at)tach)$/.test(keyname)) { continue }
+      if (value == "...") { delete keymap[keyname]; continue }
+
+      var keys = map(keyname.split(" "), normalizeKeyName);
+      for (var i = 0; i < keys.length; i++) {
+        var val = (void 0), name = (void 0);
+        if (i == keys.length - 1) {
+          name = keys.join(" ");
+          val = value;
+        } else {
+          name = keys.slice(0, i + 1).join(" ");
+          val = "...";
+        }
+        var prev = copy[name];
+        if (!prev) { copy[name] = val; }
+        else if (prev != val) { throw new Error("Inconsistent bindings for " + name) }
+      }
+      delete keymap[keyname];
+    } }
+    for (var prop in copy) { keymap[prop] = copy[prop]; }
+    return keymap
+  }
+
+  function lookupKey(key, map$$1, handle, context) {
+    map$$1 = getKeyMap(map$$1);
+    var found = map$$1.call ? map$$1.call(key, context) : map$$1[key];
+    if (found === false) { return "nothing" }
+    if (found === "...") { return "multi" }
+    if (found != null && handle(found)) { return "handled" }
+
+    if (map$$1.fallthrough) {
+      if (Object.prototype.toString.call(map$$1.fallthrough) != "[object Array]")
+        { return lookupKey(key, map$$1.fallthrough, handle, context) }
+      for (var i = 0; i < map$$1.fallthrough.length; i++) {
+        var result = lookupKey(key, map$$1.fallthrough[i], handle, context);
+        if (result) { return result }
+      }
+    }
+  }
+
+  // Modifier key presses don't count as 'real' key presses for the
+  // purpose of keymap fallthrough.
+  function isModifierKey(value) {
+    var name = typeof value == "string" ? value : keyNames[value.keyCode];
+    return name == "Ctrl" || name == "Alt" || name == "Shift" || name == "Mod"
+  }
+
+  function addModifierNames(name, event, noShift) {
+    var base = name;
+    if (event.altKey && base != "Alt") { name = "Alt-" + name; }
+    if ((flipCtrlCmd ? event.metaKey : event.ctrlKey) && base != "Ctrl") { name = "Ctrl-" + name; }
+    if ((flipCtrlCmd ? event.ctrlKey : event.metaKey) && base != "Cmd") { name = "Cmd-" + name; }
+    if (!noShift && event.shiftKey && base != "Shift") { name = "Shift-" + name; }
+    return name
+  }
+
+  // Look up the name of a key as indicated by an event object.
+  function keyName(event, noShift) {
+    if (presto && event.keyCode == 34 && event["char"]) { return false }
+    var name = keyNames[event.keyCode];
+    if (name == null || event.altGraphKey) { return false }
+    // Ctrl-ScrollLock has keyCode 3, same as Ctrl-Pause,
+    // so we'll use event.code when available (Chrome 48+, FF 38+, Safari 10.1+)
+    if (event.keyCode == 3 && event.code) { name = event.code; }
+    return addModifierNames(name, event, noShift)
+  }
+
+  function getKeyMap(val) {
+    return typeof val == "string" ? keyMap[val] : val
+  }
+
+  // Helper for deleting text near the selection(s), used to implement
+  // backspace, delete, and similar functionality.
+  function deleteNearSelection(cm, compute) {
+    var ranges = cm.doc.sel.ranges, kill = [];
+    // Build up a set of ranges to kill first, merging overlapping
+    // ranges.
+    for (var i = 0; i < ranges.length; i++) {
+      var toKill = compute(ranges[i]);
+      while (kill.length && cmp(toKill.from, lst(kill).to) <= 0) {
+        var replaced = kill.pop();
+        if (cmp(replaced.from, toKill.from) < 0) {
+          toKill.from = replaced.from;
+          break
+        }
+      }
+      kill.push(toKill);
+    }
+    // Next, remove those actual ranges.
+    runInOp(cm, function () {
+      for (var i = kill.length - 1; i >= 0; i--)
+        { replaceRange(cm.doc, "", kill[i].from, kill[i].to, "+delete"); }
+      ensureCursorVisible(cm);
+    });
+  }
+
+  function moveCharLogically(line, ch, dir) {
+    var target = skipExtendingChars(line.text, ch + dir, dir);
+    return target < 0 || target > line.text.length ? null : target
+  }
+
+  function moveLogically(line, start, dir) {
+    var ch = moveCharLogically(line, start.ch, dir);
+    return ch == null ? null : new Pos(start.line, ch, dir < 0 ? "after" : "before")
+  }
+
+  function endOfLine(visually, cm, lineObj, lineNo, dir) {
+    if (visually) {
+      var order = getOrder(lineObj, cm.doc.direction);
+      if (order) {
+        var part = dir < 0 ? lst(order) : order[0];
+        var moveInStorageOrder = (dir < 0) == (part.level == 1);
+        var sticky = moveInStorageOrder ? "after" : "before";
+        var ch;
+        // With a wrapped rtl chunk (possibly spanning multiple bidi parts),
+        // it could be that the last bidi part is not on the last visual line,
+        // since visual lines contain content order-consecutive chunks.
+        // Thus, in rtl, we are looking for the first (content-order) character
+        // in the rtl chunk that is on the last line (that is, the same line
+        // as the last (content-order) character).
+        if (part.level > 0 || cm.doc.direction == "rtl") {
+          var prep = prepareMeasureForLine(cm, lineObj);
+          ch = dir < 0 ? lineObj.text.length - 1 : 0;
+          var targetTop = measureCharPrepared(cm, prep, ch).top;
+          ch = findFirst(function (ch) { return measureCharPrepared(cm, prep, ch).top == targetTop; }, (dir < 0) == (part.level == 1) ? part.from : part.to - 1, ch);
+          if (sticky == "before") { ch = moveCharLogically(lineObj, ch, 1); }
+        } else { ch = dir < 0 ? part.to : part.from; }
+        return new Pos(lineNo, ch, sticky)
+      }
+    }
+    return new Pos(lineNo, dir < 0 ? lineObj.text.length : 0, dir < 0 ? "before" : "after")
+  }
+
+  function moveVisually(cm, line, start, dir) {
+    var bidi = getOrder(line, cm.doc.direction);
+    if (!bidi) { return moveLogically(line, start, dir) }
+    if (start.ch >= line.text.length) {
+      start.ch = line.text.length;
+      start.sticky = "before";
+    } else if (start.ch <= 0) {
+      start.ch = 0;
+      start.sticky = "after";
+    }
+    var partPos = getBidiPartAt(bidi, start.ch, start.sticky), part = bidi[partPos];
+    if (cm.doc.direction == "ltr" && part.level % 2 == 0 && (dir > 0 ? part.to > start.ch : part.from < start.ch)) {
+      // Case 1: We move within an ltr part in an ltr editor. Even with wrapped lines,
+      // nothing interesting happens.
+      return moveLogically(line, start, dir)
+    }
+
+    var mv = function (pos, dir) { return moveCharLogically(line, pos instanceof Pos ? pos.ch : pos, dir); };
+    var prep;
+    var getWrappedLineExtent = function (ch) {
+      if (!cm.options.lineWrapping) { return {begin: 0, end: line.text.length} }
+      prep = prep || prepareMeasureForLine(cm, line);
+      return wrappedLineExtentChar(cm, line, prep, ch)
+    };
+    var wrappedLineExtent = getWrappedLineExtent(start.sticky == "before" ? mv(start, -1) : start.ch);
+
+    if (cm.doc.direction == "rtl" || part.level == 1) {
+      var moveInStorageOrder = (part.level == 1) == (dir < 0);
+      var ch = mv(start, moveInStorageOrder ? 1 : -1);
+      if (ch != null && (!moveInStorageOrder ? ch >= part.from && ch >= wrappedLineExtent.begin : ch <= part.to && ch <= wrappedLineExtent.end)) {
+        // Case 2: We move within an rtl part or in an rtl editor on the same visual line
+        var sticky = moveInStorageOrder ? "before" : "after";
+        return new Pos(start.line, ch, sticky)
+      }
+    }
+
+    // Case 3: Could not move within this bidi part in this visual line, so leave
+    // the current bidi part
+
+    var searchInVisualLine = function (partPos, dir, wrappedLineExtent) {
+      var getRes = function (ch, moveInStorageOrder) { return moveInStorageOrder
+        ? new Pos(start.line, mv(ch, 1), "before")
+        : new Pos(start.line, ch, "after"); };
+
+      for (; partPos >= 0 && partPos < bidi.length; partPos += dir) {
+        var part = bidi[partPos];
+        var moveInStorageOrder = (dir > 0) == (part.level != 1);
+        var ch = moveInStorageOrder ? wrappedLineExtent.begin : mv(wrappedLineExtent.end, -1);
+        if (part.from <= ch && ch < part.to) { return getRes(ch, moveInStorageOrder) }
+        ch = moveInStorageOrder ? part.from : mv(part.to, -1);
+        if (wrappedLineExtent.begin <= ch && ch < wrappedLineExtent.end) { return getRes(ch, moveInStorageOrder) }
+      }
+    };
+
+    // Case 3a: Look for other bidi parts on the same visual line
+    var res = searchInVisualLine(partPos + dir, dir, wrappedLineExtent);
+    if (res) { return res }
+
+    // Case 3b: Look for other bidi parts on the next visual line
+    var nextCh = dir > 0 ? wrappedLineExtent.end : mv(wrappedLineExtent.begin, -1);
+    if (nextCh != null && !(dir > 0 && nextCh == line.text.length)) {
+      res = searchInVisualLine(dir > 0 ? 0 : bidi.length - 1, dir, getWrappedLineExtent(nextCh));
+      if (res) { return res }
+    }
+
+    // Case 4: Nowhere to move
+    return null
+  }
+
+  // Commands are parameter-less actions that can be performed on an
+  // editor, mostly used for keybindings.
+  var commands = {
+    selectAll: selectAll,
+    singleSelection: function (cm) { return cm.setSelection(cm.getCursor("anchor"), cm.getCursor("head"), sel_dontScroll); },
+    killLine: function (cm) { return deleteNearSelection(cm, function (range) {
+      if (range.empty()) {
+        var len = getLine(cm.doc, range.head.line).text.length;
+        if (range.head.ch == len && range.head.line < cm.lastLine())
+          { return {from: range.head, to: Pos(range.head.line + 1, 0)} }
+        else
+          { return {from: range.head, to: Pos(range.head.line, len)} }
+      } else {
+        return {from: range.from(), to: range.to()}
+      }
+    }); },
+    deleteLine: function (cm) { return deleteNearSelection(cm, function (range) { return ({
+      from: Pos(range.from().line, 0),
+      to: clipPos(cm.doc, Pos(range.to().line + 1, 0))
+    }); }); },
+    delLineLeft: function (cm) { return deleteNearSelection(cm, function (range) { return ({
+      from: Pos(range.from().line, 0), to: range.from()
+    }); }); },
+    delWrappedLineLeft: function (cm) { return deleteNearSelection(cm, function (range) {
+      var top = cm.charCoords(range.head, "div").top + 5;
+      var leftPos = cm.coordsChar({left: 0, top: top}, "div");
+      return {from: leftPos, to: range.from()}
+    }); },
+    delWrappedLineRight: function (cm) { return deleteNearSelection(cm, function (range) {
+      var top = cm.charCoords(range.head, "div").top + 5;
+      var rightPos = cm.coordsChar({left: cm.display.lineDiv.offsetWidth + 100, top: top}, "div");
+      return {from: range.from(), to: rightPos }
+    }); },
+    undo: function (cm) { return cm.undo(); },
+    redo: function (cm) { return cm.redo(); },
+    undoSelection: function (cm) { return cm.undoSelection(); },
+    redoSelection: function (cm) { return cm.redoSelection(); },
+    goDocStart: function (cm) { return cm.extendSelection(Pos(cm.firstLine(), 0)); },
+    goDocEnd: function (cm) { return cm.extendSelection(Pos(cm.lastLine())); },
+    goLineStart: function (cm) { return cm.extendSelectionsBy(function (range) { return lineStart(cm, range.head.line); },
+      {origin: "+move", bias: 1}
+    ); },
+    goLineStartSmart: function (cm) { return cm.extendSelectionsBy(function (range) { return lineStartSmart(cm, range.head); },
+      {origin: "+move", bias: 1}
+    ); },
+    goLineEnd: function (cm) { return cm.extendSelectionsBy(function (range) { return lineEnd(cm, range.head.line); },
+      {origin: "+move", bias: -1}
+    ); },
+    goLineRight: function (cm) { return cm.extendSelectionsBy(function (range) {
+      var top = cm.cursorCoords(range.head, "div").top + 5;
+      return cm.coordsChar({left: cm.display.lineDiv.offsetWidth + 100, top: top}, "div")
+    }, sel_move); },
+    goLineLeft: function (cm) { return cm.extendSelectionsBy(function (range) {
+      var top = cm.cursorCoords(range.head, "div").top + 5;
+      return cm.coordsChar({left: 0, top: top}, "div")
+    }, sel_move); },
+    goLineLeftSmart: function (cm) { return cm.extendSelectionsBy(function (range) {
+      var top = cm.cursorCoords(range.head, "div").top + 5;
+      var pos = cm.coordsChar({left: 0, top: top}, "div");
+      if (pos.ch < cm.getLine(pos.line).search(/\S/)) { return lineStartSmart(cm, range.head) }
+      return pos
+    }, sel_move); },
+    goLineUp: function (cm) { return cm.moveV(-1, "line"); },
+    goLineDown: function (cm) { return cm.moveV(1, "line"); },
+    goPageUp: function (cm) { return cm.moveV(-1, "page"); },
+    goPageDown: function (cm) { return cm.moveV(1, "page"); },
+    goCharLeft: function (cm) { return cm.moveH(-1, "char"); },
+    goCharRight: function (cm) { return cm.moveH(1, "char"); },
+    goColumnLeft: function (cm) { return cm.moveH(-1, "column"); },
+    goColumnRight: function (cm) { return cm.moveH(1, "column"); },
+    goWordLeft: function (cm) { return cm.moveH(-1, "word"); },
+    goGroupRight: function (cm) { return cm.moveH(1, "group"); },
+    goGroupLeft: function (cm) { return cm.moveH(-1, "group"); },
+    goWordRight: function (cm) { return cm.moveH(1, "word"); },
+    delCharBefore: function (cm) { return cm.deleteH(-1, "char"); },
+    delCharAfter: function (cm) { return cm.deleteH(1, "char"); },
+    delWordBefore: function (cm) { return cm.deleteH(-1, "word"); },
+    delWordAfter: function (cm) { return cm.deleteH(1, "word"); },
+    delGroupBefore: function (cm) { return cm.deleteH(-1, "group"); },
+    delGroupAfter: function (cm) { return cm.deleteH(1, "group"); },
+    indentAuto: function (cm) { return cm.indentSelection("smart"); },
+    indentMore: function (cm) { return cm.indentSelection("add"); },
+    indentLess: function (cm) { return cm.indentSelection("subtract"); },
+    insertTab: function (cm) { return cm.replaceSelection("\t"); },
+    insertSoftTab: function (cm) {
+      var spaces = [], ranges = cm.listSelections(), tabSize = cm.options.tabSize;
+      for (var i = 0; i < ranges.length; i++) {
+        var pos = ranges[i].from();
+        var col = countColumn(cm.getLine(pos.line), pos.ch, tabSize);
+        spaces.push(spaceStr(tabSize - col % tabSize));
+      }
+      cm.replaceSelections(spaces);
+    },
+    defaultTab: function (cm) {
+      if (cm.somethingSelected()) { cm.indentSelection("add"); }
+      else { cm.execCommand("insertTab"); }
+    },
+    // Swap the two chars left and right of each selection's head.
+    // Move cursor behind the two swapped characters afterwards.
+    //
+    // Doesn't consider line feeds a character.
+    // Doesn't scan more than one line above to find a character.
+    // Doesn't do anything on an empty line.
+    // Doesn't do anything with non-empty selections.
+    transposeChars: function (cm) { return runInOp(cm, function () {
+      var ranges = cm.listSelections(), newSel = [];
+      for (var i = 0; i < ranges.length; i++) {
+        if (!ranges[i].empty()) { continue }
+        var cur = ranges[i].head, line = getLine(cm.doc, cur.line).text;
+        if (line) {
+          if (cur.ch == line.length) { cur = new Pos(cur.line, cur.ch - 1); }
+          if (cur.ch > 0) {
+            cur = new Pos(cur.line, cur.ch + 1);
+            cm.replaceRange(line.charAt(cur.ch - 1) + line.charAt(cur.ch - 2),
+                            Pos(cur.line, cur.ch - 2), cur, "+transpose");
+          } else if (cur.line > cm.doc.first) {
+            var prev = getLine(cm.doc, cur.line - 1).text;
+            if (prev) {
+              cur = new Pos(cur.line, 1);
+              cm.replaceRange(line.charAt(0) + cm.doc.lineSeparator() +
+                              prev.charAt(prev.length - 1),
+                              Pos(cur.line - 1, prev.length - 1), cur, "+transpose");
+            }
+          }
+        }
+        newSel.push(new Range(cur, cur));
+      }
+      cm.setSelections(newSel);
+    }); },
+    newlineAndIndent: function (cm) { return runInOp(cm, function () {
+      var sels = cm.listSelections();
+      for (var i = sels.length - 1; i >= 0; i--)
+        { cm.replaceRange(cm.doc.lineSeparator(), sels[i].anchor, sels[i].head, "+input"); }
+      sels = cm.listSelections();
+      for (var i$1 = 0; i$1 < sels.length; i$1++)
+        { cm.indentLine(sels[i$1].from().line, null, true); }
+      ensureCursorVisible(cm);
+    }); },
+    openLine: function (cm) { return cm.replaceSelection("\n", "start"); },
+    toggleOverwrite: function (cm) { return cm.toggleOverwrite(); }
+  };
+
+
+  function lineStart(cm, lineN) {
+    var line = getLine(cm.doc, lineN);
+    var visual = visualLine(line);
+    if (visual != line) { lineN = lineNo(visual); }
+    return endOfLine(true, cm, visual, lineN, 1)
+  }
+  function lineEnd(cm, lineN) {
+    var line = getLine(cm.doc, lineN);
+    var visual = visualLineEnd(line);
+    if (visual != line) { lineN = lineNo(visual); }
+    return endOfLine(true, cm, line, lineN, -1)
+  }
+  function lineStartSmart(cm, pos) {
+    var start = lineStart(cm, pos.line);
+    var line = getLine(cm.doc, start.line);
+    var order = getOrder(line, cm.doc.direction);
+    if (!order || order[0].level == 0) {
+      var firstNonWS = Math.max(0, line.text.search(/\S/));
+      var inWS = pos.line == start.line && pos.ch <= firstNonWS && pos.ch;
+      return Pos(start.line, inWS ? 0 : firstNonWS, start.sticky)
+    }
+    return start
+  }
+
+  // Run a handler that was bound to a key.
+  function doHandleBinding(cm, bound, dropShift) {
+    if (typeof bound == "string") {
+      bound = commands[bound];
+      if (!bound) { return false }
+    }
+    // Ensure previous input has been read, so that the handler sees a
+    // consistent view of the document
+    cm.display.input.ensurePolled();
+    var prevShift = cm.display.shift, done = false;
+    try {
+      if (cm.isReadOnly()) { cm.state.suppressEdits = true; }
+      if (dropShift) { cm.display.shift = false; }
+      done = bound(cm) != Pass;
+    } finally {
+      cm.display.shift = prevShift;
+      cm.state.suppressEdits = false;
+    }
+    return done
+  }
+
+  function lookupKeyForEditor(cm, name, handle) {
+    for (var i = 0; i < cm.state.keyMaps.length; i++) {
+      var result = lookupKey(name, cm.state.keyMaps[i], handle, cm);
+      if (result) { return result }
+    }
+    return (cm.options.extraKeys && lookupKey(name, cm.options.extraKeys, handle, cm))
+      || lookupKey(name, cm.options.keyMap, handle, cm)
+  }
+
+  // Note that, despite the name, this function is also used to check
+  // for bound mouse clicks.
+
+  var stopSeq = new Delayed;
+
+  function dispatchKey(cm, name, e, handle) {
+    var seq = cm.state.keySeq;
+    if (seq) {
+      if (isModifierKey(name)) { return "handled" }
+      if (/\'$/.test(name))
+        { cm.state.keySeq = null; }
+      else
+        { stopSeq.set(50, function () {
+          if (cm.state.keySeq == seq) {
+            cm.state.keySeq = null;
+            cm.display.input.reset();
+          }
+        }); }
+      if (dispatchKeyInner(cm, seq + " " + name, e, handle)) { return true }
+    }
+    return dispatchKeyInner(cm, name, e, handle)
+  }
+
+  function dispatchKeyInner(cm, name, e, handle) {
+    var result = lookupKeyForEditor(cm, name, handle);
+
+    if (result == "multi")
+      { cm.state.keySeq = name; }
+    if (result == "handled")
+      { signalLater(cm, "keyHandled", cm, name, e); }
+
+    if (result == "handled" || result == "multi") {
+      e_preventDefault(e);
+      restartBlink(cm);
+    }
+
+    return !!result
+  }
+
+  // Handle a key from the keydown event.
+  function handleKeyBinding(cm, e) {
+    var name = keyName(e, true);
+    if (!name) { return false }
+
+    if (e.shiftKey && !cm.state.keySeq) {
+      // First try to resolve full name (including 'Shift-'). Failing
+      // that, see if there is a cursor-motion command (starting with
+      // 'go') bound to the keyname without 'Shift-'.
+      return dispatchKey(cm, "Shift-" + name, e, function (b) { return doHandleBinding(cm, b, true); })
+          || dispatchKey(cm, name, e, function (b) {
+               if (typeof b == "string" ? /^go[A-Z]/.test(b) : b.motion)
+                 { return doHandleBinding(cm, b) }
+             })
+    } else {
+      return dispatchKey(cm, name, e, function (b) { return doHandleBinding(cm, b); })
+    }
+  }
+
+  // Handle a key from the keypress event
+  function handleCharBinding(cm, e, ch) {
+    return dispatchKey(cm, "'" + ch + "'", e, function (b) { return doHandleBinding(cm, b, true); })
+  }
+
+  var lastStoppedKey = null;
+  function onKeyDown(e) {
+    var cm = this;
+    cm.curOp.focus = activeElt();
+    if (signalDOMEvent(cm, e)) { return }
+    // IE does strange things with escape.
+    if (ie && ie_version < 11 && e.keyCode == 27) { e.returnValue = false; }
+    var code = e.keyCode;
+    cm.display.shift = code == 16 || e.shiftKey;
+    var handled = handleKeyBinding(cm, e);
+    if (presto) {
+      lastStoppedKey = handled ? code : null;
+      // Opera has no cut event... we try to at least catch the key combo
+      if (!handled && code == 88 && !hasCopyEvent && (mac ? e.metaKey : e.ctrlKey))
+        { cm.replaceSelection("", null, "cut"); }
+    }
+
+    // Turn mouse into crosshair when Alt is held on Mac.
+    if (code == 18 && !/\bCodeMirror-crosshair\b/.test(cm.display.lineDiv.className))
+      { showCrossHair(cm); }
+  }
+
+  function showCrossHair(cm) {
+    var lineDiv = cm.display.lineDiv;
+    addClass(lineDiv, "CodeMirror-crosshair");
+
+    function up(e) {
+      if (e.keyCode == 18 || !e.altKey) {
+        rmClass(lineDiv, "CodeMirror-crosshair");
+        off(document, "keyup", up);
+        off(document, "mouseover", up);
+      }
+    }
+    on(document, "keyup", up);
+    on(document, "mouseover", up);
+  }
+
+  function onKeyUp(e) {
+    if (e.keyCode == 16) { this.doc.sel.shift = false; }
+    signalDOMEvent(this, e);
+  }
+
+  function onKeyPress(e) {
+    var cm = this;
+    if (eventInWidget(cm.display, e) || signalDOMEvent(cm, e) || e.ctrlKey && !e.altKey || mac && e.metaKey) { return }
+    var keyCode = e.keyCode, charCode = e.charCode;
+    if (presto && keyCode == lastStoppedKey) {lastStoppedKey = null; e_preventDefault(e); return}
+    if ((presto && (!e.which || e.which < 10)) && handleKeyBinding(cm, e)) { return }
+    var ch = String.fromCharCode(charCode == null ? keyCode : charCode);
+    // Some browsers fire keypress events for backspace
+    if (ch == "\x08") { return }
+    if (handleCharBinding(cm, e, ch)) { return }
+    cm.display.input.onKeyPress(e);
+  }
+
+  var DOUBLECLICK_DELAY = 400;
+
+  var PastClick = function(time, pos, button) {
+    this.time = time;
+    this.pos = pos;
+    this.button = button;
+  };
+
+  PastClick.prototype.compare = function (time, pos, button) {
+    return this.time + DOUBLECLICK_DELAY > time &&
+      cmp(pos, this.pos) == 0 && button == this.button
+  };
+
+  var lastClick, lastDoubleClick;
+  function clickRepeat(pos, button) {
+    var now = +new Date;
+    if (lastDoubleClick && lastDoubleClick.compare(now, pos, button)) {
+      lastClick = lastDoubleClick = null;
+      return "triple"
+    } else if (lastClick && lastClick.compare(now, pos, button)) {
+      lastDoubleClick = new PastClick(now, pos, button);
+      lastClick = null;
+      return "double"
+    } else {
+      lastClick = new PastClick(now, pos, button);
+      lastDoubleClick = null;
+      return "single"
+    }
+  }
+
+  // A mouse down can be a single click, double click, triple click,
+  // start of selection drag, start of text drag, new cursor
+  // (ctrl-click), rectangle drag (alt-drag), or xwin
+  // middle-click-paste. Or it might be a click on something we should
+  // not interfere with, such as a scrollbar or widget.
+  function onMouseDown(e) {
+    var cm = this, display = cm.display;
+    if (signalDOMEvent(cm, e) || display.activeTouch && display.input.supportsTouch()) { return }
+    display.input.ensurePolled();
+    display.shift = e.shiftKey;
+
+    if (eventInWidget(display, e)) {
+      if (!webkit) {
+        // Briefly turn off draggability, to allow widgets to do
+        // normal dragging things.
+        display.scroller.draggable = false;
+        setTimeout(function () { return display.scroller.draggable = true; }, 100);
+      }
+      return
+    }
+    if (clickInGutter(cm, e)) { return }
+    var pos = posFromMouse(cm, e), button = e_button(e), repeat = pos ? clickRepeat(pos, button) : "single";
+    window.focus();
+
+    // #3261: make sure, that we're not starting a second selection
+    if (button == 1 && cm.state.selectingText)
+      { cm.state.selectingText(e); }
+
+    if (pos && handleMappedButton(cm, button, pos, repeat, e)) { return }
+
+    if (button == 1) {
+      if (pos) { leftButtonDown(cm, pos, repeat, e); }
+      else if (e_target(e) == display.scroller) { e_preventDefault(e); }
+    } else if (button == 2) {
+      if (pos) { extendSelection(cm.doc, pos); }
+      setTimeout(function () { return display.input.focus(); }, 20);
+    } else if (button == 3) {
+      if (captureRightClick) { cm.display.input.onContextMenu(e); }
+      else { delayBlurEvent(cm); }
+    }
+  }
+
+  function handleMappedButton(cm, button, pos, repeat, event) {
+    var name = "Click";
+    if (repeat == "double") { name = "Double" + name; }
+    else if (repeat == "triple") { name = "Triple" + name; }
+    name = (button == 1 ? "Left" : button == 2 ? "Middle" : "Right") + name;
+
+    return dispatchKey(cm,  addModifierNames(name, event), event, function (bound) {
+      if (typeof bound == "string") { bound = commands[bound]; }
+      if (!bound) { return false }
+      var done = false;
+      try {
+        if (cm.isReadOnly()) { cm.state.suppressEdits = true; }
+        done = bound(cm, pos) != Pass;
+      } finally {
+        cm.state.suppressEdits = false;
+      }
+      return done
+    })
+  }
+
+  function configureMouse(cm, repeat, event) {
+    var option = cm.getOption("configureMouse");
+    var value = option ? option(cm, repeat, event) : {};
+    if (value.unit == null) {
+      var rect = chromeOS ? event.shiftKey && event.metaKey : event.altKey;
+      value.unit = rect ? "rectangle" : repeat == "single" ? "char" : repeat == "double" ? "word" : "line";
+    }
+    if (value.extend == null || cm.doc.extend) { value.extend = cm.doc.extend || event.shiftKey; }
+    if (value.addNew == null) { value.addNew = mac ? event.metaKey : event.ctrlKey; }
+    if (value.moveOnDrag == null) { value.moveOnDrag = !(mac ? event.altKey : event.ctrlKey); }
+    return value
+  }
+
+  function leftButtonDown(cm, pos, repeat, event) {
+    if (ie) { setTimeout(bind(ensureFocus, cm), 0); }
+    else { cm.curOp.focus = activeElt(); }
+
+    var behavior = configureMouse(cm, repeat, event);
+
+    var sel = cm.doc.sel, contained;
+    if (cm.options.dragDrop && dragAndDrop && !cm.isReadOnly() &&
+        repeat == "single" && (contained = sel.contains(pos)) > -1 &&
+        (cmp((contained = sel.ranges[contained]).from(), pos) < 0 || pos.xRel > 0) &&
+        (cmp(contained.to(), pos) > 0 || pos.xRel < 0))
+      { leftButtonStartDrag(cm, event, pos, behavior); }
+    else
+      { leftButtonSelect(cm, event, pos, behavior); }
+  }
+
+  // Start a text drag. When it ends, see if any dragging actually
+  // happen, and treat as a click if it didn't.
+  function leftButtonStartDrag(cm, event, pos, behavior) {
+    var display = cm.display, moved = false;
+    var dragEnd = operation(cm, function (e) {
+      if (webkit) { display.scroller.draggable = false; }
+      cm.state.draggingText = false;
+      off(display.wrapper.ownerDocument, "mouseup", dragEnd);
+      off(display.wrapper.ownerDocument, "mousemove", mouseMove);
+      off(display.scroller, "dragstart", dragStart);
+      off(display.scroller, "drop", dragEnd);
+      if (!moved) {
+        e_preventDefault(e);
+        if (!behavior.addNew)
+          { extendSelection(cm.doc, pos, null, null, behavior.extend); }
+        // Work around unexplainable focus problem in IE9 (#2127) and Chrome (#3081)
+        if (webkit || ie && ie_version == 9)
+          { setTimeout(function () {display.wrapper.ownerDocument.body.focus(); display.input.focus();}, 20); }
+        else
+          { display.input.focus(); }
+      }
+    });
+    var mouseMove = function(e2) {
+      moved = moved || Math.abs(event.clientX - e2.clientX) + Math.abs(event.clientY - e2.clientY) >= 10;
+    };
+    var dragStart = function () { return moved = true; };
+    // Let the drag handler handle this.
+    if (webkit) { display.scroller.draggable = true; }
+    cm.state.draggingText = dragEnd;
+    dragEnd.copy = !behavior.moveOnDrag;
+    // IE's approach to draggable
+    if (display.scroller.dragDrop) { display.scroller.dragDrop(); }
+    on(display.wrapper.ownerDocument, "mouseup", dragEnd);
+    on(display.wrapper.ownerDocument, "mousemove", mouseMove);
+    on(display.scroller, "dragstart", dragStart);
+    on(display.scroller, "drop", dragEnd);
+
+    delayBlurEvent(cm);
+    setTimeout(function () { return display.input.focus(); }, 20);
+  }
+
+  function rangeForUnit(cm, pos, unit) {
+    if (unit == "char") { return new Range(pos, pos) }
+    if (unit == "word") { return cm.findWordAt(pos) }
+    if (unit == "line") { return new Range(Pos(pos.line, 0), clipPos(cm.doc, Pos(pos.line + 1, 0))) }
+    var result = unit(cm, pos);
+    return new Range(result.from, result.to)
+  }
+
+  // Normal selection, as opposed to text dragging.
+  function leftButtonSelect(cm, event, start, behavior) {
+    var display = cm.display, doc = cm.doc;
+    e_preventDefault(event);
+
+    var ourRange, ourIndex, startSel = doc.sel, ranges = startSel.ranges;
+    if (behavior.addNew && !behavior.extend) {
+      ourIndex = doc.sel.contains(start);
+      if (ourIndex > -1)
+        { ourRange = ranges[ourIndex]; }
+      else
+        { ourRange = new Range(start, start); }
+    } else {
+      ourRange = doc.sel.primary();
+      ourIndex = doc.sel.primIndex;
+    }
+
+    if (behavior.unit == "rectangle") {
+      if (!behavior.addNew) { ourRange = new Range(start, start); }
+      start = posFromMouse(cm, event, true, true);
+      ourIndex = -1;
+    } else {
+      var range$$1 = rangeForUnit(cm, start, behavior.unit);
+      if (behavior.extend)
+        { ourRange = extendRange(ourRange, range$$1.anchor, range$$1.head, behavior.extend); }
+      else
+        { ourRange = range$$1; }
+    }
+
+    if (!behavior.addNew) {
+      ourIndex = 0;
+      setSelection(doc, new Selection([ourRange], 0), sel_mouse);
+      startSel = doc.sel;
+    } else if (ourIndex == -1) {
+      ourIndex = ranges.length;
+      setSelection(doc, normalizeSelection(cm, ranges.concat([ourRange]), ourIndex),
+                   {scroll: false, origin: "*mouse"});
+    } else if (ranges.length > 1 && ranges[ourIndex].empty() && behavior.unit == "char" && !behavior.extend) {
+      setSelection(doc, normalizeSelection(cm, ranges.slice(0, ourIndex).concat(ranges.slice(ourIndex + 1)), 0),
+                   {scroll: false, origin: "*mouse"});
+      startSel = doc.sel;
+    } else {
+      replaceOneSelection(doc, ourIndex, ourRange, sel_mouse);
+    }
+
+    var lastPos = start;
+    function extendTo(pos) {
+      if (cmp(lastPos, pos) == 0) { return }
+      lastPos = pos;
+
+      if (behavior.unit == "rectangle") {
+        var ranges = [], tabSize = cm.options.tabSize;
+        var startCol = countColumn(getLine(doc, start.line).text, start.ch, tabSize);
+        var posCol = countColumn(getLine(doc, pos.line).text, pos.ch, tabSize);
+        var left = Math.min(startCol, posCol), right = Math.max(startCol, posCol);
+        for (var line = Math.min(start.line, pos.line), end = Math.min(cm.lastLine(), Math.max(start.line, pos.line));
+             line <= end; line++) {
+          var text = getLine(doc, line).text, leftPos = findColumn(text, left, tabSize);
+          if (left == right)
+            { ranges.push(new Range(Pos(line, leftPos), Pos(line, leftPos))); }
+          else if (text.length > leftPos)
+            { ranges.push(new Range(Pos(line, leftPos), Pos(line, findColumn(text, right, tabSize)))); }
+        }
+        if (!ranges.length) { ranges.push(new Range(start, start)); }
+        setSelection(doc, normalizeSelection(cm, startSel.ranges.slice(0, ourIndex).concat(ranges), ourIndex),
+                     {origin: "*mouse", scroll: false});
+        cm.scrollIntoView(pos);
+      } else {
+        var oldRange = ourRange;
+        var range$$1 = rangeForUnit(cm, pos, behavior.unit);
+        var anchor = oldRange.anchor, head;
+        if (cmp(range$$1.anchor, anchor) > 0) {
+          head = range$$1.head;
+          anchor = minPos(oldRange.from(), range$$1.anchor);
+        } else {
+          head = range$$1.anchor;
+          anchor = maxPos(oldRange.to(), range$$1.head);
+        }
+        var ranges$1 = startSel.ranges.slice(0);
+        ranges$1[ourIndex] = bidiSimplify(cm, new Range(clipPos(doc, anchor), head));
+        setSelection(doc, normalizeSelection(cm, ranges$1, ourIndex), sel_mouse);
+      }
+    }
+
+    var editorSize = display.wrapper.getBoundingClientRect();
+    // Used to ensure timeout re-tries don't fire when another extend
+    // happened in the meantime (clearTimeout isn't reliable -- at
+    // least on Chrome, the timeouts still happen even when cleared,
+    // if the clear happens after their scheduled firing time).
+    var counter = 0;
+
+    function extend(e) {
+      var curCount = ++counter;
+      var cur = posFromMouse(cm, e, true, behavior.unit == "rectangle");
+      if (!cur) { return }
+      if (cmp(cur, lastPos) != 0) {
+        cm.curOp.focus = activeElt();
+        extendTo(cur);
+        var visible = visibleLines(display, doc);
+        if (cur.line >= visible.to || cur.line < visible.from)
+          { setTimeout(operation(cm, function () {if (counter == curCount) { extend(e); }}), 150); }
+      } else {
+        var outside = e.clientY < editorSize.top ? -20 : e.clientY > editorSize.bottom ? 20 : 0;
+        if (outside) { setTimeout(operation(cm, function () {
+          if (counter != curCount) { return }
+          display.scroller.scrollTop += outside;
+          extend(e);
+        }), 50); }
+      }
+    }
+
+    function done(e) {
+      cm.state.selectingText = false;
+      counter = Infinity;
+      // If e is null or undefined we interpret this as someone trying
+      // to explicitly cancel the selection rather than the user
+      // letting go of the mouse button.
+      if (e) {
+        e_preventDefault(e);
+        display.input.focus();
+      }
+      off(display.wrapper.ownerDocument, "mousemove", move);
+      off(display.wrapper.ownerDocument, "mouseup", up);
+      doc.history.lastSelOrigin = null;
+    }
+
+    var move = operation(cm, function (e) {
+      if (e.buttons === 0 || !e_button(e)) { done(e); }
+      else { extend(e); }
+    });
+    var up = operation(cm, done);
+    cm.state.selectingText = up;
+    on(display.wrapper.ownerDocument, "mousemove", move);
+    on(display.wrapper.ownerDocument, "mouseup", up);
+  }
+
+  // Used when mouse-selecting to adjust the anchor to the proper side
+  // of a bidi jump depending on the visual position of the head.
+  function bidiSimplify(cm, range$$1) {
+    var anchor = range$$1.anchor;
+    var head = range$$1.head;
+    var anchorLine = getLine(cm.doc, anchor.line);
+    if (cmp(anchor, head) == 0 && anchor.sticky == head.sticky) { return range$$1 }
+    var order = getOrder(anchorLine);
+    if (!order) { return range$$1 }
+    var index = getBidiPartAt(order, anchor.ch, anchor.sticky), part = order[index];
+    if (part.from != anchor.ch && part.to != anchor.ch) { return range$$1 }
+    var boundary = index + ((part.from == anchor.ch) == (part.level != 1) ? 0 : 1);
+    if (boundary == 0 || boundary == order.length) { return range$$1 }
+
+    // Compute the relative visual position of the head compared to the
+    // anchor (<0 is to the left, >0 to the right)
+    var leftSide;
+    if (head.line != anchor.line) {
+      leftSide = (head.line - anchor.line) * (cm.doc.direction == "ltr" ? 1 : -1) > 0;
+    } else {
+      var headIndex = getBidiPartAt(order, head.ch, head.sticky);
+      var dir = headIndex - index || (head.ch - anchor.ch) * (part.level == 1 ? -1 : 1);
+      if (headIndex == boundary - 1 || headIndex == boundary)
+        { leftSide = dir < 0; }
+      else
+        { leftSide = dir > 0; }
+    }
+
+    var usePart = order[boundary + (leftSide ? -1 : 0)];
+    var from = leftSide == (usePart.level == 1);
+    var ch = from ? usePart.from : usePart.to, sticky = from ? "after" : "before";
+    return anchor.ch == ch && anchor.sticky == sticky ? range$$1 : new Range(new Pos(anchor.line, ch, sticky), head)
+  }
+
+
+  // Determines whether an event happened in the gutter, and fires the
+  // handlers for the corresponding event.
+  function gutterEvent(cm, e, type, prevent) {
+    var mX, mY;
+    if (e.touches) {
+      mX = e.touches[0].clientX;
+      mY = e.touches[0].clientY;
+    } else {
+      try { mX = e.clientX; mY = e.clientY; }
+      catch(e) { return false }
+    }
+    if (mX >= Math.floor(cm.display.gutters.getBoundingClientRect().right)) { return false }
+    if (prevent) { e_preventDefault(e); }
+
+    var display = cm.display;
+    var lineBox = display.lineDiv.getBoundingClientRect();
+
+    if (mY > lineBox.bottom || !hasHandler(cm, type)) { return e_defaultPrevented(e) }
+    mY -= lineBox.top - display.viewOffset;
+
+    for (var i = 0; i < cm.display.gutterSpecs.length; ++i) {
+      var g = display.gutters.childNodes[i];
+      if (g && g.getBoundingClientRect().right >= mX) {
+        var line = lineAtHeight(cm.doc, mY);
+        var gutter = cm.display.gutterSpecs[i];
+        signal(cm, type, cm, line, gutter.className, e);
+        return e_defaultPrevented(e)
+      }
+    }
+  }
+
+  function clickInGutter(cm, e) {
+    return gutterEvent(cm, e, "gutterClick", true)
+  }
+
+  // CONTEXT MENU HANDLING
+
+  // To make the context menu work, we need to briefly unhide the
+  // textarea (making it as unobtrusive as possible) to let the
+  // right-click take effect on it.
+  function onContextMenu(cm, e) {
+    if (eventInWidget(cm.display, e) || contextMenuInGutter(cm, e)) { return }
+    if (signalDOMEvent(cm, e, "contextmenu")) { return }
+    if (!captureRightClick) { cm.display.input.onContextMenu(e); }
+  }
+
+  function contextMenuInGutter(cm, e) {
+    if (!hasHandler(cm, "gutterContextMenu")) { return false }
+    return gutterEvent(cm, e, "gutterContextMenu", false)
+  }
+
+  function themeChanged(cm) {
+    cm.display.wrapper.className = cm.display.wrapper.className.replace(/\s*cm-s-\S+/g, "") +
+      cm.options.theme.replace(/(^|\s)\s*/g, " cm-s-");
+    clearCaches(cm);
+  }
+
+  var Init = {toString: function(){return "CodeMirror.Init"}};
+
+  var defaults = {};
+  var optionHandlers = {};
+
+  function defineOptions(CodeMirror) {
+    var optionHandlers = CodeMirror.optionHandlers;
+
+    function option(name, deflt, handle, notOnInit) {
+      CodeMirror.defaults[name] = deflt;
+      if (handle) { optionHandlers[name] =
+        notOnInit ? function (cm, val, old) {if (old != Init) { handle(cm, val, old); }} : handle; }
+    }
+
+    CodeMirror.defineOption = option;
+
+    // Passed to option handlers when there is no old value.
+    CodeMirror.Init = Init;
+
+    // These two are, on init, called from the constructor because they
+    // have to be initialized before the editor can start at all.
+    option("value", "", function (cm, val) { return cm.setValue(val); }, true);
+    option("mode", null, function (cm, val) {
+      cm.doc.modeOption = val;
+      loadMode(cm);
+    }, true);
+
+    option("indentUnit", 2, loadMode, true);
+    option("indentWithTabs", false);
+    option("smartIndent", true);
+    option("tabSize", 4, function (cm) {
+      resetModeState(cm);
+      clearCaches(cm);
+      regChange(cm);
+    }, true);
+
+    option("lineSeparator", null, function (cm, val) {
+      cm.doc.lineSep = val;
+      if (!val) { return }
+      var newBreaks = [], lineNo = cm.doc.first;
+      cm.doc.iter(function (line) {
+        for (var pos = 0;;) {
+          var found = line.text.indexOf(val, pos);
+          if (found == -1) { break }
+          pos = found + val.length;
+          newBreaks.push(Pos(lineNo, found));
+        }
+        lineNo++;
+      });
+      for (var i = newBreaks.length - 1; i >= 0; i--)
+        { replaceRange(cm.doc, val, newBreaks[i], Pos(newBreaks[i].line, newBreaks[i].ch + val.length)); }
+    });
+    option("specialChars", /[\u0000-\u001f\u007f-\u009f\u00ad\u061c\u200b-\u200f\u2028\u2029\ufeff\ufff9-\ufffc]/g, function (cm, val, old) {
+      cm.state.specialChars = new RegExp(val.source + (val.test("\t") ? "" : "|\t"), "g");
+      if (old != Init) { cm.refresh(); }
+    });
+    option("specialCharPlaceholder", defaultSpecialCharPlaceholder, function (cm) { return cm.refresh(); }, true);
+    option("electricChars", true);
+    option("inputStyle", mobile ? "contenteditable" : "textarea", function () {
+      throw new Error("inputStyle can not (yet) be changed in a running editor") // FIXME
+    }, true);
+    option("spellcheck", false, function (cm, val) { return cm.getInputField().spellcheck = val; }, true);
+    option("autocorrect", false, function (cm, val) { return cm.getInputField().autocorrect = val; }, true);
+    option("autocapitalize", false, function (cm, val) { return cm.getInputField().autocapitalize = val; }, true);
+    option("rtlMoveVisually", !windows);
+    option("wholeLineUpdateBefore", true);
+
+    option("theme", "default", function (cm) {
+      themeChanged(cm);
+      updateGutters(cm);
+    }, true);
+    option("keyMap", "default", function (cm, val, old) {
+      var next = getKeyMap(val);
+      var prev = old != Init && getKeyMap(old);
+      if (prev && prev.detach) { prev.detach(cm, next); }
+      if (next.attach) { next.attach(cm, prev || null); }
+    });
+    option("extraKeys", null);
+    option("configureMouse", null);
+
+    option("lineWrapping", false, wrappingChanged, true);
+    option("gutters", [], function (cm, val) {
+      cm.display.gutterSpecs = getGutters(val, cm.options.lineNumbers);
+      updateGutters(cm);
+    }, true);
+    option("fixedGutter", true, function (cm, val) {
+      cm.display.gutters.style.left = val ? compensateForHScroll(cm.display) + "px" : "0";
+      cm.refresh();
+    }, true);
+    option("coverGutterNextToScrollbar", false, function (cm) { return updateScrollbars(cm); }, true);
+    option("scrollbarStyle", "native", function (cm) {
+      initScrollbars(cm);
+      updateScrollbars(cm);
+      cm.display.scrollbars.setScrollTop(cm.doc.scrollTop);
+      cm.display.scrollbars.setScrollLeft(cm.doc.scrollLeft);
+    }, true);
+    option("lineNumbers", false, function (cm, val) {
+      cm.display.gutterSpecs = getGutters(cm.options.gutters, val);
+      updateGutters(cm);
+    }, true);
+    option("firstLineNumber", 1, updateGutters, true);
+    option("lineNumberFormatter", function (integer) { return integer; }, updateGutters, true);
+    option("showCursorWhenSelecting", false, updateSelection, true);
+
+    option("resetSelectionOnContextMenu", true);
+    option("lineWiseCopyCut", true);
+    option("pasteLinesPerSelection", true);
+    option("selectionsMayTouch", false);
+
+    option("readOnly", false, function (cm, val) {
+      if (val == "nocursor") {
+        onBlur(cm);
+        cm.display.input.blur();
+      }
+      cm.display.input.readOnlyChanged(val);
+    });
+    option("disableInput", false, function (cm, val) {if (!val) { cm.display.input.reset(); }}, true);
+    option("dragDrop", true, dragDropChanged);
+    option("allowDropFileTypes", null);
+
+    option("cursorBlinkRate", 530);
+    option("cursorScrollMargin", 0);
+    option("cursorHeight", 1, updateSelection, true);
+    option("singleCursorHeightPerLine", true, updateSelection, true);
+    option("workTime", 100);
+    option("workDelay", 100);
+    option("flattenSpans", true, resetModeState, true);
+    option("addModeClass", false, resetModeState, true);
+    option("pollInterval", 100);
+    option("undoDepth", 200, function (cm, val) { return cm.doc.history.undoDepth = val; });
+    option("historyEventDelay", 1250);
+    option("viewportMargin", 10, function (cm) { return cm.refresh(); }, true);
+    option("maxHighlightLength", 10000, resetModeState, true);
+    option("moveInputWithCursor", true, function (cm, val) {
+      if (!val) { cm.display.input.resetPosition(); }
+    });
+
+    option("tabindex", null, function (cm, val) { return cm.display.input.getField().tabIndex = val || ""; });
+    option("autofocus", null);
+    option("direction", "ltr", function (cm, val) { return cm.doc.setDirection(val); }, true);
+    option("phrases", null);
+  }
+
+  function dragDropChanged(cm, value, old) {
+    var wasOn = old && old != Init;
+    if (!value != !wasOn) {
+      var funcs = cm.display.dragFunctions;
+      var toggle = value ? on : off;
+      toggle(cm.display.scroller, "dragstart", funcs.start);
+      toggle(cm.display.scroller, "dragenter", funcs.enter);
+      toggle(cm.display.scroller, "dragover", funcs.over);
+      toggle(cm.display.scroller, "dragleave", funcs.leave);
+      toggle(cm.display.scroller, "drop", funcs.drop);
+    }
+  }
+
+  function wrappingChanged(cm) {
+    if (cm.options.lineWrapping) {
+      addClass(cm.display.wrapper, "CodeMirror-wrap");
+      cm.display.sizer.style.minWidth = "";
+      cm.display.sizerWidth = null;
+    } else {
+      rmClass(cm.display.wrapper, "CodeMirror-wrap");
+      findMaxLine(cm);
+    }
+    estimateLineHeights(cm);
+    regChange(cm);
+    clearCaches(cm);
+    setTimeout(function () { return updateScrollbars(cm); }, 100);
+  }
+
+  // A CodeMirror instance represents an editor. This is the object
+  // that user code is usually dealing with.
+
+  function CodeMirror(place, options) {
+    var this$1 = this;
+
+    if (!(this instanceof CodeMirror)) { return new CodeMirror(place, options) }
+
+    this.options = options = options ? copyObj(options) : {};
+    // Determine effective options based on given values and defaults.
+    copyObj(defaults, options, false);
+
+    var doc = options.value;
+    if (typeof doc == "string") { doc = new Doc(doc, options.mode, null, options.lineSeparator, options.direction); }
+    else if (options.mode) { doc.modeOption = options.mode; }
+    this.doc = doc;
+
+    var input = new CodeMirror.inputStyles[options.inputStyle](this);
+    var display = this.display = new Display(place, doc, input, options);
+    display.wrapper.CodeMirror = this;
+    themeChanged(this);
+    if (options.lineWrapping)
+      { this.display.wrapper.className += " CodeMirror-wrap"; }
+    initScrollbars(this);
+
+    this.state = {
+      keyMaps: [],  // stores maps added by addKeyMap
+      overlays: [], // highlighting overlays, as added by addOverlay
+      modeGen: 0,   // bumped when mode/overlay changes, used to invalidate highlighting info
+      overwrite: false,
+      delayingBlurEvent: false,
+      focused: false,
+      suppressEdits: false, // used to disable editing during key handlers when in readOnly mode
+      pasteIncoming: -1, cutIncoming: -1, // help recognize paste/cut edits in input.poll
+      selectingText: false,
+      draggingText: false,
+      highlight: new Delayed(), // stores highlight worker timeout
+      keySeq: null,  // Unfinished key sequence
+      specialChars: null
+    };
+
+    if (options.autofocus && !mobile) { display.input.focus(); }
+
+    // Override magic textarea content restore that IE sometimes does
+    // on our hidden textarea on reload
+    if (ie && ie_version < 11) { setTimeout(function () { return this$1.display.input.reset(true); }, 20); }
+
+    registerEventHandlers(this);
+    ensureGlobalHandlers();
+
+    startOperation(this);
+    this.curOp.forceUpdate = true;
+    attachDoc(this, doc);
+
+    if ((options.autofocus && !mobile) || this.hasFocus())
+      { setTimeout(bind(onFocus, this), 20); }
+    else
+      { onBlur(this); }
+
+    for (var opt in optionHandlers) { if (optionHandlers.hasOwnProperty(opt))
+      { optionHandlers[opt](this$1, options[opt], Init); } }
+    maybeUpdateLineNumberWidth(this);
+    if (options.finishInit) { options.finishInit(this); }
+    for (var i = 0; i < initHooks.length; ++i) { initHooks[i](this$1); }
+    endOperation(this);
+    // Suppress optimizelegibility in Webkit, since it breaks text
+    // measuring on line wrapping boundaries.
+    if (webkit && options.lineWrapping &&
+        getComputedStyle(display.lineDiv).textRendering == "optimizelegibility")
+      { display.lineDiv.style.textRendering = "auto"; }
+  }
+
+  // The default configuration options.
+  CodeMirror.defaults = defaults;
+  // Functions to run when options are changed.
+  CodeMirror.optionHandlers = optionHandlers;
+
+  // Attach the necessary event handlers when initializing the editor
+  function registerEventHandlers(cm) {
+    var d = cm.display;
+    on(d.scroller, "mousedown", operation(cm, onMouseDown));
+    // Older IE's will not fire a second mousedown for a double click
+    if (ie && ie_version < 11)
+      { on(d.scroller, "dblclick", operation(cm, function (e) {
+        if (signalDOMEvent(cm, e)) { return }
+        var pos = posFromMouse(cm, e);
+        if (!pos || clickInGutter(cm, e) || eventInWidget(cm.display, e)) { return }
+        e_preventDefault(e);
+        var word = cm.findWordAt(pos);
+        extendSelection(cm.doc, word.anchor, word.head);
+      })); }
+    else
+      { on(d.scroller, "dblclick", function (e) { return signalDOMEvent(cm, e) || e_preventDefault(e); }); }
+    // Some browsers fire contextmenu *after* opening the menu, at
+    // which point we can't mess with it anymore. Context menu is
+    // handled in onMouseDown for these browsers.
+    on(d.scroller, "contextmenu", function (e) { return onContextMenu(cm, e); });
+
+    // Used to suppress mouse event handling when a touch happens
+    var touchFinished, prevTouch = {end: 0};
+    function finishTouch() {
+      if (d.activeTouch) {
+        touchFinished = setTimeout(function () { return d.activeTouch = null; }, 1000);
+        prevTouch = d.activeTouch;
+        prevTouch.end = +new Date;
+      }
+    }
+    function isMouseLikeTouchEvent(e) {
+      if (e.touches.length != 1) { return false }
+      var touch = e.touches[0];
+      return touch.radiusX <= 1 && touch.radiusY <= 1
+    }
+    function farAway(touch, other) {
+      if (other.left == null) { return true }
+      var dx = other.left - touch.left, dy = other.top - touch.top;
+      return dx * dx + dy * dy > 20 * 20
+    }
+    on(d.scroller, "touchstart", function (e) {
+      if (!signalDOMEvent(cm, e) && !isMouseLikeTouchEvent(e) && !clickInGutter(cm, e)) {
+        d.input.ensurePolled();
+        clearTimeout(touchFinished);
+        var now = +new Date;
+        d.activeTouch = {start: now, moved: false,
+                         prev: now - prevTouch.end <= 300 ? prevTouch : null};
+        if (e.touches.length == 1) {
+          d.activeTouch.left = e.touches[0].pageX;
+          d.activeTouch.top = e.touches[0].pageY;
+        }
+      }
+    });
+    on(d.scroller, "touchmove", function () {
+      if (d.activeTouch) { d.activeTouch.moved = true; }
+    });
+    on(d.scroller, "touchend", function (e) {
+      var touch = d.activeTouch;
+      if (touch && !eventInWidget(d, e) && touch.left != null &&
+          !touch.moved && new Date - touch.start < 300) {
+        var pos = cm.coordsChar(d.activeTouch, "page"), range;
+        if (!touch.prev || farAway(touch, touch.prev)) // Single tap
+          { range = new Range(pos, pos); }
+        else if (!touch.prev.prev || farAway(touch, touch.prev.prev)) // Double tap
+          { range = cm.findWordAt(pos); }
+        else // Triple tap
+          { range = new Range(Pos(pos.line, 0), clipPos(cm.doc, Pos(pos.line + 1, 0))); }
+        cm.setSelection(range.anchor, range.head);
+        cm.focus();
+        e_preventDefault(e);
+      }
+      finishTouch();
+    });
+    on(d.scroller, "touchcancel", finishTouch);
+
+    // Sync scrolling between fake scrollbars and real scrollable
+    // area, ensure viewport is updated when scrolling.
+    on(d.scroller, "scroll", function () {
+      if (d.scroller.clientHeight) {
+        updateScrollTop(cm, d.scroller.scrollTop);
+        setScrollLeft(cm, d.scroller.scrollLeft, true);
+        signal(cm, "scroll", cm);
+      }
+    });
+
+    // Listen to wheel events in order to try and update the viewport on time.
+    on(d.scroller, "mousewheel", function (e) { return onScrollWheel(cm, e); });
+    on(d.scroller, "DOMMouseScroll", function (e) { return onScrollWheel(cm, e); });
+
+    // Prevent wrapper from ever scrolling
+    on(d.wrapper, "scroll", function () { return d.wrapper.scrollTop = d.wrapper.scrollLeft = 0; });
+
+    d.dragFunctions = {
+      enter: function (e) {if (!signalDOMEvent(cm, e)) { e_stop(e); }},
+      over: function (e) {if (!signalDOMEvent(cm, e)) { onDragOver(cm, e); e_stop(e); }},
+      start: function (e) { return onDragStart(cm, e); },
+      drop: operation(cm, onDrop),
+      leave: function (e) {if (!signalDOMEvent(cm, e)) { clearDragCursor(cm); }}
+    };
+
+    var inp = d.input.getField();
+    on(inp, "keyup", function (e) { return onKeyUp.call(cm, e); });
+    on(inp, "keydown", operation(cm, onKeyDown));
+    on(inp, "keypress", operation(cm, onKeyPress));
+    on(inp, "focus", function (e) { return onFocus(cm, e); });
+    on(inp, "blur", function (e) { return onBlur(cm, e); });
+  }
+
+  var initHooks = [];
+  CodeMirror.defineInitHook = function (f) { return initHooks.push(f); };
+
+  // Indent the given line. The how parameter can be "smart",
+  // "add"/null, "subtract", or "prev". When aggressive is false
+  // (typically set to true for forced single-line indents), empty
+  // lines are not indented, and places where the mode returns Pass
+  // are left alone.
+  function indentLine(cm, n, how, aggressive) {
+    var doc = cm.doc, state;
+    if (how == null) { how = "add"; }
+    if (how == "smart") {
+      // Fall back to "prev" when the mode doesn't have an indentation
+      // method.
+      if (!doc.mode.indent) { how = "prev"; }
+      else { state = getContextBefore(cm, n).state; }
+    }
+
+    var tabSize = cm.options.tabSize;
+    var line = getLine(doc, n), curSpace = countColumn(line.text, null, tabSize);
+    if (line.stateAfter) { line.stateAfter = null; }
+    var curSpaceString = line.text.match(/^\s*/)[0], indentation;
+    if (!aggressive && !/\S/.test(line.text)) {
+      indentation = 0;
+      how = "not";
+    } else if (how == "smart") {
+      indentation = doc.mode.indent(state, line.text.slice(curSpaceString.length), line.text);
+      if (indentation == Pass || indentation > 150) {
+        if (!aggressive) { return }
+        how = "prev";
+      }
+    }
+    if (how == "prev") {
+      if (n > doc.first) { indentation = countColumn(getLine(doc, n-1).text, null, tabSize); }
+      else { indentation = 0; }
+    } else if (how == "add") {
+      indentation = curSpace + cm.options.indentUnit;
+    } else if (how == "subtract") {
+      indentation = curSpace - cm.options.indentUnit;
+    } else if (typeof how == "number") {
+      indentation = curSpace + how;
+    }
+    indentation = Math.max(0, indentation);
+
+    var indentString = "", pos = 0;
+    if (cm.options.indentWithTabs)
+      { for (var i = Math.floor(indentation / tabSize); i; --i) {pos += tabSize; indentString += "\t";} }
+    if (pos < indentation) { indentString += spaceStr(indentation - pos); }
+
+    if (indentString != curSpaceString) {
+      replaceRange(doc, indentString, Pos(n, 0), Pos(n, curSpaceString.length), "+input");
+      line.stateAfter = null;
+      return true
+    } else {
+      // Ensure that, if the cursor was in the whitespace at the start
+      // of the line, it is moved to the end of that space.
+      for (var i$1 = 0; i$1 < doc.sel.ranges.length; i$1++) {
+        var range = doc.sel.ranges[i$1];
+        if (range.head.line == n && range.head.ch < curSpaceString.length) {
+          var pos$1 = Pos(n, curSpaceString.length);
+          replaceOneSelection(doc, i$1, new Range(pos$1, pos$1));
+          break
+        }
+      }
+    }
+  }
+
+  // This will be set to a {lineWise: bool, text: [string]} object, so
+  // that, when pasting, we know what kind of selections the copied
+  // text was made out of.
+  var lastCopied = null;
+
+  function setLastCopied(newLastCopied) {
+    lastCopied = newLastCopied;
+  }
+
+  function applyTextInput(cm, inserted, deleted, sel, origin) {
+    var doc = cm.doc;
+    cm.display.shift = false;
+    if (!sel) { sel = doc.sel; }
+
+    var recent = +new Date - 200;
+    var paste = origin == "paste" || cm.state.pasteIncoming > recent;
+    var textLines = splitLinesAuto(inserted), multiPaste = null;
+    // When pasting N lines into N selections, insert one line per selection
+    if (paste && sel.ranges.length > 1) {
+      if (lastCopied && lastCopied.text.join("\n") == inserted) {
+        if (sel.ranges.length % lastCopied.text.length == 0) {
+          multiPaste = [];
+          for (var i = 0; i < lastCopied.text.length; i++)
+            { multiPaste.push(doc.splitLines(lastCopied.text[i])); }
+        }
+      } else if (textLines.length == sel.ranges.length && cm.options.pasteLinesPerSelection) {
+        multiPaste = map(textLines, function (l) { return [l]; });
+      }
+    }
+
+    var updateInput = cm.curOp.updateInput;
+    // Normal behavior is to insert the new text into every selection
+    for (var i$1 = sel.ranges.length - 1; i$1 >= 0; i$1--) {
+      var range$$1 = sel.ranges[i$1];
+      var from = range$$1.from(), to = range$$1.to();
+      if (range$$1.empty()) {
+        if (deleted && deleted > 0) // Handle deletion
+          { from = Pos(from.line, from.ch - deleted); }
+        else if (cm.state.overwrite && !paste) // Handle overwrite
+          { to = Pos(to.line, Math.min(getLine(doc, to.line).text.length, to.ch + lst(textLines).length)); }
+        else if (paste && lastCopied && lastCopied.lineWise && lastCopied.text.join("\n") == inserted)
+          { from = to = Pos(from.line, 0); }
+      }
+      var changeEvent = {from: from, to: to, text: multiPaste ? multiPaste[i$1 % multiPaste.length] : textLines,
+                         origin: origin || (paste ? "paste" : cm.state.cutIncoming > recent ? "cut" : "+input")};
+      makeChange(cm.doc, changeEvent);
+      signalLater(cm, "inputRead", cm, changeEvent);
+    }
+    if (inserted && !paste)
+      { triggerElectric(cm, inserted); }
+
+    ensureCursorVisible(cm);
+    if (cm.curOp.updateInput < 2) { cm.curOp.updateInput = updateInput; }
+    cm.curOp.typing = true;
+    cm.state.pasteIncoming = cm.state.cutIncoming = -1;
+  }
+
+  function handlePaste(e, cm) {
+    var pasted = e.clipboardData && e.clipboardData.getData("Text");
+    if (pasted) {
+      e.preventDefault();
+      if (!cm.isReadOnly() && !cm.options.disableInput)
+        { runInOp(cm, function () { return applyTextInput(cm, pasted, 0, null, "paste"); }); }
+      return true
+    }
+  }
+
+  function triggerElectric(cm, inserted) {
+    // When an 'electric' character is inserted, immediately trigger a reindent
+    if (!cm.options.electricChars || !cm.options.smartIndent) { return }
+    var sel = cm.doc.sel;
+
+    for (var i = sel.ranges.length - 1; i >= 0; i--) {
+      var range$$1 = sel.ranges[i];
+      if (range$$1.head.ch > 100 || (i && sel.ranges[i - 1].head.line == range$$1.head.line)) { continue }
+      var mode = cm.getModeAt(range$$1.head);
+      var indented = false;
+      if (mode.electricChars) {
+        for (var j = 0; j < mode.electricChars.length; j++)
+          { if (inserted.indexOf(mode.electricChars.charAt(j)) > -1) {
+            indented = indentLine(cm, range$$1.head.line, "smart");
+            break
+          } }
+      } else if (mode.electricInput) {
+        if (mode.electricInput.test(getLine(cm.doc, range$$1.head.line).text.slice(0, range$$1.head.ch)))
+          { indented = indentLine(cm, range$$1.head.line, "smart"); }
+      }
+      if (indented) { signalLater(cm, "electricInput", cm, range$$1.head.line); }
+    }
+  }
+
+  function copyableRanges(cm) {
+    var text = [], ranges = [];
+    for (var i = 0; i < cm.doc.sel.ranges.length; i++) {
+      var line = cm.doc.sel.ranges[i].head.line;
+      var lineRange = {anchor: Pos(line, 0), head: Pos(line + 1, 0)};
+      ranges.push(lineRange);
+      text.push(cm.getRange(lineRange.anchor, lineRange.head));
+    }
+    return {text: text, ranges: ranges}
+  }
+
+  function disableBrowserMagic(field, spellcheck, autocorrect, autocapitalize) {
+    field.setAttribute("autocorrect", autocorrect ? "" : "off");
+    field.setAttribute("autocapitalize", autocapitalize ? "" : "off");
+    field.setAttribute("spellcheck", !!spellcheck);
+  }
+
+  function hiddenTextarea() {
+    var te = elt("textarea", null, null, "position: absolute; bottom: -1em; padding: 0; width: 1px; height: 1em; outline: none");
+    var div = elt("div", [te], null, "overflow: hidden; position: relative; width: 3px; height: 0px;");
+    // The textarea is kept positioned near the cursor to prevent the
+    // fact that it'll be scrolled into view on input from scrolling
+    // our fake cursor out of view. On webkit, when wrap=off, paste is
+    // very slow. So make the area wide instead.
+    if (webkit) { te.style.width = "1000px"; }
+    else { te.setAttribute("wrap", "off"); }
+    // If border: 0; -- iOS fails to open keyboard (issue #1287)
+    if (ios) { te.style.border = "1px solid black"; }
+    disableBrowserMagic(te);
+    return div
+  }
+
+  // The publicly visible API. Note that methodOp(f) means
+  // 'wrap f in an operation, performed on its `this` parameter'.
+
+  // This is not the complete set of editor methods. Most of the
+  // methods defined on the Doc type are also injected into
+  // CodeMirror.prototype, for backwards compatibility and
+  // convenience.
+
+  function addEditorMethods(CodeMirror) {
+    var optionHandlers = CodeMirror.optionHandlers;
+
+    var helpers = CodeMirror.helpers = {};
+
+    CodeMirror.prototype = {
+      constructor: CodeMirror,
+      focus: function(){window.focus(); this.display.input.focus();},
+
+      setOption: function(option, value) {
+        var options = this.options, old = options[option];
+        if (options[option] == value && option != "mode") { return }
+        options[option] = value;
+        if (optionHandlers.hasOwnProperty(option))
+          { operation(this, optionHandlers[option])(this, value, old); }
+        signal(this, "optionChange", this, option);
+      },
+
+      getOption: function(option) {return this.options[option]},
+      getDoc: function() {return this.doc},
+
+      addKeyMap: function(map$$1, bottom) {
+        this.state.keyMaps[bottom ? "push" : "unshift"](getKeyMap(map$$1));
+      },
+      removeKeyMap: function(map$$1) {
+        var maps = this.state.keyMaps;
+        for (var i = 0; i < maps.length; ++i)
+          { if (maps[i] == map$$1 || maps[i].name == map$$1) {
+            maps.splice(i, 1);
+            return true
+          } }
+      },
+
+      addOverlay: methodOp(function(spec, options) {
+        var mode = spec.token ? spec : CodeMirror.getMode(this.options, spec);
+        if (mode.startState) { throw new Error("Overlays may not be stateful.") }
+        insertSorted(this.state.overlays,
+                     {mode: mode, modeSpec: spec, opaque: options && options.opaque,
+                      priority: (options && options.priority) || 0},
+                     function (overlay) { return overlay.priority; });
+        this.state.modeGen++;
+        regChange(this);
+      }),
+      removeOverlay: methodOp(function(spec) {
+        var this$1 = this;
+
+        var overlays = this.state.overlays;
+        for (var i = 0; i < overlays.length; ++i) {
+          var cur = overlays[i].modeSpec;
+          if (cur == spec || typeof spec == "string" && cur.name == spec) {
+            overlays.splice(i, 1);
+            this$1.state.modeGen++;
+            regChange(this$1);
+            return
+          }
+        }
+      }),
+
+      indentLine: methodOp(function(n, dir, aggressive) {
+        if (typeof dir != "string" && typeof dir != "number") {
+          if (dir == null) { dir = this.options.smartIndent ? "smart" : "prev"; }
+          else { dir = dir ? "add" : "subtract"; }
+        }
+        if (isLine(this.doc, n)) { indentLine(this, n, dir, aggressive); }
+      }),
+      indentSelection: methodOp(function(how) {
+        var this$1 = this;
+
+        var ranges = this.doc.sel.ranges, end = -1;
+        for (var i = 0; i < ranges.length; i++) {
+          var range$$1 = ranges[i];
+          if (!range$$1.empty()) {
+            var from = range$$1.from(), to = range$$1.to();
+            var start = Math.max(end, from.line);
+            end = Math.min(this$1.lastLine(), to.line - (to.ch ? 0 : 1)) + 1;
+            for (var j = start; j < end; ++j)
+              { indentLine(this$1, j, how); }
+            var newRanges = this$1.doc.sel.ranges;
+            if (from.ch == 0 && ranges.length == newRanges.length && newRanges[i].from().ch > 0)
+              { replaceOneSelection(this$1.doc, i, new Range(from, newRanges[i].to()), sel_dontScroll); }
+          } else if (range$$1.head.line > end) {
+            indentLine(this$1, range$$1.head.line, how, true);
+            end = range$$1.head.line;
+            if (i == this$1.doc.sel.primIndex) { ensureCursorVisible(this$1); }
+          }
+        }
+      }),
+
+      // Fetch the parser token for a given character. Useful for hacks
+      // that want to inspect the mode state (say, for completion).
+      getTokenAt: function(pos, precise) {
+        return takeToken(this, pos, precise)
+      },
+
+      getLineTokens: function(line, precise) {
+        return takeToken(this, Pos(line), precise, true)
+      },
+
+      getTokenTypeAt: function(pos) {
+        pos = clipPos(this.doc, pos);
+        var styles = getLineStyles(this, getLine(this.doc, pos.line));
+        var before = 0, after = (styles.length - 1) / 2, ch = pos.ch;
+        var type;
+        if (ch == 0) { type = styles[2]; }
+        else { for (;;) {
+          var mid = (before + after) >> 1;
+          if ((mid ? styles[mid * 2 - 1] : 0) >= ch) { after = mid; }
+          else if (styles[mid * 2 + 1] < ch) { before = mid + 1; }
+          else { type = styles[mid * 2 + 2]; break }
+        } }
+        var cut = type ? type.indexOf("overlay ") : -1;
+        return cut < 0 ? type : cut == 0 ? null : type.slice(0, cut - 1)
+      },
+
+      getModeAt: function(pos) {
+        var mode = this.doc.mode;
+        if (!mode.innerMode) { return mode }
+        return CodeMirror.innerMode(mode, this.getTokenAt(pos).state).mode
+      },
+
+      getHelper: function(pos, type) {
+        return this.getHelpers(pos, type)[0]
+      },
+
+      getHelpers: function(pos, type) {
+        var this$1 = this;
+
+        var found = [];
+        if (!helpers.hasOwnProperty(type)) { return found }
+        var help = helpers[type], mode = this.getModeAt(pos);
+        if (typeof mode[type] == "string") {
+          if (help[mode[type]]) { found.push(help[mode[type]]); }
+        } else if (mode[type]) {
+          for (var i = 0; i < mode[type].length; i++) {
+            var val = help[mode[type][i]];
+            if (val) { found.push(val); }
+          }
+        } else if (mode.helperType && help[mode.helperType]) {
+          found.push(help[mode.helperType]);
+        } else if (help[mode.name]) {
+          found.push(help[mode.name]);
+        }
+        for (var i$1 = 0; i$1 < help._global.length; i$1++) {
+          var cur = help._global[i$1];
+          if (cur.pred(mode, this$1) && indexOf(found, cur.val) == -1)
+            { found.push(cur.val); }
+        }
+        return found
+      },
+
+      getStateAfter: function(line, precise) {
+        var doc = this.doc;
+        line = clipLine(doc, line == null ? doc.first + doc.size - 1: line);
+        return getContextBefore(this, line + 1, precise).state
+      },
+
+      cursorCoords: function(start, mode) {
+        var pos, range$$1 = this.doc.sel.primary();
+        if (start == null) { pos = range$$1.head; }
+        else if (typeof start == "object") { pos = clipPos(this.doc, start); }
+        else { pos = start ? range$$1.from() : range$$1.to(); }
+        return cursorCoords(this, pos, mode || "page")
+      },
+
+      charCoords: function(pos, mode) {
+        return charCoords(this, clipPos(this.doc, pos), mode || "page")
+      },
+
+      coordsChar: function(coords, mode) {
+        coords = fromCoordSystem(this, coords, mode || "page");
+        return coordsChar(this, coords.left, coords.top)
+      },
+
+      lineAtHeight: function(height, mode) {
+        height = fromCoordSystem(this, {top: height, left: 0}, mode || "page").top;
+        return lineAtHeight(this.doc, height + this.display.viewOffset)
+      },
+      heightAtLine: function(line, mode, includeWidgets) {
+        var end = false, lineObj;
+        if (typeof line == "number") {
+          var last = this.doc.first + this.doc.size - 1;
+          if (line < this.doc.first) { line = this.doc.first; }
+          else if (line > last) { line = last; end = true; }
+          lineObj = getLine(this.doc, line);
+        } else {
+          lineObj = line;
+        }
+        return intoCoordSystem(this, lineObj, {top: 0, left: 0}, mode || "page", includeWidgets || end).top +
+          (end ? this.doc.height - heightAtLine(lineObj) : 0)
+      },
+
+      defaultTextHeight: function() { return textHeight(this.display) },
+      defaultCharWidth: function() { return charWidth(this.display) },
+
+      getViewport: function() { return {from: this.display.viewFrom, to: this.display.viewTo}},
+
+      addWidget: function(pos, node, scroll, vert, horiz) {
+        var display = this.display;
+        pos = cursorCoords(this, clipPos(this.doc, pos));
+        var top = pos.bottom, left = pos.left;
+        node.style.position = "absolute";
+        node.setAttribute("cm-ignore-events", "true");
+        this.display.input.setUneditable(node);
+        display.sizer.appendChild(node);
+        if (vert == "over") {
+          top = pos.top;
+        } else if (vert == "above" || vert == "near") {
+          var vspace = Math.max(display.wrapper.clientHeight, this.doc.height),
+          hspace = Math.max(display.sizer.clientWidth, display.lineSpace.clientWidth);
+          // Default to positioning above (if specified and possible); otherwise default to positioning below
+          if ((vert == 'above' || pos.bottom + node.offsetHeight > vspace) && pos.top > node.offsetHeight)
+            { top = pos.top - node.offsetHeight; }
+          else if (pos.bottom + node.offsetHeight <= vspace)
+            { top = pos.bottom; }
+          if (left + node.offsetWidth > hspace)
+            { left = hspace - node.offsetWidth; }
+        }
+        node.style.top = top + "px";
+        node.style.left = node.style.right = "";
+        if (horiz == "right") {
+          left = display.sizer.clientWidth - node.offsetWidth;
+          node.style.right = "0px";
+        } else {
+          if (horiz == "left") { left = 0; }
+          else if (horiz == "middle") { left = (display.sizer.clientWidth - node.offsetWidth) / 2; }
+          node.style.left = left + "px";
+        }
+        if (scroll)
+          { scrollIntoView(this, {left: left, top: top, right: left + node.offsetWidth, bottom: top + node.offsetHeight}); }
+      },
+
+      triggerOnKeyDown: methodOp(onKeyDown),
+      triggerOnKeyPress: methodOp(onKeyPress),
+      triggerOnKeyUp: onKeyUp,
+      triggerOnMouseDown: methodOp(onMouseDown),
+
+      execCommand: function(cmd) {
+        if (commands.hasOwnProperty(cmd))
+          { return commands[cmd].call(null, this) }
+      },
+
+      triggerElectric: methodOp(function(text) { triggerElectric(this, text); }),
+
+      findPosH: function(from, amount, unit, visually) {
+        var this$1 = this;
+
+        var dir = 1;
+        if (amount < 0) { dir = -1; amount = -amount; }
+        var cur = clipPos(this.doc, from);
+        for (var i = 0; i < amount; ++i) {
+          cur = findPosH(this$1.doc, cur, dir, unit, visually);
+          if (cur.hitSide) { break }
+        }
+        return cur
+      },
+
+      moveH: methodOp(function(dir, unit) {
+        var this$1 = this;
+
+        this.extendSelectionsBy(function (range$$1) {
+          if (this$1.display.shift || this$1.doc.extend || range$$1.empty())
+            { return findPosH(this$1.doc, range$$1.head, dir, unit, this$1.options.rtlMoveVisually) }
+          else
+            { return dir < 0 ? range$$1.from() : range$$1.to() }
+        }, sel_move);
+      }),
+
+      deleteH: methodOp(function(dir, unit) {
+        var sel = this.doc.sel, doc = this.doc;
+        if (sel.somethingSelected())
+          { doc.replaceSelection("", null, "+delete"); }
+        else
+          { deleteNearSelection(this, function (range$$1) {
+            var other = findPosH(doc, range$$1.head, dir, unit, false);
+            return dir < 0 ? {from: other, to: range$$1.head} : {from: range$$1.head, to: other}
+          }); }
+      }),
+
+      findPosV: function(from, amount, unit, goalColumn) {
+        var this$1 = this;
+
+        var dir = 1, x = goalColumn;
+        if (amount < 0) { dir = -1; amount = -amount; }
+        var cur = clipPos(this.doc, from);
+        for (var i = 0; i < amount; ++i) {
+          var coords = cursorCoords(this$1, cur, "div");
+          if (x == null) { x = coords.left; }
+          else { coords.left = x; }
+          cur = findPosV(this$1, coords, dir, unit);
+          if (cur.hitSide) { break }
+        }
+        return cur
+      },
+
+      moveV: methodOp(function(dir, unit) {
+        var this$1 = this;
+
+        var doc = this.doc, goals = [];
+        var collapse = !this.display.shift && !doc.extend && doc.sel.somethingSelected();
+        doc.extendSelectionsBy(function (range$$1) {
+          if (collapse)
+            { return dir < 0 ? range$$1.from() : range$$1.to() }
+          var headPos = cursorCoords(this$1, range$$1.head, "div");
+          if (range$$1.goalColumn != null) { headPos.left = range$$1.goalColumn; }
+          goals.push(headPos.left);
+          var pos = findPosV(this$1, headPos, dir, unit);
+          if (unit == "page" && range$$1 == doc.sel.primary())
+            { addToScrollTop(this$1, charCoords(this$1, pos, "div").top - headPos.top); }
+          return pos
+        }, sel_move);
+        if (goals.length) { for (var i = 0; i < doc.sel.ranges.length; i++)
+          { doc.sel.ranges[i].goalColumn = goals[i]; } }
+      }),
+
+      // Find the word at the given position (as returned by coordsChar).
+      findWordAt: function(pos) {
+        var doc = this.doc, line = getLine(doc, pos.line).text;
+        var start = pos.ch, end = pos.ch;
+        if (line) {
+          var helper = this.getHelper(pos, "wordChars");
+          if ((pos.sticky == "before" || end == line.length) && start) { --start; } else { ++end; }
+          var startChar = line.charAt(start);
+          var check = isWordChar(startChar, helper)
+            ? function (ch) { return isWordChar(ch, helper); }
+            : /\s/.test(startChar) ? function (ch) { return /\s/.test(ch); }
+            : function (ch) { return (!/\s/.test(ch) && !isWordChar(ch)); };
+          while (start > 0 && check(line.charAt(start - 1))) { --start; }
+          while (end < line.length && check(line.charAt(end))) { ++end; }
+        }
+        return new Range(Pos(pos.line, start), Pos(pos.line, end))
+      },
+
+      toggleOverwrite: function(value) {
+        if (value != null && value == this.state.overwrite) { return }
+        if (this.state.overwrite = !this.state.overwrite)
+          { addClass(this.display.cursorDiv, "CodeMirror-overwrite"); }
+        else
+          { rmClass(this.display.cursorDiv, "CodeMirror-overwrite"); }
+
+        signal(this, "overwriteToggle", this, this.state.overwrite);
+      },
+      hasFocus: function() { return this.display.input.getField() == activeElt() },
+      isReadOnly: function() { return !!(this.options.readOnly || this.doc.cantEdit) },
+
+      scrollTo: methodOp(function (x, y) { scrollToCoords(this, x, y); }),
+      getScrollInfo: function() {
+        var scroller = this.display.scroller;
+        return {left: scroller.scrollLeft, top: scroller.scrollTop,
+                height: scroller.scrollHeight - scrollGap(this) - this.display.barHeight,
+                width: scroller.scrollWidth - scrollGap(this) - this.display.barWidth,
+                clientHeight: displayHeight(this), clientWidth: displayWidth(this)}
+      },
+
+      scrollIntoView: methodOp(function(range$$1, margin) {
+        if (range$$1 == null) {
+          range$$1 = {from: this.doc.sel.primary().head, to: null};
+          if (margin == null) { margin = this.options.cursorScrollMargin; }
+        } else if (typeof range$$1 == "number") {
+          range$$1 = {from: Pos(range$$1, 0), to: null};
+        } else if (range$$1.from == null) {
+          range$$1 = {from: range$$1, to: null};
+        }
+        if (!range$$1.to) { range$$1.to = range$$1.from; }
+        range$$1.margin = margin || 0;
+
+        if (range$$1.from.line != null) {
+          scrollToRange(this, range$$1);
+        } else {
+          scrollToCoordsRange(this, range$$1.from, range$$1.to, range$$1.margin);
+        }
+      }),
+
+      setSize: methodOp(function(width, height) {
+        var this$1 = this;
+
+        var interpret = function (val) { return typeof val == "number" || /^\d+$/.test(String(val)) ? val + "px" : val; };
+        if (width != null) { this.display.wrapper.style.width = interpret(width); }
+        if (height != null) { this.display.wrapper.style.height = interpret(height); }
+        if (this.options.lineWrapping) { clearLineMeasurementCache(this); }
+        var lineNo$$1 = this.display.viewFrom;
+        this.doc.iter(lineNo$$1, this.display.viewTo, function (line) {
+          if (line.widgets) { for (var i = 0; i < line.widgets.length; i++)
+            { if (line.widgets[i].noHScroll) { regLineChange(this$1, lineNo$$1, "widget"); break } } }
+          ++lineNo$$1;
+        });
+        this.curOp.forceUpdate = true;
+        signal(this, "refresh", this);
+      }),
+
+      operation: function(f){return runInOp(this, f)},
+      startOperation: function(){return startOperation(this)},
+      endOperation: function(){return endOperation(this)},
+
+      refresh: methodOp(function() {
+        var oldHeight = this.display.cachedTextHeight;
+        regChange(this);
+        this.curOp.forceUpdate = true;
+        clearCaches(this);
+        scrollToCoords(this, this.doc.scrollLeft, this.doc.scrollTop);
+        updateGutterSpace(this.display);
+        if (oldHeight == null || Math.abs(oldHeight - textHeight(this.display)) > .5)
+          { estimateLineHeights(this); }
+        signal(this, "refresh", this);
+      }),
+
+      swapDoc: methodOp(function(doc) {
+        var old = this.doc;
+        old.cm = null;
+        // Cancel the current text selection if any (#5821)
+        if (this.state.selectingText) { this.state.selectingText(); }
+        attachDoc(this, doc);
+        clearCaches(this);
+        this.display.input.reset();
+        scrollToCoords(this, doc.scrollLeft, doc.scrollTop);
+        this.curOp.forceScroll = true;
+        signalLater(this, "swapDoc", this, old);
+        return old
+      }),
+
+      phrase: function(phraseText) {
+        var phrases = this.options.phrases;
+        return phrases && Object.prototype.hasOwnProperty.call(phrases, phraseText) ? phrases[phraseText] : phraseText
+      },
+
+      getInputField: function(){return this.display.input.getField()},
+      getWrapperElement: function(){return this.display.wrapper},
+      getScrollerElement: function(){return this.display.scroller},
+      getGutterElement: function(){return this.display.gutters}
+    };
+    eventMixin(CodeMirror);
+
+    CodeMirror.registerHelper = function(type, name, value) {
+      if (!helpers.hasOwnProperty(type)) { helpers[type] = CodeMirror[type] = {_global: []}; }
+      helpers[type][name] = value;
+    };
+    CodeMirror.registerGlobalHelper = function(type, name, predicate, value) {
+      CodeMirror.registerHelper(type, name, value);
+      helpers[type]._global.push({pred: predicate, val: value});
+    };
+  }
+
+  // Used for horizontal relative motion. Dir is -1 or 1 (left or
+  // right), unit can be "char", "column" (like char, but doesn't
+  // cross line boundaries), "word" (across next word), or "group" (to
+  // the start of next group of word or non-word-non-whitespace
+  // chars). The visually param controls whether, in right-to-left
+  // text, direction 1 means to move towards the next index in the
+  // string, or towards the character to the right of the current
+  // position. The resulting position will have a hitSide=true
+  // property if it reached the end of the document.
+  function findPosH(doc, pos, dir, unit, visually) {
+    var oldPos = pos;
+    var origDir = dir;
+    var lineObj = getLine(doc, pos.line);
+    function findNextLine() {
+      var l = pos.line + dir;
+      if (l < doc.first || l >= doc.first + doc.size) { return false }
+      pos = new Pos(l, pos.ch, pos.sticky);
+      return lineObj = getLine(doc, l)
+    }
+    function moveOnce(boundToLine) {
+      var next;
+      if (visually) {
+        next = moveVisually(doc.cm, lineObj, pos, dir);
+      } else {
+        next = moveLogically(lineObj, pos, dir);
+      }
+      if (next == null) {
+        if (!boundToLine && findNextLine())
+          { pos = endOfLine(visually, doc.cm, lineObj, pos.line, dir); }
+        else
+          { return false }
+      } else {
+        pos = next;
+      }
+      return true
+    }
+
+    if (unit == "char") {
+      moveOnce();
+    } else if (unit == "column") {
+      moveOnce(true);
+    } else if (unit == "word" || unit == "group") {
+      var sawType = null, group = unit == "group";
+      var helper = doc.cm && doc.cm.getHelper(pos, "wordChars");
+      for (var first = true;; first = false) {
+        if (dir < 0 && !moveOnce(!first)) { break }
+        var cur = lineObj.text.charAt(pos.ch) || "\n";
+        var type = isWordChar(cur, helper) ? "w"
+          : group && cur == "\n" ? "n"
+          : !group || /\s/.test(cur) ? null
+          : "p";
+        if (group && !first && !type) { type = "s"; }
+        if (sawType && sawType != type) {
+          if (dir < 0) {dir = 1; moveOnce(); pos.sticky = "after";}
+          break
+        }
+
+        if (type) { sawType = type; }
+        if (dir > 0 && !moveOnce(!first)) { break }
+      }
+    }
+    var result = skipAtomic(doc, pos, oldPos, origDir, true);
+    if (equalCursorPos(oldPos, result)) { result.hitSide = true; }
+    return result
+  }
+
+  // For relative vertical movement. Dir may be -1 or 1. Unit can be
+  // "page" or "line". The resulting position will have a hitSide=true
+  // property if it reached the end of the document.
+  function findPosV(cm, pos, dir, unit) {
+    var doc = cm.doc, x = pos.left, y;
+    if (unit == "page") {
+      var pageSize = Math.min(cm.display.wrapper.clientHeight, window.innerHeight || document.documentElement.clientHeight);
+      var moveAmount = Math.max(pageSize - .5 * textHeight(cm.display), 3);
+      y = (dir > 0 ? pos.bottom : pos.top) + dir * moveAmount;
+
+    } else if (unit == "line") {
+      y = dir > 0 ? pos.bottom + 3 : pos.top - 3;
+    }
+    var target;
+    for (;;) {
+      target = coordsChar(cm, x, y);
+      if (!target.outside) { break }
+      if (dir < 0 ? y <= 0 : y >= doc.height) { target.hitSide = true; break }
+      y += dir * 5;
+    }
+    return target
+  }
+
+  // CONTENTEDITABLE INPUT STYLE
+
+  var ContentEditableInput = function(cm) {
+    this.cm = cm;
+    this.lastAnchorNode = this.lastAnchorOffset = this.lastFocusNode = this.lastFocusOffset = null;
+    this.polling = new Delayed();
+    this.composing = null;
+    this.gracePeriod = false;
+    this.readDOMTimeout = null;
+  };
+
+  ContentEditableInput.prototype.init = function (display) {
+      var this$1 = this;
+
+    var input = this, cm = input.cm;
+    var div = input.div = display.lineDiv;
+    disableBrowserMagic(div, cm.options.spellcheck, cm.options.autocorrect, cm.options.autocapitalize);
+
+    on(div, "paste", function (e) {
+      if (signalDOMEvent(cm, e) || handlePaste(e, cm)) { return }
+      // IE doesn't fire input events, so we schedule a read for the pasted content in this way
+      if (ie_version <= 11) { setTimeout(operation(cm, function () { return this$1.updateFromDOM(); }), 20); }
+    });
+
+    on(div, "compositionstart", function (e) {
+      this$1.composing = {data: e.data, done: false};
+    });
+    on(div, "compositionupdate", function (e) {
+      if (!this$1.composing) { this$1.composing = {data: e.data, done: false}; }
+    });
+    on(div, "compositionend", function (e) {
+      if (this$1.composing) {
+        if (e.data != this$1.composing.data) { this$1.readFromDOMSoon(); }
+        this$1.composing.done = true;
+      }
+    });
+
+    on(div, "touchstart", function () { return input.forceCompositionEnd(); });
+
+    on(div, "input", function () {
+      if (!this$1.composing) { this$1.readFromDOMSoon(); }
+    });
+
+    function onCopyCut(e) {
+      if (signalDOMEvent(cm, e)) { return }
+      if (cm.somethingSelected()) {
+        setLastCopied({lineWise: false, text: cm.getSelections()});
+        if (e.type == "cut") { cm.replaceSelection("", null, "cut"); }
+      } else if (!cm.options.lineWiseCopyCut) {
+        return
+      } else {
+        var ranges = copyableRanges(cm);
+        setLastCopied({lineWise: true, text: ranges.text});
+        if (e.type == "cut") {
+          cm.operation(function () {
+            cm.setSelections(ranges.ranges, 0, sel_dontScroll);
+            cm.replaceSelection("", null, "cut");
+          });
+        }
+      }
+      if (e.clipboardData) {
+        e.clipboardData.clearData();
+        var content = lastCopied.text.join("\n");
+        // iOS exposes the clipboard API, but seems to discard content inserted into it
+        e.clipboardData.setData("Text", content);
+        if (e.clipboardData.getData("Text") == content) {
+          e.preventDefault();
+          return
+        }
+      }
+      // Old-fashioned briefly-focus-a-textarea hack
+      var kludge = hiddenTextarea(), te = kludge.firstChild;
+      cm.display.lineSpace.insertBefore(kludge, cm.display.lineSpace.firstChild);
+      te.value = lastCopied.text.join("\n");
+      var hadFocus = document.activeElement;
+      selectInput(te);
+      setTimeout(function () {
+        cm.display.lineSpace.removeChild(kludge);
+        hadFocus.focus();
+        if (hadFocus == div) { input.showPrimarySelection(); }
+      }, 50);
+    }
+    on(div, "copy", onCopyCut);
+    on(div, "cut", onCopyCut);
+  };
+
+  ContentEditableInput.prototype.prepareSelection = function () {
+    var result = prepareSelection(this.cm, false);
+    result.focus = this.cm.state.focused;
+    return result
+  };
+
+  ContentEditableInput.prototype.showSelection = function (info, takeFocus) {
+    if (!info || !this.cm.display.view.length) { return }
+    if (info.focus || takeFocus) { this.showPrimarySelection(); }
+    this.showMultipleSelections(info);
+  };
+
+  ContentEditableInput.prototype.getSelection = function () {
+    return this.cm.display.wrapper.ownerDocument.getSelection()
+  };
+
+  ContentEditableInput.prototype.showPrimarySelection = function () {
+    var sel = this.getSelection(), cm = this.cm, prim = cm.doc.sel.primary();
+    var from = prim.from(), to = prim.to();
+
+    if (cm.display.viewTo == cm.display.viewFrom || from.line >= cm.display.viewTo || to.line < cm.display.viewFrom) {
+      sel.removeAllRanges();
+      return
+    }
+
+    var curAnchor = domToPos(cm, sel.anchorNode, sel.anchorOffset);
+    var curFocus = domToPos(cm, sel.focusNode, sel.focusOffset);
+    if (curAnchor && !curAnchor.bad && curFocus && !curFocus.bad &&
+        cmp(minPos(curAnchor, curFocus), from) == 0 &&
+        cmp(maxPos(curAnchor, curFocus), to) == 0)
+      { return }
+
+    var view = cm.display.view;
+    var start = (from.line >= cm.display.viewFrom && posToDOM(cm, from)) ||
+        {node: view[0].measure.map[2], offset: 0};
+    var end = to.line < cm.display.viewTo && posToDOM(cm, to);
+    if (!end) {
+      var measure = view[view.length - 1].measure;
+      var map$$1 = measure.maps ? measure.maps[measure.maps.length - 1] : measure.map;
+      end = {node: map$$1[map$$1.length - 1], offset: map$$1[map$$1.length - 2] - map$$1[map$$1.length - 3]};
+    }
+
+    if (!start || !end) {
+      sel.removeAllRanges();
+      return
+    }
+
+    var old = sel.rangeCount && sel.getRangeAt(0), rng;
+    try { rng = range(start.node, start.offset, end.offset, end.node); }
+    catch(e) {} // Our model of the DOM might be outdated, in which case the range we try to set can be impossible
+    if (rng) {
+      if (!gecko && cm.state.focused) {
+        sel.collapse(start.node, start.offset);
+        if (!rng.collapsed) {
+          sel.removeAllRanges();
+          sel.addRange(rng);
+        }
+      } else {
+        sel.removeAllRanges();
+        sel.addRange(rng);
+      }
+      if (old && sel.anchorNode == null) { sel.addRange(old); }
+      else if (gecko) { this.startGracePeriod(); }
+    }
+    this.rememberSelection();
+  };
+
+  ContentEditableInput.prototype.startGracePeriod = function () {
+      var this$1 = this;
+
+    clearTimeout(this.gracePeriod);
+    this.gracePeriod = setTimeout(function () {
+      this$1.gracePeriod = false;
+      if (this$1.selectionChanged())
+        { this$1.cm.operation(function () { return this$1.cm.curOp.selectionChanged = true; }); }
+    }, 20);
+  };
+
+  ContentEditableInput.prototype.showMultipleSelections = function (info) {
+    removeChildrenAndAdd(this.cm.display.cursorDiv, info.cursors);
+    removeChildrenAndAdd(this.cm.display.selectionDiv, info.selection);
+  };
+
+  ContentEditableInput.prototype.rememberSelection = function () {
+    var sel = this.getSelection();
+    this.lastAnchorNode = sel.anchorNode; this.lastAnchorOffset = sel.anchorOffset;
+    this.lastFocusNode = sel.focusNode; this.lastFocusOffset = sel.focusOffset;
+  };
+
+  ContentEditableInput.prototype.selectionInEditor = function () {
+    var sel = this.getSelection();
+    if (!sel.rangeCount) { return false }
+    var node = sel.getRangeAt(0).commonAncestorContainer;
+    return contains(this.div, node)
+  };
+
+  ContentEditableInput.prototype.focus = function () {
+    if (this.cm.options.readOnly != "nocursor") {
+      if (!this.selectionInEditor())
+        { this.showSelection(this.prepareSelection(), true); }
+      this.div.focus();
+    }
+  };
+  ContentEditableInput.prototype.blur = function () { this.div.blur(); };
+  ContentEditableInput.prototype.getField = function () { return this.div };
+
+  ContentEditableInput.prototype.supportsTouch = function () { return true };
+
+  ContentEditableInput.prototype.receivedFocus = function () {
+    var input = this;
+    if (this.selectionInEditor())
+      { this.pollSelection(); }
+    else
+      { runInOp(this.cm, function () { return input.cm.curOp.selectionChanged = true; }); }
+
+    function poll() {
+      if (input.cm.state.focused) {
+        input.pollSelection();
+        input.polling.set(input.cm.options.pollInterval, poll);
+      }
+    }
+    this.polling.set(this.cm.options.pollInterval, poll);
+  };
+
+  ContentEditableInput.prototype.selectionChanged = function () {
+    var sel = this.getSelection();
+    return sel.anchorNode != this.lastAnchorNode || sel.anchorOffset != this.lastAnchorOffset ||
+      sel.focusNode != this.lastFocusNode || sel.focusOffset != this.lastFocusOffset
+  };
+
+  ContentEditableInput.prototype.pollSelection = function () {
+    if (this.readDOMTimeout != null || this.gracePeriod || !this.selectionChanged()) { return }
+    var sel = this.getSelection(), cm = this.cm;
+    // On Android Chrome (version 56, at least), backspacing into an
+    // uneditable block element will put the cursor in that element,
+    // and then, because it's not editable, hide the virtual keyboard.
+    // Because Android doesn't allow us to actually detect backspace
+    // presses in a sane way, this code checks for when that happens
+    // and simulates a backspace press in this case.
+    if (android && chrome && this.cm.display.gutterSpecs.length && isInGutter(sel.anchorNode)) {
+      this.cm.triggerOnKeyDown({type: "keydown", keyCode: 8, preventDefault: Math.abs});
+      this.blur();
+      this.focus();
+      return
+    }
+    if (this.composing) { return }
+    this.rememberSelection();
+    var anchor = domToPos(cm, sel.anchorNode, sel.anchorOffset);
+    var head = domToPos(cm, sel.focusNode, sel.focusOffset);
+    if (anchor && head) { runInOp(cm, function () {
+      setSelection(cm.doc, simpleSelection(anchor, head), sel_dontScroll);
+      if (anchor.bad || head.bad) { cm.curOp.selectionChanged = true; }
+    }); }
+  };
+
+  ContentEditableInput.prototype.pollContent = function () {
+    if (this.readDOMTimeout != null) {
+      clearTimeout(this.readDOMTimeout);
+      this.readDOMTimeout = null;
+    }
+
+    var cm = this.cm, display = cm.display, sel = cm.doc.sel.primary();
+    var from = sel.from(), to = sel.to();
+    if (from.ch == 0 && from.line > cm.firstLine())
+      { from = Pos(from.line - 1, getLine(cm.doc, from.line - 1).length); }
+    if (to.ch == getLine(cm.doc, to.line).text.length && to.line < cm.lastLine())
+      { to = Pos(to.line + 1, 0); }
+    if (from.line < display.viewFrom || to.line > display.viewTo - 1) { return false }
+
+    var fromIndex, fromLine, fromNode;
+    if (from.line == display.viewFrom || (fromIndex = findViewIndex(cm, from.line)) == 0) {
+      fromLine = lineNo(display.view[0].line);
+      fromNode = display.view[0].node;
+    } else {
+      fromLine = lineNo(display.view[fromIndex].line);
+      fromNode = display.view[fromIndex - 1].node.nextSibling;
+    }
+    var toIndex = findViewIndex(cm, to.line);
+    var toLine, toNode;
+    if (toIndex == display.view.length - 1) {
+      toLine = display.viewTo - 1;
+      toNode = display.lineDiv.lastChild;
+    } else {
+      toLine = lineNo(display.view[toIndex + 1].line) - 1;
+      toNode = display.view[toIndex + 1].node.previousSibling;
+    }
+
+    if (!fromNode) { return false }
+    var newText = cm.doc.splitLines(domTextBetween(cm, fromNode, toNode, fromLine, toLine));
+    var oldText = getBetween(cm.doc, Pos(fromLine, 0), Pos(toLine, getLine(cm.doc, toLine).text.length));
+    while (newText.length > 1 && oldText.length > 1) {
+      if (lst(newText) == lst(oldText)) { newText.pop(); oldText.pop(); toLine--; }
+      else if (newText[0] == oldText[0]) { newText.shift(); oldText.shift(); fromLine++; }
+      else { break }
+    }
+
+    var cutFront = 0, cutEnd = 0;
+    var newTop = newText[0], oldTop = oldText[0], maxCutFront = Math.min(newTop.length, oldTop.length);
+    while (cutFront < maxCutFront && newTop.charCodeAt(cutFront) == oldTop.charCodeAt(cutFront))
+      { ++cutFront; }
+    var newBot = lst(newText), oldBot = lst(oldText);
+    var maxCutEnd = Math.min(newBot.length - (newText.length == 1 ? cutFront : 0),
+                             oldBot.length - (oldText.length == 1 ? cutFront : 0));
+    while (cutEnd < maxCutEnd &&
+           newBot.charCodeAt(newBot.length - cutEnd - 1) == oldBot.charCodeAt(oldBot.length - cutEnd - 1))
+      { ++cutEnd; }
+    // Try to move start of change to start of selection if ambiguous
+    if (newText.length == 1 && oldText.length == 1 && fromLine == from.line) {
+      while (cutFront && cutFront > from.ch &&
+             newBot.charCodeAt(newBot.length - cutEnd - 1) == oldBot.charCodeAt(oldBot.length - cutEnd - 1)) {
+        cutFront--;
+        cutEnd++;
+      }
+    }
+
+    newText[newText.length - 1] = newBot.slice(0, newBot.length - cutEnd).replace(/^\u200b+/, "");
+    newText[0] = newText[0].slice(cutFront).replace(/\u200b+$/, "");
+
+    var chFrom = Pos(fromLine, cutFront);
+    var chTo = Pos(toLine, oldText.length ? lst(oldText).length - cutEnd : 0);
+    if (newText.length > 1 || newText[0] || cmp(chFrom, chTo)) {
+      replaceRange(cm.doc, newText, chFrom, chTo, "+input");
+      return true
+    }
+  };
+
+  ContentEditableInput.prototype.ensurePolled = function () {
+    this.forceCompositionEnd();
+  };
+  ContentEditableInput.prototype.reset = function () {
+    this.forceCompositionEnd();
+  };
+  ContentEditableInput.prototype.forceCompositionEnd = function () {
+    if (!this.composing) { return }
+    clearTimeout(this.readDOMTimeout);
+    this.composing = null;
+    this.updateFromDOM();
+    this.div.blur();
+    this.div.focus();
+  };
+  ContentEditableInput.prototype.readFromDOMSoon = function () {
+      var this$1 = this;
+
+    if (this.readDOMTimeout != null) { return }
+    this.readDOMTimeout = setTimeout(function () {
+      this$1.readDOMTimeout = null;
+      if (this$1.composing) {
+        if (this$1.composing.done) { this$1.composing = null; }
+        else { return }
+      }
+      this$1.updateFromDOM();
+    }, 80);
+  };
+
+  ContentEditableInput.prototype.updateFromDOM = function () {
+      var this$1 = this;
+
+    if (this.cm.isReadOnly() || !this.pollContent())
+      { runInOp(this.cm, function () { return regChange(this$1.cm); }); }
+  };
+
+  ContentEditableInput.prototype.setUneditable = function (node) {
+    node.contentEditable = "false";
+  };
+
+  ContentEditableInput.prototype.onKeyPress = function (e) {
+    if (e.charCode == 0 || this.composing) { return }
+    e.preventDefault();
+    if (!this.cm.isReadOnly())
+      { operation(this.cm, applyTextInput)(this.cm, String.fromCharCode(e.charCode == null ? e.keyCode : e.charCode), 0); }
+  };
+
+  ContentEditableInput.prototype.readOnlyChanged = function (val) {
+    this.div.contentEditable = String(val != "nocursor");
+  };
+
+  ContentEditableInput.prototype.onContextMenu = function () {};
+  ContentEditableInput.prototype.resetPosition = function () {};
+
+  ContentEditableInput.prototype.needsContentAttribute = true;
+
+  function posToDOM(cm, pos) {
+    var view = findViewForLine(cm, pos.line);
+    if (!view || view.hidden) { return null }
+    var line = getLine(cm.doc, pos.line);
+    var info = mapFromLineView(view, line, pos.line);
+
+    var order = getOrder(line, cm.doc.direction), side = "left";
+    if (order) {
+      var partPos = getBidiPartAt(order, pos.ch);
+      side = partPos % 2 ? "right" : "left";
+    }
+    var result = nodeAndOffsetInLineMap(info.map, pos.ch, side);
+    result.offset = result.collapse == "right" ? result.end : result.start;
+    return result
+  }
+
+  function isInGutter(node) {
+    for (var scan = node; scan; scan = scan.parentNode)
+      { if (/CodeMirror-gutter-wrapper/.test(scan.className)) { return true } }
+    return false
+  }
+
+  function badPos(pos, bad) { if (bad) { pos.bad = true; } return pos }
+
+  function domTextBetween(cm, from, to, fromLine, toLine) {
+    var text = "", closing = false, lineSep = cm.doc.lineSeparator(), extraLinebreak = false;
+    function recognizeMarker(id) { return function (marker) { return marker.id == id; } }
+    function close() {
+      if (closing) {
+        text += lineSep;
+        if (extraLinebreak) { text += lineSep; }
+        closing = extraLinebreak = false;
+      }
+    }
+    function addText(str) {
+      if (str) {
+        close();
+        text += str;
+      }
+    }
+    function walk(node) {
+      if (node.nodeType == 1) {
+        var cmText = node.getAttribute("cm-text");
+        if (cmText) {
+          addText(cmText);
+          return
+        }
+        var markerID = node.getAttribute("cm-marker"), range$$1;
+        if (markerID) {
+          var found = cm.findMarks(Pos(fromLine, 0), Pos(toLine + 1, 0), recognizeMarker(+markerID));
+          if (found.length && (range$$1 = found[0].find(0)))
+            { addText(getBetween(cm.doc, range$$1.from, range$$1.to).join(lineSep)); }
+          return
+        }
+        if (node.getAttribute("contenteditable") == "false") { return }
+        var isBlock = /^(pre|div|p|li|table|br)$/i.test(node.nodeName);
+        if (!/^br$/i.test(node.nodeName) && node.textContent.length == 0) { return }
+
+        if (isBlock) { close(); }
+        for (var i = 0; i < node.childNodes.length; i++)
+          { walk(node.childNodes[i]); }
+
+        if (/^(pre|p)$/i.test(node.nodeName)) { extraLinebreak = true; }
+        if (isBlock) { closing = true; }
+      } else if (node.nodeType == 3) {
+        addText(node.nodeValue.replace(/\u200b/g, "").replace(/\u00a0/g, " "));
+      }
+    }
+    for (;;) {
+      walk(from);
+      if (from == to) { break }
+      from = from.nextSibling;
+      extraLinebreak = false;
+    }
+    return text
+  }
+
+  function domToPos(cm, node, offset) {
+    var lineNode;
+    if (node == cm.display.lineDiv) {
+      lineNode = cm.display.lineDiv.childNodes[offset];
+      if (!lineNode) { return badPos(cm.clipPos(Pos(cm.display.viewTo - 1)), true) }
+      node = null; offset = 0;
+    } else {
+      for (lineNode = node;; lineNode = lineNode.parentNode) {
+        if (!lineNode || lineNode == cm.display.lineDiv) { return null }
+        if (lineNode.parentNode && lineNode.parentNode == cm.display.lineDiv) { break }
+      }
+    }
+    for (var i = 0; i < cm.display.view.length; i++) {
+      var lineView = cm.display.view[i];
+      if (lineView.node == lineNode)
+        { return locateNodeInLineView(lineView, node, offset) }
+    }
+  }
+
+  function locateNodeInLineView(lineView, node, offset) {
+    var wrapper = lineView.text.firstChild, bad = false;
+    if (!node || !contains(wrapper, node)) { return badPos(Pos(lineNo(lineView.line), 0), true) }
+    if (node == wrapper) {
+      bad = true;
+      node = wrapper.childNodes[offset];
+      offset = 0;
+      if (!node) {
+        var line = lineView.rest ? lst(lineView.rest) : lineView.line;
+        return badPos(Pos(lineNo(line), line.text.length), bad)
+      }
+    }
+
+    var textNode = node.nodeType == 3 ? node : null, topNode = node;
+    if (!textNode && node.childNodes.length == 1 && node.firstChild.nodeType == 3) {
+      textNode = node.firstChild;
+      if (offset) { offset = textNode.nodeValue.length; }
+    }
+    while (topNode.parentNode != wrapper) { topNode = topNode.parentNode; }
+    var measure = lineView.measure, maps = measure.maps;
+
+    function find(textNode, topNode, offset) {
+      for (var i = -1; i < (maps ? maps.length : 0); i++) {
+        var map$$1 = i < 0 ? measure.map : maps[i];
+        for (var j = 0; j < map$$1.length; j += 3) {
+          var curNode = map$$1[j + 2];
+          if (curNode == textNode || curNode == topNode) {
+            var line = lineNo(i < 0 ? lineView.line : lineView.rest[i]);
+            var ch = map$$1[j] + offset;
+            if (offset < 0 || curNode != textNode) { ch = map$$1[j + (offset ? 1 : 0)]; }
+            return Pos(line, ch)
+          }
+        }
+      }
+    }
+    var found = find(textNode, topNode, offset);
+    if (found) { return badPos(found, bad) }
+
+    // FIXME this is all really shaky. might handle the few cases it needs to handle, but likely to cause problems
+    for (var after = topNode.nextSibling, dist = textNode ? textNode.nodeValue.length - offset : 0; after; after = after.nextSibling) {
+      found = find(after, after.firstChild, 0);
+      if (found)
+        { return badPos(Pos(found.line, found.ch - dist), bad) }
+      else
+        { dist += after.textContent.length; }
+    }
+    for (var before = topNode.previousSibling, dist$1 = offset; before; before = before.previousSibling) {
+      found = find(before, before.firstChild, -1);
+      if (found)
+        { return badPos(Pos(found.line, found.ch + dist$1), bad) }
+      else
+        { dist$1 += before.textContent.length; }
+    }
+  }
+
+  // TEXTAREA INPUT STYLE
+
+  var TextareaInput = function(cm) {
+    this.cm = cm;
+    // See input.poll and input.reset
+    this.prevInput = "";
+
+    // Flag that indicates whether we expect input to appear real soon
+    // now (after some event like 'keypress' or 'input') and are
+    // polling intensively.
+    this.pollingFast = false;
+    // Self-resetting timeout for the poller
+    this.polling = new Delayed();
+    // Used to work around IE issue with selection being forgotten when focus moves away from textarea
+    this.hasSelection = false;
+    this.composing = null;
+  };
+
+  TextareaInput.prototype.init = function (display) {
+      var this$1 = this;
+
+    var input = this, cm = this.cm;
+    this.createField(display);
+    var te = this.textarea;
+
+    display.wrapper.insertBefore(this.wrapper, display.wrapper.firstChild);
+
+    // Needed to hide big blue blinking cursor on Mobile Safari (doesn't seem to work in iOS 8 anymore)
+    if (ios) { te.style.width = "0px"; }
+
+    on(te, "input", function () {
+      if (ie && ie_version >= 9 && this$1.hasSelection) { this$1.hasSelection = null; }
+      input.poll();
+    });
+
+    on(te, "paste", function (e) {
+      if (signalDOMEvent(cm, e) || handlePaste(e, cm)) { return }
+
+      cm.state.pasteIncoming = +new Date;
+      input.fastPoll();
+    });
+
+    function prepareCopyCut(e) {
+      if (signalDOMEvent(cm, e)) { return }
+      if (cm.somethingSelected()) {
+        setLastCopied({lineWise: false, text: cm.getSelections()});
+      } else if (!cm.options.lineWiseCopyCut) {
+        return
+      } else {
+        var ranges = copyableRanges(cm);
+        setLastCopied({lineWise: true, text: ranges.text});
+        if (e.type == "cut") {
+          cm.setSelections(ranges.ranges, null, sel_dontScroll);
+        } else {
+          input.prevInput = "";
+          te.value = ranges.text.join("\n");
+          selectInput(te);
+        }
+      }
+      if (e.type == "cut") { cm.state.cutIncoming = +new Date; }
+    }
+    on(te, "cut", prepareCopyCut);
+    on(te, "copy", prepareCopyCut);
+
+    on(display.scroller, "paste", function (e) {
+      if (eventInWidget(display, e) || signalDOMEvent(cm, e)) { return }
+      if (!te.dispatchEvent) {
+        cm.state.pasteIncoming = +new Date;
+        input.focus();
+        return
+      }
+
+      // Pass the `paste` event to the textarea so it's handled by its event listener.
+      var event = new Event("paste");
+      event.clipboardData = e.clipboardData;
+      te.dispatchEvent(event);
+    });
+
+    // Prevent normal selection in the editor (we handle our own)
+    on(display.lineSpace, "selectstart", function (e) {
+      if (!eventInWidget(display, e)) { e_preventDefault(e); }
+    });
+
+    on(te, "compositionstart", function () {
+      var start = cm.getCursor("from");
+      if (input.composing) { input.composing.range.clear(); }
+      input.composing = {
+        start: start,
+        range: cm.markText(start, cm.getCursor("to"), {className: "CodeMirror-composing"})
+      };
+    });
+    on(te, "compositionend", function () {
+      if (input.composing) {
+        input.poll();
+        input.composing.range.clear();
+        input.composing = null;
+      }
+    });
+  };
+
+  TextareaInput.prototype.createField = function (_display) {
+    // Wraps and hides input textarea
+    this.wrapper = hiddenTextarea();
+    // The semihidden textarea that is focused when the editor is
+    // focused, and receives input.
+    this.textarea = this.wrapper.firstChild;
+  };
+
+  TextareaInput.prototype.prepareSelection = function () {
+    // Redraw the selection and/or cursor
+    var cm = this.cm, display = cm.display, doc = cm.doc;
+    var result = prepareSelection(cm);
+
+    // Move the hidden textarea near the cursor to prevent scrolling artifacts
+    if (cm.options.moveInputWithCursor) {
+      var headPos = cursorCoords(cm, doc.sel.primary().head, "div");
+      var wrapOff = display.wrapper.getBoundingClientRect(), lineOff = display.lineDiv.getBoundingClientRect();
+      result.teTop = Math.max(0, Math.min(display.wrapper.clientHeight - 10,
+                                          headPos.top + lineOff.top - wrapOff.top));
+      result.teLeft = Math.max(0, Math.min(display.wrapper.clientWidth - 10,
+                                           headPos.left + lineOff.left - wrapOff.left));
+    }
+
+    return result
+  };
+
+  TextareaInput.prototype.showSelection = function (drawn) {
+    var cm = this.cm, display = cm.display;
+    removeChildrenAndAdd(display.cursorDiv, drawn.cursors);
+    removeChildrenAndAdd(display.selectionDiv, drawn.selection);
+    if (drawn.teTop != null) {
+      this.wrapper.style.top = drawn.teTop + "px";
+      this.wrapper.style.left = drawn.teLeft + "px";
+    }
+  };
+
+  // Reset the input to correspond to the selection (or to be empty,
+  // when not typing and nothing is selected)
+  TextareaInput.prototype.reset = function (typing) {
+    if (this.contextMenuPending || this.composing) { return }
+    var cm = this.cm;
+    if (cm.somethingSelected()) {
+      this.prevInput = "";
+      var content = cm.getSelection();
+      this.textarea.value = content;
+      if (cm.state.focused) { selectInput(this.textarea); }
+      if (ie && ie_version >= 9) { this.hasSelection = content; }
+    } else if (!typing) {
+      this.prevInput = this.textarea.value = "";
+      if (ie && ie_version >= 9) { this.hasSelection = null; }
+    }
+  };
+
+  TextareaInput.prototype.getField = function () { return this.textarea };
+
+  TextareaInput.prototype.supportsTouch = function () { return false };
+
+  TextareaInput.prototype.focus = function () {
+    if (this.cm.options.readOnly != "nocursor" && (!mobile || activeElt() != this.textarea)) {
+      try { this.textarea.focus(); }
+      catch (e) {} // IE8 will throw if the textarea is display: none or not in DOM
+    }
+  };
+
+  TextareaInput.prototype.blur = function () { this.textarea.blur(); };
+
+  TextareaInput.prototype.resetPosition = function () {
+    this.wrapper.style.top = this.wrapper.style.left = 0;
+  };
+
+  TextareaInput.prototype.receivedFocus = function () { this.slowPoll(); };
+
+  // Poll for input changes, using the normal rate of polling. This
+  // runs as long as the editor is focused.
+  TextareaInput.prototype.slowPoll = function () {
+      var this$1 = this;
+
+    if (this.pollingFast) { return }
+    this.polling.set(this.cm.options.pollInterval, function () {
+      this$1.poll();
+      if (this$1.cm.state.focused) { this$1.slowPoll(); }
+    });
+  };
+
+  // When an event has just come in that is likely to add or change
+  // something in the input textarea, we poll faster, to ensure that
+  // the change appears on the screen quickly.
+  TextareaInput.prototype.fastPoll = function () {
+    var missed = false, input = this;
+    input.pollingFast = true;
+    function p() {
+      var changed = input.poll();
+      if (!changed && !missed) {missed = true; input.polling.set(60, p);}
+      else {input.pollingFast = false; input.slowPoll();}
+    }
+    input.polling.set(20, p);
+  };
+
+  // Read input from the textarea, and update the document to match.
+  // When something is selected, it is present in the textarea, and
+  // selected (unless it is huge, in which case a placeholder is
+  // used). When nothing is selected, the cursor sits after previously
+  // seen text (can be empty), which is stored in prevInput (we must
+  // not reset the textarea when typing, because that breaks IME).
+  TextareaInput.prototype.poll = function () {
+      var this$1 = this;
+
+    var cm = this.cm, input = this.textarea, prevInput = this.prevInput;
+    // Since this is called a *lot*, try to bail out as cheaply as
+    // possible when it is clear that nothing happened. hasSelection
+    // will be the case when there is a lot of text in the textarea,
+    // in which case reading its value would be expensive.
+    if (this.contextMenuPending || !cm.state.focused ||
+        (hasSelection(input) && !prevInput && !this.composing) ||
+        cm.isReadOnly() || cm.options.disableInput || cm.state.keySeq)
+      { return false }
+
+    var text = input.value;
+    // If nothing changed, bail.
+    if (text == prevInput && !cm.somethingSelected()) { return false }
+    // Work around nonsensical selection resetting in IE9/10, and
+    // inexplicable appearance of private area unicode characters on
+    // some key combos in Mac (#2689).
+    if (ie && ie_version >= 9 && this.hasSelection === text ||
+        mac && /[\uf700-\uf7ff]/.test(text)) {
+      cm.display.input.reset();
+      return false
+    }
+
+    if (cm.doc.sel == cm.display.selForContextMenu) {
+      var first = text.charCodeAt(0);
+      if (first == 0x200b && !prevInput) { prevInput = "\u200b"; }
+      if (first == 0x21da) { this.reset(); return this.cm.execCommand("undo") }
+    }
+    // Find the part of the input that is actually new
+    var same = 0, l = Math.min(prevInput.length, text.length);
+    while (same < l && prevInput.charCodeAt(same) == text.charCodeAt(same)) { ++same; }
+
+    runInOp(cm, function () {
+      applyTextInput(cm, text.slice(same), prevInput.length - same,
+                     null, this$1.composing ? "*compose" : null);
+
+      // Don't leave long text in the textarea, since it makes further polling slow
+      if (text.length > 1000 || text.indexOf("\n") > -1) { input.value = this$1.prevInput = ""; }
+      else { this$1.prevInput = text; }
+
+      if (this$1.composing) {
+        this$1.composing.range.clear();
+        this$1.composing.range = cm.markText(this$1.composing.start, cm.getCursor("to"),
+                                           {className: "CodeMirror-composing"});
+      }
+    });
+    return true
+  };
+
+  TextareaInput.prototype.ensurePolled = function () {
+    if (this.pollingFast && this.poll()) { this.pollingFast = false; }
+  };
+
+  TextareaInput.prototype.onKeyPress = function () {
+    if (ie && ie_version >= 9) { this.hasSelection = null; }
+    this.fastPoll();
+  };
+
+  TextareaInput.prototype.onContextMenu = function (e) {
+    var input = this, cm = input.cm, display = cm.display, te = input.textarea;
+    if (input.contextMenuPending) { input.contextMenuPending(); }
+    var pos = posFromMouse(cm, e), scrollPos = display.scroller.scrollTop;
+    if (!pos || presto) { return } // Opera is difficult.
+
+    // Reset the current text selection only if the click is done outside of the selection
+    // and 'resetSelectionOnContextMenu' option is true.
+    var reset = cm.options.resetSelectionOnContextMenu;
+    if (reset && cm.doc.sel.contains(pos) == -1)
+      { operation(cm, setSelection)(cm.doc, simpleSelection(pos), sel_dontScroll); }
+
+    var oldCSS = te.style.cssText, oldWrapperCSS = input.wrapper.style.cssText;
+    var wrapperBox = input.wrapper.offsetParent.getBoundingClientRect();
+    input.wrapper.style.cssText = "position: static";
+    te.style.cssText = "position: absolute; width: 30px; height: 30px;\n      top: " + (e.clientY - wrapperBox.top - 5) + "px; left: " + (e.clientX - wrapperBox.left - 5) + "px;\n      z-index: 1000; background: " + (ie ? "rgba(255, 255, 255, .05)" : "transparent") + ";\n      outline: none; border-width: 0; outline: none; overflow: hidden; opacity: .05; filter: alpha(opacity=5);";
+    var oldScrollY;
+    if (webkit) { oldScrollY = window.scrollY; } // Work around Chrome issue (#2712)
+    display.input.focus();
+    if (webkit) { window.scrollTo(null, oldScrollY); }
+    display.input.reset();
+    // Adds "Select all" to context menu in FF
+    if (!cm.somethingSelected()) { te.value = input.prevInput = " "; }
+    input.contextMenuPending = rehide;
+    display.selForContextMenu = cm.doc.sel;
+    clearTimeout(display.detectingSelectAll);
+
+    // Select-all will be greyed out if there's nothing to select, so
+    // this adds a zero-width space so that we can later check whether
+    // it got selected.
+    function prepareSelectAllHack() {
+      if (te.selectionStart != null) {
+        var selected = cm.somethingSelected();
+        var extval = "\u200b" + (selected ? te.value : "");
+        te.value = "\u21da"; // Used to catch context-menu undo
+        te.value = extval;
+        input.prevInput = selected ? "" : "\u200b";
+        te.selectionStart = 1; te.selectionEnd = extval.length;
+        // Re-set this, in case some other handler touched the
+        // selection in the meantime.
+        display.selForContextMenu = cm.doc.sel;
+      }
+    }
+    function rehide() {
+      if (input.contextMenuPending != rehide) { return }
+      input.contextMenuPending = false;
+      input.wrapper.style.cssText = oldWrapperCSS;
+      te.style.cssText = oldCSS;
+      if (ie && ie_version < 9) { display.scrollbars.setScrollTop(display.scroller.scrollTop = scrollPos); }
+
+      // Try to detect the user choosing select-all
+      if (te.selectionStart != null) {
+        if (!ie || (ie && ie_version < 9)) { prepareSelectAllHack(); }
+        var i = 0, poll = function () {
+          if (display.selForContextMenu == cm.doc.sel && te.selectionStart == 0 &&
+              te.selectionEnd > 0 && input.prevInput == "\u200b") {
+            operation(cm, selectAll)(cm);
+          } else if (i++ < 10) {
+            display.detectingSelectAll = setTimeout(poll, 500);
+          } else {
+            display.selForContextMenu = null;
+            display.input.reset();
+          }
+        };
+        display.detectingSelectAll = setTimeout(poll, 200);
+      }
+    }
+
+    if (ie && ie_version >= 9) { prepareSelectAllHack(); }
+    if (captureRightClick) {
+      e_stop(e);
+      var mouseup = function () {
+        off(window, "mouseup", mouseup);
+        setTimeout(rehide, 20);
+      };
+      on(window, "mouseup", mouseup);
+    } else {
+      setTimeout(rehide, 50);
+    }
+  };
+
+  TextareaInput.prototype.readOnlyChanged = function (val) {
+    if (!val) { this.reset(); }
+    this.textarea.disabled = val == "nocursor";
+  };
+
+  TextareaInput.prototype.setUneditable = function () {};
+
+  TextareaInput.prototype.needsContentAttribute = false;
+
+  function fromTextArea(textarea, options) {
+    options = options ? copyObj(options) : {};
+    options.value = textarea.value;
+    if (!options.tabindex && textarea.tabIndex)
+      { options.tabindex = textarea.tabIndex; }
+    if (!options.placeholder && textarea.placeholder)
+      { options.placeholder = textarea.placeholder; }
+    // Set autofocus to true if this textarea is focused, or if it has
+    // autofocus and no other element is focused.
+    if (options.autofocus == null) {
+      var hasFocus = activeElt();
+      options.autofocus = hasFocus == textarea ||
+        textarea.getAttribute("autofocus") != null && hasFocus == document.body;
+    }
+
+    function save() {textarea.value = cm.getValue();}
+
+    var realSubmit;
+    if (textarea.form) {
+      on(textarea.form, "submit", save);
+      // Deplorable hack to make the submit method do the right thing.
+      if (!options.leaveSubmitMethodAlone) {
+        var form = textarea.form;
+        realSubmit = form.submit;
+        try {
+          var wrappedSubmit = form.submit = function () {
+            save();
+            form.submit = realSubmit;
+            form.submit();
+            form.submit = wrappedSubmit;
+          };
+        } catch(e) {}
+      }
+    }
+
+    options.finishInit = function (cm) {
+      cm.save = save;
+      cm.getTextArea = function () { return textarea; };
+      cm.toTextArea = function () {
+        cm.toTextArea = isNaN; // Prevent this from being ran twice
+        save();
+        textarea.parentNode.removeChild(cm.getWrapperElement());
+        textarea.style.display = "";
+        if (textarea.form) {
+          off(textarea.form, "submit", save);
+          if (typeof textarea.form.submit == "function")
+            { textarea.form.submit = realSubmit; }
+        }
+      };
+    };
+
+    textarea.style.display = "none";
+    var cm = CodeMirror(function (node) { return textarea.parentNode.insertBefore(node, textarea.nextSibling); },
+      options);
+    return cm
+  }
+
+  function addLegacyProps(CodeMirror) {
+    CodeMirror.off = off;
+    CodeMirror.on = on;
+    CodeMirror.wheelEventPixels = wheelEventPixels;
+    CodeMirror.Doc = Doc;
+    CodeMirror.splitLines = splitLinesAuto;
+    CodeMirror.countColumn = countColumn;
+    CodeMirror.findColumn = findColumn;
+    CodeMirror.isWordChar = isWordCharBasic;
+    CodeMirror.Pass = Pass;
+    CodeMirror.signal = signal;
+    CodeMirror.Line = Line;
+    CodeMirror.changeEnd = changeEnd;
+    CodeMirror.scrollbarModel = scrollbarModel;
+    CodeMirror.Pos = Pos;
+    CodeMirror.cmpPos = cmp;
+    CodeMirror.modes = modes;
+    CodeMirror.mimeModes = mimeModes;
+    CodeMirror.resolveMode = resolveMode;
+    CodeMirror.getMode = getMode;
+    CodeMirror.modeExtensions = modeExtensions;
+    CodeMirror.extendMode = extendMode;
+    CodeMirror.copyState = copyState;
+    CodeMirror.startState = startState;
+    CodeMirror.innerMode = innerMode;
+    CodeMirror.commands = commands;
+    CodeMirror.keyMap = keyMap;
+    CodeMirror.keyName = keyName;
+    CodeMirror.isModifierKey = isModifierKey;
+    CodeMirror.lookupKey = lookupKey;
+    CodeMirror.normalizeKeyMap = normalizeKeyMap;
+    CodeMirror.StringStream = StringStream;
+    CodeMirror.SharedTextMarker = SharedTextMarker;
+    CodeMirror.TextMarker = TextMarker;
+    CodeMirror.LineWidget = LineWidget;
+    CodeMirror.e_preventDefault = e_preventDefault;
+    CodeMirror.e_stopPropagation = e_stopPropagation;
+    CodeMirror.e_stop = e_stop;
+    CodeMirror.addClass = addClass;
+    CodeMirror.contains = contains;
+    CodeMirror.rmClass = rmClass;
+    CodeMirror.keyNames = keyNames;
+  }
+
+  // EDITOR CONSTRUCTOR
+
+  defineOptions(CodeMirror);
+
+  addEditorMethods(CodeMirror);
+
+  // Set up methods on CodeMirror's prototype to redirect to the editor's document.
+  var dontDelegate = "iter insert remove copy getEditor constructor".split(" ");
+  for (var prop in Doc.prototype) { if (Doc.prototype.hasOwnProperty(prop) && indexOf(dontDelegate, prop) < 0)
+    { CodeMirror.prototype[prop] = (function(method) {
+      return function() {return method.apply(this.doc, arguments)}
+    })(Doc.prototype[prop]); } }
+
+  eventMixin(Doc);
+  CodeMirror.inputStyles = {"textarea": TextareaInput, "contenteditable": ContentEditableInput};
+
+  // Extra arguments are stored as the mode's dependencies, which is
+  // used by (legacy) mechanisms like loadmode.js to automatically
+  // load a mode. (Preferred mechanism is the require/define calls.)
+  CodeMirror.defineMode = function(name/*, mode, …*/) {
+    if (!CodeMirror.defaults.mode && name != "null") { CodeMirror.defaults.mode = name; }
+    defineMode.apply(this, arguments);
+  };
+
+  CodeMirror.defineMIME = defineMIME;
+
+  // Minimal default mode.
+  CodeMirror.defineMode("null", function () { return ({token: function (stream) { return stream.skipToEnd(); }}); });
+  CodeMirror.defineMIME("text/plain", "null");
+
+  // EXTENSIONS
+
+  CodeMirror.defineExtension = function (name, func) {
+    CodeMirror.prototype[name] = func;
+  };
+  CodeMirror.defineDocExtension = function (name, func) {
+    Doc.prototype[name] = func;
+  };
+
+  CodeMirror.fromTextArea = fromTextArea;
+
+  addLegacyProps(CodeMirror);
+
+  CodeMirror.version = "5.48.4";
+
+  return CodeMirror;
+
+})));
+// CodeMirror, copyright (c) by Marijn Haverbeke and others
+// Distributed under an MIT license: https://codemirror.net/LICENSE
+
+(function(mod) {
+  if (typeof exports == "object" && typeof module == "object") // CommonJS
+    mod(require("../../lib/codemirror"));
+  else if (typeof define == "function" && define.amd) // AMD
+    define(["../../lib/codemirror"], mod);
+  else // Plain browser env
+    mod(CodeMirror);
+})(function(CodeMirror) {
+"use strict";
+
+CodeMirror.defineMode('shell', function() {
+
+  var words = {};
+  function define(style, dict) {
+    for(var i = 0; i < dict.length; i++) {
+      words[dict[i]] = style;
+    }
+  };
+
+  var commonAtoms = ["true", "false"];
+  var commonKeywords = ["if", "then", "do", "else", "elif", "while", "until", "for", "in", "esac", "fi",
+    "fin", "fil", "done", "exit", "set", "unset", "export", "function"];
+  var commonCommands = ["ab", "awk", "bash", "beep", "cat", "cc", "cd", "chown", "chmod", "chroot", "clear",
+    "cp", "curl", "cut", "diff", "echo", "find", "gawk", "gcc", "get", "git", "grep", "hg", "kill", "killall",
+    "ln", "ls", "make", "mkdir", "openssl", "mv", "nc", "nl", "node", "npm", "ping", "ps", "restart", "rm",
+    "rmdir", "sed", "service", "sh", "shopt", "shred", "source", "sort", "sleep", "ssh", "start", "stop",
+    "su", "sudo", "svn", "tee", "telnet", "top", "touch", "vi", "vim", "wall", "wc", "wget", "who", "write",
+    "yes", "zsh"];
+
+  CodeMirror.registerHelper("hintWords", "shell", commonAtoms.concat(commonKeywords, commonCommands));
+
+  define('atom', commonAtoms);
+  define('keyword', commonKeywords);
+  define('builtin', commonCommands);
+
+  function tokenBase(stream, state) {
+    if (stream.eatSpace()) return null;
+
+    var sol = stream.sol();
+    var ch = stream.next();
+
+    if (ch === '\\') {
+      stream.next();
+      return null;
+    }
+    if (ch === '\'' || ch === '"' || ch === '`') {
+      state.tokens.unshift(tokenString(ch, ch === "`" ? "quote" : "string"));
+      return tokenize(stream, state);
+    }
+    if (ch === '#') {
+      if (sol && stream.eat('!')) {
+        stream.skipToEnd();
+        return 'meta'; // 'comment'?
+      }
+      stream.skipToEnd();
+      return 'comment';
+    }
+    if (ch === '$') {
+      state.tokens.unshift(tokenDollar);
+      return tokenize(stream, state);
+    }
+    if (ch === '+' || ch === '=') {
+      return 'operator';
+    }
+    if (ch === '-') {
+      stream.eat('-');
+      stream.eatWhile(/\w/);
+      return 'attribute';
+    }
+    if (/\d/.test(ch)) {
+      stream.eatWhile(/\d/);
+      if(stream.eol() || !/\w/.test(stream.peek())) {
+        return 'number';
+      }
+    }
+    stream.eatWhile(/[\w-]/);
+    var cur = stream.current();
+    if (stream.peek() === '=' && /\w+/.test(cur)) return 'def';
+    return words.hasOwnProperty(cur) ? words[cur] : null;
+  }
+
+  function tokenString(quote, style) {
+    var close = quote == "(" ? ")" : quote == "{" ? "}" : quote
+    return function(stream, state) {
+      var next, escaped = false;
+      while ((next = stream.next()) != null) {
+        if (next === close && !escaped) {
+          state.tokens.shift();
+          break;
+        } else if (next === '$' && !escaped && quote !== "'" && stream.peek() != close) {
+          escaped = true;
+          stream.backUp(1);
+          state.tokens.unshift(tokenDollar);
+          break;
+        } else if (!escaped && quote !== close && next === quote) {
+          state.tokens.unshift(tokenString(quote, style))
+          return tokenize(stream, state)
+        } else if (!escaped && /['"]/.test(next) && !/['"]/.test(quote)) {
+          state.tokens.unshift(tokenStringStart(next, "string"));
+          stream.backUp(1);
+          break;
+        }
+        escaped = !escaped && next === '\\';
+      }
+      return style;
+    };
+  };
+
+  function tokenStringStart(quote, style) {
+    return function(stream, state) {
+      state.tokens[0] = tokenString(quote, style)
+      stream.next()
+      return tokenize(stream, state)
+    }
+  }
+
+  var tokenDollar = function(stream, state) {
+    if (state.tokens.length > 1) stream.eat('$');
+    var ch = stream.next()
+    if (/['"({]/.test(ch)) {
+      state.tokens[0] = tokenString(ch, ch == "(" ? "quote" : ch == "{" ? "def" : "string");
+      return tokenize(stream, state);
+    }
+    if (!/\d/.test(ch)) stream.eatWhile(/\w/);
+    state.tokens.shift();
+    return 'def';
+  };
+
+  function tokenize(stream, state) {
+    return (state.tokens[0] || tokenBase) (stream, state);
+  };
+
+  return {
+    startState: function() {return {tokens:[]};},
+    token: function(stream, state) {
+      return tokenize(stream, state);
+    },
+    closeBrackets: "()[]{}''\"\"``",
+    lineComment: '#',
+    fold: "brace"
+  };
+});
+
+CodeMirror.defineMIME('text/x-sh', 'shell');
+// Apache uses a slightly different Media Type for Shell scripts
+// http://svn.apache.org/repos/asf/httpd/httpd/trunk/docs/conf/mime.types
+CodeMirror.defineMIME('application/x-sh', 'shell');
+
+});
+/*
+ * Editor.md
+ *
+ * @file        editormd.js 
+ * @version     v1.5.0 
+ * @description Open source online markdown editor.
+ * @license     MIT License
+ * @author      Pandao
+ * {@link       https://github.com/pandao/editor.md}
+ * @updateTime  2015-06-09
+ */
+
+
+;(function(factory) {
+    "use strict";
+    
+	// CommonJS/Node.js
+	if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
+    { 
+        module.exports = factory;
+    }
+	else if (typeof define === "function")  // AMD/CMD/Sea.js
+	{
+        if (define.amd) // for Require.js
+        {
+            /* Require.js define replace */
+        } 
+        else 
+        {
+		    define(["jquery"], factory);  // for Sea.js
+        }
+	} 
+	else
+	{ 
+        window.editormd = factory();
+	}
+    
+}(function() {    
+
+    /* Require.js assignment replace */
+    
+    "use strict";
+    
+    var $ = (typeof (jQuery) !== "undefined") ? jQuery : Zepto;
+
+	if (typeof ($) === "undefined") {
+		return ;
+	}
+    
+    /**
+     * editormd
+     * 
+     * @param   {String} id           编辑器的ID
+     * @param   {Object} options      配置选项 Key/Value
+     * @returns {Object} editormd     返回editormd对象
+     */
+    
+    var editormd         = function (id, options) {
+        return new editormd.fn.init(id, options);
+    };
+    
+    editormd.title        = editormd.$name = "Editor.md";
+    editormd.version      = "1.5.0";
+    editormd.homePage     = "https://pandao.github.io/editor.md/";
+    editormd.classPrefix  = "editormd-";
+    
+    editormd.toolbarModes = {
+        full : [
+            "undo", "redo", "|", 
+            "bold", "del", "italic", "quote", "ucwords", "uppercase", "lowercase", "|", 
+            "h1", "h2", "h3", "h4", "h5", "h6", "|", 
+            "list-ul", "list-ol", "hr", "|",
+            "link", "reference-link", "image", "code", "preformatted-text", "code-block", "table", "datetime", "emoji", "html-entities", "pagebreak", "|",
+            "goto-line", "watch", "preview", "fullscreen", "clear", "search", "|",
+            "help", "info"
+        ],
+        simple : [
+            "undo", "redo", "|", 
+            "bold", "del", "italic", "quote", "uppercase", "lowercase", "|", 
+            "h1", "h2", "h3", "h4", "h5", "h6", "|", 
+            "list-ul", "list-ol", "hr", "|",
+            "watch", "preview", "fullscreen", "|",
+            "help", "info"
+        ],
+        mini : [
+            "undo", "redo", "|",
+            "watch", "preview", "|",
+            "help", "info"
+        ]
+    };
+    
+    editormd.defaults     = {
+        mode                 : "gfm",          //gfm or markdown
+        name                 : "",             // Form element name
+        value                : "",             // value for CodeMirror, if mode not gfm/markdown
+        theme                : "",             // Editor.md self themes, before v1.5.0 is CodeMirror theme, default empty
+        editorTheme          : "default",      // Editor area, this is CodeMirror theme at v1.5.0
+        previewTheme         : "",             // Preview area theme, default empty
+        markdown             : "",             // Markdown source code
+        appendMarkdown       : "",             // if in init textarea value not empty, append markdown to textarea
+        width                : "100%",
+        height               : "100%",
+        path                 : "./lib/",       // Dependents module file directory
+        pluginPath           : "",             // If this empty, default use settings.path + "../plugins/"
+        delay                : 300,            // Delay parse markdown to html, Uint : ms
+        autoLoadModules      : true,           // Automatic load dependent module files
+        watch                : true,
+        placeholder          : "Enjoy Markdown! coding now...",
+        gotoLine             : true,
+        codeFold             : false,
+        autoHeight           : false,
+		autoFocus            : true,
+        autoCloseTags        : true,
+        searchReplace        : true,
+        syncScrolling        : true,           // true | false | "single", default true
+        readOnly             : false,
+        tabSize              : 4,
+		indentUnit           : 4,
+        lineNumbers          : true,
+		lineWrapping         : true,
+		autoCloseBrackets    : true,
+		showTrailingSpace    : true,
+		matchBrackets        : true,
+		indentWithTabs       : true,
+		styleSelectedText    : true,
+        matchWordHighlight   : true,           // options: true, false, "onselected"
+        styleActiveLine      : true,           // Highlight the current line
+        dialogLockScreen     : true,
+        dialogShowMask       : true,
+        dialogDraggable      : true,
+        dialogMaskBgColor    : "#fff",
+        dialogMaskOpacity    : 0.1,
+        fontSize             : "13px",
+        saveHTMLToTextarea   : false,
+        disabledKeyMaps      : [],
+        
+        onload               : function() {},
+        onresize             : function() {},
+        onchange             : function() {},
+        onwatch              : null,
+        onunwatch            : null,
+        onpreviewing         : function() {},
+        onpreviewed          : function() {},
+        onfullscreen         : function() {},
+        onfullscreenExit     : function() {},
+        onscroll             : function() {},
+        onpreviewscroll      : function() {},
+        
+        imageUpload          : false,
+        imageFormats         : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
+        imageUploadURL       : "",
+        crossDomainUpload    : false,
+        uploadCallbackURL    : "",
+        
+        toc                  : true,           // Table of contents
+        tocm                 : false,           // Using [TOCM], auto create ToC dropdown menu
+        tocTitle             : "",             // for ToC dropdown menu btn
+        tocDropdown          : false,
+        tocContainer         : "",
+        tocStartLevel        : 1,              // Said from H1 to create ToC
+        htmlDecode           : false,          // Open the HTML tag identification 
+        pageBreak            : true,           // Enable parse page break [========]
+        atLink               : true,           // for @link
+        emailLink            : true,           // for email address auto link
+        taskList             : false,          // Enable Github Flavored Markdown task lists
+        emoji                : false,          // :emoji: , Support Github emoji, Twitter Emoji (Twemoji);
+                                               // Support FontAwesome icon emoji :fa-xxx: > Using fontAwesome icon web fonts;
+                                               // Support Editor.md logo icon emoji :editormd-logo: :editormd-logo-1x: > 1~8x;
+        tex                  : false,          // TeX(LaTeX), based on KaTeX
+        flowChart            : false,          // flowChart.js only support IE9+
+        sequenceDiagram      : false,          // sequenceDiagram.js only support IE9+
+        previewCodeHighlight : true,
+                
+        toolbar              : true,           // show/hide toolbar
+        toolbarAutoFixed     : true,           // on window scroll auto fixed position
+        toolbarIcons         : "full",
+        toolbarTitles        : {},
+        toolbarHandlers      : {
+            ucwords : function() {
+                return editormd.toolbarHandlers.ucwords;
+            },
+            lowercase : function() {
+                return editormd.toolbarHandlers.lowercase;
+            }
+        },
+        toolbarCustomIcons   : {               // using html tag create toolbar icon, unused default <a> tag.
+            lowercase        : "<a href=\"javascript:;\" title=\"Lowercase\" unselectable=\"on\"><i class=\"fa\" name=\"lowercase\" style=\"font-size:24px;margin-top: -10px;\">a</i></a>",
+            "ucwords"        : "<a href=\"javascript:;\" title=\"ucwords\" unselectable=\"on\"><i class=\"fa\" name=\"ucwords\" style=\"font-size:20px;margin-top: -3px;\">Aa</i></a>"
+        }, 
+        toolbarIconsClass    : {
+            undo             : "fa-undo",
+            redo             : "fa-repeat",
+            bold             : "fa-bold",
+            del              : "fa-strikethrough",
+            italic           : "fa-italic",
+            quote            : "fa-quote-left",
+            uppercase        : "fa-font",
+            h1               : editormd.classPrefix + "bold",
+            h2               : editormd.classPrefix + "bold",
+            h3               : editormd.classPrefix + "bold",
+            h4               : editormd.classPrefix + "bold",
+            h5               : editormd.classPrefix + "bold",
+            h6               : editormd.classPrefix + "bold",
+            "list-ul"        : "fa-list-ul",
+            "list-ol"        : "fa-list-ol",
+            hr               : "fa-minus",
+            link             : "fa-link",
+            "reference-link" : "fa-anchor",
+            image            : "fa-picture-o",
+            code             : "fa-code",
+            "preformatted-text" : "fa-file-code-o",
+            "code-block"     : "fa-file-code-o",
+            table            : "fa-table",
+            datetime         : "fa-clock-o",
+            emoji            : "fa-smile-o",
+            "html-entities"  : "fa-copyright",
+            pagebreak        : "fa-newspaper-o",
+            "goto-line"      : "fa-terminal", // fa-crosshairs
+            watch            : "fa-eye-slash",
+            unwatch          : "fa-eye",
+            preview          : "fa-desktop",
+            search           : "fa-search",
+            fullscreen       : "fa-arrows-alt",
+            clear            : "fa-eraser",
+            help             : "fa-question-circle",
+            info             : "fa-info-circle"
+        },        
+        toolbarIconTexts     : {},
+        
+        lang : {
+            name        : "zh-cn",
+            description : "开源在线Markdown编辑器<br/>Open source online Markdown editor.",
+            tocTitle    : "目录",
+            toolbar     : {
+                undo             : "撤销（Ctrl+Z）",
+                redo             : "重做（Ctrl+Y）",
+                bold             : "粗体",
+                del              : "删除线",
+                italic           : "斜体",
+                quote            : "引用",
+                ucwords          : "将每个单词首字母转成大写",
+                uppercase        : "将所选转换成大写",
+                lowercase        : "将所选转换成小写",
+                h1               : "标题1",
+                h2               : "标题2",
+                h3               : "标题3",
+                h4               : "标题4",
+                h5               : "标题5",
+                h6               : "标题6",
+                "list-ul"        : "无序列表",
+                "list-ol"        : "有序列表",
+                hr               : "横线",
+                link             : "链接",
+                "reference-link" : "引用链接",
+                image            : "添加图片",
+                code             : "行内代码",
+                "preformatted-text" : "预格式文本 / 代码块（缩进风格）",
+                "code-block"     : "代码块（多语言风格）",
+                table            : "添加表格",
+                datetime         : "日期时间",
+                emoji            : "Emoji表情",
+                "html-entities"  : "HTML实体字符",
+                pagebreak        : "插入分页符",
+                "goto-line"      : "跳转到行",
+                watch            : "关闭实时预览",
+                unwatch          : "开启实时预览",
+                preview          : "全窗口预览HTML（按 Shift + ESC还原）",
+                fullscreen       : "全屏（按ESC还原）",
+                clear            : "清空",
+                search           : "搜索",
+                help             : "使用帮助",
+                info             : "关于" + editormd.title
+            },
+            buttons : {
+                enter  : "确定",
+                cancel : "取消",
+                close  : "关闭"
+            },
+            dialog : {
+                link : {
+                    title    : "添加链接",
+                    url      : "链接地址",
+                    urlTitle : "链接标题",
+                    urlEmpty : "错误：请填写链接地址。"
+                },
+                referenceLink : {
+                    title    : "添加引用链接",
+                    name     : "引用名称",
+                    url      : "链接地址",
+                    urlId    : "链接ID",
+                    urlTitle : "链接标题",
+                    nameEmpty: "错误：引用链接的名称不能为空。",
+                    idEmpty  : "错误：请填写引用链接的ID。",
+                    urlEmpty : "错误：请填写引用链接的URL地址。"
+                },
+                image : {
+                    title    : "添加图片",
+                    url      : "图片地址",
+                    link     : "图片链接",
+                    alt      : "图片描述",
+                    uploadButton     : "本地上传",
+                    imageURLEmpty    : "错误：图片地址不能为空。",
+                    uploadFileEmpty  : "错误：上传的图片不能为空。",
+                    formatNotAllowed : "错误：只允许上传图片文件，允许上传的图片文件格式有："
+                },
+                preformattedText : {
+                    title             : "添加预格式文本或代码块", 
+                    emptyAlert        : "错误：请填写预格式文本或代码的内容。"
+                },
+                codeBlock : {
+                    title             : "添加代码块",                    
+                    selectLabel       : "代码语言：",
+                    selectDefaultText : "请选择代码语言",
+                    otherLanguage     : "其他语言",
+                    unselectedLanguageAlert : "错误：请选择代码所属的语言类型。",
+                    codeEmptyAlert    : "错误：请填写代码内容。"
+                },
+                htmlEntities : {
+                    title : "HTML 实体字符"
+                },
+                help : {
+                    title : "使用帮助"
+                }
+            }
+        }
+    };
+    
+    editormd.classNames  = {
+        tex : editormd.classPrefix + "tex"
+    };
+
+    editormd.dialogZindex = 99999;
+    
+    editormd.$katex       = null;
+    editormd.$marked      = null;
+    editormd.$CodeMirror  = null;
+    editormd.$prettyPrint = null;
+    
+    var timer, flowchartTimer;
+
+    editormd.prototype    = editormd.fn = {
+        state : {
+            watching   : false,
+            loaded     : false,
+            preview    : false,
+            fullscreen : false
+        },
+        
+        /**
+         * 构造函数/实例初始化
+         * Constructor / instance initialization
+         * 
+         * @param   {String}   id            编辑器的ID
+         * @param   {Object}   [options={}]  配置选项 Key/Value
+         * @returns {editormd}               返回editormd的实例对象
+         */
+        
+        init : function (id, options) {
+            
+            options              = options || {};
+            
+            if (typeof id === "object")
+            {
+                options = id;
+            }
+            
+            var _this            = this;
+            var classPrefix      = this.classPrefix  = editormd.classPrefix; 
+            var settings         = this.settings     = $.extend(true, editormd.defaults, options);
+            
+            id                   = (typeof id === "object") ? settings.id : id;
+            
+            var editor           = this.editor       = $("#" + id);
+            
+            this.id              = id;
+            this.lang            = settings.lang;
+            
+            var classNames       = this.classNames   = {
+                textarea : {
+                    html     : classPrefix + "html-textarea",
+                    markdown : classPrefix + "markdown-textarea"
+                }
+            };
+            
+            settings.pluginPath = (settings.pluginPath === "") ? settings.path + "../plugins/" : settings.pluginPath; 
+            
+            this.state.watching = (settings.watch) ? true : false;
+            
+            if ( !editor.hasClass("editormd") ) {
+                editor.addClass("editormd");
+            }
+            
+            editor.css({
+                width  : (typeof settings.width  === "number") ? settings.width  + "px" : settings.width,
+                height : (typeof settings.height === "number") ? settings.height + "px" : settings.height
+            });
+            
+            if (settings.autoHeight)
+            {
+                editor.css("height", "auto");
+            }
+                        
+            var markdownTextarea = this.markdownTextarea = editor.children("textarea");
+            
+            if (markdownTextarea.length < 1)
+            {
+                editor.append("<textarea></textarea>");
+                markdownTextarea = this.markdownTextarea = editor.children("textarea");
+            }
+            
+            markdownTextarea.addClass(classNames.textarea.markdown).attr("placeholder", settings.placeholder);
+            
+            if (typeof markdownTextarea.attr("name") === "undefined" || markdownTextarea.attr("name") === "")
+            {
+                markdownTextarea.attr("name", (settings.name !== "") ? settings.name : id + "-markdown-doc");
+            }
+            
+            var appendElements = [
+                (!settings.readOnly) ? "<a href=\"javascript:;\" class=\"fa fa-close " + classPrefix + "preview-close-btn\"></a>" : "",
+                ( (settings.saveHTMLToTextarea) ? "<textarea class=\"" + classNames.textarea.html + "\" name=\"" + id + "-html-code\"></textarea>" : "" ),
+                "<div class=\"" + classPrefix + "preview\"><div class=\"markdown-body " + classPrefix + "preview-container\"></div></div>",
+                "<div class=\"" + classPrefix + "container-mask\" style=\"display:block;\"></div>",
+                "<div class=\"" + classPrefix + "mask\"></div>"
+            ].join("\n");
+            
+            editor.append(appendElements).addClass(classPrefix + "vertical");
+            
+            if (settings.theme !== "") 
+            {
+                editor.addClass(classPrefix + "theme-" + settings.theme);
+            }
+            
+            this.mask          = editor.children("." + classPrefix + "mask");    
+            this.containerMask = editor.children("." + classPrefix  + "container-mask");
+            
+            if (settings.markdown !== "")
+            {
+                markdownTextarea.val(settings.markdown);
+            }
+            
+            if (settings.appendMarkdown !== "")
+            {
+                markdownTextarea.val(markdownTextarea.val() + settings.appendMarkdown);
+            }
+            
+            this.htmlTextarea     = editor.children("." + classNames.textarea.html);            
+            this.preview          = editor.children("." + classPrefix + "preview");
+            this.previewContainer = this.preview.children("." + classPrefix + "preview-container");
+            
+            if (settings.previewTheme !== "") 
+            {
+                this.preview.addClass(classPrefix + "preview-theme-" + settings.previewTheme);
+            }
+            
+            if (typeof define === "function" && define.amd)
+            {
+                if (typeof katex !== "undefined") 
+                {
+                    editormd.$katex = katex;
+                }
+                
+                if (settings.searchReplace && !settings.readOnly) 
+                {
+                    editormd.loadCSS(settings.path + "codemirror/addon/dialog/dialog");
+                    editormd.loadCSS(settings.path + "codemirror/addon/search/matchesonscrollbar");
+                }
+            }
+            
+            if ((typeof define === "function" && define.amd) || !settings.autoLoadModules)
+            {
+                if (typeof CodeMirror !== "undefined") {
+                    editormd.$CodeMirror = CodeMirror;
+                }
+                
+                if (typeof marked     !== "undefined") {
+                    editormd.$marked     = marked;
+                }
+                
+                this.setCodeMirror().setToolbar().loadedDisplay();
+            } 
+            else 
+            {
+                this.loadQueues();
+            }
+
+            return this;
+        },
+        
+        /**
+         * 所需组件加载队列
+         * Required components loading queue
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        loadQueues : function() {
+            var _this        = this;
+            var settings     = this.settings;
+            var loadPath     = settings.path;
+                                
+            var loadFlowChartOrSequenceDiagram = function() {
+                
+                if (editormd.isIE8) 
+                {
+                    _this.loadedDisplay();
+                    
+                    return ;
+                }
+
+                if (settings.flowChart || settings.sequenceDiagram) 
+                {
+                    editormd.loadScript(loadPath + "raphael.min", function() {
+
+                        editormd.loadScript(loadPath + "underscore.min", function() {  
+
+                            if (!settings.flowChart && settings.sequenceDiagram) 
+                            {
+                                editormd.loadScript(loadPath + "sequence-diagram.min", function() {
+                                    _this.loadedDisplay();
+                                });
+                            }
+                            else if (settings.flowChart && !settings.sequenceDiagram) 
+                            {      
+                                editormd.loadScript(loadPath + "flowchart.min", function() {  
+                                    editormd.loadScript(loadPath + "jquery.flowchart.min", function() {
+                                        _this.loadedDisplay();
+                                    });
+                                });
+                            }
+                            else if (settings.flowChart && settings.sequenceDiagram) 
+                            {  
+                                editormd.loadScript(loadPath + "flowchart.min", function() {  
+                                    editormd.loadScript(loadPath + "jquery.flowchart.min", function() {
+                                        editormd.loadScript(loadPath + "sequence-diagram.min", function() {
+                                            _this.loadedDisplay();
+                                        });
+                                    });
+                                });
+                            }
+                        });
+
+                    });
+                } 
+                else
+                {
+                    _this.loadedDisplay();
+                }
+            }; 
+
+            editormd.loadCSS(loadPath + "codemirror/codemirror.min");
+            
+            if (settings.searchReplace && !settings.readOnly)
+            {
+                editormd.loadCSS(loadPath + "codemirror/addon/dialog/dialog");
+                editormd.loadCSS(loadPath + "codemirror/addon/search/matchesonscrollbar");
+            }
+            
+            if (settings.codeFold)
+            {
+                editormd.loadCSS(loadPath + "codemirror/addon/fold/foldgutter");            
+            }
+            
+            editormd.loadScript(loadPath + "codemirror/codemirror.min", function() {
+                editormd.$CodeMirror = CodeMirror;
+                
+                editormd.loadScript(loadPath + "codemirror/modes.min", function() {
+                    
+                    editormd.loadScript(loadPath + "codemirror/addons.min", function() {
+                        
+                        _this.setCodeMirror();
+                        
+                        if (settings.mode !== "gfm" && settings.mode !== "markdown") 
+                        {
+                            _this.loadedDisplay();
+                            
+                            return false;
+                        }
+                        
+                        _this.setToolbar();
+
+                        editormd.loadScript(loadPath + "marked.min", function() {
+
+                            editormd.$marked = marked;
+                                
+                            if (settings.previewCodeHighlight) 
+                            {
+                                editormd.loadScript(loadPath + "prettify.min", function() {
+                                    loadFlowChartOrSequenceDiagram();
+                                });
+                            } 
+                            else
+                            {                  
+                                loadFlowChartOrSequenceDiagram();
+                            }
+                        });
+                        
+                    });
+                    
+                });
+                
+            });
+
+            return this;
+        },
+        
+        /**
+         * 设置 Editor.md 的整体主题，主要是工具栏
+         * Setting Editor.md theme
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setTheme : function(theme) {
+            var editor      = this.editor;
+            var oldTheme    = this.settings.theme;
+            var themePrefix = this.classPrefix + "theme-";
+            
+            editor.removeClass(themePrefix + oldTheme).addClass(themePrefix + theme);
+            
+            this.settings.theme = theme;
+            
+            return this;
+        },
+        
+        /**
+         * 设置 CodeMirror（编辑区）的主题
+         * Setting CodeMirror (Editor area) theme
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setEditorTheme : function(theme) {  
+            var settings   = this.settings;  
+            settings.editorTheme = theme;  
+            
+            if (theme !== "default")
+            {
+                editormd.loadCSS(settings.path + "codemirror/theme/" + settings.editorTheme);
+            }
+            
+            this.cm.setOption("theme", theme);
+            
+            return this;
+        },
+        
+        /**
+         * setEditorTheme() 的别名
+         * setEditorTheme() alias
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setCodeMirrorTheme : function (theme) {            
+            this.setEditorTheme(theme);
+            
+            return this;
+        },
+        
+        /**
+         * 设置 Editor.md 的主题
+         * Setting Editor.md theme
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setPreviewTheme : function(theme) {  
+            var preview     = this.preview;
+            var oldTheme    = this.settings.previewTheme;
+            var themePrefix = this.classPrefix + "preview-theme-";
+            
+            preview.removeClass(themePrefix + oldTheme).addClass(themePrefix + theme);
+            
+            this.settings.previewTheme = theme;
+            
+            return this;
+        },
+        
+        /**
+         * 配置和初始化CodeMirror组件
+         * CodeMirror initialization
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setCodeMirror : function() { 
+            var settings         = this.settings;
+            var editor           = this.editor;
+            
+            if (settings.editorTheme !== "default")
+            {
+                editormd.loadCSS(settings.path + "codemirror/theme/" + settings.editorTheme);
+            }
+            
+            var codeMirrorConfig = {
+                mode                      : settings.mode,
+                theme                     : settings.editorTheme,
+                tabSize                   : settings.tabSize,
+                dragDrop                  : false,
+                autofocus                 : settings.autoFocus,
+                autoCloseTags             : settings.autoCloseTags,
+                readOnly                  : (settings.readOnly) ? "nocursor" : false,
+                indentUnit                : settings.indentUnit,
+                lineNumbers               : settings.lineNumbers,
+                lineWrapping              : settings.lineWrapping,
+                extraKeys                 : {
+                                                "Ctrl-Q": function(cm) { 
+                                                    cm.foldCode(cm.getCursor()); 
+                                                }
+                                            },
+                foldGutter                : settings.codeFold,
+                gutters                   : ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
+                matchBrackets             : settings.matchBrackets,
+                indentWithTabs            : settings.indentWithTabs,
+                styleActiveLine           : settings.styleActiveLine,
+                styleSelectedText         : settings.styleSelectedText,
+                autoCloseBrackets         : settings.autoCloseBrackets,
+                showTrailingSpace         : settings.showTrailingSpace,
+                highlightSelectionMatches : ( (!settings.matchWordHighlight) ? false : { showToken: (settings.matchWordHighlight === "onselected") ? false : /\w/ } )
+            };
+            
+            this.codeEditor = this.cm        = editormd.$CodeMirror.fromTextArea(this.markdownTextarea[0], codeMirrorConfig);
+            this.codeMirror = this.cmElement = editor.children(".CodeMirror");
+            
+            if (settings.value !== "")
+            {
+                this.cm.setValue(settings.value);
+            }
+
+            this.codeMirror.css({
+                fontSize : settings.fontSize,
+                width    : (!settings.watch) ? "100%" : "50%"
+            });
+            
+            if (settings.autoHeight)
+            {
+                this.codeMirror.css("height", "auto");
+                this.cm.setOption("viewportMargin", Infinity);
+            }
+            
+            if (!settings.lineNumbers)
+            {
+                this.codeMirror.find(".CodeMirror-gutters").css("border-right", "none");
+            }
+
+            return this;
+        },
+        
+        /**
+         * 获取CodeMirror的配置选项
+         * Get CodeMirror setting options
+         * 
+         * @returns {Mixed}                  return CodeMirror setting option value
+         */
+        
+        getCodeMirrorOption : function(key) {            
+            return this.cm.getOption(key);
+        },
+        
+        /**
+         * 配置和重配置CodeMirror的选项
+         * CodeMirror setting options / resettings
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setCodeMirrorOption : function(key, value) {
+            
+            this.cm.setOption(key, value);
+            
+            return this;
+        },
+        
+        /**
+         * 添加 CodeMirror 键盘快捷键
+         * Add CodeMirror keyboard shortcuts key map
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        addKeyMap : function(map, bottom) {
+            this.cm.addKeyMap(map, bottom);
+            
+            return this;
+        },
+        
+        /**
+         * 移除 CodeMirror 键盘快捷键
+         * Remove CodeMirror keyboard shortcuts key map
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        removeKeyMap : function(map) {
+            this.cm.removeKeyMap(map);
+            
+            return this;
+        },
+        
+        /**
+         * 跳转到指定的行
+         * Goto CodeMirror line
+         * 
+         * @param   {String|Intiger}   line      line number or "first"|"last"
+         * @returns {editormd}                   返回editormd的实例对象
+         */
+        
+        gotoLine : function (line) {
+            
+            var settings = this.settings;
+            
+            if (!settings.gotoLine)
+            {
+                return this;
+            }
+            
+            var cm       = this.cm;
+            var editor   = this.editor;
+            var count    = cm.lineCount();
+            var preview  = this.preview;
+            
+            if (typeof line === "string")
+            {
+                if(line === "last")
+                {
+                    line = count;
+                }
+            
+                if (line === "first")
+                {
+                    line = 1;
+                }
+            }
+            
+            if (typeof line !== "number") 
+            {  
+                alert("Error: The line number must be an integer.");
+                return this;
+            }
+            
+            line  = parseInt(line) - 1;
+            
+            if (line > count)
+            {
+                alert("Error: The line number range 1-" + count);
+                
+                return this;
+            }
+            
+            cm.setCursor( {line : line, ch : 0} );
+            
+            var scrollInfo   = cm.getScrollInfo();
+            var clientHeight = scrollInfo.clientHeight; 
+            var coords       = cm.charCoords({line : line, ch : 0}, "local");
+            
+            cm.scrollTo(null, (coords.top + coords.bottom - clientHeight) / 2);
+            
+            if (settings.watch)
+            {            
+                var cmScroll  = this.codeMirror.find(".CodeMirror-scroll")[0];
+                var height    = $(cmScroll).height(); 
+                var scrollTop = cmScroll.scrollTop;         
+                var percent   = (scrollTop / cmScroll.scrollHeight);
+
+                if (scrollTop === 0)
+                {
+                    preview.scrollTop(0);
+                } 
+                else if (scrollTop + height >= cmScroll.scrollHeight - 16)
+                { 
+                    preview.scrollTop(preview[0].scrollHeight);                    
+                } 
+                else
+                {                    
+                    preview.scrollTop(preview[0].scrollHeight * percent);
+                }
+            }
+
+            cm.focus();
+            
+            return this;
+        },
+        
+        /**
+         * 扩展当前实例对象，可同时设置多个或者只设置一个
+         * Extend editormd instance object, can mutil setting.
+         * 
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        extend : function() {
+            if (typeof arguments[1] !== "undefined")
+            {
+                if (typeof arguments[1] === "function")
+                {
+                    arguments[1] = $.proxy(arguments[1], this);
+                }
+
+                this[arguments[0]] = arguments[1];
+            }
+            
+            if (typeof arguments[0] === "object" && typeof arguments[0].length === "undefined")
+            {
+                $.extend(true, this, arguments[0]);
+            }
+
+            return this;
+        },
+        
+        /**
+         * 设置或扩展当前实例对象，单个设置
+         * Extend editormd instance object, one by one
+         * 
+         * @param   {String|Object}   key       option key
+         * @param   {String|Object}   value     option value
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        set : function (key, value) {
+            
+            if (typeof value !== "undefined" && typeof value === "function")
+            {
+                value = $.proxy(value, this);
+            }
+            
+            this[key] = value;
+
+            return this;
+        },
+        
+        /**
+         * 重新配置
+         * Resetting editor options
+         * 
+         * @param   {String|Object}   key       option key
+         * @param   {String|Object}   value     option value
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        config : function(key, value) {
+            var settings = this.settings;
+            
+            if (typeof key === "object")
+            {
+                settings = $.extend(true, settings, key);
+            }
+            
+            if (typeof key === "string")
+            {
+                settings[key] = value;
+            }
+            
+            this.settings = settings;
+            this.recreate();
+            
+            return this;
+        },
+        
+        /**
+         * 注册事件处理方法
+         * Bind editor event handle
+         * 
+         * @param   {String}     eventType      event type
+         * @param   {Function}   callback       回调函数
+         * @returns {editormd}                  this(editormd instance object.)
+         */
+        
+        on : function(eventType, callback) {
+            var settings = this.settings;
+            
+            if (typeof settings["on" + eventType] !== "undefined") 
+            {                
+                settings["on" + eventType] = $.proxy(callback, this);      
+            }
+
+            return this;
+        },
+        
+        /**
+         * 解除事件处理方法
+         * Unbind editor event handle
+         * 
+         * @param   {String}   eventType          event type
+         * @returns {editormd}                    this(editormd instance object.)
+         */
+        
+        off : function(eventType) {
+            var settings = this.settings;
+            
+            if (typeof settings["on" + eventType] !== "undefined") 
+            {
+                settings["on" + eventType] = function(){};
+            }
+            
+            return this;
+        },
+        
+        /**
+         * 显示工具栏
+         * Display toolbar
+         * 
+         * @param   {Function} [callback=function(){}] 回调函数
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        showToolbar : function(callback) {
+            var settings = this.settings;
+            
+            if(settings.readOnly) {
+                return this;
+            }
+            
+            if (settings.toolbar && (this.toolbar.length < 1 || this.toolbar.find("." + this.classPrefix + "menu").html() === "") )
+            {
+                this.setToolbar();
+            }
+            
+            settings.toolbar = true; 
+            
+            this.toolbar.show();
+            this.resize();
+            
+            $.proxy(callback || function(){}, this)();
+
+            return this;
+        },
+        
+        /**
+         * 隐藏工具栏
+         * Hide toolbar
+         * 
+         * @param   {Function} [callback=function(){}] 回调函数
+         * @returns {editormd}                         this(editormd instance object.)
+         */
+        
+        hideToolbar : function(callback) { 
+            var settings = this.settings;
+            
+            settings.toolbar = false;  
+            this.toolbar.hide();
+            this.resize();
+            
+            $.proxy(callback || function(){}, this)();
+
+            return this;
+        },
+        
+        /**
+         * 页面滚动时工具栏的固定定位
+         * Set toolbar in window scroll auto fixed position
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setToolbarAutoFixed : function(fixed) {
+            
+            var state    = this.state;
+            var editor   = this.editor;
+            var toolbar  = this.toolbar;
+            var settings = this.settings;
+            
+            if (typeof fixed !== "undefined")
+            {
+                settings.toolbarAutoFixed = fixed;
+            }
+            
+            var autoFixedHandle = function(){
+                var $window = $(window);
+                var top     = $window.scrollTop();
+                
+                if (!settings.toolbarAutoFixed)
+                {
+                    return false;
+                }
+
+                if (top - editor.offset().top > 10 && top < editor.height())
+                {
+                    toolbar.css({
+                        position : "fixed",
+                        width    : editor.width() + "px",
+                        left     : ($window.width() - editor.width()) / 2 + "px"
+                    });
+                }
+                else
+                {
+                    toolbar.css({
+                        position : "absolute",
+                        width    : "100%",
+                        left     : 0
+                    });
+                }
+            };
+            
+            if (!state.fullscreen && !state.preview && settings.toolbar && settings.toolbarAutoFixed)
+            {
+                $(window).bind("scroll", autoFixedHandle);
+            }
+
+            return this;
+        },
+        
+        /**
+         * 配置和初始化工具栏
+         * Set toolbar and Initialization
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setToolbar : function() {
+            var settings    = this.settings;  
+            
+            if(settings.readOnly) {
+                return this;
+            }
+            
+            var editor      = this.editor;
+            var preview     = this.preview;
+            var classPrefix = this.classPrefix;
+            
+            var toolbar     = this.toolbar = editor.children("." + classPrefix + "toolbar");
+            
+            if (settings.toolbar && toolbar.length < 1)
+            {            
+                var toolbarHTML = "<div class=\"" + classPrefix + "toolbar\"><div class=\"" + classPrefix + "toolbar-container\"><ul class=\"" + classPrefix + "menu\"></ul></div></div>";
+                
+                editor.append(toolbarHTML);
+                toolbar = this.toolbar = editor.children("." + classPrefix + "toolbar");
+            }
+            
+            if (!settings.toolbar) 
+            {
+                toolbar.hide();
+                
+                return this;
+            }
+            
+            toolbar.show();
+            
+            var icons       = (typeof settings.toolbarIcons === "function") ? settings.toolbarIcons() 
+                            : ((typeof settings.toolbarIcons === "string")  ? editormd.toolbarModes[settings.toolbarIcons] : settings.toolbarIcons);
+            
+            var toolbarMenu = toolbar.find("." + this.classPrefix + "menu"), menu = "";
+            var pullRight   = false;
+            
+            for (var i = 0, len = icons.length; i < len; i++)
+            {
+                var name = icons[i];
+
+                if (name === "||") 
+                { 
+                    pullRight = true;
+                } 
+                else if (name === "|")
+                {
+                    menu += "<li class=\"divider\" unselectable=\"on\">|</li>";
+                }
+                else
+                {
+                    var isHeader = (/h(\d)/.test(name));
+                    var index    = name;
+                    
+                    if (name === "watch" && !settings.watch) {
+                        index = "unwatch";
+                    }
+                    
+                    var title     = settings.lang.toolbar[index];
+                    var iconTexts = settings.toolbarIconTexts[index];
+                    var iconClass = settings.toolbarIconsClass[index];
+                    
+                    title     = (typeof title     === "undefined") ? "" : title;
+                    iconTexts = (typeof iconTexts === "undefined") ? "" : iconTexts;
+                    iconClass = (typeof iconClass === "undefined") ? "" : iconClass;
+
+                    var menuItem = pullRight ? "<li class=\"pull-right\">" : "<li>";
+                    
+                    if (typeof settings.toolbarCustomIcons[name] !== "undefined" && typeof settings.toolbarCustomIcons[name] !== "function")
+                    {
+                        menuItem += settings.toolbarCustomIcons[name];
+                    }
+                    else 
+                    {
+                        menuItem += "<a href=\"javascript:;\" title=\"" + title + "\" unselectable=\"on\">";
+                        menuItem += "<i class=\"fa " + iconClass + "\" name=\""+name+"\" unselectable=\"on\">"+((isHeader) ? name.toUpperCase() : ( (iconClass === "") ? iconTexts : "") ) + "</i>";
+                        menuItem += "</a>";
+                    }
+
+                    menuItem += "</li>";
+
+                    menu = pullRight ? menuItem + menu : menu + menuItem;
+                }
+            }
+
+            toolbarMenu.html(menu);
+            
+            toolbarMenu.find("[title=\"Lowercase\"]").attr("title", settings.lang.toolbar.lowercase);
+            toolbarMenu.find("[title=\"ucwords\"]").attr("title", settings.lang.toolbar.ucwords);
+            
+            this.setToolbarHandler();
+            this.setToolbarAutoFixed();
+
+            return this;
+        },
+        
+        /**
+         * 工具栏图标事件处理对象序列
+         * Get toolbar icons event handlers
+         * 
+         * @param   {Object}   cm    CodeMirror的实例对象
+         * @param   {String}   name  要获取的事件处理器名称
+         * @returns {Object}         返回处理对象序列
+         */
+            
+        dialogLockScreen : function() {
+            $.proxy(editormd.dialogLockScreen, this)();
+            
+            return this;
+        },
+
+        dialogShowMask : function(dialog) {
+            $.proxy(editormd.dialogShowMask, this)(dialog);
+            
+            return this;
+        },
+        
+        getToolbarHandles : function(name) {  
+            var toolbarHandlers = this.toolbarHandlers = editormd.toolbarHandlers;
+            
+            return (name && typeof toolbarIconHandlers[name] !== "undefined") ? toolbarHandlers[name] : toolbarHandlers;
+        },
+        
+        /**
+         * 工具栏图标事件处理器
+         * Bind toolbar icons event handle
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        setToolbarHandler : function() {
+            var _this               = this;
+            var settings            = this.settings;
+            
+            if (!settings.toolbar || settings.readOnly) {
+                return this;
+            }
+            
+            var toolbar             = this.toolbar;
+            var cm                  = this.cm;
+            var classPrefix         = this.classPrefix;           
+            var toolbarIcons        = this.toolbarIcons = toolbar.find("." + classPrefix + "menu > li > a");  
+            var toolbarIconHandlers = this.getToolbarHandles();  
+                
+            toolbarIcons.bind(editormd.mouseOrTouch("click", "touchend"), function(event) {
+
+                var icon                = $(this).children(".fa");
+                var name                = icon.attr("name");
+                var cursor              = cm.getCursor();
+                var selection           = cm.getSelection();
+
+                if (name === "") {
+                    return ;
+                }
+                
+                _this.activeIcon = icon;
+
+                if (typeof toolbarIconHandlers[name] !== "undefined") 
+                {
+                    $.proxy(toolbarIconHandlers[name], _this)(cm);
+                }
+                else 
+                {
+                    if (typeof settings.toolbarHandlers[name] !== "undefined") 
+                    {
+                        $.proxy(settings.toolbarHandlers[name], _this)(cm, icon, cursor, selection);
+                    }
+                }
+                
+                if (name !== "link" && name !== "reference-link" && name !== "image" && name !== "code-block" && 
+                    name !== "preformatted-text" && name !== "watch" && name !== "preview" && name !== "search" && name !== "fullscreen" && name !== "info") 
+                {
+                    cm.focus();
+                }
+
+                return false;
+
+            });
+
+            return this;
+        },
+        
+        /**
+         * 动态创建对话框
+         * Creating custom dialogs
+         * 
+         * @param   {Object} options  配置项键值对 Key/Value
+         * @returns {dialog}          返回创建的dialog的jQuery实例对象
+         */
+        
+        createDialog : function(options) {            
+            return $.proxy(editormd.createDialog, this)(options);
+        },
+        
+        /**
+         * 创建关于Editor.md的对话框
+         * Create about Editor.md dialog
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        createInfoDialog : function() {
+            var _this        = this;
+			var editor       = this.editor;
+            var classPrefix  = this.classPrefix;  
+            
+            var infoDialogHTML = [
+                "<div class=\"" + classPrefix + "dialog " + classPrefix + "dialog-info\" style=\"\">",
+                "<div class=\"" + classPrefix + "dialog-container\">",
+                "<h1><i class=\"editormd-logo editormd-logo-lg editormd-logo-color\"></i> " + editormd.title + "<small>v" + editormd.version + "</small></h1>",
+                "<p>" + this.lang.description + "</p>",
+                "<p style=\"margin: 10px 0 20px 0;\"><a href=\"" + editormd.homePage + "\" target=\"_blank\">" + editormd.homePage + " <i class=\"fa fa-external-link\"></i></a></p>",
+                "<p style=\"font-size: 0.85em;\">Copyright &copy; 2015 <a href=\"https://github.com/pandao\" target=\"_blank\" class=\"hover-link\">Pandao</a>, The <a href=\"https://github.com/pandao/editor.md/blob/master/LICENSE\" target=\"_blank\" class=\"hover-link\">MIT</a> License.</p>",
+                "</div>",
+                "<a href=\"javascript:;\" class=\"fa fa-close " + classPrefix + "dialog-close\"></a>",
+                "</div>"
+            ].join("\n");
+
+            editor.append(infoDialogHTML);
+            
+            var infoDialog  = this.infoDialog = editor.children("." + classPrefix + "dialog-info");
+
+            infoDialog.find("." + classPrefix + "dialog-close").bind(editormd.mouseOrTouch("click", "touchend"), function() {
+                _this.hideInfoDialog();
+            });
+            
+            infoDialog.css("border", (editormd.isIE8) ? "1px solid #ddd" : "").css("z-index", editormd.dialogZindex).show();
+            
+            this.infoDialogPosition();
+
+            return this;
+        },
+        
+        /**
+         * 关于Editor.md对话居中定位
+         * Editor.md dialog position handle
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        infoDialogPosition : function() {
+            var infoDialog = this.infoDialog;
+            
+			var _infoDialogPosition = function() {
+				infoDialog.css({
+					top  : ($(window).height() - infoDialog.height()) / 2 + "px",
+					left : ($(window).width()  - infoDialog.width()) / 2  + "px"
+				});
+			};
+
+			_infoDialogPosition();
+
+			$(window).resize(_infoDialogPosition);
+            
+            return this;
+        },
+        
+        /**
+         * 显示关于Editor.md
+         * Display about Editor.md dialog
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        showInfoDialog : function() {
+
+            $("html,body").css("overflow-x", "hidden");
+            
+            var _this       = this;
+			var editor      = this.editor;
+            var settings    = this.settings;         
+			var infoDialog  = this.infoDialog = editor.children("." + this.classPrefix + "dialog-info");
+            
+            if (infoDialog.length < 1)
+            {
+                this.createInfoDialog();
+            }
+            
+            this.lockScreen(true);
+            
+            this.mask.css({
+						opacity         : settings.dialogMaskOpacity,
+						backgroundColor : settings.dialogMaskBgColor
+					}).show();
+
+			infoDialog.css("z-index", editormd.dialogZindex).show();
+
+			this.infoDialogPosition();
+
+            return this;
+        },
+        
+        /**
+         * 隐藏关于Editor.md
+         * Hide about Editor.md dialog
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        hideInfoDialog : function() {            
+            $("html,body").css("overflow-x", "");
+            this.infoDialog.hide();
+            this.mask.hide();
+            this.lockScreen(false);
+
+            return this;
+        },
+        
+        /**
+         * 锁屏
+         * lock screen
+         * 
+         * @param   {Boolean}    lock    Boolean 布尔值，是否锁屏
+         * @returns {editormd}           返回editormd的实例对象
+         */
+        
+        lockScreen : function(lock) {
+            editormd.lockScreen(lock);
+            this.resize();
+
+            return this;
+        },
+        
+        /**
+         * 编辑器界面重建，用于动态语言包或模块加载等
+         * Recreate editor
+         * 
+         * @returns {editormd}  返回editormd的实例对象
+         */
+        
+        recreate : function() {
+            var _this            = this;
+            var editor           = this.editor;
+            var settings         = this.settings;
+            
+            this.codeMirror.remove();
+            
+            this.setCodeMirror();
+
+            if (!settings.readOnly) 
+            {
+                if (editor.find(".editormd-dialog").length > 0) {
+                    editor.find(".editormd-dialog").remove();
+                }
+                
+                if (settings.toolbar) 
+                {  
+                    this.getToolbarHandles();                  
+                    this.setToolbar();
+                }
+            }
+            
+            this.loadedDisplay(true);
+
+            return this;
+        },
+        
+        /**
+         * 高亮预览HTML的pre代码部分
+         * highlight of preview codes
+         * 
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        previewCodeHighlight : function() {    
+            var settings         = this.settings;
+            var previewContainer = this.previewContainer;
+            
+            if (settings.previewCodeHighlight) 
+            {
+                previewContainer.find("pre").addClass("prettyprint linenums");
+                
+                if (typeof prettyPrint !== "undefined")
+                {                    
+                    prettyPrint();
+                }
+            }
+
+            return this;
+        },
+        
+        /**
+         * 解析TeX(KaTeX)科学公式
+         * TeX(KaTeX) Renderer
+         * 
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        katexRender : function() {
+            
+            if (timer === null)
+            {
+                return this;
+            }
+            
+            this.previewContainer.find("." + editormd.classNames.tex).each(function(){
+                var tex  = $(this);
+                editormd.$katex.render(tex.text(), tex[0]);
+                
+                tex.find(".katex").css("font-size", "1.6em");
+            });   
+
+            return this;
+        },
+        
+        /**
+         * 解析和渲染流程图及时序图
+         * FlowChart and SequenceDiagram Renderer
+         * 
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        flowChartAndSequenceDiagramRender : function() {
+            var $this            = this;
+            var settings         = this.settings;
+            var previewContainer = this.previewContainer;
+            
+            if (editormd.isIE8) {
+                return this;
+            }
+
+            if (settings.flowChart) {
+                if (flowchartTimer === null) {
+                    return this;
+                }
+                
+                previewContainer.find(".flowchart").flowChart(); 
+            }
+
+            if (settings.sequenceDiagram) {
+                previewContainer.find(".sequence-diagram").sequenceDiagram({theme: "simple"});
+            }
+                    
+            var preview    = $this.preview;
+            var codeMirror = $this.codeMirror;
+            var codeView   = codeMirror.find(".CodeMirror-scroll");
+
+            var height    = codeView.height();
+            var scrollTop = codeView.scrollTop();                    
+            var percent   = (scrollTop / codeView[0].scrollHeight);
+            var tocHeight = 0;
+
+            preview.find(".markdown-toc-list").each(function(){
+                tocHeight += $(this).height();
+            });
+
+            var tocMenuHeight = preview.find(".editormd-toc-menu").height(); 
+            tocMenuHeight = (!tocMenuHeight) ? 0 : tocMenuHeight;
+
+            if (scrollTop === 0) 
+            {
+                preview.scrollTop(0);
+            } 
+            else if (scrollTop + height >= codeView[0].scrollHeight - 16)
+            { 
+                preview.scrollTop(preview[0].scrollHeight);                        
+            } 
+            else
+            {                  
+                preview.scrollTop((preview[0].scrollHeight + tocHeight + tocMenuHeight) * percent);
+            }
+
+            return this;
+        },
+        
+        /**
+         * 注册键盘快捷键处理
+         * Register CodeMirror keyMaps (keyboard shortcuts).
+         * 
+         * @param   {Object}    keyMap      KeyMap key/value {"(Ctrl/Shift/Alt)-Key" : function(){}}
+         * @returns {editormd}              return this
+         */
+        
+        registerKeyMaps : function(keyMap) {
+            
+            var _this           = this;
+            var cm              = this.cm;
+            var settings        = this.settings;
+            var toolbarHandlers = editormd.toolbarHandlers;
+            var disabledKeyMaps = settings.disabledKeyMaps;
+            
+            keyMap              = keyMap || null;
+            
+            if (keyMap)
+            {
+                for (var i in keyMap)
+                {
+                    if ($.inArray(i, disabledKeyMaps) < 0)
+                    {
+                        var map = {};
+                        map[i]  = keyMap[i];
+
+                        cm.addKeyMap(keyMap);
+                    }
+                }
+            }
+            else
+            {
+                for (var k in editormd.keyMaps)
+                {
+                    var _keyMap = editormd.keyMaps[k];
+                    var handle = (typeof _keyMap === "string") ? $.proxy(toolbarHandlers[_keyMap], _this) : $.proxy(_keyMap, _this);
+                    
+                    if ($.inArray(k, ["F9", "F10", "F11"]) < 0 && $.inArray(k, disabledKeyMaps) < 0)
+                    {
+                        var _map = {};
+                        _map[k] = handle;
+
+                        cm.addKeyMap(_map);
+                    }
+                }
+                
+                $(window).keydown(function(event) {
+                    
+                    var keymaps = {
+                        "120" : "F9",
+                        "121" : "F10",
+                        "122" : "F11"
+                    };
+                    
+                    if ( $.inArray(keymaps[event.keyCode], disabledKeyMaps) < 0 )
+                    {
+                        switch (event.keyCode)
+                        {
+                            case 120:
+                                    $.proxy(toolbarHandlers["watch"], _this)();
+                                    return false;
+                                break;
+                                
+                            case 121:
+                                    $.proxy(toolbarHandlers["preview"], _this)();
+                                    return false;
+                                break;
+                                
+                            case 122:
+                                    $.proxy(toolbarHandlers["fullscreen"], _this)();                        
+                                    return false;
+                                break;
+                                
+                            default:
+                                break;
+                        }
+                    }
+                });
+            }
+
+            return this;
+        },
+        
+        /**
+         * 绑定同步滚动
+         * 
+         * @returns {editormd} return this
+         */
+        
+        bindScrollEvent : function() {
+            
+            var _this            = this;
+            var preview          = this.preview;
+            var settings         = this.settings;
+            var codeMirror       = this.codeMirror;
+            var mouseOrTouch     = editormd.mouseOrTouch;
+            
+            if (!settings.syncScrolling) {
+                return this;
+            }
+                
+            var cmBindScroll = function() {    
+                codeMirror.find(".CodeMirror-scroll").bind(mouseOrTouch("scroll", "touchmove"), function(event) {
+                    var height    = $(this).height();
+                    var scrollTop = $(this).scrollTop();                    
+                    var percent   = (scrollTop / $(this)[0].scrollHeight);
+                    
+                    var tocHeight = 0;
+                    
+                    preview.find(".markdown-toc-list").each(function(){
+                        tocHeight += $(this).height();
+                    });
+                    
+                    var tocMenuHeight = preview.find(".editormd-toc-menu").height();
+                    tocMenuHeight = (!tocMenuHeight) ? 0 : tocMenuHeight;
+
+                    if (scrollTop === 0) 
+                    {
+                        preview.scrollTop(0);
+                    } 
+                    else if (scrollTop + height >= $(this)[0].scrollHeight - 16)
+                    { 
+                        preview.scrollTop(preview[0].scrollHeight);                        
+                    } 
+                    else
+                    {
+                        preview.scrollTop((preview[0].scrollHeight  + tocHeight + tocMenuHeight) * percent);
+                    }
+                    
+                    $.proxy(settings.onscroll, _this)(event);
+                });
+            };
+
+            var cmUnbindScroll = function() {
+                codeMirror.find(".CodeMirror-scroll").unbind(mouseOrTouch("scroll", "touchmove"));
+            };
+
+            var previewBindScroll = function() {
+                
+                preview.bind(mouseOrTouch("scroll", "touchmove"), function(event) {
+                    var height    = $(this).height();
+                    var scrollTop = $(this).scrollTop();         
+                    var percent   = (scrollTop / $(this)[0].scrollHeight);
+                    var codeView  = codeMirror.find(".CodeMirror-scroll");
+
+                    if(scrollTop === 0) 
+                    {
+                        codeView.scrollTop(0);
+                    }
+                    else if (scrollTop + height >= $(this)[0].scrollHeight)
+                    {
+                        codeView.scrollTop(codeView[0].scrollHeight);                        
+                    }
+                    else 
+                    {
+                        codeView.scrollTop(codeView[0].scrollHeight * percent);
+                    }
+                    
+                    $.proxy(settings.onpreviewscroll, _this)(event);
+                });
+
+            };
+
+            var previewUnbindScroll = function() {
+                preview.unbind(mouseOrTouch("scroll", "touchmove"));
+            }; 
+
+			codeMirror.bind({
+				mouseover  : cmBindScroll,
+				mouseout   : cmUnbindScroll,
+				touchstart : cmBindScroll,
+				touchend   : cmUnbindScroll
+			});
+            
+            if (settings.syncScrolling === "single") {
+                return this;
+            }
+            
+			preview.bind({
+				mouseover  : previewBindScroll,
+				mouseout   : previewUnbindScroll,
+				touchstart : previewBindScroll,
+				touchend   : previewUnbindScroll
+			});
+
+            return this;
+        },
+        
+        bindChangeEvent : function() {
+            
+            var _this            = this;
+            var cm               = this.cm;
+            var settings         = this.settings;
+            
+            if (!settings.syncScrolling) {
+                return this;
+            }
+            
+            cm.on("change", function(_cm, changeObj) {
+                
+                if (settings.watch)
+                {
+                    _this.previewContainer.css("padding", settings.autoHeight ? "20px 20px 50px 40px" : "20px");
+                }
+                
+                timer = setTimeout(function() {
+                    clearTimeout(timer);
+                    _this.save();
+                    timer = null;
+                }, settings.delay);
+            });
+
+            return this;
+        },
+        
+        /**
+         * 加载队列完成之后的显示处理
+         * Display handle of the module queues loaded after.
+         * 
+         * @param   {Boolean}   recreate   是否为重建编辑器
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        loadedDisplay : function(recreate) {
+            
+            recreate             = recreate || false;
+            
+            var _this            = this;
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var settings         = this.settings;
+            
+            this.containerMask.hide();
+            
+            this.save();
+            
+            if (settings.watch) {
+                preview.show();
+            }
+            
+            editor.data("oldWidth", editor.width()).data("oldHeight", editor.height()); // 为了兼容Zepto
+            
+            this.resize();
+            this.registerKeyMaps();
+            
+            $(window).resize(function(){
+                _this.resize();
+            });
+            
+            this.bindScrollEvent().bindChangeEvent();
+            
+            if (!recreate)
+            {
+                $.proxy(settings.onload, this)();
+            }
+            
+            this.state.loaded = true;
+
+            return this;
+        },
+        
+        /**
+         * 设置编辑器的宽度
+         * Set editor width
+         * 
+         * @param   {Number|String} width  编辑器宽度值
+         * @returns {editormd}             返回editormd的实例对象
+         */
+        
+        width : function(width) {
+                
+            this.editor.css("width", (typeof width === "number") ? width  + "px" : width);            
+            this.resize();
+            
+            return this;
+        },
+        
+        /**
+         * 设置编辑器的高度
+         * Set editor height
+         * 
+         * @param   {Number|String} height  编辑器高度值
+         * @returns {editormd}              返回editormd的实例对象
+         */
+        
+        height : function(height) {
+                
+            this.editor.css("height", (typeof height === "number")  ? height  + "px" : height);            
+            this.resize();
+            
+            return this;
+        },
+        
+        /**
+         * 调整编辑器的尺寸和布局
+         * Resize editor layout
+         * 
+         * @param   {Number|String} [width=null]  编辑器宽度值
+         * @param   {Number|String} [height=null] 编辑器高度值
+         * @returns {editormd}                    返回editormd的实例对象
+         */
+        
+        resize : function(width, height) {
+            
+            width  = width  || null;
+            height = height || null;
+            
+            var state      = this.state;
+            var editor     = this.editor;
+            var preview    = this.preview;
+            var toolbar    = this.toolbar;
+            var settings   = this.settings;
+            var codeMirror = this.codeMirror;
+            
+            if (width)
+            {
+                editor.css("width", (typeof width  === "number") ? width  + "px" : width);
+            }
+            
+            if (settings.autoHeight && !state.fullscreen && !state.preview)
+            {
+                editor.css("height", "auto");
+                codeMirror.css("height", "auto");
+            } 
+            else 
+            {
+                if (height) 
+                {
+                    editor.css("height", (typeof height === "number") ? height + "px" : height);
+                }
+                
+                if (state.fullscreen)
+                {
+                    editor.height($(window).height());
+                }
+
+                if (settings.toolbar && !settings.readOnly) 
+                {
+                    codeMirror.css("margin-top", toolbar.height() + 1).height(editor.height() - toolbar.height());
+                } 
+                else
+                {
+                    codeMirror.css("margin-top", 0).height(editor.height());
+                }
+            }
+            
+            if(settings.watch) 
+            {
+                codeMirror.width(editor.width() / 2);
+                preview.width((!state.preview) ? editor.width() / 2 : editor.width());
+                
+                this.previewContainer.css("padding", settings.autoHeight ? "20px 20px 50px 40px" : "20px");
+                
+                if (settings.toolbar && !settings.readOnly) 
+                {
+                    preview.css("top", toolbar.height() + 1);
+                } 
+                else 
+                {
+                    preview.css("top", 0);
+                }
+                
+                if (settings.autoHeight && !state.fullscreen && !state.preview)
+                {
+                    preview.height("");
+                }
+                else
+                {                
+                    var previewHeight = (settings.toolbar && !settings.readOnly) ? editor.height() - toolbar.height() : editor.height();
+                    
+                    preview.height(previewHeight);
+                }
+            } 
+            else 
+            {
+                codeMirror.width(editor.width());
+                preview.hide();
+            }
+            
+            if (state.loaded) 
+            {
+                $.proxy(settings.onresize, this)();
+            }
+
+            return this;
+        },
+        
+        /**
+         * 解析和保存Markdown代码
+         * Parse & Saving Markdown source code
+         * 
+         * @returns {editormd}     返回editormd的实例对象
+         */
+        
+        save : function() {
+            
+            if (timer === null)
+            {
+                return this;
+            }
+            
+            var _this            = this;
+            var state            = this.state;
+            var settings         = this.settings;
+            var cm               = this.cm;            
+            var cmValue          = cm.getValue();
+            var previewContainer = this.previewContainer;
+
+            if (settings.mode !== "gfm" && settings.mode !== "markdown") 
+            {
+                this.markdownTextarea.val(cmValue);
+                
+                return this;
+            }
+            
+            var marked          = editormd.$marked;
+            var markdownToC     = this.markdownToC = [];            
+            var rendererOptions = this.markedRendererOptions = {  
+                toc                  : settings.toc,
+                tocm                 : settings.tocm,
+                tocStartLevel        : settings.tocStartLevel,
+                pageBreak            : settings.pageBreak,
+                taskList             : settings.taskList,
+                emoji                : settings.emoji,
+                tex                  : settings.tex,
+                atLink               : settings.atLink,           // for @link
+                emailLink            : settings.emailLink,        // for mail address auto link
+                flowChart            : settings.flowChart,
+                sequenceDiagram      : settings.sequenceDiagram,
+                previewCodeHighlight : settings.previewCodeHighlight,
+            };
+            
+            var markedOptions = this.markedOptions = {
+                renderer    : editormd.markedRenderer(markdownToC, rendererOptions),
+                gfm         : true,
+                tables      : true,
+                breaks      : true,
+                pedantic    : false,
+                sanitize    : (settings.htmlDecode) ? false : true,  // 关闭忽略HTML标签，即开启识别HTML标签，默认为false
+                smartLists  : true,
+                smartypants : true
+            };
+            
+            marked.setOptions(markedOptions);
+                    
+            var newMarkdownDoc = editormd.$marked(cmValue, markedOptions);
+            
+            //console.info("cmValue", cmValue, newMarkdownDoc);
+            
+            newMarkdownDoc = editormd.filterHTMLTags(newMarkdownDoc, settings.htmlDecode);
+            
+            //console.error("cmValue", cmValue, newMarkdownDoc);
+            
+            this.markdownTextarea.text(cmValue);
+            
+            cm.save();
+            
+            if (settings.saveHTMLToTextarea) 
+            {
+                this.htmlTextarea.text(newMarkdownDoc);
+            }
+            
+            if(settings.watch || (!settings.watch && state.preview))
+            {
+                previewContainer.html(newMarkdownDoc);
+
+                this.previewCodeHighlight();
+                
+                if (settings.toc) 
+                {
+                    var tocContainer = (settings.tocContainer === "") ? previewContainer : $(settings.tocContainer);
+                    var tocMenu      = tocContainer.find("." + this.classPrefix + "toc-menu");
+                    
+                    tocContainer.attr("previewContainer", (settings.tocContainer === "") ? "true" : "false");
+                    
+                    if (settings.tocContainer !== "" && tocMenu.length > 0)
+                    {
+                        tocMenu.remove();
+                    }
+                    
+                    editormd.markdownToCRenderer(markdownToC, tocContainer, settings.tocDropdown, settings.tocStartLevel);
+            
+                    if (settings.tocDropdown || tocContainer.find("." + this.classPrefix + "toc-menu").length > 0)
+                    {
+                        editormd.tocDropdownMenu(tocContainer, (settings.tocTitle !== "") ? settings.tocTitle : this.lang.tocTitle);
+                    }
+            
+                    if (settings.tocContainer !== "")
+                    {
+                        previewContainer.find(".markdown-toc").css("border", "none");
+                    }
+                }
+                
+                if (settings.tex)
+                {
+                    if (!editormd.kaTeXLoaded && settings.autoLoadModules) 
+                    {
+                        editormd.loadKaTeX(function() {
+                            editormd.$katex = katex;
+                            editormd.kaTeXLoaded = true;
+                            _this.katexRender();
+                        });
+                    } 
+                    else 
+                    {
+                        editormd.$katex = katex;
+                        this.katexRender();
+                    }
+                }                
+                
+                if (settings.flowChart || settings.sequenceDiagram)
+                {
+                    flowchartTimer = setTimeout(function(){
+                        clearTimeout(flowchartTimer);
+                        _this.flowChartAndSequenceDiagramRender();
+                        flowchartTimer = null;
+                    }, 10);
+                }
+
+                if (state.loaded) 
+                {
+                    $.proxy(settings.onchange, this)();
+                }
+            }
+
+            return this;
+        },
+        
+        /**
+         * 聚焦光标位置
+         * Focusing the cursor position
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        focus : function() {
+            this.cm.focus();
+
+            return this;
+        },
+        
+        /**
+         * 设置光标的位置
+         * Set cursor position
+         * 
+         * @param   {Object}    cursor 要设置的光标位置键值对象，例：{line:1, ch:0}
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        setCursor : function(cursor) {
+            this.cm.setCursor(cursor);
+
+            return this;
+        },
+        
+        /**
+         * 获取当前光标的位置
+         * Get the current position of the cursor
+         * 
+         * @returns {Cursor}         返回一个光标Cursor对象
+         */
+        
+        getCursor : function() {
+            return this.cm.getCursor();
+        },
+        
+        /**
+         * 设置光标选中的范围
+         * Set cursor selected ranges
+         * 
+         * @param   {Object}    from   开始位置的光标键值对象，例：{line:1, ch:0}
+         * @param   {Object}    to     结束位置的光标键值对象，例：{line:1, ch:0}
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        setSelection : function(from, to) {
+        
+            this.cm.setSelection(from, to);
+        
+            return this;
+        },
+        
+        /**
+         * 获取光标选中的文本
+         * Get the texts from cursor selected
+         * 
+         * @returns {String}         返回选中文本的字符串形式
+         */
+        
+        getSelection : function() {
+            return this.cm.getSelection();
+        },
+        
+        /**
+         * 设置光标选中的文本范围
+         * Set the cursor selection ranges
+         * 
+         * @param   {Array}    ranges  cursor selection ranges array
+         * @returns {Array}            return this
+         */
+        
+        setSelections : function(ranges) {
+            this.cm.setSelections(ranges);
+            
+            return this;
+        },
+        
+        /**
+         * 获取光标选中的文本范围
+         * Get the cursor selection ranges
+         * 
+         * @returns {Array}         return selection ranges array
+         */
+        
+        getSelections : function() {
+            return this.cm.getSelections();
+        },
+        
+        /**
+         * 替换当前光标选中的文本或在当前光标处插入新字符
+         * Replace the text at the current cursor selected or insert a new character at the current cursor position
+         * 
+         * @param   {String}    value  要插入的字符值
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        replaceSelection : function(value) {
+            this.cm.replaceSelection(value);
+
+            return this;
+        },
+        
+        /**
+         * 在当前光标处插入新字符
+         * Insert a new character at the current cursor position
+         *
+         * 同replaceSelection()方法
+         * With the replaceSelection() method
+         * 
+         * @param   {String}    value  要插入的字符值
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        insertValue : function(value) {
+            this.replaceSelection(value);
+
+            return this;
+        },
+        
+        /**
+         * 追加markdown
+         * append Markdown to editor
+         * 
+         * @param   {String}    md     要追加的markdown源文档
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        appendMarkdown : function(md) {
+            var settings = this.settings;
+            var cm       = this.cm;
+            
+            cm.setValue(cm.getValue() + md);
+            
+            return this;
+        },
+        
+        /**
+         * 设置和传入编辑器的markdown源文档
+         * Set Markdown source document
+         * 
+         * @param   {String}    md     要传入的markdown源文档
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        setMarkdown : function(md) {
+            this.cm.setValue(md || this.settings.markdown);
+            
+            return this;
+        },
+        
+        /**
+         * 获取编辑器的markdown源文档
+         * Set Editor.md markdown/CodeMirror value
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        getMarkdown : function() {
+            return this.cm.getValue();
+        },
+        
+        /**
+         * 获取编辑器的源文档
+         * Get CodeMirror value
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        getValue : function() {
+            return this.cm.getValue();
+        },
+        
+        /**
+         * 设置编辑器的源文档
+         * Set CodeMirror value
+         * 
+         * @param   {String}     value   set code/value/string/text
+         * @returns {editormd}           返回editormd的实例对象
+         */
+        
+        setValue : function(value) {
+            this.cm.setValue(value);
+            
+            return this;
+        },
+        
+        /**
+         * 清空编辑器
+         * Empty CodeMirror editor container
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        clear : function() {
+            this.cm.setValue("");
+            
+            return this;
+        },
+        
+        /**
+         * 获取解析后存放在Textarea的HTML源码
+         * Get parsed html code from Textarea
+         * 
+         * @returns {String}               返回HTML源码
+         */
+        
+        getHTML : function() {
+            if (!this.settings.saveHTMLToTextarea)
+            {
+                alert("Error: settings.saveHTMLToTextarea == false");
+
+                return false;
+            }
+            
+            return this.htmlTextarea.val();
+        },
+        
+        /**
+         * getHTML()的别名
+         * getHTML (alias)
+         * 
+         * @returns {String}           Return html code 返回HTML源码
+         */
+        
+        getTextareaSavedHTML : function() {
+            return this.getHTML();
+        },
+        
+        /**
+         * 获取预览窗口的HTML源码
+         * Get html from preview container
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        getPreviewedHTML : function() {
+            if (!this.settings.watch)
+            {
+                alert("Error: settings.watch == false");
+
+                return false;
+            }
+            
+            return this.previewContainer.html();
+        },
+        
+        /**
+         * 开启实时预览
+         * Enable real-time watching
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        watch : function(callback) {     
+            var settings        = this.settings;
+            
+            if ($.inArray(settings.mode, ["gfm", "markdown"]) < 0)
+            {
+                return this;
+            }
+            
+            this.state.watching = settings.watch = true;
+            this.preview.show();
+            
+            if (this.toolbar)
+            {
+                var watchIcon   = settings.toolbarIconsClass.watch;
+                var unWatchIcon = settings.toolbarIconsClass.unwatch;
+                
+                var icon        = this.toolbar.find(".fa[name=watch]");
+                icon.parent().attr("title", settings.lang.toolbar.watch);
+                icon.removeClass(unWatchIcon).addClass(watchIcon);
+            }
+            
+            this.codeMirror.css("border-right", "1px solid #ddd").width(this.editor.width() / 2); 
+            
+            timer = 0;
+            
+            this.save().resize();
+            
+            if (!settings.onwatch)
+            {
+                settings.onwatch = callback || function() {};
+            }
+            
+            $.proxy(settings.onwatch, this)();
+            
+            return this;
+        },
+        
+        /**
+         * 关闭实时预览
+         * Disable real-time watching
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        unwatch : function(callback) {
+            var settings        = this.settings;
+            this.state.watching = settings.watch = false;
+            this.preview.hide();
+            
+            if (this.toolbar) 
+            {
+                var watchIcon   = settings.toolbarIconsClass.watch;
+                var unWatchIcon = settings.toolbarIconsClass.unwatch;
+                
+                var icon    = this.toolbar.find(".fa[name=watch]");
+                icon.parent().attr("title", settings.lang.toolbar.unwatch);
+                icon.removeClass(watchIcon).addClass(unWatchIcon);
+            }
+            
+            this.codeMirror.css("border-right", "none").width(this.editor.width());
+            
+            this.resize();
+            
+            if (!settings.onunwatch)
+            {
+                settings.onunwatch = callback || function() {};
+            }
+            
+            $.proxy(settings.onunwatch, this)();
+            
+            return this;
+        },
+        
+        /**
+         * 显示编辑器
+         * Show editor
+         * 
+         * @param   {Function} [callback=function()] 回调函数
+         * @returns {editormd}                       返回editormd的实例对象
+         */
+        
+        show : function(callback) {
+            callback  = callback || function() {};
+            
+            var _this = this;
+            this.editor.show(0, function() {
+                $.proxy(callback, _this)();
+            });
+            
+            return this;
+        },
+        
+        /**
+         * 隐藏编辑器
+         * Hide editor
+         * 
+         * @param   {Function} [callback=function()] 回调函数
+         * @returns {editormd}                       返回editormd的实例对象
+         */
+        
+        hide : function(callback) {
+            callback  = callback || function() {};
+            
+            var _this = this;
+            this.editor.hide(0, function() {
+                $.proxy(callback, _this)();
+            });
+            
+            return this;
+        },
+        
+        /**
+         * 隐藏编辑器部分，只预览HTML
+         * Enter preview html state
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        previewing : function() {
+            
+            var _this            = this;
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var toolbar          = this.toolbar;
+            var settings         = this.settings;
+            var codeMirror       = this.codeMirror;
+            var previewContainer = this.previewContainer;
+            
+            if ($.inArray(settings.mode, ["gfm", "markdown"]) < 0) {
+                return this;
+            }
+            
+            if (settings.toolbar && toolbar) {
+                toolbar.toggle();
+                toolbar.find(".fa[name=preview]").toggleClass("active");
+            }
+            
+            codeMirror.toggle();
+            
+            var escHandle = function(event) {
+                if (event.shiftKey && event.keyCode === 27) {
+                    _this.previewed();
+                }
+            };
+
+            if (codeMirror.css("display") === "none") // 为了兼容Zepto，而不使用codeMirror.is(":hidden")
+            {
+                this.state.preview = true;
+
+                if (this.state.fullscreen) {
+                    preview.css("background", "#fff");
+                }
+                
+                editor.find("." + this.classPrefix + "preview-close-btn").show().bind(editormd.mouseOrTouch("click", "touchend"), function(){
+                    _this.previewed();
+                });
+            
+                if (!settings.watch)
+                {
+                    this.save();
+                } 
+                else 
+                {
+                    previewContainer.css("padding", "");
+                }
+                
+                previewContainer.addClass(this.classPrefix + "preview-active");
+
+                preview.show().css({
+                    position  : "",
+                    top       : 0,
+                    width     : editor.width(),
+                    height    : (settings.autoHeight && !this.state.fullscreen) ? "auto" : editor.height()
+                });
+                
+                if (this.state.loaded)
+                {
+                    $.proxy(settings.onpreviewing, this)();
+                }
+
+                $(window).bind("keyup", escHandle);
+            } 
+            else 
+            {
+                $(window).unbind("keyup", escHandle);
+                this.previewed();
+            }
+        },
+        
+        /**
+         * 显示编辑器部分，退出只预览HTML
+         * Exit preview html state
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        previewed : function() {
+            
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var toolbar          = this.toolbar;
+            var settings         = this.settings;
+            var previewContainer = this.previewContainer;
+            var previewCloseBtn  = editor.find("." + this.classPrefix + "preview-close-btn");
+
+            this.state.preview   = false;
+            
+            this.codeMirror.show();
+            
+            if (settings.toolbar) {
+                toolbar.show();
+            }
+            
+            preview[(settings.watch) ? "show" : "hide"]();
+            
+            previewCloseBtn.hide().unbind(editormd.mouseOrTouch("click", "touchend"));
+                
+            previewContainer.removeClass(this.classPrefix + "preview-active");
+                
+            if (settings.watch)
+            {
+                previewContainer.css("padding", "20px");
+            }
+            
+            preview.css({ 
+                background : null,
+                position   : "absolute",
+                width      : editor.width() / 2,
+                height     : (settings.autoHeight && !this.state.fullscreen) ? "auto" : editor.height() - toolbar.height(),
+                top        : (settings.toolbar)    ? toolbar.height() : 0
+            });
+
+            if (this.state.loaded)
+            {
+                $.proxy(settings.onpreviewed, this)();
+            }
+            
+            return this;
+        },
+        
+        /**
+         * 编辑器全屏显示
+         * Fullscreen show
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        fullscreen : function() {
+            
+            var _this            = this;
+            var state            = this.state;
+            var editor           = this.editor;
+            var preview          = this.preview;
+            var toolbar          = this.toolbar;
+            var settings         = this.settings;
+            var fullscreenClass  = this.classPrefix + "fullscreen";
+            
+            if (toolbar) {
+                toolbar.find(".fa[name=fullscreen]").parent().toggleClass("active"); 
+            }
+            
+            var escHandle = function(event) {
+                if (!event.shiftKey && event.keyCode === 27) 
+                {
+                    if (state.fullscreen)
+                    {
+                        _this.fullscreenExit();
+                    }
+                }
+            };
+
+            if (!editor.hasClass(fullscreenClass)) 
+            {
+                state.fullscreen = true;
+
+                $("html,body").css("overflow", "hidden");
+                
+                editor.css({
+                    width    : $(window).width(),
+                    height   : $(window).height()
+                }).addClass(fullscreenClass);
+
+                this.resize();
+    
+                $.proxy(settings.onfullscreen, this)();
+
+                $(window).bind("keyup", escHandle);
+            }
+            else
+            {           
+                $(window).unbind("keyup", escHandle); 
+                this.fullscreenExit();
+            }
+
+            return this;
+        },
+        
+        /**
+         * 编辑器退出全屏显示
+         * Exit fullscreen state
+         * 
+         * @returns {editormd}         返回editormd的实例对象
+         */
+        
+        fullscreenExit : function() {
+            
+            var editor            = this.editor;
+            var settings          = this.settings;
+            var toolbar           = this.toolbar;
+            var fullscreenClass   = this.classPrefix + "fullscreen";  
+            
+            this.state.fullscreen = false;
+            
+            if (toolbar) {
+                toolbar.find(".fa[name=fullscreen]").parent().removeClass("active"); 
+            }
+
+            $("html,body").css("overflow", "");
+
+            editor.css({
+                width    : editor.data("oldWidth"),
+                height   : editor.data("oldHeight")
+            }).removeClass(fullscreenClass);
+
+            this.resize();
+            
+            $.proxy(settings.onfullscreenExit, this)();
+
+            return this;
+        },
+        
+        /**
+         * 加载并执行插件
+         * Load and execute the plugin
+         * 
+         * @param   {String}     name    plugin name / function name
+         * @param   {String}     path    plugin load path
+         * @returns {editormd}           返回editormd的实例对象
+         */
+        
+        executePlugin : function(name, path) {
+            
+            var _this    = this;
+            var cm       = this.cm;
+            var settings = this.settings;
+            
+            path = settings.pluginPath + path;
+            
+            if (typeof define === "function") 
+            {            
+                if (typeof this[name] === "undefined")
+                {
+                    alert("Error: " + name + " plugin is not found, you are not load this plugin.");
+                    
+                    return this;
+                }
+                
+                this[name](cm);
+                
+                return this;
+            }
+            
+            if ($.inArray(path, editormd.loadFiles.plugin) < 0)
+            {
+                editormd.loadPlugin(path, function() {
+                    editormd.loadPlugins[name] = _this[name];
+                    _this[name](cm);
+                });
+            }
+            else
+            {
+                $.proxy(editormd.loadPlugins[name], this)(cm);
+            }
+            
+            return this;
+        },
+                
+        /**
+         * 搜索替换
+         * Search & replace
+         * 
+         * @param   {String}     command    CodeMirror serach commands, "find, fintNext, fintPrev, clearSearch, replace, replaceAll"
+         * @returns {editormd}              return this
+         */
+        
+        search : function(command) {
+            var settings = this.settings;
+            
+            if (!settings.searchReplace)
+            {
+                alert("Error: settings.searchReplace == false");
+                return this;
+            }
+            
+            if (!settings.readOnly)
+            {
+                this.cm.execCommand(command || "find");
+            }
+            
+            return this;
+        },
+        
+        searchReplace : function() {            
+            this.search("replace");
+            
+            return this;
+        },
+        
+        searchReplaceAll : function() {          
+            this.search("replaceAll");
+            
+            return this;
+        }
+    };
+    
+    editormd.fn.init.prototype = editormd.fn; 
+   
+    /**
+     * 锁屏
+     * lock screen when dialog opening
+     * 
+     * @returns {void}
+     */
+
+    editormd.dialogLockScreen = function() {
+        var settings = this.settings || {dialogLockScreen : true};
+        
+        if (settings.dialogLockScreen) 
+        {            
+            $("html,body").css("overflow", "hidden");
+            this.resize();
+        }
+    };
+   
+    /**
+     * 显示透明背景层
+     * Display mask layer when dialog opening
+     * 
+     * @param   {Object}     dialog    dialog jQuery object
+     * @returns {void}
+     */
+    
+    editormd.dialogShowMask = function(dialog) {
+        var editor   = this.editor;
+        var settings = this.settings || {dialogShowMask : true};
+        
+        dialog.css({
+            top  : ($(window).height() - dialog.height()) / 2 + "px",
+            left : ($(window).width()  - dialog.width())  / 2 + "px"
+        });
+
+        if (settings.dialogShowMask) {
+            editor.children("." + this.classPrefix + "mask").css("z-index", parseInt(dialog.css("z-index")) - 1).show();
+        }
+    };
+
+    editormd.toolbarHandlers = {
+        undo : function() {
+            this.cm.undo();
+        },
+        
+        redo : function() {
+            this.cm.redo();
+        },
+        
+        bold : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("**" + selection + "**");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+        },
+        
+        del : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("~~" + selection + "~~");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+        },
+
+        italic : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("*" + selection + "*");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+
+        quote : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("> " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+            else
+            {
+                cm.replaceSelection("> " + selection);
+            }
+
+            //cm.replaceSelection("> " + selection);
+            //cm.setCursor(cursor.line, (selection === "") ? cursor.ch + 2 : cursor.ch + selection.length + 2);
+        },
+        
+        ucfirst : function() {
+            var cm         = this.cm;
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+
+            cm.replaceSelection(editormd.firstUpperCase(selection));
+            cm.setSelections(selections);
+        },
+        
+        ucwords : function() {
+            var cm         = this.cm;
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+
+            cm.replaceSelection(editormd.wordsFirstUpperCase(selection));
+            cm.setSelections(selections);
+        },
+        
+        uppercase : function() {
+            var cm         = this.cm;
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+
+            cm.replaceSelection(selection.toUpperCase());
+            cm.setSelections(selections);
+        },
+        
+        lowercase : function() {
+            var cm         = this.cm;
+            var cursor     = cm.getCursor();
+            var selection  = cm.getSelection();
+            var selections = cm.listSelections();
+            
+            cm.replaceSelection(selection.toLowerCase());
+            cm.setSelections(selections);
+        },
+
+        h1 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("# " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+            else
+            {
+                cm.replaceSelection("# " + selection);
+            }
+        },
+
+        h2 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("## " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 3);
+            }
+            else
+            {
+                cm.replaceSelection("## " + selection);
+            }
+        },
+
+        h3 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 4);
+            }
+            else
+            {
+                cm.replaceSelection("### " + selection);
+            }
+        },
+
+        h4 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("#### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 5);
+            }
+            else
+            {
+                cm.replaceSelection("#### " + selection);
+            }
+        },
+
+        h5 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("##### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 6);
+            }
+            else
+            {
+                cm.replaceSelection("##### " + selection);
+            }
+        },
+
+        h6 : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (cursor.ch !== 0)
+            {
+                cm.setCursor(cursor.line, 0);
+                cm.replaceSelection("###### " + selection);
+                cm.setCursor(cursor.line, cursor.ch + 7);
+            }
+            else
+            {
+                cm.replaceSelection("###### " + selection);
+            }
+        },
+
+        "list-ul" : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if (selection === "") 
+            {
+                cm.replaceSelection("- " + selection);
+            } 
+            else 
+            {
+                var selectionText = selection.split("\n");
+
+                for (var i = 0, len = selectionText.length; i < len; i++) 
+                {
+                    selectionText[i] = (selectionText[i] === "") ? "" : "- " + selectionText[i];
+                }
+
+                cm.replaceSelection(selectionText.join("\n"));
+            }
+        },
+
+        "list-ol" : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            if(selection === "") 
+            {
+                cm.replaceSelection("1. " + selection);
+            }
+            else
+            {
+                var selectionText = selection.split("\n");
+
+                for (var i = 0, len = selectionText.length; i < len; i++) 
+                {
+                    selectionText[i] = (selectionText[i] === "") ? "" : (i+1) + ". " + selectionText[i];
+                }
+
+                cm.replaceSelection(selectionText.join("\n"));
+            }
+        },
+
+        hr : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection(((cursor.ch !== 0) ? "\n\n" : "\n") + "------------\n\n");
+        },
+
+        tex : function() {
+            if (!this.settings.tex)
+            {
+                alert("settings.tex === false");
+                return this;
+            }
+            
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("$$" + selection + "$$");
+
+            if(selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 2);
+            }
+        },
+
+        link : function() {
+            this.executePlugin("linkDialog", "link-dialog/link-dialog");
+        },
+
+        "reference-link" : function() {
+            this.executePlugin("referenceLinkDialog", "reference-link-dialog/reference-link-dialog");
+        },
+
+        pagebreak : function() {
+            if (!this.settings.pageBreak)
+            {
+                alert("settings.pageBreak === false");
+                return this;
+            }
+            
+            var cm        = this.cm;
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("\r\n[========]\r\n");
+        },
+
+        image : function() {
+            this.executePlugin("imageDialog", "image-dialog/image-dialog");
+        },
+        
+        code : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+
+            cm.replaceSelection("`" + selection + "`");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+
+        "code-block" : function() {
+            this.executePlugin("codeBlockDialog", "code-block-dialog/code-block-dialog");            
+        },
+
+        "preformatted-text" : function() {
+            this.executePlugin("preformattedTextDialog", "preformatted-text-dialog/preformatted-text-dialog");
+        },
+        
+        table : function() {
+            this.executePlugin("tableDialog", "table-dialog/table-dialog");         
+        },
+        
+        datetime : function() {
+            var cm        = this.cm;
+            var selection = cm.getSelection();
+            var date      = new Date();
+            var langName  = this.settings.lang.name;
+            var datefmt   = editormd.dateFormat() + " " + editormd.dateFormat((langName === "zh-cn" || langName === "zh-tw") ? "cn-week-day" : "week-day");
+
+            cm.replaceSelection(datefmt);
+        },
+        
+        emoji : function() {
+            this.executePlugin("emojiDialog", "emoji-dialog/emoji-dialog");
+        },
+                
+        "html-entities" : function() {
+            this.executePlugin("htmlEntitiesDialog", "html-entities-dialog/html-entities-dialog");
+        },
+                
+        "goto-line" : function() {
+            this.executePlugin("gotoLineDialog", "goto-line-dialog/goto-line-dialog");
+        },
+
+        watch : function() {    
+            this[this.settings.watch ? "unwatch" : "watch"]();
+        },
+
+        preview : function() {
+            this.previewing();
+        },
+
+        fullscreen : function() {
+            this.fullscreen();
+        },
+
+        clear : function() {
+            this.clear();
+        },
+        
+        search : function() {
+            this.search();
+        },
+
+        help : function() {
+            this.executePlugin("helpDialog", "help-dialog/help-dialog");
+        },
+
+        info : function() {
+            this.showInfoDialog();
+        }
+    };
+    
+    editormd.keyMaps = {
+        "Ctrl-1"       : "h1",
+        "Ctrl-2"       : "h2",
+        "Ctrl-3"       : "h3",
+        "Ctrl-4"       : "h4",
+        "Ctrl-5"       : "h5",
+        "Ctrl-6"       : "h6",
+        "Ctrl-B"       : "bold",  // if this is string ==  editormd.toolbarHandlers.xxxx
+        "Ctrl-D"       : "datetime",
+        
+        "Ctrl-E"       : function() { // emoji
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            if (!this.settings.emoji)
+            {
+                alert("Error: settings.emoji == false");
+                return ;
+            }
+
+            cm.replaceSelection(":" + selection + ":");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+        "Ctrl-Alt-G"   : "goto-line",
+        "Ctrl-H"       : "hr",
+        "Ctrl-I"       : "italic",
+        "Ctrl-K"       : "code",
+        
+        "Ctrl-L"        : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            var title = (selection === "") ? "" : " \""+selection+"\"";
+
+            cm.replaceSelection("[" + selection + "]("+title+")");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+        "Ctrl-U"         : "list-ul",
+        
+        "Shift-Ctrl-A"   : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            if (!this.settings.atLink)
+            {
+                alert("Error: settings.atLink == false");
+                return ;
+            }
+
+            cm.replaceSelection("@" + selection);
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 1);
+            }
+        },
+        
+        "Shift-Ctrl-C"     : "code",
+        "Shift-Ctrl-Q"     : "quote",
+        "Shift-Ctrl-S"     : "del",
+        "Shift-Ctrl-K"     : "tex",  // KaTeX
+        
+        "Shift-Alt-C"      : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            cm.replaceSelection(["```", selection, "```"].join("\n"));
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 3);
+            } 
+        },
+        
+        "Shift-Ctrl-Alt-C" : "code-block",
+        "Shift-Ctrl-H"     : "html-entities",
+        "Shift-Alt-H"      : "help",
+        "Shift-Ctrl-E"     : "emoji",
+        "Shift-Ctrl-U"     : "uppercase",
+        "Shift-Alt-U"      : "ucwords",
+        "Shift-Ctrl-Alt-U" : "ucfirst",
+        "Shift-Alt-L"      : "lowercase",
+        
+        "Shift-Ctrl-I"     : function() {
+            var cm        = this.cm;
+            var cursor    = cm.getCursor();
+            var selection = cm.getSelection();
+            
+            var title = (selection === "") ? "" : " \""+selection+"\"";
+
+            cm.replaceSelection("![" + selection + "]("+title+")");
+
+            if (selection === "") {
+                cm.setCursor(cursor.line, cursor.ch + 4);
+            }
+        },
+        
+        "Shift-Ctrl-Alt-I" : "image",
+        "Shift-Ctrl-L"     : "link",
+        "Shift-Ctrl-O"     : "list-ol",
+        "Shift-Ctrl-P"     : "preformatted-text",
+        "Shift-Ctrl-T"     : "table",
+        "Shift-Alt-P"      : "pagebreak",
+        "F9"               : "watch",
+        "F10"              : "preview",
+        "F11"              : "fullscreen",
+    };
+    
+    /**
+     * 清除字符串两边的空格
+     * Clear the space of strings both sides.
+     * 
+     * @param   {String}    str            string
+     * @returns {String}                   trimed string    
+     */
+    
+    var trim = function(str) {
+        return (!String.prototype.trim) ? str.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, "") : str.trim();
+    };
+    
+    editormd.trim = trim;
+    
+    /**
+     * 所有单词首字母大写
+     * Words first to uppercase
+     * 
+     * @param   {String}    str            string
+     * @returns {String}                   string
+     */
+    
+    var ucwords = function (str) {
+        return str.toLowerCase().replace(/\b(\w)|\s(\w)/g, function($1) {  
+            return $1.toUpperCase();
+        });
+    };
+    
+    editormd.ucwords = editormd.wordsFirstUpperCase = ucwords;
+    
+    /**
+     * 字符串首字母大写
+     * Only string first char to uppercase
+     * 
+     * @param   {String}    str            string
+     * @returns {String}                   string
+     */
+    
+    var firstUpperCase = function(str) {        
+        return str.toLowerCase().replace(/\b(\w)/, function($1){
+            return $1.toUpperCase();
+        });
+    };
+    
+    var ucfirst = firstUpperCase;
+    
+    editormd.firstUpperCase = editormd.ucfirst = firstUpperCase;
+    
+    editormd.urls = {
+        atLinkBase : "https://github.com/"
+    };
+    
+    editormd.regexs = {
+        atLink        : /@(\w+)/g,
+        email         : /(\w+)@(\w+)\.(\w+)\.?(\w+)?/g,
+        emailLink     : /(mailto:)?([\w\.\_]+)@(\w+)\.(\w+)\.?(\w+)?/g,
+        emoji         : /:([\w\+-]+):/g,
+        emojiDatetime : /(\d{2}:\d{2}:\d{2})/g,
+        twemoji       : /:(tw-([\w]+)-?(\w+)?):/g,
+        fontAwesome   : /:(fa-([\w]+)(-(\w+)){0,}):/g,
+        editormdLogo  : /:(editormd-logo-?(\w+)?):/g,
+        pageBreak     : /^\[[=]{8,}\]$/
+    };
+
+    // Emoji graphics files url path
+    editormd.emoji     = {
+        path  : "http://www.emoji-cheat-sheet.com/graphics/emojis/",
+        ext   : ".png"
+    };
+
+    // Twitter Emoji (Twemoji)  graphics files url path    
+    editormd.twemoji = {
+        path : "http://twemoji.maxcdn.com/36x36/",
+        ext  : ".png"
+    };
+
+    /**
+     * 自定义marked的解析器
+     * Custom Marked renderer rules
+     * 
+     * @param   {Array}    markdownToC     传入用于接收TOC的数组
+     * @returns {Renderer} markedRenderer  返回marked的Renderer自定义对象
+     */
+
+    editormd.markedRenderer = function(markdownToC, options) {
+        var defaults = {
+            toc                  : true,           // Table of contents
+            tocm                 : false,
+            tocStartLevel        : 1,              // Said from H1 to create ToC  
+            pageBreak            : true,
+            atLink               : true,           // for @link
+            emailLink            : true,           // for mail address auto link
+            taskList             : false,          // Enable Github Flavored Markdown task lists
+            emoji                : false,          // :emoji: , Support Twemoji, fontAwesome, Editor.md logo emojis.
+            tex                  : false,          // TeX(LaTeX), based on KaTeX
+            flowChart            : false,          // flowChart.js only support IE9+
+            sequenceDiagram      : false,          // sequenceDiagram.js only support IE9+
+        };
+        
+        var settings        = $.extend(defaults, options || {});    
+        var marked          = editormd.$marked;
+        var markedRenderer  = new marked.Renderer();
+        markdownToC         = markdownToC || [];        
+            
+        var regexs          = editormd.regexs;
+        var atLinkReg       = regexs.atLink;
+        var emojiReg        = regexs.emoji;
+        var emailReg        = regexs.email;
+        var emailLinkReg    = regexs.emailLink;
+        var twemojiReg      = regexs.twemoji;
+        var faIconReg       = regexs.fontAwesome;
+        var editormdLogoReg = regexs.editormdLogo;
+        var pageBreakReg    = regexs.pageBreak;
+
+        markedRenderer.emoji = function(text) {
+            
+            text = text.replace(editormd.regexs.emojiDatetime, function($1) {           
+                return $1.replace(/:/g, "&#58;");
+            });
+            
+            var matchs = text.match(emojiReg);
+
+            if (!matchs || !settings.emoji) {
+                return text;
+            }
+
+            for (var i = 0, len = matchs.length; i < len; i++)
+            {            
+                if (matchs[i] === ":+1:") {
+                    matchs[i] = ":\\+1:";
+                }
+
+                text = text.replace(new RegExp(matchs[i]), function($1, $2){
+                    var faMatchs = $1.match(faIconReg);
+                    var name     = $1.replace(/:/g, "");
+
+                    if (faMatchs)
+                    {                        
+                        for (var fa = 0, len1 = faMatchs.length; fa < len1; fa++)
+                        {
+                            var faName = faMatchs[fa].replace(/:/g, "");
+                            
+                            return "<i class=\"fa " + faName + " fa-emoji\" title=\"" + faName.replace("fa-", "") + "\"></i>";
+                        }
+                    }
+                    else
+                    {
+                        var emdlogoMathcs = $1.match(editormdLogoReg);
+                        var twemojiMatchs = $1.match(twemojiReg);
+
+                        if (emdlogoMathcs)                                        
+                        {                            
+                            for (var x = 0, len2 = emdlogoMathcs.length; x < len2; x++)
+                            {
+                                var logoName = emdlogoMathcs[x].replace(/:/g, "");
+                                return "<i class=\"" + logoName + "\" title=\"Editor.md logo (" + logoName + ")\"></i>";
+                            }
+                        }
+                        else if (twemojiMatchs) 
+                        {
+                            for (var t = 0, len3 = twemojiMatchs.length; t < len3; t++)
+                            {
+                                var twe = twemojiMatchs[t].replace(/:/g, "").replace("tw-", "");
+                                return "<img src=\"" + editormd.twemoji.path + twe + editormd.twemoji.ext + "\" title=\"twemoji-" + twe + "\" alt=\"twemoji-" + twe + "\" class=\"emoji twemoji\" />";
+                            }
+                        }
+                        else
+                        {
+                            var src = (name === "+1") ? "plus1" : name;
+                            src     = (src === "black_large_square") ? "black_square" : src;
+                            src     = (src === "moon") ? "waxing_gibbous_moon" : src;
+
+                            return "<img src=\"" + editormd.emoji.path + src + editormd.emoji.ext + "\" class=\"emoji\" title=\"&#58;" + name + "&#58;\" alt=\"&#58;" + name + "&#58;\" />";
+                        }
+                    }
+                });
+            }
+
+            return text;
+        };
+
+        markedRenderer.atLink = function(text) {
+
+            if (atLinkReg.test(text))
+            { 
+                if (settings.atLink) 
+                {
+                    text = text.replace(emailReg, function($1, $2, $3, $4) {
+                        return $1.replace(/@/g, "_#_&#64;_#_");
+                    });
+
+                    text = text.replace(atLinkReg, function($1, $2) {
+                        return "<a href=\"" + editormd.urls.atLinkBase + "" + $2 + "\" title=\"&#64;" + $2 + "\" class=\"at-link\">" + $1 + "</a>";
+                    }).replace(/_#_&#64;_#_/g, "@");
+                }
+                
+                if (settings.emailLink)
+                {
+                    text = text.replace(emailLinkReg, function($1, $2, $3, $4, $5) {
+                        return (!$2 && $.inArray($5, "jpg|jpeg|png|gif|webp|ico|icon|pdf".split("|")) < 0) ? "<a href=\"mailto:" + $1 + "\">"+$1+"</a>" : $1;
+                    });
+                }
+
+                return text;
+            }
+
+            return text;
+        };
+                
+        markedRenderer.link = function (href, title, text) {
+
+            if (this.options.sanitize) {
+                try {
+                    var prot = decodeURIComponent(unescape(href)).replace(/[^\w:]/g,"").toLowerCase();
+                } catch(e) {
+                    return "";
+                }
+
+                if (prot.indexOf("javascript:") === 0) {
+                    return "";
+                }
+            }
+
+            var out = "<a href=\"" + href + "\"";
+            
+            if (atLinkReg.test(title) || atLinkReg.test(text))
+            {
+                if (title)
+                {
+                    out += " title=\"" + title.replace(/@/g, "&#64;");
+                }
+                
+                return out + "\">" + text.replace(/@/g, "&#64;") + "</a>";
+            }
+
+            if (title) {
+                out += " title=\"" + title + "\"";
+            }
+
+            out += ">" + text + "</a>";
+
+            return out;
+        };
+        
+        markedRenderer.heading = function(text, level, raw) {
+                    
+            var linkText       = text;
+            var hasLinkReg     = /\s*\<a\s*href\=\"(.*)\"\s*([^\>]*)\>(.*)\<\/a\>\s*/;
+            var getLinkTextReg = /\s*\<a\s*([^\>]+)\>([^\>]*)\<\/a\>\s*/g;
+
+            if (hasLinkReg.test(text)) 
+            {
+                var tempText = [];
+                text         = text.split(/\<a\s*([^\>]+)\>([^\>]*)\<\/a\>/);
+
+                for (var i = 0, len = text.length; i < len; i++)
+                {
+                    tempText.push(text[i].replace(/\s*href\=\"(.*)\"\s*/g, ""));
+                }
+
+                text = tempText.join(" ");
+            }
+            
+            text = trim(text);
+            
+            var escapedText    = text.toLowerCase().replace(/[^\w]+/g, "-");
+            var toc = {
+                text  : text,
+                level : level,
+                slug  : escapedText
+            };
+            
+            var isChinese = /^[\u4e00-\u9fa5]+$/.test(text);
+            var id        = (isChinese) ? escape(text).replace(/\%/g, "") : text.toLowerCase().replace(/[^\w]+/g, "-");
+
+            markdownToC.push(toc);
+            
+            var headingHTML = "<h" + level + " id=\"h"+ level + "-" + this.options.headerPrefix + id +"\">";
+            
+            headingHTML    += "<a name=\"" + text + "\" class=\"reference-link\"></a>";
+            headingHTML    += "<span class=\"header-link octicon octicon-link\"></span>";
+            headingHTML    += (hasLinkReg) ? this.atLink(this.emoji(linkText)) : this.atLink(this.emoji(text));
+            headingHTML    += "</h" + level + ">";
+
+            return headingHTML;
+        };
+        
+        markedRenderer.pageBreak = function(text) {
+            if (pageBreakReg.test(text) && settings.pageBreak)
+            {
+                text = "<hr style=\"page-break-after:always;\" class=\"page-break editormd-page-break\" />";
+            }
+            
+            return text;
+        };
+
+        markedRenderer.paragraph = function(text) {
+            var isTeXInline     = /\$\$(.*)\$\$/g.test(text);
+            var isTeXLine       = /^\$\$(.*)\$\$$/.test(text);
+            var isTeXAddClass   = (isTeXLine)     ? " class=\"" + editormd.classNames.tex + "\"" : "";
+            var isToC           = (settings.tocm) ? /^(\[TOC\]|\[TOCM\])$/.test(text) : /^\[TOC\]$/.test(text);
+            var isToCMenu       = /^\[TOCM\]$/.test(text);
+            
+            if (!isTeXLine && isTeXInline) 
+            {
+                text = text.replace(/(\$\$([^\$]*)\$\$)+/g, function($1, $2) {
+                    return "<span class=\"" + editormd.classNames.tex + "\">" + $2.replace(/\$/g, "") + "</span>";
+                });
+            } 
+            else 
+            {
+                text = (isTeXLine) ? text.replace(/\$/g, "") : text;
+            }
+            
+            var tocHTML = "<div class=\"markdown-toc editormd-markdown-toc\">" + text + "</div>";
+            
+            return (isToC) ? ( (isToCMenu) ? "<div class=\"editormd-toc-menu\">" + tocHTML + "</div><br/>" : tocHTML )
+                           : ( (pageBreakReg.test(text)) ? this.pageBreak(text) : "<p" + isTeXAddClass + ">" + this.atLink(this.emoji(text)) + "</p>\n" );
+        };
+
+        markedRenderer.code = function (code, lang, escaped) { 
+
+            if (lang === "seq" || lang === "sequence")
+            {
+                return "<div class=\"sequence-diagram\">" + code + "</div>";
+            } 
+            else if ( lang === "flow")
+            {
+                return "<div class=\"flowchart\">" + code + "</div>";
+            } 
+            else if ( lang === "math" || lang === "latex" || lang === "katex")
+            {
+                return "<p class=\"" + editormd.classNames.tex + "\">" + code + "</p>";
+            } 
+            else 
+            {
+
+                return marked.Renderer.prototype.code.apply(this, arguments);
+            }
+        };
+
+        markedRenderer.tablecell = function(content, flags) {
+            var type = (flags.header) ? "th" : "td";
+            var tag  = (flags.align)  ? "<" + type +" style=\"text-align:" + flags.align + "\">" : "<" + type + ">";
+            
+            return tag + this.atLink(this.emoji(content)) + "</" + type + ">\n";
+        };
+
+        markedRenderer.listitem = function(text) {
+            if (settings.taskList && /^\s*\[[x\s]\]\s*/.test(text)) 
+            {
+                text = text.replace(/^\s*\[\s\]\s*/, "<input type=\"checkbox\" class=\"task-list-item-checkbox\" /> ")
+                           .replace(/^\s*\[x\]\s*/,  "<input type=\"checkbox\" class=\"task-list-item-checkbox\" checked disabled /> ");
+
+                return "<li style=\"list-style: none;\">" + this.atLink(this.emoji(text)) + "</li>";
+            }
+            else 
+            {
+                return "<li>" + this.atLink(this.emoji(text)) + "</li>";
+            }
+        };
+        
+        return markedRenderer;
+    };
+    
+    /**
+     *
+     * 生成TOC(Table of Contents)
+     * Creating ToC (Table of Contents)
+     * 
+     * @param   {Array}    toc             从marked获取的TOC数组列表
+     * @param   {Element}  container       插入TOC的容器元素
+     * @param   {Integer}  startLevel      Hx 起始层级
+     * @returns {Object}   tocContainer    返回ToC列表容器层的jQuery对象元素
+     */
+    
+    editormd.markdownToCRenderer = function(toc, container, tocDropdown, startLevel) {
+        
+        var html        = "";    
+        var lastLevel   = 0;
+        var classPrefix = this.classPrefix;
+        
+        startLevel      = startLevel  || 1;
+        
+        for (var i = 0, len = toc.length; i < len; i++) 
+        {
+            var text  = toc[i].text;
+            var level = toc[i].level;
+            
+            if (level < startLevel) {
+                continue;
+            }
+            
+            if (level > lastLevel) 
+            {
+                html += "";
+            }
+            else if (level < lastLevel) 
+            {
+                html += (new Array(lastLevel - level + 2)).join("</ul></li>");
+            } 
+            else 
+            {
+                html += "</ul></li>";
+            }
+
+            html += "<li><a class=\"toc-level-" + level + "\" href=\"#" + text + "\" level=\"" + level + "\">" + text + "</a><ul>";
+            lastLevel = level;
+        }
+        
+        var tocContainer = container.find(".markdown-toc");
+        
+        if ((tocContainer.length < 1 && container.attr("previewContainer") === "false"))
+        {
+            var tocHTML = "<div class=\"markdown-toc " + classPrefix + "markdown-toc\"></div>";
+            
+            tocHTML = (tocDropdown) ? "<div class=\"" + classPrefix + "toc-menu\">" + tocHTML + "</div>" : tocHTML;
+            
+            container.html(tocHTML);
+            
+            tocContainer = container.find(".markdown-toc");
+        }
+        
+        if (tocDropdown)
+        {
+            tocContainer.wrap("<div class=\"" + classPrefix + "toc-menu\"></div><br/>");
+        }
+        
+        tocContainer.html("<ul class=\"markdown-toc-list\"></ul>").children(".markdown-toc-list").html(html.replace(/\r?\n?\<ul\>\<\/ul\>/g, ""));
+        
+        return tocContainer;
+    };
+    
+    /**
+     *
+     * 生成TOC下拉菜单
+     * Creating ToC dropdown menu
+     * 
+     * @param   {Object}   container       插入TOC的容器jQuery对象元素
+     * @param   {String}   tocTitle        ToC title
+     * @returns {Object}                   return toc-menu object
+     */
+    
+    editormd.tocDropdownMenu = function(container, tocTitle) {
+        
+        tocTitle      = tocTitle || "Table of Contents";
+        
+        var zindex    = 400;
+        var tocMenus  = container.find("." + this.classPrefix + "toc-menu");
+
+        tocMenus.each(function() {
+            var $this  = $(this);
+            var toc    = $this.children(".markdown-toc");
+            var icon   = "<i class=\"fa fa-angle-down\"></i>";
+            var btn    = "<a href=\"javascript:;\" class=\"toc-menu-btn\">" + icon + tocTitle + "</a>";
+            var menu   = toc.children("ul");            
+            var list   = menu.find("li");
+            
+            toc.append(btn);
+            
+            list.first().before("<li><h1>" + tocTitle + " " + icon + "</h1></li>");
+            
+            $this.mouseover(function(){
+                menu.show();
+
+                list.each(function(){
+                    var li = $(this);
+                    var ul = li.children("ul");
+
+                    if (ul.html() === "")
+                    {
+                        ul.remove();
+                    }
+
+                    if (ul.length > 0 && ul.html() !== "")
+                    {
+                        var firstA = li.children("a").first();
+
+                        if (firstA.children(".fa").length < 1)
+                        {
+                            firstA.append( $(icon).css({ float:"right", paddingTop:"4px" }) );
+                        }
+                    }
+
+                    li.mouseover(function(){
+                        ul.css("z-index", zindex).show();
+                        zindex += 1;
+                    }).mouseleave(function(){
+                        ul.hide();
+                    });
+                });
+            }).mouseleave(function(){
+                menu.hide();
+            }); 
+        });       
+        
+        return tocMenus;
+    };
+    
+    /**
+     * 简单地过滤指定的HTML标签
+     * Filter custom html tags
+     * 
+     * @param   {String}   html          要过滤HTML
+     * @param   {String}   filters       要过滤的标签
+     * @returns {String}   html          返回过滤的HTML
+     */
+    
+    editormd.filterHTMLTags = function(html, filters) {
+        
+        if (typeof html !== "string") {
+            html = new String(html);
+        }
+            
+        if (typeof filters !== "string") {
+            return html;
+        }
+
+        var expression = filters.split("|");
+        var filterTags = expression[0].split(",");
+        var attrs      = expression[1];
+
+        for (var i = 0, len = filterTags.length; i < len; i++)
+        {
+            var tag = filterTags[i];
+
+            html = html.replace(new RegExp("\<\s*" + tag + "\s*([^\>]*)\>([^\>]*)\<\s*\/" + tag + "\s*\>", "igm"), "");
+        }
+        
+        //return html;
+
+        if (typeof attrs !== "undefined")
+        {
+            var htmlTagRegex = /\<(\w+)\s*([^\>]*)\>([^\>]*)\<\/(\w+)\>/ig;
+
+            if (attrs === "*")
+            {
+                html = html.replace(htmlTagRegex, function($1, $2, $3, $4, $5) {
+                    return "<" + $2 + ">" + $4 + "</" + $5 + ">";
+                });         
+            }
+            else if (attrs === "on*")
+            {
+                html = html.replace(htmlTagRegex, function($1, $2, $3, $4, $5) {
+                    var el = $("<" + $2 + ">" + $4 + "</" + $5 + ">");
+                    var _attrs = $($1)[0].attributes;
+                    var $attrs = {};
+                    
+                    $.each(_attrs, function(i, e) {
+                        if (e.nodeName !== '"') $attrs[e.nodeName] = e.nodeValue;
+                    });
+                    
+                    $.each($attrs, function(i) {                        
+                        if (i.indexOf("on") === 0) {
+                            delete $attrs[i];
+                        }
+                    });
+                    
+                    el.attr($attrs);
+                    
+                    var text = (typeof el[1] !== "undefined") ? $(el[1]).text() : "";
+
+                    return el[0].outerHTML + text;
+                });
+            }
+            else
+            {
+                html = html.replace(htmlTagRegex, function($1, $2, $3, $4) {
+                    var filterAttrs = attrs.split(",");
+                    var el = $($1);
+                    el.html($4);
+
+                    $.each(filterAttrs, function(i) {
+                        el.attr(filterAttrs[i], null);
+                    });
+
+                    return el[0].outerHTML;
+                });
+            }
+        }
+        
+        return html;
+    };
+    
+    /**
+     * 将Markdown文档解析为HTML用于前台显示
+     * Parse Markdown to HTML for Font-end preview.
+     * 
+     * @param   {String}   id            用于显示HTML的对象ID
+     * @param   {Object}   [options={}]  配置选项，可选
+     * @returns {Object}   div           返回jQuery对象元素
+     */
+    
+    editormd.markdownToHTML = function(id, options) {
+        var defaults = {
+            gfm                  : true,
+            toc                  : true,
+            tocm                 : false,
+            tocStartLevel        : 1,
+            tocTitle             : "目录",
+            tocDropdown          : false,
+            tocContainer         : "",
+            markdown             : "",
+            markdownSourceCode   : false,
+            htmlDecode           : false,
+            autoLoadKaTeX        : true,
+            pageBreak            : true,
+            atLink               : true,    // for @link
+            emailLink            : true,    // for mail address auto link
+            tex                  : false,
+            taskList             : false,   // Github Flavored Markdown task lists
+            emoji                : false,
+            flowChart            : false,
+            sequenceDiagram      : false,
+            previewCodeHighlight : true
+        };
+        
+        editormd.$marked  = marked;
+
+        var div           = $("#" + id);
+        var settings      = div.settings = $.extend(true, defaults, options || {});
+        var saveTo        = div.find("textarea");
+        
+        if (saveTo.length < 1)
+        {
+            div.append("<textarea></textarea>");
+            saveTo        = div.find("textarea");
+        }        
+        
+        var markdownDoc   = (settings.markdown === "") ? saveTo.val() : settings.markdown; 
+        var markdownToC   = [];
+
+        var rendererOptions = {  
+            toc                  : settings.toc,
+            tocm                 : settings.tocm,
+            tocStartLevel        : settings.tocStartLevel,
+            taskList             : settings.taskList,
+            emoji                : settings.emoji,
+            tex                  : settings.tex,
+            pageBreak            : settings.pageBreak,
+            atLink               : settings.atLink,           // for @link
+            emailLink            : settings.emailLink,        // for mail address auto link
+            flowChart            : settings.flowChart,
+            sequenceDiagram      : settings.sequenceDiagram,
+            previewCodeHighlight : settings.previewCodeHighlight,
+        };
+
+        var markedOptions = {
+            renderer    : editormd.markedRenderer(markdownToC, rendererOptions),
+            gfm         : settings.gfm,
+            tables      : true,
+            breaks      : true,
+            pedantic    : false,
+            sanitize    : (settings.htmlDecode) ? false : true, // 是否忽略HTML标签，即是否开启HTML标签解析，为了安全性，默认不开启
+            smartLists  : true,
+            smartypants : true
+        };
+        
+		markdownDoc = new String(markdownDoc);
+        
+        var markdownParsed = marked(markdownDoc, markedOptions);
+        
+        markdownParsed = editormd.filterHTMLTags(markdownParsed, settings.htmlDecode);
+        
+        if (settings.markdownSourceCode) {
+            saveTo.text(markdownDoc);
+        } else {
+            saveTo.remove();
+        }
+        
+        div.addClass("markdown-body " + this.classPrefix + "html-preview").append(markdownParsed);
+        
+        var tocContainer = (settings.tocContainer !== "") ? $(settings.tocContainer) : div;
+        
+        if (settings.tocContainer !== "")
+        {
+            tocContainer.attr("previewContainer", false);
+        }
+         
+        if (settings.toc) 
+        {
+            div.tocContainer = this.markdownToCRenderer(markdownToC, tocContainer, settings.tocDropdown, settings.tocStartLevel);
+            
+            if (settings.tocDropdown || div.find("." + this.classPrefix + "toc-menu").length > 0)
+            {
+                this.tocDropdownMenu(div, settings.tocTitle);
+            }
+            
+            if (settings.tocContainer !== "")
+            {
+                div.find(".editormd-toc-menu, .editormd-markdown-toc").remove();
+            }
+        }
+            
+        if (settings.previewCodeHighlight) 
+        {
+            div.find("pre").addClass("prettyprint linenums");
+            prettyPrint();
+        }
+        
+        if (!editormd.isIE8) 
+        {
+            if (settings.flowChart) {
+                div.find(".flowchart").flowChart(); 
+            }
+
+            if (settings.sequenceDiagram) {
+                div.find(".sequence-diagram").sequenceDiagram({theme: "simple"});
+            }
+        }
+
+        if (settings.tex)
+        {
+            var katexHandle = function() {
+                div.find("." + editormd.classNames.tex).each(function(){
+                    var tex  = $(this);                    
+                    katex.render(tex.html().replace(/&lt;/g, "<").replace(/&gt;/g, ">"), tex[0]);                    
+                    tex.find(".katex").css("font-size", "1.6em");
+                });
+            };
+            
+            if (settings.autoLoadKaTeX && !editormd.$katex && !editormd.kaTeXLoaded)
+            {
+                this.loadKaTeX(function() {
+                    editormd.$katex      = katex;
+                    editormd.kaTeXLoaded = true;
+                    katexHandle();
+                });
+            }
+            else
+            {
+                katexHandle();
+            }
+        }
+        
+        div.getMarkdown = function() {            
+            return saveTo.val();
+        };
+        
+        return div;
+    };
+    
+    // Editor.md themes, change toolbar themes etc.
+    // added @1.5.0
+    editormd.themes        = ["default", "dark"];
+    
+    // Preview area themes
+    // added @1.5.0
+    editormd.previewThemes = ["default", "dark"];
+    
+    // CodeMirror / editor area themes
+    // @1.5.0 rename -> editorThemes, old version -> themes
+    editormd.editorThemes = [
+        "default", "3024-day", "3024-night",
+        "ambiance", "ambiance-mobile",
+        "base16-dark", "base16-light", "blackboard",
+        "cobalt",
+        "eclipse", "elegant", "erlang-dark",
+        "lesser-dark",
+        "mbo", "mdn-like", "midnight", "monokai",
+        "neat", "neo", "night",
+        "paraiso-dark", "paraiso-light", "pastel-on-dark",
+        "rubyblue",
+        "solarized",
+        "the-matrix", "tomorrow-night-eighties", "twilight",
+        "vibrant-ink",
+        "xq-dark", "xq-light"
+    ];
+
+    editormd.loadPlugins = {};
+    
+    editormd.loadFiles = {
+        js     : [],
+        css    : [],
+        plugin : []
+    };
+    
+    /**
+     * 动态加载Editor.md插件，但不立即执行
+     * Load editor.md plugins
+     * 
+     * @param {String}   fileName              插件文件路径
+     * @param {Function} [callback=function()] 加载成功后执行的回调函数
+     * @param {String}   [into="head"]         嵌入页面的位置
+     */
+    
+    editormd.loadPlugin = function(fileName, callback, into) {
+        callback   = callback || function() {};
+        
+        this.loadScript(fileName, function() {
+            editormd.loadFiles.plugin.push(fileName);
+            callback();
+        }, into);
+    };
+    
+    /**
+     * 动态加载CSS文件的方法
+     * Load css file method
+     * 
+     * @param {String}   fileName              CSS文件名
+     * @param {Function} [callback=function()] 加载成功后执行的回调函数
+     * @param {String}   [into="head"]         嵌入页面的位置
+     */
+    
+    editormd.loadCSS   = function(fileName, callback, into) {
+        into       = into     || "head";        
+        callback   = callback || function() {};
+        
+        var css    = document.createElement("link");
+        css.type   = "text/css";
+        css.rel    = "stylesheet";
+        css.onload = css.onreadystatechange = function() {
+            editormd.loadFiles.css.push(fileName);
+            callback();
+        };
+
+        css.href   = fileName + ".css";
+
+        if(into === "head") {
+            document.getElementsByTagName("head")[0].appendChild(css);
+        } else {
+            document.body.appendChild(css);
+        }
+    };
+    
+    editormd.isIE    = (navigator.appName == "Microsoft Internet Explorer");
+    editormd.isIE8   = (editormd.isIE && navigator.appVersion.match(/8./i) == "8.");
+
+    /**
+     * 动态加载JS文件的方法
+     * Load javascript file method
+     * 
+     * @param {String}   fileName              JS文件名
+     * @param {Function} [callback=function()] 加载成功后执行的回调函数
+     * @param {String}   [into="head"]         嵌入页面的位置
+     */
+
+    editormd.loadScript = function(fileName, callback, into) {
+        
+        into          = into     || "head";
+        callback      = callback || function() {};
+        
+        var script    = null; 
+        script        = document.createElement("script");
+        script.id     = fileName.replace(/[\./]+/g, "-");
+        script.type   = "text/javascript";        
+        script.src    = fileName + ".js";
+        
+        if (editormd.isIE8) 
+        {            
+            script.onreadystatechange = function() {
+                if(script.readyState) 
+                {
+                    if (script.readyState === "loaded" || script.readyState === "complete") 
+                    {
+                        script.onreadystatechange = null; 
+                        editormd.loadFiles.js.push(fileName);
+                        callback();
+                    }
+                } 
+            };
+        }
+        else
+        {
+            script.onload = function() {
+                editormd.loadFiles.js.push(fileName);
+                callback();
+            };
+        }
+
+        if (into === "head") {
+            document.getElementsByTagName("head")[0].appendChild(script);
+        } else {
+            document.body.appendChild(script);
+        }
+    };
+    
+    // 使用国外的CDN，加载速度有时会很慢，或者自定义URL
+    // You can custom KaTeX load url.
+    editormd.katexURL  = {
+        css : "//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.3.0/katex.min",
+        js  : "//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.3.0/katex.min"
+    };
+    
+    editormd.kaTeXLoaded = false;
+    
+    /**
+     * 加载KaTeX文件
+     * load KaTeX files
+     * 
+     * @param {Function} [callback=function()]  加载成功后执行的回调函数
+     */
+    
+    editormd.loadKaTeX = function (callback) {
+        editormd.loadCSS(editormd.katexURL.css, function(){
+            editormd.loadScript(editormd.katexURL.js, callback || function(){});
+        });
+    };
+        
+    /**
+     * 锁屏
+     * lock screen
+     * 
+     * @param   {Boolean}   lock   Boolean 布尔值，是否锁屏
+     * @returns {void}
+     */
+    
+    editormd.lockScreen = function(lock) {
+        $("html,body").css("overflow", (lock) ? "hidden" : "");
+    };
+        
+    /**
+     * 动态创建对话框
+     * Creating custom dialogs
+     * 
+     * @param   {Object} options 配置项键值对 Key/Value
+     * @returns {dialog} 返回创建的dialog的jQuery实例对象
+     */
+
+    editormd.createDialog = function(options) {
+        var defaults = {
+            name : "",
+            width : 420,
+            height: 240,
+            title : "",
+            drag  : true,
+            closed : true,
+            content : "",
+            mask : true,
+            maskStyle : {
+                backgroundColor : "#fff",
+                opacity : 0.1
+            },
+            lockScreen : true,
+            footer : true,
+            buttons : false
+        };
+
+        options          = $.extend(true, defaults, options);
+        
+        var $this        = this;
+        var editor       = this.editor;
+        var classPrefix  = editormd.classPrefix;
+        var guid         = (new Date()).getTime();
+        var dialogName   = ( (options.name === "") ? classPrefix + "dialog-" + guid : options.name);
+        var mouseOrTouch = editormd.mouseOrTouch;
+
+        var html         = "<div class=\"" + classPrefix + "dialog " + dialogName + "\">";
+
+        if (options.title !== "")
+        {
+            html += "<div class=\"" + classPrefix + "dialog-header\"" + ( (options.drag) ? " style=\"cursor: move;\"" : "" ) + ">";
+            html += "<strong class=\"" + classPrefix + "dialog-title\">" + options.title + "</strong>";
+            html += "</div>";
+        }
+
+        if (options.closed)
+        {
+            html += "<a href=\"javascript:;\" class=\"fa fa-close " + classPrefix + "dialog-close\"></a>";
+        }
+
+        html += "<div class=\"" + classPrefix + "dialog-container\">" + options.content;                    
+
+        if (options.footer || typeof options.footer === "string") 
+        {
+            html += "<div class=\"" + classPrefix + "dialog-footer\">" + ( (typeof options.footer === "boolean") ? "" : options.footer) + "</div>";
+        }
+
+        html += "</div>";
+
+        html += "<div class=\"" + classPrefix + "dialog-mask " + classPrefix + "dialog-mask-bg\"></div>";
+        html += "<div class=\"" + classPrefix + "dialog-mask " + classPrefix + "dialog-mask-con\"></div>";
+        html += "</div>";
+
+        editor.append(html);
+
+        var dialog = editor.find("." + dialogName);
+
+        dialog.lockScreen = function(lock) {
+            if (options.lockScreen)
+            {                
+                $("html,body").css("overflow", (lock) ? "hidden" : "");
+                $this.resize();
+            }
+
+            return dialog;
+        };
+
+        dialog.showMask = function() {
+            if (options.mask)
+            {
+                editor.find("." + classPrefix + "mask").css(options.maskStyle).css("z-index", editormd.dialogZindex - 1).show();
+            }
+            return dialog;
+        };
+
+        dialog.hideMask = function() {
+            if (options.mask)
+            {
+                editor.find("." + classPrefix + "mask").hide();
+            }
+
+            return dialog;
+        };
+
+        dialog.loading = function(show) {                        
+            var loading = dialog.find("." + classPrefix + "dialog-mask");
+            loading[(show) ? "show" : "hide"]();
+
+            return dialog;
+        };
+
+        dialog.lockScreen(true).showMask();
+
+        dialog.show().css({
+            zIndex : editormd.dialogZindex,
+            border : (editormd.isIE8) ? "1px solid #ddd" : "",
+            width  : (typeof options.width  === "number") ? options.width + "px"  : options.width,
+            height : (typeof options.height === "number") ? options.height + "px" : options.height
+        });
+
+        var dialogPosition = function(){
+            dialog.css({
+                top    : ($(window).height() - dialog.height()) / 2 + "px",
+                left   : ($(window).width() - dialog.width()) / 2 + "px"
+            });
+        };
+
+        dialogPosition();
+
+        $(window).resize(dialogPosition);
+
+        dialog.children("." + classPrefix + "dialog-close").bind(mouseOrTouch("click", "touchend"), function() {
+            dialog.hide().lockScreen(false).hideMask();
+        });
+
+        if (typeof options.buttons === "object")
+        {
+            var footer = dialog.footer = dialog.find("." + classPrefix + "dialog-footer");
+
+            for (var key in options.buttons)
+            {
+                var btn = options.buttons[key];
+                var btnClassName = classPrefix + key + "-btn";
+
+                footer.append("<button class=\"" + classPrefix + "btn " + btnClassName + "\">" + btn[0] + "</button>");
+                btn[1] = $.proxy(btn[1], dialog);
+                footer.children("." + btnClassName).bind(mouseOrTouch("click", "touchend"), btn[1]);
+            }
+        }
+
+        if (options.title !== "" && options.drag)
+        {                        
+            var posX, posY;
+            var dialogHeader = dialog.children("." + classPrefix + "dialog-header");
+
+            if (!options.mask) {
+                dialogHeader.bind(mouseOrTouch("click", "touchend"), function(){
+                    editormd.dialogZindex += 2;
+                    dialog.css("z-index", editormd.dialogZindex);
+                });
+            }
+
+            dialogHeader.mousedown(function(e) {
+                e = e || window.event;  //IE
+                posX = e.clientX - parseInt(dialog[0].style.left);
+                posY = e.clientY - parseInt(dialog[0].style.top);
+
+                document.onmousemove = moveAction;                   
+            });
+
+            var userCanSelect = function (obj) {
+                obj.removeClass(classPrefix + "user-unselect").off("selectstart");
+            };
+
+            var userUnselect = function (obj) {
+                obj.addClass(classPrefix + "user-unselect").on("selectstart", function(event) { // selectstart for IE                        
+                    return false;
+                });
+            };
+
+            var moveAction = function (e) {
+                e = e || window.event;  //IE
+
+                var left, top, nowLeft = parseInt(dialog[0].style.left), nowTop = parseInt(dialog[0].style.top);
+
+                if( nowLeft >= 0 ) {
+                    if( nowLeft + dialog.width() <= $(window).width()) {
+                        left = e.clientX - posX;
+                    } else {	
+                        left = $(window).width() - dialog.width();
+                        document.onmousemove = null;
+                    }
+                } else {
+                    left = 0;
+                    document.onmousemove = null;
+                }
+
+                if( nowTop >= 0 ) {
+                    top = e.clientY - posY;
+                } else {
+                    top = 0;
+                    document.onmousemove = null;
+                }
+
+
+                document.onselectstart = function() {
+                    return false;
+                };
+
+                userUnselect($("body"));
+                userUnselect(dialog);
+                dialog[0].style.left = left + "px";
+                dialog[0].style.top  = top + "px";
+            };
+
+            document.onmouseup = function() {                            
+                userCanSelect($("body"));
+                userCanSelect(dialog);
+
+                document.onselectstart = null;         
+                document.onmousemove = null;
+            };
+
+            dialogHeader.touchDraggable = function() {
+                var offset = null;
+                var start  = function(e) {
+                    var orig = e.originalEvent; 
+                    var pos  = $(this).parent().position();
+
+                    offset = {
+                        x : orig.changedTouches[0].pageX - pos.left,
+                        y : orig.changedTouches[0].pageY - pos.top
+                    };
+                };
+
+                var move = function(e) {
+                    e.preventDefault();
+                    var orig = e.originalEvent;
+
+                    $(this).parent().css({
+                        top  : orig.changedTouches[0].pageY - offset.y,
+                        left : orig.changedTouches[0].pageX - offset.x
+                    });
+                };
+
+                this.bind("touchstart", start).bind("touchmove", move);
+            };
+
+            dialogHeader.touchDraggable();
+        }
+
+        editormd.dialogZindex += 2;
+
+        return dialog;
+    };
+    
+    /**
+     * 鼠标和触摸事件的判断/选择方法
+     * MouseEvent or TouchEvent type switch
+     * 
+     * @param   {String} [mouseEventType="click"]    供选择的鼠标事件
+     * @param   {String} [touchEventType="touchend"] 供选择的触摸事件
+     * @returns {String} EventType                   返回事件类型名称
+     */
+    
+    editormd.mouseOrTouch = function(mouseEventType, touchEventType) {
+        mouseEventType = mouseEventType || "click";
+        touchEventType = touchEventType || "touchend";
+        
+        var eventType  = mouseEventType;
+
+        try {
+            document.createEvent("TouchEvent");
+            eventType = touchEventType;
+        } catch(e) {}
+
+        return eventType;
+    };
+    
+    /**
+     * 日期时间的格式化方法
+     * Datetime format method
+     * 
+     * @param   {String}   [format=""]  日期时间的格式，类似PHP的格式
+     * @returns {String}   datefmt      返回格式化后的日期时间字符串
+     */
+    
+    editormd.dateFormat = function(format) {                
+        format      = format || "";
+
+        var addZero = function(d) {
+            return (d < 10) ? "0" + d : d;
+        };
+
+        var date    = new Date(); 
+        var year    = date.getFullYear();
+        var year2   = year.toString().slice(2, 4);
+        var month   = addZero(date.getMonth() + 1);
+        var day     = addZero(date.getDate());
+        var weekDay = date.getDay();
+        var hour    = addZero(date.getHours());
+        var min     = addZero(date.getMinutes());
+        var second  = addZero(date.getSeconds());
+        var ms      = addZero(date.getMilliseconds()); 
+        var datefmt = "";
+
+        var ymd     = year2 + "-" + month + "-" + day;
+        var fymd    = year  + "-" + month + "-" + day;
+        var hms     = hour  + ":" + min   + ":" + second;
+
+        switch (format) 
+        {
+            case "UNIX Time" :
+                    datefmt = date.getTime();
+                break;
+
+            case "UTC" :
+                    datefmt = date.toUTCString();
+                break;	
+
+            case "yy" :
+                    datefmt = year2;
+                break;	
+
+            case "year" :
+            case "yyyy" :
+                    datefmt = year;
+                break;
+
+            case "month" :
+            case "mm" :
+                    datefmt = month;
+                break;                        
+
+            case "cn-week-day" :
+            case "cn-wd" :
+                    var cnWeekDays = ["日", "一", "二", "三", "四", "五", "六"];
+                    datefmt = "星期" + cnWeekDays[weekDay];
+                break;
+
+            case "week-day" :
+            case "wd" :
+                    var weekDays = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
+                    datefmt = weekDays[weekDay];
+                break;
+
+            case "day" :
+            case "dd" :
+                    datefmt = day;
+                break;
+
+            case "hour" :
+            case "hh" :
+                    datefmt = hour;
+                break;
+
+            case "min" :
+            case "ii" :
+                    datefmt = min;
+                break;
+
+            case "second" :
+            case "ss" :
+                    datefmt = second;
+                break;
+
+            case "ms" :
+                    datefmt = ms;
+                break;
+
+            case "yy-mm-dd" :
+                    datefmt = ymd;
+                break;
+
+            case "yyyy-mm-dd" :
+                    datefmt = fymd;
+                break;
+
+            case "yyyy-mm-dd h:i:s ms" :
+            case "full + ms" : 
+                    datefmt = fymd + " " + hms + " " + ms;
+                break;
+
+            case "full" :
+            case "yyyy-mm-dd h:i:s" :
+                default:
+                    datefmt = fymd + " " + hms;
+                break;
+        }
+
+        return datefmt;
+    };
+
+    return editormd;
+
+}));
+(function(){
+    var factory = function (exports) {
+        var lang = {
+            name : "zh-tw",
+            description : "開源在線Markdown編輯器<br/>Open source online Markdown editor.",
+            tocTitle    : "目錄",
+            toolbar     : {
+                undo             : "撤銷（Ctrl+Z）",
+                redo             : "重做（Ctrl+Y）",
+                bold             : "粗體",
+                del              : "刪除線",
+                italic           : "斜體",
+                quote            : "引用",
+                ucwords          : "將所選的每個單詞首字母轉成大寫",
+                uppercase        : "將所選文本轉成大寫",
+                lowercase        : "將所選文本轉成小寫",
+                h1               : "標題1",
+                h2               : "標題2",
+                h3               : "標題3",
+                h4               : "標題4",
+                h5               : "標題5",
+                h6               : "標題6",
+                "list-ul"        : "無序列表",
+                "list-ol"        : "有序列表",
+                hr               : "横线",
+                link             : "链接",
+                "reference-link" : "引用鏈接",
+                image            : "圖片",
+                code             : "行內代碼",
+                "preformatted-text" : "預格式文本 / 代碼塊（縮進風格）",
+                "code-block"     : "代碼塊（多語言風格）",
+                table            : "添加表格",
+                datetime         : "日期時間",
+                emoji            : "Emoji 表情",
+                "html-entities"  : "HTML 實體字符",
+                pagebreak        : "插入分頁符",
+                watch            : "關閉實時預覽",
+                unwatch          : "開啟實時預覽",
+                preview          : "全窗口預覽HTML（按 Shift + ESC 退出）",
+                fullscreen       : "全屏（按 ESC 退出）",
+                clear            : "清空",
+                search           : "搜尋",
+                help             : "使用幫助",
+                info             : "關於" + exports.title
+            },
+            buttons : {
+                enter  : "確定",
+                cancel : "取消",
+                close  : "關閉"
+            },
+            dialog : {
+                link   : {
+                    title    : "添加鏈接",
+                    url      : "鏈接地址",
+                    urlTitle : "鏈接標題",
+                    urlEmpty : "錯誤：請填寫鏈接地址。"
+                },
+                referenceLink : {
+                    title    : "添加引用鏈接",
+                    name     : "引用名稱",
+                    url      : "鏈接地址",
+                    urlId    : "鏈接ID",
+                    urlTitle : "鏈接標題",
+                    nameEmpty: "錯誤：引用鏈接的名稱不能為空。",
+                    idEmpty  : "錯誤：請填寫引用鏈接的ID。",
+                    urlEmpty : "錯誤：請填寫引用鏈接的URL地址。"
+                },
+                image  : {
+                    title    : "添加圖片",
+                    url      : "圖片地址",
+                    link     : "圖片鏈接",
+                    alt      : "圖片描述",
+                    uploadButton     : "本地上傳",
+                    imageURLEmpty    : "錯誤：圖片地址不能為空。",
+                    uploadFileEmpty  : "錯誤：上傳的圖片不能為空！",
+                    formatNotAllowed : "錯誤：只允許上傳圖片文件，允許上傳的圖片文件格式有："
+                },
+                preformattedText : {
+                    title             : "添加預格式文本或代碼塊", 
+                    emptyAlert        : "錯誤：請填寫預格式文本或代碼的內容。"
+                },
+                codeBlock : {
+                    title             : "添加代碼塊",                 
+                    selectLabel       : "代碼語言：",
+                    selectDefaultText : "請語言代碼語言",
+                    otherLanguage     : "其他語言",
+                    unselectedLanguageAlert : "錯誤：請選擇代碼所屬的語言類型。",
+                    codeEmptyAlert    : "錯誤：請填寫代碼內容。"
+                },
+                htmlEntities : {
+                    title : "HTML實體字符"
+                },
+                help : {
+                    title : "使用幫助"
+                }
+            }
+        };
+        
+        exports.defaults.lang = lang;
+    };
+    
+	// CommonJS/Node.js
+	if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
+    { 
+        module.exports = factory;
+    }
+	else if (typeof define === "function")  // AMD/CMD/Sea.js
+    {
+		if (define.amd) { // for Require.js
+
+			define(["editormd"], function(editormd) {
+                factory(editormd);
+            });
+
+		} else { // for Sea.js
+			define(function(require) {
+                var editormd = require("../editormd");
+                factory(editormd);
+            });
+		}
+	} 
+	else
+	{
+        factory(window.editormd);
+	}
+    
+})();
+(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.dragula = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+'use strict';
+
+var cache = {};
+var start = '(?:^|\\s)';
+var end = '(?:\\s|$)';
+
+function lookupClass (className) {
+  var cached = cache[className];
+  if (cached) {
+    cached.lastIndex = 0;
+  } else {
+    cache[className] = cached = new RegExp(start + className + end, 'g');
+  }
+  return cached;
+}
+
+function addClass (el, className) {
+  var current = el.className;
+  if (!current.length) {
+    el.className = className;
+  } else if (!lookupClass(className).test(current)) {
+    el.className += ' ' + className;
+  }
+}
+
+function rmClass (el, className) {
+  el.className = el.className.replace(lookupClass(className), ' ').trim();
+}
+
+module.exports = {
+  add: addClass,
+  rm: rmClass
+};
+
+},{}],2:[function(require,module,exports){
+(function (global){
+'use strict';
+
+var emitter = require('contra/emitter');
+var crossvent = require('crossvent');
+var classes = require('./classes');
+var doc = document;
+var documentElement = doc.documentElement;
+
+function dragula (initialContainers, options) {
+  var len = arguments.length;
+  if (len === 1 && Array.isArray(initialContainers) === false) {
+    options = initialContainers;
+    initialContainers = [];
+  }
+  var _mirror; // mirror image
+  var _source; // source container
+  var _item; // item being dragged
+  var _offsetX; // reference x
+  var _offsetY; // reference y
+  var _moveX; // reference move x
+  var _moveY; // reference move y
+  var _initialSibling; // reference sibling when grabbed
+  var _currentSibling; // reference sibling now
+  var _copy; // item used for copying
+  var _renderTimer; // timer for setTimeout renderMirrorImage
+  var _lastDropTarget = null; // last container item was over
+  var _grabbed; // holds mousedown context until first mousemove
+
+  var o = options || {};
+  if (o.moves === void 0) { o.moves = always; }
+  if (o.accepts === void 0) { o.accepts = always; }
+  if (o.invalid === void 0) { o.invalid = invalidTarget; }
+  if (o.containers === void 0) { o.containers = initialContainers || []; }
+  if (o.isContainer === void 0) { o.isContainer = never; }
+  if (o.copy === void 0) { o.copy = false; }
+  if (o.copySortSource === void 0) { o.copySortSource = false; }
+  if (o.revertOnSpill === void 0) { o.revertOnSpill = false; }
+  if (o.removeOnSpill === void 0) { o.removeOnSpill = false; }
+  if (o.direction === void 0) { o.direction = 'vertical'; }
+  if (o.ignoreInputTextSelection === void 0) { o.ignoreInputTextSelection = true; }
+  if (o.mirrorContainer === void 0) { o.mirrorContainer = doc.body; }
+
+  var drake = emitter({
+    containers: o.containers,
+    start: manualStart,
+    end: end,
+    cancel: cancel,
+    remove: remove,
+    destroy: destroy,
+    canMove: canMove,
+    dragging: false
+  });
+
+  if (o.removeOnSpill === true) {
+    drake.on('over', spillOver).on('out', spillOut);
+  }
+
+  events();
+
+  return drake;
+
+  function isContainer (el) {
+    return drake.containers.indexOf(el) !== -1 || o.isContainer(el);
+  }
+
+  function events (remove) {
+    var op = remove ? 'remove' : 'add';
+    touchy(documentElement, op, 'mousedown', grab);
+    touchy(documentElement, op, 'mouseup', release);
+  }
+
+  function eventualMovements (remove) {
+    var op = remove ? 'remove' : 'add';
+    touchy(documentElement, op, 'mousemove', startBecauseMouseMoved);
+  }
+
+  function movements (remove) {
+    var op = remove ? 'remove' : 'add';
+    crossvent[op](documentElement, 'selectstart', preventGrabbed); // IE8
+    crossvent[op](documentElement, 'click', preventGrabbed);
+  }
+
+  function destroy () {
+    events(true);
+    release({});
+  }
+
+  function preventGrabbed (e) {
+    if (_grabbed) {
+      e.preventDefault();
+    }
+  }
+
+  function grab (e) {
+    _moveX = e.clientX;
+    _moveY = e.clientY;
+
+    var ignore = whichMouseButton(e) !== 1 || e.metaKey || e.ctrlKey;
+    if (ignore) {
+      return; // we only care about honest-to-god left clicks and touch events
+    }
+    var item = e.target;
+    var context = canStart(item);
+    if (!context) {
+      return;
+    }
+    _grabbed = context;
+    eventualMovements();
+    if (e.type === 'mousedown') {
+      if (isInput(item)) { // see also: https://github.com/bevacqua/dragula/issues/208
+        item.focus(); // fixes https://github.com/bevacqua/dragula/issues/176
+      } else {
+        e.preventDefault(); // fixes https://github.com/bevacqua/dragula/issues/155
+      }
+    }
+  }
+
+  function startBecauseMouseMoved (e) {
+    if (!_grabbed) {
+      return;
+    }
+    if (whichMouseButton(e) === 0) {
+      release({});
+      return; // when text is selected on an input and then dragged, mouseup doesn't fire. this is our only hope
+    }
+    // truthy check fixes #239, equality fixes #207
+    if (e.clientX !== void 0 && e.clientX === _moveX && e.clientY !== void 0 && e.clientY === _moveY) {
+      return;
+    }
+    if (o.ignoreInputTextSelection) {
+      var clientX = getCoord('clientX', e);
+      var clientY = getCoord('clientY', e);
+      var elementBehindCursor = doc.elementFromPoint(clientX, clientY);
+      if (isInput(elementBehindCursor)) {
+        return;
+      }
+    }
+
+    var grabbed = _grabbed; // call to end() unsets _grabbed
+    eventualMovements(true);
+    movements();
+    end();
+    start(grabbed);
+
+    var offset = getOffset(_item);
+    _offsetX = getCoord('pageX', e) - offset.left;
+    _offsetY = getCoord('pageY', e) - offset.top;
+
+    classes.add(_copy || _item, 'gu-transit');
+    renderMirrorImage();
+    drag(e);
+  }
+
+  function canStart (item) {
+    if (drake.dragging && _mirror) {
+      return;
+    }
+    if (isContainer(item)) {
+      return; // don't drag container itself
+    }
+    var handle = item;
+    while (getParent(item) && isContainer(getParent(item)) === false) {
+      if (o.invalid(item, handle)) {
+        return;
+      }
+      item = getParent(item); // drag target should be a top element
+      if (!item) {
+        return;
+      }
+    }
+    var source = getParent(item);
+    if (!source) {
+      return;
+    }
+    if (o.invalid(item, handle)) {
+      return;
+    }
+
+    var movable = o.moves(item, source, handle, nextEl(item));
+    if (!movable) {
+      return;
+    }
+
+    return {
+      item: item,
+      source: source
+    };
+  }
+
+  function canMove (item) {
+    return !!canStart(item);
+  }
+
+  function manualStart (item) {
+    var context = canStart(item);
+    if (context) {
+      start(context);
+    }
+  }
+
+  function start (context) {
+    if (isCopy(context.item, context.source)) {
+      _copy = context.item.cloneNode(true);
+      drake.emit('cloned', _copy, context.item, 'copy');
+    }
+
+    _source = context.source;
+    _item = context.item;
+    _initialSibling = _currentSibling = nextEl(context.item);
+
+    drake.dragging = true;
+    drake.emit('drag', _item, _source);
+  }
+
+  function invalidTarget () {
+    return false;
+  }
+
+  function end () {
+    if (!drake.dragging) {
+      return;
+    }
+    var item = _copy || _item;
+    drop(item, getParent(item));
+  }
+
+  function ungrab () {
+    _grabbed = false;
+    eventualMovements(true);
+    movements(true);
+  }
+
+  function release (e) {
+    ungrab();
+
+    if (!drake.dragging) {
+      return;
+    }
+    var item = _copy || _item;
+    var clientX = getCoord('clientX', e);
+    var clientY = getCoord('clientY', e);
+    var elementBehindCursor = getElementBehindPoint(_mirror, clientX, clientY);
+    var dropTarget = findDropTarget(elementBehindCursor, clientX, clientY);
+    if (dropTarget && ((_copy && o.copySortSource) || (!_copy || dropTarget !== _source))) {
+      drop(item, dropTarget);
+    } else if (o.removeOnSpill) {
+      remove();
+    } else {
+      cancel();
+    }
+  }
+
+  function drop (item, target) {
+    var parent = getParent(item);
+    if (_copy && o.copySortSource && target === _source) {
+      parent.removeChild(_item);
+    }
+    if (isInitialPlacement(target)) {
+      drake.emit('cancel', item, _source, _source);
+    } else {
+      drake.emit('drop', item, target, _source, _currentSibling);
+    }
+    cleanup();
+  }
+
+  function remove () {
+    if (!drake.dragging) {
+      return;
+    }
+    var item = _copy || _item;
+    var parent = getParent(item);
+    if (parent) {
+      parent.removeChild(item);
+    }
+    drake.emit(_copy ? 'cancel' : 'remove', item, parent, _source);
+    cleanup();
+  }
+
+  function cancel (revert) {
+    if (!drake.dragging) {
+      return;
+    }
+    var reverts = arguments.length > 0 ? revert : o.revertOnSpill;
+    var item = _copy || _item;
+    var parent = getParent(item);
+    var initial = isInitialPlacement(parent);
+    if (initial === false && reverts) {
+      if (_copy) {
+        if (parent) {
+          parent.removeChild(_copy);
+        }
+      } else {
+        _source.insertBefore(item, _initialSibling);
+      }
+    }
+    if (initial || reverts) {
+      drake.emit('cancel', item, _source, _source);
+    } else {
+      drake.emit('drop', item, parent, _source, _currentSibling);
+    }
+    cleanup();
+  }
+
+  function cleanup () {
+    var item = _copy || _item;
+    ungrab();
+    removeMirrorImage();
+    if (item) {
+      classes.rm(item, 'gu-transit');
+    }
+    if (_renderTimer) {
+      clearTimeout(_renderTimer);
+    }
+    drake.dragging = false;
+    if (_lastDropTarget) {
+      drake.emit('out', item, _lastDropTarget, _source);
+    }
+    drake.emit('dragend', item);
+    _source = _item = _copy = _initialSibling = _currentSibling = _renderTimer = _lastDropTarget = null;
+  }
+
+  function isInitialPlacement (target, s) {
+    var sibling;
+    if (s !== void 0) {
+      sibling = s;
+    } else if (_mirror) {
+      sibling = _currentSibling;
+    } else {
+      sibling = nextEl(_copy || _item);
+    }
+    return target === _source && sibling === _initialSibling;
+  }
+
+  function findDropTarget (elementBehindCursor, clientX, clientY) {
+    var target = elementBehindCursor;
+    while (target && !accepted()) {
+      target = getParent(target);
+    }
+    return target;
+
+    function accepted () {
+      var droppable = isContainer(target);
+      if (droppable === false) {
+        return false;
+      }
+
+      var immediate = getImmediateChild(target, elementBehindCursor);
+      var reference = getReference(target, immediate, clientX, clientY);
+      var initial = isInitialPlacement(target, reference);
+      if (initial) {
+        return true; // should always be able to drop it right back where it was
+      }
+      return o.accepts(_item, target, _source, reference);
+    }
+  }
+
+  function drag (e) {
+    if (!_mirror) {
+      return;
+    }
+    e.preventDefault();
+
+    var clientX = getCoord('clientX', e);
+    var clientY = getCoord('clientY', e);
+    var x = clientX - _offsetX;
+    var y = clientY - _offsetY;
+
+    _mirror.style.left = x + 'px';
+    _mirror.style.top = y + 'px';
+
+    var item = _copy || _item;
+    var elementBehindCursor = getElementBehindPoint(_mirror, clientX, clientY);
+    var dropTarget = findDropTarget(elementBehindCursor, clientX, clientY);
+    var changed = dropTarget !== null && dropTarget !== _lastDropTarget;
+    if (changed || dropTarget === null) {
+      out();
+      _lastDropTarget = dropTarget;
+      over();
+    }
+    var parent = getParent(item);
+    if (dropTarget === _source && _copy && !o.copySortSource) {
+      if (parent) {
+        parent.removeChild(item);
+      }
+      return;
+    }
+    var reference;
+    var immediate = getImmediateChild(dropTarget, elementBehindCursor);
+    if (immediate !== null) {
+      reference = getReference(dropTarget, immediate, clientX, clientY);
+    } else if (o.revertOnSpill === true && !_copy) {
+      reference = _initialSibling;
+      dropTarget = _source;
+    } else {
+      if (_copy && parent) {
+        parent.removeChild(item);
+      }
+      return;
+    }
+    if (
+      (reference === null && changed) ||
+      reference !== item &&
+      reference !== nextEl(item)
+    ) {
+      _currentSibling = reference;
+      dropTarget.insertBefore(item, reference);
+      drake.emit('shadow', item, dropTarget, _source);
+    }
+    function moved (type) { drake.emit(type, item, _lastDropTarget, _source); }
+    function over () { if (changed) { moved('over'); } }
+    function out () { if (_lastDropTarget) { moved('out'); } }
+  }
+
+  function spillOver (el) {
+    classes.rm(el, 'gu-hide');
+  }
+
+  function spillOut (el) {
+    if (drake.dragging) { classes.add(el, 'gu-hide'); }
+  }
+
+  function renderMirrorImage () {
+    if (_mirror) {
+      return;
+    }
+    var rect = _item.getBoundingClientRect();
+    _mirror = _item.cloneNode(true);
+    _mirror.style.width = getRectWidth(rect) + 'px';
+    _mirror.style.height = getRectHeight(rect) + 'px';
+    classes.rm(_mirror, 'gu-transit');
+    classes.add(_mirror, 'gu-mirror');
+    o.mirrorContainer.appendChild(_mirror);
+    touchy(documentElement, 'add', 'mousemove', drag);
+    classes.add(o.mirrorContainer, 'gu-unselectable');
+    drake.emit('cloned', _mirror, _item, 'mirror');
+  }
+
+  function removeMirrorImage () {
+    if (_mirror) {
+      classes.rm(o.mirrorContainer, 'gu-unselectable');
+      touchy(documentElement, 'remove', 'mousemove', drag);
+      getParent(_mirror).removeChild(_mirror);
+      _mirror = null;
+    }
+  }
+
+  function getImmediateChild (dropTarget, target) {
+    var immediate = target;
+    while (immediate !== dropTarget && getParent(immediate) !== dropTarget) {
+      immediate = getParent(immediate);
+    }
+    if (immediate === documentElement) {
+      return null;
+    }
+    return immediate;
+  }
+
+  function getReference (dropTarget, target, x, y) {
+    var horizontal = o.direction === 'horizontal';
+    var reference = target !== dropTarget ? inside() : outside();
+    return reference;
+
+    function outside () { // slower, but able to figure out any position
+      var len = dropTarget.children.length;
+      var i;
+      var el;
+      var rect;
+      for (i = 0; i < len; i++) {
+        el = dropTarget.children[i];
+        rect = el.getBoundingClientRect();
+        if (horizontal && (rect.left + rect.width / 2) > x) { return el; }
+        if (!horizontal && (rect.top + rect.height / 2) > y) { return el; }
+      }
+      return null;
+    }
+
+    function inside () { // faster, but only available if dropped inside a child element
+      var rect = target.getBoundingClientRect();
+      if (horizontal) {
+        return resolve(x > rect.left + getRectWidth(rect) / 2);
+      }
+      return resolve(y > rect.top + getRectHeight(rect) / 2);
+    }
+
+    function resolve (after) {
+      return after ? nextEl(target) : target;
+    }
+  }
+
+  function isCopy (item, container) {
+    return typeof o.copy === 'boolean' ? o.copy : o.copy(item, container);
+  }
+}
+
+function touchy (el, op, type, fn) {
+  var touch = {
+    mouseup: 'touchend',
+    mousedown: 'touchstart',
+    mousemove: 'touchmove'
+  };
+  var pointers = {
+    mouseup: 'pointerup',
+    mousedown: 'pointerdown',
+    mousemove: 'pointermove'
+  };
+  var microsoft = {
+    mouseup: 'MSPointerUp',
+    mousedown: 'MSPointerDown',
+    mousemove: 'MSPointerMove'
+  };
+  if (global.navigator.pointerEnabled) {
+    crossvent[op](el, pointers[type], fn);
+  } else if (global.navigator.msPointerEnabled) {
+    crossvent[op](el, microsoft[type], fn);
+  } else {
+    crossvent[op](el, touch[type], fn);
+    crossvent[op](el, type, fn);
+  }
+}
+
+function whichMouseButton (e) {
+  if (e.touches !== void 0) { return e.touches.length; }
+  if (e.which !== void 0 && e.which !== 0) { return e.which; } // see https://github.com/bevacqua/dragula/issues/261
+  if (e.buttons !== void 0) { return e.buttons; }
+  var button = e.button;
+  if (button !== void 0) { // see https://github.com/jquery/jquery/blob/99e8ff1baa7ae341e94bb89c3e84570c7c3ad9ea/src/event.js#L573-L575
+    return button & 1 ? 1 : button & 2 ? 3 : (button & 4 ? 2 : 0);
+  }
+}
+
+function getOffset (el) {
+  var rect = el.getBoundingClientRect();
+  return {
+    left: rect.left + getScroll('scrollLeft', 'pageXOffset'),
+    top: rect.top + getScroll('scrollTop', 'pageYOffset')
+  };
+}
+
+function getScroll (scrollProp, offsetProp) {
+  if (typeof global[offsetProp] !== 'undefined') {
+    return global[offsetProp];
+  }
+  if (documentElement.clientHeight) {
+    return documentElement[scrollProp];
+  }
+  return doc.body[scrollProp];
+}
+
+function getElementBehindPoint (point, x, y) {
+  var p = point || {};
+  var state = p.className;
+  var el;
+  p.className += ' gu-hide';
+  el = doc.elementFromPoint(x, y);
+  p.className = state;
+  return el;
+}
+
+function never () { return false; }
+function always () { return true; }
+function getRectWidth (rect) { return rect.width || (rect.right - rect.left); }
+function getRectHeight (rect) { return rect.height || (rect.bottom - rect.top); }
+function getParent (el) { return el.parentNode === doc ? null : el.parentNode; }
+function isInput (el) { return el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT' || isEditable(el); }
+function isEditable (el) {
+  if (!el) { return false; } // no parents were editable
+  if (el.contentEditable === 'false') { return false; } // stop the lookup
+  if (el.contentEditable === 'true') { return true; } // found a contentEditable element in the chain
+  return isEditable(getParent(el)); // contentEditable is set to 'inherit'
+}
+
+function nextEl (el) {
+  return el.nextElementSibling || manually();
+  function manually () {
+    var sibling = el;
+    do {
+      sibling = sibling.nextSibling;
+    } while (sibling && sibling.nodeType !== 1);
+    return sibling;
+  }
+}
+
+function getEventHost (e) {
+  // on touchend event, we have to use `e.changedTouches`
+  // see http://stackoverflow.com/questions/7192563/touchend-event-properties
+  // see https://github.com/bevacqua/dragula/issues/34
+  if (e.targetTouches && e.targetTouches.length) {
+    return e.targetTouches[0];
+  }
+  if (e.changedTouches && e.changedTouches.length) {
+    return e.changedTouches[0];
+  }
+  return e;
+}
+
+function getCoord (coord, e) {
+  var host = getEventHost(e);
+  var missMap = {
+    pageX: 'clientX', // IE8
+    pageY: 'clientY' // IE8
+  };
+  if (coord in missMap && !(coord in host) && missMap[coord] in host) {
+    coord = missMap[coord];
+  }
+  return host[coord];
+}
+
+module.exports = dragula;
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{"./classes":1,"contra/emitter":5,"crossvent":6}],3:[function(require,module,exports){
+module.exports = function atoa (a, n) { return Array.prototype.slice.call(a, n); }
+
+},{}],4:[function(require,module,exports){
+'use strict';
+
+var ticky = require('ticky');
+
+module.exports = function debounce (fn, args, ctx) {
+  if (!fn) { return; }
+  ticky(function run () {
+    fn.apply(ctx || null, args || []);
+  });
+};
+
+},{"ticky":9}],5:[function(require,module,exports){
+'use strict';
+
+var atoa = require('atoa');
+var debounce = require('./debounce');
+
+module.exports = function emitter (thing, options) {
+  var opts = options || {};
+  var evt = {};
+  if (thing === undefined) { thing = {}; }
+  thing.on = function (type, fn) {
+    if (!evt[type]) {
+      evt[type] = [fn];
+    } else {
+      evt[type].push(fn);
+    }
+    return thing;
+  };
+  thing.once = function (type, fn) {
+    fn._once = true; // thing.off(fn) still works!
+    thing.on(type, fn);
+    return thing;
+  };
+  thing.off = function (type, fn) {
+    var c = arguments.length;
+    if (c === 1) {
+      delete evt[type];
+    } else if (c === 0) {
+      evt = {};
+    } else {
+      var et = evt[type];
+      if (!et) { return thing; }
+      et.splice(et.indexOf(fn), 1);
+    }
+    return thing;
+  };
+  thing.emit = function () {
+    var args = atoa(arguments);
+    return thing.emitterSnapshot(args.shift()).apply(this, args);
+  };
+  thing.emitterSnapshot = function (type) {
+    var et = (evt[type] || []).slice(0);
+    return function () {
+      var args = atoa(arguments);
+      var ctx = this || thing;
+      if (type === 'error' && opts.throws !== false && !et.length) { throw args.length === 1 ? args[0] : args; }
+      et.forEach(function emitter (listen) {
+        if (opts.async) { debounce(listen, args, ctx); } else { listen.apply(ctx, args); }
+        if (listen._once) { thing.off(type, listen); }
+      });
+      return thing;
+    };
+  };
+  return thing;
+};
+
+},{"./debounce":4,"atoa":3}],6:[function(require,module,exports){
+(function (global){
+'use strict';
+
+var customEvent = require('custom-event');
+var eventmap = require('./eventmap');
+var doc = global.document;
+var addEvent = addEventEasy;
+var removeEvent = removeEventEasy;
+var hardCache = [];
+
+if (!global.addEventListener) {
+  addEvent = addEventHard;
+  removeEvent = removeEventHard;
+}
+
+module.exports = {
+  add: addEvent,
+  remove: removeEvent,
+  fabricate: fabricateEvent
+};
+
+function addEventEasy (el, type, fn, capturing) {
+  return el.addEventListener(type, fn, capturing);
+}
+
+function addEventHard (el, type, fn) {
+  return el.attachEvent('on' + type, wrap(el, type, fn));
+}
+
+function removeEventEasy (el, type, fn, capturing) {
+  return el.removeEventListener(type, fn, capturing);
+}
+
+function removeEventHard (el, type, fn) {
+  var listener = unwrap(el, type, fn);
+  if (listener) {
+    return el.detachEvent('on' + type, listener);
+  }
+}
+
+function fabricateEvent (el, type, model) {
+  var e = eventmap.indexOf(type) === -1 ? makeCustomEvent() : makeClassicEvent();
+  if (el.dispatchEvent) {
+    el.dispatchEvent(e);
+  } else {
+    el.fireEvent('on' + type, e);
+  }
+  function makeClassicEvent () {
+    var e;
+    if (doc.createEvent) {
+      e = doc.createEvent('Event');
+      e.initEvent(type, true, true);
+    } else if (doc.createEventObject) {
+      e = doc.createEventObject();
+    }
+    return e;
+  }
+  function makeCustomEvent () {
+    return new customEvent(type, { detail: model });
+  }
+}
+
+function wrapperFactory (el, type, fn) {
+  return function wrapper (originalEvent) {
+    var e = originalEvent || global.event;
+    e.target = e.target || e.srcElement;
+    e.preventDefault = e.preventDefault || function preventDefault () { e.returnValue = false; };
+    e.stopPropagation = e.stopPropagation || function stopPropagation () { e.cancelBubble = true; };
+    e.which = e.which || e.keyCode;
+    fn.call(el, e);
+  };
+}
+
+function wrap (el, type, fn) {
+  var wrapper = unwrap(el, type, fn) || wrapperFactory(el, type, fn);
+  hardCache.push({
+    wrapper: wrapper,
+    element: el,
+    type: type,
+    fn: fn
+  });
+  return wrapper;
+}
+
+function unwrap (el, type, fn) {
+  var i = find(el, type, fn);
+  if (i) {
+    var wrapper = hardCache[i].wrapper;
+    hardCache.splice(i, 1); // free up a tad of memory
+    return wrapper;
+  }
+}
+
+function find (el, type, fn) {
+  var i, item;
+  for (i = 0; i < hardCache.length; i++) {
+    item = hardCache[i];
+    if (item.element === el && item.type === type && item.fn === fn) {
+      return i;
+    }
+  }
+}
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{"./eventmap":7,"custom-event":8}],7:[function(require,module,exports){
+(function (global){
+'use strict';
+
+var eventmap = [];
+var eventname = '';
+var ron = /^on/;
+
+for (eventname in global) {
+  if (ron.test(eventname)) {
+    eventmap.push(eventname.slice(2));
+  }
+}
+
+module.exports = eventmap;
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{}],8:[function(require,module,exports){
+(function (global){
+
+var NativeCustomEvent = global.CustomEvent;
+
+function useNative () {
+  try {
+    var p = new NativeCustomEvent('cat', { detail: { foo: 'bar' } });
+    return  'cat' === p.type && 'bar' === p.detail.foo;
+  } catch (e) {
+  }
+  return false;
+}
+
+/**
+ * Cross-browser `CustomEvent` constructor.
+ *
+ * https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent.CustomEvent
+ *
+ * @public
+ */
+
+module.exports = useNative() ? NativeCustomEvent :
+
+// IE >= 9
+'function' === typeof document.createEvent ? function CustomEvent (type, params) {
+  var e = document.createEvent('CustomEvent');
+  if (params) {
+    e.initCustomEvent(type, params.bubbles, params.cancelable, params.detail);
+  } else {
+    e.initCustomEvent(type, false, false, void 0);
+  }
+  return e;
+} :
+
+// IE <= 8
+function CustomEvent (type, params) {
+  var e = document.createEventObject();
+  e.type = type;
+  if (params) {
+    e.bubbles = Boolean(params.bubbles);
+    e.cancelable = Boolean(params.cancelable);
+    e.detail = params.detail;
+  } else {
+    e.bubbles = false;
+    e.cancelable = false;
+    e.detail = void 0;
+  }
+  return e;
+}
+
+}).call(this,typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
+
+},{}],9:[function(require,module,exports){
+var si = typeof setImmediate === 'function', tick;
+if (si) {
+  tick = function (fn) { setImmediate(fn); };
+} else {
+  tick = function (fn) { setTimeout(fn, 0); };
+}
+
+module.exports = tick;
+},{}]},{},[2])(2)
+});
+//# sourceMappingURL=data:application/json;charset:utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm5vZGVfbW9kdWxlcy9icm93c2VyLXBhY2svX3ByZWx1ZGUuanMiLCJjbGFzc2VzLmpzIiwiZHJhZ3VsYS5qcyIsIm5vZGVfbW9kdWxlcy9hdG9hL2F0b2EuanMiLCJub2RlX21vZHVsZXMvY29udHJhL2RlYm91bmNlLmpzIiwibm9kZV9tb2R1bGVzL2NvbnRyYS9lbWl0dGVyLmpzIiwibm9kZV9tb2R1bGVzL2Nyb3NzdmVudC9zcmMvY3Jvc3N2ZW50LmpzIiwibm9kZV9tb2R1bGVzL2Nyb3NzdmVudC9zcmMvZXZlbnRtYXAuanMiLCJub2RlX21vZHVsZXMvY3VzdG9tLWV2ZW50L2luZGV4LmpzIiwibm9kZV9tb2R1bGVzL3RpY2t5L3RpY2t5LWJyb3dzZXIuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7QUNBQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTs7O0FDakNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTs7OztBQ2htQkE7QUFDQTs7QUNEQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOztBQ1ZBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7QUN0REE7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7OztBQ3JHQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7OztBQ2JBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBOzs7O0FDaERBO0FBQ0E7QUFDQTtBQUNBO0FBQ0E7QUFDQTtBQUNBO0FBQ0EiLCJmaWxlIjoiZ2VuZXJhdGVkLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXNDb250ZW50IjpbIihmdW5jdGlvbiBlKHQsbixyKXtmdW5jdGlvbiBzKG8sdSl7aWYoIW5bb10pe2lmKCF0W29dKXt2YXIgYT10eXBlb2YgcmVxdWlyZT09XCJmdW5jdGlvblwiJiZyZXF1aXJlO2lmKCF1JiZhKXJldHVybiBhKG8sITApO2lmKGkpcmV0dXJuIGkobywhMCk7dmFyIGY9bmV3IEVycm9yKFwiQ2Fubm90IGZpbmQgbW9kdWxlICdcIitvK1wiJ1wiKTt0aHJvdyBmLmNvZGU9XCJNT0RVTEVfTk9UX0ZPVU5EXCIsZn12YXIgbD1uW29dPXtleHBvcnRzOnt9fTt0W29dWzBdLmNhbGwobC5leHBvcnRzLGZ1bmN0aW9uKGUpe3ZhciBuPXRbb11bMV1bZV07cmV0dXJuIHMobj9uOmUpfSxsLGwuZXhwb3J0cyxlLHQsbixyKX1yZXR1cm4gbltvXS5leHBvcnRzfXZhciBpPXR5cGVvZiByZXF1aXJlPT1cImZ1bmN0aW9uXCImJnJlcXVpcmU7Zm9yKHZhciBvPTA7bzxyLmxlbmd0aDtvKyspcyhyW29dKTtyZXR1cm4gc30pIiwiJ3VzZSBzdHJpY3QnO1xuXG52YXIgY2FjaGUgPSB7fTtcbnZhciBzdGFydCA9ICcoPzpefFxcXFxzKSc7XG52YXIgZW5kID0gJyg/OlxcXFxzfCQpJztcblxuZnVuY3Rpb24gbG9va3VwQ2xhc3MgKGNsYXNzTmFtZSkge1xuICB2YXIgY2FjaGVkID0gY2FjaGVbY2xhc3NOYW1lXTtcbiAgaWYgKGNhY2hlZCkge1xuICAgIGNhY2hlZC5sYXN0SW5kZXggPSAwO1xuICB9IGVsc2Uge1xuICAgIGNhY2hlW2NsYXNzTmFtZV0gPSBjYWNoZWQgPSBuZXcgUmVnRXhwKHN0YXJ0ICsgY2xhc3NOYW1lICsgZW5kLCAnZycpO1xuICB9XG4gIHJldHVybiBjYWNoZWQ7XG59XG5cbmZ1bmN0aW9uIGFkZENsYXNzIChlbCwgY2xhc3NOYW1lKSB7XG4gIHZhciBjdXJyZW50ID0gZWwuY2xhc3NOYW1lO1xuICBpZiAoIWN1cnJlbnQubGVuZ3RoKSB7XG4gICAgZWwuY2xhc3NOYW1lID0gY2xhc3NOYW1lO1xuICB9IGVsc2UgaWYgKCFsb29rdXBDbGFzcyhjbGFzc05hbWUpLnRlc3QoY3VycmVudCkpIHtcbiAgICBlbC5jbGFzc05hbWUgKz0gJyAnICsgY2xhc3NOYW1lO1xuICB9XG59XG5cbmZ1bmN0aW9uIHJtQ2xhc3MgKGVsLCBjbGFzc05hbWUpIHtcbiAgZWwuY2xhc3NOYW1lID0gZWwuY2xhc3NOYW1lLnJlcGxhY2UobG9va3VwQ2xhc3MoY2xhc3NOYW1lKSwgJyAnKS50cmltKCk7XG59XG5cbm1vZHVsZS5leHBvcnRzID0ge1xuICBhZGQ6IGFkZENsYXNzLFxuICBybTogcm1DbGFzc1xufTtcbiIsIid1c2Ugc3RyaWN0JztcblxudmFyIGVtaXR0ZXIgPSByZXF1aXJlKCdjb250cmEvZW1pdHRlcicpO1xudmFyIGNyb3NzdmVudCA9IHJlcXVpcmUoJ2Nyb3NzdmVudCcpO1xudmFyIGNsYXNzZXMgPSByZXF1aXJlKCcuL2NsYXNzZXMnKTtcbnZhciBkb2MgPSBkb2N1bWVudDtcbnZhciBkb2N1bWVudEVsZW1lbnQgPSBkb2MuZG9jdW1lbnRFbGVtZW50O1xuXG5mdW5jdGlvbiBkcmFndWxhIChpbml0aWFsQ29udGFpbmVycywgb3B0aW9ucykge1xuICB2YXIgbGVuID0gYXJndW1lbnRzLmxlbmd0aDtcbiAgaWYgKGxlbiA9PT0gMSAmJiBBcnJheS5pc0FycmF5KGluaXRpYWxDb250YWluZXJzKSA9PT0gZmFsc2UpIHtcbiAgICBvcHRpb25zID0gaW5pdGlhbENvbnRhaW5lcnM7XG4gICAgaW5pdGlhbENvbnRhaW5lcnMgPSBbXTtcbiAgfVxuICB2YXIgX21pcnJvcjsgLy8gbWlycm9yIGltYWdlXG4gIHZhciBfc291cmNlOyAvLyBzb3VyY2UgY29udGFpbmVyXG4gIHZhciBfaXRlbTsgLy8gaXRlbSBiZWluZyBkcmFnZ2VkXG4gIHZhciBfb2Zmc2V0WDsgLy8gcmVmZXJlbmNlIHhcbiAgdmFyIF9vZmZzZXRZOyAvLyByZWZlcmVuY2UgeVxuICB2YXIgX21vdmVYOyAvLyByZWZlcmVuY2UgbW92ZSB4XG4gIHZhciBfbW92ZVk7IC8vIHJlZmVyZW5jZSBtb3ZlIHlcbiAgdmFyIF9pbml0aWFsU2libGluZzsgLy8gcmVmZXJlbmNlIHNpYmxpbmcgd2hlbiBncmFiYmVkXG4gIHZhciBfY3VycmVudFNpYmxpbmc7IC8vIHJlZmVyZW5jZSBzaWJsaW5nIG5vd1xuICB2YXIgX2NvcHk7IC8vIGl0ZW0gdXNlZCBmb3IgY29weWluZ1xuICB2YXIgX3JlbmRlclRpbWVyOyAvLyB0aW1lciBmb3Igc2V0VGltZW91dCByZW5kZXJNaXJyb3JJbWFnZVxuICB2YXIgX2xhc3REcm9wVGFyZ2V0ID0gbnVsbDsgLy8gbGFzdCBjb250YWluZXIgaXRlbSB3YXMgb3ZlclxuICB2YXIgX2dyYWJiZWQ7IC8vIGhvbGRzIG1vdXNlZG93biBjb250ZXh0IHVudGlsIGZpcnN0IG1vdXNlbW92ZVxuXG4gIHZhciBvID0gb3B0aW9ucyB8fCB7fTtcbiAgaWYgKG8ubW92ZXMgPT09IHZvaWQgMCkgeyBvLm1vdmVzID0gYWx3YXlzOyB9XG4gIGlmIChvLmFjY2VwdHMgPT09IHZvaWQgMCkgeyBvLmFjY2VwdHMgPSBhbHdheXM7IH1cbiAgaWYgKG8uaW52YWxpZCA9PT0gdm9pZCAwKSB7IG8uaW52YWxpZCA9IGludmFsaWRUYXJnZXQ7IH1cbiAgaWYgKG8uY29udGFpbmVycyA9PT0gdm9pZCAwKSB7IG8uY29udGFpbmVycyA9IGluaXRpYWxDb250YWluZXJzIHx8IFtdOyB9XG4gIGlmIChvLmlzQ29udGFpbmVyID09PSB2b2lkIDApIHsgby5pc0NvbnRhaW5lciA9IG5ldmVyOyB9XG4gIGlmIChvLmNvcHkgPT09IHZvaWQgMCkgeyBvLmNvcHkgPSBmYWxzZTsgfVxuICBpZiAoby5jb3B5U29ydFNvdXJjZSA9PT0gdm9pZCAwKSB7IG8uY29weVNvcnRTb3VyY2UgPSBmYWxzZTsgfVxuICBpZiAoby5yZXZlcnRPblNwaWxsID09PSB2b2lkIDApIHsgby5yZXZlcnRPblNwaWxsID0gZmFsc2U7IH1cbiAgaWYgKG8ucmVtb3ZlT25TcGlsbCA9PT0gdm9pZCAwKSB7IG8ucmVtb3ZlT25TcGlsbCA9IGZhbHNlOyB9XG4gIGlmIChvLmRpcmVjdGlvbiA9PT0gdm9pZCAwKSB7IG8uZGlyZWN0aW9uID0gJ3ZlcnRpY2FsJzsgfVxuICBpZiAoby5pZ25vcmVJbnB1dFRleHRTZWxlY3Rpb24gPT09IHZvaWQgMCkgeyBvLmlnbm9yZUlucHV0VGV4dFNlbGVjdGlvbiA9IHRydWU7IH1cbiAgaWYgKG8ubWlycm9yQ29udGFpbmVyID09PSB2b2lkIDApIHsgby5taXJyb3JDb250YWluZXIgPSBkb2MuYm9keTsgfVxuXG4gIHZhciBkcmFrZSA9IGVtaXR0ZXIoe1xuICAgIGNvbnRhaW5lcnM6IG8uY29udGFpbmVycyxcbiAgICBzdGFydDogbWFudWFsU3RhcnQsXG4gICAgZW5kOiBlbmQsXG4gICAgY2FuY2VsOiBjYW5jZWwsXG4gICAgcmVtb3ZlOiByZW1vdmUsXG4gICAgZGVzdHJveTogZGVzdHJveSxcbiAgICBjYW5Nb3ZlOiBjYW5Nb3ZlLFxuICAgIGRyYWdnaW5nOiBmYWxzZVxuICB9KTtcblxuICBpZiAoby5yZW1vdmVPblNwaWxsID09PSB0cnVlKSB7XG4gICAgZHJha2Uub24oJ292ZXInLCBzcGlsbE92ZXIpLm9uKCdvdXQnLCBzcGlsbE91dCk7XG4gIH1cblxuICBldmVudHMoKTtcblxuICByZXR1cm4gZHJha2U7XG5cbiAgZnVuY3Rpb24gaXNDb250YWluZXIgKGVsKSB7XG4gICAgcmV0dXJuIGRyYWtlLmNvbnRhaW5lcnMuaW5kZXhPZihlbCkgIT09IC0xIHx8IG8uaXNDb250YWluZXIoZWwpO1xuICB9XG5cbiAgZnVuY3Rpb24gZXZlbnRzIChyZW1vdmUpIHtcbiAgICB2YXIgb3AgPSByZW1vdmUgPyAncmVtb3ZlJyA6ICdhZGQnO1xuICAgIHRvdWNoeShkb2N1bWVudEVsZW1lbnQsIG9wLCAnbW91c2Vkb3duJywgZ3JhYik7XG4gICAgdG91Y2h5KGRvY3VtZW50RWxlbWVudCwgb3AsICdtb3VzZXVwJywgcmVsZWFzZSk7XG4gIH1cblxuICBmdW5jdGlvbiBldmVudHVhbE1vdmVtZW50cyAocmVtb3ZlKSB7XG4gICAgdmFyIG9wID0gcmVtb3ZlID8gJ3JlbW92ZScgOiAnYWRkJztcbiAgICB0b3VjaHkoZG9jdW1lbnRFbGVtZW50LCBvcCwgJ21vdXNlbW92ZScsIHN0YXJ0QmVjYXVzZU1vdXNlTW92ZWQpO1xuICB9XG5cbiAgZnVuY3Rpb24gbW92ZW1lbnRzIChyZW1vdmUpIHtcbiAgICB2YXIgb3AgPSByZW1vdmUgPyAncmVtb3ZlJyA6ICdhZGQnO1xuICAgIGNyb3NzdmVudFtvcF0oZG9jdW1lbnRFbGVtZW50LCAnc2VsZWN0c3RhcnQnLCBwcmV2ZW50R3JhYmJlZCk7IC8vIElFOFxuICAgIGNyb3NzdmVudFtvcF0oZG9jdW1lbnRFbGVtZW50LCAnY2xpY2snLCBwcmV2ZW50R3JhYmJlZCk7XG4gIH1cblxuICBmdW5jdGlvbiBkZXN0cm95ICgpIHtcbiAgICBldmVudHModHJ1ZSk7XG4gICAgcmVsZWFzZSh7fSk7XG4gIH1cblxuICBmdW5jdGlvbiBwcmV2ZW50R3JhYmJlZCAoZSkge1xuICAgIGlmIChfZ3JhYmJlZCkge1xuICAgICAgZS5wcmV2ZW50RGVmYXVsdCgpO1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIGdyYWIgKGUpIHtcbiAgICBfbW92ZVggPSBlLmNsaWVudFg7XG4gICAgX21vdmVZID0gZS5jbGllbnRZO1xuXG4gICAgdmFyIGlnbm9yZSA9IHdoaWNoTW91c2VCdXR0b24oZSkgIT09IDEgfHwgZS5tZXRhS2V5IHx8IGUuY3RybEtleTtcbiAgICBpZiAoaWdub3JlKSB7XG4gICAgICByZXR1cm47IC8vIHdlIG9ubHkgY2FyZSBhYm91dCBob25lc3QtdG8tZ29kIGxlZnQgY2xpY2tzIGFuZCB0b3VjaCBldmVudHNcbiAgICB9XG4gICAgdmFyIGl0ZW0gPSBlLnRhcmdldDtcbiAgICB2YXIgY29udGV4dCA9IGNhblN0YXJ0KGl0ZW0pO1xuICAgIGlmICghY29udGV4dCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBfZ3JhYmJlZCA9IGNvbnRleHQ7XG4gICAgZXZlbnR1YWxNb3ZlbWVudHMoKTtcbiAgICBpZiAoZS50eXBlID09PSAnbW91c2Vkb3duJykge1xuICAgICAgaWYgKGlzSW5wdXQoaXRlbSkpIHsgLy8gc2VlIGFsc286IGh0dHBzOi8vZ2l0aHViLmNvbS9iZXZhY3F1YS9kcmFndWxhL2lzc3Vlcy8yMDhcbiAgICAgICAgaXRlbS5mb2N1cygpOyAvLyBmaXhlcyBodHRwczovL2dpdGh1Yi5jb20vYmV2YWNxdWEvZHJhZ3VsYS9pc3N1ZXMvMTc2XG4gICAgICB9IGVsc2Uge1xuICAgICAgICBlLnByZXZlbnREZWZhdWx0KCk7IC8vIGZpeGVzIGh0dHBzOi8vZ2l0aHViLmNvbS9iZXZhY3F1YS9kcmFndWxhL2lzc3Vlcy8xNTVcbiAgICAgIH1cbiAgICB9XG4gIH1cblxuICBmdW5jdGlvbiBzdGFydEJlY2F1c2VNb3VzZU1vdmVkIChlKSB7XG4gICAgaWYgKCFfZ3JhYmJlZCkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAod2hpY2hNb3VzZUJ1dHRvbihlKSA9PT0gMCkge1xuICAgICAgcmVsZWFzZSh7fSk7XG4gICAgICByZXR1cm47IC8vIHdoZW4gdGV4dCBpcyBzZWxlY3RlZCBvbiBhbiBpbnB1dCBhbmQgdGhlbiBkcmFnZ2VkLCBtb3VzZXVwIGRvZXNuJ3QgZmlyZS4gdGhpcyBpcyBvdXIgb25seSBob3BlXG4gICAgfVxuICAgIC8vIHRydXRoeSBjaGVjayBmaXhlcyAjMjM5LCBlcXVhbGl0eSBmaXhlcyAjMjA3XG4gICAgaWYgKGUuY2xpZW50WCAhPT0gdm9pZCAwICYmIGUuY2xpZW50WCA9PT0gX21vdmVYICYmIGUuY2xpZW50WSAhPT0gdm9pZCAwICYmIGUuY2xpZW50WSA9PT0gX21vdmVZKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGlmIChvLmlnbm9yZUlucHV0VGV4dFNlbGVjdGlvbikge1xuICAgICAgdmFyIGNsaWVudFggPSBnZXRDb29yZCgnY2xpZW50WCcsIGUpO1xuICAgICAgdmFyIGNsaWVudFkgPSBnZXRDb29yZCgnY2xpZW50WScsIGUpO1xuICAgICAgdmFyIGVsZW1lbnRCZWhpbmRDdXJzb3IgPSBkb2MuZWxlbWVudEZyb21Qb2ludChjbGllbnRYLCBjbGllbnRZKTtcbiAgICAgIGlmIChpc0lucHV0KGVsZW1lbnRCZWhpbmRDdXJzb3IpKSB7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cbiAgICB9XG5cbiAgICB2YXIgZ3JhYmJlZCA9IF9ncmFiYmVkOyAvLyBjYWxsIHRvIGVuZCgpIHVuc2V0cyBfZ3JhYmJlZFxuICAgIGV2ZW50dWFsTW92ZW1lbnRzKHRydWUpO1xuICAgIG1vdmVtZW50cygpO1xuICAgIGVuZCgpO1xuICAgIHN0YXJ0KGdyYWJiZWQpO1xuXG4gICAgdmFyIG9mZnNldCA9IGdldE9mZnNldChfaXRlbSk7XG4gICAgX29mZnNldFggPSBnZXRDb29yZCgncGFnZVgnLCBlKSAtIG9mZnNldC5sZWZ0O1xuICAgIF9vZmZzZXRZID0gZ2V0Q29vcmQoJ3BhZ2VZJywgZSkgLSBvZmZzZXQudG9wO1xuXG4gICAgY2xhc3Nlcy5hZGQoX2NvcHkgfHwgX2l0ZW0sICdndS10cmFuc2l0Jyk7XG4gICAgcmVuZGVyTWlycm9ySW1hZ2UoKTtcbiAgICBkcmFnKGUpO1xuICB9XG5cbiAgZnVuY3Rpb24gY2FuU3RhcnQgKGl0ZW0pIHtcbiAgICBpZiAoZHJha2UuZHJhZ2dpbmcgJiYgX21pcnJvcikge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAoaXNDb250YWluZXIoaXRlbSkpIHtcbiAgICAgIHJldHVybjsgLy8gZG9uJ3QgZHJhZyBjb250YWluZXIgaXRzZWxmXG4gICAgfVxuICAgIHZhciBoYW5kbGUgPSBpdGVtO1xuICAgIHdoaWxlIChnZXRQYXJlbnQoaXRlbSkgJiYgaXNDb250YWluZXIoZ2V0UGFyZW50KGl0ZW0pKSA9PT0gZmFsc2UpIHtcbiAgICAgIGlmIChvLmludmFsaWQoaXRlbSwgaGFuZGxlKSkge1xuICAgICAgICByZXR1cm47XG4gICAgICB9XG4gICAgICBpdGVtID0gZ2V0UGFyZW50KGl0ZW0pOyAvLyBkcmFnIHRhcmdldCBzaG91bGQgYmUgYSB0b3AgZWxlbWVudFxuICAgICAgaWYgKCFpdGVtKSB7XG4gICAgICAgIHJldHVybjtcbiAgICAgIH1cbiAgICB9XG4gICAgdmFyIHNvdXJjZSA9IGdldFBhcmVudChpdGVtKTtcbiAgICBpZiAoIXNvdXJjZSkge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICBpZiAoby5pbnZhbGlkKGl0ZW0sIGhhbmRsZSkpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG5cbiAgICB2YXIgbW92YWJsZSA9IG8ubW92ZXMoaXRlbSwgc291cmNlLCBoYW5kbGUsIG5leHRFbChpdGVtKSk7XG4gICAgaWYgKCFtb3ZhYmxlKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgcmV0dXJuIHtcbiAgICAgIGl0ZW06IGl0ZW0sXG4gICAgICBzb3VyY2U6IHNvdXJjZVxuICAgIH07XG4gIH1cblxuICBmdW5jdGlvbiBjYW5Nb3ZlIChpdGVtKSB7XG4gICAgcmV0dXJuICEhY2FuU3RhcnQoaXRlbSk7XG4gIH1cblxuICBmdW5jdGlvbiBtYW51YWxTdGFydCAoaXRlbSkge1xuICAgIHZhciBjb250ZXh0ID0gY2FuU3RhcnQoaXRlbSk7XG4gICAgaWYgKGNvbnRleHQpIHtcbiAgICAgIHN0YXJ0KGNvbnRleHQpO1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIHN0YXJ0IChjb250ZXh0KSB7XG4gICAgaWYgKGlzQ29weShjb250ZXh0Lml0ZW0sIGNvbnRleHQuc291cmNlKSkge1xuICAgICAgX2NvcHkgPSBjb250ZXh0Lml0ZW0uY2xvbmVOb2RlKHRydWUpO1xuICAgICAgZHJha2UuZW1pdCgnY2xvbmVkJywgX2NvcHksIGNvbnRleHQuaXRlbSwgJ2NvcHknKTtcbiAgICB9XG5cbiAgICBfc291cmNlID0gY29udGV4dC5zb3VyY2U7XG4gICAgX2l0ZW0gPSBjb250ZXh0Lml0ZW07XG4gICAgX2luaXRpYWxTaWJsaW5nID0gX2N1cnJlbnRTaWJsaW5nID0gbmV4dEVsKGNvbnRleHQuaXRlbSk7XG5cbiAgICBkcmFrZS5kcmFnZ2luZyA9IHRydWU7XG4gICAgZHJha2UuZW1pdCgnZHJhZycsIF9pdGVtLCBfc291cmNlKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIGludmFsaWRUYXJnZXQgKCkge1xuICAgIHJldHVybiBmYWxzZTtcbiAgfVxuXG4gIGZ1bmN0aW9uIGVuZCAoKSB7XG4gICAgaWYgKCFkcmFrZS5kcmFnZ2luZykge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB2YXIgaXRlbSA9IF9jb3B5IHx8IF9pdGVtO1xuICAgIGRyb3AoaXRlbSwgZ2V0UGFyZW50KGl0ZW0pKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIHVuZ3JhYiAoKSB7XG4gICAgX2dyYWJiZWQgPSBmYWxzZTtcbiAgICBldmVudHVhbE1vdmVtZW50cyh0cnVlKTtcbiAgICBtb3ZlbWVudHModHJ1ZSk7XG4gIH1cblxuICBmdW5jdGlvbiByZWxlYXNlIChlKSB7XG4gICAgdW5ncmFiKCk7XG5cbiAgICBpZiAoIWRyYWtlLmRyYWdnaW5nKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHZhciBpdGVtID0gX2NvcHkgfHwgX2l0ZW07XG4gICAgdmFyIGNsaWVudFggPSBnZXRDb29yZCgnY2xpZW50WCcsIGUpO1xuICAgIHZhciBjbGllbnRZID0gZ2V0Q29vcmQoJ2NsaWVudFknLCBlKTtcbiAgICB2YXIgZWxlbWVudEJlaGluZEN1cnNvciA9IGdldEVsZW1lbnRCZWhpbmRQb2ludChfbWlycm9yLCBjbGllbnRYLCBjbGllbnRZKTtcbiAgICB2YXIgZHJvcFRhcmdldCA9IGZpbmREcm9wVGFyZ2V0KGVsZW1lbnRCZWhpbmRDdXJzb3IsIGNsaWVudFgsIGNsaWVudFkpO1xuICAgIGlmIChkcm9wVGFyZ2V0ICYmICgoX2NvcHkgJiYgby5jb3B5U29ydFNvdXJjZSkgfHwgKCFfY29weSB8fCBkcm9wVGFyZ2V0ICE9PSBfc291cmNlKSkpIHtcbiAgICAgIGRyb3AoaXRlbSwgZHJvcFRhcmdldCk7XG4gICAgfSBlbHNlIGlmIChvLnJlbW92ZU9uU3BpbGwpIHtcbiAgICAgIHJlbW92ZSgpO1xuICAgIH0gZWxzZSB7XG4gICAgICBjYW5jZWwoKTtcbiAgICB9XG4gIH1cblxuICBmdW5jdGlvbiBkcm9wIChpdGVtLCB0YXJnZXQpIHtcbiAgICB2YXIgcGFyZW50ID0gZ2V0UGFyZW50KGl0ZW0pO1xuICAgIGlmIChfY29weSAmJiBvLmNvcHlTb3J0U291cmNlICYmIHRhcmdldCA9PT0gX3NvdXJjZSkge1xuICAgICAgcGFyZW50LnJlbW92ZUNoaWxkKF9pdGVtKTtcbiAgICB9XG4gICAgaWYgKGlzSW5pdGlhbFBsYWNlbWVudCh0YXJnZXQpKSB7XG4gICAgICBkcmFrZS5lbWl0KCdjYW5jZWwnLCBpdGVtLCBfc291cmNlLCBfc291cmNlKTtcbiAgICB9IGVsc2Uge1xuICAgICAgZHJha2UuZW1pdCgnZHJvcCcsIGl0ZW0sIHRhcmdldCwgX3NvdXJjZSwgX2N1cnJlbnRTaWJsaW5nKTtcbiAgICB9XG4gICAgY2xlYW51cCgpO1xuICB9XG5cbiAgZnVuY3Rpb24gcmVtb3ZlICgpIHtcbiAgICBpZiAoIWRyYWtlLmRyYWdnaW5nKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIHZhciBpdGVtID0gX2NvcHkgfHwgX2l0ZW07XG4gICAgdmFyIHBhcmVudCA9IGdldFBhcmVudChpdGVtKTtcbiAgICBpZiAocGFyZW50KSB7XG4gICAgICBwYXJlbnQucmVtb3ZlQ2hpbGQoaXRlbSk7XG4gICAgfVxuICAgIGRyYWtlLmVtaXQoX2NvcHkgPyAnY2FuY2VsJyA6ICdyZW1vdmUnLCBpdGVtLCBwYXJlbnQsIF9zb3VyY2UpO1xuICAgIGNsZWFudXAoKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIGNhbmNlbCAocmV2ZXJ0KSB7XG4gICAgaWYgKCFkcmFrZS5kcmFnZ2luZykge1xuICAgICAgcmV0dXJuO1xuICAgIH1cbiAgICB2YXIgcmV2ZXJ0cyA9IGFyZ3VtZW50cy5sZW5ndGggPiAwID8gcmV2ZXJ0IDogby5yZXZlcnRPblNwaWxsO1xuICAgIHZhciBpdGVtID0gX2NvcHkgfHwgX2l0ZW07XG4gICAgdmFyIHBhcmVudCA9IGdldFBhcmVudChpdGVtKTtcbiAgICB2YXIgaW5pdGlhbCA9IGlzSW5pdGlhbFBsYWNlbWVudChwYXJlbnQpO1xuICAgIGlmIChpbml0aWFsID09PSBmYWxzZSAmJiByZXZlcnRzKSB7XG4gICAgICBpZiAoX2NvcHkpIHtcbiAgICAgICAgaWYgKHBhcmVudCkge1xuICAgICAgICAgIHBhcmVudC5yZW1vdmVDaGlsZChfY29weSk7XG4gICAgICAgIH1cbiAgICAgIH0gZWxzZSB7XG4gICAgICAgIF9zb3VyY2UuaW5zZXJ0QmVmb3JlKGl0ZW0sIF9pbml0aWFsU2libGluZyk7XG4gICAgICB9XG4gICAgfVxuICAgIGlmIChpbml0aWFsIHx8IHJldmVydHMpIHtcbiAgICAgIGRyYWtlLmVtaXQoJ2NhbmNlbCcsIGl0ZW0sIF9zb3VyY2UsIF9zb3VyY2UpO1xuICAgIH0gZWxzZSB7XG4gICAgICBkcmFrZS5lbWl0KCdkcm9wJywgaXRlbSwgcGFyZW50LCBfc291cmNlLCBfY3VycmVudFNpYmxpbmcpO1xuICAgIH1cbiAgICBjbGVhbnVwKCk7XG4gIH1cblxuICBmdW5jdGlvbiBjbGVhbnVwICgpIHtcbiAgICB2YXIgaXRlbSA9IF9jb3B5IHx8IF9pdGVtO1xuICAgIHVuZ3JhYigpO1xuICAgIHJlbW92ZU1pcnJvckltYWdlKCk7XG4gICAgaWYgKGl0ZW0pIHtcbiAgICAgIGNsYXNzZXMucm0oaXRlbSwgJ2d1LXRyYW5zaXQnKTtcbiAgICB9XG4gICAgaWYgKF9yZW5kZXJUaW1lcikge1xuICAgICAgY2xlYXJUaW1lb3V0KF9yZW5kZXJUaW1lcik7XG4gICAgfVxuICAgIGRyYWtlLmRyYWdnaW5nID0gZmFsc2U7XG4gICAgaWYgKF9sYXN0RHJvcFRhcmdldCkge1xuICAgICAgZHJha2UuZW1pdCgnb3V0JywgaXRlbSwgX2xhc3REcm9wVGFyZ2V0LCBfc291cmNlKTtcbiAgICB9XG4gICAgZHJha2UuZW1pdCgnZHJhZ2VuZCcsIGl0ZW0pO1xuICAgIF9zb3VyY2UgPSBfaXRlbSA9IF9jb3B5ID0gX2luaXRpYWxTaWJsaW5nID0gX2N1cnJlbnRTaWJsaW5nID0gX3JlbmRlclRpbWVyID0gX2xhc3REcm9wVGFyZ2V0ID0gbnVsbDtcbiAgfVxuXG4gIGZ1bmN0aW9uIGlzSW5pdGlhbFBsYWNlbWVudCAodGFyZ2V0LCBzKSB7XG4gICAgdmFyIHNpYmxpbmc7XG4gICAgaWYgKHMgIT09IHZvaWQgMCkge1xuICAgICAgc2libGluZyA9IHM7XG4gICAgfSBlbHNlIGlmIChfbWlycm9yKSB7XG4gICAgICBzaWJsaW5nID0gX2N1cnJlbnRTaWJsaW5nO1xuICAgIH0gZWxzZSB7XG4gICAgICBzaWJsaW5nID0gbmV4dEVsKF9jb3B5IHx8IF9pdGVtKTtcbiAgICB9XG4gICAgcmV0dXJuIHRhcmdldCA9PT0gX3NvdXJjZSAmJiBzaWJsaW5nID09PSBfaW5pdGlhbFNpYmxpbmc7XG4gIH1cblxuICBmdW5jdGlvbiBmaW5kRHJvcFRhcmdldCAoZWxlbWVudEJlaGluZEN1cnNvciwgY2xpZW50WCwgY2xpZW50WSkge1xuICAgIHZhciB0YXJnZXQgPSBlbGVtZW50QmVoaW5kQ3Vyc29yO1xuICAgIHdoaWxlICh0YXJnZXQgJiYgIWFjY2VwdGVkKCkpIHtcbiAgICAgIHRhcmdldCA9IGdldFBhcmVudCh0YXJnZXQpO1xuICAgIH1cbiAgICByZXR1cm4gdGFyZ2V0O1xuXG4gICAgZnVuY3Rpb24gYWNjZXB0ZWQgKCkge1xuICAgICAgdmFyIGRyb3BwYWJsZSA9IGlzQ29udGFpbmVyKHRhcmdldCk7XG4gICAgICBpZiAoZHJvcHBhYmxlID09PSBmYWxzZSkge1xuICAgICAgICByZXR1cm4gZmFsc2U7XG4gICAgICB9XG5cbiAgICAgIHZhciBpbW1lZGlhdGUgPSBnZXRJbW1lZGlhdGVDaGlsZCh0YXJnZXQsIGVsZW1lbnRCZWhpbmRDdXJzb3IpO1xuICAgICAgdmFyIHJlZmVyZW5jZSA9IGdldFJlZmVyZW5jZSh0YXJnZXQsIGltbWVkaWF0ZSwgY2xpZW50WCwgY2xpZW50WSk7XG4gICAgICB2YXIgaW5pdGlhbCA9IGlzSW5pdGlhbFBsYWNlbWVudCh0YXJnZXQsIHJlZmVyZW5jZSk7XG4gICAgICBpZiAoaW5pdGlhbCkge1xuICAgICAgICByZXR1cm4gdHJ1ZTsgLy8gc2hvdWxkIGFsd2F5cyBiZSBhYmxlIHRvIGRyb3AgaXQgcmlnaHQgYmFjayB3aGVyZSBpdCB3YXNcbiAgICAgIH1cbiAgICAgIHJldHVybiBvLmFjY2VwdHMoX2l0ZW0sIHRhcmdldCwgX3NvdXJjZSwgcmVmZXJlbmNlKTtcbiAgICB9XG4gIH1cblxuICBmdW5jdGlvbiBkcmFnIChlKSB7XG4gICAgaWYgKCFfbWlycm9yKSB7XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGUucHJldmVudERlZmF1bHQoKTtcblxuICAgIHZhciBjbGllbnRYID0gZ2V0Q29vcmQoJ2NsaWVudFgnLCBlKTtcbiAgICB2YXIgY2xpZW50WSA9IGdldENvb3JkKCdjbGllbnRZJywgZSk7XG4gICAgdmFyIHggPSBjbGllbnRYIC0gX29mZnNldFg7XG4gICAgdmFyIHkgPSBjbGllbnRZIC0gX29mZnNldFk7XG5cbiAgICBfbWlycm9yLnN0eWxlLmxlZnQgPSB4ICsgJ3B4JztcbiAgICBfbWlycm9yLnN0eWxlLnRvcCA9IHkgKyAncHgnO1xuXG4gICAgdmFyIGl0ZW0gPSBfY29weSB8fCBfaXRlbTtcbiAgICB2YXIgZWxlbWVudEJlaGluZEN1cnNvciA9IGdldEVsZW1lbnRCZWhpbmRQb2ludChfbWlycm9yLCBjbGllbnRYLCBjbGllbnRZKTtcbiAgICB2YXIgZHJvcFRhcmdldCA9IGZpbmREcm9wVGFyZ2V0KGVsZW1lbnRCZWhpbmRDdXJzb3IsIGNsaWVudFgsIGNsaWVudFkpO1xuICAgIHZhciBjaGFuZ2VkID0gZHJvcFRhcmdldCAhPT0gbnVsbCAmJiBkcm9wVGFyZ2V0ICE9PSBfbGFzdERyb3BUYXJnZXQ7XG4gICAgaWYgKGNoYW5nZWQgfHwgZHJvcFRhcmdldCA9PT0gbnVsbCkge1xuICAgICAgb3V0KCk7XG4gICAgICBfbGFzdERyb3BUYXJnZXQgPSBkcm9wVGFyZ2V0O1xuICAgICAgb3ZlcigpO1xuICAgIH1cbiAgICB2YXIgcGFyZW50ID0gZ2V0UGFyZW50KGl0ZW0pO1xuICAgIGlmIChkcm9wVGFyZ2V0ID09PSBfc291cmNlICYmIF9jb3B5ICYmICFvLmNvcHlTb3J0U291cmNlKSB7XG4gICAgICBpZiAocGFyZW50KSB7XG4gICAgICAgIHBhcmVudC5yZW1vdmVDaGlsZChpdGVtKTtcbiAgICAgIH1cbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdmFyIHJlZmVyZW5jZTtcbiAgICB2YXIgaW1tZWRpYXRlID0gZ2V0SW1tZWRpYXRlQ2hpbGQoZHJvcFRhcmdldCwgZWxlbWVudEJlaGluZEN1cnNvcik7XG4gICAgaWYgKGltbWVkaWF0ZSAhPT0gbnVsbCkge1xuICAgICAgcmVmZXJlbmNlID0gZ2V0UmVmZXJlbmNlKGRyb3BUYXJnZXQsIGltbWVkaWF0ZSwgY2xpZW50WCwgY2xpZW50WSk7XG4gICAgfSBlbHNlIGlmIChvLnJldmVydE9uU3BpbGwgPT09IHRydWUgJiYgIV9jb3B5KSB7XG4gICAgICByZWZlcmVuY2UgPSBfaW5pdGlhbFNpYmxpbmc7XG4gICAgICBkcm9wVGFyZ2V0ID0gX3NvdXJjZTtcbiAgICB9IGVsc2Uge1xuICAgICAgaWYgKF9jb3B5ICYmIHBhcmVudCkge1xuICAgICAgICBwYXJlbnQucmVtb3ZlQ2hpbGQoaXRlbSk7XG4gICAgICB9XG4gICAgICByZXR1cm47XG4gICAgfVxuICAgIGlmIChcbiAgICAgIChyZWZlcmVuY2UgPT09IG51bGwgJiYgY2hhbmdlZCkgfHxcbiAgICAgIHJlZmVyZW5jZSAhPT0gaXRlbSAmJlxuICAgICAgcmVmZXJlbmNlICE9PSBuZXh0RWwoaXRlbSlcbiAgICApIHtcbiAgICAgIF9jdXJyZW50U2libGluZyA9IHJlZmVyZW5jZTtcbiAgICAgIGRyb3BUYXJnZXQuaW5zZXJ0QmVmb3JlKGl0ZW0sIHJlZmVyZW5jZSk7XG4gICAgICBkcmFrZS5lbWl0KCdzaGFkb3cnLCBpdGVtLCBkcm9wVGFyZ2V0LCBfc291cmNlKTtcbiAgICB9XG4gICAgZnVuY3Rpb24gbW92ZWQgKHR5cGUpIHsgZHJha2UuZW1pdCh0eXBlLCBpdGVtLCBfbGFzdERyb3BUYXJnZXQsIF9zb3VyY2UpOyB9XG4gICAgZnVuY3Rpb24gb3ZlciAoKSB7IGlmIChjaGFuZ2VkKSB7IG1vdmVkKCdvdmVyJyk7IH0gfVxuICAgIGZ1bmN0aW9uIG91dCAoKSB7IGlmIChfbGFzdERyb3BUYXJnZXQpIHsgbW92ZWQoJ291dCcpOyB9IH1cbiAgfVxuXG4gIGZ1bmN0aW9uIHNwaWxsT3ZlciAoZWwpIHtcbiAgICBjbGFzc2VzLnJtKGVsLCAnZ3UtaGlkZScpO1xuICB9XG5cbiAgZnVuY3Rpb24gc3BpbGxPdXQgKGVsKSB7XG4gICAgaWYgKGRyYWtlLmRyYWdnaW5nKSB7IGNsYXNzZXMuYWRkKGVsLCAnZ3UtaGlkZScpOyB9XG4gIH1cblxuICBmdW5jdGlvbiByZW5kZXJNaXJyb3JJbWFnZSAoKSB7XG4gICAgaWYgKF9taXJyb3IpIHtcbiAgICAgIHJldHVybjtcbiAgICB9XG4gICAgdmFyIHJlY3QgPSBfaXRlbS5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgICBfbWlycm9yID0gX2l0ZW0uY2xvbmVOb2RlKHRydWUpO1xuICAgIF9taXJyb3Iuc3R5bGUud2lkdGggPSBnZXRSZWN0V2lkdGgocmVjdCkgKyAncHgnO1xuICAgIF9taXJyb3Iuc3R5bGUuaGVpZ2h0ID0gZ2V0UmVjdEhlaWdodChyZWN0KSArICdweCc7XG4gICAgY2xhc3Nlcy5ybShfbWlycm9yLCAnZ3UtdHJhbnNpdCcpO1xuICAgIGNsYXNzZXMuYWRkKF9taXJyb3IsICdndS1taXJyb3InKTtcbiAgICBvLm1pcnJvckNvbnRhaW5lci5hcHBlbmRDaGlsZChfbWlycm9yKTtcbiAgICB0b3VjaHkoZG9jdW1lbnRFbGVtZW50LCAnYWRkJywgJ21vdXNlbW92ZScsIGRyYWcpO1xuICAgIGNsYXNzZXMuYWRkKG8ubWlycm9yQ29udGFpbmVyLCAnZ3UtdW5zZWxlY3RhYmxlJyk7XG4gICAgZHJha2UuZW1pdCgnY2xvbmVkJywgX21pcnJvciwgX2l0ZW0sICdtaXJyb3InKTtcbiAgfVxuXG4gIGZ1bmN0aW9uIHJlbW92ZU1pcnJvckltYWdlICgpIHtcbiAgICBpZiAoX21pcnJvcikge1xuICAgICAgY2xhc3Nlcy5ybShvLm1pcnJvckNvbnRhaW5lciwgJ2d1LXVuc2VsZWN0YWJsZScpO1xuICAgICAgdG91Y2h5KGRvY3VtZW50RWxlbWVudCwgJ3JlbW92ZScsICdtb3VzZW1vdmUnLCBkcmFnKTtcbiAgICAgIGdldFBhcmVudChfbWlycm9yKS5yZW1vdmVDaGlsZChfbWlycm9yKTtcbiAgICAgIF9taXJyb3IgPSBudWxsO1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIGdldEltbWVkaWF0ZUNoaWxkIChkcm9wVGFyZ2V0LCB0YXJnZXQpIHtcbiAgICB2YXIgaW1tZWRpYXRlID0gdGFyZ2V0O1xuICAgIHdoaWxlIChpbW1lZGlhdGUgIT09IGRyb3BUYXJnZXQgJiYgZ2V0UGFyZW50KGltbWVkaWF0ZSkgIT09IGRyb3BUYXJnZXQpIHtcbiAgICAgIGltbWVkaWF0ZSA9IGdldFBhcmVudChpbW1lZGlhdGUpO1xuICAgIH1cbiAgICBpZiAoaW1tZWRpYXRlID09PSBkb2N1bWVudEVsZW1lbnQpIHtcbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cbiAgICByZXR1cm4gaW1tZWRpYXRlO1xuICB9XG5cbiAgZnVuY3Rpb24gZ2V0UmVmZXJlbmNlIChkcm9wVGFyZ2V0LCB0YXJnZXQsIHgsIHkpIHtcbiAgICB2YXIgaG9yaXpvbnRhbCA9IG8uZGlyZWN0aW9uID09PSAnaG9yaXpvbnRhbCc7XG4gICAgdmFyIHJlZmVyZW5jZSA9IHRhcmdldCAhPT0gZHJvcFRhcmdldCA/IGluc2lkZSgpIDogb3V0c2lkZSgpO1xuICAgIHJldHVybiByZWZlcmVuY2U7XG5cbiAgICBmdW5jdGlvbiBvdXRzaWRlICgpIHsgLy8gc2xvd2VyLCBidXQgYWJsZSB0byBmaWd1cmUgb3V0IGFueSBwb3NpdGlvblxuICAgICAgdmFyIGxlbiA9IGRyb3BUYXJnZXQuY2hpbGRyZW4ubGVuZ3RoO1xuICAgICAgdmFyIGk7XG4gICAgICB2YXIgZWw7XG4gICAgICB2YXIgcmVjdDtcbiAgICAgIGZvciAoaSA9IDA7IGkgPCBsZW47IGkrKykge1xuICAgICAgICBlbCA9IGRyb3BUYXJnZXQuY2hpbGRyZW5baV07XG4gICAgICAgIHJlY3QgPSBlbC5nZXRCb3VuZGluZ0NsaWVudFJlY3QoKTtcbiAgICAgICAgaWYgKGhvcml6b250YWwgJiYgKHJlY3QubGVmdCArIHJlY3Qud2lkdGggLyAyKSA+IHgpIHsgcmV0dXJuIGVsOyB9XG4gICAgICAgIGlmICghaG9yaXpvbnRhbCAmJiAocmVjdC50b3AgKyByZWN0LmhlaWdodCAvIDIpID4geSkgeyByZXR1cm4gZWw7IH1cbiAgICAgIH1cbiAgICAgIHJldHVybiBudWxsO1xuICAgIH1cblxuICAgIGZ1bmN0aW9uIGluc2lkZSAoKSB7IC8vIGZhc3RlciwgYnV0IG9ubHkgYXZhaWxhYmxlIGlmIGRyb3BwZWQgaW5zaWRlIGEgY2hpbGQgZWxlbWVudFxuICAgICAgdmFyIHJlY3QgPSB0YXJnZXQuZ2V0Qm91bmRpbmdDbGllbnRSZWN0KCk7XG4gICAgICBpZiAoaG9yaXpvbnRhbCkge1xuICAgICAgICByZXR1cm4gcmVzb2x2ZSh4ID4gcmVjdC5sZWZ0ICsgZ2V0UmVjdFdpZHRoKHJlY3QpIC8gMik7XG4gICAgICB9XG4gICAgICByZXR1cm4gcmVzb2x2ZSh5ID4gcmVjdC50b3AgKyBnZXRSZWN0SGVpZ2h0KHJlY3QpIC8gMik7XG4gICAgfVxuXG4gICAgZnVuY3Rpb24gcmVzb2x2ZSAoYWZ0ZXIpIHtcbiAgICAgIHJldHVybiBhZnRlciA/IG5leHRFbCh0YXJnZXQpIDogdGFyZ2V0O1xuICAgIH1cbiAgfVxuXG4gIGZ1bmN0aW9uIGlzQ29weSAoaXRlbSwgY29udGFpbmVyKSB7XG4gICAgcmV0dXJuIHR5cGVvZiBvLmNvcHkgPT09ICdib29sZWFuJyA/IG8uY29weSA6IG8uY29weShpdGVtLCBjb250YWluZXIpO1xuICB9XG59XG5cbmZ1bmN0aW9uIHRvdWNoeSAoZWwsIG9wLCB0eXBlLCBmbikge1xuICB2YXIgdG91Y2ggPSB7XG4gICAgbW91c2V1cDogJ3RvdWNoZW5kJyxcbiAgICBtb3VzZWRvd246ICd0b3VjaHN0YXJ0JyxcbiAgICBtb3VzZW1vdmU6ICd0b3VjaG1vdmUnXG4gIH07XG4gIHZhciBwb2ludGVycyA9IHtcbiAgICBtb3VzZXVwOiAncG9pbnRlcnVwJyxcbiAgICBtb3VzZWRvd246ICdwb2ludGVyZG93bicsXG4gICAgbW91c2Vtb3ZlOiAncG9pbnRlcm1vdmUnXG4gIH07XG4gIHZhciBtaWNyb3NvZnQgPSB7XG4gICAgbW91c2V1cDogJ01TUG9pbnRlclVwJyxcbiAgICBtb3VzZWRvd246ICdNU1BvaW50ZXJEb3duJyxcbiAgICBtb3VzZW1vdmU6ICdNU1BvaW50ZXJNb3ZlJ1xuICB9O1xuICBpZiAoZ2xvYmFsLm5hdmlnYXRvci5wb2ludGVyRW5hYmxlZCkge1xuICAgIGNyb3NzdmVudFtvcF0oZWwsIHBvaW50ZXJzW3R5cGVdLCBmbik7XG4gIH0gZWxzZSBpZiAoZ2xvYmFsLm5hdmlnYXRvci5tc1BvaW50ZXJFbmFibGVkKSB7XG4gICAgY3Jvc3N2ZW50W29wXShlbCwgbWljcm9zb2Z0W3R5cGVdLCBmbik7XG4gIH0gZWxzZSB7XG4gICAgY3Jvc3N2ZW50W29wXShlbCwgdG91Y2hbdHlwZV0sIGZuKTtcbiAgICBjcm9zc3ZlbnRbb3BdKGVsLCB0eXBlLCBmbik7XG4gIH1cbn1cblxuZnVuY3Rpb24gd2hpY2hNb3VzZUJ1dHRvbiAoZSkge1xuICBpZiAoZS50b3VjaGVzICE9PSB2b2lkIDApIHsgcmV0dXJuIGUudG91Y2hlcy5sZW5ndGg7IH1cbiAgaWYgKGUud2hpY2ggIT09IHZvaWQgMCAmJiBlLndoaWNoICE9PSAwKSB7IHJldHVybiBlLndoaWNoOyB9IC8vIHNlZSBodHRwczovL2dpdGh1Yi5jb20vYmV2YWNxdWEvZHJhZ3VsYS9pc3N1ZXMvMjYxXG4gIGlmIChlLmJ1dHRvbnMgIT09IHZvaWQgMCkgeyByZXR1cm4gZS5idXR0b25zOyB9XG4gIHZhciBidXR0b24gPSBlLmJ1dHRvbjtcbiAgaWYgKGJ1dHRvbiAhPT0gdm9pZCAwKSB7IC8vIHNlZSBodHRwczovL2dpdGh1Yi5jb20vanF1ZXJ5L2pxdWVyeS9ibG9iLzk5ZThmZjFiYWE3YWUzNDFlOTRiYjg5YzNlODQ1NzBjN2MzYWQ5ZWEvc3JjL2V2ZW50LmpzI0w1NzMtTDU3NVxuICAgIHJldHVybiBidXR0b24gJiAxID8gMSA6IGJ1dHRvbiAmIDIgPyAzIDogKGJ1dHRvbiAmIDQgPyAyIDogMCk7XG4gIH1cbn1cblxuZnVuY3Rpb24gZ2V0T2Zmc2V0IChlbCkge1xuICB2YXIgcmVjdCA9IGVsLmdldEJvdW5kaW5nQ2xpZW50UmVjdCgpO1xuICByZXR1cm4ge1xuICAgIGxlZnQ6IHJlY3QubGVmdCArIGdldFNjcm9sbCgnc2Nyb2xsTGVmdCcsICdwYWdlWE9mZnNldCcpLFxuICAgIHRvcDogcmVjdC50b3AgKyBnZXRTY3JvbGwoJ3Njcm9sbFRvcCcsICdwYWdlWU9mZnNldCcpXG4gIH07XG59XG5cbmZ1bmN0aW9uIGdldFNjcm9sbCAoc2Nyb2xsUHJvcCwgb2Zmc2V0UHJvcCkge1xuICBpZiAodHlwZW9mIGdsb2JhbFtvZmZzZXRQcm9wXSAhPT0gJ3VuZGVmaW5lZCcpIHtcbiAgICByZXR1cm4gZ2xvYmFsW29mZnNldFByb3BdO1xuICB9XG4gIGlmIChkb2N1bWVudEVsZW1lbnQuY2xpZW50SGVpZ2h0KSB7XG4gICAgcmV0dXJuIGRvY3VtZW50RWxlbWVudFtzY3JvbGxQcm9wXTtcbiAgfVxuICByZXR1cm4gZG9jLmJvZHlbc2Nyb2xsUHJvcF07XG59XG5cbmZ1bmN0aW9uIGdldEVsZW1lbnRCZWhpbmRQb2ludCAocG9pbnQsIHgsIHkpIHtcbiAgdmFyIHAgPSBwb2ludCB8fCB7fTtcbiAgdmFyIHN0YXRlID0gcC5jbGFzc05hbWU7XG4gIHZhciBlbDtcbiAgcC5jbGFzc05hbWUgKz0gJyBndS1oaWRlJztcbiAgZWwgPSBkb2MuZWxlbWVudEZyb21Qb2ludCh4LCB5KTtcbiAgcC5jbGFzc05hbWUgPSBzdGF0ZTtcbiAgcmV0dXJuIGVsO1xufVxuXG5mdW5jdGlvbiBuZXZlciAoKSB7IHJldHVybiBmYWxzZTsgfVxuZnVuY3Rpb24gYWx3YXlzICgpIHsgcmV0dXJuIHRydWU7IH1cbmZ1bmN0aW9uIGdldFJlY3RXaWR0aCAocmVjdCkgeyByZXR1cm4gcmVjdC53aWR0aCB8fCAocmVjdC5yaWdodCAtIHJlY3QubGVmdCk7IH1cbmZ1bmN0aW9uIGdldFJlY3RIZWlnaHQgKHJlY3QpIHsgcmV0dXJuIHJlY3QuaGVpZ2h0IHx8IChyZWN0LmJvdHRvbSAtIHJlY3QudG9wKTsgfVxuZnVuY3Rpb24gZ2V0UGFyZW50IChlbCkgeyByZXR1cm4gZWwucGFyZW50Tm9kZSA9PT0gZG9jID8gbnVsbCA6IGVsLnBhcmVudE5vZGU7IH1cbmZ1bmN0aW9uIGlzSW5wdXQgKGVsKSB7IHJldHVybiBlbC50YWdOYW1lID09PSAnSU5QVVQnIHx8IGVsLnRhZ05hbWUgPT09ICdURVhUQVJFQScgfHwgZWwudGFnTmFtZSA9PT0gJ1NFTEVDVCcgfHwgaXNFZGl0YWJsZShlbCk7IH1cbmZ1bmN0aW9uIGlzRWRpdGFibGUgKGVsKSB7XG4gIGlmICghZWwpIHsgcmV0dXJuIGZhbHNlOyB9IC8vIG5vIHBhcmVudHMgd2VyZSBlZGl0YWJsZVxuICBpZiAoZWwuY29udGVudEVkaXRhYmxlID09PSAnZmFsc2UnKSB7IHJldHVybiBmYWxzZTsgfSAvLyBzdG9wIHRoZSBsb29rdXBcbiAgaWYgKGVsLmNvbnRlbnRFZGl0YWJsZSA9PT0gJ3RydWUnKSB7IHJldHVybiB0cnVlOyB9IC8vIGZvdW5kIGEgY29udGVudEVkaXRhYmxlIGVsZW1lbnQgaW4gdGhlIGNoYWluXG4gIHJldHVybiBpc0VkaXRhYmxlKGdldFBhcmVudChlbCkpOyAvLyBjb250ZW50RWRpdGFibGUgaXMgc2V0IHRvICdpbmhlcml0J1xufVxuXG5mdW5jdGlvbiBuZXh0RWwgKGVsKSB7XG4gIHJldHVybiBlbC5uZXh0RWxlbWVudFNpYmxpbmcgfHwgbWFudWFsbHkoKTtcbiAgZnVuY3Rpb24gbWFudWFsbHkgKCkge1xuICAgIHZhciBzaWJsaW5nID0gZWw7XG4gICAgZG8ge1xuICAgICAgc2libGluZyA9IHNpYmxpbmcubmV4dFNpYmxpbmc7XG4gICAgfSB3aGlsZSAoc2libGluZyAmJiBzaWJsaW5nLm5vZGVUeXBlICE9PSAxKTtcbiAgICByZXR1cm4gc2libGluZztcbiAgfVxufVxuXG5mdW5jdGlvbiBnZXRFdmVudEhvc3QgKGUpIHtcbiAgLy8gb24gdG91Y2hlbmQgZXZlbnQsIHdlIGhhdmUgdG8gdXNlIGBlLmNoYW5nZWRUb3VjaGVzYFxuICAvLyBzZWUgaHR0cDovL3N0YWNrb3ZlcmZsb3cuY29tL3F1ZXN0aW9ucy83MTkyNTYzL3RvdWNoZW5kLWV2ZW50LXByb3BlcnRpZXNcbiAgLy8gc2VlIGh0dHBzOi8vZ2l0aHViLmNvbS9iZXZhY3F1YS9kcmFndWxhL2lzc3Vlcy8zNFxuICBpZiAoZS50YXJnZXRUb3VjaGVzICYmIGUudGFyZ2V0VG91Y2hlcy5sZW5ndGgpIHtcbiAgICByZXR1cm4gZS50YXJnZXRUb3VjaGVzWzBdO1xuICB9XG4gIGlmIChlLmNoYW5nZWRUb3VjaGVzICYmIGUuY2hhbmdlZFRvdWNoZXMubGVuZ3RoKSB7XG4gICAgcmV0dXJuIGUuY2hhbmdlZFRvdWNoZXNbMF07XG4gIH1cbiAgcmV0dXJuIGU7XG59XG5cbmZ1bmN0aW9uIGdldENvb3JkIChjb29yZCwgZSkge1xuICB2YXIgaG9zdCA9IGdldEV2ZW50SG9zdChlKTtcbiAgdmFyIG1pc3NNYXAgPSB7XG4gICAgcGFnZVg6ICdjbGllbnRYJywgLy8gSUU4XG4gICAgcGFnZVk6ICdjbGllbnRZJyAvLyBJRThcbiAgfTtcbiAgaWYgKGNvb3JkIGluIG1pc3NNYXAgJiYgIShjb29yZCBpbiBob3N0KSAmJiBtaXNzTWFwW2Nvb3JkXSBpbiBob3N0KSB7XG4gICAgY29vcmQgPSBtaXNzTWFwW2Nvb3JkXTtcbiAgfVxuICByZXR1cm4gaG9zdFtjb29yZF07XG59XG5cbm1vZHVsZS5leHBvcnRzID0gZHJhZ3VsYTtcbiIsIm1vZHVsZS5leHBvcnRzID0gZnVuY3Rpb24gYXRvYSAoYSwgbikgeyByZXR1cm4gQXJyYXkucHJvdG90eXBlLnNsaWNlLmNhbGwoYSwgbik7IH1cbiIsIid1c2Ugc3RyaWN0JztcblxudmFyIHRpY2t5ID0gcmVxdWlyZSgndGlja3knKTtcblxubW9kdWxlLmV4cG9ydHMgPSBmdW5jdGlvbiBkZWJvdW5jZSAoZm4sIGFyZ3MsIGN0eCkge1xuICBpZiAoIWZuKSB7IHJldHVybjsgfVxuICB0aWNreShmdW5jdGlvbiBydW4gKCkge1xuICAgIGZuLmFwcGx5KGN0eCB8fCBudWxsLCBhcmdzIHx8IFtdKTtcbiAgfSk7XG59O1xuIiwiJ3VzZSBzdHJpY3QnO1xuXG52YXIgYXRvYSA9IHJlcXVpcmUoJ2F0b2EnKTtcbnZhciBkZWJvdW5jZSA9IHJlcXVpcmUoJy4vZGVib3VuY2UnKTtcblxubW9kdWxlLmV4cG9ydHMgPSBmdW5jdGlvbiBlbWl0dGVyICh0aGluZywgb3B0aW9ucykge1xuICB2YXIgb3B0cyA9IG9wdGlvbnMgfHwge307XG4gIHZhciBldnQgPSB7fTtcbiAgaWYgKHRoaW5nID09PSB1bmRlZmluZWQpIHsgdGhpbmcgPSB7fTsgfVxuICB0aGluZy5vbiA9IGZ1bmN0aW9uICh0eXBlLCBmbikge1xuICAgIGlmICghZXZ0W3R5cGVdKSB7XG4gICAgICBldnRbdHlwZV0gPSBbZm5dO1xuICAgIH0gZWxzZSB7XG4gICAgICBldnRbdHlwZV0ucHVzaChmbik7XG4gICAgfVxuICAgIHJldHVybiB0aGluZztcbiAgfTtcbiAgdGhpbmcub25jZSA9IGZ1bmN0aW9uICh0eXBlLCBmbikge1xuICAgIGZuLl9vbmNlID0gdHJ1ZTsgLy8gdGhpbmcub2ZmKGZuKSBzdGlsbCB3b3JrcyFcbiAgICB0aGluZy5vbih0eXBlLCBmbik7XG4gICAgcmV0dXJuIHRoaW5nO1xuICB9O1xuICB0aGluZy5vZmYgPSBmdW5jdGlvbiAodHlwZSwgZm4pIHtcbiAgICB2YXIgYyA9IGFyZ3VtZW50cy5sZW5ndGg7XG4gICAgaWYgKGMgPT09IDEpIHtcbiAgICAgIGRlbGV0ZSBldnRbdHlwZV07XG4gICAgfSBlbHNlIGlmIChjID09PSAwKSB7XG4gICAgICBldnQgPSB7fTtcbiAgICB9IGVsc2Uge1xuICAgICAgdmFyIGV0ID0gZXZ0W3R5cGVdO1xuICAgICAgaWYgKCFldCkgeyByZXR1cm4gdGhpbmc7IH1cbiAgICAgIGV0LnNwbGljZShldC5pbmRleE9mKGZuKSwgMSk7XG4gICAgfVxuICAgIHJldHVybiB0aGluZztcbiAgfTtcbiAgdGhpbmcuZW1pdCA9IGZ1bmN0aW9uICgpIHtcbiAgICB2YXIgYXJncyA9IGF0b2EoYXJndW1lbnRzKTtcbiAgICByZXR1cm4gdGhpbmcuZW1pdHRlclNuYXBzaG90KGFyZ3Muc2hpZnQoKSkuYXBwbHkodGhpcywgYXJncyk7XG4gIH07XG4gIHRoaW5nLmVtaXR0ZXJTbmFwc2hvdCA9IGZ1bmN0aW9uICh0eXBlKSB7XG4gICAgdmFyIGV0ID0gKGV2dFt0eXBlXSB8fCBbXSkuc2xpY2UoMCk7XG4gICAgcmV0dXJuIGZ1bmN0aW9uICgpIHtcbiAgICAgIHZhciBhcmdzID0gYXRvYShhcmd1bWVudHMpO1xuICAgICAgdmFyIGN0eCA9IHRoaXMgfHwgdGhpbmc7XG4gICAgICBpZiAodHlwZSA9PT0gJ2Vycm9yJyAmJiBvcHRzLnRocm93cyAhPT0gZmFsc2UgJiYgIWV0Lmxlbmd0aCkgeyB0aHJvdyBhcmdzLmxlbmd0aCA9PT0gMSA/IGFyZ3NbMF0gOiBhcmdzOyB9XG4gICAgICBldC5mb3JFYWNoKGZ1bmN0aW9uIGVtaXR0ZXIgKGxpc3Rlbikge1xuICAgICAgICBpZiAob3B0cy5hc3luYykgeyBkZWJvdW5jZShsaXN0ZW4sIGFyZ3MsIGN0eCk7IH0gZWxzZSB7IGxpc3Rlbi5hcHBseShjdHgsIGFyZ3MpOyB9XG4gICAgICAgIGlmIChsaXN0ZW4uX29uY2UpIHsgdGhpbmcub2ZmKHR5cGUsIGxpc3Rlbik7IH1cbiAgICAgIH0pO1xuICAgICAgcmV0dXJuIHRoaW5nO1xuICAgIH07XG4gIH07XG4gIHJldHVybiB0aGluZztcbn07XG4iLCIndXNlIHN0cmljdCc7XG5cbnZhciBjdXN0b21FdmVudCA9IHJlcXVpcmUoJ2N1c3RvbS1ldmVudCcpO1xudmFyIGV2ZW50bWFwID0gcmVxdWlyZSgnLi9ldmVudG1hcCcpO1xudmFyIGRvYyA9IGdsb2JhbC5kb2N1bWVudDtcbnZhciBhZGRFdmVudCA9IGFkZEV2ZW50RWFzeTtcbnZhciByZW1vdmVFdmVudCA9IHJlbW92ZUV2ZW50RWFzeTtcbnZhciBoYXJkQ2FjaGUgPSBbXTtcblxuaWYgKCFnbG9iYWwuYWRkRXZlbnRMaXN0ZW5lcikge1xuICBhZGRFdmVudCA9IGFkZEV2ZW50SGFyZDtcbiAgcmVtb3ZlRXZlbnQgPSByZW1vdmVFdmVudEhhcmQ7XG59XG5cbm1vZHVsZS5leHBvcnRzID0ge1xuICBhZGQ6IGFkZEV2ZW50LFxuICByZW1vdmU6IHJlbW92ZUV2ZW50LFxuICBmYWJyaWNhdGU6IGZhYnJpY2F0ZUV2ZW50XG59O1xuXG5mdW5jdGlvbiBhZGRFdmVudEVhc3kgKGVsLCB0eXBlLCBmbiwgY2FwdHVyaW5nKSB7XG4gIHJldHVybiBlbC5hZGRFdmVudExpc3RlbmVyKHR5cGUsIGZuLCBjYXB0dXJpbmcpO1xufVxuXG5mdW5jdGlvbiBhZGRFdmVudEhhcmQgKGVsLCB0eXBlLCBmbikge1xuICByZXR1cm4gZWwuYXR0YWNoRXZlbnQoJ29uJyArIHR5cGUsIHdyYXAoZWwsIHR5cGUsIGZuKSk7XG59XG5cbmZ1bmN0aW9uIHJlbW92ZUV2ZW50RWFzeSAoZWwsIHR5cGUsIGZuLCBjYXB0dXJpbmcpIHtcbiAgcmV0dXJuIGVsLnJlbW92ZUV2ZW50TGlzdGVuZXIodHlwZSwgZm4sIGNhcHR1cmluZyk7XG59XG5cbmZ1bmN0aW9uIHJlbW92ZUV2ZW50SGFyZCAoZWwsIHR5cGUsIGZuKSB7XG4gIHZhciBsaXN0ZW5lciA9IHVud3JhcChlbCwgdHlwZSwgZm4pO1xuICBpZiAobGlzdGVuZXIpIHtcbiAgICByZXR1cm4gZWwuZGV0YWNoRXZlbnQoJ29uJyArIHR5cGUsIGxpc3RlbmVyKTtcbiAgfVxufVxuXG5mdW5jdGlvbiBmYWJyaWNhdGVFdmVudCAoZWwsIHR5cGUsIG1vZGVsKSB7XG4gIHZhciBlID0gZXZlbnRtYXAuaW5kZXhPZih0eXBlKSA9PT0gLTEgPyBtYWtlQ3VzdG9tRXZlbnQoKSA6IG1ha2VDbGFzc2ljRXZlbnQoKTtcbiAgaWYgKGVsLmRpc3BhdGNoRXZlbnQpIHtcbiAgICBlbC5kaXNwYXRjaEV2ZW50KGUpO1xuICB9IGVsc2Uge1xuICAgIGVsLmZpcmVFdmVudCgnb24nICsgdHlwZSwgZSk7XG4gIH1cbiAgZnVuY3Rpb24gbWFrZUNsYXNzaWNFdmVudCAoKSB7XG4gICAgdmFyIGU7XG4gICAgaWYgKGRvYy5jcmVhdGVFdmVudCkge1xuICAgICAgZSA9IGRvYy5jcmVhdGVFdmVudCgnRXZlbnQnKTtcbiAgICAgIGUuaW5pdEV2ZW50KHR5cGUsIHRydWUsIHRydWUpO1xuICAgIH0gZWxzZSBpZiAoZG9jLmNyZWF0ZUV2ZW50T2JqZWN0KSB7XG4gICAgICBlID0gZG9jLmNyZWF0ZUV2ZW50T2JqZWN0KCk7XG4gICAgfVxuICAgIHJldHVybiBlO1xuICB9XG4gIGZ1bmN0aW9uIG1ha2VDdXN0b21FdmVudCAoKSB7XG4gICAgcmV0dXJuIG5ldyBjdXN0b21FdmVudCh0eXBlLCB7IGRldGFpbDogbW9kZWwgfSk7XG4gIH1cbn1cblxuZnVuY3Rpb24gd3JhcHBlckZhY3RvcnkgKGVsLCB0eXBlLCBmbikge1xuICByZXR1cm4gZnVuY3Rpb24gd3JhcHBlciAob3JpZ2luYWxFdmVudCkge1xuICAgIHZhciBlID0gb3JpZ2luYWxFdmVudCB8fCBnbG9iYWwuZXZlbnQ7XG4gICAgZS50YXJnZXQgPSBlLnRhcmdldCB8fCBlLnNyY0VsZW1lbnQ7XG4gICAgZS5wcmV2ZW50RGVmYXVsdCA9IGUucHJldmVudERlZmF1bHQgfHwgZnVuY3Rpb24gcHJldmVudERlZmF1bHQgKCkgeyBlLnJldHVyblZhbHVlID0gZmFsc2U7IH07XG4gICAgZS5zdG9wUHJvcGFnYXRpb24gPSBlLnN0b3BQcm9wYWdhdGlvbiB8fCBmdW5jdGlvbiBzdG9wUHJvcGFnYXRpb24gKCkgeyBlLmNhbmNlbEJ1YmJsZSA9IHRydWU7IH07XG4gICAgZS53aGljaCA9IGUud2hpY2ggfHwgZS5rZXlDb2RlO1xuICAgIGZuLmNhbGwoZWwsIGUpO1xuICB9O1xufVxuXG5mdW5jdGlvbiB3cmFwIChlbCwgdHlwZSwgZm4pIHtcbiAgdmFyIHdyYXBwZXIgPSB1bndyYXAoZWwsIHR5cGUsIGZuKSB8fCB3cmFwcGVyRmFjdG9yeShlbCwgdHlwZSwgZm4pO1xuICBoYXJkQ2FjaGUucHVzaCh7XG4gICAgd3JhcHBlcjogd3JhcHBlcixcbiAgICBlbGVtZW50OiBlbCxcbiAgICB0eXBlOiB0eXBlLFxuICAgIGZuOiBmblxuICB9KTtcbiAgcmV0dXJuIHdyYXBwZXI7XG59XG5cbmZ1bmN0aW9uIHVud3JhcCAoZWwsIHR5cGUsIGZuKSB7XG4gIHZhciBpID0gZmluZChlbCwgdHlwZSwgZm4pO1xuICBpZiAoaSkge1xuICAgIHZhciB3cmFwcGVyID0gaGFyZENhY2hlW2ldLndyYXBwZXI7XG4gICAgaGFyZENhY2hlLnNwbGljZShpLCAxKTsgLy8gZnJlZSB1cCBhIHRhZCBvZiBtZW1vcnlcbiAgICByZXR1cm4gd3JhcHBlcjtcbiAgfVxufVxuXG5mdW5jdGlvbiBmaW5kIChlbCwgdHlwZSwgZm4pIHtcbiAgdmFyIGksIGl0ZW07XG4gIGZvciAoaSA9IDA7IGkgPCBoYXJkQ2FjaGUubGVuZ3RoOyBpKyspIHtcbiAgICBpdGVtID0gaGFyZENhY2hlW2ldO1xuICAgIGlmIChpdGVtLmVsZW1lbnQgPT09IGVsICYmIGl0ZW0udHlwZSA9PT0gdHlwZSAmJiBpdGVtLmZuID09PSBmbikge1xuICAgICAgcmV0dXJuIGk7XG4gICAgfVxuICB9XG59XG4iLCIndXNlIHN0cmljdCc7XG5cbnZhciBldmVudG1hcCA9IFtdO1xudmFyIGV2ZW50bmFtZSA9ICcnO1xudmFyIHJvbiA9IC9eb24vO1xuXG5mb3IgKGV2ZW50bmFtZSBpbiBnbG9iYWwpIHtcbiAgaWYgKHJvbi50ZXN0KGV2ZW50bmFtZSkpIHtcbiAgICBldmVudG1hcC5wdXNoKGV2ZW50bmFtZS5zbGljZSgyKSk7XG4gIH1cbn1cblxubW9kdWxlLmV4cG9ydHMgPSBldmVudG1hcDtcbiIsIlxudmFyIE5hdGl2ZUN1c3RvbUV2ZW50ID0gZ2xvYmFsLkN1c3RvbUV2ZW50O1xuXG5mdW5jdGlvbiB1c2VOYXRpdmUgKCkge1xuICB0cnkge1xuICAgIHZhciBwID0gbmV3IE5hdGl2ZUN1c3RvbUV2ZW50KCdjYXQnLCB7IGRldGFpbDogeyBmb286ICdiYXInIH0gfSk7XG4gICAgcmV0dXJuICAnY2F0JyA9PT0gcC50eXBlICYmICdiYXInID09PSBwLmRldGFpbC5mb287XG4gIH0gY2F0Y2ggKGUpIHtcbiAgfVxuICByZXR1cm4gZmFsc2U7XG59XG5cbi8qKlxuICogQ3Jvc3MtYnJvd3NlciBgQ3VzdG9tRXZlbnRgIGNvbnN0cnVjdG9yLlxuICpcbiAqIGh0dHBzOi8vZGV2ZWxvcGVyLm1vemlsbGEub3JnL2VuLVVTL2RvY3MvV2ViL0FQSS9DdXN0b21FdmVudC5DdXN0b21FdmVudFxuICpcbiAqIEBwdWJsaWNcbiAqL1xuXG5tb2R1bGUuZXhwb3J0cyA9IHVzZU5hdGl2ZSgpID8gTmF0aXZlQ3VzdG9tRXZlbnQgOlxuXG4vLyBJRSA+PSA5XG4nZnVuY3Rpb24nID09PSB0eXBlb2YgZG9jdW1lbnQuY3JlYXRlRXZlbnQgPyBmdW5jdGlvbiBDdXN0b21FdmVudCAodHlwZSwgcGFyYW1zKSB7XG4gIHZhciBlID0gZG9jdW1lbnQuY3JlYXRlRXZlbnQoJ0N1c3RvbUV2ZW50Jyk7XG4gIGlmIChwYXJhbXMpIHtcbiAgICBlLmluaXRDdXN0b21FdmVudCh0eXBlLCBwYXJhbXMuYnViYmxlcywgcGFyYW1zLmNhbmNlbGFibGUsIHBhcmFtcy5kZXRhaWwpO1xuICB9IGVsc2Uge1xuICAgIGUuaW5pdEN1c3RvbUV2ZW50KHR5cGUsIGZhbHNlLCBmYWxzZSwgdm9pZCAwKTtcbiAgfVxuICByZXR1cm4gZTtcbn0gOlxuXG4vLyBJRSA8PSA4XG5mdW5jdGlvbiBDdXN0b21FdmVudCAodHlwZSwgcGFyYW1zKSB7XG4gIHZhciBlID0gZG9jdW1lbnQuY3JlYXRlRXZlbnRPYmplY3QoKTtcbiAgZS50eXBlID0gdHlwZTtcbiAgaWYgKHBhcmFtcykge1xuICAgIGUuYnViYmxlcyA9IEJvb2xlYW4ocGFyYW1zLmJ1YmJsZXMpO1xuICAgIGUuY2FuY2VsYWJsZSA9IEJvb2xlYW4ocGFyYW1zLmNhbmNlbGFibGUpO1xuICAgIGUuZGV0YWlsID0gcGFyYW1zLmRldGFpbDtcbiAgfSBlbHNlIHtcbiAgICBlLmJ1YmJsZXMgPSBmYWxzZTtcbiAgICBlLmNhbmNlbGFibGUgPSBmYWxzZTtcbiAgICBlLmRldGFpbCA9IHZvaWQgMDtcbiAgfVxuICByZXR1cm4gZTtcbn1cbiIsInZhciBzaSA9IHR5cGVvZiBzZXRJbW1lZGlhdGUgPT09ICdmdW5jdGlvbicsIHRpY2s7XG5pZiAoc2kpIHtcbiAgdGljayA9IGZ1bmN0aW9uIChmbikgeyBzZXRJbW1lZGlhdGUoZm4pOyB9O1xufSBlbHNlIHtcbiAgdGljayA9IGZ1bmN0aW9uIChmbikgeyBzZXRUaW1lb3V0KGZuLCAwKTsgfTtcbn1cblxubW9kdWxlLmV4cG9ydHMgPSB0aWNrOyJdfQ==
+;
+!function(a){a.fn.datepicker.dates["zh-CN"]={days:["星期日","星期一","星期二","星期三","星期四","星期五","星期六"],daysShort:["周日","周一","周二","周三","周四","周五","周六"],daysMin:["日","一","二","三","四","五","六"],months:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],monthsShort:["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"],today:"今天",monthsTitle:"选择月份",clear:"清除",format:"yyyy-mm-dd",titleFormat:"yyyy年mm月",weekStart:1}}(jQuery);
+/**
+ * Simplified Chinese translation for bootstrap-datetimepicker
+ * Yuan Cheung <advanimal@gmail.com>
+ */
+
+;(function($){
+	$.fn.datetimepicker.dates['zh-CN'] = {
+			days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
+			daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
+			daysMin:  ["日", "一", "二", "三", "四", "五", "六", "日"],
+			months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
+			monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
+			today: "今天",
+			suffix: [],
+			meridiem: ["上午", "下午"]
+	};
+}(jQuery));
+(function( factory ) {
+  if ( typeof define === "function" && define.amd ) {
+    define( ["jquery", "../jquery.validate"], factory );
+  } else {
+    factory( jQuery );
+  }
+}(function( $ ) {
+
+  /*
+   * Translated default messages for the jQuery validation plugin.
+   * Locale: ZH (Chinese, 中文 (Zhōngwén), 汉语, 漢語)
+   */
+  $.extend($.validator.messages, {
+    required: "这是必填字段",
+    remote: "请修正此字段",
+    email: "请输入有效的电子邮件地址",
+    url: "请输入有效的网址",
+    date: "请输入有效的日期",
+    dateISO: "请输入有效的日期 (YYYY-MM-DD)",
+    number: "请输入有效的数字",
+    digits: "只能输入数字",
+    creditcard: "请输入有效的信用卡号码",
+    equalTo: "你的输入不相同",
+    extension: "请输入有效的后缀",
+    maxlength: $.validator.format("最多可以输入 {0} 个字符"),
+    minlength: $.validator.format("最少要输入 {0} 个字符"),
+    rangelength: $.validator.format("请输入长度在 {0} 到 {1} 之间的字符串"),
+    range: $.validator.format("请输入范围在 {0} 到 {1} 之间的数值"),
+    max: $.validator.format("请输入不大于 {0} 的数值"),
+    min: $.validator.format("请输入不小于 {0} 的数值")
+  });
+
+}));
+/*! Select2 4.0.8 | https://github.com/select2/select2/blob/master/LICENSE.md */
+
+
+!function(){if(jQuery&&jQuery.fn&&jQuery.fn.select2&&jQuery.fn.select2.amd)var n=jQuery.fn.select2.amd;n.define("select2/i18n/zh-CN",[],function(){return{errorLoading:function(){return"无法载入结果。"},inputTooLong:function(n){return"请删除"+(n.input.length-n.maximum)+"个字符"},inputTooShort:function(n){return"请再输入至少"+(n.minimum-n.input.length)+"个字符"},loadingMore:function(){return"载入更多结果…"},maximumSelected:function(n){return"最多只能选择"+n.maximum+"个项目"},noResults:function(){return"未找到结果"},searching:function(){return"搜索中…"},removeAllItems:function(){return"删除所有项目"}}}),n.define,n.require}();
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-abouts-edit-page, body.admins-abouts-update-page').length > 0) {
+    createMDEditor('about-us-editor', {});
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-agreements-edit-page, body.admins-agreements-update-page').length > 0) {
+    createMDEditor('agreement-editor', {});
+  }
+})
+;
+
+function show_add_manager(id) {
+  $(".auth-schools-user-add").modal("show");
+
+  $(".auth-schools-user-add").find("#school_id_input").val(id)
+}
+;
+$(document).on('turbolinks:load', function(){
+  $(document).on('click', '.batch-all-check-box', function(){
+    var $checkAll = $(this);
+
+    $('.batch-check-box').prop('checked', $checkAll.is(':checked'));
+  })
+
+  $(document).on('click', '.batch-check-box', function(){
+    var allChecked = $('.batch-check-box:checked').length === $('.batch-check-box').length
+    $('.batch-all-check-box').prop('checked', allChecked);
+  })
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-carousels-index-page').length > 0) {
+    var laboratoryId = $('#carousels-container').data('laboratoryId');
+    var resetNo = function(){
+      $('#carousels-container .custom-carousel-item-no').each(function(index, ele){
+        $(ele).html(index + 1);
+      })
+    }
+    // 删除后
+    $(document).on('delete_success', resetNo);
+
+    // ------------ 保存链接 -----------
+    $('.carousels-card').on('click', '.save-data-btn', function(){
+      var $link = $(this);
+      var id = $link.data('id');
+      var link = $('.custom-carousel-item-' + id).find('.link-input').val();
+      var name = $('.custom-carousel-item-' + id).find('.name-input').val();
+      if(!name || name.length == 0){
+        $.notify({ message: '名称不能为空' },{ type: 'danger' });
+        return;
+      }
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/laboratories/' + laboratoryId + '/carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { link: link, name: name },
+        success: function(data){
+          $.notify({ message: '操作成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+    // -------------- 是否在首页展示 --------------
+    $('.carousels-card').on('change', '.online-check-box', function(){
+      var $checkbox = $(this);
+      var id = $checkbox.data('id');
+      var checked = $checkbox.is(':checked');
+      $checkbox.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/laboratories/' + laboratoryId + '/carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { status: checked },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          var box = $('.custom-carousel-item-' + id).find('.drag');
+          if(checked){
+            box.removeClass('not_active');
+          }else{
+            box.addClass('not_active');
+          }
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $checkbox.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/laboratories/' + laboratoryId + '/carousels/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+          resetNo();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('carousels-container');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-carousel-modal');
+    var $createForm = $createModal.find('form.admin-add-carousel-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "portal_image[image]": {
+          required: true
+        },
+        "portal_image[name]": {
+          required: true
+        },
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $carouselItem = $('.custom-carousel-item-' + data.source_id);
+      $carouselItem.find('.custom-carousel-item-img img').attr('src', data.url);
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  var $refuseModal = $('.admin-common-refuse-modal');
+  if ($refuseModal.length > 0) {
+    var $form = $refuseModal.find('form.admin-common-refuse-form');
+    var $applyIdInput = $refuseModal.find('.modal-body input[name="apply_id"]');
+    var $applyTitle = $refuseModal.find('.modal-title');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        reason: {
+          required: true,
+          maxlength: 200
+        },
+      }
+    });
+
+    // modal ready fire
+    $refuseModal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var applyId = $link.data('id');
+      var url = $link.data('url');
+      var title = $link.data('title');
+      var type = $link.data('type');
+      var form_method = "POST";
+      if(typeof title !== 'undefined'){
+        $applyTitle.html(title)
+      }
+      if(typeof type !== 'undefined'){
+        form_method = type;
+      }
+
+      $applyIdInput.val(applyId);
+      $form.data('url', url);
+      $form.data('type', form_method);
+    });
+    // modal visited fire
+    $refuseModal.on('shown.bs.modal', function(){
+      $refuseModal.find('.modal-body textarea[name="reason"]').focus();
+    });
+    $refuseModal.on('hide.bs.modal', function () {
+      $applyIdInput.val('');
+      $refuseModal.find('.modal-body textarea[name="reason"]').val('');
+      $form.data('url', '');
+    })
+
+    $refuseModal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+        var form_method = $form.data('type');
+
+        $.ajax({
+          method: form_method,
+          dataType: 'script',
+          url: url,
+          data: $form.serialize(),
+        }).done(function(){
+          $refuseModal.modal('hide');
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function(){
+    if ($('body.admins-competition-settings-index-page').length > 0) {
+
+        var dateOptions = {
+            autoclose: true,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd',
+            startDate: '2017-04-01'
+        };
+
+        var timeOptions = {
+            autoclose: 1,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd hh:ii',
+            minuteStep: 30
+        };
+
+        var defineDateRangeSelect = function (element) {
+            var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, dateOptions);
+            $(element).datepicker(options);
+
+            $(element).find('.start-date').datepicker().on('changeDate', function (e) {
+                $(element).find('.end-date').datepicker('setStartDate', e.date);
+            });
+        };
+        $(".competition-start-end-date .start-date").datetimepicker(timeOptions);
+
+        $(".competition-start-end-date .end-date").datetimepicker(timeOptions);
+
+        $(".nav-setting-form .enroll_end_time").datetimepicker(timeOptions);
+
+        $(".stage-update-form .section-start-time").datetimepicker(timeOptions);
+        $(".stage-update-form .section-end-time").datetimepicker(timeOptions);
+
+        defineDateRangeSelect('.teaching-mode-date');
+        // defineTimeRangeSelect('.competition-start-end-date');
+
+        var $basicForm = $('form.basic-setting-form');
+
+        $basicForm.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: "required",
+                subTitle: "required",
+                startTime: "required",
+                endTime: "required",
+                mode: "required",
+                identifier: "required"
+            }
+        });
+
+        // 保存按钮
+        $basicForm.on('click', ".submit-btn", function () {
+            $basicForm.find('.submit-btn').attr('disabled', 'disabled');
+            $basicForm.find('.error').html('');
+            var valid = $basicForm.valid();
+
+            if ($("input[name='mode']:checked").val() == 2) {
+                var $courseId = $("input[name='course_id']");
+                if ($courseId.val() === undefined || $courseId.val().length === 0) {
+                    $courseId.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $courseId.removeClass('danger text-danger');
+                }
+            } else if ($("input[name='mode']:checked").val() == 3) {
+                var $techStartTime = $("input[name='teach_start_time']");
+                var $techEndTime = $("input[name='teach_end_time']");
+                if ($techStartTime.val() === undefined || $techStartTime.val().length === 0) {
+                    $techStartTime.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $techStartTime.removeClass('danger text-danger');
+                }
+
+                if ($techEndTime.val() === undefined || $techEndTime.val().length === 0) {
+                    $techEndTime.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $techEndTime.removeClass('danger text-danger');
+                }
+            } else {
+                $("input[name='course_id']").removeClass('danger text-danger');
+                $("input[name='teach_start_time']").removeClass('danger text-danger');
+                $("input[name='teach_end_time']").removeClass('danger text-danger');
+            }
+
+            if (!valid) return;
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: $basicForm.attr('action'),
+                data: new FormData($basicForm[0]),
+                processData: false,
+                contentType: false,
+                success: function (data) {
+                    $.notify({message: '保存成功'});
+                    // window.location.reload();
+                },
+                error: function (res) {
+                    var data = res.responseJSON;
+                    $basicForm.find('.error').html(data.message);
+                },
+                complete: function () {
+                    $basicForm.find('.submit-btn').attr('disabled', false);
+                }
+            });
+        });
+
+        var selectOptions = {
+            theme: 'bootstrap4',
+              placeholder: '请输入要添加的单位名称',
+              multiple: true,
+              minimumInputLength: 1,
+              ajax: {
+              delay: 500,
+                url: '/api/schools/search.json',
+                dataType: 'json',
+                data: function(params){
+                return { keyword: params.term };
+              },
+              processResults: function(data){
+                return { results: data.schools }
+              }
+            },
+            templateResult: function (item) {
+              if(!item.id || item.id === '') return item.text;
+              return item.name || item.text;
+            },
+            templateSelection: function(item){
+              return item.name || item.text;
+            }
+        };
+
+        $('.sponsor-select').select2(selectOptions);
+        $('.allow-school-select').select2(selectOptions);
+
+        $('.manager-select').select2({
+          theme: 'bootstrap4',
+          placeholder: '请输入要添加的管理员姓名',
+          multiple: true,
+          minimumInputLength: 1,
+          ajax: {
+            delay: 500,
+            url: '/admins/users',
+            dataType: 'json',
+            data: function(params){
+              return { keyword: params.term };
+            },
+            processResults: function(data){
+              return { results: data.users }
+            }
+          },
+          templateResult: function (item) {
+            if(!item.id || item.id === '') return item.text;
+						return $("<div class='row px-0'><span class='col-3'>" + item.real_name + "</span><span class='col-5 font-12'>" + item.school_name + "</span><span class='col-4 font-12'>" + item.hidden_phone + "</span></div>");
+          },
+          templateSelection: function(item){
+            if (item.id) {
+            }
+            return item.real_name || item.text;
+          }
+        });
+
+
+        // 排行榜
+        //链接
+        $(".nav-setting-form").on("click",".add_linkBtn",function () {
+            var length=$(".nav-setting-form").find(".linkFormItem").length + 1;
+            var html='<div class="row mt-2 align-items-center linkFormItem">\n' +
+                '          <div class="col-1 text-right">\n' +
+                '            <label class="checkbox checkbox-primary mt-1">\n' +
+                '              <input type="checkbox" name="navbar[][hidden]" value="0" hidden class="font-16" checked="checked">\n' +
+                '              <input type="checkbox" value="0" class="font-16 module_hidden" checked="checked">\n' +
+                '            </label>\n' +
+                '          </div>\n' +
+                '          <div class="col-md-label mt-1"><input type="hidden" value="md" name="navbar[][module_type]">\n' +
+                '          <input type="text" name="navbar[][name]" value="" class="form-control" placeholder="模块名称"></div>\n' +
+                '          <div class="col-md-1 mt-1"><input type="text" name="navbar[][position]" value="" class="form-control" placeholder="位置"></div>\n' +
+                '          <div class="col-md-3 mt-1"><input type="text" name="navbar[][url]" value="" class="form-control" placeholder="请输入资料下载地址"></div>\n' +
+                '          <a class="mt-1 btn btn-primary waves-effect waves-light btn-xs setBtn_s add_linkBtn" href="javascript:void(0)">+</a>\n' +
+                '          <a class="mt-1 btn btn-icon waves-effect btn-default waves-light setBtn_s ml10 del_linkBtn" href="javascript:void(0)">×</a>\n' +
+                '        </div>';
+            $(this).parents(".linkFormItem").after(html);
+        });
+
+        $(".nav-setting-form").on("click", ".del_linkBtn", function () {
+            $(this).parents(".linkFormItem").remove();
+        });
+
+        //有关报名要求
+        $(".addRequireBtn").on("click",function () {
+            var length=$("#requireForm").find(".requireForm_item").length + 1;
+            var html='<div class="row mt-2 mb-4 requireForm_item">\n' +
+                '          <div class="col-1 text-right">&nbsp;&nbsp;</div>\n' +
+                '          <div class="col-1 text-left mt-1">\n' +
+                '            <input type="text" class="form-control" name="competition_staffs[][minimum]" value="0">\n' +
+                '          </div>\n' +
+                '          <span class="mt-2">~</span>\n' +
+                '          <div class="col-1 mt-1">\n' +
+                '            <input type="text" class="form-control" name="competition_staffs[][maximum]" value="1">\n' +
+                '          </div>\n' +
+                '          <span class="mt-2">人</span>\n' +
+                '          <div class="col-2 mt-1">\n' +
+                '            <select class="form-control" name="competition_staffs[][category]">\n' +
+                '              <option value="student">学生</option>\n' +
+                '              <option value="teacher">教师</option>\n' +
+                '            </select>\n' +
+                '          </div>\n' +
+                '          <div class="col-2 mt-1">\n' +
+                '            <label class="radio checkbox-primary mt-1" value="require_'+length+'_1">\n' +
+                '              <input id="require_'+length+'_1" class="mutiple-limited-radio" value="false" checked name="competition_staffs[][mutiple_limited]" type="checkbox">\n' +
+                '              <label for="require_'+length+'_1">可多次报名</label>\n' +
+                '            </label>\n' +
+                '          </div>\n' +
+                '          <div class="col-2 mt-1">\n' +
+                '            <label class="radio checkbox-primary mt-1" value="require_'+length+'_2">\n' +
+                '              <input id="require_'+length+'_2" class="mutiple-limited-radio" value="true" name="competition_staffs[][mutiple_limited]" type="checkbox">\n' +
+                '              <label for="require_'+length+'_2">不可多次报名</label>\n' +
+                '            </label>\n' +
+                '            <a href="javascript:void(0)" class="ml20 delRequrieBtn">\n' +
+                '              <i class="fa fa-times-circle font-20 color-grey-c"></i>\n' +
+                '            </a>\n' +
+                '          </div>\n' +
+                '        </div>';
+            $("#requireForm").append(html);
+        });
+
+        $("#requireForm").on("click",".delRequrieBtn",function () {
+            $(this).parents(".requireForm_item").remove();
+        });
+
+        $('.nav-setting-form').on('click', '.module_hidden', function(){
+            var checkEle = $(this);
+            if (checkEle.is(':checked')) {
+                checkEle.prev().val(0);
+            } else {
+                checkEle.prev().val(1);
+            }
+        });
+
+        $('.competition-staff-settings').on('click', '.mutiple-limited-radio', function(){
+            var radio = $(this);
+            if (radio.is(':checked')) {
+                radio.parent().parent().siblings().find('.mutiple-limited-radio').attr('checked', false)
+            } else {
+                radio.parent().parent().siblings().find('.mutiple-limited-radio').attr('checked', true)
+            }
+        });
+
+        var $navForm = $('form.nav-setting-form');
+        $navForm.on('click', ".submit-btn", function () {
+            $navForm.find('.submit-btn').attr('disabled', 'disabled');
+            $navForm.find('.error').html('');
+            var valid = $navForm.valid();
+
+            if (!valid) return;
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: $navForm.attr('action'),
+                data: new FormData($navForm[0]),
+                processData: false,
+                contentType: false,
+                success: function (data) {
+                    $.notify({message: '保存成功'});
+                    // window.location.reload();
+                },
+                error: function (res) {
+                    var data = res.responseJSON;
+                    $navForm.find('.error').html(data.message);
+                },
+                complete: function () {
+                    $navForm.find('.submit-btn').attr('disabled', false);
+                }
+            });
+        });
+
+//    排行榜设置
+        //删除小阶段
+        $("#large_panel").on("click",".small_panel_item_del",function () {
+            var list = $(this).parents(".small_panel");
+            $(this).parents(".small_panel_item").remove();
+
+            for(var i=0;i < $(list).find(".subName").length;i++){
+                console.log(i);
+                $(list).find(".subName").eq(i).html("第"+parseInt(i+1)+"阶段");
+            }
+        });
+
+        // $('form.stage-update-form').validate({
+        //     errorElement: 'span',
+        //     errorClass: 'danger text-danger',
+        //     rules: {
+        //         stage_name: "required",
+        //         "stage[][start_time]": "required",
+        //         "stage[][end_time]": "required",
+        //         "stage[][mission_count]": {
+        //             required: true,
+        //             min: 1
+        //         },
+        //         "stage[][entry]": {
+        //             required: true,
+        //             min: 1
+        //         },
+        //         score_rate: {
+        //             required: true,
+        //             range: [0, 100]
+        //         }
+        //     },
+        //     messages: {
+        //         "stage[][mission_count]": {
+        //             min: ">=1"
+        //         },
+        //         "stage[][entry]": {
+        //             min: ">=1"
+        //         },
+        //     }
+        // });
+
+        $('.competition-chart-setting').on('click', ".update-stage", function () {
+            var updateForm = $(this).parents("form");
+            $(this).attr('disabled', 'disabled');
+            updateForm.find('.error').html('');
+            // var valid = updateForm.valid();
+            var valid = true;
+
+            var $stageName = updateForm.find('input[name="stage_name"]');
+            if($stageName.val() === undefined || $stageName.val().length === 0){
+                $stageName.addClass('danger text-danger');
+                valid = false;
+            } else {
+                $stageName.removeClass('danger text-danger');
+            }
+
+            var $scoreRate = updateForm.find('input[name="score_rate"]');
+            if($scoreRate.val() === undefined || $scoreRate.val().length === 0){
+                $scoreRate.addClass('danger text-danger');
+                valid = false;
+            } else if (parseInt($scoreRate.val()) > 100 || parseInt($scoreRate.val()) < 0) {
+                $scoreRate.addClass('danger text-danger');
+                $scoreRate.after('<span class="danger text-danger">0-100之间的数值</span>');
+                valid = false;
+            } else {
+                $scoreRate.removeClass('danger text-danger');
+                $scoreRate.siblings().remove();
+            }
+
+            updateForm.find('input[name="stage[][start_time]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                }
+            });
+
+            updateForm.find('input[name="stage[][end_time]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                }
+            });
+
+            updateForm.find('input[name="stage[][mission_count]"]').each(function(i, e){
+                var $ele = $(e);
+                var $entry = updateForm.find('input[name="stage[][entry]"]').eq(i);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else if (parseInt($ele.val()) < 1) {
+                    $ele.addClass('danger text-danger');
+                    $ele.after('<span class="danger text-danger">大于等于1</span>');
+                    valid = false;
+                } else if (parseInt($ele.val()) > parseInt($entry.val())) {
+                    $ele.addClass('danger text-danger');
+                    $ele.after('<span class="danger text-danger">不能大于总任务数</span>');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                    $ele.siblings().remove();
+                }
+            });
+
+            updateForm.find('input[name="stage[][entry]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else if (parseInt($ele.val()) < 1) {
+                    $ele.addClass('danger text-danger');
+                    $ele.after('<span class="danger text-danger">大于等于1</span>');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                    $ele.siblings().remove();
+                }
+            });
+
+            updateForm.find('input[name="stage[][identifiers][]"]').each(function(_, e){
+                var $ele = $(e);
+                if($ele.val() === undefined || $ele.val().length === 0){
+                    $ele.addClass('danger text-danger');
+                    valid = false;
+                } else {
+                    $ele.removeClass('danger text-danger');
+                }
+            });
+
+            if (!valid) return;
+
+            updateForm.find('input[name="stage[][mission_count]"]').each(function(_, e){
+                var $missionCount = $(e);
+                var $entryCount = $(e).parents("div.row").find('input[name="stage[][mission_count]"]');
+                if(parseInt($missionCount.val()) > parseInt($entryCount.val()) ){
+                    $missionCount.addClass('danger text-danger');
+                    $missionCount.after('<span class="danger text-danger">不能大于总任务数</span>');
+                    valid = false;
+                } else {
+                    $missionCount.removeClass('danger text-danger');
+                    $missionCount.siblings().remove();
+                }
+            });
+
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: updateForm.attr('action'),
+                data: new FormData(updateForm[0]),
+                processData: false,
+                contentType: false,
+                success: function (data) {
+                    $.notify({message: '保存成功'});
+                    window.location.reload();
+                },
+                error: function (res) {
+                    var data = res.responseJSON;
+                    $navForm.find('.error').html(data.message);
+                },
+                complete: function () {
+                    $navForm.find('.submit-btn').attr('disabled', false);
+                }
+            });
+        });
+
+        $(".competition-chart-stages").on("click", ".add-new-tab", function () {
+            if($(".new-stage-form").length > 0){
+                alert("请先保存上一个tab");
+            } else {
+                var count = parseInt($("#large_panel").find(".large_panel_part").length)+1;
+                var html = '<form class="stage-update-form new-stage-form flex-1" action="/admins/competitions/'+$(this).attr("data-competition-id")+'/competition_stages" accept-charset="UTF-8" data-remote="true" method="post">' +
+                    '<div class="large_panel_part" attr_line="'+count+'"><div class="row d-flex mt-3">\n' +
+                    '          <span class="col-1 mt-2">tab标题</span>\n' +
+                    '          <div class="col-2 no_padding">\n' +
+                    '            <input type="text" class="form-control" name="stage_name"/>\n' +
+                    '          </div>\n' +
+                    '          <span class="col-1 text-right mt-2 no_padding">总排行榜占比:</span>\n' +
+                    '          <div class="col-1 no_padding">\n' +
+                    '            <input type="number" class="form-control" name="score_rate" value="100"/>\n' +
+                    '          </div><span class=" mt-2">%</span>\n' +
+                    '          <div class="flex-1">\n' +
+                    '            <a href="javascript:void(0)"class="btn btn-outline-primary export-action ml20 add-task-sub">新增子阶段</a>\n' +
+                    '          </div>\n' +
+                    '          <a href="javascript:void(0)" class="btn btn-default ml20" onclick="Del_tab(this)">删除</a>\n' +
+                    '          <a href="javascript:void(0)" class="btn btn-outline-primary update-stage export-action ml20">保存</a>\n' +
+                    '        </div>\n' +
+                    '        <div id="small_panel_'+count+'" class="small_panel">\n' +
+                    '                <div class="row d-flex small_panel_item" attr_line="sub_new_new" count="1">\n' +
+                    '                  <span class="mt-2 subName mr10">第1阶段</span>\n' +
+                    '                  <div class="flex-1">\n' +
+                    '                    <div class="row">\n' +
+                    '                      <div class="row col-6"><span class="mt-2 ml20">有效时间:</span>\n' +
+                    '                      <div class="col-4 no_padding">\n' +
+                    '                        <input type="text" name="stage[][start_time]" id="stage__start_time" value="" autocomplete="off" class="section-start-time form-control" placeholder="有效开始时间">\n' +
+                    '                      </div>\n' +
+                    '                      <span class="mt-2">~</span>\n' +
+                    '                      <div class="col-4 no_padding ">\n' +
+                    '                        <input type="text" name="stage[][end_time]" id="stage__end_time" value="" autocomplete="off" class="section-end-time form-control" placeholder="有效结束时间">\n' +
+                    '                      </div></div>\n' +
+                    '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding">总任务数:</span>\n' +
+                    '                      <div class="col-6 no_padding ">\n' +
+                    '                        <input type="number" class="form-control" onchange="change_total(this)" value="3" name="stage[][entry]">\n' +
+                    '                      </div></div>\n' +
+                    '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding">成绩来源:</span>\n' +
+                    '                      <div class="col-6 no_padding ">\n' +
+                    '                        <select class="form-control" name="stage[][score_source]">\n' +
+                    '                          <option value="0">经验值</option>\n' +
+                    '                          <option value="1">预测准确率</option>\n' +
+                    '                        </select>\n' +
+                    '                      </div></div>\n' +
+                    '                    </div>\n' +
+                    '                    <div class="row mt-2" id="task_Input_sub_new_new">\n' +
+                    '                      <div class="col-4 row task_Input_div">\n' +
+                    '                        <span class="col-4 text-right mt-3 no_padding mr10">任务1</span>\n' +
+                    '                        <div class="col-6 no_padding">\n' +
+                    '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                    '                        </div>\n' +
+                    '                      </div>\n' +
+                    '                      <div class="col-4 row task_Input_div">\n' +
+                    '                        <span class="col-4 text-right mt-3 no_padding mr10">任务2</span>\n' +
+                    '                        <div class="col-6 no_padding">\n' +
+                    '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                    '                        </div>\n' +
+                    '                      </div>\n' +
+                    '                      <div class="col-4 row task_Input_div">\n' +
+                    '                        <span class="col-4 text-right mt-3 no_padding mr10">任务3</span>\n' +
+                    '                        <div class="col-6 no_padding">\n' +
+                    '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                    '                        </div>\n' +
+                    '                      </div>\n' +
+                    '                    </div>\n' +
+                    '                  </div>\n' +
+                    '                  <span>\n' +
+                    '              <a href="javascript:void(0)" class="btn btn-default ml20 small_panel_item_del">删除</a>\n' +
+                    '            </span>\n' +
+                    '                </div>\n' +
+                    '</div></div></form>';
+                $("#large_panel").append(html);
+
+                $(".stage-update-form .section-start-time").datetimepicker(timeOptions);
+                $(".stage-update-form .section-end-time").datetimepicker(timeOptions);
+            }
+        });
+
+        //新增子阶段
+        $(".competition-chart-stages").on("click", ".add-task-sub", function () {
+            var index = $(this).parents(".large_panel_part").attr("attr_line");
+            var count= 0;
+
+            console.log("sdfsf");
+            console.log($("#small_panel_"+index).find(".small_panel_item").length > 0);
+
+            if($("#small_panel_"+index).find(".small_panel_item").length > 0){
+                count = parseInt($("#small_panel_"+index).find(".small_panel_item").last().attr("count")) + 1;
+
+                console.log($("#small_panel_"+index).find(".small_panel_item").last().attr("count"));
+            }else{
+                count = 1;
+            }
+
+            var showCount=parseInt($("#small_panel_"+index).find(".small_panel_item").length) + 1;
+
+
+            var html='<div class="row d-flex small_panel_item" attr_line="sub_'+index+'_'+count+'" count="'+count+'">\n' +
+                '            <span class="mr10 mt-2 subName">第'+showCount+'阶段</span>\n' +
+                '            <div class="flex-1">\n' +
+                '                    <div class="row">\n' +
+                '                      <div class="row col-6"><span class="mt-2 ml20 mr10">有效时间:</span>\n' +
+                '                      <div class="col-4 no_padding ">\n' +
+                '                        <input type="text" name="stage[][start_time]" id="stage__start_time" value="" autocomplete="off" class="section-start-time form-control" placeholder="有效开始时间">\n' +
+                '                      </div>\n' +
+                '                      <span class="mt-2">~</span>\n' +
+                '                      <div class="col-4 no_padding ">\n' +
+                '                        <input type="text" name="stage[][end_time]" id="stage__end_time" value="" autocomplete="off" class="section-end-time form-control" placeholder="有效结束时间">\n' +
+                '                      </div></div>\n' +
+                '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding mr10">总任务数:</span>\n' +
+                '                      <div class="col-6 no_padding ">\n' +
+                '                        <input type="number" class="form-control" onchange="change_total(this)" value="3" name="stage[][entry]">\n' +
+                '                      </div></div>\n' +
+                '                      <div class="row col-3"><span class="col-4 mr10 text-right mt-2 no_padding">成绩来源:</span>\n' +
+                '                      <div class="col-6 no_padding ">\n' +
+                '                        <select class="form-control" name="stage[][score_source]">\n' +
+                '                          <option value="0">经验值</option>\n' +
+                '                          <option value="1">预测准确率</option>\n' +
+                '                        </select>\n' +
+                '                      </div></div>\n' +
+                '                    </div>\n' +
+                '              <div class="row mt-2" id="task_Input_sub_'+index+'_'+count+'">\n'+
+                '                      <div class="col-4 row task_Input_div">\n' +
+                '                        <span class="col-4 text-right mt-3 no_padding mr10">任务1</span>\n' +
+                '                        <div class="col-6 no_padding">\n' +
+                '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '                        </div>\n' +
+                '                      </div>\n' +
+                '                      <div class="col-4 row task_Input_div">\n' +
+                '                        <span class="col-4 text-right mt-3 no_padding mr10">任务2</span>\n' +
+                '                        <div class="col-6 no_padding">\n' +
+                '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '                        </div>\n' +
+                '                      </div>\n' +
+                '                      <div class="col-4 row task_Input_div">\n' +
+                '                        <span class="col-4 text-right mt-3 no_padding mr10">任务3</span>\n' +
+                '                        <div class="col-6 no_padding">\n' +
+                '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '                        </div>\n' +
+                '                      </div>\n' +
+                '            </div>\n' +
+                '            </div>\n' +
+                '            <span>\n' +
+                '              <a href="javascript:void(0)" class="btn btn-default ml20 small_panel_item_del">删除</a>\n' +
+                '            </span>\n' +
+                '          </div>';
+            $("#small_panel_"+index).append(html);
+
+            $(".stage-update-form .section-start-time").datetimepicker(timeOptions);
+            $(".stage-update-form .section-end-time").datetimepicker(timeOptions);
+        });
+
+        // 奖项设置
+        var $prizeContainer = $('#competition-prize-card');
+        var competitionId = $prizeContainer.data('id');
+        $(document).on('prize.save.success', function(){
+          $.ajax({
+            method: 'GET',
+            url: '/admins/competitions/' + competitionId + '/competition_prizes',
+            dataType: 'script'
+          })
+        });
+
+        $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+          var $imageElement;
+          if(data.suffix === '_member'){
+            $imageElement = $('.prize-member-image-' + data.source_id);
+          } else if(data.suffix === '_team'){
+            $imageElement = $('.prize-team-image-' + data.source_id);
+          } else {
+            $imageElement = $('.prize-teacher-image-' + data.source_id);
+          }
+          $imageElement.attr('src', data.url);
+          $imageElement.show();
+          $imageElement.next().html('重新上传');
+        })
+
+        // 生成获奖记录
+        $prizeContainer.on('click', '.generate-prize-user-action', function(){
+          var $link = $(this);
+
+          var generateRequest = function(){
+            return $.ajax({
+              method: 'POST',
+              url: '/admins/competitions/' + competitionId + '/competition_prize_users',
+              dataType: 'json',
+              success: function(data){
+                if(data && data.status === 0){
+                  show_success_flash();
+                  $link.remove();
+                } else {
+                  showErrorNotify(data.message);
+                }
+              },
+              error: function(res){
+                var data = res.responseJSON;
+                showErrorNotify(data.message);
+              }
+            })
+          }
+
+          customConfirm({
+            content: '确认生成吗？',
+            ok: function () {
+              customLoading({
+                ajax: generateRequest
+              })
+            }
+          })
+        });
+    } else {
+      $(document).unbind('prize.save.success');
+    }
+});
+
+//添加主办方或者开放范围
+function addSponsor(item){
+    var html='<div class="sponsor_label">\n' +
+        '              <input type="hidden" value="school_id" />\n' +
+        '              <span>caicai</span>\n' +
+        '              <a href="javascript:void(0)" onclick="del_sponsor(this)">×</a>\n' +
+        '            </div>';
+    $(item).parents(".sponsorPanel").append(html);
+}
+//删除
+function del_sponsor(item){
+    $(item).parents(".sponsor_label").remove();
+}
+
+//    小阶段修改总任务数
+function change_total(item) {
+    var count=parseInt($(item).val());
+
+
+    var index = $(item).parents(".small_panel_item").attr("attr_line");
+    var indexLarge = $(item).parents(".large_panel_part").attr("attr_line");
+    console.log(indexLarge);
+    console.log(index);
+
+    var divCount=parseInt($("#task_Input_"+index).find(".task_Input_div").length);
+
+
+    var html = "";
+    if(count > divCount){
+        for(var i=0;i < count-divCount ;i++){
+            html+='<div class="col-4 row task_Input_div"><span class="col-4 text-right mt-3 no_padding mr10">任务'+(divCount+i+1)+'</span>\n' +
+                '<div class="col-6 no_padding">\n' +
+                '<input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+                '</div>\n' +
+                '</div>';
+        }
+        $("#task_Input_"+index).append(html);
+    }else{
+        var delCount = divCount - count ;
+        console.log(divCount);
+        console.log(count);
+        var _max=parseInt($("#task_Input_"+index).find(".task_Input_div:last").index());
+
+        console.log(_max);
+        var _get= _max - delCount;
+
+        console.log(_get);
+        if(count == 0){
+            $("#task_Input_"+index).empty();
+        }else{
+            $("#task_Input_"+index).find(".task_Input_div:gt("+_get+")").remove();
+        }
+
+    }
+
+}
+
+//删除tab
+function  Del_tab(item) {
+    $(item).parents(".large_panel_part").remove();
+}
+//新增tab
+function addNewTab(competition_id) {
+    if($(".new-stage-form").length > 0){
+        alert("请先保存上一个tab");
+    } else {
+        var count = parseInt($("#large_panel").find(".large_panel_part").length)+1;
+        var html = '<form class="stage-update-form new-stage-form flex-1" action="/admins/competitions/'+competition_id+'/competition_stages" accept-charset="UTF-8" data-remote="true" method="post">' +
+            '<div class="large_panel_part" attr_line="'+count+'"><div class="row d-flex mt-3">\n' +
+            '          <span class="col-1 mt-2">tab标题</span>\n' +
+            '          <div class="col-2 no_padding">\n' +
+            '            <input type="text" class="form-control" name="stage_name"/>\n' +
+            '          </div>\n' +
+            '          <span class="col-1 text-right mt-2 no_padding">总排行榜占比:</span>\n' +
+            '          <div class="col-1 no_padding">\n' +
+            '            <input type="number" class="form-control" name="score_rate" value="100"/>\n' +
+            '          </div><span class=" mt-2">%</span>\n' +
+            '          <div class="flex-1">\n' +
+            '            <a href="javascript:void(0)"class="btn btn-outline-primary export-action ml20 add-task-sub">新增子阶段</a>\n' +
+            '          </div>\n' +
+            '          <a href="javascript:void(0)" class="btn btn-default ml20" onclick="Del_tab(this)">删除</a>\n' +
+            '          <a href="javascript:void(0)" class="btn btn-outline-primary update-stage export-action ml20">保存</a>\n' +
+            '        </div>\n' +
+            '        <div id="small_panel_'+count+'" class="small_panel">\n' +
+            '                <div class="row d-flex small_panel_item" attr_line="sub_new_new" count="1">\n' +
+            '                  <span class="mt-2 subName mr10">第1阶段</span>\n' +
+            '                  <div class="flex-1">\n' +
+            '                    <div class="row">\n' +
+            '                      <div class="row col-6"><span class="mt-2 ml20 mr10">有效时间:</span>\n' +
+            '                      <div class="col-4 no_padding ">\n' +
+            '                        <input type="text" name="stage[][start_time]" id="stage__start_time" value="" autocomplete="off" class="section-start-time form-control" placeholder="有效开始时间">\n' +
+            '                      </div>\n' +
+            '                      <span class="mt-2">~</span>\n' +
+            '                      <div class="col-4 no_padding input_middle">\n' +
+            '                        <input type="text" name="stage[][end_time]" id="stage__end_time" value="" autocomplete="off" class="section-end-time form-control" placeholder="有效结束时间">\n' +
+            '                      </div></div>\n' +
+            '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding mr10">总任务数:</span>\n' +
+            '                      <div class="col-6 no_padding ">\n' +
+            '                        <input type="number" class="form-control" onchange="change_total(this)" value="3" name="stage[][entry]">\n' +
+            '                      </div></div>\n' +
+            '                      <div class="row col-3"><span class="col-4 text-right mt-2 no_padding mr10">成绩来源:</span>\n' +
+            '                      <div class="col-6 no_padding ">\n' +
+            '                        <select class="form-control" name="stage[][score_source]">\n' +
+            '                          <option value="0">经验值</option>\n' +
+            '                          <option value="1">预测准确率</option>\n' +
+            '                        </select>\n' +
+            '                      </div></div>\n' +
+            '                    </div>\n' +
+            '                    <div class="row mt-2" id="task_Input_sub_new_new">\n' +
+            '                      <div class="col-4 row task_Input_div">\n' +
+            '                        <span class="col-3 text-right mt-3 no_padding mr10">任务1</span>\n' +
+            '                        <div class="col-8 no_padding">\n' +
+            '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+            '                        </div>\n' +
+            '                      </div>\n' +
+            '                      <div class="col-4 row task_Input_div">\n' +
+            '                        <span class="col-3 text-right mt-3 no_padding mr10">任务2</span>\n' +
+            '                        <div class="col-8 no_padding">\n' +
+            '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+            '                        </div>\n' +
+            '                      </div>\n' +
+            '                      <div class="col-4 row task_Input_div">\n' +
+            '                        <span class="col-3 text-right no_padding mr10 mt-3">任务3</span>\n' +
+            '                        <div class="col-8 no_padding">\n' +
+            '                          <input type="text" class="form-control mt-2" name="stage[][identifiers][]" placeholder="请填写实训ID">\n' +
+            '                        </div>\n' +
+            '                      </div>\n' +
+            '                    </div>\n' +
+            '                  </div>\n' +
+            '                  <span>\n' +
+            '              <a href="javascript:void(0)" class="btn btn-default ml20 small_panel_item_del">删除</a>\n' +
+            '            </span>\n' +
+            '                </div>\n' +
+            '</div></div></form>';
+        $("#large_panel").append(html);
+    }
+}
+;
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-competitions-index-page').length > 0) {
+        $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+            var $imageElement = $('.competition-image-' + data.source_id);
+            $imageElement.attr('src', data.url);
+            $imageElement.show();
+            $imageElement.next().html('重新上传');
+        });
+    }
+
+    $(".admin-competition-list-form").on("change", '.competitions-hot-select', function () {
+        var s_value = $(this).get(0).checked ? 1 : 0;
+        var json = {};
+        json["hot"] = s_value;
+        $.ajax({
+            url: "/admins/competitions/hot_setting",
+            type: "POST",
+            dataType:'json',
+            data: json,
+            success: function(){
+                $.notify({ message: '操作成功' });
+            }
+        });
+    });
+
+    // ============== 新增竞赛 ===============
+    var $modal = $('.modal.admin-create-competition-modal');
+    var $form = $modal.find('form.admin-create-competition-form');
+    var $competitionNameInput = $form.find('input[name="competition_name"]');
+
+    $form.validate({
+        errorElement: 'span',
+        errorClass: 'danger text-danger',
+        rules: {
+            competition_name: {
+                required: true
+            }
+        }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $competitionNameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+        $form.find('.error').html('');
+
+        if ($form.valid()) {
+            var url = $form.data('url');
+
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: url,
+                data: $form.serialize(),
+                success: function(){
+                    $.notify({ message: '创建成功' });
+                    $modal.modal('hide');
+
+                    setTimeout(function(){
+                        window.location.reload();
+                    }, 500);
+                },
+                error: function(res){
+                    var data = res.responseJSON;
+                    $form.find('.error').html(data.message);
+                }
+            });
+        }
+    });
+
+    // 导入学生
+    var $importScoreModal = $('.modal.admin-import-competition-score-modal');
+    var $importScoreForm = $importScoreModal.find('form.admin-import-competition-score-form');
+    var $competitionIdInput = $importScoreForm.find('input[name="competition_id"]');
+
+    $importScoreModal.on('show.bs.modal', function(event){
+        resetFileInputFunc($importScoreModal.find('.upload-file-input'));
+        $importScoreModal.find('.file-names').html('选择文件');
+        $importScoreModal.find('.upload-file-input').trigger('click');
+
+        var $link = $(event.relatedTarget);
+        var competitionId = $link.data('competition-id');
+        $competitionIdInput.val(competitionId);
+    });
+
+    $importScoreModal.on('change', '.upload-file-input', function(e){
+        var file = $(this)[0].files[0];
+        $importScoreModal.find('.file-names').html(file ? file.name : '请选择文件');
+    });
+
+    var importUserFormValid = function(){
+        if($importScoreForm.find('input[name="file"]').val() == undefined || $importScoreForm.find('input[name="file"]').val().length == 0){
+            $importScoreForm.find('.error').html('请选择文件');
+            return false;
+        }
+
+        return true;
+    };
+
+    var buildResultMessage = function(data){
+        var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+        if(data.fail.length > 0){
+            messageHtml += '<table class="table"><thead class="thead-light"><tr><th>数据</th><th>失败原因</th></tr></thead><tbody>';
+
+            data.fail.forEach(function(item){
+                messageHtml += '<tr><td>' + item.data + '</td><td>' + item.message + '</td></tr>';
+            });
+
+            messageHtml += '</tbody></table>'
+        }
+
+        return messageHtml;
+    };
+
+    $importScoreModal.on('click', '.submit-btn', function(){
+        $importScoreForm.find('.error').html('');
+
+        if (importUserFormValid()) {
+            $('body').mLoading({ text: '正在导入...' });
+
+            $.ajax({
+                method: 'POST',
+                dataType: 'json',
+                url: '/admins/import_competition_scores',
+                data: new FormData($importScoreForm[0]),
+                processData: false,
+                contentType: false,
+                success: function(data){
+                    $('body').mLoading('destroy');
+                    $importScoreModal.modal('hide');
+
+                    showMessageModal(buildResultMessage(data), function(){
+                        window.location.reload();
+                    });
+                },
+                error: function(res){
+                    $('body').mLoading('destroy');
+                    var data = res.responseJSON;
+                    $importScoreForm.find('.error').html(data.message);
+                }
+            });
+        }
+    });
+});
+
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-cooperatives-index-page').length > 0) {
+    // ------------ 保存链接 -----------
+    $('.coo-img-card').on('click', '.save-url-btn', function(){
+      var $link = $(this);
+      var cooId = $link.data('id');
+      var url = $('.coo-img-item-' + cooId).find('.url-input').val();
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/cooperatives/' + cooId,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { url: url },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/cooperatives/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('coo-img-container-alliance_coop');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+    var ele2 = document.getElementById('coo-img-container-com_coop');
+    dragula([ele2], { mirrorContainer: ele2 }).on('drop', onDropFunc);
+    var ele3 = document.getElementById('coo-img-container-edu_coop');
+    dragula([ele3], { mirrorContainer: ele3 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-cooperative-modal');
+    var $createForm = $createModal.find('form.admin-add-cooperative-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "coo_img[image]": {
+          required: true
+        }
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+
+      var $link = $(event.relatedTarget);
+      var imgType = $link.data('imgType');
+      $createForm.find('input[name="coo_img[img_type]"]').val(imgType);
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $cooImgItem = $('.coo-img-item-' + data.source_id);
+      $.post('/admins/cooperatives/'+ data.source_id + '/replace_image_url');
+      $cooImgItem.find('.coo-img-item-img img').attr('src', data.url);
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-courses-index-page').length > 0) {
+    let searchContainer = $(".course-list-form");
+    let searchForm = $("form.search-form",searchContainer);
+
+    searchContainer.on('change', '.course-homepage-show', function(){
+      searchForm.find('input[type="submit"]').trigger('click');
+    });
+
+    //导出
+    searchContainer.on('click', "#course-export", function () {
+      window.location.href = "/admins/courses.xlsx?" + searchForm.serialize();
+    });
+
+   $(".course-list-container").on("change", '.course-setting-form', function () {
+     var s_id = $(this).attr("data-id");
+     var s_value = $(this).val();
+     var s_name = $(this).attr("name");
+     var json = {};
+     json[s_name] = s_value;
+     $.ajax({
+       url: "/admins/courses/" + s_id,
+       type: "PUT",
+       dataType:'script',
+       data: json
+     });
+   });
+
+      // 清空
+      searchForm.on('click', '.clear-btn', function () {
+          searchForm.find('select[name="status"]').val('');
+          searchForm.find('.school-select').val('').trigger('change');
+          searchForm.find('input[name="keyword"]').val('');
+          searchForm.find('#homepage_show').attr('checked', false);
+          searchForm.find('input[type="submit"]').trigger('click');
+      });
+
+  // ************** 学校选择 *************
+  searchForm.find('.school-select').select2({
+      theme: 'bootstrap4',
+      placeholder: '请选择单位',
+      minimumInputLength: 1,
+      ajax: {
+          delay: 500,
+          url: '/api/schools/search.json',
+          dataType: 'json',
+          data: function (params) {
+              return {keyword: params.term};
+          },
+          processResults: function (data) {
+              return {results: data.schools}
+          }
+      },
+      templateResult: function (item) {
+          if (!item.id || item.id === '') return item.text;
+          return item.name;
+      },
+      templateSelection: function (item) {
+          if (item.id) {
+          }
+          return item.name || item.text;
+      }
+  });
+  }
+});
+
+$(document).on('turbolinks:load', function(){
+  if ($('body.admins-daily-school-statistics-index-page').length > 0) {
+    $('.export-action').on('click', function(){
+      var form = $(".daily-school-statistic-list-form .search-form")
+      var exportLink = $(this);
+      var keyword = form.find("input[name='keyword']").val();
+
+      var url = exportLink.data("url").split('?')[0] + "?keyword=" + keyword;
+      window.open(url);
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-dashboards-index-page').length > 0) {
+    // 月新增用户
+    var monthChart = echarts.init(document.getElementById('month-active-user'));
+    monthChart.setOption({
+      tooltip: {
+        show: "true",
+        trigger: 'item',
+        formatter: '{c0}',
+        backgroundColor: 'rgba(0,0,0,0.7)', // 背景
+        padding: [8, 10], //内边距
+        extraCssText: 'box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);', //添加阴影
+        axisPointer: { // 坐标轴指示器，坐标轴触发有效
+          type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+        }
+      },
+      series : [
+        {
+          name: '访问来源',
+          type: 'pie',
+          radius: '55%',
+          data: []
+        }
+      ]
+    });
+    monthChart.showLoading();
+    $.get('/admins/dashboards/month_active_user.json').done(function(data){
+      monthChart.setOption({
+        series: [
+          { data: data.data }
+        ]
+      });
+
+      monthChart.hideLoading();
+    });
+
+
+    // 近七天评测次数
+    // var evaluateChart = echarts.init(document.getElementById('evaluate-pie'));
+    // evaluateChart.setOption({
+    //   tooltip: {
+    //     show: "true",
+    //     trigger: 'item',
+    //     formatter: '{c0}',
+    //     backgroundColor: 'rgba(0,0,0,0.7)', // 背景
+    //     padding: [8, 10], //内边距
+    //     extraCssText: 'box-shadow: 0 0 3px rgba(255, 255, 255, 0.4);', //添加阴影
+    //     axisPointer: { // 坐标轴指示器，坐标轴触发有效
+    //       type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+    //     }
+    //   },
+    //   xAxis: { type: 'category', boundaryGap: false, data: [] },
+    //   yAxis: { type: 'value' },
+    //   series: [{ data: [], type: 'line', areaStyle: {} }]
+    // });
+    // evaluateChart.showLoading();
+    // $.get('/admins/dashboards/evaluate.json').done(function(data){
+    //   evaluateChart.setOption({
+    //     xAxis: { data: data.names },
+    //     series: [{ data: data.data }]
+    //   });
+    //
+    //   evaluateChart.hideLoading();
+    // });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-departments-index-page').length > 0) {
+    var $searchContainer = $('.department-list-form');
+    var $searchForm = $searchContainer.find('form.search-form');
+    var $list = $('.department-list-container');
+
+    $searchContainer.on('change', '.form-check-input', function(){
+      $searchForm.find('input[type="submit"]').trigger('click');
+    });
+
+    // ============== 新建部门 ===============
+    var $modal = $('.modal.admin-create-department-modal');
+    var $form = $modal.find('form.admin-create-department-form');
+    var $departmentNameInput = $form.find('input[name="department_name"]');
+    var $schoolSelect = $modal.find('.school-select');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        school_id: {
+          required: true
+        },
+        department_name: {
+          required: true
+        }
+      },
+      messages: {
+        school_id: {
+          required: '请选择所属单位'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+      $departmentNameInput.val('');
+      $schoolSelect.select2('val', ' ');
+    });
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    };
+
+    var defineSchoolSelect = function(schools) {
+      $schoolSelect.select2({
+        theme: 'bootstrap4',
+        placeholder: '请选择所属单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#school_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    }
+
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+    // ============= 添加部门管理员 ==============
+    var $addMemberModal = $('.admin-add-department-member-modal');
+    var $addMemberForm = $addMemberModal.find('.admin-add-department-member-form');
+    var $memberSelect = $addMemberModal.find('.department-member-select');
+    var $departmentIdInput = $addMemberForm.find('input[name="department_id"]')
+
+    $addMemberModal.on('show.bs.modal', function(event){
+      var $link = $(event.relatedTarget);
+      var departmentId = $link.data('department-id');
+      $departmentIdInput.val(departmentId);
+
+      $memberSelect.select2('val', ' ');
+    });
+
+    $memberSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入要添加的管理员姓名',
+      multiple: true,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/admins/users',
+        dataType: 'json',
+        data: function(params){
+          return { name: params.term };
+        },
+        processResults: function(data){
+          return { results: data.users }
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        return item.real_name;
+      },
+      templateSelection: function(item){
+        if (item.id) {
+        }
+        return item.real_name || item.text;
+      }
+    });
+
+    $addMemberModal.on('click', '.submit-btn', function(){
+      $addMemberForm.find('.error').html('');
+
+      var departmentId = $departmentIdInput.val();
+      var memberIds = $memberSelect.val();
+      if (departmentId && memberIds && memberIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: '/admins/departments/' + departmentId + '/department_member',
+          data: { user_ids: memberIds }
+        });
+      } else {
+        $addMemberModal.modal('hide');
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-disciplines-index-page').length > 0) {
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-discipline-modal');
+    var $form = $modal.find('form.admin-create-discipline-form');
+    var $nameInput = $form.find('input[name="name"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        name: {
+          required: true
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $nameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+      $(".discipline-list-container").on("change", '.discipline-source-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/disciplines/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+
+      // 导入学生
+      var $importDisciplineModal = $('.modal.admin-import-discipline-modal');
+      var $importDisciplineForm = $importDisciplineModal.find('form.admin-import-discipline-form');
+
+      $importDisciplineModal.on('show.bs.modal', function(){
+          resetFileInputFunc($importDisciplineModal.find('.upload-file-input'));
+          $importDisciplineModal.find('.file-names').html('选择文件');
+          $importDisciplineModal.find('.upload-file-input').trigger('click');
+      });
+      $importDisciplineModal.on('change', '.upload-file-input', function(e){
+          var file = $(this)[0].files[0];
+          $importDisciplineModal.find('.file-names').html(file ? file.name : '请选择文件');
+      });
+
+      var importDisciplineFormValid = function(){
+          if($importDisciplineForm.find('input[name="file"]').val() == undefined || $importDisciplineForm.find('input[name="file"]').val().length == 0){
+              $importDisciplineForm.find('.error').html('请选择文件');
+              return false;
+          }
+
+          return true;
+      };
+
+      var buildResultMessage = function(data){
+          var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+          return messageHtml;
+      };
+
+      $importDisciplineModal.on('click', '.submit-btn', function(){
+          $importDisciplineForm.find('.error').html('');
+
+          if (importDisciplineFormValid()) {
+              $('body').mLoading({ text: '正在导入...' });
+
+              $.ajax({
+                  method: 'POST',
+                  dataType: 'json',
+                  url: '/admins/import_disciplines',
+                  data: new FormData($importDisciplineForm[0]),
+                  processData: false,
+                  contentType: false,
+                  success: function(data){
+                      $('body').mLoading('destroy');
+                      $importDisciplineModal.modal('hide');
+
+                      showMessageModal(buildResultMessage(data), function(){
+                          window.location.reload();
+                      });
+                  },
+                  error: function(res){
+                      $('body').mLoading('destroy');
+                      var data = res.responseJSON;
+                      $importDisciplineForm.find('.error').html(data.message);
+                  }
+              });
+          }
+      });
+
+      // ------------ 上移/下移 -------------
+      $('.discipline-list-container').on('click', ".move-action", function () {
+          var $doAction = $(this);
+
+          var disciplineId = $doAction.data('id');
+          var opr = $doAction.data('opr');
+          $.ajax({
+              url: '/admins/disciplines/' + disciplineId + '/adjust_position',
+              method: 'POST',
+              dataType: 'script',
+              data: {opr: opr}
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-ec-templates-index-page').length > 0) {
+    var add_modal = $(".ec-templates-new-add");
+    var template_file_name = add_modal.find(".template-file-upload");
+    var attachment_id_input = add_modal.find(".template_attachment_id");
+    var template_container = $(".ec-templates-list-container");
+
+    //编辑附件
+    template_container.on("click", ".edit-template-content", function () {
+      var t_id = $(this).attr("data-id");
+      var t_name = $(this).attr("data-name");
+      var template_name = $(this).attr("data-template-name");
+      var t_msg = $(this).attr("data-msg");
+      var template_id = $(this).attr("data-template-id");
+      add_modal.modal("show");
+      add_modal.find(".template_add_title").html(t_msg);
+      attachment_id_input.val(template_id);
+      add_modal.find(".template_show_id").val(t_id);
+      add_modal.find("input[name='name']").val(t_name);
+      add_modal.find("i.delete-template-icon").attr("data-id", template_id);
+      if(template_id !== "-1"){
+        template_file_name.find("span.template-file-input").hide();
+        template_file_name.find("span.template_file_show").show();
+        template_file_name.find("span.template_file_show_title").html(template_name);
+      }
+    });
+
+
+    //删除附件
+    add_modal.on("click",".delete-template-icon",function () {
+      var attachment_id = $(this).attr("data-id");
+      $.ajax({
+        url: "/api/attachments/" + attachment_id,
+        type: "delete",
+        contentType:"application/json",
+        dataType:"json",
+        success: function (data) {
+          template_file_name.find("span.template-file-input").show();
+          template_file_name.find("span.template_file_show").hide();
+          attachment_id_input.attr("value","-1")
+        }
+      })
+    });
+
+    //上传附件
+    add_modal.on("change", "#upload_template_file",function () {
+
+      var template = document.getElementById('upload_template_file').files[0];
+
+      var file_content = new FormData();
+
+      file_content.append("file", template);
+
+      $.ajax({
+        type: "POST",
+        url: "/api/attachments",
+        data:file_content,
+        contentType: false,
+        processData: false,
+        success: function (data) {
+          template_file_name.find("span.template-file-input").hide();
+          template_file_name.find("span.template_file_show").show();
+          template_file_name.find("span.template_file_show_title").html(template.name);
+          template_file_name.find("i.delete-template-icon").attr("data-id",data.id);
+          attachment_id_input.val(data.id)
+        }
+      })
+    })
+  }
+});
+$(document).on('turbolinks:load', function() {
+    if($('body.admins-enroll-lists-index-page').length > 0){
+        var search_form = $(".search-form");
+        //导出
+        $(".competition-enroll-list-form").on("click","#enroll-lists-export",function () {
+            window.location.href = "/admins/competitions/"+$(this).attr("data-competition-id")+"/enroll_lists/export.xlsx?" + search_form.serialize();
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-examination-authentications-index-page').length > 0) {
+    var $searchFrom = $('.examination-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if($(".admins-graduation-standards-index-page").length > 0){
+    $(".admin-body-container").on("click", ".standard-create-modal", function () {
+      var content = $(this).attr("data-content");
+      var g_id = $(this).attr("data-id");
+      var g_msg = $(this).attr("data-msg");
+
+      $("#graduation-modal-type").html(g_msg);
+      $("#graduation_standard_id").val(g_id);
+      $("textarea[name='content']").val(content);
+    })
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-help-centers-edit-page, body.admins-help-centers-update-page').length > 0) {
+    createMDEditor('help-center-editor', {});
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-identity-authentications-index-page').length > 0) {
+    var $searchFrom = $('.identity-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+
+    $('.batch-agree-btn').on('click', function(){
+      if($('.batch-check-box:checked').length === 0){
+        $.notify({ message: '请先选择数据' }, { type: 'info' });
+        return;
+      }
+
+      customConfirm({
+        content: '确认审核通过？',
+        ok: function(){
+          var ids = $('.batch-check-box:checked').map(function(_, e){ return $(e).val() }).get();
+
+          $.ajax({
+            url: '/admins/identity_authentications/batch_agree',
+            method: 'POST',
+            dataType: 'json',
+            data: { ids: ids },
+            success: function(data){
+              $.notify({ message: '操作成功' });
+              window.location.reload();
+            },
+            error: function(res){
+              $.notify({ message: res.responseJSON.message }, { type: 'danger' });
+            }
+          })
+        }
+      })
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-item-authentications-index-page').length > 0) {
+    var $searchFrom = $('.item-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratory-settings-show-page, body.admins-laboratory-settings-update-page').length > 0) {
+    var $container = $('.edit-laboratory-setting-container');
+    var $form = $container.find('.edit_laboratory');
+
+    $('.logo-item-left, .banner-item-bottom').on("change", 'input[type="file"]', function () {
+      var $fileInput = $(this);
+      var file = this.files[0];
+      var imageType = /image.*/;
+      if (file && file.type.match(imageType)) {
+        var reader = new FileReader();
+        reader.onload = function () {
+          var $box = $fileInput.parent();
+          $box.find('img').attr('src', reader.result).css('display', 'block');
+          $box.addClass('has-img');
+        };
+        reader.readAsDataURL(file);
+      } else {
+      }
+    });
+
+    createMDEditor('laboratory-footer-editor', { height: 200, placeholder: '请输入备案信息' });
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      errorPlacement:function(error,element){
+        if(element.parent().hasClass("input-group")){
+          element.parent().after(error);
+        }else{
+          element.after(error)
+        }
+      },
+      rules: {
+        identifier: {
+          required: true,
+          checkSite: true
+        },
+        name: {
+          required: true
+        }
+      }
+    });
+    $.validator.addMethod("checkSite",function(value,element,params){
+      var checkSite = /^(?=^.{3,255}$)[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(\.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+$/;
+      return this.optional(element)||(checkSite.test(value + '.educoder.com'));
+    },"域名不合法！");
+
+    $form.on('click', '.submit-btn', function(){
+      $form.find('.submit-btn').attr('disabled', 'disabled');
+      $form.find('.error').html('');
+      var valid = $form.valid();
+
+      $('input[name="navbar[][name]"]').each(function(_, e){
+        var $ele = $(e);
+        if($ele.val() === undefined || $ele.val().length === 0){
+          $ele.addClass('danger text-danger');
+          valid = false;
+        } else {
+          $ele.removeClass('danger text-danger');
+        }
+      });
+
+      if(!valid) return;
+      $.ajax({
+        method: 'PATCH',
+        dataType: 'json',
+        url: $form.attr('action'),
+        data: new FormData($form[0]),
+        processData: false,
+        contentType: false,
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          window.location.reload();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $form.find('.error').html(data.message);
+        },
+        complete: function(){
+          $form.find('.submit-btn').attr('disabled', false);
+        }
+      });
+    })
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratories-index-page').length > 0) {
+    var $searchContainer = $('.laboratory-list-form');
+    var $searchForm = $searchContainer.find('form.search-form');
+    var $list = $('.laboratory-list-container');
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-laboratory-modal');
+    var $form = $modal.find('form.admin-create-laboratory-form');
+    var $schoolSelect = $modal.find('.school-select');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        school_id: {
+          required: true
+        }
+      },
+      messages: {
+        school_id: {
+          required: '请选择所属单位'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+      $schoolSelect.select2('val', ' ');
+    });
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    };
+
+    var defineSchoolSelect = function(schools) {
+      $schoolSelect.select2({
+        theme: 'bootstrap4',
+        placeholder: '请选择单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#school_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+    // ============= 添加管理员 ==============
+    var $addMemberModal = $('.admin-add-laboratory-user-modal');
+    var $addMemberForm = $addMemberModal.find('.admin-add-laboratory-user-form');
+    var $memberSelect = $addMemberModal.find('.laboratory-user-select');
+    var $laboratoryIdInput = $addMemberForm.find('input[name="laboratory_id"]')
+
+    $addMemberModal.on('show.bs.modal', function(event){
+      var $link = $(event.relatedTarget);
+      var laboratoryId = $link.data('laboratory-id');
+      $laboratoryIdInput.val(laboratoryId);
+
+      $memberSelect.select2('val', ' ');
+    });
+
+    $memberSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入要添加的管理员姓名',
+      multiple: true,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/admins/users',
+        dataType: 'json',
+        data: function(params){
+          return { name: params.term };
+        },
+        processResults: function(data){
+          return { results: data.users }
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        return $("<span>" + item.real_name + " <span class='font-12'>" + item.school_name + ' ' + item.hidden_phone + "</span></span>");
+      },
+      templateSelection: function(item){
+        if (item.id) {
+        }
+        return item.real_name || item.text;
+      }
+    });
+
+    $addMemberModal.on('click', '.submit-btn', function(){
+      $addMemberForm.find('.error').html('');
+
+      var laboratoryId = $laboratoryIdInput.val();
+      var memberIds = $memberSelect.val();
+      if (laboratoryId && memberIds && memberIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: '/admins/laboratories/' + laboratoryId + '/laboratory_user',
+          data: { user_ids: memberIds }
+        });
+      } else {
+        $addMemberModal.modal('hide');
+      }
+    });
+
+      $(".laboratory-list-container").on("change", '.laboratory-sync-course', function () {
+          var s_id = $(this).attr("data-id");
+          var json = {};
+          $.ajax({
+              url: "/admins/laboratories/" + s_id + "/update_sync_course",
+              type: "POST",
+              dataType:'script',
+              data: json
+          })
+      });
+
+      $(".laboratory-list-container").on("change", '.laboratory-sync-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/laboratories/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratory-shixuns-index-page').length > 0) {
+    var $searchForm = $('.laboratory-shixun-list-form .search-form');
+    var laboratoryId = $('.laboratory-shixun-list-container').data('id');
+
+    $searchForm.find('select#tag_id').select2({
+      placeholder: "请选择",
+      allowClear: true
+    });
+
+    // 定义状态切换监听事件
+    var defineStatusChangeFunc = function (doElement, undoElement, url, callback) {
+      $('.laboratory-shixun-list-container').on('click', doElement, function () {
+        var $doAction = $(this);
+        var $undoAction = $doAction.siblings(undoElement);
+
+        var laboratoryShixunId = $doAction.data('id');
+        customConfirm({
+          content: '确认进行该操作吗？',
+          ok: function () {
+            $.ajax({
+              url: '/admins/laboratories/' + laboratoryId + '/laboratory_shixuns/' + laboratoryShixunId + url,
+              method: 'POST',
+              dataType: 'json',
+              success: function () {
+                show_success_flash();
+                $doAction.hide();
+                $undoAction.show();
+                if (callback && typeof callback === "function") {
+                  callback(laboratoryShixunId, url);
+                }
+              }
+            });
+          }
+        });
+      });
+    }
+
+    // 首页展示与取消首页展示
+    var homepageShowCallback = function (laboratoryShixunId, url) {
+      var $laboratoryShixunItem = $('.laboratory-shixun-list-container').find('.laboratory-shixun-item-' + laboratoryShixunId);
+
+      if (url === '/homepage') {
+        $laboratoryShixunItem.find('.homepage-badge').show();
+      } else {
+        $laboratoryShixunItem.find('.homepage-badge').hide();
+      }
+    }
+    defineStatusChangeFunc('.homepage-show-action', '.homepage-hide-action', '/homepage', homepageShowCallback);
+    defineStatusChangeFunc('.homepage-hide-action', '.homepage-show-action', '/cancel_homepage', homepageShowCallback);
+
+    // 添加实训功能
+    var $addModal = $('.modal.admin-add-laboratory-shixun-modal');
+    var $addForm = $addModal.find('form.admin-add-laboratory-user-form');
+    var $shixunSelect = $addForm.find('select.shixun-select');
+
+    $addModal.on('show.bs.modal', function(){
+      $addModal.find('.error').html('');
+      $shixunSelect.select2('val', ' ');
+    });
+
+    $shixunSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入实训名称/创建者检索',
+      multiple: true,
+      closeOnSelect: false,
+      ajax: {
+        delay: 500,
+        url: '/admins/laboratories/' + laboratoryId + '/shixuns_for_select',
+        dataType: 'json',
+        data: function(params){
+          return { keyword: params.term, page: params.page || 1, per_page: 20 };
+        },
+        processResults: function(data, params){
+          params.page = params.page || 1;
+
+          return {
+            results: data.shixuns,
+            pagination: {
+              more: (params.page * 20) < data.count
+            }
+          };
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        var ele = '<span>'
+        ele += '<span>' + item.name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.creator_name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.status_text+ '</span>';
+        ele += '</span>';
+
+        return $(ele);
+      },
+      templateSelection: function(item){
+        if (item.id) {
+        }
+        var ele = '<span>' + (item.name || item.text) + '<span class="font-12"> -- ' + item.creator_name + '</span></span>'
+        return $(ele);
+      }
+    });
+
+    $addModal.on('click', '.submit-btn', function(){
+      $addModal.find('.error').html('');
+
+      var shixunIds = $shixunSelect.val();
+      if (shixunIds && shixunIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/laboratories/' + laboratoryId + '/laboratory_shixuns',
+          data: { shixun_ids: shixunIds },
+          success: function(){
+            show_success_flash();
+            window.location.reload();
+          },
+          error: function(res){
+            $addModal.find('.error').html(res.responseJSON.message);
+          }
+        });
+      } else {
+        $addModal.find('.error').html('请选择实训');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-laboratory-subjects-index-page').length > 0) {
+    var $searchForm = $('.laboratory-subject-list-form .search-form');
+    var laboratoryId = $('.laboratory-subject-list-container').data('id');
+
+    // ************** 学校选择 *************
+    $searchForm.find('.school-select').select2({
+      theme: 'bootstrap4',
+      placeholder: '请选择创建者单位',
+      allowClear: true,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/api/schools/search.json',
+        dataType: 'json',
+        data: function (params) {
+          return {keyword: params.term};
+        },
+        processResults: function (data) {
+          return {results: data.schools}
+        }
+      },
+      templateResult: function (item) {
+        if (!item.id || item.id === '') return item.text;
+        return item.name;
+      },
+      templateSelection: function (item) {
+        if (item.id) {
+        }
+        return item.name || item.text;
+      }
+    });
+
+    // 定义状态切换监听事件
+    var defineStatusChangeFunc = function (doElement, undoElement, url, callback) {
+      $('.laboratory-subject-list-container').on('click', doElement, function () {
+        var $doAction = $(this);
+        var $undoAction = $doAction.siblings(undoElement);
+
+        var laboratorySubjectId = $doAction.data('id');
+        customConfirm({
+          content: '确认进行该操作吗？',
+          ok: function () {
+            $.ajax({
+              url: '/admins/laboratories/' + laboratoryId + '/laboratory_subjects/' + laboratorySubjectId + url,
+              method: 'POST',
+              dataType: 'json',
+              success: function () {
+                show_success_flash();
+                $doAction.hide();
+                $undoAction.show();
+                if (callback && typeof callback === "function") {
+                  callback(laboratorySubjectId, url);
+                }
+              }
+            });
+          }
+        });
+      });
+    }
+
+    // 首页展示与取消首页展示
+    var homepageShowCallback = function (laboratoryShixunId, url) {
+      var $laboratoryShixunItem = $('.laboratory-subject-list-container').find('.laboratory-subject-item-' + laboratoryShixunId);
+
+      if (url === '/homepage') {
+        $laboratoryShixunItem.find('.homepage-badge').show();
+      } else {
+        $laboratoryShixunItem.find('.homepage-badge').hide();
+      }
+    }
+    defineStatusChangeFunc('.homepage-show-action', '.homepage-hide-action', '/homepage', homepageShowCallback);
+    defineStatusChangeFunc('.homepage-hide-action', '.homepage-show-action', '/cancel_homepage', homepageShowCallback);
+
+    // 添加实践课程功能
+    var $addModal = $('.modal.admin-add-laboratory-subject-modal');
+    var $addForm = $addModal.find('form.admin-add-laboratory-user-form');
+    var $subjectSelect = $addForm.find('select.subject-select');
+
+    $addModal.on('show.bs.modal', function(){
+      $addModal.find('.error').html('');
+      $subjectSelect.select2('val', ' ');
+    });
+
+    $subjectSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '请输入课程名称/创建者检索',
+      multiple: false,
+      closeOnSelect: true,
+      ajax: {
+        delay: 500,
+        url: '/admins/laboratories/' + laboratoryId + '/subjects_for_select',
+        dataType: 'json',
+        data: function(params){
+          return { keyword: params.term, page: params.page || 1, per_page: 20 }
+        },
+        processResults: function(data, params){
+          params.page = params.page || 1;
+
+          return {
+            results: data.subjects,
+            pagination: {
+              more: (params.page * 20) < data.count
+            }
+          };
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        var ele = '<span>';
+        ele += '<span>' + item.name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.creator_name + '</span>';
+        ele += '<span class="font-12"> -- ' + item.status_text+ '</span>';
+        ele += '</span>';
+
+        return $(ele);
+      },
+      templateSelection: function(item){
+          if(!item.id || item.id === '') return item.text;
+          var ele = '<span>' + (item.name || item.text) + '<span class="font-12"> -- ' + item.creator_name + '</span></span>';
+          return $(ele);
+      }
+    });
+
+    $addModal.on('click', '.submit-btn', function(){
+      $addModal.find('.error').html('');
+
+      var subjectIds = $subjectSelect.val();
+      if (subjectIds && subjectIds.length > 0) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/laboratories/' + laboratoryId + '/laboratory_subjects',
+          data: { subject_id: subjectIds },
+          success: function(){
+            show_success_flash();
+            window.location.reload();
+          },
+          error: function(res){
+            $addModal.find('.error').html(res.responseJSON.message);
+          }
+        });
+      } else {
+        $addModal.find('.error').html('请选择课程');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-library-applies-index-page').length > 0) {
+    var $searchFrom = $('.library-applies-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-major-informations-index-page').length > 0) {
+    var box_contain = $(".major-informations-list-container");
+    box_contain.on("click",".collapse-item",function () {
+      var a_fa = $(this).find("i");
+      if(a_fa.hasClass("fa-caret-right")){
+        a_fa.removeClass("fa-caret-right").addClass("fa-caret-down");
+      }else{
+        a_fa.removeClass("fa-caret-down").addClass("fa-caret-right");
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-message-modal');
+  var $submitBtn = $modal.find('.submit-btn');
+  if ($modal.length > 0) {
+    $modal.on('hide.bs.modal', function(){
+      $modal.find('.modal-body').html('');
+      $submitBtn.unbind();
+    });
+  }
+});
+
+function showMessageModal(html, callback) {
+  var $modal = $('.modal.admin-message-modal');
+  var $submitBtn = $modal.find('.submit-btn');
+  $submitBtn.unbind();
+  if(callback !== undefined && typeof callback === 'function'){
+    $submitBtn.on('click', callback);
+  }
+
+  $modal.find('.modal-body').html(html);
+  $modal.modal('show');
+}
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-mirror-repositories-edit-page, body.admins-mirror-repositories-update-page').length > 0) {
+    var $form = $('form.edit-mirror');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "mirror_repository[type_name]": {
+          required: true
+        }
+      }
+    });
+
+    $form.submit(function(e){
+      if(!$form.valid()){ e.preventDefault(); }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-mirror-repositories-index-page').length > 0) {
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-mirror-scripts-edit-page, body.admins-mirror-scripts-update-page, body.admins-mirror-scripts-new-page, body.admins-mirror-scripts-create-page').length > 0) {
+    var $form = $('form.script-form');
+
+    // codemirror编辑器
+    var scriptEditor = CodeMirror.fromTextArea(document.getElementById('mirror_script_script'), {
+      lineNumbers: true,
+      mode: 'shell',
+      theme: "default",
+      indentUnit: 4, //代码缩进为一个tab的距离
+      matchBrackets: true,
+      autoRefresh: true,
+      smartIndent: true,//智能换行
+      styleActiveLine: true,
+      lint: true
+    });
+    scriptEditor.setSize('auto', '600px');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "mirror_script[script_type]": {
+          required: true
+        }
+      }
+    });
+
+    $form.submit(function(e){
+      if(!$form.valid()){ e.preventDefault(); }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-choose-mirror-modal', function(){
+    var $modal = $('.modal.admin-choose-mirror-modal');
+    var $form = $modal.find('form.admin-choose-mirror-form');
+
+    var validateForm = function(){
+      var checkedValue = $form.find('input[name="mirror_number"]:checked').val();
+
+      if(checkedValue == undefined){
+        $modal.find('.error').html('必须选择一种镜像保存！');
+        return false;
+      }
+      return true;
+    }
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if (validateForm()) {
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: url,
+          data: $form.serialize(),
+        }).done(function(){
+          $modal.modal('hide');
+        });
+      }
+    });
+  })
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-department-modal', function(){
+    var $modal = $('.modal.admin-edit-department-modal');
+    var $form = $modal.find('form.admin-edit-department-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'department[name]': {
+          required: true,
+          maxlength: 20
+        },
+        'department[host_count]': {
+          digits: true
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if ($form.valid()) {
+        $.ajax({
+          method: 'PATCH',
+          dataType: 'script',
+          url: url,
+          data: $form.serialize()
+        });
+      }
+    });
+  })
+});
+$(document).on('turbolinks:load', function () {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-discipline-modal', function () {
+        var $modal = $('.modal.admin-edit-discipline-modal');
+        var $form = $modal.find('form.admin-edit-discipline-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'discipline[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', submit_edit_form);
+
+        $form.find("#discipline_name").keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_edit_form();
+                return false;
+            }
+        });
+
+        function submit_edit_form() {
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        }
+    });
+});
+$(document).on('turbolinks:load', function() {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-repertoire-modal', function(){
+        var $modal = $('.modal.admin-edit-repertoire-modal');
+        var $form = $modal.find('form.admin-edit-repertoire-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'repertoire[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', function(){
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        });
+    });
+});
+$(document).on('turbolinks:load', function () {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-sub-discipline-modal', function () {
+        var $modal = $('.modal.admin-edit-sub-discipline-modal');
+        var $form = $modal.find('form.admin-edit-sub-discipline-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'sub_discipline[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', submit_edit_form);
+
+        $form.find("#sub_discipline_name").keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_edit_form();
+                return false;
+            }
+        });
+
+        function submit_edit_form() {
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        }
+
+    });
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-sub-repertoire-modal', function(){
+    var $modal = $('.modal.admin-edit-sub-repertoire-modal');
+    var $form = $modal.find('form.admin-edit-sub-repertoire-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'sub_repertoire[name]': {
+          required: true,
+          maxlength: 20
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if ($form.valid()) {
+        $.ajax({
+            method: 'PATCH',
+            dataType: 'script',
+            url: url,
+            data: $form.serialize()
+        });
+      }
+    });
+  });
+});
+$(document).on('turbolinks:load', function () {
+	$('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-subject-modal', function () {
+		var $modal = $('.modal.admin-edit-subject-modal');
+		var $form = $modal.find('form.admin-edit-subject-form');
+
+		$modal.on('click', '.submit-btn', function () {
+			$form.find('.error').html('');
+			var url = $form.attr('action');
+
+			$.ajax({
+				method: 'PATCH',
+				dataType: 'script',
+				url: url,
+				data: $form.serialize()
+			});
+		});
+	})
+});
+$(document).on('turbolinks:load', function () {
+    $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-tag-discipline-modal', function () {
+        var $modal = $('.modal.admin-edit-tag-discipline-modal');
+        var $form = $modal.find('form.admin-edit-tag-discipline-form');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                'tag_discipline[name]': {
+                    required: true,
+                    maxlength: 20
+                }
+            }
+        });
+
+        $modal.on('click', '.submit-btn', submit_edit_form);
+
+        $form.find("#tag_discipline_name").keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_edit_form();
+                return false;
+            }
+        });
+
+        function submit_edit_form() {
+            $form.find('.error').html('');
+            var url = $form.attr('action');
+
+            if ($form.valid()) {
+                $.ajax({
+                    method: 'PATCH',
+                    dataType: 'script',
+                    url: url,
+                    data: $form.serialize()
+                });
+            }
+        }
+    });
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.modal.admin-edit-tag-repertoire-modal', function(){
+    var $modal = $('.modal.admin-edit-tag-repertoire-modal');
+    var $form = $modal.find('form.admin-edit-tag-repertoire-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'tag_repertoire[name]': {
+          required: true,
+          maxlength: 20
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+
+      if ($form.valid()) {
+        $.ajax({
+            method: 'PATCH',
+            dataType: 'script',
+            url: url,
+            data: $form.serialize()
+        });
+      }
+    });
+  });
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-import-course-member-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-import-course-member-form');
+
+    var resetFileInputFunc = function(file){
+      file.after(file.clone().val(""));
+      file.remove();
+    }
+
+    $modal.on('show.bs.modal', function(){
+      $modal.find('.file-names').html('选择文件');
+      $modal.find('.upload-file-input').trigger('click');
+    });
+    $modal.on('hide.bs.modal', function(){
+      resetFileInputFunc($modal.find('.upload-file-input'));
+    });
+    $modal.on('change', '.upload-file-input', function(e){
+      var file = $(this)[0].files[0];
+      $modal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    var importFormValid = function(){
+      if($form.find('input[name="file"]').val() == undefined || $form.find('input[name="file"]').val().length == 0){
+        $form.find('.error').html('请选择文件');
+        return false;
+      }
+
+      return true;
+    };
+
+    var buildResultMessage = function(data){
+      var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+      if(data.fail.length > 0){
+        messageHtml += '<table class="table"><thead class="thead-light"><tr><th>数据</th><th>失败原因</th></tr></thead><tbody>';
+
+        data.fail.forEach(function(item){
+          messageHtml += '<tr><td>' + item.data + '</td><td>' + item.message + '</td></tr>';
+        });
+
+        messageHtml += '</tbody></table>'
+      }
+
+      return messageHtml;
+    }
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if (importFormValid()) {
+        $('body').mLoading({ text: '正在导入...' });
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/import_course_members',
+          data: new FormData($form[0]),
+          processData: false,
+          contentType: false,
+          success: function(data){
+            $('body').mLoading('destroy');
+            $modal.modal('hide');
+
+            showMessageModal(buildResultMessage(data), function(){
+              window.location.reload();
+            });
+          },
+          error: function(res){
+            $('body').mLoading('destroy');
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-merge-course-list-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-merge-course-list-form');
+    var $originCourseListIdInput = $form.find('input[name="origin_course_list_id"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+          course_list_name: {
+          required: true
+        }
+      },
+      messages: {
+          course_list_name: {
+          required: '请输入课程名称'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var couresListId = $link.data('courseListId');
+      var url = $link.data('url');
+
+      $originCourseListIdInput.val(couresListId);
+      $form.data('url', url);
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '操作成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-merge-department-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-merge-department-form');
+    var $schoolIdInput = $form.find('input[name="school_id"]');
+    var $originDepartmentIdInput = $form.find('input[name="origin_department_id"]');
+    var $departmentSelect = $modal.find('.department-select');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        department_id: {
+          required: true
+        }
+      },
+      messages: {
+        department_id: {
+          required: '请选择部门'
+        }
+      }
+    });
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    };
+
+    var defineDepartmentSelect = function(departments) {
+      $departmentSelect.empty();
+
+      $departmentSelect.select2({
+        theme: 'bootstrap4',
+        placeholder: '请选择所属部门',
+        data: departments,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $form.find('#department_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+      $departmentSelect.select2('val', ' ');
+    };
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var schoolId = $link.data('schoolId');
+      var url = $link.data('url');
+
+      $schoolIdInput.val(schoolId);
+      $originDepartmentIdInput.val($link.data('departmentId'));
+      $form.data('url', url);
+      $.ajax({
+        url: '/api/schools/' + schoolId + '/departments/for_option.json',
+        dataType: 'json',
+        type: 'GET',
+        success: function(data) {
+          defineDepartmentSelect(data.departments);
+        }
+      });
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '操作成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-replace-mirror-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-replace-mirror-form');
+    var $mirrorIdInput = $modal.find('.modal-body input[name="mirror_id"]');
+    var $mirrorSelect = $modal.find('.new-mirror-select');
+
+    var setMirror = function(id, name){
+      $mirrorIdInput.val(id);
+      $form.find('.mirror-id-container').html(id);
+      $form.find('.mirror-name-container').html(name);
+    }
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        new_mirror_id: {
+          required: true
+        },
+      },
+      messages: {
+        new_mirror_id: {
+          required: '请选择新镜像'
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var mirrorId = $link.data('id');
+      var mirrorName = $link.data('name');
+
+      setMirror(mirrorId, mirrorName);
+      $mirrorSelect.select2('val', ' ');
+    });
+    $modal.on('hide.bs.modal', function () {
+      setMirror('', '');
+      $mirrorSelect.select2('val', ' ');
+      $('#new_mirror_id-error').remove();
+    });
+
+    $mirrorSelect.select2({
+      theme: 'bootstrap4',
+      placeholder: '输入要合并的镜像名',
+      minimumInputLength: 1,
+      ajax: {
+        url: '/admins/mirror_repositories/for_select',
+        dataType: 'json',
+        data: function(params){
+          return { keyword: params.term };
+        },
+        processResults: function(data){
+          return { results: data.mirrors }
+        }
+      },
+      templateResult: function (item) {
+        if(!item.id || item.id === '') return item.text;
+        return item.name;
+      },
+      templateSelection: function(item){
+        if (item.id) {
+          $('#new_mirror_id-error').remove();
+          $('#new_mirror_id').val(item.id);
+        }
+        return item.name || item.text;
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'script',
+          url: url,
+          data: $form.serialize(),
+        }).done(function(){
+          $modal.modal('hide');
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  $('.admin-modal-container').on('show.bs.modal', '.admin-save-competition-prize-modal', function(event){
+    var $modal = $('.modal.admin-save-competition-prize-modal');
+    var $form = $modal.find('form.admin-save-competition-prize-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        'competition_prize[name]': {
+          required: true,
+          maxlength: 10
+        },
+        'competition_prize[num]': {
+          required: true,
+          digits: true,
+          min: 1
+        }
+      }
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+      var url = $form.attr('action');
+      var formMethod = $form.data('form-method')
+
+      if ($form.valid()) {
+        $.ajax({
+          method: formMethod,
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(data){
+            if(data && data.status === 0) {
+              show_success_flash();
+              $(document).trigger('prize.save.success');
+              $modal.modal('hide');
+            } else {
+              $modal.find('.error').html(data.message)
+            }
+          }
+        });
+      }
+    });
+  })
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-select-school-modal');
+  if ($modal.length > 0) {
+    var $link = null;
+    var $form = $modal.find('form.admin-select-school-form');
+    var multiple = $form.data('multiple');
+
+    $form.find('.school-select').select2({
+      theme: 'bootstrap4',
+      placeholder: '请选择',
+      multiple: multiple,
+      minimumInputLength: 1,
+      ajax: {
+        delay: 500,
+        url: '/api/schools/search.json',
+        dataType: 'json',
+        data: function (params) {
+          return {keyword: params.term};
+        },
+        processResults: function (data) {
+          return {results: data.schools}
+        }
+      },
+      templateResult: function (item) {
+        if (!item.id || item.id === '') return item.text;
+        var html = "<span>" + item.name + "<span class='ml-4 font-12'>";
+        if(item.province){ html += item.province }
+        html += "</span></span>";
+        return $(html);
+      },
+      templateSelection: function (item) {
+        if (item.id) {
+        }
+        return item.name || item.text;
+      }
+    });
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        school_ids: {
+          required: true
+        }
+      },
+      messages: {
+        school_ids: {
+          required: '请选择'
+        }
+      }
+    });
+
+    $modal.on('show.bs.modal', function(event){
+      $link = $(event.relatedTarget);
+    });
+
+    $modal.on('hide.bs.modal', function(){
+      $form.find('.error').html('');
+      $form.find('.school-select').select2('val', ' ');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if($form.valid()){
+        var url = $form.data('url');
+        var schoolIds = $form.find('#school_ids').val();
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: { school_ids: schoolIds },
+          success: function(){
+            $.notify({ message: '操作成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $modal = $('.modal.admin-upload-file-modal');
+  if ($modal.length > 0) {
+    var $form = $modal.find('form.admin-upload-file-form')
+    var $sourceIdInput = $modal.find('input[name="source_id"]');
+    var $sourceTypeInput = $modal.find('input[name="source_type"]');
+    var $suffixInput = $modal.find('input[name="suffix"]');
+
+    $modal.on('show.bs.modal', function(event){
+      var $link = $(event.relatedTarget);
+      var sourceId = $link.data('sourceId');
+      var sourceType = $link.data('sourceType');
+      var suffix = $link.data('suffix');
+
+      $sourceIdInput.val(sourceId);
+      $sourceTypeInput.val(sourceType);
+      if(suffix != undefined){ $suffixInput.val(suffix); }
+
+      $modal.find('.upload-file-input').trigger('click');
+    });
+
+    $modal.find('.upload-file-input').on('change', function(e){
+      var file = $(this)[0].files[0];
+
+      if(file){
+        $modal.find('.file-names').html(file.name);
+        $modal.find('.submit-btn').trigger('click');
+      }
+    })
+
+    var formValid = function(){
+      if($form.find('input[name="file"]').val() == undefined || $form.find('input[name="file"]').val().length == 0){
+        $form.find('.error').html('请选择文件');
+        return false;
+      }
+
+      return true;
+    };
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if (formValid()) {
+        var formDataString = $form.serialize();
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/files?' + formDataString,
+          data: new FormData($form[0]),
+          processData: false,
+          contentType: false,
+          success: function(data){
+            $.notify({ message: '上传成功' });
+            $modal.find('.file-names').html('');
+            $modal.trigger('upload:success', data);
+            $modal.modal('hide');
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-professional-authentications-index-page').length > 0) {
+    var $searchFrom = $('.professional-authentication-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $('.batch-action-container').hide();
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $('.batch-action-container').show();
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+
+    $('.batch-agree-btn').on('click', function(){
+      if($('.batch-check-box:checked').length === 0){
+        $.notify({ message: '请先选择数据' }, { type: 'info' });
+        return;
+      }
+
+      customConfirm({
+        content: '确认审核通过？',
+        ok: function(){
+          var ids = $('.batch-check-box:checked').map(function(_, e){ return $(e).val() }).get();
+
+          $.ajax({
+            url: '/admins/professional_authentications/batch_agree',
+            method: 'POST',
+            dataType: 'json',
+            data: { ids: ids },
+            success: function(data){
+              $.notify({ message: '操作成功' });
+              window.location.reload();
+            },
+            error: function(res){
+              $.notify({ message: res.responseJSON.message }, { type: 'danger' });
+            }
+          })
+        }
+      })
+    })
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-project-package-applies-index-page').length > 0) {
+    var $searchFrom = $('.project-package-applies-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('all');
+
+      if($link.data('value') === 'all'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-projects-index-page').length > 0) {
+        var $form = $('.search-form');
+
+        // 清空
+        $form.on('click', '.clear-btn', function () {
+            $form.find('input[name="search"]').val('');
+            $form.find('input[type="submit"]').trigger('click');
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-repertoires-index-page').length > 0) {
+
+        // ============== 新建 ===============
+        var $modal = $('.modal.admin-create-repertoire-modal');
+        var $form = $modal.find('form.admin-create-repertoire-form');
+        var $nameInput = $form.find('input[name="name"]');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: {
+                    required: true
+                }
+            }
+        });
+
+        // modal ready fire
+        $modal.on('show.bs.modal', function () {
+            $nameInput.val('');
+        });
+
+        $modal.on('click', '.submit-btn', function(){
+            $form.find('.error').html('');
+
+            if ($form.valid()) {
+                var url = $form.data('url');
+
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $modal.modal('hide');
+
+                        setTimeout(function(){
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            }
+        });
+
+        $(".repertoire-list-container").on("change", '.repertoire-source-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/repertoires/" + s_id,
+                type: "PUT",
+                dataType:'script',
+                data: json
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-salesman-channels-index-page').length > 0) {
+
+        // ============= 添加销售人员 ==============
+        var $addMemberModal = $('.admin-add-salesman-channel-user-modal');
+        var $addMemberForm = $addMemberModal.find('.admin-add-salesman-channel-user-form');
+        var $memberSelect = $addMemberModal.find('.salesman-channel-user-select');
+        var $form = $addMemberModal.find('form.admin-add-salesman-user-form');
+
+        // 搜索
+        var searchscForm = $(".saleman-channel-list-form .search-form");
+
+
+        $addMemberModal.on('show.bs.modal', function(event){
+            $memberSelect.select2('val', ' ');
+        });
+
+        $memberSelect.select2({
+            theme: 'bootstrap4',
+            placeholder: '请输入要添加的单位',
+            multiple: true,
+            minimumInputLength: 1,
+            ajax: {
+                delay: 500,
+                url: '/admins/schools',
+                dataType: 'json',
+                data: function(params){
+                    return { keyword: params.term };
+                },
+                processResults: function(data){
+                    return { results: data.schools }
+                }
+            },
+            templateResult: function (item) {
+                if(!item.id || item.id === '') return '';
+                return $("<span>" + item.name  + "</span>");
+            },
+            templateSelection: function(item){
+                if (item.id) {
+                }
+                return item.name || '';
+            }
+        });
+
+        $addMemberModal.on('click', '.submit-btn', function(){
+            $addMemberForm.find('.error').html('');
+
+            // var salesmanId = $salesmanIdInput.val();
+            var memberIds = $memberSelect.val();
+            if (memberIds && memberIds.length > 0) {
+                var url = $form.data('url');
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $addMemberModal.modal('hide');
+                        searchscForm.find('input[name="keyword"]').val('');
+
+                        setTimeout(function(){
+                            submitForm();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $addMemberForm.find('.error').html(data.message);
+                    }
+                });
+            } else {
+                $addMemberModal.modal('hide');
+            }
+        });
+
+
+        // 清空
+        searchscForm.on('click', '.clear-btn', function () {
+            searchscForm.find('.start_date').val('');
+            searchscForm.find('.end_date').val('').trigger('change');
+            searchscForm.find('input[name="keyword"]').val('');
+        });
+
+        // 时间跨度
+        var baseOptions = {
+            autoclose: true,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd',
+            startDate: '2017-04-01'
+        };
+
+        var defineDateRangeSelect = function(element){
+            var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, baseOptions);
+            $(element).datepicker(options);
+
+            $(element).find('.start-date').datepicker().on('changeDate', function(e){
+                $(element).find('.end-date').datepicker('setStartDate', e.date);
+            });
+        };
+
+        defineDateRangeSelect('.grow-date-input-daterange');
+
+
+        // 区间搜索
+        searchscForm.on('click', ".search-btn", function(){
+            submitForm();
+        });
+
+        var submitForm = function(){
+            var url =  searchscForm.data('search-form-url');
+            var form = searchscForm;
+            $.ajax({
+                url: url,
+                data: form.serialize(),
+                dataType: "script"
+            })
+        };
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-salesman-customers-index-page').length > 0) {
+
+        // ============= 添加销售人员 ==============
+        var $addMemberModal = $('.admin-add-salesman-customer-user-modal');
+        var $addMemberForm = $addMemberModal.find('.admin-add-salesman-customer-user-form');
+        var $memberSelect = $addMemberModal.find('.salesman-customer-user-select');
+        var $salesmanIdInput = $('.salesman-customer-list-form').find(".btn-primary");
+
+        $addMemberModal.on('show.bs.modal', function(event){
+            var $link = $(event.relatedTarget);
+            // var salesmanId = $link.data('salesman_id');
+            // $salesmanIdInput.val(salesmanId);
+
+            $memberSelect.select2('val', ' ');
+        });
+
+        $memberSelect.select2({
+            theme: 'bootstrap4',
+            placeholder: '请输入要添加的销售姓名',
+            multiple: true,
+            minimumInputLength: 1,
+            ajax: {
+                delay: 500,
+                url: '/admins/users',
+                dataType: 'json',
+                data: function(params){
+                    return { name: params.term };
+                },
+                processResults: function(data){
+                    return { results: data.users }
+                }
+            },
+            templateResult: function (item) {
+                if(!item.id || item.id === '') return item.text;
+                return $("<span>" + item.real_name + " <span class='font-12'>" + item.school_name + ' ' + item.hidden_phone + "</span></span>");
+            },
+            templateSelection: function(item){
+                if (item.id) {
+                }
+                return item.real_name || item.text;
+            }
+        });
+
+        $addMemberModal.on('click', '.submit-btn', function(){
+            $addMemberForm.find('.error').html('');
+
+            // var salesmanId = $salesmanIdInput.val();
+            var memberIds = $memberSelect.val();
+            if (memberIds && memberIds.length > 0) {
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: '/admins/salesman_customers/batch_add',
+                    data: { salesman_id: $salesmanIdInput.data("salesman-id"), user_ids: memberIds },
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $addMemberModal.modal('hide');
+
+                        setTimeout(function(){
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            } else {
+                $addMemberModal.modal('hide');
+            }
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+    if ($('body.admins-salesmans-index-page').length > 0) {
+
+        // ============= 添加销售人员 ==============
+        var $addMemberModal = $('.admin-add-salesman-user-modal');
+        var $addMemberForm = $addMemberModal.find('.admin-add-salesman-user-form');
+        var $memberSelect = $addMemberModal.find('.salesman-user-select');
+        // var $salesmanIdInput = $addMemberForm.find('input[name="salesman_id"]')
+
+        $addMemberModal.on('show.bs.modal', function(event){
+            var $link = $(event.relatedTarget);
+            // var salesmanId = $link.data('salesman-id');
+            // $salesmanIdInput.val(salesmanId);
+
+            $memberSelect.select2('val', ' ');
+        });
+
+        $memberSelect.select2({
+            theme: 'bootstrap4',
+            placeholder: '请输入要添加的销售姓名',
+            multiple: true,
+            minimumInputLength: 1,
+            ajax: {
+                delay: 500,
+                url: '/admins/users',
+                dataType: 'json',
+                data: function(params){
+                    return { name: params.term };
+                },
+                processResults: function(data){
+                    return { results: data.users }
+                }
+            },
+            templateResult: function (item) {
+                if(!item.id || item.id === '') return item.text;
+                return $("<span>" + item.real_name + " <span class='font-12'>" + item.school_name + ' ' + item.hidden_phone + "</span></span>");
+            },
+            templateSelection: function(item){
+                if (item.id) {
+                }
+                return item.real_name || item.text;
+            }
+        });
+
+        $addMemberModal.on('click', '.submit-btn', function(){
+            $addMemberForm.find('.error').html('');
+
+            // var salesmanId = $salesmanIdInput.val();
+            var memberIds = $memberSelect.val();
+            if (memberIds && memberIds.length > 0) {
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: '/admins/salesmans/batch_add',
+                    data: { user_ids: memberIds },
+                    success: function(){
+                        $.notify({ message: '创建成功' });
+                        $addMemberModal.modal('hide');
+
+                        setTimeout(function(){
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function(res){
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            } else {
+                $addMemberModal.modal('hide');
+            }
+        });
+
+        $(".salesman-list-container").on("change", '.salesman-sync-course', function () {
+            var s_id = $(this).attr("data-id");
+            var json = {};
+            $.ajax({
+                url: "/admins/salesmans/" + s_id + "/update_sync_course",
+                type: "POST",
+                dataType:'script',
+                data: json
+            })
+        });
+
+        $(".salesman-list-container").on("change", '.salesman-sync-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/salesmans/" + s_id,
+                type: "PUT",
+                dataType:'script',
+                data: json
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function(){
+  if ($('body.admins-school-statistics-index-page').length > 0) {
+    var searchForm = $(".school-statistic-list-form .search-form");
+    var growFormUrl = searchForm.data('grow-form-url');
+    var contrastFormUrl = searchForm.data('contrast-form-url');
+
+    var dataTypeInput = searchForm.find("input[name='data_type']");
+    var keywordInput = searchForm.find("input[name='keyword']");
+    var contrastBtn = searchForm.find(".contrast-btn");
+    var growBtn = searchForm.find(".grow-btn");
+    var contrastDateContainer = searchForm.find('.contrast-date-container');
+    var growDateContainer = searchForm.find('.grow-date-container');
+
+    // 数据对比日期输入框
+    var beginDateInput = searchForm.find("input[name='begin_date']");
+    var endDateInput = searchForm.find("input[name='end_date']");
+    var otherBeginDateInput = searchForm.find("input[name='other_begin_date']");
+    var otherEndDateInput = searchForm.find("input[name='other_end_date']");
+
+    // 新增数据日期输入框
+    var growBeginDateInput = searchForm.find("input[name='grow_begin_date']");
+    var growEndDateInput = searchForm.find("input[name='grow_end_date']");
+
+    // 数据展示切换: 数据对比、新增数据
+    searchForm.on('click', ".contrast-btn", function(){
+      if(contrastBtn.hasClass("active")) { return }
+      changeDataType("contrast");
+      submitForm();
+    });
+    searchForm.on('click', ".grow-btn", function(){
+      if(growBtn.hasClass("active")) { return }
+      changeDataType("grow");
+      submitForm();
+    });
+
+    // 搜索按钮
+    searchForm.on('click', ".search-btn", function(){
+      console.log('submit');
+      submitForm();
+    });
+
+    $('.school-statistic-list-container').on('change', '.contrast-column-select', function() {
+      searchForm.find("input[name='contrast_column']").val($('.contrast-column-select').val());
+      submitForm();
+    });
+
+    var submitForm = function(){
+      if(!validateFrom()) { return }
+
+      var form = searchForm;
+      var url = dataTypeInput.val() == "contrast" ? contrastFormUrl : growFormUrl;
+
+      $.ajax({
+        url: url,
+        data: form.serialize(),
+        dataType: "script"
+      })
+    };
+
+    var validateFrom = function(){
+      if (dataTypeInput.val() != "contrast") { return true; }
+
+      // 全部为空时，需要展示空数据页
+      if (beginDateInput.val() == "" && endDateInput.val() == "" &&
+        otherBeginDateInput.val() == "" && otherBeginDateInput.val() == "") {
+        return true;
+      }
+
+      if (beginDateInput.val() != "" && endDateInput.val() != "" &&
+        otherBeginDateInput.val() != "" && otherBeginDateInput.val() != "") {
+        return true;
+      }
+
+      return false;
+    };
+
+    var changeDataType = function(dataType){
+      if (dataTypeInput.val() == dataType) { return }
+
+      if (dataType == "contrast") {
+        contrastBtn.addClass("active");
+        growBtn.removeClass("active");
+        dataTypeInput.val('contrast');
+        growDateContainer.hide();
+        contrastDateContainer.show();
+
+        clearGrowDateInput();
+      } else {
+        contrastBtn.removeClass("active");
+        growBtn.addClass("active");
+        dataTypeInput.val('grow');
+        growDateContainer.show();
+        contrastDateContainer.hide();
+
+        clearContrastDateInput();
+      }
+    };
+
+    var clearGrowDateInput = function() {
+      searchForm.find("input[name='grow_begin_date']").val('');
+      searchForm.find("input[name='grow_end_date']").val('');
+      searchForm.find("input[name='grow_date_input']").val('');
+    };
+
+    var clearContrastDateInput = function(){
+      searchForm.find("input[name='begin_date']").val('');
+      searchForm.find("input[name='end_date']").val('');
+      searchForm.find("input[name='other_begin_date']").val('');
+      searchForm.find("input[name='other_end_date']").val('');
+      searchForm.find("input[name='date_input']").val('');
+      searchForm.find("input[name='other_date_input']").val('');
+    };
+
+    var baseOptions = {
+      autoclose: true,
+      language: 'zh-CN',
+      format: 'yyyy-mm-dd',
+      startDate: '2017-04-01',
+      endDate: '-1d'
+    }
+
+    var defineDateRangeSelect = function(element){
+      var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, baseOptions);
+      $(element).datepicker(options);
+
+      $(element).find('.start-date').datepicker().on('changeDate', function(e){
+        $(element).find('.end-date').datepicker('setStartDate', e.date);
+      })
+    };
+
+    defineDateRangeSelect('.grow-date-input-daterange');
+    defineDateRangeSelect('.date-input-daterange');
+    defineDateRangeSelect('.other-date-input-daterange');
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-schools-index-page').length > 0) {
+  }
+});
+$(document).on('turbolinks:load', function() {
+  var $tabs = $('.search-form-container .search-form-tabs');
+  if ($tabs.length > 0) {
+    $tabs.on('click', '.search-form-tab', function(){
+      var $activeTab = $(this);
+      $tabs.find('.search-form-tab').removeClass('active');
+      $activeTab.addClass('active');
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-shixun-authorizations-index-page').length > 0) {
+    var $searchFrom = $('.shixun-authorization-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function(){
+    if ($('body.admins-shixun-feedback-messages-index-page').length > 0) {
+
+        $(".content-img img").addClass("w-20").addClass("preview-image");
+
+        var baseOptions = {
+            autoclose: true,
+            language: 'zh-CN',
+            format: 'yyyy-mm-dd 00:00:00',
+            startDate: '2017-04-01'
+        };
+
+        var defineDateRangeSelect = function(element){
+            var options = $.extend({inputs: $(element).find('.start-date, .end-date')}, baseOptions);
+            $(element).datepicker(options);
+
+            $(element).find('.start-date').datepicker().on('changeDate', function(e){
+                $(element).find('.end-date').datepicker('setStartDate', e.date);
+            });
+        };
+
+        defineDateRangeSelect('.grow-date-input-daterange');
+    }
+});
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-shixun-modify-records-index-page').length > 0) {
+        var $form = $('.search-form');
+
+        // 清空
+        $form.on('click', '.clear-btn', function () {
+            $form.find('select[name="date"]').val('weekly');
+            $form.find('input[name="user_name"]').val('');
+            $form.find('input[type="submit"]').trigger('click');
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-shixun-settings-index-page').length > 0) {
+    let searchContainer = $(".shixun-settings-list-form");
+    let searchForm = $("form.search-form",searchContainer);
+
+    searchContainer.on('change', '.shixun-settings-select', function(){
+      searchForm.find('input[type="submit"]').trigger('click');
+    });
+
+    //导出
+    searchContainer.on('click',"#shixun-settings-export",function () {
+      window.location.href = "/admins/shixun_settings.xls?" + searchForm.serialize();
+    });
+
+    // 基础数据导出
+      searchContainer.on('click', "#shixun-settings-base-export", function () {
+          window.location.href = "/admins/shixun_settings.xls?base_data=1" + searchForm.serialize();
+      });
+
+   $(".shixun-settings-list-container").on("change", '.shixun-setting-form', function () {
+     var s_id = $(this).attr("data-id");
+     var s_value = $(this).val();
+     var s_name = $(this).attr("name");
+     var json = {};
+     var s_index = $(this).parent("td").siblings(".shixun-line-no").text();
+     json[s_name] = s_value;
+     json["page_no"] = s_index;
+     $.ajax({
+       url: "/admins/shixun_settings/" + s_id,
+       type: "PUT",
+       dataType:'script',
+       data: json
+     });
+   });
+
+      $(".shixun-settings-list-container").on("change", '.repertoire-setting-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/shixun_settings/" + s_id + "/update_tag_repertoires",
+              type: "POST",
+              dataType:'script',
+              data: json
+          });
+      });
+
+   $("select#settings-tag-choosed").select2({
+     placeholder: "请选择分类",
+     allowClear: true
+   });
+
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      if(data.suffix == '_weapp'){
+        var $imageElement = $('.shixun-weapp-image-' + data.source_id);
+        $imageElement.attr('src', data.url);
+        $imageElement.show();
+        $imageElement.next().html('重新上传');
+      } else {
+        var $imageElement = $('.shixun-image-' + data.source_id);
+        $imageElement.attr('src', data.url);
+        $imageElement.show();
+        $imageElement.next().html('重新上传');
+      }
+    })
+  }
+});
+
+$(document).on('turbolinks:load', function() {
+  if($('body.admins-shixuns-index-page').length > 0){
+    $('select#tag-choosed').select2({
+      placeholder: "请选择分类",
+      allowClear: true
+    });
+
+    var search_form = $(".search-form");
+    //导出
+    $(".shixuns-list-form").on("click","#shixuns-export",function () {
+      window.location.href = "/admins/shixuns.xls?" + search_form.serialize();
+    });
+  }
+});
+$(document).on('turbolinks:load', function(){
+  $('#sidebarCollapse').on('click', function () {
+    $(this).toggleClass('active');
+    $('#sidebar').toggleClass('active');
+    $.cookie('admin_sidebar_collapse', $(this).hasClass('active'), {path: '/admins'});
+  });
+
+  var sidebarController = $('#sidebar').data('current-controller');
+  if (sidebarController.length > 0) {
+    $('#sidebar a.active').removeClass('active');
+    $('#sidebar ul.collapse.show').removeClass('show');
+    var activeLi = $('#sidebar a[data-controller="' + sidebarController + '"]');
+    activeLi.addClass('active');
+    activeLi.parent().parent('ul.collapse').addClass('show');
+  }
+});
+$(document).on('turbolinks:load', function () {
+    if ($('body.admins-sub-disciplines-index-page').length > 0) {
+
+        // ============== 新建 ===============
+        var $modal = $('.modal.admin-create-sub-discipline-modal');
+        var $form = $modal.find('form.admin-create-sub-discipline-form');
+        var $nameInput = $form.find('input[name="name"]');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: {
+                    required: true
+                }
+            }
+        });
+
+        // modal ready fire
+        $modal.on('show.bs.modal', function () {
+            $nameInput.val('');
+        });
+
+        $modal.on('click', '.submit-btn', submit_create_form);
+
+        $nameInput.keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_create_form();
+                return false;
+            }
+        });
+
+        function submit_create_form() {
+            $form.find('.error').html('');
+
+            if ($form.valid()) {
+                var url = $form.data('url');
+
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function () {
+                        $.notify({message: '创建成功'});
+                        $modal.modal('hide');
+
+                        setTimeout(function () {
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function (res) {
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            }
+        }
+
+        $(".sub-discipline-list-container").on("change", '.sub-discipline-source-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/sub_disciplines/" + s_id,
+                type: "PUT",
+                dataType: 'script',
+                data: json
+            });
+        });
+        // ------------ 上移/下移 -------------
+        $('.sub-discipline-list-container').on('click', ".move-action", function () {
+            var $doAction = $(this);
+
+            var objectId = $doAction.data('id');
+            var opr = $doAction.data('opr');
+            $.ajax({
+                url: '/admins/sub_disciplines/' + objectId + '/adjust_position',
+                method: 'POST',
+                dataType: 'script',
+                data: {opr: opr}
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-sub-repertoires-index-page').length > 0) {
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-sub-repertoire-modal');
+    var $form = $modal.find('form.admin-create-sub-repertoire-form');
+    var $nameInput = $form.find('input[name="name"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        name: {
+          required: true
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $nameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+      $(".sub-repertoire-list-container").on("change", '.sub-repertoire-source-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/sub_repertoires/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-subject-authorizations-index-page').length > 0) {
+    var $searchFrom = $('.subject-authorization-list-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('processed');
+
+      if($link.data('value') === 'processed'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-subject-settings-index-page').length > 0) {
+		var $form = $('.subject-setting-list-form');
+
+		// ************** 学校选择 *************
+		$form.find('.school-select').select2({
+			theme: 'bootstrap4',
+			placeholder: '请选择创建者单位',
+			minimumInputLength: 1,
+			ajax: {
+				delay: 500,
+				url: '/api/schools/search.json',
+				dataType: 'json',
+				data: function (params) {
+					return {keyword: params.term};
+				},
+				processResults: function (data) {
+					return {results: data.schools}
+				}
+			},
+			templateResult: function (item) {
+				if (!item.id || item.id === '') return item.text;
+				return item.name;
+			},
+			templateSelection: function (item) {
+				if (item.id) {
+				}
+				return item.name || item.text;
+			}
+		});
+
+
+        $(".subject-setting-list-container").on("change", '.subject-setting-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/subject_settings/" + s_id,
+                type: "PUT",
+                dataType:'script',
+                data: json
+            })
+        });
+
+		// 清空
+		$form.on('click', '.clear-btn', function () {
+			$form.find('select[name="status"]').val('');
+			$form.find('.school-select').val('').trigger('change');
+			$form.find('input[name="keyword"]').val('');
+			$form.find('#homepage_show').attr('checked', false);
+			$form.find('#excellent').attr('checked', false);
+			$form.find('input[type="submit"]').trigger('click');
+		});
+
+		// 上传图片
+		$('.modal.admin-upload-file-modal').on('upload:success', function (e, data) {
+            if(data.suffix == '_qrcode'){
+                var $imageElement = $('.subject-weapp-image-' + data.source_id);
+                $imageElement.attr('src', data.url);
+                $imageElement.show();
+                $imageElement.next().html('重新上传');
+            } else {
+                var $imageElement = $('.subject-image-' + data.source_id);
+                $imageElement.attr('src', data.url);
+                $imageElement.show();
+                $imageElement.next().html('重新上传');
+            }
+		});
+	}
+});
+$(document).on('turbolinks:load', function () {
+	if ($('body.admins-subjects-index-page').length > 0) {
+		var $form = $('.subject-list-form');
+
+		// ************** 学校选择 *************
+		$form.find('.school-select').select2({
+			theme: 'bootstrap4',
+			placeholder: '请选择创建者单位',
+			minimumInputLength: 1,
+			ajax: {
+				delay: 500,
+				url: '/api/schools/search.json',
+				dataType: 'json',
+				data: function (params) {
+					return {keyword: params.term};
+				},
+				processResults: function (data) {
+					return {results: data.schools}
+				}
+			},
+			templateResult: function (item) {
+				if (!item.id || item.id === '') return item.text;
+				return item.name;
+			},
+			templateSelection: function (item) {
+				if (item.id) {
+				}
+				return item.name || item.text;
+			}
+		});
+
+		// 清空
+		$form.on('click', '.clear-btn', function () {
+			$form.find('select[name="status"]').val('');
+			$form.find('.school-select').val('').trigger('change');
+			$form.find('input[name="keyword"]').val('');
+			$form.find('#homepage_show').attr('checked', false);
+			$form.find('#excellent').attr('checked', false);
+			$form.find('input[type="submit"]').trigger('click');
+		});
+
+		// 定义状态切换监听事件
+		var defineStatusChangeFunc = function (doElement, undoElement, url, callback) {
+			$('.subject-list-container').on('click', doElement, function () {
+				var $doAction = $(this);
+				var $undoAction = $doAction.siblings(undoElement);
+
+				var subjectId = $doAction.data('id');
+				customConfirm({
+					content: '确认进行该操作吗？',
+					ok: function () {
+						$.ajax({
+							url: '/admins/subjects/' + subjectId + url,
+							method: 'POST',
+							dataType: 'json',
+							success: function () {
+								show_success_flash();
+								$doAction.hide();
+								$undoAction.show();
+								if (callback && typeof callback === "function") {
+									callback(subjectId, url);
+								}
+							}
+						});
+					}
+				});
+			});
+		}
+		// 隐藏与取消隐藏
+		defineStatusChangeFunc('.hide-action', '.active-action', '/hide');
+		defineStatusChangeFunc('.active-action', '.hide-action', '/cancel_hide');
+
+		// 首页展示与取消首页展示
+		var homepageShowCallback = function (subjectId, url) {
+			var $subjectItem = $('.subject-list-container').find('.subject-item-' + subjectId);
+
+			if (url === '/homepage_show') {
+				$subjectItem.find('.homepage-show-badge').show();
+			} else {
+				$subjectItem.find('.homepage-show-badge').hide();
+			}
+		}
+		defineStatusChangeFunc('.homepage-show-action', '.homepage-hide-action', '/homepage_show', homepageShowCallback);
+		defineStatusChangeFunc('.homepage-hide-action', '.homepage-show-action', '/cancel_homepage_show', homepageShowCallback);
+
+		// 设为金课与取消金课
+		var excellentCallback = function (subjectId, url) {
+			var $subjectItem = $('.subject-list-container').find('.subject-item-' + subjectId);
+
+			if (url === '/excellent') {
+				$subjectItem.find('.excellent-badge').show();
+			} else {
+				$subjectItem.find('.excellent-badge').hide();
+			}
+		}
+		defineStatusChangeFunc('.excellent-action', '.cancel-excellent-action', '/excellent', excellentCallback);
+		defineStatusChangeFunc('.cancel-excellent-action', '.excellent-action', '/cancel_excellent', excellentCallback);
+	}
+});
+$(document).on('turbolinks:load', function () {
+    if ($('body.admins-tag-disciplines-index-page').length > 0) {
+
+        // ============== 新建 ===============
+        var $modal = $('.modal.admin-create-tag-discipline-modal');
+        var $form = $modal.find('form.admin-create-tag-discipline-form');
+        var $nameInput = $form.find('input[name="name"]');
+
+        $form.validate({
+            errorElement: 'span',
+            errorClass: 'danger text-danger',
+            rules: {
+                name: {
+                    required: true
+                }
+            }
+        });
+
+        // modal ready fire
+        $modal.on('show.bs.modal', function () {
+            $nameInput.val('');
+        });
+
+        $modal.on('click', '.submit-btn', submit_create_form);
+
+        $nameInput.keydown(function (e) {
+            var ev = e || event;
+            var keycode = ev.which || ev.keyCode;
+            if (keycode == 13) {
+                submit_create_form();
+                return false;
+            }
+        });
+
+        function submit_create_form() {
+            $form.find('.error').html('');
+
+            if ($form.valid()) {
+                var url = $form.data('url');
+
+                $.ajax({
+                    method: 'POST',
+                    dataType: 'json',
+                    url: url,
+                    data: $form.serialize(),
+                    success: function () {
+                        $.notify({message: '创建成功'});
+                        $modal.modal('hide');
+
+                        setTimeout(function () {
+                            window.location.reload();
+                        }, 500);
+                    },
+                    error: function (res) {
+                        var data = res.responseJSON;
+                        $form.find('.error').html(data.message);
+                    }
+                });
+            }
+        }
+
+        $(".tag-discipline-list-container").on("change", '.tag-discipline-source-form', function () {
+            var s_id = $(this).attr("data-id");
+            var s_value = $(this).val();
+            var s_name = $(this).attr("name");
+            var json = {};
+            json[s_name] = s_value;
+            $.ajax({
+                url: "/admins/tag_disciplines/" + s_id,
+                type: "PUT",
+                dataType: 'script',
+                data: json
+            });
+        });
+
+        // ------------ 上移/下移 -------------
+        $('.tag-discipline-list-container').on('click', ".move-action", function () {
+            var $doAction = $(this);
+
+            var objectId = $doAction.data('id');
+            var opr = $doAction.data('opr');
+            $.ajax({
+                url: '/admins/tag_disciplines/' + objectId + '/adjust_position',
+                method: 'POST',
+                dataType: 'script',
+                data: {opr: opr}
+            });
+        });
+    }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-tag-repertoires-index-page').length > 0) {
+
+    // ============== 新建 ===============
+    var $modal = $('.modal.admin-create-tag-repertoire-modal');
+    var $form = $modal.find('form.admin-create-tag-repertoire-form');
+    var $nameInput = $form.find('input[name="name"]');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        name: {
+          required: true
+        }
+      }
+    });
+
+    // modal ready fire
+    $modal.on('show.bs.modal', function () {
+        $nameInput.val('');
+    });
+
+    $modal.on('click', '.submit-btn', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var url = $form.data('url');
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: url,
+          data: $form.serialize(),
+          success: function(){
+            $.notify({ message: '创建成功' });
+            $modal.modal('hide');
+
+            setTimeout(function(){
+              window.location.reload();
+            }, 500);
+          },
+          error: function(res){
+            var data = res.responseJSON;
+            $form.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+
+      $(".tag-repertoire-list-container").on("change", '.tag-repertoire-source-form', function () {
+          var s_id = $(this).attr("data-id");
+          var s_value = $(this).val();
+          var s_name = $(this).attr("name");
+          var json = {};
+          json[s_name] = s_value;
+          $.ajax({
+              url: "/admins/tag_repertoires/" + s_id,
+              type: "PUT",
+              dataType:'script',
+              data: json
+          });
+      });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-user-statistics-index-page').length > 0) {
+    var $form = $('.user-statistic-list-form');
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    }
+
+    var defineSchoolSelect = function (schools) {
+      $form.find('.school-select').select2({
+        theme: 'bootstrap4',
+        placeholder: '选择学校/单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $form.find('#school_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+
+    // 初始化学校选择器
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    // 清空
+    $form.on('click', '.clear-btn', function(){
+      $form.find('select[name="date"]').val('');
+      $form.find('.school-select').val('').trigger('change');
+      $form.find('input[type="submit"]').trigger('click');
+    })
+
+
+    // 导出
+    $('.export-action').on('click', function(){
+      var form = $(".user-statistic-list-form .search-form")
+      var exportLink = $(this);
+      var date = form.find("select[name='date']").val();
+      var schoolId = form.find('input[name="school_id"]').val();
+
+      var url = exportLink.data("url").split('?')[0] + "?date=" + date + "&school_id=" + schoolId;
+      window.open(url);
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-users-edit-page, body.admins-users-update-page').length > 0) {
+    var initDepartmentSelect = true;
+
+    // ************** 学校选择 *************
+    var matcherFunc = function(params, data){
+      if ($.trim(params.term) === '') {
+        return data;
+      }
+      if (typeof data.text === 'undefined') {
+        return null;
+      }
+
+      if (data.name && data.name.indexOf(params.term) > -1) {
+        var modifiedData = $.extend({}, data, true);
+        return modifiedData;
+      }
+
+      // Return `null` if the term should not be displayed
+      return null;
+    }
+
+    var defineSchoolSelect = function (schools) {
+      $('.school-select').select2({
+        theme: 'bootstrap4',
+        placeholder: '查询学校/单位',
+        minimumInputLength: 1,
+        data: schools,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#user_school_id').val(item.id);
+            getDepartmentsData(item.id, defineDepartmentSelect2);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+    var defineDepartmentSelect2 = function(departments){
+      departments.unshift({ id: '-1', name: '未选择' }); // 可不选
+
+      if (!initDepartmentSelect) { $('.department-select').empty(); } // 为了能够回填部门
+      initDepartmentSelect = false;
+
+      $('.department-select').select2({
+        theme: 'bootstrap4',
+        placeholder: '查询学院/部门',
+        minimumInputLength: 0,
+        data: departments,
+        templateResult: function (item) {
+          if(!item.id || item.id === '') return item.text;
+          return item.name;
+        },
+        templateSelection: function(item){
+          if (item.id) {
+            $('#user_department_id').val(item.id);
+          }
+          return item.name || item.text;
+        },
+        matcher: matcherFunc
+      });
+    };
+
+    var getDepartmentsData = function(school_id, callback){
+      $.ajax({
+        url: '/api/schools/' + school_id + '/departments/for_option.json',
+        dataType: 'json',
+        type: 'GET',
+        success: function(data) {
+          callback(data.departments);
+        }
+      })
+    }
+
+    // 初始化学校选择器
+    $.ajax({
+      url: '/api/schools/for_option.json',
+      dataType: 'json',
+      type: 'GET',
+      success: function(data) {
+        defineSchoolSelect(data.schools);
+      }
+    });
+
+    // **************** 地区选择 ****************
+    $('.province-city-select').cxSelect({
+      url: '/javascripts/educoder/province-data.json',
+      selects: ['province-select', 'city-select']
+    });
+
+    // *********** 职业选择 ************
+    var identityData = [
+      {
+        "v": "teacher",
+        "n": "教师",
+        "s": [{"n": "教授", "v": "教授"},{"n": "副教授", "v": "副教授"},{"n": "讲师", "v": "讲师"},{"n": "助教", "v": "助教"}]
+      },
+      {
+        "v": "student",
+        "n": "学生",
+        "s": []
+      },
+      {
+        "v": "professional",
+        "n": "专业人士",
+        "s": [{"n": "企业管理者", "v": "企业管理者"},{"n": "部门管理者", "v": "部门管理者"},{"n": "高级工程师", "v": "高级工程师"},{"n": "工程师", "v": "工程师"},{"n": "助理工程师", "v": "助理工程师"}]
+      }
+    ];
+    $('.user-identity-select').cxSelect({
+      data: identityData,
+      jsonValue: 'v',
+      selects: ['identity-select', 'technical-title-select']
+    });
+    $('.identity-select').on('change', function(){
+      if($(this).val() === 'student'){
+        $('.technical-title-select-wrapper').hide();
+        $('.form-group.user_student_id').show();
+      } else {
+        $('.technical-title-select-wrapper').show();
+        $('.form-group.user_student_id').hide();
+      }
+    })
+
+
+    var $form = $('form.edit_user')
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "user[password]": {
+          required: false,
+          minlength: 5
+        },
+        "user[password_confirmation]": {
+          required: false,
+          minlength: 5,
+          equalTo: "#user_password"
+        },
+      },
+      messages: {
+        "user[password_confirmation]": {
+          equalTo: "两次密码输入不一致"
+        }
+      }
+    })
+
+    $form.submit(function(e){
+      if(!$form.valid()){ e.preventDefault(); }
+    })
+  }
+});
+$(document).on('turbolinks:load', function(){
+  if ($('body.admins-users-index-page').length > 0) {
+
+    var showSuccessNotify = function() {
+      $.notify({
+        message: '操作成功'
+      },{
+        type: 'success'
+      });
+    }
+
+    // lock user
+    $('.users-list-container').on('click', '.lock-action', function(){
+      var $lockAction = $(this);
+      var $unlockAction = $lockAction.siblings('.unlock-action');
+
+      var userId = $lockAction.data('id');
+      customConfirm({
+        content: '确认加锁吗？',
+        ok: function(){
+          $.ajax({
+            url: '/admins/users/' + userId + '/lock',
+            method: 'POST',
+            dataType: 'json',
+            success: function() {
+              showSuccessNotify();
+              $lockAction.hide();
+              $unlockAction.show();
+            }
+          });
+        }
+      });
+    });
+
+    // unlock user
+    $('.users-list-container').on('click', '.unlock-action', function(){
+      var $unlockAction = $(this);
+      var $lockAction = $unlockAction.siblings('.lock-action');
+
+      var userId = $unlockAction.data('id');
+      customConfirm({
+        content: '确认解锁吗？',
+        ok: function () {
+          $.ajax({
+            url: '/admins/users/' + userId + '/unlock',
+            method: 'POST',
+            dataType: 'json',
+            success: function() {
+              showSuccessNotify();
+              $lockAction.show();
+              $unlockAction.hide();
+            }
+          });
+        }
+      })
+    });
+
+    // active user
+    $('.users-list-container').on('click', '.active-action', function(){
+      var $activeAction = $(this);
+      var $unlockAction = $activeAction.siblings('.unlock-action');
+      var $lockAction = $activeAction.siblings('.lock-action');
+
+      var userId = $activeAction.data('id');
+      customConfirm({
+        content: '确认激活吗？',
+        ok: function () {
+          $.ajax({
+            url: '/admins/users/' + userId + '/unlock',
+            method: 'POST',
+            dataType: 'json',
+            success: function() {
+              showSuccessNotify();
+              $activeAction.hide();
+              $lockAction.show();
+              $unlockAction.hide();
+            }
+          });
+        }
+      })
+    });
+
+    // reset user login times
+    $('.users-list-container').on('click', '.reset-login-times-action', function(){
+      var $action = $(this);
+
+      var userId = $action.data('id');
+      $.ajax({
+        url: '/admins/users/' + userId + '/reset_login_times',
+        method: 'POST',
+        dataType: 'json',
+        success: function() {
+          showSuccessNotify();
+        }
+      });
+    });
+
+    // ***************** reward grade modal *****************
+    var $rewardGradeModal = $('.admin-users-reward-grade-modal');
+    var $form = $rewardGradeModal.find('form.admin-users-reward-grade-form');
+
+    $form.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        grade: {
+          required: true,
+          digits: true
+        },
+      }
+    });
+
+    // modal ready fire
+    $rewardGradeModal.on('show.bs.modal', function (event) {
+      var $link = $(event.relatedTarget);
+
+      var userId = $link.data('id');
+      $rewardGradeModal.find('.modal-body input[name="user_id"]').val(userId);
+    });
+    // modal visited fire
+    $rewardGradeModal.on('shown.bs.modal', function(){
+      $rewardGradeModal.find('.modal-body input[name="grade"]').focus();
+    });
+
+    $('.admin-users-reward-grade-modal .submit-btn').on('click', function(){
+      $form.find('.error').html('');
+
+      if ($form.valid()) {
+        var userId = $form.find('input[name="user_id"]').val();
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: "/admins/users/" + userId + "/reward_grade",
+          data: $form.serialize(),
+          success: function(data) {
+            showSuccessNotify();
+            $('.users-list-container .user-item-' + userId + ' td.grade-content').html(data.grade);
+            $rewardGradeModal.modal('hide');
+          },
+          error: function(res) {
+            $rewardGradeModal.find('.error').html(res.responseJSON.message);
+          }
+        });
+      }
+    });
+
+
+    // 导入学生
+    var $importUserModal = $('.modal.admin-import-user-modal');
+    var $importUserForm = $importUserModal.find('form.admin-import-user-form')
+
+    $importUserModal.on('show.bs.modal', function(){
+      resetFileInputFunc($importUserModal.find('.upload-file-input'));
+      $importUserModal.find('.file-names').html('选择文件');
+      $importUserModal.find('.upload-file-input').trigger('click');
+    });
+    $importUserModal.on('change', '.upload-file-input', function(e){
+      var file = $(this)[0].files[0];
+      $importUserModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    var importUserFormValid = function(){
+      if($importUserForm.find('input[name="file"]').val() == undefined || $importUserForm.find('input[name="file"]').val().length == 0){
+        $importUserForm.find('.error').html('请选择文件');
+        return false;
+      }
+
+      return true;
+    };
+
+    var buildResultMessage = function(data){
+      var messageHtml = "<div>导入结果：成功" + data.success + "条，失败"+ data.fail.length + "条</div>";
+
+      if(data.fail.length > 0){
+        messageHtml += '<table class="table"><thead class="thead-light"><tr><th>数据</th><th>失败原因</th></tr></thead><tbody>';
+
+        data.fail.forEach(function(item){
+          messageHtml += '<tr><td>' + item.data + '</td><td>' + item.message + '</td></tr>';
+        });
+
+        messageHtml += '</tbody></table>'
+      }
+
+      return messageHtml;
+    }
+
+    $importUserModal.on('click', '.submit-btn', function(){
+      $importUserForm.find('.error').html('');
+
+      if (importUserFormValid()) {
+        $('body').mLoading({ text: '正在导入...' });
+
+        $.ajax({
+          method: 'POST',
+          dataType: 'json',
+          url: '/admins/import_users',
+          data: new FormData($importUserForm[0]),
+          processData: false,
+          contentType: false,
+          success: function(data){
+            $('body').mLoading('destroy');
+            $importUserModal.modal('hide');
+
+            showMessageModal(buildResultMessage(data), function(){
+              window.location.reload();
+            });
+          },
+          error: function(res){
+            $('body').mLoading('destroy');
+            var data = res.responseJSON;
+            $importUserForm.find('.error').html(data.message);
+          }
+        });
+      }
+    });
+  }
+});
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-video-applies-index-page').length > 0) {
+    var $searchFrom = $('.video-applies-form');
+    $searchFrom.find('select[name="status"]').val('pending');
+
+    $searchFrom.on('click', '.search-form-tab', function(){
+      var $link = $(this);
+
+      $searchFrom.find('input[name="keyword"]').val('');
+      $searchFrom.find('select[name="status"]').val('all');
+
+      if($link.data('value') === 'all'){
+        $searchFrom.find('.status-filter').show();
+      } else {
+        $searchFrom.find('.status-filter').hide();
+        $searchFrom.find('select[name="status"]').val('pending');
+      }
+    });
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-weapp-adverts-index-page').length > 0) {
+    var resetNo = function(){
+      $('#adverts-container .advert-item-no').each(function(index, ele){
+        $(ele).html(index + 1);
+      })
+    }
+
+    // ------------ 保存链接 -----------
+    $('.adverts-card').on('click', '.save-data-btn', function(){
+      var $link = $(this);
+      var id = $link.data('id');
+      var link = $('.advert-item-' + id).find('.link-input').val();
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_adverts/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { link: link },
+        success: function(data){
+          $.notify({ message: '操作成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+    // -------------- 是否在首页展示 --------------
+    $('.adverts-card').on('change', '.online-check-box', function(){
+      var $checkbox = $(this);
+      var id = $checkbox.data('id');
+      var checked = $checkbox.is(':checked');
+      $checkbox.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_adverts/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { online: checked },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          var box = $('.advert-item-' + id).find('.drag');
+          if(checked){
+            box.removeClass('not_active');
+          }else{
+            box.addClass('not_active');
+          }
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $checkbox.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/weapp_adverts/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+          resetNo();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('adverts-container');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-weapp-advert-modal');
+    var $createForm = $createModal.find('form.admin-add-weapp-advert-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "weapp_settings_advert[image]": {
+          required: true
+        }
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $advertItem = $('.advert-item-' + data.source_id);
+      $advertItem.find('.advert-item-img img').attr('src', data.url);
+    })
+
+    // 删除后
+    $(document).on('delete_success', resetNo)
+  }
+})
+;
+$(document).on('turbolinks:load', function() {
+  if ($('body.admins-weapp-carousels-index-page').length > 0) {
+    var resetNo = function(){
+      $('#carousels-container .custom-carousel-item-no').each(function(index, ele){
+        $(ele).html(index + 1);
+      })
+    }
+    // ------------ 保存链接 -----------
+    $('.carousels-card').on('click', '.save-data-btn', function(){
+      var $link = $(this);
+      var id = $link.data('id');
+      var link = $('.custom-carousel-item-' + id).find('.link-input').val();
+      $link.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { link: link },
+        success: function(data){
+          $.notify({ message: '操作成功' });
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $link.removeAttr('disabled');
+        }
+      })
+    });
+    // -------------- 是否在首页展示 --------------
+    $('.carousels-card').on('change', '.online-check-box', function(){
+      var $checkbox = $(this);
+      var id = $checkbox.data('id');
+      var checked = $checkbox.is(':checked');
+      $checkbox.attr('disabled', true);
+
+      $.ajax({
+        url: '/admins/weapp_carousels/' + id,
+        method: 'PATCH',
+        dataType: 'json',
+        data: { online: checked },
+        success: function(data){
+          $.notify({ message: '保存成功' });
+          var box = $('.custom-carousel-item-' + id).find('.drag');
+          if(checked){
+            box.removeClass('not_active');
+          }else{
+            box.addClass('not_active');
+          }
+        },
+        error: ajaxErrorNotifyHandler,
+        complete: function(){
+          $checkbox.removeAttr('disabled');
+        }
+      })
+    });
+
+    // ------------ 拖拽 -------------
+    var onDropFunc = function(el, _target, _source, sibling){
+      var moveId = $(el).data('id');
+      var insertId = $(sibling).data('id') || '';
+
+      $.ajax({
+        url: '/admins/weapp_carousels/drag',
+        method: 'POST',
+        dataType: 'json',
+        data: { move_id: moveId, after_id: insertId },
+        success: function(data){
+          resetNo();
+        },
+        error: function(res){
+          var data = res.responseJSON;
+          $.notify({message: '移动失败，原因：' + data.message}, {type: 'danger'});
+        }
+      })
+    };
+    var ele1 = document.getElementById('carousels-container');
+    dragula([ele1], { mirrorContainer: ele1 }).on('drop', onDropFunc);
+
+
+    // ----------- 新增 --------------
+    var $createModal = $('.modal.admin-add-weapp-carousel-modal');
+    var $createForm = $createModal.find('form.admin-add-weapp-carousel-form');
+
+    $createForm.validate({
+      errorElement: 'span',
+      errorClass: 'danger text-danger',
+      rules: {
+        "weapp_settings_carousel[image]": {
+          required: true
+        }
+      }
+    });
+
+    $createModal.on('show.bs.modal', function(event){
+      resetFileInputFunc($createModal.find('.img-file-input'));
+      $createModal.find('.file-names').html('选择文件');
+    });
+
+    $createModal.on('click', '.submit-btn', function() {
+      $createForm.find('.error').html('');
+
+      if ($createForm.valid()) {
+        $createForm.submit();
+      } else {
+        $createForm.find('.error').html('请选择图片');
+      }
+    });
+    $createModal.on('change', '.img-file-input', function(){
+      var file = $(this)[0].files[0];
+      $createModal.find('.file-names').html(file ? file.name : '请选择文件');
+    })
+
+    // -------------- 重新上传图片 --------------
+    //replace_image_url
+    $('.modal.admin-upload-file-modal').on('upload:success', function(e, data){
+      var $carouselItem = $('.custom-carousel-item-' + data.source_id);
+      $carouselItem.find('.custom-carousel-item-img img').attr('src', data.url);
+    })
+
+    // 删除后
+    $(document).on('delete_success', resetNo)
+  }
+})
+;
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+$.ajaxSetup({
+  beforeSend: function(xhr) {
+    xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
+  }
+});
+
+// ******** select2 global config ********
+$.fn.select2.defaults.set('theme', 'bootstrap4');
+$.fn.select2.defaults.set('language', 'zh-CN');
+
+Turbolinks.setProgressBarDelay(200);
+
+$.notifyDefaults({
+  type: 'success',
+  z_index: 9999,
+  delay: 2000
+});
+
+function show_success_flash(){
+  $.notify({
+    message: '操作成功'
+  },{
+    type: 'success'
+  });
+}
+
+$(document).on('turbolinks:load', function(){
+  $('[data-toggle="tooltip"]').tooltip({ trigger : 'hover' });
+  $('[data-toggle="popover"]').popover();
+
+  // 图片查看大图
+  $('img.preview-image').bootstrapViewer();
+
+  // flash alert提示框自动关闭
+  if($('.admin-alert-container .alert').length > 0){
+    setTimeout(function(){
+      $('.admin-alert-container .alert:not(.alert-danger)').alert('close');
+    }, 2000);
+    setTimeout(function(){
+      $('.admin-alert-container .alert.alert-danger').alert('close');
+    }, 5000);
+  }
+});
+
+$(document).on("turbolinks:before-cache", function () {
+  $('[data-toggle="tooltip"]').tooltip('hide');
+  $('[data-toggle="popover"]').popover('hide');
+});
+// var progressBar = new Turbolinks.ProgressBar();
+
+// $(document).on('ajax:send', function(event){
+//   console.log('ajax send', event);
+//   progressBar.setValue(0)
+//   progressBar.show()
+// });
+//
+// $(document).on('ajax:complete', function(event){
+//   console.log('ajax complete', event);
+//   progressBar.setValue(1)
+//   progressBar.hide() // 分页时不触发，奇怪
+// });
+// $(document).on('ajax:success', function(event){
+//   console.log('ajax success', event);
+// });
+// $(document).on('ajax:error', function(event){
+//   console.log('ajax error', event);
+// });
+
+$(function () {
+});
diff --git a/public/assets/admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js.gz b/public/assets/admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js.gz
new file mode 100644
index 000000000..33977a0c5
Binary files /dev/null and b/public/assets/admin-b8f26db185886f99021da91f0e2c1a8cc4ced4d1b895794751d11b7a9f45de98.js.gz differ
diff --git a/public/react/src/modules/courses/Video/VideoIndex.js b/public/react/src/modules/courses/Video/VideoIndex.js
index 598810759..d490887bf 100644
--- a/public/react/src/modules/courses/Video/VideoIndex.js
+++ b/public/react/src/modules/courses/Video/VideoIndex.js
@@ -55,13 +55,17 @@ class VideoIndex extends Component{
   componentDidMount=()=>{
     const { search } = this.props.location;
     const { page } = this.state;
-
     if(search && search === "?open=live"){
       this.setState({
         type:"live"
       })
       this.checkType("live",page);
     }else{
+      if(search === "?open=new"){
+        this.setState({
+          upload:true
+        })
+      }
       this.checkType("video",page);
     }
   }
@@ -138,10 +142,13 @@ class VideoIndex extends Component{
   }
   uploadVideo=(upload)=>{
     this.setState({
-      upload
+      upload,
+      isSpining:true
     })
     const { page } = this.state;
-    this.getList(page);
+    setTimeout(()=>{
+      this.getList(page);
+    },500)
   }
 
   toUpload =()=> {
diff --git a/public/react/src/modules/courses/new/CoursesNew.js b/public/react/src/modules/courses/new/CoursesNew.js
index 6b613a693..79ae7501f 100644
--- a/public/react/src/modules/courses/new/CoursesNew.js
+++ b/public/react/src/modules/courses/new/CoursesNew.js
@@ -654,8 +654,8 @@ class CoursesNew extends Component {
 												{
 													`
 													body{
-													
-													overflow:hidden !important ;
+														position: relative;
+                            width: calc(100% - 0px) !important ;
 													}
 													`
 												}
diff --git a/public/react/src/modules/user/usersInfo/video/VideoProtocol.js b/public/react/src/modules/user/usersInfo/video/VideoProtocol.js
index a96f2ad22..a3b9ed2be 100644
--- a/public/react/src/modules/user/usersInfo/video/VideoProtocol.js
+++ b/public/react/src/modules/user/usersInfo/video/VideoProtocol.js
@@ -5,17 +5,16 @@ import axios from 'axios'
 import okIcon from './images/ok_border.png'
 
 function VideoProtocol (props) {
-    const theme = useContext(ThemeContext);
     const username = props.match.params.username
-    const { history } = props;
-    
+    const { search } = props.history.location;    
+    const courseId = search && search.split("=")[1];
     return (
         <div className={`educontent videoProtocol`}>
             <CBreadcrumb
                 className="mb26 mt16"
                 separator=" > "
                 items={[
-                    { to: `/users/${username}/videos/upload`, name:  '视频上传'},
+                    { to: `${courseId?`/courses/${courseId}/course_videos?open=new`:`/users/${username}/videos/upload`}`, name:  '视频上传'},
                     { name: '内容上传协议'}
                 ]}
             ></CBreadcrumb>
diff --git a/public/react/src/modules/user/usersInfo/video/VideoUploadList.js b/public/react/src/modules/user/usersInfo/video/VideoUploadList.js
index 60f94e779..ecea2a07d 100644
--- a/public/react/src/modules/user/usersInfo/video/VideoUploadList.js
+++ b/public/react/src/modules/user/usersInfo/video/VideoUploadList.js
@@ -258,9 +258,14 @@ function VideoUploadList (props) {
         dispatch({type: 'updateTitle', title, index})
     }
     // login
-    const protocolLine = <div>上传视频，即表示您已同意
-        <Link to={`/users/${username}/videos/protocol`} style={{color: theme.foreground_select}}>上传内容协议</Link>，不得上传未经他人授权的作品</div>
-    const { flag } = props;
+    const { flag , CourseId } = props;
+    const urls = 
+    flag ? 
+    <Link to={`/users/${username}/videos/protocol?course=${CourseId}`} target="_blank" style={{color: theme.foreground_select}}>上传内容协议</Link>
+    :
+    <Link to={`/users/${username}/videos/protocol`} style={{color: theme.foreground_select}}>上传内容协议</Link>
+    const protocolLine = <div>上传视频，即表示您已同意{urls}，不得上传未经他人授权的作品</div>
+    
     return (
         <div className={flag?"edu-back-white pb100 videoUploadList":"educontent videoUploadList"} style={{ marginBottom: `${flag?"0px":"200px"}` }}>
             <Prompt